index.html

<!DOCTYPE html>
<html lang="el">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="theme-color" content="#173A5E">
<title>Η μέρα μου</title>
<link rel="manifest" href="manifest.json">
<link rel="icon" href="icon.svg" type="image/svg+xml">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,600;0,700;1,500&family=PT+Sans:wght@400;700&display=swap">
<style>
:root{
  --paper:#E8DFC9; --paperDeep:#DBCFB2; --navy:#173A5E; --navySoft:#3B6285;
  --red:#B23A2E; --ink:#14212C; --muted:#6E7A83; --white:#FBF7EC;
  --exam:#6B2D5B; --theory:#A67A1F; --class:#1B6B6B; --office:#4F6B2A;
  --other:#5A6B7A;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:'PT Sans',system-ui,sans-serif;font-size:15px;
  padding-bottom:calc(28px + env(safe-area-inset-bottom))}
button{font-family:inherit;cursor:pointer}

header{background:var(--navy);color:var(--white);padding:14px 16px 15px}
.eyebrow-top{font-size:10px;letter-spacing:2.2px;opacity:.6}
h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:29px;font-weight:700;
  margin:3px 0 0;line-height:1.05}
h1 em{display:block;font-size:19px;font-weight:500;opacity:.72;margin-top:1px}
.hstat{margin-top:9px;font-size:12px;opacity:.8}

main{padding:13px 12px 0}
.eyebrow{display:flex;align-items:baseline;gap:8px;margin:19px 0 7px;padding-left:2px}
.eyebrow:first-child{margin-top:3px}
.eyebrow .rn{font-size:10px;color:var(--red);letter-spacing:.5px;font-weight:700}
.eyebrow .tt{font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;
  font-weight:700;color:var(--navy)}
.eyebrow .ct{margin-left:auto;font-size:10px;letter-spacing:1.4px;
  text-transform:uppercase;color:var(--muted)}

.row{background:var(--white);border:1px solid var(--paperDeep);border-radius:11px;
  padding:11px 13px;margin-bottom:7px;display:flex;gap:12px;
  transition:opacity .35s ease}
.tcol{flex:0 0 50px;padding-top:1px}
.tm{font-size:16px;font-weight:700;color:var(--navy);letter-spacing:-.3px}
.du{font-size:11px;color:var(--muted);margin-top:1px}
.body{flex:1;min-width:0}
.nm{font-family:'Cormorant Garamond',Georgia,serif;font-size:20px;
  font-weight:700;line-height:1.15}
.pl{font-size:13px;color:var(--muted);margin-top:2px}
.tag{display:inline-block;color:#fff;font-size:11px;font-weight:700;
  border-radius:6px;padding:3px 8px;margin-top:6px;letter-spacing:.2px}
.tag.auto{background:var(--navy)} .tag.moto{background:var(--red)}
.tag.exam{background:var(--exam)} .tag.theory{background:var(--theory)}
.tag.class{background:var(--class)} .tag.office{background:var(--office)}
.tag.other{background:var(--other)}
.nx{margin-top:7px;padding-left:10px;border-left:3px solid var(--red);
  font-size:13.5px;line-height:1.4}
.nx b{color:var(--red)}

.row.past{opacity:.38}
.row.past .nm{text-decoration:line-through;text-decoration-thickness:1px}
.row.now{border-color:var(--red);border-width:2px;
  box-shadow:0 2px 9px rgba(178,58,46,.16)}
.nowtag{font-size:9.5px;letter-spacing:1.8px;color:var(--red);
  font-weight:700;margin-bottom:3px}

.task{background:var(--white);border:1px solid var(--paperDeep);border-radius:11px;
  padding:10px 13px;margin-bottom:6px;display:flex;gap:10px;align-items:flex-start}
.pri{flex:0 0 auto;font-size:10px;font-weight:700;border:1.5px solid;
  border-radius:5px;padding:2px 6px;margin-top:1px}
.pri.P1{color:var(--red);border-color:var(--red)}
.pri.P2{color:var(--navy);border-color:var(--navy);opacity:.8}
.pri.dot{color:var(--muted);border-color:var(--paperDeep);padding:2px 7px}
.tx{flex:1;line-height:1.35}
.sub{display:block;font-size:12.5px;color:var(--muted);margin-top:2px}

.state{text-align:center;color:var(--muted);padding:52px 22px;line-height:1.5}
.state .big{font-family:'Cormorant Garamond',Georgia,serif;font-size:21px;
  color:var(--navy);margin-bottom:7px}
.spin{width:24px;height:24px;margin:70px auto 14px;border:3px solid var(--paperDeep);
  border-top-color:var(--navy);border-radius:50%;animation:sp .9s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.cta{display:block;width:100%;max-width:280px;margin:16px auto 0;padding:12px;
  border:none;border-radius:11px;background:var(--navy);color:#fff;
  font-size:15px;font-weight:700}
.quiet{display:block;width:100%;max-width:280px;margin:9px auto 0;padding:11px;
  background:none;border:1px solid var(--paperDeep);border-radius:11px;
  color:var(--muted);font-size:13px}
.foot{display:flex;gap:8px;margin:24px 0 8px}
.foot button{flex:1;padding:9px;background:none;border:1px solid var(--paperDeep);
  border-radius:9px;color:var(--muted);font-size:12px}
.stale{background:#F6E3E0;border:1px solid var(--red);color:var(--red);
  border-radius:10px;padding:9px 12px;margin-bottom:11px;font-size:13px;line-height:1.4}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
</style>
</head>
<body>
<div id="app"><div class="spin"></div></div>

<script>
"use strict";

/* ---------------- Ρυθμίσεις ---------------- */
var APP_KEY  = "u2g80fb2ayn4zri";
var REDIRECT = location.origin + location.pathname;
var LS_TOK   = "mathites:tok";        /* ίδιο κλειδί με την εφαρμογή Μαθητές */
var LS_CACHE = "briefing:cache";
var FILE_PATH = "/briefing.md";       /* μέσα στο App folder */

var MONTHS = ["Ιανουαρίου","Φεβρουαρίου","Μαρτίου","Απριλίου","Μαΐου","Ιουνίου",
  "Ιουλίου","Αυγούστου","Σεπτεμβρίου","Οκτωβρίου","Νοεμβρίου","Δεκεμβρίου"];
var DAYS = ["Κυριακή","Δευτέρα","Τρίτη","Τετάρτη","Πέμπτη","Παρασκευή","Σάββατο"];

var brief = null;
var state = "load";   /* load | ok | noauth | err */
var msg = "";

/* ---------------- Βοηθητικά ---------------- */
function esc(s){
  return String(s==null?"":s).replace(/&/g,"&amp;").replace(/</g,"&lt;")
    .replace(/>/g,"&gt;").replace(/"/g,"&quot;");
}
function todayISO(){
  var d=new Date(), m=d.getMonth()+1, day=d.getDate();
  return d.getFullYear()+"-"+(m<10?"0":"")+m+"-"+(day<10?"0":"")+day;
}
function nowMins(){ var d=new Date(); return d.getHours()*60+d.getMinutes(); }
function toMins(hhmm){
  var p=String(hhmm||"").split(":");
  return (parseInt(p[0],10)||0)*60 + (parseInt(p[1],10)||0);
}

/* ---------------- Dropbox OAuth (PKCE) ---------------- */
function b64url(buf){
  var s = btoa(String.fromCharCode.apply(null, new Uint8Array(buf)));
  return s.replace(/\+/g,"-").replace(/\//g,"_").replace(/=+$/,"");
}
function randVerifier(){
  var a=new Uint8Array(48); crypto.getRandomValues(a);
  return b64url(a.buffer).slice(0,96);
}
function connectDropbox(){
  var v=randVerifier();
  sessionStorage.setItem("pkce", v);
  crypto.subtle.digest("SHA-256", new TextEncoder().encode(v)).then(function(h){
    location.href = "https://www.dropbox.com/oauth2/authorize"
      + "?client_id=" + APP_KEY
      + "&response_type=code&token_access_type=offline"
      + "&code_challenge_method=S256&code_challenge=" + b64url(h)
      + "&redirect_uri=" + encodeURIComponent(REDIRECT);
  });
}
function tokenReq(body){
  return fetch("https://api.dropboxapi.com/oauth2/token",{
    method:"POST",
    headers:{"Content-Type":"application/x-www-form-urlencoded"},
    body:new URLSearchParams(body)
  }).then(function(r){return r.json();});
}
function getTok(){ try{return JSON.parse(localStorage.getItem(LS_TOK));}catch(e){return null;} }
function saveTok(t){
  var old=getTok()||{};
  localStorage.setItem(LS_TOK, JSON.stringify({
    access:t.access_token,
    refresh:t.refresh_token || old.refresh,
    exp:Date.now() + ((t.expires_in||14400)-120)*1000
  }));
}
function handleRedirect(){
  var code=new URLSearchParams(location.search).get("code");
  if(!code) return Promise.resolve();
  var v=sessionStorage.getItem("pkce")||"";
  return tokenReq({
    code:code, grant_type:"authorization_code", code_verifier:v,
    client_id:APP_KEY, redirect_uri:REDIRECT
  }).then(function(t){
    if(t.access_token) saveTok(t);
    history.replaceState({},"",REDIRECT);
  }).catch(function(){});
}
function accessToken(){
  var t=getTok();
  if(!t) return Promise.resolve(null);
  if(Date.now() < t.exp) return Promise.resolve(t.access);
  if(!t.refresh) return Promise.resolve(null);
  return tokenReq({grant_type:"refresh_token",refresh_token:t.refresh,client_id:APP_KEY})
    .then(function(j){ if(j.access_token){saveTok(j);return j.access_token;} return null; })
    .catch(function(){ return null; });
}

/* ---------------- Ανάλυση του briefing.md ---------------- */
function parseBrief(txt){
  var o={date:"",day:"",generated:"",lessons:[],urgent:[],office:[],team:[]};
  var sec="";
  txt.split(/\r?\n/).forEach(function(raw){
    var ln=raw.trim();
    if(!ln || ln==="---") return;
    var m;
    if((m=ln.match(/^(date|day|generated):\s*(.*)$/))){ o[m[1]]=m[2].trim(); return; }
    if(ln.charAt(0)==="#"){
      var t=ln.replace(/^#+\s*/,"").toUpperCase();
      sec = t.indexOf("ΜΑΘΗΜΑΤΑ")>=0 ? "L"
          : t.indexOf("ΕΠΕΙΓΟΝΤΑ")>=0 ? "U"
          : t.indexOf("ΓΡΑΦΕΙΟ")>=0   ? "O"
          : t.indexOf("ΟΜΑΔΑ")>=0     ? "T" : "";
      return;
    }
    var f=ln.split("|").map(function(x){return x.trim();});
    if(sec==="L" && f.length>=6)
      o.lessons.push({time:f[0],dur:f[1],name:f[2],place:f[3],
                      count:f[4],kind:(f[5]||"auto").toLowerCase(),next:f[6]||""});
    else if(sec==="U" && f.length>=2)
      o.urgent.push({pri:f[0].toUpperCase(),text:f[1],note:f[2]||""});
    else if(sec==="O")
      o.office.push({text:f[0],note:f[1]||""});
    else if(sec==="T" && f.length>=3)
      o.team.push({who:f[0],time:f[1],text:f[2]});
  });
  return o;
}

/* ---------------- Λήψη ---------------- */
function loadBrief(){
  state="load"; render();
  accessToken().then(function(at){
    if(!at){ showCacheOr("noauth"); return; }
    fetch("https://content.dropboxapi.com/2/files/download",{
      method:"POST",
      headers:{
        "Authorization":"Bearer "+at,
        "Dropbox-API-Arg":JSON.stringify({path:FILE_PATH})
      }
    }).then(function(r){
      if(r.status===401){ localStorage.removeItem(LS_TOK); throw new Error("auth"); }
      if(r.status===409) throw new Error("nofile");
      if(!r.ok) throw new Error("http "+r.status);
      return r.text();
    }).then(function(txt){
      brief=parseBrief(txt);
      localStorage.setItem(LS_CACHE, txt);
      state="ok"; render();
    }).catch(function(e){
      msg = (e&&e.message==="auth")   ? "Η άδεια έληξε"
          : (e&&e.message==="nofile") ? "Δεν βρέθηκε δελτίο για σήμερα"
          : "Χωρίς δίκτυο";
      showCacheOr(e&&e.message==="auth" ? "noauth" : "err");
    });
  });
}
function showCacheOr(fallback){
  var c=localStorage.getItem(LS_CACHE);
  if(c){ brief=parseBrief(c); state="ok"; }
  else { state=fallback; }
  render();
}

/* ---------------- Απόδοση ---------------- */
function headerHTML(){
  var d=new Date(), dayName, dateTxt;
  if(brief && brief.date){
    var p=brief.date.split("-");
    var dd=new Date(+p[0], +p[1]-1, +p[2]);
    dayName = brief.day || DAYS[dd.getDay()];
    dateTxt = dd.getDate()+" "+MONTHS[dd.getMonth()];
  } else {
    dayName = DAYS[d.getDay()];
    dateTxt = d.getDate()+" "+MONTHS[d.getMonth()];
  }
  var stat="";
  if(brief){
    var n=brief.lessons.length, u=brief.urgent.length;
    stat = (n? n+(n===1?" ραντεβού":" ραντεβού"):"Χωρίς ραντεβού")
         + (u? " · "+u+" επείγοντα":"");
  }
  return '<header><div class="eyebrow-top">ΦΑΙΔΩΝ / ΗΜΕΡΗΣΙΟ ΔΕΛΤΙΟ</div>'
    +'<h1>'+esc(dateTxt)+'<em>'+esc(dayName)+'</em></h1>'
    +(stat?'<div class="hstat">'+esc(stat)+'</div>':'')
    +'</header>';
}

function lessonHTML(l, cls, isNow){
  var h='<div class="row'+(cls?" "+cls:"")+'"><div class="tcol">'
    +'<div class="tm">'+esc(l.time)+'</div>'
    +(l.dur?'<div class="du">'+esc(l.dur)+'ω</div>':'')
    +'</div><div class="body">'
    +(isNow?'<div class="nowtag">ΣΕΙΡΑ ΤΩΡΑ</div>':'')
    +'<div class="nm">'+esc(l.name)+'</div>'
    +(l.place?'<div class="pl">'+esc(l.place)+'</div>':'');
  if(l.count) h+='<span class="tag '+esc(l.kind)+'">'+esc(l.count)+'</span>';
  if(l.next && (l.kind==="auto"||l.kind==="moto"))
    h+='<div class="nx"><b>Επόμενο:</b> '+esc(l.next)+'</div>';
  return h+'</div></div>';
}

function bodyHTML(){
  if(!brief) return "";
  var h='<main>';
  var stale = brief.date && brief.date!==todayISO();
  if(stale) h+='<div class="stale">Το δελτίο είναι της '+esc(brief.date)
    +'. Ο Φαίδων δεν έχει γράψει ακόμα το σημερινό.</div>';

  /* Μαθήματα */
  if(brief.lessons.length){
    h+='<div class="eyebrow"><span class="rn">Ι</span><span class="tt">Μαθήματα</span>'
      +'<span class="ct">'+brief.lessons.length+' ραντεβού</span></div>';
    var mins=nowMins(), found=false, live=!stale;
    brief.lessons.forEach(function(l){
      var end=toMins(l.time)+Math.round((parseFloat(l.dur)||0)*60);
      var cls="", isNow=false;
      if(live){
        if(mins>=end) cls="past";
        else if(!found){ cls="now"; isNow=true; found=true; }
      }
      h+=lessonHTML(l, cls, isNow);
    });
  }

  /* Επείγοντα */
  if(brief.urgent.length){
    h+='<div class="eyebrow"><span class="rn">ΙΙ</span><span class="tt">Επείγοντα</span>'
      +'<span class="ct">Inbox</span></div>';
    brief.urgent.forEach(function(t){
      h+='<div class="task"><span class="pri '+esc(t.pri)+'">'+esc(t.pri)+'</span>'
        +'<span class="tx">'+esc(t.text)
        +(t.note?'<span class="sub">'+esc(t.note)+'</span>':'')+'</span></div>';
    });
  }

  /* Γραφείο */
  if(brief.office.length){
    h+='<div class="eyebrow"><span class="rn">ΙΙΙ</span><span class="tt">Στο γραφείο</span>'
      +'<span class="ct">'+brief.office.length+' εκκρεμότητες</span></div>';
    brief.office.forEach(function(t){
      h+='<div class="task"><span class="pri dot">·</span>'
        +'<span class="tx">'+esc(t.text)
        +(t.note?'<span class="sub">'+esc(t.note)+'</span>':'')+'</span></div>';
    });
  }

  /* Ομάδα */
  if(brief.team.length){
    h+='<div class="eyebrow"><span class="rn">IV</span><span class="tt">Χθες στην ομάδα</span>'
      +'<span class="ct">Telegram</span></div>';
    brief.team.forEach(function(t){
      h+='<div class="task"><span class="pri dot">'+esc(t.who.charAt(0))+'</span>'
        +'<span class="tx">'+esc(t.who)+', '+esc(t.time)
        +'<span class="sub">'+esc(t.text)+'</span></span></div>';
    });
  }

  if(!brief.lessons.length && !brief.urgent.length
     && !brief.office.length && !brief.team.length){
    h+='<div class="state"><div class="big">Άδεια μέρα</div>'
      +'Ο Φαίδων δεν βρήκε ραντεβού ούτε εκκρεμότητες.</div>';
  }

  h+='<div class="foot"><button id="btnReload">Ανανέωση</button>'
    +'<button id="btnLogout">Αποσύνδεση</button></div></main>';
  return h;
}

function render(){
  var app=document.getElementById("app"), h="";
  if(state==="load"){
    h=headerHTML()+'<div class="spin"></div>'
     +'<div style="text-align:center;color:var(--muted);font-size:13px">Φέρνω το δελτίο</div>';
  } else if(state==="noauth"){
    h=headerHTML()+'<div class="state"><div class="big">Σύνδεση με Dropbox</div>'
     +'Μία φορά μόνο. Μετά ανοίγει κατευθείαν κάθε πρωί.'
     +'<button class="cta" id="btnConnect">Σύνδεση</button></div>';
  } else if(state==="err"){
    h=headerHTML()+'<div class="state"><div class="big">'+esc(msg)+'</div>'
     +'<button class="cta" id="btnReload">Δοκίμασε ξανά</button>'
     +'<button class="quiet" id="btnLogout">Αποσύνδεση</button></div>';
  } else {
    h=headerHTML()+bodyHTML();
  }
  app.innerHTML=h;
  var b;
  if((b=document.getElementById("btnConnect"))) b.onclick=connectDropbox;
  if((b=document.getElementById("btnReload"))) b.onclick=loadBrief;
  if((b=document.getElementById("btnLogout"))) b.onclick=function(){
    localStorage.removeItem(LS_TOK); state="noauth"; render();
  };
}

/* ---------------- Εκκίνηση ---------------- */
handleRedirect().then(loadBrief);
if("serviceWorker" in navigator){
  navigator.serviceWorker.register("sw.js").catch(function(){});
}
document.addEventListener("visibilitychange", function(){
  if(!document.hidden && state==="ok") render();   /* ανανέωση γκριζαρίσματος */
});
</script>
</body>
</html>