java/sql-vyuka/web/hlavni.js
author František Kučera <franta-hg@frantovo.cz>
Wed, 08 Feb 2012 12:44:51 +0100
changeset 77 fdeb54809e23
parent 72 fc3d6fa6fbcd
child 80 d900e5a112cc
permissions -rw-r--r--
odsazení
     1 /** ID html prvků */
     2 const vstupniPole = 'vstupniPole';
     3 const vystupniPole = 'vystupniPole';
     4 const napovedniPole = 'napovedniPole';
     5 const stavovePole = 'stavovePole';
     6 
     7 
     8 /**
     9  * Aby to fungovalo i v MSIE 6.
    10  * @return AJAXový objekt.
    11  */
    12 function 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. */
    25 var ajax = getXmlHttpRequestObject();
    26 
    27 
    28 /**
    29  * Vrací vstup od uživatele.
    30  * @return SQL příkaz zadaný uživatelem.
    31  **/
    32 function 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  **/
    42 function 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ě. */
    54 function 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ě. */
    71 function 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 
    86 var pruvodceAktualniId = 0;
    87 var urlOdkaz = new Array();
    88 urlOdkaz['pruvodce'] = null;
    89 
    90 function ajaxPruvodcePredchozi() {
    91     ajaxPruvodceNaviguj('predchozi', pruvodceAktualniId, null);
    92 }
    93 
    94 function ajaxPruvodceZpet() {
    95     try {
    96 	history.back();
    97 	//window.back();
    98 	nactiURL();
    99     } catch (e) {
   100 	alert(e);
   101     // není historie
   102     }
   103 }
   104 
   105 function ajaxPruvodceVpred() {
   106     try {
   107 	history.forward();
   108 	//window.forward();
   109 	nactiURL();
   110     } catch (e) {
   111 	alert(e);
   112     // není historie
   113     }
   114 }
   115 
   116 function ajaxPruvodceNasledujici() {
   117     ajaxPruvodceNaviguj('nasledujici', pruvodceAktualniId, null);
   118 }
   119 
   120 function ajaxPruvodceKod(kod) {
   121     ajaxPruvodceNaviguj('podleKodu', 0, kod);
   122 }
   123 
   124 function ajaxPruvodceId(id) {
   125     ajaxPruvodceNaviguj('podleId', id, null);
   126 
   127 }
   128 
   129 function 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  */
   159 function 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  */
   175 function 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  */
   185 function 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 
   199 window.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  */
   214 function 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  */
   242 function 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  */
   260 function 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  */
   275 function 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 }