Alat za upravljanje folderima, my version

Malo sam se zaigrao, pa si složio jedan alatić koji je prvotno trebao biti kao nešto simple. Na kraju mi trebao na više mjesta…pa ga lagano upgredao… i sad imam već solidan alatić. Pa sam si za uspomenu složio i jedan tutorijal da se lakše snađem kad pogubim konce iz glave.

Rekoh da ga objavim i ovdje da se pohvalim. Nema loših referenci :smile:
http://bozoou.com/BCard/

Vjerujem da ima hrpetina kvalitetnih rješenja po netu …no gušti su gušti. Ono što me zanima, ako je netko već koristio neka rješenja za ovakve potrebe…i ako mu se da zagledati malo u ovo da vidi kolika je fleksibilnost i upravljivost. Kakve bi me kritike stigle po tom pitanju? I koliko se ovo čini, sa datim objašnjenjem, pristupačno i jednostavno?

Svjestan sam da nemam fensi šmensi opcija poput drag-drop. Mnogo bitnije što trenutno nemam je zapravo multi selektiranje… …doći će jednog dana.

No any comment, critic…anything. :slight_smile:
Vjerovatno sam krenuo bez dobrog uvoda u alat, pa je i besmisleno čitat i probat shvatit opcije alata. Zato sam složio jedan “kratki uvod” koji objašnjava na koje sve načine je upravljiv BCard alat.

Ako se nekom da pročitat, pa da barem ustanovimo jeli uvod i dalje nejasan…ili barem malo uvede u bit :wink:
Updejtan je uvod i na stranici, ali evo i ovdje:

Mogućnosti i primjena

BCard je Javascript alat koji omogućava jednostavno kreiranje “kartica” za prikazivanje hijerarhijske strukture podataka. Analogno folderima unutar windowsa. Izgrađena struktura se može koristiti za prikaz informacija, ali također i za izradu korisničkog sučelja sa hijerarhijski posloženim opcijama za upravljanje, raznih filtera, itd. Primjer jednog sučelja (kartice) se može vidjeti ovdje.
Kartica je znači nosioc vizualnih elemenata, a pojam “tag” se koristi za entitet koji je povezan sa vizualnim elementima. Koji utječe na ponašanje vizualnih elemenata i nosi podatke koji se vežu uz vizualne elemente.

Funkcije koje BCard omogućava za upravljanje karticama su sljedeće:

-definiranje vlastitih tipova podataka i ponašanja istih. Sve dostupne opcije se mogu podesiti za svaki tip podataka (linije) posebno. Npr. pojedini tipovi linija nam mogu predstavljati nosioce informacija, pojedine linije predstavljaju klikabilne gumbe. Neke tipove linija postavimo proširive, kako bi mogle sadržavati djecu. Neke tipove linija selektibilne, svaki tip linije povežemo sa različitim css klasama …itd.
Nakon što smo definirali ponašanje pojedinih tipova linije, kod stvaranja nove linije samo zadamo kojeg je ona tipa, i sva definirana svojstva za taj tip će biti pridružena toj liniji.

Kako sve možemo opisati pojedini tip linije:

-potpuno vizualno oblikovanje elemenata (uređivanjem .css file-a (postojećih klasa) i dodjeljivanje ključa klasa određenom tipu ili dodjeljivanje direktno novih klasa određenim elementima za željene tipove)
-linije mogu biti proširive (expandable)…nose daljnju strukturu, svoju djecu
-linije mogu biti selektibilne (selectable). Klikom na njih se selektiraju
-definiranje sljedećih eventa pojedinog tipa linije: onSelect(), onUnselect(), onExpand(), onCollapse(). Reakcija na selektiranje, deselektiranje, proširenje, zatvaranje.
-css se može definirati za pojedine elemente, ali i za njihova različita stanja: normal, expanded, selected
-odabir koji elementi linije će biti trigeri selektiranja ili expandiranja. Te hoće li se trigirati na singleClick ili doubleClick za pojedine elemente. Npr. možemo složit da je ime linije triger za selektiranje, a doubleclick na ime je triger za proširenje linije. Pored imena stavimo ikonu “plus” i tu ikonu definiramo kao triger za proširenje koji se trigira na single click.
-odabir ikone koja će predstavljati određeni tip linije
-dodavanje vlastitih HTML elemenata u postojeću strukturu linije i uklanjanje defaultnih elemenata. Moguće je pristupiti akciji koja se izvršava kod stvaranja HTML elemenata pojedinog tipa linije. Ovdje se može skroz fleksibilno pristupiti bilo kojem postojećem elementu linije, te dodati nove elemente po želji. U ovom djelu se mogu definirati i klasični eventi poput onclick, ondblclick itd.

-upravljanje kontrolom vidljivosti. Ponašanje kontrole vidljivosti je analogno ponašanju vidljivosti layera u Photoshopu ili sličnim programima. (Kontrola vidljivosti je također opcija, ne nužni dio strukture)
-postavljanje vlastitih ikona za prikaz stanja vidljivosti taga. Mogu se koristiti npr. checkbox-i.
-definiranje ponašanja tagova kod promjene vidljivosti istih. U trenutku trigiranja promjene, u trenutku kad određeni tag mijenja vlastito stanje vidljivosti (prilikom trigiranja ili nasljeđivanja)…i trenutak kad se završi nasljeđivanje vidljivosti nakon početnog trigiranja.

Sve opcije vezane za pojedine tipove linija se mogu postaviti i globalno za cijelu karticu. BCard prvo gleda jeli opcija postavljena za pojedini tip linije, zatim jeli postavljena globalno za karticu…i ako nije pronašao parametar, onda ga uzima iz defaultne vrijednosti.

Sljedeće funkcije omogućavaju fleksibilnost rada sa karticama:

Dohvaćanje tagova po različitim kriterijima:
-dohvaćanje sa “path name”, pomoću strukture imena linija. Analogno path-u foldera unutar windowsa.
-dohvaćanje sa “back path name”. Struktura po i pozadinskom imenu. Pozadinsko ime taga je stabilnija informacija koja može biti uvijek ista dok je ime taga podložno promjenama.
-dohvaćanje taga preko redosljeda strukture. Npr. dohvati drugo dijete taga koji je treće dijete glavnog roditelja: (‘3/2’);
-dohvaćanje taga preko id-a
-dohvaćanje taga preko selektirane linije
-dohvaćanje niza roditelja taga, od glavnog rodtilja do traženog taga
-dohvaćanje vlastite djece taga ili dohvaćanje sve djece u nižoj hijerarhiji ispod određenog taga

Dohvaćanje vizualnih elemenata:
-dohvaćanje selektirane linije
-dohvaćanje linije preko taga koji je vezan uz nju
…do svakog vizualnog elementa se može doći preko linije ili preko taga.

-export-imoport tagova
-brisanje tagova
-cut, copy, paste, rename
-ugrađene su defaultne forme za unos novih tagova od strane korisnika