Průvodce: JavaScript, HTML, CSS.
authorFrantišek Kučera <franta-hg@frantovo.cz>
Tue, 02 Jun 2009 01:36:17 +0200
changeset 380a865a665698
parent 37 e32867db5487
child 39 47551a506850
Průvodce: JavaScript, HTML, CSS.
java/sql-vyuka/src/java/cz/frantovo/sql/vyuka/preklady_cs.properties
java/sql-vyuka/web/WEB-INF/casti/aplikace.jspx
java/sql-vyuka/web/ajax.jspx
java/sql-vyuka/web/hlavni.js
java/sql-vyuka/web/styl.css
     1.1 --- a/java/sql-vyuka/src/java/cz/frantovo/sql/vyuka/preklady_cs.properties	Tue Jun 02 00:27:15 2009 +0200
     1.2 +++ b/java/sql-vyuka/src/java/cz/frantovo/sql/vyuka/preklady_cs.properties	Tue Jun 02 01:36:17 2009 +0200
     1.3 @@ -39,5 +39,5 @@
     1.4  navigace.vpred=Vp\u0159ed v historii
     1.5  navigace.nasledujici=N\u00E1sleduj\u00EDc\u00ED lekce
     1.6  
     1.7 -pruvodce.chyba.nadpis=Chyba
     1.8 -pruvodce.chyba.obsah=<p>Kapitola nenalezena.</p>
     1.9 +pruvodce.chyba.nadpis=Nenalezeno
    1.10 +pruvodce.chyba.obsah=<p>Takov\u00E1 kapitola tu nen\u00ED.</p>
     2.1 --- a/java/sql-vyuka/web/WEB-INF/casti/aplikace.jspx	Tue Jun 02 00:27:15 2009 +0200
     2.2 +++ b/java/sql-vyuka/web/WEB-INF/casti/aplikace.jspx	Tue Jun 02 01:36:17 2009 +0200
     2.3 @@ -19,17 +19,40 @@
     2.4              <div id="navigace">
     2.5                  <form action="#">
     2.6                      <fmt:message key="navigace.predchozi" var="navigacePredchozi" />
     2.7 -                    <button class="predchozi" title="${navigacePredchozi}">&amp;nbsp;</button>
     2.8 +                    <button class="predchozi"
     2.9 +                            name="predchozi"
    2.10 +                            title="${navigacePredchozi}"
    2.11 +                            type="button"
    2.12 +                            onclick="javascript:ajaxPruvodcePredchozi();">&amp;nbsp;</button>
    2.13                      <fmt:message key="navigace.zpet" var="navigaceZpet" />
    2.14 -                    <button class="zpet" title="${navigaceZpet}">&amp;nbsp;</button>
    2.15 +                    <button class="zpet"
    2.16 +                            name="zpet"
    2.17 +                            title="${navigaceZpet}"
    2.18 +                            type="button"
    2.19 +                            onclick="javascript:ajaxPruvodceZpet();">&amp;nbsp;</button>
    2.20                      <fmt:message key="navigace.pruvodce" var="navigacePruvodce" />
    2.21 -                    <button class="pruvodce" title="${navigacePruvodce}">&amp;nbsp;</button>
    2.22 +                    <button class="pruvodce"
    2.23 +                            name="pruvodce"
    2.24 +                            title="${navigacePruvodce}"
    2.25 +                            type="button"
    2.26 +                            onclick="javascript:ajaxPruvodceKod('pruvodce');">&amp;nbsp;</button>
    2.27                      <fmt:message key="navigace.model" var="navigaceModel" />
    2.28 -                    <button class="model" title="${navigaceModel}">&amp;nbsp;</button>
    2.29 +                    <button class="model"
    2.30 +                            name="model"
    2.31 +                            title="${navigaceModel}"
    2.32 +                            type="button"
    2.33 +                            onclick="javascript:ajaxPruvodceKod('model');">&amp;nbsp;</button>
    2.34                      <fmt:message key="navigace.vpred" var="navigaceVpred" />
    2.35 -                    <button class="vpred" title="${navigaceVpred}">&amp;nbsp;</button>
    2.36 +                    <button class="vpred"
    2.37 +                            name="vpred"
    2.38 +                            title="${navigaceVpred}"
    2.39 +                            type="button"
    2.40 +                            onclick="javascript:ajaxPruvodceVpred();">&amp;nbsp;</button>
    2.41                      <fmt:message key="navigace.nasledujici" var="navigaceNasledujici" />
    2.42 -                    <button id="XXX" class="nasledujici" title="${navigaceNasledujici}">&amp;nbsp;</button>
    2.43 +                    <button class="nasledujici"
    2.44 +                            title="${navigaceNasledujici}"
    2.45 +                            type="button"
    2.46 +                            onclick="javascript:ajaxPruvodceNasledujici();">&amp;nbsp;</button>
    2.47                  </form>
    2.48              </div>
    2.49              <!-- </Navigace> -->
     3.1 --- a/java/sql-vyuka/web/ajax.jspx	Tue Jun 02 00:27:15 2009 +0200
     3.2 +++ b/java/sql-vyuka/web/ajax.jspx	Tue Jun 02 01:36:17 2009 +0200
     3.3 @@ -151,6 +151,9 @@
     3.4                      <c:out value="${pruvodce.obsah}" escapeXml="false"/>
     3.5                  </c:otherwise>
     3.6              </c:choose>
     3.7 +            <form action="#" name="pruvodceData" id="pruvodceData">
     3.8 +                <textarea name="id">${pruvodce.id}</textarea>
     3.9 +            </form>
    3.10              <!-- </Výpis> -->
    3.11          </c:when>
    3.12          <!-- </Akce: Nápověda> -->
     4.1 --- a/java/sql-vyuka/web/hlavni.js	Tue Jun 02 00:27:15 2009 +0200
     4.2 +++ b/java/sql-vyuka/web/hlavni.js	Tue Jun 02 01:36:17 2009 +0200
     4.3 @@ -80,3 +80,50 @@
     4.4          ajax.send(null);
     4.5      }
     4.6  }
     4.7 +
     4.8 +var pruvodceAktualniId = 0;
     4.9 +
    4.10 +function ajaxPruvodcePredchozi() {
    4.11 +    ajaxPruvodceNaviguj('predchozi', pruvodceAktualniId, null);
    4.12 +}
    4.13 +
    4.14 +function ajaxPruvodceZpet() {
    4.15 +    /** TODO: historie navigace */
    4.16 +    alert('Tato funkce se teprve připravuje.');
    4.17 +}
    4.18 +
    4.19 +function ajaxPruvodceVpred() {
    4.20 +    /** TODO: historie navigace */
    4.21 +    alert('Tato funkce se teprve připravuje.');
    4.22 +}
    4.23 +
    4.24 +function ajaxPruvodceNasledujici() {
    4.25 +    ajaxPruvodceNaviguj('nasledujici', pruvodceAktualniId, null);
    4.26 +}
    4.27 +
    4.28 +function ajaxPruvodceKod(kod) {
    4.29 +    ajaxPruvodceNaviguj('podleKodu', 0, kod);
    4.30 +}
    4.31 +
    4.32 +function ajaxPruvodceId(id) {
    4.33 +    ajaxPruvodceNaviguj('podleId', id, null);
    4.34 +
    4.35 +}
    4.36 +
    4.37 +function ajaxPruvodceNaviguj(akcePruvodce, id, kod) {    
    4.38 +    if (ajax.readyState == 4 || ajax.readyState == 0) {
    4.39 +        ajax.open("POST", 'ajax.jspx?akce=napoveda&pruvodce=' + encodeURIComponent(akcePruvodce) + '&idPruvodce=' + encodeURIComponent(id) + '&kodPruvodce=' + encodeURIComponent(kod), true);
    4.40 +        ajax.onreadystatechange = function() {
    4.41 +            if (ajax.readyState == 4) {
    4.42 +                zobraz(ajax.responseText, napovedniPole);
    4.43 +                if (document.pruvodceData) {
    4.44 +                    pruvodceAktualniId = document.pruvodceData.id.value
    4.45 +                } else {
    4.46 +                    pruvodceAktualniId = 0;
    4.47 +                }
    4.48 +            }
    4.49 +        };
    4.50 +        ajax.send(null);
    4.51 +    }
    4.52 +// TODO: změnit URL
    4.53 +}
     5.1 --- a/java/sql-vyuka/web/styl.css	Tue Jun 02 00:27:15 2009 +0200
     5.2 +++ b/java/sql-vyuka/web/styl.css	Tue Jun 02 01:36:17 2009 +0200
     5.3 @@ -102,6 +102,11 @@
     5.4      height: 484px;
     5.5  }
     5.6  
     5.7 +#napoveda h1 {
     5.8 +    font-size: 18px;
     5.9 +    font-weight: bold;
    5.10 +}
    5.11 +
    5.12  /** Nadpisy bloků */
    5.13  .blok h2 {
    5.14      font-size: 12px;
    5.15 @@ -260,3 +265,8 @@
    5.16  #lokalizace {
    5.17      display: none;
    5.18  }
    5.19 +
    5.20 +/** Skrytý formulář sloužící pro uchování ID průvodce z databáze */
    5.21 +#pruvodceData {
    5.22 +    display: none;
    5.23 +}