Archive for December, 2008

Framework-uri JavaScript: AJAX cu jQuery

La fel cum MooTools avea un mod generic de a face cereri AJAX, dar si cateva scurtaturi pentru cazuri comune, la fel si jQuery ne ofera un mod generic si cateva scurtaturi.

In cazul cel mai generic, se foloseste metoda ajax din namespace-ul jQuery/$: $.ajax, care primeste ca parametru un hash de optiuni (cele mai multe asemanatoare cu cele de la MooTools) si intoarce instanta de XHR folosita pentru cererea creata (dar care in mod normal nu va fi folosita decat daca se vrea revocarea manuala a cererii – de exemplu la interactiunea cu utilizatorul). Aceste optiuni (vezi si documentatia) sunt:

Read the rest of this entry »

, , ,

2 Comments

Cheat Sheet-uri pentru MooTools si jQuery

Disponibile aici (MooTools), respectiv aici (jQuery)

, , ,

No Comments

Framework-uri JavaScript: Evenimente in jQuery

Adaugarea de ascultatori la evenimente in jQuery se face apeland asupra unui set jQuery metoda bind: $().bind. Aceasta primeste trei parametri, dintre care al doilea este optional (pana acum, cand vorbeam de elemente optionale, acestea erau ultimele in lista de parametri), si ataseaza ascultatorul pentru fiecare element din set. Primul parametru este un string – tipul evenimentului, la fel ca la evenimentele DOM2, sau mai multe astfel de tipuri de evenimente separate intre ele de spatii (in caz ca vrem sa atasam acelasi ascultator pentru mai multe tipuri de evenimente). Al doilea parametru poate avea orice tip si va fi disponibil in parametrul transmis functiei ascultator, campul data al acestuia. Totusi, de cele mai multe ori nu va fi nevoie de date aditionale, din moment ce obtinem cam toate informatiile de care avem nevoie din parametrul trimis functiei ascultator. Functia ascultator este al treilea parametru; ar trebui sa astepte ca parametru un obiect asemanator cu instantele de Event nativ al JS (dar nu sunt instante de Event, pentru ca, asa cum am mai spus, jQuery nu modifica niciun obiect nativ). Asta inseamna ca va avea toate campurile din Event-ul DOM2 (sau cel putin, toate campurile care aveau si un echivalent in window.event-ul din IE). Este normalizat, astfel ca este disponibil si in IE (deci nu e nevoie sa lucram cu window.event, iar campurile acestui parametru vor fi cele din DOM2, chiar si in IE). Un lucru foarte interesant este ca atunci cand adaugam ascultatori de evenimente, putem crea namespace-uri pentru acei ascultatori. Astfel, daca apelam $().bind('click.namespaced',function (event) { /* ... */ }); am creat un namespace cu numele namespaced. Asta ne va ajuta sa stergem ascultatori la evenimente, cum vom vedea imediat.

Read the rest of this entry »

, , ,

No Comments

Daca limbajele de programare ar fi religii…

Nu prea are legatura cu interfetele web, dar totusi este fun to read:

If programming languages were religions

, ,

No Comments

Framework-uri JavaScript: Introducere in jQuery + Manipularea DOM cu jQuery

Daca pentru MooTools am inceput cu prezentarea modului in care sunt tratate/extiunse obiectele si am vazut cum ne ajuta in programarea functionala, atunci cand vorbim de jQuery, aceasta discutie este foarte scurta. Pe scurt: jQuery nu extinde obiectele native JavaScript – niciunul dintre acestea. In schimb, jQuery ofera propriile sale obiecte pe care sa lucram. Asta inseamna ca nu avem la dispozitie nici metode avansate de programare functionala, si trebuie sa ne descurcam cu Function.call si Function.apply.

In schimb, domeniul in care jQuery isi face treaba excelent, este manipularea DOM. Cel mai important element in programarea cu jQuery il reprezinta setul incapsulat de elemente DOM (eng. wrapped set).

Read the rest of this entry »

, , , ,

No Comments

Framework-uri JavaScript: AJAX cu MooTools

La baza cererilor AJAX in MooTools, sta obiectul (sau clasa, in terminologia MooTools) Request. Cu toate ca am vazut ca folosirea obiectului nativ JS XMLHttpRequest este aceeasi in toate browserele (cu exceptia instantierii), folosirea de cereri AJAX cu MooTools este o placere.

Read the rest of this entry »

, , , ,

No Comments

Framework-uri JavaScript: Evenimente in MooTools

Din fericire, discutia despre evenimente in MooTools va fi mai scurta (mult mai scurta decat cea despre manipularea DOM), si iata de ce: MooTools incearca sa pastreze lucrurile cat mai aproape de JavaScript normal atunci cand poate: daca exista deja metode native pentru a face ceva, dar aceste metode nu sunt implementate in toate browserele, atunci MooTools creaza metode care au aceeasi denumire cu cele native (sau cel putin apropiate) iar parametri trimisi sa fie in aceeasi ordine si cu aceeasi semnificatie ca in cazul metodelor native. De exemplu, metodele adaugate obiectului Array in JavaScript 1.6 sunt implementate de MooTools in asa fel incat sa fie disponibile in toate browserele (singura care nu este implementata este Array.lastIndexOf, si singura metoda cu nume diferit este Array.each – in JS 1.6 aceasta se numeste Array.forEach).

Read the rest of this entry »

, , , , , ,

No Comments

Framework-uri JavaScript: Manipularea DOM cu MooTools

Asa cum am promis, sa vedem cum putem manipula DOM-ul cu MooTools. Prima functie, $ (da, este vorba doar de simbolul dolar – cum spuneam data trecuta, acesta este un caracter valid, in JavaScript, pentru numele de variabile) este oarecum echivalenta cu document.getElementById. Insa, daca va hotarati sa manipulati DOM-ul cu MooTools, este absolut necesar sa folositi $ si nu document.getElementById, si iata de ce: toate browserele non-IE permit modificarea prototipului obiectului Element, insa IE nu permite asta. Asa ca, folosind $, este returnata o instanta modificata de Element – ii sunt adaugate toate metodele si toti membrii care pentru celelalte browsere ar fi fost adaugate prin modificarea prototipului. In plus, $ accepta ca parametru nu numai id-ul unui element DOM, ci chiar si o instanta de Element care a fost sau nu obtinuta de MooTools. Daca instanta respectiva a fost obtinuta tot prin MooTools, este returnata elementul fara nicio modificare, altfel ii sunt adaugate proprietatile si metodele necesare. Ca sa intelegeti ce vreau sa spun:

Read the rest of this entry »

, , , , , ,

No Comments

Framework-uri JavaScript: Programare functionala in MooTools

Am amintit cand am vorbit prima data de JavaScript, de notiunea de inchidere. Aceasta notiune este esentiala in programarea functionala; cu toate ca nu am spus-o explicit atunci, dar JavaScript este un limbaj de programare functionala. MooTools face si mai usor folosirea conceptelor din programarea functionala, prin extinderea clasei native Function. Cei care nu au cunostinte de programare functionala s-ar putea sa nu inteleaga mare lucru din explicatiile de mai jos, asa ca, deocamdata, pot trece linistiti peste ele. Ne sunt puse astfel la dispozitie urmatoarele metode:

Read the rest of this entry »

, , , ,

1 Comment

Framework-uri JavaScript: Clase in MooTools

Acum ca am vazut cateva caracteristici ale framework-ului MooTools, sa vedem cum putem implementa mostenirea.

Read the rest of this entry »

, , ,

No Comments