Javascript - cum sa citest dintr-un fisier

Download exemplu

In unele interfete web este nevoie sa se poata deschide si incarca fisiere locale. Un exemplu bun este Google Docs unde incarci un fisier local si il stochezi/editezi online.

Pentru Internet Explorer deschiderea unui fisier html si afisarea lui s-ar face cam asa:

- In primul rand cream un buton de browse:

< form name=form1>
< input type=file name="browse" onChange="afisare()" onClick="sterge()">
< /form>

- Spatiul din pagina in care se va face afisarea este un container: < div id ="test">

- Deschiderea si citirea din fisier se va face cu ajutorul ActiveXObject de tipul FileSystemObject si functiei OpenTextFile:

var myFileSysObj = new ActiveXObject("Scripting.FileSystemObject");
var myInputTextStream = myFileSysObj.OpenTextFile(document.form1.browse.value, 1, true);
if(myInputTextStream.AtEndOfStream)
{
alert("file is empty");
sterge();
return;
}
var str = new String(myInputTextStream.ReadAll());
var d = document.getElementById('test');
d.innerHTML=str;
myInputTextStream.Close();

- Numele fisierului l-am extras din campul browse document.form1.browse.value si inainte de a citi tot fisierul myInputTextStream.ReadAll() am verificat daca fisierul nu e gol sau s-a ajuns la capatul stream-ului if(myInputTextStream.AtEndOfStream), caz in care ReadAll ar fi generat eroare.

Fisierul fiind deschis intr-un string, acum fisierul poate fi modificat sau se pot face cautari utilizand proprietatile si functiile obiectelor de tip string ca de exemplu: str.length, str.slice(start_index, stop_index), str.lastIndexOf(string, start_index), str.indexOf(string,start_index), str.substr(start_index,nr_of_char)

Un alt obiect foarte util pentru prelucrarea stringurilor in javascript este RegExp pentru utilizarea expresiilor regulate. Crearea unui obiect RegExp se poate face asa:

var myregexp = /regex/;
sau
re = new RegExp("\\w+");
Un exemplu de utilizare combinata a obiectelor String si RegExp ar fi urmatoarul:
myString.replace(myregexp, "replacement")

Gadget-uri pentru interfete web

Intr-un articol anterior vorbeam despre cat de usor se poate face o pagina web cu ajutorul CMS. Exista de asemena si template-uri de pagini web care pot fi descarcate gratuit si adaptate pentru a obtine rapid un site care arata bine.

Dar cum putem face un site/blog sa fie mai cool fara sa pierdem prea mult timp?
Foarte simplu...adaugam niste gadeget-uri, adica dam copy/paste la bucati de cod deja scrise pe care le includem in paginile noastre. Ca sa fiu mai explicita voi da cateva exemple de gadget-uri foarte utilizate si o sa povestesc pe scurt si cum facem rost de ele:

1. Pe Google Gadgets gasiti tot felul de gadget-uri: ceasuri, mp3playere, calendare, tool-uri financiare, harti, countere etc. Mie mi-a placut un paianjen care se plimba asa ca am selectat gadget-ul am dat click pe Get the Code si apoi am dat copy/paste in articol.



Si acum avem si un mic pet al blog-ului nostru care urmareste mouse-ul:)


2. Pentru a avea o pagina web foarte animata putem adauga si animatii in flash. Se descarca un fisier swf si se scrie in sursa paginii web ceva de genu: "<"embed width="" height="" src="numefisier.swf"> "<"/embed>. Cele mai des utilizate sunt bannerele si paginile de start animate in flash. Eu am adaugat un joculet recomandat de frate-miu...Atentie e violent deci nerecomandat copiilor:)



3. Alt gadget foarte popular este mini-playerul youtube. Foarte multa lume vrea sa-si puna pe blog o melodie, un filmulet funny sau o secventa din emisiunea lui mircea badea. Cel mai simplu e sa intri pe youtube, sa cauti filmuletul si sa dai copy/paste la codul scris in casuta "Embed". Eu am gasit o melodie foarte draguta tot pe un blog in timp ce imi faceam prima tema la IE:)



4. In general pentru a face o pagina mai dinamica si mai interactiva se utilizeaza javascript si ajax. Cel mai funny exemplu de cat de departe se poate merge cu javascript este DHTML lemmings