From 5c621434b008d1671accfc4b9c9c9016a256fd9f Mon Sep 17 00:00:00 2001
From: ulrich
Date: Wed, 21 Apr 2021 09:42:16 +0000
Subject: [PATCH] Ein/Aus-Schalter verbessert
---
src/de/uhilger/mediaz/api/StorageHandler.java | 2 +-
www/ui/app.css | 22 +++++++++++++---------
www/ui/data/tpl/geraet_schalt_liste.txt | 7 +++++--
www/ui/js/app.js | 23 ++++++++++++++++++++---
src/de/uhilger/mediaz/entity/Geraet.java | 6 +++---
5 files changed, 42 insertions(+), 18 deletions(-)
diff --git a/src/de/uhilger/mediaz/api/StorageHandler.java b/src/de/uhilger/mediaz/api/StorageHandler.java
index 9d9a4be..4fb549e 100644
--- a/src/de/uhilger/mediaz/api/StorageHandler.java
+++ b/src/de/uhilger/mediaz/api/StorageHandler.java
@@ -178,7 +178,7 @@
// {"ison":false,"has_timer":false,"overpower":false}
String[] parts = response.body().split(",")[0].split(":");
logger.finer("ison: " + parts[1]);
- g.setStatus(parts[1]);
+ g.setStatus(Boolean.parseBoolean(parts[1]));
newList.add(g);
}
}
diff --git a/src/de/uhilger/mediaz/entity/Geraet.java b/src/de/uhilger/mediaz/entity/Geraet.java
index 3977aa9..4642b35 100644
--- a/src/de/uhilger/mediaz/entity/Geraet.java
+++ b/src/de/uhilger/mediaz/entity/Geraet.java
@@ -30,13 +30,13 @@
private String einUrl;
private String ausUrl;
private String statusUrl;
- private String status;
+ private boolean status;
- public String getStatus() {
+ public boolean getStatus() {
return status;
}
- public void setStatus(String status) {
+ public void setStatus(boolean status) {
this.status = status;
}
diff --git a/www/ui/app.css b/www/ui/app.css
index 4455e27..223d796 100644
--- a/www/ui/app.css
+++ b/www/ui/app.css
@@ -193,10 +193,18 @@
.schalt-btn {
display: inline-block;
- height: 38px;
+
+ /*
+ width: 2rem;
+ font-size: medium;
+ display: inline-block;
+ height: 2rem;
+ */
+
+ /* height: 38px; */
/* padding: 0 30px; */
text-align: center;
- font-size: 11px;
+ font-size: 1.3rem;
font-weight: 600;
line-height: 38px;
letter-spacing: .1rem;
@@ -205,18 +213,14 @@
white-space: nowrap;
/* background-color: transparent;*/
border-radius: 4px;
- border: 1px solid #bbb;
+ border: 0px solid #bbb;
cursor: pointer;
box-sizing: border-box;
margin: 0 0.2rem 0 0;
}
-.schalt-btn-ein {
- color: green;
-}
-
-.schalt-btn-aus {
- color: red;
+.toggle-icon {
+ pointer-events: none;
}
.entity-liste-kopf {
diff --git a/www/ui/data/tpl/geraet_schalt_liste.txt b/www/ui/data/tpl/geraet_schalt_liste.txt
index 41bcfcb..db48762 100644
--- a/www/ui/data/tpl/geraet_schalt_liste.txt
+++ b/www/ui/data/tpl/geraet_schalt_liste.txt
@@ -1,8 +1,11 @@
<div class='entity-formular'>
{{#.}}
<div class='geraet-schalt-eintrag'>
- <button class="schalt-btn schalt-btn-ein" id="ein-btn" gname="{{name}}">Ein</button>
- <button class="schalt-btn schalt-btn-aus" id="aus-btn" gname="{{name}}">Aus</button>
+ <button class="schalt-btn" id="ein-aus-btn" gname="{{name}}">
+ {{#status}}<i class="toggle-icon icon-toggle-on"></i>{{/status}}
+ {{^status}}<i class="toggle-icon icon-toggle-off"></i>{{/status}}
+ </button>
+ <!-- <button class="schalt-btn schalt-btn-aus" id="aus-btn" gname="{{name}}">Aus</button> -->
<div class='schalt-geraet-name schalt-geraet-{{status}} entity-eintrag'>{{name}}</div>
</div>
{{/.}}
diff --git a/www/ui/js/app.js b/www/ui/js/app.js
index 033dac4..4d1d0cf 100644
--- a/www/ui/js/app.js
+++ b/www/ui/js/app.js
@@ -163,14 +163,30 @@
var geraet = JSON.parse(responseText);
self.geraet_status_form(geraet);
}, function() {
- self.addEvtListener('#ein-btn', 'click', function (event) {
+ self.addEvtListener('#ein-aus-btn', 'click', function (event) {
var geraetName = event.target.attributes.gname.nodeValue;
- //var geraetName = document.querySelector('.schalt-geraet-name').textContent;
+ var nameElem = event.target.parentNode.querySelector('.schalt-geraet-name');
+ if(nameElem.classList.contains('schalt-geraet-true')) {
+ // ausschalten
+ self.http_get('../api/gstrg/geraet/' + geraetName + "/aus", function(responseText) {
+ // console.log(responseText);
+ self.geraet_schalt_liste();
+ });
+ } else {
+ // einschalten
+ self.http_get('../api/gstrg/geraet/' + geraetName + "/ein", function(responseText) {
+ // console.log(responseText);
+ self.geraet_schalt_liste();
+ });
+ }
+ /*
self.http_get('../api/gstrg/geraet/' + geraetName + "/ein", function(responseText) {
// console.log(responseText);
self.geraet_schalt_liste();
});
+ */
});
+ /*
self.addEvtListener('#aus-btn', 'click', function (event) {
var geraetName = event.target.attributes.gname.nodeValue;
//var geraetName = document.querySelector('.schalt-geraet-name').textContent;
@@ -178,7 +194,8 @@
// console.log(responseText);
self.geraet_schalt_liste();
});
- });
+ });
+ */
});
};
--
Gitblit v1.9.3