Ferestrele sunt cele mai importante elemente de interfata in browser, iar JavaScript ofera multe modalitati de a le manipula.
In acesta lectie veti invata despre obiectul window, proprietatile si metodele acestuia, cum sa creati noi ferestre (pop-up) si sa le inchideti.

1. Proprietatile si metodele obiectului window

Un browser (indiferent de nume sau producator) este prezentat intr-o fereastra si tot ceea ce utilizatorul face cu browserul se executa in interiorul acelei ferestre. Toate elementele unei pagini web sunt de asemenea continute in fereastra respectiva.
Obiectul "Window" este considerat obiectul de nivel ierarhic cel mai inalt in ierarhia obiectelor JavaScript pe partea de client si contine toate celelalte obiecte pe partea de client (cu exceptia obiectului "navigator", conceptual diferit, nefiind un element propriu-zis vizual). Dupa cum în practica se poate lucra cu mai multe ferestre deschise simultan, la fel se poate lucra si cu mai multe obiecte "Window" (de fapt cate unul pentru fiecare fereastra).
Obiectul "Window" se creaza automat atunci cand se deschide o noua fereastra de browser.
Atentie sa nu confundati ferestrele distincte de browser cu cadrele (frame-urile), care de asemenea mai sunt numite ferestre (fiind de fapt subferestre ale ferestrei de browser).
Ca si celelalte obiecte si "Window" are o serie de proprietati si metode. Fiind obiectul de nivelul cel mai inalt unele dintre acestea pot fi apelate sau se poate face referire la ele fara a folosi in fata lor expresia "window." (cum e de exemplu metoda "alert()").

Obiectul window are urmatoarele proprietati:

- closed - specifica daca instanta "window" a fost inchisa
- crypto - permite accesul la caracteristicile de criptare din Netscape
- defaultStatus - specifica mesajul prestabilit in bara de stare a ferestrei
- document - mentioneaza toate informatiile despre documentul din aceasta fereastra
- frames - mentioneaza toate informatiile despre cadrele din aceasta fereastra
- history - mentioneaza adresele URL vizitate de utilizator in fereasrtra curenta
- innerHeight - contine inaltimea in pixeli a zonei afisate din fereastra curenta
- innerWidth - contine latimea in pixeli a zonei afisate din fereastra curenta
- length - reprezinta numarul de cadre din fereastra curenta
- location - contine adresa URL curenta incarcata in browser
- locationbar - face referire la bara de locatie a browserului
- locationbar.visible - contine valoarea booleana care indica daca bara de locatie de pe browserul utilizatorului este vizibila
- menubar - face referire la bara de meniuri a browserului
- menubar.visible - contine valoarea booleana care indica daca bara de meniuri de pe browserul utilizatorului este vizibila
- name - contine numele ferestrei
- offscreen-Buffering - contine o valoare booleana care ne permite sa determinam daca vreo actualizare a ferestrei este executata intr-un buffer din afara ecranului
- opener - contine numele ferestrei din care a fost deschisa o fereastra secundara
- outerHeight - contine inaltimea in pixeli a suprafetei din exteriorul ferestrei curente
- outerWidth - contine latimea in pixeli a suprafetei din exteriorul ferestrei curente
- pageXOffset - contine coordonata X a ferestrei curente
- pageYOffset - contine coordonata Y a ferestrei curente
- parent - face referire la fereastra de nivelul cel mai inalt care afiseaza cadrul curent
- personalbar - mentioneaza informatii despre bara personala a browserului
- personalbar.visible - contine valoarea booleana care indica daca bara personala de pe browserul utilizatorului este vizibila
- screenX - face referire la coordonata X a browserului, din marginea stanga a ferestrei (Netscape)
- screenY - face referire la coordonata Y a browserului din marginea de sus a ferestrei
- scrollbars - face referire la barele de derulare ale browserului
- scrollbars.visible - contine valoarea booleana care indica daca barele de derulare de pe browserul utilizatorului sunt vizibile
- self - face referire la fereastra curenta
- status - face referire la mesajul de pe bara de stare a ferestrei
- statusbar - face referire la bara de stare a browserului
- statusbar.visible - contine valoarea booleana care indica daca bara de stare a browserului utilizatorului este vizibila
- toolbar - face referire la bara de instrumente a browserului
- toolbar.visible - contine valoarea booleana care indica daca bara de instrumente a browserului utilizatorului este vizibila
- top - face referire la fereastra de nivelul cel mai inalt care afiseaza cadrul curent
- window - face referire la fereastra curenta

Obiectul window are urmatoarele metode:

- atob() - decodifica un sir care a fost codificat in baza 64
- alert() - afiseaza o fereastra de avertizare cu un anumit sir de text
- back() - incarca o pagina anterioara vizitata in fereastra curenta
- blur() - dezactiveaza o fereastra
- btob() - codifica un sir in baza 64
- captureEvents() - stabileste ca fereastra sa captureze toate evenimentele de un tip specificat
- clearInterval() - sterge intervalul stabilit cu metoda "setInterval()"
- clearTimeout() - sterge pauza stabilita cu metoda "setTimeout()"
- close() - inchide fereastra
- confirm() - afiseaza o fereastra de confirmare
- crypto.random() - genereaza un sir aleator de date, a carui lungime este specificata de numarul de octeti transferati
- crypto.signText() - intoarce un sir de date codificate care reprezinta un obiect semnat
- disableExternalCapture() - dezactiveaza capturarea unui eveniment extern
- enableExternalCapture() - activeaza capturarea unui eveniment extern pentru paginile incarcate din alte servere
- find() - afiseaza o caseta de dialog "Find" in care utilizatorul poate introduce text pentru cautare in pagina curenta
- focus() - activeaza instanta "window" specificata
- forward() - incarca urmatoarea pagina in locul paginii curente din fereastra
- handleEvent() - apeleaza handlerul pentru evenimentul specificat
- home() - incarca pagina de baza specificata a utilizatorului in locul paginii curente din browser
- moveBy() - deplaseaza fereastra cu valoarea specificata
- moveTo() - deplaseaza fereastra in locatia specificata
- open() - deschide o noua instanta a unei ferestre
- print() - apeleaza caseta de dialog "Print" astfel ca utilizatorul sa poata tipari fereastra curenta
- prompt() - afiseaza o fereastra cu caseta de dialog "prompt"
- releaseEvents() - elibereaza evenimentele capturate de un tip specificat
- resizeBy() - redimensioneaza fereastra cu valoarea specificata
- resizeTo() - redimensioneaza fereastra la valoarea indicata
- routeEvent() - transfera evenimentele de un tip specificat pentru a fi tratate nativ
- scroll() - deruleaza documentul in fereastra pana la o locatie specificata
- scrollBy() - deruleaza documentul in fereastra cu o valoare specificata
- scrollTo() - deruleaza documentul pe latime si inaltime pana la o locatie specificata din fereastra
- setHotKeys() - permite comutarea intre activarea si dezactivarea tastelor de selectare rapida cand nu sunt prezente meniuri
- setInterval() - apeleaza o functie sau evalueaza o expresie la intervale de timp (constand intr-un anumit numar de milisecunde)
- setResizeable() - permite specificarea posibilitatii redimensionarii unei ferestre
- setTimeout() - apeleaza o functie sau evalueaza o expresie dupa un anumit numar de milisecunde
- setZOptions() - permite specificarea asezarii in ordinea Z (tridimensionala) a unei ferestre
- stop() - opreste fereastra curenta sa incarce alt element in ea

2. Crearea ferestrelor pop-up (metoda open)

Folosind JavaScript puteti deschide o noua fereastra in care se incarca o pagina HTML, cu dimensiuni, pozitie si proprietati stabilite de dv.. Aceste ferestre mai sunt numite si ferestre pop-up.
Pentru a crea o astfel de fereastra puteti folosi metoda "open", avand urmatoarea sintaxa:

open("URL", "nume", "proprietati")

Unde :

- URL - reprezinta adresa documentului care va fi afisat in fereastra (e optional)
- nume - este un sir care specifica numele ferestrei (e optional)
- proprietati - este o lista de proprietati ale ferestrei (dimensiune, pozitionare, si altele). (e optional) Proprietatile trebuie sa fie separate prin virgula si fara spatii intre ele.

Urmatorul script deschide o noua fereastra (numita si pop-up) care are dimensiunile 400x300 pixeli. Fereastra nu are bara de instrumente, bara de stare sau bara de meniu si va fi deschisa la o distanta de 200 pixeli fata de marginea din stanga si 100 pixeli fata de marginea de sus.

<script type="text/javascript">

</script>
<form>
<input type="button" value="Deschide fereastra" onclick="open_window()">
</form>

- Butonul "Deschide fereastra" apeleaza, la click, functia "open_window()" care prin variabila "fereastra" executa metoda "open()", aceasta va deschide o fereastra noua cu proprietatile adaugate in metoda.
- Observati ca "fereastra" nu este numele ferestrei. Puteti accesa fereastra prin intermediul acestei variabile. Aceasta este o variabila normala care este valabila numai în interiorul unui script. Numele ferestrei (aici "numeFereastra") este un nume unic care poate fi folosit de toate ferestrele browserului.
Adaugand acest cod intr-un document HTML, in browser veti avea un buton ca cel de jos.

- Cand apasati pe buton, se va deschide o fereastra pop-up cu proprietatile specificate in metoda "open()".

3. Inchiderea ferestrelor (metoda close)

Pentru inchiderea unei ferestre se foloseste metoda close(). In fereastra pe care dorim sa o inchidem cu aceasta metoda adaugam un element de legatura <a> (link) sau un buton in care adaugam un eveniment "onClick" care executa metoda "close()" (sau "self.close()"), ca in exemplul urmator:

<a href="#" onclick="self.close()">Inchide</a>

sau

<form>
<input type="button" value="Inchide" onclick="self.close()">
</form>

Cele doua elemente de inchidere a ferestrei au fost adaugate in pagina care se deschide cu fereastra pop-up din exemplul anterior.

open() si close() sunt metode ale obiectului "window". Normal am scrie window.open() si window.close(), dar obiectul "window" este o exceptie. Nu trebuie scris cuvantul "window" daca se apeleaza o metoda a unui obiect fereastra (aceasta este valabil numai pentru obiectul window).