Projekt FI 2009

Na Fakultě informatiky Masarykovy univerzity byl realizován projekt Albireo v rámci Programu děkana Fakulty informatiky MU pro podporu studentských výzkumných a vývojových projektů pro období od prosince 2008 do května 2009 pro studenty Martina Nováka a Petra Kunce.

Logo Fi MU

Obsah

Odkazy na zdroje MU

Shrnutí

Albireo je redakční systém, pro který je charakteristické napojení na centrální server (možnost automatických aktualizací, instalace přes jediný soubor), využívání metod Webu 2.0 a implementace desktopových paradigmat do webových systémů. Cílem projektu je celkový rozvoj systému, hlubší integrace pro Web 2.0 a výzkum v oblasti webových operačních systémů.

V rámci projektu se jednalo o integraci moderních technologií, které podstatně vylepšují práci se systémem. Konkrétně se jedná o použití JavaScriptového rámce, rozšíření možností WYSIWYG editoru, hlubší rozvoj desktopových ovládacích prvků v prostředí webových stránek a použití cizích technologií jako je například OpenID nebo Google Gears. Řešitelský tým také vylepšil komunitní vlastnosti systému využitím nástroje Google Talk.

Vedoucí projektu: Mgr. Jaroslav Škrabálek
Garant projektu: doc. RNDr. Tomáš Pitner, Ph.D
Podpora: Projekt byl podpořen částkou 36 000 korun, zapůjčením dvou LCD monitorů a prostor na fakultě.

Harmonogram projektu

  • prosinec 2008 – integrace rámce jQuery, dosažení kompatibility s maximem prohlížečů
  • leden 2009 – integrace Google Gears (podpora hromadného zavedení souborů)
  • únor – březen 2009 – nový model webového správce souborů, výzkum webových operačních systémů. Výstupem je nový webový správce souborů.
  • duben 2009 – integrace Mashups
  • květen 2009 – integrace OpenID

Záměr projektu

V současné době je hlavním trendem přesun desktopových aplikací na web. V oblasti informačních systémů je však důležité spojit možnosti klasických webových systémů se snadností ovládání operačního systému. Naším primárním cílem bylo maximální zjednodušení celého procesu používání systému do té míry, aby ji zvládl i uživatel, který nemá zkušenosti s ničím jiným, než je jeho operační systém a internetový e-mailový klient. Uživateli nabízíme snadná ovládací schemata známá z klasických operačních systémů a hlavní důraz je kladen na imitaci desktopové aplikace tak, aby uživatel při práci získal dojem, že náš systém není webová stránka, ale aplikační nástroj dostupný na webové adrese.

Další z našich cílů je vytvořit systém od základu postavený na moderních webových službách a těžil z nich v největší možné míře. Jedním z hlavních požadavků byla podpora asynchronní komunikace zabudovaná přímo do jádra aplikace.

Z regionálního hlediska je přínosem česká lokalizace (vnitřně je umožněna lokalizace i do jiných jazyků díky nasazení nástroje GNU/GetText).

Abychom tyto své záměry splnili, rozhodli jsme se pro velkou inovaci celého rozhraní ovládání systému, které je ztělesněním představ, jež jsme měli. V systému se neustále testuje aplikace desktopových rozhraní v rámci webu, čímž Albireo získává interakční a intuitivní grafické uživatelské rozhraní. Samotné zahraniční projekty (český podle dostupných informací žádný není) webových operačních systémů se soustředí zejména na suplování klasického desktopu. Projekt Albireo se snaží pouze aplikovat prvky, které poskytují výhodu, a zároveň těžit z vlastností internetového prostředí.

Zhodnocení projektu

jQuery

jQuery je JavaScriptová knihovna, která umožňuje snadnou interakci mezi JavaScriptem a HTML.

Dosažený cíl

Velké zapojení technik postavených na JavaScriptu s sebou přineslo problémy s optimalizací pro prohlížeče. Proto byl integrován do systému rámec jQuery.

Plně byl podporován pouze prohlížeč Mozilla Firefox. Pomocí jQuery došlo ke zvýšení kompatibility. Albireo je nyní funkční s Microsoft Internet Explorer 7 a 8, Mozilla Firefox, Opera, Google Chrome a Safari, tedy s veškerými současnými majoritními prohlížeči.

Kód je nyní optimalizovaný a lépe strukturovaný. Asynchronní komunikace pomocí AJAX byla pomocí jQuery značně zjednodušena a využívá její standardní volání fungující na všech hlavních prohlížečích a automaticky vrací HTML výstup, který je dále zpracováván.

Od použití jQuery si slibujeme snadnou udržitelnost kódu a funkčnost JavaScriptu Albirea ve všech nejpoužívanějších prohlížečích.

Splněno nad rámec projektu

Integrace nadstavby jQuery UI, která nám umožnila použít mnoho atraktivních vizuálních prvků. Ty však neplní pouze funkci estetickou, ale usnadňují i samotnou práci se systémem. Nahrazením našich dialogových oken dialogy jQuery se zvýšila jejich funkčnost, vzhled (mohou měnit velikost, jsou snadno skinovatelné, podporují minimalizaci, atd.) i snadnost obsluhy a zároveň si dialogy zachovaly předchozí vlastnosti (přesun pomocí drag&drop, načítání obsahu asynchronně – není nutné obnovovat celou stránku). Více jsme se přiblížili našemu záměru. Chceme, aby dialogová okna imitovala okna aplikací známých uživatelům z operačních systémů se všemi výhodami nabízenými tímto postupem. Webová stránka bude představovat operační systém starající se o spouštění různých aplikací v dialogových oknech, které budou vzájemně spolupracovat. Uživatel bude možnost je minimalizovat, přepínat mezi nimi a budou mít sjednocené rozhraní, které usnadní veškerou práci se systémem. Podpora více paralelních dialogů však ještě není funkční.

Okna jsou oddělena od operačního systému i prohlížeče a jejich vzhled i funkčnost je stejná napříč všemi platformami. Nově jsme přidali podporu klávesových zkratek, což je další významný prvek zjednodušení a zrychlení práce. Tyto dialogy jsou používány ke kompletní práci s obsahem webu.

Byly přidány miniaplikace, které mohou být jednoduše přesunovány či minimalizovány.

Google Gears

Gears je rozšíření pro prohlížeče, které umožňuje pracovat s internetovými aplikacemi offline a obecně lépe propojit pomocí prohlížeče operační systém s internetovými stránkami.

Gears je ovšem stále pouze jako vývojářská verze a není doporučena k plnému nasazení ve webových aplikacích.

Dosažený cíl

Většina redakčních systémů neumožňuje hromadné nahrávání souborů. Například nahrávání fotek tak může být poměrně zdlouhavá a nepříjemná záležitost. Tento problém jsme řešili pomocí nahrátí komprimovaného souboru, který stačilo jako jediný nahrát na server a Albireo se pak postaralo o dekompresi a nakopírování obsažených souborů.

Náš nový kód implementující Google Gears umožňuje hromadný upload souborů na server. Systém není omezen limitem serveru pro velikost uploadovaného souboru a zobrazuje procentuální stav nahrávání jednotlivých souborů. Celý systém funguje jako obyčejný výběr souboru (jak jej uživatel zná například z vybírání příloh k e-mailu) s tou výjimkou, že může vybrat více souborů naráz, a ty posléze přehledně nahrát na server.

Správce souborů

Protože je systém zaměřený na jednoduchost, pokládali jsme za klíčové umožnit uživatelům snadnou správu souborů. Běžný uživatel má problém i s obsluhou programu pro FTP přístup. Bylo tedy potřeba vytvořit jednoduchý systém, který by byl již od prvního použití i začátečníku dobře známý, snadno ovladatelný a celkově uživatelsky příjemný.

Dosažený cíl

Systém nyní rozpoznává a umožňuje distribuci kancelářských a multimediálních souborů typu PDF, ODT, XDOC, MP3 a AVI. Dialogy pro práci se soubory byly v rámci projektu přepracovány a zjednodušeny.

Dále bylo vytvořeno nové databázové schéma pro chystané vypuštění Albireo I, které využívá například triggery.

Rozhraní napodobuje operační systémy. Jsou použity základní zvyklosti (otevření poklepáním, kontextové menu obsahující příkazy smazat, kopírovat, ... se nachází pod pravým tlačítkem, atd.). Díky asynchronní komunikaci nedochází ke znovunačítání stránky a celý proces působí naprosto plynule. Soubory se otvírají v dialogovém okně imitující okno aplikace z GUI operačních systémů. Řazení je možné pouhým tažením myši.

Webové správce souborů vytvořily například i firmy jako Google (Google Docs) nebo Microsoft (Windows Live), ale zatím se zdá, že Albireo dosáhlo dostatečně komplexního výsledku v přenesení uživatelského komfortu do prostředí webových stránek.

Splněno nad rámec projektu

Celkově lepší využití jQuery dialogů a asynchronního volání pro simulaci desktopového interface s s širokou škálou grafických efektů.

Vylepšení funkčnosti některých aplikací běžících pod naším webovým správcem (umožňujících například snadná nastavení složek a článků). Vytvoření několika miniaplikací.

Vylepšení práce s články. U článků se nyní automaticky vyplňují některé části podle předchozího vyplnění textu. Umožňuje však i manuální nastavení pokročilých vlastností článku (včetně nastavení data a času publikování nebo přístupových práv článku).

MashUp

Jako MashUp (česky také míchanice) je princip řešení, kde se na jedné webové stránce kombinuje pomocí API obsah z více zdrojů. Tímto řešením vzniká unikátní aplikace přidávající nové možnosti původní službě.

Dosažený cíl

Systém po přihlášení do Albirea zobrazuje widgety umožňující získávání dat z externích serverů typu RSS. Práce s widgety je podobná iGoogle. Umožňuje řazení, vypínání a zapínání jednotlivých widgetů. Uživatel tak jednoduše získává na přihlašovací stránce velkou variabilitu a může si nechat zobrazit například vedle statistik jeho webu, posledních návštěv a posledních vytvořených článků také zprávy z České republiky, poslední sportovní výsledky nebo novinky ze světa programování. Tvorba přípojných widgetů je rychlá a snadná.

Albireo zároveň automaticky produkuje vlastní RSS zdroj pro články, novinky a další obsah.

Pro WYSIWYG práci s články na webu používáme FCKeditor, který byl námi doplněn o MashUpy, které mohou být nyní snadno implementovány přímo do článku. Zatím byly vytvořeny dva kompletní pluginy.

První plugin byl kompletně napsán a navržen námi z důvodu nedostatečné funkčnosti již existujících rozšíření FCKeditoru a slouží k vložení videa z YouTube. Video se vkládá pomocí URL stránky, na které se vyskytuje, a další volitelné vlastnosti se starají o změnu vzhledu. Jedná se o nastavení velikosti videa, barvy ovládacích prvků a zda zobrazovat rámeček ve výsledné prezentaci.

Druhý plugin slouží k vkládání interaktivních Google maps do článků. Byl použit existující plugin do editoru, který však ještě nebyl dostatečný. Samotná úprava již poměrně rozsáhlého pluginu se však ukázala jako daleko těžší než napsání originálního YouTube pluginu. Nejdůležitější a nejviditelnější změnou je integrace formuláře pro přidání Google API kódu. Pro možnost vkládání map do stránek je totiž třeba mít vlastní kód podle domény, aby Google mohl kontrolovat, kdo jeho API využívá a kolik geodotazů proběhne. V původním pluginu bylo třeba tento kód manuálně dopsat do konfiguračního souboru editoru. Tvůrci předpokládali, že ten, kdo bude chtít používat tento plugin, bude umět i nastavit jeden řádek. My však nechceme, aby uživatel musel manuálně cokoli editovat, proto je pomocí asynchronní komunikace možné tento kód vyplnit přímo v dialogu, a ten sám upraví konfigurační soubor. Poté je plugin připraven k použití. Umožňuje vyhledávání i manuální procházení mapy, nastavení křivek pro ukázání směru nebo ukazatelů s popiskem.

Jako defaultní souřadnice při tvorbě mapy jsme nastavili zeměpisné souřadnice FI MU Brno.

Dále jsme do administrace přidali widget Google Talk umožňující jednoduše sdílet informace mezi uživateli systému. V sekci Instalace je nyní možné přímo kontaktovat vývojáře Albirea pomocí funkce Chat.

OpenID

OpenID je standard pro autentizaci uživatelů. Umožňuje užitím jediné identity přistupovat k velkému množství různých serverů.

Dosažený cíl

Systém umožňuje uživatelské účty propojovat s OpenID servery pomocí jednoduchého přepínače při přihlašování, které umožní zadat OpenID login. Po korektní autentizaci dojde k přihlášení do administrace Albirea. Řešení je však stále spíše experimentální (funguje asi v 80 procentech případů). Problém je zejména v různé implementaci OpenID na různých serverech poskytujících identity a zároveň i komunikace s jejich servery.

Závěrem

Naším záměrem bylo vytvořit jednoduchý informační systém, který bude primárně čerpat z grafických uživatelských rozhraní operačních systémů. Aplikací technologií jako je dynamické skriptování na straně klienta a asynchronní komunikace se serverovou částí se nám podařilo přiblížit komfortu desktopových programů a rozhraní.

Kombinací typické webové aplikace a klasických paradigmat rozhraní operačních systémů se nám podařilo vytvořit systém, který začátečníkům umožňuje vytvořit snadno a rychle webové stránky a spravovat je, pro pokročilejší však nabízí i množinu akcí, které zvyšují přizpůsobivost systému daným požadavkům.

Objektovost návrhu do jisté míry umožňuje modularitu systému, i když velké zásahy přímo do jádra nebo systémových služeb v blízké budoucnousti nechystáme. V současné době se chceme věnovat zejména rozšiřování povědomí o Albireu, programování rozšíření a komponent, rozvíjení služeb Albireo Cloud a snazší správu grafických návrhů uživatelských stránek.

Důležitou předností je i funkčnost pod všemi majoritními prohlížeči.

Veškeré cíle projektu byly splněny (s předstihem), i když integrace OpenID je stále pouze experimentální. Navíc se nám podařilo implementovat řadu součástí, které nebyly přímo zadáním projektu.

Sdílejte tento článek:
  • Sdílet na Facebooku
  • Sdílet na Twitteru
  • Sdílet na linkuj.cz
  • Přidat do záložek Googlu
  • Sdílet na linkedin
  • Sdílet na del.icio.us