Skip to content

Commit

Permalink
V3.3.6
Browse files Browse the repository at this point in the history
  • Loading branch information
@jemu75
jemu75 committed Mar 30, 2021
1 parent 030adf3 commit c7c1fae
Show file tree
Hide file tree
Showing 7 changed files with 90 additions and 27 deletions.
29 changes: 27 additions & 2 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,7 @@ appOptions:textField-long
```

# Aufruf der App
Nachdem du **FHEMApp** wie beschrieben installiert hast, kannst du diese über `http://<deine-ip>:8083/fhem/fhemapp/index.html` bzw. über die von dir gewählten URL deines Webservers aufrufen.
Nachdem du **FHEMApp** wie beschrieben installiert hast, kannst du diese über `http://<deine_ip>:8083/fhem/fhemapp/index.html` bzw. über die von dir gewählten URL deines Webservers aufrufen.

# Konfiguration der Geräte in FHEM
Jedes SmartHome-Gerät (Device) welches in **FHEMApp** angezeigt werden soll, konfiguriert ihr nun direkt in FHEM. Dazu verwendet ihr das neu angelegte FHEM-Attribut `appOptions` sowie weitere FHEM-Attribute wie `alias`,`group`,`room` oder `sortby`.
Expand Down Expand Up @@ -242,7 +242,7 @@ Beispiele:
| [motiondetect](#template-motiondetect) | Bewegungsmelder | ![](./docs/media/template_motiondetect_example.png) |
| [watersensor](#template-watersensor) | Zisternensensor | ![](./docs/media/template_watersensor_example.png) |
| sonos | Sonosplayer | ![](./docs/media/template_sonos_example.png) |
| scenes | LightScenes | ![](./docs/media/template_scenes_example.png) |
| [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) |
| weather | Wettervorhersage (darksky-API) | ![](./docs/media/template_weather_example.png) |
Expand Down Expand Up @@ -689,3 +689,28 @@ 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 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
Im FHEM-Device muss im Attribut `appOptions` folgendes eingetragen werden.
```
{ "template": "scenes" }
```

#### Konfiguration
Da *Scenes* 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": {
"status": {
"bar": ["reading:value:level:color"]
},
"main": [
{
"text": ["reading:value:text"]
}
],
"info": {
"left1": ["reading:value:text:icon"],
}
}
```
2 changes: 1 addition & 1 deletion src/App.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@
groupList: []
}
},
version: 'v3.3.5',
version: 'v3.3.6',
status: {
color: 'secondary',
icon: 'mdi-circle',
Expand Down
80 changes: 59 additions & 21 deletions src/components/TemplScenes.vue
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<template>
<v-col class="col-12 col-sm-6 col-md-4 col-lg-4">
<v-card :dark="this.$vuetify.theme.dark" color="secondary">
<v-progress-linear height="7" :value="vals.mainLevel" :color="vals.mainColor" background-color="secondary darken-1"></v-progress-linear>
<v-progress-linear height="7" :value="vals.status.level" :color="vals.status.color" background-color="secondary darken-1"></v-progress-linear>

<v-card-title class="text-truncate">
{{ vals.title }}
Expand All @@ -11,14 +11,14 @@
<v-card-text>
<v-row align="center">
<v-col align="center">
<div class="headline font-weight-bold text-truncate">{{ vals.mainState | scene_text }}</div>
<div class="headline font-weight-bold text-truncate">{{ vals.main.text | scene_text }}</div>
</v-col>
<v-divider vertical></v-divider>
<v-col class="col-3" align="center">
<v-menu bottom left transition="slide-y-transition">
<template v-slot:activator="{ on, attrs }">
<v-btn small icon v-bind="attrs" v-on="on">
<v-icon large>{{ rightIcon }}</v-icon>
<v-icon large>{{ vals.main.rightIcon }}</v-icon>
</v-btn>
</template>

Expand All @@ -28,7 +28,7 @@
<v-list-item-content>
<v-list-item-title class="text-subtitle-1">{{ scene | scene_text }}</v-list-item-title>
</v-list-item-content>
<v-list-item-icon v-if="scene === vals.mainState">
<v-list-item-icon v-if="scene === vals.main.text">
<v-icon>mdi-check</v-icon>
</v-list-item-icon>
</v-list-item>
Expand All @@ -41,7 +41,7 @@

<v-divider></v-divider>
<v-system-bar color="secondary darken-1">
<v-icon>{{ vals.systemIcon }}</v-icon>{{ vals.systemIconValue }}
<v-icon>{{ vals.info.left1Icon }}</v-icon>{{ vals.info.left1Text }}
</v-system-bar>
</v-card>
</v-col>
Expand All @@ -51,21 +51,38 @@
export default {
data: () => ({
name: 'scene',
defaultSet: [
"state:unknown:...:0:success:mdi-movie-open",
"state::state:100:success:mdi-movie-open-check"
],
setup: {
status: {
bar: ["state:unknown:0:success","state::100:success"]
},
main: [
{
text: ["state:unknown:...","state::%s"]
}
],
info: {
left1: ["state:unknown::mdi-movie-open","state:::mdi-movie-open-check"]
}
},
vals: {
title: '',
mainState: '',
mainLevel: 0,
mainColor: '',
status: {
level: 0,
color: ''
},
main: {
text: '',
rightIcon: 'mdi-dots-vertical'
},
info: {
left1Icon: '',
left1Text: ''
},
scenes: [],
sceneSelected: -1,
systemIcon: 'mdi-movie-open-check',
systemIconValue: ''
sceneSelected: -1
},
rightIcon: 'mdi-dots-vertical',
}),
watch: {
Expand All @@ -76,11 +93,9 @@
let alias = this.$fhem.getEl(val, 'Attributes', 'alias') || val.Name;
this.vals.title = this.$fhem.getEl(val, 'Options', 'name') || alias;
this.vals.mainState = this.$fhem.getEl(val, 'Readings', 'state', 'Value');
this.vals = this.$fhem.handleStates(val, this.vals, this.defaultSet);
this.setValues();
this.vals.sceneSelected = this.vals.scenes.indexOf(this.vals.mainState);
this.vals.sceneSelected = this.vals.scenes.indexOf(this.vals.main.text);
}
},
},
Expand All @@ -92,6 +107,20 @@
},
methods: {
setValues() {
let statusVals = this.$fhem.handleVals(this.item, this.setup.status.bar);
let mainText = this.$fhem.handleVals(this.item, this.setup.main[0].text);
let infoLeft1Vals = this.$fhem.handleVals(this.item, this.setup.info.left1);
this.vals.status.level = statusVals[0] || '100';
this.vals.status.color = statusVals[1] || 'success';
this.vals.main.text = mainText[0] || '';
this.vals.info.left1Icon = infoLeft1Vals[1] || '';
this.vals.info.left1Text = infoLeft1Vals[0] || '';
},
loadScenes() {
let params = [
{ param: 'cmd', value: 'get ' + this.item.Name + ' scenes' },
Expand All @@ -106,7 +135,7 @@
let scenes = res.replace('\n\n','').split('\n');
this.vals.scenes.push(...scenes);
}
this.vals.sceneSelected = this.vals.scenes.indexOf(this.vals.mainState);
this.vals.sceneSelected = this.vals.scenes.indexOf(this.vals.main.text);
})
},
Expand All @@ -121,6 +150,15 @@
},
created() {
let status = this.$fhem.getEl(this.item, 'Options', 'setup', 'status');
let main = this.$fhem.getEl(this.item, 'Options', 'setup', 'main');
let info = this.$fhem.getEl(this.item, 'Options', 'setup', 'info');
if(status) Object.assign(this.setup.status, status);
if(main) Object.assign(this.setup.main, main);
if(info) Object.assign(this.setup.info, info);
this.setValues();
this.loadScenes();
},
Expand Down
2 changes: 1 addition & 1 deletion www/fhemapp/index.html
View file
Original file line number Diff line number Diff line change
@@ -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-03454508.55c011d2.css" rel="prefetch"><link href="css/chunk-0458398b.c4749bc4.css" rel="prefetch"><link href="css/chunk-098d33d4.61e1e199.css" rel="prefetch"><link href="css/chunk-15fa718e.55c011d2.css" rel="prefetch"><link href="css/chunk-27250ed3.55c011d2.css" rel="prefetch"><link href="css/chunk-2c05d556.cb4d0868.css" rel="prefetch"><link href="css/chunk-57a6c555.611711b5.css" rel="prefetch"><link href="css/chunk-58038582.55c011d2.css" rel="prefetch"><link href="css/chunk-62d9ca09.792facbe.css" rel="prefetch"><link href="css/chunk-72c6e8d8.8d89ed40.css" rel="prefetch"><link href="css/chunk-83618c9a.3058ccc5.css" rel="prefetch"><link href="css/chunk-d584b056.4c33e4ab.css" rel="prefetch"><link href="css/chunk-f90907bc.01cf6fd8.css" rel="prefetch"><link href="js/chunk-03454508.432c8b15.js" rel="prefetch"><link href="js/chunk-0458398b.ff29fd68.js" rel="prefetch"><link href="js/chunk-098d33d4.d13e6ad7.js" rel="prefetch"><link href="js/chunk-15fa718e.820d5967.js" rel="prefetch"><link href="js/chunk-27250ed3.00eafedc.js" rel="prefetch"><link href="js/chunk-2c05d556.1084b9d2.js" rel="prefetch"><link href="js/chunk-2d212bf1.b3f4869b.js" rel="prefetch"><link href="js/chunk-57a6c555.7c0a36f4.js" rel="prefetch"><link href="js/chunk-58038582.a600d1fb.js" rel="prefetch"><link href="js/chunk-62d9ca09.da27c615.js" rel="prefetch"><link href="js/chunk-72c6e8d8.c00175b8.js" rel="prefetch"><link href="js/chunk-83618c9a.f88bebf6.js" rel="prefetch"><link href="js/chunk-d584b056.da659915.js" rel="prefetch"><link href="js/chunk-f90907bc.3ec9d165.js" rel="prefetch"><link href="css/chunk-vendors.95431e8e.css" rel="preload" as="style"><link href="js/app.1b297626.js" rel="preload" as="script"><link href="js/chunk-vendors.aacf57ae.js" rel="preload" as="script"><link href="css/chunk-vendors.95431e8e.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.aacf57ae.js"></script><script src="js/app.1b297626.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-03454508.55c011d2.css" rel="prefetch"><link href="css/chunk-0458398b.c4749bc4.css" rel="prefetch"><link href="css/chunk-098d33d4.61e1e199.css" rel="prefetch"><link href="css/chunk-15fa718e.55c011d2.css" rel="prefetch"><link href="css/chunk-27250ed3.55c011d2.css" rel="prefetch"><link href="css/chunk-2c05d556.cb4d0868.css" rel="prefetch"><link href="css/chunk-57a6c555.611711b5.css" rel="prefetch"><link href="css/chunk-58038582.55c011d2.css" rel="prefetch"><link href="css/chunk-62d9ca09.792facbe.css" rel="prefetch"><link href="css/chunk-72c6e8d8.8d89ed40.css" rel="prefetch"><link href="css/chunk-83618c9a.3058ccc5.css" rel="prefetch"><link href="css/chunk-d584b056.4c33e4ab.css" rel="prefetch"><link href="css/chunk-f90907bc.01cf6fd8.css" rel="prefetch"><link href="js/chunk-03454508.432c8b15.js" rel="prefetch"><link href="js/chunk-0458398b.ff29fd68.js" rel="prefetch"><link href="js/chunk-098d33d4.bbdd65ab.js" rel="prefetch"><link href="js/chunk-15fa718e.820d5967.js" rel="prefetch"><link href="js/chunk-27250ed3.00eafedc.js" rel="prefetch"><link href="js/chunk-2c05d556.1084b9d2.js" rel="prefetch"><link href="js/chunk-2d212bf1.b3f4869b.js" rel="prefetch"><link href="js/chunk-57a6c555.7c0a36f4.js" rel="prefetch"><link href="js/chunk-58038582.a600d1fb.js" rel="prefetch"><link href="js/chunk-62d9ca09.da27c615.js" rel="prefetch"><link href="js/chunk-72c6e8d8.c00175b8.js" rel="prefetch"><link href="js/chunk-83618c9a.f88bebf6.js" rel="prefetch"><link href="js/chunk-d584b056.da659915.js" rel="prefetch"><link href="js/chunk-f90907bc.3ec9d165.js" rel="prefetch"><link href="css/chunk-vendors.95431e8e.css" rel="preload" as="style"><link href="js/app.4e070eed.js" rel="preload" as="script"><link href="js/chunk-vendors.aacf57ae.js" rel="preload" as="script"><link href="css/chunk-vendors.95431e8e.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.aacf57ae.js"></script><script src="js/app.4e070eed.js"></script></body></html>
2 changes: 1 addition & 1 deletion www/fhemapp/js/app.1b297626.js → www/fhemapp/js/app.4e070eed.js
View file

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions www/fhemapp/js/chunk-098d33d4.bbdd65ab.js
View file

Large diffs are not rendered by default.

1 change: 0 additions & 1 deletion www/fhemapp/js/chunk-098d33d4.d13e6ad7.js
View file

This file was deleted.

0 comments on commit c7c1fae

Please sign in to comment.