vorlage.js nach app.js uebertragen, eine einzelne js.-Datei lohnt nicht.

ulrich

2021-03-08 f278ba971e8a814cd0d9ceb1e4ebf77117f48565

vorlage.js nach app.js uebertragen, eine einzelne js.-Datei lohnt nicht.

 index.html

@@ -40,22 +40,22 @@
            </p>
            <p>
              Wenn dessen Darstellung mehr
              Platz ben&ouml;tigt als das Anzeigeger&auml;t bietet wird ein
              Platz benötigt als das Anzeigegerät bietet wird ein
              Rollbalken eingeblendet. Beim Rollen zu anfangs nicht sichtbaren
              Teilen des Inhalts bleiben die den Inhaltsbereich
              umschlie&szlig;enden Elemente sichtbar.
              umschließenden Elemente sichtbar.
            </p>
            <p>
              Ein Klick auf das Hamburger-Piktogramm oben links bzw. dessen
              Antippen blendet ein Men&uuml; ein von dem aus weitere Funktionen
              ausgel&ouml;st werden k&ouml;nnen.
              Antippen blendet ein Menü ein von dem aus weitere Funktionen
              ausgelöst werden können.
            </p>
          </div>
        </div>
      </div>
      <!-- oestliche Seitenleiste -->
      <div class="ost ost-open">
        &ouml;stliche Seitenleiste
        östliche Seitenleiste
      </div>
    </div>
    <!-- Fusszeile -->
@@ -65,7 +65,7 @@
    <!-- Skripte -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mustache.js/2.3.0/mustache.min.js"></script>
    <script src="js/app-menu.js"></script>
    <script src="js/vorlagen.js"></script>
    <!-- <script src="js/vorlagen.js"></script> -->
    <script src="js/app.js"></script>
    <script>
        var app;
@@ -76,3 +76,4 @@
    </script>
  </body>
</html>


 js/app.js

@@ -1,10 +1,13 @@
function AppVorlage() {
  var self = this;
  var appMenu;
  var vorlagen;
  // var vorlagen;
  var cache; // mustache templates


  this.init = function() {
    self.vorlagen = new Vorlagen();
    //self.vorlagen = new Vorlagen();
    self.cache = new Array();
    self.appMenu = new AppMenu();
    self.appMenu.init(
      "data/menu/",
@@ -116,7 +119,7 @@

  this.dialog_zeigen = function(vurl, inhalt) {
    var dlg = document.querySelector(".dialog");
    self.vorlagen.html_erzeugen(
    self.html_erzeugen(
      vurl,
      inhalt,
      function(html) {
@@ -137,5 +140,67 @@
    dlg.innerHTML = '';
  };

  /* Vorlagen */

  /*
    Das HTML erzeugen, das entsteht, wenn eine Vorlage mit Inhalt
    gefüllt wird

    Das Füllen erfolgt asynchron, d.h. der Programmlauf geht nach dem
    Aufruf weiter ohne auf das Laden und Füllen der Vorlage zu warten.
    Das fertige HTML wird der Callback-Funktion übergeben
    sobald die Vorlage geladen und gefüllt ist, unabhängig davon, wo der
    Programmlauf zu diesem Zeitpunkt mittlerweile ist.

    vurl - URL zur Vorlagendatei
    inhalt - die JSON-Struktur, deren Inhalt in die
              Vorlage gefüllt werden soll
    cb - Callback-Funktion, die gerufen wird, wenn die Vorlage gefüllt ist.
          Dieser Callback-Funktion wird das fertige HTML übergeben
  */
  this.html_erzeugen = function(vurl, inhalt, cb) {
    var vorlage = self.cache[vurl];
    if(vorlage === undefined) {
      self.vorlage_laden_und_fuellen(vurl, inhalt, cb);
    } else {
      self.vorlage_fuellen(vurl, inhalt, cb);
    }
  };

  this.vorlage_fuellen = function(vurl, inhalt, cb) {
    cb(Mustache.render(self.cache[vurl], inhalt));
  };

  /*
    Eine Vorlage vom Server in den lokalen Speicher laden
    vurl - der URL unter dem die Vorlage zu finden ist
    inhalt - die JSON-Struktur, deren Inhalt in die
              Vorlage gefüllt werden soll
    cb - callback: Diese Funktion wird gerufen, wenn die Vorlage mit dem
            Inhalt gefüllt ist
  */
  this.vorlage_laden_und_fuellen = function(vurl, inhalt, cb) {
    /*
    $.ajax({
      url: vurl,
      type: "GET",
      dataType : "text"
    }).done(function( vorlage ) {
      self.cache[vurl] = vorlage;
      self.vorlage_fuellen(vurl, inhalt, cb);
    });
    */
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function() {
      if (this.readyState == 4 && this.status == 200) {
        self.cache[vurl] = this.responseText;
        self.vorlage_fuellen(vurl, inhalt, cb);
      }
    };
    xmlhttp.open("GET", vurl, true);
    xmlhttp.send();
  };


}


 js/vorlagen.js

File was deleted