This project is read-only.

Live Demo

Mozaic

Descrierea proiectului

Mozaic este o interfata web bazata pe tab-uri.

De ce aceasta interfata?...de ce nu o navigare clasica?
- pentru ca nu doresc sa parcurg calea inversa (Back, Back, Back...) pentru a revedea o pagina anterior vizualizata
- pentru ca doresc sa revad o pagina exact in starea in care am lasat-o (poate am aplicat niste filtre de cautare sau poate am completat niste campuri)
- pentru ca vreau sa pot accesa meniul aplicatiei fara sa fac de fiecare data 'scroll' catre parte superioara a paginii
Si daca eu am astfel de 'pretentii', poate ca si unii dintre utilizatorii aplicatiilor mele le au.

Implementarea unei interfete precum Mozaic (sau a altor sisteme de navigare prin tab-uri) o recomand doar in aplicatiile web in care SEO nu este o prioritate (Ex: aplicatii Enterprise).

La o vedere 'de sus', arata cam asa:
Mozaic - PrintScreen

Arhitectura

Aplicatia a fost construita sub forma unui proiect MVC3 in VS2010 si nu reprezinta altceva decat o integrare a urmatoarelor componente:

Facilitati

Principalele facilitati, grupate pe cele 3 directii expuse mai sus, sunt:
Layout:
- autoresize - la zona de continut
- collapsable - la zona de meniu
- scroll - independent pt. cele 2 zone (meniu/continut)
- meniu - intotdeuna vizibil
- footer - intotdeauna vizibil
Tab-uri:
- orice pagina se deschide intr-un nou tab
- revenirea la o pagina nu presupune trecerea (cu 'Back') prin toate paginile anterior parcurse
- la revenire intr-o pagina, starea acesteia o vom gasi nealterata (campuri completate, scroll etc)
- continutul generat intr-un iframe -> izolare perfecta a paginilor
- tab-uri statice - predefinite intr-un fisier xml (optional)
- tab-uri dinamice - definite prin javascript si apelate din meniu
- optiune de 'close'
Meniu:
- permite grupare pe sectiuni
- continut generat dintr-o sursa externa (ex: SQL) - neimplementat
- vizualizare flexibila (liniara dar si de tip acordion)

Instructiuni de instalare si utilizare

- Pas 1. Descarci folderul Content si fisierul \Views\Home\Index.cshtml din acest proiect
- Pas 2. Iti creezi propriul proiect MVC in VS2010
- Pas 3. Suprascrii intreg continutul folder-ului Content si fisierul Index.cshtml
- Pas 4. Modifici link-urile catre tab-urile statice din fisierul \Content\dhtmlxTabbar\tabs.xml (optional)
- Pas 5. Modifici link-urile catre tab-urile dinamice din fisierul \Views\Home\Index.cshtml(optional)
- Pas 6. Compilezi...si gata!

Compatibilitate, standardizare

- Aplicatie a fost testata pe cele mai folosite browsere: IE7, IE8, IE9, Mozilla 4, Mozilla 5, Chrome
- Style customizabil, bazat exclusiv pe fisiere CSS externe
- Markup HTML validat de W3C

Licentiere

- Indiferent ca e folosit in aplicatii comerciale, open-source sau doar ca sursa de inspiratie, Mozaic este gratuit.
- Atentie! - componentele integrate in Mozaic au propriile variante de licentiere:
- jQueryLayout - distribuit sub licentele GPL si MIT (gratuit)
- dhtmlxTabbar - distribuit sub licentele GPL (gratuit) si Commercial (69$)
- yuiMenu - distribuit sub licentele BSD (gratuit)

Last edited Aug 29, 2011 at 4:31 PM by lmaran, version 34