From f45e203a66a5471a0dd05e0362566ef96a2b6b31 Mon Sep 17 00:00:00 2001
From: ulrich
Date: Wed, 07 Apr 2021 16:26:34 +0000
Subject: [PATCH] Abspieler-Dropdown (in Arbeit)

---
 src/de/uhilger/mediaz/api/StorageHandler.java |   19 ++++
 src/de/uhilger/mediaz/store/FileStorage.java  |   20 ++++
 src/de/uhilger/mediaz/store/Storage.java      |    7 +
 www/ui/data/tpl/ctrl.tpl                      |   24 +++--
 www/ui/data/tpl/abs_sel.tpl                   |    5 +
 src/de/uhilger/mediaz/App.java                |    1 
 src/mediaz_de_DE.properties                   |    2 
 www/ui/js/app.js                              |  139 +++++++++++++++++++---------------
 8 files changed, 140 insertions(+), 77 deletions(-)

diff --git a/src/de/uhilger/mediaz/App.java b/src/de/uhilger/mediaz/App.java
index 66d3fab..6c9b472 100644
--- a/src/de/uhilger/mediaz/App.java
+++ b/src/de/uhilger/mediaz/App.java
@@ -47,6 +47,7 @@
   public static final String RB_AP_WWW_DATA = "appParamWWWData"; 
   public static final String RB_AP_CTX = "appParamCtx"; 
   public static final String RB_AP_UI = "appParamUi"; 
+  public static final String RB_EP_LISTE = "epliste"; 
 
   /**
    * <p>Start-Methode dieser Anwendung</p>
diff --git a/src/de/uhilger/mediaz/api/StorageHandler.java b/src/de/uhilger/mediaz/api/StorageHandler.java
index 5899bef..3b8e010 100644
--- a/src/de/uhilger/mediaz/api/StorageHandler.java
+++ b/src/de/uhilger/mediaz/api/StorageHandler.java
@@ -21,6 +21,7 @@
 import com.sun.net.httpserver.HttpExchange;
 import com.sun.net.httpserver.HttpHandler;
 import de.uhilger.mediaz.App;
+import static de.uhilger.mediaz.App.RB_EP_LISTE;
 import de.uhilger.mediaz.Server;
 import static de.uhilger.mediaz.Server.RB_SLASH;
 import de.uhilger.mediaz.store.FileStorage;
@@ -58,6 +59,9 @@
     Beispiele:
   
     HTTP GET an /mz/api/store/Ablageort/
+    liefert alle Ablageort-Objekte
+  
+    HTTP GET an /mz/api/store/Ablageort/liste/  
     liefert eine Liste der Namen vorhandener Ablageorte
   
     HTTP GET an /mz/api/store/Ablageort/Katalog
@@ -86,6 +90,8 @@
   
   /** Name der HTTP Methode DELETE */
   public static final String HTTP_DELETE = "DELETE";
+  
+  public static final String EP_LISTE = "liste/";
 
   @Override
   public void handle(HttpExchange e) throws IOException {
@@ -177,9 +183,16 @@
     String[] elems = path.split(App.getRs(Server.RB_SLASH));
     FileStorage fs = new FileStorage(App.getInitParameter(App.getRs(App.RB_AP_CONF)));
     if(path.endsWith(App.getRs(RB_SLASH))) {
-      String type = elems[elems.length - 1];
-      logger.fine(type);
-      List list = fs.list(type);
+      List list = null;
+      if(path.endsWith(App.getRs(RB_EP_LISTE))) {
+        String type = elems[elems.length - 2];
+        logger.fine(type);
+        list = fs.list(type);
+      } else {
+        String type = elems[elems.length - 1];
+        logger.fine(type);
+        list = fs.listObjects(type);
+      }
       return jsonWithEnclosingType(list);
     } else {
       String type = elems[elems.length - 2];
diff --git a/src/de/uhilger/mediaz/store/FileStorage.java b/src/de/uhilger/mediaz/store/FileStorage.java
index 4b0ff1a..217420c 100644
--- a/src/de/uhilger/mediaz/store/FileStorage.java
+++ b/src/de/uhilger/mediaz/store/FileStorage.java
@@ -168,7 +168,7 @@
     }
     return list;
   }
-
+  
   @Override
   public TypeToken typeFromName(String name) {
     return types.get(name);
@@ -199,5 +199,23 @@
       return false;
     }
   }
+
+  @Override
+  public List<Entity> listObjects(String typ) {
+    File base = new File(fileBase);
+    File dir = new File(base, typ);
+    List<Entity> list = new ArrayList();
+    File[] files = dir.listFiles();
+    if(files != null) {
+      for(File file : files) {
+        try {
+          list.add(entityFromFile(file));
+        } catch (ClassNotFoundException | IOException ex) {
+          logger.log(Level.SEVERE, null, ex);
+        }
+      }
+    }
+    return list;
+  }
   
 }
diff --git a/src/de/uhilger/mediaz/store/Storage.java b/src/de/uhilger/mediaz/store/Storage.java
index de960bb..7a1803e 100644
--- a/src/de/uhilger/mediaz/store/Storage.java
+++ b/src/de/uhilger/mediaz/store/Storage.java
@@ -82,6 +82,13 @@
   public List<String> list(String typ);
   
   /**
+   * Alle Objekte eines Typs auflisten
+   * @param typ der gewuenschte Typ
+   * @return die Liste mit Objekten 
+   */
+  public List listObjects(String typ);
+  
+  /**
    * Fuer einen gegebenen Namen den Typ bestimmen
    * @param name  der Name des gewuenschten Typs 
    * @return der Typ zum Namen
diff --git a/src/mediaz_de_DE.properties b/src/mediaz_de_DE.properties
index b95252e..bc25054 100644
--- a/src/mediaz_de_DE.properties
+++ b/src/mediaz_de_DE.properties
@@ -10,10 +10,12 @@
 webroot=/
 # uiroot=/ui
 store=/api/store
+epliste=liste/
 stopServer=/api/server/stop
 testAblage=/api/test/ablage
 testStore=/api/test/store
 
+
 slash=/
 dash=-
 bytes=bytes
diff --git a/www/ui/data/tpl/abs_sel.tpl b/www/ui/data/tpl/abs_sel.tpl
new file mode 100644
index 0000000..b42a2ea
--- /dev/null
+++ b/www/ui/data/tpl/abs_sel.tpl
@@ -0,0 +1,5 @@
+<select class="u-full-width ctrl-item ctrl-select" id="abspieler" title="Abspieler">
+  {{#ArrayList}}
+  <option value="{{url}}">{{name}}</option>
+  {{/ArrayList}}
+</select>  
\ No newline at end of file
diff --git a/www/ui/data/tpl/ctrl.tpl b/www/ui/data/tpl/ctrl.tpl
index 6717df1..1a04087 100644
--- a/www/ui/data/tpl/ctrl.tpl
+++ b/www/ui/data/tpl/ctrl.tpl
@@ -7,16 +7,20 @@
     <button class="ctrl-btn ctrl-item" id="hier-btn" title="hier spielen"><i class="icon-tablet"></i></button>
   </div>
   <div class="ctrl-orte">
-    <select class="u-full-width ctrl-item ctrl-select" id="abspieler" title="Abspieler">
-      <option value="as1">Wohnzimmer langtext</option>
-      <option value="as2">Arbeitsz</option>
-      <option value="as3">K&uuml;che</option>
-    </select>  
-    <select class="u-full-width ctrl-item ctrl-select" id="playlist" title="Playliste">
-      <option value="Pl1">Liste 1</option>
-      <option value="Pl2">Liste 2</option>
-      <option value="Pl3">Liste 3</option>
-    </select>  
+    <div class="abs-sel">
+      <select class="u-full-width ctrl-item ctrl-select" id="abspieler" title="Abspieler">
+        <option value="as1">Wohnzimmer langtext</option>
+        <option value="as2">Arbeitsz</option>
+        <option value="as3">K&uuml;che</option>
+      </select>  
+    </div>
+    <div class="pl-sel">
+      <select class="u-full-width ctrl-item ctrl-select" id="playlist" title="Playliste">
+        <option value="Pl1">Liste 1</option>
+        <option value="Pl2">Liste 2</option>
+        <option value="Pl3">Liste 3</option>
+      </select>  
+    </div>
     <button class="ctrl-btn ctrl-item" id="dazu-btn" title="der Playlist hinzuf&uuml;gen"><i class="icon-forward"></i></button>
     <button class="ctrl-btn ctrl-item" id="weg-btn" title="aus Playlist entfernen"><i class="icon-trash-empty"></i></button>
   </div>
diff --git a/www/ui/js/app.js b/www/ui/js/app.js
index c76dca1..12a6b1e 100644
--- a/www/ui/js/app.js
+++ b/www/ui/js/app.js
@@ -1,32 +1,65 @@
-function Ablageort(n, o, u) {
-  this.name = n;
-  this.ort = o;
-  this.url = u;
-}
-
-function Einstellung(k, v) {
-  this.key = k;
-  this.value = v;
-}
-
-function Abspieler(n, u) {
-  this.name = n;
-  this.url = u;
-}
-
 function Mediazentrale() {
   var self = this;
   var appMenu;
   var cache; // mustache templates
   var ortPfad;
   var mediaPfad;
+
+  this.init = function () {
+    self.mediaPfad = '/';
+    self.ortPfad = '/';
+    self.cache = new Array();
+    self.appMenu = new AppMenu();
+    self.appMenu.init(
+            "data/menu/",
+            "hauptmenue.json",
+            "data/tpl/app-menu.tpl",
+            ".west",
+            "8em");
+
+    document.querySelector('.hamburger').addEventListener('click', function (e) {
+      self.menue_umschalten();
+    });
+    
+    self.addEvtListener('#mi-katalog', 'click', self.media_liste);
+    self.addEvtListener('#mi-orte', 'click', self.ablageort_liste);
+    self.addEvtListener('#mi-prefs', 'click', self.prefs_liste);
+    self.addEvtListener('#mi-player', 'click', self.abspieler_liste);
+    
+    self.fusszeile_umschalten();
+    self.seitenleiste_umschalten();
+    self.dialog_unten_zeigen();
+  };
+  
+  this.abspieler_auswahl_fuellen = function() {
+    self.http_get('../api/store/Abspieler/', function (responseText) {
+      /*
+       {"ArrayList": [{"name":"Wohnz","url":"http://rpi4-wz:9090/"},{"name":"Arbz","url":"http://rpi4-az:9090/"}]}
+       */
+      self.vorlage_laden_und_fuellen("data/tpl/abs_sel.tpl", JSON.parse(responseText), function (html) {
+        document.querySelector(".abs-sel").innerHTML = html;
+      });    
+    });
+  };
+
+  /* Unterer Einblendbereich */
+  
+  this.dialog_unten_zeigen = function() {
+    self.vorlage_laden_und_fuellen("data/tpl/ctrl.tpl", "", function (html) {
+      var dlg = document.querySelector(".dialog-unten");
+      dlg.style.height = '4.5em';
+      dlg.innerHTML = html;
+      self.abspieler_auswahl_fuellen();
+    });
+  };
+
   
   // auf der obersten Ebene werden die Kataloge angezeigt,
   // darunter der Inhalt des aktuellen Pfades
   this.media_liste = function() {
     if(self.ortPfad === '/') {
       // Kataloge listen
-      self.http_get('../api/store/Ablageort/', function (responseText) {
+      self.http_get('../api/store/Ablageort/liste/', function (responseText) {
         self.vorlage_laden_und_fuellen("data/tpl/katalog_root_liste.tpl", JSON.parse(responseText), function (html) {
           document.querySelector(".zentraler-inhalt").innerHTML = html;
           self.addEvtListener('.entity-eintrag', 'click', function (event) {
@@ -76,7 +109,7 @@
   /* Die folgenden '_liste' Funktionen koennen noch vereinheitlicht werden */
 
   this.ablageort_liste = function() {
-    self.http_get('../api/store/Ablageort/', function (responseText) {
+    self.http_get('../api/store/Ablageort/liste/', function (responseText) {
       self.vorlage_laden_und_fuellen("data/tpl/ablageort_liste.tpl", JSON.parse(responseText), function (html) {
         document.querySelector(".zentraler-inhalt").innerHTML = html;
         self.addEvtListener('.entity-eintrag', 'click', function (event) {
@@ -94,7 +127,7 @@
   };
 
   this.prefs_liste = function() {
-    self.http_get('../api/store/Einstellung/', function (responseText) {
+    self.http_get('../api/store/Einstellung/liste/', function (responseText) {
       self.vorlage_laden_und_fuellen("data/tpl/einstellung_liste.tpl", JSON.parse(responseText), function (html) {
         document.querySelector(".zentraler-inhalt").innerHTML = html;
         self.addEvtListener('.entity-eintrag', 'click', function (event) {
@@ -112,7 +145,7 @@
   };
 
   this.abspieler_liste = function() {
-    self.http_get('../api/store/Abspieler/', function (responseText) {
+    self.http_get('../api/store/Abspieler/liste/', function (responseText) {
       self.vorlage_laden_und_fuellen("data/tpl/abspieler_liste.tpl", JSON.parse(responseText), function (html) {
         document.querySelector(".zentraler-inhalt").innerHTML = html;
         self.addEvtListener('.entity-eintrag', 'click', function (event) {
@@ -301,7 +334,7 @@
   
   // document.querySelectorAll(selector).forEach(elem => { elem.addEventListener(eventName, func); });
 
-  /* asynchroner HTTP Client */
+  /* --------------------- asynchroner HTTP Client ----------------- */
   
   this.http_get = function (u, cb) {
     self.http_call('GET', u, null, cb);
@@ -337,45 +370,7 @@
     }
   };
   
-  /* Unterer Einblendbereich */
-  
-  self.dialog_unten_zeigen = function() {
-    self.vorlage_laden_und_fuellen("data/tpl/ctrl.tpl", "", function (html) {
-      var dlg = document.querySelector(".dialog-unten");
-      dlg.style.height = '4.5em';
-      dlg.innerHTML = html;
-    });
-  };
-
-  /* ab hier aus App-Vorlage */
-
-  this.init = function () {
-    //self.vorlagen = new Vorlagen();
-    self.mediaPfad = '/';
-    self.ortPfad = '/';
-    self.cache = new Array();
-    self.appMenu = new AppMenu();
-    self.appMenu.init(
-            "data/menu/",
-            "hauptmenue.json",
-            "data/tpl/app-menu.tpl",
-            ".west",
-            "8em");
-
-    document.querySelector('.hamburger').addEventListener('click', function (e) {
-      self.menue_umschalten();
-    });
-    
-    self.addEvtListener('#mi-katalog', 'click', self.media_liste);
-    self.addEvtListener('#mi-orte', 'click', self.ablageort_liste);
-    self.addEvtListener('#mi-prefs', 'click', self.prefs_liste);
-    self.addEvtListener('#mi-player', 'click', self.abspieler_liste);
-    //self.addEvtListener('#mi-list', 'click', self.media_liste);    
-    
-    self.fusszeile_umschalten();
-    self.seitenleiste_umschalten();
-    self.dialog_unten_zeigen();
-  };
+  /* ------------------------ aus App-Vorlage -------------------  */
 
   this.menue_umschalten = function () {
     var ham = document.querySelector(".hamburger");
@@ -452,7 +447,7 @@
     }, timeout);
   };
   
-  /* Dialog-Funktionen */
+  /* --------------------- Dialog-Funktionen ------------------------ */
 
   /*
    Einen Dialog aus Vorlagen erzeugen
@@ -486,14 +481,14 @@
     });
   };
   
-  self.dialog_schliessen = function () {
+  this.dialog_schliessen = function () {
     document.querySelector('.close-btn').removeEventListener('click', self.dialog_schliessen);
     var dlg = document.querySelector('.dialog');
     dlg.style.height = '0';
     dlg.innerHTML = '';
   };
 
-  /* Vorlagen */
+  /* ---------------------   Vorlagen   ---------------------- */
 
   /*
    Das HTML erzeugen, das entsteht, wenn eine Vorlage mit Inhalt
@@ -547,3 +542,21 @@
 
 }
 
+/* ----------- Objekte ---------------- */
+
+function Ablageort(n, o, u) {
+  this.name = n;
+  this.ort = o;
+  this.url = u;
+}
+
+function Einstellung(k, v) {
+  this.key = k;
+  this.value = v;
+}
+
+function Abspieler(n, u) {
+  this.name = n;
+  this.url = u;
+}
+

--
Gitblit v1.9.3