java/sql-vyuka/web/hlavni.js
author František Kučera <franta-hg@frantovo.cz>
Mon Jul 27 22:53:01 2009 +0200 (2009-07-27)
changeset 64 b9a61f912f6a
parent 61 9e60af36a9df
child 65 bd516f2d7ded
permissions -rw-r--r--
Uživatel může kliknout myší na SQL kód v historii a načíst si ho – nemusí ho opisovat nebo kopírovat.
franta-hg@3
     1
/** ID html prvků */
franta-hg@3
     2
const vstupniPole = 'vstupniPole';
franta-hg@3
     3
const vystupniPole = 'vystupniPole';
franta-hg@3
     4
const napovedniPole = 'napovedniPole';
franta-hg@20
     5
const stavovePole = 'stavovePole';
franta-hg@3
     6
franta-hg@3
     7
franta-hg@2
     8
/**
franta-hg@2
     9
 * Aby to fungovalo i v MSIE 6.
franta-hg@2
    10
 * @return AJAXový objekt.
franta-hg@2
    11
 */
franta-hg@2
    12
function getXmlHttpRequestObject() {
franta-hg@2
    13
    if (window.XMLHttpRequest) {
franta-hg@2
    14
        return new XMLHttpRequest();
franta-hg@2
    15
    } else if(window.ActiveXObject) {
franta-hg@2
    16
        return new ActiveXObject("Microsoft.XMLHTTP");
franta-hg@2
    17
    } else {
franta-hg@48
    18
        alert(document.getElementById('lokalizace').nepodporovany.value);
franta-hg@2
    19
        return null;
franta-hg@2
    20
    }
franta-hg@2
    21
}
franta-hg@2
    22
franta-hg@22
    23
franta-hg@2
    24
/** Náš AJAXový objekt. */
franta-hg@2
    25
var ajax = getXmlHttpRequestObject();
franta-hg@2
    26
franta-hg@22
    27
franta-hg@2
    28
/**
franta-hg@3
    29
 * Vrací vstup od uživatele.
franta-hg@3
    30
 * @return SQL příkaz zadaný uživatelem.
franta-hg@3
    31
 **/
franta-hg@3
    32
function getSQL() {
franta-hg@48
    33
    return document.getElementById('aplikace').vstupniPole.value;
franta-hg@3
    34
}
franta-hg@3
    35
franta-hg@22
    36
franta-hg@3
    37
/**
franta-hg@2
    38
 * Zobrazí text na požadovaném místě.
franta-hg@22
    39
 * @param text text k zobrazení. V případě formulářů prostý text, v ostatních případech HTML text.
franta-hg@22
    40
 * @param kde id prvku, do kterého se má text vypsat.
franta-hg@2
    41
 **/
franta-hg@2
    42
function zobraz(text, kde) {
franta-hg@19
    43
    if (kde == vstupniPole) {
franta-hg@60
    44
        document.getElementById('aplikace').vstupniPole.value = vratEntity(text);
franta-hg@20
    45
    } else if (kde == stavovePole)  {
franta-hg@60
    46
        document.getElementById('aplikace').stavovePole.value = vratEntity(text);
franta-hg@19
    47
    } else {
franta-hg@19
    48
        document.getElementById(kde).innerHTML = text + '<p>&nbsp;<!-- Šťastné hackování ;-) --></p>';
franta-hg@19
    49
    }
franta-hg@2
    50
}
franta-hg@2
    51
franta-hg@2
    52
franta-hg@2
    53
/** Jednoduchá AJAXová funkce, načte obsah souboru a zobrazí ho ve výstupním okně. */
franta-hg@5
    54
function ajaxVykonatSQL() {
franta-hg@2
    55
    if (ajax.readyState == 4 || ajax.readyState == 0) {
franta-hg@48
    56
        zobraz(document.getElementById('lokalizace').probihaSQL.value, stavovePole);
franta-hg@24
    57
        ajax.open("POST", 'ajax.jspx?akce=vykonat&sql=' + encodeURIComponent(getSQL()), true);
franta-hg@19
    58
        ajax.onreadystatechange = function() {
franta-hg@19
    59
            if (ajax.readyState == 4) {
franta-hg@22
    60
                zobraz(ajax.responseText, vystupniPole);
franta-hg@22
    61
                zobraz('', stavovePole);
franta-hg@19
    62
            }
franta-hg@19
    63
        };
franta-hg@2
    64
        ajax.send(null);
franta-hg@2
    65
    }
franta-hg@39
    66
    ulozURL();
franta-hg@2
    67
}
franta-hg@5
    68
franta-hg@5
    69
franta-hg@5
    70
/** Jednoduchá AJAXová funkce, načte obsah souboru a zobrazí ho ve výstupním okně. */
franta-hg@5
    71
function ajaxZobrazitHistorii() {
franta-hg@5
    72
    if (ajax.readyState == 4 || ajax.readyState == 0) {
franta-hg@48
    73
        zobraz(document.getElementById('lokalizace').probihaHistorie.value, stavovePole);
franta-hg@24
    74
        ajax.open("POST", 'ajax.jspx?akce=historie', true);
franta-hg@19
    75
        ajax.onreadystatechange = function() {
franta-hg@19
    76
            if (ajax.readyState == 4) {
franta-hg@22
    77
                zobraz(ajax.responseText, vystupniPole);
franta-hg@22
    78
                zobraz('', stavovePole);
franta-hg@64
    79
                aktivujHistorii();
franta-hg@19
    80
            }
franta-hg@19
    81
        };
franta-hg@5
    82
        ajax.send(null);
franta-hg@5
    83
    }
franta-hg@5
    84
}
franta-hg@38
    85
franta-hg@38
    86
var pruvodceAktualniId = 0;
franta-hg@39
    87
var urlOdkaz = new Array();
franta-hg@39
    88
urlOdkaz['pruvodce'] = null;
franta-hg@38
    89
franta-hg@38
    90
function ajaxPruvodcePredchozi() {
franta-hg@38
    91
    ajaxPruvodceNaviguj('predchozi', pruvodceAktualniId, null);
franta-hg@38
    92
}
franta-hg@38
    93
franta-hg@38
    94
function ajaxPruvodceZpet() {
franta-hg@42
    95
    /** TODO: historie navigace */
franta-hg@42
    96
    alert('Tato funkce se teprve připravuje.');
franta-hg@38
    97
}
franta-hg@38
    98
franta-hg@38
    99
function ajaxPruvodceVpred() {
franta-hg@42
   100
    /** TODO: historie navigace */
franta-hg@42
   101
    alert('Tato funkce se teprve připravuje.');
franta-hg@38
   102
}
franta-hg@38
   103
franta-hg@38
   104
function ajaxPruvodceNasledujici() {
franta-hg@38
   105
    ajaxPruvodceNaviguj('nasledujici', pruvodceAktualniId, null);
franta-hg@38
   106
}
franta-hg@38
   107
franta-hg@38
   108
function ajaxPruvodceKod(kod) {
franta-hg@38
   109
    ajaxPruvodceNaviguj('podleKodu', 0, kod);
franta-hg@38
   110
}
franta-hg@38
   111
franta-hg@38
   112
function ajaxPruvodceId(id) {
franta-hg@38
   113
    ajaxPruvodceNaviguj('podleId', id, null);
franta-hg@38
   114
franta-hg@38
   115
}
franta-hg@38
   116
franta-hg@50
   117
function ajaxPruvodceNaviguj(akcePruvodce, id, kod) {
franta-hg@38
   118
    if (ajax.readyState == 4 || ajax.readyState == 0) {
franta-hg@38
   119
        ajax.open("POST", 'ajax.jspx?akce=napoveda&pruvodce=' + encodeURIComponent(akcePruvodce) + '&idPruvodce=' + encodeURIComponent(id) + '&kodPruvodce=' + encodeURIComponent(kod), true);
franta-hg@38
   120
        ajax.onreadystatechange = function() {
franta-hg@38
   121
            if (ajax.readyState == 4) {
franta-hg@38
   122
                zobraz(ajax.responseText, napovedniPole);
franta-hg@39
   123
                /** Uložíme si do paměti ID aktuální stránky */
franta-hg@58
   124
                if (document.getElementById('pruvodceData')) {
franta-hg@58
   125
                    pruvodceAktualniId = document.getElementById('pruvodceData').id.value;
franta-hg@38
   126
                } else {
franta-hg@38
   127
                    pruvodceAktualniId = 0;
franta-hg@38
   128
                }
franta-hg@39
   129
                /** Změníme URL v prohlížeči */
franta-hg@40
   130
                urlOdkaz['pruvodce']  = 'pruvodce=' + encodeURIComponent(pruvodceAktualniId);
franta-hg@39
   131
                ulozURL();
franta-hg@49
   132
                sestavStromy();
franta-hg@60
   133
                aktivujPruvodce();
franta-hg@57
   134
            }
franta-hg@38
   135
        };
franta-hg@38
   136
        ajax.send(null);
franta-hg@38
   137
    }
franta-hg@38
   138
}
franta-hg@39
   139
franta-hg@39
   140
/**
franta-hg@40
   141
 * Parametry si ukládáme za # do URL (window.location.hash)
franta-hg@40
   142
 * Můžeme měnit URL, aniž by prohlížeč obnovoval stránku.
franta-hg@40
   143
 * Uživatel si může URL zkopírovat a obnovit si příště stav aplikace.
franta-hg@39
   144
 * @param parametr jméno parametru, který hledáme
franta-hg@39
   145
 * @return hodnota parametr
franta-hg@39
   146
 */
franta-hg@39
   147
function getParametr(parametr) {
franta-hg@39
   148
    parametr = parametr.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
franta-hg@39
   149
    //var regexS = "[\\?&]"+parametr+"=([^&#]*)";
franta-hg@45
   150
    var regexS = "[\\#&]"+parametr+"=([^&]*)";
franta-hg@39
   151
    var regex = new RegExp( regexS );
franta-hg@39
   152
    var results = regex.exec(window.location.hash);
franta-hg@39
   153
    if( results == null )
franta-hg@39
   154
        return "";
franta-hg@39
   155
    else
franta-hg@39
   156
        return decodeURIComponent(results[1]);
franta-hg@39
   157
}
franta-hg@39
   158
franta-hg@39
   159
/**
franta-hg@39
   160
 * Uloží parametry (jako je SQL příkaz a stránka průvodce) do URL (za #),
franta-hg@39
   161
 * aby si uživatel mohl URL zkopírovat a příště si obnovit stav aplikace.
franta-hg@39
   162
 */
franta-hg@39
   163
function ulozURL() {
franta-hg@39
   164
    if (urlOdkaz['pruvodce']) {
franta-hg@39
   165
        window.location.hash = urlOdkaz['pruvodce'] + '&sql=' + encodeURIComponent(getSQL());
franta-hg@39
   166
    } else {
franta-hg@39
   167
        window.location.hash = 'sql=' + encodeURIComponent(getSQL());
franta-hg@39
   168
    }
franta-hg@39
   169
}
franta-hg@39
   170
/**
franta-hg@39
   171
 * Načte uložený stav aplikace z URL (SQL příkaz, průvodce).
franta-hg@39
   172
 */
franta-hg@42
   173
function nactiURL() {
franta-hg@40
   174
    /** Načteme uživatelův SQL příkaz z URL do vstupního pole */
franta-hg@42
   175
    if (getParametr('sql')) {
franta-hg@39
   176
        zobraz(getParametr('sql'), vstupniPole);
franta-hg@39
   177
    }
franta-hg@40
   178
    
franta-hg@40
   179
    /** Načteme pozici v nápovědě */
franta-hg@40
   180
    if (getParametr('pruvodce')) {
franta-hg@40
   181
        ajaxPruvodceId(getParametr('pruvodce'));
franta-hg@40
   182
    } else {
franta-hg@40
   183
        ajaxPruvodceKod('vitejte');
franta-hg@40
   184
    }
franta-hg@39
   185
}
franta-hg@39
   186
franta-hg@39
   187
window.onload = function() {
franta-hg@42
   188
    nactiURL();
franta-hg@60
   189
}
franta-hg@60
   190
franta-hg@60
   191
/**
franta-hg@60
   192
 * Přidá <pre> elementům v průvodci akci onclick,
franta-hg@60
   193
 * která se postará o načtení obsahu daného elementu do vstupního pole,
franta-hg@60
   194
 * aby uživatel tento kód nemusel opisovat.
franta-hg@61
   195
 *
franta-hg@61
   196
 * Zpracuje odkazy na průvodce:
franta-hg@61
   197
 * převede href="@klíč" na správný javascriptový odkaz.
franta-hg@60
   198
 */
franta-hg@60
   199
function aktivujPruvodce() {
franta-hg@61
   200
    /** Ukázky SQL kódu */
franta-hg@60
   201
    elementy = document.getElementsByTagName("pre");
franta-hg@60
   202
    for (var i = 0; i < elementy.length; i++) {
franta-hg@60
   203
        if (elementy[i].parentNode.id == napovedniPole) {
franta-hg@60
   204
            elementy[i].title = document.getElementById('lokalizace').klikniProNacteniPrikladu.value;
franta-hg@60
   205
            elementy[i].onclick = function() {
franta-hg@60
   206
                zobraz(this.innerHTML, 'vstupniPole');
franta-hg@60
   207
                return true;
franta-hg@60
   208
            };
franta-hg@60
   209
        }
franta-hg@60
   210
    }
franta-hg@61
   211
franta-hg@61
   212
    /** Aktivace interních odkazů na průvodce */
franta-hg@61
   213
    elementy = document.getElementsByTagName("a");
franta-hg@61
   214
    for (var j = 0; j < elementy.length; j++) {
franta-hg@61
   215
        var odkaz = elementy[j].getAttribute("href");
franta-hg@61
   216
        if (odkaz.substring(0, 1) == '@') {
franta-hg@61
   217
            elementy[j].href = "javascript:ajaxPruvodceKod('" + odkaz.substring(1, odkaz.length) + "');";
franta-hg@61
   218
        }
franta-hg@61
   219
    }
franta-hg@60
   220
}
franta-hg@60
   221
franta-hg@60
   222
/**
franta-hg@64
   223
 * Přidá <td> elementům v historii akci onclick,
franta-hg@64
   224
 * která se postará o načtení obsahu daného elementu do vstupního pole,
franta-hg@64
   225
 * aby uživatel tento kód nemusel opisovat.
franta-hg@64
   226
 */
franta-hg@64
   227
function aktivujHistorii() {
franta-hg@64
   228
    elementy = document.getElementsByTagName("tr");
franta-hg@64
   229
    for (var i = 1; i < elementy.length; i++) {
franta-hg@64
   230
        if (elementy[i].parentNode.parentNode.parentNode.id == vystupniPole) {
franta-hg@64
   231
            elementy[i].childNodes[1].title = document.getElementById('lokalizace').klikniProNacteniHistorie.value;
franta-hg@64
   232
            elementy[i].childNodes[1].style.cursor = 'pointer';
franta-hg@64
   233
            elementy[i].childNodes[1].onclick = function() {
franta-hg@64
   234
                zobraz(this.innerHTML, 'vstupniPole');
franta-hg@64
   235
                return true;
franta-hg@64
   236
            };
franta-hg@64
   237
        }
franta-hg@64
   238
    }
franta-hg@64
   239
}
franta-hg@64
   240
franta-hg@64
   241
/**
franta-hg@60
   242
 * Převede HTML entity zpět na znaky,
franta-hg@60
   243
 * aby se správně zobrazily ve vstupním nebo stavovém poli.
franta-hg@60
   244
 */
franta-hg@60
   245
function vratEntity (text) {
franta-hg@60
   246
    var vysledek = text;
franta-hg@60
   247
    vysledek = vysledek.replace('&lt;', '<', 'g');
franta-hg@60
   248
    vysledek = vysledek.replace('&gt;', '>', 'g');
franta-hg@60
   249
    vysledek = vysledek.replace('&amp;', '&', 'g');
franta-hg@64
   250
    vysledek = vysledek.replace('&nbsp;', ' ', 'g');
franta-hg@64
   251
    vysledek = vysledek.replace('&#160;', ' ', 'g');
franta-hg@60
   252
    return vysledek;
franta-hg@60
   253
franta-hg@60
   254
}