JavaScript

JavaScript este, dupa cum reiese si din numele sau, un limbaj de scripting. A aparut in 1995 fiind creatia lui Brendan Eich, care in aceea vreme lucra la Netscape (pe atunci cel mai popular browser). Denumirea de Java din numele limbajului nu are nici o treaba cu produsul celor de la Sun. Aceasta a fost adaugata din ratiuni strict legate de marketing.
Pana la aparitia JavaScript codul paginilor web dinamice era rulat numai pe server clientul urmand sa primeasca inapoi o pagina HTML modificata coresounzator. Acest lucru implica faptul ca un client facea o cerere catre un server, acesta prelucra cererea (executa orice cod dinamic), forma un raspuns continand pagina HTML generata anterior si o trimitea la client. Astfel o operatie simpla de validare a unui camp text (de exemplu verificarea ca acesta sa contina ceva) necesita un drum la server si inapoi. Daca pagina primita era destul de mare combinat cu niste conexiuni slabe la Internet, se pierdea timp si interactivitatea paginii web devenea din ce in ce mai scazuta.
Aparitia limbajului JavaScript a permis posibilitatea crearii paginilor dinamice al caror continut se modifica prin rularea de cod pe masina clientului. Codul era evident scris in JavaScript si trebuia ca browserul folosit sa cunoasca acest limbaj. Acum pentru verificarea unui camp text din pagina codul putea fi rulat de browser pe client fara a mai necesita o cerere catre server. Astfel a aparut termenul de client-side scripting (script rulat pe masina clientului) diferit de server-side scripting (script rulat pe server). Singura problema era ca browserul folosit sa cunoasca acest limbaj. Aceasta s-a rezolvat de la sine datorita cresterii masive in popularitate a JavaScript-ului, fiecare nou producator de browsere integrand-ul in produsul sau. Desigur nu se poate face orice cu JavaScript multe operatii necesitand executarea codului pe server. De aceea in prezent sunt folosite pagini web ce contin scripturi client-side si server-side.
Sintaxa JavaScript este destul de simpla. Variabilele nu au tipuri, din acest punct de vedere acesta nefiind un limbaj foarte type-safe, constructiile fiind uneori destul de rudimentare. Este case-sensitive. Daca se intalneste de exemplu o functie necunoscuta executa este oprita in acel punct Blocurile sunt delimitate de binecunoscutele acolade din alte limbaje ({}). JavaScript suporta si niste tipuri primitive de clase si de asemenea un obiect central in acest limbaj este document. Cu ajutorul acestuia se pot obtine referiri la toate obiectele existente in pagina web (de la controale la div-uri). Daca de exemplu se seteaza proprietatea id pentru un control la valoarea "control", se poate obtine o referinta la acesta astfel:
var ctrl = document.getElementById("control");
In functie de controlul obtinut se pot accesa si alte proprietati. De exemplu pentru un control de tipul text, continutul acestuia poate fi extras prin intermediul proprietatii value.
var content = ctrl.value;
Pentru un div continutul poate fi extras prin innerHTML in loc de value.
O alta utilizare pentru JavaScript este posibilitatea tratarii evenimentelor. Astfel se poate asocia unui buton un eveniment reprezentat de o functie JavaScript. Cand acel buton este apasat va fi executata functia. Asocierile dintre evenimente si functiile JavaScript se fac in HTML in momentul definirii componentelor. De exemplu in cazul unui buton:
<input type="button" onclick="functieJavaScript()">
Exista binenteles mai multe evenimente posibile pentru fiecare control existent.
JavaScript a fost readus in prim plan printre limbajele de client-side scripting atentie (nu ca pana acum nu ar fi fost) de aparitia tehnologiei AJAX ce permite incarcarea selectiva a elementelor unei pagini web prin intermediul JavaScript. Despre aceasta intr-un alt post.

A aparut enuntul temei 3

Pentru cei interesati a aparut enuntul temei 3 la http://interfeteweb.pluto.ro/tema3.html. Detalii despre rezolvare vor aprea in curand.

Aventura mea cu CTTE

Pentru cei care au trait sub o piatra pana acum si inca nu stiu :D, CTTE sau The Concurrent Task Tree Environment o aplicatie pentru modelarea interfetelor grafice si poate fi gasita la http://giove.cnuce.cnr.it/ctte.html. Despre descrierea temei a scris mai jos colegul meu Florian motiv pentru care ma voi referi in acest post mai mult la "aventura mea" (a se citi probleme intampinate) cu CTTE in incercarea de a realiza tema 2 la interfete evoluate. In primul rand trebuie mentionat un lucru foarte important aplicatia este free deci nu trebuie sa fim surprinsi daca gasim diverse buguri. In primul rand in momententul deschiderii aplicatiei va ramane deschis si un "command prompt", pe care va recomand cu caldura sa il inspectati destul de des deoarece s-ar putea sa va treziti cu o groaza de exceptii aruncate acolo moment in care salvati si restartati aplicatia. In primu rand in momentul in care deschizi aplicatia poti observa un norisor care reprezinta un task complex (ideea de norisori nu prea e pe gustul meu deoarece imi creaza impresia de aplicatie neprofesionista dar trecem peste asta). Ce m-a surprins inca de la inceput a fost faptul ca daca dai click pe diverse butoane nu iti nu intampla absolut nimic (un mesaj de eroare mi se parea absolut natural). Am lasat deoparte aceste mici neajunsuri care nu ma mira la o aplicatie free si am inceput sa creez graful de task-uri. La un moment dat m-am trezit inundat de exceptii in command prompt motiv pentru care am salvat rapid si am restartat aplicatia (de fapt a fost nevoie sa incerc sa salvez in vreo 3 fisiere diferite pentru ca nu salva bine...). Desi a mai crapat de cateva ori am avut rabdare si cu putina perseverenta am reusit sa definitivez tema (bineinteles ca mi-a mai crapat de cel putin 5 ori...). Dupa realizarea temei pot spune ca ideea ei nu a fost rea. Am invatat sa modelam o interfata lucru care pare destul de natural la o materie care se numeste "interfete evoluate". Legat de erorile aparute pot spune ca in 5 ani de facultate am avut ocazia sa lucrez cu tot felul de aplicatii care crapau din te miri ce (chiar acum cateva zile in cadrul laboratorului de LPD mi-a crapat linuxul in timp ce incercam sa instalez netbeans ..., sau cazul xilinx ise care desi costa destul crapa des) parca totusi ctte a intrecut orice limita. In concluzie in opinia mea ideea temei a fost buna dar aplicatia folosita mi s-a parut cam slaba.
P.S.: E 1 jumate noaptea, cred ca o sa am cosmaruri cu CTTE .......

Liviu Matei

The Concurrent Task Tree Environment (CTTE) - probleme

Tema 2 la IE (http://interfeteweb.pluto.ro/tema2.html) se referă la proiectarea interfeţei utilizatorului uman cu siteul blogger.com utilizând CTTE. CTTE (The Concurrent Task Tree Environment) este o unealtă care permite editarea şi simularea modelelor orientate pe sarcini, făcând astfel posibilă descrierea interfeţei cu utilizatorul înainte ca aplicaţia propriu-zisă să fie gata.
Interfaţa cu utilizatorul are o structură sub formă de arbore. Elementele arborelui sunt sarcinile, care sunt legate între ele prin diverse relaţii.
CTTE se găseşte la adresa http://giove.cnuce.cnr.it/ctte.html. Pentru a putea folosi ultima versiune, este nevoie de Java 1.5, iar calea către fişierul java.exe trebuie adaugată în PATH. Pentru rulare se foloseşte ctte.bat.
Nu voi descrie aici modul de folosire, deoarece acesta se găseşte pe site-ul produsului, ci voi semnala problemele întâlnite şi voi da anumite sfaturi pentru a lucra ma uşor cu acest program.
Uneori funcţia de salvare nu funcţionează corespunzător, astfel că la deschidera unui fişier salvat anterior ultimele noduri adăugate lipsesc. Pentru a evita astfel de surprize Putem încerca să salvăm cât mai des. La adăugarea unor noi noduri în arbore nodurile anterior adăugate iau nişte poziţii contorsionate. Acest neajuns se poate corecta într-o anumită măsură apăsând butonul "Justify Tree" sau manual dacă suntem mai pretenţioşi. Pentru a muta/copia un subarbore trebuie să selectăm "Cut/Move SubTree". Dacă selectăm "Cut/Copy Selection", la lipire toate nodurile din subarborele respectiv va fi transformate în fraţi. Dacă vrem să mutăm o sarcină trebuie să facem acest lucru foarte încet, altfel o vom pierde pe drum. Uneori când vrem să simulăm un model, programul va da nişte erori, în condiţiile în care verificarea modelului nu dă nicio eroare. Soluţia este închiderea CTTE şi repornirea lui. O alta problema e cand arborele nu mai arata a arbore :) si nodurile incep sa dispara unul dupa altul.
Cu siguranţă ideea acestui program este foarte bună şi cu puţină răbdare putem trece peste aceste probleme de implementare, care sperăm că vor fi corectate la versiunile următoare.

Stan Alexandru

Ce este Web 2.0 ?

Un posibil raspuns la intrebarea "Ce este Web 2.0 ?":

Tema 2

Tema 2, dupa cum putei afla pe http://interfeteweb.pluto.ro/tema2.html, se refera la descrierea interactiunilor dintre un utilizator si interfata siteului www.blogger.com din punctele de vedere al utilizatorului (cititorul de blog) si al administratorului unui blog.
Pentru fiecare din acestia s-au descris niste scenarii pentru urmatoarele activitati:
- utilizator : vizualizare post,adaugare comentariu, vizualizare lista de posturi, vizualizare categorii
- administrator : adaugare post, adaugare link in blogroll, editare link

Voi lua pe rand fiecare scenariu enumerand pasii necesari pentru completarea acestuia. Intr-un post ulterior se va prezenta semnificatia CTTE si “mediul de lucru” in care a fost rezolvata tema subliniind unele din “facilitatile” acestuia.

Utilizator

Toate actiunile utilizatorilor au loc in pagina de start a unui blog.
- vizualizare lista post : pentru aceasta actiune am presupus (pentru ca enuntul nu este foarte clar in a preciza mai exact ce inseamna sa vizualizezi posturile) ca utilizatorul vrea sa vada posturile dintr-o anumita luna a unui an. Pasii sunt urmatorii: userul selecteaza un an din arhiva de bloguri -> se afiseaza lunile din anul respectiv care au posturi -> userul selecteaza o luna din lista -> sunt afisate posturile.
- vizualizare categorii : aici am presupus ca se folosesc tagurile din posturi. Pasul : userul da clik pe un tag ce reprezinta o categorie -> se afiseaza posturile din acea categorie.
- vizualizare post : userul poate incepe fie prin pasii precedenti fie direct din pagina de start a blogului. Pasul : userul da clik pe un post -> se afiseaza postul.
- adaugare comentariu : se pleaca de la un post deja afisat. Pasii : se da click pe trimtere comentariu -> se introduce comentariul -> se introduce codul de verificare -> se stabileste identitatea intre doua tipuri (BloggerID -> se introduc user si parola; OpenID -> alegere tip id -> alegere nume)

Administrator

Toate actiunile au loc din pagina de administrare in urma logarii administratorului.
- adaugare post : se alege postare noua -> editare postare -> introducere titlu -> publicare
- adaugare link in blogroll : se alege optiunea aspect din pagina de administrare -> alegere editare blogroll -> alege adauga -> introducere URL -> click pe adauga -> click pe salvare
- editare link : aici am presupus ca se editeaza un link din blogroll. Pasii : se alege optiunea aspect din pagina de administrare -> alegere editare blogroll -> alege redenumire -> modificare nume -> click pe salvare redenumire -> click pe salvare.