Skip to content

Commit

Permalink
V3.3.1
Browse files Browse the repository at this point in the history
  • Loading branch information
@jemu75
jemu75 committed Mar 24, 2021
1 parent 2193b9f commit 756f07f
Show file tree
Hide file tree
Showing 14 changed files with 87 additions and 16 deletions.
6 changes: 5 additions & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -165,13 +165,15 @@ In den Template-Dateien können folgende Eigenschaften definiert werden. Die Zuw
"leftClick": ["reading:value:set_param"],
"leftLong": ["reading:value:set_param"],
"leftLongRelease": ["reading:value:set_param"],
"leftMenu": ["text:set_param"],
"text": ["reading:value:text"],
"text2": ["reading:value:text"],
"slider": ["reading:value:set_param:current:min:max"],
"rightBtn": ["reading:value:icon:disabled"],
"rightClick": ["reading:value:set_param"],
"rightLong": ["reading:value:set_param"],
"rightLongRelease": ["reading:value:set_param"]
"rightLongRelease": ["reading:value:set_param"],
"rightMenu": ["text:set_param"]
}
],
"info": {
Expand Down Expand Up @@ -211,13 +213,15 @@ Beispiele:
|main|leftClick|reading:wert:cmd|defniert welches FHEM-Kommando bei Klick auf die linke Taste abgesendet wird. *Hinweis:* `set <devicename>` kann weggelassen werden|
|main|leftLong|reading:wert:cmd|defniert welches FHEM-Kommando bei langem Halten der linken Taste abgesendet wird. *Hinweis:* `set <devicename>` kann weggelassen werden|
|main|leftLongRelease|reading:wert:cmd|defniert welches FHEM-Kommando beim loslassen nach langem Halten der linken Taste abgesendet wird. *Hinweis:* `set <devicename>` kann weggelassen werden|
|main|leftMenu|text:cmd|definiert für das **linke Menü** die Texte und FHEM-Kommandos. Wenn dieses Element zugewiesen wird, klappt bei Klick auf die linke Taste ein Menü auf. *Hinweis:* leftClick, leftLong und leftLongRelease stehen bei Zuweisung des Menüs nicht zur Verfügung.|
|main|text|reading:wert:text|definiert den **ersten Text** der in der Mitte angezeigt wird|
|main|text2|reading:wert:text|definiert den **zweiten Text** der in der Mitte angezeigt wird *Hinweis:* bei Verwendung von Tasten sollte auf die Anzeige eines zweiten Wertes verzichtet werden, da die Breite des Templates im Normalfall nicht ausreicht|
|main|slider|reading:wert:cmd:current:min:max|stellt einen **Slider** in der Mitte dar. In diesem Fall werden die Elemente `text` und `text2` nicht angezeigt und evtl. definierte Tasten reagieren nur auf `leftClick` bzw. `rightClick`. *Wichtig:* `cmd` muss die Ersetzung *%v* (den aktuellen Wert des Sliders) enthalten. `current` sollte nur die Ersetzung *%n* enthalten, damit der Slider den aktuellen Wert des Readings anzeigt. `min` und `max` begrenzen die Sliderwerte. *Beispiel:* `["pct::pct %v:%n:0:100"]` verbindet das Reading `pct` mit einem Slider und begrenzt die Werte auf 0-100|
|main|rightBtn|reading:wert:icon:disabled (alternativ: icon)|definiert welches *Icon* auf der rechten Taste angezeigt wird. Optional kann das Flag *disabled* gesetzt werden. Icon Bibliothek [siehe](https://materialdesignicons.com/)|
|main|leftClick|reading:wert:cmd|defniert welches FHEM-Kommando bei Klick auf die rechte Taste abgesendet wird. *Hinweis:* `set <devicename>` kann weggelassen werden|
|main|rightLong|reading:wert:cmd|defniert welches FHEM-Kommando bei langem Halten der rechten Taste abgesendet wird. *Hinweis:* `set <devicename>` kann weggelassen werden|
|main|rightLongRelease|reading:wert:cmd|defniert welches FHEM-Kommando beim loslassen nach langem Halten der rechten Taste abgesendet wird. *Hinweis:* `set <devicename>` kann weggelassen werden|
|main|rightMenu|text:cmd|definiert für das **rechte Menü** die Texte und FHEM-Kommandos. Wenn dieses Element zugewiesen wird, klappt bei Klick auf die rechte Taste ein Menü auf. *Hinweis:* rightClick, rightLong und rightLongRelease stehen bei Zuweisung des Menüs nicht zur Verfügung.|
|info|left1..2,<br>mid1..2,<br>right1..2|reading:wert:text:icon|definiert welches **Icon** und welcher **Text** in der Infozeile anzeigeigt wird|

# Übersicht der verfügbaren Templates
Expand Down
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.2.1',
version: 'v3.3.1',
status: {
color: 'secondary',
icon: 'mdi-circle',
Expand Down
81 changes: 74 additions & 7 deletions src/components/TemplDefault.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,11 +14,30 @@

<v-card-text v-if="!vals.main.slider || !isActive">
<v-row align="center">
<v-col v-if="vals.main.leftBtn && isActive" class="col-3" align="center">
<v-col v-if="vals.main.leftMenu.length == 0 && vals.main.leftBtn && isActive" class="col-3" align="center">
<v-btn small icon :disabled="vals.main.leftBtnDisabled" @mousedown="clickStart('left')" @mouseup="clickEnd('left')" @touchstart="clickStart('left')" @touchend="clickEnd('left')">
<v-icon large>{{ vals.main.leftBtn }}</v-icon>
</v-btn>
</v-col>
<v-col v-if="vals.main.leftMenu.length > 0 && vals.main.leftBtn && isActive" 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>{{ vals.main.leftBtn }}</v-icon>
</v-btn>
</template>

<v-list dense color="secondary lighten-2">
<v-list-item-group>
<v-list-item v-for="(menu, i) in vals.main.leftMenu" :key="i" @click="sendCmd(menu.cmd)">
<v-list-item-content>
<v-list-item-title class="text-subtitle-1">{{ menu.name }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list-item-group>
</v-list>
</v-menu>
</v-col>
<v-divider v-if="vals.main.leftBtn && isActive" vertical></v-divider>
<v-col align="center">
<div class="headline font-weight-bold">{{ vals.main.text }}</div>
Expand All @@ -27,11 +46,30 @@
<div class="headline font-weight-bold">{{ vals.main.text2 }}</div>
</v-col>
<v-divider v-if="vals.main.rightBtn && isActive" vertical></v-divider>
<v-col v-if="vals.main.rightBtn && isActive" class="col-3" align="center">
<v-col v-if="vals.main.rightMenu.length == 0 && vals.main.rightBtn && isActive" class="col-3" align="center">
<v-btn small icon :disabled="vals.main.rightBtnDisabled" @mousedown="clickStart('right')" @mouseup="clickEnd('right')" @touchstart="clickStart('right')" @touchend="clickEnd('right')">
<v-icon large>{{ vals.main.rightBtn }}</v-icon>
</v-btn>
</v-col>
<v-col v-if="vals.main.rightMenu.length > 0 && vals.main.rightBtn && isActive" 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>{{ vals.main.rightBtn }}</v-icon>
</v-btn>
</template>

<v-list dense color="secondary lighten-2">
<v-list-item-group>
<v-list-item v-for="(menu, i) in vals.main.rightMenu" :key="i" @click="sendCmd(menu.cmd)">
<v-list-item-content>
<v-list-item-title class="text-subtitle-1">{{ menu.name }}</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list-item-group>
</v-list>
</v-menu>
</v-col>
</v-row>
</v-card-text>

Expand Down Expand Up @@ -72,9 +110,9 @@
},
main: [
{
btnLeft: '',
leftBtn: '',
text: 'Template unbekannt',
btnRight: ''
rightBtn: '',
}
],
info: {
Expand All @@ -96,14 +134,16 @@
main: {
leftBtn: '',
leftBtnDisabled: false,
leftMenu: [],
text: '',
text2: '',
slider: false,
sliderCurrent: 0,
sliderMin: 0,
sliderMax: 100,
rightBtn: '',
rightBtnDisabled: false
rightBtnDisabled: false,
rightMenu: []
},
info: {
left1Icon: '',
Expand Down Expand Up @@ -229,6 +269,23 @@
}
},
createMenu(arr) {
let result = [];
if(arr && arr.length > 0) {
for(let item of arr) {
let vals = item.split(':');
if(vals.length > 1) {
let cmd = vals[1].match('set') ? vals[1] : 'set ' + this.item.Name + ' ' + vals[1];
result.push({ name: vals[0], cmd });
}
}
}
return result;
},
setLevel(lvl) {
if(!isNaN(lvl)) {
this.multiLevel = this.setup.main.length > 1 ? true : false;
Expand All @@ -244,18 +301,23 @@
let mainText = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].text);
let mainText2 = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].text2);
let mainLeftBtn = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].leftBtn)
let mainRightBtn = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].rightBtn)
let mainLeftBtn = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].leftBtn);
let mainRightBtn = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].rightBtn);
let mainSlider = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].slider);
let mainLeftMenu = this.createMenu(this.setup.main[this.mainLevel].leftMenu);
let mainRightMenu = this.createMenu(this.setup.main[this.mainLevel].rightMenu);
this.vals.main.text = mainText[0] || '';
this.vals.main.text2 = mainText2[0] || '';
this.vals.main.leftBtn = mainLeftBtn[0] || '';
this.vals.main.rightBtn = mainRightBtn[0] || '';
this.vals.main.leftBtnDisabled = mainLeftBtn[1] ? true : false;
this.vals.main.rightBtnDisabled = mainRightBtn[1] ? true : false;
this.vals.main.leftMenu = mainLeftMenu;
this.vals.main.rightMenu = mainRightMenu;
this.vals.main.slider = mainSlider[0] ? true : false;
this.vals.main.sliderCurrent = mainSlider[1] || 0;
Expand All @@ -272,6 +334,8 @@
let mainSlider = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].slider);
let mainLeftBtn = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].leftBtn);
let mainRightBtn = this.$fhem.handleVals(this.item, this.setup.main[this.mainLevel].rightBtn);
let mainLeftMenu = this.createMenu(this.setup.main[this.mainLevel].leftMenu);
let mainRightMenu = this.createMenu(this.setup.main[this.mainLevel].rightMenu);
let infoLeft1Vals = this.$fhem.handleVals(this.item, this.setup.info.left1);
let infoLeft2Vals = this.$fhem.handleVals(this.item, this.setup.info.left2);
let infoMid1Vals = this.$fhem.handleVals(this.item, this.setup.info.mid1);
Expand Down Expand Up @@ -314,6 +378,9 @@
this.vals.main.leftBtnDisabled = mainLeftBtn[1] ? true : false;
this.vals.main.rightBtnDisabled = mainRightBtn[1] ? true : false;
this.vals.main.leftMenu = mainLeftMenu;
this.vals.main.rightMenu = mainRightMenu;
if(errorVals.length > 0) {
this.vals.status.level = errorVals[0] || '100';
this.vals.status.color = errorVals[1] || 'error';
Expand Down
0 www/fhemapp/css/chunk-5b592ef2.611711b5.css → www/fhemapp/css/chunk-57a6c555.611711b5.css
View file
File renamed without changes.
0 www/fhemapp/css/chunk-f087d6f2.288ff701.css → www/fhemapp/css/chunk-62d9ca09.792facbe.css
View file
File renamed without changes.
1 change: 0 additions & 1 deletion www/fhemapp/css/chunk-788ccab5.611711b5.css
View file

This file was deleted.

Loading

0 comments on commit 756f07f

Please sign in to comment.