Cum aș putea afișa un calendar cu evenimente?

Un client are o problemă: afișarea unei liste cu evenimente. Premise:

  • se vrea afișarea lui într-un box ce are ~35% din lățimea site-ului; ca aspect, box-ul va avea o rație de 4:3
  • se vor afișa evenimentele curente sau imediat următoare;
  • evenimentele se pot întinde pe mai multe luni
  • nu prea se dorește folosirea scroll-ului

Inițial m-am gândit că e suficient să afișez o listă cu trei-cinci evenimente imediat următoare. Deoarece evenimentele se pot întinde pe mai multe luni, se poate ajunge în cazul în care sunt cinci-șase evenimente curente (ce au început luna trecută și se termină în lunile următoare). Deci varianta asta pică.

Apoi am zis că putem folosi paradigma folosită de Windows Phone: o pagină curentă (pentru evenimentele imediat următoare) și o pagină parțial vizibilă (10%) pentru evenimentele curente. Dar asta implică probleme de UX (e.g. cum facem scroll?)

Apoi am zis că putem afișa un calendar și scoatem în evidență zilele în care încep evenimente, afișând evenimentele într-un popup/tooltip (dar nu putem afișa pe calendar evenimentele deja pornite)

Ultima idee este să folosim un calendar ce afișează evenimentele într-un popup, iar popup-ul să fie împărțit în două: evenimentul din ziua selectată + evenimentele în curs. Doar că și aici este o problemă: dacă într-o lună nu începe nici un eveniment, utilizatorul nu va putea vedea evenimentele curente.

Ceva idei?

ia vezi daca iti plac optiunile oferite de http://fullcalendar.io/ (ai acolo mai multe variante de afisare)

Păi… nu prea :smile: la dimensiunea la care ne trebuie nouă este ușor inutilizabil.

ai vazut demo-urile de acolo? il poti face cat de mic vrei tu si poti seta sa apara popup cand se da click pe un eveniment (sau sa se afiseze intr-un div separat detaliile)…
e destul de customizabil daca stii cat de cat jquery si cum sa umblii cu eventuri…

Am văzut demourile.

Este posibil să nu mă fi exprimat prea bine: nu am nevoie de un calendar pentru administrare, am nevoie de un calendar pentru afișare. Unele evenimente pot să aibe început și sfârșit în alte luni decât cea curentă; practic aici este provocarea cea mare: cum afișezi un eveniment ce începe luna trecută și se termină luna viitoare?

Din acest motiv nu cred că un calendar propriu-zis ajută foarte mult (de asta și caut o soluție alternativă de afișare)

Fullcalendar este foarte asemanator cu calendarul google. Modul lor de afisare al evenimentelor este unul din cel mai okay.

Da, dar doar atunci când te poți desfășura pe toată lățimea paginii. Așa cum am zis mai sus, eu pot să afișez într-un box de 350x250

poti folosi sugestia mea, afisezi in casuta mica doar eventimentele din ziua curenta (sau din saptamana urmatoare) aranjate unele sub altele (de fapt in calendarul sugerat de mine asa se pun una sub alta in functie de ora din ziua respectiva).
si afisezi butoanele de eventimente complete (sau pentru toata luna) care sa te duca intr-o pagina noua unde sa poti afisa calendarul full cu evenimentele de cand incep pana cand se termina (ca in exemplele de la calendar - ai vazut ca bara albastra a evenimentului se lungeste pe zilele/lunile cat e evenimentul respectiv)

http://fullcalendar.io/js/fullcalendar-2.3.1/demos/theme.html - dai click pe butonul day ca sa intelegi cum sugerez eu sa afisezi in casuta mica

1 Like