Hlavní navigace

MooTools: nový sexy javascriptový framework

Jakub Šťastný 6. 8. 2008

MooTools jsou stejně jako jQuery a Prototype javascriptový framework, který poskytuje nástroje pro snadný a rychlý vývoj moderních javascriptových aplikací. Jsou čisté a objektové a používají je i takové značky jako Ubuntu, Joomla nebo Jeep. Jaké MooTools jsou a co přinášejí?

Co jsou MooTools?

Ve vývoji javascriptových frameworků existují dva hlavní trendy – striktní dodržování zapouzdření a operování pouze na vlastním písečku (tedy namespace) nebo rozšiřování již existujících objektů. Příkladem frameworku striktně dodržujícího zapouzdření je jQuery nebo YUI, příkladem frameworku rozšiřujícím již existující objekty je Prototype.

Oba přístupy mají něco do sebe. Většina webových vývojářů preferuje ono zapouzdření z obavy možné kolize. Tím pádem se nemusí obávat toho, že jejich skripty budou nekompatibilní se skripty třetích stran, na druhou stranu ale přicházejí o všechny ty užitečné metody, které by se daly doprogramovat do již existujících objektů.

MooTools chtějí poskytovat maximální možné pohodlí, a tak volí cestu rozšiřování objektů. Ostatně riziko kolize je sice nezanedbatelné, ale zas není tak extra velké, zejména uvážíme-li, jakým způsobem se dnes JavaScript píše – stáhnutím frameworku a dohledáním příslušných pluginů právě pro daný framework.

Filosofie MooTools

Osobně se nemůžu zbavit dojmu, že cílem jQuery je dělat z JavaScriptu něco, čím není1). Vývojáři MooTools jsou si vědomi krás JavaScriptu a nedělají z něj, co není – prostě jej pouze vylepšují.

Co se týče programátorských technik, MooTools mají jasno – objekty, objekty a ještě jednou objekty. Skutečně OOP v MooTools je velmi dotažené a je opravdu radost s takovým rozhraním pracovat.

MooTools jsou intenzivně inspirované programovacím jazykem Ruby, takže pokud tento jazyk ovládáte, v MooTools se určitě neztratíte. Stejně jako Ruby i MooTools mají značnou zálibu ve funkcionálních technikách, což je činí velmi mocnými.

Kompatibilita s prohlížeči

Co se týče kompatibility s prohlížeči, MooTools jsou kompatibilní a testované proti IE 6 a 7, Safari 2 a 3, Firefox 2 a 3 a Opera 9. Když uvážíme, že převážná většina osatních prohlížečů staví na jádře některého z uvedených prohlížečů, lze říci, že MooTools podporují všechny alespoň trochu významněji rozšířené prohlížeče.

Kdo MooTools používá?

MooTools, byť jsou relativně mladé, jsou dnes již docela rozšířené. Pro příklad nemusíme chodit nijak daleko – na svých stránkách je používá například Ubuntu, Joomla nebo W3C, dále pak například Jeep, Vimeo nebo CNET.com.

Zkoušíme MooTools

Málokomu se chce kvůli každému článku hned něco stahovat a nastavovat. Naštěstí nemusíte. Existuje jedna mooc šikovná moostránka. Jmenuje se Mootorial a umožňuje vyzkoušení MooTools skrze Firebug či, pokud nemáte Firefox s nainstalovaným Firebugem, jeho MooToolsovou náhradu.

Co MooTools umí

CSS selektory a pseudoselektory

Každý pořádný javascriptový framework dnes umí CSS selektory a pseudoselektory používat. MooTools nejsou výjimkou. Syntaxe je stejná jako v Prototype, tedy $('id') a $$('selektor'). V MooTools, stejně jako ve většině ostatních frameworků, lze s polem elementů pracovat stejně jako s jedním elementem, takže lze dělat například toto:

// Každému lichému <tr> bude přidána CSS třída odd
$$('table tr:odd').addClass('odd');

// Vrátí všechny odkazy, které začínají "mailto:"
$('myElement').getElements('a[href^=mailto:]');

// Vrátí všechny odstavce, které obsahují text "find me"
$$('p:contains("find me")');

AJAX a ti ostatní

Klasická forma komunikace se serverem je pomocí XML. Existují formáty, které se hodí lépe – například JSON, nativní formát JavaScriptu. MooTools zvládají jak XML requesty, tak JSON a také HTML requesty, při kterých se prostě vloží HTML nahrané ze serveru do určité části stránky. Prosté a užitečné.

Události

Co se týče událostí, MooTools mají zabudovanou podporu pro práci s klávesami, ať se již jedná o klávesové zkratky či konkrétní klávesy, a také podporu pro různé události související s myší – včetně rolování na všechny možné i nemožné strany.

Efekty

MooTools na rozdíl třeba od Prototype mají mnohé efekty díky Moo.FX přímo zabudované. Například hezké vysouvání textu. V Prototype byste kvůli tomu museli sáhnout po další knihovně, patrně po Script.aculo.us, která ovšem není nejmenší. No dobře, maličké Moo.FX lze používat i s Prototype.

Rozšíření existujících tříd

Zde není moc o čem mluvit. MooTools rozšiřují javascriptové třídy o spoustu užitečných prvků, často inspirovaných Ruby. Implementace je vždy objektová, mnoho metod je funkcionálních. Podívejte se na tyto příklady:

// for cyklus hezky objektově
['Linux', 'Mac OS X', 'Windows'].each(function(os, index) {
  alert(index + " ... " + os);
})
// alert: 0 ... Linux
// alert: 1 ... Mac OS X
// alert: 2 ... Windows

[10, 3, 25, 100].filter(function(item, index) {
  return item > 20;
})
// => [25, 100]

[1, 2, 3].map(function(item, index) {
  return item * 2;
})
// => [2, 4, 6];

(4).times(alert);
// Zobrazí alert 0, 1, 2 a nakonec 3.

"I-like-cookies".camelCase();
//returns "ILikeCookies"

Mootivační prohlídka zajímavých pluginů

Tuto část berte spíše motivačně, pro „namlsání se“, nikoliv jako nějaký kompletní přehled pluginů MooTools.

Lightboxy

Lightboxů pro MooTools existuje poměrně dost. Mně osobně se líbí Multibox, ten je ale dosti velký, takže používám také Slimbox, nicméně možností je spousta.

Slideshow

Sám jsem slideshow na webu zatím nikdy nevyužil, nemám moc rád jakkoliv se „hejbající“ a tedy vyrušující prvky, no ale uznejte, nevypadá to skvěle?

Notifikátory

Osobně se mi velmi líbí Roar, což je napodobenina macovského Growlu. Kdo Growl neznáte, podívejte se prostě na demo.

Našeptávač

Našeptávačů pro MooTools existuje taktéž několik, osobně používám Autocompleter (demo). Má jednoduché rozhraní a je spolehlivý…co chtít víc?

Závěr

MooTools jsou sice poměrně nový, ale zato velmi slibný javascriptový framework. Pokud ještě nejste rozhodnuti, který z dostupných frameworků využiteje, určitě se na MooTools podívejte. Stojí za to.


Poznámky pod čarou

    Odkazy

    Našli jste v článku chybu?

    7. 8. 2008 11:08

    Ale když se to vezme kolem a kolem, není to vlastně jedno? JS je turingovsky kompletní programovací jazyk a pokud v něčem nevyhovuje (každý projekt má jiné požadavky a lidé rádi pro konkrétní problémy vybírají konkrétní tooly), není problém v něm napsat interpreter nebo i překladač (do rozumného bytekódu) něčeho lepšího.

    Sice to povede ke zpomalení běhu, na druhou stranu to může zmenšit množství přenášeného kódu. Prostě JS je v oblasti prohlížečů základ, na kterém se dá stavět více způsoby: buď…

    6. 8. 2008 11:25

    Ano, obvykle jsou to uvahy od lidi, kteri nevi o co bezi. JS je skvely jazyk, podle me jeden z nejlepsich mainstreamovych jazyku. Co se tyce meho vyjadreni, samozrejme vim, ze MooTools vyrazne meni objektovy model JS, to ostatne zminuji. Myslim to tak, ze jQuery je spis takove nejake DSL, ktere si vsechno dela po svem, podle me divne ...

    Chapu, ze se Ti byznys logika v prohlizeci nelibi, podle me je ale mozna budoucnost prave takova. Slysel jsi nekdy o SproutCore? Tak to je presne o tom. Rozdho…

    Podnikatel.cz: Přehledná titulka, průvodci, responzivita

    Přehledná titulka, průvodci, responzivita

    Lupa.cz: Proč firmy málo chrání data? Chovají se logicky

    Proč firmy málo chrání data? Chovají se logicky

    Vitalia.cz: Pečete cukroví a zbyl vám bílek?

    Pečete cukroví a zbyl vám bílek?

    Vitalia.cz: Chtějí si léčit kvasinky. Lék je jen v Německu

    Chtějí si léčit kvasinky. Lék je jen v Německu

    Lupa.cz: Google měl výpadek, nejel Gmail ani YouTube

    Google měl výpadek, nejel Gmail ani YouTube

    DigiZone.cz: Flix TV má set-top box s HEVC

    Flix TV má set-top box s HEVC

    Root.cz: Certifikáty zadarmo jsou horší než za peníze?

    Certifikáty zadarmo jsou horší než za peníze?

    Vitalia.cz: Láska na vozíku: Přitažliví jsme pro tzv. pečovatelky

    Láska na vozíku: Přitažliví jsme pro tzv. pečovatelky

    Vitalia.cz: Mondelez stahuje rizikovou čokoládu Milka

    Mondelez stahuje rizikovou čokoládu Milka

    DigiZone.cz: Rádio Šlágr má licenci pro digi vysílání

    Rádio Šlágr má licenci pro digi vysílání

    120na80.cz: Rakovina oka. Jak ji poznáte?

    Rakovina oka. Jak ji poznáte?

    Podnikatel.cz: 1. den EET? Problémy s pokladnami

    1. den EET? Problémy s pokladnami

    Lupa.cz: Co se dá měřit přes Internet věcí

    Co se dá měřit přes Internet věcí

    Lupa.cz: Teletext je „internetem hipsterů“

    Teletext je „internetem hipsterů“

    Lupa.cz: Seznam mění vedení. Pavel Zima v čele končí

    Seznam mění vedení. Pavel Zima v čele končí

    Měšec.cz: Finančním poradcům hrozí vracení provizí

    Finančním poradcům hrozí vracení provizí

    Podnikatel.cz: EET: Totálně nezvládli metodologii projektu

    EET: Totálně nezvládli metodologii projektu

    120na80.cz: Horní cesty dýchací. Zkuste fytofarmaka

    Horní cesty dýchací. Zkuste fytofarmaka

    Podnikatel.cz: Víme první výsledky doby odezvy #EET

    Víme první výsledky doby odezvy #EET

    Měšec.cz: U levneELEKTRO.cz už reklamaci nevyřídíte

    U levneELEKTRO.cz už reklamaci nevyřídíte