root/java/sql-vyuka/web/hlavni.js @ 41:28b38fb1391b

Revision 41:28b38fb1391b, 5.9 KB (checked in by František Kučera <franta-hg@…>, 15 years ago)

Experimentální implementace historie – fungují tlačítka zpět a vpřed v prohlížeči i v aplikaci (v navigační liště), ale nepracuje úplně správně.
Běží v nekonečné smyčce s čekáním 200 ms. Procházení historie nemění SQL příkaz (záměrně), ale přesto někdy nepracuje tak, jak se čeká.

Line 
1/** ID html prvků */
2const vstupniPole = 'vstupniPole';
3const vystupniPole = 'vystupniPole';
4const napovedniPole = 'napovedniPole';
5const stavovePole = 'stavovePole';
6
7
8/**
9 * Aby to fungovalo i v MSIE 6.
10 * @return AJAXový objekt.
11 */
12function getXmlHttpRequestObject() {
13    if (window.XMLHttpRequest) {
14        return new XMLHttpRequest();
15    } else if(window.ActiveXObject) {
16        return new ActiveXObject("Microsoft.XMLHTTP");
17    } else {
18        alert(document.lokalizace.nepodporovany.value);
19        return null;
20    }
21}
22
23
24/** Náš AJAXový objekt. */
25var ajax = getXmlHttpRequestObject();
26
27
28/**
29 * Vrací vstup od uživatele.
30 * @return SQL příkaz zadaný uživatelem.
31 **/
32function getSQL() {
33    return document.aplikace.vstupniPole.value;
34}
35
36
37/**
38 * Zobrazí text na požadovaném místě.
39 * @param text text k zobrazení. V případě formulářů prostý text, v ostatních případech HTML text.
40 * @param kde id prvku, do kterého se má text vypsat.
41 **/
42function zobraz(text, kde) {
43    if (kde == vstupniPole) {
44        document.aplikace.vstupniPole.value = text;
45    } else if (kde == stavovePole)  {
46        document.aplikace.stavovePole.value = text;
47    } else {
48        document.getElementById(kde).innerHTML = text + '<p>&nbsp;<!-- Šťastné hackování ;-) --></p>';
49    }
50}
51
52
53/** Jednoduchá AJAXová funkce, načte obsah souboru a zobrazí ho ve výstupním okně. */
54function ajaxVykonatSQL() {
55    if (ajax.readyState == 4 || ajax.readyState == 0) {
56        zobraz(document.lokalizace.probihaSQL.value, stavovePole);
57        ajax.open("POST", 'ajax.jspx?akce=vykonat&sql=' + encodeURIComponent(getSQL()), true);
58        ajax.onreadystatechange = function() {
59            if (ajax.readyState == 4) {
60                zobraz(ajax.responseText, vystupniPole);
61                zobraz('', stavovePole);
62            }
63        };
64        ajax.send(null);
65    }
66    ulozURL();
67}
68
69
70/** Jednoduchá AJAXová funkce, načte obsah souboru a zobrazí ho ve výstupním okně. */
71function ajaxZobrazitHistorii() {
72    if (ajax.readyState == 4 || ajax.readyState == 0) {
73        zobraz(document.lokalizace.probihaHistorie.value, stavovePole);
74        ajax.open("POST", 'ajax.jspx?akce=historie', true);
75        ajax.onreadystatechange = function() {
76            if (ajax.readyState == 4) {
77                zobraz(ajax.responseText, vystupniPole);
78                zobraz('', stavovePole);
79            }
80        };
81        ajax.send(null);
82    }
83}
84
85var pruvodceAktualniId = 0;
86var urlOdkaz = new Array();
87urlOdkaz['pruvodce'] = null;
88
89function ajaxPruvodcePredchozi() {
90    ajaxPruvodceNaviguj('predchozi', pruvodceAktualniId, null);
91}
92
93function ajaxPruvodceZpet() {
94    try {
95        window.back();
96    } catch (e) { }
97}
98
99function ajaxPruvodceVpred() {
100    try {
101        window.forward();
102    } catch (e) { }
103}
104
105function ajaxPruvodceNasledujici() {
106    ajaxPruvodceNaviguj('nasledujici', pruvodceAktualniId, null);
107}
108
109function ajaxPruvodceKod(kod) {
110    ajaxPruvodceNaviguj('podleKodu', 0, kod);
111}
112
113function ajaxPruvodceId(id) {
114    ajaxPruvodceNaviguj('podleId', id, null);
115
116}
117
118function ajaxPruvodceNaviguj(akcePruvodce, id, kod) {
119    navigaceProhlizecem = false;
120    if (ajax.readyState == 4 || ajax.readyState == 0) {
121        ajax.open("POST", 'ajax.jspx?akce=napoveda&pruvodce=' + encodeURIComponent(akcePruvodce) + '&idPruvodce=' + encodeURIComponent(id) + '&kodPruvodce=' + encodeURIComponent(kod), true);
122        ajax.onreadystatechange = function() {
123            if (ajax.readyState == 4) {
124                zobraz(ajax.responseText, napovedniPole);
125                /** Uložíme si do paměti ID aktuální stránky */
126                if (document.pruvodceData) {
127                    pruvodceAktualniId = document.pruvodceData.id.value
128                } else {
129                    pruvodceAktualniId = 0;
130                }
131                /** Změníme URL v prohlížeči */
132                urlOdkaz['pruvodce']  = 'pruvodce=' + encodeURIComponent(pruvodceAktualniId);
133                ulozURL();
134            }
135        };
136        ajax.send(null);
137    }
138}
139
140/**
141 * Parametry si ukládáme za # do URL (window.location.hash)
142 * Můžeme měnit URL, aniž by prohlížeč obnovoval stránku.
143 * Uživatel si může URL zkopírovat a obnovit si příště stav aplikace.
144 * @param parametr jméno parametru, který hledáme
145 * @return hodnota parametr
146 */
147function getParametr(parametr) {
148    parametr = parametr.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
149    //var regexS = "[\\?&]"+parametr+"=([^&#]*)";
150    var regexS = "[\\#&]"+parametr+"=([^&#]*)";
151    var regex = new RegExp( regexS );
152    var results = regex.exec(window.location.hash);
153    if( results == null )
154        return "";
155    else
156        return decodeURIComponent(results[1]);
157}
158
159/**
160 * Uloží parametry (jako je SQL příkaz a stránka průvodce) do URL (za #),
161 * aby si uživatel mohl URL zkopírovat a příště si obnovit stav aplikace.
162 */
163function ulozURL() {
164    if (urlOdkaz['pruvodce']) {
165        window.location.hash = urlOdkaz['pruvodce'] + '&sql=' + encodeURIComponent(getSQL());
166    } else {
167        window.location.hash = 'sql=' + encodeURIComponent(getSQL());
168    }
169}
170
171/**
172 * Načte uloženou pozici průvodce.
173 */
174function nactiURL() {
175    nactiURL(false);
176}
177
178/**
179 * Načte uložený stav aplikace z URL (SQL příkaz, průvodce).
180 */
181function nactiURL(nacistSQL) {
182    /** Načteme uživatelův SQL příkaz z URL do vstupního pole */
183    if (nacistSQL && getParametr('sql')) {
184        zobraz(getParametr('sql'), vstupniPole);
185    }
186   
187    /** Načteme pozici v nápovědě */
188    if (getParametr('pruvodce')) {
189        ajaxPruvodceId(getParametr('pruvodce'));
190    } else {
191        ajaxPruvodceKod('vitejte');
192    }
193}
194
195window.onload = function() {
196    nactiURL(true);
197}
198
199var locationHash = location.hash;
200var navigaceProhlizecem = false;
201
202setInterval(function() {
203    if (location.hash != locationHash) {
204        if (navigaceProhlizecem) {
205            nactiURL();
206        }
207        navigaceProhlizecem = false;
208        locationHash = location.hash;
209    }
210}, 200);
211
Note: See TracBrowser for help on using the browser.