Arhiva pentru tagul “JavaScript”

jQuery: Introducere

Există mai multe librării (sau framework-uri) JavaScript, iar jQuery (nu) este (doar) una dintre ele. Ele vin în ajutorul webdeveloperilor scutind timpi valoroşi: prin recursul la o astfel de librărie un anumit efect sau comportament într-o pagină web, în loc să necesite zeci, sute de linii de cod, se reduce la 1-2 rânduri. Desigur, acele zeci, sute de linii de cod nu dispar, se transferă doar în librăria JavaScript, dar nu avem noi dureri de cap cu scrierea ei şi în plus avem garanţia calităţii ei.

Cu jQuery, sau cu alte librării similare, anumite lucruri devin o joacă de copil. Dacă obiectivele sunt însă mai pretenţioase, jQuery nu scuteşte, ba dimpotrivă presupune ca webdeveloperul să ştie JScript, PHP/ASP, CSS, să aibă ceva noţiuni de programare obiectuală… Dacă sunteţi un începător, jQuery v-ar putea fi de folos pentru unele lucruri, inutil pentru lucruri mai avansate. Dacă sunteţi un profesionist, atunci jQuery nu …


AjaxRain: sute de „picuri”

Vă amintiţi de MiniAjax.com? Am scris în două rânduri. Din păcate proiectul pare a fi fost abandonat, sau poate este într-un concediu prelungit. Via Digg am găsit însă un "frăţior" mai puternic: AjaxRain.com. Nu doar pe Digg ci în general pe internet constat că lumea face uşor icter la două lucruri: abuzul de Ajax în titlurile de proiecte şi promovarea peste noapte în situri de succes a unor directoare al căror unic merit este că au linkuri către alte pagini.

img498

Subscriu şi nu subscriu la aceste "forme" de icter. Într-adevăr multe proiecte îşi adaugă Ajax în titlu pentru că astăzi (sau era ieri?) Ajax-ul este la modă (nu vă gândiţi la detergent… mai bine citiţi aici/aici). Şi AjaxRain nu este un director exclusiv …


Efecte pe imagini cu swfIR

De ce să introduci o imagine pur şi simplu într-o pagină când o poţi pune ca flash? Uh, o întrebare idioată, nu? Internetul este plin de flashuri, de multe ori acolo unde nu este nevoie. Mulţi webmasteri sunt anti-flash şi personal consider că o pagină cu cât conţine mai puţin flash cu atât e mai bine. Iată o posibilă excepţie: swfIR este o combinaţie de flash şi javascript care vă permite:

1) protecţia imaginilor… hmmm… exceptând că nu se poate da click dreapta pe imagine, PrintScreen e la locul lui, să trăiască; iar modificare în sursă eu nu am văzut (deci poţi afla calea)… poate am greşit ceva;

2) aplicarea unor efecte pe imagini… ei da, aici swfIR îşi poate găsi câţiva fani!

img467

Concentrându-ne deci pe ceea ce este funcţional, iată pe scurt ideea. De pe situl producătorului descărcaţi …


MooTools: framework javascript

Acest material nu se adresează celor care buchisesc încă HTML, deşi nu le este interzis. Publicul ţintă sunt acei webmasteri care au cunoştinţe cel puţin medii despre HTML dar mai ales despre JavaScript. Lor le recomand astăzi cu căldură MooTools, un compact framework javascript care permite tot felul de… lucruri. Mda, nu sunt foarte clar. De aceea recomandarea mea este să vizitaţi secţiunea demonstrativă de la MooTools.net. Dacă exemplele găsite acolo vă vor deschide apetitul, atunci reveniţi la acest articol.

img225

Aţi văzut deci cum acest cadru javascript poate permite din câteva linii de cod (categoric mai puţine decât ar fi nevoie daca am programa noi de la zero) să avem paginile cu încărcări AJAX sau cu elemente drag & drop şi alte diverse minunăţii. La fiecare demonstraţie aveţi patru linkuri mici dar esenţiale:

– docs references, de …


Picasa WebAlbums în propriile pagini!

Mă apropiu de 100 de albume – de familie – publicate online prin Picasa în Picasa WebAlbums. Îmi rămâne regretul că ele sunt externe sitului familiei. Dar cu siguranţă nu pentru mult timp. După cum era de aşteptat, au început să apară soluţii pentru a include (embed) albumele în propriile pagini. Singura mea nemulţumire este că nu am reuşit încă să împac soluţia pe care am găsit-o cu WordPress, aşa că de demonstraţie vă invit tot la un link "extern": aici. Încărcaţi şi vedeţi (în al doilea album, Negreni, sunt şi explicaţii la poze – irelevenate explicaţiile, important este că le afişează!).

Să o luăm însă cu începutul. Googlified a publicat la începutul anului o soluţie simplă. Din doar două linii de cod poţi avea incluse albumele în propriul sit! Uau, impresionant! Dar cu limitări. În primul rând, dacă folosiţi codul de …


LightWindows

Astăzi dinamicitatea siturilor este radical diferită de cea de acum 5 ani de exemplu. Ceea ce până într-o vreme făceai din n pagini, poţi încorpora într-una singură. De la apariţia ferestrelor DHTML interioare unei pagini, acestea au deschis noi orizonturi şi noi modalităţi de structurare a conţinutului. Desigur, pentru cei pasionaţi să strângă cât mai multe pagini încărcate, astfel de tehnologii nu prezintă interes. Merită să aruncaţi însă o privire la ce poate LightWindows dacă este să începeţi un nou sit sau să îl rescrieţi pe unul existent.

LightWindows se înscrie într-o serie lungă de coduri puse la dispoziţia webmasterilor prin care pot afişa astfel de ferestre (am scris în trecut de DHTML Window Widget de exemplu). Prin ce se evidenţiază atunci această soluţie? De exemplu am rămas plăcut surprins să pot vedea un clip Quicktime afişat cu o astfel de "fereastră uşoară".


JS-Kit: din două linii de cod…

JS-Kit este o extraordinară soluţie JavaScript – evident, ne spune numele – pentru webmasterii care totuşi nu stăpânesc foarte bine JavaScript. Din… atenţie… două rânduri de cod puteţi adăuga sitului Dvs facilitatea de comentarii şi/sau apreciere a paginii (excelent dacă doriţi să daţi posibilitatea discutării unor articole sau fotografii dintr-un sit al Dvs), precum şi sondaje (polls). După ce a apărut pe web acum câteva luni – parcă – soluţia s-a tot perfecţionat aşa că acum consider că liniştit pot scrie despre ea.

img132

Recunosc că am rămas perplex să văd că pentru a introduce un sondaj într-o pagină ai nevoie de doar două linii de cod. Cum se poate aşa ceva? Am studiat implementarea şi trebuie să recunosc că este foarte isteaţă: se foloseşte de cookies, şi la un mod foarte performant. Introduceţi cele două …


Google AJAX Feed API

Ieri Google a anunţat un nou API care îi va bucura pe webdeveloperi: Google AJAX Feed API. Astăzi, când tot mai mult conţinut este făcut disponibil prin feed-uri, Google pune la dispoziţie programatorilor posibilitatea de a extrage informaţii printr-un simplu cod Javascript. Pentru moment versiunea 1.0 a acestui API nu este deosebit de complexă, ceea ce pe de o parte este bine (poţi citi documentaţia în câteva minute), dar şi rău (nu sunt foarte multe facilităţi, adică metode ale clasei).

img68

Pentru a folosi acest API aveţi evident nevoie de o cheie pe care Google o pune la dispoziţie gratuit dar trebuie să indicaţi adresa sitului unde veţi folosi scriptul. Probabil prin această metodă Google vrea să urmărească popularitatea serviciului şi unde anume este folosit. Cheia constă dintr-un luuuuuuuuung şir de litere şi cifre pe care trebuie să îl …


Javascript: verificarea unui formular

Închei astăzi scurta serie ce a mai inclus Controlează ce se tastează şi Verificarea emailurilor, cu problema generică a verificării unui formular. Am văzut că putem controla ca de exemplu într-un câmp gen „anul naşterii” să se introducă doar cifre. Am văzut că putem verifica dacă textul introdus pentru o adresă de email respectă formatul unei adrese de email. Dar mai pot fi şi alte verificări, şi acestea se fac de regulă pe evenimentul onSubmit. Aceasta înseamnă că în tagul de formular adăugăm ceva de genul:

<form … onSubmit=”return verificaFormular(this);”>

În funcţia verificaFormular putem face testele, inclusiv cel privind adresa de email. La sfârşitul articolului am inclus codul integral pentru o pagină cu un formular fictiv cu trei câmpuri: nume, email şi vârstă. În funcţia verificaFormular analizăm pe rând:

– nume necompletat? formular.nume.value==””- email necompletat? formular.email.value==””- email scris incorect? validareEmail(formular.email.value)- vârstă necompletată? formular.varsta.value==””- vârstă „anormală”? formular.varsta.value>100

În fiecare dintre cazurile de eroare indicăm …


Javascript: verificarea emailurilor

După articolul de ieri despre limitarea la anumite caractere în completarea unor formulare, continui astăzi cu un alt cod Javascript (prezent la sfârşitul acestui articol), care vă permite să vă asiguraţi că ceea ce a introdus utilizatorul într-un câmp pentru email este cu adevărat o adresă de email. Dacă veţi căuta cu Google (vedeţi de exemplu această legătură) veţi găsi numeroase variante, mai elaborate sau nu.

După cum intuiţi, verificarea adresei de email presupune verificarea unor elemente: nu trebuie să existe spaţii şi alte caractere interzise (câţi oameni nu îşi scriu adresele de email astfel: ion @ popescu . ro, generându-vă erori apoi în scripturile cu care trimiteţi emailuri!); trebuie să existe obligatoriu caracterul @; de asemenea după @ trebuie să fie o succesiune validă de litere (şi alte semne permise, gen – sau _) un punct şi apoi două sau trei litere (nici mai mult, nici mai …