h3n3/nspanel-lovelace-ui
1
0
Fork 0
mirror of https://github.com/joBr99/nspanel-lovelace-ui.git synced 2026-02-18 19:06:58 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #137 from britzelpuf/main

Browse Source 
Changes for panel version 30
This commit is contained in:
Johannes
2022-04-12 12:07:48 +02:00
committed by GitHub
parent ff569829fc 6b82d5715b
commit 73abbd8ea4
2 changed files with 123 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files

190
ioBroker/NsPanelTs.ts
View File

@@ -1,3 +1,4 @@
var Icons = new IconsSelector();
const Months = ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"]; const Months = ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
const Days = ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"]; const Days = ["Sonntag", "Montag", "Dienstag", "Mittwoch", "Donnerstag", "Freitag", "Samstag"];
@@ -14,7 +15,7 @@ var Wohnen: PageEntities =
"heading": "Haus", "heading": "Haus",
"useColor": true, "useColor": true,
"items": [ "items": [
<PageItem>{ id: "alias.0.Stern"}, <PageItem>{ id: "alias.0.Stern", name: "Sternsteckdose"},
<PageItem>{ id: "alias.0.Erker"}, <PageItem>{ id: "alias.0.Erker"},
<PageItem>{ id: "alias.0.Küche", interpolateColor: true }, <PageItem>{ id: "alias.0.Küche", interpolateColor: true },
<PageItem>{ id: "alias.0.Wand" } <PageItem>{ id: "alias.0.Wand" }
@@ -27,10 +28,10 @@ var Strom: PageEntities =
"heading": "Strom", "heading": "Strom",
"useColor": true, "useColor": true,
"items": [ "items": [
<PageItem>{ id: "alias.0.Netz", icon: 4, interpolateColor: true, offColor: BatteryFull, onColor: Red , minValue: -1000, maxValue: 1000 }, <PageItem>{ id: "alias.0.Netz", icon: "flash", interpolateColor: true, offColor: BatteryFull, onColor: Red, minValue: -1000, maxValue: 1000 },
<PageItem>{ id: "alias.0.Hausverbrauch", icon: 4, interpolateColor: true, offColor: BatteryFull, onColor: Red , maxValue: 1000 }, <PageItem>{ id: "alias.0.Hausverbrauch", icon: "flash", interpolateColor: true, offColor: BatteryFull, onColor: Red, maxValue: 1000 },
<PageItem>{ id: "alias.0.Pv", icon: 4, interpolateColor: true, offColor: Off, onColor: BatteryFull , maxValue: 1000 }, <PageItem>{ id: "alias.0.Pv", icon: "solar-power", interpolateColor: true, offColor: Off, onColor: BatteryFull, maxValue: 1000 },
<PageItem>{ id: "alias.0.Batterie", icon: 34, interpolateColor: true, offColor: BatteryEmpty, onColor: BatteryFull } <PageItem>{ id: "alias.0.Batterie", icon: "battery-medium", interpolateColor: true, offColor: BatteryEmpty, onColor: BatteryFull }
] ]
}; };
@@ -62,10 +63,10 @@ var button2Page: PageEntities =
export const config: Config = { export const config: Config = {
panelRecvTopic: "mqtt.0.tele.WzDisplay.RESULT", panelRecvTopic: "mqtt.0.tele.WzDisplay.RESULT",
panelSendTopic: "mqtt.0.cmnd.WzDisplay.CustomSend", panelSendTopic: "mqtt.0.cmnd.WzDisplay.CustomSend",
firstScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.HUMIDITY", ScreensaverEntityIcon: 26, ScreensaverEntityText: "Luft", ScreensaverEntityUnitText: "%" }, firstScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.HUMIDITY", ScreensaverEntityIcon: "water-percent", ScreensaverEntityText: "Luft", ScreensaverEntityUnitText: "%" },
secondScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.PRECIPITATION_CHANCE", ScreensaverEntityIcon: 19, ScreensaverEntityText: "Regen", ScreensaverEntityUnitText: "%" }, secondScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.PRECIPITATION_CHANCE", ScreensaverEntityIcon: "weather-pouring", ScreensaverEntityText: "Regen", ScreensaverEntityUnitText: "%" },
thirdScreensaverEntity: { ScreensaverEntity: "alias.0.Batterie.ACTUAL", ScreensaverEntityIcon: 34, ScreensaverEntityText: "Batterie", ScreensaverEntityUnitText: "%" }, thirdScreensaverEntity: { ScreensaverEntity: "alias.0.Batterie.ACTUAL", ScreensaverEntityIcon: "battery-medium", ScreensaverEntityText: "Batterie", ScreensaverEntityUnitText: "%" },
fourthScreensaverEntity: { ScreensaverEntity: "alias.0.Pv.ACTUAL", ScreensaverEntityIcon: 32, ScreensaverEntityText: "PV", ScreensaverEntityUnitText: "W" }, fourthScreensaverEntity: { ScreensaverEntity: "alias.0.Pv.ACTUAL", ScreensaverEntityIcon: "solar-power", ScreensaverEntityText: "PV", ScreensaverEntityUnitText: "W" },
timeoutScreensaver: 15, timeoutScreensaver: 15,
dimmode: 8, dimmode: 8,
screenSaverDoubleClick: false, screenSaverDoubleClick: false,
@@ -82,7 +83,7 @@ export const config: Config = {
"type": "cardThermo", "type": "cardThermo",
"heading": "Thermostat", "heading": "Thermostat",
"useColor": true, "useColor": true,
"items": [<PageItem>{ id: "alias.0.WzNsPanel" }] "items": [<PageItem>{ id: "alias.0.WzNsPanel", name: "Wohnzimmer" }]
} }
], ],
button1Page: button1Page, button1Page: button1Page,
@@ -90,7 +91,7 @@ export const config: Config = {
}; };
var subscriptions: any = {}; var subscriptions: any = {};
var screensaverEnabled : boolean = false;
var pageId = 0; var pageId = 0;
schedule("* * * * *", function () { schedule("* * * * *", function () {
@@ -144,24 +145,29 @@ function HandleMessage(typ: string, method: string, page: number, words: Array<s
if (typ == "event") { if (typ == "event") {
switch (method) { switch (method) {
case "startup": case "startup":
screensaverEnabled = false;
UnsubscribeWatcher(); UnsubscribeWatcher();
HandleStartupProcess(); HandleStartupProcess();
pageId = 0; pageId = 0;
GeneratePage(config.pages[0]); GeneratePage(config.pages[0]);
break; break;
case "sleepReached":
screensaverEnabled = true;
HandleScreensaver();
break;
case "pageOpenDetail": case "pageOpenDetail":
screensaverEnabled = false;
UnsubscribeWatcher(); UnsubscribeWatcher();
let pageItem = config.pages[pageId].items.find(e => e.id === words[3]); let pageItem = config.pages[pageId].items.find(e => e.id === words[3]);
if (pageItem !== undefined) if (pageItem !== undefined)
SendToPanel(GenerateDetailPage(words[2], pageItem)); SendToPanel(GenerateDetailPage(words[2], pageItem));
case "buttonPress2": case "buttonPress2":
screensaverEnabled = false;
HandleButtonEvent(words); HandleButtonEvent(words);
break; break;
case "screensaverOpen":
HandleScreensaver();
break;
case "button1": case "button1":
case "button2": case "button2":
screensaverEnabled = false;
HandleHardwareButton(method); HandleHardwareButton(method);
default: default:
break; break;
@@ -194,14 +200,19 @@ function HandleHardwareButton(method: string): void {
else { else {
return; return;
} }
// Set pageId to -1, because of the navigation arrows
let tempPageId = pageId;
pageId = -1;
GeneratePage(page); GeneratePage(page);
pageId = tempPageId;
} }
function HandleStartupProcess(): void { function HandleStartupProcess(): void {
SendDate(); SendDate();
SendTime(); SendTime();
SendToPanel({ payload: "timeout," + config.timeoutScreensaver }); SendToPanel({ payload: "timeout~" + config.timeoutScreensaver });
SendToPanel({ payload: "dimmode," + config.dimmode }); SendToPanel({ payload: "dimmode~" + config.dimmode });
} }
function SendDate(): void { function SendDate(): void {
@@ -210,7 +221,7 @@ function SendDate(): void {
var date = d.getDate(); var date = d.getDate();
var month = Months[d.getMonth()]; var month = Months[d.getMonth()];
var year = d.getFullYear(); var year = d.getFullYear();
var _sendDate = "date,?" + day + " " + date + " " + month + " " + year; var _sendDate = "date~" + day + " " + date + " " + month + " " + year;
SendToPanel(<Payload>{ payload: _sendDate }); SendToPanel(<Payload>{ payload: _sendDate });
} }
@@ -225,28 +236,40 @@ function SendTime(): void {
if (d.getMinutes() < 10) { if (d.getMinutes() < 10) {
min = "0" + d.getMinutes().toString(); min = "0" + d.getMinutes().toString();
} }
SendToPanel(<Payload>{ payload: "time," + hr + ":" + min }); SendToPanel(<Payload>{ payload: "time~" + hr + ":" + min });
} }
function GenerateEntitiesPage(page: PageEntities): Payload[] { function GenerateEntitiesPage(page: PageEntities): Payload[] {
var out_msgs: Array<Payload> = []; var out_msgs: Array<Payload> = [];
out_msgs = [{ payload: "pageType,cardEntities" }, { payload: "entityUpdHeading," + page.heading }] out_msgs = [{ payload: "pageType~cardEntities" }]
out_msgs.push({ payload: GeneratePageElements(page.items, 4, page.useColor) }); out_msgs.push({ payload: GeneratePageElements(page) });
return out_msgs return out_msgs
} }
function GenerateGridPage(page: PageGrid): Payload[] { function GenerateGridPage(page: PageGrid): Payload[] {
var out_msgs: Array<Payload> = []; var out_msgs: Array<Payload> = [];
out_msgs = [{ payload: "pageType,cardGrid" }, { payload: "entityUpdHeading," + page.heading }] out_msgs = [{ payload: "pageType~cardGrid" }]
out_msgs.push({ payload: GeneratePageElements(page.items, 6, page.useColor) }); out_msgs.push({ payload: GeneratePageElements(page) });
return out_msgs return out_msgs
} }
function GeneratePageElements(pageItems: PageItem[], maxItems: number, useColors: boolean = false): string { function GeneratePageElements(page: Page): string {
let pageData = "entityUpd"; let maxItems = 0;
switch (page.type) {
case "cardThermo":
maxItems = 1;
break;
case "cardEntities":
maxItems = 4;
break;
case "cardGrid":
maxItems = 6;
break;
}
let pageData = "entityUpd~" + page.heading + "~" + GetNavigationString(pageId)
for (let index = 0; index < maxItems; index++) { for (let index = 0; index < maxItems; index++) {
if (pageItems[index] !== undefined) { if (page.items[index] !== undefined) {
pageData += CreateEntity(pageItems[index], index + 1, useColors); pageData += CreateEntity(page.items[index], index + 1, page.useColor);
} }
else { else {
pageData += CreateEntity(<PageItem>{ id: "delete" }, index + 1); pageData += CreateEntity(<PageItem>{ id: "delete" }, index + 1);
@@ -256,9 +279,9 @@ function GeneratePageElements(pageItems: PageItem[], maxItems: number, useColors
} }
function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean = false): string { function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean = false): string {
var iconId = 0 var iconId = "0"
if (pageItem.id == "delete") { if (pageItem.id == "delete") {
return ",delete,,,,," return "~delete~~~~~"
} }
var name: string; var name: string;
var type: string; var type: string;
@@ -266,7 +289,7 @@ function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean =
if (existsObject(pageItem.id)) { if (existsObject(pageItem.id)) {
let o = getObject(pageItem.id) let o = getObject(pageItem.id)
var val = null; var val = null;
name = o.common.name.de name = pageItem.name !== undefined ? pageItem.name : o.common.name.de
if (existsState(pageItem.id + ".GET")) { if (existsState(pageItem.id + ".GET")) {
val = getState(pageItem.id + ".GET").val; val = getState(pageItem.id + ".GET").val;
@@ -281,7 +304,7 @@ function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean =
switch (o.common.role) { switch (o.common.role) {
case "light": case "light":
type = "light" type = "light"
iconId = pageItem.icon !== undefined ? pageItem.icon : 1; iconId = pageItem.icon !== undefined ? Icons.GetIcon(pageItem.icon) : Icons.GetIcon("lightbulb");
var optVal = "0" var optVal = "0"
if (val === true || val === "true") { if (val === true || val === "true") {
@@ -289,11 +312,11 @@ function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean =
iconColor = GetIconColor(pageItem, true, useColors); iconColor = GetIconColor(pageItem, true, useColors);
} }
return "," + type + "," + pageItem.id + "," + iconId + "," + iconColor + "," + name + "," + optVal; return "~" + type + "~" + pageItem.id + "~" + iconId + "~" + iconColor + "~" + name + "~" + optVal;
case "dimmer": case "dimmer":
type = "light" type = "light"
iconId = pageItem.icon !== undefined ? pageItem.icon : 1; iconId = pageItem.icon !== undefined ? Icons.GetIcon(pageItem.icon) : Icons.GetIcon("lightbulb");
var optVal = "0" var optVal = "0"
if (existsState(pageItem.id + ".ON_ACTUAL")) { if (existsState(pageItem.id + ".ON_ACTUAL")) {
val = getState(pageItem.id + ".ON_ACTUAL").val; val = getState(pageItem.id + ".ON_ACTUAL").val;
@@ -308,19 +331,19 @@ function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean =
iconColor = GetIconColor(pageItem, existsState(pageItem.id + ".ACTUAL") ? getState(pageItem.id + ".ACTUAL").val : true, useColors); iconColor = GetIconColor(pageItem, existsState(pageItem.id + ".ACTUAL") ? getState(pageItem.id + ".ACTUAL").val : true, useColors);
} }
return "," + type + "," + pageItem.id + "," + iconId + "," + iconColor + "," + name + "," + optVal; return "~" + type + "~" + pageItem.id + "~" + iconId + "~" + iconColor + "~" + name + "~" + optVal;
case "blind": case "blind":
type = "shutter" type = "shutter"
iconId = pageItem.icon !== undefined ? pageItem.icon : 11; iconId = pageItem.icon !== undefined ? Icons.GetIcon(pageItem.icon) : Icons.GetIcon("window-open");
iconColor = GetIconColor(pageItem, existsState(pageItem.id + ".ACTUAL") ? getState(pageItem.id + ".ACTUAL").val : true, useColors); iconColor = GetIconColor(pageItem, existsState(pageItem.id + ".ACTUAL") ? getState(pageItem.id + ".ACTUAL").val : true, useColors);
return "," + type + "," + pageItem.id + "," + iconId + "," + iconColor + "," + name + "," return "~" + type + "~" + pageItem.id + "~" + iconId + "~" + iconColor + "~" + name + "~"
case "info": case "info":
case "value.temperature": case "value.temperature":
case "thermostat": case "thermostat":
type = "text"; type = "text";
iconId = pageItem.icon !== undefined ? pageItem.icon : o.common.role == "value.temperature" || o.common.role == "thermostat" ? 2 : 0; iconId = pageItem.icon !== undefined ? Icons.GetIcon(pageItem.icon) : o.common.role == "value.temperature" || o.common.role == "thermostat" ? Icons.GetIcon("thermometer") : Icons.GetIcon("information-outline");
let unit = ""; let unit = "";
var optVal = "0" var optVal = "0"
if (existsState(pageItem.id + ".ON_ACTUAL")) { if (existsState(pageItem.id + ".ON_ACTUAL")) {
@@ -335,26 +358,26 @@ function CreateEntity(pageItem: PageItem, placeId: number, useColors: boolean =
} }
if (o.common.role == "value.temperature") { if (o.common.role == "value.temperature") {
iconId = pageItem.icon !== undefined ? pageItem.icon : 2; iconId = pageItem.icon !== undefined ? Icons.GetIcon(pageItem.icon) : Icons.GetIcon("thermometer");
} }
iconColor = GetIconColor(pageItem, parseInt(optVal), useColors); iconColor = GetIconColor(pageItem, parseInt(optVal), useColors);
return "," + type + "," + pageItem.id + "," + iconId + "," + iconColor + "," + name + "," + optVal + " " + unit; return "~" + type + "~" + pageItem.id + "~" + iconId + "~" + iconColor + "~" + name + "~" + optVal + " " + unit;
case "button": case "button":
type = "button"; type = "button";
iconId = pageItem.icon !== undefined ? pageItem.icon : 3; iconId = pageItem.icon !== undefined ? Icons.GetIcon(pageItem.icon) : Icons.GetIcon("gesture-tap-button");
let buttonText = pageItem.buttonText !== undefined ? pageItem.buttonText : "PRESS"; let buttonText = pageItem.name !== undefined ? pageItem.name : "PRESS";
iconColor = GetIconColor(pageItem, true, useColors); iconColor = GetIconColor(pageItem, true, useColors);
return "," + type + "," + pageItem.id + "," + iconId + "," + + iconColor + "," + name + "," + buttonText; return "~" + type + "~" + pageItem.id + "~" + iconId + "~" + + iconColor + "~" + name + "~" + buttonText;
default: default:
return ",delete,,,,"; return "~delete~~~~~";
} }
} }
return ",delete,,,,," return "~delete~~~~~"
} }
function GetIconColor(pageItem: PageItem, value: (boolean | number), useColors: boolean): number { function GetIconColor(pageItem: PageItem, value: (boolean | number), useColors: boolean): number {
@@ -384,8 +407,7 @@ function RegisterEntityWatcher(id: string): void {
return; return;
} }
subscriptions[id] = (on({ id: id, change: 'any' }, function (data) { subscriptions[id] = (on({ id: id, change: 'any' }, function (data) {
log("RegisterEntityWatcher PageId:" + pageId.toString()) SendToPanel({ payload: GeneratePageElements(config.pages[pageId]) });
GeneratePage(config.pages[pageId]);
})) }))
} }
@@ -417,15 +439,15 @@ function GetUnitOfMeasurement(id: string): string {
function GenerateThermoPage(page: PageThermo): Payload[] { function GenerateThermoPage(page: PageThermo): Payload[] {
var id = page.items[0].id var id = page.items[0].id
var out_msgs: Array<Payload> = []; var out_msgs: Array<Payload> = [];
out_msgs.push({ payload: "pageType,cardThermo" }); out_msgs.push({ payload: "pageType~cardThermo" });
// ioBroker // ioBroker
if (existsObject(id)) { if (existsObject(id)) {
let o = getObject(id) let o = getObject(id)
let name = o.common.name.de let name = page.items[0].name !== undefined ? page.items[0].name : o.common.name.de
let currentTemp = 0; let currentTemp = 0;
if (existsState(id + ".ACTUAL")) if (existsState(id + ".ACTUAL"))
currentTemp = parseInt(getState(id + ".ACTUAL").val) * 10; currentTemp = (Math.round(parseFloat(getState(id + ".ACTUAL").val) * 10)/10)*10;
let destTemp = 0; let destTemp = 0;
if (existsState(id + ".SET")) { if (existsState(id + ".SET")) {
@@ -441,7 +463,7 @@ function GenerateThermoPage(page: PageThermo): Payload[] {
let maxTemp = 300 let maxTemp = 300
let stepTemp = 5 let stepTemp = 5
out_msgs.push({ payload: "entityUpd," + id + "," + name + "," + currentTemp + "," + destTemp + "," + status + "," + minTemp + "," + maxTemp + "," + stepTemp }) out_msgs.push({ payload: "entityUpd~" + name + "~" + GetNavigationString(pageId) + "~" + id + "~" + currentTemp + "~" + destTemp + "~" + status + "~" + minTemp + "~" + maxTemp + "~" + stepTemp })
} }
return out_msgs return out_msgs
@@ -537,6 +559,19 @@ function HandleButtonEvent(words): void {
break; break;
} }
} }
function GetNavigationString(pageId: number): string {
switch (pageId) {
case 0:
return "0|1";
case config.pages.length - 1:
return "1|0";
case -1:
return "0|0";
default:
return "1|1";
}
}
function GenerateDetailPage(type: string, pageItem: PageItem): Payload[] { function GenerateDetailPage(type: string, pageItem: PageItem): Payload[] {
@@ -545,7 +580,7 @@ function GenerateDetailPage(type: string, pageItem: PageItem): Payload[] {
if (existsObject(id)) { if (existsObject(id)) {
var o = getObject(id) var o = getObject(id)
var val: (boolean | number) = 0; var val: (boolean | number) = 0;
let icon = 1; let icon = Icons.GetIcon("lightbulb");
var iconColor = rgb_dec565(config.defaultColor); var iconColor = rgb_dec565(config.defaultColor);
if (type == "popupLight") { if (type == "popupLight") {
let switchVal = "0" let switchVal = "0"
@@ -564,7 +599,7 @@ function GenerateDetailPage(type: string, pageItem: PageItem): Payload[] {
iconColor = GetIconColor(pageItem, true, false); iconColor = GetIconColor(pageItem, true, false);
} }
out_msgs.push({ payload: "entityUpdateDetail," + icon + "," + + iconColor + "," + switchVal + ",disable,disable,disable" }) out_msgs.push({ payload: "entityUpdateDetail~" + icon + "~" + + iconColor + "~" + switchVal + ",disable,disable,disable" })
} }
if (o.common.role == "dimmer") { if (o.common.role == "dimmer") {
@@ -594,7 +629,7 @@ function GenerateDetailPage(type: string, pageItem: PageItem): Payload[] {
//if (attr_support_color.includes("color_temp")) //if (attr_support_color.includes("color_temp"))
// colortemp = Math.trunc(scale(attr.color_temp, attr.min_mireds, attr.max_mireds, 0, 100)) // colortemp = Math.trunc(scale(attr.color_temp, attr.min_mireds, attr.max_mireds, 0, 100))
out_msgs.push({ payload: "entityUpdateDetail," + icon + "," + iconColor + "," + switchVal + "," + brightness + "," + colorTemp + "," + colorMode }) out_msgs.push({ payload: "entityUpdateDetail~" + icon + "~" + iconColor + "~" + switchVal + "~" + brightness + "~" + colorTemp + "~" + colorMode })
} }
} }
@@ -622,12 +657,13 @@ function UnsubscribeWatcher(): void {
} }
function HandleScreensaver(): void { function HandleScreensaver(): void {
SendToPanel({ payload: "pageType~screensaver"})
UnsubscribeWatcher(); UnsubscribeWatcher();
HandleScreensaverUpdate(); HandleScreensaverUpdate();
} }
function HandleScreensaverUpdate(): void { function HandleScreensaverUpdate(): void {
if (config.weatherEntity != null && existsObject(config.weatherEntity)) { if (screensaverEnabled && config.weatherEntity != null && existsObject(config.weatherEntity)) {
var icon = getState(config.weatherEntity + ".ICON").val; var icon = getState(config.weatherEntity + ".ICON").val;
let temperature: string = let temperature: string =
@@ -635,8 +671,8 @@ function HandleScreensaverUpdate(): void {
existsState(config.weatherEntity + ".TEMP") ? getState(config.weatherEntity + ".TEMP").val : "null"; existsState(config.weatherEntity + ".TEMP") ? getState(config.weatherEntity + ".TEMP").val : "null";
let payloadString = let payloadString =
"weatherUpdate,?" + GetAccuWeatherIcon(parseInt(icon)) + "?" "weatherUpdate~" + Icons.GetIcon(GetAccuWeatherIcon(parseInt(icon))) + "~"
+ temperature + " " + config.temperatureUnit + "?" + temperature + " " + config.temperatureUnit + "~"
payloadString += GetScreenSaverEntityString(config.firstScreensaverEntity); payloadString += GetScreenSaverEntityString(config.firstScreensaverEntity);
payloadString += GetScreenSaverEntityString(config.secondScreensaverEntity); payloadString += GetScreenSaverEntityString(config.secondScreensaverEntity);
@@ -650,54 +686,54 @@ function HandleScreensaverUpdate(): void {
function GetScreenSaverEntityString(configElement: ScreenSaverElement | null): string { function GetScreenSaverEntityString(configElement: ScreenSaverElement | null): string {
if (configElement != null && configElement.ScreensaverEntity != null && existsState(configElement.ScreensaverEntity)) { if (configElement != null && configElement.ScreensaverEntity != null && existsState(configElement.ScreensaverEntity)) {
let u1 = getState(configElement.ScreensaverEntity).val; let u1 = getState(configElement.ScreensaverEntity).val;
return configElement.ScreensaverEntityText + "?" + configElement.ScreensaverEntityIcon + "?" + u1 + " " + configElement.ScreensaverEntityUnitText + "?"; return configElement.ScreensaverEntityText + "~" + Icons.GetIcon(configElement.ScreensaverEntityIcon) + "~" + u1 + " " + configElement.ScreensaverEntityUnitText + "~";
} }
else { else {
return "???"; return "~~~";
} }
} }
function GetAccuWeatherIcon(icon: number): number { function GetAccuWeatherIcon(icon: number): string {
switch (icon) { switch (icon) {
case 24: // Ice case 24: // Ice
case 30: // Hot case 30: // Hot
case 31: // Cold case 31: // Cold
return 11; // exceptional return "window-open"; // exceptional
case 7: // Cloudy case 7: // Cloudy
case 8: // Dreary (Overcast) case 8: // Dreary (Overcast)
case 38: // Mostly Cloudy case 38: // Mostly Cloudy
return 12; // cloudy return "weather-cloudy"; // cloudy
case 11: // fog case 11: // fog
return 13; // fog return "weather-fog"; // fog
case 25: // Sleet case 25: // Sleet
return 14; // Hail return "weather-hail"; // Hail
case 15: // T-Storms case 15: // T-Storms
return 15; // lightning return "weather-lightning"; // lightning
case 16: // Mostly Cloudy w/ T-Storms case 16: // Mostly Cloudy w/ T-Storms
case 17: // Partly Sunny w/ T-Storms case 17: // Partly Sunny w/ T-Storms
case 41: // Partly Cloudy w/ T-Storms case 41: // Partly Cloudy w/ T-Storms
case 42: // Mostly Cloudy w/ T-Storms case 42: // Mostly Cloudy w/ T-Storms
return 16; // lightning-rainy return "weather-lightning-rainy"; // lightning-rainy
case 33: // Clear case 33: // Clear
case 34: // Mostly Clear case 34: // Mostly Clear
case 37: // Hazy Moonlight case 37: // Hazy Moonlight
return 17; return "weather-night";
case 3: // Partly Sunny case 3: // Partly Sunny
case 4: // Intermittent Clouds case 4: // Intermittent Clouds
case 6: // Mostly Cloudy case 6: // Mostly Cloudy
case 35: // Partly Cloudy case 35: // Partly Cloudy
case 36: // Intermittent Clouds case 36: // Intermittent Clouds
return 18; // partlycloudy return "weather-partly-cloudy"; // partlycloudy
case 18: // pouring case 18: // pouring
return 19; // pouring return "weather-pouring"; // pouring
case 12: // Showers case 12: // Showers
case 13: // Mostly Cloudy w/ Showers case 13: // Mostly Cloudy w/ Showers
@@ -705,7 +741,7 @@ function GetAccuWeatherIcon(icon: number): number {
case 26: // Freezing Rain case 26: // Freezing Rain
case 39: // Partly Cloudy w/ Showers case 39: // Partly Cloudy w/ Showers
case 40: // Mostly Cloudy w/ Showers case 40: // Mostly Cloudy w/ Showers
return 20; // rainy return "weather-rainy"; // rainy
case 19: // Flurries case 19: // Flurries
case 20: // Mostly Cloudy w/ Flurries case 20: // Mostly Cloudy w/ Flurries
@@ -714,21 +750,21 @@ function GetAccuWeatherIcon(icon: number): number {
case 23: // Mostly Cloudy w/ Snow case 23: // Mostly Cloudy w/ Snow
case 43: // Mostly Cloudy w/ Flurries case 43: // Mostly Cloudy w/ Flurries
case 44: // Mostly Cloudy w/ Snow case 44: // Mostly Cloudy w/ Snow
return 21; // snowy return "weather-snowy"; // snowy
case 29: // Rain and Snow case 29: // Rain and Snow
return 22; // snowy-rainy return "weather-snowy-rainy"; // snowy-rainy
case 1: // Sunny case 1: // Sunny
case 2: // Mostly Sunny case 2: // Mostly Sunny
case 5: // Hazy Sunshine case 5: // Hazy Sunshine
return 23; // sunny return "weather-sunny"; // sunny
case 32: // windy case 32: // windy
return 24; // windy return "weather-windy"; // windy
default: default:
return 1; return "alert-circle-outline";
} }
} }
@@ -787,14 +823,14 @@ interface PageThermo extends Page {
type PageItem = { type PageItem = {
id: string, id: string,
icon: (number | undefined), icon: (string | undefined),
onColor: (RGB | undefined), onColor: (RGB | undefined),
offColor: (RGB | undefined), offColor: (RGB | undefined),
useColor: (boolean | undefined), useColor: (boolean | undefined),
interpolateColor: (boolean | undefined), interpolateColor: (boolean | undefined),
minValue: (number | undefined), minValue: (number | undefined),
maxValue: (number | undefined), maxValue: (number | undefined),
buttonText: (string | undefined) name: (string | undefined)
} }
type Config = { type Config = {
@@ -823,7 +859,7 @@ type Config = {
type ScreenSaverElement = { type ScreenSaverElement = {
ScreensaverEntity: string | null, ScreensaverEntity: string | null,
ScreensaverEntityIcon: number | null, ScreensaverEntityIcon: string | null,
ScreensaverEntityText: string | null, ScreensaverEntityText: string | null,
ScreensaverEntityUnitText: string | null, ScreensaverEntityUnitText: string | null,
} }

63
ioBroker/README.md
View File

@@ -32,18 +32,8 @@ You can find this in the device raw settings.
- Create a state with a mqtt client or create one per hand. The mqtt adapter will not create the state CustomSend - Create a state with a mqtt client or create one per hand. The mqtt adapter will not create the state CustomSend
- you only need to send a dummy message to cmnd/<yourPanel>/CustomSend - you only need to send a dummy message to cmnd/<yourPanel>/CustomSend
- then the state will be created - then the state will be created
- Put the file icon_mapping.ts in the global folder
## Update the screensaver string
The screensaver string which is send to the display looks something like this:
weatherUpdate,?23?11 °C?26?54%?Batterie?4?12 %?PV?23?123W
All fields are seperated by a question mark. In detail the fields are:
weatherUpdate,?Icon?Text?Icon (default humidity)?Text next to the last icon?Text for the left icon on the right side?Icon?Text under the icon?Text for the right icon on the left side?Icon?Text under the icon
See the icons currently usable in the following table:
[Icon Table](../HMI#icons-ids)
You can change the string and devices in the config object.
## Hardware buttons ## Hardware buttons
If you like you can add special pages for the buttons. If you like you can add special pages for the buttons.
@@ -66,11 +56,11 @@ const BatteryEmpty: RGB = { red: 179, green: 45, blue: 25 }
var config: Config = { var config: Config = {
panelRecvTopic: "mqtt.0.tele.WzDisplay.RESULT", // This is the object where the panel send the data to. panelRecvTopic: "mqtt.0.tele.WzDisplay.RESULT", // This is the object where the panel send the data to.
panelSendTopic: "mqtt.0.cmnd.WzDisplay.CustomSend", // This is the object where data is send to the panel. panelSendTopic: "mqtt.0.cmnd.WzDisplay.CustomSend", // This is the object where data is send to the panel.
firstScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.HUMIDITY", ScreensaverEntityIcon: 26, ScreensaverEntityText: "Luft", ScreensaverEntityUnitText: "%" }, firstScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.HUMIDITY", ScreensaverEntityIcon: "water-percent", ScreensaverEntityText: "Luft", ScreensaverEntityUnitText: "%" },
// Items which should be presented on the screensaver page // Items which should be presented on the screensaver page
secondScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.PRECIPITATION_CHANCE", ScreensaverEntityIcon: 19, ScreensaverEntityText: "Regen", ScreensaverEntityUnitText: "%" }, secondScreensaverEntity: { ScreensaverEntity: "alias.0.Wetter.PRECIPITATION_CHANCE", ScreensaverEntityIcon: "weather-pouring", ScreensaverEntityText: "Regen", ScreensaverEntityUnitText: "%" },
thirdScreensaverEntity: { ScreensaverEntity: "alias.0.Batterie.ACTUAL", ScreensaverEntityIcon: 34, ScreensaverEntityText: "Batterie", ScreensaverEntityUnitText: "%" }, thirdScreensaverEntity: { ScreensaverEntity: "alias.0.Batterie.ACTUAL", ScreensaverEntityIcon: "battery-medium", ScreensaverEntityText: "Batterie", ScreensaverEntityUnitText: "%" },
fourthScreensaverEntity: { ScreensaverEntity: "alias.0.Pv.ACTUAL", ScreensaverEntityIcon: 32, ScreensaverEntityText: "PV", ScreensaverEntityUnitText: "W" }, fourthScreensaverEntity: { ScreensaverEntity: "alias.0.Pv.ACTUAL", ScreensaverEntityIcon: "solar-power", ScreensaverEntityText: "PV", ScreensaverEntityUnitText: "W" },
screenSaverDoubleClick: false, // Doubletouch needed for leaving screensaver. screenSaverDoubleClick: false, // Doubletouch needed for leaving screensaver.
timeoutScreensaver: 15, // Timeout for screensaver timeoutScreensaver: 15, // Timeout for screensaver
dimmode: 8, // Display dim dimmode: 8, // Display dim
@@ -82,45 +72,12 @@ var config: Config = {
defaultOnColor: RGB, // Default on state color for items defaultOnColor: RGB, // Default on state color for items
defaultOffColor: RGB, // Default off state color for page defaultOffColor: RGB, // Default off state color for page
temperatureUnit: "°C", // Unit to append on temperature sensors temperatureUnit: "°C", // Unit to append on temperature sensors
<<<<<<< HEAD
pages: [Wohnen, Strom, pages: [Wohnen, Strom,
{ {
"type": "cardThermo", "type": "cardThermo",
"heading": "Thermostat", "heading": "Thermostat",
"useColor": true, "useColor": true,
"items": [<PageItem>{ id: "alias.0.WzNsPanel" }] "items": [<PageItem>{ id: "alias.0.WzNsPanel" }]
=======
pages: [
{
"type": "cardEntities", // card type (cardEntities, cardThermo)
"heading": "Testseite", // heading
"useColor": false, // should colors be enabled on this page, can be overridden in PageItem
"items": [ // items array (up to 4 on cardEntities, 1 for cardThermo)
<PageItem>{ id: "alias.0.Rolladen_Eltern" }, // device which must be configured in the device panel. Use only the folder for the device, not the set, get states ...
<PageItem>{ id: "alias.0.Erker" },
<PageItem>{ id: "alias.0.Küche", useColor: true },
<PageItem>{ id: "alias.0.Wand", useColor: true }
]
},
{
"type": "cardEntities",
"heading": "Strom",
"useColor": true, // should colors be enabled on this page, can be overridden in PageItem
"items": [
<PageItem>{ id: "alias.0.Netz" },
<PageItem>{ id: "alias.0.Hausverbrauch", icon: 4, interpolateColor: true, offColor: BatteryFull, onColor: Red , maxValue: 1000 },
<PageItem>{ id: "alias.0.Pv" },
<PageItem>{ id: "alias.0.Batterie", icon: 34, interpolateColor: true, offColor: BatteryEmpty, onColor: BatteryFull }
]
},
{
"type": "cardThermo",
"heading": "Thermostat",
"useColor": false, // should colors be enabled on this page, can be overridden in PageItem
"item": "alias.0.WzNsPanel" // Needs to be a thermostat in the device panel
>>>>>>> 8a48ff35d408a7712a3052ee3cf8fc84e8b699c7
} }
], ],
button1Page: button1Page, // A cardEntities, cardThermo or nothing. This will be opened when pressing button1 button1Page: button1Page, // A cardEntities, cardThermo or nothing. This will be opened when pressing button1
@@ -139,7 +96,7 @@ type PageItem = {
interpolateColor: (boolean | undefined),// fade between color on and off, useColor on Page or PageItem must be enabled interpolateColor: (boolean | undefined),// fade between color on and off, useColor on Page or PageItem must be enabled
minValue: (number | undefined), // the minimum value for the fade calculation, if smaller the minimum value will be used minValue: (number | undefined), // the minimum value for the fade calculation, if smaller the minimum value will be used
maxValue: (number | undefined), // the maximum value for the fade calculation, if larger the maximum value will be used maxValue: (number | undefined), // the maximum value for the fade calculation, if larger the maximum value will be used
buttonText: (string | undefined) // the Button Text, default is "Press" name: (string | undefined) // the Name which should be displayed, default is the name of the object itself
} }
``` ```
@@ -170,10 +127,10 @@ pages: [
"heading": "Strom", "heading": "Strom",
"useColor": true, // should colors be enabled on this page, can be overridden in PageItem "useColor": true, // should colors be enabled on this page, can be overridden in PageItem
"items": [ "items": [
<PageItem>{ id: "alias.0.Netz" }, <PageItem>{ id: "alias.0.Netz", icon: "flash", interpolateColor: true, offColor: BatteryFull, onColor: Red, minValue: -1000, maxValue: 1000 },
<PageItem>{ id: "alias.0.Hausverbrauch" }, <PageItem>{ id: "alias.0.Hausverbrauch", icon: "flash", interpolateColor: true, offColor: BatteryFull, onColor: Red, maxValue: 1000 },
<PageItem>{ id: "alias.0.Pv" }, <PageItem>{ id: "alias.0.Pv", name: "Solar" ,icon: "solar-power", interpolateColor: true, offColor: Off, onColor: BatteryFull, maxValue: 1000 },
<PageItem>{ id: "alias.0.Batterie" } <PageItem>{ id: "alias.0.Batterie", icon: "battery-medium", interpolateColor: true, offColor: BatteryEmpty, onColor: BatteryFull }
] ]
}] }]
``` ```