v3.21.0

README.md

@@ -337,6 +337,7 @@ Wenn du jetzt mehrere Devices in einem Template hast, würden ja "Dopplungen" vo
 | [scenes](#template-scenes) | LightScenes | ![](./docs/media/template_scenes_example.png) |
 | [panel](#template-panel) | Panel zur Gruppierung mehrerer Devices | ![](./docs/media/template_panel_example.png) |
 | [chart](#template-chart) | Diagramm zur Visualisierung von Log-Daten | ![](./docs/media/template_chart_example.png) |
+| [cam](#template-cam) | Anzeige von Kamerastreams | ![](./docs/media/template_cam_example.png) |
 | weather | Wettervorhersage (darksky-API) | ![](./docs/media/template_weather_example.png) |
 | [sysmon](#template-sysmon) | Systemmonitor | ![](./docs/media/template_sysmon_example.png) |
 | hmlan | HMLAN-Adapter | ![](./docs/media/template_hmlan_example.png) |
@@ -362,10 +363,10 @@ Im FHEM-Device muss im Attribut `appOptions` folgendes eingetragen werden.
   },
   "main": [
     {
-      "leftIcon": "mdi-power-off",
+      "leftBtn": "mdi-power-off",
       "leftClick": ["state::off"],
       "text": ["state:on:an","state:off:aus","state::%s"],
-      "rightIcon": "mdi-power-on",
+      "rightBtn": "mdi-power-on",
       "rightClick": ["state::on"]
     }
   ],
@@ -844,6 +845,35 @@ attr chn_sen.hm.eg.fl_Climate_FileLog alias Thermostat Flur
 attr chn_sen.hm.eg.fl_Climate_FileLog appOptions { "template": "chart", "dashboard": "true", "chartDef": [":humidity:Luftfeuchte:%:secondary",":measured-temp:Temperatur:°C"] }
 attr chn_sen.hm.eg.fl_Climate_FileLog sortby 2
 ```
+# Template Cam
+Dieses Template steht speziell für die Wiedergabe von Videostreams zur Verfügung.
+
+#### Definition
+Im FHEM-Device muss im Attribut `appOptions` folgendes eingetragen werden.
+```
+{ "template": "cam", "setup": { "source": "<stream_url>" } }
+```
+
+#### Konfiguration
+Da *Cam* kein Standard-Template ist, könnt ihr nur ausgewählte Eigenschaften über den Parameter `setup` in `appOptions` anpassen. Folgende Eigenschaften könnt ihr individuell anpassen:
+```
+"setup": {
+  "size": "col-12 col-md-6 col-lg-6",
+  "source": "<stream_url>"
+  "status": {
+    "bar": ["reading:value:level:color"]
+  },
+  "info": {
+    "left1": ["reading:value:text:icon"],
+    "left2": ["reading:value:text:icon"],
+    "mid1": ["reading:value:text:icon"],
+    "mid2": ["reading:value:text:icon"],
+    "right1": ["reading:value:text:icon"],
+    "right2": ["reading:value:text:icon"],
+  }
+}
+```
+
 # Template scenes
 Dieses Template steht speziell für den Einstz von *LightScene* [siehe](https://fhem.de/commandref_DE.html#LightScene) zur Verfügung. Es zeigt die aktuelle Szene an und gibt die Möglichkeit zwischen den in FHEM gespeicherten Szenen umuzschalten.
 #### Definition

package.json

@@ -1,6 +1,6 @@
 {
   "name": "fhemapp",
-  "version": "3.20.2",
+  "version": "3.21.0",
   "private": true,
   "author": "jemu75",
   "scripts": {

public/update.sh

@@ -3,7 +3,7 @@ gitrepo=https://github.com/jemu75/fhemApp.git
 tempdir=update
 appdir=/opt/fhem/www
 echo ---------------------------------------------------------------
-echo $(date) " Starting Update from FHEMApp..."
+echo $(date) " Starting Update FHEMApp..."
 echo ---------------------------------------------------------------
 rm -rf $tempdir
 git clone $gitrepo $tempdir

src/components/TemplCam.vue

@@ -47,9 +47,10 @@
 
       <div v-if="item.Options.status.isActive">
         <v-card-text class="pa-0">
-          <video src="">
-            Your browser does not support the VIDEO tag and/or RTP streams.
-          </video>
+          <img
+            :src="source"
+            width="100%"
+          >
         </v-card-text>
       </div>
 
@@ -121,6 +122,7 @@
     data: () => ({
       name: 'cam',
       size: '',
+      source: '',
       camIcon: 'mdi-cctv',
       expandIcon: 'mdi-arrow-expand',
       maxSize: false,
@@ -138,6 +140,7 @@
     created() {
       this.app.options = this.$fhem.app.options;
       this.size = this.$fhem.getEl(this.item, 'Options', 'setup', 'size') || 'col-12 col-sm-12 col-md-6 col-lg-4';
+      this.source = this.$fhem.getEl(this.item, 'Options', 'setup', 'source') || '';
 
       if(this.$route.params.filter && this.$route.params.filter.match('&size=max')) {
         this.maxSize = true;

src/components/TemplDefault.vue

@@ -582,7 +582,7 @@
 
           let value = /\./.test(parts[0]) ? parts[0].split('.') : [ 'Readings', parts[0], 'Value' ];
           let state = this.$fhem.getEl(this.item, ...value);
-          if(state && state.match(parts[1])) result = true;
+          if(state && state === parts[1]) result = true;
         }
 
         return result;

src/components/TemplPanel.vue

@@ -256,7 +256,7 @@
 
           let value = /\./.test(parts[0]) ? parts[0].split('.') : [ 'Readings', parts[0], 'Value' ];
           let state = this.$fhem.getEl(device, ...value);
-          if(state && state.match(parts[1])) result = true;
+          if(state && state === parts[1]) result = true;
         }
 
         return result;

www/fhemapp/index.html

@@ -1 +1 @@
-<!DOCTYPE html><html lang="de"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><link rel="icon" href="favicon.png"><link rel="apple-touch-icon" href="apple-touch-icon.png"><title>fhemapp</title><link href="css/chunk-00f750ae.8853dffa.css" rel="prefetch"><link href="css/chunk-03454508.55c011d2.css" rel="prefetch"><link href="css/chunk-0c34425c.11195de6.css" rel="prefetch"><link href="css/chunk-12e7f05c.803d1e0c.css" rel="prefetch"><link href="css/chunk-1444c05b.460ac60a.css" rel="prefetch"><link href="css/chunk-15fa718e.55c011d2.css" rel="prefetch"><link href="css/chunk-28c4def2.9d7b53c6.css" rel="prefetch"><link href="css/chunk-325da004.d6669d5e.css" rel="prefetch"><link href="css/chunk-369d55e6.06c548e9.css" rel="prefetch"><link href="css/chunk-3ab9f3ab.11195de6.css" rel="prefetch"><link href="css/chunk-40496c8f.55f3049e.css" rel="prefetch"><link href="css/chunk-97aef864.ab3894ae.css" rel="prefetch"><link href="css/chunk-a3bdc2ee.24ee5340.css" rel="prefetch"><link href="js/chunk-00f750ae.31479edc.js" rel="prefetch"><link href="js/chunk-03454508.9df43ef6.js" rel="prefetch"><link href="js/chunk-0c34425c.b465d2d6.js" rel="prefetch"><link href="js/chunk-12e7f05c.7899c456.js" rel="prefetch"><link href="js/chunk-1444c05b.85f227c2.js" rel="prefetch"><link href="js/chunk-15fa718e.4ae3c793.js" rel="prefetch"><link href="js/chunk-28c4def2.0e1dcb12.js" rel="prefetch"><link href="js/chunk-2d212bf1.233e9bdb.js" rel="prefetch"><link href="js/chunk-2d22937e.ea39b59a.js" rel="prefetch"><link href="js/chunk-2d22d812.4e2f5162.js" rel="prefetch"><link href="js/chunk-325da004.1d5d0347.js" rel="prefetch"><link href="js/chunk-369d55e6.a6d8f7e5.js" rel="prefetch"><link href="js/chunk-3ab9f3ab.fa42960e.js" rel="prefetch"><link href="js/chunk-40496c8f.3e98a56c.js" rel="prefetch"><link href="js/chunk-97aef864.ef2d1bc6.js" rel="prefetch"><link href="js/chunk-a3bdc2ee.0de04460.js" rel="prefetch"><link href="css/app.27c949a3.css" rel="preload" as="style"><link href="css/chunk-vendors.b3e40f08.css" rel="preload" as="style"><link href="js/app.ce23e979.js" rel="preload" as="script"><link href="js/chunk-vendors.6738628a.js" rel="preload" as="script"><link href="css/chunk-vendors.b3e40f08.css" rel="stylesheet"><link href="css/app.27c949a3.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but fhemapp doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="js/chunk-vendors.6738628a.js"></script><script src="js/app.ce23e979.js"></script></body></html>
+<!DOCTYPE html><html lang="de"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><link rel="icon" href="favicon.png"><link rel="apple-touch-icon" href="apple-touch-icon.png"><title>fhemapp</title><link href="css/chunk-00f750ae.8853dffa.css" rel="prefetch"><link href="css/chunk-03454508.55c011d2.css" rel="prefetch"><link href="css/chunk-0c34425c.11195de6.css" rel="prefetch"><link href="css/chunk-12e7f05c.803d1e0c.css" rel="prefetch"><link href="css/chunk-1444c05b.460ac60a.css" rel="prefetch"><link href="css/chunk-15fa718e.55c011d2.css" rel="prefetch"><link href="css/chunk-28c4def2.9d7b53c6.css" rel="prefetch"><link href="css/chunk-325da004.d6669d5e.css" rel="prefetch"><link href="css/chunk-369d55e6.06c548e9.css" rel="prefetch"><link href="css/chunk-3ab9f3ab.11195de6.css" rel="prefetch"><link href="css/chunk-40496c8f.55f3049e.css" rel="prefetch"><link href="css/chunk-97aef864.ab3894ae.css" rel="prefetch"><link href="css/chunk-a3bdc2ee.24ee5340.css" rel="prefetch"><link href="js/chunk-00f750ae.61961085.js" rel="prefetch"><link href="js/chunk-03454508.9df43ef6.js" rel="prefetch"><link href="js/chunk-0c34425c.730d45a2.js" rel="prefetch"><link href="js/chunk-12e7f05c.7899c456.js" rel="prefetch"><link href="js/chunk-1444c05b.40d3783f.js" rel="prefetch"><link href="js/chunk-15fa718e.4ae3c793.js" rel="prefetch"><link href="js/chunk-28c4def2.0e1dcb12.js" rel="prefetch"><link href="js/chunk-2d212bf1.233e9bdb.js" rel="prefetch"><link href="js/chunk-2d22937e.ea39b59a.js" rel="prefetch"><link href="js/chunk-2d22d812.4e2f5162.js" rel="prefetch"><link href="js/chunk-325da004.1d5d0347.js" rel="prefetch"><link href="js/chunk-369d55e6.a6d8f7e5.js" rel="prefetch"><link href="js/chunk-3ab9f3ab.fa42960e.js" rel="prefetch"><link href="js/chunk-40496c8f.3e98a56c.js" rel="prefetch"><link href="js/chunk-97aef864.ef2d1bc6.js" rel="prefetch"><link href="js/chunk-a3bdc2ee.0de04460.js" rel="prefetch"><link href="css/app.27c949a3.css" rel="preload" as="style"><link href="css/chunk-vendors.b3e40f08.css" rel="preload" as="style"><link href="js/app.0ea82d77.js" rel="preload" as="script"><link href="js/chunk-vendors.6738628a.js" rel="preload" as="script"><link href="css/chunk-vendors.b3e40f08.css" rel="stylesheet"><link href="css/app.27c949a3.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but fhemapp doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="js/chunk-vendors.6738628a.js"></script><script src="js/app.0ea82d77.js"></script></body></html>

www/fhemapp/update.sh

@@ -3,7 +3,7 @@ gitrepo=https://github.com/jemu75/fhemApp.git
 tempdir=update
 appdir=/opt/fhem/www
 echo ---------------------------------------------------------------
-echo $(date) " Starting Update from FHEMApp..."
+echo $(date) " Starting Update FHEMApp..."
 echo ---------------------------------------------------------------
 rm -rf $tempdir
 git clone $gitrepo $tempdir