root/java/sql-vyuka/web/hlavni.js @ 72:fc3d6fa6fbcd

Revision 72:fc3d6fa6fbcd, 7.9 KB (checked in by František Kučera <franta-hg@…>, 14 years ago)

Přidána funkce pro dynamické načítání javascriptu.

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.getElementById('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.getElementById('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.getElementById('aplikace').vstupniPole.value = vratEntity(text);
45    } else if (kde == stavovePole)  {
46        document.getElementById('aplikace').stavovePole.value = vratEntity(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.getElementById('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.getElementById('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                aktivujHistorii();
80            }
81        };
82        ajax.send(null);
83    }
84}
85
86var pruvodceAktualniId = 0;
87var urlOdkaz = new Array();
88urlOdkaz['pruvodce'] = null;
89
90function ajaxPruvodcePredchozi() {
91    ajaxPruvodceNaviguj('predchozi', pruvodceAktualniId, null);
92}
93
94function ajaxPruvodceZpet() {
95    try {
96        history.back();
97        //window.back();
98        nactiURL();
99    } catch (e) {
100        alert(e);
101    // není historie
102    }
103}
104
105function ajaxPruvodceVpred() {
106    try {
107        history.forward();
108        //window.forward();
109        nactiURL();
110    } catch (e) {
111        alert(e);
112    // není historie
113    }
114}
115
116function ajaxPruvodceNasledujici() {
117    ajaxPruvodceNaviguj('nasledujici', pruvodceAktualniId, null);
118}
119
120function ajaxPruvodceKod(kod) {
121    ajaxPruvodceNaviguj('podleKodu', 0, kod);
122}
123
124function ajaxPruvodceId(id) {
125    ajaxPruvodceNaviguj('podleId', id, null);
126
127}
128
129function ajaxPruvodceNaviguj(akcePruvodce, id, kod) {
130    if (ajax.readyState == 4 || ajax.readyState == 0) {
131        ajax.open("POST", 'ajax.jspx?akce=napoveda&pruvodce=' + encodeURIComponent(akcePruvodce) + '&idPruvodce=' + encodeURIComponent(id) + '&kodPruvodce=' + encodeURIComponent(kod), true);
132        ajax.onreadystatechange = function() {
133            if (ajax.readyState == 4) {
134                zobraz(ajax.responseText, napovedniPole);
135                /** Uložíme si do paměti ID aktuální stránky */
136                if (document.getElementById('pruvodceData')) {
137                    pruvodceAktualniId = document.getElementById('pruvodceData').id.value;
138                } else {
139                    pruvodceAktualniId = 0;
140                }
141                /** Změníme URL v prohlížeči */
142                urlOdkaz['pruvodce']  = 'pruvodce=' + encodeURIComponent(pruvodceAktualniId);
143                ulozURL();
144                sestavStromy();
145                aktivujPruvodce();
146            }
147        };
148        ajax.send(null);
149    }
150}
151
152/**
153 * Parametry si ukládáme za # do URL (window.location.hash)
154 * Můžeme měnit URL, aniž by prohlížeč obnovoval stránku.
155 * Uživatel si může URL zkopírovat a obnovit si příště stav aplikace.
156 * @param parametr jméno parametru, který hledáme
157 * @return hodnota parametr
158 */
159function getParametr(parametr) {
160    parametr = parametr.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
161    //var regexS = "[\\?&]"+parametr+"=([^&#]*)";
162    var regexS = "[\\#&]"+parametr+"=([^&]*)";
163    var regex = new RegExp( regexS );
164    var results = regex.exec(window.location.hash);
165    if( results == null )
166        return "";
167    else
168        return decodeURIComponent(results[1]);
169}
170
171/**
172 * Uloží parametry (jako je SQL příkaz a stránka průvodce) do URL (za #),
173 * aby si uživatel mohl URL zkopírovat a příště si obnovit stav aplikace.
174 */
175function ulozURL() {
176    if (urlOdkaz['pruvodce']) {
177        window.location.hash = urlOdkaz['pruvodce'] + '&sql=' + encodeURIComponent(getSQL());
178    } else {
179        window.location.hash = 'sql=' + encodeURIComponent(getSQL());
180    }
181}
182/**
183 * Načte uložený stav aplikace z URL (SQL příkaz, průvodce).
184 */
185function nactiURL() {
186    /** Načteme uživatelův SQL příkaz z URL do vstupního pole */
187    if (getParametr('sql')) {
188        zobraz(getParametr('sql'), vstupniPole);
189    }
190   
191    /** Načteme pozici v nápovědě */
192    if (getParametr('pruvodce')) {
193        ajaxPruvodceId(getParametr('pruvodce'));
194    } else {
195        ajaxPruvodceKod('vitejte');
196    }
197}
198
199window.onload = function() {
200    nactiURL();
201    document.getElementById("zahlavi").addEventListener('click', function () {
202        ajaxPruvodceKod('vitejte');
203    }, false);
204}
205
206/**
207 * Přidá <pre> elementům v průvodci akci onclick,
208 * která se postará o načtení obsahu daného elementu do vstupního pole,
209 * aby uživatel tento kód nemusel opisovat.
210 *
211 * Zpracuje odkazy na průvodce:
212 * převede href="@klíč" na správný javascriptový odkaz.
213 */
214function aktivujPruvodce() {
215    /** Ukázky SQL kódu */
216    elementy = document.getElementsByTagName("pre");
217    for (var i = 0; i < elementy.length; i++) {
218        if (elementy[i].parentNode.id == napovedniPole) {
219            elementy[i].title = document.getElementById('lokalizace').klikniProNacteniPrikladu.value;
220            elementy[i].onclick = function() {
221                zobraz(this.innerHTML, 'vstupniPole');
222                return true;
223            };
224        }
225    }
226
227    /** Aktivace interních odkazů na průvodce */
228    elementy = document.getElementsByTagName("a");
229    for (var j = 0; j < elementy.length; j++) {
230        var odkaz = elementy[j].getAttribute("href");
231        if (odkaz.substring(0, 1) == '@') {
232            elementy[j].href = "javascript:ajaxPruvodceKod('" + odkaz.substring(1, odkaz.length) + "');";
233        }
234    }
235}
236
237/**
238 * Přidá <td> elementům v historii akci onclick,
239 * která se postará o načtení obsahu daného elementu do vstupního pole,
240 * aby uživatel tento kód nemusel opisovat.
241 */
242function aktivujHistorii() {
243    radky = document.getElementsByTagName("tr");
244    for (var i = 1; i < radky.length; i++) {
245        if (radky[i].parentNode.parentNode.parentNode.id == vystupniPole) {
246            radky[i].childNodes[1].title = document.getElementById('lokalizace').klikniProNacteniHistorie.value;
247            radky[i].childNodes[1].style.cursor = 'pointer';
248            radky[i].childNodes[1].onclick = function() {
249                zobraz(this.innerHTML, 'vstupniPole');
250                return true;
251            };
252        }
253    }
254}
255
256/**
257 * Převede HTML entity zpět na znaky,
258 * aby se správně zobrazily ve vstupním nebo stavovém poli.
259 */
260function vratEntity (text) {
261    var vysledek = text;
262    vysledek = vysledek.replace('&lt;', '<', 'g');
263    vysledek = vysledek.replace('&gt;', '>', 'g');
264    vysledek = vysledek.replace('&amp;', '&', 'g');
265    vysledek = vysledek.replace('&nbsp;', ' ', 'g');
266    vysledek = vysledek.replace('&#160;', ' ', 'g');
267    return vysledek;
268
269}
270
271/**
272 * Načte dynamicky soubor se skriptem.
273 * url = název souboru.js
274 */
275function nactiJavaScript (url) {
276    var element = document.createElement("script");
277    element.src = url;
278    element.type = "text/javascript";
279    document.getElementsByTagName("head")[0].appendChild(element);
280}
Note: See TracBrowser for help on using the browser.