FTUI - FHEM Tablet UIStand März 2018: Version 2.6FHEM Tablet UI ist ein leichtgewichtiges und funktionsreiches Framework zum Erstellen von eigenen Userinterfaces für die Steuerung und Visualisierung von in FHEM integrierten Geräten. Ein Verständnis für HTML Code ist Voraussetzung, um sich die gewünschten Widgets zu konfigurieren. Aber mit einem Texteditor und etwas Copy&Paste ist man schnell am Ziel. Kein Scripten notwendig. Nur HTML Blöcke einfügen und die Parameter anpassen.
Mittlerweile gibt es ein großes Interesse an diesem FHEM User Interface und eine sehr nette und absolut kreative Usergemeinschaft mit viel KnowHow. Es gibt inzwischen viele weitere Widgets-Plugins und fast täglich werden es mehr.
Projekt-URLhttps://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui)
FHEM-Wikihttp://www.fhemwiki.de/wiki/FHEM_Tablet_UI (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI)
FAQhttps://github.com/knowthelist/fhem-tablet-ui/wiki/FAQ
Live-Demohttp://knowthelist.github.io/fhem/tablet/demo_widgets.html (http://knowthelist.github.io/fhem/tablet/demo_widgets.html)
Tutorials/Blogshttp://voizchat.de/fhem-tutorial-serie-teil-5-tablet-ui-installieren-und-konfigurieren (http://voizchat.de/fhem-tutorial-serie-teil-5-tablet-ui-installieren-und-konfigurieren)
http://raspberrypi.crmvy3qiisdstf8c.myfritz.net/wordpress/?p=355 (http://raspberrypi.crmvy3qiisdstf8c.myfritz.net/wordpress/?p=355)
http://www.juergenstechnikwelt.de/smarthome-2/smarthome-mit-fhem-meine-beispielkonfiguration-ueber-google-drive-verfuegbar/ (http://www.juergenstechnikwelt.de/smarthome-2/smarthome-mit-fhem-meine-beispielkonfiguration-ueber-google-drive-verfuegbar/)
https://blog.moneybag.de/fhem-alternatives-frontend-fuer-fhem-tablet-ui/ (https://blog.moneybag.de/fhem-alternatives-frontend-fuer-fhem-tablet-ui/)
https://www.van-porten.de/blog/2016/01/fhem-installation-on-raspberry-pi/ (https://www.van-porten.de/blog/2016/01/fhem-installation-on-raspberry-pi/)
http://www.benjaminroesner.com/blog/fhem-tablet-ui-1/ (http://www.benjaminroesner.com/blog/fhem-tablet-ui-1/)
InstallationKein PHP, MySQL oder andere zusätzliche Frameworks notwendig. Läuft in jedem Standard-Browser, jedes Betriebssystem und im Webviewcontrol
In der FHEM Kommandozeile folgenden Befehl eingeben (oder im FHEMWEB Eingabefenster)
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txtOder von Hand:
- Dateien herunterladen: Zip (https://github.com/knowthelist/fhem-tablet-ui/archive/master.zip)
- alle Dateien gemäß der Ordnernamen auf den FHEM Server kopieren /<fhem-Pfad>/www/tablet/*
Das UI ist nun über "http://<fhem-url>:8083/fhem/tablet/<myfile>.html" aufrufbar.
Folgende Seiten sind als Grundlage für eigene Seiten inklusive.
"http://<fhem-url>:8083/fhem/tablet/index-example.html" -> Demo UI (Achtung: benutzte Devices evtl. ändern)
"http://<fhem-url>:8083/fhem/tablet/index_empty.html" -> leeres Layout-Gerüst, als minimal Basis
"http://<fhem-url>:8083/fhem/tablet/index_layout.html" -> Demo für die Möglichkeiten der Platzierung von Widgets
"http://<fhem-url>:8083/fhem/tablet/icons_table.html" -> Tabelle aller verfügbaren Icons
"http://<fhem-url>:8083/fhem/tablet/ftui_check.html" -> Debugging-Seite für 2.ten Tag
Jetzt kann man sich eigene Seiten gestalten. z.B. flurtab.html welche dann über "http://<fhem-url>:8083/fhem/tablet/flurtab.html" aufgerufen werden kann.
Standard Widgets- thermostat
- switch
- label
- symbol
- push
- volume
- homestatus
- dimmer
- slider
- weather
- circlemenu
- image
- select
- pagetab
- pagebutton
- level
- rotor
- swiper
- progress
- simplechart
- chart
- highchart
- popup
- readinggroup
- datetimepicker
- eventmonitor
- checkbox
- range
- spinner
- swiper
- tts
Zusätzliche Widgets Quellen nesges: https://github.com/nesges/Widgets-for-fhem-tablet-ui (https://github.com/nesges/Widgets-for-fhem-tablet-ui)
Achtung: Seit dem 06.09.2016 sind die nesges Widgets nicht mehr kompatible mit der aktuellen VersionAber: einige der nesges Widgets sind jetzt im Haupt-Repository verfügbar
- klimatrend
- button
- clock
- weather
- wind_direction
- iframe
User Widgets Threads- chart (eki)
https://forum.fhem.de/index.php/topic,48562.0.html
- todoist (pula)
https://forum.fhem.de/index.php/topic,82883.0.html
- weekdaytimer (eki/svenson08)
https://forum.fhem.de/index.php/topic,48106.0.html
- scrolllabel (eki)
https://forum.fhem.de/index.php/topic,73497.0.html
- imagecover (Reinerlein)
https://forum.fhem.de/index.php/topic,70265.0.html
- fullcalview (h3llsp4wn)
https://forum.fhem.de/index.php/topic,48562.0.html
- weekprofile (Thorsten Pferdekaemper)
https://forum.fhem.de/index.php/topic,48562.0.html
- pinpad (Syrex-o)
https://forum.fhem.de/index.php/topic,79283.msg712855.html#msg712855
- gmaps (eki)
https://forum.fhem.de/index.php/topic,78379.0.html
Eigene Widgets erstellen- https://wiki.fhem.de/wiki/FTUI_eigene_Widgets
User Tools- FUIP - Fhem User Interface Painter (Thorsten Pferdekaemper)
https://forum.fhem.de/index.php/topic,85869.0.html
User-DemosScreenshots und vollständige HTMLs zur Inspiration oder als Kopiervorlage
https://github.com/ovibox/fhem-ftui-user-demos
User-Demos-Threadhttp://forum.fhem.de/index.php/topic,34233.0.html
Alte 1.5er Versionhttps://github.com/knowthelist/fhem-tablet-ui/archive/v1.5.1.zip
Screenshots:
Hier ein paar aktuelle Beispiele, was andere User mit diesem UI Framework schon gebaut haben:
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=29336;image)
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=29057;image)
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=29061;image)
Schön langsam würde sich mal eine Diplomarbeit rentieren - verschiedene Frontendansätze, Vorteile/Nachteile, Entwicklungsstand, Verbreitung, lebendig ja/nein :o
Nachdem ich auch noch auf der Suche nach "DEM" Fronten für mein Wand-Tablet bin, sag ich schon mal Danke und werde heute Abend mal testen.
So, habs mal grob eingerichtet, bekomme aber ein Error: Connection refused (111)
Kann das am Port liegen? Nutze nicht den 8083
FHEM muss per telnet ansprechbar sein. D.h. in der fhem.cfg muss so was ähnliches stehen
define telnetPort telnet 7072 global
Schaut cool aus, werde es auch testen
Gesendet von meinem HTC One mit Tapatalk
Ok, telnet, aber auch da habe ich einen anderen Port.
Kann ich den irgendwo eintragen?
In der index hinter localhost?
In der send.php, zeile 7
Sent from my iPad using Tapatalk
Okay, Verbindung scheint zu stehen, allerdings funktioniert mein Thermostat nicht, obwohl ich den Namen entsprechend geändert habe.
Coole Optik, genau meins ;)
@Mitch: Wie sieht die Zeile für das Thermostat Device aus, wenn man bei FHEM eine "list" Abfrage macht? Dazu im FHEM Web in die Command-Eingabe Box folgendes eintippen und Enter drücken: list
Ich erwarte den Status in folgender Form, da ich bis jetzt nur HomeMatic Thermostate kenne
WohnzimmerHeizung_Clima (T: 22.7 desired: 21.0 valve: 9)
Nutze auch HM und habe einfach in "Deiner" index den Namen durch mein Device geändert.
Aber bitte vom Thermostat nur den CHANNEL_04 (****_Clima) hinterlegen.
http://www.fhemwiki.de/wiki/HM-CC-RT-DN_Funk-Heizkörperthermostat (http://www.fhemwiki.de/wiki/HM-CC-RT-DN_Funk-Heizk%C3%B6rperthermostat)
Ok, dann geht das Wandthermo nicht, allerdings habe ich auch ein Ventil mit "_Clima" eingetragen?
Werde heute Abend noch mal testen.
Oh, mein Wandthermo ist noch im Schrank. Den müsste ich auch mal FHEM einbinden ...
Aber wie gesagt, du kannst mir gerne das Reading für State für dein Gerät schicken, ich sehe mir das dann an und erweitere den Parser.
Ich habe aber auch ein Problem mit meiner UI auf meinem Tablet "Odys-Noon" mit Android 4.1.1.
Immer nach einer Weile verschwinden alle <canvas> Elemente im WebBrowser und WebViewControl. Dann hilft kein Refresh mehr, nur der Neustart des Browsers. Alles funktioniert noch, nur die Canvas-Elemente werden nicht mehr gerendert. Auf allen anderen meiner Geräten macht die FHEM Tablet UI keine Probleme. Wieso verschwinden die Canvas-Elemente auf dem Tablet? Hat da jemand Erfahrung und einen Tipp für mich?
Danke
Mario
list vom Wandthermo:
Internals:
.triggerUsed 1
CFGFN
DEF 34B26D02
NAME HZ_Wohnzimmer_Climate
NR 640
STATE Ist: 20.3 °C - Soll: 16.0 °C - Luftfeuchte: 36 % - manual - Bat: ok
TYPE CUL_HM
chanNo 02
device HZ_Wohnzimmer
peerList HZ_Couch_Climate,HZ_Kueche_Climate,HZ_Esstisch_Climate,
.userreadings:
Temperature:
TIME 2015-02-25 09:11:05
modifier none
perlCode {ReadingsVal("HZ_Wohnzimmer_Climate","measured-temp",0);;}
t 1424851865.1473
trigger
value 20.3
CHANGETIME:
Helper:
Dblog:
T:
Mydblog:
TIME 1424851865.15585
VALUE 20.3 desired
Controlmode:
Mydblog:
TIME 1424851717.52688
VALUE manual
Desired-temp:
Mydblog:
TIME 1424851865.15585
VALUE 16.0
Humidity:
Mydblog:
TIME 1424851865.15585
VALUE 36
Measured-temp:
Mydblog:
TIME 1424851865.15585
VALUE 20.3
State:
Mydblog:
TIME 1424845800.09668
VALUE set_desired-temp 16.0
Temperature:
Mydblog:
TIME 1424851865.15585
VALUE 20.3
Winopenreporting:
Mydblog:
TIME 1424851717.52688
VALUE off
Readings:
2015-02-25 07:30:00 CommandAccepted yes
2015-02-16 19:56:49 R-boostPeriod 5 min
2015-02-17 09:16:43 R-dayTemp 21.5 C
2015-02-16 19:56:49 R-daylightSaveTime on
2015-02-16 19:56:49 R-heatCool heating
2015-02-16 19:56:49 R-hyst2point 0.4 C
2015-02-16 19:56:49 R-modePrioManu all
2015-02-16 19:56:49 R-modePrioParty all
2015-02-17 09:16:43 R-nightTemp 16 C
2015-02-16 19:56:49 R-noMinMax4Manu off
2015-02-16 19:56:49 R-sendWeatherData on
2015-02-17 09:16:43 R-showHumidity tempHum
2015-02-16 19:56:49 R-showInfo time
2015-02-16 19:56:49 R-showSetTemp actTemp
2015-02-17 09:16:43 R-showWeekday on
2015-02-16 19:56:49 R-tempMax 30.5 C
2015-02-16 19:56:49 R-tempMin 4.5 C
2015-02-16 19:56:49 R-tempOffset 0.0K
2015-02-16 19:56:49 R-weekPrgSel prog1
2015-02-16 19:56:49 R-winOpnBoost off
2015-02-17 09:38:25 R_P1_0_tempListSat 08:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:25 R_P1_1_tempListSun 08:00 16.0 22:30 21.5 24:00 16.0
2015-02-17 09:38:25 R_P1_2_tempListMon 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:25 R_P1_3_tempListTue 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:25 R_P1_4_tempListWed 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:25 R_P1_5_tempListThu 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:25 R_P1_6_tempListFri 06:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:25 R_P1_tempList_State verified
2015-02-17 09:38:25 R_P2_0_tempListSat 24:00 17.0
2015-02-17 09:38:25 R_P2_1_tempListSun 24:00 17.0
2015-02-17 09:38:25 R_P2_2_tempListMon 24:00 17.0
2015-02-17 09:38:25 R_P2_3_tempListTue 24:00 17.0
2015-02-17 09:38:25 R_P2_4_tempListWed 24:00 17.0
2015-02-17 09:38:25 R_P2_5_tempListThu 24:00 17.0
2015-02-17 09:38:25 R_P2_6_tempListFri 24:00 17.0
2015-02-17 09:38:25 R_P2_tempList_State verified
2015-02-17 09:38:25 R_P3_0_tempListSat 24:00 17.0
2015-02-17 09:38:25 R_P3_1_tempListSun 24:00 17.0
2015-02-17 09:38:25 R_P3_2_tempListMon 24:00 17.0
2015-02-17 09:38:25 R_P3_3_tempListTue 24:00 17.0
2015-02-17 09:38:25 R_P3_4_tempListWed 24:00 17.0
2015-02-17 09:38:25 R_P3_5_tempListThu 24:00 17.0
2015-02-17 09:38:25 R_P3_6_tempListFri 24:00 17.0
2015-02-17 09:38:25 R_P3_tempList_State verified
2015-02-17 09:16:39 RegL_01: 08:00 00:00
2015-02-17 09:16:43 RegL_07: 01:2B 02:20 03:09 04:3D 05:00 06:00 07:00 08:00 09:C7 0A:30 0B:00 0C:00 0D:00 0E:85 0F:04 10:00 11:00 12:09 13:00 14:40 15:60 16:56 17:E4 18:59 19:0E 1A:41 1B:20 1C:45 1D:20 1E:45 1F:20 20:45 21:20 22:45 23:20 24:45 25:20 26:45 27:20 28:45 29:20 2A:45 2B:20 2C:45 2D:20 2E:40 2F:60 30:57 31:0E 32:41 33:20 34:45 35:20 36:45 37:20 38:45 39:20 3A:45 3B:20 3C:45 3D:20 3E:45 3F:20 40:45 41:20 42:45 43:20 44:45 45:20 46:45 47:20 48:40 49:48 4A:56 4B:5A 4C:40 4D:90 4E:56 4F:E4 50:59 51:0E 52:41 53:20 54:45 55:20 56:45 57:20 58:45 59:20 5A:45 5B:20 5C:45 5D:20 5E:45 5F:20 60:45 61:20 62:40 63:48 64:56 65:5A 66:40 67:90 68:56 69:E4 6A:59 6B:0E 6C:41 6D:20 6E:45 6F:20 70:45 71:20 72:45 73:20 74:45 75:20 76:45 77:20 78:45 79:20 7A:45 7B:20 7C:40 7D:48 7E:56 7F:5A 80:40 81:90 82:56 83:E4 84:59 85:0E 86:41 87:20 88:45 89:20 8A:45 8B:20 8C:45 8D:20 8E:45 8F:20 90:45 91:20 92:45 93:20 94:45 95:20 96:40 97:48 98:56 99:5A 9A:40 9B:90 9C:56 9D:E4 9E:59 9F:0E A0:41 A1:20 A2:45 A3:20 A4:45 A5:20 A6:45 A7:20 A8:45 A9:20 AA:45 AB:20 AC:45 AD:20 AE:45 AF:20 B0:40 B1:48 B2:56 B3:E4 B4:59 B5:0E B6:41 B7:20 B8:45 B9:20 BA:45 BB:20 BC:45 BD:20 BE:45 BF:20 C0:45 C1:20 C2:45 C3:20 C4:45 C5:20 C6:45 C7:20 C8:45 C9:20 CA:00 CB:00 CC:00 CD:00 CE:00 CF:00 00:00
2015-02-17 09:16:47 RegL_08: 01:00 02:00 03:00 04:00 05:00 06:00 07:00 08:00 09:00 0A:00 0B:00 0C:00 0D:00 0E:00 0F:00 10:00 11:00 12:00 13:00 14:45 15:20 16:45 17:20 18:45 19:20 1A:45 1B:20 1C:45 1D:20 1E:45 1F:20 20:45 21:20 22:45 23:20 24:45 25:20 26:45 27:20 28:45 29:20 2A:45 2B:20 2C:45 2D:20 2E:45 2F:20 30:45 31:20 32:45 33:20 34:45 35:20 36:45 37:20 38:45 39:20 3A:45 3B:20 3C:45 3D:20 3E:45 3F:20 40:45 41:20 42:45 43:20 44:45 45:20 46:45 47:20 48:45 49:20 4A:45 4B:20 4C:45 4D:20 4E:45 4F:20 50:45 51:20 52:45 53:20 54:45 55:20 56:45 57:20 58:45 59:20 5A:45 5B:20 5C:45 5D:20 5E:45 5F:20 60:45 61:20 62:45 63:20 64:45 65:20 66:45 67:20 68:45 69:20 6A:45 6B:20 6C:45 6D:20 6E:45 6F:20 70:45 71:20 72:45 73:20 74:45 75:20 76:45 77:20 78:45 79:20 7A:45 7B:20 7C:45 7D:20 7E:45 7F:20 80:45 81:20 82:45 83:20 84:45 85:20 86:45 87:20 88:45 89:20 8A:45 8B:20 8C:45 8D:20 8E:45 8F:20 90:45 91:20 92:45 93:20 94:45 95:20 96:45 97:20 98:45 99:20 9A:45 9B:20 9C:45 9D:20 9E:45 9F:20 A0:45 A1:20 A2:45 A3:20 A4:45 A5:20 A6:45 A7:20 A8:45 A9:20 AA:45 AB:20 AC:45 AD:20 AE:45 AF:20 B0:45 B1:20 B2:45 B3:20 B4:45 B5:20 B6:45 B7:20 B8:45 B9:20 BA:45 BB:20 BC:45 BD:20 BE:45 BF:20 C0:45 C1:20 C2:45 C3:20 C4:45 C5:20 C6:45 C7:20 C8:45 C9:20 CA:00 CB:00 CC:00 CD:00 CE:00 CF:00 00:00
2015-02-17 09:16:51 RegL_09: 01:00 02:00 03:00 04:00 05:00 06:00 07:00 08:00 09:00 0A:00 0B:00 0C:00 0D:00 0E:00 0F:00 10:00 11:00 12:00 13:00 14:45 15:20 16:45 17:20 18:45 19:20 1A:45 1B:20 1C:45 1D:20 1E:45 1F:20 20:45 21:20 22:45 23:20 24:45 25:20 26:45 27:20 28:45 29:20 2A:45 2B:20 2C:45 2D:20 2E:45 2F:20 30:45 31:20 32:45 33:20 34:45 35:20 36:45 37:20 38:45 39:20 3A:45 3B:20 3C:45 3D:20 3E:45 3F:20 40:45 41:20 42:45 43:20 44:45 45:20 46:45 47:20 48:45 49:20 4A:45 4B:20 4C:45 4D:20 4E:45 4F:20 50:45 51:20 52:45 53:20 54:45 55:20 56:45 57:20 58:45 59:20 5A:45 5B:20 5C:45 5D:20 5E:45 5F:20 60:45 61:20 62:45 63:20 64:45 65:20 66:45 67:20 68:45 69:20 6A:45 6B:20 6C:45 6D:20 6E:45 6F:20 70:45 71:20 72:45 73:20 74:45 75:20 76:45 77:20 78:45 79:20 7A:45 7B:20 7C:45 7D:20 7E:45 7F:20 80:45 81:20 82:45 83:20 84:45 85:20 86:45 87:20 88:45 89:20 8A:45 8B:20 8C:45 8D:20 8E:45 8F:20 90:45 91:20 92:45 93:20 94:45 95:20 96:45 97:20 98:45 99:20 9A:45 9B:20 9C:45 9D:20 9E:45 9F:20 A0:45 A1:20 A2:45 A3:20 A4:45 A5:20 A6:45 A7:20 A8:45 A9:20 AA:45 AB:20 AC:45 AD:20 AE:45 AF:20 B0:45 B1:20 B2:45 B3:20 B4:45 B5:20 B6:45 B7:20 B8:45 B9:20 BA:45 BB:20 BC:45 BD:20 BE:45 BF:20 C0:45 C1:20 C2:45 C3:20 C4:45 C5:20 C6:45 C7:20 C8:45 C9:20 CA:00 CB:00 CC:00 CD:00 CE:00 CF:00 00:00
2015-02-25 09:08:37 battery ok
2015-02-25 09:08:37 boostTime -
2015-02-25 09:08:37 commReporting off
2015-02-25 09:08:37 controlMode manual
2015-02-25 09:11:05 desired-temp 16.0
2015-02-25 09:11:05 humidity 36
2015-02-25 09:11:05 measured-temp 20.3
2015-02-24 23:57:53 peerList HZ_Couch_Climate,HZ_Kueche_Climate,HZ_Esstisch_Climate,
2015-02-25 07:30:00 recentStateType ack
2015-02-25 09:11:05 state T: 20.3 desired: 16.0
2015-02-25 09:11:05 temperature 20.3
2015-02-25 09:08:37 winOpenReporting off
Helper:
Role:
chn 1
Shregr:
07 00
Attributes:
Heizungen Heizungsventile
alias Wohnzimmer
event-on-change-reading desired-temp,measured-temp,humidity,state,temperature,winOpenReporting,controlMode,ValvePosition
event-on-update-reading desired-temp,measured-temp,humidity,state,temperature,winOpenReporting,controlMode,ValvePosition
group Heizung
icon hm-tc-it-wm-w-eu
model HM-TC-IT-WM-W-EU
peerIDs 00000000,319C7202,319C7302,319D8502,
room Wohnzimmer
sortby 1
stateFormat Ist: measured-temp °C - Soll: desired-temp °C - Luftfeuchte: humidity % - controlMode - Bat: battery
tempListTmpl /opt/fhem/FHEM/tempList.cfg:HZ_Wohnzimmer_Climate
userReadings temperature {ReadingsVal("HZ_Wohnzimmer_Climate","measured-temp",0);;}
userattr Heizungen Heizungen_map structexclude
webCmd desired-temp
list von Ventil:
Internals:
CFGFN
DEF 319D8504
NAME HZ_Esstisch_Clima
NR 649
STATE Ventil: 0 % - manual - Bat: ok
TYPE CUL_HM
chanNo 04
device HZ_Esstisch
.userreadings:
Battery:
TIME 2015-02-25 09:13:28
modifier none
perlCode {ReadingsVal("HZ_Esstisch","battery",0);;}
t 1424852008.145
trigger
value ok
Temperature:
TIME 2015-02-25 09:13:28
modifier none
perlCode {ReadingsVal("HZ_Esstisch","measured-temp",0);;}
t 1424852008.145
trigger
value 20.3
Window:
TIME 2015-02-25 09:13:28
modifier none
perlCode {ReadingsVal("d_Fenster_Wohnzimmer","state",0);;}
t 1424852008.145
trigger
value closed
CHANGETIME:
Helper:
Dblog:
T:
Mydblog:
TIME 1424852008.16301
VALUE 20.3 desired: 16.0 valve: 0
Valveposition:
Mydblog:
TIME 1424852008.16301
VALUE 0
Controlmode:
Mydblog:
TIME 1424852008.16301
VALUE manual
Desired-temp:
Mydblog:
TIME 1424852008.16301
VALUE 16.0
Measured-temp:
Mydblog:
TIME 1424852008.16301
VALUE 20.3
Temperature:
Mydblog:
TIME 1424852008.16301
VALUE 20.3
Window:
Mydblog:
TIME 1424852008.16301
VALUE closed
Readings:
2015-02-21 10:36:11 CommandAccepted yes
2015-02-16 19:56:13 R-boostPeriod 5 min
2015-02-16 19:56:13 R-boostPos 80 %
2015-02-16 19:56:13 R-btnNoBckLight off
2015-02-17 09:22:21 R-dayTemp 21.5 C
2015-02-16 19:56:13 R-daylightSaveTime on
2015-02-16 19:56:13 R-decalcTime 11:00
2015-02-16 19:56:13 R-decalcWeekday Sat
2015-02-16 19:56:13 R-modePrioManu all
2015-02-16 19:56:13 R-modePrioParty all
2015-02-17 09:22:21 R-nightTemp 16 C
2015-02-16 19:56:13 R-noMinMax4Manu off
2015-02-16 19:56:13 R-regAdaptive offDefault
2015-02-16 19:56:13 R-reguExtI 15
2015-02-16 19:56:13 R-reguExtP 30
2015-02-16 19:56:13 R-reguExtPstart 30
2015-02-16 19:56:13 R-reguIntI 15
2015-02-16 19:56:13 R-reguIntP 30
2015-02-16 19:56:13 R-reguIntPstart 30
2015-02-16 19:56:13 R-showInfo time
2015-02-16 19:56:13 R-showWeekday off
2015-02-16 19:56:09 R-sign off
2015-02-16 19:56:13 R-tempMax 30.5 C
2015-02-16 19:56:13 R-tempMin 4.5 C
2015-02-16 19:56:13 R-tempOffset 0.0K
2015-02-16 19:56:13 R-valveErrPos 15 %
2015-02-16 19:56:13 R-valveMaxPos 100 %
2015-02-16 19:56:13 R-valveOffsetRt 0 %
2015-02-16 19:56:13 R-winOpnBoost off
2015-02-16 19:56:13 R-winOpnDetFall 1.4 K
2015-02-16 19:56:13 R-winOpnMode off
2015-02-16 19:56:13 R-winOpnPeriod 15 min
2015-02-16 19:56:13 R-winOpnTemp 12 C
2015-02-17 09:38:24 R_0_tempListSat 08:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:24 R_1_tempListSun 08:00 16.0 22:30 21.5 24:00 16.0
2015-02-17 09:38:24 R_2_tempListMon 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:24 R_3_tempListTue 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:24 R_4_tempListWed 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:24 R_5_tempListThu 06:00 16.0 07:30 21.5 12:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:24 R_6_tempListFri 06:00 16.0 19:00 21.5 22:30 22.0 24:00 16.0
2015-02-17 09:38:24 R_tempList_State verified
2015-02-17 09:22:16 RegL_01: 08:00 00:00
2015-02-17 09:22:21 RegL_07: 01:2B 02:20 03:09 04:3D 05:18 06:03 07:00 08:16 09:07 0A:30 0B:00 0C:64 0D:0F 0E:01 0F:00 10:00 11:00 12:09 13:0E 14:40 15:60 16:56 17:E4 18:59 19:0E 1A:41 1B:20 1C:45 1D:20 1E:45 1F:20 20:45 21:20 22:45 23:20 24:45 25:20 26:45 27:20 28:45 29:20 2A:45 2B:20 2C:45 2D:20 2E:40 2F:60 30:57 31:0E 32:41 33:20 34:45 35:20 36:45 37:20 38:45 39:20 3A:45 3B:20 3C:45 3D:20 3E:45 3F:20 40:45 41:20 42:45 43:20 44:45 45:20 46:45 47:20 48:40 49:48 4A:56 4B:5A 4C:40 4D:90 4E:56 4F:E4 50:59 51:0E 52:41 53:20 54:45 55:20 56:45 57:20 58:45 59:20 5A:45 5B:20 5C:45 5D:20 5E:45 5F:20 60:45 61:20 62:40 63:48 64:56 65:5A 66:40 67:90 68:56 69:E4 6A:59 6B:0E 6C:41 6D:20 6E:45 6F:20 70:45 71:20 72:45 73:20 74:45 75:20 76:45 77:20 78:45 79:20 7A:45 7B:20 7C:40 7D:48 7E:56 7F:5A 80:40 81:90 82:56 83:E4 84:59 85:0E 86:41 87:20 88:45 89:20 8A:45 8B:20 8C:45 8D:20 8E:45 8F:20 90:45 91:20 92:45 93:20 94:45 95:20 96:40 97:48 98:56 99:5A 9A:40 9B:90 9C:56 9D:E4 9E:59 9F:0E A0:41 A1:20 A2:45 A3:20 A4:45 A5:20 A6:45 A7:20 A8:45 A9:20 AA:45 AB:20 AC:45 AD:20 AE:45 AF:20 B0:40 B1:48 B2:56 B3:E4 B4:59 B5:0E B6:41 B7:20 B8:45 B9:20 BA:45 BB:20 BC:45 BD:20 BE:45 BF:20 C0:45 C1:20 C2:45 C3:20 C4:45 C5:20 C6:45 C7:20 C8:45 C9:20 CA:0F CB:1E CC:1E CD:0F CE:1E CF:1E 00:00
2015-02-25 09:13:28 ValvePosition 0
2015-02-25 09:13:28 battery ok
2015-02-25 09:13:28 boostTime -
2015-02-25 09:13:28 controlMode manual
2015-02-25 09:13:28 desired-temp 16.0
2015-02-25 09:13:28 measured-temp 20.3
2015-02-25 09:13:28 motorErr ok
2015-02-25 09:13:28 partyEnd -
2015-02-25 09:13:28 partyStart -
2015-02-25 09:13:28 partyTemp -
2015-02-21 10:36:11 recentStateType ack
2015-02-25 09:13:28 state T: 20.3 desired: 16.0 valve: 0
2015-02-25 09:13:28 temperature 20.3
2015-02-25 09:13:28 window closed
Helper:
Role:
chn 1
Shregr:
07 00
Attributes:
alias Esstisch
event-on-change-reading desired-temp,measured-temp,state,temperature,window,controlMode,ValvePosition
event-on-update-reading desired-temp,measured-temp,state,temperature,window,controlMode,ValvePosition
group Heizung
icon hm-cc-rt-dn
model HM-CC-RT-DN
peerIDs 00000000,
room Wohnzimmer
stateFormat Ventil: ValvePosition % - controlMode - Bat: battery
tempListTmpl /opt/fhem/FHEM/tempList.cfg:HZ_Esstisch_Clima
userReadings battery {ReadingsVal("HZ_Esstisch","battery",0);;},window {ReadingsVal("d_Fenster_Wohnzimmer","state",0);;},temperature {ReadingsVal("HZ_Esstisch","measured-temp",0);;}
;D
Wow, bin sehr begeistert!
insbesonders das temperature widget halte ich für sehr gelungen!
ein workaround für den hm wandthermostat könnte über stateformat funktionieren ?
noch ein dimmer/slider widget wäre toll - um die schöne optik beizubehalten, evtl als popup switch...
merci und bin gespannt und hoffe das es weitergeht...
alex
Es gab eine kleine Änderung, jetzt sollten die Thermo-Readings auswertbar sein.
Ich lese jetzt pro Device state anstatt STATE, dann bleibt man unabhängig vom User stateformat.
Das sieht echt stylisch aus! Ich hoffe da kommt noch was nach. Wenn man über einen Reiter etc. noch die einzelnen Räume abbilden kann (nicht Floorplan) wäre das eine feine Sache.
Macht die UI eigentlich Longpoll ?
Nein, das UI macht normales Poll aller 30 Sekunden für alles Devices auf einmal. Mit "list .* state" geht das wunderbar schnell. Jsonlist2 und xmllist ist bei mir extrem langsam (ca. 5 Sekunden), weil auch jedes mal viel zu viele Daten mitkommen und die Filtermöglichkeiten begrenzt sind.
Aber Longpoll zusammen mit HTTPSRV schaut interessant aus. Kannte ich so noch gar nicht.
Damit könnte man auch die Nutzung von PHP loswerden, war eh nur ein Workaround wegen Blockade der Cross-Origin-Anfrage.
Schaue ich mir mal an ...
Auch das Thema Dimmer Control schaue ich mir an, da habe ich schon eine coole Idee. Mehrere Tabs sollte auch einfach machbar sein.
Vielen Dank für die Vorschläge.
Mario
Na da freue ich mich auf die Aussichten. Kompliment. Ist jetzt schon schick.
Wo sind eigentlich die Icons ? Möchte gerne etwas wie "Pfeil runter" einbauen.
Danke und Gruss KU
Sieht wirklich sehr schön schlicht und aufgeräumt auf.
Zitat von: kud am 27 Februar 2015, 08:52:58
Wo sind eigentlich die Icons ? Möchte gerne etwas wie "Pfeil runter" einbauen.
Hallo Kud,
die Icons sind eigentlich kein Icons, eher ein Font. Alle 519 Icons mit den entsprechenden Namen findet man hier: http://fortawesome.github.io/Font-Awesome/icons (http://fortawesome.github.io/Font-Awesome/icons)
Man sucht sich ein Icon aus und trägt einfach den Namen bei push oder switch Elementen unter dem data-icon Attribut ein
<div type="push" device="WebRadio" data-icon="fa-step-backward" data-cmd="Prev" class="cell" ></div>Damit lassen sich ganz easy schöne Buttons bauen, die man auch als eigenständiges jQuery Plugin verwenden kann. Beispiele und Documentation zu fa-multi-button habe ich hier hinterlegt: https://github.com/knowthelist/fa-multi-button (https://github.com/knowthelist/fa-multi-button)
Hallo
Sehr schönes UI. Habe nur ein Problem auf dem PI. Webserver läuft und zeigt auch alles an. Index geändert auf meine Geräte Namen. Aber beim klicken passiert nix. Auch im log steht nichts.
Jemand eine Idee ?
Gruss stefant
gesendet vom Handy
Hallo StefanL
das müssen wir Schritt durchgehen:
1. Bietet dein FHEM Server Telnet an? Host? Port ?
2. Unterstützt der Webserver auf dem PI PHP ?
3. Wenn ja, was sieht man beim Aufruf: http://<deinServer>/<tablet-ui-pfad>/php/send.php?cmd=list+.*+state&host=localhost&port=7072 (http://<deinserver>/<tablet-ui-pfad>/php/send.php?cmd=list+.*+state&host=localhost&port=7072) ? Kommen hier Daten?
4. Wenn ja, werden im UI für die Devices die on und temp Zustände angezeigt?
5. Wenn ja, muss man die Developer Tools (Console und Netzwerkanalyse im FF Menü) bemühen und schauen, welche Fehler kommen und welche Commands gesendet werden.
Aber ich bin gerade dabei bei der Datenbeschaffung umzubauen. Ich will die PHP Aufrufe rauszuwerfen und dann die UI per Fhem HTTPSRV hosten. Damit kann man dann mit reinem Ajax arbeiten und longpoll implementieren.
Viele Grüße
Mario
Hallo Mario,
sehr schöne Oberfläche, und läuft bei mir schon.
Ein kleines Thema habe ich noch mit dem alten HM-CC-TC. Der liefert mir in state T: 23.5 H: 39. Es wird aber T: 23.5 desired: 20.0 valve: 43 benötigt wie beim HM-CC-RT-DN. Richtig? Kann mir vielleicht jemand helfen wir ich den HM-CC-TC zur richtigen Anzeige bringe. Im Voraus schon mal vielen Dank.
Wir eigentlich immer state abgefragt, oder kann ich auch auf andere Werte zugreifen (ohne Workarrounds)?
Gruß
Patrik
Hallo Mario,
ich bekomme irgendwie die TELNET Verbindung nicht hin. Zeigt bei der Eingabe vom Link NOT FOUND an. Als Webserver habe ich Apache installiert. Im UI wird beim Klick das Icon gelb. Funktion ist gegeben. Umbenannt hat er den Button auch wie in der Index.php angegeben. Bin da gerade etwas ratlos.
Könnte evtl doch an der Telnet Verbindung liegen. Port ist 7072 wie standardmäßig in FHEM angegeben.
Gruß Stefan
edit: Telnet über Putty funktioniert, bei list bekomme ich auch eine Ausgabe. Jetzt bin ich nocht ratloser :-)
@Stefan: Was passiert bei Punkt 3 von meinem Post #26? Ich vermute, dir fehlt PHP auf der Kiste.
Aber wartet noch etwas, ich hoffe noch dieses WE die HTTPSRV Version anbieten zu können. Da braucht man kein PHP mehr und ich versuche auch, andere Parameter neben 'state' zu ermöglichen.
@Mario
Bei Punkt drei kommt gar nix. NOT FOUND
Da warte ich mal ab :D
Aber PHP funktioniert.
Gruß Stefan
gesendet vom Handy
Bei Github gibt es jetzt die Version 1.1.0:
- Nutzung von HTTPSRV (kein php mehr nötig)
- Optionale Nutzung mit WebViewControl
- short poll aller 30 Sek. (long poll in Vorbereitung)
- get und set auf 'state' (weitere Parameter in Vorbereitung)
Installation:
- Einen neuen Ordner namens 'tablet' in /<fhem-path>/www anlegen
- Alle Files inkl. Unterordner nach /<fhem-path>/www/tablet kopieren
- Die Zeile 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg hinzufügen
- Die neue Oberfläche ist dann hier erreichbar: http://<fhem-path>:8083/fhem/tablet
@setstate
Hallo,
danke für die Umsetzung, jetzt funktionierts auch bei mir DAU :P :P
@StefanL
Das freut mich, dass es funzt.
Ein DAU bist du ganz gewiss nicht ;), wenn ich deine Geräte sehe ....
Den AVR NetIO mit Fhem zum Laufen zu bringen ist nicht ohne. Bei mir steuert der die Leinwand up/down. Das war nicht ohne ...
Einen schönen (Rest)-Sonntag
Mario
Sehr genial, vielen Dank!!
Was noch genial wäre, Keymatic Unterstützung ;D
Mir gefällt diese Tablet UI optisch auch sehr gut und ich bastel gerade etwas damit rum.
Wäre es nicht möglich (und vielleicht sogar sinnvoller), dass man nicht nur das Device, sondern auch das konkrete Reading angibt?
Dann könnte man sich data-part und data-unit u. ä. sparen. Und in der Regel kann man doch alles, was im state zusammengefasst ist, auch irgendwo als eigenständiges Reading auslesen (und sonst bleibt ja immer noch das Reading state).
Ich denke, damit wird das Ganze universeller und man kann sich einiges an Anpassungsaufwand sparen. Wobei ich natürlich den Aufwand nicht abschätzen kann, diese Möglichkeit erstmal zu implementieren...
Zitat von: Brockmann am 02 März 2015, 17:32:18
Wäre es nicht möglich (und vielleicht sogar sinnvoller), dass man nicht nur das Device, sondern auch das konkrete Reading angibt?
ja Brockmann, so wird das Ganze generischer und ist auch schon fast fertig umgesetzt :-)
Man kann dann data-get, data-set und data-temp angeben, wobei es für jeden device type immer defaults geben wird, damit die index.html so schlank und übersichtlich bleibt wie möglich.
Für Switches wären vllt. auch noch data-on und data-off Angaben sinnvoll, um die beiden nötigen Zustände hinterlegen zu können.
Als nächstes wird dann ein Dimmer Slider dazu kommen, der braucht aber noch etwas ...
Guten Morgen
Weiter so Mario bin auch fleißig am testen und der WAF ist auch gegeben ;D
Gruß Stefan
gesendet vom Handy
Hallo ich brauche einmal eine kleine Unterstützung..... ich komme am Punkt
Zitatadd 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
nicht weiter.
Was muss ich ich hier durchführen?
ich glaube es hat sich erledigt. Ich habe einfach mal den Pfad aufgerufen und es funktioniert, ohne mein zutun
also ich muss sagen, ich bin begeistert. läuft auf anhieb. Ich kämpfe gerade mit dem auslesen der Luftfeuchtigkeit eines HM-Thermostat.
Zitat<div type="label" device="Wohnzimmer.Wandthermostat" data-part="4" data-unit="%" class="cell big"></div>
<div type="label" class="cell">Luftfeuchte</div>
liefert mit nur die Temperatur.
mit
Zitat<div type="label" device="Wohnzimmer.Wandthermostat_humidity" data-part="4" data-unit="%" class="cell big"></div>
<div type="label" class="cell">Luftfeuchte</div>
liefert kein Ergebniss :-[
Du musst data-part entsprechend ändern
ok, aber woher weiß ich welchen Wert ich eintragen muss? Habe jetzt alles von 1-5 ausprobiert. Alternativ habe das ganze nun mit einem Netatmo Innenthermostat ausprobiert, aber auch hier kein Erfolg . :-[
"list netatmot" liefert folgendes Ergebnis:
STATE T: 22.8 °C Luftfeuchtigkeit: 58% CO2: 1513 ppm
Nach meinem Verständnis wäre dann "data-part"= 2 und "data-part" = 5, oder ?
by the Way....auch auf einem 10.1" Tablet macht das ganze einiges her und es ist noch einiges an Platz vorhanden wie man der Hardcopy entnehmen kann. Ich hoffe sehr das hier weitere Entwicklungspotentiale freigesetzt werden :-D
(//)
Bei mir läuft das Ganze auch einwandfrei. Großes Kompliment an den Ersteller! Ich hätte noch eine Frage dazu. Ich würde gerne mein Rollo (das auf die KOmmandos "up" und "down" hört), steuern.
Momentan habe ich das Ganze so eingebunden:
<div type="push" device="RolloAktor1" data-part="2" data-cmd="down" class="cell"></div>
<div type="label" class="cell">Rollo</div>
Das Ganze funktioniert, aber natürlich nur für den down-Befehl.
Kann ich das ganze auch so machen, dass es beides kann (wie auch das Licht): Up wenn das Rollo unten ist und down, wenn es oben ist?
Danke und viele Grüße,
Andy
Die neue Version ist oben: v1.2.0
- neue data Attribute für flexibles Wählen der Readings
* data-get : reading to get from FHEM (default 'STATE')
* data-set : command to send to FHEM (set <device> <command> <value>)
* data-temp : reading for measured temperature of thermostates
- longpoll eingeschaltet
* sofortiges Update der Devices bei Änderung des Zustandes
* shortpoll auf 5 Minuten geändert für full sync update
Beispiel für die neuen Attribute:
<div type="thermostat" device="KH_Clima" data-get="desired-temp" data-temp="measured-temp" class="cell"></div>
<div type="label" device="THSensorWZ" data-get="humidity" data-unit="%" class="cell big"></div>
Alle alten "data-cmd" müssen in "data-set" umbenannt werden.
@Andy: Wie man einen Rollo Toggle Button kreieren kann, werde ich mir morgen mal überlegen ...
ZitatDie neue Version ist oben: v1.2.0
Welche Dateien muss ich denn ersetzten ???
Danke für die Info. Wie machst Du es denn dann beim Licht? Immer das "toggle" Kommando senden?
RESPEKT! Mit den neuen Attributen bieten sich wieder viele neue Möglichkeiten an. Woran ich gestern Abend noch gescheitert bin, konnte ich nun heute erfolgreich umsetzen!!
Im Garten kann ich nun die Werte aus der Netatmo-Wetterstation auslesen und den Luftdruck über die Wettervorhersage:
(//)
weiter so !!!!
Hab gerade die neue Version kopiert und jetzt zeigen die Thermostate keine Temperatur mehr an?
Verstellen kann ich sie (also desired-temp)
ja das ist richtig, du musst jetzt mit den neuen Attributen arbeiten!! => data-get
Zitat<div type="thermostat" device="Wohnzimmer.Wandthermostat" data-get="desired-temp" data-temp="measured-temp"
class="cell"></div>
Dann wird alles wieder richtig angezeigt!!!
mir ist gerade eine Winzigkeit aufgefallen. Kann man die Gridhöhe irgendwo anpassen, so dass man drei Schalter untereinander darstellen lassen kann? Siehe Pfeil auf meinem Ausdruck, dann weißt was ich meine ;)
(//)
Noch eine Anmerkung bzw. ein Verbesserungsvorschlag. Ich lasse mir den aktuellen sowie den Tagesverbrauch ausgeben. Die Werte sind allerdings zu lang. Kann ich diese "runden" lassen? (also ich weiß das man sowas mit JS machen kann, aber ich kann eben kein JS ) :-[
Könntest Du mal kurz erklären, wie Du den Homestatus-Selektor einsetzt?
Ich habe einfach mal einen Dummy als Device eingetragen und dessen state wird auch entsprechend gesetzt, aber die Anzeige springt nach einigen Sekunden immer wieder auf "Home" zurück.
Der funktioniert bei mir leider auch nicht.
Habe mir auch einen dummy dazu angelegt, welchen ich über das PRECENSE Modul mit triggere.
Aber auf der Oberfläche stimmt es nicht überein und wenn ich z.B. "abwesend" setze, springt es zurück auf "Home".
Stelle ich dagegen in fhem den dummy auf 3, zerschiesst es das homestatus Icon auf der Oberfläche.
Hallo geneigte User 8)
das mit dem HomeStatus ist ein böser Bug.
Dafür wird es heute später ein Bugfix und einige Änderung geben, jetzt ist erst einmal die Family wichtig.
Ciao und Danke fürs tolle Feedback
Mario
Kann ich einem switch-Widget - das einen dummy bedient, der die Werte 1 und 0 annehmen kann - sagen, dass "1" statt "on" und "0" statt "off" senden soll? Bzw. kann das Attribut "webCmd" ausgewertet werden?
Beispiel:
define OPT_SPEAK dummy
attr OPT_SPEAK webCmd 1:0
attr OPT_SPEAK devStateIcon 1:audio_volume_high@green:0 0:audio_volume_mute@red:1
<div type="switch" device="OPT_SPEAK" class="cell" data-icon="fa-volume-up"></div>
Der switch führt dazu, dass "on" und "off" in den dummy geschrieben werden.
Zitat von: andreas_r am 04 März 2015, 21:17:19
Kann ich das ganze auch so machen, dass es beides kann (wie auch das Licht): Up wenn das Rollo unten ist und down, wenn es oben ist?
Hallo Andreas,
ab sofort (Version: 1.2.1) kann man das so realisieren:
<div type="switch" device="wzRollo" data-on="up" data-off="down" data-icon="fa-bars" class="cell" ></div>
<div type="label" class="cell">Rollo</div>
Zitat von: bjoernbo am 05 März 2015, 07:54:26
Welche Dateien muss ich denn ersetzten ???
Heute diese:
modified: index.html
modified: js/fhem-tablet-ui.js
modified: lib/fa-multi-button.min.js
Wobei die meisten Änderungen hauptsächlich in der js/fhem-tablet-ui.js liegen. Die muss immer ausgetauscht werden.
Die Datei index.html solltet ihr als Beispiel betrachten und eure Version nur adaptieren, falls es konzeptionelle Änderungen gab.
Zitat von: bjoernbo am 05 März 2015, 11:13:17
mir ist gerade eine Winzigkeit aufgefallen. Kann man die Gridhöhe irgendwo anpassen, so dass man drei Schalter untereinander darstellen lassen kann? Siehe Pfeil auf meinem Ausdruck, dann weißt was ich meine ;)
Dafür kann man in der index.html mit der data-sizex und data-sizey (n-Raster-Einheiten) experimentieren.
<li data-row="1" data-col="3" data-sizex="2" data-sizey="1">Welche Maße die Raster-Einheiten haben wird hier festgelegt:
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
ich habe alle ersetzt aus die die Index! Denn wenn ich die Index ersetze sind ja meine Werte weg, oder meinst du das ernst???
... und ich muss sagen, wiedermal genial! Das mit dem runden "data-fix" funktioniert!!!! (siehe SONSTIGES, Verbrauch)
(//)
Zitat von: bjoernbo am 05 März 2015, 11:45:03
Noch eine Anmerkung bzw. ein Verbesserungsvorschlag. Ich lasse mir den aktuellen sowie den Tagesverbrauch ausgeben. Die Werte sind allerdings zu lang. Kann ich diese "runden" lassen? (also ich weiß das man sowas mit JS machen kann, aber ich kann eben kein JS ) :-[
Hallo bjoernbo,
dafür gibt es ab sofort (v1.2.1) das data-fix Attribute für Label Widgets
<div type="label" device="THSensorWZ" data-get="humidity" data-fix="0" data-unit="%" class="cell big"></div>Die Zahl bei data-fix legt die Anzahl der Nachkommastellen fest.
Zitat von: Brockmann am 05 März 2015, 15:19:08
Könntest Du mal kurz erklären, wie Du den Homestatus-Selektor einsetzt?
Ich habe einfach mal einen Dummy als Device eingetragen und dessen state wird auch entsprechend gesetzt, aber die Anzeige springt nach einigen Sekunden immer wieder auf "Home" zurück.
Sorry, das war ein Bug, der jetzt (v1.2.1) gefixed ist.
Ich steuere darüber auch ein Dummy, der per PRESENCE Modul verwaltet wird.
Viele Grüße
Mario
Zitat von: nesges am 05 März 2015, 22:45:08
Kann ich einem switch-Widget - das einen dummy bedient, der die Werte 1 und 0 annehmen kann - sagen, dass "1" statt "on" und "0" statt "off" senden soll? Bzw. kann das Attribut "webCmd" ausgewertet werden?
Hallo nesges,
ja, mit den neuen Attributen: data-on="1" data-off="0"
Viele Grüße
Mario
;D @setstate ... das habe ich doch mit Post #60 zum Ausdruck gebracht. Funzt alles wunderbar! bereits umgesetzt!
So und nun .... GN8 :-D
Zitat von: setstate am 05 März 2015, 23:28:38
ja, mit den neuen Attributen: data-on="1" data-off="0"
Danke! data-on funktioniert, für data-off wird nach wie vor "off" gesetzt. Ich nehme an, weil "0" irgendwo als false interpretiert wird. Setze ich data-off="hurz" funktioniert's wunderbar.
Edit: fhem-tablet-ui.js 174f
$(this).data('on', String($(this).data('on')) || 'on');
$(this).data('off', String($(this).data('off')) || 'off');Damit geht's bei mir. Ich hab allerdings kaum Ahnung von Javascript, kann also vollkommen falsch sein :-)
Edit2: Unabhängig vom setzen der Werte funktioniert das Lesen nur noch wenn data-on/off explizit gesetzt sind. D.h. auch switches die on/off als state verwenden werden erst korrekt angezeigt, wenn
data-on="on" data-off="off" gesetzt ist
Hallo nesges,
danke für die Info und den Lösungsansatz. Du lagst genau richtig, die '0' wird von der $.data() Funktion ungünstig interpretiert.
Hiermit geht es:
$(this).data('on', $(this).attr('data-on') || 'on');
$(this).data('off', $(this).attr('data-off') || 'off');
Hab es geändert und update bei Github gemacht.
Wow, das geht ja richtig flott voran hier!
Und das Beste: Wenn man sich Featurewünsche verkneift, um nicht unverschämt zu erscheinen, werden sie über Nacht trotzdem umgesetzt (data-on & data-off)! ;D
Zwei Sache sind mir beim Testen gerade aufgefallen:
In der aktuellen Version scheint sich layoutmäßig etwas verändert zu haben, denn mit dem folgenden Code:
<li data-row="4" data-col="1" data-sizex="2" data-sizey="1">
<header>BADEZIMMER - Lüftung</header>
<div class="left">
<div type="label" device="BZ_TC" data-get="humidity" data-unit="%" class="cell big"></div>
</div>
<div class="left">
<div type="switch" device="BZ_Luefter" data-icon="fa-spinner" data-on="on-for-timer 300" class="cell big"></div>
</div>
<div class="right">
<div type="label" device="FO_TH" data-get="humidity" data-unit="%" class="cell big"></div>
</div>
</li>
passten gestern noch drei Elemente sauber nebeneinander in ein 2x1-Feld. Heute rutscht das dritte Element nach unten ab und ist nicht mehr ganz zu sehen. Wobei das aber rein platzmäßig auch kaum passen kann? Ist der Font eventuell größer geworden?
Beim longpoll ist mir aufgefallen, dass der längst nicht so zügig reagiert wie bei der FHEM-Web-GUI, wo die Änderungen ja praktisch sofort sichtbar werden. Nach ein paar Tests ist es bei mir so, dass die Werte real zweimal pro Minute aktualisiert werden (also exakt alle 30 Sekunden). Ist das so vorgesehen oder läuft da bei mir etwas schief?
Und doch mal zwei Feature-Wünsche (wirklich nur Anregungen/Wünsche, bitte nicht als Forderung missverstehen!):
Mehr Layout-Möglichkeiten:
Beispielsweise eine dritte Schriftgröße, etwa "cell small" wird die jetzige Standardschrift, "cell" wird eine Zwischengröße und "cell big" bleibt.
Neben class left und right noch middle (wenn das überhaupt Sinn macht, so ganz habe ich das Layout-Prinzip noch nicht verstanden, bislang mache ich das per trial-and-error ;) )
Eigene Farbangaben für Schriften (im Sinne für einzelne Elemente eine abweichende Farbe angeben).
Status-Selektor:
Ich weiß, das ist vermutlich aufwändiger als es scheint, aber es wäre toll, wenn der Status-Selektor konfigurierbar wäre, so dass man Icons und Beschriftung und eventuell auch set-Werte individuell anpassen kann. Man kann das zwar alles in der fhem-tablet-ui.js anpassen, aber das wird ja bei jeder neuen Version überschrieben. Deshalb wären Konfigurationsmöglichkeiten besser und dadurch würde dieses schöne Element auch universeller nutzbar.
Und noch eine Frage:
Sollte das Verändern des Grid per Drag& Drop eigentlich funktionieren? Bei mir klappt das weder in Firefox noch in Chrome.
@Brockmann, dass ist mir auch aufgefallen. Unter Safari geht das auch nicht. Wenn ich allerdings die Seite http://gridster.net (http://gridster.net) aufrufe und in den Demo Dialog wechsel ist das verschieben via Drag&Drop möglich.
Ich weiß nicht, ob ich mit dieser Gridster-Geschichte einfach nicht klar komme, oder ob da was nicht funktioniert (abgesehen von Drag & Drop, aber vielleicht hat das damit auch zu tun?).
Ganz einfaches Beispiel:
<html>
<title>FHEM</title>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.1.0
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="100">
<meta name="widget_base_height" content="135">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Element 1</header>
</li>
<li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
<header>Element 2</header>
</li>
<li data-row="3" data-col="3" data-sizex="1" data-sizey="1">
<header>Element 3</header>
</li>
</ul>
</div>
</body>
</html>
Drei Elemente, die jeweils um eins in X- und Y-Achse versetzt sein sollen.
Bei mir werden die aber einfach in der obersten Reihe nebeneinander angezeigt, also 1-1,1-2,1-3 statt 1-1,2-2,3-3?
Ich kämpfe auch gerade damit und glaube einfach, ich verstehe das noch nicht ganz:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Element 1</header>
</li>
data-row="1" heißt für mich Reihe 1
data-col="1" heißt Spalte 1
data-sizex="1" heißt Breite 1 (wie in <meta name="widget_base_width" content="100"><meta name="widget_base_height" content="135"> definiert)
data-sizey="1" heißt Höhe 1 (wie in <meta name="widget_base_width" content="100"><meta name="widget_base_height" content="135"> definiert)
Wenn ich jetzt folgendes definiere
<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>Element 1</header>
</li>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="2">
<header>Element 1</header>
</li>
<li data-row="2" data-col="1" data-sizex="2" data-sizey="2">
<header>Element 1</header>
</li>
<li data-row="2" data-col="2" data-sizex="2" data-sizey="2">
<header>Element 1</header>
</li>
<li data-row="3" data-col="1" data-sizex="4" data-sizey="2">
<header>Element 1</header>
</li>
Sollte ich ja ein Quadrat aus 4 Blöcken bekommen und einen Block drunter, mit gleicher Breite?
Zitat von: Mitch am 06 März 2015, 12:06:22
Sollte ich ja ein Quadrat aus 4 Blöcken bekommen und einen Block drunter, mit gleicher Breite?
Wobei Größe und Positionierung Deiner Elementen so nicht zusammenpassen (aber vielleicht nur ein Flüchtigkeitsfehler), denn Deine "kleinen" Elemente sind jeweils 2x2 groß, aber die Positionierung geht von 1x1 aus.
Also kann beispielsweise das zweite Element gar nicht bei 1-2 beginnen, weil das erste Element 1-1,1-2,2-1 und 2-2 abdeckt (denn es beginnt bei 1-1 und ist 2x2 groß).
es gibt doch sicherlich ein WYSIWYG Tool in welchem man die index.html einladen kann und darüber bearbeiten kann, oder nicht??? Vielleicht bringt das ja Licht ins dunkle.
Zitat von: Brockmann am 06 März 2015, 10:39:01
Und noch eine Frage:
Sollte das Verändern des Grid per Drag& Drop eigentlich funktionieren? Bei mir klappt das weder in Firefox noch in Chrome.
Leider bin ich kein Gridster.js Experte, ich fand das nur die ideale Basis für ein Dashboard.
Drag&Drop habe ich nur für Header enabled. Also einfach auf den Header "Wohnzimmer" klicken, dann bewegt sich was. Ansonsten würde bei jedem Klick das Element zappeln.
Aber ich denke, Drag & Drop braucht man das nichtunbedingt für das Dashboard, oder was habt ihr damit vor?
Warum sich die einzelnen Elemente des Gridster nicht an die X und Y Vorgaben halten, weiß ich leider nicht. Ich denke, das ist eher ein Feature, das immer die optimale Verteilung aller Elemente berechnet. Ich habe dazu auch nix im Netz gefunden, nur eine Version von 2013, die sich genau an die Vorgaben hielt (1,1 + 2,2 + 3,3), aber andere Probleme macht. https://github.com/dustmoo/gridster.js (https://github.com/dustmoo/gridster.js)
Zitat von: Brockmann am 06 März 2015, 09:02:39
Beim longpoll ist mir aufgefallen, dass der längst nicht so zügig reagiert wie bei der FHEM-Web-GUI, wo die Änderungen ja praktisch sofort sichtbar werden. Nach ein paar Tests ist es bei mir so, dass die Werte real zweimal pro Minute aktualisiert werden (also exakt alle 30 Sekunden). Ist das so vorgesehen oder läuft da bei mir etwas schief?
Ein 30 Sekunden Refresh ist definitiv shortpoll!
Mit longpoll sollten Änderungen in Echtzeit angezeigt werden.
Hast du longpoll in der index.html aktiviert? Das ist per default noch aus.
<meta name="longpoll" content="1">Dann sieht man auch die entsprechenden Logs in der Script Console zappeln.
Also
logpoll an -> einzelne Änderungen in Echtzeit + aller 15 Minuten ein voller Refresh zur Sicherheit
logpoll aus -> aller 30 Sekunden Minuten ein voller Refresh
Zitat von: setstate am 06 März 2015, 19:11:46
Hast du longpoll in der index.html aktiviert? Das ist per default noch aus.
Das hatte ich so nicht verstanden, ich dachte, das wäre standardmäßig aktiviert und man könnte es per meta deaktivieren. Jetzt klappts dann auch.
Gridster muss ich mir noch mal in Ruhe anschauen. Drag&Drop brauche ich nicht. Ich wollte nur wissen, ob es funktionieren sollte. Also ob man ein Widget am Header erfassen und dann seine Position verändern kann. Bei mir flutschen die einfach immer wieder an die alte Stelle zurück.
Mehr stört mich aber, dass ich momentan das Layout, wie ich es mir vorstelle, nicht realisieren kann. Ab einem bestimmten Punkt werden die Widgets scheinbar willkürlich platziert, obwohl ich mich exakt an die Grid-Systematik halte. Irgendeine Logik kann ich darin noch nicht erkennen. Ein ganz simples Beispiel, was bei mir nicht geht, hatte ich ja schon geliefert.
Vielleicht gewinnen wir gemeinsam noch ein paar Erkenntnisse zu dem Thema. Nur im Moment ist das für mich ein ziemlicher Showstopper.
So, erstmal vielen Dank für die geniale Oberfläche!!
Hier mal ein Bild, wie es im Moment noch aussieht.
Es fehlt mir noch die Unterschrift der Fenster, aber die bekomme ich im Moment nicht hin (sonst sind die icons nicht mehr nebeneinander).
mit der Grid-Systematik bin ich auch erst verzweifelt. Habe dann auf der Gridster Seite etwas gelesen und es mir einfach mal aufgezeichnet :-[
Danach war es einfach und logisch 8)
Deine Oberfläche sieht ja fantastisch aus. Cool zu sehen, was andere für Ideen dazu haben und wie unterschiedlich die Sortierung sein kann.
Wie man noch etwas mehr Text einfügen, schaue ich mir an. Da ist noch etwas Bedarf an erweiterten Styles.
Bei Gridster habe ich feststellen können, wenn man leere Elemente vermeidet und es keine einzige Überlappung gibt, hält sich das Grid an das gewünschte Layout.
Zitat von: Mitch am 06 März 2015, 23:43:28
mit der Grid-Systematik bin ich auch erst verzweifelt. Habe dann auf der Gridster Seite etwas gelesen und es mir einfach mal aufgezeichnet :-[
Danach war es einfach und logisch 8)
Magst Du vielleicht die dazugehörende index.html hier posten (evtl. mit ausgeXXXten Details)?
Dann könnte man sich das mal genau anschauen und vielleicht verstehe ich dann, was ich falsch mache...
Klar:
<html>
<title>FHEM</title>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.1.0
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="125">
<meta name="widget_base_height" content="122">
<meta name="longpoll" content="1">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Nexus'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>HOMESTATUS</header>
<div type="homestatus" device='homestatus' class="" ></div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>KEYMATIC</header>
<div class="center">
<div type="switch" device="CUL_HM_HM_SEC_KEY_23DB96" data-on="lock" data-off="unlock" data-icon="fa-lock" class="cell"></div>
<div type="label" device="CUL_HM_HM_SEC_KEY_23DB96" class="cell" ></div>
</div>
</li>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
<header>GAST</header>
<div class="center">
<div type="switch" device="Gast.Dummy" data-on="Anwesend" data-off="Abwesend" data-icon="fa-user" class="cell" ></div>
</div>
</li>
<li data-row="1" data-col="4" data-sizex="1" data-sizey="1">
<header>MUELL</header>
<div class="center">
<div type="label" device="Abfallkalender" data-icon="" class="cell" ></div>
</div>
</li>
<li data-row="2" data-col="4" data-sizex="1" data-sizey="1">
<header>ROLLO</header>
<div class="center">
<div type="switch" device="Rollo.Alle" data-on="Zu" data-off="Auf" data-icon="fa-bars" class="cell" ></div>
</div>
</li>
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1">
<header>HEIZUNG</header>
<div class="center">
<div type="switch" device="HCAutomatik" data-on="on" data-off="off" data-icon="fa-fire" class="cell" ></div>
</div>
</li>
<li data-row="2" data-col="5" data-sizex="1" data-sizey="1">
<header>ALARM</header>
<div type="switch" device="Alarmanlage" data-on="scharf" data-off="unscharf" data-icon="fa-exclamation-triangle"></div>
</li>
<li data-row="1" data-col="7" data-sizex="1" data-sizey="2">
<header>AUSSEN</header>
<div class="center">
<div type="label" device="Wetterstation" data-get="temperature" data-unit="%B0C%0A" class="cell big"></div>
<div type="label" class="cell">Temperatur</div>
<div type="label" device="Wetterstation" data-get="humidity" data-unit="%" class="cell big"></div>
<div type="label" class="cell">Luftfeuchte</div>
<div type="label" device="Wetterstation" data-get="pressure" data-unit="hPa" data-fix="0" class="cell big"></div>
<div type="label" class="cell">Luftdruck</div>
</div>
</li>
<li data-row="1" data-col="6" data-sizex="1" data-sizey="2">
<header>FLUR</header>
<div class="center">
<div type="switch" device="CUL_HM_FlurOben" class="cell"></div>
<div type="label" class="cell">oben</div>
<div type="switch" device="CUL_HM_FlurUnten" class="cell"></div>
<div type="label" class="cell">unten</div>
</div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="2">
<header>WOHNZIMMER</header>
<div class="center">
<div type="thermostat" device="HZ_Wohnzimmer_Climate" data-get="desired-temp" data-temp="measured-temp" class="cell" ></div>
<div type="label" device="HZ_Wohnzimmer_Climate" data-get="humidity" data-unit="%" class="cell"></div>
<div type="contact" device="Fenster_Terrasse" class="cell"></div>
<div type="contact" device="Fenster_Wohnzimmer_Ost " class="cell"></div>
<div type="contact" device="Fenster_Kueche" class="cell"></div>
</div>
</li>
<li data-row="3" data-col="3" data-sizex="2" data-sizey="2">
<header>WOHNZIMMER</header>
<div class="left">
<div type="switch" device="FS20_Hydra" class="cell"></div>
<div type="label" class="cell">Hydra</div>
<div type="switch" device="FS20_Trompete" class="cell"></div>
<div type="label" class="cell">Trompete</div>
</div>
<div class="right">
<div type="switch" device="FBDECT_Barlicht" class="cell"></div>
<div type="label" class="cell">Bar</div>
<div type="switch" device="FS20_Spot_Kueche" class="cell"></div>
<div type="label" class="cell">Spot</div>
</div>
</li>
<li data-row="3" data-col="5" data-sizex="2" data-sizey="2">
<header>FENSTER</header>
<div type="contact" device="Fenster_Klo" class="cell"></div>
<div type="contact" device="Fenster_Buero" class="cell"></div>
<div type="contact" device="Fenster_Flur_oben" class="cell"></div>
<div type="contact" device="Fenster_Bad" class="cell"></div>
<div type="contact" device="Fenster_Leoni" class="cell"></div>
<div type="contact" device="Fenster_Carlotta" class="cell"></div>
<div type="contact" device="CUL_FHTTK_Schlafzimmer" class="cell"></div>
<div type="contact" device="CUL_FHTTK_Hobbyraum_links" class="cell"></div>
<div type="contact" device="CUL_FHTTK_Hobbyraum_rechts" class="cell"></div>
<div type="contact" device="CUL_FHTTK_Kellerflur" class="cell"></div>
<div type="contact" device="CUL_FHTTK_Waschkeller" class="cell"></div>
<div type="contact" device="CUL_FHTTK_Apfelbaum" class="cell"></div>
</li>
<li data-row="3" data-col="7" data-sizex="1" data-sizey="2">
<header>GARTEN</header>
<div class="center">
<div type="switch" device="CUL_HM_Gartenlicht" class="cell"></div>
<div type="label" class="cell">Licht</div>
<div type="switch" device="abc" data-on="Raus" data-off="Rein" data-icon="fa-sun-o" class="cell"></div>
<div type="label" class="cell">Markise</div>
</div>
</li>
</ul>
</div>
</body>
</html>
fhem-tablet-ui.js, Zeile 23f:
wx = 1*$("meta[name='widget_base_width']").attr("content");
wy = 1*$("meta[name='widget_base_height']").attr("content");
Die Multiplikation mit 1 macht aus den Strings(!) numerische Werte und dann funktioniert auch das Verschieben und Anordnen im Grid.
Hallo,
gefällt mir auch sehr gut. Ich fänd einige Änderungen wiklich wichtig:
- Automatische Anordnung der Element (á la isotope http://isotope.metafizzy.co/)
- Konfiguration über eine json-Datei (habe das mal mit Bootstrap V3 und meinen im Moment NUR Steckdosen probiert)
- Keine Verwendung von invaliden html-Attributen, dafür eher custom-data-Attribute (Beispiel <div type="switch"> -> <div data-type="switch">), damit das HTML valide bleibt
Vielleicht forke ich mal Dein Projekt und mache nen merge-Request.
Gruß
Björn
Zitat von: nesges am 07 März 2015, 19:22:45
fhem-tablet-ui.js, Zeile 23f:
wx = 1*$("meta[name='widget_base_width']").attr("content");
wy = 1*$("meta[name='widget_base_height']").attr("content");
Die Multiplikation mit 1 macht aus den Strings(!) numerische Werte und dann funktioniert auch das Verschieben und Anordnen im Grid.
Genial und so einfach gelöst. Wieder das leidige Thema Daten Typ ...
Hab's übernommen.
Vielen Dank für deine Unterstützung
Zitat von: wex_storm am 07 März 2015, 22:57:32
- Automatische Anordnung der Element (á la isotope http://isotope.metafizzy.co/)
- Konfiguration über eine json-Datei (habe das mal mit Bootstrap V3 und meinen im Moment NUR Steckdosen probiert)
- Keine Verwendung von invaliden html-Attributen, dafür eher custom-data-Attribute (Beispiel <div type="switch"> -> <div data-type="switch">), damit das HTML valide bleibt
Hallo Björn,
willkommen im Thread.
- Isotope sieht sehr interessant aus. Ich kann mir vorstellen, damit könnte man gut Tabs realisieren "Oben", "Unten", "Garten" und die Elemente würden entsprechend angezeigt. Mit Gridster Namespaces könnte man das aber auch realisieren. Denkst du eher an eine eigene Erweiterung aufbauend auf Gridster oder auf ein Umswitchen auf Isotope als Layout Basis?
- Konfiguration über eine json-Datei, klingt auch interessant, besonders für User, die mit HTML nicht so viel am Hut haben. Mein Ziel bei diesem Projekt ist die Einfachheit und das man mit wenig Aufwand schnell zum einem passablen Ergebnis kommt. KISS-Prinzip eben. Deshalb sollte jegliche Konfiguration selbsterklärend und minimalistisch bleiben ...
- html-Attribute: Das habe ich befürchtet, dass das nicht so ideal ist, einfach eigene Attribute zu benutzen. Bis jetzt hat sich aber noch kein Browser beschwert. Wo könnte das Probleme machen? Ich denke aber, jetzt alles zu ändern, wäre machbar. Sooo viel wäre nicht zu korrigieren, wenn man das gerade ziehen möchte.
Hallo zurück,
ich habe gerade mal zum Spaß ein wenig rumporgrammiert.
Wie gesagt, der Stil gefällt mir super und ich denke, das könnte die Grundlage für ein super geniales Frontend werden.
Was ich getan habe:
- HTML korrigeit/aufgeräumt
- Laden der Daten aus eine Konfigurationsdatai (JSON)
- Anordnung der "Views" (Räume usw.) mit masonry (ist wie Isotope)
Dadurch kann man das Frontend sogar auf Telefonen usw. nutzen.
Kannst es Dir ja mal gerne ansehen. Die Konfiguration in der JSON-Datei sollte sich fast selbst erklären.
https://github.com/wexstorm/fhem-tablet-ui (https://github.com/wexstorm/fhem-tablet-ui)
Noch ein paar Anmerkungen:
- Es sollte einen Modus wie "Aus FHEM laden" geben, so dass das Erstellen einer JSON-Konfiguration unnötig ist
- Bei mir werden momentan die Stati nicht abgefragt, d.h. wenn ich die Seite lade, dann sind alle Lampen aus (Obwohl der Status in FHEM korrekt ist)
- Die einzelnen Views sollten (wie bei Bootstrap) Größen haben, die sich voneinander ableiten (z.B. 100, 200, 300 px), so dass masonry besser funktioniert (wird aber denke ich schwer)
Ansonsten höchsten Respekt nochmal meinerseits! Wirklich ein tolles Projekt und sieht dazu noch gut aus. Biete hiermit gerne meine Unterstützung an :)
Gruß und (jetzt endlich) gute Nacht
Björn
Hallo Bjoern,
die Idee die einzelnen Grids mit masonry der auf dem jeweiligen Device zur Verfuegung stehenden Groesse dynamisch anzuordnen finde ich persoenlich enorm reizvoll hat jedoch - nach einer kurzen vergleichenden Demo bei meiner Frau - dort kein Verstaendnis gefunden. Meine Frau bevorzugt die statische Variante alleine schon deswegen, weil dann die Icons fuer beispielsweise das Wohnzimmerlicht immer an derselben Stelle zu finden ist.
Nach einiger Zeit wird jeder Nutzer, der ueber die UI Funktionen schaltet, nicht mehr genau hinsehen und schon gar nicht lesen wollen, was fuer ein Schalter das ist. Erfahrungsgemaess sieht das in der Praxis so aus: Ein kurzer Blick, der zweite von links oben ist Wohnzimmer Licht. Klick. Nichts tut sich... -> klick, klick, klick, geht nicht -> Mist -> Schatz: Die Fernbedienung funktioniert nicht mehr. Spaetestens beim dritten Mal in der Art kann ich das Projekt komplett vergessen.
Sollte die Option mit masonry fix eingebaut werden faende ich es gut, wenn man zwischen beide Optionen mittels CFG-Option waehlen koennte sofern das technisch umsetzbar ist.
Meine Familie ist sicher kein Masstab fuer die Allgemeinheit aber ich faende es auch nicht gut, wenn meine Frau meine Klamotten in meinem Schrank umherraeumen wuerde und ich jeden Morgen alles erst durchsuchen muesste.
Ja es sieht wirklich gut aus aber es ist und bleibt eine Spielerei.
Gruss
Michael
Hallo Björn, hallo Michael,
gesten habe ich mich auch noch die wexstorm Version angesehen und bin geteilter Meinung. Der dynamische Ansatz ist schon interessant und flexibler, aber das Ergebnis muss 100% immer den Erwartungen entsprechen. Also festgelegte Größe und Position der Boxen und Inhalt und Lage der Elemente ist sehr wichtig, wie Michael auch schon schreibt. Auch die Elemente direkt aus FHEM zu holen klingt verführerisch, aber bei den meisten wäre das einfach zuviel. Was auf dem Dashboard dann letztendlich angezeigt werden soll, ist nur ein Bruchteil. Also sortier man wieder aus.
Das JSON File habe ich mir auch angesehen, aber als Config-File finde ich das ungeeignet. Zur Datenübertragung und zum Speichern ist JSON ideal, aber ich möchte keinem User zumuten, sein Layout in dieser Art definieren zu müssen. Dann wäre der nächste folgerichtige Schritt, einen Layout Designer anzubieten, was aber viel Aufwand bedeuten würde. Ich will mich derzeit erst einmal auf die Elemente konzentrieren. Ein Dimmer-Slider für 0-100% + On/Off fehlt noch, den will ich auf Grundlage der Pushbuttons bauen, aber zusätzlich mit up/down slide Feature.
Aber jetzt geht's erst einmal in die Sonne ... 8)
Erstmal und nochmal vielen Dank für die tolle "GUI".
Ich finde es auch toll, dass hier noch andere aufspringen und optimieren/verbessern wollen.
Aber bitte, macht es nicht komplexer und komplizierter.
Ich habe endlich eine Oberfläche gefunden, die genau das macht, was ich schon länger suche.
Sehr einfach und doch alles drin, was man (ich) brauche.
Gerade die Einfachheit macht doch die Oberfläche aus.
Klar, ein paar Verbesserungen und Änderungen, immer gerne.
Aber dynamisch, drag and drop und Co braucht doch kein Mensch (meine Meinung).
Für was ist die GUI gedacht? Anzeige auf einem Tablet und die Möglichkeit, ein paar Schalter zu drücken.
Ich denke nicht, dass jemand sein komplettes fhem darüber steuern möchte. Dafür gibt es genügend andere Dinge.
Wie gesagt, ein paar Feinheiten noch, wie z.B. die Änderung eines Icons, wenn geschalten oder der state einen bestimmten Wert, ansonsten bitte so lassen.
Man könnte ja einfach ein zweites Projekt kreieren, oder eine Art Pro Version?
Hallo,
funktioniert alles prima, Frau ist auch begeistert. ;D ;D
Was mir noch fehlt, ist die Anzeige der Termine aus dem Calendar Modul (Google-Kalender).
Diese möchte ich gerne in einer Box darstellen:
08.03.15 08:45 Termin 1
09.03.15 20:00 Termin 2
10.03.15 20:00 usw.
12.03.15 13:00 usw.
Termine kannst Du doch ganz einfach mit dev type="label" machen
Hallo zurück,
mehr als eine Spielerei wollte ich eignetlich auch nicht einbauen. Mich hat an der "Ur"-Version nur leider die fehlende Responsivität (Anzeige angepasst auf verschiedenen Endgeräten) gefehlt. Ich bin recht neu im Bereich fhem, bin aber technisch versiert und möchte mein Haus automatisieren.
Vielleicht sollte ich doch meinen alten persönlichen Ansatz noch einmal vorstellen (basierend auf Bootstrap).
Da habe ich die Konfiguration auch über eine JSON-Datei gelöst (für nicht HTML-affine Personen) und das Layout über Bootstrap erstellt.
GANZ WICHTIG!!! Ich möchte hiermit nicht die Arbeit des Thread- und Layout-Erstellers schmälern. Ich denke nur, dass eine Kombination aus mehreren Techniken vielleicht ganz passend wäre. Z.B.:
- Angabe von Konfigurationswerten in der fhem.cfg oder einer JSON-Datei
- festes Layout konfigurierbar machen (fhem.cfg oder eigene json)
- Responsives Layout, welches auf den Geräten immer gleich aussieht (masonry käme dann weg)
- ein JavaScript-Plugin-System für Komponenten wie Switches usw. (Erweiterbarkeit)
- Layout anpassen, wie das vorherige (Icons, alles etwas schmaler, vielleicht sogar Stile für Nacht/Tag usw.)
Ich finde dieses Projekt extrem toll, da ich so ein schönes UI für mein Zu Hause gesucht habe. Die Konfiguration über HTML (für mich jetzt kein Problem, vielleicht aber doch für andere) und die fehlende Responsivität haben mich jedoch ein wenig gestört. Ich baue mal meinen Verschlag auf Bootstrap um, vielleicht sagt das einigen mehr zu.
Grüße und einen schönen Sonntag
Björn
@Mitch: Labels für deine Fenster könnte man ab sofort so hinzufügen
<li data-row="3" data-col="5" data-sizex="2" data-sizey="2">
<header>FENSTER</header>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster3</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster3</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster3</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow darker small">Fenster3</div>
</div>
</div>
</li>
(http://knowthelist.github.io/fhem-tablet-ui/fenster_dark.png)
Oder etwas heller:
<li data-row="3" data-col="5" data-sizex="2" data-sizey="2">
<header>FENSTER</header>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow small">Fenster3</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow small">Fenster3</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow small">Fenster3</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div type="contact" device="Fenster1" class="narrow"></div>
<div type="label" class="narrow small">Fenster1</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster2" class="narrow"></div>
<div type="label" class="narrow small">Fenster2</div>
</div>
<div class="cell left">
<div type="contact" device="Fenster3" class="narrow"></div>
<div type="label" class="narrow small">Fenster3</div>
</div>
</div>
</li>
sieht dann so aus
(http://knowthelist.github.io/fhem-tablet-ui/fenster.png)
Dafür gibt es in der css/fhem-tablet-ui.css ein paar neue Zeilen.
Viele Grüße
Mario
Anstatt die Schaltzustände der unterschiedlichen Device-Typen jedes mal per data-on/off abzubilden, habe ich in meiner Installation ein zweites JS-File angelegt, dass die Defaults abhängig von einem HTML-Attribut "data-devicetype" überschreibt. Vielleicht ist die Idee für jemanden nützlich.
$( document ).ready(function() {
$('div[type="switch"]').each(function(index) {
switch($(this).attr('data-devicetype')) {
case "PRESENCE":
$(this).data('on', $(this).attr('data-on') || 'present');
$(this).data('off', $(this).attr('data-off') || 'absent');
break;
case "dummy10":
$(this).data('on', $(this).attr('data-on') || '1');
$(this).data('off', $(this).attr('data-off') || '0');
break;
}
});
$('div[type="contact"]').each(function(index) {
switch($(this).attr('data-devicetype')) {
case "MAX":
$(this).data('on', $(this).attr('data-on') || 'opened');
break;
}
});
});
Im HTML:
<div type="switch" device="HANDY" class="cell" data-icon="fa-user" data-devicetype="PRESENCE"></div>
<div type="switch" device="OPT_ALARM" class="cell" data-icon="fa-bullhorn" data-devicetype="dummy10"></div>
<div type="contact" device="S_FENSTER_LINKS" class="cell" data-devicetype="MAX"></div>
Derzeit fehlt mir übrigens noch eine gute Idee um Milight-Devices einzubinden. Das Milight-Device hat die Besonderheit, dass es im eingeschalteten Zustand in STATE nicht einfach nur "on", sondern auch die eingestellte Dimmung stehen hat: "on 100", "on 42" etc.
Hallo nesges,
super Idee, das macht die Konfiguration einfacher.
Wie auch schon wex_storm vorgeschlagen hat, werde ich mal ein Plugin System angehen. Dann braucht man sich nur die Devices einbinden, die man braucht. Das spart Ladezeit, man bekommt die richtigen Defaults und das Ganze macht den js Part übersichtlicher.
Vielen Dank
Mario
Moin,
das ist ja der Hammer, wie die Entwicklung hier an einem sonnigen Wochenende weitergeht! ;)
Schön, dass das Drag&Drop jetzt funktioniert. An sich brauche ich es zwar nicht, aber man kann jetzt dadurch sehr schön ausprobieren, wohin man Widgets platzieren kann und wohin nicht. Anscheinend muss ein Widget immer einen oberen Nachbarn haben (oder eben am oberen Rand platziert sein). Linke und rechte Nachbarn hingegen sind nicht erforderlich.
Was die Diskussion statisches vs. dynamisches UI angeht:
Ich bin auch Fan einer statischen Oberfläche. Ich würde mir ohnehin eher verschiedene Versionen für PC/Smartphone/verschieden große Tablets machen, wo ggf. auch unterschiedliche Inhalte rein sollen. Deshalb wäre eine dynamische UI für mich uninteressant bzw. die statische Variante sollte zumindest als Option bleiben (IMHO).
Danke Mario!
Fensterlabel gehen jetzt, Perfekt!!
Eine Kleinigkeit ist mir gerade aufgefallen:
für mein Keymatic nutze ich data-on/off für lock/unlock.
<div type="switch" device="CUL_HM_HM_SEC_KEY_23DB96" data-on="lock" data-off="unlock" data-icon="fa-lock" class="cell"></div>
<div type="label" device="CUL_HM_HM_SEC_KEY_23DB96" class="cell" ></div>
Leider ist der state aber "locked" und "unlocked", somit stimmt das Icon nicht, wenn ich z.B. über die Fernbedienung schalte.
Kann ich das irgendwie einstellen?
Was auch noch sehr genial wäre, wenn ich anhand eines bestimmten state ein bestimmtes Icon einblenden könne.
So ala devStateIcon
Explizit geht es mir um meine Müll-Visualisierung:
<li data-row="1" data-col="4" data-sizex="1" data-sizey="1">
<header>MUELL</header>
<div class="center">
<div type="label" device="Abfallkalender" data-icon="" class="cell" ></div>
</div>
</li>
Dort kann Restmuell oder Papiertonne stehen, ein passendes Icon gibt es mit gleichen Namen (z.B. Restmuell.png)
Zitat von: Mitch am 09 März 2015, 08:58:47
Leider ist der state aber "locked" und "unlocked", somit stimmt das Icon nicht, wenn ich z.B. über die Fernbedienung schalte.
Kann ich das irgendwie einstellen?
Bislang geht das nicht denke ich. Ich habe ein ähnliches Problem:
Ich möchte den Status meines Badlüfters als Switch anzeigen (was ja noch kein Problem ist).
Aber wenn er aus ist und man auf das Icon tippt, soll der Lüfter nur kurz laufen (on-for-timer 300). Nur wenn ich jetzt
data-on="on-for-timer 300" setze, dann zeigt das Icon den Status nicht mehr korrekt an, denn der geht ja dann auf "on" und nicht auf "on-for-timer".
Man müsste also quasi
data-set-on und
data-get-on bzw.
data-set-off und
data-get-off unterscheiden können. Damit würde sich die Keymatic auch in den Griff bekommen lassen, oder?
Für regelmässiges "on-for-timer" setze ich ein notify auf "on" und schiebe on-for-timer hinterher. zB so:
define S_SWITCH_AutoOff notify S_SWITCH_.*:on set $NAME on-for-timer 3600
Zitat von: nesges am 09 März 2015, 09:59:14
Für regelmässiges "on-for-timer" setze ich ein notify auf "on" und schiebe on-for-timer hinterher. zB so:
define S_SWITCH_AutoOff notify S_SWITCH_.*:on set $NAME on-for-timer 3600
Das ist mir schon klar, ist aber für mich keine Lösung.
Im Prinzip wird der Lüfter durch einen Luftfeuchtigkeitssensor geführt automatisch ein und aus geschaltet.
Da wäre es kontraproduktiv, jedem set on ein set on-for-timer hinterzuschieben.
Nur wenn im Bad mal schlechte Luft ist (dafür habe ich noch keinen Sensor außer der eigenen Nase) soll man den Lüfter per Antippen für kurze Zeit einschalten können.
Du kannst ja auch statt einem "on" ein "ein" oder sonst was in data=on eintragen und dann darauf den notify schalten.
Somit beißt sich das nicht mit deiner "normalen" Steuerung.
ich muss mich meinen Vorrednern anschließen. Selten wurde ein Thema mit soviel Elan vorangetrieben. Ich möchte allerdings eine Sache nochmal aufgreifen. HTML ist kein Fremdwort für mich, allerdings in Verbindung mit CSS tue ich mich da noch ein wenig schwer, da CSS sehr mächtig ist. Kann hem. ggf. die UI so anpassen, dass man mit einer Art "Reiterstruktur" seine Räume abbilden kann? Es sind ja eigentlich dann nur verlinkungen zu anderen HMTL-Seiten. Z.B. Kueche.html, Kinderzimmer_1.html etc.
Hallo bjoernbo,
Ich stelle Dir (und allen anderen Interessierten) mal - zum Spaß - meine private Version eines Frontend zur Verfügung. Momentan kann man damit jedoch lediglich Switches steuern.
Konfiguriert wird alles über JSON. Meinst Du sowas? (Die Bereiche für meinen Verstärker und Wecker bitte nicht beachten.)
Das Ganze habe ich unter /opt/fhem/www in den Ordner frontend abgelegt und über http://IP:8083/fhem/frontend/index.html aufgerufen.
Wie gesagt, eine Kombination aus der wirklich schön aussehenden Lösung von Mario und einer responsiven Lösung wie meiner fänd ich ganz toll. Wäre natürlich auch möglich, dass ich an meinem Zweig weiterpröckele... dafür fehlt mir aber die Erfahrung was man alles mit fhem so steuern kann.
Gruß
Björn
Zitat von: Mitch am 09 März 2015, 10:50:20
Du kannst ja auch statt einem "on" ein "ein" oder sonst was in data=on eintragen und dann darauf den notify schalten.
Mit einem
set ... ein kann ein Homematic-Switch aber wenig anfangen...?
Das ist schon klar.
Mach doch einen dummy.
Zitat von: Mitch am 09 März 2015, 14:05:51
Mach doch einen dummy.
Und so bastelt sich jeder Benutzer, der etwas anderen als einen simplen On/Off-Switch integrieren will (bei der Keymatic ist es ja letztlich das gleiche), jeweils ein Dummy und ein paar Notifys, um das zu realisieren?
Also da sollte man lieber direkt durch die UI unterstützen, für set und Statusermittlung abweichende Werte zu verwenden. Das erhöht gleichzeitig die Flexibilität und Benutzerakzeptanz.
Naja, erstmal, dann programmier doch selber ein UI :P ;D
Und das mit dem dummy hab ich ja eher auf dein Thema mit on-for... gedacht, nicht UI speziell.
Und mit Keymatic? Da braucht man keinen dummy, da muss nur die Anzeige des Zustands umgebaut werden.
Zitat von: Mitch am 09 März 2015, 16:45:31
Und mit Keymatic? Da braucht man keinen dummy, da muss nur die Anzeige des Zustands umgebaut werden.
Irgendwie reden wir aneinander vorbei, obwohl wir dasselbe Problem haben:
Du willst an Deine Keymatic ein "set unlock" senden, aber für den Status soll "unlock
ed" erkannt werden.
Ich will an meinen Lüfter ein "set on-for-timer 300" senden, aber für den Status soll "on" erkannt werden.
Und ja, dafür muss nicht, aber könnte "nur die Anzeige des Zustands umgebaut werden", genau davon rede ich ja. Aber am Besten nichts hart verdrahtetes, sondern konfigurierbar.
Zitat von: Brockmann am 09 März 2015, 09:49:24
Man müsste also quasi data-set-on und data-get-on bzw. data-set-off und data-get-off unterscheiden können. Damit würde sich die Keymatic auch in den Griff bekommen lassen, oder?
Hallo ihr,
genau das schwebte mir auch schon vor,unterschiedliche on/off Werte für get und set. Dort wo es gebraucht wird. Der default wird sein
data-set-on =
data-get-on bzw.
data-set-off =
data-get-off , wenn nicht angegeben.
Baue ich gerne sofort ein, bin aber gerade auf Dienstreise und erst am WE wieder in der Nähe meines FHEM Servers. Wenn es nicht eilt ... Ansonsten müsste ich heute Abend im Hotel versuchen, ungetestet den Codedirekt auf Github zu erweitern.
Viele Grüße
Mario
Zitat von: setstate am 09 März 2015, 19:36:01
Baue ich gerne sofort ein, bin aber gerade auf Dienstreise und erst am WE wieder in der Nähe meines FHEM Servers. Wenn es nicht eilt ... Ansonsten müsste ich heute Abend im Hotel versuchen, ungetestet den Codedirekt auf Github zu erweitern.
Nee, bloss keinen Stress! So sehr eilt es (mir jedenfalls) nicht.
Zitat von: nesges am 09 März 2015, 00:15:01
Derzeit fehlt mir übrigens noch eine gute Idee um Milight-Devices einzubinden. Das Milight-Device hat die Besonderheit, dass es im eingeschalteten Zustand in STATE nicht einfach nur "on", sondern auch die eingestellte Dimmung stehen hat: "on 100", "on 42" etc.
Ein anderes Reading für die Zustandsabfrage gibt es nicht, wo nur on oder off drin steht? Wie sieht das Command zu stetzen aus, muss dort auch der Dim-Value mit rein?
Dimmer Element ist noch in Planung bei mir und es gibt aber auch ein Pull-Request, wo ein User das Thermostat-Control umgebogen zur Steuerung eines Shutters. Das sind aber noch einige Fragen offen.
Zitat von: setstate am 09 März 2015, 19:52:37Ein anderes Reading für die Zustandsabfrage gibt es nicht, wo nur on oder off drin steht? Wie sieht das Command zu stetzen aus, muss dort auch der Dim-Value mit rein?
Standardmässig gibt's keins, ich benutze derzeit für manche Aufgaben ein userReading:
attr MILIGHT_Zone1_Wohnzimmer userReadings simple_state {my @s=split ' ', ReadingsVal($name,'state','');$s[0]}Zum Schalten reicht simples on/off. Set kann zwar auch einen zweiten Parameter ("ramptime") annehmen, der hat aber wiederum nichts mit dem Dim-Value zu tun. Daneben haben die Milights noch diverse andere Schaltoptionen, würde ich aber persönlich für Overkill halten die hier zu implementieren.
@Brockmann: ja, da haben wir aneinander vorbei geredet ;D
@Mario: keinen Stress, ich habe ein Workaround gefunden. Wenn Du es fertig hast, dann hast Du es fertig. Eine paar Tage oder Woche hin oder her, kein Problem.
Ich finde es sowieso super, wie schnell Du hier Dinge umsetzt und mein "Lieblings-UI" perfektionierst ;)
Erstmal:
Zitat von: Mitch am 09 März 2015, 20:23:48
Ich finde es sowieso super, wie schnell Du hier Dinge umsetzt und mein "Lieblings-UI" perfektionierst ;)
+1 :-)
Noch zwei Vorschläge:
1.) Wenn man in fhem-tablet-ui.js in den drei $.ajax-Calls zur Fhemweb-Instanz jeweils die Zeile
url: "../fhem",durch
url: $("meta[name='fhemweb_url']").attr("content")||"../fhem/",ersetzt, kann man das UI auch ausserhalb von fhem zB in einem Apache betreiben, wenn man einen Meta-Tag "fhemweb_url" mit dem URL zur FHEMWEB-Instanz setzt. Es spricht auch nichts gegen eine andere Maschine - das habe ich allerdings nicht getestet.
2.) Bei mir hat die folgende Änderung an requestFhem() einen kleinen Performanceschub ergeben:
var d=Array();
$('div[device]').each(function() {
d.push($(this).attr('device'));
});
$.ajax({
[...]
data: {
cmd: "list " + d.join() + " " + paraname,Ich führe also nicht mehr "list .* STATE" aus, sondern hole mir zunächst die Liste der tatsächlich verwendeten Devices.
Edit: C&P Fehler korrigiert ("devices" durch "d" ersetzt, da "devices" bereits vergeben ist)
Zum Thema aufruf über andere Maschine usw. Da solltet ihr einen Cross-Site-Scripting Fehler bekommen. Man kann das alles wohl einstellen - abe standardmässig sollte das nicht gehen.
Gruß
Björn
Stimmt!
attr FHEMWEB CORS 1
muss für die angefragte Instanz gesetzt sein
Hallo nesges,
deine heutige Optimierungen bekommen ein +1 von mir :)
2) ich kann das zwar z.Zt. nicht nachtesten, aber sehr logisch und sollte was bringen . Ich würde das Devices Array aber beim Start anlegen, nicht jedem mal beim requestFhem() Aufruf immer wieder neu. Bringt zwar nix beim ersten Durchlauf, sind aber weniger Durchläufe bei Wiederholungen.
1) würde grundsätzlich ein Plus an Flexibilität bringen, und per default Out of the box weiterhin funktionieren. Aber wie Björn schon schreibt, reicht dem Browser schon ein anderer Port und er lehnt den Ajax Request ab, mit der Begründung "Cross-Site-Request". Deshalb hatte meine erste Version noch den PHP Aufruf drin, dann funktioniert das auch über einen zusätzlichen Webserver. Siehe mein ersten Commit ./php/send.php. Probiere das mal mit deiner Umgebung aus.
Viele Grüße
Mario
Zitat von: setstate am 09 März 2015, 23:33:29
1) würde grundsätzlich ein Plus an Flexibilität bringen, und per default Out of the box weiterhin funktionieren. Aber wie Björn schon schreibt, reicht dem Browser schon ein anderer Port und er lehnt den Ajax Request ab, mit der Begründung "Cross-Site-Request". Deshalb hatte meine erste Version noch den PHP Aufruf drin, dann funktioniert das auch über einen zusätzlichen Webserver. Siehe mein ersten Commit ./php/send.php. Probiere das mal mit deiner Umgebung aus.
Das würde in meiner Umgebung zwar funktionieren, aber grundsätzlich wäre eine Abhängigkeit von PHP doch ein Rückschritt. Von daher war deine Entscheidung den Ansatz nicht weiter zu verfolgen mMn genau richtig. Der optionale Meta-Tag funktioniert dagegen auch in einem statischen HTML-File (grade getestet: einfache meinen kompletten Ordner aus dem Apache auf den Windows-Desktop kopiert, PHP rauseditiert: läuft), braucht nur das gesetzte CORS-Attribut in FHEMWEB und man spart dabei sogar das HTTPSRV-Device in fhem. Oder man benutzt es nicht und alles funktioniert weiter wie gehabt.
Hallo, ich verzweifle gerade an folgender Konstellation.Ich will oben rechts ein Logo als Link einbauen. Der Link soll auf das Dashboard verweisen. Egal wie ich das ganze einfüge, zerschiesst es mir das ganze Layout!
Zitatader>DASHBOARD</header>
<div typw="label"class="cell"><a href ="xxxxxxxxx">Dashboard</div>
</li>
evtl. wegen dem Typo "typw". Falls nicht, zeig bitte mal mehr HTML-Code.
Edit: Oh, da fehlt auch das schliessende </a>
lol, das schließende </a> wars. Jetzt funzt es :-D
Zitat<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>DASHBOARD</header>
<div typw="label"class="cell"><a href="http://192.168.178.51:8083/fhem/?room=DashboardRoom">Dashboard</a></div>
</li>
Jetzt muss ich nur noch einen weg vom Dashboard wieder zurück finden.
nun mit Anhang
Hallo, ich habe ein kleine Konfiguationsproblem.
Ich benötige die Spalte "Kamera" in der selbigen BREITE wie den Raum "Julia".
Zitat<li data-row="1" data-col="5" date-sizex="0" data-sizey="4">
<header>KAMERA</header>
<div type="label" class="cell"><img src="http://192.168.178.133:5300/snapshot.jpg?user=xxxxxx&pwd=xxxxx" height="116" wight="131" border="0"></img src>
<img src="http://192.168.178.134:5400/snapshot.jpg?user=xxxxxx&pwd=xxxxxxx" height="116" wight="131" border="0"></img src></div>
<div type="label" class="cell"><img src="http://192.168.178.132:5200/snapshot.jpg?user=xxxxx&pwd=xxxxxxx" height="116" wight="131" border="0"></img src>
<!-- <img src="http://192.168.178.135:5500/cgi-bin/CGIProxy.fcgi?cmd=snapPicture2&usr=xxxxxx&pwd=xxxxxxxx&" height="100" wight="100" border="0"></img src>
</li>
(//)
An welcher Stelle muss ich da nun ansetzen?? SizeX und SizeY bringt mir keine Ergebnisse :-/
das <li data-row="1" data-col="5" date-sizex="0" data-sizey="4"> stimmt ja schon nicht.
Julia ist ja schon col 6 (wenn jeweils x=2
Muss ja min. so heißen:
<li data-row="1" data-col="8" date-sizex="2" data-sizey="2">
Ist aber jetzt alles aus dem Bauch und schwer, ohne die restlichen divs.
Am besten Du postet mal alles.
Hallo Zusammen,
ich bin gerade dabei diese wunderbare UI zu testen. @Markus vielen Dank für deine Arbeit - tolles Design *Daumen hoch*
Vielleicht könnt ihr mir hier noch ein paar Tipps geben
Aktuell habe ich 2 Probleme:
1. Bei einigen Widget z.B switch und contact werden die Statis nach einem Reload der Seite nicht wieder übernommen.
Wenn beispielsweise ein Fenster geöffnet wird, wird das sofort übernommen. Nach einem Reload(oder Neustart der Seite) wird das Fenster als geschlossen angezeigt. Schliesse und öffne ich das Fenster wieder, wird der Status "offen" wieder angezeigt. In FHEMWEB wird natürlich immer sofort aktualisiert. Bei Schaltern passiert das auch. Thermostate werden aber richtig angezeigt.
2. Beim Thermostat (ich habe aktuell nur einen) wird bei Änderung der Temperatur diese Änderung in FHEM nicht übernommen.
Im unteren linken Eck wird bei der Toast-Nachricht folgender Text angezeigt:
"Set Bad_Heizung_Climaundefined 20" - Bad_Heizung_Clima ist mein HM-CC-RT-DN (channel4)
Normalerweise müsste doch "Set Bad_Heizung_Climadesired-temp 20" dort stehen ?
Woran könnte das liegen, könnt ihr mir einen "Schupps" in die richtige Richtung geben?
Schöne Grüße
Jens
Poste mal deine index bzw. den Teil mit dem Thermostat
Nach viel tüftele habe ich es nun hinbekommen und möchte das vorläufige Ergebnis nicht vorenthalten. Als nächstes wäre es eine coole Sache, wenn ich die Anruferliste der FritzBox einbinden könnte. Jemand schon eine Idee? Ist das machbar?
Ps: Die Ansicht ist nun für ein 10.1" Display ideal angepasst :-D
@bjoernbo
Etwas OT:
Womit misst du eigentlich die CO2 Konzentration ?
Gruß
Jens
... mit dem Innenthermometer der NETATMO Wetterstation.
Ich haben fertig ;D
So, hier mein (vorläufig) fertiges UI
sieht auch nett aus! Mit ein bisschen HTML kann man sich hier ganz gut austoben !!!! Bin auf weitere Beispiele und Erweiterungen gespannt.
Hier noch eine Spielerei zu Gridster: https://github.com/nesges/daydream-for-gridster
Nach einer einstellbaren Startzeit werden alle Widgets auf 1x1 Größe reduziert und kontinuierlich, zufällig über's Grid geschoben. Mausbewegung oder Klick bringen alles zurück auf Standardgröße und -position. Sollte grundsätzlich in jeder Gridster-Anwendung, die HTML zur Widgetdefinition nutzt, funktionieren.
Nette Funktion, werde ich mal testen.
Ist zwar nichts für mein FHEM Tablet, aber lustig finde ich es trotzdem.
ist es möglich bei einem Wandthermostat gleich zwei Werte auszulesen. Neben der aktuellen Temperatur hätte ich gerne in einer Zeile Darunter auch die Luftfeuchtigkeit, aber folgendes Codebeispiel funktioniert leider nicht:
Zitat<div type="thermostat" device="Julia.Wandthermostat" data-get="desired-temp" data-get="humidity" data-temp="measured-temp"
Du willst zwei Zeilen, du brauchst zwei divs:
<div type="thermostat" device="Julia.Wandthermostat" data-get="desired-temp"...
<div type="thermostat" device="Julia.Wandthermostat" data-get="humidity"...
ne......so nicht :-)
Zitat<div type="thermostat" device="Julia.Wandthermostat" data-get="desired-temp" data-temp="measured-temp"
class="cell left"></div>
<div type="thermostat" device="Julia.Wandthermostat" data-get="humidity" data-temp="measured-temp"
class="cell left"></div>
es soll unterhalb der 21.5° stehen.
(//)
Zitat von: bjoernbo am 11 März 2015, 09:54:53
es soll unterhalb der 21.5° stehen.
Das ist mit Bordmitteln derzeit wohl nicht zu schaffen, da müsste der Typ Thermostat erweitert werden.
Du könntest die Feuchtigkeit allenfalls klein über dem Thermostaten anzeigen lassen.
das wäre eine alternative. Hast du einen Codeausschnitt für mich?
Danke.
Zitat von: bjoernbo am 11 März 2015, 10:12:56
das wäre eine alternative. Hast du einen Codeausschnitt für mich?
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>WOHNZIMMER</header>
<div class="container">
<div class="left">
<div type="thermostat" device="WZ_Heizung" data-get="desired-temp" data-temp="measured-temp" class="cell"><div type="label" device="WZ_Sensor" data-part="4" data-unit="%" class="cell small"></div></div>
</div>
<div class="right">
<div type="label" device="WZ_Heizung" data-get="measured-temp" data-unit="%B0C%0A" class="cell big"></div>
<div type="label" device="WZ_VD_WZ" data-get="ValvePosition" data-fix="0" data-unit="%" class="cell big right"></div>
</div>
<div class="container">
</li>
Zitat von: bjoernbo am 11 März 2015, 09:54:53
ne......so nicht :-)
es soll unterhalb der 21.5° stehen.
Dass es mit data-temp="measured-temp" in der humidity-Anzeige nicht funktionieren kann ist doch vollkommen klar. Ob data-temp="humidity" das gewünschte liefern würde, weiss ich nicht; aber das würde ich zumindest mal versuchen. Zudem die Knob-Anzeige der Thermostate nur bis zum Wert 30 läuft. Wenn das für dich ausreichend ist, kann ich einen guten HNO-Arzt empfehlen ;)
Brockmanns-Lösung macht einfach wesentlich mehr Sinn, du brauchst dazu ein <div type="label">, Beispiele sind in der Standard-index.html genügend enthalten.
Sollten wir solche Fragen evtl. in einen zweiten Thread auslagern? Hier geht's ja weniger um das UI, als um Basics.
Longpoll klappt bei mir nicht bei allen Elementen. Ich habe eine Homematic-Wetterstation, die regelmäßig alle Werte im state aktualisiert:
2015-03-11 10:46:13 CUL_HM Wetterstation T: 5.4 H: 88 W: 2.7 R: 5.9 IR: 0 WD: 290 WDR: 67.5 S: 141 B: 115
Nun habe ich beispielsweise den Helligkeitswert wie folgt in die UI eingefügt:
<div type="label" device='Wetterstation' data-get="state" data-unit="Hell." data-part="18" data-fix="0" class="cell big"></div>
Da wird beim Aufrufen der Seite zwar der aktuelle Wert angezeigt (und vermutlich alle 30 Minuten aktualisiert). Aber die Anzeige wird nicht aktualisiert, wenn die Wetterstation den state aktualisiert?
Zitat von: Brockmann am 11 März 2015, 10:09:48
Das ist mit Bordmitteln derzeit wohl nicht zu schaffen, da müsste der Typ Thermostat erweitert werden.
Du könntest die Feuchtigkeit allenfalls klein über dem Thermostaten anzeigen lassen.
Das kann das Thermostat-Control schon. Habe ich aber noch nicht so groß ausposaunt, weil ich mir noch nicht sicher bin, ob ich das so schön finde.
Ich hatte das für den Valve Value gedacht, andere Parameter könnte man damit aber bestimmt auch anzeigen. Zumindest die Humanity, weil % ist hardcoded angehangen.
<div type="thermostat" device="WohnzimmerHeizung_Clima" data-get="desired-temp" data-temp="measured-temp" data-valve="ValvePosition" class="cell"></div>
In der README habe ich dazu noch diesen kurzen Satz als Anmerkung:
The wigets will show the valve value only in case of a valid data-valve attribute. The default for data-valve ist null. That means, a empty data-valve attribute hides the valve label for the widget.
Zitat von: Brockmann am 11 März 2015, 11:01:22
Longpoll klappt bei mir nicht bei allen Elementen. Ich habe eine Homematic-Wetterstation, die regelmäßig alle Werte im state aktualisiert:
2015-03-11 10:46:13 CUL_HM Wetterstation T: 5.4 H: 88 W: 2.7 R: 5.9 IR: 0 WD: 290 WDR: 67.5 S: 141 B: 115
Nun habe ich beispielsweise den Helligkeitswert wie folgt in die UI eingefügt:
<div type="label" device='Wetterstation' data-get="state" data-unit="Hell." data-part="18" data-fix="0" class="cell big"></div>
Da wird beim Aufrufen der Seite zwar der aktuelle Wert angezeigt (und vermutlich alle 30 Minuten aktualisiert). Aber die Anzeige wird nicht aktualisiert, wenn die Wetterstation den state aktualisiert?
Hallo Brockmann,
das muss ich mir Zuhause mal im Debugger ansehen, Ferndiagnose ist jetzt schwer ...
Mir ist eben aufgefallen, dass wenn ich die Temperatur einstelle, diese nach 3 Minuten wieder in ihren vorherigen Zustand zurückspringt. Sprich, derzeit sind 21 Grad eingestellt. Ich habe dann die Temperatur auf 17 gesenkt und nach 3 Minuten, bzw. einem reload der Seite wurden wieder die 21 Grad angezeigt. Kann jem. das Problem bestätigen.
Anbei ein Beispielcode. Es betrifft bei mir alle Thermostate!
Zitat<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>SCHLAFZIMMER</header>
<div type="thermostat" device="Schlafzimmer.Wandthermostat" data-get="desired-temp" data-temp="measured-temp"
class="cell center">
<div type="label" device="Schlafzimmer.Wandthermostat" data-get="humidity" data-unit=" %" class="cell small">
</div></div>
</li>
Ich kämpfe noch mit meinen Milights und glaube das Problem eingegrenzt zu haben. Das MilightDevice löst für manche Readings gar keine oder keine gleichnamigen Events aus. Bei aktivem longpoll führt das offenbar dazu, dass das UI noch den alten Stand liest. Im Browser äussert sich das darin, dass das jeweilige Widget zuerst den geschalteten Status anzeigt und kurze Zeit später auf den Zustand vor dem Schalten zurück springt.
Plastischstes Beispiel dafür ist vielleicht der volume-Knob, über den ich den Dim-Level steuern möchte:
<div type="volume" device="MILIGHT_Zone1_Wohnzimmer" class="cell" data-get="brightness" data-set="dim" data-max="100"></div>
1.) Beim Einschalten habe ich Dim-Level 50. Wird korrekt angezeigt.
2.) Ich ändere per Widget auf 75. Wird kurz angezeigt.
3.) Wird automatisch aktualisiert -> es wird wieder Level 50 angezeigt.
4.) Manueller Browser-Refresh -> Level 75
Was ich dabei nicht verstehe: longpoll würde doch auf ein Event warten. Wenn kein Event kommt, dürfte keine longpoll-Aktualisierung durchgeführt werden und Punkt 3 dürfte nicht passieren. Wenn ein Event kommt, hätte es den richtigen Wert. Gibt es hier noch einen weiteren Mechanismus der eine Aktualisierung direkt nach dem set ausführt? Oder funktioniert longpoll hier anders als in fhem?
Eine mögliche Lösung für mich wäre longpoll pro Device deaktivieren zu können. Wäre das machbar? Oder liegt das Problem evtl. an ganz anderer Stelle?
PS: Das volume-Widget hatte ich um's senden eines beliebigen set-Befehls erweitert, das Problem lässt sich aber auch an einem unveränderten switch-widget nachvollziehen.
Zitat von: bjoernbo am 11 März 2015, 19:30:31
Mir ist eben aufgefallen, dass wenn ich die Temperatur einstelle, diese nach 3 Minuten wieder in ihren vorherigen Zustand zurückspringt. Sprich, derzeit sind 21 Grad eingestellt. Ich habe dann die Temperatur auf 17 gesenkt und nach 3 Minuten, bzw. einem reload der Seite wurden wieder die 21 Grad angezeigt. Kann jem. das Problem bestätigen.
Ja, jetzt wo Du es sagst. Achte mal drauf, was im Popup der UI steht.
Bei mir kommt da
set WZ_Heizungundefined 20 anstelle von
set WZ-Heizung desired-temp 20. Damit kann der Wert natürlich nicht verändert werden. Klingt für mich nach einem kleinen Bug.
Hallo Brockmann, kann deine Meldung bestätigen! Ist ein kleiner "bug"?!
(//)
Mach bitte mal eine vollständige Widget-Definition mit data-set, data-get und data-temp. Teste damit und poste sie hier. Und zeig auch mal das fhem-Define des abgefragten Devices.
Mit beigfügter Konfiguration hat es doch vor ein paar Tagen funktioniert :-\
Zitat<header>WOHNZIMMER</header>
<div class="container">
<div class="left">
<div type="thermostat" device="Wohnzimmer.Wandthermostat" data-get="desired-temp" data-temp="measured-temp"
class="cell">
<div type="label" device="Wohnzimmer.Wandthermostat" data-get="humidity" data-unit=" %" class="cell small">
</div>
Mit "data-set" habe ich noch nicht gearbeitet und es wäre mir neu, wenn ich dies nun bei den Thermostaten anwenden müsste. Wie müsste das "data-set" aussehen ::)
Wie das auszusehen hätte, müsstest eigentlich DU sagen können - du hast ja das Device in fhem angelegt und sagst mir nicht was für ein Gerät das ist.
Ok, anders rum:
* Liefert dein Device ein Reading "desired-temp"?
* Liefert dein Device ein Reading "measured-temp"?
Das wären die Defaults des Widgets, wenn data-get/temp nicht gesetzt sind. Beim set hat sich ein Bug eingeschlichen. Passe fhem-tablet-ui.js ab Zeile 133 wie folgt an:
//default reading parameter name
$(this).data('get', $(this).data('get') || 'desired-temp');
$(this).data('set', $(this).data('set') || 'desired-temp');
$(this).data('temp', $(this).data('temp') || 'measured-temp');
knob_elem.knob({
'reading': $(this).data('set'),
Das unter der Annahme, dass "desired-temp" als Standard tauglich wäre - daher meine Frage nach deiner Konfiguration. Bitte mal testen ob's funktioniert. Falls nicht, müsste ich wissen wie der korrekte Befehl zum setzen der Wunschtemperatur lautet.
@setstate: Ich schick dir dazu einen Pull-Request auf github
Es handelt sich um ein HM-TC-IT-WM-W-EU (HomeMatic Wandthermostat). Wenn ich direkt m Gerät die Temperatur einstelle wird diese im UI richtig angezeigt. Ebenso die aktuelle Raumtemperatur wird richtig angezeigt.
Es hat ja mit o.g. Device schon funktioniert.
Zitat von: nesges am 12 März 2015, 10:21:33
Das wären die Defaults des Widgets, wenn data-get/temp nicht gesetzt sind. Beim set hat sich ein Bug eingeschlichen. Passe fhem-tablet-ui.js ab Zeile 133 wie folgt an:
Mit dem Fix scheint es nun wieder zu klappen.
nach der Anpassung funktioniert es nun einwandfrei! DANKE
Klasse, mein Problem ist damit auch behoben.
Ich habe noch Probleme mit dem HomeStatus-Widget. Ich nutze das RESIDENTS Device. Wie kann ich das einbinden? Welche Statis 'state' erwartet das Widget ?
Schöne Grüße
Jens
RTFM ;D -Sorry, habe die Lösung gerade im Readme gelesen.
Grüße
Jens
Hallo,
ich habe alle Ordner und Dateien für dieses UI mit fireFTP auf die FritzBox, auf der FHEM läuft, kopiert und kann das UI auch aufrufen.
Dann habe ich die index.html geändert, indem ich als Switch einen meiner Devices eingetragen habe. Beim Klick auf das Icon lässt sich eine Lampe nun auch an- und ausschalten. Also scheint es ja im Prinzip zu funktionieren. Allerdings ändert sich das Icon im UI nicht, wenn ich die Lampe direkt am Schaltaktor oder über FHEM WEB schalte.
Ebenfalls wird das Icon nicht als "an" dargestellt, wenn die Lampe angeschaltet ist und ich das UI neu lade.
Ein Homematic Heizungsthermostat habe ich mit dem UI "gekoppelt" bekommen, die Temperatur wird auch bei manueller Betätigung des Thermostats im UI angezeigt. Wenn ich die Temperatur im UI ändern möchte, erscheint die Meldung: Set heiz_Term_Bad undefined 15. Wenn ich das Device als heiz_Term_Bad_Clima angebe, werden auch keine Werte mehr angezeigt.
Das Icon eines in der index.html eingebundenen Fensterkontaktes wird beim Öffnen des Fensters im UI automatisch als "offen" dargestellt, beim Schließen des Fensters als "geschlossen". Ist das Fenster aber geöffnet und ich lade das UI neu, zeigt das Icon "geschlossen" an.
Erfülle ich mit der Fritzbox nicht die Requirements?
jQuery v1.7+
font-awesome
jquery.gridster
jquery.toast
Ich habe das UI vom Notebook mit Firefox, IE und Chrome aufgerufen und getestet.
Woran kann's liegen, dass es nicht funktioniert?
Danke im Voraus.
Gruß,
onkeltom
Hallo an alle,
Sorry, der Bug mit dem Thermostat tut mir echt leid. Das neue Update ist jetzt oben bei GitHub.
Ausserdem kann man jetzt bei den Switches die Values bei Get und Set getrennt angeben:
<div type="switch" device="dummyRollo" data-get-on="opened" data-get-off="closed" data-set-on="open" data-set-off="close" data-icon="fa-bars" class="cell" ></div>
Hallo onkeltom,
willkommen hier!
Wenn du schon soweit gekommen bist, sind alle Requirements erfüllt.
Das Problem mit den Thermostaten sollte mit dem neuen Update jetzt gelöst sein. Also die js/fhem-tablet-ui.js
noch mal neu holen und ins Fhem kopieren.
Zum Thema Lampen poste mal die beiden Werte, die FHEM anzeigt bei Lampe an und Lampe aus. Und dann deine Zeile dazu aus der index.html. Da ist irgendwo der falsche Werte für data-get-on (bzw. data-on) angegeben.
Viele Grüße
Mario
Zitat von: setstate am 13 März 2015, 00:46:13
Ausserdem kann man jetzt bei den Switches die Values bei Get und Set getrennt angeben:
Super, das ging ja doch wieder schnell! :)
Wobei mir der Sinn von
data-get-off nicht ganz klar ist.
Ist nicht
data-get-off != data-get-on?
Oder in welchem Szenario ist es von Bedeutung, auf welchen Wert ich
data-get-off setze?
Zitat von: setstate am 13 März 2015, 00:46:13
Ausserdem kann man jetzt bei den Switches die Values bei Get und Set getrennt angeben:
Sehr sinnvolle Erweiterung! Wenn du das jetzt noch um Patternmatching erweiterst, bekomm ich auch die Milights in den Griff :-) Folgende Ergänzung in fhem-tablet-ui.js, Zeile 373ff:
if ( state == $(this).data('get-on') )
$(this).data('famultibutton').setOn();
else if ( state == $(this).data('get-off') )
$(this).data('famultibutton').setOff();
else if ( state.match(RegExp('^' + $(this).data('get-on') + '$')) )
$(this).data('famultibutton').setOn();
else if ( state.match(RegExp('^' + $(this).data('get-off') + '$')) )
$(this).data('famultibutton').setOff();Zuerst werden die normalen Matches geprüft. Danach wird versucht get-on/off als regulären Ausdruck zu interpretieren. Mit der Einschränkung, dass der Regexp den Status vollständig beschreiben muss (durch ergänzen von ^ und $) dürften false positives weitest gehend ausgeschlossen sein. Man kann damit zB folgendes notieren:
<div type="switch" class="cell"
device="MILIGHT_Zone1_Wohnzimmer"
data-get-on="on.*"
data-get-off="off"></div>Ich hab wieder einen Pullrequest erstellt (https://github.com/knowthelist/fhem-tablet-ui/pull/3)
Zitat von: Brockmann am 13 März 2015, 09:37:52
Wobei mir der Sinn von data-get-off nicht ganz klar ist.
Ist nicht data-get-off != data-get-on?
Oder in welchem Szenario ist es von Bedeutung, auf welchen Wert ich data-get-off setze?
Manche Devices haben mehrere mögliche on-Zustände. Durch definieren eines expliziten off-Zustandes kann man dafür sorgen, dass nicht definierte on-Zustände nicht fälschlich als off interpretiert werden.
Den Regex Patch für get-on / get-off habe ich gemerged. Super Sache das ... Danke
Zitat von: setstate am 13 März 2015, 19:18:10
Den Regex Patch für get-on / get-off habe ich gemerged. Super Sache das ... Danke
Ich danke! :-)
Zitat von: Brockmann am 13 März 2015, 09:37:52
Super, das ging ja doch wieder schnell! :)
Wobei mir der Sinn von data-get-off nicht ganz klar ist.
Ist nicht data-get-off != data-get-on?
Oder in welchem Szenario ist es von Bedeutung, auf welchen Wert ich data-get-off setze?
Hi Brockmann,
wie nesges schon erklärt hat, gibt es manchmal mehr als die beiden Status. Bei mir werden auch die Transitions Status beim longpoll erfasst, z.B. set_on, set_off. Das führte zu nervösen Hin- und Herflackern des Switches. Mit data-get-on/data-get-off kann man jetzt nur die wichtigen herausfiltern und reagieren.
Macht wirklich Spass damit zu spielen :-) Du hattest schonmal ein Plugin-System erwähnt, ich hoffe ich greife mit dem folgenden nicht zu weit vor bzw. daneben.
Ich habe das volume-Widget kopiert und um "Hooks" erweitert:
$('div[type="knob"]').each(function( index ) {
[...]
knob_elem.knob({
'hookRelease': $(this).data('hook-release'),
'hookChange': $(this).data('hook-change'),
[...]
'change' : function (v) {
eval(this.o.hookChange);
startInterval();
},
'release' : function (v) {
eval(this.o.hookRelease);
[...]
Ich lege folgendes Device an:
<div type="knob"
device="MILIGHT_Zone1_Wohnzimmer"
data-get="hue"
data-set="hue"
data-min="0"
data-max="360"
data-hook-release="this.o.bgColor = 'hsl('+v+', 100%, 50%)';"
data-hook-change="this.o.bgColor = 'hsl('+v+', 100%, 50%)';"
></div>
Damit habe ich einen Drehschalter von 0-360, mit dem ich einen Farbton für's Milight wählen kann und der mir direktes Feedback gibt, indem er die gewählte Farbe bereits beim drehen als Hintergrundfarbe für sein Blatt setzt.
Zitat von: setstate am 13 März 2015, 01:03:14
Hallo onkeltom,
willkommen hier!
Wenn du schon soweit gekommen bist, sind alle Requirements erfüllt.
Das Problem mit den Thermostaten sollte mit dem neuen Update jetzt gelöst sein. Also die js/fhem-tablet-ui.js
noch mal neu holen und ins Fhem kopieren.
Zum Thema Lampen poste mal die beiden Werte, die FHEM anzeigt bei Lampe an und Lampe aus. Und dann deine Zeile dazu aus der index.html. Da ist irgendwo der falsche Werte für data-get-on (bzw. data-on) angegeben.
Viele Grüße
Mario
Hallo Mario,
das Thermostat funktioniert nach dem Update. Auch der Zustand des Schalters wird nun richtig angezeigt:
<div type="switch" device="Licht_Flur" data-get-on="an" data-get-off="aus" data-set-on="an" data-set-off="aus" class="cell" >Vielen Dank.
Nun habe ich versucht, einen Dummyschalter mit dem UI zu verbinden. Der Dummy ist in FHEM so definiert:
define Testschalter dummy
attr Testschalter devStateIcon on:general_an@green off:general_aus@red
attr Testschalter group Beleuchtung
attr Testschalter room Flur
attr Testschalter webCmd on:offIn der index.html steht analog zum o. g. Lichtschalter:
<div type="switch" device="Testschalter" data-get-on="on" data-get-off="off" data-set-on="on" data-set-off="off" class="cell" >Wenn ich den Dummy von FHEM WEB schalte, wird das Icon im Tablet UI auch umgeschaltet, allerdings nur, bis das Tablet UI neu geladen wird. Dann wird das Icon immer im Status "aus" dargestellt.
Ich bitte im Hilfe.
Gruß,
onkeltom
Zitat von: setstate am 13 März 2015, 20:11:25
wie nesges schon erklärt hat, gibt es manchmal mehr als die beiden Status. Bei mir werden auch die Transitions Status beim longpoll erfasst, z.B. set_on, set_off. Das führte zu nervösen Hin- und Herflackern des Switches. Mit data-get-on/data-get-off kann man jetzt nur die wichtigen herausfiltern und reagieren.
Hmm, das bedeutet aber auch beispielsweise bei der Keymatic:
data-get-on="locked" data-get-off="unlocked"Ist die Keymatic locked, geht das Icon auf "on".
Öffnet man nun die Keymatic per Hand, geht deren Status auf "unlocked (uncertain)". Das Icon in der UI bleibt aber auf "on", laut UI wäre die Keymatic also weiterhin gelockt.
Also ich will gar nicht sagen, dass das ein Fehler wäre. Im Fall der Keymatic würde es reichen, das
data-get-off="unlocked" einfach wegzulassen und die Anzeige passt.
Man sollte vielleicht nur in der Doku darauf hinweisen, dass es solche Seiteneffekte haben kann, wenn man data-get-on und data-get-off in einer Definition gleichzeitig verwendet?
Zitat von: Brockmann am 14 März 2015, 09:13:52
Ist die Keymatic locked, geht das Icon auf "on".
Öffnet man nun die Keymatic per Hand, geht deren Status auf "unlocked (uncertain)". Das Icon in der UI bleibt aber auf "on", laut UI wäre die Keymatic also weiterhin gelockt.det?
Dabei hilft die Änderung mit den regulären Ausdrücken. Du kannst data-get-off="unlocked.*" setzen, dann wird jeder Status, der mit "unlocked" beginnt als "off" interpretiert.
Zitat von: nesges am 13 März 2015, 21:27:53
Macht wirklich Spass damit zu spielen :-) Du hattest schonmal ein Plugin-System erwähnt, ich hoffe ich greife mit dem folgenden nicht zu weit vor bzw. daneben.
Ich habe das volume-Widget kopiert und um "Hooks" erweitert:
....
Damit habe ich einen Drehschalter von 0-360, mit dem ich einen Farbton für's Milight wählen kann und der mir direktes Feedback gibt, indem er die gewählte Farbe bereits beim drehen als Hintergrundfarbe für sein Blatt setzt.
Hallo nesges,
das ist ja Wahnsinn, was du alles für dolle Sachen beisteuerst. Aber viel zu schnell für mich :-)
Ich bin noch nicht soweit, kommt aber noch das. Habe schon Beispiele rausgesucht, wo es so funktionieren soll, wie ich es mir vorstelle. Bin aber noch mit dem neuen Dimmer-Widget am Fummeln, bin aber schon weit und es ist bald fertig. Es basiert auf dem Switch, aber man kann es wie ein Slider bewegen. Die Skale kommt erst raus, wenn man den Button bewegt. Der Button geht danach wieder in die Ausgangslage zurück, der Stellwert wird klein angezeigt. Damit kann man normal ein/ausschalten per Klick, aber auch den An-Wert von 0-100 anpassen (was man ja nicht sooft macht)
normal (https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/gh-pages/dimmer_normal.png) ändern (https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/gh-pages/dimmer_out.png)
Hallo,
habt Ihr vielleicht auch einen Tipp für den Dummi mit dem Dummy? ;)
Ich krieg's einfach nicht hin :(
http://forum.fhem.de/index.php/topic,34233.msg273168.html#msg273168 (http://forum.fhem.de/index.php/topic,34233.msg273168.html#msg273168)
Dann habe ich noch festgestellt, dass ich das Thermostat nur steuern kann, wenn ich vorher einen Schalter, der in FHEM existiert, über das UI schalte.
Also: Wenn ich das UI neu lade, kann ich zwar mit der Schaltfläche des Thermostats die Temperatur ändern, in FHEM kommen aber keine Befehle an.
Wenn ich dann über das UI das Flurlicht ein- oder ausschalte und danach das Thermostaticon anklicke, erschein unter links der Befehl "Set heiz_Term_Bad desired-temp 17" und in FHEM und am Thermostat kommt der Befehl an?
Wie kann ich das Verhalten beeinflussen?
Gruß,
onkeltom
Hallo Onkeltom,
das wird ja immer verwirrender bei dir 8).
Den Fall mit dem Dummy habe ich gestern versucht bei mir nachzustellen, genau mit deiner cfg -> klappt alles.
Auch das Problem mit dem Thermostat kann ich mir nicht erklären.
Ich vermute, es passieren Javascriptfehler. Was sagt die Konsole während du klickst, hast du da schon mal nachgesehen?
-> Öffne die Seite zum Beispiel im Firefox und öffne Menü > Entwickler-Werkzeuge > Web-Konsole (alt+cmd+k)
Zitat von: setstate am 14 März 2015, 20:05:49
Ich bin noch nicht soweit, kommt aber noch das. Habe schon Beispiele rausgesucht, wo es so funktionieren soll, wie ich es mir vorstelle.
Kein Problem, ich hab's bei mir so implementiert, dass ich im Original JS nur eine Zeile ändern muss. Also kein Thema das erstmal parallel zu pflegen. Bin gespannt auf deine Lösung :-) Ebenso bin ich auf den Slider gespannt, aktuell übernimmt die Dim-Aufgabe bei mir auch ein modifiziertes Volume-Widget.
Bei mir ist im moment auch nur die Frage aus http://forum.fhem.de/index.php/topic,34233.msg272321.html#msg272321 offen geblieben: Ist das wirklich fhem-longpoll und wäre es sinnvoll umsetzbar die automatische Aktualisierung pro Device abschaltbar zu machen? An dem Punkt blick ich den JS-Code nicht :-)
Bei mir läuft longpoll immer noch nicht rund. Zum Testen habe ich mal ein einfaches Beispiel erstellt:
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
<header>TEST</header>
<div class="container left">
<div type="label" device='Wetterstation' data-get="state" data-unit="Hell." data-part="18" data-fix="0" class="cell big"></div>
</div>
<div class="container right">
<div type="label" device='Wetterstation' data-get="brightness" data-unit="Hell." data-fix="0" class="cell big"></div>
</div>
</li>
Es geht beide Male um denselben Wert. Einmal zusammen mit allen anderen Werten in state, einmal im separaten Reading brightness. Einzige Unterschiede der Definitionen sind also data-get und bei der oberen Definition das zusätzliche data-part.
Die Events dazu im Event-Viewer:
2015-03-15 11:25:01 CUL_HM Wetterstation brightness: 17
2015-03-15 11:25:01 CUL_HM Wetterstation T: 5.8 H: 88 W: 0.6 R: 5.9 IR: 0 WD: 240 WDR: 67.5 S: 12 B: 17
Ergebnis: Die eine Anzeige (die auf das Reading brightness geht) wird immer direkt aktualisiert. Die andere Anzeige via state und data-part hingegen nicht bzw. nur bei Refresh oder alle x Minuten.
In der Webkonsole (Ausschnitt ab dem letzen manuellen Refresh der Seite) kann ich nichts auffälliges erkennen, aber andere ja vielleicht?
GET http://fhem:8083/fhem/tablet/test.html [HTTP/1.1 200 OK 50ms]
GET http://fhem:8083/fhem/tablet/lib/jquery.gridster.min.css [HTTP/1.1 200 OK 19ms]
GET http://fhem:8083/fhem/tablet/css/fhem-tablet-ui.css [HTTP/1.1 200 OK 86ms]
GET http://fhem:8083/fhem/tablet/css/my-fhem-tablet-ui.css [HTTP/1.1 200 OK 91ms]
GET http://fhem:8083/fhem/tablet/lib/font-awesome.min.css [HTTP/1.1 200 OK 117ms]
GET http://fhem:8083/fhem/tablet/lib/jquery.toast.min.css [HTTP/1.1 200 OK 179ms]
GET http://fhem:8083/fhem/pgm2/jquery.min.js [HTTP/1.1 304 Not Modified 175ms]
GET http://fhem:8083/fhem/tablet/lib/jquery.gridster.min.js [HTTP/1.1 200 OK 273ms]
GET http://fhem:8083/fhem/pgm2/jquery.knob.min.js [HTTP/1.1 304 Not Modified 86ms]
GET http://fhem:8083/fhem/tablet/lib/jquery.toast.min.js [HTTP/1.1 200 OK 173ms]
GET http://fhem:8083/fhem/tablet/lib/fa-multi-button.min.js [HTTP/1.1 200 OK 174ms]
GET http://fhem:8083/fhem/tablet/js/fhem-tablet-ui.js [HTTP/1.1 200 OK 261ms]
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. font-awesome.min.css:4:528
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1549
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1712
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1878
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2049
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2222
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 16ms]
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 30ms]
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 28ms]
"update done (filter:*)" fhem-tablet-ui.js:380:1
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 59999ms]
"start longpoll" fhem-tablet-ui.js:415:1
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 60005ms]
"start longpoll" fhem-tablet-ui.js:415:1
"update done (filter:Wetterstation)" fhem-tablet-ui.js:380:1
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 60000ms]
"start longpoll" fhem-tablet-ui.js:415:1
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 59998ms]
"start longpoll" fhem-tablet-ui.js:415:1
"update done (filter:Wetterstation)" fhem-tablet-ui.js:380:1
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK 59999ms]
"start longpoll" fhem-tablet-ui.js:415:1
GET http://fhem:8083/fhem/fhem/ [HTTP/1.1 200 OK]
"start longpoll" fhem-tablet-ui.js:415:1
Zitat von: nesges am 15 März 2015, 10:30:08
Kein Problem, ich hab's bei mir so implementiert, dass ich im Original JS nur eine Zeile ändern muss. Also kein Thema das erstmal parallel zu pflegen. Bin gespannt auf deine Lösung :-) Ebenso bin ich auf den Slider gespannt, aktuell übernimmt die Dim-Aufgabe bei mir auch ein modifiziertes Volume-Widget.
Bei mir ist im moment auch nur die Frage aus http://forum.fhem.de/index.php/topic,34233.msg272321.html#msg272321 offen geblieben: Ist das wirklich fhem-longpoll und wäre es sinnvoll umsetzbar die automatische Aktualisierung pro Device abschaltbar zu machen? An dem Punkt blick ich den JS-Code nicht :-)
Hallo longpoll Verzweifelte,
da müssen wir tiefer im Debug-Modus überprüfen, was da genau passiert.
In der fhem-tablet-ui.js sind in der function longPoll einige console.log(...), die müsst ihr mal rein-kommentieren (die '//' wegnehmen) und in der Web-Console schauen, was da genau gesendet wird. Zeile 458 oder 489.
@Brockmann: Ich vermute, da das der letzte Wert in der Reihe ist, gibt es noch Probleme (kl. Bug). Bei einer Wert, der weiter vorne im State steht, funktioniert es bestimmt.
<div type="volume"
device="MILIGHT_Zone1_Wohnzimmer"
data-get="brightness"
data-set="dim"
data-min="2"
data-max="100"
></div>
update done (filter:*)
fhem-tablet-ui.js:421 start longpoll
fhem-tablet-ui.js:391 set MILIGHT_Zone1_Wohnzimmer dim 51
fhem-tablet-ui.js:460 #2015-03-15 12:06:03 MilightDevice MILIGHT_Zone1_Wohnzimmer transitionInProgress: 1#
fhem-tablet-ui.js:491 2015-03-15 12:06:03 / MILIGHT_Zone1_Wohnzimmer / transitionInProgress / 1
*
fhem-tablet-ui.js:460 #2015-03-15 12:06:03 MilightDevice MILIGHT_Zone1_Wohnzimmer on 51#
fhem-tablet-ui.js:386 update done (filter:MILIGHT_Zone1_Wohnzimmer)
fhem-tablet-ui.js:489 2015-03-15 12:06:03 / MILIGHT_Zone1_Wohnzimmer / STATE / on 51
fhem-tablet-ui.js:491 2015-03-15 12:06:03 / MILIGHT_Zone1_Wohnzimmer / STATE / on 51
fhem-tablet-ui.js:460 #2015-03-15 12:06:03 MilightDevice MILIGHT_Zone1_Wohnzimmer transitionInProgress: 0#
fhem-tablet-ui.js:491 2015-03-15 12:06:03 / MILIGHT_Zone1_Wohnzimmer / transitionInProgress / 0
Die Zeile "*" ist von Hand eingefügt und markiert den Zeitpunkt zu dem das Display in der Anzeige zurück springt (siehe PS) . Daraus ergibt sich folgender Ablauf:
1.) Start mit Dim-Level 100 (brightness: "100", STATE: "on 100")
2.) Im Widget auf 51 runter regeln ("set MILIGHT_Zone1_Wohnzimmer dim 51" -> brightness: "51", STATE: "on 51")
3.) Debug Ausgaben bis *
4.) Display im Widget springt zurück auf 100
5.) Debug Ausgaben nach *
6.) Display bleibt auf 100
Punkt 6 ist klar, weil es im MilightDevice kein Event auf das Reading brightness gibt. Punkt 4 ist mMn ein Bug. Mit den zusätzlichen Ausgaben auf der Console sieht das auch nicht mehr nach longPoll-Bug, sondern Widget-Bug aus (wobei der Fehler nicht auftritt, wenn longpoll abgeschaltet ist).
PS: festgestellt mit xhr: function()
for (var i=currLine; i < lines.length; i++) {
[...]
}
alert(line + " end of longpoll");
Edit: Evtl. auch noch interessant: Egal wie oft ich den Wert ändere, er springt immer(!) wieder zurück auf den beim reload der Seite eingestellten Wert.
Hallo Mario,
[GELÖST]
wenn ich die Seite aufrufe, steht in der Web Konsole:
GET http://192.168.188.1:8083/fhem/tablet [HTTP/1.1 200 OK 47ms]
GET http://192.168.188.1:8083/fhem/tablet/lib/jquery.gridster.min.css [HTTP/1.1 200 OK 172ms]
GET http://192.168.188.1:8083/fhem/tablet/css/fhem-tablet-ui.css [HTTP/1.1 200 OK 156ms]
GET http://192.168.188.1:8083/fhem/tablet/lib/font-awesome.min.css [HTTP/1.1 200 OK 156ms]
GET http://192.168.188.1:8083/fhem/tablet/lib/jquery.toast.min.css [HTTP/1.1 200 OK 172ms]
GET http://192.168.188.1:8083/fhem/pgm2/jquery.min.js [HTTP/1.1 304 Not Modified 94ms]
GET http://192.168.188.1:8083/fhem/tablet/lib/jquery.gridster.min.js [HTTP/1.1 200 OK 406ms]
GET http://192.168.188.1:8083/fhem/pgm2/jquery.knob.min.js [HTTP/1.1 304 Not Modified 172ms]
GET http://192.168.188.1:8083/fhem/tablet/lib/jquery.toast.min.js [HTTP/1.1 200 OK 406ms]
GET http://192.168.188.1:8083/fhem/tablet/lib/fa-multi-button.min.js [HTTP/1.1 200 OK 406ms]
GET http://192.168.188.1:8083/fhem/tablet/js/fhem-tablet-ui.js [HTTP/1.1 200 OK 406ms]
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. font-awesome.min.css:4:528
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1549
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1712
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1878
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2049
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2222
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 1185ms]
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 1154ms]
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 1185ms]
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 1185ms]
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 1154ms]
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK]
"start longpoll" fhem-tablet-ui.js:415:1
TypeError: s is null fhem-tablet-ui.js:547:5
Beim Klicken auf den Thermostat-Regler tut sich in der Konsole erstmal nichts.
Wenn dann das Icon für das Flurlicht betätigt wird, erscheint
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 63ms]
"set Licht_Flur an" fhem-tablet-ui.js:385:4
"update done (filter:Licht_Flur)" fhem-tablet-ui.js:380:1
Erst danach sendet der Thermostat-Regler, wenn er bedient wird:
GET http://192.168.188.1:8083/fhem/ [HTTP/1.1 200 OK 47ms]
"set heiz_Term_Bad desired-temp 14" fhem-tablet-ui.js:385:4
"update done (filter:heiz_Term_Bad)"
Lässt sich anhand dieser Meldungen mein Problem eingrenzen?
Gruß,
onkeltom
Hallo,
in der fhem-tablet-ui.js stand in Zeile 547
!==
Das habe ich in
!=
geändert und jetzt funktioniert alles.
Danke für die Unterstützung.
Gruß,
onkeltom
Zitat von: setstate am 15 März 2015, 12:01:07
@Brockmann: Ich vermute, da das der letzte Wert in der Reihe ist, gibt es noch Probleme (kl. Bug). Bei einer Wert, der weiter vorne im State steht, funktioniert es bestimmt.
Nee, das kann ich nicht bestätigen. Das ist bei jedem anderen Wert der Reihe ebenso. Ich hatte nur Brightness genommen, weil die sich quasi jedes Mal ändert. Beim ersten Wert (temperature) ist es aber genau dasselbe.
Ich probiere mal, die von Dir genannten Zeilen einzukommentieren.
@nesges: nur in kürze:
du hast brightness abonniert, aber das Event kommt mit STATE (kein 'brightness: 51') :
2015-03-15 12:06:03 / MILIGHT_Zone1_Wohnzimmer / STATE / on 51
darauf erfolgt das Update des Widgets, es wird in die Liste der aktuelles States geschaut und da steht brightness noch mit 100, weil es bei dem Parameter keine Änderung gab.
Ah, verstanden! Kann das Update auf ein nicht abonniertes Event unterbunden werden? Interessant ist STATE ja nur, wenn data-get nicht bzw. gleich "STATE" gesetzt ist.
Koennte jemand ein schoenes Beispiel (==Bild) und ein Link zum Doku hier posten, ich wuerde gerne dieses Frontend im fhem.de "Frontend Screenshots" Abschnitt erwaehnen.
Der große Meister persönlich ;) welche Ehre ;D
Eine Doku ist noch nicht richtig verfügbar, zur Zeit gibt es nur die Readme auf Github https://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui).
Ich will aber noch das Wiki auf Github pflegen https://github.com/knowthelist/fhem-tablet-ui/wiki (https://github.com/knowthelist/fhem-tablet-ui/wiki) (Hilfe ist gern willkommen)
Screenshot-Sammlung gibt heute noch auf http://knowthelist.github.io/fhem-tablet-ui/ (http://knowthelist.github.io/fhem-tablet-ui/)
Viele Grüße
Mario
Dann zeig ich auch mal eine Auswahl :)
Edit: Ich habe die HTML-Konfiguration noch hinzugefügt. Sie wird in meiner Installation aus verschiedenen PHP-Templates zusammengefügt; im Anhang ist das HTML, das am Browser ankommt zu sehen. Teilweise werden JS-Modifikationen verwendet (devices.js), die ich in diesem frühen Stadium nicht veröffentlichen möchte um die Entwicklung des UI nicht von der Seite zu torpedieren. Ich bitte um Verständnis. Fragen dazu beantworte ich aber gerne, sofern sie hier im Thread nicht ohnehin schon behandelt worden sind.
Edit 2: Bei den on-for-timer-Buttons habe ich übrigens einen Fehler übersehen, es wird einmal zu oft mit 3600 multipliziert.
Hallo Nesges,
Respekt!!!
das entspricht ziemlich meine Vorstellungen von einem einfachen, klarem Usereinterface.
Leider kommt ich mit dem Basis Set überhaupt nicht weiter, also nicht annähernd soweit wie du. Wärest du bereit deine Konfig auch zu sharen, ich denke das würde mir, und vielleicht auch anderen, sehr helfen?
Gruß
Karl
Dank der zusätzlichen console-Logs bin ich bei meinem Problem mit longpoll einen Schritt weiter.
Events dieser Art:
2015-03-16 11:32:09 CUL_HM Wetterstation T: 10.6 H: 73 W: 1.5 R: 5.9 IR: 0 WD: 230 WDR: 67.5 S: 175 B: 114
ordnet fhem-tablet-ui.js nicht state zu, sondern einem imaginären Reading "T":
"#2015-03-16 11:38:01 CUL_HM Wetterstation T: 10.8 H: 72 W: 5.4 R: 5.9 IR: 0 WD: 180 WDR: 67.5 S: 181 B: 115#" fhem-tablet-ui.js:458:6
"update done (filter:Wetterstation)" fhem-tablet-ui.js:384:1
"2015-03-16 11:38:01 / Wetterstation / T / 10.8 H: 72 W: 5.4 R: 5.9 IR: 0 WD: 180 WDR: 67.5 S: 181 B: 115" fhem-tablet-ui.js:487:8
"2015-03-16 11:38:01 / Wetterstation / T / 10.8 H: 72 W: 5.4 R: 5.9 IR: 0 WD: 180 WDR: 67.5 S: 181 B: 115"
Mit der Gegenprobe data-get="T" und data-part angepasst, funktioniert das longpoll-Updaten denn auch. Aber dann passt die Anzeige eben nur beim longpoll, aber nicht beim Abruf bzw. manuellen Update.
Eine Idee, wie man das fixen könnte?
@nesges: Wie hast Du im Wohnzimmer den Temperaturverlauf hinbekommen? Das fehlt in meiner Ansicht noch!
Der Temperaturverlauf wird per iframe geladen und wird weder vom Tablet UI noch von fhem erstellt. Die Grafik erzeuge ich mittels dygraphs (http://dygraphs.com/) aus Daten einer per DbLog befüllten MySQL-Datenbank.
Die HTML-Konfiguration habe ich in meinem Post noch ergänzt. Vielleicht sind ja Ideen für euch dabei :)
interessant! Welche Hardware hast Du im Einsatz? Würde das auf einem RaspberryPI laufen? Ich denke mal
Zitatdygraphs
wird sich auf dem Raspberry installieren lassen, aber welche Datenbank soll ich nehmen? Ich habe noch ein NSA mit einer SQL DB, frage mich allerdings wie ich da eine Verbindung hin aufbauen soll / kann.
Ist die Einrichtung sehr "tricky" ?
by the way .... womit misst du die Temperatur deines Kühlschrankes ??
dygraphs ist nur eine Javascript-Bibliothek, der ist ziemlich egal wer sie ausliefert. fhem und Apache laufen bei mir auf einem Raspberry 2, MySQL auf einem Netgear ReadyNAS. Die Einrichtung von DbLog ist in http://www.fhemwiki.de/wiki/DbLog umfassend erklärt. Schwierig ist an dem gesamten Setup eigentlich nichts, aber das sagt sich immer leicht wenn man weiss wie's geht. Für den Anfang würde ich aber empfehlen sich auf das Wesentliche zu konzentrieren. Die Anbindung MySQL -> dygraphs ist zB ein ganz eigenes Thema, das man sich ersparen kann, wenn man einfach die durch fhem erzeugten SVG-Plots benutzt.
Im Kühlschrank liegt einfach ein TFA 30.3147.IT Temperatursender (http://tfa-dostmann.de/index.php?id=117).
@nesges: von mir auch einen Big Respect !!! Sieht sehr sehr schön aus. Gefällt mir ...
Wegen Tabs, Weather-Widget, Chart-Widgets, Color-Schema ... unterhalten wir uns demnächst offline. Ich bin noch mitten im Umbau zum Auslagern der Controls als Modul. Auch schaue ich nach einer Optimierung bei der Logpoll-Event Verarbeitung, so dass nur noch gewollte Parameter aktualisiert werden.
@Brockmann: Danke für die Log-Analyse. Das mit imaginären Reading "T" ist nachvollziehbar und ich schaue heute Abend, wie man das besser machen kann.
@nsges:
Wird bei dir das Symbol für das Schlafzimmer weiterhin angezeigt? Ich habe jetzt sogar deinen Code übernommen, aber mehr als einen gelben, ausgefüllten Kreis bekomme ich nicht.
Zitat<div class="container">
<a id="room_index" href="index.php" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_schlafzimmer" href="schlafzimmer.php" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-bed" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_kueche" href="kueche.php" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-cutlery" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_wohnzimmer" href="wohnzimmer.php" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_ben" href="ben.php" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-male" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_julia" href="julia.php" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-female" style="color: rgb(42, 42, 42);"></i>
</a>
</div>
@Brockmann: in der js/fhem-tablet-ui.js habe ich eine kleine Änderung am Erkennungsmuster gemacht, um besser zwischen STATE und einem Reading unterscheiden zu können. Probier mal deine Wetterstation jetzt.
Zitat von: setstate am 16 März 2015, 18:56:15
Wegen Tabs, Weather-Widget, Chart-Widgets, Color-Schema ... unterhalten wir uns demnächst offline. Ich bin noch mitten im Umbau zum Auslagern der Controls als Modul. Auch schaue ich nach einer Optimierung bei der Logpoll-Event Verarbeitung, so dass nur noch gewollte Parameter aktualisiert werden.
Offline? Sehr gerne! Gibt's kalte Getränke? :) Was mir so ausnehmend gut an deinem UI gefällt, ist dass es so simpel ist und deshalb ohne weitere Klimmzüge mit Webstandards erweiterbar ist. Von daher hab ich kaum noch Feature-Wünsche mehr von denen ich aktuell wüsste. Wobei ich mich natürlich gerne vom Gegenteil überzeugen lasse.
@bjoernbo: das Icon "bed" ist erst in der aktuellsten Font-Awesome Version enthalten. Du kannst sie einfach von http://fortawesome.github.io/Font-Awesome/ laden und die entsprechenden Files in der UI-Installation austauschen.
Zitat von: setstate am 16 März 2015, 21:31:53
@Brockmann: in der js/fhem-tablet-ui.js habe ich eine kleine Änderung am Erkennungsmuster gemacht, um besser zwischen STATE und einem Reading unterscheiden zu können. Probier mal deine Wetterstation jetzt.
Sieht auf den ersten Blick gut aus. Ich behalte es mal noch im Auge, aber ich denke, so passt es jetzt. Danke! :)
Ich hab grad die gleichen Probleme, gibt es dafür schon eine Lösung?
Gruß
Luigi
Zitat von: jehu am 10 März 2015, 19:06:56
Hallo Zusammen,
ich bin gerade dabei diese wunderbare UI zu testen. @Markus vielen Dank für deine Arbeit - tolles Design *Daumen hoch*
Vielleicht könnt ihr mir hier noch ein paar Tipps geben
Aktuell habe ich 2 Probleme:
1. Bei einigen Widget z.B switch und contact werden die Statis nach einem Reload der Seite nicht wieder übernommen.
Wenn beispielsweise ein Fenster geöffnet wird, wird das sofort übernommen. Nach einem Reload(oder Neustart der Seite) wird das Fenster als geschlossen angezeigt. Schliesse und öffne ich das Fenster wieder, wird der Status "offen" wieder angezeigt. In FHEMWEB wird natürlich immer sofort aktualisiert. Bei Schaltern passiert das auch. Thermostate werden aber richtig angezeigt.
2. Beim Thermostat (ich habe aktuell nur einen) wird bei Änderung der Temperatur diese Änderung in FHEM nicht übernommen.
Im unteren linken Eck wird bei der Toast-Nachricht folgender Text angezeigt:
"Set Bad_Heizung_Climaundefined 20" - Bad_Heizung_Clima ist mein HM-CC-RT-DN (channel4)
Normalerweise müsste doch "Set Bad_Heizung_Climadesired-temp 20" dort stehen ?
Woran könnte das liegen, könnt ihr mir einen "Schupps" in die richtige Richtung geben?
Schöne Grüße
Jens
Hallo Luigi,
hast Du die aktuellste Version von fhem-tablet-ui.js installiert ?
Hast Du vielleicht die index.html übernommen und nur einige Devices geändert und den Rest unverändert gelassen.
So hatte ich Anfangs begonnen, weil es augenscheinlich so einfach ist. Das macht aber Probleme.
Grüße Jens
schau mal auf Seite 10, den Beitrag #146. Dazu gibt es eine Lösung. Ich weiß allerdings nicht, ob das mittlerweile übernommen wurde. Ich denke schon, aber es beschreibt im Ansatz das Problem, welches nach der Anpassung bei mir nicht mehr festzustellen ist.
ich habe eine kurze Rückfrage, hat aber nichts mit der UI zu tun, sondern reines HTML:
folgender Code ....
Zitat<li data-row="6" data-col="5" data-sizex="4" data-sizey="1">
<header>BEN</header>
<div class="centered container">
<div class="left">
<div type="switch" device="Schrankbeleuchtung_Ben" class="cell"></div>
<div type="label class="cell">Schrankbeleuchtung</div>
</div> <div class="left">
<div type="push" device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 300"></div>
<div type="label" class="cell">5 Minuten</div>
</div>
<div class="left">
<div type="push" device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 900"></div>
<div type="label" class="cell">15 Minuten</div>
</div>
<div class="left">
<div type="push" device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 1800"></div>
<div type="label" class="cell">30 Minuten</div>
</div>
<div class="left">
<div type="push" device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 3600"></div>
<div type="label" class="cell">1 Stunde</div>
</div>
</div>
</li>
bringt folgendes Ansicht. Aber dies gefällt mir nicht, weil
1. will ich alles in einer Zeile, innerhalb des Container zentriert haben und
2. "Schrankbeleuchtung..." ist nicht auf einer Höhe mit den übrigen Werten "x -Minuten".
kann mir jemand einen Tipp geben?
(//)
ich hätte noch einen Verbesserungsvorschlag ;D
Wenn ich z.B. bei der Dauer 5, 15, 30 Min. auswähle, wird ja bei dem entspr. Device (in diesem Fall die Lampe) derStatus auf "aktiv" gesetzt. Es ist aber leider nicht erkennbar, ob ich zuvor 15 oder 30 Minuten ausgewählt habe.
Vorschlag:
auch der Button, der für die Dauer ausgewählt wurde wird ebenso aktiv gesetzt, oder Varaiante 2.... es läuft ein Countdown mit :-D
Ich kann das nur als Vorschlag einbringen und nicht selber aktiv implementieren, da ich in JS nicht gut aufgestellt bin.
@bjoernbo: da fehlt ein " (Anführungszeichen) Zeichen bei type="label".
<div type="label" class="cell">Schrankbelechtung</div>
Danke, jetzt passt es. Ich sollte echt mal einen richtigen Editor verwenden, anstelle des VI.
Danke.
Ich habe eben folgendes Verhalten festgestellt. Für meine Heizungsthermostate verwende ich die aus der HomeMatic Serie. Hier wird die Temperatur in 0,5er Schritten eingestellt. In der UI habe ich aber nur die Möglichkeit in 1er Schritten die Temperatur einzustellen. Wenn ich am Thermostat 17,5 eintrage wird der Wert im UI mit 18 angezeigt.
Dieses Verhalten bekannt???
Die Thermostate gehen bewusst in 1er Schritten, gefällt mir besser (optisch). Wenn du 0.5 er Werte haben willst, kannst du in der fhem-Tablet-ui.js das auskommentierte 'step':.5, wieder reinnehmen.
Edit: es wird ein Update geben. Nesges hat einen Vorschlag gemacht, die Schrittweite in der Index.html festlegen zu können. Ihr werdet aber sehen, sieht nicht schön aus und braucht man auch nicht unbedingt 8)
Zitat von: setstate am 18 März 2015, 13:47:41
Ihr werdet aber sehen, sieht nicht schön aus und braucht man auch nicht unbedingt 8)
Das mit dem "schön" seh ich genauso! ;-)
Die Schönheit liegt im Auge des Betrachters, lol :-D
Ich werde es mir anschauen!
Danke
also ich finde das jetzt nicht schäbig oder so ???
Zitat von: bjoernbo am 17 März 2015, 20:53:14
ich hätte noch einen Verbesserungsvorschlag ;D
Wenn ich z.B. bei der Dauer 5, 15, 30 Min. auswähle, wird ja bei dem entspr. Device (in diesem Fall die Lampe) derStatus auf "aktiv" gesetzt. Es ist aber leider nicht erkennbar, ob ich zuvor 15 oder 30 Minuten ausgewählt habe.
Vorschlag:
auch der Button, der für die Dauer ausgewählt wurde wird ebenso aktiv gesetzt, oder Varaiante 2.... es läuft ein Countdown mit :-D
Ich kann das nur als Vorschlag einbringen und nicht selber aktiv implementieren, da ich in JS nicht gut aufgestellt bin.
Hat diese Device bei dir dann nicht den STATE on-for-timer 300 ? Den könnte man dann per data-get + data-get-on/data-get-off empfangen und den Push-Button dann leuchtend setzen. Könnte ich mir gut vorstellen und auch leicht umsetzen.
edit: okay, beim Dummy Device ist es so, beim HM-ES-PMSw1-Pl ist das Reading timedOn auf running, das könnte man auch auswerten und den Push-Button anlassen solange.
Zitat von: setstate am 18 März 2015, 19:05:27
Hat diese Device bei dir dann nicht den STATE on-for-timer 300 ?
Das ist unterschiedlich implementiert. Bei allen meinen Devices wird auf on-for-timer ein interner, unsichtbarer Timer gesetzt, der nirgendwo im Device auftaucht und mW nicht abfragbar ist.
ich habe es aus Nestes Code übernommen ....
Zitat<div type="push" device="Schrankbeleuchtung" class="cell" data-set="on-for-timer 300"></div>
<div type="label" class="cell">5 Minuten</div>
Hallo zusammen,
ich schaue mir auch gerade mal diese neue UI an. Schick und schlicht. Bis jetzt super. Vielen Dank.
Ich hätte nun natürlich auch Fragen:
1.
Es gibt ein dummy1 mit attr setList state:Wert1,Wert2,Wert3,Wert4
In dem neuen UI habe ich das nun folgendermaßen gemacht:
<div class="cell left">
<div type="switch" device="dummy1" data-get-on="Wert1" data-set-on="Wert1" class="cell" ></div>
<div type="label" class="cell">Wert1</div>
<div type="switch" device="dummy1" data-get-on="Wert2" data-set-on="Wert2" class="cell" ></div>
<div type="label" class="cell">Wert2</div>
<div type="switch" device="dummy1" data-get-on="Wert3" data-set-on="Wert3" class="cell" ></div>
<div type="label" class="cell">Wert3</div>
<div type="switch" device="dummy1" data-get-on="Wert4" data-set-on="Wert4" class="cell" ></div>
<div type="label" class="cell">Wert4</div>
</div>
Wenn in Fhem Wert2 ausgewählt ist, dann ist im Tablet UI auch Wert2 ausgewählt. Soweit ok.
Wenn man im Tablet UI nun Wert3 auswählt dann wird in Fhem korrekterweise der Wert3 gesetzt. Aber im Tablet UI sind dann Wert2 UND Wert3 ausgewählt. Erst nach einem Refresh der Seite ist korrekterweise nur noch Wert3 ausgewählt.
- Ist ein Refresh der Seite immer notwendig? Longpoll ist auf 1 gesetzt.
- Was mir zusätzlich noch nicht gefällt, ist, dass man einen ausgewählten Wert anklicken kann so dass dieser nicht mehr ausgewählt ist. Dadurch ist kein Wert ausgewählt und es kommt zu einem undefinierten Zustand. Lösung wäre vielleicht sowas wie eine Radio-Button-Gruppe.
2.
Ist es möglich ein Icon anzuzeigen welches nicht anklickbar ist? Z.B. das PRESENCE Modul. Wenn absent dann Icon im Normalzustand, wenn present dann Icon farbig. Oder z.B. um anzuzeigen ob ein Rauchmelder aktiv ist.
3.
Ist was geplant für eine Batterieanzeige, Plots, Werte/Icon farbig darstellen abhängig eines Grenzwertes, Anrufliste (Modul TM-CallMonitor)?
Vielen Dank.
MfG
Daniel
Zitat von: bjoernbo am 18 März 2015, 20:25:11
ich habe es aus Nestes Code übernommen ....
@bjoernbo,@nesges: Man könnte, wenn data-set="on-for-timer xxx", dann leuchtet der Push-Button für xxx Sekunden.
Blöd wird es nur, wenn jemand die Zeit korrigieren will, also einen Button daneben drückt, dann leuchten zwei ...
Dann müsste man alle Push-Button, die das gleiche Device haben und auch data-set="on-for-timer.*" haben vorher ausschalten.
Genau das war mein Problem.
Vielen Dank
Luigi
Zitat von: jehu am 17 März 2015, 20:17:12
Hallo Luigi,
hast Du die aktuellste Version von fhem-tablet-ui.js installiert ?
Hast Du vielleicht die index.html übernommen und nur einige Devices geändert und den Rest unverändert gelassen.
So hatte ich Anfangs begonnen, weil es augenscheinlich so einfach ist. Das macht aber Probleme.
Grüße Jens
So, ich bin jetzt zu 90% fertig.
Es bleiben jetzt nur noch Kleinigkeiten übrig wie z.B. die Kameras noch richtig einbinden und eine Lampe mit "Dimmerfunktion". Dann wäre ich fertig und frage mich, war es das nun schon :D
Es fehlen zwar noch ein paar Sachen, wie z.B. der Abfallkalender oder die Anruferliste der FritzBox. Vielleicht wird es später mal eine Möglichkeit geben, sowas auch noch einzubinden.
Anbei mein Ergebnis. An dieser Stelle vielen Dank an nesges der mich mit seinem UI und dem Code inspiriert hat!
Ps: Da ganze ist ausgelegt für ein 10.1" Tablet und läuft ohne Probleme mit WebViewControl
Pps: Hinter dem FHEM-Logo gelange ich zum FHEM Dashboard. Vom FHEM Dashboard gelange ich wieder zurück zu diesem UI
Zitat von: setstate am 18 März 2015, 21:00:53
@bjoernbo,@nesges: Man könnte, wenn data-set="on-for-timer xxx", dann leuchtet der Push-Button für xxx Sekunden.
Blöd wird es nur, wenn jemand die Zeit korrigieren will, also einen Button daneben drückt, dann leuchten zwei ...
Dann müsste man alle Push-Button, die das gleiche Device haben und auch data-set="on-for-timer.*" haben vorher ausschalten.
Bin mir grade unschlüssig, ob mir das nicht zuviel Intelligenz für einen einfachen Push-Button ist. Ich gehe bisher bei ähnlichen Problemstellungen den Weg, dass ich beim setzen von on-for-timer XXX gleichzeitig einen Dummy mit time()+XXX setze, also mit der Ausschaltzeit. Das ist für meine Anwendungsfälle die interessantere Info - dass die Lampe brennt weiss ich eh, wie lange sie noch brennt ist das was ich wissen möchte. Von daher: Wäre ein nettes Feature, ich persönlich find's aber nicht so wichtig.
@dancatt: zu 1) probiere es mal mit Negation: data-get-off="((?!Wert1).)*" data-get-on="Wert1"
Bedeutet: alles außer Wert1 führt zum Ausschalten. Habe ich aber noch nicht selbst getestet, sollte aber klappen.
Zu Punkt 2 und 3 denke ich auch noch nach ...
Zitat von: setstate am 19 März 2015, 13:15:18
@dancatt: zu 1) probiere es mal mit Negation: data-get-off="((?!Wert1).)*" data-get-on="Wert1"
Vielen Dank schonmal, werde ich testen.
Und wie ist es mit dem Refresh vom Tablet-UI?
zum Refesh.... was meinst Du genau ?
Das sich ICONS, nachdem etwas geschaltet wurde aktuallisieren, oder andere HTML Inhalte?
Ich verwende das UI mit "WebViewControll" da gibt es einen Button refresh.
Meiner Ansicht nach, ist es aber auch möglich (da es sich ja um HTML handelt) ein kleines JS einzubinden, welches das UI nach x Sekunden aktualliesiert.
z.B.
JS:
Zitatwindow.setTimeout("location.reload()", 10000);
HTML:
Zitat<meta http-equiv="refresh" content="10;url=http://[WEB-UI URL]">
Beides 10 Sekunden
Hallo bjoernbo,
Deine UI sieht schick aus.
Eine Lösung für den Müllkalender (ich nutze http://forum.fhem.de/index.php/topic,32382.0.html (http://forum.fhem.de/index.php/topic,32382.0.html)) und Familienkalender suche ich auch noch.
Wie hast du das mit dem Wettericon gelöst?
Grüße
Jens
Zitat von: dancatt am 19 März 2015, 13:56:07
Vielen Dank schonmal, werde ich testen.
Und wie ist es mit dem Refresh vom Tablet-UI?
Refresh ist zur Zeit so:
- wenn longpoll aus ist, aller 30 sek ein shortpoll (refresh aller controls)
- wenn longpoll an ist, kommen alle Events ja live rein, dann nur aller 15 Minuten sicherheitshalber ein shortpoll (Full refresh) falls ein Event mal verlustig gegangen ist.
Den zusätzlichen refresh könnte man auch weglassen, das könnte ich demnächst als Configschalter anbieten.
Zitat von: dancatt am 18 März 2015, 20:57:53
Werte/Icon farbig darstellen abhängig eines Grenzwertes
Das kannst du per Javascript lösen. Ein Ausschnitt:
$('div[type=label]').each(function(index) {
$(this).bind("DOMSubtreeModified", function(event) {
var elem = $(event.target);
var get = elem.attr("data-get");
// Temperature / Humidity
if(get) {
var val = 1*elem.text().replace(/\s+.*/, '');
if(val) {
// humidity; alle ausser A_HUMID
if(elem.attr("data-get").match(/humidity/) && !elem.attr("device").match(/^A_HUMID$/)) {
if(val >= 70) {
elem.css("color", "#FF0000");
} else if(val < 40 || val > 60) {
elem.css("color", "#FFCC80");
}
}
// temperature; alle ausser A_HUMID|KUEHL_THERMO
if(elem.attr("data-get").match(/temperature/) && !elem.attr("device").match(/^A_HUMID|KUEHL_THERMO$/)) {
if(val < 10) {
elem.css("color", "#FFFFFF");
} else if(val < 15) {
elem.css("color", "#6699FF");
} else if(val > 21) {
elem.css("color", "#AD3333");
} else if(val > 23) {
elem.css("color", "#FF0000");
}
}
}
}
});
});Der Code färbt Labels mit data-get="humidity" oder "temperature" deren Wert sich ausserhalb meines Komfortbereiches (40-60% hum, 15-21°C temp) ein.
Zitat von: dancatt am 18 März 2015, 20:57:53
Anrufliste (Modul TM-CallMonitor)?
TM-Callmonitor kenne ich leider nicht, aber falls das Modul ähnlich wie FB_CALLMONITOR arbeitet hilft dir folgender Code evtl.:
<li data-row="1" data-col="2" data-sizex="6" data-sizey="4">
<header>ANRUFE</header>
<table class="calls" width="100%">
<tr>
<td><div type="label" device="FritzBox" data-get="B0"></div></td>
<td>
<div type="label" device="FritzBox" data-get="D0" style="font-size:x-large;color:#aa6900;"></div>
<div type="label" device="FritzBox" data-get="C0"></div>
</td>
<td class="r"><div type="label" device="FritzBox" data-get="E0"></div></td>
<td class="r"><div type="label" device="FritzBox" data-get="A0"></div></td>
</tr>
<tr>
<td><div type="label" device="FritzBox" data-get="B1"></div></td>
<td>
<div type="label" device="FritzBox" data-get="D1" style="font-size:x-large;color:#aa6900;"></div>
<div type="label" device="FritzBox" data-get="C1"></div>
</td>
<td class="r"><div type="label" device="FritzBox" data-get="E1"></div></td>
<td class="r"><div type="label" device="FritzBox" data-get="A1"></div></td>
</tr>
[...]
</table>
</li>
@ nesges ALTA !!!! Ja genau das meinte ich. Du bist ein Teufelskerl !!! Muss ich gleich erstmal implementieren.
@ jehu: Genaus diesen Abfallkalender habe ich in meinem FHEM Dashboard. Diesen hätte ich aber jetzt auch gerne im neuem UI ! :-D
Deine Frage zum Wettericon .... Du meinst das Symbol im container Wetter??? Das ist eine Grafik die eingebunden habe. Anbei der Code und das Icon:
Zitat<li data-row="5" data-col="4" data-sizex="1" data-sizey="1">
<header>WETTER</header>
<div class="container">
<div class="center">
<a href="http://IP-Adresse:PORT/fhem/tablet/index_2.html">
<img src="img/wetter_trans.png" height="90" wight="90" border="0" alt="Wetter"></a>
</div>
</li>
Ich rufe hierbei die selbige Seite erneut auf, allerdings mit dem feinen Unterschied, dass der große Container "Wohnzimmer" durch das Regenradar ersetzt wird.
Zitat
<li data-row="2" data-col="5" data-sizex="3" data-sizey="3">
<header>WETTERRADAR</header>
<div class="container">
<div class="center">
<div type="label" class="cell"><a href="http://IP-Adresse:PORT/fhem/tablet/index_V2.html">
<img src="http://www.wetteronline.de/?pid=p_radar_map&ireq=true&src=radar/vermarktung/p_radar_map_forecast/forecastLoop/DL/latestForecastLoop.gif" width="300" height="375">
</img src>
</a></div>
</div>
</li>
Das war meine Idee im ersten Versuch. Tippe ich dann auf das Regenradar geht es wieder zurück auf die andere Seite.
Jetzt wird das Wetter direkt auch über das "Regenschirmsymbol" aufgerufen.
@ nesges: Prinzip Verstanden, kein Problem. Nur wie hast du es geschafft das dir die Symbole angezeigt werden?
by the way ... B0, B1, B2 wird bei mir im FB_CALLMONITOR als eine Zeile dargestellt.
ZitatB0 16:23 06.02.2015 2015-02-06 16:23:49
ist das bei dir auch so?
Hast du die Rufnummer gerundet ??? :-D
nun mit Anhang
Zitat von: bjoernbo am 19 März 2015, 19:28:37
@ nesges: Prinzip Verstanden, kein Problem. Nur wie hast du es geschafft das dir die Symbole angezeigt werden?
B0, B1, B2 wird bei mir im FB_CALLMONITOR als eine Zeile dargestellt. ist das bei dir auch so?
Die beiden Punkte werden durch etwas JS-Code gelöst, der in den DomSubtreeModified-Temperature/Humidity-Code mit eingebaut wird. Folgendes:
// Calls
if(elem.attr("data-get") && elem.attr("data-get").match(/^A[0-9]$/) && elem.text().match(/^(AB|(in|out)_(not)?connected)$/)) {
var text = elem.text();
var color = 'rgb(111,69,0)';
var img = '<a href="javascript:$.get(\'/fhem?cmd='+encodeURI('{call('+elem.attr("data-get").replace(/^A/, '')+')}')+'&XHR=1\');false;" class="cell fa-stack fa-2x">'
+ '<i id="bg" class="fa fa-stack-2x fa-circle-thin" style="color: '+color+';"></i>'
+ '<i id="fg" class="fa fa-stack-1x fa-phone" style="color: '+color+';"></i>'
+ '</a>';
elem.text('');
elem.prepend(img);
if(text.match(/^out_/)) {
elem.prepend(img.replace(/fa-phone/, 'fa-angle-right').replace(/rgb\(111,69,0\)/, 'rgb(80,80,80)'));
} else if(text.match(/^in_/)) {
elem.prepend(img.replace(/fa-phone/, 'fa-angle-left').replace(/rgb\(111,69,0\)/, 'rgb(170,105,0)'));
}
}
if(elem.attr("data-get") && elem.attr("data-get").match(/^B[0-9]$/) && elem.text().match(/^\d+:\d\d:\d\d\ \d\d.\d\d.\d\d\d\d$/)) {
var time = elem.text().replace(/^(\d+:\d\d:\d\d)\ (\d\d.\d\d.\d\d\d\d)$/, '$1');
if(time.match(/^\d:/)) {
time = '0' + time;
}
var date = elem.text().replace(/^(\d+:\d\d:\d\d)\ (\d\d.\d\d.\d\d\d\d)$/, '$2');
elem.text('');
elem.prepend(date + '<br>' + time);
}A ersetze ich also durch die beiden Symbole; Pfeil links/rechts für eingehend/ausgehender Anruf; der Hörer ruft in fhem eine Methode call() auf.
In B ersetze ich das Leerzeichen durch ein <br>. Das ist alles noch recht frisch und sicherlich buggy. Und bevor die Frage kommt:
sub call($;$) {
my $number = shift;
my $name = shift||$number;
if($number < 5) {
$name = ReadingsVal('FritzBox', 'C'.$number, '');
$number = ReadingsVal('FritzBox', 'D'.$number, '');
}
fhem("set FRITZ ring 610 1 Alert");
ar_tts("monitroid", "$name wird angerufen");
fhem("set FRITZ call ".$number);
}ZitatHast du die Rufnummer gerundet ??? :-D
Telefonnummern werden aktuell als Fliesskommazahlen interpretiert, daher wird die führende Null abgeschnitten und ein ".0" angehangen. Ich hab das Problem bei mir lokal gefixt, meine Lösung hat aber den Nachteil, dass der bisherige Default 1 für data-fix dadurch auf 0 geändert werden muss. Gibt bereits nen Pullrequest dazu, aber evtl. fällt setstate noch ne bessere Lösung ein. Dass die Nummern bei dir aktuell noch falsch angezeigt werden ist auf jeden Fall noch normal :-)
:-D Danke.
Zitatdata-fix="0"
hatte ich kurz nach meinem Post eingefügt und behebt somit das Problem im Bezug auf die Nachkommastelle. Trotzdem Danke für deine Tipp!
Deine Ausführung klingt so, als ob es geplant ist dies mal als Standard für das UI zu übernehmen ?!
Hallo,
@setstate: Wie siehts denn mit dem vielversprechenden Slider Button aus Post #168 (http://forum.fhem.de/index.php/topic,34233.msg273527.html#msg273527) aus?
Sind denn generell vertikale/horizontale Slider Widgets in Planung?
Paul
Zitat von: bjoernbo am 19 März 2015, 20:46:01
Deine Ausführung klingt so, als ob es geplant ist dies mal als Standard für das UI zu übernehmen ?!
Nicht meine Entscheidung. Ich mach auch nur Vorschläge :)
Zitat von: setstate am 19 März 2015, 13:15:18
@dancatt: zu 1) probiere es mal mit Negation: data-get-off="((?!Wert1).)*" data-get-on="Wert1"
Bedeutet: alles außer Wert1 führt zum Ausschalten. Habe ich aber noch nicht selbst getestet, sollte aber klappen.
Klappt leider nicht.
Ich würde das aber auch nicht benötigen, wenn
Zitat
- wenn longpoll an ist, kommen alle Events ja live rein, dann nur aller 15 Minuten sicherheitshalber ein shortpoll (Full refresh) falls ein Event mal verlustig gegangen ist.
funktionieren würde.
Dann würde ja beim Klick auf Wert2 im UI der dummy in Fhem auf Wert2 gesetzt (funktioniert) und durch longpoll der Wert1 im UI ausgeschaltet (funktioniert nicht).
Ich hoffe mein Problem ist klar. Ansonsten kann ich morgen Abend mal ein einfaches Beispiel mit ein paar Screenshots bereitstellen.
Zitat von: Paul.baumann am 19 März 2015, 20:53:05
Hallo,
@setstate: Wie siehts denn mit dem vielversprechenden Slider Button aus Post #168 (http://forum.fhem.de/index.php/topic,34233.msg273527.html#msg273527) aus?
Sind denn generell vertikale/horizontale Slider Widgets in Planung?
Paul
Hallo Paul,
sieht gut aus, das Widget läuft. Nur baue ich gerade die komplette fhem-tablet-ui.js um. Dort ist dann nur noch die Basisfuktionalität drin. Alle UI Controls sind dann als Object Literal separat nachladbar. Damit wird nur das geladen, was auch gebraucht wird. Das wird wichtig, wenn noch mehr Widgets hinzukommen. Bestimmt schaffe ich es noch diese Woche, es hochzuladen.
Der kommende Dimmer ist eher ein Toggle-Button (0/x%), Einstellen kann man dann die x%. Vertikale/horizontale klassische Slider wird es auch später mal geben. Das wird dann ein dünner grau/farbiger Strich mit einem runden Handle.
Zitat von: dancatt am 19 März 2015, 20:59:11
Klappt leider nicht.
Ich würde das aber auch nicht benötigen, wennfunktionieren würde.
Dann würde ja beim Klick auf Wert2 im UI der dummy in Fhem auf Wert2 gesetzt (funktioniert) und durch longpoll der Wert1 im UI ausgeschaltet (funktioniert nicht).
Ich hoffe mein Problem ist klar. Ansonsten kann ich morgen Abend mal ein einfaches Beispiel mit ein paar Screenshots bereitstellen.
Geht bei mir auf anhieb:
<div class="cell left">
<div type="switch" device="dummy1" data-get-off="((?!Wert1).)*" data-get-on="Wert1" class="cell" ></div>
<div type="label" class="cell">Wert1</div>
<div type="switch" device="dummy1" data-get-off="((?!Wert2).)*" data-get-on="Wert2" class="cell" ></div>
<div type="label" class="cell">Wert2</div>
<div type="switch" device="dummy1" data-get-off="((?!Wert3).)*" data-get-on="Wert3" class="cell" ></div>
<div type="label" class="cell">Wert3</div>
<div type="switch" device="dummy1" data-get-off="((?!Wert4).)*" data-get-on="Wert4" class="cell" ></div>
<div type="label" class="cell">Wert4</div>
</div>
Wenn du Button 1 drückst, kommt dieses Event in FHEM:
2015-03-19 22:04:40 dummy dummy1 Wert1Das Ausschalt-Event abonnierst du mit data-get-off="xyz". Mit data-get-off="((?!Wert2).)*" schalten alle anderen Buttons aus, weil die Bedingung nicht erfüllt ist.
Hast du die neuste Version von Github bei dir drauf?
Hi bjoernbo,
Danke für das Icon und den Quelltext.
Ich dachte anfänglich das wäre ein Icon um das aktuelle Wetter direkt anzuzeigen. Ich finde den Look nämlich sehr schön.
Aber so ist das auch eine gute Lösung und ich werde dieses wohl in ähnlich übernehmen.
Toll was sich hier entwickelt *Daumen hoch* :)
Grüße
Jens
Hi, ne ist nur eine Verknüpfung. Aber eine oder zwei Seiten vorher hat nesges ein JS zur Verfügung gestellt und ich meine es ging darum, dass Icon entsprechen der Luftfeuchtigkeit o.ä. anzeigen zu lassen.
Ja, ich finde das auch sehr interessant was sich hier in kurzer Zeit im Bezug auf das UI entwickelt hat. Ich hoffe das es noch weitere tolle Anbindungen gibt.
Hallo zusammen,
ich habe heute angefangen mir ein Dashboard zu basteln. Leider sind meine Kenntnisse etwas begrenzt sorry dafür :-\
Zur Heizungssteuerung setzte ich einen Dummy ein dort Trage ich die gewünschte Temperatur ein z.b.
set dummy 20
Ich wollte mir im Dashboard ein Thermostat Widget anzeigen lassen
<div type="thermostat" device="Bad_Soll_Temp" data-get="state" data-temp="state" data-set="state" class="cell"></div>
Die Anzeige funktioniert auch :).
Aber wenn ich am Regler drehe und die Temperatur verstellen will steht in den Readings des dummys
state state19
ich will aber das nur 19 drin steht ohne dem Wort state davor.
Ich habe auch versucht data-set="state" weg zu lassen dann steht in den Readings
state desired-temp 23 Was irgendwie logisch erscheint da desired-temp ja der Standardwert ist.
Kann mir da jemand weiterhelfen?
Grüße
Markus
Versuch mal:
data-set=" "
Ja so gehts ;D
Manchmal ist die Lösung so einfach ::)
Da hab ich aber gleich noch ne Anschlussfrage :-[
Wenn ich die Temperatur jetzt verstelle wird zwar im Dummy der Wert eingetragen aber im Dashboard springt die Anzeige wieder zurück dort sehe ich die Änderung erst wenn ich die Seite neu Lade ?
Gruß
Zitat von: mago0211 am 20 März 2015, 15:52:42
Wenn ich die Temperatur jetzt verstelle wird zwar im Dummy der Wert eingetragen aber im Dashboard springt die Anzeige wieder zurück dort sehe ich die Änderung erst wenn ich die Seite neu Lade ?
Hast du die anderen data-Attribute auch auf " " gesetzt? Versuch das mal. Falls das nichts bringt, zeig mal einen Ausschnitt aus dem Eventmonitor, beim Temperatur verstellen.
@setstate: Lösung für mago0211's Problem könnte sein
fhem-tablet-ui.js, Zeile 138:
$(this).data('set', (typeof $(this).data('set')=='undefined'?'desired-temp':$(this).data('set')));
Damit wird der Default nur heran genommen, wenn das Attribut nicht gesetzt ist. Sollte entsprechend bei allen Default-Werten angepasst werden. Da du grade größere Umbauarbeiten angekündigt hast, weiss ich nicht ob sich derzeit ein Pull-Request lohnt - ich mach aber gerne einen fertig! :-)
also wenn ich die anderen auch auf " " einstelle wird der Wert nicht mehr angezeigt bzw. als Wert wird 10 angezeigt
Mit folgender Einstellung
<div type="thermostat" device="Bad_Soll_Temp" data-get="state" data-temp="state" data-set=" " class="cell"></div>
bekomme ich im Event Monitor
2015-03-20 16:14:35 dummy Bad_Soll_Temp 26
2015-03-20 16:14:45 dummy Bad_Soll_Temp 28
Und mit
<div type="thermostat" device="Bad_Soll_Temp" data-get=" " data-temp=" " data-set=" " class="cell"></div>
2015-03-20 16:15:52 dummy Bad_Soll_Temp 22
2015-03-20 16:15:59 dummy Bad_Soll_Temp 26
Bei Variante 2 bleibt der Regler dann auch auf den Eingestellten Wert stehen. Wenn ich aber jetzt die Seite neu lade wird der Wert im Dashboard auf 10 gesetzt im Dummy bleibt er auf dem eingestellten Wert stehen.
Also genau das gegenteilige Verhalten :o
Versuch das mal, damit funktioniert's hier bei mir:
<li data-row="1" data-col="1" data-sizex="7" data-sizey="4">
<div type="thermostat"
device="TEST_DUMMY"
data-get="STATE"
data-temp="STATE"
data-set=" "
class="cell"></div>
Edit: data-temp funktioniert doch nicht. Aber da fehlt mir jetzt auch die Idee wie man's lösen könnte.
Leider kein Erfolg :(
ich muss auf jeden Fall STATE klein schreiben
<div type="thermostat"
device="Bad_Soll_Temp"
data-get="state"
data-temp="state"
data-set=" "
class="cell"></div>
Dann wird zwar der aktuelle Wert angezeigt. Wenn ich ihn aber ändere muss ich die Seite erst neu laden mit F5 z.b. damit er mir den aktuellen Wert anzeigt. Ich habe aber gerade festgestellt das die anderen Daten auch nicht aktualisiert werden. Bei mir werden die Daten erst nach einem Neu laden der Seite aktualisiert. Da schein wohl irgendwas anderes nicht zu funktionieren. :o
Hmm da muss ich mal noch schauen ob ich bei den Beispielen hier im Forum noch eine passende Lösung finde weil immer F5 drücken ist auf dauer auch irgendwie nervig ::)
Aber trotzdem Danke für deine Hilfe ;D
Grüße
Wie ist denn bei dir die Definition von LONGPOLL ?
Ich habe meinen Eintrag entsprechend auskommentiert und erhalte sofort (1-2 Sek.) die entsprechende Rückmeldung!
Zitat<!-- <meta name="longpoll" content="1"> -->
Ja tatsächlich. Wenn ich den Eintrag auskommentiere gehts auch bei mir ca. 3 - 4 sec. was absolut akzeptabel ist.
Danke ;D
Wie kann das funktionieren? :o
Wenn ihr in Fhem dann was ändert, erfolgt im UI sofort das Update, nicht erst nach 30 Sekunden (shortpoll)?
ich habe nie behauptet das etwas 30 Sekunden dauert :-D
Wäre der default, wenn der logpoll Tag fehlt. Bei mir ... ;D
var shortpollInterval = 30 * 1000; // 30 seconds
Änderungen aus Fhem heraus dauern 30 sec ::).
Außer bei meinen switches da tut sich nichts wenn ich die in Fhem ändere.
@nesges
in Beitrag #164 hast du etwas gepostet. Wenn ich das richtig verstehe kann ich damit Farben für eine Lampe bestimmten? Ich habe mir heute OSRAM Lightyfi zugelegt. funzt klasse. Nun will ich das im UI integrieren und dabei ist mir dein Post aufgefallen.
Sind deine Änderungen im JS schon im Standard übernommen? Kann ich damit wohl auch die OSRAM Lampen steuern??
Danke & Gruß
Hallo bjoernbo, ist leider noch nicht im Standard. Ich werde heute Abend die neue Version hochladen, da sieht man dann, wie die Widgets Plugins aufgebaut werden. Da könnte Nesges das entsprechend implementieren, wen er will ;-).
Ich muss eher die Docu erweitern und checken, ob die neue Version in allen Lagen spielt.
Viele Grüße
Mario
Guten Abend geneigte Nutzergemeinde,
heute endlich bin ich soweit, um die neue Version veröffentlichen zu können.
Äußerlich werdet ihr kaum einen Unterschied sehen können, die größte Änderung ist die Separierung der Widgets. Damit werden nur noch die Elemente geladen, die auch benutzt werden. Eine Erweiterung mit neuen Widgets ist damit auch besser möglich.
Eure jetzige index.html ist auch weiterhin kompatibel. Nur die Attribute 'type' und 'device' sind ab sofort deprecated. Nutzt bitte stattdessen ab sofort data-type und data-device, diese Namen sind mehr HTML konform. Intern wandle ich die falschen Attribute noch um in die richtigen. Bitte macht ein Update aller Files! Natürlich außer eurer index.html (ggf. auch der fhem-tablet-ui.css), die müsst ihr von Hand entsprechend erweitern.
Um euch den Umstieg auf die neue Version schmackhaft zu machen, gibt es auch zwei neue Widgets:
Dimmer und Slider. Der Dimmer ist ein Toggle-Button, mit dem man ein Device zwischen OFF und X% hin und her schalten kann. Den ON Prozentwert kann man einfach per hoch/runter Schieben verändern. Das ist ideal zum Beispiel für eine Lampe, die man normalerweise nur an/aus schaltet, den Helligkeitswert kann man einfach festlegen und ändern.
Der Slider ist ein vertikaler Schieberegler zum Steuern von Devices zwischen min und max Wert.
(http://knowthelist.github.io/fhem-tablet-ui/slider.png)(http://knowthelist.github.io/fhem-tablet-ui/dimmer.png)
Das Label Widget kann jetzt auch entsprechend zu Limit-Werten die Farbe ändern. Somit kann man jetzt zum Beispiel die Temperatur-Anzeige bei Frost blau werden lassen und bei zuviel Wärme rot. Entsprechende Beispiele sind in der README und der Beispiels index.hml zu finden. Wenn man numerische Werte mit dem Label Widget anzeigen will, hilft das Attribut 'data-fix', um die Anzahl der Nachkommastellen festlegen zu können. 0 keine Kommastelle, 1 eine Nachkommastelle usw. Bei Telefonnummern lässt man das Attribut weg, dann wird nicht versucht, eine Zahl anzuzeigen. Evtl. müsst ihr eurer jetziges Setup anpassen, wenn plötzlich wieder viele Kommastellen erscheinen. Der default-Wert hat sich in diesem Bereich geändert (thx gesges)
Viel Spaß damit ... ;D
Sollten ein unerwartetes Verhalten auftreten, kann man in der index.html mit dem tag: <meta name="debug" content="1"> die Web-Console etwas gesprächiger machen.
gar nicht gut :'(
Schade! :-[ #!§!!## >:(
Dann setze mal <meta name="debug" content="1"> und schaue bitte mal in der Webconsole https://developer.mozilla.org/de/docs/Tools/Web_Konsole (https://developer.mozilla.org/de/docs/Tools/Web_Konsole) nach, was für Fehler kommen.
Alternativ kann man auch sich eine index_new.hml hin kopieren und diese soweit zurückbauen, bis es wieder läuft, um zu sehen, welcher Part den Fehler verursacht.
anbei konkretes Beispiel für einen Raum mit gesamten Code:
Zitat<html>
<title>FHEM</title>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.1.0
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet_dev/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script data-type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script data-type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script data-type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
<script data-type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script data-type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script data-type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script data-type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>DASHBOARD</header>
<div type="label"class="cell"><a href="http://192.168.178.51:8083/fhem/?room=DashboardRoom"><img src="img/fhem-logo.png" height="100" wight="100" border="0" alt="Dashboard"></a></div>
</li>
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4">
<header>RÄUME</header>
<style>
#room_ben #bg {
color: rgb(0,135,168) !important;
border: 3px
}
</style>
<div class="container">
<a id="room_index" href="index_V2.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_schlafzimmer" href="schlafzimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-bed" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_kueche" href="kueche.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-cutlery" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_wohnzimmer" href="wohnzimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_ben" href="ben.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-male" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_julia" href="julia.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-female" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_wetter" href="wetter.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-umbrella" style="color: rgb(255,255,255);"></i>
</a>
</div>
</li>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>HEIZUNG</header>
<div type="thermostat" device="Ben.Wandthermostat" data-get="desired-temp" data-temp="measured-temp"
<div class="container">
<div class="cell center">
<div type="label" device="Ben.Wandthermostat" data-get="humidity" data-unit=" %" class="cell small">
</div></div>
</li>
<li data-row="1" data-col="4" date-sizex="3" data-sizey="2">
<header>KAMERA</header>
<div type="label" class="cell"><img src="http://192.168.178.133:5300/snapshot.jpg?user=XXXXX&pwd=XXXXX" height="116" wight="131" border="0"></img src></div>
</li>
<li data-row="2" data-col="2" data-sizex="1" data-sizey="4">
<header>Schrank-Licht</header>
<div class="centered container">
<div data-type="switch" data-device="Schrankbeleuchtung_Ben" class="cell"></div>
<div data-type="push" data-device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 300"></div>
<div data-type="label" class="cell">5 Minuten</div>
<div data-type="push" data-device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 900"></div>
<div data-type="label" class="cell">15 Minuten</div>
<div data-type="push" data-device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 1800"></div>
<div data-type="label" class="cell">30 Minuten</div>
<div data-type="push" data-device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 3600"></div>
<div data-type="label" class="cell">1 Stunde</div>
<div data-type="push" data-device="Schrankbeleuchtung_Ben" class="cell" data-set="on-for-timer 7200"></div>
<div data-type="label" class="cell">2 Stunden</div>
</div>
</li>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
<header>FENSTER</header>
<div class="container">
<div class="left">
</div>
<div class="center">
<div data-type="contact" data-device="Fensterkontakt.Ben" data-get="state" class="cell"></div>
<div data-type="label" class="cell"></div>
</div>
</div>
</li>
</li>
</ul>
</div>
</body>
</html>
Auszug aus der Konsole:
ZitatSynchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.min.js:4
ReferenceError: getGradientColor is not defined
@bjoernbo: danke für den code, wollte ich gerade vorschlagen ... Schaue ich mir gleich an.
Super.
Die Meldung sagt mir leider wenig.
Dabei fand das meine Frau gestern alles so toll und ich sagte es wird noch besser, was es sicherlich auch wird :-D
tut mir leid. :(
Die widget_thermostat.js und widget_volume.js hatten einen Bug, bitte neu von github ziehen.
sorry
mario
ok, by the way. aktualisiere doch gleich noch auf die neue font-awesome Version 4.3.0
passt noch nicht ganz :-/
ZitatSynchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.min.js:4
TypeError: $(...).famultibutton is not a function
Search & Replace Fehler bei mir. So muss das aussehen. Nur Type nicht Data-Type. Hier ist Type das richtige Attribute. Nur bei div nicht.
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
das beduetet? was soll ich tun, bzw. hast Du in Github schon was aktuallisiert? Ich sehe nur die Korrektur der INDEX.HMTL
ich bin jetzt erstmal auf die vorherige Version zurückgekehrt.
1. Test mit v1.3.0 war erfolgreich. Dimmen mache ich jedoch über "volume".
Werde weiter testen und das Projekt weiter verfolgen.
(http://s1.postimg.org/5eax62kzv/Bildschirmfoto_vom_2015_03_22_12_47_32.jpg) (http://postimg.org/image/5eax62kzv/)
Hast Du komplett "neuaufgesetzt", sprich du hast direkt mit der Version 1.0.3 gestartet oder hattest Du schon vorher ein UI unter der vorherigen Version angelegt?
Mit meinem bestehenden wird mir alles "zerschossen" :-/
Hi,
in der index.html passt der Pfad zur css noch nicht.
<link rel="stylesheet" href="/fhem/tablet_dev/css/fhem-tablet-ui.css" />
richtig <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
Grüße Andreas
Zitat von: bjoernbo am 22 März 2015, 13:20:09
Hast Du komplett "neuaufgesetzt", sprich du hast direkt mit der Version 1.0.3 gestartet oder hattest Du schon vorher ein UI unter der vorherigen Version angelegt?
Mit meinem bestehenden wird mir alles "zerschossen" :-/
Ich hatte eine UI html von v1.2.0
@schnibberle: Es ist immer wieder toll zu sehen, was alles so möglich ist. :)
Das Volumen Widget für Dim-Zwecke zu nutzen, ist auch eine gute Idee, aber dafür sind sie etwas groß, finde ich.
Darum habe ich gerade noch in das widget_volume die Möglichkeit eingebaut, eine kleinere Größe zeichnen zulassen. Dafür braucht man bloß im entsprechenden Element die Klasse small hinzufügen.
class="cell small"
Beim widget_thermostat geht jetzt auch das Gegenteil. Die Widgets sind per default schon klein. Mit der Klasse 'big', kann man diese größer machen.
class="cell big"
Hast du wirklich überall 10° eingestellt, oder ist das noch ein Bug?
... und vielen Dank fürs Feedback an alle!
Hallo,
ich nutze zur Wettervorhersage hier das Modul PROPLANTA. Damit kann ich mit dem widget-type "label" auch gut alle Werte anzeigen lassen.
Nun würde ich aber gern noch das entsprechende Wettericon anzeigen. Die entsprechende URL steht in Readings fc0_weatherDayIcon.
folgender Code zeigt auch richtigerweise die URL an:
<div type="label" device="Wetter1" data-get="fc0_weatherDayIcon"></div>
Nur fehlt mir die richtige Idee/Erfahrung wie ich das dann entsprechend in ein IMG-Tag einbinde.
Hat jemand eine Idee für mich?
Schöne Grüße
Jens
Hallo Jens, schick mal den Output des Reading. Da kann man was machen, evtl. sogar ein neues Widget gleich.
Oder am besten gleich deinen Eintrag in der fhem.cfg für das PROPLANTA, dann kann ich mir das hier auch erzeugen.
Hallo Mario,
Das wäre natürlich klasse. :)
Unten das komplette Listing des Moduls:
Schöne Grüße
Jens
Internals:
DEF Hildesheim
INTERVAL 3600
NAME Wetter1
NR 171
STATE Tmin: -2 Tmax: 7 T: 5.5 H: 40.6 W: 14.4 P: 1025.5
TYPE PROPLANTA
URL http://www.proplanta.de/Wetter/Hildesheim-Wetter.html
URL2 http://www.proplanta.de/Wetter/profi-wetter.php?SITEID=60&PLZ=Hildesheim&STADT=Hildesheim&WETTERaufrufen=stadt&Wtp=&SUCHE=Wetter&wT=
Readings:
2015-03-22 17:58:58 cloudBaseMax -
2015-03-22 17:58:58 cloudBaseMin -
2015-03-22 17:58:58 dewPoint -6.7
2015-03-22 17:58:58 durationFetchReadings 11.91
2015-03-22 17:58:58 fc0_chOfRain00 20
2015-03-22 17:58:58 fc0_chOfRain03 15
2015-03-22 17:58:58 fc0_chOfRain06 10
2015-03-22 17:58:58 fc0_chOfRain09 5
2015-03-22 17:58:58 fc0_chOfRain12 10
2015-03-22 17:58:58 fc0_chOfRain15 5
2015-03-22 17:58:58 fc0_chOfRain18 5
2015-03-22 17:58:58 fc0_chOfRain21 5
2015-03-22 17:58:58 fc0_chOfRainDay 10
2015-03-22 17:58:58 fc0_chOfRainNight 5
2015-03-22 17:58:58 fc0_cloud00 100
2015-03-22 17:58:58 fc0_cloud03 75
2015-03-22 17:58:58 fc0_cloud06 50
2015-03-22 17:58:58 fc0_cloud09 25
2015-03-22 17:58:58 fc0_cloud12 50
2015-03-22 17:58:58 fc0_cloud15 0
2015-03-22 17:58:58 fc0_cloud18 12.5
2015-03-22 17:58:58 fc0_cloud21 12.5
2015-03-22 17:58:58 fc0_date 22.03.2015
2015-03-22 17:58:58 fc0_dew 2
2015-03-22 17:58:58 fc0_evapor 1
2015-03-22 17:58:58 fc0_frost 1
2015-03-22 17:58:58 fc0_moonRise 07:20
2015-03-22 17:58:58 fc0_moonSet 21:37
2015-03-22 17:58:58 fc0_rad 5
2015-03-22 17:58:58 fc0_rain00 0
2015-03-22 17:58:58 fc0_rain03 0
2015-03-22 17:58:58 fc0_rain06 0
2015-03-22 17:58:58 fc0_rain09 0
2015-03-22 17:58:58 fc0_rain12 0
2015-03-22 17:58:58 fc0_rain15 0
2015-03-22 17:58:58 fc0_rain18 0
2015-03-22 17:58:58 fc0_rain21 0
2015-03-22 17:58:58 fc0_sun 50
2015-03-22 17:58:58 fc0_temp00 1
2015-03-22 17:58:58 fc0_temp03 -2
2015-03-22 17:58:58 fc0_temp06 -2
2015-03-22 17:58:58 fc0_temp09 2
2015-03-22 17:58:58 fc0_temp12 5
2015-03-22 17:58:58 fc0_temp15 6
2015-03-22 17:58:58 fc0_temp18 0
2015-03-22 17:58:58 fc0_temp21 -1
2015-03-22 17:58:58 fc0_tempMax 7
2015-03-22 17:58:58 fc0_tempMin -2
2015-03-22 17:58:58 fc0_uv 3
2015-03-22 17:58:58 fc0_weatherDay wolkig
2015-03-22 17:58:58 fc0_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t3.gif
2015-03-22 17:58:58 fc0_weatherEvening heiter
2015-03-22 17:58:58 fc0_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n2.gif
2015-03-22 17:58:58 fc0_weatherMorning wolkig
2015-03-22 17:58:58 fc0_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t3.gif
2015-03-22 17:58:58 fc0_weatherNight heiter
2015-03-22 17:58:58 fc0_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n2.gif
2015-03-22 17:58:58 fc10_date 01.04.2015
2015-03-22 17:58:58 fc10_moonRise 16:58
2015-03-22 17:58:58 fc10_moonSet 05:40
2015-03-22 17:58:58 fc10_tempMax 9
2015-03-22 17:58:58 fc10_tempMin 6
2015-03-22 17:58:58 fc10_weather Regenschauer
2015-03-22 17:58:58 fc10_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t6.gif
2015-03-22 17:58:58 fc11_date 02.04.2015
2015-03-22 17:58:58 fc11_moonRise 18:01
2015-03-22 17:58:58 fc11_moonSet 06:03
2015-03-22 17:58:58 fc11_tempMax 8
2015-03-22 17:58:58 fc11_tempMin 2
2015-03-22 17:58:58 fc11_weather stark bewoelkt
2015-03-22 17:58:58 fc11_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t4.gif
2015-03-22 17:58:58 fc12_date 03.04.2015
2015-03-22 17:58:58 fc12_moonRise 19:04
2015-03-22 17:58:58 fc12_moonSet 06:26
2015-03-22 17:58:58 fc12_tempMax 11
2015-03-22 17:58:58 fc12_tempMin 1
2015-03-22 17:58:58 fc12_weather stark bewoelkt
2015-03-22 17:58:58 fc12_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t4.gif
2015-03-22 17:58:58 fc13_date 04.04.2015
2015-03-22 17:58:58 fc13_moonRise 20:07
2015-03-22 17:58:58 fc13_moonSet 06:48
2015-03-22 17:58:58 fc13_tempMax 8
2015-03-22 17:58:58 fc13_tempMin 2
2015-03-22 17:58:58 fc13_weather stark bewoelkt
2015-03-22 17:58:58 fc13_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t4.gif
2015-03-22 17:58:58 fc1_chOfRain00 5
2015-03-22 17:58:58 fc1_chOfRain03 5
2015-03-22 17:58:58 fc1_chOfRain06 5
2015-03-22 17:58:58 fc1_chOfRain09 5
2015-03-22 17:58:58 fc1_chOfRain12 5
2015-03-22 17:58:58 fc1_chOfRain15 15
2015-03-22 17:58:58 fc1_chOfRain18 10
2015-03-22 17:58:58 fc1_chOfRain21 10
2015-03-22 17:58:58 fc1_chOfRainDay 10
2015-03-22 17:58:58 fc1_chOfRainNight 10
2015-03-22 17:58:58 fc1_cloud00 25
2015-03-22 17:58:58 fc1_cloud03 25
2015-03-22 17:58:58 fc1_cloud06 25
2015-03-22 17:58:58 fc1_cloud09 25
2015-03-22 17:58:58 fc1_cloud12 25
2015-03-22 17:58:58 fc1_cloud15 62.5
2015-03-22 17:58:58 fc1_cloud18 37.5
2015-03-22 17:58:58 fc1_cloud21 50
2015-03-22 17:58:58 fc1_date 23.03.2015
2015-03-22 17:58:58 fc1_dew 0
2015-03-22 17:58:58 fc1_evapor 1
2015-03-22 17:58:58 fc1_frost 1
2015-03-22 17:58:58 fc1_moonRise 07:54
2015-03-22 17:58:58 fc1_moonSet 22:52
2015-03-22 17:58:58 fc1_rad 4.7
2015-03-22 17:58:58 fc1_rain00 0
2015-03-22 17:58:58 fc1_rain03 0
2015-03-22 17:58:58 fc1_rain06 0
2015-03-22 17:58:58 fc1_rain09 0
2015-03-22 17:58:58 fc1_rain12 0
2015-03-22 17:58:58 fc1_rain15 0
2015-03-22 17:58:58 fc1_rain18 0
2015-03-22 17:58:58 fc1_rain21 0
2015-03-22 17:58:58 fc1_sun 50
2015-03-22 17:58:58 fc1_temp00 -1
2015-03-22 17:58:58 fc1_temp03 -1
2015-03-22 17:58:58 fc1_temp06 0
2015-03-22 17:58:58 fc1_temp09 7
2015-03-22 17:58:58 fc1_temp12 11
2015-03-22 17:58:58 fc1_temp15 11
2015-03-22 17:58:58 fc1_temp18 3
2015-03-22 17:58:58 fc1_temp21 2
2015-03-22 17:58:58 fc1_tempMax 12
2015-03-22 17:58:58 fc1_tempMin -1
2015-03-22 17:58:58 fc1_uv 3
2015-03-22 17:58:58 fc1_weatherDay wolkig
2015-03-22 17:58:58 fc1_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t3.gif
2015-03-22 17:58:58 fc1_weatherEvening wolkig
2015-03-22 17:58:58 fc1_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n3.gif
2015-03-22 17:58:58 fc1_weatherMorning heiter
2015-03-22 17:58:58 fc1_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t2.gif
2015-03-22 17:58:58 fc1_weatherNight wolkig
2015-03-22 17:58:58 fc1_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n3.gif
2015-03-22 17:58:58 fc2_chOfRain00 10
2015-03-22 17:58:58 fc2_chOfRain03 10
2015-03-22 17:58:58 fc2_chOfRain06 10
2015-03-22 17:58:58 fc2_chOfRain09 5
2015-03-22 17:58:58 fc2_chOfRain12 5
2015-03-22 17:58:58 fc2_chOfRain15 20
2015-03-22 17:58:58 fc2_chOfRain18 20
2015-03-22 17:58:58 fc2_chOfRain21 10
2015-03-22 17:58:58 fc2_chOfRainDay 10
2015-03-22 17:58:58 fc2_chOfRainNight 10
2015-03-22 17:58:58 fc2_cloud00 62.5
2015-03-22 17:58:58 fc2_cloud03 50
2015-03-22 17:58:58 fc2_cloud06 25
2015-03-22 17:58:58 fc2_cloud09 12.5
2015-03-22 17:58:58 fc2_cloud12 12.5
2015-03-22 17:58:58 fc2_cloud15 100
2015-03-22 17:58:58 fc2_cloud18 87.5
2015-03-22 17:58:58 fc2_cloud21 37.5
2015-03-22 17:58:58 fc2_date 24.03.2015
2015-03-22 17:58:58 fc2_dew 0
2015-03-22 17:58:58 fc2_evapor 1
2015-03-22 17:58:58 fc2_frost 1
2015-03-22 17:58:58 fc2_moonRise 08:32
2015-03-22 17:58:58 fc2_moonSet --:--
2015-03-22 17:58:58 fc2_rad 3.3
2015-03-22 17:58:58 fc2_rain00 0
2015-03-22 17:58:58 fc2_rain03 0
2015-03-22 17:58:58 fc2_rain06 0
2015-03-22 17:58:58 fc2_rain09 0
2015-03-22 17:58:58 fc2_rain12 0
2015-03-22 17:58:58 fc2_rain15 0
2015-03-22 17:58:58 fc2_rain18 0
2015-03-22 17:58:58 fc2_rain21 0
2015-03-22 17:58:58 fc2_sun 50
2015-03-22 17:58:58 fc2_temp00 1
2015-03-22 17:58:58 fc2_temp03 1
2015-03-22 17:58:58 fc2_temp06 2
2015-03-22 17:58:58 fc2_temp09 10
2015-03-22 17:58:58 fc2_temp12 12
2015-03-22 17:58:58 fc2_temp15 10
2015-03-22 17:58:58 fc2_temp18 5
2015-03-22 17:58:58 fc2_temp21 3
2015-03-22 17:58:58 fc2_tempMax 12
2015-03-22 17:58:58 fc2_tempMin 1
2015-03-22 17:58:58 fc2_uv 2
2015-03-22 17:58:58 fc2_weatherDay wolkig
2015-03-22 17:58:58 fc2_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t3.gif
2015-03-22 17:58:58 fc2_weatherEvening bedeckt
2015-03-22 17:58:58 fc2_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n5.gif
2015-03-22 17:58:58 fc2_weatherMorning wolkig
2015-03-22 17:58:58 fc2_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t3.gif
2015-03-22 17:58:58 fc2_weatherNight wolkig
2015-03-22 17:58:58 fc2_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n3.gif
2015-03-22 17:58:58 fc3_chOfRain00 10
2015-03-22 17:58:58 fc3_chOfRain03 15
2015-03-22 17:58:58 fc3_chOfRain06 80
2015-03-22 17:58:58 fc3_chOfRain09 20
2015-03-22 17:58:58 fc3_chOfRain12 20
2015-03-22 17:58:58 fc3_chOfRain15 20
2015-03-22 17:58:58 fc3_chOfRain18 80
2015-03-22 17:58:58 fc3_chOfRain21 20
2015-03-22 17:58:58 fc3_chOfRainDay 80
2015-03-22 17:58:58 fc3_chOfRainNight 20
2015-03-22 17:58:58 fc3_cloud00 37.5
2015-03-22 17:58:58 fc3_cloud03 62.5
2015-03-22 17:58:58 fc3_cloud06 87.5
2015-03-22 17:58:58 fc3_cloud09 100
2015-03-22 17:58:58 fc3_cloud12 87.5
2015-03-22 17:58:58 fc3_cloud15 87.5
2015-03-22 17:58:58 fc3_cloud18 100
2015-03-22 17:58:58 fc3_cloud21 100
2015-03-22 17:58:58 fc3_date 25.03.2015
2015-03-22 17:58:58 fc3_dew 0
2015-03-22 17:58:58 fc3_evapor 1
2015-03-22 17:58:58 fc3_frost 0
2015-03-22 17:58:58 fc3_moonRise 09:15
2015-03-22 17:58:58 fc3_moonSet 00:00
2015-03-22 17:58:58 fc3_rad 2.6
2015-03-22 17:58:58 fc3_rain00 0
2015-03-22 17:58:58 fc3_rain03 0
2015-03-22 17:58:58 fc3_rain06 2.9
2015-03-22 17:58:58 fc3_rain09 0
2015-03-22 17:58:58 fc3_rain12 0
2015-03-22 17:58:58 fc3_rain15 0
2015-03-22 17:58:58 fc3_rain18 0.6
2015-03-22 17:58:58 fc3_rain21 0
2015-03-22 17:58:58 fc3_sun 5
2015-03-22 17:58:58 fc3_temp00 2
2015-03-22 17:58:58 fc3_temp03 2
2015-03-22 17:58:58 fc3_temp06 5
2015-03-22 17:58:58 fc3_temp09 8
2015-03-22 17:58:58 fc3_temp12 8
2015-03-22 17:58:58 fc3_temp15 8
2015-03-22 17:58:58 fc3_temp18 6
2015-03-22 17:58:58 fc3_temp21 5
2015-03-22 17:58:58 fc3_tempMax 9
2015-03-22 17:58:58 fc3_tempMin 2
2015-03-22 17:58:58 fc3_uv 1
2015-03-22 17:58:58 fc3_weatherDay Regen
2015-03-22 17:58:58 fc3_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t7.gif
2015-03-22 17:58:58 fc3_weatherEvening Regen
2015-03-22 17:58:58 fc3_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n7.gif
2015-03-22 17:58:58 fc3_weatherMorning Regen
2015-03-22 17:58:58 fc3_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t7.gif
2015-03-22 17:58:58 fc3_weatherNight bedeckt
2015-03-22 17:58:58 fc3_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n5.gif
2015-03-22 17:58:58 fc4_chOfRain00 20
2015-03-22 17:58:58 fc4_chOfRain03 20
2015-03-22 17:58:58 fc4_chOfRain06 20
2015-03-22 17:58:58 fc4_chOfRain09 20
2015-03-22 17:58:58 fc4_chOfRain12 10
2015-03-22 17:58:58 fc4_chOfRain15 5
2015-03-22 17:58:58 fc4_chOfRain18 10
2015-03-22 17:58:58 fc4_chOfRain21 5
2015-03-22 17:58:58 fc4_chOfRainDay 15
2015-03-22 17:58:58 fc4_chOfRainNight 10
2015-03-22 17:58:58 fc4_cloud00 100
2015-03-22 17:58:58 fc4_cloud03 100
2015-03-22 17:58:58 fc4_cloud06 100
2015-03-22 17:58:58 fc4_cloud09 100
2015-03-22 17:58:58 fc4_cloud12 50
2015-03-22 17:58:58 fc4_cloud15 25
2015-03-22 17:58:58 fc4_cloud18 25
2015-03-22 17:58:58 fc4_cloud21 25
2015-03-22 17:58:58 fc4_date 26.03.2015
2015-03-22 17:58:58 fc4_dew 0
2015-03-22 17:58:58 fc4_evapor 1
2015-03-22 17:58:58 fc4_frost 0
2015-03-22 17:58:58 fc4_moonRise 10:03
2015-03-22 17:58:58 fc4_moonSet 01:01
2015-03-22 17:58:58 fc4_rad 4.7
2015-03-22 17:58:58 fc4_rain00 0
2015-03-22 17:58:58 fc4_rain03 0
2015-03-22 17:58:58 fc4_rain06 0
2015-03-22 17:58:58 fc4_rain09 0
2015-03-22 17:58:58 fc4_rain12 0
2015-03-22 17:58:58 fc4_rain15 0
2015-03-22 17:58:58 fc4_rain18 0
2015-03-22 17:58:58 fc4_rain21 0
2015-03-22 17:58:58 fc4_sun 25
2015-03-22 17:58:58 fc4_temp00 4
2015-03-22 17:58:58 fc4_temp03 3
2015-03-22 17:58:58 fc4_temp06 2
2015-03-22 17:58:58 fc4_temp09 5
2015-03-22 17:58:58 fc4_temp12 9
2015-03-22 17:58:58 fc4_temp15 9
2015-03-22 17:58:58 fc4_temp18 4
2015-03-22 17:58:58 fc4_temp21 2
2015-03-22 17:58:58 fc4_tempMax 9
2015-03-22 17:58:58 fc4_tempMin 2
2015-03-22 17:58:58 fc4_uv 3
2015-03-22 17:58:58 fc4_weatherDay stark bewoelkt
2015-03-22 17:58:58 fc4_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t4.gif
2015-03-22 17:58:58 fc4_weatherEvening wolkig
2015-03-22 17:58:58 fc4_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n3.gif
2015-03-22 17:58:58 fc4_weatherMorning bedeckt
2015-03-22 17:58:58 fc4_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t5.gif
2015-03-22 17:58:58 fc4_weatherNight wolkig
2015-03-22 17:58:58 fc4_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n3.gif
2015-03-22 17:58:58 fc5_chOfRain00 5
2015-03-22 17:58:58 fc5_chOfRain03 10
2015-03-22 17:58:58 fc5_chOfRain06 15
2015-03-22 17:58:58 fc5_chOfRain09 15
2015-03-22 17:58:58 fc5_chOfRain12 10
2015-03-22 17:58:58 fc5_chOfRain15 10
2015-03-22 17:58:58 fc5_chOfRain18 10
2015-03-22 17:58:58 fc5_chOfRain21 15
2015-03-22 17:58:58 fc5_chOfRainDay 15
2015-03-22 17:58:58 fc5_chOfRainNight 80
2015-03-22 17:58:58 fc5_cloud00 12.5
2015-03-22 17:58:58 fc5_cloud03 50
2015-03-22 17:58:58 fc5_cloud06 75
2015-03-22 17:58:58 fc5_cloud09 75
2015-03-22 17:58:58 fc5_cloud12 62.5
2015-03-22 17:58:58 fc5_cloud15 62.5
2015-03-22 17:58:58 fc5_cloud18 50
2015-03-22 17:58:58 fc5_cloud21 87.5
2015-03-22 17:58:58 fc5_date 27.03.2015
2015-03-22 17:58:58 fc5_dew 0
2015-03-22 17:58:58 fc5_evapor 1
2015-03-22 17:58:58 fc5_frost 0
2015-03-22 17:58:58 fc5_moonRise 10:56
2015-03-22 17:58:58 fc5_moonSet 01:54
2015-03-22 17:58:58 fc5_rad 4.3
2015-03-22 17:58:58 fc5_rain00 0
2015-03-22 17:58:58 fc5_rain03 0
2015-03-22 17:58:58 fc5_rain06 0
2015-03-22 17:58:58 fc5_rain09 0
2015-03-22 17:58:58 fc5_rain12 0
2015-03-22 17:58:58 fc5_rain15 0
2015-03-22 17:58:58 fc5_rain18 0
2015-03-22 17:58:58 fc5_rain21 0
2015-03-22 17:58:58 fc5_sun 25
2015-03-22 17:58:58 fc5_temp00 3
2015-03-22 17:58:58 fc5_temp03 3
2015-03-22 17:58:58 fc5_temp06 3
2015-03-22 17:58:58 fc5_temp09 8
2015-03-22 17:58:58 fc5_temp12 11
2015-03-22 17:58:58 fc5_temp15 11
2015-03-22 17:58:58 fc5_temp18 6
2015-03-22 17:58:58 fc5_temp21 6
2015-03-22 17:58:58 fc5_tempMax 11
2015-03-22 17:58:58 fc5_tempMin 2
2015-03-22 17:58:58 fc5_uv 3
2015-03-22 17:58:58 fc5_weatherDay stark bewoelkt
2015-03-22 17:58:58 fc5_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t4.gif
2015-03-22 17:58:58 fc5_weatherEvening wolkig
2015-03-22 17:58:58 fc5_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n3.gif
2015-03-22 17:58:58 fc5_weatherMorning stark bewoelkt
2015-03-22 17:58:58 fc5_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t4.gif
2015-03-22 17:58:58 fc5_weatherNight Regen
2015-03-22 17:58:58 fc5_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n7.gif
2015-03-22 17:58:58 fc6_chOfRain00 20
2015-03-22 17:58:58 fc6_chOfRain03 80
2015-03-22 17:58:58 fc6_chOfRain06 20
2015-03-22 17:58:58 fc6_chOfRain09 20
2015-03-22 17:58:58 fc6_chOfRain12 20
2015-03-22 17:58:58 fc6_chOfRain15 20
2015-03-22 17:58:58 fc6_chOfRain18 20
2015-03-22 17:58:58 fc6_chOfRain21 20
2015-03-22 17:58:58 fc6_chOfRainDay 20
2015-03-22 17:58:58 fc6_chOfRainNight 20
2015-03-22 17:58:58 fc6_cloud00 87.5
2015-03-22 17:58:58 fc6_cloud03 100
2015-03-22 17:58:58 fc6_cloud06 100
2015-03-22 17:58:58 fc6_cloud09 100
2015-03-22 17:58:58 fc6_cloud12 100
2015-03-22 17:58:58 fc6_cloud15 100
2015-03-22 17:58:58 fc6_cloud18 100
2015-03-22 17:58:58 fc6_cloud21 100
2015-03-22 17:58:58 fc6_date 28.03.2015
2015-03-22 17:58:58 fc6_dew 0
2015-03-22 17:58:58 fc6_evapor 1
2015-03-22 17:58:58 fc6_frost 0
2015-03-22 17:58:58 fc6_moonRise 11:53
2015-03-22 17:58:58 fc6_moonSet 02:38
2015-03-22 17:58:58 fc6_rad 0.9
2015-03-22 17:58:58 fc6_rain00 0.2
2015-03-22 17:58:58 fc6_rain03 3.2
2015-03-22 17:58:58 fc6_rain06 0
2015-03-22 17:58:58 fc6_rain09 0
2015-03-22 17:58:58 fc6_rain12 0
2015-03-22 17:58:58 fc6_rain15 0
2015-03-22 17:58:58 fc6_rain18 0
2015-03-22 17:58:58 fc6_rain21 0
2015-03-22 17:58:58 fc6_sun 5
2015-03-22 17:58:58 fc6_temp00 6
2015-03-22 17:58:58 fc6_temp03 6
2015-03-22 17:58:58 fc6_temp06 8
2015-03-22 17:58:58 fc6_temp09 7
2015-03-22 17:58:58 fc6_temp12 7
2015-03-22 17:58:58 fc6_temp15 7
2015-03-22 17:58:58 fc6_temp18 6
2015-03-22 17:58:58 fc6_temp21 5
2015-03-22 17:58:58 fc6_tempMax 9
2015-03-22 17:58:58 fc6_tempMin 5
2015-03-22 17:58:58 fc6_uv 1
2015-03-22 17:58:58 fc6_weatherDay bedeckt
2015-03-22 17:58:58 fc6_weatherDayIcon http://www.proplanta.de/wetterdaten/images/symbole/t5.gif
2015-03-22 17:58:58 fc6_weatherEvening bedeckt
2015-03-22 17:58:58 fc6_weatherEveningIcon http://www.proplanta.de/wetterdaten/images/symbole/n5.gif
2015-03-22 17:58:58 fc6_weatherMorning bedeckt
2015-03-22 17:58:58 fc6_weatherMorningIcon http://www.proplanta.de/wetterdaten/images/symbole/t5.gif
2015-03-22 17:58:58 fc6_weatherNight bedeckt
2015-03-22 17:58:58 fc6_weatherNightIcon http://www.proplanta.de/wetterdaten/images/symbole/n5.gif
2015-03-22 17:58:58 fc7_date 29.03.2015
2015-03-22 17:58:58 fc7_moonRise 13:53
2015-03-22 17:58:58 fc7_moonSet 04:16
2015-03-22 17:58:58 fc7_tempMax 9
2015-03-22 17:58:58 fc7_tempMin 3
2015-03-22 17:58:58 fc7_weather Regen
2015-03-22 17:58:58 fc7_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t7.gif
2015-03-22 17:58:58 fc8_date 30.03.2015
2015-03-22 17:58:58 fc8_moonRise 14:54
2015-03-22 17:58:58 fc8_moonSet 04:47
2015-03-22 17:58:58 fc8_tempMax 9
2015-03-22 17:58:58 fc8_tempMin 3
2015-03-22 17:58:58 fc8_weather Regen
2015-03-22 17:58:58 fc8_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t7.gif
2015-03-22 17:58:58 fc9_date 31.03.2015
2015-03-22 17:58:58 fc9_moonRise 15:56
2015-03-22 17:58:58 fc9_moonSet 05:15
2015-03-22 17:58:58 fc9_tempMax 8
2015-03-22 17:58:58 fc9_tempMin 2
2015-03-22 17:58:58 fc9_weather Regen
2015-03-22 17:58:58 fc9_weatherIcon http://www.proplanta.de/wetterdaten/images/symbole/t7.gif
2015-03-22 17:58:58 humidity 40.6
2015-03-22 17:58:58 lastConnection 430 values captured in 11.91 s
2015-03-22 17:58:58 obs_time 17:00
2015-03-22 17:58:58 pressure 1025.5
2015-03-22 17:58:58 state Tmin: -2 Tmax: 7 T: 5.5 H: 40.6 W: 14.4 P: 1025.5
2015-03-22 17:58:58 temperature 5.5
2015-03-22 17:58:58 visibility 40
2015-03-22 17:58:58 wind 14.4
Fhem:
LOCAL 0
modulVersion $Date: 2015-03-03 20:29:40 +0100 (Tue, 03 Mar 2015) $
Helper:
Attributes:
Zitat von: setstate am 22 März 2015, 15:06:48
Hast du wirklich überall 10° eingestellt, oder ist das noch ein Bug?
... und vielen Dank fürs Feedback an alle!
Nein nicht wundern ist kein Bug. Habe bisher nur 1 Thermostat was ich wahrscheinlich wieder austausche (werde mal PRT-TS testen) und mit 10°C springt die Heizung sicher nicht an :)
Zitat von: jehu am 22 März 2015, 17:29:18
Hallo,
ich nutze zur Wettervorhersage hier das Modul PROPLANTA. Damit kann ich mit dem widget-type "label" auch gut alle Werte anzeigen lassen.
Nun würde ich aber gern noch das entsprechende Wettericon anzeigen. Die entsprechende URL steht in Readings fc0_weatherDayIcon.
folgender Code zeigt auch richtigerweise die URL an:
<div type="label" device="Wetter1" data-get="fc0_weatherDayIcon"></div>
Nur fehlt mir die richtige Idee/Erfahrung wie ich das dann entsprechend in ein IMG-Tag einbinde.
Hat jemand eine Idee für mich?
Schöne Grüße
Jens
die erste Version des Image-Widgets ist verfügbar. Und so baut man es ein:
<div data-type="image" data-device="Wetter1" data-get="fc0_weatherDayIcon" data-size="40px" class="cell"></div>Das Icon-Theme von proplanta ist leider für ein helles Schema gedacht, deshalb habe ich einfach mal eine Transparenz von 80% fest hinterlegt. Das können wir später noch optimieren ...
zeig mal ein Bildschirmfoto, bitte.
Hallo Mario,
klasse, du bist ja schnell :)
Du hast recht. Die Icons sind noch nicht so richtig ideal. Die passen nicht richtig zum klaren Design von FHEM UI Tablet aber die Möglichkeiten sind großartig...
Hier ein UI-Bildausschnitt....
[img=http://s9.postimg.org/hfesutyjf/Wetter.jpg] (http://postimg.org/image/hfesutyjf/)
Schöne Grüße
Jens
mmmm. kann man nicht "MeinWetter" integrieren. Die Icons passen meiner Ansicht nach besser zum UI.
Ps: .... das Modul ist WEATHER
Hallo Wetterfans,
ich habe was gefunden bei http://www.alessioatzeni.com/meteocons/ (http://www.alessioatzeni.com/meteocons/) 40 free Meteocons, echt cool.
Die habe ich schon fast fertig eingebaut, weiß nur noch nicht genau, wie ich die Ansteuerung genau gestalte. Nutzen die meisten PROPLANTA? Ich müsste ein festes Mapping von den Wetterbezeichnungen zu dem Meteocons-Font hinterlegen. So was wie: "stark bewoelkt"="N"
Hi bjoernbo,
bezüglich der Icons hast du absolut recht. Am liesten wäre mir das Design deines Icons (ein paar Seiten vorher) :)
Ich mag Proplanta, weil es sehr detailliert ist (3 Stunden-Wetter).
Bei "Mein Wetter" werden außerdem keine URLs der ICONS sondern nur die ICONnamen in den Readings geliefert.
Schöne Grüße
Jens
Hi Mario,
jupp, genau die Icons. Die sind super passend *Daumen hoch*
Grüße
Jens
Teste gerade das Dimmer Widget. Am PC lässt es sich mit der Maus gut bedienen, am Tablet ist das Ein- und Ausschalten nicht möglich, beim Antippen wird immer nur der Level verändert. Ist das bei euch auch so?
Gruß
Luigi
Hallo,
nach dem Update auf die neueste Version habe ich das Problem, dass ich das Homematic Heizungsthermostat nach einem Reload der Seite erst bedienen kann, wenn ich einen Schalter, der zum Beispiel ein Licht ein- oder ausschaltet, betätigt habe oder wenn ich einfach ca. 1 min warte. Erst danach werden die Befehle zum Thermostat gesendet.
Dieses Verhalten hatte ich schon einmal
http://forum.fhem.de/index.php/topic,34233.msg273832.html#msg273832 (http://forum.fhem.de/index.php/topic,34233.msg273832.html#msg273832)
und konnte es so lösen:
http://forum.fhem.de/index.php/topic,34233.msg273843.html#msg273843 (http://forum.fhem.de/index.php/topic,34233.msg273843.html#msg273843)
Nun komme ich aber nicht weiter.
Die Konsole gibt Folgendes aus:
"Plugin dir: /fhem/tablet/js" fhem-tablet-ui.js:66:0
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.min.js:4:0
"Loaded plugin: widget_switch" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_label" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_dimmer" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_thermostat" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_contact" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_homestatus" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_push" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_volume" fhem-tablet-ui.js:38:0
"Loaded plugin: widget_slider" fhem-tablet-ui.js:38:0
"start longpoll" fhem-tablet-ui.js:189:0
"thermo dev:* par:* change:clima.desired" jquery.min.js line 2 > eval:208:0
"thermo dev:* par:* change:clima.temp" jquery.min.js line 2 > eval:215:0
"thermo dev:* par:* change:clima.valve" jquery.min.js line 2 > eval:222:0
TypeError: elem is undefined jquery.min.js line 2 > eval:66:2
Nach einiger Zeit, auch ohne weitere Aktionen im UI, kommt in der Konsole:
"start longpoll" fhem-tablet-ui.js:189:0
"2015-03-22 23:24:34 / heiz_Term_Bad / ValvePosition / 0" fhem-tablet-ui.js:255:0
"update done for device:heiz_Term_Bad parameter:ValvePosition" fhem-tablet-ui.js:154:10
"2015-03-22 23:24:34 / heiz_Term_Bad / desired-temp / 13.0" fhem-tablet-ui.js:255:0
"update done for device:heiz_Term_Bad parameter:desired-temp" fhem-tablet-ui.js:154:10
"2015-03-22 23:24:34 / heiz_Term_Bad / measured-temp / 20.6" fhem-tablet-ui.js:255:0
"update done for device:heiz_Term_Bad parameter:measured-temp" fhem-tablet-ui.js:154:10
"2015-03-22 23:24:34 / heiz_Term_Bad / STATE / T: 20.6 desired: 13.0 valve: 0" fhem-tablet-ui.js:255:0
"update done for device:heiz_Term_Bad parameter:STATE" fhem-tablet-ui.js:154:10
"start longpoll"
Und dann funktioniert das Thermostat.
Irgendwie wird beim Reload der Seite kein Update ausgeführt.
Liegt es an dieser Meldung?
TypeError: elem is undefined jquery.min.js line 2 > eval:66:2
Was kann ich tun?
Danke im Voraus.
Gruß,
onkeltom
Hallo onkeltom,
das sieht nicht gut aus. Bitte lade alle widgets noch mal neu von github, ich hab gerade etwas aufgeräumt im Code.
Ciao
Mario
Zitat von: jehu am 22 März 2015, 22:31:44
Hi Mario,
jupp, genau die Icons. Die sind super passend *Daumen hoch*
Grüße
Jens
Okay, die METEOCONS sind jetzt mit dabei. Benutzen kann man sie mit dem Label-Widget. Etwa so:
<div data-type="label" data-device="dummy1" data-get="fc0_weatherDay" class="cell weather"></div>Entscheidend ist die Klasse weather, die muss dabei sein.
Folgende Werte werden zur Zeit folgenden Icons zugeordnet:
heiter":"H","wolkig":"N","Regenschauer":"Q","stark bewoelkt":"Y","Regen":"R","bedeckt":"N","sonnig":"B","Schnee":"U"
Wenn was fehlt, gebt bitte Bescheid, dann ergänzen wir das bei der Zuordnung.
Das Icon wird auch größer, wenn man noch zusätzlich die Klassen 'big' oder 'bigger' hinzufügt.
class="cell weather bigger" Man kann das Icon auch statisch anzeigen lassen, oder einfach nur testen ob der Meteocons Font funktioniert, mit:
<div data-type="label" data-icon="N" class="cell weather big"></div>Viel Spaß damit ...
Zitat von: bjoernbo am 21 März 2015, 12:21:34
@nesges
in Beitrag #164 hast du etwas gepostet. Wenn ich das richtig verstehe kann ich damit Farben für eine Lampe bestimmten? Ich habe mir heute OSRAM Lightyfi zugelegt. funzt klasse. Nun will ich das im UI integrieren und dabei ist mir dein Post aufgefallen.
Sind deine Änderungen im JS schon im Standard übernommen? Kann ich damit wohl auch die OSRAM Lampen steuern??
Ich
Danke & Gruß
Ich werde doch heute mal versuchen, das Volume Widget für HUE zu erweitern. Ich werde verschiedene Modi für die Farbvisualisierung anbieten: gesamter background zeigt die Farbe, nur der Handle zeigt die Farbe oder der Background zeigt den ganzen Farbraum 0-360 an.
Das wäre Klasse! Ich meine das OSRAM lightify setzt ja auf HUE auf. So hatte ich das mal in einem anderen Beitrag gelesen.
Da ist man mal ein paar Tage nicht da... Hört sich alles sehr gut an! Ich hoffe, ich komm heute abend dazu die neue Version zu übernehmen und damit zu spielen :)
Hallo Mario,
klasse, das Label-Widget mit den METEOCONS-Icons probiere ich heute Abend.
Grüße
Jens
Zitat von: setstate am 22 März 2015, 23:50:49
Hallo onkeltom,
das sieht nicht gut aus. Bitte lade alle widgets noch mal neu von github, ich hab gerade etwas aufgeräumt im Code.
Ciao
Mario
Hallo Mario,
klasse, vielen Dank. Jetzt funktioniert's.
Gruß,
onkeltom
Hallo Mario,
Tolle Arbeit. Die Wettericon sehen toll in der Oberfläche aus und das Label-Widget funktioniert tadellos.
So langsam wächst mein UI.Ich bin total begeistert.
Wäre es evtl. noch möglich Möglichkeit zum kürzen von Textfeldern vorzusehen ?
Dann könnte ich das Datum und die Uhrzeit in meinem Kalender auf TT.MM oder HH:MM kürzen.
Dabei würde es ja reichen wenn man die Felder einfach auf x-Zeichen abschneidet. In meinem Fall auf 5 Zeichen.
Meinst Du das wäre möglich ?
Schöne Grüße
Jens
JEHU ! WOHER KOMMT DER KALENDER ??? DEN WILL ICH AUCH ;D
Du hast in FHEM als Wetter PROPLANTA, richtig? Wie kann ich das einbinden?
Hi bjoernbo,
Die Daten kommen aus CALVIEW Modul, welches ich dann ala nesges-Callview in einer Tabelle per Label-Widget darstelle.
Was noch fehlt ist die css-Anpassung dazu und die Anpassung der Uhrzeiten/Datum (Code siehe unten)
Infos zu PROPLANTA: http://fhem.de/commandref_DE.html#PROPLANTA (http://fhem.de/commandref_DE.html#PROPLANTA)
Irgendwie habe ich immer mehr Lust mich intensiver mit JS zu beschäftigen. Hat jemand ein gutes Einsteiger-TODO?
Grüße
Jens
<li data-row="2" data-col="6" data-sizex="4" data-sizey="2">
<header>KALENDER</header>
<table class="calls" width="100%">
<tr>
<td>
<div type="label" device="myView" data-get="t_001_bdate"></div>
<!--<div type="label" device="myView" data-get="t_001_edate"></div>-->
</td>
<td>
<div type="label" device="myView" data-get="t_001_btime"></div>
<!--<div type="label" device="myView" data-get="t_001_etime"></div>-->
</td>
<td class="r"><div type="label" device="myView" data-get="t_001_summary" style="font-size:large;color:#aa6900;"></div></td>
</tr>
<tr>
<td>
<div type="label" device="myView" data-get="t_002_bdate"></div>
<!--<div type="label" device="myView" data-get="t_002_edate"></div>-->
</td>
<td>
<div type="label" device="myView" data-get="t_002_btime"></div>
<!--<div type="label" device="myView" data-get="t_002_etime"></div>-->
</td>
<td class="r"><div type="label" device="myView" data-get="t_002_summary" style="font-size:large;color:#aa6900;"></div></td>
</tr>
<tr>
<td>
<div type="label" device="myView" data-get="t_003_bdate"></div>
<!--<div type="label" device="myView" data-get="t_003_edate"></div>-->
</td>
<td>
<div type="label" device="myView" data-get="t_003_btime"></div>
<!--<div type="label" device="myView" data-get="t_003_etime"></div>-->
</td>
<td class="r"><div type="label" device="myView" data-get="t_003_summary" style="font-size:large;color:#aa6900;"></div></td>
</tr>
<tr>
<td>
<div type="label" device="myView" data-get="t_004_bdate"></div>
<!--<div type="label" device="myView" data-get="t_004_edate"></div>-->
</td>
<td>
<div type="label" device="myView" data-get="t_004_btime"></div>
<!--<div type="label" device="myView" data-get="t_004_etime"></div>-->
</td>
<td class="r"><div type="label" device="myView" data-get="t_004_summary" style="font-size:large;color:#aa6900;"></div></td>
</tr>
<tr>
<td>
<div type="label" device="myView" data-get="t_005_bdate"></div>
<!--<div type="label" device="myView" data-get="t_005_edate"></div>-->
</td>
<td>
<div type="label" device="myView" data-get="t_005_btime"></div>
<!--<div type="label" device="myView" data-get="t_005_etime"></div>-->
</td>
<td class="r"><div type="label" device="myView" data-get="t_005_summary" style="font-size:large;color:#aa6900;"></div></td>
</tr>
[...]
</table>
</li>
ok thx, das mit dem Wetter hat sich erübrigt, habe ich jetzt auch hinbekommen.
Danke
Du willst ein Einsteiger ToDo?, ok....
Ich frage alle 5 Minuten diverse IP-Adressen ab und lasse mir anzeigen ob die Geräte erreichbar sind und lasse dies über ein Icon anzeigen.
Anbei der Code aus FHEM:
Zitat#CAM Ben 5 min
define CAM_Ben PRESENCE lan-ping xxx.xxx.xxx.xxx 300
attr CAM_Ben alias Ben
attr CAM_Ben devStateIcon ONLINE:WLAN_Status.1 OFFLINE:WLAN_Status.0
attr CAM_Ben eventMap present:ONLINE absent:OFFLINE
attr CAM_Ben group Status
attr CAM_Ben icon it_camera
attr CAM_Ben room Status
Zitat von: jehu am 23 März 2015, 20:37:00
Irgendwie habe ich immer mehr Lust mich intensiver mit JS zu beschäftigen. Hat jemand ein gutes Einsteiger-TODO?
Hallo jehu,
ich habe Javascript erst durch jQuery lieben gelernt. Macht so vieles einfacher und man kann sich auf das konzentrieren, was man erreichen will.
http://jquery.com/ (http://jquery.com/)
http://learn.jquery.com/ (http://learn.jquery.com/)
"Wer hat an der Uhr gedreht ..."
Wer Interesse hat ..... :-D
Zitat<li data-row="5" data-col="5" data-size="2" data-sizey="1">
<div style="text-align:center;width:350px;padding:0.5em 0;"> <h2><a style="text-decoration:none;" href="http://www.zeitverschiebung.net/de/city/2947416"></h2> <iframe src="http://www.zeitverschiebung.net/clock-widget-iframe?language=de&timezone=Europe%2FBerlin" width="100%" height="130" frameborder="0" seamless></iframe>
</div>
</li>
ihr müsst nur data-row und data-col für eure Bedürfnisse anpassen
Großes Lob @setstate, die Umstellung auf die neue Version hat keinerlei Probleme bereitet - abgesehen von denen, die ich mir selber eingebaut hatte natürlich ;)
Ich hab dann auch gleichmal ausprobiert ein Widget zu schreiben. "klimatrend" wandelt Daten aus dem statistics-Modul (http://fhem.de/commandref.html#statistics) in einen Pfeil um, der den aktuellen Trend anzeigt. Steigender Wert: Pfeil nach oben; Fallender Wert: Pfeil nach unten. Dazu noch farbcodiert und mit Extra-Icon versehene Marken für steile Bewegungen im Trend. Das Bild im Anhang sagt wahrscheinlich mehr als tausend Worte.
Voraussetzung: statistics Modul
define STATISTICS statistics W_HUMID
attr STATISTICS ignoreDefaultAssignments 1
attr STATISTICS tendencyReadings temperature,humidity
Dadurch werden u.a. Readings in folgender Form erzeugt (die einzelnen Werte stehen natürlich erst nach Ablauf der Zeiten zur Verfügung):
statTemperatureTendency 1h: +1.3 2h: +0.3 3h: +0.1 6h: +1.4
statHumidityTendency 1h: +1 2h: -2 3h: -1 6h: -1
HTML-Code:
<div data-type="klimatrend" data-device="W_HUMID" data-get="statTemperatureTendency"></div>
Dadurch wird (mit den Beispieldaten) ein leuchtend roter Doppelpfeil nach oben erzeugt, der einen steilen Anstieg der Temperatur in der letzten Stunde symbolisiert. Ein vollständiger HTML-Code mit allen möglichen Attributen:
<div data-type="klimatrend"
data-device="W_HUMID"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
></div>
device: Name eines Devices mit statistics-Werten. Kein Default.
get: Name des Readings mit statistics-Werten. Default ist "statTemperatureTendency" (funktioniert nur bedingt, s.u.)
refperiod: Referenzzeitraum mit dem der aktuelle Wert verglichen werden soll. statistics liefert die Werte für 1h, 2h, 3h und 6h. refperiod wird entsprechend mit 1,2,3,6 angegeben. Alternativ kann auch data-part 2,4,6,8 verwendet werden. Default ist 1
stagnating-color: Farbcode für unveränderten Wert. Default ist rgb(80,80,80)
icon: Font-Awesome-Icon das zur Darstellung benutzt werden soll. Default ist: "fa-angle"
rising-color: Farbcode für ansteigenden Trend. Default ist rgb(180,80,80)
falling-color: Farbcode für fallenden Trend. Default ist rgb(80,80,180)
highmark: Wertunterschied ab der der Trend als "steil" gilt und entsprechend gekennzeichnet ist. Default ist "1" für Temperaturwerte und "5" für Humidity-Werte.
highmark-icon: Font-Awesome-Icon das zur Darstellung oberhalb der highmark benutzt werden soll. Default ist: "fa-angle-double"
highmark-rising-color: Farbcode für steil ansteigenden Trend. Default ist rgb(255,80,80)
highmark-falling-color: Farbcode für steil fallenden Trend. Default ist rgb(80,80,255)
Auf ein Problem bin ich dabei gestoßen: Die Standardbelegung für data-get funktioniert nur, wenn ein gleichnamiges Reading auch einmal explizit im HTML-Code notiert wird. Verantwortlich dafür dürfte fhem-tablet-ui.js Zeile 104ff sein. Eine Lösung dafür ist mir jetzt allerdings auch nicht eingefallen. Ansonsten ist das Widget-Schreiben eine Freude! :)
Zusatzfrage für Javascript-Erfahrenere: Wäre es möglich die Standardwidgets zu vererben? Meine Versuche mit widget_klimatrend.prototype=new widget_label() scheiterten im Endeffekt daran, dass ich nicht wusste, wie ich die init-Funktion überschreiben kann. Im Endeffekt war's für dieses Widget aber auch egal, da's ohnehin nichts mehr mit dem label-Widget zu tun hat.
PS: Der Code für's Widget ist auch auf github - https://github.com/nesges/Widgets-for-fhem-tablet-ui
Hallo nesges, herzlich willkommen zurück :-)
Das ist ja Wahnsinn, gleich am Anfang so eine coole Granate vor dir. Sieht sehr gut und super dokumentiert. Weiter so!!
Kannst du aber bitte noch ein Beispiel für eine Minimal-Variante für den HTML-Code hinzufügen? Also was muss ein User einfügen, um das Widget im 'FHEM Tablet UI'-Standard-Style zu bekommen, ohne von den vielen Parametern erschlagen zu werden. Ich versuche per Class-Attribut ein paar einfache Presets anzubieten, so was wie dunkel, hell, big, small. Das ist für erste Individualisierung gedacht, die anderen data-Attribute sind dann was für Profis.
Mit dem Volume Widget mache ich es auch gerade so. Man muss dann einfach nur eine zusätzliche Class 'hue-back' oder 'hue-tick' oder 'hue-front' hinzufügen, um eine andere Variante zu bekommen. Im Code frage ich per .hasClass() ab, und switche die entsprechenden Stellen um.
Aber ich bin nicht so schnell wie du :-( Ist noch nicht fertig. Ist eben kontra-produktiv, wenn man nebenbei fernsieht...
Vielen Dank
setstate
update:ich sehe gerade, die Minimal Konfuguration ist doch schon dabei, sorry, habe ich vorhin übersehen. Evtl. noch das data-get mit rein. Dann ist es schön ;-)
Zitat von: jehu am 23 März 2015, 19:11:31
Hallo Mario,
Tolle Arbeit. Die Wettericon sehen toll in der Oberfläche aus und das Label-Widget funktioniert tadellos.
So langsam wächst mein UI.Ich bin total begeistert.
Wäre es evtl. noch möglich Möglichkeit zum kürzen von Textfeldern vorzusehen ?
Dann könnte ich das Datum und die Uhrzeit in meinem Kalender auf TT.MM oder HH:MM kürzen.
Dabei würde es ja reichen wenn man die Felder einfach auf x-Zeichen abschneidet. In meinem Fall auf 5 Zeichen.
Meinst Du das wäre möglich ?
Schöne Grüße
Jens
Sehr, sehr schön!
Ja, Label kürzen baue ich noch ein. Ich bin nur am grübeln. Ich wäre in 2 Minuten fertig, wenn ich dir den RegEx zum Festlegen als Data-Parameter nach außen gebe. Aber das ist ganz schön technisch. Man könnte auch den data-part Teil aufbohren und mit Trenner und Anzahl Angabe etwas bereitstellen. Überlege ich mir noch im Laufe des Tages.
Auch beim Label grüble ich schon seit gestern, ob es nicht schöner wäre, ein eigenes Wetter-Widgets draus zu machen und noch Temperatur und Zeitpunkt zusätzlich daneben anzuzeigen. Das nimmt natürlich die individuelle Gestaltungsmöglichkeit, aber das Label wäre sauber "nur Text". Was sagt ihr dazu?
Zitat von: setstate am 24 März 2015, 01:01:20
Evtl. noch das data-get mit rein. Dann ist es schön ;-)
Hab's mit rein genommen, wobei ich's schön fände da auch nen Default vergeben zu können. Glaubst du das wäre sinnvoll lösbar? "sinnvoll" = nicht zuviel Aufwand, weil wirklich wichtig ist's nicht. Klassen für Presets muss ich heute abend mal überlegen, da fällt mir grade nichts ein :)
Hi setstate,
ich fände auch ein Formatieren der Felder mit RegEx gut. Zwar bin ich kein wirklicher RegEx-Experte, aber letzlich muss man sich bei FHEM sowieso damit beschäftigen. Außerdem wäre die Nutzung damit wahrscheinlich flexibler. Ist die Nutzung von RegEx (außer beim switch z.B. bei data-get-on oder -off) jetzt schon möglich?
Bezüglich der Wetter-Widget gebe ich dir insofern recht, das die Ersetzung der Wetter-Condition durch WetterFonts das Label-Widget etwas überfrachtet. Ich selbst bräuchte kein richtiges Wetter-Widget sondern würde auch hier die Flexibilität vorziehen. Für andere Nutzer mag das anders sein, die dann mit fertigen Widget vielleicht schneller eine UI erstellen könnten.
Ideal wäre es sicher (wie von nesges schon erwähnt) die Standard-Widget einfach zu vererben und damit ein auf Wetter-spezialisiertes Label-Widget zu erstellen. Falls das möglich wäre.
Grüße
Jens
Zitat von: nesges am 24 März 2015, 11:25:55
Hab's mit rein genommen, wobei ich's schön fände da auch nen Default vergeben zu können.
Eigentlich war's simpel: Ich setze jetzt in der init-Function
readings[$(this).data('get')] = true;https://github.com/nesges/Widgets-for-fhem-tablet-ui/commit/ccb098670a4a7ae69f4aeb84c208120763b416f8
Hi nesges,
du schreibst
Zitatdefine STATISTICS statistics W_HUMID
Was ist W_HUMID ? Ist W_HUMID z.b. dein Thermostat, aus welchem du deine Werte dann ziehst.
Beduetet wenn ich für 4 Räume die Temperatur und die Luftfeuchte als "Tendenz" anzeigen lassen will
ich "statistics" 4x erzeugen muss; mit den unterschiedlichen "Thermostat-Namen" ?Ne kann ja nicht ::)
Woher weiß statistic welcher Wert zu welchem Raum gehört ?
W_HUMID ist ein Thermostat mit Luftfeuchtigkeitsmesser. In der statistics Definitionwird dem Modul mitgeteilt für welche Devices es Statistiken erzeugen soll:
define STATISTICS statistics .*(HUMID|THERMO)
Erzeugt zB Statistikwerte in allen Devices die auf "HUMID" oder "THERMO" enden. Siehe http://fhem.de/commandref.html#statistics
Hallo,
ich melde mich auch mal wieder kurz zu Wort. Echt saustark, was ihr da gerade macht! Sieht wirklich ganz hervorragend aus. Ich hätte jedoch zwei Bitten/Anfragen:
1. Der HTML-Quelltext ist nicht valide. Es fehlt der Doctype und der Title gehört in den Head-Tag. Das mal am Rande :)
2. Für die Bedieung am PC fänd ich einen Hand-Cursor auf den Knöpfen ganz nett. Sieht man auf Touch-Geräten nicht, aber auf PCs. ein
.cell {
cursor: pointer;
}
würde schon helfen. Mein Angebot steht übrigends. Ich bin - falls es interessiert - Web-Entwickler und kann denke ich in HTML/CSS/JavaScript auch einiges an Arbeit beitragen. Ist ja auch in meinem Interesse :)
Gruß
Björn
Zitat von: nesges am 24 März 2015, 12:41:07
Eigentlich war's simpel: Ich setze jetzt in der init-Function readings[$(this).data('get')] = true;
https://github.com/nesges/Widgets-for-fhem-tablet-ui/commit/ccb098670a4a7ae69f4aeb84c208120763b416f8
so einfach, aber genial !!!
Danke
Zitat von: wex_storm am 24 März 2015, 15:09:07
Hallo,
ich melde mich auch mal wieder kurz zu Wort. Echt saustark, was ihr da gerade macht! Sieht wirklich ganz hervorragend aus. Ich hätte jedoch zwei Bitten/Anfragen:
1. Der HTML-Quelltext ist nicht valide. Es fehlt der Doctype und der Title gehört in den Head-Tag. Das mal am Rande :)
2. Für die Bedieung am PC fänd ich einen Hand-Cursor auf den Knöpfen ganz nett. Sieht man auf Touch-Geräten nicht, aber auf PCs. ein
.cell {
cursor: pointer;
}
würde schon helfen. Mein Angebot steht übrigends. Ich bin - falls es interessiert - Web-Entwickler und kann denke ich in HTML/CSS/JavaScript auch einiges an Arbeit beitragen. Ist ja auch in meinem Interesse :)
Gruß
Björn
Hallo Björn,
danke für dein Lob und die Tipps. Punkt 1 und 2 werde ich gleich beachten. Die HTML Attribute habe ich ja nun auch schon umgestellt, wie du vlt. schon gesehen hast.
Interesse an Mitarbeit auf jeden Fall. Aber in kleinen Schritten, nicht gleich alles umbauen wollen ;) ;D
Ich werde mal bei Github den Issue Tracker anwerfen, für die offenen Punkte und Einfälle. Da kann man sich jeder dann was rauspicken.
Ich hab grade noch ein neues Widget nach https://github.com/nesges/Widgets-for-fhem-tablet-ui geladen. "kodinowplaying" zeigt Informationen zu grade in KODI gespielten Medien in Form eines Labels an. Der Screenshot im Anhang zeigt das Standardformat für TV Serien. Alle einzelnen Felder sind abschaltbar und durch Zuweisung von CSS-Klassen stylebar. Eingebunden wird es mit folgendem HTML-Code:
<div data-type="kodinowplaying" data-device="W_XBMC"></div>
"W_XBMC" ist ein XBMC-Modul (http://fhem.de/commandref.html#XBMC). Um Felder abzuschalten, CSS-Klassen zuzuweisen, Zeitformate einzustellen etc. gibt es jede Menge optionale Attribute. Hier ein Beispiel mit allen:
<div data-type="kodinowplaying"
data-device="W_XBMC"
data-show="yes"
data-season="yes"
data-episode="yes"
data-title="yes"
data-artist="yes"
data-album="yes"
data-time="yes"
data-totaltime="yes"
data-playstatus="yes"
data-class-show=""
data-class-season=""
data-class-episode=""
data-class-title=""
data-class-artist=""
data-class-album=""
data-class-time=""
data-class-totaltime=""
data-class-playstatus=""
data-timeformat="HH:MM:SS"
data-playstatus-pauseonly="yes"
class="titleonly|short|notime"
></div>
Doku zu den einzelnen Attributen unter https://github.com/nesges/Widgets-for-fhem-tablet-ui. Ich habe nicht alle Attribute und Attributskombination ausprobiert (ich brauche selber eigentlich nur den Standardfall). Wenn euch Fehler auffallen bitte melden, danke!
:D du hast es echt drauf !!! Habe zwar auch ein KODI, aber ich finde für meinen Teil keinen Mehrwert darin dies im UI zu integrieren. Noch nicht :-D ! Aber, es gefällt mir trotzdem.
Nabend,
kann mann das Widget "Homestatus" irgendwie auf RESIDENTS und oder ROOMMATE portieren ?
Zitat von: Atze am 24 März 2015, 21:41:07
Nabend,
kann mann das Widget "Homestatus" irgendwie auf RESIDENTS und oder ROOMMATE portieren ?
Dieses Widget wird auch bald flexibler werden: Icons, Werte (z.Zt. 1-4). Aber man kann jetzt schon das Get-Reading und Set-Reading angeben. Was würde noch nicht klappen?
Das Volume-Widget habe ich jetzt dahingehend erweitert, so dass man dies auch ideal als Hue-Dial (Farbton) benutzen kann.
Man braucht dafür nur zusätzliche Klassen angeben, um das Aussehen anzupassen.
Beispiele:
MilightDevice [0-360], kleiner Durchmesser, der eingestellte Farbton wird kpl. als Background angezeigt
<div data-type="volume" data-device='dummy1'
data-min='0'
data-max='360'
data-get='hue'
data-set='hue'
class="cell small hue-back" ></div>
(http://knowthelist.github.io/fhem-tablet-ui/volume_small.png)
HUEDevice [0-65535], kleiner Durchmesser, der eingestellte Farbton wird nur auf dem Handle angezeigt
<div data-type="volume" data-device='dummy1'
data-min='0'
data-max='65535'
data-get='hue'
data-set='hue'
class="cell small hue-front" ></div>
XYZDevice [0-360], großer Durchmesser, der kpl. Farbtonbereich wird als Tick-Ring angezeigt und der eingestellte Farbton wird auf dem Handle angezeigt
<div data-type="volume" data-device='dummy1'
data-min='0'
data-max='360'
data-get='hue'
data-set='hue'
class="cell hue-tick hue-front" ></div>
(http://knowthelist.github.io/fhem-tablet-ui/volume_big.png)
Außerdem haben alle Widgets eine neues optionales Attribute bekommen
data-cmd="" default: 'set'
Damit kann man das primäre Command in Richtung FHEM ändern. Also nicht mehr nur "set <device> <reading> <value>", sondern auch "setreading <device> <reading> <value>" oder "setstate <device> <reading> <value>"
Viele Grüße
Mario
Zitat von: jehu am 23 März 2015, 19:11:31
Hallo Mario,
Tolle Arbeit. Die Wettericon sehen toll in der Oberfläche aus und das Label-Widget funktioniert tadellos.
So langsam wächst mein UI.Ich bin total begeistert.
Wäre es evtl. noch möglich Möglichkeit zum kürzen von Textfeldern vorzusehen ?
Dann könnte ich das Datum und die Uhrzeit in meinem Kalender auf TT.MM oder HH:MM kürzen.
Dabei würde es ja reichen wenn man die Felder einfach auf x-Zeichen abschneidet. In meinem Fall auf 5 Zeichen.
Meinst Du das wäre möglich ?
Schöne Grüße
Jens
Hallo Jens,
das Label-Widget kann man jetzt per RegEx kürzen. Dazu einfach im Attribute data-part den RegEx Ausdruck angeben. Es wird versucht die angegeben Gruppen herauszuholen. Gruppen markiert man per runder Klammer, es kann mehr als eine Gruppe angegeben werden.
Beispiel Datum kurz: 25.03.
<div data-type="label" data-device="dummy1" data-part="(\d\d\.\d\d\.).*" class="cell"></div> Wenn man data-part="8" angibt, wird wie weiterhin ohne RegEx der 8. Teil leerzeichengetrennt geholt.
Zitat von: bjoernbo am 23 März 2015, 21:03:26
Du willst ein Einsteiger ToDo?, ok....
Ich frage alle 5 Minuten diverse IP-Adressen ab und lasse mir anzeigen ob die Geräte erreichbar sind und lasse dies über ein Icon anzeigen.
Anbei der Code aus FHEM:
Ich würde das so bauen:
<div data-type="contact" data-device="dummy1" data-icon="fa-wifi" data-on-color="#32a054" data-get-on="ONLINE" data-get-off="OFFLINE" class="narrow"></div>
<div data-type="label" class="narrow darker small">NETWORK</div>Ich merke gerade, ich muss die Doku erweitern. Ist noch vieles im Verborgenen :-)
Zitat von: setstate am 25 März 2015, 08:09:29
Ich würde das so bauen:
<div data-type="contact" data-device="dummy1" data-icon="fa-wifi" data-on-color="#33dd22" data-get-on="ONLINE" data-get-on="OFFLINE" class="narrow"></div>
<div data-type="label" class="narrow darker small">NETWORK</div>
Wo ich das gerade lese...
Ich habe mal letzte Woche mal folgendes gefragt:
Zitat von: dancatt am 18 März 2015, 20:57:53
2.
Ist es möglich ein Icon anzuzeigen welches nicht anklickbar ist? Z.B. das PRESENCE Modul. Wenn absent dann Icon im Normalzustand, wenn present dann Icon farbig. Oder z.B. um anzuzeigen ob ein Rauchmelder aktiv ist.
Wenn ich das richtig verstehe kann man das ja mit dem "contact"-Widget realisieren, oder? Ein Icon, 2 Zustände?
Schön wärs nun wenn man pro Zustand ein Icon und eine Farbe angeben könnte (der Name "contact" ist nicht passend):
<div
data-type='contact'
data-device='carType'
data-get='state'
data-get-on='[Car,Bus,Ambulance]'
data-icons='[fa-car,fa-bus,fa-ambulance]'
data-colors='["#FF0000","#00FF00","#0000FF"]'
class="cell big">
</div>
Fhem:
define carType dummy
attr setList state:Car,Bus,Ambulance
Gruß Daniel
Kurz gefasst: Geil! ;)
Vielen Dank für die Mühe, mir gefällt das Interface - obwohl wir (noch) kein Tablet haben - sehr gut.
Was ich nicht ganz verstehe, hat die Möglichkeit, die einzelnen Elemente hin und her zuschieben auch eine Wirkung? oder ist das einfach nur zum temporären ändern gedacht?
@setstate: Werde ich heute Abend sofort umsetzten. DANKE
Anbei: Das Volume-Widget für HUE ist schon im JS auf GitHub vorhanden? Ich würde dann probieren, ob es mit lightify funktioniert.
sehe gerade es läuft schon ... !
Habe das Attribut
Zitatdata-off-color="FF4040"
eingefügt :-D
(//)
Zitat<div data-type="contact" data-device="CAM_Ben" data-icon="fa-video-camera" data-on-color="#33dd22" data-get-on="ONLINE" data-off-color="FF4040" data-get-off="OFFLINE" class="narrow"></div>
<div data-type="label" class="narrow darker small">Ben</div>
<div data-type="contact" data-device="FritzBox" data-icon="fa-globe" data-on-color="#33dd22" data-get-on="ONLINE" data-off-color="FF4040" data-get-off="OFFLINE" class="narrow"></div>
<div data-type="label" class="narrow darker small">Fritz Box</div>
<div data-type="contact" data-device="Cam_Julia" data-icon="fa-video-camera" data-on-color="#33dd22" data-get-on="ONLINE" data-off-color="FF4040" data-get-off="OFFLINE" class="narrow"></div>
<div data-type="label" class="narrow darker small">Julia</div>
<div data-type="contact" data-device="Cams_Julia" data-icon="fa-video-camera" data-on-color="#33dd22" data-get-on="ONLINE" data-off-color="FF4040" data-get-off="OFFLINE" class="narrow"></div>
<div data-type="label" class="narrow darker small">Test</div>
schick, sehr schick, simpel und mit rückkanal ;D . habe auch noch fronthem im einsatz aber das hier ist wegen der simplen integration (kein extra webserver, nur seite pflegen und nicht noch zich fhem-devices und je fhemdevice nochmal tausende gads, keine festen ip's von nöten usw) doch wahrscheinlich für mich die bessere wahl. weiter so.
ein kleiner wunsch alles in ein GitHub-verzeichnis (oder gleich mit ins fhem update). es sind zwar "nur" 20 seiten aber schon 2(/3) quellen (main von setstate, die von nesges und 1-2 .js als anhang) .
@bjoernbo: und noch schicker wäre es, wenn die Farben nicht ganz so weit aufgedreht sind. :D Maximal A0 bis BB pro Grundfarbe. Dann sieht es nicht so grell aus und passt besser zum Gesamteindruck.
data-on-color="#32a054" data-get-on="ONLINE" data-off-color="bb6242" data-get-off="OFFLINE"
Allen einen schönen Abend
Zitat von: chris1284 am 25 März 2015, 18:00:22
ein kleiner wunsch alles in ein GitHub-verzeichnis (oder gleich mit ins fhem update). es sind zwar "nur" 20 seiten aber schon 2(/3) quellen (main von setstate, die von nesges und 1-2 .js als anhang) .
Da ist was dran. Von mir aus können wir die Projekte mergen, oder gibts auf github Möglichkeiten zwei unabhängige Projekte so zu integrieren, dass die User es wie eines benutzen können? Ich gehe allerdings auch davon aus, dass noch viele spezialisierte Widgets folgen werden - und da werden sicher auch noch mehr Widget-Autoren dazu kommen. Das sollte irgendwie sinnvoll organisiert sein und ich könnte mir vorstellen, dass setstate wenig Lust darauf hat "jedem" Schreibzugriff aufs Hauptrepository zu geben. Von daher würde ein zweites Repository evtl. sogar Sinn machen. Oder kann man einen Branch einzeln Berechtigen? Kenne mich auf github nicht so sehr gut aus. Eine Alternative wäre auch eine einfache Liste von Erweiterungen im Wiki des Hauptrepositories. Meinungen?
Davon abgesehen freu ich mich drauf das Volume- Widget mit HUE Option zu testen. Sehr fein! Werde ich leider frühestens morgen abend zu kommen.
.... ist denn schon das Widget für die HUE Steuerung "Online"?
Habe gerade versucht LIGHTIFY zu integrieren. Ohne Erfolg.
Zitat<div data-type="volume" data-device='4391C90000261884:7778'
data-min='0'
data-max='360'
data-get='LIGHTIFY'
data-set='LIGHTIFY'
class="cell hue-tick hue-front" ></div>
Wobei ich nicht weiß ob das o.g. Device wirklich die Lampe ist, weil ich die Info nur aus dem Logfile habe da in FHEM das nicht so abzulesen ist.
Hallo bjoernbo,
laut FHEM commandref.html#LIGHTIFY ist die Lampe ein HUEDevice. Im Config-File muss was mit HUEDevice stehen:
define bulb HUEDevice 1
Dieses muss dann auch ein Reading namens 'hue' haben, was Werte von 0-65535 annimmt.
Ich kann es leider nicht testen, meine Osram LIGHTIFY ist noch unterwegs. Dann weiß ich bestimmt mehr.
Evtl. beobachte den Event Monitor, wenn du den Farbton änderst. Vlt. erkennt man dann, was gesendet werden muss.
Zitat von: selfarian am 25 März 2015, 14:35:49
Kurz gefasst: Geil! ;)
Vielen Dank für die Mühe, mir gefällt das Interface - obwohl wir (noch) kein Tablet haben - sehr gut.
Was ich nicht ganz verstehe, hat die Möglichkeit, die einzelnen Elemente hin und her zuschieben auch eine Wirkung? oder ist das einfach nur zum temporären ändern gedacht?
Würde mich auch interessieren. Wäre sogar gut wenn man das Drag&Drop der Elemente abschalten kann, da man auf dem Tablet öfters ausversehen die Elemente verschiebt.
Zitat von: schnibberle am 25 März 2015, 21:49:26
Würde mich auch interessieren. Wäre sogar gut wenn man das Drag&Drop der Elemente abschalten kann, da man auf dem Tablet öfters ausversehen die Elemente verschiebt.
Das Verschieben bringt gridster.js automatisch mit. Ich habe es nur nicht ausgeschaltet, weil es bis jetzt nicht gestört hat. Gebraucht wird es aber nicht. Ich habe auch nicht vor, das Feature auszubauen, so was wie verschieben, konfigurieren und speichern.
Ich werde einen Schalter in Form eines Meta Tags zum Fixieren einbauen ...
ein bug im thermostat widget fällt mir auf. ist die desired-temp OFF (man kann einen rt auch auf off stellen) wird im widget 10 angezeigt.
Zitat von: chris1284 am 25 März 2015, 21:58:57
ein bug im thermostat widget fällt mir auf. ist die desired-temp OFF (man kann einen rt auch auf off stellen) wird im widget 10 angezeigt.
okay, das ist mir neu.
Was würdest du erwarten? (0 und kein Handle) oder (keine Zahl und kein Handle)?
@sestate: Dank für den Tipp. Läuft nun. Allerdings nur in dieser Form
Zitat<div data-type="volume" data-device='bulb'
data-min='0'
data-max='65535'
data-get='hue'
data-set='hue'
class="cell hue-front" ></div>
NICHT in DIESER
Zitat<div data-type="volume" data-device='bulb'
data-min='0'
data-max='360'
data-get='hue'
data-set='hue'
class="cell hue-tick hue-front" ></div>
Jetzt fehlt nur noch die Zimmerfunktion, sollte ich aber hinbekommen.
Zitat von: bjoernbo am 25 März 2015, 22:07:36
@sestate: Dank für den Tipp. Läuft nun. Allerdings nur in dieser Form
NICHT in DIESER
Jetzt fehlt nur noch die Zimmerfunktion, sollte ich aber hinbekommen.
Meinst du den Maxwert oder die hue-tick Class? Das sind die Unterschiede, die ich sehe. Maxwert ist bei HUEdevices richtig auf 65535. Ich rechne die Werte für das Widget auf 360 runter und vorm Senden wieder hoch.
Wie sieht das Problem genau aus?
... es lässt sich gar nicht steuern. Wenn ich die Farbe auf grün setzte passiert einfach nichts.
Ich mache eben noch einen Test
so... :-D nochmal getestet ....
verwende ich diesen Code
Zitat<div data-type="volume" data-device='bulb'
data-min='0'
data-max='360'
data-get='hue'
data-set='hue'
class="cell hue-tick hue-front" ></div>
.. egal welche Farbe ich auswähle, immer ROT
Zitat von: setstate am 25 März 2015, 21:57:55
Ich werde einen Schalter in Form eines Meta Tags zum Fixieren einbauen ...
Da die Variable gridster global ist, kann man auch ausserhalb in einem Skript
$(document).ready(function() { gridster.disable() })aufrufen, um das Verschieben zu deaktivieren.
Zitat von: setstate am 25 März 2015, 22:04:36
okay, das ist mir neu.
Was würdest du erwarten? (0 und kein Handle) oder (keine Zahl und kein Handle)?
es gibt mehrere möglichkeiten, je nach dem was besser umsetzbar ist.
"off" ist im rt intern die temperatur 4.5, auf dem display und den readings zeigt er aber off.
es wäre natürlich super wenn das widget "Off" anzeigt, "4.5" würde aber auch gehen (genau so wie "-" oder "--" da man das selbst als off interpretieren könnte. nur 10 ist dann ganz verwirrend
zum schalten würde ich einfach die möglichen werte im widget auf 4.5 bis 30 setzen. wird dann ein set name desired-temp 4.5 gesendet geht der rt auf 0ff
um das noch ein wenig auf die spitze zu treiben: der rt kann auch den wert on als desired-temp bekommen ;D hier weiss ich aber auch nciht was er da intern für eine temp fährt, das kann martin sicher sagen.
ich gehe mal davon aus dass aktuell "off" als falscher wert / nicht numerisch erkannt wird und das widget dann seinen default wert nimmt -> 10.
das macht es auch wenn man den namen des devices falsch schreibt und keine werte kommen. hier sollte man zur besseren fehlerfindung evtl sowas wie n.A. nehmen
Zitat von: bjoernbo am 25 März 2015, 22:22:45
so... :-D nochmal getestet ....
verwende ich diesen Code
.. egal welche Farbe ich auswähle, immer ROT
genau, wie erwartet. Wenn man Werte nur von 0 bis 360 sendet, deckt das nur einen kleinen Teil des erwarteten Ranges für HUEdevices ab . Diese Teile wollen Werte bis 65535.
Dann mach so, wenn du bunt magst und HUEdevices ansprechen willst
<div data-type="volume" data-device='bulb'
data-min='0'
data-max='65535'
data-get='hue'
data-set='hue'
class="cell hue-tick hue-front" ></div> Oder einfach hue-tick unter class weglassen, wenn es etwas dezenter aussehen soll ;-)
Zitat von: dancatt am 25 März 2015, 09:50:40
Wo ich das gerade lese...
Ich habe mal letzte Woche mal folgendes gefragt:Wenn ich das richtig verstehe kann man das ja mit dem "contact"-Widget realisieren, oder? Ein Icon, 2 Zustände?
Schön wärs nun wenn man pro Zustand ein Icon und eine Farbe angeben könnte (der Name "contact" ist nicht passend):
<div
data-type='contact'
data-device='carType'
data-get='state'
data-get-on='[Car,Bus,Ambulance]'
data-icons='[fa-car,fa-bus,fa-ambulance]'
data-colors='["#FF0000","#00FF00","#0000FF"]'
class="cell big">
</div>
Fhem:
define carType dummy
attr setList state:Car,Bus,Ambulance
Gruß Daniel
Hallo Daniel,
danke für den Lösungsansatz, sehr schön. Genauso habe ich es schon begonnen umzusetzen, wird bald verfügbar sein, war gestern Abend nur zu müde ::)
Das widget habe ich auch umbenannt in "symbol", das sollte besser passen für den universellen Einsatz.
Cioa
Mario
Ich habe eine Issue Liste für offene Punkte und Tasks angelegt.
https://github.com/knowthelist/fhem-tablet-ui/issues (https://github.com/knowthelist/fhem-tablet-ui/issues)
Moin,
mir fällt gerade auf, dass seit dem Update auf die neueste Version bei Thermostaten der Unterschied zwischen Soll- und Ist-Temperatur auf dem Skalaring nicht mehr optisch visualisiert wird. An der Datei habe ich nichts geändert, ausser per S&E von type und device auf data-type und data-device umzustellen. Muss da etwas angepasst werden?
Bild und Listing anbei.
Update: Ich muss das nochmal korrigieren/spezifizieren:
Nur beim Laden bzw. beim manuellen Update wird nicht visualisiert. Wenn dann automatisch neue Daten kommen, klappt die Visualisierung.
Kann also sein, dass das auch vorher schon so war und ich es nur nicht wahrgenommen habe?
<li data-row="2" data-col="2" data-sizex="2" data-sizey="1">
<header><a href="http://fhem:8083/fhem?room=_TV-Zimmer">TV-Zimmer</a></header>
<div class="container">
<div class="left">
<div data-type="thermostat" data-device="Heizung_TVZimmer" data-get="desired-temp" data-temp="measured-temp" data-valve="ValvePosition" class="cell left"></div>
<div class="cell narrow">
<div class="left narrow">
<div data-type="label" data-device="CUL_HM_HM_CC_RT_DN_23C6A9" data-get="battery" class="darker narrow"></div>
</div>
<div class="right narrow">
<div data-type="label" data-device="CUL_HM_HM_CC_RT_DN_23C6A9" data-get="batteryLevel" data-unit="V" class="darker narrow"></div>
</div>
</div>
</div>
<div class="right">
<div data-type="label" data-device="Heizung_TVZimmer" data-part="2" data-unit="%B0C%0A" class="cell big"></div>
<div data-type="label" data-device="Heizung_TVZimmer" data-get="ValvePosition" data-fix="0" data-unit="%" class="cell big right"></div>
</div>
</div>
</li>
Ich stelle gerade fest dass das thermostatwidget auch eine desired-temp von 5°C nur als 10 wieder gibt!
Zitat von: chris1284 am 26 März 2015, 08:51:56
Ich stelle gerade fest dass das thermostatwidget auch eine desired-temp von 5°C nur als 10 wieder gibt!
Ich meine, die Thermostaten sind bislang auf einen Bereich von 10-30 Grad fest beschränkt und alles darüber/darunter wird vermutlich entsprechend angepasst.
Ergänzung:
knob_elem.knob({
'min':10,
'max':30,
Hallo Mario,
dass kürzen der Datumswerte und Uhrzeiten per RegEx funktioniert wunderbar.
Super was du hier machst. Großen Dank dafür
Grüße
Jens
Ich habe nochmal eine Frage :-)
Ich hatte den Post mit dem WLAN Stati gesehen und musste den natürlich gleich einbauen. Ich lese das direkt aus der Fritzbox aus und mit dem normalen WLAN funktioniert es, mit dem Gäste WLAN leider nicht. Hier mal der Ausschnitt der index.html:
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#33dd22" data-get-on="WLAN: on.*" data-get-off="WLAN: off.*" class="narrow"></div>
<div data-type="label" class="narrow darker small">WLAN</div>
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#33dd22" data-get="box_guestWlan" class="narrow"></div>
<div data-type="label" class="narrow darker small">Gaeste WLAN</div>
In der Fritzbox finden sich folgende Readings:
STATE WLAN: on gWLAN: on (Remain: -1 min)
den nutze ich für das normale WLAN und:
box_guestWlan on
den ich dann gerne für das Gäste WLAN genommen hätte. Leider klappt das irgendwie nicht. gWLAN bleibt grau.
Hat da jemand eine Idee?
Danke!
Zitat von: selfarian am 26 März 2015, 11:22:55
Ich habe nochmal eine Frage :-)
Ich hatte den Post mit dem WLAN Stati gesehen und musste den natürlich gleich einbauen. Ich lese das direkt aus der Fritzbox aus und mit dem normalen WLAN funktioniert es, mit dem Gäste WLAN leider nicht. Hier mal der Ausschnitt der index.html:
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#33dd22" data-get-on="WLAN: on.*" data-get-off="WLAN: off.*" class="narrow"></div>
<div data-type="label" class="narrow darker small">WLAN</div>
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#33dd22" data-get="box_guestWlan" class="narrow"></div>
<div data-type="label" class="narrow darker small">Gaeste WLAN</div>
In der Fritzbox finden sich folgende Readings:
STATE WLAN: on gWLAN: on (Remain: -1 min)
den nutze ich für das normale WLAN und:
box_guestWlan on
den ich dann gerne für das Gäste WLAN genommen hätte. Leider klappt das irgendwie nicht. gWLAN bleibt grau.
Hat da jemand eine Idee?
Danke!
Da fehlt der get-on get-off Teil für das guess wlan. Probiere mal das (ungetestet)
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#32a054" data-get-on="WLAN: on.*" data-get-off="WLAN: off.*" class="narrow"></div>
<div data-type="label" class="narrow darker small">WLAN</div>
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#32a054" data-get="box_guestWlan" data-get-on=".*gWLAN: on" data-get-off=".*gWLAN: off" class="narrow"></div>
<div data-type="label" class="narrow darker small">Gaeste WLAN</div>
Ok, danke. Also mit etwas probieren hat es jetzt so geklappt:
<div data-type="contact" data-device="FritzBox" data-icon="fa-wifi" data-on-color="#33dd22" data-get-on=".*gWLAN: on.*" data-get-off=".*gWLAN: off.*" class="narrow"></div>
Ich dachte halt, das er, wenn ich data-get auf box_guestWlan setze, das "on" automatisch in den Readings erkennt, steht ja sonst nix drinnen. Aber so über den state geht es auch.
Hallo Mario,
das Design gefällt mir sehr gut - weniger Text und mehr intuitive Symbole. Zwei Fragen hätte ich allerdings:
Man kann die "Kacheln" verschieben. Kann man die neue Anordnung auch speichern? Sonst wäre es ja sinnfrei.
Ist für die Zukunft geplant, Zustandsänderungen auch sofort zu aktualisieren, wie bei FHEMWEB?
Gruß
Damian
Zitat von: Damian am 26 März 2015, 14:51:27
Ist für die Zukunft geplant, Zustandsänderungen auch sofort zu aktualisieren, wie bei FHEMWEB?
macht es doch schon. sobald ich einen zb schalter nicht per fhem schalte, sondern zb direkt per taste bekommt fhem und das tabletui das mit und ändert das symbol. ein rückkanal ist somit wohl schon drin
Zitat von: Damian am 26 März 2015, 14:51:27
Ist für die Zukunft geplant, Zustandsänderungen auch sofort zu aktualisieren, wie bei FHEMWEB?
Hast Du longpoll aktiviert?
<meta name="longpoll" content="1">
Zitat von: Brockmann am 26 März 2015, 15:31:12
Hast Du longpoll aktiviert?
<meta name="longpoll" content="1">
Ich habe es bereits auf 0 gesetzt. Dennoch, empfinde ich 30 Sekunden zu lang auf eine Veränderung eines Zustandes zu warten, wenn man sonst gewohnt ist Änderungen insb. von Lampen oder Schaltern sofort aktualisiert zu bekommen - ist natürlich ein subjektives Empfinden. Auf etwas zu pollen empfinde ich allerdings immer als Notlösung.
Gruß
Damian
es aktualisert sofort den status!
longpol solltest du in fhem auf 1 (attr fhemweb longpoll 1) stehen haben
Zitat von: chris1284 am 26 März 2015, 15:50:01
es aktualisert sofort den status!
longpol solltest du in fhem auf 1 (attr fhemweb longpoll 1) stehen haben
Ich habe bei mir attr fhemweg longpoll auf 1 insb. für Plots in fhemweb. Wenn eine Lampe nicht über das GUI geschaltet wird, dann wird der Status in diesem GUI bei mir nicht sofort aktualisiert wie in fhemweb. So wie ich es verstanden habe, wird bei diesem GUI nur gepollt.
Gruß
Damian
mmm..ich habe longpoll auf 1 stehen und nach max. 3-4 Sekunden hat sich der Status im UI aktualisiert.
Zitat von: Damian am 26 März 2015, 15:48:47
Ich habe es bereits auf 0 gesetzt.
Das longpoll in Deiner index.html (oder wie auch immer sie heisst), muss auf 1 stehen. Mit 0 wird longpoll deaktiviert (meine ich, steht hier irgendwo im Thread).
Der Wert ist kein Intervall, sondern an/aus.
Aktualisierung alle 30 Sekunden ist Shortpoll.
<meta name="longpoll" content="1">
Zitat von: Brockmann am 26 März 2015, 16:39:06
Das longpoll in Deiner index.html (oder wie auch immer sie heisst), muss auf 1 stehen. Mit 0 wird longpoll deaktiviert (meine ich, steht hier irgendwo im Thread).
Der Wert ist kein Intervall, sondern an/aus.
Aktualisierung alle 30 Sekunden ist Shortpoll.
<meta name="longpoll" content="1">
ja, das ist das Problem. Mit dieser Einstellung wird bei mir leider gar nicht aktualisiert, erst wenn ich aktiv F5 im Browser drücke. Das Attribut longpoll ist in FHEMWEB auf diesem Port ebenfalls auf 1 gestellt.
Gruß
Damian
Hallo Damian,
Genau das Problem hatte ich anfangs auch, weil ich das index.html nur teilweise auf meine Devices angeglichen habe.
Jedes Device in der index.html muss im data-device einem wirklich vorhandenem Device deiner Konfiguration entsprechen. Bitte entferne alle sonstigen anderen Devices. Ich möchte wetten, dass dann alles richtig aktualisiert ;-)
@setstate: Vielleicht solltest du diesen Punkt mit in der Readme aufnehmen. Es ist so verlockend das mitgeliefertes index.html nur teilweise zu ändern und schon passiert was. Aber es macht ein Haufen Probleme, so vorzugehen.
Grüße
Jens
in allen browsern die dir zur verfügung stehen?
ich habe es gerade noch mal getestet. sobald ich auf der intertechno-fehrnbedienung zum beispiel eine lampe schlate wird genau in dem moment schon in fhem und der tablet ui der status geändert.
einzig bei schnellem an/aus (statuswechsel) kommt tablet-ui nicht mit. wenn man zwischen dme schlaten jedoch 2-3 sekunden wartet funktionierts sauber.
selbst die 3-4 sekunden bjoernbo würde ich zu schon zu langsam finden und kann ich nicht bestätigen (liegt sicher aber auch an der leistung des unterbaus (serverhardware))
zum thermostat:
ich habe gerade zeile 151 und 152 für die max/min angepasst (au die real-werte des rt)
knob_elem.knob({
'min':4.5,
'max':30.0,
zusätzlich step auf 0.5 gesetzt in zeile 156
'step': 1*$(this).data('step') || 0.5,
scheint problemlos zu funktionieren.
Wer es gebrauchen kann:
Habe meine Ansicht für die Thermostate (HomeMatic) angepasst:
Es wird das Batterielevel, der Modus (auto/manuell) sowie die Boots-Funktion ausgegeben.
Zitat<div class="container">
<div class="left">
<div data-type="thermostat" data-device="Wohnzimmer.Wandthermostat" data-get="desired-temp" data-temp="measured-temp" class="cell">
<div type="label" device="Wohnzimmer.Wandthermostat" data-get="humidity" data-unit=" %" class="cell small"></div>
</div></div>
<div class="container">
<div class="label" class="cell"> </div>
<div data-type="label" data-device="CUL_HM_HM_TC_IT_WM_W_EU_303215" data-get="batteryLevel" data-unit="V" class="darker narrow"></div>
<div class="label" class="cell"> </div>
<div data-type="label" data-device="Wohnzimmer.Wandthermostat" data-get="controlMode" class="darker narrow"></div>
<div class="label" class="cell"> </div>
<div data-type="label" data-device="Wohnzimmer.Wandthermostat" data-get="boostTime" class="darker narrow"></div>
</div>
</div>
Zitat von: chris1284 am 26 März 2015, 17:15:05
zum thermostat:
ich habe gerade zeile 151 und 152 für die max/min angepasst (au die real-werte des rt)
knob_elem.knob({
'min':4.5,
'max':30.0,
zusätzlich step auf 0.5 gesetzt in zeile 156
'step': 1*$(this).data('step') || 0.5,
scheint problemlos zu funktionieren.
Hallo Chris,
step konnte man schon mit data-step Attribute auf 0.5 stellen, ohne im Code zu ändern. Min und Max habe ich soeben nachgezogen. Diese kann man jetzt auch optional per HTML Attribute festlegen, die Defaultwerte bleiben bei 10 und 30, für den Fall, dass man nix angibt. Alle anderen außer data-type und data-device sind auch optional, defaults sind für fast alle hinterlegt. Wenn data-valve fehlt, gibt's keinen Default-Wert, weil man damit die zusätzliche Anzeige des Ventils unterdrücken kann.
<div data-type="thermostat" data-device="Wohnzimmer.Wandthermostat"
data-get="desired-temp"
data-temp="measured-temp"
data-valve="ValvePosition"
data-step="0.5"
data-min="4.5"
data-max="30"
class="cell">
Zitat von: jehu am 26 März 2015, 17:02:09
Hallo Damian,
Genau das Problem hatte ich anfangs auch, weil ich das index.html nur teilweise auf meine Devices angeglichen habe.
Jedes Device in der index.html muss im data-device einem wirklich vorhandenem Device deiner Konfiguration entsprechen. Bitte entferne alle sonstigen anderen Devices. Ich möchte wetten, dass dann alles richtig aktualisiert ;-)
@setstate: Vielleicht solltest du diesen Punkt mit in der Readme aufnehmen. Es ist so verlockend das mitgeliefertes index.html nur teilweise zu ändern und schon passiert was. Aber es macht ein Haufen Probleme, so vorzugehen.
Grüße
Jens
Hallo Jens danke für die Tipps. Ich habe jetzt nur noch gelassen:
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,small -->
<!-- available data-type: contact,dimmer,homestatus,label,push,slider,switch,thermostat,volume -->
<div class="gridster">
<ul>
<li data-row="2" data-col="1" data-sizex="1" data-sizey="2">
<header>GARTEN</header>
<div data-type="switch" data-device="FS" class="cell" ></div>
<div data-type="label" class="cell">FS20</div>
</li>
</ul>
</div>
</body>Es funktioniert dennoch nicht.
Vielleicht liegt es daran, dass mein FHEM-Server auf einem Windowsrechner läuft. Getestet habe ich es mit Chrome und IE. Auf einem Windows Client kann ich noch nicht mal im Chrome aktiv den Zustand schalten (Edit: schalten über IE funktioniert dagegen). Die Testregler konnte ich dagegen sowohl auf dem Server wie auf den Clients "drehen" allerdings ohne hinterlegte Funktionalität.
Gruß
Damian
Frage in die Runde ! Ist das Widget "SLIDER" schon impelementiert? Ich bekomme lediglich "DIMMER" angezeigt, allerdings kein "SLIDER"
Hallo Damian,
jetzt müsstest du uns mal deine index.html zukommen lassen. Ich werde aus deinen Angaben nicht mehr schlau.
Du schreibst von "regler ... drehen", in deinem Code sind aber keine Regler zusehen.
Ich möchte auch sehen, welche und wie die Scripts eingebunden sind.
War das auf mich bezogen? Egal, hatte vergessen meine Test.html anzupassen. Jetzt funzt es :-D
By the Way. Den Farbregler habe ich jetzt auch drin für Lightify, jetzt suche noch die Farbwerte für die "WEIßE Lampe". Hat da jemand MIN und MAX Werte??
Zitat von: setstate am 26 März 2015, 19:16:00
Hallo Damian,
jetzt müsstest du uns mal deine index.html zukommen lassen. Ich werde aus deinen Angaben nicht mehr schlau.
Du schreibst von "regler ... drehen", in deinem Code sind aber keine Regler zusehen.
Ich möchte auch sehen, welche und wie die Scripts eingebunden sind.
OK.
Noch mal zur Übersicht:
Auf dem Windowsserver in Chrome:
Was funktioniert:
-ich kann den Schalter über GUI schalten, der Aktor (HM-Steckdose) wird geschaltet, der Zustand ändert sich im GUI
Was nicht funktioniert:
-trotz longpoll=1 (siehe index.html) wird Schalter im GUI nicht aktualisiert, wenn ich die Steckdose über FHEMWEB oder direkt an der Steckdose schalte.
Was funktioniert:
-longpoll=0 dagegen funktioniert im 30 Sekundentakt.
Auf einem Window Client:
Was nicht funktioniert:
-Über Chrome-Browser ist der Schalter nicht anklickbar (Farbe des Schalter ändert sich nicht).
-Über Internet Exporer ist der Schalter zwar anklickbar, aber der Aktor schaltet nicht.
Es scheinen mir hier einige Inkompatibilitäten zu existieren.
Meine Aussage zu den Reglern bezog sich auf deine Testkonfiguration. Die Regler kann ich in allen Browsern über GUI bewegen. Da ich aber noch keine echten Aktoren dahinter gelegt habe, kann ich zur echten Funktionalität noch nichts sagen, immerhin zeigt der Browser das entsprechende set-Kommandos für paar Sekunden an.
Ich hoffe, dass die Probleme jetzt etwas klarer sind.
Gruß
Damian
Zitat von: bjoernbo am 26 März 2015, 19:27:02
By the Way. Den Farbregler habe ich jetzt auch drin für Lightify, jetzt suche noch die Farbwerte für die "WEIßE Lampe". Hat da jemand MIN und MAX Werte??
Hallo Bjoern,
meine Lightify war heute in der Post, ich hoffe am WE komme ich zum Einbinden ins System. Leider kann ich dir jetzt noch nicht helfen. Aber bestimmt die Poweruser hier im Forum ...
@Damian: Sieht erst mal gut aus. Jetzt müssen wir unter die Haube schauen :D
Was sagt die Webconsole? Gibt es da Fehler, oder was kommt vom longpoll an?
Verwenden der Konsole zum Anzeigen von Fehlern und zum Debuggen (https://msdn.microsoft.com/de-de/library/ie/dn255006%28v=vs.85%29.aspx)
Achtung, bitte
Zitat<meta name="debug" content="1">
setzen
Zitat von: bjoernbo am 26 März 2015, 19:27:02
Den Farbregler habe ich jetzt auch drin für Lightify, jetzt suche noch die Farbwerte für die "WEIßE Lampe". Hat da jemand MIN und MAX Werte??
Bei Milight wird "Weiss" per
set <device> saturation 0 gesetzt (zurück zur Farbe gehts mit
set <device> saturation 100). Evtl. ist das bei Lightify genauso.
Danke für den Tipp nesges! In der Tat, bei lightify heißt es
Zitatsat
es war doch nicht SAT :-/ aber egal.
So schaut es derweilen in meiner Testumgebung aus:
OBEN: ein/aus mit Zimmerfunktion
RECHTS: RGB Farbraum
LINKS:Der Weißbereich (und dieser gefällt mir noch nicht) Hier hätte ich es auch gerne wie beim RGB jedoch nur für den Weißbereich!
@setstate: Wenn Du deins am laufen hast, weißt du was ich meine :-D
Zitat<div class="container">
<div class="cell"> </div>
<div class="center"><div data-type="dimmer" data-device="lightify_julia"
data-get-on="[0-9]{1,3}|on"
data-get-off="off"
class="cell"></div></div>
<div class="left">
<div data-type="volume" data-device='lightify_julia'
data-min='0'
data-max='65535'
data-get='hue'
data-set='hue'
class="cell hue-tick hue-front"><div class="cell"> </div>
</div>
</div><div class="cell"> </div>
<div class="right">
<dic class="cell"> </div>
<div data-type="volume" data-device="lightify_julia" data-get="ct" data-set="ct" data-min="154" data-max="500" class="cell"></div>
</div>
</div>
Zitat von: setstate am 25 März 2015, 00:39:46
(http://knowthelist.github.io/fhem-tablet-ui/volume_big.png)
Gibts ne Möglichkeit den HUE Wert in RGB zu bekommen ?
Möchte das für WifiLight nutzen.
Neues Widget: button
Variante der push und switch Widgets, die entweder einen URL ansteuern oder einen Fhem-Befehl absetzen kann.
<div data-type="button" data-url="wohnzimmer.html"></div>
Wechselt zu der Seite wohnzimmer.html.
<div data-type="button" data-fhem-cmd="set+MILIGHT_Zone1_Wohnzimmer+hue+50" data-icon="fa-paint-brush" data-color="hsl(50,100%,50%)" class="cell"></div>
Sendet den Befehl "set MILIGHT_Zone1_Wohnzimmer hue 50" an fhem. Als Icon wird ein Malpinsel auf gelbem (HUE 50) Hintergrund angezeigt. Der Fhem-Befehl muss urlencoded notiert werden. Fhem wird über den Metatag fhemweb_url lokalisiert, ist der Metatag nicht gesetzt wird "/fhem" als Default angenommen.
Download und weitere Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui
Respekt! Das muss ich mal loswerden, wie viel in so kurzer Zeit zusammengekommen ist und was noch alles in der Pipe ist :-D
Da macht das HTML programmieren wieder Spaß und Sinn
Von mir gibt es heute das verbesserte contact Widget:
symbol widget Es kann jetzt nicht nur mit einem Icon den Status eines Devices anzeigen, sondern kann optional auch mehrere Status anzeigen.
Dafür gibt es zwei neue Array Attribute
Zitatdata-icons und data-on-colors
Beispiel:
<div data-type="symbol" data-device="dummy1"
data-get-on='["Wert1","Wert2","Wert3"]'
data-icons='["fa-arrow-up","fa-arrow-right","fa-arrow-down"]'
data-on-colors='["#32a054","#6666cc","#ad3333"]' >
</div>Das bedeutet, wenn STATUS='Wert1', dann zeige 'arrow-up'-Icon in grün, wenn STATUS='Wert2', dann zeige 'arrow-right'-Icon in blau usw.
Das symbol Widget löst das contact Widget vollständig ab!!! In der index.html müssen alle data-type='contact' durch data-type='symbol' ersetzt werden.
Danke an
dancatt für den Vorschlag für die Umsetzung
Zitat von: bjoernbo am 26 März 2015, 21:21:04
es war doch nicht SAT :-/ aber egal.
So schaut es derweilen in meiner Testumgebung aus:
OBEN: ein/aus mit Zimmerfunktion
RECHTS: RGB Farbraum
LINKS:Der Weißbereich (und dieser gefällt mir noch nicht) Hier hätte ich es auch gerne wie beim RGB jedoch nur für den Weißbereich!
@setstate: Wenn Du deins am laufen hast, weißt du was ich meine :-D
Es gab ein Update für das Volume Widget. Jetzt kannst du mit data-tickstep die Abstände kleiner machen.
data-tickstep='4' Update: Von
nesges gab es noch eine Erweiterung für das volume Widget.
ZitatNach dem Vorbild der hue-Klassen färben die dim-Klassen den jeweiligen Bereich in Graustufen zwischen rgb(0,0,0) und rgb(255,255,255).
Gemeint sind die CSS Klassen, die man optional setzen kann: HUE: hue-back|hue-ticks|hue-front SATURATION: dim-back|dim-ticks|dim-front
Zitat von: chris1284 am 26 März 2015, 06:39:31
es gibt mehrere möglichkeiten, je nach dem was besser umsetzbar ist.
"off" ist im rt intern die temperatur 4.5, auf dem display und den readings zeigt er aber off.
es wäre natürlich super wenn das widget "Off" anzeigt, "4.5" würde aber auch gehen (genau so wie "-" oder "--" da man das selbst als off interpretieren könnte. nur 10 ist dann ganz verwirrend
zum schalten würde ich einfach die möglichen werte im widget auf 4.5 bis 30 setzen. wird dann ein set name desired-temp 4.5 gesendet geht der rt auf 0ff
um das noch ein wenig auf die spitze zu treiben: der rt kann auch den wert on als desired-temp bekommen ;D hier weiss ich aber auch nciht was er da intern für eine temp fährt, das kann martin sicher sagen.
ich gehe mal davon aus dass aktuell "off" als falscher wert / nicht numerisch erkannt wird und das widget dann seinen default wert nimmt -> 10.
das macht es auch wenn man den namen des devices falsch schreibt und keine werte kommen. hier sollte man zur besseren fehlerfindung evtl sowas wie n.A. nehmen
Nesges hat heute gleich eine gute Lösung dafür geliefert. Vielen Dank.
ZitatZwei neue Attribute data-off und data-boost, die beliebige Temperatur-Kommandos setzen (zB data-off="off"). Wenn gesetzt wird data-off gesetzt, wenn die Mindesttemperatur gewählt wurde. data-boost entsprechend bei der Maximaltemperatur.
Zu der Thermostat-Lösung noch eine Anmerkung:
4.5 in die Skala aufzunehmen war nicht möglich ohne data-step=0.5 zu setzen. Das wollte ich nicht erzwingen. Wenn man aber nicht auf die normalen Min- und Max-Werte verzichten möchte kann man zB data-min="4" und data-max="31" setzen. Ein vollständiges Beispiel:
<div data-type="thermostat" data-device="W_HEIZUNG" data-min="4" data-off="off" data-max="31" data-boost="boost"></div>
Wenn man damit den Regler auf 4 zieht, wird "off" gesendet, wenn man auf 31 zieht wird "boost" gesendet. Auf dem Rückweg funktioniert's übrigens genauso: Wenn fhem "off" meldet, zeigt der Regler im Beispiel "4" an und bei boost wird "31" angezeigt. Ich persönlich setze übrigens min=5 und max=30 - sieht chicker aus und diese Temperaturen werde ich ansonsten niemals ernsthaft brauchen. Wenn man die Attribute data-off und data-boost werden off und boost übrigens nicht ausgewertet, d.h. es sind keine Defaults für "off" und "boost" vorgesehen.
Danke für's übernehmen des Vorschlags!
Suppi! Werde ich heute Nachmittag ausprobieren!
Kann mir hem. sagen wie groß ein "CONTAINER" ist wenn data-sizex="1" und data-sizey="1" ist?
Ich hatte das irgendwo im Code mal gelesen :-/
:-\ wenn man an der richtigen Stelle guckt .....
Zitat<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
@setstate: danke für's umsetzen im thermostat widget!
kann mir evtl jemand sagen wie man per java-script ein img (zb http://schierke-am-brocken.de/webcam/schierke01.jpg) neu lädt ohne die seite zu refreshen? ich habe es auf basis des fronthem widgets "multimedia.image" versucht nachzubauen aber bekomme es nicht hin.
hier haben ja einige einen snapshot ihrer webcam eingebaut. optimal wäre ja ein widget dem man den pfad zum pic und den intervall mitgeben könnte so daas man stehts ein aktuelles bild hat
Hallo!
auf meiner "Startseite" habe ich lediglich Bilder der CAM via <iframe> eingebunden. Ich hatte zwischenzeitlich im <head> Bereich ein ein JS zum refresh eingebunden. Dadurch hatte sich aber das Tablet nicht mehr automatisch ausgeschaltet. Das JS hatte ich über google gefunden. (autom. Seitrenrefresh nach X Sekunden) Mittlwerweile habe ich bei mir das LIVE-Bild der Kameras eingebunden. (entsprechende CGI Notation). Somit benötige ich nicht mehr den refresh. Was für eine CAM hast Du im Betrieb? Ich benutze FOSCAM's.
Zitat von: chris1284 am 27 März 2015, 06:38:01
@setstate: danke für's umsetzen im thermostat widget!
kann mir evtl jemand sagen wie man per java-script ein img (zb http://schierke-am-brocken.de/webcam/schierke01.jpg) neu lädt ohne die seite zu refreshen? ich habe es auf basis des fronthem widgets "multimedia.image" versucht nachzubauen aber bekomme es nicht hin.
hier haben ja einige einen snapshot ihrer webcam eingebaut. optimal wäre ja ein widget dem man den pfad zum pic und den intervall mitgeben könnte so daas man stehts ein aktuelles bild hat
Es gibt das Image Widget, das erwartet eine Image URL per Reading. Wir können dieses Widget aber leicht erweitern, sodass eine URL fest vorgegeben werden kann und ein Refresh Intervall per Data Attribut.
Zitat von: setstate am 27 März 2015, 07:39:58
Es gibt das Image Widget, das erwartet eine Image URL per Reading. Wir können dieses Widget aber leicht erweitern, sodass eine URL fest vorgegeben werden kann und ein Refresh Intervall per Data Attribut.
das hört sich sehr gut an!
@bjoernbo: diverse, eine wansview ( instar nachbau), ein d-link und ich möchte einige öffentliche einbinden (bei denen wird es schwer per cgi das bild abzugreifen ;) ). ein lifestream ist auch nicht notwendig für die internen cams. es wird auch von verschiedenen geräten zugegriffen und es ist a) die anzahl der streams begrenzt b) die performance sicher nicht toll bei x-full-hdstreams und x sd-streams gleichzeitig
Zitat von: nesges am 27 März 2015, 00:55:38
Zu der Thermostat-Lösung noch eine Anmerkung:
4.5 in die Skala aufzunehmen war nicht möglich ohne data-step=0.5 zu setzen. Das wollte ich nicht erzwingen. Wenn man aber nicht auf die normalen Min- und Max-Werte verzichten möchte kann man zB data-min="4" und data-max="31" setzen. Ein vollständiges Beispiel:
<div data-type="thermostat" data-device="W_HEIZUNG" data-min="4" data-off="off" data-max="31" data-boost="boost"></div>
Wenn man damit den Regler auf 4 zieht, wird "off" gesendet, wenn man auf 31 zieht wird "boost" gesendet. Auf dem Rückweg funktioniert's übrigens genauso: Wenn fhem "off" meldet, zeigt der Regler im Beispiel "4" an und bei boost wird "31" angezeigt. Ich persönlich setze übrigens min=5 und max=30 - sieht chicker aus und diese Temperaturen werde ich ansonsten niemals ernsthaft brauchen. Wenn man die Attribute data-off und data-boost werden off und boost übrigens nicht ausgewertet, d.h. es sind keine Defaults für "off" und "boost" vorgesehen.
Danke für's übernehmen des Vorschlags!
Ist es auch möglich in das Thermostat Widget 2 Icons einzubauen welche "off" und "boost" steuern? Die Anzeige der Temperatur müsste dann auch entsprechend angepasst werden wenn man so ein Icon betätigt.
Fände ich persönlich besser und schöner als den Regler zu ändern. Wenn das aber nicht gehen sollte dann ists auch gut.
Noch eine Frage am Rande:
- Gibt es eigentlich schon eine Lösung oder auch ein geplantes Vorgehen bzgl. Updates? Kann man das in Fhem integrieren?
- Wie wird mit den Widgets anderer Entwickler (z.B. die von nesges) verfahren?
=> Natürlich alles nur wenn setstate mitspielt.
Trotzdem sehr sehr geile Sache das ganze hier. Schlicht, einfach und schön.
Passt nur auf dass ein Widget nicht zu kompliziert wird. Lieber ein Widget mehr machen als ein Widget welches alles kann.
Danke an alle die hier mitarbeiten.
naja, die buttons kannst du dir aktuell auch schon selber bauen aber ja, die option mit dem standardwidget
gleich die buttons boost / mode (auto/manu) und ggf. on/off zu haben wäre toll.
Ich habe eben mein UI übers Smartphone aufgerufen. Dabei kam mir dann spontan die Idee, dass ich mir eine "abgespeckte" Version ( HTML Seiten ) erzeuge die Smartphone freundlich ist.
Hierzu muss ich aber das verschieben der WIDGTES unterbinden.
Frage: Wie und Wo konnte man das unterbinden?
@ jehu: Auf deinem Post ist zu erkennen, dass dein UI im WebViewControl läuft. Bei mir wird seit einiger Zeit nicht mehr das Akkuzustand angezeigt. Damit dieser angezeigt wird, hast du dazu in der index.html die auskommentierten Zeilen im Bezug auf das WEBViewControl aktiviert?
Bei mir wird es trotzdem nicht angezeigt.
Hallo bjoernbo,
für das Ausschalten der Verschiebefunktion von gridster wollte setstate noch ein Meta-Tag bauen. Aktuell geht das m.E. nicht über die index.html.
Ein paar Seiten vorher hat ein nesges noch eine Funktion gepostet mit der man das wohl in einem Script steuern kann. Aber das fehlt mir auch eindeutig das Know-how zu JS/Jquery.
Zum WebviewControl: Ja, ich habe die Zeilen im html aktiviert und es läuft alles ohne Probleme. Allerdings liegen die Batterie-Symbole und das TTS-Speech-Symbol unter den Gridster-Boxen. Das ist etwas störend, vielleicht hat einer der Web-Cracks hierzu eine Idee ?
Grüße
Jens
kurze Anmerkung zum WebViewControl für @bjoernbo
Das WebVievControl-Device ist bei dir aber richtig definiert?
Ich musste meins z.B. in androidTablet umbenennen.
<script type="text/javascript">var wvcDevices = {'12345': 'androidTablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
Grüße
Jens
Zitat von: jehu am 27 März 2015, 10:15:19
Ein paar Seiten vorher hat ein nesges noch eine Funktion gepostet mit der man das wohl in einem Script steuern kann. Aber das fehlt mir auch eindeutig das Know-how zu JS/Jquery.
Das folgende in die HTML-Datei aufzunehmen sollte reichen:
<script type="text/javascript">$(document).ready(function() { gridster.disable() })</script>
@jehu => das mit dem Andorid wird es sein. Check ich nachher. Danke.
Bonjour!
Toll was hier alles passiert!
Habe auch noch zwei Vorschläge/Wünsche für Widgets ;)
das neue symbol.widget mit dem Button-kreis hinterlegen und ein multi-toggle-button drausmachen.
ein/zwei Timer widgets
klein: in Button Größe, die Zeit kann ähnlich wie beim Dimmer eingestellt werden, Ablauf Visualisierung über den Hintergrund-Kreis wie auf einem Zifferblatt ähnlich iOS app thyme (s. Bildanhang)
groß: über ein Volume Widget nur halt mit Vollkreisskala.
grüsse, Alex
P.S. Hat schon mal jemand damit experimentiert Widgets dynamisch zu adden/deleten ?
Zitat von: setstate am 26 März 2015, 19:45:32
@Damian: Sieht erst mal gut aus. Jetzt müssen wir unter die Haube schauen :D
Was sagt die Webconsole? Gibt es da Fehler, oder was kommt vom longpoll an?
Verwenden der Konsole zum Anzeigen von Fehlern und zum Debuggen (https://msdn.microsoft.com/de-de/library/ie/dn255006%28v=vs.85%29.aspx)
Achtung, bitte setzen
So, ich habe es mir über die Console angeschaut, debug ist auf 1. Keine Fehler. Bei longpoll=1 kommt nach dem Schalten der Steckdose keine Message, bei longpoll=0 kommt alle 30 Sekunden:
update done for device:* parameter:*
Edit: ich sehe gerade bei longpoll=1 kommt zyklisch die Meldung:
start longpoll
Gruß
Damian
Zitat von: Damian am 27 März 2015, 12:42:46
So, ich habe es mir über die Console angeschaut, debug ist auf 1. Keine Fehler. Bei longpoll=1 kommt nach dem Schalten der Steckdose keine Message, bei longpoll=0 kommt alle 30 Sekunden:
update done for device:* parameter:*
Gruß
Damian
Bei mir gehts auch nicht. Hatte ich schon in http://forum.fhem.de/index.php/topic,34233.msg275608.html#msg275608 (http://forum.fhem.de/index.php/topic,34233.msg275608.html#msg275608) erwähnt. Hatte nur noch keine Zeit mich darum zu kümmern.
Wenn ich die Farbtemperatur steuern will (rechtes Volume Control) so wird der Wert zwar übertragen, aber die Anzeige merkt sich nicht den Wert und springt zurück. Bei der RGB Wahl (linkes Volume Control) wird sich der Wert gemerkt.
Bug? Feature? oder DAU-Fehler?
Zitat<li data-row="1" data-col="4" data-sizex="3" data-sizey="2">
<header>LightiFy</header>
<div class="container">
<div class="cell"> </div>
<div class="center">
<div data-type="dimmer" data-device="lightify_sz_bjoern"
data-get-on="[0-9]{1,3}|on"
data-get-off="off"
class="cell"></div>
</div>
<div class="left">
<div data-type="volume" data-device='lightify_sz_bjoern'
data-min='0'
data-max='65535'
data-get='hue'
data-set='hue'
class="cell hue-tick"><div class="cell"> </div>
</div>
</div>
<div class="cell"> </div>
<div class="right">
<dic class="cell"> </div>
<div data-type="volume" data-device="lightify_sz_bjoern" data-get="ct" data-set="ct" data-min="154" data-max="500" class="cell"></div>
</div>
</li>
... bei Dimmer fällt mir auf ... Wenn dieser auf 50%steht und ich die Lampe ausschalte geht das Icon in den Off Modus. Nach 3 Sekunden ist das Icon wieder ON und steht auf 0 !
wenn man selbst ein widget bauen wollen würde und von java nicht viel plan hat, was wären die anlaufstellen um sich auf die hier verwendeten techniken(?) einzulesen?
wenn ich's richtig versteh greifen die widgets die daten aus den data-tags ab und führen eigene funktionen aus oder greifen auf fhem-tablet-ui.js zu (zb setFhemStatus)...
gibt's ne doku zu fhem-tablet-ui.js?
das würde mich auch interessieren. Ein How-To an einem kleinem, einfachen Beispiel
Wie sieht es aus die "Kacheln" (Widgets) bunt zu gestalten, z. B. abhängig von einer Temperatur oder Feuchtigkeit. Hier finde ich ein schönes Beispiel für abstrakte Plot-Darstellung:
http://dashingdemo.herokuapp.com/sampletv
Gruß
Damian
Hallo zusammen,
es ist sehr schön, wie viele Meinungen, Fragen und Wünsche zum Tablet UI hier wieder neu aufgeschlagen sind.
Ich sehe kaum noch durch, deshalb nehmt es mir nicht böse, wenn ich nicht gleich auf alles eingehen kann.
Hier kurz meine Meinungen zu einigen genannten Punkten:
- Thermostat Widget mit Boost und Off Button möchte ich ungern. Das wäre zu überfrachtet. Evtl. kann sich jeder entsprechende Buttons daneben positionieren.
- WebViewControl: Es ist mir bewusst, dass die WebViewControl-Icons hinter dem Board liegen, ich will die auch nicht sehen, solange sie soooooo aussehen. Nix gegen das WebViewControl, das ist eine Spitzensachen und ohne das, hatte ich mir auch kein Tablet zugelegt und die UI gebastelt. Ich kann mal schauen, ob man mit 'z-index' in der CSS was machen könnte, das hängt vom benutzen 'position' Wert ab
- Timer widgets: ist interessant und hier auch schon mal angefragt, besonders für on-for-time. Würde ich gerne machen. Aber nicht sofort ... :D
- @bjoernbo: Deine ganzen Ungereimtheiten schaue ich mir an, wenn ich dazu komme. Schau aber bitte mal nach, ob das von der UI gesendete auch das ist, was richtig ist. Besonders welche Readings du änderst. und welche Änderungen im Rückkanal wieder reinkommen. Dazu die Console aufmachen und Debug einschalten ...
- Programmieren rund um die fhem-tablet-ui.js : da muss ich euch enttäuschen, mit Doku habe ich leider nicht soviel am Hut 8) Da müsst ihr euch im Selbststudium ran wagen. Ich verweise gerne auf https://jquery.com/ (https://jquery.com/) und http://learn.jquery.com/ (http://learn.jquery.com/). Da hilft leider nur ein einfaches - widget schnappen und probieren. Web-Console ist das Hauptwerkzeug und ein Texteditor. Bei den Widgets ist es aber manchmal nicht so einfach, Syntax-Fehler zu erkennen. In diesem Fall würde es erst gar nicht geladen und man sieht nix in der Console. Dann kann man das widget explizit einbinden und sieht Fehler in der Console: <script data-type="text/javascript" src="/fhem/tablet/js/widget_mywidget.js"></script> Ich empfehle das Image Widgets als Template nehmen (oder das widget_template.js) und etwas erweitern. Vlt. könnt ihr gleich die data-url Sache implementieren. Die Widgets sind immer gleich aufgebaut: eine Init-Function, die beim Start aufgerufen wird und die Elemente anlegt und eine Update-Function, die für alle Widgets aufgerufen werden, um die Änderungen zu bewirken.
Und viel Google benutzen, mache ich auch gaaaanz viel.
- Update: Das möchte ich auch gerne. Dafür gibt es den Issue https://github.com/knowthelist/fhem-tablet-ui/issues/11 (https://github.com/knowthelist/fhem-tablet-ui/issues/11). Ich hoffe, ein FHME Power-Auskenner kann uns zum Thema FHEM-update Mechanismus unterstützen und Starthilfe geben. Zum Thema Widgets, bin ich auch dafür, alle verfügbaren Widgets aus einer zentralen Quelle anzubieten.
Zitat von: chris1284 am 27 März 2015, 18:20:49
wenn man selbst ein widget bauen wollen würde und von java nicht viel plan hat, was wären die anlaufstellen um sich auf die hier verwendeten techniken(?) einzulesen?
wenn ich's richtig versteh greifen die widgets die daten aus den data-tags ab und führen eigene funktionen aus oder greifen auf fhem-tablet-ui.js zu (zb setFhemStatus)...
gibt's ne doku zu fhem-tablet-ui.js?
Javascript! Nicht Java - wichtiger Unterschied, sonst liest du nachher Seitenweise Bücher über eine vollkommen unnütze Sprache! ;) Eine gute Einsteigerdoku zu Javascript kenne ich nicht, evtl. ist http://wiki.selfhtml.org/wiki/JavaScript eine gute Anlaufstelle. Wichtig ist vor allem JQuery, da gibt's mW aber auch nur die API-Doku unter http://api.jquery.com/. Die ist zwar exzellent, aber nicht wirklich einsteigerfreundlich. Ich würde am ehesten empfehlen sich ein einfaches Widget zu nehmen (widget_push.js dürfte am einfachsten sein) und damit so lange rumzuspielen, bist du verstanden hast, was dort passiert. Und in fhem-tablet-ui.js kann man sich auch einlesen, es sind nur gut 350 Zeilen Code, der an keiner Stelle besonders kryptisch ist.
Ich bin selber kein Javascript-Experte. Abgesehen von ein paar JQuery-UI Projekten habe ich die Sprache bisher eher gemieden.
Zitat von: Damian am 27 März 2015, 19:23:21
Wie sieht es aus die "Kacheln" (Widgets) bunt zu gestalten, z. B. abhängig von einer Temperatur oder Feuchtigkeit. Hier finde ich ein schönes Beispiel für abstrakte Plot-Darstellung:
http://dashingdemo.herokuapp.com/sampletv
Gruß
Damian
Nein, bitte nicht !!! Das würde ich nicht gut finden. Das ist viel zu dick aufs Auge. Ich habe ja doch kein Atomkraftwerk Zuhause, wo Fehlerzustände sofort ins Auge springen müssen.
Ich möchte eine eine minimalistische UI, wo man sich ständig fragen sollte, was kann man noch weglassen um es einfacher und übersichtlicher zu machen.
Ich bin eher Fan von so etwas: http://biznology.com/2014/10/dashboard-finally-perfected/ (http://biznology.com/2014/10/dashboard-finally-perfected/)
...und ein neues Widget: clock
Zeigt eine einfache Uhr in Form eines sich aktualisierenden Labels an. Zeitformat und Aktualisierungsinterval sind einstellbar. Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui#clock, Download unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_clock.js
Diese Widget hat übrigens keinerlei Interaktion mit fhem und ist daher eher als Spielzeug, Deko oder Gadget zu bezeichnen ;)
@nesges. Jedesmal wenn du hier aufschlägst bringste ein neues Widget mit! Das gefällt mir. Bei Gelegenheit bitte noch eine Hardcopy für die Uhr hinterlegen. Du hast recht in kurzer Zeit passiert hier so viel....das ist Wahnsinn!
Zitat von: setstate am 27 März 2015, 19:38:28
Nein, bitte nicht !!! Das würde ich nicht gut finden. Das ist viel zu dick aufs Auge. Ich habe ja doch kein Atomkraftwerk Zuhause, wo Fehlerzustände sofort ins Auge springen müssen.
Ich möchte eine eine minimalistische UI, wo man sich ständig fragen sollte, was kann man noch weglassen um es einfacher und übersichtlicher zu machen.
Ich bin eher Fan von so etwas: http://biznology.com/2014/10/dashboard-finally-perfected/ (http://biznology.com/2014/10/dashboard-finally-perfected/)
ja, den minimalistischen Ansatz finde ich auch gut. Ich denke hier auch an unbedarfte Anwender, bei denen eine wichtige Information, wie "schlechte Luft" ins Auge fallen soll. Immerhin werden ja Farbelemente z. B. auf der Skalierung vorgenommen, die ins Auge fallen. Genauso könnte aber auch die Feuchtigkeitszahl, die jetzt weiß ist, die entsprechende Farbe einnehmen. Immerhin kann sich offenbar jeder seine Widgets ja relativ einfach selbst bauen und das macht den Ansatz um so interessanter. Ich bin mir jetzt schon sicher, dass eine große Bibliothek entstehen wird und da kann sich jeder sein Widget nehmen bzw. anpassen.
Hast du denn eine Idee, warum der longpoll bei manchen hier nicht durchkommt? Wie schon geschrieben: Fehlermeldungen habe ich auf der Konsole keine.
Gruß
Damian
@Damian: oookaay, da gehe ich mit. Wollte ich aber gesagt haben. ;D
das mit dem longpoll ist schon merkwürdig. Unter Windows sagst du, geht es nicht? Hast du auch ein Tablet, geht es da auch nicht?
Geht longpoll mit dem normalen FHEM Webgui auf dem gleichen Client? Hast du FHEM aktuell, ich frage wegen der jquery.js, die du benutzt. Ich habe, um es schlank zu halten, keine eigene jQuery Version dabei, sondern nutze die aus der FHEM Installation.
Ich kann ja mal meine Windows Maschine rausholen und anwerfen zum Checken...
Zitat von: setstate am 27 März 2015, 20:41:21
@Damian: oookaay, da gehe ich mit. Wollte ich aber gesagt haben. ;D
das mit dem longpoll ist schon merkwürdig. Unter Windows sagst du, geht es nicht? Hast du auch ein Tablet, geht es da auch nicht?
Geht longpoll mit dem normalen FHEM Webgui auf dem gleichen Client? Hast du FHEM aktuell, ich frage wegen der jquery.js, die du benutzt. Ich habe, um es schlank zu halten, keine eigene jQuery Version dabei, sondern nutze die aus der FHEM Installation.
Ich kann ja mal meine Windows Maschine rausholen und anwerfen zum Checken...
Wie schon geschrieben, läuft mein Server unter Windows. FHEM-Update funktioniert da ja nicht. Daher kopiere ich die aktuellen Files immer wieder manuell. Wo liegt die jquery.js? Auf einem Android-Tablet als Client funktioniert die direkte Aktualisierung auch nicht. Was mir jetzt allerdings aufgefallen ist, dass es irgendwann auf den Clients (paar Minuten) doch aktualisiert wird. Es wird wahrscheinlich das Problem des Servers sein und nicht der Clients.
Gruß
Damian
Zitat von: setstate am 27 März 2015, 19:31:34
- Update: Das möchte ich auch gerne. Dafür gibt es den Issue https://github.com/knowthelist/fhem-tablet-ui/issues/11 (https://github.com/knowthelist/fhem-tablet-ui/issues/11). Ich hoffe, ein FHME Power-Auskenner kann uns zum Thema FHEM-update Mechanismus unterstützen und Starthilfe geben. Zum Thema Widgets, bin ich auch dafür, alle verfügbaren Widgets aus einer zentralen Quelle anzubieten.
ChrisD liefert über github die updates für seine squeezebox-modul, ggf mal ihn ansprechen wie's geht
updates werdne in fhem dann über das eingabefenster angestoßen
Zitatupdate all https://raw.githubusercontent.com/ChrisD70/FHEM-Modules/master/autoupdate/sb/controls_squeezebox.txt
@nesges: Habe heute dein "statistic" Widget eingerichtet. Dazu habe ich die .js ins /lib Verzeichnis gelegt und innerhalb des Head-Tag das neue Modul eingebunden. Einen entsprechenden FHEM Eintrag habe ich auch. Allerdings wird mir nichts angezeigt.Wo könnte der Fehler liegen ?
Zitat<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/widget_klimatrend"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
...
Zitat<divv class="cell">Ben</diV>
<div data-type="klimatrend" data-device="statistik_ben" data-get="measured-temp"></div>
<div data-type="klimatrend"
data-device="statistik_ben"
data-get="measured-temp"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
></div>
...
Zitatdefine statistik_ben statistics Ben.Wandthermostat
attr statistik_ben ignoreDefaultAssignments 1
attr statistik_ben room Ben
attr statistik_ben tendencyReadings humidity,measured-temp,desired-temp
Rein optisch, ohne Tests ...
erst einmal
Zitat<script type="text/javascript" src="/fhem/tablet/lib/widget_klimatrend.js"></script>
statt
Zitat<script type="text/javascript" src="/fhem/tablet/lib/widget_klimatrend"></script>
Aber das muss nur für Debug-Zwecke angegeben werden, ansonsten wird es dynamisch angezogen, wenn du ein data-type='klimatrend' irgendwo in der index.html hast.
Zitat von: bjoernbo am 28 März 2015, 11:17:29
Wo könnte der Fehler liegen ?
"measured-temp" ist nicht das Statistic-Reading. Schau dir dein Device nochmal an, du findest dort eine Reihe neuer Readings, die vom statistic-Modul erzeugt werden. Du willst die Readings mit "Tendency" im Namen.
:-\ verstehe ich nicht !
Zitat<div class="cell">Ben</diV>
<div data-type="klimatrend" data-device="statistik_ben" data-get="stathumidityTendency"></div>
<div data-type="klimatrend"
data-device="statistik_ben"
data-get="stathumidityTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
></div>
Ok, ich hab's grade in https://github.com/nesges/Widgets-for-fhem-tablet-ui#klimatrend etwas verdeutlicht. Die Readings sind nicht im statistics Device ("statistik_ben") zu finden, sondern in dem Device dass die Temperaturwerte originär erzeugt ("Ben.Wandthermostat"). Bei dir sollte der HTML-Code so aussehen:
<div data-type="klimatrend" data-device="Ben.Wandthermostat" data-get="statHumidityTendency"></div>
In http://fhem.de/commandref.html#statistics steht das bereits im ersten Satz.
;D
haha jetzt verstehe ich deinen vorherigen Post ;D
tendency ist dann direkt im Device ...Wandthermostat
Danke für die Unterstützung !!!
Zitat<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header>Statistik</header>
<div class="cell">Ben</diV>
<div data-type="klimatrend" data-device="Ben.Wandthermostat" data-get="statHumidityTendency"></div>
<div data-type="klimatrend"
data-device="Ben.Wandthermostat"
data-get="statHumidityTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
></div>
</li>
Das Verschieben der Widgets wird in der aktuellsten Version übrigens per
<meta name='gridster_disable' content='1'>
abgeschaltet.
Ok Danke. Dann werde ich die Tage mal versuchen eine Smartphone freundliche UI zu erstellen.
eine frage zur fhem-tablet-ui.js
was bedeutet in zeile 350 (getDeviceValue function) der doppelpunkt?
Zitatvar paraname = (src && src != '') ? device.data(src) : Object.keys(readings)[0];
ich interpretiere es bisher so:
paraname = (wenn src defined und nicht leer dann ) -> hie rgehts nicht weiter
device.data(src) : Object.keys(readings)[0];Hintergrund: ich versuche in einem widget x-beliebige readings aus eine device zu lesen die nicht in data-get hinterlegt sind.
Zitat von: chris1284 am 28 März 2015, 17:15:07
was bedeutet in zeile 350 (getDeviceValue function) der doppelpunkt?
Das ist die Kurzform von:
var paraname;
if(src && src != '') {
paraname = device.data(src);
} else {
paraname = Object.keys(readings)[0];
}Zitatich versuche in einem widget x-beliebige readings aus eine device zu lesen die nicht in data-get hinterlegt sind.
Pack dir sowas in die init-Function:
$(this).data('xbeliebigesreading', 'xbeliebigesreading');
readings['xbeliebigesreading'] = true;Dann wird das Reading automatisch geholt und kann in der update-Function mit
getDeviceValue($(this), 'xbeliebigesreading');gelesen werden. Hier ein Beispiel das diese Methode für ziemlich viele Readings benutzt: https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_kodinowplaying.js
wollte ich auch gerade schreiben :-)
https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Operators/Conditional_Operator (https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/Operators/Conditional_Operator)
Wenn du zusätzliche Readings neben dem in data-get angegebenen haben willst, musst du dieses in die Readings Collection aufnehmen, damit der Wert auch von FHEM geholt wird.
Das macht man so:
readings['myReadingName'] = true;
im init Teil des Widgets. Oder, wenn du den Reading Namen konfigurierbar als HTML Attribute machen willst, dann so
readings[$(this).data('myreading')] = true;
Siehe Beispiel im Thermostat Widget, dort werden auch zusätzliche Readings gebraucht. Diese werden in Zeile 151ff in die Collection aufgenommen.
der Teufel im Detail.
Sorry ich suche nun seit 2 Stunden eine Möglichkeit die Statistikwerte neben der Gradzahl bzw der %-Zahl darstellen zulassen.
Ich finde den Fehler nicht. Habe bereits container sowie left und right ausprobiert. es will mir nicht gelingen :-/
Anbei ein aktueller Auzug :-/
Zitat<div data-type="label" data-device="Wohnzimmer.Wandthermostat" data-get="measured-temp" data-unit="%B0C%0A" class="cell big"></div>
<div data-type="klimatrend"
data-device="Wohnzimmer.Wandthermostat"
data-get="statMeasured-tempTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"></div>
<div type="label" device="Wohnzimmer.Wandthermostat" data-get="humidity" data-unit=" %" class="cell big"></div>
<div data-type="klimatrend"
data-device="Wohnzimmer.Wandthermostat"
data-get="statHumidityTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"></div>
DANKE im voraus
Mit Bordmitteln: beiden Elementen die class "left" geben.
Warum? "div" ist ein Block-Element, d.h. nach einem div folgt ein "Absatz". "left" definiert "float: left", dadurch wird die Blockdarstellung aufgehoben und umgebende Elemente müssen es umfliessen.
Alternative Lösung: beiden Elementen style="display:inline" geben.
Dadurch wird die Blockdarstellung für beide aufgehoben.
danke, das hat mir sehr weitergeholfen. leider schaff ich es so noch nicht bereits im init teil den wert des readings auszulesen (aus dem wert des readings sollen sich die namen aller anderen readings ergeben)
init: function () {
_calview=this;
_calview.elements = $('div[data-type="calview"]');
_calview.elements.each(function(index) {
var device = $(this).data('device');
$(this).data('get', $(this).data('get') || 'STATE');
var reading = $(this).data('get');
if (reading == 'c-today') {
var value = getDeviceValue( $(this), 'get' );
alert ("Wert " + value + " Reading " + reading);
var tmp;
for (i = 1; i <= value; i++) {
tmp = 'today_00'+i+'_summary';
$(this).data(tmp, tmp);
readings[tmp] = true;
}
}
else if (reading == 'c-tomorrow') {
var value = getDeviceValue( $(this), 'get' );
alert ("Wert " + value + " Reading " + reading);
var tmp;
for (i = 1; i <= value; i++) {
tmp = 'tomorrow_00'+i+'_summary';
$(this).data('tomorrow_00'+i+'_summary', 'tomorrow_00'+i+'_summary');
readings['tomorrow_00'+i+'_summary'] = true;
}
}
});
},
Zitat von: chris1284 am 28 März 2015, 18:55:56
leider schaff ich es so noch nicht bereits im init teil den wert des readings auszulesen (aus dem wert des readings sollen sich die namen aller anderen readings ergeben)
Das ist mW derzeit nicht möglich, da die Werte aus Fhem erst nach init geholt werden (in fhem-tablet.ui.js ab Zeile 111 wird das deutlich).
Danke nesges! "float" hatte ich nicht auf'm Plan, aber der Name sagt es ja eigentlich schon. :-[
Dank
Änderungswunsch / Verbesserung: >>WIDGET - Typ: DIMMER <<
1.)
Beim Widget "dimmer" ist es so, wenn ich meine lightify-Lampe ausschalte, dass der Regler zwar bei 0 steht und die Lampe auch aus ist, dass Icon aber ist weiterhin aktiv.
Bug? oder ist das Verhalten nur in Verbindung mit HUE-Devices?
2.)
Beim einschalten einer solchen Lampe über den Dimmer, wäre eine Erweiterung im Bezug auf das automatische setzten des Regler auf z.B. 10 sehr praktisch.
Sprich, klickt man das Symbol an springt dieses erstmal auf 10, oder auf einen benutzerspezifischen Wert.
Ich quäle mich gerade mit dem Osram Lightfy Teil rum. Die App will eine Registrierung von mir und sich mit einem Cloud-Server verbinden. Ein absolutes no-go für mich. Hätte ich mal vorher darüber was lesen müssen.
Kann man den Gateway auch anders mit dem Wlan-Router verbinden? Ansonsten geht das Teil am Montag gleich wieder zurück. :(
Hallo, erst einmal vielen Dank für diese UI sie ist echt super, nun habe ich als anfänger erst einmal 2 Fragen.
1. habe heute ein Update gemacht, nun ist im Multimedia Bereich die Zahl im Regler verschwunden .... warum ???
2. Habe versucht über die Fensterkontakte einen Bewegungsmelder anzeigen zu lassen.
<div data-type="contact" data-device="IT_Bewegungsmelder1" class="narrow"></div> <div data-type="label" class="narrow darker small">B-Melder1</div>
leider ist es mir so nicht gelungen.......wie kann ich mir anzeigen lassen ob ein bewegungsmelder geschaltet hat und dazu die Aussemlampe ???
Hallo hotwebnet,
zu 1.: Mhmmm, sind wirklich alle *.js und *.css Files aktualisiert bei dir?
zu 2.: Welches Reading willst du anzeigen? Wenn STATE, dann passt es so, wenn es ein anderes Reading sein soll, dann muss man noch data-get="anderesreading" angeben. Welche Werte hat das Reading in den verschiedenen Status? Sicherlich muss man noch data-get-on="xxxx" und data-get-off="xxx" setzen. Default ist passend für Fenster-Kontakte noch open und closed. In der Readme steht das noch falsch.
Das widget "contact" heißt jetzt "symbol", bitte benennt das bei Gelegenheit mal um.
Zitat von: bjoernbo am 28 März 2015, 21:51:20
Änderungswunsch / Verbesserung: >>WIDGET - Typ: DIMMER <<
1.)
Beim Widget "dimmer" ist es so, wenn ich meine lightify-Lampe ausschalte, dass der Regler zwar bei 0 steht und die Lampe auch aus ist, dass Icon aber ist weiterhin aktiv.
Bug? oder ist das Verhalten nur in Verbindung mit HUE-Devices?
2.)
Beim einschalten einer solchen Lampe über den Dimmer, wäre eine Erweiterung im Bezug auf das automatische setzten des Regler auf z.B. 10 sehr praktisch.
Sprich, klickt man das Symbol an springt dieses erstmal auf 10, oder auf einen benutzerspezifischen Wert.
Schick mal die Werte, die das gelesene Reading jeweils annimmt. Eigentlich habe ich es so gedacht, das der eingestellte DimWert bestehen bleibt und bei Wiedereinschalten, weiter genutzt wird.
Mein Lightify geht ungenutzt nächste Woche zurück. Die Zwangsregistrierung lehne ich ab.
Noch einmal alle neu runtergeladen, der Fehler ist aber immer noch da ???
das mit der Zahl hatte ich auch!
Ich verwende Volume für die Lampen, aber vielleicht gibt dir meine Einträge Aufschlüsse
Zitat<div class="container">
<div class="cell"> </div>
<div class="center">
<div data-type="dimmer" data-device="lightify_ben" data-set="pct" data-get="pct"
data-get-on="[0-9]{1,3}|on"
data-get-off="off"
class="cell"></div>
</div>
<div class="left">
<div data-type="volume" data-device='lightify_ben'
data-min='0'
data-max='65535'
data-get='hue'
data-set='hue'
class="cell hue-tick"><div class="cell"> </div>
</div>
</div>
<div class="cell"> </div>
<div class="right">
<dic class="cell"> </div>
<div data-type="volume" data-device="lightify_ben" data-get="ct" data-set="ct" data-min="154" data-max="500" class="cell"></div>
</div>
ich habe aber nichts verändert, also müsste es doch gehen ???
Zitat von: hotwebnet am 28 März 2015, 23:44:24
1. habe heute ein Update gemacht, nun ist im Multimedia Bereich die Zahl im Regler verschwunden .... warum ???
Passiert wenn Javascript-Fehler auftreten. Was sagt die Javascript-Konsole?
Es liegt am nicht existierenden Device in der Vorlage.
Zitat von: hotwebnet am 29 März 2015, 15:34:55
ich habe aber nichts verändert, also müsste es doch gehen ???
Ich konnte den Fehler nachvollziehen. Er passiet, wenn ein Devicename konfiguriert ist, welcher keine richtige Werte liefert. Dann wird die Funktion vorher verlassen und das Element nicht visible gesetzt. Das passiert meist bei der orignal index.html von Github ohne Änderung auf die eigenen Devices. Ich habe das zwar jetzt geändert, das Element zeigt in jeden Fall eine Zahl, aber man ist trotzdem nicht mit einem Fhem Device verbunden. In deinem Screenshot sieht man auch die Thermostaten mit Wert 10°. Das sieht nach Default-Value aus, also, es wurde kein reeler Wert empfangen. Man muss unter data-device einen Device-Namen eintragen, den es auch gibt.
Vielen Dank, ich habe es verstanden und nun geht es auch wieder nach deinem update....
Danke
warum ist / sind eigentlich fgcolor / die farbeinstellungen nicht dokumentiert für das thermostat widget >:(
ich habe mir hier nen wolf gesucht wie ich die desired-temp anderst darstellen kann... ;D
mal mein ergebnis für heute. die kalender-daten werden von einem calview widget geholt ;). leider kann das aktuell nur (eine durch den user festgelegt anzahl) "t_xxx_..." termine von calview und die anzahl termine heute / anzahl termine morgen anzeigen, aber das schaff ich auch noch (hoffentlich).
Wow chris1284,
das gefällt mir sehr sehr gut. Nur noch den Grauton den Button im OFF Status etwas heller machen und es sieht wunderschön als Bright Theme des FHEM Tablet UI aus. Was hast du alles geändert? Ist es schon veröffentlichbar?
Wir haben auch schon über ein Farbschema nachgedacht, genau das wäre das zweite offizielle Schema, was ich anbiete würde.
data-type="switch" data-off-background-color="#999999"
möchte dir auch für die super Arbeit gratulieren, ich finde es auch wunder schön. Würde mich freuen wenn ihr so etwas auch noch raus bringt.
Habe aber immer noch ein Problem beim Bewegungsmelder.
<div data-type="symbol" data-device="IT_Bewegungsmelder1" class="narrow"></div>
<div data-type="label" class="narrow darker small">B-Melder1</div>
<div data-get="state"/div>
<div data-get-on="1"/div>
<div data-get-off="0"/div>
das Fenster was als bewegungsmelder reagieren soll geht immer noch nicht auf....
steht wirklich "1" und "0" im state? Poste mal die vollständigen Werte. Evtl. müsste man auch mit RegEx arbeiten.
hier einmal zwei Bilder einmal Bewegungsmelder an und einmal aus.....
Hall hotwebnet,
Da steht doch off und on und nicht 1 und 0
Sent from my iPad using Tapatalk
Hatte noch mit dem reading "Dim" gespielt......das gibt 1 und 0 aus....
<div data-type="symbol" data-device="IT_Bewegungsmelder1" class="narrow"></div>
<div data-type="label" class="narrow darker small">B-Melder1</div>
<div data-get="state"/div>
<div data-get-on="on"/div>
<div data-get-off="off"/div>
so steht es jetzt bei mit in der index.html
am Fenster passiert aber nichts .........
Hallo chris1284,
was für eine Cam hast du da im Büro? Ich habe heute ein JS in mein UI eingebaut mit welchem ich die Kamera steuern kann.
Ich habe FOSCAM's im Einsatz.
Zitat von: hotwebnet am 29 März 2015, 21:17:15
Hatte noch mit dem reading "Dim" gespielt......das gibt 1 und 0 aus....
<div data-type="symbol" data-device="IT_Bewegungsmelder1" class="narrow"></div>
<div data-type="label" class="narrow darker small">B-Melder1</div>
<div data-get="state"/div>
<div data-get-on="on"/div>
<div data-get-off="off"/div>
so steht es jetzt bei mit in der index.html
am Fenster passiert aber nichts .........
Soll das Label schalten oder das Symbol?
Für das Symbol würde ich das so machen:
<div data-type="symbol" data-device="IT_Bewegungsmelder1"
data-icon="fa-user"
data-on-color="IndianRed"
data-get-on="on"
data-get-off="off"
class="narrow"></div>
Ein Label, was den Status anzeigt, könnte so gehen:
<div data-type="label" data-device="IT_Bewegungsmelder1" data-get="state" class="cell"></div>
@hotwebnet: Wie hast du den Bewegungsmelder in FHEM integriert? Ich habe meine IT nicht rein bekommen und daher die Funksteckdose über den Bewegungsmelder direkt gekoppelt.
Zitat von: setstate am 29 März 2015, 20:12:34
Nur noch den Grauton den Button im OFF Status etwas heller machen
danke für die info. habs gleich noch geändert, sieht besser aus.
ich habe in der css etwas rumgespielt und einigen elementen per style ein paar eigenschaften gegeben.
ich werde morgen mal durch winmerge jagen und die änderungen an der css durchgeben + die styles der index.html
was meinst du genau.........
habe meinen CUL1 mit der neuen HEX 1.02.00 geflasht und dann erkennt FHEM den Bewegungsmelder automatisch.
hier die HEX
https://www.mediafire.com/folder/tf16radvztfd9/a-culfw
aaah, ok. dann muss ich meinen die Tage auch mal falshen. Danke für den Hinweis!
sollte man in thermostat noch sowas wie date-name="Mein Anzeigename" mit einbauen, so das unter valve noch optional ein name mitgegeben werden kann? hätte den vorteil kein label zu brauchen welches teils schlecht genau mittig unter dem thermostat zu platzieren geht (und der abstand zwischen thermostat und label wäre nicht so unnötig groß). ich fänds gut
super, es geht habe es so jetzt gemacht
<div data-type="symbol" data-device="IT_Bewegungsmelder1"
data-icon="fa-user"
data-on-color="IndianRed"
data-get-on="on"
data-get-off="off"
class="narrow"></div>
<div data-type="label" class="narrow darker small">B-Melder1</div>
das gleiche versuche ich jetzt mit der Steckdose die der Bewegungsmelder schaltet.
Erstmal vielen, vielen Dank fuer dieses coole Projekt. Auf so etwas habe ich lange gewartet!
Im Moment habe ich allerdings noch ein paar Schwierigkeiten und Fragen, ich hoffe einer von euch kann mir helfen.
- Beim Homestatus habe ich das Problem das ich beim Tablet das Feld in der Mitte "Home" nicht anwaehlen kann, egal was ich mache. Am Laptop mit Maus klappt es einwandfrei.
- Ich habe einen notify wie folgt eingebunden:
<div data-type="push" onclick="setFhemStatus('trigger LightAll on')" class="cell"></div>
<div data-type="label" class="cell">An</div>
Auswaehlen kann ich das uebers Tablet, der Button leuchtet auch kurz auf, aber es passiert nichts. Auch hier funktioniert das Ganze wenn ich ueber das Laptop probiere.
- Wo kommen denn die buttons(play, stop, etc) fuer XBMC/KODI her? Das habe ich bisher auch nirgends gefunden
Danke schonmal fuer eure Hilfe!
Zitat von: hillbicks am 29 März 2015, 22:11:06
- Ich habe einen notify wie folgt eingebunden:
<div data-type="push" onclick="setFhemStatus('trigger LightAll on')" class="cell"></div>
<div data-type="label" class="cell">An</div>
Im FHEM Tablet UI Style sieht es eher so aus:
<div data-type="push" data-device="LightAll" data-cmd="trigger" data-set="on" class="cell"></div>
Zitat von: setstate am 29 März 2015, 22:28:06
Im FHEM Tablet UI Style sieht es eher so aus:
<div data-type="push" data-device="LightAll" data-cmd="trigger" data-set="on" class="cell"></div>
Ha, wunderbar! Damit klappt es jetzt auch. Ich muss zugeben das ich bisher auch nicht alle 30 Seiten des Threads gelesen habe, sondern mich eher an der Beschreibung auf github orientiert habe. Vielleicht kann man da das data-cmd mit aufnehmen? Oder habe ich eine Passage uebersehen die das erklaert?
Zitat von: chris1284 am 29 März 2015, 21:54:20
sollte man in thermostat noch sowas wie date-name="Mein Anzeigename" mit einbauen, so das unter valve noch optional ein name mitgegeben werden kann? hätte den vorteil kein label zu brauchen welches teils schlecht genau mittig unter dem thermostat zu platzieren geht (und der abstand zwischen thermostat und label wäre nicht so unnötig groß). ich fänds gut
Kann man eigentlich alles gut per CSS regeln. Tipp: Mit negativen Abständen ala
margin-top:-20px !important experimentieren
Zitat von: nesges am 29 März 2015, 22:43:38
Kann man eigentlich alles gut per CSS regeln. Tipp: Mit negativen Abständen ala margin-top:-20px !important experimentieren
Man könnte auch mit der verfügbaren CSS Klasse 'narrow' probieren, das Label Element näher zu positionieren:
<div class="cell">
<div data-type="contact" data-device="TerrassenTuer" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terassentür</div>
</div>
Zitat von: hillbicks am 29 März 2015, 22:36:39
Ha, wunderbar! Damit klappt es jetzt auch. Ich muss zugeben das ich bisher auch nicht alle 30 Seiten des Threads gelesen habe, sondern mich eher an der Beschreibung auf github orientiert habe. Vielleicht kann man da das data-cmd mit aufnehmen? Oder habe ich eine Passage uebersehen die das erklaert?
Hallo hillbicks,
schön, dass es jetzt klappt und vielen Dank für den Hinweis mit der Readme. Ich habe es auch gleich aktualisiert.
Zitat von: nesges am 29 März 2015, 22:43:38
Kann man eigentlich alles gut per CSS regeln. Tipp: Mit negativen Abständen ala margin-top:-20px !important experimentieren
Daumen hoch, danke!
Hallo, kann ich die Container auch fixieren, ich verschiebe die immer auf meinem Tablet
guck mal tread 408
Zitat<meta name='gridster_disable' content='1'>
Danke, ich hatte es schon einmal gelesen, aber nicht mehr gefunden....
Habe mal eine Frage: Einige von euch haben ja bereits erfolgreich den Kalender integriert. Daran habe ich mich heute versucht. Eigentlich ganz erfolgreich, allerdings geht beim Update des Kalender mein Raspberry Pi B+ mächtig in die Knie. Ich habe eine Auslastung von 98% und das über einen Zeitraum von 20 Minuten bis der Googlekalender "upgedatet" ist. Das Verhalten hatte ich schon vor einigen Monaten und habe mich dann vom KalenderView verabschiedet und mir stattdessen eine "abfallkalender.holiday"-Datei erstellt.
Hat jem. ggf. schon mal versucht für das UI auch solche Dateien auszuwerten und als Kalender darstellen zu lassen? Ist das möglich?
Beispiel: "abfallkalender.holiday"
Zitat# Abfuhrkalender 2015
# Restmüll
# Papier
# Leichtverpackungen
# Kellerdienst
1 01-28 Kellerdienst
1 01-30 Leichtverpackungen
1 02-04 Kellerdienst
1 02-05 Papier
1 02-09 Restmüll
1 02-13 Leichtverpackungen
1 02-23 Restmüll
1 02-27 Leichtverpackungen
1 03-04 Kellerdienst
1 03-05 Papier
1 03-09 Restmüll
1 03-13 Leichtverpackungen
1 03-23 Restmüll
1 03-27 Leichtverpackungen
1 04-01 Papier
1 04-01 Kellerdienst
1 04-07 Restmüll
1 04-11 Leichtverpackungen
1 04-20 Restmüll
1 04-24 Leichtverpackungen
1 04-30 Papier
das ganze sieht in FHEM dann so aus:
(//)
...das mit "in X Tagen" benötige ich nicht. Das Datum reich vollkommen aus!
Zitat von: bjoernbo am 30 März 2015, 22:19:46
geht beim Update des Kalender mein Raspberry Pi B+ mächtig in die Knie...
habe mich dann vom KalenderView verabschiedet
das sind 2 verschiedene module. zur problemlösung hatte ich dir ja schon geraten mal den entwickler des calendar-moduls anzusprechen (da du auch der erste mir bekannte mit dem problem bist).
ZitatHEM/57_Calendar.pm borisneubert http://forum.fhem.de Unterstuetzende Dienste
zum anderen versuch mal genau zu klären wer den pi auslastet (CALNEDAR oder CalView).
da mein calview-widget bisher gut bei mir funktioniert (und auch jemadn hier ein per gute "per hand lösung" gepostet hat). ist evtl einfacher als eine holiday-datei auszulesen / das problem zu umgehen als es zu lösen ;)
;D jetzt muss ich mal überlegen.....
Nicht das ich ws verwechsle. Der View setzt ja den Kalender voraus, richtig? Der View als solches ist ziemlich flott. Der bereitet keine Probleme. Der Kalender, also dort wo ich den Pfad zu Google hinterlege, welcher alle 12 Stunden eine Aktuallisierung vornimmt, haut den PI aus den Socken.
Hatte gestern Abend erstmal alles wieder gelöscht. Dafür aber im gleichem Zug den Raspberry Pi 2 bestellt ;D. Wenn der morgen da ist, werde ich am WE einen Umzug vorbereiten und den Kalender nochmal einbauen und feedback geben.
Neues widget: weather
Das widget kopiert das Standard label-Widget und reduziert es auf die bereits enthaltene Wetter-Icon-Funktion. Ergänzt sind die Wetterbezeichnungen des Moduls Weather (fhem.de/commandref.html#Weather), das Wetterdaten von Yahoo bezieht. Die Screenshots im Anhang zeigen komplexe Beispiele, die das Widget einbinden. HTML-Code zum ersten befindet sich in der Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/#weather. Der zweite Screenshot benutzt das mit fhem ausgelieferte, alternative imageset "kleinklima"
Hallo geneigte User,
heute mal wieder ein kleines Update:
New Feature: "circleMenu"Damit kann man unter einem einzigen Button, viele andere verstecken, die man selten braucht oder ähnlich einem Kontextmenü.
So sieht der HTML Code aus:
<div class="left">
<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>
<div data-type="label" class="cell">Woofer</div>
</div>
In der index.html muss dazu die extra Library circleMenu.js eingebunden werden:
Zitat<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
So sieht es aus:
(http://knowthelist.github.io/fhem-tablet-ui/circle_menu.png) (http://knowthelist.github.io/fhem-tablet-ui/circle_menu_open.png)
Cool! Das circleMenu schafft endlich Platz in der "Favoriten-Ecke" :-) Danke dafür!
Nur ne Kleinigkeit: Die Änderung in der fhem-tablet-ui.css
.cell:not([data-type="label"]) {
min-height: 52px;
min-width: 52px;
}
zerschiesst mir's Layout, weil die Abstände zwischen den Widgets nicht mehr passen.
Zitat von: nesges am 31 März 2015, 23:40:22
Neues widget: weather
Das widget kopiert das Standard label-Widget und reduziert es auf die bereits enthaltene Wetter-Icon-Funktion. Ergänzt sind die Wetterbezeichnungen des Moduls Weather (fhem.de/commandref.html#Weather), das Wetterdaten von Yahoo bezieht. Der Screenshot im Anhang zeigt ein komplexes Beispiel, das das Widget einbindet. HTML-Code dazu in der Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/#weather
'nabend nesges,
sehr gute Idee, Label und Weather zu trennen. Ist viel übersichtlicher und verständlicher. Hat mich auch schon etwas gestört, das aufgepumpte Label-Widget.
Vorschlag: Ich entschlacke das Label Widget wieder und kopiere das Weather Widget ins Hauptrepository ...
Bonsoir nesges,
Bonsoir setstate,
danke für die grossartige Arbeit!
finde beide neue Widgets toll!
und das UI sowieso! Um es bei steigender Komplexität weiterhin visuell reduziert zu halten ist grade der circle Button toll!
Beim neuen Wetter.widget würde ich mir sowas ähnliches wünschen: erst wird nur das Wetter icon gezeigt, beim click wird das widget grösser und zeig mehr Daten; nach ca 2. sec schrumpfts wieder zusammen. So ähnlich wie das Dimmer widget.
Ich (NOOB!) hab das Gefühl das die Möglichkeiten von Gridster hier (statisch) noch nicht so richtig genutzt werden; toll würd ich es finden wenn sich ein Grid-Element bei Bedarf vergrößert, und dann nach getaner User Eingabe auch wieder verkleinert.
So könnte man total elegant nur einen Knopf für z.b. eine HUE-Lampe haben. Normalerweise ein/aus - bei einem langen click jedoch werden die entsprechenden Regler für Farbe / Helligkeit eingeblendet.
So könnte man auch die Thermostat.widgets mit der von manchen gewünschten Boost/on/off Funktion erweitern.
Ein Standard Rolladen Button wäre rauf/runter ein longpress/extended würde verschiedene Zwischenstufen einblenden.
Ein Lichtschalter könnte für alle Lampen im Zimmer gelten, longpress zeigt die einzelnen Lampen.
etc...
So stell ich mir zur Zeit das perfekte UI vor! ;D
die wenigen relevanten Daten /Knöpfe sichtbar, das komplexere bei Bedarf, und eigentlich sollte es ja eh automatisch gehen ::)
my 2cents
merci encore für die bisherige Arbeit,
Alex
Zitat
zerschiesst mir's Layout, weil die Abstände zwischen den Widgets nicht mehr passen.
Mmmm, schade. Das ist für das notwendige div vor dem ul menu.
<div class="cell">
<ul class="menu">
Dann müssen wir für solche Zellen einen neuen Class Namen einführen "cellforce" (oder andere vorschlag)
<div class="cell cellforce">
<ul class="menu">
und im CSS
.cellforce {
min-height: 52px;
min-width: 52px;
}
Zitat von: setstate am 01 April 2015, 00:31:49
Vorschlag: Ich entschlacke das Label Widget wieder und kopiere das Weather Widget ins Hauptrepository ...
Von mir aus sehr gerne! Wobei ich mir bei der Zuordnung von Bezeichnern und Meteocons noch nicht so ganz sicher bin ob's überall passt.
@alex: Das sind sehr gute Ideen! Das meiste davon übersteigt meine JS-Fähigkeiten allerdings - hoffen wir auf setstate ;)
Zitat von: setstate am 01 April 2015, 00:37:28
Mmmm, schade. Das ist für das notwendige div vor dem ul menu.
Japp, hatte das jetzt schon überschrieben und bei den Menü-divs von Hand eingefügt, funktioniert dann auch (bis auf ein seltsames Positionierungsproblem, das ich grade noch nicht verstehe). Vorschlag für den class-Name: "circlemenu" ;-)
Ein zweites Problem: Bei zwei sich überlappenden circleMenus erscheinen die ausgefahrenen Buttons des zweiten unter denen des ersten.
<ul class="menu" style="z-index:1000"> behebt's.
Edit: Und sie erscheinen immer unter Widgets die im HTML nach dem Widget, das die circleMenus enthält, notiert worden sind. Egal wie hoch z-index gesetzt wird. Ändert man die Reihenfolge im HTML passt's wieder.
Edit2: Der Screenshot zeigt beide Probleme. Oben ist durch z-index:1000 lösbar, unten links durch Umstellung der HTML Reihenfolge
nach meinen Prog-kenntnissen fragt hoffentlich niemand... 8)
dachte dass eben gridster oder ähnliche dynamische Layouts relativ einfach (???) solche Möglichkeiten bieten würden....
@alex: ich finde deine Ideen auch sehr gut. Ich werde es im Auge behalten ....
Einen Vorschlag noch:
Nachdem das Projekt sich so rasant weiterentwickelt...
~35 Forums Seiten bisher
ich fände es richtig es im Forum aufzuteilen in
Entwicklung-fortschritt
Allgemeines (wie dies hier...) / Fragen / Hilfestellung
und dementsprechend auch zu bitten/drängen sich dran zu halten..
and now: good nite, A.
Edith: some
@nesges: dann kann ich das so fix in der CSS einbauen?
Zeile 164:
.menu{
position:absolute;
z-index:1000;
}
z-index:1000 ist leider auch noch nicht des Rätsels Lösung. Das funktioniert zwar für's zweite und dritte, aber dann überdecken diese wiederum das erste. Evtl. muss z-index dynamisch beim Klick auf den Auslösebutton erhöht werden - aber ich mach für heute Feierabend :)
ja, besser ist. Nacht ...
kannst mir ja mal den Teil HTML Code per direkter Mitteilung schicken, zum vor Ort Testen für mich
Edit: ich kann es bei mir nachstellen, einfach zweimal circlemenu untereinander, dann gibt es Überdeckungen. Ich suche eine Lösung ...
Genial ....=> New Feature: "circleMenu"
Darüber werde ich meine Kamera steuern! GOIL, GOIL, GOIL
ja, auch ich sage wieder einmal Danke, was Ihr macht ist echt super..........
Aber auch ich würde Vorschlagen, alles neue im Ersten Beitrag immer auf dem neusten Stand zu halten, wir bekommen sonnst bei dieser Geschwindigheit nicht alles mit und das wäre schlecht.......Danke
Habe ein Tablet mit 1366 x 786 (Volkstablet) auf diesem tablet sind die Container sowie die Schalter ein wenig klein (ich sehe halt nicht mehr so gut :-) , kann ich das alles auch ein wenig größer darstellen, habe einmal etwas gelesen von Add 'big' or 'bigger' gelesen, finde aber keinen Ansatz..........
Hallo zusammen,
auch von meiner Seite ein großes Kompliment für die Arbeit, die ihr hier macht. Meiner Meinung nach die beste Visualisierung, die es derzeit für FHEM gibt.
Ich hätte noch eine kleine Frage dazu: Ist es mit dem verwendeten Gridster Framwork denkbar, das ganze (für die alternative Verwendung mit dem Handy) auch responsive zu gestalten? Ich denke dabei an einen Ansatz wie ihn auch Pinterest oder andere Webseiten verfolgen. Hier werden immer so viele einzelne Kacheln nebeneinander dargestellt, wie sinnvoll auf das Gerät passen.
Beispiel dazu gibts hier (einfach den Browser breiter oder schmaler ziehen, dann sieht man, wie das Design umbricht):
http://media.kulturbanause.de/blog/2014/03/responsive-pinterest-style.html (http://media.kulturbanause.de/blog/2014/03/responsive-pinterest-style.html)
Viele Grüße,
Andreas
Hallo Usergmeinschaft ...
ich bin erst seit Anfang des Jahres FHEM-Infiziert , aber schon recht weit gekommen .
Ging los über RSS ,dann FLOORPLAN, dann INFOPANEL und nun zu diesem HAMMERTEIL !!
Ich bewundere diejenigen ,die dies ins Leben gerufen haben und immer noch fleißig betreuen und weiterentwickeln
Man versucht als " normaler" Anwender seine Vorstellungen umzusetzen , ist aber in manchen Punkten auf Hilfe angewiesen und das finde ich hier so großartig , kein böses Wort, kein "such doch selber"
einfach so wie es sein sollte !!!!
Nun aber zu meinem "Problem"
Ich würde gerne ein Webradio in mein UI integriere.
Im FHEM Forum und im Wki gibt es verschiedene Informationen und leider ist der Modul-Autor nicht mehr aktiv, das heißt , ich bekomme es nicht vernünftig zum "laufen" .
Gibt es nicht einen Weg über das UI , zB. einen Button der wiederum die URL des betreffenden Senders aufruft und einfach den Stream abspielt mit den Funktionen zB. PLAY,STOP ?
Zitat von: Sky am 01 April 2015, 11:29:11
Ich würde gerne ein Webradio in mein UI integriere.
Im FHEM Forum und im Wki gibt es verschiedene Informationen und leider ist der Modul-Autor nicht mehr aktiv, das heißt , ich bekomme es nicht vernünftig zum "laufen" .
Welches Modul meinst du denn?
ZitatGibt es nicht einen Weg über das UI , zB. einen Button der wiederum die URL des betreffenden Senders aufruft und einfach den Stream abspielt mit den Funktionen zB. PLAY,STOP ?
Ich habe grade eine Änderung im button-Widget eingecheckt, holt dir mal die neuste Version von https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_button.js
<div data-type="button"
data-url-xhr="http://webradio/?action=play"></div>Ruft den URL http://webradio/?action=play (den musst du natürlich anpassen) im Hintergrund auf. Weitere Möglichkeiten sind in https://github.com/nesges/Widgets-for-fhem-tablet-ui/#button dokumentiert.
Zitat von: nesges am 01 April 2015, 01:15:57
z-index:1000 ist leider auch noch nicht des Rätsels Lösung. Das funktioniert zwar für's zweite und dritte, aber dann überdecken diese wiederum das erste. Evtl. muss z-index dynamisch beim Klick auf den Auslösebutton erhöht werden - aber ich mach für heute Feierabend :)
So funktioniert's:
.menu {
position:absolute
}
.circleMenu-closed {
z-index:1000 !important;
}
.circleMenu-open {
z-index:1001 !important;
}https://github.com/knowthelist/fhem-tablet-ui/pull/30
Hallo ,
Danke für die schnelle Antwort .
Ich meinte folgendes Modul
http://www.fhemwiki.de/wiki/Modul_StreamRadio_Einrichtungshilfe
und der Thread aus :
http://forum.fhem.de/index.php?topic=18531.0
Werde heute haben mal Deinen Vorschlag versuchen ;-)
Das circleMenu mit einem push-Widget als zentralem Button funktioniert im moment nur am Desktop, nicht aber auf mobilen Geräten (getestet mit iOS Safari+Chrome und Android Chrome, Firefox und Webviewcontrol). Grund dafür ist, dass famultibutton das Click-Event nicht durchreicht (Aufruf von e.preventDefault() in den Modus push und toggle). Oder kann jemand gegenteiliges berichten?
Workarround: symbol-Widget benutzen. Es hat zwar keinen Hintergrund und ist daher mMn nicht so chick, aber es funktioniert erstmal, bis eine bessere Lösung da ist.
Zitat von: Sky am 01 April 2015, 13:21:23
Ich meinte folgendes Modul
http://www.fhemwiki.de/wiki/Modul_StreamRadio_Einrichtungshilfe
Wenn ich das nach dem überfliegen richtig verstanden habe, brauchst du eigentlich nur Befehle der Art
set <name> PLAY <StreamURL/Stationname aus Playlist>auszuführen. Dazu bietet sich das Standard-Widget push an:
<div data-type="push" data-device="<name>" data-set="PLAY <StreamURL/Stationname aus Playlist>">
Zitat von: nesges am 01 April 2015, 13:59:03
Das circleMenu mit einem push-Widget als zentralem Button funktioniert im moment nur am Desktop, nicht aber auf mobilen Geräten (getestet mit iOS Safari+Chrome und Android Chrome, Firefox und Webviewcontrol). Grund dafür ist, dass famultibutton das Click-Event nicht durchreicht (Aufruf von e.preventDefault() in den Modus push und toggle). Oder kann jemand gegenteiliges berichten?
Workarround: symbol-Widget benutzen. Es hat zwar keinen Hintergrund und ist daher mMn nicht so chick, aber es funktioniert erstmal, bis eine bessere Lösung da ist.
Komisch, bei meinem Android 4.1 funzt das perfekt. Siehe mein Beispielscode.
Den famultibutton kann ich ja noch anpassen, ist ja auch von mir :-)
Das Symbol Widget kann man aber auch noch aufhübschen. Per data-background-icon="fa-circle-thin" zum Beispiel. Oder rechteckig mit data-background-icon="fa-square" oder "fa-square-o"
Zitat von: setstate am 01 April 2015, 14:52:01
Komisch, bei meinem Android 4.1 funzt das perfekt. Siehe mein Beispielscode.
Bei mir sinds zwei Android 4.2 Geräte, aber ich will nicht ausschliessen, dass hier irgend was anderes die störende Ursache ist :) Hatte nur festgestellt, dass es funktioniert, wenn ich e.preventDefault() rauswerfe. Wenn sonst niemand Probleme damit hat, reicht mir aber die Lösung mit dem symbol+data-background-icon.
Aktuell 33 Seiten zu diesem UI sind der sichere Beweis, dass es hervorragend ankommt. Das ist doch die Gelegenheit, eine ausführliche Anleitung als pdf zu schreiben!? Mario findet die Idee gut und ich habe mit Latex begonnen zu schreiben. Nun hat Mario noch nie mit Latex gearbeitet und ich habe keine Ahnugn von Javascript. Zudem meine ich sollte Mario sich nicht auch noch um eine Doku kümmern müssen.
Kurzum, ich suche Mitstreiter, die eine Anleitung/ein Handbuch mit vielen Beispielen und Bildern schreiben und aktuell halten wollen. Gerne per PM melden!
Zitat von: mw_fhem am 01 April 2015, 15:57:26
Das ist doch die Gelegenheit, eine ausführliche Anleitung als pdf zu schreiben!?
Neugierige Frage: Warum nutzt ihr denn nicht das Fhemwiki, so dass sich alle einfacher beteiligen können? Pdfs sind zumeist statischer... Gruß, Christian
Wäre natürlich auch ne Möglichkeit. Ich persönlich bei ein Freund von pdf's und gutem Textsatz. Aber ich lasse mich gerne von der praktikableren Lösung überzeugen ;-)
Zitat von: mw_fhem am 01 April 2015, 16:21:39
Wäre natürlich auch ne Möglichkeit. Ich persönlich bei ein Freund von pdf's und gutem Textsatz. Aber ich lasse mich gerne von der praktikableren Lösung überzeugen ;-)
Erst einmal ist der Text wichtig, womit man schreibt ist persönliche Vorliebe. Ich hätte eh demnächst ein Wiki Account beantragt und hätte dann ganz frech die ersten Passagen aus dem Pdf kopiert. 8)
Zitat von: bjoernbo am 01 April 2015, 08:26:25
Genial ....=> New Feature: "circleMenu"
Darüber werde ich meine Kamera steuern! GOIL, GOIL, GOIL
Sehr schön, idealer Anwendungsfall. Aber ich befürchte, die Sub-Buttons sollen offen bleiben, bis du die Kamera ausgerichtet hast. Jetzt schließen sie sich beim ersten Push automatisch. Da folgt noch eine Option heute, die das lösen wird.
Sauber,!
das wäre cool! Dann müsste ich das JS für die Steuerung nicht "umbauen"
Update zu "weather": Kann jetzt alternatives Imageset benutzen, Screenshot in http://forum.fhem.de/index.php/topic,34233.msg280440.html#msg280440
Zitat von: setstate am 01 April 2015, 18:19:19
Erst einmal ist der Text wichtig, womit man schreibt ist persönliche Vorliebe. Ich hätte eh demnächst ein Wiki Account beantragt und hätte dann ganz frech die ersten Passagen aus dem Pdf kopiert. 8)
Naja, wir müssen die Arbeit ja nicht doppelt und dreifach machen, dann wird es wohl am einfachsten sein, alles ins Wiki zu packen.
Zitat von: setstate am 01 April 2015, 14:52:01
Komisch, bei meinem Android 4.1 funzt das perfekt. Siehe mein Beispielscode.
Den famultibutton kann ich ja noch anpassen, ist ja auch von mir :-)
Das Symbol Widget kann man aber auch noch aufhübschen. Per data-background-icon="fa-circle-thin" zum Beispiel. Oder rechteckig mit data-background-icon="fa-square" oder "fa-square-o"
Ich habe mehrere Tablets mit 4.1.1 und 4.2.2 bei allen das selbe Verhalten, multibutoon funktioniert nicht, habe auch Dolphin browser. IOS+Safari auch das selbe Verhalten, schade.
Was ich jetzt noch nicht verstanden habe wie man dafür das Symbol Widget einsetzen könnte?
Gruß
Karl
Zitat von: schka17 am 01 April 2015, 19:34:48
Was ich jetzt noch nicht verstanden habe wie man dafür das Symbol Widget einsetzen könnte?
Eigentlich tauchst du nur im ersten Widget der Liste (das ist das zentrale) den data-type "push" gegen "symbol" aus. Im Beispiel von setstate:
<div class="left">
<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="symbol" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>
<div data-type="label" class="cell">Woofer</div>
</div>Dem symbol-Widget kannst du dann noch nen Hintergrund mitgeben, dann ist der Unterschied nichtmal sichtbar:
<li><div data-type="symbol" data-icon="fa-wrench" data-background-icon="fa-circle-thin"></div></li>
Zitat von: nesges am 01 April 2015, 18:42:21
Update zu "weather": Kann jetzt alternatives Imageset benutzen, Screenshot in http://forum.fhem.de/index.php/topic,34233.msg280440.html#msg280440
Perfekt, diese Bilder sind auch nicht schlecht.
Ich versuche aber gerade das weather widget bei mir einzubinden. PROPLANTA liefert bei mir "Schneeregen", damit klappt das mapping nicht: TypeError: mapped is undefined
Zitat von: nesges am 01 April 2015, 20:06:47
Eigentlich tauchst du nur im ersten Widget der Liste (das ist das zentrale) den data-type "push" gegen "symbol" aus. Im Beispiel von setstate:
<div class="left">
<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="symbol" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>
<div data-type="label" class="cell">Woofer</div>
</div>
Dem symbol-Widget kannst du dann noch nen Hintergrund mitgeben, dann ist der Unterschied nichtmal sichtbar:
<li><div data-type="symbol" data-icon="fa-wrench" data-background-icon="fa-circle-thin"></div></li>
Ich schau gleich mal, ob man das beim Push ändern kann, ohne Nachteile. vmtl. ja
Super, danke
So funtkioniert es auch mal
Geniales Interface, danke dafür
Gruß
Karl
Zitat von: setstate am 01 April 2015, 20:09:29
Ich versuche aber gerade das weather widget bei mir einzubinden. PROPLANTA liefert bei mir "Schneeregen", damit klappt das mapping nicht: TypeError: mapped is undefined
Ah, ich hatte nur mit übersetzten Werten getestet :) Ist in https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_weather.js angepasst.
Super Arbeit hier, wirklich Klasse.
Habe mal die ersten Schritte gewagt und klappt soweit auch schon.
Allerdings funktioniert das Dimmer Widget nur im Firefox Browser (Android 5.1).
Weiß jemand Abhilfe ?
Zitat
Ich schau gleich mal, ob man das beim Push ändern kann, ohne Nachteile. vmtl. ja
Die neue Version vom fa-multi-button ist oben, damit sollte der Central-Button im circleMenu auch mit einem Push-Widget zu bauen gehen, wie im ersten Beispiel von mir.
Hallo
Unter IOS mit Safari läuft es, danke.
Gruß
Karl
Zitat von: nesges am 01 April 2015, 00:37:44
Von mir aus sehr gerne! Wobei ich mir bei der Zuordnung von Bezeichnern und Meteocons noch nicht so ganz sicher bin ob's überall passt.
Wie versprochen, nesges'
Weather Widget ist ab sofort im Standard-Repository, aber dafür ist das
Label Widget wieder das ursprüngliche (nur für Text)
Wenn also bei euch nach einem Update das Wetter-Icon weg ist, müsst ihr bei euerem Wetter Label das Attribute data-type="label" gegen data-type="weather" tauschen.
Zitat von: setstate am 24 März 2015, 23:47:13
Dieses Widget wird auch bald flexibler werden: Icons, Werte (z.Zt. 1-4). Aber man kann jetzt schon das Get-Reading und Set-Reading angeben. Was würde noch nicht klappen?
Update von
Homestatus Widget- Unterstützung von Status aus den Modulen RESIDENTS, ROOMMATE und GUEST
- Umschaltung per data-version='residents' oder 'roomate' oder 'guest'. data-version weglassen oder ein data-version='' erzeugt die generischen Werte: 1,2,3,4 für STATE.
Zitat von: andreas_r am 01 April 2015, 10:00:02
Hallo zusammen,
auch von meiner Seite ein großes Kompliment für die Arbeit, die ihr hier macht. Meiner Meinung nach die beste Visualisierung, die es derzeit für FHEM gibt.
Ich hätte noch eine kleine Frage dazu: Ist es mit dem verwendeten Gridster Framwork denkbar, das ganze (für die alternative Verwendung mit dem Handy) auch responsive zu gestalten? Ich denke dabei an einen Ansatz wie ihn auch Pinterest oder andere Webseiten verfolgen. Hier werden immer so viele einzelne Kacheln nebeneinander dargestellt, wie sinnvoll auf das Gerät passen.
Beispiel dazu gibts hier (einfach den Browser breiter oder schmaler ziehen, dann sieht man, wie das Design umbricht):
http://media.kulturbanause.de/blog/2014/03/responsive-pinterest-style.html (http://media.kulturbanause.de/blog/2014/03/responsive-pinterest-style.html)
Viele Grüße,
Andreas
Hallo Andreas, vielen Dank fürs Kompliment. Wir tun unser Bestes ... :-)
Eine Portierung auf kleinere Mobildevices ist denkbar, und das Thema hier auch schon mal am Anfang besprochen worden. Ein Wechsel von Gridster auf jquery.shapeshift wäre zum Beispiel denkbar, aber das hat zur Zeit keine hohe Prio. Ich denke aber, alternativ man kann schnell mit einer index2.html ein anderes schmaleres Layout anlegen und sich verlinken.
Ein weiteres Problem wird sein, dass die Controls nicht unbedingt verschiebetauglich sind. Sie regieren sofort mit Veränderung der Werte, weil sie fürs Tablet optimiert sind, was eine statische Anzeige machen soll.
Zitat von: setstate am 02 April 2015, 00:02:01
Wie versprochen, nesges' Weather Widget ist ab sofort im Standard-Repository, aber dafür ist das Label Widget wieder das ursprüngliche (nur für Text)
Wenn also bei euch nach einem Update das Wetter-Icon weg ist, müsst ihr bei euerem Wetter Label das Attribute data-type="label" gegen data-type="weather" tauschen.
habe nach dem update keine Icons mehr, irgendwie stehe ich scheinbar auf der Leitung, mit diesem Code sollte es doch funktionieren? So hat es gestern (bis ca. 23:00) vor dem heutigen Update auch funktioniert, aber mittlerweile habe ich die Übersicht über die Versionen verloren.
<div data-type="weather"
data-device="WetterOW"
data-get="condition"
style="font-size:250%"></div>
<div data-type="label"
data-device="WetterOW"
data-get="condition"></div>wenn jemand eine Idee hat?
Edit:
liegt an den Umlauten, habe im widget_weather.js Zeill 166 geändert
//'überwiegend wolkig' : ':mostly cloudy',
'überwiegend wolkig' : ':mostly cloudy',Habe ich da etwa irgendwo ein Problem mit den Codepages?
Gruß
Karl
Zitat von: setstate am 01 April 2015, 22:34:31
Die neue Version vom fa-multi-button ist oben, damit sollte der Central-Button im circleMenu auch mit einem Push-Widget zu bauen gehen, wie im ersten Beispiel von mir.
Ist es möglich bei den "sub-buttons" auch ein label zu hinterlegen? Ich möchte das gerne für die Lichtszenen verwenden und die Icons sind nicht aussagekräftig genug.
Gruß
Karl
Hallo ,
ich möchte nochmal auf die "Radiofunktion" zurückkommen,
folgenden Code habe ich eingesetzt :
<div data-type="push" data-device="<Eins Live>" data-set="PLAY <http://www.wdr.de/wdrlive/media/einslive.m3u>">
Nach Betätigung des Buttons ist kein Ton zu hören , weder auf dem Tablet noch in der Weboberfläche des PC .
Bei Eingabe des Links im Browsers wird man auf die richtige Streamseite geleitet und der Sender startet mit Ton.
Jetzt weiß ich nicht ,ob man unter Debian noch etwas nachinstallierten muss oder andere Codes zufügen muss .
Dadurch könnte ich auch verstehen ob das UI nur
Daten aus FHEM braucht, zum darstellen .
Ich drehe mich hier im Kreis und weiß nicht ob es daran liegt ,das der Ton über den Rasspberry kommt oder durch verlinkung des Streams automatisch auch Ton da sein müsste ??
Vielleicht wisst Ihr eine Lösung ??
@Sky
Die spitzen Klammern sind ganz schlecht im Namen, die sind nur für html zu benutzen. Also statt
data-device="<Eins Live>" So hier data-device="Eins Live" aber die genau Bezeichnung kennst nur du. Aber keine < oder > in den Attributen. Wenn sie gebraucht werden, muss man mit Quotes arbeiten.
Eine Liste von gültigen Devicenamen bekommt man im Fhem mit dem Command list im Command-Eingabe Feld.
Habe das Interface gestern installiert. Trotz geringen Kenntnissen in html hat es so weit gut geklappt. Allerdings habe ich noch kleinere Probleme. Vielleicht kann jemand helfen:
1: Habe Rolladenaktoren wired vom Typ HMW_LC_Bl1_DR. Die geben als state LEVEL_100 (wenn offen) und LEVEL_0 (geschlossen) zurück. Zum öffnen / schliessen erwarten sie allerdings den Befehl "set KU_Jalousie_Ost_03 LEVEL 100" oder dann halt 0 bzw. Zwischenstufen aber ohne 'Unterstrich' zwischen LEVEL und dem Wert! Alternativ statt 100 auch off bzw. statt 0 auch on. Je nachdem was ich als data-on bzw. data-off eingebe, wird mir die Jalousie entweder korrekt angezeigt, läßt sich aber nicht schalten oder ich habe keine Anzeige, kann aber schalten. Wie löse ich das Problem?
<li data-row="2" data-col="2" data-sizex="2" data-sizey="1">
<header>KÜCHE</header>
<div data-type="switch" data-device="KU_Jalousie_Ost_03" data-on="LEVEL_100" data-off="LEVEL_0" data-icon="fa-bars" class="cell" ></div>
<div data-type="label" class="cell">Jalousie</div>
</li>
2: Wie kann ich eine zyklische Aktualisierung bei Zustandsänderung einbauen? Ich muss jedesmal das Interface neu laden, wenn ich eine Zustandsänderung angezeigt bekommen will.
3: Habe den Homestatus mit residents eingetragen. Habe gelesen, dass es jetzt geht. Allerdings bekomme ich den Status nicht angezeigt. Liegt noch ein Fehler im Code vor? Habe alle aktuellen Module von github downgeloaded.
<li data-row="3" data-col="2" data-sizex="2" data-sizey="2">
<header>ANWESENHEIT</header>
<div data-type="homestatus" data-device="SteigStr" data-version="residents" class= ></div>
</li>
Gruß Jürgen
Problem 1 selber gelöst. Geht jetzt mit:
<header>KÜCHE</header>
<div data-type="switch" data-device="KU_Jalousie_Ost_03" data-get-on="LEVEL_100" data-get-off="LEVEL_0" data-set-on="LEVEL 100" data-set-off="LEVEL 0" data-icon="fa-bars" class="cell" ></div>
<div data-type="label" class="cell">Jalousie</div>
Zitat von: schka17 am 02 April 2015, 10:37:09
Ist es möglich bei den "sub-buttons" auch ein label zu hinterlegen? Ich möchte das gerne für die Lichtszenen verwenden und die Icons sind nicht aussagekräftig genug.
Gruß
Karl
Wäre ein Versuch wert. Man bekommt aber bestimmt Platzprobleme oder bekommt nur Teile angezeigt. Ich werde heute Abend zuhause mal probieren.
Zitat von: schka17 am 02 April 2015, 10:31:09
Habe ich da etwa irgendwo ein Problem mit den Codepages?
Du nicht, aber irgendwo ist in der Übertragung was schief gelaufen, die Umlaute sind doppelt kodiert im Repository. Kannst du bitte einmal mit der Version von https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_weather.js testen und - bei Umlautwetterlage - Rückmeldung geben, ob's damit funktioniert? Danke!
Zitat von: bmwfan am 02 April 2015, 12:23:36
2: Wie kann ich eine zyklische Aktualisierung bei Zustandsänderung einbauen? Ich muss jedesmal das Interface neu laden, wenn ich eine Zustandsänderung angezeigt bekommen will.
Willst du wirklich zyklisch? Das ist bereits als shortpollInterval aktiv und Standardmässig auf 30s, bzw. bei aktivem longPoll auf 15min eingestellt (fhem-tablet-ui.js Zeilen 24 u. 165). Ansonsten eher longPoll (fhems eventgesteuerter Benachrichtungsdienst) in fhem und im UI aktivieren. Ist aber beides standardmässig aktiv, bitte kontrolliere in fhem:
list WEBsollte eine Zeile "longpoll 1" anzeigen ("WEB" ggf. durch deine FHEMWEB-Instanz ersetzen) und im HTML Code des UI sollte die Zeile
<meta name="longpoll" content="1">enthalten sein. Wenn das beides gegeben ist, passiert die Aktualisierung wahrscheinlich deshalb nicht, weil data-get (-on/off) falsch definiert sind. In dem Fall im fhem Eventmonitor schauen, was bei Statusänderung tatsächlich gesendet wird.
Edit: Da die Frage öfter kommt, habe ich dazu mal eine FAQ angelegt: https://github.com/knowthelist/fhem-tablet-ui/wiki/FAQ
Bitte ergänzen, korrigieren, erweitern :)
Ich weiß nicht, ob ich es schonmal geschrieben habe, falls doch, sorry für den Doppelpost: Ich finde das Interface absolut klasse!
Ich hätte nur einen Wunsch oder einen Verbesserungsvorschlag:
Wäre es vielleicht möglich, eine Art Meldung oder so einzubauen die irgendwie getriggert wird?
Also das z.B. bei einem Alarm eine Rote Meldung im Vordergrund eingeblendet wird o.ä.?
Zitat von: selfarian am 02 April 2015, 13:41:51
Wäre es vielleicht möglich, eine Art Meldung oder so einzubauen die irgendwie getriggert wird?
Also das z.B. bei einem Alarm eine Rote Meldung im Vordergrund eingeblendet wird o.ä.?
Sowas? ;)
<div data-type="symbol"
data-device="ALARM"
data-get="active"
data-get-on="on"
data-get-off="off"
data-icon="fa-exclamation-triangle"
data-background-icon="fa-circle"
data-on-color="#ffffff"
data-on-background-color="#ff0000"
data-off-color="rgba(0,0,0,0)"
data-off-background-color="rgba(0,0,0,0)"
style="font-size:250px;top:20px;left:150px;position:absolute;z-index:9999;pointer-events:none;"></div>Muss allerdings ausserhalb(!) des <div class="gridster"> notiert werden.
So, ein erster Schritt ist getan - ich habe einen Artikel im Wiki begonnen (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI). Und hoffe natürlich darauf, dass sich einige finden, die mithlefen dieses tolle UI zu dokumentieren. :)
Zitat von: mw_fhem am 02 April 2015, 14:46:03
So, ein erster Schritt ist getan - ich habe einen Artikel im Wiki begonnen (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI). Und hoffe natürlich darauf, dass sich einige finden, die mithlefen dieses tolle UI zu dokumentieren. :)
Das hat sich ja schön überschnitten, hab grade unter https://github.com/knowthelist/fhem-tablet-ui/wiki/FAQ einen ersten Artikel angelegt. Wie sollen wir's machen? Von dort ins fhemwiki umziehen? Vom fhemwiki dorthin linken?
Nicht dass ich auf meiner Lösung bestehen würde, aber ich denke im Wiki ist es besser aufgehoben, da es dort vlt. eher gefunden wird.
@nesges: Beides gecheckt und war bereits aktiv. Wie von Dir richtig vermutet waren es nicht die richtigen Stati, die ich abgefragt habe. Jetzt geht es.
Weis noch jemand was zu Punkt 3? Bekomme den Homestatus weder mit residents noch mit roommate angezeigt. Habe zum Test verschiedene Varianten eingegeben (auch als switch), aber keine funktioniert.
<li data-row="3" data-col="2" data-sizex="2" data-sizey="2">
<header>ANWESENHEIT</header>
<div data-type="homestatus" data-device="SteigStr" data-version="residents" class=""></div>
</li>
<li data-row="2" data-col="4" data-sizex="2" data-sizey="1">
<header>ANDREAS</header>
</li>
<li data-row="3" data-col="3" data-sizex="3" data-sizey="2">
<header>ANWESENHEIT-Test</header>
<div class="centered container">
<div class="left">
<div type="homestatus" device="rr_Juergen" data-version="roommate" class=""></div>
</div>
<div class="left">
<div type="symbol" device="rr_Petra" data-icon="fa-user" data-get-on="home" data-get-off="absent" data-devicetype="roommate" class="cell"></div>
<div type="label" class="cell">Petra</div>
</div>
<div class="left">
<div type="switch" device="rr_Andreas" class="cell" data-icon="fa-user" data-devicetype="PRESENCE"></div>
<div type="label" class="cell">Andreas</div>
</div>
<div class="left">
<div type="switch" device="OMW" class="cell" data-icon="fa-suitcase" data-devicetype="dummy10"></div>
<div type="label" class="cell">OMW</div>
</div>
<div class="left">
<div type="switch" device="OPT_PARTY" class="cell" data-icon="fa-glass" data-devicetype="dummy10"></div>
</div>
</div> </li>
Gruß Jürgen
Zitat von: nesges am 02 April 2015, 14:30:59
Sowas? ;)
<div data-type="symbol"
data-device="ALARM"
data-get="active"
data-get-on="on"
data-get-off="off"
data-icon="fa-exclamation-triangle"
data-background-icon="fa-circle"
data-on-color="#ffffff"
data-on-background-color="#ff0000"
data-off-color="rgba(0,0,0,0)"
data-off-background-color="rgba(0,0,0,0)"
style="font-size:250px;top:20px;left:150px;position:absolute;z-index:9999;pointer-events:none;"></div>
Muss allerdings ausserhalb(!) des <div class="gridster"> notiert werden.
Genau! Dankeschön!
Freunde des gepflegten UI !
Wo liegt mein Fehler????
circlemenu.js liegt im lib Verzeichnis! entsprechender Eintrag ist in der HTML Datei eingetragen
Zitat<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
Zitat<li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
<div class="left">
<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>
<div data-type="label" class="cell">woofer</div>
</div>
</li>
HAT SICH ERLEDIGT !!! FEHLER GEFUNDEN !!! MEIN FEHLER !!!
Zitat von: bjoernbo am 02 April 2015, 16:36:34
Wo liegt mein Fehler????
Die CSS-Klassen "cell" und "circlemenu" vertragen sich nicht.
Hallo zusammen,
auch von mir gibt es großes Kompliment für die Arbeit, ein tolles Tablet UI.
Bisher war ich nur ein aufmerksamer Leser des Forums und Wiki.
Auch ich habe seit Januar mich mit dem FHEM Thema beschäftigt und habe mit dem HMLAN die Heizungs- und Lichtsteuerung, EM1010PC per USB für den Stromzähler, mit der Fitzbox Anrufe, verpasste Anrufe und das Gäste WLAN ein/aus, Abfallkalender und die Wetter Daten per Yahoo oder Proplant im Integriert, für die Trends habe ich das geniale widget_klimatrend eingesetzt.
Zu den Wetterdaten habe ich zusätzlich eine Art Windrose aus den Anfängen des volume widget rudimentär angepasst und dazu habe eine Frage ob ihr das widget_wind_direction.js mit den Himmelsrichtungen erweitern bzw. verschönern ;) und die Regel/Update-funktion herausnehmen könnt , leider fehlt mir dazu die Idee und Verständnis. Den Namen könnt ihr natürlich ändern.
Gruss Michi
ich muss innerhalb vom circlemenu ein js ausführen. beide beigefügten Codes funtzen nicht
die frage ist ob es generell funktionieren würde ????
Zitat<div class="left">
<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-sliders"></div></li>
<li><a href="javascript:doCam1('command=6&onestep=7',1)"><div data-type="push" data-icon="fa-arrow-up"></a></div></li>
....
Zitat<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-sliders"></div></li>
<li><div data-type="push" data-icon="fa-arrow-up"><a href="javascript:doCam1('command=6&onestep=7',1)"></a></div></li>
....
Zitat von: bjoernbo am 02 April 2015, 17:14:57
ich muss innerhalb vom circlemenu ein js ausführen. beide beigefügten Codes funtzen nicht
die frage ist ob es generell funktionieren würde ????
Entweder den Link oder den Push button. Beiden nacheinander dürfte nicht funktionieren. In den Push ein onclick mit dem Java Script, würde ich probieren.
Sorry für meine kurzen Antworten. Ich sitze zur Zeit in der Bahn nur mit dem Telefon.
Zitat von: bmwfan am 02 April 2015, 15:44:22
Weis noch jemand was zu Punkt 3? Bekomme den Homestatus weder mit residents noch mit roommate angezeigt. Habe zum Test verschiedene Varianten eingegeben (auch als switch), aber keine funktioniert.
Das würde ich mir heute Abend nochmal anschauen. Ich muss zugeben, ich habe nur Senden probiert. Die Toast- Nachrichten sahen gut aus. Ich habe kein Residents bei mir konfiguriert.
Zitat von: michiatlnx am 02 April 2015, 17:07:34
Zu den Wetterdaten habe ich zusätzlich eine Art Windrose aus den Anfängen des volume widget rudimentär angepasst und dazu habe eine Frage ob ihr das widget_wind_direction.js mit den Himmelsrichtungen erweitern bzw. verschönern ;) und die Regel/Update-funktion herausnehmen könnt , leider fehlt mir dazu die Idee und Verständnis. Den Namen könnt ihr natürlich ändern.
Ich hab's schonmal lokal übernommen und werde mal schauen, ob ich das anpassen kann. Ziemlich witzige Idee! :)
Danke setstate!!!
so funktioniert es:
Zitat<div class="center">
<div class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-sliders"></div></li>
<li><div data-type="push" onclick="doCam1('command=0&onestep=7',1)" data-icon="fa-arrow-up"></div></li>
<li><div data-type="push" onclick="doCam1('command=4&onestep=7',1)" data-icon="fa-arrow-right"></div></li>
<li><div data-type="push" onclick="doCam1('command=2&onestep=7',1)" data-icon="fa-arrow-down"></div></li>
<li><div data-type="push" onclick="doCam1('command=6&onestep=7',1)" data-icon="fa-arrow-left"></div></li>
</ul>
</div>
<div data-type="label" class="cell">Steuerung</div>
</div>
Ich bekomme aber den "mittleren" Button nicht ausgerichtet :-/
Zitat von: bjoernbo am 02 April 2015, 17:57:00
Danke setstate!!!
so funktioniert es:
Ich bekomme aber den "mittleren" Button nicht ausgerichtet :-/
in der fhem-tablet-ui.css muss die eine Zeile noch rein, dann passt es schon mal horizontal.
Vertikal suche ich noch ...
.circlemenu {
min-height: 52px;
min-width: 52px;
display: inline-block;}
update: das hier:
<div class="cell circlemenu
wider">
jepppp.... jetzt passt es. Vielen Dank!
Unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_wind_direction.js gibt's schonmal eine neue Version des wind_direction Widgets von michiatlnx. Unnötiger Code ist entfernt, der knob ist readonly und die Bezeichnung der Windrichtung wird in der Mitte angezeigt. Muss jetzt leider weg, evtl. später mehr.
Zitat von: bjoernbo am 02 April 2015, 18:19:37
jepppp.... jetzt passt es. Vielen Dank!
Da war doch noch was offen :-) Das Offenbleiben der Sub-Menüs?
<div class="cell circlemenu wider">
<ul class="menu keepopen">
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>Mit der Class 'keepopen' erreicht man, dass die Unterbuttons offen bleiben. Nur mit Click auf den mittleren Button geht alles wieder zu.
Es müssen dafür einige Files neu von Github gezogen werden.
Ja genau! und ich bestätige hiermit das es funktioniert!!! Tolle Arbeit!
Na das ist doch genial, vielen Dank für die Schnelle Umsetzung.
Chapeau! @nesges und @michiatlnx Très chic!
wurde was am "dimmer"-Widget geändert? sehe nicht mehr die Prozentangabe.
Zitat von: bjoernbo am 02 April 2015, 19:16:14
wurde was am "dimmer"-Widget geändert? sehe nicht mehr die Prozentangabe.
Sorry, ich musste am z-index von Gridster rumschrauben, damit das circleMenu vorn ist. Dabei ist der Dimmer nach hinten gerutscht.
Ein
[data-type="dimmer"]{
z-index:2;
} hilft.
Ist auf Github geändert in der fhem-tablet-ui.css
Danke setsate, jetzt ist alles wieder OK.
Zitat von: setstate am 02 April 2015, 17:29:44
Das würde ich mir heute Abend nochmal anschauen. Ich muss zugeben, ich habe nur Senden probiert. Die Toast- Nachrichten sahen gut aus. Ich habe kein Residents bei mir konfiguriert.
Fehler gefunden und geändert. Bitte probiert es jetzt mal ...
ZitatFehler gefunden und geändert. Bitte probiert es jetzt mal ...
Test mit residents: State home, absent und gone werden korrekt angezeigt. State gotosleep aber als home.
Test mit roommate: State home wird als home angezeigt, aber auch state abwesend wird als home angezeigt.
Kann es daran liegen? Ich habe die Bezeichnungen in Deutsch geändert.
attr eventmap home:zuhause absent:abwesend gone:verreist gotosleep:bettfein asleep:schläft awoken:aufgestanden
attr devstateicon .*zuhause:user_available:absent .*abwesend:user_away:home .*verreist:user_ext_away:home .*bettfein:scene_toilet:asleep .*schläft:scene_sleeping:awoken .*aufgestanden:scene_sleeping_alternat:home .*:user_unknown
Tipp des Tages 8)
Style und Layout kann man gut per CSS class anpassen.
Zum Beispiel ein Label-Widget ist wunderbar mit sinnvollen Kombinationen von: small, large, big, bigger, thin, red, green, blue, darker, narrow oder wider anpassbar.
Damit bleibt das HTML lesbarer, allgemeingültiger und schön abstrakt.
Ich finde class="big thin" viel besser als style="font-size:250%;font-weight:lighter;"
Auch das Thermostat-Widget versteht: big und readonly
Ich werde nach und nach die Dokumentation der Optionen ergänzen.
An der Stelle: Vielen Dank an die Wikischreiber!!! Coole Sache!
Zitat von: bmwfan am 02 April 2015, 22:06:22
Test mit residents: State home, absent und gone werden korrekt angezeigt. State gotosleep aber als home.
Test mit roommate: State home wird als home angezeigt, aber auch state abwesend wird als home angezeigt.
Kann es daran liegen? Ich habe die Bezeichnungen in Deutsch geändert.
attr eventmap home:zuhause absent:abwesend gone:verreist gotosleep:bettfein asleep:schläft awoken:aufgestanden
attr devstateicon .*zuhause:user_available:absent .*abwesend:user_away:home .*verreist:user_ext_away:home .*bettfein:scene_toilet:asleep .*schläft:scene_sleeping:awoken .*aufgestanden:scene_sleeping_alternat:home .*:user_unknown
Das wusste ich nicht, dass man die einzelnen Status auch ändern kann. Daher muss ich jetzt noch mehr mögliche Varianten fest hinterlegen. Update folgt ...
ist geändert
Beschäftige mich grade auch mit dem Livestream mit einen Radio Sende........hier meine HTML code
<div data-type="button"
data-url="http://rbb-mp3-fritz-m.akacast.akamaistream.net/7/799/292093/v1/gnl.akacast.akamaistream.net/rbb_mp3_fritz_m"></div>
beim drücken vom Button geht es zur http Seite und der Livestream geht los......
ich möchte aber das es im Hintergrund läuft das müsste so gehen....
<div data-type="button"
data-url-xhr="http://rbb-mp3-fritz-m.akacast.akamaistream.net/7/799/292093/v1/gnl.akacast.akamaistream.net/rbb_mp3_fritz_m/?action=play"></div>
habe auch /?action=start oder do versucht aber leider startet der Stream nicht.... was kann ich nun noch versuchen.........
Zitat von: Haecksler am 01 April 2015, 21:29:41
Super Arbeit hier, wirklich Klasse.
Habe mal die ersten Schritte gewagt und klappt soweit auch schon.
Allerdings funktioniert das Dimmer Widget nur im Firefox Browser (Android 5.1).
Weiß jemand Abhilfe ?
Also auf meinem Handy läuft der Dimmer auch mit Chrome usw. Ist Android 4.4.
Nur mit dem Tablet funktioniert der Togglebutton mit WebView, Chrome und Dolphine nicht nur mit Firefox klappt es. Die Prozentzahl kann ich mit allen Browser andern.
Weiß jemand Rat ?
Danke!
Gruß,
Stefan
Zitat von: hotwebnet am 02 April 2015, 23:20:46
Beschäftige mich grade auch mit dem Livestream mit einen Radio Sende........hier meine HTML code
<div data-type="button"
data-url="http://rbb-mp3-fritz-m.akacast.akamaistream.net/7/799/292093/v1/gnl.akacast.akamaistream.net/rbb_mp3_fritz_m"></div>
beim drücken vom Button geht es zur http Seite und der Livestream geht los......
ich möchte aber das es im Hintergrund läuft das müsste so gehen....
<div data-type="button"
data-url-xhr="http://rbb-mp3-fritz-m.akacast.akamaistream.net/7/799/292093/v1/gnl.akacast.akamaistream.net/rbb_mp3_fritz_m/?action=play"></div>
habe auch /?action=start oder do versucht aber leider startet der Stream nicht.... was kann ich nun noch versuchen.........
Hallo hotwebnet, ich glaube nicht, dass das so funktioniert, wie du denkst. Der Stream soll auf dem Tablet (Rechner) im Hintergrund laufen? Dann müsste ein HTML5 audio Tag benutzt werden. Ich versuche mal ein Demo zu bauen ...
Update Demo liegt auf Github bereit: 'playstream" widget
<div data-type="playstream" data-url="http://radioeins.de/stream"></div>
<div data-type="label" class="darker">Radio eins</div>
neuer Tipp: eine andere Art und Weise wie man Up/Down Buttons gestalten kann:
Horizontal:
<div class="cell">
<div class="doublebox-h">
<div data-type="push" data-device="Rollo"
data-icon="fa-angle-up" data-background-icon="fa-square-o"
data-set="up">
</div>
<div data-type="push" data-device="Rollo"
data-icon="fa-angle-down" data-background-icon="fa-square-o"
data-set="down">
</div>
</div>
</div>
(http://knowthelist.github.io/fhem-tablet-ui/square-push-h.png)
Vertikal:
<div class="cell">
<div class="doublebox-v">
<div data-type="push" data-device="Rollo"
data-icon="fa-chevron-up" data-background-icon="fa-square-o"
data-set="up">
</div>
<div data-type="push" data-device="Rollo"
data-icon="fa-chevron-down" data-background-icon="fa-square-o"
data-set="down">
</div>
</div>
</div>
(http://knowthelist.github.io/fhem-tablet-ui/square-push-v.png)
wind_direction versteht jetzt auch textuelle Windrichtungen ("N", "NNW"...) und hat eine zusätzliche Größeneinstellung per CSS Klasse "tiny" bekommen.
Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/README.md#wind_direction
Neuste Version unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_wind_direction.js
Hier noch eine Idee, die ich quick&dirty umgesetzt hier abkippen muss :) Im HTML vor <div class="gridster">:
<div id="shade" style="position:absolute; z-index:1001; background-color:#000000; opacity:0.5; height:100%; width:100%; top:0px; left:0px; display:none;"></div>
In fhem-tablet-ui.js, Zeile 83ff (die mit -> markierten Zeilen):
if ($.fn.circleMenu){
$('.menu').each(function() {
$(this).circleMenu({item_diameter:50,
trigger:'click',
circle_radius:70,
direction:'full',
close_event:$(this).hasClass("keepopen")?'':'click',
-> close:function() {
-> $("#shade").css("display", "none");
-> },
open:function(){
var elem=this;
if (elem.options.close_event!=''){
timeoutMenu=setTimeout(function(){
-> $("#shade").css("display", "none");
elem.close();
},4000);
}
-> $("#shade").css("display", "block");
},
})
.closest('.gridster>ul>li').css({overflow: 'visible'});
});
$('.menu li:not(:first-child)').on('click', function(){
-> $("#shade").css("display", "none");
clearTimeout(timeoutMenu);
});
}
Effekt in den Screenshots:
ist es möglich, dass circlemenü innerhalb eines labels o.ä. zu setzen?
Idee: ich will gerne, dass innerhalb der Ausgabe des live-Bildes der Kamera, unten rechts das circlemenü einblenden.
(//)
Guten Morgen Zusammen,
erst einmal ein großes Lob an die Gemeinschaft hier für die rasante und tolle Entwicklung dieses Frontends. Auch ich als Anfänger habe es schon in Grundzügen zum Laufen gebracht und es sieht wirklich toll aus :)
In meinem Haus habe ich eine vollständige KNX-Installation die ich mittlerweile komplett über fhem steuern kann. Das Ganze wird jetzt Schritt für Schritt in das neue Tablet-UI integriert.
Was die Heizungssteuerung betrifft hänge ich aktuelle etwas. Ich kann über das thermostat-widget die Temperatur schon einstellen aber wenn ich z.B. die Temperatur in fhem oder am Wandtaster ändere wird das nicht übernommen bzw. ausgelesen.
Hier mal ein List meines EIB-Geräts zum einstellen der Temperatur:
Internals:
DEF 3/3/105
EIB_MSGCNT 14
EIB_RAWMSG B0001w336906f4
EIB_TIME 2015-04-02 23:22:34
GROUP 3369
IODev EIB
LASTGROUP 3369
LASTInputDev EIB
MSGCNT 14
NAME Studio_Hermann_SollTemp
NR 181
RAWSTATE 06f4
STATE 17.8 °C
TYPE EIB
Code:
1 3369
Readings:
2015-04-02 23:22:34 desired-temp 17.8 °C
2015-04-02 23:22:34 measured-temp 18.64 °C
2015-04-02 23:22:34 state 17.8 °C
Attributes:
IODev EIB
group 2_Temp_Soll
icon temp_control
model tempsensor
room Heizung,Studio
userReadings desired-temp { ReadingsVal("Studio_Hermann_SollTemp","state",0) ;;}, measured-temp { ReadingsVal("Studio_Hermann_Temp","state",0) ;;}
webCmd value
widgetOverride value:16,16.2,16.4,16.6,16.8,17,17.2,17.4,17.6,17.8,18,18.2,18.4,18.6,18.8,19,19.2,19.4,19.6,19.8,20,20.2,20.4,20.6,20.8,21,21.2,21.4,21.6,21.8,22
Ich habe zum Testen zwei userreadings Namens "desired-temp" und "measured-temp" angelegt. Damit funktioniert es aber auch nicht.
Jetzt das widget aus meiner index-datei:
<header>Studio Test</header>
<div data-type="thermostat"
data-device="Studio_Hermann_SollTemp"
data-temp="measured-temp"
data-get="desired-temp"
data-set="value"
data-min="16"
data-max="22"
data-step="0.2"
class="cell left"></div>
Ich kann über "data-set=value" die Temperatur einstellen und das wird auch auf "allen Seiten" aktualisiert.
Das Auslesen von "data-temp=measures temp" und "data-get=desired-temp" funktioniert aber nicht bzw. wird nicht in das tablet UI geschrieben.
Habe ja, wie oben geschrieben, diese userreadings zum Testen angelegt -> geht nicht.
Normal werden die Werte in "state" geschrieben -> geht auch nicht.
Habe mir schon gedacht ob es evtl. an der Formatierung der Readings liegt "17.8 °C" sprich an dem Zusatz hinter den Zahlen???!!
Evtl habt ihr ja eine Idee ;)
Einfach Hammer Style genau so ähnlich wollte ich das bei mir aufbauen ;) nun ist Basteln angesagt macht weiter.
Zitat von: aliate am 03 April 2015, 08:47:30
...
Ich kann über "data-set=value" die Temperatur einstellen und das wird auch auf "allen Seiten" aktualisiert.
Das Auslesen von "data-temp=measures temp" und "data-get=desired-temp" funktioniert aber nicht bzw. wird nicht in das tablet UI geschrieben.
Habe ja, wie oben geschrieben, diese userreadings zum Testen angelegt -> geht nicht.
Normal werden die Werte in "state" geschrieben -> geht auch nicht.
Habe mir schon gedacht ob es evtl. an der Formatierung der Readings liegt "17.8 °C" sprich an dem Zusatz hinter den Zahlen???!!
Evtl habt ihr ja eine Idee ;)
Hallo aliate,
ja, es liegt an der Formatierung. Das
°C muss beachtet werden. Mit einem RegEx kann man das im Code wegfiltern. Die Lösung habe ich schon fast eingebaut. Muss nur noch getestet werden. Im Laufe des Tages wird es ein Update des Thermostaten geben.
Update ist oben. Alle Interessierte können mal die widget_thermostat.js aktualisieren. Ich hoffe es hat keine negativen Seiteneffekte.
Bin mal am experimentieren mit dem "simplechart" ;D
Zitat<li data-row="2" data-col="2" data-sizex="4" data-sizey="3"> <!-- 928*655 -->
<header>Chart</header>
<div class="cell">
<div data-type="simplechart" data-device="ESA2000"
data-logfile="SVG_FileLog_ESAx000WZ_5242_1"
data-logdevice="FileLog_ESAx000WZ_5242">
</div>
Wie hinterlege ich denn die Werte die ausgelesen werden sollen? Wenn ich das richtige lese, werden die Daten aus dem LogFile gezogen, oder ?
Auszug aus dem Log-File:
Zitat2015-04-03_10:19:04 ESAx000WZ_5242 battery: ok
2015-04-03_10:19:04 ESAx000WZ_5242 type: ESAx000WZ
2015-04-03_10:19:04 ESAx000WZ_5242 CNT: 21- CUM: 851.948 CUR: 9.861 TICKS: 96 HR
2015-04-03_10:23:42 ESAx000WZ_5242 repeat: -
2015-04-03_10:23:42 ESAx000WZ_5242 sequence: 23
2015-04-03_10:23:42 ESAx000WZ_5242 total_ticks: 81933
2015-04-03_10:23:42 ESAx000WZ_5242 actual_ticks: 40
2015-04-03_10:23:42 ESAx000WZ_5242 ticks: 96
2015-04-03_10:23:42 ESAx000WZ_5242 raw: CNT: 23- CUM: 81933 CUR: 40 TICKS: 96 HR
2015-04-03_10:23:42 ESAx000WZ_5242 total: 852.791666666586
2015-04-03_10:23:42 ESAx000WZ_5242 actual: 10.9529719078829
2015-04-03_10:23:42 ESAx000WZ_5242 diff: 0.4167
2015-04-03_10:23:42 ESAx000WZ_5242 diff_sec: 277.321993112564
2015-04-03_10:23:42 ESAx000WZ_5242 diff_ticks: 81
2015-04-03_10:23:42 ESAx000WZ_5242 last_sec: 1428049422.03901
2015-04-03_10:23:42 ESAx000WZ_5242 raw_total: 853.46875
2015-04-03_10:23:42 ESAx000WZ_5242 day: 5.84375
2015-04-03_10:23:42 ESAx000WZ_5242 month: 23.8229166666667
2015-04-03_10:23:42 ESAx000WZ_5242 year: 852.791666666586
2015-04-03_10:23:42 ESAx000WZ_5242 rate: HR
2015-04-03_10:23:42 ESAx000WZ_5242 day_hr: 4.78125
2015-04-03_10:23:42 ESAx000WZ_5242 month_hr: 14.8854166666667
2015-04-03_10:23:42 ESAx000WZ_5242 year_hr: 410.979166666689
2015-04-03_10:23:42 ESAx000WZ_5242 hour: 3.25
2015-04-03_10:23:42 ESAx000WZ_5242 battery: ok
2015-04-03_10:23:42 ESAx000WZ_5242 type: ESAx000WZ
2015-04-03_10:23:42 ESAx000WZ_5242 CNT: 23- CUM: 852.792 CUR: 10.953 TICKS: 96 HR
2015-04-03_10:26:43 ESAx000WZ_5242 repeat: -
2015-04-03_10:26:43 ESAx000WZ_5242 sequence: 24
2015-04-03_10:26:43 ESAx000WZ_5242 total_ticks: 81981
2015-04-03_10:26:43 ESAx000WZ_5242 actual_ticks: 48
2015-04-03_10:26:43 ESAx000WZ_5242 ticks: 96
2015-04-03_10:26:43 ESAx000WZ_5242 raw: CNT: 24- CUM: 81981 CUR: 48 TICKS: 96 HR
2015-04-03_10:26:43 ESAx000WZ_5242 total: 853.291666666586
2015-04-03_10:26:43 ESAx000WZ_5242 actual: 9.94043438290398
2015-04-03_10:26:43 ESAx000WZ_5242 diff: 0.5000
2015-04-03_10:26:43 ESAx000WZ_5242 diff_sec: 181.078605890274
2015-04-03_10:26:43 ESAx000WZ_5242 diff_ticks: 48
2015-04-03_10:26:43 ESAx000WZ_5242 last_sec: 1428049603.11761
2015-04-03_10:26:43 ESAx000WZ_5242 raw_total: 853.96875
2015-04-03_10:26:43 ESAx000WZ_5242 day: 6.34375
2015-04-03_10:26:43 ESAx000WZ_5242 month: 24.3229166666667
2015-04-03_10:26:43 ESAx000WZ_5242 year: 853.291666666586
2015-04-03_10:26:43 ESAx000WZ_5242 rate: HR
2015-04-03_10:26:43 ESAx000WZ_5242 day_hr: 5.28125
2015-04-03_10:26:43 ESAx000WZ_5242 month_hr: 15.3854166666667
2015-04-03_10:26:43 ESAx000WZ_5242 year_hr: 411.479166666689
2015-04-03_10:26:43 ESAx000WZ_5242 hour: 3.75
2015-04-03_10:26:43 ESAx000WZ_5242 battery: ok
2015-04-03_10:26:43 ESAx000WZ_5242 type: ESAx000WZ
2015-04-03_10:26:43 ESAx000WZ_5242 CNT: 24- CUM: 853.292 CUR: 9.940 TICKS: 96 HR
Und schon das Update eingespielt, echt Klasse.
Zitat von: nesges am 03 April 2015, 02:07:30
wind_direction versteht jetzt auch textuelle Windrichtungen ("N", "NNW"...) und hat eine zusätzliche Größeneinstellung per CSS Klasse "tiny" bekommen.
Doku unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/README.md#wind_direction
Neuste Version unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_wind_direction.js
das simplechart ist noch nicht fertig 8) Deshalb gab's noch keine Info
So habe ich das bei mir am Testen, es fehlt aber noch ganz viel und wird bestimmt nicht überall laufen. Also bitte nicht soviel Zeit investieren.
<div class="container">
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung2"
data-logfile="WohnzimmerHeizung2-2015.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="10"
data-maxvalue="30"
data-daysago="0"
style="height:100px;" class="cell">
</div>
</div>
Die ColumnSpec ist hier erklärt: http://fhem.de/commandref.html#FileLog (http://fhem.de/commandref.html#FileLog) Abschnitt 'Get'
Guten Morgen,
vielen Dank auch von meiner Seite für dieses tolle UI.
Ich bin echt begeistert von Zeit und Kraft, die in dieses Projekt gesteckt wird.
Zur Zeit versuch ich, über das hier gezeigte Beispiel eine Anzeige für den Müll zu realisieren.
Allerdings gelingt es mir nicht, eigene Icons einzubinden.
Zitat von: setstate am 26 März 2015, 23:39:19
Von mir gibt es heute das verbesserte contact Widget: symbol widget
Es kann jetzt nicht nur mit einem Icon den Status eines Devices anzeigen, sondern kann optional auch mehrere Status anzeigen.
Dafür gibt es zwei neue Array Attribute
Beispiel:
<div data-type="symbol" data-device="dummy1"
data-get-on='["Wert1","Wert2","Wert3"]'
data-icons='["fa-arrow-up","fa-arrow-right","fa-arrow-down"]'
data-on-colors='["#32a054","#6666cc","#ad3333"]' >
</div>
Ich habe es schon mit diversen Pfaden und Dateinamen versucht.
Die Icons habe ich in einem Unterverzeichnis der Webseite hinterlegt.
Pfad /opt/fhem/www/tablet/icons
Folgende Angaben habe ich schon versucht:
1. "http://XXX.XXX.XXX.XXX:8083/fhem/tablet/icons/GelbeTonneIn.1.png"
2. "./icons/GelbeTonneIn.1.png"
3. "/icons/GelbeTonneIn.1.png"
Allerdings wird das Icon nie angezeigt.
Hier mein "Test"-Code
<div data-type="symbol" data-device="Muell_Sammler"
data-get-on='["nichts","GSack_Morgen","Wert3"]'
data-icons='["fa-arrow-up","/icons/GelbeTonneIn.1.png","fa-arrow-down"]'
data-on-colors='["#32a054","#6666cc","#ad3333"]' >
</div>
Hat vielleicht jemand einen Rat für mich?
Danke
@moorjunge: Leider geht das so nicht, mit keiner Pfadvariante. Die Icons sind keine Images, es wird ein Font dafür benutzt -> Font Awesome http://fortawesome.github.io/Font-Awesome/icons (http://fortawesome.github.io/Font-Awesome/icons). Das ist sehr flexibel und die Piktogramme sind zudem sehr zeitgemäß.
Ich würde fa-recycle benutzen und eine gelbe Farbe: #FFD700
<div data-type="symbol" data-device="Muell_Sammler"
data-get-on='["nichts","GSack_Morgen","Wert3"]'
data-icons='["fa-arrow-up","fa-recycle","fa-arrow-down"]'
data-on-colors='["#32a054","#FFD700","#ad3333"]' >
</div>
Auch größer ist möglich: class="bigger"
OK, dass ist schon mal gut zu wissen.
Auf das Icon war ich auch schon gestoßen, was mir dann noch fehlt ist der Hinweis, ob die Abholung "Heute" oder "Morgen" ist. Lässt sich das ganze noch um einen Text unter dem Icon ergänzen?
Gruß
Thiemo
Zitat von: setstate am 03 April 2015, 09:33:13
Hallo aliate,
ja, es liegt an der Formatierung. Das °C muss beachtet werden. Mit einem RegEx kann man das im Code wegfiltern. Die Lösung habe ich schon fast eingebaut. Muss nur noch getestet werden. Im Laufe des Tages wird es ein Update des Thermostaten geben.
Update ist oben. Alle Interessierte können mal die widget_thermostat.js aktualisieren. Ich hoffe es hat keine negativen Seiteneffekte.
Hallo setstate,
wow, danke für die schnelle Hilfe :)
Also das Anzeigen der gesetzten Temperatur im thermostat geht jetzt, auch measured-temp wird angezeigt.
Mir ist jetzt aber aufgefallen, dass longpoll nicht mehr zu gehen scheint, außerdem werden Temperatureinstellungen welche ich im frontend mache nicht mehr weitergegeben (data-set="value"). Das hat vorher schon super funktioniert, jetzt passiert nichts mehr :-/
Bei "Eingaben" im frontend kam ja immer diese "toast-message" diese kommt bei mir nicht mehr.
Vielleicht kannst Du mir ja bei Gelegenheit weiterhelfen :)
Zitat von: moorjunge am 03 April 2015, 12:46:32
OK, dass ist schon mal gut zu wissen.
Auf das Icon war ich auch schon gestoßen, was mir dann noch fehlt ist der Hinweis, ob die Abholung "Heute" oder "Morgen" ist. Lässt sich das ganze noch um einen Text unter dem Icon ergänzen?
Gruß
Thiemo
Ein Label, was einfach den STATE anzeigt ... So etwa:
<div class="cell right">
<div data-type="symbol" data-device="Muell_Sammler"
data-get-on='["nichts","GSack_Morgen","Wert3"]'
data-icons='["fa-arrow-up","fa-recycle","fa-arrow-down"]'
data-on-colors='["#32a054","#FFD700","#ad3333"]' >
</div>
<div data-type="label" data-device="Muell_Sammler" class=""></div>
</div>
bei class kann man mit 'narrow' 'darker' 'small' experimentieren.
Wetter Wetter Wetter
So ....nun mit Vorhersage
.... unter dem aktuellem Wetter kommt noch das Regenradar und die Windrose .
... aber jetzt muss der Papa erstmal in den Zoo ;D
(//)
Zitat von: mw_fhem am 02 April 2015, 15:09:38
Nicht dass ich auf meiner Lösung bestehen würde, aber ich denke im Wiki ist es besser aufgehoben, da es dort vlt. eher gefunden wird.
Am fhemwiki gefällt mir nicht, dass man erst nen Account beantragen muss - aber offenbar wird die Einstiegshürde dort gebraucht. Aber es stimmt schon, dass Artikel dort eher gefunden werden. Ich hab die FAQ auf jeden Fall jetzt auch dorthin geschoben: http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ
@aliate: Mmmm, schade. Das klingt nach Fehler. Was sagt die Webconsole im Browser, wenn DEBUG an ist (im index.html muss <meta name="debug" content="1"> stehen)?
Zitat von: setstate am 03 April 2015, 13:02:29
Ein Label, was einfach den STATE anzeigt ... So etwa:
Da "GSack_Morgen" usw nicht ganz so sexy als Text unter dem Icon ist :) habe ich nun einen weiteren Dummy erzeugt. Dessen state "-","Heute" und "Morgen" wird dann in dem Header des Feldes geschrieben, in dem das Icon auftaucht.
Damit bin ich ganz zufrieden.
Vielen Dank für die schnelle Hilfe !!
Frohe Ostern
Gruß
Thiemo
Zitat von: setstate am 03 April 2015, 13:16:24
@aliate: Mmmm, schade. Das klingt nach Fehler. Was sagt die Webconsole im Browser, wenn DEBUG an ist (im index.html muss <meta name="debug" content="1"> stehen)?
Hoffe dass sind die Daten die Du brauchst.
Wenn ich in fhem die Temperatur auf 16,4° einstelle kommt in der Console
2015-04-03 13:24:54 / Studio_Hermann_SollTemp / STATE / 16.39 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:24:54 / Studio_Hermann_SollTemp / STATE / 16.39 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:24:54 / Studio_Hermann_SollTemp / measured-temp / 18.56 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:measured-temp
fhem-tablet-ui.js:294 2015-04-03 13:24:54 / Studio_Hermann_SollTemp / STATE / 16.39 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:24:54 / Studio_Hermann_SollTemp / STATE / 16.39 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:24:54 / Studio_Hermann_SollTemp / measured-temp / 18.56 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:measured-temp
fhem-tablet-ui.js:228 start longpollDie Anzeige des widgets bleibt aber auf dem alten Wert von 17,6° stehen. Aktualisiere ich die Seite manuell dann wird der richtige Wert angezeigt. Alternativ mit shortpoll geht es nach den 30 Sekunden.
Wenn ich im UI die Temperatur verstelle kommt das:
send to FHEM: set Studio_Hermann_SollTemp value 18.2
fhem-tablet-ui.js:294 2015-04-03 13:27:44 / Studio_Hermann_SollTemp / STATE / 18.2 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:27:44 / Studio_Hermann_SollTemp / STATE / 18.2 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:27:44 / Studio_Hermann_SollTemp / measured-temp / 18.56 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:measured-temp
fhem-tablet-ui.js:294 2015-04-03 13:27:45 / Studio_Hermann_SollTemp / STATE / 18.2 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:27:45 / Studio_Hermann_SollTemp / STATE / 18.2 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:STATE
fhem-tablet-ui.js:294 2015-04-03 13:27:45 / Studio_Hermann_SollTemp / measured-temp / 18.56 °C
fhem-tablet-ui.js:193 update done for device:Studio_Hermann_SollTemp parameter:measured-temp
fhem-tablet-ui.js:228 start longpollUnd Zack, jetzt hats natürlich geklappt. Wert wurde übertragen und auch die toast-message war wieder da. Keine Ahnung warum?!
Edit: Nach einem Refresh der Seite werden die Änderungen, die ich im UI mache wieder nicht weitergegeben = keine toast-message UND in der console tut sich nichts?!
Diese Einträge kommen beim Aufruf des UI
fhem-tablet-ui.js:126 Please rename widget "contact" into "symbol" in http://192.168.178.36:8083/fhem/tablet device: SchlafzimmerFenster - Details below:
fhem-tablet-ui.js:127 [div.narrow, context: div.narrow, jquery: "1.11.1", constructor: function, selector: "", toArray: function...]
fhem-tablet-ui.js:126 Please rename widget "contact" into "symbol" in http://192.168.178.36:8083/fhem/tablet device: KinderzimmerFenster - Details below:
fhem-tablet-ui.js:127 [div.narrow, context: div.narrow, jquery: "1.11.1", constructor: function, selector: "", toArray: function...]
fhem-tablet-ui.js:126 Please rename widget "contact" into "symbol" in http://192.168.178.36:8083/fhem/tablet device: KuechenFenster - Details below:
fhem-tablet-ui.js:127 [div.cell, context: div.cell, jquery: "1.11.1", constructor: function, selector: "", toArray: function...]
fhem-tablet-ui.js:126 Please rename widget "contact" into "symbol" in http://192.168.178.36:8083/fhem/tablet device: TerrassenTuer - Details below:
fhem-tablet-ui.js:127 [div.narrow, context: div.narrow, jquery: "1.11.1", constructor: function, selector: "", toArray: function...]
jquery.min.js:4 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
fhem-tablet-ui.js:40 Loaded plugin: widget_symbol
fhem-tablet-ui.js:40 Loaded plugin: widget_label
fhem-tablet-ui.js:40 Loaded plugin: widget_switch
fhem-tablet-ui.js:40 Loaded plugin: widget_weather
fhem-tablet-ui.js:40 Loaded plugin: widget_thermostat
fhem-tablet-ui.js:40 Loaded plugin: widget_homestatus
fhem-tablet-ui.js:40 Loaded plugin: widget_push
fhem-tablet-ui.js:40 Loaded plugin: widget_volume
fhem-tablet-ui.js:40 Loaded plugin: widget_slider
fhem-tablet-ui.js:40 Loaded plugin: widget_dimmer
fhem-tablet-ui.js:142 Collecting required readings
fhem-tablet-ui.js:158 Get current values of readings
jquery.min.js:4 Resource interpreted as Font but transferred with MIME type text/woff2: "http://192.168.178.36:8083/fhem/tablet/fonts/fontawesome-webfont.woff2".m.fn.extend.offset @ jquery.min.js:4t.o._xy @ jquery.knob.min.js:23t.o.run @ jquery.knob.min.js:23(anonymous function) @ jquery.knob.min.js:23m.extend.each @ jquery.min.js:2m.fn.m.each @ jquery.min.js:2e.fn.dial.e.fn.knob @ jquery.knob.min.js:23(anonymous function) @ VM571:158m.extend.each @ jquery.min.js:2m.fn.m.each @ jquery.min.js:2widget_thermostat.init @ VM571:143$.ajax.success @ fhem-tablet-ui.js:43m.Callbacks.j @ jquery.min.js:2m.Callbacks.k.fireWith @ jquery.min.js:2x @ jquery.min.js:4m.ajaxTransport.send.b @ jquery.min.js:4m.ajaxTransport.send @ jquery.min.js:4m.extend.ajax @ jquery.min.js:4plugins.load @ fhem-tablet-ui.js:33(anonymous function) @ fhem-tablet-ui.js:140m.Callbacks.j @ jquery.min.js:2m.Callbacks.k.fireWith @ jquery.min.js:2m.extend.ready @ jquery.min.js:2J @ jquery.min.js:2
VM571:67 Resource interpreted as Font but transferred with MIME type text/woff: "http://192.168.178.36:8083/fhem/tablet/fonts/meteocons-webfont.woff".widget_thermostat.drawDial @ VM571:67t.o._draw @ jquery.knob.min.js:23t.o.run @ jquery.knob.min.js:23(anonymous function) @ jquery.knob.min.js:23m.extend.each @ jquery.min.js:2m.fn.m.each @ jquery.min.js:2e.fn.dial.e.fn.knob @ jquery.knob.min.js:23(anonymous function) @ VM571:158m.extend.each @ jquery.min.js:2m.fn.m.each @ jquery.min.js:2widget_thermostat.init @ VM571:143$.ajax.success @ fhem-tablet-ui.js:43m.Callbacks.j @ jquery.min.js:2m.Callbacks.k.fireWith @ jquery.min.js:2x @ jquery.min.js:4m.ajaxTransport.send.b @ jquery.min.js:4m.ajaxTransport.send @ jquery.min.js:4m.extend.ajax @ jquery.min.js:4plugins.load @ fhem-tablet-ui.js:33(anonymous function) @ fhem-tablet-ui.js:140m.Callbacks.j @ jquery.min.js:2m.Callbacks.k.fireWith @ jquery.min.js:2m.extend.ready @ jquery.min.js:2J @ jquery.min.js:2
fhem-tablet-ui.js:228 start longpoll
VM571:221 thermo dev:* par:* change:clima.desired
VM571:228 thermo dev:* par:* change:clima.temp
fhem-tablet-ui.js:364 Uncaught TypeError: Cannot read property 'match' of nullncaught TypeError: Cannot read property 'match' of nullgetPart @ fhem-tablet-ui.js:364widget_thermostat.getClimaValues @ VM571:12(anonymous function) @ VM571:209m.extend.each @ jquery.min.js:2m.fn.m.each @ jquery.min.js:2widget_thermostat.update @ VM571:207(anonymous function) @ fhem-tablet-ui.js:50m.extend.each @ jquery.min.js:2plugins.update @ fhem-tablet-ui.js:48update @ fhem-tablet-ui.js:191(anonymous function) @ fhem-tablet-ui.js:351m.Callbacks.j @ jquery.min.js:2m.Callbacks.k.fireWith @ jquery.min.js:2x @ jquery.min.js:4m.ajaxTransport.send.b @ jquery.min.js:4Gruß
Zitat von: nesges am 02 April 2015, 13:27:40
Du nicht, aber irgendwo ist in der Übertragung was schief gelaufen, die Umlaute sind doppelt kodiert im Repository. Kannst du bitte einmal mit der Version von https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_weather.js testen und - bei Umlautwetterlage - Rückmeldung geben, ob's damit funktioniert? Danke!
Hallo Nesges,
gerade ausprobiert, leider negativ, muss die Umlaute eintragen damit es funktioniert.
Gruß
Karl
Hallo setstate,
bei der letzen Änderung im widget_thermostat kommt es zu einem fehler, was auch das widget weather und wind_direction beeinflusst.
Beim Thermostat werden die Werte nicht angezeigt bzw. erst nach einer Zeit.
Beim weather icon wird keins Angezeigt
Beim wind_direction auch erst nach einer Zeit.
Daher habe ich erstmal die vorige Version eingespielt.
gruss
Zitat von: michiatlnx am 03 April 2015, 15:38:39
Hallo setstate,
bei der letzen Änderung im widget_thermostat kommt es zu einem fehler, was auch das widget weather und wind_direction beeinflusst.
Beim Thermostat werden die Werte nicht angezeigt bzw. erst nach einer Zeit.
Beim weather icon wird keins Angezeigt
Beim wind_direction auch erst nach einer Zeit.
Daher habe ich erstmal die vorige Version eingespielt.
gruss
Danke, ich weiß auch schon was ich ändern muss, bin nur gerade unterwegs. Update folgt. Sorry
Update: Der Fehler trat primär auf, wenn data-device="xyz" in der index.html existieren, die keine Werte liefern. Also wenn aus der Vorlage Sachen nicht geändert wurden. Ich habe das jetzt wieder sicherer gemacht. Sollte also wieder alles laufen ...
Möchte gerade ein array für die Stati einrichten, aber es geht nicht. Mein Code:
<div class="left">
<div data-type="symbol" data-device="rr_Petra" data-get-on='["zuhause","schläft","bettfein"]' data-icons='["fa-user","fa-arrow-up","fa-arrow-down"]' class="cell big"></div>
<div type="label" class="cell">Petra</div>
</div>
Status wird nicht erkannt und es wird immer das Icon angezeigt, das an erster Stelle im Array der Icons steht. Mir scheint, dass er a) immmer nur die erste Stelle abfragt und b) auch den gültigen Status nicht mehr erkennt, sobald ein Array definiert ist. Ohne Array wird der Status sofort erkannt und auch farbig angezeigt.
Dieses Beispiel kam in einem vorhergehende Thread zum Thema Müll. Dachte deswegen, ich richte es "kurz" ein. Denkfehler. Beschäftigt mich nun schon eine Weile.
Hat jemand eine Idee, wo der Fehler liegt?
Gruß Jürgen
Zitat von: setstate am 03 April 2015, 15:46:14
Danke, ich weiß auch schon was ich ändern muss, bin nur gerade unterwegs. Update folgt. Sorry
Update: Der Fehler trat primär auf, wenn data-device="xyz" in der index.html existieren, die keine Werte liefern. Also wenn aus der Vorlage Sachen nicht geändert wurden. Ich habe das jetzt wieder sicherer gemacht. Sollte also wieder alles laufen ...
Damit ist es gelöst, danke.
Ja das stimmt ich hatte einige Defaults aus der Vorlage noch drin.
Zitat von: nesges am 03 April 2015, 03:36:20
Hier noch eine Idee, die ich quick&dirty umgesetzt hier abkippen muss :)
Effekt in den Screenshots:
Danke nesges für die Idee. Ich habe die Funktionalität übernommen, aber in etwas geänderter Form.
Mit dieser Änderung kommt das
circleMenu jetzt als
eigenständiges Widget. Dies bedarf aber einer kleinen Anpassung in der index.html. Das muss jetzt so aussehen:
<div data-type="circlemenu" class="cell circlemenu">
<ul>
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>
Also bitte
data-type="circlemenu" einfügen
Zitat von: bmwfan am 03 April 2015, 17:36:20
Möchte gerade ein array für die Stati einrichten, aber es geht nicht. Mein Code:
<div class="left">
<div data-type="symbol" data-device="rr_Petra" data-get-on='["zuhause","schläft","bettfein"]' data-icons='["fa-user","fa-arrow-up","fa-arrow-down"]' class="cell big"></div>
<div type="label" class="cell">Petra</div>
</div>
Status wird nicht erkannt und es wird immer das Icon angezeigt, das an erster Stelle im Array der Icons steht. Mir scheint, dass er a) immmer nur die erste Stelle abfragt und b) auch den gültigen Status nicht mehr erkennt, sobald ein Array definiert ist. Ohne Array wird der Status sofort erkannt und auch farbig angezeigt.
Dieses Beispiel kam in einem vorhergehende Thread zum Thema Müll. Dachte deswegen, ich richte es "kurz" ein. Denkfehler. Beschäftigt mich nun schon eine Weile.
Hat jemand eine Idee, wo der Fehler liegt?
Gruß Jürgen
Es fehlt das data-on-colors Array. Laut Code macht er nur weiter, wenn alle drei Array da sind und gleich groß sind.
Zitat von: setstate am 03 April 2015, 00:06:29
Hallo hotwebnet, ich glaube nicht, dass das so funktioniert, wie du denkst. Der Stream soll auf dem Tablet (Rechner) im Hintergrund laufen? Dann müsste ein HTML5 audio Tag benutzt werden. Ich versuche mal ein Demo zu bauen ...
Update Demo liegt auf Github bereit: 'playstream" widget
<div data-type="playstream" data-url="http://radioeins.de/stream"></div>
<div data-type="label" class="darker">Radio eins</div>
Im Prinzip funktioniert dies genauso wie ich es mir vorstelle ...
aber ( wie immer :) )
wenn ich meine Lieblingssender einpflegen will ,habe ich das Problem eine URL ohne Playlist (ohne m3u ,pls) zu finden
Info gefunden auf :
http://www.radioeins.de/faqs/radioeins_hoeren.html
WLAN Radios
Der MP3-Stream lässt sich mit WLAN-Radios empfangen. Einige Geräte können jedoch keine Playlisten ( m3u, pls) verarbeiten. Die URL für den direkten Zugriff auf den Stream lautet:
http://radioeins.de/streamStream-URL´s der Radiobetreiber ,wie wie z.B: http://www.wdr.de/wdrlive/media/einslive.m3u
laufen nicht .
Was ist mit HTML5 audio Tag gemeint ?
Quelle
http://webdesign.weisshart.de/audio_tag.php
@setstate: Danke, Jetzt gehts. Hatte nicht vermutet, dass auch die Farben benötigt werden und wollte keine anderen verwenden.
@nesges: Habe gleich dienen FB-Callmonitor-Code eingebaut und hat auf anhieb funktioniert.
Mal an alle einen Dank. Durch Eure Codes und Unterstützung schaffen es auch Laien wie ich, funktionierende Dinge hinzubekommen.
Zitat von: Sky am 03 April 2015, 18:46:47
Im Prinzip funktioniert dies genauso wie ich es mir vorstelle ...
aber ( wie immer :) )
wenn ich meine Lieblingssender einpflegen will ,habe ich das Problem eine URL ohne Playlist (ohne m3u ,pls) zu finden
Info gefunden auf :
http://www.radioeins.de/faqs/radioeins_hoeren.html
WLAN Radios
Der MP3-Stream lässt sich mit WLAN-Radios empfangen. Einige Geräte können jedoch keine Playlisten ( m3u, pls) verarbeiten. Die URL für den direkten Zugriff auf den Stream lautet:
http://radioeins.de/stream
Stream-URL´s der Radiobetreiber ,wie wie z.B: http://www.wdr.de/wdrlive/media/einslive.m3u
laufen nicht .
Was ist mit HTML5 audio Tag gemeint ?
Quelle http://webdesign.weisshart.de/audio_tag.php
Hallo Sky,
es gibt diese einfache Lösung: man kann die m3u runterladen und mit eine Texteditor öffnen. Dort steht dann die mp3 Stream URL drin. 1Live: http://1live.akacast.akamaistream.net/7/706/119434/v1/gnl.akacast.akamaistream.net/1live
Solange diese sich nicht ändert, reicht das völlig. Wenn es dynamischer sein soll, müsste jemand das widget erweitern. Freiwillige vor ! ;)
Hier ein Beispiel wie so ein mu3 Parser aussehen könnte. https://github.com/nickdesaulniers/javascript-playlist-parser (https://github.com/nickdesaulniers/javascript-playlist-parser)
Zitat von: bjoernbo am 03 April 2015, 08:34:20
ist es möglich, dass circlemenü innerhalb eines labels o.ä. zu setzen?
Idee: ich will gerne, dass innerhalb der Ausgabe des live-Bildes der Kamera, unten rechts das circlemenü einblenden.
(//)
Es gibt nix was nicht geht:
<div class="container">
<div data-type="image"
data-url="http://knowthelist.github.io/fhem-tablet-ui/fhem-tablet-ui-example_new.png"
data-size="240px"
class="cell">
</div>
<div class="ontop">
<div data-type="push" ></div>
</div>
</div>
Die Klasse
ontop (neu in fhem-tablet-ui.css) schiebt das Objekt nach oben in der Z-Ebene und positioniert es links oben, innerhalb des gleichen Parent Containers.
ich habe eben die
Zitatfhem-tablet-ui.css
ausgetauscht und mal schnell dein Beispiel ausprobiert:
Zitat... schiebt das Objekt nach oben in der Z-Ebene und positioniert es links oben, innerhalb des gleichen Parent Containers.
Comando zurück! Funktioniert!!!! Hatte ein Cach-Problem!!!!
anbei weitere Sender ;D
Auf dem Notebook laufen alle problemlos! Auf dem Android-Tablet nur der letzte "Radio"-Bochum. also .mp3.
Ich bin noch nicht lange auf dem Android-Tablet unterwegs, aber muss ich ggf. noch was installieren?
Zitat<li data-row="3" data-col="1" data-sizex="2" data-sizey="3">
<div data-type="playstream" data-url="http://radioeins.de/stream"></div>
<div data-type="label" class="darker">Radio eins</div>
<div data-type="playstream" data-url="http://www.wdr.de/wdrlive/media/einslive.m3u"></div>
<div data-type="label" class="darker">1Live</div>
<div data-type="playstream" data-url="http://www.wdr.de/wdrlive/media/wdr2.m3u"></div>
<div data-type="label" class="darker">WDR 2</div>
<div data-type="playstream" data-url="http://www.jam.fm/streams/jam-nmr-mp3.m3u"></div>
<div data-type="label" class="darker">JAM FM</div>
<div data-type="playstream" data-url="http://edge.live.mp3.mdn.newmedia.nacamar.net/ps-radiobochum/livestream.mp3"></div>
<div data-type="label" class="darker">Radio Bochum</div>
Vorschlag: Wenn ich einen stream starte und einen weiteren, laufen beide gleichzeitig. Kann man das Widget "playstream" so anpassen, dass der vorherige Stream dann beendet wird?
Ich hab nochmal ein paar Fragen in der Hoffnung das mir hier jemand einen Tipp geben kann:
- Ich kann leider immer noch nicht den Status Home ueber das Tablet auswaehlen, der "button" in der Mitte beim Homestatus laesst sich ueber das Tablet (Webviewcontrol oder Browser) nicht anklicken, ueber den Laptop mit Maus allerdings schon.
- Kann ich beim Thermostat-Widget auch den Slider einsetzen? Ich finde das mit dem default Teil irgendwie recht unpraktisch, da ist die Temperatur anzeige immer unter dem Finger.
- Dritte Frage habe ich bereits selbst halb geloest und im WebViewControl Thread gefragt (android app ueber einen Link im Browser starten). Sobald ich da weiss wie das geht sage ich hier Bescheid.
Danke fuer eure Hilfe!
Zitat von: bjoernbo am 03 April 2015, 23:33:06
...
Vorschlag: Wenn ich einen stream starte und einen weiteren, laufen beide gleichzeitig. Kann man das Widget "playstream" so anpassen, dass der vorherige Stream dann beendet wird?
Ist jetzt so eingebaut. Aber *.m3u werden nicht unterstützt, man muss die m3u runterladen und mit eine Texteditor öffnen. Dort steht dann die mp3 Stream URL drin. Die kann man benutzen ...
Zitat von: hillbicks am 04 April 2015, 00:13:52
Ich hab nochmal ein paar Fragen in der Hoffnung das mir hier jemand einen Tipp geben kann:
- Ich kann leider immer noch nicht den Status Home ueber das Tablet auswaehlen, der "button" in der Mitte beim Homestatus laesst sich ueber das Tablet (Webviewcontrol oder Browser) nicht anklicken, ueber den Laptop mit Maus allerdings schon.
- Kann ich beim Thermostat-Widget auch den Slider einsetzen? Ich finde das mit dem default Teil irgendwie recht unpraktisch, da ist die Temperatur anzeige immer unter dem Finger.
- Dritte Frage habe ich bereits selbst halb geloest und im WebViewControl Thread gefragt (android app ueber einen Link im Browser starten). Sobald ich da weiss wie das geht sage ich hier Bescheid.
Danke fuer eure Hilfe!
- Status Home: habe ich etwas optimiert. Vielleicht geht es jetzt bei dir besser.
- Thermostat-Widget: versuche ich auch noch zu optimieren. Kleiner Tipp: wenn man auf die Ziel-Temp-Stelle nur kurz tippt, ist es etwas einfachen mit dem Einstellen. Oder man macht sich die Teile größer mit 'big' als zusätzliche Klasse.
Danke für die kleine, schneller Korrektur! Funktioniert hervorragend.
Hat einen kleinen Schönheitsfehler. Wenn ich das Radio auf der Seite Radio.html einbinde und ich dann auf einen anderen Raum (Wohnzimmer.html) wechsel geht der Stream aus :-/
Wer auf der Suche nach Streams ist kann sich hier umsehen! Sind viele im .mp3 Format.
http://www.chip.de/artikel/Webradio-Live-Stream-Alle-Sender-im-ueberblick_56137550.html
Morgen , auch ich bin noch hier und versuche das mit dem Streamen besser hin zu bekommen, es geht natürlich zur Zeit auch bei mir alles.........
habe jetzt versucht meine Sender ins circlemenu einzubauen, das heißt, ich habe nur noch einen Buttom auf dem Panel und kann dann aus 6 Sendern aussuchen, leider bekomme ich das nicht hin.... ich glaube das mit im JS-Code angepasst werden.....dafür bin ich aber leider nicht der richtige ...
hotwebnet: Das habe ich gestern auch probiert. Das Problem ist aber das mann 2x "date-type" vernwenden muss.
1x für den push und 1x für den stream
aber es gibt nichts was es nicht gibt schreibt setstate ich hoffe er kann das problem im js code lösen....
Zitat von: setstate am 04 April 2015, 03:09:35
- Status Home: habe ich etwas optimiert. Vielleicht geht es jetzt bei dir besser.
- Thermostat-Widget: versuche ich auch noch zu optimieren. Kleiner Tipp: wenn man auf die Ziel-Temp-Stelle nur kurz tippt, ist es etwas einfachen mit dem Einstellen. Oder man macht sich die Teile größer mit 'big' als zusätzliche Klasse.
Status Home: Ne, leider noch nicht. Wobei ich grade auch gesehen habe das widget_homestatus.js im github repo 2 Tage alt ist. Hast Du es vielleicht nicht eingecheckt? Ich sehe hier bei den commits jedenfalls nichts was darauf hindeutet :)
https://github.com/knowthelist/fhem-tablet-ui/commits
-Wegen des Thermostats, ja, so mache ich das mittlerweile auch, ist ja aber auch nicht so schlimm :)
Danke in jedem Fall!
@Damian & @setstate:
Ist das Problem mit dem Longpoll und dass das UI sich nicht automatisch aktualisiert eigentlich gelöst?
Ich habe nämlich das gleiche Problem wie Damian. Longpoll sind in FHEMWEB und im UI aktiviert, aber es passiert nichts wenn sich ein STATE ändert.
Auch wenn Longpoll auf "0" gesetzt ist, wird nichts nach 30 Sekunden aktualisiert. Das musss ich immer manuell im Browser machen.
Alle Devices im UI gibt es auch im FHEM. Ich hatte es auch schon mit nur EINEM Device (FS20 - Steckdose) probiert. Ging auch nicht.
Hat noch jemand einen Tipp für mich?
FHEM/UI laufen auf einen Cubietruck. Alle Browser/Geräte ausprobiert (iOS, Android, IE, Firefoxe, Chrome) es klappt einfach nicht.
Ansonsten großes Lob an Setstate für diese tolle Frontend, danach habe ich auch lange gesucht.
Gruß
Markus
Zitat von: hotwebnet am 04 April 2015, 09:10:27
Morgen , auch ich bin noch hier und versuche das mit dem Streamen besser hin zu bekommen, es geht natürlich zur Zeit auch bei mir alles.........
habe jetzt versucht meine Sender ins circlemenu einzubauen, das heißt, ich habe nur noch einen Buttom auf dem Panel und kann dann aus 6 Sendern aussuchen, leider bekomme ich das nicht hin.... ich glaube das mit im JS-Code angepasst werden.....dafür bin ich aber leider nicht der richtige ...
ich würde das rudimentär so bauen:
<div data-type="circlemenu" class="cell circlemenu wider keepopen">
<ul>
<li><div data-type="push" data-icon="fa-volume-up"></div></li>
<li><div data-type="playstream" data-url="http://radioeins.de/stream" data-background-icon="fa-circle-thin" data-icon="">R1</div></li>
<li><div data-type="playstream" data-url="http://edge.live.mp3.mdn.newmedia.nacamar.net/ps-radiobochum/livestream.mp3" data-background-icon="fa-circle-thin" data-icon="">Bo</div></li>
<li><div data-type="playstream" data-url="http://stream.jam.fm/jamfm-nmr/mp3-128/directUrl" data-background-icon="fa-circle-thin" data-icon="">Jm</div></li>
<li><div data-type="playstream" data-url="http://br-mp3-puls-m.akacast.akamaistream.net/7/501/142689/v1/gnl.akacast.akamaistream.net/br_mp3_puls_m" data-background-icon="fa-circle-thin" data-icon="">Ps</div></li>
</ul>
</div>
Was habt ihr anderes gemacht?
mit zusätzlichen Labels hab ich noch nicht probiert, dafür müsste bestimmt erst noch was gemacht werden, dass das auch räumlich passt.
Zitat von: hillbicks am 04 April 2015, 10:25:38
Status Home: Ne, leider noch nicht. Wobei ich grade auch gesehen habe das widget_homestatus.js im github repo 2 Tage alt ist. Hast Du es vielleicht nicht eingecheckt? Ich sehe hier bei den commits jedenfalls nichts was darauf hindeutet :)
https://github.com/knowthelist/fhem-tablet-ui/commits
-Wegen des Thermostats, ja, so mache ich das mittlerweile auch, ist ja aber auch nicht so schlimm :)
Danke in jedem Fall!
Du hast sooo Recht! War schon spät gestern ...
Ist jetzt oben. Sorry
Zitat von: Markus Hermann am 04 April 2015, 11:03:12
@Damian & @setstate:
Ist das Problem mit dem Longpoll und dass das UI sich nicht automatisch aktualisiert eigentlich gelöst?
Ich habe nämlich das gleiche Problem wie Damian. Longpoll sind in FHEMWEB und im UI aktiviert, aber es passiert nichts wenn sich ein STATE ändert.
Auch wenn Longpoll auf "0" gesetzt ist, wird nichts nach 30 Sekunden aktualisiert. Das musss ich immer manuell im Browser machen.
Alle Devices im UI gibt es auch im FHEM. Ich hatte es auch schon mit nur EINEM Device (FS20 - Steckdose) probiert. Ging auch nicht.
Hat noch jemand einen Tipp für mich?
FHEM/UI laufen auf einen Cubietruck. Alle Browser/Geräte ausprobiert (iOS, Android, IE, Firefoxe, Chrome) es klappt einfach nicht.
Ansonsten großes Lob an Setstate für diese tolle Frontend, danach habe ich auch lange gesucht.
Gruß
Markus
Hallo Markus,
seit dieser Woche gibt es auch eine FAQ Sammlung (Danke an nesges). http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ)
Dort findest du vllt. noch zusätzliche Infos.
Ansonsten vermute ich, dass noch ein Fehler in der Ausführung auftritt, der den vollständigen Ablauf der Funktionen verhindert.
Öffne mal dazu die Web-Konsole des Browsers (Menü>Entwicklerwerkzeuge), schalte das Debugging an (<meta name="debug" content="1"> in der index.html) und schau mal, ob Fehlermeldungen auftreten.
Viele Grüße
Zitat von: setstate am 04 April 2015, 11:18:38
Du hast sooo Recht! War schon spät gestern ...
Ist jetzt oben. Sorry
Jetzt geht es schon besser, ich danke Dir vielmals!
Hallo Leute,
also ich muss mal sagen, so geht das nicht! Da hat man(frau) gerade eine halbwegs vernünftige Oberfläche mit den widgets hinbekommen, und dann kommt Ihr mit dem Cirlcemenu...so nicht, jetzt darf ich die Oberfläche noch einmal neu machen, weil das Teil einfach nur genial ist...
So mal Spass beseite, das Userinterface ist einfach nur super, damit kann man alles endlich auf eine Oberfläche bringen, was vorher über diverse Apps lief. Zwar muss man sich erst dann die Syntax gewöhnen, aber wenn man das mal drauf hat, einfach toll!
Und auch schön, das das hier so flott weitergeht. Dafür mal an die Entwickler einen lieben Dank.
Ein zwei Optimierungen sind hier und da sicherlich noch notwendig, aber ich bin mir sicher, das das über kurz oder lang alles kommt.
Und wer weiss auf was für Ideen ihr hier noch kommt.
Bis dahin ein frohes Osterfest @all
LG Marie
Hallo setstate,
die FAQ hatte ich schon gesehen und debug aktiviert, in der Bowser-Konsole steht:
"start longpoll"
Wenn ich mit der FS20 S8 - Fernbedienung eine FS ST ein- bzw ausschalte steht im Event Monitor:
2015-04-04 11:36:38.252 FS20 Kugelleuchte_1 on
2015-04-04 11:36:46.559 FS20 Kugelleuchte_1 off
In der index.html steht u. a. :
<div class="right">
<div data-type="switch" data-device="Kugelleuchte_1" data-get-on="on" data-get-off="off" class="cell"></div>
<div data-type="label" class="cell small">Esszimmer</div>
</div>
Gruß
Markus
@Markus: Was sieht man noch in der Konsole? Wenn da nicht wie verrückt FHEM Daten rein purzeln, ist was faul.
Wir müssen leider noch weiter rein in den Debug-Modus, um den Fehler zu finden:
In der fhem-tablet-ui bitte in der Zeile 246 (//console.log('#'+line+'#');
, die beiden Slash wegnehmen, speichern und Browser-Refresh machen.
Was passiert dann in der Konsole beim Status-Ändern?
Jetzt werden alle FHEM Events in der Browser-Konsole angezeigt, aber das UI wird nicht "refreshed":
"#2015-04-04 12:10:07.677 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:09.051 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:09.833 FHT T5_WC actuator: 0%#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:13.015 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:14.644 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:246:6
Zitat von: Markus Hermann am 04 April 2015, 12:11:49
Jetzt werden alle FHEM Events in der Browser-Konsole angezeigt, aber das UI wird nicht "refreshed":
"#2015-04-04 12:10:07.677 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:09.051 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:09.833 FHT T5_WC actuator: 0%#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:13.015 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:246:6
"#2015-04-04 12:10:14.644 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:246:6
@Markus: das sieht doch schon mal gut aus :-)
Ich vermute, durch das andere Datumsformat (inkl. Millisekunden) passt das noch nicht.
Ersetze bitte mal die Zeile 239 durch diese:
var regDate = /^([0-9]{4}-[0-9]{2}-[0-9]{2}\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9])\.?[0-9]{0,3}\s/;
Erledigt:
"#2015-04-04 12:35:46.460 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:247:6
"#2015-04-04 12:35:48.636 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:247:6
"#2015-04-04 12:35:51.051 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:247:6
"#2015-04-04 12:35:52.898 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:247:6
Aber kein refresh im UI
:-\
Ich sehe auch irgendwie kein Unterschied bei den beiden Konsolenausgaben im Datum-String (12:10 Uhr zu 12:35 Uhr). Ich habe den Browser komplett geschlossen.
Upps, die ms müssen auch noch in die obere Zeile 238:
var regDevice = /\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9]\.?[0-9]{0,3}\s(\S*)\s(\S*)\s(.*)/;
Ergebnis nach einmal ein- und ausschalten des FS20 ST:
"#2015-04-04 12:48:53.962 FS20 Kugelleuchte_1 on#" fhem-tablet-ui.js:248:6
"2015-04-04 12:48:53 / Kugelleuchte_1 / STATE / on" fhem-tablet-ui.js:275:0
"update done for device:Kugelleuchte_1 parameter:STATE" fhem-tablet-ui.js:172:10
"#2015-04-04 12:48:56.244 FS20 Kugelleuchte_1 off#" fhem-tablet-ui.js:248:6
"2015-04-04 12:48:56 / Kugelleuchte_1 / STATE / off" fhem-tablet-ui.js:275:0
"update done for device:Kugelleuchte_1 parameter:STATE" fhem-tablet-ui.js:172:10
Aber kein refresh des UI
So sieht die fhem-tablet-ui in Zeile 238 & 239 aus:
var regDevice = /\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9]\.?[0-9]{0,3}\s(\S*)\s(\S*)\s(.*)/;
var regDate = /^([0-9]{4}-[0-9]{2}-[0-9]{2}\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9])\.?[0-9]{0,3}\s/;
//var regDevice = /\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9]\s(\S*)\s(\S*)\s(.*)/;
//var regDate = /^([0-9]{4}-[0-9]{2}-[0-9]{2}\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9])\s/;
Aaaah, es funktioniert.
Ich hatte noch data-get="STATE" in der <div>
Teste jetzt die komplette index.html
.
.
.
.
Hurra auch das funktioniert.
Vielen Dank für die schnelle Hilfe. Jetzt ist es perfekt.
Super!
Zitat von: Markus Hermann am 04 April 2015, 12:59:05
Aaaah, es funktioniert.
Ich hatte noch data-get="STATE" in der <div>
Teste jetzt die komplette index.html
Ich wollte schon sagen ... Der Logauszug sah viel besser aus, nach der RegEx Änderung. Man sah das Update.
Sehr schön, wieder ein größeres Problem gelöst. Dann mache ich ein Update fertig.
Wer mal in die bunte Welt der Regular Expressions eintauchen will ;D ... https://regex101.com/r/vT4lB1/1 (https://regex101.com/r/vT4lB1/1)
Und Markus, vielen Dank fürs geduldige Probieren und Helfen
ha ha ..... ;D
Zitatsetstate: Was habt ihr anderes gemacht?
Naja, auf die Idee bin ich gestern Abend nicht gekommen.
anbei das CircleMenu innerhalb der Cam. Damit kann ich nun die Kamera steuern. Tolle Arbeit setstate !! Danke(//)
Zitat von: bjoernbo am 04 April 2015, 13:32:33
anbei das CircleMenu innerhalb der Cam. Damit kann ich nun die Kamera steuern. Tolle Arbeit setstate !! Danke(//)
BigBrother per FHEM 8)
;D
War schon kurz davor, mir eine Alternative zu FHEM zu suchen, da das normale Frontend nicht so meinen Vorstellungen entsprach. Jetzt bin ich auf dieses tolle userinterface aufmerksam geworden. Habe mich sehr schnell reingefunden und meine Heizungssteuerung + Wetter jetzt in super schöner Form auf meinem SmartPhone. (Bildchen anbei)
Großes Lob! :)
ZitatBigBrother per FHEM
so lange bis die Kinder aus dem Haus sind. lol.
Ein günstiger alternative zu einem Babyphons gibt es eben nicht ;)
@jemu75: Das werde ich demnächst auch noch machen! Einige UI-Seiten die für das Smartphone optimiert sind. Aber es gibt hier jeden Tag soviel neues, dass man einfach nicht nachkommt!
welche Werte muss ich verwenden um das obere Volume-Control zu erhalten?? Habe jetzt schon unterschiedliche Sachen ausprobiert, allerdings drehe ich mich im Kreis ;D nur leider nicht mit dem gewünschtem Effekt.
Zitat von: jemu75 am 04 April 2015, 13:35:40
War schon kurz davor, mir eine Alternative zu FHEM zu suchen, da das normale Frontend nicht so meinen Vorstellungen entsprach. Jetzt bin ich auf dieses tolle userinterface aufmerksam geworden. Habe mich sehr schnell reingefunden und meine Heizungssteuerung + Wetter jetzt in super schöner Form auf meinem SmartPhone. (Bildchen anbei)
Großes Lob! :)
Hallo jemu75,
sehr schön das zu hören. FHEM ist wirklich toll, lasst es uns gemeinsam besser machen!
Dein Phone UI sieht spitzenmässig aus! Würdest du uns den HTMl Code zur Verfügung stellen? Gern auch verallgemeinert mit Dummy Namen und DummyURLs. Das würden wir gern im WIKI usw. allen zur Verfügung stellen.
Danke
Mario
Zitat von: bjoernbo am 04 April 2015, 13:41:56
welche Werte muss ich verwenden um das obere Volume-Control zu erhalten?? Habe jetzt schon unterschiedliche Sachen ausprobiert, allerdings drehe ich mich im Kreis ;D nur leider nicht mit dem gewünschtem Effekt.
... schnell mal in meine index_bjoern2.html geschaut, da steht:
<div data-type="volume" data-device='dummy1'
data-min='0'
data-max='65535'
data-tickstep='4'
data-get='sat'
data-set='sat'
class="cell small dim-tick" >
</div>
::) ok. Ich kann dir gerne alle Dateien zur Verfügung stellen, lol muss nur die Passwörter auszementieren.
Zitatclass="cell small dim-tick"
wars.
D-A-N-K-E !
Hallo setstate ,
erstnochmal herzlichen Dank für Deine Arbeit ,man ist schon ein richtiger Fan :) :)
Ich hätte eine Frage zu dem "Layout" im 1.Post von Dir .
Was steuert bei Dir der Lautstärke-Regler in der Multimedia-Box ?
<div data-type="volume" data-device='
RadioVolumeOnTablet' class="cell left" ></div>
Das sieht aus ,als wenn du auf FHEM zurückgreifst .
Wäre kein Problem wenn man dort ein solches Device hätte
Genau wie :
<div data-type="push"
data-device="WebRadio" data-icon="fa-step-backward" data-set="Prev" class="cell" ></div>
Da wir aber nun Radiosender ,ohne Modul in FHEM, super zum laufen gebracht haben wäre die Einbindung des Lautstärke-Regler natürlich genial .
@sky. Ich schließe mich dir an, allerdings benutz jeder ein unterschiedliches Device. Für die Lautstärke müsste man ja direkt eine "Verlinkung" zum jew. Device oder aber ggf. zu einem Bluetooth Lautsprecher herstellen. Mein Radio läuft auf dem Tablet und ich kann die Lautstärke ganz normal über den Taster am Tablet steuern.
Das sind alles Dummy Devices im Fhem, die dann entsprechend die Befehle weitergeben, bzw. entgegennehmen. Die HW des Tablets steuere ich nicht.
Das kann ich auch und über mein Handy, aber wenn ich er einmal richtig in einem Rahmen eingebaut habe komme ich nur noch an die BT-Box
habe aber noch ein Probel.......
wie hast du das mit dem circlemenue hin bekommen....
hier mein Code
<li data-row="3" data-col="1" data-sizex="2" data-sizey="3">
<header>Radio</header>
<div data-type="circlemenu" class="cell circlemenu wider keepopen">
<ul>
<li><div data-type="push" data-icon="fa-volume-up"></div></li>
<li><div data-type="playstream" data-url="http://radioeins.de/stream" data-background-icon="fa-circle-thin" data-icon="">R1</div></li>
<li><div data-type="playstream" data-url="http://edge.live.mp3.mdn.newmedia.nacamar.net/ps-radiobochum/livestream.mp3" data-background-icon="fa-circle-thin" data-icon="">Bo</div></li>
<li><div data-type="playstream" data-url="http://stream.jam.fm/jamfm-nmr/mp3-128/directUrl" data-background-icon="fa-circle-thin" data-icon="">Jm</div></li>
<li><div data-type="playstream" data-url="http://br-mp3-puls-m.akacast.akamaistream.net/7/501/142689/v1/gnl.akacast.akamaistream.net/br_mp3_puls_m" data-background-icon="fa-circle-thin" data-icon="">Ps</div></li>
</ul>
das sieht dann so aus wie auf dem Bilde....also hein circlemenu ??? was mache ich denn nun schon wieder falsch.....
Hast du
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
ergänzt?
setstate nun verstehe ich nur noch Bahnhof oder ich stehe total auf dem Bahngleis....
den Code habe ich nicht ergänzt.........
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
weil ich überhaupt keine ahnung habe wo ich Ihn ergänzen soll..........
Gruß
Im Header der HTML Datei, dort wo auch alle anderen scripts definiert sind.
Sent from my iPad using Tapatalk
Danke..........der Zug ist angekommen........super......
Kann derjenige von dem der Screenshot im ersten Post mit den Graphen ist, bitte den entsprechenden Code zur Verfügung stellen?
Ich wuerde gerne den Heizungsplot implementieren, mir ist aber nicht ganz klar wie. Muss ich den SVGPLOT aus fhem vorher in image umwandeln um ihn einbinden zu koennen oder wie habt ihr das gemacht?
Waere nett wenn das jemand teilen koennte, man muss das Rad ja nicht immer neu erfinden :)
Danke schonmal !
Ich hab da auch mal ne Frage....im Volume Widget gibt es das Problem wenn man am unteren Ende ist (also linksanschlag) dann kann man weiter nacht links "drehen" --> das Widget springt dann auf das rechte Ende. Was das bei einer Lautstärkeeinstellung bedeutet, kann man sich ja denken --> die Nachbarin meckert, die Katzen verlassen fluchtartig den Raum und der Verstärker geht in die Begrenzung und schaltet ab...ist also eher suboptimal... ??? :o
Könntet Ihr da mal bitte drauf schauen und das verhindern?? :-*
Danke schon einmal.
LG
Marie
Zitat von: Marie am 04 April 2015, 19:14:59
Ich hab da auch mal ne Frage....im Volume Widget gibt es das Problem wenn man am unteren Ende ist (also linksanschlag) dann kann man weiter nacht links "drehen" --> das Widget springt dann auf das rechte Ende. Was das bei einer Lautstärkeeinstellung bedeutet, kann man sich ja denken --> die Nachbarin meckert, die Katzen verlassen fluchtartig den Raum und der Verstärker geht in die Begrenzung und schaltet ab...ist also eher suboptimal... ??? :o
Könntet Ihr da mal bitte drauf schauen und das verhindern?? :-*
Danke schon einmal.
LG
Marie
Hallo Marie,
danke für den Hinweis. Ich bin dran ...
Update: neues Volume Widget ist verfügbar. Bitte testet mal, ob es jetzt besser ist
Super,
funktioniert jetzt bei positiven Einstellungen für data-min und data-max.
Stellt man allerdings diese Werte auf -50...-20 db, so klappt das leider immer noch nicht.... :-[
Aber schon mal superschnelle Reaktion, danke!
LG
Marie
Beim Thermostat müsste Valve auch noch angepasst werden. Die FHT Thermostate liefern beim "actuator" ein "%"-Zeichen mit.
Kann mir wer kurz auf dei Sprüngehelfen.
Wie mache ich das mit dem Three-State -Fensterkontaktmit der richtigen Anzeige.
Hätte
<div data-type="symbol" data-device="OG_bz_FK" data-get-on='["tilted","open"]' data-on-colors='["#bb6242","#aa6900"]' </div>
versucht aber kein Erfolg.
Toll wären auch zwei verschiedene Symbole für Open und tilted.
Probier schon seit ein paar Stunde alle Varianten aber kein Erfolg.
LG
Zitat von: setstate am 04 April 2015, 13:46:22
Hallo Mario,
anbei die index.html zu meiner aktuellen Version. Die favicon.ico habe ich ebenfalls mal mit angehangen.
Hoffe sie ist halbwegs sauber geschrieben. Anregungen und Änderungswünsche natürlich sehr gern. :)
VG Jens.
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>JA-Team Home</title>
<link rel="shortcut icon" href="/fhem/tablet/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="0"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4">
<header>Wetter</header>
<div data-type="label" data-device="WZ_HM_WDS10_TH_O" data-get="temperature" data-limits='[-73,10,25]' data-colors='["#6699FF","#AA6900","#FF0000"]' data-unit="%B0C%0A" class="cell bigger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
<div data-type="label" data-device="WZ_HM_WDS10_TH_O" data-get="humidity" data-limits='[0,40,60]' data-colors='["#bb6242","#aa6900","#bb6242"]' data-unit="%" class="cell bigger thin"></div>
<div data-type="label" class="cell">Luftfeuchte</div>
<div data-type="label" class="cell darker wider">Heute</div>
<div data-type="weather" data-device="Wetter" data-get="fc1_condition" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_condition" class="cell narrow"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_high_c" data-unit="%B0C%0A" class="cell large"></div>
<div data-type="label" class="cell darker wider">Morgen</div>
<div data-type="weather" data-device="Wetter" data-get="fc2_condition" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_condition" class="cell narrow"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_high_c" data-unit="%B0C%0A" class="cell large"></div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="4">
<header>Wohnzimmer</header>
<div data-type="thermostat" data-device="CUL_HM_HM_CC_TC_1A3FE7" data-valve="actuator" data-step="0.5" class="cell left"></div>
<div data-type="label" data-device="CUL_HM_HM_CC_TC_1A3FE7" data-get="controlMode" class="cell big thin"></div>
<div data-type="button" data-fhem-cmd="set+CUL_HM_HM_CC_TC_1A3FE7+desired-temp+20.5" data-icon="fa-sun-o" class="cell"></div>
<div data-type="button" data-fhem-cmd="set+CUL_HM_HM_CC_TC_1A3FE7+desired-temp+19.0" data-icon="fa-moon-o" data-color="hsl(0,0%,50%)" class="cell"></div>
<div data-type="label" data-device="CUL_HM_HM_CC_TC_1A3FE7_Weather" data-get="measured-temp" data-limits='[-73,18,22]' data-colors='["#6699FF","#AA6900","#FF0000"]' data-unit="%B0C%0A" class="cell bigger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
<div data-type="label" data-device="CUL_HM_HM_CC_TC_1A3FE7_Weather" data-get="humidity" data-limits='[0,40,60]' data-colors='["#bb6242","#aa6900","#bb6242"]' data-unit="%" class="cell bigger thin"></div>
<div data-type="label" class="cell">Luftfeuchte</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="4">
<header>Kinderzimmer</header>
<div data-type="thermostat" data-device="CUL_HM_HM_CC_RT_DN_21FD96_Clima" data-valve="ValvePosition" data-step="0.5" class="cell left"></div>
<div data-type="label" data-device="CUL_HM_HM_CC_RT_DN_21FD96_Clima" data-get="controlMode" class="cell big thin"></div>
<div data-type="button" data-fhem-cmd="set+CUL_HM_HM_CC_RT_DN_21FD96_Clima+controlMode+boost" data-icon="fa-fire" class="cell"></div>
<div data-type="button" data-fhem-cmd="set+CUL_HM_HM_CC_RT_DN_21FD96_Clima+desired-temp+16.0" data-icon="fa-moon-o" data-color="hsl(0,0%,50%)" class="cell"></div>
<div data-type="label" data-device="CUL_HM_HM_CC_RT_DN_21FD96_Weather" data-get="measured-temp" data-limits='[-73,18,22]' data-colors='["#6699FF","#AA6900","#FF0000"]' data-unit="%B0C%0A" class="cell bigger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
</li>
</ul>
</div>
</body>
</html>
Zitat von: mrfloppy am 04 April 2015, 21:04:47
Kann mir wer kurz auf dei Sprüngehelfen.
Wie mache ich das mit dem Three-State -Fensterkontaktmit der richtigen Anzeige.
Hätte
<div data-type="symbol" data-device="OG_bz_FK" data-get-on='["tilted","open"]' data-on-colors='["#bb6242","#aa6900"]' </div>
versucht aber kein Erfolg.
Toll wären auch zwei verschiedene Symbole für Open und tilted.
Probier schon seit ein paar Stunde alle Varianten aber kein Erfolg.
LG
Hallo mrfloppy,
das funktioniert bis jetzt nur, wenn alle drei Arrays existieren und gleich groß sind:
<div data-type="symbol" data-device="dummy1"
data-get-on='["wert1","wert2","wert3"]'
data-icons='["fa-user","fa-arrow-up","fa-arrow-down"]'
data-on-colors='["SeaGreen","SlateBlue","IndianRed"]'
class="cell big">
</div>
Danke setstate
mit allen drei Werten die der Fensterkontakt ausgibt funktioniert es.
Brauch ich nur mehr ein paar passende Symbole.
Wobei wir gleich bei noch einer Frage wären. Kann ich eigene Symbole einfügen?
LG
Als Symbol wird der Font Awesome benutzt: http://fortawesome.github.io/Font-Awesome/icons/ (http://fortawesome.github.io/Font-Awesome/icons/)
Da kann man sich aus 519 Symbolen was raussuchen, fa-NameDesIcon
png, ico oder ähnliches wird nicht unterstützt, das habe ich auch nicht vor. Die FA Symbole sind sehr zahlreich, modern und simpel - passend zum beabsichtigen Stil dieses UI. Ich möchte keine Icons mit Farbverläufen oder 3D Look.
Es laufen auch schon Anträge zur Erweiterung der FA Icons für etwas mehr HomeAutomation Symbole, ich hoffe, die kommen mit dem nächsten Update vom Font Awesome
schließe mich deiner Meinung an.
Zitatpng, ico oder ähnliches wird nicht unterstützt, das habe ich auch nicht vor. Die FA Symbole sind sehr zahlreich, modern und simpel - passend zum beabsichtigen Stil dieses UI. Ich möchte keine Icons mit Farbverläufen oder 3D Look.
Das würde am Ende den Stil nur schaden!
Zitat von: schnibberle am 26 März 2015, 21:22:10
Gibts ne Möglichkeit den HUE Wert in RGB zu bekommen ?
Möchte das für WifiLight nutzen.
Keiner eine Idee ?
Für WifiLight wäre sowas wie "FF0000" (rot) geschickt als set.
Zitat von: schnibberle am 04 April 2015, 22:43:13
Keiner eine Idee ?
Für WifiLight wäre sowas wie "FF0000" (rot) geschickt als set.
danke, dass du wieder nachfragst. War schon wieder in Vergessenheit geraten. RGB Lesen und Setzen, richtig?
Update ist implementiert! Wenn man als zusätzliche CSS Class 'rgb' angibt, wird in RGB Format gesetzt und empfangen.
Huhu Bastel grad noch an den styles bisschen rum. Was ich aber bei mir entdecke der Homestatus ist extrem Buggy. Auch im ungeänderten File. Entweder wird per Klick falsche Werte übertragen oder es passt nicht. Klick ich auf Home setzt er erst 3 dann 1.. als ob er die Grenze nicht erkennt. aufm Tablet geht das Home gar nicht.
Einer vlt eine Idee?
MfG
Andy
Zitat von: DJ_SAMMY190 am 05 April 2015, 01:01:01
Huhu Bastel grad noch an den styles bisschen rum. Was ich aber bei mir entdecke der Homestatus ist extrem Buggy. Auch im ungeänderten File. Entweder wird per Klick falsche Werte übertragen oder es passt nicht. Klick ich auf Home setzt er erst 3 dann 1.. als ob er die Grenze nicht erkennt. aufm Tablet geht das Home gar nicht.
Einer vlt eine Idee?
MfG
Andy
Ich vermute das ist das gleiche Problem wie bei mir mit dem Dimmer Widget. Welchen Browser benutzt du? Und welche Android-Version hast du installiert?
Auf dem Tablet (Nexus 7-2012. Android 5.1 ) Chrome.
Desktop mit Chrome/IE/FF versucht.
Frohe Ostern @all!
Viel Spaß beim Eier suchen.... ;)
LG Marie
dito ;D
Hat denn schon jem. das "Easter-Egg" im UI entdeckt? ;D ;) ;)
Viel Spaß beim suchen.
Zitat von: DJ_SAMMY190 am 05 April 2015, 01:01:01
Huhu Bastel grad noch an den styles bisschen rum. Was ich aber bei mir entdecke der Homestatus ist extrem Buggy. Auch im ungeänderten File. Entweder wird per Klick falsche Werte übertragen oder es passt nicht. Klick ich auf Home setzt er erst 3 dann 1.. als ob er die Grenze nicht erkennt. aufm Tablet geht das Home gar nicht.
Einer vlt eine Idee?
MfG
Andy
Hallo zusammen,
DJ_SAMMY190 hat Recht, das Homestatus widget hat noch Optimierungpotential, bin auch grad nicht sooo zufrieden. Eigentlich "missbrauche" ich bei diesem Teil ein jQuery.Knob Element. Dort gibt es keine Mitte. Die versuche ich durch XY Koordinaten zu ermitteln zu. Mit Mouse-Events klappte das ganz gut, am Tablet muss ich auf Touch-Events ausweichen. Dann ist immer die Frage, welches Event kommt zuerst. Ich werde mir das ansehen und mich wieder melden. (nach dem Eier-Suchen :) )
Zitat von: DJ_SAMMY190 am 05 April 2015, 09:51:26
Auf dem Tablet (Nexus 7-2012. Android 5.1 ) Chrome.
Desktop mit Chrome/IE/FF versucht.
Versuche auf dem Tablet mal mit dem Firefox-Browser ist bei mir der einzigste wo unter Android 5.1 funktioniert.
Grüße und Fohe Ostern!
Ne hat leider nicht geholfen. Eilt aber bei mir absolut nicht. Wird ja erst in der nächsten Wohnung voll eingesetzt ;) Trotzdem macht schön weiter ;) so viele Ideen ;)
Ich hab da mal ne Frage.... 8)
Wir haben hier zwei LED Controller LW12, die wir über Wifilight in fhem eingebunden haben.
AN/AUS und Helligkeit klappen problemlos, aber Farbton und Sättigung kriegen wir nicht hin.
Soll über die Volume Widgets passieren, aber irgendwie klappts net.
Auch nach dem studieren der 42 Seiten hier kommen wir nicht weiter. Kann jemand einen Tipp geben?
Der Controller erwartet ja ein zusammengesetztes HSV-Signal, die Wert-Abfrage klappt mit Hue,brightness und saturation problemlos.
Sind wir nur zu doof? ;D
Grüße
Marie
Zitat von: Marie am 05 April 2015, 11:30:04
Ich hab da mal ne Frage.... 8)
Wir haben hier zwei LED Controller LW12, die wir über Wifilight in fhem eingebunden haben.
AN/AUS und Helligkeit klappen problemlos, aber Farbton und Sättigung kriegen wir nicht hin.
Soll über die Volume Widgets passieren, aber irgendwie klappts net.
Auch nach dem studieren der 42 Seiten hier kommen wir nicht weiter. Kann jemand einen Tipp geben?
Der Controller erwartet ja ein zusammengesetztes HSV-Signal, die Wert-Abfrage klappt mit Hue,brightness und saturation problemlos.
Sind wir nur zu doof? ;D
Grüße
Marie
Hallo Marie,
HSV und HSL Werte werden noch nicht unterstützt. Gestern Nacht habe ich aber noch RGB eingebaut. Zwar auch nicht im vollen Umfang, weil Sättigung (S) fest auf 100% und Helligkeit (L) auf 50% eingestellt sind. Aber vllt. nützt euch das schon was.
Farbton, für WifiLight in RGB
<div data-type="volume" data-device='dummy1'
data-min='0' data-max='360'
data-tickstep='4'
data-get='RGB'
data-set='RGB'
class="cell small hue-tick rgb" >
</div>
Helligkeit
<div data-type="volume" data-device='dummy1'
data-min='0' data-max='100'
data-tickstep='4'
data-get='dim'
data-set='dim'
class="cell small dim-tick" >
</div>
In der Readme gibt es für das Volume Widget noch mehr Werte für class="...", um das Aussehen zu beeinflussen
puh,
na das beruhigt mich dann...dachte schon...
ich werd es mal testen!
Danke
Getestet,
klappt schon recht gut, leider springt das Volume-Widget auch da wieder über die Grenzen (unter 0 und über 360).
Helligkeit benutze ich das Dimmer -Widget derzeit...supi!
Wenn jetzt auch noch die Sättigung irgendwann geht, wäre ich wunschlos glücklich.... :-)
Leider mangelt es mir an Javascript-Kenntnissen sonst würde ich da selbst auch mal reinschauen; ich kann zwar recht viel programmieren (und auch schon recht lange) aber vor Javascript & Co. habe ich mich immer gedrückt.. ;-)
Naja, vielleicht sollte ich mich mal damit auseinandersetzen, kann ja nicht schaden...wenn ich jetzt schon HTML programmieren muss :-)
Ich wünsche allen hier noch einen schönen Sonntag!
LG Marie
Hallo,
ich komme mit der Verteilung auf mehrere Anzeigeseiten nicht weiter. Wollte es analog zum Beispiel von nesges machen, aber mit html-Dateien anstatt PHP (da habe ich 0 Ahnung von). Leider gehen die Aufrufe nicht, da anscheinend die Pfade nicht stimmen und ich komme trotz vieler Versuche nicht auf die Lösung. Kann jemand helfen?
Die ganzen Dateien liegen wie in der Anleitung beschrieben unter /fritz.nas/fhem/www/tablet mit entsprechenden Unterordnern /js, /css, /fonts, /lib.
Wenn ich mit TabletFrontend das Frontend aufrufe, wird mir in der Browser-Commandzeile angezeigt: fritz.box:8083/fhem/tablet.
Hier ist schon mein erstes Verständnisproblem. Das müßte doch heißen: ...8083/fhem/www/tablet?
Gehe ich auf das Wohnzimmersymbol im Frontend wird mir als Sprungadresse angezeigt: fritz.box:8083/fhem/wohnzimmer.html. Da die Datei dort aber nicht liegt, springt er beim Aufruf in die WEB-Oberfläche von fhem.
Das ist mein Aufrufcode in der index.html:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4">
<header>RÄUME</header>
<style>
#room_index #bg {
color: rgb(170,105,0) !important;
border: 3px
}
</style>
<div class="container">
<a id="room_index" href="home.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_wohnzimmer" href="wohnzimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_kueche" href="kueche.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-cutlery" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_schlafzimmer" href="schlafzimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-bed" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_bad" href="bad.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-female" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_buero" href="arbeitszimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-laptop" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_aussen" href="aussen.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-sun-o" style="color: rgb(42, 42, 42);"></i>
</a>
</div>
</li>
Wenn ich hier die Pfade korrigiere klappt der Aufruf von Wohnzimmer.html, aber der Rücksprung läuft ins leere. Was muss ich denn wie einstellen, dass die Ein- und Aussprünge klappen?
Gruß Jürgen
Vielleicht hilft dir meine Hardcopy weiter :-\
(//)
Ps: Du hast oben rechts, "Müll". Ist woher kommen deine Werte? Kalender, o.ä?
Ist z.B. julia.html im Verzeichnis js? Das würde meiner bisherigen Logik widersprechen, wobei die ja nicht wirklich funktioniert. :-)
Ich vermute eher, dass es ein Problem mit dem Basisverzeichnis und den relativen Pfadangaben ist, auf dessen Lösung ich nicht komme.
Ich habe einen Müllkalender (holiday-template) angelegt und meine Abholtermine eingetragen. Von dessen readings-group erzeuge ich einen dummy mit dem Status Nichts, wenn am nächsten Tag keine Abholung ansteht bzw. mit dem Müll, der abgeholt wird. Bei uns Papier, Restmüll und Gelber Sack. Den wiederum blende ich ein und generiere eine push-message am Vorabend der Abholung.
Ich habe es verm. falsch verstanden. Alle html sind im Verzeichnis www/tablet, genau so wie bei mir. Hast Du in der Inex.html irgend einen Basispfad o.ä. angegeben? Ich weiss nicht, ob man das bei html-Seiten machen muss und es wäre meine einzige Erklärung, warum es bei mir nicht funktioniert.
es liegen alle Dateien innerhalb von /tablet.
In der Index Datei habe ich keine sonstigen Einträge
Das ist meine index.html => das "Menü" was ich links habe. Dies habe ich in jede Datei (Julia.html, Wohnzimmer.html etc.) eingetragen !!!!
Zitat<li data-row="1" data-col="1" data-sizex="1" data-sizey="4">
<header>RÄUME</header>
<style>
#room_index #bg {
color: rgb(170,105,0) !important;
border: 3px
}
</style>
<div class="container">
<a id="room_index" href="index.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_schlafzimmer" href="schlafzimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-bed" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_kueche" href="kueche.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-cutlery" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_wohnzimmer" href="wohnzimmer.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_ben" href="ben.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-male" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_julia" href="julia.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-female" style="color: rgb(255,255,255);"></i>
</a>
<a id="room_wetter" href="wetter.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-umbrella" style="color: rgb(255,255,255);"></i>
</a>
</div>
</li>
ZitatIch habe einen Müllkalender (holiday-template) angelegt und meine Abholtermine eingetragen. Von dessen readings-group erzeuge ich einen dummy mit dem Status Nichts, wenn am nächsten Tag keine Abholung ansteht bzw. mit dem Müll, der abgeholt wird. Bei uns Papier, Restmüll und Gelber Sack. Den wiederum blende ich ein und generiere eine push-message am Vorabend der Abholung.
Super ! kannst Du mir den Auszug aus dem "dummy" und der "reading-group" mal zukommen lassen. Habe auch eine .holiday - Datei, bekomme das aber nicht hin :-\
Hab das Menü auch ausprobiert bei mir funktionierts so:
<a id="room_garten" href="www/tablet/garten.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(42, 42, 42);"></i>
</a>
Und bei Mouseover sehe ich den richtigen Pfad zur Datei.
Mit diesem Code gehts bei mir auch nicht
<a id="room_garten" href="garten.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-cutlery" style="color: rgb(42, 42, 42);"></i>
</a>
kommt beim Mouseover IP/fhem/garten.html
Also muss da wohl wo was anderes eingetragen sein ?!?
EDIT: AAAH , das funktioniert nur bei ersten mal, nach weiteren aufrufen stimmt dann der Eintrag nicht mehr.
Hallo alle, die mehrere Seiten anlegen wollen.
Ich würde das Button-Widget von nesges nutzen, dort ist alles nötige untergebracht und ihr braucht euch nicht mit id, style, href usw. rumschlagen.
Hier der Link zum Widget: https://github.com/nesges/Widgets-for-fhem-tablet-ui/#button (https://github.com/nesges/Widgets-for-fhem-tablet-ui/#button)
Einfach ins js Verzeichnis kopieren.
Seite1
<div data-type="button" data-url="index2.html"></div>
Seite2
<div data-type="button" data-url="index.html"></div>
Das Button-Widget hatte ich vorher versucht und dort habe ich das selbe Problem mit den Links zu den Unterseiten.
EDIT: nichts geändert und jetzt gehts wie bei bjoernbo mit "href="index.html".
Ich verstehs nicht mehr ::)
Voila, meine Mülllogik:
#########################################################
# --- Abholtage Abfall anzeigen ---
#########################################################
define rgAbfallkalender readingsGroup abfallkalender:!title\
abfallkalender:!day|0,!Restabfall|0,!Leichtverpackungen|0,!Papier|0,!Bioabfall|0,!O-Tonne|0,!Tannenbaum|0\
abfallkalender:!day|1,!Restabfall|1,!Leichtverpackungen|1,!Papier|1,!Bioabfall|1,!O-Tonne|1,!Tannenbaum|1\
abfallkalender:!day|2,!Restabfall|2,!Leichtverpackungen|2,!Papier|2,!Bioabfall|2,!O-Tonne|2,!Tannenbaum|2\
abfallkalender:!day|3,!Restabfall|3,!Leichtverpackungen|3,!Papier|3,!Bioabfall|3,!O-Tonne|3,!Tannenbaum|3\
abfallkalender:!day|4,!Restabfall|4,!Leichtverpackungen|4,!Papier|4,!Bioabfall|4,!O-Tonne|4,!Tannenbaum|4\
abfallkalender:!day|5,!Restabfall|5,!Leichtverpackungen|5,!Papier|5,!Bioabfall|5,!O-Tonne|5,!Tannenbaum|5\
abfallkalender:!day|6,!Restabfall|6,!Leichtverpackungen|6,!Papier|6,!Bioabfall|6,!O-Tonne|6,!Tannenbaum|6\
abfallkalender:!day|7,!Restabfall|7,!Leichtverpackungen|7,!Papier|7,!Bioabfall|7,!O-Tonne|7,!Tannenbaum|7\
abfallkalender:!day|8,!Restabfall|8,!Leichtverpackungen|8,!Papier|8,!Bioabfall|8,!O-Tonne|8,!Tannenbaum|8\
abfallkalender:!day|9,!Restabfall|9,!Leichtverpackungen|9,!Papier|9,!Bioabfall|9,!O-Tonne|9,!Tannenbaum|9\
abfallkalender:!day|10,!Restabfall|10,!Leichtverpackungen|10,!Papier|10,!Bioabfall|10,!O-Tonne|10,!Tannenbaum|10\
abfallkalender:!day|11,!Restabfall|11,!Leichtverpackungen|11,!Papier|11,!Bioabfall|11,!O-Tonne|11,!Tannenbaum|11\
abfallkalender:!day|12,!Restabfall|12,!Leichtverpackungen|12,!Papier|12,!Bioabfall|12,!O-Tonne|12,!Tannenbaum|12\
abfallkalender:!day|13,!Restabfall|13,!Leichtverpackungen|13,!Papier|13,!Bioabfall|13,!O-Tonne|13,!Tannenbaum|13\
abfallkalender:!day|14,!Restabfall|14,!Leichtverpackungen|14,!Papier|14,!Bioabfall|14,!O-Tonne|14,!Tannenbaum|14
attr rgAbfallkalender alias Müllabfuhr
attr rgAbfallkalender cellStyle { "r:1"=>'style="font-weight:bold;;font-size:16px"',"c:1"=>'style="font-weight:bold;;text-align:right;;padding-left:28pt;;"'}
attr rgAbfallkalender group Müll
attr rgAbfallkalender nonames 1
attr rgAbfallkalender valueColumns { title => 'colspan="7"' }
attr rgAbfallkalender valueFormat {if($READING eq 'title'){$VALUE="recycling"}else{my($r,$d)=split(/\|/,$READING);;;;my $v=fhem("get abfallkalender days $d",1);;;;if($v eq "none"){$VALUE=undef}else{if($r eq 'day'){if($d==0){$VALUE="Heute"}elsif($d==1){$VALUE="Morgen"}else{$VALUE="in $d Tagen"}}else{if($v=~m/$r/){$VALUE=1}else{$VALUE=' '}}}}}
attr rgAbfallkalender valueIcon {if($VALUE eq 'recycling'){$VALUE}elsif($VALUE eq 1){if($READING=~m/Restabfall/){$VALUE='bag'}elsif($READING=~m/Leichtverpackungen/){$VALUE='bag@FFFF00'}elsif($READING=~m/Papier/){$VALUE='bag@01A3F5'}elsif($READING=~m/Bioabfall/){$VALUE='bag@04D921'}elsif($READING=~m/O-Tonne/){$VALUE='dustbin@FF6D00'}elsif($READING=~m/Tannenbaum/){$VALUE='christmas_tree@2B6B17'}}else{$VALUE=''}}
attr rgAbfallkalender valueSuffix {'title'=>' Müllabfuhr'}
und die dummys
# --- Müllstatus in dummy ablegen, damit im WEB-UI angezeigt werden kann
# --- di_abfallkalender: Kopiert Info über Abholung von morgen in du_abfallkalender
define du_abfallkalender dummy
define di_abfallkalender DOIF ([abfallkalender:tomorrow] eq "Papier") ({fhem ("setreading du_abfallkalender state Papier")}) DOELSEIF ([abfallkalender:tomorrow] eq "Restabfall") ({fhem ("setreading du_abfallkalender state Restmüll")}) DOELSEIF ([abfallkalender:tomorrow] eq "Leichtverpackungen") ({fhem ("setreading du_abfallkalender state Gelber Sack")}) DOELSE ({fhem ("setreading du_abfallkalender state Nichts")})
# --- Prüft täglich um 18:00 Uhr, ob am nächsten Tag Abholung ansteht
define di_pushmsg_Abfallkalender DOIF ([20:00] and [?du_abfallkalender:state] ne "Nichts") ({fhem("set PushoverAdresse1 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 ''")},{fhem("set PushoverAdresse2 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 ''")})
Ich melde mich mal wieder. Nachdem ich alles upgedatet habe, funktioniert nun auch das Longpoll bei mir (Verzögerung ca. 2 bis 3. Sekunden) :)
Was ich gerne anpassen würde, ist die kleine Anzeige der measure-temp im thermostat-Wigdet - die ist für meine Augen einfach zu klein. Von meinen Eltern, die zukünftig das tablet UI nutzen sollen, will ich gar nicht sprechen.
Im thermostat-Wigdet habe ich die passende Stelle nicht finden können. Kann mir jemand einen Tipp geben?
Gruß
Damian
widget_thermostat.js
Zeile 127:
c.font="10px sans-serif";
Danke bmwfan ! Den obrigen code habe ich, da ich die Müllabfuhr damals schon im Dashboard hatte. Die Dummys fehlte mit jetzt nur noch.
Kann dieser auch 2 Werte ausgeben, also wenn an einem Tag zwei Tonnen geleert werden?
Dank.
:D der Schwiegervater hatte heute Spaß mit dem UI. Was ihm, aber auch mir schon aufgefallen ist, wenn man das Thermostat bedient und die Temperatur mit dem Finger einstellt, muss man immer um den Finger herum gucken, da man nicht (so gut) erkennt, welchen Wert man gerade hat. Das aber nur kurz am Rande.
Habe ich nie getestet, aber wenn Du in ein 2.tes Reading schreibst müsste es gehen. Ich vermute, dass man pro dummy beliebig viele readings anlegen kann. Bin aber wirklich noch ganz am Anfang mit dieser Art der Programmierung und vermute es nur. Würde es mit setreading du_abfallkalender state2 Sonderabfall versuchen.
Beim Anzeigen en weiteres Label definieren.
Zitat von: setstate am 05 April 2015, 21:29:52
widget_thermostat.js
Zeile 127:
c.font="10px sans-serif";
Danke. Habe es gerade angepasst, inklusive Position. Jetzt muss ich mir js genauer anschauen, um die Temperatur-Zahl entsprechend der Temperatur zu färben.
Gruß
Damian
Nochmals kurz zu den LinkSeiten.
Habe es nun auf mehreren Tablets probiert.
Beim ersten Aufruf pro Tablet/Computer muss ich eine Unterseite mit dem Direkten Link im Browser aufrufen,
sprich http://IP/fhem/www/tablet/status.html, dann funktionieren auch alle anderen Links bei den weiteren malen.
Direkt aus dem Link http://IP/fhem/tablet gehts nicht.
Kann dazu jemand was sagen, wieso das so ist oder ob das ein Fehler ist?
Zitat von: bjoernbo am 05 April 2015, 21:36:56
:D der Schwiegervater hatte heute Spaß mit dem UI. Was ihm, aber auch mir schon aufgefallen ist, wenn man das Thermostat bedient und die Temperatur mit dem Finger einstellt, muss man immer um den Finger herum gucken, da man nicht (so gut) erkennt, welchen Wert man gerade hat. Das aber nur kurz am Rande.
Das werde ich demnächst angehen, das gefällt mir auch nicht so gut. Größer machen will ich das Thermostat-Widget aber auch nicht, als Anzeige reicht die Größe mir völlig.
Ich will versuchen, dass sich dann das Soll-Temp-Label beim Bedienen raus bewegt und damit sichtbar bleibt.
Zitat von: Damian am 05 April 2015, 21:48:40
Danke. Habe es gerade angepasst, inklusive Position. Jetzt muss ich mir js genauer anschauen, um die Temperatur-Zahl entsprechend der Temperatur zu färben.
Gruß
Damian
:-) Hatte ich auch gerade probiert, gefällt mir optisch aber nicht.
Man muss sich den Wert der Zeile 91 in einer Variable merken und in der Zeile 126 benutzen.
Klar, das ist Geschmacksache, aber das ist ja das Schöne an diesem UI, dass sich so jeder seine Wünsche erfüllen kann. Allerdings nimmt so, wie du vorgeschlagen hast, die Ist-Temperatur die Farbe der Solltemperatur, wenn man sie hochdreht.
Gruß
Damian
Zitat von: setstate am 04 April 2015, 23:14:12
danke, dass du wieder nachfragst. War schon wieder in Vergessenheit geraten. RGB Lesen und Setzen, richtig?
Update ist implementiert! Wenn man als zusätzliche CSS Class 'rgb' angibt, wird in RGB Format gesetzt und empfangen.
Funktioniert TOP! Du bist echt der Hammer !!
Zitat von: Damian am 05 April 2015, 22:30:20
Klar, das ist Geschmacksache, aber das ist ja das Schöne an diesem UI, dass sich so jeder seine Wünsche erfüllen kann. Allerdings nimmt so, wie du vorgeschlagen hast, die Ist-Temperatur die Farbe der Solltemperatur, wenn man sie hochdreht.
Gruß
Damian
Du hast Recht, dann darf man die Farbe nur in einem bestimmten Fall speichern:
Zeilen nach 91:
if (tick-tick_w*dist <= acAngle )
destcolor=c.strokeStyle;
Guten Abend,
Ich muss da noch einmal kurz stören. Mich irritiert da ein Problem im Zusammenhang mit class="cell left" oder right.
Wenn ich versuche mehrere Tasten damit zu formatieren, lassen sich manche Tasten dann nicht mehr bedienen. Entweder mache ich etwas falsch oder es handelt sich um einen bin bei mir.
Das UI läuft einem raspi, Tablet ist ein iPad air2.
Es tritt immer nur in Zusammenhang mit cell left /Right auf.
Kann mir da jemand helfen?
Config sieht so aus:
<div class="cell left">
<div data-type="switch" data-device="Receiver_WZ"
data-get="input"
data-get-off="((?!airplay).)*"
data-get-on="airplay"
data-set-on="input airplay"></div>
<div data-type="label">Airplay</div>
</div>
Ist das so überhaupt richtig?
LG Marie
PS: wie geht das mit Code einfügen???
Zitat von: mrfloppy am 05 April 2015, 21:49:41
Nochmals kurz zu den LinkSeiten.
Habe es nun auf mehreren Tablets probiert.
Beim ersten Aufruf pro Tablet/Computer muss ich eine Unterseite mit dem Direkten Link im Browser aufrufen,
sprich http://IP/fhem/www/tablet/status.html, dann funktionieren auch alle anderen Links bei den weiteren malen.
Direkt aus dem Link http://IP/fhem/tablet gehts nicht.
Kann dazu jemand was sagen, wieso das so ist oder ob das ein Fehler ist?
Es geht sogar, wenn man nur ein "/" ergänzt. Also "http://IP/fhem/www/tablet/" statt "http://IP/fhem/www/tablet"
Scheinbar übergibt der Webserver von FHEM den aktuellen Pfad nicht richtig an den Browser. Der Browser meint, dass er sich im Verzeichnis "http://IP/fhem/www/" befindet und sucht dann die nächste Datei konsequenterweise in diesem Verzeichnis.
Bin immer noch ganz begeistert von dem UI hier. Habe jetzt schon auf einigen Screenshots div. Buttons mit Radiosendern gesehen. Frage: Streamt ihr einfach aufs Tablet oder direkt auf irgendwelche DLNA Player? Würde als nächstes gern Musik ins Bad bringen. Deckenlautsprecher sind bereits da. Habe nun überlegt, ob man die Lautsprecher an einen DLNA Player (Modul) anschließt und dann Musik dorthin streamt. Wer macht das ggf. so? Wenn ja, wie?
Besten Dank schon mal! :)
Hallo jemu75,
vor ein paar Tagen habe ich ein ganz simples Webstream widget gemacht, das spielt den Stream direkt auf dem Tablet ab. Man müsste also per Bluetooth an "richtige" Lautsprecher weiterleiten, oder per Kabel. Das nutze ich persönlich nicht, weil mein Tablet nur im Eingangsbereich an der Wand hängt zum Steuern.
Ich habe diese Webradio http://www.elv.de/FS20-Internet-Radio-Box-FS20-IRB-Komplett-integrierbares-Internetradio/x.aspx/cid_726/detail_36962 (http://www.elv.de/FS20-Internet-Radio-Box-FS20-IRB-Komplett-integrierbares-Internetradio/x.aspx/cid_726/detail_36962), was man per HTTP Aufrufe über FHEM steuern kann und auch den Sendernamen darüber ablesen kann. Das hat sogar eine eigene Endstufe. Also Lautsprecher dran -> fertig. Oder an die normale Anlage anschließen und per aux-Anschluß hören. Das ist bei mir der Radio Button, ein Dummy im FHEM, was beim State ON, den AV-Receiver anmacht, auf AUX umschaltet und im ELV Webradio auf Radio Eins vom RBB umschaltet. Läuft wunderbar seit Jahren ...
Zitat von: setstate am 05 April 2015, 10:30:25
Hallo zusammen,
DJ_SAMMY190 hat Recht, das Homestatus widget hat noch Optimierungpotential, bin auch grad nicht sooo zufrieden. Eigentlich "missbrauche" ich bei diesem Teil ein jQuery.Knob Element. Dort gibt es keine Mitte. Die versuche ich durch XY Koordinaten zu ermitteln zu. Mit Mouse-Events klappte das ganz gut, am Tablet muss ich auf Touch-Events ausweichen. Dann ist immer die Frage, welches Event kommt zuerst. Ich werde mir das ansehen und mich wieder melden. (nach dem Eier-Suchen :) )
SOOO, FERTIG
Es gibt ein Update des Homestatus Widgets. Ich habe gleich Nägel mit Köpfen gemacht. Um nicht lange an den Symptomen zu doktern, habe ich kurzerhand das jQuery.knob optimiert. Deshalb wird es
notwendig, in der index.html jetzt das eigene js File einzubinden, und nicht mehr das Original, was FHEM mitbringt. -> Zeile mit Minus löschen und die mit Plus reinschreiben.
- <script type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
+ <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
Hallo zusammen.
Nach dem ich mit meinem Layout fast fertig bin stören mich nur noch die unformartierte Ausgabe der KS300 Werte, siehe in der Hardcopy "Aussen" und "KS300 Daten".
Wie kann ich zum Beispiel nur die Temperatur einzaln anzeigen lassen:
Siehe info.JPG & wetter.JPG
Ausserdem ist auf meinem Ipad die "desired-temp" total daneben.
Siehe ipad.png
Hat jemand ein Tipp für mich?
Gruß
Markus
Hallo Markus,
deine Oberflächen sehen auch sehr, sehr schön aus, gefällt mir.
Beim Widget Label kann man mit data-part="2" zum Beispiel nur den 2.Teil aus STATE anzeigen. Man muss dann halt mehrere Labels benutzen. Ansonsten versteht data-part auch RegEx, wenn du dich damit auskennst.
Die iPad Geschichte schaue ich mir noch an ...
Viele Grüße
Mario
Zitatdeine Oberflächen sehen auch sehr, sehr schön aus, gefällt mir.
Danke, aber ohne Dein geniales UI wäre das nicht möglich.
Und danke für den
data-part-Tipp, klappt super. Hast Du auch vielleicht eine Idee warum beim IPad die "desired-temp"-Anzeige so verschoben ist?
Gruß
Markus
Cool probiere ich heute abend mal direkt aus, wenn ich zu hause bin. Danke schön
Gesendet von meinem Z30 mit Tapatalk
Zitat von: Markus Hermann am 06 April 2015, 13:21:52
Danke, aber ohne Dein geniales UI wäre das nicht möglich.
Und danke für den data-part-Tipp, klappt super. Hast Du auch vielleicht eine Idee warum beim IPad die "desired-temp"-Anzeige so verschoben ist?
Gruß
Markus
ich vermute, das liegt an der Breite. Dadurch wird das Input Element verschoben. Versuche spasseshalber mal, die Basis eines Feldes breiter zu machen:
Zitat<meta name="widget_base_width" content="140">
Zu den Links:
Wenn ich das Frontend durch Eingabe des Browserpfades im Browser eingebe (http://192.168.178.1:8083/fhem/www/tablet/index.html), gehen alle weiteren Links zu Unterseiten, allerdings lädt es keinerlei Inhalte aus fhem (Zustände, Werte..). Da stimmt dann anscheinend ein interner Pfad nicht.
Rufe ich das Frontend aus FHEM auf, Werden die Inhalte geladen aber, da das root-Verzeichnis /fhem ist, geht kein Link. Ändere ich in der index.html den Pfad zum Link ab
<div class="container">
<a id="room_index" href="index.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_eg" href="./www/tablet/eg.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(42, 42, 42);"></i>
</a>
</div>
geht der Einsprung und seltsamerweise auch der Rücksprung zur index.html, aber der 2.te Aufruf von eg.html geht nicht, da dann /fhem/www/tablet/www/tablet/eg.html angesprochen wird.
Ich habe auch schon versucht, in der fhem-tablet-ui.js die Pfade in Zeilen 180, 214, 295 anzupassen.
$.ajax({
async: true,
url: $("meta[name='fhemweb_url']").attr("content") || "../fhem/www/tablet/",
data: {
cmd: cmdline,
XHR: "1"
}
})
Hatte aber keine Auswirkugn (zumindest nichts bemerkt).
Hat noch jemand eine Idee. Da ich Beispiele gesehen habe mit verteilten html-Seiten, muss es ja gehen.
Gruß Jürgen
Icon wird nicht angezeigt.
Der Code ist meiner Meinung nach korrekt, aber das icon wird trotzdem nicht angezeigt. Ich zeige hier den Status meines Müllkalenders an. Die state sind "Nichts", "Papier", "Gelber Sack" und "Restmüll" und damit strings. Da dies die einzigen strings sind, die ich anzeigen will, vermute ich, dass das Problem damit zusammenhängt.
<li data-row="3" data-col="4" data-sizex="1" data-sizey="1">
<header>MÜLL</header>
<div data-type="label" data-device="du_abfallkalender" data-get="state" data-icon="fa-trash-o" class="cell"></div>
</li>
Hat jemand einen Ansatz?
Zitat von: bmwfan am 06 April 2015, 17:05:22
Icon wird nicht angezeigt.
Der Code ist meiner Meinung nach korrekt, aber das icon wird trotzdem nicht angezeigt. Ich zeige hier den Status meines Müllkalenders an. Die state sind "Nichts", "Papier", "Gelber Sack" und "Restmüll" und damit strings. Da dies die einzigen strings sind, die ich anzeigen will, vermute ich, dass das Problem damit zusammenhängt.
<li data-row="3" data-col="4" data-sizex="1" data-sizey="1">
<header>MÜLL</header>
<div data-type="label" data-device="du_abfallkalender" data-get="state" data-icon="fa-trash-o" class="cell"></div>
</li>
Hat jemand einen Ansatz?
Hallo bmwfan,
Label hat keine Eigenschaft "Icon". Da musst du ein Symbol-Widget nehmen, zusätzlich zum Label.
Das Label zeigt deine Werte aus state an und das Symbol ist statisch, d.h. ohne Einfluss durch eine state-Änderung.
<div data-type="symbol" data-icon="fa-trash-o" class="cell"></div>
<div data-type="label" data-device="du_abfallkalender" data-get="state" class=""></div>
Wenn sich das Icon noch nach dem State Werte farblich (oder vom Symbol her) ändern soll, musst du noch die data-icons, data-get-on und data-on-colors setzten (alle drei)
<div data-type="symbol" data-device="du_abfallkalender" data-icons='["fa-arrow-up","fa-arrow-right","fa-arrow-down"]' data-on-colors='["#32a054","#6666cc","#ad3333"]' data-get-on='["Wert1","Wert2","Wert3"]' class=""></div>
<div data-type="label" data-device="du_abfallkalender" data-get="state" class=""></div>
Zunächst einmal möchte ich allen beteiligten Entwicklern an diesem genialen und einfach zu konfigurierenden Frontend gratulieren. Bisher hatte ich versucht, eine Oberfläche mittels Dashboard zu erstellen. Nachdem ich nun alle Infos für eine Übersicht zusammen hatte, wollte ich mich an die Optimierung des Designs begeben.
Nachdem ich allerdings auf dieses tolle Frontend für Tablets aufmerksam geworden bin, habe ich das erstmal zurück gestellt und auch die geplanten Versuche mit SmartVisu erst einmal zurück gestellt. Zunächst stand für dieses Wochenende allerdings erst einmal der Umzug von meinem alten Raspi auf das 2er Raspi an. Danach habe ich mich nur noch mit diesem Frontend beschäftigt und muss das Ergebnis nun nur noch von meiner Frau freigeben lassen ;)
Als Ergänzung füge ich mal mein bisheriges Dashboard und das neu erstellte Frontend als Screenshots hinzu. Ein paar Optimierungen bzw. Ergänzungen fehlen natürlich noch. Ganz unten ist noch ein wenig Platz und bei Verwendung von WebviewControl kann ich wahrscheinlich noch ein paar Texte vergrößern. Außerdem fehlen noch weitere Detailseiten zu den Räumen bzw. die Einstellungsseite. Spannend dürfte die Realisierung eines Weckers werden, den ich auf dem Dahboard bereits umgesetzt habe. Hier kann ich für jeden Tag eine andere Weckzeit definieren.
Natürlich habe ich auch noch ein paar Anmerkungen bzw. Ideen/Wünsche.
Wäre es zum Beispiel möglich, die Formatierung von Icons mittels der vordefinierten Klassen (z.B. "fa-rotate-90") zu nutzen. Idealerweise sogar in Abhängigkeit von den Werten. Also so etwas wie data-css oder data-css-array. Ein Hinweis auch noch zur Doku auf der Projektseite. Hier ist bei "label" tatsächlich auch "Icon" als Einstellung angegeben. Ähnlich, wie bei einem vorherigen Beitra hier, habe ich eine Weile damit gekämpft, in der Hoffnung über das Icon den Text legen zu können ;).
Ansonsten erstmal VIELEN DANK!!!!!
Zitat von: bmwfan am 06 April 2015, 16:42:40
Zu den Links:
...
Gruß Jürgen
Hallo Jürgen,
leider kann ich deine Link-Problematik theoretisch und praktisch nicht nachvollziehen.
Aber, wenn die Links relativ nicht gehen, dann hinterlege sie doch statisch, so wie sie bei der Eingabe in der Browser URL-Eingabe ordentlich funktionieren. Der lokale Pfad auf einem Webserver sieht meist nur so ähnlich aus, wie dann die URL. Lass dich dadurch nicht all zu sehr verwirren. ./www ist der lokale Pfad, den der Webserver dir unter xyz:8083/fhem anbietet. Wenn du zwei Tablet-Seiten im Browser aufrufen kannst, übernimm einfach die URLs in den Link.
Seite index.html
<div data-type="button" data-url="http://192.168.178.1:8083/fhem/www/tablet/index2.html"></div>
Seite index2.html
<div data-type="button" data-url="http://192.168.178.1:8083/fhem/www/tablet/index.html"></div>
Hallo Jual,
vielen Dank für dein Posting. Die Umsetzung ist doch toll gelungen und relativ schnell, denke ich!!!
Wecker wäre natürlich nochmal ein schönes Widget Projektvorhaben :-)
Zum Thema fa- Formatierung geht bestimmt was zu machen, da gibt es ja einige schöne Gimmiks.
Ihr habe Recht, das steht wirklich was von Icon beim Label in der Readme. Peinlich! Ist jetzt angepasst. Vielen Dank für den Hinweis.
Ein Aufruf an alle, die hier fleißig schreiben, testen, neues hinzuschreiben: Bitte auch im Wiki mitarbeiten! Marios tolle Arbeit wird damit noch ein Stück mehr gewürdigt wie ich finde. Ich habe zwar angefangen, aber Mario hat ja jeden Tag mindestens ein Update. Da komme ich nicht nach. Gemeinsam wird das aber :-)
Hallo Jual,
mich interessieren deine Einträge "Spritpreise" und die "Pollenvorhersage". Kannst du dazu entsprechenden Output liefern, sprich wie hast Du das in FHEM umgesetzt? Danke.
Hallo,
ich möchte gerne für meinen Kalender, dass in einer Zelle die Beginnuhrzeit und Enduhrzeit ausgewiesen wird. Zwischen den Zeiten soll ein "bis" bzw. ein "-" stehen.
Zitat....
<td class="tg-031e"><div type="label" device="Kalenderview" data-get="today_001_btime">
<div data-type="label" class="cell">bis
<div type="label" device="Kalenderview" data-get="today_001_etime"></div>
</div>
</div>
</td>
###
Zitat....
<td class="tg-031e"><div type="label" device="Kalenderview" data-get="today_001_btime">
bis
<div type="label" device="Kalenderview" data-get="today_001_etime">
</div>
</div>
</td>
Wie muss hierfür der Code richtig aussehen :-\
Zitat von: setstate am 03 April 2015, 17:53:04
Danke nesges für die Idee. Ich habe die Funktionalität übernommen, aber in etwas geänderter Form.
Mit dieser Änderung kommt das circleMenu jetzt als eigenständiges Widget.
Sehr cool! Danke! :) Was hier in den letzten Tagen wieder passiert ist... Klasse!
Zitat von: bjoernbo am 07 April 2015, 08:59:07
Hallo,
ich möchte gerne für meinen Kalender, dass in einer Zelle die Beginnuhrzeit und Enduhrzeit ausgewiesen wird. Zwischen den Zeiten soll ein "bis" bzw. ein "-" stehen.
###Wie muss hierfür der Code richtig aussehen :-\
Hallo bjoernbo,
was soll rauskommen? Drei Zeilen? dann wäre das so richtig:
<div id="container">
<div id="widget1"></div>
bis
<div id="widget2"></div>
</div>
Oder soll alles in eine Zeile? Dann muss das Gridster-Panel natürlich breit genug sein. Ist das gegeben?
Und dann bedarf es noch einer bestimmten CSS Klasse, die ich noch anlegen werde.
Zitat von: setstate am 05 April 2015, 21:51:24
Das werde ich demnächst angehen, das gefällt mir auch nicht so gut. Größer machen will ich das Thermostat-Widget aber auch nicht, als Anzeige reicht die Größe mir völlig.
Ich will versuchen, dass sich dann das Soll-Temp-Label beim Bedienen raus bewegt und damit sichtbar bleibt.
Das Design des Thermostat-Widgets finde ich auch etwas suboptimal, weil beim Verstellen eben immer der eigene Finger im Weg ist.
Nur mal als Anregung: Es würde schon viel helfen, wenn die Skala quasi einmal von unten nach oben gespiegelt wäre, also unten geschlossen und oben offen. Meist bewegt man sich ja ohnehin im mittleren Bereich, und dann wäre der Finger unterhalb der Zahlenanzeige und nicht genau drüber. Wenn man die Soll-Anzeige dann vielleicht noch ein Stück nach oben schiebt, müsste sie eigentlich auch beim Ändern jederzeit zu sehen sein.
ZitatOder soll alles in eine Zeile? Dann muss das Gridster-Panel natürlich breit genug sein. Ist das gegeben?
Und dann bedarf es noch einer bestimmten CSS Klasse, die ich noch anlegen werde.
Alles in einer Zelle. Also
"12:00:00 bis 18:00:00"
<t001_btime> bis <t001_etime>
Die breite sollte nicht das Problem sein. Habe die Werte einfach mal so eingetragen und es passte.
Hast Du schon einen Zeitpunkt in Aussicht?
Zitat von: bjoernbo am 07 April 2015, 10:49:53
Alles in einer Zelle. Also
"12:00:00 bis 18:00:00"
<t001_btime> bis <t001_etime>
Die breite sollte nicht das Problem sein. Habe die Werte einfach mal so eingetragen und es passte.
Hast Du schon einen Zeitpunkt in Aussicht?
Sooo, gehts:
<div class="">
<div type="label" device="OnSunrise" class="inline"></div>bis
<div type="label" device="OnSunset" class="inline"></div>
</div>
Class 'inline' ist nun neu im CSS Files.
Einen schönen Tag noch
Mario
DANKE! Funktioniert hervorragend!
Zitat von: bjoernbo am 06 April 2015, 22:46:34
Hallo Jual,
mich interessieren deine Einträge "Spritpreise" und die "Pollenvorhersage". Kannst du dazu entsprechenden Output liefern, sprich wie hast Du das in FHEM umgesetzt? Danke.
Die Spritpreise, Polleninfo und die Fahrzeiten auf meiner Übersichtseite hole ich mir direkt von entsprechenden Webseiten mittels httpmod Modul. Damit lassen sich Internetseiten abrufen und die entsprechenden Infos mittels regulärer Ausdrücke ermitteln. Ist nicht immer ganz einfach, funktionniert aber recht gut. Da das für diesen Thread wahrscheinlich zu OffTopic ist, einfach mal nach httpmod in diesem Forum suchen. Daher habe ich auch meine Infos und sollte ein für ein paar erste Ideen ausreichen.
Bei Bedarf kann ich aber auch gerne konkrete Programmbeispiele darstellen - gerne auch als private Nachricht, wenn gewünscht.
Danke! Die Spritpreise habe ich schon. Ich versuche mich dann mal an die Pollenvorhersage und werde mich ggf. bei dir mal melden.
Ich hatte ja gestern bei der Vorstellung meines neuen UIs die Umsetzung eines Weckers angesprochen. Das Grundprinzip meines Weckers steht mittlerweile und ich muss nur noch die eigentliche Umsetzung in die Oberfläche erstellen. Nachfolgend möchte ich nur kurz meinen Ansatz weiter geben. Vielleicht gibt es ja noch weitere Ideen. Sobald der Wecker bzw. das Stellen von Weckzeiten fertig ist, werde ich dann geren den ganzen Code hier präsentieren.
Basis für meinen Ansatz ist mein bisheriger "Wecker" innerhalb meines Dashboards. Der eigentliche Wecker wird mittels dem Modul WeekdayTimer realisiert. Diesen habe ich einmal definiert und ändere ihn mittes "modify" jedesmal, wenn eine neue Weckzeit eingestellt wird. Für das Stellen habe ich ein Dummy definiert, welches für jeden Wochentag ein Reading mit der jeweiligen Weckzeit enthält. Im Dashboard habe ich dann eine Readingsgroup verwendet, wo mittel time-widget die Weckzeit eingestellt werden kann.
Für das Tablet UI verwende ich weiterhin meinen Ansatz mit dem Dummy und dem WeekdayTimer. Auf Grund eines fehlenden "Timer-Widgets" habe ich nach einer geschickten Verwendung der aktuell vorhandenen Widgets gesucht. Grundsätzlich kämen hier wohl auch dimmer und slider in Frage. Auf Grund der besseren Bedienbarkeit habe ich mich aber für das Volume Widget entschieden. Ich habe im Prinzip 3 widgets genutzt und einen zusätzliches push-widget für das Stellen der eingestellten Zeit.
Der Rest ist dann eigentlich relativ einfach. Die widgets wurden begrenzt auf 1-7 für Tage, 0-24 für Stunden und 0-60 für Minuten. Zum Stellen der Zeiten habe ich ein zusätzliches Dummy mit den Readings Tag, Stunde, Minute erstellt und als devices für die Volume Widgets genutzt. Sobald der "Stellen-Knopf" gedrückt wird, rufe ich eine Funktion auf, die dann mein eigentliches Dummy mit den einzelnen Weckzeiten ändert. Über ein notify dieses dummys wird dann das modify für die WeekdayTimer Definition geändert.
Vielleicht hilft die Anleitung euch schon, wenn ihr ähnliche Funktionen benötigt. In den nächsten Tagen ergänze ich dann gerne die vollständige "Doku". Eventuell hat aber jemand noch bessere Ideen.
Übrigens hätte ich da auch noch einen kleinen Wunsch, sofern umsetzbar. Interessant wäre für mich noch ein Dropdown Widget, bei dem ich die Werte aus der Info eines Devices eintragen kann und bei Auswahl eines Wertes eine Aktion ausführen kann. In meinem bisherigen Dashboard habe ich auf diese Weise die Favoriten und Playlists meiner Sonos Geräte ermittelt und als Auswahl zum direkten Abspielen zur Verfügung gestellt.
Zitat von: jual am 06 April 2015, 18:56:00
Wäre es zum Beispiel möglich, die Formatierung von Icons mittels der vordefinierten Klassen (z.B. "fa-rotate-90") zu nutzen. Idealerweise sogar in Abhängigkeit von den Werten. Also so etwas wie data-css oder data-css-array. Ein Hinweis auch noch zur Doku auf der Projektseite. Hier ist bei "label" tatsächlich auch "Icon" als Einstellung angegeben. Ähnlich, wie bei einem vorherigen Beitra hier, habe ich eine Weile damit gekämpft, in der Hoffnung über das Icon den Text legen zu können ;).
Ansonsten erstmal VIELEN DANK!!!!!
Hallo alle,
das funktioniert schon, zumindest fa-rotate-90 oder fa-spin. In der fhem-tablet-ui.css habe ich auch noch fa-blink und blink ergänzt.
Damit kann kann man Symbole zum Beispiel rot blinken lassen beim Wert 'Alarm' und gelb bei 'Warnung' und grün drehen lassen bei 'Running'
Tipp: blinkende Symbole in Abhängigkeit zum Status
<div data-type="symbol" data-device="dummy1"
data-icons='["fa-exclamation-triangle fa-blink","fa-exclamation-circle","fa-cog fa-spin"]'
data-on-colors='["Crimson","GoldenRod","SeaGreen"]'
data-get-on='["Wert1","Wert2","Wert3"]' >
</div>
Hallo,
nachdem ich nun jeden Beitrag gelesen habe, bin ich mittlerweile verzweifelt.
Es geht um das widget-weather.
Ich nutze hier Yahoo Deutsch. Es funktioniert soweit so gut und auch die Icons werden dargestellt. Nur wenn Umlaute in dem Rückgabwert von Yahoo vorhanden sind, dann wird kein Icon (meteocons) dargestellt.
Beispiel: "überwiegend wolkig"
Werte wie "klar" oder "sonnig" werden dagegen einwandfrei dargestellt.
Ich habe auch schon im widget-weather.js mal "überwiegend wolkig" eingetragen anstatt der Sonderzeichen.
Das hat aber auch nichts gebracht.
Hier mal mein Codesnipsel:
<div data-type="weather"
data-device="Wetter"
data-get="condition"
style="font-size:250%"
class="cell big"></div>
<div data-type="label"
data-device="Wetter"
data-get="condition"></div>
Falls jemand hier eine Lösung weiss, wäre ich dafür recht dankbar.
Zitat von: ronmue am 07 April 2015, 23:16:54
Nur wenn Umlaute in dem Rückgabwert von Yahoo vorhanden sind, dann wird kein Icon (meteocons) dargestellt.
Probier bitte mal die Version aus https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_weather.js und gib mir eine Rückmeldung ob's bei Umlaut-Wetter damit funktioniert.
@nesges
Super, hat einwandfrei funktioniert.
Danke für die schnelle Hilfe! :) :) :) :)
Hey Nesges ! Warum wird mir die Windrose 2x angezeigt obwohl ich diese nur 1x definiert habe :-X
Zitat<td><div data-type="wind_direction"
data-device="MeinWetter"
data-get="wind_condition"
data-part="2"
data-angleoffset="1"
data-size="75"
data-tickstep="45"></div>
</td>
hat sich erledigt! Fehler gefunden.
Zitat von: nesges am 01 April 2015, 18:42:21
Update zu "weather": Kann jetzt alternatives Imageset benutzen, Screenshot in http://forum.fhem.de/index.php/topic,34233.msg280440.html#msg280440
Sobald ich das imageset definiere wird das leider nix.
oder geb ich es an der falschen Stelle ein? Danke für Tipps.
<div data-type="weather" data-device="OnlineWetter" data-get="condition" data-imageset="kleinklima"></div>
MfG
Andy
Zitat von: DJ_SAMMY190 am 08 April 2015, 18:35:52
Sobald ich das imageset definiere wird das leider nix.
Das ist ein bisschen wenig Info um zu helfen :) Ohne imageset geht's, mit aber nicht? "geht nicht" heisst, es wird nichts mehr angezeigt? Oder ein Fehler? Was steht in der Javascript-Console? Und das wichtigste: Hast du die aktuellste Version?
Jo xD mein Fail^^.
Also ohne bekomm ich die Standardicons (01) . Setze ich den Imageset wird nichts angezeigt und zwar für alle folgenden Bilder schon (02). Imageset nur bei Freitag gesetzt. Samstag wieder Standard.
Hoffe das hilft dir ?^^
Ps alles aktuell ;)
meine Wetteransicht ist auch bald fertig, allerdings will ich nun, dass die Temperatur abhängig von der Gradzahl eine andere Farbe hat. Die Umsetzung ist nicht mein Problem, aber ich finde bei Mr.Guugle keine Definition mit den Farbwerten.
Jem .eine Idee wo ich das herbekommen könnte??
Vielleicht hilft dir das ;) http://www.farb-tabelle.de/de/farbtabelle.htm
Oder die Datei im Photoshop öffnen und Farbcodes auslesen.
wäre ein Ansatz. ich schau mal. Danke
Zitat von: DJ_SAMMY190 am 08 April 2015, 19:11:49
Also ohne bekomm ich die Standardicons (01) . Setze ich den Imageset wird nichts angezeigt und zwar für alle folgenden Bilder schon (02). Imageset nur bei Freitag gesetzt. Samstag wieder Standard.
Sieht nach Javascript-Fehler aus. Was steht in der JS-Console?
OH MANN!! Photoshop, lol ..... ich habe gerade den "Digital Color Meter" auf meinem Mac entdeckt. Der zeigt sofort alle Werte.
was ich so Auslese. wenn nicht muss ich nochmal suchen^^
"Get current values of readings" fhem-tablet-ui.js:137:0
"start longpoll" fhem-tablet-ui.js:207:0
TypeError: $(...).attr(...) is undefined jquery.min.js line 2 > eval:310:35
"start longpoll"
Was ich auch eben bemerkt hab ist der Code drin: data-imageset="kleinklima" dann zeigt der RGB Tacho darüber auch keinen Wert mehr an o0
Danke, hab den Fehler damit gefunden. Neue Version unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_weather.js oder widget_weather.js Zeile 310 ersetzen durch:
var fhem = $("meta[name='fhemweb_url']").attr("content") || "../fhem/";
fhem = fhem.replace(/\/$/, '');
Dass die anderen Widgets auch davon betroffen sind, liegt an Javascript: Sobald ein Fehler auftritt, wird kein weiterer JS Code verarbeitet.
Responsive Webdesign?
@setstate:
Ich weiß, "gib jemanden den kleinen Finger und er nimmt die ganze Hand",
daher will ich auch ganz vorsichtig fragen:
Ist es möglich Gridster bzw. das UI so zu programmieren, dass sich die "Kacheln" automatisch dem "Endgerät" anpassen.
Wenn ich mein UI auf dem PC anschaue (1920x1080px) sieht es im Browser recht links oben aus (2/3 der Beildschirms).
Aud dem IPad ist es super ausgefüllt. Auf dem SamsungTV-Browser ist das UI auch vollformartig dargestellt.
Auf dem Android-Tablet und Handy jedoch nicht.
Gibt es eine Möglichkeit, dass das UI sich dem Bildschirm automatisch anpasst?
Gruß
Markus
Zitat von: nesges am 08 April 2015, 20:08:48
Danke, hab den Fehler damit gefunden. Neue Version unter https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_weather.js oder widget_weather.js Zeile 310 ersetzen durch:
var fhem = $("meta[name='fhemweb_url']").attr("content") || "../fhem/";
fhem = fhem.replace(/\/$/, '');
Dass die anderen Widgets auch davon betroffen sind, liegt an Javascript: Sobald ein Fehler auftritt, wird kein weiterer JS Code verarbeitet.
Funzt einwandfrei ;)
Danke
So nur noch die Farben für die Temperatur integrieren und fürs erste fertig.
(//)
Zitat von: bjoernbo am 08 April 2015, 20:35:26
So nur noch die Farben für die Temperatur integrieren und fürs erste fertig.
(//)
Wow. Top. Gefällt sehr gut.
anbei:
1. noch nicht optimiert !
2. ... ich arbeite mit zwei Unterschiedlichen "Wetter-devices" !
Zitat<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<div class="container weather">
<div class="container weather">
<header>
Wetter in
<div data-type="label"
data-device="MeinWetter"
data-get="city"
style="display:inline"></div>
</header>
<table border="0px" width="100%">
<tr>
<td class="A2"><div data-type="label"
data-device="MyWeather"
data-get="fc0_date"></div></td>
<td class="B2"><center><div data-type="label" class="inline small"><big>↑</big><small> Sonne:</small><br></div>
<div data-type="label"
data-device="Sonnenaufgang"
data-get="state"></div></center></td>
<td class="C2"><center><div data-type="label" class="inline small"><big>↓</big><small> Sonne:</small><br></div>
<div data-type="label"
data-device="Sonnenuntergang"
data-get="state"></div></center></td>
<td class="D2"><center><div data-type="label" class="inline small"><small>Sichtweite:</small><br></div>
<div data-type="label"
data-device="MyWeather"
data-get="visibility"
data-unit=" km"></center></td>
</tr>
<tr>
<td class="tg-031e"><div data-type="label"><small>Temp<br></small></div>
<center><div data-type="label"
data-device="MyWeather"
data-get="temperature"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit="°C"
class="inline cell big"></div></center></td>
<td class="tg-031e" colspan="2" rowspan="2">
<center> <div data-type="weather"
data-device="MeinWetter"
data-get="condition"
style="font-size:250%">
</div>
<div data-type="label"
data-device="MeinWetter"
data-get="fc1_condition">
</div>
</center>
</td>
<!-- <td class="tg-031e">C3</td>-->
<td><center><div data-type="wind_direction"
data-device="MyWeather"
data-get="wind_condition"
data-part="2"
data-size="75"
data-tickstep="45"></div>
</center></td>
</tr>
<tr>
<td class="tg-031e"><div data-type="label"><small>Feucht<br></small></div>
<center><div data-type="label"
data-device="MyWeather"
data-get="humidity"
data-limits="[0,40,60]"
data-colors='["#9999ff","#aa6900","#ff6900"]'
data-unit=" %"
class="inline cell big">
</div></center></td>
<!-- <td class="tg-031e">B4</td>
<td class="tg-031e">C4</td>-->
<td class="tg-031e">
<center><div data-type="label"><small>Wind</small><br></div>
<div data-type="label"
data-device="MyWeather"
data-get="wind"
data-unit=" km/h"
data-limits="[0, 19, 28, 38, 49, 74, 102, 117]"
data-colors='["#ffffff","#dddddd","#aa6900","#aa6900","#ff9999","#ff6666","#ff3333","#ff0000"]'
style="display:inline"
class="inline">
</div>
</center>
</td>
</tr>
<tr>
<td class="A5"><center><div data-type="label" class="inline"><small>UV-Index<br></small></div>
<div data-type="label"
data-device="MyWeather"
data-get="fc0_uv"
data-limits="[0,2,10]"
data-colors='["grey","orange","red"]'
style="display:inline">
</div>
</center>
</td>
<td class="B5"><center><div data-type="label" class="inline"><small>Regenrisiko<br></small></div>
<div data-type="label"
data-device="MyWeather"
data-get="fc0_chOfRainDay"
data-unit=" %"
data-limits="[0, 10, 20, 30, 40, 50, 60, 70, 80, 90, 100]" <!-- optimieren TEST-->
data-colors='["#32AD4F","#3AAB2C","green","green","green","#F6AA1D","green","green","green","green","#F6451D"]' <!--TEST -->
style="display:inline">
</div></center></td>
<td class="C5"><center><div data-type="label" class="inline"><small>Taupunkt<br></small></div>
<div data-type="label"
data-device="MyWeather"
data-get="dewPoint"
data-unit=" °C"></div>
</center></td>
<td class="D5"><center><div data-type="label" class="inline"><small>Luftdruck<br></small></div>
<div data-type="label"
data-device="MyWeather"
data-get="pressure"
data-unit=" hPa"
data-limits="[0,950,1000]"
data-colors='["#ff9999","#aa6900","#9999ff"]'></div>
<div data-type="label"
data-device="MeinWetter"
data-get="pressure_trend_sym"
class="inline"></div></center>
</td>
</tr>
</table>
</li>
</li>
<li data-row="1" data-col="6" data-sizex="3" data-sizey="3">
<div class="container">
<header>Regenradar</header>
<br><img src="http://www.wetteronline.de/?pid=p_radar_map&ireq=true&src=radar/vermarktung/p_radar_map_forecast/forecastLoop/DL/latestForecastLoop.gif" width="300" height="350">
</img src>
</div>
</li>
<li data-row="5" data-col="2" data-sizex="1" data-sizey="1">
<header>
Wetter für
<div data-type="label"
data-device="MeinWetter"
data-get="fc2_day_of_week"
style="display:inline">
</div>
</header>
<center>
<div data-type="weather"
data-device="MeinWetter"
data-get="fc2_condition"
style="font-size:250%">
</div>
<br>
<div data-type="label"
data-device="WEATHER"
data-get="fc2_condition"
class="inline">
</div><big>↓</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc2_low_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div><big>↑</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc2_high_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div>
</center>
</li>
<li data-row="5" data-col="3" data-sizex="1" data-sizey="1">
<header>
Wetter für
<div data-type="label"
data-device="MeinWetter"
data-get="fc3_day_of_week"
style="display:inline">
</div>
</header>
<center>
<div data-type="weather"
data-device="MeinWetter"
data-get="fc3_condition"
style="font-size:250%">
</div>
<br>
<div data-type="label"
data-device="WEATHER"
data-get="fc3_condition"
class="inline">
</div><big>↓</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc3_low_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div><big>↑</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc3_high_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div>
</center>
</li>
<li data-row="5" data-col="4" data-sizex="1" data-sizey="1">
<header>
Wetter für
<div data-type="label"
data-device="MeinWetter"
data-get="fc4_day_of_week"
style="display:inline">
</div>
</header>
<center>
<div data-type="weather"
data-device="MeinWetter"
data-get="fc4_condition"
style="font-size:250%">
</div>
<br>
<div data-type="label"
data-device="WEATHER"
data-get="fc4_condition"
class="inline">
</div><big>↓</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc4_low_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div><big>↑</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc4_high_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div>
</center>
</li>
<li data-row="5" data-col="5" data-sizex="1" data-sizey="1">
<header>
Wetter für
<div data-type="label"
data-device="MeinWetter"
data-get="fc5_day_of_week"
style="display:inline">
</div>
</header>
<center>
<div data-type="weather"
data-device="MeinWetter"
data-get="fc5_condition"
style="font-size:250%">
</div>
<br>
<div data-type="label"
data-device="WEATHER"
data-get="fc5_condition"
class="inline">
</div><big>↓</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc5_low_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div><big>↑</big>
<div data-type="label"
data-device="MeinWetter"
data-get="fc5_high_c"
data-limits="[-50,0,10,25,30,40]"
data-colors='["#9999ff","#ffbdff","#aa6900","#ff6900","#ff3333","#ff0000"]'
data-unit=" °C"
class="inline">
</div>
</center>
</li>
<li data-row="1" data-col="4" data-sizex="1" data-sizey="2">
<header>INNEN</header>
<div data-type="label"><br><small>Feucht:<br></small></div>
<div type="label" device="Wohnzimmer.Wandthermostat" data-get="humidity" data-fix="0" data-unit="%" class="cell big"></div>
<div data-type="label"><br><small>Lärm:<br></small></div>
<div type="label" device="netatmo_XXXXXXXXX" data-get="noise" data-fix="0" data-unit=" dB" class="cell big"></div>
<div data-type="label"><br><small>Temp:<br></small></div>
<div data-type="label" data-device="Wohnzimmer.Wandthermostat" data-get="measured-temp" data-unit=" °C" class="cell big"></div>
</li>
</ul>
cool ;) aber ich seh grad im Bild Sonnenaufgang um 30 Uhr o0^^ hihi^^ Das Regenradar gefällt mir echt gut^^ Gute einfälle ;)
Herzlichen Dank. Frauchen gefällt das auch^^ So ich geh mal arbeiten -.-^^
Zitat von: Markus Hermann am 08 April 2015, 20:14:03
Ist es möglich Gridster bzw. das UI so zu programmieren, dass sich die "Kacheln" automatisch dem "Endgerät" anpassen.
Man kann den Viewport pro Gerät anpassen, allerdings wüsste ich nicht, wie das allgemeingültig geht. Ich hab's bei mir PHP-seitig mit einer Weiche auf REMOTE_ADDR gelöst. Evtl. kann ähnliches auch per JS umgesetzt werden. Den PHP-Code als Anregung:
<?
if ($_SERVER['REMOTE_ADDR'] == '192.168.178.88') {
// monitroid
?><meta name="viewport" content="width=device-width, initial-scale=1.15, maximum-scale=1.15 user-scalable=no"><?
} else if ($_SERVER['REMOTE_ADDR'] == '192.168.178.49' || $_SERVER['REMOTE_ADDR'] == '2003:7a:cf25:f700:4b3:2521:7e23:700a' ) {
// iPad
?><meta name="viewport" content="width=device-width, initial-scale=1.1, maximum-scale=1.1 user-scalable=no"><?
} else if ($_SERVER['REMOTE_ADDR'] == '192.168.178.51') {
// handy
?><meta name="viewport" content="width=device-width, initial-scale=0.6, maximum-scale=1.1 user-scalable=yes"><?
} else {
?><meta name="viewport" content="width=device-width, initial-scale=0.6, maximum-scale=1.1 user-scalable=yes"><?
}
?>
Wenn jemand Inspiration sucht: Meine komplette Installation als Github-Repository. Link & Diskussion bitte im Nachbarthread http://forum.fhem.de/index.php/topic,36063.0.html
Hallo.
Nachdem mich Dank des Klasse Tablet UI wieder der fhem Eifer gepackt hat hätte ich auch ne Frage. Ich habs mit viel copy and paste und abkucken / lesen geschafft, ein für mich brauchbares UI zu erstellen. Ich scheitere momentan daran meine Philips hue vernünftig einzubinden. Habs über den Demo Dimmer zwar geschafft, aber ich bekomme keine Rückantwort und auch die Helligkeit stimmt nicht.
Kann mir evtl. jemand zeigen wie er das gelöst hat ? Bin leider eher probierender Anwender als grosser Programmierer.
Danke,
Hermann
Neues Feature der Thermostat und Volume Widgets:
Auf Touch-Devices bewegt sich das Desired-Value Label während des Änderns nach Außen, weg vom Finger, sodass man auch was ablesen kann. Bei Mouse-Devices passiert das nicht.
Update des FHEM Tablet UI per:
Zitatupdate all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Zitat von: setstate am 08 April 2015, 22:25:29
Auf Touch-Devices bewegt sich das Desired-Value Label während des Änderns nach Außen, weg vom Finger, sodass man auch was ablesen kann.
Sehr chick! Nur ne Kleinigkeit: In nem 1 Feld breiten Gridster-Widget wandert die Anzeige des Thermostats ausserhalb des Rahmens und wird abgeschnitten. Wäre es möglich die Richtung, in die die Anzeige verschoben wird, einstellbar zu machen?
ein paar centies habe ich es noch nach rechts geschoben, vllt. reicht das schon ???
passt, danke!
ZitatUpdate des FHEM Tablet UI per.....
man sollte evtl die index.html aus dem update nehmen!
Zitat2015-04-09 06:33:07 Global global UPD www/tablet/index.html
bei mir war's egal da ich eine my_index.html benutzte. andere könnten sich hier ärgen ;)
Zitat von: chris1284 am 09 April 2015, 06:34:29
man sollte evtl die index.html aus dem update nehmen!
bei mir war's egal da ich eine my_index.html benutzte. andere könnten sich hier ärgen ;)
Guter Hinweis, keine Angst, die index.html sollte nicht überschrieben werden, weil ich das Datum fix auf "2015-02-22_23:37:00" stehen lasse, auch wenn es darin neue Beispiele gibt. Damit wird die Datei nur bei Nichtvorhandensein kopiert.
Aber wenn ihr wichtige Änderungen in anderen Dateien habt (z.B. im CSS File), solltet ihr ein 'attr global exclude_from_update myFile.xy' definieren. Besser ist aber, uns die Änderung mitzuteilen, damit sie in die Standard-Version einfließen kann.
@neges:
Danke für den Tipp mit dem Viewport-Einstellungen, ich würde das dann mit unterschiedlichen index.html für jedes Endgerät probieren, aber egal welche Werte ich bei:
initial-scale=1.0, maximum-scale=1.0, user-scalable=yes
oder
initial-scale=1.15, maximum-scale=1.15, user-scalable=yes
oder
initial-scale=0.9, maximum-scale=0.9, user-scalable=yes
einstelle, im Browser ändert sich gar nichts.
gibt man
Zitatupdate all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
in FHEM ein?
Zitat von: Markus Hermann am 09 April 2015, 09:31:47
Danke für den Tipp mit dem Viewport-Einstellungen [...] im Browser ändert sich gar nichts.
Stimmt, der Desktop-Browser wertet den Viewport-Tag nicht aus. In vielen Browsern kann man aber per CSS zoomen. In der Desktop-Version kannst du folgendes einfügen:
<style type="text/css">
div.gridster {
zoom: 1.5;
-moz-transform: scale(1.5);
-moz-transform-origin: 0 0;
}
</style>
Toll, dass die Update-Funktion einbaut ist. Bei den vielen Neuerungen lohnt sich das.
Aber bei mir funktioniert es nicht, ich bekommen folgende Meldung:
2014-01-17 07:01:48 Global global open ./www/tablet/css/fhem-tablet-ui.css failed: Permission denied, trying to restore the previous version and aborting the update
Zitat von: bjoernbo am 09 April 2015, 10:00:32
gibt man in FHEM ein?
Ja, ist überall dort möglich, wo man Befehle an FHEM schicken kann: FHEMWEB im Eingabefenster, Telnet, URL mit ?cmd=xyz.
Man kann auch im FHEM Tablet UI einen Button einbauen, der das Command Richtung FHEM schickt ;-)
<div onclick="setFhemStatus('update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt')">Update All!</div>http://www.fhemwiki.de/wiki/Update (http://www.fhemwiki.de/wiki/Update)
Zitat von: mw_fhem am 09 April 2015, 10:14:41
Toll, dass die Update-Funktion einbaut ist. Bei den vielen Neuerungen lohnt sich das.
Aber bei mir funktioniert es nicht, ich bekommen folgende Meldung:
2014-01-17 07:01:48 Global global open ./www/tablet/css/fhem-tablet-ui.css failed: Permission denied, trying to restore the previous version and aborting the update
Dann hast du die Folder /www/tablet und /www/tablet/css irgendwann mal mit einem anderen User angelegt, als der unter dem FHEM läuft. Lösche (Umbenenne) einfach /www/tablet komplett und mach dann das Update.
Vielen Dank! Jetzt funzt es :D
Werden die Widgets von nesges beibehalten?
Hallo,
Erstmal: die UI ist ja einfach mal top.
Wie editiert ihr denn die index.html? Die hat ja den User fhem, verbinde ich mich mit SCP, muss ich mich ja mit dem User pi anmelden. Und dann kann ich die Datei nicht speichern.
LG Jo
@nesges:
Danke, damit klappt es!
Andere Frage:
Wie fragst Du in FHEM die Fritzbox-Anrufer ab, die Du in der systemcall.php stehen:
<header>ANRUFE</header>
<table class="calls">
<tr>
<td><div data-type="label" data-device="FritzBox" data-get="B0"></div></td>
<td>
<div data-type="label" data-device="FritzBox" data-get="D0" style="font-size:x-large;color:#aa6900;"></div>
<div data-type="label" data-device="FritzBox" data-get="C0"></div>
</td>
<td class="r"><div data-type="label" data-device="FritzBox" data-get="E0"></div></td>
<td class="r"><div data-type="label" data-device="FritzBox" data-get="A0"></div></td>
</tr>
Also ich meine mit welchem FHEM Device oder Helper Module?
Fritzbox oder FB_CALLMONITOR? Läuft FHEM bei Dir auf der FB direkt?
Ich habe eine Kabel-Deutschland-Box und die erlaubt kein Telnet :-(
@Markus Hermann: Ich war so frei in http://forum.fhem.de/index.php/topic,36063.msg284009.html#msg284009 zu antworten.
Ich werde Fragen nach meiner Installation grundsätzlich dort beantworten, damit der Thread hier sauber bleibt.
??? Wenn ich den "UPDATE-BEFEHL" absetze erhalte ich dann automatisch die neue Struktur? Muss ich mir sorgen um meine angelegten .html Seiten machen, sprich bleiben diese erhalten?
update zu meiner Wetteranzeige. Dank jual nun mit Pollenfluganzeige sowie angepassten Farben in Abhängigkeit zur Temperatur.
Zitatdata-limits="[-20,-15,-10,-5,0,5,10,15,20,25,30,35]"
data-colors='["#483D8B","#1874CD","#9AC0CD","#CAE1FF","#F5FFFA","#98FB98","#9ACD32","#FFA500","#FF4500","#FF3030","#EE2C2C","#8B1A1A"]'
ZitatDarkSlateBlue
DodgerBlue3
LightBlue3
LightSteelBlue1
MintCream
PaleGreen
YellowGreen
Orange
OrangeRed1
firebrick1
firebrick2
firebrick4
So viel neues schon wieder. Bin ja nicht mal wach :)
Gesendet von meinem Z30 mit Tapatalk
Zitat von: bjoernbo am 09 April 2015, 15:46:42
update zu meiner Wetteranzeige. Dank jual nun mit Pollenfluganzeige sowie angepassten Farben in Abhängigkeit zur Temperatur.
Schaut wirklich super aus. Werde es mehr oder weniger Kopieren 8).
Wo sind den bitte die Pollenflugdaten her?
Was mir noch auffällt ist der Wetter Text ist "sonnig" das Symbol ist eine Wolke?
Danke für die tolle vort Arbeit!
Gruß,
Stefan
;D jetzt steht bei mir "heiter".
Die Pollenflugdaten habe ich durch eine Inspiration von Jual. Ich habe das dann auf meine Bedürfnisse angepasst.
FHEM:
Zitatdefine Pollenflug HTTPMOD http://www.donnerwetter.de/pollenflug/region.hts?plz=44791&PTag=0 3600
attr Pollenflug userattr reading01Name reading01Regex reading02Name reading02Regex reading03Name reading03Regex reading04Name reading04Regex reading05Name reading05Regex timeout
attr Pollenflug reading01Name Birke
attr Pollenflug reading01Regex (?s)Birke.*?poll([\d])
attr Pollenflug reading02Name Graeser
attr Pollenflug reading02Regex (?s)Gr.ser.*?poll([\d])
attr Pollenflug reading03Name Pappel
attr Pollenflug reading03Regex (?s)Pappel.*?poll([\d])
attr Pollenflug reading04Name Weizen
attr Pollenflug reading04Regex (?s)Weizen.*?poll([\d])
attr Pollenflug reading05Name Esche
attr Pollenflug reading05Regex (?s)Esche.*?poll([\d])
attr Pollenflug room Wettervorhersage
attr Pollenflug timeout 5
define rgPollenflug readingsGroup Pollenflug:.*
attr rgPollenflug group Pollen
attr rgPollenflug mapping $READING
attr rgPollenflug notime 1
attr rgPollenflug room Wettervorhersage
attr rgPollenflug valueIcon {'Pappel.0' => 'poll0','Pappel.1' => 'poll1','Pappel.2' => 'poll2','Pappel.3' => 'poll3','Pappel.0' => 'poll0','Weizen.1' => 'poll1','Weizen.2' => 'poll2','Weizen.3' => 'poll3','Graeser.0' => 'poll0','Graeser.1' => 'poll1','Graeser.2' => 'poll2','Graeser.3' => 'poll3','Esche.0' => 'poll0','Esche.1' => 'poll1','Esche.2' => 'poll2','Esche.3' => 'poll3','Birke.0' => 'poll0','Birke.1' => 'poll1','Birke.2' => 'poll2','Birke.3' => 'poll3' }
und dann die Einbindung ins UI
Zitat<header>Pollenflug</header>
<div class="cell inline">Birke :</div><div data-type="symbol" data-device="Pollenflug"
data-get="Birke"
data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["1","2","3"]'
data-on-colors='["yellowgreen","yellow","red"]'
style="font-size:2em"
class="inline"></div>
<div class="cell inline">Esche :</div><div data-type="symbol" data-device="Pollenflug"
data-get="Esche"
data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["1","2","3"]'
data-on-colors='["yellowgreen","yellow","red"]'
style="font-size:2em"
class="inline"></div>
<div class="cell inline">Gräser :</div><div data-type="symbol" data-device="Pollenflug"
data-get="Graeser"
data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["1","2","3"]'
data-on-colors='["yellowgreen","yellow","red"]'
style="font-size:2em"
class="inline"></div>
<div class="cell inline">Pappel :</div><div data-type="symbol" data-device="Pollenflug"
data-get="Pappel"
data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["1","2","3"]'
data-on-colors='["yellowgreen","yellow","red"]'
style="font-size:2em"
class="inline"></div>
<div class="cell inline">Weizen :</div><div data-type="symbol" data-device="Pollenflug"
data-get="Weizen"
data-icons='["fa-forumbee","fa-forumbee","fa-forumbee"]'
data-get-on='["1","2","3"]'
data-on-colors='["yellowgreen","yellow","red"]'
style="font-size:2em"
class="inline"></div>
</li>
Hab mir das Framework gerade installiert. Schaut seeehr gut aus! Danke dafür!
Eine kurze Frage ist mir jedoch gerade beim Schlendern durch den Code aufgefallen (entschuldigt, wenn das vielleicht schon auf irgendeiner der 50 Seiten Thread beantwortet wurde. Die Suche weiß dazu nicht viel...)
Warum existiert das Parameter "readonly" nur für den Thermostat? Gibt es dafür einen bestimmten Grund?
Zitat von: tomster am 09 April 2015, 17:43:57
Warum existiert das Parameter "readonly" nur für den Thermostat? Gibt es dafür einen bestimmten Grund?
Am volume-Widget gibt's die Klasse readonly genauso, dort hat sie's nur bisher noch nicht in die Doku geschafft :) Dass es ihn sonst nirgends gibt, liegt hauptsächlich daran, dass sie bisher niemand gebraucht hat - wo vermisst du sie denn?
wie bekomm ich den im weatherwidget die normalen icons von yahoo hin (die bunten)?
Zitatdata-imageset="kleinklima"
bringt nicht.. :(
im widget scheint mir auch das mapping zu den icons falsch.
'mostly cloudy' und 'partly cloudy' gibts es im yahoo wetter nicht! die readings haben keine leerzeichen sondern sind in den readings 'mostly
_cloudy' und 'partly
_cloudy'
auch verstehe ich nicht wiso man in den beispielen auf condition geht wenn man das icon will? dafür gibts im yohoo device extra das reading "icon" (bzw fc[1-5]_icon) welches den bildnamen bereits mitbringt. wäre es da nicht einfacher statt dem mapping direkt den pfad aus dem icon-reading zu bauen?
Oh, bis zum Volume-Widget hab ich's mangels ansteuerbarer Gerätschaft noch gar nicht geschafft....
Ich hätt's ehrlich gesagt gern bei einem ganz normalen Switch angewendet. Der soll nur den Status ausgeben und sich nicht schalten lassen...
Noch 'ne Frage:
Gibt's eigentlich ein "Mehr-State-Toggle" auch? Also click=state1, nochmal click=state2, nochmal click=off
Zitat von: chris1284 am 09 April 2015, 18:02:53
wie bekomm ich den im weatherwidget die normalen icons von yahoo hin (die bunten)? bringt nicht.. :(
Bitte ab http://forum.fhem.de/index.php/topic,34233.msg283737.html#msg283737 lesen.
Zitat'mostly cloudy' und 'partly cloudy' gibts es im yahoo wetter nicht! die readings haben keine leerzeichen sondern sind in den readings 'mostly_cloudy' und 'partly_cloudy'
In meiner 59_Weather.pm ($Id: 59_Weather.pm 6705 2014-10-07 17:41:42Z borisneubert $) sind die Readings ab Zeile 41 genauso definiert. Hast du eine andere Version?
Zitatauch verstehe ich nicht wiso man in den beispielen auf condition geht wenn man das icon will? dafür gibts im yohoo device extra das reading "icon" (bzw fc[1-5]_icon) welches den bildnamen bereits mitbringt. wäre es da nicht einfacher statt dem mapping direkt den pfad aus dem icon-reading zu bauen?
Wenn das Widget ausschliesslich Yahoo! mit kleinklima abbilden würde, wäre das einfacher. Aber das Widget hat ursprünglich nur PROPLANTA mit meteocons umgesetzt. D.h. in irgend eine Richtung muss ich ohnehin mappen, da fand ich die mit den sprechenden Namen auch für den User einfacher.
Zitat von: tomster am 09 April 2015, 18:05:05
Ich hätt's ehrlich gesagt gern bei einem ganz normalen Switch angewendet. Der soll nur den Status ausgeben und sich nicht schalten lassen...
Dann willst du nicht "switch" sondern "symbol" verwenden :-)
ZitatGibt's eigentlich ein "Mehr-State-Toggle" auch? Also click=state1, nochmal click=state2, nochmal click=off
Im UI mW nicht. Wenn's nicht "sichtbar" sein muss, hilft http://fhem.de/commandref.html#sequence evtl. weiter.
Zitat von: tomster am 09 April 2015, 18:05:05
Oh, bis zum Volume-Widget hab ich's mangels ansteuerbarer Gerätschaft noch gar nicht geschafft....
Ich hätt's ehrlich gesagt gern bei einem ganz normalen Switch angewendet. Der soll nur den Status ausgeben und sich nicht schalten lassen...
Noch 'ne Frage:
Gibt's eigentlich ein "Mehr-State-Toggle" auch? Also click=state1, nochmal click=state2, nochmal click=off
Dann nimm ein Symbol Widget, das benutzt das gleiche Control nur readonly. Eventuell musst du das Background-Icon Attribut benutzen, um einen Kreis um das Symbol zu zaubern. Das Symbol Widget hat default nur das Vordergrund-Icon.
Zitat von: nesges am 09 April 2015, 18:17:00
Bitte ab http://forum.fhem.de/index.php/topic,34233.msg283737.html#msg283737 lesen.
find ich nichts außer das es ein damaliger bug im script war ??? habe auch die aktuelle widget_weather.js von dir genommen, keine fehler in de js konsole...
Zitat von: nesges am 09 April 2015, 18:17:00
In meiner 59_Weather.pm ($Id: 59_Weather.pm 6705 2014-10-07 17:41:42Z borisneubert $) sind die Readings ab Zeile 41 genauso definiert. Hast du eine andere Version?
# $Id: 59_Weather.pm 6705 2014-10-07 17:41:42Z borisneubert $
anbei readings im screenshot.
EDIT: es ist ein fhem zu viel wenn der pfad generiert wird. das icon weist auf http://srv01.fritz.box:8083/
fhem/fhem/images/default/weather/partly_cloudy.png
richtig wäre http://srv01.fritz.box:8083/fhem/images/default/weather/partly_cloudy.png
Zeile 310 geändert var fhem = $("meta[name='fhemweb_url']").attr("content") || "../";
Zitat von: chris1284 am 09 April 2015, 18:31:34
EDIT: es ist ein fhem zu viel wenn der pfad generiert wird. das icon weist auf http://srv01.fritz.box:8083/fhem/fhem/images/default/weather/partly_cloudy.png
richtig wäre http://srv01.fritz.box:8083/fhem/images/default/weather/partly_cloudy.png
Frage mich wo das her kommt. Zumal es dann auch überall in fhem-tablet-ui.js krachen müsste, da der fhem-Pfad dort genauso ermittelt wird.
Screenshot mit Readings: Du vergleichst grade die Readings "icons" und "condition" und hast festgestellt, dass sie nicht den gleichen Inhalt haben.
ich habs im widget geändert und nun funktioniert's einwandfrei mit den original-symbolen vom modul...
da die icon-readings immer gleich und immer english sind sollte man die ggf bevorzugen da man sich so auch nicht um yahoo de/en/nl kümmern muss
Zitat von: chris1284 am 09 April 2015, 19:17:21ich habs im widget geändert und nun funktioniert's einwandfrei mit den original-symbolen vom modul...
Du hast aber keine Standardinstallation, oder? Irgendwas passt da nicht zusammen. Ich hab jetzt mal eine neue Standardinstallation angelegt und ich schaff's nicht den Fehler nachzustellen.
Zitatda die icon-readings immer gleich und immer english sind sollte man die ggf bevorzugen da man sich so auch nicht um yahoo de/en/nl kümmern muss
Die einzige Begründung die mir dafür einfallen würde, wäre Bequemlichkeit des Entwicklers. Von daher: Nö :) Wir können das aber gerne PM weiter diskutieren.
nö ;) geht ja, wäre halt evtl nur einfacher für den entwickler...
und nein es ist alles standard!
aber eine frag zu deinem button wigdet wäre da noch bzw allegmein zu data-icon. die fa-icons gehen ja simpel einzubinden. toll wäre die fhem-svg's inkl. farbangabe mit einzubinden. zb www/images/openautomation/scene_livingroom.svg in rot.
Wie versprochen gibt es hier nun meine aktuelle Umsetzung eines "Weckers". In ein paar Beiträgen vorher hatte ich ja grundsätzlich das Konzept beschrieben. Nun gibt es den kompletten Code.
Ich nutze den Wecker für das Stellen eines WeekdayTimer Moduls mit dem ich dann weitere Aktionen zu den definierten Weckzeiten starte.
Der WeekdayTimer sieht bei mir so aus:
define Aufstehen WeekdayTimer gr_Bewohner 1|08:50|awoken 2|06:45|awoken 3|07:35|awoken 4|07:20|awoken 5|06:45|awoken 6|08:00|awoken 7|08:50|awoken (ReadingsVal('Urlaub_dummy','state','nein') ne 'ja')
Ich nutze hierbei u.a. das Residents Modul und einen Dummy für die Urlaubsschaltung, die ich hier nicht weiter ausführe. An Stelle von gr_Bewohner und "awoken" muss man seine persönlichen Devices bzw. Aktionen eintragen.
Für das Modifizieren des Weekday Timers habe ich nochmal ein Dummy angelegt, welches quasi den Profilinfos des Weekday Timer entspricht:
define Dummy Weckzeit
In diesem Dummy habe ich die Readings wzMontag bis wzSonntag angelegt (z.B. setreading Weckzeit wzMontag 09:00).
Basis für den Wecker, den ich im TabUI umgesetzt habe ist ein Dummy, mit dem ich die einzelnen Komponenten wie Tag, Stunde und Minute abbilde.
define duWeckerTabUI dummy
attr duWeckerTabUI setList stellen
Funktionen zum Ändern der Werte bzw. zum Stellen der Dummys habe ich in myutils ausgelagert:
sub WeckerStellen()
{
fhem("setreading Weckzeit wz".ReadingsVal("duWeckerTabUI","WochentagName","Montag")." ".ReadingsVal("duWeckerTabUI","Stunde","09").":".ReadingsVal("duWeckerTabUI","Minute","00"));
}
sub WeckerDummyAktualisieren($$)
{
my ($reading, $wert) = @_;
my @TagNamen = ("Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag","Sonntag");
#Wochentag ermitteln und im Dummy setzen
if($reading eq "Tag")
{
fhem("setreading duWeckerTabUI WochentagName $TagNamen[$wert-1]");
}
fhem("set duWeckerTabUI ".ReadingsVal("duWeckerTabUI","WochentagName","").":".ReadingsVal("duWeckerTabUI","Stunde","").":".ReadingsVal("duWeckerTabUI","Minute",""));
}
Mittels notify wird der WeekdayTimer modifiziert, wenn sich die Weckzeit von einem Tag ändert:
define Weckzeit_Aendern notify Weckzeit:.* {fhem("setreading Weckzeit ".ReadingsVal("Weckzeit","state","")); fhem("modify Aufstehen gr_Bewohner 1|".ReadingsVal("Weckzeit","wzMontag","09:00")."|awoken 2|".ReadingsVal("Weckzeit","wzDienstag","09:00")."|awoken 3|".ReadingsVal("Weckzeit","wzMittwoch","09:00")."|awoken 4|".ReadingsVal("Weckzeit","wzDonnerstag","09:00")."|awoken 5|".ReadingsVal("Weckzeit","wzFreitag","09:00")."|awoken 6|".ReadingsVal("Weckzeit","wzSamstag","09:00")."|awoken 7|".ReadingsVal("Weckzeit","wzSonntag","09:00")."|awoken (ReadingsVal('Urlaub_dummy','state','nein') ne 'ja')")}
Die TabUI Definition für den Wecker habe ich mittels Volume Widgets erstellt und sieht wie folgt aus:
<li data-row="1" data-col="2" data-sizex="5" data-sizey="5">
<div style="border-style:solid; margin:2px">
<header>Weckzeit stellen</header>
<div>
<div class="container inline" style="padding:1em">
<div data-type="volume" data-device="duWeckerTabUI" data-get="Tag" data-set="Tag" data-cmd="setreading" data-min="1" data-max="7"></div>
<div data-type="label" class="big">Wochentag</div>
</div>
<div class="container inline">
<div data-type="volume" data-device="duWeckerTabUI" data-get="Stunde" data-set="Stunde" data-cmd="setreading" data-min="0" data-max="24"></div>
<div data-type="label" class="big">Stunde</div>
</div>
<div class="container inline">
<div data-type="volume" data-device="duWeckerTabUI" data-get="Minute" data-set="Minute" data-cmd="setreading" data-min="0" data-max="60"></div>
<div data-type="label" class="big">Minute</div>
</div>
</div>
<div data-type="label">Wochentag:1=Mo | 2=Di | 3=Mi | 4=Do | 5=Fr | 6=Sa | 7=So</div>
<div data-type="push" data-device="duWeckerTabUI" data-cmd="set" data-set="stellen" class="cell"></div>
<div data-type="label" class="big">Stellen</div>
</div>
</li>
So, ich hoffe ihr kommt damit klar. Wahrscheinlich kann man noch einige Dinge vereinfachen, aber bei mir funktioniert das aktuell recht gut. Ich habe zwar noch versucht, die eingestellte Uhrzeit jedesmal im Wecker anzuzeigen, sobald man einen Wert verändert hat. Das hat aber bisher leider nicht funktioniert.
Zitat von: setstate am 09 April 2015, 18:24:07
Dann nimm ein Symbol Widget, das benutzt das gleiche Control nur readonly. Eventuell musst du das Background-Icon Attribut benutzen, um einen Kreis um das Symbol zu zaubern. Das Symbol Widget hat default nur das Vordergrund-Icon.
"symbol" funzt leider nicht. Das Icon ändert sich nicht mit dem Zustand. Es bleibt immer "aus".
Zudem ist die "Farb-Logik" beim Type "symbol" genau anders rum...
Hallo tomster,
so geht es, das macht aus einem Symbol ein Switch, nur als Readonly:
<div data-type="symbol" data-device="dummy1"
data-icon="fa-lightbulb-o"
data-on="on"
data-off="off"
data-background-icon="fa-circle"
data-on-background-color="#aa6900"
data-off-color="#2A2A2A"
data-on-color="#2A2A2A">
</div>
Ich muss zugeben, etwas aufwendiger, als nur ein readonly in class einzutragen.
Zitat von: setstate am 09 April 2015, 23:00:00
Ich muss zugeben, etwas aufwendiger, als nur ein readonly in class einzutragen.
Bin grade auf das gleiche Problem gestossen worden: ich hab an ziemlich vielen Stellen switches statt symbols verwendet und bin jetzt zu faul die alle umzuschreiben ;) Spricht etwas gegen eine Implementierung von class "readonly" im Switch?
mode:$(this).hasClass('readonly')?'signal':'toggle',sollte dazu reichen, oder?
Danke ihr beiden! Zwischenzeitlich hab ich aber "symbol" auch verstanden ;-)
:-) ich hatte auch gerade mit data-mode="signal" experimentiert, aber die Init vs. Bind Reihenfolge passt hier nicht, darum greift das nicht mehr.
Nö, können wir gerne einbauen. Ich finde es auch besser, wenn man sich nur merken muss: da gibt es diese Eigenschaft und nicht noch wann gilt diese und wann nicht. Einfacher und nachvollziehbarer geht hier vor Vermeidung von Dopplungen.
Falls jem. meinen Code im Bezug auf die Windrichtung übernommen hat muss dieser angepasst werden. Die Windrichtung wurde nicht richtig angezeigt. Der Eintrag muss wie folgt aussehen!
Zitat<td><center><div data-type="wind_direction"
data-device="MyWeather"
data-get="windDir"
data-part="2"
data-size="75"
data-tickstep="45"></div>
</center></td>
Neue Version von wind_direction. Bitte hier entlang! (http://forum.fhem.de/index.php/topic,36122.msg284314.html#msg284314) :)
(Diskussionen zu Widgets aus dem Repository Widgets-for-fhem-tablet-ui (https://github.com/nesges/Widgets-for-fhem-tablet-ui) bitte in diesem Thread)
Zitat von: jual am 09 April 2015, 21:38:50
Wie versprochen gibt es hier nun meine aktuelle Umsetzung eines "Weckers". In ein paar Beiträgen vorher hatte ich ja grundsätzlich das Konzept beschrieben. Nun gibt es den kompletten Code.
Hallo jual,
vielen Dank für das Bereitstellen deiner Lösung und die detaillierte Beschreibung.
Sehr kreativ gelöst, Hut ab!!
Ich habe eine grundsätzliche Frage zur Anrodnung der Widgets (per data-col="..." und data-row="...")
Ich möchte ein Widget rechts unten in die Ecke legen. Ohne dass zwischendrin welche liegen. Das scheint nicht zu funktionieren. Ein Hinschieben über das Frontend geht auch nicht. Rechts oben geht alelrdings. Ist das grundsätzlich nicht möglich, oder muss ich das irgendwo einstellen?
Zitat von: mw_fhem am 10 April 2015, 13:55:52
Ich habe eine grundsätzliche Frage zur Anrodnung der Widgets (per data-col="..." und data-row="...")
Ich möchte ein Widget rechts unten in die Ecke legen. Ohne dass zwischendrin welche liegen. Das scheint nicht zu funktionieren. Ein Hinschieben über das Frontend geht auch nicht. Rechts oben geht alelrdings. Ist das grundsätzlich nicht möglich, oder muss ich das irgendwo einstellen?
Das kann diese Version von gridster nicht. Es gab mal Forks von gridster, die das konnten
Du musst aber nicht mit gridster arbeiten. Man kann auch mit div Elementen arbeiten und deren Position auf fix oder absolute. Andere Grid Plugins können das vllt. auch. Aber wie nesges schon schrieb: zur Zeit sind andere Dinge interessanter. :D
Zitat von: mw_fhem am 10 April 2015, 13:55:52
Ich habe eine grundsätzliche Frage zur Anrodnung der Widgets (per data-col="..." und data-row="...")
Ich möchte ein Widget rechts unten in die Ecke legen. Ohne dass zwischendrin welche liegen. Das scheint nicht zu funktionieren. Ein Hinschieben über das Frontend geht auch nicht. Rechts oben geht alelrdings. Ist das grundsätzlich nicht möglich, oder muss ich das irgendwo einstellen?
Das kann diese Version von gridster nicht. Es gab mal Forks von gridster, die das konnten
Du musst aber nicht mit gridster arbeiten. Man kann auch mit div Elementen arbeiten und deren Position auf fix oder absolute. Andere Grid Plugins können das vllt. auch. Aber wie nesges schon schrieb: zur Zeit sind andere Dinge interessanter. :D
Danke! Es liegt also nicht an meiner Dummheit ;)
Zitat von: chris1284 am 09 April 2015, 20:00:10
toll wäre die fhem-svg's inkl. farbangabe mit einzubinden. zb www/images/openautomation/scene_livingroom.svg in rot. simpel per scene_livingroom@red zum beispiel
kann dazu evtl jemand einen tip geben? da die icons in jeder fheminstallaion verfügbar sind und die svg's farblich anpassbar wäre die integration schon toll (und Font Awesome bietet ehr wenig für die hausautomatsierung find ich)
ein tipp wie man die svg's einfärbt würde auch schon reichen
Zitat von: chris1284 am 10 April 2015, 18:08:06
ein tipp wie man die svg's einfärbt würde auch schon reichen
So macht Fhem das: 01_FHEMWEB.pm, Zeile 1964ff:
$name =~ m/(@.*)$/;
my $col = $1 if($1);
if($col) {
$col =~ s/@//;
$col = "#$col" if($col =~ m/^([A-F0-9]{6})$/);
$data =~ s/fill="#000000"/fill="$col"/g;
$data =~ s/fill:#000000/fill:$col/g;
} else {
$data =~ s/fill="#000000"//g;
$data =~ s/fill:#000000//g;
}Da wird einfach der Text "#000000" im SVG File durch den Wert, der hinter "@" notiert ist ersetzt. Kann man in Perl, PHP etc. machen - aber in JS wird das schwierig, denk ich.
Hallo,
Ich probiers nochmal. Hat schon jemand eine Lichtansteuerung mit Philips hue realisiert ?
Hermann
Zitat von: Hermann am 10 April 2015, 18:56:33
Hallo,
Ich probiers nochmal. Hat schon jemand eine Lichtansteuerung mit Philips hue realisiert ?
Hermann
sollte mit dem volume widet gehen. In der Projekt readme steht da einiges. Da muss man die Min und Max Werte, einstellen und das Reading, was gelesen/geschrieben werden soll. Es gibt auch CSS Klassen, damit es auch bei Verwendung für den Hue-Wert in Farbe den Wert anzeigt. Aber man muss mindestens zwei Controls einbauen, eins für den Hue-Wert und eins für die Helligkeit. Ein Kombi-Selector gibt es (noch) nicht. Ich weiß auch nicht, ob das sinnvoll ist. Wie oft stellt man wirklich dran rum, oder sind drei Button mit drei oft genutzen Werten sinnvoller. Mein Philips Hue ist gestern erst eingetroffen. Ich habe sie noch nicht in FHEM eingebunden, um Erfahrungen damit sammeln zu können.
<div data-type="volume" data-device='dummy1'
data-min='0'
data-max='65535'
data-tickstep='4'
data-get='hue'
data-set='hue'
class="cell small hue-tick" ></div>
<div data-type="label" class="cell">Light2</div>
Ich habe OSRAM Ligthify in Betrieb und das setzt ebenfalls auf HUE auf. Dazu gibt es ja das entsprechende FHEM-Modul.
ich habe auch noch ein Problem , alle meine ä/ü/ werden so angezeigt..... Bild.....
was kann ich da machen........
ist auf meinem PC und auf meinem Android Gerät....
wird auch so in Fhem in den Internals angezeigt und unter State steht immer ?????
Zitat von: setstate am 10 April 2015, 19:05:29
sollte mit dem volume widet gehen. In der Projekt readme steht da einiges. Da muss man die Min und Max Werte, einstellen und das Reading, was gelesen/geschrieben werden soll. Es gibt auch CSS Klassen, damit es auch bei Verwendung für den Hue-Wert in Farbe den Wert anzeigt. Aber man muss mindestens zwei Controls einbauen, eins für den Hue-Wert und eins für die Helligkeit. Ein Kombi-Selector gibt es (noch) nicht. Ich weiß auch nicht, ob das sinnvoll ist. Wie oft stellt man wirklich dran rum, oder sind drei Button mit drei oft genutzen Werten sinnvoller. Mein Philips Hue ist gestern erst eingetroffen. Ich habe sie noch nicht in FHEM eingebunden, um Erfahrungen damit sammeln zu können.
<div data-type="volume" data-device='dummy1'
data-min='0'
data-max='65535'
data-tickstep='4'
data-get='hue'
data-set='hue'
class="cell small hue-tick" ></div>
<div data-type="label" class="cell">Light2</div>
Danke, hat mir schon etwas weitergeholfen. Meine Philips hue sind auch noch ganz frisch. Hatte aber bis jetzt nur 2 weisse und da hat es mit volume ganz gut geklappt. Aber bei meiner neuen RGB wusste ich nicht weiter. Wenns irgendwann mehr Infos gibt bin ich auf jeden Fall für jeden Input dankbar.
Zitat von: chris1284 am 10 April 2015, 18:08:06
kann dazu evtl jemand einen tip geben? da die icons in jeder fheminstallaion verfügbar sind und die svg's farblich anpassbar wäre die integration schon toll (und Font Awesome bietet ehr wenig für die hausautomatsierung find ich)
ein tipp wie man die svg's einfärbt würde auch schon reichen
Ins HTML müsste man sie so einbinden:
<img src="../images/openautomation/scene_livingroom.svg" height="30" width="30" class="svg" />Per jQuery müsste man sie dann in inline SVG umwandeln und könnte dann die festgelegte #000000 Farbe überschreiben.
jQuery('img.svg').each(function(){
var $img = jQuery(this);
var imgID = $img.attr('id');
var imgClass = $img.attr('class');
var imgURL = $img.attr('src');
jQuery.get(imgURL, function(data) {
// Get the SVG tag, ignore the rest
var $svg = jQuery(data).find('svg');
// Add replaced image's ID to the new SVG
if(typeof imgID !== 'undefined') {
$svg = $svg.attr('id', imgID);
}
// Add replaced image's classes to the new SVG
if(typeof imgClass !== 'undefined') {
$svg = $svg.attr('class', imgClass+' replaced-svg');
}
// Remove any invalid XML tags as per http://validator.w3.org
$svg = $svg.removeAttr('xmlns:a');
$svg.attr('width',$img.attr('width'));
$svg.attr('height',$img.attr('height'));
// Replace image with new SVG
$img.replaceWith($svg);
}, 'xml');
});
die Farbe kann man dann im CSS File vorgeben:
.replaced-svg {
background-color: #d33;
}
.replaced-svg g{
fill: #fff;
}Oder in der o.g. Replace Schleife per
$svg.find('g').attr('fill','#dd3232');Aber ich habe nicht vor, Aufwand zu spendieren, um diese SVGs hier um inkludieren. Der Rechenaufwand und Ladezeit für die Anzeige ist mir viel zu groß. Ausserdem erinnern mich viele der Grafiken an Kindergartenzeichnungen.
Ich bleibe aber auf de Suche nach zusätzlichen Symbol-Fonts, die mehr nach HomeAutomation aussehen, aber auch gut zum beabsichtigten Aussehen des UI passen.
Hallo,
Noch einmal kurz ein Bild wie es bis jetzt mit den Philips hue aussieht.
Hermann
Bezüglich der Thematik mit weiteren Icons habe ich die Seite genericons.com gefunden. Ich bin mir nicht sicher, ob diese Art Icons in die TabUI einbindbar sind, aber so wie ich es verstanden habe, kann man mit einem Tool Font Custom (fontcustom.com) aus SVGs eigene Icon Fonts erstellen. Ich habe mir bisher nur die Beschreibung kurz angesehen. Da ich aktuell leider nicht so viel Zeit dafür habe, kann ich es leider nicht austesten. Vielleicht findet sich ja jemand, der das mal verfolgen will.
Zitat von: jual am 10 April 2015, 20:37:49
Bezüglich der Thematik mit weiteren Icons habe ich die Seite genericons.com gefunden. Ich bin mir nicht sicher, ob diese Art Icons in die TabUI einbindbar sind, aber so wie ich es verstanden habe, kann man mit einem Tool Font Custom (fontcustom.com) aus SVGs eigene Icon Fonts erstellen. Ich habe mir bisher nur die Beschreibung kurz angesehen. Da ich aktuell leider nicht so viel Zeit dafür habe, kann ich es leider nicht austesten. Vielleicht findet sich ja jemand, der das mal verfolgen will.
Super, genau dieser Typ ist passend. Mehr davon ...
Besteht Interesse, diese als Switch oder Symbol Icon zu benutzen?
@hotwebnet: wie hast du das denn mit den kleinen Symbolen für die Anwesenheit gemacht?
Gesendet von meinem iPhone mit Tapatalk
fhem.cfg
define HandyGuido PRESENCE lan-ping 192.168.178.20
define HandyAnja PRESENCE lan-ping 192.168.178.21
Tablet UI
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
<header>Anwesenheit</header>
<div class="container">
<div class="left"><br/>
<div data-type="symbol" data-device="HandyAnja"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Anwesenheit Anja</div>
</div>
<div class="right"><br/>
<div data-type="symbol" data-device="HandyGuido"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Anwesenheit Guido</div>
Danke dir :-)
Update: New Widget: Select -> zum Anzeigen von Listen und Auswählen daraus, z.B. für Eingangswahl am AV-Receiver
<header>SELECT</header>
<div data-type="label" class="inline">Zone2</div>
<div data-type="select" data-device="AvReceiverZ2" data-items='["Airplay","Webradio","BD/DVD","PHONO"]' data-get="input" data-set="input" class="cell" ></div>
<div/>
<div data-type="label" class="inline">Zone1</div>
<div data-type="select" data-device="AvReceiver" data-list="inputs" data-get="input" data-set="input" class="cell" ></div>
Man kann die Liste aus FHEM beziehen: data-list="myReading" oder
fest vorgeben: data-items='["Wert1","Wert2","Wert3"]'
(http://knowthelist.github.io/fhem-tablet-ui/select_2x.png)
Zitat von: setstate am 11 April 2015, 13:11:12
Man kann die Liste aus FHEM beziehen: data-list="myReading"
Wie würde das denn in Fhem aussehen? Kann mir das gerade nicht vorstellen.
Fhem-Beispiel:
define carType dummy
attr setList state:Car,Bus,Ambulance
Tablet UI ? ? ? ? ?
Zitat von: dancatt am 11 April 2015, 16:02:47
Wie würde das denn in Fhem aussehen? Kann mir das gerade nicht vorstellen.
Fhem-Beispiel:
define carType dummy
attr setList state:Car,Bus,Ambulance
Tablet UI ? ? ? ? ?
Es muss ein Reading sein, was eine : (Doppelpunkt) separierte Liste liefert.
Zitatfhem> list AvReceiver inputs
AvReceiver AM:AUX:Airplay:BD/DVD:BLUETOOTH:FM:NET:PHONO:SAT:Source:TV/CD:USB:Webradio
So ist es in der cfg:
Zitatattr AvReceiver inputs AM:AUX:Airplay:BD/DVD:BLUETOOTH:FM:NET:PHONO:SAT:Source:TV/CD:USB:Webradio
Hab gerade gemerkt dass die Werte mit ":" getrennt sein müssen.
Ist es auch möglich dass automatisch die Attribute aus "setList" genommen werden? Da muss man dann nur beim parsen aufpassen da man unter setList mehrere Listen nach folgender Syntax angeben kann:
attr setList state1:wert1,wert2 state2:wert3,wert4
Zitat von: bjoernbo am 05 März 2015, 23:16:33
ich habe alle ersetzt aus die die Index! Denn wenn ich die Index ersetze sind ja meine Werte weg, oder meinst du das ernst???
... und ich muss sagen, wiedermal genial! Das mit dem runden "data-fix" funktioniert!!!! (siehe SONSTIGES, Verbrauch)
(//)
Noch habe ich das nicht so ganz mit der Temperaturabfrage von Netatmo verstanden? Magst du mir dein Beispiel schicken?
Das wäre echt lieb
setList ist für mich noch "Neuland". Ich bin nicht der Poweruser von FHEM.
Schau ich mir gerne an und erweitere das select Widget.
Bin gerade bei den ersten Schritten mit der Tablet UI und muss sagen, dass man wirklich schnell zu etwas sehr ansehnlichem kommt. Klasse Arbeit :)
Toll wäre noch ein Timepicker-Widget, beispielsweise für einen Wecker.
lg
aeronaut
Zitat von: aeronaut am 11 April 2015, 16:36:50
Toll wäre noch ein Timepicker-Widget, beispielsweise für einen Wecker.
Fast perfektes Timing! Ziemlich genau 13 Minuten vor deinem Posting hab ich in http://forum.fhem.de/index.php/topic,36122.msg284678.html#msg284678 eine ersten Version des neuen Widgets "
settimer" veröffentlicht :)
Du kannst Gedanken lesen, nesges :D
Danke für den Wecker. Funktioniert tadellos.
Habt ihr Tablets im Einsatz, die ihr an die Wand montiert habt und darauf dann die Tablet UI nutzt? Könnt ihr da Geräte empfehlen?
LG Jo
Gesendet von meinem iPhone mit Tapatalk
Zitat von: bmwfan am 05 April 2015, 21:18:09
Voila, meine Mülllogik:
#########################################################
# --- Abholtage Abfall anzeigen ---
#########################################################
define rgAbfallkalender readingsGroup abfallkalender:!title\
abfallkalender:!day|0,!Restabfall|0,!Leichtverpackungen|0,!Papier|0,!Bioabfall|0,!O-Tonne|0,!Tannenbaum|0\
abfallkalender:!day|1,!Restabfall|1,!Leichtverpackungen|1,!Papier|1,!Bioabfall|1,!O-Tonne|1,!Tannenbaum|1\
abfallkalender:!day|2,!Restabfall|2,!Leichtverpackungen|2,!Papier|2,!Bioabfall|2,!O-Tonne|2,!Tannenbaum|2\
abfallkalender:!day|3,!Restabfall|3,!Leichtverpackungen|3,!Papier|3,!Bioabfall|3,!O-Tonne|3,!Tannenbaum|3\
abfallkalender:!day|4,!Restabfall|4,!Leichtverpackungen|4,!Papier|4,!Bioabfall|4,!O-Tonne|4,!Tannenbaum|4\
abfallkalender:!day|5,!Restabfall|5,!Leichtverpackungen|5,!Papier|5,!Bioabfall|5,!O-Tonne|5,!Tannenbaum|5\
abfallkalender:!day|6,!Restabfall|6,!Leichtverpackungen|6,!Papier|6,!Bioabfall|6,!O-Tonne|6,!Tannenbaum|6\
abfallkalender:!day|7,!Restabfall|7,!Leichtverpackungen|7,!Papier|7,!Bioabfall|7,!O-Tonne|7,!Tannenbaum|7\
abfallkalender:!day|8,!Restabfall|8,!Leichtverpackungen|8,!Papier|8,!Bioabfall|8,!O-Tonne|8,!Tannenbaum|8\
abfallkalender:!day|9,!Restabfall|9,!Leichtverpackungen|9,!Papier|9,!Bioabfall|9,!O-Tonne|9,!Tannenbaum|9\
abfallkalender:!day|10,!Restabfall|10,!Leichtverpackungen|10,!Papier|10,!Bioabfall|10,!O-Tonne|10,!Tannenbaum|10\
abfallkalender:!day|11,!Restabfall|11,!Leichtverpackungen|11,!Papier|11,!Bioabfall|11,!O-Tonne|11,!Tannenbaum|11\
abfallkalender:!day|12,!Restabfall|12,!Leichtverpackungen|12,!Papier|12,!Bioabfall|12,!O-Tonne|12,!Tannenbaum|12\
abfallkalender:!day|13,!Restabfall|13,!Leichtverpackungen|13,!Papier|13,!Bioabfall|13,!O-Tonne|13,!Tannenbaum|13\
abfallkalender:!day|14,!Restabfall|14,!Leichtverpackungen|14,!Papier|14,!Bioabfall|14,!O-Tonne|14,!Tannenbaum|14
attr rgAbfallkalender alias Müllabfuhr
attr rgAbfallkalender cellStyle { "r:1"=>'style="font-weight:bold;;font-size:16px"',"c:1"=>'style="font-weight:bold;;text-align:right;;padding-left:28pt;;"'}
attr rgAbfallkalender group Müll
attr rgAbfallkalender nonames 1
attr rgAbfallkalender valueColumns { title => 'colspan="7"' }
attr rgAbfallkalender valueFormat {if($READING eq 'title'){$VALUE="recycling"}else{my($r,$d)=split(/\|/,$READING);;;;my $v=fhem("get abfallkalender days $d",1);;;;if($v eq "none"){$VALUE=undef}else{if($r eq 'day'){if($d==0){$VALUE="Heute"}elsif($d==1){$VALUE="Morgen"}else{$VALUE="in $d Tagen"}}else{if($v=~m/$r/){$VALUE=1}else{$VALUE=' '}}}}}
attr rgAbfallkalender valueIcon {if($VALUE eq 'recycling'){$VALUE}elsif($VALUE eq 1){if($READING=~m/Restabfall/){$VALUE='bag'}elsif($READING=~m/Leichtverpackungen/){$VALUE='bag@FFFF00'}elsif($READING=~m/Papier/){$VALUE='bag@01A3F5'}elsif($READING=~m/Bioabfall/){$VALUE='bag@04D921'}elsif($READING=~m/O-Tonne/){$VALUE='dustbin@FF6D00'}elsif($READING=~m/Tannenbaum/){$VALUE='christmas_tree@2B6B17'}}else{$VALUE=''}}
attr rgAbfallkalender valueSuffix {'title'=>' Müllabfuhr'}
und die dummys
# --- Müllstatus in dummy ablegen, damit im WEB-UI angezeigt werden kann
# --- di_abfallkalender: Kopiert Info über Abholung von morgen in du_abfallkalender
define du_abfallkalender dummy
define di_abfallkalender DOIF ([abfallkalender:tomorrow] eq "Papier") ({fhem ("setreading du_abfallkalender state Papier")}) DOELSEIF ([abfallkalender:tomorrow] eq "Restabfall") ({fhem ("setreading du_abfallkalender state Restmüll")}) DOELSEIF ([abfallkalender:tomorrow] eq "Leichtverpackungen") ({fhem ("setreading du_abfallkalender state Gelber Sack")}) DOELSE ({fhem ("setreading du_abfallkalender state Nichts")})
# --- Prüft täglich um 18:00 Uhr, ob am nächsten Tag Abholung ansteht
define di_pushmsg_Abfallkalender DOIF ([20:00] and [?du_abfallkalender:state] ne "Nichts") ({fhem("set PushoverAdresse1 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 ''")},{fhem("set PushoverAdresse2 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 ''")})
Ansich coole Idee geht aber irgendwie bei mir nicht. Und wenn zeigt es mir ja nur eine Abfuhr an. Wobei ich hätte das gerne so. Wie im Anhang. Wer eine Idee?
MfG
Andy
Zitat von: johannes1984 am 11 April 2015, 22:11:11
Habt ihr Tablets im Einsatz, die ihr an die Wand montiert habt und darauf dann die Tablet UI nutzt? Könnt ihr da Geräte empfehlen?
Ich baue mir gerade als Wochenendprojekt ein Lenovo A10-70 an die Wand. Kann ich für die 150€ die es kostet empfehlen. Ich habe mit diversen Apps (Nova Launcher, Zooper Widgets etc.) Das Tablet so angepasst, dass von Android fast nichts mehr zu sehen ist (außer man will es). Ich lasse mal Screenshots vom aktuellen Stand da.
Homescreen:
Das Hintergrundbild spiegelt immer das aktuelle Wetter und die Tageszeit wieder. Der linke Button öffnet das Frontend, der mittlere die Sonos App und der Rechte den App-Drawer. Onscreenbuttons lassen sich durch einen Swipe über den roten Balken wieder einblenden.
Frontend:
Das Frontend läuft in Webviewcontrol.
@dj_sammy190:
Geht bei mir auch nicht mehr. Nach meinem Test hatte ich die zweite pushmsg (adresse2) noch eingefügt und nicht mehr getestet. Habe dann diese Woche bei der Restmülllehrung bemerkt, dass die Message nicht kommt. Da ich meine, dass ich alles korrekt eingetragen habe, kann ich auch nicht adhoc sagen, wo der Fehler liegt. Aber vielleicht weis Damian da mehr und sieht den Fehler sofort.
Da bei uns immer nur eine Abholung am Tag ansteht, habe ich mich nie damit beschäftigt 2 Abholungen anzuzeigen.
@matzemoerk: genau dasselbe will ich auch machen. Hast du dir auch mal einen Touchmonitor, 17" überlegt und den mit einem Arduino o.ä. Anzusteuern? Oder hat jemand im Forum so etwas am laufen?
Gruß Jürgen
Hat jemand einen Amazon Kindle Fire HD dafür in Benutzung? Die Dinger gehen bei Amazon ja doch sehr preiswert weg.
Gesendet von meinem iPhone mit Tapatalk
Zitat von: bmwfan am 12 April 2015, 09:43:51
Hast du dir auch mal einen Touchmonitor, 17" überlegt und den mit einem Arduino o.ä. Anzusteuern? Oder hat jemand im Forum so etwas am laufen?
Überlegt und die Idee wieder verworfen. Mit Android bist du wahnsinnig flexibel. Ich habe beispielsweise heute Morgen einen neuen Homescreen erstellt. Wische ich im Hauptmenü nach rechts bekomme ich beispielsweise Kalender und Notizen. Ich habe noch einen RaspberryPi übrig mit dem ich nochmal in diese Richtung experimentieren will. Aber bei den Preisen für China-Tablets finde ich diese Lösung nach wie vor sehr praktisch.
Habe eine ASUS TF303K http://www.hardwareversand.de/10-10%2C9+2-in-1/187916/ASUS+Transformer+TF303K-1D020A+%2810%2C1%29.article?ref=58&pvid=koxhj624k_i8bas4f4&gclid=CjwKEAjwr6ipBRCM7oqrj6O30jUSJACff2WHwT2R8VXodFCgFd7h4MbqdfQ9pNxTlUuBrUR_NycBYxoC4Yrw_wcB (http://www.hardwareversand.de/10-10%2C9+2-in-1/187916/ASUS+Transformer+TF303K-1D020A+%2810%2C1%29.article?ref=58&pvid=koxhj624k_i8bas4f4&gclid=CjwKEAjwr6ipBRCM7oqrj6O30jUSJACff2WHwT2R8VXodFCgFd7h4MbqdfQ9pNxTlUuBrUR_NycBYxoC4Yrw_wcB) - 10,1" Zoll und bin sehr zufrieden damit. Verwende eigentlich keine Android oder Windows Systeme, bin aber sehr zufrieden mit dem besagtem Device.
Ein echt Klasse Tool! Respekt....
Versuche mich gerade an dem Clock Widget, leider komme ich nicht weiter. Folgenden Code habe ich:
<div data-type="clock" data-format="Y-m-d H:i:s" class="cell big"></div>
das Widget liegt im JS Ordner und bereits rebootet
Kann jemand helfen?
Zitat von: SirMarco am 12 April 2015, 14:01:28
<div data-type="clock" data-format="Y-m-d H:i:s" class="cell big"></div>
Sollte eigentlich genau so funktionieren. Hast du Meldungen in der Javascript-Konsole? Falls nicht: Hänge bitte dein HTML-File an.
Ich in der COnsole bekomme ich folgende MEldungen:
siehe Anhang
Hallo zusammen,
ich versuch mich gerade am Circlemenu und bekomme dabei nicht die Symbole ausgerichtet.
Siehe Hardcopies.
<div data-type="circlemenu" class="circlemenu keepopen">
<ul class="menu"">
<li><div data-type="push" data-icon="data-icon="fa-align-justify">H</div></li>
<li><div data-type="button" data-url="heizung.html" data-icon="fa-align-justify" class="cell fa-rotate-90"></div>1</li>
<li><div data-type="button" data-url="heizung2.html" data-icon="fa-align-justify" class="cell fa-rotate-90"></div>2</li>
</ul>
</div>
Hat jemand ein Tipp?
Gruß
Markus
Ist es möglich mit einem Label den Timestamp eines Readings auszugeben?
Z.B. um den letzten Auslöser eines Bewegungsmelders anzuzeigen.
Ich möchte mir in einem Widget regelmäßig aktualisierte Nachrichten ausgeben lassen. Dazu verwende ich ReadingsHistory, was die Nachrichteneinträge verwaltet und bei Bedarf den passenden HTML-Code erzeugt. Den lasse ich dann als Label anzeigen. Klappt im Prinzip mit einem kleinen Schönheitsfehler:
Beim ersten Laden bzw. manuellen Laden der Seite wird alles richtig angezeigt. Ergänze ich nun einen Eintrag, der per longpoll aktualisiert werden soll, fehlen auf einmal die Zeilenumbrüche. Mache ich dann einen Reload, passt es wieder. Es liegt also nicht am HTML-Code den ich dem Label liefere, sondern das longpoll-Update scheint die <BR>-Tags zu ignorieren, im Unterschied zum "normalen" Update.
Hat jemand eine Idee, wie man das lösen kann?
Hier übrigens der HTML-Code, der angezeigt werden soll:
<table><tr><td><div class="devType"><a href="/fhem?detail=Testliste">Testliste</a></a></div></td></tr><tr><td><table class="block wide"><tr class="odd"><td><div id="Testliste-history" rows="5">14:43:12 Anruf von ABC<br>14:37:01 Anruf von XYZ<br>14:32:17 Neue Nachricht auf AB<br>14:31:41 Anruf <br>14:30:48 --clear--<br></div></td><tr class="even"></table></td></tr></table>
Zitat von: aeronaut am 12 April 2015, 14:48:01
Ist es möglich mit einem Label den Timestamp eines Readings auszugeben?
Z.B. um den letzten Auslöser eines Bewegungsmelders anzuzeigen.
Grundsätzlich ja. Der timestamp wird intern schon gespeichert, muss nur ausgegeben werden. Kleine Änderung ...
Zitat von: SirMarco am 12 April 2015, 14:28:41
Ich in der COnsole bekomme ich folgende MEldungen:
Die Warnungen rühren daher, dass du noch eine veraltete (das geh hier recht schnell ;)) Syntax für die HTML Definitionen benutzt. Und wenn ich's richtig sehe, hast du auch noch unveränderten Code der Beispiel index.html aktiv, der evtl. zu Fehlern führt, weil die (Fhem-)Devices nicht existent sind. Geht denn damit überhaupt irgendwas oder macht nur die clock Probleme? Bring auf jeden Fall erstmal die Warnungen in Ordnung (die Attribute "type" und "device" heissen jetzt "data-type" und "data-device") und entferne unnötigen HTML-Code.
Zitat von: Markus Hermann am 12 April 2015, 14:40:39
ich versuch mich gerade am Circlemenu und bekomme dabei nicht die Symbole ausgerichtet.
Die CSS-Klasse "cell" verursacht in dem Kontext die Verschiebung. Lass sie einfach weg, sollte dort nicht gebraucht werden.
Zitat von: nesges am 12 April 2015, 15:28:58
Die Warnungen rühren daher, dass du noch eine veraltete (das geh hier recht schnell ;)) Syntax für die HTML Definitionen benutzt. Und wenn ich's richtig sehe, hast du auch noch unveränderten Code der Beispiel index.html aktiv, der evtl. zu Fehlern führt, weil die (Fhem-)Devices nicht existent sind. Geht denn damit überhaupt irgendwas oder macht nur die clock Probleme? Bring auf jeden Fall erstmal die Warnungen in Ordnung (die Attribute "type" und "device" heissen jetzt "data-type" und "data-device") und entferne unnötigen HTML-Code.
Der Rest funktioniert bestens. Dank dir... Werde es bereinigen
Habe alles bereinigt und die data-type sachen angepasst. Leider keine Chance auf die Uhr. Können Rechte Probleme machen?
Zitat von: SirMarco am 12 April 2015, 16:05:09
Habe alles bereinigt und die data-type sachen angepasst. Leider keine Chance auf die Uhr. Können Rechte Probleme machen?
widget_clock.js muss lesbar sein; wäre es nicht lesbar, würde das aber eine Fehlermeldung ala
GET http://wopr/tui/fhem-tablet-ui/www/tablet/js/widget_clock.js 403 (Forbidden)
widget_settimer.js:5 Uncaught ReferenceError: widget_clock is not definedprovozieren. clock ist eigentlich sehr simpel. Pure Javascript, nichtmal eine Verbindung zu Fhem gibt es. Von daher bin ich ein wenig ratlos. Das einzige was ich mir vorstellen kann ist ein allgemeiner Javascript-Fehler. Binde bitte mal die folgende Zeile in deine index.html ein:
<script type="text/javascript" src="/fhem/tablet/js/widget_clock.js"></script>Bringt das Meldungen in der JS-Konsole? Falls nicht: Ersetze deine index.html mal testweise durch:
<!doctype html>
<html>
<head>
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="fhemweb_url" content="/fhem">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>TREND</header>
<div data-type="clock" data-format="Y-m-d H:i:s" class="cell big"></div>
</li>
</ul>
</div>
</body>
</html>
Habe die index.html mal eingebunden, leider keine Uhr zu sehen.
Bin auch ratlos
Jetzt gehen mir wirklich die Ideen aus. Welchen Browser in welcher Version benutzt du?
Ich hab grade eine neue Version eingecheckt. Falls die Änderung darin den Fehler bei dir behebt, würde ich mich allerdings wundern :) Aber probier mal bitte https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/js/widget_clock.js
Danke für deine Hilfe. Habe die Version probiert, keine änderungen. nutze Firefox und Chrome. chrome android klappt auch nicht.
mensch was kann das nur sein
Zitat von: Brockmann am 12 April 2015, 14:53:12
Ich möchte mir in einem Widget regelmäßig aktualisierte Nachrichten ausgeben lassen. Dazu verwende ich ReadingsHistory, was die Nachrichteneinträge verwaltet und bei Bedarf den passenden HTML-Code erzeugt. Den lasse ich dann als Label anzeigen. Klappt im Prinzip mit einem kleinen Schönheitsfehler:
Beim ersten Laden bzw. manuellen Laden der Seite wird alles richtig angezeigt. Ergänze ich nun einen Eintrag, der per longpoll aktualisiert werden soll, fehlen auf einmal die Zeilenumbrüche. Mache ich dann einen Reload, passt es wieder. Es liegt also nicht am HTML-Code den ich dem Label liefere, sondern das longpoll-Update scheint die <BR>-Tags zu ignorieren, im Unterschied zum "normalen" Update.
Hallo Brockmann,
die <br> Tags werden explizit entfernt. Leider weiß ich jetzt aus dem Kopf nicht 100%ig, warum genau.
Du kannst ja mal in der
fhem-tablet-ui.js
die Zeile 238 ändern, von
Zitatvar lines = data.replace(/<br>/g,"").split(/\n/);
auf
Zitatvar lines = data.split(/\n/);
und schauen ob es dann besser ist und (ganz wichtig) alles andere auch noch funktioniert.
Zitat von: setstate am 12 April 2015, 18:22:58
Du kannst ja mal in der fhem-tablet-ui.js die Zeile 238 ändern, und schauen ob es dann besser ist und (ganz wichtig) alles andere auch noch funktioniert.
Danke für den Tipp. Ich probiere es aus und geben dann Rückmeldung.
Ei der Daus, ein Update hat meine index.html überschrieben :o Glücklicherweise gibts "backup_before_update".
War das im Sinne des Erfinders? Dann könnte man den tablet-Ordner kopieren und beim define angeben. Aber so müsste man die js-Ordner immer synchron halten ... manuell.
Upps :o
Nö, ist nicht gewollt. Dann muss die geänderte Filegröße das Update erzwungen haben. Am Zeitstempel kann es nicht liegen, der ist auf "alt" gesetzt.
Vorsichtshalber müsst ihr die wichtigsten Dateien als "unänderbar" kennzeichnen:
attr global exclude_from_update xyz.html
Oder ich mache ab sofort keine Änderungen mehr an der Demo index.html und zeige neue Beispiele in einem Example Ordner an neuen *.html Files.
@dj_sammy190:
Habe den Fehler in der Pushmessage gefunden. War Hochkomma zu viel. Es muss so aussehen (aus der DEF)
([20:00] and [?du_abfallkalender:state] ne "Nichts") (set Pushoveradresse1 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 '',set Pushoveradresse2 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 '')
so gehts bei mir.
Gruß Jürgen
@dj_sammy190: Kannst'e einen Bildschirmausdruck beifügen ?
@all: Man kann ja so einiges ins UI integrieren, da JS, CSS & HTML. Hat einer von euch mal versucht Skype ins UI zu integrieren, oder gar Apples-Facetime?? 8) :D
ZitatOder ich mache ab sofort keine Änderungen mehr an der Demo index.html und zeige neue Beispiele in einem Example Ordner an neuen *.html Files.
Das klingt gut. Aus den Beispielen konnte ich vieles schöpfen, die müssen erhalten bleiben :) Aber mal generell: Das UI ist wunderbar und ich kann mir vorstellen, mehrere Instanzen für unterschiedliche Devices oder gar Anwendungsfälle (z.B. irgendwie authentifiziert für verschiedene User) zu benutzen. Damit wäre der js-Ordner ja stets manuell synchron zu halten - oder darf es gar nur eine Instanz geben?
Hallo zusammen,
jetzt schreibe ich auch endlich mal meinen ersten Beitrag im Forum. Die Tablet UI ist der Wahnsinn, tausend Dank dafür! Endlich kann ich meine Ideen wesentlich einfacher umsetzen und der WAF-Faktor ist enorm!
Ich möchte daher auch gerne was zurück geben und daher meine aktuelle UI vorstellen, da ich einige Anpassungen vorgenommen habe. Die wohl größte Anpasung ist, dass ich Farbe ins Spiel gebracht habe. Hintergrund für mich, dass ich so die Wiedererkennbarkeit von Geräten erhöhe (Schalter immer orange, Heizung immer hellblau etc.). Des Weiteren habe ich mich für ein einfaches Kacheldesign entschieden, da ich von der Metro UI von Windows gerade für Tablet-Oberflächen begeistert bin.
Aktuell ist das Layout auf ein 7"-Tablet ausgerichtet (Auflösung angeblich 800x600)
Hier mein aktueller Code für die tablet.html (meine Hauptseite)
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>Home Control</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="146">
<meta name="widget_base_height" content="130">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="1"> <!-- 1=output to console;0=not output -->
<meta name='gridster_disable' content='1'>
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/css/metroui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/pgm2/jquery.knob.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'13381': 'homeTab01'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<!-- Reihe 1 -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" id="light">
<div class="cell">
<header>Küche</header>
<div data-type="switch" class="bigger cell" data-device="Kueche" data-get-on="on.*" data-get-off="off" data-set-on="on" data-on-color="#ffffff"></div>
</div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1" id="weather">
<div class="cell" onclick="setFhemStatus('trigger sayWettervorhersage')">
<header>Wetter</header>
<div data-type="weather" data-device="proWetter" data-get="fc0_weatherDay" class="bigger cell"></div>
<div class="" id="statustext">
<div class="inline" data-type="label" data-device="proWetter" data-get="fc0_weatherDay"></div>(
<div class="inline" data-type="label" data-device="proWetter" data-get="fc0_tempMin"></div>-
<div class="inline" data-type="label" data-device="proWetter" data-get="fc0_tempMax"></div>)
</div>
</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1" id="device">
<div class="cell">
<header>TV</header>
<div class="bigger cell" data-type="symbol" data-device="presenceLgTV" data-background-icon="fa-circle" data-icon="fa-desktop" data-on="present" data-off="absent" data-on-background-color="Darkblue" data-on-color="#FFFFFF" data-off-color="#2A2A2A"></div>
</div>
</li>
<li data-row="1" data-col="4" data-sizex="1" data-sizey="1" id="roommate">
<div class="cell">
<header>Max</header>
<div class="bigger cell" data-type="symbol" data-device="rr_Max" data-icons='["fa-home","fa-university","fa-globe","fa-bed","fa-bed","fa-bed fa-blink"]' data-on-colors='["White","White","White","White","White","White"]' data-get-on='["home","absent","gone","gotosleep","asleep","awoken"]' >
</div>
</div>
</li>
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1" id="roommate">
<div class="cell">
<header>Melli</header>
<div class="bigger cell" data-type="symbol" data-device="rr_Melli" data-icons='["fa-home","fa-university","fa-globe","fa-bed","fa-bed","fa-bed fa-blink"]' data-on-colors='["White","White","White","White","White","White"]' data-get-on='["home","absent","gone","gotosleep","asleep","awoken"]' >
</div>
</div>
</li>
<!-- Reihe 2 -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="1" id="light">
<div class="cell">
<header>Flur</header>
<div data-type="switch" class="bigger cell" data-device="Flur" data-get-on="on.*" data-get-off="off" data-set-on="on" data-on-color="#ffffff"></div>
</div>
</li>
<li data-row="2" data-col="2" data-sizex="1" data-sizey="1" id="heat">
<div class="cell">
<header>Wohnzimmer</header>
<div data-type="circlemenu" class="circlemenu">
<ul class="menu">
<li><div data-type="symbol" data-icon="fa-sliders" id="entry"></div></li>
<li><div data-type="push" data-device="WZ_HZ" data-set="desired-temp off" data-icon="" id="entry">off</div></li>
<li><div data-type="push" data-device="WZ_HZ" data-set="desired-temp 5.0" data-icon="" id="entry">5</div></li>
<li><div data-type="push" data-device="WZ_HZ" data-set="desired-temp 15.0" data-icon="" id="entry">15</div></li>
<li><div data-type="push" data-device="WZ_HZ" data-set="desired-temp 19.0" data-icon="" id="entry">19</div></li>
<li><div data-type="push" data-device="WZ_HZ" data-set="desired-temp 21.0" data-icon="" id="entry">21</div></li>
</ul>
</div>
</div>
</li>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="1" id="light">
<div class="cell">
<header>Bad</header>
<div data-type="switch" class="bigger cell" data-device="Bad" data-get-on="on.*" data-get-off="off" data-set-on="on" data-on-color="#ffffff"></div>
</div>
</li>
<li data-row="2" data-col="4" data-sizex="1" data-sizey="1" id="roommate">
<div class="cell">
<header>Phillip</header>
<div class="bigger cell" data-type="symbol" data-device="rr_Phillip" data-icons='["fa-home","fa-university","fa-globe","fa-bed","fa-bed","fa-bed fa-blink"]' data-on-colors='["White","White","White","White","White","White"]' data-get-on='["home","absent","gone","gotosleep","asleep","awoken"]' >
</div>
</div>
</li>
<li data-row="2" data-col="5" data-sizex="1" data-sizey="1" id="roommate">
<div class="cell">
<header>Jojo</header>
<div class="bigger cell" data-type="symbol" data-device="rr_Jojo" data-icons='["fa-home","fa-university","fa-globe","fa-bed","fa-bed","fa-bed fa-blink"]' data-on-colors='["White","White","White","White","White","White"]' data-get-on='["home","absent","gone","gotosleep","asleep","awoken"]'>
</div>
</div>
</li>
<!-- Reihe 3 -->
<li data-row="3" data-col="1" data-sizex="1" data-sizey="1" id="device">
<div class="cell">
<header>R3, S1</header>
</div>
</li>
<li data-row="3" data-col="2" data-sizex="1" data-sizey="1" id="status">
<div class="cell">
<header>Waschmaschine</header>
<div class="bigger cell" data-type="symbol" data-device="Waschmaschine" data-icons='["fa-sign-in","fa-sign-out","fa-refresh fa-spin"]' data-on-colors='["White","White","White"]' data-get-on='["aus","fertig","waschen"]' ></div>
<div data-type="label" data-device="Waschmaschine" data-get="state" id="statustext"></div>
</div>
</li>
<li data-row="3" data-col="3" data-sizex="1" data-sizey="1" id="device">
<div class="cell">
<header>R3, S3</header>
</div>
</li>
<li data-row="3" data-col="4" data-sizex="1" data-sizey="1" id="device">
<div class="cell">
<header>R3, S4</header>
</div>
</li>
<li data-row="3" data-col="5" data-sizex="1" data-sizey="1" id="device">
<div class="cell">
<header>R3, S5</header>
</div>
</li>
</ul>
</div>
</body>
</html>
Wie man sieht, habe ich noch einige Platzhalter drin.
und meine metroui.css:
body {
background-color: #ffffff;
font-family: "Helvetica Neue", "Helvetica", "Open Sans", "Arial", "Helvetica", sans-serif;
-webkit-font-smoothing: antialiased;
font-size: regular;
color: #ffffff !important;
}
@font-face {
font-family: 'MeteoconsRegular';
src: url('../fonts/meteocons-webfont.eot');
src: url('../fonts/meteocons-webfont.eot?#iefix') format('embedded-opentype'),
url('../fonts/meteocons-webfont.woff') format('woff'),
url('../fonts/meteocons-webfont.ttf') format('truetype'),
url('../fonts/meteocons-webfont.svg#MeteoconsRegular') format('svg');
font-weight: normal;
font-style: normal;
}
.center {
margin: 0 auto;
}
.cell {
margin: 5px 0px !important;
}
.circlemenu {
width: auto;
text-align: center;
vertical-align: middle;
margin-top: 20px;
font-size:100%;
}
.circlemenu #entry {
margin-top:-1px;
margin-left:-1px;
font-size:200%;
}
.biggest {
margin-top: -35px;
font-size: 450% !important;
}
.gridster ul li {
background-color:#CCCCCC;
}
.gridster li header {
background: #262626;
color: #fff;
font-size: 14px;
text-align: right;
padding: 2px 5px ;
}
.weather:before {
color: #ffffff;
}
.gridster #light {
background-color:#e3a21a;
overflow: hidden;
text-align: center;
}
.gridster #weather {
background-color:#55AA55;
overflow: hidden;
text-align: center;
}
.gridster #heat {
background-color:#0080ff;
overflow: hidden;
text-align: center;
font-size: 100%;
}
.gridster #device {
background-color:#233a77;
overflow: hidden;
text-align: center;
}
.gridster #resident, #residents {
background-color:#da532c;
overflow: hidden;
text-align: center;
}
.gridster #roommate {
background-color:#da532c;
overflow: hidden;
text-align: center;
}
.gridster #status {
background-color:#1b6125;
overflow: hidden;
text-align: center;
}
.gridster #statustext {
align:bottom;
margin-top:-20px;
font-weight:bold;
}
.font-blue, .font-blue-link a {color: #2d89ef;}
.font-blueLight, .font-blueLight-link a {color: #eff4ff;}
.font-blueDark, .font-blueDark-link a {color: #2b5797;}
.font-green, .font-green-link a {color: #00a300;}
.font-greenLight, .font-greenLight-link a {color: #99b433;}
.font-greenDark, .font-greenDark-link a {color: #1e7145;}
.font-red, .font-red-link a {color: #b91d47;}
.font-yellow, .font-yellow-link a {color: #ffc40d;}
.font-orange, .font-orange-link a {color: #e3a21a;}
.font-orangeDark, .font-orangeDark-link a {color: #da532c;}
.font-pink, .font-pink-link a {color: #9f00a7;}
.font-pinkDark, .font-pinkDark-link a {color: #7e3878;}
.font-purple, .font-purple-link a {color: #603cba;}
.font-darken, .font-darken-link a {color: #1d1d1d;}
.font-lighten, .font-lighten-link a {color: #d5e7ec;}
.font-white, .font-white-link a {color: #ffffff;}
.font-grayDark, .font-grayDark-link a {color: #525252;}
.bg-blue {background-color: #2d89ef;}
.bg-blueLight {background-color: #eff4ff;}
.bg-blueDark {background-color: #2b5797;}
.bg-green {background-color: #00a300;}
.bg-greenLight {background-color: #99b433;}
.bg-greenDark {background-color: #1e7145;}
.bg-red {background-color: #b91d47;}
.bg-yellow {background-color: #ffc40d;}
.bg-orange {background-color: #e3a21a;}
.bg-orangeDark {background-color: #da532c;}
.bg-pink {background-color: #9f00a7;}
.bg-pinkDark {background-color: #7e3878;}
.bg-purple {background-color: #603cba;}
.bg-darken {background-color: #1d1d1d;}
.bg-lighten {background-color: #d5e7ec;}
.bg-white {background-color: #ffffff;}
.bg-grayDark {background-color: #525252;}
Viele Grüße
Max
...auch eine nette Idee! Top !
Zitat von: setstate am 12 April 2015, 14:59:16
Grundsätzlich ja. Der timestamp wird intern schon gespeichert, muss nur ausgegeben werden. Kleine Änderung ...
Update. Die Änderung gibt es jetzt für das
Label Widget. -> Wenn man die CSS Klasse 'timestamp' hinzufügt, wird statt des Reading-Wertes, der Reading-Zeitstempel angezeigt.
Beispiel:
<div data-type="label"
data-device="THSensorWZ"
data-get="temperature"
class="timestamp darker">
</div>
Um nur die Uhrzeit und nicht das Datum anzuzeigen, kann man, wie beim Label Widget standardmässig,
data-part einsetzen, um nur bestimmte Teile anzuzeigen.
<div data-type="label"
data-device="THSensorWZ"
data-get="temperature"
data-part="2"
class="timestamp darker">
</div>
Oder per RegEx: Zeit ohne Sekunden
<div data-type="label"
data-device="THSensorWZ"
data-get="temperature"
data-part=".*(\d\d:\d\d):\d\d.*"
class="timestamp darker">
</div>
Frage an die JS-Experten!
Ich lasse mir in der battery.html den Status der Batterie von div. Geräten anzeigen. Daneben wird auch angezeigt, ob ein Gerät "alive" ist oder "dead". Es ist doch sicherlich möglich, wenn eins der Geräte
a) einen leeren Batteriestatus hat und / oder
b) eine Gerät nicht "alive" ist,
dass mir in meinem Menü auf der rechten-Seite (momentan orangenes-Symbol) dieses rot dargestellt wird, oder ?
Ins blaue gesprochen:
if data-get="battery" == "ok" then id="room_batterie" = <i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(RED);>
Zitatdata-type="symbol" data-device="Wohnzimmer.Wandthermostat"
data-get="battery"
data-icons='["fa-circle","fa-circle"]'
data-get-on='["ok","low"]'
data-on-colors='["green","red"]'
style="font-size:2em">
Zitat<a id="room_batterie" href="batterie.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,120);"></i>
<i id="fg" class="fa fa-stack-1x fa-bolt" style="color: rgb(255,255,255);"></i>
</a>
@nesges: Ich meine bei dir auch irgendwo mal ein Symbol in Form einer Batterie gesehen zu haben. In den aktuellen awesome Icon's ist das nicht enthalten, oder? Wo hast Du das her?
Zitat von: bjoernbo am 12 April 2015, 22:06:27
Frage an die JS-Experten!
Ich lasse mir in der battery.html den Status der Batterie von div. Geräten anzeigen. Daneben wird auch angezeigt, ob ein Gerät "alive" ist oder "dead". Es ist doch sicherlich möglich, wenn eins der Geräte
a) einen leeren Batteriestatus hat und / oder
b) eine Gerät nicht "alive" ist,
dass mir in meinem Menü auf der rechten-Seite (momentan orangenes-Symbol) dieses rot dargestellt wird, oder ?
Ins blaue gesprochen:
if data-get="battery" == "ok" then id="room_batterie" = <i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(RED);>
@nesges: Ich meine bei dir auch irgendwo mal ein Symbol in Form einer Batterie gesehen zu haben. In den aktuellen awesome Icon's ist das nicht enthalten, oder? Wo hast Du das her?
Du könntest die ganzen Batterien in eine STRUCTURE packen und deren Status entsprechend als Symbol-Link anzeigen lassen.
Zitat von: bjoernbo link=topic=34233.msg285222#msg285222
@nesges: Ich meine bei dir auch irgendwo mal ein Symbol in Form einer Batterie gesehen zu haben. In den aktuellen awesome Icon's ist das nicht enthalten, oder? Wo hast Du das her?
In system-options.php (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/screenshots/system-options.png) verwende ich fa-bolt für die Batterien; was besseres hab ich nicht entdeckt.
Zitat von: bmwfan am 12 April 2015, 19:23:02
@dj_sammy190:
Habe den Fehler in der Pushmessage gefunden. War Hochkomma zu viel. Es muss so aussehen (aus der DEF)
([20:00] and [?du_abfallkalender:state] ne "Nichts") (set Pushoveradresse1 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 '',set Pushoveradresse2 msg 'Müllabfuhr' 'Morgen wird [du_abfallkalender:state] geleert' '' 0 '')
so gehts bei mir.
Gruß Jürgen
Hatte ich gar nicht genutzt. Wollte nur die Anzeige. Hab sie nun in einem Button. Mal schauen ob das klappt.
Moin,
Hab mal ein paar Fragen:
1. Thema "Icons":
Ist es irgendwie möglich auch die Icons der Fhem Installation zu benutzen?
Diese sind nämlich gerade für die Hausautomatisierung sehr gut zu gebrauchen.
2. Thema "Menü":
Ich habe irgendwo was gelesen dass Tabs / Reiter geplant sind. Zu wann sind diese geplant? Dann würde ich mir nämlich die Umsetzung eines Menüs anhand von Buttons sparen.
3. Wird es eine Möglichkeit geben, mehrfach vorhandenen Code auszulagern und irgendwie zu inkludieren? Z.B. muss es das Menü in allen HTML-Seiten geben. (Eine Lösung mit php kenne ich (siehe nesges), wollte ich aber nicht verwenden)
Vielen Dank.
MfG
Daniel
@dancatt
Zu 1.: es ist nicht geplant, die FHEM icons als Button oder Symbol anzeigen zu können. Als Image kann man aber jetzt schon. Die Symbole passen meiner Meinung nach auch stilistisch, flächenmässig und linienbreitenmässig nicht zum Tablet UI. Andere Font Symbole ähnlich zumFA nehme ich gerne auf, die SVGs von FHEM aber nicht.
Zu 2 und 3.:Tab Widget ist mein nächster Task. Ich habe auch keinen Platz mehr bei mir und muss eine 2.Seite anfangen. Die Idee mit inkludes finde ich gut. Da kann man mit Platzhaltern und jQuery/Ajax was machen.
Zitat von: setstate am 13 April 2015, 08:26:30
Andere Font Symbole ähnlich zumFA nehme ich gerne auf, die SVGs von FHEM aber nicht.
Gibt es da schon was? Mir fehlen solche Icons wie Batterie, Räume (Bad, Wohnzimmer, ...) und und und.
Unter www.weloveiconfonts.com gibt es eine lange Liste mit "Anbietern".
Gesendet von meinem iPhone mit Tapatalk
Hallo setstate,
Zitat von: setstate am 12 April 2015, 18:22:58
Du kannst ja mal in der fhem-tablet-ui.js die Zeile 238 ändern, und schauen ob es dann besser ist und (ganz wichtig) alles andere auch noch funktioniert.
(Es ging darum, dass beim longpoll-Update <br>-Tags weggefiltert werden.)
Im Prinzip klappt es mit dieser Änderung. Allerdings wirkt sich das anscheinend auf data-fix aus, weil das anschließend nicht mehr klappt (also Werte werden trotz data-fix="1" mit mehreren Nachkommastellen ausgegeben).
So ganz verstehe ich den Zusammenhang nicht, aber Du ja vermutlich schon. Kann man es hinbekommen, dass beides funktioniert?
Die wären auch passend: http://map-icons.com
Oder hier auch eine Liste: http://speckyboy.com/2013/02/20/free-icon-Font-Sets
Es muss ein Free Symbol Font sein.
Zitat von: johannes1984 am 13 April 2015, 09:50:45
Unter www.weloveiconfonts.com gibt es eine lange Liste mit "Anbietern".
Gesendet von meinem iPhone mit Tapatalk
Vielen Dank, die sind alle auch sehr schön: sehr zeitgemäß, so wie ich es favoritisiere für dieses UI
Ich suche was raus, und binde sie zusätzlich ein
Ich kann die Beispiele aus dem ersten Post nicht vergrößern, liegt das an meinem Browser oder gehen die generel nicht?
Wäre super wenn man sich die Screenshots größer ansehen könnte.
Viele Grüße
Hallo,
ich probiere mich gerade mal ein wenig.
Ich habe die Widget_base wie folgt auf die größe meines Nexus 7 angepasst.
<meta name="widget_base_width" content="109">
<meta name="widget_base_height" content="100">
Nun habe ich das Problem das die Widgets der Thermostate wie im Screenshot zu sehen nicht mehr komplett angezeigt werden.
Kann mir da jemand helfen, wie ich das gelöst bekomme??
Viele Grüße
update über fhem gehr nicht:
UPD www/tablet/css/fhem-tablet-ui.css
Got 5013 bytes for www/tablet/css/fhem-tablet-ui.css, not 4938 as expected,
aborting.
Zitat von: setstate am 12 April 2015, 21:59:46
Update. Die Änderung gibt es jetzt für das Label Widget. -> Wenn man die CSS Klasse 'timestamp' hinzufügt, wird statt des Reading-Wertes, der Reading-Zeitstempel angezeigt.
Danke, das ging ja fix :)
An mehr Iconfonts (insbesondere für Räume, Badewanne, Dusche, ...) habe ich auch reges Interesse. Am Tab Widget für Unterseiten auch.
Klasse was hier entsteht. Zu so einer einfach zu konfigurierenden Oberfläche, die auch noch klasse aussieht, wollte ich immer hin.
lg
aeronaut
Zitat von: stromer-12 am 13 April 2015, 17:27:51
update über fhem gehr nicht:
UPD www/tablet/css/fhem-tablet-ui.css
Got 5013 bytes for www/tablet/css/fhem-tablet-ui.css, not 4938 as expected,
aborting.
ooh, sorry.
Hab's geändert.
Zitat von: Phil__ am 13 April 2015, 17:05:21
Hallo,
ich probiere mich gerade mal ein wenig.
Ich habe die Widget_base wie folgt auf die größe meines Nexus 7 angepasst.
<meta name="widget_base_width" content="109">
<meta name="widget_base_height" content="100">
Nun habe ich das Problem das die Widgets der Thermostate wie im Screenshot zu sehen nicht mehr komplett angezeigt werden.
Kann mir da jemand helfen, wie ich das gelöst bekomme??
Viele Grüße
Da muss man mit den Zahlen der Basis, aber auch mit der Anzahl der Zeilen und Spalten experimentieren. Also zuerst die Basis so groß, dass zumindest das größte Element (hier Thermostat) drauf passt und dann sehen, wie viel Zeilen aufs Tablet passen. Ich würde eher die Zeilen/Spalten-Basis etwas größer machen und dann am Ende eine Zeile weglassen
Zitat<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
Zitat von: SirMarco am 12 April 2015, 17:12:54
Danke für deine Hilfe. Habe die Version probiert, keine änderungen. nutze Firefox und Chrome. chrome android klappt auch nicht.
mensch was kann das nur sein
Mir ist auch nach ner Nacht drüber schlafen keine Idee gekommen, woran's liegen könnte. Ich strecke an dem Punkt offiziell die Waffen, sorry.
Danke erstmal!
Wenn ich mir unterhalb des Thermostat Widgts die Temperatur und Luftfeuchtigkeit anzeigen lasse (soweit kein Problem), gibt es dann eine einfache Möglichkeit Temperatur und Luftfeuchtigkeit in unterschiedlichten Farben in Abhängigkeit des Wertes anzeigen zu lassen?
Grüsse
ja, so etwa:
<div data-type="label" data-device="MyHeizung1"
data-get="measured-temp"
data-limits='[-73,10,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell bigger thin">
</div>
Zitat von: setstate am 13 April 2015, 19:57:46
ja, so etwa:
<div data-type="label" data-device="MyHeizung1"
data-get="measured-temp"
data-limits='[-73,10,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell bigger thin">
</div>
Super, Danke!
Zitat von: setstate am 11 April 2015, 16:16:14
Es muss ein Reading sein, was eine : (Doppelpunkt) separierte Liste liefert.
So ist es in der cfg:
Update Das Select Widget ist jetzt etwas flexibler geworden. Es kann jetzt auch die List-Item auch aus '
setList' beziehen.
Deshalb kann man ein Select Widget im einfachsten Fall so erzeugen.
<div data-type="select" data-device="dummy1" class="cell w2x" ></div>
Hier wird die state Liste aus setList geholt. Wenn man spezielle Readings per data-set hat, wird die entsprechende Liste aus setList gesucht.
noch eine Frage zum Update
habe nun ein update gemacht........
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
wie kann ich erkennen das mein update erfolgreich war, an den Datum und Uhrzeiten der Dateinen hat sich nicht geändert ??
Hallo hotwebnet,
je nach FHEM verbose level muss man während des Updates auch Events als Output oder im Logfile sehen. Am besten Verbose Level 4 setzen.
Ist meine Annahme richtig, dass das UI immer die Datei index.html als "Startseite" erwartet? Ich möchte für verschiedene Benutzer (bzw. etagenweise) Startseiten anlegen von denen jeweils zu anderen Seiten verzweigt wird. Und wenn alle immer von der gleichen Seite starten müsste wäre das ungeschickt.
Ist es auch möglich, Seiten mit Passwort zu schützen?
Zitat von: mw_fhem am 14 April 2015, 09:26:08
Ist meine Annahme richtig, dass das UI immer die Datei index.html als "Startseite" erwartet? Ich möchte für verschiedene Benutzer (bzw. etagenweise) Startseiten anlegen von denen jeweils zu anderen Seiten verzweigt wird. Und wenn alle immer von der gleichen Seite starten müsste wäre das ungeschickt.
Ist es auch möglich, Seiten mit Passwort zu schützen?
Du kannst auch eine horst.html anlegen, musst diese aber direkt (inkl. File ./fhem/tablet/horst.html) als Link speichern.
Es reicht dann nicht ./fhem/tablet
Links direkt auf dem UI kannst du mit dem Button Widget von nesges bauen. Ich bin gerade an einem Tab Widget dran, was mehrere Link Buttons als Inklude bietet. Das dauert wegen Grundlagenforschungen aber noch etwas. Passwort müsste man mal sehen, was da mit JavaScript geht, oder was FHEMs HTTPSRV kann, wenn du nicht PHP am Start hast.
Vielen Dank für die Info!
Ich habe jetzt schon das zweite Mal das Problem, dass mir Buttons und Infos verschwinden. Ich habe den tablet-Ordner gelöscht (weil ich was verkurbelt hatte) und per update all ... das UI neu installiert. Dann meine html-Datei zurück in das Verzeichnis kopiert. Und heraus kommen Widgets ohne Buttons, obwohl ich an der html-Datei nicht verändert habe.
Zitat von: mw_fhem
Ich habe jetzt schon das zweite Mal das Problem, dass mir Buttons und Infos verschwinden ... Und heraus kommen Widgets ohne Buttons, obwohl ich an der html-Datei nicht verändert habe.
Wie hast Du denn die Buttons eingefügt? Nicht, dass du vergessen hast die Farben in data-on-color zu ändern...
Jetzt war die Frage wieder weg :-)
Aber trotzdem die Info: Links zu anderen Seiten geht mit dem Button Widget
https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/README.md#button
Zitat von: mw_fhem am 14 April 2015, 11:20:32
Vielen Dank für die Info!
Ich habe jetzt schon das zweite Mal das Problem, dass mir Buttons und Infos verschwinden. Ich habe den tablet-Ordner gelöscht (weil ich was verkurbelt hatte) und per update all ... das UI neu installiert. Dann meine html-Datei zurück in das Verzeichnis kopiert. Und heraus kommen Widgets ohne Buttons, obwohl ich an der html-Datei nicht verändert habe.
Die zusätzlichen Widgets musst du noch reinkopieren, wenn verwendet
https://github.com/nesges/Widgets-for-fhem-tablet-ui
Entschuldigung für meine blöde Frage ;) Ich bin irgendwie davon ausgegangen, dass mit dem Update-Befehl auch die nesges-Widgets heruntergeladen werden. Vielleicht wäre das noch ein Feature!?
Zitat von: mw_fhem am 14 April 2015, 13:11:50
Vielleicht wäre das noch ein Feature!?
Im moment drück ich mich noch drum, aber ich sehe den Bedarf :)
Zitat von: nesges am 14 April 2015, 13:25:16
Im moment drück ich mich noch drum, aber ich sehe den Bedarf :)
Oder die stable Widgets kommen mit in den Standard Projekt Folder?! (Per pull request)
Zitat von: setstate am 14 April 2015, 13:31:20
Oder die stable Widgets kommen mit in den Standard Projekt Folder?! (Per pull request)
Wäre mir zwar recht, aber das könnte auf lange Sicht dazu führen, dass du ziemlich viele hochspezialisierte Widgets (zB kodinowplaying) im Projekt hast, die eigentlich nur eine handvoll Leute brauchen.
Warum drückst du dich? Deine Widgets braucht man doch 8)
Hallo setstate,
ich weiss die Frage wurde hier schonmal behandelt....
Aber ist es möglich das man im thermostat-Widget die Schrittweite auf 0.5 einstellen kann.
Also nicht das du das jetzt komplett änderst, aber könntest du mir erläutern ob ich das bei mir ändern könnte und wenn ja wie?
Viele Grüße
Phil__
das geht schon seit http://forum.fhem.de/index.php/topic,34233.msg278255.html#msg278255 (http://forum.fhem.de/index.php/topic,34233.msg278255.html#msg278255)
- **data-step** : step size for value adjustment e.g. 0.5 (default 1)
Zitat von: nesges am 14 April 2015, 13:49:36
Wäre mir zwar recht, aber das könnte auf lange Sicht dazu führen, dass du ziemlich viele hochspezialisierte Widgets (zB kodinowplaying) im Projekt hast, die eigentlich nur eine handvoll Leute brauchen.
Und? wer sie nicht braucht wird sie nicht nutzen, für alle anderen ist es eine erleichteung. die paar kb mehr laden wird heutzutage keinen mehr sdas leben schwer machen ;)
es ist so schon mehr aufwand als es sein müsste erstmal alles zusammen zu kopieren was man will/braucht (wenn man den per zufall mal auf die 2. quelle im forum stößt) und dann fhem , das standard projekt und ggf deine widget zu updaten (und dazu kommen noch module nicht eingechecked sind usw usw).
Wenn ich in einem Feld, 1 hoch 3 breit, Temperatur Luftfeuchtigkeit und Taupunkt als Label anzeigen möchte. Bekomme ich das nur "Linksbündig" hin, gibt es eine Möglichkeit die 3 Werte/Labels in dem 3 breiten Feld zu zentrieren?
Zitat von: Phil__ am 14 April 2015, 19:49:59
Wenn ich in einem Feld, 1 hoch 3 breit, Temperatur Luftfeuchtigkeit und Taupunkt als Label anzeigen möchte. Bekomme ich das nur "Linksbündig" hin, gibt es eine Möglichkeit die 3 Werte/Labels in dem 3 breiten Feld zu zentrieren?
<li data-row="1" data-col="2" data-sizex="3" data-sizey="1">
<header>DEMO</header>
<div class="cell">
<div data-type="label" data-device="THSensorWZ" data-get="temperature"
data-limits='[-73,19,23]' data-colors='["#6699FF","#aa6900","#bb6242"]'
data-unit="%B0C%0A" class="cell bigger thin">
</div>
<div data-type="label" data-device="THSensorWZ" data-fix="0"
data-part="4" data-limits='[0,40,60]'
data-colors='["#bb6242","#aa6900","#bb6242"]' data-unit="%" class="cell bigger thin">
</div>
</div>
</li>
Sorry, vllt habe ich mich missverständlich ausgedrückt. Ich meinte alle drei Werte nebeneinander und die drei dann zentriert oder gleichmäßig verteilt über das 3 breite Feld???
dann nur noch 'inline' zusätzlich rein.
Zitatclass="cell bigger thin inline"
<li data-row="1" data-col="2" data-sizex="3" data-sizey="1">
<header>DEMO</header>
<div class="cell">
<div data-type="label" class="inline">Temp: </div>
<div data-type="label" data-device="THSensorWZ"
data-get="temperature" data-limits='[-73,19,23]'
data-colors='["#6699FF","#aa6900","#bb6242"]'
data-unit="%B0C%0A"
class="cell bigger thin inline"></div>
<div data-type="label" class="inline">Hum: </div>
<div data-type="label" data-device="THSensorWZ"
data-fix="0" data-part="4"
data-limits='[0,40,60]' data-colors='["#bb6242","#aa6900","#bb6242"]'
data-unit="%"
class="cell bigger thin inline">
</div>
</div>
</li>
Man kann auch das 'cell' bei den großen Zahlen weglassen, dann wird nicht vertical zentriert .
class="bigger thin inline"
Laut Post 1 soll ja das Update in Fhem mit
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
funktionieren , bei mir kommt als Ausgabe :
Events (Filter:global):
2015-04-14 20:49:20 Global global UPD www/tablet/css/fhem-tablet-ui.css
2015-04-14 20:49:21 Global global open ./www/tablet/css/fhem-tablet-ui.css failed: Permission denied, trying to restore the previous version and aborting the update
Da bei der Erstinstallation Benutzer Pi als "Standart" eingerichtet wurde und kein root weiß ich im Moment nicht was ich wo ändern muss.
Wer weiß mehr ??
PS: Tolle Community !!!!!
Fhem hat keine Zugriffsrechte auf die Dateien.
In der Linux Shell:
In das in das Verzeichnis .../fhem/www wechseln
Dann
chown -R fhem:root tablet
Oder du löschst alles unter www/tablet/ weg.
Wenn du Änderungen gemacht hast, z.B. an der index.hmtl, diese vorher wegkopieren.
Und machst dann ein update.
Das Problem hatte ich auch dieser Tage als ich update das erste mal nutze. wollte er bei mir widget_select öffnen.
Ich hatte dann das tablet-Verzeichnis geleert und der erneute update Aufruf klappte dann auch.
Ich habe an meinem TabUI weiter gearbeitet und eine weitere Seite erstellt, die ich hier gerne vorstellen möchte. Hierbei handelt es sich um eine Seite, auf der meinei Sonos Player und die TV Anlage gesteuert werden können. Bei der Steuerung der TV Anlage handelt es sich aber nur um das ein- und ausschalten sowie den Aufruf von Aktionen mittels Harmony Hub und natürlich einer Lautstärkeregelung.
Bei den Sonosgeräten habe ich die neue Listenfunktion (select) genutzt und steuere darüber den Start meiner Playlisten, die im Sonos gespeichert sind. Hierbei habe ich einen Dummy genutzt, was aber auch zu Problemen führt. Da hier kein "get" für Dummys zur Verfügung steht wird die ausgewählte Liste nicht mehr angezeigt und auch beim "set" hatte ich ein paar Probleme, da ich eigentlich ein setreading gebraucht hätte. Die aktuelle Lösung funktioniert aber.
Hier nun der entsprechende Code:
Erst einmal eine einfache Dummy Definition:
define duSonosPlaylists
Ein notify, damit nach der Auswahl einer Playlist der Player direkt gestartet wird:
define notSonosPLaylist notify duSonosPlaylists {SonosPlaylistStarten($EVENT)}
Zur Ermittlung der aktuellen Playlisten kann man regelmäßig folgende Funktion aufrufen, die in myutils99 eingefügt werden muss:
#aktuelle Playlist ermitteln und im Dummy als Liste speichern
sub MeinePlayList()
{
#Buero ist am Rooter und immer an, daher Playlist hier ermitteln
fhem("get Sonos_Buero Playlists; sleep 2;");
my $Playlist = ReadingsVal("Sonos_Buero", "LastActionResult", "Keine");
my @Playlists = split('GetPlaylists: ', $Playlist);
#zusätzllich noch unseren einzigen Radiosender dazu packen
my $playlistneu = '"SWR3 Elchradio",'.$Playlists[1];
#playlist für TABUI select aufbereiten
$playlistneu =~ s/,/:/g;
fhem("setreading duSonosPlaylists Playlist ".$playlistneu);
}
Die Sleep Aktion habe ich bei mir eingebaut, da die Liste manchmal nicht richtig gefüllt wird und ich nicht sicher bin, ob das vielleicht an meinem neuen schnellen raspi2 liegt. Hier habe ich vermutet, dass die Perl Ausführung schon weiter läuft während die Sonos-Funktionen zum Abruf der Listen noch nicht ganz fertig ist. Vielleicht hat ja jemand eine Idee, ob die Annahme richtig ist.
Nun gibt es noch eine Funktion zum Abspielen (immer mit der Sonderbehandlung für unseren einzigen Radiosender):
sub SonosPlaylistStarten($)
{
my ($Playlist) = @_;
my @player = split(' ',$Playlist);
my @Liste = split($player[0]." ", $Playlist);
#List für Sonos aufbereiten und Leerzeichen maskieren
$Liste[1] =~ s/ /%20/g;
if($Playlist =~ /SWR3/)
{
fhem("set $player[0] StartRadio $Liste[1]");
}
else
{
fhem("set $player[0] StartPlaylist $Liste[1]");
}
}
Schließlich folgt noch der eigentliche Coder für das TabUI:
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2">
<header>MultiMedia</header>
<div data-type="switch" data-device="wz_MultiMedia" data-get-on="an" data-get-off="aus" data-icon="fa-power-off" class="cell bigger"></div>
<div data-type="push" data-device="Sonos_Wohnzimmer" data-set="mute" data-get="mute" data-icon="fa-volume-off" class="cell bigger"></div>
</li>
<li data-row="1" data-col="3" data-sizex="4" data-sizey="2">
<header>Sonos Wohnzimmer</header>
<div class="container left wider" style="max-width:16em;">
<div data-type="image" data-device="Sonos_Wohnzimmer" data-get="currentAlbumArtURL" data-size="40%"></div>
<div data-type="label" data-device="Sonos_Wohnzimmer" data-get="infoSummarize2"></div>
<div data-type="select" data-device="duSonosPlaylists" data-list="Playlist" data-set="Sonos_Wohnzimmer" "class="wider"></div>
</div>
<div class="container inline wider">
<div class="left">
<div data-type="push" data-device="Sonos_Wohnzimmer" data-set="PLAY" data-icon="fa-play" class="cell bigger"></div><p></p>
<div data-type="push" data-device="Sonos_Wohnzimmer" data-set="PAUSE" data-icon="fa-pause" class="cell bigger"></div><p></p>
</div>
<div class="right">
<div data-type="volume" data-device="Sonos_Wohnzimmer" data-get="Volume" data-set="Volume" data-min="0" data-max="30" class=""></div>
<div data-type="label" data-device="Sonos_Wohnzimmer" data-get="transportState"></div>
</div>
</div>
<div>
</li>
<li data-row="1" data-col="7" data-sizex="4" data-sizey="2">
<header>Sonos Küche</header>
<div class="container left wider" style="max-width:16em;">
<div data-type="image" data-device="Sonos_Kueche" data-get="currentAlbumArtURL" data-size="40%"></div>
<div data-type="label" data-device="Sonos_Kueche" data-get="infoSummarize2"></div>
<div data-type="select" data-device="duSonosPlaylists" data-list="Playlist" data-set="Sonos_Kueche" "class="wider"></div>
</div>
<div class="container inline wider">
<div class="left">
<div data-type="push" data-device="Sonos_Kueche" data-set="PLAY" data-icon="fa-play" class="cell bigger"></div><p></p>
<div data-type="push" data-device="Sonos_Kueche" data-set="PAUSE" data-icon="fa-pause" class="cell bigger"></div><p></p>
</div>
<div class="right">
<div data-type="volume" data-device="Sonos_Kueche" data-get="Volume" data-set="Volume" data-min="0" data-max="30" class=""></div>
<div data-type="label" data-device="Sonos_Kueche" data-get="transportState"></div>
</div>
</div>
<div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="2">
<header>MultiMedia</header>
<div data-type="volume" data-device="wzOnkyo" data-get="volume" data-set="volume" data-min="0" data-max="30" class="wider"></div>
<div data-type="select" data-device="WohnzimmerHub" data-items='["Fernsehen","Musik.hören","TV.PC","SWR3","Chromecast"]' data-get="activity" data-set="activity" class=""></div>
</li>
<li data-row="3" data-col="3" data-sizex="4" data-sizey="2">
<header>Sonos Büro</header>
<div class="container left wider" style="max-width:16em;">
<div data-type="image" data-device="Sonos_Buero" data-get="currentAlbumArtURL" data-size="40%"></div>
<div data-type="label" data-device="Sonos_Buero" data-get="infoSummarize2"></div>
<div data-type="select" data-device="duSonosPlaylists" data-list="Playlist" data-set="Sonos_Buero" "class="wider"></div>
</div>
<div class="container inline wider">
<div class="left">
<div data-type="push" data-device="Sonos_Buero" data-set="PLAY" data-icon="fa-play" class="cell bigger"></div><p></p>
<div data-type="push" data-device="Sonos_Buero" data-set="PAUSE" data-icon="fa-pause" class="cell bigger"></div><p></p>
</div>
<div class="right">
<div data-type="volume" data-device="Sonos_Buero" data-get="Volume" data-set="Volume" data-min="0" data-max="30" class=""></div>
<div data-type="label" data-device="Sonos_Buero" data-get="transportState"></div>
</div>
</div>
<div>
</li>
<li data-row="3" data-col="7" data-sizex="4" data-sizey="2">
<header>Sonos Bad</header>
<div class="container left wider" style="max-width:16em;">
<div data-type="image" data-device="Sonos_Bad" data-get="currentAlbumArtURL" data-size="40%"></div>
<div data-type="label" data-device="Sonos_Bad" data-get="infoSummarize2"></div>
<div data-type="select" data-device="duSonosPlaylists" data-list="Playlist" data-set="Sonos_Bad" "class="wider"></div>
</div>
<div class="container inline wider">
<div class="left">
<div data-type="push" data-device="Sonos_Bad" data-set="PLAY" data-icon="fa-play" class="cell bigger"></div><p></p>
<div data-type="push" data-device="Sonos_Bad" data-set="PAUSE" data-icon="fa-pause" class="cell bigger"></div><p></p>
</div>
<div class="right">
<div data-type="volume" data-device="Sonos_Bad" data-get="Volume" data-set="Volume" data-min="0" data-max="30" class=""></div>
<div data-type="label" data-device="Sonos_Bad" data-get="transportState"></div>
</div>
</div>
<div>
</li>
So, dann wünsche ich viel Spaß damit und hoffe weitere Anregungen auch für andere Lösungen damit bereit gestellt zu haben.
Hallo jual,
toll was du gezaubert hast und hier auch so ausführlich erklärst!!!
Ich hoffe, ich darf den Code auch bei Github als Example zentral für alle ablegen ...
Aber setreadings geht auch zu machen: mit data-cmd
data-cmd steht default auf set wenn man es nicht explizit angibt. Man kann es aber auch überschreiben mit data-cmd="setreading" oder data-cmd="trigger"
Danke für den Hinweis zu data-cmd. Den Test damit hatte ich irgendwie völlig vergessen und mir war aus der ersten "Doku" zu select nicht ganz klar, dass die auch für select funktioniert.
Natürlich kannst du den Code gerne als Beispiel verwenden.
Zitat von: jual am 14 April 2015, 21:18:43
Hierbei handelt es sich um eine Seite, auf der meinei Sonos Player und die TV Anlage gesteuert werden können.
Ich frage mich nur, was ist die "Playliste Nachbarn"?
Death Metal in voller Lautstärke? ;D
Hallo ,
ich bekomme einfach die Anordnung nicht in einer Reihe
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>Anwesend</header>
<div class="container">
<div class="left">
<div data-type="symbol" data-device="Rosi"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Rosi</div>
</div>
<div class="center">
<div data-type="symbol" data-device="Alina"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Alina</div>
</div>
<div class="right">
<div data-type="symbol" data-device="Wolf"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Wolf</div>
</div>
</div>
</li>
Hallo sky.
Zur Info: Es gibt keine Klasse 'center' und center geht auch nicht mit float.
Versuch's damit:
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>Anwesend</header>
<div class="container inline">
<div data-type="symbol" data-device="Rosi"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Rosi</div>
</div>
<div class="container inline">
<div data-type="symbol" data-device="Alina"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Alina</div>
</div>
<div class="container inline">
<div data-type="symbol" data-device="Wolf"
data-icon="fa-user"
data-on-color="orange"
data-get-on="present"
data-get-off="absent"
class="narrow"></div>
<div data-type="label" class="narrow darker small">Wolf</div>
</div>
</li>
Class 'center' gibt es nicht im css file. Du kannst aber auch drei Mal 'left' benutzen, dann hängen alle hintereinander.
Oder auch nur 'cell' müsste gehen.
Danke,
werde es heute Abend ausprobieren
Hallo,
1.)
Gibt es nur die Font Awesome Icons oder auch andere?
Bzw. wie kann man weitere Icons nutzen?
2.) Kann ich einen Text/label durch ein beliebiges Bild ersetzen. Denke da bei den Benzinpreisen den Namen "Shell" durch das Shell logo zu ersetzen?
Viele Grüße
Hallo Phil__,
Zu1.: weitere IconFont sind in Planung. Ich weiß nur noch nicht genau welcher die meisten sinnvollen Erweiterungen bringt. Hier gibt es einige interessante: http://www.weloveiconfonts.com
Zu2.: Schau mal in der Readme bei Image Widget, damit kann man Bilder oder Icons anzeigen lassen.
@jual,
Bei deiner Sonos Seite sind mir die Anzeigen für die aktuellen Titel noch aufgefallen. Willst du die noch anderes machen? Den Status braucht man ja nicht in dieser Zeile. Man könnte da mit RegEx arbeiten und nur den interessanten Teil für die Anzeige rausfiltern.
Als erstes muss ich echt sagen, das ist die Interfacelösung die FHEM fehlte. Geniale Arbeit!
@setstate
Wie wäre es wenn man mit https://icomoon.io/app/ per Upload aus den ganzen bereits in FHEM vorhandenen SVGs (openautomation, fhemSVG) einfach einen eigenen Font baut und diesen einbindet? Dadurch sollten doch etliche Iconwünsche erschlagen werden.
Zitat von: Wegwerf am 15 April 2015, 15:44:11
Als erstes muss ich echt sagen, das ist die Interfacelösung die FHEM fehlte. Geniale Arbeit!
@setstate
Wie wäre es wenn man mit https://icomoon.io/app/ per Upload aus den ganzen bereits in FHEM vorhandenen SVGs (openautomation, fhemSVG) einfach einen eigenen Font baut und diesen einbindet? Dadurch sollten doch etliche Iconwünsche erschlagen werden.
Genau das war auch mein Gedanke!
Denn bis jetzt vermisse ich so ziemlich alle Icons der Typischen Hausautomation die in Fhem (Fhem, Openautomation) vorhanden sind!
@setstate: Das ist wirklich das genialsten Fhem Frontend und es ermöglicht unendlich Möglichkeiten!
Ist das mit den Icons umsetzbar?
Grüsse
Hallo ihr Icon-Sucher.
Technisch ist das bestimmt machbar und vllt. findet sich auch jemand der einige SVG Images konvertiert, aber ich habe definitiv keine Zeit dazu, bzw. ich möchte mir die Zeit dazu nicht nehmen, da ich definitiv nicht vorhabe, diese infantilen Strichzeichnungen auf meinen Wandtablet zu nutzen . (Sorry für meine harsche Antwort, aber bei mir zieht sich da immer irgendein Geschmacksnerv zusammen) ;) Oder von welchen Icons sprecht ihr? Diese hier, die man links sieht? http://fhem.de/SmartVisu.png
Die fertigen free IcoMoon Icons, die ich gesehen habe, kann ich gerne einbinden, die passen besser vom Stil her. Ich glaube auch nicht, dass jeder Raum sein detailiertes, determiniertes Symbol braucht. Minimalistisch abstrakt ist öfters übersichtlicher. Fertige Fonts binde ich aber gerne noch ein, wenn sie als Icon Font vorliegen, das ist schnell gemacht.
anbei das openautomation font-pakage. classprefix ist "oa-" gewählt
ich hoffe es ist alles richtig
und fhem svg
classprefix ist "fs-" gewählt
Zitat von: chris1284 am 15 April 2015, 19:14:43
anbei das openautomation font-pakage. classprefix ist "oa-" gewählt
ich hoffe es ist alles richtig
;D ;D ;D Vielen Dank, chris1284 fürs Bauen!
Geht, und nicht sooooo schlecht (das erste Icon).
Ich packe die Files dann mit rein und gebe später noch Beispiele.
Hallo,
ich bräuchte da nochmal eure Hilfe! ::)
Ich möchte über ein iframe einen Plot des Spritpreisverlaufes einbinden. Ich habe einen SVG Plot und einen weblink erzeugt, mir ist nur nicht ganz klar woher ich jetzt einen link (https://ip:8083/fhem...????)zu dem Plot bekomme??
Weiss da jemand weiter?
define SVG_FileLog_Spritpreise_1 SVG FileLog_Spritpreise:SVG_FileLog_Spritpreise_1:CURRENT
attr SVG_FileLog_Spritpreise_1 group Spritpreisverlauf
attr SVG_FileLog_Spritpreise_1 plotsize 630,160
attr SVG_FileLog_Spritpreise_1 room Spritpreise
define wlspritpreise weblink fileplot FileLog_Spritpreise:SVG_FileLog_Spritpreise_1:CURRENT
attr wlspritpreise title "Spritpreise"
attr wlspritpreise room Spritpreise
Zitat von: Phil__ am 15 April 2015, 19:59:05
Ich möchte über ein iframe einen Plot des Spritpreisverlaufes einbinden. Ich habe einen SVG Plot und einen weblink erzeugt, mir ist nur nicht ganz klar woher ich jetzt einen link (https://ip:8083/fhem...????)zu dem Plot bekomme??
Die Bild-URLs der SVG-Plots sehen folgendermassen aus:
http://wopr/fhem/SVG_showLog?dev=SVG_DbLog_B_HEIZUNG_1&logdev=DBLOG1&gplotfile=SVG_DBLOG_B_HEIZUNG_1&logfile=CURRENT
http://wopr/fhem/SVG_showLog?dev=<PLOT>&logdev=<LOGDEVICE>&gplotfile=<GPLOT>&logfile=CURRENT
Zitat von: nesges am 15 April 2015, 20:12:43
Die Bild-URLs der SVG-Plots sehen folgendermassen aus:
http://wopr/fhem/SVG_showLog?dev=SVG_DbLog_B_HEIZUNG_1&logdev=DBLOG1&gplotfile=SVG_DBLOG_B_HEIZUNG_1&logfile=CURRENT
http://wopr/fhem/SVG_showLog?dev=<PLOT>&logdev=<LOGDEVICE>&gplotfile=<GPLOT>&logfile=CURRENT
super Danke!
Habe es gerade gefunden, über firefox den Seitenquelltext anzeigen lassen und url kopiert!
Hilfe ......
Da ich immer wieder Probleme mit Dateien in WinSCP kopieren und hinzufügen hatte , musste ich über Putty Rechte ändern oder hinzufügen.
Ein Freund berichtete mir ,das er dies in dieser Konstellation nicht bräucht .
Ergo ... habe mein System komplett neu aufgespielt ( kein Image) nach Anleitung auf http://www.meintechblog.de/2013/05/fhem-server-auf-dem-raspberry-pi-in-einer-stunde-einrichten/
Alles ok ,wie immer :D
ABER !!!
Bei diesem Schritt aus diesem Forum ...........
Post 1 INSTALLATION
Zitat :
Oder von Hand:
Dateien herunterladen: Zip
alle Dateien gemäß der Ordnernamen auf den FHEM Server kopieren /<fhem-Pfad>/www/tablet/*
kommen wieder die Probleme das ich keine Rechte habe :
Erlaubnis verweigert.
Fehlercode: 3
Fehlernachricht vom Server : Permission denied
Ich bin ja nicht "unbeholfen", aber das ist mir zu hoch ,da es bei meinem Freund ohne dieses Problem geht .
Ich weiß das der User Pi nicht die gleichen Rechte hat wie der root , aber muss ich immer wenns notwendig wird, die Rechte unbedingt ändern ??
Auch wenns nicht unbedingt zum Tablet UI gehört ,finde ich die Hilfe hier großartig !!!!
Die notwendigen Openautomation Font-Files sind nun mit hochgeladen.
Wer sie nutzen möchte, muss folgende Stylesheets in die index.html hinzufügen.
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
Und so nutzt man sie bei einem Schalter
<div data-type="switch" data-device='dummy1' data-icon="oa-secur_locked"></div>
Und so als großes Symbol
<div data-type="symbol" data-device='dummy1'
data-icon="oa-status_frost"
data-on-color="#bb3232"
data-get-on="on"
data-get-off="!on"
class="bigger">
</div>
Die Icons kann man auch etwas dicker darstellen mit den Zusatz bold:
data-icon="oa-secur_locked bold"
Die Namen der verfügbaren Icons findet man auch in den CSS Files (openautomation.css / fhemSVG.css)
danke setstate für die schnelle umsetzung. ein tip noch: wer die zip-files runterlädt und sie entpackt findet eine demo.html
damit kann man sich die symbole + namen nochmal als kleine vorschau ansehen
Zitat von: chris1284 am 16 April 2015, 06:44:51
danke setstate für die schnelle umsetzung. ein tip noch: wer die zip-files runterlädt und sie entpackt findet eine demo.html
damit kann man sich die symbole + namen nochmal als kleine vorschau ansehen
Wo genau findest du die demo.html?
In diesem Zip kann ich sie nicht finden:
https://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui)
gemeint sind die Zips in den Postings von chris1284, dort sind demos für die Icons
http://forum.fhem.de/index.php/topic,34233.msg286248.html#msg286248
Zitat von: setstate am 16 April 2015, 07:12:40
gemeint sind die Zips in den Postings von chris1284, dort sind demos für die Icons
http://forum.fhem.de/index.php/topic,34233.msg286248.html#msg286248
merci
Zitat von: Sky am 15 April 2015, 21:30:09
Hilfe ......
Erlaubnis verweigert.
Fehlercode: 3
Fehlernachricht vom Server : Permission denied
Hallo Sky,
mit welchem User nutzt du zur Verbindung mit FHEM unter WinSCP? Das sollte der gleiche sein, unter dem auch FHEM läuft. Versuche root so weit wie möglich zu vermeiden. Oder nutzte nur root für alles und jeden Prozess, so wie ich (SOLLTE MAN AUS SICHERHEITGRÜNDEN KEINENSFALLS TUN! ;D )
Echt klasse wie schnell die Implementierung hier von statten geht.
Ich habe mir mal die Fonts angeschaut und bemerkt dass bei der Erstellung der Font und CSS Dateien sich ein Fehler eingeschlichen hat.
Dadurch sind nicht alle SVGs importiert worden.
Bin mir auch ziemlich sicher woher der Fehler kommt, das müsste ein Bug in IcoMoon sein.
Sobald eine andere Datei, (in diesem Fall höchstwahrscheinlich die *.txt) die nicht von IcoMoon als Fontvorlage unterstützt wird, vorkommt, bricht das Programm den Import ab und importiert den Rest nicht mehr.
Die Zips sollten nun vollständig sein. Die Präfixe habe ich bei oa- und fs- gelassen. Ich hoffe der Rest passt.
Danke für die Antwort , aber genau das ist das Problem !
Alles habe ich von der Einrichtung bis WinSCP unter dem Standart- User Pi gemacht .
Ich habe nie Root benutzt . Wenn es Rechte- Probleme gab habe ich diese über Putty geändert .
Aber nach Angaben meines Freundes muss es auch ohne Rechte ändern Problemlos gehen .
Ich weiß nicht wo "der Hase im Pfeffer liegt"
UND DAS ÄRGERT MICH ;)
Was sagt ls -l für das übergeordnete Verzeichnis und die einzelnen Files ?
Vergleiche mal die rwx-Werte für owner, group und world mit Ordner, die funktionieren.
Du kannst Files auch als Zip hochladen und dann per Putty auspacken und an die richtige Stelle kopieren.
Aber bevor du verzweifelst, nutze lieber das Update Command im FHEMWEB, um das Tablet UI zu installieren
Hallo Zusammen,
wie schaffe ich es eigentlich, dass ein Switch mit Label und ein Contact mit Label in einer Zeile (data-sizex="5") mittig angezeigt werden? Ich muss ja mit class="left", class="right" bzw. class="cell" arbeiten. Wenn ich gar nichts angebe, dann erscheinen die Symbole untereinander. Verwende ich aber left oder right, dann erscheinen die Symbole ganz links oder ganz rechts. Aber ich hätte sie eben gerne links bzw. rechts von der Mitte.
Geht das irgendwie?
Zitat von: jsloot am 16 April 2015, 11:29:47
Hallo Zusammen,
wie schaffe ich es eigentlich, dass ein Switch mit Label und ein Contact mit Label in einer Zeile (data-sizex="5") mittig angezeigt werden? Ich muss ja mit class="left", class="right" bzw. class="cell" arbeiten. Wenn ich gar nichts angebe, dann erscheinen die Symbole untereinander. Verwende ich aber left oder right, dann erscheinen die Symbole ganz links oder ganz rechts. Aber ich hätte sie eben gerne links bzw. rechts von der Mitte.
Geht das irgendwie?
Hallo jsloot,
Ohne das ganze überprüfen zu können sollte es theoretisch so gehen
Verschachtelt:
<div class="cell inline">
<div class="cell">
<div></div>
<div></div>
</div>
<div class="cell">
<div></div>
<div></div>
</div>
</div>
Zitat von: setstate am 16 April 2015, 09:53:04
Was sagt ls -l für das übergeordnete Verzeichnis und die einzelnen Files ?
Was meinst Du mit ls -l ??
Zitat von: Sky am 16 April 2015, 12:00:29
Zitat von: setstate am 16 April 2015, 09:53:04
Was sagt ls -l für das übergeordnete Verzeichnis und die einzelnen Files ?
Was meinst Du mit ls -l ??
Mit Putty im Linux die Fileliste mit den gesetzten Rechten anzeigen lassen
Das geht mit dem Command ls
Und ls mit Paramter -l (wie long) zeigt auch die Gruppenmitgliedschaft und die Rechte mit an
http://www.linux-fuer-alle.de/doc_show.php?docid=17&catid=8
Ein Dickes Dankeschön :) :)
Weiss jemand wie ich einen Link/Externe Seite einbinde?
So gehts nicht:
<li data-row="2" data-col="2" data-sizex="5" data-sizey="4">
<header>Unwetterwarnungen</header>
<div class="cell">
<iframe id="aussen_iframe" src="http://www.dwd.de/dyn/app/ws/html/reports/FXX_warning_de.html" width='680' height='553' scrolling='auto' allowtransparency='true' frameborder='0'></iframe>
</div>
</li>
Es steht im Dashboard dann: "No HTTPSRV device for /tablet"
Grüße
Zitat von: jsloot am 16 April 2015, 11:29:47
wie schaffe ich es eigentlich, dass ein Switch mit Label und ein Contact mit Label in einer Zeile (data-sizex="5") mittig angezeigt werden?
Ich verwende dafür
.centered {
margin-left:auto;
margin-right:auto;
display:table;
}In einem übergeordneten Container.
Vielen Dank für die Hilfestellungen, aber ich mache wohl irgendwas falsch... bin jetzt auch nicht der html-Guru...
Mein Code sieht wie folgt aus:
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="5" data-sizey="1">
<header>Ready to go?</header>
<div class="centered">
<div data-type="switch" data-device="Alle_Lichter" class=""></div>
<div data-type="label" class="small narrow darker">Alle Lichter</div>
<div data-type="contact" data-device="Alle_Fenster" class=""></div>
<div data-type="label" class="small narrow darker">Alle Fenster</div>
</div>
</li>
Und ich habe das
.centered {
margin-left:auto;
margin-right:auto;
display:table;
}
in die css/fhem-tablet-ui.css gepackt.
Gruß, der Sloot
Und erzeugt das das Gewünschte?
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="5" data-sizey="1">
<header>Ready to go?</header>
<div class="centered inline">
<div class="cell">
<div data-type="switch" data-device="Alle_Lichter" class=""></div>
<div data-type="label" class="small narrow darker">Alle Lichter</div>
</div>
<div class="cell">
<div data-type="contact" data-device="Alle_Fenster" class=""></div>
<div data-type="label" class="small narrow darker">Alle Fenster</div>
</div>
</div>
</li>
Leider nein :(
Schade, war auch ungetestet. Ich probiere es dann mal bei mir, wenn ich zuhause bin.
Ich danke dir!!!
so gehts
<li data-row="1" data-col="1" data-sizex="5" data-sizey="1">
<header>Ready to go?</header>
<div class="top-space">
<div class="inline">
<div data-type="switch" data-device="Alle_Lichter" class=""></div>
<div data-type="label" class="small darker">Alle Lichter</div>
</div>
<div class="inline">
<div data-type="contact" data-device="Alle_Fenster" class=""></div>
<div data-type="label" class="small darker">Alle Fenster</div>
</div>
</div>
</li>
extra CSS
.top-space{
margin-top: 15px !important;
}
Super!!! Vielen Dank!!
Oder so:
<div class="cell">
<div class="inline">
<div data-type="switch" data-device="Alle_Lichter" class="cell"></div>
<div data-type="label" class="small darker">Alle Lichter</div>
</div>
<div class="inline">
<div data-type="contact" data-device="Alle_Fenster" class="cell"></div>
<div data-type="label" class="small darker">Alle Fenster</div>
</div>
</div>
Ich nochmal...
Der Dimmer wird bei mir so seltsam angezeigt... liegt das an mir?
Gruß, der Sloot
Zitat von: jsloot am 16 April 2015, 17:15:40
Vielen Dank für die Hilfestellungen, aber ich mache wohl irgendwas falsch... bin jetzt auch nicht der html-Guru...
Habt's ja mittlerweile gelöst :) Der Vollständigkeit halber ein weiterer Weg nach Rom:
<div class="centered">
<div class="left">
<div data-type="switch" data-device="Alle_Lichter" class=""></div>
<div data-type="label" class="small narrow darker">Alle Lichter</div>
</div>
<div class="left">
<div data-type="contact" data-device="Alle_Fenster" class=""></div>
<div data-type="label" class="small narrow darker">Alle Fenster</div>
</div>
</div>
Zitat von: jsloot am 16 April 2015, 19:55:47
Ich nochmal...
Der Dimmer wird bei mir so seltsam angezeigt... liegt das an mir?
Gruß, der Sloot
hast du beim Label 'narrow' in class mit drin? Das würde das Label näher ran rücken.
Und nach unten ist genügend Platz?
ggf. den Code-Teil mal schicken, wenn trotzdem nicht klappt ...
Hi, ein riesen Lob für das geile Projekt.
Ich bin völlig begeistert ;D und versuche natürlich direkt mal eine Info Seite für mein Tablet zu erstellen.
Da kommt dann schon die erste Frage, dessen Antwort ich leider alleine nicht finden kann.
Ich möchte den "slider" kleiner gestaltet, leider scheint "mini" noch nicht zu funktionieren.
Kann ich in einer der css Dateien, die Höhe vielleicht selber anpassen?
Kann mir jemand weiter helfen?
Gruß
Adam
Zitat von: Adam am 16 April 2015, 20:36:22
Hi, ein riesen Lob für das geile Projekt.
Ich bin völlig begeistert ;D und versuche natürlich direkt mal eine Info Seite für mein Tablet zu erstellen.
Da kommt dann schon die erste Frage, dessen Antwort ich leider alleine nicht finden kann.
Ich möchte den "slider" kleiner gestaltet, leider scheint "mini" noch nicht zu funktionieren.
Kann ich in einer der css Dateien, die Höhe vielleicht selber anpassen?
Kann mir jemand weiter helfen?
Gruß
Adam
Mini wird es mit dem nächsten Update geben (heute oder spätestens morgen)
Ich weiß, blinkende Schrift auf Webseiten ist seit den 80ern verpönt. Aber es gibt bestimmte Informationen, die ich auf keinen Fall übersehen möchte, wenn sie auftauchen. Deshalb habe ich einen Weg gesucht, ein Label bei Bedarf blinken zu lassen, und zwar auf allen Geräten, auf denen ich die Tablet UI verwenden möchte. Falls es mal jemand braucht, so gehts:
.blink {
text-decoration:blink;
-webkit-animation-name:blinker;
animation-name:blinker;
-webkit-animation-iteration-count:infinite;
animation-iteration-count:infinite;
-webkit-animation-timing-function:cubic-bezier(1.0,0,0,1.0);
animation-timing-function:cubic-bezier(1.0,0,0,1.0);
-webkit-animation-duration:2s;
animation-duration:2s;
}
@-webkit-keyframes blinker { from {opacity:1.0;} to {opacity:0.0;} }
@keyframes blinker { from {opacity:1.0;} to {opacity:0.0;} }
Mit dem duration-Wert kann man den Intervall verändern.
(Dass alles doppelt zu sein scheint, ist gewollt. Die webkit-Angaben sind für Chrome, die anderen für Firefox.)
Am Besten in eine eigene CSS-Datei und die dann zusätzlich zur fhem-tablet-ui.css einbinden, damit es nicht durch ein Update überschrieben wird, etwa so:
<link rel="stylesheet" href="/fhem/tablet/css/my-fhem-tablet-ui.css" />
Dann kann mal das blink mit in die class-Angabe eines Elements einfügen.
Erfolgreich getestet am PC mit Firefox und Chrome sowie unter Android mit Chrome und WebViewControl.
Zitat von: Brockmann am 16 April 2015, 21:17:59
Ich weiß, blinkende Schrift auf Webseiten ist seit den 80ern verpönt. Aber es gibt bestimmte Informationen, die ich auf ...
Hallo Brockmann,
vielen Dank für deine Mühe, aber das geht mit den fa-blink und blink Klassen schon :-)
http://forum.fhem.de/index.php/topic,34233.msg283489/topicseen.html#msg283489
Ich muss unbedingt die Readme daraufhin updaten.
Update - Version 1.4 - Schnelleres Laden der Seite
Ab sofort gibt es die Version 1.4, die eine Optimierung beim ersten Start mitbringt. Damit werden die Widgets schneller angezeigt und aktualisiert.
- Slider Widget versteht jetzt die Class 'mini' (60% Höhe)
Zitat von: setstate am 16 April 2015, 22:03:59
Update - Version 1.4 - Schnelleres Laden der Seite
Ab sofort gibt es die Version 1.4, die eine Optimierung beim ersten Start mitbringt. Damit werden die Widgets schneller angezeigt und aktualisiert.
Die zusätzlichen Widgets aus Widgets-for-fhem-tablet-ui (https://github.com/nesges/Widgets-for-fhem-tablet-ui) sind an die neue Version angepasst. Da sich einige Interna geändert haben, müsst ihr sie nach dem Update auf Version 1.4 ebenfalls aktualisieren. Die gute Nachricht: Das Widget-Repository unterstützt jetzt ebenfalls den Fhem-Updatemechanismus. Mehr dazu im Widgets-Thread (http://forum.fhem.de/index.php/topic,36122.msg286658.html#msg286658).
PS: setstate hat FTUI verdammt schnell gemacht - Update lohnt sich unbedingt! :)
Das Update haut bei mir leider nicht hin:
UPD www/tablet/css/fhem-tablet-ui.css
UPD www/tablet/fonts/fhemSVG.eot
Got 127396 bytes for www/tablet/fonts/fhemSVG.eot, not 91804 as expected,
aborting.
jetzt besser, mit dem Update?
Über die filesize läuft er jetzt drüber, aber ich habe irgendwie ein Rechte-Problem. Keine Ahnung wo das nun schon wieder herkommt...
UPD www/tablet/css/fhem-tablet-ui.css
UPD www/tablet/fonts/fhemSVG.eot
cp ./www/tablet/fonts/fhemSVG.eot ./restoreDir/2015-04-16/www/tablet/fonts/fhemSVG.eot failed:Permission denied, aborting the update
Ich hab mir die Restore-Dirs zwar vorher noch nie angeschaut, aber warum ist owner/group "pi" und nicht fhem/dialout?
pi@raspberrypi /opt/fhem/restoreDir/2015-04-16 $ ls -l
insgesamt 216
-rw-r--r-- 1 pi pi 93034 Apr 16 16:37 CHANGED
drwxr-xr-x 2 pi pi 4096 Apr 16 16:41 contrib
drwxr-xr-x 2 pi pi 4096 Apr 16 16:41 docs
drwxr-xr-x 5 pi pi 4096 Apr 16 16:41 FHEM
-rw-r--r-- 1 pi pi 108221 Apr 16 16:37 fhem.pl
drwxr-xr-x 5 pi pi 4096 Apr 16 14:50 www
Zitat von: Wegwerf am 16 April 2015, 09:20:35
Echt klasse wie schnell die Implementierung hier von statten geht.
Ich habe mir mal die Fonts angeschaut und bemerkt dass bei der Erstellung der Font und CSS Dateien sich ein Fehler eingeschlichen hat.
Dadurch sind nicht alle SVGs importiert worden.
Bin mir auch ziemlich sicher woher der Fehler kommt, das müsste ein Bug in IcoMoon sein.
Sobald eine andere Datei, (in diesem Fall höchstwahrscheinlich die *.txt) die nicht von IcoMoon als Fontvorlage unterstützt wird, vorkommt, bricht das Programm den Import ab und importiert den Rest nicht mehr.
Die Zips sollten nun vollständig sein. Die Präfixe habe ich bei oa- und fs- gelassen. Ich hoffe der Rest passt.
Danke dir, die geänderten Files sind jetzt mit dabei
Als kleines Beispiel zur Nutzung: Fenster offen, Fenster zu Anzeige
<div data-type="symbol" data-device="KuechenFenster"
data-icons='["oa-fts_window_2w bold","oa-fts_window_2w_open bold"]'
data-on-colors='["#505050","#aa6900"]'
data-get-on='["closed","open"]'
class="narrow">
</div>
<div data-type="label" class="narrow darker small">Fenster</div>
So, Rechte passen wieder...
Waahhhnsinn! Das ist jetzt aber richtig zackig geworden! Und Danke für die vollständigen OA-Icons!
@setstate & nesges
Einfach tolle Arbeit!
Guten Morgen,
das update habe ich heute frueh erfolgreich durchgefuehrt.
Seither werden einzelne Icons (verwende ausschliesslich fa-) und Werte nicht angezeigt. Die betreffende Seite muss mehrfach manuell neu geladen / refreshed werden, damit irgendwann alle Icons einwandfrei angezeigt werden. Beispiel-Screenshots anbei.
Gruss
Michael
Zitat von: setstate am 16 April 2015, 22:03:59
Update - Version 1.4 - Schnelleres Laden der Seite
Ab sofort gibt es die Version 1.4, die eine Optimierung beim ersten Start mitbringt. Damit werden die Widgets schneller angezeigt und aktualisiert.
- Slider Widget versteht jetzt die Class 'mini' (60% Höhe)
Das ist kein bekannter Bug, von daher musst du mal bitte in der Webconsole eines Desktop-Browsers nachsehen, ob Fehler auftreten und die uns dann bitte mitteilen. Evtl. müssen wir sogar die Sache noch etwas gesprächiger machen, damit man auf die Ursache kommt.
Sorry Mario
Nachtrag: aber ein iOS 8.3 ist das nicht, oder? Ich kann die UI selber unter 8.3 überhaupt nicht nutzen, mit einem iOS 7 iPhone + iPad läuft es wiederum.
Hallo,
es ist ja möglich, dass ich die UPDATE Funktion auf einen Button legen kann. Ist es technisch irgendwie möglich, dass mir das UI mitteilit, dass ein neues Update verfügbar ist? z.B. das mir der Button in einer anderen Farbe dargestellt wird o.ä..
Eine Idee wie man ggf. techn. umsetzten könnte, wobei ich kein Entwickler o.ä. bin. Ich schreibe mal so ins BLAUE hinein:
Auf dem Server liegt eine Date bsp. UPDATE1.4.txt - Diese Datei hat einen Zeitstempel - 01.04.2015 - Wenn ich nun das Update installieren wirde diese Datei auf meinen FHEM Rechner hinterlegt. Im Abstand von X Tagen oder Stunden wird geprüft ob eine neuere Datei vorliegt. Wenn dies der Fall wäre, würde der "Update" Button eine andere Farbe bekommen.
@setstate: kann man den fhem-update-link für die nesges- widgets auch in den ersten post reinnehmen?
Vielen Dank.
Gruss Daniel
Ich habe das Gefühl, dass nach dem Update meine "Umschaltung" zwischen den einzelnen html-Seiten (mit Button-Widget) langsamer geht als gestern. Eigentlich sollte es jetzt doch schneller gehen. Haben das andere auch beobachtet? Vlt. liegt es auch am meinem Netzwerk...
Und mein per "image" eingebundenes Wetterbild zeigt nur noch "img" an :-[
Zitat von: miot am 17 April 2015, 07:39:42
Guten Morgen,
das update habe ich heute frueh erfolgreich durchgefuehrt.
Seither werden einzelne Icons (verwende ausschliesslich fa-) und Werte nicht angezeigt. Die betreffende Seite muss mehrfach manuell neu geladen / refreshed werden, damit irgendwann alle Icons einwandfrei angezeigt werden. Beispiel-Screenshots anbei.
Gruss
Michael
Seit dem Update heute morgen, selbes Problem hier auch. Komischer weise auch mit dem Weather Widget.
Update: Ein zurückspielen der "widget_weather.js" auf dem Stand von gestern morgen, scheint bei mir das Problem zu beheben.
Update2: ALLES ZURÜCK, auch mit der alten "widget_weather.js" tritt das Problem auf. Es wird in den Popups Error kurz eingeblendet!
Scheint als sei es ein Problem in Zusammenhang mit dem Weather Widget?!
Zitat von: mw_fhem am 17 April 2015, 09:52:38
Ich habe das Gefühl, dass nach dem Update meine "Umschaltung" zwischen den einzelnen html-Seiten (mit Button-Widget) langsamer geht als gestern. Eigentlich sollte es jetzt doch schneller gehen. Haben das andere auch beobachtet? Vlt. liegt es auch am meinem Netzwerk...
Und mein per "image" eingebundenes Wetterbild zeigt nur noch "img" an :-[
Absolut, auch das kann ich bestätigen. Laden der html Seiten scheint langsamer und meine eingebunden Images werden nicht mehr gezeigt, nur img.
Allerdings ist das nur bei den lokal abgelegten Images unter ".../fhem/www/tablet/images". bei den aus einer onlinesoucre eingebundenen nicht.
<div data-type="image"
data-url="./images/aral.png"
data-size="50">
</div>
Ich habe es mit zwei verschiedenen Wetterbildern aus dem Netz versucht - es wird nichts angezeigt. Die url im Browser aufrufen klappt ohne Probleme. Ich kann auch bestätigen, dass neu laden und neu laden dann funktioniert. Es muss also irgendwo ein Knoten im Code sein. Aber Mario wird den sicher schnell lösen ;)
Zitat von: mw_fhem am 17 April 2015, 10:07:28
Ich habe es mit zwei verschiedenen Wetterbildern aus dem Netz versucht - es wird nichts angezeigt. Die url im Browser aufrufen klappt ohne Probleme. Auch das neu Laden kann ich bestätigen.
Probiere es mal so:
<li data-row="2" data-col="2" data-sizex="5" data-sizey="4">
<header>DWD Wetterkarte</header>
<div class="cell">
<img id="imgmap" src="http://www.dwd.de/wundk/wetter/de/Deutschland.jpg" width='65%' alt="Wetterkarte">
</div>
</li>
Zitat von: dancatt am 17 April 2015, 09:42:30
@setstate: kann man den fhem-update-link für die nesges- widgets auch in den ersten post reinnehmen?
Done!
Zitat von: tomster am 17 April 2015, 11:40:48
Servus Phil!
Hab gerade im Tablet UI-Thread Dein Layout gesehen. Jefällt ma, jefällt mia janz jut!
Meinst Du könntest mir deine index.html per PM zukommen lassen? Damit würd ich gern ein bissl spielen...
Danke schomml und schönes Wochenende!
LG,
TOM
Bitte, sehr gerne!
@setstate
Es scheint als gibt es nicht nur mit dem Wetter-Widget diese "Ladeprobleme".
Wie im Screenshot zu sehen auch mit der Ausgabe von Readings als Label (im Bsp. das Reading der Benzin/Diesel Preise).
Sowie die Probleme mit den Images....
Würdest du dir das später mal anschauen?
Hinweis:
Falls jemand, so wie ich, dieses genial UI, bereits produktiv im Einsatz hat. Im Anhang die ALTEN-Files vor dem Update auf V1.4.
Damit sollte erstmal wieder alles so funktionieren wie gestern.
PS.: Ja man könnte auch das FHEM-Backup zurückspielen! ;-) Aber bei mir gibt es nie Updates ohne ordentliche Versionierung! :o
Viele Grüße und vielen Dank für die ganze Arbeit
Hallo Mario,
ich habe mehrfach zwischen den Teilen alter und neuer Version hin und herkopiert. Es erscheinen im Debug keine Fehlermeldungen die auf eine bestimmte Richtung schliessen lassen.
Was ich jedoch reproduzierbar feststellen konnte ist folgendes:
1. Vorgehensweise:
Seite wird aufgebaut - es fehlen einzelne Werte
Nach und nach (im Abstand von mehreren Minuten) werden die fehlenden Werte ohne Zutun ergaenzt.
2. Vorgehensweise:
Seite wird aufgebaut - es fehlen einzelne Werte
Ich fuehre in FHEM ein manuelles Update der Proplanta Werte durch
Die fehlenden Werte werden ca. 2-3 Sekunden nach ausgeloestem bzw. erfolgtem Proplanta Update im UI upgedatet.
Timing? Meine Vermutung geht dahin, dass die Widgets beim INIT einzelne aktuelle Werte nicht 'mitbekommen' und diese erst mit der naechsten Wertaenderung beim longpoll aktualisieren und anzeigen. Meine aktuelle Situation (Buero) sieht so aus: Die Scripte (JS) werden lokal ausgefuehrt (Windows 7, Firefox auf XEON Maschine) aber die FHEM Werte sind via Netzwerk ueber die VPN Verbindung durch die ganze Republik unterwegs. Messungen kann ich hier aufgrund der Beschraenkungen nicht vornehmen werde aber spaeter nochmal zu Hause im LAN testen ob sich das Verhalten aendert, wenn die Anzahl Hops ein wenig geringer ist ;)
Gruss
Michael
Zitat von: setstate am 17 April 2015, 07:56:54
Das ist kein bekannter Bug, von daher musst du mal bitte in der Webconsole eines Desktop-Browsers nachsehen, ob Fehler auftreten und die uns dann bitte mitteilen. Evtl. müssen wir sogar die Sache noch etwas gesprächiger machen, damit man auf die Ursache kommt.
Sorry Mario
Nachtrag: aber ein iOS 8.3 ist das nicht, oder? Ich kann die UI selber unter 8.3 überhaupt nicht nutzen, mit einem iOS 7 iPhone + iPad läuft es wiederum.
Vielen Dank für die Fehlermeldungen, ich kann frühestens heute Abend nachsehen. Vllt. könnt ihr nachsehen, ob und was FHEM liefert für die problematischen Readings.
Dazu bitte die Zeile 341 in der fhem-tablet-ui.js ent-kommentieren und in der Console nachsehen, was von fhem reinkommt. Evtl. passt das Format nicht mehr zur neuen Behandlung.
Ich möchte eine Etagen-Aswahl (bzw. auch Gewerk-Auswahl) realisieren. Kann ich mit dem select-Widget auch direkt eine url abfeuern? Oder muss ich irgendwie über einen dummy gehen?
Hallo Mario,
zunaechst etwas positives: im LAN / WLAN Verbund bei mir zu Hause sind die Probleme auf keinem der verwendeten Endgeraete (Android, iOS und Windows) vorhanden.
Was auf einer VPN Strecke passiert kann man sowieso nicht beeinflussen - ausserdem kann ich fuer meine privaten Spielereien im Buero keinen Sniffer beauftragen :-\
Da das Phaenomen vor 1.4 nicht vorhanden war ist es zumindest wahrscheinlich, dass die Code-Optimierung ursaechlich verantwortlich ist. Allerdings ist es genau genommen ein Tablet UI und kein 'Ich steuere Haus, Hof, Garten und Katze weltweit ueber VPN'-UI ;) Insofern sollte man es relativieren zumal das Problem wohl nur einen eingeschraenkten Nutzerkreis betrifft.
Ich bin am Wochenende sowieso nochmal im Buero und schau mir gerne an was die ent-kommentierte Zeile 341 an neuen Erkenntnissen bringen wird.
Gruss
Michael
Zitat von: setstate am 17 April 2015, 12:53:57
Vielen Dank für die Fehlermeldungen, ich kann frühestens heute Abend nachsehen. Vllt. könnt ihr nachsehen, ob und was FHEM liefert für die problematischen Readings.
Dazu bitte die Zeile 341 in der fhem-tablet-ui.js ent-kommentieren und in der Console nachsehen, was von fhem reinkommt. Evtl. passt das Format nicht mehr zur neuen Behandlung.
Mit der 1.4 habe ich asynchrone Abfragen zugelassen. Damit bekommt man sehr leicht Probleme durch unterschiedliche Laufzeiten (RaceConditions). Wenn man da nicht alle Möglichkeiten in Betracht zieht ...
Vielen Dank fürs Feedback, ich werde aber später Forschungen starten.
Hallo,
also bei mir treten die Fehler im heimischen LAN auf!
Zitat von: setstate am 16 April 2015, 20:04:32
hast du beim Label 'narrow' in class mit drin? Das würde das Label näher ran rücken.
Und nach unten ist genügend Platz?
ggf. den Code-Teil mal schicken, wenn trotzdem nicht klappt ...
Ja, habe ich:
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="3" data-sizey="3">
<header>Flur</header>
<div data-type="dimmer" data-device="grWZ.Dimmer" class="cell" ></div>
<div data-type="label" class="small narrow darker">Licht</div>
</li>
</ul>
</div>
;D dann nimm mal 'narrow' raus !
Besser?
Zitat von: setstate am 17 April 2015, 16:51:30
;D dann nimm mal 'narrow' raus !
Besser?
Hat leider nichts gebracht... :(
<li data-row="1" data-col="1" data-sizex="3" data-sizey="3">
<header>Flur</header>
<div data-type="dimmer" data-device="grWZ.Dimmer" class="cell" ></div>
<div data-type="label" class="cell darker">Licht</div>
</li>
So geht es. Die Klasse 'cell' gibt dem Element etwas Freiraum nach oben und links, das war hier von Nöten. Mit 'narrow' erreicht man das Gegenteil, es rückt näher zusammen. Statt mit 'cell' kann man auch mit 'top-space' oder 'top-space-2x' arbeiten, dann bekommt man nur nach oben Abstand.
Zitat von: Phil__ am 17 April 2015, 10:02:12
Absolut, auch das kann ich bestätigen. Laden der html Seiten scheint langsamer und meine eingebunden Images werden nicht mehr gezeigt, nur img.
Allerdings ist das nur bei den lokal abgelegten Images unter ".../fhem/www/tablet/images". bei den aus einer onlinesoucre eingebundenen nicht.
<div data-type="image"
data-url="./images/aral.png"
data-size="50">
</div>
Upps, das Image Widget habe ich noch gar nicht an die neue Version angepasst, weil ich es persönlich nicht im Einsatz habe.
Ich melde mich wieder ...
Zitat von: setstate am 17 April 2015, 19:13:16
Upps, das Image Widget habe ich noch gar nicht an die neue Version angepasst, weil ich es persönlich nicht im Einsatz habe.
Ich melde mich wieder ...
Super, Danke!
Das Problem mit dem laden einiger Readings bzw icons ,"Timing Problem"?, scheint mir ein Updateproblem...?!
Habe einfach mal alle Files, bis auf die .html's, aus dem Ordner "...fhem/www/tablet" gelöscht und die aus dem GIT neu geladen und manuel rein kopiert!
Nun sind die Probleme verschwunden.
Bis auf die mit dem Image Widget :P
Grüße
Hab eben ein Update gemacht und meine index.html war überbügelt worden :-[ :-[ :-[ :-[
Zum Glück hab ich mir die gesichert.
Zitat von: Phil__ am 17 April 2015, 19:22:50
Super, Danke!
Das Problem mit dem laden einiger Readings bzw icons ,"Timing Problem"?, scheint mir ein Updateproblem...?!
Habe einfach mal alle Files, bis auf die .html's, aus dem Ordner "...fhem/www/tablet" gelöscht und die aus dem GIT neu geladen und manuel rein kopiert!
Nun sind die Probleme verschwunden.
Bis auf die mit dem Image Widget :P
Grüße
Das ist doch schön zu hören :-) Das mit dem Update natürlich nicht.
Ich hoffe, bei den anderen ist das auch die Ursache.
Vielen Dank für die Info.
Zitat von: dancatt am 17 April 2015, 19:26:53
Hab eben ein Update gemacht und meine index.html war überbügelt worden :-[ :-[ :-[ :-[
Zum Glück hab ich mir die gesichert.
Bitte legt eine exclude_from_update Zeile in der fhem.cfg an, ich kann nicht garantieren, dass das nicht wieder passiert.
attr global exclude_from_update www/tablet/index.html
Sorry :-\
Zitat von: setstate am 17 April 2015, 18:30:05
<li data-row="1" data-col="1" data-sizex="3" data-sizey="3">
<header>Flur</header>
<div data-type="dimmer" data-device="grWZ.Dimmer" class="cell" ></div>
<div data-type="label" class="cell darker">Licht</div>
</li>
So geht es. Die Klasse 'cell' gibt dem Element etwas Freiraum nach oben und links, das war hier von Nöten. Mit 'narrow' erreicht man das Gegenteil, es rückt näher zusammen. Statt mit 'cell' kann man auch mit 'top-space' oder 'top-space-2x' arbeiten, dann bekommt man nur nach oben Abstand.
Kannst du mal nen Screenshot machen, wie es aussehen sollte? Bei mir hat sich nämlich mit deinem Code nichts geändert...
Mein Vorschlag wäre, bei der Auslieferung die Datei z.b. index-example.html zu nennen
<li data-row="1" data-col="1" data-sizex="3" data-sizey="3">
<header>Flur</header>
<div data-type="dimmer" data-device="grWZ.Dimmer" class="cell" ></div>
<div data-type="label" class="cell darker">Licht</div>
</li>
Zitat von: dancatt am 17 April 2015, 19:26:53
Hab eben ein Update gemacht und meine index.html war überbügelt worden :-[ :-[ :-[ :-[
Zum Glück hab ich mir die gesichert.
Wie gut, dass FHEM im Verzeichnis <fhem_root>/restoreDir/<datum> ein Backup anlegt ;)
Zitat von: setstate am 17 April 2015, 20:04:07
<li data-row="1" data-col="1" data-sizex="3" data-sizey="3">
<header>Flur</header>
<div data-type="dimmer" data-device="grWZ.Dimmer" class="cell" ></div>
<div data-type="label" class="cell darker">Licht</div>
</li>
Autsch... ich gestehe: der Fehler befand sich ca. 50cm vor dem Bildschirm und nennt sich jsloot.... sorry :( jetzt funktionierts....
Zitat von: setstate am 17 April 2015, 19:13:16
Upps, das Image Widget habe ich noch gar nicht an die neue Version angepasst, weil ich es persönlich nicht im Einsatz habe.
Ich melde mich wieder ...
Image Widget ist jetzt angepasst. Damit kann es auch mit der FTUI Version 1.4 wieder genutzt werden.
Zusätzlich kann jetzt auch das Update Intervall pro Bild vorgeben, wenn man ein Image per data-url eingebunden hat. Mit data-refresh legt man das Refresh-Intervall in Sekunden fest. Default für data-refresh ist 900 Sekunden (15Minuten).
Neuladen aller 15 Minuten:
<div data-type="image"
data-url="./images/Karte.png"
data-size="150px">
</div>
<div data-type="image"
data-url="./images/Cam.png"
data-size="200px"
data-refresh="60">
</div>
Ein Bild, was per FHEM-Device Reading-URL (data-get) geholt wird, kann nicht per data-refresh beeinflusst werden. Das Update erfolgt, wie andere data-get Widgets über die normale Short/Long-Poll Refreshs.
<div data-type="image" data-device="AgroWeather"
data-get="fc0_weatherDayIcon"
data-size="50px">
</div>
Zitat von: Phil__ am 17 April 2015, 19:22:50
Habe einfach mal alle Files, bis auf die .html's, aus dem Ordner "...fhem/www/tablet" gelöscht und die aus dem GIT neu geladen und manuel rein kopiert!
Nun sind die Probleme verschwunden.
Hat sich das Problem mit den nicht geladenen Icons damit auch für die anderen erledigt, oder besteht noch Analysebedarf? Ich konnte die Probleme bisher bei mir nicht nachstellen - falls es also noch irgendwo nicht richtig funktioniert bitte nochmal melden.
Hallo,
wollte gerade mal das Update machen, bekomme aber folgende Fehlermeldung:
2015-04-18 10:57:03 Global global UPD www/tablet/js/fhem-tablet-ui.js
2015-04-18 10:57:03 Global global Got 13659 bytes for www/tablet/js/fhem-tablet-ui.js, not 13537 as expected,
Habe schon mal die fhem-tablet-ui.js in fhem-tablet-ui-old.js umbenannt, in der Hoffnung, dass er sie dann einfach nochmal runterlädt. Tut er aber nicht. :-(
Jemand eine Idee?
LG Johannes
Bitte jetzt nochmal probieren. Mit dem Update Control File stehe ich noch etwas auf Kriegsfuß. Local Commit, Remote Pull Request Commit und Prepare Controlfile, da kommt man schnell durcheinander und in die falsche Reihenfolge.
Sorry
Mario
Zitat von: johannes1984 am 18 April 2015, 10:57:56
Hallo,
wollte gerade mal das Update machen, bekomme aber folgende Fehlermeldung:
2015-04-18 10:57:03 Global global UPD www/tablet/js/fhem-tablet-ui.js
2015-04-18 10:57:03 Global global Got 13659 bytes for www/tablet/js/fhem-tablet-ui.js, not 13537 as expected,
Habe schon mal die fhem-tablet-ui.js in fhem-tablet-ui-old.js umbenannt, in der Hoffnung, dass er sie dann einfach nochmal runterlädt. Tut er aber nicht. :-(
Jemand eine Idee?
LG Johannes
Falls das Update nicht klappt, manuell die GIT Sourcen laden geht immer!
Die Probleme sind zumindest bei mir noch vorhanden. Auch zu Hause - entgegen meiner gestrigen Aussage - sind in seltenen Einzelfaellen die Probleme zu sehen.
Ich hab einiges getestet, haufenweise console.log in die fhem-tablet-ui.js eingebaut, ein bisschen ajax und jquery gelesen und alles zusammen geworfen ;)
Hier mal ein Logauszug an dem man es gut erkennen kann (kommentare sind drin)
"Plugin dir: /fhem/tablet/js"
"Filename: index_weather.html"
Mein Kommentar: Alles mit ++++ passiert im plugins.load Teil:
"++++ Collecting required readings"
"++++ Initializing Widgets"
"++++ Initializing widget_clock"
"++++ Initializing widget_label"
"++++ Initializing widget_symbol"
"++++ Initializing widget_weather"
"++++ Request readings from FHEM"
Mein Kommentar: JETZT kommt aber schon das erste Ergebnis fuer ein Reading:
"MicaProplanta 2015-04-18 11:04:03 16"
"update done for device:MicaProplanta parameter:fc1_tempMax"
Mein Kommentar: UND JETZT wird erst das Widget in function intWidgets initialisiert!
"---- Loading plugin: widget_weather"
"---- Module added: widget_weather"
"---- Module widget_weather is now initialized"
"---- Module widget_weather is now requesting (FHEM) STATE"
Mein Kommentar: Jetzt kommt der Rest...
"MicaProplanta 2015-04-18 11:04:03 5"
"update done for device:MicaProplanta parameter:fc0_temp06"
"GA_HIN_TEMP01 T: 12.9 H: 47"
"update done for device:GA_HIN_TEMP01 parameter:STATE"Im Screenshot (hier nur der relevante Teil) fehlt genau die Darstellung von fc1_tempMax, weil dieses Ergebnis bereits empfangen wurde bevor das Widget aktiv war oder Ergebnisse annehmen / verarbeiten / darstellen konnte.
Wenn ich in FHEM anschliessend manuell 'set MicaProplanta update' absende wird der fehlende Wert dank longpoll sauber dargestellt - so solls ja auch sein.
Ich denke ihr konnt das viel besser interpretieren als ich aber hinsichtlich sync / async muss sichergestellt werden, dass der Load UND Init der Wigets abgeschlossen ist BEVOR der erste Request an FHEM abgesendet wird bzw. Ergebnisse ankommen und verarbeitet werden sollen.
Ist aber nur eine Laien-Schlussfolgerung ;)
Waer super, wenn ihr das oben zusammengereimte mal fachmaennisch ueberdenken koenntet.
Achja: Und nochwas eher unschoenes (wird aber auch keiner bewusst machen): Wenn ich in meinem Browser staendig F5 auf einer der UI Seiten fuer aktualisieren druecke ohne die Ergebnis-Darstellung abzuwarten dann werden wohl soviele Anfragen parallel zu FHEM gesendet, dass FHEM zuverlaessig und reproduzierbar nach ca. 10-20 mal F5 druecken gnadenlos abstuerzt. Haengt wohl von der Anzahl der Anfragen auf der UI Seite ab, die gesendet werden und beantwortet werden muessen. Irgendwann sind es dann aber wohl zu viele und es scheint eine Ueberlaufsituation zu entstehen.
Gruss
Michael
PS: Die Sources manuell von git zu laden und einzuspielen aendert bei mir nichts an dem Verhalten.
Zitat von: nesges am 18 April 2015, 09:51:10
Hat sich das Problem mit den nicht geladenen Icons damit auch für die anderen erledigt, oder besteht noch Analysebedarf? Ich konnte die Probleme bisher bei mir nicht nachstellen - falls es also noch irgendwo nicht richtig funktioniert bitte nochmal melden.
Hallo Michael, das ist doch mal eine Spur!
Vielen Dank für die umfangreiche Analyse
Ich werde mir es ansehen.
Zitat von: bjoernbo am 17 April 2015, 09:36:58
es ist ja möglich, dass ich die UPDATE Funktion auf einen Button legen kann. Ist es technisch irgendwie möglich, dass mir das UI mitteilit, dass ein neues Update verfügbar ist? z.B. das mir der Button in einer anderen Farbe dargestellt wird o.ä..
Gute Idee! Das control-File hat ja schon die benötigten Infos, das müsste man nur prüfen und mit den lokalen Files vergleichen. Kann man mit HTTPMOD machen, man braucht nur eine Prüffunktion, die man irgendwo in eine 99_myUtils.pm legt:
sub controlfile_updatecheck($) {
use Date::Parse;
my $raw = shift;
my $response='';
my @lines = split "\n", $raw;
foreach my $line (@lines) {
my @remote= split " ", $line;
if(@remote>3 && $remote[0] eq "UPD") {
Log 3, $line;
$remote[1]=~s/_/ /;
my @local = stat($remote[3]);
if($local[7] != $remote[2] || $local[9] < str2time($remote[1])) {
$response .= $remote[0]." ".$remote[3]."\n";
}
}
}
return $response;
}
Eine Funktion um das Update durchzuführen und die Readings zu aktualisieren:
sub controlfile_update($) {
my $device = shift;
my $url = InternalVal($device, 'url', '');
my $def = InternalVal($device, 'DEF', '');
fhem("setreading $device available updated");
fhem("setreading $device files -");
fhem("define at_recheck_$device at +00:05:00 modify $device $def");
fhem("update all $url");
}Und in die fhem.cfg kommen dann diese Definitionen:
define UPDATE_FTUI HTTPMOD https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt 14400
attr UPDATE_FTUI alias Fhem Tablet UI
attr UPDATE_FTUI userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_FTUI event-on-change-reading available,files
attr UPDATE_FTUI reading01Name files
attr UPDATE_FTUI reading01Regex (?s)(UPD.*)
attr UPDATE_FTUI reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_FTUI reading02Name available
attr UPDATE_FTUI reading02Regex (?s)(UPD.*)
attr UPDATE_FTUI reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_FTUI room hidden
define UPDATE_WIDGETS HTTPMOD https://raw.githubusercontent.com/nesges/Widgets-for-fhem-tablet-ui/master/controls_widgets-for-fhem-tablet-ui.txt 14400
attr UPDATE_WIDGETS alias Widgets for Fhem Tablet UI
attr UPDATE_WIDGETS userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_WIDGETS event-on-change-reading available,files
attr UPDATE_WIDGETS reading01Name files
attr UPDATE_WIDGETS reading01Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_WIDGETS reading02Name available
attr UPDATE_WIDGETS reading02Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_WIDGETS room hidden
define UPDATES readingsGroup UPDATE_FTUI:available,files UPDATE_WIDGETS:available,files
attr UPDATES valueFormat { ($READING eq 'files' && $VALUE !~ /^-?$/)?'<a href="?cmd={controlfile_update(\'$DEVICE\')}">[Start Update]</a>':$VALUE }
attr UPDATES alias 3d Party Updates
attr UPDATES room SystemIn der readingsGroup wird ein Link mit dem Text "[Start Update]" angezeigt, sobald ein Update verfügbar ist. Die readingsGroup kann man sicher noch schöner machen, aber da kenn ich mich nicht aus und überlasse das euch :)
PS: Habe ein paar Stellen verändert, am besten komplett neu übernehmen.
Sauber! Ich dachte schon der Post wäre untergegangen. Ich werde das mal ausprobieren!
nabend,
cih benötige mal hilfe beim fomatieren. ich bekomme die werte nicht inline dargestellt ... >:(
<li data-row="1" data-col="5" data-sizex="3" data-sizey="1">
<header>Wettermast</header>
<div class="container inline">
<div data-type="label" data-device="KS300" data-get="temperature" data-unit="%B0C%0A" class="cell small inline"></div>
<div data-type="label" data-device="KS300" data-get="humidity" data-unit="%" class="cell small inline"></div>
<div data-type="label" data-device="KS300" data-get="wind" data-unit="%B0C%0A" class="cell small inline"></div>
<div data-type="label" data-device="KS300" data-get="rain" data-unit="" class="cell small inline"></div>
</div>
<div class="container inline">
<div data-type="label" class="cell small inline">Temperatur</div>
<div data-type="label" class="cell small inline">Luftfeuchte</div>
<div data-type="label" class="cell small inline">Wind</div>
<div data-type="label" class="cell small inline">Regen</div>
</div>
</li>
danke schon einmal
Hallo Chris1284,
leider kann ich nur raten, wie es am Ende aussehen soll ...
So?
<li data-row="1" data-col="5" data-sizex="3" data-sizey="1">
<header>Wettermast</header>
<div class="cell inline">
<div data-type="label" data-device="KS300" data-get="temperature" data-unit="%B0C%0A" class="small"></div>
<div data-type="label" class="small">Temperatur</div>
</div>
<div class="cell inline">
<div data-type="label" data-device="KS300" data-get="humidity" data-unit="%" class="small"></div>
<div data-type="label" class="small">Luftfeuchte</div>
</div>
<div class="cell inline">
<div data-type="label" data-device="KS300" data-get="wind" data-unit="%B0C%0A" class="small"></div>
<div data-type="label" class="small">Wind</div>
</div>
<div class="cell inline">
<div data-type="label" data-device="KS300" data-get="rain" data-unit="" class="small"></div>
<div data-type="label" class="small">Regen</div>
</div>
</li>
EDIT: *über sich selbst ärger* man sollte die richtiges css includen...
Zitat von: miot am 18 April 2015, 12:32:36
Die Probleme sind zumindest bei mir noch vorhanden. Auch zu Hause - entgegen meiner gestrigen Aussage - sind in seltenen Einzelfaellen die Probleme zu sehen.
Ich hab einiges getestet, haufenweise console.log in die fhem-tablet-ui.js eingebaut, ein bisschen ajax und jquery gelesen und alles zusammen geworfen ;)
Eine kleine Erweiterung konnte ich noch einbauen, um den vermuteten Race Conditions zu umgehen.
Bitte ladet mal die geänderte fhem-tablet-ui.js von Github und testet bei euch, ob es damit besser ist.
Viele Dank
Funktioniert wieder alles perfekt! Erstmal vielen Dank dafuer ;)
Compare sei Dank hab ich mal geschaut, was Du geaendert hast und ein wenig weiter experimentiert. Seit gestern ist bei mir nicht viel neues Wissen dazugekommen, so dass ich immer noch jede Menge Fragezeichen habe aber auch was rausfinden konnte:
loadplugin_async wird nicht aufgerufen oder? Die drei Zeilen Teil solltest Du wieder entfernen sonst fragt man sich in 2 Wochen, wofuer das wohl sein soll...
In Zeile 384 habe ich async: true fest gesetzt (loadplugin_async wird ja nicht aufgerufen) zumal Firefox und Chrome von sync XMLHttpRequests abraten.
In der Funktion (loadplugin) wird zwar zwischen success und error unterschieden aber ich finde partout keinen Code der darauf reagiert... Dafuer reichts wohl bei mir mit dem Verstaendnis noch nicht :(
Zum Erfolg fuehren jedenfalls die Zeilen 40-45, die die Widgets nach dem Laden zuerst updaten bevor ein neuer Request bereits empfangene Werte ueberschreibt.
Da es ja um Optimierung geht: In Zeile 40-45 werden bei geladenem widget ALLE readings von ALLEN devices upgedatet. Ich habe mal einen Zaehler eingebaut und mir das im Log anzeigen lassen. Bei meiner Wetterseite sind das bei 5 verwendeten Widgets und jeweils 81 updates insgesamt 405 Aufrufe von module.update fuer 0-10 vorhandene Werte. Ich weiss nicht wie lange diese Updates dauern bzw. wie gross die reale Verzoegerung ist aber von den Zahlen her wuerde ich sagen da steckt Potential fuer Optimierung drin.
Aber das sind alles spinnerte Peanuts. Alles funktioniert - 1000 Dank fuer Deine Bemuehungen!
Gruss
Michael
Zitat von: setstate am 18 April 2015, 22:13:28
Eine kleine Erweiterung konnte ich noch einbauen, um den vermuteten Race Conditions zu umgehen.
Bitte ladet mal die geänderte fhem-tablet-ui.js von Github und testet bei euch, ob es damit besser ist.
Viele Dank
@nesges: Habe die Updatefunktion übernommen, funktioniert. Danke.
lg
aeronaut
Zitat von: miot am 19 April 2015, 08:16:08loadplugin_async wird nicht aufgerufen oder?
Ich bin grade dabei eine Vererbungshierarchie einzuführen. Die Funktion wird zum dynamischen laden von Widgets benötigt.
Das ist aber ein guter Hinweis von Michael gewesen. Ich habe nicht mehr darauf geachtet, ob ich asynchron oder synchron aufrufe. Ich wollte async benutzen, durch die Aufteilung mit der zweiten Funktion nahm ich das falsche. Muss ich noch ändern.
Wenn die Optimierung von gestern funktioniert, dann ist das schön. Das Update jetzt sehr oft aufgerufen wird, ist nicht schlimm. Die Widgets haben einen Filter, um nur für sie bestimmte Daten zu benutzen. Dieser zusätzliche Aufruf des Updates war ein Kompromiss, um die jetzige Art und Weise nicht völlig ändern zu müssen, aber auch mit den nebenläufigen Aufrufen fertig zu werden.
Update: bitte jetzt noch mal die fhem-tablet-ui.js von GIThub laden, ich habe das true für async gesetzt.
Eine Frage:
Ich habe bei mir zwei kleine Änderungen in der fhem-tablet-ui.js vorgenommen, um das Aussehen (nach meinem Geschmack) zu optimieren:
gridster = $(".gridster > ul").gridster({
widget_base_dimensions: [wx, wy],
widget_margins: [1, 1],
extra_cols: 1,
draggable: {
handle: 'header'
}
Das muss ich nun natürlich nach jedem Update wieder nachziehen.
Irgendwo hier im Thread stand schon mal, wie man gridster-Funktionen direkt aus dem HTML-Datei per script aufrufen kann:
<script data-type="text/javascript">$(document).ready(function() { gridster.disable() })</script>
Aber wie muss das aussehen, wenn ich Eigenschaften wie widget_margins per Skriptbefehl überschreiben möchte?
Beim Thermostat werden keine Werte < 10 dargestellt.
Ebenso taucht bei den FHTs für den "actuator" ein doppeltes "%"-Zeichen auf.
Ich habe in der "widget_thermostat.js" folgende Zeilen angepasst:
getClimaValues: function (device) {
var state = getDeviceValue( device, '');
var val_desired = getDeviceValue( device, 'get');
var val_desired = ( state && state.indexOf('set_') < 0 ) ? val_desired : getPart(state,2);
var val_temp = getDeviceValue( device, 'temp');
+ var val_valve = getDeviceValue( device, 'valve');
return {
- temp: getPart(val_temp,'(\\d+[.,]?\\d+).*'),
- desired: getPart(val_desired,'(\\d+[.,]?\\d+).*'),
- valve: getDeviceValue( device, 'valve')
+ temp: getPart(val_temp,'(\\d+[.,]?\\d*).*'),
+ desired: getPart(val_desired,'(\\d+[.,]?\\d*).*'),
+ valve: getPart(val_valve,'(\\d+[.,]?\\d*).*')
};
},
die min / max (default 10/30), sowie die steps kannst du selbst festelegen
Zitatdata-min : minimal value to set (default 10)
data-max : maximal value to set (default 30)
data-step : step size for value adjustment e.g. 0.5 (default 1)
zum doppelten % : kann es sein dass das fht-modul ein % mitliefert beim wert (also im reading slebst auch ein % enthalten ist) ? das sollte dann im modul gefixed werden, so das es, fhem-standard, nur den wert liefert (ohne einheit)
Ja, das FHT Modul liefert leider das % Zeichen mit, das stört auch bei anderen Funtkionen.
Sent from my iPad using Tapatalk
dann sollte man den maintainer kontaktieren
Zitat von: Brockmann am 19 April 2015, 11:25:46
Eine Frage:
Ich habe bei mir zwei kleine Änderungen in der fhem-tablet-ui.js vorgenommen, um das Aussehen (nach meinem Geschmack) zu optimieren:
gridster = $(".gridster > ul").gridster({
widget_base_dimensions: [wx, wy],
widget_margins: [1, 1],
extra_cols: 1,
draggable: {
handle: 'header'
}
Das muss ich nun natürlich nach jedem Update wieder nachziehen.
Irgendwo hier im Thread stand schon mal, wie man gridster-Funktionen direkt aus dem HTML-Datei per script aufrufen kann:
<script data-type="text/javascript">$(document).ready(function() { gridster.disable() })</script>
Aber wie muss das aussehen, wenn ich Eigenschaften wie widget_margins per Skriptbefehl überschreiben möchte?
Nach etwas probieren habe ich es nun rausgefunden:
gridster.options.widget_margins=[1, 1];
gridster.options.extra_cols=1;
gridster.generate_grid_and_stylesheet();Oder komplett als HTML Tag einfach an die letzte Stelle innerhalb des HEAD-Tags einfügen:
<script type="text/javascript">$(window).load(function() {
gridster.options.widget_margins=[1, 1];
gridster.options.extra_cols=1;
gridster.generate_grid_and_stylesheet();
})</script>
Hallo,
Eigentlich funktioniert alles. Aber da ich das Update über fhem wollte, habe ich alles unter /tablet gelöscht und mit "update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt" sozusagen ein frisches System aufspielen wollen.
Irgendwo mache ich aber einen Denkfehler, da immer folgender Abruch kommt: UPD www/tablet/js/fhem-tablet-ui.js
Got 13719 bytes for www/tablet/js/fhem-tablet-ui.js, not 13659 as expected,
aborting.
Kann mir jemand auf die Sprünge helfen wo ich falsch denke. Funktioniert ein frisches aufsetzen so nicht ? Habe vorher auch noch einen Neustart von fhem gemacht.
Hermann
Zitat von: setstate am 18 April 2015, 11:25:23
Bitte jetzt nochmal probieren. Mit dem Update Control File stehe ich noch etwas auf Kriegsfuß. Local Commit, Remote Pull Request Commit und Prepare Controlfile, da kommt man schnell durcheinander und in die falsche Reihenfolge.
Sorry
Mario
Schau mal hier, denke setstate behebt das Problem gleich. :P
Zitat von: Hermann am 19 April 2015, 19:06:35
Hallo,
Eigentlich funktioniert alles. Aber da ich das Update über fhem wollte, habe ich alles unter /tablet gelöscht und mit "update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt" sozusagen ein frisches System aufspielen wollen.
Irgendwo mache ich aber einen Denkfehler, da immer folgender Abruch kommt: UPD www/tablet/js/fhem-tablet-ui.js
Got 13719 bytes for www/tablet/js/fhem-tablet-ui.js, not 13659 as expected,
aborting.
Kann mir jemand auf die Sprünge helfen wo ich falsch denke. Funktioniert ein frisches aufsetzen so nicht ? Habe vorher auch noch einen Neustart von fhem gemacht.
Hermann
Hallo Hermann, du machst nix falsch. Ich habe nur das fhem-tablet-ui.js ausgetausch, aber das Controlfile nicht ge-updated, weil wir noch ein Fehler finden wollten. Machte aber keinen Sinn. Das Controlfile sollte immer aktuell sein.
Sorry, geht gleich wieder
Zitat von: Wegwerf am 16 April 2015, 09:20:35
Echt klasse wie schnell die Implementierung hier von statten geht.
Ich habe mir mal die Fonts angeschaut und bemerkt dass bei der Erstellung der Font und CSS Dateien sich ein Fehler eingeschlichen hat.
Dadurch sind nicht alle SVGs importiert worden.
Bin mir auch ziemlich sicher woher der Fehler kommt, das müsste ein Bug in IcoMoon sein.
Sobald eine andere Datei, (in diesem Fall höchstwahrscheinlich die *.txt) die nicht von IcoMoon als Fontvorlage unterstützt wird, vorkommt, bricht das Programm den Import ab und importiert den Rest nicht mehr.
Die Zips sollten nun vollständig sein. Die Präfixe habe ich bei oa- und fs- gelassen. Ich hoffe der Rest passt.
die ist leider auch nicht vollständig musste ich feststellen. sani_heating_boost fehlt zum beispiel
Zitat von: setstate am 19 April 2015, 17:25:30
Nach etwas probieren habe ich es nun rausgefunden:
Vielen Dank! Funktioniert perfekt! :D
Hallo,
erst mal auch von mir ein riesengroßes Lob für das Projekt.
Dies ist genau die Oberfläche für FHEM die ich schon immer gesucht habe.
Man hat schon das Gefühl man hat etwas verpasst, wenn man einen Tag nicht in den Beitrag hier schaut.
Mittlerweile ist bei mir die index.html sehr gewachsen und unübersichtlich geworden.
Daher habe ich die einzelnen Gridsterbereiche in Templates ausgelagert.
Vielleicht ist dies ja für den einen oder anderen eine neue Anregung!
Hier der Teil meiner index.html
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="12" data-template="/fhem/tablet/templates/tmp_HomeMenu.htm"></li>
<li data-row="1" data-col="16" data-sizex="3" data-sizey="3" data-template="/fhem/tablet/templates/tmp_Clock.htm"></li>
<li data-row="1" data-col="2" data-sizex="6" data-sizey="3" data-template="/fhem/tablet/templates/tmp_HomeOG.htm"></li>
<li data-row="4" data-col="2" data-sizex="6" data-sizey="3" data-template="/fhem/tablet/templates/tmp_HomeEG.htm"></li>
<li data-row="7" data-col="2" data-sizex="6" data-sizey="3" data-template="/fhem/tablet/templates/tmp_HomeKG.htm"></li>
<li data-row="10" data-col="2" data-sizex="6" data-sizey="3" data-template="/fhem/tablet/templates/tmp_Leer.htm"></li>
<li data-row="4" data-col="8" data-sizex="6" data-sizey="9" data-template="/fhem/tablet/templates/tmp_Leer.htm"></li>
<li data-row="4" data-col="14" data-sizex="5" data-sizey="4" data-template="/fhem/tablet/templates/tmp_HomeWetter.htm"></li>
<li data-row="1" data-col="8" data-sizex="8" data-sizey="3" data-template="/fhem/tablet/templates/tmp_HomeAnrufe.htm"></li>
<li data-row="8" data-col="14" data-sizex="5" data-sizey="5" data-template="/fhem/tablet/templates/tmp_Kamera.htm"></li>
</ul>
</div>
<script>
$('li[data-template]').each(function (index) {
$(this).load($(this).data('template'));
});
</script>
Weiter so ;)
Hallo mc-hollin, vielen Dank!
Das Thema Templates bin ich auch schon angegangen. Kannst du bitte mal statt mit data-template einmal data-include probieren, ob sich das genauso verhält?!
Ist in der fhem-tablet-ui.js ab Zeile 102 eingebaut.
Danke
ui, danke für dne tip, so muss man sein menue nicht auf allen seiten aktualisieren wenn man mal was änder
Hallo setstate,
data-include funktioniert bei mir nicht.
In der fhem-tablet-ui.js ist noch ' div' implementiert.
$(this).load($(this).data('include') +' div', function()
Ich wollte nicht direkt in der fhem-tablet-ui.js Anpassungen machen.
Mein Gedanke war es , die Templates direkt auf die <li> zu setzen.
Dann kann auch wie beim Wetter der Header dynamisch in den Templates angepasst werden.
Ich fände es toll, wenn wir vielleicht auch einen Bereich für Templates zum Austausch hätten.
(Dieses Projekt hat mich dazu gebracht mich auch mal wieder mit jquery auseinander zu setzen. :D)
Zitat von: chris1284 am 19 April 2015, 21:58:25
die ist leider auch nicht vollständig musste ich feststellen. sani_heating_boost fehlt zum Beispiel
@Chris1284
ich habe meine hochgeladenen Dateien gerade überprüft, laut demo.html ist fs-sani_heating_boost enthalten.
Auch in GitHub sind die richtigen Versionen hinterlegt. In der fhemSVG.css auf GitHub ist die Klasse fs-sani_heating_boost vorhanden.
Da muss der Fehle an was anderem liegen. Evtl. Cache? (Firefox: Ctrl+F5)
Zitat von: mc-hollin am 20 April 2015, 10:03:12
Mein Gedanke war es , die Templates direkt auf die <li> zu setzen.
Dann kann auch wie beim Wetter der Header dynamisch in den Templates angepasst werden.
Ich fände es toll, wenn wir vielleicht auch einen Bereich für Templates zum Austausch hätten.
Schaue ich mir heute Abend bei mir live an. Die Templates auf gridster Panel Ebene klingt logischer. Guter Gedanke.
Auch ein toller Vorschlag ist das Sharen von Templates. Ein neuer Thread für die Erklärungen und Screenshots und dem HTML wäre ideal. Ich würde dann auch im Projekt einen Template Ordner anlegen mit den besten Kandidaten.
@setstate
Werden eigentlich beim Symbol Widget, in dem Fall dass bei data-get-on ein Array steht, auch RegEx ausgewertet?
Zitat von: Wegwerf am 20 April 2015, 10:57:59
@setstate
Werden eigentlich beim Symbol Widget, in dem Fall dass bei data-get-on ein Array steht, auch RegEx ausgewertet?
Nein, mit indexOf wird der eindeutig passende Status gesucht.
Welchen Anwendungsfall hast du konkret zu lösen?
Nachtrag: es wird bald möglich sein. Wir sind gerade am Thema Konsolidierung von Widgets dran. Dann kann das Symbol auch alles, was Switch kann.
Nur noch ein paar Tests von meiner Seite, dank nesges ist alles schon in den Startlöchern :-)
Muss man für die oa- und fs- fonts noch etwas runterladen, oder reicht das "normale" update?
Habe versucht die Symbole von den Fenstern und der Türen eingebunden und statt der Symbole zeigt er mir ein Rechteck mit nem Zeichencode an....
Zitat von: selfarian am 20 April 2015, 11:50:04
Muss man für die oa- und fs- fonts noch etwas runterladen, oder reicht das "normale" update?
Habe versucht die Symbole von den Fenstern und der Türen eingebunden und statt der Symbole zeigt er mir ein Rechteck mit nem Zeichencode an....
Hast du die zugehörigen CSS in dein HTML-File eingebunden?
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css">
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css">
Genau, die müssen zusätzlich rein. Pauschal sollte man sie aber nicht reinnehmen, nur wenn man die Icons auch nutzt. Das erste Laden verzögert sich durch die unheimliche Menge der Icon spürbar. Vllt, gibt es mal eine Light-Variante des Sets, mit nur den "wichtigen" Icons ;)
Zitat von: setstate am 20 April 2015, 12:07:55
... Das erste Laden verzögert sich durch die unheimliche Menge der Icon spürbar. ...
Wie ist das mit dem ersten Laden gemeint? Werden die fonts bei JEDEM html-Aufruf (bzw. Aktualisierung) neu geladen?
Zitat von: mw_fhem am 20 April 2015, 13:02:58
Wie ist das mit dem ersten Laden gemeint? Werden die fonts bei JEDEM html-Aufruf (bzw. Aktualisierung) neu geladen?
Das hängt vom Browser ab. Normalerweise geht sowas in den Cache. In den Entwicklerwerkzeugen des Browsers gibt es eine Kathegorie Netzwerkaktivitäten, da kann man für jedes File die Ladedauer sehen und ob es frisch vom Server geholt wurde oder aus dem Cache kommt.
Zitat von: setstate am 20 April 2015, 11:04:00
Nein, mit indexOf wird der eindeutig passende Status gesucht.
Welchen Anwendungsfall hast du konkret zu lösen?
Nachtrag: es wird bald möglich sein. Wir sind gerade am Thema Konsolidierung von Widgets dran. Dann kann das Symbol auch alles, was Switch kann.
Nur noch ein paar Tests von meiner Seite, dank nesges ist alles schon in den Startlöchern :-)
Super!
In meinem Fall ging es um die Anzeige des Standes der Rollos. z.B. von 1-10% Öffnung dann das Icon oa-fts_garage_door_10 von 11-20% oa-fts_garage_door_20 usw.
Ich weiß nicht, ob es schon angesprochen wurde: wenn ich open-automation-Symbole verwende, rutschen diese aus der Mitte raus :-[
Was mache ich falsch?
Zitat von: mw_fhem am 20 April 2015, 14:45:39
Ich weiß nicht, ob es schon angesprochen wurde: wenn ich open-automation-Symbole verwende, rutschen diese aus der Mitte raus :-[
Was mache ich falsch?
Benutzt du das css, was ich auf github bereitgestellt habe? Dort habe ich das korrigiert, weil es mit dem generierten css nicht passte.
Ich habe alle Dateien ausgetauscht (der Update-Mechsniamus wollte wieder mal nicht). Hat leider nichts gebracht bei den Symbolen.
Wird ja immer besser hier!
Ich bastel gerade an einem Layout, bei dem ich beabsichtige ein CONTENT-Window in der Mitte zu platzieren, welches je nach gewähltem Menü-Punkt entsprechend den Inhalt verändert. Irgendwann in grauer Vorzeit hab ich Mal sowas für eine Web-App mit netten Übergängen zusammengefrickelt. Mal schaun, ob ich die Dateien noch finde.
Bis es aber auch hier zu dieser Lösung kommt spiel ich mich derweil noch mit den "einfacheren" Layout-Aufgaben.
Ich scheitere aber schon am ersten Datenfenster (WETTERWERTE TAL) am Layout. Hier wäre es "schön", wenn man die (Wetter-)Daten in einer Reihe mit vorangestellten Icons setzen könnte (siehe oben links "WETTERWERTE TAL), also inline.
Wie man sieht, ist der horizontale Abstand zwischen dem (Symbol-)Widget und dem (Label-)Widget viel zu groß. Ich tipp mir zwar schon css-seitig die Finger wund, bring's aber nicht hin. Hat jemand eine Idee?
Zitat von: tomster am 20 April 2015, 15:17:06
Wie man sieht, ist der horizontale Abstand zwischen dem (Symbol-)Widget und dem (Label-)Widget viel zu groß. Ich tipp mir zwar schon css-seitig die Finger wund, bring's aber nicht hin. Hat jemand eine Idee?
Zeig mal was du bisher hast, wahrscheinlich fehlt nicht mehr viel. Grundsätzlich bringt die vordefinierte Klasse "left" alles dafür mit. Gib beiden Elementen "left" und pack sie in einen Container der Klasse "centered", dann sollte's passen.
Sorry, hat ein bissl gedauert. hab mir das Layout inzwischen schon wieder zerschossen gehabt ;-)
Hier der aktuelle Status:
<div class="container">
<div class="inline">
<div data-type="symbol" data-icon="oa-temp_temperature" class="cell narrow"></div>
<div class="inline">
<div data-type="label" data-device="Wetterstation" data-get="temperature" data-limits='[-73,19,23]' data-colors='["#6699FF","#aa6900","#bb6242"]' data-unit="%B0C%0A" class="cell big narrow"></div>
</div>
</div>
</div>
Probier mal, ob das das gewünschte ist:
<div class="centered container">
<div class="left">
<div data-type="symbol" data-icon="oa-temp_temperature"></div>
</div>
<div class="left">
<div data-type="label" data-device="Wetterstation" data-get="temperature" data-limits='[-73,19,23]' data-colors='["#6699FF","#aa6900","#bb6242"]' data-unit="%B0C%0A"></div>
</div>
</div>
Wenn nicht, dann füge narrow und cell nochmal zu den inersten Elementen hinzu. Da muss man ein wenig rumprobieren :)
Mit dem class="left" für die beiden Widgets verschiebt er mir den Temp-Wert ganz nach links und das Icon rechts daneben.
Irgendwelche css-Elemente kommen sich da wohl in die Quere...
--edit--
Schmarrn, es vertauscht die beiden Elemente nur, wenn man ein </div> vergisst ;-)
Dennoch ändert sich nix am Problem. Die beiden Widgets wollen einfach nicht näher zusammenrutschen. Vielleicht mögen die sich gar nicht ;-)
Zitat von: mw_fhem am 20 April 2015, 15:17:06
Ich habe alle Dateien ausgetauscht (der Update-Mechsniamus wollte wieder mal nicht). Hat leider nichts gebracht bei den Symbolen.
Was steht bei dir in Zeile 21 in der
www/tablet/lib/openautomation.css
12px ??
Wüsste jetzt nicht, warum du mehr bräuchtest. Evtl. Überlagerung mit anderen Style Vorgaben
Zitat von: tomster am 20 April 2015, 15:50:08
Dennoch ändert sich nix am Problem. Die beiden Widgets wollen einfach nicht näher zusammenrutschen. Vielleicht mögen die sich gar nicht ;-)
Gib dem Label noch was in der Richtung
style="margin-left:-20px"
:D ich hoffe, wir vermischen die Themen gerade nicht.
Meine Frage bezog sich auf das Thema openautomation Icons auf Button. Nicht das Widget Layout Thema.
:)
Zitat
style="margin-left:-20px"
So bekomm ich's näher aneinenander, aber nur, wenn ich class="cell" weglasse. Danke! Jetzt noch v-alignen...
Zitat
:D ich hoffe, wir vermischen die Themen gerade nicht.
Meine Frage bezog sich auf das Thema openautomation Icons auf Button. Nicht das Widget Layout Thema.
:)
Dann vermischen wir gerade. Sorry, mein Fehler!
Zitat von: tomster am 20 April 2015, 16:13:30
So bekomm ich's näher aneinenander, aber nur, wenn ich class="cell" weglasse. Danke! Jetzt noch v-alignen...
Schau mal in die Readme. Ich habe ein paar nutzvolle Klassen dafür hinterlegt: top-space, left-space, left-space-2x, narrow usw.
Die Klasse cell gibt einem Widget mehr Freiraum nach oben und links
Zum Problem mit OpenAutomation-Icons:
Zitat von: setstate am 20 April 2015, 15:59:25
Was steht bei dir in Zeile 21 in der
www/tablet/lib/openautomation.css
12px ??
Wüsste jetzt nicht, warum du mehr bräuchtest. Evtl. Überlagerung mit anderen Style Vorgaben
Ich habe die Basis-Größe der Widgets auf 57 bzw. 70 geändert. Das hat aber keine Auswirkung, wie ich eben getestet habe. Der Code sieht zum Beispiel so aus:
<li data-row="6" data-col="1" datasizex="2" datasizey="2">
<header><fontsize="+1" color="E6E6E6">Heizung</font></header>
<div class="cell big">
<div data-type="button" data-icon="oa-sani_heating" data-url="heizung_eg.html"></div>
</div>
</li>
Zitat von: mw_fhem am 20 April 2015, 16:25:31
Zum Problem mit OpenAutomation-Icons:
Ich habe die Basis-Größe der Widgets auf 57 bzw. 70 geändert. Das hat aber keine Auswirkung, wie ich eben getestet habe. Der Code sieht zum Beispiel so aus:
Okay, verstanden. Das sind unerwartete Größenänderungen, die ich erst einmal selbst bei mir durchspielen muss
Zitat von: setstate am 20 April 2015, 16:31:18
Okay, verstanden. Das sind unerwartete Größenänderungen, die ich erst einmal selbst bei mir durchspielen muss
Aber wie geschrieben, auch mit der "Standard"-Größe besteht das Problem. Danke, dass du dich so intensiv kümmerst! :) :) :)
Hallo,
Ist es eigentlich möglich bei den "alten" Thermostaten HM-CC-TC ebenfalls die Ventilstellung der externen HM-CC-VD unten anzeigen zu lassen ?
Zitat von: setstate am 20 April 2015, 10:20:44
Schaue ich mir heute Abend bei mir live an. Die Templates auf gridster Panel Ebene klingt logischer. Guter Gedanke.
Auch ein toller Vorschlag ist das Sharen von Templates. Ein neuer Thread für die Erklärungen und Screenshots und dem HTML wäre ideal. Ich würde dann auch im Projekt einen Template Ordner anlegen mit den besten Kandidaten.
ich scheine beim laden der Templates timingprobleme zu haben.
Auf der Testumgebung funktioniert alles einwandfrei.
Aber auf dem RaspberryPi findet die Funktion initWidgets() anscheinend keine Widgets mehr >:(
Es wird nur noch der Text angezeigt, aber keine Umsetzung deines Scriptes.
Vielleicht hast du ja einen Tip!
Zitat von: Hermann am 20 April 2015, 17:15:34
Hallo,
Ist es eigentlich möglich bei den "alten" Thermostaten HM-CC-TC ebenfalls die Ventilstellung der externen HM-CC-VD unten anzeigen zu lassen ?
Und wenn du data-valve="actuator" für das Thermostat Widget hinterlegst? Passt das?
data-device muss natürlich passen, d.h. das muss auch das Device sein, was das Reading "actuator" hat. Ansonsten nimm ein Label nur für den einen Wert, wenn man mit zwei devices arbeiten muss.
Zitat von: mc-hollin am 20 April 2015, 17:38:58
Es wird nur noch der Text angezeigt, aber keine Umsetzung deines Scriptes.
Vielleicht hast du ja einen Tip!
Nur Text, das klingt nach JavaScript Fehler. Gibt es welche laut Webconsole?
Ansonsten, hast du auf der problematischen Seite zweimal "Document on ready"? Einmal das offizielle im js file und dann deins im HTML? Dann ist die Abarbeitungsreihenfolge nicht determiniert, meinen Erfahrungen nach. Es kann also sein, dass das init viel zu früh losläuft. Ich baue deine li replacement Lösung dann offiziell ein, dann ist die Reihenfolge festgelegt.
Zitat von: setstate am 20 April 2015, 17:42:46
Und wenn du data-valve="actuator" für das Thermostat Widget hinterlegst? Passt das?
data-device muss natürlich passen, d.h. das muss auch das Device sein, was das Reading "actuator" hat. Ansonsten nimm ein Label nur für den einen Wert, wenn man mit zwei devices arbeiten muss.
Danke, das wars.
Zitat von: Hermann am 20 April 2015, 17:15:34
Hallo,
Ist es eigentlich möglich bei den "alten" Thermostaten HM-CC-TC ebenfalls die Ventilstellung der externen HM-CC-VD unten anzeigen zu lassen ?
Ich habe die "neuen" und scheibe den Wert des Actuators vom RN in den zugehörigen TC.
Zitat von: setstate am 20 April 2015, 18:00:00
Ich baue deine li replacement Lösung dann offiziell ein, dann ist die Reihenfolge festgelegt.
Das wäre natürlich die beste Lösung ;D
Die Webkonsole zeigt mir keinen Fehler an.
Wenn ich am Ende noch ein alert() anfüge werden die Widgets initialisiert !
Vielleicht wäre es auch sinnvoll, wenn du das "data-device" auch in das "li" implementierst und im Template ein Platzhalter für das Datadevice genutzt wird.
Somit blieben die Templates generisch und würden über die "li" direkt initialisiert.
Nur so ein Gedanke.
Zitat von: mc-hollin am 20 April 2015, 18:39:36
Vielleicht wäre es auch sinnvoll, wenn du das "data-device" auch in das "li" implementierst und im Template ein Platzhalter für das Datadevice genutzt wird.
Somit blieben die Templates generisch und würden über die "li" direkt initialisiert.
Nur so ein Gedanke.
Coole Idee, aber haben deine Templates nur ein Device? Was, wenn das Template einen Thermostaten, einen Schaltaktor und ein Fensterkontakt beinhalten soll?
Zitat von: mw_fhem am 20 April 2015, 16:25:31
Zum Problem mit OpenAutomation-Icons:
Ich habe die Basis-Größe der Widgets auf 57 bzw. 70 geändert. Das hat aber keine Auswirkung, wie ich eben getestet habe. Der Code sieht zum Beispiel so aus:
<li data-row="6" data-col="1" data-sizex="2" data-sizey="2">
<header><font size="+1" color="E6E6E6">Heizung</font></header>
<div class="cell big">
<div data-type="button" data-icon="oa-sani_heating" data-url="heizung_eg.html"></div>
</div>
</li>
Ursache gefunden und eine viiiel bessere und einfachere Lösung am Ende als befürchtet. Damit wird alles flexibler.
Lösche einfach in der openautomation.css Zeile 20 und 21 kpl. raus.
line-height: 1;
margin-top:12px;Wenn damit alles bei dir passt, werde ich die Änderung für die Allgemeinheit einchecken.
VG
setstate
Hatten wir das hier beim Update auch schon? :)
Got 6607 bytes for www/tablet/js/widget_volume.js, not 8739 as expected,
Zitat von: selfarian am 20 April 2015, 21:27:39
Hatten wir das hier beim Update auch schon? :)
Got 6607 bytes for www/tablet/js/widget_volume.js, not 8739 as expected,
Warnungen in der Art können immer wieder vorkommen, weil das Zusammenspiel zwischen Github und Fhem-Update ein bisschen hakelig ist. Die gute Nachricht daran ist: Es sind nur Warnungen, keine Fehler :)
Zitat von: setstate am 20 April 2015, 10:20:44
Schaue ich mir heute Abend bei mir live an. Die Templates auf gridster Panel Ebene klingt logischer. Guter Gedanke.
Auch ein toller Vorschlag ist das Sharen von Templates. Ein neuer Thread für die Erklärungen und Screenshots und dem HTML wäre ideal. Ich würde dann auch im Projekt einen Template Ordner anlegen mit den besten Kandidaten.
Hallo,
habt ihr mit den Templates, für zB Menüs, schon weiter gekommen?
Gibt es da eine brauchbare Lösung?
Viele Grüße
Zitat von: Phil__ am 21 April 2015, 08:39:38
Hallo,
habt ihr mit den Templates, für zB Menüs, schon weiter gekommen?
Gibt es da eine brauchbare Lösung?
Viele Grüße
Du willst weiterkommen? ;) kann ich verstehen ...
Also meine Lösung, so wie ich sie mir vorstelle, ist heute Morgen fertig geworden. Es gab einige Hürden zu nehmen, damit es so funktioniert, wie ich es mir vorstelle. Mit Ajax nur Teile austauschen, fadeOut, fadeIn und Back-Button Support.
Ich mache ein commit heute Abend fertig.
Zitat von: setstate am 20 April 2015, 19:44:47
Ursache gefunden und eine viiiel bessere und einfachere Lösung am Ende als befürchtet. Damit wird alles flexibler.
Lösche einfach in der openautomation.css Zeile 20 und 21 kpl. raus.
line-height: 1;
margin-top:12px;
Wenn damit alles bei dir passt, werde ich die Änderung für die Allgemeinheit einchecken.
VG
setstate
Guten Morgen Mario,
eine kurzer Test mit Firefox und Internet Explorer war positiv! Die Symbole sind jetzt inm der Mitte des Kreises! Ob das auch bei anderen Browsern klappt weiß ich nicht. Bzw. auf dem Tablet.
Vielen Dank!
@setstate
Du bist einfach der Wahnsinn!! 8) 8) :D :D
Wird es da auch ein Example geben?
Zitat von: Phil__ am 21 April 2015, 09:07:19
Wird es da auch ein Example geben?
'türlich! Mind. das, womit ich jetzt experimentiert habe
8)
Zitat von: setstate am 21 April 2015, 09:02:43
Also meine Lösung, so wie ich sie mir vorstelle, ist heute Morgen fertig geworden. Es gab einige Hürden zu nehmen, damit es so funktioniert, wie ich es mir vorstelle. Mit Ajax nur Teile austauschen, fadeOut, fadeIn und Back-Button Support.
Ich mache ein commit heute Abend fertig.
Ich hab gerade auch mal was in der Testumgebung probiert.
// event page is loaded
$(document).on('ready readyAgain', function() {
var total = $('li[data-template]').length;
if (total>0){
$('li[data-template]').each(function (index) {
$(this).load($(this).data('template'), function() {
if (index === total - 1) {
$(document).trigger('templatesInitialized');
}
});
});
}
else{
//continue immediately with templatesInitialized
$(document).trigger('templatesInitialized');
}
});
$(document).on('templatesInitialized', function() {
// der alte on ready Bereich
Durch den eigenen Event sind zumindest die Timingprobleme behoben und die Widgets werden initialisiert.
Freu mich auf deine Lösung !!!
Zitat von: nesges am 21 April 2015, 00:25:12
Warnungen in der Art können immer wieder vorkommen, weil das Zusammenspiel zwischen Github und Fhem-Update ein bisschen hakelig ist. Die gute Nachricht daran ist: Es sind nur Warnungen, keine Fehler :)
Leider hatte er danach immer abgebrochen. Aber jetzt hat es funktioniert :-) Danke! :-)
Zitat
Also meine Lösung, so wie ich sie mir vorstelle, ist heute Morgen fertig geworden. Es gab einige Hürden zu nehmen, damit es so funktioniert, wie ich es mir vorstelle. Mit Ajax nur Teile austauschen, fadeOut, fadeIn und Back-Button Support.
Ich mache ein commit heute Abend fertig.
Saugeil! Und das Beste: ich spar mir die Arbeit, die ich mir eigentlich machen wolte ;-6
Aber bitte die Erwartungen nicht so hoch hängen, nicht das ihr dann enttäuscht seid.
Ist ja eh Bananen-Software, reift beim Kunden.
@mc-hollin: was ist der Unterschied zwischen Trigger und normalen Functions-Call? Ist das besser?
Zitat von: setstate am 21 April 2015, 13:16:53
@mc-hollin: was ist der Unterschied zwischen Trigger und normalen Functions-Call? Ist das besser?
Kann ich dir leider auch nicht sagen.
Wollte halt möglichst wenig an deinem Code ändern.
Wie gesagt, dein Projekt hat mich dazu gebracht mich tiefer mit jquery zu beschäftigen.
Dabei habe ich bei Tante Google diesen Ansatz gefunden und ausprobiert..
Normalerweise programmiere ich mit vb.net und VisualWebGUI
Hab noch was gefunden: http://jsperf.com/jquery-trigger-vs-function-call
Ich habe im Wiki mal zusammen geschrieben, wie man eigene Icons in FTUI einbinden kann: FAQ: Wie kann ich eigene Icons verwenden? (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_kann_ich_eigene_Icons_verwenden.3F)
(bin mir noch nicht sicher, ob die FAQ der richtige Platz dafür ist, evtl. verschiebe ich noch)
Zitat von: mc-hollin am 21 April 2015, 14:25:50
Hab noch was gefunden: http://jsperf.com/jquery-trigger-vs-function-call
Demnach sollte man trigger und triggerHandler vermeiden wie der Teufel das Weihwasser ;)
Hallo,
hat jemand einen Tipp wie ich die Lesbarkeit der aktuellen Temperatur im Thermostat-Widget etwas verbessern kann?
Im Moment sieht das bei mir bei ca. 22°C nämlich nicht sehr leserlich aus. Bzw schwer zu erkenn ob nun 21,5 oder 22,5°C herrschen...
Zitat von: rretsiem am 21 April 2015, 20:33:01
Hallo,
hat jemand einen Tipp wie ich die Lesbarkeit der aktuellen Temperatur im Thermostat-Widget etwas verbessern kann?
Im Moment sieht das bei mir bei ca. 22°C nämlich nicht sehr leserlich aus. Bzw schwer zu erkenn ob nun 21,5 oder 22,5°C herrschen...
Noch nicht bequem, du musst im JS-Code rum-editieren -> widget_thermostat.js
Zeile 121 bzw. 123
cfont="18px sans-serif";Wenn du die Buchstaben dynamisch bunt haben willst, Zeile 93/94 reinnehmen, oder fix, indem du Zeile 82 änderst.
var destcolor = this.o.tkColor;
Soooo, ein Update ist bei Github gelandet: data-template und data-type="pagetab"
Mit data-template kann man bestimmte HTML Teile auslagern und wiederverwendbar in mehreren Seiten einbinden.
Mit folgendem HTML-Code kann lagert man zum Beispiel ein ganzes Gridster Element kpl. wiederverwendbar aus:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.html"></li>
Mit data-type="pagetab" kann man auf eine andere Seite wechseln
Diese Beispiel ist der kpl. Inhalt der menu.html, welche man mit data-template="menu.html" in jeder index_*.html Seite einbinden könnte:
<html>
<body>
<header>MENU</header>
<div class="cell">
<div data-type="pagetab" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="index_2.html" data-icon="fa-sliders" class="cell"></div>
<div data-type="pagetab" data-url="index_3.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagetab" data-url="index_4.html" data-icon="fa-hotel" class="cell"></div>
<div data-type="pagetab" data-url="index_5.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagetab" data-url="index_6.html" data-icon="fa-database" class="cell"></div>
<div data-type="pagetab" data-url="index_7.html" data-icon="fa-fax" class="cell"></div>
</div>
</body>
</html>
(http://knowthelist.github.io/fhem-tablet-ui/menu.png)
Super, hat ja doch noch gestern geklappt ;)
In der Testumgebung funktioniert es!
Jetzt werde ich mal dein PageTab ausprobieren.
Implementierst du denn auch noch das Verzeichnis "Templates"?
Muss denn im Menutemplate der HTML und Body Tag vorhanden sein?
Eigentlich braucht man doch nur den Header und das Div-Konstrukt.
Hab ich das richtig gesehen, dass du "data-include" heraus genommen hast?
Sollte vielleicht kommuniziert werden.
Wenn jetzt noch über "<meta name="theme">" das Aussehen gesteuert werden kann,... 8) 8) 8)
Echt Klasse Arbeit!
Zitat von: mc-hollin am 22 April 2015, 07:39:23
Muss denn im Menutemplate der HTML und Body Tag vorhanden sein?
Eigentlich braucht man doch nur den Header und das Div-Konstrukt.
Hab ich das richtig gesehen, dass du "data-include" heraus genommen hast?
Sollte vielleicht kommuniziert werden.
Es müsste auch ohne gehen, aber mit ist es valides HTML z.B. für Standalone-Tests oder falls ein Editor darüber meckern würde.
"data-include" habe ich nie richtig angepriesen oder dokumentiert, von daher habe ich es stillschweigend verschwinden lassen. Aber ja, "data-include" geht ab sofort nicht mehr.
Zitat von: setstate am 22 April 2015, 08:13:23
Es müsste auch ohne gehen, aber mit ist es valides HTML z.B. für Standalone-Tests oder falls ein Editor darüber meckern würde.
Ok, ich hab gedacht, dass die Load-Funktion das komplette Html einbettet.
Macht es aber gar nicht. Somit ist das valide HTML klar der bessere Ansatz.
Man lernt nie aus.
Ich wollte die Neuerungen testen und musste feststellen, dass der Update-Mechanismus nicht mehr geht (zumindest bei mir...). Den tablet-Ordner habe ich komplett gelöscht, aber ich bekomme folgende Meldung: 2015-04-20 02:22:36 Global global nothing to do...
Uii, setstate, da hast Du dich Mal wieder selber übertroffen!
Ich bin begeistert!
bin begeistert! 8) 8) 8)
Gibt es durch das Auslagern von Menüs etc., eigentlich verzögerungen beim Laden?
Coole Sache das mit den Templates, gute Arbeit! :-)
Was mir jetzt aufgefallen ist: Bei mir zeigt er beim Laden jetzt immer an, das er die Temperaturen der einzelnen Thermostate auf 17°C setzt. Im FHEM log erscheint dann auch ein "CUL_HM set <zensur> desired-temp 17" pro Thermostat. Ist das so gewollt oder ist mir das vorher nicht aufgefallen?! :-)
Zitat von: selfarian am 22 April 2015, 14:34:02
Coole Sache das mit den Templates, gute Arbeit! :-)
Was mir jetzt aufgefallen ist: Bei mir zeigt er beim Laden jetzt immer an, das er die Temperaturen der einzelnen Thermostate auf 17°C setzt. Im FHEM log erscheint dann auch ein "CUL_HM set <zensur> desired-temp 17" pro Thermostat. Ist das so gewollt oder ist mir das vorher nicht aufgefallen?! :-)
Habe ich bei mir auch beim Volume Widget. Ein Schönheitsfehler, den ich mir noch anschauen werde. Das ist der lokal gespeicherte Startwert. Sollte das Control einstellen, wenn kein aktueller Wert vorliegt, aber nicht senden.
Korrektur: lokaler Startwert gibt es zur Zeit nur beim Dimmer. Es muss was mit den Ready-Flag und dem asynchronen Initiieren zu tun haben.
Zitat von: Phil__ am 22 April 2015, 10:54:47
bin begeistert! 8) 8) 8)
Gibt es durch das Auslagern von Menüs etc., eigentlich verzögerungen beim Laden?
Verzögerungen dürfte es nicht verursachen. Keine spürbaren.
Zitat von: setstate am 22 April 2015, 15:32:33
Verzögerungen dürfte es nicht verursachen. Keine spürbaren.
Ich bin gerade am Probieren mit diesem neuen "Feature". So ganz habe ich aber ehrlich gesagt die Zusammenhänge nicht verstanden (liegt wohl an mir :-\). Auch noch nicht was es bringen soll. Ich verzweige zu Unterseiten mit dem button-Widget. Aber wenn das pagetab/template-Widget keine Geschwindigkeitsvorteile hat, würde es sich für mich nicht lohnen alles umzustricken? Oder sehe ich das falsch?
Zitat von: mw_fhem am 22 April 2015, 15:37:16
Ich bin gerade am Probieren mit diesem neuen "Feature". So ganz habe ich aber ehrlich gesagt die Zusammenhänge nicht verstanden (liegt wohl an mir :-\). Auch noch nicht was es bringen soll. Ich verzweige zu Unterseiten mit dem button-Widget. Aber wenn das pagetab/template-Widget keine Geschwindigkeitsvorteile hat, würde es sich für mich nicht lohnen alles umzustricken? Oder sehe ich das falsch?
Da hast du Recht, mit dem Button Widget geht das genauso. Wenn du zufrieden bist, würde ich auch nix umbauen. Ich wollte nur ein ein anderes Aussehen und ein soften Übergang mit dem Pagetab. Es wird nicht die gesamte Seite neu geladen, sondern nur der Gridster-Baum, Scripts und Styles bleiben unverändert.
Templates kann man aber auch unabhängig davon nutzen, wenn du zum Beispiel auf jeder Unterseite die Außentemperatur rechts oben haben willst. Dann baut man das nur einmal und setzt auf jede Seite den Verweis.
Zitat von: setstate am 22 April 2015, 15:45:18
Da hast du Recht, mit dem Button Widget geht das genauso. Wenn du zufrieden bist, würde ich auch nix umbauen. Ich wollte nur ein ein anderes Aussehen mit dem Pagetab.
Templates kann man aber auch unabhängig davon nutzen, wenn du zum Beispiel auf jeder Unterseite die Außentemperatur rechts oben haben willst. Dann baut man das nur einmal und setzt auf jede Seite den Verweis.
Das würde ich dann wohl bei mir mit der Uhrzeit machen. Was bei diesem Modul auch "schöner" ist als bei button ist der sanfte Übergang, weshalb es mir schneller vorkommt. Aber die Augen lassen sich gerne mal trügen...
Bei meinen Tests ist mir folgendes aufgefallen:
Bisher navigiere ich durch alle meine html-Seiten über das button-Widget. Nun habe ich ein pagetab-Widget angelegt um auf meine "Hauptseite" zu kommen: <div data-type="pagetab" data-url="home_eg.html" data-icon="fa-home"></div>
Das funktioniert soweit auch. Allerdings fehlen dann die Open-Automation-Icons auf meiner Hauptseite. Die werden offensichtlich bei diesem Widget nicht neu geladen. Ist das ein Fehler oder muss ich noch was ergänzen?
Zitat von: mw_fhem am 22 April 2015, 16:31:37
Bei meinen Tests ist mir folgendes aufgefallen:
Bisher navigiere ich durch alle meine html-Seiten über das button-Widget. Nun habe ich ein pagetab-Widget angelegt um auf meine "Hauptseite" zu kommen: <div data-type="pagetab" data-url="home_eg.html" data-icon="fa-home"></div>
Das funktioniert soweit auch. Allerdings fehlen dann die Open-Automation-Icons auf meiner Hauptseite. Die werden offensichtlich bei diesem Widget nicht neu geladen. Ist das ein Fehler oder muss ich noch was ergänzen?
Das kann passieren, die erste Seite muss alles "beschaffen", die angesprungene Seite wird nur netto geladen. Man muss also des entsprechende CSS File auf der ersten Seite einbinden, um sie auf den weiteren nutzen zu können. Starte mal auf der Hauptseite, gehe zur Seite2 und wieder zur Hauptseite, dann sollte es klappen. Vllt. fällt mir dazu noch was ein ...
Zitat von: setstate am 22 April 2015, 16:42:12
Das kann passieren, die erste Seite muss alles "beschaffen", die angesprungene Seite wird nur netto geladen. Man muss also des entsprechende CSS File auf der ersten Seite einbinden, um sie auf den weiteren nutzen zu können. Starte mal auf der Hauptseite, gehe zur Seite2 und wieder zur Hauptseite, dann sollte es klappen. Vllt. fällt mir dazu noch was ein ...
Das Problem sitzt wie so oft davor... Ich hatte die Icons nicht eingebunden :P
Ganz gut, das ich eine index2.html und keine index_2.html auf dem System hatte.
Aber es gibt ja immer noch Backups.
Danke für diese toole UI.
sehe ich das richtig das man nun zwar ein paar div's aus anderen html's includen kann aber im "hauptfile" immer noch jedes listitem (<li>) definieren muss?
geht sowas wie
<ul>
<!-- meue head, left, right-->
<div data-template="menue_full.html"></div>
<!-- meue head, left, right-->
<li>inhalt</li>
<li>inhalt2</li>
</ul>
eine zeile code und das ganze gerüst wird eingebaut (zb bei mir header, leftmenue, rightmenue -> 6 listitems). wenn ich es so teste zerhaut es natürlich das layout. quasi ein php include ersatz
EDIT: hab nun mal alles umgestellt auf pagetab data-template und es funktioniert ganz gut. Aber ich habe im firefox eine art "blitzen" beim klick auf menue punkt. es sieht fast so aus als würde er die seite dan 2 mal nacheinander laden.
und eine frage: brauch die anderen seiten im heade die meta, link und script daten? oder reicht das in der 1. (index)?
Zitat von: chris1284 am 22 April 2015, 18:48:31
sehe ich das richtig das man nun zwar ein paar div's aus anderen html's includen kann aber im "hauptfile" immer noch jedes listitem (<li>) definieren muss?
Für Gridster dürfen in einem ul nur li folgen. Mit dem div, was eine Liste von zusätzlichen li mitbringen soll, funktioniert das nicht mehr. Man könnte aber nach dem Laden mit .unwrap() den parent-div entfernen, dann dürfte das gehen. Werde ich mal sehen, ob man das optional mit einbauen kann.
Thema Header: Der Header bleibt beim pagetab unangetastet, ich tausche nur den "div.gridster" Teil aus. D.h. der Einsprungsheader der ersten Seite (index.html) muss für alle folgenden Seiten alles nötige mitbringen.
Zitat von: setstate am 22 April 2015, 19:43:28
Man könnte aber nach dem Laden mit .unwrap() den parent-div entfernen, dann dürfte das gehen. Werde ich mal sehen, ob man das optional mit einbauen kann.
Interessant find ich an der Stelle, dass das funktioniert:
<script>
$("<div/>").load("test.html", function() {
$(".gridster > ul").append($(this).children());
});
</script>Aber sobald der Code innerhalb von
$(document).on('ready', function() {} ) steht, falsch eingehangen wird. Scheint ein Timingrproblem in Gridster zu sein. Zur Not könnte man ne loadTemplate(url) Funktion draus machen.
Bei Github gibt es eine ganze Menge kleine Änderungen von nesges und setstate.
- Pfad zum FHEM geändert http://forum.fhem.de/index.php/topic,36122.msg287509.html#msg287509
- Fix gegen ungewolltes Senden an FHEM http://forum.fhem.de/index.php/topic,34233.msg288247.html#msg288247
- RegEx beim Symbol Widget http://forum.fhem.de/index.php/topic,34233.msg287600.html#msg287600
- widget_select: data-alias (ermöglicht die Verwendung von Aliasen für Items)
- widget_circlemenu: data-circle-radius / data-item-diameter
Danke! :)
Da die Einführung von Templates sehr guten Anklang gefunden hat hätte ich noch eine Idee für eine Erweiterung.
Aus meiner Sicht ist es für Einsteiger erst etwas verwirrend das Gridster mit den Widgets zu konfigurieren.
Hier wäre doch eine Editseite mit Drag und Drop und Resize optimal.
So wie hier: https://rawgit.com/ManifestWebDesign/angular-gridster/master/index.html#/dashboard
Es könnten so alle Seiten online aufgebaut werden und zusätzlich über eine Auswahl der Templates gefüllt werden.
Die editierten Designs sollten hierbei serialisiert werden.
Ich hab mich mal daran versucht...
Naja die Einarbeitung in jQuery überwiegt noch die Zeit der Programmierung :o
Aber vielleicht gibt es ja den einen oder anderen der so was schon mal realisiert hat.
Das Thema Editor ist durchaus interessant, gerade für Einsteiger und Nicht-HTML-CSS-Entwickler
Für mich war das aber für FTUI nie ein Ziel. Für mich war der Ansatz wie bei Bootstrap http://de.m.wikipedia.org/wiki/Bootstrap_%28Framework%29 völlig ausreichend für dieses UI, zumal die Erstellung ja eine einmalige Sache bleibt, liegt der Focus eher bei der Benutzung und Aussehen.
Wenn sich Leute finden, die einen Editor bauen wollen, würde ich toll finden und unterstützen. Das Resultat muss aber auch so einfach wie möglich benutzbar werden. Nicht wie beim Editor vom Floorplan, wo ich nach kürzester Zeit die Lust an der Klick-Orgie verlor, weil die vielen Angaben (besonders x und y) sowas von mühselig zu finden waren und am Ende das Aussehen trotzdem nicht befriedigend ausfiel.
Ein Editor müsste auf FTUI Widget Ebene arbeiten, also all die Attribute anbieten, die ein Thermostat, Switch, Symbol braucht. Das Edit und Delete Icon dürfte nur im Editmode erscheinen, nicht dauerhaft im Betrieb. Die Details könnte man aber noch abstimmen...
Zitat von: setstate am 23 April 2015, 11:32:43
...
Wenn sich Leute finden, die einen Editor bauen wollen, würde ich toll finden und unterstützen. Das Resultat muss aber auch so einfach wie möglich benutzbar werden. Nicht wie beim Editor vom Floorplan, wo ich nach kürzester Zeit die Lust an der Klick-Orgie verlor, weil die vielen Angaben (besonders x und y) sowas von mühselig zu finden waren und am Ende das Aussehen trotzdem nicht befriedigend ausfiel.
Ein Editor müsste auf FTUI Widget Ebene arbeiten, also all die Attribute anbieten, die ein Thermostat, Switch, Symbol braucht. Das Edit und Delete Icon dürfte nur im Editmode erscheinen, nicht dauerhaft im Betrieb. Die Details könnte man aber noch abstimmen...
Kann ich mich nur anschließen. War ja auch der Grund warum ich hier gelandet bin und total begeistert bin.
Ich hatte eigentlich nur an einen Editor gedacht, der das Design von Gridster erleichtert.
Also eher ein AddOn auf Gridster. Dann würde sich die Hauptarbeit nur noch auf die Erstellung der Templates konzentrieren.
Gerade am Anfang baut man doch öfters mal die Anordnung der Widgets um.
Ach, weil's mir gerade einfällt für die iPad-Nutzer (vielleicht funzt es auch bei Android; kann es gerade nicht testen).
Wenn man das Tablet-UI im Safari aufruft, dann greift dort das sog. "Elastic Scrolling" (wie man es vielleichtvon "Pull-to-Refresh" kennt). Das kann bei der Eingabe von Temperaturwerten im Thermostat-Widget manchmal zu unerwünschtem "Wegscrollen" führen, wenn man ein bissl daneben toucht.
Man kann das bestimmt eleganter einbauen, aber ich hab mir in die index.html folgende Zeilen gepackt:
<script>
function BlockMove(event) {
// Tell Safari not to move the window.
event.preventDefault() ;
}
</script>
<body ontouchmove="BlockMove(event);" >
Damit bleibt das gesamte UI wie festgenagelt und nix kann mehr verrutschen.
@ tomster: das war das was fehlte...aber wo baue ich das in die Index.html ein?
LG. Marie
Aber damit funktionieren doch einige Widgets garnicht mehr? Dimmer, Thermostat
Ich versuche, die Oberfläche 100% in Höhe und Breite zu bauen, damit kein scroll nötig ist.
Auf dem Telefon sieht das anders aus. Dort muss mehr Platz zum Touch+Move bleiben.
Eine Mobil-Seite mit eigenem Theme anzubieten, ist mein nächstes Ziel, womit ich gestern schon begonnen habe. Vielleicht stolpere ich dann auch über dieses Thema. Für mobile Devices gibt es unterschiedliche Events, mit denen man die Absicht des Users erkennen kann. Touchstart, touchmove, touchend. Aber dann wartet man beim Klick auf einen Switch einige Millisekunden, um auf den Move zuwarten. Wenn kein Move folgt, ist es ein Klick. Diese Verzögerung hat mir auch nicht gefallen, deshalb reagiere ich schon auf touchstart.
Zitat
@ tomster: das war das was fehlte...aber wo baue ich das in die Index.html ein?
Im Header des Quelltexts nach:
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->suchen und durch:
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
[color=red]<script>
function BlockMove(event) {
// Tell Safari not to move the window.
event.preventDefault() ;
}
</script>
</head>
<body ontouchmove="BlockMove(event);">[/color]
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->ersetzen.
Zitat
Aber damit funktionieren doch einige Widgets garnicht mehr? Dimmer, Thermostat
Ich versuche, die Oberfläche 100% in Höhe und Breite zu bauen, damit kein scroll nötig ist.
Auf dem Telefon sieht das anders aus. Dort muss mehr Platz zum Touch+Move bleiben.
Ich hab zwar bislang nur das Thermostat-Widget probiert, aber das funktioniert bei mir weiterhin.
Mir ging's nur darum zu verhindern, dass ein Touch-Event mit dem Finger nur ein bisserl neben z.B. dem Thermostat-Widget dazu führt, dass man das Elastic Scrolling ausführt und nicht die Einstellung am Widget vornimmt. Wenn der BlockMove aber Auswirkungen auf die Widgets hat, muss ich es halt wieder entfernen.
Ach ja, ich gehe derzeit davon aus, dass man ohnehin fast für jedes Device (Tablet, Smartphone oder Computer) ein eigenes HTML-Set erstellen muss, weil zum Einen gridster selbst, zum Anderen die Widgets nicht ausreichend "responsive" sind/ sein können.
Klar, der BlockMove-Event ist auf dem Handy eher kontraproduktiv, aber auf dem Micker-Display gehört in meinen Augen sowieso weniger Klicki- äähh- Touchibunti hin, als eine vernünftige Menüstruktur. In den Untermenüs wär dann immer noch genug Platz für die Widgets. Aber halt nur für ein Thermostat und nicht für eine ganze Thermostat-Armada...
Was mir übrigens gerade aufgefallen ist, seit ich mir vorhin ein iPad ausgeliehen habe:
Wenn ich mir die UI-URL als Bookmark auf den Homescreen lege und darüber aufrufe, dann wird das UI nur alle paar Aufrufe korrekt angezeigt. Ich muss dann die Web-App wieder schliessen und (einige Male) neu starten. Manchmal wird gridster nicht geladen, manchmal stimmen die Formatierungen nicht, etc.
Über Safari direkt habe ich kein Problem.
Kann das jemand reproduzieren?
Das hatte ich vor kurzem auch: http://forum.fhem.de/index.php/topic,34507.msg284946.html#msg284946
Heute Morgen funktionierte es auf dem gleichen iPhone alles wieder. Kann nur an einem geänderten FHEM Modul liegen. Ich habe an phone oder FTUI nix geändert dafür.
Heute ist mir aufgefallen, das das Symbol-widget nicht mehr meine offenen Fenster anzeigt.
Ausserdem ist mir aufgefallen, wenn ich das UI per IP von meinen Laptop aufrufe fehlen die Slider.
fhem und ui sind aktuell.
Zitat von: stromer-12 am 23 April 2015, 14:58:05
Heute ist mir aufgefallen, das das Symbol-widget nicht mehr meine offenen Fenster anzeigt.
Ausserdem ist mir aufgefallen, wenn ich das UI per IP von meinen Laptop aufrufe fehlen die Slider.
fhem und ui sind aktuell.
zeig mal dein symbol HTML, bitte. Ich hab da ziemlich radikal umgebaut, evtl was übersehen.
Zitat von: tomster am 23 April 2015, 13:04:02
Ach ja, ich gehe derzeit davon aus, dass man ohnehin fast für jedes Device (Tablet, Smartphone oder Computer) ein eigenes HTML-Set erstellen muss, weil zum Einen gridster selbst, zum Anderen die Widgets nicht ausreichend "responsive" sind/ sein können.
Mit Client-abhängigen Viewport-Einstellungen und CSS Zoom kann man da schon einiges erreichen, sofern die Displayausrichtung und das Breitenverhältnis bei den Clients (einigermassen) gleich sind. Ich nutze hier das gleiche UI auf einem 7" Tablett, einem 10" Tablett, einem Smartphone und den Destop-PCs. Ich löse die Clienterkennung zwar serverseitig mit PHP, das sollte aber auch mit JS nachzubauen sein. Schau dir mal ui.php (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/php/room/ui.php) Zeile 32ff an.
Mit dem Backup geht das Symbol wieder. Der Fehler mit dem IP aufruf bleibt.
<div class="cell">
<div data-type="symbol" data-device="CUL_HM_HM_SEC_SC_2_tuer" class="narrow"></div>
</div>
Zitat von: stromer-12 am 23 April 2015, 15:16:08
<div class="cell">
<div data-type="symbol" data-device="CUL_HM_HM_SEC_SC_2_tuer" class="narrow"></div>
</div>
Danke! Fehler gefunden und korrigiert, in einem der nächsten Updates sollte die aktualisierte Fassung ausgeliefert werden.
Gibt's eigentlich auch schon irgendetwas, was wie das "push-widget" nur in die andere Richtung ist?
Also etwas, das durch einen Trigger in FHEM eine Aktion auf dem Tablet-UI auslöst.
Ich dachte da z.B. an eine Klingel, die beim Drücken eine Aktion im UI triggert, und dann auf die webcam.html "geschaltet" wird.
--edit--
Sorry, wenn's zu fordernd klintgt, aber ist mir grad so eingefallen, als ich die Buttons für mein Layout, bzw. deren Funktionen zusammengestellt habe...
Zitat von: tomster am 23 April 2015, 16:14:44
Gibt's eigentlich auch schon irgendetwas, was wie das "push-widget" nur in die andere Richtung ist?
Also etwas, das durch einen Trigger in FHEM eine Aktion auf dem Tablet-UI auslöst.
Ich dachte da z.B. an eine Klingel, die beim Drücken eine Aktion im UI triggert, und dann auf die webcam.html "geschaltet" wird.
--edit--
Sorry, wenn's zu fordernd klintgt, aber ist mir grad so eingefallen, als ich die Buttons für mein Layout, bzw. deren Funktionen zusammengestellt habe...
Ich wüsste zwar spontan nicht, wie ich es für mich nutzen könnte, aber die Idee ist gut. :-)
Von mir auch Daumen hoch, ist eine gute Idee.
Entwickler vor! Kopiert ein Basis-Widget, und implementiert die zwei Funktionen "init" und "update"
Wenn dann per longpoll ein Event bei update reinkommt und Device und Reading übereinstimmt, wird das HTML Element, was bei "init" erzeugt wurde, verändert/angezeigt/was auch immer
Es könnte zum Beispiel ein modales Div von hidden auf show geschaltet werden und damit on top aufpopen
Irgendwo in diesem Post hatte mir jemand mal ein code-snippet gepostet, das eben bei einer gewissen Bedingung (alarm) das Glocken-icon eingeblendet hat
Coole Idee! Wie wär's mit einem generischen data-change-action Attribut, das bei Wertänderung beliebigen JS-Code eval'ed?
https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_famultibutton.js
<div data-type="symbol" data-device="TEST" class="narrow"
data-before-change-action="$.toast($(this).data('device') + ' changed from ' + $(this).data('value') + ' to ' + state)"
data-after-change-action="eval($(this).data('before-change-action'))"
></div>
"Nachteil": Erfordert Kenntnisse der Widget-Interna. Dafür steht einem aber auch jede Schweinerei offen ;)
Zitat von: selfarian am 23 April 2015, 16:44:38
Irgendwo in diesem Post hatte mir jemand mal ein code-snippet gepostet, das eben bei einer gewissen Bedingung (alarm) das Glocken-icon eingeblendet hat
http://forum.fhem.de/index.php/topic,34233.msg281060/topicseen.html#msg281060
Zitat von: setstate am 23 April 2015, 14:49:55
Das hatte ich vor kurzem auch: http://forum.fhem.de/index.php/topic,34507.msg284946.html#msg284946
Heute Morgen funktionierte es auf dem gleichen iPhone alles wieder. Kann nur an einem geänderten FHEM Modul liegen. Ich habe an phone oder FTUI nix geändert dafür.
Ich hab grad Mal einen Versuch in's Blaue gestartet und einfach
<meta http-equiv="Expires" content="-1"> in der index.html hinzugefügt. Scheint zu funktionieren.
--edit--
Nun ja, sagen wir einmal: es scheint besser zu funktionieren...
Zitat von: stromer-12 am 23 April 2015, 14:58:05
wenn ich das UI per IP von meinen Laptop aufrufe fehlen die Slider.
fhem und ui sind aktuell.
In der Web-Console taucht folgender Fehler bei aufruf mittels IP auf.
SecurityError: The operation is insecure. jquery.min.js line 2 > eval:16:0
TypeError: pwrng is undefined jquery.min.js line 2 > eval:63:5Ohne Slider ist der Fehler weg
Zitat von: tomster am 23 April 2015, 16:53:44
Nun ja, sagen wir einmal: es scheint besser zu funktionieren...
Jetzt geht's bei mir auch nicht mehr. So ein sch...
Wenn das jemand lösen könnte ...
Wenn ich einen 2. Dimmer darstellen lassen will, wird er nicht angezeigt und in der Webconsole steht folgender Fehler:
TypeError: $(...).data(...) is undefined jquery.min.js line 2 > eval:57:28
<div data-type="dimmer" data-device="CUL_HM_HM_LC_BL1_FM_Wz" data-get="pct" data-get-on="[0-9]{1,3}|on" data-get-off="off" data-icon="fa-bars" class="cell"></div>
Die beiden Dimmer sind in verschieden Zellen definiert. Jeder für sich allein erzeugt keinen Fehler.
Edit: Nur im Firefox unter Windows und nur mit IP-Adresse, mit Hostnamen funktioniert es.
Auf dem Android-Tablet im WVC funktioniert es aber mit IP-Adresse.
mmh
Zitat von: stromer-12 am 23 April 2015, 19:09:08
Edit: Nur im Firefox unter Windows und nur mit IP-Adresse, mit Hostnamen funktioniert es.
Auf dem Android-Tablet im WVC funktioniert es aber mit IP-Adresse.
mmh
Also, ich habe jetzt extra meine Windows-Kiste ausgegraben und angeworfen. Keine Fehler im Firefox mit IP-URL und zwei Dimmern. Hat jemand noch eine Idee?
Wie hast du denn die Dimmer in FHEM definiert?
Ich habe jetzt das UI Verseichnis neu erstellt, aber da keine Besserung.
Mein Rechner hier Windows 7 mit FF 37.0.2
Auf einen anderen Rechner mit XP mit FF 35.0 gleicher Fehler
Es sind HM Blind Aktoren
Auf meinen Android Tablet wird die Seite in Chrome und WVC korrekt dargestellt.
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.2
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'WVC_CL'}; var wvcUserCssFile="webviewcontrol.css"</script>
<script type="text/javascript" charset="UTF-8"></script>
<!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,small -->
<!-- available data-type: contact,dimmer,homestatus,label,push,slider,switch,thermostat,volume -->
<div class="gridster">
<ul>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="2">
<header>ESSZIMMER</header>
<div data-type="dimmer" data-device='CUL_HM_HM_LC_BL1_FM_Ez' data-get="pct" data-get-on='[0-9]{1,3}|on' data-get-off="off" data-icon="fa-bars" class="cell"></div>
</li>
<li data-row="3" data-col="5" data-sizex="2" data-sizey="2">
<header>WOHNZIMMER</header>
<div data-type="dimmer" data-device="CUL_HM_HM_LC_BL1_FM_Wz" data-get="pct" data-get-on="[0-9]{1,3}|on" data-get-off="off" data-icon="fa-bars" class="cell"></div>
</li>
</ul>
</div>
</body>
</html>
Zitat von: stromer-12 am 23 April 2015, 20:38:46
Es sind HM Blind Aktoren
Also streng genommen, eigentlich keine Dimmer sondern "Rolladen-Aktoren", oder?
Zitat von: tomster am 23 April 2015, 20:46:36
Also streng genommen, eigentlich keine Dimmer sondern "Rolladen-Aktoren", oder?
Ja, es sind Rollladen-Aktoren.
Dann kann ich leider Nichts nachstellen, da ich keine Rolladen-Aktoren habe. Ich vermute allerdings, dass es zwischen Dimmern und Roll(l)adenaktoren wohl einen Unterschied gibt. Allein schon, weil hier ein paar Tipps zu Slidern unter FHEM angeführt sind:
http://www.fhemwiki.de/wiki/Slider_f%C3%BCr_HM-Rollladensteuerung_anzeigen
Mit Dummys passiert bei mir das selbe, wenn ich data-get von pct auf state ändere.
Mit dem Hostnamen funktioniert der Aufruf, aber mit der IP nicht.
Ich habe auch gerade nochmal mein FHEM mit update force aktuallisiert, und trotzdem get es unter Windows mit IP nicht aber mit dem Hostnamen.
Unter Android gehen beide Aufrufe.
Gerade mal den IE rausgekramt, da geht die Seite auch mit beiden Aufrufen.
Ich hab's auch grad mit Dummies und mit "echten" Dimmern probiert. Ich hab kein Problem.
Aber es hört sich für mich irgendwie nicht nach einem FHEM-seitigen, als vielmehr nach einem DNS/hosts-Problem an.
Du willst aber nicht zufällig Aktoren eines 2. FHEM-Rechners einbinden, oder über eine https-Verbindung zugreifen, oder?
ganz normaler Zugriff über http.
Alle Aktoren sind über eine einzige Fhem Instanz eingebunden.
Zitat von: bmwfan am 06 April 2015, 16:42:40
Zu den Links:
Wenn ich das Frontend durch Eingabe des Browserpfades im Browser eingebe (http://192.168.178.1:8083/fhem/www/tablet/index.html), gehen alle weiteren Links zu Unterseiten, allerdings lädt es keinerlei Inhalte aus fhem (Zustände, Werte..). Da stimmt dann anscheinend ein interner Pfad nicht.
Rufe ich das Frontend aus FHEM auf, Werden die Inhalte geladen aber, da das root-Verzeichnis /fhem ist, geht kein Link. Ändere ich in der index.html den Pfad zum Link ab
<div class="container">
<a id="room_index" href="index.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(42, 42, 42);"></i>
</a>
<a id="room_eg" href="./www/tablet/eg.html" class="cell fa-stack fa-2x">
<i id="bg" class="fa fa-stack-2x fa-circle" style="color: rgb(111,69,0);"></i>
<i id="fg" class="fa fa-stack-1x fa-film" style="color: rgb(42, 42, 42);"></i>
</a>
</div>
geht der Einsprung und seltsamerweise auch der Rücksprung zur index.html, aber der 2.te Aufruf von eg.html geht nicht, da dann /fhem/www/tablet/www/tablet/eg.html angesprochen wird.
---SNIP---
Servus!
Ich hab ein ähnliches Problem.
Beim Aufruf des UI per http://host:8083/fhem/tablet funktioniert alles, jedoch wird man beim Klick auf Links, die auf andere UI Seiten führen sollten, auf das FHEM Backend geleitet (Readings funktionieren!).
Wenn die UI per http://host:8083/fhem/tablet/index.html aufgerufen wird, passt alles (Reading funktionieren ebenfalls).
An sich nicht so tragisch, wenn man gleich /index.html als Favorit speichert, allerdings sieht es jetzt auch seltsam aus, wenn man den neuen Pagetab auf der Seite hat:
ohne Angabe der index.html wird das Backend anstelle der Pagetab geladen und keine Readings mehr (Wie am Foto zu sehen. Ist erstmal ne Testseite :) ). Mit /tablet/index.html funktioniert es.
Wäre interessant zu wissen, was das Problem sein könnte.
Viele Grüße
Berndp
Dieses Problem kann ich reproduzieren!
Der Aufruf mit http://host:8083/fhem/tablet/ funktioniert hingegen prinzipiell. Das UI zeigt mir dann jedoch alle pagetab-Links als "aktiv" an...
Zitat von: berndp am 23 April 2015, 22:05:33
Beim Aufruf des UI per http://host:8083/fhem/tablet funktioniert alles, jedoch wird man beim Klick auf Links, die auf andere UI Seiten führen sollten, auf das FHEM Backend geleitet (Readings funktionieren!).
Wenn die UI per http://host:8083/fhem/tablet/index.html aufgerufen wird, passt alles (Reading funktionieren ebenfalls).
Ist leider ein seltsames Verhalten in HTTPSRV. Die Lösung steht im anderen Thread, ich kopiere mal hierher:
Zitat von: nesges am 14 April 2015, 16:47:50
HTTPSRV, das Modul mit dem fhem-tablet-ui in Fhem eingebunden wird, verhält sich leider ein bisschen seltsam: Da (in der Standardkonfiguration) die aufgerufene Seite nicht auf einen Slash endet ("tablet" und nicht "tablet/") wird der Teil des URLs einfach ersetzt, statt einen Slash zu ergänzen und das Ziel daran anzuhängen. Abhilfe schafft eine Korrektur der HTTPSRV-Definition:
define tablet_ui HTTPSRV tablet/ ./www/tablet Tablet Frontend
War bisher nicht aufgefallen, danke für den Hinweis! :)
Das ändert allerdings nur den Link in FHEMWEB. Wenn du trotzdem noch von Hand ohne Slash aufrufst, wird der Fehler weiterhin auftreten.
PS: Jetzt auch in FAQ: Warum führen mich Links auf andere Seiten zurück zu FHEMWEB? (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Warum_f.C3.BChren_mich_Links_auf_andere_Seiten_zur.C3.BCck_zu_FHEMWEB.3F)
So, bei mir liegt der Fehler im meiner uralten FF Installation welche ich schon Seit Jahren mitwandert (portable)
Habe FF von einen anderen Nutzer gestartet und da funktionieren die Dimmer.
Muß wohl mal meinen FF aufräumen.
Schön, dass es jetzt hinhaut.
Moin Moin,
als erstes möchte ich meinen Dank und Respekt hier an den Erfinder und alle anderen die daran mitarbeiten raushauen -> großes Kino !!!!
Zum ersten mal ist der WAF so hoch das meine Frau es benutzt....
Leider habe ich keinen Plan von der Programmierung, aber es klappt schritt für schritt.
Jetzt klemmt es aber:
Ich habe einen Slider eingefügt von min 0 bis max 100. Funktioniert auch, ich kann damit mein Rollo rauf und runter fahren und bekomme es am Slider auch angezeigt.
Nur wenn das Rollo ganz auf oder zu ist zeigt der slider falsch an.
Das Reading im aktor steht dann ja auf : on oder off....
Gibt es da ein möglichkeit das man den slider noch sagt on=0 und off=100 ???
lg Michael
Hallo Michael,
Vielen Dank fürs Lob und schön, dass du unser UI einsetzt.
Den Slider fit für on off Werte zu machen, ist kein Problem und wird es heute oder morgen geben.
Viele Grüße
Mario
Hallo,
erst einmal möchte auch mich bedanken. Mit diesem Frontend kann man endlich die Funktionen von fhem auch "schön" benutzen.
Meine Frage: Meine Thermostate sind vom Typ MAX! (über CUL), ich versuche nun, den Status des readings "mode" (also die Zustände "auto","manual") als Button o.ä. anzuzeigen, und beim klick darauf den fhem-Befehl: 'set <device> desiredTemperature auto' abzusetzen.
Aber das bekomme ich nicht hin.
Kann mir hier vielleicht jemand helfen?
Vielen Dank im Voraus!
Versuch mal:
<div data-type="button"
data-device="DEVICE"
data-fhem-cmd="set DEVICE desiredTemperature auto"
data-get="mode"
data-get-on='["auto","manual"]'
data-icons='["fa-calendar","fa-hand-o-right"]'
data-on-colors='["red","green"]'></div>
Das wird demnächst auch so ähnlich mit den Standard switch- und push-Widgets gehen, aktuell brauchst du dazu aber noch das button-Widget aus Widgets for Fhem Tablet UI (http://forum.fhem.de/index.php/topic,36122.0.html)
Hallo,
ich habe dank einer super Idee / Architektur des Frontends, toller Anpassbarkeit und vieler Aktiven hier, mein erstes FTUI erstellt. Ich habe vermutlich alle alternativen Frontends durchprobiert und alle sind aus verschieden Gründen wieder aussortiert worden. FTUI nicht, ganz tolle Arbeit! Vielen Dank!
Das größte Lob ist allerdings, dass meine Freundin es gestern das erste Mal benutzt hat. :D
Viele Grüße
Arne
Oder mit zwei Switches:
<div class="cell">
<div data-type="switch"
data-device="myMax1"
data-get-off="!on"
data-get-on="manu"
data-get="mode"
data-cmd="setreading"
class="cell" ></div>
<div data-type="label" class="cell">Manu</div>
<div data-type="switch"
data-device="myMax1"
data-get-off="!on"
data-get-on="auto"
data-get="mode"
data-cmd="setreading" class="cell" ></div>
<div data-type="label" class="cell">Auto</div>
</div>
Sorry, ungetestet!!! Ich habe das nur schnell am Telefon zusammengeklimpert.
Die icons kann man auch noch schön machen.
Edit: ich sehe gerade, der fhem Befehl würde nicht passen, bei meinem Vorschlag. Aber als Anhaltspunkt für eigene Lösungen durchaus nutzbar. Man kann auch mit einem Label für die Anzeige des Modes nutzen und mit einem Push Widget den Auto Befehl schicken.
Zitat von: arneg am 24 April 2015, 13:55:09
Das größte Lob ist allerdings, dass meine Freundin es gestern das erste Mal benutzt hat. :D
rrrrrrrRRRESPEKT! 8)
Ein hoher WAF ist das Wichtigste!!!
Wer kennt das nicht ... 8)
Vielen Dank setstate und nesges für die schnelle Reaktion.
Da ich nur einen Button haben wollte, habe ich mich für die Lösung von nesges entschieden.
Allerdings musste ich in Deiner Lösung data-fhem-cmd kürzen:
data-fhem-cmd="set <DEVICE> auto"
und in fhem
attr <DEVICE> eventMap ,desiredTemperature auto:auto" setzen.
Aber jetzt funktioniert es! Nochmals DANKE!!!
Bin gespannt, was hier noch so alles kommt.
Einbindung eines Kalenders wäre noch sehr wichtig für den WAF ;)
Zitat von: dynamoa am 24 April 2015, 14:35:49
Einbindung eines Kalenders wäre noch sehr wichtig für den WAF ;)
Für die Aufgabe gibt es bereits gute, fertige Fremdlösungen, die man ohne großen Aufwand einbinden kann - die würde ich für den Anfang mal empfehlen. Zum Beispiel hier ein Google-Kalender:
system-calendar.html (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/html/room/system-calendar.html):
(https://raw.githubusercontent.com/nesges/TabletUI-Demo-WOPR/master/screenshots/small/system-calendar.png) (https://raw.githubusercontent.com/nesges/TabletUI-Demo-WOPR/master/screenshots/system-calendar.png)
Passt natürlich nicht 100% in den Stil von FTUI, aber für mich persönlich trumpft da die fertige Funktion :)
Oh, ok.
Da hat sich ja jemand Mühe gegeben.
Aber ich habe mich wohl missverständlich ausgedrückt.
Mir würde es mehr als reichen, wenn ich die nächsten 5 Termine als ReadingsGroup o.ä. anzeigen könnte. Nur anzeigen, nicht bearbeiten.
Und wenn das dann zum Design von FTUI wäre... 8)
Trotzdem Danke und weiter so!!!
Zitat von: nesges am 23 April 2015, 22:14:36
Ist leider ein seltsames Verhalten in HTTPSRV. Die Lösung steht im anderen Thread, ich kopiere mal hierher:
Das ändert allerdings nur den Link in FHEMWEB. Wenn du trotzdem noch von Hand ohne Slash aufrufst, wird der Fehler weiterhin auftreten.
PS: Jetzt auch in FAQ: Warum führen mich Links auf andere Seiten zurück zu FHEMWEB? (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Warum_f.C3.BChren_mich_Links_auf_andere_Seiten_zur.C3.BCck_zu_FHEMWEB.3F)
Vielen Dank für den Tipp. Mit der Änderung lädt nur noch eine weiße, leere Seite.
Seltsam dass es sich bei vielen anders verhält.
Ich versuche es ohnehin wie du auf einem externen Apache mit PHP zum laufen zu bekommen, dann hat sich das ja ohnehin gegessen.
Jedenfalls vielen Dank für dieses schöne und vor allem simple Frontend! Es macht Spaß mit etwas zu arbeiten, wo man sich vorher nicht durch 50 Config Dateien kämpfen muss!
Macht weiter so!
Hallo zusammen,
ich bin auch mal wieder da. Da ich momentan beruflich sehr eingespannt bin verfolge ich diesen thread von unterwegs und habe echt schiss dass ich was verpasse! So rasant wie hier habe ich es selten erlebt.
@ nesges: Danke für den Tipp mit dem Kalender. Wird sofort umgesetzt.
Derweilen habe ich in FHEM das Modul SYSMON eingebunden und gebe dies nun in meinem Statistikbereich aus. Da das "plot-widget" noch nicht Final ist binde ich lediglich die Grafiken ein.
@nesges: Ich habe mir eben den Kalender-Quellcode von dir angeschaut. Habe ich was verpasst? Wo hinterlegst Du denn die Zugangsdaten ?
Ich check das gerade nicht. :-\
hat sich erledigt!! Habe rausbekommen woher der Link kommt. Den hast Du aus den Einstellungen vom Googlekalender! Habe es gefunden. ;D
Zitat von: bjoernbo am 24 April 2015, 17:26:31
@nesges: Ich habe mir eben den Kalender-Quellcode von dir angeschaut. Habe ich was verpasst? Wo hinterlegst Du denn die Zugangsdaten ?
Ich check das gerade nicht. :-\
Nirgends :) In der Demo-Seite verwende ich zwei öffentliche Kalender, da sollte eine Anmeldung nicht notwendig sein. Ansonsten erledigt dein Browser die Anmeldung beim Kalender automatisch: Wenn du an einem Google-Dienst angemeldet bist, wird die Anmeldung für die Kalenderanzeige verwendet. Wenn du nicht angemeldet bist, wird oben im Kalender die Meldung: "Termine aus einem oder mehreren Kalendern konnten hier nicht angezeigt werden, da Sie nicht über die nötige Berechtigung verfügen." angezeigt - in dem Fall einfach mal GMail aufrufen und evtl. ein paar Minuten warten.
:-D ja, das ich gerade nicht berechtigt bin wollte ich eben schreiben, aber Danke das du mir sofort die Antwort gibst. By the Way, sag mal eben die Lottozahlen. Ich teile dann mit dir auch ;)
Zitat"Termine aus einem oder mehreren Kalendern konnten hier nicht angezeigt werden, da Sie nicht über die nötige Berechtigung verfügen." angezeigt - in dem Fall einfach mal GMail aufrufen und evtl. ein paar Minuten warten.
Das habe ich nun alles befolgt, auf dem Android Tablet wird mir mein "Hauptkalender" nicht angezeigt. Auf dem Mac allerdings schon. Kann das ggf. mit WebViewControll zusammenhängen ?
Zitat von: speddy99 am 24 April 2015, 06:54:57
Ich habe einen Slider eingefügt von min 0 bis max 100. Funktioniert auch, ich kann damit mein Rollo rauf und runter fahren und bekomme es am Slider auch angezeigt.
Nur wenn das Rollo ganz auf oder zu ist zeigt der slider falsch an.
Das Reading im aktor steht dann ja auf : on oder off....
Gibt es da ein möglichkeit das man den slider noch sagt on=0 und off=100 ???
Update: Das Slider Widget reagiert jetzt auch auf 'on' und 'off'. Es wird dann der max respektive der min Wert angefahren. Wenn das Device andere Werte statt 'on' und 'off' annimmt, kann man mit data-on und data-off die Defaults überschreiben.
Auch ist mit diesem Update nun ein horizontaler Slider verfügbar. Dazu muss nur als zusätzliche CSS class 'horizontal' angegeben werden.
<div data-type="slider"
data-device='dummy1'
data-min="10"
data-max="90"
data-on="offen"
data-off="zu"
class="cell horizontal" >
</div>
Der Screenshot zeigt die Nutzung eines horizontalen FTUI Sliders im Mobil-Theme ( siehe examples/mobil_2.html )
Zitat von: setstate am 22 April 2015, 23:25:59
Bei Github gibt es eine ganze Menge kleine Änderungen von nesges und setstate.
- RegEx beim Symbol Widget http://forum.fhem.de/index.php/topic,34233.msg287600.html#msg287600
@nesges/setstate
Gibt es für des Symbol Widget eine spezielle Notation für die RegEx in einem Array?
Denn selbst so ein simpler RegEx wie [0-9] funtkioniert leider nicht. Oder habe ich was übersehen?
<div data-type="symbol" data-device="Rollo" data-icons='["oa-fts_garage", "oa-fts_garage_door_100"]'
data-get-on='["100", "[0-9]"]'
data-get='pct'
data-on-colors='["#FF0000", "#505050"]'>
hallo Wegwerf,
das Symbol Widget kann noch kein RegEx, die Status im data-get-on Array müssen eindeutig sein.
Man kann nur im on/off Mode RegEx anwenden, aber dann wäre in deinem Fall nicht unbedingt RegEx notwendig, oder was willst du erreichen?
<div data-type="symbol" data-device="dummy1"
data-icon="oa-fts_garage"
data-get-on="100"
data-get='pct'
data-on-color="#ad3333">
</div>
nebenbei: bitte keine 100% Farben wie #ff000 benutzen, die sehen zu grell aus.
Ich empfehle folgende Grundfarben zu benutzen:
.red{ color:#ad3333; }
.green{ color:#32a054; }
.blue{ color:#6699FF; }
.gray { color: #8C8C8C; }
Zitat von: bjoernbo am 24 April 2015, 18:19:53
Das habe ich nun alles befolgt, auf dem Android Tablet wird mir mein "Hauptkalender" nicht angezeigt. Auf dem Mac allerdings schon. Kann das ggf. mit WebViewControll zusammenhängen ?
Das ist gut möglich, WVC ist ja kein vollwertiger Browser. Ich hab's mittlerweile komplett entsorgt, mit Chrome im Fullscreen-Modus fahre ich besser.
Zitat von: setstate am 24 April 2015, 23:48:29
Auch ist mit diesem Update nun ein horizontaler Slider verfügbar. Dazu muss nur als zusätzliche CSS class 'horizontal' angegeben werden.
Sehr schön! Horizontal kann ich den gut brauchen :) Ein kleiner Schönheitsfehler: Er dehnt sich in der Höhe so weit aus, als ob er vertikal sei. Lässt sich als Workarround mit
style="height:0px !important" fixen.
Guten Morgen Gemeinde,
ich brauche einen Tipp von euch im Bezug auf das Circle-Menü.
Ich möchte gerne das die 3 Einträge nicht gleichmäßig verteilt werden, sondern das diese nur im rechten Bereich erscheinen. Quasi, dass die drei Einträge auf 12Uhr - 3 Uhr & 6 Uhr erscheinen.
Zitat<li data-row="5" data-col="2" data-sizex="1" data-sizey="1">
<div class="left">
<div data-type="circlemenu" class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level -2"
data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level 0"
data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level +3"
data-icon="">2</div></li>
</ul>
</div>
<div data-type="label" class="cell">Wetter</div>
data-direction="right-half"
Optionen sind: top | right | bottom | left | top-right | top-left | bottom-right | bottom-left | top-half | right-half | bottom-half | left-half | full
Es gibt noch data-item-diameter="52" und data-circle-radius="52"
Muss alles noch in die Readme. Werde ich schleunigst machen. ::)
Zitat von: nesges am 25 April 2015, 01:52:08
Sehr schön! Horizontal kann ich den gut brauchen :) Ein kleiner Schönheitsfehler: Er dehnt sich in der Höhe so weit aus, als ob er vertikal sei. Lässt sich als Workarround mit style="height:0px !important" fixen.
Danke für den Hinweise, aber den Fehler kann ich bei mir nicht nachvollziehen. Bestimmte Konstellationen?
<li data-row="1" data-col="3" data-sizex="1" data-sizey="3">
<header>SLIDER</header>
<div data-type="slider" data-device='dummy1' data-min="10" data-max="90" class="horizontal" ></div>
</li>
Danke setstate! Aber wo liegt mein Fehler. Es funktioniert leider nicht :'(
Zitat<li data-row="5" data-col="2" data-sizex="1" data-sizey="1">
<div class="center">
<div data-type="circlemenu" class="cell circlemenu">
<ul class="menu">
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level -2"
data-direction="top"
data-icon="fa-pagelines"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level 0"
data-direction="right"
data-icon="fa-pagelines"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level +3"
data-direction="bottom"
data-icon="fa-pagelines"></div></li>
</ul>
</div>
<div data-type="label" class="cell">Wetter</div>
</div>
</li>
Zitat von: nesges am 25 April 2015, 01:17:54
Das ist gut möglich, WVC ist ja kein vollwertiger Browser. Ich hab's mittlerweile komplett entsorgt, mit Chrome im Fullscreen-Modus fahre ich besser.
Das WVC kann aber mit mir sprechen! Das steigerte den WAF signifikant 8)
define diKinderzimmerFensterOpen DOIF ([KinderzimmerFenster] eq "open" and [OutTemp:temp] < 12) (set Tablet ttsSay Kinderzimmer Fenster zu lange offen)
attr diKinderzimmerFensterOpen cmdpause 300
attr diKinderzimmerFensterOpen repeatsame 10
attr diKinderzimmerFensterOpen wait 600
Sorry, hätte ich besser erklären müssen. So geht es :
<li data-row="5" data-col="2" data-sizex="1" data-sizey="1">
<div class="center">
<div data-type="circlemenu" data-direction="right-half" class="cell circlemenu">
<ul>
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level -2"
data-icon="fa-pagelines"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level 0"
data-icon="fa-pagelines"></div></li>
<li><div data-type="push" data-device="AvReceiver"
data-set="remoteControl subwoofer-temporary-level +3"
data-icon="fa-pagelines"></div></li>
</ul>
</div>
<div data-type="label" class="cell">Wetter</div>
</div>
</li>
SUPER ! Mit "right-bottom" ist es sogar so, wie es haben möchte! Vielen Dank.
Zitat von: setstate am 25 April 2015, 11:18:50
Das WVC kann aber mit mir sprechen! Das steigerte den WAF signifikant 8)
Löse ich mit Tasker (https://play.google.com/store/apps/details?id=net.dinglisch.android.taskerm) und Autoremote (https://play.google.com/store/apps/details?id=com.joaomgcd.autoremote), die beiden Apps kann ich uneingeschränkt auch für viele andere Automationsaufgaben auf Android empfehlen! Meine Freundin ist allerdings eher genervt "wenn die Wohnung mit dir spricht" ;)
Zitat von: setstate am 25 April 2015, 10:12:30
Danke für den Hinweise, aber den Fehler kann ich bei mir nicht nachvollziehen. Bestimmte Konstellationen?
Eigentlich nicht, dürfte alles Standard sein. Ich hänge mal HTML und Screenshot an.
okay, verstanden und schon gefixed. Bei mehr als einem Slider übereinander konnte man es schön sehen, was nicht passte
Zitat von: setstate am 25 April 2015, 00:27:53
hallo Wegwerf,
das Symbol Widget kann noch kein RegEx, die Status im data-get-on Array müssen eindeutig sein.
Man kann nur im on/off Mode RegEx anwenden, aber dann wäre in deinem Fall nicht unbedingt RegEx notwendig, oder was willst du erreichen?
....
Hallo setstate,
es geht eigentlich nur darum den Öffnungstand von Rollos/Toren mittels den 10 zugehörigen Icons darzustellen.
Diese sind in 10er schritten vorhanden hier bei Garage z.B. oa-fts_garage_door_100 == 100% oa-fts_garage_door_90 == 90% usw. Da aber pct auch z.B. 99,89 usw sein könnte, gäbe es kein zugehöriges Icon. Daher wollte ich bei z.B. [9][0-9] das Icon oa-fts_garage_door_90 zeigen usw.
Ich erinnere mich... Geht nachzurüsten mit einer zusätzlichen indexOfRegex Funktion. Update folgt...
Moin moin,
Ich hab da mal eine Frage....zum Select-widget: kann man unterschiedlich data-set-befehle und Listenelemente festlegen ? Hintergrund ist einfach, das "hdmi2" als Eingang zwar richtig ist, aber "Chromecast" viel eindeutiger ...
LG
Marie
Edit: data-get mit unterschiedlich Daten wäre ja auch cool...oder mache ich gerade einen Denkfehler?
Wenn man eine statische Liste mit data-items benutzt, kann man mit data-alias die angezeigten Werte vorgeben.
<div data-type="select"
data-device="MCP_KODI"
data-items='["http://www.deutschlandradio.de/streaming/dlf.m3u","smb://SKY/share/playlist/tormentedradio.m3u","smb://SKY/share/playlist/dkultur.m3u"]'
data-alias='["DLF","tormentedradio"]'
data-set="open"></div>
Erzeugt ein Select mit den Einträgen
ZitatDLF
tormentedradio
smb://SKY/share/playlist/dkultur.m3u
gesendet wird aber immer der Stream-URL aus data-items.
@setstate: Super, danke klappte auf Anhieb gut.
Ein Problem gibt es noch, hat aber nicht mit select zu tun vielleicht weiß ja jemand eine Lösung: immer wenn ich die Eingänge meines Receivers umschalte, werden die am Receiver auch jedesmal sofort umgeschaltet, aber die Anzeige im UI wird nicht immer sofort aktualisiert. Manchmal muss man zweimal den Eingang auswählen um ihn auch im Reading zu haben...
Es handelt sich um einen Yamaha Receiver...
LG Marie
Hallo Zusammen,
ich habe ab und zu so 5 kleine Meldungen "Error: error:". Hab aber keine Ahnung, was das sein könnte. Jemand von euch?
Gruß, der Sloot
Zitat von: setstate am 25 April 2015, 17:30:32
okay, verstanden und schon gefixed. Bei mehr als einem Slider übereinander konnte man es schön sehen, was nicht passte
Danke, aber so ganz passt's noch nicht. Folgender Code:
<div class="centered">
<div data-type="button"
data-fhem-cmd="set MCP_KODI mute" data-icon="fa-volume-off"
data-off-background-color="#aa3333"
data-device="MCP_KODI"
class="left"></div>
<div data-type="slider"
data-device="MCP_KODI"
data-get="volume"
data-set="volume"
class="left horizontal"></div>
<div data-type="button"
data-fhem-cmd="set MCP_KODI volume 100" data-icon="fa-volume-up"
data-off-background-color="#aa3333"
data-device="MCP_KODI"
class="left"></div>
</div>führt zu Anhang player_ist.png. Die Höhe passt nicht, und der Abstand oben passt auch nicht. Ich korrigiere mit
style="width:130px;height:0px;margin-top:-8px !important;und erhalte player_soll.png - wobei width abgeschnitten wird, da in widget_slider.js max-width auf 120px gesetzt wird - kann eigentlich auch raus, oder? Wenn ich's richtig sehe, kommen die übrigen Abstände irgendwo aus Powerange. Jetzt wäre nur die Frage ob's generell per widget_slider angepasst werden sollte, oder individuell durch den User anzupassen wäre.
Zitat von: jsloot am 26 April 2015, 20:23:19
ich habe ab und zu so 5 kleine Meldungen "Error: error:". Hab aber keine Ahnung, was das sein könnte. Jemand von euch?
Hast du sehr viele (>100) Widgets auf einer Seite? Auf meiner Startseite sind ca. 150 und da bekomm ich diese Toastmeldungen ganz selten wegen Timeouts beim slowPoll.
Zitat von: nesges am 26 April 2015, 21:03:22
Hast du sehr viele (>100) Widgets auf einer Seite? Auf meiner Startseite sind ca. 150 und da bekomm ich diese Toastmeldungen ganz selten wegen Timeouts beim slowPoll.
Nein, gerade mal 51.
Könnte man im Weather-Widget eventuell so was wie "data-ImagePath" für das kleinklimamap implementieren um den Pfad der Bilder variabel zu halten?
Ich würde gerne alle Bilder des Tablet UI unter tablet/images speichern.
Oder gibt es da eine andere Lösung?
Zitat von: mc-hollin am 27 April 2015, 09:47:50
Könnte man im Weather-Widget eventuell so was wie "data-ImagePath" für das kleinklimamap implementieren um den Pfad der Bilder variabel zu halten?
Find ich gut, werd ich einbauen.
Zitat von: nesges am 27 April 2015, 10:00:56
Find ich gut, werd ich einbauen.
Perfekt! Wie immer.
Gibt es eigentlich eine Möglichkeit Defaultwerte aus den Widgets zu bekommen oder sogar zu setzen?
Ich erweitere oft die UI in der "Entwicklungsumgebung" ohne eine Anbindung an mein FHEM zu haben.
Hier sehe ich dann natürlich keine Werte und somit ist das Design nicht komplett. Wäre toll wenn ich bei getrennter Verbindung trotzdem einen Wert anzeigen könnte.
Grade ist mir noch was im horizontalen Slider aufgefallen: An der linken Seite ist sein "Klickbereich" zu groß. Für den Screenshot slider.png habe ich ihm "cursor:crosshair" gegeben und bin mit der Maus an den äussersten linken Rand (der Crosshair-Anzeige, also des "Klickbereiches") gefahren. Problematisch daran ist die notwendige zusätzliche margin-left Angabe:
<div id="KODIVolumeSlider"data-type="slider"
data-device="MCP_KODI"
data-get="volume"
data-set="volume"
class="left horizontal"
style="width:100px;height:1px;margin-top:-8px !important; margin-left:30px !important;margin-right:30px !important;cursor:crosshair"></div>
Ohne margin-left überlappt der Slider den angrenzenden Button bis zur Hälfte (slider2.png).
Zitat von: mc-hollin am 27 April 2015, 09:47:50
Könnte man im Weather-Widget eventuell so was wie "data-ImagePath" für das kleinklimamap implementieren um den Pfad der Bilder variabel zu halten?
https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_weather.js hat jetzt das neue Attribut data-image-path mit dem der Pfad angepasst werden kann. Bitte Feedback ob's funktioniert, dann schieb ich's ins Hauptrepository.
Zitat von: nesges am 27 April 2015, 13:45:21
https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_weather.js hat jetzt das neue Attribut data-image-path mit dem der Pfad angepasst werden kann. Bitte Feedback ob's funktioniert, dann schieb ich's ins Hauptrepository.
Man bist du schnell. Hab es gerade runtergeladen.
Kann die neue Funktionalität aber erst heute abend testen.
Hier habe ich nur eine Kopie der UI zum Testen aber keine Anbindung an das FHEM und somit keine Werte.
Das Widget läuft ohne die Werte schon mal fehlerfrei.
Ich möchte die UV-Index-Werte von Proplanta mit dem Widget "label" mit verschieden Farben darstellen ("data-limits" und "data-colors"). Aus der Doku geht leider nicht hervor, wie diese Limits zu verstehen sind.
Beispiel:
data-limits="[4, 8, 15, 30]"
data-colors='["#66FF33", "#FFFF00", "#993399", "FF6600"]
Bedeutet das, dass die Farben bis einschließlich ... oder größer als ... oder größer gleich ... verwendet werden?
Wenn größer als 4 dann der erste Farbwert, sonst der default. Deshalb habe ich als ersten Wert -73 damit es immer mit blauen Temperaturen los geht.
Ich überarbeite das Thema aber gerade. Man kann dann alternativ auch RegEx benutzen, wer das lieber mag.
Zitat von: setstate am 27 April 2015, 16:21:12
Wenn größer als 4 dann der erste Farbwert, sonst der default. Deshalb habe ich als ersten Wert -73 damit es immer mit blauen Temperaturen los geht.
Ich überarbeite das Thema aber gerade. Man kann dann alternativ auch RegEx benutzen, wer das lieber mag.
Vielen Dank! :D
Zitat von: nesges am 27 April 2015, 13:45:21
https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_weather.js hat jetzt das neue Attribut data-image-path mit dem der Pfad angepasst werden kann. Bitte Feedback ob's funktioniert, dann schieb ich's ins Hauptrepository.
Ich hab es auf den RasPi geschickt und die Bilder aus dem Verzeichnis tablet/images werden angezeigt
Super. Danke.
Hallo Zusammen,
habe gerade von der ersten Version auf die jetzige upgedatet.
Dadurch musste ich meine index.html neu aufbauen.
Nun geht wieder alles grundsätzlich.
Mein Problem, es werden nicht die aktuellen STATEs eingelesen.
Wenn ich data-get-on/off richtig verstanden habe, liest das UI den state, oder was ich eben angegeben habe aus.
Leider zeigt mir nichts den aktuellen Status an, erst wenn ein Event kommt.
Das ist etwas blöd, weil ich ein paar Schalter habe, die nicht dauernd geschalten werden.
Klar, ich kann jetzt einmal schalten, aber es ist ja auch so, dass nach einem FHEM Neustart, oder Browserneustart/reload am Tablet auch wieder nichts angezeigt wird.
Mache ich da etwas falsch?
Hier mal ein Beispiel aus meiner index:
<header>HOMESTATUS</header>
<div class="centered container">
<div class="left">
<div data-type="switch" data-device="Markus.Homestatus" data-get-on="Zuhause" data-get-off="Unterwegs" data-set-on="Zuhause" data-set-off="Unterwegs" data-icon="fa-user" class="cell readonly "></div>
<div data-type="label" class="cell">Markus</div>
</div>
oder
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1">
<header>HEIZUNG</header>
<div class="center">
<div data-type="switch" data-device="HCAutomatik" data-get="STATE" data-set-on="on" data-set-off="off" data-icon="oa-sani_heating_automatic" class="cell" ></div>
</div>
</li>
Zitat von: Mitch am 27 April 2015, 18:35:07
Mein Problem, es werden nicht die aktuellen STATEs eingelesen.
Grundsätzlich sollten nach spätestens 30s alle Status geladen sein. Hast du die beiden ersten Punkte der FAQ (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ) bereits ausgeschlossen?
Ja, habe ich.
Sollte das UI nicht alles auslesen, wenn ich die Seite aufrufe?
Bei mir kommen Infos erst, wenn wirklich im Eventmonitor das Event kommt.
Nach 30sec kommt da gar nichts.
Ist vor allem bei Fensterkontakten sehr ärgerlich, weil ich Fenster habe, die normalerweise nie geöffnet werden.
EDIT: was mir gerade auch noch auffällt, mit dieser Zeile
<div type="label" device="CUL_HM_HM_SEC_KEY_123456" class="cell" ></div>
stand immer der aktuelle Status meines Keymatic im UI.
Jetzt habe ich diese Zeile probiert
<div data-type="label" data-device="CUL_HM_HM_SEC_KEY_123456" data-get="state" class="cell" ></div>
es wird aber gar nichts angezeigt?
EDIT2: hab gerade nochmal die ursprüngliche Zeile probiert und geschalten, jetzt steht es wieder das?
Muss es nicht data-device heißen??
Zitat von: Mitch am 27 April 2015, 18:51:40
Sollte das UI nicht alles auslesen, wenn ich die Seite aufrufe?
Beim Start wird für jedes Reading eine asynchroner Ajax-Request an Fhem gestellt. D.h. es kann durchaus unterschiedlich lange dauern, bis die Werte im UI angezeigt werden, dass aber gar keine angezeigt werden sollte dabei nicht vorkommen. Zumal die Verbindung zu Fhem offensichtlich Ok ist, da ja longpoll funktioniert. Ich weiss grade nicht, wie dein Fehlerbild aussehen müsste, hier kann setstate wahrscheinlich besser helfen.
Du kannst aber schonmal versuchen in fhem-tablet-ui.js die beiden console.log-Zeilen (356 und 369) einzukommentieren. Danach solltest du in der Javascript-Konsole von Meldungen "erschlagen" werden. Falls nicht, ist das evtl. ein Ansatz.
Also Verbindung zu fhem ist okay, longpoll geht auch, Schalten kann ich auch.
In den zwei Zeilen finde ich nichts mit console.log
Habe das aber in mehreren anderen Zeilen:
374: console.log('update done (filter:'+filter+')');
379: console.log("set "+device+" "+status);
409: console.log('start longpoll');
448: //console.log('#'+line+'#');
477: //console.log(date + ' / ' + key+' / '+paraname+' / '+val);
479: //console.log(date + ' / ' + key+' / '+paraname+' / '+val);
Hallo,
habe mal ne Frage, ist es möglich den aktuellen Akkustand des verwendeten Tablets ( oder aller verwendeten Tablets/Handys ) anzuzeigen?
Danke euch.
Zitat von: Mitch am 27 April 2015, 19:17:02
In den zwei Zeilen finde ich nichts mit console.log
Dann ist anscheinend dein Update fehlgeschlagen (vergleiche deine fhem-tablet-ui.js mit https://github.com/knowthelist/fhem-tablet-ui/blob/master/www/tablet/js/fhem-tablet-ui.js).
Zitat von: rizo am 27 April 2015, 19:23:27
habe mal ne Frage, ist es möglich den aktuellen Akkustand des verwendeten Tablets ( oder aller verwendeten Tablets/Handys ) anzuzeigen?
FTUI kann jedes Reading anzeigen, das in Fhem zur Verfügung steht. Wenn also "etwas" auf deinem Tablet den Akkustand als Reading an Fhem zurück meldet (macht WVC das evtl?), kannst du den Wert auch auslesen und anzeigen.
Klasse danke für die schnelle Antwort.
Nur weiß ich nicht wie es genau geht.
Also das Abfragen schon, nur hält WVC den Wert nur aktuell wenn ich als url beispiel: 192.168.10.1:8083/fhem nutze. Ich möchte aber gerne
192.168.10.1:8083/fhem/tablet nutzen.
Ne Idee?
Zitat von: Wegwerf am 25 April 2015, 23:34:18
Hallo setstate,
es geht eigentlich nur darum den Öffnungstand von Rollos/Toren mittels den 10 zugehörigen Icons darzustellen.
Diese sind in 10er schritten vorhanden hier bei Garage z.B. oa-fts_garage_door_100 == 100% oa-fts_garage_door_90 == 90% usw. Da aber pct auch z.B. 99,89 usw sein könnte, gäbe es kein zugehöriges Icon. Daher wollte ich bei z.B. [9][0-9] das Icon oa-fts_garage_door_90 zeigen usw.
Update: das Symbol Widget kann jetzt auch Regex bei der Nutzung von Icon Listen verstehen.
Das ganze ist ziemlich generisch nutzbar.
1. Wie vorher schon: feste Status
[/list]
<div data-type="symbol" data-device="dummy1"
data-icons='["fa-exclamation-triangle fa-blink","fa-exclamation-circle","fa-cog fa-spin"]'
data-on-colors='["Crimson","GoldenRod","SeaGreen"]'
data-get-on='["Wert1","Wert2","Wert3"]' >
</div>
2. Wie beim Label Widgets: Limits
<div data-type="symbol" data-device="dummy1"
data-icons='["oa-fts_garage","oa-fts_garage_door_50","oa-fts_garage_door_100"]'
data-get-on='["0","50","100"]'
data-on-colors='["#dd3366","#ffcc00","#55aa44"]'>
</div>
Bei größer-gleich 50 wird das zweite Icon angezeigt, ab 100 das letzte ...
3. Regex bei data-got-on Feldern, wie auch schon beim einfachen data-get-on
<div data-type="symbol" data-device="dummy1"
data-icons='["oa-fts_garage","oa-fts_garage_door_50","oa-fts_garage_door_100"]'
data-get-on='["^[12]*[0-9]$","[3456][0-9]","([789][0-9]|100)"]'
data-on-colors='["#dd3366","#ffcc00","#55aa44"]'>
</div>
0-29 das erste Symbol, 30-69 das zweite und 70-100 das dritte
Beim Label Widget kann man jetzt auch diese Regex fürs data-limit einsetzen. Wenn die Angaben nur numerisch sind, wird nur mit >= ausgewertet.
Zitat von: rizo am 27 April 2015, 20:02:27
Klasse danke für die schnelle Antwort.
Nur weiß ich nicht wie es genau geht.
Also das Abfragen schon, nur hält WVC den Wert nur aktuell wenn ich als url beispiel: 192.168.10.1:8083/fhem nutze. Ich möchte aber gerne
192.168.10.1:8083/fhem/tablet nutzen.
Ne Idee?
so könnte man das rein mit Text machen, ohne Icons
<div data-type="label" data-device='Tablet' data-get='powerLevel'
data-limits='[0,50,99]'
data-colors='["#cc7733","#AA6900","#66cc33"]'
class="cell big"></div>
<div data-type="label" class="cell">Tablet Power</div>
Das Tablet UI muss dann im WVC laufen und dieses eingebunden sein:
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
Zitat von: rizo am 27 April 2015, 20:02:27
Nur weiß ich nicht wie es genau geht.
Also das Abfragen schon, nur hält WVC den Wert nur aktuell wenn ich als url beispiel: 192.168.10.1:8083/fhem nutze. Ich möchte aber gerne
192.168.10.1:8083/fhem/tablet nutzen.
Ne Idee?
Du musst in deiner html-Datei am Anfang den Eintrag zum WVC den Kommentar entfernen und deine ID anpassen.
super danke hat alles wunderbar geklappt.
So, habe alles gelöscht und nochmal neu runtergeladen.
Genau das gleiche Problem wie vorher :-\
Zitat von: Mitch am 27 April 2015, 20:39:54
So, habe alles gelöscht und nochmal neu runtergeladen.
Genau das gleiche Problem wie vorher :-\
Ich vermute, dein Format beim FHEM Command 'list' ist etwas anders:
Wir brauchen aber dann für die Suche deine Console Logs mithilfe von
Zeile 356: //console.log('line: '+line);
Zeile 365: //console.log('paraname',paraname,'date:',date,'val',val);
Hallo!
Ich versuche mich jetzt schon länger an einem einfachen Dimmer, aber komme nicht weiter:
Es geht um einen Eltako FUD Enocean-Dimmer. Kommando für an/aus: set on/off. Kommando für Dimmen: set dim
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks' data-get="dim" data-get-on="!0" data-get-off="0" data-set="dim" class="cell"></div>
--> Ich muss data-set="dim" machen, damit das Dimmen funktioniert.
Schalte ich danach wieder ein, führt FHEM ein set dim 0 aus. Damit bleibt die Lampe aber einfach aus.
Gibt es hier eine Möglichkeit, statt dessen einen data-set-on-Befehl zu hinterlegen?
Grüße
Phil
Zitat von: setstate am 27 April 2015, 20:52:33
Ich vermute, dein Format beim FHEM Command 'list' ist etwas anders:
Wir brauchen aber dann für die Suche deine Console Logs mithilfe von
Zeile 356: //console.log('line: '+line);
Zeile 365: //console.log('paraname',paraname,'date:',date,'val',val);
So, habe die zwei Zeilen "aktiviert".
Und nun?
Zitat von: Mitch am 27 April 2015, 22:01:18
So, habe die zwei Zeilen "aktiviert".
Und nun?
Sehr gut! Jetzt brauchen wir die Ausgaben der Webconsole. Geöffnet wird die im Firefox mit alt+cmd+k
Mehr Info dazu hier: https://developer.mozilla.org/de/docs/Tools/Web_Konsole
Ein paar Beispielszeilen reichen ...
Hab kein Firefox, nur Safari (ist ein Mac) 8)
[Warning] Unexpected CSS token: : (font-awesome.min.css, line 4, x5)
[Log] Please rename widget attribute "type" into "data-type" in http://192.168.0.5:8084/fhem/tablet - Details below: (fhem-tablet-ui.js, line 191)
[Log] [ (fhem-tablet-ui.js, line 192)
<div data-on="scharf" data-off="unscharf" data-icon="fa-exclamation-triangle" data-type="switch" data-device="Alarmanlage" class="fa-stack fa-2x">...</div>
]
[Log] Please rename widget attribute "device" into "data-device" in http://192.168.0.5:8084/fhem/tablet device: CUL_HM_HM_SEC_KEY_23DB96 - Details below: (fhem-tablet-ui.js, line 199)
[Log] [ (fhem-tablet-ui.js, line 200)
<div data-type="label" class="cell" data-device="CUL_HM_HM_SEC_KEY_23DB96"></div>
]
[Log] Please rename widget attribute "device" into "data-device" in http://192.168.0.5:8084/fhem/tablet device: Alarmanlage - Details below: (fhem-tablet-ui.js, line 199)
[Log] [ (fhem-tablet-ui.js, line 200)
<div data-on="scharf" data-off="unscharf" data-icon="fa-exclamation-triangle" data-type="switch" data-device="Alarmanlage" class="fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Flur_oben - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Flur_oben" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Bad - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Bad" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Leoni - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Leoni" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Carlotta - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Carlotta" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Schlafzimmer - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Schlafzimmer" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Kellerflur - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Kellerflur" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Waschkeller - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Waschkeller" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_links - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Hobbyraum_links" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_rechts - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Hobbyraum_rechts" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_ost - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Hobbyraum_ost" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] line: (fhem-tablet-ui.js, line 356, x14)
Die Fehler verstehe ich nicht.
Die Dinge sind alle so nicht (mehr) in der index.html:
z.B.<header>WOHNZIMMER</header>
<div class="center">
<div data-type="thermostat" data-device="HZ_Wohnzimmer_WT_Climate" data-get="desired-temp" data-step="0.5"></div>
<div data-type="label" data-device="HZ_Wohnzimmer_WT_Climate" data-get="humidity" data-fix="0" data-unit=" %" class="small"></div>
<div data-type="label" data-device="Wohnzimmer.Airsensor" data-get="voc" data-fix="0" data-unit=" CO2" class="small"></div>
<div class="container">
<div class="cell left">
<div data-type="symbol" data-get="state" data-device="Fenster_Terrasse" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terrasse</div>
</div>
<div class="cell left">
<div data-type="symbol" data-device="Fenster_Wohnzimmer_Ost " data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Ost</div>
</div>
<div class="cell left">
<div data-type="symbol" data-device="Fenster_Kueche" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Kueche</div>
</div>
</div>
</li>
Als ob alte Daten aus irgend einem Cache geholt werden?
Zitat von: Stril am 27 April 2015, 21:46:20
Hallo!
Ich versuche mich jetzt schon länger an einem einfachen Dimmer, aber komme nicht weiter:
Es geht um einen Eltako FUD Enocean-Dimmer. Kommando für an/aus: set on/off. Kommando für Dimmen: set dim
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks' data-get="dim" data-get-on="!0" data-get-off="0" data-set="dim" class="cell"></div>
--> Ich muss data-set="dim" machen, damit das Dimmen funktioniert.
Schalte ich danach wieder ein, führt FHEM ein set dim 0 aus. Damit bleibt die Lampe aber einfach aus.
Gibt es hier eine Möglichkeit, statt dessen einen data-set-on-Befehl zu hinterlegen?
Grüße
Phil
Hallo Phil,
mit data-get-on="!0" wolltest du sicherlich erreichen, dass alles ausser 0 als on gesehen wird. Das geht leider nicht so. Entweder mit Regex data-get-on="[^0]" oder mit dem eingebauten Literal "!off" also so: data-get-on="!off"
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks'
data-get="dim"
data-get-on="!off"
data-get-on
data-get-off="0"
data-set="dim"
class="cell"></div>
Kleines Beispiel für eine Playersteuerung als Kopiervorlage oder zu Einbinden als Template.
als Template
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1" data-template="template_player.html"></li>
oder einfach die DIVs aus der Datei examples/template_player.html als Vorlage nutzen.
(https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/examples/template_player.png)
Hallo Mitch,
das sieht nach einem Cache-Problem aus. Kannst du mit cmd+r das kpl. Neuladen erzwingen. Ansonsten Browsercache löschen.
Aber die Meldungen sind nur Warnungen, wegen alten Attributen-Namen.
Interessanter wären die 14 Zeilen "[Log] line: (fhem-tablet-ui.js, line 356, x14)"
Kann man das noch aufklappen, um die Details zu lesen?
Also Browser Cahce kann es nicht sein, pasiert auf zwei Rechnern, einem Android Pad und einem iPad.
Habe Cache geleert und Reload erzwungen.
Diese Zeile [Log] line: (fhem-tablet-ui.js, line 356, x14) zeigt leider nur genau das.
Zitat von: setstate am 27 April 2015, 22:53:15
Kleines Beispiel für eine Playersteuerung als Kopiervorlage oder zu Einbinden als Template.
Das wollte ich mir für morgen Abend vornehmen und du nimmst mir einfach so die Arbeit weg ;-) Danke!
Zitat von: Mitch am 27 April 2015, 23:02:07
Diese Zeile [Log] line: (fhem-tablet-ui.js, line 356, x14) zeigt leider nur genau das.
Würde ich dann als Leerzeilen interpretieren :o Füge mal bitte nach Zeile 350 (
.done (function( data ) {) ein:
console.log('data',data.replace(/\r/g, '--CR--\r').replace(/\n/g, '--LF--\n'));
Zitat von: matzemoerk am 28 April 2015, 00:35:41
Das wollte ich mir für morgen Abend vornehmen und du nimmst mir einfach so die Arbeit weg ;-) Danke!
Sehr chick, die Sonos-Anzeige! Dem XBMC-Modul fehlen leider die passenden Readings dafür ;)
Zitat von: matzemoerk am 28 April 2015, 00:35:41
Das wollte ich mir für morgen Abend vornehmen und du nimmst mir einfach so die Arbeit weg ;-) Danke!
Tut mir leid ::)
Kommt bestimmt wieder vor ;)
Coole Oberfläche hast du dir da gebaut, will ich auch.
Hallo!
Bezugnehmend auf die Einträge #1117 und #1123 (Googlekalender) und der Aussage von Nesges
ZitatTermine aus einem oder mehreren Kalendern konnten hier nicht angezeigt werden, da Sie nicht über die nötige Berechtigung verfügen." angezeigt - in dem Fall einfach mal GMail aufrufen und evtl. ein paar Minuten warten.
Wenn man das UI mit WebViewControll betreibt, so wie ich, der kann lange warten! Warum allerdings meine "Fußballkalender" (externe Links) angezeigt werden und der Hauptkalender nicht entzieht sich meiner Kenntnis.
Lade ich das UI im Browser auf dem Tablet wird alles angezeigt! Ich will aber eigentlich mit dem WVC arbeiten.
Wenn also jem. eine Idee hat wie es trotzdem mit WVC funktioniert der solle sich bitte melden 8)
gibt es für Android einen Browser der "echtes" Fullscreen unterstützt?
Zitat von: bjoernbo am 28 April 2015, 15:48:52
gibt es für Android einen Browser der "echtes" Fullscreen unterstützt?
Chrome -> Seite aufrufen -> Optionen -> Shortcut hinzufügen
Wenn du jetzt über das Symbol auf dem Homescreen startest, ist die Seite im Fullscreenmodus. Das funktioniert bei allen Seiten, die den Meta-Tag
<meta name="mobile-web-app-capable" content="yes"> mitbringen.
;D :D ;D :D DANKE nesges! Hat ein wenig gedauert ... heißt bei mir "zu Startbildschirm hinzufügen". Habe mich mit Android nicht auseinandergesetzt! Verwende das Tablet ausschließlich für die Hausautomation. Da ich sonst nur Produkte aus dem Obstkorb verwende war mir diese Option unter Android nicht bekannt!
Funktioniert einwandfrei! 1000 Dank
Zitat von: bjoernbo am 28 April 2015, 16:30:28Da ich sonst nur Produkte aus dem Obstkorb verwende
Da gibt's übrigens etwas ähnliches. Seiten, die
<meta name="apple-mobile-web-app-capable" content="yes"> implementieren, können in Safari auch als Link auf den Homescreen gelegt werden und starten dann im Fullscreenmodus. Allerdings verlässt Safari den Fullscreen, sobald man einem Link zu einer anderen Seite folgt. Von daher nur bedingt tauglich.
So, habe das Device in fhem gelöscht, den Ordner tablet gelöscht, Neustart.
UI runter geladen, neu aufgesetzt, device in fhem neu angelegt, UI upgedatet.
= gleiches Problem :-\
Hab in der index.html mal debug auf 1 und bekomme nun wenigsten ein paar mehr Meldungen:
[Log] Collecting required readings (fhem-tablet-ui.js, line 162)
[Log] Request readings from FHEM (fhem-tablet-ui.js, line 177)
[Log] Loaded plugin: widget_switch (fhem-tablet-ui.js, line 36)
[Log] Loaded plugin: widget_weather (fhem-tablet-ui.js, line 36)
[Log] Loaded plugin: widget_label (fhem-tablet-ui.js, line 36)
[Log] Loaded plugin: widget_thermostat (fhem-tablet-ui.js, line 36)
[Log] Loaded plugin: widget_symbol (fhem-tablet-ui.js, line 36)
[Log] start longpoll (fhem-tablet-ui.js, line 252)
[Log] 2015-04-28 19:09:34 / HZ_Wohnzimmer_WT_Climate / desired-temp / 22.0 (fhem-tablet-ui.js, line 318)
[Log] update done for device:HZ_Wohnzimmer_WT_Climate parameter:desired-temp (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:09:34 / HZ_Wohnzimmer_WT_Climate / humidity / 41 (fhem-tablet-ui.js, line 318)
[Log] update done for device:HZ_Wohnzimmer_WT_Climate parameter:humidity (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:09:34 / HZ_Wohnzimmer_WT_Climate / measured-temp / 21.8 (fhem-tablet-ui.js, line 318)
[Log] thermo dev:HZ_Wohnzimmer_WT_Climate par:measured-temp change:clima.temp
[Log] update done for device:HZ_Wohnzimmer_WT_Climate parameter:measured-temp (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:09:34 / HZ_Wohnzimmer_WT_Climate / STATE / T: 21.8 desired: 22.0 (fhem-tablet-ui.js, line 318)
[Log] update done for device:HZ_Wohnzimmer_WT_Climate parameter:STATE (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:09:34 / HZ_Wohnzimmer_WT_Climate / temperature / 21.8 (fhem-tablet-ui.js, line 318)
[Log] update done for device:HZ_Wohnzimmer_WT_Climate parameter:temperature (fhem-tablet-ui.js, line 61)
[Log] start longpoll (fhem-tablet-ui.js, line 252, x2)
[Log] 2015-04-28 19:11:06 / Wetterstation / STATE / T: 7.8 H: 83 W: 0.0 R: 196.1 IR: no Wi: 0 (fhem-tablet-ui.js, line 318)
[Log] update done for device:Wetterstation parameter:STATE (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:11:06 / Wetterstation / humidity / 83 (fhem-tablet-ui.js, line 318)
[Log] update done for device:Wetterstation parameter:humidity (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:11:06 / Wetterstation / temperature / 7.8 (fhem-tablet-ui.js, line 318)
[Log] update done for device:Wetterstation parameter:temperature (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:11:06 / Wetterstation / pressure / 1016 (fhem-tablet-ui.js, line 318)
[Log] update done for device:Wetterstation parameter:pressure (fhem-tablet-ui.js, line 61)
[Log] 2015-04-28 19:11:06 / Wetterstation / condition / heiter (fhem-tablet-ui.js, line 318)
[Log] update done for device:Wetterstation parameter:condition (fhem-tablet-ui.js, line 61)
Habe jetzt nochmal den Chrom installiert und dort getestet, gleiches Problem. Hier der Log aus Chrom:
fhem-tablet-ui.js:106 Filename: tablet
fhem-tablet-ui.js:191 Please rename widget attribute "type" into "data-type" in http://192.168.0.5:8084/fhem/tablet - Details below:
fhem-tablet-ui.js:192 m.fn.init[1]
fhem-tablet-ui.js:199 Please rename widget attribute "device" into "data-device" in http://192.168.0.5:8084/fhem/tablet device: CUL_HM_HM_SEC_KEY_23DB96 - Details below:
fhem-tablet-ui.js:200 m.fn.init[1]
fhem-tablet-ui.js:199 Please rename widget attribute "device" into "data-device" in http://192.168.0.5:8084/fhem/tablet device: Alarmanlage - Details below:
fhem-tablet-ui.js:200 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Flur_oben - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Bad - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Leoni - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Carlotta - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Schlafzimmer - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Kellerflur - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Waschkeller - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_links - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_rechts - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_ost - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:162 Collecting required readings
fhem-tablet-ui.js:177 Request readings from FHEM
jquery.min.js:4 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
fhem-tablet-ui.js:36 Loaded plugin: widget_switch
fhem-tablet-ui.js:36 Loaded plugin: widget_label
fhem-tablet-ui.js:36 Loaded plugin: widget_symbol
fhem-tablet-ui.js:36 Loaded plugin: widget_thermostat
fhem-tablet-ui.js:36 Loaded plugin: widget_weather
fhem-tablet-ui.js:252 start longpoll
fhem-tablet-ui.js:318 2015-04-28 19:15:59 / FBDECT_Barlicht / temperature / 23.0 C (measured)
fhem-tablet-ui.js:61 update done for device:FBDECT_Barlicht parameter:temperature
fhem-tablet-ui.js:318 2015-04-28 19:16:11 / Wetterstation / STATE / T: 7.8 H: 82 W: 0.0 R: 196.1 IR: no Wi: 0
fhem-tablet-ui.js:61 update done for device:Wetterstation parameter:STATE
fhem-tablet-ui.js:318 2015-04-28 19:16:11 / Wetterstation / humidity / 82
fhem-tablet-ui.js:61 update done for device:Wetterstation parameter:humidity
fhem-tablet-ui.js:318 2015-04-28 19:16:11 / Wetterstation / temperature / 7.8
fhem-tablet-ui.js:61 update done for device:Wetterstation parameter:temperature
fhem-tablet-ui.js:318 2015-04-28 19:16:11 / Wetterstation / condition / heiter
fhem-tablet-ui.js:61 update done for device:Wetterstation parameter:condition
fhem-tablet-ui.js:318 2015-04-28 19:16:11 / Wetterstation / pressure / 1016
fhem-tablet-ui.js:61 update done for device:Wetterstation parameter:pressure
Was ich komisch finde, ist dass das device FBDECT_Barlicht gelesen wird. Dieses ist in der index gar nicht definiert.
Und was bedeutet dieser Fehler: jquery.min.js:4 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
- "Synchronous XMLHttpRequest" kannst du ignorieren, das ist eine Empfehlung, wir brauchen das aber so.
- FBDECT_Barlicht kommt per LongPoll rein, wird dann aber ignoriert, weil es nicht in der index.html drin ist
- schalte bitte mal Longpoll in der index.html aus, das funktioniert ja und wir wollen die shortpoll logs ansehen
- Es sieht so aus, als ob die requestFhem function bei dir nicht klappt, die müssen wir unter die Lupe nehmen
bitte füge mal die Zeile ein, die nesges heute 00:47:04 vorgeschlagen hat und dann brauchen wir den Output
Im FHEM Log müsste auch der Request aufschlagen, evtl. erst bei einem Verbose Level 4. Das wäre auch interessant, was dort ankommt, beim requestFhem.
Hallo,
zuerst von mir ein dickes RESPEKT! für dieses rattenscharfe UI ;-)
Ich habe mir aus einigen Beispielen die erste Seite zusammen kopiert und es funktioniert einwandfrei.
<div data-type="symbol" data-device="wz.dr.0" class="narrow"></div>
Zeigt mir brav den auf / zu Zustand der Tür an.
Nun scheitere ich an folgendem Problem: statt dem "Windows" Icon möchte ich die für mich gewohnten offene Tür / geschlossene Tür Icons verwenden.
<div data-type="symbol"
data-device="wz.dr.0"
data-get-on='["open","closed"]'
data-icons='["oa-fts_door_open","oa-fts_door"]'
class="narrow"></div>
interessiert sich leider überhaupt nicht für den Zustand der Tür und zeigt immer "offen".
Wo liegt mein Denkfehler?
Hallo roberPI,
danke fürs Lob!
Der Fehler mit dem Icons liegt nicht an dir ...
Wenn man Arrays benutzen will, dann müssen beim Symbol Widget drei Arrays angegeben werden.
Bei dir fehlt
data-on-colors='["IndianRed","SeaGreen"]'
Müsste etwas toleranter sein, gebe ich zu. Werden wir mal umbauen ...
@setstate: Danke!!!
So, longpoll ist aus und die Zeile habe ich eingefügt.
Bringt aber keine neuen "Fehler" im Log:
fhem-tablet-ui.js:106 Filename: tablet
fhem-tablet-ui.js:191 Please rename widget attribute "type" into "data-type" in http://192.168.0.5:8084/fhem/tablet - Details below:
fhem-tablet-ui.js:192 m.fn.init[1]
fhem-tablet-ui.js:199 Please rename widget attribute "device" into "data-device" in http://192.168.0.5:8084/fhem/tablet device: CUL_HM_HM_SEC_KEY_23DB96 - Details below:
fhem-tablet-ui.js:200 m.fn.init[1]
fhem-tablet-ui.js:199 Please rename widget attribute "device" into "data-device" in http://192.168.0.5:8084/fhem/tablet device: Alarmanlage - Details below:
fhem-tablet-ui.js:200 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Flur_oben - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Bad - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Leoni - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Carlotta - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: Fenster_Schlafzimmer - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Kellerflur - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Waschkeller - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_links - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_rechts - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:204 Please rename widget "contact" into "symbol" in http://192.168.0.5:8084/fhem/tablet device: CUL_FHTTK_Hobbyraum_ost - Details below:
fhem-tablet-ui.js:205 m.fn.init[1]
fhem-tablet-ui.js:162 Collecting required readings
fhem-tablet-ui.js:177 Request readings from FHEM
jquery.min.js:4 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
fhem-tablet-ui.js:36 Loaded plugin: widget_switch
fhem-tablet-ui.js:36 Loaded plugin: widget_label
fhem-tablet-ui.js:36 Loaded plugin: widget_weather
fhem-tablet-ui.js:36 Loaded plugin: widget_symbol
fhem-tablet-ui.js:36 Loaded plugin: widget_thermostat
14fhem-tablet-ui.js:351 data
78fhem-tablet-ui.js:351 data Wenn ich auf die 14 klicke kommt genau die eingefügte Zeile:
console.log('data',data.replace(/\r/g, '--CR--\r').replace(/\n/g, '--LF--\n')); Die 78 zählt hoch und verweist auch auf diese Zeile.
Habe noch verbose 5 gesetzt und hier der (sehr lange) Log:
[code]2015.04.28 20:20:04 5: Cmd: >attr global verbose 3<
2015.04.28 20:20:04 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem&detail=global&dev.attrglobal=global&cmd.attrglobal=attr&arg.attrglobal=verbose&val.attrglobal=3
2015.04.28 20:20:04 4: Connection closed for FHEMWEB:192.168.0.24:62059: EOF
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 000000160004000000000000 -> powerFactor: 0.000
2015.04.28 20:19:59 5: Fritzi dispatch 0703001c00000187001000000000000c000000160004000000000000
2015.04.28 20:19:59 5: FBAHA/RAW: /0703001c00000187001000000000000c000000160004000000000000
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 000000150004000000001a4f -> energy: 6735 Wh
2015.04.28 20:19:59 5: Fritzi dispatch 0703001c00000187001000000000000c000000150004000000001a4f
2015.04.28 20:19:59 5: FBAHA/RAW: /0703001c00000187001000000000000c000000150004000000001a4f
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 000000120004000000000000 -> current: 0.0000 A
2015.04.28 20:19:59 5: Fritzi dispatch 0703001c00000187001000000000000c000000120004000000000000
2015.04.28 20:19:59 5: FBAHA/RAW: /0703001c00000187001000000000000c000000120004000000000000
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 0000001300040000000378df -> voltage: 227.551 V
2015.04.28 20:19:59 5: Fritzi dispatch 0703001c00000187001000000000000c0000001300040000000378df
2015.04.28 20:19:59 5: FBAHA/RAW: /0703001c00000187001000000000000c0000001300040000000378df
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 0000001700080000000000eb00000000 -> temperature: 23.5 C (measured)
2015.04.28 20:19:59 5: Fritzi dispatch 070300200000018700100000000000100000001700080000000000eb00000000
2015.04.28 20:19:59 5: FBAHA/RAW: /070300200000018700100000000000100000001700080000000000eb00000000
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 0000000f0004000000000000 -> state: off
2015.04.28 20:19:59 5: Fritzi dispatch 0703001c00000187001000000000000c0000000f0004000000000000
2015.04.28 20:19:59 5: FBAHA/RAW: /0703001c00000187001000000000000c0000000f0004000000000000
2015.04.28 20:19:59 5: FBDECT_Parse for device FBDECT_Barlicht done
2015.04.28 20:19:59 4: Payload: 000000140004000000000000 -> power: 0.00 W
2015.04.28 20:19:59 5: Fritzi dispatch 0703001c00000187001000000000000c000000140004000000000000
2015.04.28 20:19:59 5: FBAHA/RAW: /0703001c00000187001000000000000c000000140004000000000000
2015.04.28 20:19:59 5: HMLAN_Parse: HMLan V:03C4 sNo:LEQ0102378 d:26E9A0 O:26E9A0 t:01177BF9 IDcnt:002A
2015.04.28 20:19:59 5: HMLAN/RAW: /HHM-LAN-IF,03C4,LEQ0102378,26E9A0,26E9A0,01177BF9,002A,08
2015.04.28 20:19:59 5: HMLAN_Send: HMLan I:K
/
2015.04.28 20:19:58 4: 2118:FHEMWEB:192.168.0.24:62060: /fhem?cmd={AttrVal(%22global%22,%22verbose%22,%22%22)}&XHR=1 / RL:22 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:58 5: Cmd: >{AttrVal("global","verbose","")}<
2015.04.28 20:19:58 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem?cmd={AttrVal(%22global%22,%22verbose%22,%22%22)}&XHR=1
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.42:46605 GET /fhem/?XHR=1&inform=type%3Draw%3Bfilter%3D.*&_=1430242008685
2015.04.28 20:19:56 4: Connection accepted from FHEMWEB:192.168.0.42:46605
2015.04.28 20:19:56 4: Connection closed for FHEMWEB:192.168.0.42:46603: EOF
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch_Weather , Type: CUL_HM , Event: measured-temp: 22.2 , Reading: measured-temp , Value: 22.2 , Unit:
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Couch_Weather
2015.04.28 20:19:56 5: Notify loop for HZ_Couch_Weather measured-temp: 22.2
2015.04.28 20:19:56 5: Triggering HZ_Couch_Weather (2 changes)
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:56 5: Notify loop for temperatures HZ_Couch_Clima.window: <svg class="icon fts_window_2w" alt="closed" title="closed" version="1.0" xmlns="http://www.w3.org/2000/svg" width="468pt" height="340pt" viewBox="0 0 468 340" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,340) scale(0.158644,-0.158644)" stroke="none"> <path d="M74 2120 c-81 -40 -75 35 -72 -1052 3 -958 3 -967 24 -994 11 -15 33 -37 48 -48 27 -21 29 -21 1400 -21 l1373 0 37 29 c70 53 66 -6 66 1055 l0 959 -27 33 c-53 63 35 59 -1450 59 -1346 0 -1358 0 -1399 -20z m1336 -698 l0 -338 -32 -9 c-21 -6 -38 -21 -46 -37 -18 -39 2 -80 46 -93 l32 -9 0 -397 0 -396 -619 -8 c-456 -5 -624 -4 -640 4 l-21 12 0 804 0 805 640 0 640 0 0 -338z m1408 -469 l-3 -808 -637 -3 -638 -2 0 400 c0 377 1 400 18 400 36 0 62 29 62 70 0 41 -26 70 -62 70 -17 0 -18 21 -18 340 l0 340 640 0 640 0 -2 -807z"/> </g> </svg>
2015.04.28 20:19:56 5: Triggering temperatures (1 changes)
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:56 5: Notify loop for temperatures HZ_Couch_Clima.measured-temp: 22.2 °C
2015.04.28 20:19:56 5: Triggering temperatures (1 changes)
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:56 5: Notify loop for temperatures HZ_Couch_Clima.desired-temp: 22.0 °C
2015.04.28 20:19:56 5: Triggering temperatures (1 changes)
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:56 5: Notify loop for temperatures HZ_Couch_Clima.controlMode: <svg class="icon sani_heating_manual" alt="manual" title="manual" version="1.0" xmlns="http://www.w3.org/2000/svg" width="469pt" height="487pt" viewBox="0 0 469 487" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,487) scale(0.163636,-0.163636)" stroke="none"> <path d="M1257 2961 c-57 -12 -70 -31 -75 -106 l-4 -65 -114 0 -114 0 0 45 c0 63 -22 113 -54 121 -15 3 -58 4 -96 2 -91 -5 -110 -22 -117 -107 l-6 -61 -112 0 -113 0 -7 62 c-11 89 -32 108 -125 108 -74 0 -123 -16 -134 -45 -3 -9 -6 -41 -6 -71 l0 -54 -68 0 c-96 0 -102 -8 -102 -137 0 -125 6 -133 103 -133 l67 0 0 -505 0 -505 -75 0 c-92 0 -95 -4 -95 -130 0 -124 4 -130 89 -130 l67 0 12 -62 c7 -38 20 -70 34 -85 21 -23 29 -25 105 -21 105 4 122 18 130 107 l6 61 113 0 114 0 0 -32 c0 -52 19 -106 43 -123 13 -9 44 -15 83 -15 114 0 144 25 144 120 l0 50 115 0 115 0 0 -41 c0 -52 24 -103 56 -118 32 -14 109 -13 154 2 42 15 60 47 60 110 l0 47 48 0 c27 0 57 7 70 16 20 14 22 23 22 119 0 125 -6 135 -86 135 l-54 0 0 500 0 500 49 0 c69 0 90 20 98 91 7 71 -3 144 -23 164 -10 10 -35 15 -70 15 l-54 0 0 38 c0 47 -16 107 -33 120 -17 14 -115 21 -160 13z m93 -936 l-1 -845 -34 0 -35 0 0 845 0 845 35 0 35 0 0 -845z m-1000 -5 l0 -840 -35 0 -35 0 0 840 0 840 35 0 35 0 0 -840z m500 0 l0 -840 -35 0 -35 0 0 840 0 840 35 0 35 0 0 -840z m-170 0 l0 -500 -115 0 -115 0 0 500 0 500 115 0 115 0 0 -500z m498 -2 l-3 -503 -112 -3 -113 -3 0 506 0 505 115 0 115 0 -2 -502z"/> <path d="M1644 2765 c-20 -31 -17 -206 4 -227 8 -8 46 -14 100 -16 117 -5 134 7 140 101 2 37 1 82 -2 101 -11 59 -26 66 -131 66 -90 0 -95 -1 -111 -25z m146 -110 c0 -32 -2 -35 -30 -35 -28 0 -30 3 -30 35 0 32 2 35 30 35 28 0 30 -3 30 -35z"/> <path d="M2254 1659 c-50 -14 -77 -51 -82 -114 l-4 -55 -65 0 c-76 0 -97 -9 -120 -53 -16 -28 -19 -71 -23 -347 -5 -292 -6 -311 -19 -266 -28 95 -85 132 -177 115 -62 -12 -117 -48 -134 -89 -12 -29 -6 -64 80 -428 51 -218 97 -403 103 -409 15 -21 55 -15 71 9 13 21 7 57 -74 400 -49 208 -87 384 -84 392 7 17 66 39 90 34 12 -2 36 -63 85 -217 38 -118 75 -218 81 -223 19 -12 52 -10 66 4 9 9 12 130 12 483 0 369 3 475 13 489 9 13 23 17 52 14 l40 -3 3 -372 2 -373 25 -16 c23 -15 27 -15 50 0 l25 16 0 460 0 460 60 0 60 0 0 -422 c0 -451 2 -470 48 -476 52 -8 52 -8 52 394 l0 374 38 0 c71 0 66 25 72 -431 5 -400 6 -412 25 -419 11 -4 30 -4 43 1 l22 8 0 316 0 315 23 0 c13 0 28 -5 35 -12 9 -9 12 -154 12 -593 0 -439 3 -584 12 -593 19 -19 66 -15 78 7 14 28 14 1142 -1 1195 -15 53 -48 83 -101 91 l-45 7 -11 61 c-7 34 -20 73 -30 87 -26 35 -79 60 -129 60 -37 0 -43 3 -43 20 0 36 -28 77 -64 94 -37 17 -121 20 -172 5z"/> </g> </svg>
2015.04.28 20:19:56 5: Triggering temperatures (1 changes)
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:56 5: Notify loop for temperatures HZ_Couch_Clima.ValvePosition: 0%
2015.04.28 20:19:56 5: Triggering temperatures (1 changes)
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch_Clima , Type: CUL_HM , Event: temperature: 22.2 , Reading: temperature , Value: 22.2 , Unit: °C
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch_Clima , Type: CUL_HM , Event: measured-temp: 22.2 , Reading: measured-temp , Value: 22.2 , Unit:
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch_Clima , Type: CUL_HM , Event: desired-temp: 22.0 , Reading: desired-temp , Value: 22.0 , Unit:
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch_Clima , Type: CUL_HM , Event: ValvePosition: 0 , Reading: ValvePosition , Value: 0 , Unit:
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Couch_Clima
2015.04.28 20:19:56 5: Klima: not on any display, ignoring notify
2015.04.28 20:19:56 5: Notify loop for HZ_Couch_Clima ValvePosition: 0
2015.04.28 20:19:56 5: Triggering HZ_Couch_Clima (7 changes)
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch , Type: CUL_HM , Event: measured-temp: 22.2 , Reading: measured-temp , Value: 22.2 , Unit:
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch , Type: CUL_HM , Event: desired-temp: 22.0 , Reading: desired-temp , Value: 22.0 , Unit:
2015.04.28 20:19:56 5: DbLog: logging of Device: HZ_Couch , Type: CUL_HM , Event: actuator: 0 , Reading: actuator , Value: 0 , Unit:
2015.04.28 20:19:56 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Couch
2015.04.28 20:19:56 5: Notify loop for HZ_Couch actuator: 0
2015.04.28 20:19:56 5: Triggering HZ_Couch (4 changes)
2015.04.28 20:19:56 5: HMLan dispatch A0FE38610319C720000000AB0DE0F0040::-58:HMLan
2015.04.28 20:19:56 5: HMLAN_Parse: HMLan R:E319C72 stat:0000 t:0117711E d:FF r:FFC6 m:E3 8610 319C72 000000 0AB0DE0F0040
2015.04.28 20:19:56 5: HMLAN/RAW: /E319C72,0000,0117711E,FF,FFC6,E38610319C720000000AB0DE0F0040
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem?XHR=1&inform=type=status;filter=global;since=1430245194;fmt=JSON×tamp=1430245197442
/
2015.04.28 20:19:56 4: 2118:FHEMWEB:192.168.0.24:62059: /fhem?cmd={AttrVal(%22global%22,%22room%22,%22%22)}&XHR=1 / RL:21 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:56 5: Cmd: >{AttrVal("global","room","")}<
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem?cmd={AttrVal(%22global%22,%22room%22,%22%22)}&XHR=1
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/dashboard_ios7.css
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/ios7Common.css
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62064 GET /fhem/pgm2/fhemweb_colorpicker.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/pgm2/cordova-2.3.0.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/fhemweb_readingsGroup.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/fhemweb_sortable.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/codemirror/fhem_codemirror.js
2015.04.28 20:19:56 4: Connection accepted from FHEMWEB:192.168.0.24:62064
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62063 GET /fhem/js/webviewcontrol.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/pgm2/dk.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/fhemweb_knob.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/pgm2/fhemweb_uzsu.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/fhemweb_readingsHistory.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62063 GET /fhem/pgm2/fhemweb.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/pgm2/jquery.min.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/pgm2/jquery-ui.min.css
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/jquery-ui.min.js
2015.04.28 20:19:56 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/style.css
2015.04.28 20:19:56 5: HMLan dispatch A0C42C67029DA84000000016E64::-83:HMLan
2015.04.28 20:19:56 5: HMLAN_Parse: HMLan R:E29DA84 stat:0000 t:01176F7D d:FF r:FFAD m:42 C670 29DA84 000000 016E64
2015.04.28 20:19:56 5: HMLAN/RAW: /E29DA84,0000,01176F7D,FF,FFAD,42C67029DA84000000016E64
/
2015.04.28 20:19:56 4: 2118:FHEMWEB:192.168.0.24:62059: /fhem?detail=global / RL:33759 / text/html; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:55 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem?detail=global
2015.04.28 20:19:55 4: Connection closed for FHEMWEB:192.168.0.24:62058: EOF
2015.04.28 20:19:54 4: HMLAN_ack: timeout - clear queue
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten_Weather , Type: CUL_HM , Event: measured-temp: 21.9 , Reading: measured-temp , Value: 21.9 , Unit:
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Flur_unten_Weather
2015.04.28 20:19:54 5: Notify loop for HZ_Flur_unten_Weather measured-temp: 21.9
2015.04.28 20:19:54 5: Triggering HZ_Flur_unten_Weather (2 changes)
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:54 5: Notify loop for temperatures HZ_Flur_unten_Clima.window: <svg class="icon fts_window_2w" alt="closed" title="closed" version="1.0" xmlns="http://www.w3.org/2000/svg" width="468pt" height="340pt" viewBox="0 0 468 340" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,340) scale(0.158644,-0.158644)" stroke="none"> <path d="M74 2120 c-81 -40 -75 35 -72 -1052 3 -958 3 -967 24 -994 11 -15 33 -37 48 -48 27 -21 29 -21 1400 -21 l1373 0 37 29 c70 53 66 -6 66 1055 l0 959 -27 33 c-53 63 35 59 -1450 59 -1346 0 -1358 0 -1399 -20z m1336 -698 l0 -338 -32 -9 c-21 -6 -38 -21 -46 -37 -18 -39 2 -80 46 -93 l32 -9 0 -397 0 -396 -619 -8 c-456 -5 -624 -4 -640 4 l-21 12 0 804 0 805 640 0 640 0 0 -338z m1408 -469 l-3 -808 -637 -3 -638 -2 0 400 c0 377 1 400 18 400 36 0 62 29 62 70 0 41 -26 70 -62 70 -17 0 -18 21 -18 340 l0 340 640 0 640 0 -2 -807z"/> </g> </svg>
2015.04.28 20:19:54 5: Triggering temperatures (1 changes)
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:54 5: Notify loop for temperatures HZ_Flur_unten_Clima.measured-temp: 21.9 °C
2015.04.28 20:19:54 5: Triggering temperatures (1 changes)
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:54 5: Notify loop for temperatures HZ_Flur_unten_Clima.desired-temp: 16.0 °C
2015.04.28 20:19:54 5: Triggering temperatures (1 changes)
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:54 5: Notify loop for temperatures HZ_Flur_unten_Clima.controlMode: <svg class="icon sani_heating_manual" alt="manual" title="manual" version="1.0" xmlns="http://www.w3.org/2000/svg" width="469pt" height="487pt" viewBox="0 0 469 487" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,487) scale(0.163636,-0.163636)" stroke="none"> <path d="M1257 2961 c-57 -12 -70 -31 -75 -106 l-4 -65 -114 0 -114 0 0 45 c0 63 -22 113 -54 121 -15 3 -58 4 -96 2 -91 -5 -110 -22 -117 -107 l-6 -61 -112 0 -113 0 -7 62 c-11 89 -32 108 -125 108 -74 0 -123 -16 -134 -45 -3 -9 -6 -41 -6 -71 l0 -54 -68 0 c-96 0 -102 -8 -102 -137 0 -125 6 -133 103 -133 l67 0 0 -505 0 -505 -75 0 c-92 0 -95 -4 -95 -130 0 -124 4 -130 89 -130 l67 0 12 -62 c7 -38 20 -70 34 -85 21 -23 29 -25 105 -21 105 4 122 18 130 107 l6 61 113 0 114 0 0 -32 c0 -52 19 -106 43 -123 13 -9 44 -15 83 -15 114 0 144 25 144 120 l0 50 115 0 115 0 0 -41 c0 -52 24 -103 56 -118 32 -14 109 -13 154 2 42 15 60 47 60 110 l0 47 48 0 c27 0 57 7 70 16 20 14 22 23 22 119 0 125 -6 135 -86 135 l-54 0 0 500 0 500 49 0 c69 0 90 20 98 91 7 71 -3 144 -23 164 -10 10 -35 15 -70 15 l-54 0 0 38 c0 47 -16 107 -33 120 -17 14 -115 21 -160 13z m93 -936 l-1 -845 -34 0 -35 0 0 845 0 845 35 0 35 0 0 -845z m-1000 -5 l0 -840 -35 0 -35 0 0 840 0 840 35 0 35 0 0 -840z m500 0 l0 -840 -35 0 -35 0 0 840 0 840 35 0 35 0 0 -840z m-170 0 l0 -500 -115 0 -115 0 0 500 0 500 115 0 115 0 0 -500z m498 -2 l-3 -503 -112 -3 -113 -3 0 506 0 505 115 0 115 0 -2 -502z"/> <path d="M1644 2765 c-20 -31 -17 -206 4 -227 8 -8 46 -14 100 -16 117 -5 134 7 140 101 2 37 1 82 -2 101 -11 59 -26 66 -131 66 -90 0 -95 -1 -111 -25z m146 -110 c0 -32 -2 -35 -30 -35 -28 0 -30 3 -30 35 0 32 2 35 30 35 28 0 30 -3 30 -35z"/> <path d="M2254 1659 c-50 -14 -77 -51 -82 -114 l-4 -55 -65 0 c-76 0 -97 -9 -120 -53 -16 -28 -19 -71 -23 -347 -5 -292 -6 -311 -19 -266 -28 95 -85 132 -177 115 -62 -12 -117 -48 -134 -89 -12 -29 -6 -64 80 -428 51 -218 97 -403 103 -409 15 -21 55 -15 71 9 13 21 7 57 -74 400 -49 208 -87 384 -84 392 7 17 66 39 90 34 12 -2 36 -63 85 -217 38 -118 75 -218 81 -223 19 -12 52 -10 66 4 9 9 12 130 12 483 0 369 3 475 13 489 9 13 23 17 52 14 l40 -3 3 -372 2 -373 25 -16 c23 -15 27 -15 50 0 l25 16 0 460 0 460 60 0 60 0 0 -422 c0 -451 2 -470 48 -476 52 -8 52 -8 52 394 l0 374 38 0 c71 0 66 25 72 -431 5 -400 6 -412 25 -419 11 -4 30 -4 43 1 l22 8 0 316 0 315 23 0 c13 0 28 -5 35 -12 9 -9 12 -154 12 -593 0 -439 3 -584 12 -593 19 -19 66 -15 78 7 14 28 14 1142 -1 1195 -15 53 -48 83 -101 91 l-45 7 -11 61 c-7 34 -20 73 -30 87 -26 35 -79 60 -129 60 -37 0 -43 3 -43 20 0 36 -28 77 -64 94 -37 17 -121 20 -172 5z"/> </g> </svg>
2015.04.28 20:19:54 5: Triggering temperatures (1 changes)
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:54 5: Notify loop for temperatures HZ_Flur_unten_Clima.ValvePosition: 0%
2015.04.28 20:19:54 5: Triggering temperatures (1 changes)
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten_Clima , Type: CUL_HM , Event: temperature: 21.9 , Reading: temperature , Value: 21.9 , Unit: °C
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten_Clima , Type: CUL_HM , Event: measured-temp: 21.9 , Reading: measured-temp , Value: 21.9 , Unit:
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten_Clima , Type: CUL_HM , Event: desired-temp: 16.0 , Reading: desired-temp , Value: 16.0 , Unit:
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten_Clima , Type: CUL_HM , Event: ValvePosition: 0 , Reading: ValvePosition , Value: 0 , Unit:
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Flur_unten_Clima
2015.04.28 20:19:54 5: Klima: not on any display, ignoring notify
2015.04.28 20:19:54 5: Notify loop for HZ_Flur_unten_Clima ValvePosition: 0
2015.04.28 20:19:54 5: Triggering HZ_Flur_unten_Clima (7 changes)
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten , Type: CUL_HM , Event: measured-temp: 21.9 , Reading: measured-temp , Value: 21.9 , Unit:
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten , Type: CUL_HM , Event: desired-temp: 16.0 , Reading: desired-temp , Value: 16.0 , Unit:
2015.04.28 20:19:54 5: DbLog: logging of Device: HZ_Flur_unten , Type: CUL_HM , Event: actuator: 0 , Reading: actuator , Value: 0 , Unit:
2015.04.28 20:19:54 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Flur_unten
2015.04.28 20:19:54 5: Notify loop for HZ_Flur_unten actuator: 0
2015.04.28 20:19:54 5: Triggering HZ_Flur_unten (4 changes)
2015.04.28 20:19:54 5: HMLan dispatch A0F0986102E67300000000A80DB0E0040::-52:HMLan
2015.04.28 20:19:54 5: HMLAN_Parse: HMLan R:E2E6730 stat:0000 t:011768F0 d:FF r:FFCC m:09 8610 2E6730 000000 0A80DB0E0040
2015.04.28 20:19:54 5: HMLAN/RAW: /E2E6730,0000,011768F0,FF,FFCC,0986102E67300000000A80DB0E0040
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche_Weather , Type: CUL_HM , Event: measured-temp: 22.2 , Reading: measured-temp , Value: 22.2 , Unit:
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Kueche_Weather
2015.04.28 20:19:53 5: Notify loop for HZ_Kueche_Weather measured-temp: 22.2
2015.04.28 20:19:53 5: Triggering HZ_Kueche_Weather (2 changes)
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:53 5: Notify loop for temperatures HZ_Kueche_Clima.window: <svg class="icon fts_window_2w" alt="closed" title="closed" version="1.0" xmlns="http://www.w3.org/2000/svg" width="468pt" height="340pt" viewBox="0 0 468 340" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,340) scale(0.158644,-0.158644)" stroke="none"> <path d="M74 2120 c-81 -40 -75 35 -72 -1052 3 -958 3 -967 24 -994 11 -15 33 -37 48 -48 27 -21 29 -21 1400 -21 l1373 0 37 29 c70 53 66 -6 66 1055 l0 959 -27 33 c-53 63 35 59 -1450 59 -1346 0 -1358 0 -1399 -20z m1336 -698 l0 -338 -32 -9 c-21 -6 -38 -21 -46 -37 -18 -39 2 -80 46 -93 l32 -9 0 -397 0 -396 -619 -8 c-456 -5 -624 -4 -640 4 l-21 12 0 804 0 805 640 0 640 0 0 -338z m1408 -469 l-3 -808 -637 -3 -638 -2 0 400 c0 377 1 400 18 400 36 0 62 29 62 70 0 41 -26 70 -62 70 -17 0 -18 21 -18 340 l0 340 640 0 640 0 -2 -807z"/> </g> </svg>
2015.04.28 20:19:53 5: Triggering temperatures (1 changes)
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:53 5: Notify loop for temperatures HZ_Kueche_Clima.measured-temp: 22.2 °C
2015.04.28 20:19:53 5: Triggering temperatures (1 changes)
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:53 5: Notify loop for temperatures HZ_Kueche_Clima.desired-temp: 22.0 °C
2015.04.28 20:19:53 5: Triggering temperatures (1 changes)
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:53 5: Notify loop for temperatures HZ_Kueche_Clima.controlMode: <svg class="icon sani_heating_manual" alt="manual" title="manual" version="1.0" xmlns="http://www.w3.org/2000/svg" width="469pt" height="487pt" viewBox="0 0 469 487" preserveAspectRatio="xMidYMid meet"> <metadata> Created by potrace 1.8, written by Peter Selinger 2001-2007 </metadata> <g transform="translate(0,487) scale(0.163636,-0.163636)" stroke="none"> <path d="M1257 2961 c-57 -12 -70 -31 -75 -106 l-4 -65 -114 0 -114 0 0 45 c0 63 -22 113 -54 121 -15 3 -58 4 -96 2 -91 -5 -110 -22 -117 -107 l-6 -61 -112 0 -113 0 -7 62 c-11 89 -32 108 -125 108 -74 0 -123 -16 -134 -45 -3 -9 -6 -41 -6 -71 l0 -54 -68 0 c-96 0 -102 -8 -102 -137 0 -125 6 -133 103 -133 l67 0 0 -505 0 -505 -75 0 c-92 0 -95 -4 -95 -130 0 -124 4 -130 89 -130 l67 0 12 -62 c7 -38 20 -70 34 -85 21 -23 29 -25 105 -21 105 4 122 18 130 107 l6 61 113 0 114 0 0 -32 c0 -52 19 -106 43 -123 13 -9 44 -15 83 -15 114 0 144 25 144 120 l0 50 115 0 115 0 0 -41 c0 -52 24 -103 56 -118 32 -14 109 -13 154 2 42 15 60 47 60 110 l0 47 48 0 c27 0 57 7 70 16 20 14 22 23 22 119 0 125 -6 135 -86 135 l-54 0 0 500 0 500 49 0 c69 0 90 20 98 91 7 71 -3 144 -23 164 -10 10 -35 15 -70 15 l-54 0 0 38 c0 47 -16 107 -33 120 -17 14 -115 21 -160 13z m93 -936 l-1 -845 -34 0 -35 0 0 845 0 845 35 0 35 0 0 -845z m-1000 -5 l0 -840 -35 0 -35 0 0 840 0 840 35 0 35 0 0 -840z m500 0 l0 -840 -35 0 -35 0 0 840 0 840 35 0 35 0 0 -840z m-170 0 l0 -500 -115 0 -115 0 0 500 0 500 115 0 115 0 0 -500z m498 -2 l-3 -503 -112 -3 -113 -3 0 506 0 505 115 0 115 0 -2 -502z"/> <path d="M1644 2765 c-20 -31 -17 -206 4 -227 8 -8 46 -14 100 -16 117 -5 134 7 140 101 2 37 1 82 -2 101 -11 59 -26 66 -131 66 -90 0 -95 -1 -111 -25z m146 -110 c0 -32 -2 -35 -30 -35 -28 0 -30 3 -30 35 0 32 2 35 30 35 28 0 30 -3 30 -35z"/> <path d="M2254 1659 c-50 -14 -77 -51 -82 -114 l-4 -55 -65 0 c-76 0 -97 -9 -120 -53 -16 -28 -19 -71 -23 -347 -5 -292 -6 -311 -19 -266 -28 95 -85 132 -177 115 -62 -12 -117 -48 -134 -89 -12 -29 -6 -64 80 -428 51 -218 97 -403 103 -409 15 -21 55 -15 71 9 13 21 7 57 -74 400 -49 208 -87 384 -84 392 7 17 66 39 90 34 12 -2 36 -63 85 -217 38 -118 75 -218 81 -223 19 -12 52 -10 66 4 9 9 12 130 12 483 0 369 3 475 13 489 9 13 23 17 52 14 l40 -3 3 -372 2 -373 25 -16 c23 -15 27 -15 50 0 l25 16 0 460 0 460 60 0 60 0 0 -422 c0 -451 2 -470 48 -476 52 -8 52 -8 52 394 l0 374 38 0 c71 0 66 25 72 -431 5 -400 6 -412 25 -419 11 -4 30 -4 43 1 l22 8 0 316 0 315 23 0 c13 0 28 -5 35 -12 9 -9 12 -154 12 -593 0 -439 3 -584 12 -593 19 -19 66 -15 78 7 14 28 14 1142 -1 1195 -15 53 -48 83 -101 91 l-45 7 -11 61 c-7 34 -20 73 -30 87 -26 35 -79 60 -129 60 -37 0 -43 3 -43 20 0 36 -28 77 -64 94 -37 17 -121 20 -172 5z"/> </g> </svg>
2015.04.28 20:19:53 5: Triggering temperatures (1 changes)
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:53 5: Notify loop for temperatures HZ_Kueche_Clima.ValvePosition: 0%
2015.04.28 20:19:53 5: Triggering temperatures (1 changes)
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche_Clima , Type: CUL_HM , Event: temperature: 22.2 , Reading: temperature , Value: 22.2 , Unit: °C
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche_Clima , Type: CUL_HM , Event: measured-temp: 22.2 , Reading: measured-temp , Value: 22.2 , Unit:
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche_Clima , Type: CUL_HM , Event: desired-temp: 22.0 , Reading: desired-temp , Value: 22.0 , Unit:
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche_Clima , Type: CUL_HM , Event: ValvePosition: 0 , Reading: ValvePosition , Value: 0 , Unit:
2015.04.28 20:19:53 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Kueche_Clima
2015.04.28 20:19:53 5: Klima: not on any display, ignoring notify
2015.04.28 20:19:53 5: Notify loop for HZ_Kueche_Clima ValvePosition: 0
2015.04.28 20:19:53 5: Triggering HZ_Kueche_Clima (7 changes)
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche , Type: CUL_HM , Event: measured-temp: 22.2 , Reading: measured-temp , Value: 22.2 , Unit:
2015.04.28 20:19:53 5: DbLog: logging of Device: HZ_Kueche , Type: CUL_HM , Event: desired-temp: 22.0 , Reading: desired-temp , Value: 22.0 , Unit:
2015.04.28 20:19:52 5: DbLog: logging of Device: HZ_Kueche , Type: CUL_HM , Event: actuator: 0 , Reading: actuator , Value: 0 , Unit:
2015.04.28 20:19:52 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:HZ_Kueche
2015.04.28 20:19:52 5: Notify loop for HZ_Kueche actuator: 0
2015.04.28 20:19:52 5: Triggering HZ_Kueche (4 changes)
2015.04.28 20:19:52 5: HMLan dispatch A0F138610319C730000000AB0DE0F0040::-55:HMLan
2015.04.28 20:19:52 5: HMLAN_Parse: HMLan R:E319C73 stat:0000 t:011763D7 d:FF r:FFC9 m:13 8610 319C73 000000 0AB0DE0F0040
2015.04.28 20:19:52 5: HMLAN/RAW: /E319C73,0000,011763D7,FF,FFC9,138610319C730000000AB0DE0F0040
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem?XHR=1&inform=type=status;filter=room=Unsorted;since=1430245191;fmt=JSON×tamp=1430245194062
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/dashboard_ios7.css
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/js/webviewcontrol.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/codemirror/fhem_codemirror.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/fhemweb_sortable.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/fhemweb_readingsGroup.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/pgm2/ios7Common.css
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/cordova-2.3.0.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62063 GET /fhem/pgm2/fhemweb_colorpicker.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/pgm2/fhemweb_uzsu.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/dk.js
2015.04.28 20:19:52 4: Connection accepted from FHEMWEB:192.168.0.24:62063
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/fhemweb_readingsHistory.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/fhemweb_knob.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/pgm2/jquery-ui.min.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/fhemweb.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/pgm2/jquery.min.js
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/jquery-ui.min.css
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/style.css
/
2015.04.28 20:19:52 4: 2118:FHEMWEB:192.168.0.24:62058: /fhem?room=Unsorted / RL:45295 / text/html; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:52 4: SB_SERVER_Set(SqueezeServer): called
2015.04.28 20:19:52 5: GEOFANCY geofency: called function GEOFANCY_Set()
2015.04.28 20:19:52 5: GEOFANCY geofancy: called function GEOFANCY_Set()
2015.04.28 20:19:52 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem?room=Unsorted
2015.04.28 20:19:52 4: Connection closed for FHEMWEB:192.168.0.24:62057: EOF
2015.04.28 20:19:51 4: HMLAN_ack: timeout - clear queue
2015.04.28 20:19:50 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:temperatures
2015.04.28 20:19:50 5: Notify loop for temperatures FHT_Kellerflur.actuator: 0%
2015.04.28 20:19:50 5: Triggering temperatures (1 changes)
2015.04.28 20:19:50 5: DbLog: logging of Device: FHT_Kellerflur , Type: FHT , Event: actuator: 0% , Reading: actuator , Value: 0 , Unit: %
2015.04.28 20:19:50 4: SB_SERVER_Notify(SqueezeServer): calledOwn:SqueezeServer Device:FHT_Kellerflur
2015.04.28 20:19:50 5: Klima: not on any display, ignoring notify
2015.04.28 20:19:50 5: Notify loop for FHT_Kellerflur actuator: 0%
2015.04.28 20:19:50 5: Triggering FHT_Kellerflur (1 changes)
2015.04.28 20:19:50 4: FHT FHT_Kellerflur actuator: 0%
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem?XHR=1&inform=type=status;filter=room=%C3%9Cbersicht;since=1430245187;fmt=JSON×tamp=1430245190681
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/dashboard_ios7.css
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/pgm2/fhemweb_sortable.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/codemirror/fhem_codemirror.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/js/webviewcontrol.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/pgm2/ios7Common.css
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/fhemweb_uzsu.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/pgm2/cordova-2.3.0.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/dk.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/pgm2/jquery-ui.min.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/pgm2/fhemweb_readingsGroup.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/pgm2/fhemweb_knob.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/pgm2/fhemweb_readingsHistory.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/fhemweb_colorpicker.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/pgm2/fhemweb.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/pgm2/jquery.min.js
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/pgm2/jquery-ui.min.css
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/pgm2/style.css
/
2015.04.28 20:19:49 4: 2118:FHEMWEB:192.168.0.24:62057: /fhem / RL:41406 / text/html; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:49 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62057: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+undefined&XHR=1&_=1430245180447 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor undefined<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+undefined&XHR=1&_=1430245180447
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62059: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+desired-temp&XHR=1&_=1430245180443 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor desired-temp<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62059 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+desired-temp&XHR=1&_=1430245180443
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62058: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+condition&XHR=1&_=1430245180442 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor condition<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62058 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+condition&XHR=1&_=1430245180442
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62061: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+voc&XHR=1&_=1430245180444 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor voc<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+voc&XHR=1&_=1430245180444
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62060: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+measured-temp&XHR=1&_=1430245180446 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor measured-temp<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+measured-temp&XHR=1&_=1430245180446
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62062: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+state&XHR=1&_=1430245180445 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor state<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+state&XHR=1&_=1430245180445
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62057: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+pressure&XHR=1&_=1430245180441 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor pressure<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62057 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+pressure&XHR=1&_=1430245180441
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62061: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+temperature&XHR=1&_=1430245180439 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor temperature<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62061 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+temperature&XHR=1&_=1430245180439
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62060: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+direction&XHR=1&_=1430245180438 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor direction<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62060 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+direction&XHR=1&_=1430245180438
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62062: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+humidity&XHR=1&_=1430245180440 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor humidity<
2015.04.28 20:19:48 4: HTTP FHEMWEB:192.168.0.24:62062 GET /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+humidity&XHR=1&_=1430245180440
/
2015.04.28 20:19:48 4: 2118:FHEMWEB:192.168.0.24:62059: /fhem/?cmd=list+Markus.Homestatus%2CSimone.Homestatus%2CLeoni.Homestatus%2CGast.Dummy%2CCUL_HM_HM_SEC_KEY_23DB96%2CAnrufmonitor%2CAbfallkalender%2CRollo.Alle%2CHCAutomatik%2CAlarmanlage%2CWetterstation%2CMyWeather%2CCUL_HM_FlurOben%2CCUL_HM_FlurUnten%2CHZ_Wohnzimmer_WT_Climate%2CWohnzimmer.Airsensor%2CFenster_Terrasse%2CFenster_Wohnzimmer_Ost+%2CFenster_Kueche%2CFS20_Hydra%2CFS20_Trompete%2CFBDECT_Barlicht%2CFS20_Spot_Kueche%2CFS20_TVLicht%2CFS20_Esstisch%2CFenster_Klo%2CFenster_Buero%2CFenster_Flur_oben%2CFenster_Bad%2CFenster_Leoni%2CFenster_Carlotta%2CFenster_Schlafzimmer%2CCUL_FHTTK_Kellerflur%2CCUL_FHTTK_Waschkeller%2CCUL_FHTTK_Hobbyraum_links%2CCUL_FHTTK_Hobbyraum_rechts%2CCUL_FHTTK_Hobbyraum_ost%2CCUL_HM_Gartenlicht%2CMarkise%2CMarkisensensor+external_number&XHR=1&_=1430245180437 / RL:20 / text/plain; charset=UTF-8 / Content-Encoding: gzip
2015.04.28 20:19:48 5: Cmd: >list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK
Zitat von: Mitch am 28 April 2015, 20:22:15
So, longpoll ist aus und die Zeile habe ich eingefügt.
[...]
14fhem-tablet-ui.js:351 data
78fhem-tablet-ui.js:351 data
Danke, das wollte ich sehen! :) Es scheint so, als ob der Fhem-Befehl "list" bei dir kein Ergebnis bringt. Setze mal bitte noch die Kommandos
list .* STATElist CUL_FHTTK_Hobbyraum_links STATEin der Fhem-Eingabezeile ab und poste (einen Teil) beider Ausgaben.
list .* STATE (Auszugweise):
Abfallkalender none
Anwesenheit.Gast active
Anwesenheit.Markus zuhause
Anwesenheit.Simone zuhause
Fenster_Bad closed
Fenster_Buero closed
Fenster_Carlotta open
Fenster_Flur_oben closed
Fenster_Klo closed
Fenster_Kueche closed
Fenster_Leoni open
Fenster_Schlafzimmer closed
Fenster_Terrasse closed
Fenster_Wohnzimmer_Ost closed
HZ_Wohnzimmer CMDs_done
HZ_Wohnzimmer_SwitchTr unpeered
HZ_Wohnzimmer_WT_Climate Ist: 22.0 °C - Soll: 22.0 °C - Luftfeuchte: 42 % - manual - Bat: ok
HZ_Wohnzimmer_Weather T: 22.0 H: 42
HZ_Wohnzimmer_WindowRec last:Fenster_Terrasse :closed
HZ_Wohnzimmer_remote unpeered
CUL_FHTTK_Hobbyraum_Ost Closed
CUL_FHTTK_Hobbyraum_links Closed
CUL_FHTTK_Hobbyraum_rechts Closed
CUL_FHTTK_Kellerflur Closed
CUL_FHTTK_Waschkeller Closed
list CUL_FHTTK_Hobbyraum_links STATE:
CUL_FHTTK_Hobbyraum_links Closed
Zitat von: setstate am 27 April 2015, 22:43:19
Hallo Phil,
mit data-get-on="!0" wolltest du sicherlich erreichen, dass alles ausser 0 als on gesehen wird. Das geht leider nicht so. Entweder mit Regex data-get-on="[^0]" oder mit dem eingebauten Literal "!off" also so: data-get-on="!off"
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks'
data-get="dim"
data-get-on="!off"
data-get-on
data-get-off="0"
data-set="dim"
class="cell"></div>
Hallo setstate!
So funktioniert es leider trotzdem nicht. Wenn ich bei ausgeschaltetem Licht auf den Schalter drücke in der TabletUI, wird der Befehl "set dim 0" ausgeführt und das ist wieder nur "aus". Gibt es keine Möglichkeit, dass hier wirklich ein "set on" oder ein "set dim 100" ausgeführt wird, wenn der Status vorher "dim 0" ist?
Das Problem ist einfach, dass der bidirektionale Aktor nach dem Ausschalten auf "dim 0" geht und beim Einschalten die UI genau das wieder setzt --> Es bleibt bei aus.
Gruß
Phil
Guten Abend,
Ich habe meine Sonos-Seite überarbeitet, und habe die Steuerung mit Hilfe zweier Push-Widgets um eine Timerfunktionalität für 15 und 30 Minuten lang Strom erweitert.
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 900"
class="cell"></div>
<div data-type="label" >15min</div>
</div>
Jetzt würde ich gerne visualisieren wenn der Timer läuft. Dazu habe ich mir gedacht ich nutze die blink Klassen. Wie schaffe ich es nun das Icon oder das Label nur dann Blinken zu lassen wenn das reading timedON von OG.mm.SD.Sonos den Wert running hat? Geht das überhaupt so einfach?
Grüße,
Matthias
Hallo matzemoerk,
der Push Button kann nur Befehle schicken, aber nix empfangen. Es müsste also ein zusätzliches Label oder Symbol die Info anzeigen.
Spinner Animation für das Symbol
<div data-type="symbol" data-device="OG.mm.SD.Sonos"
data-get="timedON"
data-icons='["fa fa-circle-o-notch","fa fa-circle-o-notch fa-spin"]'
data-on-colors='["#505050","#aa69002]'
data-get-on='["off","running"]' ></div>
Das Label
<div data-type="label" data-device="OG.mm.SD.Sonos"
data-get="timedON"></div>
Aber bei mir auf der ToDo Liste steht genau so eine on-for-timer Anzeige für den Push Button. Diesen Wunsch gab es schon vor einiger Zeit. Ich bin dran. Es wird so ein immer kleiner werdender Ring werden ...
Update: das Default Icon für Symbol ist ab sofort ftui-window.
Ein weiteres neues built-in Icon ist ftui-door.
<div class="inline">
<div data-type="symbol" data-device="Eingangstuer" data-icon="ftui-door" class="bigger"></div>
<div data-type="label" class="small narrow darker">Tür</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="KuechenFenster" class="bigger"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
</div>
Zitat von: Stril am 28 April 2015, 21:51:34
Hallo setstate!
So funktioniert es leider trotzdem nicht. Wenn ich bei ausgeschaltetem Licht auf den Schalter drücke in der TabletUI, wird der Befehl "set dim 0" ausgeführt und das ist wieder nur "aus". Gibt es keine Möglichkeit, dass hier wirklich ein "set on" oder ein "set dim 100" ausgeführt wird, wenn der Status vorher "dim 0" ist?
Das Problem ist einfach, dass der bidirektionale Aktor nach dem Ausschalten auf "dim 0" geht und beim Einschalten die UI genau das wieder setzt --> Es bleibt bei aus.
Gruß
Phil
Hallo Phil,
Thema verstanden.
Ich werde mir das Ganze erst einmal auf eine Tapete auf skizzieren und mir dann was ausdenken. Ich melde mich dazu wieder ...
Zitat von: setstate am 29 April 2015, 08:07:59
Ich werde mir das Ganze erst einmal auf eine Tapete auf skizzieren und mir dann was ausdenken. Ich melde mich dazu wieder ...
Vielen Dank!!!
Grüße
Phil
Zitat von: Mitch am 28 April 2015, 21:27:15
list .* STATE (Auszugweise):
Nicht ganz das Ergebnis, das ich erwartet hatte, aber gut zu sehen, dass list grundsätzlich funktioniert. Macht unsere Problem aber nicht einfacher. Nächster Versuch: 1.) Ersetze bitte in der fhem-tablet-ui.js die komplette Function requestFhem() (Zeile 333-377) durch:
function requestFhem(paraname) {
/* 'list' is still the fastest cmd to get all important data
*/
console.log('requestFhem:',"list " + devs.join() + " " + paraname);
$.ajax({
async: true,
timeout: 15000,
cache: false,
context:{paraname: paraname},
url: $("meta[name='fhemweb_url']").attr("content") || "/fhem/",
data: {
cmd: "list " + devs.join() + " " + paraname,
XHR: "1"
}
})
.fail (function(jqXHR, textStatus, errorThrown) {
$.toast("Error: " + textStatus + ": " + errorThrown);
console.log('requestFhem: failed');
})
.done (function( data ) {
console.log('requestFhem: data ', data);
var lines = data.replace(/\n\)/g,")\n").split(/\n/);
console.log('requestFhem: lines ', lines);
var regCapture = /^(\S*)\s*([0-9]{4}-[0-9]{2}-[0-9]{2}\s[0-2][0-9]:[0-5][0-9]:[0-5][0-9])?\.?[0-9]{0,3}\s+(.*)$/;
for (var i=0; i < lines.length; i++) {
var date,key,val;
console.log('requestFhem: lines[i] ',lines[i]);
var line = $.trim( lines[i] );
console.log('requestFhem: line (trimmed) ',line);
if (regCapture.test(line) ) {
console.log('requestFhem: regCapture matched');
var groups = line.match( regCapture );
var paraname = this.paraname;
key = $.trim( line.match( regCapture )[1]);
if (groups.length>2){
date = $.trim( groups[2]);
val = $.trim( groups[3]);
}
console.log('paraname',paraname,'date:',date,'val',val);
var params = deviceStates[key] || {};
var value = {"date": date, "val": val};
params[paraname]=value;
if (key in devices){
deviceStates[key]=params;
plugins.update(key,paraname);
}
}
}
});
}Und bitte wieder die Ausgabe der JS-Konsole posten.
2.) Ersetze bitte die komplette fhem-tablet-ui.js durch https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/fhem-tablet-ui.js. Damit wird eine andere Methode zur Fhem-Abfrage verwendet (jsonlist2 statt list). Mich würde interessieren, ob's damit bei dir funktioniert.
Option 1:
gleiches Problem.
Log:
[Log] Plugin dir: /fhem/tablet/js (fhem-tablet-ui.js, line 102)
[Log] Filename: tablet (fhem-tablet-ui.js, line 106)
[Log] Please rename widget attribute "type" into "data-type" in http://mbj.spdns.eu:8083/fhem/tablet - Details below: (fhem-tablet-ui.js, line 191)
[Log] [ (fhem-tablet-ui.js, line 192)
<div data-on="scharf" data-off="unscharf" data-icon="fa-exclamation-triangle" data-type="switch" data-device="Alarmanlage" class="fa-stack fa-2x">...</div>
]
[Log] Please rename widget attribute "device" into "data-device" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_HM_HM_SEC_KEY_23DB96 - Details below: (fhem-tablet-ui.js, line 199)
[Log] [ (fhem-tablet-ui.js, line 200)
<div data-type="label" class="cell" data-device="CUL_HM_HM_SEC_KEY_23DB96"></div>
]
[Log] Please rename widget attribute "device" into "data-device" in http://mbj.spdns.eu:8083/fhem/tablet device: Alarmanlage - Details below: (fhem-tablet-ui.js, line 199)
[Log] [ (fhem-tablet-ui.js, line 200)
<div data-on="scharf" data-off="unscharf" data-icon="fa-exclamation-triangle" data-type="switch" data-device="Alarmanlage" class="fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Flur_oben - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Flur_oben" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Bad - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Bad" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Leoni - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Leoni" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Carlotta - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Carlotta" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Schlafzimmer - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="Fenster_Schlafzimmer" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Kellerflur - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Kellerflur" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Waschkeller - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Waschkeller" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Hobbyraum_links - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Hobbyraum_links" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Hobbyraum_rechts - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Hobbyraum_rechts" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Hobbyraum_ost - Details below: (fhem-tablet-ui.js, line 204)
[Log] [ (fhem-tablet-ui.js, line 205)
<div data-type="symbol" data-device="CUL_FHTTK_Hobbyraum_ost" data-icon="oa-fts_window_2w" class="narrow fa-stack fa-2x">...</div>
]
[Log] Collecting required readings (fhem-tablet-ui.js, line 162)
[Log] Request readings from FHEM (fhem-tablet-ui.js, line 177)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor STATE (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor external_name (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor external_number (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor direction (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor temperature (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor humidity (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor pressure (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor condition (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor desired-temp (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor voc (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor state (fhem-tablet-ui.js, line 336)
[Log] Loaded plugin: widget_switch (fhem-tablet-ui.js, line 36)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor STATE (fhem-tablet-ui.js, line 336)
[Log] Loaded plugin: widget_weather (fhem-tablet-ui.js, line 36)
[Log] Loaded plugin: widget_label (fhem-tablet-ui.js, line 36)
[Log] Loaded plugin: widget_thermostat (fhem-tablet-ui.js, line 36)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor measured-temp (fhem-tablet-ui.js, line 336)
[Log] requestFhem: list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor undefined (fhem-tablet-ui.js, line 336)
[Log] Loaded plugin: widget_symbol (fhem-tablet-ui.js, line 36)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] requestFhem: data (fhem-tablet-ui.js, line 353)
[Log] requestFhem: lines [""] (fhem-tablet-ui.js, line 355)
[Log] requestFhem: lines[i] (fhem-tablet-ui.js, line 359)
[Log] requestFhem: line (trimmed) (fhem-tablet-ui.js, line 361)
[Log] start longpoll (fhem-tablet-ui.js, line 252)
Option 2:
Interessanter Weise kamen einige Werte sofort, also wurden sie ausgelesen.
Allerdings fehlen alle Icons und wie gesagt, ein paar Werte.
Log:
[Error] ReferenceError: Can't find variable: getStyle
(anonyme Funktion) (undefined, line 11)
each (jquery.min.js, line 2)
each (jquery.min.js, line 2)
init
(anonyme Funktion) (fhem-tablet-ui.js, line 39)
j (jquery.min.js, line 2)
fireWith (jquery.min.js, line 2)
x (jquery.min.js, line 4)
b (jquery.min.js, line 4)
[Error] ReferenceError: Can't find variable: getStyle
(anonyme Funktion) (undefined, line 179)
each (jquery.min.js, line 2)
each (jquery.min.js, line 2)
init
(anonyme Funktion) (fhem-tablet-ui.js, line 39)
j (jquery.min.js, line 2)
fireWith (jquery.min.js, line 2)
x (jquery.min.js, line 4)
b (jquery.min.js, line 4)
[Error] ReferenceError: Can't find variable: getStyle
(anonyme Funktion) (undefined, line 11)
each (jquery.min.js, line 2)
each (jquery.min.js, line 2)
init
(anonyme Funktion) (fhem-tablet-ui.js, line 39)
j (jquery.min.js, line 2)
fireWith (jquery.min.js, line 2)
x (jquery.min.js, line 4)
b (jquery.min.js, line 4)
[Error] ReferenceError: Can't find variable: indexOfGeneric
(anonyme Funktion) (undefined, line 35)
each (jquery.min.js, line 2)
each (jquery.min.js, line 2)
update
(anonyme Funktion) (fhem-tablet-ui.js, line 60)
each (jquery.min.js, line 2)
update (fhem-tablet-ui.js, line 58)
(anonyme Funktion) (fhem-tablet-ui.js, line 525)
j (jquery.min.js, line 2)
fireWith (jquery.min.js, line 2)
x (jquery.min.js, line 4)
b (jquery.min.js, line 4)
[Error] ReferenceError: Can't find variable: indexOfGeneric
(anonyme Funktion) (undefined, line 35)
each (jquery.min.js, line 2)
each (jquery.min.js, line 2)
update
(anonyme Funktion) (fhem-tablet-ui.js, line 60)
each (jquery.min.js, line 2)
update (fhem-tablet-ui.js, line 58)
(anonyme Funktion) (fhem-tablet-ui.js, line 326)
Vielleicht mal zur Vorsicht meine index.html, nicht das ich da einen groben Fehler drinnen habe:
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>qf server</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="125">
<meta name="widget_base_height" content="122">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="1"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>HOMESTATUS</header>
<div class="centered container">
<div class="left">
<div data-type="switch" data-device="Markus.Homestatus" data-get-on="Zuhause" data-get-off="Unterwegs" data-set-on="Zuhause" data-set-off="Unterwegs" data-icon="fa-user" class="cell readonly "></div>
<div data-type="label" class="cell">Markus</div>
</div>
<div class="left">
<div data-type="switch" data-device="Simone.Homestatus" data-get-on="Zuhause" data-get-off="Unterwegs" data-set-on="Zuhause" data-set-off="Unterwegs" data-icon="fa-user" class="cell readonly"></div>
<div data-type="label" class="cell">Simone</div>
</div>
<div class="left">
<div data-type="switch" data-device="Leoni.Homestatus" data-get-on="Zuhause" data-get-off="Unterwegs" data-set-on="Zuhause" data-set-off="Unterwegs" data-icon="fa-user" class="cell readonly"></div>
<div data-type="label" class="cell">Leoni</div>
</div>
<div class="left">
<div data-type="switch" data-device="Gast.Dummy" data-get-on="Anwesend" data-get-off="Abwesend" data-set-on="Anwesend" data-set-off="Abwesend" data-icon="fa-user" class="cell" ></div>
<div data-type="label" class="cell">Gast</div>
</div>
</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>KEYMATIC</header>
<div class="center">
<div data-type="switch" data-device="CUL_HM_HM_SEC_KEY_23DB96" data-get-on="lock" data-get-off="unlock" data-set-on="lock" data-set-off="unlock" data-icon="fa-lock" class="cell"></div>
<div data-type="label" device="CUL_HM_HM_SEC_KEY_23DB96" class="cell" ></div>
</div>
</li>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
<header>ANRUFE</header>
<div class="center">
<div data-type="label" data-device="Anrufmonitor" data-get="external_name" class="large"></div>
<div data-type="label" data-device="Anrufmonitor" data-get="external_number"></div>
<div data-type="label" data-device="Anrufmonitor" data-get="direction" class="small"></div>
</div>
</li>
<li data-row="1" data-col="4" data-sizex="1" data-sizey="1">
<header>MUELL</header>
<div class="center">
<div data-type="label" data-device="Abfallkalender" data-icon="" class="large red" ></div>
</div>
</li>
<li data-row="2" data-col="4" data-sizex="1" data-sizey="1">
<header>ROLLO</header>
<div class="center">
<div data-type="switch" data-device="Rollo.Alle" data-set-on="Zu" data-set-off="Auf" data-icon="fs-fts_shutter_updown" class="cell" ></div>
</div>
</li>
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1">
<header>HEIZUNG</header>
<div class="center">
<div data-type="switch" data-device="HCAutomatik" data-get="STATE" data-set-on="on" data-set-off="off" data-icon="oa-sani_heating_automatic" class="cell" ></div>
</div>
</li>
<li data-row="2" data-col="5" data-sizex="1" data-sizey="1">
<header>ALARM</header>
<div type="switch" device="Alarmanlage" data-on="scharf" data-off="unscharf" data-icon="fa-exclamation-triangle"></div>
</li>
<li data-row="1" data-col="7" data-sizex="1" data-sizey="2">
<header>WETTER</header>
<div class="center">
<div data-type="label" data-device="Wetterstation" data-get="temperature" data-unit="%B0C%0A" data-limits='[-10,10,23]' data-colors='["#6699FF","#AA6900","#FF0000"]' class="cell big"></div>
<div data-type="label" class="small">Temperatur</div>
<div data-type="label" data-device="Wetterstation" data-get="humidity" data-unit="%" data-fix="0" data-limits='[20,30,50]' data-colors='["#bb6242","#aa6900","#bb6242"]' class="cell big blue"></div>
<div data-type="label" class="small">Luftfeuchte</div>
<div data-type="label" data-device="Wetterstation" data-get="pressure" data-unit="hPa" data-fix="0" data-limits='[800,900,1200]' data-colors='["#FF0000","#AA6900","#6699FF"]' class="cell big blue"></div>
<div data-type="label" class="small">Luftdruck</div>
<div data-type="weather" data-device="MyWeather" data-get="condition" class="cell big"></div>
</div>
</li>
<li data-row="1" data-col="6" data-sizex="1" data-sizey="2">
<header>FLUR</header>
<div class="center">
<div data-type="switch" data-device="CUL_HM_FlurOben" class="cell"></div>
<div data-type="label" class="cell">oben</div>
<div data-type="switch" data-device="CUL_HM_FlurUnten" class="cell"></div>
<div data-type="label" class="cell">unten</div>
</div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="2">
<header>WOHNZIMMER</header>
<div class="center">
<div data-type="thermostat" data-device="HZ_Wohnzimmer_WT_Climate" data-get="desired-temp" data-step="0.5"></div>
<div data-type="label" data-device="HZ_Wohnzimmer_WT_Climate" data-get="humidity" data-fix="0" data-unit=" %" class="small"></div>
<div data-type="label" data-device="Wohnzimmer.Airsensor" data-get="voc" data-fix="0" data-unit=" CO2" class="small"></div>
<div class="container">
<div class="cell left">
<div data-type="symbol" data-get="state" data-device="Fenster_Terrasse" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terrasse</div>
</div>
<div class="cell left">
<div data-type="symbol" data-device="Fenster_Wohnzimmer_Ost " data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Ost</div>
</div>
<div class="cell left">
<div data-type="symbol" data-device="Fenster_Kueche" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Kueche</div>
</div>
</div>
</li>
<li data-row="3" data-col="3" data-sizex="2" data-sizey="2">
<header>WOHNZIMMER</header>
<div class="centered container">
<div class="left">
<div data-type="switch" data-device="FS20_Hydra" class="cell"></div>
<div data-type="label" class="cell">Hydra</div>
<div data-type="switch" data-device="FS20_Trompete" class="cell"></div>
<div data-type="label" class="cell">Trompete</div>
</div>
<div class="left">
<div data-type="switch" data-device="FBDECT_Barlicht" class="cell"></div>
<div data-type="label" class="cell">Bar</div>
<div data-type="switch" data-device="FS20_Spot_Kueche" class="cell"></div>
<div data-type="label" class="cell">Spot</div>
</div>
<div class="left">
<div data-type="switch" data-device="FS20_TVLicht" class="cell"></div>
<div data-type="label" class="cell">TV</div>
<div data-type="switch" data-device="FS20_Esstisch" class="cell"></div>
<div data-type="label" class="cell">Tisch</div>
</div>
</div>
</li>
<li data-row="3" data-col="5" data-sizex="2" data-sizey="2">
<header>FENSTER</header>
<div class="container">
<div class="cell left">
<div data-type="symbol" data-device="Fenster_Klo" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Klo</div>
</div>
<div class="cell left">
<div data-type="symbol" data-device="Fenster_Buero" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Buero</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="Fenster_Flur_oben" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Flur</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div data-type="contact" data-device="Fenster_Bad" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Bad</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="Fenster_Leoni" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Leoni</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="Fenster_Carlotta" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Carlotta</div>
</div>
</div>
<div class="container">
<div class="cell left">
<div data-type="contact" data-device="Fenster_Schlafzimmer" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">SchlaZi</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="CUL_FHTTK_Kellerflur" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Kellerflur</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="CUL_FHTTK_Waschkeller" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">Waschkeller</div>
</div>
<div class="container">
<div class="cell left">
<div data-type="contact" data-device="CUL_FHTTK_Hobbyraum_links" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">HR links</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="CUL_FHTTK_Hobbyraum_rechts" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">HR rechts</div>
</div>
<div class="cell left">
<div data-type="contact" data-device="CUL_FHTTK_Hobbyraum_ost" data-icon="oa-fts_window_2w" class="narrow"></div>
<div data-type="label" class="narrow darker small">HR ost</div>
</div>
</div>
</li>
<li data-row="3" data-col="7" data-sizex="1" data-sizey="2">
<header>GARTEN</header>
<div class="center">
<div data-type="switch" data-device="CUL_HM_Gartenlicht" class="cell"></div>
<div data-type="label" class="cell">Licht</div>
<div data-type="switch" data-device="Markise" data-get-on="Raus" data-get-off="Rein" data-set-on="Raus" data-set-off="Rein" data-icon="oa-fts_sunblind" class="cell"></div>
<div data-type="label" class="cell">Markise</div>
<div data-type="label" data-device="Markisensensor" class="cell"></div>
</div>
</li>
</ul>
</div>
</body>
</html>
Zitat von: Mitch am 29 April 2015, 10:53:07
Option 1:
gleiches Problem.
list liefert demnach bei dir definitiv keine Daten, wenn's per XMLHttpRequest gesendet wird. Ich habe absolut keine Ahnung woher das kommt. Das einzige was auch nur ansatzweise in die Richtung zeigt, wäre das CORS-Attribut in FHEMWEB. CORS dürfte in deiner Konstellation zwar keine Rolle spielen (wird nur gebraucht, wenn XMLHttpRequests von einem fremden Server erlaubt werden sollen), aber lass es uns bitte auch noch probieren. Setze an deiner FHEMWEB Instanz (idR "WEB") bitte das Attribut CORS auf 1:
attr WEB CORS 1und probiere dann nochmal mit der requestFhem()-Funktion aus Punkt 1.
ZitatInteressanter Weise kamen einige Werte sofort, also wurden sie ausgelesen.
Allerdings fehlen alle Icons und wie gesagt, ein paar Werte.
Die aufgetretenen Fehler und die fehlenden Icons sind Ok - Grund dafür ist, dass diese fhem-tablet-ui.js mit 7 Tagen einfach hoffnungslos veraltet ist und einige neue Funktionen, die die Widgets mittlerweile nutzen, noch nicht hat. Wichtig war mir nur zu sehen, ob damit Daten gezogen werden; und das scheint der Fall zu sein. Danke für's testen!
Interessant, interessant. 8) 8) 8)
Jetzt muss ich mich wohl doch schneller mit dem ungeliebten jsonlist2 auseinandersetzen
;)
CORS hatte ich auch schon im Verdacht, weil ich das aber an hatte, habe ich es gestern deaktiviert.
Gerade nochmal aktiviert, aber gleicher Fehler :-\
Zitat von: setstate am 29 April 2015, 11:15:00
Jetzt muss ich mich wohl doch schneller mit dem ungeliebten jsonlist2 auseinandersetzen
;)
Das Gute im Schlechten sehen 8)
Zitat von: Mitch am 29 April 2015, 11:17:06
CORS hatte ich auch schon im Verdacht, weil ich das aber an hatte, habe ich es gestern deaktiviert.
Gerade nochmal aktiviert, aber gleicher Fehler :-\
Ok, eine weitere Idee:
Versuch mal bitte folgende URLs:
http://<fhemhost>:<fhemport>/fhem?cmd=list CUL_FHTTK_Hobbyraum_links STATE
http://<fhemhost>:<fhemport>/fhem?cmd=list CUL_FHTTK_Hobbyraum_links STATE&XHR=1Einziger Unterschied dürfte sein, dass der erste die Fhemweb-Oberfläche anzeigt und der zweite nicht.
Geht ohne Probleme und es kommt der STATE korrekt
Ich hab die Frage mal ins "Sonstiges" Forum getragen: http://forum.fhem.de/index.php/topic,36748.0.html
Bitte den Thread beobachten und auf evlt. Rückfragen reagieren.
Danke Dir!!
Nur noch zur Sicherheit, an einem falschen oder fehlendem Perl Modul kann es nicht liegen?
Oder an meinem Ubuntu? Brauch ich da evtl. noch etwas bzgl. Java oder Ajax?
Zitat von: Mitch am 29 April 2015, 13:22:32
Nur noch zur Sicherheit, an einem falschen oder fehlendem Perl Modul kann es nicht liegen?
Oder an meinem Ubuntu? Brauch ich da evtl. noch etwas bzgl. Java oder Ajax?
Würde ich ausschliessen, direkt in Fhem funktioniert's ja und seitens FTUI wird nur Javascript benutzt, das FTUI auch selbst mitbringt. Eine Fehlerquelle könnte höchstens noch der verwendete Browser sein - welchen benutzt du? Bzw. hast du verschiedene probiert?
Browser: Safari und Chrom auf Mac, Safari auf iPhone, Chrome und webviecontrol auf Android
Edit: gerade nochmal mit FF auf Mac getestet. Gleiches Problem, allerdings mehr Log:
"Plugin dir: /fhem/tablet/js" fhem-tablet-ui.js:102:0
"Filename: tablet" fhem-tablet-ui.js:106:0
"Please rename widget attribute "type" into "data-type" in http://mbj.spdns.eu:8083/fhem/tablet - Details below:" fhem-tablet-ui.js:191:0
Object { 0: <div.fa-stack.fa-2x>, context: <div.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:192:8
"Please rename widget attribute "device" into "data-device" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_HM_HM_SEC_KEY_23DB96 - Details below:" fhem-tablet-ui.js:199:0
Object { 0: <div.cell>, context: <div.cell>, length: 1 } fhem-tablet-ui.js:200:8
"Please rename widget attribute "device" into "data-device" in http://mbj.spdns.eu:8083/fhem/tablet device: Alarmanlage - Details below:" fhem-tablet-ui.js:199:0
Object { 0: <div.fa-stack.fa-2x>, context: <div.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:200:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Flur_oben - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Bad - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Leoni - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Carlotta - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: Fenster_Schlafzimmer - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Kellerflur - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Waschkeller - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Hobbyraum_links - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Hobbyraum_rechts - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Please rename widget "contact" into "symbol" in http://mbj.spdns.eu:8083/fhem/tablet device: CUL_FHTTK_Hobbyraum_ost - Details below:" fhem-tablet-ui.js:204:0
Object { 0: <div.narrow.fa-stack.fa-2x>, context: <div.narrow.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:205:8
"Collecting required readings" fhem-tablet-ui.js:162:0
"Request readings from FHEM" fhem-tablet-ui.js:177:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor STATE" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor external_name" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor external_number" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor direction" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor temperature" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor humidity" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor pressure" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor condition" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor desired-temp" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor voc" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor state" fhem-tablet-ui.js:336:0
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.min.js:4:0
"Loaded plugin: widget_label" fhem-tablet-ui.js:36:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor STATE" fhem-tablet-ui.js:336:0
"Loaded plugin: widget_thermostat" fhem-tablet-ui.js:36:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor measured-temp" fhem-tablet-ui.js:336:0
"requestFhem:" "list Markus.Homestatus,Simone.Homestatus,Leoni.Homestatus,Gast.Dummy,CUL_HM_HM_SEC_KEY_23DB96,Anrufmonitor,Abfallkalender,Rollo.Alle,HCAutomatik,Alarmanlage,Wetterstation,MyWeather,CUL_HM_FlurOben,CUL_HM_FlurUnten,HZ_Wohnzimmer_WT_Climate,Wohnzimmer.Airsensor,Fenster_Terrasse,Fenster_Wohnzimmer_Ost ,Fenster_Kueche,FS20_Hydra,FS20_Trompete,FBDECT_Barlicht,FS20_Spot_Kueche,FS20_TVLicht,FS20_Esstisch,Fenster_Klo,Fenster_Buero,Fenster_Flur_oben,Fenster_Bad,Fenster_Leoni,Fenster_Carlotta,Fenster_Schlafzimmer,CUL_FHTTK_Kellerflur,CUL_FHTTK_Waschkeller,CUL_FHTTK_Hobbyraum_links,CUL_FHTTK_Hobbyraum_rechts,CUL_FHTTK_Hobbyraum_ost,CUL_HM_Gartenlicht,Markise,Markisensensor undefined" fhem-tablet-ui.js:336:0
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"requestFhem: data " "" fhem-tablet-ui.js:353:3
"requestFhem: lines " Array [ "" ] fhem-tablet-ui.js:355:3
"requestFhem: lines[i] " "" fhem-tablet-ui.js:359:16
"requestFhem: line (trimmed) " "" fhem-tablet-ui.js:361:16
"Loaded plugin: widget_symbol" fhem-tablet-ui.js:36:0
"Loaded plugin: widget_weather" fhem-tablet-ui.js:36:0
"Loaded plugin: widget_switch" fhem-tablet-ui.js:36:0
"start longpoll" fhem-tablet-ui.js:252:0
"2015-04-29 13:44:08 / HZ_Wohnzimmer_WT_Climate / desired-temp / 21.5" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:desired-temp" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:08 / HZ_Wohnzimmer_WT_Climate / humidity / 34" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:humidity" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:08 / HZ_Wohnzimmer_WT_Climate / measured-temp / 24.6" fhem-tablet-ui.js:318:0
"thermo dev:HZ_Wohnzimmer_WT_Climate par:measured-temp change:clima.temp" jquery.min.js line 2 > eval:239:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:measured-temp" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:08 / HZ_Wohnzimmer_WT_Climate / STATE / T: 24.6 desired: 21.5" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:STATE" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:08 / HZ_Wohnzimmer_WT_Climate / temperature / 24.6" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:temperature" fhem-tablet-ui.js:61:13
"start longpoll" fhem-tablet-ui.js:252:0
"2015-04-29 13:44:22 / Wetterstation / STATE / T: 14.9 H: 49 W: 0.0 R: 196.1 IR: no Wi: 0" fhem-tablet-ui.js:318:0
"update done for device:Wetterstation parameter:STATE" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:22 / Wetterstation / humidity / 49" fhem-tablet-ui.js:318:0
"update done for device:Wetterstation parameter:humidity" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:22 / Wetterstation / temperature / 14.9" fhem-tablet-ui.js:318:0
"update done for device:Wetterstation parameter:temperature" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:22 / Wetterstation / pressure / 1016" fhem-tablet-ui.js:318:0
"update done for device:Wetterstation parameter:pressure" fhem-tablet-ui.js:61:13
"2015-04-29 13:44:22 / Wetterstation / condition / heiter" fhem-tablet-ui.js:318:0
"update done for device:Wetterstation parameter:condition" fhem-tablet-ui.js:61:13
"start longpoll" fhem-tablet-ui.js:252:0
"2015-04-29 13:46:00 / FBDECT_Barlicht / temperature / 24.0 C (measured)" fhem-tablet-ui.js:318:0
"update done for device:FBDECT_Barlicht parameter:temperature" fhem-tablet-ui.js:61:13
"2015-04-29 13:46:14 / Wohnzimmer.Airsensor / voc / 535" fhem-tablet-ui.js:318:0
"update done for device:Wohnzimmer.Airsensor parameter:voc" fhem-tablet-ui.js:61:13
"start longpoll" fhem-tablet-ui.js:252:0
"2015-04-29 13:46:40 / HZ_Wohnzimmer_WT_Climate / desired-temp / 21.5" fhem-tablet-ui.js:318:0
"thermo dev:HZ_Wohnzimmer_WT_Climate par:desired-temp change:clima.desired" jquery.min.js line 2 > eval:232:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:desired-temp" fhem-tablet-ui.js:61:13
"2015-04-29 13:46:40 / HZ_Wohnzimmer_WT_Climate / humidity / 35" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:humidity" fhem-tablet-ui.js:61:13
"2015-04-29 13:46:40 / HZ_Wohnzimmer_WT_Climate / measured-temp / 24.7" fhem-tablet-ui.js:318:0
"thermo dev:HZ_Wohnzimmer_WT_Climate par:measured-temp change:clima.temp" jquery.min.js line 2 > eval:239:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:measured-temp" fhem-tablet-ui.js:61:13
"2015-04-29 13:46:40 / HZ_Wohnzimmer_WT_Climate / STATE / T: 24.7 desired: 21.5" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:STATE" fhem-tablet-ui.js:61:13
"2015-04-29 13:46:40 / HZ_Wohnzimmer_WT_Climate / temperature / 24.7" fhem-tablet-ui.js:318:0
"update done for device:HZ_Wohnzimmer_WT_Climate parameter:temperature" fhem-tablet-ui.js:61:13
Zitat von: nesges am 29 April 2015, 13:27:33seitens FTUI wird nur Javascript benutzt, das FTUI auch selbst mitbringt
Und da fällt mir eine Ausnahme auf: JQuery wird aus Fhem eingebunden. Ist dein Fhem auf einem aktuellen Stand? Welche Version steht oben in /fhem/pgm2/jquery.min.js? Ich hab da Version 1.11.2:
/*! jQuery v1.11.2 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license */
Zitat von: setstate am 27 April 2015, 20:06:53
Update: das Symbol Widget kann jetzt auch Regex bei der Nutzung von Icon Listen verstehen.
Das ganze ist ziemlich generisch nutzbar.
[/list]
Vielen Dank setstate, läuft super jetzt!
Fhem ist aktuell (Update gestern), jquery: /*! jQuery v1.11.2 | (c) 2005, 2014 jQuery Foundation, Inc. | jquery.org/license */
Zitat von: setstate am 29 April 2015, 08:07:59
Hallo Phil,
Thema verstanden.
Ich werde mir das Ganze erst einmal auf eine Tapete auf skizzieren und mir dann was ausdenken. Ich melde mich dazu wieder ...
Eine Frage noch:
Welche Werte kann STATE annehmen? Nur 'on' und 'off'? Wenn ja, dann würde es doch passen, wenn wir nur STATE mit data-get auswerten und dim als data-set Attribute. Dann bekommt das FTUI zwar die dim-Änderung nicht mit, aber an und aus.
Wenn das Device aus ist und man 'set <Device> dim 57' sendet, geht es dann an und auf 57% ?
Probiere das mal:
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks'
data-get-on="on"
data-get-off="off"
data-set="dim"
class="cell"></div>
Zitat von: setstate am 29 April 2015, 14:10:22
Eine Frage noch:
Welche Werte kann STATE annehmen? Nur 'on' und 'off'? Wenn ja, dann würde es doch passen, wenn wir nur STATE mit data-get auswerten und dim als data-set Attribute. Dann bekommt das FTUI zwar die dim-Änderung nicht mit, aber an und aus.
Wenn das Device aus ist und man 'set <Device> dim 57' sendet, geht es dann an und auf 57% ?
Probiere das mal:
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks'
data-get-on="on"
data-get-off="off"
data-set="dim"
class="cell"></div>
Hallo!
Jein :-)
State kann nur on oder off sein. Aber es gibt noch die Werte "dim" "dimValueLast" und "dimValueStored".
Man kann die Lampe ja auch mit "dim 0" ausschalten. Perfekt wäre es, wenn man beim Dimmer sowohl ein data-set-dim, als auch ein data-set-onoff hätte oder ähnlich. Off geht ja bereits.
Gruß
Phil
Ich bin noch am Grübeln. Die beabsichtigte Funktionsweise für dieses Control ist es, das man einmalig/selten den dim Wert einstellt (z.B. auf 57%) und mit Drücken auf den Knopf zwischen aus und 57% hin und her toggeln kann.
Gegensetzlich ist dann dein Wunsch, dass das Device einfach den Dim Preset auf dem Tablet mit 0 überschreiben kann und man beim nächsten Mal mit dim 100 voll aufmacht. Wäre dann nicht ein normaler Switch besser und fürs Dimmen ein Slider oder Volume knob?
Hallo!
Deine Variante wäre auch meine Lieblingsvariante (Zurückspringen auf den alten Dim-Wert). Problem ist nur, dass meine Aktoren bidirektional sind und beim Ausschalten über "set off" auch "dim 0" setzen. Was auch ginge wäre, dass ein "on" über den Toggle ein set dim auf dimValueLast macht.
Grüße
Phil
Muss der dimLastValue dann ausgelesen werden und der Wert explizit geschickt werden, oder setzt das Device/fhem Modul diesen automatisch bei einem set on auf das dim Reading zurück? Wenn das passiert und wir nur zwei mal set beim Ausschalten oder Einschalten schicken müssten, wäre das eine machbare Lösung.
Edit: Ich lese gerade im CommandRef, es gibt dimValueLast und dimValueStored
Am besten, du schreibst mal auf welche Szenarien du brauchst, wie dabei der Ablauf ist, also welche Befehle man schicken müsste und wie sich dabei die 3-4 Readings verändern.
Hallo!
Wenn ich ein "set on" schicke, springt "dim" automatisch auf den Wert "100".
Perfekt wäre also, wenn der toggle "set on/off" schickt und der Slider "dim xx".
Zum Ablauf:
Lampe an mit dim 50
--> dim 50
--> dimValueLast 50
--> dimValueStored 50
Lampe aus mit set off
--> dim 0
--> dimValueLast 50
--> dimValueStored 50
Lampe an mit set on
--> dim 100
--> dimValueLast 100
--> dimValueStored 50
Gruß
Phil
Ich habe da noch einmal eine Frage bzgl. Dimmer bzw. Volume:
Es ist ja so das der dim-Wert erst gesendet wird wenn man den Knopf los lässt, das selbe gilt ja auch für das Volume Widget.
Bei einer Licht-, Helligkeits-oder Farbeinstellungen ist das für mein Empfinden aber unpraktisch.
Frage: ist es möglich das ohne große Probleme dahingehend zu ändern das z.b. die Helligkeitsänderung gesendet wird während man auf dem dim-Knopf mit dem Finger verweilt???
Nur mal so als Idee....
Grüße
Marie
@Stril:
Ich bin immer noch der Meinung, dass mein Code auch für deinen Fall passend wäre:
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks'
data-get-on="on"
data-get-off="off"
data-set="dim"
class="cell"></div>
Sendet folgendes:
Press Button on: set aLd_EG_Esszimmer_LichtLinks dim 62
Press Button off: set aLd_EG_Esszimmer_LichtLinks off
Slider geändert: set aLd_EG_Esszimmer_LichtLinks dim 77
Wenn Fhem ein set aLd_EG_Esszimmer_LichtLinks dim 0 bekommt, ändert das nichts am Control
Hallo zusammen,
zunächst vielen dank für diese tolle Oberfläche.
Ich lese hier schon länger mit und komme bisher auch so gut klar, nun sehe ich aber anscheinend den Wald vor lauter Bäumen nicht.
Ich arbeite mit dem Symbol Widget und möchte damit den Batterie-Status einiger Geräte überwachen.
Bis vor kurzem hat dies auch noch funktioniert, nun zeigt mit das Widget aber immer nur den letzten Wert an:
<div data-type="symbol" data-device="WZ_Heizung" data-get="batteryLevel"
data-background-icon="fa-circle"
data-icons='["oa-measure_battery_100","oa-measure_battery_100","oa-measure_battery_100","oa-measure_battery_75","oa-measure_battery_75","oa-measure_battery_75","oa-measure_battery_50","oa-measure_battery_50","oa-measure_battery_50","oa-measure_battery_25","oa-measure_battery_25","oa-measure_battery_25","oa-measure_battery_0"]'
data-get-on='["3.2","3.1","3.0","2.9","2.8","2.7","2.6","2.5","2.4","2.3","2.2","2.1","2.0"]'
data-on-colors='["#0CFB0C","#0CFB0C","#0CFB0C","#42BC0A","#42BC0A","#42BC0A","#F5FF10","#F5FF10","#F5FF10","#FB5909","#FB5909","#FB5909","#E50005"]'
style="font-size:2em">
</div>
Eine bessere Lösung hierfür wäre eigentlich das ganze mit regEx zu befüttern, aber dann bekomme ich gar nichts mehr angezeigt:
<div data-type="symbol" data-device="WZ_Heizung" data-get="batteryLevel"
data-background-icon="fa-circle"
data-icons='["oa-measure_battery_100","oa-measure_battery_75","oa-measure_battery_50","oa-measure_battery_25","oa-measure_battery_0"]'
data-get-on='["3\.[0-9]","2\.[789]","2\.[456]","2\.[123],"((2\.0)|([01]\.[0-9]))"]'
data-on-colors='["#0CFB0C","#42BC0A","#F5FF10","#FB5909","#E50005"]'
style="font-size:2em">
</div>
Hat einer von euch vielleicht eine Idee was ich falsch mache? Bzw. kann mir sagen, was sich geändert hat, dass es nicht mehr funktioniert.
Nebeninfo, das Labelwidget mit diesem Wert funktioniert tadellos:
<div data-type="label" data-device="WZ_Heizung" data-get="batteryLevel" ></div>
Vielen dank & gruß
Hallo MrWishbone,
bei der numerischen Variante muss das Array aufsteigend sein, weil es wird >= verglichen. Also musst du erst 2.0 vorn haben und 3.2 hinten.
Bei der regEx Variante fehlt einmal ein " Zeichen und das \ Zeichen muss doppelt sein, damit das jQuery $.isArray auf das regEx Array funktioniert. Ob das RegEx damit noch okay ist habe ich jetzt nicht probiert.
<div data-type="symbol" data-device="BadHeizung" data-get="batteryLevel"
data-background-icon="fa-circle"
data-icons='["oa-measure_battery_100","oa-measure_battery_75","oa-measure_battery_50","oa-measure_battery_25","oa-measure_battery_0"]'
data-get-on='["3\\.[0-9]","2\\.[789]","2\\.[456]","2\\.[123]","((2\\.0)|([01]\\.[0-9]))"]'
data-on-colors='["#0CFB0C","#42BC0A","#F5FF10","#FB5909","#E50005"]'
style="font-size:2em">
Guten morgen setstate,
das die Werte Aufsteigend seine müssen hat mir gefehlt. Das scheint dann aber neu zu sein.
Ich habe mich aber nun für die RegEx Variante entschieden, dank des \\ funktionieren diese jetzt auch.
Vielen dank für die Hilfe
Zitat von: MrWishbone am 30 April 2015, 06:43:48
Guten morgen setstate,
das die Werte Aufsteigend seine müssen hat mir gefehlt. Das scheint dann aber neu zu sein.
Ich habe mich aber nun für die RegEx Variante entschieden, dank des \\ funktionieren diese jetzt auch.
Vielen dank für die Hilfe
Ja, das ist neu: weil er das Array als 100% numerisch erkennt und damit mit >= von links nach rechts vergleicht. Wenn ein einziger Stringwert dabei gewesen wäre, z.B. "NA", wäre es nach dem alten Prinzip des Stringvergleichs behandelt worden und es hätte gepasst, wenn alle Werte dabei sind, die auftreten können. Mit RegEx ist es am sichersten, aber die Syntax ist nicht sooo einfach.
Die Suche nach dem passenden Indexwert des Array ist folgende
1. ist es ein numerisches Array, dann iterativer größer gleich Vergleich
2. gibt es ein RegEx-Match, dann nimm den letzten passenden nach einer kompletten Iteration durch das Array
3. Methode des JS indexOf mit normalem Stringvergleich
Bin immer noch am Fehler suchen :-[
Könnte es nicht mit diesem hier zu tun haben?
"Please rename widget attribute "type" into "data-type" in http://mbj.spdns.eu:8083/fhem/tablet - Details below:" fhem-tablet-ui.js:191:0
Object { 0: <div.fa-stack.fa-2x>, context: <div.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:192:8
Ich habe alle attribute im index.html umgestellt und data-type, data-get usw. eingestellt.
Wo kommen denn diese falschen Daten her?
Habe den Cache gelöscht, den Browser gewechselt, den Rechner gewechselt, aber immer kommen diese Fehler??
Zitat von: Mitch am 30 April 2015, 15:25:04
Bin immer noch am Fehler suchen :-[
Könnte es nicht mit diesem hier zu tun haben?
"Please rename widget attribute "type" into "data-type" in http://mbj.spdns.eu:8083/fhem/tablet - Details below:" fhem-tablet-ui.js:191:0
Object { 0: <div.fa-stack.fa-2x>, context: <div.fa-stack.fa-2x>, length: 1 } fhem-tablet-ui.js:192:8
Ich habe alle attribute im index.html umgestellt und data-type, data-get usw. eingestellt.
Wo kommen denn diese falschen Daten her?
Habe den Cache gelöscht, den Browser gewechselt, den Rechner gewechselt, aber immer kommen diese Fehler??
Wenn du das nicht weißt ... 8)
Im Browser in den Entwicklertools, dort wo auch die Webconsole ist, gibt es auch einen Reiter für Netzwerk. Dort könntest du im Detail sehen, woher jedes File gezogen wird, ob vom Server oder aus dem Cache, die Lafezeit und die vollständige URL.
Schau da mal rein ...
Hast du mehrere HTTPSRV im fhem.cfg ?
Naja, das kenn ich, aber laut den Details kommt das File vom Server und darum verstehe ich die Fehler nicht.
Nein, nur ein HTTPSRV
So, das Problem ist gelöst.
Ist ja fast peinlich, aber es war ein Leerzeichen in einer Device-Bezeichnung :-[
Tausend Dank für eure Unterstützung!!
Zitat von: Mitch am 30 April 2015, 17:20:11
Ist ja fast peinlich, aber es war ein Leerzeichen in einer Device-Bezeichnung :-[
Sowas: data-device="Devicename "?
Ja, genau
Zitat von: Mitch am 30 April 2015, 17:31:30
Ja, genau
Ok, das war schwer zu finden. Habe grade nen Patch fertig gemacht, der sowas in Zukunft abfangen würde :)
Gute Idee, danke
Zum Thema Battery Control noch zwei Beispiele:
Voraussetzung: man hat sich das openautomation.css Stylesheet eingebunden.
Version mit RegEx Vergleich
<div data-type="symbol" data-device="BadHeizung" data-get="batteryLevel"
data-icons='["oa-measure_battery_100","oa-measure_battery_75","oa-measure_battery_50","oa-measure_battery_25","oa-measure_battery_0"]'
data-get-on='["3\\.[0-9]","2\\.[789]","2\\.[456]","2\\.[123]","((2\\.0)|([01]\\.[0-9]))"]'
data-on-colors='["#505050","#505050","#505050","#ad3333","#ad3333"]'>
</div>
Version mit Größer-Gleich Vergleich und um 90° gedrehten Icons
<div data-type="symbol" data-device="BadHeizung" data-get="batteryLevel"
data-icons='["oa-measure_battery_0 fa-rotate-90","oa-measure_battery_25 fa-rotate-90","oa-measure_battery_50 fa-rotate-90","oa-measure_battery_75 fa-rotate-90","oa-measure_battery_0 fa-rotate-90"]'
data-get-on='["0","2","2.4","2.7","3.0"]'
data-on-colors='["#ad3333","#ad3333","#505050","#505050","#505050"]'>
</div>
Rot wird es in meinem Beispiel erst ab 25% Rest, damit es nicht zu bunt auf dem Tablet wird und man besser den Überblick behält.
Zitat von: Marie am 29 April 2015, 21:08:41
Ich habe da noch einmal eine Frage bzgl. Dimmer bzw. Volume:
Es ist ja so das der dim-Wert erst gesendet wird wenn man den Knopf los lässt, das selbe gilt ja auch für das Volume Widget.
Bei einer Licht-, Helligkeits-oder Farbeinstellungen ist das für mein Empfinden aber unpraktisch.
Frage: ist es möglich das ohne große Probleme dahingehend zu ändern das z.b. die Helligkeitsänderung gesendet wird während man auf dem dim-Knopf mit dem Finger verweilt???
Nur mal so als Idee....
Grüße
Marie
Hallo Marie,
machbar wäre das, aber 1:1 kann man das nicht zu FHEM durchreichen, da verhaspelt sich das System, da die Latenzzeiten zu groß sind. Es dauert schon einige Millisekunden, bis es beim Device ankommt. Ausserdem werden dann zu viele Events hintereinander von dem UI geschickt. Man könnte versuchen aller 200ms einen neuen Wert zu schicken. Mal probieren ...
Update des Symbol Widgets
Neu: Möglichkeit zum zusätzlichen Anzeigen eines Overlay-Symboles als Warnung oder Anzahl-Visualisierung
Warnung Tür noch offen
<div data-type="symbol" data-device="TerrassenTuer"
data-get-on='["open","closed"]'
data-icons='["ftui-door warn","ftui-door"]'
data-on-colors='["#777","#555"]'
class="narrow big"></div>
(http://knowthelist.github.io/fhem-tablet-ui/t%C3%BCr_warn.png)
Signalisierung Anrufe in Abwesenheit
<div data-type="symbol" data-device="dummy1"
data-get-on='["0","1"]'
data-icons='["fa-fax","fa-fax warn"]'
data-on-colors='["#555","#666"]'>
</div>
(http://knowthelist.github.io/fhem-tablet-ui/phone_warn.png)
Zum Aktivieren des Overlay-Icons muss dem Icon zusätzlich die CSS Class 'warn' mitgeben werden. Numerische Werte bis 99 im Reading, was mit data-get angefragt wird, werden im Overlay-Icon direkt angezeigt. Alle anderen und Strings erzeugen nur ein Ausrufezeichen.
Zitat
Neu: Möglichkeit zum zusätzlichen Anzeigen eines Overlay-Symboles als Warnung oder Anzahl-Visualisierung
Ich hab mich nicht danach fragen getraut, aber genau DAS hab ich gesucht. Meine Gehversuche waren mehr als bescheiden bislang.
VIELEN Dank!
--edit--
das jetzt noch in einem "pagetab"...
--/edit--
Zitat von: setstate am 30 April 2015, 20:16:55
Hallo Marie,
machbar wäre das, aber 1:1 kann man das nicht zu FHEM durchreichen, da verhaspelt sich das System, da die Latenzzeiten zu groß sind. Es dauert schon einige Millisekunden, bis es beim Device ankommt. Ausserdem werden dann zu viele Events hintereinander von dem UI geschickt. Man könnte versuchen aller 200ms einen neuen Wert zu schicken. Mal probieren ...
Hallo Setstate,
ja sowas in der Art dachte ich mir schon....na mal schauen.. :-)
LG
Marie
Zitat von: setstate am 29 April 2015, 21:31:39
@Stril:
Ich bin immer noch der Meinung, dass mein Code auch für deinen Fall passend wäre:
<div data-type="dimmer" data-device='aLd_EG_Esszimmer_LichtLinks'
data-get-on="on"
data-get-off="off"
data-set="dim"
class="cell"></div>
Sendet folgendes:
Press Button on: set aLd_EG_Esszimmer_LichtLinks dim 62
Press Button off: set aLd_EG_Esszimmer_LichtLinks off
Slider geändert: set aLd_EG_Esszimmer_LichtLinks dim 77
Wenn Fhem ein set aLd_EG_Esszimmer_LichtLinks dim 0 bekommt, ändert das nichts am Control
@setstate:
Du hast absolut Recht. So funktioniert es grundsätzlich. Ich habe die ganze Zeit es besonders gut machen wollen und es damit kaputt konfiguriert.
Leider funktioniert es nur 4-5 mal. Danach werden die Befehle nicht, oder nur mit einem großen Zeitversatz (30-60s) ausgeführt - trotz potenter Hardware. Die CPU langweilt sich und im FHEM Log passiert während der 30s einfach nichts. Danach sieht alles normal aus.
Dimmen funktioniert - on/off dann nicht mehr zuverlässig. Starte ich den Browser neu, geht es wieder ein paar Mal - manchmal auch für 10 Minuten.
Hast Du dazu auch noch eine Idee?
Gruß und vielen Dank
Phil
Hallo zusammen, da liest man aus der Ferne, welche neuen Funktionen in kürzester Zeit hinzugekommen sind und man hat aus der Ferne keine Chance die neuen Sachen zu implementieren. Ein Glück ist heute ein Feiertag und es gibt genügend Zeit, alles auszuprobieren.
Ich habe folgende Frage im Bezug auf das Update für "Symbol".
Ich habe folgenden Code eingebaut:
Zitat<div data-type="symbol" data-device="Fensterkontakt.Schlafzimmer"
data-get-on='["open","closed"]'
data-icons='["ftui-door warn","ftui-door"]'
data-on-colors='["#777","#555"]'
class="narrow big">
Allerdings wird mir
immer das Ausrufezeichen angezeigt. Unabhängig vom Status. Mein Fensterkontakt von HomeMatic kann den Status geöffnet/closed sowie geschlossen/closed annehemen. Egal welchen Wert ich eintrage ändert sich das Symbol leider nicht.
Wo könnte mein Fehler liegen ? :-[
...hat sich erledigt!!!!
Die Farben die beim jeweiligen Status angezeigt werden sollen, sind in dem genannten Beispiel ein wenig verwirrend! Ich habe es nicht erkannt, dass es einmal grau bzw. hellgrau ist. Mit anderen Werten sieht es nun besser aus!!
Aber das rote Ausrufezeichen darf trotzdem nur beim Status open erscheinen, laut dem HTML Code.
Wenn dem nicht so ist, und es bei open und closed bleibt, ist noch was faul.
Mit den Farben muss ich auch erst noch probieren, ob das grau -> hellgrau zusammen mit den Warn Zeichen passt, oder ob es bei mir auch noch bunter werden muss, damit man den Zustand sofort erkennt.
Nein Nein! Es ist alles gut! Es macht genau das, was es machen soll!
Fenster => OPEN = "!"
Fenster => CLOSED = "kein !"
Alles ist gut!
Wo bekomme ich eine Übersicht im Bezug auf die FTUI-Icons her. Die Datei ftui-icons.svg kann ich nicht öffnen bzw. es wird mir in inkscape lediglich eine leere Seite angezeigt
Zitat von: bjoernbo am 01 Mai 2015, 14:14:20
Wo bekomme ich eine Übersicht im Bezug auf die FTUI-Icons her. Die Datei ftui-icons.svg kann ich nicht öffnen bzw. es wird mir in inkscape lediglich eine leere Seite angezeigt
;D Es gibt erst nur zwei: ftui-door und ftui-window http://forum.fhem.de/index.php/topic,34233.msg290173/topicseen.html#msg290173 (http://forum.fhem.de/index.php/topic,34233.msg290173/topicseen.html#msg290173)
Das sind die ersten beiden, die ich gemalt habe, weil so etwas im font awesome nicht dabei ist und die openautomation icons mir nicht gefallen. Es kann sein, dass da noch welche hinzukommen, wenn Bedarf besteht. Aber außer einem eigenen Batterie Icon fällt mir da spontan nix ein, was fehlt.
;D axo!
Ich war nämlich auf der Suche nach einem "KODI" / XBMC-Icon. Ich meine nesges hat das in seinem UI und dachte er hätte es aus eben genannten svg File
Zitat von: bjoernbo am 01 Mai 2015, 14:45:38
Ich war nämlich auf der Suche nach einem "KODI" / XBMC-Icon. Ich meine nesges hat das in seinem UI und dachte er hätte es aus eben genannten svg File
Das ist ein Logo-Image aus dem Kodi-Wiki (http://kodi.wiki/view/Official:Media_center_logos) in SVG gewandelt und per IcoMoon-App (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_kann_ich_eigene_Icons_verwenden.3F) in einen eigenen Font eingebaut.
Danke.
Habe ich prompt ausprobiert, aber es will leider nicht so .....
Habe mir zunächst die Icon zusammengestellt. Dann das polfix "font1-" in den Einstellungen hinterlegt. Danach in der style.css den Eintrag entspr. angepasst:
ORIGINAL:
Zitat[class^="font1-"], [class*=" font1-"] {
display: inline-block;
width: 1em;
height: 1em;
fill: currentColor;
}
/* ================================================================================
Example showing how to change the color/size of the icons:
.font1-name {
font-size: 32px; // works because "width" & "height" were set using em units
color: red; // works because "fill" was set to "currentColor"
}
================================================================================ */
.font1-connection {
width: 1.25em;
}
.font1-users {
width: 1.125em;
}
ANPASSUNG:
Zitat[class^="font1-"], [class*=" font1-"] {
display: inline-block;
width: 1em;
height: 1em;
fill: currentColor;
}
/* ================================================================================
Example showing how to change the color/size of the icons:
.font1-name {
font-size: 32px; // works because "width" & "height" were set using em units
color: red; // works because "fill" was set to "currentColor"
}
================================================================================ */
.font1-connection {
width: 1.25em;
}
.font1-users {
width: 1.125em;
}
Dann das Verzeichnis
Zitat/fhem/tablet/customfonts/font1/
angelegt. Einen entsprechenden Verweis in der HTML Datei ebenso angelegt:
Zitat<link rel="stylesheet" href="/fhem/tablet/customfonts/font1/style.css">
Alle Dateien habe ich dann in das o.g. Verzeichnis kopiert und folgende Code zum testen verwendet.
Zitat<div data-type="push" data-device="WECKER" data-icon="font1-fire"></div>
Leider wird mir nur ein Kreis anstelle von "Feuer" angezeigt. :'(
By the Way....wenn ich den Fehler gefunden habe, kannst Du mir das KODI Symbol und den Auszug aus der selection.json zur Verfügung stellen?
Ich wurde per PM gefragt ob ich meine Sonos Integration hier veröffentlichen könnt. Das ist damit erledigt. Es würde mich freuen, wenn wir die Ansicht gemeinsam noch verbessern könnten.
Die drei infoSummerize Label müssen in FHEM noch entsprechend angepasst werden. In meinem Fall ist das wie folgt:
generateInfoSummerize1: <NormalAudio><Artist prefix="<b>Künstler: </b>"/></NormalAudio><StreamAudio><Sender prefix="<b>Sender: </b>"/></StreamAudio>
generateInfoSummerize2: <NormalAudio><Title prefix="<b>Titel: </b> "/></NormalAudio><StreamAudio><SenderInfo/></StreamAudio>
generateInfoSummerize2: <Volume prefix="Lautstärke: "/><Mute instead=" ~ Kein Ton" ifempty=" ~ Ton An" emptyval="0"/> ~ Balance: <Balance ifempty="Mitte" emptyval="0"/><HeadphoneConnected instead=" ~ Kopfhörer aktiv" ifempty=" ~ Kein Kopfhörer" emptyval="0"/>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="2">
<header>SONOS MATTHIAS</header>
<div data-type="image" data-device="Sonos_Matthias" data-get="currentAlbumArtURL" data-size="100%"></div>
</li>
<li data-row="3" data-col="2" data-sizex="2" data-sizey="1">
<div class="container cell">
<div data-type="label" class="" data-device="Sonos_Matthias" data-get="infoSummarize1"></div><br>
<div data-type="label" class="" data-device="Sonos_Matthias" data-get="infoSummarize2"></div><br>
<div data-type="label" class=" small darker" data-device="Sonos_Matthias" data-get="infoSummarize3"></div>
</div>
</li>
<li data-row="4" data-col="2" data-sizex="2" data-sizey="2">
<header>PLAYER</header>
<div class="cell">
<div data-type="push" data-device="Sonos_Mattthias"
data-icon="fa-step-backward" data-background-icon="-"
data-set="Previous" class="inline">
</div>
<div data-type="push" data-device="Sonos_Matthias"
data-icon="fa-stop" data-background-icon="-"
data-set="Stop" class="inline">
</div>
<div data-type="push" data-device="Sonos_Matthias"
data-icon="fa-play" data-background-icon="-"
data-set="Play" class="inline">
</div>
<div data-type="push" data-device="Sonos_Matthias"
data-icon="fa-step-forward" data-background-icon="-"
data-set="Next" class="inline">
</div>
</div>
<div class="top-narrow">
<div data-type="push"
data-set="VolumeD"
data-icon="fa-volume-off"
data-background-icon="-"
data-device="Sonos_Matthias"
class="inline top-narrow"></div>
<div data-type="slider"
data-device="Sonos_Matthias"
data-get="Volume"
data-set="Volume"
class="inline horizontal"></div>
<div data-type="push"
data-set="VolumeU"
data-icon="fa-volume-up"
data-background-icon="-"
data-device="Sonos_Matthias"
class="inline top-narrow"></div>
</div>
<div class="cell">
<div data-type="select" data-device="Sonos_Matthias" data-items='["Radio7","SWR3","Chillstep","Aktuelles","Google_Radio"]' data-set="startFavourite" class="inline top-space"></div>
</div>
<div class="container">
<div class="inline">
<div data-type="switch" data-device="OG.mm.SD.Sonos"
data-icon="fa-plug" class="cell"></div>
<div data-type="label" >Standby</div>
</div>
<div class="inline">
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 900"
class="cell"></div>
<div data-type="label" >15min</div>
</div>
<div class="inline">
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 1800"
class="cell"></div>
<div data-type="label" >30min</div>
</div>
</div>
</li>
Was hier im Moment alles passiert ist Wahnsinn. Da kommt man ja kaum hinterher alles einzubauen. Aber nach dem Umzug dann^^
Habe Gerade ein Problem. Irgendwas übersehe ich:
Ich möchte vom Tablet den Akkuzustand mit einem Batteriezeichen anzeigen lassen.
Beim Taster hat das funktioniert. "ok" oder "low", aber bei dem direkten Zahlenwert funzt es nicht.
Entweder bekomme ich ein leeres Batteriezeichen dann wieder keins.
Danke für eure Hilfe ;) Hab jetzt schon alles versucht..
Taster (Funktioniert) :
<div data-type="symbol" data-device="HM_319828" data-get="battery"
data-background-icon="fa-circle"
data-icons='["oa-measure_battery_100","oa-measure_battery_25"]'
data-get-on='["ok","low"]'
data-on-colors='["#0CFB0C","#E50005"]'
style="font-size:2em">
</div>
Tablet (funktioniert nicht) :
<div data-type="symbol"
data-device="Nexus7"
data-get="powerLevel"
data-background-icon="fa-circle"
data-get-on='["[1-24]","[25-40]","[41-66]","[67-92]","[93-100]"]'
data-on-colors='["#E50005","#FB5909","#F5FF10","#42BC0A","#0CFB0C"]'
data-icons='["oa-measure_battery_0","oa-measure_battery_25","oa-measure_battery_50","oa-measure_battery_75","oa-measure_battery_100"]'
style="font-size:2em">
</div>
Zitat von: bjoernbo am 01 Mai 2015, 18:31:02
Alle Dateien habe ich dann in das o.g. Verzeichnis kopiert und folgende Code zum testen verwendet.
<div data-type="push" data-device="WECKER" data-icon="font1-fire"></div>
Leider wird mir nur ein Kreis anstelle von "Feuer" angezeigt. :'(
Naja, sofern dein CSS oben vollständig ist, hast du kein Icon mit dem Namen "font1-fire" ;) Mein Icon-Font liegt im Repository der Demo Installation: https://github.com/nesges/TabletUI-Demo-WOPR/tree/master/html/fonts/nesges und unter http://fhem.nesg.es/demo/fonts/nesges/demo.html kannst du dir die enhaltenen Icons anschauen.
Zitat von: Stril am 01 Mai 2015, 08:18:56
Leider funktioniert es nur 4-5 mal. Danach werden die Befehle nicht, oder nur mit einem großen Zeitversatz (30-60s) ausgeführt - trotz potenter Hardware. Die CPU langweilt sich und im FHEM Log passiert während der 30s einfach nichts. Danach sieht alles normal aus.
Oft kommen solche "Denkpausen" vor, wenn in Fhem blockierende Aktionen ablaufen. Fängt man sich leicht ein, wenn man zB Perl-Code in {} benutzt und dieser eine lange Ausführungszeit hat. Solche Calls sollte man dann besser in at-Jobs auslagern. Aber die Suche danach ist aufwendig und sehr individuell.
Zitat von: DJ_SAMMY190 am 01 Mai 2015, 20:52:17
data-get-on='["[1-24]","[25-40]","[41-66]","[67-92]","[93-100]"]'
Das sind Klassen von Ziffern in Regexnotation. In Worten formuliert, hast du folgendes notiert:
data-get-on='["Die Ziffer 1,2,4 oder ein Bindestrich","Die Ziffer 0,2,4,5 oder ein Bindestrich","Die Ziffer 1,4,6 oder ein Bindestrich" etc.Du willst vermutlich:
data-get-on='["0","25","41","67","93"]'
Zitat von: nesges am 02 Mai 2015, 02:21:12
Das sind Klassen von Ziffern in Regexnotation. In Worten formuliert, hast du folgendes notiert:
data-get-on='["Die Ziffer 1,2,4 oder ein Bindestrich","Die Ziffer 0,2,4,5 oder ein Bindestrich","Die Ziffer 1,4,6 oder ein Bindestrich" etc.
Du willst vermutlich:
data-get-on='["0","25","41","67","93"]'
Hammer Super. So einfach natürlich nicht getestet -.-
@nesges: Wer lesen kann ist klar im Vorteil. Jetzt, wo ich deine style.css gesehen habe war ich etwas verdutzt. Im Wiki steht ja auch "Generate FONT". Naja, wenn ich immer auf Generate SVG klicke kann es auch nicht funtzen. Jetzt läuft es. Danke
Gab es eine Änderung im Circe-Widget? Ich habe nach langer Zeit mal alles aktualisiert und stelle fest, dass mein Circlemenü nicht mehr richtig funktioniert.
Zitat<li data-row="3" data-col="3" data-sizex="4" data-sizey="3">
<header>KAMERA</header>
<div class="container">
<div class="center">
<div class="cell">Ben</div>
<div type="label" class="cell"><img src="http://192.168.178.133:53 XXXXXXXXX" height="320" wight="350" border="0">
</img src></div>
</div>
<div class="ontop">
<div class="cell circlemenu wider">
<ul class="menu keepopen">
<li><div data-type="push" onclick="doCam1('command=1',1)" data-icon="fa-stop"></div></li>
<li><div data-type="push" onclick="doCam1('command=0',1)" data-icon="fa-arrow-up"></div></li>
<li><div data-type="push" onclick="doCam1('command=4',1)" data-icon="fa-arrow-right"></div></li>
<li><div data-type="push" onclick="doCam1('command=2',1)" data-icon="fa-arrow-down"></div></li>
<li><div data-type="push" onclick="doCam1('command=6',1)" data-icon="fa-arrow-left"></div></li>
</ul>
</div>
</div>
</div>
<iframe id="ifrResult1" name="ifrResult1" style="border:1pt;width:1px;height:1px;"></iframe>
<iframe id="ifrResult" name="ifrResult" style="border:1pt;width:1px;height:1px;"></iframe>
</div>
</div>
</li>
Guten Morgen,
1.) könnte mir jemand helfen ich hab bei meinen Heizkörperthermostaten CUL_HM_HM_CC_RT_DN die möglichkeit diese zu schliessen/ sperren (R-btnLock), wie realisiere ich einen Switch der dies für mich macht.
mit
<div data-type="switch" data-device="CUL_HM_HM_CC_RT_DN_xxxxx" data-get="R-btnLock" data-get-on="on" data-get-on="off" data-cmd="set+CUL_HM_HM_CC_RT_DN_xxxxx+R-btnLock" data-icon="fa-lock" class="cell"></div>
wird es richtig angezeigt aber nicht richtig gesetzt.
2.) Ist es möglich die Templisten der einzelnen Thermostate in FTUI einzubinden?
mfg
Hallo zusammen,
auch ich wollte nun mal diese Oberfläche für mein Tablet testen, die testoberfläche sieht auch gut aus.
Wo trage ich denn nun die Daten für meine Thermostaten, Schalter etc. ein?
Die .www/tablet/index.html sieht aus wie auf dem screenshot.
Wo bitte liegt mein Fehler?
Gruß
Ralf
ZitatDie .www/tablet/index.html sieht aus wie auf dem screenshot.
Wo bitte liegt mein Fehler?
Schaut nach dem bekannten "CSS-wird-auf-dem-iPad-nicht-richtig-geladen-Fehler" aus. Mach ein paar Mal reload, bis es vernünftig ausschaut.
Um das UI auf Deine Bedürfnisse anzupassen, musst Du die Datei index.html editieren. Entweder extern auf deinem PC/ Mac und dann per FTP auf den FHEM-Rechner oder auf dem FHEM-Rechner direkt mit z.B. "vi".
Hallo tomster,
danke für die schnelle Antwort.
Ich exportiere die Datei mit Cyberduck und öffne sie anschließend mit Firefox oder TextEdit.
Sie sieht immer so aus wie auf dem screenshot.
Die Oberfläche auf meinem Tablet oder Laptop sieht aber wie auf diesem screenshot aus.
Gruß
Ralf
Zitat von: bjoernbo am 02 Mai 2015, 08:15:05
Gab es eine Änderung im Circe-Widget? Ich habe nach langer Zeit mal alles aktualisiert und stelle fest, dass mein Circlemenü nicht mehr richtig funktioniert.
Hallo bjoernbo,
das circlemenu ist jetzt ein widget und muss deshalb so anfangen:
<div data-type="circlemenu" class="cell circlemenu">
<ul class="menu keepopen">
.
.
.
Zitat von: l3skon3 am 02 Mai 2015, 10:21:41
Guten Morgen,
1.) könnte mir jemand helfen ich hab bei meinen Heizkörperthermostaten CUL_HM_HM_CC_RT_DN die möglichkeit diese zu schliessen/ sperren (R-btnLock), wie realisiere ich einen Switch der dies für mich macht.
wird es richtig angezeigt aber nicht richtig gesetzt.
2.) Ist es möglich die Templisten der einzelnen Thermostate in FTUI einzubinden?
mfg
zu 1.:
Laut Fhem-Wiki muss das so geschaltet werden:
Zitatset <HM-CC-RT-DN> regSet btnLock on
also würde ich den HTML Code zu anlegen:
<div data-type="switch" data-device="CUL_HM_HM_CC_RT_DN_xxxxx"
data-get="R-btnLock"
data-get-on="on"
data-get-on="off"
data-set-on="regSet btnLock on"
data-set-off="regSet btnLock off"
data-icon="fa-lock" class="cell"></div>
zu2.: in diese Richtung gibt es keine Aktivitäten, so weit ich weiß. Eine Anzeige per Labels könnte man zwar bauen, aber setzten ... Macht man doch nicht sooft, dass man das auf dem Tablet braucht. Ich würde mir dann lieber per 99_myUtils.pm fixe Settings anlegen und die per Switch vom Tablet aus setzen.
Zitat von: setstate am 02 Mai 2015, 11:39:04
zu 1.:
Laut Fhem-Wiki muss das so geschaltet werden:
also würde ich den HTML Code zu anlegen:
<div data-type="switch" data-device="CUL_HM_HM_CC_RT_DN_xxxxx"
data-get="R-btnLock"
data-get-on="on"
data-get-on="off"
data-set-on="regSet btnLock on"
data-set-off="regSet btnLock off"
data-icon="fa-lock" class="cell"></div>
zu2.: in diese Richtung gibt es keine Aktivitäten, so weit ich weiß. Eine Anzeige per Labels könnte man zwar bauen, aber setzten ... Macht man doch nicht sooft, dass man das auf dem Tablet braucht. Ich würde mir dann lieber per 99_myUtils.pm fixe Settings anlegen und die per Switch vom Tablet aus setzen.
einfach Klasse!!! Besten Dank es klappt.
Zu. 2: Das werde ich auch so machen dazu nehme ich das Modul Heating_Control mit rein.
Besten Dank nochmal!
@pnewman
Ahh, jetzt! Kann es sein, dass Du die index.html als eine Art Preview aus Cyberduck heraus via Firefox aufrufst? Dann wird nämlich nur die index.html aufgerufen, die lokal auf deinem Rechner liegt. Die Verzeichnisverweise zum CSS, etc., die in der index.html stehen (./www/tablet/css/xyz) werden dann natürlich nicht gefunden und demnach auch nicht eingebunden. Dann sieht's so aus, wie in deinem Screenshot.
Ich hab zwar kein Cyberduck, aber Du musst die index.html auch wieder per FTP auf den FHEM-Rechner zurückspielen nach der Änderung.
Wenn Du dann im Firefox http://[IP-des-FHEM-Rechners]:8083/www/tablet/index.html aufrufst, dann siehst Du auch im Firefox die geänderte Seite in voller Pracht.
Hallo tomster,
danke für die Antwort.
wenn in der index.html noch verweise stecken dann kopiere ich sie natürlich nicht mit.
Jetzt ist mir dies klargeworden.
Nur, wenn ich keinen Code sehe, kann ich auch keinen anpassen.
Zitat von: tomster am 02 Mai 2015, 13:06:48
Wenn Du dann im Firefox http://[IP-des-FHEM-Rechners]:8083/www/tablet/index.html aufrufst, dann siehst Du auch im Firefox die geänderte Seite in voller Pracht.
Bei mir erscheint dann nur die normale FHEM Oberfläche!
Da er dann auf http://[IP-des-FHEM-Rechners]:8083/fhem umstellt
Das kann doch nicht so schwer sein?
Irgendwo habe ich doch einen Denkfehler?
Wie bearbeitet Ihr denn die index.html?
Gruß
Ralf
Hallo pnewman,
ich habe FHEM auf meinem NAS laufen, was ich im Finder auch als Netzlaufwerk sehe und kann die entsprechenden Folder dann auch mit Schreibzugriff per Finder öffnen und die index.html mit einem X-beliebigen Editor (TextEdit, BBEdit, Qt Creator) anpassen.
Zitat von: setstate am 02 Mai 2015, 13:46:28
Hallo pnewman,
ich habe FHEM auf meinem NAS laufen, was ich im Finder auch als Netzlaufwerk sehe und kann die entsprechenden Folder dann auch mit Schreibzugriff per Finder öffnen und die index.html mit einem X-beliebigen Editor (TextEdit, BBEdit, Qt Creator) anpassen.
Hallo setstate,
die Oberfläche gefällt mir sehr gut.
Ich hatte mal mit dem gedanken gespielt auf das NAS umzuziehen, aber erstmal lasse ich es lieber auf dem Raspberry, das NAS ist wieder eine Unbekannte mehr in diesem Spiel. ;)
Ich habe gerade mittels Terminal und nano die index.html in bearbeitung.
Die Wohnzimmerthermostate (Max!) habe ich eingebunden, zeigen brav die Stati, aber die Temperaturänderung nehmen sie nicht mit.
Dies habe ich abgeändert:
<li data-row="2" data-col="4" data-sizex="4" data-sizey="2">
<header>WOHNZIMMER</header>
<div class="container">
<div class="left">
<div data-type="thermostat" data-device="T_Wohn" data-get="desiredTemperature" data-temp="temperature" class="cell"></div>
<div data-type="thermostat" data-device="HZ_Tuer" data-valve="ValvePosition" data-get="desiredTemperature" data-temp="temperature" class="cell"></div>Habe ich etwas vergessen?
Muss ich die änderung in der Oberfläche irgendwie bestätigen?
Gruß
Ralf
Fangen wir Mal anders an, pnewman:
Auf welchem Gerät läuft dein FHEM? Raspberry Pi, NAS, etc.
Kannst Du mittels SSH auf diesen Rechner zugreifen?
--edit--
OK, RasPi und nano.
Wenn Du die index.html schon Mal ändern kannst, dann musst Du sie noch mit (ich glaub STRG+o) speichern.
Bei Deinem Code oben fehlen glaub ich noch 2 x </div> am Schluß. Bin grad am Handy, da ist mir der Text zu fuzzelig...
Danke für die Rückmeldung setstate. Kann es sein das "ontop" nicht mehr funktioniert? Wenn ich den Zusatz "ontop" verwende wird mir zwar da Circlemenü mit den entspr. Funktionen angeboten nur lassen sich diese nicht mehr auswählen.
Danke für die schnelle Fehlersuche.
Da ich MAX! Thermostate besitze kann es nicht set desired-temp heissen sondern set desiredTemperature
Wie ändere ich dies?
Im WIKI steht
data-set
command to send to FHEM (set <device> <command> <value>) (default 'desired-temp')
Gruß
Ralf
Trage ich dies direkt in meinen Code ein?
<div data-type="thermostat" data-device="T_Wohn" data-get="desiredTemperature" data-temp="temperature" data-set "T_Wohn" "desiredTemperature" class="cell"></div>
Danke,
ich habe es so gelöst:
<div data-type="thermostat" data-device="HZ_Tuer" data-valve="valveposition" data-get="desiredTemperature" data-temp="temperature" data-set="desiredTemperature" class="cell"></div>
Und es funktioniert!! ;D ;D
Gruß
Ralf
Genau das UI das ich gesucht habe .. und zwar nicht nur für das Tablet sondern auch auf dem Desktop ... nach nur 3 Stunden sieht alles genau so aus wie ich es wollte (und am längsten dauerte noch das Lesen dieses threads) ;D
Dank an alle, die daran mitgearbeitet haben
Zitat von: pnewman am 02 Mai 2015, 16:13:22
Danke,
ich habe es so gelöst:
<div data-type="thermostat" data-device="HZ_Tuer" data-valve="valveposition" data-get="desiredTemperature" data-temp="temperature" data-set="desiredTemperature" class="cell"></div>
Und es funktioniert!! ;D ;D
Gruß
Ralf
Perfekt!!! Schön, dass es jetzt bei dir klappt.
Und vielen Dank für die Info, wie es funktioniert.
Ich werde es für andere zur Nachnutzung gleich in die ReadMe schreiben.
Hallo, sehr nette Sache, kann man den Quellcode der livedemo irgendwo bekommen?
Hallo,
so, vielleicht kann ich ja auch einmal etwas beitragen :)
Besteht evtl. Interesse daran das das Fronend via WebSockets über geänderte Daten aktualisiert wird und nicht via "longPoll"?
Ich frage, weil ich das nun seit 2 Tagen genau so bei mir am laufen habe, es ist eine Erweiterung im fhem-tablet-ui.js welche dann ähnlich wie jetzt "longpoll=1" in der index.html gesteuert werden kann. Es wird keine Kompatibilität mit der jetzigen Version gebrochen!
Dazu notwendig ist natürlich ein websockets-proxy, der auf dem FHEM-Server läuft. Dazu habe ich im Moment noch eine angepasste Version von Werner Schäfer hier laufen: http://forum.fhem.de/index.php/topic,33755.0.html. Von ihm stammt also die Arbeit am nodejs-proxy, ich habe lediglich ein paar Erweiterungen eingebaut damit die korrekten Daten für die FTUI zur Verfügung gestellt werden.
Das alles läuft bis jetzt sehr stabil und das größte Problem der reconnects nach Standby usw. ist damit zumindest bei mir kein Problem mehr. Da die Steuerung in den aktuellen Browsern eingebaut ist und diese sich selbst wieder auf den websocket-server verbinden.
Zitat von: bjoernbo am 02 Mai 2015, 14:48:20
Danke für die Rückmeldung setstate. Kann es sein das "ontop" nicht mehr funktioniert? Wenn ich den Zusatz "ontop" verwende wird mir zwar da Circlemenü mit den entspr. Funktionen angeboten nur lassen sich diese nicht mehr auswählen.
ich habe den z-index von 1000 auf 1003 angepasst. Passte es jetzt bei dir?
Zitat von: hyper2910 am 02 Mai 2015, 21:51:31
Hallo, sehr nette Sache, kann man den Quellcode der livedemo irgendwo bekommen?
Schau mal hier: http://forum.fhem.de/index.php/topic,36063.0.html
Zitat von: rretsiem am 02 Mai 2015, 23:07:55
Dazu notwendig ist natürlich ein websockets-proxy, der auf dem FHEM-Server läuft. Dazu habe ich im Moment noch eine angepasste Version von Werner Schäfer hier laufen: http://forum.fhem.de/index.php/topic,33755.0.html. Von ihm stammt also die Arbeit am nodejs-proxy, ich habe lediglich ein paar Erweiterungen eingebaut damit die korrekten Daten für die FTUI zur Verfügung gestellt werden.
Hallo rretsiem,
klingt interessant, ich finde longpoll auch etwas schräg, eine ordentliche Socketverbindung würde mir auch gut gefallen.
Ich finde nur, damit es für die Allgemeinheit nutzbar werden kann, sollte so etwas standardmäßig im FHEM nutzbar sein, bzw. als Modul mit einem define verfügbar sein.
Vielleicht können wir das Interface zu FHEM etwas flexibler machen. Je nach Config kann man jeder seine bevorzugte Connection einstellen: longpoll vs. sockets, json2 vs. list
Zitat von: setstate am 02 Mai 2015, 23:59:08
Vielleicht können wir das Interface zu FHEM etwas flexibler machen. Je nach Config kann man jeder seine bevorzugte Connection einstellen: longpoll vs. sockets, json2 vs. list
Dafür! :-)
Zitat von: setstate am 02 Mai 2015, 23:59:08
Vielleicht können wir das Interface zu FHEM etwas flexibler machen. Je nach Config kann man jeder seine bevorzugte Connection einstellen: longpoll vs. sockets, json2 vs. list
Das klingt gut. Ich werde mal in den nächsten Abenden das weiter bei mir generalisieren und dann mal mit einem ersten Vorschlag für die Sockets vs Longpolls an die Öffentlichkeit treten :-)
Das Thema Websocket ist eigentlich ein FHEM.pl Thema aber leider tut sich in der Richtung nichts mehr. Und ich kann zu wenig Perl das da was vernünftiges bei rauskommt. Daher die Lösung von Werner Schäfer mit dem Proxy.
Guten Abend,
gibt es beim widget symbol ein Problem bei den Farben, oder mache ich einfach nur etwas falsch.
data-get-on='["incoming","incoming_noconnect","outgoing","outgoing_noconnect","AB"]'
data-icons='["fa-arrow-circle-left","fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-right","fa-microphone"]'
data-on-colors='["#aa6900","#505050","#aa6900","#505050","#aa6900"]'
Es werden bei mir trotzdem alle Symbole in einer Farbe angezeigt, egal was ich mache.
Gemäß der Beschreibung im Wiki sollte diese Angabe allerdings korrekt sein.
ZitatTo use multiple icons, data-get-on, data-icons and data-on-colors have to be an array with the same size. The value for one icon can also contain an additional animatation CSS name, e.g. "fa-exclamation-triangle fa-blink" for a blinking symbol.
Vielen Dank für die Info zu dem Quellcode.
Soweit steht bei mir alles, jedoch habe ich in einem Raum zwei MiLight, diese werden immer untereinandere im Raum angezeigt, wie bekomme ich diese Nebeneinander?
<div class="cell left">
<div class="cell">
<header>STEHLAMPE</header>
<div data-type="switch" data-device="Stehlampe" data-set-on="hsv 0,0,10" class="cell mini" ></div>
<div data-type="label" class="cell">Stehlampe Weiss</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick mini top-space-3x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="dimmer" data-device="Stehlampe" data-get-on="on" data-get-off="off" data-set="dim" class="cell" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
<div class="cell right">
</div>
<header>TVLICHT</header>
<div data-type="switch" data-device="TVLicht" data-set-on="hsv 0,0,10" class="cell mini" ></div>
<div data-type="label" class="cell">TVLicht Weiss</div>
<div data-type="volume" data-device=TVLicht" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick mini top-space-3x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="dimmer" data-device="TVLicht" data-get-on="on" data-get-off="off" data-set="dim" class="cell" ></div>
<div data-type="label" class="cell">Hell</div>
ZitatVielleicht können wir das Interface zu FHEM etwas flexibler machen. Je nach Config kann man jeder seine bevorzugte Connection einstellen: longpoll vs. sockets, json2 vs. list
ggf. eine config.Datei in der alles nur einmal angeben wird. longpoll, debug, etc. In den jeweiligen HTML-Seiten kommt dann ein Verweis auf diese eine Datei wo die Daten dann ausgelesen werden.
Zitat von: hyper2910 am 03 Mai 2015, 07:44:53
Soweit steht bei mir alles, jedoch habe ich in einem Raum zwei MiLight, diese werden immer untereinandere im Raum angezeigt, wie bekomme ich diese Nebeneinander?
Nur schnell mal aus der readme kopiert, vielleicht findest du dann gleich die richtige Stelle bei dir:
Zitat**Example** for how to show two labels in one line.
<div class="">
<div type="label" device="OnSunrise" class="inline"></div>bis
<div type="label" device="OnSunset" class="inline"></div>
</div>
Zitat von: uniqueck am 03 Mai 2015, 01:43:43
Guten Abend,
gibt es beim widget symbol ein Problem bei den Farben, oder mache ich einfach nur etwas falsch.
data-get-on='["incoming","incoming_noconnect","outgoing","outgoing_noconnect","AB"]'
data-icons='["fa-arrow-circle-left","fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-right","fa-microphone"]'
data-on-colors='["#aa6900","#505050","#aa6900","#505050","#aa6900"]'
Es werden bei mir trotzdem alle Symbole in einer Farbe angezeigt, egal was ich mache.
Gemäß der Beschreibung im Wiki sollte diese Angabe allerdings korrekt sein.
Hallo uniqueck,
du machst nix falsch. Ich glaube hier gibt es noch Optimierung-Potential, ob RegEx angewendet wird oder nur String-Vergleich. Durch die gleichen Wort-Anteile ein zwei Werten, passiert hier unerwartetes. Es schlägt der erste Match schon zu.
Vertausche mal die Reihenfolge, erst die speziellen, dann die allgemeinen Werte:
data-get-on='["incoming_noconnect","incoming","outgoing_noconnect","outgoing","AB"]'
Die Farben dann entsprechend mit tauschen.
Zitat von: bjoernbo am 03 Mai 2015, 07:57:26
ggf. eine config.Datei in der alles nur einmal angeben wird. longpoll, debug, etc. In den jeweiligen HTML-Seiten kommt dann ein Verweis auf diese eine Datei wo die Daten dann ausgelesen werden.
Das würde aber einen zusätzlichen HTTP requests bedeuten für den Browser. Wir reden hier zwar meist von lokalen Requests aber die sind trotzdem nicht notwendig.
Die Index.html ist dafür eigentlich schon gut geeignet, weil man dann auch flexibel für versch. Seiten Konfigurationen verwalten kann.
Hallo zusammen,
habe gestern versucht mit dem switch widget ein "3 state" Schalter umzusetzen, ähnlich wie es mit dem symbole widget funktioniert. Leider ohne Erfolg.
Kann mit bitte jemand auf die Sprünge helfen, oder funktioniert das nicht?
Danke!
LG Haecksler
Hallo setstate
vielen vielen Dank für die tolle GUI und die viele Arbeit.
Fange gerade an mich damit zu beschäftigen.
Meiner Meinung nach bin ich beim weather-widget im Zusammenhang mit PROPLANTA und den kleinklimamap-Icons auf einen Bug gestoßen.
"wolkig" sollte eigentlich auf "mostlycloudy.png" gemappt werden. Durch die Übersetzungsmap kommt aber "cloudy" und somit "cloudy.png" heraus.
Es kann bei PROPLANTA "wolkig" und "stark bewoelkt" nicht unterschieden werden.
Könnte man nicht das verwendete Modul von FHEM abfragen oder zumindest im Widget angeben, damit die "richtige" Map verwendet wird.
Risiko.
Zitat von: Risiko am 03 Mai 2015, 16:59:39
"wolkig" sollte eigentlich auf "mostlycloudy.png" gemappt werden. Durch die Übersetzungsmap kommt aber "cloudy" und somit "cloudy.png" heraus.
Es kann bei PROPLANTA "wolkig" und "stark bewoelkt" nicht unterschieden werden.
Stimmt, danke für den Hinweis. Ich benutze Proplanta nur am Rande, hier fehlen mit Sicherheit noch jede Menge Wetterbezeichnungen (grade im Moment hab ich "unterschiedlich bewoelkt, vereinzelt Schauer und Gewitter", das ist auch noch nicht drin). Wenn jemand ernsthaft Proplanta einsetzen möchte, brauche ich dazu Input über die Readings, die das Modul ausgibt. Den Fehler mit der falschen Übersetzung kann ich dagegen leicht fixen, denke ich. Proplanta liefert mW nur Deutsch, muss nicht übersetzt werden und die Readingsbezeichnung fc#_weatherDay ist (bisher) eindeutig.
Wegen der fehlenden Readings: Proplanta kennt anscheinend 14 verschiedene Icons, nur für die ersten 8 habe ich die korrekte Zuordnung, zwei weitere nicht zugeordnete Wetterbezeichnungen sind bekannt. Diese Tabelle müsste vervollständigt werden, damit Proplanta wirklich brauchbar wird:
http://www.proplanta.de/wetterdaten/images/symbole/t1.gif sonnig
http://www.proplanta.de/wetterdaten/images/symbole/t2.gif heiter
http://www.proplanta.de/wetterdaten/images/symbole/t3.gif wolkig
http://www.proplanta.de/wetterdaten/images/symbole/t4.gif stark bewoelkt
http://www.proplanta.de/wetterdaten/images/symbole/n5.gif bedeckt
http://www.proplanta.de/wetterdaten/images/symbole/t6.gif Regenschauer
http://www.proplanta.de/wetterdaten/images/symbole/t7.gif Regen
http://www.proplanta.de/wetterdaten/images/symbole/t8.gif unterschiedlich bewoelkt, vereinzelt Schauer und Gewitter
http://www.proplanta.de/wetterdaten/images/symbole/t9.gif
http://www.proplanta.de/wetterdaten/images/symbole/t10.gif
http://www.proplanta.de/wetterdaten/images/symbole/t11.gif
http://www.proplanta.de/wetterdaten/images/symbole/t12.gif
http://www.proplanta.de/wetterdaten/images/symbole/t13.gif
http://www.proplanta.de/wetterdaten/images/symbole/t14.gif
Schnee
Schneeregen
Zitat von: Haecksler am 03 Mai 2015, 13:49:56
habe gestern versucht mit dem switch widget ein "3 state" Schalter umzusetzen, ähnlich wie es mit dem symbole widget funktioniert. Leider ohne Erfolg.
Kann mit bitte jemand auf die Sprünge helfen, oder funktioniert das nicht?
Was genau meinst du damit? Grundsätzlich funktioniert die Konfiguration mehrerer Status bei den Symbol, Switch und Button-Widgets gleich. Zum Beispiel:
<div data-type="switch"
data-device="TEST"
data-on-colors='["red","blue","green"]'
data-get-on='["1","2","3"]'
data-icons='["fa-bolt","fa-power-off","fa-diamond"]'
></div>
Zitat von: hyper2910 am 03 Mai 2015, 07:44:53
Soweit steht bei mir alles, jedoch habe ich in einem Raum zwei MiLight, diese werden immer untereinandere im Raum angezeigt, wie bekomme ich diese Nebeneinander?
Das geht per CSS. Bei den vordefinierten Klassen dürfte "inline" das sein, das du suchst. Siehe https://github.com/knowthelist/fhem-tablet-ui#css-class-description
Zitat von: setstate am 03 Mai 2015, 08:36:13
Hallo uniqueck,
du machst nix falsch. Ich glaube hier gibt es noch Optimierung-Potential, ob RegEx angewendet wird oder nur String-Vergleich. Durch die gleichen Wort-Anteile ein zwei Werten, passiert hier unerwartetes. Es schlägt der erste Match schon zu.
Vertausche mal die Reihenfolge, erst die speziellen, dann die allgemeinen Werte:
data-get-on='["incoming_noconnect","incoming","outgoing_noconnect","outgoing","AB"]'
Die Farben dann entsprechend mit tauschen.
Guten Abend,
natürlich da hätte ich ja auch selber drauf kommen können.
Aber vielen Dank für den Hinweis, ich denke das man hiermit leben kann.
Vielen Dank vor allem für das geniale Frontend, weiter so ;)
Servus zusammen!
Ich möchte gerne einen Abfallkalender in's UI integrieren und stehe nun vor der Tatsache, dass bei uns der "Gelbe Sack" und der Papiermüll am gleichen Tag abgeholt werden. Meine Versuche einem Dummy-Status 2 Icons zuzuordnen scheitern bislang allerdings kläglich...
<div class="inline wider">
<div data-type="label" class="">Abfallkalender</div>
<div data-type="symbol" data-device="ui_abfallkalender" data-icons='["trashcan_ico","trashcan_ico","trashcan_ico","bag","trashcan_ico";"bag"]' data-get-on='["Papier","Restmuell","Biomuell","GelberSack","PapGeS"]' data-on-colors='["#01A3F5","#aa6900","#82550C","#FFFF00","#FFFF00"]' class="narrow small"></div>
</div>
Hat jemand eine Idee oder ist das gar nicht vorgesehen?
Das ist kein Problem (wenn ich dich richtig verstehe), aber dein Code wirft Fragen auf:
Ist trashcan_ico selbst definiert? Gibt's so im Standard nämlich nicht.
Gleiches für "bag".
Das Semikolon im data-icons Array ist falsch.
Zitat von: nesges am 03 Mai 2015, 22:30:00
Wegen der fehlenden Readings: Proplanta kennt anscheinend 14 verschiedene Icons, nur für die ersten 8 habe ich die korrekte Zuordnung, zwei weitere nicht zugeordnete Wetterbezeichnungen sind bekannt.
Denke es sind sogar 28 (14 Tag t1-t14 und 14 Nacht n1-n14).
Im Anhang mein Vorschlag.
Würdest du für das Mapping auf die Icon-Readings umstellen wollen (z.B. fc0_weatherDay --> fc0_weatherDayIcon)?
Alternativ könnte man auch die Proplanta-Icons direkt verwenden ( data-imageset="proplanta")?
Risiko.
Zitat
Das ist kein Problem (wenn ich dich richtig verstehe), aber dein Code wirft Fragen auf:
Ist trashcan_ico selbst definiert? Gibt's so im Standard nämlich nicht.
Gleiches für "bag".
Das Semikolon im data-icons Array ist falsch.
Das trashcan_ico ist ein selbsterstelltes Icon und natürlich definiert. bag gibt's in den fhem-svgs (auch wenn es wohl als fs-bag eingebunden werden muss). Das Semikolon war nur als Beispiel gedacht. Ich hab auch schon & ? | oder was mir auch immer eingefallen ist probiert. Hätt ich vielleicht in obigem Posting dazuschreiben sollen. Muss mich da halt trial'n'error-mäßig heranarbeiten, weil ich keine dieser Sprachen wirklich spreche...
Jedoch stimmt mich Dein "Das ist kein Problem" tendenziell eher freudig, denn zu gehen scheint es dann ja wohl irgendwie.
Auf Deutsch gesagt möchte ich, dass beim Status "PapGes" 2 Icons nebeneinenader angezeigt werden.
@nesges
Hier mal eine Version für Proplanta.
Vielleicht kannst du was übernehmen.
Risiki
Zitat von: Risiko am 04 Mai 2015, 18:52:15
Würdest du für das Mapping auf die Icon-Readings umstellen wollen (z.B. fc0_weatherDay --> fc0_weatherDayIcon)?
Alternativ könnte man auch die Proplanta-Icons direkt verwenden ( data-imageset="proplanta")?
Gute Idee und danke für die beiden Files! Werde ich so integrieren, dann sind die unbekannten Bezeichner nicht mehr so wichtig. Wobei ich die immer noch gerne hätte, damit's vollständig ist :)
Zitat von: tomster am 04 Mai 2015, 20:14:15
Auf Deutsch gesagt möchte ich, dass beim Status "PapGes" 2 Icons nebeneinenader angezeigt werden.
Ah, Missverständnis. Das geht so leider nicht. Du musst dir das Widget als ein(1) Icon vorstellen, bei dem du nur das Bild austauschst. Was aber geht: Zwei Icons und das zweite hat immer die Farbe des Hintergrunds, ausser im Status "PapGes".
<div class="inline wider">
<div data-type="label" class="">Abfallkalender</div>
<div data-type="symbol"
data-device="ui_abfallkalender"
data-get-on='["Papier","Restmuell","Biomuell","GelberSack","PapGeS"]'
data-icons='["trashcan_ico","trashcan_ico","trashcan_ico","bag","trashcan_ico"]'
data-on-colors='["#01A3F5","#aa6900","#82550C","#FFFF00","#FFFF00"]'
class="narrow small"></div>
<div data-type="symbol"
data-device="ui_abfallkalender"
data-get-on="PapGeS"
data-get-off="!on"
data-icon="bag"
data-on-color="#FFFF00"
data-off-color="#2a2a2a"
data-off-background-color="#2a2a2a"
class="narrow small"></div>
</div>
Zitat von: nesges am 03 Mai 2015, 23:24:37
Was genau meinst du damit? Grundsätzlich funktioniert die Konfiguration mehrerer Status bei den Symbol, Switch und Button-Widgets gleich. Zum Beispiel:
<div data-type="switch"
data-device="TEST"
data-on-colors='["red","blue","green"]'
data-get-on='["1","2","3"]'
data-icons='["fa-bolt","fa-power-off","fa-diamond"]'
></div>
Ja genau das wollte ich, funktioniert aber nicht, hier mein Code
<div data-type="switch"
data-device="Auto_Ja_SE"
data-get-on='["AN","AUS_Licht","AUS"]'
data-icons='["fa-square","fa-square","fa-square"]'
data-on-colors='["#aa6900","SeaGreen","IndianRed"]'
class="cell big"
></div>Es wird immer ein "
set Auto_Ja_SE AN,AUS_Licht,AUSoder
set Auto_Ja_SE offgesendet.
Eigentlich will ich die 3 Zustände AN, AUS_Licht und AUS beim betätigen des Schalters durchtoggeln.
Zitat von: Risiko am 04 Mai 2015, 18:52:15
Würdest du für das Mapping auf die Icon-Readings umstellen wollen (z.B. fc0_weatherDay --> fc0_weatherDayIcon)?
Alternativ könnte man auch die Proplanta-Icons direkt verwenden ( data-imageset="proplanta")?
Bitte einmal diese Version testen: https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_weather.js
Neu:
data-device-typeMögliche Werte: PROPLANTA, Weather, OPENWEATHER. Wenn nicht gesetzt, wird versucht den Typ aus dem verwendeten Readingnamen zu erschliessen. Relevant ist das Attribut bzw. die automatische Erkennung derzeit nur für PROPLANTA: Wenn beim data-device-type "PROPLANTA" der Wert kein P.-Icon-URL ist, wird die Translationmap nicht verwendet; ansonsten wird der Icon-Dateiname ohne Endung in die Translationmap gegeben.
data-imageset="reading"Das Imageset "reading" ist ein virtuelles Set. Ist es gesetzt, wird angenommen, dass das Reading einen Icon-URL enthält und dieses direkt angezeigt.
Beispiele:
<div data-type="weather"
data-device="WETTER_PROPLANTA"
data-get="fc0_weatherNightIcon"
data-imageset="reading"></div>Zeigt das Proplanta-Icon direkt an.
<div data-type="weather"
data-device="TEST"
data-device-type="PROPLANTA"
data-imageset="reading"></div>Zeigt das Proplanta-Icon ebenfalls direkt an; da aber der Readingname keinen Hinweis auf das verwendete Wetter-Modul gibt, muss dem Widget per data-device-type="PROPLANTA" geholfen werden.
Zitat von: Haecksler am 04 Mai 2015, 22:42:50
Eigentlich will ich die 3 Zustände AN, AUS_Licht und AUS beim betätigen des Schalters durchtoggeln.
Ah, um's senden ging's! :) Das hatten wir bisher noch nicht, ich hab aber grade ein wenig experimentiert und habe eine erste, experimentelle(!) Version. Probier mal bitte https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_tripush.js aus.
<div data-type="tripush"
data-device="Auto_Ja_SE"
data-get-on='["AN","AUS_Licht","AUS"]'
data-set-on='["AUS_Licht","AUS","AN"]'
data-set-off="AUS"
data-icons='["fa-square","fa-square","fa-square"]'
data-on-colors='["#aa6900","SeaGreen","IndianRed"]'
class="cell big"
></div>
Zitat von: nesges am 04 Mai 2015, 23:34:02
Bitte einmal diese Version testen: https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_weather.js
Funktioniert prima.
Nur an die translation map muss man nochmal ran.
Versuche ich heut Abend zu machen.
Risiko.
Nachdem ich jetzt seit ein paar Tagen mit dem Thermostat-Widget rumspiele hätte ich einen Erweiterungswunsch ... falls das schon irgendwie klappt und ich es nur nicht gefunden habe, bitte ich um einen kurzen Hinweis ;)
Es wäre schön :), wenn man minColor und maxColor beim Aufruf des Widgets angeben könnte. Ich habe das bei mir schon geändert, aber es wäre besser wenn dies eine Erweiterung im Standard ist 'minColor': $(this).data('mincolor') || getStyle('.thermostat.mincolor','color') ||'#4477ff',
'maxColor': $(this).data('maxcolor') || getStyle('.thermostat.maxcolor','color') ||'#ff0000',
Noch schöner :) :) wäre es, wenn man mehrere Bereiche für den Farbverlauf angeben könnte. Z.B. min-17 = kalt = blau-blaugrün, 17-23 = wohlfühl = blaugrün-gelbgrün, 23-max = zu warm = gelbgrün bis rot
Hallo,
ich wollte mir die Arbeit ein bischen erleichtern und die Seitendefinitionen in eine Konfigurationsdatei auslagern und nur noch die Templates erstellen.
Bei der Suche bin ich auf AngularJS und Angular-Gridster gestossen.
Vorab mal eine Frage: Gibt es einen Grund AngularJS nicht zu nutzen?
Die Neugier brachte mich auf folgenden Stand:
- Es gibt nur noch eine index.html, die die einzelnen Seitendefinitionen aus einer JSON-Datei ausliest. Diese Datei liegt im TabletUI Root-Verzeichnis.
- Ich habe eine eigenen Tag (Directive) "ftui-pagebutton" programmiert, womit ich die einzelnen Seitendefinitionen aus der Config abrufen und darstellen kann
Jetzt müsste noch die Funktionalität von FTUI hier verheiratet werden.
Ich hänge mal ein paar Dateien an. Vielleicht gefällt ja der Ansatz.
Es ist aber wirklich nur absolute Alpha-Version. Reines Interesse an AngularJS.
Die Initialisierung mit InitWidgets funktioniert zur Zeit erst nach einem Wechsel der Seite unten im select.
Ach ja, in den Dateien ist noch das Verzeichnis tabletTest eingetragen. Wollte mir nicht mein FTUI beim Testen zerschiessen.
Sehe gerade das im FF nicht alle Button angezeigt werden. Hab selber im IE getestet.
Wie gesagt, war nur so ne Idee ;-)
Zitat von: setstate am 02 Mai 2015, 11:39:04
<div data-type="switch" data-device="CUL_HM_HM_CC_RT_DN_xxxxx"
data-get="R-btnLock"
data-get-on="on"
data-get-off="off"
data-set-on="regSet btnLock on"
data-set-off="regSet btnLock off"
data-icon="fa-lock" class="cell"></div>
Ich habe genau diesen Switch bei mir so definiert, natürlich mit meinen data-device. Nun ist mir aufgefallen, dass der Status nicht stimmt sobald dieser Switch sich auf einer anderen Unterseite als index.html befindet. die Unterseiten werden durch pagetab referenziert und aufgerufen. Könnte sein dass hier ein Bug versteckt ist? Auf der index.html läuft der Switch problemlos.
Zitat von: Wegwerf am 05 Mai 2015, 15:38:54
Ich habe genau diesen Switch bei mir so definiert, natürlich mit meinen data-device. Nun ist mir aufgefallen, dass der Status nicht stimmt sobald dieser Switch sich auf einer anderen Unterseite als index.html befindet. die Unterseiten werden durch pagetab referenziert und aufgerufen. Könnte sein dass hier ein Bug versteckt ist? Auf der index.html läuft der Switch problemlos.
Schaue ich mir heute Abend gleich an, am Pagetab bin ich eh gerade dran, um 'activate' und 'warn' Funktionalität einzubauen.
Edit: getestet bei mir ... geht. Hast du auf der sekundären Seite auch keine Skripte eingebunden, wie ich? Also nur:
<html>
<title>FHEM</title>
<head>
</head>
<body>
... und schon wieder eine Frage
Ich habe ein Reading das beliebige Texte enthalten kann und mit einem Label ausgegeben wird.
Ich schaffe es aber nicht, die Farbe des Textes in Abhängigkeit des Textes zu verändern ... also z.B. alle Texte die mit OK beginne in grün, alle die mit Warning beginnen in gelb, usw.
Zitat von: Nobby1805 am 05 Mai 2015, 16:39:49
Ich habe ein Reading das beliebige Texte enthalten kann und mit einem Label ausgegeben wird.
Ich schaffe es aber nicht, die Farbe des Textes in Abhängigkeit des Textes zu verändern ... also z.B. alle Texte die mit OK beginne in grün, alle die mit Warning beginnen in gelb, usw.
Farben sind im Label bisher nur für numerische Werte in Verbindung mit Limits implementiert. Aber die Idee ist gut!
Zitat von: nesges am 04 Mai 2015, 22:42:14
Ah, Missverständnis. Das geht so leider nicht. Du musst dir das Widget als ein(1) Icon vorstellen, bei dem du nur das Bild austauschst. Was aber geht: Zwei Icons und das zweite hat immer die Farbe des Hintergrunds, ausser im Status "PapGes".
Die Idee ist nicht schlecht, "zerreisst" mir aber das ganze Layout. Danke trotzdem für Dein Hirnschmalz und Code-Beispiel!
Ich hab's grad auch mit einem eigenen Icon versucht, auf dem die beiden Symbole (in meinem Fall bag + trashchan_ico) zusammen abgebildet sind. Das wird dann aber leider zu fuzzelig.
Mal als Vorschlag in die Runde:
Was haltet ihr von ganz dezenten CSS-Animations so wie z.B. auf http://tympanus.net/Tutorials/CSS3RotatingWords/index.html (http://tympanus.net/Tutorials/CSS3RotatingWords/index.html) Demo1 oder 2 oder etwas von http://codyhouse.co/demo/animated-headlines/index.html (http://codyhouse.co/demo/animated-headlines/index.html)? In unserem Fall sind es ja quasi nur einzelne "Buchstaben", die animiert werden müssten. Ich bin eigentlich kein großer Freund von zuviel Bewegung auf einer Seite, aber allein um des Layouts Willen, würde ich hier Mal eine Ausnahme machen. Beträfe ja (zunächst) nur diejenigen Stati, die eben 2 Icons benötigen...
Ja, das Rotating ist nicht ganz so verkehrt. 8)
Ich werde mal sehen, ob das einfach einzubauen geht.
Mal ne Frage: kriegt man eigentlich eine readingsHistory auch angezeigt? Da hab ich den Text ja nicht in einem Reading, sondern es wird über einen get-Befehl ausgeliefert.
Ich nehme die readingsHistory her, um diverse (automatisch oder manuell ausgelöste) Vorgänge quasi als high-level-log an die Oberfläche zu bringen.
Aktuell hab ich's so gelöst, dass ich mir den HTML-Text per notify in einen Dummy rüberziehe, und diesen dann in der GUI anzeige - aber vielleicht gibt's ja einen eleganteren Weg, den ich übersehen habe?
PS: NFTUI find ich echt klasse, einfach umzusetzen, sehr aktive Entwicklung, und schaut definitiv besser aus als mein Floorplanversuch - nicht dass man damit nicht auch schöne Sachen hinbringen könnte, wenn man ein Auge dafür hätte... 8)
Anpassung Thermostat.Widget:
Da nun bald, bzw. jetzt so langsam die Heizperiode sich dem ende nähert, habe ich meine Wandthermostate mal in den "off" Modus geschaltet. Im Thermostat.Widget wird mir allerdings nur der Wert 10 Grad angezeigt. Kann man das Widget ggf. so anpassen das auch der Wert OFF angezeigt werden kann?
Für die HomeMatic Komponente muss der Wert
Zitatdesired-temp
auch den Wert "OFF" annehmen können, anstelle von 10 Grad.
Zitat von: bjoernbo am 05 Mai 2015, 18:43:16
Anpassung Thermostat.Widget:
Da nun bald, bzw. jetzt so langsam die Heizperiode sich dem ende nähert, habe ich meine Wandthermostate mal in den "off" Modus geschaltet. Im Thermostat.Widget wird mir allerdings nur der Wert 10 Grad angezeigt. Kann man das Widget ggf. so anpassen das auch der Wert OFF angezeigt werden kann?
Für die HomeMatic Komponente muss der Wert auch den Wert "OFF" annehmen können, anstelle von 10 Grad.
Das muss schon funktionieren, ich habe es bei mir nur noch nicht ausprobiert ...
http://forum.fhem.de/index.php/topic,34233.msg278440/topicseen.html#msg278440 (http://forum.fhem.de/index.php/topic,34233.msg278440/topicseen.html#msg278440)
Danke nesges! Nachdem ich
Zitatdata-min="4" data-off="off" data-max="31" data-boost="boost"
hinzugefügt habe funktioniert das nun einwandfrei!!!
Danke für deine Hilfe!
Funktioniert leider noch nicht, also die 3 verschiedenen Zustände werden übernommen, wenn ich in FHEMWEB den Dummy Schalte, leider wird kein set gesendet, es gibt auch keine Ausgabe in der Konsole wenn tripush betätigt wird.
Zitat von: nesges am 05 Mai 2015, 00:26:28
Ah, um's senden ging's! :) Das hatten wir bisher noch nicht, ich hab aber grade ein wenig experimentiert und habe eine erste, experimentelle(!) Version. Probier mal bitte https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_tripush.js aus.
<div data-type="tripush"
data-device="Auto_Ja_SE"
data-get-on='["AN","AUS_Licht","AUS"]'
data-set-on='["AUS_Licht","AUS","AN"]'
data-set-off="AUS"
data-icons='["fa-square","fa-square","fa-square"]'
data-on-colors='["#aa6900","SeaGreen","IndianRed"]'
class="cell big"
></div>
***EDIT***
Habe nochmals alle Files upgedatet und siehe da es funktioniert! Perfekt KLASSE. Vielen Dank nesges!
@nesges
Hier die leicht korrigierte translation map für PROPLANTA.
Auch die Verwendung der PROPLANTA-Icons funktioniert. Allerdings werden diese immer neu von der Webseite geholt.
Evtl. könnte man noch einstellen, dass diese mit aus dem FHEM-Icon-Path genommen werden.
Da die PROPLANTA-Icons meiner Meinung nach nicht so ganz ins Design passen, wird das neue Feature vermutlich wenig genutzt werden.
Vielen Dank.
Risiko.
Zitat von: Risiko am 05 Mai 2015, 19:53:12
Da die PROPLANTA-Icons meiner Meinung nach nicht so ganz ins Design passen, wird das neue Feature vermutlich wenig genutzt werden.
:-) Ich wollte nix sagen ... aber das Thema hatten wir schon mal und das war auch meine Meinung, damals
http://forum.fhem.de/index.php/topic,34233.msg276750/topicseen.html#msg276750
Zitat
Signalisierung Anrufe in Abwesenheit
<div data-type="symbol" data-device="dummy1"
data-get-on='["0","1"]'
data-icons='["fa-fax","fa-fax warn"]'
data-on-colors='["#555","#666"]'>
</div>
(http://knowthelist.github.io/fhem-tablet-ui/phone_warn.png)
@setstate
Meinst Du man könnte dieses Widget als "Add-on", bzw. Overlay-Widget zu einem symbol, switch oder pagetab widget definieren? Ich fände es cool, wenn man ein z.B. Symbol-Widget wie bestehend (mit readings/settings von device 1) nutzen könnte und im roten Kreis auch Informationen von anderen dummies/ devices (Device 2) anzeigen könnte.
Zitat von: setstate am 05 Mai 2015, 16:10:44
Edit: getestet bei mir ... geht. Hast du auf der sekundären Seite auch keine Skripte eingebunden, wie ich? Also nur:
<html>
<title>FHEM</title>
<head>
</head>
<body>
Nein, habe da Keine Skripte, CSS oder irgendwas eingebunden nur das "reine"
<html>
<title>FHEM</title>
<head>
</head>
<body>
<div class="gridster">
<ul>
<li>
Ich habe doch noch sporadische Fehler im Zusammenhang mit dem Pagetab durch ungünstiges Zeitverhalten gefunden. Es wird dann versucht, auf ein undefined Object zuzugreifen.
Den Fehler kann ich jetzt abfangen, vielleicht löst das auch dein Problem.
Update kommt dann ...
setstate
Das UI wird wirklich immer besser und bietet fast täglich neue Features und Möglichkeiten der Gestaltung. Daher möchte ich als Idee nochmals einen modofizierten Timer bereit stellen. Vor einiger Zeit hatte ich meinen bisherigen Timer ja schon einmal ausführlich präsentiert. Nun habe ich eine kleine Erweiterung und Vereinfachungen vorgenommen, so dass nun im Prinzip ein globaler Timer für die Veränderung von Zeiten eines WeekdayTimers oder eines at-Befehls vorgenommen werden könnten. Ich selbst nutze den Timer aktuell zur Änderung von täglichen Weckzeiten, die mittels WeekdayTimer realisiert wurden.
Bei der Änderung habe ich nun die Auswahl des Tages mittels "select" realisiert und zusätzlich die Optionen "Wochentag", "Wochenende" und "Reset" vorgesehen. Zusätzlich kann man angeben, welche Zeiten man ändern möchte. Hat man zum Beispiel zwei WeekdayTimer für unterschiedliche Funktionen, kann man diese nun definieren und im Timer auswählen.
Beim "Stellen" des Timers wird dann über zwei Dummys und eine Funktion in den 99myutils.pm die Änderung der Timerzeiten umgesetzt.
Nachfolgend nun die ausführliche Darstelllung meiner Lösung (die vom Code her wahrscheinlich noch optimiert werden könnte):
Zunächst ein Dummy für die Speicherung der aktuellen Werte des Timers:
define duWeckerTabUI dummy
attr duWeckerTabUI setList stellen
attr duWeckerTabUI userReadings Minute,Stunde,Tag,Timer
Ich bin mir nicht ganz sicher, aber ich die Readings nochmals einzeln mit Werten angelegt, damit diese auch wirklich angelegt werden. Also z.B.:
setreading duWeckerTabUI Minute 00
Dann nutze ich ein Dummy, in dem pro Wochentag die aktuellen Timer-Zeiten gespeichert werden. Wenn man mehrere WeekdayTimer verwendet, müsste man entweder für jeden Timer ein eigenes Dummy verwenden oder zusätzliche Readings für jeden Timer anlegen:
define Weckzeit dummy
Hier habe ich für jeden Wochentag ein Reading wie folgt erstellt:
setreading Weckzeit zwMontag 09:00
Mein WeekdayTimer sieht wie folgt aus:
define Aufstehen WeekdayTimer gr_Bewohner 0|".ReadingsVal("Weckzeit","wzSonntag","09:00")."|awoken 1|".ReadingsVal("Weckzeit","wzMontag","09:00")."|awoken 2|".ReadingsVal("Weckzeit","wzDienstag","09:00")."|awoken 3|".ReadingsVal("Weckzeit","wzMittwoch","09:00")."|awoken 4|".ReadingsVal("Weckzeit","wzDonnerstag","09:00")."|awoken 5|".ReadingsVal("Weckzeit","wzFreitag","09:00")."|awoken 6|".ReadingsVal("Weckzeit","wzSamstag","09:00")."|awoken (ReadingsVal("Urlaub_dummy","state","ja") eq "nein")
Mittels notify wird nun beim Klick auf den "Stellen" Button die Funktion "WeckzeitStellen()" in den 99myutils aufgerufen:
define notWeckerStellen notify duWeckerTabUI:stellen {WeckerStellen()}
Die Funktion sieht wie folgt aus:
sub WeckerStellen()
{
my $timer = ReadingsVal("duWeckerTabUI", "Timer", "Aufstehen");
my $Tag = ReadingsVal("duWeckerTabUI","Tag","Reset");
my $Zeit = sprintf("%02d",ReadingsVal("duWeckerTabUI","Stunde","09")).":".sprintf("%02d",ReadingsVal("duWeckerTabUI","Minute","00"));
if($Tag eq "Wochentag")
{
fhem("setreading Weckzeit wzMontag ".$Zeit);
fhem("setreading Weckzeit wzDienstag ".$Zeit);
fhem("setreading Weckzeit wzMittwoch ".$Zeit);
fhem("setreading Weckzeit wzDonnerstag ".$Zeit);
fhem("setreading Weckzeit wzFreitag ".$Zeit);
}
elsif ($Tag eq "Wochenende")
{
fhem("setreading Weckzeit wzSamstag ".$Zeit);
fhem("setreading Weckzeit wzSonntag ".$Zeit);
}
elsif ($Tag eq "Reset")
{
if($timer eq "Aufstehen")
{
fhem("setreading Weckzeit wzMontag 08:00");
fhem("setreading Weckzeit wzDienstag 08:00");
fhem("setreading Weckzeit wzMittwoch 08:00");
fhem("setreading Weckzeit wzDonnerstag 08:00");
fhem("setreading Weckzeit wzFreitag 08:00");
fhem("setreading Weckzeit wzSamstag 09:00");
fhem("setreading Weckzeit wzSonntag 09:00");
}
elsif($timer eq "?")
{
# fhem('modify WeekdayTimer oder at');
}
}
else
{
fhem("setreading Weckzeit wz".ReadingsVal("duWeckerTabUI","Tag","Montag")." ".$Zeit);
}
fhem("save config");
if($timer eq "Aufstehen")
{
fhem("modify Aufstehen gr_Bewohner 0|".ReadingsVal("Weckzeit","wzSonntag","09:00")."|awoken 1|".ReadingsVal("Weckzeit","wzMontag","09:00")."|awoken 2|".ReadingsVal("Weckzeit","wzDienstag","09:00")."|awoken 3|".ReadingsVal("Weckzeit","wzMittwoch","09:00")."|awoken 4|".ReadingsVal("Weckzeit","wzDonnerstag","09:00")."|awoken 5|".ReadingsVal("Weckzeit","wzFreitag","09:00")."|awoken 6|".ReadingsVal("Weckzeit","wzSamstag","09:00").'|awoken (ReadingsVal("Urlaub_dummy","state","ja") eq "nein")');
}
elsif($timer eq "?")
{
# fhem('modify WeekdayTimer oder at');
}
}
Nun kommt noch der Code aus der index.html. Dieser zeigt einmal die Umsetzung des Weckers und dann noch eine einfache Darstellung der aktuellen Weckzeiten:
<li data-row="1" data-col="2" data-sizex="3" data-sizey="3">
<header>Weckzeit stellen</header>
<div data-type="select" data-device="duWeckerTabUI" data-get="Tag" data-set="Tag" data-cmd="setreading"
data-items='["Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag","Sonntag","Wochenende","Wochentag","Reset"]'
class="w3x wider">
</div>
<div class="container">
<div class="container inline right-space">
<div data-type="volume" data-device="duWeckerTabUI" data-get="Stunde" data-set="Stunde" data-cmd="setreading" data-min="0" data-max="24"></div>
<div data-type="label" class="big" style="margin-top:-15px">Stunde</div>
</div>
<div class="container inline">
<div data-type="volume" data-device="duWeckerTabUI" data-get="Minute" data-set="Minute" data-cmd="setreading" data-min="0" data-max="60"></div>
<div data-type="label" class="big" style="margin-top:-15px">Minute</div>
</div>
</div>
<div data-type="select" data-device="duWeckerTabUI" data-get="Timer" data-set="Timer" data-cmd="setreading"
data-items='["Aufstehen","Rolladen hoch","Rolladen runter"]'
class="w3x wider">
</div></br>
<div data-type="push" data-device="duWeckerTabUI" data-cmd="set" data-set="stellen" class="cell"></div>
<div data-type="label" class="big">Stellen</div>
</li>
<li data-row="1" data-col="4" data-sizex="2" data-sizey="2">
<header>Aktuelle Weckzeiten</header>
<table width="100%">
<tr>
<td class="big right">Montag</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzMontag" class="big"></div>
</td>
</tr>
<tr>
<td class="big right">Dienstag</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzDienstag" class="big"></div>
</td>
</tr>
<tr>
<td class="big right">Mittwoch</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzMittwoch" class="big"></div>
</td>
</tr>
<tr>
<td class="big right">Donnerstag</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzDonnerstag" class="big"></div>
</td>
</tr>
<tr>
<td class="big right">Freitag</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzFreitag" class="big"></div>
</td>
</tr>
<tr>
<td class="big right">Samstag</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzSamstag" class="big"></div>
</td>
</tr>
<tr>
<td class="big right">Sonntag</td>
<td>
<div data-type="label" data-device="Weckzeit" data-get="wzSonntag" class="big"></div>
</td>
</tr>
</table>
</li>
Ich hoffe, dass es einigermaßen verständlich war und würde mich freuen, wenn ihr damit etwas anfangen könnt.
Zitat von: tomster am 01 Mai 2015, 01:17:12
Ich hab mich nicht danach fragen getraut, aber genau DAS hab ich gesucht. Meine Gehversuche waren mehr als bescheiden bislang.
VIELEN Dank!
--edit--
das jetzt noch in einem "pagetab"...
--/edit--
Und da ist es:
Update Pagetab Widget Items können jetzt auch 'warn' und zusätzlich 'activate' verstehen.
<div data-type="pagetab" data-device="myDoorBell"
data-get-on='["0","(?:[1-9][0-9]*)","on"]'
data-icons='["fa-fax","fa-fax warn","fa-fax warn activate"]'
data-url="index_door.html" class="cell"></div>
</div>
Damit könnte man zum Beispiel innerhalb einer Menü-Tab-Leiste die Anzahl des Tür-Klingeln anzeigen (warn) und bei einem bestimmten Reading Wert, automatisch auf die entsprechende Seite umschalten (activate).
(http://knowthelist.github.io/fhem-tablet-ui/phone_warn.png)
Du bist schlichtweg Wahnsinn!
Zitat von: nesges am 05 Mai 2015, 16:48:10
Farben sind im Label bisher nur für numerische Werte in Verbindung mit Limits implementiert. Aber die Idee ist gut!
Und ging auch leicht zu erweitern: Man kann jetzt auch mit RegEx Farben zuweisen (neben den bekannten numerischen größer-gleich Limits)
<div data-type="label" data-device="AgroWeather" data-get="fc0_weatherDay"
data-limits='[".*be.*"]' data-colors='["#6699FF"]'
class="cell narrow"></div>
Blödes Beispiel, aber war nur für Testzwecke. Wenn das Reading 'be' enthält, wird der Text blau.
Update: New Widget Level
Ich habe den Slider etwas verbogen und als neues Widget angelegt, damit man schön Levels (Füllstände o.ä.) anzeigen lassen kann
<div class="cell">
<div data-type="level" data-device='Tablet' data-get='powerLevel'
class="horizontal left" >
</div>
<div data-type="label" data-device='Tablet'
data-get='powerLevel'
data-unit="%" class="top-space left"></div>
</div>
Geht auch mit dem vom Label Widget bekannten data-limits, um die Farbe zu beeinflussen
<li data-row="5" data-col="3" data-sizex="2" data-sizey="1">
<header>LEVEL</header>
<div class="cell">
<div data-type="level" data-device='Tablet' data-get='powerLevel'
data-limits='["[12]*[0-9]","[3456][0-9]","([789][0-9]|100)"]'
data-colors='["#dd3366","#ffcc00","#55aa44"]'
class="horizontal left" >
</div>
<div data-type="label" data-device='Tablet'
data-get='powerLevel'
data-unit="%" class="top-space left"></div>
</div>
<div class="cell">
<div data-type="level" data-device='dummy1'
data-limits='["20","70","95"]'
data-colors='["#dd3366","#ffcc00","#55aa44"]'
class="horizontal left" >
</div>
<div data-type="label" data-device='dummy1' data-unit="%" class="top-space left"></div>
</div>
</li>
Guten Morgen,
Ich habe Probleme mit der Dimmer Class. Und zwar kann ich das Gerät dahinter (Homematic Unterputz Dimmer) auf einem Tablet nicht ein oder aus schalten. Ich kann zwar dimmen aber nicht on off setzen. Am PC geht das. Beides Chrome Browser.
Gerade fällt mir ein das ein Unterschied sein könnte das ich am PC über den Web Port gehe und am Tablet über den WebTablet Port. Kann das der Grund sein?
Grüße
Leon
Hallo CoolTux,
grundsätzlich sollte das gehen, ich kenne keine Probleme beim Dimmer.
Du kannst versuchen, die Ursache einzugrenzen.
Was passiert, wenn du am Tablet den anderen Port probierst?
Wird beim Toggeln am Dimmer Switch eine Toast Message angezeigt, wie bei den anderen Switches?
Was steht auf der Toast Message, kann FHEM mit dem Befehl was anfangen?
Viele Grüße
setstate
Hallo Setstate
Vielen Dank für die Antwort. Ich werde mir das ganze heute Abend mal in Ruhe anschauen und testen. Gebe dann Feedback.
Gruß
[quote author=setstate link=topic=34233.msg292258#msg292258 date=1430858253]
...und bei einem bestimmten Reading Wert, automatisch auf die entsprechende Seite umschalten (activate).
(http://knowthelist.github.io/fhem-tablet-ui/phone_warn.png)
[/quote]
Könnte man auch prima zum Umschalten auf die Kameraseite hernehmen, wenn jemand klingelt. Allerdings wäre wohl auch da ein Parameter wie data-activate-url oder vielleicht sogar zusätzlich data-activate-target (parent, popup) nicht verkehrt, oder? Mit "popup" könnte man dann quasi-Toast-Messages generieren, um beispielsweise das Kamerabild nur für 30 Sekunden einzublenden. Nur so als Idee...
Hallo tomster, 'activate' gibt es nur für pagetab und dort ist ja die URL dabei, auf die umgeschaltet werden soll.
Die Idee mit der Toast Message hatte ich auch schon mal, aber garnicht mehr im Fokus. Danke fürs Erinnern. Das versuche ich noch einzubauen. Schön ist auch, dass man die Messages auch farbig machen kann und permanent (man muss sie wegklicken)
Hui, 'tschulligung. Hab vor lauter Euphorie total vergessen, dass es ja "nur" pagetabs sind.
Ich hatte das Feature gedanklich schon bei einem Symbol-Widget umgesetzt...
Nur mal eben so zwischendurch,
Danke an Setstate und Nesges und alle die sich daran fleißig beteiligen und sich super viel Mühe geben. Ist wirklich ein super UI!!
LG Marie
Zitat von: Risiko am 05 Mai 2015, 19:53:12
Hier die leicht korrigierte translation map für PROPLANTA.
Danke! Die Version wird demnächst auch im Hauptrepository erscheinen.
ZitatAuch die Verwendung der PROPLANTA-Icons funktioniert. Allerdings werden diese immer neu von der Webseite geholt.
Evtl. könnte man noch einstellen, dass diese mit aus dem FHEM-Icon-Path genommen werden.
mW werden diese Icons nicht mit Fhem ausgeliefert, d.h. man müsste sie selbst runterladen und den Pfad konfigurierbar machen. Kein ganz uninteressantes Feature, allerdings wäre mir eine generische Lösung für eigene Imagesets lieber. Irgendwas mit einer Translation-Table in einer imageset.json im Verzeichnis, oder so. Muss da mal drüber nachdenken.
ZitatDa die PROPLANTA-Icons meiner Meinung nach nicht so ganz ins Design passen, wird das neue Feature vermutlich wenig genutzt werden.
Dem schliess ich mich an! ;)
Zitat von: Doggiebert am 05 Mai 2015, 18:21:48
Mal ne Frage: kriegt man eigentlich eine readingsHistory auch angezeigt? Da hab ich den Text ja nicht in einem Reading, sondern es wird über einen get-Befehl ausgeliefert.
Ich nehme die readingsHistory her, um diverse (automatisch oder manuell ausgelöste) Vorgänge quasi als high-level-log an die Oberfläche zu bringen.
Aktuell hab ich's so gelöst, dass ich mir den HTML-Text per notify in einen Dummy rüberziehe, und diesen dann in der GUI anzeige - aber vielleicht gibt's ja einen eleganteren Weg, den ich übersehen habe?
Derzeit ist es in FTUI nur möglich Readings auszuwerten; ein "get" nachzuschieben wäre denkbar aber es dürfte mMn nicht auf ein permanentes Pollen solcher gets hinaus laufen, da das einen intransparenten Unterschied in der Behandlung verschiedener Werte verursachen würde. Von daher würde ich auch deine Lösung per notify bevorzugen. Ein Ziel von FTUI ist ja simpel zu sein :)
Zitat von: nesges am 06 Mai 2015, 10:56:31
Derzeit ist es in FTUI nur möglich Readings auszuwerten; ein "get" nachzuschieben wäre denkbar aber es dürfte mMn nicht auf ein permanentes Pollen solcher gets hinaus laufen, da das einen intransparenten Unterschied in der Behandlung verschiedener Werte verursachen würde. Von daher würde ich auch deine Lösung per notify bevorzugen. Ein Ziel von FTUI ist ja simpel zu sein :)
hmja, korrekt - der bessere Weg wäre sicherlich, der readingsHistory ein entsprechendes (optionales) Reading zu spendieren, vielleicht rege ich da mal einen Change Request an. Nicht dringend, es funktioniert ja wunderbar mit meinem jetzigen Konstrukt...
Zitat von: setstate am 06 Mai 2015, 02:18:54
Und ging auch leicht zu erweitern: Man kann jetzt auch mit RegEx Farben zuweisen (neben den bekannten numerischen größer-gleich Limits)
<div data-type="label" data-device="AgroWeather" data-get="fc0_weatherDay"
data-limits='[".*be.*"]' data-colors='["#6699FF"]'
class="cell narrow"></div>
Blödes Beispiel, aber war nur für Testzwecke. Wenn das Reading 'be' enthält, wird der Text blau.
Wunderbar, Danke !
Hast du dir auch http://forum.fhem.de/index.php/topic,34233.msg292037.html#msg292037 schon mal angesehen ?
Zitat von: setstate am 06 Mai 2015, 07:36:03
Hallo CoolTux,
grundsätzlich sollte das gehen, ich kenne keine Probleme beim Dimmer.
Du kannst versuchen, die Ursache einzugrenzen.
Was passiert, wenn du am Tablet den anderen Port probierst?
Wird beim Toggeln am Dimmer Switch eine Toast Message angezeigt, wie bei den anderen Switches?
Was steht auf der Toast Message, kann FHEM mit dem Befehl was anfangen?
Viele Grüße
setstate
Ich kenne das Problem...ist bei mir auch vorhanden.
Mit Chrome unter Android 5.x (Nexus 10 und Samsung G5) geht der "Dimmer" nicht. Bei mir läuft der "Dimmer" unter Android 5.x mit Firefox und UC Browser.
Mit Android 4.4 funktioniert der Dimmer mit Chrome noch einwandfrei.
ZitatGerade fällt mir ein das ein Unterschied sein könnte das ich am PC über den Web Port gehe und am Tablet über den WebTablet Port. Kann das der Grund sein?
Sollte also nicht das Problem sein.
Gruß,
Haecksler
Irgendwie hat mich diese Animations-Geschichte nicht mehr so recht losgelassen - wider meinem eigentlich eher schlichten Naturell ;-)
Beim Stöbern bin ich dann auf einen sog. Shake-CSS-Code http://elrumordelaluz.github.io/csshake/ (http://elrumordelaluz.github.io/csshake/) gestossen.
Beim Anschauen dachte ich mir, hmm, dieses shake-little wäre eine witzige Animation für den Status "Waschmaschine läuft".
Also hab ich's Mal quick'n'dirty eingebaut. Ist also mit ohne Schönheitspreis für besondere Cleverness.
Wenn's jemand ausprobieren will:
Das CSS aus obigem Link in den richtigen Pfad kopieren und innerhalb des HTML-heads der UI-Seite entsprechend verlinken ->
<link rel="stylesheet" href="/fhem/tablet/css/csshake.css" />
Dann z.B. folgenden Code in dem HTML-body eintragen:
<div data-type="label" class="">Wäsche</div>
<div data-type="symbol"
data-icons='["oa-scene_washing_machine","oa-scene_washing_machine shake shake-constant shake-little","oa-scene_washing_machine"]'
data-on-colors='["#505050","#FFFF00","#1cc742"]'
data-device="Waschmaschine"
data-get-on='["off","running","finished"]'
class="narrow small">
</div>
Wenn ihr jetzt in FHEM noch einen dummy Waschmaschine definiert, dann könnt ihr mit den entsprechenden set-Befehlen (off,running,finished) ausprobieren, wie sich die Rattle'n'Shake-Animation bei der Waschmaschine macht. Ich find's eigentlich ganz passend, weil's recht dezent ist...
Auf dem angehängten Video kommt's nicht so gut rüber, aber gibt wenigstens einen kleinen Eindruck davon.
Hallo Tomster, sieht echt lustig aus, das Beispiel auf der github Projektseite. :D
Und wenn es dann noch so easy einzubinden geht ... Daumen hoch!
Moin Moin,
hab da ein kleines Anzeige Problem.
Lese Temperatur über 1-Wire DS18B20 aus, was auch super klappt.
Nun mein Problem:
Es wird abwechselnd z.B. 22.234 °C bzw. 22.2 °C schön wäre es wenn es bei 22.2 °C bleiben würde.
Im Normalen Fhem hat ich das mit att stateFormat {sprintf "%.1f °C", ReadingsVal($name, "temperature", 0)} hinbekommen, wie bekomme ich das im Tablet UI hin?
MFG MJoomla
Zitat von: mjoomla am 06 Mai 2015, 14:55:32
Moin Moin,
hab da ein kleines Anzeige Problem.
Lese Temperatur über 1-Wire DS18B20 aus, was auch super klappt.
Nun mein Problem:
Es wird abwechselnd z.B. 22.234 °C bzw. 22.2 °C schön wäre es wenn es bei 22.2 °C bleiben würde.
Im Normalen Fhem hat ich das mit att stateFormat {sprintf "%.1f °C", ReadingsVal($name, "temperature", 0)} hinbekommen, wie bekomme ich das im Tablet UI hin?
MFG MJoomla
Man kann mit data-fix="1" beim Label Widget auf eine Nachkommastelle begrenzen.
Zitat von: setstate am 05 Mai 2015, 21:59:01
Ich habe doch noch sporadische Fehler im Zusammenhang mit dem Pagetab durch ungünstiges Zeitverhalten gefunden. Es wird dann versucht, auf ein undefined Object zuzugreifen.
Den Fehler kann ich jetzt abfangen, vielleicht löst das auch dein Problem.
Update kommt dann ...
setstate
Nach einigen Tests hat es scheinbar wirklich mein Problem gelöst! Danke setstate.
Dafür habe ich aber ein neues Problem. :)
Kann das sein, dass ein Timestamp der über die Klasse timestamp angezeigt wird nicht automatisch aktuallisiert wird, nur beim reload der Seite?
Zitat von: Nobby1805 am 05 Mai 2015, 09:43:26
Nachdem ich jetzt seit ein paar Tagen mit dem Thermostat-Widget rumspiele hätte ich einen Erweiterungswunsch ... falls das schon irgendwie klappt und ich es nur nicht gefunden habe, bitte ich um einen kurzen Hinweis ;)
Es wäre schön :), wenn man minColor und maxColor beim Aufruf des Widgets angeben könnte. Ich habe das bei mir schon geändert, aber es wäre besser wenn dies eine Erweiterung im Standard ist 'minColor': $(this).data('mincolor') || getStyle('.thermostat.mincolor','color') ||'#4477ff',
'maxColor': $(this).data('maxcolor') || getStyle('.thermostat.maxcolor','color') ||'#ff0000',
Noch schöner :) :) wäre es, wenn man mehrere Bereiche für den Farbverlauf angeben könnte. Z.B. min-17 = kalt = blau-blaugrün, 17-23 = wohlfühl = blaugrün-gelbgrün, 23-max = zu warm = gelbgrün bis rot
Hallo Nobby1805,
deine Änderung habe ich so übernommen, kommt beim nächsten Update mit.
Das andere ist etwas schwieriger und ohne viel Aufwand gibt es da keine einfache Lösung. Was ich anbieten könnte, wäre aus dem HUE Farbraum einen Bereich angeben zu können.
http://de.wikipedia.org/wiki/HSV-Farbraum#/media/File:HueScale.svg (http://de.wikipedia.org/wiki/HSV-Farbraum#/media/File:HueScale.svg)
Also z.B. von 0-240
Das hätten wir auf Tasche ... 8)
Zitat von: Haecksler am 06 Mai 2015, 13:47:15
Ich kenne das Problem...ist bei mir auch vorhanden.
Mit Chrome unter Android 5.x (Nexus 10 und Samsung G5) geht der "Dimmer" nicht. Bei mir läuft der "Dimmer" unter Android 5.x mit Firefox und UC Browser.
Mit Android 4.4 funktioniert der Dimmer mit Chrome noch einwandfrei.
Sollte also nicht das Problem sein.
Gruß,
Haecksler
Ich danke Dir für die Info. Und ich dachte schon ich bin zu blöd dafür. Man man. Ist aber schon sehr ärgerlich. Da der Chrom so schön im Fullscreen läuft.
Hab ich was überlesen, oder warum gibt's eigentlich beim Thermostat-Widget im Bezug auf die Größe nur die class "big"?
Zitat von: setstate
Was ich anbieten könnte, wäre aus dem HUE Farbraum einen Bereich angeben zu können.
http://de.wikipedia.org/wiki/HSV-Farbraum#/media/File:HueScale.svg (http://de.wikipedia.org/wiki/HSV-Farbraum#/media/File:HueScale.svg)
Also z.B. von 0-240
wenn es von 240 zu 0 ginge käme das meiner Anforderung schon sehr nahe ... ist das machbar ? Wie rufe ich das auf ?
Hallo zusammen,
nachdem ich nun etwas herumprobiert habe, bin ich auf ein paar probleme gestossen.
1. Bei meinen MAX! Thermostatventilen kann ich die Temperatur verstellen aber dann befinden sich diese in mode manual!! Wie stelle ich es an das die Temperatur verstellt wird, aber der Thermostat wieder auf mode auto stellt?
<div data-type="thermostat" data-device="HZ_GWC" data-valve="valveposition" data-get="desiredTemperature" data-temp="temperature" data-set="desiredTemperature" class="cell left"></div>
2. Meine MAX! Fensterkontakte bekomme ich nicht eingebunden.
<div data-type="contact" data-device="Fenster_GWC" data-devicetype="MAX" data-get-on='["offen","geschlossen","opened","closed"]' class="smal"></div>
<div data-type="label" class="narrow darker small">GWC</div>
Kann mir da jemand weiterhelfen?
Gruß
Ralf
Hi, habe auch Max
Mit dem Manual Mode kann ich bestätigen, die Contacte habe ich so eingebunden und es funktioniert
<div data-type="symbol" data-device="MAX_04ee5b" data-get-on="opened" class="narrow"></div>
<div data-type="label" class="narrow darker small">SZ Hofseite</div>
Zitat von: mjoomla am 06 Mai 2015, 14:55:32
Moin Moin,
hab da ein kleines Anzeige Problem.
Lese Temperatur über 1-Wire DS18B20 aus, was auch super klappt.
Nun mein Problem:
Es wird abwechselnd z.B. 22.234 °C bzw. 22.2 °C schön wäre es wenn es bei 22.2 °C bleiben würde.
Im Normalen Fhem hat ich das mit att stateFormat {sprintf "%.1f °C", ReadingsVal($name, "temperature", 0)} hinbekommen, wie bekomme ich das im Tablet UI hin?
MFG MJoomla
@setstate Danke, klappt bestens.
MFG MJoomla
Zitat von: Nobby1805 am 06 Mai 2015, 21:37:55
wenn es von 240 zu 0 ginge käme das meiner Anforderung schon sehr nahe ... ist das machbar ? Wie rufe ich das auf ?
Nicht out of the box, aber zum Reinschnuppern kannst du folgenden Ändern:
widget_thermostat.js:
Zeile 93-95
var j=((this.endAngle-tick)/this.angleArc)*240;
c.strokeStyle = 'hsl('+ j +',50%,50% )';
//c.strokeStyle = _thermostat.getGradientColor(maxcolor, mincolor, (this.endAngle-tick)/this.angleArc);
Zeile 137-139
var j = (this.endAngle-a.e)/(this.endAngle-this.startAngle)*240;
c.strokeStyle = 'hsl('+ j +',50%,50% )';
//c.strokeStyle = _thermostat.getGradientColor(maxcolor, mincolor, (this.endAngle-a.e)/(this.endAngle-this.startAngle));Ist etwas sehr grün. Blau und rot erst ziemlich am Ende. Wäre noch einiges an Nacharbeit nötig.
Hallo hyper2910
vielen Dank für die Hilfe und den Denkanstoss!
Ich konnte es nun so lösen:
<div data-type="symbol" data-device="Fenster_GWC" data-get-on="offen" data-get-off="geschlossen" class="narrow"></div>
<div data-type="label" class="narrow darker small">GWC</div>
Gruß
Ralf
Theoretisch könnte man folgendes machen, um die Auto Funktion zu erhalten
#Dummy für die Schnell-Einstellung der Temperatur bis zum nächsten automatischen Schaltzeitpunkt
define HeizkoerperBad dummy
attr HeizkoerperBad room MAX,Heizungen
attr HeizkoerperBad setList state:eco,auto,14.0,16.0,17.0,18.0,19.0,20.0,21.0,22.0,23.0
attr HeizkoerperBad webCmd state
define HeizkoerperBad.ntfy notify HeizkoerperBad.* {\
my $valtemp = "%";;\
my $device = "MAX_04711";;\
my $cmd = 'set '.$device.' desiredTemperature auto '.$valtemp;;\
fhem($cmd);;\
}
Und dann den Dummy schalten! Vielleicht hilft dir das!
Zitat von: Haecksler am 05 Mai 2015, 19:47:56
Habe nochmals alle Files upgedatet und siehe da es funktioniert! Perfekt KLASSE. Vielen Dank nesges!
Danke für's testen! Ich hab das Widget noch etwas weiter entwickelt, bzw. die Defaults grade gezogen und Attribute für den Zweck sinnvoller benannt. Ausserdem heisst's jetzt ganz neutral "multistatebutton".
Download unter: https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_multistatebutton.js
Doku unter: https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/multistatebutton
<div data-type="multistatebutton"
data-device="TEST"
data-get-on='["on","off","unknown","uninteresting"]'
data-icons='["fa-bolt", "fa-power-off", "fa-question", "fa-ban"]'
data-colors='["green", "red", "orange", "blue"]'
data-background-colors='["red", "green", "blue", "orange"]'
></div>(background-colors funktioniert erst nach einem FTUI-Update)
Zitat von: pnewman am 06 Mai 2015, 21:59:42
1. Bei meinen MAX! Thermostatventilen kann ich die Temperatur verstellen aber dann befinden sich diese in mode manual!! Wie stelle ich es an das die Temperatur verstellt wird, aber der Thermostat wieder auf mode auto stellt?
Dafür muss nur "desiredTemperature auto <Wert>" gesendet werden, oder? Das wäre so zu lösen:
<div data-type="thermostat"
data-get="desiredTemperature"
data-set="desiredTemperature auto"
data-temp="temperature"
data-off="off"
data-boost="boost"
data-min="5"
data-max="30"
data-device="W_HEIZUNG"
class="cell"></div>
Zitat von: tomster am 06 Mai 2015, 21:16:21
Hab ich was überlesen, oder warum gibt's eigentlich beim Thermostat-Widget im Bezug auf die Größe nur die class "big"?
Beim Thermostat ist 'small' das Normal, 'big' kann man optional setzen.
Wir müssten das Widget aber noch 'modernisieren' (von Knob ableiten, wie das Volume Widget), dann würde es mehr geben und sogar height/width direkt einstellbar sein.
Zitat von: setstate am 06 Mai 2015, 22:24:07
Ist etwas sehr grün. Blau und rot erst ziemlich am Ende. Wäre noch einiges an Nacharbeit nötig.
aber kommt dem, was ich suche, schon sehr nahe und sieht auch schön aus ... jetzt muss es nur noch als Wahl-Option integriert werden ;) aber das ist nicht so eilig, ich hab' ja was, auf das ich mich freuen kann
Vielen Dank nesges,
das hatte ich nicht probiert, im nachhinein ist deine Lösung logisch!
Es funktioniert einwandfrei, wie ich es mir gewünscht habe!
So sieht es dann bei mir aus:
<div data-type="thermostat" data-get="desiredTemperature" data-set="desiredTemperature auto" data-temp="temperature" data-off="off" data-boost="boost" data-min="5" data-max="30" data-device="T_Wohn" class="cell"></div>
Jetzt kann ich mich an die nächsten Seiten begeben und dann an die Schaltflächen für die einzelnen Räume.
Aber auch dafür gab es hier schon, ich glaube auf Seite 44 von bjoernbo, eine Lösung.
Nochmals vielen Dank an alle.
Gruß
Ralf
Hallo,
ich würde das UI auch gern mal testen, aber ich weiß nicht wie ich es zum laufen bekomme.
JQuery ist installiert, aber Gridster, Awesome und Toast kapier ich nicht wie ich das installieren soll. :o
Habe Ubuntu mit Apache2 installiert.
Zitat von: Grimm80 am 08 Mai 2015, 10:52:25
ich würde das UI auch gern mal testen, aber ich weiß nicht wie ich es zum laufen bekomme.
JQuery ist installiert, aber Gridster, Awesome und Toast kapier ich nicht wie ich das installieren soll. :o
Habe Ubuntu mit Apache2 installiert.
Brauchst du alles nicht :) Im ersten Post unter "Installation" stehen die zwei notwendigen Schritte. Danach muss du "nur" noch die HTML-Dateien anpassen. Der erste Post verweist auch auf https://github.com/knowthelist/fhem-tablet-ui - dort findest du die Doku zu den weiteren Anpassungen.
ich habe die Dateien in /opt/fhem/www/tablet kopiert, aber ich bekomme nur ein weisses Bild.
Zitat von: Grimm80 am 08 Mai 2015, 11:01:47
ich habe die Dateien in /opt/fhem/www/tablet kopiert, aber ich bekomme nur ein weisses Bild.
Bitte lies dir den ersten Post einmal komplett durch und installiere wie dort angegeben per Fhem-Update.
Hallo!
Ich bin gerade dabei das für ein Tablet zu konfigurieren. Das geht wirklich flüssig von der Hand und macht richtig Spaß weil man auch schnell zu Ergebnissen kommt.
Ich habe einige Milight-RGB-Birnen im Einsatz und suche dafür eine Möglichkeit, den RGB-Wert oder HSV-Wert zu setzen. Hat sich da schon jemand was gebaut? Dimmen über einen Slider geht ganz einfach, mir fehlt nur so ein Color-Wheel um eine schöne Farbe setzen zu können.
Kann man einen Slider auch klickbar machen, im Moment muss man immer das Knöpfchen schieben/ziehen.
Zitat von: Bapt. Reverend Magersuppe am 08 Mai 2015, 11:12:32
Ich habe einige Milight-RGB-Birnen im Einsatz und suche dafür eine Möglichkeit, den RGB-Wert oder HSV-Wert zu setzen. Hat sich da schon jemand was gebaut? Dimmen über einen Slider geht ganz einfach, mir fehlt nur so ein Color-Wheel um eine schöne Farbe setzen zu können.
Schau dir mal Demo: wohnzimmer-milight.php (http://fhem.nesg.es/demo/room/wohnzimmer-milight.php) an - meinst du so ein Control? Der Quellcode dafür liegt unter wohnzimmer-milight.html (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/html/room/wohnzimmer-milight.html) / wohnzimmer-milight.php (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/php/room/wohnzimmer-milight.php)
ZitatKann man einen Slider auch klickbar machen, im Moment muss man immer das Knöpfchen schieben/ziehen.
Das hätte ich auch gern :)
Zitat von: nesges am 08 Mai 2015, 11:20:01
Schau dir mal Demo: wohnzimmer-milight.php (http://fhem.nesg.es/demo/room/wohnzimmer-milight.php) an - meinst du so ein Control? Der Quellcode dafür liegt unter wohnzimmer-milight.html (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/html/room/wohnzimmer-milight.html) / wohnzimmer-milight.php (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/php/room/wohnzimmer-milight.php)
Das hätte ich auch gern :)
Das sieht schon ganz gut aus! Danke sehr.
Hier muss man dann wohl doch mit php arbeiten, schöner wäre es ja, direkt ein RGB-Setting per jquery oder so zu erzeugen:
https://jweir.github.io/colorwheel/
Zitat von: Bapt. Reverend Magersuppe am 08 Mai 2015, 11:53:02
Hier muss man dann wohl doch mit php arbeiten
Nö, du brauchst nur die Volume-Widgets aus dem HTML zu übernehmen (Zeile 229ff). Der Link zum PHP zeigt nur, wie's HTML erzeugt wird, das muss man aber so nicht machen. Mehr dazu unter http://forum.fhem.de/index.php/topic,36063.0.html
Ahaaaa! Vielen Dank!
Das ging erst gar nicht weil ich das falsche Milight-Modul verwendet hatte.
Zitat von: setstate
Ich habe ein ähnliches Phänomen. Das FHEM Tabel UI zeigt auf meinem iPhone (iOS 8.3) bei jedem Refresh ein anderes Aussehen. Vermutlich wird das CSS File nicht vollständig geladen, jedesmal fehlt etwas anderes. Die selbe Seite auf dem iPad, Android, MacBook zeigt keinerlei Probleme. Ich vermute ein TimeOut Problem beim HTTPSRV. Ich bin noch am Forschen ...
Die gleiche Seite auf einem anderen Webserver auf dem gleichen NAS, wo FHEM läuft, gehostet, zeigt auf dem iPhone auch kein Fehler. Es muss daran liegen, wie FHEM HTTPSRV die Seite überträgt.
Leider kann ich kein Safari 6 oder höher installieren, damit man mit den Entwickler-Tools die Fehler vom iOS Safari debuggen kann.
Kann das mal jemand probieren?
--edit--
siehe unten
--edit--
Ich hab Mal an dieser Thematik ein bisschen herumgespielt, weil mir vorhin bei einem anderen Problem der sog. "App-Cache" unter das Keyboard gekommen ist.
Hierbei werden Teile einer Webseite nach dem erstmaligen Aufruf nicht mehr vom Server geladen, sondern aus dem Cache des entsprechenden Tablets (Offline-Cache); in meinem Fall ein ausgeliehenes iPad.
Seht es mir nach, wenn man den App-Cache anders benutzt oder es vielleicht auch eleganter lösen kann, aber ich hab den Herrn App-Cache eben erst kennengelernt ;-)
In meinem Fall aber scheint es zu funktionieren.
Selbst bei 15-20 Refreshs hat ich kein einziges Mal einen CSS-Glitch!
Was habe ich gemacht?
Zunächst im Home-Verzeichnis des UI eine Datei Namens "ui.appcache" angelegt (/opt/fhem/www/tablet/ui.appcache).
Dies hat folgenden Inhalt:
CACHE MANIFEST
# 2015-05-08 14:03:43
CACHE:
css/fhem-tablet-ui.css
NETWORK:
*
http://*
https://*
Dann nur noch die index.html editieren und (ganz oben) aus
<!DOCTYPE html>
<html>
<head>
im Handumdrehen
<!DOCTYPE html>
<html manifest="ui.appcache">
<head>
gemacht.
Ich bitte Euch zu testen, ob das bei Euch die CSS-Glitches beseitigt und/oder auf anderen Devices (Android, Opera, Chrome, etc.) zu unerwünschtem Verhalten führt.
Natürlich bin ich auch ausdrücklich froh über Rückmeldung von Leuten, die sich mit der Materie wirklich auskennen!
---edit---
Mist, ein kleines Problem entsteht wohl. Beim Aufruf der Startseite werden - zumindest bei mir - die Stati der Thermostat-Widgets nicht sofort aktualisiert. Liegt wohl daran, dass die Seite aus dem Cache kommt und einfach "alte" Stati anzeigt. Muss mich wohl doch noch ein bisschen mehr in die Thematik einlesen... Am PC/ Firefox geht's aber problemlos mit den Einstellungen. Komisch.
Ich kann mir aber vorstellen, dass es durchaus Sinn machen könnte einige Code-Scripts tatsächlich in den Offline-Cache zu packen...
Hallo,
ich hoffe ich habe nichts überlesen. Im Beitrag #1330 von setstate ging es darum, auf einem "Telefonsymbol" entsprechend eine Ziffer anzuzeigen. 20 anrufe in Abwesenheit o.ä.. Ich will stelle mir gerade die Frage, wie man dieses Zusatzinfo einblenden kann.
Ich ziehe mir momentan über die Unwetterzentrale die entsprechenden Unwetterwarnungen. In der Reading-Group gibt es dazu einen entsprechenden Eintrag:
ZitatWarnCount = 0
oder
ZitatWarnCount=5
Diese "gezählten, aktuellen Warnungen" hätte ich nun gerne als Zahl in meinem Symbol ausgegeben haben. Kann man das bereits umsetzten? Reicht beim Symbol dann einfach ein
Zitatdata-get="WarnCount"
?
Du musst zusätzlich noch die Klasse "warn" in data-icon angeben. In etwa so:
<div data-type="symbol"
data-device="UWZ"
data-get="WarnCount"
date-icon="fa-bolt warn"
...
></div>
das klingt simpel. Jetzt muss ich mir erstmal eine Gegend suchen wo es Unwetterwarnungen gibt ;D
Hallo Leute,
ich hätte eine kleine Frage: Ich würde gerne mein Rollo mit drei Befehlen steuern: auf, ab und stop (um in der Mitte anzuhalten).
Mit dem typischen Switch schaut das Ganze so aus und funktioniert mit auf und ab.
<div type="switch" device="Rollo1" data-get="STATE" data-get-on="up" data-get-off="down" class="cell" data-icon="fa-bars"></div>
Was dabei schön ist: Man sieht am Icon, ob das Rollo oben oder unten ist.
Gibt es eine Möglichkeit, das Ganze auch (zB mit dem Circle Menu) inkl. dem Stopbefehl darzustellen, aber gleichzeitig auch den Zustand des Rollos zu zeigen? Ich habe die Circlemenu ALternative bisher immer nur als statisches Icon dargestellt bekommen.
Danke und viele Grüße,
Andreas
Hey,
hat schon jemand von euch über die New Tablet UI das LightScenes Modul "eingebunden"?
LG Johannes
Hallo Mario,
eventuell habe ich einen Bug gefunden, ob in der Tablet-UI oder im FHEM, das kann ich nicht beurteilen.
Ausgangssituation:
Meine Temperatursensoren werden via "pilight_temp" Modul empfangen. Die Sensoren senden ihre Werte dreistellig, ohne Komma. Also bei 22,9°C kommen 229°C an. Luftfeuchte ebenso.
FHEM-Konfig:
Mittels stateFormat habe ich das in FHEM formatiert:
attr tmp_gaestezimmer stateFormat { sprintf("%s %s", ReadingsVal("tmp_gaestezimmer","temperature",0)/10, ReadingsVal("tmp_gaestezimmer","humidity",0)/10) ; }
Nun steht im Internals.STATE: 19.2 63
Tablet-UI-Konfig:
<div data-type="label" data-device="tmp_gaestezimmer" data-unit=" %B0C%0A" data-part="1" class="darker small inline"></div>
<div data-type="label" data-device="tmp_gaestezimmer" data-unit=" %" data-part="2" class="darker small inline"></div>
Das Problem:
Beim Start der GUI werden die Temperaturen ordentlich angezeigt. Wird ein Sensor aktualisiert, dann wird plötzlich wieder dreistellig angezeigt und auch anstelle der Luftfeuchte ebenfalls die Temperatur.
Meine Vermutung
Das Attribut "State" gibt es zwei mal. Einmal unter Internals und einmal in den Readings. Der einzige Unterschied ist die Groß/Kleinschreibung. Kann es sein, dass bei neuen Werte das Readings.state angezeigt wird?
Hast Du einen Lösungsvorschlag? Ein explizit angegebenes data-get="STATE" hat auch nicht geholfen.
Danke Dir für die tolle GUI. VG, Stephan
Zitat von: johannes1984 am 09 Mai 2015, 15:53:44
hat schon jemand von euch über die New Tablet UI das LightScenes Modul "eingebunden"?
Ich sehe da jetzt nicht so die Herausforderung - was schwebt dir denn genau vor?
Zitat von: StG (DD) am 09 Mai 2015, 22:34:01
Meine Vermutung
Das Attribut "State" gibt es zwei mal. Einmal unter Internals und einmal in den Readings. Der einzige Unterschied ist die Groß/Kleinschreibung. Kann es sein, dass bei neuen Werte das Readings.state angezeigt wird?
Bei longpoll gillt: Entscheidend ist, was im Event steht. Kannst du bitte einmal im Eventmonitor schauen wie der STATE-Wert dort gemeldet wird?
Zitat von: nesges am 09 Mai 2015, 22:37:03
Ich sehe da jetzt nicht so die Herausforderung - was schwebt dir denn genau vor?
Dachte, da gäbe es vielleicht ein schönes fertiges Modul. :-)
Korrigiere mich bitte, wenn ich falsch liege, aber dann würde ich das über einen Dummy und notify oder DOIF in FHEM lösen und den dummy dann im Tablet UI darstellen?!
LG Jo
Gesendet von meinem iPhone mit Tapatalk
Ich benutze LightScene selbst nicht, von daher bin ich vielleicht nur eingeschränkt phantasiefähig - aber eigentlich will man LightScenes im Frontend nur noch einschalten, oder? Das wäre in der einfachsten Form zb so ein Push-Widget:
<div data-type="push"
data-device="LS"
data-set="scene SCENE"></div>
Ich teste das mal ;-)
Gesendet von meinem iPhone mit Tapatalk
Zitat von: nesges am 09 Mai 2015, 22:41:44
Bei longpoll gillt: Entscheidend ist, was im Event steht. Kannst du bitte einmal im Eventmonitor schauen wie der STATE-Wert dort gemeldet wird?
2015-05-09 23:02:30 pilight_ctrl pilight rcv_raw: {"code":{"id":1316,"temperature":190,"humidity":630,"battery":1},"origin":"receiver","protocol":"alecto_ws1700","uuid":"0341-91-45-48-554848","repeats":1}
2015-05-09 23:02:30 pilight_temp tmp_gaestezimmer 190
2015-05-09 23:02:30 pilight_temp tmp_gaestezimmer temperature: 190
2015-05-09 23:02:30 pilight_temp tmp_gaestezimmer humidity: 630
So kommt es im FHEM-eventmonitor an, von den States sehe ich da gar nix :( .
Hallo Stephan,
das ist aber schade. Da hast du gerade das mit dem stateFormat so toll hin bekommen und nun ist das nicht mit im Event-Publishing drin.
Evtl. müssen wir doch im FTUI die Berechnung (/10) anbieten oder hat noch jemand einen anderen Vorschlag, um ohne viel Aufwand, aus 229 22,9 zu machen?
Zitat von: setstate am 09 Mai 2015, 23:20:55Evtl. müssen wir doch im FTUI die Berechnung (/10) anbieten oder hat noch jemand einen anderen Vorschlag, um ohne viel Aufwand, aus 229 22,9 zu machen?
Vielleicht mit userReadings?
Gruß,
Thorsten
Zitat von: StG (DD) am 09 Mai 2015, 23:05:20
2015-05-09 23:02:30 pilight_temp tmp_gaestezimmer 190
So kommt es im FHEM-eventmonitor an, von den States sehe ich da gar nix :( .
Die Zeile, die ich stehen gelassen habe ist "STATE", da hab ich mich falsch ausgedrückt. Doof ist, dass da der unformatierte Wert gesendet wird. Da wirst du auch so einfach nichts dran ändern können. Was geht: notify, der den formatierten Wert in ein dummy schreibt und diesen dummy in FTUI lesen - ist aber natürlich keine schöne Lösung. Oder was Thorsten schreibt (userReadings)!
Zitat von: setstate am 09 Mai 2015, 23:20:55
jemand einen anderen Vorschlag, um ohne viel Aufwand, aus 229 22,9 zu machen?
Dazu könnten wir eine Funktion in widget_widget anlegen, mit der eine Formel aus einem Attribut auf den Wert angewendet wird. Die Funktion wird in den abgeleiteten Widgets in update() aufgerufen. "ohne viel Aufwand" ist das allerdings nicht ;) Und eigentlich bin ich auch kein Freund davon das UI Werte berechnen zu lassen. Es sollte die Aufgabe des Backends sein, vernünftige Werte zu liefern.
Zitat von: nesges am 09 Mai 2015, 22:56:13
Ich benutze LightScene selbst nicht, von daher bin ich vielleicht nur eingeschränkt phantasiefähig - aber eigentlich will man LightScenes im Frontend nur noch einschalten, oder? Das wäre in der einfachsten Form zb so ein Push-Widget:
<div data-type="push"
data-device="LS"
data-set="scene SCENE"></div>
Hey,
damit funktioniert es super. Danke für den Denkanstoß.
LG Jo
Zitat von: andreas_r am 09 Mai 2015, 15:31:05
ich hätte eine kleine Frage: Ich würde gerne mein Rollo mit drei Befehlen steuern: auf, ab und stop (um in der Mitte anzuhalten).
Gibt es eine Möglichkeit, das Ganze auch (zB mit dem Circle Menu) inkl. dem Stopbefehl darzustellen, aber gleichzeitig auch den Zustand des Rollos zu zeigen? Ich habe die Circlemenu ALternative bisher immer nur als statisches Icon dargestellt bekommen.
@Andreas: Ich habe für meine Rolläden ein komplexes Setup bestehend aus einem Slider, Label und drei Buttons für Auf/Stop/Ab angelegt,
Das ganze sieht bei mir etwa so aus:
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=31945;image)
Und im HTML etwa so:
<div class="left">
<div data-type="label" class="">Links</div>
<div data-type="slider" data-device='roll_wz_1' data-get="STATE" data-min="0" data-max="100" data-on='(on|closed|down)' data-off='(open|off)' class="mini small" > </div>
<div data-type="label" data-device="roll_wz_1" data-get="STATE" class=""></div>
<div class="triplebox-v small top-space">
<div data-type="push" data-device="roll_wz_1" data-icon="fa-chevron-up" data-background-icon="fa-square-o" data-set="off" class="small"> </div>
<div data-type="push" data-device="roll_wz_1" data-icon="fa-minus" data-background-icon="fa-square-o" data-set="stop" class="narrow small"> </div>
<div data-type="push" data-device="roll_wz_1" data-icon="fa-chevron-down" data-background-icon="fa-square-o" data-set="on" class="narrow small"> </div>
</div>
</div>
<div class="left">
<div data-type="label" class="">Rechts</div>
<div data-type="slider" data-device='roll_wz_2' data-get="STATE" data-min="0" data-max="100" data-on='(on|closed|down)' data-off='(open|off)' class="mini small" > </div>
<div data-type="label" data-device="roll_wz_2" data-get="STATE" class=""></div>
<div class="triplebox-v small top-space">
<div data-type="push" data-device="roll_wz_2" data-icon="fa-chevron-up" data-background-icon="fa-square-o" data-set="off" class="small"> </div>
<div data-type="push" data-device="roll_wz_2" data-icon="fa-minus" data-background-icon="fa-square-o" data-set="stop" class="narrow small"> </div>
<div data-type="push" data-device="roll_wz_2" data-icon="fa-chevron-down" data-background-icon="fa-square-o" data-set="on" class="narrow small"> </div>
</div>
</div>
Dazu muss im CSS aber auch noch die triplebox definiert werden:
.triplebox-v {
min-height: 100x;
max-height: 100px;
min-width: 52px;
max-width: 52px;
}
.triplebox-v [data-type]{
margin-top:-4px;
margin-bottom:-4px;
}
Ich verwende aber bei mir einen etwas modifzierten Slider, damit es eher zur Bewegungsrichtung der Rolläden passt (Also Oben min / Unten max). Es sollte aber erstmal auch so gehen.
Ich kann meinen Slider aber auch in Github bereitstellen, wenn gewünscht.
Gruss,
Johannes
Guten Morgen Mario,
da hast Du Recht, das Backend sollte die richtigen Werte liefern. Ich schau mir die zwei anderen Vorschläge an und melde mich, ob's geklappt hat. Wird wohl aber heute leider nix werden. Einen schönen Sonntag Euch :)
@Viegener: Sieht prima aus, so stelle ich mir das auch vor, habe vorgestern meine ersten Rollladen mit Motor und Homematic versorgt und nun versuche ich es in FHEM hübsch zu machen.
Stephan
Zitat von: viegener am 10 Mai 2015, 01:03:42
Ich verwende aber bei mir einen etwas modifzierten Slider, damit es eher zur Bewegungsrichtung der Rolläden passt (Also Oben min / Unten max). Es sollte aber erstmal auch so gehen.
Ich kann meinen Slider aber auch in Github bereitstellen, wenn gewünscht.
Vielleicht können wir dem Standard-Slider ja eine Option verpassen, mit der die Richtung umgekehrt wird. Deine Anpassung würde mich auf jeden Fall interessieren.
Hallo Thorsten, Mario, nesges ;)
mit den userReadings funktionierts prima :) .
VG, Stephan
Morgen zusammen,
ich versuch mich auch grad am Tablet UI ... scheitere aber, mangels css und html Kenntnissen (ist lange her) am Aufbau des Layouts.
Die Doku ist umfangreich, das Thema hier noch viel umfangreicher ... ich such und les auch schon eine Weile aber finde nix für einen Anfänger wie ich mir ein Layout aufbaue.
Von container, gridster usw. habe ich gelesen ... aber wann brauche ich was?
Es wäre super wenn in den Demos auch mal eine einfache Seite enthalten wäre (2 Räume mit den wichtigsten Dingen wie Licht an/aus, Dimmer, Thermostat) und gut, dann könnte der Noob (wie ich) das vielleicht besser nachvollziehen.
Derzeit ist das alles sooo komplex dass es vermutlich den einen oder anderen pot. Nutzer schnell wieder vertreibt.
Ich versuch mich durchzubeissen :)
Editiert ihr die index.html mit vi oder habt ihr wysiwyg Editoren im Einsatz?
Grade fürs grundsätzliche Layout würde ich einen Editor bevorzugen der mir direkt zeigt was ich für`n Mist baue :D ... habt ihr da Empfehlungen?
Danke Thomas ... und weiter so, gute Arbeit!
Auch ich bin schwer angetan von dem, was hier passiert. Vielen Dank an alle !
Ich brauche Hilfe bei Jalousien: welche optische Lösung habt Ihr gefunden ? Ich brauche mindestens drei Zustände: auf, zu, halboffen oder die Darstellung mit 10%-Schritten. Über entsprechende Beispiele würde ich mich freuen.
Anregung: dieser Thread enthält jetzt fast 100 Seiten und vielen Informationen, manche sind sogar schon überholt. Könnte man einen eigenen Beispiel-Thread schaffen, der alle typischen Lösungen vorstellt?
...Und Ja, die Readme-Datei habe ich gelesen; dort fehlen mir optische Alternativen....
Vielen Dank nochmal
Michael
Ja ist denn heut scho Weihnachten? Genau das ging mir durch den Kopf, als ich vor einiger Zeit das Projekt entdeckt habe, denn das ist genau das, was ich für ein Tablet meiner FHEM Umgebung gesucht habe. 8)
Meine Frau wird sich darüber besonders freuen, denn je einfacher das Ganze zu bedienen ist, desto mehr wird sie es annehmen. Ihr kennt das ja... ::)
Deshalb zuerst allen ein riesen großes Dankeschön, die hier so viel Zeit investieren und beständig mit Erweiterungen betragen!
Drei Abende habe ich auf dem Sofa den Thread von Anfang an durchgelesen und dennoch bleibt mir noch eine Frage über, auf die ich keine Antwort gefunden habe.
Mein Tablet ist ein 7" mit einer Auflösung von 1280 x 800, gerootet und erlaubt die Nutzung der vollen Auflösung. Trotzdem finde ich nicht die Lösung, wie ich diese Auflösung quasi vorgeben kann, sprich die Breite und Höhe begrenze, respektive konfiguriere.
Vermutlich ist mein Problem recht banal und hoffe es nicht irgendwo schlicht überlesen zu haben... :-[
VG Stefan
Edit: Klassiker, kaum fragt man, findet man die Antwort selbst... ::) "widget_base_width" und "widget_base_height" in der index.html sind meine neuen Freunde.
Hallo nesges,
multistatebutton funktioniert ganz gut. Danke.
Habe aber den Aufruf von ShowOverlay raus genommen. Funktion gibt es (noch) nicht.
Risiko
Zitat von: tomster am 05 Mai 2015, 17:47:37
Mal als Vorschlag in die Runde:
Was haltet ihr von ganz dezenten CSS-Animations so wie z.B. auf http://tympanus.net/Tutorials/CSS3RotatingWords/index.html (http://tympanus.net/Tutorials/CSS3RotatingWords/index.html) Demo1 oder 2 oder etwas von http://codyhouse.co/demo/animated-headlines/index.html (http://codyhouse.co/demo/animated-headlines/index.html)? In unserem Fall sind es ja quasi nur einzelne "Buchstaben", die animiert werden müssten. Ich bin eigentlich kein großer Freund von zuviel Bewegung auf einer Seite, aber allein um des Layouts Willen, würde ich hier Mal eine Ausnahme machen. Beträfe ja (zunächst) nur diejenigen Stati, die eben 2 Icons benötigen...
Das Thema hat mich auch etwas beschäftigt und herausgekommen ist das neue
Rotor WidgetDamit kann man an einer Stelle zwei oder mehr Widgets unterbringen, die nacheinander angezeigt werden, also rotieren.
Ein Beispiel wäre eine Wettervorhersage für die ganze Woche an nur einer Stelle, jeder Tag für 3 Sekunden.
In der Standardausführung passiert der Wechsel einfach nur Knall auf Fall, da ich feststellen musste, dass mit den wunderschön anzusehenden CSS3 Animationen, die CPU ganz schön zu rechnen hat. Wer sich über den Stromverbrauch oder die Temperaturentwicklung seines Anzeigegerätes nicht kümmern will, kann aber auch eine der zwei vorhandenen Überblend-Animationen aktivieren: 'fade' oder 'rotate'. Wer will, kann im CSS File auch weitere Animationen ergänzen.
Und so einfach legt man in der FTUI index.html solch eine Rotation an:
<div data-type="rotor">
<ul>
<li>
<div data-type="symbol" data-device="Eingangstuer" data-icon="ftui-door" class="narrow big"></div>
<div data-type="label" class="darker">Tür</div>
</li>
<li>
<div data-type="symbol" data-device="TerrassenTuer" data-icon="ftui-door" class="narrow big"></div>
<div data-type="label" class="darker">Terassentür</div>
</li>
</ul>
</div>
Das ist ein Wechsel zwischen zwei Symbolen ohne Übergangseffekt. Wenn man ein langsames Überblenden haben möchte, muss
<div data-type="rotor" class="fade"> benutzt werden
Hier ein Beispiel für die Wetteranzeige mit einer Umklapp-Animation:
<div data-type="rotor" class="rotate">
<ul>
<li>
<div data-type="label" class="darker">Heute</div>
<div data-type="weather" data-device="AgroWeather" data-get="fc0_weatherDay" class="big"></div>
<div data-type="label" data-device="AgroWeather" data-get="fc0_weatherDay" class=""></div>
<div data-type="label" data-device="AgroWeather" data-get="fc0_tempMax" data-unit="%B0C%0A" class="large"></div>
</li>
<li>
<div data-type="label" class="darker">Morgen</div>
<div data-type="weather" data-device="AgroWeather" data-get="fc1_weatherDay" class="big"></div>
<div data-type="label" data-device="AgroWeather" data-get="fc1_weatherDay" class=""></div>
<div data-type="label" data-device="AgroWeather" data-get="fc1_tempMax" data-unit="%B0C%0A" class="large"></div>
</li>
</ul>
</div>
@viegener: Herzlichen Dank für Deine Anregung, das ist in etwa das, was ich heute auch schon mache. (Natürlich etwas weniger schön gelöst, als Du das machst)
Bleibt noch eine Frage: Du siehst damit aber auch nicht, welchen aktuellen Zustand Dein Rollo hat, oder?
Mir geht es zB darum, abends am Tablet nochmal zu checken, ob alle Rollos im Haus zu sind, ohne durch das selbige laufen zu müssen.
Viele Grüße,
Andreas
Zitat von: Risiko am 10 Mai 2015, 20:41:54
Habe aber den Aufruf von ShowOverlay raus genommen. Funktion gibt es (noch) nicht.
Die Funktion ist aus widget_famultibutton (https://github.com/knowthelist/fhem-tablet-ui/blob/master/www/tablet/js/widget_famultibutton.js) geerbt.
Zitat von: M aus B. am 10 Mai 2015, 12:31:46
Anregung: dieser Thread enthält jetzt fast 100 Seiten und vielen Informationen, manche sind sogar schon überholt. Könnte man einen eigenen Beispiel-Thread schaffen, der alle typischen Lösungen vorstellt?
"Alle" Lösungen nicht, aber ein paar findest du in der Live-Demo und dem zugehörigen Repository: http://forum.fhem.de/index.php/topic,36063.0.html
@viegener: beim Slider dürfte zur Zeit
data-on='(on|closed|down)' data-off='(open|off)'
leider nicht funktionieren. RegEx versteht der an der Stelle noch nicht.
Würde ich noch nachrüsten.
Edit: was ist eigentlich der Unterschied zwischen deiner Triplebox Class und der doublebox? Die Zahlen sehr gleich aus.
@setstate wäre es möglich ein "symbol+switch/push" Widget einzubauen oder gibt es das bereits?
Hintergrund: So könnte man die Rolladensteuerung in ein Circlemenü verstecken und braucht kein zusätzlichen Knopf zum öffenen des Menüs.
Am besten wäre es wenn das switch/push widget das icon mit dem Attribut data-icons in Abhängigkeit von einem data-get-on Array setzen würde.
Oder ganz kurz und knapp ein drückbares Symbol widget wäre klasse!:)
Zitat von: Wegwerf am 11 Mai 2015, 12:50:02
@setstate wäre es möglich ein "symbol+switch/push" Widget einzubauen oder gibt es das bereits?
Hintergrund: So könnte man die Rolladensteuerung in ein Circlemenü verstecken und braucht kein zusätzlichen Knopf zum öffenen des Menüs.
Am besten wäre es wenn das switch/push widget das icon mit dem Attribut data-icons in Abhängigkeit von einem data-get-on Array setzen würde.
Oder ganz kurz und knapp ein drückbares Symbol widget wäre klasse!:)
Hallo Wegwerf,
diese Widgets basieren auf dem selben Control, nur das Laufzeitverhalten und die Defaults unterscheiden sich. Suche dir ein Widget aus, was deinem benötigten Verhalten entspricht, vom Aussehen her kann man es vielseitig anpassen. Zum Beispiel kann man den Push mit data-background-icon="" wie ein Symbol aussehen lassen. Schaue mal in die Readme, bei den Switch, Push und Symbol Widgets. Die können gleichermaßen angepasst werden (Color, Icon < foreground, background)
Zitat von: M aus B. am 10 Mai 2015, 12:31:46
Auch ich bin schwer angetan von dem, was hier passiert. Vielen Dank an alle !
Ich brauche Hilfe bei Jalousien: welche optische Lösung habt Ihr gefunden ? Ich brauche mindestens drei Zustände: auf, zu, halboffen oder die Darstellung mit 10%-Schritten. Über entsprechende Beispiele würde ich mich freuen.
Hallo Michael!
Ich habe das momentan so gelöst, meine Rollos können 3 Zustände.
<header>BAD</header>
<div data-type="switch" data-icon="fa-caret-up" data-device="Jaro_Bad" data-get-off="((?!Rauf).)*" data-get-on="Rauf" class="mini"></div></br>
<div data-type="switch" data-icon="fa-bars" data-device="Jaro_Bad" data-get-off="((?!Halb).)*" data-get-on="Halb" class="mini"></div></br>
<div data-type="switch" data-icon="fa-caret-down" data-device="Jaro_Bad" data-get-off="((?!Runter).)*" data-get-on="Runter" class="mini"></div>
Das klappt bei mir ganz gut, die Zustände werden richtig angezeigt. Was nicht klappt: Wenn Rollo runter ist und man nochmal drückt dann ist der Knopf wieder aus, also wenn der an ist und man nochmal drückt soll der ja an bleiben. Das kann man sicher auch noch regulieren.
@setstate
gerade habe ich erst herausgefunden, dass man im CircelMenu den "Hauptbutton" nicht zwingend als push- Widget definieren muss, sondern auch mit anderen Widgets geht, sogar mit den normal nicht klickbaren symbol- Widget. Danke! Am besten mein vorherigen Beitrag vergessen :)
Das Rotor-Widget ist echt prima!
Allerdings dachte ich bei meinem Vorschlag gar nicht so umfangreich. Mir ging es lediglich um den Wechsel von 2 Status-Werten innerhalb eines Symbol-Widgets. Du wechselst ja ganze Widgets aus.
Beispiel: Abfallkalender - wenn an einem Tag 2 verschiedene Müllsorten abgeholt werden.
Normalerweise zeigt es z.B. nur das Tonnensymbol für Restmüll an. Wird nun aber am gleichen Tag auch der "Gelbe Sack" abgeholt, dann sollten die beiden Icons (Restmüll, Gelber Sack) alternieren. Sollte mit "einfachen" fadeOut/ fadeIn's zu bewerkstelligen sein, denke ich. Das kostet verhältnismäßig wenig Rechenleistung (sind ja nur 2 SVG-Icons). Aufrufen könnte man das dann vielleicht so in der Art:
<div data-type="label" class="">Müllabfuhr</div>
<div data-type="symbol"
data-device="Abfallkalender"
data-icons='["fs-dustbin","fa-dustbin","fa-dustbin","fs-bag warn","fa-thumbs-o-up","alternating fa-dustbin fs-bag"]'
data-get-on='["Papier","Restmuell","Biomuell","GelberSack","Nichts","RestmuellGelberSack"]'
data-on-colors='["#01A3F5","#A8A8A8","#82550C","#FFFF00","#505050","#A8A8A8:#FFFF00"]'
class="narrow small"></div>
</div>
Ich hab zwar noch kein konkret passendes Beispiel gefunden, dachte aber an etwas wie den folgenden Code, nur halt nicht die Div-ID betreffend, sondern eben die "Icon-Class" (oder wie auch immer man dazu sagen soll).
jQuery(function () {
var $els = $('div[id^=alternating]'),
i = 0,
len = $els.length;
$els.slice(1).hide();
setInterval(function () {
$els.eq(i).fadeOut(function () {
i = (i + 1) % len
$els.eq(i).fadeIn();
})
}, 2500)
})
Zitat von: setstate am 01 Mai 2015, 00:28:05
Update des Symbol Widgets
Neu: Möglichkeit zum zusätzlichen Anzeigen eines Overlay-Symboles als Warnung oder Anzahl-Visualisierung
Warnung Tür noch offen
<div data-type="symbol" data-device="TerrassenTuer"
data-get-on='["open","closed"]'
data-icons='["ftui-door warn","ftui-door"]'
data-on-colors='["#777","#555"]'
class="narrow big"></div>
(http://knowthelist.github.io/fhem-tablet-ui/t%C3%BCr_warn.png)
[/code]
(http://knowthelist.github.io/fhem-tablet-ui/phone_warn.png)
Zum Aktivieren des Overlay-Icons muss dem Icon zusätzlich die CSS Class 'warn' mitgeben werden. Numerische Werte bis 99 im Reading, was mit data-get angefragt wird, werden im Overlay-Icon direkt angezeigt. Alle anderen und Strings erzeugen nur ein Ausrufezeichen.
Hallo.
Habe auch die Fenster/Türen so eingebunden, aber bei mir gibts keine Statusänderung des Symbols.
Vielleicht erkennt jemand den Fheler
<div data-type="symbol" data-device="Terrassentuer"
data-get="Window"
data-get-on='["Open","Closed"]'
data-icons='["ftui-door warn","ftui-door"]'
data-on-colors='["#777","#555"]'
class="cell">
</div>
Und danke für das tolle Projekt!!!
gruss
Zitat von: satprofi am 11 Mai 2015, 15:07:38
Vielleicht erkennt jemand den Fheler
Hab den Fheler gefunden! Spass bei Seite. Bist Du sicher, dass die Stati Deiner Terassentür Großgeschrieben sind?
Ja. Ist ein FHT80TF.
Ich hab das Widget zwar noch nicht komplett abgecheckt, habe aber das Gefühl, dass es "nur" entweder Zahlenwerte (=Zahlen im roten Kreis) oder das "!" ausgibt. Dabei ist es dann wohl egal, ob Du "open", "closed" oder "hkasdkh" definierst. Letztere geben immer das "!" aus.
Nachdem ich den Beitrag von setstate gerade nochmal nachgelesen habe, würde genau das da stehen:
Zitat
...Numerische Werte bis 99 im Reading, was mit data-get angefragt wird, werden im Overlay-Icon direkt angezeigt. Alle anderen und Strings erzeugen nur ein Ausrufezeichen.
Ich vermute hier einen Bug im Widget, da die class "warn" wohl auf das gesamte Widget angewendet wird, und nicht nur auf den case "open"= ftui-door warn
Zitat von: satprofi am 11 Mai 2015, 15:07:38
Habe auch die Fenster/Türen so eingebunden, aber bei mir gibts keine Statusänderung des Symbols.
Der FTUI-Code ist korrekt, die Ursache sollte an anderer Stelle zu finden sein. Hast du schonmal im Event-Monitor geschaut, was dort bei einer Statusänderung ankommt? Siehe auch FAQ: Das UI zeigt Statusänderungen gar nicht an (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an).
hallo.
Statusänderung klappt als Text
<div data-type="label" data-device="Terassentuer" data-get="state" class="darker narrow small"></div>
Zitat von: satprofi am 11 Mai 2015, 16:00:09
Statusänderung klappt als Text
Im Text verwendest du data-get="state", im Symbol data-get="Window".
Habe "Windows" testhalber verwendet, ist aber selbe Ausgabe.
Mit "state" gibts auch keine Änderung beim Icon
"state" ist wahrscheinlich genauso falsch wie "Windows":
Zitat von: nesges am 11 Mai 2015, 15:41:33
Hast du schonmal im Event-Monitor geschaut, was dort bei einer Statusänderung ankommt? Siehe auch FAQ: Das UI zeigt Statusänderungen gar nicht an (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an).
Event-Monitor?
Toll. Der hat mir gerade FHEM gekillt. Alle Messwerte weg :grrr:
gruss
Der Event Monitor kann sowas? Das bezweifle ich. Ist doch nur ne passive Anzeige.
http://www.fhemwiki.de/wiki/Event_monitor
Einfach die fhemweb Seite des Eventmonitors öffnen
Tür auf und zu machen
Und die angezeigten Events der Tür kopieren und uns mal zeigen
Dann können wir sehen, wie der FTUI Code aussehen muss.
Hallo.
Leider habe ich den Link nicht im WEBIF von FHEm wie im WIKI beschrieben.
ich rufe den Eventmonitor mit http://ip.von.fhem:7072/fhem?cmd=style%20eventMonitor auf.
Dann öffne ich die Türe aber sehe kein event. weder von diesem device noch anderen device.
Das die Abfrage aber passt, sehe ich an den anderen devices die selbiger kontakt steuert, mit selben reading "state".
habe mind. 10 solcher kontakte in betrieb, alle steuern das was sie sollen.
sorry, aber ist so.
Hi,
langsam komme auch ich vorwärts. Eine Frage zwischendurch: Kann man im Thermostat-Widget die gemessene Temperatur größer darstellen. Bei "class big" wird zwar alles größer die gemessene Temperatur ist aber sehr, sehr klein.
Mit suchen hab ich leider nix gefunden.
Danke
Hallo Thomas,
nicht direkt. Hintergrund ist die Philosophie, die ich dahinter verfolgt habe: Eigentlich muss man nur wissen, was die Solltemperatur ist. Das Thermostat regelt ja genau dort hin. Wenn es Abweichungen gibt, sieht man das sehr schön durch den farblichen Bereich, der entsteht. Großer Bereich, großer Unterschied, kleiner Farbkreis -> alles wie es soll.
Wenn man die Raumtemperatur auf einen Blick haben will, nimmt man ein Label mit bigger und thin.
Wenn es bei dir aber zuuu klein ist, müsstest du im Code selbst schrauben.
widget_thermostat.js
Zeile 121-124
if (navigator.userAgent.match(/(iPod|iPhone|iPad)/))
cfont="18px sans-serif";
else
cfont="10px sans-serif";
Naja, bei mir ist das praktisch nicht lesbar. Ich häng mal n Screenshot dran, vielleicht wirds dadurch deutlich.
Auuu, das ist vieeel zu klein. Das ist nicht gewollt (siehe bekannte Screenshots)
OK, hier kann man es lesen. Hab grad nochmal auf dem iPad geschaut, da gehts. Das Problem ist an meinem Notebook. Liegt wohl an der hohen Auflösung des Displays (Retina 13"). Ich versuch das mit nem Label mal.
Hab grad nochmal geschaut, wenn ich class big nehme ist die gemessene Temperatur genauso groß wie ohne big. Der Rest wird größer die kleene Zahl nich :)
Gruß
Ich muss mich mal mit "window.devicePixelRatio" beschäftigen, für Retina Displays
Kann bitte mal jemand mit Retina Display folgendes testen:
widget_thermostat.js Zeile 120:
var cfont=10*window.devicePixelRatio +"px sans-serif";
Beim iPhone 4s und iPad3 klappt das wunderbar.
Sieht eher aus wie vorher. Ich hoffe ich hab alles richtig gemacht?
:D fast
bitte noch Zeile 122-125 kpl. löschen
Guter Mann ;D (bei den Smilies fehlt ein "Gefällt mir" !!!)
Zitat von: setstate am 29 April 2015, 00:10:09
Aber bei mir auf der ToDo Liste steht genau so eine on-for-timer Anzeige für den Push Button. Diesen Wunsch gab es schon vor einiger Zeit. Ich bin dran. Es wird so ein immer kleiner werdender Ring werden ...
Die Umsetzung ist jetzt abgeschlossen.
Wenn man einen Push Button mit on-for-timer als Argument für data-set verwendet, wird jetzt ein Countdown Ring direkt im Button angezeigt, der die noch verbleibende Zeit symbolisiert.
Beispiel: Schalte MyLamp für 5 Minuten ein
<div data-type="push" data-device="MyLamp" data-set="on-for-timer 300" class="cell" ></div>
Zitat von: setstate am 11 Mai 2015, 22:42:42
Wenn man einen Push Button mit on-for-timer verwendet, wird jetzt ein Countdown Ring direkt im Button angezeigt
Sehr cool! :) Nur ne Kleinigkeit: Der Ring ist ein kleines bisschen seitlich verschoben. Auf dem Screenshot im Anhang sieht man's an der linken Seite.
Das Sahnehäubchen wäre natürlich, wenn der Countdown-Ring einen Pagereload überleben würde. Aber ausser der Verwendung von Cookies fällt mir dazu keine Lösung ein.
Zitat von: nesges am 11 Mai 2015, 22:58:17
Sehr cool! :) Nur ne Kleinigkeit: Der Ring ist ein kleines bisschen seitlich verschoben. Auf dem Screenshot im Anhang sieht man's an der linken Seite.
Das Sahnehäubchen wäre natürlich, wenn der Countdown-Ring einen Pagereload überleben würde. Aber ausser der Verwendung von Cookies fällt mir dazu keine Lösung ein.
Danke Dir!
- Die Position habe ich etwas korrigiert. Ist nicht so einfach, bei allen Browsern gleichzeitig zu erreichen.
- Persistente Timer könnte man vielleicht mit Web Workern hin bekommen. https://developer.mozilla.org/en-US/docs/Web/API/Web_Workers_API/Using_web_workers . ist aber ein ganz schöner Aufwand ...
Gibt es in FHEM wirklich keine (persistente) Timerfunktion? Kann ich mir bei Rudolf eigentlich gar nicht vorstellen...
Zitat von: Bapt. Reverend Magersuppe am 08 Mai 2015, 11:12:32
Kann man einen Slider auch klickbar machen, im Moment muss man immer das Knöpfchen schieben/ziehen.
Probiert den Slider jetzt mal, ist das besser ?
Edit: Auf Touch-Geräten klappt es noch nicht ...
hey,
das mit dem Countdown-Ring funktioniert problemlos. Auch auf dem Tablet!!
Habe bei der Aktualisierung gesehen, dass es im lib Verzeichnis eine fhem-SVG.css gibt. Was hat es damit auf sich? ;D :D :)
Hallo Bjoernbo,
die fhem-SVG.css braucht man, wenn man die original FHEM Icons nutzen möchte. Das gibt es aber schon eine Weile:
http://forum.fhem.de/index.php/topic,34233.msg286339.html#msg286339
Zitat von: tomster am 12 Mai 2015, 02:03:06
Gibt es in FHEM wirklich keine (persistente) Timerfunktion? Kann ich mir bei Rudolf eigentlich gar nicht vorstellen...
Für den on-for-timer Fortschrittsring benutze ich einen Timer, der direkt auf dem Client läuft, völlig unabhängig von FHEM.
Wenn der etwas länger läuft und ein Browser-Refresh gemacht wird, ist es dahin mit der reellen Restzeit-Anzeige.
Wir dachten: da wäre doch ein Timer schön, der nach einem Refresh einfach weiter läuft. FHEM liefert die Restzeit auch nicht bei jedem Device direkt per Reading, weil der on-for-timer meist direkt auf dem Device läuft.
Zitat von: setstate am 12 Mai 2015, 08:01:25
Für den on-for-timer Fortschrittsring benutze ich einen Timer, der direkt auf dem Client läuft, völlig unabhängig von FHEM.
Wenn der etwas länger läuft und ein Browser-Refresh gemacht wird, ist es dahin mit der reellen Restzeit-Anzeige.
Wir dachten: da wäre doch ein Timer schön, der nach einem Refresh einfach weiter läuft. FHEM liefert die Restzeit auch nicht bei jedem Device direkt per Reading, weil der on-for-timer meist direkt auf dem Device läuft.
Hi,
ich denke, dass man dafür schon etwas im Backend braucht. Entweder kann man rein prinzipiell die "Restzeit" gar nicht herausfinden, dann hat man komplett verloren. Diesen Fall muss man also gar nicht betrachten. (Oder man bleibt bei der reinen Frontend-Darstellung.)
Ansonsten müsste man verlangen, dass das Device (im Backend) eben die Daten zur Verfügung stellt. Ich kann mir dann am Frontend Parameter wie 'data-total="totaltime" data-processed="timespent"' vorstellen. Am Backend berechnet man die dann per userReading, einem at oder sonstwie (gibt es eigentlich in FHEM so etwas wie readings die "bei Bedarf" berechnet werden?).
Das Frontend könnte dann bei der Initialisierung des Widgets einmal einen Backend-Aufruf machen und von da an "alleine" weitermachen. Der Hit wäre, wenn das Widget zyklisch im Backend nachfragen würde und die Anzeige entsprechend korrigiert. Damit bekäme man dann einen allgemeinen "Progress Indicator" hin.
Ich weiß allerdings nicht wirklich, ob das mit der gegebenen Architektur wirklich sinnvoll machbar ist.
Gruß,
Thorsten
Zitat von: nesges am 10 Mai 2015, 09:02:36
Vielleicht können wir dem Standard-Slider ja eine Option verpassen, mit der die Richtung umgekehrt wird. Deine Anpassung würde mich auf jeden Fall interessieren.
Oops, 2 Tage nicht gelesen und schon bin ich 2 Seiten zurück ;D
Also mein umgekehrter Slider ist zu hier zu finden:
https://github.com/viegener/fhem-tablet-ui/blob/master/www/tablet/js/widget_negslider.js
Der negslider.js ist im wesentlichen eine Kopie, wobei der darzustellende Wert umgedreht wird (die Farben sind dabei zwar noch wie vorher).
Ausserdem unterstützt er auch regexp für data-on und data-off, da meine Rolläden hier mehrere Statuswerte liefern.
Ich habe ganz bewusst keine Option in Deinen Slider eingebaut, da ich sonst immer wieder beim Merge Mehraufwand habe.
Lass mich wissen, wenn ich das lieber in Deinen Slider einbauen soll und dann einen Pull-Request schicken soll?
Hallo zusammen,
ich habe dieses Frontend gerade erst entdeckt und muss sagen, dass ich ehrlich beeindruckt bin!!
Was das Layout angeht fühle ich mich allerdings als hätte ich noch nie Code bearbeitet...
Kann mir jemand ein Code Snippet für Folgendes geben?
Ein "Feld", 2x2 groß
In der ersten Zeile ein Thermostat und ein Fenster Symbol
In der zweiten Zeile zwei Schalter, und zwar nebeneinander
Vielen Dank schonmal!!
Cheers, Jörg
Ahh, und jetzt habe ich die HTML Tabelle wiederentdeckt...
never mind! :)
Zitat von: elfrinjo am 12 Mai 2015, 21:14:42
Hallo zusammen,
ich habe dieses Frontend gerade erst entdeckt und muss sagen, dass ich ehrlich beeindruckt bin!!
Was das Layout angeht fühle ich mich allerdings als hätte ich noch nie Code bearbeitet...
Kann mir jemand ein Code Snippet für Folgendes geben?
Ein "Feld", 2x2 groß
In der ersten Zeile ein Thermostat und ein Fenster Symbol
In der zweiten Zeile zwei Schalter, und zwar nebeneinander
Vielen Dank schonmal!!
Cheers, Jörg
Geht vielleicht noch schöner. Ich machs zumindest immer so:
<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>Genialstes Frontend</header>
<div class="cell">
<div data-type="thermostat" data-device="WZ_Temperatur" data-get="desired-temp" data-temp="measured-temp" class="cell inline" ></div>
<div data-type="contact" class="inline" data-device="WZ_Tuer_Ost_FK" data-get-on="on" data-get-off="off"></div>
</div>
<div class="cell">
<div data-type="push" data-device="SB_WZ" data-icon="fa-play" data-background-icon="-" data-set="pause" class="inline"></div>
<div data-type="push" data-device="SB_WZ" data-icon="fa-pause" data-background-icon="-" data-set="pause" class="inline"></div>
</div>
</li>
Cool, danke.
Das sieht natürlich noch besser aus.
Cheers, Jörg
Zitat von: viegener am 12 Mai 2015, 13:01:47
Ich habe ganz bewusst keine Option in Deinen Slider eingebaut, da ich sonst immer wieder beim Merge Mehraufwand habe.
Lass mich wissen, wenn ich das lieber in Deinen Slider einbauen soll und dann einen Pull-Request schicken soll?
Mir gefällt's! Ich wäre dafür, das als Option in den normalen Silder zu übernehmen, schick da bitte ruhig mal nen Pull-Request. Das letzte Wort hat aber setstate :)
Zitat von: andreas_r am 11 Mai 2015, 09:02:22
@viegener: Herzlichen Dank für Deine Anregung, das ist in etwa das, was ich heute auch schon mache. (Natürlich etwas weniger schön gelöst, als Du das machst)
Bleibt noch eine Frage: Du siehst damit aber auch nicht, welchen aktuellen Zustand Dein Rollo hat, oder?
Bitte gern geschehen.
Doch ich sehe den aktuellen Zustand und auch Updates während der Bewegung.
Allerdings hängt das nicht mit dem Tablet UI sondern mit meiner SOMFY-Umgebung zusammen.
Ich habe ein verändertes Somfy-Modul, dass noch der Übernahme in den Standard harrt und dieses sendet auch aktuelle Zustände und Updates während des Bewegens.
Das gehört aber nicht wirklich in diesen Thread....
Zitat von: setstate am 11 Mai 2015, 09:30:03
@viegener: beim Slider dürfte zur Zeit
data-on='(on|closed|down)' data-off='(open|off)'
leider nicht funktionieren. RegEx versteht der an der Stelle noch nicht.
Würde ich noch nachrüsten.
Edit: was ist eigentlich der Unterschied zwischen deiner Triplebox Class und der doublebox? Die Zahlen sehr gleich aus.
@setstate: Ja, ich habe eine Variante des Sliders, der umgekehrt funktioniert (passend zu den Rolläden), da habe ich auch gleich die Regexp für On und Off eingebaut. Die Triplebox habe ich erzeugt, um die drei Buttons (Hoch/Stop/Runter zusammenzufassen, vielleicht geht das auch eleganter, aber ich bin nicht so der CSS-Held...
@nesges und setstate: Inzwischen habe ich meinen Slider nochmal deutlich überabreitet, denn bei mir wird kein Kommando gesetzt, wenn man mit der Maus oder dem Finger zu weit über Min/Max hinauszieht. Ausserdem wollte ich noch eine optionale Werteanzeige haben, die auch während des Ziehens angepasst wird.
Leider ist das mit dem Pull-Request nicht so einfach, denn es gibt eine Abhängigkeit zu einem powerrange-Update (ist zwar nur eine Zeile, aber leider gibt es keinen Workaround).
Ich habe die Dateien zu meinem Slider und die angepassten powerrange-Dateien (als min und lesbar) angehängt.
Johannes
Vielen Dank viegener,
deine Version werde ich mir heute Abend mal unter die Lupe nehmen ...
Moin!
Da ich nun fast alles nach meinen wünschen eingerichtet habe, geht es nun an das optimieren. Dabei stehe ich gerade auf dem Schlauch oder ich habe was überlesen. Dabei geht es um eine ganz einfache Sache.
Wie kann ich ein widget in der Höhe und Breite zentrieren ?? :-[
Links rechts müsste es zentriert sein, das bringt das Gridster Style mit. Nach oben würde ich nicht lange rumdoktern und einfach feste Abstände nutzen: top-space, top-space-2x
Mit der Class "cell" wird auch etwas Raum nach links und oben erzwungen. Man kann auch mal probieren, "cell" wegzulassen, wenn es sich negativ hinsichtlich der Ausrichtung auswirkt. Bei mehreren Widgets, die sich eine Sektion teilen müssen, ist "cell" wichtig damit Abststand gewährleistet bleibt.
Es gibt (glaube ich ohne nachzusehen) auch noch left-space, left-space-2x usw.
Danke!
Mit
Zitatclass="top-space"
wird es richtig ausgerichtet!
Hallo,
da ist man mal 2 Wochen beruflich komplett eingespannt und schon kommt man kaum noch mit! :P 8)
Eine Frage zu Beginn:
Hier wird viel über Radios geschrieben, bzw die Steuerung für Kodi, Sonos usw....
Gibt es auch die möglichkeit einen Internetradio Stream einzubinden, mit ZB Start/Stop Button.
Das eigentliche Problem, der Radiosender soll dann nicht auf dem Server (Fhem-Server) abgespielt werden sonder auf dem Tablet auf dem FTUI angezeigt wird.
Das Tablet soll das ganze dann per Bluetooth zur Stereoanlage weitergeben.
Gibt es eine Lösung den Stream auf dem Tablet zu starten????
======================================================================
Ein wenig was habe ich mit FTUI auch schon gebastelt, soviel die Zeit eben hergibt.
Ich hänge mal ein paar Screenshots an vllt findet ja der eine oder andere eine Anregung für sich selbst oder hat einen Verbesserungsvorschlag ;)
Das Ganze wir bei mir auf einem 7 Zoll "Wand"-Tablet dargestellt!
Stelle bei Bedarf auch gerne den html-Code zur Verfügung!
Viele Grüße Philipp
Ja geht
<div data-type="playstream" data-url="http://radioeins.de/stream"></div>
<div data-type="label" class="darker">Radio eins</div>
Als URL muss man aber den Link auf den MP3 Stream setzen, nicht auf eine Playlist.
Wenn nur die Playlist bekannt ist, die vorher runterladen und mit einem Texteditor öffnen und die direkte URL raus kopieren.
kann es leider gerade nicht testen.
Würde folgender link funktionieren? Die geht bestimmt nicht, das ist doch eine Playlist?
"http://metafiles.gl-systemhaus.de/hr/hr3_2.m3u"
Nein, m3u sind Playlisten.
Man kann auf der Console mit
curl http://metafiles.gl-systemhaus.de/hr/hr3_2.m3u
Sich den Inhalt anzeigen lassen. Da sieht man dann die eigentliche http:// Adresse
Ja, danke! Hab den Link!
Oder 'wget' statt 'curl' geht auch.
Aber Phil_ deine Seiten sind phänomenal !!!
Und so viele! Ich bin immer noch bei meiner ersten und einzigen Seite, die als index_example.html mitkommt.
Bei der Heizungsseite würde ich nur etwas das Rot zurücknehmen vom Ton her. Das sticht etwas zuseht ins Auge. Nicht #ff0000 bzw. red
Eher den Rotanteil von FF in Richtung DD und dafür grün und blau etwas mehr 24 oder 33
Weiter so !!!
Zitat von: Phil__ am 13 Mai 2015, 13:13:35
Ein wenig was habe ich mit FTUI auch schon gebastelt, soviel die Zeit eben hergibt.
Ich hänge mal ein paar Screenshots an vllt findet ja der eine oder andere eine Anregung für sich selbst oder hat einen Verbesserungsvorschlag ;)
Gefällt mir sehr, sehr gut! Hut ab! :-)
ZitatAber Phil_ deine Seiten sind phänomenal !!!
Und so viele! Ich bin immer noch bei meiner ersten und einzigen Seite, die als index_example.html mitkommt.
geht mir ähnlich ^^ ... da bin ich noch weit entfernt von. Sieht wirklich gut aus.
Kann mir jemand sagen ob es für das circlemenu auch die Möglichkeit gibt einen ON Status (wie bei einem Switch) zu machen.
Hintergrund: ich hab mir solche Menüs für meine HUEs gebaut (an, 20, 40, 60, 80, aus) gebaut und würde gern den Button bei AUS anders als bei irgend einem AN Status darstellen. Die einzelnen Dimmstufen wäre dann nochmal eins oben drauf, aber das wäre absoluter Luxus :)
2. Bei meinem HM Thermostaten wird manchmal beim aktualisieren nur 10 anstelle der eingestellten 15 angezeigt, mal isses so mal nicht (dann zeigts korrekt an)
Liebe Entwickler,
zunächst einmal "chapeau", sieht wirklich gut aus, das frontent, ist einfach zu installieren und passt sehr gut auf die Tablet oberfläche.
Eine Frage hätte ich noch.
Gibt es auch einen Befehl (ähnlich push), der mir mehrere werte gleichzeitig in einem device ändert?
Hintergrund: ich würde gerne die Wochenwerte meiner Homematic Temp Sensoren mit einem klick ändern.
Hier sollten mind. 4 verschiedene Möglichkeiten bestehen, die dann alle in die Temperaturlisten (Mo - So) eingetragen werden.
1. für spontane Abwesenheit
2. für Temperatur boost (Rückkehr)
3. Urlaub (Temperatur herunter fahren)
4. regulärer Betrieb
5. spontane Anwesenheit (Krank, Homeoffice usw.)
Danke im Voraus
Hallo Gerd.Ternes,
vielen Dank fürs Lob.
Dein Wunsch ist eher etwas für Backend. Genau so etwas habe ich auch in Benutzung, aber direkt im FHEM.
Ich habe ein Dummy 'Homestatus" der per homestatus Widget im FTUI repräsentiert wir (Schalten/Anzeigen)
Im Fhem ist dann die Logik, was bei welchem Status passieren soll, auch die Temp-Listen Übernahme.
So etwa:
define OnHomeStatusChange notify HomeStatus.* { \
WriteStatefile();;\
Log (3,"HomeStatus changed to " .%);;\
if (% == 1) {\
if($hour > 8 && $hour < 24) {\
SetHeizungPresent();;\
} else {\
SetHeizungNormal();;\
}\
if(!isday()) {\
fhem("set GalerieLicht on");;\
fhem("set HerdLicht_Sw on");;\
fhem("set PowerAV_Sw on");;\
fhem("set GartenLicht on-till 23:30:00");;\
}\
}\
if ( %>1 ) {\
if ( Value("TerrassenTuer") eq "open" ) {\
Log (3,"Security warning sent for open TerrassenTuer");;\
sendMail('marioxxxx.de','Home Security Warning','Terrassen Tuer still open!');;\
}\
fhem("set GalerieLicht off");;\
fhem("set HerdLicht_Sw off");;\
fhem("set PowerAV_Sw off");;\
fhem("set GartenLicht off");;\
}\
if (% == 3) {\
SetHeizungAbsent();;\
}\
if (% == 4) {\
SetHeizungVacation();;\
}\
}
Vor einer ganzen Zeit war hier mal ein Problem mit dem verzögerten (mehrere Sekunden) bzw. nicht vollständigen Laden von Widgets auf einer Seite mit vielen Widgets die Sprache.
Ich habe immer noch das Problem das auf vielen meiner Seiten ein Timing-Problem besteht. Vor allem auf Seiten mit sehr vielen Widgets. Siehe meine Screenshots ein paar Seiten weiter vorne, zB heating, Wetter, home.
Gibt es da eine Lösung bzw Tipps um das Problem etwas zu bessern?
Viele Grüsse
.... danke für die Antwort.
ich hatte auch einmal daran gedacht, einen entsprechenden dummy Schalter zu definieren, der mir dann die Werte ändert.
Ich fände die Lösung dies an der Oberfläche zu machen jedoch ein wenig "sexier"
Gerd
Irgendwie verzweifle ich noch an den pagetabs:
Ich benutze den normalen HTTPSRV für mein tablet UI:
index.html ist komplett mit allen script/css includes, enthalt auch den kompletten home screen.
Dazu gehört auch der Verweis auf das room-Menu:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="templ_menu.html">
Im room menu sind mehrerre Einträge in der Art
<div data-type="pagetab" data-url="index.html" data-icon="fa-info" class="cell"></div>
<div data-type="pagetab" data-url="media.html" data-icon="fa-music" class="cell"></div>
usw.
Beim Klick auf die Menubuttons, funktioniert soweit alles und es ändert sich auch der URL --> also z.B. http://server:8083/fhem/tablet/index.html#media.html
Wenn ich nun im Browser einen refresh auslöse (Windows. Firefox und IE), wird wieder die homepage geladen. und nicht die media.html
Ausserdem ist das Menu durcheinander, da es ja annimmt media.html ist gerade aktiv.
Ist das so gedacht, oder habe ich einfach das ganze nicht verstanden?
Johannes
Zitat von: setstate am 12 Mai 2015, 02:06:07
Probiert den Slider jetzt mal, ist das besser ?
Edit: Auf Touch-Geräten klappt es noch nicht ...
Der Slider bewegt sich zwar auf einen Click, aber setFhemStatus wird nicht ausgelöst. Wenn ich Zeile 70f aus dem else-Block nehme, funktioniert's.
pwrng.onmousemove(e);
}
setFhemStatus(cmdl);
$.toast(cmdl);
e.preventDefault();
Hallo viegener,
beim pagetab ist der "Refresh"-Fall einfach unerwartet und schlichtweg nicht unterstützt (zur Zeit).
Muss ich irgendwann mal verbessern.
Sorry
Zitat von: nesges am 14 Mai 2015, 01:12:17
Der Slider bewegt sich zwar auf einen Click, aber setFhemStatus wird nicht ausgelöst. Wenn ich Zeile 70f aus dem else-Block nehme, funktioniert's.
Danke, aber ich habe den negslider von viegener jetzt übernommen, überarbeitet und werde ihn, wenn ich fertig bin, als slider widget ausrollen. Dann kann man mit class="negated" das Verhalten rumdrehen, Die Farben sind jetzt auch schon mit negiert (bunt ist bei class="negated" dann oben). Einen kleinen Bug habe ich leider noch: wenn ich data-min="10" data-max="90" setze, läuft der Slider aber von 0-80
Zitat von: setstate am 14 Mai 2015, 01:23:53
Sorry
@setstate: Kein Grund für Sorry, das hilft mir weiter,
Ich hatte gerade eine (für mich) überraschende Erkenntnis:
Wenn man wie beschrieben das tablet UI in das www-Verzeichnis von FHEM packt, so wird der url fhem/tablet/... gar nicht durch die HTTPSRV behandelt sondern durch das FHEMWEB-Modul. Das ist eigentlich auch ganz einsichtig, denn die Verzeichnisse unter www werden ja alle über http bereitgestellt.
Nur wenn der URL-Pfad in der HTTPSRV-Definition vom Dateipfad abweicht läuft das ganze über die HTTPSRV-Definition
also z.B.
define tablet_ui HTTPSRV anders ./www/tablet3 Tablet FrontendDann kann man das tablet_ui auch über
http://server:8083/fhem/tablet/
aufrufen.
Wenn man das allerdings tut, dann kommt pagetab leider durcheinander und glaubt alle Pages sind gleichzeitig aktiv. Aber das lässt sich wohl beheben, wenn man in widget_pagetab.js die folgenden Zeilen:
var isCurrent=false;
if (elem_url.indexOf(filename)>-1 && !window.location.hash
|| window.location.hash.indexOf(elem_url,1)>-1){
isCurrent=true;
}
durch diese ersetzt:
var isCurrent=false;
if ( ! filename ) {
if (!window.location.hash ) {
isCurrent = ( index == 0 );
} else {
isCurrent = (window.location.hash.indexOf(elem_url,1)>-1);
}
} else if (elem_url.indexOf(filename)>-1) {
isCurrent = true;
} else {
if (!window.location.hash ) {
isCurrent = ( index == 0 );
} else {
isCurrent = (window.location.hash.indexOf(elem_url,1)>-1);
}
}
Vielleicht kannst Du das in den Code übernehmen?
Ich könnte mich auch noch mit der Refreshproblematik befassen, wenn es recht ist ...
Johannes
Zitat von: setstate am 14 Mai 2015, 01:42:52
Danke, aber ich habe den negslider von viegener jetzt übernommen, überarbeitet und werde ihn, wenn ich fertig bin, als slider widget ausrollen. Dann kann man mit class="negated" das Verhalten rumdrehen, Die Farben sind jetzt auch schon mit negiert (bunt ist bei class="negated" dann oben). Einen kleinen Bug habe ich leider noch: wenn ich data-min="10" data-max="90" setze, läuft der Slider aber von 0-80
Das
Update ist jetzt verfügbar. Das
Slider Widget kann jetzt per class="negated" negiert werden (oben 0 - unten 100), um zum Beispiel zum Rollladen-Steuerung benutzt zu werden.
Ist data-value="true", wird der Wert sofort beim Sliden angezeigt werden.
Das Slider Widget unterstützt jetzt auch per Touch den direkten Sprung zum Zielwert.
Danke nochmal an viegener für die Änderungen
EditJetzt mit Beispiel:
<div data-type="slider" data-device="dummy1"
data-min="0"
data-max="100"
data-on='(on|closed|down)'
data-off='(open|off)'
data-value="true"
class="negated">
</div>
Ich habe mal mit widget_pagetab herumgespielt und habe eine Lösung gebaut, die bei mir auch beim Refresh die richtige Seite lädt.
Die geänderte widget_pagetab.js anbei, vielleicht kann das ja jemand ausprobieren, der eine komplexere Umgebung hat.
Allerdings ergibt sich eine Verhaltensänderung, die index.html sollte nicht mehr die Standard-Seite enthalten (also quasi den ersten pagetab), sondern alle includes (js und cs), gridster und die pagetabs.
Also im Body zum Beispiel so
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
<!-- ********************** END ************************************ -->
</ul>
</div>
</body>
Grund dafür. Dieser Raum wird bei Reload-Aktionen immer geladen, damit die richtige Seite aufgebaut werden kann.
Die einzelnen pagetab-Seiten (also auch die erste Seite) sind dann alle gleich aufgebaut und enthalten gridster und das menu wieder).
Für meine Umgebung ist das eigentlich sogar einfacher, denn es gibt keine Unterschiede zwischen den einzelnen Tabs mehr.
Ich habe keine Ahnung ob und wie das in php-Umgebungen laufen wird...
Feedback ist willkommen, denn bisher habe ich es nur in meiner noch recht kleinen Installation ausprobiert,
Johannes
Änderung: 19.5. - Weiter stabilisierte Version
Waere es moeglich den gesamten Quellcode der Demo bereitzustellen? Am liebsten inklusive aller configs der wunderhuebschen Plots :)
Zitat von: nesges am 11 Mai 2015, 15:41:33
Der FTUI-Code ist korrekt, die Ursache sollte an anderer Stelle zu finden sein. Hast du schonmal im Event-Monitor geschaut, was dort bei einer Statusänderung ankommt? Siehe auch FAQ: Das UI zeigt Statusänderungen gar nicht an (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an).
So, habe jetzt entdeckt warum der Eventmonitor nur bei gewissen Bedingungen arbeitet. link (http://forum.fhem.de/index.php/topic,31840.msg258948.html#msg258948)
Und das ist die Ausgabe von einem Fensterkontakt
2015-05-14 18:51:43 CUL_FHTTK Fenster_Terasse Window: Open
2015-05-14 18:51:43 CUL_FHTTK Fenster_Terasse Open
Zitat von: hillbicks am 14 Mai 2015, 18:44:27
Waere es moeglich den gesamten Quellcode der Demo bereitzustellen? Am liebsten inklusive aller configs der wunderhuebschen Plots :)
https://github.com/nesges/TabletUI-Demo-WOPR?files=1
Zitat von: Phil__ am 14 Mai 2015, 19:00:25
https://github.com/nesges/TabletUI-Demo-WOPR?files=1
Auf die Idee da nachzugucken bin ich natuerlich nicht gekommen. Ich danke Dir :)
Und wegen der Plots:
Zitat von: nesges am 27 April 2015, 15:25:42
Das ist nicht ohne weiteres möglich. Die Plots werden extern erzeugt und per Iframe eingebunden; sie haben also weder direkt mit FTUI noch einem Fhem-Modul zu tun. Zur Erzeugung verwende ich dygraphs (http://dygraphs.com/), das seine Daten aus einer MySQL-Datenbank bezieht, die von Fhem mit DbLog befüllt wird.
Der Code dafür ist wild zusammen gehackt und nicht zur Nachahmung empfohlen, von daher veröffentliche ich ihn erstmal nicht, sorry :)
Zitat von: nesges am 14 Mai 2015, 23:30:05
Der Code dafür ist wild zusammen gehackt und nicht zur Nachahmung empfohlen, von daher veröffentliche ich ihn erstmal nicht, sorry :)
Na so schwer zu verstehen, was Du da machst und wie die Daten beschaffen sind - war auch wieder nicht 8)
Außerdem ist dygraphs ausreichend dokumentiert.
Aber ich muss das auch erst noch vom statischen Prototyp zu produktiven Code entwickeln.
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=32085;image)
Btw. Bekommt man mit CSS-Mitteln die SVG-Graphik (Tür) eingefärbt? Klar, man kann eine eigene dafür erstellen, ist aber unsportlich ;D
Holla.
Das ist mal Eyecandy :)
Jetzt wird mir klar, warum der Thread gleich die 100 Seiten Grenze sprengt.
Morgen,
darf ich mein Anliegen noch einmal vorholen? :)
ZitatKann mir jemand sagen ob es für das circlemenu auch die Möglichkeit gibt einen ON Status (wie bei einem Switch) zu machen.
Hintergrund: ich hab mir solche Menüs für meine HUEs gebaut (an, 20, 40, 60, 80, aus) gebaut und würde gern den Button bei AUS anders als bei irgend einem AN Status darstellen. Die einzelnen Dimmstufen wäre dann nochmal eins oben drauf, aber das wäre absoluter Luxus :)
2. Bei meinem HM Thermostaten wird manchmal beim aktualisieren nur 10 anstelle der eingestellten 15 angezeigt, mal isses so mal nicht (dann zeigts korrekt an)
Hallo update71,
zu 1.:
Man kann das mittlere Widget durch beliebige andere ersetzen. Dafür muss nur das erste in der Liste <li> ausgetauscht werden. Für das, was du machen willst, würde ich den Push durch ein Symbol Widget austauschen, was optisch zu einem Push getrimmt werden müsste, weil das Symbol Widget auch den Status anzeigen kann, was der Push nicht kann. Der kann nur Senden.
<div data-type="circlemenu" class="cell circlemenu">
<ul>
<li><div data-type="symbol" data-device="dummy1"
data-get-on="on" data-get-off="off"
data-background-icon="fa-circle-thin"
data-icon="fa-wrench"></div></li>
<li> ...widget ...</li>
<li> ...widget ...</li>
<li> ...widget ...</li>
<li> ...widget ...</li>
</ul>
</div>
Optisch den Wert anzeigen kann man mit den bekannten Arrays bei Icon, Color, Get
data-icons='["fa-wrench"]'
data-get-on='["[12]*[0-9]","[3456][0-9]","([789][0-9]|100)"]'
data-on-colors='["#855","#a55","#d55"]'
zu2.: Ist schwer, die Ursache zu finden ...
Manchmal kann es passieren, dass bei einem Javascriptfehler die Programmausführung abgebrochen wird. Damit werden dann bestimmte Sachen nicht gezeichnet oder aktualisiert. Je nachdem, welches Widget zuerst angezeigt wird, passiert das Anzeigeproblem oder nicht. Was sagt die Webconsole? Gibt es Fehler?
Ansonsten fallen mir noch die Probleme im Zugsamenhang mit iOS und FHEMWEB/HTTPSRV ein, die noch nicht verstanden sind.
Zitat von: hexenmeister am 15 Mai 2015, 01:09:43
Na so schwer zu verstehen, was Du da machst und wie die Daten beschaffen sind - war auch wieder nicht 8)
Hab ich auch nicht behauptet :) Ich sag nur, dass ich das für mich notdürftig zusammen gehackt hab. Meins kann man im aktuellen Zustand keinem in die Hand geben ;)
ZitatBtw. Bekommt man mit CSS-Mitteln die SVG-Graphik (Tür) eingefärbt? Klar, man kann eine eigene dafür erstellen, ist aber unsportlich ;D
Hab ich nicht hinbekommen und wäre auch dankbar für Tipps.
Zitat von: nesges am 15 Mai 2015, 09:17:13
Hab ich nicht hinbekommen und wäre auch dankbar für Tipps.
Das SVG Grafik auch nur durch HTML Tags definiert werden, bekommt man mit dem richtigen CSS selector auch ein bestimmtes Attribut überschrieben. Das SVG Icon muss aber inline im HTML eingebettet sein, nicht als Image. Dazu hatte ich hier in diesem Thread schon mal einen JS Konverter gepostet, der aus Icon.svg eingebetteten Images Inline HTML macht, der dann per CSS in der Farbe geändert werden kann.
Zitat von: setstate am 15 Mai 2015, 09:28:22
Das SVG Grafik auch nur durch HTML Tags definiert werden, bekommt man mit dem richtigen CSS selector auch ein bestimmtes Attribut überschrieben. Das SVG Icon muss aber inline im HTML eingebettet sein, nicht als Image. Dazu hatte ich hier in diesem Thread schon mal einen JS Konverter gepostet, der aus Icon.svg eingebetteten Images Inline HTML macht, der dann per CSS in der Farbe geändert werden kann.
Danke! :-)
<script>
$(function() {
g = new Dygraph(
[...]
);
g.ready(function(){
g.setAnnotations([{
series: "Türe",
x: "2015/05/09 11:12",
text: "Tür geöffnet",
icon: "http://wopr:8083/fhem/images/openautomation/fts_door_open.svg",
height: 20,
width: 20,
cssClass: "dygraph-annotation"
},
[...]
]);
jQuery(".dygraph-annotation img").each(function(){
var $img = jQuery(this);
var imgID = $img.attr("id");
var imgClass = $img.attr("class");
var imgURL = $img.attr("src");
jQuery.get(imgURL, function(data) {
// Get the SVG tag, ignore the rest
var $svg = jQuery(data).find("svg");
// Add replaced image"s ID to the new SVG
if(typeof imgID !== "undefined") {
$svg = $svg.attr("id", imgID);
}
// Add replaced image"s classes to the new SVG
if(typeof imgClass !== "undefined") {
$svg = $svg.attr("class", imgClass+" replaced-svg");
}
// Remove any invalid XML tags as per http://validator.w3.org
$svg = $svg.removeAttr("xmlns:a");
$svg.attr("width",$img.attr("width"));
$svg.attr("height",$img.attr("height"));
// Replace image with new SVG
$img.replaceWith($svg);
}, "xml");
})
});
});
</script>und CSS:
.dygraph-annotation path {
fill: white;
}Im Grunde kann man dabei nur über drei Dinge stolpern:
- die SVGs können erst in g.ready() ersetzt werden, in $(document).ready() stehen sie noch nicht sofort zur Verfügung
- die CSS-Klasse muss man selbst setzen
- der Selector "img.svg" muss durch "img" ersetzt werden
Zitat von: Phil__ am 13 Mai 2015, 19:35:51
Vor einer ganzen Zeit war hier mal ein Problem mit dem verzögerten (mehrere Sekunden) bzw. nicht vollständigen Laden von Widgets auf einer Seite mit vielen Widgets die Sprache.
Ich habe immer noch das Problem das auf vielen meiner Seiten ein Timing-Problem besteht. Vor allem auf Seiten mit sehr vielen Widgets. Siehe meine Screenshots ein paar Seiten weiter vorne, zB heating, Wetter, home.
Gibt es da eine Lösung bzw Tipps um das Problem etwas zu bessern?
Viele Grüsse
1. Kann mir dazu jemand was sagen?
2. Kann ich die Probleme irgendwie beheben?
3. Haben noch mehr hier diese Probleme?
4. Falls ihr mehr Infos braucht, welche?
Viele Grüße
Moin Moin,
mal nee Frage in die Runde, wie kann ich die CPU Temp anzeigen lassen?
Nutze SYSMON.
<div type="label" data-device="cpu_temp" data-get="temperature" data-fix="1" data-unit="%B0C%0A" class="cell big"></div>
das geht nicht.
MFg MJoomla
Zitat von: mjoomla am 15 Mai 2015, 11:00:17<div type="label" data-device="cpu_temp" data-get="temperature" data-fix="1" data-unit="%B0C%0A" class="cell big"></div>
Muss das nicht data-get="cpu_temp" heißen und statt "cpu_temp" bei data-device den Namen Deines SYSMON-Devices?
Gruß,
Thorsten
Zitat von: mjoomla am 15 Mai 2015, 11:00:17
Moin Moin,
mal nee Frage in die Runde, wie kann ich die CPU Temp anzeigen lassen?
Nutze SYSMON.
<div type="label" data-device="cpu_temp" data-get="temperature" data-fix="1" data-unit="%B0C%0A" class="cell big"></div>
das geht nicht.
MFg MJoomla
data-device muss dein sysmon device sein und data-get="CPU_temp"
Ich versuche gerade die Player-Steuerung für meinen MPD anzupassen. Deshalb möchte ich, dass die Play- oder Stop-Taste den aktuellen Status des Players (also Play oder Stop) mittels on-color wiedergibt. Dummerweise wird der richtige Status nur bei einem Refresh der Seite angezeigt. Clicke ich bei laufendem Player auf Stop, dann sind beide Icons mit der on-color eingefärbt. Zudem ist die Logik der Switches ein Toggle zwischen Play und Stop. Die beiden Icons sollen aber dezidiert nur jeweils für Play oder Stop zuständig sein. Wo liegt mein Denkfehler?
<div data-type="switch"
data-device="Wohnzimmer.MPD"
data-get="state"
data-get-on="play"
data-get-off="stop"
data-icon="fa-play"
data-background-icon="-"
data-set="play"
data-on-color="#aa6900"
data-off-color="#505050"
class="inline">
</div>
Zitat von: viegener am 14 Mai 2015, 13:27:30
Ich habe mal mit widget_pagetab herumgespielt und habe eine Lösung gebaut, die bei mir auch beim Refresh die richtige Seite lädt.
Die geänderte widget_pagetab.js anbei, vielleicht kann das ja jemand ausprobieren, der eine komplexere Umgebung hat.
Habe es getestet. Funktioniert bei mir auch prima. So komplex ist aber meine Umgebung auch nicht.
Danke.
Wäre super, wenn es übernommen wird.
Risiko
Zitat von: tomster am 15 Mai 2015, 11:30:40
Ich versuche gerade die Player-Steuerung für meinen MPD anzupassen. Deshalb möchte ich, dass die Play- oder Stop-Taste den aktuellen Status des Players (also Play oder Stop) mittels on-color wiedergibt. Dummerweise wird der richtige Status nur bei einem Refresh der Seite angezeigt. Clicke ich bei laufendem Player auf Stop, dann sind beide Icons mit der on-color eingefärbt. Zudem ist die Logik der Switches ein Toggle zwischen Play und Stop. Die beiden Icons sollen aber dezidiert nur jeweils für Play oder Stop zuständig sein. Wo liegt mein Denkfehler?
Schau mal Demo: schlafzimmer-mpd.php (http://fhem.nesg.es/demo/room/schlafzimmer-mpd.php) und den Code dazu unter schlafzimmer-mpd.html (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/html/room/schlafzimmer-mpd.html). Da wird der Status zwar nicht in den Play- und Stop-Buttons dargestellt, aber unten rechts in dem grauen symbol-Widget (Zeile 820ff im Code). In der Demo bleibt er immer auf "Play", hängt ja kein echtes Fhem dran das den Status wechseln würde.
@ nesges: Kannst Du ein paar Sätze zu deinem Pizza-Timer verlieren? Welche Funktion haben die "mobilen-Devices"? Wird nach dem Countdown ein Sound abgespielt?
@tomster:
Rein theoretisch sollte es passen. Es gibt in der Readme auch ein Beispiel für eine Toggle-Group, da wird es ähnlich gemacht.
Werden denn auch die angegebenen Status im Reading state sofort gesetzt? Ggf. Bei data-off="!on" benutzen.
Zitat von: bjoernbo am 15 Mai 2015, 12:07:26
@ nesges: Kannst Du ein paar Sätze zu deinem Pizza-Timer verlieren? Welche Funktion haben die "mobilen-Devices"? Wird nach dem Countdown ein Sound abgespielt?
Ja, genau. Das Herzstück davon sind dieses beiden Funktionen:
sub pizzatimer($$) {
my $timer = shift;
my $seconds = shift;
my $human = seconds_humanreadable($seconds);
my $time = sprintf "%02d:%02d:%02d", (gmtime($seconds))[2,1,0];
my $endtime = sprintf "%02d:%02d:%02d", (localtime(time()+$seconds))[2,1,0];
my $signaldevice = ReadingsVal($timer, 'signaldevice', 'monitroid');
fhem("delete $timer"."_at") if Value($timer."_at");
if($seconds>0) {
my $message = 'Signal in '.$human;
say($signaldevice, $message);
fhem("define $timer"."_at at +$time {pizzatimer_ready('$timer')}");
fhem("set $timer $endtime");
} else {
fhem("set $timer -");
}
}"pizzatimer" wird direkt aus FTUI aufgerufen und hat als Parameter einen Dummy (der nichts weiter tut als sich die Zeit zu merken) und die Auslösezeit in Sekunden ab jetzt. Das Device meldet sich dann kurz (
say($signaldevice, $message)) und legt ein at an, nachdem pizzatimer_ready aufgerufen wird:
sub pizzatimer_ready($) {
my $timer = shift;
my $signaldevice = ReadingsVal($timer, 'signaldevice', 'monitroid');
fhem("delete $timer"."_at");
fhem("set $timer -");
if($signaldevice =~ /all|monitroid|handy/i) {
autoremote($signaldevice, 'Timer Ready');
}
if($signaldevice =~ /all|water/i) {
eventghost('WATER', 'Timer Ready');
}
if($signaldevice =~ /all|fritz/i) {
fhem("set FRITZ ring 610 play:http://wopr/sound/Cuckoo-clock-sound.mp3");
}
}
"pizzatimer_ready" löscht den Timer und entscheidet abhängig vom signaldevice wie der Alaram auszulösen ist.
Zitat von: setstate am 15 Mai 2015, 12:10:16
@tomster:
Rein theoretisch sollte es passen. Es gibt in der Readme auch ein Beispiel für eine Toggle-Group, da wird es ähnlich gemacht.
Werden denn auch die angegebenen Status im Reading state sofort gesetzt? Ggf. Bei data-off="!on" benutzen.
Ja, die state-Readings werden sofort gesetzt. Wenn ich als Widget anstatt "switch" "symbol" angebe, dann funktioniert die Statusanzeige auch "in Echtzeit". Allerdings auch nur einmal. Nur als Switch mag es gleich gar nicht...
Zitat von: viegener am 14 Mai 2015, 01:44:24
Ich hatte gerade eine (für mich) überraschende Erkenntnis:
Wenn man wie beschrieben das tablet UI in das www-Verzeichnis von FHEM packt, so wird der url fhem/tablet/... gar nicht durch die HTTPSRV behandelt sondern durch das FHEMWEB-Modul. Das ist eigentlich auch ganz einsichtig, denn die Verzeichnisse unter www werden ja alle über http bereitgestellt.
Nur wenn der URL-Pfad in der HTTPSRV-Definition vom Dateipfad abweicht läuft das ganze über die HTTPSRV-Definition
Ich denke das ist die Erklärung für die verschiedenen Probleme mit relativen Pfaden, die ich bisher HTTPSRV zugeschrieben habe. Zuletzt mit dem clicksound-Widget, das wahrscheinlich bei niemandem mit einer Standardinstallation läuft (zumindest habe ich noch keine positive Rückmeldung). Wenn ich das HTTPSRV Define auf
define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UIändere, treten die bisher bekannten Probleme nicht auf. Ich denke wir sollten das statt der bisherigen Definition in den Standard aufnehmen. https://github.com/knowthelist/fhem-tablet-ui/pull/90 wäre damit auch obsolet.
@setstate, danke, mit dem circlemenu funkt. das nun.
kann mir mal noch jemand erklären oder mir einen Link zu Erklärungen geben was hier genau passiert:
data-icons='["fa-wrench"]'
data-get-on='["[12]*[0-9]","[3456][0-9]","([789][0-9]|100)"]'
data-on-colors='["#855","#a55","#d55"]'
Vor allem Zeile 2 (Zeile 3 hat dann zu jedem Wert(ebereich) eine andere Farbe, richtig?).
@nesges, bei mir funktioniert das clicksound Widget jetzt (hatte ich im anderen Thread ja bereits gesagt) mit Standardinstallation und der expliziten Angabe der index.html (Sonst lief es auch aber ließ sich nicht klicken aus dem FHEMWEB, Ohne / ging auch alles nur das Widget nicht).
So hab ich es jetzt:
define TABLETUI HTTPSRV tablet/index.html ./www/tablet Tablet UI
Moin Moin,
@Pferdekaemper & Phil__ danke hat geklappt.
MFG MJoomla
Nabend, ich verzweifel grad an einem "symbol" mit verschiedenen Stati :/
Mein Code:
<li>
<div data-type="symbol" data-device="HUEDevice2"
data-get-on='["[12][0-9]","[3456][0-9]","([789][0-9]|100)"]'
data-get-off="off"
data-on-colors='["#ffffcc","#ffcc99","#ccff99"]'
data-background-icon="fa-circle-thin"
data-icon="fa-lightbulb-o" >
</div>
</li>Der Status bei gedimmtem Licht kommt als dimXX% ... zum Bsp.: dim56%
leider verändert sich nix ... die regExen müssten doch passen, oder? :(
Was muss bei data-on-colors rein? In der Doku steht:
Zitatdata-on-colors Name des Font-Awesome Hintergrund Icon. 'fa-circle'
Im Beispiel aber:
Zitatdata-on-colors='["Crimson","GoldenRod","SeaGreen"]'
Einmal sinds Icons einmal Farben?
Fangen wir mal mit den Regexen an:
Zitat von: update71 am 15 Mai 2015, 23:47:35
data-get-on='["[12][0-9]","[3456][0-9]","([789][0-9]|100)"]'
Heisst zu Deutsch:
[12][0-9] => 10 bis 29
[3456][0-9] => 30 bis 60
([789][0-9]|100) => 70 bis 100
ZitatDer Status bei gedimmtem Licht kommt als dimXX% ... zum Bsp.: dim56%
Die Regexe müssen die Werte vollständig beschreiben, von daher müsstest du entweder /.*/ oder besser /dim/ und /%/ ergänzen. In etwa so (ungetestet):
data-get-on='["dim[12][0-9]%","dim[3456][0-9]%","dim([789][0-9]|100)%"]' ZitatWas muss bei data-on-colors rein? In der Doku steht:
data-on-colors Name des Font-Awesome Hintergrund Icon. 'fa-circle'
In der echten Doku (https://github.com/knowthelist/fhem-tablet-ui) steht das nicht, wo hast du's gefunden? Ist auf jeden Fall vollkommen falsch. In data-on-colors kommen CSS-Farbwerte oder CSS-Farbnamen.
PS: IT'S OVER
9000100!
Morgen,
danke, so passt es. Ich dachte es muss nur den Wert enthalten. Wieder was gelernt :)
ZitatIn der echten Doku steht das nicht, wo hast du's gefunden? Ist auf jeden Fall vollkommen falsch. In data-on-colors kommen CSS-Farbwerte oder CSS-Farbnamen.
http://www.fhemwiki.de/wiki/FHEM_Tablet_UI
bei der Beschreibung von "Symbol".
Als nächstes werde ich mich dann an die pagetabs machen, hab das nur noch nicht gerafft wie die Aufteilung der Seiten sein muss und was wo hin muss ^^
Ist im Wiki jetzt korrigiert
Sorry ... ich schon wieder:
so ganz hauts doch noch nicht hin. Die Farben ändern sich wie gewollt nur geht es nun nicht mehr aus wenn ich auf off gehe. Nach einem refresh der Seite wird der Staus richtig angezeigt.
<div data-type="symbol" data-device="HUEDevice2"
data-get-on='["on","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%"]'
data-get-off="off"
data-on-colors='["#ffffff","#666666","#999999","#cccccc"]'
data-background-icon="fa-circle-thin"
data-icon="fa-lightbulb-o" >
</div>
Kann nochmal jemand rüberschauen?
brauche von euch mal Unterstützung. Ich will mit den UI diverse TV Sender ansteuern. Dies erfolgt über "push" mit
Zitatdata-cmd="...."
Nur gefällt mir die Darstellung nicht!
Mit
Zitat...img src="........"
kann ich ja kein Kommando übergeben. Es soll aber auf jeden Fall das Senderlogo enthalten sein.
Seid's mir nicht bös, aber das Switch-Widget kostet mich noch den letzten Nerv...
Das Schalten von "normalen" Homematic-Devices funktioniert einwandfrei, aber jegliche Versuche damit andere Devices wie einen MPD-Player oder den Denon-Netzwerkplayer meines Sohns zu schalten scheitern kläglich. Die zu sendenden/pollenden Daten klappen einfach nicht...
Hier Mal der Code zum Denon (um ein "Mute" zu erreichen, damit man nicht wie ein Berserker durchs Haus Brüllen muss, wenn der Bub Mal wieder alles auf Vollanschlag hört):
<div class="cell right">
<div data-type="label" class="small">Audio Mute</div>
<div data-type="switch"
data-device="Ludwig.Denon"
data-get="mute"
data-set-on="on"
data-set-off="off"
data-icon="fa-music"
data-background-icon="-"
data-on-color="#aa6900"
data-off-color="#505050"
class="small"></div>
</div>
Wenn ich die Doku richtig verstanden habe, dann setze ich zunächst mit <data-device> das Gerät und mit <data-get> das gewünschte Reading. Beim Aufruf der Seite wird der aktuelle Status (in meinem Fall mute:off) korrekt dargestellt. Klicke ich nun auf das Icon, dann wird aber nicht "set Ludwig.Denon mute on" gesetzt sondern nur "set Ludwig.Denon on". Zudem wird das Icon vom color-Wert auf "on" gesetzt, obwohl sich ja das Reading "mute" gar nicht verändert hat. Zur Erinnerung: es wurde ja zuvor nur das Gerät auf "on" geschalten, nicht das Reading/mute...
Ist da noch etwas
a. in der Logik des Widgets falsch
b. in meinem Kopf etwas falsch
oder
c. beides?
Vielleicht hab ich aber auch Mal wieder irgendwo irgendetwas überlesen...
mir ist aufgefallen dass innerhalb von "circlemenu" ein "data-cmd" egal ob der Typ "push" oder "button" ist, nicht funktioniert. Kann das jem. bestätigen?
Zitat<div class="container">
<header>TV Optionen</header>
<div data-type="circlemenu" class="cell circlemenu" data-direction="left" data-circle-radius="60"><br>
<ul>
<li><div data-type="symbol"
data-icon="font1-tv"
data-on-background-color="rgb(111,69,120)"
data-off-background-color="rgb(111,69,120)"
data-on-color="rgb(255,255,255)"
data-off-color="rgb(255,255,255)"
data-background-icon="fa-circle">
</div>
</li>
<li><div data-type="button"
data-on-background-color="rgb(153,204,0)"
data-on-color="white"
data-icon="fa-volume-off"
data-cmd="set hub command 15781875 Mute">
</div></li>
<li><div data-type="push"
data-on-background-color="rgb(71,163,117)"
data-icon="fa-cube"
data-on-color="white"
data-cmd="set hub command lg-fernseher 3D">
</div></li>
</ul>
</div>
Zitat von: tomster am 16 Mai 2015, 12:47:56
Seid's mir nicht bös, aber das Switch-Widget kostet mich noch den letzten Nerv...
Das Schalten von "normalen" Homematic-Devices funktioniert einwandfrei, aber jegliche Versuche damit andere Devices wie einen MPD-Player oder den Denon-Netzwerkplayer meines Sohns zu schalten scheitern kläglich. Die zu sendenden/pollenden Daten klappen einfach nicht...
Hier Mal der Code zum Denon (um ein "Mute" zu erreichen, damit man nicht wie ein Berserker durchs Haus Brüllen muss, wenn der Bub Mal wieder alles auf Vollanschlag hört):
<div class="cell right">
<div data-type="label" class="small">Audio Mute</div>
<div data-type="switch"
data-device="Ludwig.Denon"
data-get="mute"
data-set-on="on"
data-set-off="off"
data-icon="fa-music"
data-background-icon="-"
data-on-color="#aa6900"
data-off-color="#505050"
class="small"></div>
</div>
Wenn ich die Doku richtig verstanden habe, dann setze ich zunächst mit <data-device> das Gerät und mit <data-get> das gewünschte Reading. Beim Aufruf der Seite wird der aktuelle Status (in meinem Fall mute:off) korrekt dargestellt. Klicke ich nun auf das Icon, dann wird aber nicht "set Ludwig.Denon mute on" gesetzt sondern nur "set Ludwig.Denon on". Zudem wird das Icon vom color-Wert auf "on" gesetzt, obwohl sich ja das Reading "mute" gar nicht verändert hat. Zur Erinnerung: es wurde ja zuvor nur das Gerät auf "on" geschalten, nicht das Reading/mute...
Ist da noch etwas
a. in der Logik des Widgets falsch
b. in meinem Kopf etwas falsch
oder
c. beides?
Vielleicht hab ich aber auch Mal wieder irgendwo irgendetwas überlesen...
Man muss folgendes mitgeben
data-set-on="mute on"
data-set-off="mute off"
Es wird nicht automatisch der Reading-Name aus data-get bei data-set-* mit verwendet.
Zitat von: update71 am 16 Mai 2015, 12:20:18
Sorry ... ich schon wieder:
so ganz hauts doch noch nicht hin. Die Farben ändern sich wie gewollt nur geht es nun nicht mehr aus wenn ich auf off gehe. Nach einem refresh der Seite wird der Staus richtig angezeigt.
<div data-type="symbol" data-device="HUEDevice2"
data-get-on='["on","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%"]'
data-get-off="off"
data-on-colors='["#ffffff","#666666","#999999","#cccccc"]'
data-background-icon="fa-circle-thin"
data-icon="fa-lightbulb-o" >
</div>
Kann nochmal jemand rüberschauen?
wenn ich das widget richtig "lese" dann wird falls get-on als Array angegeben wird get-off gar nicht mehr interpretiert ...
Zitat von: bjoernbo am 16 Mai 2015, 13:50:29
mir ist aufgefallen dass innerhalb von "circlemenu" ein "data-cmd" egal ob der Typ "push" oder "button" ist, nicht funktioniert. Kann das jem. bestätigen?
Beim Button gibt es data-fhem-cmd
Beim Push data-cmd, das default 'set' ist
ah...Danke! Funtzt. Jetzt brauche ich nur noch eine Lösung für die Senderlogos ;D
Zitat von: setstate am 16 Mai 2015, 13:55:56
Man muss folgendes mitgeben
data-set-on="mute on"
data-set-off="mute off"
Es wird nicht automatisch der Reading-Name aus data-get bei data-set-* mit verwendet.
Ahh, jetzt, ja! Das Denon-Muting funktioniert damit. Danke für den Stupser!
Probleme hab ich immer noch mit dem Starten/Stoppen des MPD. Die <set>'s funktionieren, aber die Anzeige der Icons stimmt nicht.
<div data-type="switch"
data-device="Wohnzimmer.MPD"
data-get="STATE"
data-get-on="stop"
data-get-off="!stop"
data-icon="fa-stop"
data-background-icon="-"
data-set-on="stop"
data-on-color="#aa6900"
data-off-color="#505050"
class="inline">
</div>
<div data-type="switch"
data-device="Wohnzimmer.MPD"
data-get="STATE"
data-get-on="play"
data-get-off="!play"
data-icon="fa-play"
data-background-icon="-"
data-set-device="Wohnzimmer.MPD"
data-set="play"
data-on-color="#aa6900"
data-off-color="#505050"
class="inline">
</div>Beim ersten Aufruf der Seite stimmen die angezeigten Stati (Play in off-color; Stop in on-color). Klicke ich nun auf Start, wird korrekt <set Wohnzimmer.MPD play> an FHEM geschickt. Nun sind aber beide Icons in on-color. Eigentlich sollte Stop in den off-color wechseln. Erst ein erneuter Refresh lässt die Stati korrekt erscheinen. Kann das daran liegen, dass beide Widgets auf den quasi-gleichen Status zugreifen?
Zitat von: bjoernbo am 16 Mai 2015, 12:43:03
brauche von euch mal Unterstützung. Ich will mit den UI diverse TV Sender ansteuern. Dies erfolgt über "push" mit Nur gefällt mir die Darstellung nicht!
Mit kann ich ja kein Kommando übergeben. Es soll aber auf jeden Fall das Senderlogo enthalten sein.
Nimmt nur die IMG und dann zusätzlich onclick="setFhemStatus('set xyz on')" mit rein.
<img src="../bild.png" onclick="setFhemStatus('set SatReceiver switch channel4')" >
geniales UI!
Frage: 2 verschiedene Tablets, eines mit 800x600 und eins iPad Mini 3.
Beide sollen unterschiedliche Contents anzeigen, klappt das?
Zitat von: Phil__ am 15 Mai 2015, 10:23:18
[quote name="Phil__" post=294162 timestamp=1431538551]
Vor einer ganzen Zeit war hier mal ein Problem mit dem verzögerten (mehrere Sekunden) bzw. nicht vollständigen Laden von Widgets auf einer Seite mit vielen Widgets die Sprache.
Ich habe immer noch das Problem das auf vielen meiner Seiten ein Timing-Problem besteht. Vor allem auf Seiten mit sehr vielen Widgets. Siehe meine Screenshots ein paar Seiten weiter vorne, zB heating, Wetter, home.
Gibt es da eine Lösung bzw Tipps um das Problem etwas zu bessern?
Viele Grüsse
1. Kann mir dazu jemand was sagen?
2. Kann ich die Probleme irgendwie beheben?
3. Haben noch mehr hier diese Probleme?
4. Falls ihr mehr Infos braucht, welche?
Viele Grüße
[/quote]
Kann den dazu niemand was sagen?
Ich kann im Thread leider nichts finden.
Viele Grüsse
Zitat von: Nobby1805 am 16 Mai 2015, 13:59:21
wenn ich das widget richtig "lese" dann wird falls get-on als Array angegeben wird get-off gar nicht mehr interpretiert ...
Dann muss ich den off Status auch mit über das Array geben? Ich werds versuchen.
Danke
Zitat von: update71 am 16 Mai 2015, 15:40:22
Dann muss ich den off Status auch mit über das Array geben? Ich werds versuchen.
Danke
Genau, dann wird es klappen. Wenn data-get-on ein Array ist, müssen alle Status dort drin sein. data-get-off wird dann ignoriert. (könnte man vllt. auch noch ändern, wenn das intuitiver ist, was denkt ihr?)
z.B. so:
data-get-on='["off","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%","on"]'
Zitat von: Phil__ am 16 Mai 2015, 15:20:43
1. Kann mir dazu jemand was sagen?
2. Kann ich die Probleme irgendwie beheben?
3. Haben noch mehr hier diese Probleme?
4. Falls ihr mehr Infos braucht, welche?
Viele Grüße
Kann den dazu niemand was sagen?
Ich kann im Thread leider nichts finden.
Viele Grüsse
Hallo Phil_,
leider habe ich auch keine Lösung ... Ich kann FTUI mit meinem iPhone auch nicht nutzen (bzw. muss 10mal Refresh drücken, bis ich die Seite mal vollständig bekomme). Alle anderen Geräte zeigen keine Probleme.
Wird es bei dir besser, wenn du weniger Widgets benutzt?
Eventuell sehe ich eine Besserung, wenn wir mit FTUI zu WebSockets als Verbindung wechseln.
Hier gibt es ein paar Ansätze: http://forum.fhem.de/index.php/topic,28634.0.html
Oder auch wie bei http://www.fhemwiki.de/wiki/Fronthem
Aber das ist nur ein Weg, wenn die Installation so einfach, wie jetzt bleibt oder das meiste schon in der Basisinstallation von FHEM mit dabei ist.
Hallo setstate,
für meine MAX! Thermostate habe ich eine Verbesserung von nesges übernommen, damit die Temperatureinstellungen auf auto bleiben!
Somit bleibt mein Wochenprogramm immer aktiv.
<div data-type="thermostat" data-device="HZ_Spielzimmer" data-valve="valveposition" data-get="desiredTemperature" data-set="desiredTemperature auto" data-temp="temperature"
data-off="off" data-boost="boost" data-min="5" data-max="30" class="big"></div>
Kannst Du in deinem WIKI einbinden.
Hallo nesges,
dein DEMO ist enorm! Bringt mich auf viele Ideen.
Frage: Wie hast Du das circlemenu abgeändert, so dass alle Widges ein farbiges Symbol darstellen?
Das mittlere konnte ich nach setstates vorschlag aus diesem Thread ändern, aber an den anderen scheitere ich noch.
Hast du ein Beispiel für mich?
Gruß
Ralf
Zitat von: setstate am 16 Mai 2015, 16:41:18
Hallo Phil_,
leider habe ich auch keine Lösung ... Ich kann FTUI mit meinem iPhone auch nicht nutzen (bzw. muss 10mal Refresh drücken, bis ich die Seite mal vollständig bekomme). Alle anderen Geräte zeigen keine Probleme.
Wird es bei dir besser, wenn du weniger Widgets benutzt?
Eventuell sehe ich eine Besserung, wenn wir mit FTUI zu WebSockets als Verbindung wechseln.
Hier gibt es ein paar Ansätze: http://forum.fhem.de/index.php/topic,28634.0.html
Oder auch wie bei http://www.fhemwiki.de/wiki/Fronthem
Aber das ist nur ein Weg, wenn die Installation so einfach, wie jetzt bleibt oder das meiste schon in der Basisinstallation von FHEM mit dabei ist.
Auf Seiten mit wenig Widgets konnte ich das Problem weniger beobachten.
Habe die Probleme auch am PC (Ubuntu, Firefox, LAN-Kabel) aber nur ganz selten, viel schlimmer und immer ist es auf dem Nexus 7 (WLAN, WVC)
Könnte das Problem auch mit dem Fhem Webserver zusammen hängen?
Gibt es denn schon erste Gehversuche bzw Erfolge bezüglich FTUI und Websockets/fronthem?
ZitatGenau, dann wird es klappen. Wenn data-get-on ein Array ist, müssen alle Status dort drin sein. data-get-off wird dann ignoriert. (könnte man vllt. auch noch ändern, wenn das intuitiver ist, was denkt ihr?)
Wäre vielleicht nicht schlecht. Ich habe jetzt noch das Problem dass der Hintergrund KEINEN off Status mehr kennt. Ist immer orange der fa-circle-thin
Hab jetzt schon mit data-on(off)-background-color gespielt aber leider ohne Erfolg.
data-get-on ist ein array in denen die Stati des Devices stehen (on, off, dim, whatever, etc.)
data-on-colors ist ein array welche die Farben des Data-Icons ändert ... soweit korrekt?
Wie änder ich nun die Farben das Background Icons abhängig vom Status?
Bitteschön:
<div data-type="symbol" data-device="HUEDevice1"
data-get-on='["off","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%","on"]'
data-on-colors='["#444444","#666666","#999999","#cccccc","#ffffff"]'
data-on-background-colors='["#444444","#666666","#999999","#cccccc","#ffffff"]'
data-background-icon="fa-circle-thin"
data-icon="fa-lightbulb-o" >
</div>
Danke setstate, hab ich das übersehen oder ist das so nicht dokumentiert. ich hatte nur ohne "s" hinten gefunden :)
Danke, danke, danke und weiter so *daumenhoch*
Zitat von: Phil__ am 16 Mai 2015, 17:20:41
Auf Seiten mit wenig Widgets konnte ich das Problem weniger beobachten.
Habe die Probleme auch am PC (Ubuntu, Firefox, LAN-Kabel) aber nur ganz selten, viel schlimmer und immer ist es auf dem Nexus 7 (WLAN, WVC)
Könnte das Problem auch mit dem Fhem Webserver zusammen hängen?
Gibt es denn schon erste Gehversuche bzw Erfolge bezüglich FTUI und Websockets/fronthem?
Ich habe hier bei mir eine Lösung mit NodeJS und WebSockets am laufen, vielleicht könnte man das zumindest so eingrenzen. Da ich deutlich weniger Widgets einsetze als du (zumindest wenn ich deine Screenshots aus den Postings weiter vorne im Thread anschaue) wäre es vielleicht einen Versuch wert, dass mal so zu testen.
Dazu müsstest du aber NodeJS und NPM auf deinem FHEM-Server am laufen haben, die Variante die ich am laufen habe, ist auch noch nicht auf anderen Installationen getestet worden, trotzdem wäre es denke ich einen Versuch wert, wenn du der Meinung bist du "traust dir das zu".
Zitat von: rretsiem am 16 Mai 2015, 22:32:59
Ich habe hier bei mir eine Lösung mit NodeJS und WebSockets am laufen, vielleicht könnte man das zumindest so eingrenzen. Da ich deutlich weniger Widgets einsetze als du (zumindest wenn ich deine Screenshots aus den Postings weiter vorne im Thread anschaue) wäre es vielleicht einen Versuch wert, dass mal so zu testen.
Dazu müsstest du aber NodeJS und NPM auf deinem FHEM-Server am laufen haben, die Variante die ich am laufen habe, ist auch noch nicht auf anderen Installationen getestet worden, trotzdem wäre es denke ich einen Versuch wert, wenn du der Meinung bist du "traust dir das zu".
Einen Versuch wäre es wert! Nodejs uns npm installieren soll nicht das Problem sein. Aber eine kleine Erläuterung der weiteren genauen Umsetzung ware super!?
Zitat von: Phil__ am 16 Mai 2015, 22:42:03
Einen Versuch wäre es wert! Nodejs uns npm installieren soll nicht das Problem sein. Aber eine kleine Erläuterung der weiteren genauen Umsetzung ware super!?
Klären wir erstmal via PM um den Thread hier "sauber zu halten" und das zu testen. Ich schreibe dich mal direkt an.
Zitat von: fh168 am 16 Mai 2015, 15:18:28
geniales UI!
Frage: 2 verschiedene Tablets, eines mit 800x600 und eins iPad Mini 3.
Beide sollen unterschiedliche Contents anzeigen, klappt das?
Da beim UI html-Seiten aufgerufen werden, mach doch einfach unterschiedliche Seiten. Oder wie sieht deine Anwendung konkret aus?
@mw_fhem
Danke, ich habe es hinbekommen. Wieder ein Tablet "zum an die Wand hängen".
Zitat von: update71 am 16 Mai 2015, 21:22:35
Danke setstate, hab ich das übersehen oder ist das so nicht dokumentiert. ich hatte nur ohne "s" hinten gefunden :)
Das steht auch weder im Wiki noch in der, wie nesges schrieb, echten Doku ;)
im Wiki korrigiere ich das jetzt
Hallo.
Ich benötige mal Hilfe beim Dimmer.
Im Device kann man state und dimlevel getrennt Lesen und Setzen
Im Widget kann nur ein Parameter abgefragt werden, somit bekomme ich entweder den state oder den Dim-Wert synchron.
Setzen kann man über das Widget ja auch beides. Fehlt da nicht noch ne Möglichkeit den zweiten Parameter abzufragen?
Mit folgendem Code geht AN,AUS, DIM-Wert Setzen aber eben nicht Lesen. Wenn man also den Dimlevel wo anders ändert, bekommt das Widget es nicht mit.
<div data-type="dimmer" data-device="WZ_Dimmer" class="cell"
data-get="state" data-get-on="on" data-get-off="off" data-set="dimlevel"></div>
Risiko.
Zitat von: Risiko am 17 Mai 2015, 10:19:04
Hallo.
Ich benötige mal Hilfe beim Dimmer.
Im Device kann man state und dimlevel getrennt Lesen und Setzen
Im Widget kann nur ein Parameter abgefragt werden, somit bekomme ich entweder den state oder den Dim-Wert synchron.
Setzen kann man über das Widget ja auch beides. Fehlt da nicht noch ne Möglichkeit den zweiten Parameter abzufragen?
Mit folgendem Code geht AN,AUS, DIM-Wert Setzen aber eben nicht Lesen. Wenn man also den Dimlevel wo anders ändert, bekommt das Widget es nicht mit.
<div data-type="dimmer" data-device="WZ_Dimmer" class="cell"
data-get="state" data-get-on="on" data-get-off="off" data-set="dimlevel"></div>
Risiko.
Das ist zur Zeit bewusst so gebaut. Es gibt Devices, die bei OFF auch den Dim-Wert auf 0 setzen, dann könnte man beim nächsten mal nicht mehr einschalten. Das Dimmer Widget ist mehr statisch gedacht: ich kann das Device zwischen Off und Dim-X hin und her toggeln.
Man könnte noch einen Reading-Channel einbauen für get dim, um auf externe Änderungen des Levels zu reagieren, aber dann müsste noch eine Logik dahinter, die die Plausibilität des Werten prüft.
Zitat von: setstate am 17 Mai 2015, 11:50:11
Das ist zur Zeit bewusst so gebaut. Es gibt Devices, die bei OFF auch den Dim-Wert auf 0 setzen, dann könnte man beim nächsten mal nicht mehr einschalten.
Das ist ja wirklich blöde. Meiner Meinung nach aber eher ein Problem des Devices.
Zitat von: setstate am 17 Mai 2015, 11:50:11
Man könnte noch einen Reading-Channel einbauen für get dim, um auf externe Änderungen des Levels zu reagieren, aber dann müsste noch eine Logik dahinter, die die Plausibilität des Werten prüft.
Was meinst du mit Logik und Plausibilität? Dachte da eher an einen optionalen Channel für get dim.
Würdest du das angehen oder sollte ich mal einen Vorschlag\Variante ausarbeiten?
Würden das dann wohl eher in dem anderen Thread weiter diskutieren!?
Risiko
Zitat von: Risiko am 17 Mai 2015, 12:28:35
Das ist ja wirklich blöde. Meiner Meinung nach aber eher ein Problem des Devices.
Was meinst du mit Logik und Plausibilität? Dachte da eher an einen optionalen Channel für get dim.
Würdest du das angehen oder sollte ich mal einen Vorschlag\Variante ausarbeiten?
Würden das dann wohl eher in dem anderen Thread weiter diskutieren!?
Risiko
Ja, ich dachte an data-dim. Aber beim Update soll der nicht einfach übernommen werden, sonder eine Plausi-Check-Logik soll prüfen, ob es sinnvolle Werte sind -> z.B. 0,100,off,on ausgeschlossen.
Wenn du Lust hast, kannst du gerne die Anpassung versuchen, ich bin gerade mit dem Aufbau meines MPD Servers und die Einbindung ins GUI eingebunden.
Aber bitte bei jeder Zeile Code überlegen, ob es auch einfach und mit weniger Code funktioniert. Genau wie das UI, soll auch der Code minimalistisch gehalten werden. Beim Thermostat kann man auch gut sehen, wie mehrere Reading beachtet werden. Es sollten eigentlich nur 4-5 Zeilen hinzukommen: Im init Teil den Default Wert festlegen und ins Werteholen von FHEM mit aufnehmen: "readings[$(this).data('dim')] = true;" und dann im Update Teil "elem.setDimValue( parseInt(val));" setzen, wenn es Sinn macht - vom Wert her.
Wie kann ich 2 Kommandos nacheinander absetzten. Ich muss auf den Kanal 62 wechseln. Hierzu muss ich erst die 6 und anschließend sofort die 2 senden.
Sofortiges senden funktioniert nicht:
Zitat<div data-type="button"
data-on-background-color="rgb(111,69,120)"
....
data-fhem-cmd="set hub command 24775848 Number62">
</div>
DANKE im voraus
Schreib bei data-fhem-cmd das rein, was du auch im FHEMWEB absetzen würdest. Also, das gleiche nochmal dahinter, mit Semikolon getrennt. (Ungetestet)
manchmal ist es echt zu einfach.
Danke.
So funzt es:
Zitatdata-fhem-cmd="set hub command 24775848 Number6;set hub command 24775848 Number2"
Hallo Mario,
kannst Du bitte beim Widget Level auch das "negated" dazu nehmen. Benutze es zu Anzeige des Rolladenstands, will es aber nicht wie beim Slider verändern.
Und hast Du noch einen Tipp?
Ich möchte das Level-Widget direkt neben dem Circlemenü haben. Der seitliche Abstand ist recht groß, somit passen die nicht zusammen in ein Gridster Feld. Hast Du eine Idee?
Und bei der Anzeige der Zisterne ist das Level etwas nach links gerutscht - keine Idee, warum es nicht mittig ist.
<div class="top-space left-space">
<div class="left">
<div data-type="switch" data-device="HM_396DFC" data-icon="fa-sort" class="darker small"></div>
<div data-type="label" class="darker large">Rolltor</div>
</div>
<div class="left top-space left-space-2x">
<div data-type="label" class="darker inline ">Zisterne: </div>
<div data-type="label" data-device="HM_339D6A" data-get="liter" data-unit=" l" class="darker inline "></div>
<div data-type="level" data-device="HM_339D6A" data-limits='[0,20,35]' data-colors='["#ac0014","#aa6900","seaGreen"]' class="horizontal "></div>
</div>
<div class="cell top-space right" >
<div data-type="label" class="darker">Frühbeet</div>
<div data-type="label" data-device="HM_2F220D" data-get="temperature" data-unit=" %B0C%0A" class="darker inline large"></div>
<div data-type="label" data-device="HM_2F220D" data-get="humidity" data-unit=" %" class="darker inline large"></div>
</div>
</div>
Generell werde ich mit der Positionierung nicht warm, vor allem wenn man längere Gridster Elemente hat. Da wäre ein Koordinatensystem für die Widgets toll.
Hallo,
ich würde gern FTUI aussenhalb von FHEM legen geht das und wie muss die abgeänderte
define tablet_ui HTTPSRV tablet/ ./www/tablet Tablet Frontend
lauten
mein Pfad ist /var/www/ftui
Danke im Vorraus
########################
erledigt
define tablet_ui HTTPSRV ftui/ /var/www/ftui FTUI
führte zum erfolg
Zitat von: setstate am 16 Mai 2015, 14:02:30
Beim Button gibt es data-fhem-cmd
Beim Push data-cmd, das default 'set' ist
Ins Button-Widget baue ich data-cmd als Alias für data-fhem-cmd ein, dann verhalten die beiden sich in dem Punkt gleich.
Zitat von: tomster am 16 Mai 2015, 14:15:01
data-get-off="!stop"
...
data-get-off="!play"
Beim ersten Aufruf der Seite stimmen die angezeigten Stati (Play in off-color; Stop in on-color). Klicke ich nun auf Start, wird korrekt <set Wohnzimmer.MPD play> an FHEM geschickt. Nun sind aber beide Icons in on-color. Eigentlich sollte Stop in den off-color wechseln. Erst ein erneuter Refresh lässt die Stati korrekt erscheinen. Kann das daran liegen, dass beide Widgets auf den quasi-gleichen Status zugreifen?
"!stop" und "!play" gibt es nicht. Wahrscheinlich hast du wegen "!on" angenommen, es gäbe einen !-Operator. Es ist einfacher: "!on" ist kein Keyword und bedeutet "alles ausser der Wert von data-get-on". Du willst hier also vermutlich in beiden Fällen "!on" verwenden.
Zitat von: fh168 am 16 Mai 2015, 15:18:28
Frage: 2 verschiedene Tablets, eines mit 800x600 und eins iPad Mini 3.
Beide sollen unterschiedliche Contents anzeigen, klappt das?
FTUI löst das Problem nicht, du kannst aber einfach zwei verschiedene HTML-Seiten anlegen und diese direkt aufrufen oder per Javascript passend umleiten.
Zitat von: pnewman am 16 Mai 2015, 17:10:56
Hallo nesges,
dein DEMO ist enorm! Bringt mich auf viele Ideen.
Frage: Wie hast Du das circlemenu abgeändert, so dass alle Widges ein farbiges Symbol darstellen?
Das mittlere konnte ich nach setstates vorschlag aus diesem Thread ändern, aber an den anderen scheitere ich noch.
Hast du ein Beispiel für mich?
Danke! :) Da die Demo komplett im Quellcode offen liegt, kannst du's dir direkt dort anschauen. Das Repository mit allen Sourcen findest du unter https://github.com/nesges/TabletUI-Demo-WOPR. Für den zentralen Button im Circle-Menü verwende ich idR ein symbol-Widget, für die äusserne button-Widgets. In denen setze ich data-off-background-color um die Farbe zu ändern.
Zitat von: Nobby1805 am 17 Mai 2015, 00:19:03
Das steht auch weder im Wiki noch in der, wie nesges schrieb, echten Doku ;)
im Wiki korrigiere ich das jetzt
War übrigens nicht böse gemeint :)
Zitat von: nesges am 17 Mai 2015, 23:59:18
War übrigens nicht böse gemeint :)
habe ich auch nicht so aufgefasst ;D
Nein, auf keinen Fall ... Gemeint war nur die Readme im Github Project. Die Ursprungsdoku ...
Die FHEM Wiki Seiten sind auch sehr gut, hoch frequentiert, und deshalb:
Vielen, vielen Dank an Mw fhem und Nobby1805 für die Pflege des FTUI FHEM Wiki
http://www.fhemwiki.de/wiki/FHEM_Tablet_UI (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI)
Gibt es eigentlich noch andere, die auch noch ReadingGroups haben, die sie auch auf dem Tablet UI recyclen wollen?
Ich habe dazu ein Quick&Dirty-Widget gebaut, dass solche Readings direkt auf dem Tablet zeigen kann:
<div class="cell">
<div data-type="dynamiclabel" data-device="showThermoLars" data-get="dummy" data-max-update="10" class="readings"></div>
</div>
Anbei ein Beispiel mit einer Readingsgroup aus dem fhemwiki zu einem Thermostatventil:
Das Modul findet sich ebenfalls anbei, zu beachten ist, dass man auch die fhemWeb-CSS-Infos benötigt, also z.B. so:
<link rel="stylesheet" href="/fhem/pgm2/darkstyle.css" />
man sollte dann aber BG-Image etc wieder in einem anderen CSS überschreiben...
Die Readingsgroup wird aber normalerweise NICHT über den update vom tablet UI upgedated, dazu ist eine Änderung in fhem-tablet-ui.js erforderlich. In function longPoll muss das if statement (zweitletzte Zeile)
var paraname = 'STATE';
var val = parname_val;
}
if ( (paraname in readings) && (key in devices) ){
var value = {"date": date,
durch folgende 2 Zeilen ersetzt werden, aber NUR die if-Zeile ersetzen,d er Rest bleibt unverändert.
// Special hack for readingsGroups (all params will be accepted)
if ( ( ( room == 'readingsGroup' ) && (key in devices) ) ||
( (paraname in readings) && (key in devices) ) ) {
Da aber bei jedem Update der Readingsgroup das HTML wieder erzeugt und abgefragt werden muss, gibt es den Parameter data-max-update="10" um die Abfragehäufigkeit auf einmal in x Sekunden (im Beispiel 10) zu begrenzen.
Gruss,
Johannes
Zitat von: tomster am 16 Mai 2015, 14:15:01
Beim ersten Aufruf der Seite stimmen die angezeigten Stati (Play in off-color; Stop in on-color). Klicke ich nun auf Start, wird korrekt <set Wohnzimmer.MPD play> an FHEM geschickt. Nun sind aber beide Icons in on-color. Eigentlich sollte Stop in den off-color wechseln. Erst ein erneuter Refresh lässt die Stati korrekt erscheinen.
Das Problem liegt eher im MPD Modul. Ich merke es auch gerade, als ich den Play-Schalter bei mir einbauen wollte.
Das MPD Modul sendet kein state oder STATUS mit beim longpoll update, deswegen kann man den aktuellen Player-Zustand nicht empfangen. Es kommen zwar Daten beim Song-Wechsel, aber das sind nur die Song-Metadaten, nicht der Playerstatus.
Deshalb breche ich hier erst einmal ab für heute ...
Hab's grad auch im MPD-Thread von Dir gelesen. Auf das wäre ich ehrlich gesagt nicht gekommen (liegt aber wohl mehrheitlich daran, dass ich keine Ahnung von den syntaktischen Abläufen in FHEM habe). Dadurch klingt aber das beschriebene Phänomen plausibel. Bisher dachte ich, ein vom UI (oder FHEMWeb) gesetztes "set <name> play" reicht aus, um FHEM-intern alles Notwendige zu veranlassen.
BTW, hab gestern noch ein Script gefunden, welches angeblich eine Art "Album Art Fetcher" für MPD sein soll. Auf Grund abermaliger syntaktischer Unzulänglichkeiten meinerseits kann ich aber dessen "Wert" für Dich im Bezug auf den Einbau in's UI nicht beurteilen:
https://pypi.python.org/pypi/MPD-Album-Art
Setzt jedoch anscheinend ein Last-FM-Account voraus...
Das hier setzt auf Perl:
http://www.sveinbjorn.org/get-album-artwork-id3-using-perl
Hallo,
hat jemand eine Lösung der Darstellung der Müllabfuhrtermine in FTUI und kann seine Lösung hier posten??
zB. wie in diesem Screenshot in einem früheren Post.
http://forum.fhem.de/index.php/topic,34233.msg295460.html#msg295460 (http://forum.fhem.de/index.php/topic,34233.msg295460.html#msg295460)
Viele Grüße
Hallo ich nochmal,
@setsate, nesges aber auch alle anderen ;)
Ich wurde in den letzten Tagen häufig wegen der Umsetzung meines FTUI's in den Screenshots auf den vorherigen Seiten angeschrieben.
Deshalb würde ich gerne allen den html Code zur verfügung stellen und nicht immer einzeln verschicken oder den Thread damit "zuspamen".
Hat von euch (vorallem setsate, nesges) jemand eine Idee wie man den Code hier am besten zum Download bereit stellt.
Meine Gedanken dazu, es sollte:
- übersichtlich sein
- nicht immer wieder auf zahlreichen Seiten verteilt, sondern gesammelt an einem definierten Ort sein
- Ich habe weiterhin die Hoffnung das es hier noch viele Leute gibt die Ihren html Code am besten auch mit Screenshots hier zur verfügung stellen wollen und somit möglichst viele profitieren. (und niemand das Rad zweimal erfinden muss ;) )
--> hier ein extra Thread aufmachen dafür oder ein GIT oder oder oder???
PS: Ich würde mich auch bereit erklären eine entsprechende Lösung zu verwalten und zu pflegen!
Viele Grüße
Phil
Gute Idee mit den Demos.
Ich würde vorschlagen, die Files und Screenshots bei github speichern
Im Fhem Wiki könnte man dann FTUI Unterseiten anlegen, mit Anzeige der Screenshots, Erklärungen und Links zum Download der entsprechenden Seiten passend zum Screenshot.
@setstate
Hast du meine PN bekommen? in meinem Postausgang wird nämlich nichts angezeigt ::)
Find ich prima! Bin auch der Meinung: Am besten eigenes Repository bei Github und nen eigenen Thread. Dieser hier wird schon merklich träger und übersichtlich ist halt auch anders ;)
Zitat von: Phil__ am 18 Mai 2015, 10:00:49
Hallo,
hat jemand eine Lösung der Darstellung der Müllabfuhrtermine in FTUI und kann seine Lösung hier posten??
zB. wie in diesem Screenshot in einem früheren Post.
http://forum.fhem.de/index.php/topic,34233.msg295460.html#msg295460 (http://forum.fhem.de/index.php/topic,34233.msg295460.html#msg295460)
Viele Grüße
Klar!
Ich vermute, dass bei den meisten Abfallkalender-Lösungen das Script von Hexenmeister zu Grunde liegt (zumindest bei mir):
http://forum.fhem.de/index.php/topic,32382.0.html
Da ich jedoch entgegen der von Dir geposteten Lösung die Anzeige innerhalb nur 1 Widgets haben wollte, habe ich mir ein DOIF + zugehörigem Dummy definiert, der die entsprechenden Stati (Restabfall, Bioabfall, etc.) einnimmt.
DOIF:
([abfallkalender:tomorrow] eq "Papier") (set du_abfallkalender Papier) DOELSEIF ([abfallkalender:tomorrow] eq "Restabfall") (set du_abfallkalender Restabfall) DOELSEIF ([abfallkalender:tomorrow] eq "Bioabfall") (set du_abfallkalender Bioabfall) DOELSEIF ([abfallkalender:tomorrow] eq "Leichtverpackungen") (set du_abfallkalender Leichtverpackungen) DOELSEIF ([abfallkalender:tomorrow] eq "Leichtverpackungen" && [abfallkalender:tomorrow] eq "Papier") (set du_abfallkalender PapGeS) DOELSE (set du_abfallkalender Nichts) Diese Stati lasse ich mir dann im UI mit folgendem Code anzeigen:
<div data-type="symbol"
data-device="du_abfallkalender"
data-icons='["fs-dustbin","fs-dustbin","fs-dustbin","fs-bag","fa-thumbs-o-up","fs-bag warn"]'
data-get-on='["Papier","Restabfall","Bioabfall","Leichtverpackungen","Nichts","PapGeS"]'
data-on-colors='["#01A3F5","#FFFFFF","#82550C","#FFFF00","#505050","#FFFF00"]'
class="narrow small">
</div>
Dabei wird an den Tagen -1, an denen keine Abholung erfolgt ein "Daumen-hoch"-Icon angezeigt. Am Vortag der Abholung dann das entsprechende Icon. Da ich dummerweise auch Tage habe, an denen 2 Abholungen (Papier/ Gelber Sack) erfolgen, hab ich für diesen Fall ein Sack-Icon mit Ausrufezeichen definiert. Diese Lösung gefällt mir zwar noch nicht so richtig, aber bis mir eine bessere Idee kommt, muss es halt so gehen.
Simpel und ohne viel Schnick-Schnack.
Also ein eigenes Repository (in einem vorhanden GIT oder einem neuen?) und eine Thread.
Wie sollte der Thread aussehen? Nur Screenshots mit htmls oder auch die entsprechenden Fragen dazu?
Bei der Demoinstallation (http://forum.fhem.de/index.php/topic,36063.0.html) und meinen Widgets (http://forum.fhem.de/index.php/topic,36122.0.html) versuche ich auch die Fragen dazu in den separaten Threads zu bündeln. Aber du hast da natürlich freie Hand.
Ich bin Mal wieder auf Hilfesuche. Diesmal zu einem 3-State-Reading-Switch (geiles Wort).
Szenario:
Ich wollte einen Switch anlegen, der mir den aktuellen Status des Netzwerkplayers meines Sohns anzeigt und mir die Möglichkeit bietet, vom Tablet aus einen "mute"-Befehl an den Player zu schicken, um lautes Durchs-Haus-Gebrülle bei meist vorliegender sohn'schen Terrorlautstärke zu vermeiden.
Der Netzwerkplayer stellt innerhalb zweier Device-Readings "power" (on/off) und "mute" (on/off) bereit. Also habe ich mir ein UserReading angelegt, welches die beiden Stati in einem Reading (currentStatus) zusammenfasst:
attr <device name Netzwerkplayer> userReadings currentStatus:(power|mute) { ((ReadingsVal("<device name Netzwerkplayer>","mute",0) eq "off")? ReadingsVal("<device name Netzwerkplayer>","power",""):"mute on")}
Damit erhalte ich, je nach Player-Status folgende Readings:
Player "mute" -> currentStatus = "mute on"
Player "on" && Mute "off" -> currentStatus = "on"
Player "off" -> currentStatus ="off"
Im UI hab ich folgendes definiert:
<div class="cell right">
<div data-type="label" class="small">Multimedia</div>
<div data-type="switch"
data-device="<device name Netzwerkplayer>"
data-get="currentStatus"
data-set-on="mute on"
data-set-off="mute off"
data-background-icon="-"
data-get-on='["off","on","mute on"]'
data-icons='["fa-music","fa-music","fa-music fa-blink"]'
data-on-colors='["#505050","#aa6900","#aa6900"]'
class="small"></div>
</div>
Prinzipiell ist die gewünschte Funktion gegeben. Die Icons werden richtig angezeigt und ich kann zwischen mute on/off togglen. Nur kann passieren, wenn der Player auf "mute on" steht und ich dann das UI aufrufe, dass das Icon (in meinem Fall) zwar richtigerweise blinkt, aber ein Klick den Befehl "set <device name Netzwerplayer> mute on" setzt. Der Player war aber bereits ge-mutet. Ich hatte eigentlich gedacht, dass der von meinem userReading übergebene Wert "mute on" das Widget bereits erkennen lässt, dass Mute schon gesetzt ist und deshalb als quasi nächster Toggle-Befehl logischerweise nur "mute off" in Frage käme (Drum habe ich absichtlich als Wert in currentStatus "mute on" gewählt und nicht nur "mute"). Hat jemand eine Erklärung für mich, warum der tatsächliche "Mute-Status" nicht auch in der toggle-Funktion gleich richtig erkannt wird?
Das switch-Widget ist nicht dafür geeignet mit mehreren get-on Status umzugehen. Es kann sie war anzeigen, aber es kann nicht korrekt dazu senden. Nimm dafür den multistatebutton: https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/multistatebutton
Zitat von: nesges am 18 Mai 2015, 16:58:16
Das switch-Widget ist nicht dafür geeignet mit mehreren get-on Status umzugehen. Es kann sie war anzeigen, aber es kann nicht korrekt dazu senden. Nimm dafür den multistatebutton: https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/multistatebutton
Damit geht's. Danke!
Zitat von: tomster am 18 Mai 2015, 09:42:40
Hab's grad auch im MPD-Thread von Dir gelesen. Auf das wäre ich ehrlich gesagt nicht gekommen (liegt aber wohl mehrheitlich daran, dass ich keine Ahnung von den syntaktischen Abläufen in FHEM habe). Dadurch klingt aber das beschriebene Phänomen plausibel. Bisher dachte ich, ein vom UI (oder FHEMWeb) gesetztes "set <name> play" reicht aus, um FHEM-intern alles Notwendige zu veranlassen.
Ich habe in der longpoll Funktion noch etwas gefeilt, jetzt scheint es zu gehen mit dem Start / Stop Status beim MPD
Ich benutze zu testen diese Buttons:
<div class="left wider">
<div data-type="push" data-device="MPD1"
data-icon="fa-step-backward" data-background-icon="-"
data-set="previous" class="inline">
</div>
<div data-type="push" data-device="MPD1"
data-icon="fa-stop" data-background-icon="-"
data-set="stop" class="inline">
</div>
<div data-type="switch" data-device="MPD1"
data-get-on="play"
data-get-off="!on"
data-set-on="play"
data-on-color="#999"
data-off-color="#555"
data-background-icon="-"
data-icon="fa-play" class="inline">
</div>
<div data-type="push" data-device="MPD1"
data-icon="fa-step-forward" data-background-icon="-"
data-set="next" class="inline">
</div>
<div data-type="label" data-device="MPD1"
class="inline">
</div>
</div>
Yepp, scheint zu gehen. Also, Start und Stop zumindest. Wenn ich auf "Next" klicke, geht Play aber in die off-color...
Bei mir auch :-(
Aber 'next' kommt auch nicht beim MPD an. Mit mpc klappt es.
Im FHEMWEB geht auch kein 'next'
Hallo Mario,
was stimmt hier nicht?
<div data-type="symbol" data-device="tmp_heizungskeller" data-get="battery" data-icons='["oa-measure_battery_100","oa-measure_battery_0"]' data-get-on='["1","0"]' data-on-colors='["#8c8c8c","#aa6900"]'></div>
Ist "battery"=1 dann soll er eine volle Batterie in grau anzeigen, wechselt der Status auf 0, soll das Bild auf leere Batterie wechseln und orange werden.
Leider wird eine leere Batterie in Orange angezeigt, obwohl in FHEM der Status 1 ist. Bin gerade ratlos :o
Zitat von: StG (DD) am 18 Mai 2015, 23:17:15
Hallo Mario,
was stimmt hier nicht?
<div data-type="symbol" data-device="tmp_heizungskeller" data-get="battery" data-icons='["oa-measure_battery_100","oa-measure_battery_0"]' data-get-on='["1","0"]' data-on-colors='["#8c8c8c","#aa6900"]'></div>
Ist "battery"=1 dann soll er eine volle Batterie in grau anzeigen, wechselt der Status auf 0, soll das Bild auf leere Batterie wechseln und orange werden.
Leider wird eine leere Batterie in Orange angezeigt, obwohl in FHEM der Status 1 ist. Bin gerade ratlos :o
So einen Fall hatten wir schon einmal: http://forum.fhem.de/index.php/topic,34233.msg290459.html#msg290459
Ursache: Numerischer >= Vergleich gewinnt. Dafür müsste die Reihenfolge aber aufsteigend sein, damit es wie erwartet funktioniert -> also
data-get-on='["0","1"]'
oder man forciert RegEx Vergleich, dann ist die Reihenfolge egal
data-get-on='["[1]","[0]"]'
Danke Mario, hat funktioniert :)
Habe ein aufgefrischtes widget_pagetab im alten Posting hochgeladen, dass weiter stabilisiert ist und auch auf Android, iOS8 und Windows mit verschiedenen Browsern getestet ist.
Feedback weiter willkommen,
Johannes
Siehe vorheriges Post:
Zitat von: viegener am 14 Mai 2015, 13:27:30
Ich habe mal mit widget_pagetab herumgespielt und habe eine Lösung gebaut, die bei mir auch beim Refresh die richtige Seite lädt.
Die geänderte widget_pagetab.js anbei, vielleicht kann das ja jemand ausprobieren, der eine komplexere Umgebung hat.
Änderung: 19.5. - Weiter stabilisierte Version
Hallo Johannes,
ich habe den Eindruck, es läuft flotter, aber es werden beim Start und Refresh immer noch zwei Seiten nacheinander geladen. Beim Start zweimal die Index.html. Kann man da noch was optimieren?
Hallo Zusammen
Einfach geniale Sache was hier mit dem neuen UI so abgeht,
Kompliment an die Ersteller! :-)
Momentan bin ich dran mein altes UI auf das FHEM Tablet UI umzuschreiben.
Fast alles habe ich geschafft, nur eines liegt mir noch auf dem Herzen.
Ich habe in FHEM den Abfallkalender von hexenmeister.
http://forum.fhem.de/index.php/topic,32382.0.html
Leider weis ich nicht wie ich diesen ins neue UI integrieren kann.
Kann mir da vielleicht jemand helfen?
Danke vielmals und Gruss
Daran bin ich auch gescheitert. letztenendes habe ich mir in Google solch einen Kalender angelegt und diesen via URL direkt im UI eingebunden. Das hat zudem noch den Vorteil, dass wenn es sich um einen abonnierten-Kalender handelt dieser auch automatisch aktualisiert wird !
Zitat von: bjoernbo am 19 Mai 2015, 18:50:08
Daran bin ich auch gescheitert. letztenendes habe ich mir in Google solch einen Kalender angelegt und diesen via URL direkt im UI eingebunden. Das hat zudem noch den Vorteil, dass wenn es sich um einen abonnierten-Kalender handelt dieser auch automatisch aktualisiert wird !
Ist auch eine gute Lösung.
Aber die mit der ReadingsGroup finde ich einfach eleganter.
Eventuell hat ja noch jemand anders eine Idee wie man das anpacken könnte.
Ich hab doch meine Lösung zum Abfallkalender gestern hier im Thread gepostet:
http://forum.fhem.de/index.php/topic,34233.msg295617/topicseen.html#msg295617
Oder wolltest Du etwas anderes?
Zitat von: tomster am 19 Mai 2015, 19:28:27
Ich hab doch meine Lösung zum Abfallkalender gestern hier im Thread gepostet:
http://forum.fhem.de/index.php/topic,34233.msg295617/topicseen.html#msg295617
Oder wolltest Du etwas anderes?
Habe mir jetzt diese Lösung auch mal eingerichtet.
Das gute an dem ReadingsGroup war eben das ich nicht nur gesehen habe was am nächsten Tag
passiert sondern auch was in den nächsten 7 Tagen so los ist. Daher ist diese Lösung für mich noch nicht perfekt.
Durch die DEMO-Version von nesges habe ich mich im Bezug auf die Multimedia inspirieren lassen und für meine VU+Duo2 (Sat-Reciever) eine vollständige Fernbedienung abgebildet. Für die Steuerung kommt ein HUB der Fa. Harmony in Einsatz. Da es aber immer Ewigkeiten gedauert hat bis sich der HUB mit einem iPhone verbunden hat ist somit ein nettes Feature in UI entstanden. Meine Frau ist begeistert und somit werde ich in kürze noch eine "Smartphone-Varinate" erstellen. Den Code stelle ich gerne zur Verfügung:
Zitat<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header>1</header>
<img src="img/senderlogos/Das-Erste-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number1')"></img>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>2</header>
<img src="img/senderlogos/ZDF-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number2')"></img>
</li>
<li data-row="1" data-col="4" data-sizex="1" data-sizey="1">
<header>3</header>
<img src="img/senderlogos/WDR-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number3')"></img>
</li>
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1">
<header>4</header>
<img src="img/senderlogos/RTL-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number4')"></img>
</li>
<li data-row="1" data-col="6" data-sizex="4" data-sizey="4">
<header>VU+ duo2</header>
<div class="center"><br>
<div data-type="button"
data-fhem-cmd="set hub command 24775848 Rewind"
data-icon="font1-backward2"
data-on-background-color="rgb(150, 150, 136)"
class="cell">
</div>
<div data-type="button"
data-fhem-cmd="set hub command 24775848 Pause"
data-icon="font1-pause2"
data-on-background-color="rgb(150, 150, 136)"
class="cell">
</div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Play"data-icon="font1-play3" data-on-background-color="rgb(150, 150, 136)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Stop" data-icon="font1-stop2" data-on-background-color="rgb(150, 150, 136)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Record" data-icon="fa-circle" data-on-color="red" data-on-background-color="rgb(150, 150, 136)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 FastForward" data-icon="font1-forward3" data-on-background-color="rgb(150, 150, 136)" class="cell"></div><br><br><hr>
</div>
<div style="margin-top:18px" class="center">
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Exit" data-icon="font1-exit" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 VolumeUp" data-icon="font1-volume-increase" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 DirectionUp" data-icon="fa-angle-up" data-on-background-color="#2E8AE6" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 ChannelUp" data-icon="fa-plus" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Guide" data-icon="fa-th-list" data-on-background-color="rgb(170,105,0)" class="cell"></div>
</div>
<div class="center">
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 DirectionLeft" data-icon="fa-angle-left" data-on-background-color="#2E8AE6" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Select" data-icon="fa-check-circle" data-on-background-color="#0066FF" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 DirectionRight" data-icon="fa-angle-right" data-on-background-color="#2E8AE6" class="cell"></div>
</div>
<div class="center">
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 VolumeDown" data-icon="font1-volume-decrease" data-on-background-color="rgb(170,105,0)" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 DirectionDown" data-icon="fa-angle-down" data-on-background-color="#2E8AE6" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 ChannelDown" data-icon="fa-minus" data-on-background-color="rgb(170,105,0)" class="cell"></div><br>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Mute" data-icon="font1-volume-mute2" data-on-background-color="rgb(170,105,0)" class="cell"></div>
</div><hr>
<div style="margin-top:30px" class="center">
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Red" data-icon="fa-minus-circle" data-on-background-color="red" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Green" data-icon="fa-minus-circle" data-on-background-color="green" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Yellow" data-icon="fa-minus-circle" data-on-background-color="yellow" class="cell"></div>
<div id="" data-type="button" data-fhem-cmd="set hub command 24775848 Blue" data-icon="fa-minus-circle" data-on-background-color="blue" class="cell"></div>
</div>
<div data-type="circlemenu" class="cell circlemenu top-space" data-circle-radius="85">
<ul>
<li><div data-type="symbol"
data-icon="fa-th"
data-on-background-color="rgb(150, 150, 136)"
data-off-background-color="rgb(150, 150, 136)"
data-on-color="rgb(255,255,255)"
data-off-color="rgb(255,255,255)"
data-background-icon="fa-circle">
</div>
</li>
<li>1<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number1">
</div></li>
<li>2<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number2">
</div></li>
<li>3<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number3">
</div></li>
<li>4<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number4">
</div></li>
<li>5<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number5">
</div></li>
<li>6<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number6">
</div></li>
<li>7<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number7">
</div></li>
<li>8<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number8">
</div></li>
<li>9<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number9">
</div></li>
<li>0<div data-type="button"
data-fhem-cmd="set hub command 24775848 Number0">
</div></li>
</ul>
</div>
</li>
</li>
<li data-row="2" data-col="2" data-sizex="1" data-sizey="1">
<header>5</header>
<img src="img/senderlogos/Sat.1-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number5')"></img>
</li>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="1">
<header>6</header>
<img src="img/senderlogos/VOX-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number6')"></img>
</li>
<li data-row="2" data-col="4" data-sizex="1" data-sizey="1">
<header>7</header>
<img src="img/senderlogos/Pro7-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number7')"></img>
</li>
<li data-row="2" data-col="5" data-sizex="1" data-sizey="1">
<header>8</header>
<img src="img/senderlogos/kabel-eins-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number8')"></img>
</li>
<li data-row="3" data-col="2" data-sizex="1" data-sizey="1">
<header>9</header>
<img src="img/senderlogos/N24-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number9')"></img>
</li>
<li data-row="3" data-col="3" data-sizex="1" data-sizey="1">
<header>10</header>
<img src="img/senderlogos/n-tv-hd.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number10')"></img>
</li>
<li data-row="3" data-col="4" data-sizex="1" data-sizey="1">
<header>11</header>
<img src="img/senderlogos/ZDFinfo-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number17')"></img>
</li>
<li data-row="3" data-col="5" data-sizex="1" data-sizey="1">
<header>12</header>
<img src="img/senderlogos/RTL2-HD.png" height="80" wight="80" class="top-space" onclick="setFhemStatus('set hub command 24775848 Number18')"></img>
</li>
<li data-row="4" data-col="3" data-sizex="1" data-sizey="1">
<header>SKY Bundesliga HD</header>
<div data-type="circlemenu" class="cell circlemenu top-space" data-circle-radius="85">
<ul>
<li><div data-type="symbol"
data-icon="font1-tv"
data-on-background-color="rgb(111,69,120)"
data-off-background-color="rgb(111,69,120)"
data-on-color="rgb(255,255,255)"
data-off-color="rgb(255,255,255)"
data-background-icon="fa-circle">
</div>
</li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number5;set hub command 24775848 Number6"
data-icon="">1</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number5;set hub command 24775848 Number7"
data-icon="">2</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number5;set hub command 24775848 Number8"
data-icon="">3</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number5;set hub command 24775848 Number9"
data-icon="">4</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number0"
data-icon="">5</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number1"
data-icon="">6</div></li>
<li>
<div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number2"
data-icon="">7</div>
</li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number3"
data-icon="">8</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number4"
data-icon="">9</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number5"
data-icon="">10</div></li>
</ul>
</div>
</li>
<li data-row="4" data-col="4" data-sizex="1" data-sizey="1">
<header>SKY Sport<br>HD</header>
<div data-type="circlemenu" class="cell circlemenu top-space" data-circle-radius="85">
<ul>
<li><div data-type="symbol"
data-icon="font1-tv"
data-on-background-color="rgb(111,69,120)"
data-off-background-color="rgb(111,69,120)"
data-on-color="rgb(255,255,255)"
data-off-color="rgb(255,255,255)"
data-background-icon="fa-circle">
</div>
</li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number6"
data-icon="">1</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number7"
data-icon="">2</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number8"
data-icon="">3</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number6;set hub command 24775848 Number9"
data-icon="">4</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number7;set hub command 24775848 Number0"
data-icon="">5</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number7;set hub command 24775848 Number1"
data-icon="">6</div></li>
<li>
<div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number7;set hub command 24775848 Number2"
data-icon="">7</div>
</li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number7;set hub command 24775848 Number3"
data-icon="">8</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number7;set hub command 24775848 Number4"
data-icon="">9</div></li>
<li><div data-type="push"
data-on-color="white"
data-cmd="set hub command 24775848 Number7;set hub command 24775848 Number5"
data-icon="">10</div></li>
</ul>
</div>
</li>
</ul>
</div>
</li>
Zitat von: DanHard am 19 Mai 2015, 22:07:57
Habe mir jetzt diese Lösung auch mal eingerichtet.
Das gute an dem ReadingsGroup war eben das ich nicht nur gesehen habe was am nächsten Tag
passiert sondern auch was in den nächsten 7 Tagen so los ist. Daher ist diese Lösung für mich noch nicht perfekt.
Hallo,
ich nutze für den Abfallkalender folgendes Script in FHEM:
http://forum.fhem.de/index.php/topic,24646.msg293851.html#msg293851 (http://forum.fhem.de/index.php/topic,24646.msg293851.html#msg293851)
Als Datensource hole ich mir die ICS Datei meines Abfallentsorgers.
Das Script berechnet die Tage bis zur Leerung und diese zeige ich im UI als Bag-Symbol mit warn an.
Also alle Tonnen als Übersicht. Somit kann ich auch doppelte Leerungen sehen.
Das Symbol wird bei <= 1Tag als blinkend angezeigt.
Hier mein FTUI-Code des Abfalltemplates:
<header>Abfall</header>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Gelbetonne" data-get='STATE' data-off-color="yellow" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["yellow","yellow","yellow"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Biomuell" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#996633","#996633","#996633"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Papiertonne" data-get='STATE' data-off-color="green" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["green","green","green"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="white" data-on-background-color="white" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="bigger"></div>
Ich nutze die Off-Werte, da ich hier in der Umgebung keinen Zugriff auf FHEM habe.
@setstate
Wäre es eigentlich auch möglich einen Defaultwert anzugeben für den Fall, dass keine Verbindung zum FHEM besteht?
Damit auch die warn-werte zum Testen angezeigt werden.
update:
Hab gerade gesehen, dass fa-trash als icon auch gut aussieht!
@bjoernbo: Respekt! Sehr, sehr fleißig!
Das kann ich doch gleich mal als meine erste zusätzliche Seite übernehmen, für den VU+Solo2 müsste das doch auch passen.
Nur werde ich die Steuerung per Enigma2 Modul machen und die Farben etwas dezenter ( zu bonbonfarben für meinen Geschmack ;-)
Zitat von: mc-hollin am 20 Mai 2015, 07:53:38
Hallo,
ich nutze für den Abfallkalender folgendes Script in FHEM:
http://forum.fhem.de/index.php/topic,24646.msg293851.html#msg293851 (http://forum.fhem.de/index.php/topic,24646.msg293851.html#msg293851)
Als Datensource hole ich mir die ICS Datei meines Abfallentsorgers.
Das Script berechnet die Tage bis zur Leerung und diese zeige ich im UI als Bag-Symbol mit warn an.
Also alle Tonnen als Übersicht. Somit kann ich auch doppelte Leerungen sehen.
Das Symbol wird bei <= 1Tag als blinkend angezeigt.
Kannst du deinen FTUI HTML code hier mal posten?
Zitat von: Phil__ am 20 Mai 2015, 09:34:30
Kannst du deinen FTUI HTML code hier mal posten?
Erledigt! Werde heute abend auch mal ein Bild einfügen.
Hallo!
Ich hätte noch eine Frage:
Beim Dimmer gibt es zwar die Option "data-set-off", aber nicht die Option "data-set-on". Wäre es möglich, diese Option einzubauen?
Ich habe ein Dummy-Device, das ich mit dem Dimmer bediene, aber das springt immer auf "0" und ein "on" löst ein "dim 0" aus. Wäre toll, diese Option zu haben.
Grüße
Phil
...und vielleicht in den Slider-Knopf die Anzeige des Dim-Werts/ der Lautstärke? Ganz wie in der class "warn".
Zitat von: tomster am 20 Mai 2015, 16:34:49
...und vielleicht in den Slider-Knopf die Anzeige des Dim-Werts/ der Lautstärke? Ganz wie in der class "warn".
meinst du so was:
http://forum.fhem.de/index.php/topic,34233.msg294251/topicseen.html#msg294251
Nicht ganz. Ich dachte daran den Wert in den "grauen Knopf" zu integrieren...
das ist ja richtig klasse - werde meine ui auch umbauen.
da mir das mit den widgets sehr gut gefällt hatte ich mich auch schon nach alternativen zu fhem umgesehen, die haben aber auch alle ihre einschränkungen. das mit den widgets ist wirklich das fehlende puzzle stück.
gibt es eine möglichkeit/bedarf für ein widget zum steuern des wochenprogramms für max oder homematic heizkörperregler?
Gibt es eine Möglichkeit das aktuelle WetterIcon als Hintergrundbild zu platzieren?
Oder generell ein Widget welches ein Image aus FHEM Werten als Hintergrund anzeigen kann?
Also ein DIV um das gesamte Template mit background-image.
Ich habe mal versucht das Wetter aus Windows nach zu bauen.
Die Werte und die Texte sind kein Problem. Nur für das Hintergrund Tages-Image sehe ich keinen Ansatz.
sowas?
http://www.w3.org/WAI/UA/TS/html401/cp0301/0301-CSS-DIV-BACKGROUND-IMAGE.html
Hallo Freunde,
ich hab mich grad eine Weile an den Pagetabs versucht aber erstmal schön alles durcheinander gebracht >:(
Gibt es irgendwo eine Erklärung wie genau das alles zusammenspielt?
Ich hatte ja schon einmal gefragt ob es nicht möglich wäre kleine Beispielseiten zu erstellen, so dass auch der NOOB den Einstieg findet.
Was genau muss auf welche Seite dass das ganze hinhaut? Was passiert denn eignetlich wenn ich eine Pagetab Seite aufrufe?
Ein ganz einfaches Beispiel mit der index und 2 Unterseiten ohne großen Inhalt würde mich vermutlich weiterbringen :)
Ich hab derzeit eine menu.html wie aus dem Beispiel und es werden auch Seiten aufgerufen nur irgendwie komm ich nicht zurück auf index.html da kommt dann immer nur ne leere Seite mit dem unformatierten Wochentag :/
das mal aus der index.html
<div class="gridster ready">
<ul style="height: 705px; width: 1008px; position: relative;">
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.html" class="gs-w">
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2" class="gs-w">
<header>Heute</header>
Das ist die menu.html
<html>
<body>
<header>Räume</header>
<div class="cell">
<div data-type="pagetab" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="multimedia.html" data-icon="fa-sliders" class="cell"></div>
<div data-type="pagetab" data-url="denon.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagetab" data-url="gaestezimmer.html" data-icon="fa-hotel" class="cell"></div>
<div data-type="pagetab" data-url="kueche.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagetab" data-url="paul.html" data-icon="fa-user" class="cell"></div>
<div data-type="pagetab" data-url="schlafzimmer.html" data-icon="fa-fax" class="cell"></div>
</div>
</body>
</html>
was genau muss ich tun um über den Homeknopp wieder nach index.html zu kommen und was muss in die unterseiten alles rein?
Ich danke euch und weiß dass ich nerve :P
Th.
Zitat von: setstate am 20 Mai 2015, 18:49:37
sowas?
http://www.w3.org/WAI/UA/TS/html401/cp0301/0301-CSS-DIV-BACKGROUND-IMAGE.html
Das Hintergrundbild generell ist nicht das Problem.
Ich muss es ja anhand des Wertes vom Wetter aus FHEM wechseln.
So wie im Weather-Widget.
Ich hatte die Hoffnung, dass eventuell ein vorhandenes Widget schon ein Image auch als Hintergrund darstellen kann und ich über data-get='icon' dieses darstelle.
Zitat von: update71 am 20 Mai 2015, 18:56:28
was genau muss ich tun um über den Homeknopp wieder nach index.html zu kommen und was muss in die unterseiten alles rein?
Das macht pagetab eigentlich alles alleine.
Hier Dein Wunsch nach 2 Seiten:
Du erstellst einfach eine 2. Seite, die eine genaue Kopie der index.html ist. Nur nennst Du sie multimedia.html.
Jetzt hast du 2 Seiten und kannst jeweils mit den ersten beiden Menubuttons zwischen diesen Seiten wechseln. Die anderen Menupunkt sind "tot". Du hast ja schließlich (noch) keine entsprechenden Seiten hinterlegt.
Zitat von: setstate am 19 Mai 2015, 00:55:42
ich habe den Eindruck, es läuft flotter, aber es werden beim Start und Refresh immer noch zwei Seiten nacheinander geladen. Beim Start zweimal die Index.html. Kann man da noch was optimieren?
@setstate: Bei mir wird die Index.html nur einmal geladen, auf jeden Fall aber macht es Sinn Index.html auf das Laden der Skripte und CSS-Files zu beschränken. Der Rest ist absolut minimal, also in meiner Umgebung zum Beispiel ist im BODY von index.html nur folgendes enthalten (Wobei "room_home.html" bei mir die Seite ist, die geladen werden soll, wenn keine andere Seite ausgewählt ist):
<body>
<div class="gridster" >
<ul>
<div data-type="pagetab" data-url="room_home.html" data-icon="-" class=""></div>
</ul>
</div>
</body>
Mir ist nicht klar, warum index.html bei Dir mehrfach geladen wird. Betreibst Du die Seiten über HTTPSRV oder auf einem getrennten Server?
Bei mir werden zu jeder Seite die verwendeten Widgets wieder geladen, dass ist aber eigentlich so gewollt.
Gruss,
Johannes
Wenn der ganze Stylesheet Kram über die Index geladen wird muss es dann ach noch in die unterseiten?
Oder reicht hier alles was sonst im Body steht?
Ich hab jetzt eine Index die das Menü holt und 2 Unterseiten Start und Multimedia
Bei allen Unterseiten hab ich genau das was und der Index steht plus die Unterschiede.
Ist das so richtig?
Hallo Thomas,
Nein generell ist das nicht nötig. Bei mir enthält die Index.html im Head alle includes (also css und js-Dateine).
Die einzelnen Seiten, die als pagetab geladen werden, enthalten dann im wesentlichen nur noch den Seiteninhalt. Ich habe sie weiterhin als vollwertige HTML-Seiten ausgeführt aber nur noch die eigentlichen Gridster-Element mit den widgets:
<!DOCTYPE html>
<html>
<head>
<title>Detail</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
<!-- *******Hier kommen dann die einzelnen widgets als weitere li-Einträge *********** -->
</ul>
</div>
</body>
</html>
Gruss,
Johannes
So wie Johannes hab ich's auch gemacht. Ich dachte aber - ehrlich gesagt - Du auch, update71, weil's ja auch so in Deinen Code-Schnipseln gepostet war.
Die "pagetab"-Nummer ist echt - setstate sei Dank - wirklich hilfreich.
Nur für's Verständnis, vielleicht:
Pagetab macht (nach außen hin) nicht recht viel mehr, als dass es die gewählte (Unter-)Seite durch einen grauen Kreis kennzeichnet.
Drum wirst Du feststellen, dass nach Klicken auf das (in meinem geposteten Beispiel) Multimedia-Icon zwar wieder die (kopierte) Index-Seite erscheint, aber nicht das "fa-home"-Icon ge-highlighted ist, sondern das "fa-slider"-Icon.
Zitat von: trilu am 20 Mai 2015, 18:08:42
das ist ja richtig klasse - werde meine ui auch umbauen.
da mir das mit den widgets sehr gut gefällt hatte ich mich auch schon nach alternativen zu fhem umgesehen, die haben aber auch alle ihre einschränkungen. das mit den widgets ist wirklich das fehlende puzzle stück.
gibt es eine möglichkeit/bedarf für ein widget zum steuern des wochenprogramms für max oder homematic heizkörperregler?
Hallo trilu,
so etwas umfangreiches gibt es nicht als Widget. Es gab aber hier mal in diesem Thread gute Beispiele für Wochen-Wecker.
Bedarf?
Ich habe die Wochenvorgaben abrufbar in der 99_myUtils.pm und schalten dann nur mit einem Befehl um, z.B. bei Urlaubsantritt.
Zitat von: Stril am 20 Mai 2015, 15:40:59
Hallo!
Ich hätte noch eine Frage:
Beim Dimmer gibt es zwar die Option "data-set-off", aber nicht die Option "data-set-on". Wäre es möglich, diese Option einzubauen?
Ich habe ein Dummy-Device, das ich mit dem Dimmer bediene, aber das springt immer auf "0" und ein "on" löst ein "dim 0" aus. Wäre toll, diese Option zu haben.
Grüße
Phil
Hallo Phil,
habs eingebaut und auch ein data-dim eingebaut, um das vom ein/aus trennen zu können. Veröffentlichung folgt demnächst ...
Hallo an alle,
der User-Demo Thread und das zugehörige Git stehen bereit.
Ich hoffe auf rege Beteiligung!
http://forum.fhem.de/index.php?topic=37378.msg296510#msg296510 (http://forum.fhem.de/index.php?topic=37378.msg296510#msg296510)
https://github.com/ovibox/fhem-ftui-user-demos (https://github.com/ovibox/fhem-ftui-user-demos)
@setstate:
Könntest du die beiden Seiten im Startpost und in deinem Git verlinken?!
Hallo,
so hier meine fertige Lösung zur Anzeige der Müllabfuhrtermine. Mit bestem Dank an mc-hollin!!!
Im Menü meiner index.html wird, am Button das auf die Muellabfuhr übersichtsseite verlinkt, am Vortag einer Lehrung ein Warning engeblendet.
Auf der Übersichtsseite, muell.html, werden die Tonnen mit der Anzahl der Tage bis zur Leerung angezeigt.
Um 18 Uhr am Vortag einer Leerung bekomme ich eine Pushover Mitteilung auf mein Smartphone.
Für die Abfuhrtermin habe ich bei meinem Städischen Entsorger die Termine als .ics downloaden können und sie in einen Googlekalender importiert.
PS: Die Graue Tonne, untem auf dem Screenshot der muell.html, sieht man nicht da sie einen Vortag anfängt zu blinken. Screenshot zum falschen Zeitpunkt! ;)
Hier der FTUI Code:
<header>Muell</header>
<div style="font-size:30px; color:rgb(96, 0, 0);"
data-type="button"
data-device="Muellalert"
data-color="#aa6900"
data-get-on='["on","off"]'
data-url="muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="cell small"></div>
<header>Abfall</header>
<div class="cell">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Gelbetonne" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#E6E600","#E6E600","#E6E600"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Biomuell" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#996633","#996633","#996633"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Papiertonne" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#4747D1","#4747D1","#4747D1"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="bigger"></div>
</div>
Hier der zugehörige Fhem Code:
#MuellKalender
define Abfall Calendar ical url https://www.google.com/calendar/ical/xyz/basic.ics 600
attr Abfall room Kalender
define Abfall_Update notify Abfall:(modeUpcoming|modeAlarmOrStart).* {Abfalltermine("$EVENT")}
attr Abfall_Update room Kalender
define Papiertonne dummy
attr Papiertonne group Abfall
attr Papiertonne room Kalender
attr Papiertonne event-on-change-reading state
define Restmuell dummy
attr Restmuell group Abfall
attr Restmuell room Kalender
attr Restmuell event-on-change-reading state
define Gelbetonne dummy
attr Gelbetonne group Abfall
attr Gelbetonne room Kalender
attr Gelbetonne event-on-change-reading state
define Biomuell dummy
attr Biomuell group Abfall
attr Biomuell room Kalender
attr Biomuell event-on-change-reading state
define Psh_Papiertonne at *18:00:00 {if(Value("Papiertonne") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird die Papiertonne abgeholt'")} }
define Psh_Restmuell at *18:00:00 {if(Value("Restmuell") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird der Restmuell abgeholt'")} }
define Psh_Gelbetonne at *18:00:00 {if(Value("Gelbetonne") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird die Gelbetonne abgeholt'")} }
define Psh_Biomuell at *18:00:00 {if(Value("Biomuell") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird der Biomuell abgeholt'")} }
define Muellalert dummy
attr Muellalert room Kalender
attr Muellalert event-on-change-reading state
define at_Muellalert at *06:00:00 {if(Value("Papiertonne") eq "1" || Value("Restmuell") eq "1" || Value("Gelbetonne") eq "1" || Value("Biomuell") eq "1") {fhem("set Muellalert on")} else { fhem("set Muellalert off")}}
und hier der Code für die benötigte 99_myUtilsMuell:
##############################################
# $Id: myUtilsTemplate.pm 7570 2015-01-14 18:31:44Z rudolfkoenig $
#
# Save this file as 99_myUtils.pm, and create your own functions in the new
# file. They are then available in every Perl expression.
package main;
use strict;
use warnings;
use POSIX;
use Time::Local;
sub
myUtils_Initialize($$)
{
my ($hash) = @_;
}
sub
Abfalltermine ($)
{
my ($Ereignis) = @_;
my @Ereignisarray = split(/.*:\s/,$Ereignis);
my $Ereignisteil1 = $Ereignisarray[1];
my @uids=split(/;/,$Ereignisteil1);
my $t = time;
my $dtPapier = '';
my $dtWertstofftonne = '';
my $dtRest = '';
my $dtBiomuell = '';
foreach my $uid (@uids) {
my $Kalendertext = fhem("get Abfall summary $uid");
if ($Kalendertext =~ /Altpapier/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtPapier eq '' || ($eventDate < $dtPapier && $eventDate > $t))
{
$dtPapier = $eventDate;
Log(3, $dtPapier);
}
};
if ($Kalendertext =~ /Gelbe/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtWertstofftonne eq '' || ($eventDate < $dtWertstofftonne && $eventDate > $t))
{
$dtWertstofftonne = $eventDate;
}
};
if ($Kalendertext =~ /Restmüll/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtRest eq '' || ($eventDate < $dtRest && $eventDate > $t))
{
$dtRest = $eventDate;
}
};
if ($Kalendertext =~ /Biomüll/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtBiomuell eq '' || ($eventDate < $dtBiomuell && $eventDate > $t))
{
$dtBiomuell = $eventDate;
}
};
my $dayDiff = floor(($dtPapier - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Papiertonne $dayDiff");
}
my $dayDiff = floor(($dtWertstofftonne - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Gelbetonne $dayDiff");
}
my $dayDiff = floor(($dtRest - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Restmuell $dayDiff");
}
my $dayDiff = floor(($dtBiomuell - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Biomuell $dayDiff");
}
}
}
Kannst du bitte eine Hardcopy beifügen? Dann ist es einfacher und man hat einen ersten Eindruck! :D
Danke
Screenshots, erledigt!
Die index.html und muell.html gibts morgen im Git der User-Demos!
Zitat von: Stril am 20 Mai 2015, 15:40:59
Beim Dimmer gibt es zwar die Option "data-set-off", aber nicht die Option "data-set-on". Wäre es möglich, diese Option einzubauen?
Ich habe ein Dummy-Device, das ich mit dem Dimmer bediene, aber das springt immer auf "0" und ein "on" löst ein "dim 0" aus. Wäre toll, diese Option zu haben.
Update: 1. Erweiterung Dimmer Widget- es kann jetzt auch "data-set-on"
- neues Attribut "data-dim" für ein separates Reading für den Dimmer
Beispiel (Minimalvariante)
<div data-type="dimmer" data-device="HUEDevice1"
data-get-on="!off" data-get-off="off"
data-set="pct"</div>
Beispiel (Dim Reading)
<div data-type="dimmer" data-device="HUEDevice1"
data-get="onoff"
data-get-on="1" data-get-off="0"
data-set=""
data-set-on="on" data-set-off="off"
data-dim="pct"</div>
- mit "data-countdown" kann man jetzt auch einen Fortschritts-Countdown erzwingen. Vorher ging das nur automatisch, wenn 'on-for-timer' im "data-set-on" erkannt wurde. Das Attribut erwartet die Zeit in Sekunden. Damit bleibt die Zeit für den Countdown unabhängig von gesendeten Wert.
- ist "data-countdown" gesetzt, wird der 'on-for-timer' Wert nicht beachtet
<div data-type="push" data-device="Alarm"
data-set-on="ring" data-countdown="300" class="cell" ></div>
(http://knowthelist.github.io/fhem-tablet-ui/push_on-for-timer.png)
Zitat von: setstate am 21 Mai 2015, 20:45:16
Update:
1. Erweiterung Dimmer Widget
- neues Attribut "data-dim" für ein separates Reading für den Dimmer
Super. Funktioniert. Bin leider selbst nicht dazu gekommen.
Vielen vielen Dank.
Risiko
Zitat von: Phil__ am 21 Mai 2015, 20:10:45
Hallo,
so hier meine fertige Lösung zur Anzeige der Müllabfuhrtermine. Mit bestem Dank an mc-hollin!!!
Im Menü meiner index.html wird, am Button das auf die Muellabfuhr übersichtsseite verlinkt, am Vortag einer Lehrung ein Warning engeblendet.
Auf der Übersichtsseite, muell.html, werden die Tonnen mit der Anzahl der Tage bis zur Leerung angezeigt.
Um 18 Uhr am Vortag einer Leerung bekomme ich eine Pushover Mitteilung auf mein Smartphone.
Für die Abfuhrtermin habe ich bei meinem Städischen Entsorger die Termine als .ics downloaden können und sie in einen Googlekalender importiert.
PS: Die Graue Tonne, untem auf dem Screenshot der muell.html, sieht man nicht da sie einen Vortag anfängt zu blinken. Screenshot zum falschen Zeitpunkt! ;)
Hier der FTUI Code:
<header>Muell</header>
<div style="font-size:30px; color:rgb(96, 0, 0);"
data-type="button"
data-device="Muellalert"
data-color="#aa6900"
data-get-on='["on","off"]'
data-url="muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="cell small"></div>
<header>Abfall</header>
<div class="cell">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Gelbetonne" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#E6E600","#E6E600","#E6E600"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Biomuell" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#996633","#996633","#996633"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Papiertonne" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#4747D1","#4747D1","#4747D1"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="bigger"></div>
</div>
Hier der zugehörige Fhem Code:
#MuellKalender
define Abfall Calendar ical url https://www.google.com/calendar/ical/xyz/basic.ics 600
attr Abfall room Kalender
define Abfall_Update notify Abfall:(modeUpcoming|modeAlarmOrStart).* {Abfalltermine("$EVENT")}
attr Abfall_Update room Kalender
define Papiertonne dummy
attr Papiertonne group Abfall
attr Papiertonne room Kalender
attr Papiertonne event-on-change-reading state
define Restmuell dummy
attr Restmuell group Abfall
attr Restmuell room Kalender
attr Restmuell event-on-change-reading state
define Gelbetonne dummy
attr Gelbetonne group Abfall
attr Gelbetonne room Kalender
attr Gelbetonne event-on-change-reading state
define Biomuell dummy
attr Biomuell group Abfall
attr Biomuell room Kalender
attr Biomuell event-on-change-reading state
define Psh_Papiertonne at *18:00:00 {if(Value("Papiertonne") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird die Papiertonne abgeholt'")} }
define Psh_Restmuell at *18:00:00 {if(Value("Restmuell") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird der Restmuell abgeholt'")} }
define Psh_Gelbetonne at *18:00:00 {if(Value("Gelbetonne") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird die Gelbetonne abgeholt'")} }
define Psh_Biomuell at *18:00:00 {if(Value("Biomuell") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird der Biomuell abgeholt'")} }
define Muellalert dummy
attr Muellalert room Kalender
attr Muellalert event-on-change-reading state
define at_Muellalert at *06:00:00 {if(Value("Papiertonne") eq "1" || Value("Restmuell") eq "1" || Value("Gelbetonne") eq "1" || Value("Biomuell") eq "1") {fhem("set Muellalert on")} else { fhem("set Muellalert off")}}
und hier der Code für die benötigte 99_myUtilsMuell:
##############################################
# $Id: myUtilsTemplate.pm 7570 2015-01-14 18:31:44Z rudolfkoenig $
#
# Save this file as 99_myUtils.pm, and create your own functions in the new
# file. They are then available in every Perl expression.
package main;
use strict;
use warnings;
use POSIX;
use Time::Local;
sub
myUtils_Initialize($$)
{
my ($hash) = @_;
}
sub
Abfalltermine ($)
{
my ($Ereignis) = @_;
my @Ereignisarray = split(/.*:\s/,$Ereignis);
my $Ereignisteil1 = $Ereignisarray[1];
my @uids=split(/;/,$Ereignisteil1);
my $t = time;
my $dtPapier = '';
my $dtWertstofftonne = '';
my $dtRest = '';
my $dtBiomuell = '';
foreach my $uid (@uids) {
my $Kalendertext = fhem("get Abfall summary $uid");
if ($Kalendertext =~ /Altpapier/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtPapier eq '' || ($eventDate < $dtPapier && $eventDate > $t))
{
$dtPapier = $eventDate;
Log(3, $dtPapier);
}
};
if ($Kalendertext =~ /Gelbe/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtWertstofftonne eq '' || ($eventDate < $dtWertstofftonne && $eventDate > $t))
{
$dtWertstofftonne = $eventDate;
}
};
if ($Kalendertext =~ /Restmüll/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtRest eq '' || ($eventDate < $dtRest && $eventDate > $t))
{
$dtRest = $eventDate;
}
};
if ($Kalendertext =~ /Biomüll/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtBiomuell eq '' || ($eventDate < $dtBiomuell && $eventDate > $t))
{
$dtBiomuell = $eventDate;
}
};
my $dayDiff = floor(($dtPapier - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Papiertonne $dayDiff");
}
my $dayDiff = floor(($dtWertstofftonne - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Gelbetonne $dayDiff");
}
my $dayDiff = floor(($dtRest - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Restmuell $dayDiff");
}
my $dayDiff = floor(($dtBiomuell - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Biomuell $dayDiff");
}
}
}
Genial Danke! Das nenne ich eine geniale Sache. Werde ich gleich heute Abend testen.
Ist es auch möglich die letzten 7 Tage nicht als Zahl sondern als Wochentag anzuzeigen? Ala Mo Di usw. ?
HAllo phil!
Ich habe da mal eine generelle Frage zum "Abfallkalender" da mich deine Darstellungsweise nun doch überzeugt hat.
Momentan rufe ich mir innerhalb des UI unseren Kalender auf (Google) und schaue dort rein was gerade so ansteht.
In deiner Definition rufst Du die Date ebenfalls über den Kalender auf
Zitathttps://www.google.com/calendar/ical/xyz/basic.ics 600
Handelt es sich hierbei um einen "abonnierten" Kalender deines Abfallunternehmens oder hast Du dir diese zuvor in deinen "Hauptkalender" importiert?
Worauf will ich hinaus? Bei uns im Pott ist es so, dass sich die Termine regelmäßig verschieben und es mir wichtig ist, dass ich immer den aktuellen Stand habe. Ist das bei dir berücksichtigt?
Sorry, wer lesen kann ist ..... Du hast die Termine importiert! :D
Aber da ergibt sich die nächste Frage. Wenn ich im Kalender private Termine etc. drin stehen habe, wie filterst Du die Abfalltermine heraus?
Ich denke ich werde mir unter meinem Googleaccount einen zweiten, separaten Kalender anlegen, ich meine das ist ja möglich.
ZitatAber da ergibt sich die nächste Frage. Wenn ich im Kalender private Termine etc. drin stehen habe, wie filterst Du die Abfalltermine heraus?
Ich denke ich werde mir unter meinem Googleaccount einen zweiten, separaten Kalender anlegen, ich meine das ist ja möglich.
Ich habe in meinem Googlekalenderaccount einen zweiten Kalender "Muellabfuhr" erstellt und die .ics in diesen importiert.
Aber grundsätzlich würde das auch mit dem Standart "Hauptkalender" in Google funktionieren. Das Skript in der MyUtils filtert da!
ZitatIst es auch möglich die letzten 7 Tage nicht als Zahl sondern als Wochentag anzuzeigen? Ala Mo Di usw. ?
Sollte theoretisch machbar sein, ist aber erstmal nicht vorgesehen.
(mit ein bisschen perl script in der myUtils)
Hallo,
ich finde auch die Google Kalenderanzeige von nesges ne gute Idee.
Da ich aber nur einen lokalen Kalender auf dem NAS laufen habe musste ich mir was anderes überlegen.
Hier probiere ich gerade FullCalendar http://fullcalendar.io/ (http://fullcalendar.io/) aus.
Dieser hat auch eine Schnittstelle zum ICAL von Google http://fullcalendar.io/js/fullcalendar-2.3.1/demos/gcal.html (http://fullcalendar.io/js/fullcalendar-2.3.1/demos/gcal.html).
Vielleicht ist das ja was für den einen oder anderen ;)
mc-hollin: Wenn du doch einen eigenen Kalender auf deinem NAAS hast kannst du doch anstelle der Googleadresse den Link auf dein NAS setzten, sofern die Endung .ics ist. Ich hatte das mal mit meinem Synology NAS eingerichtet, allerdings war / ist in dem WebDav noch was buggy, da ich aufeinmal eine Auslastung von 99% auf dem NAS hatte. Daher bin ich dann doch wieder zu Google zurückgekehrt.
Zitat von: bjoernbo am 22 Mai 2015, 08:16:41
mc-hollin: Wenn du doch einen eigenen Kalender auf deinem NAAS hast kannst du doch anstelle der Googleadresse den Link auf dein NAS setzten, sofern die Endung .ics ist. Ich hatte das mal mit meinem Synology NAS eingerichtet, allerdings war / ist in dem WebDav noch was buggy, da ich aufeinmal eine Auslastung von 99% auf dem NAS hatte. Daher bin ich dann doch wieder zu Google zurückgekehrt.
Die ICS habe ich ja zur Verfügung. Nur die Darstellung als Kalender will ich möglichst angepasst ans FTUI darstellen.
Hier scheint mir der FullCalendar eine gute Wahl. Nur leider bringt er von sich aus nur eine Anbindung an die Google-Api mit.
Aber ich habe gerade etwas gefunden um die Daten in JavaScript einzulesen http://bitfish.eu/projects/jquery-ics/ (http://bitfish.eu/projects/jquery-ics/) und damit dann den Kalender zu füttern.
Werde das mal am Wochenende ausprobieren.
Aber wollte ich hier nur am Rande mal erwähnen, da es ja nicht direkt mit dem FTUI und FHEM zu tun hat.
Ich hab grad Mal den Slider zur Lautstärkeregelung des MPD genauer angeschaut. Hab ich etwas vergessen, oder warum reagiert der Slider nicht "live"; sprich wenn man von anderer Stelle die Lautstärke ändert? Der tatsächliche Wert wird es nach einem Reload angezeigt. Bug oder Feature?
<div data-type="slider"
data-device="Wohnzimmer.MPD"
data-min="0"
data-max="100"
data-get="volume"
data-set="volume"
class="inline horizontal"></div>
Hallo Tom,
du hast bestimmt ein event-on-change-reading gesetzt.
Dort muss volume mit rein, damit ein Update Event ausgelöst wird.
Dann klappt das Update im FTUI.
Servus setstate,
yepp, das war's. Vielen Dank!
Nabend ... ich schon wieder 8)
Läuft FTUI auch mit webviewcontrol richtig oder kann ich da lange versuchen?
habe in den html`s entsprechende Zeilen auskommentiert:
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
bekomme aber nur beim Start der App den Status übermittelt, senden ans Tablet funktioniert nicht.
Wenn ich die app mit der fhem Oberfläche starte dann geht alles. Ich hab den ganzen nachmittag gesucht aber nix gefunden was mir weiterhilft :(
2. Frage: bei mir gehen einige awesome icons nicht (zum Bsp. food oder sun) ... woran kann das liegen? Sieht man die irgendwo?
Danke und euch allen schöne Pfingsten.
Th.
Zitat von: update71 am 23 Mai 2015, 00:45:12
Nabend ... ich schon wieder 8)
Läuft FTUI auch mit webviewcontrol richtig oder kann ich da lange versuchen?
habe in den html`s entsprechende Zeilen auskommentiert:
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
bekomme aber nur beim Start der App den Status übermittelt, senden ans Tablet funktioniert nicht.
Wenn ich die app mit der fhem Oberfläche starte dann geht alles. Ich hab den ganzen nachmittag gesucht aber nix gefunden was mir weiterhilft :(
Guten Morgen,
gleiches Verhalten hatte ich auch. Als ich dann zufällig das Tablet einmal durchgestartet hatte, liefs plötzlich.
durchgestartet hab ich mehrfach ... hilft nicht :/
der Status wird beim reload auch nur ein einziges Mal übergeben, danach nicht mehr.
Wenn ich die app auf Autostart stelle und das Tab starte gibt es auch einen Fehler (konnte Verbindung nicht herstellen -6). Reload und die Seite wird angezeigt.
Als Startseite hab ich versucht http://pi2.hc.local:8083/fhem/tablet/index.html und http://pi2.hc.local:8083/fhem/tablet/index.html#start.html (das ist eigentlich meine Standardseite die als erstes geladen wird)
das blöde Tablet kann auch nur Namensauflösung wenn ich den FQDN angebe nur pi2 kennt der nicht weil das Teil den Domainnamen nicht vom DHCP übernimmt.
Im gleichen Netz sind alle (pi per LAN, Tab per WLAN) und DNS funktioniert sonst auch einwandfrei.
Das Tab ist ein Trekstor xintron 10.1 mit Android 4.2.2 (Updates gibts nicht).
Bei mir funktioniert WVC mit FTUI auf einem nexus 7 grundsätzlich sehr gut. Nur bei seiten mit vielen Widgets werden manchmal nicht alle geladen. Werde dazu am WE mal Versuche Mut websockets starten.
Wie sieht denn deine FTUI Definition in der Fhem.cfg aus?
Wenn du direkt die IP in WVC angibst, anstatt des Hostnamen (DNS aussen vor lassen)?
Zitat von: Phil__ am 23 Mai 2015, 08:56:27
Wie sieht denn deine FTUI Definition in der Fhem.cfg aus?
Wenn du direkt die IP in WVC angibst, anstatt des Hostnamen (DNS aussen vor lassen)?
Mit IP gehts auch nicht (ist derzeit so eingestellt).
Hier mal meine Def.
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet Frontend
define EG_Tab1 webViewControl 12345
attr EG_Tab1 room Erdgeschoss
Probier mal bitte tablet/ anstatt tablet/index.html
Und dann in WVC mit /tablet/index.html angeben
funktioniert leider auch nicht.
Wenn ich es so wie du beschreibst definiere dann komme ich über den Link im Fhem auch nicht auf das FTUI, kommt dann nur ne weisse Seite.
Hatten wir weiter vorne schon mal das Thema (daher das index.html mit dran)
Irgendwie ist da der Wurm drin.
Wenns nicht geht dann isses halt so, hat jetzt keine Priorität und das WVC wird ja offenbar sowieso nicht weiter entwickelt und ist irgendwann nicht mehr nutzbar.
Komisch ist auch dass die index beim starten der WVC app mal läd und mal nicht. Beim Neustart des Tablets und Autostart der App muss ich IMMER reload drücken weil der nix findet ^^
Ich geh Rasen mähen ... das kann ich und da geht kaum was schief ;D
Bis später
Hallo,
hab jetzt nochmal ganz von vorne angefangen. Anderer Raspi mit frischem, upgedatetem FHEM, nur WVC installiert und die Tablet ui eingespielt sowie die example index als index.html eingerichtet.
Mit dem FHEM UI klappt es einwandfrei ... mit FTUI nicht. Erst nach mehreren reloads der Seite kommt die Seite dann auch und die Verbindung geht kurz danach wieder flöten:
Fehler beim Aufruf der folgenden Adresse
http://10.10.10.75:8083/fhem/tablet/index.html
The connection to the server was unsuccessful. (-6)
Die index.html ist wie schon geschrieben die example mit auskommentierter und an mein Tab angepasster Konfig. (12341;AndTab1).
Def in FHEM:
define AndTab1 webViewControl 12341
attr AndTab1 room test
define ftui HTTPSRV tablet/ ./www/tablet FTUI
attr ftui room test
Hier noch der head Bereich der index.html
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12341': 'AndTab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
Th.
Edit: hatte das Tablet auch mal komplett resettet ... ist derzeit nur das WVC (zum Standardgeraffel) installiert!
Hallo Zusammen,
was kann der Grund sein, dass das normale Frontend von FHEM über ein trigger WEB JS:location.reload(true) aktualisiert wird, das FTUI aber nicht?
Gruß Jörn
Hi Setstate,
Woah, lange nicht mehr reingeschaut... Hier ist ja richtig was los und schon auf Seite 108.
Sauber was hier entstanden ist. Ich muss wohl auch mal wieder meine FTUI neu "relaunchen" ;-)
Gerade ist mir aufgefallen, dass im weather-widget das Proplanta Matching für "Nebel" (M) fehlt.
Könntest du das bitte noch ergänzen.
Schöne Grüße
und schönes Pfingstfest an Alle
Jens
Hallo update71,
kann sein dass ich da etwas falsch verstehe, aber ich starte mein Tablet WVC mit der fhem UI und betätige dann den Button Tablet Frontend oben links um zur NFTUI zu gelangen!
Gruß
Ralf
Das Thema "Abfallkalender" scheint ja immer sehr beliebt zu sein. Da ich nach zahlreichen Anfragen auf meinem Blog meine Lösungen mit FHEM immer wieder mal im Detail vorstellen wollte, habe ich heute einen ersten Artikel zu meiner Lösung eines Abfallkalenders dargestellt. Wer Interesse hat, kann gerne mal vorbeischauen http://www.blog-gedanken.de/smarthome-2/smarthome-mit-fhem-umsetzung-meines-abfallkalenders/ (http://www.blog-gedanken.de/smarthome-2/smarthome-mit-fhem-umsetzung-meines-abfallkalenders/)
Zitat von: update71 am 23 Mai 2015, 12:14:22
define AndTab1 webViewControl 12341
attr AndTab1 room test
define ftui HTTPSRV tablet/ ./www/tablet FTUI
attr ftui room test
Achtung die obige HTTPSRV definition funktioniert aus meinem Verständnis nur korrekt, wenn die von mir vorgeschlagenen Korrektur an HTTPSRV.pm vorgenommen wird (alternativ der ältere Vorschlag Änderung an FHEMWEB).
Siehe dazu den Thread im entsprechenden Modul:
Zitat von: viegener am 21 Mai 2015, 00:14:51
Wenn in 02_HTTPSRV in sub HTTPSRV_CGI
die Zeile (bei mir Zeile 119)
if($request =~ m,^(/[^/]+)(/(.*)?)?$,) {
in
if($request =~ m,^(/[^/]+/)((.*)?)?$,) {
geändert wird, geht es in meinen Szenarien ganz wunderbar. Allerdings muss natürlich eine device definition für HTTPSRV den Slash auch enthalten.
Ansonsten erkennt HTTPSRV seine eigene URL-Erweiterung nicht mehr. Angelegt wird sie mit dem Slash (/) am Ende, aber beim Aufruf wird sonst der Slash entfernt und die eigene Definition nicht mehr gefunden und eine Fehlermeldung zurückgegeben...
Zitat von: viegener am 24 Mai 2015, 10:54:26
Achtung die obige HTTPSRV definition funktioniert aus meinem Verständnis nur korrekt, wenn die von mir vorgeschlagenen Korrektur an HTTPSRV.pm vorgenommen wird (alternativ der ältere Vorschlag Änderung an FHEMWEB).
Siehe dazu den Thread im entsprechenden Modul:
Ansonsten erkennt HTTPSRV seine eigene URL-Erweiterung nicht mehr. Angelegt wird sie mit dem Slash (/) am Ende, aber beim Aufruf wird sonst der Slash entfernt und die eigene Definition nicht mehr gefunden und eine Fehlermeldung zurückgegeben...
Ich hab das mal geändert aber mit der obigen Definition
define ftui HTTPSRV tablet/ ./www/tablet FTUI bleibt es dabei, wenn ich auf den FTUI Link klicke bekomme ich eine weiße Seite!
Zitat von: pnewman am 23 Mai 2015, 22:45:36
Hallo update71,
kann sein dass ich da etwas falsch verstehe, aber ich starte mein Tablet WVC mit der fhem UI und betätige dann den Button Tablet Frontend oben links um zur NFTUI zu gelangen!
Gruß
Ralf
WVC funktioniert wenn ich es so mache mit der FHEM UI, gehe ich über den Link auf FTUI geht WVC aber trotzdem nicht. ich muss, um über den Link in der FHEM UI auf die FTUI zu kommen, auch mein define von ftui mit tablet/index.html machen, sonst komme ich eh nur auf eine weiße Seite.
Zitat von: jsloot am 23 Mai 2015, 12:25:46
Hallo Zusammen,
was kann der Grund sein, dass das normale Frontend von FHEM über ein trigger WEB JS:location.reload(true) aktualisiert wird, das FTUI aber nicht?
Gruß Jörn
Hat jemand von euch das mal probiert?
@jual: Welche Funktion hat dein Barcode?
Generell Frage zum Abfallkalender: Es wird bei "gelber" Tonne, "blauer" Tonne etc. immer eine Zahl ausgegeben. Was soll mir diese geraten? Sinnvoller wäre es doch wenn ich das Datum weiß, wann ich welche Tonne vor die Tür stellen soll.
Die Zahl bedeutet, Leerung in X Tagen!
ok, dass macht natürlich Sinn :-)
@wvc: Bei mir hat das Einrichten gut geklappt, nachdem ich in der index.html die Auskommentierung von wvc zurück genommen habe und bei var wvc-Devices die GeräteID und den FHEM Tabletnamen eingetragen habe.
VG, Stephan
@bjoernbo: Die Frage zur der Anzahl Tage bis zur Leerung ist ja schon geklärt worden
Der QR Code ist von meiner Fritzbox und dient dazu, dass sich Gäste mit dem Gast-Zugang des WLAN einfach verbinden können.
Zitat von: StG (DD) am 24 Mai 2015, 21:25:47
@wvc: Bei mir hat das Einrichten gut geklappt, nachdem ich in der index.html die Auskommentierung von wvc zurück genommen habe und bei var wvc-Devices die GeräteID und den FHEM Tabletnamen eingetragen habe.
VG, Stephan
meinst du so:
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl --> wenn ja, das läuft bei mir nicht.
ja, genau. Schade, hät so einfach sein können ???
Hallo,
ich bastle schon eine Weile an einem Faceplate für meine Hue herum. So ganz klappt es allerdings noch nicht - vielleicht kann mir jemand weiterhelfen?
Das Problem ist die Formatierung von
state dim06% und
ct 353 (2832K)
Wie ihr seht, habe ich es mit data-part versucht, doch wie müssen die RegEx'en lauten?
Danke!
<li data-row="1" data-col="2" data-sizex="1" data-sizey="4">
<header>Hue Lamp 1</header>
<div class="centered container cell">
<table>
<tr><td>
<div data-type="label" >wz.di.LampeFenster</div>
<div data-type="switch" data-device="wz.di.LampeFenster" data-get="onoff" data-get-on="1" data-get-off="0" data-set-on="on" data-set-off="off" class="cell" ></div>
</td></tr>
<tr><td>
<div data-type="label" class="cell inline">pct</div> <div data-type="label" data-device="wz.di.LampeFenster" data-part="([0-9]{1,3}).*" class="cell inline"></div>
<div data-type="slider" data-device="wz.di.LampeFenster" class="cell horizontal" ></div>
</td></tr>
<tr><td>
<div data-type="label" class="cell inline">ct</div> <div data-type="label" data-device="wz.di.LampeFenster" data-get="ct" class="cell inline"></div>
<div data-type="slider" data-device="wz.di.LampeFenster" data-get="ct" data-set="ct" data-min="154" data-max="500" class="cell horizontal" ></div>
</td></tr>
<tr><td>
<div data-type="label" class="cell inline">sat</div> <div data-type="label" data-device="wz.di.LampeFenster" data-get="sat" class="cell inline"></div>
<div data-type="slider" data-device="wz.di.LampeFenster" data-min="0" data-max="254" data-get="sat" data-set="sat" class="cell horizontal" ></div>
</td></tr>
<tr><td>
<div data-type="volume" data-device="wz.di.LampeFenster" data-min="0" data-max="65535" data-get="hue" data-set="hue" data-tickstep="4" class="cell small hue-tick" ></div>
</td></tr>
</table>
</div>
</li>
Zitat von: robertPI am 24 Mai 2015, 23:50:29
Hallo,
ich bastle schon eine Weile an einem Faceplate für meine Hue herum. So ganz klappt es allerdings noch nicht - vielleicht kann mir jemand weiterhelfen?
Das Problem ist die Formatierung von
state dim06% und
ct 353 (2832K)
Wie ihr seht, habe ich es mit data-part versucht, doch wie müssen die RegEx'en lauten?
Danke!
<li data-row="1" data-col="2" data-sizex="1" data-sizey="4">
<header>Hue Lamp 1</header>
<div class="centered container cell">
<table>
<tr><td>
<div data-type="label" >wz.di.LampeFenster</div>
<div data-type="switch" data-device="wz.di.LampeFenster" data-get="onoff" data-get-on="1" data-get-off="0" data-set-on="on" data-set-off="off" class="cell" ></div>
</td></tr>
<tr><td>
<div data-type="label" class="cell inline">pct</div> <div data-type="label" data-device="wz.di.LampeFenster" data-part="([0-9]{1,3}).*" class="cell inline"></div>
<div data-type="slider" data-device="wz.di.LampeFenster" class="cell horizontal" ></div>
</td></tr>
<tr><td>
<div data-type="label" class="cell inline">ct</div> <div data-type="label" data-device="wz.di.LampeFenster" data-get="ct" class="cell inline"></div>
<div data-type="slider" data-device="wz.di.LampeFenster" data-get="ct" data-set="ct" data-min="154" data-max="500" class="cell horizontal" ></div>
</td></tr>
<tr><td>
<div data-type="label" class="cell inline">sat</div> <div data-type="label" data-device="wz.di.LampeFenster" data-get="sat" class="cell inline"></div>
<div data-type="slider" data-device="wz.di.LampeFenster" data-min="0" data-max="254" data-get="sat" data-set="sat" class="cell horizontal" ></div>
</td></tr>
<tr><td>
<div data-type="volume" data-device="wz.di.LampeFenster" data-min="0" data-max="65535" data-get="hue" data-set="hue" data-tickstep="4" class="cell small hue-tick" ></div>
</td></tr>
</table>
</div>
</li>
Irgendwo um Seite 100 von diesem Thread fragte ich ähnliches. So gehts bei mir mit den HUEs beim dimmen.
data-get-on='["off","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%","on"]' Vielleicht hilfts dir weiter, mehr als dimmen können meine HUEs leider nicht :)
Zitat von: jsloot am 23 Mai 2015, 12:25:46
was kann der Grund sein, dass das normale Frontend von FHEM über ein trigger WEB JS:location.reload(true) aktualisiert wird, das FTUI aber nicht?
Das ist eine Funktion von FHEMWEB die FTUI nicht kennt. Ich habe aber grade ein widget_reload (https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_reload.js) im Testing-Verzeichnis eingecheckt.
<div data-type="reload"
data-device="TEST"
data-reload-on="1"
data-reset-to="0"></div>Wenn TEST den Wert "1" hat wird ein Pagereload ausgelöst und der Wert wird auf "0" zurück gesetzt. Das ist notwendig um eine unendliche Reload-Schleife zu verhindern. Um das Widget zu verwenden, sollte man also einen Dummy definieren, den man gezielt setzt um Pagereloads anzustoßen.
Zitat von: jehu am 23 Mai 2015, 15:41:47
Gerade ist mir aufgefallen, dass im weather-widget das Proplanta Matching für "Nebel" (M) fehlt.
Habs aufgenommen, danke!
Zitat von: nesges am 25 Mai 2015, 02:01:13
Das ist eine Funktion von FHEMWEB die FTUI nicht kennt. Ich habe aber grade ein widget_reload (https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/testing/widget_reload.js) im Testing-Verzeichnis eingecheckt.
<div data-type="reload"
data-device="TEST"
data-reload-on="1"
data-reset-to="0"></div>
Wenn TEST den Wert "1" hat wird ein Pagereload ausgelöst und der Wert wird auf "0" zurück gesetzt. Das ist notwendig um eine unendliche Reload-Schleife zu verhindern. Um das Widget zu verwenden, sollte man also einen Dummy definieren, den man gezielt setzt um Pagereloads anzustoßen.
Hi nesges,
ich bin begeistert! Vielen Dank!!!
@Phil__ : Ich habe deinen "Abfallkalender" übernommen. Anstelle eines Google-Kalenders habe ich mir das .ics-File direkt in FHEM abgelegt. Das sollte doch auch Funktionieren oder?? Allerdings bekomme ich die Pfadauflösung nicht hin.
Beide Funktionieren leider nicht :-(
Zitatical url opt/fhem/www/tablet/Muellkalender/USB_Abfuhrtermine.ICS 3600
Zitatical url /www/tablet/Muellkalender/USB_Abfuhrtermine.ICS 3600
ZitatCalendar Abfall: Could not retrieve file at URL. <hidden>: malformed or unsupported URL
schau dir die commandref von calendar an, nicht url sondern file, damit sollte es klappen...
::) DANKE! Das wars! :-)
Zitat von: viegener am 21 Mai 2015, 00:46:34
Hallo Thomas,
Nein generell ist das nicht nötig. Bei mir enthält die Index.html im Head alle includes (also css und js-Dateine).
Die einzelnen Seiten, die als pagetab geladen werden, enthalten dann im wesentlichen nur noch den Seiteninhalt. Ich habe sie weiterhin als vollwertige HTML-Seiten ausgeführt aber nur noch die eigentlichen Gridster-Element mit den widgets:
<!DOCTYPE html>
<html>
<head>
<title>Detail</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
<!-- *******Hier kommen dann die einzelnen widgets als weitere li-Einträge *********** -->
</ul>
</div>
</body>
</html>
Gruss,
Johannes
Hallo,
beim ersten überfliegen hört es sich interessant an.
Nur leider hab ich das Gefühö das ich es nicht 100%ig verstanden haben.
Kann das jemand genauer erklären?
Was passiert da genau?
Wird hier zB das Menü als pagetab nur einmal geladen und dann immer nur die Änderungen (Unterschiedliche Widgets der Unterseiten)?
Was genau ist der Vorteil?
Viele Grüße
Zitat von: Phil__ am 25 Mai 2015, 11:28:05
Hallo,
beim ersten überfliegen hört es sich interessant an.
Nur leider hab ich das Gefühö das ich es nicht 100%ig verstanden haben.
Kann das jemand genauer erklären?
Was passiert da genau?
Wird hier zB das Menü als pagetab nur einmal geladen und dann immer nur die Änderungen (Unterschiedliche Widgets der Unterseiten)?
Was genau ist der Vorteil?
Viele Grüße
Also ich versuche mal eine Erklärung:
Mein Problem war ursprünglich ein Problem mit pagetab:
Die Unterseiten (also .../index.html#andererpagetab.html) wurden bei einem Refresh nicht wieder geladen, sondern die Hauptseite, denn die Unterseite war ja nur als #... ausgeführt (also eigentlich eine Markierung innerhalb von index.html). Ausserdem war dann auch der falsche pagetab-Button aktiv. Ich fand das während der Entwicklung schwierig, da es immer ziemlich viele Ladevorgänge waren bis man wieder eine veränderte Seite sehen konnte.
Also habe ich dann pagetab angepasst, das geht allerdings nicht ohne eine Verhaltensänderung, nämlich muss sich die Standardseite, also die Widgets, die in index.html sind auch in eine getrennte pagetab-Seite ausgelagert werden.
Index.html enthält die Verweise zu allen css und js-Dateien, den gridster-Eintrag und NUR das Menu
<div class="gridster" >
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
</ul>
</div>
Beim Laden der Seite wird nun index.html geladen und das Menu. Im Menu entscheidet das pagetab-Widget nun, welche Seite wirklich geladen werden soll. Diese wird dann im HIntergrund geladen und der Inhalt des Gridster-Tags wird dann durch diese Inhalte ersetzt. Da nur der Gridster-Inhalt ersetzt wird, sind keine weiteren css/JS includes nötig und eigentlich braucht man auch keine vollständige HTML-Seite, denn es wird ja nur ein innerer Teil ersetzt.
Etwas unschön ist noch, dass das Menu zweimal geladen wird, da es ja in index.html enthalten sein muss (um überhaupt ein pagetab widget zu haben) und auch nochmal in der Unterseite, die dann zusätzlich geladen wird. Dies ist momentan notwendig, da der ganze Gridster-Inhalt (inklusive dem Menu) ersetzt wird.
Vorteil:
- Alle Unterseiten sind identisch strukturiert. Es gibt keine Unterschied mehr zwischen "Einstiegsseite" also was standardmässig angezeigt wird beim Einstieg in das ftui und den Unterseiten. Ich persönlich finde das klarer und einfacher.
- Der Reload funktioniert auch auf Unterseiten (Und das war für mich das eigentliche Ziel)
Ich hoffe das war etwas klarer beschrieben.
Gruss,
Johannes
PS: Wenn wir die beiden pagetab-Varianten nicht zusammenführen können, wäre es auch denkbar meinen pagetab umzubenennen in subscreen o.ä.
Zitat von: setstate am 21 Mai 2015, 20:45:16
1. Erweiterung Dimmer Widget
- neues Attribut "data-dim" für ein separates Reading für den Dimmer
Der Dimlevel wird prima synchronisiert. Habe aber Probleme mit dem Status (on,off)
Dieser stimmt erst nach einem page reload.
Im consolen log ist nichts zu finden. Ideen?
Danke. Risiko.
Updates von nesges, viegener und mir sind eingechecked:
- Select Widget kennt jetzt data-quote, um zum Beispiel ein Playlist mit Leerzeichen auswählen zu können. Die List kann dann mit Anführungszeichen umschlossen werden.
- mit <meta name="widget_margin" content="3"> kann man die Abstände der Gridster Elemente kleiner machen
- Weather Widget hat jetzt das Proplanta Matching für "Nebel" (M)
- Slider Widget kann jetzt optional auch mit data-width / data-height beeinflusst werden.
- Pagetab and readingsgroup Widget von viegener
Hallo,
seit dem Update funktioniert bei mir bei dem label das data-fix nicht mehr. Es werden jetzt alle Nachkommastellen einer Zahl angezeigt.
Kann dies jamand bestätigen? Danke!
VG
Sven
Zitat von: setstate am 26 Mai 2015, 00:54:52
Updates von nesges, viegener und mir sind eingechecked:
- Select Widget kennt jetzt data-quote, um zum Beispiel ein Playlist mit Leerzeichen auswählen zu können. Die List kann dann mit Anführungszeichen umschlossen werden.
- mit <meta name="widget_margin" content="3"> kann man die Abstände der Gridster Elemente kleiner machen
- Weather Widget hat jetzt das Proplanta Matching für "Nebel" (M)
- Slider Widget kann jetzt optional auch mit data-width / data-height beeinflusst werden.
- Pagetab and readingsgroup Widget von viegener
Super .... *daumenhoch* und immer wieder Danke an alle die helfen und bauen !!!
Sind für das pagetab-widget von viegener noch die js Anpassungen nötig oder habt ihr die jetzt per default im code?
Zitat von: SvenJust am 26 Mai 2015, 07:46:14
Hallo,
seit dem Update funktioniert bei mir bei dem label das data-fix nicht mehr. Es werden jetzt alle Nachkommastellen einer Zahl angezeigt.
Kann dies jamand bestätigen? Danke!
VG
Sven
Danke Sven,
trotz 4-Augen Prinzip ist ein Bug durchgerutscht. Ist jetzt gefixed.
Sorry
Vielen Dank für die schnelle Korrektur und eure tolle Arbeit.
Gibt es die Möglichkeit aus dem oa fonts nur die von mir benötigten icons zu exportieren und in einen font zu packen. Wenn ja kann mir das jemand erklären? Werde aus dem wiki nicht schlau...
Viele Grüsse
Zitat von: Phil__ am 26 Mai 2015, 11:55:30
Gibt es die Möglichkeit aus dem oa fonts nur die von mir benötigten icons zu exportieren und in einen font zu packen. Wenn ja kann mir das jemand erklären? Werde aus dem wiki nicht schlau...
Da für den Font kein selection.json vorliegt, würde nicht den Font, sondern das SVG-Verzeichnis von Fhem als Grundlage für die Icomoon-App nehmen.Dann müsste's auch mit der Anleitung im Wiki klappen.
Hallo nesges, ich benutze immer noch dein settimer-widget für meinen Wecker und möchte das komplette Widget größer bekommen, damit ich Abends beim Weckerstellen grobmotorischer sein kann :D
Für ein <class="cell bigger"> scheinen sich nur die Buttons zu interessieren. Dass sie in die Knobs reinrutschen, konnte ich mit .widget_settimer_set {left: 50px;} verhindern.
Was ich bräuchte:
Eine Möglichkeit die Knobs für Stunde und Minuten größer zu bekommen, ggf. auch größer als bigger. Versucht habe ich .widget_settimer_hour_wrap {height: 120%;} ohne Erfolg.
Kannst du mir auf die Sprünge helfen?
lg
aeronaut
Hi,
hier mal ein Codeschnipsel für das Dimmer Widget in Verbindung mit MilightDevice
<div data-type="dimmer"
data-device="SonstWas"
data-get="brightness"
data-get-off="0"
data-get-on="[1-9][0-9]*"
data-set-on="on"
data-set-off="off"
data-dim="dim"
data-min="0"
data-max="100"
></div>
Hallo,
@setstate
Meine Probleme bei Laden einer Seite bzw von Widgets, das nicht alle Widgets vollständig geladen werden schein erstmal behoben!
So banal wie simpel.... :o ::)
Bei der verwendung von http,anstatt https, treten die Probleme nicht mehr auf.
Edit:
Allerdings sind die Ladezeit nicht so schnell wie ich mir das wünschen würde.
1.) Am Pc kein Problem mit den Ladezeiten!
2.) Am Tablet (Nexus 7 mit wvc) wird jetzt zwar immer alles vollständig geladen. Allerings Ladezeiten bis zu und manchmal etwas mehr als eine Sekunden...
Kann man das beschleunigen? Ich teste gerade mit Websockets, aber da nicht nur die Fhem Werte sondern die Komplette Seite/Widgets lange laden glaube ich kaum dass das Problem damit behoben wird.
Zitat von: Risiko am 25 Mai 2015, 19:19:30
Der Dimlevel wird prima synchronisiert. Habe aber Probleme mit dem Status (on,off)
Dieser stimmt erst nach einem page reload.
Im consolen log ist nichts zu finden. Ideen?
Zur Info.
Liegt an data-get="state". Lässt man data-get weg (also default STATE) funktioniert das Update des Status.
Ist beim Switch auch so.
Risiko.
Hallo
spiele gerade ein wenig mit der UI.
Jetzt würde ich damit die Gruppen von meinen Sonos einstellen.....
als Set Befehl wäre es z.B.
set Sonos Groups [Sonos_Buero], [Sonos_Wohnzimmer], [Sonos_Bad]
set Sonos Groups [Sonos_Buero, Sonos_Wohnzimmer], [Sonos_Bad]
set Sonos Groups [Sonos_Buero, Sonos_Wohnzimmer, Sonos_Bad]
Jetzt wären die Parameter ja für das Auswahlmenü recht lang. Wie kann ich der Menüauswahl jetzt einen kurzen Text zuordnen im sinne von "ALL" was dann "[Sonos_Buero, Sonos_Wohnzimmer, Sonos_Bad]" sendet.
stenny
Hallo stenny,
für kurze Texte im Select Widget nutz man data-alias. Das ist ein Array, wobei die Anzahl der Elemente nicht mit der wirklichen Anzahl der realen Listenelemente übereinstimmen muss.
data-alias='["DLF","tormentedradio"]'
Zitat von: setstate am 26 Mai 2015, 22:32:16
Hallo stenny,
für kurze Texte im Select Widget nutz man data-alias. Das ist ein Array, wobei die Anzahl der Elemente nicht mit der wirklichen Anzahl der realen Listenelemente übereinstimmen muss.
data-alias='["DLF","tormentedradio"]'
erstamal Danke für die Antwort.
im Moment versuche ich.....
<div class="cell wider">
<div data-type="label"
class="inline wider">WZ</div>
<div data-type="select"
data-device="Sonos"
data-alias='["WZ","WZ_Büro","WZ_BAD","ALL"]'
data-items='["[Sonos_Wohnzimmer], [Sonos_Büro], [Sonos_Bad]","[Sonos_Wohnzimmer, Sonos_Büro], [Sonos_Bad]","[Sonos_Wohnzimmer, Sonos_Bad], [Sonos_Büro]","[Sonos_Wohnzimmer, Sonos_Büro, Sonos_Bad]"]'
data-get="Groups"
data-set="Groups"
class="cell w2x" >
</div>
<div>Was ich versuche zu erhalten ist in der Art....
set Sonos Groups [Sonos_Wohnzimmer], [Sonos_Büro], [Sonos_Bad]
sieht sooo schlecht nicht aus ...
Und funktioniert es?
Ich habe es mal getestet. Das FHEM Command sieht zumindest so wie von dir erwartet aus:
"send to FHEM: set Sonos Groups [Sonos_Wohnzimmer, Sonos_Büro], [Sonos_Bad]"
Bin schon im halbschlaf.....
Klappt leider nicht....
Ich bekomme ein "set Sonos Groups ALL" - also die Aliastexte.....
Sorry, hätte ich sagen sollen: Gestern gab es noch ein Bugfix an dieser Stelle.
Du musst ein Update machen:
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Oder nur das File "widget_select.js" neu holen
Bingo.
Klappt. Hatte zwar heute noch updates gemacht aber die zusätlichen Sachen der UI natürlich nicht.....
Super.... Danke....
Hallo zusammen,
ich habe seit heute morgen das Problem das mein menu(pagetab) nicht mehr auf die Index Seite zurück springen will. Das Symbol ist auch immer aktiv. Wechseln in die anderen Ansichten klappt. Wenn ich zB Staus aufrufe ist nun in der Ansicht Index und Status als aktiv markiert.
Was ich heute morgen gemacht habe war ein update.
Noch jemand mit diesem Problem. Ich dachte zunächst, dass sich die Wigdets pagetab und button nicht vertragen. Nachdem ich alle buttons in pagetab geändert habe, schien das Problem zunächst weg. Aber ich habe das gleiche Phänomen wie TNT0068. Bis zum Update war alles gut :-\
Mach mal den ersten Aufruf der Seiten ohne Angabe einer speziellen Seite, also Index.html nicht mit angeben. Dann sollte es klappen. Wenn nicht, müsstest du mal im github Projektfolder 'examples/pagetab' nachsehen, ob es bei dir auch so eingerichtet ist, wie in der Demo. Nach dem Update ist das pagetab Widget in der Version von viegener, die nicht mehr mit allen Konstellationen umgehen kann, aber dafür Vorteile beim Refresh mitbringt.
Auch wenn man neue Seiten oder Widgets testet, sollte man pagetab für die Testphase weglassen. Das liegt daran, weil bei pagetab in volle und Unterseiten unterschieden wird. Nur bei vollen Seiten (inkl. der CSS und js links) wird die Seite kpl. neu geladen. Mit pagetab kommt vieles aus dem Cache, ist dadurch im produktiven Betrieb aber auch flotter.
Es scheint keine Möglichkeit zu geben, das Select-Widget mit z.B. class="bigger" zu vergrößern, oder mache ich was falsch? Es scheint nur eine Größe zu haben und in der Doku steht ja auch, dass nicht jedes Widget jede CSS-Klasse unterstützt ... könnte das ggf. erweitert werden?
lg
aeronaut
Wahrscheinlich liegt es an irgendwelchen Dingen die im Cache lagern. Meine Startseite/Hauptseite heißt home_eg.html. Wenn ich die aufrufe (http://<IP>:8083/fhem/tablet/home_eg.html) komme ich zu http://<IP>:8083/fhem/tablet/home_eg.html#raeume_eg.html. Ich lande also auf der Räume-Seite. Der dortige Button (pagetab-Widget) zu home_eg.html klappt dann nicht mehr.
Die erste Seite muss so aufgerufen werden:
http://<IP>:8083/fhem/tablet/
Also ohne *.html. Ich denke dann müsste es eine index.html geben als Einstieg und mit den Links zu den scripten und dann die Unterseiten mit leerer Header Section.
Evtl. müsste Pagetab noch etwas robuster für die von dir beschriebene Konstellation gemacht werden.
Danke für eure Tipps.
wenn http://<IP>:8083/fhem/tablet/ aufrufe zeigt er mir gar keine Seite an.
Cache im Browser gelöscht und auch ein anderes Gerät verwendet.
Meine Version habe ich mit der github verglichen. Ich konnte keinen Fehler sehen. <html>
<html>
<body>
<header>Raeume</header>
<div class="cell">
<div data-type="pagetab" data-url="index.html" data-icon="fa-home" class="top-space"></div>
<div data-type="pagetab" data-url="multimedia.html" data-icon="fa-sliders" class="top-space"></div>
<div data-type="pagetab" data-url="status.html" data-icon="fa-heartbeat" class="top-space"></div>
</div>
</body>
</html>
Wie hast das im fhem.cfg definiert? So sollte es gehen:
define TABLETUI HTTPSRV ftui ./www/tablet/ Tablet-UI
Und dann die URL http://<ip>:8083/fhem/ftui/
Zitat von: setstate am 27 Mai 2015, 12:16:33
Wie hast das im fhem.cfg definiert? So sollte es gehen:
define TABLETUI HTTPSRV ftui ./www/tablet/ Tablet-UI
Und dann die URL http://<ip>:8083/fhem/ftui/
Das funktioniert bei mir so auch nicht. Schrieb ich ja schon mehrmals.
Leider klappt es nicht.
Bekomme jetzt: File not found: ./www/tablet/index.html
Die Index liegt aber unter tablet
/volume1/@appstore/FHEM/share/fhem/www/tablet
Zitat von: setstate am 27 Mai 2015, 11:57:37
Die erste Seite muss so aufgerufen werden:
http://<IP>:8083/fhem/tablet/
Also ohne *.html. Ich denke dann müsste es eine index.html geben als Einstieg und mit den Links zu den scripten und dann die Unterseiten mit leerer Header Section.
Evtl. müsste Pagetab noch etwas robuster für die von dir beschriebene Konstellation gemacht werden.
Klar, wenn ich die erste Seite so aufrufe, komme ich zu der html-Seite, die index.html heißt. Das ist aber dumm für mich, da nun alle meine Unterseiten auf home_eg.html verweisen und ich zudem später weitere Geschosse (home_og.html etc.) dazu nehmen möchte.
Würde es helfen, wenn ich aus den Unterseiten den Header rausnehme? Bisher ist in allen Unterseiten der Header drin.
Dann weiß ich auch nicht mehr ...
Am besten ihr holt die alte widget_pagetab.js wieder aus dem fhem Backup und ich mache heute Abend eine Rolle rückwärts zur vorherigen Version auf github, denn evtl. haben noch mehr Probleme mit der neuen Version.
Zitat von: aeronaut am 27 Mai 2015, 11:32:50
Es scheint keine Möglichkeit zu geben, das Select-Widget mit z.B. class="bigger" zu vergrößern, oder mache ich was falsch? Es scheint nur eine Größe zu haben und in der Doku steht ja auch, dass nicht jedes Widget jede CSS-Klasse unterstützt ... könnte das ggf. erweitert werden?
lg
aeronaut
Was genau soll größer werden? Die Schrift und damit die Höhe? Die Breite kann man jetzt schon mit w2x und w3x festlegen
setstate danke für deine Hilfe.
Habe eben ein Rollback gemacht und geht wieder wie gewohnt
Zitat von: aeronaut am 26 Mai 2015, 17:12:44
Was ich bräuchte:
Eine Möglichkeit die Knobs für Stunde und Minuten größer zu bekommen, ggf. auch größer als bigger. Versucht habe ich .widget_settimer_hour_wrap {height: 120%;} ohne Erfolg.
Kannst du mir auf die Sprünge helfen?
settimer implementiert momentan noch keine Möglichkeit zur Einstellung der Größe, aber ich werd's mir mal ansehen.
Zitat von: setstate am 27 Mai 2015, 13:12:49
Dann weiß ich auch nicht mehr ...
Am besten ihr holt die alte widget_pagetab.js wieder aus dem fhem Backup und ich mache heute Abend eine Rolle rückwärts zur vorherigen Version auf github, denn evtl. haben noch mehr Probleme mit der neuen Version.
Bei funktioniert es mit den Pagetabs einwandfrei. Ich hab die Änderungen von viegener schön länger drin.
Bei mir klappt nur der Aufruf ohne Angabe von Index.html nicht. Wenn ich http://fhem:8083/fhem/tablet/ Aufrufe kommt eine weiße Seite. Hat aber nix mit dem Update zu tun. Ist schon länger so. Das wollte Ich damit sagen.
Bitte keine Rolle rückwärts!
update71 wie rufst du dann die erste Seite auf?
Sobald ich bei dem neuen Pagetab mit Seite die URL aufrufe habe ich eben das Problem.
Zitat von: TNT0068 am 27 Mai 2015, 13:35:03
update71 wie rufst du dann die erste Seite auf?
Sobald ich bei dem neuen Pagetab mit Seite die URL aufrufe habe ich eben das Problem.
http://fhem:8083/fhem/tablet/index.html
Da ist dann das Menü und die includes drin. Die erste Seite ist dann start.html die dann zum Menü geladen wird.
Könntest du mir mal die Index.html zu verfügung stellen. Dann baue ich die mal ein mal sehen wie sich Pagetab dann verhält
@setstate
Wäre es möglich das Homestatus Modul etwas auf zu bohren. Ich bräuchte noch ein gotosleep. Das ist ja im Moment von der Anzeige mit im Sleep drin. Ich bräuchte es als weitere Auswahl.
Anwendungsbeispiel:
gotosleep Sohn
- Licht geht im Bad an wenn es zu dunkel ist, Heizung im Bad macht für 15 min ein boost, Sohn ist 1,5 Jahre alt und hat es gerne warm beim waschen
- Im Kinderzimmer geht das Nachtlicht an
gotosleep Eltern
- Ansage der Uhrzeit, Ansage des Wetters morgen früh, Licht an im Bad und im Schlafzimmer, Licht aus in nicht benötigten Räumen
Also ein GotoSleep Button wäre schon schön ;D
Grüße
Zitat von: TNT0068 am 27 Mai 2015, 13:42:08
Könntest du mir mal die Index.html zu verfügung stellen. Dann baue ich die mal ein mal sehen wie sich Pagetab dann verhält
heute Abend gerne. Bin in Berlin bummeln :)
update71 paahhhh das geht ja mal garnicht. Viel Spaß :) Kann dann aber erst morgen testen
@setstate bitte ändere erstmal nichts ausser es melden sich noch mehr die das Problem haben. Ich werde es morgen nochmal testen. heute abend habe ich leider keine Zeit
Zitat von: setstate am 27 Mai 2015, 13:16:29
Was genau soll größer werden? Die Schrift und damit die Höhe? Die Breite kann man jetzt schon mit w2x und w3x festlegen
Ja genau, die Schrift der Select-Items sollte größer werden, die Breite reicht nicht.
So Pagetab läuft jetzt. Habe nun eine leere Index.html die nur auf das Menü verweist und in Pagetab nicht mehr angesprochen wird.
Ich hoffe mal nicht das ich irgendwo etwas dazu überlesen habe.
Zitat von: TNT0068 am 27 Mai 2015, 15:34:09
So Pagetab läuft jetzt. Habe nun eine leere Index.html die nur auf das Menü verweist und in Pagetab nicht mehr angesprochen wird.
Ich hoffe mal nicht das ich irgendwo etwas dazu überlesen habe.
Gute Idee! Werde ich heute Abend mal testen.
Zitat von: mw_fhem am 27 Mai 2015, 15:59:58
Gute Idee! Werde ich heute Abend mal testen.
Ein schneller Test hat leider nicht zum Erfolg geführt :-[ Ich werde morgen in Ruhe nochmal alles durchgehen.
Ich hab es so:
index.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-HC #index</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="130"> <!-- 116 -->
<meta name="widget_base_height" content="140"> <!-- 131 -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<div data-type="clicksound"
data-sound='["ion-button-tiny","ion-button-click-on","ion-tap"]'
data-length='[200,300,400]'
data-bind-to='["+button","+knob","+slider"]'></div>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster ready">
<ul style="height: 775px; width: 1270px; position: relative;">
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu.html" class="gs-w">
</li>
</ul>
</div>
</body>
</html>
menu.html
<html>
<body>
<header>Räume</header>
<div class="cell">
<div data-type="pagetab" data-url="start.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="multimedia.html" data-icon="fa-sliders" class="cell"></div>
<div data-type="pagetab" data-url="wetter.html" data-icon="fa-cloud" class="cell"></div>
<div data-type="pagetab" data-url="heizung.html" data-icon="oa-sani_heating" class="cell"></div>
</div>
</body>
</html>
start.html (gekürzt)
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-HC</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="130"> <!-- 116 -->
<meta name="widget_base_height" content="140"> <!-- 131 -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<div data-type="clicksound"
data-sound='["ion-button-tiny","ion-button-click-on","ion-tap"]'
data-length='[200,300,400]'
data-bind-to='["+button","+knob","+slider"]'></div>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster ready">
<ul style="height: 775px; width: 1270px; position: relative;">
<!------------- Menü links --------------- 1. Reihe senkrecht Platz 1-5 -------------------->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu.html" class="gs-w">
</li>
<!------------- Ende linkes Menü --------------------------------------------->
...
...
...
</ul>
</div>
</body>
</html>
Zitat von: aeronaut am 27 Mai 2015, 11:32:50
Es scheint keine Möglichkeit zu geben, das Select-Widget mit z.B. class="bigger" zu vergrößern, oder mache ich was falsch? Es scheint nur eine Größe zu haben und in der Doku steht ja auch, dass nicht jedes Widget jede CSS-Klasse unterstützt ... könnte das ggf. erweitert werden?
"bigger" ist mit einer Vergrößerung von 320% definiert - das wäre etwas übertrieben beim Timer ;) Aber "large" (150%) habe ich implementiert.
http://forum.fhem.de/index.php/topic,36122.msg298425.html#msg298425
Zitat von: update71 am 27 Mai 2015, 13:27:44
Bei funktioniert es mit den Pagetabs einwandfrei. Ich hab die Änderungen von viegener schön länger drin.
Ich auch.
Zitat von: update71 am 27 Mai 2015, 13:27:44
Bitte keine Rolle rückwärts!
+1
Cool wäre wenn mal jemand was zum Thema index.html oder nicht beim Aufruf von FTUI sagen kann.
Ich komme so: http://fhem:8083/fhem/tablet/ nicht auf die UI sondern erhalte eine blanke weisse Seite
Eine frische Testinstallation auf einem anderen PI ergab das gleiche Ergebnis.
mit http://fhem:8083/fhem/tablet/index.html gehts und ich werde korrekt nach http://fhem:8083/fhem/tablet/index.html#start.html weitergeleitet.
Da ich auch Probleme mit WVC habe (http://fhem:8083/fhem/ da funktioniert es einwandfrei) dass die Seite nicht geladen werden kann bzw nach kurzer Zeit die Seite nicht erreichbar ist (Fehler -2 oder -6) nehme ich an dass ich irgendwo was nicht so habe wie andere :)
Könnte mal jemand bei dem WVC mit der FTUI sauber läuft seine Def. für ftui, WVC und die entsprechende Stelle in den html's posten?
Eingerichtet und installiert habe ich WVC so wie in der Anleitung des Autors beschrieben.
Ich würde mich sehr freuen wenn wir das gelöst bekommen!
Danke
Zitat von: aeronaut am 27 Mai 2015, 11:32:50
Es scheint keine Möglichkeit zu geben, das Select-Widget mit z.B. class="bigger" zu vergrößern, oder mache ich was falsch? Es scheint nur eine Größe zu haben und in der Doku steht ja auch, dass nicht jedes Widget jede CSS-Klasse unterstützt ... könnte das ggf. erweitert werden?
Das
Select Widget geht jetzt mit der Class
large und
big größer zu machen. Dazu muss nur das CSS file neu gezogen werden.
Gibts ne Möglichkeit, einen RGB Controller über Volume anzusprechen ähnlich wie HUE?
Geht speziell um ein LW12 Wifi Light Modul.
Die Änderung der .cell margin von 5px auf 10px (fhem-tablet-ui.css 76) wirft ziemlich viel durcheinander. Lokal bei mir werd ich's überschreiben.
Zitat von: Lling am 27 Mai 2015, 23:47:14
Gibts ne Möglichkeit, einen RGB Controller über Volume anzusprechen ähnlich wie HUE?
Geht speziell um ein LW12 Wifi Light Modul.
Was genau brauchst du denn? Ein Farbrad, das RGB-Werte anstelle von HUE-Werten sendet kannst du mit der zusätzlichen Klasse "rgb" erzeugen:
<div data-type="volume"
data-device="LIGHT"
class="hue-tick rgb"></div>
Ich bräuchte ne Möglichkeit, dem device RGB HEX werte zu übergeben. Also anstell von data-min="0" meinetwegen data-min="FFFFF" z.b.
Hi,
Zitat
Geht speziell um ein LW12 Wifi Light Modul.
Wenn damit ei LW12 über das WifiLight Modul gemeint ist dann geht RGB und HUE..
vg
joerg
Also wenn ich
<div data-type="volume" data-device="V8Tisch" data-min="0" data-max="65535" data-get="hue" data-set="hue" class="hue-tick small top-space left-space-2x" ></div>
habe, reagiert das Modul nicht.
Verbaut ist das http://www.amazon.de/gp/product/B00G55329A?psc=1&redirect=true&ref_=oh_aui_detailpage_o00_s00 (http://www.amazon.de/gp/product/B00G55329A?psc=1&redirect=true&ref_=oh_aui_detailpage_o00_s00)
Zitat von: Lling am 28 Mai 2015, 00:09:20
Ich bräuchte ne Möglichkeit, dem device RGB HEX werte zu übergeben. Also anstell von data-min="0" meinetwegen data-min="FFFFF" z.b.
Die data-min und data-max Angaben bleiben in dezimal. Nur get und set werden in Hex RGB umgewandelt.
Hier ein Beispiel: http://forum.fhem.de/index.php/topic,34233.msg282365/topicseen.html#msg282365
Zitat von: update71 am 27 Mai 2015, 22:07:29
Cool wäre wenn mal jemand was zum Thema index.html oder nicht beim Aufruf von FTUI sagen kann.
Ich komme so: http://fhem:8083/fhem/tablet/ nicht auf die UI sondern erhalte eine blanke weisse Seite
Eine frische Testinstallation auf einem anderen PI ergab das gleiche Ergebnis.
mit http://fhem:8083/fhem/tablet/index.html gehts und ich werde korrekt nach http://fhem:8083/fhem/tablet/index.html#start.html weitergeleitet.
Das Problem liegt in HTTPSRV --> Hier ist eine minimale Änderung für HTTPSRV beschrieben, damit das Zusammenspiel richtig funktioniert:
Zitat von: viegener am 21 Mai 2015, 00:14:51
OK, vielleicht ist es ja doch ganz einfach, also neuer Patch:
Wenn in 02_HTTPSRV in sub HTTPSRV_CGI
die Zeile (bei mir Zeile 119)
if($request =~ m,^(/[^/]+)(/(.*)?)?$,) {
in
if($request =~ m,^(/[^/]+/)((.*)?)?$,) {
geändert wird, geht es in meinen Szenarien ganz wunderbar. Allerdings muss natürlich eine device definition für HTTPSRV den Slash auch enthalten. Also zum Beispiel für meine Beispiel von vorher
define tablet_ui HTTPSRV tablet/ ./tablet.www
Durch die Änderung wird bei der Suche nach passenden FWEXT Link Einträgen der Slash im URL mit in $link ($1 des regexp) abgelegt. Somit wird in FHEMWEB auch der richtige URL erzeugt und es ist keine Änderung in FHEMWEB erforderlich...
Wichtig ist, dass die HTTPSRV-Definition dann mit dem Slash am Ende erfolgen muss, dann funktioniert
der Aufruf über
http://fhem:8083/fhem/tablet/
und über
http://fhem:8083/fhem/tablet/index.html
Ausserdem geht dann auch der automatische Link aus FHEM heraus.
Gruss,
Johannes
Spricht etwas dagegen statt "tablet/" gleich einen URL zu dem es kein Verzeichnis gibt zu nehmen? Z.B. "ftui" wie in http://forum.fhem.de/index.php/topic,34233.msg294730/topicseen.html#msg294730 beschrieben. Dann stellt sich das Slash Problem erst gar nicht.
Ich brauche den Link in der fhem-Oberfläche links oben eigentlich nicht. Mir reicht es, das UI über die Adresszeile einzugeben. Der Aufruf http://<IP>:8083/fehm/tablet/home_eg.html hatte bis vorgestern immer funktioniert.
Ich verwende das Widget pagetab nur wegen des "sanften" Übergangs (vorher hatte ich das Button-Widget benutzt). Mein UI besteht aus einzelnen Seiten, die ich mit pagetab untereinander aufrufe. Also ohne template-Funktion. Also brauche ich den "Umweg" über index.html und menu.html wie update71 gepostet hat nicht!? Oder doch?
Wir sollten das auf jeden Fall mal klären und ausfürhlich im Wiki erklären! Ich helfe natürlich gerne mein dokumentieren!
Zitat von: viegener am 28 Mai 2015, 10:31:37
Das Problem liegt in HTTPSRV --> Hier ist eine minimale Änderung für HTTPSRV beschrieben, damit das Zusammenspiel richtig funktioniert:
Wichtig ist, dass die HTTPSRV-Definition dann mit dem Slash am Ende erfolgen muss, dann funktioniert
der Aufruf über
http://fhem:8083/fhem/tablet/
und über
http://fhem:8083/fhem/tablet/index.html
Ausserdem geht dann auch der automatische Link aus FHEM heraus.
Gruss,
Johannes
Hmm, und genau das geht bei mir eben nicht. Hatten wir ja schonmal und ich hate die Änderungen durchgeführt ... ohne Erfolg. Es bleibt dabei, weisse Seite wenn ich den Link oder http://fhem:8083/fhem/tablet/ benutze.
Hier nochmal mein define:
define tablet_ui HTTPSRV tablet/ ./www/tablet Tablet FrontendZitatSpricht etwas dagegen statt "tablet/" gleich einen URL zu dem es kein Verzeichnis gibt zu nehmen? Z.B. "ftui" wie in http://forum.fhem.de/index.php/topic,34233.msg294730/topicseen.html#msg294730 beschrieben. Dann stellt sich das Slash Problem erst gar nicht.
Ich hab davon zu wenig Ahnung hier eine Aussage zu treffen aber irgendwas muss ja die Ursache sein dass es bei dem Einen geht beim Anderen nicht. Wie schon beschrieben habe ich auch Probleme mit WVC ... und ich nehme an dies hängt damit vielleicht zusammen.
Gruß
Zitat von: nesges am 27 Mai 2015, 23:51:30
Die Änderung der .cell margin von 5px auf 10px (fhem-tablet-ui.css 76) wirft ziemlich viel durcheinander. Lokal bei mir werd ich's überschreiben.
Bei mir war durch die Änderung der .cell margin auf 10px auch einiges viel zu weit nach unten verschoben, der Tipp es lokal zu überschreiben, ist Gold wert. Ich habe eine neue ccs-Datei (mystyle.css) angelegt und in allen html-Seiten eingebunden. Die css-Datei wird direkt vor </head> in allen html-Datei inkludiert. Damit können Änderungen in Zukunft einfach überschrieben werden.
<link rel="stylesheet" href="/fhem/tablet/css/mystyle.css" /> In der Datei mystyle.css habe ich die .cell margin dann überschrieben.
.cell {
margin:5px 5px !important;
}
VG
Sven
Zitat von: setstate am 28 Mai 2015, 07:11:19
Die data-min und data-max Angaben bleiben in dezimal. Nur get und set werden in Hex RGB umgewandelt.
Hier ein Beispiel: http://forum.fhem.de/index.php/topic,34233.msg282365/topicseen.html#msg282365
Danke...werds heute abend mal testen.
Danke an euch, setstate und nesges, tolle prompte Hilfe. Die Erweiterungen an settimer und select haben die Bedienung meiner Wecker-Seite stark verbessert.
Hallo,
kann ich zwei FTUIs in einer Fhem Installation erstellen?
Zitat von: Phil__ am 28 Mai 2015, 13:02:32
kann ich zwei FTUIs in einer Fhem Installation erstellen?
Jain. Innerhalb FHEMs nicht, aber du kannst eine externe Installation auf Apache oder auch auch ganz ohne Webserver anlegen. Für Apache hab ich's hier mal aufgeschrieben: http://forum.fhem.de/index.php/topic,36063.msg289077.html#msg289077
Aaaber, ich hatte auch schon zwei HTTPSRV Instanzen definiert, aber mit anderem Namen und Pfad. Aber das sollte gehen. Ausprobieren!
Zitat von: CoolTux am 27 Mai 2015, 13:43:17
@setstate
Wäre es möglich das Homestatus Modul etwas auf zu bohren. Ich bräuchte noch ein gotosleep. Das ist ja im Moment von der Anzeige mit im Sleep drin. Ich bräuchte es als weitere Auswahl
Also ein GotoSleep Button wäre schon schön ;D
Ist machbar, die große Sektion ist ja noch teilbar. Evtl. mache ich das optional, weil ich das z.B. nicht unbedingt nutzen würde.
Stimmt, nur die Updates müsste man manuell machen; die funktionieren nur für die "Standardinstanz" in www/tablet.
Zitat von: nesges am 27 Mai 2015, 21:06:29
"bigger" ist mit einer Vergrößerung von 320% definiert - das wäre etwas übertrieben beim Timer ;) Aber "large" (150%) habe ich implementiert.
http://forum.fhem.de/index.php/topic,36122.msg298425.html#msg298425
Kann es sein, dass settimer mit der jüngsten Änderung in einigen Browsern Probleme hat? Im Chrome wird nur NaN für Stunde/Minute angezeigt (im Firefox funktioniert es).
Auf einem Orbsmart Soundpad 395 mit Android 4.1.1 dasselbe Verhalten im Standardbrowser und im Chrome (FF läuft auf dem Gerät nicht).
Zitat von: setstate am 28 Mai 2015, 13:37:31
Ist machbar, die große Sektion ist ja noch teilbar. Evtl. mache ich das optional, weil ich das z.B. nicht unbedingt nutzen würde.
Das wäre super. Würde ich mich total drüber freuen. Habe schon das Widget copiert und bewohnerstatus umbenannt. Leider kann ich den Koffer nicht ändern. Weiß nicht wo die Icons eingetragen sind
Zitat von: setstate am 28 Mai 2015, 13:29:07
Aaaber, ich hatte auch schon zwei HTTPSRV Instanzen definiert, aber mit anderem Namen und Pfad. Aber das sollte gehen. Ausprobieren!
Wie müsste eine solche Definition aussehen?
ich hab da noch ein kleines Problem
in http://forum.fhem.de/index.php/topic,34233.msg275587.html#msg275587
Zitat von nesges:
Zitat
Telefonnummern werden aktuell als Fliesskommazahlen interpretiert, daher wird die führende Null abgeschnitten und ein ".0" angehangen. Ich hab das Problem bei mir lokal gefixt, meine Lösung hat aber den Nachteil, dass der bisherige Default 1 für data-fix dadurch auf 0 geändert werden muss. Gibt bereits nen Pullrequest dazu, aber evtl. fällt setstate noch ne bessere Lösung ein. Dass die Nummern bei dir aktuell noch falsch angezeigt werden ist auf jeden Fall noch normal :-)
Frage: hat jemand eine Lösung wie bei der Anrufliste die Null vorne mit angezeigt wird.
Die liste habe ich wie folgt eingebaut:
<header>ANRUFE</header>
<table border="0px" width="100%">
<tr>
<td><div type="label" device="myTM" data-get="B0" style="font-size:x-small;"></div></td>
<td>
<div type="label" device="myTM" data-fix="0" data-get="D0" style="font-size:medium;color:#aa6900;"></div>
<div type="label" device="myTM" data-get="C0" style="font-size:x-small;"></div>
</td>
<td><div type="label" device="myTM" data-get="E0" style="font-size:x-small;"></div></td>
<td><div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-phone","fa-phone","fa-phone","fa-phone"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'></div>
</div> </td>
<td> <div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-left","fa-arrow-circle-right"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
class="inline">
</div>
</td>...... usw.
Gruß Rolf
Zitat von: Phil__ am 28 Mai 2015, 17:59:15
Wie müsste eine solche Definition aussehen?
define TABLETUI_DEV HTTPSRV ftui_dev ./www/tablet_dev Tablet-DEV
Zitat von: harry66 am 28 Mai 2015, 18:58:58
Frage: hat jemand eine Lösung wie bei der Anrufliste die Null vorne mit angezeigt wird.
Das ist eigentlich schon länger kein Thema mehr. Du musst data-fix nicht setzen. Siehe auch Demo: system-calls.php (http://fhem.nesg.es/demo/room/system-calls.php) bzw. system-calls.html (https://github.com/nesges/TabletUI-Demo-WOPR/blob/master/html/room/system-calls.html) ab Zeile 274.
Leider hat das mit der RGB Wert übergabe bei mir noch nicht geklappt.
Habs jetzt wie im Beispiel
<div data-type="volume" data-device="V8Tisch" data-min="0" data-max="360" data-tickstep="4" data-get="RGB" data-set="RGB" class="hue-tick small rgbs top-space left$ </div>
Das Problem ist, wenn ich jetzt am Farbrad drehe, kommt im FHEM an "Set RGB 324" an meinetwegen. Damit kann das Modul leider nix anfangen. Es braucht die Farbe in HEX Code. Direkte Hue Werte versteht es leider nicht. Gibts ne möglichkeit, dass man das in FHEM direkt umschreiben kann, damit er die Zahl umrechnet?
danke funktioniert, hatte ich wohl überlesen ;)
Ist schon eine Herausforderung hier alles mitzubekommen so schnell wie Ihr arbeitet.
Gruß Rolf
Zitat von: harry66 am 28 Mai 2015, 19:30:18
Ist schon eine Herausforderung hier alles mitzubekommen so schnell wie Ihr arbeitet.
sorry! ;)
Zitat von: Lling am 28 Mai 2015, 19:28:12
Das Problem ist, wenn ich jetzt am Farbrad drehe, kommt im FHEM an "Set RGB 324" an meinetwegen. Damit kann das Modul leider nix anfangen. Es braucht die Farbe in HEX Code. Direkte Hue Werte versteht es leider nicht. Gibts ne möglichkeit, dass man das in FHEM direkt umschreiben kann, damit er die Zahl umrechnet?
Was hat denn an:
Zitat von: nesges am 28 Mai 2015, 00:01:35
<div data-type="volume"
data-device="LIGHT"
class="hue-tick rgb"></div>
nicht gestimmt?
Ein "s" was noch hinter rgb stand. :-X ::) :o
Besten dank.
Zitat von: nesges am 28 Mai 2015, 19:33:12
sorry! ;)
Recht so! Ist echt eine Frechheit, wie schnell ihr arbeitet! ;-)
Zitat von: update71 am 28 Mai 2015, 10:56:45
Hmm, und genau das geht bei mir eben nicht. Hatten wir ja schonmal und ich hate die Änderungen durchgeführt ... ohne Erfolg. Es bleibt dabei, weisse Seite wenn ich den Link oder http://fhem:8083/fhem/tablet/ benutze.
Hier nochmal mein define:
define tablet_ui HTTPSRV tablet/ ./www/tablet Tablet Frontend
Hi Thomas,
dem würde ich gerne nochmals auf den Grund gehen und vielleicht bei mir nachstellen. Deine Definition sollte soweit passen.
Vielleicht bekommen wir das wirklich gelöst:
- Ich nehme an, dass Du die HTTPSRV-Änderungen bei Dir gemacht hast und auch entweder den reload oder einen restart durchgefürt?
- Was für eine Umgebung verwendest Du Server / Client / Browser ?
Vielleicht kannst Du mal probieren eine (gerne auch zusätzliche) HTTPSRV_Definition anzulegen, z.B.
define tablet_test HTTPSRV ftui/ ./www/tablet Tablet TESTUnd steuerst dann http://<dein server>:8083/fhem/ftui/ an?
Gruss,
Johannes
Nabend,
hab mal wie du beschrieben hast eine zusätzliche Definition erstellt:
gehe ich jetzt auf http://pi2:8083/fhem/ftui/ erhalte ich eine Seite ... aber nicht die index.html sondern die erste Seite die in der index.html durch das Menü geladen werden sollte: http://pi2:8083/fhem/ftui/#start.html ... is so ja auch nicht ganz richtig :)
Interessanterweise ist bei dem Test-PI (pi1) wo es nur eine index.html gibt (umbenannte index-example) das Verhalten wie erwartet. Dort gibts keine Pagetab. angezeigt wird in der Browserzeile aber auch nur: http://pi1:8083/fhem/ftui/
Meine Umgebung: Raspi (pi2) mit Fhem und Eigenbau CUL 433 ... HM-Gateway (LAN) und HUE Bridge (Lan)
Zum testen auch noch einen weiteren Raspi (pi1) beide per LAN im Netz.
Meine Rechner Macbook und iMAC, Safari und Firefox. (WLAN)
Trekstor Tablet mit WVC (WLAN)
Die Änderungen habe ich bei beiden Systemen durchgeführt und jeweils den FHEM durchgestartet.
Mein Netz: DNS auf 2 Synology NAS (NAS1 u. NAS2), DHCP auf Synology NAS (NAS2), Gateway ist ne Fritzbox, mehrere WLAN APs die das DHCP der NAS weitergeben, also nix geroutet oder so.
Bei meinem pi2 funktionieren die Unterseiten mit deiner Definition auch alle inklusive reaload ... angezeigt wird aber nie index.html ... immer nur ./ftui/#seite1 ./ftui/#seite2 etc.
Ich habe vor, die Tablet UI für ein altes Tablet zu nutzen und es irgendwo in der Küche fest zu installieren. Was ich mir bei den Widgets noch wünschen würde, wäre ein einfer 'Notizzettel'. Primär einfach erst einmal eine hübsche Anzeige, ähnlich den wohl bekannten 'Notes' in Windows. Füttern könte man ihn vorerst über fhem direkt, wobei eine komfortablere Variante (per Nachricht vom Handy?) durchaus wünschenswert wäre.
Ohne den gesamten Thread nun im Detail gelesen zu haben ;/ bisher ist mir etwas in der Art noch nicht begegnet. Vielleicht hat auch jemand noch eine andere/bessere Idee, wie sich der altbekannte Notizzettel an der Pinwand in der Tablet UI abbilden lässt. Den WAF würde das jedenfalls stark erhöhen :-)
Zitat von: update71 am 27 Mai 2015, 20:34:13
Ich hab es so:
index.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-HC #index</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="130"> <!-- 116 -->
<meta name="widget_base_height" content="140"> <!-- 131 -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<div data-type="clicksound"
data-sound='["ion-button-tiny","ion-button-click-on","ion-tap"]'
data-length='[200,300,400]'
data-bind-to='["+button","+knob","+slider"]'></div>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster ready">
<ul style="height: 775px; width: 1270px; position: relative;">
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu.html" class="gs-w">
</li>
</ul>
</div>
</body>
</html>
menu.html
<html>
<body>
<header>Räume</header>
<div class="cell">
<div data-type="pagetab" data-url="start.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="multimedia.html" data-icon="fa-sliders" class="cell"></div>
<div data-type="pagetab" data-url="wetter.html" data-icon="fa-cloud" class="cell"></div>
<div data-type="pagetab" data-url="heizung.html" data-icon="oa-sani_heating" class="cell"></div>
</div>
</body>
</html>
start.html (gekürzt)
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-HC</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="130"> <!-- 116 -->
<meta name="widget_base_height" content="140"> <!-- 131 -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345':'EG_Tab1'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<div data-type="clicksound"
data-sound='["ion-button-tiny","ion-button-click-on","ion-tap"]'
data-length='[200,300,400]'
data-bind-to='["+button","+knob","+slider"]'></div>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster ready">
<ul style="height: 775px; width: 1270px; position: relative;">
<!------------- Menü links --------------- 1. Reihe senkrecht Platz 1-5 -------------------->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu.html" class="gs-w">
</li>
<!------------- Ende linkes Menü --------------------------------------------->
...
...
...
</ul>
</div>
</body>
</html>
Oben stehendes Bsp habe ich getestet:
Meine Definition in Fhem:
define TABLETUI_DEV HTTPSRV ftui_dev/ ./www/tablet_dev Tablet-DEVden Code von oben und in der start.html, heizung.html ein paar widgets eingefügt.
Folgender Aufruf in Firefox/PC ergibt eine leer weisse Seite:
http://192.168.50.200:8086/fhem/ftui_dev/Folgender Aufruf in Firefox/PC ergibt eine korrekte Darstellung der start.html,
http://192.168.50.200:8086/fhem/ftui_dev/index.htmlalledings steht in der Browser url dann folgendes:
http://192.168.50.200:8086/fhem/ftui_dev/index.html#start.htmlNavigiere ich jetzt über das Pagetab menü nach heizung.html bekomme ich nur das Pagetab Menü angezeigt ohne die eingefügten Widgets in der heizung.html.
Browser url zeigt folgendes:
http://192.168.50.200:8086/fhem/ftui_dev/index.html#heizung.htmlwollte dies eigentlich nur Testweise ausprobieren nach den ganzen letzten Kommentaren hier... Aber nun...
Wo ist der Fehler??
Grüße
Hallo setstate,
Hallo nesges,
ich habe in meinen .htmls die Größe der Widgets folgendermaßen angepasst, damit ich auf mein Nexus 7; 5 Zeilen und 7 Spalten bekomme.
<meta name="widget_base_width" content="127">
<meta name="widget_base_height" content="108">
Seite dem Update von gestern, hatte 5 Tage keine Updates gemacht, hat sich die Höhe meiner Widgets verändert. Jetzt passen 5 Zeilen untereinander mit der obigen Definition nicht mehr auf mein Display.
Wurde da irgendetwas verändert?
Was mir auffält, die Zeilenabstände scheinen größer geworden zu sein.
zB. zwischen Text auf muell.html oder zwischen Symbol und text label????
Siehe Screenshots!
Ja, die Randabstände der CSS Klasse cell wurden geändert.SvenJust erklärt hier (http://forum.fhem.de/index.php/topic,34233.msg298568.html#msg298568) wie man's wieder auf den alten Stand bringt.
Die Class 'cell' definiert einen spürbaren Abstand nach oben und zur Seite, damit Widgets innerhalb eines Containers nicht zusammen kleben. Wenn du die Gridster Elemente so minimiert hast, dass die zusätzlichen Abstände zuviel werden, musst du 'cell' rausnehmen und stattdessen z.B. nur left-space nutzen. 'cell' habe ich im letzten Update symmetrisch definiert, also gleiche Abstände vertikal und horizontal.
Zitat von: nesges am 29 Mai 2015, 09:59:49
Ja, die Randabstände der CSS Klasse cell wurden geändert.SvenJust erklärt hier (http://forum.fhem.de/index.php/topic,34233.msg298568.html#msg298568) wie man's wieder auf den alten Stand bringt.
In den meisten Fällen hat der Hinweis von nesges Abhilfe geschaffen.
Aber in einzelfällen besteht immer noch ein Problem. (siehe Screenshots
Ist da setstates Vorschlag die Lösung des Problems?
Zitat von: meyerpr am 29 Mai 2015, 08:21:25
Was ich mir bei den Widgets noch wünschen würde, wäre ein einfer 'Notizzettel'. Primär einfach erst einmal eine hübsche Anzeige, ähnlich den wohl bekannten 'Notes' in Windows. Füttern könte man ihn vorerst über fhem direkt, wobei eine komfortablere Variante (per Nachricht vom Handy?) durchaus wünschenswert wäre.
Die reine Anzeige ist mit den Wigets label oder joinedlabel bereits möglich. Letzteres ist etwas flexibler, hier mal ein Beispiel:
<div data-type="joinedlabel"
data-device="NOTES"
data-get='["NOTES:line1","NOTES:line2","NOTES:line3"]'
data-mask="<div class='notes'>[<p>$1</p>][<p>$2</p>][<p>$3</p>]</div>"
data-substitution="s/-BR-/<br>/g"
></div>Vorausgesetzt wird ein Fhem-Device "NOTES", zB ein Dummy, mit den Readings line1, line2, etc. Wie du diese fütterst ist dir überlassen, Fhem bietet ja alle Möglichkeiten dazu. Per mask-Attribut werden die Zeilen jeweils in ein p-Element und gesamt in ein Container-Div mit der CSS Klasse "notes" gepackt. Dieser CSS-Klasse kannst du einen Rand mit Schattenwurf geben, sie gelb färben etc. Das substitution Attribut wird gebraucht, wenn die Readings Zeilenumbrüche enthalten sollen. Fhem entfernt diese leider, von daher müssen sie bereits beim einfügen durch einen Platzhalter, hier -BR-, ersetzt und durch substitution bei der Anzeige wieder zurück ersetzt werden.
Mir fehlt die Möglichkeit eines direkt editierbaren Notizzettels. Aber da warte ich ehrlich gesagt, dass Google ein Einsehen hat und Keep embedable macht ;)
Zitat von: nesges am 29 Mai 2015, 10:26:48
Die reine Anzeige ist mit den Wigets label oder joinedlabel bereits möglich. [...]
Mir fehlt die Möglichkeit eines direkt editierbaren Notizzettels. Aber da warte ich ehrlich gesagt, dass Google ein Einsehen hat und Keep embedable macht ;)
Das kommt dem Ganzen schon recht nahe, werde ich so mal umsetzen. Zum füttern könnte ich mir eine kleine Android App vorstellen, die einfach die entsprechenden 'SET' Befehle an den fhem schickt. Mehrzeilig und von verschiedenen Geräten wird das aber auch schon beliebig komplex, mal sehen...
Aber vielen Dank erst einmal!
Zitat von: update71 am 28 Mai 2015, 23:17:35
hab mal wie du beschrieben hast eine zusätzliche Definition erstellt:
gehe ich jetzt auf http://pi2:8083/fhem/ftui/ erhalte ich eine Seite ... aber nicht die index.html sondern die erste Seite die in der index.html durch das Menü geladen werden sollte: http://pi2:8083/fhem/ftui/#start.html ... is so ja auch nicht ganz richtig :)
Doch das ist ok so, da HTTPSRV so realisiert ist (wie auch viele andere Webserver) eine Default-Seite index.html zu lesen aber den URL im Browser unverändert zu lassen --> m.a.W. http://pi2:8083/fhem/ftui/ und http://pi2:8083/fhem/ftui/index.html liefern denselben Inhalt vom Server.
Das dann pagetab #start.html laedt ist auch so gewollt, denn wenn keine explizite Seite angegeben ist, wird der erste Pagetab geladen, da index.html selbst ja keine weiteren widgets ausser dem Menu enthält. Diese Seite wird dann hinter dem hash im URL angezeigt.
Eigentlich klingt das erstmal wie gewünscht (Also HTTPSRV liefert index.html auch wenns im URL nicht angezeigt ist und pagetab lädt den Content für den ersten pagetab). Ist Dein Problem nun, dass start.html falsch angezeigt wird also nicht im gridster oder doch noch eine weisse Seite?
Zitat von: update71 am 28 Mai 2015, 23:17:35
Interessanterweise ist bei dem Test-PI (pi1) wo es nur eine index.html gibt (umbenannte index-example) das Verhalten wie erwartet. Dort gibts keine Pagetab. angezeigt wird in der Browserzeile aber auch nur: http://pi1:8083/fhem/ftui/
Wie oben gesagt, das ist so korrekt und auch der Beleg dafür, dass der URL von HTTPSRV beident wird und nicht von FHEMWEB.
Hänge ien wenig am Circlemenu
in einem circle des Menüs möchte ich eine Zahl stehen haben anstatt einem icon.
Leider ist folgendes ohne Erfolg:
<header>Wetter</header>
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom">
<ul class="menu">
<li><div data-type="symbol" data-icon="fa-cloud" data-off-color="#aa6900" data-background-icon="fa-circle-thin"></div></li>
<li><div data-type="button" data-url="wetter.html" data-icon="fa-cloud"></div></li>
<li><div data-type="button" data-url="wetter10.html" data-icon="">10</div></li>
</ul>
</div>
jemand eine Idee?
Laut Bsp. im Git soll es so gehen...
Zitat von: Phil__ am 29 Mai 2015, 09:08:27
Oben stehendes Bsp habe ich getestet:
Soweit ich sehen kann gibt es gleich mehrere potentielle Probleme:
1) Dein index.html verweist auf Dateien ausserhalb des ftui_dev-Pfades. Also z.B.
/fhem/tablet/lib/jquery.gridster.min.css. Das kann nur funktionieren wenn es entweder ein Pfad ist, der von FHEMWEB geliefert wird, weil sie unter www/tablet/. auf dem Rechner liegen, oder es eine weitere HTTPSRV-Definition gibt, die diese liefert
2) Sowohl index.html also auch start.html enthalten die Definition der Java-Skripte und CSS-Files. Das sollte nicht notwendig sein, da wenn start.html eingeblendet wird, immer noch die Skripte/CSS von index.html gültig und geladen sind. m.a.W es wird von pagetab nur ein Teil von index.html innerhalb von Gridster ausgetauscht nicht die ganze Seite. --> Vielleicht kannst Du die start.html mal analog zur menu.html reduzieren? Das gilt prinzipiell dann auch für heinzung.html
Zitat von: Phil__ am 29 Mai 2015, 09:08:27
Folgender Aufruf in Firefox/PC ergibt eine leer weisse Seite:
http://192.168.50.200:8086/fhem/ftui_dev/
3) Dass lässt darauf schliessen, dass die Änderung von HTTPSRV, die in Antwort #1700 beschrieben ist nicht richtig bei Dir funktioniert. Kannst Du nochmal schauen, ob diese Änderung, so wie beschrieben, aktiv ist und einmal Browsercache leeren? Ich habe die Erfahrung gemacht, dass ich regelmässig in den Firefox-Einstellungen das Aching für http während der Entwicklung ausstellen muss, damit sich nicht alte gecachte Inhalte angezeigt werden, obwohl der Browser und fhem neu gestartet wurden :o
Gruss,
Johannes
Ich habe das Gefühl, dass die Probleme mit HTTPSRV nicht mit diesem Modul, sondern mit dem pagetab-Widget zu tun haben. Ich verwende dieses Widget aus einem einzigen Grund. Und zwar wegen des sanften Überblendeffekts. Ich wechsle meine Seiten damit, ohne data-template zu verwenden. Mit dem Button-Widget gibt es keine Probleme. Vielleicht liegt der Hund im pagetab-Widget begraben!?
Ich habe grade einen noch unfertigen(!) "Nebenarm" der Live-Demo hochgeladen: http://fhem.nesg.es/demo/small/
Dort verwende ich pagetab ohne Probleme - aber auch ohne HTTPSRV. Ich weiss nicht ob's daran liegt, aber vielleicht hilft's euch ja beim eingrenzen der Ursachen. Die Sourcen dazu gibt's im Repository https://github.com/nesges/TabletUI-Demo-WOPR/tree/master/html/small
Zitat von: Phil__ am 29 Mai 2015, 13:54:14
in einem circle des Menüs möchte ich eine Zahl stehen haben anstatt einem icon.
Zahlen, bzw. der Inhalt des Widget-Divs, werden auf unterster Ebene angezeigt. Vereinfacht sieht das Modell so aus:
- content
- background-icon
- icon
Das Button-Widget hat standardmässig fa-circle als background-icon. Das füllt den Kreis aus und überdeckt die unterste Ebene. Lösung: fa-circle durch fa-circle-thin ersetzen:
<li><div data-type="button" data-background-icon="fa-circle-thin" data-url="wetter10.html" data-icon="">10</div></li>
Zitat von: mw_fhem am 29 Mai 2015, 14:58:58
Ich habe das Gefühl, dass die Probleme mit HTTPSRV nicht mit diesem Modul, sondern mit dem pagetab-Widget zu tun haben. Ich verwende dieses Widget aus einem einzigen Grund. Und zwar wegen des sanften Überblendeffekts. Ich wechsle meine Seiten damit, ohne data-template zu verwenden. Mit dem Button-Widget gibt es keine Probleme. Vielleicht liegt der Hund im pagetab-Widget begraben!?
Hi,
ja das ist gut möglich, deshalb versuche ich die Ursache zu finden, warum bei mir sowohl HTTPSRV als auch pagetab mit verschiedenen Browsern und Plattformen und URLs laufen, aber nicht bei allen. Grundvermutung: Weisse Seite beim Aufruf hängt vermutlich an URLs/HTTPSRV, da sonst zumindest der Hintergrund geladen werden sollte. Andere Effekte eher an pagetab.
Bei der Button-Lösung die ganze Seite ausgetauscht wie bei einem normalen Link, dass sieht anders aus und lädt wieder eine komplett neue Seite.
Kannst Du beschreiben, ob und welches Problem mit (dem neuen) pagetab bei Dir auftritt, dann kann ich dem weiter auf den Grund gehen?
toll toll - echt gut - aber den Beispielen fehlen teilweise die Schriften und data-devices .. so macht das ausprobieren nicht so recht spass ..
es ist immer nur der html code dabei ...
trotzdem ein Lob .. :D
MFG Harway
Zitat von: harway2007 am 30 Mai 2015, 15:20:33
toll toll - echt gut - aber den Beispielen fehlen teilweise die Schriften und data-devices .. so macht das ausprobieren nicht so recht spass ..
es ist immer nur der html code dabei ...
trotzdem ein Lob .. :D
MFG Harway
Hallo harway2007,
danke dir fürs Lob und die Verbesserungsvorschläge.
Kannst du mir aber genauer erklären, was du mit "fehlen teilweise die Schriften und data-devices ..." meinst?
Evtl. an Hand eines Beispiels, wie für dich bessere Beispiele aussehen.
Zitat von: viegener am 29 Mai 2015, 18:55:49
Kannst Du beschreiben, ob und welches Problem mit (dem neuen) pagetab bei Dir auftritt, dann kann ich dem weiter auf den Grund gehen?
Also...
Meine cfg-Definition sieht so aus wie im wiki:
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet FrontendIch verwende das pagetab-Widget nur wegen den sanften Übergangs, also ohne template-Funktion. Ich rufe das UI auch nicht über die fhem-Seite auf, sondern über die URL im Browser. Da das ganze später mal auf einem Tablet dauerhaft laufen soll, ist das für mich kein Problem. Ich brauche also den Link nicht.
Meine "Startseite" heißt home_eg.html. Dort habe ich (über pagetab) Verlinkungen zu den anderen Seiten. Diese wiederum haben ein "Home-pagetab", das zu home_eg.html zurück führt.
Hier ein Ausschnitt aus home_eg.html:
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="57">
<meta name="widget_base_height" content="70">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,small -->
<!-- available data-type: contact,dimmer,homestatus,label,push,slider,switch,thermostat,volume -->
<div class="gridster">
<ul>
<!-- Kopfleiste -->
<!-- Uhr -->
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
<header></header>
<div class="cell bigger">
<div data-type="clock" data-format="H:i"></div>
<!-- <div data-type="clock" data-format="d.m.Y"></div> -->
</div>
</li>
<!-- Platzhalter -->
<li data-row="1" data-col="3" data-sizex="11" data-sizey="1"></li>
<!-- Status rechts oben -->
<li data-row="1" data-col="14" data-sizex="2" data-sizey="1">
<header></header>
<div class="cell bigger">EG</div>
</li>
<!-- Kopfleiste Ende -->
<!-- Räume-Button -->
<li data-row="2" data-col="1" data-sizex="2" data-sizey="2">
<header><font size="+1" color="747474">Räume</font></header>
<div class="cell big">
<div data-type="pagetab" data-url="raeume_eg.html" data-icon="fa-th-large"
data-off-color="#2a2a2a" data-background-icon="fa-circle"
data-off-background-color="#aa6900"></div>
</div>
</li>
<!-- Licht-Button -->
<li data-row="4" data-col="1" data-sizex="2" data-sizey="2">
<header><font size="+1" color="747474">Licht</font></header>
<div class="cell big">
<div data-type="pagetab" data-url="licht_eg.html" data-icon="fa-lightbulb-o"
data-off-color="#2a2a2a" data-background-icon="fa-circle"
data-off-background-color="#aa6900"></div>
</div>
</li>
.......
Im Browser gebe ich folgendes ein:
http://<IP>:8083/fhem/tablet/home_eg.html Für den Bruchteil einer Sekunde ist die Home-Seite zu sehen, um dann zu raume.html zu gehen (einer der Links). Im Adressfeld steht dann
http://<IP>:8083/fhem/tablet/home_eg.html#raeume_eg.htmlEs wird also zur Räume-Unterseite weitergeleitet. Auf dieser Unterseite, die wie alle anderen gleich aufgebaut ist, ist bisher nur das Home-pagetab (screenshot). Das lässt sich aber nun nicht mehr anklicken. Umgekehrt, wenn ich raume.html aufrufe, komme ich zu home_eg.html.
Wenn ich statt pagetab wieder button benutze, kalppt wieder alles.
Es steckt der Wurm drin :-\
Zitat von: mw_fhem am 31 Mai 2015, 10:32:47
Also...
Meine cfg-Definition sieht so aus wie im wiki:
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet Frontend
Das ist schon das erste Problem, denn in diesem Fall werden die URLs nicht über HTTPSRV abgerufen, denn
der tablet Teil von
http://<IP>:8083/fhem/tablet/home_eg.htmlwird zu
tablet/home_eg.htmlund das passt nicht zu Deiner HTTPSRV-Definition, bei der ja URLs mit
tablet/index.htmlbeginnen müssen.
Zur Erklärung in FHEMWEB wird auf den Beginn des übergebenen URLs (nach dem /fhem/) auf einen Match mit der HTTPSRV-Definition überprüft.
Was passiert also, wie bereits gesaagt, dieser URL wird über FHEMWEB und NICHT HTTPSRV behandelt.
Einfache Überprüfung, wie oben beschrieben: Weitere HTTPSRV-Definition anlegen, bei der das Verzeichnis ind er HTTPSRV Definition nicht dasselbe ist, wie im www-Verzeichnis. Also z.B.
define tablet_ui HTTPSRV tablettest/index.html ./www/tablet Tablet FrontendErgebnis es kommt nur eine FHEMWEB_Seite...
Danach ist mir nicht klar, ob Du gar keine index.html-Seite hast (sondern nur eine home_eg.html ?). Die index.html wird normalerweise benötigt, da bei Fehlen eines Dateinamens im URL diese Seite geladen wird.
Wenn Du home_eg.html angibst, so wird diese statt index.html geladen, das Verhalten danach ist aber so wie es gedacht ist. Also wird home_eg.html nur als Einstiegsseite verwendet und in der Einstiegsseite wird der erste pagetab geladen. Man könnte das noch konfigurierbar machen, aber das ist jetzt erstmal zweitrangig.
Ich glaube das zentrale Missverständnis ist immer noch die Rolle von index.html:
- index.html sollte als Einstiegsseite mit den CSS, JS und Gridster-Definitionen da sein
- index.html sollte auch die Pagetab definitionen beinhalten (die erste wird automatisch geladen)
- alle anderen pagetab-Seiten müssen keine JS/CSS-links mehr enthalten
Also mein Vorschlag:
- HTTPSRV patchen
- HTTPSRV-Definition in fhem.cfg anpassen
- index.html statt home_eg
- Inhalt von raeume_eg sollten der gridster und die pagetabs sein (am einfachsten als include über template) UND die für den raum anzuzeigenden widgets ebenfalls im gridster
Das jetzt nur mal ganz knapp, bei Bedarf gerne in mehr Detail, aber das ist schon wieder mehr Text als geplant.
Gruss,
Johannes
PS: Leider kann ich im wiki nichts änern, will das aber auch erst tun, wenn ich sicher bin, dass es auch bei (allen) anderen sauber funktioniert
Danke Johannes für die ausführliche Antwort. Ich werde versuchen deine Ausführungen zu verstehen und zu testen.
Aber wahrscheinlich ist es das einfachste, wenn ich von pagetab auf button zurückgehe, sieht zwar nicht so schön aus, funktioniert aber. Und ich muss nicht so viel umkrempeln. Und nochmal: Bis zu diesem Update vor ein paar Tagen hat alles korrekt funktioniert. Es muss also irgendetwas mit dem Widget passiert sein.
ich denke, wir müssen das pagetab nur etwas flexibler machen, auf die verschiedenen Möglichkeiten, die auftreten können. Nicht der User muss muss sich auf das widget einstellen ...
Ich denke an etwa so was:
var url = document.location.href;
// Remove fragment identifiers from the URL.
url = url.replace(/#.*$/, '');
// Remove an optional (redundant) filename from the URL.
url = url.replace(/index\.html$/, '');
...
Das könnte man sicher angehen, in dem man verschiedene Konfigurationsparameter hinzufügt und auch mehr Flexibilität einfügt.
Es sollte allerdings auch das Wiki und die Commandref korrigieren, da die jetzige (auch von mw_fhem) verwendete Definition so nicht wirklich funktioniert (eigentlich kann die sogar komplett entfallen, denn es geht auch ohne solange URL_Teil und Pfad identisch sind).
Ich kann auch anbieten einen Text dazuzuschreiben, wenn Ihn jemand in die Readme/ins Wiki hochlädt?
(Eigentlich habe ich die Texte ja sowieso schon hier imm Thread geschrieben :D)
@viegener: konntest du schon den Maintainer des HTTPSRV erreichen, bezüglich deines Patches?
Zitat von: setstate am 31 Mai 2015, 20:50:07
@viegener: konntest du schon den Maintainer des HTTPSRV erreichen, bezüglich deines Patches?
Leider noch nicht auf den Forumseintrag, ich habe ihm mal eine Email geschickt.
Gruss,
Johannes
Zitat von: setstate am 31 Mai 2015, 19:37:35
ich denke, wir müssen das pagetab nur etwas flexibler machen, auf die verschiedenen Möglichkeiten, die auftreten können. Nicht der User muss muss sich auf das widget einstellen ...
Je mehr Möglichkeiten eine Software/ein Software-Modul bietet, umso mehr Schwierigkeiten treten auf. Trotzdem bin ich immer wieder begeistert, wie die Fachleute hier Updates raushauen :D
Und ein Stück weit müssen sich auch die User an die Widgets anpassen - was nicht geht, geht eben nicht.
Hallo zusammen,
wollte mich nur mal für dieses wirklich gelungene Projekt bedanken. Ich komme demnächst bestimmt mit der einen oder anderen Frage um die Ecke.
Gruß und gute Nacht!
Oli
Zitat von: mw_fhem am 31 Mai 2015, 18:54:42
Danke Johannes für die ausführliche Antwort. Ich werde versuchen deine Ausführungen zu verstehen und zu testen.
Aber wahrscheinlich ist es das einfachste, wenn ich von pagetab auf button zurückgehe, sieht zwar nicht so schön aus, funktioniert aber. Und ich muss nicht so viel umkrempeln. Und nochmal: Bis zu diesem Update vor ein paar Tagen hat alles korrekt funktioniert. Es muss also irgendetwas mit dem Widget passiert sein.
Ich habe heute Abend mal verschiedene Szenarien durchgespielt und stelle fest und inzwischen kann ich die Probleme zum Teil nachstellen. Irgendwo läuft im Zusammenspiel von JS, Browser, Caches, HTML, Perl und meinem Kopf noch etwas schief.
Ich muss daran diese Woche noch weitermachen...
Sorry,
Johannes
Hallo,
Ich nutze das UI als Ersatz für eine App auf dem iPhone, da ich so einfach selbst bestimmen kann, wie es aussieht. :-)
Dabei ist mir aufgefallen, dass das Widget für den Home Status etwas schief aussieht. Soll das so sein? ;-)
Außerdem muss ich ganz oft die Seite mehrmals aktualisieren, damit sie vollständig angezeigt wird. Manchmal ist nur der Text sichtbar und der Hintergrund weiß, nach 2x neuladen funktioniert es dann.
LG Jo
Hallo,
Ich nutze das UI als Ersatz für eine App auf dem iPhone, da ich so einfach selbst bestimmen kann, wie es aussieht. :-)
Dabei ist mir aufgefallen, dass das Widget für den Home Status etwas schief aussieht. Soll das so sein? ;-)
Außerdem muss ich ganz oft die Seite mehrmals aktualisieren, damit sie vollständig angezeigt wird. Manchmal ist nur der Text sichtbar und der Hintergrund weiß, nach 2x neuladen funktioniert es dann.
LG Jo
Zitat von: johannes1984 am 01 Juni 2015, 12:16:36
Außerdem muss ich ganz oft die Seite mehrmals aktualisieren, damit sie vollständig angezeigt wird. Manchmal ist nur der Text sichtbar und der Hintergrund weiß, nach 2x neuladen funktioniert es dann.
Dieses Problem habe ich teilweise auch. Sieht fast so aus als würde die CSS Datei manchmal nicht gefunden werden.
Zitat von: DanHard am 01 Juni 2015, 16:48:17
Dieses Problem habe ich teilweise auch. Sieht fast so aus als würde die CSS Datei manchmal nicht gefunden werden.
Schließe mich an...gleiches Symptom auch bei mir! Ein paar mal Refresh drücken dann geht's wieder!
Zitat von: P.A.Trick am 01 Juni 2015, 20:38:13
Schließe mich an...gleiches Symptom auch bei mir! Ein paar mal Refresh drücken dann geht's wieder!
Ich hatte habe ein ähnliches Problem auf meinem Nexus 7 mit WVC. Allerdings habe ich den Aufruf von https auf http umgestellt und seit dem funktioniert fast immer alles ohne Probleme. Vllt hilft es euch...
Hat jemand eine Idee wie man eine Art Kindersicherung realisieren könnte?
Man ruft eine Seite auf, es erfolgt eine Pinabfrage, nach korrekter Eingabe wird man auf die entsprechende Seite weitergeleitet.
Grüsse
Zitat von: Phil__ am 01 Juni 2015, 21:12:10
Ich hatte habe ein ähnliches Problem auf meinem Nexus 7 mit WVC. Allerdings habe ich den Aufruf von https auf http umgestellt und seit dem funktioniert fast immer alles ohne Probleme. Vllt hilft es euch...
Danke für den Tipp, aber ich habe schon HTTP!
Bezueglich HTTPSRV nochmals ein Zwischenstand, ich habe unten mal eine neue HTTPSRV angehängt, die einen stabilen Zugriff auf das tablet UI ermöglichen sollte. Dies gilt insbesondere bei Verwendung von pagetabs, allerdings aus meinem Verständnis nicht nur dort.
Vielleicht hat jemand die Chance das mal zu testen?
Hinweis:
Die HTTPSRV-Definition sollte so etwas wie
define tablet_ui HTTPSRV ftui/ ./www/tablet Tablet Frontend
sein, wobei der angehängte Slash wichtig ist und der Namen (im Beispiel ftui) so gewählt sein sollte, dass das entsprechende Verzeichnis NICHT dem Verzeichnisnamen des tablet UIs entspricht also eben nicht "tablet".
Beim Aufruf des Tablet UIs (ohne eine bestimmte Seite anzusteuern) sollte dann auch der angehängte Slash verwendet werden soll also z.B.
http://<server>:8083/fhem/ftui/
oder auch
http://<server>:8083/fhem/ftui/index.html (wenn index.html das Grund-HTML enthält)
Interessant wäre ob damit vielleicht die verschiedenen weissen Seiten und vermischten FHEM / Tablet UI-Probleme gelöst sind.
Gruss,
Johannes
Hallo viegener,
ich bekomme mit deiner HTTPSRV version (und auch vorher schon)
http://<fhem>:8083/fhem/ftui
eine halb geladene FHEM Seite, nur der Save config button und diese JS Fehlermeldung: "ReferenceError: FW_widgets is not defined"
konfiguriert ist es bei mir so:
define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UI
nur mit http://<fhem>:8083/fhem/ftui/ klappt es, dann erscheint alles und die URL verändert sich so:
http://<fhem>:8083/fhem/ftui/#index_main.html
auch mit define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI ist es das gleiche
Hallo viegener,
leider kann ich keine Veränderung feststellen - gleicher Fehler wie vorher :-\
Zitat von: Phil__ am 01 Juni 2015, 21:16:06
Hat jemand eine Idee wie man eine Art Kindersicherung realisieren könnte?
Man ruft eine Seite auf, es erfolgt eine Pinabfrage, nach korrekter Eingabe wird man auf die entsprechende Seite weitergeleitet.
Grüsse
Ich habe mal ein wenig gebastelt, aber so richtig schön ist es nicht.
Konnte auch über den fhem HTTPSRV kein php aufrufen.
folgendes habe ich gemacht um eine Seite zu schützen.
pw.html: (zur Passwortabfrage)
<html>
<head>
<title>Login</title>
</head>
<body>
<form method="post" action="geheim.php">
Username: <input name="name" type="text"><br>
Kennwort: <input name="pass" type="password"><br>
<input type="submit" value="Login">
</form>
</body>
</html>geheim.php: (Das Skript zur Passwort überprüfung und weiterleitung auf die eigentliche Seite, ja gibt man die url direkt ein würde man auch ohne pw Abfrage auf die Seite kommen. und da ich auf dem fhem HTTPSRV kein php zum laufen bekommen habe, laufen die php Seiten über den apache)
<?php
include "#zugang.php" ;
$user = $_POST['name'];
$pass = $_POST['pass'];
if ($user == $okuser && $pass == $okpass) {
header("Location: http://192.168.50.200:8086/fhem/tablet/info.html");
exit;
} else {
?>
<html>
<head>
<title>Login</title>
</head>
<body>
Falsche Eingabe
</body>
</html>
<?php }
?>
#zugang.php: (Damit nutzer und pw nicht im Klartext in der geheim.php auftauchen)
<?php
$okuser = "xyz" ;
$okpass = "zyx" ;
?>Wie ihr seht ist das alles andere als schön.
Hat da jemand eine bessere und schönere Idee?
Sieh dir mal http://php.net/manual/de/features.http-auth.php an. Oder ganz ohne PHP: http://www.peej.co.uk/articles/http-auth-with-html-forms.html
So, nun bin ich endlich hinter die Mimik der Synchronisation unter SqueezePlayern gestiegen. Und daraus entsteht auch Mal wieder ein kleines Problem:
Szenario:
Beispielhafte 2 Squeezeplayer (WZ.Player, OG.Player). Dass man ja auch bei mehreren Playern jeden Player mit jedem syncen könnte, lass ich jetzt Mal weg, weil bei 5 Playern eine für den Durchschnittsuser schier unbewältigbare Logikmatrix entstünde... ;-)
Von daher habe ich mich entschieden einen Master zu haben, auf den dann alle Player syncen.
Um Zweiteren (Slave) mit dem Ersten (Master) zu syncen muss folgender Befehl abgesetzt werden:
set WZ.Player sync OG.Player
Soweit, so gut. Das lässt sich innerhalb des UI ziemlich simpel umsetzen. Wenn ich nun aber das Slave-Device wieder unsyncen will, dann kommt die Krux. Das wird nämlich mit:
set OG.Player unsync WZ.Player
also "andersrumer" Logik erreicht. Hat da jemand eine Idee zur Lösung für ein set-array für ein Switch/Multistate/[hier beliebigen Widgetnamen einsetzen]-Widget ohne eine Vielzahl entsprechender dummies einrichten zu müssen?
Zitat von: Phil__ am 01 Juni 2015, 21:16:06
Hat jemand eine Idee wie man eine Art Kindersicherung realisieren könnte?
Man ruft eine Seite auf, es erfolgt eine Pinabfrage, nach korrekter Eingabe wird man auf die entsprechende Seite weitergeleitet.
Ich hatte mir mal überlegt einen Configbereich im UI anzulegen und diesen über einen Login zu schützen.
Da ich mit AngularJS rumspiele habe ich diese Seite gefunden: http://jasonwatmore.com/post/2015/03/10/AngularJS-User-Registration-and-Login-Example.aspx (http://jasonwatmore.com/post/2015/03/10/AngularJS-User-Registration-and-Login-Example.aspx)
Aber selber noch keine Zeit dafür gehabt. Hab den neuen Raspberry2 bekommen. Jetzt wird erst mal neu aufgebaut ;-)
Zitat von: setstate am 02 Juni 2015, 07:02:31
ich bekomme mit deiner HTTPSRV version (und auch vorher schon)
http://<fhem>:8083/fhem/ftui
eine halb geladene FHEM Seite, nur der Save config button und diese JS Fehlermeldung: "ReferenceError: FW_widgets is not defined"
konfiguriert ist es bei mir so:
define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UI
Ja, das ist ohne eine Änderung an FHEMWEB auch nicht zu lösen, da dann intern URLs entstehen, die von FHEMWEB mit leeren Seiten beantwortet werden (speziell für CSS und JS requests) aber auch die eigentlich Seite dann plötzlich folgendermassen heisst:
http://<fhem>:8083/fhem/ftui#index_main.htmlDurch den fehlenden nach ftui gerät dann einiges durcheinander.
Also wenn ich das richtig verstehe ist bei Dir mit einer HTTPSRV-Definition
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI soweit alles in Ordnung.
Ich könnte mich also erstmal daran arbeiten, wie verhindert werden könnte, dass das Menu zweimal geladen (und angezeigt) wird.
Zitat von: mw_fhem am 02 Juni 2015, 09:26:57
leider kann ich keine Veränderung feststellen - gleicher Fehler wie vorher :-\
Hallo mw_fhem,
da ich jetzt nicht weiss, ob Du die vorher vorgeschlagenen Änderungen bei Dir vorgenommen hast, kann ich das jetzt nicht einschätzen.
Vorschlag: schicke mir ein Zip mit Deinen HTMLs und ich mache die Umstellung für DIch und schicke Dir auch die Infos, welche HTTPSRV-Definition benötigt wird, ok?
Johannes
Nein, define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
geht auch nicht.
Zitat von: setstate am 02 Juni 2015, 12:45:13
Nein, define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
geht auch nicht.
Sorry was geht dann nicht, was wird angezeigt (oder nicht)?
Hallo,
ich würde gern das Bild der Mondphase (http://forum.fhem.de/index.php/topic,37467.0.html (http://forum.fhem.de/index.php/topic,37467.0.html)) mit einbinden.
Im Device gibt es einen Wert ("moonphase") der 1-100 annehmen kann und für den Namen der entsprechenden Bilddatei (z.B. 3.png) steht.
Ein <img src="http://192.168.13.80:8083/fhem/images/phasenbilder/3.png" width="80"> zeigt mir das Bild statisch an, natürlich möchte ich dass, was aus "moonphase" kommt.
Wenn mich mal jemand schubsen könnte, Danke.
Gruß Andreas
Hallo Atze,
mit dem Image widget würde es sofort klappen, wenn das Reading die volle URL bereitstellen würde. Zusammenbauen wird noch nicht unterstützt. Baue ich heute Abend noch ein, zum Beispiel data-prefix
@tomster: dein unpair Command könntest du doch so 1:1 mit einem Button-Widget absetzen, per data-fhem-cmd!!?
Button-Widget findest du im nesges Repo
@setstate
kein stress... junge was ein Tempo hier .. bedankt
Zitat von: setstate am 02 Juni 2015, 15:45:42
@tomster: dein unpair Command könntest du doch so 1:1 mit einem Button-Widget absetzen, per data-fhem-cmd!!?
Button-Widget findest du im nesges Repo
Klar, EINEN der Befehle kann man immer setzen. Geht auch mit einem simplen data-set="sync OG.Player" im Switch-Widget, wenn eben data-device="WZ.Player" gesetzt ist. Da die Logik beim unsync allerdings die Reihenfolge des angesprochenen Devices umdreht (set OG.Player unsync WZ.Player), haut das mit einem Widget als quasi statusabhängigem toggle, nicht hin...
Zitat von: tomster am 02 Juni 2015, 17:42:15
Klar, EINEN der Befehle kann man immer setzen. Geht auch mit einem simplen data-set="sync OG.Player" im Switch-Widget, wenn eben data-device="WZ.Player" gesetzt ist. Da die Logik beim unsync allerdings die Reihenfolge des angesprochenen Devices umdreht (set OG.Player unsync WZ.Player), haut das mit einem Widget als quasi statusabhängigem toggle, nicht hin...
Ich dachte auch an zwei Buttons, einen für sync einen für unsync. Der Status wird dann per Label angezeigt.
Du willst einen Toogle-Button, für beides? Wo würde bei dir die Update Info herkommen, welcher Status gerade vorherrscht? Für den Neustart wäre das wichtig.
Das update kann man mit data-get='' abschalten.
Zitat von: viegener am 02 Juni 2015, 01:07:10
Bezueglich HTTPSRV nochmals ein Zwischenstand, ich habe unten mal eine neue HTTPSRV angehängt, die einen stabilen Zugriff auf das tablet UI ermöglichen sollte. Dies gilt insbesondere bei Verwendung von pagetabs, allerdings aus meinem Verständnis nicht nur dort.
Vielleicht hat jemand die Chance das mal zu testen?
Hinweis:
Die HTTPSRV-Definition sollte so etwas wie
define tablet_ui HTTPSRV ftui/ ./www/tablet Tablet Frontend
sein, wobei der angehängte Slash wichtig ist und der Namen (im Beispiel ftui) so gewählt sein sollte, dass das entsprechende Verzeichnis NICHT dem Verzeichnisnamen des tablet UIs entspricht also eben nicht "tablet".
Beim Aufruf des Tablet UIs (ohne eine bestimmte Seite anzusteuern) sollte dann auch der angehängte Slash verwendet werden soll also z.B.
http://<server>:8083/fhem/ftui/
oder auch
http://<server>:8083/fhem/ftui/index.html (wenn index.html das Grund-HTML enthält)
Interessant wäre ob damit vielleicht die verschiedenen weissen Seiten und vermischten FHEM / Tablet UI-Probleme gelöst sind.
Gruss,
Johannes
Also bei mir klappt diese Version auf den ersten Blick sehr viel besser als die Originale. Ich lasse die Datei mal drin und teste weiter!
Zitat von: setstate am 02 Juni 2015, 18:35:03
Wo würde bei dir die Update Info herkommen, welcher Status gerade vorherrscht? Für den Neustart wäre das wichtig.
Der Status kommt aus den Readings, genauer gesagt dem Reading "synced", der Player. Dort stehen die entsprechend gesyncten Player.
Beispiel: "Wohnzimmer,Kueche" oder eben "none", wenn nichts gesynct ist.
Der Einfachheit halber hab ich den Küchen-Player als Standard-Master festgelegt. Die anderen Player werden dann diesem hinzugesynct.
Mein Ansatz war dieser:
<div data-type="multistatebutton"
data-device="WZ.PLAYER"
data-get="synced"
data-get-on='["(.*?Wohnzimmer.*?)","none"]'
data-icons='["fa-link","fa-unlink"]'
data-set='["unsync Kueche",";set Kueche.PLAYER sync Wohnzimmer"]'
data-background-icon="-"
data-on-colors='["#aa6900","#505050"]'
class="cell small narrow"></div>
<div data-type="label" >Wohnen</div>Das Problem ist nur, wie gesagt, die "Logikumkehr" beim (in meinem Beispiel) sync. Der Vorschlag mit dem ";" vorm sync-Befehl kommt von nesges. Hat aber leider auch nicht den gewünschten Erfolg gehabt...
---edit---
Die Semikolon-Lösung funktioniert doch! Ich hatte bei meinem Testplayer Wohnzimmer einen Config-Fehler. Alles anderen Player (PiCorePlayer) funktionieren out-of-the-box.
Zitat von: CoolTux am 27 Mai 2015, 13:43:17
@setstate
Wäre es möglich das Homestatus Modul etwas auf zu bohren. Ich bräuchte noch ein gotosleep. Das ist ja im Moment von der Anzeige mit im Sleep drin. Ich bräuchte es als weitere Auswahl.
Update: Homestatus kann optional jetzt auch 5 Zustände abbilden und ist viel flexibler bei der Text, Icon und Status Definition.
Minimal Definition (rechtes Bild):
<div data-type="homestatus" data-device='dummy1'></div>
Volle Definition (rechtes Bild):
<div data-type="homestatus" data-device='dummy1'
data-get-on='["1","2","3","4"]'
data-alias='["Home","Night","Away","Holiday"]'
data-icons='["fa-home","fa-bed","fa-car","fa-suitcase"]'>
</div>
Minimale Definition (ähnlich linkem Bild)
<div data-type="homestatus" data-device='dummy1'
data-version='residents'>
</div>
Volle Definition (linkes Bild)
<div data-type="homestatus" data-device='dummy1'
data-get-on='["home","asleep","absent","gone","gotosleep"]'
data-alias='["Home","Night","Away","Holiday","Retire"]'
data-icons='["fa-fire","fa-film","fa-plus","fa-car","fa-tint"]'
data-version='residents'>
</div>
Zitat von: Atze am 02 Juni 2015, 14:28:52
Hallo,
ich würde gern das Bild der Mondphase (http://forum.fhem.de/index.php/topic,37467.0.html (http://forum.fhem.de/index.php/topic,37467.0.html)) mit einbinden.
Im Device gibt es einen Wert ("moonphase") der 1-100 annehmen kann und für den Namen der entsprechenden Bilddatei (z.B. 3.png) steht.
Ein <img src="http://192.168.13.80:8083/fhem/images/phasenbilder/3.png" width="80"> zeigt mir das Bild statisch an, natürlich möchte ich dass, was aus "moonphase" kommt.
nach
Update ist das beim
Image Widget jetzt realisierbar:
<div data-type="image" data-device='dummy1'
data-path="/fhem/images/phasenbilder/"
data-get="moonphase"
data-suffix=".png">
</div>
@setstate
Danke Danke Danke. Werde ich heute Abend gleich mal testen.
LG
Zitat von: viegener am 02 Juni 2015, 13:43:05
Sorry was geht dann nicht, was wird angezeigt (oder nicht)?
Egal ob ich
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UIoder so definiere,
define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UIes kommt immer eine leere Seite beim Aufruf mit dieser URL
http://networkspace2:8083/fhem/ftui
Man muss den letzten Slash immer selber setzen:
http://networkspace2:8083/fhem/ftui/
Zitat von: CoolTux am 03 Juni 2015, 07:20:01
@setstate
Danke Danke Danke. Werde ich heute Abend gleich mal testen.
LG
Ok ok, konnte es doch nicht abwarten. Dasist soooo klasse gemacht. Noch mal dicken fetten Dank. Genau so habe ich es mir vorgestellt.
Grüße
@CoolTux, kannst Du deinen Code und die dazugehörige FHEM Konfiguration zur Verfügung stellen? Vielen Dank.
Kann ich gerne machen. Musst nur schauen ob es so reicht oder Du noch mehr brauchst.
ROOMATE definition in FHEM
define rr_Marko ROOMMATE AnniKraussStr
attr rr_Marko alias Marko
attr rr_Marko devStateIcon .*home:user_available:absent .*absent:user_away:home .*gone:user_ext_away:home .*gotosleep:scene_toilet:asleep .*asleep:scene_sleeping:awoken .*awoken:scene_sleeping_alternat:home .*:user_unknown
attr rr_Marko group Marko
attr rr_Marko icon people_sensor
attr rr_Marko room AnniKraussStr
attr rr_Marko rr_locationHome home
attr rr_Marko rr_locations work
attr rr_Marko rr_passPresenceTo rr_Steven rg_Anna
attr rr_Marko rr_states home,gotosleep,asleep,awoken,absent,gone
attr rr_Marko rr_wakeupDevice rr_Marko_wakeuptimer1
attr rr_Marko sortby 0
attr rr_Marko webCmd state:mood
Und hier dann die html für tabletui
<li data-row="2" data-col="2" data-sizex="2" data-sizey="2">
<header>Marko</header>
<div data-type="homestatus" data-device='rr_Marko'
data-version='roommate'
data-get-on='["home","asleep","absent","gone","gotosleep"]'
data-alias='["Home","Nacht","Abwesend","Urlaub","Bett fein"]'
data-icons='["fa-home","fa-bed","fa-car","fa-suitcase","fa-tint"]'
class="" >
</div>
</li>
Wenn Fragen dann einfach Fragen :D
Ich stehe gerade auf dem Schlauch... Ich wollte meine StatusLEDs darstellen und irgendwie ist mein rotes LED orange statt rot. Hier der entsprechende Code:
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer" data-get-on='["green","orange","red"]' data-colors='["#6699FF","#aa6900","#bb6242"]' data-icons='["fa-bell","fa-bell","fa-bell"]'></div>
hängt das irgendwie mit regexen zusammen? ;)
Deine Definition in Deutsch:
Zeig mir ein symbol-Widget. Wenn das Device og.sz.led.eg.fl.tuer den Wert "green" hat, dann benutze das Icon fa-bell in der Farbe #6666FF (http://www.colorhexa.com/6666ff). Wenn es den Wert "orange" hat, dann benutze das Icon fa-bell in der Farbe #aa6900 (http://www.colorhexa.com/aa6900) und wenn es den Wert "red" dann benutze das Icon fa-bell in der Farbe #bb6242 (http://www.colorhexa.com/bb6242)
Alles klar? ;)
Ok, das wäre ja genau das was ich will.
Ich habe jetzt noch ein zweites mit der selben definition (nur anderes Device) hinzugefügt. Das eine hat den Status red, das andere green und beide sind orange.
Was mich etwas wundert, meine Fenster und Türsensoren sind auch alle orange:
<div data-type="symbol" data-device="eg.az.fenster" data-icons='["oa-fts_window_2w","oa-fts_window_2w_open"]' data-get-on='["closed","open"]' class="narrow"/>
orange, bzw. #aa6900, ist die Standardfarbe für ein symbol im on-Zustand. Und da du "closed" und "opened" als on-Zustände definiert und keine andere Farbe angegeben hast, ist klar, dass es immer orange angezeigt wird. Die fehlt das data-colors Array. zB:
<div data-type="symbol" data-device="eg.az.fenster" data-icons='["oa-fts_window_2w","oa-fts_window_2w_open"]' data-get-on='["closed","open"]' data-colors='["#505050", "#aa6900"]' class="narrow"/>
Bei deinem anderen sind die Farbdefinitionen seltsam (#6666ff ist weit entfernt von rot), aber wenn du das haben willst, ist's ok. Wenn "red" und "green" dabei gleich dargestellt werden, prüfe erstmal ob die Werte tatsächlich stimmen. Auch im Eventmonitor. Siehe auch http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an
Pardon, ich war nur zu doof.
Der Parameter heißt data-on-colors, nicht data-colors. Hatte blöderweise ein label widged kopiert gehabt und daher das data-colors übernommen.
Jetzt passt es ;). Danke für die Hilfe ;)
oh, das hab ich selbst übersehen.
Ich war jetzt eigentlich nur drauf gekommen, weil du geschrieben hattest, dass dieses orange die Standardfarbe für "on" ist und deswegen die Fenster orange sind ;)... da hat sich mein Hinterkopf gemeldet und meinte, das es da doch ein data-on-colors gab :-)
Ist schon verwirrend ...
Ich denke mittlerweile, es wäre sauberer, wenn man die Namenskonvention etwas überarbeiteten würde:
data-on-color und data-off-color nur als skalarer Wert.
und data-colors für die Arrays. Weil es ja gar kein data-off-color als Array geben kann, rein logisch.
Man könnte auch darüber nachdenken, data-on-color und data-off-color garnicht mehr zu unterstützen und immer mit Arrays zu arbeiten, für jegliche Zustände. Also "on" und "off" aus dem Namen raus und in Plural setzten.
Zitat von: setstate am 03 Juni 2015, 07:43:49
Egal ob ich
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
oder so definiere,
define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UI
es kommt immer eine leere Seite beim Aufruf mit dieser URL
http://networkspace2:8083/fhem/ftui
Man muss den letzten Slash immer selber setzen:
http://networkspace2:8083/fhem/ftui/
Hallo setstate,
ganz einfach wird sich das nicht ändern lassen.
Hier ist der vereinfachte Hintergrund --> Wenn eine Seite mit /fhem/ftui aufgerufen wird, so ist das aktuelle Verzeichnis /fhem und relative URLs starten von da. Also
- Zugriffe auf "#some_detail.html" enden bei /fhem/ftui#some_detail.html was in FHEMWEB leider nicht weitergereicht wird ....
- Zugriffe auf manche js und css-Dateien bleiben auch in FHEMWEB hängen und werden deshalb nie aus dem tablet/... Verzeichnis gelesen.
Mit dem neuen HTTPSRV wird aber erreicht, dass, wenn die Definition den Slash enthält der richtige URL definiert und aufgerufen wird.
Für Dein Problem könnte aber ein einfaches Java script in index.html sorgen, etwas wie:
<script language="javascript">
if ( document.location.pathname == "/fhem/ftui" ) {
var href = document.location.protocol + "//" + document.location.host + document.location.pathname + "/" + document.location.hash ;
document.location.replace( href );
}
</script>
Disclaimer: Das habe ich jetzt nur mal so runtergeschrieben, ich habe es nicht bei mir ausprobiert...
Hallo, danke für das Modul, echt klasse.
Ich habe ein paar probleme mit dem layout:
Ich habe in einem Raum alle Geräte drin, nur die Anordung gefällt mir nicht, bzw. es ist ein Zeilenumbruch drin, welchen ich nicht wegbekomme!
Könnt ihr mir helfen?
Anbei Bild (Rot Markierte Stelle) und code
<li data-row="2" data-col="4" data-sizex="5" data-sizey="4">
<header>WOHNZIMMER</header>
<div class="container">
<div class="left">
<div data-type="thermostat" data-device="Wohnzimmer" data-valve="valveposition" data-get="desiredTemperature" data-set="desiredTemperature auto" data-temp="temperature" class="big">
</div>
<div class="right">
<div data-type="switch" data-device="FensterLicht" class="cell"></div>
<div data-type="label" class="cell">Fensterlicht</div>
<div data-type="switch" data-device="Aquariumlicht" class="cell"></div>
<div data-type="label" class="cell">Aquariumlicht</div>
<div data-type="switch" data-device="Wandlampe" class="cell"></div>
<div data-type="label" class="cell">Wandlampe</div>
</div>
<div class="left">
<div data-type="symbol" data-device="WZ_Terasse1" data-icon="ftui-door" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terassentür</div>
<div data-type="symbol" data-device="WZ_Shutter1" data-icon="ftui-window" class="narrow"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
</div>
</div>
<div class="cell left">
<div class="cell">
<header>STEHLAMPE</header>
<div data-type="switch" data-device="Stehlampe" data-get-on="!off" data-get-off="off" data-set-on="hsv 0,0,10" class="cell" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,100%)"></div>
<div data-type="label" class="cell">Stehlampe Weiss</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick top-space-1x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="100" data-get="brightness" data-set="dim" class="bigger" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
</div>
<header>TVLICHT</header>
<div data-type="switch" data-device="TVLicht" data-get-on="!off" data-get-off="off" data-set-on="hsv 0,0,10" class="cell" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,100%)"></div>
<div data-type="label" class="cell">TVLicht Weiss</div>
<div data-type="volume" data-device="TVLicht" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick top-space-1x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="volume" data-device="TVLicht" data-min="0" data-max="100" data-get="brightness" data-set="dim" class="bigger" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
</li>
hyper, versuch mal so:
<li data-row="2" data-col="4" data-sizex="5" data-sizey="4">
<header>WOHNZIMMER</header>
<div class="container">
<div class="left">
<div data-type="thermostat" data-device="Wohnzimmer" data-valve="valveposition" data-get="desiredTemperature" data-set="desiredTemperature auto" data-temp="temperature" class="big">
</div>
<div class="right">
<div data-type="switch" data-device="FensterLicht" class="cell"></div>
<div data-type="label" class="cell">Fensterlicht</div>
<div data-type="switch" data-device="Aquariumlicht" class="cell"></div>
<div data-type="label" class="cell">Aquariumlicht</div>
<div data-type="switch" data-device="Wandlampe" class="cell"></div>
<div data-type="label" class="cell">Wandlampe</div>
</div>
<div class="left">
<div data-type="symbol" data-device="WZ_Terasse1" data-icon="ftui-door" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terassentür</div>
<div data-type="symbol" data-device="WZ_Shutter1" data-icon="ftui-window" class="narrow"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
</div>
</div>
<div class="left">
<div class="">
<header>STEHLAMPE</header>
<div data-type="switch" data-device="Stehlampe" data-get-on="!off" data-get-off="off" data-set-on="hsv 0,0,10" class="cell" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,100%)"></div>
<div data-type="label" class="cell">Stehlampe Weiss</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick top-space-1x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="100" data-get="brightness" data-set="dim" class="bigger" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
</div>
<header>TVLICHT</header>
<div data-type="switch" data-device="TVLicht" data-get-on="!off" data-get-off="off" data-set-on="hsv 0,0,10" class="cell" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,100%)"></div>
<div data-type="label" class="cell">TVLicht Weiss</div>
<div data-type="volume" data-device="TVLicht" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick top-space-1x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="volume" data-device="TVLicht" data-min="0" data-max="100" data-get="brightness" data-set="dim" class="bigger" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
</li>
Im Anhang noch die Änderung
Hallo hyper2910,
leider weiß ich nicht, was du genau erreichen willst. Vielleicht erklärst du es noch etwas, oder du schiebst in einem Malprogramm die Objekte des Screenshots so zusammen, wie es aussehen soll und postest das hier nochmal.
Ich habe einfach ein bisschen in deinem Code rum geändert. Ist auch nicht besser, aber vllt. eine neue Position für den Weg zum Ziel:
<li data-row="2" data-col="4" data-sizex="5" data-sizey="4">
<header>WOHNZIMMER</header>
<div class="container">
<div class="inline">
<div class="inline">
<div data-type="thermostat" data-device="Wohnzimmer" data-valve="valveposition" data-get="desiredTemperature" data-set="desiredTemperature auto" data-temp="temperature" class="big"></div>
<div data-type="switch" data-device="FensterLicht" class="cell"></div>
<div data-type="label" class="cell">Fensterlicht</div>
<div data-type="switch" data-device="Aquariumlicht" class="cell"></div>
<div data-type="label" class="cell">Aquariumlicht</div>
<div data-type="switch" data-device="Wandlampe" class="cell"></div>
<div data-type="label" class="cell">Wandlampe</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="WZ_Terasse1" data-icon="ftui-door" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terassentür</div>
<div data-type="symbol" data-device="WZ_Shutter1" data-icon="ftui-window" class="narrow"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
</div>
</div>
<div class="inline">
<header>STEHLAMPE</header>
<div data-type="switch" data-device="Stehlampe" data-get-on="!off" data-get-off="off" data-set-on="hsv 0,0,10" class="cell" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,100%)"></div>
<div data-type="label" class="cell">Stehlampe Weiss</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick top-space-1x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="volume" data-device="Stehlampe" data-min="0" data-max="100" data-get="brightness" data-set="dim" class="bigger" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
<div class="inline">
<header>TVLICHT</header>
<div data-type="switch" data-device="TVLicht" data-get-on="!off" data-get-off="off" data-set-on="hsv 0,0,10" class="cell" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,100%)"></div>
<div data-type="label" class="cell">TVLicht Weiss</div>
<div data-type="volume" data-device="TVLicht" data-min="0" data-max="360" data-get="hue" data-set="hue" class="hue-tick top-space-1x" ></div>
<div data-type="label" class="cell">Color</div>
<div data-type="volume" data-device="TVLicht" data-min="0" data-max="100" data-get="brightness" data-set="dim" class="bigger" ></div>
<div data-type="label" class="cell">Hell</div>
</div>
</div>
</li>
Ich bräuchte auch mal wieder Hilfe :D
ich bekomm das circlemenu nicht größer, dann verhauts immer alles. Hier mal ein Device was ich gern etwas größer hätte da es aucf dem Tablet arg lütt ist ...
<div>
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half">
<ul class="menu">
<li>
<div data-type="symbol" data-device="HUEDevice1"
data-get-on='["off","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%","on"]'
data-on-colors='["#505050","#ffffff","#ffffff","#ffffff","#ffffff"]'
data-background-icon="fa-circle-thin"
data-on-background-colors='["#505050","#aa6900","#aa6900","#aa6900","#aa6900"]'
data-icons='["oa-light_light_dim_00","oa-light_light_dim_20","oa-light_light_dim_50","oa-light_light_dim_80","oa-light_light_dim_100"]' >
</div>
</li>
<li><div data-type="push" data-device="HUEDevice1"
data-set="off"
data-icon="oa-light_light_dim_00"></div></li>
<li><div data-type="push" data-device="HUEDevice1"
data-set="pct 20"
data-icon="oa-light_light_dim_20"></div></li>
<li><div data-type="push" data-device="HUEDevice1"
data-set="pct 50"
data-icon="oa-light_light_dim_50"></div></li>
<li><div data-type="push" data-device="HUEDevice1"
data-set="pct 80"
data-icon="oa-light_light_dim_80"></div></li>
<li><div data-type="push" data-device="HUEDevice1"
data-set="pct 100"
data-icon="oa-light_light_dim_100"></div></li>
</ul>
</div>
<div data-type="label" >Rechts</div>
</div>
Danke für Hinweise und auch mal wieder ein DANKE an die Coder und Supporter :)
Updates
- Neu: Progress Widget zur Anzeige von Prozentwerten im runden Stil
<div data-type="progress" data-device="dummy1" data-get='pct'></div>
Mit 'data-max' kann man den maximalen Wert direkt als Zahl angeben, oder ein Reading angeben, was den max. Value beinhaltet.
Es gibt die Class 'novalue', um die Anzeige der Wertes als Zahl auszuschalten.
Mit der Class 'percent' wird die angezeigte Zahl in % umgerechnet.
- Zusatz: beim Push Widget kann man jetzt mehrere data-set-on Werte als Array angeben. Das ermöglicht zum Beispiel ein Toggeln zwischen zwei Werten.
<div data-type="push" data-device="EZ_Heizung_Clima"
data-icon="fa-hand-o-right"
data-set="controlMode"
data-set-on='["auto","manual"]'>
</div>
- Zusatz Class beim Label Widget (Dank an viegener)
mit der Class 'fixedlabel' kann man Label einbauen, die einen festen Text (direkt im HTML) haben, aber trotzdem die Farbe per Reading Value beeinflusst werden könnte.
@update71.
Du bekommst den Kreis der Sub Buttons größer mit:
data-circle-radius="100"
Die Button selber größer klappt mit:
class="cell circlemenu large" data-item-diameter="80"
Zitat von: setstate am 05 Juni 2015, 02:40:01
@update71.
Du bekommst den Kreis der Sub Buttons größer mit:
data-circle-radius="100"
Die Button selber größer klappt mit:
class="cell circlemenu large" data-item-diameter="80"
Moin, so richtig klappt das nicht. So in etwa hatte ich schon probiert aber mir zeigts dann mein Label darunter nicht mehr an weil es durch den Kreis überdeckt wird. Offenbar passt der Kreis nicht mehr in den DIV und überlagert ihn. Sieht zumindest im FF Inspector so aus.
Hier mal der ganze Block:
<!------------- Gästezimmer ---------------- 3. Reihe waagerecht Platz 5+6 ----------------->
<li data-row="3" data-col="6" data-sizex="2" data-sizey="1" class="gs-w">
<header>Gästezimmer</header>
<div class="left">
<div data-type="circlemenu" class="cell circlemenu large" data-item-diameter="80" data-direction="bottom-half" data-circle-radius="100">
<ul class="menu">
<li>
<div data-type="symbol" data-device="HUEDevice3"
data-get-on='["off","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%","on"]'
data-on-colors='["#505050","#ffffff","#ffffff","#ffffff","#ffffff"]'
data-background-icon="fa-circle-thin"
data-on-background-colors='["#505050","#aa6900","#aa6900","#aa6900","#aa6900"]'
data-icons='["oa-light_light_dim_00","oa-light_light_dim_20","oa-light_light_dim_50","oa-light_light_dim_80","oa-light_light_dim_100"]' >
</div>
</li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="off"
data-icon="oa-light_light_dim_00"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 20"
data-icon="oa-light_light_dim_20"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 50"
data-icon="oa-light_light_dim_50"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 80"
data-icon="oa-light_light_dim_80"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 100"
data-icon="oa-light_light_dim_100"></div></li>
</ul>
</div>
<div data-type="label">Decke</div>
</div>
<div class="right">
<div data-type="label" data-device="GZ_Thermostat"
data-get="measured-temp" data-unit="%B0C%0A"
class="cell big" style="text-align:right;">
</div>
</div>
</li>
<!------------- Ende Gästezimmer ----------------------------------------------------------->Und im Anhang ein Bild was ich meine.
Schönen Tag zusammen :)
sooo siehts besser aus:
<!------------- Gästezimmer ---------------- 3. Reihe waagerecht Platz 5+6 ----------------->
<li data-row="3" data-col="6" data-sizex="2" data-sizey="1" class="gs-w">
<header>Gästezimmer</header>
<div class="left">
<div data-type="circlemenu" class="circlemenu large " data-item-diameter="80" data-direction="bottom-half" data-circle-radius="100">
<ul class="menu">
<li>
<div data-type="symbol" data-device="HUEDevice3"
data-get-on='["off","dim[12][0-9]%","dim[3456][0-9]%","dim[789][0-9]%","on"]'
data-on-colors='["#505050","#ffffff","#ffffff","#ffffff","#ffffff"]'
data-background-icon="fa-circle-thin"
data-on-background-colors='["#505050","#aa6900","#aa6900","#aa6900","#aa6900"]'
data-icons='["oa-light_light_dim_00","oa-light_light_dim_20","oa-light_light_dim_50","oa-light_light_dim_80","oa-light_light_dim_100"]' >
</div>
</li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="off"
data-icon="oa-light_light_dim_00"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 20"
data-icon="oa-light_light_dim_20"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 50"
data-icon="oa-light_light_dim_50"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 80"
data-icon="oa-light_light_dim_80"></div></li>
<li><div data-type="push" data-device="HUEDevice3"
data-set="pct 100"
data-icon="oa-light_light_dim_100"></div></li>
</ul>
</div>
<div data-type="label" class="left-space-2x top-space-2x ">Decke</div>
</div>
<div class="right">
<div data-type="label" data-device="GZ_Thermostat"
data-get="measured-temp" data-unit="%B0C%0A"
class="cell big" style="text-align:right;">
</div>
</div>
</li>
<!------------- Ende Gästezimmer ----------------------------------------------------------->
Zitat von: setstate am 05 Juni 2015, 02:16:17
- Zusatz: beim Push Widget kann man jetzt mehrere data-set-on Werte als Array angeben. Das ermöglicht zum Beispiel ein Toggeln zwischen zwei Werten.
<div data-type="push" data-device="EZ_Heizung_Clima"
data-icon="fa-hand-o-right"
data-set="controlMode"
data-set-on='["auto","manual"]'>
</div>
Wie genau wird der aktuelle Zustand ermittelt. So schickt er mir beim neuladen der Seite ja immer den ersten Wert im Array.
Grüße
In Chrome (Windows) habe ich bereits länger das Problem, dass die Ticks sämtlicher Knob-Widgets (Volume, Thermostat, Settimer) nicht mehr vollständig angezeigt werden. In neueren Screenshots zur Live-Demo sieht man den Fehler:
(https://github.com/nesges/TabletUI-Demo-WOPR/raw/master/screenshots/small/index.png?raw=true)
Ältere sind noch in Ordnung:
(https://raw.githubusercontent.com/nesges/TabletUI-Demo-WOPR/master/screenshots/small/schlafzimmer-wecker.png)
Hat jemand das gleiche Problem? Ich konnte bisher keine lokale Ursache (Addons) festmachen, aber da ich bisher keine weitere gleichlautende Fehlerbeschreibung im Netz gefunden habe, bin ich skeptisch, dass es sich wirklich um ein generelles Chrome-Problem handelt. In anderen Browsern (Opera, Firefox, IE, Chrome Android, Safari) ist die Darstellung in Ordnung.
Ich kann das Problem bestätigen, die Darstellung in Chrome ist bei mir auch fehlerhaft, Firefox ist ok.
Ja, das ist in Chrome so, vermutlich seit dem letzten Chrome-Update (weil ich Tablet UI schon länger nicht mehr aktualisiert habe).
Ist übrigens auch beim Android-Chrome so, also mit Sicherheit ein Chrome-Problem.
Im Firefox am PC und Android sowie WebviewControl in Android sieht es wie immer aus.
Hallo,
vermutlich ist es zu heiß 8) , aber wie kann ich einen Weblink darstellen ?
Ich möchte gern die Bilder (siehe Anhang) im UI anzeigen lassen.
Leider fällt mir gerade nicht ein wie ich das machen kann.
Danke für eure Bestätigung! Dann scheint das wirklich ein Bug in Chrome zu sein und ich suche nen Workarround.
Zitat von: Jewo am 05 Juni 2015, 14:01:19
vermutlich ist es zu heiß 8) , aber wie kann ich einen Weblink darstellen ?
Der Trick an der Geschichte ist, die Ausgabe der Perl-Funktion einzufügen. Das kann man mit dem template-Mechanismus hinbekommen, versuch mal:
<div data-template="/fhem?cmd={UWZAsHtmlFP(%22Unwetterzentrale%22)}&XHR=1"></div>
Zitat von: nesges am 05 Juni 2015, 14:48:25
Der Trick an der Geschichte ist, die Ausgabe der Perl-Funktion einzufügen. Das kann man mit dem template-Mechanismus hinbekommen, versuch mal:
<div data-template="/fhem?cmd={UWZAsHtmlFP(%22Unwetterzentrale%22)}&XHR=1"></div>
Hallo Nesges,
genau das war es.
Super, vielen Dank. :)
Zitat von: nesges am 05 Juni 2015, 14:39:55
Danke für eure Bestätigung! Dann scheint das wirklich ein Bug in Chrome zu sein und ich suche nen Workarround.
Beim Chrome dürfen die Ticks nicht schmaler als 0.03 sein. Ansonsten werden sie nicht dargestellt.
Mit if (w<0.03) w=0.03; geht es erst einmal
Ich schaue noch etwas, ansonsten baue ich diesen Workaround ein ...
Update0.025 ist untere Grenze. Ist jetzt in Thermostat, Volume und Homestatus gefixt
Zitat von: setstate am 04 Juni 2015, 19:47:52
Hallo hyper2910,
leider weiß ich nicht, was du genau erreichen willst. Vielleicht erklärst du es noch etwas, oder du schiebst in einem Malprogramm die Objekte des Screenshots so zusammen, wie es aussehen soll und postest das hier nochmal.
Was ich will ist das die 3 "Kreise" oben alle in der gleichen Höhe anfangen und nicht diesen Versatz haben!
Zitat von: hyper2910 am 06 Juni 2015, 08:29:46
Was ich will ist das die 3 "Kreise" oben alle in der gleichen Höhe anfangen und nicht diesen Versatz haben!
@hyper, was ich gepostet habe geht nicht?
Zitat von: setstate am 05 Juni 2015, 22:12:12
Beim Chrome dürfen die Ticks nicht schmaler als 0.03 sein. Ansonsten werden sie nicht dargestellt.
Funktioniert, Danke! Kurioserweise funktioniert übrigens auch, die tkColor auf Default "DimGray" statt "#696969" zu setzen. DimGray ist als #696969 definiert.
Zitat von: hyper2910 am 06 Juni 2015, 08:29:46
Was ich will ist das die 3 "Kreise" oben alle in der gleichen Höhe anfangen und nicht diesen Versatz haben!
Dann muss aber der Thermostat deutlich nach unten .. und "Wandlampe" rutscht unten raus ...meinst du es so ?
Zitat von: nesges am 05 Juni 2015, 14:48:25
Der Trick an der Geschichte ist, die Ausgabe der Perl-Funktion einzufügen. Das kann man mit dem template-Mechanismus hinbekommen, versuch mal:
<div data-template="/fhem?cmd={UWZAsHtmlFP(%22Unwetterzentrale%22)}&XHR=1"></div>
Gibt es auch die Möglichkeit, Bilder und Texte im "data-template" zu formatieren ?
Sprich Bilder/Text größer und kleiner darzustellen ?
Mit "height" und "width" komme ich hier nich weiter, es tut sich nichts an der Größe.
Habe seit dem heutigen update das Problem das ich ftui nicht mehr mit dem Link in fhem aufrufen kann.
Wenn ich mit der Maus draufgehe sehe ich folgenden Pfad:
http://192.168.x.xxx:8083/fhem/tablet/index.html/
Am Ende ist ein Slash zuviel. Ohne diesen funktioniert alles. Mein Eintrag in der fhem.cfg lautet:
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet Frontend
Wie bekomme ich es wieder hin das aus fhem der Aufruf klappt ?
Hermann
ich bin wieder auf die alte Version von 02_HTTPSRV.pm zurück gegangen ???
Zitat von: Hermann am 07 Juni 2015, 11:51:46
Habe seit dem heutigen update das Problem das ich ftui nicht mehr mit dem Link in fhem aufrufen kann.
Wenn ich mit der Maus draufgehe sehe ich folgenden Pfad:
http://192.168.x.xxx:8083/fhem/tablet/index.html/
Am Ende ist ein Slash zuviel. Ohne diesen funktioniert alles. Mein Eintrag in der fhem.cfg lautet:
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet Frontend
Wie bekomme ich es wieder hin das aus fhem der Aufruf klappt ?
Hermann
benutze den define... aus dem 1 Post, damit klappts
Andreas
Hab ich probiert . :(
Mit dem define aus dem ersten Post: define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UI
Nur statt ftui tablet. Hat nichts gebracht. Nur das einspielen der alten 02_HTTPSRV.pm
Das kanns aber nicht sein nach jeden update eine alte Datei wieder einspielen. Kann jemand den Fehler reproduzieren ?
Zitat von: Hermann am 07 Juni 2015, 15:04:01
Hab ich probiert . :(
Mit dem define aus dem ersten Post: define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UI
Nur statt ftui tablet. Hat nichts gebracht. Nur das einspielen der alten 02_HTTPSRV.pm
Das kanns aber nicht sein nach jeden update eine alte Datei wieder einspielen. Kann jemand den Fehler reproduzieren ?
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI <- so hätte es vermutlich was gebracht (abschließender / ) ! Dass man nicht unbedingt "tablet" im define benutzen solle sondern alles andere als "tablet" wenn der pfad .../tablet ist, stand weiter vorne auch schon mal.
Hallo
Eventuell hängt das Problem mit dem "/" mit folgender Änderung zusammen:
http://forum.fhem.de/index.php/topic,37232.msg301190.html#msg301190 (http://forum.fhem.de/index.php/topic,37232.msg301190.html#msg301190)
Gruß
Gigafix
Zitat von: Gigafix am 07 Juni 2015, 17:33:51
Eventuell hängt das Problem mit dem "/" mit folgender Änderung zusammen:
http://forum.fhem.de/index.php/topic,37232.msg301190.html#msg301190 (http://forum.fhem.de/index.php/topic,37232.msg301190.html#msg301190)
Ja das ist richtig, die Änderung von gestern hat leider für das tablet UI, das Problem eher verschlimmert, wie auch im obigen Thread bemerkt. Momentan ist zu empfehlen entweder das alte HTTPSRV zurückzuspielen oder die Variante von HTTPSRV, die ich auch im obigen Thread (und hier gepostet habe).
Allerdings ist die Definition
Zitat von: Hermann am 07 Juni 2015, 11:51:46
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet Frontend
auf jeden Fall nicht so sinnvoll, da die normalerweise nur dafür sorgt, das HTTPSRV in diesem Fall eigentlich nicht benutzt wird, sondern einfach FHEMWEB direkt. Im Fall, dass das tablet UI über /fhem/tablet/index.html erreichbar sein soll, kann man eigentlich sogar ganz auf die HTTPSRV-Definition verzichten.
Gruss,
Johannes
Hallo,
ich habe mir auch schon eine einfache Oberfläche zusammen gestellt, die Sensoren (Temp., Luftfeuchte, Helligkeit...), Zustände (Rolladen, Jalousie...), Wetter anzeigt.. Ging mit Hilfe aus dem Forum ganz gut.
Jetzt möchte ich gerne meine Jalousien nicht nur als offen / zu, sondern als Slider anzeigen. Dazu auch gerne die Jalousiestellung (Level) und Lamellenwinkel per Oberfläche einstellen, damit meine Frau per Smartphone die Jalousien einstellen kann, ohne von Schalter zu Schalter zu laufen. Nicht dass ich zu faul wäre das selber zu machen, Sie hat aber Ihre eigenen Vorstellungen der Beschattung. :-)
Ich dachte dabei an eines der kreisförmigen Elemente (Lautstärke...), alternativ an eine Schieberegler (habe ich aber noch nicht gesehen). Kann ich das auch zur Vorgabe an eine Jalousie einsetzen?
Ich muss gestehen, dass ich mit den komplexeren Programmierungen nicht zurecht komme und noch nichts funktionsfähiges zustande gebracht habe.
Gruß Jürgen
Hallo Jürgen,
wie wäre ein negierter vertikaler Slider für die Rolladen?
http://forum.fhem.de/index.php/topic,34233.msg294251/topicseen.html#msg294251
Zitat von: setstate am 08 Juni 2015, 07:26:15
Hallo Jürgen,
wie wäre ein negierter vertikaler Slider für die Rolladen?
http://forum.fhem.de/index.php/topic,34233.msg294251/topicseen.html#msg294251
Bei mir sieht das im Code so aus, wobei ich für meine Familie auch noch die gewohnten Knöpfe aus der Fernbedienung hinzugefügt habe.
<header>Schlafzimmer</header>
<div class="left cell">
<div data-type="label" class=""> </div>
<div data-type="slider" data-device='roll_sz' data-get="STATE" data-min="0" data-max="100" data-on='(on|closed|down)' data-off='(open|off)' data-value=true class="mini negated" > </div>
<div class="triplebox-v small top-space-2x">
<div data-type="push" data-device="roll_sz" data-icon="fa-chevron-up" data-background-icon="fa-square-o" data-set="off" class=""> </div>
<div data-type="push" data-device="roll_sz" data-icon="fa-minus" data-background-icon="fa-square-o" data-set="stop" class=""> </div>
<div data-type="push" data-device="roll_sz" data-icon="fa-chevron-down" data-background-icon="fa-square-o" data-set="on" class=""> </div>
</div>
</div>
Grafisch wie unten im Bild:
Bin erst vor 2 Wochen auf FHEM gestoßen und vor allem Zusammen mit dem Tablet UI gefällt's mir richtig gut - wirklich toll, was eine aktive Community auf die Beine stellen kann!
Jetzt aber gleich zu meiner Frage: ich habe aktuell ein paar Temperatur- und Feuchtesensoren angebunden und lasse mir deren Werte in einem Label darstellen. Klimatrend, und MIN/AVG/MAX habe ich mir auch bereits via statistics Modul eingebaut. Soweit schon recht schick.
Was mir aber fehlt, ist ein Chart mit den Temperatur- und Feuchteverläufen. Via google bin ich über das Simplechart Widget gestoßen aber out-of-the box hab ich das nicht hinbekommen. Ich hab zwar von Javascript keinen Plan, aber ein Blick in die .js Quellen zeigt, dass die Widgets für widget-simplechart.js und z.B. widget-label.js recht unterschiedlich sind (also von dem wie sie aufgerufen sind, etc.) das sieht beim widget-label.js so aus, als ob das von widget-widget ableitet und dann werden attribute gesetzt (heißt das bei js so?).
Langer Rede kurzer Sinn. Wenn ich charts haben möchte, wie mach ich das am geschicktesten - soll ich versuchen das widget-simplechart.js so anzupassen, dass es wie das widget-label.js verwendet werden kann, oder ist das zum Scheitern verurteilt? Kann ich auch gplot's aus dem "normalen" Webinterface einbinden, via iframe o.ä.?
Vielen Dank!
Hallo nigl,
willkommen, ich bin auch noch relativ neu dabei.
Ich hatte vor bei mir meine SVG-plots ins tablet ui eingebunden. Dazu habe ich momentan noch ein lokales Javascript im Einsatz, da ich noch nicht dazugekommen bin mir zu überlegen, wie man daraus sinnvoll ein Widget machen kann, bei dem mehrere Plots gemeinsam gesteuert werden.
Der Code dazu findet sich im angehängten HTML. Dies kann z.B. als pagetab eingebunden werden. Die Namend er SVG plots muss man natürlich anpassen...
Zur Info: Das ganze ist eher ein quickhack um die SVGs als images einzubinden und Knöpfe für Zoom und Zeitnavigation zu haben. Dabei werden dann alle Charts paralell verändert...
Bei Interesse könnte ich das ganze auch verallgemeinern und verschönern.
Gruss,
Johannes
Zitat von: nigl am 08 Juni 2015, 17:06:04
Langer Rede kurzer Sinn. Wenn ich charts haben möchte, wie mach ich das am geschicktesten - soll ich versuchen das widget-simplechart.js so anzupassen, dass es wie das widget-label.js verwendet werden kann, oder ist das zum Scheitern verurteilt? Kann ich auch gplot's aus dem "normalen" Webinterface einbinden, via iframe o.ä.
widget_simplechart hat leider immer noch den Status vom April. Ich habe da noch nix weiter machen können.
http://forum.fhem.de/index.php/topic,34233.msg281413/topicseen.html#msg281413
Hallo in die Runde,
ich bin seit dem gestrigen Update auch am Verzweifeln. Bei mir macht die tablet ui jetzt sehr merkwürdige Dinge. So komme ich beispielsweise von extern nicht mehr an meine Oberfläche. Von intern zeigt mir die tablet ui bei jedem Refresh der WEB-Seite andere Werte. Besonders interessant ist, dass meine Tablet ui Werte ausgibt, die ich gar nicht abfrage. Z.b. bei den Wetterdaten bekomme ich auf einmal Windrichtung und solches Zeug ausgegeben, wo sonst mein Wetter-Icon stand. Kurz um, hier hat jemand mächtig Mist gebaut, was mich im Moment sehr ärgert.
Der eigentliche Grund, weshalb ich schreiben wollte war eher positiver Natur. :-) Ich habe mich mal in das Thema Charts eingearbeitet und folgenden Lösungsansatz gefunden. Für die Darstellung der Charts nutze ich dygraph. Als Datenquelle nutze ich eine mysql Datenbank, da hier ohnehin meine Logdaten aus fhem reingeschrieben werden. Direkt auf der mysql Datenbank habe ich eine neue separate Tabelle für die Charts erstellt, die ich im 5-Minutentakt (über mysql Event) aktualisiere. Für diesen Weg habe ich mich aus Performancegründen entschieden. Weiterhin sind die Daten in der separaten Tabelle für dygraph schon soweit umgeformt, dass ich diese einfach in dygraph einlesen kann. Für für die Charts habe ich wiederum separate php-Seiten erstellt. Diese bette ich am Ende einfach als iframe in meine Tablet ui ein und fertig. Die Lösung ist sicher noch nicht so flexibel, dass man sie mit "drei Handgriffen" übernehmen kann. Für mich jedoch eine sehr feine Lösung, um auch in der Tablet ui wieder auf meine Charts zugreifen zu können. (Beispielbild von meiner Seite mit den Charts anbei)
Zitat von: jemu75 am 08 Juni 2015, 19:23:32
ich bin seit dem gestrigen Update auch am Verzweifeln. Bei mir macht die tablet ui jetzt sehr merkwürdige Dinge. So komme ich beispielsweise von extern nicht mehr an meine Oberfläche. Von intern zeigt mir die tablet ui bei jedem Refresh der WEB-Seite andere Werte. Besonders interessant ist, dass meine Tablet ui Werte ausgibt, die ich gar nicht abfrage. Z.b. bei den Wetterdaten bekomme ich auf einmal Windrichtung und solches Zeug ausgegeben, wo sonst mein Wetter-Icon stand. Kurz um, hier hat jemand mächtig Mist gebaut, was mich im Moment sehr ärgert.
Dann kann man nur hoffen, du findest denjenigen und schimpfst ihn ordentlich aus.
PS: Mit ner nachvollziehbaren Fehlermeldung bekommst du hier übrigens den besten Support des Fhemiversums. Aber mit dem zitierten Absatz kann kein Mensch was anfangen.
Zitat von: nesges am 06 Juni 2015, 09:42:03
Funktioniert, Danke! Kurioserweise funktioniert übrigens auch, die tkColor auf Default "DimGray" statt "#696969" zu setzen. DimGray ist als #696969 definiert.
Schon interessant, und ich finde diese Lösung sogar besser, da somit auch die gewünschten Breiten erhalten bleiben.
Ich habe das jetzt nochmal geändert und #666 als default Tick Farbe hinterlegt.
Zitat von: nesges am 08 Juni 2015, 19:28:24
PS: Mit ner nachvollziehbaren Fehlermeldung bekommst du hier übrigens den besten Support des Fhemiversums. Aber mit dem zitierten Absatz kann kein Mensch was anfangen.
Hast absolut Recht. Die zeitraubende Fehlersuche ist eben nervig, aber gehört auch dazu ;-)
Ich bekomme leider keine klare Fehlermeldung sondern nach jedem Refresh meine Tablet ui Seite andere Daten angezeigt.
Habe jetzt eine ganze Weile mit dem HTTPSRV Befehl in meiner fhem.cfg probiert. Egal wie ich den Befehl gestalte, ich komme immer über die selbe URL auf meine Tablet ui. Ich verstehe echt nicht, was HTTPSRV hier tut. Aktuell sieht mein Befehl so aus: define mytabletui HTTPSRV tablet_ui/ ./www/tablet/ Tablet U
Anbei mal noch ein paar Screenshots jeweils nach Refresh
Ich habe jetzt mal bewusst Fehler eingebaut um zu schauen, wie HTTPSRV reagiert.
Mein Befehl in der fhem.cfg sieht jetzt wie folgt aus: define tablet_ui HTTPSRV ftui/ ./tablat/ tablet_ui
Den Pfad "./tablat" gibt es so nicht. Dennoch bekomme ich nach einem "shutdown restart" von fhem immer noch meine Tablet ui über folgende url: http://192.168.2.150:8083/fhem/tablet/mobile_start.html angezeigt. Was macht HTTPSRV eigentlich so richtig? :-\
HTTPSRV ist mir auch ein Mysterium. viegener kümmert sich darum und kann vielleicht später noch genaueres sagen. Der URL mit "fhem/tablet" wird immer funktionieren, auch wenn er nicht per HTTPSRV definiert ist, denn dann liefert FHEMWEB die Daten einfach selbst aus, weil das Verzeichnis "tablet" ja existiert. Daher sollte - nach meinem Verständnis - die HTTPSRV-Definition immer vom Verzeichnisnamen "tablet" abweichen und dann auch entsprechend aufgerufen werden. Also so wie im ersten Post beschrieben:
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
Allerdings hat es offenbar gestern auch ein HTTPSRV-Update gegeben, mit dem andere auch schon Probleme beschrieben haben. Du hattest sowohl FTUI als auch Fhem upgedatet? Evtl. hilft's dann eine ältere Version von HTTPSRV wieder einzuspielen.
Deine Screenshots sehen so aus, als ob Fhem nicht alle Daten liefert bzw. zu spät liefert. Besonders im zweiten wird's deutlich - der Temperatur-Wert des Wetter-Devices ist offenbar vollkommen falsch formatiert. Bekommst du auch Toast-Meldungen mit Timeout-Fehlern? Am besten du vergleichst erstmal die FTUI-Anzeige, die FHEMWEB-Anzeige und im weiteren Verlauf die Ausgaben des Eventmonitors. Ich schätze es hängt schon bei Fhem selbst.
@nesges: Guter Hinweis. Ich werde mich morgen noch mal ransetzen und der Sache weiter auf den Grund gehen.
Vielen Dank auf jeden Fall schon mal! :)
Hallo,
wenn ich das Circlemenüs in meine Seite einbaue, reagiert es nur sehr langsam und zeitverzögert.
Scheinbar ist mein Pi2 damit überfordert, auch bei einem Spin-Icon dauert alles ungewöhnlich lange.
Ist das normal wenn FHEM auf einem Pi läuft ?
Meine Hardware besteht aus einem Pi2, FHEM, Chrome und als Anzeige verwende ich einen 15"Touchscreen.
Das kann durchaus sein, da die CSS Effekte sehr viel CPU benötigen. Gerade spin ist ein solcher Effekt. Schau mal in der 'top' Liste auf dem Rasp nach (per ssh Console)
Wenn Ihr nach dem 7.6. ein Update HTTPSRV gemacht habt, funktioniert unter Umständen Euer tablet ui nicht mehr richtig.
Wenn das für Euch gilt, dann gibt es 3 Möglichkeiten:
- Alte HTTPSRV zurückspielen (naütrlich vor dem Update
- HTTPSRV aus meinem Post einspielen, hier nochmals angehängt
- tablet ui mit /fhem/tablet/index.html aufrufen (bei Standardpfaden)
Zitat von: jemu75 am 08 Juni 2015, 20:16:53
Ich habe jetzt mal bewusst Fehler eingebaut um zu schauen, wie HTTPSRV reagiert.
Mein Befehl in der fhem.cfg sieht jetzt wie folgt aus: define tablet_ui HTTPSRV ftui/ ./tablat/ tablet_ui
Den Pfad "./tablat" gibt es so nicht. Dennoch bekomme ich nach einem "shutdown restart" von fhem immer noch meine Tablet ui über folgende url: http://192.168.2.150:8083/fhem/tablet/mobile_start.html angezeigt. Was macht HTTPSRV eigentlich so richtig? :-\
Apropos: Manchmal hilft hier auch die Suchfunktion weiter, denn diese arbeitet hier im Forum relativ zum aktuellen Kontext. Also bei Eingabe von HTTPSRV in diesem Thread bekommst Du die verschiedenen Beiträge zu diesem Thema aus diesem Thread. Dabei war auch schon der Hinweis auf das problematische Update. ;D
Zitat von: viegener am 09 Juni 2015, 01:29:59
Wenn Ihr nach dem 7.6. ein Update HTTPSRV gemacht habt, funktioniert unter Umständen Euer tablet ui nicht mehr richtig.
Wenn das für Euch gilt, dann gibt es 3 Möglichkeiten:
- Alte HTTPSRV zurückspielen (naütrlich vor dem Update
- HTTPSRV aus meinem Post einspielen, hier nochmals angehängt
- tablet ui mit /fhem/tablet/index.html aufrufen (bei Standardpfaden)
Nach dem 02_HTTPSRV.pm Update von Vorgestern läuft/lief tablet-ui bei mir zunächst auch nicht.
Problem:
No HTTPSRV device for /tablet/Sowie auch mehrere timeouts beim "refresh" der tablet-ui Website. Nach einigen refreshes werden dann endlich alle Wert angezeigt.
Die Definition für Tabelt-ui: define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet-UI ... geht bei mir mit neuer 02_HTTPSRV.pm nicht mehr
define tablet_ui HTTPSRV ftui/ ./www/tablet Tablet-UI hingegen läuft nun, nach 02_HTTPSRV.pm Update korrekt.
Auch mir ist das Verhalten der 02_HTTPSRV ein Rätsel ...
Viele Grüße!
Andreas
Die Definition für Tabelt-ui: define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet-UI ... geht bei mir mit neuer 02_HTTPSRV.pm nicht mehr
Diese Definition ist auch nicht korrekt und ich denke auch nirgends so dokumentiert oder empfohlen gewesen. Ich versuche die aktuell beste Definition immer in der Projekt ReadMe und im ersten Post zu hinterlegen.
Ich könnte mir vorstellen, dass andere Module nach dem Update mehr Last auf dem Server verursachen und damit die Versorgung des Webservers behindern. Ich würde mal den Debuglevel hochsetzen und im Fhem log nachsehen was während eines Page Refresh auf dem System so passiert.
Hallo !
Erst mal fetten Dank für die geile Gui und die Möglichkeiten.
Nun ne Frage - ich bekomme irgendwie meine SONOS nicht richtig eingebunden. Ich hätte gerne ein Play und Stop und ein Dropdown für meine Favoriten. Leider scheiterts an dem Dropdown. Da wird nur murks angezeigt. Kennt sich jemand mit der SONOS einbindung aus?
Zitat von: setstate am 09 Juni 2015, 10:17:41
Die Definition für Tabelt-ui: define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet-UI ... geht bei mir mit neuer 02_HTTPSRV.pm nicht mehr
Diese Definition ist auch nicht korrekt und ich denke auch nirgends so dokumentiert oder empfohlen gewesen. Ich versuche die aktuell beste Definition immer in der Projekt ReadMe und im ersten Post zu hinterlegen.
..
Ja richtig, diese stammt aber aus dem Wiki --> http://www.fhemwiki.de/wiki/FHEM_Tablet_UI (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI)
Zitat von: setstate am 09 Juni 2015, 10:17:41
Ich könnte mir vorstellen, dass andere Module nach dem Update mehr Last auf dem Server verursachen und damit die Versorgung des Webservers behindern. Ich würde mal den Debuglevel hochsetzen und im Fhem log nachsehen was während eines Page Refresh auf dem System so passiert.
Ja, das werde ich machen. Derzeit bekomme ich glücklicherweise selten "timeouts".
Ansonsten ist das tables-ui einen rundum gelungene Sache!!
Viele Grüße!
Andreas
Zitat von: fhem-challenge am 09 Juni 2015, 14:03:31
Die Definition für Tabelt-ui: define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet-UI ... geht bei mir mit neuer 02_HTTPSRV.pm nicht mehr
Ja richtig, diese stammt aber aus dem Wiki --> http://www.fhemwiki.de/wiki/FHEM_Tablet_UI (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI)
Nicht ganz ...
im Wiki steht
define tablet_ui HTTPSRV tablet/index.html ./www/tablet Tablet Frontendund in der Github-Doku
define TABLETUI HTTPSRV ftui ./www/tablet/ Tablet-UI und in meinem .cfg
define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend und damit funktioniert es mit dem alten HTTPSRV-Modul
Anscheinend scheint niemand so recht zu wissen wie es korrekt sein sollte :(
Zitat von: xsasx am 09 Juni 2015, 13:05:56
Hallo !
Erst mal fetten Dank für die geile Gui und die Möglichkeiten.
Nun ne Frage - ich bekomme irgendwie meine SONOS nicht richtig eingebunden. Ich hätte gerne ein Play und Stop und ein Dropdown für meine Favoriten. Leider scheiterts an dem Dropdown. Da wird nur murks angezeigt. Kennt sich jemand mit der SONOS einbindung aus?
EDIT:
Mein Problem liegt glaub ich daran das meine Sender die ich anwählen will zb. SWR3 nicht SWR3 heißen sondern "SWR3 Pop bla" also mit Leerzeichen und lastaction sagt "SWR3" weil es nur bis zum Leerzeichen nimmt findet er nicht. Wenn ich nun SWR3%20Pop etc eintrag gehts aber das sieht in dem Dropdown natürlich beknackt aus!
Zusätzlich ist das Dropdown weiß und die schrift irgedwie auch sehe erst beim anklicken den Namen SWR3
Jemand nen Tipp bitte?
Das Select Widget versteht data-quote
Damit kann man die Umklammerung beim Senden festlegen
Zum Beispiel data-quote='"'
Zitat von: xsasx am 09 Juni 2015, 17:09:40
Mein Problem liegt glaub ich daran das meine Sender die ich anwählen will zb. SWR3 nicht SWR3 heißen sondern "SWR3 Pop bla" also mit Leerzeichen und lastaction sagt "SWR3" weil es nur bis zum Leerzeichen nimmt findet er nicht. Wenn ich nun SWR3%20Pop etc eintrag gehts aber das sieht in dem Dropdown natürlich beknackt aus!
Zusätzlich ist das Dropdown weiß und die schrift irgedwie auch sehe erst beim anklicken den Namen SWR3
Jemand nen Tipp bitte?
Man kann die Favoriten auch umbenennen, das habe ich gemacht:
http://www.sonos.com/support/onlineuserguide/de/SonosUserGuide/iPad/Chap02/Umbenennen_eines_Sonos-Favoriten_-_iPad.htm
(http://www.sonos.com/support/onlineuserguide/de/SonosUserGuide/iPad/Chap02/Umbenennen_eines_Sonos-Favoriten_-_iPad.htm)
Dann habe ich die Favoriten z.B. so eingebunden:
<div class="cell top-narrow">
<div data-type="select" data-device="Sonos_Wohnzimmer" data-items='["SWR3","SWR1","Ohne klassik"]' data-set="startFavourite" class="inline top-space"></div>
</div>
Damit funktioniert bei mir sowohl die Auswahl als auch die Anzeige
Zitat von: Nobby1805 am 09 Juni 2015, 16:19:54
Anscheinend scheint niemand so recht zu wissen wie es korrekt sein sollte :(
Inzwischen ist das doch deutlich klarer, der Verbund aus FHEMWEB und HTTPSRV ist raber echt komplex und hat mich doch auch einige Zeit gekostet. Es geht eher noch darum die Hinweise und Anleitungen z.B. im wiki zu korrigieren.
Ich denke sowieso, es wäre gut mal über Wege nachzudenke, wie man die verschiedenen Widgets und deren viele Optionen und Einstellmöglichkeiten zu dokumentieren, vielleicht kann man das ja gemeinsam angehen?
Das Simplechart Widget habe ich jetzt soweit, dass man es nutzen könnte
Es liest direkt aus dem Logfile eines Devices und zeigt die Werte als ein einfaches XY Linien-Chart für einen Wert an.
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung2"
data-logfile="WohnzimmerHeizung2-2015.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="10"
data-maxvalue="30"
data-xticks="4"
data-daysago="0"
data-caption="Wohnzimmer">
Die Bedeutung von columnspec kann man sich aus dem FHEM Commandref erlesen (Abschnitt FileLog > column_spec)
Achtung: leider habe ich vergessen, ein wichtiges File mit hochzuladen. Das muss ich heute Abend noch nachschieben. Bis dahin kann man das Chart noch nicht probieren!!
Update: Ist jetzt alles oben ...
Aber man kann sich schon mal freuen ... genau darauf habe ich noch gewartet ;D
Moin zusammen,
geht das dann auch mit DbLog?
Grüße Daniel
Zitat von: dancatt am 10 Juni 2015, 09:51:29
Moin zusammen,
geht das dann auch mit DbLog?
Grüße Daniel
Laut CommandRef ist der Get Teil von DbLog und FileLog kompatibel. Von daher würde ich sagen: ja
Kann es aber nicht probieren, da ich kein DbLog habe.
Zitat von: viegener am 09 Juni 2015, 21:01:07
Man kann die Favoriten auch umbenennen, das habe ich gemacht:
http://www.sonos.com/support/onlineuserguide/de/SonosUserGuide/iPad/Chap02/Umbenennen_eines_Sonos-Favoriten_-_iPad.htm
(http://www.sonos.com/support/onlineuserguide/de/SonosUserGuide/iPad/Chap02/Umbenennen_eines_Sonos-Favoriten_-_iPad.htm)
Dann habe ich die Favoriten z.B. so eingebunden:
<div class="cell top-narrow">
<div data-type="select" data-device="Sonos_Wohnzimmer" data-items='["SWR3","SWR1","Ohne klassik"]' data-set="startFavourite" class="inline top-space"></div>
</div>
Damit funktioniert bei mir sowohl die Auswahl als auch die Anzeige
hahaha so einfach und ich so blind! danke das war der master tip :D nun bleibt nur noch offen warum die schrift im dropdown weuß ist und erst wenn ich drüber geh sie blau hinterlegt wird !
EDIT:
Habe jetzt eigene eigene Seite für Sonos erstelle nur leider sind die Räume untereinander anstatt nebneinander hab alle col etc geprüft nur leider ohne erfolg :( kann jemand vl helfen ? wäre super lieb:
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>HOME // SONOS</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<div class="container">
<div class="left top-space-2x">
<li data-row="1" data-col="1" data-sizex="2" data-sizey="2">
<header>SONOS BAD</header>
<div data-type="image" data-device="Sonos_Bad" data-get="currentAlbumArtURL" data-size="100%"></div>
</li>
<li data-row="2" data-col="1" data-sizex="2" data-sizey="1">
<div class="container cell">
<div data-type="label" class="" data-device="Sonos_Bad" data-get="infoSummarize1"></div><br>
<div data-type="label" class="" data-device="Sonos_Bad" data-get="infoSummarize2"></div><br>
<div data-type="label" class=" small darker" data-device="Sonos_Bad" data-get="infoSummarize3"></div>
<div data-type="label" class="" data-device="Sonos_Bad" data-get="transportState"></div><br>
</div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="3">
<header>PLAYER</header>
<div class="cell">
<div data-type="push" data-device="Sonos_Bad"
data-icon="fa-step-backward" data-background-icon="-"
data-set="Previous" class="inline">
</div>
<div data-type="push" data-device="Sonos_Bad"
data-icon="fa-stop" data-background-icon="-"
data-set="Stop" class="inline">
</div>
<div data-type="push" data-device="Sonos_Bad"
data-icon="fa-play" data-background-icon="-"
data-set="Play" class="inline">
</div>
<div data-type="push" data-device="Sonos_Bad"
data-icon="fa-step-forward" data-background-icon="-"
data-set="Next" class="inline">
</div>
</div>
<div class="top-narrow">
<div data-type="push"
data-set="VolumeD"
data-icon="fa-volume-off"
data-background-icon="-"
data-device="Sonos_Bad"
class="inline top-narrow"></div>
<div data-type="slider"
data-device="Sonos_Bad"
data-get="Volume"
data-set="Volume"
class="inline horizontal"></div>
<div data-type="push"
data-set="VolumeU"
data-icon="fa-volume-up"
data-background-icon="-"
data-device="Sonos_Bad"
class="inline top-narrow"></div>
</div>
<div class="cell">
<div data-type="select" data-device="Sonos_Bad" data-items='["DASDING","Ibiza.Global.Radio","bigFM","DIE.NEUE.107.7","ENERGY","SWR3","Soundcloud"]' data-set="startFavourite" data-on-background-color="#0066FF" class="inline top-space"></div>
</div>
<div class="container">
<div class="inline">
<div data-type="switch" data-device="OG.mm.SD.Sonos"
data-icon="fa-plug" class="cell"></div>
<div data-type="label" >Standby</div>
</div>
<div class="inline">
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 900"
class="cell"></div>
<div data-type="label" >15min</div>
</div>
<div class="inline">
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 1800"
class="cell"></div>
<div data-type="label" >30min</div>
</div>
</div>
</div>
</div>
</ul>
</li>
<ul>
<div class="left top-space-2x">
<li data-row="2" data-col="2" data-sizex="2" data-sizey="2">
<div class="container">
<header>SONOS KUECHE</header>
<div data-type="image" data-device="Sonos_Kueche" data-get="currentAlbumArtURL" data-size="100%"></div>
</li>
<li data-row="3" data-col="2" data-sizex="2" data-sizey="1">
<div class="container cell">
<div data-type="label" class="" data-device="Sonos_Kueche" data-get="infoSummarize1"></div><br>
<div data-type="label" class="" data-device="Sonos_Kueche" data-get="infoSummarize2"></div><br>
<div data-type="label" class=" small darker" data-device="Sonos_Kueche" data-get="infoSummarize3"></div>
<div data-type="label" class="" data-device="Sonos_Kueche" data-get="transportState"></div><br>
</div>
</li>
<li data-row="3" data-col="2" data-sizex="2" data-sizey="3">
<header>PLAYER</header>
<div class="cell">
<div data-type="push" data-device="Sonos_Kueche"
data-icon="fa-step-backward" data-background-icon="-"
data-set="Previous" class="inline">
</div>
<div data-type="push" data-device="Sonos_Kueche"
data-icon="fa-stop" data-background-icon="-"
data-set="Stop" class="inline">
</div>
<div data-type="push" data-device="Sonos_Kueche"
data-icon="fa-play" data-background-icon="-"
data-set="Play" class="inline">
</div>
<div data-type="push" data-device="Sonos_Kueche"
data-icon="fa-step-forward" data-background-icon="-"
data-set="Next" class="inline">
</div>
</div>
<div class="top-narrow">
<div data-type="push"
data-set="VolumeD"
data-icon="fa-volume-off"
data-background-icon="-"
data-device="Sonos_Kueche"
class="inline top-narrow"></div>
<div data-type="slider"
data-device="Sonos_Kueche"
data-get="Volume"
data-set="Volume"
class="inline horizontal"></div>
<div data-type="push"
data-set="VolumeU"
data-icon="fa-volume-up"
data-background-icon="-"
data-device="Sonos_Kueche"
class="inline top-narrow"></div>
</div>
<div class="cell">
<div data-type="select" data-device="Sonos_Kueche" data-items='["DASDING","Ibiza.Global.Radio","bigFM","DIE.NEUE.107.7","ENERGY","SWR3","Soundcloud"]' data-set="startFavourite" data-on-background-color="#0066FF" class="inline top-space"></div>
</div>
<div class="container">
<div class="inline">
<div data-type="switch" data-device="OG.mm.SD.Sonos"
data-icon="fa-plug" class="cell"></div>
<div data-type="label" >Standby</div>
</div>
<div class="inline">
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 900"
class="cell"></div>
<div data-type="label" >15min</div>
</div>
<div class="inline">
<div data-type="push"
data-device="OG.mm.SD.Sonos"
data-icon="fa-clock-o"
data-set="on-for-timer 1800"
class="cell"></div>
<div data-type="label" >30min</div>
</div>
</div>
</div>
</div>
</li>
</ul>
</body>
</html>
Zitat von: xsasx am 10 Juni 2015, 10:05:50
hahaha so einfach und ich so blind! danke das war der master tip :D nun bleibt nur noch offen warum die schrift im dropdown weuß ist und erst wenn ich drüber geh sie blau hinterlegt wird !
Gern geschehen! :D
Zitat von: xsasx am 10 Juni 2015, 10:05:50
Habe jetzt eigene eigene Seite für Sonos erstelle nur leider sind die Räume untereinander anstatt nebneinander hab alle col etc geprüft nur leider ohne erfolg :( kann jemand vl helfen ? wäre super lieb:
Ich habe das Gefühl, dass in den Positionen doch noch einiges verutscht ist und dann entscheidet Gridster gerne mal einiges untereinander zu machen.
Also ein paar Teile die mir aufgefallen sind:
erster Eintrag data-row="1" data-col="1" data-sizex="2" data-sizey="2" ==> Belegt die Kacheln (jeweils r,c) 1,1 / 1,2 / 2,1 / 2,2
zweiter Eintrag data-row="2" data-col="1" data-sizex="2" data-sizey="1"> ==> startet also in 2,1 das ist aber bereit belegt (s.o.) steht also sowohl in row also auch column in Konflikt
weiterer Eintrag data-row="2" data-col="2" data-sizex="2" data-sizey="2" ==> steht ebenfalls in Konflikt schon mit dem ersten
Generalisiert: Mein Verständnis ist
data-row=x und data-sizey=y heisst es liegt in row x und (wenn x>1 ist) auch x+1 und so weiter bis (x+y -1)
der nächste Eintrag (in der selben col) muss also in row mindestens (am besten aber genau) bei x+y starten
analog für data-col und data-sizex
Ausserdem noch der Hinweis: Gridster scheint (zumindest auf Android Chrome 4.x und 5) Dinge zu verschieben, wenn die Bildschirmbreite überschritten wird. Kacheln werden dann eher in die nächste Zeile gesetzt, wobei dann sich alles verschiebt, weil das ja für andere Kacheln vorgesehen wird.
Zitat von: nesges am 08 Juni 2015, 20:26:07
HTTPSRV ist mir auch ein Mysterium. viegener kümmert sich darum und kann vielleicht später noch genaueres sagen. Der URL mit "fhem/tablet" wird immer funktionieren, auch wenn er nicht per HTTPSRV definiert ist, denn dann liefert FHEMWEB die Daten einfach selbst aus, weil das Verzeichnis "tablet" ja existiert. Daher sollte - nach meinem Verständnis - die HTTPSRV-Definition immer vom Verzeichnisnamen "tablet" abweichen und dann auch entsprechend aufgerufen werden. Also so wie im ersten Post beschrieben:
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
Allerdings hat es offenbar gestern auch ein HTTPSRV-Update gegeben, mit dem andere auch schon Probleme beschrieben haben. Du hattest sowohl FTUI als auch Fhem upgedatet? Evtl. hilft's dann eine ältere Version von HTTPSRV wieder einzuspielen.
Deine Screenshots sehen so aus, als ob Fhem nicht alle Daten liefert bzw. zu spät liefert. Besonders im zweiten wird's deutlich - der Temperatur-Wert des Wetter-Devices ist offenbar vollkommen falsch formatiert. Bekommst du auch Toast-Meldungen mit Timeout-Fehlern? Am besten du vergleichst erstmal die FTUI-Anzeige, die FHEMWEB-Anzeige und im weiteren Verlauf die Ausgaben des Eventmonitors. Ich schätze es hängt schon bei Fhem selbst.
So, heute habe ich wieder etwas Zeit gefunden, der Sache noch mal auf den Grund zu gehen. Das Problem lag letztlich an ganz anderer Stelle.
Und zwar habe ich den <HEAD-Bereich> aus meinen Tablet ui Dateien am letzten Wochenende auf Grundlage der aktuellen index-example.html aktualisiert. Dabei ist folgende Zeile hinzugekommen: <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" /> Mit dieser kann man eigene Styles integrieren. Ich habe die besagte Datei jedoch gar nicht in meinem Projekt vorliegen. Durch einfaches Löschen dieser Zeile aus meinem Header war das Problem gelöst. :) Das aktuelle HTTPSRV-Update hat somit bei mir keine negativen Auswirkungen. :) Verrückt, dass ich auf der völlig falschen Fährte unterwegs war. Es hat sich einmal mehr bestätigt "never change an running system" ;)
Simplechart Beispiel: Zwei kleine Charts nebeeinander
<li data-row="4" data-col="4" data-sizex="8" data-sizey="3">
<header>CHARTS</header>
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung"
data-logfile="WohnzimmerHeizung.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="10"
data-maxvalue="30"
data-xticks="4"
data-daysago="0"
data-caption="Wohnzimmer" class="inline cell top-space-2x">
</div>
<div data-type="simplechart"
data-logdevice="FileLog_KuecheHeizung"
data-logfile="KuecheHeizung.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="12"
data-maxvalue="28"
data-xticks="6"
data-daysago="2"
data-caption="Küche" class="inline cell top-space-2x">
</div>
</li>
Dieser Code ergibt ein großes Chart, was die ganze Gridster Zelle ausfüllt:
<li data-row="4" data-col="4" data-sizex="8" data-sizey="3">
<header>CHART</header>
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung2"
data-logfile="WohnzimmerHeizung2.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="10"
data-maxvalue="30"
data-xticks="4"
data-daysago="0"
data-caption="Wohnzimmer" class="fullsize">
</div>
</li>
Zitat von: setstate am 10 Juni 2015, 20:31:37
Simplechart Beispiel: Zwei kleine Charts nebeeinander
<li data-row="4" data-col="4" data-sizex="8" data-sizey="3">
<header>CHARTS</header>
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung"
data-logfile="WohnzimmerHeizung.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="10"
data-maxvalue="30"
data-xticks="4"
data-daysago="0"
data-caption="Wohnzimmer" class="inline cell top-space-2x">
</div>
<div data-type="simplechart"
data-logdevice="FileLog_KuecheHeizung"
data-logfile="KuecheHeizung.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="12"
data-maxvalue="28"
data-xticks="6"
data-daysago="2"
data-caption="Küche" class="inline cell top-space-2x">
</div>
</li>
Dieser Code ergibt ein großes Chart, was die ganze Gridster Zelle ausfüllt:
<li data-row="4" data-col="4" data-sizex="8" data-sizey="3">
<header>CHART</header>
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung2"
data-logfile="WohnzimmerHeizung2.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="10"
data-maxvalue="30"
data-xticks="4"
data-daysago="0"
data-caption="Wohnzimmer" class="fullsize">
</div>
</li>
Sieht sehr gut aus. Funktioniert das evtl. auch schon, wenn die Logdaten in einer DB abgelegt sind?
Hallo, das Chart sieht doch schon ganz gut aus. Da ich momentan unterwegs bin kann ich das noch nicht testen.
Frage: Wenn in einem Wetterlogfile z.B. Temperatur, Luftfeuchtigkeit und Niederschlag enthalten sind, kann ich alle drei Werte in einem Chart abbilden?
und: Wird mir die X-Achse in Stundenformat angezeigt? (00:00 , 02:00, 04:00 ...... )
Hm ... funktioniert ... aber nicht so richtig
1. nach dem update der letzten Änderungen sind m.E. die Abstände zwischen den Zeilen deutlich größer geworden (da müsste ich ggf. auf die alte Version zurückgehen um das nachzuweisen)
2. die Kurve und auch die horizontalen Linien sind mit dem groben Pinsel gemalt ;)
3. der Text der jetzt oberhalb der Grafik steht sollte laut Source darunter stehen
<li data-row="3" data-col="1" data-sizex="2" data-sizey="4">
<header>Draussen</header>
<div class="label" class="cell"> </div>
<div data-type="label" data-device="Aussen" data-get="battery" data-part="2" data-limits='["ok"]' data-colors='["#00FF00"]' class="cell"></div>
<div data-type="label" data-device="Aussen" data-part="2" data-limits='[-73,10,23]' data-colors='["#6699FF","#AA6900","#FF0000"]' data-unit=" %B0C%0A" class="cell bigger thin top-space-2x inline"></div>
<div data-type="klimatrend" data-device="Aussen" data-get="statTemperatureTendency" data-refperiod="2" class="big inline"></div>
<div data-type="klimatrend" data-device="Aussen" data-get="statTemperatureTendency" class="big inline"></div>
<div class="label" class="cell"> </div>
<div data-type="label" data-device="Aussen" data-get="humidity" data-part="2" data-limits='[0,20,50]' data-colors='["#FF0000","#25833e","#0000FF"]' data-unit=" %" class="cell bigger thin inline"></div>
<div data-type="klimatrend" data-device="Aussen" data-get="statHumidityTendency" data-refperiod="2" class="big inline"></div>
<div data-type="klimatrend" data-device="Aussen" data-get="statHumidityTendency" class="big inline"></div>
<div class="label" class="cell"> </div>
<div data-type="simplechart"
data-logdevice="FileLog_Aussen"
data-logfile="Aussen-2015.log"
data-columnspec="4:Aussen.temperature:1:int"
data-minvalue="10"
data-maxvalue="30"
data-xticks="4"
data-daysago="0"
data-caption="Aussen">
<div data-type="label" data-device="HMLAN1"
data-get="uptime" class="small"">
</li>
Zitat von: bjoernbo am 10 Juni 2015, 21:21:02
Frage: Wenn in einem Wetterlogfile z.B. Temperatur, Luftfeuchtigkeit und Niederschlag enthalten sind, kann ich alle drei Werte in einem Chart abbilden?
und: Wird mir die X-Achse in Stundenformat angezeigt? (00:00 , 02:00, 04:00 ...... )
Grundsätzlich ginge das, aber zur Zeit ist es nur für einen Wert. Das müsste man entsprechend erweitern. Die Beschriftung für die X-Achse könnte ich noch flexibler machen. Jetzt wird nur der min und der max Tag als dd-mm angezeigt.
Zitat von: Nobby1805 am 10 Juni 2015, 22:09:40
Hm ... funktioniert ... aber nicht so richtig
1. nach dem update der letzten Änderungen sind m.E. die Abstände zwischen den Zeilen deutlich größer geworden (da müsste ich ggf. auf die alte Version zurückgehen um das nachzuweisen)
2. die Kurve und auch die horizontalen Linien sind mit dem groben Pinsel gemalt ;)
3. der Text der jetzt oberhalb der Grafik steht sollte laut Source darunter stehen
Punkt 1. sollte jetzt wieder passen
Punkt 2. sollte mit dem SVG Attribut vector-effect="non-scaling-stroke" eigentlich vermieden werden, aber der IE unterstützt das nicht. Benutzt du IE?
Punkt 3. Die beiden letzten DIVs sind nicht geschlossen. Es fehlen die </div>
Bei der Größe habe ich noch etwas gedreht. Man kann jetzt die Größe auch festlegen (in % oder px)
data-width="90%"
data-height="120px"
Hallo setstate
1) yep, ist jetzt wieder OK
2) ja, IE ... auf dem iPad ist es OK .. gibt es auch eine Lösung (Workaround) für den IE ?
3) Asche auf mein Haupt ... Danke :-[
aber jetzt habe ich noch 4 und 5 ;)
4) sollte data-xticks nicht eher data-yticks heißen ?
5) wenn der Y-Bereich von 10 bis 30 geht und "x"ticks 4 ist ... dann werden die Linien bei 12, 16, 20, 24 und 28 gezeichnet ... üblich ist dort aber doch eher 10, 14, 18, 22, 26 und 30
Danke für die schnellen Änderungen,
Gruß Nobby
und 6) wo ist bei mir eigentlich die Beschriftung der X-Achse und der Caption-Text ... liegt das auch am IE ?
und 7) kann es sein, dass die Werte auf ganze Zahlen gerundet werden ?
Zitat von: Nobby1805 am 10 Juni 2015, 23:37:11
4) sollte data-xticks nicht eher data-yticks heißen ?
5) wenn der Y-Bereich von 10 bis 30 geht und "x"ticks 4 ist ... dann werden die Linien bei 12, 16, 20, 24 und 28 gezeichnet ... üblich ist dort aber doch eher 10, 14, 18, 22, 26 und 30
Zitat von: Nobby1805 am 10 Juni 2015, 23:45:20
und 6) wo ist bei mir eigentlich die Beschriftung der X-Achse und der Caption-Text ... liegt das auch am IE ?
und 7) kann es sein, dass die Werte auf ganze Zahlen gerundet werden ?
4. ja, ganz blöd, habe ich verwechselt. Bitte ab sofot
data-yticks verwenden
5. hier hast du auch Recht. War auch falsch, ist jetzt auch korrigiert
6. probiere mal eine fixen Wert: data-height="120px"
7. ja, aber jetzt passiert das nicht mehr
Zitat von: setstate am 11 Juni 2015, 02:06:51
6. probiere mal eine fixen Wert: data-height="120px"
7. ja, aber jetzt passiert das nicht mehr
zu 6) auch bei verschiedenen Werten für data-height kommt bei mir weder mit IE noch Safari eine Beschriftung
zu 7) doch passiert weiterhin, s. Screenshot vom iPad
und darf ich noch mal fragen, ob du einen Workaround für den IE siehst ?
Update: Ich habe bei einer Suche im Netz nur den Workaround gefunden, auf das Attribut "non-scaling-stroke" zu verzichten und das scaling durch eigene Berechnung der stroke-width zu kompensieren ... ich schaue mal bei Windows 10 wie der neue MS-Browser sich dort verhält
Update2: Project Spartan in der Version 0.11.10074.0 verhält sich leider genauso wie der IE :(
södele.... jetzt bin ich auch mal zum testen gekommen. Leider noch nicht von Erfolg gekrönt.
Ich habe mir das widget-simplechart neu geladen und die hem-tablet-ui.css aktualisiert! (Muss die ...ui.css eigentlich dafür auch auf dem neustem Stand sein, weil wir man meinem Ausschnitt entnehmen kann, sind die Abstände zu den Buttons aufeinmal anders)
Das Widget liefert allerdings keine Ergebnisse. Es wird mir auch noch nicht mal die "Caption" angezeigt, obwohl ich denke das ich alles richtig hinterlegt habe.
Zitat<li data-row="1" data-col="2" data-sizex="8" data-sizey="3">
<div data-type="simplechart"
data-logdevice="FileLog_LaCrosse_2A"
data-logfile="LaCrosse_2A-2015.log"
data-columnspec="4:meas.*:1:int"
data-minvalue="0"
data-maxvalue="10"
data-yticks="1"
data-daysago="0"
data-caption="Kühlschrank"
>
</li>
Frage: Das Log-File für meinen Energieverbrauch logge ich monatlich. Es ist ja sicherlich nicht im Sinne des Erfinders, dass ich jeden Monat im Code meinen Namen im Bezug auf das LogFile ändern soll. :-D :-D :-D
Die veränderten Abstände hatte ich auch ... hat setstate wohl heute morgen korrigiert ... bei mir jetzt OK
Bist du sicher, dass deine columnspec-Angabe korrekt ist ? kommen denn die y-ticks ?
es kommt leider gar nichts!
Aber da sagst Du was, ich habe mir heute morgen mal die comref angeschaut im Bezug auf die columspec-Angaben. Ganz ehrlich? Ich habe das nicht verstanden :'(
denn in Spalte 4 steht doch die Temperatur :-[
Zitat2015-06-11_14:42:21 LaCrosse_2A battery: ok
2015-06-11_14:43:08 LaCrosse_2A T: 6.6
2015-06-11_14:43:13 LaCrosse_2A T: 6.7
2015-06-11_14:45:31 LaCrosse_2A T: 6.6
2015-06-11_14:50:08 LaCrosse_2A T: 6.5
2015-06-11_14:57:21 LaCrosse_2A temperature: 6.5
2015-06-11_14:58:09 LaCrosse_2A T: 6.4
2015-06-11_14:58:13 LaCrosse_2A T: 6.5
2015-06-11_14:58:17 LaCrosse_2A T: 6.4
2015-06-11_14:58:35 LaCrosse_2A T: 6.5
2015-06-11_14:59:09 LaCrosse_2A T: 6.4
2015-06-11_15:07:14 LaCrosse_2A T: 6.5
2015-06-11_15:07:18 LaCrosse_2A T: 6.4
2015-06-11_15:07:36 LaCrosse_2A T: 6.5
2015-06-11_15:16:06 LaCrosse_2A T: 6.6
2015-06-11_15:21:35 LaCrosse_2A T: 6.7
2015-06-11_15:22:23 LaCrosse_2A T: 6.6
2015-06-11_15:23:23 LaCrosse_2A T: 6.7
2015-06-11_15:27:26 LaCrosse_2A temperature: 6.7
2015-06-11_15:29:10 LaCrosse_2A T: 6.6
2015-06-11_15:33:16 LaCrosse_2A T: 6.5
2015-06-11_15:35:18 LaCrosse_2A T: 6.4
2015-06-11_15:35:22 LaCrosse_2A T: 6.5
Probiere mal das:
data-columnspec="4:temperature.*:1:int"
Die zweite Angabe ist der Zeilenfilter.
Zum Thema rolling Logfile, probiere als zweites Mal dies:
data-logfile="-"
Aber erstmal nur mit der ersten Änderung probieren, ob Daten kommen.
??? bei beiden Methoden kommen keine Daten!!! Was ich ebenso wundert, dass die "caption" nicht ausgegeben wird und mir die Achsen gleich zweimal gezeichnet werden.
Ich habe es nebenbei auch mal eben im Firefox ausprobiert, nicht das Safari an dieser Stelle rumzickt!
Muss ich im übrigen die aktuelle ...ui.css haben? Diese hatte ich wieder durch meine alte ausgetauscht.
Welcher der Werte im Log ist denn der richtige (ich kenne LaCrosse nicht) ... T oder temperature ? M.E. ist das ".*" falsch ...
Wie gesagt, die "caption" kommt bei mir auch nicht (IE11)
Update: du braucht die neue css ...
:-\ neue ui.css wieder geladen. (Effekt, dass die Buttons nicht mehr passen besteht weiterhin), egal
Anderes Device und Logfile ausgewählt => negativ
ZitatWie gesagt, die "caption" kommt bei mir auch nicht (IE11)
Ok.
ES GEHT! Ich werd wahnsinnig!! Nachdem ich FHEM einmal durchgestartet habe, tut es nun auch °°!!!!
Das auf der X-Achse keine Zeitangabe ist, ist richtig und bekannt, oder?
bleibt nur noch die Frage warum ich jetzt diesen Versatz drin habe :-\
Irgendwie sind die Abstände größer geworden. An welcher Stelle kann ich diese in der ui.css anpassen?
Zitat<li data-row="1" data-col="2" data-sizex="4" data-sizey="2">
<div data-type="simplechart"
data-logdevice="FileLog_Ben.Wandthermostat"
data-logfile="Ben.Wandthermostat-2015.log"
data-columnspec="4:measured-temp:.*1:int"
data-minvalue="10"
data-maxvalue="24"
data-yticks="2"
data-daysago="0"
data-caption="Kinderzimmer Ben">
</li>
Wenn man zuvor noch mit <header> arbeitet bräuchte man Strenggenommen kein "data-caption" !
Zitat von: bjoernbo am 11 Juni 2015, 16:59:11
Das auf der X-Achse keine Zeitangabe ist, ist richtig und bekannt, oder?
bleibt nur noch die Frage warum ich jetzt diesen Versatz drin habe :-\
bei mir fehlen Caption UND die Zeitangaben ... vermutlich aus demselben Grund ;)
Wie gesagt, den Versatz hatte ich bis heute morgen auch ... dann hat setstate noch mal einen Update der CSS gemacht
Vermutlich hat Björnbo die CELL Änderung nicht mitbekommen.Die nach oben Abstände sind dort größer geworden( ist jetzt gleich dem nach links)
Da könntest du entweder
- deine html anpassen und alle unnötigen class="cell" rauswerfen
- oder eine <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" /> einbinden und dort die "alte" cell Definition reinwerfen
:o das ist mir echt durch die Lappen gegangen! Da werde ich eine Menge zu tun haben. SHIT 8)
;D Habe meine alte ui.css aktiviert und sie da! Mir wird weiterhin ohne Problem der "Graph" angezeigt
U N D !!!!!
auf meinem Andoird tablet wird mir zudem auf er X-Achse die Zeitangabe ausgegeben, welche im Safari nicht angezeigt wird !!!!!
ALLES GUT !
Ach, auf dem Tablet funktioniert auch "data-caption" :-)
Hallo,
kann mir jemand helfen wie die data-columnspec für ein simplechart aussehen muss?
Mein Log sieht so aus
2015-06-11_18:49:47 LaCr.Thermo01 T: 22.9 H: 54.2 D: 13.1
2015-06-11_18:46:43 LaCr.Thermo01 T: 22.9 H: 54.2 D: 13.1
2015-06-11_18:35:32 LaCr.Thermo01 T: 22.9 H: 53.2 D: 12.9
Ich möchte die Temperatur ausgeben lassen (22.9).
Vielen dank im Voraus.
;D LaCorsse ;D
data-columnspec="3:T:.*1:int"
sollte funktionieren.
Zitat von: bjoernbo am 11 Juni 2015, 19:38:53
;D LaCorsse ;D
data-columnspec="3:T:.*1:int"
sollte funktionieren.
aus meiner Sicht eher die Spalte 4 ... und .*1 für den dritten Teilausdruck ist auch nicht richtig, der Punkt und der Stern gehören ggf. zum 2. Ausdruck (RegEx)
Zitat von: Nobby1805 am 10 Juni 2015, 23:45:20
und 7) kann es sein, dass die Werte auf ganze Zahlen gerundet werden ?
die Frage kann ich mir inzwischen selbst beantworten ...
Beim columnspec muss das int als 4. Element weggelassen werden ... s. Auszug aus der FHEM-Doku
Zitat<col>:<regexp>:<default>:<fn>
◾<fn> Kann folgende Inhalte haben:
◾int
Löst den Integer-Wert zu Beginn eines Strings heraus. Wird z.B. bei 10% gebraucht.
@bjoernbo funktioniert leider nicht.
Die Konsole spuckt folgendes aus:
Parameter
get FileLog_LaCr.Thermo01 LaCr.Thermo01-2015.log - 2015-06-11_00:00:00 2015-06-12_00:00:00 3:T:.*1:i
nt
Antwort
2015-06-11_00:00:00 .*1
#3:T:.*1:int
mit 4:T.*1::int bekomm ich folgende antowort, aber es wird kein Diagramm angezeigt. Woran kann das liegen?
2015-06-11_18:46:43 22
2015-06-11_18:49:47 22
2015-06-11_19:43:21 22
2015-06-11_19:47:05 22
#4:T.*1::int
Gibt es eine Beschreibung wie sich der Wert zusammen setzt?
ja, in der FHEM Commandref unter FileLog
Zitat◾<column_spec>
Jede column_spec sendet die gewünschten Daten entweder in eine gesonderte Datei oder über die gegenwärtige Verbindung durch "-" getrennt.
Syntax: <col>:<regexp>:<default>:<fn>
◾<col> gibt die Spaltennummer zurück, beginnend mit 1 beim Datum. Wenn die Spaltenmummer in doppelten Anführungszeichen steht, handelt es sich um einen festen Text und nicht um eine Spaltennummer.
◾<regexp> gibt, falls vorhanden, Zeilen mit Inhalten von regexp zurück. Groß- und Kleinschreibung beachten.
◾<default>
Wenn keine Werte gefunden werden, und der Default-Wert (Voreinstellung) wurde gesetzt, wird eine Zeile zurückgegeben, die den von-Wert (from) und diesen Default-Wert enthält. Dieses Leistungsmerkmal ist notwendig, da gnuplot abbricht, wenn ein Datensatz keine Daten enthält.
◾<fn> Kann folgende Inhalte haben:
◾int
Löst den Integer-Wert zu Beginn eines Strings heraus. Wird z.B. bei 10% gebraucht.
◾delta-h oder delta-d
Gibt nur den Unterschied der Werte-Spalte pro Stunde oder pro Tag aus. Wird benötigt, wenn die Spalte einen Zähler enthält, wie im Falles des KS300 in der Spalte für die Regenmenge.
◾alles andere
Dieser String wird als Perl-Ausdruck ausgewertet. @fld enthaelt die aktuelle Zeile getrennt durch Leerzeichen. Achtung: Dieser String/Perl-Ausdruck darf keine Leerzeichen enthalten.
"4:T:1::" wäre m.E. die richtige Angabe
Zitat von: Nobby1805 am 11 Juni 2015, 09:53:01
Update: Ich habe bei einer Suche im Netz nur den Workaround gefunden, auf das Attribut "non-scaling-stroke" zu verzichten und das scaling durch eigene Berechnung der stroke-width zu kompensieren ... ich schaue mal bei Windows 10 wie der neue MS-Browser sich dort verhält
Für die y-Ticks habe ich die Skalierung hinbekommen ...
// 'style':'stroke:#555;stroke-width:1px',
'style':'stroke:#555;stroke-width:'+(max-min)/200+'px',
aber bei den Kurven klappt das nicht weil ich es irgendwie nicht schaffe auf max und min zuzugreifen :(
Danke Nobby1805.
Verwende jetzt 4:LaCr.Thermo03.*:0: und in der Konsole kommt auch das an.
Parameter
get FileLog_LaCr.Thermo03 LaCr.Thermo03-2015.log - 2015-06-11_00:00:00 2015-06-12_00:00:00 4:LaCr.Thermo03
.*:0:
Antwort
...
2015-06-11_20:25:02 21.7
2015-06-11_20:30:02 21.5
2015-06-11_20:34:08 21.4
2015-06-11_20:42:00 21.2
2015-06-11_20:46:27 21.1
2015-06-11_20:49:51 21.1
#4:LaCr.Thermo03.*:0:
Aber es wird kein Diagramm angezeigt.
<li data-row="1" data-col="1" data-sizex="4" data-sizey="2">
<header>CHARTS</header>
<div data-type="simplechart"
data-logdevice="FileLog_LaCr.Thermo03"
data-logfile="LaCr.Thermo03-2015.log"
data-columnspec="4:LaCr.Thermo03.*:0:"
data-minvalue="10"
data-maxvalue="30"
data-yticks="4"
data-daysago="0"
data-caption="Wohnzimmer" class="inline cell top-space-2x">
</div>
</li>
Hallo Setstate und Viewgener,
sorry für die späte Antwort, war wieder einmal verreist.
Genau so hatte ich es mir vorgestellt. Ich werde mal versuchen, so einen Slider mit Tasten einzubauen.
Besten Dank.
kann bestätigen, ohne "int" sind sogar die "Zacken" erkennbar!
Zitat<li data-row="1" data-col="6" data-sizex="4" data-sizey="2">
<header>Kinderzimmer-Julia</header>
<div data-type="simplechart"
data-logdevice="FileLog_Julia.Wandthermostat"
data-logfile="Julia.Wandthermostat-2015.log"
data-columnspec="4:measured-temp:.*1"
data-minvalue="10"
data-maxvalue="30"
data-yticks="4"
data-daysago="0"
data-caption="Temperaturverlauf">
</li>
Aber was mir nicht gefällt ist, dass die Kurve bei "Außentemperatur", optisch noch hinten wegfällt!
Ps.: Damit die Zacken deutlicher sind, müsste die Linie ggf. dünner sein, oder?
Aber das ist ja jetzt erst der Anfang vom widget-simplechart. Ich bin mir sicher das hier noch das ein oder andere nachkommt :)
Zitat von: bendim am 11 Juni 2015, 20:59:55
Danke Nobby1805.
Verwende jetzt 4:LaCr.Thermo03.*:0: und in der Konsole kommt auch das an.
Parameter
get FileLog_LaCr.Thermo03 LaCr.Thermo03-2015.log - 2015-06-11_00:00:00 2015-06-12_00:00:00 4:LaCr.Thermo03
.*:0:
Antwort
...
2015-06-11_20:25:02 21.7
2015-06-11_20:30:02 21.5
2015-06-11_20:34:08 21.4
2015-06-11_20:42:00 21.2
2015-06-11_20:46:27 21.1
2015-06-11_20:49:51 21.1
#4:LaCr.Thermo03.*:0:
Aber es wird kein Diagramm angezeigt.
<li data-row="1" data-col="1" data-sizex="4" data-sizey="2">
<header>CHARTS</header>
<div data-type="simplechart"
data-logdevice="FileLog_LaCr.Thermo03"
data-logfile="LaCr.Thermo03-2015.log"
data-columnspec="4:LaCr.Thermo03.*:0:"
data-minvalue="10"
data-maxvalue="30"
data-yticks="4"
data-daysago="0"
data-caption="Wohnzimmer" class="inline cell top-space-2x">
</div>
</li>
Hab das Problem gefunden. Es liegt an Firefox am Mac. Im Safari und Chrome wird das Diagramm angezeigt.
echt? Also mein erster Versuch war auch ein LaCrosse-File. Da hatte ich auch die Probleme. Nachdem ich dann erstmal andere verwendet habe, funktionierte es dann auch! Beim Versuch mit LCrosse hatte ich mir das nie auf dem Android-Tablet angeschaut.
@Viewgener,
Einbau hat auf Anhieb geklappt. Leider zeigt der Slider geschlossen an, wenn die Jalousie offen ist. Reicht es, wenn ich Data-min auf 100 und data-max auf 0 setze, um die Richtung zu drehen?
Noch ne Anfängerfrage: Wenn ich meine eg.html ändere, muss ich mehrmals den Raspi neu starten bis irgendwann einmal meine Änderungen tatsächlich in der Web-Oberfläche angezeigt werden. Habe keine Systematik gefunden, wann es soweit ist und ändere deswegen immer einen Text mit, damit ich sehe wann tatsächlich das aktualisierte Programm geladen wurde. Als ich die Oberfläche erstellt hatte, lief FHEM noch auf der Fritzbox. Da war das nicht so und die Änderungen wurden sofort beim Neuaufruf der Oberfläche angezeigt.
Kennt jemand das Problem oder wie erzwingt Ihr eine Aktualisierung, wenn ihr eine Änderung gemacht habt.
Gruß Jürgen
Das mit der fehlenden Texten bei Simplechart habe ich gelöst, das sollte jetzt bei jedem Browser funktionieren.
Bei data-columnspec habt ihr Recht, das 'int' liefert nur die Ganzzahlen. Wenn man es weglässt, zappelt der Graph etwas mehr.
data-logfile kann man auch weglassen, dann greift der Defaultwert "-". Damit wird das neuste Logfile gelesen.
<div data-type="simplechart"
data-logdevice="FileLog_KuecheHeizung"
data-columnspec="4:meas.*:1"
data-minvalue="12"
data-maxvalue="30"
data-width="250px"
data-height="120px"
data-yticks="6"
data-daysago="2"
data-caption="Küche" class="inline cell top-space-2x">
caption und X-Beschriftung ist jetzt vorhanden :)
ZitatDas mit der fehlenden Texten bei Simplechart habe ich gelöst, das sollte jetzt bei jedem Browser funktionieren.
Bei data-columnspec habt ihr Recht, das 'int' liefert nur die Ganzzahlen. Wenn man es weglässt, zappelt der Graph etwas mehr.
data-logfile kann man auch weglassen, dann greift der Defaultwert "-". Damit wird das neuste Logfile gelesen.
Kann ich alles bestätigen! Läuft nun auch auf dem Mac unterm Safari und Firefox!
Zitat von: mw_fhem am 28 Mai 2015, 10:50:00
Ich brauche den Link in der fhem-Oberfläche links oben eigentlich nicht. Mir reicht es, das UI über die Adresszeile einzugeben. Der Aufruf http://<IP>:8083/fehm/tablet/home_eg.html hatte bis vorgestern immer funktioniert.
Ich verwende das Widget pagetab nur wegen des "sanften" Übergangs (vorher hatte ich das Button-Widget benutzt). Mein UI besteht aus einzelnen Seiten, die ich mit pagetab untereinander aufrufe. Also ohne template-Funktion. Also brauche ich den "Umweg" über index.html und menu.html wie update71 gepostet hat nicht!? Oder doch?
Wir sollten das auf jeden Fall mal klären und ausfürhlich im Wiki erklären! Ich helfe natürlich gerne mein dokumentieren!
Ich stehe hier auch auf dem Schlauch, kann vielleicht nochmals jemand zusammenfassend erklären wie das pagetab widget korrekt angewendet wird.
Danke!
@bmwfan ich starte FHEM nur neu. Danach werden die Änderungen angezeigt.
shutdown+restart
in das Eingabefeld/Komando Feld eingeben und Enter.
Hallo, ich bin jetzt gerade dabei, mein eigenes Tablet UI zusammenzubauen. Dabei möchte ich z.B. die Icon-Vordergrundfarbe immer weiß haben. Soweit ich das sehe, wird es in jedem einzelnen div mit data-on-color gesetzt, z.B. Home-Button mit fa-home.
Schöner fände ich es, wenn ich das zentral ändern könnte, entweder als neue Standardwerte oder alternativ auch als (neue) Klasse. Die Standards scheinen allerdings nur in den js-Dateien gesetzt zu werden, die man wahrscheinlich nicht editieren sollte.
Wie setze ich das am besten um?
Hallo nojo0812,
Schaue dir mal im github unter examples mobil2.html an.
Da habe ich erste Versuche in Richtung anderes Theme gemacht.
Dabei wird zusätzlich eine
<link rel="stylesheet" href="/fhem/tablet/css/fhem-mobil-ui.css"
eingebunden. Darin sind die Standards überschrieben. Es sind aber noch nicht alle Widget dahingehend erweitert worden.
Zitat von: Haecksler am 11 Juni 2015, 22:23:19
Ich stehe hier auch auf dem Schlauch, kann vielleicht nochmals jemand zusammenfassend erklären wie das pagetab widget korrekt angewendet wird.
Danke!
Hallo Haecksler,
hier nochmal ein bisschen Erklärung und auch 3 Beispieldateien etwas ausgedünnt aus meiner Installation:
index.html ist die Basis-Seite,die auch als erste geladen wird. Diese enthält aber selbst keine speziellen widgets (ausser den pagetabs --> per Verweis auf menu.templ). Dafür ist index.html die einzige Seite, die alle includes für javascript und css enthält.
Achtung: Ich habe in meiner Index.html ein paar Anpassungen z.B: für Gridster gemacht, die so vermutlich bei anderen nicht passen.
menu.templ enthält nur die pagetabs und ist als template angelegt, da bei mir alle verschiedenen Detailseiten daselbe Menu haben und ich dann nur die eine Zeile
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
in jeder Datei brauche um das Menu ganz links in Breite 1 über die ganze Höhe zu nutzen.
room_home.html ist eine sehr einfache Beispielseite für einen pagetab, der über Auswahl im Menu geladen wird und die gesamte Seite ersetzt. Hier sollte das Menu (also die pagetabs enthalten sein) und die Widgets für die entsprechende Seite. Es wird aber kein Include für JS und css benötigt. Die Seite besteht eigentlich nur aus den widgets im Gridster.
Hoffe das hilft, bei Fragen einfach melden, ich habe das nämlich gerade nur mal schnell zusammengestellt,
Johannes
Hallo zusammen,
zu den simplecharts habe ich auch noch eine Frage.
Ich versuche mit der Tablet UI eine Anzeige auf einem kleinen Display direkt am Raspberry zu realisieren, als Browser läuft dort Kweb und Midori und die Diagramme werden nicht angezeigt, siehe angehängtes Bild
Betrachte ich die gleiche Seite am PC mit Firefox wird alle korrekt dargestellt. Woran kann das liegen, ist das ein Browserprobelm?
Die Definition ist folgende:
<li data-row="2" data-col="2" data-sizex="3" data-sizey="1">
<div data-type="simplechart"
data-logdevice="FileLog_fht"
data-logfile="-"
data-columnspec="4:fht.measured-temp:1"
data-minvalue="15"
data-maxvalue="25"
data-yticks="2"
data-daysago="0"
data-caption="Temp."
class="fullsize">
</div>
</li>
Ich bin für jeden Hinweis dankbar.
Gruß
Gerald
Hallo,
großen Dank an die Entwickler von Tablet UI.
Ich habe ein Anfänger Tutorial geschrieben wie man FHEM Tablet UI Installiert/Einrichtet. Weitere werden folgen.
http://www.benjaminroesner.com/blog/fhem-tablet-ui-1/ (http://www.benjaminroesner.com/blog/fhem-tablet-ui-1/)
Hallo Bejamin,
super Sache, das!!!
Gefällt mir sehr gut, besonders das Titelbild. Sieht sehr professionell aus.
Danke fürs Tutorial.
Noch einmal hallo,
ich habe den Tag über noch ein wenig experimentiert: mein in unten genanntem Post beschriebenes Problem ist ein Browserproblem.
Ich habe zum einen auf einem Linux Pc ebenfalls Midori installiert und auch dort werden die Grafiken dann nicht dargestellt.
Ferner habe ich auf dem Raspberry Chromium installiert und siehe da, die Grafiken werden korrekt angezeigt.
Es gibt also wohl noch eine Einschränkung bei den simplecharts was die möglcihen Browser angeht.
Gruß
Gerald
Zitat von: kleing am 14 Juni 2015, 11:03:00
Hallo zusammen,
zu den simplecharts habe ich auch noch eine Frage.
Ich versuche mit der Tablet UI eine Anzeige auf einem kleinen Display direkt am Raspberry zu realisieren, als Browser läuft dort Kweb und Midori und die Diagramme werden nicht angezeigt, siehe angehängtes Bild
Betrachte ich die gleiche Seite am PC mit Firefox wird alle korrekt dargestellt. Woran kann das liegen, ist das ein Browserprobelm?
Die Definition ist folgende:
<li data-row="2" data-col="2" data-sizex="3" data-sizey="1">
<div data-type="simplechart"
data-logdevice="FileLog_fht"
data-logfile="-"
data-columnspec="4:fht.measured-temp:1"
data-minvalue="15"
data-maxvalue="25"
data-yticks="2"
data-daysago="0"
data-caption="Temp."
class="fullsize">
</div>
</li>
Ich bin für jeden Hinweis dankbar.
Gruß
Gerald
Hallo Gerald,
Danke für den Hinweis. Das werde ich mir heute Abend mal ansehen.
Das Simplechart Widget sieht sehr schön aus.
Ist es auch möglich es mit einem DBLog zu versorgen?
Ich denke mal, neben simplechart wird es bald auch ein komplexchart geben, oder?
Das wäre für meine Wetterstation sehr gut. Damit man neben Temperatur auch Luftfeuchtigkeit, Niederschlag etc einblenden kann. :D
@benjamin: TOP! Toller blog!
Zitat von: setstate am 13 Juni 2015, 14:21:40
Schaue dir mal im github unter examples mobil2.html an.
Da habe ich erste Versuche in Richtung anderes Theme gemacht.
Danke, werde ich machen.
Momentan knabbere ich gerade stark an einem Switch für den Anwesenheitsstatus.
home.Status ist ein Dummy mit den möglichen Werten [1-4]. Zur Darstellung orientiere ich mich an http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Beispiel_switch, d.h. eine Gruppe von vier Schaltern für den home.Status.
<div data-type="switch" data-device="home.Status"
data-get-off="!1"
data-get-on="1"
data-icon="fa-home"
class="cell" >
</div>
<div data-type="label" class="cell">Zuhause</div>
<div data-type="switch" data-device="home.Status"
data-get-off="!2"
data-get-on="2"
data-set-on="2"
data-icon="fa-bed"
class="cell" >
</div>
<div data-type="label" class="cell">Schlafen</div>
[...]
Wenn jetzt z.B. home.Status = 1 ist und ich auf den zweiten Schalter klicke, wird der Befehl "set home.Status" (d.h. ohne <value>) abgesetzt und hinterher sind sowohl Schalter 1 und 2 optisch on, der home.Status ist weiterhin 1. Ein zusätzliches data-set-on="2" macht keinen Unterschied.
Nach viel Rumprobieren habe ich mal data-set-on="on" probiert, und siehe da, jetzt wird der Befehl "set home.Status on" abgesetzt.
Warum funktioniert data-set-on nur mit "on"? In diesem Fall wäre der Parameter doch überflüssig. Und wie bekomme ich das in meinem Fall zum Laufen?
upps, das war ein Bug.
Mit dem data-get-on mit einem reinen Zahlenwert gab es Probleme, Strings funktionieren.
Nach dem Update geht jetzt auch dein Code, aber ein Problem sehe ich noch.
Die beabsichtigte Negation kann so nicht klappen. Entweder man nimmt einen RegEx Ausdruck
data-get-off="((?!Wert1).)*"
Das bedeutet: alle außer 'Wert1'
Eine built-in Funktion gibt es aber doch, die muss aber so aussehen
data-get-off='!on'
Das bedeutet: alles aber nicht der Wert, der bei data-get-on definiert ist. Eine falsche Interpretation ist: nicht der Wert 'on'
So sollte es klappen:
<div data-type="switch" data-device="home.Status"
data-get-off='!on'
data-get-on='1'
data-icon="fa-home"
class="cell" >
</div>
<div data-type="label" class="cell">Zuhause</div>
<div data-type="switch" data-device="home.Status"
data-get-off='!on'
data-get-on='2'
data-icon="fa-bed"
class="cell" >
</div>
Zitat von: uniqueck am 14 Juni 2015, 18:28:58
Das Simplechart Widget sieht sehr schön aus.
Ist es auch möglich es mit einem DBLog zu versorgen?
Gleich Frage hier: http://forum.fhem.de/index.php/topic,34233.msg302515.html#msg302515
Meine Antwort ist immer noch aktuell ...
Aber kann das jemand bestätigen, ob ich da richtig liege?
Zitat von: setstate am 15 Juni 2015, 00:14:59
upps, das war ein Bug.
Mit dem data-get-on mit einem reinen Zahlenwert gab es Probleme, Strings funktionieren.
Nach dem Update geht jetzt auch dein Code, aber ein Problem sehe ich noch.
Die beabsichtigte Negation kann so nicht klappen. Entweder man nimmt einen RegEx Ausdruck
Danke für den schnellen Fix und den Hinweis, jetzt klappt alles. Ich bin begeistert von Tablet UI und dem Support!
Zitat von: viegener am 13 Juni 2015, 14:36:00
Hallo Haecksler,
hier nochmal ein bisschen Erklärung und auch 3 Beispieldateien etwas ausgedünnt aus meiner Installation:
index.html ist die Basis-Seite,die auch als erste geladen wird. Diese enthält aber selbst keine speziellen widgets (ausser den pagetabs --> per Verweis auf menu.templ). Dafür ist index.html die einzige Seite, die alle includes für javascript und css enthält.
Achtung: Ich habe in meiner Index.html ein paar Anpassungen z.B: für Gridster gemacht, die so vermutlich bei anderen nicht passen.
menu.templ enthält nur die pagetabs und ist als template angelegt, da bei mir alle verschiedenen Detailseiten daselbe Menu haben und ich dann nur die eine Zeile
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
in jeder Datei brauche um das Menu ganz links in Breite 1 über die ganze Höhe zu nutzen.
room_home.html ist eine sehr einfache Beispielseite für einen pagetab, der über Auswahl im Menu geladen wird und die gesamte Seite ersetzt. Hier sollte das Menu (also die pagetabs enthalten sein) und die Widgets für die entsprechende Seite. Es wird aber kein Include für JS und css benötigt. Die Seite besteht eigentlich nur aus den widgets im Gridster.
Hoffe das hilft, bei Fragen einfach melden, ich habe das nämlich gerade nur mal schnell zusammengestellt,
Johannes
Hallo viegener,
Danke das klappt soweit ganz gut.
Ist es vielleicht noch möglich für pagetab die Klassen "large" und "big" einzuführen?
Ich finde einfach die normale größe zu klein und "bigger" ist zu groß. ::)
Gruß,
Haecksler
Hallo zusammen,
habe nochmals ein kleines Problem.
Ich habe von viegener die Rolladensteuerung mit Slider und Triplebox übernommen.
Leider bokomme ich die Triplebox nicht zentriert, habe schon alle möglichen varianten getestet. Try and Error.. blieb leider beim Error...vielleicht kann mir ja jemand helfen.
Hier mein Code wie er im Augenblick ist:
<header>Schlafzimmer</header>
<div class="centered cell">
<div data-type="label" class="">Jalousie</div>
<div data-type="slider" data-device='Jalousie_Schlafzimmer_EG' data-get="STATE" data-min="0" data-max="100" data-on='(ZU|0)' data-off='(AUF|100)' data-value=true class="small negated"></div>
<div class="triplebox-v top-space-2x">
<div data-type="push" data-device="Jalousie_Schlafzimmer_EG" data-icon="fa-chevron-up" data-background-icon="fa-square-o" data-set="AUF" class=""></div>
<div data-type="push" data-device="Jalousie_Schlafzimmer_EG" data-icon="fa-minus" data-background-icon="fa-square-o" data-set="STOP" class=""></div>
<div data-type="push" data-device="Jalousie_Schlafzimmer_EG" data-icon="fa-chevron-down" data-background-icon="fa-square-o" data-set="ZU" class=""></div>
</div>
</div>
Und ein Screenshot vom Ergebnis findet ihr im Anhang.
Danke!
So klappt das
<li data-row="4" data-col="4" data-sizex="1" data-sizey="8">
<header>Schlafzimmer</header>
<div data-type="label" class="">Jalousie</div>
<div data-type="slider" data-device='Jalousie_Schlafzimmer_EG' data-get="STATE" data-min="0" data-max="100" data-on='(ZU|0)' data-off='(AUF|100)' data-value=true class="small negated"></div>
<div class="triplebox-v top-space-2x centered">
<div data-type="push" data-device="Jalousie_Schlafzimmer_EG" data-icon="fa-chevron-up" data-background-icon="fa-square-o" data-set="AUF" class=""></div>
<div data-type="push" data-device="Jalousie_Schlafzimmer_EG" data-icon="fa-minus" data-background-icon="fa-square-o" data-set="STOP" class=""></div>
<div data-type="push" data-device="Jalousie_Schlafzimmer_EG" data-icon="fa-chevron-down" data-background-icon="fa-square-o" data-set="ZU" class=""></div>
</div>
</li>
Aber nur mit einer kleinen Optimierung in der fhem-tablelt-ui.css (Zeile 244) -> ist im Update jetzt mit dabei
.gridster > * {
margin:0;
padding:0;
}
Zitat von: setstate am 16 Juni 2015, 00:00:41
So klappt das
...
Aber nur mit einer kleinen Optimierung in der fhem-tablelt-ui.css (Zeile 244) -> ist im Update jetzt mit dabei
.gridster > * {
margin:0;
padding:0;
}
Das muss ich doch glatt bei mir noch mal schauen, denn ich hatte auch einige Schwierigkeiten die Teile einigermassen ausgerichtet zu bekommen.
Danke,
Johannes
Hallo zusammen,
ich würde gerne eine Seite der FTUI als "Fernbedienung" auf dem Mobil/Phablet nutzen um den TV zu steuern. Lautstärke/ Ein/aus / Programmwechsel.
Ich stelle mir vor statt den Zahlen 1 bis 9 die Icons der Programme auf dem Display zu haben. Dies bekomme ich hin mit dem Widget Image, nur ist meine Frage wie ich diesem Widget eine Funktion zuweisen kann, z.b. ein Kreis drüberlegen, welcher dann auf dieses Programm umschaltet.
Ich werde mal im Laufe des Tages mal ein erstes Bild zeigen, wie weit ich bin!
Hallo hyper2910,
Da kannst du mit <img> und onClick="setFhemStatus ... arbeiten
Björn hat damit schon eine FB gebaut. Vllt. kannst du hiervon einiges abschauen.
http://forum.fhem.de/index.php/topic,34233.msg296147.html#msg296147
Ich habe mal eine Frage, bzw. ein Anliegen.
Ich habe mir überlegt, das ich gerne einen RasPi zusammen mit einem Monitor und dem TabletUi als Anzeige benutzen möchte. Bedienbar soll das Ganze eigentlich nicht sein (vielleicht wäre VNC eine Option). Ich hatte mir nur überlegt, ob es möglich wäre, das ich das TabletUi öffne und es dann automatisch alle x Sekunden in die nächste Ansicht wechselt. Geht das vielleicht jetzt schon? Und falls ja, wie?
Danke schon mal!
Gesendet von meinem HTC One mit Tapatalk
Zitat von: bmwfan am 11 Juni 2015, 21:36:42
Einbau hat auf Anhieb geklappt. Leider zeigt der Slider geschlossen an, wenn die Jalousie offen ist. Reicht es, wenn ich Data-min auf 100 und data-max auf 0 setze, um die Richtung zu drehen?
Hallo bjoernbo,
hast du das Problem gelöst? Habe nämlich das gleiche Problem, du verwendest wohl auch Homematic. Wenn ich data-min auf 100 und data-max auf 0 setze geht der slider nicht mehr :-\.
Gibt es eine Lösung?
Gruß,
Haecklser
Du hast aber auch class="small negated"
definiert! Damit verläuft der Slider von oben nach unten.
Ohne "negated" von unten nach oben.
Zitat von: selfarian am 16 Juni 2015, 10:33:13
das ich das TabletUi öffne und es dann automatisch alle x Sekunden in die nächste Ansicht wechselt. Geht das vielleicht jetzt schon? Und falls ja, wie?
Das kannst du mit standard Webtechniken lösen. zB der Meta-Tag "refresh":
<META http-equiv="refresh" content="5;URL=seite2.html">Würde nach 5 sekunden auf seite2.html umleiten. Detail dazu zB unter http://wiki.selfhtml.org/wiki/HTML/Kopfdaten/meta
Zitat von: bjoernbo am 20 Mai 2015, 06:09:42
Meine Frau ist begeistert und somit werde ich in kürze noch eine "Smartphone-Varinate" erstellen. Den Code stelle ich gerne zur Verfügung:
Hi,
das sieht richtig klasse aus, hast du auch die SmarthomeVariante schon erstellt?
Desweiteren wäre es schön, wenn du dein Font1 mir noch senden kannst!
Muss ich eigentlich noch etwas für Onclick ändern?
scheint bei mir keine Funktion zu haben:
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>2</header>
<img src="img/senderlogos/ZDF-HD.png" class="top-space" onclick="setFhemStatus('set SATReceiver channel ZDF')"></img>Gruss Dirk
Zitat von: setstate am 16 Juni 2015, 12:15:33
Du hast aber auch class="small negated"
definiert! Damit verläuft der Slider von oben nach unten.
Ohne "negated" von unten nach oben.
Ja ich weiß.
Aber bei HM ist pct 100 wenn der Rolladen auf ist, d.h. wenn der Slider (Rolladen) oben ist habe ich 100 und wenn der Slider unten ist 0.
Daher sollte data-min="100" sein und data-max="0", dies funktioniert aber leider nicht :'(.
Hallo zusammen,
ich probiere immer noch neue Anzeigen mit dem Simplechart aus. So habe ich mit folgendem Code versucht den Regenverlauf meines KS300 Sensors über 2 Tage darzustellen.
<div data-type="simplechart"
data-logdevice="FileLog_KS300"
data-logfile="-"
data-columnspec="10:KS300.*:1:delta-h"
data-minvalue="0"
data-maxvalue="10"
data-yticks="1"
data-daysago="1"
data-caption="Regen l/h"
class="cell">
</div>
Das Ergebnis (siehe Bild) verwundert mich ein wenig, ich hätte einen steileren Anstieg (binnen einer Stunde) erwartet wenn es zu Regnen beginnt , nicht aber einen recht "flachen" Amstieg über, so wie es aussieht mehrere Stunden). Gibt es eine Möglichkeit sich die exakten X-Werte die Simplechart zur Darstellung nutzt anzuzeigen (eventuell das zugehörige ARRAY o.ä.)?
Ich weiss, eine Liniengrafik ist hier nicht die erste Wahl, besser wäre ein Balkendiagramm, aber sei es drum.
Als zweite Frage (die sicher schon gestellt wurde, ich aber keine Antwort finde), gibt es eine Möglickeit eine Einteilung der X-Achse anzuzeigen, also etwa eine senkrechte Linie wenn der Tag wechselt?
Vielen Dank im Voraus.
Gruß
Gerald
Lege ein SVG-Plot mit den gleichen Werten an und vergleiche den Kurvenverlauf. Hier steht wie's geht: http://www.fhemwiki.de/wiki/Plots_erzeugen
Zitat von: nesges am 16 Juni 2015, 17:42:54
Lege ein SVG-Plot mit den gleichen Werten an und vergleiche den Kurvenverlauf. Hier steht wie's geht: http://www.fhemwiki.de/wiki/Plots_erzeugen
Hallo,
habe ich gemacht, und versucht einigermassen gleich zu skallieren (siehe Bild). Also Meiner Meinung nach ist der Anstieg beim SVG Plot zum Maximum eindeutig steiler als beim Simplechart (und so hätte ich es auch erwartet).
Gruß
Gerald
Eine Verbesserung bei der x-Achse ist unterwegs. Heute Abend vielleicht.
Und ganz krass wird es wenn ich den Zeitraum um einen weitern Tag verlängere: da ging es wirklich von 0 auf 10 binnen zwei Stunden, so wie im SVG dargestellt.
Gruß
Gerald
Zitat von: setstate am 15 Juni 2015, 00:21:58
Gleich Frage hier: http://forum.fhem.de/index.php/topic,34233.msg302515.html#msg302515
Meine Antwort ist immer noch aktuell ...
Aber kann das jemand bestätigen, ob ich da richtig liege?
<li data-row="4" data-col="4" data-sizex="4" data-sizey="2">
<header>Heizung Wohnzimmer Chart</header>
<div data-type="simplechart"
data-logdevice="myDbLog"
data-logfile="history"
data-columnspec="wz_hz_Cima:measured-temp"
data-caption="Heizung Stube"
class="cell">
</div>
</li>
das geht schonmal nicht. wie müsste eine definition aussehen?
des weiteren (habe lange nichts an der ui geändert) muss ich neuerdings bei jeder änderung an der seite den browsercache löschen damit tablet-ui neue inhalte dann auch mal anzeigt. muss das so? sicher nicht, oder?
Wie versprochen ist das Update für das Simplechart Widget (Linien der X-Achse) jetzt bei Github zu finden.
Man kann jetzt auch die x-ticks (in Minuten) beeinflussen. Default sind 360min (6h)
Wenn man data-caption weg lässt, wird der Platz vom Chart genutzt .
<div data-type="simplechart"
data-logdevice="FileLog_WohnzimmerHeizung2"
data-columnspec="4:meas.*"
data-width="250px"
data-height="120px"
data-caption="Wohnzimmer" class="inline cell">
</div>
<div data-type="simplechart"
data-logdevice="FileLog_KuecheHeizung"
data-columnspec="4:meas.*"
data-minvalue="10"
data-maxvalue="30"
data-width="250px"
data-height="120px"
data-yticks="4"
data-xticks="1440"
data-daysago="4"
class="inline cell">
</div>
Zitat von: setstate am 15 Juni 2015, 00:21:58
Gleich Frage hier: http://forum.fhem.de/index.php/topic,34233.msg302515.html#msg302515
Meine Antwort ist immer noch aktuell ...
Aber kann das jemand bestätigen, ob ich da richtig liege?
DBLog funktioniert problemlos
Meine Definition als beispiel (TC_LP ist mein Logproxy, OF_Wandthermostat ist der Wandthermostat im Büro):
<div data-type="simplechart"
data-logdevice="TC_LP"
data-logfile="CURRENT"
data-columnspec="DbLog:myDbLog:OF_Wandthermostat:temperature"
data-minvalue="15"
data-maxvalue="30"
data-yticks="2"
data-daysago="0"
data-caption="Temp."
class="fullsize">
</div> Läuft. Und ja das Büro war heute vollgas in der Sonne ;)
Im Anhang habe ich noch die Screenshots beigefügt - einmal von FHEM und einmal simplechart zum Vergleich.
Edit: Ich habe es so gemacht: Plot in FHEM angeschaut, dann unten auf "Show preprocessed Output" geklickt und dort stand sowas:
get TC_LP CURRENT INT 2015-06-16_00:00:00 2015-06-17_00:00:01 DbLog:myDbLog:OF_Wandthermostat:temperatureIn der commandref sah das filelog etwa so aus:
get outlog out-2008.log - 2008-01-01 2008-01-08 4:IR:int: 9:IR:: daher hatte ich darauf geschossen, dass ich das logfile einfach als "CURRENT" bezeichne und dann läufts ;)
Zitat von: Nobby1805 am 11 Juni 2015, 20:43:59
Für die y-Ticks habe ich die Skalierung hinbekommen ... // 'style':'stroke:#555;stroke-width:1px',
'style':'stroke:#555;stroke-width:'+(max-min)/200+'px',
aber bei den Kurven klappt das nicht weil ich es irgendwie nicht schaffe auf max und min zuzugreifen :(
@setstate: hast du mal überlegt diese Änderung als Fix für den IE zu übernehmen ?
und hast du evt. auch eine Lösung für die Kurven ?
Ich muss leider jedesmal nach dem update auf deine neuen Versionen die Anpassung wieder on Hand nachziehen ;)
Zitat von: Haecksler am 16 Juni 2015, 14:23:13
Ja ich weiß.
Aber bei HM ist pct 100 wenn der Rolladen auf ist, d.h. wenn der Slider (Rolladen) oben ist habe ich 100 und wenn der Slider unten ist 0.
Daher sollte data-min="100" sein und data-max="0", dies funktioniert aber leider nicht :'(.
Ich verstehe leider dein Problem nicht.
Der Default Slider hat, wenn der Knopf unten ist den Wert 0 und oben 100. Die Variante mit class="negated" hat unten Wert 100 und oben 0. Was gibt es noch?
Bei den Farben Orange / Grau ist es Ansichtssache, was oben und was unten sein soll. Eine schöne Erklärung beim Default Slider ist: "Wenn ich auf 20% stelle, habe ich unten nur noch ein einen kleinen Spalt, wo Sonne (Orange) reinkommt, oben ist schon alles dunkel. Kein Licht kommt mehr rein"
Zitat von: Nobby1805 am 16 Juni 2015, 22:58:59
@setstate: hast du mal überlegt diese Änderung als Fix für den IE zu übernehmen ?
und hast du evt. auch eine Lösung für die Kurven ?
Ich muss leider jedesmal nach dem update auf deine neuen Versionen die Anpassung wieder on Hand nachziehen ;)
Okay, ich ändere jetzt die Linienbreite abhängig davon, ob vectorEffect verfügbar ist oder nicht. Ist aber noch nicht veröffentlicht. Ich will morgen nochmal drüber schauen ...
Zitat von: setstate am 16 Juni 2015, 23:11:46
Ich verstehe leider dein Problem nicht.
Der Default Slider hat, wenn der Knopf unten ist den Wert 0 und oben 100. Die Variante mit class="negated" hat unten Wert 100 und oben 0. Was gibt es noch?
Bei den Farben Orange / Grau ist es Ansichtssache, was oben und was unten sein soll. Eine schöne Erklärung beim Default Slider ist: "Wenn ich auf 20% stelle, habe ich unten nur noch ein einen kleinen Spalt, wo Sonne (Orange) reinkommt, oben ist schon alles dunkel. Kein Licht kommt mehr rein"
Wollte eigentlich Orange haben wenn der Rollo zu ist, aber dein "Licht" argument hat mich überzeugt :D . Danke!
so jetzt habe ich mich endlich auch mal mit der Widget Erstellung befasst.
Mir gefiel hier im Forum auch die simpleClock.
Da ich nicht nur die Url einbinden wollte, habe ich mich mal an ein Widget gewagt.
Hierbei habe ich mir nesges widget_clock als Vorlage genommen ;-)
Leider war ich mir nicht sicher wie ich auch davon ableiten kann und ob es auch sinnig ist. Daher habe ich ein paar Teile erst mal nur übernommen.
Folgendes ist dabei heraus gekommen.
Vielleicht kann es ja einer gebrauchen.
Bsp1.
<div data-type="simpleClock" data-date-format="l, d. F Y" data-date-color="#fff" data-time-color="#fff" data-time-bg-colors='["#555","#000"]' class="big"></div>
Bsp2.
<div data-type="simpleClock" data-date-format="l, d. F Y" data-date-color="#3f92ca" data-time-color="#fce740" data-time-bg-colors='["#2ebd13","#882200"]' class="big"></div>
Bei mir ist auf dem UI ein Hintergrundbild eingebaut und die Gridster haben eine Transparenz. Daher kann es sein, dass die Standardfarben etwas zu dunkel sein können.
Edit: widget_simpleClock leitet jetzt von widget_clock ab!
Edit: data-time-format eingebaut.
Hallo,
ich hätte da einen kleinen Änderungswunsch in dem Symbol-Widget.
Wäre es möglich, das bei der State-Auswertung auch die Zustände "Open" & "Closed" zusätzlich mit ausgewertet werden?
Bei meinen FHT80TF-2 sind die States nämlich groß geschrieben.
Oder bin ich da mit dem Widget auf dem Holzweg?
Gruß
Stefan
Zitat von: StefanW am 17 Juni 2015, 17:39:45
Hallo,
ich hätte da einen kleinen Änderungswunsch in dem Symbol-Widget.
Wäre es möglich, das bei der State-Auswertung auch die Zustände "Open" & "Closed" zusätzlich mit ausgewertet werden?
Bei meinen FHT80TF-2 sind die States nämlich groß geschrieben.
Oder bin ich da mit dem Widget auf dem Holzweg?
Gruß
Stefan
Hallo Stefan,
du kannst die Defaultwerte der Widgets überschreiben:
data-get-on="Open" data-get-off="Closed"
Zitat von: mc-hollin am 17 Juni 2015, 17:36:03Leider war ich mir nicht sicher wie ich auch davon ableiten kann und ob es auch sinnig ist. Daher habe ich ein paar Teile erst mal nur übernommen.
Vom clock-Widget konnte man tatsächlich nicht sehr sinnvoll ableiten, daher habe ich die init-Funktion grade verschlankt und die Hauptaufgaben in init_datearray und init_datetext ausgelagert. Du könntest jetzt folgendermassen "ableiten" (JS kann nicht wirklich ableiten, es ist eher ein "mergen"):
if (typeof widget_clock == 'undefined') {
loadplugin('widget_clock');
}
var widget_simpleClock = $.extend({}, widget_clock, {Damit stehen dir die beiden neuen Funktionen zur Verfügung. Der Rest ergibt sich sicher aus dem Code (https://github.com/nesges/Widgets-for-fhem-tablet-ui/blob/master/www/tablet/js/widget_clock.js) :-)
@nesges oder eher "Flash" ;D
super. Werde ich morgen mal mit rumspielen.
Vielleicht hast du gesehen, dass ich auch die Funktionalität für die Kalenderwoche eingebaut habe.
Eventuell macht es ja mehr Sinn, wenn du diese übernimmst.
Falls diese so OK ist und auch funktioniert.
Hatte ich nicht gesehen, ist aber sinnvoll das zu übernehmen (hab ich dann jetzt auch). Danke!
Hallo setstate,
vielen Dank für die Anpassungen am simplechart, allerdings bin ich gerade mit meinem Latein am Ende.
Ich habe die Tablet Ui upgedated (und den FHEM Server neu gestartet) und aus meinen ehemals drei vollständig angezeigten Grafiken kommt beiliegendes Bild raus.
Die erste Grafik wird korrekt dargestellt, die zweite fehlt bis auf Caption und X Achsenbeschriftung und bei der dritten fehlt die Messkurve.
Wo mache ich den Fehler????
Anbei noch die Definitionen:
<header>GRAFIKEN</header>
<div data-type="simplechart"
data-logdevice="FileLog_KS300"
data-logfile="-"
data-columnspec="4:KS300.*:1"
data-minvalue="-25"
data-maxvalue="35"
data-width="220"
data-height="150"
data-yticks="5"
data-xticks="720"
data-daysago="1"
data-caption="Aussentemperatur"
class="cell">
</div>
<div data-type="simplechart"
data-logdevice="FileLog_KS300"
data-logfile="-"
data-columnspec="10:KS300.*:1:delta-h"
data-minvalue="0"
data-maxvalue="10"
data-width="220"
data-height="150"
data-yticks="1"
data-xticks="720"
data-daysago="1"
data-caption="Regen l/h"
class="cell">
</div>
<div data-type="simplechart"
data-logdevice="FileLog_KS300"
data-logfile="-"
data-columnspec="8:KS300.*:1"
data-minvalue="0"
data-maxvalue="100"
data-width="220"
data-height="150"
data-yticks="10"
data-xticks="720"
data-daysago="1"
data-caption="Wind"
class="cell">
</div>
Vielen Dank,
Gruß
Gerald
Hallo nesges,
kannst du mal im widget_clock.init_datetext schauen ob folgender Code auch funktionieren würde?
for (var l = 0; l < datearr.length; l++) {
if (!(d[datearr[l]] == null)) {datearr[l] = d[datearr[l]];};
}
Hatte den so bei mir im Einsatz und das schien zu laufen.
Hierdurch hatte ich den 2. Schleifendurschlauf gespart.
Oder mache ich da einen Fehler?
Zum Verständnis:
Wie verhält es sich mit der Zeile? base = this;
Wird hier alles gehalten oder nur das Basis Objekt (bei mir dein widget_clock)?
Ich denke doch alles .
Wenn ich das init_attr deiner Klasse auch aufrufen will, mache ich das dann mit ?widget_clock.init_attr($(this));
Da ich das ja am Anfang geladen habe.
Edit: widget_simpleClock leitet jetzt von widget_clock ab und scheint auch zu funktionieren.
Hallo Gerald,
du machst nix falsch, ich muss da noch einigen optimieren, dass das für alle Bereich besser passt.
Update folgt.
wo du dabei bist... schau dir mal meinen Temperaturverlauf an. Die Darstellung ist so nicht richtig, obwohl ich eindeutige Werte habe.
Vielen Dank für das schöne Uhrzeit Widget.
Zitat von: mc-hollin am 17 Juni 2015, 17:36:03
so jetzt habe ich mich endlich auch mal mit der Widget Erstellung befasst.
Mir gefiel hier im Forum auch die simpleClock.
Da ich nicht nur die Url einbinden wollte, habe ich mich mal an ein Widget gewagt.
Hierbei habe ich mir nesges widget_clock als Vorlage genommen ;-)
Leider war ich mir nicht sicher wie ich auch davon ableiten kann und ob es auch sinnig ist. Daher habe ich ein paar Teile erst mal nur übernommen.
Folgendes ist dabei heraus gekommen.
Vielleicht kann es ja einer gebrauchen.
Bsp1.
<div data-type="simpleClock" data-date-format="l, d. F Y" data-date-color="#fff" data-time-color="#fff" data-time-bg-colors='["#555","#000"]' class="big"></div>
Bsp2.
<div data-type="simpleClock" data-date-format="l, d. F Y" data-date-color="#3f92ca" data-time-color="#fce740" data-time-bg-colors='["#2ebd13","#882200"]' class="big"></div>
Bei mir ist auf dem UI ein Hintergrundbild eingebaut und die Gridster haben eine Transparenz. Daher kann es sein, dass die Standardfarben etwas zu dunkel sein können.
Edit: widget_simpleClock leitet jetzt von widget_clock ab!
Moin, is ja so ruhig hier in letzter Zeit :)
Hab ich irgendwas nicht mitbekommen oder warum bringt der Code hier keinen ablaufenden Kreis mehr?
<div data-type="push" class="cell bigger" data-device="HWR_Zirkulation" data-set="on-for-timer 300"></div>
Schaltet wie es soll aber der ablaufende Kreis is wech :( ... das ging mal. Ich weis jetzt aber nicht wie lange es schon nicht mehr funktioniert. Hab das erst wieder ausgekramt.
UI ist aktuell.
Gruß Thomas
Zitat von: kleing am 17 Juni 2015, 20:02:06
Hallo setstate,
vielen Dank für die Anpassungen am simplechart, allerdings bin ich gerade mit meinem Latein am Ende.
Ich habe die Tablet Ui upgedated (und den FHEM Server neu gestartet) und aus meinen ehemals drei vollständig angezeigten Grafiken kommt beiliegendes Bild raus.
Die erste Grafik wird korrekt dargestellt, die zweite fehlt bis auf Caption und X Achsenbeschriftung und bei der dritten fehlt die Messkurve.
Hallo Gerald,
jetzt sind viele der Bugs aus dem simplechart gefixed. Bitte testet es jetzt nochmal. Auch das Thema mit dem falschen Anstieg müsste jetzt viel besser aussehen.
Viele Grüße
Mario
Zitat von: update71 am 18 Juni 2015, 21:05:19
Moin, is ja so ruhig hier in letzter Zeit :)
Hab ich irgendwas nicht mitbekommen oder warum bringt der Code hier keinen ablaufenden Kreis mehr?
<div data-type="push" class="cell bigger" data-device="HWR_Zirkulation" data-set="on-for-timer 300"></div>
Schaltet wie es soll aber der ablaufende Kreis is wech :( ... das ging mal. Ich weis jetzt aber nicht wie lange es schon nicht mehr funktioniert. Hab das erst wieder ausgekramt.
UI ist aktuell.
Gruß Thomas
Hallo Thomas,
"Biergartenzeit!" ... darum ist keiner mehr hier ;D
Aber du hast vollkommen Recht, beim on-for-timer war was faul. Seit 16 Tagen ging das nicht mehr. Ist jetzt gefixed. Aber bitte data-set-on benutzen, das Attribut ist für den Wert.
data-set wird für den Namen des readings benutzt, was gesetzt wird. Ist auch gerade gezogen, weil es so konsistenter ist.
<div data-type="push" class="cell bigger" data-device="HWR_Zirkulation" data-set-on="on-for-timer 300"></div>
Zitat von: hyper2910 am 16 Juni 2015, 13:59:25
Muss ich eigentlich noch etwas für Onclick ändern?
scheint bei mir keine Funktion zu haben:
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>2</header>
<img src="img/senderlogos/ZDF-HD.png" class="top-space" onclick="setFhemStatus('set SATReceiver channel ZDF')"></img>
Gruss Dirk
Probier es mal so:
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>2</header>
<img src="img/senderlogos/ZDF-HD.png" class="top-space" data-type="push" onclick="setFhemStatus('set SATReceiver channel ZDF')"></img>Ich hatte das gleiche Problem, allerdings mit data-type="button" und da hat es witzigerweise uebern Firefox aufm Laptop funktioniert, aber nicht ueber WebViewControl. Kannst ja mal probieren ;)
Bei mir klappt es auch mit
<img src="img/senderlogos/ZDF-HD.png" class="top-space" onclick="setFhemStatus('set SatReceiver channel 2')"></img>
Channel Nummer statt Name. Ich nutze das ENIGMA2 Modul ...
Hallo,
ich habe ein Problem mit dem Slider Widget und bekomme leider für
meine Jalousien nicht die richtigen Werte raus.
Das State meiner Jalousie kann on/off und dim % als State haben.
Was muss ich jetzt dazu in den Werten data-get, data-set und data-cmd schreiben, das er die richtigen Werte im Slider zurück liefert?
Danke und Gruß
Wenn wir schon einmal Rollos sind. Vieleicht kann man die Frage hier mit beantworten. Zur Zeit habe ich es so (s.u.) gelöst um die Rollos auf und ab zu steuern. Sobald ich die Tasten (Tablet) benutze fahren die Rollos und das Symbol verändern seine Farbe.
Sobald ich den Status manuell ändere (über einen HM "Wandtaster") wird dieser nicht im Tablet UI angezeigt bzw geändert. Wie bekomme ich eine ähnliche Funktion wie dei den Lampen hin. Das läuft alles super. Egal an welchen Schalter der Schaltvorgang vorgenommen wurde.
<div data-type="switch" data-device='wz_Rollade_Tuer_li'
data-icon="fa-bars"
data-background-icon="fa-circle"
data-off-color="#ff7f14"
data-on-color="#fff505"
data-get-on="on"
data-get-off="off"
class="cell">
</div>
Zitat von: idansch am 19 Juni 2015, 09:40:00
Sobald ich den Status manuell ändere (über einen HM "Wandtaster") wird dieser nicht im Tablet UI angezeigt bzw geändert. Wie bekomme ich eine ähnliche Funktion wie dei den Lampen hin. Das läuft alles super. Egal an welchen Schalter der Schaltvorgang vorgenommen wurde.
Das bedeutet meistens, dass dein Device kein Event erzeugt. Hast du schon http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an durchgearbeitet? Wenn das Ergebnis ist, dass kein Event erzeugt wird, kann FTUI nichts weiter tun. Du müsstest dich mit dem Modulautoren des Device-Moduls in Verbindung setzen.
Zitat von: nightstorm99 am 19 Juni 2015, 09:18:29
Was muss ich jetzt dazu in den Werten data-get, data-set und data-cmd schreiben, das er die richtigen Werte im Slider zurück liefert?
Schau mal in die Doku unter http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#slider. Hast du konkrete Fragen dazu?
Zitat von: nightstorm99 am 19 Juni 2015, 09:18:29
Hallo,
ich habe ein Problem mit dem Slider Widget und bekomme leider für
meine Jalousien nicht die richtigen Werte raus.
Das State meiner Jalousie kann on/off und dim % als State haben.
Was muss ich jetzt dazu in den Werten data-get, data-set und data-cmd schreiben, das er die richtigen Werte im Slider zurück liefert?
Danke und Gruß
Ich würde immer erstmal mit den Defaults anfangen und dann sehen, welche Parts überschrieben werden müssen
Default
<div data-type="slider"
data-device="dummy1">
</div>Erweiterte Parameter, zur Reagieren auf on / off States
<div data-type="slider" data-device="dummy1"
data-on='(on|closed|down)'
data-off='(open|off)' >
</div>
Zitat von: setstate am 19 Juni 2015, 11:04:44
Ich würde immer erstmal mit den Defaults anfangen und dann sehen, welche Parts überschrieben werden müssen
Default
<div data-type="slider"
data-device="dummy1">
</div>
Erweiterte Parameter, zur Reagieren auf on / off States
<div data-type="slider" data-device="dummy1"
data-on='(on|closed|down)'
data-off='(open|off)' >
</div>
Ich habe jetzt folgendes drin:
<div data-type="slider" data-device="wz.rollo.arbeit" class="horizontal" data-on="dim 99" data-off="up" data-set="dim "></div>Der Slider wird jetzt korrekt gesetzt wenn das Rollo oben und unten ist, aber leider nicht dazwischen????
Da im Reading zb. "dim 50" drin steht.
Was muss ich noch ändern?
Danke
Zitat von: nesges am 19 Juni 2015, 10:26:11
Das bedeutet meistens, dass dein Device kein Event erzeugt. Hast du schon http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an durchgearbeitet? Wenn das Ergebnis ist, dass kein Event erzeugt wird, kann FTUI nichts weiter tun. Du müsstest dich mit dem Modulautoren des Device-Moduls in Verbindung setzen.
Danke für den Tip. Es lag am eventMap on:AUF off:AB ;-)
Jetzt geht es.
Zitat von: nightstorm99 am 19 Juni 2015, 12:12:17
Der Slider wird jetzt korrekt gesetzt wenn das Rollo oben und unten ist, aber leider nicht dazwischen????
Da im Reading zb. "dim 50" drin steht.
Was muss ich noch ändern?
Hat das Device nicht auch ein Reading, was den Dim Wert als Zahl enthält ?
Das könnte man einfacher lesen/setzen, per data-get und data-set
Habe mal eine Frage.
Ich lass mir meine Keller Temperatur anzeigen mit:
<div class="">
<div data-type="label" class="cell darker left">Keller :</div>
<div data-type="label" data-device="WT.Keller" data-get="temperature" data-unit="%B0C%0A" class="cell right"></div>
<div>
Jetzt läuft im Hintergrund noch ein Script was meinen dewpoint errechnet (alle 10min) und sagt ob es sinnvoll ist zu lüften oder nicht.
Er schält set auf JA oder NEIN. Nun würd ich gerne in dieser Abhängigkeit die Farbe entweder von dem Namen Keller auf rot oder grün setzen oder eben die Farbe der Temperatur.
Das bekomme ich leider nicht hin :( hat mir da jemand einen Tipp ?
Edit: Was ich hinbekomme ist ein Icon das die Farbe entsprechend wechselt das will ich aber nicht :(
<div data-type="label" class="cell darker left" >Keller :</div>
<div class="">
<div data-type="label" class="narrow darker small">Küche</div>
<div data-type="symbol" data-device="Keller.Lueften" data-icons='["oa-fts_window_2w","oa-fts_window_2w_open"]' data-on-colors='["#fa334f","#008623"]' data-get-on='["NEIN","JA"]' class="cell"></div>
</div>
Wäre über einen Tipp sehr Dankbar !
Zitat von: setstate am 19 Juni 2015, 12:50:46
Hat das Device nicht auch ein Reading, was den Dim Wert als Zahl enthält ?
Das könnte man einfacher lesen/setzen, per data-get und data-set
Leider nicht!
Es steht immer im Format "dim ....".
Kann man dieses irgendwie umbiegen?
Das slider Widget mag nur Zahlen für den Wert. Man könnte auf Fhem Seite mit userReadings arbeiten
Ich könnte aber auch noch data-part ins Sliderwidget einbauen, so wie beim Labelwidget. Dann könnte man sich den Zahlenwert rausfiltern.
Zitat von: setstate am 19 Juni 2015, 13:22:40
Das slider Widget mag nur Zahlen für den Wert. Man könnte auf Fhem Seite mit userReadings arbeiten
Ich könnte aber auch noch data-part ins Sliderwidget einbauen, so wie beim Labelwidget. Dann könnte man sich den Zahlenwert rausfiltern.
Das wäre sehr nett, ich denke es wird noch mehr Devices geben, die dort eine Filterung brauchen.
Wenn das ganze dann noch im VOLUME Widget drin wäre, das wäre der Hammer! 8)
Ich finde diese optisch noch besser!
Danke im Voraus
Danke, funktioniert:
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>2</header>
<img src="img/senderlogos/ZDF-HD.png" class="top-space" data-type="push" onclick="setFhemStatus('set SATReceiver channel ZDF')"></img>
Gruss Dirk
Gibt es eine Möglichkeit das Icon bei Statusänderung wechseln zu lassen? Bei widget Symbol geht es. So habe ich es am laufen.
div data-type="symbol" data-device="Flur_Eingang_Tuer"
data-get-on='["open","closed"]'
data-background-icon="fa-circle"
data-on-background-color="#555"
data-icons='["ftui-door warn","ftui-door"]'
data-on-colors='["#222","#222"]'
class="cell"></div>
<div data-type="label"
class="cell">HAUS OFFEN</div>
Bei dem widget Switch ist das nicht so umsetzbar. Oder mach ich das etwas falsch?
Zitat von: setstate am 18 Juni 2015, 23:42:45
Hallo Gerald,
jetzt sind viele der Bugs aus dem simplechart gefixed. Bitte testet es jetzt nochmal. Auch das Thema mit dem falschen Anstieg müsste jetzt viel besser aussehen.
Viele Grüße
Mario
Hallo Mario,
vielen Dank, sieht viel besser aus .....
Gruß
Gerald
Zitat von: idansch am 19 Juni 2015, 15:17:08
Gibt es eine Möglichkeit das Icon bei Statusänderung wechseln zu lassen? Bei widget Symbol geht es. So habe ich es am laufen.
Das geht mit dem Multistatebutton (Siehe fhem Wiki -> fhem-Tablet-UI)
Hallo setstate,
kannst Du eine Auskunft darüber geben, ob es geplant ist, mehrere Kurven in einem plot darzustellen? Ich hatte die Frage mal vor ein paar Wochen in den Raum geworfen. Beispielsweise, dass man sie Wetterdaten wie Temperatur, Niederschlag und Luftfeuchtigkeit in einem Graph unterbringt (mi unterschiedlichen Farben).
Ich weiß das dies sicherlich einen immensen Aufwand bedeutet, von daher meine Frage nur aus Interesse ob da angedacht ist.
Gruß Björn
Zitat von: bjoernbo am 19 Juni 2015, 18:33:26
kannst Du eine Auskunft darüber geben, ob es geplant ist, mehrere Kurven in einem plot darzustellen? Ich hatte die Frage mal vor ein paar Wochen in den Raum geworfen. Beispielsweise, dass man sie Wetterdaten wie Temperatur, Niederschlag und Luftfeuchtigkeit in einem Graph unterbringt (mi unterschiedlichen Farben).
Ja, auf jeden Fall, wird es das mal geben. Aber von meiner Seite her habe ich jetzt erst einmal andere Baustellen. Ich muss endlich mal bei Playlists für MPD / Mopidy weiterkommen. Außerdem wollte ich noch einen Popup-Dialog bauen, ähnlich des Circlemenü, nur rechteckig mit beliebigem Inhalt. Man könnte damit dann ein Chart erst auf Klick als Fenster anzeigen. Oder eine Station-Submenü zum Sender umschalten mit großen Icons.
Aber vielleicht findet sich jemand hier aus der Gemeinde, der das Simplechart als Kopiervorlage nimmt und auf mehrere Graphen erweitert.
Hallo,
ich benötige auch eine Möglichkeit zur Anzeige ausgewählter Messwerte in der "Alltags"-Oberfläche.
Deshalb habe ich die von Johhanes (viegener) in Post #1829 vorgestellte Variante für mich so angepasst, dass sie in das Design passt.
Ich halte die Möglichkeiten der SVG-Plots und der vorhanden Erweiterungen (z.B. logproxy) auch für FTUI erhaltenswert. Weiterhin kommt bei mir dazu, dass ich in FHEMWEB meine "Admin"-Oberfläche mit mehr Details und Inhalt habe.
Anbei meine ersten Resultate und die Files. Ich habe Anpassungen bezüglich der verwendeten Farben für den Hintergrund der Plots und einige der Signalverläufe vorgenommen.
Dabei habe ich die Farben, welche mir "zu heftig" waren, gegen die Farben der "Konkurrenz" ausgetauscht. Ganz fertig bin ich noch nicht (das Margenta wird z.B. bei Fill noch verwendet).
Die Änderungen erfolgten direkt in den für SVG zuständigen CSS-Files und SVG-Includes der FHEM-Installation (darkstyle!)) und ist deshalb noch nicht Update-fest.
1. Veränderung des Plot-Hintergrunds (dunkelgrauer Gradient) in ..\fhem\www\pgm2\darksvg_defs.svg
Veränderung von
<linearGradient id="gr_bg" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#FFFFF7; stop-opacity:1"/>
<stop offset="100%" style="stop-color:#A7A7A7; stop-opacity:1"/>
</linearGradient>
nach
<linearGradient id="gr_bg" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#707070; stop-opacity:1"/>
<stop offset="100%" style="stop-color:#2A2A2A; stop-opacity:1"/>
</linearGradient>
Die Definition kommt durch ..\fhem\www\pgm2\svg_style.css
als
.border { stroke:black; fill:url(#gr_bg); }
in den SVG-Plots vor.
2. In ..\fhem\www\pgm2\svg_style.css sind die Farben der einzelnen Verläufe änderbar.
Grüße,
Mario
Zitat von: Mario67 am 19 Juni 2015, 21:19:01
Anbei meine ersten Resultate und die Files. Ich habe Anpassungen bezüglich der verwendeten Farben für den Hintergrund der Plots und einige der Signalverläufe vorgenommen.
Dabei habe ich die Farben, welche mir "zu heftig" waren, gegen die Farben der "Konkurrenz" ausgetauscht. Ganz fertig bin ich noch nicht (das Margenta wird z.B. bei Fill noch verwendet).
Die Änderungen erfolgten direkt in den für SVG zuständigen CSS-Files und SVG-Includes der FHEM-Installation (darkstyle!)) und ist deshalb noch nicht Update-fest.
Das gefällt mir gut, ich hatte noch gar keine Zeit so etwas anzufanen, es gibt zu viele noch offene Baustellen. Wenn Du eine Version hast, die man als Extra-css einbinden kann, wäre das super und ich ein Interessent ;D
Johannes
Apropos, könnte man den Thread nicht mal neu auflegen, inzwischen dauert das Anworten schon gefühlte 2-3 Widget-Entwicklungszeiten und laut Boardinfo, hängt das wohl stark von der Länge des Threads ab...
Johannes
Zitat von: setstate am 19 Juni 2015, 13:22:40
Das slider Widget mag nur Zahlen für den Wert. Man könnte auf Fhem Seite mit userReadings arbeiten
Ich könnte aber auch noch data-part ins Sliderwidget einbauen, so wie beim Labelwidget. Dann könnte man sich den Zahlenwert rausfiltern.
Ich habe es jetzt mit userReadings gelöst und kann jetzt auch das Volume Widget verwenden.
Im Anhang ist ein Bild wie es jetzt aus sieht.
attr <device> userReadings status {substr(Value("wz.rollo.rechts"),4) ;;}Danke nochmal
Hallo setstate,
kannst Du bitte noch folgende Änderung / Korrektur für das simpelchart-Widget einfügen.
Schau mal auf meine Hardcopy, dann weißt Du was ich meine, Bezüglich der Werte auf der y-Achse.
Anbei noch der Code:
Zitat<li data-row="5" data-col="2" data-sizex="4" data-sizey="2">
<header>Niederschlag</header>
<div data-type="simplechart"
data-logdevice="FileLog_netatmo_aussen"
data-logfile="-"
data-columnspec="4:rain:.*1"
data-minvalue="0"
data-maxvalue="1"
data-width="400px"
data-height="200px"
data-yticks="0.1"
data-daysago="1"
class="inline cell top-space-2x"
data-caption="Regenniederschalg in mm">
</li>
Danke.
(//)
Hallo ,
ich war eine Weile aus beruflichen Gründen nicht mehr in diesem Forum und muss gestehen ,es hat sich rasant entwickelt .
Ein großes Dankeschön an alle die sich eifrig bemühen!!
Aufgrund meiner Abwesenheit habe ich bemerkt ,das sich einiges geändert hat .
Einige Änderungen habe ich schon getätigt , z.B. wurde aus Tablet Frontend ----- Tablet UI ...usw.
Nun wollte ich an meinem Frontend weiterbasteln , bekomme aber meine .png Dateien nicht angezeigt .
In der user-Demo von Phil lautet der Pfad ,z.B. in der tanken.html , "./images/shell.png"
Welcher Ordner ist damit gemeint ?
/opt/fhem/www/tablet/images
Ich habe Testweise eine .png Datei dort abgelegt , funktioniert nicht .
Der images-Ordner sollte in diesem Fall in dem Ordner zu finden sein, in dem auch die tanken.html liegt.
Gesendet von meinem Nexus 5 mit Tapatalk
Dies ist der Fall ..............
Habs gefunden ......
/fhem/images/jet.png
Zitat von: Sky am 20 Juni 2015, 16:04:53
Hallo ,
ich war eine Weile aus beruflichen Gründen nicht mehr in diesem Forum und muss gestehen ,es hat sich rasant entwickelt .
Ein großes Dankeschön an alle die sich eifrig bemühen!!
Aufgrund meiner Abwesenheit habe ich bemerkt ,das sich einiges geändert hat .
Einige Änderungen habe ich schon getätigt , z.B. wurde aus Tablet Frontend ----- Tablet UI ...usw.
Nun wollte ich an meinem Frontend weiterbasteln , bekomme aber meine .png Dateien nicht angezeigt .
In der user-Demo von Phil lautet der Pfad ,z.B. in der tanken.html , "./images/shell.png"
Welcher Ordner ist damit gemeint ?
/opt/fhem/www/tablet/images
Ich habe Testweise eine .png Datei dort abgelegt , funktioniert nicht .
In meinem Fall befindet sich das Verzeichnis images tatsächlich hier:
/opt/fhem/www/tablet/images/
Zitat von: mc-hollin am 17 Juni 2015, 17:36:03
so jetzt habe ich mich endlich auch mal mit der Widget Erstellung befasst.
Mir gefiel hier im Forum auch die simpleClock.
Da ich nicht nur die Url einbinden wollte, habe ich mich mal an ein Widget gewagt.
Hierbei habe ich mir nesges widget_clock als Vorlage genommen ;-)
Leider war ich mir nicht sicher wie ich auch davon ableiten kann und ob es auch sinnig ist. Daher habe ich ein paar Teile erst mal nur übernommen.
Folgendes ist dabei heraus gekommen.
Vielleicht kann es ja einer gebrauchen.
Bsp1.
<div data-type="simpleClock" data-date-format="l, d. F Y" data-date-color="#fff" data-time-color="#fff" data-time-bg-colors='["#555","#000"]' class="big"></div>
Bsp2.
<div data-type="simpleClock" data-date-format="l, d. F Y" data-date-color="#3f92ca" data-time-color="#fce740" data-time-bg-colors='["#2ebd13","#882200"]' class="big"></div>
Bei mir ist auf dem UI ein Hintergrundbild eingebaut und die Gridster haben eine Transparenz. Daher kann es sein, dass die Standardfarben etwas zu dunkel sein können.
Edit: widget_simpleClock leitet jetzt von widget_clock ab!
Mir ist aufgefallen, dass dein clock widget immer um 23:59 stehen bleibt und dann erst wieder mit einem Seiten refresh weiter geht, bzw. die dann richtige Uhrzeit anzeigt.
Hast du das schon behoben?
Zitat von: bjoernbo am 20 Juni 2015, 10:34:52
Hallo setstate,
kannst Du bitte noch folgende Änderung / Korrektur für das simpelchart-Widget einfügen.
Schau mal auf meine Hardcopy, dann weißt Du was ich meine, Bezüglich der Werte auf der y-Achse.
Danke für den Hinweise. Ist jetzt korrigiert.
Moin,
wenn ich versuche FHEM Tablet UI wie beschrieben zu installieren, dann bricht die Installation wie folgt ab:
2015.06.21 15:12:01 1: Got 10114 bytes for www/tablet/js/widget_simplechart.js, not 9282 as expected,
2015.06.21 15:12:01 1: aborting.
Stimmt da was mit der controls_fhemtabletui.txt auf dem Server nicht?
Gruß,
budy
Zitat von: uniqueck am 21 Juni 2015, 10:21:38
Mir ist aufgefallen, dass dein clock widget immer um 23:59 stehen bleibt und dann erst wieder mit einem Seiten refresh weiter geht, bzw. die dann richtige Uhrzeit anzeigt.
Hast du das schon behoben?
Schau ich mir mal an.
Ich wollte eh noch mal den Quellcode überarbeiten, da in meinem Konstrukt die dynamischen DIVs beim Seitenwechsel nochmal hinzugefügt werden.
Musste mich erst noch ein bisschen einlesen. Hatte noch ein paar Verständnisprobleme.
Nutz du denn schon das von Clock ableitende Widget?
Zitat von: budy am 21 Juni 2015, 15:16:20
Moin,
wenn ich versuche FHEM Tablet UI wie beschrieben zu installieren, dann bricht die Installation wie folgt ab:
2015.06.21 15:12:01 1: Got 10114 bytes for www/tablet/js/widget_simplechart.js, not 9282 as expected,
2015.06.21 15:12:01 1: aborting.
Stimmt da was mit der controls_fhemtabletui.txt auf dem Server nicht?
Gruß,
budy
Ja, stimmt. Ein Commit vergessen. Kann ich erst heute Abend gerade ziehen.
Sorry
Hallo,
seit dem heutigen Update kann ich unter der URL "<ip-adresse>:8083/fhem/ftui/" FTUI nicht mehr aufrufen.
Es kommt folgende Meldung:
No HTTPSRV device for /ftui
Konfiguriert ist es folgendermaßen:
Internals:
CFGFN
DEF ftui/ ./www/tablet/ Tablet-UI
NAME TABLETUI
NR 126
STATE TABLETUI
TYPE HTTPSRV
Fhem:
directory ./www/tablet/
friendlyname Tablet-UI
infix ftui/
Attributes:
group Terminal
room 9_09_Einstellungen
Sind zu HTTPSRV wieder Probleme bekannt? Das Thema ist ja schon öfters hier diskutiert worden.
Vielen Dank.
Moin,
das habe ich auch. Ich habe das eben erst installiert und ich hatte heute auch ein update des FHEM gemacht.
Zitat von: mc-hollin am 21 Juni 2015, 16:18:36
Schau ich mir mal an.
Ich wollte eh noch mal den Quellcode überarbeiten, da in meinem Konstrukt die dynamischen DIVs beim Seitenwechsel nochmal hinzugefügt werden.
Musste mich erst noch ein bisschen einlesen. Hatte noch ein paar Verständnisprobleme.
Nutz du denn schon das von Clock ableitende Widget?
Dann hätte ich noch einen Vorschlag. Es wäre schön, wenn man die Zeit auch ähnlich der Datumsangabe formatieren kann. Also ich habe bei mir die Sekundenanzeige auskommentiert.
Und zu deiner Frage bzgl. der abgeleiteten Version, ich denke mal schon.
Hallo,
ich habe irgendwie ein Problem mit den anderen Icons!
Meine CSS Einbindungen sehen wie folgt aus:
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
Aber wenn ich ein Icon aus dem Openautomation oder FhemSVG nehme, kommt immer ein "undefined".
data-icons='["fa-sort-amount-desc","fa-sort-amount-asc","fs-unknown","oa-weather_winter","fa-suitcase"]'
Muss ich noch was anderes machen?
Danke
Zitat von: dancatt am 21 Juni 2015, 19:25:49
Hallo,
seit dem heutigen Update kann ich unter der URL "<ip-adresse>:8083/fhem/ftui/" FTUI nicht mehr aufrufen.
Es kommt folgende Meldung:
No HTTPSRV device for /ftui
Konfiguriert ist es folgendermaßen:
Internals:
CFGFN
DEF ftui/ ./www/tablet/ Tablet-UI
NAME TABLETUI
NR 126
STATE TABLETUI
TYPE HTTPSRV
Fhem:
directory ./www/tablet/
friendlyname Tablet-UI
infix ftui/
Attributes:
group Terminal
room 9_09_Einstellungen
Sind zu HTTPSRV wieder Probleme bekannt? Das Thema ist ja schon öfters hier diskutiert worden.
Vielen Dank.
HTTPSRV ist per update wieder auf den alten Stand zurückgestellt worden, da es mit dem Update von Anfang Juni ja Probleme gab.
Mit der Definition von oben muss statt des offiziellen, alten HTTPSRV das aus meinem früheren Post (Antwort #1840) verwendet werden. Bevor dieses offiziell verteilt wird, möchte der Modulowner nochmal eine Testrunde durchgeführt haben, damit die Abwärtskompatibilität gesichert ist.
Ich habe das HTTPSRV Modul hier nochmals angehängt.
Bitte schickt mir eine Rückmeldung wenn ihr mit dem hier angefügten HTTPSRV ein Problem bekommt.
(Gut wäre eine Rückmeldung im entsprechenden Thread: Kleines Problem bei FHEMWEB / HTTPSRV)
http://forum.fhem.de/index.php/topic,37232.msg295050.html#msg295050 (http://forum.fhem.de/index.php/topic,37232.msg295050.html#msg295050)
Gruss,
johannes
Ich bin gerade dabei mich ein bissl mit dem Einbinden von Webcam-Bildern zu spielen, um z.B. meine Kamera am Gaterntürl innerhalb des UIs angezeigt zu bekommen. Da jedoch (zumindest in meinem Fall) die Gridster-Einteilung so kleingliedrig ist, dass man zu wenig auf dem Bild erkennen kann, dachte ich an eine "Vergrößerung-bei-Touch"-Funktion. Ich habe soetwas in der Art schon einmal für statische Bilder auf einer meiner Webseiten eingebaut. Die Krux dabei ist allerdings, dass dieses Script wirklich nur für statische Bilder zu funktionieren scheint. Ist in etwa wie hier: http://www.dynamicdrive.com/dynamicindex4/imagemagnify.htm
Nun hätte ich diese Funktion eben auch gern für's UI. Dabei soll z.B. innerhalb eines Gridster-Elements das LIVE-Bild einer Kamera angezeigt werden. Wenn man auf das Bild "touched", dann sollte dieses Bild, quasi wie ein Pop-Up, vergrößert werden. Erneuter Touch auf das Pop-Up, lässt es wieder klein werden.
Hat hierzu jemand eine Idee/ Link zu einem Script?
P.S. Ich hatte diese Funktionalität Mal in irgendeinem FHEM-Frontend schon gesehen/ ausprobiert. Leider weiß ich nicht mehr in welchem...
---edit--
Hab's gefunden! War aber nicht für FHEM, sondern für die Homematic CCU: Das Widget versteckt sich irgendwo im sog. DashUI. -> http://hobbyquaker.github.io/DashUI/
--nochmal edit--
Ha! Wer hätt's gedacht?! Bei einer anderen Cam, die einen mjpeg-Stream ausgibt funktoniert das oben verlinkte Script wunderbar. Probier ich gleich mal in's UI einzubauen....
Zitat von: uniqueck am 21 Juni 2015, 20:13:22
Dann hätte ich noch einen Vorschlag. Es wäre schön, wenn man die Zeit auch ähnlich der Datumsangabe formatieren kann. Also ich habe bei mir die Sekundenanzeige auskommentiert.
Und zu deiner Frage bzgl. der abgeleiteten Version, ich denke mal schon.
So hab das widget_simpleClock um data-time-format erweitert.
Die Datei habe ich im Originalbeitrag erneuert. http://forum.fhem.de/index.php/topic,34233.msg304630.html#msg304630 (http://forum.fhem.de/index.php/topic,34233.msg304630.html#msg304630)
Deinen Stillstand um 23:59 Uhr kann ich bei mir nicht reproduzieren.
Ich hab mal die Uhr hoch gesetzt und der Umschaltvorgang läuft einwandfrei.
Ist eigentlich auch ein ganz normaler setInterval.
Hast du den Fehler den auch beim widget_Clock?
Hallo zusammen,
eine kurze Frage zum Thermostat-Widget. Ich verwende dieses für die Lautstärkeregelung meines Verstärkers - was auch super klappt. Leider kommt meine Frau damit noch nicht so richtig zurecht, da sie meint, dass das Widget ihr zu klein sei.
Nun die Frage: gibt es eine Möglichkeit das Widget noch größer als "big" zu machen?
Vielen Dank und einen guten Start in die neue Woche
wolf
Hallo zusammen,
ich habe noch eine Frage 8) : ich verwende das iTunes-Modul, das läuft auch soweit ganz gut.
http://www.fhemwiki.de/wiki/ITunes-Modul_-_Installation_und_pairing
Jetzt habe ich Start/Stop/Pause usw. in "New FHEM Tablet UI" eingebunden, kann steuern und lasse ich mir das Cover das akutell laufenden Titels einblenden. Dazu liefert mir die Standardoberfläche, bzw. das reading des Moduls (currentAlbumArtURI = ./www/images/default/iTunes/iTunes_minime_AlbumArt-1.png) auch den Pfad zum Bild. Diesen habe ich über das image-Widget in "New FHEM Tablet UI" eingebunden und sehe auch das, bzw. ein Cover.
Das Problem ist nur, dass sich das Cover bei einem Titelwechsel nicht sofort aktualisisert, sondern stehen bleibt. Nach mehrmaligem skippen des Titels kommt auch hin und wieder mal ein neues Cover, aber selten wechselt dieses so, dass ich wirklich das des aktuellen Titels sehe.
Den Aktualiserungsintervall für das image-Widget habe ich auch angepasst, allerdings ohne Ergebnis. In der Standardoberfläche von FHEM akutalisiert es sich sofort bei Titelwechsel, nur eben nicht im "New FHEM Tablet UI".
Kann mir vielleicht jemand einen Tipp geben?
vielen Dank und schöne Grüße
wolf
Zitat von: wolfram am 22 Juni 2015, 13:14:39
Hallo zusammen,
eine kurze Frage zum Thermostat-Widget. Ich verwende dieses für die Lautstärkeregelung meines Verstärkers - was auch super klappt. Leider kommt meine Frau damit noch nicht so richtig zurecht, da sie meint, dass das Widget ihr zu klein sei.
Nun die Frage: gibt es eine Möglichkeit das Widget noch größer als "big" zu machen?
Vielen Dank und einen guten Start in die neue Woche
wolf
Hast du schon "bigger" oder "fa-4x" probiert?
Edit:Ok habs mal probiert. Funktioniert beides Nicht.
Ist anscheinend fest verdrahtet :
'height':$(this).hasClass('big')?150:100,
'width':$(this).hasClass('big')?150:100,
Zitat von: tomster am 22 Juni 2015, 10:10:14
--nochmal edit--
Ha! Wer hätt's gedacht?! Bei einer anderen Cam, die einen mjpeg-Stream ausgibt funktoniert das oben verlinkte Script wunderbar. Probier ich gleich mal in's UI einzubauen....
Funktionieren? Prinzipiell, ja. Aber im Ergebnis dann doch eher: Denkste...
Irgendwas an der jquery.magnifier.js kommt mit den .js's vom Tablet UI in Konflikt. Alsbald ich
<script type="text/javascript" src="/fhem/tablet/lib/jquery.magnifier.js"></script>in den <head> der index.html einbaue, bekomme ich lediglich noch eine schwarze Seite angezeigt. Auch wenn ich der Meinung bin, dass es sicher etwas viel verlangt
sein dürfte ist, danach zu fragen:
Hat jemand (setstate, nesges?) eine Idee, warum es unbedingt meint "konfliktisieren" zu müssen? In der Webkonsole kann ich keine Fehlermeldung im Bezug auf die jquery.magnifier.js finden...
jQuery.noConflict()
jQuery.imageMagnify={
dsettings: {
magnifyby: 3, //default increase factor of enlarged image
duration: 500, //default duration of animation, in millisec
imgopacity: 0.2 //opacify of original image when enlarged image overlays it
},
cursorcss: 'url(magnify.cur), -moz-zoom-in', //Value for CSS's 'cursor' attribute, added to original image
zIndexcounter: 100,
refreshoffsets:function($window, $target, warpshell){
var $offsets=$target.offset()
var winattrs={x:$window.scrollLeft(), y:$window.scrollTop(), w:$window.width(), h:$window.height()}
warpshell.attrs.x=$offsets.left //update x position of original image relative to page
warpshell.attrs.y=$offsets.top
warpshell.newattrs.x=winattrs.x+winattrs.w/2-warpshell.newattrs.w/2
warpshell.newattrs.y=winattrs.y+winattrs.h/2-warpshell.newattrs.h/2
if (warpshell.newattrs.x<winattrs.x+5){ //no space to the left?
warpshell.newattrs.x=winattrs.x+5
}
else if (warpshell.newattrs.x+warpshell.newattrs.w > winattrs.x+winattrs.w){//no space to the right?
warpshell.newattrs.x=winattrs.x+5
}
if (warpshell.newattrs.y<winattrs.y+5){ //no space at the top?
warpshell.newattrs.y=winattrs.y+5
}
},
magnify:function($, $target, options){
var setting={} //create blank object to store combined settings
var setting=jQuery.extend(setting, this.dsettings, options)
var attrs=(options.thumbdimensions)? {w:options.thumbdimensions[0], h:options.thumbdimensions[1]} : {w:$target.outerWidth(), h:$target.outerHeight()}
var newattrs={}
newattrs.w=(setting.magnifyto)? setting.magnifyto : Math.round(attrs.w*setting.magnifyby)
newattrs.h=(setting.magnifyto)? Math.round(attrs.h*newattrs.w/attrs.w) : Math.round(attrs.h*setting.magnifyby)
$target.css('cursor', jQuery.imageMagnify.cursorcss)
if ($target.data('imgshell')){
$target.data('imgshell').$clone.remove()
$target.css({opacity:1}).unbind('click.magnify')
}
var $clone=$target.clone().css({position:'absolute', left:0, top:0, visibility:'hidden', border:'1px solid gray', cursor:'pointer'}).appendTo(document.body)
$clone.data('$relatedtarget', $target) //save $target image this enlarged image is associated with
$target.data('imgshell', {$clone:$clone, attrs:attrs, newattrs:newattrs})
$target.bind('click.magnify', function(e){ //action when original image is clicked on
var $this=$(this).css({opacity:setting.imgopacity})
var imageinfo=$this.data('imgshell')
jQuery.imageMagnify.refreshoffsets($(window), $this, imageinfo) //refresh offset positions of original and warped images
var $clone=imageinfo.$clone
$clone.stop().css({zIndex:++jQuery.imageMagnify.zIndexcounter, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h, opacity:0, visibility:'visible', display:'block'})
.animate({opacity:1, left:imageinfo.newattrs.x, top:imageinfo.newattrs.y, width:imageinfo.newattrs.w, height:imageinfo.newattrs.h}, setting.duration,
function(){ //callback function after warping is complete
//none added
}) //end animate
}) //end click
$clone.click(function(e){ //action when magnified image is clicked on
var $this=$(this)
var imageinfo=$this.data('$relatedtarget').data('imgshell')
jQuery.imageMagnify.refreshoffsets($(window), $this.data('$relatedtarget'), imageinfo) //refresh offset positions of original and warped images
$this.stop().animate({opacity:0, left:imageinfo.attrs.x, top:imageinfo.attrs.y, width:imageinfo.attrs.w, height:imageinfo.attrs.h}, setting.duration,
function(){
$this.hide()
$this.data('$relatedtarget').css({opacity:1}) //reveal original image
}) //end animate
}) //end click
}
};
jQuery.fn.imageMagnify=function(options){
var $=jQuery
return this.each(function(){ //return jQuery obj
var $imgref=$(this)
if (this.tagName!="IMG")
return true //skip to next matched element
if (parseInt($imgref.css('width'))>0 && parseInt($imgref.css('height'))>0 || options.thumbdimensions){ //if image has explicit width/height attrs defined
jQuery.imageMagnify.magnify($, $imgref, options)
}
else if (this.complete){ //account for IE not firing image.onload
jQuery.imageMagnify.magnify($, $imgref, options)
}
else{
$(this).bind('load', function(){
jQuery.imageMagnify.magnify($, $imgref, options)
})
}
})
};
jQuery.fn.applyMagnifier=function(options){ //dynamic version of imageMagnify() to apply magnify effect to an image dynamically
var $=jQuery
return this.each(function(){ //return jQuery obj
var $imgref=$(this)
if (this.tagName!="IMG")
return true //skip to next matched element
})
};
//** The following applies the magnify effect to images with class="magnify" and optional "data-magnifyby" and "data-magnifyduration" attrs
//** It also looks for links with attr rel="magnify[targetimageid]" and makes them togglers for that image
jQuery(document).ready(function($){
var $targets=$('.magnify')
$targets.each(function(i){
var $target=$(this)
var options={}
if ($target.attr('data-magnifyto'))
options.magnifyto=parseFloat($target.attr('data-magnifyto'))
if ($target.attr('data-magnifyby'))
options.magnifyby=parseFloat($target.attr('data-magnifyby'))
if ($target.attr('data-magnifyduration'))
options.duration=parseInt($target.attr('data-magnifyduration'))
$target.imageMagnify(options)
})
var $triggers=$('a[rel^="magnify["]')
$triggers.each(function(i){
var $trigger=$(this)
var targetid=$trigger.attr('rel').match(/\[.+\]/)[0].replace(/[\[\]']/g, '') //parse 'id' from rel='magnify[id]'
$trigger.data('magnifyimageid', targetid)
$trigger.click(function(e){
$('#'+$(this).data('magnifyimageid')).trigger('click.magnify')
e.preventDefault()
})
})
})
Hab das nirgends mehr drinne. Habe nur noch deine Clock drin. Naja werde mal deine neue Version testen. Ich hatte die Sekundenanzeige auch entfernt, weil er manchmal auch zwei Sekunden weitergeschaltet hatte.
Gesendet von meinem GT-N7100 mit Tapatalk
Hallo zusammen,
hat jemand das FHEM Tablet UI schon auf einen anderen Webserver ausgelagert? Damit meine ich nicht die Demoinstallation von ngres, sondern schon eine im "produktiven" Zusammenspiel mit FHEM.
Für die Absicherung ext. Zugriffe habe ich auf meinem NUC, der aktuell ausschließlich für FHEM genutzt wird, nginx als ReverseProxy zwischengeschaltet. Da ich mittels PHP noch etwas mehr Dynamik, wie z.B. wechselnde Karten, etc. mit ins UI einbauen möchte und nginx prima mit PHP zusammenarbeitet, möchte ich nicht noch zus. Apache auf den NUC packen.
Beim ersten Versuch eine Tablet UI Instanz unter nginx zum Laufen zu bekommen, ist mir aufgefallen, dass nicht alle Zugriffe in das Tablet UI Verzeichnis erfolgen, sondern auch in parallel liegende der FHEM Installation. Da die nginx Instanz logischerweise auf einem anderen Port läuft, laufen diese Anfragen gegen die Wand.
Dass das Auslagern auf eine andere Webserver Instanz u.a. das komfortable Update nicht mehr unterstützt, ist mir klar. Den Nachteil würde ich zugunsten der von mir angestrebten Lösung akzeptieren.
Würde mich freuen, wenn der ein oder andere Tipp dazu käme.
Danke + VG Stefan
Zitat von: setstate am 19 Juni 2015, 13:22:40
Das slider Widget mag nur Zahlen für den Wert. Man könnte auf Fhem Seite mit userReadings arbeiten
Ich könnte aber auch noch data-part ins Sliderwidget einbauen, so wie beim Labelwidget. Dann könnte man sich den Zahlenwert rausfiltern.
Das ist jetzt geschehen:
slider, level, dimmer, volume widgets haben jetzt neu
data-partDamit kann man nur einen bestimmten Teil des Readings benutzen.
z.B. erhält man bei einem Wert 'dim 50' mit data-part="2" danach '50'
Zitat von: setstate am 22 Juni 2015, 22:08:29
Das ist jetzt geschehen: slider, level, dimmer, volume widgets haben jetzt neu data-part
Damit kann man nur einen bestimmten Teil des Readings benutzen.
z.B. erhält man bei einem Wert 'dim 50' mit data-part="2" danach '50'
Hallo setstate,
vielen Dank dafür.
Ich habe aber noch ein Problem, mein FS20 Dimmer gibt/will folgenden Wert haben: dim65%
Kann ich dieses damit auch zerlegen?
Danke und Gruß
Denny
Gibt es eigentlich schon eine Möglichkeit eine Zeitschaltuhr zu realisieren?
Also ein Einschaltbefehl zu einer bestimmten Uhrzeit und für eine festgelegte Zeit.
In FHEM habe ich folgendes definiert:
define PoolpumpeMorgensStart at *06:30:00 set EG_Aussen_Steckdose on-for-timer 7200
Dies würde ich gerne über FTUI anzeigen und steuern.
Oder wäre das schon mit dem widget_setTimer möglich?
Hier fehlt mir nur noch die Laufzeit.
Ich würde gerne bestimmte Buttons (Push und Switches) nur schalten, wenn zusätzliche Schritte aufgeführt werden.
Beispiel: Ich möchte ungerne aus Versehen meine Haustür öffnen, nur weil ich aus Versehen auf dem iPhone beim Scrollen auf den Knopf gedrückt habe.
Verschiedene Alternativen sind mir eingefallen:
- Ein popup zur Bestätigung beim Druck, bevor eine Aktion ausgelöst wird
- Ein anderer Knopf, der die anderen Knöpfe erst scharf/aktiv schaltet
- Ein Doppelclick --> das scheint vorgesehen zu sein, hat aber irgendwie bei mir nicht funktioniert (auf dem Desktop)
Hat das schon jemand gemacht, oder soll ich mich selbst mal dransetzen?
Gruss,
Johannes
Zitat von: viegener am 22 Juni 2015, 22:49:23
Verschiedene Alternativen sind mir eingefallen:
- Ein popup zur Bestätigung beim Druck, bevor eine Aktion ausgelöst wird
- Ein anderer Knopf, der die anderen Knöpfe erst scharf/aktiv schaltet
- Ein Doppelclick --> das scheint vorgesehen zu sein, hat aber irgendwie bei mir nicht funktioniert (auf dem Desktop)
Mir würde noch ein längerer Tastendruck einfallen. Z.B.:3Sekunden halten bevor der Befehl gesendet wird.
Vielleicht könnte man einen Button um einen Parameter für die Auslösezeit erweitern.
Zitat von: xsasx am 19 Juni 2015, 12:52:16
Habe mal eine Frage.
Ich lass mir meine Keller Temperatur anzeigen mit:
<div class="">
<div data-type="label" class="cell darker left">Keller :</div>
<div data-type="label" data-device="WT.Keller" data-get="temperature" data-unit="%B0C%0A" class="cell right"></div>
<div>
Jetzt läuft im Hintergrund noch ein Script was meinen dewpoint errechnet (alle 10min) und sagt ob es sinnvoll ist zu lüften oder nicht.
Er schält set auf JA oder NEIN. Nun würd ich gerne in dieser Abhängigkeit die Farbe entweder von dem Namen Keller auf rot oder grün setzen oder eben die Farbe der Temperatur.
Das bekomme ich leider nicht hin :( hat mir da jemand einen Tipp ?
Edit: Was ich hinbekomme ist ein Icon das die Farbe entsprechend wechselt das will ich aber nicht :(
<div data-type="label" class="cell darker left" >Keller :</div>
<div class="">
<div data-type="label" class="narrow darker small">Küche</div>
<div data-type="symbol" data-device="Keller.Lueften" data-icons='["oa-fts_window_2w","oa-fts_window_2w_open"]' data-on-colors='["#fa334f","#008623"]' data-get-on='["NEIN","JA"]' class="cell"></div>
</div>
Wäre über einen Tipp sehr Dankbar !
Das geht ab sofort:
Label Widget hat jetzt mit
data-limits-get ein neues Attribute um den Namen des Readings separat von data-get anzugeben, was die Farbe des Labels entsprechend des
data-limits Arrays beeinflusst. Default ist der Inhalt von data-get, und damit abwärtskompatibel.
Beispiel:
<div data-type="label" data-device="WT.Keller"
data-get="temperature" data-unit="%B0C%0A"
data-colors='["#fa334f","#008623"]' data-limits='["NEIN","JA"]'
data-limits-get="Keller.Lueften:STATE">
</div>
Das Format von
data-limits-get ist DEVICE:READING oder nur READING.
Zitat von: wolfram am 22 Juni 2015, 13:14:39
Hallo zusammen,
eine kurze Frage zum Thermostat-Widget. Ich verwende dieses für die Lautstärkeregelung meines Verstärkers - was auch super klappt. Leider kommt meine Frau damit noch nicht so richtig zurecht, da sie meint, dass das Widget ihr zu klein sei.
Nun die Frage: gibt es eine Möglichkeit das Widget noch größer als "big" zu machen?
Vielen Dank und einen guten Start in die neue Woche
wolf
Was spricht gegen das Volume Widget? Man kann dort die Ticks auch wie beim Thermostat enger machen.
<div data-type="volume" data-device='dummy1'
data-tickstep='4'
class="big" ></div>
Zitat von: nightstorm99 am 22 Juni 2015, 22:17:37
Hallo setstate,
vielen Dank dafür.
Ich habe aber noch ein Problem, mein FS20 Dimmer gibt/will folgenden Wert haben: dim65%
Kann ich dieses damit auch zerlegen?
Danke und Gruß
Denny
Ja, data-part versteht auch RegEx Ausdrücke
<div data-type="volume" data-device='dummy1' data-part="dim(\d+)%"></div>
Zitat von: viegener am 22 Juni 2015, 22:49:23
Ich würde gerne bestimmte Buttons (Push und Switches) nur schalten, wenn zusätzliche Schritte aufgeführt werden.
Beispiel: Ich möchte ungerne aus Versehen meine Haustür öffnen, nur weil ich aus Versehen auf dem iPhone beim Scrollen auf den Knopf gedrückt habe.
Verschiedene Alternativen sind mir eingefallen:
- Ein popup zur Bestätigung beim Druck, bevor eine Aktion ausgelöst wird
- Ein anderer Knopf, der die anderen Knöpfe erst scharf/aktiv schaltet
- Ein Doppelclick --> das scheint vorgesehen zu sein, hat aber irgendwie bei mir nicht funktioniert (auf dem Desktop)
Doppelklick funktioniert, aber mit
Millisekunden Angaben:
<div data-type="switch" data-device='dummy1' data-doubleclick="2000"></div>
Die Farben kann man mit folgendem noch beeinflussen:
-data-firstclick-color
-data-firstclick-background-color
Zitat von: viegener am 22 Juni 2015, 22:49:23
Ich würde gerne bestimmte Buttons (Push und Switches) nur schalten, wenn zusätzliche Schritte aufgeführt werden.
Beispiel: Ich möchte ungerne aus Versehen meine Haustür öffnen, nur weil ich aus Versehen auf dem iPhone beim Scrollen auf den Knopf gedrückt habe.
Eine einfache Möglichkeit, die auch jetzt schon funktionieren sollte, wäre ein CIRCLEMENU mit nur einer Schaltfläche.
Ist vielleicht noch sicherer als ein Doppelklick, weil man an zwei verschiedenen Stellen Klicken/Tippen muss.
Vielleicht könnte man aber auch vom CIRCLEMENU ein Widget ableiten, das nur einen Button genau über dem ursprünglichen Symbol einblendet. Den kann man antippen und die Aktion wird ausgeführt und der Button wieder ausgeblendet. Oder wenn man nicht tippt, verschwindet er nach ein paar Sekunden wieder. Diese Basisfunktionalität ist ja im CIRCLEMENU schon drin. Vielleicht würde es sogar jetzt schon funktionieren, wenn man data-item-diameter auf 0 setzt oderso...
Zitat von: StefanD am 22 Juni 2015, 16:28:47
Beim ersten Versuch eine Tablet UI Instanz unter nginx zum Laufen zu bekommen, ist mir aufgefallen, dass nicht alle Zugriffe in das Tablet UI Verzeichnis erfolgen, sondern auch in parallel liegende der FHEM Installation. Da die nginx Instanz logischerweise auf einem anderen Port läuft, laufen diese Anfragen gegen die Wand.
Ich hab's unter Apache laufen - eben so, wie in der Demo ;) Dazu musst du nur das Meta-Tag "fhemweb_url" entsprechend setzen:
<meta name="fhemweb_url" content="http:///host:port/fhem">
Zitat von: mc-hollin am 22 Juni 2015, 22:30:05
Gibt es eigentlich schon eine Möglichkeit eine Zeitschaltuhr zu realisieren?
Also ein Einschaltbefehl zu einer bestimmten Uhrzeit und für eine festgelegte Zeit.
In FHEM habe ich folgendes definiert:
define PoolpumpeMorgensStart at *06:30:00 set EG_Aussen_Steckdose on-for-timer 7200
Dies würde ich gerne über FTUI anzeigen und steuern.
Oder wäre das schon mit dem widget_setTimer möglich?
Hier fehlt mir nur noch die Laufzeit.
Mit settimer könntest du das umsetzen, indem du ein notify auf das Timer-Device setzt. Die Laufzeit müsste aber tatsächlich aus einer zweiten Quelle kommen. IOW: Nee, was fertiges gibt's mW nicht, es liesse sich aber aus mehreren Komponenten zusammen setzen.
Zitat von: setstate am 23 Juni 2015, 02:06:17
Was spricht gegen das Volume Widget? Man kann dort die Ticks auch wie beim Thermostat enger machen.
<div data-type="volume" data-device='dummy1'
data-tickstep='4'
class="big" ></div>
Hallo setstate,
danke für Deine Antwort.
Ich bin zum Volume-Widget zum Thermostat gewechselt, da ich die Funktion von verschiedenen Farben (grün = Lautstärke ok, gelb = Lautstärke noch gut, rot = zu laut) versuche unterzubringen. Darüber hinaus kann ich, soweit ich das aus dem Wiki entnehme auch beim Volume kein "bigger" oder ähnliches verwenden um es größer zu bekommen, oder verstehe ich die Dokumentation falsch?
Danke und LG
wolf
Zitat von: nesges am 23 Juni 2015, 10:00:03
Mit settimer könntest du das umsetzen, indem du ein notify auf das Timer-Device setzt. Die Laufzeit müsste aber tatsächlich aus einer zweiten Quelle kommen. IOW: Nee, was fertiges gibt's mW nicht, es liesse sich aber aus mehreren Komponenten zusammen setzen.
Ok danke.
Dann ist das mein nächster Schritt 8)
Zitat von: wolfram am 23 Juni 2015, 10:27:58
Hallo setstate,
danke für Deine Antwort.
Ich bin zum Volume-Widget zum Thermostat gewechselt, da ich die Funktion von verschiedenen Farben (grün = Lautstärke ok, gelb = Lautstärke noch gut, rot = zu laut) versuche unterzubringen. Darüber hinaus kann ich, soweit ich das aus dem Wiki entnehme auch beim Volume kein "bigger" oder ähnliches verwenden um es größer zu bekommen, oder verstehe ich die Dokumentation falsch?
Danke und LG
wolf
Das Thermostat wird die gleichen Classed haben, wie Volume. Ist schon geändert, aber noch im Test bei mir.
Zitat von: StefanD am 22 Juni 2015, 16:28:47
Hallo zusammen,
hat jemand das FHEM Tablet UI schon auf einen anderen Webserver ausgelagert? Damit meine ich nicht die Demoinstallation von ngres, sondern schon eine im "produktiven" Zusammenspiel mit FHEM.
Ich habs bei mir auf nginx laufen:
server {
listen [::]:80 ipv6only=off;
root /var/www/tabletui;
server_name _;
location ~ \.php$ {
include snippets/fastcgi-php.conf;
# With php5-fpm:
fastcgi_pass unix:/var/run/php5-fpm.sock;
}
location /fhem {
proxy_pass http://localhost:8083/fhem;
proxy_redirect off;
proxy_buffering off;
}
location /pgm2 {
alias /opt/fhem/www/pgm2;
}
location /fhem-tablet-ui {
alias /opt/fhem/www/tablet;
index index.html index.htm index.php;
}
location / {
index index.html index.htm index.php;
try_files $uri $uri/ /index.php;
}
}[/quote]
Ich generiere mein Frontend wie nesges via php aus dem Verzeichnis /var/www/tabletui, daher die PHP-Config - diese kannst du natürlich weglassen wenn du html verwendest.
Vielleicht hilfts dir weiter :)
Hallo,
ich hätte noch Idee zum Homestatus Widget.
Kann man dieses nicht Abhängig von einem Device readonly schalten.
Ich möchte einen Manuell/Automatik Modus integrieren, wenn dieses auf Manuell steht
kann man den HomeStatus (nutze es auf für Scene/Jalousien usw..) bedienen, ansonsten
ist dieser für eingaben gesperrt.
Man könnte das ganze über ein Dummy und Notify auch umlenken, erst in Dummy und prüfen ob Manuell und so,
aber direkt im Widget wäre die Elegantere Lösung!
Was haltet ihr davon?
Danke und Gruß
Denny
Zitat von: nesges am 23 Juni 2015, 09:55:32
Ich hab's unter Apache laufen - eben so, wie in der Demo ;) Dazu musst du nur das Meta-Tag "fhemweb_url" entsprechend setzen:
<meta name="fhemweb_url" content="http:///host:port/fhem">
könntest du das häher beschreiben? evtl siteconfig und index.hmtl/php? ich habe den tabletui ordner nach /var/www geschoben, die seite im apache eingerichtet und den meta-tag auc die fhemweb_url gesetzt. es iwrd baer nicht angezeigt (weil ich denke die verweise auch die stylesheet und scripte nicht passen).
der fhem webserver macht bei mir nur probleme (tablet ui muss 2x geladen werdne damit der inhalt vollständig ist, änderungen an der seite benötigen ein löschen des browsercaches usw usw) und ich wollte schaune ob es über apache sauberer läuft
Zitat von: chris1284 am 23 Juni 2015, 13:40:44
könntest du das häher beschreiben? evtl siteconfig und index.hmtl/php? ich habe den tabletui ordner nach /var/www geschoben, die seite im apache eingerichtet und den meta-tag auc die fhemweb_url gesetzt. es iwrd baer nicht angezeigt (weil ich denke die verweise auch die stylesheet und scripte nicht passen).
der fhem webserver macht bei mir nur probleme (tablet ui muss 2x geladen werdne damit der inhalt vollständig ist, änderungen an der seite benötigen ein löschen des browsercaches usw usw) und ich wollte schaune ob es über apache sauberer läuft
Die gleichen Probleme habe ich auch.
Werde heute Nachmittag auch auf Apache wechseln, denke das HTTPSRV hier einige Probleme macht und nicht alle Scripte sauben zurück gibt.
Vielleicht sollten wir hierzu einen neuen Thread auf machen?!?
Unter http://forum.fhem.de/index.php/topic,36063.msg289077/topicseen.html#msg289077 hatte ich mal aufgeschrieben, wie man die Live-Demo selbst betreiben kann. Das wesentliche sind wahrscheinlich die beschriebenen Symlinks. Kommt ihr damit klar?
eigentlich kann doch nur dies relevant sein
ln -s /opt/fhem/www/pgm2/ .
und der meta-tag oder?
geht das nicht auch ohne die ganze demo-installation? einfach den Tablet-ui ordner aus /opt/fhem/www nach /var/www/ kopieren, tag rein packen und symlink zu dem fhem/www und gut ist geht wohl nicht oder
Ich habe soweit alles hinbekommen bis auf die abfrage der fhem-daten.
ich habe tablet ui + inhalte von /opt/fhem/www in einen ordner unter /var/www geschoben und die pfade angepasst. nun steht in der konsole
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://srv01.fritz.box:8083/fhem?cmd=list+iPhone%2Cs4ani%2Cout_sen_th+STATE&XHR=1&_=1435086959733. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt). <unbekannt>
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://srv01.fritz.box:8083/fhem?cmd=list+iPhone%2Cs4ani%2Cout_sen_th+temperature&XHR=1&_=1435086959734. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt). <unbekannt>
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://srv01.fritz.box:8083/fhem?cmd=list+iPhone%2Cs4ani%2Cout_sen_th+humidity&XHR=1&_=1435086959735. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt). <unbekannt>
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://srv01.fritz.box:8083/fhem?cmd=list+iPhone%2Cs4ani%2Cout_sen_th+STATE&XHR=1&_=1435086959736. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt). <unbekannt>
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://srv01.fritz.box:8083/fhem?cmd=list+iPhone%2Cs4ani%2Cout_sen_th+undefined&XHR=1&_=1435086959737. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt).
könnt ihr damit was anfangen?
EDIT: attr WEB CORS 1 war die lösung und es läuft über den apache wesentlich geschmeidiger
Zitat von: setstate am 18 April 2015, 00:04:31
Image Widget ist jetzt angepasst. Damit kann es auch mit der FTUI Version 1.4 wieder genutzt werden.
Zusätzlich kann jetzt auch das Update Intervall pro Bild vorgeben, wenn man ein Image per data-url eingebunden hat. Mit data-refresh legt man das Refresh-Intervall in Sekunden fest. Default für data-refresh ist 900 Sekunden (15Minuten).
[/code]
Kann es sein, dass da noch ein Käfer im System ist?
Ich habe Mal testweise meine Kamera von MJPEG auf "Einzelbild" umgestellt und im widget_image.js das Default-Intervall auf 30 Sekunden gestellt (nicht per <data-refresh>!).
Ergebnis: Es wird zwar gelegentlich refresht, aber keineswegs in festen Intervallen.
Erstes Laden der Seite:
Bild von 13:06:07
Automatischer Refresh:
Bild von 13:06:37
Nächster Refresh:
Bild von 13:07:37
Nächster Refresh:
Bild von 13:09:07
Nächster Refresh:
Bild von 13:10:37
Nächster Refresh:
Bild von 13:15:06
Nächster Refresh:
Bild von 13:15:36
Nächster Refresh:
Bild von 13:17:06
Nächster Refresh:
Bild von 13:18:36
Nächster Refresh:
Bild von 13:20:06
Nächster Refresh:
Bild von 13:20:36
Nächster Refresh:
Bild von 13:21:36
Nächster Refresh:
Bild von 13:24:06
Nächster Refresh:
Bild von 13:30:35
....
Das Bild wird angezeigt. Nur mit dem Refresh will es nicht so gehen. Das Bild wird nicht alle x Sekunden neu geholt. Komme nicht weiter.
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header>TOM</header>
<div data-type="image"
data-size="95%"
data-url="http://192.168.109.27/tmpfs/snap.jpg?usr=XXX&pwd=XXX&resolution=64&rate=0"
data-refresh="5">
</div>
</li>
Gibt es eine Lösung für dieses "Problem"?
Warum nimmst du eigentlich nicht das aktuelle "Live-Bild"?
Ich lasse mir das aktuelle Live-Bild einblenden und kann zudem die Kamera sogar steuern.
ZitatWarum nimmst du eigentlich nicht das aktuelle "Live-Bild"?
Ich lasse mir das aktuelle Live-Bild einblenden und kann zudem die Kamera sogar steuern.
Ich habe 3 Cams die dann ständig laufen. Drückt das nicht auf die Leistung? Wollte mein System nicht unnötig belasten. Die Steuerung ist
nicht notwendig. Bei Bedarf hätte ich da die entsprechende APP. :-)
Ein Bild in bestimmten Abständen zu holen und später zusätzlich noch bei "Alarm" (Bewegung) ein zusätzliches Bild einzublenden, halte ich für mich für die bessere Lösung.
Sollte doch laut Beschreibung gehen?
Zitat von: idansch am 24 Juni 2015, 13:42:06
Gibt es eine Lösung für dieses "Problem"?
Wie im Nachbarthread bemerkt vermute ich, dass es ein Cache-Problem ist. Versuch bitte einmal die Version von widget_image.js im Anhang dieses Posts und ergänze den Parameter data-nocache="true" im HTML-Code des Widgets. Wenn's damit funktioniert sende ich einen Pullrequest für die Änderung.
Mit Deiner Version bekomme ich bei gesetztem <data-nocache="true"> gar kein Bild mehr angezeigt.
Ohne schon; allerdings weiterhin ohne refresh...
Werde morgen nochmal weiter testen.
--edit--
Doch schon ein refresh. Allerdings das erste Mal nach 60 secs, nicht nach 30, wie definiert. Weitere refreshs pending..
Muss das eigentlich so kompliziert sein, fragt der Coding-Laie?
Ich hab bei mir auf einer anderen Web-Site eigentlich nur:
jQuery(window).load (function(){
WebcamRefresh();
setInterval('WebcamRefresh()', 600000); // milliseconds
});
function WebcamRefresh(){
d =new Date();
jQuery("#camera1").attr('src', 'data/webcam.jpg'+'?'+d.getTime());
}
und weiter unten dann
<img class="magnify" height="188" id="camera1" src="data/webcam.jpg" width="334" />
im Code stehen. Funzt...
--edit--
Ach ja, 2-geteilt, nur weil ich Webcam_Refresh zusätzlich auch manuell auslösen kann/möchte.
Das Image Update Problem konnte ich lösen.
Beispiel zur Nutzung
<div data-type="image"
data-size="95%"
data-url="http://vusolo2/grab?format=jpg"
data-refresh="5">
</div>
Funzt!
Wenn man das nun durch Klick noch vergrößern könnte, dann wär's perfekt!
Sorry aber ...
ZitatDas Image Update Problem konnte ich lösen.
bei mir geht es immer noch nicht. Ich habe immer nur ein Bild und zwar das was bei ersten mal aufgerufen wurde. Kein Refresh!
<div data-type="image"
data-size="95%"
data-url="http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&pwd=xxx&resolution=64&rate=0"
data-refresh="5">
</div> Was hast du genau geändert. Update habe ich heute durchgeführt.
Hast Du als Pfad auch schon Mal
data-url="http://user:password@192.168.109.27/tmpfs/snap.jpg"
ausprobiert?
Zitat von: setstate am 25 Juni 2015, 02:48:10
Das Image Update Problem konnte ich lösen.
Ein Anchor mit Timestamp wird keinen Cache-Refresh auslösen, soweit ich weiss. Es muss schon ein Query-Parameter sein. JQuery.ajax() (http://api.jquery.com/jquery.ajax/) nutzt dazu übrigens auch _=Timestamp:
ZitatNote: Setting cache to false will only work correctly with HEAD and GET requests. It works by appending "_={timestamp}" to the GET parameters.
Zitat von: tomster am 25 Juni 2015, 00:50:32
Muss das eigentlich so kompliziert sein, fragt der Coding-Laie?
Ja :-) Deine Lösung funktioniert zB mit http://host/script?imgid=12345 nicht. Meine Lösung fängt einige Standardfälle ab, ist aber auch noch nicht vollkommen allgemeingültig - d.h.: noch längst nicht kompliziert genug.
@idansch: Hast du meine Lösung getestet?
Zitat@idansch: Hast du meine Lösung getestet?
Habe ich eben. Das Bild wird jetzt durch einen "Platzhalter" angezeigt. Man kann aber erkennen das er alle x Sekunden das Bild versucht neu aufzurufen.
Sieht aus als ob er den Pfad nicht findet?
<div data-type="image" data-size="95%" data-nocache="true" data-url="http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&pwd=xxx&resolution=64&rate=0" data-refresh="5">
<img alt="img" src="?_=1435225122770?_=1435225117754?_=1435225112723?_=1435225107697?_=1435225102686?_=1435225097663?_=1435225092654?_=1435225087648?_=1435225082638?_=1435225077628?_=1435225072617?_=1435225067602?_=1435225062577http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&pwd=xxx&resolution=64&rate=0" style="opacity: 0.8; height: auto; width: 100%; max-width: 95%;"></div>
Blöder Fehler von mir.. häng mal noch ein # an den URL, also: http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&pwd=xxx&resolution=64&rate=0#
Ja, so geht es!
Habe dein widget_image eigefügt,
data-nocache="true" in html und die # angehangen.
http://192.168.109.27/tmpfs/snap.jpg?usr=xxx&pwd=xxx&resolution=64&rate=0#
Super!!!
Danke für's testen! Habe grade einen Pullrequest gesendet, wenn der übernommen wird kann das überflüssige # auch wieder weg.
So, nach zwei Tagen off bin ich wieder da. Alter Verwalter, hier wird einem echt geholfen! Ein wahrer Traum! 8)
Zitat von: nesges am 23 Juni 2015, 09:55:32
Ich hab's unter Apache laufen - eben so, wie in der Demo ;) Dazu musst du nur das Meta-Tag "fhemweb_url" entsprechend setzen:
<meta name="fhemweb_url" content="http:///host:port/fhem">
Zitat von: SirUli am 23 Juni 2015, 11:17:38
Ich habs bei mir auf nginx laufen:
server {
listen [::]:80 ipv6only=off;
....
Vielleicht hilfts dir weiter :)
Und wie! Letztlich hing es bei mir noch an dieser "Kleinigkeit":
location /pgm2 {
alias /opt/fhem/www/pgm2;
}Aber wie das immer so mit dem Wald ist, den man irgendwann vor lauter Bäumen nicht mehr sieht... :D
Zitat von: nightstorm99 am 23 Juni 2015, 13:42:53
Vielleicht sollten wir hierzu einen neuen Thread auf machen?!?
Das wäre vielleicht gar keine schlechte Idee. So würde man diesen Thread für die reine Funktionalität der Komponenten "sauber halten".
Erste Tests haben leider eines meiner größten funktionalen Probleme nicht gelöst, die mich zum Auslagern bewogen hatten: WebControlView funktioniert zwar prinzipell, allerdings ebenso gut/schlecht wie mit dem integrierten HTTPSrvr. Das vollständige Laden meiner Startseite dauert genau so lange, manchmal wird sie nur zur Hälfte geladen. Der Status z.B. des Garagentors wird nicht durchgängig (zu -> geöffnet -> offen) aktualisiert. Über Chrom wird alles schnell, sauber und korrekt angezeigt. Wäre da nicht die Statusleiste oben, die ich bisher nicht wegbekommen habe, würde ich auch gerne WebControlView ersetzen...
VG Stefan
Zitat von: StefanD am 25 Juni 2015, 16:03:11Über Chrom wird alles schnell, sauber und korrekt angezeigt. Wäre da nicht die Statusleiste oben, die ich bisher nicht wegbekommen habe, würde ich auch gerne WebControlView ersetzen...
Chrome kann Webseiten mit bestimmten Metatags (<meta name="mobile-web-app-capable" content="yes">, ist Standardmässig in FTUI gesetzt) als "Desktop-App" anlegen. Einfach im Browser öffnen und im Menü "Zu Startbildschirm hinzufügen" oder ähnlich (heisst unterschiedlich in verschiedenen Versionen) wählen. Dann nur noch über die Verknüpfung auf dem Homescreen starten -> Fullscreen ohne Statusleiste :)
Konnte man eigentlich schon mal feststellen wieso der Chrome Probleme hat mit Dimmer Widget. Man konnte zwar Dimmen aber wenn man raufgedrückt hat wurde nicht geschlaten sondern immer so ein pct Wert höher oder Tiefer geschalten. Nur einschalten ging nicht. hat immer nur pct gesendet ohne das die Lampe an ging
Zitat von: CoolTux am 25 Juni 2015, 16:57:03
Konnte man eigentlich schon mal feststellen wieso der Chrome Probleme hat mit Dimmer Widget. Man konnte zwar Dimmen aber wenn man raufgedrückt hat wurde nicht geschlaten sondern immer so ein pct Wert höher oder Tiefer geschalten. Nur einschalten ging nicht. hat immer nur pct gesendet ohne das die Lampe an ging
Nein leider nicht. :'(
Währe ja auch zu schon gewesen um wahr zu sein :'(
Na wird bestimmt noch
Bei mir geht mit Chrome Desktop gar nichts ausser das Circle-Menu zu öffnen - verwende daher momentan Firefox auf dem Desktop. Auf dem Tablet ist WVC sehr behäbig, aber immerhin geht Chrome da vernünftig.
Zitat von: SirUli am 25 Juni 2015, 18:36:13
Bei mir geht mit Chrome Desktop gar nichts ausser das Circle-Menu zu öffnen
Hatte ich auch schon, aber nachdem ich sämtliche Browserdaten ("Gesamter Zeitraum") gelöscht habe, ging's wieder. Würde sicher auch gezielter gehen und ob's dir wirklich hilft, weiss ich nicht.
Zitat von: nesges am 25 Juni 2015, 18:39:29
Hatte ich auch schon, aber nachdem ich sämtliche Browserdaten ("Gesamter Zeitraum") gelöscht habe, ging's wieder. Würde sicher auch gezielter gehen und ob's dir wirklich hilft, weiss ich nicht.
Hatte es grad mal via Incognito-Fenster probiert (was ein ähnlicher Effekt wie von dir beschrieben sein sollte): Rührt sich nix. Hatte deinen Code als Basis genommen, daher clickt es auch nett wenn man da auf ein Item des Menü dann drückt, aber es tut sich dennoch nichts. Wie als wenn das lauschen auf den Events nicht klappt. Naja halb so wild, es gibt ja alternativen.
Zitat von: SirUli am 25 Juni 2015, 18:36:13
Bei mir geht mit Chrome Desktop gar nichts ausser das Circle-Menu zu öffnen - verwende daher momentan Firefox auf dem Desktop. Auf dem Tablet ist WVC sehr behäbig, aber immerhin geht Chrome da vernünftig.
Was genau heißt "gar nichts"? Ich verwende Chrome täglich mit der Tablet UI. Habe allerdings auch kein Dimmer-Widget im Einsatz, aber Circle-Menu und Thermostaten.
Das einzige was ich immer noch feststellen muss, ist dass die Thermostaten nach einem manuellen Refresh (ist nach Standby nötig) gerne mal alle 10 Grad anzeigen. Dann muss man noch ein bis drei mal refreshen und dann passt die Anzeige wieder. Vermutlich kommen die Daten manchmal einfach nicht schnell genug, wenn viel auf einmal angefragt wird (wie eben bei einem kompletten Refresh einer schon etwas komplexeren Seite).
Hallo,
frage ist am "Widget Volume" etwas geändert worden?
Ich wollte gerade die Farbe meines LW12 ändern, leider ohne erfolg.
An meiner FTUI habe ich nichts verändert und es hat so auf jeden Fall funktioniert.
Wie lange es nicht mehr geht kann ich nicht sagen.
<header>TV LED</header>
<div class="cell">
<br>
<div data-type="switch" data-device="TVLED" class="cell"></div>
<div data-type="label" class="cell">An/AUS</div>
<div data-type="volume" data-device="TVLED"
data-min="0"
data-max="360"
data-tickstep="4"
data-get="rgb"
data-set="rgb"
class="hue-tick rgb small top-space"></div>
<div data-type="label" class="cell">Farbe</div>
<br>
<div data-type="volume"
data-device="TVLED"
data-min="0"
data-max="100"
data-tickstep="4"
data-get="dim"
data-set="dim"
class="dim-tick small"></div>
<div data-type="label" class="cell">Helligkeit</div>
</div>
</div>
Zitat von: harry66 am 25 Juni 2015, 21:50:04
frage ist am "Widget Volume" etwas geändert worden?
Sorry, kleiner Fehler von meiner Seite. Ist jetzt wieder i.O.
Zitat von: Brockmann am 25 Juni 2015, 20:06:10
Was genau heißt "gar nichts"? Ich verwende Chrome täglich mit der Tablet UI. Habe allerdings auch kein Dimmer-Widget im Einsatz, aber Circle-Menu und Thermostaten.
Du hast recht, das war unprofessionell beschrieben ;) Also meine UI funktioniert an sich einwandfrei (alle Daten fliessen korrekt), aber klicks auf dieser UI in Chrome mittels der Maus oder Touchscreen (Ultrabook ;) ) lösen keine Aktionen aus. Normalerweise erscheint unten links dann eine kurze Meldung über die erfolgte Meldung - das passiert nicht. Ich habe nesges UI als Basis genommen - dort ist ein Klick zu hören, wenn man mit der Maus irgendwo drauf klickt. Aber ausgelöst wird dennoch nichts :( Ein CircleMenu geht problemlos auf, aber auch darin sind die Buttons nutzlos.
Noch habe ich mir nicht die Mühe gemacht, das mal einzugrenzen - im Firefox und auf dem Tablet gehts ja ;)
Zitat von: nesges am 25 Juni 2015, 16:12:44
Chrome kann Webseiten mit bestimmten Metatags (<meta name="mobile-web-app-capable" content="yes">, ist Standardmässig in FTUI gesetzt) als "Desktop-App" anlegen. Einfach im Browser öffnen und im Menü "Zu Startbildschirm hinzufügen" oder ähnlich (heisst unterschiedlich in verschiedenen Versionen) wählen. Dann nur noch über die Verknüpfung auf dem Homescreen starten -> Fullscreen ohne Statusleiste :)
Gesetzt ist das Metatag in der index.html, auch habe ich die Verknüpfung auf dem Desktop liegen, doch die Statusleiste bleibt...
Zitat von: StefanD am 26 Juni 2015, 14:27:08
Gesetzt ist das Metatag in der index.html, auch habe ich die Verknüpfung auf dem Desktop liegen, doch die Statusleiste bleibt...
Ach Du meinst die Statusleiste von Android. Die kann Chrome (bislang) nicht ausblenden. Obwohl die Entwickler das für die Zukunft angekündigt haben.
Ich meine, mit root-Rechte kann man diese Leiste prinzipiell ausblenden (nicht nur bei Chrome). Es gibt aber auch Apps, die das auf Wunsch oder automatisiert und ohne root machen. Such mal nach "Immersive Mode".
Zitat von: StefanD am 26 Juni 2015, 14:27:08
Gesetzt ist das Metatag in der index.html, auch habe ich die Verknüpfung auf dem Desktop liegen, doch die Statusleiste bleibt...
Da hatte ich dich missverstanden, ich dachte du meinst die Statusleiste des Browsers. Die Androidleiste bekommst du mit Zusatztools weg. Ich benutze https://play.google.com/store/apps/details?id=de.tsorn.FullScreen, das stürzt ab und zu mal ab, was zur Folge hat, dass man keine Möglichkeit mehr hat die Anwendung zu verlassen - aber das stört mich nicht weiter.
Zitat von: nesges am 26 Juni 2015, 14:40:46
Da hatte ich dich missverstanden, ich dachte du meinst die Statusleiste des Browsers. Die Androidleiste bekommst du mit Zusatztools weg. Ich benutze https://play.google.com/store/apps/details?id=de.tsorn.FullScreen, das stürzt ab und zu mal ab, was zur Folge hat, dass man keine Möglichkeit mehr hat die Anwendung zu verlassen - aber das stört mich nicht weiter.
Die hatte ich auch schon getestet, allerdings legt diese App mein Tablet komplett lahm... >:(
Nun bin ich grad bei Hide System Bar (Full Screen) (https://play.google.com/store/apps/details?id=com.dreamori.hidebar) hängen geblieben, die blendet beide Leisten aus, lässt meinen Androiden am leben und ersetzt gleich noch GMD Auto Hide Soft Keys, welche ich bisher (auch) genutzt habe. :)
Guten Abend.
Ich benutze das neue Modul JSONREADINGS http://forum.fhem.de/index.php/topic,38463.0.html (http://forum.fhem.de/index.php/topic,38463.0.html) um von http://www.wunderground.com/ meine 10 Tage Wettervorhersage Readings zu sammeln.
Allerdings habe ich zwei Probleme:
1. Das Weather-Widget (Kleinklima) funktioniert nicht.
2. Als Alternative wollte ich den mitgelieferten Link im Reading "forecast_simpleforecast_forecastday_01_icon_url" anzeigen lassen das klappt leider auch nicht.
könnte mir jemand ein Tip geben, wie ich den Link des Readings dem Widget_img weiter geben kann.
Danke im Vorraus
edit:
hat sich erledigt!!!!
die Lösung
<div data-type="image"
data-device="wetter_wunderground_slapno"
data-get="forecast_simpleforecast_forecastday_01_icon_url"
data-size="40px"
class="cell">
</div>
Ich bekomme das UI unter iOS/WebKit und auch unter OS X Safari nicht hin. Buttons funktionieren nur manchmal, einige gar nicht. Die Thermostaten werden nicht vollständig "befüllt" und beim ersten Aufrufen des UIs stimmen die Stati nicht und werden nur sehr langsam aktualisiert. Ich habe z.B. 6 HM Thermostate und wenn man die Seite das erste Mal lädt, dann stehen in allen Widgets die Anfasser auf "0", was ja wohl bedeutet, dass noch keine Daten geladen sind. Dann werden die Widgets nach und nach aktualisiert, wobei sich aber der Anfasser nicht bewegt, sondern nur die Skala und die measured-temp aktualisiert werden.
Bei den drei kleinen Widgests, welche nur jeweils einen Thermostaten enthalten wird auf dem iPad auch der Wert der desired-temp im Widget nicht gezeichnet, während das bei den anderen beiden Thermostaten funktioniert.
Der einzige Browser, welcher bei mir richtig spielt ist Firefox - selbst Safari und Chrome unter OS X machen das nicht richtig. Hat das irgendjemand unter iOS hinbekommen? Vielleicht liegts ja auch an meinder index.html:
<!DOCTYPE html>
<html manifest="ui.appcache">
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta name='gridster_disable' content='1'> <!-- disable drag and drop -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>KUECHE</header>
<div data-type="thermostat"
data-device="Heizung_Kueche_Clima"
data-valve="ValvePosition"
data-get="desired-temp"
data-temp="measured-temp"
class="cell">
</div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header>BAD OG</header>
<div data-type="thermostat"
data-device="Heizung_Bad_OG_Clima"
data-valve="ValvePosition"
data-get="desired-temp"
data-temp="measured-temp"
class="cell">
</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>SCHLAFZIMMER</header>
<div data-type="thermostat"
data-device="Heizung_OG_Eltern_Clima"
data-valve="ValvePosition"
data-get="desired-temp"
data-temp="measured-temp"
class="cell">
</div>
</li>
<li data-row="2" data-col="1" data-sizex="4" data-sizey="2">
<header>WOHNZIMMER</header>
<div class="container">
<div class="left">
<div class="cell">
<div data-type="thermostat" data-device="Heizung_Whz_Terrasse_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp"></div>
<div data-type="label" class="cell">Terrasse</div>
</div>
</div>
<div class="left">
<div class="cell">
<div data-type="thermostat" data-device="Heizung_Whz_Flur_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp"></div>
<div data-type="label" class="cell">Esstisch</div>
</div>
</div>
<div class="left">
<div class="cell">
<div data-type="dimmer" data-device="Licht_Whz_Esstisch_Dimmer" data-get-on="!off" data-get-off="off"></div>
<div data-type="label" class="cell">Esstisch</div>
<div data-type="dimmer" data-device="Licht_Whz_Decke_Dimmer" data-get-on="!off" data-get-off="off"></div>
<div data-type="label" class="cell">Decke</div>
</div>
</div>
<div class="left">
<div data-type="switch" data-device="Steckdose_Whz_Garten_Sw" class="cell"></div>
<div data-type="label" class="cell">TV-Licht</div>
</div>
<div class="right">
<div class="cell">
<div data-type="symbol" data-device="Fensterkontakt_Whz_Terrasse" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terassentür offen</div>
<div data-type="symbol" data-device="Tuergriff_Whz_Terrasse" class="narrow"></div>
<div data-type="label" class="narrow darker small">Terassentürgriff</div>
</div>
</div>
<div data-type="push"
data-device="allesAusWhz"
data-cmd="trigger"
data-set-on="on"
class="cell">
</div>
<div data-type="push"
data-device="LichtSzeneTV"
data-cmd="trigger"
data-set-on="on"
data-icon="fa-film"
class="cell">
</div>
</div>
</li>
</ul>
</div>
</body>
</html>
Bin für jeden Hinweis dankbar.
Hallo Zusammen,
ich stehe noch ganz am Anfang von FHEM Tablet UI und habe folgendes Problem.
Ich möchte eine Heizung und einen Schaler darstellen.
Zitat<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>BADTEST</header>
<div data-type="thermostat"
data-device="Heizung.2OG.Bad"
data-get="desired-temp"
data-temp="measured-temp"
class="cell">
</div>
</li>
Zitat<li data-row="1" data-col="8" data-sizex="1" data-sizey="1">
<header>ZimmerTEST</header>
<div data-type="switch" data-device="Licht.Wz" class="cell"></div>
<div data-type="label" class="cell">Licht.Wz</div>
</li>
Wenn ich per Webbrowser auf die index.html gehe wird mir nichts angezeigt.
(http://up.picr.de/22364167ls.jpg)
(http://up.picr.de/22364168ld.jpg)
In der Javascript Konsole bekomme ich folgendes angezeigt:
(http://up.picr.de/22364169wj.jpg)
Vielen Dank für eure Hilfe.
Lapidu
New Widget: Popup WidgetDamit kann man, ähnlich wie beim Circle Menü, selten gebrauchte Widgets in ein Sub-Menü verfrachten. Beim Klick auf das Trigger-Widget (beliebig: Image, Button, Label o.ä.), öffnet sich mittig ein modaler Dialog, der beliebige andere FTUI Widgets zeigt.
Anwendungsfälle:
- Submenü für Station-Umschalter (TV/Radio Sender mit Icon)
- Wetter Details nach Klick auf Label "Wetter"
- Mini Cam-Vorschau nach Klick als großes Bild
- Mini Chart nach Klick als großes Chart
HTML-Struktur:
<div data-type="popup">
<div data-type="..." ></div>
<div class="dialog">
<header>DIALOG-HEADER</header>
<div data-type="..."></div>
<div data-type="..."></div>
<div data-type="..."></div>
</div>
</div>
Das erste Widget ist das sichtbare Main-Widget, alle Widgets unterhalb <div class="dialog"> erscheinen erst bei Klick auf das Main-Widget.
Mit Überschreiben der Parameter data-device, data-get, data-get-on und data-get-off kann man sogar das Öffnen und Schließen des Dialogs per FHEM Reading steuern.
Anwendungsfall:
- Türklingel ändert ein Reading in FHEM und auf der UI poppt das Kamerabild der Tür-Cam auf
Code-Beispiel (Mini-Chart -> Big-Chart):
<div data-type="popup" data-width="450px">
<div data-type="simplechart"
data-logdevice="FileLog_OutTemp"
data-columnspec="4:temp"
data-minvalue="-25"
data-maxvalue="35"
data-height="50"
data-width="100"
class="cell">
</div>
<div class="dialog">
<header>BIG-CHART</header>
<div data-type="simplechart"
data-logdevice="FileLog_OutTemp"
data-columnspec="4:temp"
data-minvalue="-25"
data-maxvalue="35"
data-yticks="5"
data-height="150"
class="cell">
</div>
</div>
</div>
Zitat von: lapidu am 27 Juni 2015, 09:58:24
Hallo Zusammen,
ich stehe noch ganz am Anfang von FHEM Tablet UI und habe folgendes Problem.
Ich möchte eine Heizung und einen Schaler darstellen.
Wenn ich per Webbrowser auf die index.html gehe wird mir nichts angezeigt.
(http://up.picr.de/22364167ls.jpg)
(http://up.picr.de/22364168ld.jpg)
In der Javascript Konsole bekomme ich folgendes angezeigt:
(http://up.picr.de/22364169wj.jpg)
Vielen Dank für eure Hilfe.
Lapidu
Gib mal <meta name="debug" content="1"> in die index.html und schaue dir den Output in der Console an.
Gleich am Anfang sieht man das Plugin-Dir. Das liegt relativ von FHEM im www Ordner. Im js-Ordner müssten alle benutzen Plugins liegen. Ist dort widget_switch.js dabei?
"Plugin dir: /fhem/tablet/js" fhem-tablet-ui.js:113:0
"Filename: index.html" fhem-tablet-ui.js:117:0
"Collecting required readings" fhem-tablet-ui.js:199:0
"Request readings from FHEM" fhem-tablet-ui.js:210:0
"Loaded plugin: widget_popup" fhem-tablet-ui.js:36:0
"Loaded plugin: widget_simplechart" fhem-tablet-ui.js:36:0
"Loaded plugin: widget_label"
Was sagen andere Browser? Hast du das Recht die *.js Files zu öffnen?
Servus!
Ich wollte mal fragen ob jemand das Thermostat Widget mit einer mehrgeteilten Datenquelle benutzt hat.
Ich benutze einen KNX Thermostat, den ich durch 3 Fhem Elemente steuern und lesen kann:
GWC_Sollwert | Rückleseelement für den eingestellten Sollwert |
GWC_Komfortsollwert | Schreibelement für den Sollwert |
GWC_Temperaturmesswert | Der aktuelle Temperaturmesswert im Raum |
Ich hatte schon viel gebastelt um per notifies alle Werte in ein Dummy zu verschachteln und bei Änderung der Werte wieder entsprechend zu schreiben. Jedoch ist das ein ganz schönes Gebastel und macht die Steuerung nicht wirklich übersichtlicher.
Hätte sonst noch das Widget zu einem extended-ThermostatWidget umgebastelt, aber vielleicht hat ja jemand eine einfachere Lösung dafür?
Vielen Dank schon mal für anregende Ideen!
VG
Bernd
Zitat von: berndp am 27 Juni 2015, 15:19:43
Servus!
Ich wollte mal fragen ob jemand das Thermostat Widget mit einer mehrgeteilten Datenquelle benutzt hat.
Ich benutze einen KNX Thermostat, den ich durch 3 Fhem Elemente steuern und lesen kann:
GWC_Sollwert | Rückleseelement für den eingestellten Sollwert |
GWC_Komfortsollwert | Schreibelement für den Sollwert |
GWC_Temperaturmesswert | Der aktuelle Temperaturmesswert im Raum |
Ich hatte schon viel gebastelt um per notifies alle Werte in ein Dummy zu verschachteln und bei Änderung der Werte wieder entsprechend zu schreiben. Jedoch ist das ein ganz schönes Gebastel und macht die Steuerung nicht wirklich übersichtlicher.
Hätte sonst noch das Widget zu einem extended-ThermostatWidget umgebastelt, aber vielleicht hat ja jemand eine einfachere Lösung dafür?
Vielen Dank schon mal für anregende Ideen!
VG
Bernd
Der Grundstein dafür ist schon gelegt. Es gibt auch schon einige Widgets, die externe Readings einbeziehen können. Zum Beispiel Label Widget mit dem data-limits-get. Da kann man mit DEVICE:READING arbeiten. Eventuell ist das auch unkompliziert in andere Widgets aufnehmbar.
Erstmal Danke für die rasche Umsetzung!
Das popup-widget funktioniert bei mir allerdings noch nicht richtig. Es wird war ein Pop-Up geöffnet, dieses aber "rechts neben" des gridster-Rasters. Zudem wird beim Schliessen des Pop-Ups automatisch auf die Default-Pagetab-Seite "geschalten". Soll das so sein, bzw. kann man das per data-blabla beeinflussen?
Hast Du am image-Widget auch was geschraubt?
Ich bekomme nun kein Bild mehr angezeigt, wenn ich den MJPEG-Stream als Image-URL angebe...
Upps, das Zusammenspiel mit pagetab habe ich noch gar nicht getestet.
Wie hast du das definiert? Schon innerhalb eines Gridster <li> ?
So isses eingebaut:
<li data-row="6" data-col="9" data-sizex="6" data-sizey="4">
<header>GARTENTEICH</header>
<div data-type="popup">
<div data-type="image"
data-url="http://192.168.1.34/jpeg/vga.jpg"
data-size="350"></div>
<div class="dialog">
<div data-type="image"
data-url="http://192.168.1.34/mjpeg"
data-size="750"</div>
</div>
</div>
</li>
Allerdings scheint, wie gesagt der MJPEG-Stream nimma zu gehen, dem Pop-Up lässt sich anscheinend keine Größe zuordnen und die PopUp-Position ist quasi "off-limits"... sprich auf dem Tablet für es zu einem faktischen Freeze, weil ich durch mein block-on-move-event natürlich nicht mehr scrollen kann und deshalb auch das "close"-Kreuzchen nicht clicken/ touchen kann ;-)
Hallo zusammen,
ich möchte gerne die Aussentemperatur anzeigen lassen.
Zitat<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<div data-type="label"
data-device="AussenTemp"
data-get="measured-temp"
data-limits='[-73,19,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell inline big">
</div>
</li>
Dieser Code zeigt folgendes an:
(http://up.picr.de/22370478kx.jpg)
Ich bekomme von dem Fühler im FHEM Temperatur und Luftfeuchtigkeit zusammen.
Wie kann ich beide Werte einzeln anzeigen lassen?
Wie kann ich die Farbe vom Text ändern?
Danke
Lapidu
Ist das ein HomeMatic-Fühler ... da gibt es dann aber auch einzelne Readings für Temperatur und Feuchte
Ansonsten mit data-part arbeiten. data-part="2" oder data-part="4"
Danke, hat mit den Readings geklappt.
Hallo zusammen,
habe mal wieder eine Frage zum Tablet UI.
Mann hat ja die Möglichkeit die Widgets per Drag & Drop auf der Website zu verschieben.
Wenn man die Seite neu lädt, sind die Widget wieder so wie sie vorhe waren.
Wie kann man das abspeichern?
Danke.
Lapidu
Ich bräuchte mal hilfen beim erstellen eines Plots mit simplechart und dlog.
Ich komme einfach nicht weiter wie ich die Daten abgreifen muss.
Mein logdevice ist myDbLog mit logfile in HISTORY. Für die einzelnen Geräte lasse ich immer State loggen und greife die Daten dann ab.
Z.Bsp. mein Thermostat schreibt in den state T: 24.3 desired: 5.0 valve: 0 und über die gplot holle ich mit #DbLog <SPEC1>:state:::$val=~s/.*T:\s([-\.\d]+).*/$1/eg die Temperatur für den Plot.
Doch ich weiß einfach nicht wie ich das ganze mit columnspec abgreifen muss damit es mir den plot darstellt.
<div data-type="simplechart"
data-logdevice="myDbLog"
data-logfile="HISTORY"
data-columnspec="DbLog:myDbLog:????"
data-yticks="2"
data-daysago="0"
data-caption="Temperatur"
class="fullsize">
Kann mir da jemand weiterhelfen?
So, jetzt brauch ich doch mal Hilfe.
Ich komme einfach nicht weiter.
Die Idee war eine Art "Config-Extension" zu schreiben mit der es möglich ist die Pages auszulagern.
Im Anhang mein aktueller Stand.
Ich bekomme es nicht hin, dass die Widgets nicht mehrfach geladen werden.
Vielleicht kann sich das mal einer anschauen. Wäre super.
Kurze Erläuterung:
Index.html
- Hier wird nur noch das Gridster definiert. Aber keine Pages mehr.
ftuiConfig.json
- Templates werden als "Pool" definiert
- fixedGridsterWidgets sind Templates die auf allen Pages immer dargestellt werden
- pages sind die einzelnen Ansichten ohne die fixed Templates
widget_pagebutton
- ruft die definierte Page aus der Config anhand der ID auf. Ist aber noch nicht komplett fertig!
fhem-tablet-ui-config
- lädt die Konfigurationsdatei
- stellt Funktionen für den Seitenaufbau zur Verfügung
EDIT: hab noch meine fhem-tablet-ui-user.css angehangen. Sonst funktionieren die Designs aus der Config nicht.
Zitat von: tomster am 27 Juni 2015, 17:04:33
Erstmal Danke für die rasche Umsetzung!
Das popup-widget funktioniert bei mir allerdings noch nicht richtig. Es wird war ein Pop-Up geöffnet, dieses aber "rechts neben" des gridster-Rasters. Zudem wird beim Schliessen des Pop-Ups automatisch auf die Default-Pagetab-Seite "geschalten". Soll das so sein, bzw. kann man das per data-blabla beeinflussen?
Die Beeinflussung von Pagetab durch den Popup Close Button konnte ich durch Wechsel von einem Hyperlink zu einem normalen DIV verbessern. Mit dem Fehler mit Gridster konnte ich aber nicht nachvollziehen. Hast du vllt. Änderungen im CSS gemacht, die das verursachen? Probiere mal temporär die CSS von Github.
Wenn ich einen Switch mit mulitStates (also data-get-on ist array) anlege habe ich keine Möglicht gefunden zu definieren, was der initiale Zustand des switches sein soll.
m.a.W. Der status wird richtig angezeigt, der innere Zustand des Knopes ist aber immer direkt nach dem Laden "off", oder habe ich etwas im Code übersehen?
Hintergrund ich habe eine Keymatic:
<div data-type="switch" data-device="eine_keymatic"
data-get-on='["locked","unlocked","unlocked (uncertain)","locked (uncertain)"]'
data-icons='["fs-lock","fs-unlock","fs-unlock fa-blink","fs-lock fa-blink"]'
data-on-colors='["#aa6900","#aa6900","#505050","#505050"]'
data-on-background-colors='["#aa6900","#aa6900","#505050","#505050"]'
data-set-on="lock" data-set-off="unlock"
data-background-icon="fa-square-o" class="">
</div>
Alles läuft gut, aber beim ersten Click (nach dem Neuladen) wird immer der Befehl lock gesendet auch wenn der Zustand bereits "locked" entspricht. Also scheint der innere Zustand des switches immer initial "off" zu sein.
Zitat von: viegener am 28 Juni 2015, 13:35:27
Wenn ich einen Switch mit mulitStates (also data-get-on ist array) anlege habe ich keine Möglicht gefunden zu definieren, was der initiale Zustand des switches sein soll.
m.a.W. Der status wird richtig angezeigt, der innere Zustand des Knopes ist aber immer direkt nach dem Laden "off", oder habe ich etwas im Code übersehen?
Ok, selbst ist der Mann: Habe eine Änderung gemacht und als Pull request überstellt.
Dabei wird jetzt der erste Zustand in data-get-on als ON interpretiert und alle anderen als OFF.
Ist erstmal nur eine Minimallösung, denn eigentlich bräuchte man einen richtigen Automaten mit Übergängen und Zuständen, aber das wäre jetzt bei der Wärme wohl overkill...
Wers ausprobieren will:
in windget_famultibutton.js muss die funktion showMultiStates wie folgt am Ende aussehen
(nur die 6 Zeilen ab "var faelem" sind neu):
var idx=indexOfGeneric(states,state);
if (idx>-1){
var faelem = elem.data('famultibutton');
if ( idx == 0 ) {
faelem.setOn();
} else {
faelem.setOff();
}
elm.removeClass()
.addClass('fa fa-stack-1x')
.addClass(icons[idx])
.css( "color", colors[idx] );
var bgelm=elem.children().filter('#bg');
bgelm.css( "color", bgcolors[idx]);
}
Zitat von: setstate am 28 Juni 2015, 13:19:18
Die Beeinflussung von Pagetab durch den Popup Close Button konnte ich durch Wechsel von einem Hyperlink zu einem normalen DIV verbessern. Mit dem Fehler mit Gridster konnte ich aber nicht nachvollziehen. Hast du vllt. Änderungen im CSS gemacht, die das verursachen? Probiere mal temporär die CSS von Github.
Bei mir erscheint das popup innerhalb vom Gridster-bereich allerdins sieht es so aus, als ob die Position des Popups von der Fenstergrösse abhängt (Beim Verändern der Fenstergrösse wandert das Popup) und es scheint, als ob die linke (obere ?) Ecke des popups mittig positioniert wird, denn diese erscheint etwa in der Mitte des Fensters.
(In diesem Fall Firefox auf Windows und safari auf iOS-ipad)
Zitat von: setstate am 27 Juni 2015, 13:31:11
New Widget: Popup Widget
Damit kann man, ähnlich wie beim Circle Menü, selten gebrauchte Widgets in ein Sub-Menü verfrachten. Beim Klick auf das Trigger-Widget (beliebig: Image, Button, Label o.ä.), öffnet sich mittig ein modaler Dialog, der beliebige andere FTUI Widgets zeigt.
Anwendungsfälle:
- Submenü für Station-Umschalter (TV/Radio Sender mit Icon)
- Wetter Details nach Klick auf Label "Wetter"
- Mini Cam-Vorschau nach Klick als großes Bild
- Mini Chart nach Klick als großes Chart
Hallo setstate,
es einmal vielen Dank an Dich und alle anderen für die super Arbeit. :D
Wie kann ich es anstellen, das das Popup in der Mitte "aufpoppt" ?
Zur Zeit erscheint es bei mir zu weit unten, Siehe Anhang.
Auf dem Tablet muss ich dann immer scrollen.
Gruß
Jens
Zu dem Problem mit simplechart und dblog habe ich die Lösung selber gefunden mit hilfe der commandref von dblog, denn dort steht
where column_spec is <device>:<reading>:<default>:<fn>
Damit sieht das ganze dann so aus
data-type="simplechart"
data-logdevice="myDbLog"
data-logfile="HISTORY"
data-columnspec="BZ.Stellantrieb_Clima:state:::$val=~s/.*T:\s([-\.\d]+).*/$1/eg"
data-minvalue="0"
data-maxvalue="40"
class="fullsize"
<
Zitat von: lapidu am 28 Juni 2015, 06:46:43
Hallo zusammen,
habe mal wieder eine Frage zum Tablet UI.
Mann hat ja die Möglichkeit die Widgets per Drag & Drop auf der Website zu verschieben.
Wenn man die Seite neu lädt, sind die Widget wieder so wie sie vorhe waren.
Wie kann man das abspeichern?
Danke.
Lapidu
Hat schon jemand eine Idee?
Zum Speichern geänderter Gridster Koordinaten ist keine Funktion implementiert. War auch nicht vorgesehen. Das Bewegen ist nur ein zufälliges Feature, was Gridster mitbringt.
Ok, ich habe in der widget_popup.js die Zeilen :
top: ($(window).height() - dialog.outerHeight()) /2,
left: ($(window).width() - dialog.outerWidth()) / 2Geändert in:
top: ($(window).height() - dialog.outerHeight()) / 9,
left: ($(window).width() - dialog.outerWidth()) / 3So ist es zumindest bei mir in der Mitte. :)
Gruß
Jens
Zitat von: Jewo am 28 Juni 2015, 14:22:56
Hallo setstate,
es einmal vielen Dank an Dich und alle anderen für die super Arbeit. :D
Wie kann ich es anstellen, das das Popup in der Mitte "aufpoppt" ?
Zur Zeit erscheint es bei mir zu weit unten, Siehe Anhang.
Auf dem Tablet muss ich dann immer scrollen.
Gruß
Jens
ich habs auf
dialog.css({
top: ($(window).height() / 2 - dialog.outerHeight()) / 2,
left: ($(window).width() / 2 - dialog.outerWidth()) / 2
});
geändert. Passt doch universeller, oder?
Gibt es eine Möglichkeit bei simplechart die min und max Anzeige in Abhängigkeit der Werte automatisch festzulegen?
data-minvalue= kleinster Wert im plot
data-maxvalue= größter Wert im plot
Zitat von: setstate am 28 Juni 2015, 18:45:20
ich habs auf
dialog.css({
top: ($(window).height() / 2 - dialog.outerHeight()) / 2,
left: ($(window).width() / 2 - dialog.outerWidth()) / 2
});
geändert. Passt doch universeller, oder?
Bei mir nicht, aber wenn ich aus dem Minus ein Plus mache passt es sehr gut.
Also:
dialog.css({
top: (($(window).height() / 2) + dialog.outerHeight()) / 2,
left: (($(window).width() / 2) + dialog.outerWidth()) / 2
});
Hallo zusammen,
ich habe eine Frage und wollte mal fragen ob sowetwas überhaupt möglich ist.
Ich habe folgende Geräte:
Verstärker Marantz - verwende ich mit dem Denon-Modul.
MacMini - hier verwende ich das iTunes-Modul
VUPlus (Enigma2-Fernsehbox) - hier verwende ich das Enigma2-Modul
nun möchte ich , abhängig vom Input des Verstärkers, die buttons "Skip", "Play" und "Pause", unterschiedlich belegen (damit ich nicht für jedes Device extra Buttons benötige):
Mit anderen Worten:
Wenn der Input-Kanal meines Verstärkers "Tuner" ist, möchte ich gern über die "Skip"-buttons den Radiosender wechseln.
Wenn der Input-Kanal meines Verstärkers "mPlay" ist, möchte ich über die "Skip"-Buttons den iTunes-Song wechseln.
Wenn der Input-Kanal meines Verstärkers "SAT/Cabel" ist, möchte ich über die "Skip"-Buttons den Fernsehsender wechseln.
Für jeden Hinweis bin ich sehr dankbar.
vielen Dank und einen guten Wochenstart
wolf
Zitat von: wolfram am 29 Juni 2015, 11:51:32
Wenn der Input-Kanal meines Verstärkers "Tuner" ist, möchte ich gern über die "Skip"-buttons den Radiosender wechseln.
Wenn der Input-Kanal meines Verstärkers "mPlay" ist, möchte ich über die "Skip"-Buttons den iTunes-Song wechseln.
Wenn der Input-Kanal meines Verstärkers "SAT/Cabel" ist, möchte ich über die "Skip"-Buttons den Fernsehsender wechseln.
Eine Möglichkeit dafür wäre mit FHEM-Mitteln eine Kombination aus Notify (oder DOIF) und Trigger.
Also für die jeweilige Funktion (z.B. Skip) ein einzelnes notify anlegen, bei dem im Commandteil der Status des Input-Kanal ausgewertet wird und dann per If der entsprechende Befehl an den richtigen Device gesendet wird. Das kann man prinzipiell auch über DOIF machen, allerdings finde ich das umständlicher, weil mehr verschiedene Ausdrücke beteiligt sind.
Der Trigger Befehl wird dann im tablet ui hinter den Button gelegt, in dem man data-cmd und data-set entsprechend mit dem trigger-daten belegt
Hallo viegener,
zuerst einmal danke für die schnelle Antwort. Ich dachte mir schon, dass ich in fhem-native anfangen muss.
Könntest Du mir mit dem notify und dem Skip vielleicht noch unter die Arme greifen? Ich bin leider nicht so der Pro und glaube, dass ich das aus eigener Kraft nicht ganz hinbekomme - ein beispielhafter Ansatz reicht mir.
Den Input meines Verstärkers kann ich abfragen mit: "get marantz input" - das Ergebnis ist dann z.B. "SAT/CBL"
Wie bekomme ich jetzt diese Daten in ein notify, und dann wiederum in einen "skip"-Befehl?
vielen Dank und LG
wolf
Ich versuche es mal als Trockenübung, da ich momentan nicht zuhause und damit ohne Zugriff auf mein fhem bin. Also bitte mit Vorsicht geniessen, da ich weder perl noch fhem Korrektheit prüfen konnte:
Also in fhem müsste ein Device (Typ notify) angelegt werden, dass für den jeweiligen Befehl (z.B. skip) den richtigen Befehl an das richtige Zielgerät abschickt. Das müsste ungefähr so aussehen:
define groupSkip notify groupSkip {
my $groupSkip _input = ReadingsVal( "marantz", "input", "" );
if ( $groupSkip _input eq "Tuner" ) {
fhem( 'set ...' );
} elsif ( $groupSkip _input eq "SAT/CBL" ) {
fhem( 'set ...' );
} elsif ( $groupSkip _input eq "mPlay" ) {
fhem( 'set ...' );
}
}
Bei 'set ...' ist jeweils der richtige fhem Befehl für den Deivce einzutragen.
Am besten probierst Du das dann innerhalb von fhem aus in dem Du als Kommando in fhemweb "trigger groupSkip" einträgst und dann mal im Log/eventviewer schaust was passiert.
Analog ist ein eigener Notify für alle anderen Kommandos anzulegen (z.B. groupPlay), der natürlich anders heissen muss und andere set-Kommandos beinhaltet. Ansonsten aber analog aufgebaut ist.
Wenn das geht, kannd im tablet ui ein Push angelegt werden, der den Trigger-befehl aufruft, diese sollte wohl folgende Parameter haben:
data-device="groupSkip"
data-cmd="trigger"
data-set=""
Und jetzt bitte korrigiert mich wenn das so nicht funktioniert oder etwaige Fehler enthält,
Johannes
Danke, johannes fürs Brücke bauen - ich werde es heute Abend mal versuchen und Rückmeldung geben.
LG
wolf
Zitat von: setstate am 28 Juni 2015, 18:45:20
ich habs auf
dialog.css({
top: ($(window).height() / 2 - dialog.outerHeight()) / 2,
left: ($(window).width() / 2 - dialog.outerWidth()) / 2
});
geändert. Passt doch universeller, oder?
Peinlich, die Klammer ist noch falsch gewesen ...
Zitat
- top: ($(window).height() / 2 - dialog.outerHeight()) / 2,
- left: ($(window).width() / 2 - dialog.outerWidth()) / 2
+ top: ($(window).height() / 2 - dialog.outerHeight() / 2),
+ left: ($(window).width() / 2 - dialog.outerWidth() / 2)
Update ist gemacht.
Plus: Schließen des Dialogs jetzt auch einfach beim Klick auf den Hintergrund.
Hallo Johannes,
ich habe es so versucht wie Du beschrieben hast:
Zitat von: viegener am 29 Juni 2015, 14:39:29
define groupSkip notify groupSkip {
my $groupSkip _input = ReadingsVal( "marantz", "input", "" );
if ( $groupSkip _input eq "Tuner" ) {
fhem( 'set ...' );
} elsif ( $groupSkip _input eq "SAT/CBL" ) {
fhem( 'set ...' );
} elsif ( $groupSkip _input eq "mPlay" ) {
fhem( 'set ...' );
}
}
Und jetzt bitte korrigiert mich wenn das so nicht funktioniert oder etwaige Fehler enthält,
Johannes
define groupSkip notify groupSkip {
my $groupSkip _input = ReadingsVal( "Marantz", "input", "" );
if ( $groupSkip _input eq "MPLAY" ) {
fhem( 'set minime next' );
} elsif ( $groupSkip _input eq "SAT/CBL" ) {
fhem( 'set VuPlus channelDown' );
} elsif ( $groupSkip _input eq "tuner" ) {
fhem( 'set tuner next' );
}
}Leider bekomme ich aber folgende Fehlermeldung - da ich aber nicht so der Coder bin (irgendwo fehlt bestimmt ne Klammer o.ä.) frage ich nochmal um Hilfe.
Danke wolf
und hier die Fehlermeldung:
Unknown command my, try help. Unknown command if, try help. Unknown command fhem(, try help. Unknown command }, try help. Unknown command fhem(, try help. Unknown command }, try help. Unknown command fhem(, try help. Unknown command }, try help. Unknown command }, try help.
Ja, das kann so nicht gehen, hier ist mal ein verbesserter Vorschlag, bei dem meine Fehler bei den Leerzeichen und den Semikolons beseitigt sind (Zeichensetzung war noch nie meine Stärke). Deine Befehle habe ich mitübernommen:
define groupSkip notify groupSkip {
my $groupSkip_input = ReadingsVal( "Marantz", "input", "" );;
if ( $groupSkip_input eq "MPLAY" ) {
fhem( 'set minime next' );;
} elsif ( $groupSkip_input eq "SAT/CBL" ) {
fhem( 'set VuPlus channelDown' );;
} elsif ( $groupSkip_input eq "tuner" ) {
fhem( 'set tuner next' );;
}
}
Guten Morgen Johannes,
mit
define groupSkip notify groupSkip {
my $groupSkip_input = ReadingsVal( "Marantz", "input", "" );;
if ( $groupSkip_input eq "MPLAY" ) {
fhem( 'set minime next' );;
} elsif ( $groupSkip_input eq "SAT/CBL" ) {
fhem( 'set VuPlus channelDown' );;
} elsif ( $groupSkip_input eq "tuner" ) {
fhem( 'set tuner next' );;
}
}
bekomme ich leider auch wieder nur:
Unknown command my, try help. Unknown command if, try help. Unknown command fhem(, try help. Unknown command }, try help. Unknown command fhem(, try help. Unknown command }, try help. Unknown command fhem(, try help. Unknown command }, try help. Unknown command }, try help.
für mich sieht die Fehlermeldung genauso aus....scheinbar stösst sich fhem schon an dem "my" in der 2. Zeile.
Viele Grüße und einen sonnigen Tag
wolf
Wenn du das so in die fhem.cfg eingetragen hast, dann muss hinter jede Zeile ein "\"...
Danke fhemler,
Werde es leider erst heut Abend testen können und dann Rückmeldung geben.
Gesendet von iPhone mit Tapatalk
Ja fhemler hat recht, Danke!
Das Codebeispiel war für Copy und Paste in fhemweb's-Kommandofeld gedacht, dann wird es automatisch in eine Zeile zusammengefasst. Bei Eingabe in fhem.cfg muss am Ende jeweils der \ stehen, damit beim Einlesen klar ist, dass das Kommando noch weitergeht. Ansonsten wird die nächste Zeile als getrenntes FHEM.cfg aufgefasst und dort gibt es kein my, denn das ist ja eigentlich Teil des Perl-Ausdrucks in den geschweiften Klammern.
Johannes
Asche auf mein Haupt, hätte ich eigentlich wissen müssen - wie gesagt ich probier es einfach heute Abend noch einmal.
Danke vielmals.
wolf
Hallo,
ich habe erhebliche Probleme das Tablet UI im Browser anzuzeigen. ( Verwende Firefox, beim Chrome habe ich das selbe Problem)
Wenn ich die Seite aufrufe kommt folgendes:
(http://up.picr.de/22400416vt.jpg)
nach mehrmaligen Refresh der Seite und Löschung des Caches passt es dann
(http://up.picr.de/22400417vf.jpg)
Hat jemand einen Tipp?
Vielen Dank.
Lapidu
poste mal deinen index-file
Zitat<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<frameset>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="2">
<header>Wohnung Bad</header>
<div data-type="thermostat"
data-device="Heizung.1OG.rechts.Bad"
data-get="desired-temp"
data-temp="measured-temp"
data-min="4"
data-off="off"
class="cell">
</div>
<div data-type="label"
data-device="Heizung.1OG.rechts.Bad"
data-get="measured-temp"
data-limits='[-73,19,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell inline big">
</div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2">
<header>Wohnung Kinder</header>
<div data-type="thermostat"
data-device="Heizung.1OG.rechts.Kinder"
data-get="desired-temp"
data-temp="measured-temp"
data-min="4"
data-off="off"
class="cell">
</div>
<div data-type="label"
data-device="Heizung.1OG.rechts.Kinder"
data-get="measured-temp"
data-limits='[-73,19,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell inline big">
</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="2">
<header>Wohnung Schlaf</header>
<div data-type="thermostat"
data-device="Heizung.1OG.rechts.Schlaf"
data-get="desired-temp"
data-temp="measured-temp"
data-min="4"
data-off="off"
class="cell">
</div>
<div data-type="label"
data-device="Heizung.EG.Bad"
data-get="measured-temp"
data-limits='[-73,19,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell inline big">
</div>
</li>
</ul>
</div>
</body>
</html>
Da steht ein einzelnes <frameset> herum, das mir nicht einleuchtet...
Ansonsten:
Vielleicht macht es Sinn mal Firebug in Firefox zu installieren, dann die Console zu öffenen (in Firebug) und nach Fehlermeldungen zu filtern. Wenn Du dort Fehlermeldungen siehst (werden dann in rot angezeigt), gibt das vermutlich einen Hinweis auf das Problem
Johannes
Also bei mir klappt es problemlos mit einem IE ...
Aber: seit dem Update auf den aktuellen Stand fehlen bei mir jetzt ALLE Inhalte >:( auch nachdem ich jede Menge Fehlermeldungen entfernt habe, ausgelöst durch doppelte " , die vorher nicht angemeckert worden sind, kommt kein Inhalt mehr :(
Zitat von: Nobby1805 am 30 Juni 2015, 16:45:08
Aber: seit dem Update auf den aktuellen Stand fehlen bei mir jetzt ALLE Inhalte
Heisst das, Du bekommst nur eine schwarze Seite, oder wenigstens die Gridster-Fenster?
Wann war das letzte Update für fhem-tablet vorher, ist das Wochen oder nur Tage her?
Vielleicht kannst auch Du Dein index.html posten?
Ich denke nicht, dass das Updaten von fhem-tablet-ui die Fehlermeldung zu Anführungsstrichen auslöst, normalerweise deutet das eher darauf hin, dass die Fehler vorher irgendwie überdeckt waren (2 doppelte Anführungsstriche gleichen sich auch zum Teil wieder aus).
OK ... läuft jetzt wieder ... aber zuerst die Fragen beantwortet
Zitat von: viegener am 30 Juni 2015, 16:57:20
Heisst das, Du bekommst nur eine schwarze Seite, oder wenigstens die Gridster-Fenster?
die Gridster Fenster sind gekommen und ein Fenster mit einem iframe drin
Zitat
Wann war das letzte Update für fhem-tablet vorher, ist das Wochen oder nur Tage her?
Das letzte Update war vom 16.6.
Wie gesagt ... 2 alte Index.html von mir liefen nicht mehr und eine neue Version (die von lapidu) hingegen bei mir sogar besser als bei ihm
Des Rätsels-Lösung:
<meta name="debug" content="1"> <!-- 1=output to console;0=not output -->
Warum auch immer mag er den Debug-Output zur Konsole nicht mehr, bzw. dann wird NUR noch zur Konsole ausgegeben ... wenn ich dort "0" eintrage ist alles wieder OK
Mit der aktuellen Version von simplechart vermisse ich die senkrechten Linien (xticks) und die waagrechte Linie bei 30°
Also bei mir zeigt der firebug keinen Fehler an. Jetzt aktuell zeigt er wieder alles normal an.
Die Frage ist wie lange.
Zitat von: Nobby1805 am 30 Juni 2015, 17:14:22
Des Rätsels-Lösung:
<meta name="debug" content="1"> <!-- 1=output to console;0=not output -->
Warum auch immer mag er den Debug-Output zur Konsole nicht mehr, bzw. dann wird NUR noch zur Konsole ausgegeben ... wenn ich dort "0" eintrage ist alles wieder OK
Das ist ja mal wirklich eine gute Rätsellösung!
Ich kann das Problem bei mir nachvollziehen. Da scheint irgendwo eine Debug-Ausgabe probleme zu bereiten...
Konnte das Probleme auf Anhieb aber nicht sehen. Momentan also Debug=0...
Die Widgets, in meiner index.html zeigen keine Fehler bei der Debug-Ausgabe, deshalb kann ich das nicht nachvollziehen. Zum Eingrenzen der Ursache müsstet ihr mal bitte die bei euch genutzen plugins explizit laden (nicht per loadplugin Funktion). Dazu einfach pro Widget eine zusätzliche Zeile in die index.html aufnehmen (nachher wieder rauslöschen). Damit sieht man die Fehler in der Web-Console besser.
<script type="text/javascript" src="/fhem/tablet/js/widget_widgetname.js"></script>
z.B. <script type="text/javascript" src="/fhem/tablet/js/widget_circlemenu.js"></script>
Hi setstate,
ich finde die Ursache nicht. Inzwischen habe ich meine Seite auf ein einzelnes pagetab-widget runterreduziert. Alle caches ausgeschaltet und lade widget_pagetab und auch die widget_famultibutton und widget_widget statisch aus index.html, leider ohne Erkenntnis:
Also mit debug=1 --> keine Fehlermeldung / kein Bild (alles schwarz)
mit debug=0 --> wie gewohnt korrektes Bild (mit dem einen Widget)
Ich bin erstmal ratlos, ich kann jetzt noch das menu-template auflösen und dann den pagetab auflösen.
Allerdings kann ich nicht sagen, seit wann dies bei mir vielleicht schon der Fall ist, da ich debug eigentlich nicht benutzt habe...
Kann es an fhem-tablet-ui.js der Zeile 445 liegen?
cache: DEBUG ? false : true,
vorher stand dort
cache: true,
Zitat von: setstate am 30 Juni 2015, 19:49:40
Kann es an fhem-tablet-ui.js der Zeile 445 liegen?
cache: DEBUG ? false : true,
vorher stand dort
cache: true,
Ja, das scheint es gewesen zu sein. SUPER!!!!!
Ich kann zwar nicht erklären warum, aber aus irgendeinem Grund stolpert (zumindest) firefox darüber ohne eine Meldung zu geben.
Der IE mag auch mit der neuen Version kein DEBUG = 1 >:(
Zitat von: Nobby1805 am 30 Juni 2015, 17:18:14
Mit der aktuellen Version von simplechart vermisse ich die senkrechten Linien (xticks) und die waagrechte Linie bei 30°
Wenn Linien fehlen, muss man mit Höhe, Breite, Abstand und Tick-Abstand etwas experimentieren, damit der Platz für alle Linien ausreichend bleibt.
Mit class="noticks" kann man jetzt das Chart noch mehr vereinfachen. Ab einer Weite von 100 und kleiner wird 'noticks' automatisch gesetzt.
Ich vermute auch hier ein Problem des IE ... auf dem iPad/Safari kommen die Linien ja ...
Ich musste auch vor dem gestrigen Update eine Änderung des Moduls für die xticks auf dem IE durchführen ... ich schaue da noch einmal nach, soweit ich mich erinnere hat der IE das Muster für das "stricheln" der Linie falsch ausgewertet
Ich versuche gerade das Widget für meine Thermostate einzubauen.
Dabei bekomme bei einer Breite von 1 Spalte immer eine Verschiebung der Temperatur.
Bei 2 Spalten Breite wird es richtig angezeigt, siehe Bild Anhang
Anzeigen lasse ich das ganze mit Chrome. Unter IE11 funktioniert die Anzeige nur das Hier die Spalten gespiegelt sind, also das Menü ist nicht mehr links sondern ganz rechts usw.
Weiß jemand woran das liegen kann das die Temperatur nicht mittig liegt?
poste mal wie du das widget aufrufst .. oder am Besten, den ganzen index-file
Anbei die index Datei mit den beiden widgets.
<!DOCTYPE html>
<html>
<head>
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/www/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/powerange.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/www/tablet/css/fhem-tablet-ui-user.css" />
<script type="text/javascript" src="/fhem/www/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<li data-row="2" data-col="2" data-sizex="1" data-sizey="2">
<header>Wohnzimmer</header>
<div data-type="thermostat" data-device="WZ.Thermostat_Climate" data-valve="humidity" data-step="0.5" class="cell"></div>
<div data-type="label" class="cell">Soll</div>
<div data-type="label"
data-device="WZ.Thermostat_Climate"
data-part="4"
data-unit="%B0C%0A" class="cell"></div>
<div data-type="label" class="cell">Ist</div>
<div data-type="label"
data-device="WZ.Thermostat_Climate"
data-part="2"
data-unit="%B0C%0A" class="cell"></div>
</li>
<li data-row="2" data-col="3" data-sizex="2" data-sizey="2">
<header>Badezimmer</header>
<div data-type="thermostat"
data-device="BZ.Stellantrieb_Clima"
data-step="0.5"
data-min="5"
data-max="30"
class="cell">
</div>
</li>
</ul>
</div>
</body>
</html>
Zitat von: devil77 am 01 Juli 2015, 09:01:32
Ich versuche gerade das Widget für meine Thermostate einzubauen.
Dabei bekomme bei einer Breite von 1 Spalte immer eine Verschiebung der Temperatur.
Bei 2 Spalten Breite wird es richtig angezeigt, siehe Bild Anhang
Anzeigen lasse ich das ganze mit Chrome. Unter IE11 funktioniert die Anzeige nur das Hier die Spalten gespiegelt sind, also das Menü ist nicht mehr links sondern ganz rechts usw.
Weiß jemand woran das liegen kann das die Temperatur nicht mittig liegt?
Das passiert immer, wenn die Gridster Spalte zu klein ist. Entweder du nimmst data-sizex="2" oder oder du gibst ein paar Pixel bei widget_base_width hinzu.
Damit funktioniert es, dachte nicht das man an der Voreinstellung was ändern muss damit es passt.
Zitat von: Nobby1805 am 01 Juli 2015, 08:15:21
Ich vermute auch hier ein Problem des IE ... auf dem iPad/Safari kommen die Linien ja ...
Ich musste auch vor dem gestrigen Update eine Änderung des Moduls für die xticks auf dem IE durchführen ... ich schaue da noch einmal nach, soweit ich mich erinnere hat der IE das Muster für das "stricheln" der Linie falsch ausgewertet
Scheint mal wieder das Skalierungsproblem des IE zu sein, wenn ich die Zeile 216 ändere von
'style':'stroke:#555;stroke-width:1.2px', in
'style':'stroke:#555;stroke-width:12px', dann kommt zumindest eine dünne Linie
Hi. Would it be easy to implement a 'playstream' on a state change or notify then together with the popup widget they could be used as audible warnings on the frontend or as what i would intend to use as a clock radio. Apologise if this has been asked before, i've looked around the forums but not found a solution.
Zitat von: cmillsy am 01 Juli 2015, 15:13:29
Hi. Would it be easy to implement a 'playstream' on a state change or notify then together with the popup widget they could be used as audible warnings on the frontend or as what i would intend to use as a clock radio. Apologise if this has been asked before, i've looked around the forums but not found a solution.
Hi cmillsy,
not sure if I got your request right. You are asking for a function that can trigger the playback of some audiostream/file based on a state change of a device in fhem. The good news is there is a playstream widget, but to my understanding this is playing a stream when being clicked manually. it would be generally possible to add this also without changing the playstream widget, but it would be slightly cumbersome...
But in general I assume the functionality you describe might be also interesting for others, so stay tuned.
Best regards,
Johannes
Hi Johannes,
Thanks for the reply. Yes. I was thinking maybe i combination of the playstream widget and a toast popup triggered from fhem. I have a fhem server (rpi) with a frontend on a tablet at the bedside. triggered audible alarms in the front end could be used for both house alarm functions (streamed from server://...alarm.mp3) or alarm wake up to a radio stream.
regards
Craig
Craig,
attached you find a quick hack, that you might try for do playstream as an "alarm function".
I extended playstream to be able to also react on device changes. You can specify data-device and other options (data-get / data-get-on / data-get-off ) for playing a stream and pausing a stream based on device changes.
Disclaimer: This works on my machine after a quick test
Restrictions: It does not stop other streams (as it is done in normal behavior for playstream if you manually activate it)
Johannes
@setstate: Moechtest Du, dass ich die Änderungen einchecke und über github bereitstelle?
Hallo,
ich würde gerne die Farbe der Temperaturanzeige entsprechend der Differenz Außen- zu Innentemperatur anzeigen (sprich wenn draußen kälter als drinnen die AUßentemp in blau, wenn wärmer als innen dann in Rot).
Die Außentemperatur per Label sieht so aus:
<div data-type="label" data-device="Wetter" data-get="temperature" data-unit="%B0C%0A" class="cell big
ger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
Meine Innentemperatur kommt von einem FHT (ebenso per Reading temperature).
Ich vermute mal irgendwie über das data-limit-gets... Nur wie?
Danke und Gruß,
Marco
Zitat von: MarcoE am 02 Juli 2015, 10:27:05
Hallo,
ich würde gerne die Farbe der Temperaturanzeige entsprechend der Differenz Außen- zu Innentemperatur anzeigen (sprich wenn draußen kälter als drinnen die AUßentemp in blau, wenn wärmer als innen dann in Rot).
Die Außentemperatur per Label sieht so aus:
<div data-type="label" data-device="Wetter" data-get="temperature" data-unit="%B0C%0A" class="cell big
ger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
Meine Innentemperatur kommt von einem FHT (ebenso per Reading temperature).
Ich vermute mal irgendwie über das data-limit-gets... Nur wie?
Danke und Gruß,
Marco
Man müsste ein UserReading anlegen, was die Differenz als Wert beinhaltet und diese per data-limits-get holen und die entsprechenden Farben zuweisen.
Hallo,
userreading ist angelegt und wird per Perl Funktion befüllt (perl Funktion per Telnet getestet (liefert 1 bei Aussen>Innen, 2 bei Aussen<Innen und 0 bei gleich):
attr Wetter userReadings deltaT { TempFarbe(ReadingsVal("Wetter","temperature",""),ReadingsVal("Wohzimmer","temperature",""))}
Der Output des Readings ist derzeit so:
Zitat
Readings
deltaT 1 2015-07-02 13:38:47
dewpointTemperature 20.3 2015-07-02 13:38:47
heatindex 32 2015-07-02 11:06:21
humidity 43 2015-07-02 13:38:47
pressure 1023.2 2015-07-02 13:38:47
temperature 34.4 2015-07-02 13:38:47
Mein Label sieht nun so aus (die Möglichkeit 0 habe ich jetzt mal ignoriert):
<div data-type="label" data-device="Wetter_Bruchsal" data-get="temperature" data-unit="%B0C%0A" data-colors='["#ff0000","#00ff00"]' data-limits='["1","2"]' data-limits-get="deltaT" class="cell bigger thin"></div>
Nun würde ich erwarten da deltaT=1, dass das Label rot wird- wird aber grün. Selbst wenn ich statt "1","2" "2","1" schreibe sich etwas ändert- passiert aber leider nicht.
Wo ist mein Denkfehler?
Danke und Gruß,
Marco
Hatte "label" nicht mal probleme mit Zahlen? Oder geht das schon wieder?
Hallo MarcoE,
Sieht doch schon mal gut aus, bist ja schon gut voran gekommen.
Der HTML Code müsste eigentlich klappen, ich sehe rein optisch auch keinen Fehler.
Muss ich mir heute Abend mal live im Debugger ansehen.
Die Limits würde ich dann so festlegen
data-limits='["-50","1"]'
Kleiner oder größer Null
genau, klappt bei mir. Bei Delta -1 -> blau, bei Delta 1 rot
<div data-type="label" data-device="Wetter_Bruchsal" data-get="temperature" data-unit="%B0C%0A" data-colors='["#0044ff","#dd3344"]' data-limits='["-50","1"]' data-limits-get="deltaT" class="cell bigger thin"></div>
Geht auch bei -7 (blau) und 14 (rot)
Hallo,
nun geht es auch bei mir. Habe die Limits nun auch auf -50,1 gesetzt (und dafür wirklich nur das delta zwischen innen und aussen genommen).
Vielen Dank dafür!
Nun habe ich nur manchmal das Problem, daß nach dem expliziten reload im Browser (egal ob Chrome oder FF) nur noch die Überschriften erscheinen (siehe falsch.png)
Nach Löschen des Cache und reload geht es dann wieder (siehe richtig.png). Wobei selbst dann manchmal z.B. die Icons des Homestatus nicht geladen werden.
Was mache ich da falsch?
Danke und Gruß,
Marco
Ich bastel gerade zum ersten Mal an einem Pagetab. Ist soweit klar, nur dass es etwas mühsam ist, den Browser zu einem echten Refresh zu überreden. Der aktualisiert dann vermutlich nur die Indexseite, aber nicht die Unterseite. Dazu muss man den Cache löschen oder jedes Mal ein Incognito-Tab aufmachen. Falls jemand einen Tipp hat, wie es einfacher geht... gerne.
Mein eigentliches Anliegen ist aber: Wäre es möglich, dem Pagetab eine ähnliche Funktionalität wie dem Popup zu geben, so dass es auf ein Reading in FHEM lauscht und dann automatisch zur entsprechenden Unterseite wechselt? Also dass man in FHEM set MenueDummy menueseite2.html sagt und dann wechselt Pagetab zu ...menue.html#menueseite2.html.
Die Idee dabei ist halt, beispielweise wenn es an der Haustür klingelt könnte das Pagetab automatisch zu der Unterseite wechseln, wo das Kamerabild angezeigt wird und man die Tür öffnen kann.
Sorry, falls das Thema schon mal angesprochen wurde.
Kleiner Tip für die die Chrome benutzen.
- F12 drücken für die Entwicklertools
- dann auf das Symbol für Seite Neuladen drücken und Maus gerückt halten
- Jetzt hat man die Auswahl für Seite direkt neu laden und nicht aus dem cache
Gerade in Testphasen nutze ich das um wirklich sicher zu stellen das ich den aktuellen Stand angezeigt bekommen.
Zitat von: devil77 am 03 Juli 2015, 17:49:51
Kleiner Tip für die die Chrome benutzen.
- F12 drücken für die Entwicklertools
- dann auf das Symbol für Seite Neuladen drücken und Maus gerückt halten
- Jetzt hat man die Auswahl für Seite direkt neu laden und nicht aus dem cache
Der Tipp ist super, vor allem beim Testen. Dafür gibt es bei den meisten Browsern auch eine schnelle Tastenkombination, meist Strg+F5 wie auch in Chrome.
https://de.m.wikipedia.org/wiki/Hilfe:Cache#Browsercache_.E2.80.9Eleeren.E2.80.9C.2Faktualisieren
Gesendet von meinem Nexus 5 mit Tapatalk
kann ich das Tablet UI einfach parallel zu meinem jetzigen fhem installieren. Das heisst das ich wie immer noch schauen kann wie jetzt oder mit anderem link auf die neue Oberfläche?
Zitat von: andrece am 04 Juli 2015, 10:40:44
kann ich das Tablet UI einfach parallel zu meinem jetzigen fhem installieren. Das heisst das ich wie immer noch schauen kann wie jetzt oder mit anderem link auf die neue Oberfläche?
Ja. Wenn Du der Installationsanleitung folgst, passiert genau das.
Zitat von: Brockmann am 03 Juli 2015, 17:33:37
Ich bastel gerade zum ersten Mal an einem Pagetab. Ist soweit klar, nur dass es etwas mühsam ist, den Browser zu einem echten Refresh zu überreden. Der aktualisiert dann vermutlich nur die Indexseite, aber nicht die Unterseite. Dazu muss man den Cache löschen oder jedes Mal ein Incognito-Tab aufmachen. Falls jemand einen Tipp hat, wie es einfacher geht... gerne.
Ich kenne das Verhalten eher im Javascript, dort schalte ich während der Entwicklung den http-cache ab (geht in firefox über about:config)
Die Raumseiten werden bei mir normalerweise problemlos refreshed, sobald ich die Seite neu lade, im Zweifelsfall halte ich beim neuladen gelegentlich shift fest, denn das übersteuert den Cache für die aktuelle Seite (Ctrl in IE).
Zitat von: Brockmann am 03 Juli 2015, 17:33:37
Mein eigentliches Anliegen ist aber: Wäre es möglich, dem Pagetab eine ähnliche Funktionalität wie dem Popup zu geben, so dass es auf ein Reading in FHEM lauscht und dann automatisch zur entsprechenden Unterseite wechselt? Also dass man in FHEM set MenueDummy menueseite2.html sagt und dann wechselt Pagetab zu ...menue.html#menueseite2.html.
Die Idee dabei ist halt, beispielweise wenn es an der Haustür klingelt könnte das Pagetab automatisch zu der Unterseite wechseln, wo das Kamerabild angezeigt wird und man die Tür öffnen kann.
Es scheint eine entsprechende Funktion im pagetab code zu geben, diese wird über die Zuordnung der class "activate" aktiviert und setzt natürlich auch das setzen von data-device etc voraus. Ich habe das jetzt aber nicht ausprobiert.
Gruss,
Johannes
Zitat von: viegener am 04 Juli 2015, 16:58:54
Es scheint eine entsprechende Funktion im pagetab code zu geben, diese wird über die Zuordnung der class "activate" aktiviert und setzt natürlich auch das setzen von data-device etc voraus. Ich habe das jetzt aber nicht ausprobiert.
Ich habe das mal selber ausprobiert, allerdings habe ich es nicht zum Laufen zu bekommen.
Anbei findet sich ein widget_pagetab, bei dem man die Aktivierung über die class activate steuern kann.
Es gibt zwei EInschränkungen:
- Es funktioniert nicht mit Arrays in data-get-on
- Der Tag wird nur beim Erreichen eines Wertes/Status von einem anderen Wert erreicht. Damit man manuell wieder auf die ursprüngliche Seite wechseln kann. Erst wenn zwischendurch ein anderer Status beim tablet UI ankam ist wieder ein Wechsel möglich. Im Prinzip ist das auch klar, denn sonst wäre ja keine andere Seite anwählbar, da die Bedingung für den Wechsel immernoch erfüllt ist.
@Brockmann: Vielleicht kannst Du das ja mal ausprobieren und Rückmeldung geben?
Da ich das circlemenu nicht ans Laufen bekommen habe, habe ich mal die index-example.html im Browser aufgerufen und die sieht folgendermassen aus:
(http://i.imgur.com/SHjMzUn.png)
Verschiedene Browser ausprobiert, eben auch nochmal ein update gemacht.
Kann mir jemand sagen was mir fehlt/falsch ist? :)
in der example ist ein </div> zu viel^^
Zitat von: DJ_SAMMY190 am 05 Juli 2015, 23:40:10
in der example ist ein </div> zu viel^^
Vielen Dank für den Hinweis.
Ist korrigiert.
Zitat von: viegener am 04 Juli 2015, 19:35:00
@Brockmann: Vielleicht kannst Du das ja mal ausprobieren und Rückmeldung geben?
Danke, ich schaue es mir an und melde mich dann.
Ich hätte da ein Anliegen... Im Beispiel:
Entweder das laden der javascript libs ans ende des bodys (also direkt vor </body>), das wäre die "olschool high-compatibility" version.
Oder jedes mit dem defer attribut versehen: <script type="text/javascript"... defer></script>
Ich hätte da ein Anliegen... Im Beispiel:
Entweder das laden der javascript libs ans ende des bodys (also direkt vor </body>), das wäre die "olschool high-compatibility" version.
Oder jedes mit dem defer attribut versehen: <script type="text/javascript"... defer></script>
Nochmal zum Thema Pagetab:
@viegener: Deine Version habe ich nicht so hinbekommen, dass irgendetwa passiert wäre. Aber das kann an mir liegen. Aber auf Deinen Hinweis, dass für das Standard-Pagetab ein "activate" vorgesehen sei, habe ich noch mal gesucht und die Infos bzw. ein Beispiel dafür gefunden. Damit klappt es im Prinzip auch (und jetzt kommt das ABER).
Ich habe es mal beispielhaft so gemacht (ein Pagetab mit vier Seiten, die man sowohl per UI als auch aus FHEM heraus steuern können soll):
<html>
<body>
<div class="cell">
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-home activate","fa-home","fa-home","fa-home"]'
data-url="nexus_1.html" class="cell">
</div>
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-sliders","fa-sliders activate","fa-sliders","fa-sliders"]'
data-url="nexus_2.html" class="cell">
</div>
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-music","fa-music","fa-music activate","fa-music"]'
data-url="nexus_3.html" class="cell">
</div>
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-hotel","fa-hotel","fa-hotel","fa-hotel activate"]'
data-url="nexus_4.html" class="cell">
</div>
</div>
</body>
</html>
Das funktioniert soweit auch, nur dass immer nur das Icon des gerade geöffneten Tabs korrekt angezeigt wird. Bei den anderen sieht man nur ein Kreissymbol (siehe Bild). Das Problem dürfte sein, dass bei dieser Definition alle Icons immer "on" sind.
Ich habe schon alle möglichen Varianten durchprobiert, Vorgaben für Farben usw. zu machen, bin aber zu keiner Lösung gekommen. Hinzu kommt, dass der manuell gewählte Pagetab nicht mit dem Reading in FHEM synchron ist. Also wenn man erst per Reading zu Tab 2 wechselt und dann manuell zu Tab 1 zurück, steht das Reading immer noch auf Tab 1, was das verwendet von data...s-Attributen schwierig macht.
Ich habe das Gefühl, dass das ein grundlegendes Problem des Pagetab-Widgets ist, aber vielleicht gibt es ja auch eine einfache Lösung, die ich übersehe?
Ich hätte mal eine Frage an die Widget-Programmierer.
Wäre es möglich die Widgets zu erweitern, damit man auch einzelne widgets initialisieren kann?
Zur Zeit werden doch beim Init eines Widgets alle initialisiert, oder?
Folgender Hintergrund:
Ich habe Templates die auf jeder Seite angezeigt werden. Diese sollen aber nicht bei jedem Seitenwechsel neu initialisiert werden.
Der Aufbau und die Seitenwechsel funktionieren soweit schon.
Nur die reine Initialisierung der neu geladenen Templates geht nicht.
Die erneute Gesamtinitialisierung führt zur Zeit dazu, dass meine festen Templates nach einem Seitenwechsel die einegtragene Aktion mehrfach ausführen.
Hallo!
Hat von euch schon jemand versucht, TabletUI mit einer Art Floorplan zu kombinieren?
Ich habe mir überlegt, ob ich das über ein Hintergrundbild per CSS löse für die verschiedenen Stockwerke. Das Raster (das ja doch eher grob ist), ist aber vielleicht ein Problem.
Wie seht ihr das?
Gruß
Phil
Zitat von: Stril am 06 Juli 2015, 16:01:56
Hat von euch schon jemand versucht, TabletUI mit einer Art Floorplan zu kombinieren?
Ich habe mir überlegt, ob ich das über ein Hintergrundbild per CSS löse für die verschiedenen Stockwerke. Das Raster (das ja doch eher grob ist), ist aber vielleicht ein Problem.
Hallo Phil,
ich hab bei mir auch ein Hintergrundbild eingesetzt.
Zusätzlich mache ich die GridsterWidgets(<li class="halbTransparent ">) nach Bedarf transparent oder halbtransparent .
Hier der css Teil:
body {
background-image: url("/fhem/tablet/images/bg_green.jpg");
}
.gridster li header {
/*background: #BBBBBB;*/
color: #ffffff;
font-size: 14px;
}
.halbTransparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.5) !important;
}
.transparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0) !important;
}
.transparent li header{
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0) !important;
}
Alles noch Testphase!
Gruß
Holger
Sieht gut aus! Was so alles geht ... :)
Zitat von: reichi am 06 Juli 2015, 11:09:36
Ich hätte da ein Anliegen... Im Beispiel:
Entweder das laden der javascript libs ans ende des bodys (also direkt vor </body>), das wäre die "olschool high-compatibility" version.
Oder jedes mit dem defer attribut versehen: <script type="text/javascript"... defer></script>
Vielen Dank für den Hinweis.
Ich teste es bei mir aus, mache mich schlau darüber und passe die sourcen ggf. an.
setstate Dank on
Hi Leute,
ich habe da irgendwie ein kleines Problem mit dem Popup widget. Setze ich eine fixe Größe z.B. <div data-type="popup" data-height="800px" data-width="800px"> dann wird das Popup richtig mittig positioniert. Wenn ich aber die Größe relativ anlege <div data-type="popup" data-height="80%" data-width="80%"> ist das Popup nach rechts verschoben.
Das passiert beim Firefox(PC) sowie Chrome(Handy/Tablet). Drehe ich das Handy, sodass die Größe neu berechnet werden muss liegt das Popup korrekt in der Mitte. Kann das jemand bestätigen?
Gruß
wegwerf
Nachtrag zum Thema Pagetab:
Nachdem keine Rückmeldung zu meinem Post gestern kam, habe ich noch mal den Quelltext befragt und rumprobiert. Mein Workaround ist nun, die background-color pauschal auf 'transparent" zu setzen. Dann habe ich weder beim aktiven noch bei den inaktiven Pagetab-Symbolen einen Kreis. Statt dessen färbe ich das jeweils gewählte Symbol mit data-on-color anders ein, so dass man erkennen kann, welcher Tab gerade gewählt ist. So funktioniert es für mich, sowohl direkt per UI bedient als auch aus FHEM heraus angesteuert.
Ich bleibe aber der Meinung, dass hier ein Problem beim Pagetab-Widget vorliegt, entweder ein logischer Fehler oder ein tatsächlicher Bug. Die Eigenschaften data-on-color und data-on-background-color werden unterschiedlich behandelt:
->data-on-color wird nur verwendet, wenn der entsprechende Pagetab aktiv ist, sonst wird data-off-color verwendet.
->data-on-background-color hingegen wird IMMER verwendet, auch wenn das Pagetab nicht aktiv ist. Das Angeben von data-off-background-color ist somit sinnlos.
Das ganze bezogen auf folgende Definition:
<html>
<body>
<div class="cell large">
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-home activate","fa-home","fa-home","fa-home"]'
data-on-color = "#aa6900"
data-on-background-color = 'transparent'
data-url="nexus_1.html" class="cell">
</div>
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-video-camera","fa-video-camera activate","fa-video-camera","fa-video-camera"]'
data-on-color = "#aa6900"
data-on-background-color = 'transparent'
data-url="nexus_2.html" class="cell">
</div>
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-cloud","fa-cloud","fa-cloud activate","fa-cloud"]'
data-on-color = "#aa6900"
data-on-background-color = 'transparent'
data-url="nexus_3.html" class="cell">
</div>
<div data-type="pagetab" data-device="Datastore"
data-get-on='["1","2","3","4"]'
data-icons='["fa-hotel","fa-hotel","fa-hotel","fa-hotel activate"]'
data-on-color = "#aa6900"
data-on-background-color = 'transparent'
data-url="nexus_4.html" class="cell">
</div>
</div>
</body>
</html>
Wenn der Denkfehler bei mir liegt, bin ich für Aufklärung dankbar.
Lässt sich die Benutzeroberfläche eigentlich auch zunächst unabhängig von FHEM entwickeln? In meinem Falle z.B. via MAMP?
Grüße,
Matthias
Hallo.
Erstmal vielen Dank für diese tolle Visualisierung.
Genau deswegen habe ich mir jetzt auch einen RPi 2 für meine Hausautomation zugelegt.
Ich habe den RPi erst am Montag frisch aufgesetzt. Das hat soweit auch sehr gut geklappt.
Jetzt wollte ich das FTUI bei mir ans Laufen kriegen, habe aber ein merkwürdiges Verhalten.
Was habe ich gemacht und was passiert:
1. Ich habe mir alle Dateien gemäß erstem Post mit folgendem Code installiert:
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt2. Anschließend habe ich, von mir bereits auf einem Windows Rechner erstellte html-Seiten (index, menu, ...), nach /opt/fhem/www/tablet kopiert.
3. Ich habe den Server in FHEM angelegt mittels:
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UIWenn ich nun auf der FHEM Hauptseite (ich glaube es heißt gpm2) auf TABLETUI drücke bekomme ich nur die Meldung:
ZitatNo HTTPSRV device for /ftui
im Browser angezeigt.
4. Also habe ich das define wieder gelöscht und habe es mit dem zweiten Code probiert:
define TABLETUI HTTPSRV ftui ./www/tablet Tablet-UINun wird der Browser bei Eingabe der Adresse oder betätigen des TABLETUI Buttons in FHEM kurz schwarz (wie der Hintergrund des FTUI) und anschließend sieht das Bild im Browser aus wie auf dem Screenshot.
Erst wenn ich nun in der Adresszeile noch /index.html anfüge baut er die Seite richtig auf.
Das Verhalten habe ich bei Firefox und bei Chrome.
Hat zufällig einer eine Idee, was da schief läuft?
Vielen Dank und Gruß
NoFaker
Zitat von: NoFaker76 am 08 Juli 2015, 17:42:16
Hat zufällig einer eine Idee, was da schief läuft?
Vermutung, es ist nachwievor das alte httpsrv-Modul im SVN.
Ich habe in folgendem Beitrag ein HTTPSRV angehängt, dass dieses Problem löst. Der Maintainer von HTTPSRV wird das demnächst auch als normales update verteilen.
http://forum.fhem.de/index.php/topic,34233.msg305941.html#msg305941 (http://forum.fhem.de/index.php/topic,34233.msg305941.html#msg305941)
Die erste Definition sollte dann funktionieren.
Du findest den Beitrag auch, wenn Du mit der Fehlermeldung in diesem Thread suchst,
Johannes
Das scheint es gewesen zu sein.
Zumindest klappt es jetzt ohne Änderung in der Adresszeile.
Obwohl mir der Bildaufbau deutlich langsamer vorkommt als noch auf dem Windows Rechner.
Aber das ist ja erstmal nicht so schlimm.
Danke erstmal.
Sobald ich mal ein paar Sachen auf die Beine gestellt habe werde ich mein Ergebnis im Demo Thread posten.
Hallo setstate,
wäre es schwer den Homestatus noch um ein 6. State zu erweitern?
Ich nutze dieses für meine Jalousievorgaben und bräuchte dort noch ein weiteres State.
Danke und Gruß
Denny
Hallo zusammen,
die Arbeit, die hier geleistet wird ist super. Vielen Dank für die Entwicklung des Frontends.
Leider habe ich nicht soviel Ahnung von HTML und css, aber dank Copy und Paste, Wiki und Forum, werde ich es schaffen.
Könntet Ihr mal die Anlage ansehen, so soll die Aufteilung stattfinden, ich würde nämlich gern wissen, ob ich das System verstanden habe.
Ach so, kann man auch 2 unterschiedliche UI´s anlegen und parallel betreiben? Eins für das Tablet und eins für das Smartphone. Die Frage wurde bestimmt schon gestellt, bin erst bei Seite 66 und die Suche hat nichts gefunden. Sorry.
Vielen Dank.
Skuggy
Zitat von: skuggy am 10 Juli 2015, 09:50:11
Ach so, kann man auch 2 unterschiedliche UI´s anlegen und parallel betreiben? Eins für das Tablet und eins für das Smartphone. Die Frage wurde bestimmt schon gestellt, bin erst bei Seite 66 und die Suche hat nichts gefunden. Sorry.
Du kannst beliebig viele .html-Seiten erstellen und diese dann vom Gerät aus gezielt ansteuern, also beispielsweise anstatt einer index.html eine tablet.html und eine smartphone.html.
Zitat von: skuggy am 10 Juli 2015, 09:50:11
Könntet Ihr mal die Anlage ansehen, so soll die Aufteilung stattfinden, ich würde nämlich gern wissen, ob ich das System verstanden habe.
Wenn ein Element eine sizex="2" hat, 'verbraucht' dies auch 2 Columns.
Also Element1 mit data-col="2" und data-sizex="2" belegt column 2 und 3
Damit kann Element2 erst bei data-col="4" positioniert werden.
Das gleiche muss man auch bei Row beachten
Zitat von: Brockmann am 10 Juli 2015, 09:52:57
Du kannst beliebig viele .html-Seiten erstellen und diese dann vom Gerät aus gezielt ansteuern, also beispielsweise anstatt einer index.html eine tablet.html und eine smartphone.html.
Super, dass es funktioniert.
Zitat von: setstate am 10 Juli 2015, 10:11:50
Wenn ein Element eine sizex="2" hat, 'verbraucht' dies auch 2 Columns.
Also Element1 mit data-col="2" und data-sizex="2" belegt column 2 und 3
Damit kann Element2 erst bei data-col="4" positioniert werden.
Das gleiche muss man auch bei Row beachten
Ahja, jetzt hab ich es verstanden. Ist eigentlich ganz einfach.
Danke.
Seitensteuerung über Konfigurationsdatei
ich denke ich kann mal meinen aktuellen Stand meiner Extension ftuiConfig posten.
Die Datei beinhaltet eine kleine Testanwendung, die als Aufsatz in die vorhandene Struktur kopiert werden kann.
Folgender Inhalt:
- indexConfig.html = eine weitere Startseite, damit die vorhandene Startseite nicht überschrieben wird. Hier ist die neue META Angabe Config wichtig, die angibt welche Konfigurationsdatei genutzt werden soll und die zusätzliche Angabe der fhem-tablet-ui-config.js.
- ftuiConfig.json = Konfigurationsdaten
- fhem-tablet-ui-config.js = Konfigurationsdatei auswerten.
- widget_pagebutton.js = steuert den Aufruf einer neuen Seite über eine Methode aus fhem-tablet-ui-config.js
Ansonsten sind noch ein paar Testtemplates und Testwidgets als Beispiel enthalten.
Diese sind aber auch im Moment als reine Tests zu sehen.
Generell läuft die Initialisierung der Seiten wie gehabt über das initPage des Hauptframeworks.
Der Unterschied zur normalen Seitenerstellung besteht darin , dass man keine Seiten Html mehr bauen muss sondern diese in der Konfigurationsdatei definiert.
Somit müssen eigentlich nur noch die eigentlichen Templates geschrieben werden.
Die Startseite beinhaltet nur noch ein leeres Gridster.
Desweiteren habe ich in der Konfiguration eine Themeangabe implementiert, die automatisch eine css lädt.
Wenn hier die Angabe leer ist wird FTUI wie gewohnt angezeigt.
Ich hoffe ich habe keine Bugs eingebaut und freue mich für jeden Feedback. :)
EDIT: Das LEER Template nutze ich um eine bessere Positionierung hinzubekommen, da Gridster die Templates vertikal automatisch nach oben verschiebt. Ein transparentes leeres Template sieht man nicht ;-)
Die momentane Einstellung ist optimiert für eine Auflösung von 1280x800 (Samsung Tablet 10")
EDIT: Erweitert um dynamische Devices, die man über die Config ans Template weitergeben kann.
EDIT: Config um Header Text erweitert
Den Ansatz finde ich ziemlich cool. Ich habe das gerade mal folgendermaßen ausprobiert:
Deine Dateien aus dem Anhang über meine bestehende tablet Installation gespeichert (sollte ja, da alles neue Dateien, die bestehende Installation nicht stören, tut es auch nicht).
Die Oberfläche startet, allerdings sehe ich das Datum und die Zeit nicht.
Änderungen an den Templates werden nicht sofort bei einem Reload der Seite sichtbar
Wenn man das konsequent weiter denkt, dann wäre es ja schlau, die Templates tatsächlich als solche zu benutzen. Ich habe mehrere Räume, die alle ähnlich ausgestattet sind, wenn man den Templates die Info über data-device oder über die Labels aus der json Steuerdatei mitgeben könnte. Dann könnte man über ein Template mehrere gleich ausgestattete Räume anlegen (Modularität lässt grüßen).
Hallo Eki,
schön dass du so schnell ein Feedback gibst.
Das ganze sollte genau in die Richtung gehen und weitere Ideen hervor bringen.
Änderungen an einem Template scheinen durch das Cachen des Browsers nciht direkt angezeigt zu werden.
Ich lösche meistens mit Strg+Shift+Entf den BrowserCache und dann wird über F5 alles korrekt angezeigt
Oder beim Seitenaufruf das "#0" entfernen und nochmal aufrufen ?!
Mal sehen ob ich dafür noch ne Lösung finde.
EDIT: Oder hast du Fehler auf der Konsole?
Mit Ctrl+Shift+Ent und Neuladen klappt es.
Ich hab im Moment noch das Problem das die simplecharts nicht aktualisiert werden, bei einem manuellen Reload wird der aktuelle Stand angezeigt. Das betrifft sowohl WebViewControl als auch den Firefox auf dem Laptop. Die Uhrzeit wird hingegen brav im sekundentakt aktualisiert.
longpoll steht sowohl in der index.html auf 1, als auch in der fhem.cfg fuer den standard port (den ich auch nutze) auf 1.
Gibt es sonst noch etwas was ich uebersehen haben koennte?
Wer kann mir sagen warum ich in WinSCP unter einer SFTP Anmeldung als Benutzer pi keine Änderungen vornehmen kann ?
Bin auf den Raspberry 2 gewechselt,alles neu eingerichtet und wollte nun über Win SCP meine html-Seiten im Ordner tablet einfügen......habe aber keine Berechtigung.
Dies habe ich bei meinem vorherigen Raspberry so gelöst ,das ich die Rechte über Putty geändert habe.
Warum geht das nicht als Benutzer pi , dies wurde doch bei der Einrichtung über die Anleitung von
http://www.meintechblog.de/2013/05/fhem-server-auf-dem-raspberry-pi-in-einer-stunde-einrichten/
mit
cd /opt && sudo chmod -R a+w fhem && sudo usermod -a -G tty pi && sudo usermod -a -G tty fhem
geändert .....
Ist zwar keine Frage zum Frontend aber vielleicht ist einer so freundlich ........ ;)
Also bei Deinem Befehlen ist nicht ein einziger dabei der Dateirechte für einen bestimmten User setzt
Clock zeigt nichts an!
Ich bin zwar kein spezialist und habe gerade erst mit der Tablet UI angefangen aber irgend wie bin ich zu doof für die Uhrzeit.
Habe brav nach dem Beispiel von nesges gearbeitet, bekomme aber nichts angezeigt?
Mein Eintrag in der index.html:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>HEUTE</header>
<div data-type="clock"></div>
Was mache ich falsch???
bei mir schaut es so aus :
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>UHR</header>
<div class="container inline">
<div data-type="clock" data-format="H:i" class="cell bigger"></div>
<div data-type="clock" data-format="d.n.Y" class="cell bigger"></div>
</div>
</li>
Grüße,
Ben
@Braakhekke
geht leider auch nicht :(
Habe es eingefügt, leider keine Anzeige...
Hallo namor,
Wie schaut den Dein "index.html" aus? Hast Du auch alles so installiert/angelegt wie am Anfang von thread beschrieben?
Grüße, Ben
Also bei mir gehts?
Zitat von: namor am 12 Juli 2015, 21:22:03
geht leider auch nicht :(
Ist diese Datei vorhanden und passen die Zugriffsrechte?
www/tablet/js/widget_clock.js
Werde ich heute Abend nachschauen.
@Brockmann
Du bist mein Held;-))
das Clock.js widget hat gefehlt.
Habe zwar beim Installieren das Update für die extra Widget gemacht, er hat immer gemeint es gäbe nichts neues?
Erst nach einem Restart hat er die Update Anforderung umgesetzt und mir das widget_clock.js installiert.
Vielen Dank nochmals an die die Community für die schnelle Unterstützung.
Ich muss schon sagen, das ist wirklich perfekte Arbeit.
Ich hätte einen Wunsch für ein Widget.
Ich Visualisiere an manchen stellen die Bewegungsmelder. Eingesetzt habe ich FS20 Melder.
Was ich gerne hätte, ist ein Widget_Symbol das aber die gleiche Darstellung wie das Push_Widget mit der "on-for-timer" Funktion.
Den on-for-timer Wert kann bei aktivem Bewegungsmelder aus STATE auslesen. Gut wäre wenn bei wieder aktivieren des Bewegungsmelder der counter wieder resetiert wird, und die volle zeit als Basis genommen wird.
Der Grund dass ich dies wünsche ist da ich bei vielen das attr follow-on-for-timer auf 1 gesetzt habe. Wäre einfach eine schöne Darstellung.
Grüsse Eric
Zitat von: hillbicks am 11 Juli 2015, 14:44:07
Ich hab im Moment noch das Problem das die simplecharts nicht aktualisiert werden, bei einem manuellen Reload wird der aktuelle Stand angezeigt. Das betrifft sowohl WebViewControl als auch den Firefox auf dem Laptop. Die Uhrzeit wird hingegen brav im sekundentakt aktualisiert.
longpoll steht sowohl in der index.html auf 1, als auch in der fhem.cfg fuer den standard port (den ich auch nutze) auf 1.
Gibt es sonst noch etwas was ich uebersehen haben koennte?
Asche auf mein Haupt ... Das hat leider noch nie funktioniert.
Ich habe es jetzt gefixt und das Update ist verfügbar.
Außerdem bringt das Update auch noch Abhilfe beim Problem von grauem Icon auf grauem Hintergrund beim einem Pagtab mit Multistate (Siehe PageTab warn+activate Beispiel in der ReadMe.md)
Mit dem Update habe ich mir jetzt wieder die fehlenden xticks eingehandelt ::) http://forum.fhem.de/index.php/topic,34233.msg308802.html#msg308802 (http://forum.fhem.de/index.php/topic,34233.msg308802.html#msg308802)
Zitat von: Nobby1805 am 13 Juli 2015, 23:33:40
Mit dem Update habe ich mir jetzt wieder die fehlenden xticks eingehandelt ::) http://forum.fhem.de/index.php/topic,34233.msg308802.html#msg308802 (http://forum.fhem.de/index.php/topic,34233.msg308802.html#msg308802)
Sorry, habe ich vergessen ...
Ist jetzt auch mit eingebaut.
Zitat von: setstate am 13 Juli 2015, 23:19:05
Außerdem bringt das Update auch noch Abhilfe beim Problem von grauem Icon auf grauem Hintergrund beim einem Pagtab mit Multistate (Siehe PageTab warn+activate Beispiel in der ReadMe.md)
Vielen Dank für den Fix. Damit läuft es jetzt, wie es sollte. :)
Zitat von: setstate am 14 Juli 2015, 00:09:18
Sorry, habe ich vergessen ...
Ist jetzt auch mit eingebaut.
Ja perfekt, Danke !
Hallo Zusammen,
wenn ich versuche FTUI per update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt zu updaten bekomme ich im FHEMWEB immer folgende Antwort:
https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt: empty answer received
Ich weiß irgendwie nicht weiter. Wenn FHEM normal per update all updatete funktioniert alles einwandfrei.
Danke für die Hilfe.
Dominik
Wahrscheinlich ist die Frage eher Off-Topic, aber doch auch irgendwie passend.
Da dieses Frontend Tablet-UI heißt, wird es wahrscheinlich zu ca. 80 % (geraten) auf einen Tablet genutzt.
Könnte man evtl. einen Therad aufmachen, mit dem "Titel Welches Tablet nutzt Ihr?" -Auflösung, Größe, Root, Preis usw.
Bin nämlich auf der Suche nach einen 10.1 Zoll Tablet als Wanddisplay für Fhem in Verbindung mit TabletUI.
Welche Voraussetzungen sollte das Tablet haben? Ist Root wichtig?
Danke.
Skuggy.
PS: Falls das Thema nicht passt, einfach löschen.
Habe ein ASUS K01B im Einsatz. 10.1 Zoll Display. Habe ich bei Conrad für unter 200€ bekommen. Verwende es ausschließlich für die Verwendung von FHEM im Zusammenspiel mit Tablet UI!! Allen unnötigen Ballast habe ich entfernt. Bin sehr zufrieden damit!
Zitat von: mc-hollin am 10 Juli 2015, 11:19:34
Seitensteuerung über Konfigurationsdatei
ich denke ich kann mal meinen aktuellen Stand meiner Extension ftuiConfig posten.
Die Datei beinhaltet eine kleine Testanwendung, die als Aufsatz in die vorhandene Struktur kopiert werden kann.
Folgender Inhalt:
- indexConfig.html = eine weitere Startseite, damit die vorhandene Startseite nicht überschrieben wird. Hier ist die neue META Angabe Config wichtig, die angibt welche Konfigurationsdatei genutzt werden soll und die zusätzliche Angabe der fhem-tablet-ui-config.js.
- ftuiConfig.json = Konfigurationsdaten
- fhem-tablet-ui-config.js = Konfigurationsdatei auswerten.
- widget_pagebutton.js = steuert den Aufruf einer neuen Seite über eine Methode aus fhem-tablet-ui-config.js
Ansonsten sind noch ein paar Testtemplates und Testwidgets als Beispiel enthalten.
Diese sind aber auch im Moment als reine Tests zu sehen.
Generell läuft die Initialisierung der Seiten wie gehabt über das initPage des Hauptframeworks.
Der Unterschied zur normalen Seitenerstellung besteht darin , dass man keine Seiten Html mehr bauen muss sondern diese in der Konfigurationsdatei definiert.
Somit müssen eigentlich nur noch die eigentlichen Templates geschrieben werden.
Die Startseite beinhaltet nur noch ein leeres Gridster.
Desweiteren habe ich in der Konfiguration eine Themeangabe implementiert, die automatisch eine css lädt.
Wenn hier die Angabe leer ist wird FTUI wie gewohnt angezeigt.
Ich hoffe ich habe keine Bugs eingebaut und freue mich für jeden Feedback. :)
EDIT: Das LEER Template nutze ich um eine bessere Positionierung hinzubekommen, da Gridster die Templates vertikal automatisch nach oben verschiebt. Ein transparentes leeres Template sieht man nicht ;-)
Die momentane Einstellung ist optimiert für eine Auflösung von 1280x800 (Samsung Tablet 10")
Hallo mc-hollin,
ich habe Deinen Ansatz jetzt mal ein bisschen weiter gesponnen (im Sinn der von mir genannten "richtigen" Templates). Anbei einige Änderungen, mit denen man jetzt in den Templates Platzhalter für Devices einfügen kann, die dann mit den "richtigen" Device Bezeichnungen aus der ftuiConfig.json Datei ersetzt werden. Leider habe ich das nicht ohne Änderungen an der
fhem-tablet-ui.js hinbekommen (vielleicht hast Du ja eine andere Idee, ich bin kein js/HTML Profi).
Bitte schau es Dir mal an, bei mir hat es gut funktioniert, aber man sollte schon noch ein bisschen weiter testen ;).
Gruss
Kurt
Zitat von: skuggy am 15 Juli 2015, 07:26:16
Welche Voraussetzungen sollte das Tablet haben? Ist Root wichtig?
Ich denke, root ist nur wichtig, wenn Du es "immersive" also ohne Status und Menüleiste betreiben willst. Das geht meines Wissens nach nur gerooted wirklich sauber.
Ansonsten sollte das Tablet Chrome (sollte bei halbwegs aktuellen Geräten kein Problem sein) oder bei Bedarf auch WVC (ist wohl schon eher kritisch) ausführen können.
Ein Tipp wäre vielleicht noch, darauf zu achten, ob das gewählte Gerät von CyanogenMod unterstützt wird, dann hat man eine Alternative, falls mit der Stock-Firmware doch irgendwas jetzt oder später nicht so klappt wie gewünscht.
Mein persönlicher Tipp wäre, lieber ein gebrauchtes Markengerät als ein neues NoName-Produkt zu nehmen, gerade wenn es mit fester Stromversorgung an der Wand hängt und es auf die Kapazität eines (ggf. gebrauchten) Akkus nicht so sehr ankommt. Das Argument dafür ist, dass die Noname-Geräte an allen Ecken und Ende sparen, was man insbesondere an der Displayqualität (teilweise deutlich) merkt. Auch die Leistung hinkt oft etwas (im wahrsten Sinne des Wortes), was sich an Rucklern und langsameren Aufbau komplexer Seiten bemerkbar macht (und das ist in Bezug auf Tablet-UI schon ein Aspekt). Außerdem ist die Unterstützung durch die Community bei weiter verbreiteten Geräten besser und langfristiger (auch in Bezug auf CyanogenMod beispielsweise). Aber wie gesagt, nur eine persönliche Wortmeldung, andere sehen das sicher anders und es sollte nicht Auslöser von Off-Topic-Diskussionen sein.
Zitat von: eki am 15 Juli 2015, 09:30:15
ich habe Deinen Ansatz jetzt mal ein bisschen weiter gesponnen (im Sinn der von mir genannten "richtigen" Templates). Anbei einige Änderungen, mit denen man jetzt in den Templates Platzhalter für Devices einfügen kann, die dann mit den "richtigen" Device Bezeichnungen aus der ftuiConfig.json Datei ersetzt werden.
Hallo Kurt,
ich schaue mir deine Erweiterungen heute abend mal an.
Na Ja, Profi in JS bin ich auch nicht. Hab mich eigentlich erst durch das FTUI hier mit JS befasst.
Kannst du denn auch mehrere Devices pro Template definieren?
ja, mehrere Devices gehen auch. Im Template werden die mit Nummern (device0 ...) versehen und dann anhand der Nummern aus einem Array im json File befüllt.
Ich möchte gerne bei meinen Homematic Heizköprerventilen desired-temp über plus und minus Tasten regeln.
Ich bin schon eine weile am Suchen und habe aber keinen richtigen Ansatz gefunden um das ganze zu realisieren.
Ist das überhaupt möglich?
Hallo mc-hollin,
hier noch einmal ein update der beiden js files. In den vorherigen war noch ein Fehler :-[.
Hallo,
da ich leider keine Antwort auf mein Problem bekommen habe, habe ich mir selber geholfen.
Wer ähnliches Problem hat, schaut im LOG5 nach, ob er auch diesen Fehler erhält:
Can't find 'boot_Net__SSLeay' symbol in /var/InternerSpeicher/fhem/lib/perl5/site_perl/5.12.2/mips-linux/auto/Net/SSLeay/SSLeay.so
Wenn ja, hilft folgende Website weiter:
http://www.tatsch-it.de/fritzbox-fritzos-6-20-debug-cfg-reaktivieren/
Zitat von: Brockmann am 15 Juli 2015, 09:35:24
Ich denke, root ist nur wichtig, wenn Du es "immersive" also ohne Status und Menüleiste betreiben willst. Das geht meines Wissens nach nur gerooted wirklich sauber.
Ansonsten sollte das Tablet Chrome (sollte bei halbwegs aktuellen Geräten kein Problem sein) oder bei Bedarf auch WVC (ist wohl schon eher kritisch) ausführen können.
Ein Tipp wäre vielleicht noch, darauf zu achten, ob das gewählte Gerät von CyanogenMod unterstützt wird, dann hat man eine Alternative, falls mit der Stock-Firmware doch irgendwas jetzt oder später nicht so klappt wie gewünscht.
Mein persönlicher Tipp wäre, lieber ein gebrauchtes Markengerät als ein neues NoName-Produkt zu nehmen, gerade wenn es mit fester Stromversorgung an der Wand hängt und es auf die Kapazität eines (ggf. gebrauchten) Akkus nicht so sehr ankommt. Das Argument dafür ist, dass die Noname-Geräte an allen Ecken und Ende sparen, was man insbesondere an der Displayqualität (teilweise deutlich) merkt. Auch die Leistung hinkt oft etwas (im wahrsten Sinne des Wortes), was sich an Rucklern und langsameren Aufbau komplexer Seiten bemerkbar macht (und das ist in Bezug auf Tablet-UI schon ein Aspekt). Außerdem ist die Unterstützung durch die Community bei weiter verbreiteten Geräten besser und langfristiger (auch in Bezug auf CyanogenMod beispielsweise). Aber wie gesagt, nur eine persönliche Wortmeldung, andere sehen das sicher anders und es sollte nicht Auslöser von Off-Topic-Diskussionen sein.
Vielen Dank für deine persönliche Einschätzung. Genau in diese Richtung soll es bei mir auch gehen. Die wird wohl ein Samsung Tab 2 oder 3 werden.
Hallo zusammen,
Ich würde gerne das Multiepg meiner Vuduo mit in das Frontend einbauen. Leider bekomme ich bei dem IFrame widget den :( . Über das normale Webfrontend von FHEM habe ich es eingebunden.
URL: http://xxxx/ajax/multiepg2. Ich benutze auch Pagetab und habe versucht die URL da einzubauen aber das bringt mir nur eine Schwarze Seite.
Gruß Micha
Ich habe ein Frage zur onclick Funktion und Befehle an fhem senden.
In fhemweb gebe ich folgendes in die Befehlszeile ein um ein Thermostat abzusenken.
{ fhem(myUtils_HeizungUpDown("WZ.Thermostat_Climate","up")) }
Wie muß ich das ganze mit der onclick Funktion defineren?
Probiert habe ich
onclick="setFhemStatus('{ fhem(myUtils_HeizungUpDown("WZ.Thermostat_Climate","up")) }')"
jedoch ohne Erfolg. Der set Befehl wird nicht ausgeführt.
Zitat von: TNT0068 am 16 Juli 2015, 17:49:38
Hallo zusammen,
Ich würde gerne das Multiepg meiner Vuduo mit in das Frontend einbauen. Leider bekomme ich bei dem IFrame widget den :( . Über das normale Webfrontend von FHEM habe ich es eingebunden.
URL: http://xxxx/ajax/multiepg2. Ich benutze auch Pagetab und habe versucht die URL da einzubauen aber das bringt mir nur eine Schwarze Seite.
Gruß Micha
Hallo Micha,
das wird an der Cross-Origin Blockade liegen: Die Java-Console spuckt das bei mir aus:
ZitatQuellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf http://vusolo2/ajax/multiepg2. (Grund: CORS-Kopfzeile 'Access-Control-Allow-Origin' fehlt).
Nesges hatte dazu auch einige Anmerkungen bei sich im Wiki: https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/iframe (https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/iframe)
Zitat von: devil77 am 16 Juli 2015, 20:34:37
Ich habe ein Frage zur onclick Funktion und Befehle an fhem senden.
In fhemweb gebe ich folgendes in die Befehlszeile ein um ein Thermostat abzusenken.
{ fhem(myUtils_HeizungUpDown("WZ.Thermostat_Climate","up")) }
Wie muß ich das ganze mit der onclick Funktion defineren?
Probiert habe ich
onclick="setFhemStatus('{ fhem(myUtils_HeizungUpDown("WZ.Thermostat_Climate","up")) }')"
jedoch ohne Erfolg. Der set Befehl wird nicht ausgeführt.
Hast du schon das probiert?
onclick="setFhemStatus('{myUtils_HeizungUpDown("WZ.Thermostat_Climate","up")}')"
Zitat von: eki am 15 Juli 2015, 09:30:15
Bitte schau es Dir mal an, bei mir hat es gut funktioniert, aber man sollte schon noch ein bisschen weiter testen ;).
Hallo Kurt,
hab deine "dynamischen Devices" in die fhem-tablet-ui-config.js eingebaut.
Da die Steuerug über die Konfiguration läuft, sollte nicht das Hauptframework angepasst werden.
Ich habe das "data-device" durch "data-cfg-device" ersetzt (nur da wo es genutzt werden soll ;)) und erzeuge das "data-device" über die Config.
In "data-cfg-device" wird nur noch der Index der angegebenen Devices aus der Config eingetragen.
Kannst du dir im tpl_Beispiel1.htm anschauen.
Teste doch mal ob es so bei dir auch funktioniert.
Die Sourcen liegen wie gehabt hier http://forum.fhem.de/index.php?topic=34233.msg311209#msg311209 (http://forum.fhem.de/index.php?topic=34233.msg311209#msg311209)
Gruß Holger
Zitat von: setstate am 16 Juli 2015, 21:08:33
Hast du schon das probiert?
onclick="setFhemStatus('{myUtils_HeizungUpDown("WZ.Thermostat_Climate","up")}')"
Danke, damit funktioniert es super. Jetzt kann ich die Heizung auch einfach über plus und minus regeln.
Guten Morgen zusammen,
ich wollte gestern Abend mal das Update durchführen. Wie sehe ich, dass es geklappt hat?
Zuerst habe ich update check gemacht, alles ohne Probleme angezeigt.
update check https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Im Anschluss habe ich folgenden Befehl eingegeben:
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Dann ist Fhem auf den Eventmonitor gesprungen und blieb leer. Verbose hatte ich auf 5 stehen. Meiner Meinung hat das Update nicht geklappt.
Wie kann ich prüfen ob es durchgelaufen ist oder kann ich das Update auch über den RPi direkt durchführen?
Zitat von: TNT0068 am 16 Juli 2015, 17:49:38
Ich würde gerne das Multiepg meiner Vuduo mit in das Frontend einbauen. Leider bekomme ich bei dem IFrame widget den :( . Über das normale Webfrontend von FHEM habe ich es eingebunden.
Kannst Du es nicht einfach als image einbauen? Ich habe es bei mir so gemacht, ist aber eine andere Kamera und ggf. ein anderes Format:
<div data-type="label" class="cell big"><img src="http://instarwlan/videostream.cgi?user=XXX&pwd=XXX&resolution=32rate=1" height="340" wight="580" border="0"></img></div>
Zitat von: skuggy am 17 Juli 2015, 07:11:24
Wie kann ich prüfen ob es durchgelaufen ist oder kann ich das Update auch über den RPi direkt durchführen?
Schau Dir die Zeitstempel der Dateien beispielsweise im js-Unterverzeichnis an, da sollten zumindest einige den Zeitpunkt des Updates haben.
Du kannst auch jederzeit die aktuellen Dateien aus dem Repository von Hand über die alten drüberschreiben, also quasi die initiale Installation wiederholen. Dabei darauf achten, dass die Zugriffsrechte hinterher wieder passen.
Hallo zusammen,
erstmal möchte ich ein großes Lob für dieses sehr schöne Frontend aussprechen! Es gefällt mir richtig gut und ist leicht einzurichten. Jetzt zu meiner Frage:
Ich habe aktuell einen Raspberry Pi B (erste Version) im Einsatz für die Hausautomation. Das TabletUI ist damit nicht wirklich schnell in der Bedienung und bei den Seitenwechseln springt die CPU auf 100% Auslastung.
Hat irgendwer das FHEM auf einem Pi 2 laufen? Oder kann ich die TabletUI evtl. auf einen anderen Server auslagern, z.B. auf mein NAS?
Viele Grüße,
Bernd
Zitat von: Brockmann am 17 Juli 2015, 07:54:05
Kannst Du es nicht einfach als image einbauen? Ich habe es bei mir so gemacht, ist aber eine andere Kamera und ggf. ein anderes Format:
<div data-type="label" class="cell big"><img src="http://instarwlan/videostream.cgi?user=XXX&pwd=XXX&resolution=32rate=1" height="340" wight="580" border="0"></img></div>
Hallo Brockmann,
Bei der VU+ Multiepg Seite handelt es sich um die Programmvorschau inkl. Timersteuerung.
EPG nicht MPEG :-)
Macht richtig Sinn, dass auf dem Tablet zu haben.
"Was kommt heute 20:15 Uhr?" "Okay, ich setzte eine Aufnahme und bleibe lieber noch auf der Terasse ..."
Zitat von: setstate am 17 Juli 2015, 09:10:23
Bei der VU+ Multiepg Seite handelt es sich um die Programmvorschau inkl. Timersteuerung.
EPG nicht MPEG :-)
Ah, manchmal ist ein Tippfehler eben doch kein Tippfehler. Sorry, ich halte schon meine Klappe! :-[
Zitat von: speridal am 17 Juli 2015, 08:34:21
Hallo zusammen,
erstmal möchte ich ein großes Lob für dieses sehr schöne Frontend aussprechen! Es gefällt mir richtig gut und ist leicht einzurichten. Jetzt zu meiner Frage:
Ich habe aktuell einen Raspberry Pi B (erste Version) im Einsatz für die Hausautomation. Das TabletUI ist damit nicht wirklich schnell in der Bedienung und bei den Seitenwechseln springt die CPU auf 100% Auslastung.
Hat irgendwer das FHEM auf einem Pi 2 laufen? Oder kann ich die TabletUI evtl. auf einen anderen Server auslagern, z.B. auf mein NAS?
Viele Grüße,
Bernd
Dein Raspi übernimmt auch die Displaysteuerung? Eigentlich ist die Gui für ein Standard-Tablet von der Stange gedacht, was man einfach an die Wand nagelt. Der dortige Browser ist hinreichend flott.
Man könnte jetzt etwas an den optischen JavaScript Effekten (beim Seitenwechsel) sparen. Wenn man alle fadeIn() und fadeOut() durch show() und hide() ersetzt, spart man etwas CPU auf Client-Seite.
Auf Server-Seite könnte man den Webserver auslagern. Darüber gab es hier im Thread schon einige Posts zum Thema Ftui > PHP >Fhem.
Ich persönlich habe Fhem auf einem 800Mhz CPU NAS laufen und im Eingangsbereich ein gebrauchtes Odys Noon Tablet für 99€ an der Wand.
Zitat von: setstate am 17 Juli 2015, 10:23:29
Dein Raspi übernimmt auch die Displaysteuerung? Eigentlich ist die Gui für ein Standard-Tablet von der Stange gedacht, was man einfach an die Wand nagelt. Der dortige Browser ist hinreichend flott.
Man könnte jetzt etwas an den optischen JavaScript Effekten (beim Seitenwechsel) sparen. Wenn man alle fadeIn() und fadeOut() durch show() und hide() ersetzt, spart man etwas CPU auf Client-Seite.
Auf Server-Seite könnte man den Webserver auslagern. Darüber gab es hier im Thread schon einige Posts zum Thema Ftui > PHP >Fhem.
Ich persönlich habe Fhem auf einem 800Mhz CPU NAS laufen und im Eingangsbereich ein gebrauchtes Odys Noon Tablet für 99€ an der Wand.
Hi,
mein "Client" ist aktuell zum Testen ein iPad 3 und der Webserver für die TabletUI läuft auf dem Raspberry, auf dem auch FHEM läuft. Trotzdem geht die CPU auf 100% für ein paar Sekunden. Ich such mal den Thread zum Thema auslagern des Webservers. Danke.
Gruß,
Bernd
Hallo zusammen,
Versuche mich gerade an einem Iphone-UI. Nachdem ich viel gelesen und probiert habe, bin ich nun aber bezüglich CSS und Farben einigermaßen verzweifelt und brauche Hilfe....
Ich habe ein eigenes CSS, basierend auf dem fhem-mobil-ui.css, in mein html eingebunden (als letzte CSS Datei). Teilweise scheint das auch zu funktionieren, zumindest das geht:
.weather:before {
color: #222222;
}
Das Setzen der Farben für switch und dimmer ist aber komplett wirkungslos. Hier die betreffenden Zeilen aus der CSS-Datei:
.switch.on{color:#000000;background-color:#FFFFFF;}
.switch.off{color:#FFFFFF;background-color:#000000;}
.dimmer.on{color:#000000;background-color:#FFFFFF;}
.dimmer.off{color:#FFFFFF;background-color:#000000;}
Was mache ich falsch?
Zitat von: speridal am 17 Juli 2015, 08:34:21
Hallo zusammen,
erstmal möchte ich ein großes Lob für dieses sehr schöne Frontend aussprechen! Es gefällt mir richtig gut und ist leicht einzurichten. Jetzt zu meiner Frage:
Ich habe aktuell einen Raspberry Pi B (erste Version) im Einsatz für die Hausautomation. Das TabletUI ist damit nicht wirklich schnell in der Bedienung und bei den Seitenwechseln springt die CPU auf 100% Auslastung.
Hat irgendwer das FHEM auf einem Pi 2 laufen? Oder kann ich die TabletUI evtl. auf einen anderen Server auslagern, z.B. auf mein NAS?
Viele Grüße,
Bernd
Ich hatte FHEM früher auch auf einem Raspi 1 laufen und bin vor einigen Monaten auf einen Raspi 2 umgezogen. Der Geschwindigkeitszuwachs ist schon sehr deutlich.
Du kannst FHEM auch auf einem NAS, wie bsw. einer Synology Diskstation installieren. Dazu kann ich aber nichts sagen.
Oli
Zitat von: OliS. am 17 Juli 2015, 20:11:17
Ich hatte FHEM früher auch auf einem Raspi 1 laufen und bin vor einigen Monaten auf einen Raspi 2 umgezogen. Der Geschwindigkeitszuwachs ist schon sehr deutlich.
Bezieht sich dieser deutliche Zuwachs auch auf den Seitenaufbau der Tablet UI beispielsweise auf einem Android-Tablet?
Ich bin mir nicht sicher, ob da nicht die Tablet-Hardware der Flaschenhals ist? Am PC wird dieselbe Seite jedenfalls flotter aufgebaut.
Zitat von: mc-hollin am 16 Juli 2015, 22:15:18
Hallo Kurt,
hab deine "dynamischen Devices" in die fhem-tablet-ui-config.js eingebaut.
Da die Steuerug über die Konfiguration läuft, sollte nicht das Hauptframework angepasst werden.
Ich habe das "data-device" durch "data-cfg-device" ersetzt (nur da wo es genutzt werden soll ;)) und erzeuge das "data-device" über die Config.
In "data-cfg-device" wird nur noch der Index der angegebenen Devices aus der Config eingetragen.
Kannst du dir im tpl_Beispiel1.htm anschauen.
Teste doch mal ob es so bei dir auch funktioniert.
Die Sourcen liegen wie gehabt hier http://forum.fhem.de/index.php?topic=34233.msg311209#msg311209 (http://forum.fhem.de/index.php?topic=34233.msg311209#msg311209)
Gruß Holger
Hallo Holger,
Ich habe weiter getestet, scheint soweit zu funktionieren. Ich habe noch eine Ergaenzung gemacht, um auch die Gridsterwidget Ueberschriften aus der json Datei zu holen, die Dateien kommen morgen. Was ich noch festgestellt habe, ist, dass im Zusammenhang mit circlemenu einiges durcheinander kommt. Sobald ein circlemenu in den Templates enthalten ist, funktioniert der pagebutton nicht mehr vernünftig.
Ich werde morgen mal versuchen meine ganze Oberflaeche auf config umzustellen, mal sehen was sich dabei noch so ergibt.
Gruß
Kurt
edit: Dateien sind jetzt angehängt.
gibt es eine möglichkeit den header irgendwie zu includen? ich nutze zwar nur 6 seiten die per pagetab - menue eingebunden sind aber eine Änderung am header bedingt immer das ändern aller 6 seiten.
Zitat von: eki am 18 Juli 2015, 18:13:32
Hallo Holger,
Ich habe weiter getestet, scheint soweit zu funktionieren. Ich habe noch eine Ergaenzung gemacht, um auch die Gridsterwidget Ueberschriften aus der json Datei zu holen, die Dateien kommen morgen. Was ich noch festgestellt habe, ist, dass im Zusammenhang mit circlemenu einiges durcheinander kommt. Sobald ein circlemenu in den Templates enthalten ist, funktioniert der pagebutton nicht mehr vernünftig.
Ich werde morgen mal versuchen meine ganze Oberflaeche auf config umzustellen, mal sehen was sich dabei noch so ergibt.
Gruß
Kurt
Hallo Kurt,
mir ist auch aufgefallen, dass die FixedTemplates beim Seitenwechsel anscheinend wieder ihre Befehle verdoppeln.
Dies hatte ich eigentlich schon bereinigt. Schaue ich mir aber noch mal an.
Ich muss mich wirklich tiefer mit jquery und javascript beschäftigen.
Ist manchmal noch etwas verwirrend.
Zitat von: setstate am 17 Juli 2015, 10:23:29
ein gebrauchtes Odys Noon Tablet für 99€ an der Wand.
Hast Du einfach das Ladegerät drangehängt oder auch die Batterie ausgebaut?
Einfach Ladegerät dran. Ich hoffe doch, es ist eine heilwegs intelligente Ladeelektronik verbaut. Ich wollte erst per Homatic Schalter bei 10% ein und 100% aus, aber nur mit Dauer-am-Strom bleibt das Display auch an.
hi zusammen,
super job ..
ich verwende bis heute einen angepassten floorplan und habe den gui hier getestet.
brauche bei manchen devices den "blink" funktion. da aber der shortpoll auf 30 sek sitzt, funktionert es mit z.b. "set <device> blink 1000 1" nicht.
hat jemand eine idee ?
danke&gruss
tony
Zitat von: chris1284 am 18 Juli 2015, 18:25:19
gibt es eine möglichkeit den header irgendwie zu includen? ich nutze zwar nur 6 seiten die per pagetab - menue eingebunden sind aber eine Änderung am header bedingt immer das ändern aller 6 seiten.
Ich bin nicht sicher, ob ich Deine Frage verstehe, aber normalerweise müsstest Du bei Benutzung von pagetab nur eine Seite haben, in der alle js/css-Dateien geladen werden und auch die meta-Definitionen enthalten sind, wenn das mit Header gemeint ist. In den Unterseiten (pagetabs) muss dann nur der Inhalt des Gridster-Teils enthalten sein. Du findest entsprechende Info auch im Demo-thread/repository in meinen Beispielseiten.
Unterseiten sehen dann so aus:
<!DOCTYPE html>
<html>
<head>
<title>Detail</title>
</head>
<body>
<div class="gridster">
<ul>
<!-- ********************** Menu ************************************ -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.templ"></li>
....
</ul>
</div>
</body>
</html>
Zitat von: tonyf am 19 Juli 2015, 12:40:09
hi zusammen,
super job ..
ich verwende bis heute einen angepassten floorplan und habe den gui hier getestet.
brauche bei manchen devices den "blink" funktion. da aber der shortpoll auf 30 sek sitzt, funktionert es mit z.b. "set <device> blink 1000 1" nicht.
hat jemand eine idee ?
danke&gruss
tony
Und mit longpoll="1" im FTUI? Reicht die Response Zeit dann?
Zitat von: viegener am 19 Juli 2015, 13:05:35
Ich bin nicht sicher, ob ich Deine Frage verstehe,
hast du, danke für die info. zur einführung hiess es mal auf jeder seite müsse der header vollständig sein...
ein anderes Problem:
beim ersten aufruf von der tui werden bei mir häufig nicht alle daten geladen (menü nur der text ohne die buttons, keine readings, null werte). die ui wird dann quasi nur halb aufgebaut und man muss ca 2-3 mal im firefox / chrome refreshen bis alles geladen wurde, im webviewcontrol ca 5-6 mal. danach läuft alles sauber wenn es denn einmal voll geladen wurde. der ie11 hat dies problem scheinbar garnicht, hier werden hin und wieder nur ein paar readings mit null angezeigt.
Zitat von: mc-hollin am 18 Juli 2015, 18:58:06
Hallo Kurt,
mir ist auch aufgefallen, dass die FixedTemplates beim Seitenwechsel anscheinend wieder ihre Befehle verdoppeln.
Dies hatte ich eigentlich schon bereinigt. Schaue ich mir aber noch mal an.
Ich muss mich wirklich tiefer mit jquery und javascript beschäftigen.
Ist manchmal noch etwas verwirrend.
Hallo Holger,
ich habe heute einiges herumprobiert, und festgestellt, dass es da noch einige Problemchen gibt. Irgendwie scheint es ein timimg Problem zu geben, dadurch bekommt die ftui Hauptroutine nicht alle devices mit. In der Variable devs (siehe fhem-tablet-ui.js) stehen immer unterschiedliche Anzahlen an Werten, aber so gut wie nie alle devices. Wenn man nach dem Umsetzen der devices aus dem json in das HTML einen timeout setzt, scheint es besser zu funktionieren (siehe angehängtes js). Ist aber erst mal eher ein "würgaround".
Gruss
Kurt
Mal ne frage, kann man das "CIRCLEMENU" transparent machen?
Zitat von: schitzosteve am 17 Juli 2015, 18:01:22
Hallo zusammen,
Versuche mich gerade an einem Iphone-UI. Nachdem ich viel gelesen und probiert habe, bin ich nun aber bezüglich CSS und Farben einigermaßen verzweifelt und brauche Hilfe....
Ich habe ein eigenes CSS, basierend auf dem fhem-mobil-ui.css, in mein html eingebunden (als letzte CSS Datei). Teilweise scheint das auch zu funktionieren, zumindest das geht:
.weather:before {
color: #222222;
}
Das Setzen der Farben für switch und dimmer ist aber komplett wirkungslos. Hier die betreffenden Zeilen aus der CSS-Datei:
.switch.on{color:#000000;background-color:#FFFFFF;}
.switch.off{color:#FFFFFF;background-color:#000000;}
.dimmer.on{color:#000000;background-color:#FFFFFF;}
.dimmer.off{color:#FFFFFF;background-color:#000000;}
Was mache ich falsch?
Dies würde mich auch brennend interessieren.
Wenn ich z.B. meine eigene fhem-tablet-ui-user.css (welche eine Kopie der fhem-tablet-ui ist) bearbeite und unter dem im Header angegebenen Pfad ablege, funktioniert auf einmal nichts mehr. Besser gesagt, es ist alles verschoben (z.B. im Circlemenu).
Daher wäre es schön, wenn mal jemand kurz erläutern könnte, wie die einzelnen css-Dateien zusammen spielen.
Z.B. ob es überhaupt möglich ist, zwei Dateien einzubauen, welche sich nur in den Farben unterscheiden oder muss der Header dann entsprechend angepasst und der Verweis auf die eigentlich nicht benötigte Datei daraus entfernt werden?
Oder gibt es hierzu eine gute Beschreibung im Netz?
Vielen Dank.
Kim
Es gibt keine speziellen Beschreibungen. Es ist Standard CSS, also könnte jedes beliebige CSS Tutorial weiterhelfen. Meine Tipps:
- Syntax checken
- File Reihenfolge beachten
- mit kleinen Änderungen von einem funktionierenden Beispiel ausgehend anfangen (mobil_2.html + fhem-mobil-ui.css)
- File Namen + Pfad richtig ?
- Entwicklertools im Browser benutzen: zeigt Zusammenhänge und man kann live editieren.
Zitat von: DJ_SAMMY190 am 19 Juli 2015, 23:22:35
Mal ne frage, kann man das "CIRCLEMENU" transparent machen?
Dann ist es ja unsichtbar!? ;)
Zitat von: setstate am 20 Juli 2015, 10:24:32
Es gibt keine speziellen Beschreibungen. Es ist Standard CSS, also könnte jedes beliebige CSS Tutorial weiterhelfen. Meine Tipps:
- Syntax checken
- File Reihenfolge beachten
- mit kleinen Änderungen von einem funktionierenden Beispiel ausgehend anfangen (mobil_2.html + fhem-mobil-ui.css)
- File Namen + Pfad richtig ?
- Entwicklertools im Browser benutzen: zeigt Zusammenhänge und man kann live editieren.
kopiert man die datei 1:1 und benennt sie um und bindet sie im abschnitt der index ein
<!-- define your personal style here, it wont be overwritten -->zerhaut es den style (ohne das man am css irendetwas inhaltlich geändert hat). übernimmt man nur teile und passt sie an (zb nur body{}) läuft dies einwandfrei.
ist mir gestern auch aufgefallen als ich das originale css so ein wenig ändern wollte.
Genau das Gleiche passiert mir auch ständig.
Und da ich komplett neu bin in der Materie, dachte ich halt immer, dass ich etwas falsch mache.
Ich bin halt davon ausgegangen, dass ich die fhem-tablet-ui.css kopiere und in fhem-tablet-ui-user.css umbenenne, meine Farbänderungen eintrage und dann läuft das schon. Aber dann verhagelt es mir alles.
Gruß
Kim
Zitat von: setstate am 20 Juli 2015, 14:32:33
Dann ist es ja unsichtbar!? ;)
Schlecht ausgedrückt.
Hier der screenshot. ich denke du weisst dann was ich meine ;)
Das untere beide sind beides Circlemenüs^^
Zitat von: DJ_SAMMY190 am 20 Juli 2015, 17:05:38
Schlecht ausgedrückt.
Hier der screenshot. ich denke du weisst dann was ich meine ;)
Das untere beide sind beides Circlemenüs^^
Hast du mal probiert, dem mittleren Element (push?) data-off-background-color="transparent" und data-on-background-color="transparent" zu setzen?
Hab mal getestet. Leider ohne Erfolg. verschwindet nur der Kreis. Aber trotzdem das grau nicht transparent :/
Zitat von: Brockmann am 18 Juli 2015, 11:25:19
Bezieht sich dieser deutliche Zuwachs auch auf den Seitenaufbau der Tablet UI beispielsweise auf einem Android-Tablet?
Ich bin mir nicht sicher, ob da nicht die Tablet-Hardware der Flaschenhals ist? Am PC wird dieselbe Seite jedenfalls flotter aufgebaut.
Entschuldige die späte Antwort.
Über den Geschwindigkeitszuwachs der FTUI kann ich leider nichts sagen, da ich das auf meinem ersten Raspi noch nicht genutzt habe. Aber auf dem Raspi 2 ist die UI (WEB und FTUI) recht flott.
Oli
Zitat von: chris1284 am 20 Juli 2015, 15:08:01
kopiert man die datei 1:1 und benennt sie um und bindet sie im abschnitt der index ein
<!-- define your personal style here, it wont be overwritten -->
zerhaut es den style (ohne das man am css irendetwas inhaltlich geändert hat). übernimmt man nur teile und passt sie an (zb nur body{}) läuft dies einwandfrei.
ist mir gestern auch aufgefallen als ich das originale css so ein wenig ändern wollte.
Die Erklärung dafür ist, dass beim zweiten Einbinden der fhem-tablet-ui.css auch Definitionen aus den anderen css-Dateien (z.B.: powerange oder jquery.toast) überschrieben werden. Die Regeln dazu was überschrieben wird und was nicht, ergeben sich aus dem CSS Standard. Leider ist dieser wie auch andere webstandards alles andere als optimal und wird dann auch noch in verschiedenen Browsern unterschiedlich implementiert.
Ich bin zu meinen EInstellungen durch Try-and-Error bekommen und bin mit der Aufteilung auch nicht überall zufrieden, insbesondere weil ich versuche soviel wie möglich auf meiner Einstiegsseite unterzubekommen. Ich kann vorschlagen, dass ich versuche bei konkreten Zielen/Problemen zu helfen, allerdings ohne eine gewisses Grundverständnis von css wird es nicht gehen. Die gute Nachricht ist, ein vollständiges Verständnis von css ist sowieso unmöglich ;D
Ich habe 2 kleine Probleme und weiß nicht so recht ob die Selbstverschuldet sind oder ob einer anderen Stelle was nicht passt.
Bei mir werden zum Teil Befehle doppelt an FHEM gesendet, wie z.Bsp. bei einem Schalter.
Das andere Problem ist das widget mit der Windrichtung. Es wir bei mir immer doppelt dargestellt und ich weiß nicht woran es liegt.
Kann mir da jemand weiterhelfen woran es liegt?
Zitat von: devil77 am 21 Juli 2015, 17:23:53
Kann mir da jemand weiterhelfen woran es liegt?
Es wäre schon hilfreich, wenn Du Deinen Code dazu postest, am besten innerhalb eines Code-Blocks, wegen der Übersichtlichkeit.
Ansonsten ist es doch reine Kaffeesatzleserei...
Hallo zusammen,
ich versuche mich gerade an diesem Frontend. Kann mir jemand erklären wie ich nun meine readingsgroup rein bekomme? Weil da soll es ein widget geben, aber kein erklärung dazu :-(
Zitat von: setstate am 29 März 2015, 20:12:34
Wow chris1284,
das gefällt mir sehr sehr gut. Nur noch den Grauton den Button im OFF Status etwas heller machen und es sieht wunderschön als Bright Theme des FHEM Tablet UI aus. Was hast du alles geändert? Ist es schon veröffentlichbar?
Wir haben auch schon über ein Farbschema nachgedacht, genau das wäre das zweite offizielle Schema, was ich anbiete würde.
data-type="switch" data-off-background-color="#999999"
Gibt es das schon? Meine Frau will was helleres :-)
Zitat von: RettungsTim am 22 Juli 2015, 12:24:59
Hallo zusammen,
ich versuche mich gerade an diesem Frontend. Kann mir jemand erklären wie ich nun meine readingsgroup rein bekomme? Weil da soll es ein widget geben, aber kein erklärung dazu :-(
Ja das widget gibt es --> es heisst readingsgroup
Grundsätzlich wird eine readingsGroup dann entsprechend der Formatierung in fhem 1:1 im Tablet angezeigt.
Wenn man in der readingsgroup css-Verweise, Bilder oder ähnliches aus fhemweb verwendet müssen die entsprechenden Dateien natürlich auch im tablet UI eingebunden werden.
die Parameter sind auch recht überschaubar:
data-device="<device>"
data-get="<was triggert den update>"
data-max-update="<Minimum sekunden zwischen 2 Updates des widgets um die Systemlast zu begrenzen>"
@setstate: Ist das Readme, die Referenz um Doku hinzuzufügen und wie möchtest Du das erhalten?
Gruss,
Johannes
Zitat von: RettungsTim am 22 Juli 2015, 12:50:52
Gibt es das schon? Meine Frau will was helleres :-)
ich habe ein helles design erstellt in dem ich ein paar sachen in einer seperaten css angepasst habe. aktuiell ist das nur der body gridster li und gridster li header
da ich nicht alle widgets nutze kann ich nicht sagen in wie weit das für alle passt. ich kann sie nachher mal amhängen
Das schaut super aus!! Wie bekommst du das so schön positioniert. Ich habe das noch nicht verstanden ich ich das mache.
Z.B. deine Uhrzeit. Die ist bei dir genau mittig, bei mir sieht das ätzend aus, siehe Bild.
Edit: Was ich dzau sagen muss das ich gerade mit der fhem-mobil-ui.css teste
@Chris1284
Deine Aquariumtemperatur ist der "You make my Day" für heute ;D ;D ;D
Zitat von: CoolTux am 22 Juli 2015, 14:45:19
@Chris1284
Deine Aquariumtemperatur ist der "You make my Day" für heute ;D ;D ;D
;D ;D ;D ;D ;D ;D ;D Schlitschuh fahrende Fische.... Sorry fürs off-topic, ich kugel mich gerade
ja, der sensor muss gerade im tiefkühlfach dienst schieben, hatte nur den einen für solche umgebungen :-)
hi chris1284
auf deinem 4 Bild hat sich auch noch ein Tippfehler eingeschlichen.
Sollte möglicherweise Luftfeuchte heißen?....
Zitat von: viegener am 22 Juli 2015, 13:09:33
Ja das widget gibt es --> es heisst readingsgroup
Grundsätzlich wird eine readingsGroup dann entsprechend der Formatierung in fhem 1:1 im Tablet angezeigt.
Liegt es an letzterem, dass dieses Widget Vorgaben durch das class-Attribut (beispielsweise
class="alert") ignoriert?
Ich habe gerade mal versucht, so ein Widget mit einem readingsHistory-Device zu kombieren. Das scheint auch gut zu klappen.
Allerdings würde ich die Optik gerne anpassen, weil ich damit wichtige Hinweise anzeige, die nicht übersehen werden sollen.
Zitat von: chris1284 am 22 Juli 2015, 15:17:15
ja, der sensor muss gerade im tiefkühlfach dienst schieben, hatte nur den einen für solche umgebungen :-)
Das interessiert mich jetzt aber. Welchen hast Du für sowas. Ich suche auch einen fürs Tiefkühlfach und den Kühlschrank.
anbei die css. die einfach zusätzlich in der index mit einbinden.
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui_lite.css" />
bei den pagetab-icons hab ich nur data-on-background-color="#aa6900" zugefügt und bei werte die orange sein sollen style="color: #aa6900;"
beispiele
<div data-type="pagetab" data-url="site_webcams.html" data-icon="fa-video-camera" data-on-background-color="#aa6900" class="cell"></div>
<div style="color: #aa6900;" data-type="label" data-device="out_sen_th" data-get="humidity" data-unit=" %" class="bigger"></div>
gds warnmeldungen werden vom gds-widget automatisch eingefärbt (mal schauen ob ich das calview widget soweit hinbekomme das dies bei heutigen terminen auch geschieht)
@CoolTux: den HM-WDS30-T-O, den gabs bereits 2x bei notebooksbilliger für 19,00€ statt um die 40€ (hoffe dieses Jahr auch wieder). der kann aber max -19,9°C hat aber auch schon mehr angezeigt
Cool. Danke Dir. Werde ich mir holen.
das grau kommt auch mal geil ;) aber auch du dann das Problem dass die Buttons leider nicht alle transparent sind
Zitat von: DJ_SAMMY190 am 22 Juli 2015, 19:28:18
aber auch du dann das Problem dass die Buttons leider nicht alle transparent sind
ist mir nicht aufgefallen (habe ja auch kein hintergrund bild). die transparents habe ich aus CoolTux beispiel mal geklaut ;-) http://forum.fhem.de/index.php/topic,37378.30.html man kann so noch etwas an der farbe drehen. ich denke ich will die auch garnicht transparent bzw man müsste mal testen wie das aussieht
hallo,
wie kann ich in der tablet-ui einen weblink dastellen ?
zb . eine kamera :
define webcam weblink htmlCode <html> <img name="dyn_bild" src="http://192.168.25.54:8008" width="320" height="240"> <br> <a href="http://192.168.178.62:8083/fhem?detail=webcam">webcam</a> </body></html>
Irgendwie bekomm ich das nicht hin ...
ich binde 4 webcams per
<li data-row="5" data-col="6" data-sizex="4" data-sizey="2">
<header>Webcam Brocken</header>
<div data-type="image" class="cell" data-url="http://www.hsb-wr.de/picture_library/webcam_bro/brocken.jpg" data-size="80%" data-refresh="60"></div>
</li>
ein und lasse das bild alle 60 sek refreshen.
Zitat von: Brockmann am 22 Juli 2015, 17:36:51
Liegt es an letzterem, dass dieses Widget Vorgaben durch das class-Attribut (beispielsweise class="alert") ignoriert?
Ich habe gerade mal versucht, so ein Widget mit einem readingsHistory-Device zu kombieren. Das scheint auch gut zu klappen.
Allerdings würde ich die Optik gerne anpassen, weil ich damit wichtige Hinweise anzeige, die nicht übersehen werden sollen.
Ja, vermutlich, denn das Widget bindet den HTML-Teil des Readingsgroup direkt ein, ohne das HTML selber zu verändern. Die beiden CSS-Dateien für FHEMWeb und das tablet UI sind aber eigentlich nicht aufeinanderaufbauend sondern separat entwickelt.
Es sollte aber auch möglich sein die readingsgroups für die entsprechenden tablet CSS-classes/styles zu machen.
Zitat von: DJ_SAMMY190 am 20 Juli 2015, 17:05:38
Schlecht ausgedrückt.
Hier der screenshot. ich denke du weisst dann was ich meine ;)
Das untere beide sind beides Circlemenüs^^
Kann ich mir erst am WE live ansehen, so habe ich jetzt auch keine direkte Stelle, wo man das ändern müsste.
Zitat von: viegener am 22 Juli 2015, 13:09:33
Ja das widget gibt es --> es heisst readingsgroup
Grundsätzlich wird eine readingsGroup dann entsprechend der Formatierung in fhem 1:1 im Tablet angezeigt.
Wenn man in der readingsgroup css-Verweise, Bilder oder ähnliches aus fhemweb verwendet müssen die entsprechenden Dateien natürlich auch im tablet UI eingebunden werden.
die Parameter sind auch recht überschaubar:
data-device="<device>"
data-get="<was triggert den update>"
data-max-update="<Minimum sekunden zwischen 2 Updates des widgets um die Systemlast zu begrenzen>"
@setstate: Ist das Readme, die Referenz um Doku hinzuzufügen und wie möchtest Du das erhalten?
Gruss,
Johannes
Da ich bis heute nicht weiß, was ReadingGroups sind, und ich nicht glaube, dass ich das brauchen werde, muss das jemand mit mehr Ahnung in der Readme ergänzen und einen pull request schicken.
Hallo zusammen
Bin neu im Thema Fhem und habe mich vor allem wegen dem UI mal registriert. Ich habe das ganze gestern mal versucht zum laufen zu bekommen.
Jetzt habe ich 2 Anliegen.
1. Der Befehl: update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt liefert mir ein: https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt: empty answer received zurück. Hat hier jemand eine Idee woran das liegen könnte?
Ich habe dann alles von Hand in die nötigen Verzeichnisse kopiert. Wäre aber nett, wenn man einfacher auf Update prüfen könnte.
2. Ich habe eine index.html angelegt, mit einem Dimmer, einem Slider und einem Volume Regler für eine HUE Lampe. Mit dem Internet Explorer kann ich zwar die Farbe anpassen und 1x einschalten, aber danach kann ich die Lampe nicht mehr ausschalten, wechsle ich in den Entwicklermodus (F12) funktioniert alles problemlos. Auf einem Tablet mit Windows 8 kann ich die Elemente gar nicht nutzen. Weder im App Browser noch im Desktop IE funktioniert etwas.
Habe ich hier etwas übersehen? Jemand eine Idee? Auf einem Android Handy funktionieren alle 3 Elemente problemlos.
Besten Dank und viele Grüsse
mike
update geht ganz einfach per knopfdruck auf der fhem-seite wenn du in deiner FHEMWEB definition das attribut menuEntries setzt und dort einfach einen neuen menue-punkt für das tui-update einfügst
Update TUI,/fhem?cmd=update%20all%20https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt,Update TUI Nesges,/fhem?cmd=update%20all%20https://raw.githubusercontent.com/nesges/Widgets-for-fhem-tablet-ui/master/controls_widgets-for-fhem-tablet-ui.txt
der code baut dir nen update button für die ui und für die widgets von nesges
Hallo,
inwieweit ist denn das UI skalierbar?
Mein Gedanke ist, ich würde es gerne auf einem 320x480 touchscreen laufen lassen und als Mini Statusdisplay missbrauchen.
Siehe auch: http://www.amazon.de/Touch-Screen-Konzipiert-Raspberry-Modell/dp/B00SGJIV12/ref=sr_1_1?ie=UTF8&qid=1437677570&sr=8-1&keywords=Raspberry+Display
VG
Zitat von: Posti123 am 23 Juli 2015, 20:55:56
Hallo,
inwieweit ist denn das UI skalierbar?
Mein Gedanke ist, ich würde es gerne auf einem 320x480 touchscreen laufen lassen und als Mini Statusdisplay missbrauchen.
Siehe auch: http://www.amazon.de/Touch-Screen-Konzipiert-Raspberry-Modell/dp/B00SGJIV12/ref=sr_1_1?ie=UTF8&qid=1437677570&sr=8-1&keywords=Raspberry+Display
VG
Bei der Größe des Displays bekommst du ca. 8 Buttons neben einander und 6 übereinander. Mit class="small" haben diese nur 80% ihrer Größe, damit haben dann sogar noch mehr Platz. Ich denke, das ist für ein Status Panel ausreichend. Damit die Symbole näher zusammenrücken, muss man "cell" weglassen und ggf. "narrow" als class hinzufügen.
Ich habe heute nach längerer Zeit (ca Mai) mal ein Update fürs Tablet-UI gemacht und jetzt werden keine Widgets mehr angezeigt. Die Labels werden alle angezeigt. Woran kann das liegen?
Bei der index-example.html werden die Widgets angezeigt.
Gruß
Alois
Zitat von: setstate am 23 Juli 2015, 10:10:14
Da ich bis heute nicht weiß, was ReadingGroups sind, und ich nicht glaube, dass ich das brauchen werde, muss das jemand mit mehr Ahnung in der Readme ergänzen und einen pull request schicken.
Beschreibung zu den readingsGroup widget ist jetzt auch im pull-request #114 enthalten.
in #114 sind schon diese früheren Änderungen enthalten:
- FIX zu famultibutton zur Vermeidung eines undefined faelem
- Slider labels können auch nicht numerische Werte sein (wenn der device-wert nicht-numerisch ist)
- Playstream reacting on deivce changes to play stream
- multi-state button internal state ergibt sich aus data-get-on array (pos 0 ist ON, alles andere OFF)
Zitat von: Luigi am 23 Juli 2015, 23:26:16
Bei der index-example.html werden die Widgets angezeigt.
dann schau dir mal den header teil der example an und dann den deiner index. wahrschleinlich musst du nur den header übernehmen.
Zitat von: setstate am 16 Juli 2015, 20:38:06
Hallo Micha,
das wird an der Cross-Origin Blockade liegen: Die Java-Console spuckt das bei mir aus:
Nesges hatte dazu auch einige Anmerkungen bei sich im Wiki: https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/iframe (https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/iframe)
Hallo setstate,
nachdem ich nun data-check auf die normale fhem Seite mache klappt es wunderbar.
Zitat von: chris1284 am 24 Juli 2015, 06:11:23
dann schau dir mal den header teil der example an und dann den deiner index. wahrschleinlich musst du nur den header übernehmen.
Vielen Dank, Header ausgetauscht und es läuft wieder.
Zitat von: viegener am 24 Juli 2015, 00:41:18
Beschreibung zu den readingsGroup widget ist jetzt auch im pull-request #114 enthalten.
in #114 sind schon diese früheren Änderungen enthalten:
- FIX zu famultibutton zur Vermeidung eines undefined faelem
- Slider labels können auch nicht numerische Werte sein (wenn der device-wert nicht-numerisch ist)
- Playstream reacting on deivce changes to play stream
- multi-state button internal state ergibt sich aus data-get-on array (pos 0 ist ON, alles andere OFF)
Danke!
Erledige ich, wenn ich wieder zuhause bin.
Hallo setstate,
habe mit Pull-request #115 einen kleinen Verbesserungsvorschlag für das weather widget: Er führt die Möglichkeit ein, über ein meta 'weather_image_path' die Basis-URL für statische weather-images festzulegen. Wenn dieses meta nicht definiert ist, bleibt alles beim gewohnten Verhalten. Wenn es definiert ist, gewinnt es vor 'fhem_url'/fhem/images/global/weather. Das Attribut 'image-path' am jeweiligen Element hat aber weiterhin Vorrang.
Bei meiner Installation hilft es, den FHEM server zu entlasten, indem statische Elemente von einem lesitungsfähigeren Webserver ausgeliefert werden. Vielleicht kommt das auch anderen zugute.
Grüße,
Andy.
Feature request:
Guten Tag,
ich bin derzeit begeistert dabei, mit Tablet UI ein Frontend zu stricken. Was mir an einer Stelle weiterhelfen würde, wäre, wenn auch das image-widget ein data-cmd und idealerweise ein data-url unterstützen würde, so dass, wenn man das angezeigte Bild antippt, eine Aktion ausgeführt oder ein Link angesprungen wird.
Da es die Funktionalitäten ja bereits gibt, ist meine Hoffnung, dass man die ohne zu hohen Aufwand zusammenführen kann.
Schönen Sonntag noch
Frank
Zitat von: fstefan1960 am 26 Juli 2015, 13:19:41
ich bin derzeit begeistert dabei, mit Tablet UI ein Frontend zu stricken. Was mir an einer Stelle weiterhelfen würde, wäre, wenn auch das image-widget ein data-cmd und idealerweise ein data-url unterstützen würde, so dass, wenn man das angezeigte Bild antippt, eine Aktion ausgeführt oder ein Link angesprungen wird.
Könnte man sicher einbauen. Aber im Prinzip kannst Du auch jetzt schon ein <a href="...">...</a> um das <div> herumbauen, welches das image widget enthält. Dann würde beim Antippen des Bildes der in href angegebene Link angesprungen.
das popup-widget eignet sich dafür auch
Hallo zusammen,
ich bin letztens auch auf das Tablet UI gestoßen und bin richtig begeistert, das erste Frontend das mich optisch wirklich überzeugt hat. Bin also auch schon fleißig am basteln :)
Jetzt habe ich aber eine Frage: gibt es die Möglichkeit, von einem Widget den Befehl an mehrere Geräte zu senden? Konkret geht es um das Widget thermostat. Das liest im Moment die Werte von HM-CC-RT-DN und sendet auch die Werte dorthin, funktioniert auch soweit. Dieser Thermostat ist aber mit den Raumthermostat (weiß gerade die Bezeichnung nicht) gekoppelt und wenn ich nun über das Widget die Temperatur ändere, bleibt auf dem Raumthermostat noch die alte Temperatur.
Oder was gibt es sonst für Möglichkeiten, das Problem zu lösen/umgehen? Evtl mit einem Dummy der die readings von beiden Geräten bekommt und den set-Befehl an beide weiterleitet?
Wäre super, wenn da jemand einen guten Vorschlag hätte :)
Viele Grüße
Was für ein Thermostat ist es denn? Homematic?
Wenn ja, dann kopple doch über UI das Thermostat und nicht den Stellantrieb.
Stimmt, den Teil hatte ich vergessen zu erwähnen: das geht soweit, dann sehe ich im Widget aber nicht mehr den aktuellen Wert vom Ventil. Klar, ich könnte den Wert einfach so noch dazuschreiben, aber wenn das alles in einem Widget funktionieren würde, wäre das auch ganz nett ;D
Und ja, es geht um einen Homematic Thermostat (HM-CC-RT-DN) und diesen Raumthermostat: HM-TC-IT-WM-W-EU
Du könntest in deinem Thermostat ein Userreading anlegen das die Ventillstellung abfragt.
In dem Widget kannst Du das dann abfragen und hättest alles in einem.
Tausend Dank, das funktioniert :) Wieder was gelernt mit den userreadings...
Hallo zusammen,
gibt es eine Möglichkeit, einen Button (oder einem anderem Element, das den Aufruf einer Url unterstützt) in Abhängigkeit eines Readings zu verändern?
Der Hintergrund ist, dass ich mein 7" Tablet nicht überfrachten möchte und div. Infoseiten habe und noch erstellen möchte, die über den i-Button unten links (s. Screenshot) erreichbar sind. Dem Screenshot könnt ihr entnehmen, dass z.B. die Batterie des Sensors an der Haustüre als low gemeldet wird. In FHEM habe ich einen Dummy, dessen Status in dem Fall mit "warning" gesetzt wird. Ich möchte den i-Button unten links in einem solchen Fall anders darstellen, so dass man informiert wird, dass interessante Informationen vorliegen.
VG Stefan
Du kannst bei einem Button die data-on-background-color setzen, dann ändert sich die Farbe in Abhängigkeit des Readings.
<div data-type="button" data-device="Unwetterzentrale" data-get="WarnCount" data-url="index_21.html" data-icon="oa-weather_wind" data-get-on="!off" data-get-off="0" data-on-background-color="#B10000"></div>
VG
Sven
Wer lesen kann... ::)
Danke für den Wink mit dem Zaunpfahl! :)
VG Stefan
Ich nutze es für Unwetterwarnungen, wenn welche vorliegen ist der Buttonhintergrund rot, ansonsten unauffällig gelb.
VG
Sven
Hallo,
eine Frage zum Popup Widget,
wie kann man es machen, das es automatisch schließt wenn im Popup etwas angeklickt wird?
Danke und Gruß
Denny
Mir ist grade aufgefallen das die Beschriftung des simplecharts bei dem hellen CSS File nicht angezeigt wird :)
PS: Wenn jemand auf der Suche nach einem "guenstigen" 23" Touchscreen ist, dann kann ich den Hanns HT231HPB empfehlen. Heute bekommen und mit einem ODROID C1 im Einsatz.
Zitat von: hillbicks am 30 Juli 2015, 23:05:41
Mir ist grade aufgefallen das die Beschriftung des simplecharts bei dem hellen CSS File nicht angezeigt wird :)
Guter Hinweis, da fehlt ein
svg > text {
fill: #444;
}im hellen CSS File.
... da wird noch einiges fehlen
Zitat von: nightstorm99 am 29 Juli 2015, 11:31:07
Hallo,
eine Frage zum Popup Widget,
wie kann man es machen, das es automatisch schließt wenn im Popup etwas angeklickt wird?
Danke und Gruß
Denny
Nachtrag:
Außerdem ist beim Popup noch ein merkwürdiger Fehler,
wenn ich die Tabelt UI in einem normalen Browser am Rechner aufmache und dann auf ein Popup klicke,
blendet er immer die Scrollleisten der Seite ein.
Danke und Gruß
Zitat von: nightstorm99 am 31 Juli 2015, 07:39:15
Außerdem ist beim Popup noch ein merkwürdiger Fehler,
wenn ich die Tabelt UI in einem normalen Browser am Rechner aufmache und dann auf ein Popup klicke,
blendet er immer die Scrollleisten der Seite ein.
Stimmt, ich hatte den Schattenhintergrund sicherheitshalber mal sehr groß gemacht. Das werde ich demnächst wieder zurück nehmen:
#shade {
position:absolute;
z-index:1001;
background-color:#000000;
opacity:0.5;
height:500%;
width:120%;
top:0px;
left:0px;
}height muss auf 100% oder evtl. 120%
ein, zwei frage zum criclemenue:
ich möchte in der mitte das stop-symbol. nun verhält es sich aber so das beim öffnen bereits einmal stop gesendet wird. irgendwie logisch da ich den button ja klicke.
bekomme ich das weg das beim ersten klick geschaltet wird und beim dann wirklich ersten das circlemenu nicht geschlossen wird?
ich verstehe nicht wie sich data-direction verält. ich habe eine wilde liste von button sund wollte per datadirection zum beispiel button ein in der liste nach unten, button 2 oben, button 3 left usw.
das circlemenu hat sie aber genau in der reihenfolge angeordnet (im uhrzeigersinn) wie sie in der liste stehen
<li><div data-type="push" data-device="WC2_IPCAM" data-set="cmd" data-set-on="3" data-icon="fa-stop"></div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="tilt" data-set-on="up" data-icon="fa-caret-up"></div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="pan" data-set-on="right" data-icon="fa-caret-right"></div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="tilt" data-set-on="down" data-icon="fa-caret-down"></div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="pan" data-set-on="left" data-icon="fa-caret-left"></div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="cmd" data-set-on="3" data-icon="fa-stop"></div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="pos" data-set-on="1" data-icon="">1</div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="pos" data-set-on="2" data-icon="">2</div></li>
<li><div data-type="push" data-device="WC2_IPCAM" data-set="pos" data-set-on="3" data-icon="">3</div></li>
um zum schluss eine frage zum image-widget: ich habe den refresh auf 1 sek gestellt, aktualisert wird aber irgenwie nichts... ist das zu kurz?
Könnte man simplechart noch dazu überreden beim z.B. Monatswechsel die Daten aus 2 Logfiles zu holen ?
Hallo zusammen,
ich bin seit kurzem dabei das Tablet UI zu nutzen und bin sehr begeistert.
Allerdings habe ich ein bisschen Performance Probleme. Der Seitenaufbau mit meinem Raspberry Pi B+ dauert doch eine ganze Weile.
Deshalb habe ich mir die fhem-tablet-ui.js mal angeschaut, und mich mit meinen bescheidenen js und HTML Kenntnissen ein Bisschen an einer Optimierung zu versuchen.
Herausgekommen ist eine Version, die "jsonlist2" statt "list" verwendet und mit einigen anderen kleinen Anpassungen mit nur sehr wenigen GET Aufrufen an den Server auskommt. Das hat bei mir zu ganz guten Verbesserungen in der Performance geführt.
Daher möchte ich diese Version mal hier einkippen. Ich hoffe, ich habe durch meine Änderungen keinen Seiteneffekte eingebaut, bei mir hat sich bisher nichts Nachteiliges gezeigt, aber man weiß ja nie.
@setstate: Vielleicht hast Du ja Zeit und Lust Dir das mal anzuschauen und zu entscheiden, ob Du es eventuell weite verwenden möchtest (Du siehst ich bin im Konjunktiv geblieben, weil ich eigentlich nicht sogern im Code anderer Leute herummache (ich habe daher auch nur auskommentiert und hinzugefügt, aber nichts gelöscht), aber, wie gesagt, ich hatte einen gewissen Leidensdruck).
Hallo,
ich nutze im Moment noch eine eigene HTML-Seite zur Darstellung von FHEM-Werten, weil ich ursprünglich von dem InfoFrame-Projekt komme und es nach und nach mit FHEM gemischt habe. Nun interessiere ich mich für das FTUI, habe dazu aber noch folgende Frage:
Kann man auch die Anzeige bzw. die Größe eines Widgets durch ein FHEM-Event steuern?
Konkret geht es mir darum, dass ich bei einem ankommenden Anruf gerne fast alle Widgets ausblenden möchte und nur ein großes Widget mit den Daten von dem ankommenden Anruf anzeigen lassen möchte, damit man es vernünftig sieht. Gibt es diese Möglichkeit?
Gruß
Torben
du kannst beim popup-widget das event einstellen was es aufpoppen lässt
ZitatPopup widgets
data-get : name of the reading where to get the alert value from (default 'STATE')
data-get-on : value which trigger to open the dialog (default 'on')
data-get-off : value which trigger to close the dialog (default 'off')
data-width : fixe size for width (in % or px)
data-height : fixe size for height (in % or px)
evtl ist das die lösung. ein popup über ca 90% des bildschirmes
Zitat von: eki am 01 August 2015, 11:36:19
Hallo zusammen,
ich bin seit kurzem dabei das Tablet UI zu nutzen und bin sehr begeistert.
Allerdings habe ich ein bisschen Performance Probleme. Der Seitenaufbau mit meinem Raspberry Pi B+ dauert doch eine ganze Weile.
Deshalb habe ich mir die fhem-tablet-ui.js mal angeschaut, und mich mit meinen bescheidenen js und HTML Kenntnissen ein Bisschen an einer Optimierung zu versuchen.
Herausgekommen ist eine Version, die "jsonlist2" statt "list" verwendet und mit einigen anderen kleinen Anpassungen mit nur sehr wenigen GET Aufrufen an den Server auskommt. Das hat bei mir zu ganz guten Verbesserungen in der Performance geführt.
Daher möchte ich diese Version mal hier einkippen. Ich hoffe, ich habe durch meine Änderungen keinen Seiteneffekte eingebaut, bei mir hat sich bisher nichts Nachteiliges gezeigt, aber man weiß ja nie.
@setstate: Vielleicht hast Du ja Zeit und Lust Dir das mal anzuschauen und zu entscheiden, ob Du es eventuell weite verwenden möchtest (Du siehst ich bin im Konjunktiv geblieben, weil ich eigentlich nicht sogern im Code anderer Leute herummache (ich habe daher auch nur auskommentiert und hinzugefügt, aber nichts gelöscht), aber, wie gesagt, ich hatte einen gewissen Leidensdruck).
Hallo Eki,
vielen Dank für dein Bemühungen, aber jsonlist2 war für mich von Anfang an kein Thema, weil es bei mir ein Vielfaches der Zeit benötigt für ein normales Update. Auch deine Version (man muss ftuiLog.log(...) auskommentieren, damit es läuft), läuft viel langsamer bei mir, als meine jetzige Version mit 'list'
Kann auch am Server liegen, wie schnell das JSON Perl Modul arbeitet, bei mir ist es definitiv viel zu langsam.
Zitat von: chris1284 am 01 August 2015, 18:29:43
du kannst beim popup-widget das event einstellen was es aufpoppen lässtevtl ist das die lösung. ein popup über ca 90% des bildschirmes
Danke für den Tipp, chris. In der Antwort 2057 (http://forum.fhem.de/index.php/topic,34233.msg307697.html#msg307697) in diesem Thread steht es auch explizit. Ich habe irgendwie nicht an popup-widget gedacht.
Hallo setstate,
OK, ich denke dass es da viele Faktoren gibt, die bestimmen welche Variante schneller ist. Ich habe relativ viele Readings auf einer Seite und da entstehen recht viele GET Aufrufe, die das Ganze bei mir wohl langsam machen.
Koenntest Du Dir vorstellen, die beiden Varianten parallel einzubauen, um über einen Steuerparameter hin und her schalten zu können. Das wuerde mir zumindest das Leben leichter machen.
Hallo,
ich möchte bei einem label-widget, das von Calview gespeist wird, die Sekunden der Uhrzeit nicht anzeigen und versuche sie daher über data-substitution zu löschen, was mir aber nicht gelingt. Es wird immer die volle Uhrzeit mit Sekunden angezeigt. Das Ersetzen funktioniert auch bei anderen labels mit Text nicht. Kann mir jemand sagen, woran es liegt?
<div type="label" device="myCalView" data-get="t_001_btime" data-substitution="s/0:00/0/g"></div>
Vielen Dank
Torben
Zitat von: eki am 01 August 2015, 23:53:07
OK, ich denke dass es da viele Faktoren gibt, die bestimmen welche Variante schneller ist. Ich habe relativ viele Readings auf einer Seite und da entstehen recht viele GET Aufrufe, die das Ganze bei mir wohl langsam machen.
Ich habe die Version von eki auch mal getestet und würde subjektiv den Eindruck bestätigen, dass sich Seiten mit vielen Readings schneller aufbauen. Ich habe eine Seite mit vielen Wetterdetails, wo das meiner Meinung nach spürbar war. Allerdings hat diese Version keine Bilder aus Imagesets angezeigt, was den Aufbau vielleicht auch beschleunigt hat. ;)
Ein paar andere Dinge haben auch nicht funktioniert, wobei mein Versionsstand eventuell nicht ganz up2date ist, deshalb will ich mich nicht beschweren.
Ich werde jetzt erstmal ein Hardware-Upgrade vornehmen (Raspberry Pi B -> Raspberry Pi 2) und schauen, wie sich das (hoffentlich) auch auf Tablet UI auswirkt. Mal sehen, ob das Thema Optimierung dann nochmal auf den Tisch muss.
Hallo,
vom Tablet UI bin ich richtig begeistert. Danke für diese tolle Entwicklung. Das macht richtig Spass.
Beim Versuch, möglichst wenig Platz auf dem Tablet zu verschwenden, bin ich dann bei webViewControl gelandet. Auch ein klasse Produkt. Leider hakt die Zusammenarbeit wohl sehr. Obwohl ich in der index.html die entsprechenden Zeilen auskommentiert und auch die Pfade angepasst habe, funktioniert das nicht richtig. Wechsele ich auf die normale Fhem-Seite, geht es. Es, das sind: Spracherkennung, ttSay und Helligkeitssteuerung.
Was mache ich da falsch? Muss da noch irgendwo ein "Häkchen" ran?
Hat das jemand zum Laufen bekommen? Weder hier noch beim Freund google bin ich fündig geworden.
Nochmal Danke an Entwickler und Forum.
Gruß
Frank
Zitat von: fstefan1960 am 03 August 2015, 15:13:24
Hallo,
vom Tablet UI bin ich richtig begeistert. Danke für diese tolle Entwicklung. Das macht richtig Spass.
Beim Versuch, möglichst wenig Platz auf dem Tablet zu verschwenden, bin ich dann bei webViewControl gelandet. Auch ein klasse Produkt. Leider hakt die Zusammenarbeit wohl sehr. Obwohl ich in der index.html die entsprechenden Zeilen auskommentiert und auch die Pfade angepasst habe, funktioniert das nicht richtig. Wechsele ich auf die normale Fhem-Seite, geht es. Es, das sind: Spracherkennung, ttSay und Helligkeitssteuerung.
Was mache ich da falsch? Muss da noch irgendwo ein "Häkchen" ran?
Hat das jemand zum Laufen bekommen? Weder hier noch beim Freund google bin ich fündig geworden.
Nochmal Danke an Entwickler und Forum.
Gruß
Frank
Ändere bitte "js" in "pgm2" in den WVC Zeilen, scheint falsch zu sein.
<script type="text/javascript" src="/fhem/pgm2/webviewcontrol.js"></script>
Deine ID für WVC passt auch?
Neuste Tablet-UI.js Files? Dort habe ich die Wartezeit beim Start von Longpoll hochgesetzt. WVC läuft damit besser.
Vielen Dank für die schnelle Antwort.
1. Ja, die Pfade hatte ich geändert.
2. Ja, hab EINE ID mit Tabletnamen eingetragen. Wie mach ich das mit Tablet 2 und 3?
3. Hab immer wieder das update durchgeführt und auch neu gestartet.
Leider hakt es eben immer noch ... :(
Hey setstate,
AWESOME liegt in einer neuen Version vor! Sind die schon in der aktuellen UI integriert oder folgt das entspr. update hierzu in kürze?
Gruß Björn
Hallo Björn,
vielen Dank, super Tipp.
Es sind 66 neue Icons dabei, auch einige interessante für die Homeautomation, z.B. Battery (versch. Ladestände), TV, Calendar.
Läuft schon bei mir ... Update gibt es gleich
Icon update auch gesehen
Gesendet von meinem Z30 mit Tapatalk
Zitat von: Torben am 02 August 2015, 21:05:54
Hallo,
ich möchte bei einem label-widget, das von Calview gespeist wird, die Sekunden der Uhrzeit nicht anzeigen und versuche sie daher über data-substitution zu löschen, was mir aber nicht gelingt. Es wird immer die volle Uhrzeit mit Sekunden angezeigt. Das Ersetzen funktioniert auch bei anderen labels mit Text nicht. Kann mir jemand sagen, woran es liegt?
<div type="label" device="myCalView" data-get="t_001_btime" data-substitution="s/0:00/0/g"></div>
Vielen Dank
Torben
Ich würde es mit data-part probieren:
data-part=".*(\d\d:\d\d):\d\d.*"
Super, vielen Dank. Das funktioniert.
Gibt es mit dem data-substitution grundsätzlich ein Problem oder stelle ich mich nur ungeschickt an? Ich bekomme es in anderen Fällen nämlich auch nicht hin und es kann schon mal ganz nützlich sein.
Gruß
Torben
Danke @setstate für das Update mit den neuen Icons! Leider habe ich mit der neuen Version das Problem, dass mein Browser sich beschwert, dass im css ein ungültige Version vom Font angegeben ist. Entferne ich den "v=4.4.0"-Anhang der Fontface-Definition aus dem CSS, funktioniert alles sauber.
Grüße
Max
Zitat von: Torben am 03 August 2015, 22:56:40
Super, vielen Dank. Das funktioniert.
Gibt es mit dem data-substitution grundsätzlich ein Problem oder stelle ich mich nur ungeschickt an? Ich bekomme es in anderen Fällen nämlich auch nicht hin und es kann schon mal ganz nützlich sein.
Gruß
Torben
Doch, data-substituton funktioniert. Hier einige Beispiele:
Zeilenumbruch, wo -BR- steht
data-substitution="s/-BR-/<br>/g"
Punkt durch Komma ersetzten
data-substitution="s/\./,/g"
Dein 0:00 ist kein Bezeichner für alle Zahlen, sondern nur für die nullte Minute (bzw. Sekunde). Das müsste schon so aussehen:
data-substitution="s/:\d\d//g"
Dann löschst du aber Minuten und Sekunden weg, weil beide Doppelpunkt dazwischen haben
Zitat von: Maahaax am 03 August 2015, 23:08:17
Danke @setstate für das Update mit den neuen Icons! Leider habe ich mit der neuen Version das Problem, dass mein Browser sich beschwert, dass im css ein ungültige Version vom Font angegeben ist. Entferne ich den "v=4.4.0"-Anhang der Fontface-Definition aus dem CSS, funktioniert alles sauber.
Grüße
Max
Genau das musste ich auch bei der alten 4.3 Version auch machen. Diesmal klappte es auch ohne. Warum, kann ich nicht sagen. Evtl. ist die HTTPSRV Definition entscheidend und damit die Frage, wer das File anbietet, FHEMWEB oder HTTPSRV.
Ich habe aber jetzt auch die "v=4.4.0"-Anhänge alle gelöscht, damit es bei allen klappt.
Danke, gerade aktualisiert und läuft auf Anhieb!
Ich habe da mal eine (dumme) Frage ...
ich würde meine Temperaturanzeige mit etlichen simplecharts gerne per Knopfdruck zwischen Sommer und Winterbetrieb (oder evt. auch weiteren Stufen) umschalten ... OK, das ginge auch mit verschiedenen Indexfiles die dann mit pagetab umgeschaltet werden ... ich würde aber lieber die min und max-werte der simplecharts anpassen, aber wie kriegt man das hin?
Zum Kommunizieren der Controls untereinander, werde ich mir was einfallen lassen.
Damit könnte man die Min, Max Werte live ändern, einen Button zum Schließen eines PopUp Fensters hinzufügen oder Plus/Minus Buttons (Spinner) kreieren.
Hast du ein Update des FTUI gemacht? Die neuen FA Fonts sind schon eingebunden ...
Guten Morgen,
den im Nebenthread angesprochenen Effekt, dass sich ein Bild nicht aktualisiert, kann ich bestätigen. Weder ein data-refresh in der widget-definition noch ein <meta http-equiv="refresh" content="45" > im Seiten-head helfen dagegen.
Ein manuelles Neuladen der Seite über F5 hingegen wirkt.
Stream einbinden hilft mir nicht, da ich immer das letzte Bild sehen möchte, das der motion-Detector aufgenommen hat.
nach längerem beobachten und testen auf 1 pc und 2 tablets mus sich auch sagen das die refresh funktion des image-widget nicht funktioniert
ich habe 3 bilder mit refresh + ein mjpeg stream als bild (ohne refresh) auf einer site. die dann auch nochmla per <meta http-equiv="refresh" content="45" > workaround zu refreshen fänd ich doof
Fügt dem Image Widget mal ein data-nocache="true" hinzu. Ist so aktuell mit drin. Gefällt mir aber noch nicht richtig, deshalb ist es nicht in der Doku zu finden. Ich werde das noch auf class="nocache" umbauen.
Super,
klappt jetzt.
dito, klappt
Zitat von: setstate am 05 August 2015, 09:12:02
Hast du ein Update des FTUI gemacht? Die neuen FA Fonts sind schon eingebunden ...
Ich glaube die Antwort bezog sich auf meine Frage, die ich kurz nach dem Einstellen wieder gelöscht habe. Hatte tatsächlich noch kein update gemacht. Jetzt kann ich auch auf alle neuen Icons zugreifen. Alles fein und Dank noch mal für die schnelle Antwort :)
@setstate, nesges und andere widget-entwickler:
könnt ihr euch folgendes widget bitte einmal ansehen? wei kommt es das bei anderen tabletui usern teils keine werte angezeigt werden / die readings nicht geholt werden obwohl vorhanden.
das widget soll für gds warnungen sein. die readings die abgefragt werden sind wärend der initialisierung des widget nicht immer vorhanden, werden aber dennoch im widget mit initialsiert
-> a_0_headline, a_1_headline, a_xxx_headline für die angegebene / default max
beim update wird dann je nach dem ob beim abfragen des readigs ein wert kommt ein deafault text oder der wert ausgegeben.
bei den meisten die rückmeldung gaben kam immer der default wert -> "Aktuell keine Wetterwarnungen des DWD"
ich bin mit meinen versuchen am ende und benötige ein wenig hilfe um evtl den (denk-)fehler zu finden
Danke vorab
Ich habe kein GDS und die nötigen Perl Module kennt mein ipkg Repository auch nicht. Da muss jemand anderes helfen ...
die module sind "eigentlich uninteressant" und perl in dem fall auch, meine ich. es sind normale readings die über die ui abgefragt werden (nur das die manchmal vorhanden sind, manchmal nicht)
wäre toll wenn du rein vom javascript code mal schauen könntest ob du da was siehst
Und wie sind die dann nicht da?
So :
a_1_headline
a_6_headline
a_7_headline
oder immer so
a_1_headline
a_2_headline
a_3_headline
die readings a_..._headline gibt es nur wenn eine alarmmeldung des dwd vorhanden ist. ansonsten gibt es keine readings a_.*
das dwd holt sich zyklisch die daten und schreibt dann die readings, alte werden vorher gelöscht und nicht erstezt wenn es kein daten gibt.
als beispiel an einem temp-sensor: wenn der sich meldet und die temp sendet gibt ein reading temp, sender er später zb nur humidity werden alle reading gelöscht und nur humidity geschrieben
temp gibts dann nicht mehr bis der sensor es wieder sendet
Hallo chris1284,
vielleicht so, aber nur an meinem dummy Device getestet ...
werd ich testen. was ist / wofür ist die variable par genau?
Zitat von: chris1284 am 07 August 2015, 07:00:26
werd ich testen. was ist / wofür ist die variable par genau?
dev Device
par Parameter
für den das Update reinkommt. Entweder explizit beim Start einmal und dann immer gemäß shortpoll Intervall (aller 30 Sekunden wenn longpoll=0, oder aller 15 Minuten bei Longpoll=1)
Oder wenn fhem ein Update des Parameters (im FHEM Sprech: Reading) meldet. Das passiert, wenn longpoll=1 gesetzt ist.
Was mir noch aufgefallen ist: data-get benennt das Haupt-Reading für das Widget. Im FHEM sollte dafür ein Wert abrufbar sein. data-get ist kein statischer Wert für eine Modusteuerung des Widgets. Dafür könnte man eine CSS Class angeben, die die Funktionsweise des Widgets beeinflusst.
Bevor ich sinnlos selbst was bastele frage ich lieber mal nach:
Gibt es oder hat jemand für das label-Widget schon eine Möglichkeit, die Länge des ausgegebenen Textes auf die ersten x Zeichen zu begrenzen, evtl. mit data-substitution und einer Regex?
Wenn die Wettervorhersage anstelle von "Heiter" oder "Wolkig" auf einmal "unterschiedlich bewoelkt, vereinzelt Schauer und Gewitter" meldet, zerschiesst einem das jedes Layout... ;)
Edit
War doch gar nicht so schwer. Folgende Regex schneidet nach 15 Zeichen ab und ergänzt "...":
data-substitution="s/^(.{15}).+/$1.../"
Hallo zusammen,
wollte gerade auf meine FTUI auf apache umstellen, leider kommen keine Daten.
Die Oberfläche wird sauber geladen, Verzeichnisse sind gelinkt und JavaScript console zeigt kein Fehler.
Auf einem anderen raspi hatte ich schon vor Wochen umgestellt, da ging es sofort.
Cors=1 ist gesetzt
<meta name="fhemweb_url" content="http://172.27.254.80:8088/webhook"> ist gesetzt
Hat jemand noch eine Idee ?
Danke
Hi Johannes
Thank you very much for this. Sorry i haven't been able to try this out before now. It works great. Following on from this i've been trying to incorporate a js slider to control the volume of playstream (similar to one i'd seen here http://codepen.io/planetoftheweb/pen/HCLzc ) then was even hoping to control the volume with a fhem command (to wake up gradually), then my alarm clock would be complete! Unfortunately i'm a complete novice at javascript so haven't had much luck yet. Thanks again for the hack though.
edit : a more simple hack would be to change playstream so it plays at a volume set by a dummy. Then control the volume using a 'volume slider' for that dummy.
Craig
Zitat von: viegener am 01 Juli 2015, 18:23:56
Craig,
attached you find a quick hack, that you might try for do playstream as an "alarm function".
I extended playstream to be able to also react on device changes. You can specify data-device and other options (data-get / data-get-on / data-get-off ) for playing a stream and pausing a stream based on device changes.
Disclaimer: This works on my machine after a quick test
Restrictions: It does not stop other streams (as it is done in normal behavior for playstream if you manually activate it)
Johannes
@setstate: Moechtest Du, dass ich die Änderungen einchecke und über github bereitstelle?
Hallo,
diese Information stelle ich einfach mal in den Raum. Bei dem Attribut data-device bei den mir bekannten Quellen (wiki, etc) von einem device geschrieben.
Eben habe ich festgestellt, dass eine mit Komma getrennte Liste mit mehreren devices auch funktioniert. Find ich gut, da es mir die Definition von structures erspart.
ciao walter
Zitat von: wkarl am 08 August 2015, 09:30:50
Eben habe ich festgestellt, dass eine mit Komma getrennte Liste mit mehreren devices auch funktioniert. Find ich gut, da es mir die Definition von structures erspart.
Coole Sache das ! Danke für den Tipp.
Aber nur beim Set, oder? Holen von Zuständen, wie verhält sich das? Bei einem Switch zum Beispiel ...
Getestet und umgesetzt habe ich es für den data-type switch.
Eben mit get getestet, keiner der Werte angzeigt.
ciao walter
Hi,
ich bastele mir gerade mein Frontend zusammen, mit dem ich unter anderem auch meine SONOS-Player steuern möchte. Es gibt eine Möglichkeit im Sonos-Modul, die Radiofavoriten zu starten - damit das aber funktioniert, muss der Name des Senders URL-codiert übergeben werden. Das sieht bei mir jetzt folgendermaßen aus:
<div data-type="select" data-device="Sonos_Wohnzimmer" data-set="StartRadio" data-items='["1LIVE%20-%20Das%20junge%20Radio%20des%20WDR.","AFN%20Stuttgart","BBC%20Radio%201","DASDING%2090.8%20(Euro-Hits)","DRadio%20Wissen","Klassik%20Movie","RADIO%20BOB!","Radio%20Fips","SKY.FM%20Vocal%20Smooth%20Jazz","SWR1%20Baden-W%C3%BCrttemberg","SWR3%20Elchradio%2097.5%20(Pop)","SWRinfo%20-%20Wir%20haben%20die%20News.%20Jetzt!%2091.5%20(Nationale%20Nachrichten)","Sport1.fm"]'></div>
Technisch funktioniert es perfekt - es sieht halt nur doof aus. Gibt es eine Möglichkeit, im Frontend das Select mit den korrekten, uncodierten Namen der Sender anzuzeigen und trotzdem etwas anderes zu senden?
Zitat von: Schiri1986 am 09 August 2015, 13:12:19
Hi,
ich bastele mir gerade mein Frontend zusammen, mit dem ich unter anderem auch meine SONOS-Player steuern möchte. Es gibt eine Möglichkeit im Sonos-Modul, die Radiofavoriten zu starten - damit das aber funktioniert, muss der Name des Senders URL-codiert übergeben werden. Das sieht bei mir jetzt folgendermaßen aus:
<div data-type="select" data-device="Sonos_Wohnzimmer" data-set="StartRadio" data-items='["1LIVE%20-%20Das%20junge%20Radio%20des%20WDR.","AFN%20Stuttgart","BBC%20Radio%201","DASDING%2090.8%20(Euro-Hits)","DRadio%20Wissen","Klassik%20Movie","RADIO%20BOB!","Radio%20Fips","SKY.FM%20Vocal%20Smooth%20Jazz","SWR1%20Baden-W%C3%BCrttemberg","SWR3%20Elchradio%2097.5%20(Pop)","SWRinfo%20-%20Wir%20haben%20die%20News.%20Jetzt!%2091.5%20(Nationale%20Nachrichten)","Sport1.fm"]'></div>
Technisch funktioniert es perfekt - es sieht halt nur doof aus. Gibt es eine Möglichkeit, im Frontend das Select mit den korrekten, uncodierten Namen der Sender anzuzeigen und trotzdem etwas anderes zu senden?
Mit
data-alias kann man Schön-Namen vergeben. Einfach wie bei
data-items als Array angeben.
kann man verhindern dass das circle-menue sich nach druck eines der buttons schließt?
ich hätte es gern das es sich nur beim drücken des buttons das es öffnet wieder zugeht (also in der mitte der)
Das Circle-Menu bleibt mit class="keepopen" auf
Mal eine generelle Frage:
mit welchen Tools erstellt ihr denn so die UI Seiten?
Würde mir eins mit Direktvorschau wünschen..
Kann es sein das im dimmer-widget ein bug ist? data-set-on wird nicht übernommen.
<div data-type="dimmer" data-device="az_light_ledschlauch" data-get="dim" data-set-on="on" class="cell" ></div>
das sollte doch bewirken das bei klicj auf den button des dimmers "on" gesendet wird?! Er sendet trotzdem immer set az_light_ledschlauch [letzterdim wert] zb set az_light_ledschlauch 100
Hi,
Would it be an easy mod to change the playstream to play at a volume (and respond to volume changes) set in the data-device state instead of just on/off value? The radio/alarm volume then can be set using a dummy & volume slider. I've been trying this myself but i'm not very good at javascript and i'm hoping it's quite an easy mod for someone who knows what they're doing!
Regards
Craig
Hallo
Nutze die FTUI nun seit einiger Zeit und bin begeistert.
Was mir vielleicht noch fehlen würde wäre zumindestens die Dateien für kleinigkeiten direkt bearbeiten oder erstellen zu können
da ich manche Sachen erstmal auf einem Testsystem erstelle und dann in das laufende FHEM einspele (dazu dann immer SCP nutze).
Dieses ist jedoch Zeitweise etwas schwierig/umständlich da ich dieses auch aus der Ferne mache......
Ist nur ein Gedanke.......
stenny
was stelltst du dir unter "direkt bearbeiten oder erstellen " einen in deiner ftui integrierten editor für die html-files oder wie?
du kansnt auch einfach den tui-ordner freigeben / per ftp bereit stellen / eine friegabe auf dem testsytsem mit dem tablet-ordner des servers synchronisieren.. oder einfach wie bisher winscp-> auf server verbinden -> datei direkt bearbeiten ohne erst zu kopieren
Zitat von: chris1284 am 11 August 2015, 12:43:07
was stelltst du dir unter "direkt bearbeiten oder erstellen " einen in deiner ftui integrierten editor für die html-files oder wie?
du kansnt auch einfach den tui-ordner freigeben / per ftp bereit stellen / eine friegabe auf dem testsytsem mit dem tablet-ordner des servers synchronisieren.. oder einfach wie bisher winscp-> auf server verbinden -> datei direkt bearbeiten ohne erst zu kopieren
Das mit dem Freigeben funktioniert gut, allerdings wünsche ich mir auch manchmal einen Wysiwyg-Editor, denn das Umordnen von Widgets / Bereichen mit Abzählen von X und Y positionen oder das Ausprobieren von css-Auszeichnungen um noch zwei Elemente nebeneinander zu bekommen ist schon aufwändig und altmodisch.
Insofern wäre ein Text-editor im Browser für mich persönlich nur 2. Wahl, es könnte aber ein Zwischenschritt sein, denn es stellt zumindest mal das Hochladen aus dem Browser bereit. Ein nächster Schritt könnte sein, einzelne Elemente im Browser direkt veränderbar zu machen (Also visuell durch verschieben / Auswählen / Kopieren / etc). Prinzipiell wäre das denkbar, es ist aber ein Haufen Arbeit und mir fehlt die Zeit. Vielleicht sollte man sich zusammentun?
das geht in richtung floorplan / dashboard. dort kann man elemente auch verschieben und die zb positionen werden gemerkt / in die konfig geschrieben. beim floorplan kann man elemente mit vorgegebenen "attributen" konfigurieren wenn der "editor"mode aktiv ist. das basiert meine ich auch alles auf javascript.
wenn man so zb an einem button den man eingefügt hat die optionen device,icon,on,off usw editieren könnte wäre das sicher in bestimmten fällen einfacher
Uppssssss.....
Das war ja nur ein geddanke. Hoffe habe jetzt nichts losgetretten......
Das bearbeiten über die EDIT Funktion wäre schon ein anfang.......
Ich hatte mir einfach ein Samba Share auf dem PI eingerichtet was auf das Verzeichnis mit den HTML Files zeigt. So editiere ich mit den gewohnten Tools und speichere bequem :)
Hallo,
ich bekomme das javascript-widget nicht zum laufen. Ich möchte zunächst ein einfaches:
function activeCall() {
console.log(gridster.serialize());
}
zum laufen bekommen und habe es FHEM-seitig sowohl mit
<div data-type="javascript" data-device="JS" data-get="state"></div> als auch mit
<div data-type="javascript" data-device="JS" data-get="code"></div> und dem einem entsprechenden dummy JS mit und ohne userReading (code) ausprobiert.
In der Konsole bekomme ich auch ein
Zitatupdate done for device:JS parameter:code
angezeigt, die activeCall()-Funktion wird aber nicht aufgerufen. Kann mir hier jemand weiterhelfen?
Danke
Torben
Hallo
Ich habe etwas herumgestöbert, leider konnte ich keine Antwort auf meinem Problem finden (ich hoffe ich habe keinen Beitrag übersehen). Ich verwende Tablet UI. Mir ist gestern aufgefallen das z.B die Schalter sich in dem Fullscreen IE-Browswer von einem WindowsRT nicht schalten lassen (wird kurz als off oder on angezeigt dann springt es wieder zurück in dem vorherigen zustand) jedoch sehr wohl über den IE wenn Mann es direkt über den Desktop startet (nicht Full Screen). Hat jemand eine Idee? :-\
Zitat von: cmillsy am 10 August 2015, 15:05:38
Hi,
Would it be an easy mod to change the playstream to play at a volume (and respond to volume changes) set in the data-device state instead of just on/off value? The radio/alarm volume then can be set using a dummy & volume slider. I've been trying this myself but i'm not very good at javascript and i'm hoping it's quite an easy mod for someone who knows what they're doing!
Regards
Craig
Hi Craig,
the volume control is added to the playstream widget now.
You can use it like this:
<div data-type="playstream" data-url="http://radioeins.de/stream"
data-device="dummy1"
data-get-on="play" data-get-off="stop"
data-volume="volume">
</div>data-volume refers to a FHEM reading which holds the volume value (numeric 0-100)
Regards
Mario
Zitat von: Torben am 11 August 2015, 23:18:00
Hallo,
ich bekomme das javascript-widget nicht zum laufen. Ich möchte zunächst ein einfaches:
function activeCall() {
console.log(gridster.serialize());
}
zum laufen bekommen und habe es FHEM-seitig sowohl mit
<div data-type="javascript" data-device="JS" data-get="state"></div> als auch mit <div data-type="javascript" data-device="JS" data-get="code"></div> und dem einem entsprechenden dummy JS mit und ohne userReading (code) ausprobiert.
In der Konsole bekomme ich auch ein angezeigt, die activeCall()-Funktion wird aber nicht aufgerufen. Kann mir hier jemand weiterhelfen?
Danke
Torben
Es ist noch ein Fehler im javascript Widget, der sich bei der Umbenamsung eingeschlichen hat.
Es muss
widgetname : 'javascript',heißen, und nicht
widgetname : 'reload',
Aufruf dann so:
Zitatset JS activeCall()
Ich bilde mir ein es hat was gegeben, damit man nach Zeit wieder auf die Hauptseite springt,
finde aber keine Threads mehr dazu.
Geht das irgendwie ?
LG
Zitat von: setstate am 12 August 2015, 10:01:25
Es ist noch ein Fehler im javascript Widget, der sich bei der Umbenamsung eingeschlichen hat.
Es muss
widgetname : 'javascript',
heißen, und nicht
widgetname : 'reload',
Aufruf dann so:
Zitatset JS activeCall()
Danke setstate. So läuft es. Ich hatte zwar auch in das Widget geschaut, aber der Name war mir gar nicht aufgefallen.
Nun habe ich leider den nächsten Punkt. Wenn ich mit diesem javascript dynamisch ein Widget einfüge (hier zum Test nur mal die Uhrzeit)
function missedCall() {
$(".gridster ul").gridster().data('gridster').add_widget('<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" id="timeDate"><div data-type="clock" class="container big left" data-format="H:i"></div></li>', 1, 1,1,1);
}
erscheint das leere Gridster-Widget, es übernimmt aber keine Daten vom Tablet UI/FHEM, obwohl in den HTML-Element-Informationen der Code richtig übernommen wird. Er ist identisch zu dem, wenn ich das Widget direkt in der index.html habe.
Muss man dabei noch etwas besonderes beachten?
Zitat von: Torben am 12 August 2015, 21:11:52
Nun habe ich leider den nächsten Punkt. Wenn ich mit diesem javascript dynamisch ein Widget einfüge (hier zum Test nur mal die Uhrzeit)
erscheint das leere Gridster-Widget, es übernimmt aber keine Daten vom Tablet UI/FHEM, obwohl in den HTML-Element-Informationen der Code richtig übernommen wird. Er ist identisch zu dem, wenn ich das Widget direkt in der index.html habe.
Muss man dabei noch etwas besonderes beachten?
Vielleicht wird das dynamisch hinzugefügte Widget nicht von initWidgets miterfasst und muss individuell angetriggert werden.
Nur so ne Idee.
Ein dynamisches Nachladen eines Widgets ist nicht richtig vorgesehen und umsetzbar. Man muss auf jeden Fall ein init und dann ein update des Widgets triggern. Das geht aber nicht pro Widget, sondern pro Widget Typ (each Schleife). Man würde also immer alle vom gleichen Typ neu initiieren und alle updaten. Das bringt Probleme mit ...
Ich würde eher alle Widgets statisch lassen und nur mit hide() und show() arbeiten.
Vielen Dank für den Hinweis. Wenn man das hide() und show() in Verbindung mit mutate_widget_in_gridmap nutzt, kann man versteckte widgets außerhalb des scrollbaren Bereichs schieben und wieder zurückholen. Damit kann man das Frontend quasi dynamisch aufbauen, sofern alle widgets beim Start geladen werden.
Anbei der Code für das Verstecken in der 5. Reihe, die sonst bei mir leer ist:
index.html
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1" data-close="2" class="anruf-widget" id="anrufe">
fhem-tablet-ui-user.js
function verstecken() {
$("#anrufe").hide();
$(".gridster ul").data('gridster').mutate_widget_in_gridmap($("#anrufe"), { col: 2, row: 1, size_x: 1, size_y: 1 }, { col: 2, row: 5, size_x: 1, size_y: 1 }); // Widget von Reihe 1 nach Reihe 5 schieben
$(".gridster ul").data('gridster').resize_widget($("#timeDate"),2,1); // Hier wird ein anderes Widget vergrößert, damit keine leere Stelle bleibt
}
und das Zurückholen
function zuruckholen() {
$(".gridster ul").data('gridster').resize_widget($("#timeDate"),1,1); //vorher vergrößertes Widget wieder verkleinern, um Platz zu machen
$("#anrufe").show();
$(".gridster ul").data('gridster').mutate_widget_in_gridmap($("#anrufe"), { col: 2, row: 5, size_x: 1, size_y: 1 }, { col: 2, row: 1, size_x: 1, size_y: 1 }); // Widget von Reihe 5 wieder in Reihe 1 holen
}
Das geht sicherlich noch schöner, funktioniert aber schon mal so weit.
Zitat von: chris1284 am 10 August 2015, 13:47:13
Kann es sein das im dimmer-widget ein bug ist? data-set-on wird nicht übernommen.
<div data-type="dimmer" data-device="az_light_ledschlauch" data-get="dim" data-set-on="on" class="cell" ></div>
das sollte doch bewirken das bei klicj auf den button des dimmers "on" gesendet wird?! Er sendet trotzdem immer set az_light_ledschlauch [letzterdim wert] zb set az_light_ledschlauch 100
hi setstate, kannst du zu dem punkten noch etwas sagen? aktuell fahre ich als workaround noch 2 statt nur einem button/wirget
Das dimmer Widget ist per Default im Dim Mode. Nur wenn sich data-dim und data-set unterscheiden, wird explizit data-set-on benutzt. Siehe Beispiel in der Readme.
Zitat von: Nobby1805 am 04 August 2015, 09:38:26
Ich habe da mal eine (dumme) Frage ...
ich würde meine Temperaturanzeige mit etlichen simplecharts gerne per Knopfdruck zwischen Sommer und Winterbetrieb (oder evt. auch weiteren Stufen) umschalten ... OK, das ginge auch mit verschiedenen Indexfiles die dann mit pagetab umgeschaltet werden ... ich würde aber lieber die min und max-werte der simplecharts anpassen, aber wie kriegt man das hin?
Beim
Simplechart Widget kann man jetzt für
data-minvalue und
data-minvalue auch Arrays angeben, um die Min und Maxwerte automatisch in Stufen dynamisch anzupassen.
data-minvalue="[10,-25]"
data-maxvalue="[15,35]"
So könnte eine Sommer/Winter Umschaltung aussehen. Wenn ein Wert im Graph größer als der erste Max-Wert ist, wird im Array der nächst höhere Max-Wert probiert, bis der Graph-Wert wieder innerhalb von Max liegt.
Bei minvalue ebenso, aber in die andere Richtung.
data-maxvalue aufsteigend angeben, data-minvalue absteigend
Hmmm ... das klingt schon recht gut ... Danke soweit , ich probiere das mal aus
Aber wenn es jetzt noch die Möglichkeit gäbe statt einer Automatik den verwendeten Wert, bzw. das verwendete Min/Max-Paar, von einen Reading/einem Steuerwert abhängig zu machen
Edit: Begründung: ich hätte gerne bei nebeneinander stehenden Grafiken die selbe Skalierung
PS und natürlich passe ich die Doku im Wiki zeitnah an ;)
schön, schön. bin begeistert. Würde gerne zwei layouts basteln: einmal für Zugriff über Mobile und einmal über tablet. Gibt es eine "Weiche" die man nutzen kann? Im Moment (zum probieren) muß ich immer meine index.html anders befüllen. Im Wiki nichts darüber gefunden.
liebe Grüße
H.
bau 2 httpsrv in fhem. der erste ist ja wahrscheinlich
ftui/ ./www/tablet Tablet-UI
bau einfach nen 2.
legt einen neuen ordner unter /opt/fhem/www an, zb TUIMobil. Pacl da einfach alle files rein und definiere einen weiteren httpsrv
define TUIMobil HTTPSRV ftuimobil/ ./www/TUIMobil TUIMobil
was passiert denn jetzt ?
Merci Chris. Funktioniert!
...
Zitat von: Nobby1805 am 13 August 2015, 17:49:30
was passiert denn jetzt ?
Sorry, hatte die Schleifenvariable 'i' zweimal vergeben. Ist jetzt wieder okay ...
Ja, wieder OK .. Danke
Hat einer von euch unterschiedliche Tablets etc. im Einsatz? Baut ihr dann mehrere UIs angepasst für die jeweiligen Geräte?
Hallo Arallon, schau mal 6 Antworten http://forum.fhem.de/index.php/topic,34233.msg322218.html#msg322218 (http://forum.fhem.de/index.php/topic,34233.msg322218.html#msg322218) obendrüber der Beitrag von Chris. Nicht 100%tig galant, aber funktioniert wunderbar.
Pass aber mit den ganzen Verweisen im Head der html-Dateien auf beim Kopieren (falls du diese auch anpassen möchtest).
So stehts in meiner fhem.cfg für das Tablet und die Mobiles
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
define MOBILEUI HTTPSRV ftuimobile/ ./www/mobile Mobile-UI
Da ist man mal zu faul noch mal die letzten Seiten durchzugehen und dann sowas :)
Wäre auch so die Richtung gewesen zu der ich tendiert habe. Einzig das update all ist nicht mehr ganz so "stressfrei". Aber wenn man mal was hat muss man ja nicht ständig updaten.
Zitat von: holle75 am 13 August 2015, 21:00:12
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
define MOBILEUI HTTPSRV ftuimobile/ ./www/mobile Mobile-UI
Wo genau liegt der Vorteil darin, mehrere HTTPSRV-Instanzen anzulegen? Ich könntet doch einfach in einer Instanz mit verschiedenen Dateien arbeiten, also
fhem/tablet/tablet-ui.html
fhem/tablet/mobile-ui.html
Und dann am jeweiligen Gerät einfach die passende Datei aufrufen. Die speichert man doch ohnehin als Favorit oder Webapp oder wie auch immer ab.
Da ich hier selbst mal die Frage aufgeworfen hatte, wie sich der Umstieg von einem Raspberry Pi 1 B auf einen Raspberry Pi 2 B auf die Performance von TabletUI auswirkt, hier nun die Antwort:
Es gibt im Prinzip einen spürbaren Performance-Anstieg, ABER der wirkt sich nur aus, wenn der Server der limitierende Faktor ist bzw. war. Auf einem PC in Chrome beispielsweise, wo TabletUI vorher auch schon recht flott war, geht es nun sehr zackig. Bei einem Android-Tablet ebenfalls mit Chrome hingegen braucht eine komplexe Seite immer noch mehrere Sekunden für den Aufbau, weil hier wohl wie schon vermutet das Rendern im Browser der Flaschenhals ist.
Zitat von: Brockmann am 14 August 2015, 08:47:27
Wo genau liegt der Vorteil darin, mehrere HTTPSRV-Instanzen anzulegen? Ich könntet doch einfach in einer Instanz mit verschiedenen Dateien arbeiten, also
ganz einfach es ist für faule wie micht. ich müsste imme rum auf die mobile-seite (oder bei mir ein TUI-Floorplan und eine testinstanz) die gesamte url tippen da der server default nach index.html auflöst. es reicht also fhem/tablet/ oder fhem/test/ oder fhem/tabletfp aufzurufen (favoriten hin oder her)
auf einem apche würdest du in der regel auch für jede seite eine site bauen weil es einfach sauberer ist
des weiteren zerschieße ich mir nicht alles wenn ich in meiner testinstanz / der floorplaninstanz rum spiele.
Ich fahre den Ansatz von Nesges, welche die Seitenteile in einzelne PHP Files zerlegt hat. Diese lasse ich von einem Nginx rendern. Für Mobil habe ich mir einen weiteren Port abgelegt und verwende so die Widgets wieder - zeige aber einfach weniger pro Seite an. HTTPSRV Zeug hab ich gar nicht - war nach den ersten Gehversuchen von der dauernden Wiederholung von Seitenteilen in den html-files genervt und bin auf PHP umgestiegen.
Hallo zusammen,
erstmal vielen Dank für die tolle Arbeit an dem UI!
Absolut genial und sehr individuell anpassbar,
läuft bei mir nun seit mehreren Wochen stabil und zuverlässig und gestern habe ich auch m,eine USB-Wandsteckdose nebst Tablet an die Wand montiert,
so kann man es dann nochmal ein Stück mehr geniesen. Und der WAF ist nochmals gestiegen :D
Ich habe mir für Aussen nun eine Kamera geholt und diese montiert, nun ist das Bild aber um 90° gedreht aufgrund der ungünstigen Kameraausrichtung.
Wäre es denn denkbar, bei IMAGE noch ein HTML Attribut data-rotation mit einzubauen?
Also beispielsweise so:
<img src="http://IP/web/cgi-bin/snap.png" data-rotate="90"></img src>
Der JavaScript Code hierfür ware dann:
Sample jQuery:
$('img').each(function() {
var deg = $(this).data('rotate') || 0;
var rotate = 'rotate(' + $(this).data('rotate') + 'deg)';
$(this).css({
'-webkit-transform': rotate,
'-moz-transform': rotate,
'-o-transform': rotate,
'-ms-transform': rotate,
'transform': rotate
});
});
Was meint ihr dazu?
Viele Grüße,
Sven
Zitat von: swinni am 14 August 2015, 10:21:22
Hallo zusammen,
erstmal vielen Dank für die tolle Arbeit an dem UI!
Absolut genial und sehr individuell anpassbar,
läuft bei mir nun seit mehreren Wochen stabil und zuverlässig und gestern habe ich auch m,eine USB-Wandsteckdose nebst Tablet an die Wand montiert,
so kann man es dann nochmal ein Stück mehr geniesen. Und der WAF ist nochmals gestiegen :D
Ich habe mir für Aussen nun eine Kamera geholt und diese montiert, nun ist das Bild aber um 90° gedreht aufgrund der ungünstigen Kameraausrichtung.
Wäre es denn denkbar, bei IMAGE noch ein HTML Attribut data-rotation mit einzubauen?
Also beispielsweise so:
<img src="http://IP/web/cgi-bin/snap.png" data-rotate="90"></img src>
Der JavaScript Code hierfür ware dann:
Sample jQuery:
$('img').each(function() {
var deg = $(this).data('rotate') || 0;
var rotate = 'rotate(' + $(this).data('rotate') + 'deg)';
$(this).css({
'-webkit-transform': rotate,
'-moz-transform': rotate,
'-o-transform': rotate,
'-ms-transform': rotate,
'transform': rotate
});
});
Was meint ihr dazu?
Viele Grüße,
Sven
Hallo swinni,
vielen Dank für deinen Kommentar und Beitrag. Hört man immer wieder gern, dass FTUI genutzt wird und der WAF passt :-)
Aus Performancegründen würde ich das Rotieren aber lieber per statischem CSS machen wollen:
<div data-type="image"
data-url="http://lorempixel.com/400/200/"
class="rotate-90">
</div>
.rotate-90{
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
Wäre das auch okay, dann checke ich das so ein?
Hallo setstate,
aber natürlich! SEEEEHR gerne ;D
Hatte nur die JavaScript Variante als erste entdeckt bei meiner Recherche, direkt über CSS ist natürllich geschickter.
Vielen Dank !!!!
Grüße,
Sven
Hi,
bin mir nicht sicher ob ich mit meinem Problem hier richtig bin.
Ich habe gerade tablet_UI installiert.
Jetzt würde ich gerne die index.html mit meinem HTML Editor bearbeiten. Dazu habe ich mit meinem ftp Client eine SFTP Verbindung hergestellt und mich mit dem user pi angemeldet.
Wenn ich die Datei aber jetzt speichern will kommt PERMISSION DENIED.
Die Rechte sehen so aus:
drwxr-xr-x 7 fhem dialout 4096 Aug 19 23:42 .
drwxrwxrwx 9 fhem root 4096 Aug 19 22:44 ..
drwxr-xr-x 2 fhem dialout 4096 Aug 19 22:44 css
drwxr-xr-x 2 fhem dialout 4096 Aug 19 22:44 fonts
drwxr-xr-x 2 fhem dialout 4096 Aug 19 22:57 images
-rw-r--r-- 1 root root 14709 Aug 19 23:42 index.html
drwxr-xr-x 2 fhem dialout 4096 Aug 19 22:58 js
drwxr-xr-x 3 fhem dialout 4096 Aug 19 22:57 lib
Was muss ich machen um die Datei speichern zu können?
Danke
Nach dem Speichern gehört die index.html aber dem root User. Nutzt der FTP Client wirklich nicht root?
Ansonsten auf der Console per chown den Owner ändern oder per chmod 666 index.html die Rechte ändern.
Ich hatte der Datei schon 777 Rechte und 755 gegeben. Geht trotzdem nicht. Der ftp Client sagt beim speichern, dass ich nicht die erforderlichen Rechte habe.
Ich habe auch dem User root auf dem pi schon ein passwort gegeben und mich dann damit per ftp eingeloggt.
Aber auch da kann ich die bearbeitete Datei nicht speichern.
Gruss
Dennis
Ändere mal den Besitzer der Datei ich greife Samba zu und hab keine probleme. Da logge Ich mich immer als fhem ein.
Gesendet von meinem Z30 mit Tapatalk
Hallo setstate,
sind eigentliche neue Widgets in Planung / Arbeit? Und wenn ja welche? Diesbezüglich ist es verdammt ruhig geworden. :-[
Viele Grüße, Björn
Zb einkaufsliste dann weiß ich immer was Frau aufgeschrieben hat. :)
Gesendet von meinem Z30 mit Tapatalk
Zitat von: bjoernbo am 21 August 2015, 07:18:47
Hallo setstate,
sind eigentliche neue Widgets in Planung / Arbeit? Und wenn ja welche? Diesbezüglich ist es verdammt ruhig geworden. :-[
Viele Grüße, Björn
In Arbeit oder in Planung habe ich persönlich zur Zeit nichts Neues. Ich mache mir zwar immer mal wieder Gedanken über mögliche Optimierungs-/Änderungsmöglichkeiten, aber mein Fokus liegt aktuell mehr im Real Life bei der Family. Es wird auch wieder Tage geben (wenn es zum Beispiel draußen wieder ungemütlicher wird) wo es mich wieder zum Rechner zieht.
Das soll aber andere nicht abhalten, sich Erweiterungen auszudenken und umzusetzen.
;D ok !
Läuft ja auch alles soweit ohne Probleme.
Gibt es denn hier unter uns einen "Entwickler" der es ermöglichen kann, dass man im "simplechart"-Widget mehrere Kurven einzeichnen kann? Das ist nämlich so der letzte Punkt im meinem UI was mich noch stört.
Zitat von: setstate am 21 August 2015, 08:50:38
In Arbeit oder in Planung habe ich persönlich zur Zeit nichts Neues. Ich mache mir zwar immer mal wieder Gedanken über mögliche Optimierungs-/Änderungsmöglichkeiten, aber mein Fokus liegt aktuell mehr im Real Life bei der Family. Es wird auch wieder Tage geben (wenn es zum Beispiel draußen wieder ungemütlicher wird) wo es mich wieder zum Rechner zieht.
Das soll aber andere nicht abhalten, sich Erweiterungen auszudenken und umzusetzen.
Ich äußere dann noch einmal meine Bitte die Skalierung bei den simplecharts nicht vom Wertebereich sondern von einer Auswahl abhängig zu machen damit mehrere simplechart nebeneinander nicht unterschiedlich skaliert werden ... aber das hat natürlich Zeit, "gut Ding will Weile haben"
und dann habe ich vermutlich einen Bug im simplechart gesehen ... ich schau mal ob ich heute Nachmittag die Zeit finde das näher zu untersuchen ... data-minvalue="[5,10,20]" und obwohl das Minimum bei 12,0 liegt wird bei 5 begonnen :(
Zitat von: Nobby1805 am 21 August 2015, 12:26:13
und dann habe ich vermutlich einen Bug im simplechart gesehen ... ich schau mal ob ich heute Nachmittag die Zeit finde das näher zu untersuchen ... data-minvalue="[5,10,20]" und obwohl das Minimum bei 12,0 liegt wird bei 5 begonnen :(
Du musst nur die Werte in der Configuration umdrehen, also erst 20 und dann absteigend. Die Prüfung erfolgt auf "Value ist kleiner, dann nächster Array-Eintrag". Dann klappt es. Bei max ist es genau so wie du es geschrieben hattest, also aufsteigend.
Viele Grüße, Uli
Edit mit Beispiel:
<div data-type="simplechart"
data-logdevice="TC_LP"
data-logfile="CURRENT"
data-columnspec="DbLog:myDbLog:Bad_Temp:temperature"
data-minvalue="[25,20,15,10,5,1]"
data-maxvalue="[5,10,15,20,25,30]"
data-yticks="2"
data-daysago="0"
class="fullsize">
</div>
Danke ... ja, das war's
Zitat von: setstate am 11 Mai 2015, 00:34:42
Das Thema hat mich auch etwas beschäftigt und herausgekommen ist das neue Rotor Widget
kleiner Hinweis, der mich schier an den Rand der Verzweifelung geführt hat: rotor arbeitet mit <ul> und <li> tags. Default mäßig bewirken diese einen Einzug, der mir das Layout ganz schön durcheinander gebracht hat.
Um den Einzug zu vermeiden, ein
ul { margin: 0; padding: 0; }in die <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" /> einfügen. Bzw. um das ganze "updatesicher" zu machen, nach der fhem-tablet-ui.css eine eigene .css laden, die nur solche "overrides" enthält.
Zitat von: setstate am 03 August 2015, 23:40:33
Doch, data-substituton funktioniert. Hier einige Beispiele:
Dank der Vorarbeit von Torben und setstate kann ich in meiner Kalenderanzeige die Jahreszahl und die Sekunden für die einzelnen Einträge entfernen:
<td align="left"><div data-type="label" data-device="myCalview" data-get="t_001_bdate" data-part=".*(\d\d.\d\d.)\d\d.*"></div></td>
<td align="left"><div data-type="label" data-device="myCalview" data-get="t_001_btime" data-part=".*(\d\d:\d\d):\d\d.*"></div></td>Wie kann ich für die Ganztags- Termine die Uhrzeit 00:00 entfernen? Mit Regex'en hab ich es leider nicht so, und trial and error macht auch nur die erste Stunde lang Spaß ;-)
Schon mal vielen Dank für die Hilfe!
ich antworte mir einfach mal selbst - war doch nicht so schwer. Man schickt dem data-part einfach noch ein data-substituion hinterher ;D
<td align="left"><div data-type="label" data-device="myCalview" data-get="t_001_btime" data-part=".*(\d\d:\d\d):\d\d.*" data-substitution="s/00:00//g"></div></td>
Gibt es die Möglichkeit zwei Devices in einem Widget zu konfigurieren?
Der Hintergrund ist folgender: Ich habe MAX! Heizkörperthermostate, die ich allerdings nur über Dummys schalte, damit sie nicht aus dem Automatikprogramm rausgehen. Jetzt hätte ich gerne das Thermostatat Widget, dass mir die Temperatur, Valveposition und DesiredTemp vom Max HT anzeigt, eine Temperaturänderung jedoch an den zugehörigen Dummy sendet.
Hat jemand schonmal sowas gemacht?
Danke und Grüße
Gizmoh
Zitat von: Gizmoh am 25 August 2015, 09:26:05
Der Hintergrund ist folgender: Ich habe MAX! Heizkörperthermostate, die ich allerdings nur über Dummys schalte, damit sie nicht aus dem Automatikprogramm rausgehen. Jetzt hätte ich gerne das Thermostatat Widget, dass mir die Temperatur, Valveposition und DesiredTemp vom Max HT anzeigt, eine Temperaturänderung jedoch an den zugehörigen Dummy sendet.
Hat jemand schonmal sowas gemacht?
Du könntest alle benötigten Readings aus dem Max HT als Readings deines Dummys duplizieren (per Notify, DOIF, stateformat oder wie auch immer). Dann kannst Du das Dummy als Device im Widget definieren und das set-Kommando geht an die richtige Adresse. Dem Widget ist es egal, ob das Device wirklich ein Thermostat oder "nur" ein Dummy ist, solange es die benötigten Readings bereitstellt.
Zwei Devices in ein Thermostat-Widget dürfte bíslang nicht möglich sein.
Hi,
gibt es irgendeine Möglichkeit das folgende Müll-Widget einzubinden?
http://forum.fhem.de/index.php/topic,32382.0.html
Sorry, habe bisher nur ZWave Schalter eingebunden.
Gruss
Dennis
Zitat von: Gizmoh am 25 August 2015, 09:26:05
Der Hintergrund ist folgender: Ich habe MAX! Heizkörperthermostate, die ich allerdings nur über Dummys schalte, damit sie nicht aus dem Automatikprogramm rausgehen. Jetzt hätte ich gerne das Thermostatat Widget, dass mir die Temperatur, Valveposition und DesiredTemp vom Max HT anzeigt, eine Temperaturänderung jedoch an den zugehörigen Dummy sendet.
Hat jemand schonmal sowas gemacht?
Tip #1: attr [(wand)thermostat] keepAuto 1
Tip #2: Damit ich dennoch den manuellen Modus einschalten kann, habe ich einen Readingsproxy eingebaut:
Internals:
CFGFN
DEF KU_Wandthermostat:mode
DEVICE KU_Wandthermostat
NAME KU_Wandthermostat_OVERRIDE
NR 243
NTFY_ORDER 50-KU_Wandthermostat_OVERRIDE
READING mode
STATE manual
TYPE readingsProxy
Content:
KU_Wandthermostat 1
Readings:
2015-06-23 21:44:35 lastCmd manual
2015-08-26 18:49:57 state manual
Attributes:
devStateIcon manual:sani_heating_manual@orange auto:sani_heating_automatic@green
group KU-Heizung
room Technik-Kueche
setFn {my $mode = ReadingsVal("$DEVICE","mode","n/a");;my $desiredTemperature = ReadingsVal("$DEVICE","desiredTemperature","n/a");;if ($mode ne $CMD) {fhem("set $DEVICE desiredTemperature ".$CMD." ".$desiredTemperature);;}}
setList auto manual
webCmd auto:manual So sieht das in der UI aus (mit Wandthermostat & Thermostat für meine Küche (KU)) --> Siehe Anhang. Und so als Code:
<div data-type="thermostat"
data-subtype="MAX"
data-get="desiredTemperature"
data-set="desiredTemperature"
data-temp="temperature"
data-off="off"
data-boost="boost"
data-step="0.5"
data-min="5"
data-max="22"
data-device=" KU_Wandthermostat"
class="cell"></div>
<div style="margin-top:-27px !important;margin-bottom:20px !important">
<div data-type="label" data-device=" KU_Thermostat" data-get="valveposition" data-unit=" %" class="cell" data-fix="0" style="display:inline;margin:0 !important;"></div>
</div>
<div data-type="multistatebutton"
data-device=" KU_Wandthermostat_OVERRIDE"
data-get-on='["manual","auto"]'
data-icons='["oa-sani_heating_manual", "oa-sani_heating_automatic"]'
data-colors='["#aa6900", "SeaGreen"]'
data-background-colors='["#505050", "#505050"]'></div>
Perfekt, danke, genau sowas habe ich gesucht :-)
Zitat von: dennis_n am 26 August 2015, 20:10:30
Hi,
gibt es irgendeine Möglichkeit das folgende Müll-Widget einzubinden?
http://forum.fhem.de/index.php/topic,32382.0.html
Sorry, habe bisher nur ZWave Schalter eingebunden.
Gruss
Dennis
Genau das würde mich auch interessieren. Die Einbindung über readingsgroup device klappt leider nicht :-(
Grüße
Gizmoh
Da gibt es noch ein kleines Problem bei der Achsenbeschriftung ... beim Tageswechsel bzw. bei Neuskalierung der Y-Achse
Zitat von: setstate am 12 August 2015, 09:32:20
Hi Craig,
the volume control is added to the playstream widget now.
You can use it like this:
<div data-type="playstream" data-url="http://radioeins.de/stream"
data-device="dummy1"
data-get-on="play" data-get-off="stop"
data-volume="volume">
</div>
data-volume refers to a FHEM reading which holds the volume value (numeric 0-100)
Regards
Mario
Hi Mario,
Thanks very much for the addition of the volume control to playstream. I'm using the clock radio as part of a complete home system within pagetabs. If its playing and i navigate from the clock radio page to another and back i can't turn off the stream until a page refresh. Is this the expected behaviour?
Also i guess one remaining addition could be to have the url in a 'url' reading within the device readings similar to the volume so the radio station could be selectable using a dummy,notify and setreading similar to changing the volume. I don't know if a stream can be changed while it's playing or does it have to be stopped and started?
Thanks again for great work
Craig
Guten Abend,
gerade habe ich ein kleines Update hochgeladen.
Durch Vermeidung von Mehrfachupdates ist die Performance etwas besser geworden.
Hallo Zusammen,
ich bin gerade dabei in der Art eines Proof-of-Concept mir TabletUI anzusehen, um zu sehen, ob ich mir damit mein geplantens Steuertablet realisieren kann. Bis jetzt bin ich außerst optimistisch: alle Funktionalitäten, die ich benötige scheinen vorhanden zu sein; und das auch in einer Form, die mir sehr gefällt.
Dazu schon mal ein dickes Dankeschön an die Entwickler.
Ich beobachte allerdings ein sehr unschönens Ladeproblem der Seiten, was sich nach dem heutigen Update sehr vertärkt hat.
Und zwar folgendes:
- Manchmal werden Gridster-Elemente nicht geladen
- Die Gridster-Elemente werden an falscher Stelle gezeigt
- Anstelle der Gridster-Elemente erscheinen Sonderzeichen
Ein paar Beispiele sind als Screenshot angehängt.
Liegt das nun an TabletUI, an FHEM oder an etwas anderem? Ich kann im Forum niemanden finden, der Ähnliches beobachtet.
Viele Grüße
Christoph
PS: Wie geschrieben, ich bin noch am Austesten, deshalb bitte die Optik nicht zu ernst nehmen ;)
Zitat von: CQuadrat am 04 September 2015, 11:04:32
Ich beobachte allerdings ein sehr unschönens Ladeproblem der Seiten, was sich nach dem heutigen Update sehr vertärkt hat.
Und zwar folgendes:
- Manchmal werden Gridster-Elemente nicht geladen
- Die Gridster-Elemente werden an falscher Stelle gezeigt
- Anstelle der Gridster-Elemente erscheinen Sonderzeichen
Ein paar Beispiele sind als Screenshot angehängt.
Liegt das nun an TabletUI, an FHEM oder an etwas anderem? Ich kann im Forum niemanden finden, der Ähnliches beobachtet.
Ich habe auch das Problem, dass die Seiten nicht immer beim ersten Aufruf direkt geladen werden. Mehrmals auf den Reload-Button und dann geht es. Bin gerade an der Fehleranalyse - vermute zum einen ein Timeoutproblem, da ich das Verhalten auf meinem Tablet deutlich häufiger habe, im Vergleich zu meinem Desktop, zum anderen habe ich aber auch festgestellt, dass einzelne Widgets eher zu dem Problem neigen als anderen. Auch Browser-Cache löschen hilt dann nicht - scheint mir sogar eher kontraproduktiv zu sein, da die Seiten dann auch nochmal neu geholt werden müssen. Screenshots kann ich bei Bedarf aber erst heute Abend einstellen.
Ob das nach dem heutigen Update häufiger auftritt konnte ich bisher noch nicht testen.
Gruß,
André
Mit dem neuen Update kann es durchaus sein, dass jetzt Updates von Widgets ausbleiben. Das gehe ich heute nochmal an. Ursache ist einfach das asynchrone Holen und Updaten der Daten. Das führt zu Race-Condition Problemen. Das zuviel Updaten von vorher, führte unter Umständen aber zu Timeouts und FHEM Überlastung.
Hallo!
Ich habe mir eine Rollo-Steuerungsleiste zusammengebaut. Das geht schon ganz gut, allerdings möchte ich nicht, das der Button wieder aus geht wenn man nochmal drückt. Also wenn man oben drückt, soll der Button weiter leuchten, egal wie oft man da drauf drückt.
<header>Büro</header>
<div data-type="label" class="cell">Links</div>
<div data-type="switch" data-icon="fa-caret-up" data-device="Rollo_Buero" data-get-off="((?!Rauf).)*" data-get-on="Rauf" class="mini"></div></br>
<div data-type="switch" data-icon="fa-bars" data-device="Rollo_Buero" data-get-off="((?!Halb).)*" data-get-on="Halb" class="mini"></div></br>
<div data-type="switch" data-icon="fa-caret-down" data-device="Rollo_Buero" data-get-off="((?!Runter).)*" data-get-on="Runter" class="mini"></div></br>
Wie kann ich das erreichen?
Zitat von: adb76 am 04 September 2015, 12:55:54
Ob das nach dem heutigen Update häufiger auftritt konnte ich bisher noch nicht testen.
Gerade eben mal das Update gezogen und getestet: Auf meinem Tablet eine deutliche Geschwindigkeitssteigerung - geschätzt teilweise Faktor 2-3 schneller - und ich konnte bisher auch das Ladeproblem nicht mehr feststellen!! Hatte zwischendurch mit dem Gedanken gespielt, mal ein anderes UI wegen der schlechten Geschwindigkeit zu versuchen - hat sich jetzt erst mal erledigt. ;D Danke!
Hallo,
seit letztem Wochenende probiere ich mich an dem Tablet UI.
Es sieht auch schon ganz nach meinen Wünschen aus.
Ich hab noch ein großes Problem mit dem Aktualisieren.
longpoll=0 funktioniert, aber nicht das direkte mit longpoll=1.
in der index.html und in der fhem.cfg hatte ich es eingetragen.
Auf dem Tablet hab ich zur Darstellung webviewcontrol laufen.
In der normalen FHEM Umgebung funktioniert longpoll=1!!
Nur nicht in Tablet UI, sei es auf dem Tablet dargestellt oder auf dem Laptop.
Habt Ihr einen Tip?
Zitat von: IROC_KNX am 04 September 2015, 20:19:12
In der normalen FHEM Umgebung funktioniert longpoll=1!!
Nur nicht in Tablet UI, sei es auf dem Tablet dargestellt oder auf dem Laptop.
Was geht genau nicht? Man macht ein Fenster auf, aber innerhalb von 2 Sekunden ändert sich das Symbol auf dem Tablet nicht? Wenn man aber dann Refresh drückt ( Strg+R bzw. Cmd+R) zeigt das Symbol, dass das Fenster auf ist?
Setze probehalber auch mal debug=1 in der index.html. Was zeigt die Webconsole des Browsers? Kommen dort die Longpollevents an?
Also der Status ändert sich in der Tablet Ui Umgebung bei Longpoll=1 überhaupt nicht.
Egal wie lange ich warte.
Durch einen Refresh der Seite oder durch Wechsel der Etage von EG zu OG wird die Ansicht erst aktualisiert.
Bei Longpoll=0 funktioniert es, aber halt erst nach knapp 30sekunden.
Bisher hab ich nur die Aktoren für das Licht eingefügt.
Debug Modus werde ich gleich testen...
so, Debug Modus getestet. Kein Unterschied.
Aso, ich weißt nicht ob es so rüber kam, aber Ein- und Ausschalten kann ich mit Tablet UI.
Nur der Status wird nicht aktualisiert.
In FHEM ist der Status on und off mit eventMap umbenannt. Ich hab aber beides schon ausprobiert.
Beispiel aus der OG.html
<li data-row="2" data-col="2" data-sizex="2" data-sizey="3">
<header>Wohnzimmer</header>
<div data-type="switch" class="cell"
data-device="Whnz.Spots"
data-get="state"
data-get-on="on"
data-get-off="off"
data-set-on="Ein"
data-set-off="Aus"></div>
<div data-type="label" class="narow">Spots</div>
</div>
</li>
Hier ein Nachfolgeupdate zu Thema Performance-Verbesserung für Tabwechsel/Refresh.
Ich habe jetzt mit Caching der Device-States noch einiges rausholen können. Damit werden die Widget schneller dargestellt und viel Zeit beim Updaten gespart, weil vorher die Notwendigkeit zum Aktualisieren überprüft wird.
Zitat von: IROC_KNX am 05 September 2015, 11:24:37
so, Debug Modus getestet. Kein Unterschied.
Aso, ich weißt nicht ob es so rüber kam, aber Ein- und Ausschalten kann ich mit Tablet UI.
Nur der Status wird nicht aktualisiert.
Ich habe die Vermutung, dass dein Longpoll Output ein unerwartetes Format hat, wenn überhaupt was ankommt. Deshalb müsstest du mal folgende Zeile auskommentieren und in der Webconsole nachsehen was passiert und mir zukommen lassen http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers (http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers)
fhem-tablet-ui.js
Zeile 336 //console.log('#'+line+'#');
evtl. auch Zeile 356 auskommentieren
Zitat von: setstate am 05 September 2015, 22:10:24
Hier ein Nachfolgeupdate zu Thema Performance-Verbesserung für Tabwechsel/Refresh.
Ich habe jetzt mit Caching der Device-States noch einiges rausholen können. Damit werden die Widget schneller dargestellt und viel Zeit beim Updaten gespart, weil vorher die Notwendigkeit zum Aktualisieren überprüft wird.
Habe mir gleich das Update gezogen ;): Also die Geschwindigkeit hat sich nochmals deutlich verbessert!
Aber: mit dem Caching hat sich eventuell ein kleiner Bug eingeschlichen. Wenn ich meine Homepage neu lade und sich dann innerhalb der ersten 30 Sekunden der Status eines Device ändert, wird dieser neue Status nicht an der Oberfläche angezeigt z.B. Fenster auf/zu bleibt immer auf dem initialen Status beim data-type "symbol". Nach 30 Sekunden wird wieder jede Änderung direkt angezeigt. War vorher so nicht der Fall. Ach so: Longpoll steht bei mir auf "1".
Gruß,
André
longpoll started erst nach 30 Sekunden. Musste ich so machen, weil ich beim WVC Timeouts bekam. Die Wartezeit kann aber jetzt wieder auf 10 Sekunden runter. Ändere ich heute Abend.
Asche auf mein Haupt, ich hab es ggf. hier in diesem Thread u/o auch in dem User-Demo Thread übersehen wie man die FHEM-SVG plots einbindet.
Die Darstellung vom User CQuadrat aus diesem Thread http://forum.fhem.de/index.php/topic,34233.msg329336.html#msg329336 ist derzeit mein Favorit (insbd. wg. der Größe), aber ich habe keinen Code gefunden.
http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=36819;image
Beim User viegner aus dem User-Demo Thread http://forum.fhem.de/index.php/topic,37378.msg297617.html#msg297617 habe ich den Code gefunden, allerdings werde ich nicht richtig schlau draus, was alles komplett benötigt wird; insbsd. da ich die JS-Funktion für die Plot-"Navigation" nicht benötige.
http://forum.fhem.de/index.php?action=dlattach;topic=37378.0;attach=32511;image
Daher bin ich auf der Suche nach weiteren Code-Beispielen. Vielen Dank vorab.
Hier das Ergebnis aus der Konsole:
TEST +key:Whnz.Spots+ para:STATE+ val:Ein+
TEST +key:Whnz.Spots+ para:STATE+ val:Ein+
TEST +key:Whnz.Spots+ para:STATE+ val:Aus+
TEST +key:Whnz.Spots+ para:STATE+ val:Aus+
Es scheint ja was anzukommen..
Zitat von: setstate am 05 September 2015, 22:25:12
Ich habe die Vermutung, dass dein Longpoll Output ein unerwartetes Format hat, wenn überhaupt was ankommt. Deshalb müsstest du mal folgende Zeile auskommentieren und in der Webconsole nachsehen was passiert und mir zukommen lassen http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers (http://webmasters.stackexchange.com/questions/8525/how-to-open-the-javascript-console-in-different-browsers)
fhem-tablet-ui.js
Zeile 336 //console.log('#'+line+'#');
evtl. auch Zeile 356 auskommentieren
Müsste dann die Definition nicht so aussehen?
<div data-type="switch" class="cell"
data-device="Whnz.Spots"
data-get-on="Ein"
data-get-off="Aus"
</div>
Top, das war es :)
Ich hab jetzt folgende drei Zeilen etntfernt:
data-get="state"
data-set-on="Ein"
data-set-on="Aus"
Könntest du mir kurz erklären was diese Zeilen bewirken? Ich dachte u.a. "State" wäre wichtig.
Aber erst mal vielen Dank :-)
Zitat von: setstate am 06 September 2015, 20:13:00
Müsste dann die Definition nicht so aussehen?
<div data-type="switch" class="cell"
data-device="Whnz.Spots"
data-get-on="Ein"
data-get-off="Aus"
</div>
Man könnte es ach so angeben
<div data-type="switch" class="cell"
data-device="Whnz.Spots"
data-get="STATE"
data-get-on="Ein"
data-get-off="Aus"
data-set-on="Ein"
data-set-off="Aus">
</div>
Aber da auch Defaults hinterlegt sind, kann man sich einiges sparen.
Für data-get ist der Default: "STATE", also muss man es auch nicht explizit angeben.
Für data-set-on ist der Default der Wert von data-get-on. Ebenso bei data-set-off der Wert von data-get-off. Wenn sich die Werte also nicht unterscheiden, muss man diese auch nicht extra angeben.
Ich habe deine Definition von data-get="state" auf data-get="STATE" geändert, weil im longpoll ja auch "STATE" publiziert wurde und nicht "state".
Danke für die Erklärung.
Hätte nicht gedacht, dass es Auswirkungen hat ob man Groß oder Klein schreibt.
Hinweis: Damit nach dem Update der Refresh des Simplechart wieder funktioniert, muss jetzt auch ein device angegeben werden, der das Refresh triggert.
data-device="THSensorWZ"
data-logdevice="FileLog_THSensorWZ"
Von was ist es eigentlich Abhängig, ob Widgets übereinander oder nebeneinander erscheinen?
Ich hatte mir gedacht, am sinnvollsten ist es, mein LED16 als template einzubauen:
<li data-row="5" data-col="2" data-sizex="6" data-sizey="2" data-template="alarmanlage.html"></li>
und habe es dann so aufgebaut:
<body>
<header>LED16</header>
<div class="container">
<div class="left">
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="cell"></div>
<div data-type="symbol" data-device="og.sz.led.eg.az.fenster" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="cell"></div>
.......
Leider erscheinen die "fa-bell"'s aber alle nebeinander.Ziel wäre im Prinzip 8 Bells übereinander mit Labels daneben und daneben dann nochmal Labels und Bells. Also im Prinzip wie das LED16 nur als Darstellung auf dem Tablet ;)
Hallo selfarian,
ein normales DIV nach einem normalen DIV macht immer einen Zeilenumbruch. Will man zwei DIVs nebeneinander, muss man class="inline" hinzufügen.
Das LED16 kann man prinzipiell damit dann schon aufbauen.
In der obersten Ebene setzt man einfach zwei DIVs nebeneinander, linke Spalte und rechte Spalte. (Achtung: Breite der Gridster-Box muss ausreichend sein)
Jetzt füllt man jede Spalte mit Zeilen aus Symbol und Label - jeweils zwei DIVs mit class=inline", damit sie nebeneinander angeordnet werden. Die DIVs für die Zeilen brauchen keine besondere Klasse, damit werden sie untereinander angeordnet.
Dem Label habe ich noch die Klasse "w2x" und "left-align" bzw. "right-align" hinzugefügt, damit alle Labels eine feste Breite haben und der Text links bzw. recht angeordnet wird.
Hier mal für 8 LEDs als Beispiel:
<li data-row="4" data-col="4" data-sizex="6" data-sizey="3">
<header>LED16 EXAMPLE</header>
<div class="inline">
<div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer1" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
<div data-type="label" class="w2x left-align darker inline">LED 1</div>
</div>
<div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer3" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
<div data-type="label" class="w2x left-align darker inline">LED 3</div>
</div>
<div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer5" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
<div data-type="label" class="w2x left-align darker inline">LED 5</div>
</div>
<div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer7" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
<div data-type="label" class="w2x left-align darker inline">LED 7</div>
</div>
</div>
<div class="inline">
<div>
<div data-type="label" class="w2x right-align darker inline">LED 2</div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer2" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
</div>
<div>
<div data-type="label" class="w2x right-align darker inline">LED 4</div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer4" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
</div>
<div>
<div data-type="label" class="w2x right-align darker inline">LED 6</div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer6" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
</div>
<div>
<div data-type="label" class="w2x right-align darker inline">LED 8</div>
<div data-type="symbol" data-device="og.sz.led.eg.fl.tuer8" data-get-on='["off","green","orange","red"]' data-on-colors='["#505050","SeaGreen","GoldenRod","Crimson"]' data-icons='["fa-bell","fa-bell","fa-bell"]' class="narrow inline"></div>
</div>
</div>
</li>
Also seit dem update wird auf dem Tablet der Heizungsregler ist wert nicht mehr angezeigt. Am PC schon. Auch manche Buttons aktualisieren sich nicht mehr. Auch wenn es 10 min aktiv ist.
Gesendet von meinem Z30 mit Tapatalk
Hallo setstate,
jetzt klappt es, vielen Dank!
Zitat von: nesges am 18 April 2015, 17:36:07
Gute Idee! Das control-File hat ja schon die benötigten Infos, das müsste man nur prüfen und mit den lokalen Files vergleichen. Kann man mit HTTPMOD machen, man braucht nur eine Prüffunktion, die man irgendwo in eine 99_myUtils.pm legt:
sub controlfile_updatecheck($) {
use Date::Parse;
my $raw = shift;
my $response='';
my @lines = split "\n", $raw;
foreach my $line (@lines) {
my @remote= split " ", $line;
$remote[1]=~s/_/ /;
my @local = stat($remote[3]);
if($local[7] != $remote[2] || $local[9] < str2time($remote[1])) {
$response .= $remote[0]." ".$remote[3]."\n";
}
}
return $response;
}
Eine Funktion um das Update durchzuführen und die Readings zu aktualisieren:
sub controlfile_update($) {
my $device = shift;
my $url = InternalVal($device, 'url', '');
my $def = InternalVal($device, 'DEF', '');
fhem("setreading $device available updated");
fhem("setreading $device files -");
fhem("define at_recheck_$device at +00:05:00 modify $device $def");
fhem("update all $url");
}
Und in die fhem.cfg kommen dann diese Definitionen:
define UPDATE_FTUI HTTPMOD https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt 14400
attr UPDATE_FTUI alias Fhem Tablet UI
attr UPDATE_FTUI userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_FTUI event-on-change-reading available,files
attr UPDATE_FTUI reading01Name files
attr UPDATE_FTUI reading01Regex (?s)(UPD.*)
attr UPDATE_FTUI reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_FTUI reading02Name available
attr UPDATE_FTUI reading02Regex (?s)(UPD.*)
attr UPDATE_FTUI reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_FTUI room hidden
define UPDATE_WIDGETS HTTPMOD https://raw.githubusercontent.com/nesges/Widgets-for-fhem-tablet-ui/master/controls_widgets-for-fhem-tablet-ui.txt 14400
attr UPDATE_WIDGETS alias Widgets for Fhem Tablet UI
attr UPDATE_WIDGETS userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_WIDGETS event-on-change-reading available,files
attr UPDATE_WIDGETS reading01Name files
attr UPDATE_WIDGETS reading01Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_WIDGETS reading02Name available
attr UPDATE_WIDGETS reading02Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_WIDGETS room hidden
define UPDATES readingsGroup UPDATE_FTUI:available,files UPDATE_WIDGETS:available,files
attr UPDATES valueFormat { ($READING eq 'files' && $VALUE !~ /^-?$/)?'<a href="?cmd={controlfile_update(\'$DEVICE\')}">[Start Update]</a>':$VALUE }
attr UPDATES alias 3d Party Updates
attr UPDATES room System
In der readingsGroup wird ein Link mit dem Text "[Start Update]" angezeigt, sobald ein Update verfügbar ist. Die readingsGroup kann man sicher noch schöner machen, aber da kenn ich mich nicht aus und überlasse das euch :)
PS: Habe ein paar Stellen verändert, am besten komplett neu übernehmen.
Bei mir wirft die Funktion controlfile_updatecheck Fehler - gibt's hiervon eine neue Version?
Moin,
so hier ma Screenies:
Im FF kommt das so wie 01 im Anhang
im Edge und aufm Tablet Chrome und Standardbrowser wie Bild 2.
Aber auch mit einer älteren FTUI Version hab ich das Problem. -.-
Beim RGB zb wird der Wert in der Mitte aber angezeigt ?
Zitat von: devil77
Du könntest in deinem Thermostat ein Userreading anlegen das die Ventillstellung abfragt.
In dem Widget kannst Du das dann abfragen und hättest alles in einem.
Hat wer da gerade nen Gedankenanstoß ? mit userreadings noch nicht auseinandergesetzt ;) und auch nun wieder Arbeiten ;)
Danke ;)
Grüßßeee
Hallo,
erstmal danke für das super Frontend! Ist einfach ein Traum!
Ich bin aber noch auf der Suche nach guten Rollo-Widgets. Im Thread hab ich leider nichts gefunden.
Ich möchte gerne 4 Buttons, mit denen ich die Rollos steuern kann: Auf=100, Zu=0, Mittig= 25 und Stop=stop.
Ich hätte dies mit switch probiert aber irgendwie bekommen ich es nicht so hin:
<div class="cell left">
<div data-type="switch" data-device="wz_Rollo_Rechts "
data-get-off="((?!Wert1).)*"
data-get-on="100" class="cell" ></div>
<div data-type="label" class="cell">Auf</div>
<div data-type="switch" data-device="wz_Rollo_Rechts "
data-get-off="((?!Wert2).)*"
data-get-on="25" class="cell" ></div>
<div data-type="label" class="cell">25</div>
<div data-type="switch" data-device="wz_Rollo_Rechts "
data-get-off="((?!Wert3).)*"
data-get-on="0" class="cell" ></div>
<div data-type="label" class="cell">Zu</div>
<div data-type="switch" data-device="wz_Rollo_Rechts "
data-get-off="((?!Wert4).)*"
data-get-on="stop" class="cell" ></div>
<div data-type="label" class="cell">Stop</div>
</div>
Das setzen funktioniert, aber ich möchte gerne, dass z.B. der Auf-Button an ist wenn die Rollos auf sind.
Was muss ich hier bei data-get-off setzen? Kann ich hier Bereiche setzen, z.B. so dass bei dem Wert 100-80 der Auf-Button an ist usw.
Werden hier die Buttons auch richtig markiert, wenn ich die Rollos am Wandschalter bediene.
Danke schon mal für eure Hilfe.
Ich würde mich auch auf andere Rollo-Steuerungs Beispiele freuen.
@DJ_SAMMY190:
Ich vermute eher: zu wenig Platz fürs Thermostat. Probiere mal das Gridster-Element breiter zu machen, dann müsste der Platz ausreichen und der Zahlenwert wird angezeigt.
Hallo,
ich hab ein merkwüriges Phänomen.
Im Menü habe ich den Home-button und einen Weiter-Button.
Wenn ich den Weiter-Butten anklicke, komme ich zur nächsten Seite.
Dort habe ich im Menü einen Zurück-button. Beide sind jeweils ein Link zur anderen Seite.
Wenn ich aber auf die zweite Seite gekommen bin, ist dort der Zurück-button aktiviert und liefert keine Funktion.
index.html
....
<div class="gridster">
<header>MENU</header>
<div class="cell">
<div data-type="pagetab" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="raume.html" data-icon="oa-control_building_s_all" class="cell" data-on-color'#aa6900' data-off-color '#505050'></div>
<div data-type="pagetab" data-url="kalender.html" data-icon="fa-calendar" class="cell"></div>
<!-- <div data-type="pagetab" data-url="index_7.html" data-icon="fa-phone" class="cell"></div> -->
<div data-type="pagetab" data-url="wetter.html" data-icon="oa-weather_station" class="cell"></div>
<div data-type="pagetab" data-url="fahrzeug.html" data-icon="fa-automobile" class="cell"></div>
<div data-type="pagetab" data-url="media.html" data-icon="oa-it_radio" class="cell"></div>
<div data-type="pagetab" data-url="index2.html" data-icon="oa-control_arrow_rightward" class="cell" data-on-color'#aa6900' data-off-color '#505050'></div>
</div>
....
index2.html
....
<header>MENU</header>
<div class="cell">
<div data-type="pagetab" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="raume.html" data-icon="oa-control_building_s_all" class="cell" data-on-color'#aa6900' data-off-color '#505050'></div>
<div data-type="pagetab" data-url="kalender.html" data-icon="fa-calendar" class="cell"></div>
<!-- <div data-type="pagetab" data-url="index_7.html" data-icon="fa-phone" class="cell"></div> -->
<div data-type="pagetab" data-url="wetter.html" data-icon="oa-weather_station" class="cell"></div>
<div data-type="pagetab" data-url="fahrzeug.html" data-icon="fa-automobile" class="cell"></div>
<div data-type="pagetab" data-url="cam.html" data-icon="oa-it_camera" class="cell"></div>
<div data-type="pagetab" data-url="index.html" data-icon="oa-control_arrow_leftward" class="cell" data-on-color'#aa6900' data-off-color '#505050'></div>
</div>
</ul>
....
Hat einer eine Idee?
Zitat von: Fischei am 08 September 2015, 21:26:34
Hallo,
erstmal danke für das super Frontend! Ist einfach ein Traum!
Ich bin aber noch auf der Suche nach guten Rollo-Widgets. Im Thread hab ich leider nichts gefunden.
Ich möchte gerne 4 Buttons, mit denen ich die Rollos steuern kann: Auf=100, Zu=0, Mittig= 25 und Stop=stop.
....
Das setzen funktioniert, aber ich möchte gerne, dass z.B. der Auf-Button an ist wenn die Rollos auf sind.
Was muss ich hier bei data-get-off setzen? Kann ich hier Bereiche setzen, z.B. so dass bei dem Wert 100-80 der Auf-Button an ist usw.
Werden hier die Buttons auch richtig markiert, wenn ich die Rollos am Wandschalter bediene.
Danke schon mal für eure Hilfe.
Ich würde mich auch auf andere Rollo-Steuerungs Beispiele freuen.
Ich habe mal ein Beispiel mit eckigen Buttons erstellt:
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off=""
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="25" data-set-off=""
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">25</div>
</div>
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="[0-9]" data-get-off="!on"
data-set-on="0" data-set-off=""
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="dummy1"
data-set-on="stop" data-off-color="#2A2A2A"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
Zur Erklärung der Parameter:
data-get-on="100|[89][0-9]" -> wann soll der switch AN sein? Angabe als RegEx: Bei 100 oder 80-99
data-get-off="!on" -> wann soll der switch AUS sein? Angabe mit Schlüsselwort: "nicht Wert von get-on"
data-set-on="100" -> Was soll bei Schalten auf AN gesendet werden: "100"
data-set-off="" -> Was soll bei Schalten auf AUS gesendet werden: Schlüsselwort: "nichts senden" + "Schalten auf AUS unterdrücken"
Mit Stop gehen natürlich alle Button aus, weil der STATE dann 'stop' ist und nicht mehr numerisch. Es wäre daher geschickter, wenn die drei oberen Buttons auf ein anderes Reading des Rollos zeigen - z.B. data-get="value"
Zitat von: Syntaxterror am 08 September 2015, 22:24:46
Hallo,
ich hab ein merkwüriges Phänomen.
Im Menü habe ich den Home-button und einen Weiter-Button.
Wenn ich den Weiter-Butten anklicke, komme ich zur nächsten Seite.
Dort habe ich im Menü einen Zurück-button. Beide sind jeweils ein Link zur anderen Seite.
Wenn ich aber auf die zweite Seite gekommen bin, ist dort der Zurück-button aktiviert und liefert keine Funktion.
....
Hat einer eine Idee?
Probiere mal eindeutige Dateinamen für alle Files. Also statt index.html und index2.html -> index.html und next.html
Zitat von: P.A.Trick am 08 September 2015, 20:16:23
Bei mir wirft die Funktion controlfile_updatecheck Fehler - gibt's hiervon eine neue Version?
Was für Fehler werden denn geworfen?
Ja hat geklappt mit breite von 2. Komisch aber danke. Dementsprechend umdesignd. Noch wer eine Idee zum userreading? Danke im voraus mfg
Gesendet von meinem Z30 mit Tapatalk
Hallo Alle,
zuerst mal WOW ;) Ich habe den Thread vor ein paar Tagen entdeckt und war infiziert... Ich kann mit dem UI endlich den WAF steigern und auch die Frau findet wie bei einigen mehr gefallen für die "Männerspielerei" :-X
Besonderen Dank an setstate und nesges und alle anderen, die sich hier bisher eingebracht haben und auch ihren Code zur Verfügung stellen.
Ich habe nun auch angefangen mein persönliches UI zu basteln und komme langsam voran (siehe Screenshot). Allerdings habe ich aktuell ein kleines Problem zu dem ich im Thread (zugegeben es fehlen noch 56 Seiten) und auch Inder sonstigen Doku keine Lösung gefunden habe:
Mein Homestatus.... Ich erfasse den Status mittels Modul "GEOFANCY / Residents" als Client habe ich EgiGeozone (Android Handys) <-- Das Modul funktioniert auch einwandfrei.
Aus der Doku habe ich entnommen, dass das Widget "Homestatus" die Zustände 1 - 4 beherrscht und entsprechend über Alias "lesbar" die Setbefehle geben an FHEM dann ja auch den Status 1 - 4.
Was bei mir nun nicht funktioniert ist die Anzeige des Status sowie die Übergaben eine Status zwischen Widget und FHEM. Ich habe bereits unter dem Residents Atribut rr_locationHome eine 1 eingetragen aber auch das brachte keinen Erfolg (weder Anzeige noch Staus setzen).
Ich glaube ich habe hier einen groben Denkfehler und wäre dankbar für einen Tipp, wie ich die Lücke zwischen Widget und FHEM schließe.
#### ERLEDIGT ####
Nebenbei werden die Icons nicht Angezeigt. Kann mir jemand sagen, zu welcher lib sie gehören ? Andere "fa-" Icons funktionieren.
Hier mal die CFG:
<header>HOMESTATUS JAN</header>
<div data-type="homestatus" data-device='Jan'
data-get-on='["1","2","3","4"]'
data-alias='["home","work","absent","holiday"]'
data-icons='["fa-home","fa-laptop","fa-car","fa-suitcase"]'>
</div>
#### Lösung ####
Konfig neu eingespielt und data-version='residents' verwendet. Nun geht alles. Fehler lag darin, dass ich nur die 3 Status Möglichkeiten haben wollte und daher auf die Data-Version verzichtet.
Die Icons haben ein Problem mit dem IE im Chrome werden sie angezeigt.
#### Lösung ENDE ####
Der Code ist nicht mehr der Originale, da ich neben der Einbindung noch versucht habe das Sleep auf Work umzustricken.
Danke dir setstate! Funktioniert super!
Moin,
@ setstate geht mit 2.
und an den Rest. Wer ein Wandthermostat zur Steuerung benutzt und die Stellung angezeigt haben möchte füge ein.
attr wandthermostat_esszimmer_Climate ValvePosition { ReadingsVal("heizung_esszimmer_Clima","ValvePosition",0)}
Habs nun rausbekommen ;)
Hab mir das UI auch installiert inklusive Update Funktion. Erstklassige Arbeit.
Aber seit die Update Funktion drin ist ne menge Warnungen im log.
2015.09.09 18:23:15 1: HMLAN_Parse: HMLanUSB new condition init
Odd number of elements in anonymous hash at (eval 24) line 1.
Use of uninitialized value $remote[1] in substitution (s///) at ./FHEM/99_myUtils.pm line 160.
Use of uninitialized value $remote[3] in stat at ./FHEM/99_myUtils.pm line 162.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value $remote[1] in substitution (s///) at ./FHEM/99_myUtils.pm line 160.
Use of uninitialized value $remote[3] in stat at ./FHEM/99_myUtils.pm line 162.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value $remote[1] in substitution (s///) at ./FHEM/99_myUtils.pm line 160.
Use of uninitialized value $remote[3] in stat at ./FHEM/99_myUtils.pm line 162.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value $remote[1] in substitution (s///) at ./FHEM/99_myUtils.pm line 160.
Use of uninitialized value $remote[3] in stat at ./FHEM/99_myUtils.pm line 162.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric ne (!=) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
Use of uninitialized value in numeric lt (<) at ./FHEM/99_myUtils.pm line 163.
2015.09.09 18:23:21 1: PERL WARNING: Use of uninitialized value $n in hash element at fhem.pl line 3566.
2015.09.09 18:23:22 1: Error dewpoint: humidity invalid: 0
2015.09.09 18:23:25 2: TCM EnOcean RESPONSE: OK
Das 'odd number' kommt glaube vom virtuellen Sensor für das HM Heizungsventil, genauso die letzte Warnung hab aber noch nicht herausgefunden wieso.
Sind also uninteressant aber den Rest hätte ich gerne gelöst.
Hallo keinerDrache,
die Warnungen resultieren aus Code in der Datei 99_myUtils.pm. Diese Datei wird von FTUI nicht geändert. Üblicherweise wird der Code in der Datei von Hand hinzugefügt.
ZitatUse of uninitialized value ... at ./FHEM/99_myUtils.pm
Schaue doch in die Datei 99_myUtils.pm in den jeweiligen Zeilen, welcher Code für die Warnungen verantwortlich ist.
VG
Sven
Zitat von: SvenJust am 09 September 2015, 20:13:07
Hallo keinerDrache,
die Warnungen resultieren aus Code in der Datei 99_myUtils.pm. Diese Datei wird von FTUI nicht geändert. Üblicherweise wird der Code in der Datei von Hand hinzugefügt.Schaue doch in die Datei 99_myUtils.pm in den jeweiligen Zeilen, welcher Code für die Warnungen verantwortlich ist.
VG
Sven
Bei mir tritt es nur auf, wenn Updates vorhanden sind! Mist habe gestern aktualisiert!
Das ist es ja, der Code ist der von der Updatefunktion, speziell von der sub controlfile_updatecheck.
In perl bin ich aber ne voll Niete alles was da drin steht ist nur Copy & Paste.
Ich verwende jetzt seit einiger Zeit das Tablet UI und bin von den Möglichkeiten begeistert. Einen großen Dank an die Entwickler!
Ich suche noch einen Möglichkeit, im Tablet UI einem Dummy einen Datums- und Zeitwert zuzuweisen. Im FHEMWEB habe ich das mit dem datetimepickerwidget von https://github.com/mhop/fhem-mirror/tree/master/fhem/contrib/Widgets/DateTimePicker (https://github.com/mhop/fhem-mirror/tree/master/fhem/contrib/Widgets/DateTimePicker) realisiert.
Wäre es möglich, dieses Widget ins Tablet UI zu integrieren?
Gruß
Luigi
Da sehe ich gute Möglichkeiten, den DateTime Picker zu integrieren.
Was wären die typischen Anwendungsfälle? Wecker stellen fällt mir spontan ein ...
Ist das Picker Control auch für Touchdisplays geeignet?
Mein Anwendungsfall ist setzen von 2 Dummies für Start und Ende der Urlaubsabwesenheit für die Steuerung der Heizung.
Auf einem Touchdisplay hab ich noch nicht probiert.
Zitat von: kleinerDrache am 09 September 2015, 18:41:26
Aber seit die Update Funktion drin ist ne menge Warnungen im log.
Ich glaube ich weiss woher's kommt, muss mir das aber mal "live" ansehen, bevor ich's anpasse.
keinen Stress hab das Warnings erstmal deaktiviert. Nicht das gelbe von Ei aber verhindert das es mir das log zumüllt.
Ich habe ein kleines Problem damit wie ich das reload Widget benutze.
Habe es laut wie laut Bespiel eingefügt:
<div data-type="reload" data-device="RELOAD" data-get="action" data-reload-on="1" data-reset-to="0"></div>
Wie starte ich jetzt eine Aktualisierung der Seite?
Ich hätte noch eine Frage zu dem Einbinden der Sonos-Boxen: http://forum.fhem.de/index.php/topic,34233.msg285942.html#msg285942
Die Kombobox mit den Playlisten wird bei mir noch richtig befüllt. Wenn ich aber dann einen Eintrag auswähle, dann wird nur folgender Befehl ausgeführt: "set duSonosPlaylists Sonos_Esszimmer" Somit wird in der sub "SonosPlaylistStarten" auch nur der Player gesetzt und die Playlist bleibt leer.
Wie kann ich hier noch die Playliste übergeben?
<div data-type="select" data-device="duSonosPlaylists" data-list="Playlist" data-set="Sonos_Bad" class="wider"></div>
Erstmal ein dickes Dankeschön an diesem tollen FrontEND, habs durch zufall gesehen und dachte mir sofort das muss ich haben.
Eine Frage habe ich aber noch. Ist es aktuell möglich einen Farbverlauf für eine Wert im "Label" zu erstellen. mit data-limit und data-color kann man ja "statische" Farben vergeben.
Allerdings ist das für eine Temperaturbereich von 19°C - 23°C ziehmlich mühselig für jeden in 0,5°C Schritten den Wert zu schreiben. Gibt es da nicht eine Möglichkeit zu sagen im Bereiche von 19-23°C soll die Farbe automatisch im Bereich sagen wir mal von blau nach rot generiert werden.
Andernfalls bleibt die Frage ob jemand ein Tool kennt kennt um einen Farbverlauf zu generien in dem man sich in 0,5 Schritten den entsprechende HEX Color Wert rauspicken kann sodass es nacher einen schönen gleichmäßigen verlauf gibt.
Richtig Toll wäre es wenn man für 19°C Blau wählt für 21°C Grün und für 23°C Rot. Weil normalerweise geht der Farbverlauf ja von Blau über in Violett nach Rot.
sowas ähnliches habe ich hier gefunden: http://www.fhemwiki.de/wiki/Temperaturfarbe (http://www.fhemwiki.de/wiki/Temperaturfarbe)
MFG, Daniel Joachims
Das Tool hier ist bestens dazu geeignet:
https://vis4.net/labs/multihue/#colors=#7B68EE,#32CD32,#FF0000|steps=20|bez=0|coL=0 (https://vis4.net/labs/multihue/#colors=#7B68EE,#32CD32,#FF0000%7Csteps=20%7Cbez=0%7CcoL=0)
Da bekommt man für einen 20 stufigen Verlauf von blau,grün,rot dieses Array zurück:
['#7b68ee', '#7f74dc', '#8180cb', '#808bb9', '#7e96a7', '#79a095', '#71ab83', '#67b56f', '#59be5a', '#43c841', '#52c72f', '#78bc28', '#92b022', '#a8a31b', '#ba9515', '#ca860e', '#d97507', '#e76003', '#f34400', '#ff0000']
Das kann man bestimmt auch irgendwann mal als JS Funktion in Label Widget einbinden ...
Super Vielen Vielen Dank ! MIt dem Tool komme ich dann schonmal weiter :) ;D
Zitat von: setstate am 09 September 2015, 00:56:47
Probiere mal eindeutige Dateinamen für alle Files. Also statt index.html und index2.html -> index.html und next.html
leider ändert sich da nichts :(
Zitat von: Luigi am 10 September 2015, 16:40:44
Ich verwende jetzt seit einiger Zeit das Tablet UI und bin von den Möglichkeiten begeistert. Einen großen Dank an die Entwickler!
Ich suche noch einen Möglichkeit, im Tablet UI einem Dummy einen Datums- und Zeitwert zuzuweisen. Im FHEMWEB habe ich das mit dem datetimepickerwidget von https://github.com/mhop/fhem-mirror/tree/master/fhem/contrib/Widgets/DateTimePicker (https://github.com/mhop/fhem-mirror/tree/master/fhem/contrib/Widgets/DateTimePicker) realisiert.
Wäre es möglich, dieses Widget ins Tablet UI zu integrieren?
Gruß
Luigi
Das gibt es jetzt:
widget_datetimepickerDas Widget ist eine Erweiterung des Labels. Bei Klick öffnet sich der Date/Time Picker, der den Wert des Labels ändert und an FHEM sendet.
Date und Time Picker
<div class="cell left" >
<div data-type="label" class="inline thin" >Start:</div>
<div data-type="datetimepicker" data-device="dummy1" class="inline large thin orange"></div>
</div>
<div class="cell left" >
<div data-type="label" class="inline thin">Ende:</div>
<div data-type="datetimepicker" data-device="dummy2" class="inline large thin orange"></div>
</div>
Time Picker
<div class="cell left" >
<div data-type="label" class="inline thin" >Bad:</div>
<div data-type="datetimepicker" data-device="dummy1"
data-datepicker="false" data-format="H:i"
class="inline large thin organge"></div>
</div>
Sieht mal geil aus
Gesendet von meinem Z30 mit Tapatalk
Super, danke!
Ich habe zum FTUI nochmal 4 Fragen.
1. Wie mache ich das, dass die Widgets ihre Position beibehalten? Wenn ich Browser die Seite im Vollbild öffne ist alles ok. Wenn ich aber nur ein halbes Browser Fenster öffne verschieben sich die Widget alle. Möchte das so erreichen das die Anorndung die ich Definiere auch immer Angezeigt wird egal ob es in Browser Fenster passt oder nicht. Muss zwar Scrollen aber das ist egal.
2. gibt es ein Widget um in FHEM definierte "at" anzusteuern. Also sowas ähnliches wie "settime" für einen Wecker. Habe verschiedene Zeitschaltuhren mit "at" erstellt die ich gerne anzeigen möchte.
3. Ich habe mir das Widget "wind_direction" erstellt. Funktioniert soweit auch aber statt der Windrichtung in Textform also "N, W, SW usw" bekomme ich nur ein "-" angezeigt. Obwohl sich der Zeiger jenach windrichtung auch ändert.
4. Ich habe ein Symbol erstellt das jenach zustand die Farbe wechseln soll. Im Prinzip funktioniert das auch. aber ich muss erst die Seite neuladen damit die Farbe angenommen wird.
Ich hatte dieses Problem schon mal ,weiß aber nicht mehr wie die Lösung ist und auch nichts im Forum gefunden .
Die Anzeige im Tablet UI für die Spritpreise ist nicht in Euro , in der HTML Seite allerdings sehe ich keinen Fehler .
Wer kann mir unter die Arme greifen ?
<div type="label" device="Jet" data-get="Diesel" data-unit="€" style="font-size:x-large;color:#aa6900;"></div>
<div data-type="label" class="cell" >Diesel</div>
Hallo,
vielleicht kommst Du damit weiter
http://wiki.selfhtml.org/wiki/Referenz:HTML/Zeichenreferenz
oder das
http://www.web-toolbox.net/webtoolbox/html/euro-zeichen.htm
Gruß Christoph
Danke für die Antwort ,
hilft aber nicht .......... :((
Wenn ich bei mir data-unit="€" setze wird ein Euro-Zeichen angezeigt.
Der Fehler bei der Darstellung des Eurozeichens läßt sich korrigieren, wenn die HTML-Datei als UTF-8 Datei gespeichert wird.
Bez. Warnings aus controlfile_updatecheck: Wirklich nachvollziehen konnte ich die Warnings nicht. Sie können mMn nur auftreteten, wenn das controlfile nicht das korrekte Format hat. Eine kleine Anpassung habe ich reingenommen, ich prüfe ob eine "UPD"-Zeile im Controlfile mindestens vier Elemente hat. Sollten trotzdem weiterhin Warnings im Log auftauchen, bitte einmal einen Logausschnitt inkl. der Zeilen, die mit "UPD" anfangen posten. Dafür wäre dann (min) Loglevel 3 nötig.
sub controlfile_updatecheck($) {
use Date::Parse;
my $raw = shift;
my $response='';
my @lines = split "\n", $raw;
foreach my $line (@lines) {
my @remote= split " ", $line;
if(@remote>3 && $remote[0] eq "UPD") {
Log 3, $line;
$remote[1]=~s/_/ /;
my @local = stat($remote[3]);
if($local[7] != $remote[2] || $local[9] < str2time($remote[1])) {
$response .= $remote[0]." ".$remote[3]."\n";
}
}
}
return $response;
}
Es gab gerade ein Update, was beim Farbschema etwas aufgeräumt.
Die meisten Widgets sind nun mit einfachem Extra-CSS schnell konfigurierbar.
Beispiel FTUI in Green oder Blue:
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" />
Auch kann man jetzt die Farben schnell und einfach per CSS Class festlegen.
Beispiel mehrfarbige Switches:
<li data-row="4" data-col="4" data-sizex="3" data-sizey="1">
<header>SWITCH-DEMO</header>
<div class="inline">
<div data-type="switch" data-device="dummy1" data-icon="fa-home" class="blue"></div>
<div data-type="label">blue</div>
</div>
<div class="inline">
<div data-type="switch" data-device="dummy2" data-icon="fa-music" class="green"></div>
<div data-type="label">green</div>
</div>
<div class="inline">
<div data-type="switch" data-device="dummy3" data-icon="fa-sliders" class="ligthblue"></div>
<div data-type="label">ligthblue</div>
</div>
<div class="inline">
<div data-type="switch" data-device="dummy4" data-icon="fa-lightbulb-o" class="orange"></div>
<div data-type="label">orange</div>
</div>
<div class="inline">
<div data-type="switch" data-device="dummy5" data-icon="fa-line-chart" class="red"></div>
<div data-type="label">red</div>
</div>
</li>
Zitat von: danieljo am 16 September 2015, 21:23:30
Ich habe zum FTUI nochmal 4 Fragen.
1. Wie mache ich das, dass die Widgets ihre Position beibehalten? Wenn ich Browser die Seite im Vollbild öffne ist alles ok. Wenn ich aber nur ein halbes Browser Fenster öffne verschieben sich die Widget alle. Möchte das so erreichen das die Anorndung die ich Definiere auch immer Angezeigt wird egal ob es in Browser Fenster passt oder nicht. Muss zwar Scrollen aber das ist egal.
2. gibt es ein Widget um in FHEM definierte "at" anzusteuern. Also sowas ähnliches wie "settime" für einen Wecker. Habe verschiedene Zeitschaltuhren mit "at" erstellt die ich gerne anzeigen möchte.
3. Ich habe mir das Widget "wind_direction" erstellt. Funktioniert soweit auch aber statt der Windrichtung in Textform also "N, W, SW usw" bekomme ich nur ein "-" angezeigt. Obwohl sich der Zeiger jenach windrichtung auch ändert.
4. Ich habe ein Symbol erstellt das jenach zustand die Farbe wechseln soll. Im Prinzip funktioniert das auch. aber ich muss erst die Seite neuladen damit die Farbe angenommen wird.
zu1.) Wenn die Gridster Col/Row und Breite/Höhe stimmen, wird Gridster auch nicht versuchen zu optimieren und Elemente umbauen. Im Beispiel unter "../examples/pagetab/index_main.html" passt alles und es wird nichts verschoben, wenn man das Fenster kleiner macht.
zu2.) Hast du schon das neue widget_datetimepicker gesehen? Auf FHEM Seite dann ein Dummy und die Weckerlogik.
zu3.) kann ich gerade nicht helfen
zu4.) Wie sieht dein Code aus? Wichtig ist, was du unter data-get stehen hast. STATE oder state oder ein anderes Reading? Das Widget "sieht" über Longpoll vermutlich die Änderung nicht. <meta name="longpoll" content="1"> ist aktiviert?
Ich glaube im widget simplechart hat sich ein Fehler eingeschlichen. Die Zeile mit dem refresh ist auskommentiert. Somit zeigt das Widget keine Charts mehr an. Falls das schon wieder behoben ist, habe ich nichts gesagt :)
//base.refresh.apply(this);
Das stimmt so. Ist nach der Optimierung jetzt so besser. Vorher wurde einfach zu oft geladen und refresht. Das sah man im Netzwerkmonitor des Browsers und fhem log. Hier gab einen kurzen Hinweis: http://forum.fhem.de/index.php/topic,34233.msg330221.html#msg330221 (http://forum.fhem.de/index.php/topic,34233.msg330221.html#msg330221)
Man muss jetzt zusätzlich ein Device angeben, das das Update triggert.
<div data-type="simplechart"
data-device="THSensorWZ"
data-logdevice="FileLog_THSensorWZ"
data-columnspec="4:temperature"
data-minvalue="10"
data-maxvalue="30"
data-height="60"
data-width="90"
class="noticks">
</div>
data-get="STATE" habe ich hier weggelassen, weil das intern schon per Default gesetzt ist. Nur wenn man data-get auf ein anderes Reading setzen will, muss das angegeben werden.
Hallo danieljo,
zu 3. - ich hatte das gleiche Problem, habe dann festgestellt das sich in der Index-Datei die Zeile
data-get="wind_condition"
in
data-direction="wind_condition"
geändert hat, jetzt funzt es bei mir wieder.
vg
Edit: zu früh gefreut, erst nach einem händischen Refresh der Seite verschwindet das "-" und die Windrichtung wird korrekt angezeigt.
Zitat von: setstate am 09 September 2015, 00:56:47
Probiere mal eindeutige Dateinamen für alle Files. Also statt index.html und index2.html -> index.html und next.html
Danke für den Tipp, aber es war was anderes. Ich hatte auf jeder Seite
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
...
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
...
usw.
Das funktioniert nicht.
Das gehört nur in die index.html.
Nun gehts.
:)
Ich habe gestern die 99_myUtils um das Updatecheck ergänzt.
sub
controlfile_updatecheck($) {
use Date::Parse;
my $raw = shift;
my $response='';
my @lines = split "\n", $raw;
foreach my $line (@lines) {
my @remote= split " ", $line;
$remote[1]=~s/_/ /;
my @local = stat($remote[3]);
if($local[7] != $remote[2] || $local[9] < str2time($remote[1])) {
$response .= $remote[0]." ".$remote[3]."\n";
}
}
return $response;
####
sub
controlfile_update($) {
my $device = shift;
my $url = InternalVal($device, 'url', '');
my $def = InternalVal($device, 'DEF', '');
fhem("setreading $device available updated");
fhem("setreading $device files -");
fhem("define at_recheck_$device at +00:05:00 modify $device $def");
fhem("update all $url");
}
die fhem.cgf auch entspr. ergänzt.
Der Geschwindigkeitsunterschied ist echt zu merken, danke !
Leider ist das Batterisymbol und das WLAN-Icon verschwunden. Sollte das so? :(
Außerdem erhalte ich folgende Fehlermeldung:
Error messages while initializing FHEM:
configfile: Invalid Expression $val=controlfile_updatecheck($val);$val
Invalid Expression $val=controlfile_updatecheck($val) ne ''?'yes':'no';$val
Invalid Expression $val=controlfile_updatecheck($val);$val
Invalid Expression $val=controlfile_updatecheck($val) ne ''?'yes':'no';$val
Sieht so aus, als gibts da ein SSL-Problem, denn im Logfile steht:
3: UPDATE_WIDGETS: Read callback: request type was Update, no headers, buffer empty,
Error https://raw.githubusercontent.com/nesges/Widgets-for-fhem-tablet-ui/master/controls_widgets-for-fhem-tablet-ui.txt: Can't connect(2) to https://raw.githubusercontent.com:443: SSL connect attempt failed because of handshake problems error:14094410:SSL routines:SSL3_READ_BYTES:sslv3 alert handshake failure SSL connect attempt failed because of handshake problems error:14094410:SSL routines:SSL3_READ_BYTES:sslv3 alert handshake failure
2015.09.19 10:27:57 1: FHEMWEB SSL/HTTPS error:
2015.09.19 10:27:57 1: FHEMWEB SSL/HTTPS error:
In der HttpUtils steht:
$hash->{conn}->blocking(1);
my $sslVersion = AttrVal($hash->{NAME}, "sslVersion",
AttrVal("global", "sslVersion", "SSLv3"));
IO::Socket::SSL->start_SSL($hash->{conn}, {
Timeout => $hash->{timeout},
Hab keinen Ansatz.... :)
Zitat von: setstate am 19 September 2015, 01:02:59
zu1.) Wenn die Gridster Col/Row und Breite/Höhe stimmen, wird Gridster auch nicht versuchen zu optimieren und Elemente umbauen. Im Beispiel unter "../examples/pagetab/index_main.html" passt alles und es wird nichts verschoben, wenn man das Fenster kleiner macht.
zu2.) Hast du schon das neue widget_datetimepicker gesehen? Auf FHEM Seite dann ein Dummy und die Weckerlogik.
zu3.) kann ich gerade nicht helfen
zu4.) Wie sieht dein Code aus? Wichtig ist, was du unter data-get stehen hast. STATE oder state oder ein anderes Reading? Das Widget "sieht" über Longpoll vermutlich die Änderung nicht. <meta name="longpoll" content="1"> ist aktiviert?
Danke für deine Antowrt ich werde mal schauen das ich deine Hinweise umsetze und zu Punkt 4 werde ich den Code noch nachreichen. Aber erstmal ein Update machen hat sich ja wieder einiges geändert. Zu Punkt 3 werde ich auch nochmal testen was da sache ist und mich melden. Vielen Dank erstmal. :)
MFG, Daniel Joachims
Hier mal der code für den von mir besprochene Punkt 4 mit dem nicht slebstständig ändernden Icon.
<li data-row="4" data-col="1" data-sizex="1" data-sizey="2">
<header>Aquarium Thermostat</header>
<div data-type="thermostat"
data-device="Aquarium_Thermostat"
data-get="desired_value"
data-temp="sensor_value"
data-set="desired"
data-min="22"
data-max="28"
data-step="0.1"
class="cell">
</div>
<div data-type="symbol"
data-device="heater"
data-get="state"
data-get-on="on"
data-get-off="!on"
data-icons="fa-arrow-up"
data-on-colors="IndianRed"
data-off-colors="SeaGreen"
class="cell big">
</div>
</li>
Zitat von: danieljo am 19 September 2015, 20:27:48
Hier mal der code für den von mir besprochene Punkt 4 mit dem nicht slebstständig ändernden Icon.
Versuche es mal mit
data-on-color
data-off-color(jeweils ohne "s").
Zitat von: Syntaxterror am 19 September 2015, 13:43:10
Der Geschwindigkeitsunterschied ist echt zu merken, danke !
Leider ist das Batterisymbol und das WLAN-Icon verschwunden. Sollte das so? :(
Vielleicht hab ich in Abwesenheit etwas zu den controlfile-subs überlesen, aber ich sehe weder bei Geschwindigkeit noch bei Icons einen Zusammenhang zu den Funktionen. Bitte erklären! Ansonsten würde ich einen Syntax-Fehler in der fhem.cfg vermuten, der nicht direkt im Zusammehang mit den Funktionen steht.
ZitatAußerdem erhalte ich folgende Fehlermeldung:
Error messages while initializing FHEM:
configfile: Invalid Expression $val=controlfile_updatecheck($val);$val
Invalid Expression $val=controlfile_updatecheck($val) ne ''?'yes':'no';$val
Invalid Expression $val=controlfile_updatecheck($val);$val
Invalid Expression $val=controlfile_updatecheck($val) ne ''?'yes':'no';$val
Auch das klingt nach Syntaxfehler. Bitte einmal den Ausschnitt aus der fhem.cfg posten (Hint: Wenn die Semikolons dort nicht verdoppelt sind, ist das der Fehler)
ZitatSieht so aus, als gibts da ein SSL-Problem, denn im Logfile steht:
[...]Hab keinen Ansatz.... :)
dito ;) Evtl. ein temporärer Fehler? Bzw. erst mal den Rest in Ordnung bringen.
Zitat von: Brockmann am 20 September 2015, 09:50:23
Versuche es mal mit
data-on-color
data-off-color
(jeweils ohne "s").
Hab ich gemacht. Jetzt übernimmt der zumindestens schon mal die angegeben Farbwerte. Aber das, dass Symbol seine "Status" Farbe nach einer Zustandänderung ändert funktioniert immernoch nicht. Ich muss die Seite neu laden damit das Icon von "Rot" nach "Grün" wechselt nach einer Status änderung von "On" nach "Off"
<meta name="longpoll" content="1"> ist aktiviert! Und im Device heater wechselt das reading "state" sofort sein Status. Also ist es anscheinend so das Tablet UI die Zustandsänderung nicht sieht.
ich glaube, eine Änderung bei "state" wird nicht per longpoll verkündet. Probiere mal STATE.
data-get="STATE", oder die ganze Zeile weglassen, der Default ist schon STATE.
Gibt es in Icon mit einer Mülltonne drauf? Bzw. wo findet man die ganzen Symbole?
Übrigens, Super Arbeit!. Bin gerade fleißig am Basteln.
LG
/robin
Zitat von: fh168 am 20 September 2015, 12:12:43
Gibt es in Icon mit einer Mülltonne drauf? Bzw. wo findet man die ganzen Symbole?
Die aus Font Awesome eingebundenen Icons kannst du dir am einfachsten und komfortabelsten unter http://fortawesome.github.io/Font-Awesome/icons/ anschauen. Wenn du den zusätzlichen fhemSVG-Icon-Font eingebunden hast, dann scroll mal auf der Detailseite eines beliebigen Device in FHEMWEB nach ganz unten und klicke "Select Icon".
Im Anhang zwei Demoseiten die alle Icons zeigen. Einfach irgendwo in die eigene FTUI-Installation kopieren und im Browser aufrufen. Die Demos sind automatisch generiert, das Skript dazu habe ich setstate geschickt. Evtl. können die Demos ja einen festen Platz im Examples-Verzeichnis bekommen.
danke an nesges.
Das Updaten funktioniert, keine Fehler mehr im Log. Wäre eine ähnliche Funktion nicht auch für z.B. das Charting-Frontend oder FHEM selber möglich ??
Zitat von: kleinerDrache am 20 September 2015, 15:32:33
Wäre eine ähnliche Funktion nicht auch für z.B. das Charting-Frontend oder FHEM selber möglich ??
Alles was ein Controlfile mit der gleichen Syntax erzeugt kann damit geprüft und wahrscheinlich auch upgedatet werden. Man muss nur den URL in der HTTPMOD-Definition entsprechend anpassen. Für Fhem wäre der richtige URL http://fhem.de/fhemupdate/controls_fhem.txt. Allerdings macht's bei Fhem mMn keinen Sinn den Update-Check zu nutzen, da es ohnehin fast permanent Updates gibt. Da würde ich mir eher den Befehl "update all" an einen Dummy zum klicken binden. Aber was Fhem-Updates angeht bin ich ohnehin eher konservativ: Nur wenn nötig.
Naja FHEM selber war nur ein Beispiel aber z.B. das Charting frontend werde ich mir dann wohl einbinden.
Schade das das nicht mit dem Raspbian auch funktioniert, aber man kann nicht alles haben. ;)
Nochmal danke fürs überarbeiten.
Zitat von: nesges am 20 September 2015, 10:29:13
Vielleicht hab ich in Abwesenheit etwas zu den controlfile-subs überlesen, aber ich sehe weder bei Geschwindigkeit noch bei Icons einen Zusammenhang zu den Funktionen. Bitte erklären! Ansonsten würde ich einen Syntax-Fehler in der fhem.cfg vermuten, der nicht direkt im Zusammehang mit den Funktionen steht.
Auch das klingt nach Syntaxfehler. Bitte einmal den Ausschnitt aus der fhem.cfg posten (Hint: Wenn die Semikolons dort nicht verdoppelt sind, ist das der Fehler)
dito ;) Evtl. ein temporärer Fehler? Bzw. erst mal den Rest in Ordnung bringen.
Hier mal der Auszug auf der fhem.cfg. Die Semikolons sind doppelt.
define UPDATE_FTUI HTTPMOD https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt 14400
attr UPDATE_FTUI alias Fhem Tablet UI
attr UPDATE_FTUI userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_FTUI event-on-change-reading available,files
attr UPDATE_FTUI reading01Name files
attr UPDATE_FTUI reading01Regex (?s)(UPD.*)
attr UPDATE_FTUI reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_FTUI reading02Name available
attr UPDATE_FTUI reading02Regex (?s)(UPD.*)
attr UPDATE_FTUI reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_FTUI room hidden
define UPDATE_WIDGETS HTTPMOD https://raw.githubusercontent.com/nesges/Widgets-for-fhem-tablet-ui/master/controls_widgets-for-fhem-tablet-ui.txt 14400
attr UPDATE_WIDGETS alias Widgets for Fhem Tablet UI
attr UPDATE_WIDGETS userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_WIDGETS event-on-change-reading available,files
attr UPDATE_WIDGETS reading01Name files
attr UPDATE_WIDGETS reading01Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_WIDGETS reading02Name available
attr UPDATE_WIDGETS reading02Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_WIDGETS room hidden
define UPDATES readingsGroup UPDATE_FTUI:available,files UPDATE_WIDGETS:available,files
attr UPDATES valueFormat { ($READING eq 'files' && $VALUE !~ /^-?$/)?'<a href="?cmd={controlfile_update(\'$DEVICE\')}">[Start Update]</a>':$VALUE }
attr UPDATES alias 3d Party Updates
attr UPDATES room Systemin der HttpUtils steht:
HttpUtils_Connect2($)
{
my ($hash) = @_;
if($hash->{protocol} eq "https" && $hash->{conn} && !$hash->{hu_sslAdded}) {
eval "use IO::Socket::SSL";
if($@) {
Log3 $hash, $hash->{loglevel}, $@;
} else {
$hash->{conn}->blocking(1);
my $sslVersion = AttrVal($hash->{NAME}, "sslVersion",
AttrVal("global", "sslVersion", "SSLv3"));
IO::Socket::SSL->start_SSL($hash->{conn}, {
Timeout => $hash->{timeout},
SSL_version => $sslVersion,
%{$hash->{sslargs}}
}) || undef $hash->{conn};
$hash->{hu_sslAdded} = 1 if($hash->{keepalive});
}
}Also ich sehe da keinen Fahler :(
Zitat von: setstate am 20 September 2015, 12:09:10
ich glaube, eine Änderung bei "state" wird nicht per longpoll verkündet. Probiere mal STATE.
data-get="STATE", oder die ganze Zeile weglassen, der Default ist schon STATE.
Ich habs gerade Probiert. "state" durch "STATE" ersetzt aber keine Änderung. Statt des auslesens des dummys habe ich mal direkt das THRESHOLD Modul genommen. Im "state" sowie "STATE" steht on und off drin welches auch brav und sofort geändert wird wenn es die bedingung erfüllt. Also in FHEM ist alles ok. aber Tablet UI mag da nicht mitspielen. Das Icon ändert die Farbe nur nach einem neuladen der Seite.
@danieljo: dann wird es schwierig. Dann könnte es sein, dass in deinem System das LongpollFormat etwas anders als erwartet aussieht. Folgende Schritte müsstest du mal machen zur Spurensuche machen:
- in der index.html: <meta name="debug" content="1"> setzen
- in der fhem-tablet-ui.js die Zeile 336 rein kommentieren: //console.log('#'+line+'#');
- Webconsole öffnen
- Refresh der Seite
- Device Status ändern
- Output posten
Zitat von: setstate am 20 September 2015, 19:04:23
@danieljo: dann wird es schwierig. Dann könnte es sein, dass in deinem System das LongpollFormat etwas anders als erwartet aussieht. Folgende Schritte müsstest du mal machen zur Spurensuche machen:
- in der index.html: <meta name="debug" content="1"> setzen
- in der fhem-tablet-ui.js die Zeile 336 rein kommentieren: //console.log('#'+line+'#');
- Webconsole öffnen
- Refresh der Seite
- Device Status ändern
- Output posten
Hier die ausgabe der WebKonsole:
#2015-09-20 19:24:45 readingsGroup REMOTE_Aquarium_Thermostat Aquarium_Thermostat.desired_value: 20.0 °C# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 RFHEM RemotePI cmd set Aquarium_Thermostat desired 20.0# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat mode: active# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat cmd: wait for next cmd# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat threshold_min: 19.9# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat threshold_max: 20# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat desired_value: 20.0# fhem-tablet-ui.js:336:25
2015-09-20 19:24:45 / Aquarium_Thermostat / desired_value / 20.0 fhem-tablet-ui.js:365:1
thermo dev:Aquarium_Thermostat par:desired_value change:clima.desired jquery.min.js line 2 > eval:236:1
update done for device:Aquarium_Thermostat parameter:desired_value fhem-tablet-ui.js:63:14
#2015-09-20 19:24:45 readingsGroup REMOTE_Aquarium_Thermostat heater.state: <svg class="icon general_aus white" alt="off" title="off" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.0" width="468pt" height="468pt" viewBox="0 0 468 468" id="svg2" inkscape:version="0.48.4 r9939" sodipodi:docname="general_aus.svg"> <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="1858" inkscape:window-height="1057" id="namedview10" showgrid="false" inkscape:zoom="0.4034188" inkscape:cx="930.58836" inkscape:cy="-224.20054" inkscape:window-x="1734" inkscape:window-y="-8" inkscape:window-maximized="1" inkscape:current-layer="svg2" /> <defs id="defs12" /> <metadata id="metadata4"> Created by potrace 1.8, written by Peter Selinger 2001-2007 <rdf:RDF> <cc:Work rdf:about=""> <dc:format>image/svg+xml</dc:format> <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> <dc:title></dc:title> </cc:Work> </rdf:RDF> </metadata> <g transform="matrix(0.189474,0,0,-0.189474,0,468)" id="g6" fill="white" stroke="none"> <path d="M 395,2455 C 244,2422 112,2322 57,2200 5,2083 6,2112 2,1260 0,702 2,446 10,400 43,208 198,52 398,11 c 71,-15 1628,-15 1692,0 174,40 322,190 365,370 22,94 22,1579 0,1683 -21,98 -66,187 -127,252 -61,64 -113,98 -201,128 -61,21 -75,21 -867,23 -640,1 -817,-1 -865,-12 z m 1737,-163 c 74,-36 132,-95 170,-170 l 23,-47 0,-840 0,-840 -28,-57 c -37,-76 -96,-134 -171,-169 l -63,-29 -839,2 -839,3 -50,27 C 273,204 196,285 167,348 l -22,47 0,840 0,840 27,52 c 53,100 128,162 227,189 35,10 236,12 856,11 l 810,-2 67,-33 z" id="path8" /> </g> <g transform="scale(0.91366746,1.0944901)" id="text2986" fill="white" stroke="none"> <path d="m 101.68802,268.25586 42.01942,-109.41468 15.59868,0 44.78091,109.41468 -16.4943,0 -12.76256,-33.13787 -45.75116,0 -12.01621,33.13787 z m 31.57054,-44.93018 37.09352,0 -11.41913,-30.30174 c -3.48302,-9.20488 -6.07036,-16.76787 -7.76203,-22.68899 -1.39323,7.01576 -3.35861,13.98167 -5.89615,20.89775 z" style="" id="path2991" /> <path d="m 287.60341,158.84118 14.47916,0 0,63.21571 c -9e-5,10.99624 -1.24401,19.72851 -3.73174,26.19683 -2.48792,6.46837 -6.97844,11.73012 -13.47159,15.78527 -6.4933,4.05516 -15.01411,6.08274 -25.56243,6.08274 -10.2499,0 -18.63387,-1.76636 -25.15194,-5.29907 -6.51814,-3.53271 -11.17037,-8.64519 -13.95672,-15.33746 -2.78638,-6.69224 -4.17956,-15.83499 -4.17955,-27.42831 l 0,-63.21571 14.47916,0 0,63.14108 c -3e-5,9.50354 0.88315,16.50677 2.64954,21.00971 1.76632,4.50298 4.80147,7.9735 9.10545,10.41156 4.3039,2.43808 9.56565,3.65711 15.78527,3.6571 10.64784,10e-6 18.2357,-2.41318 22.76362,-7.23958 4.52777,-4.82636 6.79169,-14.10595 6.79177,-27.83879 z" style="" id="path2993" /> <path d="m 321.33836,233.10285 13.65818,-1.19416 c 0.64681,5.47325 2.15194,9.96378 4.5154,13.47159 2.36341,3.50786 6.03296,6.34398 11.00864,8.50837 4.97562,2.16442 10.57323,3.24663 16.79284,3.24662 5.52292,1e-5 10.39906,-0.82097 14.62843,-2.46295 4.22924,-1.64195 7.37634,-3.89344 9.44131,-6.75446 2.06482,-2.86097 3.09727,-5.9832 3.09735,-9.36667 -8e-5,-3.43317 -0.99521,-6.431 -2.9854,-8.9935 -1.99034,-2.56242 -5.27427,-4.71439 -9.8518,-6.45591 -2.9357,-1.14436 -9.42892,-2.92315 -19.47969,-5.33639 -10.05086,-2.41314 -17.09141,-4.6895 -21.12166,-6.82909 -5.22446,-2.73655 -9.11791,-6.13243 -11.68035,-10.18766 -2.56248,-4.05508 -3.84371,-8.59537 -3.8437,-13.62085 -10e-6,-5.5229 1.56732,-10.68513 4.702,-15.48673 3.13464,-4.80141 7.71224,-8.44608 13.73281,-10.93401 6.02051,-2.48772 12.71276,-3.73163 20.07677,-3.73174 8.11026,1.1e-4 15.26276,1.30622 21.45752,3.91833 6.19461,2.61232 10.9588,6.45601 14.29257,11.53108 3.3336,5.07526 5.12483,10.82214 5.37371,17.24065 l -13.88208,1.04489 c -0.74643,-6.91608 -3.27157,-12.14051 -7.57544,-15.67332 -4.30401,-3.53262 -10.6604,-5.29897 -19.0692,-5.29907 -8.7572,1e-4 -15.13847,1.60474 -19.14384,4.81394 -4.00543,3.20939 -6.00813,7.07796 -6.0081,11.60572 -3e-5,3.93085 1.41803,7.16502 4.25418,9.70253 2.78634,2.53766 10.06323,5.13743 21.83069,7.79934 11.76737,2.66204 19.84036,4.98816 24.21901,6.97836 6.36876,2.93569 11.07075,6.65499 14.10599,11.15791 3.03505,4.50301 4.55263,9.69013 4.55272,15.56136 -9e-5,5.82155 -1.66694,11.3072 -5.00053,16.45699 -3.33378,5.14981 -8.12284,9.15521 -14.36721,12.01621 -6.24452,2.861 -13.27262,4.2915 -21.08434,4.2915 -9.9016,0 -18.1985,-1.44294 -24.89072,-4.32882 -6.69228,-2.88588 -11.9416,-7.22713 -15.74796,-13.02378 -3.80638,-5.79662 -5.80908,-12.35204 -6.0081,-19.66628 z" style="" id="path2995" /> </g> </svg># fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 RFHEM RemotePI cmd set undefined2 off# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 dummy heater off# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat cmd: cmd1_gt# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat off# fhem-tablet-ui.js:336:25
2015-09-20 19:24:45 / Aquarium_Thermostat / STATE / off fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:STATE fhem-tablet-ui.js:63:14
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat mode: active# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat cmd: wait for next cmd# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat threshold_min: 19# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat threshold_max: 20# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 readingsGroup REMOTE_Aquarium_Thermostat Aquarium_Thermostat.desired_value: 20.0 °C# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 RFHEM RemotePI cmd set Aquarium_Thermostat desired 20.0# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat desired_value: 20.0# fhem-tablet-ui.js:336:25
2015-09-20 19:24:45 / Aquarium_Thermostat / desired_value / 20.0 fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:desired_value fhem-tablet-ui.js:63:14
#2015-09-20 19:24:45 RPI_GPIO undefined2 off# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat cmd: cmd1_gt# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat off# fhem-tablet-ui.js:336:25
2015-09-20 19:24:45 / Aquarium_Thermostat / STATE / off fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:STATE fhem-tablet-ui.js:63:14
#2015-09-20 19:24:45 RPI_GPIO undefined2 off# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:45 THRESHOLD Aquarium_Thermostat desired 20.0# fhem-tablet-ui.js:336:25
2015-09-20 19:24:45 / Aquarium_Thermostat / STATE / desired 20.0 fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:STATE fhem-tablet-ui.js:63:14
#2015-09-20 19:24:47 readingsGroup REMOTE_Aquarium_Thermostat Aquarium_Thermostat.desired_value: 28.5 °C# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:47 RFHEM RemotePI cmd set Aquarium_Thermostat desired 28.5# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:47 THRESHOLD Aquarium_Thermostat mode: active# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:47 THRESHOLD Aquarium_Thermostat cmd: wait for next cmd# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:47 THRESHOLD Aquarium_Thermostat threshold_min: 28.4# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:47 THRESHOLD Aquarium_Thermostat threshold_max: 28.5# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:47 THRESHOLD Aquarium_Thermostat desired_value: 28.5# fhem-tablet-ui.js:336:25
2015-09-20 19:24:47 / Aquarium_Thermostat / desired_value / 28.5 fhem-tablet-ui.js:365:1
thermo dev:Aquarium_Thermostat par:desired_value change:clima.desired jquery.min.js line 2 > eval:236:1
update done for device:Aquarium_Thermostat parameter:desired_value fhem-tablet-ui.js:63:14
#2015-09-20 19:24:48 readingsGroup REMOTE_Aquarium_Thermostat heater.state: <svg class="icon general_an green" alt="on" title="on" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" version="1.0" width="468pt" height="468pt" viewBox="0 0 468 468" id="svg2" inkscape:version="0.48.4 r9939" sodipodi:docname="general_an.svg"> <sodipodi:namedview pagecolor="#ffffff" bordercolor="#666666" borderopacity="1" objecttolerance="10" gridtolerance="10" guidetolerance="10" inkscape:pageopacity="0" inkscape:pageshadow="2" inkscape:window-width="795" inkscape:window-height="480" id="namedview10" showgrid="false" inkscape:zoom="0.4034188" inkscape:cx="787.02331" inkscape:cy="292.5" inkscape:window-x="504" inkscape:window-y="110" inkscape:window-maximized="0" inkscape:current-layer="layer1" /> <defs id="defs12" /> <metadata id="metadata4"> Created by potrace 1.8, written by Peter Selinger 2001-2007 <rdf:RDF> <cc:Work rdf:about=""> <dc:format>image/svg+xml</dc:format> <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage" /> <dc:title></dc:title> </cc:Work> </rdf:RDF> </metadata> <g transform="matrix(0.189474,0,0,-0.189474,0,468)" id="g6" fill="green" stroke="none"> <path d="M 395,2455 C 244,2422 112,2322 57,2200 5,2083 6,2112 2,1260 0,702 2,446 10,400 43,208 198,52 398,11 c 71,-15 1628,-15 1692,0 174,40 322,190 365,370 22,94 22,1579 0,1683 -21,98 -66,187 -127,252 -61,64 -113,98 -201,128 -61,21 -75,21 -867,23 -640,1 -817,-1 -865,-12 z m 1737,-163 c 74,-36 132,-95 170,-170 l 23,-47 0,-840 0,-840 -28,-57 c -37,-76 -96,-134 -171,-169 l -63,-29 -839,2 -839,3 -50,27 C 273,204 196,285 167,348 l -22,47 0,840 0,840 27,52 c 53,100 128,162 227,189 35,10 236,12 856,11 l 810,-2 67,-33 z" id="path8" /> </g> <g transform="scale(0.92809982,1.0774703)" id="text2990" fill="green" stroke="none"> <path d="m 133.53428,276.73193 45.10187,-117.44109 16.74297,0 48.06593,117.44109 -17.70429,0 -13.69879,-35.56879 -49.10736,0 -12.89769,35.56879 z m 33.88648,-48.22615 39.81462,0 -12.25681,-32.52461 c -3.73852,-9.88013 -6.51566,-17.99792 -8.33143,-24.35341 -1.49544,7.53043 -3.605,15.00734 -6.32868,22.43077 z" id="path2988" /> <path d="m 255.86208,276.73193 0,-117.44109 15.94187,0 61.68461,92.20648 0,-92.20648 14.90044,0 0,117.44109 -15.94187,0 -61.68461,-92.28659 0,92.28659 z" id="path2990" /> </g> </svg># fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 RFHEM RemotePI cmd set undefined2 on# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 dummy heater on# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat cmd: cmd2_lt# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat on# fhem-tablet-ui.js:336:25
2015-09-20 19:24:48 / Aquarium_Thermostat / STATE / on fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:STATE fhem-tablet-ui.js:63:14
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat mode: active# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat cmd: wait for next cmd# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat threshold_min: 27.5# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat threshold_max: 28.5# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 readingsGroup REMOTE_Aquarium_Thermostat Aquarium_Thermostat.desired_value: 28.5 °C# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 RFHEM RemotePI cmd set Aquarium_Thermostat desired 28.5# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat desired_value: 28.5# fhem-tablet-ui.js:336:25
2015-09-20 19:24:48 / Aquarium_Thermostat / desired_value / 28.5 fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:desired_value fhem-tablet-ui.js:63:14
#2015-09-20 19:24:48 RPI_GPIO undefined2 on# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat cmd: cmd2_lt# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat on# fhem-tablet-ui.js:336:25
2015-09-20 19:24:48 / Aquarium_Thermostat / STATE / on fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:STATE fhem-tablet-ui.js:63:14
#2015-09-20 19:24:48 RPI_GPIO undefined2 on# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:48 THRESHOLD Aquarium_Thermostat desired 28.5# fhem-tablet-ui.js:336:25
2015-09-20 19:24:48 / Aquarium_Thermostat / STATE / desired 28.5 fhem-tablet-ui.js:365:1
update done for device:Aquarium_Thermostat parameter:STATE fhem-tablet-ui.js:63:14
#2015-09-20 19:24:52 cloneDummy Aquarium_1_Temperatur active# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:52 cloneDummy Aquarium_1_Temperatur T: 24.875# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:52 GPIO4 Wasser_Temperatur T: 24.875# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:52 cloneDummy Aquarium_1_Temperatur active# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:52 cloneDummy Aquarium_1_Temperatur _state: temperature: 24.875# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:52 cloneDummy Aquarium_1_Temperatur temperature: 24.875# fhem-tablet-ui.js:336:25
#2015-09-20 19:24:52 GPIO4 Wasser_Temperatur temperature: 24.875#
@Nesges Müll-Icon gefunden, danke!
Hallo
seit dem ich gestern ein Update durchgeführt habe funktionieren circlemenu und popup auf meinem Tablet nicht mehr?
Am PC ist alles ok egal welcher Browser, hat noch jemand dieses Problem?
Gruß Rolf
@harry66: stimmt, da passte was nicht. Ist jetzt wieder repariert.
Zitat von: setstate am 22 September 2015, 00:27:32
@harry66: stimmt, da passte was nicht. Ist jetzt wieder repariert.
Getestet geht wieder :D danke
@nesges hat sich schon was ergeben Bezüglich meines Problems mit dem nicht automatisch änderndem Symbol?
Hallo zusammen,
erst Mal dickes Lob an dieses Frontend, ich finde es echt klasse.
Ich hab direkt eine Frage und zwar möchte ich das mein LED Streifen mit LD382 verschieden schalten. Dazu habe ich das Modul WIFILIGHT installiert.
Ein einfachen Schalter und Colorpicker habe ich schon gefunden:
<li data-row="2" data-col="2" data-sizex="2" data-sizey="3">
<header>Kinderzimmer</header>
<div class="cell left">
<div data-type="switch" data-device="LED_KZi" class="cell" ></div>
<div data-type="label" class="cell">Licht</div>
</div>
<div class="cell right">
<div data-type="volume" data-device='LED_KZi'
data-min='0' data-max='360'
data-tickstep='4'
data-get='RGB'
data-set='RGB'
class="cell small hue-tick rgb" >
</div>
<div data-type="label" class="cell">Farbwert</div>
<div data-type="volume" data-device='LED_KZi'
data-min='0' data-max='100'
data-tickstep='4'
data-get='dim'
data-set='dim'
class="cell small dim-tick" >
</div>
<div data-type="label" class="cell">Helligkeit</div>
</div>
</li>
Was mir jetzt noch fehlt ist ein Schalter mit dem ich den Sonnenaufgang bzw. Sonnenuntergang auslösen kann, dazu müsste man nur eine set-Befehlskette ausführen, Bsp:
set meineLed HSV 60,0,100; set meineLed HSV 60,70,100 60 q; set meineLed HSV 0,50,80 360 q; set meineLed HSV 200,50,50 600 q; set meineLed HSV 240,100,20 600 q; set meineLed HSV 240,100,0 900 q
Kann ich das in Tablet UI einfach umsetzen? und wenn ja wie?
Ich hoffe ihr könnt mir weiterhelfen!
Vielen Dank und viele Grüße!
Zitat von: danieljo am 19 September 2015, 20:27:48
data-on-colors="IndianRed"
data-off-colors="SeaGreen"
data-on-colors erwartet ein Array, data-off-colors gibt's gar nicht. Ich nehme an, du meinst:
data-on-color="IndianRed"
data-off-color="SeaGreen"Deine Fehlerbeschreibung
Zitat4. Ich habe ein Symbol erstellt das jenach zustand die Farbe wechseln soll. Im Prinzip funktioniert das auch. aber ich muss erst die Seite neuladen damit die Farbe angenommen wird.
klingt allerdings eher nach FAQ 2: Das UI zeigt Statusänderungen gar nicht an (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an)
Zitat von: hankman am 22 September 2015, 19:14:36
Was mir jetzt noch fehlt ist ein Schalter mit dem ich den Sonnenaufgang bzw. Sonnenuntergang auslösen kann, dazu müsste man nur eine set-Befehlskette ausführen, Bsp:
set meineLed HSV 60,0,100; set meineLed HSV 60,70,100 60 q; set meineLed HSV 0,50,80 360 q; set meineLed HSV 200,50,50 600 q; set meineLed HSV 240,100,20 600 q; set meineLed HSV 240,100,0 900 q
Kann ich das in Tablet UI einfach umsetzen? und wenn ja wie?
Das will ich auch können: früh den Sonnenaufgang anschalten ;)
Kennst du schon https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/button (https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/button) ??
@setstate
Zitat von: setstate am 22 September 2015, 00:27:32
@harry66: stimmt, da passte was nicht. Ist jetzt wieder repariert.
Circlemenu funktioniert popup geht leider immer noch nicht auf dem Tablet.
Das habe ich allerdings neu eingebaut und weis nicht ob es auf dem Tablet schon mal funktioniert hat. Auf dem PC gehts??
Gruß Rolfkommando zurück Fehler muss bei mir liegen hab gerade ein popup-Widget aus meiner Mobil-UI benutz das geht ???
Hallo Gemeinde,
beim Schmökern in diesem kleinen Thread ist mir was aufgefallen:
http://forum.fhem.de/index.php/topic,34233.msg310058.html#msg310058
Wie bekommt man die rot-unterlegten Zahlen an die Mülltonnen?
LG
/robin
ist hier beschrieben: http://forum.fhem.de/index.php/topic,34233.msg296730.html#msg296730
Zitat von: fh168 am 22 September 2015, 21:09:53
Wie bekommt man die rot-unterlegten Zahlen an die Mülltonnen?
LG
/robin
Zitat von: nesges am 22 September 2015, 19:26:03
data-on-colors erwartet ein Array, data-off-colors gibt's gar nicht. Ich nehme an, du meinst:
data-on-color="IndianRed"
data-off-color="SeaGreen"
Deine Fehlerbeschreibung
klingt allerdings eher nach FAQ 2: Das UI zeigt Statusänderungen gar nicht an (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Das_UI_zeigt_Status.C3.A4nderungen_gar_nicht_an)
die FAQ hatte ich bereits gefunden konnte das Problem damit aber nicht lösen!
Im Event Monitor sehe ich folgendes:
2015-09-22 22:41:49 THRESHOLD Aquarium_Thermostat on
2015-09-22 22:42:15 THRESHOLD Aquarium_Thermostat off
Das mit den Farbangaben habe ich bereits erfolgreich geändert das war mein Fehler und das icon wird jetzt in den Richtigen Farben angezeigt. Mit den variablen "on" & "off" erkennt Tablet UI auch din Statusänderung. Dazu muss ich aber die Seite neuladen auch wenn 30sekunden warte oder auch ne ganze Stunde passiert da von selbst nix. Erst nach neuladen der Seite. longpoll ist ebenfalls aktiviert.
@danieljo:
Du hast jetzt etwas das da stehen?
<div data-type="symbol"
data-device="Aquarium_Thermostat"
.
.
Oder steht da noch data-device="heater" ?
Evtl. noch mal den ganzen Codeteil des Devices posten, dann muss man weniger raten.
Hier nochmal der Code. Es geht sich um das Device "Aquarium_Thermostat" Der dummy enthielt die gleiche Information "on" "off" weil ich davon ausging das ein Dummy nicht funktioniert.
Also hier nochmal der aktuelle Code:
<div data-type="symbol"
data-device="Aquarium_Thermostat"
data-get="state"
data-get-on="on"
data-get-off="off"
data-icons="fa-arrow-up"
data-on-color="IndianRed"
data-off-color="SeaGreen"
class="big">
</div>
Und wie schon geschrieben sind das die Event die ohne Verzögerung bei einer Änderung erscheinen.
2015-09-22 22:41:49 THRESHOLD Aquarium_Thermostat on
2015-09-22 22:42:15 THRESHOLD Aquarium_Thermostat off
Du hast data-get="state" notiert, aber dafür gibt es kein Event in deinem Eventlog. Default für data-get ist STATE, und das wird als Standardevent interpretiert. -> einfach data-get weglassen.
Wollte ich auch gerade schreiben: ;D
data-get="state"
weglassen
@nesges @setstate : Ich habe jetzt date-get="state" weggelassen. Aber ein Erfolg kann ich damit nicht verzeichnen.
@setstate
Vielen Danke, der Tipp mit dem Button hat mir super geholfen.
zur Vollständigkeit hier mein funktionierender Code:
<div data-type="button" data-fhem-cmd="set+LED_KZi+HSV+60%2C0%2C100+%3B+set+LED_KZi+HSV+240%2C100%2C0+40+q"
data-icon="fa-sun-o"
>
</div>
<div data-type="label" class="cell">Sonnenuntergang</div>
<div data-type="button" data-fhem-cmd="set+LED_KZi+HSV+240%2C100%2C0++%3B+set+LED_KZi+HSV+60%2C0%2C100+40+q"
data-icon="fa-sun-o"
>
</div>
<div data-type="label" class="cell">Sonnenaufgang</div>
Vielen Dank für die schnelle Hilfe.
Zitat von: danieljo am 23 September 2015, 16:07:13
@nesges @setstate : Ich habe jetzt date-get="state" weggelassen. Aber ein Erfolg kann ich damit nicht verzeichnen.
:-\ Dann weiß ich auch nicht mehr weiter (mit Ferndiagnose)
Ich habe den Code bei mir mit einem Dummy getestet -> geht.
Es war zwar noch data-icons (Array) und nur ein String statt eines Array angegegeben, weshalb dann auch nur das Defalt-Icon 'Fenster' angezeigt wurde, aber es schaltete um.
Funktionierender Code in Dual State Notation:
<div data-type="symbol"
data-device="Aquarium_Thermostat"
data-get-on="on"
data-get-off="off"
data-icon="fa-arrow-up"
data-on-color="IndianRed"
data-off-color="SeaGreen"
class="big">
</div>
In aktueller Multi State Notation (Update von heute) würde es auch so funktionieren:
<div data-type="symbol"
data-device="Aquarium_Thermostat"
data-states='["on","off"]'
data-icons='["fa-arrow-up","fa-arrow-down"]'
data-colors='["IndianRed","SeaGreen"]'
class="big">
</div>
Klappen andere Symbol und Switch-Widgets?
Zitat von: setstate am 23 September 2015, 19:17:38
<div data-type="symbol"
data-device="Aquarium_Thermostat"
data-states='["on","off"]'
data-icons='["fa-arrow-up","fa-arrow-down"]'
data-colors='["IndianRed","SeaGreen"]'
class="big">
</div>
Klappen andere Symbol und Switch-Widgets?
Mit diesem Code klappt es nun endlich. Warum auch immer aber es klappt. Andere Sachen wie Switches gehen tadellos auch readings aus Temperatursensoren etc. Wind_Direction geht ja auch soweit ohne Probleme.
Das FHEM Tablet UI gefällt mir sehr gut und ich versuche mir gerade eine für mich passende Oberfläche zusammenzubauen.
Bei einer Sache komme ich nicht weiter:
Ich möchte ein Menü in dem mir durch eine andere Farbe des aktuell gedrückten Buttons angezeigt wird auf welcher Seite ich mich befinde. Im Prinzip so wie in diesem Userdemo zu sehen: https://github.com/ovibox/fhem-ftui-user-demos/blob/master/user-demos/Risiko/screenshots/wetter.png (https://github.com/ovibox/fhem-ftui-user-demos/blob/master/user-demos/Risiko/screenshots/wetter.png)
Leider bekomme ich es so nicht hin, da "pagetab" entweder gar nicht oder anders funktioniert als gewollt (es wird nur der Teil hinter "/url/index.html#" geändert und es findet kein richtiger "Seitenwechsel" statt), wenn ich von "famultibutton" auf "pagetab" ändere.
<div style="font-size:30px; color:rgb(96, 0, 0);" data-url="living.html"
data-type="famultibutton"
data-color="#aa6900"
data-icon="fa-group"
class="cell small"></div>
Mit den Infos von http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Beispiel_pagetab (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Beispiel_pagetab) komme ich nicht weiter.
Ich bin euch für Tipps zum Widget "Pagetab" daher sehr dankbar. Falls das auch mit anderen Widgets (z.B. famultibutton) funktioniert, mit welchen?
Bei Nutzung von "famultibutton" erscheint der gefärbte Button, den ich haben will - aber leider nur während des Klickens...
Hallo matrois,
hast du dir auch die HTMLs der User-Demos angesehen, die pagetab benutzen?
https://github.com/ovibox/fhem-ftui-user-demos/tree/master/user-demos/Risiko/html (https://github.com/ovibox/fhem-ftui-user-demos/tree/master/user-demos/Risiko/html)
Von dort nimmst du index.html, menu.html und eins, zwei Unterseiten.
Die index.html 'zieht' nur das menu mit den pagetab Knöpfen, der erste wird angewählt (meist main.html).
Das Drücken auf ein Pagetab lädt dann die entsprechende Seite nach, diese haben aber alle wieder ein Abschnitt für die menu.html
<li data-row="1" data-col="1" data-sizex="1" data-sizey="6" data-template="menu.html"></li>
Ein Pagetab mit farbigen Hintergrund bei angewähltem Zustand sieht so aus:
<div data-type="pagetab" data-url="main.html"
data-icon="fa-home"
data-on-background-color="#CC7A00"
class="cell big"></div>
famultibutton nimmt man nicht direkt, es ist nur die Basisklasse für andere Widget, wie Switch, Symbol, Pagetab usw.
Zuerst mal vielen Dank für das rundum gelungene Frontend!!!
Als kompletter Neuling hätte ich zwei Fragen:
1.) Was muss man beim Dimmer Widget hinzufügen, damit der Balken auf den aktuellen, "physikalischen" Dimmer-Wert springt?
2.) Warum updatet das UI manchmal sofort und manchmal erst nach 1 Minute?
LG & Danke
zu1.) man muss dafür einen Readingnamen per data-dim angeben
<div data-type="dimmer" data-device="HUEDevice1"
data-get="onoff"
data-get-on="1" data-get-off="0"
data-set=""
data-set-on="on" data-set-off="off"
data-dim="pct"></div>
Danke setstate!
Funktioniert jetzt wunderbar ;)
Neu: Im CSS gibt es jetzt ein paar col-*-* Klassen, mit denen man die Positionierung der Widgets einfacher gestalten kann.
Mit class="container" entsteht einen neue Box oder eine neue Reihe, mit class="col-1-3" teilt man die Reihe in ein 1/3 (33,3%) Abschnitt. Weitere Column Unterteilungen sind col-1-3,col-2-3,col-1-2,col-1-4,col-1-8,col-1-5,col-2-5,col-3-5,col-4-5.
Am besten sieht man das an einem Beispiel:
<li data-row="1" data-col="4" data-sizex="5" data-sizey="3">
<header>EXAMPLE3</header>
<div class="container top-space">
<div class="col-1-2">
<div class="container top-space">
<div class="col-1-3">
<div data-type="switch" data-device="Switch1" data-icon="fa-music"></div>
<div data-type="label" class="">Station1</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Switch2" data-icon="fa-music"></div>
<div data-type="label" class="">Station2</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Switch3" data-icon="fa-music"></div>
<div data-type="label" class="">Station3</div>
</div>
</div>
<div class="container top-space">
<div class="col-1-2">
<div data-type="symbol" data-device="Switch1" data-icon="fa-battery-4"></div>
<div data-type="label" class="">Value1</div>
</div>
<div class="col-1-2">
<div data-type="symbol" data-device="Switch1" data-icon="fa-battery-4"></div>
<div data-type="label" class="">Value2</div>
</div>
</div>
</div>
<div class="col-1-2">
<div data-type="volume" data-device='Volume1' class="" ></div>
</div>
</div>
</li>
Hier wird auf oberster Ebene der Platz in zwei 50% Spalten eingeteilt -> 2mal <div class="col-1-2">. Die linken 50% werden dann wiederum in zwei Reihen unterteilt mit etwas Abstand nach oben -> 2mal <div class="container top-space">. Die erste Reihe wird dann in drei Spalten unterteilt -> 3mal <div class="col-1-3"> und die zweite Reihe in 2 Spalten -> 2mal <div class="col-1-2">
Zitat von: setstate am 24 September 2015, 23:54:33
zu1.) man muss dafür einen Readingnamen per data-dim angeben
<div data-type="dimmer" data-device="HUEDevice1"
data-get="onoff"
data-get-on="1" data-get-off="0"
data-set=""
data-set-on="on" data-set-off="off"
data-dim="pct"></div>
Ein Problem hab ich noch...
Wie bekommich es hin, dass der runde Button gelb wird wenn irgendein Dim-Wert grüßer 0 oder "on" im status steht bzw. grau wird wenn 0 oder "off" drin steht?
Dann muss man die erlaubten Werte per RegEx angeben:
data-get-on="[0-9]{1,3}|on"
data-get-off="off"
Wenn statt bei "off" bei 0 ausgeschaltet signalisiert werden soll, muss für data-get-off auch ein RegEx her und bei data-get-on ausgeklammert werden.
Zitat von: setstate am 25 September 2015, 01:42:21
Neu: Im CSS gibt es jetzt ein paar col-*-* Klassen, mit denen man die Positionierung der Widgets einfacher gestalten kann.
...
Sieht sehr gut aus, vielen Dank!
Das hilft mir auf jeden Fall weiter, denn ich habe in den letzten Tagen damit rum gespielt und versucht Elemente innerhalb eines Widgets passgenau zu positionieren.
Jetzt brauch ich meine .top-space-17px usw. nicht mehr ;)
Ich habe in den letzten Tagen mit webkitSpeechRecognition (http://shapeshed.com/html5-speech-recognition-api/) gespielt und aktueller Stand ist, dass ich eine Spracherkennung im Browser laufen habe, die permanent zuhört und wenn bestimmte Schlagwörte fallen reagiert.
Das ganze läuft im Moment auf einer eigenständigen Seite und das "permanent Zuhören" hört irgendwann auf, da muss ich noch mit rum spielen.
Der Browser muss webkitSpeechRecognition unterstützen, z.B. Chrome und wenn die Seite nicht unter https läuft, merkt sich der Browser nicht, dass man den Zugriff auf das Mikrofon zugelassen hat (man muss es also bei jeden Neuladen der Seite freigeben).
Z.B. funktioniert "Liebstes Smarthome, schalt mal bitte das Licht im Wohnzimmer an" sehr gut. Die Schlagwörter sind hier "Licht", "Wohnzimmer" und "an". Genau so würde funktionieren: "Yo, mach sofort das Licht im Wohnzimmer an" ;)
Wäre sowas als eigenes js-Modul/Widget für die Tablet-UI interessant? Das frage ich mich vor allem wegen der oben genannten Einschränkungen.
Im Moment ist das sehr spezifisch für meinen Fall, aber das kann man dann bestimmt verallgemeinern.
Zitat von: setstate am 24 September 2015, 19:17:14
Hallo matrois,
hast du dir auch die HTMLs der User-Demos angesehen, die pagetab benutzen?
https://github.com/ovibox/fhem-ftui-user-demos/tree/master/user-demos/Risiko/html (https://github.com/ovibox/fhem-ftui-user-demos/tree/master/user-demos/Risiko/html)
Danke für den Tipp. Bei Nutzung der Demovorlagen funktioniert Pagetab. Leider ist dann der "echte Seitewechsel" weg (z.B. habe ich keine Möglichkeit gefunden den Seitentitel oder andere Metadaten zu ändern, weil meines Wissens nach ständig die Seite index.html aktiv bleibt). Das scheint wahrscheinlich auch so gewollt, ist aber nicht die Lösung nach der ich suche. Daher suche ich immer noch nach einer Möglichkeit z.B. über CSS die Icons von Buttons einzufärben.
Diese Lösung (ohne CSS) habe ich bislang gefunden:
Die Datei inc_home.html wird über
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="inc_homebutton.html"></li>in der index.html eingebunden. Die Datei inc_homebutton.html enthält:
header>START</header>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-url="index.html"
data-type="button"
data-color="#aa6900"
data-icon="fa-home"
id="start"
class="cell small"></div>Wenn ich die folgenden Attribute hinzufüge kann ich Farbe und Hintergrundfarbe der Icons ändern:
data-on-color="#ffffff"
data-on-background-color="#000000" Diese Lösung ist für einen einzelnen Button OK, aber ich möchte, dass mir ein ganzes Menü durch Farbänderung anzeigt auf welcher Seite ich mich gerade befinde. Bei einem Menü wäre diese Lösung nur praktikabel (ohne für jeden Menüpunkt eine eigene Menüdatei zu erstellen), wenn ich die Buttons z.B. über CSS "ansprechen" könnte.
Es handelt sich um ein "<i>" Element innerhalb eines "<div> Elementes. Das <div> Element kann ich per ID benennen (s. Beispiel oben #start). Wie kann ich die Attribute "data-on-color" und "data-on-background-color" an untergeordnete Elemente weitergeben?
Hat jemand einen Tipp für mich?
Thema URL Button: sollte mit einem Zweizeiler im Button Widget machbar sein, das dieser auf aktiv geht, wenn die hinterlegte URL aktiv ist und alle anderen im gleichen Div Verbund gehen auf OFF. Das geht einfach über den Jquery Selektor. Schaue ich mir heute Abend mal an.
Thema Spracherkennung: was ist hiermit? http://www.fhemwiki.de/wiki/Homebridge_einrichten
Zitat von: setstate am 25 September 2015, 11:50:48
Thema Spracherkennung: was ist hiermit? http://www.fhemwiki.de/wiki/Homebridge_einrichten
Klingt nach iOS/Siri-only, oder?
Zitat von: ChrisK am 25 September 2015, 11:53:50
Klingt nach iOS/Siri-only, oder?
Ja genau, nur Siri.
Das Webviewcontrol für FHEM gibt es für Android, das hat Spracherkennung auch schon mit drin.
Ansonsten werde ich da nicht viel Zeit investieren, da ich eher der "Klick" Typ bin. Aber ich denke, da gibt es einige, die da was passendes fürs FTUI zaubern können.
Zitat von: setstate am 25 September 2015, 12:02:44
Das Webviewcontrol für FHEM gibt es für Android, das hat Spracherkennung auch schon mit drin.
Genau das klappt bei mir nicht, deswegen bastel ich an einer Alternative.
Zitat von: setstate am 25 September 2015, 12:02:44
Ansonsten werde ich da nicht viel Zeit investieren, da ich eher der "Klick" Typ bin. Aber ich denke, da gibt es einige, die da was passendes fürs FTUI zaubern können.
Sorry, ist wohl falsch rüber gekommen. Ich würde schon die js-Datei entwickeln, die in der FTUI eingebunden werden kann.
Die Frage ist nur, ob es von allgemeinem Interesse ist. Oder ob es reicht, wenn ich es nur für mich einbinde ;)
Hallo,
hab gerade versucht das update zu machen
2015.09.25 13:20:07 1: UPD www/tablet/css/fhem-blue-ui.css
2015.09.25 13:20:08 1: UPD www/tablet/css/fhem-green-ui.css
2015.09.25 13:20:08 1: UPD www/tablet/css/fhem-mobil-ui.css
2015.09.25 13:20:08 1: UPD www/tablet/css/fhem-tablet-ui.css
2015.09.25 13:20:08 1: Got 10957 bytes for www/tablet/css/fhem-tablet-ui.css, not 10216 as expected,
2015.09.25 13:20:08 1: aborting.
das kommt dabei raus.
Ist da evtl. die Dateigröße in der https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt falsch angegeben?
hat noch jemand die Meldung im Logfile?
Danke
Ups sorry, das Controlfile aktualisiere ich heute Abend.
@setstate
Der Test aus "Example3",Post #2500 produziert 6 Symbole zentriert untereinander untereinander. wo liegt mein Fehler
Zitat von: bert am 25 September 2015, 15:01:22
@setstate
Der Test aus "Example3",Post #2500 produziert 6 Symbole zentriert untereinander untereinander. wo liegt mein Fehler
Dir fehlt das Update der ftui.xxx.xxx.css die gibt es erst heute abend, laut setstate.
Gesendet von meinem GT-I9300 mit Tapatalk
Homestatus...nur kleiner
Ich würde den Homestatus integrieren, aber das Homestatus Widget ist mir zu gross.
Würde gerne stattdessen das Circlemenu Widget verwenden wollen. Hier kann ich aber nicht den jeweils gewählten / aktiven Status im mittleren ICON anzeigen lassen, oder?
Der Multistatebutton scheidet für mich aus, weil hier beim "Durchklicken" der Status gesetzt wird und hier hätte ich ein wenig Bedenken, wenn der Status beim "Durchklicken" auf Holiday / Night gesetzt wird und die Alarmanlage zwischenzeitlich kurz scharf geschaltet wird.
Andere Vorschläge? :-) Dankeschön!
Hallo
Eine kleine Frage zum Label Widget.....
Ich habe lasse mir mit Label mehrere Werte einblenden.
Die Werte würde ich gerne Farblich kennzeichen - eigentlich recht einfach ABER.....
Wert 1 als Referenz
Wert 2 grün wenn identisch zu Wert 1
Wert 2 rot wenn ungleich zu Wert 1
Es soll aber der richtige Wert angezeigt werde - also nicht die Differenz.
Hoffe es halbwegs verständlich erklärt zu haben.......
stenny
Zitat von: Raven am 25 September 2015, 16:23:29
Homestatus...nur kleiner
Ich würde den Homestatus integrieren, aber das Homestatus Widget ist mir zu gross.
Würde gerne stattdessen das Circlemenu Widget verwenden wollen. Hier kann ich aber nicht den jeweils gewählten / aktiven Status im mittleren ICON anzeigen lassen, oder?
Der Multistatebutton scheidet für mich aus, weil hier beim "Durchklicken" der Status gesetzt wird und hier hätte ich ein wenig Bedenken, wenn der Status beim "Durchklicken" auf Holiday / Night gesetzt wird und die Alarmanlage zwischenzeitlich kurz scharf geschaltet wird.
Andere Vorschläge? :-) Dankeschön!
1. Homestatus Widget kleiner machen, mit data-width="160" data-height="160"
2. Circlemenu mit einen anderen Starter-Widget bauen, was den Status eines Readings farblich oder per Icon symbolisiert. Symbol oder Switch mit class="readonly" o.ä. wären möglich
<div data-type="symbol"
data-device="dummy1"
data-states='["on","off"]'
data-icons='["fa-arrow-up","fa-arrow-down"]'
data-colors='["IndianRed","SeaGreen"]'
class="big">
</div>3. Einen Gruppe von Switches (evtl. eckig), der aktuell gewählte ist farbig.
<li data-row="1" data-col="9" data-sizex="4" data-sizey="3">
<header>EXAMPLE4</header>
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="Wert1" data-get-off="!on"
data-set-off="" class="green"
data-icon="fa-home" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Home</div>
</div>
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="Wert2" data-get-off="!on"
data-set-off="" class="blue"
data-icon="fa-bed" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Night</div>
</div>
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="Wert3" data-get-off="!on"
data-set-off="" class="orange"
data-icon="fa-car" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Away</div>
</div>
<div>
<div data-type="switch" data-device="dummy1"
data-get-on="Wert4" data-get-off="!on"
data-set-off="" class="red"
data-icon="fa-suitcase" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Holiday</div>
</div>
</li>
Bitteschön ;-)
Zitat von: stenny73 am 25 September 2015, 17:16:39
Die Werte würde ich gerne Farblich kennzeichen - eigentlich recht einfach ABER.....
Wert 1 als Referenz
Wert 2 grün wenn identisch zu Wert 1
Wert 2 rot wenn ungleich zu Wert 1
Es soll aber der richtige Wert angezeigt werde - also nicht die Differenz.
Ist Wert1 fest, also im HTML hinterlegbar, oder kommt der aus einem Reading?
Feste Wert könnte per RegEx funktionieren.
Vergleiche von dynamischen Werten würde ich per Dummy im FHEM machen und dann mit data-limits-get drauf verweisen. Das kann dann auch ein anderes Device sein, als das, woher das Label seinen Wert bezieht.
<div data-type="label"
data-device="OutTemp"
data-limits='[-73,10,23]'
data-limits-get="Dummy1:Vergleich"
data-limits='[0,1]'
data-colors='["#6699FF","#AA6900"]' class="cell big">
</div>
Im data-limits
Alle Werte die ich dazu nutze sind readings, von von verschiedenen Geräten.
Super.... Funktioniert
Hallo noch mal ;)
folgender code zeigt plötzlich(nach update) keine werte (Rufnummer oder Namen) mehr an? Die symbole für die Rufrichtung werden noch angezeigt. Die Readings sind auch vorhanden.
<header>ANRUFE</header>
<table border="0px" width="100%" class="top-space">
<tr >
<td class="RandUnten">
<div type="label" device="myTM" data-get="C0" class=""></div>
<div type="label" device="myTM" data-get="D0" class=""></div>
</td>
<td class="RandUnten">
<div type="label" device="myTM" data-get="B0" class=""></div>
</td>
<td class="RandUnten"><div type="label" device="myTM" data-get="E0" class=""></div></td>
<td class="RandUnten">
<div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-phone","fa-phone","fa-phone","fa-phone"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
></div>
</div>
<div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-left","fa-arrow-circle-right"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
>
</div>
</td>
</tr>
<tr>
Gruß Rolf
Zitat von: harry66 am 25 September 2015, 23:15:43
Hallo noch mal ;)
folgender code zeigt plötzlich(nach update) keine werte (Rufnummer oder Namen) mehr an? Die symbole für die Rufrichtung werden noch angezeigt. Die Readings sind auch vorhanden.
<header>ANRUFE</header>
<table border="0px" width="100%" class="top-space">
<tr >
<td class="RandUnten">
<div type="label" device="myTM" data-get="C0" class=""></div>
<div type="label" device="myTM" data-get="D0" class=""></div>
</td>
<td class="RandUnten">
<div type="label" device="myTM" data-get="B0" class=""></div>
</td>
<td class="RandUnten"><div type="label" device="myTM" data-get="E0" class=""></div></td>
<td class="RandUnten">
<div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-phone","fa-phone","fa-phone","fa-phone"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
></div>
</div>
<div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-left","fa-arrow-circle-right"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
>
</div>
</td>
</tr>
<tr>
Gruß Rolf
Hallo Rolf,
hatte nach dem heutigen Update das gleiche Problem. Mach mal aus "type" ein "data-type" und aus "device" ein "data-device" - dann müsste es wieder klappen.
Gruß,
André
Danke André, das wars :)
Gibt es die Möglichkeit einen reread zu machen, bzw. den Cache zu löschen.
Beim Aufruf von FTUI meldet mir ein Icon den Zustand "an" der tatsächliche Status ist aber "aus" (zigmal kontrolliert). Nach ein /ausschalten ist wieder alles normal. Wechsle ich jetzt in einen anderen Menupunkt und dann wieder zurück ist die Meldung wieder "an". Am Status des Aktors hat zwischenzeitlich nichts geändert.
Gruß Bert
Hallo Bert,
nur bei einem Symbol/Schalter? Die anderen aktualisieren sofort?
Poste bitte mal den Teil, der nicht funktioniert, vielleicht sehen wir was.
Nicht nur einer, heute ist es der FSR in meinem Zimmer, gestern war es der Esszimmer-Schalter.
<div class="top-space">
<div data-type="switch" data-device="FSR_61" data-icon="oa-it_pc" data-get-on='B0' data-get-off='BI' data-set-on='B0' data-set-off='BI' class="cell"></div>
<div data-type="label" class="darker">FSR_61</div>
</div>
<div class="right">
<div class="">
<div data-type="switch" data-device="Kueche_Essen_Lampe" data-get-on='B0' data-get-off='BI' data-set-on='B0' data-set-off='BI' class="small"></div>
<div data-type="label" class="darker">Essen</div>
</div>
Ich denke nicht, dass es am Code liegt, der Status im Fhem ist konstant "BI" und auf einem Laptop, der zur Kontrolle des Layout´s mitläuft (ebenfall mit Firefox), wird es auch richtig angezeigt.
Ich hatte solche Erfahrungen schon mit dem MS-Explorer, Chrome und mit Safari gemacht, seit ich aber, vor ein paar Monaten auf Firefox gewechselt bin ist das nicht mehr aufgetreten.
Gruß Bert
Zitat von: schnibberle am 26 März 2015, 21:22:10
Gibts ne Möglichkeit den HUE Wert in RGB zu bekommen ?
Möchte das für WifiLight nutzen.
Schließe mich hier mal. Hat jemand schon eine Lösung um mit diesem Volume-Wiget im HUE Modus ein Wifilight Device zu steuern. Das Wiflight Device wird mittels "set LD382 HSV 240,100,100" wobei die 240 für die Farbe stehen. Somit müssten man nur noch das ",100,100" anhängen.
EDIT:
Ich habs über die google Suche gefunden mittels RGB geht es nun. Was mich daran stört ist das dann die Helligkeit immer wieder auf 100% gesetzt wird. Könnte man nicht die Helligkeit auslesen um diese dann beim Farbänderung beizubehalten?
:) :) :) Danke Danke! Träume werden wahr.
Dein Frontend ist wirklich der Hammer. Ich hab Option 2 genommen. Wahnsinn diese Flexibiltät.
Zitat von: setstate am 25 September 2015, 19:57:40
1. Homestatus Widget kleiner machen, mit data-width="160" data-height="160"
2. Circlemenu mit einen anderen Starter-Widget bauen, was den Status eines Readings farblich oder per Icon symbolisiert. Symbol oder Switch mit class="readonly" o.ä. wären möglich
3. Einen Gruppe von Switches (evtl. eckig), der aktuell gewählte ist farbig.
Bitteschön ;-)
Beim Einsatz vom Label-Widget treten bei mir sporadische Probleme auf.
Die Werte, die ich darstellen möchte sind Temperatur und Luftfeuchtes eines Homematic-Thermostats. In der Regel werden sie auch korrekt angezeigt, nur ab und zu werden Werte ausgespuckt, die mittels Addlog (http://www.fhemwiki.de/wiki/Plot-Abriss_vermeiden (http://www.fhemwiki.de/wiki/Plot-Abriss_vermeiden)) in das zum Thermostat zugehörige Logfile eingetragen werden, siehe Screenshots.
Demnach holt sich das Widget den aktuellen Temperaturwert aus dem Logfile? Oder habe ich da etwas verkonfiguriert? Die Widget-Definition sieht so aus:
<div data-type="label" data-device="wz.thermostat" data-get="measured-temp" data-limits='[-73,16,25]' data-colors='["#6699FF","#aa6900","#FF0000"]' data-unit="%B0C%0A" class="cell big thin"></div>
Das Label-Widget sollte sich ja auf das Data-Device beziehen (?). Was passiert hier?
lg
aeronaut
Hallo zusammen,
ich möchte dieses Thema noch einmal aufgreifen:
Zitat von: SirUli am 21 August 2015, 13:04:28
Du musst nur die Werte in der Configuration umdrehen, also erst 20 und dann absteigend. Die Prüfung erfolgt auf "Value ist kleiner, dann nächster Array-Eintrag". Dann klappt es. Bei max ist es genau so wie du es geschrieben hattest, also aufsteigend.
Viele Grüße, Uli
Edit mit Beispiel:
<div data-type="simplechart"
data-logdevice="TC_LP"
data-logfile="CURRENT"
data-columnspec="DbLog:myDbLog:Bad_Temp:temperature"
data-minvalue="[25,20,15,10,5,1]"
data-maxvalue="[5,10,15,20,25,30]"
data-yticks="2"
data-daysago="0"
class="fullsize">
</div>
Ich versuche seit geraumer Zeit die automatische Skallierung nach obigem Beispiel zumzusetzen, leider ohne Erfolg.
Wie sieht das unerwünschte Verhalten aus?
"data-minvalue" und "data-maxvalue" sind als array angelegt. Es wird jedoch immer ausschließlich das erste Element des Arrays als unter/obergrenze verwendet auch wenn die Werte außerhalb liegen.
Hier der relevante auszug meiner Konfiguration:
<div data-type="simplechart"
data-device="wz_WandThermostat"
data-logdevice="wz_log"
data-columnspec="4:temperature.*::"
data-minvalue="[22,20,18]"
data-maxvalue="[24,26,28]"
data-yticks="2"
data-daysago="0"
data-width="250px"
data-height="100%"
data-caption="Wohnzimmer"
class="inline cell top-space-2x">
</div>
Mit dieser Konfiguration wird der Wertebereich zwischen 22 und 24°C angezeigt (siehe Bild simplechart_autoscale.png), obwohl sich die Werte zwischen 20 und 25°C bewegen (siehe Bild simplechart_manuell.png).
Wo liegt hier der Fehler? Freue mich auf Eure Rückmeldung.
Danke & Gruß
Mirko
Wie stehen denn die Werte in deinem Log ? Kann es sein das dort Zeichen vor oder hinter dem Wert stehen die von der Grenzprüfung anders interpretiert werden als vom Kurvengenerator ?
Zitat von: Nobby1805 am 27 September 2015, 23:34:26
Wie stehen denn die Werte in deinem Log ? Kann es sein das dort Zeichen vor oder hinter dem Wert stehen die von der Grenzprüfung anders interpretiert werden als vom Kurvengenerator ?
Hallo Nobby,
das steht im Log für den gezeigten Zeitraum:
2015-09-27_00:22:39 wz_WandThermostat temperature: 20.8
2015-09-27_00:52:45 wz_WandThermostat temperature: 20.8
2015-09-27_01:22:51 wz_WandThermostat temperature: 20.8
2015-09-27_01:30:53 wz_WandThermostat desiredTemperature: 17.0
2015-09-27_01:44:25 wz_WandThermostat temperature: 20.7
2015-09-27_01:47:26 wz_WandThermostat temperature: 20.8
2015-09-27_01:49:57 wz_WandThermostat temperature: 20.7
2015-09-27_02:20:03 wz_WandThermostat temperature: 20.7
2015-09-27_02:50:09 wz_WandThermostat temperature: 20.7
2015-09-27_03:20:15 wz_WandThermostat temperature: 20.7
2015-09-27_03:31:17 wz_WandThermostat desiredTemperature: 17.0
2015-09-27_03:38:49 wz_WandThermostat temperature: 20.5
2015-09-27_03:41:49 wz_WandThermostat temperature: 20.7
2015-09-27_03:53:21 wz_WandThermostat temperature: 20.5
2015-09-27_03:56:22 wz_WandThermostat temperature: 20.7
2015-09-27_04:01:53 wz_WandThermostat temperature: 20.5
2015-09-27_04:21:57 wz_WandThermostat temperature: 20.7
2015-09-27_04:24:58 wz_WandThermostat temperature: 20.5
2015-09-27_04:55:04 wz_WandThermostat temperature: 20.5
2015-09-27_05:25:10 wz_WandThermostat temperature: 20.3
2015-09-27_05:27:41 wz_WandThermostat temperature: 20.5
2015-09-27_05:30:41 wz_WandThermostat temperature: 20.3
2015-09-27_05:31:41 wz_WandThermostat desiredTemperature: 17.0
2015-09-27_05:33:12 wz_WandThermostat temperature: 20.5
2015-09-27_05:42:13 wz_WandThermostat temperature: 20.3
2015-09-27_06:12:20 wz_WandThermostat temperature: 20.3
2015-09-27_06:42:26 wz_WandThermostat temperature: 20.3
2015-09-27_07:12:32 wz_WandThermostat temperature: 20.3
2015-09-27_07:25:04 wz_WandThermostat temperature: 20.1
2015-09-27_07:28:05 wz_WandThermostat temperature: 20.3
2015-09-27_07:30:35 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_07:31:05 wz_WandThermostat temperature: 20.1
2015-09-27_07:31:06 wz_HT_Dachfenster valveposition: 15
2015-09-27_07:31:06 wz_HT_Balkon valveposition: 15
2015-09-27_07:31:36 wz_HT_Esstisch valveposition: 15
2015-09-27_07:36:37 wz_WandThermostat temperature: 20.3
2015-09-27_07:56:41 wz_WandThermostat temperature: 20.5
2015-09-27_08:08:13 wz_WandThermostat temperature: 20.7
2015-09-27_08:19:15 wz_WandThermostat temperature: 20.8
2015-09-27_08:28:17 wz_HT_Dachfenster valveposition: 18
2015-09-27_08:28:47 wz_HT_Balkon valveposition: 18
2015-09-27_08:29:17 wz_HT_Esstisch valveposition: 18
2015-09-27_08:45:21 wz_WandThermostat temperature: 21.0
2015-09-27_09:15:27 wz_WandThermostat temperature: 21.0
2015-09-27_09:16:57 wz_WandThermostat temperature: 21.2
2015-09-27_09:22:28 wz_HT_Dachfenster valveposition: 4
2015-09-27_09:22:58 wz_HT_Balkon valveposition: 4
2015-09-27_09:23:28 wz_HT_Esstisch valveposition: 4
2015-09-27_09:31:00 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_09:47:03 wz_WandThermostat temperature: 21.2
2015-09-27_10:17:09 wz_WandThermostat temperature: 21.2
2015-09-27_10:47:15 wz_WandThermostat temperature: 21.2
2015-09-27_10:57:17 wz_WandThermostat temperature: 21.0
2015-09-27_10:58:47 wz_HT_Dachfenster valveposition: 3
2015-09-27_10:58:47 wz_HT_Balkon valveposition: 3
2015-09-27_10:59:18 wz_HT_Esstisch valveposition: 3
2015-09-27_10:59:48 wz_WandThermostat temperature: 21.2
2015-09-27_11:29:54 wz_WandThermostat temperature: 21.2
2015-09-27_11:31:24 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_11:42:56 wz_WandThermostat temperature: 21.0
2015-09-27_11:51:28 wz_WandThermostat temperature: 21.2
2015-09-27_11:51:28 wz_WandThermostat desiredTemperature: 5.0
2015-09-27_11:52:28 wz_HT_Dachfenster valveposition: 0
2015-09-27_11:52:58 wz_HT_Balkon valveposition: 0
2015-09-27_11:53:29 wz_HT_Esstisch valveposition: 0
2015-09-27_11:53:59 wz_WandThermostat temperature: 21.0
2015-09-27_11:56:59 wz_WandThermostat temperature: 20.8
2015-09-27_12:00:00 wz_WandThermostat temperature: 20.7
2015-09-27_12:03:00 wz_WandThermostat temperature: 20.5
2015-09-27_12:08:01 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_12:08:32 wz_WandThermostat temperature: 20.3
2015-09-27_12:08:32 wz_HT_Dachfenster valveposition: 9
2015-09-27_12:09:02 wz_HT_Balkon valveposition: 9
2015-09-27_12:09:32 wz_HT_Esstisch valveposition: 9
2015-09-27_12:14:33 wz_WandThermostat temperature: 20.5
2015-09-27_12:23:05 wz_WandThermostat temperature: 20.7
2015-09-27_12:28:36 wz_WandThermostat temperature: 20.5
2015-09-27_12:31:36 wz_WandThermostat temperature: 20.8
2015-09-27_12:40:38 wz_HT_Dachfenster valveposition: 13
2015-09-27_12:41:08 wz_HT_Balkon valveposition: 13
2015-09-27_12:41:38 wz_HT_Esstisch valveposition: 13
2015-09-27_12:45:39 wz_WandThermostat temperature: 21.0
2015-09-27_12:54:11 wz_WandThermostat temperature: 21.2
2015-09-27_12:58:42 wz_HT_Dachfenster valveposition: 2
2015-09-27_12:59:12 wz_HT_Balkon valveposition: 2
2015-09-27_12:59:42 wz_HT_Esstisch valveposition: 2
2015-09-27_13:02:43 wz_WandThermostat temperature: 21.3
2015-09-27_13:08:44 wz_WandThermostat temperature: 21.5
2015-09-27_13:08:44 wz_HT_Dachfenster valveposition: 0
2015-09-27_13:09:14 wz_HT_Balkon valveposition: 0
2015-09-27_13:09:44 wz_HT_Esstisch valveposition: 0
2015-09-27_13:22:47 wz_WandThermostat temperature: 21.6
2015-09-27_13:25:47 wz_WandThermostat temperature: 21.8
2015-09-27_13:31:18 wz_WandThermostat temperature: 21.7
2015-09-27_13:34:19 wz_WandThermostat temperature: 21.9
2015-09-27_13:37:20 wz_WandThermostat temperature: 22.0
2015-09-27_13:51:22 wz_WandThermostat temperature: 22.2
2015-09-27_13:56:53 wz_WandThermostat temperature: 22.3
2015-09-27_14:08:26 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_14:22:59 wz_WandThermostat temperature: 22.5
2015-09-27_14:25:59 wz_WandThermostat temperature: 22.7
2015-09-27_14:37:32 wz_WandThermostat temperature: 22.8
2015-09-27_14:46:03 wz_WandThermostat temperature: 23.0
2015-09-27_14:51:35 wz_WandThermostat temperature: 23.1
2015-09-27_15:00:06 wz_WandThermostat temperature: 23.3
2015-09-27_15:14:39 wz_WandThermostat temperature: 23.1
2015-09-27_15:25:41 wz_WandThermostat temperature: 23.0
2015-09-27_15:31:43 wz_WandThermostat temperature: 23.1
2015-09-27_15:37:14 wz_WandThermostat temperature: 23.3
2015-09-27_15:40:14 wz_WandThermostat temperature: 23.5
2015-09-27_15:48:46 wz_WandThermostat temperature: 23.6
2015-09-27_15:54:47 wz_WandThermostat temperature: 23.8
2015-09-27_16:08:50 wz_WandThermostat temperature: 23.6
2015-09-27_16:08:50 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_16:14:51 wz_WandThermostat temperature: 23.8
2015-09-27_16:20:22 wz_WandThermostat temperature: 23.9
2015-09-27_16:34:55 wz_WandThermostat temperature: 24.1
2015-09-27_17:03:31 wz_WandThermostat temperature: 24.2
2015-09-27_17:06:02 wz_WandThermostat temperature: 24.1
2015-09-27_17:09:02 wz_WandThermostat temperature: 24.2
2015-09-27_17:15:04 wz_WandThermostat temperature: 24.1
2015-09-27_17:26:06 wz_WandThermostat temperature: 23.9
2015-09-27_17:33:07 wz_WandThermostat desiredTemperature: 5.0
2015-09-27_17:35:38 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_17:36:08 wz_WandThermostat desiredTemperature: 5.0
2015-09-27_17:43:39 wz_WandThermostat temperature: 23.8
2015-09-27_17:46:10 wz_WandThermostat temperature: 23.6
2015-09-27_17:49:10 wz_WandThermostat temperature: 23.5
2015-09-27_17:54:42 wz_WandThermostat temperature: 23.3
2015-09-27_18:03:43 wz_WandThermostat temperature: 23.1
2015-09-27_18:08:14 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_18:09:14 wz_WandThermostat temperature: 23.0
2015-09-27_18:39:21 wz_WandThermostat temperature: 23.0
2015-09-27_18:52:23 wz_WandThermostat temperature: 22.8
2015-09-27_19:22:29 wz_WandThermostat temperature: 22.8
2015-09-27_19:23:29 wz_WandThermostat temperature: 22.7
2015-09-27_19:53:36 wz_WandThermostat temperature: 22.7
2015-09-27_20:01:07 wz_WandThermostat temperature: 22.5
2015-09-27_20:08:39 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_20:31:13 wz_WandThermostat temperature: 22.5
2015-09-27_20:32:13 wz_WandThermostat temperature: 22.3
2015-09-27_20:38:15 wz_WandThermostat temperature: 22.5
2015-09-27_20:40:45 wz_WandThermostat temperature: 22.3
2015-09-27_20:50:00 wz_WandThermostat temperature: 22.3
2015-09-27_20:50:00 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_20:52:45 wz_WandThermostat temperature: 22.3
2015-09-27_20:52:45 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_20:55:11 wz_WandThermostat temperature: 22.3
2015-09-27_20:55:11 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_20:55:37 wz_WandThermostat temperature: 22.3
2015-09-27_20:55:37 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_21:15:11 wz_WandThermostat temperature: 22.2
2015-09-27_21:18:11 wz_WandThermostat temperature: 22.3
2015-09-27_21:20:42 wz_WandThermostat temperature: 22.2
2015-09-27_21:50:48 wz_WandThermostat temperature: 22.2
2015-09-27_22:12:22 wz_WandThermostat temperature: 22.0
2015-09-27_22:42:28 wz_WandThermostat temperature: 22.0
2015-09-27_22:56:01 wz_WandThermostat desiredTemperature: 21.0
2015-09-27_22:58:32 wz_WandThermostat temperature: 21.9
2015-09-27_23:28:38 wz_WandThermostat temperature: 21.9
2015-09-27_23:30:38 wz_WandThermostat desiredTemperature: 17.0
2015-09-27_23:49:42 wz_WandThermostat temperature: 21.7
2015-09-27_23:52:43 wz_WandThermostat temperature: 21.9
2015-09-27_23:55:43 wz_WandThermostat temperature: 21.7
Zitat von: aeronaut am 27 September 2015, 20:04:12
Demnach holt sich das Widget den aktuellen Temperaturwert aus dem Logfile? Oder habe ich da etwas verkonfiguriert?
Nein, das Widget holt sich den aktuellen Temperaturwert aus einem Event.
Wenn durch die addlog-Einträge ein Event generiert wird (siehe Event-Monitor), dann zeigt das Widget diese Daten an. Und zwar solange, bis per Event wieder neue Daten kommen.
@mircoby: probiere mal bei data-columnspec am Ende statt :: ein :1:
In den Screenshots von aeronaut (siehe Antwort #2526: http://forum.fhem.de/index.php/topic,34233.msg337671.html#msg337671 (http://forum.fhem.de/index.php/topic,34233.msg337671.html#msg337671)) sieht es so aus, als wenn er das was ich gerne hätte (siehe Antwort #2508: http://forum.fhem.de/index.php/topic,34233.msg336775.html#msg336775 (http://forum.fhem.de/index.php/topic,34233.msg336775.html#msg336775))schon umgesetzt hat.
Falls das irgendwie aus Punkt 3 der Antwort von setstate (siehe Antwort #2515: http://forum.fhem.de/index.php/topic,34233.msg336980.html#msg336980 (http://forum.fhem.de/index.php/topic,34233.msg336980.html#msg336980)) abzuleiten ist wäre ich sehr dankbar für eine kurze Erklärung, da steige ich jetzt noch nicht so ganz durch...
Hi matrois, ich nutze Pagetab-Widgets für das Menü auf der linken Seite, die einzelnen Menüpunkte werden jeweils eingefärbt, wenn aktiv.
Ich habe mir das von den Beispielen abgeschaut. Ich bin mir aber nicht sicher, ob ich dein Problem verstanden habe.
Das Menupunkte kannst du etwa so:
<div data-type="pagetab" data-url="main.html"
data-icon="fa-home"
data-on-background-color="#CC7A00"
class="cell big">
</div>
in deine inc_homebutton.html einfügen.
lg
aeronaut
Zitat von: Nobby1805 am 28 September 2015, 09:15:19
@mircoby: probiere mal bei data-columnspec am Ende statt :: ein :1:
Habe ich versucht (data-columnspec="4:temperature.*:1:"), leider ohne Änderung des Verhaltens.
Laut der commandref (http://fhem.de/commandref.html#FileLog Abschnitt 'Get') wäre die ":1:" der default Wert.
Das Logfile ist zwischenzeitlich recht groß, (ca. 1,5MB) daher habe ich mal alte Daten manuell raus gelöscht sodass nur noch der aktuelle Monat enthalten ist (ca. 7kB).
Dies führt dazu, dass das Diagramm für den aktuellen Tag ganz leer bleibt. Idee?
Nenn es nicht Idee sondern Spekulation :( durch die Bearbeitung mit dem Editor wurde die Satzstruktur (z.B. CR, LF etc.) verändert ? :(
Meine logs sehen (fast) genauso aus wie deine und mein columnspec heißt: data-columnspec="4:Aussen.temperature:1:" ... also ohne .*
Habe die Logfiles jetzt umkonfiguriert, sodass es jeden Monat ein neues gibt, somit wird die Datenmenge erst mal begrenzt. (sollte eigentlich keinen Unterschied machen).
Den ".*" nach "temperature" habe ich deshalb drin, da im Logfile "temperature: " steht. Der Punkt ist für den Doppelpunkt gedacht, der Stern für das nachfolgende Leerzeichen.
Entferne ich den ".*" funktioniert es aktuell noch genau so, muss scheinbar nicht zwingend angegeben werden. (jetzt: data-columnspec="4:temperature:1:")
Beim experiementieren mit den Arrays für data-minvalue und data-maxvalue ist mir zusätzlich folgendes aufgefallen:
1.) Es wird jeweils der erste Wert data-minvalue und der erste Wert data-maxvlaue im Array verwendet, unabhängig vom Anzeigewert.
Beispiel:
data-minvalue="[20,18]"
data-maxvalue="[24,26]"
Resultat:
Diagramm startet bei 20 und hört bei 24 auf, egal ob die Messwerte dazwischen oder außerhalb liegen.
2.) Enthalten beide Arrays den gleichen Wert, wird kein Graph gezeichnet, der hintergrund bleibt grau. (auch keine Skallierung)
Beispiel:
data-minvalue="[24,22,20,18]"
data-maxvalue="[24,26,28,30]"
Du verwendest das aktuelle simplechart-Modul ? Bei mir funktioniert das alles bestens ...
Wenn ich hier https://regex101.com/ schaue, dann matchen deine desiredTemperature-Zeilen ebenfalls egal ob dort ein .* steht oder nicht
Zitat von: Nobby1805 am 29 September 2015, 09:24:19
Du verwendest das aktuelle simplechart-Modul ? Bei mir funktioniert das alles bestens ...
Wenn ich hier https://regex101.com/ schaue, dann matchen deine desiredTemperature-Zeilen ebenfalls egal ob dort ein .* steht oder nicht
Ich gehe davon aus, habe extra vorgestern noch ein komplettes Update von fhem gemacht. Damit sollte ich auf Stand sein!? Wie kann ich den Stand des simplechart modul prüfen? Muss ich es vielleicht manuell updaten?
Gesendet von meinem HTC One mini mit Tapatalk
Zitat von: bert am 26 September 2015, 13:03:13
Gibt es die Möglichkeit einen reread zu machen, bzw. den Cache zu löschen.
Beim Aufruf von FTUI meldet mir ein Icon den Zustand "an" der tatsächliche Status ist aber "aus" (zigmal kontrolliert). Nach ein /ausschalten ist wieder alles normal. Wechsle ich jetzt in einen anderen Menupunkt und dann wieder zurück ist die Meldung wieder "an". Am Status des Aktors hat zwischenzeitlich nichts geändert.
Gruß Bert
Im aktuellen Update findet man ein Eventmonitor Widget, womit man testen könnte, was die Widgets wirklich sehen. Man platziert das irgendwo in der normalen Page und bekommt nach einem Klick die Zeilen, die vom FTUI aufgefangen werden. Vielleicht können wir damit das Problem eingrenzen. Was auch noch sein könnte, ist, dass durch Fehler das Update von einzelnen Controls verhindert wird. Gibt es solche Meldungen in der Webconsole?
<div data-type="eventmonitor">EM</div>
Den Eventmonitor aber nicht dauerhaft drin lassen. Es gibt noch keine sinnvolle Abschaltfunktion. Es werden jetzt alle Events hinzugefügt. Das könnte irgendwann überlaufen. data-device-filter : default '.*'
data-reading-filter : default '.*'
data-max-items : default '100'
Wo holt FTUI die Werte her für Zustandsmeldungen von Aktoren? Die Readings in FHEM sind es jedenfalls nicht. Beispiel: "Blumenampel = an" FHem Status "B0" (heisst bei Eltako=an" FTUI zeigt "aus". Wenn ich jetzt über FTUI schalte ändert sich auch der Zustand im FHEM nach "BI" (heisst bei Eltako=aus". In FTUI wieder eingeschaltet, stimmt wieder alles (Lampe ist an, Fhem meldet an, FTUI meldet an. Soweit so gut, doch wenn ich in FTUI das Menu wechsle um z.B. Temperaturen zu sehen und wieder zurück wechsle ist lt. FTUI die Lampe aus (falsch), der tatsächliche Zustand der Lampe hat sich nicht geändert. Das habe ich mit "ausgeschaltetem" Longpoll getestet und mehrere 30 sek. gewartet. Die Lampe in FHEM bleibt "an", und FTUI "aus".
Die ganze Situation betrifft nicht nur diese Lampe, sondern betrifft wahllos auch andere Devices.
Heute früh um 8 Uhr habe ich die Batterie am Aussenfühler gewechselt. FHEM hat nach kurzer Zeit wieder die richtige Temperatur gezeigt, FTUI meldet immer noch 20° und unbekannten Batteriezustand (seit ca. 2 Std.).
Gruß Bert
werde das mit dem eventmonitor gleich ausprobieren.
Hallo Zusammen,
wäre es im Simplechart machbar, das wie bei FHEM auch, die Min und Max.-Werte als Zahl angegeben werden ?
Gruß
Jens
Könntest du die Devices welche im EM geloggt werden selektierbar machen? Werde von nicht-relevanten Meldungen erschlagen.
Gruß Bert
Zitat von: mircoby am 29 September 2015, 09:49:46
Ich gehe davon aus, habe extra vorgestern noch ein komplettes Update von fhem gemacht. Damit sollte ich auf Stand sein!? Wie kann ich den Stand des simplechart modul prüfen? Muss ich es vielleicht manuell updaten?
Tablet-UI wird nicht mit dem normalen Fhem-Update aktualisiert ... zum prüfen: update check https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
zum update: update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Zitat von: mircoby am 28 September 2015, 23:44:33
...
2.) Enthalten beide Arrays den gleichen Wert, wird kein Graph gezeichnet, der hintergrund bleibt grau. (auch keine Skallierung)
Beispiel:
data-minvalue="[24,22,20,18]"
data-maxvalue="[24,26,28,30]"
Das sollte so funktionieren. Der erste Wert wird nur per Default genommen. Wenn dann kein anderer aus dem Array benutzt wird, deutet das eher auf Probleme in der Wertereihe hin. Die Suchschleife wird nie durchlaufen oder der größer/kleiner Vergleich schlägt fehl.
Wie sehen deine Werte aus?
Die Zahlen, die das Widget aus deiner Angabe im columnspec bezieht musst du mal nach auffälligen Zahlen durchsuchen.
Einsehen kannst du die Zahlen im Reply des get FileLog Aufrufes -> Entwicklertools > Netzwerkanalyse > File anklicken > Reiter: Antwort
Zitat von: bert am 29 September 2015, 11:36:30
Könntest du die Devices welche im EM geloggt werden selektierbar machen? Werde von nicht-relevanten Meldungen erschlagen.
Gruß Bert
Ab sofort per RegEx möglich:
data-device-filter=".*" data-reading-filter=".*"
Zitat von: danieljo am 27 September 2015, 14:32:54
Schließe mich hier mal. Hat jemand schon eine Lösung um mit diesem Volume-Wiget im HUE Modus ein Wifilight Device zu steuern. Das Wiflight Device wird mittels "set LD382 HSV 240,100,100" wobei die 240 für die Farbe stehen. Somit müssten man nur noch das ",100,100" anhängen.
EDIT:
Ich habs über die google Suche gefunden mittels RGB geht es nun. Was mich daran stört ist das dann die Helligkeit immer wieder auf 100% gesetzt wird. Könnte man nicht die Helligkeit auslesen um diese dann beim Farbänderung beizubehalten?
Das schaue ich mir noch an. Ich denke, es wird ein neues Widget werden müssen
@Nobby: Danke für den Hinweis mit dem Update - das hatte ich nicht auf dem Schirm. Habe das Update ausgeführt und bin jetzt auf dem aktuellen Stand. Geändert hat dies jedoch nichts an dem Verhalten, dass die Wertebereiche automatisch skalliert werden. (Einige widges laufen nach dem Update nicht mehr richtig, es fehlen z.B. Symbole. Vermutlich muss ich die configuration noch anpassen.)
@setstate: Beim debuggen mit den Entwicklertools im Browser erhalte ich folgende Werte in der Antwort:
2015-09-29_00:10:03 21.2
2015-09-29_00:15:34 21.4
2015-09-29_00:18:35 21.2
2015-09-29_00:44:10 21.4
2015-09-29_00:50:11 21.2
2015-09-29_00:53:12 21.4
2015-09-29_00:55:42 21.2
2015-09-29_01:09:45 21.4
2015-09-29_01:12:46 21.2
2015-09-29_01:15:46 21.4
2015-09-29_01:18:47 21.2
2015-09-29_01:24:18 21.1
2015-09-29_01:27:19 21.2
2015-09-29_01:35:51 21.1
2015-09-29_01:38:21 21.2
2015-09-29_01:44:22 21.1
2015-09-29_01:49:53 21.2
2015-09-29_01:52:54 21.1
2015-09-29_01:55:55 21.2
2015-09-29_01:58:25 21.1
2015-09-29_02:01:26 21.2
2015-09-29_02:04:26 21.1
2015-09-29_02:21:30 21.2
2015-09-29_02:24:30 21.1
2015-09-29_02:33:02 20.9
2015-09-29_02:35:33 21.2
2015-09-29_02:38:33 20.9
2015-09-29_03:08:39 20.9
2015-09-29_03:30:14 21.0
2015-09-29_03:33:14 20.9
2015-09-29_03:50:18 20.7
2015-09-29_03:53:18 21.0
2015-09-29_03:55:49 20.9
2015-09-29_04:01:50 20.7
2015-09-29_04:07:21 20.9
2015-09-29_04:10:22 20.7
2015-09-29_04:18:53 20.9
2015-09-29_04:21:54 20.7
2015-09-29_04:24:55 20.9
2015-09-29_04:27:25 20.7
2015-09-29_04:56:01 20.9
2015-09-29_04:59:02 20.7
2015-09-29_05:16:05 20.9
2015-09-29_05:19:06 20.7
2015-09-29_05:41:40 20.6
2015-09-29_05:44:41 20.7
2015-09-29_05:47:41 20.6
2015-09-29_05:50:42 20.7
2015-09-29_05:53:13 20.6
2015-09-29_06:01:44 20.7
2015-09-29_06:07:45 20.6
2015-09-29_06:13:17 20.7
2015-09-29_06:21:48 20.6
2015-09-29_06:27:50 20.7
2015-09-29_06:36:21 20.6
2015-09-29_06:39:22 20.7
2015-09-29_06:44:53 20.6
2015-09-29_06:47:54 20.7
2015-09-29_06:50:24 20.6
2015-09-29_06:56:25 20.7
2015-09-29_06:58:56 20.6
2015-09-29_07:01:56 20.7
2015-09-29_07:04:57 20.6
2015-09-29_07:07:58 20.7
2015-09-29_07:10:28 20.6
2015-09-29_07:13:29 20.7
2015-09-29_07:16:29 20.6
2015-09-29_07:30:32 20.7
2015-09-29_07:33:33 20.6
2015-09-29_07:48:06 20.7
2015-09-29_07:51:06 20.6
2015-09-29_08:21:12 20.6
2015-09-29_08:33:45 20.7
2015-09-29_08:36:46 20.6
2015-09-29_09:06:52 20.6
2015-09-29_09:22:25 20.7
2015-09-29_09:25:25 20.6
2015-09-29_09:48:00 20.7
2015-09-29_09:51:01 20.6
2015-09-29_10:21:07 20.6
2015-09-29_10:51:13 20.6
2015-09-29_11:14:17 20.7
2015-09-29_11:44:24 20.7
2015-09-29_11:48:24 20.9
2015-09-29_12:11:29 21.1
2015-09-29_12:31:03 21.2
2015-09-29_12:45:36 21.4
2015-09-29_13:15:42 21.4
2015-09-29_13:31:45 21.6
2015-09-29_13:39:47 21.7
2015-09-29_13:54:20 21.9
2015-09-29_14:05:52 22.1
2015-09-29_14:25:26 22.2
2015-09-29_14:55:32 22.2
2015-09-29_15:11:35 22.4
2015-09-29_15:20:07 22.5
2015-09-29_15:25:38 22.7
2015-09-29_15:28:39 22.9
2015-09-29_15:54:14 22.7
2015-09-29_16:00:15 22.6
2015-09-29_16:02:46 22.9
2015-09-29_16:05:46 22.7
2015-09-29_16:08:47 22.9
2015-09-29_16:17:19 23.0
2015-09-29_16:20:19 22.9
2015-09-29_16:23:20 23.2
2015-09-29_16:28:51 23.1
2015-09-29_16:31:52 23.2
2015-09-29_16:34:52 23.3
2015-09-29_16:37:23 23.2
2015-09-29_16:43:24 23.3
2015-09-29_16:48:55 23.5
2015-09-29_17:00:27 23.4
2015-09-29_17:12:00 23.3
2015-09-29_17:17:31 23.2
2015-09-29_17:20:31 23.3
2015-09-29_17:23:32 23.2
2015-09-29_17:29:03 23.3
2015-09-29_17:32:04 23.2
2015-09-29_17:34:34 23.3
2015-09-29_17:37:35 23.2
2015-09-29_18:00:40 23.1
2015-09-29_18:11:42 23.2
2015-09-29_18:14:42 23.1
2015-09-29_18:26:15 23.2
2015-09-29_18:29:15 23.1
2015-09-29_18:32:16 23.2
2015-09-29_18:34:46 23.1
2015-09-29_18:37:47 23.2
2015-09-29_18:40:48 23.0
2015-09-29_18:46:19 22.9
2015-09-29_18:54:51 23.0
2015-09-29_18:57:51 22.9
2015-09-29_19:00:52 22.7
2015-09-29_19:03:22 22.9
2015-09-29_19:06:23 22.7
2015-09-29_19:11:54 22.9
2015-09-29_19:17:55 22.7
2015-09-29_19:31:58 22.6
2015-09-29_19:34:59 22.7
2015-09-29_19:37:59 22.5
2015-09-29_19:58:03 22.4
2015-09-29_20:01:04 22.5
2015-09-29_20:03:34 22.4
2015-09-29_20:06:35 22.5
2015-09-29_20:09:36 22.4
2015-09-29_20:38:11 22.3
2015-09-29_20:40:42 22.4
2015-09-29_20:55:15 22.3
2015-09-29_21:00:46 22.4
2015-09-29_21:03:47 22.2
2015-09-29_21:06:17 22.1
2015-09-29_21:09:18 22.2
2015-09-29_21:39:24 22.2
2015-09-29_21:46:25 22.1
#4:temperature:1:
Sieht für mich plausibel aus, keine ungewöhnlichen Werte.
Zitat von: mircoby am 29 September 2015, 22:09:16
@Nobby: Danke für den Hinweis mit dem Update - das hatte ich nicht auf dem Schirm. Habe das Update ausgeführt und bin jetzt auf dem aktuellen Stand. Geändert hat dies jedoch nichts an dem Verhalten, dass die Wertebereiche automatisch skalliert werden. (Einige widges laufen nach dem Update nicht mehr richtig, es fehlen z.B. Symbole. Vermutlich muss ich die configuration noch anpassen.)
@setstate: Beim debuggen mit den Entwicklertools im Browser erhalte ich folgende Werte in der Antwort:
2015-09-29_00:10:03 21.2
2015-09-29_00:15:34 21.4
2015-09-29_00:18:35 21.2
2015-09-29_00:44:10 21.4
2015-09-29_00:50:11 21.2
2015-09-29_00:53:12 21.4
2015-09-29_00:55:42 21.2
2015-09-29_01:09:45 21.4
2015-09-29_01:12:46 21.2
2015-09-29_01:15:46 21.4
2015-09-29_01:18:47 21.2
2015-09-29_01:24:18 21.1
2015-09-29_01:27:19 21.2
2015-09-29_01:35:51 21.1
2015-09-29_01:38:21 21.2
2015-09-29_01:44:22 21.1
2015-09-29_01:49:53 21.2
2015-09-29_01:52:54 21.1
2015-09-29_01:55:55 21.2
2015-09-29_01:58:25 21.1
2015-09-29_02:01:26 21.2
2015-09-29_02:04:26 21.1
2015-09-29_02:21:30 21.2
2015-09-29_02:24:30 21.1
2015-09-29_02:33:02 20.9
2015-09-29_02:35:33 21.2
2015-09-29_02:38:33 20.9
2015-09-29_03:08:39 20.9
2015-09-29_03:30:14 21.0
2015-09-29_03:33:14 20.9
2015-09-29_03:50:18 20.7
2015-09-29_03:53:18 21.0
2015-09-29_03:55:49 20.9
2015-09-29_04:01:50 20.7
2015-09-29_04:07:21 20.9
2015-09-29_04:10:22 20.7
2015-09-29_04:18:53 20.9
2015-09-29_04:21:54 20.7
2015-09-29_04:24:55 20.9
2015-09-29_04:27:25 20.7
2015-09-29_04:56:01 20.9
2015-09-29_04:59:02 20.7
2015-09-29_05:16:05 20.9
2015-09-29_05:19:06 20.7
2015-09-29_05:41:40 20.6
2015-09-29_05:44:41 20.7
2015-09-29_05:47:41 20.6
2015-09-29_05:50:42 20.7
2015-09-29_05:53:13 20.6
2015-09-29_06:01:44 20.7
2015-09-29_06:07:45 20.6
2015-09-29_06:13:17 20.7
2015-09-29_06:21:48 20.6
2015-09-29_06:27:50 20.7
2015-09-29_06:36:21 20.6
2015-09-29_06:39:22 20.7
2015-09-29_06:44:53 20.6
2015-09-29_06:47:54 20.7
2015-09-29_06:50:24 20.6
2015-09-29_06:56:25 20.7
2015-09-29_06:58:56 20.6
2015-09-29_07:01:56 20.7
2015-09-29_07:04:57 20.6
2015-09-29_07:07:58 20.7
2015-09-29_07:10:28 20.6
2015-09-29_07:13:29 20.7
2015-09-29_07:16:29 20.6
2015-09-29_07:30:32 20.7
2015-09-29_07:33:33 20.6
2015-09-29_07:48:06 20.7
2015-09-29_07:51:06 20.6
2015-09-29_08:21:12 20.6
2015-09-29_08:33:45 20.7
2015-09-29_08:36:46 20.6
2015-09-29_09:06:52 20.6
2015-09-29_09:22:25 20.7
2015-09-29_09:25:25 20.6
2015-09-29_09:48:00 20.7
2015-09-29_09:51:01 20.6
2015-09-29_10:21:07 20.6
2015-09-29_10:51:13 20.6
2015-09-29_11:14:17 20.7
2015-09-29_11:44:24 20.7
2015-09-29_11:48:24 20.9
2015-09-29_12:11:29 21.1
2015-09-29_12:31:03 21.2
2015-09-29_12:45:36 21.4
2015-09-29_13:15:42 21.4
2015-09-29_13:31:45 21.6
2015-09-29_13:39:47 21.7
2015-09-29_13:54:20 21.9
2015-09-29_14:05:52 22.1
2015-09-29_14:25:26 22.2
2015-09-29_14:55:32 22.2
2015-09-29_15:11:35 22.4
2015-09-29_15:20:07 22.5
2015-09-29_15:25:38 22.7
2015-09-29_15:28:39 22.9
2015-09-29_15:54:14 22.7
2015-09-29_16:00:15 22.6
2015-09-29_16:02:46 22.9
2015-09-29_16:05:46 22.7
2015-09-29_16:08:47 22.9
2015-09-29_16:17:19 23.0
2015-09-29_16:20:19 22.9
2015-09-29_16:23:20 23.2
2015-09-29_16:28:51 23.1
2015-09-29_16:31:52 23.2
2015-09-29_16:34:52 23.3
2015-09-29_16:37:23 23.2
2015-09-29_16:43:24 23.3
2015-09-29_16:48:55 23.5
2015-09-29_17:00:27 23.4
2015-09-29_17:12:00 23.3
2015-09-29_17:17:31 23.2
2015-09-29_17:20:31 23.3
2015-09-29_17:23:32 23.2
2015-09-29_17:29:03 23.3
2015-09-29_17:32:04 23.2
2015-09-29_17:34:34 23.3
2015-09-29_17:37:35 23.2
2015-09-29_18:00:40 23.1
2015-09-29_18:11:42 23.2
2015-09-29_18:14:42 23.1
2015-09-29_18:26:15 23.2
2015-09-29_18:29:15 23.1
2015-09-29_18:32:16 23.2
2015-09-29_18:34:46 23.1
2015-09-29_18:37:47 23.2
2015-09-29_18:40:48 23.0
2015-09-29_18:46:19 22.9
2015-09-29_18:54:51 23.0
2015-09-29_18:57:51 22.9
2015-09-29_19:00:52 22.7
2015-09-29_19:03:22 22.9
2015-09-29_19:06:23 22.7
2015-09-29_19:11:54 22.9
2015-09-29_19:17:55 22.7
2015-09-29_19:31:58 22.6
2015-09-29_19:34:59 22.7
2015-09-29_19:37:59 22.5
2015-09-29_19:58:03 22.4
2015-09-29_20:01:04 22.5
2015-09-29_20:03:34 22.4
2015-09-29_20:06:35 22.5
2015-09-29_20:09:36 22.4
2015-09-29_20:38:11 22.3
2015-09-29_20:40:42 22.4
2015-09-29_20:55:15 22.3
2015-09-29_21:00:46 22.4
2015-09-29_21:03:47 22.2
2015-09-29_21:06:17 22.1
2015-09-29_21:09:18 22.2
2015-09-29_21:39:24 22.2
2015-09-29_21:46:25 22.1
#4:temperature:1:
Sieht für mich plausibel aus, keine ungewöhnlichen Werte.
Ergänzung:
Zitat
data-minvalue="[24,22,20,18]"
data-maxvalue="[24,26,28,30]"
Funktioniert scheinbar plötzlich nach dem Update und einigen Browser refreshs. Ich werde es beobachten, die restlichen nach dem update nicht mehr funktionierenden Widges reparieren und Rückmeldung geben.
Vielen Dank für Eure Hilfe!
Hallo, ich nutze auch die tablet Ui und seit dem die von Apache ausgeliefert wird, klappt das auch wunderbar.
Bei mir sind zwei Tablet's im Einsatz, um auch Apps auf den Tablet's über UI zu starten nutze ich Tasker (https://play.google.com/store/apps/details?id=net.dinglisch.android.taskerm&hl=de) in Verbindung mit Home24 MediaPlayer (https://play.google.com/store/apps/details?id=com.home24.mediaplayer&hl=de).
Habe dann nach einer Lösung gesucht, um heraus zubekommen von welchen Gerät die Anfrage ausgeht, um dann auf den passenden Gerät auch die App zu starten. Manchmal ist die einfachste Lösung auch die beste, ich habe in die ip in der Tablet UI dann alle durch localhost ersetzt. Nun starten die Apps dort wo sie starten sollen. Vielleicht hilft das ja jemanden.
Aber nun zu meiner Frage.
Ist es möglich in fhem auszuwerten auf welchem Tablet ein Widget betätigt wurde?
Ziel ist es, ich setze meinen Status von asleep zu home zb. im Bad und dann soll auch nur im Bad eine Sprachausgabe starten.
Natürlich könnte ich zwei unterschiedliche UI's erstellen oder mit mehreren Dummys arbeiten. Aber das wird ja schnell ziemlich unübersichtlich und möchte man etwas ändern muss ich das gleiche ja an mehreren Stellen machen. Außerdem ist geplant noch weitere Tablets als Consolen in anderen Zimmern zu nutzen.
Zitat von: aeronaut am 28 September 2015, 17:57:29
Hi matrois, ich nutze Pagetab-Widgets für das Menü auf der linken Seite, die einzelnen Menüpunkte werden jeweils eingefärbt, wenn aktiv.
Ich habe mir das von den Beispielen abgeschaut. Ich bin mir aber nicht sicher, ob ich dein Problem verstanden habe.
Das Menupunkte kannst du etwa so:
<div data-type="pagetab" data-url="main.html"
data-icon="fa-home"
data-on-background-color="#CC7A00"
class="cell big">
</div>
in deine inc_homebutton.html einfügen.
lg
aeronaut
Danke für den Hinweis. Ich hatte gedacht, dass Deine Lösung evtl. nicht mit "pagetab" realisiert wurde. Bei der "pagetab" Lösung gefällt mir nicht, dass praktisch kein "echter" Seitenwechsel stattfindet. Man merkt es z.B. daran, dass kein abweichender Seitentitel (durch Änderung des Titel-Tags) benutzt werden kann. Daher bin ich auf der Suche nach einer Lösung wie man z.B. einen Button in Abhängigkeit von der aktuellen URL einfärben kann.
Gibt es evtl. doch eine Möglichkeit bei den vorhandenen Randbedingungen den Button in Abhängigkeit von der aktuellen URL einfärben zu können?
setstate hatte da eine Möglichkeit angesprochen, die ich allerdings leider nicht verstehe / umsetzen kann.
Zitat von: setstate am 25 September 2015, 11:50:48
Thema URL Button: sollte mit einem Zweizeiler im Button Widget machbar sein, das dieser auf aktiv geht, wenn die hinterlegte URL aktiv ist und alle anderen im gleichen Div Verbund gehen auf OFF. Das geht einfach über den Jquery Selektor.
Hallo matrois,
ZitatDanke für den Hinweis. Ich hatte gedacht, dass Deine Lösung evtl. nicht mit "pagetab" realisiert wurde. Bei der "pagetab" Lösung gefällt mir nicht, dass praktisch kein "echter" Seitenwechsel stattfindet. Man merkt es z.B. daran, dass kein abweichender Seitentitel (durch Änderung des Titel-Tags) benutzt werden kann. Daher bin ich auf der Suche nach einer Lösung wie man z.B. einen Button in Abhängigkeit von der aktuellen URL einfärben kann.
Gibt es evtl. doch eine Möglichkeit bei den vorhandenen Randbedingungen den Button in Abhängigkeit von der aktuellen URL einfärben zu können?
setstate hatte da eine Möglichkeit angesprochen, die ich allerdings leider nicht verstehe / umsetzen kann.
Ja es gibt eine andere Variante.
In den Demos von "nesges" ist eine drin. Er macht dieses mit Javascript und Css.
Hier kannst du das in der index.html und den einzelnen Räumen dir anschauen: https://github.com/ovibox/fhem-ftui-user-demos/tree/master/user-demos/nesges/html/room (https://github.com/ovibox/fhem-ftui-user-demos/tree/master/user-demos/nesges/html/room)
Gruß
Denny
Mit dem Button Widget und URL Umschalten habe ich schon experimentiert, gefiel mir aber noch nicht. Der Button wird zwar korrekt eingefärbt, aber beim Umschalten sind für eine kurze Zeit zwei Buttons bunt, das kann ich so noch nicht releasen.
@nightstorm99: Danke für den Hinweis. Kann es sein, dass die colors.js von nesges mittlerweile nicht mehr erforderlich ist?
Im Demo von nesges gibt es keine "inc_menu.html" Datei. Wenn ich für jeden Menüpunkt eine eigene komplette html-Datei schreibe bekomme ich die Färbung schon durch das Setzen von entsprechenden Eigenschaften hin (data-color / data-background-color) ohne dass ich die colors.js einbinden muss. Aber ich möchte nicht das Menü in jeder Datei neuschreiben, sondern nur einmal eine Datei "inc_menu.html" benutzen (,damit eine Menüänderung leichter zu realisieren ist). Dazu müsste sich das Menü bzw. die Buttons "von selbst" einfärben. Falls ich die Lösung von nesges gar nicht ganz durchblickt haben sollte bin ich für jeden Hinweis dankbar...
@setstate: Wenn ggf. eine ergänzende Funktionalität in der Richtung im Button Widget integriert wird warte ich erstmal ab. Vielen Dank. Falls vor dem Release noch Betatester gebraucht werden stelle ich mich gerne bereit.
Hallo matrois,
ja das geht einfacher.
Folgendes habe ich in jeder Seite als Standard hinterlegt.
Im style muss dann immer das geändert werden(hier also #room_index), was im 2. Code in id steht:
<div class="gridster">
<ul>
<style>
#room_index #bg {
color: rgb(170,105,0) !important;
border: 3px
}
</style>
<!-- ========= HOME BUTTON =============== -->
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="menu_home.html" ></li>
<!-- ========= Linkes-Hauptmenü =========== -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="5" data-template="menu_zimmer.html"></li>
<!-- ========= WETTER OBEN ================ -->
<!-- ====================================== -->
<li data-row="1" data-col="2" data-sizex="3" data-sizey="1" data-template="menu_wetter.html"></li>
<!-- ========= UHR ======================== -->
<!-- ====================================== -->
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1" data-template="menu_uhr.html"></li>
<!-- ========= AUSSENTEMP oben== ========== -->
<!-- ====================================== -->
<li data-row="1" data-col="6" data-sizex="3" data-sizey="1" data-template="menu_aussentemp.html"></li>
<!-- ========= TEMPERATURÜBERSICHT ======== -->
<!-- ====================================== -->
<li data-row="1" data-col="9" data-sizex="1" data-sizey="1" data-template="menu_tempbutton.html"></li>
<!-- ========= Rechtes-Hauptmenü ========== -->
<!-- ====================================== -->
<li data-row="2" data-col="9" data-sizex="1" data-sizey="5" data-template="menu_system.html"></li>
menu_home.html sieht wie folgt aus:
<header style="font-size: 150%;">HOME</header>
<a id="room_index" href="index.html" class="cell fa-stack fa-3x">
<i id="bg" class="fa fa-stack-2x fa-square blue" ></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(255,255,255);"></i>
</a>
<div data-type="label" class="large darker">HOME</div>
Durch id="room_index" leuchtet dann der Button.
Ich hoffe das hilft?
Gruß
Denny
Hallo, könnte mir jemand auf die Sprünge helfen :-) Ich frage den Status meiner Fenster und Türen ab. Bislang wurde das auch immer richtig angezeigt, aber nach diversen Updates schiebt sich das jetzt aufeinander und ich sehe den Status nicht mehr.
header>Fenster und Türen</header>
<div class="left">
<div data-type="contact" data-device="Bad.Fenster"
data-get-on='["open","tilted","closed"]'
data-on-colors='["#aa6900","#993300","#505050"]'
class="small narrow" >
</div>
<div data-type="label" class="narrow darker">Bad</div>
</div>
<div class="left">
<div data-type="contact" data-device="Dach.Fenster"
class="small narrow" >
</div>
<div data-type="label" class="narrow darker">Wz FD</div>
</div>
<div class="left">
<div data-type="contact" data-device="Wz.Fenster_1"
data-get-on='["open","tilted","closed"]'
data-on-colors='["#aa6900","#993300","#505050"]'
class="small narrow" >
</div>
<div data-type="label" class="narrow darker">Wz F1</div>
</div>
<div class="left">
<div data-type="contact" data-device="TuerKontaktFlur_Wohnungstuer"
class="small narrow" >
</div>
<div data-type="label" class="narrow darker">Flur T</div>
</div>
Hallo setState,
ich habe nach den letzten Updates auch Probleme mit den Zuständen der Readings von FHEM.
Im ersten Screenshot sieht man den Zustand direkt nach dem Aufruf der Seite. In der Mitte sind die Jalousien.
Das ist alles ein und das selbe Dummy. Hier sind aber 2 Zustände aktiv, was nicht gehen kann.
Aktualisiere ich die Seite ist Screenshot 2, alles iO. !!!
Muss irgendwie am Cache liegen. Kann ich diesen ausschalten generell? ? ? ? ?
Danke und Gruß
Denny
Hallo,
habe noch eine Frage zum Widget Symbol.
Wie kann ich dort dem Hintergrund die class -> blue zuweisen?
Ich möchte, wie im Beitrag davor zu sehen, meinen Symbolen zum anzeigen den gleichen Look wie die Switches geben.
<div class="cell inline">
<div data-type="symbol" data-device="Huawei_P1" data-get-on='["present","absent"]' data-icons='["fa-users","fa-user-times"]' data-on-colors='["SeaGreen","GoldenRod"]' data-background-icon="fa-square" class="cell fa-3x blue"></div>
<div data-type="label" class="cell darker narrow large">ICH</div>
</div>
Mein background Icon soll jetzt aber blue sein!
Danke und Gruss
Denny
Zitat von: nightstorm99 am 30 September 2015, 14:06:05
Hallo matrois,
ja das geht einfacher.
Folgendes habe ich in jeder Seite als Standard hinterlegt.
Im style muss dann immer das geändert werden(hier also #room_index), was im 2. Code in id steht:
<div class="gridster">
<ul>
<style>
#room_index #bg {
color: rgb(170,105,0) !important;
border: 3px
}
</style>
<!-- ========= HOME BUTTON =============== -->
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="menu_home.html" ></li>
<!-- ========= Linkes-Hauptmenü =========== -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="5" data-template="menu_zimmer.html"></li>
<!-- ========= WETTER OBEN ================ -->
<!-- ====================================== -->
<li data-row="1" data-col="2" data-sizex="3" data-sizey="1" data-template="menu_wetter.html"></li>
<!-- ========= UHR ======================== -->
<!-- ====================================== -->
<li data-row="1" data-col="5" data-sizex="1" data-sizey="1" data-template="menu_uhr.html"></li>
<!-- ========= AUSSENTEMP oben== ========== -->
<!-- ====================================== -->
<li data-row="1" data-col="6" data-sizex="3" data-sizey="1" data-template="menu_aussentemp.html"></li>
<!-- ========= TEMPERATURÜBERSICHT ======== -->
<!-- ====================================== -->
<li data-row="1" data-col="9" data-sizex="1" data-sizey="1" data-template="menu_tempbutton.html"></li>
<!-- ========= Rechtes-Hauptmenü ========== -->
<!-- ====================================== -->
<li data-row="2" data-col="9" data-sizex="1" data-sizey="5" data-template="menu_system.html"></li>
menu_home.html sieht wie folgt aus:
<header style="font-size: 150%;">HOME</header>
<a id="room_index" href="index.html" class="cell fa-stack fa-3x">
<i id="bg" class="fa fa-stack-2x fa-square blue" ></i>
<i id="fg" class="fa fa-stack-1x fa-home" style="color: rgb(255,255,255);"></i>
</a>
<div data-type="label" class="large darker">HOME</div>
Durch id="room_index" leuchtet dann der Button.
Ich hoffe das hilft?
Gruß
Denny
Meine menu_left_main.html sieht so aus:
<div data-url="flur.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
<div data-url="wozi.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
<div data-url="kind.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
<div data-url="bad.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
<div data-url="Schlafen.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
<div data-url="Keller.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
Wenn ich die Lösung mit id="room_index" umsetzen wollte müsste ich pro Raum eine eigene Menüdatei erstellen in der durch das Setzen der ID der richtige Button leuchtet (in der "menu_left_main_wozi.html" könnte ich durch Setzen der id="room_index" beim Wozi den Button Wozi hervorheben). Diese Lösung würde aber beinhalten, dass ich pro Raum die Menüdatei einmal kopieren müsste. Eine spätere Menüänderung müsste in allen Kopien durchgeführt werden.
Ich bin auf der Suche nach einer Lösung bei der ich nur eine Menüdatei benötige und der "richtige Button" sollte bei meiner Wunschlösung automatisch hervorgehoben werden. Wenn ich meiner Phantasie freien Lauf lassen darf könnte das so eine Eigenschaft a lá "highlight" sein. Mein "Wunschbeispiel" ;-) :
<div data-url="wozi.html"
data-type="button"
data-icon="fa-group"
highlight-fg="#000000"
highlight-bg="#ffffff"
class="cell small"></div>
<div data-url="kind.html"
data-type="button"
data-icon="fa-group"
highlight-fg="#000000"
highlight-bg="#ffffff"
class="cell small"></div>
<div data-url="flur.html"
data-type="button"
data-icon="fa-group"
class="cell small"></div>
Erklärung:
* Der Button "Wozi" wird weiß auf schwarz, wenn die data-url "wozi.html" ist. Der Rest der Buttons ist "normal" gefärbt.
* Der Button "Kind" wird weiß auf schwarz, wenn die data-url "kind.html" ist. Der Rest der Buttons ist "normal" gefärbt.
* Der Button "Flur ist unbeeindruckt von der data-url.
Zitat von: nightstorm99 am 30 September 2015, 21:20:52
Hallo,
habe noch eine Frage zum Widget Symbol.
Wie kann ich dort dem Hintergrund die class -> blue zuweisen?
Ich möchte, wie im Beitrag davor zu sehen, meinen Symbolen zum anzeigen den gleichen Look wie die Switches geben.
...
Mein background Icon soll jetzt aber blue sein!
Mann darf Dual State Notation nicht mit Multi State Notation vermischen
So passt das in Multi State Notation (Arrays):
<div data-type="symbol"
data-device="Huawei_P1"
data-states='["present","absent"]'
data-background-icons='["fa-square","fa-square"]'
data-icons='["fa-users","fa-user-times"]'
data-background-colors='["RoyalBlue ","RoyalBlue "]'
data-colors='["#2a2a2a","#2a2a2a"]'
class="bigger"></div>
<div data-type="label" class="darker narrow large">ICH</div>
Hi,
hat sich irgendetwas im select_Widget geändert?
Es werden bei mir keine Einträge in dem Listenfeld angezeigt.
Ich habe schon mal in Wiki und im Github gesucht, konnte aber keine Ursache finden.
<div data-type="select"
data-device="wz.SqueezPi"
data-items='["http://1live.akacast.akamaistream.net/7/706/119434/v1/gnl.akacast.akamaistream.net/1live",
"http://wdr-mp3-m-wdr2-dortmund.akacast.akamaistream.net/7/789/119456/v1/gnl.akacast.akamaistream.net/wdr-mp3-m-wdr2-dortmund",
"http://edge.live.mp3.mdn.newmedia.nacamar.net/ps-radiorur/livestream.mp3"]'
data-alias='["1Live","WDR2","RadioRur"]'
data-get="input"
data-set="playlist play"
class="cell w2x" >
Gruß Rolf
Zitat von: harry66 am 01 Oktober 2015, 19:31:27
Hi,
hat sich irgendetwas im select_Widget geändert?
Es werden bei mir keine Einträge in dem Listenfeld angezeigt.
Ich habe schon mal in Wiki und im Github gesucht, konnte aber keine Ursache finden.
...
Gruß Rolf
Nö, sollte alles genauso funktionieren.
Das Device "wz.SqueezPi" gibt es noch im FHEM? Wenn nicht, ist es normal, dass die Liste leer ist.
ist ja seltsam ???
in der index-example.html werden auch keine Listeneinträge angezeigt (weis aber nicht ob das schon mal funktionierte)
Zitat von: harry66 am 01 Oktober 2015, 20:23:56
ist ja seltsam ???
in der index-example.html werden auch keine Listeneinträge angezeigt (weis aber nicht ob das schon mal funktionierte)
wie gesagt, das Gerät unter data-device muss verfügbar sein und auch das Reading unter data-input haben, nur dann wird auch die Liste generiert.
Was spuckt FHEM aus, wenn du
list wz.SqueezPi input in der Web-Kommando-Zeile eingibst?
ok Fehler gefunden Readings(input) gab es nicht oder nicht mehr, vermute mal weil ich das SB_PLAYER aktualisiert hatte.
Ich habe jetzt data-get="currentMedia" gesetzt und siehe da meine Liste ist wieder da ;D
Ich sollte mir angewöhnen nicht immer alle Updates gleichzeitig zu machen und zwischendurch alles zu testen ::)
Danke ohne den Denkanstoß wäre ich so schnell nicht drauf gekommen.
Gruß Rolf
Ich versuche gerade ein Circlemenu mit einem Label in der Mitte zu kombinieren und dabei das Label "einzukreisen".
Es geht um ein Rollo. Ich habe hier zuerst versucht mit slider glücklich zu werden, aber irgendwie lässt der sich am Tablet nicht so leicht "greifen". In Dolphin schiebt sich das Menü sehr oft runter (wenn man im Vollbildmodus ist) und in Chrome tut sich manchmal gar nichts und man muss nachgreifen (und an meinen Fingern sollte es nicht liegen ;) ). Aber darum geht es ja grad nicht.
Folgender Code ist bisher raus gekommen:
<div data-type="circlemenu" class="cell circlemenu" data-direction="right-half" data-circle-radius="90">
<ul class="menu">
<li><div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='sz_rollo'></div>
</li>
<li><div data-type="push"
data-cmd="set"
data-device="sz_rollo"
data-set="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="sz_rollo"
data-set="75"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="sz_rollo"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="sz_rollo"
data-set="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="sz_rollo"
data-set="off"
data-icon="">zu</div></li>
</ul>
</div>
Versucht habe ich das Symbol-Widget "um" das Label rum zu setzen, oder auch "in" das Label-div reinzusetzen. Beides klappt leider nicht.
Geht das was ich vorhabe überhaupt aktuell oder müsste ich mir das label-widget angucken?
Ein Label mit Kreis drum geht nicht so aus der "Kalten". Ich habe keine schnelle Lösung parat. Kreis geht zwar, aber die Größe passt nicht.
<div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='dummy1'
class="fa-stack fa-2x">
</div>
<i class="fa fa-stack-2x fa-circle-o" id="bg"></i>
Muss ich noch etwas weiter probieren ...
Nachtrag: eventuell ist es einfacher, nur ein CSS border-radius beim Label zu benutzen. Ich werde mal eine entsprechende Klasse vorbereiten.
Zitat von: setstate am 02 Oktober 2015, 07:49:18
Ein Label mit Kreis drum geht nicht so aus der "Kalten". Ich habe keine schnelle Lösung parat. Kreis geht zwar, aber die Größe passt nicht.
Danke, das erleichtert ein bisschen, weil ich nicht zu blind war um es zu finden :)
Zitat von: setstate am 02 Oktober 2015, 07:49:18
Nachtrag: eventuell ist es einfacher, nur ein CSS border-radius beim Label zu benutzen. Ich werde mal eine entsprechende Klasse vorbereiten.
Super, vielen Dank!
Den css-Weg wäre ich dann auch angegangen, aber bis ich da durchgestiegen bin hast Du wahrscheinlich schon was fertig, wenn ich so Deine Response-Zeit in den letzten Seiten hier im Thread sehe ;)
So ich hab mich mal an eine Handy-Version gewagt und hab es bis jetzt so hin bekommen (s. Anhang).
Wenn jemand noch Ideen hat dann mal her damit...
Zitat von: Grimm80 am 02 Oktober 2015, 18:50:30
So ich hab mich mal an eine Handy-Version gewagt und hab es bis jetzt so hin bekommen (s. Anhang).
Wenn jemand noch Ideen hat dann mal her damit...
Das sieht sehr NICE aus! Respekt...
Hast du das über einzelne Seite gemacht?
Hast du etwas Code?????
Danke und Gruß
Denny
Schick schick !!
Womit sind die Sektionen gemacht? jQuery-UI ?
Sind diese auf und zuklappbar?
Wie kann man Tablet UI eigentlich rückstandslos löschen? Habe dazu nichts gefunden.
Das Verzeichnis "tablet" löschen und dann das Device "TABLETUI" löschen. Schade!
--------------------------------------------------------------------------------------------------------
Wie kann ich aus 1.3 Std. 1 Std.18 Min. machen? Also einen dezimalen Stundenwert in das Timeformat wandeln, gibt es dafür ein Widget?
Gruß Bert
Servus Freunde,
war meine Frage zu simple ? Oder einfach übersehen ? :)
Gruß
Jens
Zitat von: Jewo am 29 September 2015, 10:35:59
Hallo Zusammen,
wäre es im Simplechart machbar, das wie bei FHEM auch, die Min und Max.-Werte als Zahl angegeben werden ?
Gruß
Jens
Das UI ist mit jquery gemacht. Eigentlich recht simpel. Den Ordner "tablet" habe ich einfach nur kopiert und umbenannt (Ordner: "mobil") um damit etwas zu basteln.
Funktioniert aber direkt mit FHEM. Hoffe es gibt noch Ideen dazu.
Und ja, die Sektionen werden automatisch geschlossen wenn man die nächste anklickt. Akktuell bekomme ich aber nur immer 3 Gridster-Module da rein, da ich noch nicht fertig bin und die Höhe noch nicht dynamisch ist. Aber wenn jemand noch Tips oder ähnliches hat gebt Bescheid.
Viel spaß beim basteln.
Hier mal der Code zum bauen (index.html):
<!doctype html>
<html lang="en">
<head>
<title>FHEM-Mobil-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="115">
<meta name="widget_base_height" content="170">
<meta name="widget_margin" content="1">
<meta name='gridster_disable' content='1'>
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/mobil/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/mobil/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/mobil/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/mobil/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/mobil/fonts/nesges/style.css" />
<link rel="stylesheet" href="/fhem/mobil/css/jquery-ui.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/mobil/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/mobil/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/mobil/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/mobil/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/mobil/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/mobil/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/mobil/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'GalaxyTab4'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<script>
$(function() {
$( "#accordion" ).accordion();
});
</script>
</head>
<body>
<div id="accordion">
<h3>Musik</h3>
<div>
<p>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="3" data-sizey="1">
<table cellspacing="0" cellpadding="0" border="0" width="100%" align="center">
<tr>
<td>
<div data-type="select" data-device="audio" data-items='["AM","AUX","DVD","BLUETOOTH","SAT","FM","GAME","NET","PC","PHONO","STB/DVR","SOURCE","TV","USB"]' data-get="input" data-set="input" class="cell w2x" ></div>
</td>
<td>
<div data-type="circlemenu" class="cell circlemenu">
<ul>
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="audio" data-get="subwoofer-temporary-level" data-set="remotecontrol subwoofer-temporary-level -6" data-icon="">-6</div></li>
<li><div data-type="push" data-device="audio" data-get="subwoofer-temporary-level" data-set="remotecontrol subwoofer-temporary-level -2" data-icon="">-2</div></li>
<li><div data-type="push" data-device="audio" data-get="subwoofer-temporary-level" data-set="remotecontrol subwoofer-temporary-level 0" data-icon="">0</div></li>
<li><div data-type="push" data-device="audio" data-get="subwoofer-temporary-level" data-set="remotecontrol subwoofer-temporary-level +3" data-icon="">2</div></li>
<li><div data-type="push" data-device="audio" data-get="subwoofer-temporary-level" data-set="remotecontrol subwoofer-temporary-level +9" data-icon="">9</div></li>
<li><div data-type="push" data-device="audio" data-get="subwoofer-temporary-level" data-set="remotecontrol subwoofer-temporary-level +C" data-icon="">12</div></li>
</ul>
</div>
</td>
<td>
<div data-type="switch" data-device="audio" data-get="mute" data-get-on="on" data-get-off="off" data-set-on="mute on" data-set-off="mute off" data-icon="fa-volume-up" style="font-size:40px"></div>
</td>
<td>
<div data-type="switch" data-icon="fa-plug" data-device="audio" style="font-size:40px" class="cell"></div>
</td>
</tr>
</table>
<table cellspacing="0" cellpadding="0" border="0" width="20%" align="left">
<tr>
<td>
<div data-type="volume" data-step="0.5" data-device="audio" data-set="volume" data-get="volume" data-min="0" data-max="80" data-width="100" data-height="100" class="cell"></div>
</td>
</tr>
</table>
</li>
</ul>
</div>
</p>
</div>
<h3>Dimmer</h3>
<div>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<div data-type="volume" data-step="0.5" data-device="WZ.Dimmer_Sw" data-get="pct" data-set="pct" data-min="0" data-max="100" data-width="100" data-height="100" class="dim-back"></div>
<div data-type="label" class="cell">Wohnzimmer</div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<div data-type="volume" data-step="0.5" data-device="EZ1_OG.Dimmer_Sw" data-get="pct" data-set="pct" data-min="0" data-max="100" data-width="100" data-height="100" class="dim-back"></div>
<div data-type="label" class="cell">Esszimmer</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1.5">
<table cellspacing="0" cellpadding="0" border="0" width="100%" align="center">
<tr>
<td>
<div data-type="switch" data-device="WZ.Dimmer_Sw" class="cell"></div>
</td>
</tr>
<tr>
<td>
<div data-type="label" class="cell">Wohnzimmer</div>
</td>
</tr>
<tr>
<td>
<div data-type="switch" data-device="EZ1_OG.Dimmer_Sw" class="cell"></div>
</td>
</tr>
<tr>
<td>
<div data-type="label" class="cell">Esszimmer</div>
</td>
</tr>
</table>
</li>
</ul>
</div>
</div>
<h3>Schalter</h3>
<div>
<p>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<div data-type="switch" data-device="K1_Arbeit_Switch" class="cell"></div>
<div data-type="label" class="cell">Arbeitsplatte</div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<div data-type="switch" data-device="K2_Herd_Switch" class="cell"></div>
<div data-type="label" class="cell">Herd</div>
</li>
</ul>
</div>
</p>
</div>
<h3>Heizungen Obergeschoss</h3>
<div>
<p>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<div data-type="thermostat" data-device="WZ1_OG.Heizung_Clima" data-valve="ValvePosition" data-boost="boost" data-off="off" data-min="5" data-max="30"></div>
<div data-type="label" data-device="WZ1_OG.Heizung_Clima" data-get="measured-temp" class="big"></div>
<div data-type="label">Wohnzimmer<br></div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<div data-type="thermostat" data-device="EZ1_OG.Heizung_Clima" data-valve="ValvePosition" data-boost="boost" data-off="off" data-min="5" data-max="30"></div>
<div data-type="label" data-device="EZ1_OG.Heizung_Clima" data-get="measured-temp" class="big"></div>
<div data-type="label">Esszimmer</div>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<div data-type="thermostat" data-device="KZ1_OG.Heizung_Clima" data-valve="ValvePosition" data-boost="boost" data-off="off" data-min="5" data-max="30"></div>
<div data-type="label" data-device="KZ1_OG.Heizung_Clima" data-get="measured-temp" class="big"></div>
<div data-type="label">Kinderzimmer</div>
</li>
</ul>
</div>
</p>
</div>
<h3>Heizungen Ergeschoss</h3>
<div>
<p>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<div data-type="thermostat" data-device="WZ1_EG.Heizung_Clima" data-valve="ValvePosition" data-boost="boost" data-off="off" data-min="5" data-max="30"></div>
<div data-type="label" data-device="WZ1_EG.Heizung_Clima" data-get="measured-temp" class="big"></div>
<div data-type="label">Wohnzimmer<br></div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<div data-type="thermostat" data-device="WZ2_EG.Heizung_Clima" data-valve="ValvePosition" data-boost="boost" data-off="off" data-min="5" data-max="30"></div>
<div data-type="label" data-device="WZ2_EG.Heizung_Clima" data-get="measured-temp" class="big"></div>
<div data-type="label">Esszimmer</div>
</li>
</ul>
</div>
</p>
</div>
<h3>3D-Drucker</h3>
<div>
<p>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="2" data-sizey="1">
<img src="http://192.168.190.40/videostream.cgi?user=admin&pwd=03oktober&resolution=4&rate=1"></img>
</li>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<div data-type="switch" data-device="3D_Drucker" data-icon="fa-plug" class="cell"></div>
<div data-type="label" class="cell">3D-Drucker</div>
</li>
</ul>
</div>
</p>
</div>
</body>
</html>
Und Hier noch die Zeile für die FHEM-Übersicht:
define MOBILEUI HTTPSRV mobil/ ./www/mobil/ Mobile (test)
Wollte nur mal kurz nen Feedback an den Entwickler von Tablet UI geben ich glaub @setstate ist dafür verantwortlich.
Also ich find es Super Mega Geil was du da entwickelt hast. Somit kann ich aus meinen früheren HTML und CSS Kenntnissen von vor 10 Jahren eigentlich alles zusammenbauen was mir in den Sinn kommt. So nach und nach erkenne ich erst was überhaupt alles möglich ist mit dem Teil.
Also wirklich vielen vielen Dank dafür! Und weiter so!
Eine Idee hätte ich noch wenn es die nicht sogar schon gibt.
Wie wäre ist mit einer Art "hover" Wenn man mit dem Mauszeiger über einen Wert drüber fährt sagen wir mal die "Aussentemperatur" das man eine Box angezeigt bekommt mit beliebigen weiteren Werten z.B. "Min" & "Max" Werte. Und sobald man mit dem Mauszeiger weg fährt das die Box sich wieder schließt?
Mit freundlichen Grüßen, ein Glücklicher User ;)
Dem Statement kann ich mich nur anschließen ;D @setstate, @nesges und alle die sonst noch dazu beitragen Danke dafür! Und weiter so!
Für alle die Ihre Ideen auch anderen zur Verfügung stellen möchten kann ich noch folgendes empfehlen:
http://forum.fhem.de/index.php/topic,37378.msg296510.html#msg296510 (http://forum.fhem.de/index.php/topic,37378.msg296510.html#msg296510)
Gruß Rolf
Zitat von: bert am 03 Oktober 2015, 11:20:55
Das Verzeichnis "tablet" löschen und dann das Device "TABLETUI" löschen. Schade!
Danke! Das Modul ist sicher nicht schlecht, brauche aber etwas, das responsive ist und auf einem 320x240 Display gut aussieht ;) Werde wohl was eigenes auf Bootstrap-Basis bauen.
Eine Frage bleibt aber:
Ich würde gerne die openautomation icons/font in FHEM Tablet UI nutzen.
Folgende habe ich gemacht:
in meiner index.html:
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
habe ich das eingefügt da wo auch die anderen stylesheet definiert sind.
Dann habe ich folgendes Device:
<li data-row="7" data-col="1" data-sizex="2" data-sizey="1">
<header>Akku</header>
<div data-type="symbol" data-device="Tablet" data-get="powerLevel"
data-icons='["fa-battery-empty","fa-battery-quarter","fa-battery-half","fa-battery-three-quarters","fa-battery-full"]'
data-get-on='["0","25","50","75","100"]'
data-on-colors='["#AB0404","#F64E01","#FDAF00","#ADB203","#38B003"]'>
</div>
</li>
mit den momentanen Icons klappt es. Sobald ich aber auf "oa-measure_battery_0" usw. wechsel, wird mir nur ein 4-eckiges Icon mit 4 Ziffern in der Mitte angezeigt. Siehe Anhang
Wo ist das Problem?
Zitat von: setstate am 02 Oktober 2015, 07:49:18
Ein Label mit Kreis drum geht nicht so aus der "Kalten". Ich habe keine schnelle Lösung parat. Kreis geht zwar, aber die Größe passt nicht.
...
Muss ich noch etwas weiter probieren ...
Nachtrag: eventuell ist es einfacher, nur ein CSS border-radius beim Label zu benutzen. Ich werde mal eine entsprechende Klasse vorbereiten.
So scheint es zu klappen:
.circleborder {
border-radius: 50% !important;
border: 2px solid #ffffff;
}
Dabei kriegt das erste Listen-Element die Klasse circleborder verpasst:
<div data-type="circlemenu" class="cell circlemenu" data-direction="right-half" data-circle-radius="90">
<ul class="menu">
<li class="circleborder"><div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='ba_rollo2'
data-background-icon="fa-wrench"></div>
</li>
<li><div data-type="push"
data-cmd="set"
data-device="ba_rollo2"
data-set="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="ba_rollo2"
data-set="75"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="ba_rollo2"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="ba_rollo2"
data-set="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="ba_rollo2"
data-set="off"
data-icon="">zu</div></li>
</ul>
</div>
Jetzt stehe ich vor einer anderen Frage:
Ich würde gerne einem Symbol eine eigene JS-Funktion onClick zuweisen.
Das klappt auch prima in einer eigenen javascript-Datei mit data-type push, button oder symbol. Wobei es bei "push" in Dolphin auf dem Tablet nicht sauber klappt, da muss man neben dem Symbol "klicken" (also =touchen). Die JS-Funktion kommt dann per jQuery an das Element:
$(document).on('ready', function() {
$("#id-vom-button").click(function(){
//mach was
});
});Hierzu die Frage:
Kann ich per JavaScript dem button oder dem symbol einen "on" Status verpassen ohne dass ein reales Device dahinter hängt?
Ich hoffe, es ist verständlich, was ich meine.
Zitat von: danieljo am 03 Oktober 2015, 14:33:22
mit den momentanen Icons klappt es. Sobald ich aber auf "oa-measure_battery_0" usw. wechsel, wird mir nur ein 4-eckiges Icon mit 4 Ziffern in der Mitte angezeigt. Siehe Anhang
Wo ist das Problem?
sieht nach fehlenden openautomation.ttf Datei aus.
Stelle bitte sicher, dass alle notwendigen Dateien (openautomation.eot,openautomation.svg,openautomation.ttf,openautomation.woff) im Verzeichnis /fhem/tablet/fonts/ existieren.
Zitat von: ChrisK am 03 Oktober 2015, 21:41:21
Hierzu die Frage:
Kann ich per JavaScript dem button oder dem symbol einen "on" Status verpassen ohne dass ein reales Device dahinter hängt?
Ich hoffe, es ist verständlich, was ich meine.
Alle Widget, die auf famultibutton basieren, können mit
$(this).data('famultibutton').setOn();></div>an und mit setOff ausgeschaltet werden.
Beispiel
<div data-type="symbol"
onClick="$(this).data('famultibutton').setOn();"></div>
Statusabfrage geht mit getState()
Die circleborder Class wird beim nächsten Update offiziell mit dabei sein. Danke
Hallo
Ich benutze unter anderem einen FS20 Dimmer. Um die Lampe zu dimmen, müsste der Befehl (z.B.) "set WZ_Stehlampe dim43%" lauten.
data-set="dim" ergibt dann den Befehle "set WZ_Stehlampe dim 43"
Frage: Gibt es eine Möglichkeit, das "dim 43" ohne Leerzeichen und nachfolgendem % zu "kreieren"?
Chris
Das sieht eher nach einem Befehl für STATE aus. Gibt es nicht ein Reading, wo man den Dim Wert direkt numerisch setzen kann?
Gib mal den Output von list WZ_Stehlampe
Zitat von: setstate am 04 Oktober 2015, 09:47:33
Gib mal den Output von list WZ_Stehlampe
Output gibt:
Internals:
BTN 60
CFGFN ./FHEM/Wohnzimmer.cfg
DEF 7777 60
IODev CUL_0
LASTInputDev MyRFR
MSGCNT 2
MyRFR_MSGCNT 2
MyRFR_RAWMSG 810b04xx0101a0017777600011
MyRFR_RSSI -61
MyRFR_TIME 2015-10-04 09:53:59
NAME WZ_Stehlampe
NR 1033
STATE dim50%
TYPE FS20
XMIT 7777
Code:
1 7777 60
Readings:
2015-10-04 09:54:08 state dim50%
Attributes:
IODev CUL_0
alias Stehlampe
fm_fav 1
fm_name Stehlampe
fm_order 2
fm_type dimbutton,lamp
fm_view 0,1
fp_Wohnbereich 325,360,5,
group Einzellichter
icon light_pendant_light
model fs20di
room Wohnzimmer,Favourites
sortby 1
webCmd dim:on:off
Ach du meine Güte!!! Da ist ja garnix!? Das wäre eher ein Request an den Owner des FS20-Moduls, entspreche Standard-Readings zu implementieren, anstatt unverständliche Workarounds anzubieten.
Jede zusätzlich if Bedingung geht zu Lasten der Performance
Möglich wäre es aber ...zumal Senden eher unkritisch ist in Sachen Zeit
Nachtrag:
Es ginge bestimmt auch mit einem Userreading im FHEM plus Event-Handling für dieses Device
@outhouse, ich habe das Problem mit dem Circlemenue geloest. Dann dimmst Du zwar nur in 8 Stufen, aber es geht immerhin. Schöner wäre es natürlich, wenn zB. der slider noch einen zusätzlichen parameter bekäme ;-)
P.S. Danke an setstate und alle Beitragenden wie nesges für dieses hammergeile Modul. Ganz große Klasse, ich finde, damit wird FHEM erst familientauglich ... ;-)
Hallo,
ich bin noch sehr neu bei FHEM und dementsprechend auch bei Tablet UI, was mir übrigens sehr gefällt.
Ich bin momentan daran meinen AV-Receiver (VSX-921) darüber anzusteuern was soweit auch ganz gut funktioniert. Nur würde ich gerne die verschiedenen Radio Sender in einer "select" Auswahl auswählen können. Das Problem, für mich zumindest, ist das ich die einzelnen Favoriten jeweils über einen FS20 Schalter (die nur rein fiktiv entstehen) ansteuer. Hinter diesem liegt jeweils eine kleine Funktion:
Fav_3 {fhem("set VSX921 on;sleep 2;set VSX921 stop;sleep 2;set VSX921 input hMG; sleep 8;set VSX921 volume 40; sleep 1;set VSX921 up; sleep 1; set VSX921 up; sleep 1; set VSX921 enter;sleep 1; set VSX921 down;sleep 1; set VSX921 down; sleep 1;set VSX921 enter")}
Da ja alle unterschiedliche Namen habe (bzw. ja kein Device ist) weiß ich nicht genau wie ich diese in einer select angeben muss, wenn dies überhaupt so geht.
Eventuell kann mir ja jemand dabei helfen.
Grüße
Zitat von: danieljo am 04 Oktober 2015, 14:52:49
Die Daten sind alle in /opt/fhem/www/tablet/fonts enthalten
Welche Daten, wofür?
Was haben die Fonts mit dem Einschalten der Widgets zu tun?
Zitat von: setstate am 04 Oktober 2015, 07:59:15
Die circleborder Class wird beim nächsten Update offiziell mit dabei sein. Danke
Cool, freut mich! Danke.
Zitat von: setstate am 04 Oktober 2015, 07:59:15
Alle Widget, die auf famultibutton basieren, können mit
$(this).data('famultibutton').setOn();
an und mit setOff ausgeschaltet werden.
Klasse, danke! Genau, das was ich gesucht habe.
Mein Ziel was er eine mehrseitige UI zu erstellen, die nicht wie bei pagetab die einzelnen Seiten nachlädt, sondern alles direkt da hat.
Evtl. geht das auch mit pagetab und ich habe es nicht gefunden. In diesem Fall ignoriert den Rest hier ;)
Im Anhang hier mal eine Beispiel-index-Datei.
Im ersten gridster ist die Navigation zu finden:
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="symbol" data-color="#aa6900" data-icon="fa-lightbulb-o" class="cell small switch" id="switch_section_licht"></div>
<div data-type="label" class="cell darker">Licht</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="symbol" data-color="#aa6900" data-icon="fa-fire" class="cell small switch" id="switch_section_heizung"></div>
<div data-type="label" class="cell darker">Heizung</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="symbol" data-color="#aa6900" data-icon="fa-windows" class="cell small switch" id="switch_section_rollos"></div>
<div data-type="label" class="cell darker">Rollos</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="symbol" data-color="#aa6900" data-icon="fa-cloud" class="cell small switch" id="switch_section_wetter"></div>
<div data-type="label" class="cell darker">Wetter</div>
Die einzelnen "Seiten" sind jeweils in einem .section-div:
<div id="section_licht" class="section">
<div class="gridster">
<ul>
<li data-row="1" data-col="3" data-sizex="1" data-sizey="2">
<header>KÜCHE / ESSZIMMER</header>
<div class="container">
<div class="container top-space">
<div data-type="switch" data-device="ku_licht" class="cell"></div>
</div>
<div class="container top-space-3x">
<div data-type="switch" data-device="ez_licht" class="cell"></div>
</div>
</div>
</li>
</ul>
</div>
</div>Das ganze braucht eine .hidden-css:
.hidden {
display: none;
}
Und folgendes JavaScript:
$(document).on('ready', function() {
//erste section aktivieren
//$(".switch").first().data('famultibutton').setOn();
$(".switch").click(function(){
var myNewSectionId = $(this).attr("id");
myNewSectionId = myNewSectionId.replace("switch_","");
//alle Section-Buttons deaktivieren
$(".switch").each(function(){
$(this).data('famultibutton').setOff();
});
//alle Sections ausblenden
$(".section").hide();
//angeklickten Button aktivieren
$(this).data('famultibutton').setOn();
//angeklickten Bereich einblenden
$("#"+myNewSectionId).fadeIn();
});
});Wichtig ist also nur, dass die Navigations-Elemente eine id in der Form "switch_blabla" und die "Seiten" eine id in der Form "blabla" haben.
Klappt prima hier ;)
Vielleicht kann das ja jemand gebrauchen.
Zitat von: setstate am 04 Oktober 2015, 15:19:58
Welche Daten, wofür?
Was haben die Fonts mit dem Einschalten der Widgets zu tun?
Ich glaube, er wollte amunra zitieren ;)
Zitat von: amunra am 03 Oktober 2015, 22:01:05
sieht nach fehlenden openautomation.ttf Datei aus.
Stelle bitte sicher, dass alle notwendigen Dateien (openautomation.eot,openautomation.svg,openautomation.ttf,openautomation.woff) im Verzeichnis /fhem/tablet/fonts/ existieren.
Zitat von: amunra am 03 Oktober 2015, 22:01:05
sieht nach fehlenden openautomation.ttf Datei aus.
Stelle bitte sicher, dass alle notwendigen Dateien (openautomation.eot,openautomation.svg,openautomation.ttf,openautomation.woff) im Verzeichnis /fhem/tablet/fonts/ existieren.
Die Daten sind alle in /opt/fhem/www/tablet/fonts enthalten
Zitat von: setstate am 04 Oktober 2015, 15:19:58
Welche Daten, wofür?
Was haben die Fonts mit dem Einschalten der Widgets zu tun?
Entschuldigung ich hatte den falschen Beitrag zitiert :(
Zitat von: danieljo am 04 Oktober 2015, 18:54:12
Die Daten sind alle in /opt/fhem/www/tablet/fonts enthalten
Dein beschriebenes Verhalten konnte ich bei mir beobachten als ich eigene Fonts eigebunden habe.
Die Ursachen waren bei mir:
- Fonts Dateien nicht vorhanden (kann man nun bei Dir ausschließen)
- Pfade in der css Datei (in deinem Falls openautomation.css) nicht korrekt - es muss das hier stehen
@font-face {
font-family: 'openautomation';
src:url('../fonts/openautomation.eot');
src:url('../fonts/openautomation.eot') format('embedded-opentype'),
url('../fonts/openautomation.woff') format('woff'),
url('../fonts/openautomation.ttf') format('truetype'),
url('../fonts/openautomation.svg') format('svg');
font-weight: normal;
font-style: normal;
}- Berechtigungsproblem
Wenn du die Punkte bei Dir ausschließen kannst und Du an den Dateien keine Änderungen vorgenommen hast, dann gehen mir die Ideen aus.
So funktioniert das bei mir (FTUI Standard-Installalation):
<header>Akku</header>
<div data-type="symbol" data-device="Tablet" data-get="powerLevel"
data-icons='["oa-measure_battery_0","oa-measure_battery_25","oa-measure_battery_50","oa-measure_battery_75","oa-measure_battery_100"]'
data-get-on='["0","25","50","75","100"]'
data-on-colors='["#AB0404","#F64E01","#FDAF00","#ADB203","#38B003"]'>
</div>Vielleicht installierst Du FTUI bei dir mal neu (deine html Dateien vorher sichern nicht vergessen) -> ist ja schnell erledigt.
Viel Erfolg...
Zitat von: Jewo am 03 Oktober 2015, 11:31:41
Servus Freunde,
war meine Frage zu simple ? Oder einfach übersehen ? :)
Gruß
Jens
Da niemand darauf antwortet oder eine Lösung anbieten will 8) , habe ich das Simplechart-Widget etwas angepasst.
$min und $max kann man jetzt mit in data-caption als Platzhalter einbauen:
data-caption="min:$min°C max:$max°C"
Hallo,
ich habe eine Frage/Problem:
ich habe mir eine Tablet UI erstellt, soweit funktioniert es auch.
Schaue ich mir die Seite in Safari / FF auf einem Mac an, werden Icons (zb beim Homestatus) angezeigt.
Schaue ich mir die Seite auf dem iPhone / iPad mit Safari an, fehlen die Icons beim Homestatus nur der Text wird angezeigt.
Alle anderes Icons werden angezeigt.
Hat jemand ne Idee dazu, an was das liegen könnte??
lg
Kaiman
Das habe ich bei einem "alten" Android und unter iOS (Iphone 4S) auch.
Keine Ahnung woran das liegt, irgendein ungünstiges Laufzeitverhalten.
Beim Homestatus Widget werden die Icons anders (Text im Canvas) als bei den Switches/Symbols gezeichnet.
Das ist aber nur beim ersten Laden so. Einmal mit Pagetab auf eine andere Seite und wieder zurück - danach hat der Homostatus dann seine Icons
Vielen Dank. :)
Zitat von: setstate am 04 Oktober 2015, 22:24:28
Da niemand darauf antwortet oder eine Lösung anbieten will 8) , habe ich das Simplechart-Widget etwas angepasst.
$min und $max kann man jetzt mit in data-caption als Platzhalter einbauen:
data-caption="min:$min°C max:$max°C"
Hmm, nur damit ich sicher bin, ob ich pagetab falsch eingebaut hatte oder nicht:
Zitat von: setstate am 05 Oktober 2015, 18:54:57
Das ist aber nur beim ersten Laden so. Einmal mit Pagetab auf eine andere Seite und wieder zurück - danach hat der Homostatus dann seine Icons
Zitat von: ChrisK am 04 Oktober 2015, 15:27:30
Mein Ziel was er eine mehrseitige UI zu erstellen, die nicht wie bei pagetab die einzelnen Seiten nachlädt, sondern alles direkt da hat.
Evtl. geht das auch mit pagetab und ich habe es nicht gefunden. In diesem Fall ignoriert den Rest hier ;)
Lädt pagetab die Seiten neu oder werden die im Hintergrund vorgehalten und beim Klick eingeblendet?
Hallo zusammen,
erstmal vielen Dank für die super Arbeit, gefällt mir sehr gut.
Wo bekomm ich die eckigen Icons, siehe Bild, her? Ich finde nur Runde Icons.
Skuggy
Hallo skuggy,
sieht aus wie mein Bild?!?!? 8)
hier in einem Symbol:
<div data-type="symbol"
data-device="HomeAnwesenheit"
data-get-on='["present","absent"]'
data-icons='["fa-users","fa-user-times"]'
data-on-colors='["#2A2A2A","#2A2A2A"]'
class="cell fa-3x"
data-background-icon="fa-square"
data-background-colors='["#337ab7","#505050"]' >
</div>
hier in einem Switch:
<div data-type="switch"
data-device="HomeAutomatik"
data-icon="fa-hand-paper-o"
data-get-on="AUTOMATIK"
data-get-off="MANUELL"
class="cell fa-3x blue"
data-background-icon="fa-square">
</div>
Es ist das "data-background-icon" !!!
Gruß
Denny
Zitat von: nightstorm99 am 06 Oktober 2015, 20:14:22
Hallo skuggy,
sieht aus wie mein Bild?!?!? 8)
hier in einem Symbol:
<div data-type="symbol"
data-device="HomeAnwesenheit"
data-get-on='["present","absent"]'
data-icons='["fa-users","fa-user-times"]'
data-on-colors='["#2A2A2A","#2A2A2A"]'
class="cell fa-3x"
data-background-icon="fa-square"
data-background-colors='["#337ab7","#505050"]' >
</div>
hier in einem Switch:
<div data-type="switch"
data-device="HomeAutomatik"
data-icon="fa-hand-paper-o"
data-get-on="AUTOMATIK"
data-get-off="MANUELL"
class="cell fa-3x blue"
data-background-icon="fa-square">
</div>
Es ist das "data-background-icon" !!!
Gruß
Denny
Hallo nightstorm99,
dein Bild sieht wirklich spitze aus! Magst du den Code als Beispiel veröffentlichen?
Vielen lieben Dank im Voraus!
VG
Patrick
Hallo nightstorm99,
stimmt ist dein Bild...
Funktioniert es auch als Button?
Am Code hätte ich auch Interesse.
Vielen Dank
Zitat von: P.A.Trick am 06 Oktober 2015, 20:26:00
Hallo nightstorm99,
dein Bild sieht wirklich spitze aus! Magst du den Code als Beispiel veröffentlichen?
Vielen lieben Dank im Voraus!
VG
Patrick
Hallo Patrick,
ich muss noch einige Sachen ordentlich machen und meine zusätzlichen Seiten an mein neues Layout anpassen, dann
kann ich den Code gerne Online stellen. Könnte aber noch etwas dauern.
Soll das dann in die USER_DEMOS auf GitHub ?
Gruß
Denny
Zitat von: matrois am 30 September 2015, 13:21:53
@setstate: Wenn ggf. eine ergänzende Funktionalität in der Richtung im Button Widget integriert wird warte ich erstmal ab. Vielen Dank. Falls vor dem Release noch Betatester gebraucht werden stelle ich mich gerne bereit.
Gibt es schon was Neues in Sachen Button Widget und Einfärben in Abhängigkeit von der URL? (Ich hoffe ich habe es nicht überlesen...)
Außerdem möchte ich mich (nochmal) als Betatester anbieten um ggf. bereits existierende Lösungen für mein Problem zu testen und zu optimieren.
Zitat von: nightstorm99 am 07 Oktober 2015, 08:18:37
Hallo Patrick,
ich muss noch einige Sachen ordentlich machen und meine zusätzlichen Seiten an mein neues Layout anpassen, dann
kann ich den Code gerne Online stellen. Könnte aber noch etwas dauern.
Soll das dann in die USER_DEMOS auf GitHub ?
Gruß
Denny
Hi Denny, cool der Code muss nicht perfekt sein, denn mir geht's um das Layout.....das sieht nämlich spitze aus!
Zum Ablageort: Mir ist es persönlich egal, hauptsache online ;-)
Vielen Dank im Voraus!
LG
Patrick
Zitat von: matrois am 07 Oktober 2015, 18:38:43
Gibt es schon was Neues in Sachen Button Widget und Einfärben in Abhängigkeit von der URL? (Ich hoffe ich habe es nicht überlesen...)
Außerdem möchte ich mich (nochmal) als Betatester anbieten um ggf. bereits existierende Lösungen für mein Problem zu testen und zu optimieren.
Sorry, hatte ich doch etwas verdrängt ...
ich habe mal eine Beta angehangen zum Testen. Einfach so einbauen:
<div data-type="button" data-url="index_3.html" data-icon="fa-tv" class="red"></div>
<div data-type="button" data-url="index_4.html" data-icon="fa-line-chart" class="red"></div>
Zitat von: setstate am 19 September 2015, 09:12:27
Das stimmt so. Ist nach der Optimierung jetzt so besser. Vorher wurde einfach zu oft geladen und refresht. Das sah man im Netzwerkmonitor des Browsers und fhem log. Hier gab einen kurzen Hinweis: http://forum.fhem.de/index.php/topic,34233.msg330221.html#msg330221 (http://forum.fhem.de/index.php/topic,34233.msg330221.html#msg330221)
Man muss jetzt zusätzlich ein Device angeben, das das Update triggert.
<div data-type="simplechart"
data-device="THSensorWZ"
data-logdevice="FileLog_THSensorWZ"
data-columnspec="4:temperature"
data-minvalue="10"
data-maxvalue="30"
data-height="60"
data-width="90"
class="noticks">
</div>
data-get="STATE" habe ich hier weggelassen, weil das intern schon per Default gesetzt ist. Nur wenn man data-get auf ein anderes Reading setzen will, muss das angegeben werden.
data-device finde ich in der Github-Doku nicht ... und deshlab ist es wohl auch nicht im Wiki
Zitat von: Nobby1805 am 07 Oktober 2015, 20:05:16
data-device finde ich in der Github-Doku nicht ... und deshlab ist es wohl auch nicht im Wiki
:D Doch unter
ZitatAll widgets
:D
Wie bekomme ich das Tablet UI wieder "deinstalliert" ? ::)
greez@all
Sash
@Sash.sc
Ein paar Seiten vorher findest du die Info:
http://forum.fhem.de/index.php/topic,34233.msg339731.html#msg339731
Einfach das entsprechende Verzeichnis löschen und dann dem httpsrv Eintrag in deiner fhem.cfg
Schade eigentlich...Tablet UI läuft bei mir seit Monaten stabil und perfekt und ist so einfach zu individualisieren...
Hallo,
ich möchte gerne mit einem "switch" ein MAX! Thermostat zwischen Automatik und Manuellem Betrieb umschalten. Grundsätzlich funktioniert dies mit folgenden Kommandos:
set wz_Wandthermostat desiredTemperature auto
set wz_Wandthermostat desiredTemperature 5
mit folgender Konfiguration wird das Symbol des Switch beim Laden mit dem richtigen Status angezeigt:
<div data-type="switch"
data-icon="fa-car"
data-device="wz_WandThermostat"
data-cmd="set desiredTemperature"
data-get="mode"
data-get-on="auto"
data-get-off="manual"
data-set-on="auto"
data-set-off="5"
class="cell small">
</div>
Allerdings wird beim Anklicken des Switches folgendes Kommando gesendet:
set desiredTemperature wz_Wandthermostat auto
<Device> und <command> sind also vertauscht.
Habe zum test mal folgendes gemacht:
data-device="desiredTemperature"
data-cmd="set wz_WandThermostat"
Mir ist bewusst, dass dies nicht korrekt sein kann, allerdings wird mit dieser Konfiguration der korrekte Befehl abgesetzt, jedoch der Symbolstatus falsch wiedergegeben, was klar ist da es kein Device mit dem Namen "desiredTemperature" gibt...
Meine Frage wäre nun, wie ich den Parameter data-cmd beschreiben muss um den gewünschten Befehl absetzen zu können.
Vielen Dank vorab Gruß
Mirko
Ich gebe mir die Antwort selbst, es kann so einfach sein...
<div data-type="switch"
data-icon="fa-car"
data-device="wz_WandThermostat"
data-cmd="set"
data-get="mode"
data-get-on="auto"
data-get-off="manual"
data-set-on="desiredTemperature auto"
data-set-off="desiredTemperature 5"
class="cell small">
</div>
Zitat von: setstate am 04 Oktober 2015, 22:24:28
Da niemand darauf antwortet oder eine Lösung anbieten will 8) , habe ich das Simplechart-Widget etwas angepasst.
$min und $max kann man jetzt mit in data-caption als Platzhalter einbauen:
data-caption="min:$min°C max:$max°C"
Sehr schön!
Ich habe mir noch eine $cur eingebaut, um die aktuelle Temperatur mit anzuzeigen:
data-caption="Schlafzimmer - $cur°C [$min°C-$max°C]"In der widget_simplechart.js aus dem (ab Zeile 271):
caption=caption.replace('$min',Math.min.apply(null, vals))
.replace('$max',Math.max.apply(null, vals));
das hier machen:
caption=caption.replace('$min',Math.min.apply(null, vals))
.replace('$max',Math.max.apply(null, vals))
.replace('$cur',vals[vals.length-1])
;
Das war's schon ;)
Zitat von: setstate am 07 Oktober 2015, 20:20:35
:D Doch unter :D
:-[ OK, dann werde ich auch das Wiki mal überarbeiten ;)
Hallo zusammen,
erst einmal vielen Dank für das Tablet UI. Der Ansatz über HTML und CSS gefällt mir persönlich sehr gut und ist für mich sehr zugänglich im Vergleich mit anderen Frontends.
Aktuell habe ich allerdings ein Verständnis-Problem mit simplechart:
<div data-type="simplechart" data-logdevice="myDBLog" data-logfile="HISTORY" data-columnspec="Thermostat_Wohnzimmer_Clima:measured-temp"></div>Ich versuche zu meinen Homematic Thermostaten aus der DBLog die gemessene Temperatur darzustellen.
Analog zu einem Vorposter habe ich aus dem "preprocessed input" der SVG-Diagramme folgende Zeile ausgewertet:
get myDBLog HISTORY INT 2015-10-08_00:00:00 2015-10-09_00:00:01 Thermostat_Wohnzimmer:measured-tempWeiter unten findet sich noch folgender Eintrag:
Thermostat_Wohnzimmer:measured-temp:::aus welchem ich den columnspec laut Commandref geschlossen habe.
Ausprobiert habe ich folgende Varianten:
- Thermostat_Wohnzimmer_Clima:measured-temp
- Thermostat_Wohnzimmer:measured-temp
- Thermostat_Wohnzimmer_Clima:measured-temp::int:
und weitere verschiedene Umbauten des Ausdrucks.
Ergebnis ist immer das Selbe - siehe Screenshot.
Könnt ihr mir hier weiterhelfen?
Viele Grüße
Martin
Zitat von: Deathevn am 08 Oktober 2015, 09:40:48
Könnt ihr mir hier weiterhelfen?
Ich habe es mit diesem Attribut hinbekommen:
data-columnspec="4:meas.*:1:int"Hab ich von setstates Beitrag hier (http://forum.fhem.de/index.php/topic,34233.msg281413.html#msg281413)
Hi Chris,
leider führt das auch nicht zum Erfolg.
Sollte der String nicht eigentlich auch nur auf ein LogFile matchen?
Die 4 findet sich ja so gar nicht in der Datenbank wieder.
Viele Grüße
Martin
Zitat von: Deathevn am 08 Oktober 2015, 10:32:06
Sollte der String nicht eigentlich auch nur auf ein LogFile matchen?
Die 4 findet sich ja so gar nicht in der Datenbank wieder.
Hi Martin,
sorry, hab das mit der DB komplett überlesen.
Meine Charts gucken alle auf filelogs, kann also nicht wirklich weiterhelfen.
Aber zum Glück bin ich ja nicht der einzige hier ;)
Zitat von: Deathevn am 08 Oktober 2015, 09:40:48
Könnt ihr mir hier weiterhelfen?
Damit sollte es funktionieren (tut es zumindest bei mir):
<div data-type="simplechart"
data-device="myDBLog"
data-logdevice="myDBLog"
data-logfile="HISTORY"
data-columnspec="Thermostat_Wohnzimmer_Clima:measured-temp"
data-minvalue="0"
data-maxvalue="30">
</div>
Zitat von: mrbreil am 11 September 2015, 20:06:00
Ich habe ein kleines Problem damit wie ich das reload Widget benutze.
Habe es laut wie laut Bespiel eingefügt:
<div data-type="reload" data-device="RELOAD" data-get="action" data-reload-on="1" data-reset-to="0"></div>
Wie starte ich jetzt eine Aktualisierung der Seite?
Stehe vor der gleichen Frage, gibt es eine Antwort darauf?
Habe ein dummy RELOAD angelegt, wenn ich dieses manuell mit 0 oder 1 beschreibe tut sich nichts. Lasse ich den teil data-get="action" weg, wird bei RELOAD=1 zyklisch, endlos aktualisiert, bis RELOAD=0 gesetzt wird.
Was ich damit vor habe:
Ich verwende ein Popup für die Temperatur / Betriebsart Einstellung eines MAX! Thermostats.
- Schalte ich die Betriebsart mit einem Switch um, ändert sich sofort das Symbol, leider jedoch nicht das Label welches die Betriebsart anzeigt. (PopUpTempBetriebsartAsynchron.png)
- Um dieses zu aktualisieren muss ich das Popup schließen, einen Page Reload machen und das Popup erneut öffnen. (PopUpTempBetriebsartSynchronNachReload.png)
Meine Idee ist nun das Reload Widget dafür zu verwenden. Passt das oder geht dies Eleganter? Würde mich ebenfalls über Beispielcode freuen wie das umsetzbar wäre.
Warum lässt du das Label nicht auf eine Device + Reading schauen, was den aktuellen Betriebsmode enthält.
Mit Longpoll wird das dann sofort aktualisiert.
Zitat von: amunra am 08 Oktober 2015, 18:05:48
Damit sollte es funktionieren (tut es zumindest bei mir) [...]
Super, danke!
Mit fehlte das data-device, würde auch meinen, dass ich das auch in den vorherigen Beiträgen nicht gesehen hatte und bin auch davon ausgegangen, dass man es hier nicht benötigt.
Jetzt funktioniert es jedenfalls.
Viele Grüße
Martin
Ich wollte mir gerade eine Userdemo hier (https://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui)) runterladen (bin eingeloggt).
Leider ist in den heruntergeladenen html-Dateien nicht der richtige Code enthalten. Mache ich etwas falsch?
Zitat von: setstate am 08 Oktober 2015, 23:05:29
Warum lässt du das Label nicht auf eine Device + Reading schauen, was den aktuellen Betriebsmode enthält.
Mit Longpoll wird das dann sofort aktualisiert.
Im Prinzip habe ich das so, <meta name="longpoll" content="1">
<div data-type="label"
data-device="wz_WandThermostat"
data-get="mode"
class="inline cell top-space-2x big">
/div>
Dies funktioniert auf der normalen Website, jedoch nicht bei einem geöffnetem Popup. Dieses muss ich erst schließen, einen PageReload machen und das Popup neu öffnen, dann stimmts.
Zitat von: Gunther am 08 Oktober 2015, 23:17:31
Ich wollte mir gerade eine Userdemo hier (https://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui)) runterladen (bin eingeloggt).
Leider ist in den heruntergeladenen html-Dateien nicht der richtige Code enthalten. Mache ich etwas falsch?
Es spielt nicht alles sofort out of the box. Die HTML sind nur Beispiel als Kopiervorlage und das Projekt mehr ein Framework als eine fertiges Userinterface. Man muss die Widgets an seine eigenen Devices anpassen.
Zitat von: mircoby am 08 Oktober 2015, 23:26:25
Im Prinzip habe ich das so, <meta name="longpoll" content="1">
<div data-type="label"
data-device="wz_WandThermostat"
data-get="mode"
class="inline cell top-space-2x big">
/div>
Dies funktioniert auf der normalen Website, jedoch nicht bei einem geöffnetem Popup. Dieses muss ich erst schließen, einen PageReload machen und das Popup neu öffnen, dann stimmts.
aha!? muss ich mir anschauen, hätte ich nicht gedacht :-[
Zitat von: setstate am 09 Oktober 2015, 07:23:26
aha!? muss ich mir anschauen, hätte ich nicht gedacht :-[
Das wäre super. Der Vollständigkeithalber hier die komplette section:
<li data-row="2" data-col="6" data-sizex="1" data-sizey="1">
<header>Wohnzimmer</header>
<div data-type="popup" data-width="328" data-height="500">
<div data-type="label"
data-device="wz_WandThermostat"
data-get="temperature"
data-unit="%B0C%0A"
class="inline cell top-space-2x big">
</div>
<div data-type="reload"
data-device="RELOAD"
data-get="action"
data-reload-on="1"
data-reset-to="0">
</div>
<div class="dialog">
<table>
<tr><td>
<header>Temperatur Wohnzimmer</header>
<div data-type="thermostat"
data-device="wz_WandThermostat"
data-get="desiredTemperature"
data-set="desiredTemperature auto"
data-temp="temperature"
data-valve="valveposition"
data-off="off"
data-boost="boost"
data-step="0.5"
data-min="10"
data-max="25"
data-angleoffset="0"
data-width="300"
data-height="300"
class="cell top-space-2x">
</div>
</td></tr>
<tr><td>
<header>Betriebsart</header>
<div data-type="switch"
data-icon="fa-car"
data-device="wz_WandThermostat"
data-cmd="set"
data-get="mode"
data-get-on="auto"
data-get-off="manual"
data-set-on="desiredTemperature auto"
data-set-off="desiredTemperature 5"
class="cell top-space-2x">
</div>
<div data-type="label"
data-device="wz_WandThermostat"
data-get="mode"
class="inline cell top-space-2x big">
</div>
</td></tr>
</div>
</table>
</div>
</li>Der Bereich RELOAD ist noch nicht wirklich funktional, da bin ich noch am experimentieren. Im idealfall kann er entfallen.
Sollte das demnächst funktionieren, möchte ich noch folgendes umsetzen:
Abhängig vom Zustand des Readings mode (kann "auto" oder "manuell" sein) möchte ich gerne beim verstellen der Temperatur den "set" Befehl verändern.
Dies hat folgenden Hintergrund:
- Aktuell wird immer gesendet: "set wz_Wandthermostat desiredTemperature <value> auto"
- Dies führt dazu das der veränderte Wert übernommen wird, der automatikmodus aktiviert ist/wird und ab dem nächsten zeitlichen Schaltpunkt die Automatik weiter läuft (für die meisten fälle OK).
- Möchte ich jedoch die Heizung auf Manuell und eine bestimmte Temperatur einstellen, so ist dies aktuell nicht möglich. Es funktioniert nur manuell, mit der vordefinierten Temperatur (in diesem Beispiel 5 Grad Celcius).
Es müsste also der Abschnitt "data-set-on=" in Abhängigkeit von data-get="mode" des wz_Wandthermostat verändert werden.
auto: data-set-on="desiredTemperature auto"
manuell: data-set-on="desiredTemperature"
Lässt sich sowas evtl mit einer RegEx lösen? Falls das alles zu kompliziert wird, muss ich mir ein anderes Bedienkonzept überlegen.
10 mal durchgelesen, ich erfasse es aber immer noch nicht. :-\
Es ist mir zu vermischt. Der Switch für den Mode und der Thermostat für die Einstellung der Solltemp.
Aber jetzt gibt es beim Thermostat auch Modusangaben mit und beim Switch Temperaturen, das verwirrt mich.
Beim Thermostat würde ich nicht mit Mode hantieren, nur Temp einstellen. Wenn man beim Switch Mode und gleich eine feste Temp einstellen will, kann man im data-set-on mit Semikolon mehrere FHEM Befehle aneinanderreihen. Nach dem ersten Semikolon muss man aber den vollen Befehl angeben. Also: set wz_* desiredTemp 5
<div data-type="switch"
data-icon="fa-car"
data-device="wz_WandThermostat"
data-cmd="set"
data-get="mode"
data-set="mode"
data-get-on="auto"
data-get-off="manual"
data-set-on="auto;set wz_WandThermostat desiredTemperature 20"
data-set-off="manual;set wz_WandThermostat desiredTemperature 5"
class="cell top-space-2x">
</div>
Hallo,
ich bin gerade dabei mit der Tablet UI zu spielen, dabei ist mir aufgefallen das bei mir die Webseite oft nicht richtig geladen wird. Teilweise wird sieht man sogar nur den Inhalt irgend einer JavaScript Datei oder CSS-Datei. Manchmal werden auch einfach nur nicht die Images geladen oder Werte. Liegt das jetzt daran das mein RasPI Model B das nicht schafft oder am Apache als Reverse Proxy davor oder direkt an Tablet UI? Hat jemand auch schon solche Erfahrungen gemacht oder hat einen Tipp woran es liegen könnte.
Viele Grüße
Stefan
Wie angekündigt, habe ich für Euch vom genialen Tablet-UI einen Blog-Beitrag geschrieben. Es wäre zu schade, wenn Tablet-UI in den unendlichen Weiten des Forums untergehen würde.
http://blog.moneybag.de/fhem-alternatives-frontend-fuer-fhem-tablet-ui/
LG
/robin
Zitat von: setstate am 09 Oktober 2015, 08:57:41
10 mal durchgelesen, ich erfasse es aber immer noch nicht. :-\
Es ist mir zu vermischt. Der Switch für den Mode und der Thermostat für die Einstellung der Solltemp.
Aber jetzt gibt es beim Thermostat auch Modusangaben mit und beim Switch Temperaturen, das verwirrt mich.
Beim Thermostat würde ich nicht mit Mode hantieren, nur Temp einstellen. Wenn man beim Switch Mode und gleich eine feste Temp einstellen will, kann man im data-set-on mit Semikolon mehrere FHEM Befehle aneinanderreihen. Nach dem ersten Semikolon muss man aber den vollen Befehl angeben. Also: set wz_* desiredTemp 5
<div data-type="switch"
data-icon="fa-car"
data-device="wz_WandThermostat"
data-cmd="set"
data-get="mode"
data-set="mode"
data-get-on="auto"
data-get-off="manual"
data-set-on="auto;set wz_WandThermostat desiredTemperature 20"
data-set-off="manual;set wz_WandThermostat desiredTemperature 5"
class="cell top-space-2x">
</div>
Habe mich vielleicht ein wenig zu kompliziert ausgedrückt... Bzw. unvollständig, wenn man das MAX! System nicht im Detail kennt.
- Grundsätzlich gibt es die Betriebsarten "auto" und "manuell".
- auto bedeutet Solltemperaturen werden nach Zeitprogramm angefahren
- manuell, wie der name schon sagt. Die eingestellte Temperatur wird "für alle Ewigkeit" gehalten.
Soweit so gut. Typischerweise nutze ich den Automatikmodus. Wenn ich jetzt eine Temperatur verstellen möchte (ohne den Automatikmodus zu verlassen) mache ich das so:
- set wz_WandThermostat desiredTemperature <value> auto
Lässt man das "auto" am ende weg (set wz_WandThermostat desiredTemperature <value>), wird der Sollwert gesetzt und das Thermostat in den manuellen Modus geschaltet, das ist die Krücke.
Ich muss daher je nach dem ob ich im Automatikmodus bleiben will das "auto" mitsenden, oder wegelassen, falls ich den manuellen Modus haben möchte.
Das Umschalten des modus erfolgt daher immer mit einem "set wz_WandThermostat desiredTemperature", also mit dem setzen einer Temperatur, nicht eines modes.
Hallo microby (krrrkrrr),
ich muss noch bisschen doof nachfragen ...
Das Thermostat sendet doch in der jetzigen Version das so, oder hast du da schon was umgebaut?
Zitatset wz_Wandthermostat desiredTemperature auto <value>
und nicht wie du brauchst
Zitatset wz_Wandthermostat desiredTemperature <value> auto
zweite Frage: du brauchst Änderungen am data-set-on für den Switch (Post #2627)? Warum genau? Kann Max! nicht
Zitatset wz_Wandthermostat mode manual
verarbeiten, das muss auch über desiredTemperature passieren?
Zitat von: fh168 am 09 Oktober 2015, 18:24:39
Wie angekündigt, habe ich für Euch vom genialen Panel-UI einen Blog-Beitrag geschrieben. Es wäre zu schade, wenn Panel-UI in den unendlichen Weiten des Forums untergehen würde.
http://blog.moneybag.de/fhem-alternatives-frontend-fuer-fhem-panel-ui
LG
/robin
Hallo Robin,
vielen Dank für deinen Blog-Beitrag. Super Sache das!
Du hast Recht, FTUI ist ausserhalb des "FHEM Forum » FHEM » Frontends »" Kosmos kaum bekannt.
Aber dass der Thread hier so viel Resonanz findet ist unglaublich. Es erstaunt und erfreut mich jeden Tag aufs neue.
Vielen Dank für Nutzen/Probieren von FTUI :-)
Zitat von: setstate am 09 Oktober 2015, 20:32:01
Hallo microby (krrrkrrr),
ich muss noch bisschen doof nachfragen ...
Das Thermostat sendet doch in der jetzigen Version das so, oder hast du da schon was umgebaut?
und nicht wie du brauchst
zweite Frage: du brauchst Änderungen am data-set-on für den Switch (Post #2627)? Warum genau? Kann Max! nicht verarbeiten, das muss auch über desiredTemperature passieren?
Kein Thema, dafür ist das Forum ja da...
Zur ersten Frage: Das Thermostat sendet "auto <value>" das passt auch. Habe nichts daran geändert. Brauche es nicht anders herum das war ein Denkfehler, sorry.
Was ich bräuchte wäre der data-set-on="" Befehl abhängig von dem Betriebsmode des Thermostats.
Im auto mode: data-set-on="set wz_WandThermostat desiredTemperature auto <value>"
Im manuell mode: data-set-on="set wz_WandThermostat desiredTemperature <value>"
Zur zweiten Frage: Max kann den mode leider nur über desiredTemperature umschalten. Versuche ich es wie Du vorgeschlagen hast mit set wz_Wandthermostat mode manual kommt die Fehlermeldung "Unknown Argument mode..."
Zitat von: setstate am 09 Oktober 2015, 06:17:02
Es spielt nicht alles sofort out of the box. Die HTML sind nur Beispiel als Kopiervorlage und das Projekt mehr ein Framework als eine fertiges Userinterface. Man muss die Widgets an seine eigenen Devices anpassen.
Das habe ich verstanden.
Wenn ich z. B. rein die index.html von Phil verwende sehe ich unter meinem FHEM-Tablet-Link http://192.168.0.22:8083/fhem/ftui/ das angehängte Bild. Warum sehe ich nicht die Tablet-Oberfläche?
Ich finde in der index.html keinen Code, der sich auf die Oberfläche bezieht. Ich hoffe, ich drücke mich verständlich aus.
So sieht die heruntergeladene Datei aus.
Zitat von: Gunther am 10 Oktober 2015, 09:54:54
Wenn ich z. B. rein die index.html von Phil verwende sehe ich unter meinem FHEM-Tablet-Link http://192.168.0.22:8083/fhem/ftui/ das angehängte Bild. Warum sehe ich nicht die Tablet-Oberfläche?
Ich finde in der index.html keinen Code, der sich auf die Oberfläche bezieht. Ich hoffe, ich drücke mich verständlich aus.
Hallo Gunter,
da hast du vermutlich etwas falsches heruntergeladen. Das ist keine index.html für FHEM Tablet UI.
Lade das zip runter und nimm daraus eine index.html deiner Wahl.
Hier der direkte Link zum Klicken:
https://github.com/ovibox/fhem-ftui-user-demos/archive/master.zip
Auf der Githubseite ist der Link rechts unten und sieht so aus:
Daaaanke Dir! Ich war einfach vernebelt! Direkt die Dateien runterzuladen scheint nicht zu klappen.
Jetzt kann es losgehen :-)
Zitat von: mircoby am 08 Oktober 2015, 23:26:25
Dies funktioniert auf der normalen Website, jedoch nicht bei einem geöffnetem Popup. Dieses muss ich erst schließen, einen PageReload machen und das Popup neu öffnen, dann stimmts.
Ich sehen Grund, warum das nicht klappen soll. Rein aus der Implementierung her und gerade habe ich es bei mir getestet. Ein Label und auch ein Switch werden auch auf einem Popup-Dialog per Longpoll refreshed
Deshalb sehe ich hier keine Notwenigkeit von Reload.
Achtung! Das longpoll startet erst nach 10 Sekunden.
Hallo!
Gibt es eigentlich irgendeine Möglichkeit, dass ein "push"-Button auch je nach State eingefärbt ist?
Explizit geht es mir um:
<div class="cell">
<div class="doublebox-h">
<div data-type="push" data-device="aJs_Schlafzimmer"
data-icon="fa-angle-up" data-background-icon="fa-square-o"
data-set="up">
</div>
<div data-type="push" data-device="aJs_Schlafzimmer"
data-icon="fa-angle-down" data-background-icon="fa-square-o"
data-set="down">
</div>
</div>
</div>
--> Wenn die Jalousie ganz unten ist, soll der Button "runter" sich einfärben und umgekehrt.
Ist das möglich?
Danke und Grüße
Phil
Zitat von: Stril am 10 Oktober 2015, 12:07:34
Hallo!
Gibt es eigentlich irgendeine Möglichkeit, dass ein "push"-Button auch je nach State eingefärbt ist?
Explizit geht es mir um:
<div class="cell">
<div class="doublebox-h">
<div data-type="push" data-device="aJs_Schlafzimmer"
data-icon="fa-angle-up" data-background-icon="fa-square-o"
data-set="up">
</div>
<div data-type="push" data-device="aJs_Schlafzimmer"
data-icon="fa-angle-down" data-background-icon="fa-square-o"
data-set="down">
</div>
</div>
</div>
--> Wenn die Jalousie ganz unten ist, soll der Button "runter" sich einfärben und umgekehrt.
Ist das möglich?
Danke und Grüße
Phil
Hallo Phil,
Push hat die Update-Funktion nicht implementiert, kann also nicht auf Änderungen reagieren. Man müsste das mit Switch oder Button probieren. Ähnlich wie hier http://forum.fhem.de/index.php/topic,34233.msg330879/topicseen.html#msg330879 (http://forum.fhem.de/index.php/topic,34233.msg330879/topicseen.html#msg330879)
@microby:
hilft das weiter:
<div data-type="thermostat"
data-device="wz_WandThermostat"
data-get="desiredTemperature"
data-set="desiredTemperature"
data-temp="temperature"
data-valve="valveposition"
data-mode="mode"
data-off="off"
data-boost="boost"
data-step="0.5"
data-min="10"
data-max="25"
data-angleoffset="0"
data-width="300"
data-height="300"
class="cell top-space-2x">
</div>
Das Thermostat liest den Wert unter data-mode="mode" aus, wenn gleich 'auto' dann wird "set wz_WandThermostat desiredTemperature auto <value>" gesendet. Bei allen anderen Varianten "set wz_WandThermostat desiredTemperature <value>"
Mit dem abgehangenen geänderten Thermostat
Zitat von: setstate am 10 Oktober 2015, 13:10:29
@microby:
hilft das weiter:
<div data-type="thermostat"
data-device="wz_WandThermostat"
data-get="desiredTemperature"
data-set="desiredTemperature"
data-temp="temperature"
data-valve="valveposition"
data-mode="mode"
data-off="off"
data-boost="boost"
data-step="0.5"
data-min="10"
data-max="25"
data-angleoffset="0"
data-width="300"
data-height="300"
class="cell top-space-2x">
</div>
Das Thermostat liest den Wert unter data-mode="mode" aus, wenn gleich 'auto' dann wird "set wz_WandThermostat desiredTemperature auto <value>" gesendet. Bei allen anderen Varianten "set wz_WandThermostat desiredTemperature <value>"
Mit dem abgehangenen geänderten Thermostat
Hey super vielen Dank! Bin begeistert von Deiner Unterstützung!
Mit dem neuen widget_thermostat.js kann jetzt die Temperatur korrekt verstellt werden ohne Beeinflussung der Betriebsart, sehr schön!
Eine Einschränkung gibt es allerdings noch, die mit einem Reload zu tun hat.
Folgendes Beispiel:
- Max! System steht auf automatischer Betriebsart
- popup wird geöffnet Temperatureinstellung ohne mode Änderung möglich, alles ok.
- Ändert man jetzt den mode auf manuell über den Switch Button wird dieser an das Thermostat gesendet, soweit ist auch noch alles ok.
- Jetzt darf jedoch keine Änderung der Temperatur am Regler vorgenommen werden, da dieser noch den Zustand auto hat und somit wieder in den automodus zurück schalten würde.
- damit der Zustand korrekt übernommen wird, muss nach dem Umschalten des Modus zunächst einen Seiten reload gemacht werden, dann klappt dies.
Siehst Du eine Möglichkeit dies im Hintergrund laufen zu lassen? Oder evtl. beim Anklicken des Mode Switches das popup automatisch zu schließen und ein reload anzustoßen um unerwartetes Verhalten zu vermeiden?
P.S.: Beim vergleichen der .js konnte ich gleich noch den === Operator kennenlernen... Wieder was gelernt.
Ich habe vor ein paar Tagen die TabletUI Module aktualisiert ...
Seitdem werden von meinen 10 Simplecharts nur noch 2 aktualisiert ... diese beiden basieren auf einem Aussenfühler, die anderen 8 auf einem Thermostaten
Der Thermostat hat im Unterschied zum Aussenfühler ja Channel, kann es daran liegen ?
Zitat von: Nobby1805 am 10 Oktober 2015, 19:23:25
Ich habe vor ein paar Tagen die TabletUI Module aktualisiert ...
Seitdem werden von meinen 10 Simplecharts nur noch 2 aktualisiert ... diese beiden basieren auf einem Aussenfühler, die anderen 8 auf einem Thermostaten
Der Thermostat hat im Unterschied zum Aussenfühler ja Channel, kann es daran liegen ?
data-device hinzufügen, als Trigger des updates
http://forum.fhem.de/index.php/topic,34233.msg330221/topicseen.html#msg330221 (http://forum.fhem.de/index.php/topic,34233.msg330221/topicseen.html#msg330221)
Habe ich (natürlich) schon gemacht ...
<div data-type="simplechart"
data-logdevice="FileLog_Aussen"
data-device="Aussen"
data-columnspec="4:Aussen.temperature:1:"
data-minvalue="[20,10,5,0]"
data-maxvalue="[20,30,34]"
data-yticks="4"
data-xticks="720"
data-daysago="1"
data-caption=""> </div>
...
<div data-type="simplechart"
data-logdevice="FileLog_Innen_Thermostat"
data-device="Innen4"
data-columnspec="4:Innen4.Weather.temperature:1:"
data-minvalue= "18""
data-maxvalue="30"
data-yticks="2"
data-xticks="720"
data-daysago="1"
data-caption=""> </div>
Guten Abend,
habe ebenfalls zuletzt die FTUI mit dem aktuellen Update versorgt und eben festgestellt, dass meine Spritpreise nicht mehr angezeigt werden.
Die normalen Readings in FHEM passen soweit und aktualisieren sich fleißig. Aber die Übertragung zur Tablet UI leider nicht mehr.
Habe danach ein bischen mit den Attributen beim Device TS_SB experimentiert, aber dabei das TS_Ebmeyer im Originalzustand belassen, zum Vergleich.
Vielleicht hat von Euch jemand eine Idee woran es haken kann...
Vielen Dank vorweg!
Tablet UI
<li data-row="2" data-col="2" data-sizex="1" data-sizey="2">
<header>SPRITPREISE</header>
<div data-type="image" data-url="./images/sb.png" data-size="50%"></div>
<div type="label" data-device="TS_SB" data-get="STATE" class="inline"></div>
<div data-type="label" class="cell" >Diesel</div>
<div data-type="image" data-url="./images/feha.png" data-size="50%"></div>
<div type="label" device="TS_Ebmeyer" data-get="Diesel" data-unit="€" style="font-size:x-large;color:#aa6900;"></div>
<div data-type="label" class="cell" >Diesel</div>
</li>
FHEM
NAME TS_SB
STATE Liter_Diesel: 1.27
Readings
Diesel 1.27 2015-10-11 00:36:58
SuperE5 1.47 2015-10-11 00:36:58
Ich bin gerade dabei erstmal die Grundeinstellungen zu finden um die Tablet UI auf meinen Tabletts (800x480) angezeigt zu bekommen.
Siehr soweit gut aus, außer, dass ich unten auf dem Display des Tabletts mit dem Browser WebViewControl den Text der unteren Buttons nicht angezeigt bekomme.
Die folgenden Einstellungen habe ich derzeit:
<meta name="widget_base_width" content="144">
<meta name="widget_base_height" content="120">
Vermutlich brauche ich widget_base_height in ca. "105". Dann ist aber das Bild abgeschnitten - auch in einem großen Browser.
Wie kann ich die Icons für die Buttons selbst etwas verkleinern? Oder gibt es eine einfachere Möglichkeit?
Da muss man probieren, zwischen Basis-Höhe und Anzahl Zeilen das richtige Verhältniss zu finden.
Ich habe zum Beispiel
<meta name="widget_base_height" content="71"> und 5 Zeilen
Beim Thermostat-Widget wird ja die "desired-temp" in der Mitte groß dargestellt und die "measured-temp" klein in der Skala.
Gibt es eine Möglichkeit, diese beiden Werte in der Anzeige zu tauschen ohne die Funktionalität kaputt zu machen? Ich habe mir das widget angeguckt und ich könnte die Inhalte der Variablen tauschen, ich denke aber, das macht alles andere kaputt.
Hintergrund ist, dass ich die Thermostate von allen Räumen auf einer Seite haben will. Da ist dann die Hauptanzeige der jeweiligen Ist-Temperatur aus meiner Sicht hilfreicher, als x Mal die Anzeige der Soll-Temperatur, die bei den meisten Räumen gleich gesetzt ist. Ist aber natürlich Geschmacksache.
Schön wäre in diesem Zuge auch die Anzeige von einer Nachkommastelle.
Zitat von: setstate am 10 Oktober 2015, 19:32:27
data-device hinzufügen, als Trigger des updates
http://forum.fhem.de/index.php/topic,34233.msg330221/topicseen.html#msg330221 (http://forum.fhem.de/index.php/topic,34233.msg330221/topicseen.html#msg330221)
Zitat von: Nobby1805 am 10 Oktober 2015, 19:35:03
Habe ich (natürlich) schon gemacht ...
<div data-type="simplechart"
data-logdevice="FileLog_Aussen"
data-device="Aussen"
data-columnspec="4:Aussen.temperature:1:"
data-minvalue="[20,10,5,0]"
data-maxvalue="[20,30,34]"
data-yticks="4"
data-xticks="720"
data-daysago="1"
data-caption=""> </div>
...
<div data-type="simplechart"
data-logdevice="FileLog_Innen_Thermostat"
data-device="Innen4"
data-columnspec="4:Innen4.Weather.temperature:1:"
data-minvalue= "18""
data-maxvalue="30"
data-yticks="2"
data-xticks="720"
data-daysago="1"
data-caption=""> </div>
Vielleicht hätte ich ergänzen sollen: klappt aber trotzdem nicht :(
Zitat von: ChrisK am 12 Oktober 2015, 10:03:16
Beim Thermostat-Widget wird ja die "desired-temp" in der Mitte groß dargestellt und die "measured-temp" klein in der Skala.
Gibt es eine Möglichkeit, diese beiden Werte in der Anzeige zu tauschen ohne die Funktionalität kaputt zu machen? Ich habe mir das widget angeguckt und ich könnte die Inhalte der Variablen tauschen, ich denke aber, das macht alles andere kaputt.
Hintergrund ist, dass ich die Thermostate von allen Räumen auf einer Seite haben will. Da ist dann die Hauptanzeige der jeweiligen Ist-Temperatur aus meiner Sicht hilfreicher, als x Mal die Anzeige der Soll-Temperatur, die bei den meisten Räumen gleich gesetzt ist. Ist aber natürlich Geschmacksache.
Schön wäre in diesem Zuge auch die Anzeige von einer Nachkommastelle.
Das geht definitiv nicht. Die Anzeige in der Mitte ist substanzieller Bestandteil des Controls und nicht nur eine Anzeige. Man müsste für die Anzeige der Ist-Temps mit seperaten Labels arbeiten.
data-step=".5" ermöglicht Nachkommaeinstellungen
Zitat von: setstate am 12 Oktober 2015, 10:27:22
Das geht definitiv nicht. Die Anzeige in der Mitte ist substanzieller Bestandteil des Controls und nicht nur eine Anzeige. Man müsste für die Anzeige der Ist-Temps mit seperaten Labels arbeiten.
Alles klar.
So habe ich das auch aus dem Widget-Code raus gelesen, wollte nur sicher gehen, dass ich nichts übersehen habe.
Bei der Masse an Funktionalitäten, die im Tablet UI eingebaut sind, übersieht man sehr leicht etwas ;)
Da muss ich mal nachdenken, ob ich mir ein angepasstes Widget erstelle (also Variablen tauschen und das Widget readonly machen) oder zusätzlich noch separate Labes verwende. Die Anzeige mit der Skala finde ich super!
Zitat von: setstate am 12 Oktober 2015, 10:27:22
data-step=".5" ermöglicht Nachkommaeinstellungen
Alles klar, das hilft, danke!
Hallo!
Es ist nur eine Kleinigkeit, aber TabletUI öffnet sich bei mir nur, wenn ich die Unterseite angebe:
http://server/fhem/tablet/index.html -> klappt
http://server/fhem/tablet/ -> klappt nicht - leere Seite
Gibt es hier irgendeinen Trick, dass er standardmäßig die index.html startet?
Danke und Gruß
Phil
Zitat von: setstate am 12 Oktober 2015, 08:29:41
Da muss man probieren, zwischen Basis-Höhe und Anzahl Zeilen das richtige Verhältniss zu finden.
Ich habe zum Beispiel
<meta name="widget_base_height" content="71"> und 5 Zeilen
Danke für Deine schnelle Antwort.
Ich hänge mal einen Screenshot an. Vielleicht wird damit mein Problem deutlich.
Wenn ich unter eine gewisse Höhe gehe, sind die Inhalte der einzelnen Zellen zu groß. Zu sehen z. B. an den Beschriftungen der Icons in der obersten Zeile (z. B. Unwetter) und in der untersten Zeile, wo der Beschreibungstext der Icons komplett abgeschnitte wird.
Mir ist jetzt nicht klar, wie ich hier ansetze um zu einem Design zu kommen, das bei mir auf das Tablett passt und trotzdem 7 Spalten und 5 Zeilen im Raster hat. Wie Ihr merkt, bin ich bzgl. HTML und CSS nicht ganz vorne dabei... ::)
Hier findest du entsprechende Hilfe. http://www.fhemwiki.de/wiki/FHEM_Tablet_UI (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI) Schau dir mal das "CSS" an und darin "narrow", auch ich kann kein HTML. Alles nur copy and paste, und lesen.
Auflösung 1024x768 10" Bildschirm.
Da musst du etwas an den CSS Klassen schrauben.
- lasse "cell" weg unter class="...", das erzwingt extra Platz noch oben und links
- füge "narrow" unter class="..." beim Switch und/oder beim Label ein, das spart Platz
Vllt. hilft schon ein Punkt oder nimm beide
Wegen (gefühlt) ewiger Absenz hier im Thread Mal eine kurze Nachfrage zum "Abfallkalender", bzw. der "warn-class":
Gibt es eigentlich schon jemanden, der ein Szenario am Laufen hat, bei dem neben dem Mülltonnen-Icon die Tage bis zur nächsten Leerung innerhalb der warn-class im roten Kreis anzeigt wird?
Hier im Thread wurde ein "responsive" Layout schon ein paar Mal angesprochen deswegen wollte ich mal nachfragen, ob sich jemand schon mal konkreter damit befasst hat?
Hier (https://github.com/ducksboard/gridster.js/issues/475) ist ein einfacher Ansatz, das gridster Layout automatisch je nach Display-Breite anzupassen.
Ich habe es mal auf die schnelle ausprobiert und mit folgendem css geht es einen Schritt in Richtung "Tablet UI mit 6 Spalten auch von Handy aus bedienbar":
/*Just add this css for responsive gridster */
.gridster > * {
padding: 0;
width: 100% !important;
}
.gridster .gs-w {
list-style: none;
}
.gridster .gs-w[data-sizex="1"] {
width: 14%;/*8.34091%;*/
}
.gridster .gs-w[data-col="1"] {
left: 0%;
}
.gridster .gs-w[data-sizex="2"] {
width: 28%;/*17.43182%;*/
}
.gridster .gs-w[data-col="2"] {
left: 14.5%;/*9.09091%;*/
}
.gridster .gs-w[data-sizex="3"] {
width: 42%;/*26.52273%;*/
}
.gridster .gs-w[data-col="3"] {
left: 29%;/*18.18182%;*/
}
.gridster .gs-w[data-sizex="4"] {
width: 56%;/*35.61364%;*/
}
.gridster .gs-w[data-col="4"] {
left: 43.5%;/*27.27273%;*/
}
.gridster .gs-w[data-sizex="5"] {
width: 70%;/*44.70455%;*/
}
.gridster .gs-w[data-col="5"] {
left: 58%;/*36.36364%;*/
}
.gridster .gs-w[data-sizex="6"] {
width: 84;/*53.79545%;*/
}
.gridster .gs-w[data-col="6"] {
left: 62.5%;/*45.45455%;*/
}
.gridster .gs-w[data-sizex="7"] {
width: 98%;/*62.88636%;*/
}
.gridster .gs-w[data-col="7"] {
left: 77%;/*54.54545%;*/
}
.gridster .gs-w[data-sizex="8"] {
width: 100%;/*71.97727%;*/
}
.gridster .gs-w[data-col="8"] {
left: 91.5%;/*63.63636%;*/
}
.gridster .gs-w[data-sizex="9"] {
width: 100%;/*81.06818%;*/
}
.gridster .gs-w[data-col="9"] {
left: 72.72727%;
}
.gridster .gs-w[data-sizex="10"] {
width: 100%;/*90.15909%;*/
}
.gridster .gs-w[data-col="10"] {
left: 81.81818%;
}
.gridster .gs-w[data-sizex="11"] {
width: 100%;/*99.25%;*/
}
.gridster .gs-w[data-col="11"] {
left: 90.90909%;
}
/Work around for devices less than 768px/
@media screen and (max-width: 767px) {
.gridster > * {
padding: 0;
width: 100% !important;
}
.gridster .gs-w {
list-style: none;
}
.gridster .gs-w[data-sizex="1"] {
width: 100%!important;
}
.gridster .gs-w[data-col="1"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="2"] {
width: 100%!important;
}
.gridster .gs-w[data-col="2"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="3"] {
width: 100%!important;
}
.gridster .gs-w[data-col="3"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="4"] {
width: 100%!important;
}
.gridster .gs-w[data-col="4"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="5"] {
width: 100%!important;
}
.gridster .gs-w[data-col="5"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="6"] {
width: 100%!important;
}
.gridster .gs-w[data-col="6"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="7"] {
width: 100%!important;
}
.gridster .gs-w[data-col="7"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="8"] {
width: 100%!important;
}
.gridster .gs-w[data-col="8"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="9"] {
width: 100%!important;
}
.gridster .gs-w[data-col="9"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="10"] {
width: 100%!important;
}
.gridster .gs-w[data-col="10"] {
left: 0%!important;
}
.gridster .gs-w[data-sizex="11"] {
width: 100%!important;
}
.gridster .gs-w[data-col="11"] {
left: 0%!important;
}
}
Da muss noch einiges dran gemacht werden (im Moment werden ja nur die einzelnen gridster-Boxen dynamisch in der Breite angepasst). Ich wollte nur mal vorabfragen, ob nicht schon mal jemand was in diese Richtung gemacht hat.
Bei mir läuft der Müllkalender wie du es haben möchtest. Hab den Code aus einer der User-Demos übernommen und angepasst läuft gut.
Zitat von: tomster am 12 Oktober 2015, 15:34:45
Wegen (gefühlt) ewiger Absenz hier im Thread Mal eine kurze Nachfrage zum "Abfallkalender", bzw. der "warn-class":
Gibt es eigentlich schon jemanden, der ein Szenario am Laufen hat, bei dem neben dem Mülltonnen-Icon die Tage bis zur nächsten Leerung innerhalb der warn-class im roten Kreis anzeigt wird?
Schau mal hier http://forum.fhem.de/index.php/topic,34233.msg296730.html#msg296730 (http://forum.fhem.de/index.php/topic,34233.msg296730.html#msg296730)
Danke für Eure Tipps bzgl. CSS. Habe einen ersten Wurf hinbekommen.
Ebenfalls danke für den Link zum Müllkalender Code. Klappt soweit gut.
Allerdings bekomme ich beim Reading vom Müllalert ein "???" obwohl ich einen Mülltermin für morgen eingestellt habe. Auf der Übersichtsseite, wo die Mülltonne angezeigt wird, verändert sich der Button folglich nicht (sollte dieser blinken?). Mache ich etwas falsch, oder muss das System auf 18 Uhr springen um den Alert auszulösen?
Zitat von: Nobby1805 am 12 Oktober 2015, 10:14:29
Vielleicht hätte ich ergänzen sollen: klappt aber trotzdem nicht :(
Ok, ich glaube ich habe es jetzt verstanden :-[
Als Trigger wird die Kombination von data-device und data-get (Default=STATE) verwendet ... jetzt ist beim HM-TC-IT-WM-W-EU der STATE aber CMDs_done und der wird eher selten geändert :( ... eigentlich müsste als data-device der Climate-Channel angegeben werden, aber das wird nicht akzeptiert.
Ich habe jetzt als Workaround data-get = "measured_temp" verwendet ... auch bei der Luftfeuchte
Hallo!
Hat von euch jemand TabletUI mit mod_proxy im Einsatz? Durch den dazwischengeschalteten Apache ist die Oberfläche richtig schön schnell, ABER:
Manchmal werden keine Befehle ausgeführt!
--> Ich drücke auf einen Swtich in der TabletUI und sehe aber im FHEM-Log, dass nichts ausgeführt wird.
Das Problem habe ich bisher nur bei "structures". Lasse ich mod_proxy weg, funktionieren sie wieder. Problem: _manchmal_ funktioniert es, _manchmal_ nicht.
Kennt ihr das Problem?
Gruß
Phil
Zitat von: mc-hollin am 12 Oktober 2015, 20:23:07
Schau mal hier http://forum.fhem.de/index.php/topic,34233.msg296730.html#msg296730 (http://forum.fhem.de/index.php/topic,34233.msg296730.html#msg296730)
Jetzt wo Du's schreibst fällt's mir wieder ein...
Ich bin daran verzweifelt, Phils/ Dein Script von einem Google Kalender auf das im Wiki vorgestellte, FHEM-eigene Müllscript umzuschreiben. Schätze, ich hab dafür code-seitig den Ar... zu weit unten. Vielleicht schau ich dann doch lieber, dass ich unseren Abfall-Entsorger dazu überrede eine .ics-Datei bereitzustellen ;-)
Vermutlich bin ich aber nicht der einzige, der sich immer wieder wünscht wiederverwendbare Gruppen von Widgets zu haben, aber jeweils mit unterschiedlichen Devicenamen (und anderen Teilen). Oder die einfach nur auf verschiedenen Seiten auftauchen.
Beispiele:
- Sonos-devices bestehend aus unzähligen widgets
- Rolladensteuerung bestehend aus 3 Buttons einem Slider und einem Label
- Thermostate bei denen Temperatur und Luftfeuchtigkeit gross angezeigt werden
- Wetteranzeige
...
Da ich aber keinen getrennten Server vor mein UI setzen will, habe ich mir überlegt, ob das nicht innerhalb von FHEM mit einem modifizierten HTTPSrv gehen könnte, bei dem man Includes und Ersetzungen hat.
Meine Vorstellung:
- Wenn ich an der Gestaltung meiner Gruppen (z.B. Sonos-Anzeige) etwas ändere möchte ich nur an einer Stelle eingreifen.
- Keine Änderung am FTUI selbst (also am Frontend)
Später sollte es vielleicht möglich sein, das UI dynamisch zusammenzubauen, in dem man eine grosse Seite für Mobildevices in mehrere kleine Pagetabs aufteilt oder je nach Benutzern umgruppiert oder oder oder...
Da ich wg. Erkältung sowieso im Bett lag, habe ich gestern mal angefangen etwas zu bauen, vielleicht gibt es ja Interesse?
Johannes
Hallo!
Nutzt von euch jemand Tablet-UI mit vorgeschaltetem Apache (mod_proxy)?
Hier scheint das Longpoll nicht zu funktionieren - zumindest aktualisiert sich die Oberfläche nicht, wenn sich etwas ändert.
Gibt es da irgendeinen Trick?
Gruß
Phil
Ich habe einen Vorschlag.
Dieser Thread ist jetzt ganze 178 Seiten lang, da blickt doch keiner mehr durch, auch nicht mit der Suche.
Es ist für Tablet UI Anfänger wie mich wirklich schwer in diesem Thread irgendwie die Übersicht zu behalten und für Problemchen, die andere vielleicht schon gelöst haben, eine Lösung zu finden.
Warum nicht noch ein Unterforum angelegt?
In FHEM Forum » FHEM » Frontends » tablet ui könnte man diesen Thread anpinnen und auch einen neuen erstellen, der nur noch eine Art Changelog ist. Jeder könnte seine Problemchen in dieser Sektion posten. So könnte man viel besser auf die einzelnen Probleme eingehen und vor allem würde es der Übersichtlichkeit dienen. Bereits besprochene Lösungen könnten viel schneller und einfacher gefunden werden.
Es müsste nicht immer wieder das gleiche auseinanderklamüsern werden, ist das nicht das Ziel dieses Forums?
Das zu meiner Idee ;D.
Zitat von: mrbreil am 14 Oktober 2015, 10:37:03
Das zu meiner Idee ;D.
Finde die Idee sehr gut, genau das habe ich mir in den letzten Wochen auch ein paar Mal gedacht.
Im Wiki findet man zwar einige Infos wieder, aber wenn es fragen gibt, dann wird das in diesem Thread schon unübersichtlich.
Gute Idee!
Und falls Unterstützung benötigt wird, bspw. in Form eines Moderators, gebt bescheid.
Grüße,
Sven
Tolle Idee. Ich verzweifel auch immer wieder in diesem über 170-seitigen - hochinteressanten - Sumpf.
Einen wunderschönen Mittwochvormittag wünsche ich... ;D
Habe aktuell ein weiteres Problem mit der Kalenderdarstellung unter der Tablet UI in der ich um eure Hilfe bitten möchte.
Und zwar habe ich mich an der Userdemo (https://github.com/ovibox/fhem-ftui-user-demos/blob/master/user-demos/Phil__/html/muell.html) von Phil_ entlang gehangelt und komme nun nicht weiter. Egal wie ich es drehe, es werden keine Einträge übergeben. (In FHEM funktioniert alles soweit wunderbar)
Folgende Konfig in FHEM:
# ----- Geburtstagskalender ----- #
define Geburtstag Calendar ical url https://...ics 86400
define CalGeburtstag CALVIEW Geburtstag 2
attr CalGeburtstag mxreadings 5
attr CalGeburtstag modes all
attr CalGeburtstag oldStyleReadings 1
define READ_Geburtstag readingsGroup <%time_calendar>,<Betreff> CalGeburtstag
attr READ_Geburtstag alias Geburtstage
attr READ_Geburtstag group Termine
attr READ_Geburtstag mapping %READING
attr READ_Geburtstag notime 1
attr READ_Geburtstag room Kalender
Folgender Auszug auf meiner calender.html
<!-- ============= Kalender =============== -->
<!-- ====================================== -->
<li data-row="1" data-col="2" data-sizex="7" data-sizey="2">
<header>GEBURTSTAGE</header>
<table border="0px" width="100%">
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_001_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_001_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_001_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_002_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_002_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_002_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_003_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_003_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_003_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_004_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_004_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_004_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_005_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_005_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_005_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_006_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_006_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_006_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_007_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_007_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_007_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_008_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_008_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_008_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_009_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_009_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_009_summary" style="color:#aa6900;"></div></td>
</tr>
<tr>
<td><div type="label" device="CalGeburtstag" data-get="t_010_bdate"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_010_btime"></div></td>
<td><div type="label" device="CalGeburtstag" data-get="t_010_summary" style="color:#aa6900;"></div></td>
</tr>
</table>
</li>
Vielen Dank für eure Mühe und auch ich bin dafür diesen Thread etwas zu entzerren, da ich trotz überlfiegen der Seiten hier nicht genau weiß ob mein Problem vielleicht schon ein anderer hatte. Ich habe jedenfalls keine Lösung bisher gefunden.
Gruß Christian
Hallo ChristianR,
versuch mal in der calendar.html data-type und data-device anstatt type und device zu nutzen.
Zitat von: mc-hollin am 14 Oktober 2015, 11:34:06
Hallo ChristianR,
versuch mal in der calendar.html data-type und data-device anstatt type und device zu nutzen.
Hallo,
teste ich nachher und gebe Feedback, Danke!
Mir als Newbie geht es hier ebenso. Ich blicke einfach nicht mehr durch und habe schon an zu vielen Stellen rumgespielt. Also würde ich die FTUI gern neu aufbauen. Als Vorlage würde ich gern die Userdemo von nesges aus dem github nutzen. Bekomme die allerdings nicht zu laufen. Ich erhalte immer nur eine weiße Seite mit den paar definierten Labels aber keinen Grafiken. Hat jemand nesges' userdemo zum laufen bekommen und kann mir hier weiterhelfen?
Beste Grüße
O.
zurück auf mrbreil Vorschlag!
Also ich war zu Beginn hier sehr aktiv und lange Zeit auch zufrieden (im übrigen immerncoh ;) ). Es läuft alles perfekt! Daher habe ich nur noch sporalisch hier mal reingeschaut und bin zu der Erkentniss gekommen, ich Blicke nicht mehr durch und traue mich gar nicht mehr ein Update durchzuführen. :-X :-[
Gerade für Anfänger ist dieser Thread sehr abschreckend. Man such sich dumm und dämlich und verliert somit schnell die Lust.
mrbeil's Vorschlag finde ich gar nicht so verkehrt. Ich würde sogar einen Schritt weitergehen.
Mittlerweile gibt es so viele Anhänger und welche die es gerne werden wollen.
Kann man nicht Unterforen anlegen und jedes Unterforum befasst sich mit den unterschiedlichsten Widgets?
Zu beginn des Unterforums wird das Widget mit all seinen Funktionen global beschrieben. Danach folgen die unterschiedlichsten USER Einrichtungen samt Hardcopy und Quellcode.
Somit könnte jeder, auch jeder newbie gezielt danach suchen und sich inspirieren lassen was andere bereits umgestezt haben.
Zitat von: bjoernbo am 14 Oktober 2015, 14:06:01
zurück auf mrbreil Vorschlag!
Also ich war zu Beginn hier sehr aktiv und lange Zeit auch zufrieden (im übrigen immerncoh ;) ). Es läuft alles perfekt! Daher habe ich nur noch sporalisch hier mal reingeschaut und bin zu der Erkentniss gekommen, ich Blicke nicht mehr durch und traue mich gar nicht mehr ein Update durchzuführen. :-X :-[
Gerade für Anfänger ist dieser Thread sehr abschreckend. Man such sich dumm und dämlich und verliert somit schnell die Lust.
mrbeil's Vorschlag finde ich gar nicht so verkehrt. Ich würde sogar einen Schritt weitergehen.
Mittlerweile gibt es so viele Anhänger und welche die es gerne werden wollen.
Kann man nicht Unterforen anlegen und jedes Unterforum befasst sich mit den unterschiedlichsten Widgets?
Zu beginn des Unterforums wird das Widget mit all seinen Funktionen global beschrieben. Danach folgen die unterschiedlichsten USER Einrichtungen samt Hardcopy und Quellcode.
Somit könnte jeder, auch jeder newbie gezielt danach suchen und sich inspirieren lassen was andere bereits umgestezt haben.
Das ist eine super Idee. Ich bin auch gerade dabei mir ein schönes UI zu basteln. Bin "blutiger" Anfänger in Sachen Fhem, Html, CSS usw.. Zur Zeit besteht mein Bastel aus Copy & Paste, es funktioniert aber bei Problemen ist es echt schwierig hier was zu finden. Es wird hier eine super Arbeit geleistet, aber der Thread ist zu groß für gezielte Probleme.
Wäre echt super, wenn deine Idee umgesetzt wird.
Hallo O.
probierst du die heruntergeladenen Dateien einfach nach dem Download lokal zu öffnen?
Musst sie auf deiner FHEM Hardware in deinen Ordner packen in der auch die index.html deines Tablet UI liegt und dann am Besten aus dem Browser öffnen.
Gibt bestimmt noch andere Wege nach Rom, aber ich mache das immer wie folgt:
1.) Code aus der gesuchten Demo-HTML kopieren
2.) neue *.HTML im Tablet UI Verzeichnis erstellen und kopierten Code einfügen
3.) Code mit Notepad++ auf eigene Bedürfmisse / Devices anpassen
4.) aktualisieren und prüfen bis Endergebis erreicht
Damit fahre ich für den Anfang recht gut, aber wenn es tiefer ins Detail geht suche ich auch hier in diesem Thread nach möglichen neuen Anhaltspunkten.
Da schließt sich der Kreis auch schon wieder mit der neuen Sortierung... ;D
Hoffe mein Hinweis hilft dir für den Anfang etwas...
Gruß Christian
Zitat von: ChristianR am 14 Oktober 2015, 15:32:40
Hallo O.
probierst du die heruntergeladenen Dateien einfach nach dem Download lokal zu öffnen?
Musst sie auf deiner FHEM Hardware in deinen Ordner packen in der auch die index.html deines Tablet UI liegt und dann am Besten aus dem Browser öffnen.
Gibt bestimmt noch andere Wege nach Rom, aber ich mache das immer wie folgt:
1.) Code aus der gesuchten Demo-HTML kopieren
2.) neue *.HTML im Tablet UI Verzeichnis erstellen und kopierten Code einfügen
3.) Code mit Notepad++ auf eigene Bedürfmisse / Devices anpassen
4.) aktualisieren und prüfen bis Endergebis erreicht
Damit fahre ich für den Anfang recht gut, aber wenn es tiefer ins Detail geht suche ich auch hier in diesem Thread nach möglichen neuen Anhaltspunkten.
Da schließt sich der Kreis auch schon wieder mit der neuen Sortierung... ;D
Hoffe mein Hinweis hilft dir für den Anfang etwas...
Gruß Christian
Hallo Christian,
wie Ansprechen in FHEM funktioniert, ist mir als Betreiber eines Webservers schon klar. Das Standard FTUI bekomme ich ebenfalls zum laufen. Nur halt die Userdemo von nesges halt nicht...
Hallo,
gibt es dazu eigenlich mittlerweile eine praktikable Lösung? Ich habe auch noch ein Dutzend FS20-Dimmer in Zwischendecken verbaut.
Zitat von: outhouse am 04 Oktober 2015, 09:15:14
Ich benutze unter anderem einen FS20 Dimmer. Um die Lampe zu dimmen, müsste der Befehl (z.B.) "set WZ_Stehlampe dim43%" lauten.
data-set="dim" ergibt dann den Befehle "set WZ_Stehlampe dim 43"
Frage: Gibt es eine Möglichkeit, das "dim 43" ohne Leerzeichen und nachfolgendem % zu "kreieren"?
Grüße
Martin
Zitat von: bjoernbo am 14 Oktober 2015, 14:06:01
Kann man nicht Unterforen anlegen und jedes Unterforum befasst sich mit den unterschiedlichsten Widgets?
Zu beginn des Unterforums wird das Widget mit all seinen Funktionen global beschrieben. Danach folgen die unterschiedlichsten USER Einrichtungen samt Hardcopy und Quellcode.
Zum Thema Unterforum/Unterforen:
Da seid ihr bei den Machern von TabletUI an der falschen Adresse. Das müsstet ihr schon dem Forenbetreiber vorschlagen. Mir scheint aber, die Neigung, das Forum in Einzelthemen aufzusplittern, ist nicht sehr ausgeprägt (was ich hiermit in keinster Weise bewerten möchte). Ein Unterforum für Tablet-UI wäre vielleicht noch denkbar. Aber ein Unterforum für jedes Widget? Das will ich lieber gar nicht zu Ende denken...
Vielleicht mal als Tipp: Wenn Ihr diesen Thread hier öffnet und dann oben rechts die Suche verwendet, bezieht diese sich nur auf diesen Thread. Gibt mal also beispielsweise "pagetab" da ein, bekommt man eine übersichtliche Liste mit allen Beiträge in diesem Thread zum Thema "pagetab". Das in Verbindung mit dem sehr ordentlichen TabletUI-Wiki (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI) bringt einen schon recht weit, finde ich.
Ansonsten steht es jedem frei, beispielsweise einen neuen Thread mit dem Betreff "[Tablet-UI] Pagetab-Widget" aufzumachen, um Diskussionen und Informationen zu einem Thema dort zu kanalisieren. Das dürfte schneller und einfacher sein, als hier alle möglichen Unterforen durchzusetzen und reicht ja vielleicht auch?
Wenn das Widget es nicht hergibt, ist es immer noch möglich, dass in FHEM zu erledigen. In diesem Fall wäre das ein dummy_Device und statt den eigentlichen Dimmer direkt anzusteuern, stattdessen das Dummy device. Also als cmd etwas hinterlegen wie:
set FS20DUMMYDEVICE
Dann kann man mit einem Notify auf die State-Änderung reagieren und über die Teile $EVTPART0,$EVTPART1,$EVTPART2 das richtige Kommando zusammenbauen.
Ich habe jetzt kein System hier online, aber im Prinzip müsste doch im notify ein kommando so etwas gemacht werden wie:
{ set $EVTPART0 "dim".$EVTPART2."\%" }
zumindest basierend auf Deiner Beschreibung was bisher geschickt wird.
Natürlich fehlt hier noch Fehlerbehandlung und Ausnahmefälle.
Zitat von: Brockmann am 14 Oktober 2015, 17:10:55
Zum Thema Unterforum/Unterforen:
Da seid ihr bei den Machern von TabletUI an der falschen Adresse. Das müsstet ihr schon dem Forenbetreiber vorschlagen. Mir scheint aber, die Neigung, das Forum in Einzelthemen aufzusplittern, ist nicht sehr ausgeprägt (was ich hiermit in keinster Weise bewerten möchte). Ein Unterforum für Tablet-UI wäre vielleicht noch denkbar. Aber ein Unterforum für jedes Widget? Das will ich lieber gar nicht zu Ende denken...
Vielleicht mal als Tipp: Wenn Ihr diesen Thread hier öffnet und dann oben rechts die Suche verwendet, bezieht diese sich nur auf diesen Thread. Gibt mal also beispielsweise "pagetab" da ein, bekommt man eine übersichtliche Liste mit allen Beiträge in diesem Thread zum Thema "pagetab". Das in Verbindung mit dem sehr ordentlichen TabletUI-Wiki (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI) bringt einen schon recht weit, finde ich.
Ansonsten steht es jedem frei, beispielsweise einen neuen Thread mit dem Betreff "[Tablet-UI] Pagetab-Widget" aufzumachen, um Diskussionen und Informationen zu einem Thema dort zu kanalisieren. Das dürfte schneller und einfacher sein, als hier alle möglichen Unterforen durchzusetzen und reicht ja vielleicht auch?
Dem kann ich nur vollständig zustimmen ... nicht alles und jedes hier in den Thread packen sondern lieber mal ein neues Thema aufmachen ... kostet ja nichts ;)
und: bisher habe ich auch alles was ich wieder-finden wollte mit der Suche erreichen können
Zitat von: viegener am 14 Oktober 2015, 17:25:06
Wenn das Widget es nicht hergibt, ist es immer noch möglich, dass in FHEM zu erledigen. In diesem Fall wäre das ein dummy_Device und statt den eigentlichen Dimmer direkt anzusteuern, stattdessen das Dummy device. Also als cmd etwas hinterlegen wie:
Das werde ich mal ausprobieren. Ohne notify und Dummy bekomme ich mit
<div data-type="dimmer" data-device='Dimmer_4' data-get="dim" data-get-on="!off" data-get-off="0" data-set="dim" class="cell"></div>bei Position 100% des Sliders interessanterweise
FS20 set Dimmer_4 dim100%
Und bei Slider auf 0
FS20 set Dimmer_4 off
Und beide Befehle werden, wenn auch mit 20-30 Sekunden Verzögerung, ausgeführt.
Muss zugeben, dass ich da noch nicht so ganz durchsteige.
Hallo zusammen,
seit ein paar Tagen hab ich ein merkwürdiges Verhalten beim Aufbau der einzelnen Boxen. Teilweise lassen funktioniert data-row nicht mehr und wird rot dargestellt. Letzte Woche habe ich ein Update durchgeführt und die neue index.html eingebaut, dabei hab ich dies Verhalten zum ersten Mal festgestelle. Dann wieder zurück zur alten index.html, aber immer noch das gleiche Problem. Hier der Code der Seite und als Anlage die Seite und der Fehler.
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/myfhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/myfhem-tablet-ui-user.css" />
<link rel="stylesheet" href="/fhem/tablet/customfont/font1/style.css" />
<link rel="stylesheet" href="customfonts/font1/style.css">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="inc_homebutton.html"></li>
<li data-row="2" data-col="1" data-sizex="1" data-sizey="3" data-template="inc_raum_menu.html"></li>
<li data-row="1" data-col="10" data-sizex="1" data-sizey="4" data-template="inc_menu_rechts.html"></li>
<li data-row="1" data-col="3" data-sizex="2" data-sizey="1" data-template="inc_aussentemp.html"></li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1"data-template="inc_uhr.html"></li>
<!-- ====================================== -->
<li data-row="2" data-col="2" data-sizex="1" data-sizey="3">
<header>Wohnzimmer</header><br><br>
<div><div data-type="label" class="">Rollo rechts</div><br>
<div data-type="switch" data-device="WZ.Rollo.rechts"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.rechts"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="25" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">25</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.rechts"
data-get-on="[0-9]" data-get-off="!on"
data-on-background-color="#0099FF"
data-set-on="0" data-set-off=""
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="WZ.Rollo.rechts"
data-set-on="stop" data-off-color="#2A2A2A"
data-on-background-color="#0099FF"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="3">
<header>Wohnzimmer</header><br><br>
<div><div data-type="label" class="">Rollo links</div><br>
<div data-type="switch" data-device="WZ.Rollo.links"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.links"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="25" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">25</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.links"
data-get-on="[0-9]" data-get-off="!on"
data-on-background-color="#0099FF"
data-set-on="0" data-set-off=""
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="WZ.Rollo.links"
data-set-on="stop" data-off-color="#2A2A2A"
data-on-background-color="#0099FF"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
<li data-row="3" data-col="4" data-sizex="5" data-sizey="1">
<header>HEIZUNG</header>
<div data-type="image"
data-size="90%"
data-url="http://192.168.178.35:8083/fhem/SVG_showLog?dev=SVG_FileLog_WZ.Thermo_1&logdev=FileLog_WZ.Thermo&gplotfile=SVG_FileLog_WZ.Thermo_1&logfile=CURRENT&pos=""
</div>
</li>
<li data-row="5" data-col="4" data-sizex="2" data-sizey="1">
<header>HEIZUNG</header>
<div data-type="thermostat"
data-device="WZ.Thermostat_Clima"
data-valve="ValvePosition"
data-get="desired-temp"
data-temp="measured-temp"
data-min="0"
data-off="off"
class="cell">
</div>
</li>
</li>
</ul>
</div>
</body>
</html>
Vielen Dankf für die Hilfe.
Im HTML sind etliche Fehler ... schalte doch mal die Konsole ein und behebe diese ... fehlendes Blank, fehlendes >, ...
Zitat von: dadoc am 14 Oktober 2015, 16:48:10
Hallo,
gibt es dazu eigenlich mittlerweile eine praktikable Lösung? Ich habe auch noch ein Dutzend FS20-Dimmer in Zwischendecken verbaut.Grüße
Martin
Ich bin dran, aber ich bin noch nicht 100% zufrieden mit dem Ergebnis.
Zitat von: mc-hollin am 14 Oktober 2015, 11:34:06
Hallo ChristianR,
versuch mal in der calendar.html data-type und data-device anstatt type und device zu nutzen.
Hi mc-hollin,
habs getestet, aber leider ohne Erfolg.
Nach der Umbenennung habe ich den Kalender und die CalView aktualisiert, aber es werden immer noch keine Daten übertragen...
EDIT:
Bin dann gestern doch noch auf die Lösung gekommen.
Habe zur besseren Ansicht in der CalView das Attribut oldStyleReading genutzt und somit wurden die Readings namentlich nicht so erstellt wie ich sie in der Tablet UI abrufen wollte.
Nach dem löschen des Attributs habe ich die Readings nach einem Update sofort gesehen und auch die Übertragung zur FTUI funktionierte dann auf Anhieb.
Trotzdem Danke!
Gruß Christian
Zitat von: ChristianR am 14 Oktober 2015, 22:28:31
Hi mc-hollin,
habs getestet, aber leider ohne Erfolg.
Nach der Umbenennung habe ich den Kalender und die CalView aktualisiert, aber es werden immer noch keine Daten übertragen...
EDIT:
Bin dann gestern doch noch auf die Lösung gekommen.
Habe zur besseren Ansicht in der CalView das Attribut oldStyleReading genutzt und somit wurden die Readings namentlich nicht so erstellt wie ich sie in der Tablet UI abrufen wollte.
Nach dem löschen des Attributs habe ich die Readings nach einem Update sofort gesehen und auch die Übertragung zur FTUI funktionierte dann auf Anhieb.
Trotzdem Danke!
Gruß Christian
Ach man, da warst du etwas schneller, das wollte ich dir auch gerade schreiben als ich deine Definitionen mit meinen verglichen habe ;D Freut mich das es nun bei dir klappt.
Und was mir bei deiner CALVIEW def noch aufgefallen ist, du hast
attr CalGeburtstag mxreadings 5...es sollte aber
attr CalGeburtstag maxreadings 5 heißen. Sonst hat das maxreadings keinen Sinn ;)
Grüße,
Sven
Moin Sven,
du Fuchs, gut aufgepasst ;D
Ein Tippfehler meinerseits gewesen beim erstellen, in der fhem.cfg stehts aber richtig.
Trotzdem Danke für deine Aufmerksamkeit!
Gruß Christian
:-) Alles klar, dann passt es ja.
Gesendet von meinem G7-L01 mit Tapatalk
Mal 'ne ganz andere Frage:
Ich spiel grad mit dem Gedanken mir einen Touchscreen in eine Oberschranktür in der Küche einzubauen und FHEM über das FTUI zu bedienen. Mein erster Ansatz war, dafür einen Raspberry Pi2 + Browser als Hardware einzusetzen. Nur nochmal zur Klärung auf diesem RasPi läuft kein FHEM, sondern nur ein GUI und ein Browser.
Nun hab ich das ganze Mal freiluftverdrahtet in Betrieb genommen. Was soll ich sagen? Der Epiphany-Browser kommt anscheinende mit dem FTUI, bzw. dessen HTML-Code ganz und gar nicht zurecht.
Die schlecht gerenderten Schriftarten ließen sich sicher noch mit der Nachinstallation entsprechender Fonts und ein paar Tweaks bewerkstelligen, aber es funzt schlichtweg kein einziger Hyperlink und auch die Widgets sind nicht "be-touchbar". Nun dachte ich, dass Epiphany als Webkit-Browser wohl am ehesten damit klar kommen sollte.
Hat jemand eine Erklärung dafür, warum eigentlich schlichtweg gar nix funzt auf dem RasPi?
--edit--
Hab mich nebenbei gerade damit gespielt Chromium auf meinen Pi mit aktuellstem Raspbian Jessie zu bekommen.
Mit dem geht's. Nicht der Schnellste und ein brutaler Molloch, aber es sieht ganz gut aus damit.
Zitat von: setstate am 14 Oktober 2015, 22:22:38
Ich bin dran, aber ich bin noch nicht 100% zufrieden mit dem Ergebnis.
Super - wenn ich irgendwie mitbasteln oder helfen kann - lass wissen!
Habe ein eigenartiges Verhalten beim push widget. Hier setze ich on-for-timer xx, was beim ersten anklicken dazu führt, dass auch in der korrekten Zeit der "Kreis" im Icon abläuft. Drückt man jedoch innerhalb des Zeitraums ein weiteres mal auf den Button, so erhöht sich die Zeit um das Doppelte, beim Dritten um das Dreifache usw.
<div style="font-size:30px;" data-type="push"
data-icon="fm-clock"
data-device="WasserPumpe"
data-background-icon="fa-square"
data-set-on="on-for-timer 5"
data-off-color="#101010"
class="cell big">
</div>
... ist das ein Feature oder Fehler ?
Grüße!
Andreas
Wenn ich ein Tab mit der UI offen habe bekomme ich aller 30 Sekunden og. Meldung im Log.
Weiß Jemand wo ich anfangen soll zu suchen ?
Danke und Gruß
KUD
Die Meldung kommt wenn Du ein Device hast, das keinen Typ (Internals TYPE) zugeordnet hat. Demnach ruft Dein FTUI direkt oder indirekt ein device auf, das in dieser Hinsicht fehlerhaft definiert ist. Ich würde mal überprüfen welche Devices in Deinem FTUI abgefragt werden eines davon ist wohl inkorrekt. Am einfachsten grenzt Du das Problem ein, indem Du jeweils einen Teil der DEVICES aus der FTUI-DEfinition deaktivierst, in dem die Fehlermeldung auftritt. Also erstmal rechte Seite entfernen. Wenn das Problem weiterhin auftritt, einen Teil der rechten Seite wieder rein usw., bis Du das fragliche Device gefunden hast.
Johannes
Zitat von: fhem-challenge am 16 Oktober 2015, 11:28:11
Habe ein eigenartiges Verhalten beim push widget. Hier setze ich on-for-timer xx, was beim ersten anklicken dazu führt, dass auch in der korrekten Zeit der "Kreis" im Icon abläuft. Drückt man jedoch innerhalb des Zeitraums ein weiteres mal auf den Button, so erhöht sich die Zeit um das Doppelte, beim Dritten um das Dreifache usw.
<div style="font-size:30px;" data-type="push"
data-icon="fm-clock"
data-device="WasserPumpe"
data-background-icon="fa-square"
data-set-on="on-for-timer 5"
data-off-color="#101010"
class="cell big">
</div>
... ist das ein Feature oder Fehler ?
Grüße!
Andreas
Da gibt es noch Baustellen:
Der Timer kann noch nicht mit Re-Trigger des Buttons und Refresh der Seite umgehen. Fixe ich irgendwann mal. Oder ihr macht das und schickt mir ein Pullrequest über Github.
Zitat von: kud am 17 Oktober 2015, 18:25:47
Wenn ich ein Tab mit der UI offen habe bekomme ich aller 30 Sekunden og. Meldung im Log.
Weiß Jemand wo ich anfangen soll zu suchen ?
Mach mal ein
list TYPE=um Devices zu finden, die nicht explizit definiert wurden und deshalb keinen TYPE haben. Die verursachen typischerweise diese "has no TYPE"-Fehlermeldung.
Zitat von: dadoc am 15 Oktober 2015, 15:46:17
Super - wenn ich irgendwie mitbasteln oder helfen kann - lass wissen!
Notlösung für FS20-Dimmer für die, die nicht abwarten können: Durch Missbrauch von Circlemenu kann man zumindest ein paar Dimmstufen kontrollieren sowie aus- und (auf den letzten Dimmzustand) einschalten:
<div class="left">
<div data-type="circlemenu" class="cell circlemenu">
<ul>
<li><div data-type="push" data-icon="fa-lightbulb-o"></div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="on" data-icon="">on</div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="dim25%" data-icon="">|</div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="dim37%" data-icon="">||</div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="dim50%" data-icon="">|||</div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="dim75%" data-icon="">||||</div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="dim100%" data-icon="">|||||</div></li>
<li><div data-type="push" data-device="Dimmer_1" data-set="off" data-icon="">off</div></li>
</ul>
</div>
<div data-type="label" class="cell">Dimmer 1
</div>
</div>Grüße
Martin
Servus....
so das Wochenende über war ich echt sehr fleißig und habe mir 180 Seiten durchgelesen und jede Menge Lesezeichen gespeichert...
erstmal möchte auch ich vor allem setstate und nesges danken!!! Allen anderen, die zur Verbesserung beigetragen habe auch ein danke =)
Das UI ist einfach genial =)
Früher oder später werde ich bestimmt auch mit Fragen kommen, aber das hat alles Zeit.
Also: DANKE und Hut ab für die Leistung!!! :) :)
Beste Grüße
Andy
Zitat von: skuggy am 14 Oktober 2015, 19:17:03
Hallo zusammen,
seit ein paar Tagen hab ich ein merkwürdiges Verhalten beim Aufbau der einzelnen Boxen. Teilweise lassen funktioniert data-row nicht mehr und wird rot dargestellt. Letzte Woche habe ich ein Update durchgeführt und die neue index.html eingebaut, dabei hab ich dies Verhalten zum ersten Mal festgestelle. Dann wieder zurück zur alten index.html, aber immer noch das gleiche Problem. Hier der Code der Seite und als Anlage die Seite und der Fehler.
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/myfhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/myfhem-tablet-ui-user.css" />
<link rel="stylesheet" href="/fhem/tablet/customfont/font1/style.css" />
<link rel="stylesheet" href="customfonts/font1/style.css">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
--><!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="inc_homebutton.html"></li>
<li data-row="2" data-col="1" data-sizex="1" data-sizey="3" data-template="inc_raum_menu.html"></li>
<li data-row="1" data-col="10" data-sizex="1" data-sizey="4" data-template="inc_menu_rechts.html"></li>
<li data-row="1" data-col="3" data-sizex="2" data-sizey="1" data-template="inc_aussentemp.html"></li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1"data-template="inc_uhr.html"></li>
<!-- ====================================== -->
<li data-row="2" data-col="2" data-sizex="1" data-sizey="3">
<header>Wohnzimmer</header><br><br>
<div><div data-type="label" class="">Rollo rechts</div><br>
<div data-type="switch" data-device="WZ.Rollo.rechts"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.rechts"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="25" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">25</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.rechts"
data-get-on="[0-9]" data-get-off="!on"
data-on-background-color="#0099FF"
data-set-on="0" data-set-off=""
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="WZ.Rollo.rechts"
data-set-on="stop" data-off-color="#2A2A2A"
data-on-background-color="#0099FF"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
<li data-row="2" data-col="3" data-sizex="1" data-sizey="3">
<header>Wohnzimmer</header><br><br>
<div><div data-type="label" class="">Rollo links</div><br>
<div data-type="switch" data-device="WZ.Rollo.links"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.links"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="25" data-set-off=""
data-on-background-color="#0099FF"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">25</div>
</div>
<div>
<div data-type="switch" data-device="WZ.Rollo.links"
data-get-on="[0-9]" data-get-off="!on"
data-on-background-color="#0099FF"
data-set-on="0" data-set-off=""
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="WZ.Rollo.links"
data-set-on="stop" data-off-color="#2A2A2A"
data-on-background-color="#0099FF"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
<li data-row="3" data-col="4" data-sizex="5" data-sizey="1">
<header>HEIZUNG</header>
<div data-type="image"
data-size="90%"
data-url="http://192.168.178.35:8083/fhem/SVG_showLog?dev=SVG_FileLog_WZ.Thermo_1&logdev=FileLog_WZ.Thermo&gplotfile=SVG_FileLog_WZ.Thermo_1&logfile=CURRENT&pos=""
</div>
</li>
<li data-row="5" data-col="4" data-sizex="2" data-sizey="1">
<header>HEIZUNG</header>
<div data-type="thermostat"
data-device="WZ.Thermostat_Clima"
data-valve="ValvePosition"
data-get="desired-temp"
data-temp="measured-temp"
data-min="0"
data-off="off"
class="cell">
</div>
</li>
</li>
</ul>
</div>
</body>
</html>
Vielen Dank für die Hilfe.
Meine html Fehler habe ich korrigiert. Ich hab mir sogar die neue index-example.html runtergeladen und es mit dieser versucht.
Kann es sein das sich die Boxen immer oben andocken, egal was ich als data-row oder data-col eingebe? Kann man das irgendwie abstellen?
Ja, das ist (etwa) so ... je Spalte liegt der niedrigste row Wert immer ganz oben (man kann das Verhalten sehr schön sehen wenn man einzelne Blöcke/Boxen per Maus verschiebt)
Nein, ich weiß nicht was man dagegen machen kann ::)
Das Verhalten ist fest in Gridster versenkt und lässt sich wohl ohne tiefe Eingriffe auch nicht abstellen. Ich hatte vor Monaten mal im Code von Gridster etwas reingeschaut, wg. dieses Verhaltens.
Es bleibt die Empfehlung alle row/col/size-Werte so exakt wie möglich einzustellen für die verschiedenen Seiten.
Johannes
Zitat von: Nobby1805 am 19 Oktober 2015, 12:41:04
Nein, ich weiß nicht was man dagegen machen kann ::)
Ich habe folgendes dagegen getan:
In der user-css diese Klasse hinzugefügt:
.gridster ul li.black {
background-color:#000000 !important;
}Und in der index.html schwarze Boxen eingefügt:
<li data-row="1" data-col="3" data-sizex="2" data-sizey="1" class="black">
</li>
So kann ich die Elemente auch genau dahin platzieren, wo ich es will.
Zitat von: viegener am 19 Oktober 2015, 13:30:07
Das Verhalten ist fest in Gridster versenkt und lässt sich wohl ohne tiefe Eingriffe auch nicht abstellen. Ich hatte vor Monaten mal im Code von Gridster etwas reingeschaut, wg. dieses Verhaltens.
Es bleibt die Empfehlung alle row/col/size-Werte so exakt wie möglich einzustellen für die verschiedenen Seiten.
Johannes
Hallo Johannes,
col/size funktioniert ja immer. Hab mir schon gedacht, dass es irgendwo fest im Gridster programmiert ist.
Hallo ChrisK,
danke für den Tip, werde ich mal testen. Dafür muss ich mir aber erst eine usr-css anlegen, die nächste Baustelle...
Danke.
Hi,
ich habe ein kleines Problem mit dem circlemenue.
Wenn ich das Start Widget, bei mir ein Button, anklicke und das circlemenue dann wieder zugeht, ist der Button verschwunden.
Ich kann zwar das circlemenue öffnen und schließen, aber die Ursprungsgrafik ist weg. Beim reload der Seite ist sie wieder da. Aber nur solange bis ich das Menü mal geöffnet habe.
Hier mein Aufbau:
<div class="cell inline">
<div data-type="label" class="narrow darker small">HWR</div>
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half">
<ul class="menu">
<li><div data-type="button" data-device="ZWave_SWITCH_MULTILEVEL_14" data-get-on='["Hoch","Runter5","Runter"]' data-icons='["fa-arrow-down", "fa-bars", "fa-arrow-up"]' data-colors='["green", "blue", "red"]' data-background-colors='["transparent", "transparent", "transparent"]'></div></li>
<li><div data-type="push" data-device="ZWave_SWITCH_MULTILEVEL_14" data-set="Hoch" data-icon="fa-arrow-up"></div></li>
<li><div data-type="push" data-device="ZWave_SWITCH_MULTILEVEL_14" data-set="dim 15" data-icon="fa-bars"></div></li>
<li><div data-type="push" data-device="ZWave_SWITCH_MULTILEVEL_14" data-set="Runter" data-icon="fa-arrow-down"></div></li>
</ul>
</div>
</div>
Wie kann ich das ändern?
Danke
Gruss
Dennis
Zitat von: dadoc am 14 Oktober 2015, 16:48:10
Hallo,
gibt es dazu eigenlich mittlerweile eine praktikable Lösung? Ich habe auch noch ein Dutzend FS20-Dimmer in Zwischendecken verbaut.Grüße
Martin
Update ist da. Dimmer, Slider und Volume kann man jetzt dafür benutzen.
Mit
data-get-value und
data-set-value kann man das Format für den für den Wert definieren.
Mit data-get-value kann man definieren, wie der Zahlenwert aus dem Reading extrahiert wird. RegEx mit Group ist möglich, oder wenn man nur eine Zahl angibt, dann der entsprechende Block bei Trennung durch Leerzeichen
Mit data-set-value legt man fest, was in das Reading geschrieben wird. Default ist '$v', also nur der Zahlenwert. $v ist dabei ein Platzhalter, der durch den realen Zahlenwert ersetzt wird. Bei 'dim$v%' wird dann z.B. "dim50%" ins Reading geschrieben.
<div data-type="slider" data-device='myFS20' data-get-value="dim([0-9].*)%" data-set-value="dim$v%" class="horizontal" ></div>
<div data-type="volume" data-device='myFS20' data-get-value="dim([0-9].*)%" data-set-value="dim$v%" class="" ></div>
<div data-type="dimmer" data-device='myFS20'
data-set-on="dim$v%"
data-set-off="dim0%"
data-set-value="dim$v%"
data-get-on="dim([1-9]\d?)?%"
data-get-off="dim0%">
</div>
Hallo zusammen,
ich bin sehr neu in der Thematik, warte gerade auf meine MAX Heizkörperthermostate sowie den MAXCube.
FHEM läuft bereits auf meinem RaspberryPi, das TabletUi habe ich schonmal ein wenig für meine Zwecke angepasst (möchte vorerst nur Heizkörper steuern)
Allerdings hätte ich gerne auch die Wetteranzeige/Vorhersage, nur leider versteh ich nicht woher ich die Daten bekomme, habe in die index.html den WetterCode eingefügt, aber er Zeit mir nichts an, im FHEM Wiki habe ich gelesen, dass dies ja alle mit define etc deklariert wird, aber wie mache ich das in der index html?
Sorry für die Anfänger Fragen :-)
Moin Steffen,
zuerst musst du die Daten in FHEM bekommen. Dazu kannst du zum Beispiel das Modul Weather nutzen.
Habe es nach folgenden Link gemacht: http://blog.wenzlaff.de/?p=1803 (http://blog.wenzlaff.de/?p=1803)
Wenn deine Readings sich dann mit Wetterdaten füllen kannst du sie in die FTUI übertragen.
Das geschieht dann über das Device aus FHEM mit den von dir gewünschten Readings in der index.html.
Gruß Christian
Servus ChristianR,
habs hinbekommen :-) nun hab ich glaub ein Stück weiter verstanden. Sobald meine Thermostate da sind sehen wir weiter ob ich damit auch zurecht kommt :-)
Zitat von: xxsteffenxx am 20 Oktober 2015, 12:31:04
Servus ChristianR,
habs hinbekommen :-) nun hab ich glaub ein Stück weiter verstanden. Sobald meine Thermostate da sind sehen wir weiter ob ich damit auch zurecht kommt :-)
Hi Steffen,
das freut mich für dich.
Bei mir geht es auch Stück für Stück etwas tiefer in die Materie... ;D
Hey ihr ,
hatte immer mal wieder die Problematik, dass das Dashboard nicht korrekt geladen wird. Es fehlen dann einfach mal alle icons und ich muss es zwei drei mal neu laden bis es wieder funktioniert.
Habt ihr eine Idee ? habe nun 20 Seiten in diesem Beitrag gelesen und nix ähnliches finden können. Sorry wenn es schonmal gefragt wurde :-O
Ansonsten echt ne super Sache !
Ist bei mir auch ab und zu so....
Als Ursache ist mir bekannt, wenn es Fehler im HTML gibt, je nach Browser können inkorrekte Tags, fehlende Dateien oder auch nicht beendete Tags so etwas auslösen. Das ist manchmal nicht ganz einfach das zu finden, wenn kein entsprechendes Werkzeugt zum Test da ist, kann ich nur empfehlen das einzugrenzen indem man Teile aus den Seiten herausnimmt, bis es funktioniert.
Für Firefox ist auch die Vewendung von firebug hilfreich, da man etwaige Fehlermeldungen im console/log sehen kann
Wenn ich multistatebutton richtig verstanden habe, sollte der folgende demo-code bei jedem click zwischen den 4 stati durchwechseln?
<div data-type="multistatebutton"
data-device="TEST"
data-get-on='["on","off","unknown","uninteresting"]'
data-icons='["fa-bolt", "fa-power-off", "fa-question", "fa-ban"]'
data-colors='["green", "red", "orange", "blue"]'
data-background-colors='["red", "green", "blue", "orange"]'
></div>
Irgendwie funktioniert das bei mir nicht.
Wenn ich auf den button klicke, sendet er immer den gleichen Befehl (z.B. "on").
Erst wenn ich einen Reload der Webpage mache, sendet er den nächsten Befehl - und dann das ganze Spiel wieder von vorne. :o
Verhält sich übrigens am iPad genau gleich.
Hab ich da was übersehen zu konfigurieren?
Danke
Zitat von: chunter1 am 21 Oktober 2015, 09:12:07
Wenn ich multistatebutton richtig verstanden habe, sollte der folgende demo-code bei jedem click zwischen den 4 stati durchwechseln?
<div data-type="multistatebutton"
data-device="TEST"
data-get-on='["on","off","unknown","uninteresting"]'
data-icons='["fa-bolt", "fa-power-off", "fa-question", "fa-ban"]'
data-colors='["green", "red", "orange", "blue"]'
data-background-colors='["red", "green", "blue", "orange"]'
></div>
Irgendwie funktioniert das bei mir nicht.
Wenn ich auf den button klicke, sendet er immer den gleichen Befehl (z.B. "on").
Erst wenn ich einen Reload der Webpage mache, sendet er den nächsten Befehl - und dann das ganze Spiel wieder von vorne. :o
Verhält sich übrigens am iPad genau gleich.
Hab ich da was übersehen zu konfigurieren?
Danke
Gibt es das Device TEST und ist longpoll beim FTUI an? Nur wenn das Device seinen Status sofort melden kann, funktioniert der Statuswechsel des Multistatebutton.
Ohne Feedback von FHEM kommt des Push Widget aus
<div data-type="push"
data-device="HUEDevice1"
data-set-on='["0","25","50","75","100"]'
></div>
Zitat von: setstate am 21 Oktober 2015, 21:33:32
Gibt es das Device TEST und ist longpoll beim FTUI an? Nur wenn das Device seinen Status sofort melden kann, funktioniert der Statuswechsel des Multistatebutton.
Danke für die Hilfe!
Nachdem kein Device sondern ein dummy dahinter steckt, gabs auch keine Status Rückmeldung.
Was ich allerdings erreichen wollte war, dass sich auch das icon ändert.
Sollte das beim "push" nicht auch mit einem "data-icon" array funktionieren?
Ein Dummy ist auch normales Device für FTUI, das sollte auch funktionen. Der Beispielscode funktioniert bei mir auch sofort, nachdem ich ein passendes Dummy von mir eingetragen habe.
Push kann das Icon nicht wechseln.
Ok, ich hab jetzt folgenden Code am iPad und am PC (Firefox) getestet.
Das komische ist, dass es nach einem webpage-reload immer 10 Sekunden dauert bis die icons sich beim Tastendruck tatsächlich mit ändern.
longpoll ist auf '1' gesetzt.
Die data-set-on Werte werden allerdings sofort richtig übermittelt.
<div data-type="switch"
class="cell big"
data-device="dummyA"
data-set-on='["on","off"]'
data-get-on='["on","off"]'
data-icons='["fa-bolt", "fa-power-off"]'>
</div>
Zitat von: chunter1 am 21 Oktober 2015, 22:49:01
Das komische ist, dass es nach einem webpage-reload immer 10 Sekunden dauert bis die icons sich beim Tastendruck tatsächlich mit ändern.
longpoll ist auf '1' gesetzt.
Longpoll startet gewollt erst nach 10 Sekunden, nur dann ist bei mir das Android Webviewcontrol erst bereit.
Ihr könnt das beim fhem-tablet-ui.js Zeile 85 ändern. Evtl. mache ich das in der nächsten Version änderbar per <meta name="longpoll".
0= aus
1= nach 1 Sekunde
10= nach 10 Sekunden usw.Ich habe eine neue Version hochgeladen, die longpoll automatisch nach dem init der widgets startet. Dann sollte das für alle Varianten passen.
hm also egal ob ich das frisch Installierte nehme oder die Demo sachen ich habe immer das Problem das einiges nicht sauber aufgebaut wird :( Mal gehts mal nicht F5 zeigt quasi immer was anderes mal mehr mal komplett mal fehlen icons ..
Laut FAQ soll es an den HTML Dateien liegen .. aber kann doch nicht alles fehlerhaft sein.
Vielleicht liegt es daran das nicht in den Demos verfügbar ist bei mir ?
Ich kann nur immer wieder empfehlen, nicht einfach die Demos / Beispielsseiten einfach zu übernehmen.
Ich würde immer nur Teile übernehmen und mit den eigenen Devices einfügen. Ohne reelle Devices, die auch Updates im Widget auslösen, ist das Verhalten eher unvorhersehbar. Bestimmt gibt es auch unerwartete Fehler in der Webconsole ...
okay werd ich mal versuchen und berichten :D
Zitat von: setstate am 19 Oktober 2015, 23:22:36
Update ist da. Dimmer, Slider und Volume kann man jetzt dafür benutzen.
Erst einmal vielen Dank fürs Kümmern um die alten FS20-Schätzchen.
Kann es sein, dass es da noch ein Problem mit den Dimmstufen gibt? Die FS20-Dimmer scheinen nicht jeden beliebigen dimx% Wert zu verarbeiten, sondern nur ganz bestimmte. Sieht man, wenn man einen davon abweichenden Wert absetzt wie etwa
set Dimmer_1 dim95%Dann weist fhem darauf hin:
Unknown argument dim95%, choose one of dim06% dim100% dim12% dim18% dim25% dim31% dim37% dim43% dim50% dim56% dim62% dim68% dim75% dim81% dim87% dim93% dimdown dimup dimupdown off off-for-timer on on-100-for-timer-prev on-for-timer on-old-for-timer on-old-for-timer-prev ramp-off-time ramp-on-time reset sendstate timer toggle dim on-till on-till-overnight blink off-till-overnight intervals off-tillDaher schaltet auch das Hochschieben des Sliders auf 100% den Dimmer zwar ein, das Herunterschieben auf 0% aber nicht aus.
Grüße
Martin
Zitat von: dadoc am 22 Oktober 2015, 23:35:04
Kann es sein, dass es da noch ein Problem mit den Dimmstufen gibt? Die FS20-Dimmer scheinen nicht jeden beliebigen dimx% Wert zu verarbeiten, sondern nur ganz bestimmte.
Habe mal einen Workaround gebastelt, der funktioniert, wenn auch sicherlich nicht optimal formuliert und performant:
Das Beispiel geht davon aus, dass die FS20-Dimmer als Dimmer_xx benannt, wobei xx Zahlen von 01 bis 99 sein können.
1. Für jeden Dimmer einen minimalistischen Dummy anlegen mit dem Namen D_xx:
define D_01 dummy2. In der index.html die Dimmer-Slider so einbinden:
<div data-type="dimmer" data-device='D_01'
data-set-on="dim$v%"
data-set-off="off"
data-set-value="dim$v%"
data-get-on="dim([1-9]\d?)?%"
data-get-off="dim0%">
</div>
<div data-type="label" class="cell">Dimmer 1</div>3. Ein notifiy anlegen, das die diskreten Werte des Sliders auf die festen Stufen matched, auf die die FS20-Dimmer reagieren (d.h. ein einziges notify für Dimmer_01 bis Dimmer_99):
define Dimmer_n notify D_.*:(dim.*|off|on) {\
my $Dimmer_Nr = substr($NAME,2,2);;\
my $Dimmer_real = "Dimmer_".$Dimmer_Nr;;\
my $tablet_value = $EVENT;;\
$tablet_value =~ s/dim//;;\
$tablet_value =~ s/%//;;\
if ($$tablet_value "off"){ fhem("set $Dimmer_real off")}\
elsif ($tablet_value "on"){ fhem("set $Dimmer_real on")}\
elsif ($tablet_value == 0){ fhem("set $Dimmer_real off")}\
elsif ($tablet_value > 0 && $tablet_value <= 6){ fhem("set $Dimmer_real dim6%")}\
elsif ($tablet_value > 6 && $tablet_value <= 12){ fhem("set $Dimmer_real dim12%")}\
elsif ($tablet_value > 12 && $tablet_value <= 18){ fhem("set $Dimmer_real dim18%")}\
elsif ($tablet_value > 18 && $tablet_value <= 25){ fhem("set $Dimmer_real dim25%")}\
elsif ($tablet_value > 25 && $tablet_value <= 31){ fhem("set $Dimmer_real dim31%")}\
elsif ($tablet_value > 31 && $tablet_value <= 37){ fhem("set $Dimmer_real dim37%")}\
elsif ($tablet_value > 37 && $tablet_value <= 43){ fhem("set $Dimmer_real dim43%")}\
elsif ($tablet_value > 43 && $tablet_value <= 50){ fhem("set $Dimmer_real dim50%")}\
elsif ($tablet_value > 50 && $tablet_value <= 56){ fhem("set $Dimmer_real dim56%")}\
elsif ($tablet_value > 56 && $tablet_value <= 62){ fhem("set $Dimmer_real dim62%")}\
elsif ($tablet_value > 62 && $tablet_value <= 68){ fhem("set $Dimmer_real dim68%")}\
elsif ($tablet_value > 68 && $tablet_value <= 75){ fhem("set $Dimmer_real dim75%")}\
elsif ($tablet_value > 75 && $tablet_value <= 81){ fhem("set $Dimmer_real dim81%")}\
elsif ($tablet_value > 81 && $tablet_value <= 87){ fhem("set $Dimmer_real dim87%")}\
elsif ($tablet_value > 87 && $tablet_value <= 93){ fhem("set $Dimmer_real dim93%")}\
elsif ($tablet_value > 93 && $tablet_value <= 100){ fhem("set $Dimmer_real dim100%")}\
}Grüße
Martin
Guten Abend,
ich habe soeben versucht das simpleChart einzubauen, leider ohne Erfolgt.
Hier die Eckdaten
FileLog_AZ_Thermostat
AZ_Thermostat-2015.log
<li data-row="2" data-col="2" data-sizex="4" data-sizey="3"> <!-- 928*655 -->
<header>Chart</header>
<div class="cell">
<div data-type="simplechart" data-device="AZ_Thermostat"
data-logfile="SVG_FileLog_AZ_Thermostat_1"
data-logdevice="FileLog_AZ_Thermostat">
</div>
leider bekomme ich nur ein Raster angezeigt ohne Werte....
Gibt es eine Möglichkeit den vertikalen scroll-bounce auf einem iPad zu verhindern?
Ideal wäre, wenn die Webpage vollkommen unbeweglich wird.
Hab leider keine Infos über die unteren Befehle und zusätzliche Optionen gefunden.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
Ich denke, dass das folgende hier helfen sollte, aber wo muss ich das einbauen?
function stopScrolling( touchEvent ) { touchEvent.preventDefault(); }
document.addEventListener( 'touchstart' , stopScrolling , false );
document.addEventListener( 'touchmove' , stopScrolling , false );
Habs jetzt hinbekommen.
Einfach in der Datei ".../fhem/www/tablet/js/fhem-tablet-ui.min.js" den folgenden code hinten anfügen.
function stopScrolling( touchEvent ) { touchEvent.preventDefault(); }
document.addEventListener( 'touchmove' , stopScrolling , false );
Der scroll-bounce am iPad ist damit disabled.
Zitat von: xxsteffenxx am 23 Oktober 2015, 19:26:46
Guten Abend,
ich habe soeben versucht das simpleChart einzubauen, leider ohne Erfolgt.
Hier die Eckdaten
FileLog_AZ_Thermostat
AZ_Thermostat-2015.log
<li data-row="2" data-col="2" data-sizex="4" data-sizey="3"> <!-- 928*655 -->
<header>Chart</header>
<div class="cell">
<div data-type="simplechart" data-device="AZ_Thermostat"
data-logfile="SVG_FileLog_AZ_Thermostat_1"
data-logdevice="FileLog_AZ_Thermostat">
</div>
leider bekomme ich nur ein Raster angezeigt ohne Werte....
data-columnspec fehlt
Super!!!
So klappt es bei mir
<li data-row="4" data-col="1" data-sizex="3" data-sizey="2">
<header>4/1</header>
<div data-type="simplechart"
data-device="WZ_Thermostat"
data-logfile="WZ_Thermostat-2015.log"
data-logdevice="FileLog_WZ_Thermostat"
data-columnspec="4:WZ_Thermostat.temperature:1:int"
data-minvalue="15"
data-maxvalue="25"
data-yticks="1"
data-caption="Wohnzimmer"
class="fullsize">
</div>
Danke
Hallo zusammen,
habe gerade mal wieder alles aktualisiert und jetzt ein Problem.
Schritt 1. Update Tablet UI
Schritt 2. restart
Schritt 3. Update Fhem
Schritt 4. restart
hat alles ohne Problem funktioniert doch nach den Updates zieht das Tablet-UI die Daten aus meiner Anrufliste (Modul FB_Callmonitor) und meinem Zugplan (Modul DBPlan) nicht mehr.
Unter Fhem stehen alle Daten zur Verfügung und vor dem Update lief noch alles richtig.
Was kann ich machen das meine Anzeige die Daten wieder richtig abholt?
Suche schon seit 2 Stunden nach hinweisen... nix :-(
so sieht das aus:
<!-- ============= Zugfahrplan ============= -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="7" data-sizey="2">
<header>Zugfahrplan</header>
<div data-type="label" style="font-size:x-large;color:#aa6900;" class="cell">Freiburg>>Emmendingen</div>
<table border="0px" width="100%">
<tr>
<td>
<div class="inline">
<div data-type="label" class="narrow">Abfahrt</div>
<div type="label" device="db_emmendingen" data-get="plan_departure_1" style="font-size:x-large;color:#96F20C;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_departure_2" style="font-size:x-large;color:#96F20C;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_departure_3" style="font-size:x-large;color:#96F20C;" class="cell"></div>
</div>
<div class="inline">
<div data-type="label" class="narrow">Ankunft</div>
<div type="label" device="db_emmendingen" data-get="plan_arrival_1" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_arrival_2" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_arrival_3" style="font-size:x-large;color:#aa6900;" class="cell"></div>
</div>
<div class="inline">
<div data-type="label" class="narrow">Dauer</div>
<div type="label" device="db_emmendingen" data-get="plan_travel_duration_1" style="font-size:x-large;color:#635EF2;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_travel_duration_2" style="font-size:x-large;color:#635EF2;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_travel_duration_3" style="font-size:x-large;color:#635EF2;" class="cell"></div>
</div>
<div class="inline">
<div data-type="label" class="narrow">Verspaetung</div>
<div type="label" device="db_emmendingen" data-get="plan_departure_delay_1" style="font-size:x-large;color:#F20C23;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_departure_delay_2" style="font-size:x-large;color:#F20C23;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_departure_delay_3" style="font-size:x-large;color:#F20C23;" class="cell"></div>
</div>
<div class="inline">
<div data-type="label" class="narrow">Verbindung</div>
<div type="label" device="db_emmendingen" data-get="plan_connection_1" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_connection_2" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="plan_connection_3" style="font-size:x-large;color:#aa6900;" class="cell"></div>
</div>
<div class="inline">
<div data-type="label" class="narrow">Gleis Abfahrt</div>
<div type="label" device="db_emmendingen" data-get="travel_departure_1" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="travel_departure_2" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="travel_departure_3" style="font-size:x-large;color:#aa6900;" class="cell"></div>
</div>
<div class="inline">
<div data-type="label" class="narrow">Aenderungen</div>
<div type="label" device="db_emmendingen" data-get="travel_change_1" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="travel_change_2" style="font-size:x-large;color:#aa6900;" class="cell"></div>
<div type="label" device="db_emmendingen" data-get="travel_change_3" style="font-size:x-large;color:#aa6900;" class="cell"></div>
</div>
</td>
</tr>
</table>
Bin für jeden Hinweis Dankbar
bitte im HTML Code der FTUI Widgets alle Attribute "device" durch "data-device" und alle "type" in "data-type" ersetzen.
Zitat von: setstate am 05 Mai 2015, 22:37:33
Und da ist es: Update Pagetab Widget Items können jetzt auch 'warn' und zusätzlich 'activate' verstehen.
<div data-type="pagetab" data-device="myDoorBell"
data-get-on='["0","(?:[1-9][0-9]*)","on"]'
data-icons='["fa-fax","fa-fax warn","fa-fax warn activate"]'
data-url="index_door.html" class="cell"></div>
</div>
Damit könnte man zum Beispiel innerhalb einer Menü-Tab-Leiste die Anzahl des Tür-Klingeln anzeigen (warn) und bei einem bestimmten Reading Wert, automatisch auf die entsprechende Seite umschalten (activate).
(http://knowthelist.github.io/fhem-tablet-ui/phone_warn.png)
Servus,
muss ich hierbei irgendwas beachten?
Ich habe ein dummy erstellt, der die Anzahl der leeren Batterien enthält.
Hier kurz der PageTab Code von mir:
<div data-type="pagetab"
data-device="AnzahlLeererBatterien"
data-get-on='["0","(?:[1-9][0-9]*)"]'
data-icons='["fa-battery-full","fa-battery-full warn"]'
data-on-background-color="#337ab7"
data-url="batteriestatus.html"
class="cell"></div>Nun mein Problem. Bei AnzahlLeererBatterien 0 funktioniert der Wechsel zu der Seite nicht. Bei AnzahlLeererBatterien 1 oder 10 wird das "warn" angezeigt und ich kann auch zu der Seite wechseln.
Was machte ich falsch?
Danke für Hilfe.
Beste Grüße
Andy
edit:
also wenn ich auf ***/#batteriestatus.html gehe, wenn AnzahlLeererBatterien 0 ist, wird es auch richtig angezeigt, "wo ich bin". Sobald ich wieder auf einen anderen Tab gehe, kann ich batteriestatus nicht mehr auswählen.
Wenn ich "data-get-on='["0","(?:[1-9][0-9]*)"]'" in "data-get-on='["?:[0]","(?:[1-9][0-9]*)"]'" ändere geht das regex nicht, aber das symbol wird nun als Standard-Symbol angezeigt und ich kann batteriestatus auswählen.
Also mein Problem besteht weiterhin, aber ich weiß nicht, was hier falsch ist.
edit2:
wenn ich die symbole und die data-get-on getauscht habe, ging das öffnen des Tabs bei 0 aber bei anderen zahlen nicht....
nun habe ich einfach an die erste Stelle ein regex reingemacht, was nicht vorkommen kann und gut ist. ist zwar eine Lösung, aber keine schöne
@setstate
Danke das war es.
Habe die Änderung leider nicht mitbekommen.
Gruß
namor
Zitat von: namor am 25 Oktober 2015, 13:34:12
@setstate
Danke das war es.
Habe die Änderung leider nicht mitbekommen.
Gruß
namor
Die Änderung gab es auch schon sehr lange, nach einen Tipp hier im Forum, dass die benutzen Attribute nicht dem HTML5 Standard entsprechen würden. Ich hatte dann übergangsweise eine automatische Anpassung für "AltHtml" im Code mit drin, den ich ich nun aber rausgeschmissen habe, weil ich der Annahme war, dass nun alle Seiten angepasst wären. Sorry, aber manchmal müssen harte Änderungen sein, dann wird alles besser ;D
Hallo,
ich weiß nicht ob die Frage hier richtig ist, aber irgendwie passt es dazu.
Ich nutze zur Anzeige der Geburtstage das calview modul in Verbindung mit dem calender Modul. Zur Zeit werden nur der Name und das Datum angezeigt. Das Geburtsdatum habe ich in location geschrieben, damit es von calview anzeigt wird. Ist es möglich irgendwie das Alter zu berechnen? z.b. per Dummy aktuelles Jahr - location = alter in Jahren evtl auch per Perl, aber davon habe ich leider keine Ahnung.
Wäre echt super, wenn jemand eine Lösung für das Problem parat hat.
Danke
Zitat von: Phil__ am 21 Mai 2015, 20:10:45
Hallo,
so hier meine fertige Lösung zur Anzeige der Müllabfuhrtermine. Mit bestem Dank an mc-hollin!!!
Im Menü meiner index.html wird, am Button das auf die Muellabfuhr übersichtsseite verlinkt, am Vortag einer Lehrung ein Warning engeblendet.
Auf der Übersichtsseite, muell.html, werden die Tonnen mit der Anzahl der Tage bis zur Leerung angezeigt.
Um 18 Uhr am Vortag einer Leerung bekomme ich eine Pushover Mitteilung auf mein Smartphone.
Für die Abfuhrtermin habe ich bei meinem Städischen Entsorger die Termine als .ics downloaden können und sie in einen Googlekalender importiert.
PS: Die Graue Tonne, untem auf dem Screenshot der muell.html, sieht man nicht da sie einen Vortag anfängt zu blinken. Screenshot zum falschen Zeitpunkt! ;)
Hallo Phil__
meine Anzeige klappt soweit, nur ist mir heute morgen aufgefallen,
das mein Dummy Restmuell sich zuletzt vor 3 Tagen aktualisert hat
Internals
NAME
Restmuell
NR
137
STATE
1
TYPE
dummy
Readings
state
1
2015-10-24 15:36:30Das log spuckt folgendes aus - ist das der Fehler?
2015.10.26 07:23:11 1: PERL WARNING: "my" variable $dayDiff masks earlier declaration in same scope at ./FHEM/99_myUtils.pm line 78.
2015.10.26 07:23:11 1: PERL WARNING: "my" variable $dayDiff masks earlier declaration in same scope at ./FHEM/99_myUtils.pm line 82.
2015.10.26 07:23:11 1: PERL WARNING: "my" variable $dayDiff masks earlier declaration in same scope at ./FHEM/99_myUtils.pm line 86.
Hallo zusammen,
zuerst will ich auch noch ein dickes Lob an die Macher des FTUI aussprechen. Seit ich die Oberfläche gefunden habe, kann ich mich vor kleinen Projekten kaum bremsen!
Nun habe ich jedoch ein (höchstwahrscheinlich) kleines Problem. Ich habe mir ein paar Widgets zusammengebastelt, welche meinen Yamaha Receiver steuern sollen. Es klappt soweit alles prima, nur zwei Readings (CurrentStation und CurrentChannel) zeigen im Label-Widget im ausgeschalteten Zustand immer das Datum des letzten "Leseversuchs" an - anstatt leer zu bleiben.
(siehe Screenshots)
Ich konnte für dieses Problem bisher leider keine Lösung finden, kann mir hier jemand einen heißen Tipp geben?
Vielen Dank im Voraus.
Gruß
Charly
Hallo Charly,
Vielen Dank fürs Lob und Dank zurück fürs Benutzen. :)
Ich vermute, beim Auslesen des Status kommt es durch den Leerstring zu einem Durcheinander und das Datum wird als Status genommen.
Workaround wäre: mit data-part und einem RegEx nur Buchstaben [A-Za-z] zu akzeptieren.
Zitat von: setstate am 25 Oktober 2015, 14:01:39
Die Änderung gab es auch schon sehr lange, nach einen Tipp hier im Forum, dass die benutzen Attribute nicht dem HTML5 Standard entsprechen würden. Ich hatte dann übergangsweise eine automatische Anpassung für "AltHtml" im Code mit drin, den ich ich nun aber rausgeschmissen habe, weil ich der Annahme war, dass nun alle Seiten angepasst wären. Sorry, aber manchmal müssen harte Änderungen sein, dann wird alles besser ;D
Das sehe ich auch so, dass Änderungen manchmal durchgreifend sein müssen. Nur entsteht oft ein Problem, wenn die Doku hinterher hinkt. In einigen Bereichen wird immer noch z.B. "device" vs. "data-device" u.v.m kolportiert.
https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/button
... Viele Grüße!
Andreas
Hallo zusammen,
erst einmal... super Arbeit, Glückwunsch. Sieht klasse aus und kann super gut angepasst werden.
Meine ersten Versuch damit haben auf Anhieb funktioniert.
Das einzige was mir auf gefallen ist, das bei jedem ersten Start, dauert es sehr lange 2-3 min. bis sich nach und nach die Anzeigen mit Leben füllen(Daten erhalten). Ist das normal oder mache ich noch was falsch? Longpoll ist auf 1 gesetzt.
VG Markus
Zitat von: setstate am 27 Juni 2015, 13:31:11
New Widget: Popup Widget
...
- Mini Cam-Vorschau nach Klick als großes Bild
...
Ich bekomm's immer noch nicht hin. Wenn ich unten stehenden Code bei mir einbaue, dann wird zwar ein Pop-Up geöffnet, dieses wird aber ganz und gar nicht mittig angezeigt. Das Pop-Up ist ziemlich nach rechts verschoben sogar von der Breite so groß, dass es gar nicht mehr auf den Screen passt. Das aufgerufenen Bild wird zwar von der Größe her richtig angezeigt, es ist aber ein grauer Rand links und rechts vom Bild (siehe Screenshot). Hat jemand eine Ahnung was da zwicken könnte?
P.S. Kamerabild ist gerade wirklich schwarz ;-)
<li data-row="6" data-col="9" data-sizex="6" data-sizey="4">
<header>GARTENTOR</header>
<div data-type="popup">
<div data-type="image"
data-url="http://192.168.1.34/mjpeg"
data-size="550"></div>
<div class="dialog">
<div data-type="image"
data-url="http://192.168.1.34/mjpeg"></div>
</div>
</div>
</li>
hallo @skuggy schön das noch ein paar das calview widget nutzen.
ich habe heute mal ein bissl rumprobiert und habe deine anforderungen mal so umgesetzt, allerdings nutze ich nur den part data-get="all", für die anderen müsstest du das dann einfach adaptieren.
des weiteren habe ich noch zwei eigenschaften eingeführt, womit sich die einfärbung steuern lässt.
data-all-forecast-color="#FFF200"
data-all-today-color="6EB54C"
wie gesagt mal schnell zusammen getippt.
was mir noch irgendwie schleier haft ist, ist das cachen, irgendwie cachet der browser die anzeige.
vielleicht kann mir da jemand einen tipp geben, dass das nicht passiert.
wobei ich gerade sehe, dass der termin tatsächlich bei dem device calview zwei mal drin steht.
DEF Geburtstage
INTERVAL 43200
KALENDER Geburtstage
NAME GeburtstageCalView
NR 132
STATE t: 10 td: 2 tm: 1
TYPE CALVIEW
Readings:
2015-10-27 01:38:53 c-term 10
2015-10-27 01:38:53 c-today 2
2015-10-27 01:38:53 c-tomorrow 1
2015-10-27 01:38:53 state t: 10 td: 2 tm: 1
2015-10-27 01:38:53 t_001_bdate 27.10.2015
2015-10-27 01:38:53 t_001_btime 00:00:00
2015-10-27 01:38:53 t_001_edate 28.10.2015
2015-10-27 01:38:53 t_001_etime 00:00:00
2015-10-27 01:38:53 t_001_location 1985
2015-10-27 01:38:53 t_001_source Geburtstage
2015-10-27 01:38:53 t_001_summary Test 1
2015-10-27 01:38:53 t_002_bdate 27.10.2015
2015-10-27 01:38:53 t_002_btime 00:00:00
2015-10-27 01:38:53 t_002_edate 28.10.2015
2015-10-27 01:38:53 t_002_etime 00:00:00
2015-10-27 01:38:53 t_002_location 1985
2015-10-27 01:38:53 t_002_source Geburtstage
2015-10-27 01:38:53 t_002_summary Test 1
2015-10-27 01:38:53 t_003_bdate 28.10.2015
2015-10-27 01:38:53 t_003_btime 00:00:00
2015-10-27 01:38:53 t_003_edate 29.10.2015
2015-10-27 01:38:53 t_003_etime 00:00:00
2015-10-27 01:38:53 t_003_location 1910
2015-10-27 01:38:53 t_003_source Geburtstage
2015-10-27 01:38:53 t_003_summary Morgen 2
gruß uniqueck
Hallo @uniqueck,
wow, das sieht super aus. Genauso hab ich mir das gewünscht :-)
Könntest du vielleicht nochmal den html-code posten?
Danke
Zitat von: skuggy am 27 Oktober 2015, 06:56:16
Hallo @uniqueck,
wow, das sieht super aus. Genauso hab ich mir das gewünscht :-)
Könntest du vielleicht nochmal den html-code posten?
Danke
Hallo @skuggy,
natürlich kann ich dir den html code zur Verfügung stellen, aber ist nicht besonders anders, außer das die zwei zusätzlichen Optionen mit angegeben werden.
<div data-type="calview" data-device="GeburtstageCalView" data-get="all" data-max="4" class="cell centered fullsize top-space" data-all-forecast-color="#FFF200" data-all-today-color="#6EB54C"></div>
Grüße uniqueck
achso bevor ich es vergesse, da es auf dem screenshot nicht ersichtlich war, aller termine welche nicht heute bzw. in den nächsten 7 tagen statt finden, werde in ganz normalen weiß dargestellt, oder was auch immer bei dir in der css definiert ist.
Hallo setstate,
vielen Dank für deine schnelle Antwort. Leider habe ich es mit deinem Lösungsvorschlag nicht hinbekommen - da auch in den Sendernamen immerzu Zahlen vorkommen (z.B. SWR3 ...). Habe daraufhin eine Readingsgroup gebastelt, welche nun auch aus dem Sendernamen gleich ein Logo anzeigt (an den Logos muss ich jedoch noch arbeiten):
Viele Grüße
Charly
Vielen Dank für die schnelle Hilfe...
Hallo,
ich habe schon etwas gesucht, aber leider nichts passendes gefunden: Gibt es für "data-template" eine Möglichkeit, Parameter zu konfigurieren?
Meine aktuelle Situation ist, dass ich in der index.html mehrere gleichaussehende Element-Gruppen habe, die ich in Templates ausgelagert habe:
<div data-template="/fhem/ftui/sz_heizung.tmpl"></div>
<div data-template="/fhem/ftui/k_heizung.tmpl"></div>
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=39366)
Die Templates sehen dabei komplett identisch aus, bis auf die Angaben zu "data-device". Ziel wäre also, ein generisches Template "heizung.tmpl" zu schreiben, dass dann per Parameter in der index.html eine eigene Konfiguration hat.
<div data-template="/fhem/ftui/heizung.tmpl" template-param="thermostat=sz_heizung,window=sz_fenster"></div>
<div data-template="/fhem/ftui/heizung.tmpl" template-param="thermostat=k_heizung,window=k_fenster""></div>
Gibt es diese Möglichkeit bereits?
Viele Grüße
ManOki
Parameter für Templates habe ich mir auch schon überlegt und auch schon auf der Angenda
Aber leider mehr auch noch nicht.
Zitat von: ManOki am 27 Oktober 2015, 11:41:15
Hallo,
ich habe schon etwas gesucht, aber leider nichts passendes gefunden: Gibt es für "data-template" eine Möglichkeit, Parameter zu konfigurieren?
Meine aktuelle Situation ist, dass ich in der index.html mehrere gleichaussehende Element-Gruppen habe, die ich in Templates ausgelagert habe:
<div data-template="/fhem/ftui/sz_heizung.tmpl"></div>
<div data-template="/fhem/ftui/k_heizung.tmpl"></div>
(http://forum.fhem.de/index.php?action=dlattach;topic=34233.0;attach=39366)
Die Templates sehen dabei komplett identisch aus, bis auf die Angaben zu "data-device". Ziel wäre also, ein generisches Template "heizung.tmpl" zu schreiben, dass dann per Parameter in der index.html eine eigene Konfiguration hat.
<div data-template="/fhem/ftui/heizung.tmpl" template-param="thermostat=sz_heizung,window=sz_fenster"></div>
<div data-template="/fhem/ftui/heizung.tmpl" template-param="thermostat=k_heizung,window=k_fenster""></div>
Gibt es diese Möglichkeit bereits?
Viele Grüße
ManOki
Wenn jemand interessiert ist, ich habe dazu ein Server-Modul geschrieben, dass die Includes abhandelt. Ich habe nämlich sehr viele Einträge, die sich nur in device, icon, text und ähnlichem unterscheiden aber aus mehreren Widgets bestehen.
Die Idee ist, dass dann im HTML nur soetwas steht wie:
<?ftui-inc="somfy.ftui.part" device="roll_wz_1" label="Terasse" ?>Auf der Serverseite wird dann das entsprechende Template in das HTML eingemischt und die Variablen ersetzt. Das Template seiht dann ungefähr so aus:
<!-- SOMFY left - keys - device label-->
<div class="left centered">
<div data-type="label" class=""><?ftui-key=label ?></div>
<div data-type="slider" data-device='<?ftui-key=device ?>' data-get="STATE" data-min="0" data-max="100"
data-on='(down|closed)' data-off='(open|off)' data-value=true class="mini negated textvalue small">
</div>
<div class="triplebox-v small top-space-2x">
<div data-type="push" data-device="<?ftui-key=device ?>" data-icon="fa-chevron-up" data-background-icon="fa-square-o" data-set="off" class=""> </div>
<div data-type="push" data-device="<?ftui-key=device ?>" data-icon="fa-minus" data-background-icon="fa-square-o" data-set="stop" class=""> </div>
<div data-type="push" data-device="<?ftui-key=device ?>" data-icon="fa-chevron-down" data-background-icon="fa-square-o" data-set="on" class=""> </div>
</div>
</div>
Ich habe vor, dass hier in einem separaten Thread vorzustellen, denn insbesondere wenn ich am Design oder an den Namen herumfeile, muss ich nur noch eine Stelle ändern und nicht für 15 Rollände, 4 Sonos-Devices, etc
Achso, ein Vorteil der Serverlösung ist, dass man auch noch weitere Funktionalität in Abhängigkeit von Deviceinfos einbauen könnte, so hatte ich gehofft, dass man dynamisch Seiten zusammenbauen kann, durch Auswahl mehrerer devices oder gar Elemente ausblenden basierend auf dem Status und und und...
Moin,
hab dazu grad nichts gefunden daher Frag ich einfach mal nach: ist es möglich im Homestatus Widget nur 3 States zu definieren? Weil mir reicht Away, Night und Home. Holiday brauch ich an der stelle nicht und stört eher nur..
Hallo nochmal,
der Klassiker...einmal das ganze aufgeschrieben, nochmal in Ruhe drüber nachgedacht, direkt eine Lösung gefunden:
Es gibt ein JQuery-Plugin für Templates: http://codepb.github.io/jquery-template/
Hier eine kleine Anleitung, was ich gemacht habe:
1. jquery.loadTemplate-1.5.0.min.js aus dem Git-Repo in mein FHEM-Ordner "/fhem/www/tablet/lib/" kopiert.
2. index.html am Ende (nach den anderen JQuery-Plugins) um die folgende Zeile ergänzt:
<script type="text/javascript" src="/fhem/tablet/lib/jquery.loadTemplate-1.5.0.min.js"></script>3. Das Template wird jetzt per Java-Script geladen, also statt data-template braucht das <div> eine id.
<div id="az_heizung"></div>4. Nach dem Skript aus Schritt 2 kommt der folgende Code:
<script>
$("#az_heizung").loadTemplate("/fhem/ftui/heizung.tmpl",
{
heizung: 'az_heizung',
fenster: 'az_fenster'
});
</script>5. Hier kommt der ganze Trick: das Template (Auszug) mit dem speziellen "data-template-bind"-Attribut:
<div data-template-bind='[{"attribute": "data-device", "value": "heizung"}]' data-type="thermostat" data-valve="valveposition" data-get="desiredTemperature" data-temp="temperature" data-set="desiredTemperature" data-min="5" class="narrow darker right"></div>Mit dem Attribut "data-template-bind" weise ich dem JQuery-Plugin an, auf das entsprechende <div> das 'attribute' mit Namen 'data-device' auf den Wert ('value') zu setzen, der vorher in Schritt 4 als Paramter übergeben wurde, also in meinem Fall heizung: 'az_heizung'.
EDIT: Noch etwas universeller: Mein Template ist in der Datei "heizung.tmpl", mit dem folgenden Code können die Template beliebig heißen und beliebige Parameter übergeben.
<div template="heizung" param='{"heizung": "az_heizung", "fenster": "az_fenster"}'></div><script>
$("[template]").each(function(e) {
var template = $(this).attr('template');
var param = $(this).attr('param');
var paramJSON = $.parseJSON(param);
$(this).loadTemplate("/fhem/ftui/"+template+".tmpl", paramJSON);
});
</script>Ich hoffe, die Anleitung hilft. Mein Problem scheint damit erstmal gelöst.
Vielen Dank trotzdem für die Antworten
ManOki
Hallo,
ich versuche gerade das UI in Betrieb zu nehmen. Mein Gridster hat 6 Spalten. (Aktuell 6 einfache Widgets). Leider ist die Breite der Seite zu groß so, dass diese ca. 5mm (links/rechts) an meinem 7" verschiebbar ist. Also müsste ich entweder die Widgets schmaler machen oder den Abstand zwischen den Widgets verkleinern... allerdings finde ich den relevanten Eintrag nicht. Könnt ihr mir bitte sagen was ich machen muß/kann...
Grüße Dirk
Zitat von: gibacht am 27 Oktober 2015, 19:31:33
Hallo,
ich versuche gerade das UI in Betrieb zu nehmen. Mein Gridster hat 6 Spalten. (Aktuell 6 einfache Widgets). Leider ist die Breite der Seite zu groß so, dass diese ca. 5mm (links/rechts) an meinem 7" verschiebbar ist. Also müsste ich entweder die Widgets schmaler machen oder den Abstand zwischen den Widgets verkleinern... allerdings finde ich den relevanten Eintrag nicht. Könnt ihr mir bitte sagen was ich machen muß/kann...
Grüße Dirk
Hallo Dirk
In der Readme.md gibt es dazu ein paar Sätze:
Change this to adjust the size of a Gridster base (data-sizey=1/data-sizex=1)
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
Add this to adjust the size of the Gridster margin
<meta name="widget_margin" content="4">
Dieses Meta Daten sind in der Index.html zu finden bzw. müssen dort rein.
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
Die base-Werte habe ich variiert (in beide Richtungen), wobei sich keine Anzeigenänderung zeigte...
der nachfolgende Eintrag fehlte bei mir. Jedoch ändert sich die Anzeige dadurch auch nicht, obwohl ich 1,2 und 4 getestet habe...
<meta name="widget_margin" content="4">
Hast Du noch eine Idee?
Hallo zusammen,
ich habe heute versucht das Modul Klimatrend von nesges einzubauen.
meine fhem.cfg
define STATISTICS_WZ statistics WZ_Thermostat
define STATISTICS_EZ statistics EZ_Thermostat
define STATISTICS_SZ statistics SZ_Thermostat
define STATISTICS_BD statistics BD_Thermostat
define STATISTICS_AZ statistics AZ_Thermostat
als html habe ich folgendes
<div data-type="klimatrend"
data-device="SZ_Thermostat"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="2"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
></div>
Das komische ist, beim device WZ-Thermostat bekomme ich mit "list" folgende Ausgabe
2015-10-27 19:55:35 statTemperatureDay Min: 19.2 Avg: 19.2 Max: 19.2 (since: 2015-10-27_19:45:51 )
2015-10-27 19:55:35 statTemperatureMonth Min: 19.2 Avg: 19.2 Max: 19.2 (since: 2015-10-27_19:45:51 )
2015-10-27 18:59:55 statTemperatureTendency 1h: +0.5 2h: +0.4 3h: +0.8 6h: +0.5
2015-10-27 19:55:35 statTemperatureYear Min: 19.2 Avg: 19.2 Max: 19.2 (since: 2015-10-27_19:45:51 )
bei EZ_Thermostat bekomme ich nur folgendes, da fehlt genau statTemperaturTendency
2015-10-27 19:56:35 statTemperatureDay Min: 19.8 Avg: 19.8 Max: 19.8 (since: 2015-10-27_19:50:50 )
2015-10-27 19:56:35 statTemperatureMonth Min: 19.8 Avg: 19.8 Max: 19.8 (since: 2015-10-27_19:50:50 )
2015-10-27 19:56:35 statTemperatureYear Min: 19.8 Avg: 19.8 Max: 19.8 (since: 2015-10-27_19:50:50 ) [code][/code]
Folgende frage die vielleicht nicht ganz hier rein passt.
Ich habe diverse Sensoren die ich mir in TabletUI anzeigen lasse. Die Sensoren sind hautpsächlich 433Mhz Temp/Hum Sensoren sowie einige Ds18B20 usw. Die Sensoren liefern mir alle 30sek neue Werte. Jetzt hatte ich folgendes Problem das der ein oder andere Sensor mal ausgefallen ist dies habe ich aber nach 2 - 3 Tagen festgestellt.
Wie kann ich jetzt eine funktion erstellen. die prüft ob z.B. innerhalb eines Zeitfenster von 5minuten einen Wert empfangen hat. Das ganze wollte ich als "Symbol" in TabletUI angzeigt bekommen. Soll heißen wenn alles ok ist soll das Icon Grün sein. Sollte nach 5 Minuten kein Wert empfangen worden sein soll das Icon Rot sein.
Die Funktion des eigentlichen Symbols mit Farbändernung ist kein Problem. Nur wie kann ich die Funktion realisieren?
Zitat von: danieljo am 27 Oktober 2015, 21:27:28
Folgende frage die vielleicht nicht ganz hier rein passt.
Ich habe diverse Sensoren die ich mir in TabletUI anzeigen lasse. Die Sensoren sind hautpsächlich 433Mhz Temp/Hum Sensoren sowie einige Ds18B20 usw. Die Sensoren liefern mir alle 30sek neue Werte. Jetzt hatte ich folgendes Problem das der ein oder andere Sensor mal ausgefallen ist dies habe ich aber nach 2 - 3 Tagen festgestellt.
Wie kann ich jetzt eine funktion erstellen. die prüft ob z.B. innerhalb eines Zeitfenster von 5minuten einen Wert empfangen hat. Das ganze wollte ich als "Symbol" in TabletUI angzeigt bekommen. Soll heißen wenn alles ok ist soll das Icon Grün sein. Sollte nach 5 Minuten kein Wert empfangen worden sein soll das Icon Rot sein.
Die Funktion des eigentlichen Symbols mit Farbändernung ist kein Problem. Nur wie kann ich die Funktion realisieren?
Ich habe bei mir das Label unter der Temperaturanzeige farblich eingefärbt:
<div data-type="label" data-device="temp_gb" data-get="lastupdate" data-limits='[".*d",".*h",".*"]' data-colors='["#C00000","#aa6900","#eeeeee"]' class="cell narrow fixedlabel">Temperatur</div>Dazu habe ich ein userreading definiert, dass wiederum auf Myutils-Funktionen basiert:
userReadings lastupdate {getTimeDiffDesc( getNewestTimestamp("temp_gb", "battery", "temperature","humidity" ) )}getTimeDiffDesc berechnet einen Text für die Differenz zwischen jetzt und dem neuesten Timestamp. Dieser neueste Timestamp wird von getNewestTimestamp berechnet...
Die Myutils-Funktionen sind unten.
Zitat von: xxsteffenxx am 27 Oktober 2015, 20:02:30
Hallo zusammen,
ich habe heute versucht das Modul Klimatrend von nesges einzubauen.
meine fhem.cfg
define STATISTICS_WZ statistics WZ_Thermostat
define STATISTICS_EZ statistics EZ_Thermostat
define STATISTICS_SZ statistics SZ_Thermostat
define STATISTICS_BD statistics BD_Thermostat
define STATISTICS_AZ statistics AZ_Thermostat
als html habe ich folgendes
<div data-type="klimatrend"
data-device="SZ_Thermostat"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="2"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
></div>
Das komische ist, beim device WZ-Thermostat bekomme ich mit "list" folgende Ausgabe
2015-10-27 19:55:35 statTemperatureDay Min: 19.2 Avg: 19.2 Max: 19.2 (since: 2015-10-27_19:45:51 )
2015-10-27 19:55:35 statTemperatureMonth Min: 19.2 Avg: 19.2 Max: 19.2 (since: 2015-10-27_19:45:51 )
2015-10-27 18:59:55 statTemperatureTendency 1h: +0.5 2h: +0.4 3h: +0.8 6h: +0.5
2015-10-27 19:55:35 statTemperatureYear Min: 19.2 Avg: 19.2 Max: 19.2 (since: 2015-10-27_19:45:51 )
bei EZ_Thermostat bekomme ich nur folgendes, da fehlt genau statTemperaturTendency
2015-10-27 19:56:35 statTemperatureDay Min: 19.8 Avg: 19.8 Max: 19.8 (since: 2015-10-27_19:50:50 )
2015-10-27 19:56:35 statTemperatureMonth Min: 19.8 Avg: 19.8 Max: 19.8 (since: 2015-10-27_19:50:50 )
2015-10-27 19:56:35 statTemperatureYear Min: 19.8 Avg: 19.8 Max: 19.8 (since: 2015-10-27_19:50:50 ) [code][/code]
War da nicht mal was das es nur ein einziges STATISTIC Modul geben kann wo alle Devices enthalten sind. Mir war mal so als habe ich da was gelesen gehabt.
Grüße
Wie schon oben geschrieben, wollte ich eine Lösung, bei der auf dem Server Teile ersetzt werden können, so dass sich einfach Gruppen von Widgets wiederverwenden lassen und auch auf einmal ändern lassen. Die Idee dabei ist, dass man auch Teile beim Laden ersetzen kann (also z.B: versch. Devicenamen oder Labels).
Eine genaue Beschreibung und Möglichkeit zur Diskussion findet sich hier:
http://forum.fhem.de/index.php/topic,43110.msg350991.html#msg350991 (http://forum.fhem.de/index.php/topic,43110.msg350991.html#msg350991)
Feedback und Vorschläge zur Erweiterung sind sehr willkommen.
Gruss,
Johannes
Zitat von: viegener am 27 Oktober 2015, 21:54:10
getTimeDiffDesc berechnet einen Text für die Differenz zwischen jetzt und dem neuesten Timestamp. Dieser neueste Timestamp wird von getNewestTimestamp berechnet...
bei mir wirft das Log sowas raus
2015.10.27 23:24:23 1: myutils -> getNewestTimestamp: temp_gb ::und es steht dort bei lastupdate immer <1m
wofür ist dieses temp_gb und muss man zwingend 3 parameter mitgeben?
Ich wollte dieses Snippet für meine Gieß-Sensoren ausprobieren, welche mit MySensors laufen. Diese benötigen aber nur 1 oder 2 Parameter.
Oops Sorry, das war jetzt nicht als komplett fertige Lösung sondern mehr als Kopiervorlage zur eigenen Anpassung gedacht.
temp_gb ist der Device von dem die timestamps gelesen werden sollen.
Wie auch in der sub erkennbar erlaubt getNewestTimestamp variable Anzahl von Parametern und es muss mindestens ein device und ein Reading angegeben werden.
Johannes
Moin.
Kann ich mit pagetab auch mehrere Devices auslesen?
Habe auf meiner Seite "Bad" z.B. 3 batterien von 3 verschiedenen devices. wenn eine jetzt leer ist soll pagetab die "Bad" seite auf machen. geht das?
oder gibt es in fhem ein möglichkeit z.b. einen dummy mit den 3 batterie-daten zu füttern und wenn eine leer ist wechselt der status oder ein reading?
danke schon mal
Hallo,
ich versuche verzeifelt den Button in Abhängigkeit des Inhalts vom Device:calview, reading:c-today farblich unterschiedlich darzustellen.
Es sollte: ...
wenn, c-today != 0 ist, die background-color "red" sein
wenn, c-today = 0 ist, die background-color "green" sein
Es funktioniert schlicht nicht.
<div data-type="label" class="cell narrow center">Termine</div>
<div style="font-size:33px;" data-type="button"
data-icon="fm-calendar"
data-url="#kalender.html"
data-device="calview"
data-get="c-today"
data-background-icon="fa-square"
data-background-colors='["red","green"]'
data-get-on='["!0","0"]'
class="cell">
</div>
Was mache ich falsch ??
Viele Grüße!
Andreas
Vorweg: Ich bin Ahnungsloser
Was passiert, wenn Du beide Zeilen vertauscht:
data-get-on='["!0","0"]'
data-background-colors='["red","green"]'
Zitat von: fhem-challenge am 28 Oktober 2015, 13:29:37
<div data-type="label" class="cell narrow center">Termine</div>
<div style="font-size:33px;" data-type="button"
data-icon="fm-calendar"
data-url="#kalender.html"
data-device="calview"
data-get="c-today"
data-background-icon="fa-square"
data-background-colors='["red","green"]'
data-get-on='["!0","0"]'
class="cell">
</div>
data-on-background-colors='["red","green"]'
^^ändern^^
https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/button
sollte dann gehen ... denke ich :-D
@Gunther ... Definition ist Definition... das sollte keinen Unterschied machen.
Zitat von: roman1528 am 28 Oktober 2015, 13:40:36
data-on-background-colors='["red","green"]'
^^ändern^^
https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/button
sollte dann gehen ... denke ich :-D
@Gunther ... Definition ist Definition... das sollte keinen Unterschied machen.
Nein, geht leider nicht. Im link zu "nesges" steht auch "data-on-background-color" (ohne "s"). Aber auch beides funktioniert nicht. Weder: data-on-background-colors='["red","green"]' , mnoch data-on-background-color='["red","green"]', oder auch nicht data-on-background-colors='["#FF0000","#00FF00"]' ... habe schon beliebige Permutationen durchgespielt ... :-(
Nachtrag:
lediglich diese Variante geht semi-korrekt. Hierbei wird der Button tatsächlich "green", wenn ich "setreading calview c-today 0" setze. Allerdings wird er nicht "red", wenn ich "setreading calview c-today 2"
data-get-on='["!0","0"]'
data-background-colors='["red","green"]' Das wird immer surriler :-(
EDIT...
data-get-on='["^(?!0).*","0"]'
regex für "alles außer" in deinem fall "0" ... hatte auch probleme damit^^ das hat man davon wenn man wie ich kein regex beherrscht .. hatte vorher noch nie was davon gehört
Zitat von: roman1528 am 28 Oktober 2015, 13:54:28
dann definier mal die background icons als array...
data-on-background-icons='["fa-square","fa-square"]'
damit er weiß welchem icon er überhaupt eine farbe zuordnen soll ... vergleich von array und array^^
Hatte ich schon gemacht, ohne Erfolg.
habe aber jetzt den Grund für das Problem gefunden:
1.) im Reading "c-today" gibt es lediglioch ein int-Wert. Wenn dieser allerdings "0" ist, wird das vermutlich als "off" oder Vergleichbares aufgefasst. D.h. es existiert hier eine Besonderheit beim "parsing". Wenn ich Folgendes mache, funktioniert es:
Setze ich hier im reading "true" , "false", dann wirds auch "red" oer "green"
data-get-on='["true","false"]'
data-background-colors='["red","green"]' Setze ich hier "0" oder "2" (bzw. irgend etwas !=0) funktioniert lediglich "green" == "0". Also entweder "klappt" hier bei "data-get-on" regExp nicht oder es stimmt das pasring von "data-get-on" noch nicht so richtig.
data-get-on='["!0","0"]'
data-background-colors='["red","green"]'
siehe oben ...
Zitat von: roman1528 am 28 Oktober 2015, 14:06:42
siehe oben ...
Ja! exakt, das löst das Problem. Vielen Dank!
Ich dachte immer, dass hier "anders" geparsed wird und hatte die Variante "!0" hier irgendwo aufgeschnappt... regexp mach ich nun viel, ich bin garnicht davon ausgegangen, dass hier "ungefiltert" regexp in diesem widget "durchgereicht" wird (ich hätte es mir auch leichter machen können, und den source mir anschauen sollen ... machmal steht man auch wie blockiert vor dem Problem).
Viele Grüße!
Andreas
Zitat von: roman1528 am 28 Oktober 2015, 12:21:05
Moin.
Kann ich mit pagetab auch mehrere Devices auslesen?
Habe auf meiner Seite "Bad" z.B. 3 batterien von 3 verschiedenen devices. wenn eine jetzt leer ist soll pagetab die "Bad" seite auf machen. geht das?
oder gibt es in fhem ein möglichkeit z.b. einen dummy mit den 3 batterie-daten zu füttern und wenn eine leer ist wechselt der status oder ein reading?
danke schon mal
Bevor das hier jetzt wieder untergeht und ich vergeblich auf eine Antwort warte...
irgendwas mit Readings geht doch da bestimmt... Wenn eins der 3 Readings "low" ist irgendeinen state z.B. 'false' triggern... kann mir wer helfen?
Zitat von: roman1528 am 28 Oktober 2015, 14:16:43
Bevor das hier jetzt wieder untergeht und ich vergeblich auf eine Antwort warte...
irgendwas mit Readings geht doch da bestimmt... Wenn eins der 3 Readings "low" ist irgendeinen state z.B. 'false' triggern... kann mir wer helfen?
So würde ich das auch machen. Ein Dummy anlegen und zyklisch mit at die Spannungen der Devices auslesen und wenn eine Spannung kleiner als Sollwert, dann "set dummySpannung low"
Darauf reagiert dann das Tab / Switch auf dem Tablet.
Hallo,
ich habe heute mal nach längerer Zeit mal wieder ein Update von Tablet UI und den Widgets gemacht.
Seit dem habe ich bei einigen meiner Buttons ein Darstellungsproblem.
Die normalen Buttons werden korrekt dargestellt, aber sobald eine "Sonderfunktion" (wie etwa das Symbol im Button farblich einfärben, oder den Button blinken lassen) zugeordnet ist, wird entweder gar kein Button dargestellt, oder nur das Symbol.
Vor dem Update funktionierte es einwandfrei.
Hier mal meine Definitionen:
<li data-row="5" data-col="5" data-sizex="1" data-sizey="1">
<header>Anwesenheit</header>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-device="GTag_Audi"
data-get-on='["present","absent"]'
data-icon="fa-car"
data-on-colors='["#009933","#CC0000"]'
class="cell small"></div>
<div data-type="label" class="narrow darker">Audi</div>
</li>
<li data-row="2" data-col="6" data-sizex="1" data-sizey="1">
<header>Muell</header>
<div style="font-size:30px; color:rgb(96, 0, 0);"
data-type="button"
data-device="Muellalert"
data-color="#aa6900"
data-get-on='["on","off"]'
data-url="muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="cell small"></div>
<div data-type="label" class="narrow darker">Muell</div>
</li>
Irgendwie finde ich da den fehler nicht. :'(
Hallo,
ich bin noch ein Anfänger mit der TabletUI. Meine Thermostate (MAX) habe ich mit dem Thermostat Widget eingebunden und kann sie auch steuern, aber der Zeiger und die Temperatur stehen beim Start immer auf 10 Grad. Wenn ich die Temp. verstelle ändert sich Zeiger und Anzeige bleibt aber dann stehen bis ich wieder manuell ändere, oder beim neu laden wieder auf 10 Grad zurück.
<li data-row="1" data-col="6" data-sizex="2" data-sizey="1">
<header>WOHNZIMMER</header>
<div data-type="thermostat"
data-device="Wohnzimmer"
ta-step="0.5"
data-min="4.5"
data-max="31"
data-valve="valveposition"
data-get="desiredtemperature"
data-temp="temperature"
data-set="desiredTemperature auto"
class="centered big">
</div>
<div data-type="label"
data-device="Wohnzimmer"
data-get="desiredTemperature"
data-limits='[-5,19,26]'
data-colors='["#6699FF","#33ff00","#FF0000"]'
data-unit="%B0C%0A"
class="cell inline narrow big">
</div>
</li>
habe ich irgend was falsch oder Vergessen?
Gruß Rolf
desiredtemperature
Einmal mit großem T und einmal klein geht bestimmt schief.
Hallo,
vielen vielen Dank, manchmal ist man wirklich Blind. Ich bin echt Begeistert.
Gruß Rolf
@StefanW: Es könnte am benutzen Button-Widget liegen. Ich weiß nicht, ob deine Version noch passt.
Probiere mal Pagebutton, der ist uptodate. Oder Switch oder Symbol.
Wenn ich mit meinem Rechner wieder arbeitsfähig bin (Festplatten Crash), schaue ich mir das etwas genauer an und aktualisiere die Beispiele wieder.
Hallo,
gibt es eine Möglichkeit das Widget-Circlemenu so abzuändern das es vertikal ausklappt?
mein momentaner Code ist:
<header>MENÜ</header>
<div data-type="circlemenu" class="cell circlemenu" data-direction="right-half" data-circle-radius="120">
<ul class="menu">
<li>
<div data-type="symbol"
data-icon="oa-control_building_modern_s_all"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_wohnzimmer.html"
data-icon="oa-scene_livingroom"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_badezimmer.html"
data-icon="oa-scene_bath"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_kueche.html"
data-icon="oa-scene_dinner"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_flur.html"
data-icon="fs-floor"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_schlafzimmer_1.html"
data-icon="fa-bed"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_schlafzimmer_2.html"
data-icon="fa-bed"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_schlafzimmer_2.html"
data-icon="fa-bed"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="raum_heizraum.html"
data-icon="oa-sani_heating"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
</ul>
</div>
<div class="smaller">Räume</div>
<div data-type="circlemenu" class="cell circlemenu" data-direction="right-half" data-circle-radius="90">
<ul class="menu">
<li>
<div data-type="symbol"
data-icon="fs-hm_keymatic"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="thermostat_badezimmer.html"
data-icon="oa-scene_bath"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="thermostat_kueche.html"
data-icon="oa-scene_dinner"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="thermostat_flur.html"
data-icon="fs-floor"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="thermostat_schlafzimmer_1.html"
data-icon="fa-bed"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="thermostat_schlafzimmer_2.html"
data-icon="fa-bed"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="thermostat_schlafzimmer_2.html"
data-icon="fa-bed"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
</ul>
</div>
<div class="smaller">Thermostate</div>
<div data-type="circlemenu" class="cell circlemenu" data-direction="right-half" data-circle-radius="90">
<ul class="menu">
<li>
<div data-type="symbol"
data-icon="fa-sun-o"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="wetter.html"
data-icon="oa-scene_bath"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
<li>
<div data-type="pagetab"
data-url="wetter_vorhersage.html"
data-icon="oa-scene_bath"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="wetter_test.html"
data-icon="oa-scene_bath"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
</ul>
</div>
<div class="smaller">Wetter</div>
<div data-type="circlemenu" class="cell circlemenu" data-direction="right-half" data-circle-radius="90">
<ul class="menu">
<li>
<div data-type="symbol"
data-icon="oa-edit_settings"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a"
data-background-icon="fa-circle">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="system_kalender.html"
data-icon="fa-calendar-o"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
<li>
<div data-type="pagetab"
data-url="system_system.html"
data-icon="fa-server"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
<li>
<div data-type="pagetab"
data-url="system_system.html"
data-icon="fa-server"
data-on-background-color="rgb(111,69,0)"
data-off-background-color="rgb(111,69,0)"
data-on-color="#2a2a2a"
data-off-color="#2a2a2a">
</div>
</li>
</ul>
</div>
<div class="smaller">System</div>
</div>
Oder muss es neu programmiert werden?
mfg
Zitat von: l3skon3 am 29 Oktober 2015, 15:49:33
Hallo,
gibt es eine Möglichkeit das Widget-Circlemenu so abzuändern das es vertikal ausklappt?
Oder muss es neu programmiert werden?
mfg
Es geht nicht per Config. Es klappt immer nur im Kreis aus, wie der Name schon sagt.
Aber das heißt aber nicht, dass das garnicht möglich ist. Ich habe etwas rumprobiert und es klappt.
Ich werde das demnächst als Option anbieten. Hier vorab zum selbst Ändern für Ungedultige:
Nötige Änderung für horizontal in der lib/jquery.circlemenu.js in Zeile 75 einfügen:
x = index * 50;
y = 0;
bzw. für vertikal
x = 0;
y = index * 50;
Hallo @uniqueck,
ich hab das calview widget eingebaut, leider zeigt es nichts an. Zeit das Widget alle Termine an oder nur heute und morgen?
Hallo @skuggy
Wie hast du es denn eingebaut?
Wenn du es mit all als Schalter einbaust zeigt es dir alle Termine an. Du kannst die Anzahl dann mit data-get-max steuern.
Ansonsten musst du mir mal etwas code zeigen.
Gruß
Gesendet von meinem GT-N7100 mit Tapatalk
Zitat von: setstate am 29 Oktober 2015, 22:32:07
Es geht nicht per Config. Es klappt immer nur im Kreis aus, wie der Name schon sagt.
Aber das heißt aber nicht, dass das garnicht möglich ist. Ich habe etwas rumprobiert und es klappt.
Ich werde das demnächst als Option anbieten. Hier vorab zum selbst Ändern für Ungedultige:
Nötige Änderung für horizontal in der lib/jquery.circlemenu.js in Zeile 75 einfügen:
x = index * 50;
y = 0;
bzw. für vertikal
x = 0;
y = index * 50;
besten Dank. Es klappt mit runden Icons super! Bin jetzt am Probieren ob ich meine eckigen Icons und ein label darunter bekomme.
Interessante Frage, ob eckige Buttons ins Circlemenu passen und nicht abgeschnitten werden. Muss ich mal testen.
Moyn,
Baue gerade eine komplette Fernbedienung für das ENIGMA2-Modul. Bei bestimmten Labels klappt der Refresh nicht, obwohl Events erzeugt werden.
Konkret lasse ich oben den aktuellen Kanal und die aktuelle Sendung anzeigen - longpoll ist aktiv (attr WEB longpoll 1):
<meta name="longpoll" content="1">
[...]
<li data-row="1" data-col="5" data-sizex="4" data-sizey="1">
<header> <div data-type="label" data-device="kathi1" data-get="channel" class="inline">
</div></header>
<div class="left">
<div data-type="label" data-device="kathi1" data-get="currentTitle" class="inline red">
</div>
<div data-type="label" data-device="kathi1" data-get="eventdescription" class="inline">
[...]
Nach einem Kanalwechsel, egal ob über WebUI oder andere Frontends, werden diese Readings nicht aktualisiert bzw. nur beim Reload der Seite.
Events bei Kanalwechsel:
Events (Filter:ENIGMA.*):
2015-10-30 11:44:51 ENIGMA2 kathi1 channel SUPER_RTL
2015-10-30 11:44:54 ENIGMA2 kathi1 servicereference: 1:0:1:2f08:441:1:0:0:0:0:
2015-10-30 11:44:54 ENIGMA2 kathi1 currentMedia: 1:0:1:2f08:441:1:0:0:0:0:
2015-10-30 11:44:54 ENIGMA2 kathi1 servicename: SUPER RTL
2015-10-30 11:44:54 ENIGMA2 kathi1 channel: SUPER_RTL
2015-10-30 11:44:54 ENIGMA2 kathi1 eventstart: 1446200400
2015-10-30 11:44:54 ENIGMA2 kathi1 eventduration: 1500
2015-10-30 11:44:54 ENIGMA2 kathi1 eventcurrenttime: 1446201893
2015-10-30 11:44:54 ENIGMA2 kathi1 eventdescription: Folge 16: 'Ritterspiele'
2015-10-30 11:44:54 ENIGMA2 kathi1 eventtitle: Scooby-Doo!
2015-10-30 11:44:54 ENIGMA2 kathi1 currentTitle: Scooby-Doo!
2015-10-30 11:44:54 ENIGMA2 kathi1 eventstart_hr: 11:20:00
2015-10-30 11:44:54 ENIGMA2 kathi1 eventcurrenttime_hr: 11:44:53
2015-10-30 11:44:54 ENIGMA2 kathi1 eventduration_hr: 00:25:00
2015-10-30 11:45:39 ENIGMA2 kathi1 eventstart: 1446201900
2015-10-30 11:45:39 ENIGMA2 kathi1 eventduration: 1800
2015-10-30 11:45:39 ENIGMA2 kathi1 eventcurrenttime: 1446201939
2015-10-30 11:45:39 ENIGMA2 kathi1 eventdescription: Folge 22: 'Das Geheimnis von Atlantis'
2015-10-30 11:45:39 ENIGMA2 kathi1 eventstart_hr: 11:45:00
2015-10-30 11:45:39 ENIGMA2 kathi1 eventcurrenttime_hr: 11:45:39
2015-10-30 11:45:39 ENIGMA2 kathi1 eventduration_hr: 00:30:00
2015-10-30 11:46:03 ENIGMA2 kathi1 remoteControl 3
2015-10-30 11:46:04 ENIGMA2 kathi1 eventcurrenttime: 1446201964
2015-10-30 11:46:04 ENIGMA2 kathi1 eventcurrenttime_hr: 11:46:04
2015-10-30 11:46:50 ENIGMA2 kathi1 servicereference: 1:0:1:2b7a:3f3:1:0:0:0:0:
2015-10-30 11:46:50 ENIGMA2 kathi1 currentMedia: 1:0:1:2b7a:3f3:1:0:0:0:0:
2015-10-30 11:46:50 ENIGMA2 kathi1 servicename: zdf_neo HD
2015-10-30 11:46:50 ENIGMA2 kathi1 channel: zdf_neo_HD
2015-10-30 11:46:50 ENIGMA2 kathi1 eventduration: 3000
2015-10-30 11:46:50 ENIGMA2 kathi1 eventcurrenttime: 1446202009
2015-10-30 11:46:50 ENIGMA2 kathi1 eventdescription: Wen die Götter zerstören
2015-10-30 11:46:50 ENIGMA2 kathi1 eventtitle: Raumschiff Enterprise
2015-10-30 11:46:50 ENIGMA2 kathi1 currentTitle: Raumschiff Enterprise
2015-10-30 11:46:50 ENIGMA2 kathi1 eventcurrenttime_hr: 11:46:49
2015-10-30 11:46:50 ENIGMA2 kathi1 eventduration_hr: 00:50:00
Klappt das Aktualiseren von label eventuell nur mit numerischen Werten oder mache ich etwas falsch?
Grüße
Martin
Hi,
erst mal besten Dank für Eure Arbeit und die tolle Doku hier! Vieles konnte ch damit prima lösen, aber im Moment hänge ich und komme einfach nicht weiter. Ich will die Readins aus dem CallMon Mudul abbilden, das klappt aber irgendwie nicht. Hat jemand einen Denkanstoß für mich?
<li data-row="1" data-col="2" data-sizex="6" data-sizey="4">
<header>ANRUFE</header>
<div class="container">
<table class="calls" width="100%">
<tr>
<td><div type="label" device="CallMon" data-get="B0"></div></td>
<td>
<div type="label" device="CallMon" data-get="D0" style="font-size:x-large;color:#aa6900;"></div>
<div type="label" device="CallMon" data-get="C0"></div>
</td>
<td class="r"><div type="label" device="CallMon" data-get="E0"></div></td>
<td class="r"><div type="label" device="CallMon" data-get="A0"></div></td>
</tr>
<tr>
<td><div type="label" device="CallMon" data-get="B1"></div></td>
</tr>
</table>
</div>
</li>
Box wird gezeichnet, bleibt aber leer?
Heißt dein Device wirklich auch CallMon, wie das Modul?
Was sagt das Fhem Command 'list CallMon' im FHEM Web.
Guter Punkt :) Kann ich denn nicht direkt aus dem Modul auslesen? list zeigt mir ja die Readings:
Internals:
DEF FB7390
FB FB7390
NAME CallMon
NR 145
NTFY_ORDER 50-CallMon
STATE initialized
TYPE TM
Readings:
2015-10-30 13:58:02 A0 outgoing
2015-10-30 13:58:02 A1 incoming
2015-10-30 13:58:02 A2 outgoing_noconnect
2015-10-30 13:58:02 A3 outgoing_noconnect
2015-10-30 13:58:02 A4 outgoing
2015-10-30 13:58:02 B0 13:58 30.10.2015
2015-10-30 13:58:02 B1 13:53 30.10.2015
2015-10-30 13:58:02 B2 13:04 30.10.2015
2015-10-30 13:58:02 B3 13:03 30.10.2015
2015-10-30 13:58:02 B4 12:42 29.10.2015
2015-10-30 13:58:02 C0 unknown
2015-10-30 13:58:02 C1 unknown
2015-10-30 13:58:02 C2 unknown
2015-10-30 13:58:02 C3 unknown
2015-10-30 13:58:02 C4 unknown
2015-10-30 13:58:02 D0
2015-10-30 13:58:02 D1
2015-10-30 13:58:02 D2
2015-10-30 13:58:02 D3
2015-10-30 13:58:02 D4
2015-10-30 14:10:12 E0 11:44
2015-10-30 13:58:02 E1 03:46
2015-10-30 13:58:02 E2 00:00
2015-10-30 13:58:02 E3 00:00
2015-10-30 13:58:02 E4 51:02
2015-10-30 13:58:02 F0 0
2015-10-30 13:58:02 F1 0
2015-10-30 13:58:02 F2 0
2015-10-30 13:58:02 F3 0
2015-10-30 13:58:02 F4 0
2015-10-30 13:58:02 G0
2015-10-30 13:58:02 G1
2015-10-30 13:58:02 G2
2015-10-30 13:58:02 G3
2015-10-30 13:58:02 G4
2015-10-30 15:06:18 monitor-type all
Attributes:
maxlines 4
monitor-type all
room System
symbol-answering-machine AB
symbol-connected connected
symbol-incoming incoming
symbol-incoming-noconnect incoming_noconnect
symbol-outgoing outgoing
symbol-outgoing-noconnect outgoing_noconnect
update 2
Sieht so aus, dass das dein Device ist, also eine Instanz im Fhem.
Dein Problem ist aber ein anderes:
Bitte alle type in data-type und alle device in data-device umbenennen in deinen Widgets.
Ist geändert, danke für den Hinweis. Box bleibt leider leer. Hat jemand mal einen Codeschnipsel für mich wie das (funktionierend) realisiert wurde? Da könnte ich mich denn entlanghangeln... ;)
Zitat von: Tedious am 30 Oktober 2015, 15:46:49
Ist geändert, danke für den Hinweis. Box bleibt leider leer. Hat jemand mal einen Codeschnipsel für mich wie das (funktionierend) realisiert wurde? Da könnte ich mich denn entlanghangeln... ;)
<li data-row="4" data-col="4" data-sizex="2" data-sizey="1" class="halbTransparent">
<header>Anrufe</header>
<table border="0px" width="100%">
<tr><td>
<div data-type="label" data-device="CallmonTuxNetDSL01" data-get="B0" class="inline small darker"></div>
<div data-type="symbol" data-device="CallmonTuxNetDSL01"
data-get="A0"
data-icons='["fa-phone","fa-phone","fa-phone","fa-phone"]'
data-get-on='["in_connected","out_connected","in_notconnected","out_notconnected"]'
data-on-colors='["green","green","red","red"]'
class="inline small">
</div>
<div data-type="symbol" data-device="CallmonTuxNetDSL01"
data-get="A0"
data-icons='["fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-left","fa-arrow-circle-right"]'
data-get-on='["in_connected","out_connected","in_notconnected","out_notconnected"]'
data-on-colors='["green","green","red","red"]'
class="inline small">
</div>
<br>
<div data-type="label" data-device="CallmonTuxNetDSL01" data-get="D0" data-color="#aa6900" class="inline small darker"></div>
<div data-type="label" data-device="CallmonTuxNetDSL01" data-get="C0" class="inline small darker"></div>
<div data-type="label" data-device="CallmonTuxNetDSL01" data-get="E0" class="inline small darker"></div>
</br>
</td></tr>
</table>
<div class="small">
<div data-type="button" data-url="telefon.html"
data-direction="bottom-left"
data-icon="fa-phone"
data-background-icon="fa-circle-thin"
data-on-color="#aa6900"
data-off-color="#aa6900"
style="position:absolute;z-index:1001;top:0px;right:0px;opacity:0.5" >
</div>
</div>
</li>
Danke, ich schau mir das mal an und versuche das anzupassen!
Läuft angepasst prinzipiell schon mal, den Rest bekomme ich hin und model das zusammen. Danke!
Nicht dafür. Gern geschehen
Grüße
Zitat von: setstate am 29 Oktober 2015, 09:03:53
@StefanW: Es könnte am benutzen Button-Widget liegen. Ich weiß nicht, ob deine Version noch passt.
Probiere mal Pagebutton, der ist uptodate. Oder Switch oder Symbol.
Wenn ich mit meinem Rechner wieder arbeitsfähig bin (Festplatten Crash), schaue ich mir das etwas genauer an und aktualisiere die Beispiele wieder.
Danke, ich werde mal ein wenig rumprobieren.
Kurze Frage:
Ist es möglich mittels dem widget "switch" folgendes zu realisieren:
Ich möchte den "ON" & "OFF" Status des Gerätes Lampe1 (dummy) angezeigt bekommen. Gleichzeigt will ich aber beim betätigen des switches das der der Befehl: set RemotePI cmd set Lampe2 on/off ausgeführt wird.
Mein Problem ist ich will einen Schalter von einer RemoteFHEM installastion einfügen. Über FHEM2FHEM und notify klappt es leider nicht da sich andauern eine Schleife (Loop) bildet. (LokaleLampe1 set on -> RFHEM -> RemoteLampe1 set on -> LokaleNotify -> set LokaleLampe1 on ->
Mein vorhaben ist einen Schalter (switch) von einer Remote FHEM Instanz auf die lokale zu duplizieren. Soll heißen der Status wird auf beiden Instanzen gleichgehalte sowie das ich von der jeder Instanz aus den Schalter schalten kann und der status ebenfalls aktuell gehalten wird.
Moin. Mein letztes Problemchen hat sich dank DOIF erledigt. AT wäre in die Hose gegangen... will ja die Seite aufspringen lassen wenn die Batterien leer sind und nicht erst wenns schon zu spät ist. :-)
Jetzt zu meinem nächsten Ärgerniss. Ich lese für meine "Anrufe" das Modul FB_CALLLIST aus. Als erstes ein "symbol" für den Status des Anrufs:
<div data-type="symbol"
data-device="FritzBoxCallList"
data-get="1-state"
data-states='["=>","=> X","=> ((o))","=> [=]","=> O_O"]'
data-icons='["oa-phone_call_end_in","oa-phone_missed_in","oa-phone_ring fa-blink","oa-phone_ring_in fa-blink","oa-phone_answering"]' <!-- Fehler in openautomation.css: answersing (glaub ich war's)-->
data-colors='["green","firebrick","firebrick","green","#aa6900"]'>
</div>
Soweit so gut. Ich lasse vom Modul nur eingehende Gespräche listen. Wenn ich mir jetzt den state (1-state) eines eingehenden, klingelnden Anrufs anschaue...
1-state => ((o))
genau so bei einem laufenden Gespräch:
1-state => [=]
Ich verstehe nicht viel von Java und Co. ... na gut ... gar nichts, ein ganz kleines bisschen vielleicht.
Ich denke die Klammern (egal ob rund oder eckig) machen Probleme, weil genau diese states nicht als "symbol" angezeigt werden.
Kann man das irgendwie umgehen? RegEx hab ich versucht.. frisst er irgendwie nicht. Dann sind alle "symbol"'s im Eimer.
Oder check ich RegEx in dem Fall nicht?
data-states='["(=>)(?!.)","(=>.X)","(=>.\(\(o\)\))","(=>.\[=\])","(=>.O_O)"]'
Vielen Dank schon mal.
@danieljo
ZitatMein Problem ist ich will einen Schalter von einer RemoteFHEM installastion einfügen. Über FHEM2FHEM und notify klappt es leider nicht da sich andauern eine Schleife (Loop) bildet. (LokaleLampe1 set on -> RFHEM -> RemoteLampe1 set on -> LokaleNotify -> set LokaleLampe1 on ->
wenn du dem device auf dem RFHEM einen anderen namen gibst funktioniert es (Schleife entsteht nicht)
data-states='["=>","=> X","=> ((o))","=> [=]","=> O_O"]'
funktioniert bei mir mit einem Dummy wunderbar.
Kann das der Grund sein: (aus CommandRef)
Generated Events:
This module does not generate any events or readings.
was sagt: list FritzBoxCallList
@setstate
Zitatdata-states='["=>","=> X","=> ((o))","=> [=]","=> O_O"]'
funktioniert bei mir mit einem Dummy wunderbar.
Kann das der Grund sein: (aus CommandRef)
Generated Events:
This module does not generate any events or readings.
was sagt: list FritzBoxCallList
durch das Attribut "create-readings 1" erstellt das Modul die nötigen Readings.
@roman1528
ZitatMoin. Mein letztes Problemchen hat sich dank DOIF erledigt. AT wäre in die Hose gegangen... will ja die Seite aufspringen lassen wenn die Batterien leer sind und nicht erst wenns schon zu spät ist. :-)
Jetzt zu meinem nächsten Ärgerniss. Ich lese für meine "Anrufe" das Modul FB_CALLLIST aus. Als erstes ein "symbol" für den Status des Anrufs:
Code: [Auswählen]
<div data-type="symbol"
data-device="FritzBoxCallList"
data-get="1-state"
data-states='["=>","=> X","=> ((o))","=> [=]","=> O_O"]'
data-icons='["oa-phone_call_end_in","oa-phone_missed_in","oa-phone_ring fa-blink","oa-phone_ring_in fa-blink","oa-phone_answering"]' <!-- Fehler in openautomation.css: answersing (glaub ich war's)-->
data-colors='["green","firebrick","firebrick","green","#aa6900"]'>
</div>
Soweit so gut. Ich lasse vom Modul nur eingehende Gespräche listen. Wenn ich mir jetzt den state (1-state) eines eingehenden, klingelnden Anrufs anschaue...
1-state => ((o))
genau so bei einem laufenden Gespräch:
1-state => [=]
Ich verstehe nicht viel von Java und Co. ... na gut ... gar nichts, ein ganz kleines bisschen vielleicht.
Ich denke die Klammern (egal ob rund oder eckig) machen Probleme, weil genau diese states nicht als "symbol" angezeigt werden.
Kann man das irgendwie umgehen? RegEx hab ich versucht.. frisst er irgendwie nicht. Dann sind alle "symbol"'s im Eimer.
Oder check ich RegEx in dem Fall nicht?
data-states='["(=>)(?!.)","(=>.X)","(=>.\(\(o\)\))","(=>.\[=\])","(=>.O_O)"]'
Vielen Dank schon mal.
schau mal in die *.pm des Modules. Meines Wissen ist das ein Problem da bei manchen states zwei bzw. mehrer Leerzeichen weitergegeben werden so zum Beispiel hier:
if($data->{running_call})
{
if($data->{direction} eq "incoming" and $data->{last_event} eq "connect" )
{
$state = "=> [=]";
$state = FB_CALLLIST_returnIcon($hash,"incoming.connected", $state) if($icons);
}
elsif($data->{direction} eq "incoming" and $data->{last_event} eq "ring")
{
$state = "=> ((o))";
$state = FB_CALLLIST_returnIcon($hash,"incoming.ring", $state) if($icons);
}
elsif($data->{direction} eq "outgoing" and $data->{last_event} eq "connect" )
{
$state = "<= [=]";
$state = FB_CALLLIST_returnIcon($hash,"outgoing.connected", $state) if($icons);
}
elsif($data->{direction} eq "outgoing" and $data->{last_event} eq "call")
{
$state = "<= ((o))";
$state = FB_CALLLIST_returnIcon($hash,"outgoing.ring", $state) if($icons);
}
}
Servus zusammen!
Ich bin gerade dabei in eine header.html eine Wettervorschau mit dem WEATHER-Modul zu integrieren.
Mit den Standard-Icons bekomme ich auch ein vernünftiges Layout hin.
Wenn ich jedoch die kleinklima-Icons einbinde, verhauts es das ganze Layout weil die Icons zu groß sind.
Nun habe ich innerhalb des widget_weather.js die Skalierung der Icons auf 30% gesetzt.
var mapped = typeof translation == "undefined"?val:translation;
if($(this).data('imageset')=="kleinklima") {
mapped = base.kleinklimamap[mapped.replace(/^:/, '')];
$(this).prepend('<img style="width:30%" src="' + $(this).data('image-path') + mapped + '" title="' + val + '">');
} else if($(this).data('imageset')=="reading") {
$(this).prepend('<img style="width:30%" src="' + _val + '">');
} else {
mapped = base.meteoconsmap[mapped.replace(/^:/, '')];
$(this).attr('data-icon', mapped);
Icons passen nun, aber der vergrößerte Abstand der einzelnen Zellen bleibt.
<li data-row="2" data-col="3" data-sizex="12" data-sizey="2">
<div class="top-space">
<div class="inline narrow">
<div data-type="label" class="narrow">Heute</div>
<div data-type="weather" data-device="Wetter" data-imageset="kleinklima" data-get="fc0_weatherDay" class="narrow"></div>
<div data-type="label" data-device="Wetter" data-get="fc0_tempMin" class="inline"> </div>/
<div data-type="label" data-device="Wetter" data-get="fc0_tempMax" class="inline"> </div>
</div>
<div class="inline narrow">
<div data-type="label" class="narrow" data-device="Wetter" data-get="fc1_date"></div>
<div data-type="weather" data-device="Wetter" data-imageset="kleinklima" data-get="fc1_weatherDay" class="narrow"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_tempMin" class="inline"> </div>/
<div data-type="label" data-device="Wetter" data-get="fc1_tempMax" class="inline"> </div>
</div>
...
Wo liegt mein Fehler? Irgendwas muss ich übersehen...
Zitat von: setstate am 30 Oktober 2015, 21:55:08
was sagt: list FritzBoxCallList
Internals:
DEF FritzBoxCallMonitor
FB FritzBoxCallMonitor
NAME FritzBoxCallList
NOTIFYDEV FritzBoxCallMonitor
NR 51
NTFY_ORDER 50-FritzBoxCallList
STATE Initialized
TYPE FB_CALLLIST
Readings:
2015-10-30 12:54:52 1-connection DECT_1
2015-10-30 12:54:52 1-duration 00:00:40
2015-10-30 12:54:52 1-external SIP1
2015-10-30 12:54:52 1-internal Büro
2015-10-30 12:54:52 1-name -
2015-10-30 12:54:52 1-number 016******10
2015-10-30 12:54:52 1-row 1
2015-10-30 12:54:52 1-state =>
2015-10-30 12:54:52 1-timestamp Fr, 30.10.15 12:54
2015-10-30 12:54:53 10-connection -
2015-10-30 12:54:53 10-duration -
2015-10-30 12:54:53 10-external SIP1
2015-10-30 12:54:53 10-internal Büro
2015-10-30 12:54:53 10-name -
2015-10-30 12:54:53 10-number 016******10
2015-10-30 12:54:53 10-row 10
2015-10-30 12:54:53 10-state => X
2015-10-30 12:54:53 10-timestamp Do, 29.10.15 12:57
2015-10-30 12:54:53 2-connection -
2015-10-30 12:54:53 2-duration -
2015-10-30 12:54:53 2-external SIP1
2015-10-30 12:54:53 2-internal Büro
2015-10-30 12:54:53 2-name -
2015-10-30 12:54:53 2-number 016******10
2015-10-30 12:54:53 2-row 2
2015-10-30 12:54:53 2-state => X
2015-10-30 12:54:53 2-timestamp Fr, 30.10.15 12:53
2015-10-30 12:54:53 3-connection DECT_1
2015-10-30 12:54:53 3-duration 00:00:14
2015-10-30 12:54:53 3-external SIP1
2015-10-30 12:54:53 3-internal Büro
2015-10-30 12:54:53 3-name -
2015-10-30 12:54:53 3-number 016******10
2015-10-30 12:54:53 3-row 3
2015-10-30 12:54:53 3-state =>
2015-10-30 12:54:53 3-timestamp Fr, 30.10.15 12:36
2015-10-30 12:54:53 4-connection DECT_1
2015-10-30 12:54:53 4-duration 00:00:07
2015-10-30 12:54:53 4-external SIP1
2015-10-30 12:54:53 4-internal Büro
2015-10-30 12:54:53 4-name -
2015-10-30 12:54:53 4-number 016******10
2015-10-30 12:54:53 4-row 4
2015-10-30 12:54:53 4-state =>
2015-10-30 12:54:53 4-timestamp Fr, 30.10.15 12:31
2015-10-30 12:54:53 5-connection -
2015-10-30 12:54:53 5-duration -
2015-10-30 12:54:53 5-external SIP1
2015-10-30 12:54:53 5-internal Büro
2015-10-30 12:54:53 5-name -
2015-10-30 12:54:53 5-number 016******10
2015-10-30 12:54:53 5-row 5
2015-10-30 12:54:53 5-state => X
2015-10-30 12:54:53 5-timestamp Fr, 30.10.15 12:31 Guten Morgen.
Ich hätte erwähnen sollen, dass ich "attr FritzBoxCallList create-readings 1" natürlich drin habe.
Genao so wie: event-on-change-reading .* UND event-on-update-reading .*
@l3skon3
Das ist eine gute Idee... da schau ich mal rein und ändere die states ggf.
Zitat von: harry66 am 30 Oktober 2015, 20:48:50
@danieljo
wenn du dem device auf dem RFHEM einen anderen namen gibst funktioniert es (Schleife entsteht nicht)
Funktioniert leider nicht gewünscht. notify triggert trotzdem. Habe gestern alle möglichkeiten Probiert die mir in den Sinn kamen.
Entweder schaffe ich es den Status der Lampen des RemoteRpi auf dem ZentralenRpi zubekommen oder vom ZentralenRpi aus die Lampen auf dem RemoteRpi zu steuern aber beides gleichzeitig bekomme ich nicht hin. Habe gestern noch hier im Forum irgendwo gelesen das für solche Sachen DOIF besser geeignet sein soll.
sorry das hatte ich übersehen.
Zitatvon der jeder Instanz aus den Schalter schalten kann und der status ebenfalls aktuell gehalten wird.
ich schalte nur von einer Seite
Hallo an die Wissenden da draußen.
Ich habe seit gestern das Problem das Longpoll nicht mehr funktioniert, die beiden Einstellungen (FHEMWeb+Tablet UI) stehen aber auf "1". Shortpoll greift nach 15min (bzw. 30sek wenn Longpoll off) und alle Anzeigen werden synchronisiert.
FHEM und Tablet UI sind auf dem aktuellen Stand von gestern. Wo kann ich bei der Fehlersuche ansetzen?
vg jens
Zur Ursachenfindung kann man debug auf 1 setzen und dann muss was zappeln in der Webconsole. Oder das Eventmonitor Widget einsetzten, um Events sehen zu können. Am besten erstmal auf eine Seite ohne weitere andere Widgets und dann Stück für Stück erweitern, um die Ursache einzukreisen.
Longpoll hat bei mir noch nie funktioniert! Schon gar nicht in FHEM WEB... weder FF noch IE noch Chrome... nur in Chrome auf'm Smartphone im normalen WEB.
Deswegen hab ich shortpoll an was aber auch nicht den gewünschten erfolg bringt... aber es aktualisiert immerhin. bei longpoll passiert gar nichts.
Mein Problem mit den States der CallList haben sich erledigt... War ein guter Tipp mit der *.pm ... habe daraus die states kopiert und siehe da es läuft.
Bin gerade dabei einen datetimepicker einzufügen. leider scheint er beim schließen nicht den gewünschten befehl auszuführen.
<div data-type="popup" data-height="400px" data-width="450px">
<div data-type="push" data-icon="oa-time_clock" class=""></div>
<div data-type="label" class="cell"> </div>
<div class="dialog">
<header>HEIZUNG - ALLE - TEMPORÄR</header>
<div class="center top-space">
<div class="inline">
<div data-type="label" class="cell">MANU</div>
<div data-type="datetimepicker" data-device="bu_WT" data-set="desiredTemperature manual until" data-format="d.m.Y H:i" data-step="30" class="inline large orange"></div>
</div>
.......
Was noch richtig toll wäre wenn sich der datetimepicker über einen push öffnen ließe :-)
Grüße^^
Hallo setstate,
Ursache war ein
data-type="contact"
in "Symbol" umbenannt und jetzt ist alles wieder chic.
Danke und noch einen schönen Abend.
vg jens
Zitat von: Newbie am 01 November 2015, 17:27:24
Ursache war ein
data-type="contact"
in "Symbol" umbenannt und jetzt ist alles wieder chic.
Schön, dass du es gefunden hast.
ja, contact hieß es ganz am Anfang.
Guten Abend,
ich habe nun auch mal ein bisschen "rumgeklickt und so"...allerdings kriege ich weder vom iPhone noch vom iPad einen meiner Aktoren dazu, sich ein- oder auszuschalten. Ich habe gesucht aber bisher nicht gefunden. Wurde dieses Problem hier bereits angesprochen und eventuell sogar gelöst?
Ich nutze das iPhone 6 mit iOS 9.1 und das iPad Air ebenfalls mit iOS 9.1.
Danke für eure Hilfe.
Philipp
Hallo Philipp,
auf einem anderen Rechner läuft es aber und die Aktoren regieren? Werden auf den iOS Geräten wenigstens die aktuellen Status angezeigt? Was passiert, wenn du dann das Widget auf den iOS Gerät drückst, erscheint die Toast Message? Was steht in den Messages?
Hi hi,
danke für die Antwort schon mal. Am Rechner funktioniert es absolut perfekt. Da erscheinen die Toast-Messages und der Aktor wird auch geschaltet. Am iOS Device werden der aktuelle Status angezeigt, aber die Toast-Messages erscheinen nur für die aus der "Standard-index.html" vorhandenen Devices. Nicht aber für die, die ich bereits in die index.html integriert habe.
wz_LEDSteckdose funktioniert nur am PC (von mir integriert), für das Philips Hue Device erhalte ich auf beiden Geräten (PC und iOS Device) eine Toast-Message. Funktionieren tut die Philips logischerweise nicht, da sie aus der template-index.html kommt.
<div class="right right-space">
<div data-type="switch" data-device="wz_LEDSteckdose" class="cell"></div>
<div data-type="label" class="">LED Lichtleiste</div>
<div data-type="dimmer" data-device="HUEDevice1" data-get-on="!off" data-get-off="off" data-set="pct" class="top-space-2x" ></div>
<div data-type="label" class="cell">Philips</div>
</div>
Zitat von: roman1528 am 01 November 2015, 15:28:07
Longpoll hat bei mir noch nie funktioniert! Schon gar nicht in FHEM WEB... weder FF noch IE noch Chrome... nur in Chrome auf'm Smartphone im normalen WEB.
Deswegen hab ich shortpoll an was aber auch nicht den gewünschten erfolg bringt... aber es aktualisiert immerhin. bei longpoll passiert gar nichts.
Mein Problem mit den States der CallList haben sich erledigt... War ein guter Tipp mit der *.pm ... habe daraus die states kopiert und siehe da es läuft.
Bin gerade dabei einen datetimepicker einzufügen. leider scheint er beim schließen nicht den gewünschten befehl auszuführen.
<div data-type="popup" data-height="400px" data-width="450px">
<div data-type="push" data-icon="oa-time_clock" class=""></div>
<div data-type="label" class="cell"> </div>
<div class="dialog">
<header>HEIZUNG - ALLE - TEMPORÄR</header>
<div class="center top-space">
<div class="inline">
<div data-type="label" class="cell">MANU</div>
<div data-type="datetimepicker" data-device="bu_WT" data-set="desiredTemperature manual until" data-format="d.m.Y H:i" data-step="30" class="inline large orange"></div>
</div>
.......
Was noch richtig toll wäre wenn sich der datetimepicker über einen push öffnen ließe :-)
Grüße^^
und noch was ist mir aufgefallen bezüglich pagetab... ja ich arbeite mit pagetab weil mit button lädt er die urls nicht. da hab ich dann sowas wie /#index.html#bad.html#diele.html
funktioniert soweit super mit pagetab.
wenn ich jetzt aber einen pagetab mit warn versehe und der warn aktiv ist (ohne activate) kann ich die seite nicht aufrufen... also beim anklicken passiert gar nichts.
mit activate öffnet er ganz vorbildlich die seite.. wenn ich dann aber wo anders hin gehe und wieder die seite öffnen möchte geht es auch nicht.
über die console hab ich nichts raus bekommen.
Moyn,
so. Endlich mal Zeit, um mich zu bedanken. Das Tablet UI ist das Beste, was ich in diesem Bereich jemals gesehen habe. Vielen Dank dafür, und auch für die Geduld beim Supporten. Ich weiß auch nicht, warum ich erst so spät darüber gestolpert bin. Habe mich die ganze Zeit gewundert, warum es mit den nativen fhem Apps nicht so recht vorangeht. Jetzt verstehe ich es. Angesichts des UI hätte ich als App-Entwickler auch keine Lust mehr, da weiter zu entwickeln.
Habe eben erst setstates Hilferuf in der Signatur gesehen: Macbook hinüber! Entwicklung gefährdet! Habe auch das Gefühl, dass mein Tablet UI seitdem nicht mehr richtig läuft ;) Also - Spenden ist angesagt!
Grüße
Martin
Zitat von: dadoc am 30 Oktober 2015, 12:02:01
Moyn,
Baue gerade eine komplette Fernbedienung für das ENIGMA2-Modul. Bei bestimmten Labels klappt der Refresh nicht, obwohl Events erzeugt werden.
So, habe herausgefunden, dass die Aktualisierung nicht klappt, wenn ich in der index.html die anderen Seiten definiere mit:
<div class="cell narrow">
<div data-type="pagetab" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="index_4.html" data-icon="fa-film" class="cell"></div>
<div data-type="pagetab" data-url="index_3.html" data-icon="fa-bars" class="cell"></div>
</div>Dass es aber bestens klappt, wenn ich stattdessen pagebutton verwende:
<div class="cell narrow">
<div data-type="pagebutton" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagebutton" data-url="index_4.html" data-icon="fa-film" class="cell"></div>
<div data-type="pagebutton" data-url="index_3.html" data-icon="fa-bars" class="cell"></div>
</div>Wahrscheinlich haben das wieder alle gewusst außer mir ;)
pagebutton geht auch, hat aber ein anderes Verhalten als pagetab ...
Pagetab hätte ich so definiert (menu.html):
<html>
<body>
<header>MENU</header>
<div class="cell narrow">
<div data-type="pagetab" data-url="index_home.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="index_4.html" data-icon="fa-film" class="cell"></div>
<div data-type="pagetab" data-url="index_3.html" data-icon="fa-bars" class="cell"></div>
</div>
</body>
</html>
und in der index.html nur das:
<!DOCTYPE html>
<html>
<head>
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="74">
<meta name="widget_base_height" content="71">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta http-equiv="Cache-Control" content="no-store" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="menu.html"></li>
</ul>
</div>
</body>
<script src="/fhem/pgm2/jquery.min.js"></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- needed only for usage of WebViewControl -->
<script src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script src="/fhem/pgm2/webviewcontrol.js"></script>
<script>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</html>
Also index.html ist nicht Bestandteil des Menüs.
Hallo @uniqueck,
sorry das ich mich jetzt erst melde, lag um am Wochenende.
Anbei das list als Fhem und der Code aus FTUI.
list:
Internals:
DEF Geburtstage 1
INTERVAL 43200
KALENDER Geburtstage
NAME GeburtstageView
NR 476
STATE t: 5 td: 0 tm: 1
TYPE CALVIEW
Readings:
2015-11-02 19:09:28 c-term 5
2015-11-02 19:09:28 c-today 0
2015-11-02 19:09:28 c-tomorrow 1
2015-11-02 19:09:28 state t: 5 td: 0 tm: 1
2015-11-02 19:09:28 t_001_bdate 03.11.2015
2015-11-02 19:09:28 t_001_btime 11:00:00
2015-11-02 19:09:28 t_001_edate 03.11.2015
2015-11-02 19:09:28 t_001_etime 12:00:00
2015-11-02 19:09:28 t_001_location 2001
2015-11-02 19:09:28 t_001_source Geburtstage
2015-11-02 19:09:28 t_001_summary Test2
2015-11-02 19:09:28 t_002_bdate 04.11.2015
2015-11-02 19:09:28 t_002_btime 11:00:00
2015-11-02 19:09:28 t_002_edate 04.11.2015
2015-11-02 19:09:28 t_002_etime 12:00:00
2015-11-02 19:09:28 t_002_location 1989
2015-11-02 19:09:28 t_002_source Geburtstage
2015-11-02 19:09:28 t_002_summary Mustermann
2015-11-02 19:09:28 t_003_bdate 05.11.2015
2015-11-02 19:09:28 t_003_btime 11:00:00
2015-11-02 19:09:28 t_003_edate 05.11.2015
2015-11-02 19:09:28 t_003_etime 12:00:00
2015-11-02 19:09:28 t_003_location 1950
2015-11-02 19:09:28 t_003_source Geburtstage
2015-11-02 19:09:28 t_003_summary Noch ein test
2015-11-02 19:09:28 t_004_bdate 22.09.2016
2015-11-02 19:09:28 t_004_btime 00:00:00
2015-11-02 19:09:28 t_004_edate 23.09.2016
2015-11-02 19:09:28 t_004_etime 00:00:00
2015-11-02 19:09:28 t_004_location
2015-11-02 19:09:28 t_004_source Geburtstage
2015-11-02 19:09:28 t_004_summary PS
2015-11-02 19:09:28 t_005_bdate 31.10.2016
2015-11-02 19:09:28 t_005_btime 06:00:00
2015-11-02 19:09:28 t_005_edate 31.10.2016
2015-11-02 19:09:28 t_005_etime 07:00:00
2015-11-02 19:09:28 t_005_location 2000
2015-11-02 19:09:28 t_005_source Geburtstage
2015-11-02 19:09:28 t_005_summary TestGeb1
2015-11-02 19:09:28 tomorrow_001_btime 11:00:00
2015-11-02 19:09:28 tomorrow_001_edate 03.11.2015
2015-11-02 19:09:28 tomorrow_001_etime 12:00:00
2015-11-02 19:09:28 tomorrow_001_location 2001
2015-11-02 19:09:28 tomorrow_001_source Geburtstage
2015-11-02 19:09:28 tomorrow_001_summary Test2
Attributes:
maxreadings 10
modes modeAlarm,modeStart,modeStarted,modeUpcoming
room Kalender
und der Code:
<li data-row="2" data-col="2" data-sizex="2" data-sizey="2">
<header>Geburtstage</header>
<div data-type="calview"
data-device="GeburtstageView"
data-get="all"
data-max="10" class="cell centered fullsize top-space"
data-all-forecast-color="#FFF200"
data-all-today-color="#6EB54C"></div>
</li>
Ich hoffe du findest den Fehler.
Danke
Zitat von: skuggy am 02 November 2015, 19:16:22
Hallo @uniqueck,
sorry das ich mich jetzt erst melde, lag um am Wochenende.
Anbei das list als Fhem und der Code aus FTUI.
list:
Internals:
DEF Geburtstage 1
INTERVAL 43200
KALENDER Geburtstage
NAME GeburtstageView
NR 476
STATE t: 5 td: 0 tm: 1
TYPE CALVIEW
Readings:
2015-11-02 19:09:28 c-term 5
2015-11-02 19:09:28 c-today 0
2015-11-02 19:09:28 c-tomorrow 1
2015-11-02 19:09:28 state t: 5 td: 0 tm: 1
2015-11-02 19:09:28 t_001_bdate 03.11.2015
2015-11-02 19:09:28 t_001_btime 11:00:00
2015-11-02 19:09:28 t_001_edate 03.11.2015
2015-11-02 19:09:28 t_001_etime 12:00:00
2015-11-02 19:09:28 t_001_location 2001
2015-11-02 19:09:28 t_001_source Geburtstage
2015-11-02 19:09:28 t_001_summary Test2
2015-11-02 19:09:28 t_002_bdate 04.11.2015
2015-11-02 19:09:28 t_002_btime 11:00:00
2015-11-02 19:09:28 t_002_edate 04.11.2015
2015-11-02 19:09:28 t_002_etime 12:00:00
2015-11-02 19:09:28 t_002_location 1989
2015-11-02 19:09:28 t_002_source Geburtstage
2015-11-02 19:09:28 t_002_summary Mustermann
2015-11-02 19:09:28 t_003_bdate 05.11.2015
2015-11-02 19:09:28 t_003_btime 11:00:00
2015-11-02 19:09:28 t_003_edate 05.11.2015
2015-11-02 19:09:28 t_003_etime 12:00:00
2015-11-02 19:09:28 t_003_location 1950
2015-11-02 19:09:28 t_003_source Geburtstage
2015-11-02 19:09:28 t_003_summary Noch ein test
2015-11-02 19:09:28 t_004_bdate 22.09.2016
2015-11-02 19:09:28 t_004_btime 00:00:00
2015-11-02 19:09:28 t_004_edate 23.09.2016
2015-11-02 19:09:28 t_004_etime 00:00:00
2015-11-02 19:09:28 t_004_location
2015-11-02 19:09:28 t_004_source Geburtstage
2015-11-02 19:09:28 t_004_summary PS
2015-11-02 19:09:28 t_005_bdate 31.10.2016
2015-11-02 19:09:28 t_005_btime 06:00:00
2015-11-02 19:09:28 t_005_edate 31.10.2016
2015-11-02 19:09:28 t_005_etime 07:00:00
2015-11-02 19:09:28 t_005_location 2000
2015-11-02 19:09:28 t_005_source Geburtstage
2015-11-02 19:09:28 t_005_summary TestGeb1
2015-11-02 19:09:28 tomorrow_001_btime 11:00:00
2015-11-02 19:09:28 tomorrow_001_edate 03.11.2015
2015-11-02 19:09:28 tomorrow_001_etime 12:00:00
2015-11-02 19:09:28 tomorrow_001_location 2001
2015-11-02 19:09:28 tomorrow_001_source Geburtstage
2015-11-02 19:09:28 tomorrow_001_summary Test2
Attributes:
maxreadings 10
modes modeAlarm,modeStart,modeStarted,modeUpcoming
room Kalender
und der Code:
<li data-row="2" data-col="2" data-sizex="2" data-sizey="2">
<header>Geburtstage</header>
<div data-type="calview"
data-device="GeburtstageView"
data-get="all"
data-max="10" class="cell centered fullsize top-space"
data-all-forecast-color="#FFF200"
data-all-today-color="#6EB54C"></div>
</li>
Ich hoffe du findest den Fehler.
Danke
Spukt denn die JavaScript Console etwas aus, weil so sieht erst einmal alles ok aus.
Hast du denn auch das widget in der Header Section eingebunden, bzw. kann er sie laden ggf. Rechte prüfen.
Ansonsten müsste ich ein paar Log Ausgaben einbauen.
Nu hätte ich doch auch mal wieder ne quick question... ;)
Hab nen circlemenu für die Farbauswahl meines LW12 gebastelt und leider sind die icons "verrutscht".
Jemand ne Idee warum das so ist, bzw. was ich falsch definiert habe? (Funktion ist übrigens gegeben)
Code und Snipping anbei.
<li data-row="2" data-col="5" data-sizex="2" data-sizey="2">
<header>TV-BACKLIGHT</header>
<div class="centered container">
<div class="right">
<div data-type="switch" class="cell" data-device="TV_LED" data-get-on="on" data-get-off="off"></div>
<div data-type="label">Dimmer</div>
</div>
<div class="right">
<div data-type="thermostat" data-device="TV" data-get="brightness" data-set="dim" data-min="0" data-max="100" class="cell"></div>
<div data-type="label">An</div>
</div>
<div data-type="circlemenu" class="cell circlemenu wider keepopen">
<ul>
<li><div data-type="push" data-icon="fa-paint-brush"></div></li>
<li><div id="orange" data-type="button" data-fhem-cmd="set TV RGB FFA500" data-icon="fa-paint-brush" data-on-background-color="hsl(50,100%,50%)" class="cell"></div></li>
<li><div id="pink" data-type="button" data-fhem-cmd="set TV RGB FF00FF" data-icon="fa-paint-brush" data-on-background-color="hsl(320,100%,50%)" class="cell"></div></li>
<li><div id="green" data-type="button" data-fhem-cmd="set TV RGB 00FF00" data-icon="fa-paint-brush" data-on-background-color="hsl(130,100%,50%)" class="cell"></div></li>
<li><div id="blue" data-type="button" data-fhem-cmd="set TV RGB 0000FF" data-icon="fa-paint-brush" data-on-background-color="hsl(240,100%,50%)" class="cell"></div></li>
<li><div id="red" data-type="button" data-fhem-cmd="set TV RGB FF0000" data-icon="fa-paint-brush" data-on-background-color="hsl(360,100%,50%)" class="cell"></div></li>
</ul>
</div>
</li>
Vielen Dank wie immer für eure Mühe!
Gruß Christian
Zitat von: ChristianR am 03 November 2015, 13:31:54
Nu hätte ich doch auch mal wieder ne quick question... ;)
Hab nen circlemenu für die Farbauswahl meines LW12 gebastelt und leider sind die icons "verrutscht".
Jemand ne Idee warum das so ist, bzw. was ich falsch definiert habe? (Funktion ist übrigens gegeben)
Code und Snipping anbei.
Vielen Dank wie immer für eure Mühe!
Gruß Christian
Die Listenelemente brauchen kein class="cell"
Das nutz man nur dort, wo solch ein Shift von 10px oben und 10px links benötigt wird. Also, wo man Abstand zwischen Elementen braucht.
Zitat von: setstate am 02 November 2015, 18:02:17
pagebutton geht auch, hat aber ein anderes Verhalten als pagetab ...
Pagetab hätte ich so definiert (menu.html):
Vielen Dank, das werde ich mal ausprobieren. Ich hatte das Beispiel http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Beispiel_pagetab so interpretiert, dass pagetab vor <div class="gridster"> definiert wird. Seit das da weg ist (bzw. durch pagebutton ersetzt), klappt auch der Reload in Desktop-Browsern wieder besser, über dessen Probleme (zerschossene Seiten, die sich erst nach vielen Reloads/F5 wieder richtig aufbauen) einige hier im Thread schon geschrieben haben.
Anscheinend führt der von mir ursprünglich gewählte Weg dazu, dass Readings nicht mehr korrekt aktualisiert werden?
Hey,
erstmal muss ich erwähnen das ich sehr begeistern von dem FTUI bin:)
Ich hätte aber zwei Fragen:
Zu dem Modul: readingsgroup.
Das einbinden hat wunderbar geklappt und es wird auch alles richtig dargestellt, allerdings wird das Modul nicht aktualisiert.
Im Code habe ich maxupdate="10" benutzt, was aber nichts bringt...
Jm. eine idee?
Code: <div data-type="readingsgroup" data-device="Anrufliste" data-max-update="10"></div>
außerdem möchte ich Fragen ob es normal ist wenn es ab und an passiert das die Oberfläche nach einem Browser-refresh so aussehen kann wie im angehängten Bild?
Für jede Antwort bin ich Dankbar:)
Zitat von: EpicMinister am 03 November 2015, 22:02:15
außerdem möchte ich Fragen ob es normal ist wenn es ab und an passiert das die Oberfläche nach einem Browser-refresh so aussehen kann wie im angehängten Bild?
Für jede Antwort bin ich Dankbar:)
Wenn die Seite so aussieht, dann ist definitiv ein Javascript-Fehler aufgetreten. Bitte in der Web-Console (Desktop-Browser) nachsehen. Eventuell ist auch nur das HTML syntaktisch nicht ganz richtig.
Danke für die Antwort:)
Das dachte ich auch...
habe auch schon nachgeschaut allerdings gibt es keinen Fehler.
Die Ausgabe auf der Konsole hört einfach mittendrin auf.
Alles sehr komisch :-\
Zitat von: uniqueck am 02 November 2015, 22:56:43
Spukt denn die JavaScript Console etwas aus, weil so sieht erst einmal alles ok aus.
Hast du denn auch das widget in der Header Section eingebunden, bzw. kann er sie laden ggf. Rechte prüfen.
Ansonsten müsste ich ein paar Log Ausgaben einbauen.
Mit der Console kenn ich mich nicht aus, sorry. Da kann ich keine Fehler erkennen bzw. weiß nicht was Fehler sind.
Folgendes hab ich in die html-Datei eingefügt, ist das so richtig? Sorry, viele Sachen hab ich noch nicht so richtig auf dem Schirm.
</body>
<script src="/fhem/pgm2/jquery.min.js"></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js"></script>
<script src="/fhem/tablet/js/widget_calview.js"></script>
</htmlDas hab ich unten eingefügt und nicht in den Head der Datei.
Die Rechte müsste muss ich heute Abend noch mal überprüfen.
Hallo zusammen,
kurze Frage - ich habe jetzt meine Navigation auf pagetab umgestellt und nutze hier u.a. auch ein circlemenu, um aus etlichen Räumen auszuwählen. Nun hätte ich gerne, dass wenn ein Eintrag aus dem circlemenu selektiert ist, dass circlemenu icon auch "aktiv" ist (quasi "on" mit entsprechender Farbe), so dass klar ist, das man sich in der "Kategorie" Räume befindet. Leider lässt pagetab wohl nicht zu ein dummy device mit einem Status zu versehen/zu triggern.
Hat jemand da ggf. eine Idee/Implementierung oder denke ich nur zu komplex?
Nachtrag: OK - hab's jetzt mit 'nem Switch für ein Circlemenu und den pagetabs hinbekommen - bei zwei oder mehr muss ich dann quasi schon den Status binär kodieren, um mit
den settern/gettern in einem dummy klar zu kommen. Scheint mir für den Moment etwas arg komplex zu sein.
Cheers,
h3ll
Zitat von: setstate am 02 November 2015, 18:02:17
Also index.html ist nicht Bestandteil des Menüs.
Habe ich jetzt mal ausprobiert. Gefühlt (nicht gemessen) dauert der Seitenwechsel länger als mit dem direkt in die Dateien gesetzten pagebuttons, aber das muss ich heute Abend mal vor Ort und auf dem Tablet genauer ausprobieren.
Zitat von: setstate am 02 November 2015, 18:02:17
Also index.html ist nicht Bestandteil des Menüs.
Habe ich jetzt mal ausprobiert. Gefühlt (nicht gemessen) dauert der Seitenwechsel länger als mit dem direkt in die Dateien gesetzten pagebuttons, aber das muss ich heute Abend mal vor Ort und auf dem Tablet genauer ausprobieren.
Hat jemand noch eine Idee?
Zitat von: oehi86 am 01 November 2015, 23:02:57
Hi hi,
danke für die Antwort schon mal. Am Rechner funktioniert es absolut perfekt. Da erscheinen die Toast-Messages und der Aktor wird auch geschaltet. Am iOS Device werden der aktuelle Status angezeigt, aber die Toast-Messages erscheinen nur für die aus der "Standard-index.html" vorhandenen Devices. Nicht aber für die, die ich bereits in die index.html integriert habe.
wz_LEDSteckdose funktioniert nur am PC (von mir integriert), für das Philips Hue Device erhalte ich auf beiden Geräten (PC und iOS Device) eine Toast-Message. Funktionieren tut die Philips logischerweise nicht, da sie aus der template-index.html kommt.
<div class="right right-space">
<div data-type="switch" data-device="wz_LEDSteckdose" class="cell"></div>
<div data-type="label" class="">LED Lichtleiste</div>
<div data-type="dimmer" data-device="HUEDevice1" data-get-on="!off" data-get-off="off" data-set="pct" class="top-space-2x" ></div>
<div data-type="label" class="cell">Philips</div>
</div>
Ich verstehen leider die Frage nicht, auch nach mehrmaligem Lesen.
Baue bitte eine index.html nur mit deinen Devices und im iOS den Broswer neu laden (Task vorher beenden).
Was passiert bei nun bei der wz_LEDSteckdose?
Zitat von: dadoc am 04 November 2015, 13:55:28
das muss ich heute Abend mal vor Ort und auf dem Tablet genauer ausprobieren.
Dasselbe Phänomen wie beim direkten Einbinden der pagetabs: Readings wie Sender oder Programm werden beim Umschalten des Kanals nicht aktualisiert. Ich glaube, ich bleibe bei den pagebuttons, mit denen geht's...
Zitat von: setstate am 03 November 2015, 14:12:46
Die Listenelemente brauchen kein class="cell"
Das nutz man nur dort, wo solch ein Shift von 10px oben und 10px links benötigt wird. Also, wo man Abstand zwischen Elementen braucht.
Danke, das war der gesuchte Hinweis!
Hi @skuggy,
diese Angabe bitte in den head Bereich in der HTML Seite einbinden.
<head>
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="137">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1">
<meta name="debug" content="0">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css">
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css">
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css">
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css">
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css">
<link rel="stylesheet" href="./css/wopr.css">
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/own.css">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/widget_calview.js"></script>
</head>
Zitat von: skuggy am 04 November 2015, 10:06:07
Mit der Console kenn ich mich nicht aus, sorry. Da kann ich keine Fehler erkennen bzw. weiß nicht was Fehler sind.
Folgendes hab ich in die html-Datei eingefügt, ist das so richtig? Sorry, viele Sachen hab ich noch nicht so richtig auf dem Schirm.
</body>
<script src="/fhem/pgm2/jquery.min.js"></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js"></script>
<script src="/fhem/tablet/js/widget_calview.js"></script>
</html
Das hab ich unten eingefügt und nicht in den Head der Datei.
Die Rechte müsste muss ich heute Abend noch mal überprüfen.
New Widget: Chart
Das neue Widget Chart ist von User eki entwickelt worden. Ich habe es gerade auf Github hochgeladen.
Die Liste der Features gibt es im Ursprungsthread: siehe hier http://forum.fhem.de/index.php/topic,37378.msg352326.html#msg352326 (http://forum.fhem.de/index.php/topic,37378.msg352326.html#msg352326)
Beispiel zu Nutzung:
<li data-row="4" data-col="9" data-sizex="10" data-sizey="3">
<header>CHART</header>
<div class="normal"
data-type="chart"
data-device="WohnzimmerHeizung"
data-logdevice='["FileLog_WohnzimmerHeizung","FileLog_WohnzimmerHeizung","FileLog_WohnzimmerHeizung"]'
data-columnspec='["4:measured-temp","4:desired-temp","4:ValvePosition"]'
data-style='["ftui l0fill","ftui l0dot","ftui l2dash"]'
data-ptype='["lines","lines","lines"]'
data-uaxis='["primary","primary","secondary"]'
data-legend='["Measured", "Desired", "Valve"]'
data-yunit="°C"
data-ytext="Temperature"
data-minvalue="auto"
data-maxvalue="auto"
data-yunit_sec="%"
data-ytext_sec="Percentage"
data-yticks="auto"
data-minvalue_sec="0"
data-maxvalue_sec="100"
data-daysago_start="0"
data-daysago_end="-1"
data-crosshair="true"
data-cursorgroup="1"
data-scrollgroup="1"
data-showlegend="true"
data-xticks="auto">
</div>
</li>
Neues Widget Checkbox
Dieses Control ist nutzbar wie ein Switch, aber rein optisch eher für Setting-Einstellungen nützlich.
<div data-type="checkbox" data-device='myAT'
data-get-on="!off" data-get-off="inactive"
data-set-on="active" data-set-off="inactive"
class="green">
</div>
Nachtrag: gestern habe ich es noch hinbekommen, das Control per "Slide to Change" ändern zu können. Das ist auf Touchdisplays intuitiver zu bedienen.
Cool Danke!
Ich habe die "Müll-Logik" zur Anzeige eines Ausrufe-Icons auf meiner Index-Seite eingebaut.
Leider wird mittlerweile das Icon auf der Index-Seite nicht mehr angezeigt. Auf der Müllseite selber klappt das wunderbar. Der Link klappt auch.
Habe ich da einen Bock drin den ich nicht finde? Freu mich über Hilfe.
Das ist mein Code in der index.html dazu:
<!-- ============= Müll ================== -->
<li data-row="3" data-col="4" data-sizex="1" data-sizey="1">
<header>Muell</header>
<div style="font-size:30px; color:rgb(96, 0, 0);"
data-type="button"
data-device="Muellalert"
data-color="#aa6900"
data-get-on='["on","off"]'
data-url="muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="cell"></div>
<div data-type="label" class="narrow darker">Muell</div>
</li>
@Gunther: Der Code selbst ist okay. Der Fehler muss wo anders liegen ...
Neu: Circlemenu kann jetzt auch vertikal oder horizontal ausgeklappt werden.
data-direction="horizontal"
data-circle-radius="60"
Damit ist die Liste für data-direction jetzt:
top | right | bottom | left | top-right | top-left | bottom-right | bottom-left | top-half | right-half | bottom-half | left-half | full | vertical | horizontal
News: Highchart Widget von blackbluegl ist per update verfügbar
http://forum.fhem.de/index.php/topic,37378.msg352171.html#msg352171 (http://forum.fhem.de/index.php/topic,37378.msg352171.html#msg352171)
- Beispiele sind im examples Ordner verfügbar.
Achtung: die Highchart-Widgets holen Files (Google->Font, meteogram-Data) direkt aus dem Internet vom Client (Tablet) aus. Wer das nicht möchte, sollte diese highchart Widgets (widget_meteogram, widget_highchart, widget_highchart3d) nicht benutzen!
Danke für die vielen Neuerungen :D
ich weiss gar nicht wo ich anfangen soll. ;D
Hi @uniqueck,
vielleicht kannst du mit dieser Meldung was anfangen:
SyntaxError: expected expression, got '<'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "ht
widget_calview.js (Zeile 1)
Plugin dir: /fhem/tablet/js
fhem-tablet-ui.js (Zeile 114)
Filename: test.html
fhem-tablet-ui.js (Zeile 118)
Collecting required readings
fhem-tablet-ui.js (Zeile 211)
GET http://192.168.178.35:8083/fhem/tablet/js/widget_calview.js?_=1446986176002
200 OK
0ms
jquery.min.js (Zeile 4)
Loaded plugin: widget_calview
fhem-tablet-ui.js (Zeile 39)
calview
jquery.... > eval (Zeile 5)
device: GeburtstageView
jquery.... > eval (Zeile 10)
get: all
jquery.... > eval (Zeile 11)
max: 10
jquery.... > eval (Zeile 12)
all: 1
jquery.... > eval (Zeile 48)
all: 2
jquery.... > eval (Zeile 48)
all: 3
jquery.... > eval (Zeile 48)
all: 4
jquery.... > eval (Zeile 48)
all: 5
jquery.... > eval (Zeile 48)
all: 6
jquery.... > eval (Zeile 48)
all: 7
jquery.... > eval (Zeile 48)
all: 8
jquery.... > eval (Zeile 48)
all: 9
jquery.... > eval (Zeile 48)
all: 10
jquery.... > eval (Zeile 48)
max: #FFF200 #6EB54C
jquery.... > eval (Zeile 119)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : false
jquery.... > eval (Zeile 132)
TypeError: dateCheck is null
var c = dateCheck.split(".");
jquery.... > eval (Zeile 158, Spalte 6)
GET http://192.168.178.35:8083/fhem/?cmd=list+GeburtstageView+STATE&XHR=1&_=1446986176003
200 OK
47ms
jquery.min.js (Zeile 4)
ParameterHeaderAntwort
GeburtstageView t: 6 td: 0 tm: 1
GET http://192.168.178.35:8083/fhem/?cmd=list+GeburtstageView+all&XHR=1&_=1446986176004
200 OK
75ms
jquery.min.js (Zeile 4)
ParameterHeaderAntwort
GET http://192.168.178.35:8083/fhem/?cmd=list+GeburtstageView+t_001_summary&XHR=1&_=1446986176005
200 OK
75ms
jquery.min.js (Zeile 4)
ParameterHeaderAntwort
GeburtstageView 2015-11-08 09:04:42 Mustermann
Mahlzeit!
Erst einmal vom Spätwechsler ein großes Lob: Sehr schönes UI. Bin aktuell bei der Migration eines Dashboards :)
Habe ein Thermostat wie folgt definiert:
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2">
<header>Klima</header>
<div data-type="thermostat" data-device="OG.AZ.Thermostat_Climate" class="cell" data-valve=""></div>
<div data-type="label" class="cell">Arbeitszimmer</div>
</li>
Das Ergebnis ist allerdings nicht ein Widget sondern zwei (siehe Anhang) und die Labels sind verschoben.
Danke vorab.
Patrick
Hi @skuggy,
versuchs mal mit der hier angehangenen widget_calview.js.
Habe mal noch einen null check eingebaut.
Gruß
Zitat von: skuggy am 08 November 2015, 13:42:23
Hi @uniqueck,
vielleicht kannst du mit dieser Meldung was anfangen:
SyntaxError: expected expression, got '<'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "ht
widget_calview.js (Zeile 1)
Plugin dir: /fhem/tablet/js
fhem-tablet-ui.js (Zeile 114)
Filename: test.html
fhem-tablet-ui.js (Zeile 118)
Collecting required readings
fhem-tablet-ui.js (Zeile 211)
GET http://192.168.178.35:8083/fhem/tablet/js/widget_calview.js?_=1446986176002
200 OK
0ms
jquery.min.js (Zeile 4)
Loaded plugin: widget_calview
fhem-tablet-ui.js (Zeile 39)
calview
jquery.... > eval (Zeile 5)
device: GeburtstageView
jquery.... > eval (Zeile 10)
get: all
jquery.... > eval (Zeile 11)
max: 10
jquery.... > eval (Zeile 12)
all: 1
jquery.... > eval (Zeile 48)
all: 2
jquery.... > eval (Zeile 48)
all: 3
jquery.... > eval (Zeile 48)
all: 4
jquery.... > eval (Zeile 48)
all: 5
jquery.... > eval (Zeile 48)
all: 6
jquery.... > eval (Zeile 48)
all: 7
jquery.... > eval (Zeile 48)
all: 8
jquery.... > eval (Zeile 48)
all: 9
jquery.... > eval (Zeile 48)
all: 10
jquery.... > eval (Zeile 48)
max: #FFF200 #6EB54C
jquery.... > eval (Zeile 119)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : true
jquery.... > eval (Zeile 132)
Ist heute : false
jquery.... > eval (Zeile 131)
Ist in den nächsten 7 Tagen : false
jquery.... > eval (Zeile 132)
TypeError: dateCheck is null
var c = dateCheck.split(".");
jquery.... > eval (Zeile 158, Spalte 6)
GET http://192.168.178.35:8083/fhem/?cmd=list+GeburtstageView+STATE&XHR=1&_=1446986176003
200 OK
47ms
jquery.min.js (Zeile 4)
ParameterHeaderAntwort
GeburtstageView t: 6 td: 0 tm: 1
GET http://192.168.178.35:8083/fhem/?cmd=list+GeburtstageView+all&XHR=1&_=1446986176004
200 OK
75ms
jquery.min.js (Zeile 4)
ParameterHeaderAntwort
GET http://192.168.178.35:8083/fhem/?cmd=list+GeburtstageView+t_001_summary&XHR=1&_=1446986176005
200 OK
75ms
jquery.min.js (Zeile 4)
ParameterHeaderAntwort
GeburtstageView 2015-11-08 09:04:42 Mustermann
Zitat von: setstate am 07 November 2015, 20:45:04
@Gunther: Der Code selbst ist okay. Der Fehler muss wo anders liegen ...
Hmm, wo liegen die fa-Files? Werden die Online gezogen?
Muss ich in meiner fhem.cfg nach dem Fehler suchen.
Zitat von: uniqueck am 08 November 2015, 22:01:44
Hi @skuggy,
versuchs mal mit der hier angehangenen widget_calview.js.
Habe mal noch einen null check eingebaut.
Gruß
Hi @uniqueck
Super, es funktioniert, zumindest teilweise. Heutige Termine werden nicht angezeit, siehe Anlage.
Und wie bekomm ich die Schrift kleiner? Ich habe class small genommen, aber das ist mir noch zu groß.
Danke
Guten Morgen :-)
wo ist den das widget_calview gehostet?
Soll/darf ich es mit in das FTUI Repo aufnehmen, damit es auch per Update verteilt wird?
ciao
Hallo,
sitze hier schon seit Stunden ...
Ich versuche meinen auf meinem Server liegenden Owncloudkalender per iframe ins UI einzubinden.
Links auf der Seite "Kalender" habe ich ein Menü.
Sofern ich http://xxx.xxx.xxx.xxx:8083/fhem/tablet/#calendar.html am PC per IE oder FF aufrufe ist alles OK.
Wenn ich mir das aber an dem Android-Tablet (mit "Browser") ansehe, wird der Kalender an der linken Seite um die Breite des Menüs abgechnitten.
Der Iframe kümmert sich also nicht um die
<li data-row="5" data-col="5" data-size="2" data-sizey="1">, und scheint sich an dem linken Rand des gesamten Anzeigebereichs zu orientieren.
Komischerweise ist das nur mit Owncloud so. Andere Seiten werden richtig dargestellt.
Was kann das sein?
Grüße
Dirk
Hallo, ich habe dieses Bild in diesem Beitrag gesehen.
Gibt es eine Anleitung, wo ich das Hintergrundbild ändern kann, oder kann mir jemand sagen in Welcher Datei? CSS oder der Index?
Und wie man die Transparenz einstellen kann?
Finde Das echt toll!
Viele Grüße!
Zitat von: boke am 09 November 2015, 16:29:07
Hallo, ich habe dieses Bild in diesem Beitrag gesehen.
Gibt es eine Anleitung, wo ich das Hintergrundbild ändern kann, oder kann mir jemand sagen in Welcher Datei? CSS oder der Index?
Und wie man die Transparenz einstellen kann?
Finde Das echt toll!
Viele Grüße!
http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_kann_ich_ein_eigenes_Hintergrundbild_einbinden.2C_anstatt_des_einfachen_schwarz.3F
8) :P
Haha, super, das ging schnell!
Hab echt gesucht, aber das habe ich nicht gefunden.
Vielen Dank!
Zitat von: boke am 09 November 2015, 16:53:26
Haha, super, das ging schnell!
Hab echt gesucht, aber das habe ich nicht gefunden.
Vielen Dank!
Ist gaaaanz neu :))
Ich habe da auch nochmal 'ne Frage @setstate
Das Homewidget wird ja über Canvas eingebunden... Viel von gehört aber nicht den blassesten Schimmer davon ;D
Kann ich das vergrößern? Richte meine FTUI für 1280x800 ein und selbstredend soll getouched werden. dafür finde ich es allerdings ein bisschen klein und passt nur unschön in mein Grid.
Homestatus kennt data-height und data-width.
Default ist 210, wenn man class="small" setzt, wird die Größe 160
Zitat von: setstate am 09 November 2015, 17:09:31
Homestatus kennt data-height und data-width.
Default ist 210, wenn man class="small" setzt, wird die Größe 160
Jawoll... jetzt ist das schick. Besten Dank!
Ok, das mit dem Bild hat super geklappt, wie bekome ich die Widgets transparent?
Zitat von: boke am 09 November 2015, 17:33:24
Ok, das mit dem Bild hat super geklappt, wie bekome ich die Widgets transparent?
hallo,
sry hab heute erst jetzt Zeit gefunden für das Forum & FHEM
.halbTransparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.5) !important;
}
.transparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0) !important;
}den code hab ich in der *.css
Und mir der class="halbTransparent" füge ich die Widgets dann ein.
z.B. so:
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu.html" class="halbTransparent"></li>gruß
Daniel
Zitat von: boke am 09 November 2015, 17:33:24
Ok, das mit dem Bild hat super geklappt, wie bekome ich die Widgets transparent?
Bei mir sieht das dann sogar so aus:
.halbTransparent {
/* Fallback for web browsers that doesn't support RGBa */
/*background: rgb(0, 0, 0) !important;*/
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.7) !important;
}
.headerTransparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.3) !important;
}
.dialogTransparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.9) !important;
}
.dialogheaderTransparent {
/* Fallback for web browsers that doesn't support RGBa */
background: rgb(0, 0, 0) !important;
/* RGBa with 0.6 opacity */
background: rgba(0, 0, 0, 0.7) !important;
}
Danke für die Antwort, aber ich bekomme nur einen schwarzen Hintergrund. Das Bild wird angezeigt aber nicht hinter dem Widget. muss ich den ganzen Kasten hinter den Widgets entfernen?
Misst, war an der falschen Stelle, jetzt geht alles!
Vielen Dank!
Ist der Hammer!
Mahlzeit!
Ich mache das ja wirklich ungern, aber ich muss mein Problem mit den doppelten thermostat-Widgets noch einmal ansprechen:
http://forum.fhem.de/index.php/topic,34233.msg356569.html#msg356569
Danke!
Patrick
Zitat von: PatrickR am 08 November 2015, 18:34:56
Mahlzeit!
Erst einmal vom Spätwechsler ein großes Lob: Sehr schönes UI. Bin aktuell bei der Migration eines Dashboards :)
Habe ein Thermostat wie folgt definiert:
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2">
<header>Klima</header>
<div data-type="thermostat" data-device="OG.AZ.Thermostat_Climate" class="cell" data-valve=""></div>
<div data-type="label" class="cell">Arbeitszimmer</div>
</li>
Das Ergebnis ist allerdings nicht ein Widget sondern zwei (siehe Anhang) und die Labels sind verschoben.
Danke vorab.
Patrick
hallo,
versuch mal
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2">
<header>Klima</header>
<div data-type="thermostat" data-device="OG.AZ.Thermostat_Clima" class="cell"></div>
<div data-type="label" class="cell">Arbeitszimmer</div>
</li>
Zitat von: PatrickR am 08 November 2015, 18:34:56
Mahlzeit!
Erst einmal vom Spätwechsler ein großes Lob: Sehr schönes UI. Bin aktuell bei der Migration eines Dashboards :)
Habe ein Thermostat wie folgt definiert:
<li data-row="1" data-col="2" data-sizex="1" data-sizey="2">
<header>Klima</header>
<div data-type="thermostat" data-device="OG.AZ.Thermostat_Climate" class="cell" data-valve=""></div>
<div data-type="label" class="cell">Arbeitszimmer</div>
</li>
Das Ergebnis ist allerdings nicht ein Widget sondern zwei (siehe Anhang) und die Labels sind verschoben.
Danke vorab.
Patrick
Als erstes würde ich deine Devices in FHEM umbennen. Aus den Punkten . Unterstriche _ machen. Könnte ein RegEx Problem sein.
Dann schau dir das hier nochmal genau an: https://github.com/knowthelist/fhem-tablet-ui#thermostat-widgets (https://github.com/knowthelist/fhem-tablet-ui#thermostat-widgets)
Füge vorallem data-get="desired-Temp" und data-set="desired-Temp" und auch data-temp="measuredTemperature" sowie data-min="5" und data-max="25" hinzu. (die Inhalte in den " " (Anführungszeichen) natürlich anpassen.
So wie du es jetzt hast weiß das Widget doch gar nicht was es "lesen" und was es "schreiben" soll. Selbst wenn es dafür Standardinhalte im Widget gibt, würde ich das immer mit angeben.
Hi!
Zitat von: roman1528 am 09 November 2015, 21:39:50
Als erstes würde ich deine Devices in FHEM umbennen. Aus den Punkten . Unterstriche _ machen. Könnte ein RegEx Problem sein.
Würde er als eine RegEx interpretiert, würde er auf exakt ein Device (das gewünschte) matchen.
Zitat von: roman1528 am 09 November 2015, 21:39:50
Füge vorallem data-get="desired-Temp" und data-set="desired-Temp" und auch data-temp="measuredTemperature" sowie data-min="5" und data-max="25" hinzu. (die Inhalte in den " " (Anführungszeichen) natürlich anpassen.
Erledigt. Leider reagiert das Widget wie erwartet und das Ergebnis mit expliziten Defaults ist identisch.
Zitat von: roman1528 am 09 November 2015, 21:39:50
So wie du es jetzt hast weiß das Widget doch gar nicht was es "lesen" und was es "schreiben" soll. Selbst wenn es dafür Standardinhalte im Widget gibt, würde ich das immer mit angeben.
Eigentlich schon, genau dafür hat der Autor ja die Defaults eingebaut.
Patrick
Zitat von: PatrickR am 09 November 2015, 22:03:15
Würde er als eine RegEx interpretiert, würde er auf exakt ein Device (das gewünschte) matchen.
Stimmt... Jaaaa... RegEx ist nich so meins...
Zitat von: PatrickR am 09 November 2015, 22:03:15
Erledigt. Leider reagiert das Widget wie erwartet und das Ergebnis mit expliziten Defaults ist identisch.
Hmpf... Schade
Zitat von: PatrickR am 09 November 2015, 22:03:15
Eigentlich schon, genau dafür hat der Autor ja die Defaults eingebaut.
Für einige andere nur nicht zu gebrauchen wenn man wie ich MAX! hat :P
Nach erneuter Betrachtung deines Screenshots.... Mach die <li> mal auf data-sizey="2"
Ich hatte auch so ein Problem ... allerdings mit MAX Thermostaten... leider kann ich mich nicht genau daran erinnern. Ich habe alles auf Push Widgets und extra TemperaturLabels umgestellt da mir die Touchbedienung des Thermostat bzw. Volume Widgets nicht so zusagt hat.
Das Widget habe ich aus folgenden Thread http://forum.fhem.de/index.php/topic,19922.msg319607.html#msg319607 (http://forum.fhem.de/index.php/topic,19922.msg319607.html#msg319607),
allerdings wurde es nicht weiter entwickelt und es habe nicht viele genutzt, ich wollte allerdings nicht über das einbinden von readingGroups gehen, daher habe ich es selber etwas weiter entwickelt, allerdings nur den einen Strang innerhalb des widgets, wenn der original author nix dagegen hat, kann es von mir aus gerne bei dir mit aufgenommen werden.
Kann ja ein erfahrender widget Ersteller mal drüber schauen und es vielleicht ein bisschen aufräumen, vor allem können die log Meldungen raus.
gruß
Zitat von: setstate am 09 November 2015, 09:40:24
Guten Morgen :-)
wo ist den das widget_calview gehostet?
Soll/darf ich es mit in das FTUI Repo aufnehmen, damit es auch per Update verteilt wird?
ciao
Hi!
Zitat von: roman1528 am 09 November 2015, 22:16:07
Nach erneuter Betrachtung deines Screenshots.... Mach die <li> mal auf data-sizey="2"
Hatte ich schon getestet. Dann ist der zweite Regler daneben aber immer noch zu viel :/
Patrick
Ohne die Log Meldungen aus der Console kann ich dir da leider nicht weiter helfen.
Wegen der Schrift Größe, da wirst du aktuell direkt in der javascript Datei beim erstellen der entsprechenden divs ne eigene Klasse mit einschleußen müssen, oder man erweitert das widget so, dass diese von außen mit gegeben werden kann.
Aber es freut mich, dass es nun noch jemanden gibt, wer diese widget nutzen kann.
Zitat von: skuggy am 09 November 2015, 09:21:51
Hi @uniqueck
Super, es funktioniert, zumindest teilweise. Heutige Termine werden nicht angezeit, siehe Anlage.
Und wie bekomm ich die Schrift kleiner? Ich habe class small genommen, aber das ist mir noch zu groß.
Danke
@PatrickR: Hmm, bei mir sieht da so und damit richtig aus ... ich glaube, die Ursache liegt außerhalb des von dir geposteten Teils ... poste doch mal die komplette Datei
Hi!
Zitat von: Nobby1805 am 09 November 2015, 23:53:56
@PatrickR: Hmm, bei mir sieht da so und damit richtig aus ... ich glaube, die Ursache liegt außerhalb des von dir geposteten Teils ... poste doch mal die komplette Datei
Das Interessante ist, dass das Auftreten des Bugs abhängig von der aufgerufenen URL ist:
http://fhem:8083/fhem/ftui#index.html => Fehler tritt auf
http://fhem:8083/fhem/ftui/index.html (wird zu http://fhem:8083/fhem/ftui/index.html#index.html) => Fehler tritt nicht auf
Löschen des Caches brachte keine Besserung.
Patrick
Zitat von: PatrickR am 10 November 2015, 18:57:00
Hi!
Das Interessante ist, dass das Auftreten des Bugs abhängig von der aufgerufenen URL ist:
http://fhem:8083/fhem/ftui#index.html => Fehler tritt auf
http://fhem:8083/fhem/ftui/index.html (wird zu http://fhem:8083/fhem/ftui/index.html#index.html) => Fehler tritt nicht auf
Löschen des Caches brachte keine Besserung.
Patrick
Kann es sein, dass Du in deinem index.html einen pagetab definiert hast?
Am besten postest du mal den ganzen index.html file...
Damit hatte ich auch riesige probleme. Immer "http://IP:PORT/fhem/ftui/" als startadresse
So wie das aussieht "/index.html#index.html" hat er mal nen pagetab mal nen button... ich habe alles auf pagebutton umgestellt weil viele Probleme mit dem nachladen neuer Seiten gab
Gesendet von meinem SM-G900F mit Tapatalk
Zitat von: PatrickR am 10 November 2015, 18:57:00
Hi!
Das Interessante ist, dass das Auftreten des Bugs abhängig von der aufgerufenen URL ist:
http://fhem:8083/fhem/ftui#index.html => Fehler tritt auf
http://fhem:8083/fhem/ftui/index.html (wird zu http://fhem:8083/fhem/ftui/index.html#index.html) => Fehler tritt nicht auf
Löschen des Caches brachte keine Besserung.
Patrick
Achso und kannst Du mal den define fuer den httpsrv posten, der erste url ist wirklich sehr komisch...
Abend @setstate,
du kannst das widget_calview mit ins TabletUI Repo aufnehmen, dann wird es demnächste mit verteilt.
Zitat von: setstate am 09 November 2015, 09:40:24
Guten Morgen :-)
wo ist den das widget_calview gehostet?
Soll/darf ich es mit in das FTUI Repo aufnehmen, damit es auch per Update verteilt wird?
ciao
Mahlzeit!
Tatsächlich nutze ich pagetabs:
http://pastebin.com/swKpTWkW
Patrick
Ich habe alle Widgets, die widget_knob als Basisklasse haben (HomeStatus,Volume,Thermostat) etwas aufgeräumt und dabei festgestellt, dass man "knob" auch als eigenständiges Control nutzen kann.
<div data-type="knob"
data-device='dummy1'
data-angleArc=360
data-angleOffset=0
class="blue large">
</div>
Zitat von: PatrickR am 11 November 2015, 20:46:52
Tatsächlich nutze ich pagetabs:
http://pastebin.com/swKpTWkW
Pagetabs haben bei mir Probleme beim nachladen der neuen Seite verursacht... obwohls ja echt schick aussieht das überblenden.
habe auf pagebutton umgestellt....
Mir ist aufgefallen, auch wenn die widgets ihre *.css oder *.js selbst einbinden macht es sinn sie mit in die *.html rein zu schreiben...
ich habe bei weitem auch nicht alle drin aber bei mir sieht das so aus: außerdem habe ich alles im <head> stehen. einfach der reihenfolge wegen^^
<!DOCTYPE html>
<html>
<head>
<title>HOME</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="130">
<meta name="widget_base_height" content="147">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="0"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="gridster_disable" content="1">
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-roman.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/pgm2/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'FHEMWZ':'Tablet'}; var wvcUserCssFile="/fhem/pgm2/webviewcontrol.css"</script>
</head>
<body>Das wird dein Problem garantiert nicht lösen aber es ist ein ansatz... ansonsten kann ich keinen Fehler in deiner html entdecken. Ich hatte ab und an doppelte anführungszeichen was zu problemen geführt hat aber bei dir is soweit nix falsch.... komisch
ich gebe es zu, Pagetab ist sehr kompliziert und verwirrend, wo was hin muss :-[
Vllt. können wir das noch optimieren, um es einfacher nutzen/aufbauen zu können.
Aber ich versuche nochmal die Nutzung von Pagetab und die Seiten zu erklären:
- Die index.html (Startseite) ist minimal und beinhaltet nur das Menu mit den 1-n Pagetabs
<!DOCTYPE html>
<html>
<head>
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="74">
<meta name="widget_base_height" content="71">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="1"> <!-- 1=output to console;0=not output -->
<meta http-equiv="Cache-Control" content="no-store" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<!-- link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" / -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="menu.html"></li>
</ul>
</div>
</body>
<script src="/fhem/pgm2/jquery.min.js"></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js"></script>
<!-- Remove this line to enable for usage with WebViewControl -->
<script src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script src="/fhem/pgm2/webviewcontrol.js"></script>
<script>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</html>
- die per Template eingebundene menu.html enthält die Pagetabs mit den Links zu den Unterseiten
<html>
<body>
<header>MENU</header>
<div class="cell">
<div data-type="pagetab" data-url="index_main.html" data-icon="fa-home" class="top-space"></div>
<div data-type="pagetab" data-url="index_music.html" data-icon="fa-music" class="top-space"></div>
<div data-type="pagetab" data-url="index_vusolo.html" data-icon="fa-sliders" class="top-space"></div>
<div data-type="pagetab" data-url="index_set.html" data-icon="fa-lightbulb-o" class="top-space"></div>
<div data-type="pagetab" data-url="index_charts.html" data-icon="fa-line-chart" class="top-space"></div>
<div data-type="pagetab" data-url="index_8.html" data-icon="fa-line-chart" class="top-space"></div>
<div class="bottom bottom-space-2x">
<div data-type="clock" data-format="H:i" class="large"></div>
<div data-type="clock" data-format="d.n.Y" class="small"></div>
</div>
</div>
</body>
</html>
- Ganz oben ist die index_main.html, die zuerst angezeigt wird und die Widgets hat
- Jede Unterseite hat wieder eine Menü-Leiste dabei, die per Template eingebunden wird. Aber, die Unterseiten enthalten keine Header Dateien / CSS links mehr.
<html>
<title>FHEM</title>
<head>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="7" data-template="menu.html"></li>
<li data-row="1" data-col="2" data-sizex="3" data-sizey="4">
<header>EXAMPLE1</header>
<!-- place your widget here -->
</li>
<li data-row="1" data-col="4" data-sizex="6" data-sizey="4">
<header>EXAMPLE2</header>
<!-- place your widget here -->
</li>
<li data-row="1" data-col="10" data-sizex="2" data-sizey="4">
<header>EXAMPLE3</header>
<!-- place your widget here -->
</li>
<li data-row="5" data-col="2" data-sizex="6" data-sizey="3">
<header>EXAMPLE4</header>
<!-- place your widget here -->
</li>
<li data-row="5" data-col="8" data-sizex="5" data-sizey="3">
<header>EXAMPLE5</header>
<!-- place your widget here -->
</li>
</ul>
</div>
</body>
</html>
index.html -> Header-Files (css/js), Nur ein Gridster-Element zum Import des Templates "menu.html"
menu-html -> eine Liste von Pagetab Widgets mit Links zu den Unterseiten
index_*.html -> Unterseiten mit den eigentlichen Widgets, keine Header-Files, ein Gridster-Element für die menu.html
@PatrickR: Deine Seite hat schon mal den Fehler, dass es ein Pagetab mit url "index.html" gibt
Zitat von: setstate am 12 November 2015, 09:31:22
ich gebe es zu, Pagetab ist sehr kompliziert und verwirrend, wo was hin muss :-[
Vllt. können wir das noch optimieren, um es einfacher nutzen/aufbauen zu können.
Was hältst Du denn von dieser Lösung: http://forum.fhem.de/index.php/topic,34233.msg340230.html#msg340230
Zitat von: ChrisK am 12 November 2015, 10:00:19
Was hältst Du denn von dieser Lösung: http://forum.fhem.de/index.php/topic,34233.msg340230.html#msg340230
Von Anfang an alles laden und im Hintergrund aktualisieren lassen. Sehr gute Idee... muss ich mich die Tge nochmal mit befassen^^ Nett!
Zitat von: setstate am 12 November 2015, 09:31:22
ich gebe es zu, Pagetab ist sehr kompliziert und verwirrend, wo was hin muss :-[
Vllt. können wir das noch optimieren, um es einfacher nutzen/aufbauen zu können.
Aber ich versuche nochmal die Nutzung von Pagetab und die Seiten zu erklären:
- Die index.html (Startseite) ist minimal und beinhaltet nur das Menu mit den 1-n Pagetabs
....
Das ist mal eine klare Erklärung. Habe es danach aufgebaut und siehe daaa... alles schick. bis auf das eine klitzekleine Problemchen dass er ab und an die icons nicht oder nur teilweise lädt. Habe schon alles auf Fehler (Anführungszeichen, <div>, ', und und und) gecheckt... Alles hat seine Ordnung. Der Fehler tritt auch nur sporadisch auf.
Zitat von: roman1528 am 12 November 2015, 10:15:40
Von Anfang an alles laden und im Hintergrund aktualisieren lassen. Sehr gute Idee... muss ich mich die Tge nochmal mit befassen^^ Nett!
Das ist mal eine klare Erklärung. Habe es danach aufgebaut und siehe daaa... alles schick. bis auf das eine klitzekleine Problemchen dass er ab und an die icons nicht oder nur teilweise lädt. Habe schon alles auf Fehler (Anführungszeichen, <div>, ', und und und) gecheckt... Alles hat seine Ordnung. Der Fehler tritt auch nur sporadisch auf.
Da hatte ich auch Probleme mit, bei mir hat es geholfen den debug Modus zu deaktivieren. Keine Ahnung wieso.
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->Gruß,
Stefan
Zitat von: Haecksler am 12 November 2015, 10:42:45
Da hatte ich auch Probleme mit, bei mir hat es geholfen den debug Modus zu deaktivieren. Keine Ahnung wieso.
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
Der Debug-Modus ist aus. Schon immer xD
@setstate : Muss in die weiteren index_*.html auch wieder der ganze header oder im Grunde nur die Widgets? Also die ganzen .js/.css wieder mit rein oder kommt es dann eventuell zu einer "Überladung" der js? Gerade wegen JQuery... Das mehrmals zu laden is ja fatal... Auf gut deutsch: werden die weiteren Seiten über die index.html (MAIN-Site) eingebunden oder komplett neu geladen?
EDITHab gerade das Update geladen... Alles zerstöööört :o :o :o
Hast du in der fhem-tablet-ui.css irgendwas an den big und bigger classes geändert?
EDIT 2Jetzt hab ich wieder gefunden warum ich von pagetab weg bin ... wenn ein pagetab "button" "on"(also aktiv, weil reading ist true) ist weil man ihn für "warn" oder "warn activate" verwendet kann man ihn nicht mehr anklicken... weil er ja im Grunde "on" ist. Das hat erstmal prorität denke ich.
ZitatMuss in die weiteren index_*.html auch wieder der ganze header ... ?
-> nein, scripts und CSS links sind nur in der index.html. Von den Unterseiten wird dann nur der Body dazu nachgeladen.
ZitatEDIT
Hab gerade das Update geladen... Alles zerstöööört :o :o :o
Hast du in der fhem-tablet-ui.css irgendwas an den big und bigger classes geändert?
ja, habe ich. Schaue ich mir nochmal an ...
ZitatEDIT 2
Jetzt hab ich wieder gefunden warum ich von pagetab weg bin ... wenn ein pagetab "button" "on"(also aktiv, weil reading ist true) ist weil man ihn für "warn" oder "warn activate" verwendet kann man ihn nicht mehr anklicken... weil er ja im Grunde "on" ist. Das hat erstmal prorität denke ich.
Würde ich mir auch ansehen, ob man das verbessern kann.
Hi,
ich nutze "Slider" u.a. als Füllstandsanzeige eines Behälters. Der Slider ist ganz normal definiert:
<div data-type="slider" data-device="Pool" data-get="pH-_Rest" data-part="1" data-value="true" class="readonly big"></div>
Ich würde aus optischen Gründen gern die Linie des Sliders verbreitern, damit er mehr nach Behälter ausieht, konnte aber nicht herausfinden, ob bzw. wie das geht. Müsste man das global im CSS hinterlegen (was aber dann auf alle Slider Auswirkungen hätte) oder gibt es einen anderen Weg?
Danke & Grüße
Martin
Zitat von: dadoc am 12 November 2015, 13:43:49
Hi,
ich nutze "Slider" u.a. als Füllstandsanzeige eines Behälters. Der Slider ist ganz normal definiert:
<div data-type="slider" data-device="Pool" data-get="pH-_Rest" data-part="1" data-value="true" class="readonly big"></div>
Ich würde aus optischen Gründen gern die Linie des Sliders verbreitern, damit er mehr nach Behälter ausieht, konnte aber nicht herausfinden, ob bzw. wie das geht. Müsste man das global im CSS hinterlegen (was aber dann auf alle Slider Auswirkungen hätte) oder gibt es einen anderen Weg?
Danke & Grüße
Martin
Für einen Füllstand würde ich das Level Widget nehmen.
Wenn du dafür sonst keine Verwendung hast kannst du das bearbeiten Blödsinn weil das auch mit der powerange.js/css zusammenhängt. dann ist dein slider auch im Eimer.
Spiel mal mit style="put-css-code-here" herum ....
Das hilft dir bei CSS: https://wiki.selfhtml.org/wiki/CSS/Eigenschaften (https://wiki.selfhtml.org/wiki/CSS/Eigenschaften)
Zitat von: dadoc am 12 November 2015, 13:43:49
Hi,
ich nutze "Slider" u.a. als Füllstandsanzeige eines Behälters. Der Slider ist ganz normal definiert:
<div data-type="slider" data-device="Pool" data-get="pH-_Rest" data-part="1" data-value="true" class="readonly big"></div>
Ich würde aus optischen Gründen gern die Linie des Sliders verbreitern, damit er mehr nach Behälter ausieht, konnte aber nicht herausfinden, ob bzw. wie das geht. Müsste man das global im CSS hinterlegen (was aber dann auf alle Slider Auswirkungen hätte) oder gibt es einen anderen Weg?
Danke & Grüße
Martin
Du müsstest in deine fhem-tablet-ui-user.css folgendes aufnehmen
.big > .vertical .range-bar {
width: 14px;
}für dieses Level Widget
<li data-row="4" data-col="1" data-sizex="2" data-sizey="3">
<header>EXAMPLE1</header>
<div data-type="level" data-device='dummy1' class="big"></div>
</li>Aber ich würde das auch in die Standard CSS aufnehmen, wenn es für euch passt.
Hallo, kurze Frage: ich plage mich grade damit ab eine Audio-Notification auf einem IPad auszugeben falls ein bestimmtes Event passiert (z.B. Kühlschrank ausgefallen, etc...). Ein "paar Posts" früher wurde mal eine Warnbox ausserhab Gridsters aufgeführt:
Zitat
Zitat von: selfarian am 02 April 2015, 13:41:51
Wäre es vielleicht möglich, eine Art Meldung oder so einzubauen die irgendwie getriggert wird?
Also das z.B. bei einem Alarm eine Rote Meldung im Vordergrund eingeblendet wird o.ä.?
Sowas? ;)
Code: [Auswählen]
<div data-type="symbol"
data-device="ALARM"
data-get="active"
data-get-on="on"
data-get-off="off"
data-icon="fa-exclamation-triangle"
data-background-icon="fa-circle"
data-on-color="#ffffff"
data-on-background-color="#ff0000"
data-off-color="rgba(0,0,0,0)"
data-off-background-color="rgba(0,0,0,0)"
style="font-size:250px;top:20px;left:150px;position:absolute;z-index:9999;pointer-events:none;"></div>
Muss allerdings ausserhalb(!) des <div class="gridster"> notiert werden.
« Letzte Änderung: 02 April 2015, 14:32:45 von nesges »
Frage an die HTML-Profis - es gibt ja das HTML5 <audio> Tag - ließe sich das hier einbauen? Oder liefert das immer einen "Player", der erst angeklickt werden muss? Muss gestehen meine HTML-Kentnisse sind eher als basal zu bezeichnen, aber kann ich beim eintreten eines Events einfach ein MP3 abspielen lassen? Wenn ja würde das meine Probleme sehr einfach lösen...?!
Super - funktioniert auch mit Slider, was den Vorteil hat, dass man einfacher die Höhe beeinflussen kann. Das sieht jetzt fast so aus wie der tatscähcliche Kanister ;)
Da ich die Breite auf 60 px gestellt habe, werde ich wohl das Offset noch etwas anpassen müssen, auch wenn das meine anderen Slider ebenfalls betreffen wird. Oder ich machen den Wert eben mit label darunte.
Viele Dank!
Hallo zusammen,
habe nach einem update vor ca. 3 Wochen das gleiche Problem wie Gunther (Antwort #2837 am: 07 November 2015, 17:14:22). Mein Müll-Alarm funktioniert nicht mehr so wie vorher. Mache ich was falsch oder habe ich eine Änderung übersehen?
Hier noch einmal meine index.html, die ich auf das Problem reduziert habe.
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta name="widget_base_width" content="170">
<meta name="widget_base_height" content="140">
<!-- <meta name="mobile-web-app-capable" content="yes"> -->
<!--<meta name="apple-mobile-web-app-capable" content="yes"> -->
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css">
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css">
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css">
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css">
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!--
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script> -->
<!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<li
data-row="1"
data-col="1"
data-sizex="1"
data-sizey="1"
>
<header>Müll</header>
<div
style="font-size:30px; color:rgb(96, 0, 0);"
data-type="button"
data-device="MuellAlarm"
data-color="#aa6900"
data-get-on='["on","off"]'
data-url="index_Muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="cell small">
</div>
<div data-type="label" class="narrow darker">Müll</div>
</li>
</ul>
</div>
</body>
</html>
Damit erhalte ich die im Anhang stehende Ausgabe.
Das nesges Button-Widget scheint nicht mehr zu funktionieren.
Mit dem Pagebutton müsste es aber klappen
Hier ein Beispiel mit alternativer Farbwahl von mir:
<div data-type="pagebutton"
data-device="MuellAlarm"
data-colors='["green","#777"]'
data-background-colors='["#222","#222"]'
data-states='["on","off"]'
data-url="index_Muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="">
</div>
Zitat von: setstate am 05 Oktober 2015, 18:54:57
Das habe ich bei einem "alten" Android und unter iOS (Iphone 4S) auch.
Keine Ahnung woran das liegt, irgendein ungünstiges Laufzeitverhalten.
Beim Homestatus Widget werden die Icons anders (Text im Canvas) als bei den Switches/Symbols gezeichnet.
Das ist aber nur beim ersten Laden so. Einmal mit Pagetab auf eine andere Seite und wieder zurück - danach hat der Homostatus dann seine Icons
Hallo setstate,
erstmal danke für Dein geniales UI. Ich baue damit meine erstes Control-Panel und bin begeistert vom Funktionsumfang und der Flexibilität.
Leider habe ich auch das Darstellungsproblem mit dem Homestatus. Und da der Kiosk-Browser regelmäßig selbst einen neuen Page-Reload macht, fehlen immer wieder die Symbole.
Gibt oder wird es eine Lösung für das Darstellungsproblem geben?
Danke und Gruß
Felix
Hallo Felix,
zumindest habe ich seit gestern einen Workaround drin, der das Control nach 15 Sekunden nach Reload neu zeichnet, damit die Symbole erscheinen. Wenn du ein Update machst, probiere danach mal aus, ob es auch bei dir hilft.
Danke
ZitatJetzt hab ich wieder gefunden warum ich von pagetab weg bin ... wenn ein pagetab "button" "on"(also aktiv, weil reading ist true) ist weil man ihn für "warn" oder "warn activate" verwendet kann man ihn nicht mehr anklicken... weil er ja im Grunde "on" ist. Das hat erstmal prorität denke ich.
soooo, Pagetab setzt jetzt kein On und Off abhängig vom MultiStatus. Damit sollte auch bei 'warn' der Tab nun klickbar bleiben.
Zitat von: setstate am 13 November 2015, 07:44:48zumindest habe ich seit gestern einen Workaround drin, der das Control nach 15 Sekunden nach Reload neu zeichnet, damit die Symbole erscheinen. Wenn du ein Update machst, probiere danach mal aus, ob es auch bei dir hilft.
Guten Morgen setstate.
Testzeit: 15 Minuten... bei jedem Reload wurden die Icons des HomeStatus sauber geladen. Bis jetzt also nicht wieder aufgetreten.
Zitat von: setstate am 13 November 2015, 08:43:27
soooo, Pagetab setzt jetzt kein On und Off abhängig vom MultiStatus. Damit sollte auch bei 'warn' der Tab nun klickbar bleiben.
Perfekt! Danke dir. Auch für das rückgangig machen der .bigger :)
Hätt ich nen MacBook würd ich's dir schicken ;D freu dich auf dein Weihnachtsgeschenk :P
Zitat
Das nesges Button-Widget scheint nicht mehr zu funktionieren.
Mit dem Pagebutton müsste es aber klappen
@setstate: Hab vielen Dank für deine schnelle Hilfe! Damit komme ich weiter. So macht das richtig Spaß!!
Zitat von: l3skon3 am 30 Oktober 2015, 09:19:01
besten Dank. Es klappt mit runden Icons super! Bin jetzt am Probieren ob ich meine eckigen Icons und ein label darunter bekomme.
Würde das CircleMenu auch gerne mit Eckigen Buttons und Horizontal haben.
hat da jemand schon nen Ansatz wie das funktioniert? meine hier irgendwo mal nen Screenshot gesehen zu haben aber ich finde das nicht wieder hier im Forum.
mit fa-square als background icon werden die ecken abgerundet.
Hallo remet,
das geht tatsächlich nicht.
Ich werden mal versuchen, die eingesetzte Lib etwas zu verbiegen, dass das möglich sein wird.
setstate
Hi Tedious,
Zitat von: Tedious am 12 November 2015, 16:02:10
Frage an die HTML-Profis - es gibt ja das HTML5 <audio> Tag - ließe sich das hier einbauen? Oder liefert das immer einen "Player", der erst angeklickt werden muss? Muss gestehen meine HTML-Kentnisse sind eher als basal zu bezeichnen, aber kann ich beim eintreten eines Events einfach ein MP3 abspielen lassen? Wenn ja würde das meine Probleme sehr einfach lösen...?!
Du kannst beim Element audio ein
autoplay setzen.
<audio autoplay>
<source src="coolersound.mp3" type="audio/mpeg">
</audio>
Siehe: http://www.w3schools.com/tags/att_audio_autoplay.asp (http://www.w3schools.com/tags/att_audio_autoplay.asp)
Gruß
Stefan
Zitat von: setstate am 13 November 2015, 07:44:48
Hallo Felix,
zumindest habe ich seit gestern einen Workaround drin, der das Control nach 15 Sekunden nach Reload neu zeichnet, damit die Symbole erscheinen. Wenn du ein Update machst, probiere danach mal aus, ob es auch bei dir hilft.
Danke
Hallo setstate,
danke Dir!!! Der Workaround funktioniert. Wenn man jetzt noch erkennen könnte, wann die Seite geladen bzw. vollständig dargestellt ist, müsste man nicht die ganzen 15 Sekunden warten. Keine Ahnung, ob das geht.
Viele Grüße
Felix
Hallo Leute,
ich habe zwei Fragen:
1.gibt es einen einfachen weg Readinggroups anzuzeigen?
2.kann ich einfach den die fb_calllist anzeigen lassen?
Danke und Gruß Robert
zu frage 1.)
<header>KALENDER</header>
<div
data-type="readingsgroup"
data-device="rg.TermineView"
data-get="all"
data-max-update="3600">
</div>
und zu 2.)
<header>ANRUFE</header>
<table border="0px" width="100%" class="top-space">
<tr >
<td class="RandUnten">
<div data-type="label" data-device="myTM" data-get="C0" class=""></div>
<div data-type="label" data-device="myTM" data-get="D0" class=""></div>
</td>
<td class="RandUnten">
<div data-type="label" data-device="myTM" data-get="B0" class=""></div>
</td>
<td class="RandUnten"><div data-type="label" data-device="myTM" data-get="E0" class=""></div></td>
<td class="RandUnten">
<div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-phone","fa-phone","fa-phone","fa-phone"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
></div>
</div>
<div data-type="symbol" data-device="myTM"
data-get="A0"
data-icons='["fa-arrow-circle-left","fa-arrow-circle-right","fa-arrow-circle-left","fa-arrow-circle-right"]'
data-get-on='["incoming","outgoing","incoming_noconnect","outgoing_noconnect"]'
data-on-colors='["green","green","red","red"]'
>
</div>
</td>
</tr>
</table>
ist für die erste Zeile der calllist einfach mit C1, D1...erweitern bis die gewünschte anzahl Anrufe drin sind.
der Vollständigkeit halber in die fhem-tablet-ui-user.css:
.RandUnten {
border-collapse: collapse;
border-bottom: 1px solid #FF8450;
}
Gruß Rolf
Guten abend,
ich möchte mich auch mal für das tolle UI Framework bedanken.
Ich habe jetzt auch mal eine Frage, nachdem ich jetzt schon einige Wochen damit rumgespielt habe - es geht um einen Color-Picker in Form des "hue-tick mini wider" - ich setze allerdings keine Hue ein, sondern eine Lampe die entweder mittels "wcrgb" Farbwerte in Form von 0-255 für w(arm) c(old) r(ed) g(reen) b(lue) erwartet oder mittels rgb einen HEX wert von 000000 bis FFFFFF.
Meine Frage ist jetzt relativ einfach - wie bringe ich dem widget eine der beiden Varianten bei?
Habt ihr ne Idee? Welches alternative Widget kann ich dafür verwenden, wenn obiges nicht funktioniert?
Vielen Dank
Galdo
@harry86
Danke für deine Hilfe.
Was bei mir jetzt noch nicht stimmt ist dass die Readinggroups ICONs sehr sehr groß angezeigt werden.
Das mit dem Calllist habe ich noch nicht ausprobiert.
Hallo,
ich habe heute mal Tablet-Ui geupdated und seitdem funktioniert bei mir irgendwie nichts mehr.
Also selbst die normale FHEM Weboberfläche hängt nach 1-2 Minuten.
Ich habe heute rein gar nichts anderes getan außer das update. Und Eine Minute vorm Update ging auch noch alles.
Im Log File kommt leider keinerlei Meldungen.
Ist das irgendwie erklärbar?
Ich hatte ansonsten vorher meinen kompletten fhem Ordner gesichert. Kann ich diesen einfach wieder rüberspielen oder sind weitere Ebenen weiter oben ebenfalls durch das update betroffen?
Bin komplett ratlos.
Lg
Hab den Fehler gefunden.
Die Readinggroups nehmen die Value Icons welche ich der Readinggroup zugewiesen habe.
Diese werden dann über dimensional angezeigt.
Zitat von: no_Legend am 13 November 2015, 22:53:43
Hab den Fehler gefunden.
Die Readinggroups nehmen die Value Icons welche ich der Readinggroup zugewiesen habe.
Diese werden dann über dimensional angezeigt.
Kannst du uns bitte an der Lösung teilhaben lassen?
Sorry falsch ausgedrückt. Eigentlich nur die Ursache.
Sobald du die Value Icon Einstellung entfernt bekommst du die readinggroup ohne icons, als Text angezeigt.
Zitat von: galdo am 13 November 2015, 21:26:03
Guten abend,
ich setze allerdings keine Hue ein, sondern eine Lampe die entweder mittels "wcrgb" Farbwerte in Form von 0-255 für w(arm) c(old) r(ed) g(reen) b(lue) erwartet oder mittels rgb einen HEX wert von 000000 bis FFFFFF.
Meine Frage ist jetzt relativ einfach - wie bringe ich dem widget eine der beiden Varianten bei?
Ich habe das z.B. so:
<div data-type="label" class="">Stern</div>
<div
data-type="volume"
data-device="star"
data-min="0"
data-max="360"
data-get="rgb"
data-set="rgb"
class="hue-tick top-space rgb small"
></div> Gruß
Martin
Hallo setstate,
ich habe heute versucht ein bei mir exitierendes Circlemenue auf horizontale Ausrichtung umzubauen.
Die Icons werden auch horizontal angezeigt, allerdings fehlt immer das erste definierte Icon.
Zitat von: setstate am 07 November 2015, 20:47:02
Neu: Circlemenu kann jetzt auch vertikal oder horizontal ausgeklappt werden.
data-direction="horizontal"
data-circle-radius="60"
Damit ist die Liste für data-direction jetzt:
top | right | bottom | left | top-right | top-left | bottom-right | bottom-left | top-half | right-half | bottom-half | left-half | full | vertical | horizontal
Anbei noch der von mir verwendete code
<div data-type="circlemenu" class="cell circlemenu" data-direction="horizontal" data-circle-radius="60">
<ul class="menu">
<li><div data-type="symbol"
data-icon="fa-fire"
data-on-background-color="rgb(111,69,120)"
data-on-color="rgb(255,255,255)"
data-background-icon="fa-circle">
</div>
</li>
<li><div data-type="button"
data-on-background-color="rgb(153,204,0)"
data-url="raspi-julian.html"
data-icon="fa-male"
data-on-color="white">
</div></li>
<li><div data-type="button"
data-on-background-color="rgb(71,163,117)"
data-url="raspi-johanna.html"
data-icon="fa-female"
data-on-color="white">
</div></li>
</ul>
</div>
Irgendweine Idee was da schief läuft?
Danke vorab.
Gruß
Gerald
Hallo Gerald,
beim ersten Element (Symbol) fehlt
data-off-color="#2a2a2a".
Da das Element immer OFF bleibt, weil ja kein Device angegeben ist, das ON liefern könnte. Und die Vordergrund-Farbe für OFF ist auch #505050, wie der Hintergrund, darum sieht es so aus, als sein das Icon weg.
Hallo,
ich bin neu in dieses Thema eingestiegen und bin begeistert.
Vielen dank für die tolle Arbeit die ihr hier leistet.
Nun möchte ich für meine Rollos nur den Befehl auf und ab verwenden, funktioniert auch.
<div data-type="push" data-device="Jalousie_1"
data-icon="fa-chevron-up" data-background-icon="fa-square-o"
data-set="off">
</div>
<div data-type="push" data-device="Jalousie_1"
data-icon="fa-chevron-down" data-background-icon="fa-square-o"
data-set="on">
</div>
Jetzt meine Frage, wie kann ich es machen damit das Icon nach betätigen den Status (Farbe) ändert um zu sehen ob es oben oder unten ist?
Bin schon seit gestern am probieren und bekomme es nicht hin.
Danke im Voraus
Gruß
Mario
Der Ansatz wäre hier einen Switch zu verwenden, denn nur der kann den Status an/aus wirklich darstellen.
Das Ergebnis könnte dann so ähnlich wie hier sein:
<div data-type="switch" data-device="Jalousie_1"
data-icon="fa-chevron-up" data-background-icon="fa-square-o"
data-set="off" data-get-on="open" data-get-off="closed" data-get="state">
</div>
<div data-type="switch" data-device="Jalousie_1"
data-icon="fa-chevron-down" data-background-icon="fa-square-o"
data-set="on" data-get-on="closed" data-get-off="open" data-get="state">
</div>
So sehe ich das auch
<div data-type="switch" data-device="dummy1"
data-icon="fa-chevron-up" data-background-icon="fa-square-o"
data-set-on="off" data-set-off=""
data-get-on="off" data-get-off="on"
data-on-color="orange"
data-off-color="#222"
data-on-background-color="#505050"
data-off-background-color="#505050">
</div>
<div data-type="switch" data-device="dummy1"
data-icon="fa-chevron-down" data-background-icon="fa-square-o"
data-set-on="on" data-set-off=""
data-get-on="on" data-get-off="off"
data-on-color="orange"
data-off-color="#222"
data-on-background-color="#505050"
data-off-background-color="#505050">
</div>
Ich habe schon seit einiger Zeit das Problem, das die Slider nicht korrekt initialisieren beim ersten Laden bzw. beim Reload (über Browserbutton). Nachvollziehbar unter Windows Firefox (42) und Windows Chrome
Nichtinitialisieren heisst bei mir die Slider stehen ganz unten im negated fall (also ganz oben im Normalfall) und das Label zeigt "NaN" also "Not a number".
Es löst sich sofort, wenn ich zwischen verschiedenen Räumen umschalte (pagetabs) also ist es nur im ersten Fall falsch, danach tritt es erst wieder auf, wenn ich einen reload anstosse.
Verschiedene Debugausgaben im widget_slider.js haben mich nicht weitergebracht.
Ich weiss schon, dass der Text und Wert im update richtig gesetzt wird, aber dann scheint noch irgendetwas den Wert zu überschreiben...
Im letzten Update gab es einen Fix dazu. Hast du die Version im Einsatz?
Danke euch Beiden für die Ansätze, ich werde noch viel lernen müssen :)
Leider ändert sich der Status des Runterbotton nicht beim öffnen und umgekehrt, gibt es dafür eine Möglichkeit?
Immer diese Newbies mit ihren Problemen. ;)
Gruß
Mario
Ja die Version ist von gestern (über update all) - die Änderungen aus dem commit vongestern (Improved refresh behaviour of level and slider) sind drin.
Ich habe inzwischen noch mehr debugs eingebaut und stelle interessanterweise fest, dass der "NaN"-Wert im callback des Powerange gesetzt wird.
Aus meinen Debugs ergibt sich folgendes Bild:
in update slival : 0 jquery.... > eval (line 64)
in update slival : NaN jquery.... > eval (line 64)
Current lstate : open for device roll_wz_1 jquery.... > eval (line 155)
Current nstate : open for device roll_wz_1 jquery.... > eval (line 156)
Checked nstate : 0 for device roll_wz_1 jquery.... > eval (line 161)
set text tstate : open for device roll_wz_1 jquery.... > eval (line 177)
..... dann nach weiteren Anfragen an fhem kommt:
in update slival : NaN jquery.... > eval (line 64)
Der letzte Aufruf mit dem "NaN" steht im callback (Achtung Zeilennummern passen natürlich wg. debug-Ausgaben nicht)
ich vermute fast es hängt mit dem Einblenden des pagetabs zusammen (damit gab es schonmal Probleme)
Trotzdem ist mir unklar, wo der Wert NaN in slival herkommt...
Zitat von: Marst am 14 November 2015, 17:42:47
Danke euch Beiden für die Ansätze, ich werde noch viel lernen müssen :)
Leider ändert sich der Status des Runterbotton nicht beim öffnen und umgekehrt, gibt es dafür eine Möglichkeit?
Immer diese Newbies mit ihren Problemen. ;)
Gruß
Mario
Das sollte gehen, wenn Du in data-get-off den Zustand angibst, der gültig ist, wenn das Rollo nicht mehr in dem Zustand ist. Möglicherweise musst Du da mit regular expressions arbeiten, damit Du alle Zustände erfasst, die den Button deaktivieren sollen also z.B.
data-get-off="open|moving|sonstwas"Nur wenn das auf den Zustand passt wird der Button deaktiviert, ansonsten bleibt einfach der aktuelle Zustand erhalten.
Daselbe gilt natürlich auch für den anderen Switch...
Johannes
@viegener: Das Problem ist, dass pwrng.slider.offsetHeight 0 ist, weil das Control noch nicht gezeichnet ist, bzw. noch hidden ist.
console.log('offsetHeight',pwrng.slider.offsetHeight);
setTimeout(function(){
pwrng.setStart(parseInt(v));
}, 50);
setze mal die Zeit auf 10000, ob es dann immer klappt
Zitat von: setstate am 14 November 2015, 18:32:59
@viegener: Das Problem ist, dass pwrng.slider.offsetHeight 0 ist, weil das Control noch nicht gezeichnet ist, bzw. noch hidden ist.
console.log('offsetHeight',pwrng.slider.offsetHeight);
setTimeout(function(){
pwrng.setStart(parseInt(v));
}, 50);
setze mal die Zeit auf 10000, ob es dann immer klappt
Ja ich hatte den "Hack" gesehen, und mit 10000 klappt es prinzipiell auch, das hatte mir aber nicht gefallen, denn ich habe auch zusätzlich ein recht altes Tablet, auf dem ich FTUI benutze und da müsste ich dann wirklich 10000 verwenden :D
Wäre es nicht denkbar die Veränderung der Sichtbarkeit zu verwenden, um den Wert nochmals zu setzen?
sauber wäre, auf die richtige Höhe zu warten, bevor das erste Mal der Wert gesetzt wird. Das ist aber mit JS nicht so easy.
so etwa müsste man es machen.
function checkHeight()
{
if ( pwrng.slider.offsetHeight > 0 )
{
pwrng.setStart(parseInt(v));
}
else
{
window.setTimeout("checkHeight();",100);
}
}
Am besten noch mit einem Zähler der max. Wartezeit
Ich habe noch eine andere Lösung, statt fadeIn und fadeOut wird fadeTo(0) bzw. fadeTo(1) verwendet (in pagetab).
Dadurch wird verhindert, dass jquery das "hide" durchführt, das wohl die Probleme auslöst, denn hidden-Elemente haben keine "sichtbare" grösse, ich habe mal einen ganz kurzen Test gemacht und könnte das noch sauber ziehen.
Was meinst Du
Johannes
Ich habe gerade einen Pull-request #124 mit der Änderung (pagetab und slider) reingestellt. Vielleicht ist das ja eine dauerhaftere Lösung...
Hi,
Zitat von: setstate am 29 September 2015, 20:16:46
Das schaue ich mir noch an. Ich denke, es wird ein neues Widget werden müssen
Das bezog sich darauf, dass Wifilight beim Farbwechsel im Tablet UI (im Gegensatz zum WEBui) die Helligkeit immer auf 100% zurücksetzt, anstatt sie beizubehalten.
Gibt es dafür schon eine Lösung?
Grüße
Martin
Hi!
Zitat von: setstate am 12 November 2015, 09:31:22
ich gebe es zu, Pagetab ist sehr kompliziert und verwirrend, wo was hin muss :-[
Vllt. können wir das noch optimieren, um es einfacher nutzen/aufbauen zu können.
Aber ich versuche nochmal die Nutzung von Pagetab und die Seiten zu erklären:
- Die index.html (Startseite) ist minimal und beinhaltet nur das Menu mit den 1-n Pagetabs
- die per Template eingebundene menu.html enthält die Pagetabs mit den Links zu den Unterseiten
- Ganz oben ist die index_main.html, die zuerst angezeigt wird und die Widgets hat
- Jede Unterseite hat wieder eine Menü-Leiste dabei, die per Template eingebunden wird. Aber, die Unterseiten enthalten keine Header Dateien / CSS links mehr.
index.html -> Header-Files (css/js), Nur ein Gridster-Element zum Import des Templates "menu.html"
menu-html -> eine Liste von Pagetab Widgets mit Links zu den Unterseiten
index_*.html -> Unterseiten mit den eigentlichen Widgets, keine Header-Files, ein Gridster-Element für die menu.html
So, habe das jetzt mal so umgesetzt und es ist wesentlich aufgeräumter. Allerdings habe ich jetzt das Problem, dass beim Anklicken, des Links im FHEM-GUI bzw. beim Aufruf von
http://fhem:8083/fhem/ftui
die Seite eine angeknabberte Version meiner Standard-Oberfläche anzeigt (s. Screenshot). Beim Aufruf über
http://fhem:8083/fhem/ftui/index.html
sieht alles wie gewünscht aus.
Patrick
Zitat von: PatrickR am 15 November 2015, 18:20:36
http://fhem:8083/fhem/ftui
die Seite eine angeknabberte Version meiner Standard-Oberfläche anzeigt (s. Screenshot). Beim Aufruf über
http://fhem:8083/fhem/ftui/index.html
sieht alles wie gewünscht aus.
http://fhem:8083/fhem/ftui/reicht schon^^ der / am ende ist wichtig...
Hi!
Zitat von: roman1528 am 15 November 2015, 18:38:43
http://fhem:8083/fhem/ftui/
reicht schon^^ der / am ende ist wichtig...
Ich unterdrücke mal den starken Drang, die Beweggründe dieses subtilen Features durchschauen zu wollen.
Patrick
Ich habe einen Pullrequest #125 für das widget_calview.js eingestellt.
Zitat von: PatrickR am 15 November 2015, 18:52:33
Hi!Ich unterdrücke mal den starken Drang, die Beweggründe dieses subtilen Features durchschauen zu wollen.
Gute Idee ;D ;D
Zitat von: PatrickR am 15 November 2015, 18:52:33
Hi!Ich unterdrücke mal den starken Drang, die Beweggründe dieses subtilen Features durchschauen zu wollen.
Patrick
Das lässt sich wunderbar umgehen durch einfügen des folgenden Scripts:
<script language="javascript">
if ( document.location.pathname == "/fhem/ftui" ) {
var href = document.location.protocol + "//" + document.location.host + document.location.pathname + "/" + document.location.hash ;
document.location.replace( href );
}
</script>
Wens interessiert, ich erklärs trotzdem: Wenn man den URL
http://fhem:8083/fhem/ftui aufruft befindet man sich eigentlich im Verzeichnis
/fhem damit wird aus einem Aufruf der index.html plötzlich
http://fhem:8083/fhem/index.html (also ohne ftui). Das hat alles eigentlich gar nichts mit FHEM zu tun, sondern einfach mit Pfadnamen wie sie im Web oder auch für lokale Dateien sonstwo verwendet werden. Ohne den abschliessenden / ruft man nur ein Objekt im fhem-Verzeichnis auf und nicht in fhem/ftui.
Für relative Pfadnamen, wie andere Seiten macht es einen grossen Unterschied. Ausserdem gehören nur die Dateien unter ftui/ zum Tablet UI alles andere gehört zu FHEMweb.
Und nun habe ich genug lehrmeisterhaftes von mir gegeben ;)
Zitat von: uniqueck am 15 November 2015, 19:09:27
Ich habe einen Pullrequest #125 für das widget_calview.js eingestellt.
Merged.
Danke
Hi!
Zitat von: viegener am 15 November 2015, 19:30:17
Das hat alles eigentlich gar nichts mit FHEM zu tun, sondern einfach mit Pfadnamen wie sie im Web oder auch für lokale Dateien sonstwo verwendet werden. Ohne den abschliessenden / ruft man nur ein Objekt im fhem-Verzeichnis auf und nicht in fhem/ftui.
Danke für die Erklärung.
Auf die Gefahr hin, zu weit vom Thema abzukommen: Dass das im Web so üblich ist, ist an mir aber die letzten 20 Jahre vorübergegangen. Weder der Apache macht einen Unterschied, ob ich einen Slash anfüge noch tat es der Internet Intrusion Server als ich ihn noch benutzen durfte. Da die Dateisysteme ohnehin in einem Verzeichnis nur entweder ein Unterverzeichnis oder eine Datei pro Namen zulassen, sehe ich auch nicht wirklich einen Grund.
Patrick
Zitat von: setstate am 05 November 2015, 23:00:50
Neues Widget Checkbox
Dieses Control ist nutzbar wie ein Switch, aber rein optisch eher für Setting-Einstellungen nützlich.
<div data-type="checkbox" data-device='myAT'
data-get-on="!off" data-get-off="inactive"
data-set-on="active" data-set-off="inactive"
class="green">
</div>
Nachtrag: gestern habe ich es noch hinbekommen, das Control per "Slide to Change" ändern zu können. Das ist auf Touchdisplays intuitiver zu bedienen.
Vielen Dank für dieses Widget!
Zitat von: PatrickR am 15 November 2015, 19:43:25
Hi!
Danke für die Erklärung.
Auf die Gefahr hin, zu weit vom Thema abzukommen: Dass das im Web so üblich ist, ist an mir aber die letzten 20 Jahre vorübergegangen. Weder der Apache macht einen Unterschied, ob ich einen Slash anfüge noch tat es der Internet Intrusion Server als ich ihn noch benutzen durfte. Da die Dateisysteme ohnehin in einem Verzeichnis nur entweder ein Unterverzeichnis oder eine Datei pro Namen zulassen, sehe ich auch nicht wirklich einen Grund.
Patrick
Führt echt zu weit ab aber vielleicht noch ein einfaches Beispiel. Es geht darum, dass ja immer wieder "relative" Pfade zu anderen Dateien angegeben werden wie zum Beispiel "index.html" oder "image/x.png" und da spielt es eine Rolle von wo aus diese Dateien aufgerufen werden (Dafür wurde mal das base tag in html erfunden)
Wenn ich in
/fhem/ftui bin und eine datei
index.html abrufe kommt
/fhem/index.html raus
Wenn ich in
/fhem/ftui/ bin und eine datei
index.html abrufe kommt
/fhem/ftui/index.html raus
Das ganze hat wie gesagt eigentlich nichts mit dem web / URLs zu tun sondern nur mit relativen Pfadangaben und jetzt bin ich still.
Hey zusammen , irgendwie tue ich mich schwer mit dem Auslagern der Tablet UI , ich finde einfach den Punkt nicht wo ich die IP des FHEm Servers eintragen muss , wenn das UI nicht auf dem FHEM Server läuft . Sorry google schon seit 25 min und denke ihr könnt mir gerade schnell weiter helfen. Vielen Dank !
Eigentlich musst Du nur das Meta-Tag "fhemweb_url" auf den FHEM-Url setzen.
genau das habe ich getan , mit <meta name="fhemweb_url" content="http://IP:8083/fhem">
Aber danach kriege ich im UI nur noch errors :-(
Was für Fehler?
Welchen hostnamen trägst Du ein?
Wenn Du es selber bereits gefunden hattest, verstehe ich die ursprüngliche Frage nicht ::)
Zitat von: dadoc am 14 November 2015, 23:19:13
Hi,Das bezog sich darauf, dass Wifilight beim Farbwechsel im Tablet UI (im Gegensatz zum WEBui) die Helligkeit immer auf 100% zurücksetzt, anstatt sie beizubehalten.
Gibt es dafür schon eine Lösung?
Grüße
Martin
Ich bin an einem neuen Widget dran basierend auf der Farbtastic Lib, da kann man dann den kompletten RBG Raum auswählen und als rbg oder hsl-Wert an FHEM senden.
In der Zwischenzeit habe ich mir mit 3 getrennten Reglern geholfen, um alles reglen zu können. Siehe HTML Code:
<li data-row="4" data-col="2" data-sizex="6" data-sizey="6">
<header>PHILIPS</header>
<div class="top-narrow-2x">
<div class="centered inline">
<div data-type="volume" data-device="HUEDevice1" data-min="0" data-max="65353" data-get="hue" data-set="hue" class="hue-tick small top-space-3x" ></div>
<div data-type="label" class="narrow">Color</div>
<div data-type="volume" data-device="HUEDevice1" data-min="0" data-max="100" data-get="pct" data-set="pct" data-tickstep='4' class="dim-tick small top-space-3x" ></div>
<div data-type="label" class="narrow">Helligkeit</div>
<div data-type="volume" data-device="HUEDevice1" data-min="0" data-max="254" data-get="sat" data-set="sat" data-tickstep='4' class="dim-tick small top-space-3x" ></div>
<div data-type="label" class="narrow">Sättigung</div>
</div>
<div class="right inline top-space-3x">
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="44295" data-off-background-color="#3333dd" data-off-color="#3333dd" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">blau</div>
</div>
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="20695" data-off-background-color="#33dd33" data-off-color="#33dd33" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">grün</div>
</div>
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="0" data-off-background-color="#dd4444" data-off-color="#dd4444" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">rot</div>
</div>
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="hue" data-set-on="9800" data-off-background-color="#cccc44" data-off-color="#cccc44" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">gelb</div>
</div>
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="rgb" data-set-on="666666" data-off-background-color="#666666" data-off-color="#666666" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">weiß</div>
</div>
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="rgb" data-set-on="aaaaaa" data-off-background-color="#aaaaaa" data-off-color="#aaaaaa" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">weiß</div>
</div>
<div>
<div data-type="push" data-device="HUEDevice1" data-icon="fa-lightbulb-o" data-set="rgb" data-set-on="ffffff" data-off-background-color="#ffffff" data-off-color="#ffffff" class="inline" ></div>
<div data-type="label" class="narrow w2x left-align inline">weiß</div>
</div>
</div>
</div>
</li>
Hi setstate,
wie schafft man es mehrere level-wigets ganz eng nebeneinander zu packen? Im Extremfall ohne Abstand ?
und wenn ich gerade schon einen Wunsch für Level habe, dann gleich noch einer: könnte man das Widget so erweitern, dass auch der Anfang des "Balkens" von einem Reading gesteuert wird? Ich würde damit gerne jeweils einen Min- und Max-Wert darstellen
Hallo,
ich verwende derzeit die GUI ind Verbindung mit WebViewControl und dem Samsung Galaxy Tab 4.
Nun bin ich auf der Suche nach einer Outdoor-Cam, welche ein LIVE-Bild (kein Screenshot) in der GUI im WVC als Dialog anzeigen kann.
Meine derzeitige verwendet zum Streamen rtsp, was mit VLC-Plugin auf dem PC ganz gut funktioniert, aber leider nicht auf dem Tablet.
Kann jemand eine(n) Hersteller/Kamera empfehlen, welcher genau diese Anforderungen erfüllt?
Danke
Sascha
Zitat von: pernodjaegermeister am 17 November 2015, 20:26:01
Meine derzeitige verwendet zum Streamen rtsp, was mit VLC-Plugin auf dem PC ganz gut funktioniert, aber leider nicht auf dem Tablet.
Gleiche Situation habe ich auch. Hab eine günstige PTZ-Kamera in China geschossen, nur braucht die zwingend ein Plug-in wegen dem RTSP.
Funzt am PC, aber nicht auf dem RasPi.
Eine Empfehlung für eine IP-Cam, "nachtsichtfähig" wär deshalb auch von mir seeehr gewünscht...
Zitat von: Nobby1805 am 17 November 2015, 10:45:05
wie schafft man es mehrere level-wigets ganz eng nebeneinander zu packen? Im Extremfall ohne Abstand ?
Das habe ich inzwischen durch eine Modifikation in der user.css hinbekommen
.level_vertical{
margin:10px 0px 0px -5px !important;
}
Zitat von: Nobby1805 am 17 November 2015, 10:45:05
und wenn ich gerade schon einen Wunsch für Level habe, dann gleich noch einer: könnte man das Widget so erweitern, dass auch der Anfang des "Balkens" von einem Reading gesteuert wird? Ich würde damit gerne jeweils einen Min- und Max-Wert darstellen
aber hier habe ich den Eindruck, dass das letztlich eine Änderung im Powerange-Modul erfordert ... und das habe ich bisher absolut nicht verstanden :( ich bin mir auch nicht sicher, ob man dafür nicht lieber ein eigenes Widget spendieren sollte
Hallo Nobby1805,
okay, ich wollte auch gerade nachsehen ...
Beim Powerange könnte man noch Min und Max Wert als Label anzeigen, deswegen ist das Control von Haus aus so breit.
Ich werde deine CSS Part mit als Class 'narrow' für Level aufnehmen.
Ja, das Control mit Min und Max Pegel könnte man mit drei-vier DIVs und etwas CSS Voodoo schneller neu bauen, als das Powerange umzubauen.
Wieso nicht einfach als Tabelle einbauen?
Moin Moin,
ich habe ein paar Fragen/Featurerequests zum widget_calview:
a) kann man die Termine linksbündig anzeigen bzw das Alignment ändern?
b) ich Vermisse optional die Sourceanzeige falls man mehrer Kalender in einem View anzeigen möchte.
c) die Uhrzeit ohne Sekundenanzeige wäre schick
VG
Thorsten
Zitat von: Tedious am 19 November 2015, 09:08:24
Wieso nicht einfach als Tabelle einbauen?
wie meinst du das ?
Also bei mir werden die Termine Linksbündig angezeigt, mit dem Style cell centered fullsize top-space.
Welche Uhrzeit meinst du denn? Start und Endezeit? Hier wären denke ich mal ein paar Bilder hilfreich.
Wie soll denn die Uhrzeit dargestellt werden. dd.mm.yyyy hh:mm - dd.mm.yyyy hh:mm <TerminName> oder anders?
Wo soll, denn der Kalender Name angezeigt werden?
Zitat von: Tratonis am 19 November 2015, 20:06:33
Moin Moin,
ich habe ein paar Fragen/Featurerequests zum widget_calview:
a) kann man die Termine linksbündig anzeigen bzw das Alignment ändern?
b) ich Vermisse optional die Sourceanzeige falls man mehrer Kalender in einem View anzeigen möchte.
c) die Uhrzeit ohne Sekundenanzeige wäre schick
VG
Thorsten
Hallo,
ich versuche einen Schalter für die Garage zu definieren, scheitere aber leider an der Darstellung. Ich habe einen Türöffnungssensor für den Status der Garage (Homematic HM-SEC-SC), den ich als Device für meinen Switch nehmen möchte.
Wenn die Garage offen ist, dann soll das Symbol gelb sein mit einer offenen Garage als Bild und wenn sie geschlossen ist, dann grau mit geschlossener Garage.
Außerdem muss bei klick auf den Switch ein anderer Befehl ausgeführt werden, da mein Sensor das Tor ja nicht öffnen kann, also "set HM_RelaisKeller_01 on-for-timer 0.5"
Vielleicht könnt ihr mir helfen, danke.
Gruß,
Bernd
Zitat von: speridal am 20 November 2015, 16:15:31
Hallo,
ich versuche einen Schalter für die Garage zu definieren, scheitere aber leider an der Darstellung. Ich habe einen Türöffnungssensor für den Status der Garage (Homematic HM-SEC-SC), den ich als Device für meinen Switch nehmen möchte.
Wenn die Garage offen ist, dann soll das Symbol gelb sein mit einer offenen Garage als Bild und wenn sie geschlossen ist, dann grau mit geschlossener Garage.
Außerdem muss bei klick auf den Switch ein anderer Befehl ausgeführt werden, da mein Sensor das Tor ja nicht öffnen kann, also "set HM_RelaisKeller_01 on-for-timer 0.5"
Vielleicht könnt ihr mir helfen, danke.
Gruß,
Bernd
Genau dasselbe Szenario versuche ich auch gerade...leider bisher ohne Erfolg.
Zitat von: speridal am 20 November 2015, 16:15:31
Wenn die Garage offen ist, dann soll das Symbol gelb sein mit einer offenen Garage als Bild und wenn sie geschlossen ist, dann grau mit geschlossener Garage.
Ich kenne jetzt deine Status und deine Icon-Namen nicht, aber so ähnlich könnte man das definieren (Multi-State-Schreibweise nötig, weil Icons geändert werden sollen):
<div data-type="switch" data-device="MySensor"
data-states='["on","off"]'
data-icons='["fa-car","fa-archive"]'
data-colors='["#333","#333"]'
data-background-colors='["#aa6900","#555"]'
class="cell big">
</div>Zitat von: speridal am 20 November 2015, 16:15:31
Außerdem muss bei klick auf den Switch ein anderer Befehl ausgeführt werden, da mein Sensor das Tor ja nicht öffnen kann, also "set HM_RelaisKeller_01 on-for-timer 0.5"
Probiert mal ein zusätzliches
data-fhem-cmd="set HM_RelaisKeller_01 on-for-timer 0.5"
Zitat von: uniqueck am 20 November 2015, 00:11:06
Also bei mir werden die Termine Linksbündig angezeigt, mit dem Style cell centered fullsize top-space.
Welche Uhrzeit meinst du denn? Start und Endezeit? Hier wären denke ich mal ein paar Bilder hilfreich.
Wie soll denn die Uhrzeit dargestellt werden. dd.mm.yyyy hh:mm - dd.mm.yyyy hh:mm <TerminName> oder anders?
Wo soll, denn der Kalender Name angezeigt werden?
Das mit dem Style klappt nicht, weder : cell centered fullsize top-space noch cell left fullsize top-space
<li data-row="1" data-col="2" data-sizex="5" data-sizey="3">
<header><font size="+1">Termine</font></header>
<table>
<tr>
<td width="33%"><header><font size="+1">Anne</font></header></td>
<td width="33%"><header><font size="+1">Thorsten</font></header></td>
<td width="33%"><header><font size="+1">Kinder</font></header></td>
</tr>
<tr><td colspan=3><header>heute</header></td></tr>
<tr>
<td valign="top"><div data-type="calview" data-device="Termine_Anne" data-get="today" data-max="15" class="cell left fullsize top-space"></div></td>
<td valign="top"><div data-type="calview" data-device="Termine_Thorsten" data-get="today" data-max="15" class="cell left fullsize top-space"></div></td>
<td valign="top"><div data-type="calview" data-device="Termine_Kinder" data-get="today" data-max="15" class="cell left fullsize top-space"></div></td>
</tr>
<tr><td colspan=3><header>morgen</header></td></tr>
<tr>
<td valign="top"><div data-type="calview" data-device="Termine_Anne" data-get="tomorrow" data-max="15" class="cell left fullsize top-space"></div></td>
<td valign="top"><div data-type="calview" data-device="Termine_Thorsten" data-get="tomorrow" data-max="15" class="cell left fullsize top-space"></div></td>
<td valign="top"><div data-type="calview" data-device="Termine_Kinder" data-get="tomorrow" data-max="15" class="cell left fullsize top-space"></div></td>
</tr>
</table>
</li>Das Format hh:mm <optionalKalendername> <TerminName> würde ich gut finden, eventuell könnte man das ja auch konfigurierbar machen.
Zitat von: setstate am 20 November 2015, 18:15:01
Ich kenne jetzt deine Status und deine Icon-Namen nicht, aber so ähnlich könnte man das definieren (Multi-State-Schreibweise nötig, weil Icons geändert werden sollen):
<div data-type="switch" data-device="MySensor"
data-states='["on","off"]'
data-icons='["fa-car","fa-archive"]'
data-colors='["#333","#333"]'
data-background-colors='["#aa6900","#555"]'
class="cell big">
</div>
Probiert mal ein zusätzliches data-fhem-cmd="set HM_RelaisKeller_01 on-for-timer 0.5"
Großartig! Vielen Dank, das klappt wunderbar!
Hallo zusammen,
seit heute funktioniert meine farbliche Anzeige für den Modus meines MAX Thermostat nicht mehr.
ich habe folgendes in meiner html
<div data-type="symbol" data-device="WZ_Thermostat" data-get="mode"
data-get-on='["auto","manual","boost"]'
data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual","fa-spinner fa-pulse"]'
data-on-colors='["#228b22","#ff0000","#0000ff"]' >
</div>
war bisher immer so das das icon farblich je nach "mode" war.
Heute ändert es aber keine Farbe ist immer nur grau...
jemand ne Idee?
Steffen
Hallo zusammen,
ich sitze an meiner FTUI Umsetzung und habe drei Fragen
- Wie kann ich in einem circlemenu die Schriftgröße der pushes verkleinern? Mit class und Co hatte ich noch keinen Erfolg.
- Wie kann ich mit chart oder simplechart Werte aus einem DBLog auslesen. Ich verstehe nicht wie "data-columnspec" bei DBLog aussehen muss.
- Ich möchte in einem Fester in FTUI spezielle StatusInfos ausgeben. Meine Idee war, ein FileLog dazu zu erstellen. Leider bekomme ich es nicht per Label eingebunden/angezeigt. Gibt es Alternativen zum FileLog zur Statusanzeige in FTUI
Danke für eure Infos. Viele Grüße, zYloriC
Hat Niemand das Problem ?
Neueste Version nach /opt/fhem/www/tablet kopiert. Index-example in index umbenannt und schon knallt es mir das Log voll.
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:22 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
2015.11.21 16:48:21 1: Error: has no TYPE
Ich vermute, dein FHEM kennt die Devices und Readings aus der index_example.html nicht.
Nimm mal ein leeres Template (https://github.com/knowthelist/fhem-tablet-ui/blob/master/examples/index_empty.html)und füge ein Widget für eines deiner Devices ein
Danke.
Zitat von: setstate am 18 November 2015, 17:11:59
Ja, das Control mit Min und Max Pegel könnte man mit drei-vier DIVs und etwas CSS Voodoo schneller neu bauen, als das Powerange umzubauen.
Hilfe !!!!
Ich versuche jetzt seit Tagen ein passendes Widget dafür zu bauen ... aber meine Kenntnisse von javascript reichen dafür nicht aus, irgendwas läuft nach jeder Änderung immer wieder schief :-[ ... wer kann mir helfen ?
Zitat von: Nobby1805 am 21 November 2015, 17:49:54
Hilfe !!!!
Ich versuche jetzt seit Tagen ein passendes Widget dafür zu bauen ... aber meine Kenntnisse von javascript reichen dafür nicht aus, irgendwas läuft nach jeder Änderung immer wieder schief :-[ ... wer kann mir helfen ?
Mache ich gerne ...
Zitatkönnte man das Widget so erweitern, dass auch der Anfang des "Balkens" von einem Reading gesteuert wird? Ich würde damit gerne jeweils einen Min- und Max-Wert darstellen
Wie ist der Anwendungsfall genau? Man braucht min, max, value_low und value_high? Und gib mal die Ausgabe von
list deines Devices.
Optisch sieht das Beispiel schon sehr gut aus :) min und max sind Konstanten, value_low und value_high sind readings eines devices
Ich habe mehrere Anwendungsfälle dafür ... hier eine Auszug des list für 2 Beispiele: 1. Wolkendecke, 2. prognostizierte Min und MAx-Temperatur
ZitatInternals:
DEF Essen
INTERVAL 7200
NAME proplanta
NR 277
STATE Tmin: 4 Tmax: 8 T: 3.4 H: 95.1 W: 14.4 P: 999.9
TYPE PROPLANTA
URL http://www.proplanta.de/Wetter/Essen-Wetter.html
URL2 http://www.proplanta.de/Wetter/profi-wetter.php?SITEID=60&PLZ=Essen&STADT=Essen&WETTERaufrufen=stadt&Wtp=&SUCHE=Wetter&wT=
Readings:
2015-11-21 22:21:08 cloudBaseMax 100
2015-11-21 22:21:08 cloudBaseMin 50
...
2015-11-21 22:21:08 fc0_tempMax 8
2015-11-21 22:21:08 fc0_tempMin 4
dann hätte ich natürlich noch weitere Ideen für Verschönerungen ... z.B. wenn min kleiner Null ist den Balken unterhalb von 0 (falls value_low auch unter Null) in einer anderen Farbe als oberhalb von Null
hier der erste Entwurf zum einem Range Widget, der sicherlich noch ausbaufähig ist ...
Anwendung:
<div class="cell">
<div data-type="range" data-device="AgroWeather" data-low="fc0_tempMin" data-high="fc0_tempMax" data-max="10" data-min="0" class="inline left-space"></div>
<div data-type="range" data-device="AgroWeather" data-low="fc1_tempMin" data-high="fc1_tempMax" data-max="10" data-min="0" class="inline left-space"></div>
<div data-type="range" data-device="AgroWeather" data-low="fc2_tempMin" data-high="fc2_tempMax" data-max="10" data-min="0" class="inline left-space"></div>
</div>
Hallo Mario,
Danke !! Wunderbar !!
Das ist schon fast so wie ich es mir gewünscht habe :)
Ich habe mir das Modul auch angesehen und (hoffentlich) einigermaßen verstanden ... ich glaube, ich weiß jetzt auch woran ich immer gescheitert bin :-X
Einen kleinen Unterschied zu meinen Wünschen gibt es allerdings noch ... die Farbe wird jetzt geändert wenn low kleiner als min ist (blau) bzw. wenn high größer als max ist (rot). Ich hatte es mir so vorgestellt, dass der Balken die Farbe ändert wenn low kleiner als eine Schwelle wird ... also min = -10, Schwelle = 0, Balken orange wenn low>=0, Balken blau wenn low < 0 ... bzw. ganz klasse: wenn low z.B. -3 dann ist der Balken von -3 bis Schwelle, also 0, blau und dann von 0 bis zu high orange
Aber so ist es auch schon toll und ich habe meine Seite schon geändert
Viele Grüße
Norbert
PS der dritte Balken von rechts beginnt bei -1 ... und der Abstand der Balken ist ohne left-space
Hallo an Alle !
Bin dabei einen schönen und bequemen Frontend zuerstellen, um bei einer Viessmann Heizung die Zeiten für Heizung , Warmwasser und Zirkulationspume zu ändern!
http://forum.fhem.de/index.php/topic,20280.840.html (http://forum.fhem.de/index.php/topic,20280.840.html) Antwort #843
Wer hat eine gute Idee oder einen Vorschlag?
Danke
Hallo,
ich wollte gerne das Klimatrend benutzten. Leider zeigt der mir im Frontend keine Pfeile an und stehe jetzt bisschen auf dem Schlauch wo dran das liegen könnten.. Hoffe ihr habt eine Antwort.
Die widget_klimatrend.js habe ich in das js Verzeichnis kopiert
Von AgroWheater habe ich aus der Statistic diesen Wert für Luftdruck hinzugefügt:
pressure
1002.9 2015-11-22 12:27:15
statPressureTendency
1h: +0.3 2h: +1.0 3h: +1.6 6h: +3.7 2015-11-22 11:59:55
Das habe ich meiner index.htl hinzugefügt
<div data-type="klimatrend" data-device="AgroWeather" data-get="statPressureTendency" data-refperiod="1"
data-stagnating-color="rgb(80,80,80)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(80,80,180)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
class="cell small">
</div>
Hallo,
leider bin ich noch nicht weiter gekommen. Es ist sogar noch eine Frage hinzu gekommen:
- Wie schaffe ich es, dass nach einem Label, das einen Wert ausliest und anzeigt mit dem beschreibenden Text in einer Zeile steht. Hier ein Beispiel für den Code, der die Temperatur in 2 Zeilen anzeigt
<div data-type="label" data-device="myWH3080" data-get="Temp-outside" class="darker"></div><div class="darker"> °C draußen</div>Danke für einen Hinweis. Gruß, zYloriC
anbei meine noch offenen Fragen. Hat jemand eine Idee oder einen Link zu nachlesen?? Danke.
- Wie kann ich in einem circlemenu die Schriftgröße der pushes verkleinern? Mit class und Co hatte ich noch keinen Erfolg.
zB: <li><div class="small" data-type="push" data-icon="fa-wrench"></div></li>
<li><div class="small" data-type="push" data-device="hm.jal.eg.arbeit" data-set="on" data-icon="fa-angle-double-up" class="small"></div></li>
<li><div class="small" data-type="push" data-device="hm.jal.eg.arbeit" data-set="halb" data-icon="" style="font-size:80%">1/2</div></li> - Wie kann ich mit chart oder simplechart Werte aus einem DBLog auslesen. Ich verstehe nicht wie "data-columnspec" bei DBLog aussehen muss.
- Ich möchte in einem Fester in FTUI spezielle StatusInfos ausgeben. Meine Idee war, ein FileLog dazu zu erstellen. Leider bekomme ich es nicht per Label eingebunden/angezeigt. Gibt es Alternativen zum FileLog zur Statusanzeige in FTUI
zB: <div data-type="label" log-device="tabInfo-2015-11.log" class="darker"></div><div class="darker"></div>
Zitat von: peterboss am 22 November 2015, 12:16:07
Hallo an Alle !
Bin dabei einen schönen und bequemen Frontend zuerstellen, um bei einer Viessmann Heizung die Zeiten für Heizung , Warmwasser und Zirkulationspume zu ändern!
http://forum.fhem.de/index.php/topic,20280.840.html (http://forum.fhem.de/index.php/topic,20280.840.html) Antwort #843
Wer hat eine gute Idee oder einen Vorschlag?
Danke
Super Idee. Da ich befürchte, dass das hier untergeht, habe ich mal einen extra Thread aufgemacht:
http://forum.fhem.de/index.php/topic,44473.0.html (http://forum.fhem.de/index.php/topic,44473.0.html)
Hoffe, das ist in Deinem Sinne.
Entweder mit data-unit=" C" oder du machst das mit Tabellen
Hier ist beide vereint:
<div class="top-space">
<table border="0px" width="100%">
<tr>
<td><div data-type="label" class="cell1" >Star</div></td>
<td><div data-type="label" data-device="Star" data-get="Diesel" data-unit="€" data-fix="2" class="cell1"></div></td>
</tr>
</table>
</div>
Zitat von: zYloriC am 22 November 2015, 13:33:26
- Wie schaffe ich es, dass nach einem Label, das einen Wert ausliest und anzeigt mit dem beschreibenden Text in einer Zeile steht. Hier ein Beispiel für den Code, der die Temperatur in 2 Zeilen anzeigt
<div data-type="label" data-device="myWH3080" data-get="Temp-outside" class="darker"></div><div class="darker"> °C draußen</div>
http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_bekommt_man_Elemente_nebeneinander_und_.C3.BCbereinander.3F (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_bekommt_man_Elemente_nebeneinander_und_.C3.BCbereinander.3F)
Erfolg ;) ich habe es wahrhaftig selbst geschafft ...
ich definiere einen 3. Balken immer dann wenn min < 0 ist und aktiviere diesen in blau bis zur Oberkante 0 (und gerade Oberkante) wenn low auch kleiner 0 ist
Danke Gunther !
Das ist schon mal ein Anfang!
Vielen Dank!
Was genau zeigst Du damit an?
Hallo einen schönen Sonntag,
ich benötige Hilfe mit dem popup Fenster. Folgendes ist mir nicht klar verständlich bzw. geht nicht:
"Mit Überschreiben der Parameter data-device, data-get, data-get-on und data-get-off kann man sogar das Öffnen und Schließen des Dialogs per FHEM Reading steuern.
Anwendungsfall:
- Türklingel ändert ein Reading in FHEM und auf der UI poppt das Kamerabild der Tür-Cam auf"
Ich habe einen test2 dummy definiert.
Internals:
CFGFN
NAME test2
NR 4892
STATE 1
TYPE dummy
Readings:
2015-11-22 16:39:03 state 1
Attributes:
event-on-change-reading .*
room Panel
webCmd 1:0
Das widget wie folgt:
<div data-type="popup" data-height="400px" data-width="400px">
<div data-type="label"
data-device="test2"
data-get-on='["1","0"]'
class="big">
</div>
<div class="dialog">
<header>Wetter</header>
<div data-type="image"
data-url="http://niederschlagsradar.de/image.ashx?type=regioloop®io=sbr&j=&m=&d=&mi=&uhr=&bliksem=0&voor=&srt=loop1stunde&tijdid=201510131946"
data-size="100%">
</div>
</div>
</div>
Wenn sich der state des dummy von 0 auf 1 ändert geht leider kein popup Fenster auf. Wo könnte mein Fehler liegen?
Schöne Grüsse und vorab schon Danke für Eure Hilfe
ich baue gerade meine ui auf pagebuttons um da mit Pagetab und data-template nicht sonderlich zufriedenstellend arbeiten (seiten laden erst beim x. mal volständig usw).
wie kann ich in der index.html sagen das der pagebutton, der auf die index.html verweist, aktiv ist, also bereits geklickt wurde?
Danke!
Zitat von: marko67 am 22 November 2015, 16:48:25
...
ich benötige Hilfe mit dem popup Fenster. Folgendes ist mir nicht klar verständlich bzw. geht nicht:
"Mit Überschreiben der Parameter data-device, data-get, data-get-on und data-get-off kann man sogar das Öffnen und Schließen des Dialogs per FHEM Reading steuern.
Anwendungsfall:
- Türklingel ändert ein Reading in FHEM und auf der UI poppt das Kamerabild der Tür-Cam auf"
.......
Das widget wie folgt:
<div data-type="popup" data-height="400px" data-width="400px">
<div data-type="label"
data-device="test2"
data-get-on='["1","0"]'
class="big">
</div>
<div class="dialog">
<header>Wetter</header>
<div data-type="image"
data-url="http://niederschlagsradar.de/image.ashx?type=regioloop®io=sbr&j=&m=&d=&mi=&uhr=&bliksem=0&voor=&srt=loop1stunde&tijdid=201510131946"
data-size="100%">
</div>
</div>
</div>
Wenn sich der state des dummy von 0 auf 1 ändert geht leider kein popup Fenster auf. Wo könnte mein Fehler liegen?
Schöne Grüsse und vorab schon Danke für Eure Hilfe
Keine Multi-State-Schreibweise (Array) beim Popup! Man muss das so angeben:
data-get-on="1" data-get-off="0"
Außerdem brauchst du unbedingt ein Objekt, dass den Dialog per Klick öffnen lässt. Ansonsten funktioniert der Auto-Open Code leider nicht:
ZitatBasic structure for a popup:
<div data-type="popup" data-height="150px" data-width="250px">
<div><!-- click object to open the popup --></div>
<div class="dialog">
<header>DIALOG</header>
<div><!-- widget(s) inside the popup dialog --></div>
</div>
</div>
Zitat von: chris1284 am 22 November 2015, 18:30:18
ich baue gerade meine ui auf pagebuttons um da mit Pagetab und data-template nicht sonderlich zufriedenstellend arbeiten (seiten laden erst beim x. mal volständig usw).
wie kann ich in der index.html sagen das der pagebutton, der auf die index.html verweist, aktiv ist, also bereits geklickt wurde?
Danke!
Pagebutton wird aktiv, wenn die aktuelle Seite mit der der data-url übereinstimmt. Also muss auf jeder Seite immer das ganze Set von Pagebuttons enthalten sein. Das kann man auch per Template machen, um Wiederholungen zu vermeiden.
Zitat von: setstate am 22 November 2015, 19:34:48
Keine Multi-State-Schreibweise (Array) beim Popup! Man muss das so angeben:
data-get-on="1" data-get-off="0"
Außerdem brauchst du unbedingt ein Objekt, dass den Dialog per Klick öffnen lässt. Ansonsten funktioniert der Auto-Open Code leider nicht:
Danke für Deine Antwort. Das mit der Schreibweise hatte ich so und so getestet. Was ist mit " unbedingt ein Objekt, dass den Dialog per Klick öffnen lässt " gemeint??
Ich habe es wie folgt ohne Erfolg geändert:
<div data-type="popup" data-height="400px" data-width="400px">
<div data-type="symbol"
data-icon="oa-message_attention"
data-device="test2"
data-get-on="1"
data-get-off="0"
class="big">
</div>
<div class="dialog">
<header>NIEDERSCHLAGSRADAR</header>
<div data-type="image"
data-url="http://niederschlagsradar.de/image.ashx?type=regioloop®io=sbr&j=&m=&d=&mi=&uhr=&bliksem=0&voor=&srt=loop1stunde&tijdid=201510131946"
data-size="100%">
</div>
</div>
</div>
Bei drücken des Warnsymbols geht das popup auf, aber nicht automatisch bei Änderung des state von test2 von 0 auf 1.
Gruss Marko
Zitat von: setstate am 22 November 2015, 20:14:30
Pagebutton wird aktiv, wenn die aktuelle Seite mit der der data-url übereinstimmt. Also muss auf jeder Seite immer das ganze Set von Pagebuttons enthalten sein. Das kann man auch per Template machen, um Wiederholungen zu vermeiden.
ist es, problem ist nur das beim ersten aufruf index.html nicht in der url auftaucht das die url http://srv01.fritz.box:8083/fhem/ftui/ ist.
kann man wohl nur umgehen wenn man beim ersten mal gleich http://srv01.fritz.box:8083/fhem/ftui/index.html aufruft.
@Marko: data-device und data-get-* auch beim popup hinzufügen, dann kann das auch auf den Status vom Dummy reagieren:
<div data-type="popup" data-height="400px" data-width="400px" data-device="test2"
data-get-on="1"
data-get-off="0">
<div data-type="symbol"
data-icon="oa-message_attention"
data-device="test2"
data-get-on="1"
data-get-off="0"
class="big">
</div>
<div class="dialog">
<header>NIEDERSCHLAGSRADAR</header>
<div data-type="image"
data-url="http://niederschlagsradar.de/image.ashx?type=regioloop®io=sbr&j=&m=&d=&mi=&uhr=&bliksem=0&voor=&srt=loop1stunde&tijdid=201510131946"
data-size="100%">
</div>
</div>
</div>
Zitat von: setstate am 22 November 2015, 21:35:23
@Marko: data-device und data-get-* auch beim popup hinzufügen, dann kann das auch auf den Status vom Dummy reagieren:
<div data-type="popup" data-height="400px" data-width="400px" data-device="test2"
data-get-on="1"
data-get-off="0">
<div data-type="symbol"
data-icon="oa-message_attention"
data-device="test2"
data-get-on="1"
data-get-off="0"
class="big">
</div>
<div class="dialog">
<header>NIEDERSCHLAGSRADAR</header>
<div data-type="image"
data-url="http://niederschlagsradar.de/image.ashx?type=regioloop®io=sbr&j=&m=&d=&mi=&uhr=&bliksem=0&voor=&srt=loop1stunde&tijdid=201510131946"
data-size="100%">
</div>
</div>
</div>
Ein ganz dickes Danke für die gute und schnelle Hilfe.
Marko
Zitat von: Nobby1805 am 22 November 2015, 14:47:00
Erfolg ;) ich habe es wahrhaftig selbst geschafft ...
ich definiere einen 3. Balken immer dann wenn min < 0 ist und aktiviere diesen in blau bis zur Oberkante 0 (und gerade Oberkante) wenn low auch kleiner 0 ist
Na schön !!!
So ist das auch besser visualisiert, damit man schneller sieht, was Sache ist.
Ich habe deine Änderung jetzt auch in meiner Version eingebaut. Aber ohne extra DIVs, nur mit CSS-Color-Gradiant und high Limit.
Ich packe das jetzt alles zusammen und werde es im Laufe des Tages hochladen.
<div class="cell">
<div data-type="range" data-device="AgroWeather" data-low="fc0_tempMin" data-high="fc0_tempMax" data-max="5" data-min="-5" data-limit-low="0" data-limit-high="2" class="inline left-space"></div>
<div data-type="range" data-device="AgroWeather" data-low="fc1_tempMin" data-high="fc1_tempMax" data-max="5" data-min="-5" data-limit-low="0" data-limit-high="2" class="inline left-space nolabels"></div>
<div data-type="range" data-device="AgroWeather" data-low="fc2_tempMin" data-high="fc2_tempMax" data-max="5" data-min="-5" data-limit-low="0" data-limit-high="2" class="inline left-space nolabels"></div>
</div>
Zitat von: chris1284 am 22 November 2015, 21:02:37
ist es, problem ist nur das beim ersten aufruf index.html nicht in der url auftaucht das die url http://srv01.fritz.box:8083/fhem/ftui/ ist.
kann man wohl nur umgehen wenn man beim ersten mal gleich http://srv01.fritz.box:8083/fhem/ftui/index.html aufruft.
ich denke, eine zusätzliche Bedingung fürs Einschalten bringt auch die Lösung:
... || filename==='' && elem_url==='index.html'Ich werde das so noch mit einbauen ...
Zitat von: setstate am 23 November 2015, 14:08:05
...Aber ohne extra DIVs, nur mit CSS-Color-Gradiant und high Limit.
da bin ich ja gespannt wie du das gemacht ... ich sehe schon, da kann ich noch viel lernen ;)
und dann hast du auch noch Labels ergänzt :)
Vielen Dank ...
Hallo,
sind Charts eigentlich auch mit DBLog möglich? Habe dafür noch kein Beispiel gesehen..
Gruß,
SteRa
Ja geht. Habe ich auch letzte Woche nach geguckt. Bei mir ein Diagramm über Feuchte/Co2:
<li data-row="3" data-col="2" data-sizex="5" data-sizey="2">
<header>Hausklima</header>
<div class="fullsize"
data-type="chart"
data-device="logdb"
data-logdevice='["logdb","logdb","logdb","logdb"]'
data-logfile='["HISTORY","HISTORY","HISTORY","HISTORY"]'
data-columnspec='["Umwelt.Feuchte.Schlafen:state","Umwelt.Feuchte.Wohnen:state","Umwelt.Co2.Schlafen:state","Umwelt.Co2.Wohnen:state"]'
data-legend='["Schlafen Feuchte","Wohnen Feuchte","Schlafen Co2","Wohnen Co2"]'
data-style='["ftui l2dash","ftui l3dash","ftui l2dash","ftui l3dash"]'
data-ptype='["lines","lines","lines","lines"]'
data-uaxis='["primary","primary","secondary","secondary"]'
data-yunit="%"
data-ytext="Feuchte (Linie)"
data-yunit_sec="ppm"
data-ytext_sec="Co2 (Striche)"
data-title="Hausklima"
data-minvalue="auto"
data-maxvalue="auto"
data-minvalue_sec="auto"
data-maxvalue_sec="auto"></div>
</li>
Zitat von: stera am 23 November 2015, 19:43:50
Hallo,
sind Charts eigentlich auch mit DBLog möglich? Habe dafür noch kein Beispiel gesehen..
Gruß,
SteRa
So wie ich das FHEM CommandRef verstanden habe, ist die Beschreibung per columnspec die Gleiche und alles andere sollte auch mit FileLog kompatible sein für Abfragen. Ich kann es bei mir nicht probieren, DBLog habe ich nicht am Start.
unter http://forum.fhem.de/index.php/topic,37378.msg353525.html#msg353525 ist ein Beispiel. Funktionieren tut es auf jeden Fall.
@setstage: noch ein minimales Problem bei den range-labels ... ich habe kein Limit-high angegeben (also Default=20) aber mein data-max liegt ebenfalls bei 20,
jetzt werden die Werte mit minimalem Versatz ausgegeben
Brauche eure Hilfe,
Würde gerne alle Batterien Zustände im Tablet Ui anzeigen lassen. Es klappt aber Null...
HIER meine configs:
Fhem cfg:
define battery readingsGroup .*:[Bb]attery\ .*:[Bb]atteryLevel
attr battery notime 1
attr battery room Battery
attr battery valueFormat {return "0" if( $VALUE eq "low" );; return "100" if( $VALUE eq "ok" );; return "25" if( $VALUE < 2.1 );; return "50" if( $VALUE < 2.3 );; return "75" if( $VALUE < 2.5 );; return "100"}
attr battery valueIcon {'battery.0' => 'measure_battery_0@red','battery.100' => 'measure_battery_100@green','Battery.0' => 'measure_battery_0@red','Battery.100' => 'measure_battery_100@green','batteryLevel.0' => 'measure_battery_0@red','batteryLevel.25' => 'measure_battery_25@red','batteryLevel.50' => 'measure_battery_50@orange','batteryLevel.75' => 'measure_battery_75@green','batteryLevel.100' => 'measure_battery_100@green'}
Tabel Ui code:
<div class="cell">Wohnzimmer</div>
<div class="darker">Status</div>
<div data-type="symbol" data-device="wz_termostat"
data-get="Activity"
data-icons='["fa-circle","fa-circle"]'
data-get-on='["alive","dead"]'
data-on-colors='["green","red"]'>
</div><br>
<div class="darker">Batterie</div>
<div data-type="symbol" data-device="wz_termostat"
data-get="battery"
data-icons='["fa-circle","fa-circle"]'
data-get-on='["ok","low"]'
data-on-colors='["green","red"]'
style="font-size:2em">
</div><br>
Die Batterie stände werden bei readingsGroup unter "batterie" auch Angezeigt jedoch im TUi nicht...wo kann der Fehler liegen.
Komme leider nicht weiter.
Gruß
Peter
Hallo Peter,
formell ist alles erst einmal richtig.
Hat dein Thermostat auch die Readings "Activity" und "battery"? Meine Homematic haben "battery" nicht, aber der Fentsersensor. Was bringt "list wz_termostat" im FHEMWEB?
Nimm mal eine neue Seite index2.html und setze nur ein Widget für die Battery drauf. Manchmal spielen falsch konfigurierte Elemente von der Seite rein und verhindern das vollständige Abarbeiten der Seite.
So kann man auch den Batteriestand anzeigen lassen:
<div data-type="symbol" data-device="WohnzimmerHeizung" data-get="batteryLevel"
data-states='["3.[0-9]","2.[789]","2.[456]","2.[123]","((2.0)|([01].[0-9]))"]'
data-icons='["fa-battery-4","fa-battery-3","fa-battery-2","fa-battery-1","fa-battery-0"]'
data-colors='["#505050","#505050","#505050","#ad3333","#ad3333"]'>
</div>
Zitat von: Nobby1805 am 24 November 2015, 00:02:25
@setstage: noch ein minimales Problem bei den range-labels ... ich habe kein Limit-high angegeben (also Default=20) aber mein data-max liegt ebenfalls bei 20,
jetzt werden die Werte mit minimalem Versatz ausgegeben
Da muss man etwas in der ftui_range.css tricksen ;-)
.labelMax{ top:-10px; }
@setstate,
ja,meine HM Elemente besitzen Readings "Activity" und "battery".
ZitatManchmal spielen falsch konfigurierte Elemente von der Seite rein und verhindern das vollständige Abarbeiten der Seite
Volltreffer....cool, ich verneige mich. Mit neu Angelegte und neu konfigurierte Seite werden die Zustände brav Angezeigt (mit gleichen Codes).
Zitat von: setstate am 24 November 2015, 08:53:17
.labelMax{ top:-10px; }
ganz exakt: -9.4px ... dann erscheint die Schrift auch nicht mehr etwas dicker als die anderen
Ich habe da mal eine Frage bevor ich mich näher mit dieser GUI auseinandersetze und sogar ein Tablet kaufe:
- Kann man über FHEM auf den Tablets eine Audio-Wiedergabe initiieren?
- Mir reichen einfache Warn- oder Signaltöne.
Danke für die Hilfe.
Zitat von: FunkOdyssey am 24 November 2015, 11:45:20
- Kann man über FHEM auf den Tablets eine Audio-Wiedergabe initiieren?
- Mir reichen einfache Warn- oder Signaltöne.
Nicht mit der Tablet-UI an sich. Aber prinzipiell ist das möglich, beispielsweise mit dem AMAD-Modul, der Tasker-App usw.
Bei mir läuft FTUI in einem WebViewControl (http://www.fhemwiki.de/wiki/WebViewControll), das kann sprechen:
sowas:
([KinderzimmerFenster] eq "open" and [OutTemp:temp] < 12) (set Tablet ttsSay Kinderzimmer Fenster zu lange offen)
Ich bin völlig neu in der Android-Welt. Ich müsste mich einarbeiten, denn bisher habe ich nur Erfahrungen mit iOS-Geräten.
Ich kann euch auch sagen, was ich vorhabe:
Ich hätte gerne ein Bedienteil für eine "Alarmanlage". Dafür brauche ich Buttons, LEDs und eine Audioausgabe. Dies könnte ich nun aus tausend kleinen HM-Komponenten zusammenkleben, die jedoch in der Summe wahrscheinlich teurer werden, wie ein einfaches Tablet.
Ich stelle mir das so vor:
- Haus wird betreten
- Es ertönt ein Signalton, dass die Alarmanlage scharf geschaltet ist.
- Innerhalb von 60s muss nun das Tablet entsperrt werden (Code-Sperre als Schutz)
- Dann lege ich den Alarm-Dummy um auf "unscharf" um
- und ich höre einen Bestätigungston oder meinetwegen auch eine Sprachausgabe
Schön wäre auch noch, wenn ich vor der Code-Sperre schon sehen könnte, ob die Alarmanlage scharf geschaltet ist. Aber diese Anzeige wird sich ja sicherlich hinter dem Bildschirmschoner verbergen. Das Gerät soll natürlich möglichst wenig Strom verbrauchen. Also lasse ich mir die Scharfschaltung einfach per akustischem Signal nach der Türöffnung bestätigen.
Nachtrag
Auf dem ersten Blick sieht es danach aus, als könnte ich vielleicht sogar den Bildschirmschoner oder ähnliches programmgesteuert aufheben, nachdem die Tür geöffnet wurde. Keine Ahnung aber, ob dann bei einem Android-Gerät noch die Code-Sperre abgefragt wird.
Sollte alles machbar sein. Die Logik passiert zum größten Teil im FHEM, Ausgabe/Eingabe im FTUI.
Töne sollten auch klappen, ich habe gerade mal die Suchmaschine angeworfen: http://stackoverflow.com/questions/29567580/play-a-beep-sound-on-button-click
Sound müsste nur noch als FTUI-Plugin gebaut werden ... ist aber eine kleine Sache
Zitat von: setstate am 24 November 2015, 12:28:36
Sollte alles machbar sein. Die Logik passiert zum größten Teil im FHEM, Ausgabe/Eingabe im FTUI.
Töne sollten auch klappen, ich habe gerade mal die Suchmaschine angeworfen: http://stackoverflow.com/questions/29567580/play-a-beep-sound-on-button-click
Sound müsste nur noch als FTUI-Plugin gebaut werden ... ist aber eine kleine Sache
Gibt es doch schon, oder?
https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/clicksound (https://github.com/nesges/Widgets-for-fhem-tablet-ui/wiki/clicksound)
Nur dass nicht doppelt gearbeitet wird.
Ich hatte eigentlich gedacht, dass FHEM den Clicksound initiiert. Also nicht auf Reaktion eines Touch-Befehls. Dann werde ich mir mal AMAD & WVC anschauen. Danke.
Zitat von: setstate am 24 November 2015, 08:40:13
So kann man auch den Batteriestand anzeigen lassen:
<div data-type="symbol" data-device="WohnzimmerHeizung" data-get="batteryLevel"
data-states='["3.[0-9]","2.[789]","2.[456]","2.[123]","((2.0)|([01].[0-9]))"]'
data-icons='["fa-battery-4","fa-battery-3","fa-battery-2","fa-battery-1","fa-battery-0"]'
data-colors='["#505050","#505050","#505050","#ad3333","#ad3333"]'>
</div>
Mario, kannst Du bitte kurz erläutern, was sich hier im Detail hinter verbirgt? Ich habe nur eine grobe Idee:
data-states='["3.[0-9]","2.[789]","2.[456]","2.[123]","((2.0)|([01].[0-9]))"]'Kann ich simulieren, das eine Batterie in einem dieser "Level" unterwegs ist um zu testen, dass es läuft?
Hallo Gunther,
das sind die Spannungsbereiche in RegEx (http://regexr.com/) Schreibweise.
3.0-3.9
2.7,2.8,2.9
2.4,2.5,2.6
usw.
Man kann sich ein Dummy anlegen und dann damit testen:
data-device="dummy1" data-get="STATE"
Danke!
Und
"((2.0)|([01].[0-9]))"
steht für 1,0-2,0 ?
genau: entweder 2.0 oder 0.0-1.9
| ist das ODER Zeichen
() ist eine Gruppe, wichtig für die ODER Verknüpfung
[] ist eine Auswahl, eines davon muss vorkommen [0-9] ist die Kurzform von [0123456789]
Perfekt, jetzt habe ich auch verstanden! Ist das Perl? ::)
Nein, das sind allgemeine Reguläre Ausdrücke, die gibt es in fast allen Sprachen. FTUI arbeitet auf Clientseite ausschließlich in Javascript.
hier ein Regex Tester Online
https://regex101.com/
Zitat von: FunkOdyssey am 24 November 2015, 11:45:20
... und sogar ein Tablet kaufe:
ich benutze es primär NICHT auf meinem tablet sondern auf dem Desktop ;)
Zitat von: xxsteffenxx am 21 November 2015, 14:32:27
Hallo zusammen,
seit heute funktioniert meine farbliche Anzeige für den Modus meines MAX Thermostat nicht mehr.
ich habe folgendes in meiner html
<div data-type="symbol" data-device="WZ_Thermostat" data-get="mode"
data-get-on='["auto","manual","boost"]'
data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual","fa-spinner fa-pulse"]'
data-on-colors='["#228b22","#ff0000","#0000ff"]' >
</div>
Hat mir hier jemand rat?
Bei meinem PRESENCE Modul klappt das farbliche....
siehe Bilder
war bisher immer so das das icon farblich je nach "mode" war.
Heute ändert es aber keine Farbe ist immer nur grau...
jemand ne Idee?
Steffen
Hallo Steffen,
am Code selbst ist alles okay. Ich vermute wieder, ein anders Element verursacht ein Problem und die Seite wird dadurch nicht vollständig geladen und initialisiert.
Siehe Thema von heute morgen: http://forum.fhem.de/index.php/topic,34233.msg364150.html#msg364150
Hallo,
Danke für den Tipp hab ich gerade versucht; gleiches Ergebnis. aber ich vermute in meiner Index html liegt der Hund begraben,
Hab mir die Index-empty heruntergeladen, der <head> bereich der emtpy und meiner ist ganz verschieden, bzw. mit der empty funktioniert gar nichts.
anbei mal mein <head> teil der Index. Vielleicht siehst du da etwas ungewöhnlich oder falsches.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="120">
<meta name="widget_base_height" content="150">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta name='gridster_disable' content='1'>
<meta http-equiv="Cache-Control" content="no-cache" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/www/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="/fhem/www/pgm2/jquery-ui.min.css" />
<link rel="stylesheet" href="/fhem/www/tablet/css/fhem-tablet-ui-user.css" />
<script type="text/javascript" src="/fhem/www/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/www/tablet/js/fhem-tablet-ui.js"></script>
<script type="text/javascript" src="/fhem/www/pgm2/jquery-ui.min.js"></script>
Zitat von: setstate am 24 November 2015, 08:53:17
Da muss man etwas in der ftui_range.css tricksen ;-)
.labelMax{ top:-10px; }
Zitat von: Nobby1805 am 24 November 2015, 09:39:10
ganz exakt: -9.4px ... dann erscheint die Schrift auch nicht mehr etwas dicker als die anderen
Der exakte Wert für die Trickserei scheint auch noch vom Browser abhängig zu sein :( wäre es nicht besser, die eine Ausgabe ganz zu unterdrücken wenn die beiden Werte gleich sind ?
Guten Abend,
ist es eigentlich möglich, über einen Dummy ein Widget mit Warn zu steuern und dann auch noch unterschiedlich einzufärben?
Also wie folgt:
dummy hat den Wert Wertstoff_6 --> Werstoff Tonne wird in 6 Tagen abgeholt
nächste Woche hat der selbe Dummy dann den Wert Restmuell_6 dann wird in 6 Tagen die Restmuell Tonne abgeholt.
Da wir nur die beiden Tonne hier kennen, wollte ich etwas Platz auf dem Tablet sparen und dachte mir mach ich es mit einem Symbol mit warn Icon, in welchen die Tage angezeigt werden, wann die Tonne abgeholt wird.
<div data-device="dy_Abfall" data-type="symbol" data-get="state" class="bigger warn" data-get-on="["Restmuell_(\d+)","Wertstoff_(\d+)"]" data-on-colors="["#000","#6EB54C"]" data-icon="fa-trash-o"></div>
Wobei ich vermute das das dann beim Auslesen der Werte für das warn Symbol zu Problemen führt, oder?
Hat jemand einen Idee, wie man so etwas sonst lösen könnte.
Zitat von: Nobby1805 am 24 November 2015, 23:15:59
Der exakte Wert für die Trickserei scheint auch noch vom Browser abhängig zu sein :( wäre es nicht besser, die eine Ausgabe ganz zu unterdrücken wenn die beiden Werte gleich sind ?
Du hast Recht, das macht auf jeden Fall mehr Sinn. Werde ich noch ändern ...
Hier eine Demo-Page zum Widget: http://knowthelist.github.io/fhem/tablet/demo_range.html
@uniqueck: vielleicht kannst du die Frage noch genauer erklären. Ich hab deine Absicht noch nicht verstanden ...
Aber, man kann 'warn' auch mit in die data-icons aufnehmen:
<div data-type="symbol" data-device="Eingangstuer"
data-states='["open","closed"]'
data-icons='["ftui-door warn","ftui-door"]'
data-colors='["#999","#555"]' >
</div>
Wenn die Dummy Variable den Wert Wertstoff_6 hat, dann soll das Icon eine grüne Tonne sein und das Warn Symbol soll die 6 zeigen.
Wenn die Dummy Variable den Wert Wertstoff_5 hat, dann soll das Icon eine grüne Tonne sein und das Warn Symbol soll die 5 zeigen.
...
Eine Woche später würden die Werte dann jeweils mit Restmuell_xx beginnen, dann soll das Icon eine schwarze Tonne zeigen und in dem warn Symbol dann wieder die Anzahl der Tage (xx).
Würde das über data-part="2" gehen?
Danke schon einmal für die Hilfe.
Hi,
super Projekt - kurze Frage bevor ich anfange.
Das im ersten Thread beschriebene ist immer noch die korrekte Install Anleitung?
Ja, am Installvorgang hat sich nichts geändert.
Alternativ zur index_example.html kann man auch die leere Seite als Vorlage für die eigene index.html nutzen:
https://github.com/knowthelist/fhem-tablet-ui/blob/master/examples/index_empty.html
Zitat von: uniqueck am 25 November 2015, 00:14:02
Wenn die Dummy Variable den Wert Wertstoff_6 hat, dann soll das Icon eine grüne Tonne sein und das Warn Symbol soll die 6 zeigen.
Wenn die Dummy Variable den Wert Wertstoff_5 hat, dann soll das Icon eine grüne Tonne sein und das Warn Symbol soll die 5 zeigen.
...
Eine Woche später würden die Werte dann jeweils mit Restmuell_xx beginnen, dann soll das Icon eine schwarze Tonne zeigen und in dem warn Symbol dann wieder die Anzahl der Tage (xx).
Würde das über data-part="2" gehen?
Danke schon einmal für die Hilfe.
Aktuell geht das noch nicht, aber dein Vorschlag ist machbar. Aber statt data-part habe ich es data-get-warn genannt, passend zu data-get-on, data-get-off, data-get-value, wie bei vielen anderen Widgets. data-get-warn kann mit RegEx umgehen oder bei Leerzeichen getrennten Werten mit reinen Zahlen, um die Nummer des Teils direkt anzugeben.
<div data-device="dummy1" data-type="symbol"
class="bigger warn"
data-get-on='["Restmuell_.*","Wertstoff_.*"]'
data-on-colors='["#000","#6EB54C"]'
data-icon="fa-trash-o"
data-get-warn=".*(\d+).*">
</div>
Teste mal die widget_symbol.js, dann würde ich das dann so übernehmen.
Hallo!
Das ging zwar nicht an mich, aber die neue Option ist klasse!!!
Bei mir funktioniert es!
Ich nutze jetzt:
data-get-warn="dim(\d+)"
Um bei einem Device (Tahoma Rollo) den Dim-Status anzuzeigen. Prima!
Gruß
Phil
Nachtrag:
Habe ich doch etwas zu früh gefreut:
Es funktioniert, aber der "warn-Wert" wird nicht automatisch aktualisiert in der Tablet-UI. Ich muss die Seite refreshen.
Füge ich ein "Label" ein mit dem gleichen Wert, aktualisiert Longpoll direkt, wenn sich der Wert ändert.
Gruß
Phil
Hallo!
Ich habe noch ein grundsätzliches Problem:
Bei mir werden manchmal nicht alle Elemente (Icons, Widgets) geladen. Ich muss dann aktualisieren, dass der Rest ergänzt wird.
Gleiches gilt auch allgemein für das Longpoll. Die Statusicons sind machmal nicht aktuell, manchmal schon. Bei Labels funktioniert die Aktualisierung, aber bei Icons komischerweise nicht.
Beispiel:
Label mit dem "Dimm-Wert" von einer Leuchte ist immer aktuell
Das Icon, das sich je nach Dimmwert einfärbt oder per "Warn" den Dimmwert anzeigt hängt oft bis zum manuellen Aktualisieren per "F5"
Alternativ kann ich auf Shortpoll gehen. Dann ist immer alles korrekt, aber träge.... Bei Longpoll scheinen einfach nicht alle Widgets den neuen Wert mitzubekommen.
Mit der Brechstange funktioniert es:
In der Datei fhem-tablet-ui.js habe ich den Shortpoll bei aktiviertem Longpoll auf 10s gesetzt ;-)
Ist das ein bekanntes Problem?
Gruß
Phil
Zitat von: Stril am 25 November 2015, 11:05:35
Das ging zwar nicht an mich, aber die neue Option ist klasse!!!
Bei mir funktioniert es!
Ich nutze jetzt:
data-get-warn="dim(\d+)"
Um bei einem Device (Tahoma Rollo) den Dim-Status anzuzeigen. Prima!
Wunderbar, dass es eine breite Nutzung findet :-)
ZitatHabe ich doch etwas zu früh gefreut:
Es funktioniert, aber der "warn-Wert" wird nicht automatisch aktualisiert in der Tablet-UI. Ich muss die Seite refreshen.
Haben das Label und das Symbol das gleich Reading? also data-get="STATE"? nicht einer 'state' und der andere 'STATE'?
Gibt es da Problem immer noch, wenn nur die beiden Widgets auf der Seite sind, also alle anderen Störquellen entfernt sind?
Ansonsten baue mal einen Eventmonitor ein und klick drauf, um zu sehen, was so passiert.
<div data-type="eventmonitor">EM</div>
Hallo!
Die Devices sind eigentlich gleich, nur eben das Eine von Typ "symbol"
Dein Tipp war aber prima.
Komischerweise zeigt der Eventmonitor "STATE", obwohl FHEM "state" zeigt...
Jetzt scheint es zu laufen.
Gruß
Phil
Zitat von: Stril am 25 November 2015, 13:08:14
Ich habe noch ein grundsätzliches Problem:
Bei mir werden manchmal nicht alle Elemente (Icons, Widgets) geladen. Ich muss dann aktualisieren, dass der Rest ergänzt wird.
Gleiches gilt auch allgemein für das Longpoll. Die Statusicons sind machmal nicht aktuell, manchmal schon. Bei Labels funktioniert die Aktualisierung, aber bei Icons komischerweise nicht.
Hallo!
Hast du dazu eventuell noch eine Idee?
Gerade die Wettericons werden oft erst nach einem Refresh geladen.
...hab Dir gerade mal etwas Geld gespendet. Tolle GUI!!
Gruß
Phil
Zitat von: setstate am 15 November 2015, 19:34:32
Merged.
Danke
ich habe hier eine aktuelle Version vom widget_calview.js veröffentlicht die
meiner Originalversion etspricht (inkl nun versionierung, logging und performanceverbesserung) und auch bei mir alles richtig anzeigt http://forum.fhem.de/index.php?topic=19922.msg364894#msg364894
die version von uniqueck enthielt ein paar anpassungen auf seine umgebung / für seine wünsche (jahresberechnung geburtstag meine ich) und lösten bei mir fehlanzeigen bei today und tommorow aus (heute wurde mir zb am pc totensonntag angezigt, am anderen pc buß und beet tag und auf nem tablet nachmal andere werte von denen keiner stimmte)
wie wir die beiden versionen vereinen weiss ich auch (noch) nicht....
Hallo, kurze Anfänger Frage ;)
Gibt es Möglichkeit die schwarzen Abstände zwischen den einzelnen Zellen zu verkleinern oder sogar verschwinden zu lassen?
ja, folgendes oben in den header reinpacken, mindestens in die index.html:
<meta name="widget_margin" content="3">
Spiel mal mit der Zahl
Habe schon probiert, bei mir ohne Funktion :(
Doch, es funktioniert! Danke!!! Habe gerade Probleme mit der Aktualisierung.
Kann ich auch den schwarzen Rahmen um die ganze Oberfläche eliminieren?
Zitat von: chris1284 am 25 November 2015, 18:22:02
ich habe hier eine aktuelle Version vom widget_calview.js veröffentlicht die meiner Originalversion etspricht (inkl nun versionierung, logging und performanceverbesserung) und auch bei mir alles richtig anzeigt http://forum.fhem.de/index.php?topic=19922.msg364894#msg364894
die version von uniqueck enthielt ein paar anpassungen auf seine umgebung / für seine wünsche (jahresberechnung geburtstag meine ich) und lösten bei mir fehlanzeigen bei today und tommorow aus (heute wurde mir zb am pc totensonntag angezigt, am anderen pc buß und beet tag und auf nem tablet nachmal andere werte von denen keiner stimmte)
wie wir die beiden versionen vereinen weiss ich auch (noch) nicht....
Das ist gut ich bin noch nicht dazu gekommen da wieder drüber zu schauen. Ich würde die Altersberechnung auch eher im Fhem Modul sehen und das ganze im widget dann ebend per schalter zu aktivieren bei Bedarf. Im Modul dann auch wenn eine Schalter gesetzt ist, gibt es ein zusätzliches Reading für das Alter. Die Jahreszahl dann im Location attribute des Kalenders setzen.
Gesendet von meinem GT-N7100 mit Tapatalk
Zitat von: setstate am 25 November 2015, 09:45:19
Aktuell geht das noch nicht, aber dein Vorschlag ist machbar. Aber statt data-part habe ich es data-get-warn genannt, passend zu data-get-on, data-get-off, data-get-value, wie bei vielen anderen Widgets. data-get-warn kann mit RegEx umgehen oder bei Leerzeichen getrennten Werten mit reinen Zahlen, um die Nummer des Teils direkt anzugeben.
<div data-device="dummy1" data-type="symbol"
class="bigger warn"
data-get-on='["Restmuell_.*","Wertstoff_.*"]'
data-on-colors='["#000","#6EB54C"]'
data-icon="fa-trash-o"
data-get-warn=".*(\d+).*">
</div>
Teste mal die widget_symbol.js, dann würde ich das dann so übernehmen.
Teste es morgen, aber war ja jemand schneller als ich. :-[
Danke schon einmal für die Anpassung.
Gesendet von meinem GT-N7100 mit Tapatalk
Hallo!
Ich habe noch ein ganz anderes Problem:
Ich möchte einen Pageswap machen, wenn ein Device auf einen bestimmten Wert geht:
- Es gibt einen Dummy d_Tuerklingelaktivitaet
- Der Dummy geht für 10s auf "1" und dann wieder auf "0", wenn es klingelt
- Dann soll die TabletUI beim iPad an der Wand auf eine Seite mit der URL des Kamerabilds gehen
- Bisher nutze ich Pageswap _nicht_
Mein Versuch war:
<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>
Dabei schaltet TabletUI aber für mich unverständlich hin und her. Gibt es hier irgendeine schöne Möglichkeit, wie den "Pageswap" bei Floorplan?
Gruß
Phil
probiere mal "activate"
<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet"
data-get-on='["0","1"]'
data-icons='["ftui-door","ftui-door activate"]'
></div>
Zitat von: Stril am 25 November 2015, 16:03:59
Hast du dazu eventuell noch eine Idee?
Gerade die Wettericons werden oft erst nach einem Refresh geladen.
schaut bei solchen dubiosen Fehlern mal in den Browser Entwicklertools > Netzwerkanalyse nach, ob Files nicht gefunden werden (404), das stört ungemein.
Zitat von: setstate am 26 November 2015, 08:16:06
probiere mal "activate"
<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet"
data-get-on='["0","1"]'
data-icons='["ftui-door","ftui-door activate"]'
data-background-colors='["#aa6900","#505050"]'
data-get="STATE"
></div>
Hallo!
Bei diesem Code wird leider immer auf die "kamera.html" weitergeleitet - egal ob der state auf 0 oder 1 ist...
Also ich gehe auf meine "index-Seite" und dann gibt es direkt einen Reload auf die Kamera-Seite.
Der Status wird richtig ausgewertet (Farbe ändert sich), aber es wird direkt weitergeleitet. Gebe ich eine nicht existente URL ein, dann sehe ich auch, dass nach dem ersten "Weiterleiten" die nächste Weiterleitung erst durch den Status "1" ausgelöst wird.
Hast Du noch eine Idee?
Gruß
Phil
Hallo setstate,
hab bei mir auch mal den eventmonitor eingebaut, sobald ich die Seite lade, wird bei "mode" nicht "auto/manual/boost" übergeben sondern "0"
26.11.2015 21:06:55 WZ_Thermostat STATE 20.0 °C
26.11.2015 21:06:55 WZ_Thermostat statTemperatureTendency 1h: -0.5 2h: -0.7 3h: -0.3 6h: +0.8
26.11.2015 21:06:55 WZ_Thermostat desiredTemperature 20.0
26.11.2015 21:06:55 WZ_Thermostat mode 0
26.11.2015 21:06:55 WZ_Thermostat battery ok
26.11.2015 21:06:55 WZ_Thermostat temperature 17.8
26.11.2015 21:06:55 WZ_Thermostat valveposition 95
daher spricht das icon auch nicht auf meine definition
<div data-type="push" data-get="WZ_Thermostat" data-fhem-cmd="set WZ_Thermostat desiredTemperature auto" data-get-on="on" data-get-off="off" data-icon="fa-calendar-check-o"></div>
<div class="inline right">
<div data-type="symbol" data-device="WZ_Thermostat" data-get="mode"
data-get-on='["auto ","manual","boost"]'
data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual","fa-spinner fa-pulse"]'
data-on-colors='["green","IndianRed","SlateBlue"]' >
</div>
an,
Nachdem ich dann manuell die Temperatur verstelle, aktualiert das Icon und das Reading ist auch "manual"
26.11.2015 21:06:56 WZ_Thermostat valveposition 94
26.11.2015 21:06:56 EZ_Thermostat valveposition 71
26.11.2015 21:06:56 SZ_Thermostat valveposition 100
26.11.2015 21:06:56 AZ_Thermostat valveposition 0
26.11.2015 21:06:56 BD_Thermostat valveposition 2
26.11.2015 21:07:14 WZ_Thermostat STATE desiredTemperature 18
26.11.2015 21:07:17 WZ_Thermostat mode manual
26.11.2015 21:07:17 WZ_Thermostat desiredTemperature 18.0
Steh grad ein bisschen auf dem Schlauch wie ich das anstellen soll dass es wieder geht - wobei es ja anfangs mal funktioniert hat.
hier noch meine definition in fhem.cfg
#####################
#Wohnzimmer
#####################
define WZ_Thermostat MAX HeatingThermostat 10d769
attr WZ_Thermostat IODev ml
attr WZ_Thermostat event-on-change-reading temperature,desiredTemperature,valveposition,mode
attr WZ_Thermostat room 1.10_MAX
attr WZ_Thermostat scanTemp 1
attr WZ_Thermostat userReadings onlyAutoMode { return "1";;}
define FileLog_WZ_Thermostat FileLog ./log/WZ_Thermostat-%Y-%m-%W.log WZ_Thermostat
attr FileLog_WZ_Thermostat archivedir ./log-archive/
attr FileLog_WZ_Thermostat logtype text
attr FileLog_WZ_Thermostat nrarchive 5
attr FileLog_WZ_Thermostat room 9.90_Logs
Hallo Steffen,
wenn ich das Problem richtig verstanden habe, könnte man das doch so machen:
per RegEx-ODER
data-get-on='["auto ","manual|0","boost"]'
data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual","fa-spinner fa-pulse"]'
oder als vierten Status
data-get-on='["auto ","manual","0","boost"]'
data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual","oa-sani_heating_manual","fa-spinner fa-pulse"]'
Bei mir funktioniert alles soweit, vielen Dank das macht es doch um einiges einfacher und es sind nicht mehr soviele dummies.
Vielen Dank darfst du gerne einchecken und mit verteilen.
Zitat von: setstate am 25 November 2015, 09:45:19
Aktuell geht das noch nicht, aber dein Vorschlag ist machbar. Aber statt data-part habe ich es data-get-warn genannt, passend zu data-get-on, data-get-off, data-get-value, wie bei vielen anderen Widgets. data-get-warn kann mit RegEx umgehen oder bei Leerzeichen getrennten Werten mit reinen Zahlen, um die Nummer des Teils direkt anzugeben.
<div data-device="dummy1" data-type="symbol"
class="bigger warn"
data-get-on='["Restmuell_.*","Wertstoff_.*"]'
data-on-colors='["#000","#6EB54C"]'
data-icon="fa-trash-o"
data-get-warn=".*(\d+).*">
</div>
Teste mal die widget_symbol.js, dann würde ich das dann so übernehmen.
Hallo setstate,
Das Problem ist das der mode "0" beim laden immer initial übergeben wird egal ob das thermostat auto,manual oder boost hat. Erst nachdem ich etwas ändere stimmt es, beim neuladen fängt das Spiel wieder von vorne an.
Ich Versuchs mal zu verdeutlichen
Mode ist auto - laden der Seite wird lt. Eventmonitor 0 übergeben icon bleibt grau
Ich änder die Temperatur - Mode springt auf Manual icon ändert sich. Super!
Lade ich dann die Seite neu - Mode ist immer noch lt reading auf manual wird lt Eventmonitor aber wieder 0 übergeben - icon bleibt grau
Es wird beim Laden der Seite Immer 0 übergeben anstelle des aktuellen - richtigen - modus.
Steffen
Gesendet von meinem GT-I9295 mit Tapatalk
Hallo,
ich habe da mal eine Verstädnisfrage. Ich nutze ein 8 Zoll Tablet von nVidia sowie ein 7 Zoll Tablet von Samsung. Auf meinem 7 Zoll Tablet wird mir alles sauber angezeigt. Also keine Scrollbalken oder was auch immer. Das Layout passt sauber auf den Bildschirm. Bei meinem 8 Zoll Tablet passt es leider gar nicht. Es ist zu groß, sodass ich links-rechts sowie hoch-runter scrollbalken haben. Hier nun meine Frage: Wie geht das? Immerhin ist doch der Display auch größer! Habe jetzt aus Spass mal eine "8 Zoll Anordnung" gemacht.
<meta name="widget_base_width" content="108">
<meta name="widget_base_height" content="125">
Damit passt das Layout perfekt auf das Display...ABER Sachen wie die Thermostate passen jetzt natürlich nicht mehr in ein Kästchen. Also: Was kann ich machen? :)
P.S: Danke an die Macher. Ohne euch wäre FHEM nur halb so schön!!!
@setstate
Ich habe schon einmal die neue Option im Wiki ergänzt für das Symbol Icon.
Falls es noch einen Standard Wert gibt, kannst du ihn ja noch ergänzen.
Hallo,
ich habe FHEM zwar schon etwas länger im Einsatz, wollte mich jetzt aber mal an ein Tablet-UI versuchen.
Leider scheitere ich total, was die Nutzung eines "chart" betrifft. Trotz stundenlanger Suche, habe ich kein wirklich gutes Beispiel für meine Situation gefunden.
Ich würde gerne aus dem Log
2015-11-28_20:44:12 Stromzaehler_Verbrauch CNT: 222 CUM: 108.920 5MIN: 0.640 TOP: 0.664
den Wert für 5MIN abgreifen, habe aber keine Ahnung, was genau jetzt bei "data-columnspec" einzutragen ist. Hat jemand einen Tipp für mich?
Herzlichen Dank schon mal!
Frank
Zitat von: Speedy68 am 28 November 2015, 22:05:57
Hallo,
ich habe FHEM zwar schon etwas länger im Einsatz, wollte mich jetzt aber mal an ein Tablet-UI versuchen.
Leider scheitere ich total, was die Nutzung eines "chart" betrifft. Trotz stundenlanger Suche, habe ich kein wirklich gutes Beispiel für meine Situation gefunden.
Ich würde gerne aus dem Log
2015-11-28_20:44:12 Stromzaehler_Verbrauch CNT: 222 CUM: 108.920 5MIN: 0.640 TOP: 0.664
den Wert für 5MIN abgreifen, habe aber keine Ahnung, was genau jetzt bei "data-columnspec" einzutragen ist. Hat jemand einen Tipp für mich?
Herzlichen Dank schon mal!
Frank
Solltest mit data-columnspec="8:5MIN.*:1:int" auf deinen wert zugreifen können (ohne Gewähr ). Ist ein wenig gefrickel.
Ist aber das gleich wie bei svgplot und wertauswahl
Hallo,
habe ein Problem mit dem Symbol-Widget und dem a_count-Reading des GDS-Moduls. In diesem Reading wird die Anzahl der aktuellen Wetterwarnungen hinterlegt. Das Problem ist, dass das Reading nie auf 0 geht sondern stattdessen "verschwindet". Dies führt dazu, dass bei einer ständig aufgerufenen Webseite immer der vor den Verschwinden letzte Wert bestehen bleibt, bis das Reading wieder auftaucht und einen Wert hat.
Habe ich einfach einen Fehler in meiner Konfiguration oder ist das Symbol-Widget dafür nicht ausgelegt und muss ich einen Dummy dazwischenschalten oder Änliches?
Hier meine Definition:
<div data-type="symbol"
data-background-icon="fa-circle-thin "
data-off-background-color="#7A7A7A"
data-on-background-color="#7A7A7A"
data-device="gds"
data-get='a_count'
data-off-color="#7A7A7A"
data-get-on='["off","^[1-9][0-9]|[1-9]$"]'
data-icons='["fa-bolt warn","fa-bolt warn blink"]'
data-on-colors='["#7A7A7A","#E6E600"]'
class="big"></div>
Viele Grüße
Guna
ZitatDas Problem ist, dass das Reading nie auf 0 geht sondern stattdessen "verschwindet".
Damit kann das UI nicht umgehen. Es wird nicht die gesamte Liste geholt und dann aussortiert, sondern nur das gewünschte Reading angefordert. Das Verschwinden des Readings wird bestimmt auch nicht im Longpoll mitgeteilt? Dann kann man da gar nichts machen. Nur das Dummy-Device, was du vorgeschlagen hast, oder den Modul-Owner fargen ob man das optimieren kann.
Zitat von: Spi0n am 27 November 2015, 17:35:17
Hallo,
ich habe da mal eine Verstädnisfrage. Ich nutze ein 8 Zoll Tablet von nVidia sowie ein 7 Zoll Tablet von Samsung. Auf meinem 7 Zoll Tablet wird mir alles sauber angezeigt. Also keine Scrollbalken oder was auch immer. Das Layout passt sauber auf den Bildschirm. Bei meinem 8 Zoll Tablet passt es leider gar nicht. Es ist zu groß, sodass ich links-rechts sowie hoch-runter scrollbalken haben. Hier nun meine Frage: Wie geht das? Immerhin ist doch der Display auch größer! Habe jetzt aus Spass mal eine "8 Zoll Anordnung" gemacht.
<meta name="widget_base_width" content="108">
<meta name="widget_base_height" content="125">
Damit passt das Layout perfekt auf das Display...ABER Sachen wie die Thermostate passen jetzt natürlich nicht mehr in ein Kästchen. Also: Was kann ich machen? :)
P.S: Danke an die Macher. Ohne euch wäre FHEM nur halb so schön!!!
Man muss die Gridster Basis anpassen und auch die Anzahl der X und Y Raster.
<li data-row="3" data-col="11" data-sizex="2" data-sizey="7">
Da muss man etwas rumspielen und evtl. zwei Seiten benutzen. Für jedes Gerät eine eigene.
Zitat von: setstate am 20 November 2015, 18:15:01
Ich kenne jetzt deine Status und deine Icon-Namen nicht, aber so ähnlich könnte man das definieren (Multi-State-Schreibweise nötig, weil Icons geändert werden sollen):
<div data-type="switch" data-device="MySensor"
data-states='["on","off"]'
data-icons='["fa-car","fa-archive"]'
data-colors='["#333","#333"]'
data-background-colors='["#aa6900","#555"]'
class="cell big">
</div>
Probiert mal ein zusätzliches data-fhem-cmd="set HM_RelaisKeller_01 on-for-timer 0.5"
perfekt. Danke!
Klappt bei mir ebenfalls.
Kurz zur Erläuterung bei mir:
set garagentor_gross_schalter on
setzt bei mir einen HomeMatic-internen on-for-timer und dieser schaltet einen Dummy, der meinen Fenstersensorstatus von garagentor_gross abfragt.
FTUI:
<div data-type="switch" data-device="garagentor_gross"
data-states='["open","closed"]'
data-icons='["oa-fts_garage_door_10","oa-fts_garage_door_100"]'
data-colors='["#333","#333"]'
data-background-colors='["#aa6900","#555"]'
data-fhem-cmd="set garagentor_gross_schalter on"
class="cell big">
</div>
Hallo,
ich habe seit ein paar Tagen das neue HMCCU Modul und kann damit endlich auch FHEM sauber benutzen.
Ich versuche gerade, meine Heizkörperthermostate in Tablet UI anzuzeigen, schaffe es leider nicht. Laut Dokumentation sollte es ja reichen, wenn ich folgendes eintrage:
<div data-type="thermostat" data-device="WohnzimmerHeizThermostat" class="cell left-space"></div>
meine fhem.cfg sieht folgendermassen aus:
define WohnzimmerHeizungThermostat HMCCUDEV LEQ0XXXXXXX
attr WohnzimmerHeizungThermostat IODev d_ccu
attr WohnzimmerHeizungThermostat room Wohnzimmer
Kann mir jemand nen Tipp geben, was ich falsch mache?
grüße
und Danke
Hallo setstate,
Hast du ne Idee warum der Mode "0" übergeben wird?
Gesendet von meinem GT-I9295 mit Tapatalk
Zitat von: xxsteffenxx am 30 November 2015, 06:10:58
Hallo setstate,
Hast du ne Idee warum der Mode "0" übergeben wird?
Gesendet von meinem GT-I9295 mit Tapatalk
Im FHEM selbst ist an dieser Stelle keine 0 und auch nicht im Eventmonitor von Fhem?
Wenn es nur in FTUI als 0 auftaucht, dann sieht das nach Konvertierungsproblemen aus.
Ich will jetzt erst einmal ein Update fertigstellen und hochladen, dann habe ich wieder mehr Zeit, mir die Fragestellungen anzusehen.
Zitat von: EdgarM am 29 November 2015, 23:43:55
Hallo,
ich habe seit ein paar Tagen das neue HMCCU Modul und kann damit endlich auch FHEM sauber benutzen.
Ich versuche gerade, meine Heizkörperthermostate in Tablet UI anzuzeigen, schaffe es leider nicht. Laut Dokumentation sollte es ja reichen, wenn ich folgendes eintrage:
<div data-type="thermostat" data-device="WohnzimmerHeizThermostat" class="cell left-space"></div>
meine fhem.cfg sieht folgendermassen aus:
define WohnzimmerHeizungThermostat HMCCUDEV LEQ0XXXXXXX
attr WohnzimmerHeizungThermostat IODev d_ccu
attr WohnzimmerHeizungThermostat room Wohnzimmer
Kann mir jemand nen Tipp geben, was ich falsch mache?
grüße
und Danke
Moin Moin eigentlich ganz simpel denke ich:
Du defnierst define
WohnzimmerHeizungThermostat HMCCUDEV LEQ0XXXXXXX
rufst im div aber folgendes auf :
data-device="
WohnzimmerHeizThermostat"
Das sollte schon gleich sein ;)
Servus setstate,
Alles klar. Danke.
Wenn ich noch Infos durchgeben kann sag mir Bescheid.
Gesendet von meinem GT-I9295 mit Tapatalk
Hallo Steffen,
die eine Frage im Moment:
Im FHEM selbst ist an dieser Stelle keine 0 und auch nicht im Eventmonitor von Fhem? Nur im FTUI?
Schaust du da nochmal bitte nach ..
Zitat von: EdgarM am 29 November 2015, 23:43:55
Hallo,
ich habe seit ein paar Tagen das neue HMCCU Modul und kann damit endlich auch FHEM sauber benutzen.
Ich versuche gerade, meine Heizkörperthermostate in Tablet UI anzuzeigen, schaffe es leider nicht. Laut Dokumentation sollte es ja reichen, wenn ich folgendes eintrage:
<div data-type="thermostat" data-device="WohnzimmerHeizThermostat" class="cell left-space"></div>
meine fhem.cfg sieht folgendermassen aus:
define WohnzimmerHeizungThermostat HMCCUDEV LEQ0XXXXXXX
attr WohnzimmerHeizungThermostat IODev d_ccu
attr WohnzimmerHeizungThermostat room Wohnzimmer
Kann mir jemand nen Tipp geben, was ich falsch mache?
grüße
und Danke
für FTUI schreibst du ...HeizTherm... und im Fhem ...HeizungTherm...
Zitat von: Stril am 26 November 2015, 10:45:13
Hallo!
Bei diesem Code wird leider immer auf die "kamera.html" weitergeleitet - egal ob der state auf 0 oder 1 ist...
Also ich gehe auf meine "index-Seite" und dann gibt es direkt einen Reload auf die Kamera-Seite.
Der Status wird richtig ausgewertet (Farbe ändert sich), aber es wird direkt weitergeleitet. Gebe ich eine nicht existente URL ein, dann sehe ich auch, dass nach dem ersten "Weiterleiten" die nächste Weiterleitung erst durch den Status "1" ausgelöst wird.
Hallo!
Habt ihr dazu noch eine Idee? Ich komme hier einfach nicht weiter.
Vielen Dank
Gruß
Phil
Zitat von: Stril am 26 November 2015, 10:45:13
Hallo!
Bei diesem Code wird leider immer auf die "kamera.html" weitergeleitet - egal ob der state auf 0 oder 1 ist...
Also ich gehe auf meine "index-Seite" und dann gibt es direkt einen Reload auf die Kamera-Seite.
Der Status wird richtig ausgewertet (Farbe ändert sich), aber es wird direkt weitergeleitet. Gebe ich eine nicht existente URL ein, dann sehe ich auch, dass nach dem ersten "Weiterleiten" die nächste Weiterleitung erst durch den Status "1" ausgelöst wird.
Hallo!
Habt ihr dazu noch eine Idee? Ich komme hier einfach nicht weiter.
Vielen Dank
Gruß
Phil
Zitat von: Nobby1805 am 30 November 2015, 09:53:52
für FTUI schreibst du ...HeizTherm... und im Fhem ...HeizungTherm...
Hi Nobby,
ja, das war leider nur falsch kopiert.
Ich habe jetzt einfach mal alles ,was ich mir ausdenken kann reingeschrieben, trotzdem kein Erfolg:
<div data-type="thermostat" data-device="HeizungBadThermostat.ACTUAL_TEMPERATURE" class="cell left-space"></div>
<div data-type="thermostat" data-device="HeizungBadThermostat" class="cell left-space"></div>
<div data-type="thermostat" data-device="HeizungBadThermostat.4" class="cell left-space"></div>
<div data-type="thermostat" data-device="HeizungBadThermostat_Clima" class="top-narrow left-space"></div>
<div data-type="thermostat" data-device="MEQXXXXXXX" class="top-narrow left-space"></div>
define HeizungBadThermostat HMCCUDEV MEQXXXXXXXX
attr HeizungBadThermostat IODev d_ccu
attr HeizungBadThermostat loglevel 6
attr HeizungBadThermostat room Bad
attr HeizungBadThermostat stateFormat TemperaturBad.SET_TEMPERATURE - > TemperaturBad.ACTUAL_TEMPERATURE
attr HeizungBadThermostat verbose 5Habe auch ein Screenshot angehängt, der das index.html oben anzeigt. Witzig ist, dass bei der zweiten Zeile einfach eine 10 drin steht, das aber keinem Wert des Heizkörpers entspricht.
Wo hast denn definiert was von deinem Device haben willst. Ich nehme an, Zeile 2 ist richtig, aber unvollständig.
<div data-type="thermostat" data-device="FTR_WZ" data-get="setpointTemp" data-temp="temperature" data-fix="1" data-step="0.1" class="cell left"></div>
Gruß Bert
data-get, data-set und data-temp verwenden, wenn nicht angegeben, einen Default (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#thermostat) ... je nach von dir verwendetem Thermostat passt das dann nicht und du musst den "richtigen Namen" angeben
Irgendwie kriege ich es nicht hin, die aktive Farbe bei dem HomeStatus widget zu ändern.
Mit welchem Attribut kann ich dies tu, data-on-background-coler, data-on-color(s) ect. hat alles nicht geklappt.
Hat da jemand einen Tipp?
Grüsse Eric
Zitat von: Avatar am 30 November 2015, 16:52:00
Irgendwie kriege ich es nicht hin, die aktive Farbe bei dem HomeStatus widget zu ändern.
Mit welchem Attribut kann ich dies tu, data-on-background-coler, data-on-color(s) ect. hat alles nicht geklappt.
Hat da jemand einen Tipp?
Grüsse Eric
drei möglichkeiten
1. vordefinierte color class
<div data-type="homestatus" data-device='dummy2' class="green" ></div>2. rgb color direkt
<div data-type="homestatus" data-device='dummy2' data-fgcolor="#dd4433" class="" ></div>3. schema für alle controls
<link rel="stylesheet" href="/fhem/tablet/css/fhem-blue-ui.css" />
Zitat von: setstate am 30 November 2015, 07:34:54
Hallo Steffen,
die eine Frage im Moment:
Im FHEM selbst ist an dieser Stelle keine 0 und auch nicht im Eventmonitor von Fhem? Nur im FTUI?
Schaust du da nochmal bitte nach ..
Hallo setstate,
nein im Eventmonitor fhem kommt beim laden der Seite gar kein "event" an, beim ändern zeigt er es folgendermaßen an
MAX WZ_Thermostat mode: manual
MAX WZ_Thermostat mode: auto
die readings sehen so aus
mode auto
Der Eventmonitor im Tablet UI dagegen
WZ_Thermostat mode 0
WZ_Thermostat mode manual
WZ_Thermostat mode auto
Hallo Setstate
Vielen dank. Mit data-fgcolor="#dd4433" hat perfekt geklappt.
die 3. Variante hatte ich aktiv, alle anderen Widgets waren richtig, nur der Homestatus ist so orange geblieben.
Was bei mir auch ist, dass beim ersten laden der Seite der homestatus nur die Linien sichtbar ist, erst nach etwa 15 Sekunden wird es aktualisiert und die icons werden sichtbar.
Grüsse
Eric
Zitat von: Avatar am 30 November 2015, 19:09:35
Hallo Setstate
Vielen dank. Mit data-fgcolor="#dd4433" hat perfekt geklappt.
perfekt
Zitat
die 3. Variante hatte ich aktiv, alle anderen Widgets waren richtig, nur der Homestatus ist so orange geblieben.
Das ist noch ein Bug, den ich heute korriert hochladen werde
Zitat
Was bei mir auch ist, dass beim ersten laden der Seite der homestatus nur die Linien sichtbar ist, erst nach etwa 15 Sekunden wird es aktualisiert und die icons werden sichtbar.
Das ist so richtig, das ist ein Workaround, weil ich die eigentliche Ursache noch nicht kenne bzw. abstellen kann
Hallöchen, ich habe ein Problem und das Forum bereits durchforstet aber keine Lösung gefunden.
Ich nutze im fhem weather_yahoo
Im fhem wird mir im (weblink_weather_yahoo) abends der Mond angezeigt
Als Tablet Oberläche nutze ich FTUI
Dort wird mir aber auch nachts die Sonne angezeigt!
Im FTUI .html ist data-get="condition" angegeben. Scheinbar kann er dort nicht zwischen Day & Night unterscheiden.
Ich hoffe es kann mir jemand weiterhelfen.
Gruß Thomas
Zitat von: Depechem am 30 November 2015, 21:55:45
Hallöchen, ich habe ein Problem und das Forum bereits durchforstet aber keine Lösung gefunden.
Ich nutze im fhem weather_yahoo
Im fhem wird mir im (weblink_weather_yahoo) abends der Mond angezeigt
Als Tablet Oberläche nutze ich FTUI
Dort wird mir aber auch nachts die Sonne angezeigt!
Im FTUI .html ist data-get="condition" angegeben. Scheinbar kann er dort nicht zwischen Day & Night unterscheiden.
Ich hoffe es kann mir jemand weiterhelfen.
Gruß Thomas
Mach dir nen dummy und setz den mit sunset/sunrise auf hell/dunkel. In ftui kannst du dann entsprechend eine anzeige ändern
Zitat von: knopf_piano am 30 November 2015, 22:11:36
Mach dir nen dummy und setz den mit sunset/sunrise auf hell/dunkel. In ftui kannst du dann entsprechend eine anzeige ändern
Kannst du mir das bitte genauer erklären. Ich bin noch relativ neu mit FHEM
schau hier:
http://www.benjaminroesner.com/blog/uhrzeit-des-sonnenaufgang-sonnenuntergang-in-fhem-anzeigen/
den dummy wert kannst du dann über im label-widget prüfen, als Hilfe siehe Darstellung die ftui-user-demo-files
http://forum.fhem.de/index.php/topic,37378.0.html
Zitat von: knopf_piano am 01 Dezember 2015, 10:16:08
schau hier:
http://www.benjaminroesner.com/blog/uhrzeit-des-sonnenaufgang-sonnenuntergang-in-fhem-anzeigen/
den dummy wert kannst du dann über im label-widget prüfen, als Hilfe siehe Darstellung die ftui-user-demo-files
http://forum.fhem.de/index.php/topic,37378.0.html
Die Dummys Sonnenaufgang/Sonnenuntergang habe ich erstellt(die Zeiten werden auch abgerufen) nur weis ich nicht wie ich die Zeit des Sonnenuntergangs mit .png (Night, Day) im UI verknüpfen kann. Im Moment wird die Ausgabe des .png ja über:
<div data-type="weather" data-device="weather_yahoo" data-get="condition" data-imageset="kleinklima" style="width:200px;padding:0;margin:0 auto;"></div>
</div>
ausgegeben, nur halt nicht selektierbar zwischen Tag und Nachtbild
Hallo,
ich bin im Moment am Einrichten eines Abfallkalender und data-on-background-colors verhält sich irgendwie merkwürdig. Code sieht so aus:
<div data-type="symbol"
data-device="MuellterminDummy"
data-get="BioEnergieTonne"
data-icons='["fa-trash warn fa-spin","fa-trash warn","fa-trash warn"]'
data-on-colors='["SaddleBrown","SaddleBrown","SaddleBrown"]'
data-on-background-colors='["aa6900","aa6900","grey"]'
data-get-on='["0","2","4"]'
data-background-icon="fa-circle"
class="bigger inline" >
</div>
Ich versuche drei Status einzurichten
1. 4 Tage und mehr verbleibend: Hintergrundfarbe grau
2. Zwischen 2 und 3 Tagen: Hintergrundfarbe #aa6900
3. 0 und 1 Tagen: Hintergrundfarbe #aa6900 und zusätzlich fa-spin
1 und 3 funktioniert ohne Probleme, nur bei 2 hakt es, wenn ich einen Farbcode bei data-on-background-colors='["aa6900","aa6900","grey"]' verwende. Ersetze ich das zweite "aa6900" z.B. zu data-on-background-colors='["aa6900","red","grey"]' wird der Hintergrund im Bereich 2 - 3 Tagen rot, also so wie es auch sein soll. Bei aa6900 und bei jedem anderen Farbcode wird rgb(80, 80, 80) (wo kommt das her?) als Farbe für das Element genutzt.
Also Farbtexte funktionieren, nur Farbcodes nicht. Woran kann das liegen?
Edit: Wow, einfach nur #aa6900 statt aa6900 zu schreiben war die Lösung. Habe echt zu kompliziert gedacht... ::)
Hi,
ich benutze pagetabs für ein Menu - gibt es da die Möglichkeit, nen "Timer-Umschalter" einzubauen? Ich vergesse immer auf wieder auf meine Startseite zu klicken, nachdem ich mir mal ne andere Seite angeschaut habe - wenn ich das nächste mal dann auf mein Tablet draufschaue, muss ich immer erst wieder die Startseite klicken ( da auf der die ganzen wichtigen Statusanzeigen bei mir und wahrscheinlich auch bei den meisten anderen sind) -besser fände ich es, wenn ich bei pagetab irgend eine Sekundenzahl einstellen könnte, nachdem wieder automatisch auf die Startseite umgeschalten werden soll - wäre das möglich? Finden das noch andere sinnvoll?
Habt ihr zufällig eine Idee, ob man so eine Art Codeschloss über das UI abbilden kann?
Ehrlich gesagt habe ich aber auch noch keine Idee, wie der Backend dazu in FHEM aussehen soll. :-)
Ich sammel gerade Ideen. Danke.
Ein Codeschloss fände ich gut. Wir haben hier öfter Kinder rumlaufen. Zumindest an Heizungseinstellungen usw. möchte ich sie nicht so gerne ranlassen.
Popup und Charts
Hallo
Ich habe die Temperatur-Plots mittels dem widget-chart in das PopUp eingebaut. Grundsätzlich scheint das zu funktionieren.
Im Moment zeigt das PopUp die Plots nur sehr langsam an (ist klar, die Daten müssen ja ausgewertet werden), aber in den meisten Fällen (wenn ich 2 Charts in den Popup spitze) werden die Plots, nachdem das PopUp geöffnet wird, gar nicht gezeigt. Ist nur ein Chart vorhanden, wird dieser erst bei der nächsten Änderung der Temperatur angezeigt. Wo könnte das Problem liegen?
<li data-row="4" data-col="8" data-sizex="1" data-sizey="2">
<div data-type="popup" data-height="650px" data-width="950px">
<header>Temperaturen</header>
<div class="dialog">
<header>Temperaturen und Luftfeuchtigkeit</header>
<div class="normal"
data-type="chart"
data-logdevice='["FileLog_Elektronik"]'
data-columnspec='["4:Elektronik.T:T:","6:Elektronik.*:H:"]'
data-style='["ftui l2","ftui l1"]'
data-ptype='["lines","lines"]'
data-uaxis='["primary","secondary"]'
data-legend='["Temperatur","Feuchtigkeit"]'
data-yunit="° C"
data-ytext="Temperatur"
data-minvalue="auto"
data-maxvalue="auto"
data-yunit_sec="%"
data-ytext_sec="Luftfeuchtigkeit"
data-height="200"
data-yticks="auto"
data-minvalue_sec="auto"
data-maxvalue_sec="auto"
data-nofulldays="true"
data-daysago_start="0"
data-daysago_end="-1"
data-cursorgroup="1"
data-scrollgroup="1"
data-showlegend="true"
data-crosshair="true"
data-xticks="auto">
</div>
</div>
</div>
<div class="container narrow small inline">
<div data-type="label" data-device="OG_Temperatur" data-get="temperature" data-limits='[-73,10,18,25,30]' data-colors='["Aqua","Aquamarine","SeaGreen","IndianRed","Red"]' data-unit="%B0C%0A" class="cell big thin"></div>
<div data-type="label" class="narrow">Galerie</div>
<div data-type="label" data-device="WZ_Temperatur" data-get="temperature" data-limits='[-73,10,18,25,30]' data-colors='["Aqua","Aquamarine","SeaGreen","IndianRed","Red"]' data-unit="%B0C%0A" class="cell big thin"></div>
<div data-type="label" class="narrow">Wohnzimmer</div>
<div data-type="label" data-device="UG_Temperatur" data-get="temperature" data-limits='[-73,10,18,25,30]' data-colors='["Aqua","Aquamarine","SeaGreen","IndianRed","Red"]' data-unit="%B0C%0A" class="cell big thin"></div>
<div data-type="label" class="narrow">Untergeschoss</div>
<div data-type="label" data-device="Elektronik" data-get="temperature" data-limits='[-73,5,18,25,30]' data-colors='["Aqua","Aquamarine","SeaGreen","IndianRed","Red"]' data-unit="%B0C%0A" class="cell big thin"></div>
<div data-type="label" class="narrow">Elektronik</div>
<div data-type="label" data-device="TK_Temperatur" data-get="temperature" data-limits='[-73,10,18,25,30]' data-colors='["Aqua","Aquamarine","SeaGreen","IndianRed","Red"]' data-unit="%B0C%0A" class="cell big thin"></div>
<div data-type="label" class="narrow">Tiefklühler</div>
</div>
</li>
Zitat von: FunkOdyssey am 01 Dezember 2015, 18:02:35
Habt ihr zufällig eine Idee, ob man so eine Art Codeschloss über das UI abbilden kann?
Ehrlich gesagt habe ich aber auch noch keine Idee, wie der Backend dazu in FHEM aussehen soll. :-)
Ich sammel gerade Ideen. Danke.
Man könnte doch im Frontend so etwas wie ein Screensaver (http://forum.fhem.de/index.php/topic,44177.0.html) implementieren, darin nur Readonly Daten anzeigen und erst nach Codeeingabe/Wischmuster diesen zu beenden und die eigentliche Oberfläche freizugeben.
Das ist eine gute Idee. Ich werde mich mal darauf stürzen. :-) Danke.
Hallo,
gib es eigentlich die Möglichkeit, z.B. für die Temperaturauswahl, ein Scrollfeld einzubauen? Stelle es mir vor wie beim
Uhrzeitwidget... (Bild anbei).
Gruß
Dirk
Zitat von: gibacht am 02 Dezember 2015, 13:28:46
Hallo,
gib es eigentlich die Möglichkeit, z.B. für die Temperaturauswahl, ein Scrollfeld einzubauen? Stelle es mir vor wie beim
Uhrzeitwidget... (Bild anbei).
Gruß
Dirk
Gutes Thema, ich häng mich mal an das Datetimewidget dran. Zur Zeit kann man damit nur volle Stunden abbilden oder geht auch z.B. 18:30 oder 17:15 ?
Zitat von: skuggy am 02 Dezember 2015, 14:40:41
Gutes Thema, ich häng mich mal an das Datetimewidget dran. Zur Zeit kann man damit nur volle Stunden abbilden oder geht auch z.B. 18:30 oder 17:15 ?
data-step steht per default auf 60 (Minuten). Man müsste dann data-step="15" angeben.
Bei der Temperatur bestenfalls mit einer Nachkommastelle...
z.B.: 10,5
Hallo zusammen,
endlich komme ich auch mal wieder dazu mein Tablet UI zu erweitern.
Ich möchte gerne die Bewegung meiner Webcam über das UI steuern, bislang habe ich hier im Forum die Lösung gefunden das mittel eines Circle-Menues und Push Buttons zu realisieren.
Wenn ich das richtig sehe, brauche ich einen Knopf um die Bewegung zu starten und einen weiteren um die Bewegung wieder zu stoppen. Soweit so gut, wäre es auch möglich die Bewegung nur auszuführen solange ich den Knpof gedrückt halte? Dazu müsste ich beim drücken Kommando 1 senden und beim loslassen Kommando 2.
Leider scheint das PUSH-Widget aber nur die Möglichkeit zu haben, ein Kommande beim drücken zu senden, es fehlt etwas wie ein data-set-off.
Hat jemand eine Idee ob sich so etwas jetzt schon relisieren lässt?
Vielen Dank im Voraus
Gruß
Gerald
Seit dem letzten Update habe ich wieder längst vergessene Probleme mit slider, pagetab und updates:
1) Slider zeigt wieder keine Textwerte an (sondern nur die entsprechenden numerischen Werte) --> Bei status closed wird kurz der Textwert "closed" angezeigt und dann durch den Wert 100 überschrieben. Der Wert 100 kommt aus der callback-Routine
2) Wenn ich in Firefox (Windows) Caching deaktiviere kommt das UI gar nicht mehr hoch (sondern dated sich nur alle 60s stückweise) --> Hier scheint firefox auf das Ende des longpoll zu warten
Leider kann ich nicht nachvollziehen, welche Änderungen jetzt eingeflossen sind, da ich nach dem Update inzwischen ein paar Tage geschäftlich unterwegs war.
@setstate die Änderung am symbol widget sind noch nicht im update drinne, wie ich heute festgestellt habe.
wann hast du das vor mit bereitzustellen?
Ist es möglich das Tablet UI irgendwie auszulagern auf einen anderen Server? Gibt es schon eine Anleitung dazu? Im Grunde muss ja nur die Adresse vom FHEM Server irgendwo angegeben werden, damit die Daten weiterhin ankommen.
ZitatDazu müsste ich beim drücken Kommando 1 senden und beim loslassen Kommando 2
Durchaus machbar. Werde ich mir ansehen, wie das am besten realisieren kann.
@uniqueck: Update kommt noch diese Woche, im Bundle dann.
Zitat von: viegener am 02 Dezember 2015, 22:46:12
Seit dem letzten Update habe ich wieder längst vergessene Probleme mit slider, pagetab und updates:
1) Slider zeigt wieder keine Textwerte an (sondern nur die entsprechenden numerischen Werte) --> Bei status closed wird kurz der Textwert "closed" angezeigt und dann durch den Wert 100 überschrieben. Der Wert 100 kommt aus der callback-Routine
2) Wenn ich in Firefox (Windows) Caching deaktiviere kommt das UI gar nicht mehr hoch (sondern dated sich nur alle 60s stückweise) --> Hier scheint firefox auf das Ende des longpoll zu warten
Leider kann ich nicht nachvollziehen, welche Änderungen jetzt eingeflossen sind, da ich nach dem Update inzwischen ein paar Tage geschäftlich unterwegs war.
OK, habe mal weiter Vergleiche zur Vorversion angestellt: Das Problem kommt wieder aus dem setTimeout im Slider. Der macht bei mir wieder Probleme. Eigentlich deutet dieser verzögerte setvalue ja daraufhin, dass irgendwo anders etwas nicht läuft.
Wäre es möglich dass zumindest schaltbar zu machen, denn so ist der slider für mich unter firefox und Chrome nicht nutzbar.
Ausserdem wäre es toll. wenn Du meine Änderung in pagetab von fadeIn/fadeout zu fadeTo übernehmen würdest, denn das wäre eine erhebliche Stabilisierung, da dann die gridster grössen nicht null sind
Hierfür einfach das Attribute im head der Html Seite setzen.
<meta name="fhemweb_url" content="http://fhemServer:8083/fhem/"/>
Zitat von: JoJota am 02 Dezember 2015, 23:29:49
Ist es möglich das Tablet UI irgendwie auszulagern auf einen anderen Server? Gibt es schon eine Anleitung dazu? Im Grunde muss ja nur die Adresse vom FHEM Server irgendwo angegeben werden, damit die Daten weiterhin ankommen.
Kurze Frage zum Button Widget
Also ich habe einen Update Check für Widgets und FTUI, wie es hier schon einmal von nesges glaube ich beschrieben wurde.
Zur Einbindung in das FTUI, habe ich ein Button aktuell, welcher je nach Verfügbarkeit eines Updates dann die entsprechenden on-background-color setzt.
Wenn ich auf den Button klicke, wird die Methode zum Update aufgerufen, nun wäre es natürlich noch schön den Button per fa-spin oder so etwas animieren zu lassen, so lange das Update am Laufen ist und sobald es durch ist, soll der Button quasi disbled sein.
Gibt es beim Button das multi data-get-on? Oder muss ich hierfür doch eher ein switch nehmen, aber wie würde ich verhindern, dass das switch nicht anklickbar ist, wenn der Status des Readings nicht entsprechend ist, des Weiteren soll ja kein Reading gesetzt werden, durch das anklicken, sondern ein beliebiges cmd aufgerufen werden.
Wenn ich gerade beim Button Widget bin, fählt mir direkt noch eine Frage ein, ist es möglich dem Button auch eine class warn zu verpassen, und ein device zu definieren, von welchem es den Wert des warn's bekommt?
Interessant fände ich das für die Buttons im Menü, so dass wenn entsprechenden Ereignisse auf deren Seite vorhanden sind, dies auch auf der Hauptseite visualisiert werden kann.
vielen dank schon einmal.
Zitat von: viegener am 03 Dezember 2015, 00:03:13
OK, habe mal weiter Vergleiche zur Vorversion angestellt: Das Problem kommt wieder aus dem setTimeout im Slider. Der macht bei mir wieder Probleme. Eigentlich deutet dieser verzögerte setvalue ja daraufhin, dass irgendwo anders etwas nicht läuft.
Wäre es möglich dass zumindest schaltbar zu machen, denn so ist der slider für mich unter firefox und Chrome nicht nutzbar.
Ausserdem wäre es toll. wenn Du meine Änderung in pagetab von fadeIn/fadeout zu fadeTo übernehmen würdest, denn das wäre eine erhebliche Stabilisierung, da dann die gridster grössen nicht null sind
@setstate: Ich habe Dir mal einen aufgefrischten pullrequest gestellt, bei dem der workaround mit timeout schaltbar ist. Default ist mit teimout aber über class nodelay lässt sich der timeout überspringen.
Grundsätzlich würde es Sinn machen mal zu schauen, warum der Workaround überhaupt gebruacht wird, denn die höhe/breite 0 kommt eigentlich nur bei ausgeblendetem / inaktiven elementen vor. Möglicherweise ist da eine Änderung (wir bei pagetab) notwendig?
Johannes
Zitat von: setstate am 30 November 2015, 07:34:54
Hallo Steffen,
die eine Frage im Moment:
Im FHEM selbst ist an dieser Stelle keine 0 und auch nicht im Eventmonitor von Fhem? Nur im FTUI?
Schaust du da nochmal bitte nach ..
Hallo setstate,
nun habe ich was gefunden.
Mein Wochenprogramm schaltet nämlich auch nicht mehr---> http://forum.fhem.de/index.php/topic,44230.msg368689.html#msg368689
Zitat von: uniqueck am 03 Dezember 2015, 00:28:31
Hierfür einfach das Attribute im head der Html Seite setzen.
<meta name="fhemweb_url" content="http://fhemServer:8083/fhem/"/>
Habe ich gemacht, zusätzlich auch Pfadangaben zu den Stylesheets korrigiert. Wird auch alles richtig angezeigt bis auf die Daten. Javascript Konsole sagt folgendes:
XMLHttpRequest cannot load https://<LinkZurFhemInstallation>:8083/fhem/?XHR=1&inform=type%3Draw%3Bfilter%3D.*&_=1449139800065. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://<MeineDomain>.de' is therefore not allowed access. The response had HTTP status code 401.HTTP 401 weißt wohl darauf hin, dass die Authentifizierung fehlgeschlagen ist. Bei fhemweb_url habe ich den Link aber vollständig mit Benutzername und Passwort angegeben:
<meta name="fhemweb_url" content="https://<benutzername>:<passwort>@<MeineDomain>:8083/fhem/"/>Die Links sind auch alle über das Internet (mit Authentifizierung) zu erreichen. Es scheint, als ob die Authentifizierungsdaten vor dem HTTP Request rausgefiltert werden. Am HTTPS liegt es nicht, bekomme den gleichen Fehler auch ohne.
Edit: attr WEB CORS 1 hat das 'Access-Control-Allow-Origin' Problem gelöst. "401 (Authorization Required)" bleibt aber weiterhin bestehen. Ist es nicht möglich, eine Verbindung in Kombination mit dem basicAuth von FHEM herzustellen?
Zitat von: JoJota am 03 Dezember 2015, 12:42:37
Edit: attr WEB CORS 1 hat das 'Access-Control-Allow-Origin' Problem gelöst. "401 (Authorization Required)" bleibt aber weiterhin bestehen. Ist es nicht möglich, eine Verbindung in Kombination mit dem basicAuth von FHEM herzustellen?
Naja, wenn's "sicher" sein soll, könntest du ein neues FHEMWEB auf einem anderen Port erstellen (ohne basicAuth) und mittels
allowfrom die IP-Adressen einschränken, die darauf zugreifen dürfen.
Hallo!
Gibt es irgendeine Alternative zu Pagetab, um abhängig von einem Sensor-Wert oder Dummy auf eine andere URL zu gehen?
Mit Pagetab komme ich einfach nicht weiter.
<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>
Hier wird nur auch bei "0" weitergeleitet. Kann man das irgendwie vielleicht direkt mit Java-Script löse? Ich brauche auch nicht unbedingt einen Button - eher einen Automatismus, der im Hintergrund ein Device überwacht und dann weiterleitet.
Danke und Grüße
Phil
Hallo zusammen, da meine besser Hälfte nun so langsam mit meinem FTUI warm wird kommen die ersten Verbesserungsvorschläge.
Da auf dem Smartphone öfters durch das wischen die Temperatur am Thermostat verändert wird bzw. Es relativ schnell ausersehen geht stellt sich die Frage ob ich das Irgendwie über einen Button "entsperren" kann bevor die Änderungen funktionieren.
Also erst Button drücken dann kann man die Temperatur einstellen. Wurde glaub irgendwo hier schonmal gefragt als Art Code-Schloss.
Wenn jemand hier einen Tipp hat würde ich mich freuen :-)
Danke
Gesendet von meinem GT-I9295 mit Tapatalk
@setstate danke fürs update, symbol widget klappt soweit.
Zitat von: kleing am 02 Dezember 2015, 21:21:36
Hallo zusammen,
endlich komme ich auch mal wieder dazu mein Tablet UI zu erweitern.
Ich möchte gerne die Bewegung meiner Webcam über das UI steuern, bislang habe ich hier im Forum die Lösung gefunden das mittel eines Circle-Menues und Push Buttons zu realisieren.
Wenn ich das richtig sehe, brauche ich einen Knopf um die Bewegung zu starten und einen weiteren um die Bewegung wieder zu stoppen. Soweit so gut, wäre es auch möglich die Bewegung nur auszuführen solange ich den Knpof gedrückt halte? Dazu müsste ich beim drücken Kommando 1 senden und beim loslassen Kommando 2.
Leider scheint das PUSH-Widget aber nur die Möglichkeit zu haben, ein Kommande beim drücken zu senden, es fehlt etwas wie ein data-set-off.
Hat jemand eine Idee ob sich so etwas jetzt schon relisieren lässt?
Vielen Dank im Voraus
Gruß
Gerald
Das ist ein interessanter Punkt, beim Push getrennte Kommandos zu senden bei Down und bei Up. Das geht jetzt so nicht, wäre aber realisierbar. Eine Hürde gibt es aber.Ich habe das Senden aktuell auf das Up-Event gelegt und eine Logik zwischen Down und Up gelegt, die erkennen soll, ob es tatsächlich ein gewollter Drücker ist, oder nur ein Scroll (Mobil-Telefon), bei dem der Finger nur zufällig auf den Push-Button gelandet ist. Dabei will man kein Kommando an FHEM senden. Diese Logik müsste man dann ausschaltbar machen und stattdessen beide Events (up und down) zum Senden Nutzbar machen.
Zitat von: Stril am 03 Dezember 2015, 19:09:58
Hallo!
Gibt es irgendeine Alternative zu Pagetab, um abhängig von einem Sensor-Wert oder Dummy auf eine andere URL zu gehen?
Mit Pagetab komme ich einfach nicht weiter.
<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>
Hier wird nur auch bei "0" weitergeleitet. Kann man das irgendwie vielleicht direkt mit Java-Script löse? Ich brauche auch nicht unbedingt einen Button - eher einen Automatismus, der im Hintergrund ein Device überwacht und dann weiterleitet.
Danke und Grüße
Phil
Geduld, ich bin schon beim Forschen bzgl. Pagetab ...
Zitat von: setstate am 04 Dezember 2015, 09:50:54
Geduld, ich bin schon beim Forschen bzgl. Pagetab ...
Das freut mich sehr! Vielen Dank!!!
Noch ein anderer Punkt, der leider seit heute Probleme macht: Die Icons bei "data-rype=button" funktionieren bei mir seit dem letzten Update nicht mehr:
<div data-type="button" data-url="og.html" data-icon="fa-bed"></div>
--> nur ein orangener Kringel...
Grüße und danke für eure Hilfe!
Zitat von: Stril am 04 Dezember 2015, 10:27:49
Das freut mich sehr! Vielen Dank!!!
Noch ein anderer Punkt, der leider seit heute Probleme macht: Die Icons bei "data-rype=button" funktionieren bei mir seit dem letzten Update nicht mehr:
<div data-type="button" data-url="og.html" data-icon="fa-bed"></div>
--> nur ein orangener Kringel...
Grüße und danke für eure Hilfe!
Setz mal data-type="pagebutton"
Zitat von: Stril am 03 Dezember 2015, 19:09:58
Hallo!
Gibt es irgendeine Alternative zu Pagetab, um abhängig von einem Sensor-Wert oder Dummy auf eine andere URL zu gehen?
Mit Pagetab komme ich einfach nicht weiter.
<div data-type="pagetab" data-url="kamera.html" class="cell" data-device="d_Tueraktivitaet" data-get-off="0" data-get-on="1"></div>
Hier wird nur auch bei "0" weitergeleitet. Kann man das irgendwie vielleicht direkt mit Java-Script löse? Ich brauche auch nicht unbedingt einen Button - eher einen Automatismus, der im Hintergrund ein Device überwacht und dann weiterleitet.
Danke und Grüße
Phil
Voraussetzung: Die Seiten sind nach Anleitung (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_baue_ich_ein_Men.C3.BC_mit_dem_Pagetab_Widget_auf.3F) gebaut!
Dann bitte für fhem-tablet-ui.js / fhem-tablet-ui.min.js die Version von heute nehmen und noch einmal probieren.
Ein weiteres Activate dürfte jetzt nur passieren, wenn der Zustand wieder auf 0 zurück und danach auf 1 gegangen ist.
Zitat von: setstate am 04 Dezember 2015, 10:52:52
Setz mal data-type="pagebutton"
Hallo!
Pagebutton funktioniert!
Zitat von: setstate am 04 Dezember 2015, 13:48:37
Voraussetzung: Die Seiten sind nach Anleitung (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_baue_ich_ein_Men.C3.BC_mit_dem_Pagetab_Widget_auf.3F) gebaut!
Dann bitte für fhem-tablet-ui.js / fhem-tablet-ui.min.js die Version von heute nehmen und noch einmal probieren.
Ein weiteres Activate dürfte jetzt nur passieren, wenn der Zustand wieder auf 0 zurück und danach auf 1 gegangen ist.
Hallo!
Ich hatte gehofft, ich muss für die Weiterleitung nicht alles umbauen, aber das war jetzt wohl ein guter Anlass :-)
Mit Pagetab in "durchgängiger" Nutzung funktioniert auch die "sensorabhängige" Weiterleitung. Noch zeigt Firefox meine Seite nicht mehr an, aber da gehe ich jetzt mal auf die Fehlersuche...
Gruß
Phil
Zitat von: remet am 13 November 2015, 15:51:58
Würde das CircleMenu auch gerne mit Eckigen Buttons und Horizontal haben.
hat da jemand schon nen Ansatz wie das funktioniert? meine hier irgendwo mal nen Screenshot gesehen zu haben aber ich finde das nicht wieder hier im Forum.
mit fa-square als background icon werden die ecken abgerundet.
Die neuste Version vom Circlemenu kann das jetzt mit data-border="square"
<div data-type="circlemenu" data-border="square" data-item-width="50" data-item-height="50" class="circlemenu keepopen top-space">
<ul>
<li><div data-type="push" data-background-icon="fa-square-o" data-icon="fa-wrench"></div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level -6" data-background-icon="fa-square-o" data-icon="">-6</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level -2" data-background-icon="fa-square-o" data-icon="">-2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level 0" data-background-icon="fa-square-o" data-icon="">0</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level +3" data-background-icon="fa-square-o" data-icon="">2</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level +9" data-background-icon="fa-square-o" data-icon="">9</div></li>
<li><div data-type="push" data-device="AvReceiver" data-set="remoteControl" data-set-on="subwoofer-temporary-level +C" data-background-icon="fa-square-o" data-icon="">12</div></li>
</ul>
</div>
siehe
Demo (http://knowthelist.github.io/fhem/tablet/demo_circlemenu.html)
vielen Dank setstate für die Arbeit. Sieht in der Demo richtig gut aus.
leider kann ich das bei mir noch nicht umsetzten. Die eckigen Buttons werden leider immer noch von kreisen abgeschnitten.
habe ein Update bereits gemacht.
Gruß remet
Hi remet,
danke für die Rückmeldung, ich habe tatsächlich die geänderte jquery.circlemenu.js Lib vergessen hochzuladen.
thx, setsate
Hallo,
ich habe gerade zum ersten Mal installiert und gestartet.
Ist es normal, dass das example so aussieht wie im Anhang?
Wie sollte ich starten? wie sehe ich als erstes ein Erfolg?
Wetterdaten z.b.? Steckdosen?
Du musst die Daten in www/tablet kopieren. Schau mal im Wiki unter Tablet UI. Dort findest Du eine Installationsanleitung. Die Dateien kannst Du nicht losgelöst von FHEM im Browser öffnen.
Die Tablet UI habe ich via
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
dann
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
dann
shutdown restart
kann es was damit zu tun haben, dass ich
attr WEB webname fhem3
habe? nein oder?
keine Ahnung ::)
Wie rufst Du auf?
Über
http://<DEINE IP-Adresse>:8083/fhem/ftui/ ?
http://raspi3:8083/fhem3/ftui/
nach ersetzen von /fhem/ durch /fhem3/ sieht es besser aus
schwarz und text aber ich kann nichts verschieben, aber das ist wohl der Anfang
was möchtest Du denn verschieben?
Zitat von: setstate am 04 Dezember 2015, 20:52:57
Hi remet,
danke für die Rückmeldung, ich habe tatsächlich die geänderte jquery.circlemenu.js Lib vergessen hochzuladen.
thx, setsate
Vielen Dank...
gleich getestet. leider immer noch kein erfolg. neue JS wird geladen über Update all, aber es wird leider immer noch abgeschnitten.
habe deinen BeispielCode verwendet.
Gruß
@remet: Sorry, das Widget selbst (widget_circlemenu.js) war auch noch alt. Muss aber jetzt passen ... ???
Zitat von: Gunther am 04 Dezember 2015, 23:04:38
was möchtest Du denn verschieben?
Dort sind so ich denke Widgets heißen die. Die kann man per dragndrop verschieben sie rasten nur nicht ein. Oder geht das nicht? Habe noch die example HTML Datei
Gesendet von meinem Huawei Honor 7
Zitat von: xxsteffenxx am 03 Dezember 2015, 06:17:04
Hallo setstate,
nun habe ich was gefunden.
Mein Wochenprogramm schaltet nämlich auch nicht mehr---> http://forum.fhem.de/index.php/topic,44230.msg368689.html#msg368689
Hallo zusammen,
ich hab mir nun mit dieser Methode weitergeholfen.
Wenn ich "list" von meinem Thermostat mache, gibt es unter den "internals" und unter den "readings" den Wert "mode"
Dadurch das beim laden von FTUI der mode von den internals gezogen wird (1=auto / 0=manual) und beim ändern über "set desiredTemperatur auto" der Wert "mode" von den Readings gefüllt wird; habe ich meine Anzeige folgendermaßen angepasst.
<div data-type="symbol" data-device="WZ_Thermostat" data-get="mode"
data-get-on='["0","1","auto ","manual","boost"]'
data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual","oa-sani_heating_automatic","oa-sani_heating_manual","fa-spinner fa-pulse"]'
data-on-colors='["green","IndianRed","green","IndianRed","SlateBlue"]' class="bigger">somit sind alle fälle abgedeckt; boost muss ich mal schauen was das in die internals kommt :-)
Zitat von: xxsteffenxx am 03 Dezember 2015, 22:09:32
Hallo zusammen, da meine besser Hälfte nun so langsam mit meinem FTUI warm wird kommen die ersten Verbesserungsvorschläge.
Da auf dem Smartphone öfters durch das wischen die Temperatur am Thermostat verändert wird bzw. Es relativ schnell ausersehen geht stellt sich die Frage ob ich das Irgendwie über einen Button "entsperren" kann bevor die Änderungen funktionieren.
Also erst Button drücken dann kann man die Temperatur einstellen. Wurde glaub irgendwo hier schonmal gefragt als Art Code-Schloss.
Für diejenigen die sowas auch suchen; ich habs folgendermaßen gelöst
<header>Wohnzimmer</header>
<table>
<tr>
<th>
<div data-type="label" class="cell">Soll:</div>
<div data-type="label" data-device="WZ_Thermostat" data-get="desiredTemperature" data-unit="°"></div>
<div data-type="label" class="cell">Ist:</div>
<div data-type="label" data-device="WZ_Thermostat" data-get="temperature" data-unit="°"></div>
</th>
<th>
<div data-type="label" class="cell">Ventil:</div>
<div data-type="label" data-device="WZ_Thermostat" data-get="valveposition" data-unit="%"></div>
<div data-type="popup" data-height="150px" data-width="150px" data-device="WZ_Thermostat"
data-get-on="1"
data-get-off="0">
<div data-type="symbol"
data-icon="fa-cogs"
data-device="WZ_Thermostat"
data-get-on="1"
data-get-off="0"
class="big">
</div>
<div class="dialog">
<div data-type="thermostat" data-device="WZ_Thermostat"
data-valve="valveposition" data-get="desiredTemperature"
data-temp="temperature" data-set="desiredTemperature"
data-min="10" data-max="28" class="small">
</div>
</div>
</div>
</th>Beim Klick auf die Zahnräder, geht das Popup mit dem eigentlichen Thermostat Widget auf.
Was mich noch stört ist dass, das Widget so am oberen Rad klebt; das kann man bestimmt noch etwas nach unten schieben oder @setstate?
Zitat von: xxsteffenxx am 05 Dezember 2015, 10:59:30
Was mich noch stört ist dass, das Widget so am oberen Rad klebt; das kann man bestimmt noch etwas nach unten schieben?
Habe das bei mir mit CSS gelöst, indem ich dem <body> Tag folgende Styles zugewiesen habe:
<body style="
margin-top: 50px; /* Abstand nach oben */
margin-left: 50px; /* Abstand nach links, etc.*/
">
Zitat von: drhirn am 03 Dezember 2015, 15:20:25
Naja, wenn's "sicher" sein soll, könntest du ein neues FHEMWEB auf einem anderen Port erstellen (ohne basicAuth) und mittels allowfrom die IP-Adressen einschränken, die darauf zugreifen dürfen.
Danke für den Tipp! Habe ich gemacht.
Allerdings kommen (auch ohne allowfrom) leider einige Werte nicht an, zum Beispiel fehlt (oder werden erst sehr spät nachgeladen) bei einigen Thermostaten die Ventilstände, beim Kalender fehlt der letzte Eintrag und der Abfallkalender scheint überhaupt nicht laden zu wollen. Im lokalen FTUI auf dem Raspi geht alles ohne Probleme. Merkwürdig...
Zitat von: JoJota am 05 Dezember 2015, 13:40:16
Habe das bei mir mit CSS gelöst, indem ich dem <body> Tag folgende Styles zugewiesen habe:
<body style="
margin-top: 50px; /* Abstand nach oben */
margin-left: 50px; /* Abstand nach links, etc.*/
">
du kannst über die class den abstand regeln
https://github.com/knowthelist/fhem-tablet-ui/blob/master/README.md#donation abschnitt Positioning (mit class="top-space ...." macht er nach oben 15px platz)
ist beim knop widget ein farbverlauf möglich ?links bei blau starten und je mehr nach rechts gedreht wird zb auf rot wechseln?
Die gesamte Farbe ändern, geht mit einer zusätzlichen Zeile an der richtigen Stelle bestimmt. Einen Farbverlauf, dafür müsste man die ganze draw Funktion überschreiben, wie ich es beim Thermostat gemacht habe.
:o da fehlt jetzt was? nach Update??
Die orangen Icons auf oragenem Grund? Sind das data-type="button"? Dann nimm mal data-type="pagebutton" erfüllt den gleichen Zweck, ist aber gepflegt.
Danke das hat funktioniert ;D
allerdings hat sich in der Ansicht meiner Thermostate auch was geändert.
<div data-type="thermostat"
data-device="WT_Wohnzimmer"
data-valve="valveposition"
data-get="desiredTemperature"
data-temp="temperature"
data-set="desiredTemperature auto"
class="cell big top-space-2x">
</div>
bild 1 jetzt
bild 2 vorher
Ich glaube, du musst statt big jetzt large nehmen. Das habe ich vertauscht, damit es zu der Anstufung bei den Fonts passt. Die nutzen die gleichen Begriffe.
class="...large..."
ja das hatte ich gerade auch probiert ;) funktioniert
Danke für die schnelle Hilfe
Gruß Rolf
gibt eigentlich eine Möglichkeit beim circlemenu den Zentralen Button auf die jeweils angewählte Unterseite anzupassen?
Zum beispiel wenn (siehe unten) media-wohnzimmer.html angewählt ist, den Zentralen Button data-icon="fa-music" und orange???
<div data-type="circlemenu" data-direction="right-half" class="circlemenu">
<ul class="menu">
<li><div data-type="pagebutton" data-icon="rk-sofa"></div></li>
<li><div data-type="pagebutton" data-url="wohnzimmer.html" data-icon="rk-sofa"</div></li>
<li><div data-type="pagebutton" data-url="media-wohnzimmer.html" data-icon="fa-music"</div></li>
<li><div data-type="pagebutton" data-url="termine.html" data-icon="fa-calendar"</div></li>
</ul>
Gruß Rolf
Hallo zusammen,
das Modul FHT liefert bei dem Reading "actuator" die Einheit "%" mit, so dass ich bei dem Thermostat zweimal "%%" habe. Gibt es eine elegante Möglichkeit, dies zu korrigieren oder kann man das irgendwo konfigurieren?
Liebe Grüße
Andreas
Hallo,
ich habe mich heute mehrere Stunden mit meinen "Button" beschäftigt. Nun als Pagebutton machen die teile was sie wollen.
<table width="100%" height="95%"><tr width="100%">
<td width="80%">
<div data-type="pagebutton" data-device="ELRO_A" data-get="state" data-cmd="set"
data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
data-set-off="on" class="cell narrow bigger">
</div>A
<div data-type="pagebutton" data-device="ELRO_A" data-get="state" data-cmd="set"
data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
data-set-on="off" class="cell narrow bigger">
</div>
</td>
<td width="20%">
<div data-type="popup" data-height="190px" data-width="350px">
<div data-type="pagebutton" data-icon="fa-clock-o" class="cell"></div>
<div class="dialog">
<header>Startzeit-Endzeit</header>
<table width="90%" height="80%"><tr width="100%">
<td width="5%" height="50%"> An
</td>
<td width="80%" height="50%">
<div class="inline cell top" >
<div data-type="datetimepicker" data-device="Dose_A"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div>
</div>
</td>
<td width="15%" height="50%">
</td></tr>
<tr width="100%">
<td width="5%" height="50%"> Aus
</td>
<td width="80%" height="50%">
<div class="inline cell" >
<div data-type="datetimepicker" data-device="Dose_A_aus"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div></td>
<td width="15%" height="50%">
<div data-type="checkbox" data-device='timer_a'
data-get-on="!off" data-get-off="inactive"
data-set-on="active" data-set-off="inactive"
class="inline">
</div></div></td>
</div>
</tr>
</table>
</div>
</div>
</td>
</tr>
<tr width="100%">
<td width="80%">
<div data-type="pagebutton" data-device="ELRO_B" data-get="state" data-cmd="set"
data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
data-set-off="on" class="cell narrow bigger">
</div>B
<div data-type="pagebutton" data-device="ELRO_B" data-get="state" data-cmd="set"
data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
data-set-on="off" class="cell narrow bigger">
</div>
</td>
<td width="20%">
<div data-type="popup" data-height="190px" data-width="350px">
<div data-type="pagebutton" data-icon="fa-clock-o" class="cell"></div>
<div class="dialog">
<header>Startzeit-Endzeit</header>
<table width="90%" height="80%"><tr width="100%">
<td width="5%" height="50%"> An
</td>
<td width="80%" height="50%">
<div class="inline cell top" >
<div data-type="datetimepicker" data-device="Dose_B"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div>
</div>
</td>
<td width="15%" height="50%">
</td></tr>
<tr width="100%">
<td width="5%" height="50%"> Aus
</td>
<td width="80%" height="50%">
<div class="inline cell" >
<div data-type="datetimepicker" data-device="Dose_B_aus"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div></td>
<td width="15%" height="50%">
<div data-type="checkbox" data-device='timer_b'
data-get-on="!off" data-get-off="inactive"
data-set-on="active" data-set-off="inactive"
class="inline">
</div></div></td>
</div>
</tr>
</table>
</div>
</div>
</tr>
<tr width="100%">
<td width="80%">
<div data-type="pagebutton" data-device="ELRO_C" data-get="state" data-cmd="set"
data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
data-set-off="on" class="cell narrow bigger">
</div>C
<div data-type="pagebutton" data-device="ELRO_C" data-get="state" data-cmd="set"
data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
data-set-on="off" class="cell narrow bigger">
</div>
</td>
<td width="20%">
<div data-type="popup" data-height="190px" data-width="350px">
<div data-type="pagebutton" data-icon="fa-clock-o" class="cell"></div>
<div class="dialog">
<header>Startzeit-Endzeit</header>
<table width="90%" height="80%"><tr width="100%">
<td width="5%" height="50%"> An
</td>
<td width="80%" height="50%">
<div class="inline cell top" >
<div data-type="datetimepicker" data-device="Dose_C"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div>
</div>
</td>
<td width="15%" height="50%">
</td></tr>
<tr width="100%">
<td width="5%" height="50%"> Aus
</td>
<td width="80%" height="50%">
<div class="inline cell" >
<div data-type="datetimepicker" data-device="Dose_C_aus"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div></td>
<td width="15%" height="50%">
<div data-type="checkbox" data-device='timer_c'
data-get-on="!off" data-get-off="inactive"
data-set-on="active" data-set-off="inactive"
class="inline">
</div></div></td>
</div>
</tr>
</table>
</div>
</div>
</tr>
<tr width="100%">
<td width="80%">
<div data-type="pagebutton" data-device="Steckdose_ausen" data-get="state" data-cmd="set"
data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
data-set-off="on" class="cell narrow bigger">
</div>D
<div data-type="pagebutton" data-device="Steckdose_ausen" data-get="state" data-cmd="set"
data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
data-set-on="off" class="cell narrow bigger">
</div>
</td>
<td width="20%">
<div data-type="popup" data-height="190px" data-width="350px">
<div data-type="pagebutton" data-icon="fa-clock-o" class="cell"></div>
<div class="dialog">
<header>Startzeit-Endzeit</header>
<table width="90%" height="80%"><tr width="100%">
<td width="5%" height="50%"> An
</td>
<td width="80%" height="50%">
<div class="inline cell top" >
<div data-type="datetimepicker" data-device="Ausensteckdose"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div>
</div>
</td>
<td width="15%" height="50%">
</td></tr>
<tr width="100%">
<td width="5%" height="50%"> Aus
</td>
<td width="80%" height="50%">
<div class="inline cell" >
<div data-type="datetimepicker" data-device="Ausensteckdose_aus"
data-get="TIMESPEC" data-set-value="*$v" data-cmd="modify"
data-step="15"
data-datepicker="false" data-format="H:i"
class="inline bigger orange cell">
</div></td>
<td width="15%" height="50%">
<div data-type="checkbox" data-device='timer_ausen'
data-get-on="!off" data-get-off="inactive"
data-set-on="active" data-set-off="inactive"
class="inline">
</div></div></td>
</div>
</tr>
</table>
</div>
</div>
</tr>
</table>
die Button waren so angelegt das ich meine Steckdosen ein und ausschalten konnte (auch mehrfach bei Fehlern) und mir der Status angezeigt wurde egal wo ich geschalten habe.
Jetzt stimmt der Status nicht mehr und die Button beeinflussen sich gegenseitig. ich schalte einen ein und ein anderer geht mit an oder der status aller wird auf aus gesetzt.
ich bin fast am verzweifeln.
Gruß Rolf
So geht es bei mir mit einem Dummy:
<div data-type="switch" data-device="dummy1"
data-icon="fa-check" data-on-background-color="DarkGreen" data-off-background-color="lime"
data-set-off="on" class="cell narrow bigger">
</div>C
<div data-type="switch" data-device="dummy1"
data-icon="fa-ban" data-off-background-color="DarkRed" data-on-background-color="Red"
data-set-on="off" class="cell narrow bigger">
</div>
Einen Pagebutton braucht man nur zu nutzen, wenn man mit data-url auf eine andere Seite springen will und der Button sich automatisch auf ON schalten soll, wenn die hinterlegte Seite gerade der aktuellen Seite entspricht.
Zitat von: harry66 am 06 Dezember 2015, 10:43:50
gibt eigentlich eine Möglichkeit beim circlemenu den Zentralen Button auf die jeweils angewählte Unterseite anzupassen?
Zum beispiel wenn (siehe unten) media-wohnzimmer.html angewählt ist, den Zentralen Button data-icon="fa-music" und orange???
<div data-type="circlemenu" data-direction="right-half" class="circlemenu">
<ul class="menu">
<li><div data-type="pagebutton" data-icon="rk-sofa"></div></li>
<li><div data-type="pagebutton" data-url="wohnzimmer.html" data-icon="rk-sofa"</div></li>
<li><div data-type="pagebutton" data-url="media-wohnzimmer.html" data-icon="fa-music"</div></li>
<li><div data-type="pagebutton" data-url="termine.html" data-icon="fa-calendar"</div></li>
</ul>
Gruß Rolf
Mit einer kleinen Erweiterung am Pagebutton-Widget geht das easy zu realisieren:
<div data-type="circlemenu" data-direction="right-half" class="circlemenu">
<ul>
<li><div data-type="pagebutton" data-set-off="" data-set-on=""
data-states='[".*/wohnzimmer.html",".*/media-wohnzimmer.html",".*/termine.html"]'
data-icons='["fa-wrench","fa-music","fa-calendar"]'></div></li>
<li><div data-type="pagebutton" data-url="wohnzimmer.html" data-icon="fa-wrench"</div></li>
<li><div data-type="pagebutton" data-url="media-wohnzimmer.html" data-icon="fa-music"</div></li>
<li><div data-type="pagebutton" data-url="termine.html" data-icon="fa-calendar"</div></li>
</ul>
</div>
Der erste mittlere Pagebutton bekommt ein data-set-off="" data-set-on="", damit werden jegliche Drück-Aktionen unterdrückt.
Zur Änderung nutze ich Multi-State Notation: Die Muster in data-states werden mit der aktuellen URL verglichen und setzen bei Übereinstimmung die jeweiligen Definitionen von data-icons, data-background-colors, data-colors, data-background-icons.
Änderung ist im Update ...
@setstate ;D ;D ;D du bist der beste
Kleinigkeit für dich noch(damit du keine Langeweile bekommst ::)) im Browser auf dem PC funktioniert einwandfrei
Tablet geht das Circlemenu nicht auf?
Gruß Rolf
Hallo
Ich denke ich bin hier nicht richtig ich weiss es aber nicht genau
Meine frage ist
Leinwand habe ich in fhem eingebunden mit hoch und runter geht auch alles super
Aber gibt es keine stop staste
Gruss frank
Frank, definitiv! Wie lautet das Command für Stop in Fhem?
Evtl. mit einem Push-Button und Stop Icon ...
Zitat von: harry66 am 07 Dezember 2015, 14:43:12
Kleinigkeit für dich noch(damit du keine Langeweile bekommst ::)) im Browser auf dem PC funktioniert einwandfrei
Tablet geht das Circlemenu nicht auf?
Gruß Rolf
Kleine Änderung an der Basis lib brachte Verbesserung.
So wäre die Variante mit einem nicht leuchtenden Mittelbutton:
<div data-type="circlemenu" data-direction="right-half" class="circlemenu">
<ul>
<li><div data-type="pagebutton" data-set-off="" data-set-on=""
data-states='[".*/wohnzimmer.html",".*/media-wohnzimmer.html",".*/termine.html"]'
data-icons='["fa-wrench","fa-music","fa-calendar"]'
data-on-background-color="#505050"></div></li>
<li><div data-type="pagebutton" data-url="wohnzimmer.html" data-icon="fa-wrench"</div></li>
<li><div data-type="pagebutton" data-url="media-wohnzimmer.html" data-icon="fa-music"</div></li>
<li><div data-type="pagebutton" data-url="termine.html" data-icon="fa-calendar"</div></li>
</ul>
</div>
!!! 200.000 !!! Klicks - Wahnsinn dieses hohe Interesse - Vielen Dank
Zur Feier des Tages gibt es heute noch (später) ein nettes neues Feature -> Swiper
Damit kann man per Wisch zwischen mehreren Infos hin und her wechseln.
Später mehr ...
Der Swiper sieht klasse aus!
Und das hier:
Zitat von: setstate am 07 Dezember 2015, 20:17:20
!!! 200.000 !!! Klicks - Wahnsinn dieses hohe Interesse - Vielen Dank
hast Du Dir definitiv verdient.
Man merkt richtig, wie sehr Du an dem TabletUI hängst und immer prompt antwortest/erweiterst! Hut ab!
Hallo.
@setstate
Danke für Deine Hilfe, habe es wieder hinbekommen. Es dauert nur nach einem Refresh etwas bis der status stimmt. Aber bei dem Pagebutton scheint etwas nicht zu stimmen das sich die Button gegenseitig beeinflussen. Eventuell nimmt er Variablen von einem Button zum nächsten mit?
Gruß Rolf
Hallo,
gibt es eine Möglichkeit ein Menü mit pagetab Elementen ein- und auszublenden ähnlich dem jquery .slideToggle?
Gerade für Smartphone Oberflächen wäre das super um Platz zu sparen.
Danke und Gruß
Johannes
danke jetzt gehts auch auf dem Tablet.
Ich habs jetzt so am laufen durch das zusätzliche data-icon="rk-sofa" geht es im menue wenn keine Unterseite vom Wohnzimmer aktiv ist wieder auf das SofaIcon zurück. Genau so hatte ich mir das vorgestellt ;D
<div data-type="circlemenu" data-direction="right-half" class="circlemenu">
<ul class="menu">
<li><div data-type="pagebutton"
data-set-off=""
data-set-on=""
data-icon="rk-sofa"
data-states='[".*/wohnzimmer.html",".*/media-wohnzimmer.html",".*/termine.html"]'
data-icons='["rk-sofa","fa-music","fa-calendar"]'></div></li>
<li><div data-type="pagebutton" data-url="wohnzimmer.html" data-icon="rk-sofa"</div></li>
<li><div data-type="pagebutton" data-url="media-wohnzimmer.html" data-icon="fa-music"</div></li>
<li><div data-type="pagebutton" data-url="termine.html" data-icon="fa-calendar"</div></li>
</ul>
New Widget "Swiper"
Ist ein Touch Slider zum Anzeigen von mehreren Infos an einer Position, die per Touch Slide ausgewählt werden können.
Basic Schema
<div data-type="swiper" data-height="220px" data-width="400px" class="">
<ul>
<li><div class="">Page1</div></li>
<li><div class="">Page2</div></li>
<li><div class="">Page3</div></li>
<li><div class="">Page4</div></li>
<li><div class="">Page5</div></li>
</ul>
</div>
Siehe Live Demo (http://knowthelist.github.io/fhem/tablet/demo_swiper.html)
Zitat von: jojop2 am 07 Dezember 2015, 22:14:54
Hallo,
gibt es eine Möglichkeit ein Menü mit pagetab Elementen ein- und auszublenden ähnlich dem jquery .slideToggle?
Gerade für Smartphone Oberflächen wäre das super um Platz zu sparen.
Danke und Gruß
Johannes
Aktuell noch nicht, ist aber nur eine Frage der Zeit ...
Zitat von: setstate am 08 Dezember 2015, 01:53:24
New Widget "Swiper"
Ist ein Touch Slider zum Anzeigen von mehreren Infos an einer Position, die per Touch Slide ausgewählt werden können.
wenn man ihn noch autom. sliden lassen könnte wäre es sau gut.
Zitat von: chris1284 am 08 Dezember 2015, 06:18:34
wenn man ihn noch autom. sliden lassen könnte wäre es sau gut.
Die benutzte Swiper JS Lib kann ganz viel noch, auch automatischen Slide. Das werde ich noch ausforschen und die interessanten Funktionen dann als Schalter per data-* zur Verfügung stellen.
Zitat von: chris1284 am 08 Dezember 2015, 06:18:34
wenn man ihn noch autom. sliden lassen könnte wäre es sau gut.
Wäre es dann nicht ein "rotor"? OK die Punkte unten sind schon praktisch, das wäre noch eine Unterscheidung.
Ich möchte nochmal auf meine Frage zurückkommen, was muss alles geändert werden, wenn der webname vom FHEM nicht fhem sondern z.b. fhem3 ist?
Zitat von: masterpete23 am 08 Dezember 2015, 07:57:48
Ich möchte nochmal auf meine Frage zurückkommen, was muss alles geändert werden, wenn der webname vom FHEM nicht fhem sondern z.b. fhem3 ist?
Alle Verweise auf
/fhemDas heisst insbesondere in der index.html und allen anderen Dateien, die JS/CSS/Fonts/Images und so weiter laden
Ausserdem muss noch der
fhemweb_url als Metatag gesetzt werden
und natürlich die Definition des
HTTPSRV Devices
Das ist erstmal alles das mir einfällt....
Kann man das in Zukunft so einbauen das auch anderes unterstützt wird? Wo setze ich das metatag?
Gesendet von meinem Huawei Honor 7
Zitat von: masterpete23 am 08 Dezember 2015, 16:13:22
Kann man das in Zukunft so einbauen das auch anderes unterstützt wird? Wo setze ich das metatag?
Das verstehe ich nicht, es wird doch unterstützt, es wollen nur vermutlich nicht alle statt fhem fhem3 nutzen ;)
Genau dafür ist ja das meta tag da, dass jeder seinen eigenen Namen eintragen kann. Die meta tags sind gehören alle in die index.html (Einstiegsseite und alle anderen Seiten, die includes machen)
Also muss ich nur die fhem cfg und die Index HTML entsprechend anpassen?
Danke dann such ich mal wo der meta tag hin muss.
Gesendet von meinem Huawei Honor 7
Zitat von: masterpete23 am 08 Dezember 2015, 16:27:00
Also muss ich nur die fhem cfg und die Index HTML entsprechend anpassen?
Danke dann such ich mal wo der meta tag hin muss.
Wenn Du ein einfaches FTUI mit nur einer Seite (oder pagetabs) hast, ja denn dann sind die Includes üblicherweise nur im index.html.
Es gibt aber auch die Möglichkeit mehrere (unabhängige) Seiten zu haben, dann muss es dort natürlich auch geändert werden.
Wenn Du bereits eine index.html hast, dann befinden sich darin mehrere meta-Tags mit verschiedenen Angaben. Hier einfach eines mit dem fhemweb_url hinzufügen, damit FTUI weiss, wo die Daten zum FHEM abzuholen sind.
Danke das werde ich testen
So sieht das example header nun aus. Trotzdem möchte er irgendwie auf /fhem/ zugreifen nur wo
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem3/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem3/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem3/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem3/tablet/lib/jquery.toast.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<!-- link rel="stylesheet" href="/fhem3/tablet/css/fhem-green-ui.css" / -->
<link rel="stylesheet" href="/fhem3/tablet/css/fhem-tablet-ui-user.css" />
<script src="/fhem3/pgm2/jquery.min.js" defer></script>
<script src="/fhem3/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem3/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem3/tablet/js/fhem-tablet-ui.min.js" defer></script>
<!-- Remove this line to enable for usage with WebViewControl
<script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<script src="/fhem3/pgm2/cordova-2.3.0.js" defer></script>
<script src="/fhem3/pgm2/webviewcontrol.js" defer></script>
<!-- End for WebViewControl -->
<title>FHEM-Tablet-UI</title>
</head>
Hallo zusammen,
habe gerade das slider widget eingebaut; funktioniert einwandfrei!
Leider gehen aber meine pushbuttons nicht mehr?
<div data-type="swiper" data-height="130px" data-width="300px" class="top-space-1x">
<ul>
<li>
<div class="left">
<div data-type="symbol" data-device="Waschen_30" data-get-on='["on","off"]' data-icons='["oa-scene_washing_machine shake shake-constant shake-little","oa-scene_washing_machine"]' data-on-colors='["green","red"]'> </div>
<div data-type="push" data-icon="fa-play" data-cmd="set Waschen_30 on-for-timer 6840"></div>
jetzt 30°:
</div>
</li>
</ul>
</div>
</li>
Update beim Swiper Widget:
neu: data-autoplay, navbuttons, nopagination, Steuern per Device:Reading
- data-autoplay="4000" wechselt automatisch aller 4 Sekunden zur nächsten Seite
- class="navbuttons" zeigt zusätzlich Prev/Next Buttons an
- class="nopagination" erzeugt keine Page-Bullets
- Beispiel zum 'Fernsteuern' von FHEM aus. Wenn Dummy1 als STATE="Wert3" hat, springt das Widget zur 3. Seite
<div data-type="swiper" data-height="200px" data-width="250px"
data-device="dummy1"
data-states='["Wert1","Wert2","Wert3","Wert4"]'
class="top-space navbuttons nopagination">
<ul>
<li><div class="large top-space">Schlafzimmer</div><div data-type="label" data-device="SchlafzimmerHeizung_Clima" data-get="measured-temp" class="bigger thin top-space"></div></li>
<li><div class="large top-space">Kinderzimmer</div><div data-type="label" data-device="KinderzimmerHeizung_Clima" data-get="measured-temp" class="bigger thin top-space"></div></li>
<li><div class="large top-space">Bad</div><div data-type="label" data-device="BadHeizung_Clima" data-get="measured-temp" class="bigger thin top-space"></div></li>
<li><div class="large top-space">Wohnzimmer</div><div data-type="label" data-device="WohnzimmerHeizung_Clima" data-get="measured-temp" class="bigger thin top-space"></div></li>
</ul>
</div>
Steffen, ohhh. Legt mal übergangsweise irgendein data-set-on für diese Pushs fest. Ich überlege mir noch eine Lösung für den Konflikt der Parameter.
Hintergrund: Ich unterdrücke jetzt jegliche weitere Aktivität, wenn data-set-on oder data-set-off nicht gesetzt sind. Die sind beim Push aber per default nicht gesetzt.
Hi,
wie könnte man "set on for timer " mit TUi realisieren? ???
Gruß
Peter
Zitat von: Schnabelowski am 09 Dezember 2015, 00:08:46
Hi,
wie könnte man "set on for timer " mit TUi realisieren? ???
Gruß
Peter
Die Antwort geht schnell ...
Auszug aus der Readme:
**Example** for a push button to switch a lamp on for 5 minutes. The control shows a progress circle while countdown is running.
The countdown time is auto detected via the on-for-timer command. A other value can be set with the parameter data-countdown
<div data-type="push" data-device="MyLamp" data-set-on="on-for-timer 300"
class="cell" ></div>(http://knowthelist.github.io/fhem-tablet-ui/push_on-for-timer.png)
Nachtrag:ich habe gerade den Push noch etwas optimiert. Der on-for-timer count-down ist nun persistent und überlebt somit auch einen Browser Refresh.
Zitat von: setstate am 08 Dezember 2015, 20:46:47
Steffen, ohhh. Legt mal übergangsweise irgendein data-set-on für diese Pushs fest. Ich überlege mir noch eine Lösung für den Konflikt der Parameter.
Hintergrund: Ich unterdrücke jetzt jegliche weitere Aktivität, wenn data-set-on oder data-set-off nicht gesetzt sind. Die sind beim Push aber per default nicht gesetzt.
Hallo!
Leider funktioniert das bei mir auch nicht. Testweise habe ich data-set-on ergänzt:
<li><div data-type="push" data-device="aJs_OG_Schlafzimmer"
data-icon="fa-angle-down"
data-set="down" data-set-on="down">
</div></li>
--> Der Push-Button löst leider weiter nichts aus.
Hast Du noch eine Idee?
Danke und Grüße
Phil
Das kann nicht sein ... Das muss funktionieren
<li><div data-type="push" data-device="aJs_OG_Schlafzimmer"
data-icon="fa-angle-down"
data-set-on="down">
</div></li>
data-set kann man weglassen, weil ja kein Reading gesetzt wird, sondern nur STATE
könnte man "Circlemenü" Widget missbrauchen um set on-for-timer mit paar verschiedenen Werten im einem Widget zu haben?
Gruß
Zitat von: setstate am 09 Dezember 2015, 08:56:23
Das kann nicht sein ... Das muss funktionieren
<li><div data-type="push" data-device="aJs_OG_Schlafzimmer"
data-icon="fa-angle-down"
data-set-on="down">
</div></li>
data-set kann man weglassen, weil ja kein Reading gesetzt wird, sondern nur STATE
Hallo!
Wenn ich data-set weg lasse, funktioniert es.
Danke!
Push-Button-Problem
Wie schade... seit dem letzten Update (irgendwie in der Zeit vom 6.12. - 9.12) sind leider wieder einige Formatierungen recht ordentlich durcheinander gekommen. Ich habe schon jedes mal Befürchtungen, ein Update zu machen ... aber okay.. ich habe nun alles erneut nachgearbeitet und nun "passt" es wieder. Insb. die Änderungen an "fhem-tablet-ui.css" sowie "widget_push.js" waren für mich "dramatisch". Insbesondere alle "center" Formatierungen sind/waren nun verändert, warum auch immer.
Übrig geblieben ist leider ein Problem bei der (vermutlich) "widget_push.js", da ich nun im circlemenu --> push nutze und bis vor einigen Tagen alles noch funktionierte.
Bei "push" rufe ich
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 18.0"
... auf (ohne definition eines data-devices). Das hat alles bislang gut funktioniert, nur jetzt wird kein "attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 18.0" mehr ausgeführt.
Die "widget_push.js" vom 8.12. funktionierte hingegen noch.
<ul class="menu">
<li><div data-type="push" data-icon="fa-wrench"></div></li>
<li><div data-type="push"
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 16.0"
style="color: #E6E6E6"
data-icon="">16</div></li>
<li><div data-type="push"
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 18.0"
style="color: #E6E6E6"
data-icon="">18</div></li>
<li><div data-type="push"
data-cmd="attr"
style="color: #E6E6E6"
data-set="Heizung.Regler.HM.Wohnzimmer heizung_hightemp 19.0"
data-icon="">19</div></li>
<li><div data-type="push"
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 20.0"
style="color: #E6E6E6"
data-icon="">20</div></li>
<li><div data-type="push"
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 21.0"
style="color: #F02020"
data-icon="">21</div></li>
<li><div data-type="push"
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 22.0"
style="color: #E6E6E6"
data-icon="">22</div></li>
<li><div data-type="push"
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 23.0"
style="color: #E6E6E6"
data-icon="">23</div></li>
</ul>
Gibt's eine Alternative, um hier "attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp .." zu setzen ?
Nachtrag:
Habe nun weiter im Detail nachgesehen. Die Probleme mit dem "push"-Widget liegen explizit am widget_famultibutton.
Konkret an den Änderungen zwischen dem 8.12 und jetzt:
Anbei die "diff" zwischen beiden Versionen:
root@fhem-server:/daten/backup/opt/fhem/www/tablet/js# diff widget_famultibutton.js /opt/fhem/www/tablet/js/widget_famultibutton.js
121c121,124
< if(this._doubleclicked(elem, 'on')) {
---
> if (elem.data('set-on')===''){
> elem.setOff();
> }
> else if(this._doubleclicked(elem, 'on')) {
Viele Grüße!
Andreas
Hallo setstate,
habe auch ein Problem mit dem Layout seit dem Update (bin aber nicht so fit wie fhem-challenge).
Als Beispiel - OG_BAD_Fe und OG_BAD_LiSpi - bis vor kurzem alles in Ordnung, heute sehe ich das Fenster und die Lampe nicht mehr.
Wenn ich das Grid vergrößere sind die beiden Widgets nach unten gerutscht.
Kannst Du mir einen Tipp geben?
<li data-row="1" data-col="3" data-sizex="2" data-sizey="1">
<header>BAD</header>
<div data-type="thermostat" data-device="OG_BAD_RT" data-valve="humidity" class="cell left"></div>
<div data-type="popup" data-width="800px" data-height="250px" class="inline">
<div class="cell left" data-type="symbol"
data-device="OG_BAD_Fe"
data-get-on='["open","tilted","closed"]'
data-icons='["oa-fts_window_1w_open","oa-fts_window_1w_tilt","oa-fts_window_1w"]'
data-on-colors='["Red","Yellow","Green"]'>
</div>
<div class="cell narrow readonly" data-type="switch" data-device="OG_BAD_LiSpi" ></div>
<div class="dialog">
<header>Bad</header>
<div class="left left-space top-space" >
<div data-type="simplechart"
Gruß und schon mal Danke
Michael
Zitat von: MichaelT am 09 Dezember 2015, 11:32:35
Hallo setstate,
habe auch ein Problem mit dem Layout seit dem Update (bin aber nicht so fit wie fhem-challenge).
Als Beispiel - OG_BAD_Fe und OG_BAD_LiSpi - bis vor kurzem alles in Ordnung, heute sehe ich das Fenster und die Lampe nicht mehr.
Wenn ich das Grid vergrößere sind die beiden Widgets nach unten gerutscht.
Kannst Du mir einen Tipp geben?
<li data-row="1" data-col="3" data-sizex="2" data-sizey="1">
<header>BAD</header>
<div data-type="thermostat" data-device="OG_BAD_RT" data-valve="humidity" class="cell left"></div>
<div data-type="popup" data-width="800px" data-height="250px" class="inline">
<div class="cell left" data-type="symbol"
data-device="OG_BAD_Fe"
data-get-on='["open","tilted","closed"]'
data-icons='["oa-fts_window_1w_open","oa-fts_window_1w_tilt","oa-fts_window_1w"]'
data-on-colors='["Red","Yellow","Green"]'>
</div>
<div class="cell narrow readonly" data-type="switch" data-device="OG_BAD_LiSpi" ></div>
<div class="dialog">
<header>Bad</header>
<div class="left left-space top-space" >
<div data-type="simplechart"
Gruß und schon mal Danke
Michael
bei mir hat das Weglassen einiger "center" sowie das Weglassen der "left" Classes geholfen.
Vorher (beispielhaft): <div class="cell left ">
Nachher: <div class="cell"> ... damit war die Formatierung (zumindest bei mir) wieder korrekt.
Die offiziell unterstütze Parameternutzung wäre auch so gewesen:
<div data-type="push"
data-cmd="attr"
data-device="Heizung.Regler.HM.Wohnzimmer"
data-set="heizung_hightemp"
data-set-on="18.0">
</div>
Dann klappt es.
Was zur Zeit nicht klappt ist die Nutzung von: data-fhem-cmd.
Das benutze ich bei mir nicht und wurde deswegen von mir übersehen.
Wird aber gleich repariert ...
Zitat von: xxsteffenxx am 08 Dezember 2015, 20:22:45
Hallo zusammen,
habe gerade das slider widget eingebaut; funktioniert einwandfrei!
Leider gehen aber meine pushbuttons nicht mehr?
<div data-type="swiper" data-height="130px" data-width="300px" class="top-space-1x">
<ul>
<li>
<div class="left">
<div data-type="symbol" data-device="Waschen_30" data-get-on='["on","off"]' data-icons='["oa-scene_washing_machine shake shake-constant shake-little","oa-scene_washing_machine"]' data-on-colors='["green","red"]'> </div>
<div data-type="push" data-icon="fa-play" data-cmd="set Waschen_30 on-for-timer 6840"></div>
jetzt 30°:
</div>
</li>
</ul>
</div>
</li>
data-cmd ist wirklich nur für das Command wie 'set', 'setstate', 'setreading' nicht für die ganze Commandzeile:
So würde es funktionieren:
<div data-type="push" data-icon="fa-play" data-device="Waschen_30" data-set-on="on-for-timer 6840"></div>
Zitat von: setstate am 09 Dezember 2015, 11:59:45
Die offiziell unterstütze Parameternutzung wäre auch so gewesen:
<div data-type="push"
data-cmd="attr"
data-device="Heizung.Regler.HM.Wohnzimmer"
data-set="heizung_hightemp"
data-set-on="18.0">
</div>
Dann klappt es.
Was zur Zeit nicht klappt ist die Nutzung von: data-fhem-cmd.
Das benutze ich bei mir nicht und wurde deswegen von mir übersehen.
Wird aber gleich repariert ...
Prima: mit dem Update heute (jetzt) funktioniert es. Das komplette Command:
data-cmd="attr Heizung.Regler.HM.Wohnzimmer heizung_hightemp 16.0
... läuft wieder.
Viele Grüße!
Andreas
Zitat von: fhem-challenge am 09 Dezember 2015, 11:36:41
bei mir hat das Weglassen einiger "center" sowie das Weglassen der "left" Classes geholfen.
Vorher (beispielhaft): <div class="cell left ">
Nachher: <div class="cell"> ... damit war die Formatierung (zumindest bei mir) wieder korrekt.
Hallo fhem-challenge,
hilft leider nicht. Es sieht fast so aus, als wenn irgendetwas breiter geworden ist und somit ein Umbruch ins Layout kommt.
Komischer Weise ist die Darstellung im Chrome (PC) gegenüber Chrome (android) immer noch korrekt.
Ist es möglich, das Layout von "vorher" anders zu erreichen?
Ich hab's mit dem Layout noch nicht so richtig verstanden.
Zitat von: setstate am 24 November 2015, 23:44:56
Hier eine Demo-Page zum Widget: http://knowthelist.github.io/fhem/tablet/demo_range.html
Schaut echt fein aus! Man kann aber noch keine Skaleneinteilung festlegen, oder?
Vielleicht hab ich's auch einfach noch nicht gefunden...
Zitat von: MichaelT am 09 Dezember 2015, 14:32:04
Ist es möglich, das Layout von "vorher" anders zu erreichen?
Bei mir war es so, dass das wiederherstellen der css-Datei gereicht hat.
In dem Ordner restoreDir/DATUM/www/tablet/css (innerhalb des fhem-Installationsordners) findest Du das Backup von den Dateien vor dem Update.
Ich habe mir bisher nicht die Mühe gemacht, die alte mit der neuen fhem-tablet-ui.css zu vergleichen, weil ich noch nicht dazu kam. Wenn Du aber die alte Datei nimmst und die neue überschreibst, hast Du css-Technisch den Stand von vor dem Update. Beim nächsten Update wird die dann natürlich wieder überschrieben.
@setstate:
Evtl. wäre es besser alte css-Klassen nicht einfach zu streichen bzw. anzupassen, da einige wohl alles mit den bestehenden Klassen ausgerichtet/optimiert haben. Das war das erste Mal, dass mir das aufgefallen ist, und es war vielleicht ein Ausnahmefall. Ich habe aber noch nicht so viele Updates hinter mir ;)
Hallo,
eigene Einstellungen am css gehören in eine eigene Datei. FTUI hat dafür die folgende Zeile in der Datei index-example.html.
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
Diese Zeile in Head der hmtl-Dateien hinterlegen und die eigenen Änderungen am css dann in der Datei fhem-tablet-ui-user.css schreiben. So bleiben die Änderungen beim Update erhalten.
VG
Sven
Hallo Zusammen,
Zitat von: FunkOdyssey am 01 Dezember 2015, 18:02:35
Habt ihr zufällig eine Idee, ob man so eine Art Codeschloss über das UI abbilden kann?
Ehrlich gesagt habe ich aber auch noch keine Idee, wie der Backend dazu in FHEM aussehen soll. :-)
Ich sammel gerade Ideen. Danke.
Diese Idee würde ich gern nochmal aufgreifen. Ich würde so ein Codeschloss-Widget auch gern zur Unscharfschaltung einer Alarmanlage nutzen.
D.h. wenn jemand in den den gesicherten Bereich kommt, ertönt ein Signal und auf dem Tablet und es könnte per popup-widget ein Codeschloss eingeblendet werden.
Leider fehlt mir absolut das Know-How ein Widget zu erstellen. Idealerweise würde man in Zusammenarbeit mit dem Residentsmodul ein PIN pro Bewohner hinterlegen und mit dem Codschloss-Widget verarbeiten. Aber auch die einfachere Variante mit einem Code auf einem Dummydevice wäre sehr hilfreich.
Hat jemand eine Idee dazu wie man das lösen könnte ?
Schöne Grüße
Jens
Hallo,
na da hätte ich mal früher hier lesen sollen.
Ich habe nun auch etliche Stunden damit zugebracht mein Layout wieder herzustellen. Warum wurden den die css-Classen verändert ?
Ist das auch irgendwo dokumentiert, damit man das nächste mal vorher weiß was so ein Update für Arbeit machen kann ?
Nebei nochmal ein Push Problem:
<div data-type="push" data-device="Spion" data-cmd="get" data-set-on="image" data-icon="fa-camera"
data-off-color="#FFFFFF" data-doubleclick="0" data-on-color="#00FF00" style="font-size:40px" class="left"> </div>
Warum setzt dieser Button zwar laut Einblendung richtigerweise ein "get Spion image" ab, aber es kommt in fhem nicht an !
Der Event Monitor zeigt mir den Befehls Empfang nicht an. Und die "Spion-Webcam" reagiert natürlich auch nicht. Wenn ich in fhem dann "get Spion image" absetzte ist alles chick !
Hängt das auch mit dem update der push.js zusammen ?
---Skusi
Zitat von: MichaelT am 09 Dezember 2015, 14:32:04
Hallo fhem-challenge,
hilft leider nicht. Es sieht fast so aus, als wenn irgendetwas breiter geworden ist und somit ein Umbruch ins Layout kommt.
Komischer Weise ist die Darstellung im Chrome (PC) gegenüber Chrome (android) immer noch korrekt.
Ist es möglich, das Layout von "vorher" anders zu erreichen?
Ich hab's mit dem Layout noch nicht so richtig verstanden.
Schick mir mal den <li> Teil der nicht passt und Deine Werte bei widget_base_width und widget_base_height, dann kann ich das bei mir nachstellen.
Die alte Version vom CSS zurückspielen ist keine gute Lösung, besser ist, die zu viel benutzen Klassen zu entrümpeln.
Zitat von: SvenJust am 09 Dezember 2015, 16:44:29
Hallo,
eigene Einstellungen am css gehören in eine eigene Datei. FTUI hat dafür die folgende Zeile in der Datei index-example.html.
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
Diese Zeile in Head der hmtl-Dateien hinterlegen und die eigenen Änderungen am css dann in der Datei fhem-tablet-ui-user.css schreiben. So bleiben die Änderungen beim Update erhalten.
VG
Sven
Da bin ich ganz bei Dir und so mache ich das auch, bloß dass in diesem Fall nicht eigene Änderungen sondern css-Klasse geändert wurden, die vorher im Standard drin waren:
Zitat von: setstate am 06 Dezember 2015, 10:23:17
Ich glaube, du musst statt big jetzt large nehmen. Das habe ich vertauscht, damit es zu der Anstufung bei den Fonts passt. Die nutzen die gleichen Begriffe.
class="...large..."
Zitat von: Skusi am 09 Dezember 2015, 16:52:06
Nebei nochmal ein Push Problem:
<div data-type="push" data-device="Spion" data-cmd="get" data-set-on="image" data-icon="fa-camera"
data-off-color="#FFFFFF" data-doubleclick="0" data-on-color="#00FF00" style="font-size:40px" class="left"> </div>
Warum setzt dieser Button zwar laut Einblendung richtigerweise ein "get Spion image" ab, aber es kommt in fhem nicht an !
Der Event Monitor zeigt mir den Befehls Empfang nicht an. Und die "Spion-Webcam" reagiert natürlich auch nicht. Wenn ich in fhem dann "get Spion image" absetzte ist alles chick !
Hängt das auch mit dem update der push.js zusammen ?
---Skusi
Kommt bei mir im FHEM log an:
2015.12.09 17:04:06 4: HTTP FHEMWEB:xxx.xxx.xxx.xxx:xxxxx GET /fhem/?cmd=get+Spion++image&XHR=1
Stört evtl. das doppelte Leerzeichen zwischen Spion und image?
send to FHEM: get Spion image
ZitatKommt bei mir im FHEM log an:
2015.12.09 17:04:06 4: HTTP FHEMWEB:xxx.xxx.xxx.xxx:xxxxx GET /fhem/?cmd=get+Spion++image&XHR=1
Bei mir ist nix dergleichen zu verzeichnen. Woran kann das nun liegen ? Alles andere funktioniert ja. Also ein globales Problem schließe ich aus.
Ist die definition also so korrekt !?
ZitatStört evtl. das doppelte Leerzeichen zwischen Spion und image?
Ich denke schon das das stört. Aber wo kommt das nun wieder her. In meiner def Zeile ist doch auch keins versteckt !
Zitat von: setstate am 09 Dezember 2015, 16:58:04
Schick mir mal den <li> Teil der nicht passt und Deine Werte bei widget_base_width und widget_base_height, dann kann ich das bei mir nachstellen.
Die alte Version vom CSS zurückspielen ist keine gute Lösung, besser ist, die zu viel benutzen Klassen zu entrümpeln.
Hallo Mario,
anbei meine reduzierte index.html. Hiermit ist mein Problem auch auf dem Chrome (PC) sichtbar.
Habe ...user.css auskommentiert.
Gruß Michael
Ich habe leider heute auch upgedatet.
Seitdem sind ein paar Icons leer.
Wie kann man das beheben?
Zitat von: MichaelT am 09 Dezember 2015, 18:22:14
Hallo Mario,
anbei meine reduzierte index.html. Hiermit ist mein Problem auch auf dem Chrome (PC) sichtbar.
Habe ...user.css auskommentiert.
Gruß Michael
zwei kleine Änderungen sind nötig:
Zeile 74,75
<div data-type="popup" data-width="800px" data-height="250px" class="">
<div class="left left-space" data-type="symbol"
Das inline bewirkte, dass das popup mit dem Thermostat in eine Reihe sollte, der Platz aber nicht ausreichte und es damit zu einem Zeilenumbruch kommt, die Symbole also nach unten verschwinden.
Zitat von: netbus am 09 Dezember 2015, 18:55:44
Wie kann man das beheben?
Indem du es wieder ganz machst ;-)
Wenn ich etwas mehr Infos bekomme, könnte ich vllt. auch helfen :-)
Zitat von: setstate am 09 Dezember 2015, 19:08:42
Indem du es wieder ganz machst ;-)
Wenn ich etwas mehr Infos bekomme, könnte ich vllt. auch helfen :-)
habe das gleiche problem seit gestern. einige font-awesome icons werden einfach nicht mehr angezeigt. unteranderem fa-music und fa-amazon.
ganz toll wäre wenn du die icons der V 4.5 integrieren könntest
danke
grüße
EDIT:setze mal gerade die webconsole drauf an xD
EDIT:
setze mal gerade die webconsole drauf an xD
[/quote]
konsole ist leer...
font-awesome.min.css und fontawesome-webfont.svg sehen so weit gut aus... also haben inhalt... getestet mit fa-amazon. (adblocker ist aus 8) )
weiter weiß ich jetzt aber nicht mehr
Zitat von: roman1528 am 09 Dezember 2015, 19:34:28
habe das gleiche problem seit gestern. einige font-awesome icons werden einfach nicht mehr angezeigt. unteranderem fa-music und fa-amazon.
ganz toll wäre wenn du die icons der V 4.5 integrieren könntest
danke
grüße
EDIT:
setze mal gerade die webconsole drauf an xD
ich vermute eher, dass Icon und Backround die gleiche Farbe haben und deshalb nicht sichtbar sind
Zitat von: setstate am 09 Dezember 2015, 19:08:42
Wenn ich etwas mehr Infos bekomme, könnte ich vllt. auch helfen :-)
Welche Infos brauchst du?
index.html
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu_right_main.html"></li>
<html>
<body>
<header>MENU</header>
<div class="cell">
<div data-type="button" data-url="index.html" data-icon="fa-home" class="cell small"></div>
<div data-type="label" class="cell darker">Home</div>
<div data-type="button" data-url="kalender.html" data-icon="fa-calendar" class="cell small"></div>
<div data-type="label" class="cell darker">Kalender</div>
<div data-type="button" data-url="wetter.html" data-icon="fa-sun-o" class="cell small"></div>
<div data-type="label" class="cell darker">Wetter</div>
<div style="font-size:30px" data-type="clock" data-format="H:i" class="cell small"></div>
<div style="font-size:30px" data-type="label" data-device="Aussentemp"
data-part="2" data-limits='[-73,10,23]' data-colors='["#6699FF","#AA6900","#FF0000"]' data-unit="%B0C%0A" class="cell small"></div>
</div>
</body>
</html>
Hier ein neues DEMO (http://knowthelist.github.io/fhem/tablet/demo_tabs_with_swiper.html#room1), wie man mit Link-Widget und Swiper-Widget eine Alternative zum Pagetab bauen kann.
@netbus: bekanntes Thema.
statt button -> pagebutton benutzen.
Zitat von: setstate am 09 Dezember 2015, 20:30:41
@netbus: bekanntes Thema.
statt button -> pagebutton benutzen.
Mit pagebutton ist jetzt mein ganzes Design zerschossen.
Auf was muss man jetzt wieder aufpassen? >:(
Hi,
HAMMER geniale UI!!!!!
Ich bin gerade dabei mir meine Tablet UI zu bauen und "spiele" mit dem swipe
Ich habe meine einzelnen Element in separate *.html Dateien verpackt ... Ist es Möglich in Swipe auch eine Datei ähnlich wie bei data-template zu referenzieren?
So oder so ähnlich:
<html>
<body>
<div data-type="swiper"
data-states='["Wert1","Wert2","Wert3","Wert4"]'
class="navbuttons nopagination">
<ul>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_0_34.html"></li>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_1_34.html"></li>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_2_34.html"></li>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_3_34.html"></li>
</ul>
</div>
</body>
</html>
Das mach den Code bei längeren Elemente die gewechselt werden sollen übersichtlicher :)
Grüße,
Stephan
Zitat von: netbus am 09 Dezember 2015, 20:52:58
Mit pagebutton ist jetzt mein ganzes Design zerschossen.
Auf was muss man jetzt wieder aufpassen? >:(
Am Layout sollte sich dabei nicht ändern.
Nur aus data-type="button" data-type="pagebutton" machen und dabei aufpassen, dass die " immer schön vollständig sind und auch keine > oder < weggelöscht werden.
sorry habe da nochmal ne verständnis-anfängerfrage.
Ich habe nun folgendes aber der Schalter bringt das Licht nicht zum Schalten - was kann ich tun? ist es korrekt?
<li data-row="1" data-col="8" data-sizex="1" data-sizey="1">
<header>GALERIE</header>
<div data-type="switch" data-device="Licht_wzg" class="cell"></div>
<div data-type="label" class="cell">Licht</div>
<div data-get-on="on" data-get-off="off"></div>
</li>
und
Internals:
00 00
DEF 0FFFFF0FFF FF 00
IODev nanoCUL_433
NAME Licht_wzg
NR 97
STATE off
TYPE IT
XMIT 0fffff0fff
XMITdimdown 00
XMITdimup 00
XMITon ff
Code:
1 0fffff0fff
Readings:
2015-11-20 20:17:18 protocol V1
2015-12-09 22:00:51 state off
Attributes:
IODev nanoCUL_433
room IT
Zitat von: CaptainHook am 09 Dezember 2015, 21:10:53
Hi,
HAMMER geniale UI!!!!!
Ich bin gerade dabei mir meine Tablet UI zu bauen und "spiele" mit dem swipe
Ich habe meine einzelnen Element in separate *.html Dateien verpackt ... Ist es Möglich in Swipe auch eine Datei ähnlich wie bei data-template zu referenzieren?
So oder so ähnlich:
<html>
<body>
<div data-type="swiper"
data-states='["Wert1","Wert2","Wert3","Wert4"]'
class="navbuttons nopagination">
<ul>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_0_34.html"></li>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_1_34.html"></li>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_2_34.html"></li>
<li data-sizex="4" data-sizey="4" data-template="./bricks/FC_Wetter_3_34.html"></li>
</ul>
</div>
</body>
</html>
Das mach den Code bei längeren Elemente die gewechselt werden sollen übersichtlicher :)
Grüße,
Stephan
ja, genau so geht das. Nur die data-sizex="4" data-sizey="4" braucht es nicht. Das ist nur für die <li> der Gridster Auflistung nötig.
Zitat von: masterpete23 am 09 Dezember 2015, 22:01:25
sorry habe da nochmal ne verständnis-anfängerfrage.
Ich habe nun folgendes aber der Schalter bringt das Licht nicht zum Schalten - was kann ich tun? ist es korrekt?
Fast ...
<li data-row="1" data-col="8" data-sizex="1" data-sizey="1">
<header>GALERIE</header>
<div data-type="switch" data-device="Licht_wzg" class="cell"></div>
<div>Licht</div>
</li>
reicht.
data-get-on="on" data-get-off="off" müsste mit in das DIV des SWITCH
<div data-type="switch" data-device="Licht_wzg" data-get-on="on" data-get-off="off" class="cell"></div>Aber schalten sollte es so oder so.
Habe nochmal weiter oben gelesen und mein Prob gefunden
<meta name="fhemweb_url" content="http:///wdqwfegegwegewwegewfwwefwef.no-ip.info/fhem33">
das hat mir geholfen.
ich kann das jetzt entweder auf meine lokalen adresse oder die dyndns legen.
Es geht nicht beides oder?
Habe nochmal weiter oben gelesen und mein Prob gefunden
<meta name="fhemweb_url" content="http:///wdqwfegegwegewwegewfwwefwef.no-ip.info/fhem33">
das hat mir geholfen.
ich kann das jetzt entweder auf meine lokalen adresse oder die dyndns legen.
Es geht nicht beides oder?
Zitat von: setstate am 09 Dezember 2015, 22:07:06
ja, genau so geht das. Nur die data-sizex="4" data-sizey="4" braucht es nicht. Das ist nur für die <li> der Gridster Auflistung nötig.
Ich habe jetzt 3 Varianten Ausprobiert
<li data-template="http://x.x.x.x:8083/fhem/ftui/bricks/FC_Wetter_0_34.html"></li>
<li data-template="./bricks/FC_Wetter_0_34.html"></li>
<li data-template="FC_Wetter_0_34.html"></li>
Keine davon klappt :(
Wenn ich den Inhalt der Dateien direkt zwischen <li></li> kopiere funktioniert es super ... Dann hat die Datei aber 2078 Zeilen 8)
Irgendeine Idee was ich falsch mache?
Grüße,
Stephan
Variante 2 (File ist im gleichen Folder) und 3 (File ist im Subfolder) sollten funktionieren. Macht es bei mir, gerade probiert.
Wie sieht die Template Datei aus?
Das was zwischen die <li></li> soll, muss im Template zwischen <html><body></body></html>
Bei der Template-Funktion fehlte immer noch die Möglichkeit, Parameter zu übergeben, das würde das Template noch generischer machen. Überlegt - getan.
Templates können jetzt auch Placeholder für Parameter enthalten.
Beispiel:
<div data-type="swiper" data-height="250px" data-width="450px">
<ul>
<li data-template="templates/wetter.html" data-parameter='{"par01":"fc0_tempMax","par02":"fc0_weatherDay","par03":"fc0_tempMin","par04":"fc0_date"}'></li>
<li data-template="templates/wetter.html" data-parameter='{"par01":"fc1_tempMax","par02":"fc1_weatherDay","par03":"fc1_tempMin","par04":"fc1_date"}'></li>
<li data-template="templates/wetter.html" data-parameter='{"par01":"fc2_tempMax","par02":"fc2_weatherDay","par03":"fc2_tempMin","par04":"fc2_date"}'></li>
<li data-template="templates/wetter.html" data-parameter='{"par01":"fc3_tempMax","par02":"fc3_weatherDay","par03":"fc3_tempMin","par04":"fc3_date"}'></li>
</ul>
</div>
Das Template:
<html>
<body>
<div class="left">
<div data-type="label" data-device="AgroWeather" data-get="par01" data-unit="°C " class="bottom gigantic inline verticalLine"></div>
<div class="inline">
<div data-type="label" data-device="AgroWeather" data-get="par02" class="large cell"></div>
<div data-type="weather" data-device="AgroWeather" data-get="par02" class="bigplus thin"></div>
min: <div data-type="label" data-device="AgroWeather" data-get="par03" data-unit="%B0C%0A" class="inline medium"></div>
</div>
</div><div class="row"></div>
<div class="left">
<div data-type="label" data-device="AgroWeather" data-get="par04" data-substitution="toDate().eeee()+','" class="left large cell darker"></div>
<div data-type="label" data-device="AgroWeather" data-get="par04" data-substitution="toDate().ddmm()" class="left large cell darker"></div>
</div>
</body>
</html>
Zitat von: masterpete23 am 09 Dezember 2015, 22:31:24
Es geht nicht beides oder?
geht beides. du kannst entweder eine 2. TUI in fhem definieren die ein anderes verzeichnis hat (Nachteil du musst 2 pflegen) oder
du erstellst eine 2. index.html mit der externen definition. so musst du nur 2 index pflegen und von innen index.html aufrufen und von außen index2.html .
du kannst aber auch einen apache installieren und einen reverseproxy konfigurieren der alle anfragen von außen intern umlenkt. dann brauchts du nur die lokale adresse in der ui
http://fhemwiki.de/wiki/Apache_Authentication_Proxy quasi nur step 2 und 3.
absichern dann einfach über apache mit htaccess
Zitat von: chris1284 am 10 Dezember 2015, 06:30:27
geht beides. du kannst entweder eine 2. TUI in fhem definieren die ein anderes verzeichnis hat (Nachteil du musst 2 pflegen) oder
du erstellst eine 2. index.html mit der externen definition. so musst du nur 2 index pflegen und von innen index.html aufrufen und von außen index2.html .
du kannst aber auch einen apache installieren und einen reverseproxy konfigurieren der alle anfragen von außen intern umlenkt. dann brauchts du nur die lokale adresse in der ui
http://fhemwiki.de/wiki/Apache_Authentication_Proxy quasi nur step 2 und 3.
absichern dann einfach über apache mit htaccess
Danke das dachte ich mir schon.
Ich habe nginx im Einsatz und dachte auch das es klappt. Aber das ist nicht so wild da komm ich später mal ran.
Ist es nur die index.html?
ich muss das doch in den möglichen Unterseiten auch setzen oder?
Zitat von: setstate am 09 Dezember 2015, 22:54:48
Variante 2 (File ist im gleichen Folder) und 3 (File ist im Subfolder) sollten funktionieren. Macht es bei mir, gerade probiert.
Wie sieht die Template Datei aus?
Das was zwischen die <li></li> soll, muss im Template zwischen <html><body></body></html>
Hi ,
Vielen Dank für deine Hilfe ;) Das "./" war das Problem ... so funktioniert es DANKE
<li data-template="bricks/FC_Wetter_0_34.html"></li>Die Idee mit dem parametrierbaren Templates finde ich super!
Ich hätte noch eine Idee diese noch generischer zu machen:
Wäre es auch möglich nur einen Teil des Readings als Parameter zu übergeben?
€dit: --Anpassung --
So in der Art:
<div data-type="swiper" data-height="250px" data-width="450px">
<ul>
<li data-template="templates/wetter.html" data-parameter='{"#!par01#!":"fc0", ..... }'></li>
</ul>
</div>Und genutzt wird es so :
<div data-type="label" data-device="AgroWeather" data-get="#!par01!#_tempMax" data-unit="°C ".... />
<div data-type="label" data-device="AgroWeather" data-get="#!par01!#_tempMin" data-unit="°C ".... />
<div data-type="label" data-device="AgroWeather" data-get="#!par01!#_tempAvg" data-unit="°C ".... />
Der Teil zwischen #! !# und die Zeichen selbst werden durch den Parameter ersetzt. Das spart Parameter und es wurd übersichtlicher ;)
Grüße,
Stephan
€dit:
Wenn dich die Änderung auf github richtig verstehe, würde meine Idee schon funktionieren.
Du ersatz einfach alle vorkommen von 'par01' durch den gewünschten Wert.
data = data.replace(new RegExp(key, 'g'), parValues[key]); Wenn ich also als key "#!par01!# nutze sollte das Problemlos Funktionieren ;) ... SEHR GEIL!!!!
Zitat von: setstate am 09 Dezember 2015, 20:25:39
Hier ein neues DEMO (http://knowthelist.github.io/fhem/tablet/demo_tabs_with_swiper.html#room1), wie man mit Link-Widget und Swiper-Widget eine Alternative zum Pagetab bauen kann.
Hi,
danke für die Demo, ist schon klasse was hier so alles geht.
Beim Spielen in der Demo ist mir aufgefallen, dass wenn man die Temperatur verstellen will mit der Maus, der anfängt zu swipen wenn man direkt mit gedrückter Maustaste links-rechts bewegt. Fährt man als erstes bei gedrückter Maustaste etwas hoch/runter und dann links/rechts beim Thermostat passts.
Aktuell bin ich bei meinen ersten Schritten mit der GUI und noch in der Konzeptphase. Bei dem Thema mit den "leeren" Buttons bei fa-icons bin ich auch vorgestern reingefallen - und es war die Hintergrund-/Textfarbe.
Danke für die tolle Arbeit!
Viele Grüße
Zitat von: setstate am 10 Dezember 2015, 01:03:01
Bei der Template-Funktion fehlte immer noch die Möglichkeit, Parameter zu übergeben, das würde das Template noch generischer machen. Überlegt - getan.
Templates können jetzt auch Placeholder für Parameter enthalten.
Herrlich!
Jetzt kann ich endlich mein Generatorskript in die Tonne werfen.
Von unterwegs gesendet.
Übrigens, was mir beim Swipe-Widget aufgefallen ist:
Wenn man ein "autoplay" definiert und dann manuell durch die Seiten swipet, dann hört danach das Autoplay auf.
Ich weiß zwar nicht, ob das ein Feature sein soll, aber bei meinem Setup ist das ein bissl unglücklich. Ich hab einen RasPi mit Touchscreen, der beim Booten einen Browser im Kiosk-Mode startet. Wenn ich nun manuell eingreife, dann stoppt das Autoplay. Auf meiner FTUI-Seite (ist nur 1 Seite, keine Untermenüs) ist jedoch kein Page-Reload-Button (will ich aus optischen Gründen eigentlich auch nicht). Somit bleibt mir nix anderes übrig, als den Pi neu zu starten.
setstate, meinst man kann das ändern? Ich hab leider von der Systematik vom FTUI, bzw. JS zu wenig Plan, um die autoplay-Schleife, bzw. deren Trigger zu verstehen. Vermutlich durch irgendwas wie onload(), oder? Wäre da nicht z.B. ein Retrigger bei vielleicht onmouseout() oder so sinnvoll?
Frage 2:
Beim Range-Widget könnte ich mir auch ein paar weitere Features vorstellen:
- Eine definierbare Skaleneinteilung.
- Ein Parameter um anzugeben, ob die Skaleneinteilung links oder rechts vom Balken oder "unsichtbar" stehen soll. Damit könnten man z.B. auch zwischen 2 Balken mittig die Skala layouten.
- eine "warn"-class, bei der Unterschreitung eines Werts der Balken zu Blinken beginnt.
So, wieder einmal nur Forderungen, Forderungen, Forderungen, ich weiß. Ich geh dann Mal lieber schnell ein bissl was "Donieren". Gehört sich so!
Zitat von: tomster am 10 Dezember 2015, 10:17:23
- Ein Parameter um anzugeben, ob die Skaleneinteilung links oder rechts vom Balken oder "unsichtbar" stehen soll. Damit könnten man z.B. auch zwischen 2 Balken mittig die Skala layouten.
wo ist der Unterschiede zwischen "unsichtbar" und "keine"?
Zitat von: setstate am 09 Dezember 2015, 16:58:04
Die alte Version vom CSS zurückspielen ist keine gute Lösung, besser ist, die zu viel benutzen Klassen zu entrümpeln.
Da stimme ich Dir definitiv zu, dass ein Entrümpeln sauberer wäre.
Ich hatte aber bisher nicht die Zeit bei mir nach den einzelnen Unterschieden zu suchen. Da das Layout nach dem Update ziemlich verbogen aussah und ich keine Ahnung hatte, was alles angepasst/korrigiert werden muss, war das Einspielen der alten CSS die schnellere Lösung.
PS: Respekt, was für eine Geduld Du haben musst, so lange wie das Posten eines Beitrags hier im Thread dauert ;)
Zitat von: Nobby1805 am 10 Dezember 2015, 11:09:01
wo ist der Unterschiede zwischen "unsichtbar" und "keine"?
Momentan wird durch die Angabe der Min-/Max-Werte auch eine farbliche Visualisierung der Grenzwerte definiert. Dann werden aber zugleich auch die Skalenwerte angezeigt. Ich dachte mir eben, dass z.B. durch ein Parameter "invisible" zwar die Visualisierung beibehalten kann, aber keine Skala angezeigt bekommt.
Hab ich das verständlich hinbekommen?
Mann, mann, mann....
Ich glaube langsam wird es zur Sucht. Diese UI ist wirklich das gilste was mir untergekommen ist. Leider hat die Sache einen riesen Nachteil: Man hat nie genug Zeit um alles auszubrobieren.
Aber krank im Bett gehts dann schon... :-)
Also riesen Log @ setstate !!!
Nun aber zum Thema:
Ich habe mich mal mit dem genialen swipe beschäftigt, und die tolle Idee gehabt meine switch Gruppe zu swipen. Geht auch , aber bedienen kann man sie nicht mehr !
Schade wäre ne super Geschichte auf kleinstem Raum sich durch viele Schalter zu swipen.
Hab ich nur was übersehen, oder ist das noch geplant, oder einfach nicht machbar (kurz tippen=Switch schalten, lang touch=swipen zur nächsten Seite )
---Skusi
Zitat von: tomster am 10 Dezember 2015, 11:21:56
Momentan wird durch die Angabe der Min-/Max-Werte auch eine farbliche Visualisierung der Grenzwerte definiert. Dann werden aber zugleich auch die Skalenwerte angezeigt. Ich dachte mir eben, dass z.B. durch ein Parameter "invisible" zwar die Visualisierung beibehalten kann, aber keine Skala angezeigt bekommt.
Hab ich das verständlich hinbekommen?
Nö, ich habe immer noch den Unterschied zum existierenden und von mir verwendeten "nolabels" nicht verstanden ...
kurze OT Frage: Kann wer nen Tablet empfehlen was wirklich nur an die Wand soll hiermit und ggf Dauerversorgung per Stromkabel verkraftet?!
Können die Parameter nur für die data-get Attribute benutzt werden, oder auch für das data-device?
Zitat von: Nobby1805 am 10 Dezember 2015, 12:40:07
Nö, ich habe immer noch den Unterschied zum existierenden und von mir verwendeten "nolabels" nicht verstanden ...
OK, dann haben wir jetzt zumindest beide Verständnisprobleme. Ich verstehe nämlich nicht, was Du mit "nolabels" meinst...Zugegeben, wenn man "nolabels" schreibt und nicht "nolables", dann klärt sich das rasch auf. Danke!
Zudem kann man bei 2 nebeneinanderliegenden Range-Balken (mit "nolabels") auch ein 3. Widget mit
data-width="0" zwischen diesen beiden ageben. Dann wäre die Skala in der Mitte, wenn auch layoutig noch nicht zentriert und mit z.B. 50- anstelle von -50-
Kann man mit dem Chart-Widget auch ein Monatsdiagramm darstellen?
Und wenn ja, kann mir bitte jemand einen Tip geben, wo ich dazu etwas lesen kann.
Im Wiki steht dazu leider nix.
Gruß Christian
Nur weil ich grad ein bissl quick'n'dirty im Code rumgepfuscht habe:
In der widget_range.js habe ich an Stelle wie diesen
jQuery('<div/>', {
class: 'labelLimitMax',
}).appendTo(levelArea)
.text(elem.data('limit-high')+'-');
zusätzlich noch '-'+ eingefügt.
jQuery('<div/>', {
class: 'labelLimitMax',
}).appendTo(levelArea)
.text('-'+elem.data('limit-high')+'-');
Damit zeigen die Labels nun das Format als -50-
Wenn man nun 3 Range-Widgets nebeneinander packt und das mittlere eben 0 Pixel breit wählt, dann kommt das meiner Idee schon ziemlich nahe:
<li data-row="3" data-col="1" data-sizex="2" data-sizey="5">
<div class="">
<div class="col-1-4">
<div class="large top-space">Tank1</div>
<div data-type="range" data-device="Tank_1"
data-low="" data-high="STATE" data-width="20" data-height="250"
data-max="50" data-min="0"
data-limit-low="5" data-limit-high="40"
data-color-low="red" data-color="orange" data-color-high="green" class="top-space nolabels"></div>
</div>
<div class="col-1-4">
<div class="large top-space"> </div>
<div data-type="range" data-device="Tank_1"
data-low="" data-high="STATE" data-width="0" data-height="250"
data-max="50" data-min="0"
data-limit-low="5" data-limit-high="40"
data-color-low="red" data-color="orange" data-color-high="green" class="top-space left-space-2x"></div>
</div>
<div class="col-1-4">
<div class="large top-space">Tank2</div>
<div data-type="range" data-device="Tank_2"
data-low="" data-high="STATE" data-width="20" data-height="250"
data-max="50" data-min="0"
data-limit-low="5" data-limit-high="40"
data-color-low="red" data-color="orange" data-color-high="green" class="top-space nolabels"></div>
</div>
</div>
</li>
Mein komplettes Layout ist nach dem Update verrutscht. Ich habe viele Stellen an denen ich mit class="col-1-2" und class="col-1-3" hantiere.
@setstate
kann es sein dass du in der fhem-tablet-ui.css bei [class*='col-'] das "float: left;" vergessen hast, oder wird das nicht mehr gebraucht.
Gruß Bert
Zitat von: masterpete23 am 10 Dezember 2015, 12:46:06
kurze OT Frage: Kann wer nen Tablet empfehlen was wirklich nur an die Wand soll hiermit und ggf Dauerversorgung per Stromkabel verkraftet?!
kurze OT-Antwort: Ich nutze ein 10' ODYS Gate mit Tasker (schaltet Stromversorgung bei 15% an und bei 95% automatisch aus) und bin damit sehr zufrieden.
Vorallem durch FTUI ist das Tablet unsere wichtigste Steuerzentrale im Haus und wird gern von jedem in der Familie genutzt.
Deshalb besten Dank an setstate und von mir gabs auch einen Teil zum neuen Notebook :)
Hoffe das sich noch viele andere daran beteiligen - deshalb zur Erinnerung ;)
ZitatWeiterentwicklung beeinträchtigt! Laptop ist alt, immer ist was kaputt und Gehäuse löst sich auf:
https://github.com/knowthelist/fhem-tablet-ui/blob/master/README.md#donation
Grüße
jehu
Hallo,
ich versuche einen multistatebutton durch einen switch zu ersetzen, da der multistatebutton ewig braucht, um sein icon zu wechseln, wenn er betätig wird. Nach dem readme dachte ich mit
<div data-type="switch" data-device="d_home_status" data-states='["Anwesend","Abwesend"]' data-icons='["oa-status_available", "oa-status_away_1"]' data-colors='["white", "white"]' data-background-colors='["green", "red"]' class="bigger topspace"></div>
meinen neuen switch zu haben. Doch leider interessiert der sich nicht so für seine data-states, sonder schaltet meinen dummy auf "on" oder "off". Wo ist mein Denkfehler?
Danke, Robert
Zitat von: Skusi am 10 Dezember 2015, 11:32:17
Schade wäre ne super Geschichte auf kleinstem Raum sich durch viele Schalter zu swipen.
Hab ich nur was übersehen, oder ist das noch geplant, oder einfach nicht machbar (kurz tippen=Switch schalten, lang touch=swipen zur nächsten Seite )
uhhh, schwierig. Schaue ich mir an, was die einzelnen so bieten und wie man das lösen kann. Wäre schade, wenn die Control sich verstellen beim Wischen ...
Zitat von: bert am 10 Dezember 2015, 13:58:25
Mein komplettes Layout ist nach dem Update verrutscht. Ich habe viele Stellen an denen ich mit class="col-1-2" und class="col-1-3" hantiere.
@setstate
kann es sein dass du in der fhem-tablet-ui.css bei [class*='col-'] das "float: left;" vergessen hast, oder wird das nicht mehr gebraucht.
Gruß Bert
nein, ich bin mit Absicht auf display: inline-block; anstatt float. Float ist zu aggressiv gewesen.
Jetzt musst du aufpassen, wenn die Zeile in Summe 100% ergibt, nicht durch Margins ('cell','left-space' etc) noch mehr Platz beansprucht wird, dann kommt man über 100% und alle verrutscht.
Bei HTML gibt es leider kein optimales Positionierungsmodel, was in allen Lebenslagen immer das Erwartete tut.
Zitat von: jojop2 am 10 Dezember 2015, 12:52:14
Können die Parameter nur für die data-get Attribute benutzt werden, oder auch für das data-device?
ja, jeglicher Text im Template kann per Platzhalter behandelt werden. Ach so, wie von CaptainHook beabsichtigt:
data-get="#par01#_tempMax"
data-parameter='{"#par01#":"fc0", ..... }'
Man muss nur aufpassen mit Sonderzeichen. Da der Vergleich per RegEx erfolgt, müsste man diese richtig escapen
Zitat von: setstate am 09 Dezember 2015, 19:06:45
zwei kleine Änderungen sind nötig:
Zeile 74,75
<div data-type="popup" data-width="800px" data-height="250px" class="">
<div class="left left-space" data-type="symbol"
Das inline bewirkte, dass das popup mit dem Thermostat in eine Reihe sollte, der Platz aber nicht ausreichte und es damit zu einem Zeilenumbruch kommt, die Symbole also nach unten verschwinden.
Super, sieht wieder gut aus. Danke.
Das inline war von Anfang an drin. Hatte mit ein Beispiel genommen und erweitert.
Gruß
Michael
Zitat von: robertPI am 10 Dezember 2015, 17:22:23
Hallo,
ich versuche einen multistatebutton durch einen switch zu ersetzen, da der multistatebutton ewig braucht, um sein icon zu wechseln, wenn er betätig wird. Nach dem readme dachte ich mit
<div data-type="switch" data-device="d_home_status" data-states='["Anwesend","Abwesend"]' data-icons='["oa-status_available", "oa-status_away_1"]' data-colors='["white", "white"]' data-background-colors='["green", "red"]' class="bigger topspace"></div>
meinen neuen switch zu haben. Doch leider interessiert der sich nicht so für seine data-states, sonder schaltet meinen dummy auf "on" oder "off". Wo ist mein Denkfehler?
Danke, Robert
Da fehlt das: data-set-on="Anwesend" data-set-off="Abwesend"
data-states = data-get-on ist nur für den GET Teil
Hi,
derzeit ist es nicht Möglich in einem data-template, ein weiteres data-template zu laden. Könnte man dies Realisieren?
Grüße,
Stephan
Zitat von: mrbreil am 10 Dezember 2015, 13:35:53
Kann man mit dem Chart-Widget auch ein Monatsdiagramm darstellen?
Und wenn ja, kann mir bitte jemand einen Tip geben, wo ich dazu etwas lesen kann.
Im Wiki steht dazu leider nix.
Gruß Christian
Kommt denke ich darauf an, was Du genau machen willst, und wie Das zugehörige Logfile aussieht. Mach mal ein Beispiel, was Du genau machen willst, dann kann ich mal schauen wie das gehen könnte.
Zitat von: tomster am 10 Dezember 2015, 10:17:23
Übrigens, was mir beim Swipe-Widget aufgefallen ist:
Wenn man ein "autoplay" definiert und dann manuell durch die Seiten swipet, dann hört danach das Autoplay auf.
Ich weiß zwar nicht, ob das ein Feature sein soll, aber bei meinem Setup ist das ein bissl unglücklich. Ich hab einen RasPi mit Touchscreen, der beim Booten einen Browser im Kiosk-Mode startet. Wenn ich nun manuell eingreife, dann stoppt das Autoplay. Auf meiner FTUI-Seite (ist nur 1 Seite, keine Untermenüs) ist jedoch kein Page-Reload-Button (will ich aus optischen Gründen eigentlich auch nicht). Somit bleibt mir nix anderes übrig, als den Pi neu zu starten.
setstate, meinst man kann das ändern? Ich hab leider von der Systematik vom FTUI, bzw. JS zu wenig Plan, um die autoplay-Schleife, bzw. deren Trigger zu verstehen. Vermutlich durch irgendwas wie onload(), oder? Wäre da nicht z.B. ein Retrigger bei vielleicht onmouseout() oder so sinnvoll?
Frage 2:
Beim Range-Widget könnte ich mir auch ein paar weitere Features vorstellen:
- Eine definierbare Skaleneinteilung.
- Ein Parameter um anzugeben, ob die Skaleneinteilung links oder rechts vom Balken oder "unsichtbar" stehen soll. Damit könnten man z.B. auch zwischen 2 Balken mittig die Skala layouten.
- eine "warn"-class, bei der Unterschreitung eines Werts der Balken zu Blinken beginnt.
So, wieder einmal nur Forderungen, Forderungen, Forderungen, ich weiß. Ich geh dann Mal lieber schnell ein bissl was "Donieren". Gehört sich so!
Frage1: ich werde 'autoplayDisableOnInteraction' beim Swiper Initiieren auf false setzten (default ist true). Ich denke nicht, dass wir das schaltbar brauchen. Man könnte das auch nach 10 Sekunden wieder automatisch starten lassen. Oder Start/Stop Button einbauen ...
Frage 2: schaue ich mir demnächst mal an
Punkt 3: vielen Dank an dich und an all die fleißigen "Donatoren"
Unter Firefox (Windows) ist seit einiger Zeit ein komisches Verhalten, das mit dem letzten Update echt problematisch geworden ist:
Erstes Laden der Seite (auch mit pagetab) geht problemlos, wenn man dann aber einen Reload (im Browser) auslöst, wird zwar angefangen zu laden, aber dann hängt das Laden jeweils 60 sek und alle 60 sek wird ein weiterer Teil der Seite geladen.
Das Verhalten ist auch in firebug sichtbar, man sieht jeweils, dass die Ladevorgänge hängenbleiben, bis der longpoll fertig ist
Da keine Fehlermeldung kommt, ist es schwierig hier eine Ursache zu identifizieren
Hallo,
1. die UI ist sehr schick und perfekt für mich.
Habe es jetzt so eingerichtet das es perfekt ohne browserbar auf mein Tablet passt. Nun kommt eher etwas spezifisches.
Und zwar will ich das die UI sich von selbst aktualisiert und das Tablet immer an ist (auser ich betätige den aus knopf)
1. problem ui aktualisiert sich nicht selbst (muss beim android chrome immer runter ziehen dann aktualisiert es sich und ich se wieder die browserbar bis ich es mit dem finger wieder hoch zieh.
2. wenn ich es aus habe und wieder einschalte kommt immer der doofe user login prompt kann ich das umgehen
=
Wenn aus und ich schalte es wieder ein soll sofort die aktualisierte oberfläche kommen(das wäre perfekt! Und wenn an und nicht aus sollte es sich alle Xmin aktualisieren
Geht das irgendwie`?
Der login screen kommt von FHEM und nicht vom tablet UI, Du müsstest also die Anmeldung bei FHEM abschalten, damit das nicht mehr erscheint.
Das Chrome-Problem habe ich aus Deiner Beschreibung nicht verstanden, das UI sollte sich automatisch aktualisieren (longpoll relativ direkt oder shortpoll alle 30 sec)
Zitat von: xsasx am 11 Dezember 2015, 10:25:46
... und ich se wieder die browserbar bis ich es mit dem finger wieder hoch zieh.
Verstehe ich das richtig, dass Du auf deinem Android Tablet erst Chrome öffnest und dann die FTUI-Seite über die Adresszeile aufrufst?
Probier doch Mal, wenn Du die Seite so aufgerufen hast, rechts im Menu von Chrome den Punkt "zum Startbildschirm hinzufügen" aus. Damit legst Du Dir ein Icon auf den Himescreen von Android. Mit dem kannst Du dann zukünftig die FTUI-Seite direkt mit einem Klick aufrufen.
Wichtiger ist aber für Dich wohl ein Punkt:
Damit lässt sich Chrome OHNE Adressleiste aufrufen!
Hi,
ich hatte da auch so meine Probleme mit Chrome und der Statuszeile. Trotz Icon auf dem HomeScreen.
Mittlerweile nutze ich deshalb UC Brower (nicht HD) der kann Fullscreen und läuft super.
Grüße,
Stephan
Zitat von: viegener am 11 Dezember 2015, 00:28:51
Unter Firefox (Windows) ist seit einiger Zeit ein komisches Verhalten, das mit dem letzten Update echt problematisch geworden ist:
Erstes Laden der Seite (auch mit pagetab) geht problemlos, wenn man dann aber einen Reload (im Browser) auslöst, wird zwar angefangen zu laden, aber dann hängt das Laden jeweils 60 sek und alle 60 sek wird ein weiterer Teil der Seite geladen.
Das Verhalten ist auch in firebug sichtbar, man sieht jeweils, dass die Ladevorgänge hängenbleiben, bis der longpoll fertig ist
Da keine Fehlermeldung kommt, ist es schwierig hier eine Ursache zu identifizieren
Ich bin auf der Suche und optimiere. Ein Punkt ist, dass Browser die max. Anzahl von parallelen AJAX Request auf 12 begrenzen. Das wird gerissen und führt zu Timeouts. Ich melde mich wieder ...
Ich wollte gerade mal das swiper widget einbauen.
Komme aber nicht weiter.
Der Original Code sieht wie folgt aus:
<li data-row="1" data-col="8" data-sizex="2" data-sizey="5" data-template="inc_wetterproplanta.html" class="halbTransparent"></li>
Nun habe ich es jetzt mal so probiert, aber es wird nichts richtig angezeigt:
<li data-row="1" data-col="8" data-sizex="2" data-sizey="5" class="halbTransparent">
<div data-type="swiper">
<ul>
<li data-row="1" data-col="8" data-sizex="2" data-sizey="5" class="halbTransparent" data-template="inc_wetterproplanta.html"></li>
<li data-row="1" data-col="8" data-sizex="2" data-sizey="5" class="halbTransparent" data-template="inc_wetterproplanta+1.html"></li>
</ul>
</div>
</li>
Sie jemand mit mehr Erfahrung den Fehler, ich steh gerade auf dem Schlauch?
Muss man eigentlich beim Swiper immer pixel angeben?
Gruß Robert
hi,
@no_Legend, lass mich Raten:
die Datei, die das enthält:
<li data-row="1" data-col="8" data-sizex="2" data-sizey="5" data-template="inc_wetterproplanta.html" class="halbTransparent"></li>
wurde mittels data-template eingefügt.
und in deinem swiper lädst du wieder eineDatei mittels data-template ;)
Das geht derzeit nicht... vor dem Problem stehe ich auch gerade, jedoch sind meine Softwareentwicklerkenntnisse was Javascrit/jQuery angeht (noch) zu begrenzt und es zu lösen...
Man müsste die data-template rekursiv laden... sprich prüfen od in dem geladenen data-template weitere data-template vorhanden sind und diese dann auch lasen .....
Grüße,
Stephan
Zitat von: viegener am 11 Dezember 2015, 10:33:23
Der login screen kommt von FHEM und nicht vom tablet UI, Du müsstest also die Anmeldung bei FHEM abschalten, damit das nicht mehr erscheint.
Das Chrome-Problem habe ich aus Deiner Beschreibung nicht verstanden, das UI sollte sich automatisch aktualisieren (longpoll relativ direkt oder shortpoll alle 30 sec)
Ok das wäre aber doof da ich ja nicht will das jeder der in meinem Netz ist theoretisch auf mein Fhem kann. Kann man das Passwort nicht irgendwie hinterlegen das User X (tablet mit MAC Adresse XX:XX:X... immer drauf darf und rest hat Login?
Zitat von: tomster am 11 Dezember 2015, 10:46:33
Verstehe ich das richtig, dass Du auf deinem Android Tablet erst Chrome öffnest und dann die FTUI-Seite über die Adresszeile aufrufst?
Probier doch Mal, wenn Du die Seite so aufgerufen hast, rechts im Menu von Chrome den Punkt "zum Startbildschirm hinzufügen" aus. Damit legst Du Dir ein Icon auf den Himescreen von Android. Mit dem kannst Du dann zukünftig die FTUI-Seite direkt mit einem Klick aufrufen.
Wichtiger ist aber für Dich wohl ein Punkt:
Damit lässt sich Chrome OHNE Adressleiste aufrufen!
Nee ich mache das schon über einen shortcut auf dem desktop bzw eigentlich ist die GUI immer offen habe aber das aktualisierungs problem :(
Zitat von: CaptainHook am 11 Dezember 2015, 10:54:52
Hi,
ich hatte da auch so meine Probleme mit Chrome und der Statuszeile. Trotz Icon auf dem HomeScreen.
Mittlerweile nutze ich deshalb UC Brower (nicht HD) der kann Fullscreen und läuft super.
Grüße,
Stephan
Genau das Problem habe ich auch mhhh UC Browser ok den werd ich dann mal ausprobieren.
Zitat von: CaptainHook am 11 Dezember 2015, 11:39:48
hi,
@no_Legend, lass mich Raten:
die Datei, die das enthält:
<li data-row="1" data-col="8" data-sizex="2" data-sizey="5" data-template="inc_wetterproplanta.html" class="halbTransparent"></li>
wurde mittels data-template eingefügt.
und in deinem swiper lädst du wieder eineDatei mittels data-template ;)
Das geht derzeit nicht... vor dem Problem stehe ich auch gerade, jedoch sind meine Softwareentwicklerkenntnisse was Javascrit/jQuery angeht (noch) zu begrenzt und es zu lösen...
Man müsste die data-template rekursiv laden... sprich prüfen od in dem geladenen data-template weitere data-template vorhanden sind und diese dann auch lasen .....
Grüße,
Stephan
Ah okay. Ich hoffe ich habe es richtig verstanden.
Wenn ich jetzt aber alles in pixeln angebe sollte es doch gehen oder?
Gruß Robert
Hallo zusammen,
ich versuche mich gerade mal wieder an dem UI.
Ich habe mir das Beispiel genommen und meine Geräte (Soweit vorhanden) dort eingesetzt. Leider wird die Seite nur langsam und unvollständig aufgebaut, auch das was ich noch nicht angerührt habe.
Was mach ich den da falsch. Wie gesagt, habe nur meine Geräte rein geschrieben, die Daten werden mir auch angezeigt. (Siehe Bild)
Zitat von: RettungsTim am 11 Dezember 2015, 11:59:21
Hallo zusammen,
ich versuche mich gerade mal wieder an dem UI.
Ich habe mir das Beispiel genommen und meine Geräte (Soweit vorhanden) dort eingesetzt. Leider wird die Seite nur langsam und unvollständig aufgebaut, auch das was ich noch nicht angerührt habe.
Was mach ich den da falsch. Wie gesagt, habe nur meine Geräte rein geschrieben, die Daten werden mir auch angezeigt. (Siehe Bild)
Zuerst prüfen, ob es Fehlermeldungen beim Laden gibt (z.B. in Firefox mit Firebug in der Console).
Wenn möglich das HTML auf korrektheit überprüfen. Fehlende <, > oder auch Anführungszeichen können je nach Browser zu den unterschiedlichsten Effekten führen.
Zitat von: xsasx am 11 Dezember 2015, 11:50:43
Ok das wäre aber doof da ich ja nicht will das jeder der in meinem Netz ist theoretisch auf mein Fhem kann. Kann man das Passwort nicht irgendwie hinterlegen das User X (tablet mit MAC Adresse XX:XX:X... immer drauf darf und rest hat Login?
Hi,
mit MAC-Adresse wahrscheinlich nicht so einfach, aber über die IP-Adresse sollte das gehen. Siehe hier: http://forum.fhem.de/index.php?topic=23994.0 (http://forum.fhem.de/index.php?topic=23994.0).
Gruß,
Thorsten
Ich habe mal das original Beispiel ohne Änderungen geladen.
Da bekomme ich schon die Fehlermeldungen unten!
*edit*
habe Auf das grüne CSS gewechsel, weil es das auch beim mir im Ordner gab.
Nun sieht es so aus. (Datei 1 und 2)
Wie man sieht fehlen aber immer noch die ICONS fürs Licht und Fehler sind auch noch da. Langsam ist es immer noch!
*edit 2*
Er macht kein vollständiges update. Er sagt das nix zu tun sei, aber wen ich mir die Datei widget_circlemenu.js anschaue ist die vom 08.12.2015 :-(
*edit 3*
Nach manuellen update (hochladen der Quelldatein) habe ich nur noch den einen Fehler drin. Geschwindigkeit bleibt langsam! (Siehe Bild 4)
Zitat von: Thorsten Pferdekaemper am 11 Dezember 2015, 12:11:34
Hi,
mit MAC-Adresse wahrscheinlich nicht so einfach, aber über die IP-Adresse sollte das gehen. Siehe hier: http://forum.fhem.de/index.php?topic=23994.0 (http://forum.fhem.de/index.php?topic=23994.0).
Gruß,
Thorsten
Danke für den Tipp ! Das werd ich versuchen !
Ok versucht und durch eintragen von:
attr WEB allowfrom ^192\.168\.16\.114$|127.0.0.1|192.168.16.199
144 ist meine Tablet IP hab ich mich komplett ausgesperrt :( !
Hallo!
Hat irgendjemand von euch ein schönes "Raster", das auf das iPad im Hochformat passt? Ich weiß, das ist eher unüblich, aber sonst wird es an der Wand so eng...
Phil
Zitat von: xsasx am 11 Dezember 2015, 11:50:43
Ok das wäre aber doof da ich ja nicht will das jeder der in meinem Netz ist theoretisch auf mein Fhem kann. Kann man das Passwort nicht irgendwie hinterlegen das User X (tablet mit MAC Adresse XX:XX:X... immer drauf darf und rest hat Login?
http://username:password@[IPvonFHEM]:8083/fhem/tablet/index.html tut's nicht?
Zitat von: RettungsTim am 11 Dezember 2015, 12:15:10
Ich habe mal das original Beispiel ohne Änderungen geladen.
Da bekomme ich schon die Fehlermeldungen unten!
*edit*
habe Auf das grüne CSS gewechsel, weil es das auch beim mir im Ordner gab.
Nun sieht es so aus. (Datei 1 und 2)
Wie man sieht fehlen aber immer noch die ICONS fürs Licht und Fehler sind auch noch da. Langsam ist es immer noch!
*edit 2*
Er macht kein vollständiges update. Er sagt das nix zu tun sei, aber wen ich mir die Datei widget_circlemenu.js anschaue ist die vom 08.12.2015 :-(
*edit 3*
Nach manuellen update (hochladen der Quelldatein) habe ich nur noch den einen Fehler drin. Geschwindigkeit bleibt langsam! (Siehe Bild 4)
Zu langsam ist jetzt natürlich schwer irgendeine Aussage zu treffen, aber die deprecated Meldung ist kein Fehler und kann auch ignoriert werden.
Das erste Laden ist aber auf jeden Fall auf älterer Hardware nicht wirklich schnell (ein 3 Jahre altes China-tablet brauch da schonmal mehr als 1 Minute) und auch auf einem 3 Jahre alten Notebook kann man beim Aufbau zuschauen. Ist das langsam, aus meiner Sicht ja, aber akzeptabel.
Zitat von: xsasx am 11 Dezember 2015, 12:47:53Ok versucht und durch eintragen von:
attr WEB allowfrom ^192\.168\.16\.114$|127.0.0.1|192.168.16.199
144 ist meine Tablet IP hab ich mich komplett ausgesperrt :( !
Naja, Du hättest schon eine neue Instanz von FHEMWEB anlegen müssen. Über ssh (putty oder so) müsstest Du ja schon noch auf Dein System kommen, dort kannst Du dann die fhem.cfg ändern.
Übrigens hast Du die 144 gar nicht mit drin.
Gruß,
Thorsten
Zitat von: tomster am 11 Dezember 2015, 13:46:50
http://username:password@[IPvonFHEM]:8083/fhem/tablet/index.html tut's nicht?
Das ist nen mega Tipp :D warum bin ich nicht früher drauf gekommen ;D klar tuts das DANKE !
Zitat von: eki am 10 Dezember 2015, 22:40:32
Kommt denke ich darauf an, was Du genau machen willst, und wie Das zugehörige Logfile aussieht. Mach mal ein Beispiel, was Du genau machen willst, dann kann ich mal schauen wie das gehen könnte.
Habe ein Jahres-Logfile, Werte liegen aber auch im DBlog vor, in welches jeden Tag drei neue Werte hinzukommen.
Die werte haben folgende Readings Systolisch, Diastolisch und Puls, es geht um den Blutdruck.
Deswegen hätte ich gerne eine Möglichkeit für einen Monatsdiagramm.
Kann ich dir noch irgendwie helfen mir zu helfen, brauchst du noch andere Infos?
Danke erstmal.
Zitat von: xsasx am 11 Dezember 2015, 13:59:23
Das ist nen mega Tipp :D warum bin ich nicht früher drauf gekommen ;D klar tuts das DANKE !
Naja, Passwörter irgendwo im Klartext reinschreiben ist nicht wirklich so der Hit...
Da muss eigentlich nur mal jemand sich den Quelltext von der Tablet UI-Seite ansehen und schon hat er alles.
Gruß,
Thorsten
Zitat von: viegener am 11 Dezember 2015, 00:28:51
Erstes Laden der Seite (auch mit pagetab) geht problemlos, wenn man dann aber einen Reload (im Browser) auslöst, wird zwar angefangen zu laden, aber dann hängt das Laden jeweils 60 sek und alle 60 sek wird ein weiterer Teil der Seite geladen.
Das Verhalten ist auch in firebug sichtbar, man sieht jeweils, dass die Ladevorgänge hängenbleiben, bis der longpoll fertig ist
ich habe versucht das zu optimieren. Probiere bitte mal die neue fhem-tablet-ui*.js
Zitat von: setstate am 11 Dezember 2015, 14:14:25
ich habe versucht das zu optimieren. Probiere bitte mal die neue fhem-tablet-ui*.js
Ja gerne, wird allerdings etwas dauern, da ich das Problem auf dem Rechner im Büro nicht nachstellen kann.
Zitat von: setstate am 11 Dezember 2015, 14:14:25
ich habe versucht das zu optimieren. Probiere bitte mal die neue fhem-tablet-ui*.js
Klappt bei mir viel besser!!
Wenn es klappt, bekomme ich nur folgende Warnung:
"start longpoll" fhem-tablet-ui.min.js:1:4758
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/
Bei ca. jedem 5. aktualisieren bekome ich jedoch folgende Fehlermeldung:
ReferenceError: jQuery is not defined jquery.toast.min.js:1:104
TypeError: t is undefined jquery.gridster.min.js:1:1238
ReferenceError: $ is not defined fhem-tablet-ui.min.js:1:9184Dann bleibt die Seite duinkel und leer.
Zitat von: xsasx am 11 Dezember 2015, 10:25:46
Hallo,
2. wenn ich es aus habe und wieder einschalte kommt immer der doofe user login prompt kann ich das umgehen
=
Geht das irgendwie`?
Evtl. mal versuchen den User und PW mit über die URL zu übergeben. So mache ich das beim Tasker um die die Akkuladung zu steuern.
http://user:pw@ip:8083/fhem/tablet....
EDIT: habe gerade gesehen das der Tipp schon kam... ;)
Grüße
jehu
ZitatBei ca. jedem 5. aktualisieren bekome ich jedoch folgende Fehlermeldung:
Code: [Auswählen]
ReferenceError: jQuery is not defined jquery.toast.min.js:1:104
TypeError: t is undefined jquery.gridster.min.js:1:1238
ReferenceError: $ is not defined fhem-tablet-ui.min.js:1:9184
Dann bleibt die Seite duinkel und leer.
So was bekomme ich auch ab und zu. Ich vermute, FHEM "liefert" dann nix/nicht schnell genug.
Evtl. hilft es auch, den Start des Longpoll zu verzögern. Das hilft bei mir bei der Mobil-Version fürs iPhone:
<meta name="longpoll_delay" content="1000">
Hallo,
kann ich mit ftui auch werte umrechnen?
genau gesagt möchte ich von einem hourcounter reading den wert umrechnen.
folgender code wird verwedent
{sprintf("%.2f €", $VALUE*0.004);}
Zitat von: netbus am 11 Dezember 2015, 15:38:25
Hallo,
kann ich mit ftui auch werte umrechnen?
genau gesagt möchte ich von einem hourcounter reading den wert umrechnen.
folgender code wird verwedent
{sprintf("%.2f €", $VALUE*0.004);}
Beim Label?
Dort gibt es ein ganz 'böse' Funktion mittel data-substitution. Da kann man Funktionen, die das Value-Objekt kennt, aufrufen.
Zum Beispiel String in Datum und dann nur Tag und Monat anzeigen:
data-substitution="toDate().ddmm()"Das könnte man 'missbrauchen'
<div data-type="label" data-device="BadHeizung_Clima" data-get="desired-temp" data-substitution="trim()*2" ></div>trim() ist dabei nur ein Dummy function, damit der Aufruf passt :-)
Hi,
meine doublebox Buttons Widgets für Jalousien Steuerung lassen sich auf allen Geräten nicht mehr bedienen ,einfach keine Reaktion....auch mein Multimedia net mehr (Enigma2 und AVR). Hab schon letzten Backup eingespielt aber ohne Besserung. Fhem und TUi ist auf dem neusten stand. Lampen und Heizung gehen aber ???
Was kann die Ursache sein?
Gruß
Peter
Hallo Peter, gib mal den Teil des Codes und den Output von 'list mydevice' deines Gerätes im Fhem.
Zitat von: Schnabelowski am 12 Dezember 2015, 20:54:10
Hi,
meine doublebox Buttons Widgets für Jalousien Steuerung lassen sich auf allen Geräten nicht mehr bedienen ,einfach keine Reaktion....auch mein Multimedia net mehr (Enigma2 und AVR). Hab schon letzten Backup eingespielt aber ohne Besserung. Fhem und TUi ist auf dem neusten stand. Lampen und Heizung gehen aber ???
Was kann die Ursache sein?
Gruß
Peter
Vielleicht hast Du auch das attribute
data-set= für pushbuttons verwendet ?
Seit einem der letzten Updates muss man für das push-button-widget stattdessen
data-set-on= verwenden.
Johannes
Zitat von: setstate am 11 Dezember 2015, 15:55:35
Zum Beispiel String in Datum und dann nur Tag und Monat anzeigen:
data-substitution="toDate().ddmm()"
Gibt's da auch was um aus einem String den Wochentag (z.B. Montag) auszugeben?
mit toDate().ee() kommt z.B. Mo, Di, Mi etc.
Zitat von: setstate am 11 Dezember 2015, 14:14:25
ich habe versucht das zu optimieren. Probiere bitte mal die neue fhem-tablet-ui*.js
Habe ich ausprobiert, das Problem ist bisher nicht wieder aufgetreten. Ich bin allerdings vorsichtig, da ich das Problem generell nicht so leicht reproduzieren kann.
Was ist denn die einfachste Möglichkeit die Zeit seit dem letzten Readings (timestamp) auszugeben?
Pseudocode:
Now() - timestamp = x h y m
Zitat von: Nobby1805 am 13 Dezember 2015, 01:04:40
mit toDate().ee() kommt z.B. Mo, Di, Mi etc.
Vielen Dank! Mit toDate().eeee() wird sogar ein Montag, Dienstag, Mittwoch, etc. draus
@Setstate
Tablet UI code
<header>ROLLOS</header>
<div class="doublebox-h centered top-space-2x">
<div data-type="push" data-device="rollos_wz" data-icon="fa-angle-up" data-background-icon="fa-square-o" data-set="hoch"</div>
</div>
<div data-type="push" data-device="rollos_wz" data-icon="fa-angle-down" data-background-icon="fa-square-o" data-set="runter"> </div>
<div data-type="label" class="cell big">WZ</div>
<div class="doublebox-h centered">
<div data-type="push" data-device="rollos_janzimmer" data-icon="fa-angle-up" data-background-icon="fa-square-o" data-set="hoch"</div>
</div>
<div data-type="push" data-device="rollos_janzimmer" data-icon="fa-angle-down" data-background-icon="fa-square-o" data-set="runter"> </div>
<div data-type="label" class="cell big">JAN</div>
Fhem list
BTN 4f
DEF 13244432 2144 fg 4413 gm 4444
IODev CUL1
NAME rollos_wz
NR 185
STATE hoch
TYPE FS20
XMIT 27f9
Code:
1 27f9 4f
2 27f9 f2
3 27f9 ff
Readings:
2015-12-13 09:15:00 state on
Attributes:
IODev CUL1
devStateIcon .*:Rolladen
eventMap on:hoch off:runter
fp_Jalousien 140,1000,2,
fp_untergeschoss 320,460,2,
group Rolladen
icon fts_shutter_updown
model fs20rsu
room wohnzimmer
Der Fehler kam (glaube ich ???)nach dem update.
@viegener
opsss......das wusste ich nicht....sorry
Hallo Schnabelowski,
bei push muss data-set ==> data-set-on werden.
Gruß
Michael
Edit: War ja schon beantwortet. ;-)
Hintergrund:
data-set - für den Namen des Reading
data-set-on - für den Wert, der bei Press an das Reading geschickt werden soll.
Wenn bei data-set-on nix angegeben wird, wird der ganze Befehl nicht geschickt. Das ist wichtig für andere Anwendungen der Schalter-Klasse.
Vorher ging das mit data-set, weil so wie der Befehl zusammengebaut wurde, FHEM damit zurecht kam.
Zitat von: jojop2 am 13 Dezember 2015, 09:20:50
Was ist denn die einfachste Möglichkeit die Zeit seit dem letzten Readings (timestamp) auszugeben?
Pseudocode:
Now() - timestamp = x h y m
Einfach nicht ...
Ich habe solch eine Function mal schnell ergänzt.
toDate().ago()Über die Ausgabeform können wir uns noch streiten:
<div data-type="label" data-device="BadHeizung_Clima" data-get="desired-temp" data-substitution="toDate().ago()" class="timestamp" ></div>
<div data-type="label" data-device="BadHeizung_Clima" data-get="desired-temp" data-substitution="" class="timestamp" ></div>
Hallo setstate,
bekommt man eigentlich mit dem select-widget hin, dass pro Eintrag ein ganzer Befehl gesendet wird?
Beispiel:
In der ComboBox steht z.B.
<div data-type="select" ... data-items='["1Live","WDR2","Vest"]'></div>
Bei Auswahl 1Live wird z.B. "set Bad stream http://www.wdr.de/wdrlive/media/einslive.m3u" geschickt.
Gruß
Michael
Hi zusammen,
als erstes eine Bitte an setstate vorweg. Ich war jetzt ca. 2 Monate nicht in diesem Thread und muesste jetzt eigentlich 150 Seiten oder so lesen um mitzukriegen was in der Zwischenzeit veraendert wurde, bzw. neu hinzugekommen ist (das neue Chart ist z.b. grossartig). Koennten wir nicht einen eigenen Changelog Thread aufmachen? Anstatt die Aenderungen am Repository hier im Thread zu posten, wo sie bei der Masse an Posting mittlerweile zwangslaeufig untergehen. lieber einen eigenen Thread dafuer. Ich denke damit wuerde auch die eine oder andere Rueckfrage erledigen.
Ausserdem habe ich noch zwei drei Fragen:
1) Bei dem neuen Chart wird die Beschriftung der x und y Achse im Webviewcontrol nicht angezeigt, im "normalen" Browser hingegen schon. Ist das ein bekannter Bug im Webviewcontrol?
2) [Erledigt, Lösung untem im Post] Fuer das KODI now playing widget waere es natuerlich fantastisch wenn wir auch den Thumbnail zur Verfuegung haetten. Zwei Sachen hindern mich grade noch daran. im FHEM KODI addon wird lediglich thumbnail ausgelesen, allerdings stimmt das URL Format aus irgendeinem Grund nicht. Ein / fuer den Pfad wird im Reading mit %2f zurueckgegeben, waehrend das direkt ueber die Weboberflaeche von KODI mit %252f angegeben wird. Der Aufruf fuer das Bild lautet demnach http://192.168.0.5:8080/image/$FHEM_KODI_THUMBNAIL. Ich werde jetzt parallel die Entwickler vom KODI plugin fragen was es mit dem Aufruf aufsich hat. Was ich dann aber noch nicht weiss, wie wandle ich denn den data-get="thumbnail" in einen img link um in es FTUI anzeigen zu koennen?[/s]
3) Hat jemand das meteogram bei sich eingebunden? Ich hab den Beispiel Code in meine Seite eingebaut, das Diagramm laedt aber nicht. Die widgets und js Dateien sind da, die URL wird soweit ich das sehe auch richtig zusammengesetzt. Benoetigt man dafuer noch spezielle OS-Pakete?
Ansonsten, spitzenmaessige Arbeit hier, danke an alle Beteiligten und ich hoffe meine Spende kann dazu beitragen das setstate bald wieder ein neues MacBook sein eigen nennen kann :)
EDIT: Hier die Loesung zu Punkt 2)
Im KODI Modul ein userreadings Attribut mit dem folgenden Wert hinzufuegen:
http_thumbnail { my $val = (ReadingsVal("$name", "thumbnail", 0)); $val =~ s/\%2f/\%252f/g;; return "http://192.168.0.5:8080/image/".$val;; }
Anschliessend kann http_thumbnail abgefragt werden. Das funktioniert allerdings nur solange der Pfad lokal ist.
<div class="container"> >
<div data-type="image"
data-get="http_thumbnail"
data-device="wz_KODI"
data-refresh="60"
class="top-space">
</div>
</div>
Zitat von: CaptainHook am 11 Dezember 2015, 10:54:52
Hi,
ich hatte da auch so meine Probleme mit Chrome und der Statuszeile. Trotz Icon auf dem HomeScreen.
Mittlerweile nutze ich deshalb UC Brower (nicht HD) der kann Fullscreen und läuft super.
Grüße,
Stephan
Hab das jetzt mal mit dem UC Browser versucht- dieser Zeigt mir die GUI gar nicht an. Kommt nur eine weiße leere Seite.
irgendwie komme ich nicht weiter -
ich würde gerne ein label für ein reading das 0, 1 ,2 ,3 sein kann darstellen. möchte aber die zahlenwerte durch einen string ersetzen.
dazu gibt es beim label ja data-substitution, allerdings bekomme ich keinen hash rein
data-substitution='s/(0|1)/(0=>"Auto",1=>"Manu"){$1}/g'
kann mir da bitte jemand einen tipp geben?
Zitat von: trilu am 14 Dezember 2015, 10:23:28
irgendwie komme ich nicht weiter -
ich würde gerne ein label für ein reading das 0, 1 ,2 ,3 sein kann darstellen. möchte aber die zahlenwerte durch einen string ersetzen.
dazu gibt es beim label ja data-substitution, allerdings bekomme ich keinen hash rein
data-substitution='s/(0|1)/(0=>"Auto",1=>"Manu"){$1}/g'
kann mir da bitte jemand einen tipp geben?
Die Substitution findet im Browser (in javascript) statt, dort gibt es keine perl-syntax und damit auch keine perl-hashes. Damit steht Dir die regexp-Syntax von JS zur Verfügung.
In Deinem Fall ist es vermutlich viel einfacher ein userreading auf fhem seite zu verwenden.
Zitat von: xsasx am 14 Dezember 2015, 08:25:33
Hab das jetzt mal mit dem UC Browser versucht- dieser Zeigt mir die GUI gar nicht an. Kommt nur eine weiße leere Seite.
Das ist ja komisch. bei mir funktioniert der uc Browser bestens. Bei starten kommt kurz eine weise Seite mite inem springenden blauen punkt und danach wird gleich die Tablet UI angezeigt ...
Zitat von: CaptainHook am 14 Dezember 2015, 14:00:16
Das ist ja komisch. bei mir funktioniert der uc Browser bestens. Bei starten kommt kurz eine weise Seite mite inem springenden blauen punkt und danach wird gleich die Tablet UI angezeigt ...
Ich hatte ebenfalls daselbe Problem wie setstate (mit Android 4.4) und es wurde kein FTUI angezeigt. Verschiedene Einstiegsseiten gingen nicht, FHEM selbst und externe Seiten schon. Habe es dann gar nicht auf einem neueren Android probiert.
Zitat von: viegener am 14 Dezember 2015, 13:55:18
Die Substitution findet im Browser (in javascript) statt, dort gibt es keine perl-syntax und damit auch keine perl-hashes. Damit steht Dir die regexp-Syntax von JS zur Verfügung.
In Deinem Fall ist es vermutlich viel einfacher ein userreading auf fhem seite zu verwenden.
Vielen Dank! Könnte ich dann eine Funktion per <script> definieren und den Aufruf von hier starten? data-substitution=funktion()
Nein, eine Funktion wird da nicht unterstützt, wie gesagt es geht um regexp.
Gibt es einen Grund warum kein userreading verwendet wird?
kann ich in einem widget prüfen ob ein reading vorhanden ist oder nicht? ich habe es bisher nicht selbst lösen können:
ich will zb wenn reading x (oder auch a_count genannt) nicht im device ist einen default wert setzen um so evtl alte werte zu verwerfen.
beispiel:
beim init des widget ist das reading a_count da und hat den wert 1. bei späterne updates gibt es das reading nicht mehr. in dem fall scheint die ui den alten wert, wo es das reading noch gab, einfach beizubehalten statt zb mit NULL zu ersetzen.
Zitat von: setstate am 10 Dezember 2015, 01:03:01
Bei der Template-Funktion fehlte immer noch die Möglichkeit, Parameter zu übergeben, das würde das Template noch generischer machen. Überlegt - getan.
Templates können jetzt auch Placeholder für Parameter enthalten.
@setstate:
Ist/Wäre es möglich die Parameter auch für pagetabs einzusetzen?
Ich habe 5 Räume, die identisch aufgebaut sind. Mit den pagetabs rufe ich heute 5 verschiedene html-Seiten auf. Eine Änderung muss so immer in allen 5 Dateien gemacht werden.
Eine kleine Spende ist für deine tolle Arbeit gerade auf den Weg gebracht.
Hallo Zusammen. Zuerst mal ein riesen Lob für diese tolle Arbeit. Es macht mir einen gigantischen Spaß damit meine Weboberfläche für das Tablet zu erstellen. :)
Nun hätte ich aber ein Problem bei dem ich nicht so ohne weiteres weiterkomme. Ich habe diese Spritpreisanzeige bei mir als Label und Chart eingebaut und würde nun gerne immer
den günstigsten Anbieter(Tankstelle) in meinem Label mit grün und den teuersten mit rot darstellen.
Das heißt ich müsste die Labelfarbe in Abhängigkeit der Spritpreis Werte untereinander darstellen. Seht ihr da eine Möglichkeit dies zu realisieren.
;)
Zitat von: viegener am 14 Dezember 2015, 14:15:38
Ich hatte ebenfalls daselbe Problem wie setstate (mit Android 4.4) und es wurde kein FTUI angezeigt. Verschiedene Einstiegsseiten gingen nicht, FHEM selbst und externe Seiten schon. Habe es dann gar nicht auf einem neueren Android probiert.
Bei mir läuft die FTUI auf Android 4.2.2 :'( nen neueren ROM gibt's für dieses
schrott-Tablet nicht, für FTUI reichts.
Wie gesagt Fullscreen mit Original + Chrome + Firefox + Dolphin gibg nicht ... erst ucBrowser schaffte es
Wobei bei Fullscreen immer noch die untere Leiste (zurück, Home, AppSwitch) angezeigt wird aber das war mir dann auch egal.
Hallo setstate
Als erstes möchte ich mich für die grossartige Umsetzung mit dem Tablet-UI.
Ich habe einzelne Bemerkungen, Feststellungen und natürlich Wünsche.
Hoffe dies ist ok.
Allgemeines:
Oft kommt es bei mir vor, dass nicht alle Devices beim Laden der Seite - der Status korrekt angezeigt wird.
SWIPER Funktionlität:
1) Ich finde die swiper Möglichkeit genial. Dabei sind mir zwei Pinkte aufgefallen:
Popup geht bei mir nicht:
Ich beziehe mich auf mein beiliegendes Bild, im Beriech ,,Fenster/Türen" - wenn ich da eine HUE Lampe einsetze, und das colorpicker Popup wähle (ebenfalls eine Demo von dir) dann sehe ich wie das Popup aufgeht, dann aber hinter das swiper der Wettervorhersage (rechter Bereich) verschwindet.
2) Sobald Dimmer eingesetzt werden, dann geschieht es manchmal, dass beim Antippen, die Seite gewischt wird, anstelle dass die Lampe gedimmt werden kann. Dies geschieht eher wenn ein solches Objekt am rechten oder linken Rand des Bereiches dargestellt wird.
Wünsche:
1) Wie man sieht habe ich mein Menu im unteren Bereich erstellt und dies mittels der link Funktion. Schön wäre es wenn ich dies gleiche dem der pagetab Funktion erstellen könnte. So wäre ein Übergang auf die unterschiedlichen Seiten viel schöner und die Seite würde nicht immer wieder neu geladen. Gibt es da eine Möglichkeit?
Der Grund weshalb ich dies über die links gemacht habe ist, dass mir es so mehr zusagt, einen Beriech als aktiv gesetzt werden kann im Gegensatz zu einem Icon.
2) Im Weissen Bereich habe ich den Anwesenheitsstaus erstelle. Wäre es möglich z.Bsp. unterschiedliche Bilder je nach Status zu laden? Aktuell ist einfach ein Bild in graustufen dargestellt, gerne hätte ich wenn jemand zu Hause ist sein Bild in farbe und ausser Haus als S/W dargestellt.
3) Wäre es möglich auch in der label Funktion ein Alias zu definieren? Der Status ist nicht immer schön um auf einem Tab darstellen zu können. So eine ähnlich möglichkeit wie bei dem ,,Homestatus".
Ich möchte mich nochmals für den grossartigen und genialen Einsatz bedanken, welchen ich auch sehr gerne unterstütze. Hoffe du kannst dein MAC bald bestellen :-)
Grüsse Eric
Hallo,
ich habe das Phänomen, dass ich manchmal die Seiten öfters reloaden muss bis ich eine Vollständige UI habe.
Weder werden die Icons im ersten Anlauf nicht geladen oder die Werte werden nicht geliefert.
Tritt mit Chrome und Firefox auf. Ich bilde mir ein, dass es mit dem IE besser funktioniert.
Woran kann das liegen?
Das Problem hatte ich auch, bei mir lag es daran das ich vor FHEM einen Apache2 als Reverse Proxy einsetze und dieser in einen Timeout gelaufen ist weil FHEM nicht fix genug geantwortet hat. Als ich den Timeout höher gesetzt habe war das Problem verschwunden und es gab auch keine Fehlermeldung mehr im Apache Log.
Zitat von: jojop2 am 14 Dezember 2015, 22:46:44
@setstate:
Ist/Wäre es möglich die Parameter auch für pagetabs einzusetzen?
Ich habe 5 Räume, die identisch aufgebaut sind. Mit den pagetabs rufe ich heute 5 verschiedene html-Seiten auf. Eine Änderung muss so immer in allen 5 Dateien gemacht werden.
Eine kleine Spende ist für deine tolle Arbeit gerade auf den Weg gebracht.
Das geht, dann darf aber das Menu selbst nicht als Template eingebaut werden. Dann müsste die Template Ersetzungen rekursiv aufrufbar sein, was sie zur Zeit nicht sind.
Also in jeder HTML Seite immer die volle Pagetab-Liste :
<div data-type="pagetab" data-url="index_main.html" data-icon="fa-home" class="top-space"></div>
<div data-type="pagetab" data-url="index_music.html" ...
...
...
Zitat von: setstate am 15 Dezember 2015, 17:12:13
Das geht, dann darf aber das Menu selbst nicht als Template eingebaut werden. Dann müsste die Template Ersetzungen rekursiv aufrufbar sein, was sie zur Zeit nicht sind.
Für rekursive Includes habe ich mal vor einiger Zeit ein Servermodul gebaut, siehe hier:
http://forum.fhem.de/index.php/topic,43110.msg350991.html#msg350991 (http://forum.fhem.de/index.php/topic,43110.msg350991.html#msg350991)
Damit lassen sich gerade wenn man ähnliche Elemente Schalter / Gridsterblöcke oder Charts hat ganz leicht wiederverwendebare Module bauen die in vielen Seiten verwendet werden (order gar ganze Seiten bilden).
Zitat von: sam50 am 15 Dezember 2015, 10:43:08
Hallo Zusammen. Zuerst mal ein riesen Lob für diese tolle Arbeit. Es macht mir einen gigantischen Spaß damit meine Weboberfläche für das Tablet zu erstellen. :)
Nun hätte ich aber ein Problem bei dem ich nicht so ohne weiteres weiterkomme. Ich habe diese Spritpreisanzeige bei mir als Label und Chart eingebaut und würde nun gerne immer
den günstigsten Anbieter(Tankstelle) in meinem Label mit grün und den teuersten mit rot darstellen.
Das heißt ich müsste die Labelfarbe in Abhängigkeit der Spritpreis Werte untereinander darstellen. Seht ihr da eine Möglichkeit dies zu realisieren.
;)
Da fällt mir nur ein, man kann mit
data-limits-get="DEVICE:READING" ein Reading angeben, woher die Limits bezogen werden sollen. Default wäre: aus dem data-get, woher auch das Label seinen Wert bekommt -> bei dir der Spritpreis. Dann müsste man die List, wann rot und wann grün statisch im FTUI hinterlegen. Mit data-limits-get kann man im
FHEM mit einem Dummy die Logik für die rot=2/grün=1 Änderung implementieren und das Label-Widget reagiert darauf mit einer simplen Ampelschaltung
data-limits='[0,1,2]'
data-colors='["gray","green","red"]'
Zitat von: MichaelT am 13 Dezember 2015, 15:05:49
Hallo setstate,
bekommt man eigentlich mit dem select-widget hin, dass pro Eintrag ein ganzer Befehl gesendet wird?
Beispiel:
In der ComboBox steht z.B.
<div data-type="select" ... data-items='["1Live","WDR2","Vest"]'></div>
Bei Auswahl 1Live wird z.B. "set Bad stream http://www.wdr.de/wdrlive/media/einslive.m3u" geschickt.
Gruß
Michael
Ich würde es so machen:
<div data-type="select"
data-device="Bad"
data-alias='["EinsLive","RadioEins","Puls"]'
data-items='["http://www.wdr.de/wdrlive/media/einslive.m3u","http://radioeins.de/stream","http://streams.br-online.de/jugend-radio_2.m3u"]'
data-get="stream" data-set="stream" class="" ></div>
Zitat von: setstate am 15 Dezember 2015, 17:59:03
Ich würde es so machen:
<div data-type="select"
data-device="Bad"
data-alias='["EinsLive","RadioEins","Puls"]'
data-items='["http://www.wdr.de/wdrlive/media/einslive.m3u","http://radioeins.de/stream","http://streams.br-online.de/jugend-radio_2.m3u"]'
data-get="stream" data-set="stream" class="" ></div>
Klasse, probier ich mal.
Gruss
Zitat von: chris1284 am 14 Dezember 2015, 21:58:59
kann ich in einem widget prüfen ob ein reading vorhanden ist oder nicht? ich habe es bisher nicht selbst lösen können:
ich will zb wenn reading x (oder auch a_count genannt) nicht im device ist einen default wert setzen um so evtl alte werte zu verwerfen.
beispiel:
beim init des widget ist das reading a_count da und hat den wert 1. bei späterne updates gibt es das reading nicht mehr. in dem fall scheint die ui den alten wert, wo es das reading noch gab, einfach beizubehalten statt zb mit NULL zu ersetzen.
ideen ??? ?
Welche Version von Font Awesome nutzt Tablet UI? Weiß jemand wie man das einsehen kann?
Zitat von: chris1284 am 16 Dezember 2015, 07:47:51
ideen ??? ?
Das ist realisierbar mit dem Konzept von FTUI. Die Device->Readings->Values werden eventgetrieben (kpl. Liste angefordert - Refresh, oder Änderung passiert - Longpoll) beim Änderungen (Zeitstempeländerung, Wertänderung) in einem großen Objekt abgelegt und als Updateevent an alle Widgets geschickt. Nicht vorhandene Readings lösen kein Event aus.
Das müsste jedes Widget selbst per Timerabfrage zyklisch bei FHEM anfragen, das ist aber nicht vorgesehen.
Zitat von: chris1284 am 16 Dezember 2015, 07:47:51
ideen ??? ?
Da hatte ich mal eine Anfängerfrage bezüglich DOIF... Hatte das gleiche Problem... weil a_count nicht immer existiert... Habe das dann so gelöst wie es hier gemacht wurde.
http://forum.fhem.de/index.php/topic,43885.msg365907.html#msg365907 (http://forum.fhem.de/index.php/topic,43885.msg365907.html#msg365907)
kann ich die values von vorhandenen readings in der tui manuell ersetzen (leider wird ja beim löschen des readings kein event ausgelöst)?
ich würde dann immer: wert löschen -> neu einlesen -> wenn wert in fhem (also reading da) ausgabe des wertes, wenn kein wert oder mein manuell gesetzter dann ausgabe deafault text
@roman: ich habe ür mich, ohne das ich den link kannte, etwas ähnliches bereits eingebaut.
bei meinem at wird der rückgabewerte von acount nach holen der alerts geprüft und wenn halt nix kommt acount auf 0 gesetzt.
schade das man so eine krücke verwenden muss, deswegen versuch ich es im widget zu lösen, so muss niemand frickeln. auf mithilfe vom modulerschaffer braucht man ja leider nicht zu hoffen
Zitat von: mrbreil am 16 Dezember 2015, 09:02:10
Welche Version von Font Awesome nutzt Tablet UI? Weiß jemand wie man das einsehen kann?
Müsste noch auf 4.4 sein... die Icons von 4.5 gehen (noch) nicht. die aus 4.4 allerdings schon^^
Zitat von: chris1284 am 16 Dezember 2015, 09:25:31
kann ich die values von vorhandenen readings in der tui manuell ersetzen (leider wird ja beim löschen des readings kein event ausgelöst)?
ich würde dann immer: wert löschen -> neu einlesen -> wenn wert in fhem (also reading da) ausgabe des wertes, wenn kein wert oder mein manuell gesetzter dann ausgabe deafault text
Setzen: deviceStates.<DEVICE>.<READING>.val = "myWert" oder deviceStates.<DEVICE>.<READING>.date = "MyValidDate"
zum Beispiel:
deviceStates.THSensorWZ.temperature.date="2015-12-16 10:17:39" oder
deviceStates.THSensorWZ.temperature.val="29"und danach
plugins.update("THSensorWZ","temperature"); rufen
das <DEVICE> kann man nicht durch eine variable ersetzen oder?
var device = $(this).data('device');
deviceStates.device.temperature.val="0"
Zitat von: chris1284 am 16 Dezember 2015, 10:32:38
das <DEVICE> kann man nicht durch eine variable ersetzen oder?
var device = $(this).data('device');
deviceStates.device.temperature.val="0"
So gehts auch
deviceStates["THSensorWZ"].temperature.val="0"
oder mit Variable
var device = $(this).data('device');
deviceStates[device].temperature.val="0"
setstate,
ich möchte gerne einen float (label) auf 2 Nachkommastellen begrenzen.
Im Javascript gibt es die Möglichkeit ".toFixed(2);"
Wie mache ich es mit ftui? Akutell hat nämlich mein Label 8 Nachommaestellen.
Mein Code
<div style="font-size:20px" data-type="label" data-device="Gasverbrauch" data-get="countsPerDay" data-limits='[0,250,375]' data-colors='["#33cc33","#ffff00","#FF0000"]' data-unit=" Euro" data-substitution="trim()*0.004" class="cell"></div>
Zitat von: netbus am 16 Dezember 2015, 15:28:07
setstate,
ich möchte gerne einen float (label) auf 2 Nachkommastellen begrenzen.
Im Javascript gibt es die Möglichkeit ".toFixed(2);"
Wie mache ich es mit ftui? Akutell hat nämlich mein Label 8 Nachommaestellen.
Mein Code
<div style="font-size:20px" data-type="label" data-device="Gasverbrauch" data-get="countsPerDay" data-limits='[0,250,375]' data-colors='["#33cc33","#ffff00","#FF0000"]' data-unit=" Euro" data-substitution="trim()*0.004" class="cell"></div>
data-fix="2"
Ich bin Momentan daran eine Türklingel in fhem zu realisieren. Diel Türklingelerkennung funktioniert soweit auch, allerdings würde ich gerne sobald jm. klingelt Mein Tablet an der Wand angehen lassen (windows tablet) und bei der Tablet ui ein Popup aufgehen lassen(hier wird das Kamerabild der Haustür angezeigt).
Wäre schön wenn jm. eine Lösung wüsste oder auch nur eine idee hat.
Ich denke alles wird mich einen Schritt weiter bringen:)
Danke schonmal im vorraus:))
Ich würde AMAD dazu verwenden, soll das angeblich können ;) Ansonsten nehme ich Tasker + AutoRemote
Sorry hatte überlesen, dass du ein Windows Tablet hast?
Hallo,
ich habe jetzt angefangen, mit Tablet UI eine Oberfläche zu gestalten, um den Gesamtstatus meiner FHEM Installation besser darzustellen. Und ich habe noch jede Menge offener Punkte die nicht funktionieren. Ist noch viel zu lesen und zu testen.
Mit einem komme ich aber nicht weiter. Wieso sind in dem folgenden Bild die beiden Batteriesymbole nebeneinander und nicht untereinander?
<div class="cell">
<div class="left">
<div data-type="label" class="small narrow">Schlafzimmer</div>
<div data-type="symbol"
data-device="Schlafzimmer_Heizung"
data-get="battery"
data-get-on='["ok","low"]'
data-icons='["fa-battery-full","fa-battery-1"]'
data-on-colors='["Green","Red"]'>
</div>
<div data-type="symbol"
data-device="Schlafzimmer_Fenster"
data-get="Battery"
data-get-on='["ok","low"]'
data-icons='["fa-battery-full","fa-battery-1"]'
data-on-colors='["Green","Red"]'>
</div>
</div>
<
Es ist doch nirgends ein class="inline" vorhanden. Und wenn in den Label in die "Mitte" mache, sind die drei Teile untereinander.
Mit den "Left-Blöcken" habe ich mehrere Zimmer mit dem Batteriestatus nebeneinander. Das "Gerüst" habe ich aus der Userdemo von "Phil_"
Viele Grüße
Achim
PS.: ich kenne mich in HTML Programmierung nicht aus, momentan bin ich noch komplett bei "Copy/Paste" Programmierung
Durch Erzwingen zur Nutzung von nur 1/4 der Breite, erreicht man ein Untereinander der Symbole
<div class="cell">
<div class="left col-1-4">
<div class="small narrow">Schlafzimmer</div>
<div data-type="symbol"
...
Aber ich werde noch eine newline Class anlegen, damit wird das dann auch gehen.
.newline{
display: block !important;
}
<div class="cell">
<div class="left">
<div class="small narrow">Schlafzimmer</div>
<div data-type="symbol"
data-device="Schlafzimmer_Heizung"
data-get="battery"
data-get-on='["ok","low"]'
data-icons='["fa-battery-full","fa-battery-1"]'
data-on-colors='["Green","Red"]'
class="newline">
</div>
<div data-type="symbol"
data-device="Schlafzimmer_Fenster"
data-get="Battery"
data-get-on='["ok","low"]'
data-icons='["fa-battery-full","fa-battery-1"]'
data-on-colors='["Green","Red"]'
class="newline">
</div>
</div>
</div>
Hallo zusammen,
ich bin heute zufällig auf diesen Thread gestossen und muss sagen, das mir das optisch gefällt, was Ihr da macht.
Also wollte ich mir ebenfalls diese GUI installieren.
Ich bin die Schritte wie in #1 durchgegangen und bekomme nun die "Fehlermeldung" File not found: ./www/tablet/index.html
Ich habe fhem auf einem RasPi2 mit Raspbian installiert.
Dies ist die einzige Anwendung, die auf dem Pi läuft.
Muss ich da noch etwas nachinstallieren?
TfH
Hallo,
@Da_Erdinga
Hast Du auf dem Raspi im Ordner FHEM/www/Tablet die Datei index-example.html umbenannt oder eine Index.html erstellt?
Gruß Rolf
Hallo,
ich versuche mich gerade an "class col" habe bis jetzt mit Tabellen gearbeitet.
Aber leider komme ich hier zu keinem Ergebnis.
Ich habe das das Beispiel aus einem früheren Beitrag benutzt, aber die Elemente werden nicht so wie angegeben geordnet.
<li data-row="1" data-col="4" data-sizex="5" data-sizey="3">
<header>EXAMPLE3</header>
<div class="container top-space">
<div class="col-1-2">
<div class="container top-space">
<div class="col-1-3">
<div data-type="switch" data-device="Switch1" data-icon="fa-music"></div>
<div data-type="label" class="">Station1</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Switch2" data-icon="fa-music"></div>
<div data-type="label" class="">Station2</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Switch3" data-icon="fa-music"></div>
<div data-type="label" class="">Station3</div>
</div>
</div>
<div class="container top-space">
<div class="col-1-2">
<div data-type="symbol" data-device="Switch1" data-icon="fa-battery-4"></div>
<div data-type="label" class="">Value1</div>
</div>
<div class="col-1-2">
<div data-type="symbol" data-device="Switch1" data-icon="fa-battery-4"></div>
<div data-type="label" class="">Value2</div>
</div>
</div>
</div>
<div class="col-1-2">
<div data-type="volume" data-device='Volume1' class="" ></div>
</div>
</div>
</li>
und auch das Beispiel weiter oben zeigt die Symbole nur nebeneinander an.
FHEM und Tablet UI sind aktuell.
Gruß Rolf
Hallo,
vielen Dank. Mit der neuen class="newline" funktioniert das "Untereinandersetzen" der Symbole. Ich habe die neue Class mal vorab selbst in die fhem-tablet-ui.css Datei eingebaut. Ergebnis ist "Batterieanzeige.png"
Mit class="newline" sind dann aber die Batteriesymbole nicht mehr mittig. Und mir sind die Symbole zu weit auseinander. Daher habe ich mal mit weiteren Attributen (nennt man das so?) herumgetestet. Dabei habe ich (für mich) seltsame Verhaltensweisen festgestellt. Die angehängten Bilden sind nach der class-Definition benannt.
"center newline" bewirkt kein zentrieren
"centered newline" zentriert die Symbole
"center narrow newline" setzt das untere Symbol näher an das obere. Die Zentrierung ist aber nicht so "mittig" wie bei "centered newline"
"centered narrow newline" ergibt dasselbe Ergebnis wie "center narrow newline"
zum besseren Vergleich sind die Symbole beim Schlafzimmer mit "centered narrow newline" auf den Bildern. Habe ich da einen Denk- und Programmierfehler? Oder ist das Verhalten so vorgesehen oder evtl. ein Fehler in den Class Definitionen?
Viele Grüße
Achim
Hallo rvideobaer,
die index-example.html habe ich nicht geändert.
Eine index.html war in /opt/fhem/www/tablet
nicht vorhanden, diese habe ich jetzt angelegt.
Jetzt habe ich zumindest eine weisse Seite, wenn ich die GUI öffnen will.
Jetzt muss ich noch rausfinden, was ich wo eingeben muss, damit ich meine Geräte angezeigt bekomme.
Hallo Zusammen
Teilweise wird im Safaribrowser auf dem iPhone6 vermutlich die CSS nicht korrekt geladen. Dann erscheinen nur die Header Balken oder nur eine weisse Seite einer Liste.
Woran kann das liegen? Auf dem zweiten Bild sieht man wie es aussehen sollte!
Im Chrome auf dem Windows PC funktioniert alles wie es sollte.
Gruss
rename doch mal die example Datei nach index.html
Bert
kann man im symbol widget mit operatoren arbeiten?
so in etwa:
<div data-type="symbol" data-device="bz_hz" data-get="batteryLevel"
data-get-on='[>=2.2, >=2.5, >=2.7, >=3.0]'
data-icons='["fa-battery-empty","fa-battery-quarter","fa-battery-half","fa-battery-three-quarters","fa-battery-full"]'
data-on-colors='["red","orange","yellow","green"]'
class="cell">
</div>
Hallo bert,
ich habe die index-example.html in die index.html renamed, habe aber immer noch eine leere Seite beim Aufruf der GUI.
wie hast du den die tui definiert in fhem? mach mal ein list. hast du auch vorher alles runtergeladen per
update all https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt
Wenn man reine numerische Werte angibt, wird automatisch der größer/gleich Vergleich vorgezogen.
<div data-type="label"
data-device="OutTemp"
data-limits='[-73,10,23]'
data-colors='["#6699FF","#AA6900","#FF0000"]'
data-unit="%B0C%0A"
class="cell big">
</div>
Zitat von: DanHard am 18 Dezember 2015, 09:54:26
Hallo Zusammen
Teilweise wird im Safaribrowser auf dem iPhone6 vermutlich die CSS nicht korrekt geladen. Dann erscheinen nur die Header Balken oder nur eine weisse Seite einer Liste.
Woran kann das liegen? Auf dem zweiten Bild sieht man wie es aussehen sollte!
Im Chrome auf dem Windows PC funktioniert alles wie es sollte.
Gruss
Wie hast du die Scripts in die HTML Seite eingebaut? Ich empfehle es genau so, wie im mobilen Beispiel von mir angegeben, anzugeben. https://github.com/knowthelist/fhem-tablet-ui/blob/master/examples/mobil_2.html (https://github.com/knowthelist/fhem-tablet-ui/blob/master/examples/mobil_2.html)
Wichtig ist eventuell auch die longpoll_delay Angabe. Damit startet das longpoll x Millisekunden später, damit die Seite in Ruhe aufgebaut werden kann.
Zitat von: setstate am 18 Dezember 2015, 11:21:57
Wie hast du die Scripts in die HTML Seite eingebaut? Ich empfehle es genau so, wie im mobilen Beispiel von mir angegeben, anzugeben. https://github.com/knowthelist/fhem-tablet-ui/blob/master/examples/mobil_2.html (https://github.com/knowthelist/fhem-tablet-ui/blob/master/examples/mobil_2.html)
Wichtig ist eventuell auch die longpoll_delay Angabe. Damit startet das longpoll x Millisekunden später, damit die Seite in Ruhe aufgebaut werden kann.
Versuche es später! Habe als Vorlage die Exemple Datei genommen!
Melde mich wieder!
Hallo zusammen,
jetzt habe ich (glaue ich) meinen Fehler der weissen Seite gefunden.
Ich habe die index-example.html nicht wie angenommen renamed, sondern in eine "neue"Datei namens index.html verschoben.
Wie kann ich das rückgängig machen?
Ich wollte es über die grafische Oberfläche des PI machen, aber die habe ich mal (weil nicht benutzt) gelöscht.
Jetzt hab ich sie zwar nachinstalliert, aber der Pi will, das ich mich unter FHEM anmelde und da weiss ich die Zugangsdaten nicht :-(
PI und Raspberry hab ich schon probiert.
Jetzt wüde ich das ganze dann doch über die Konsole machen.
Wer kann mir da helfen?
Danke
Versuch doch mal über ftp auf den PI zuzugreifen
Hallo Leute,
Ist es normal das sich beim Swiper Widget der Inhalt der ersten Seite vom Widget nach links verschiebt? Ich kann das ganze gar nicht bündig machen.
Siehe Anhang.
Grüße
Leon
Kennt Ihr das wenn der Blitz einen trifft? Gut, dann muß ich mich nicht entschuldigen wenn ich sage ich habe es eben gelöst bekommen ;D
Danke an alle für diese tolle UI
@CoolTUx:
Woher kommen die Handy / Tablet daten?
das klingt interessant
Schau mal in meine Sig ;D
Tip: AMAD
Grüße
Hallo setstate,
Du kannst Dich sicher an das Thema MAX Heizungsthermostat und Tablet UI erinnern - siehe zitat unten.
Du hattest damals eine funktion eingebaut sodass das widget_thermostat.js auch für MAX! Thermostate in der Weise funktioniert dass das verändern der Temperatur nicht automatisch die Betriebsart auf manuell umschaltet. Das funktionierte bis zum update heute prima.
Leider klappt das jetzt nicht mehr. Habe die beiden widget_thermostat.js von "damals" und "heute" verglichen:
die Stelle mit dem zusätzlichen vergleich
if (mode === 'auto') ist sinngemäß noch drin, an etwas anderer stelle.
Der "mode" wird eine zeile zuvor gesetzt. Was mir dabei auffiel. Es gibt einen unterschied zwichen damals und heute.
damals:
var mode = getDeviceValueByName( device, this.o.mode );heute:
var mode = getDeviceValueByName( device, this.o.modes );Korrigiere ich den mode wieder wie vorher dann klappts. Kannst Du das bitte noch mal prüfen und ggf. beim nächsten upload korrigieren?
Zwei weitere Themen die seit dem Update:
1) Die skala des widget_thermostat ist zum einen verdreht, zum anderen verschiebe ich es komplett auf dem display sobald ich verstellen möchte.!? Verstellen klappt, ist eher ein optisches Thema.
2) beim switch konnte man in der vergangenheit mehrere durch Semikola getrennte Kommandos absetzten. Ich nutze es so:
div data-type="switch"
data-icon="fa-car"
data-device="wz_WandThermostat"
data-cmd="set"
data-get="mode"
data-get-on="auto|temporary"
data-get-off="manual"
data-set-on=";set wz_MaxMode auto"
data-set-off=";set wz_MaxMode manual"
class="inline cell"> </div>
Vor dem Semikolon bei data-set-on/off stand "nichts", was dazu führte, dass auch kein kommando zum wz_WandThermostat gesendet wurde (so gewünscht), es wurde dann lediglich der zweite Befehl das setzen des dummys wz_MaxMode ausgeführt.
Seit dem Update wird jetzt zusätzlich zum setzen des dummys ein fehlerhaft zusammengesetzter Befehl (unvollständig) an das wz_WandThermostat gesendet. -> Fehlermedlungen. (PERL WARNING: Use of uninitialized value $setting in string eq at ./FHEM/10_MAX.pm line 257.)
Wie kann ich das senden an das device wieder unterdrücken?
Freue mich auf Deine Rückmeldung.
Zitat von: setstate am 10 Oktober 2015, 13:10:29
@microby:
hilft das weiter:
<div data-type="thermostat"
data-device="wz_WandThermostat"
data-get="desiredTemperature"
data-set="desiredTemperature"
data-temp="temperature"
data-valve="valveposition"
data-mode="mode"
data-off="off"
data-boost="boost"
data-step="0.5"
data-min="10"
data-max="25"
data-angleoffset="0"
data-width="300"
data-height="300"
class="cell top-space-2x">
</div>
Das Thermostat liest den Wert unter data-mode="mode" aus, wenn gleich 'auto' dann wird "set wz_WandThermostat desiredTemperature auto <value>" gesendet. Bei allen anderen Varianten "set wz_WandThermostat desiredTemperature <value>"
Mit dem abgehangenen geänderten Thermostat
Zitat von: DanHard am 18 Dezember 2015, 11:25:46
Versuche es später! Habe als Vorlage die Exemple Datei genommen!
Melde mich wieder!
So habe es getestet, leider kommt immer noch sehr oft eine Seite die sehr verworfen aussieht.
Eventuell liegt es an meinem Quelltext. Kannst du einen Fehler entdecken?
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="120">
<meta name="widget_base_height" content="115">
<meta name="widget_margin" content="1">
<meta name='gridster_disable' content='0'>
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="longpoll_delay" content="2000">
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta http-equiv="Cache-Control" content="no-store" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-mobil-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<title>FHEM-Tablet-UI</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Wohnzimmer</header>
<div data-type="label" data-device="wz_temphumi" data-get="temperature" data-unit="%B0C%0A" data-limits='[0,10,15,21,23]' data-colors='["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]' class="cell big"></div>
<div data-type="label" data-device="wz_temphumi" data-get="humidity" data-unit="%" data-limits='[-1,20,39,59,65,79]' data-colors='["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]' class="cell big"></div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header>Schlafzimmer</header>
<div data-type="label" data-device="sz_temphumi"
data-get="temperature" data-unit="%B0C%0A" data-limits='[0,10,15,21,23]' data-colors='["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]' class="cell big"></div>
<div data-type="label" data-device="sz_temphumi"
data-get="humidity" data-unit="%" data-limits='[-1,20,39,59,65,79]' data-colors='["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]' class="cell big"></div>
</li>
<li data-row="2" data-col="1" data-sizex="2" data-sizey="1">
<header>Lampen</header>
<div class="cell center">
<div class="left inline">
<div data-type="switch" class="cell inline"
data-device="ge_it2"
data-get-on="on"
data-get-off="off"></div>
<div data-type="label" class="cell">Pflanzen</div>
</div>
<div class="left inline">
<div data-type="switch" class="cell inline"
data-device="ge_it1"
data-get-on="on"
data-get-off="off"></div>
<div data-type="label" class="cell">Sofa</div>
</div>
<div class="left inline">
<div data-type="switch" class="cell inline"
data-device="ge_it3"
data-get-on="on"
data-get-off="off"></div>
<div data-type="label" class="cell">X-Mas</div>
</div>
</div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="1" class="gs-w" style="background-color: rgb(42, 42, 42);">
<header>Termine</header>
<div class="cell">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Waschen" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-spinner warn","fa-spinner warn blink","fa-spinner warn"]' data-on-colors='["#5CA36A","#5CA36A","#5CA36A"]' class="smal"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Karton" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-newspaper-o warn","fa-newspaper-o warn blink","fa-newspaper-o warn"]' data-on-colors='["#996633","#996633","#996633"]' class="smal"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Papier" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-newspaper-o warn","fa-newspaper-o warn blink","fa-newspaper-o warn"]' data-on-colors='["#f9f9f9","#f9f9f9","#f9f9f9"]' class="smal"></div>
</div>
</li>
<li data-row="4" data-col="1" data-sizex="2" data-sizey="1.2" class="gs-w" style="background-color: rgb(42, 42, 42);">
<header>Wetter Aussenbereich</header>
<div class="centered" style="padding-top:10px !important;padding-bottom:15px !important">
<div class="left">
<div data-type="label" data-subtype="Temperature" data-device="aussen_temphumi" class="cell big" data-get="temperature" data-unit=" %B0C%0A" data-limits="[0,10,15,21,23]" data-colors="["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]" style="color: rgb(170, 105, 0);">17.6<span style="font-size: 50%;"> °C
</span></div>
<div data-type="label" data-subtype="Humidity" data-device="aussen_temphumi" class="cell big" data-get="humidity" data-unit=" %" data-limits="[-1,20,39,59,65,79]" data-colors="["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]" style="color: rgb(170, 105, 0);">50<span style="font-size: 50%;"> %</span></div>
</div>
<div class="left">
<div data-type="label" data-device="Meteo" data-get="fc1_wday" style="margin-bottom:5px">Do<span style="font-size: 50%;"></span></div>
<div data-type="weather" data-device="Meteo" data-get="fc1_weather" data-imageset="meteocons" style="font-size:16px;padding:5px;margin:0;margin-top:-5px;" class="weather" data-icon="Q"></div>
<div class="" style="padding:0px 5px 0px 0px">
<div data-type="label" data-device="Meteo" data-get="fc1_tempMin" data-unit="°C" class="inline">XX</div>\
<div data-type="label" data-device="Meteo" data-get="fc1_tempMax" data-unit="°C" class="inline">XX</div>
</div>
<div data-type="label" data-device="Meteo" data-get="fc1_chOfRain" data-unit="%">10<span style="font-size: 80%;">%</span></div>
</div>
<div class="left">
<div data-type="label" data-device="Meteo" data-get="fc2_wday" style="margin-bottom:5px">Do<span style="font-size: 70%;"></span></div>
<div data-type="weather" data-device="Meteo" data-get="fc2_weather" data-imageset="meteocons" style="font-size:16px;padding:5px;margin:0;margin-top:-5px;" class="weather" data-icon="Q"></div>
<div class="">
<div data-type="label" data-device="Meteo" data-get="fc2_tempMin" data-unit="°C" class="inline">XX</div>\
<div data-type="label" data-device="Meteo" data-get="fc2_tempMax" data-unit="°C" class="inline">XX</div>
</div>
<div data-type="label" data-device="Meteo" data-get="fc2_chOfRain" data-unit="%">10<span style="font-size: 50%;">%</span></div>
</div>
</div>
</ul>
</div>
</body>
</html>
Den Longpoll Delay habe ich auch schon auf 2000 gesetzt, dies hat aber leider nichts gebracht.
Danke
Hallo,
Ich möchte gerne von den Swiper Widgets die Autoplay Funktion nutzen um eine Slideshow darzustellen.
Die Fotos liegen auf einer NAS welche ich lokal gemountet habe aber sie werden leider nicht angezeigt.
<li data-row="3" data-col="6" data-sizex="4" data-sizey="2">
<div data-type="swiper" data-height="200px" data-width="250px"
data-autoplay="4000" class="top-space">
<ul>
<li><div data-type="image" data-url="/opt/fotos/Kinder/" data-refresh="60" class="nocache"></div></li>
<li><div data-type="image" data-url="/opt/fotos/Kinder/" data-refresh="60" class="nocache"></div></li>
<li><div data-type="image" data-url="/opt/fotos/Kinder/" data-refresh="60" class="nocache"></div></li>
</ul>
</div>
Woran kann das liegen?
Eventuell ein Rechteproblem?
Zitat von: CoolTux am 18 Dezember 2015, 15:02:54
Eventuell ein Rechteproblem?
das habe ich schon geprüft aber das passt.
In der angegebenen "data-url" liegen hunderte Fotos. Holt sich das Widget ein beliebiges Foto oder wie funktioniert das?
Zitat von: netbus am 18 Dezember 2015, 15:05:08
das habe ich schon geprüft aber das passt.
In der angegebenen "data-url" liegen hunderte Fotos. Holt sich das Widget ein beliebiges Foto oder wie funktioniert das?
Das geht nicht. Der Client kann kein "List" auf dem Server veranlassen und sich eine Datei auswählen. Maximal könnte man eine Zufallszahl auf dem Client erzeugen und dann einen Filenamen zusammenbauen. Dann müssten aber alle Fotos durchnummeriert sein und im Bereich des RND liegen. Einfacher ist es, serverseitig per PHP den Random-Mechanismus zu implementieren.
ok danke
-- edit: Formatierungsproblem gelöst --
Bleibt die Erweiterung des Range-Widgets
Servus zusammen!
Ich bin gerade dabei die Visualisierung für das Projekt "Bierwaage" http://forum.fhem.de/index.php/topic,44684.0.html zusammenzuschrauben. Dabei möchte ich das Range-Widget ein bissl umbauen, so dass es "hinter" einem PNG liegt (vermutlich mittels z-index) und durch die transparenten Bereiche des PNGs "durchscheint". Soweit bin ich aber noch nicht, weil mir im Vorfeld schon was quer läuft:
Leider verhagelt es mir total das Layout, weil die PNGs mit unnötig viel "Rand drumrum" angezeigt werden. Die PNGs sind im Original 200x127px groß.
Wenn ich diese aber einbaue, dann schrumpft es die Bilder auf eine deutlich kleinere Größe zusammen. Dennoch kriege ich die beiden Spalten Fass1 u. Fass2 nicht näher zusammen gerückt. Irgendwas muss ich doch am Code übersehen, bzw. nicht verstehen. Hat jemand eine Idee hierzu?
Was mir gefehlt hat waren die col-1-x-Klassen
...
<meta name="widget_base_width" content="105">
<meta name="widget_base_height" content="42">
...
<li data-row="3" data-col="1" data-sizex="2" data-sizey="5">
<div class=" center">
<div class="left col-1-3">
<div class="large top-space">Fass 1</div>
<div data-type="image" data-url="/fhem/tablet/images/keg.png" data-size="100%"
class="top-space"></div>
</div>
<div class="left col-1-3">
<div class="large top-space">CO<sup>2</sup></div>
<div data-type="image" data-url="/fhem/tablet/images/co2.png" data-size="60%"
class="top-space"></div>
</div>
<div class="left col-1-3">
<div class="large top-space">Fass 2</div>
<div data-type="image" data-url="/fhem/tablet/images/keg.png" data-size="100%"
class="top-space"></div>
</div>
</div>
</li>
Ok, es heisst wohl data-size an Stelle von data-width.
Mit data-size=" 100%" gibt's keine Abstände (vorausgesetzt die gridster-width ist ausreichend). Mit data-size="75%" hab ich ich aber wieder das Problem, dass die gridster-width > Originalbildbreite (127px) sein muss, um die beiden Fässer in einer Reihe anzuzeigen. Hmm, wo liegt den nur der Fehle
Ach, und wenn jemand reeein zufällig eine gute Idee zur Umsetzung des PNG-Overlays hat, nur her damit ;-)
Zitat von: DanHard am 18 Dezember 2015, 14:51:51
So habe es getestet, leider kommt immer noch sehr oft eine Seite die sehr verworfen aussieht.
Eventuell liegt es an meinem Quelltext. Kannst du einen Fehler entdecken?
Den Longpoll Delay habe ich auch schon auf 2000 gesetzt, dies hat aber leider nichts gebracht.
Danke
Wenn ich Deinen Code anschaue fällt mir auf, dass es einen Eintrag:
data-sizey="1.2" gibt.
Ausserdem ist es schwer zu überprüfen, da die Einrückung recht "willkürlich" ist, damit ist nicht klar, ob die Elemente wirklich zu einander gehören.
Longpoll sollte mit dem Aufbau der Seite nichts zutun haben, das heisst mit dem durcheinanderwürfeln von Gridster-Elementen. Oder habe ich jetzt etwas missverstanden?
Johannes
Zitat von: viegener am 18 Dezember 2015, 17:01:04
Wenn ich Deinen Code anschaue fällt mir auf, dass es einen Eintrag:
data-sizey="1.2" gibt.
Ausserdem ist es schwer zu überprüfen, da die Einrückung recht "willkürlich" ist, damit ist nicht klar, ob die Elemente wirklich zu einander gehören.
Longpoll sollte mit dem Aufbau der Seite nichts zutun haben, das heisst mit dem durcheinanderwürfeln von Gridster-Elementen. Oder habe ich jetzt etwas missverstanden?
Johannes
Das mit dem Data-sizey 1.2 ist Absicht! Oder Muss ich das anderst machen?
Aber der Fehler kommt auch wenn data-sizey 1 ist.
Zitat von: DanHard am 18 Dezember 2015, 17:05:48
Das mit dem Data-sizey 1.2 ist Absicht! Oder Muss ich das anderst machen?
Aber der Fehler kommt auch wenn data-sizey 1 ist.
Die Grössenangaben bei Gridster müssen aber meines Wissens nach Ganzzahlen sein.
Dann wirst Du genauer beschreiben müssen was das Problem ist, mit
Zitatkommt immer noch sehr oft eine Seite die sehr verworfen aussieht.
ist es schwierig etwas zu finden...
Johannes
Ich versuche gerade, das Widget Knob bzw. Thermostat etwas zu erweitern. Ich finde aber gerade im Code die Stelle nicht, wo die große Zahl in der Mitte des Kreises ausgegeben wird (beim Thermostat die desired temp). Kann mir jemand auf die Sprünge helfen?
was meinst du? wo du angibts, was die zahl ist (also welches reading) oder im widget-code selber (die js datei)?
Zitat von: chris1284 am 18 Dezember 2015, 18:48:23
was meinst du? wo du angibts, was die zahl ist (also welches reading) oder im widget-code selber (die js datei)?
Ich meine die .js Datei. Habe die Valve-Position sowie die aktuelle Temperatur in widget_thermostat.js gefunden. Allerdings nicht die desired temperature.
Zitat von: chris1284 am 18 Dezember 2015, 18:48:23
was meinst du? wo du angibts, was die zahl ist (also welches reading) oder im widget-code selber (die js datei)?
Ich meine den Code in der .js Datei. Habe die Valve-Position sowie die aktuelle Temperatur in widget_thermostat.js gefunden. Allerdings nicht die Ausgabe der desired temperature.
Zitat von: DanHard am 18 Dezember 2015, 14:51:51
So habe es getestet, leider kommt immer noch sehr oft eine Seite die sehr verworfen aussieht.
Eventuell liegt es an meinem Quelltext. Kannst du einen Fehler entdecken?
Kann ich bestätigen. Hab gestern einen RasPi mit FHEM und FTUI komplett neu aufgesetzt. Das FTUI bringt nur ca. alle 4-5 Reloads einen vernünftigen Seitenaufbau. Mein "alter" RasPi nudelt hingegen hervorragend. An was das liegt kann ich (noch) nicht nachvollziehen.
Zitat von: setstate am 18 Dezember 2015, 15:31:37
..., serverseitig per PHP den Random-Mechanismus zu implementieren.
Ich habe nun genau das gemacht. Wenn ich mit dem Browser auf meinem Server die index.php aufrufe bekomme ich bei jedem refresh ein neues Bild.
Genau diese URL habe ich im widget hinterlegt doch es kommt kein Bild
<div data-type="image"
data-size="80%"
data-url="http://192.168.1.4/index.php"
</div>
Zitat von: netbus am 18 Dezember 2015, 21:42:36
Ich habe nun genau das gemacht. Wenn ich mit dem Browser auf meinem Server die index.php aufrufe bekomme ich bei jedem refresh ein neues Bild.
Genau diese URL habe ich im widget hinterlegt doch es kommt kein Bild
<div data-type="image"
data-size="80%"
data-url="http://192.168.1.4/index.php"
</div>
Spitzenklasse bis hier hin schonmal. Liefert aber das PHP auch ein Image File, oder nur ein HTML, was ein Image eingebettet hat?
es liefert ein HTML mit einem image
<?php
$result = glob('fotos/photo/Kinder/2011/*');
shuffle($result);
foreach($result as $result) {
break;
}
?>
<img src="<?php echo "$result"; ?>" />
EDIT:
Habs gelöst mit
<?php
$result = glob('fotos/photo/Kinder/2011/*');
shuffle($result);
foreach($result as $result) {
break;
}
header('Content-Type: image/jpeg');
// Das Bild ausgeben
readfile($result);
?>
Wollt ich gerade antworten. ;D
Content-Type: Image
muss der Output sein.
Daumen hoch!
@mircoby:
nur mode statt modes that's it? Kein Problem, ändere ich. Sorry für den Bug ...
zu den anderen Punkten:
1) hier verstehe ich das Problem nicht
2) wie soll das vorher funktioniert haben, dass der erste Teil des Commands weggelassen wurde?
Zitat von: zap am 18 Dezember 2015, 19:33:52
Ich meine den Code in der .js Datei. Habe die Valve-Position sowie die aktuelle Temperatur in widget_thermostat.js gefunden. Allerdings nicht die Ausgabe der desired temperature.
Die mittlere Wert des Knob ist das <input type="text" selbst
widget_knob.js:
var knob_elem = jQuery('<input/>', {
type: 'text',
...
Style im jquery.knob.mod.js
this.i.css(...
Moin.
Ich habe hier einen Dialog mit zwei Buttons/Links die bewirken, dass entweder FHEM oder der RasPi neustarten.
Wenn ich jetzt einen dieser Buttons/Links klicke wird der Befehl gesendet und anschließend (oder gleichzeitig) soll sich der Dialog schließen.
Bin jetzt schon eine Weile am probieren mit:... <div onclick=".....">
base.close
base.hide(dialog,elem.data('mode'))
close.on('click',function()
dialog.close
dialog.hide
usw.....
Wie geht es denn nun richtig? Bzw. geht das überhaupt?
Danke im Vorraus.
Grüße^^
So, nach einiger Fummelei hab ich das PNG und das Range-Widget nun übereinander gebracht.
Jetzt wäre es natürlich noch schön, wenn die Flüssigkeitsoberfläche perspektisch dargestellt werden könntee. Hat hierzu jemand einen CSS-seitigen Ansatz?
<li data-row="3" data-col="1" data-sizex="3" data-sizey="5">
<div class="centered">
<div class="left col-1-3">
<div class="large top-space">Fass 1</div>
<div data-type="range" data-device="Fass_1"
data-low="" data-high="STATE" data-width="110" data-height="174"
data-max="65" data-min="0"
data-limit-low="5" data-limit-high="40"
data-color-low="red" data-color="orange" data-color-high="green" class="top-space nolabels"
style="position:absolute; z-index:1;"></div>
<div data-type="image" data-url="/fhem/tablet/images/keg.png" data-size="100%"
style="position:relative; z-index:2;" class="top-space"></div>
</div>
<div class="left col-1-3">
<div class="large top-space">CO<sup>2</sup></div>
<div data-type="image" data-url="/fhem/tablet/images/co2.png" data-size="60%"
class="top-space"></div>
</div>
<div class="left col-1-3">
<div class="large top-space">Fass 2</div>
<div data-type="range" data-device="Fass_2"
data-low="" data-high="STATE" data-width="110" data-height="174"
data-max="50" data-min="0"
data-limit-low="5" data-limit-high="40"
data-color-low="red" data-color="orange" data-color-high="green" class="top-space nolabels"
style="position:absolute; z-index:1; opacity:0.8;"></div>
<div data-type="image" data-url="/fhem/tablet/images/keg.png" data-size="100%"
style="position:relative; z-index:2; opacity:1.0;" class="top-space"></div>
</div>
</div>
</li>
Hallo Zusammen
Einige Posts zuvor habe ich erwähnt das bei mir die Daten teilweise nicht richtig geladen werden.
Entweder ist die Formatierung durcheinander oder es macht den Anschein das die CSS Datei nicht geladen wird.
Leider hat das Verwenden der Mobile Vorlage nichts gebracht. Bei jedem 3 oder 4 Laden der Seite wird sie nicht korrekt dargestellt.
Das "longpoll_delay" habe ich bereits bis 3000 erhöht.
Anbei habe ich euch zwei Beispiele angefügt.
Was ich versucht habe:
Bei der Console im Chrome habe ich die Network Geschwindigkeit auf "Good 3G" gestellt, dann sehe ich das gleiche wie im
Safaribrowser auf dem iPhone 6, also die Seite wird nicht korrekt dargestellt.
Der grosse Unterschied:
Chrome auf Windows: Die Seite ladet fertig und es wird alles richtig angezeigt.
Safari in iPhone 6: Die Seite ladet aber ich habe das Gefühl das er nach einer gewissen Zeit mit dem Laden stoppt.
Ich hoffe jemand kann mir helfen und kann mit meinen Erkenntnissen was anfangen.
Hier nochmals mein kompletter Quelltext:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="120">
<meta name="widget_base_height" content="115">
<meta name="widget_margin" content="1">
<meta name='gridster_disable' content='0'>
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1">
<meta name="longpoll_delay" content="3000">
<meta name="debug" content="0">
<meta http-equiv="Cache-Control" content="no-store" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-mobil-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<title>Homeinfo</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Wohnzimmer</header>
<div data-type="label" data-device="wz_temphumi" data-get="temperature" data-unit="%B0C%0A" data-limits='[0,10,15,21,23]' data-colors='["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]' class="cell big"></div>
<div data-type="label" data-device="wz_temphumi" data-get="humidity" data-unit="%" data-limits='[-1,20,39,59,65,79]' data-colors='["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]' class="cell big"></div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header>Schlafzimmer</header>
<div data-type="label" data-device="sz_temphumi" data-get="temperature" data-unit="%B0C%0A" data-limits='[0,10,15,21,23]' data-colors='["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]' class="cell big"></div>
<div data-type="label" data-device="sz_temphumi" data-get="humidity" data-unit="%" data-limits='[-1,20,39,59,65,79]' data-colors='["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]' class="cell big"></div>
</li>
<li data-row="2" data-col="1" data-sizex="2" data-sizey="1">
<header>Lampen</header>
<div class="cell center">
<div class="left inline">
<div data-type="switch" class="cell inline" data-device="ge_it2" data-get-on="on" data-get-off="off"></div>
<div data-type="label" class="cell">Pflanzen</div>
</div>
<div class="left inline">
<div data-type="switch" class="cell inline" data-device="ge_it1" data-get-on="on" data-get-off="off"></div>
<div data-type="label" class="cell">Sofa</div>
</div>
<div class="left inline">
<div data-type="switch" class="cell inline" data-device="ge_it3" data-get-on="on" data-get-off="off"></div>
<div data-type="label" class="cell">X-Mas</div>
</div>
</div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="1" class="gs-w" style="background-color: rgb(42, 42, 42);">
<header>Termine</header>
<div class="cell">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Waschen" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-spinner warn","fa-spinner warn blink","fa-spinner warn"]' data-on-colors='["#5CA36A","#5CA36A","#5CA36A"]' class="smal"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Karton" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-newspaper-o warn","fa-newspaper-o warn blink","fa-newspaper-o warn"]' data-on-colors='["#996633","#996633","#996633"]' class="smal"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Papier" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-newspaper-o warn","fa-newspaper-o warn blink","fa-newspaper-o warn"]' data-on-colors='["#f9f9f9","#f9f9f9","#f9f9f9"]' class="smal"></div>
</div>
</li>
<li data-row="4" data-col="1" data-sizex="2" data-sizey="1.2" class="gs-w" style="background-color: rgb(42, 42, 42);">
<header>Wetter Aussenbereich</header>
<div class="centered" style="padding-top:10px !important;padding-bottom:15px !important">
<div class="left">
<div data-type="label" data-subtype="Temperature" data-device="aussen_temphumi" class="cell big" data-get="temperature" data-unit=" %B0C%0A" data-limits="[0,10,15,21,23]" data-colors="["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]" style="color: rgb(170, 105, 0);">17.6<span style="font-size: 50%;"> °C</span></div>
<div data-type="label" data-subtype="Humidity" data-device="aussen_temphumi" class="cell big" data-get="humidity" data-unit=" %" data-limits="[-1,20,39,59,65,79]" data-colors="["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]" style="color: rgb(170, 105, 0);">50<span style="font-size: 50%;"> %</span></div>
</div>
<div class="left">
<div data-type="label" data-device="Meteo" data-get="fc1_wday" style="margin-bottom:5px">Do<span style="font-size: 50%;"></span></div>
<div data-type="weather" data-device="Meteo" data-get="fc1_weather" data-imageset="meteocons" style="font-size:16px;padding:5px;margin:0;margin-top:-5px;" class="weather" data-icon="Q"></div>
<div class="" style="padding:0px 5px 0px 0px">
<div data-type="label" data-device="Meteo" data-get="fc1_tempMin" data-unit="°C" class="inline">XX</div>\
<div data-type="label" data-device="Meteo" data-get="fc1_tempMax" data-unit="°C" class="inline">XX</div>
</div>
<div data-type="label" data-device="Meteo" data-get="fc1_chOfRain" data-unit="%">10<span style="font-size: 80%;">%</span></div>
</div>
<div class="left">
<div data-type="label" data-device="Meteo" data-get="fc2_wday" style="margin-bottom:5px">Do<span style="font-size: 70%;"></span></div>
<div data-type="weather" data-device="Meteo" data-get="fc2_weather" data-imageset="meteocons" style="font-size:16px;padding:5px;margin:0;margin-top:-5px;" class="weather" data-icon="Q"></div>
<div class="" style="padding:0px 5px 0px 0px">
<div data-type="label" data-device="Meteo" data-get="fc2_tempMin" data-unit="°C" class="inline">XX</div>\
<div data-type="label" data-device="Meteo" data-get="fc2_tempMax" data-unit="°C" class="inline">XX</div>
</div>
<div data-type="label" data-device="Meteo" data-get="fc2_chOfRain" data-unit="%">10<span style="font-size: 50%;">%</span></div>
</div>
</div>
</ul>
</div>
</body>
</html>
Falls ihr noch angaben braucht, nur melden, dann kann ich's nachliefern.
Gruss
Hallo Zusammen,
nachdem ich weiterhin nur eine weisse Seite bekomme habe ich ein Backup eingespielt und damit (hoffentlich) erstmal alles rückgängig gemacht.
Jetzt bin ich die Schritte aus Post #1 nochmals durchgegangen, mit dem Ergebnis: weisse Seite.
Woran kann das liegen?
Was habt ihr in der Def geändert?
Wenn ich die Def in
ftui ./www/tablet/index-example
änder, bekomme ich die Fehlermeldung, das es die ./www/tablet/index-example/index.html nicht gibt.
Wenn ich die Daten der index-example.html mit nano in die index.html kopiere und danach Speichern will, kommt nur der Hinweis "index.html ist ein Verzeichnis".
Was kann ich da machen?
Der Zugriff über ftp gelingt zwar, aber ich kann keine Namen ändern. >:(
Hallo,
wenn du mit Windows arbeitest, bearbeite die Dateien mit WinSCP. Geht meiner Meinung richtig gut.
Gruß,
SteRa
PS: Gib mal die Adresse http://deineIPFhem:8083/fhem/tablet/index-example.html ein
Zitat von: Da_Erdinga am 20 Dezember 2015, 13:06:03
Hallo Zusammen,
nachdem ich weiterhin nur eine weisse Seite bekomme habe ich ein Backup eingespielt und damit (hoffentlich) erstmal alles rückgängig gemacht.
Jetzt bin ich die Schritte aus Post #1 nochmals durchgegangen, mit dem Ergebnis: weisse Seite.
Woran kann das liegen?
Was habt ihr in der Def geändert?
Wenn ich die Def in
ftui ./www/tablet/index-example
änder, bekomme ich die Fehlermeldung, das es die ./www/tablet/index-example/index.html nicht gibt.
Wenn ich die Daten der index-example.html mit nano in die index.html kopiere und danach Speichern will, kommt nur der Hinweis "index.html ist ein Verzeichnis".
Was kann ich da machen?
Der Zugriff über ftp gelingt zwar, aber ich kann keine Namen ändern. >:(
Hallo,
bei mir funktioniert der Refresh im Browser für Type="Image" nicht. In der Console zählt eine Zahl immer die Sekunden hoch und dann refresh, aber es passiert nix. Die ganzen anderen "Switch" usw. schalten alle sofort und zeigen es auch an.
Mach ich ein Browserrefresh geht es. Benutze den Chromebrowser.
<li data-row="2" data-col="1" data-sizex="5" data-sizey="5">
<div class="center top-space">
<div data-type="image"
data-size="98%"
data-url="http://192.168.1.76:8083/fhem/web/raspipic.jpg"
data-refresh="10">
</div>
</div>
</li>
Gerade ist mir auch aufgefallen, dass der Pushbutton nicht mehr auslöst. Hat das was mit einem Update zu tun.
Gruß,
SteRa
Hallo Stera,
über den Link geht es.
Ich arbeite aber mit Ubuntu 14.04 LTS, da hilfen mir Windows-Programme nichts.
Ich denke, da muss ich mich nochmal auf die Suche begeben um die Dateien zu ändern.
Zitat von: Da_Erdinga am 20 Dezember 2015, 13:06:03
Hallo Zusammen,
nachdem ich weiterhin nur eine weisse Seite bekomme habe ich ein Backup eingespielt und damit (hoffentlich) erstmal alles rückgängig gemacht.
Jetzt bin ich die Schritte aus Post #1 nochmals durchgegangen, mit dem Ergebnis: weisse Seite.
Woran kann das liegen?
Was habt ihr in der Def geändert?
Wenn ich die Def in
ftui ./www/tablet/index-example
änder, bekomme ich die Fehlermeldung, das es die ./www/tablet/index-example/index.html nicht gibt.
Wenn ich die Daten der index-example.html mit nano in die index.html kopiere und danach Speichern will, kommt nur der Hinweis "index.html ist ein Verzeichnis".
Was kann ich da machen?
Der Zugriff über ftp gelingt zwar, aber ich kann keine Namen ändern. >:(
Da passt einiges nicht:
Wenn index.html ein Verzeichnis macht das übrhaupt keinen Sinn...
Die FTUI-Definition oben macht so auch keinen Sinn --> Es sollte das Verzeichnis der FTUI-Installation ausgewählt werden
Hinweise:
- Besorge Dir Shell / ssh-Zugang auf Deine Box (FTP-Zugang ist gut aber häufig nicht ausreichend)
- Verschiebe oder lösche alles was in .../www/tablet steht
- Kopiere die FTUI in das in der Installationsanleitung angebene Verzeichnis --> https://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui)
- Lege den HTTPSRV-Device an (vorher natürlich den alten löschen)
- kopiere index-example.html nach index.html oder rufe http://<fhem-url>:8083/fhem/ftui/index-example.html auf
Eigentlich ist das genau beschrieben, wenn Du davon abweichst ohne zu wissen warum kann es leicht weiter weg führen...
-
Zitat von: roman1528 am 19 Dezember 2015, 13:03:02
Moin.
Ich habe hier einen Dialog mit zwei Buttons/Links die bewirken, dass entweder FHEM oder der RasPi neustarten.
Wenn ich jetzt einen dieser Buttons/Links klicke wird der Befehl gesendet und anschließend (oder gleichzeitig) soll sich der Dialog schließen.
Bin jetzt schon eine Weile am probieren mit:... <div onclick=".....">
base.close
base.hide(dialog,elem.data('mode'))
close.on('click',function()
dialog.close
dialog.hide
usw.....
Wie geht es denn nun richtig? Bzw. geht das überhaupt?
Danke im Vorraus.
Grüße^^
*PUSH*
letzter Beitrag auf einer Seite wird leider gern übersehen...
Hallo liebe Gemeinde,
hätte mal eine "Anfängerfrage".
Habe ein circlemenu für die Temperaturregelung für den Thermostaten erstellt:
hier ein Auszug:
<li><div data-type="push" data-device="HM_336621_Clima"
data-set="desired-temp 12" data-on-background-color="#00ff00"
data-off-background-color="#00ff00" data-on-color="#ff0000"
data-off-color="#00ff00"
data-icon=""><font color="#ff0000">12</font></div></li>
nun würde ich gerne hinter dem desired-temp befehl gleich burstXmit hinterher schicken, damit die Temp sofort geändert wird.
Wie kann man denn 2 data-sets verwenden?
Hoffe es ist verständlich und jmd kann mir helfen.
Danke euch.
Hi setstate,
ja "mode", statt "modes" damit funktioniert das umschalten zwischen den Betriebsarten manuell und auto wieder richtig. Bitte bei Gelegenheit mal mit ändern.
zu den anderen Punkten.
1) Beim Thermostat widget ist die Skala seit dem update um 240° verdreht. Siehe Bild "0Grad_Wohnzimmer.png". Um dies zu korrigieren muss ein data-angleoffset="240" gesetzt werden, siehe Bilder "240Grad_Wohnzimmer.png" + "240Grad_WohnzimmerConfig.png".
Das ist das eine. Zum anderen verschiebt sich neben dem Regler auch das popup-fenster, sobald ich mit der Maus die Temperatur verstelle. (es folgt quasi der Mausbewegung). Dies kann ich mit Firefox und IE nachstellen. Auf dem IPad funktioniert es richtig (also Popup bleibt stehen, der Regler verschiebt sich).
Beim austesten habe ich auch noch einen Unterschied im Verhalten zwischen einem
MAX! Wandthermostat und einem
MAX! Heizungsthermostat festgestellt. Beim verstellen des
Wandthermostats wird folgender Befehl abgesetzt
"set max_Wandthermostat desiredTemperature 22 auto" wenn im Automatik Modus, ansonsten
"set max_Wandthermostat desiredTemperature 22" im manuellen Modus. Das passt.
Beim
Heizungsthermostat wird nie das
"auto" mitgesendet, was dazu führt dass beim verstellen der Temperatur im Automatikmodus, dieser in den manuellen Modus wechselt. Könnte ursächlich mit dem "mode / modes" Thema zusammenhängen. Dort fehlte ebenfalls das "auto"
2) Ich verwende einen "switch" um die Betriebsart der MAX! Heizung zwischen manuell und automatik zu wechseln. Nachdem ich mit einem switch teilweise mehrere Thermostate ansprechen will möchte ich eine Dummy variable setzen (der Rest läuft dann über ein notify mit nachgelagertem Funktionsaufruf). Damit ich immer den korrekten Zustand der Heizung im Tablet UI angezeigt bekomme, gebe ich das relevante MAX! device im "switch" an. (nicht den dummy). Schalten möchte ich mit dem switch jedoch nicht den das MAX! device direkt sondern den dummy. Konfiguration siehe Bild "SwitchWandthermostat.png"
Vor dem update konnte ich das so machen:
data-set-on=";set wz_MaxMode auto"es wurde dann lediglich der Befehl:
"set wz_MaxMode auto" abgesetzt, den Rest hat die Funktion erledigt.
Seit dem Update hat sich das Verhalten (bei gleicher Konfiguration geändert. Es werden nun folgende Befehle abgesetzt:
"wz_Wandthermostat ;set wz_MaxMode auto" abgesetzt.
Ich möchte quasi nur den 2ten Befehl abschicken.
Gruß Mirko
Zitat von: setstate am 19 Dezember 2015, 00:20:08
@mircoby:
nur mode statt modes that's it? Kein Problem, ändere ich. Sorry für den Bug ...
zu den anderen Punkten:
1) hier verstehe ich das Problem nicht
2) wie soll das vorher funktioniert haben, dass der erste Teil des Commands weggelassen wurde?
Zitat von: mircoby am 20 Dezember 2015, 20:10:40
Beim Heizungsthermostat wird nie das "auto" mitgesendet, was dazu führt dass beim verstellen der Temperatur im Automatikmodus, dieser in den manuellen Modus wechselt. Könnte ursächlich mit dem "mode / modes" Thema zusammenhängen. Dort fehlte ebenfalls das "auto"
attr <thermostat> keepAuto 1Dann muss kein auto mitgesendet werden ... auch Sinnvoll wenn man seine Thermostate über Push bedient... (ThermostatWidget sagt mir auf'm Tablet nicht so zu).
Grüße^^
Hi roman1528,
das war ein guter Tipp, damit konnte ich das auto/manual Verhalten reparieren.
Danke Gruß
Mirko
Habt ihr für mein Problem / Frage auch eine Lösung?
Zitat von: rizo am 20 Dezember 2015, 21:26:47
Habt ihr für mein Problem / Frage auch eine Lösung?
Oh je nach 90 Minuten noch keine Antwort, das ist manchmal schwer auszuhalten ;)
Wenn Du mehrere Befehle verschicken willst wäre der bessere Mechanismus vermutlich fhem selbst. Ein Dummy in dem Du bei Setzen der Temperatur diese an den Thermostat weitergibt und dann auch den burstXMit auslöst.
ja sorry für die ungeduld, kenne es halt leider zu oft aus anderen Foren, das die vorhergestellte Frage nur allzu oft überlesen wird.
Danke für die Antwort. Werde ich mal versuchen umzusetzen.
Anderes Problem:
wie Stera hier gestern schon schrieb, seitdem ich gestern tablet ui update gemacht habe funktionieren die Push Buttons nicht mehr.
Gibt es da eine Änderung?
Ah ok habe die Lösung hier im Forum ein paar Seiten zurück gefunden.
anstatt data-set zu nutzen muss man jetzt data-set-on nutzen dann klappt es wieder.
Zitat von: viegener am 20 Dezember 2015, 21:35:52
Wenn Du mehrere Befehle verschicken willst wäre der bessere Mechanismus vermutlich fhem selbst. Ein Dummy in dem Du bei Setzen der Temperatur diese an den Thermostat weitergibt und dann auch den burstXMit auslöst.
Sry ich benötige dabei leider wieder Hilfe.
wie schreibe ich denn einen Dummy der bei einem Thermostat bei jedem Temp wechsel automatisch burstXmit auch sendet?
oder muss jeweils einzeln für jede Temperatur ein dummy erstellt werden?
Hallo!
Seit ich auf Pagetab umgestellt habe, tue ich mir schwer mit dem Testen. Der FHEM-Server scheint zu cachen. Wenn ich Änderungen mache, sehe ich diese auch nach Browserneustart und Cache des Browsers löschen nicht. Über Nacht ist immer alles gut.
Was ich schon (ohne Erfolg) versucht habe, waren folgende Zeilen in der index.html:
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
Kann man dem Webserver von FHEM irgendwie das Cachen abgewöhnen?
Danke und Gruß
Phil
Zitat von: Stril am 21 Dezember 2015, 10:14:07
Seit ich auf Pagetab umgestellt habe, tue ich mir schwer mit dem Testen. Der FHEM-Server scheint zu cachen. Wenn ich Änderungen mache, sehe ich diese auch nach Browserneustart und Cache des Browsers löschen nicht. Über Nacht ist immer alles gut.
Das Problem mit dem Cachen kenne ich leider auch, für Firefox ist die Lösung den http-Cache temporär zu deaktivieren:
In about:config --> nach use-http suchen --> die Option für den test auf false setzen
Zitat von: viegener am 21 Dezember 2015, 13:20:38
Das Problem mit dem Cachen kenne ich leider auch, für Firefox ist die Lösung den http-Cache temporär zu deaktivieren:
In about:config --> nach use-http suchen --> die Option für den test auf false setzen
Hallo!
Prima, wobei bei mir die Optionen wie folgt benannt waren:
browser.cache.disk.enable
browser.cache.memory.enable
Gruß
Phil
Spannend die Option network.http.use-cache die ich immer verwendet habe ist gerade mit Version 43 entfernt worden >:(
http://www.ghacks.net/2015/12/15/firefox-43-find-out-what-is-new/ (http://www.ghacks.net/2015/12/15/firefox-43-find-out-what-is-new/)
Warum auch immer die Option entfernt wurde kann ich nicht nachvollziehen, sie hat jedenfalls bis letzte Woche gut funktioniert.
Vielleicht hilft auch die Developer Toolbox, die hat auch eine Option zum deaktivieren des Caches:
https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox (https://developer.mozilla.org/en-US/docs/Tools/Tools_Toolbox)
Ich kann das leider gerade selber nicht probieren.
Johannes
Hallo!
Noch eine andere Sache:
Nutzt von euch jemand das "Reload"-Widget? Bei mir kommt irgendwie kein Icon, obwohl ich mich nah am Wiki gehalten habe:
<div data-type="reload"
data-device="RELOAD"
data-get="action"
data-reload-on="1"
data-icon="fa-refresh"
data-reset-to="0"></div>
Habt ihr dazu eine Idee?
Gruß
Phil
Hallo zusammen,
da ich eine Nachricht (inkl. Bestätigung) auf mein Tablet bringen wollte, habe ich mir heute ein neues Widget names "alertmsg" gebaut.
Da es eine Standard JavaScript Alert Nachricht ist, muss diese vom Benutzer bestätigt werden.
Basis hierfür war das 'label'-Widget.
Das Widget prüft auf das Reading 'msg'.
Sollte dieses in FHEM gesetzt werden erscheint sofort die Nachricht (msg) auf dem FTUI.
Eine Nachricht kann abgesetzt werden mit dem Befehl 'setreading <device> msg "NACHRICHT"'
Folgenden Dummy nutze ich derzeit:
Internals:
CFGFN
NAME ftuimsg
NR 24194
STATE ???
TYPE dummy
Readings:
2015-12-21 15:14:24 msg ftui-processed
Attributes:
Vielleicht kann es noch jemand gebrauchen....
Einfach als 'widget_alertmsg.js' in den Ordner 'tablet' speichern und im FTUI HTML File wie folgt einbinden (das Widget selbst ist nicht sichtbar):
<div data-type="alertmsg" class="cell" data-device="ftuimsg"></div>
Anbei der Code:
if(typeof widget_widget == 'undefined') {
loadplugin('widget_widget');
}
var widget_alertmsg = $.extend({}, widget_widget, {
widgetname:"alertmsg",
init_attr: function(elem) {
elem.data('get', elem.data('get') || 'msg');
elem.data('part', elem.data('part') || -1);
readings[elem.data('get')] = true;
},
init: function () {
this.elements = $('div[data-type="'+this.widgetname+'"]');
this.elements.each(function(index) {
widget_alertmsg.init_attr($(this));
});
},
update: function (dev,par) {
var base = this;
var deviceElements= this.elements.filter('div[data-device="'+dev+'"]');
deviceElements.each(function(index) {
if ( $(this).data('get')==par){
var value = ($(this).hasClass('timestamp'))
?getReadingDate( $(this), 'get' )
:getDeviceValue( $(this), 'get' );
if (value){
var val = getPart(value,-1);
if (val){
if ( val != 'ftui-processed' ){
//JS Alert message
alert(val);
setFhemStatus("setreading "+$(this).data('device')+" "+$(this).data('get')+" ftui-processed");
}
}
}
}
});
}
});
Zitat von: Stril am 21 Dezember 2015, 15:24:40Nutzt von euch jemand das "Reload"-Widget?
<div data-type="reload"
data-device="RELOAD"
data-get="action"
data-reload-on="1"
data-icon="fa-refresh"
data-reset-to="0"></div>
Das Widget wartet nur auf 1 aus dem RELOAD Device und erzeugt aber kein separates Icon. Es löst dann einfach nur den Reload aus.
Viele Grüsse, Uli
Hallo!
Danke, dann habe ich das falsch verstanden. Hab es jetzt so gelöst:
<A HREF="javascript:history.go(0)">
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="push" data-icon="fa-refresh" class="cell" data-off-background-color="#aa6900" data-off-color="#aa6900"></div>
</A>
<div data-type="label" class="small narrow darker">Reload</div>
Hallo!
ich habe das mit der Heizung nun wie folgt gelöst:
define BadHeiz notify HM_33662A_Clima:set_desired-temp.* set HM_33662A_Clima burstXmit
nun wird bei jeder Temp Änderung ein burstXmit gesendet und Temperatur sofort geändert.
Nur leider schickt fhem den Befehl 2x raus, was ja wohl nicht so gut sein soll wegen Overflow.
Hier Auszug aus Log:
CUL_HM set HM_33662A_Clima burstXmit
CUL_HM set HM_33662A_Clima burstXmit
CUL_HM set HM_33662A_Clima desired-temp 20
warum wird es 2x gesendet?
Bei mir funktioniert seit dem heutigen updaten das "push" nicht mehr. :(
Der code hier erzeugt keine toast message und kein event mehr.
<div data-type="push"
data-device="LightAll"
data-cmd="trigger"
data-set="on"
class="cell">
</div>
Hats hier eine Änderung gegeben?
Zitat von: chunter1 am 21 Dezember 2015, 20:39:19
Bei mir funktioniert seit dem heutigen updaten das "push" nicht mehr. :(
Der code hier erzeugt keine toast message und kein event mehr.
<div data-type="push"
data-device="LightAll"
data-cmd="trigger"
data-set="on"
class="cell">
</div>
Hats hier eine Änderung gegeben?
Hallo!
Siehe 2 Seiten vorher:
<div data-type="push"
data-device="LightAll"
data-cmd="trigger"
data-set-on="on"
class="cell">
</div>
Danke! Das war's.
Zitat von: DanHard am 19 Dezember 2015, 17:49:50
Hallo Zusammen
Einige Posts zuvor habe ich erwähnt das bei mir die Daten teilweise nicht richtig geladen werden.
Entweder ist die Formatierung durcheinander oder es macht den Anschein das die CSS Datei nicht geladen wird.
Leider hat das Verwenden der Mobile Vorlage nichts gebracht. Bei jedem 3 oder 4 Laden der Seite wird sie nicht korrekt dargestellt.
Das "longpoll_delay" habe ich bereits bis 3000 erhöht.
Anbei habe ich euch zwei Beispiele angefügt.
Was ich versucht habe:
Bei der Console im Chrome habe ich die Network Geschwindigkeit auf "Good 3G" gestellt, dann sehe ich das gleiche wie im
Safaribrowser auf dem iPhone 6, also die Seite wird nicht korrekt dargestellt.
Der grosse Unterschied:
Chrome auf Windows: Die Seite ladet fertig und es wird alles richtig angezeigt.
Safari in iPhone 6: Die Seite ladet aber ich habe das Gefühl das er nach einer gewissen Zeit mit dem Laden stoppt.
Ich hoffe jemand kann mir helfen und kann mit meinen Erkenntnissen was anfangen.
Hier nochmals mein kompletter Quelltext:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="120">
<meta name="widget_base_height" content="115">
<meta name="widget_margin" content="1">
<meta name='gridster_disable' content='0'>
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1">
<meta name="longpoll_delay" content="3000">
<meta name="debug" content="0">
<meta http-equiv="Cache-Control" content="no-store" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-mobil-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<title>Homeinfo</title>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Wohnzimmer</header>
<div data-type="label" data-device="wz_temphumi" data-get="temperature" data-unit="%B0C%0A" data-limits='[0,10,15,21,23]' data-colors='["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]' class="cell big"></div>
<div data-type="label" data-device="wz_temphumi" data-get="humidity" data-unit="%" data-limits='[-1,20,39,59,65,79]' data-colors='["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]' class="cell big"></div>
</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header>Schlafzimmer</header>
<div data-type="label" data-device="sz_temphumi" data-get="temperature" data-unit="%B0C%0A" data-limits='[0,10,15,21,23]' data-colors='["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]' class="cell big"></div>
<div data-type="label" data-device="sz_temphumi" data-get="humidity" data-unit="%" data-limits='[-1,20,39,59,65,79]' data-colors='["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]' class="cell big"></div>
</li>
<li data-row="2" data-col="1" data-sizex="2" data-sizey="1">
<header>Lampen</header>
<div class="cell center">
<div class="left inline">
<div data-type="switch" class="cell inline" data-device="ge_it2" data-get-on="on" data-get-off="off"></div>
<div data-type="label" class="cell">Pflanzen</div>
</div>
<div class="left inline">
<div data-type="switch" class="cell inline" data-device="ge_it1" data-get-on="on" data-get-off="off"></div>
<div data-type="label" class="cell">Sofa</div>
</div>
<div class="left inline">
<div data-type="switch" class="cell inline" data-device="ge_it3" data-get-on="on" data-get-off="off"></div>
<div data-type="label" class="cell">X-Mas</div>
</div>
</div>
</li>
<li data-row="3" data-col="1" data-sizex="2" data-sizey="1" class="gs-w" style="background-color: rgb(42, 42, 42);">
<header>Termine</header>
<div class="cell">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Waschen" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-spinner warn","fa-spinner warn blink","fa-spinner warn"]' data-on-colors='["#5CA36A","#5CA36A","#5CA36A"]' class="smal"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Karton" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-newspaper-o warn","fa-newspaper-o warn blink","fa-newspaper-o warn"]' data-on-colors='["#996633","#996633","#996633"]' class="smal"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Papier" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-newspaper-o warn","fa-newspaper-o warn blink","fa-newspaper-o warn"]' data-on-colors='["#f9f9f9","#f9f9f9","#f9f9f9"]' class="smal"></div>
</div>
</li>
<li data-row="4" data-col="1" data-sizex="2" data-sizey="1.2" class="gs-w" style="background-color: rgb(42, 42, 42);">
<header>Wetter Aussenbereich</header>
<div class="centered" style="padding-top:10px !important;padding-bottom:15px !important">
<div class="left">
<div data-type="label" data-subtype="Temperature" data-device="aussen_temphumi" class="cell big" data-get="temperature" data-unit=" %B0C%0A" data-limits="[0,10,15,21,23]" data-colors="["#ffffff","#6699ff","#AA6900","#AD3333","#FF0000"]" style="color: rgb(170, 105, 0);">17.6<span style="font-size: 50%;"> °C</span></div>
<div data-type="label" data-subtype="Humidity" data-device="aussen_temphumi" class="cell big" data-get="humidity" data-unit=" %" data-limits="[-1,20,39,59,65,79]" data-colors="["#ffffff","#6699ff","#AA6900","FFCC80","#AD3333","#FF0000"]" style="color: rgb(170, 105, 0);">50<span style="font-size: 50%;"> %</span></div>
</div>
<div class="left">
<div data-type="label" data-device="Meteo" data-get="fc1_wday" style="margin-bottom:5px">Do<span style="font-size: 50%;"></span></div>
<div data-type="weather" data-device="Meteo" data-get="fc1_weather" data-imageset="meteocons" style="font-size:16px;padding:5px;margin:0;margin-top:-5px;" class="weather" data-icon="Q"></div>
<div class="" style="padding:0px 5px 0px 0px">
<div data-type="label" data-device="Meteo" data-get="fc1_tempMin" data-unit="°C" class="inline">XX</div>\
<div data-type="label" data-device="Meteo" data-get="fc1_tempMax" data-unit="°C" class="inline">XX</div>
</div>
<div data-type="label" data-device="Meteo" data-get="fc1_chOfRain" data-unit="%">10<span style="font-size: 80%;">%</span></div>
</div>
<div class="left">
<div data-type="label" data-device="Meteo" data-get="fc2_wday" style="margin-bottom:5px">Do<span style="font-size: 70%;"></span></div>
<div data-type="weather" data-device="Meteo" data-get="fc2_weather" data-imageset="meteocons" style="font-size:16px;padding:5px;margin:0;margin-top:-5px;" class="weather" data-icon="Q"></div>
<div class="" style="padding:0px 5px 0px 0px">
<div data-type="label" data-device="Meteo" data-get="fc2_tempMin" data-unit="°C" class="inline">XX</div>\
<div data-type="label" data-device="Meteo" data-get="fc2_tempMax" data-unit="°C" class="inline">XX</div>
</div>
<div data-type="label" data-device="Meteo" data-get="fc2_chOfRain" data-unit="%">10<span style="font-size: 50%;">%</span></div>
</div>
</div>
</ul>
</div>
</body>
</html>
Falls ihr noch angaben braucht, nur melden, dann kann ich's nachliefern.
Gruss
Hat niemand eine Idee oder habe ich zuwenig Infos geliefert?
Gruss
Zitat von: Stril
Seit ich auf Pagetab umgestellt habe, tue ich mir schwer mit dem Testen. Der FHEM-Server scheint zu cachen. Wenn ich Änderungen mache, sehe ich diese auch nach Browserneustart und Cache des Browsers löschen nicht. Über Nacht ist immer alles gut.
Zitat von: viegener am 21 Dezember 2015, 14:56:10
Vielleicht hilft auch die Developer Toolbox, die hat auch eine Option zum deaktivieren des Caches:
man sollte nicht am browser spielen müssen damit die tui funktioniert. seit ich wieder von pagetab weg bin und pagebuttons nutze funktioniert die ui mal sowas von zuverlässig
(kein caching-problem, keine ladeprobleme mehr)
Zitat von: DanHard am 22 Dezember 2015, 06:31:09
Hat niemand eine Idee oder habe ich zuwenig Infos geliefert?
Gruss
mal dies entfernt?
Zitat<meta http-equiv="Cache-Control" content="no-store" />
der rest sieht eigentlich gut aus
hat niemand eine Idee warum 2x burstXmit gesendet wird?
Guten Tag miteinander,
hoffentlich könnt ihr mir bei meinem Problem helfen. Aktuell bin ich mit der Tablet UI beschäftigt, finde die Position des kompletten Fensters am linken Bildschirmrand aber doch etwas blöd.
Ist es möglich die Größe des Fensters an die jeweilige Bildschirmgröße anzupassen? Am besten automatisch.
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
Dort habe ich schon etwas rumgespielt. Leider ohne Erfolg. Auf meinem Lenovo Yoga 2 Pro 13 wird das einfach zu klein dargestellt.
Schonmal vielen Dank im Vorraus!
Lieber Gruß
Marius
@setstate
Ich kämpfe immer noch mit meinem Layout. Ich habe viele Stellen an denen ich mit class="col-1-2" und class="col-1-3" hantiere.
Nach dem Wegfall von "float: left;" klappt es nicht mehr.
ZitatJetzt musst du aufpassen, wenn die Zeile in Summe 100% ergibt, nicht durch Margins ('cell','left-space' etc) noch mehr Platz beansprucht wird, dann kommt man über 100% und alle verrutscht.
Bei HTML gibt es leider kein optimales Positionierungsmodel, was in allen Lebenslagen immer das Erwartete tut.
Im Code habe ich darauf geachtet, dass kein Platz "verschwendet" wird. Das obere Bild zeigt das "gute Layout", das untere dasselbe ohne "float: left;" in der CSS, bei gleichem Code. Ich vermute, dass ich das mit dem "col-..." nicht richtig verstanden habe.
Gruß Bert
<!-- WZ -->
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header><font size="+1">Wohnzimmer </font><div data-type="label" data-device="FTR_WZ" data-get="temperature" class="inline" data-limits='[18,20,23]' data-colors='["#6699FF","#aa6900","#ff6242"]' data-unit="°C" ></div></header>
<div class="container top-space">
<div class="col-1-2">
<div class="container top-space">
<div class="col-1-3">
<div data-type="dimmer" data-device="Wohnen_Lampe_oben" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Oben</div>
<div data-type="dimmer" data-device="Wohnen_Lampe_Tür" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Tür</div>
</div>
<div class="col-1-3">
<div data-type="dimmer" data-device="Wohnen_Lampe_hinten" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Hinten</div>
<div data-type="dimmer" data-device="Wohnen_Lampe_vorne" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Vorne</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Wohnen_Blumen_Lampe" data-get-on='B0|an|on' data-get-off='BI|aus|off' data-set-on='B0' data-set-off='BI' ></div>
<div data-type="label" class="darker">Blumen</div>
<div data-type="dimmer" data-device="Wohnen_Kamin_Licht" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Kamin</div>
</div>
</div>
</div>
<div class="centered">
<div data-type="thermostat" data-device="FTR_WZ" data-get="temperature" data-temp="setpointTemp" data-fix="1" data-step="0.1" class=""></div>
</div>
</div>
</li>
Hallo!
Kennt ihr eine Möglichkeit, nach einer Zeit immer auf die Startseite zurück zu wechseln nach Inaktivität?
Also via Pagetab diverse Unterseiten und nach einigen Minuten auf die "Basis-Page" zurück wäre optimal
Was ich versucht habe:
<meta http-equiv="refresh" content="3; URL=/fhem/tablet/index_ipm.html#index_body_ipm.html">
--> Das wird aber nur ausgeführt, wenn ich es in die index.html packe - nicht, wenn ich es in die Unterseiten-Heads packe.
Danke für eure Hilfe!
Gruß
Phil
Zitat von: Stril am 22 Dezember 2015, 17:08:18
Kennt ihr eine Möglichkeit, nach einer Zeit immer auf die Startseite zurück zu wechseln nach Inaktivität?
...
<meta http-equiv="refresh" content="3; URL=/fhem/tablet/index_ipm.html#index_body_ipm.html">
Das Problem hierbei ist (auch wenn es auf jeder Seite klappen würden), dass nicht Aktivität/Inaktivität geprüft wird.
Du könntest das JavaScript vom "Screensaver" (http://forum.fhem.de/index.php/topic,44177.0.html) nehmen und so anpassen, dass in der Funktion show_screensaver() zur Startseite gegangen wird.
Also sowas in der Art:
window.location.href = '/fhem/tablet/index_ipm.html#index_body_ipm.html';
Hallo!
Das würde ich nicht so problematisch sehen, wenn nur ein Wechsel des Pagetabs als Aktivität gesehen würde und dann eben nach 30 Minuten ohne Aktivität das Wanddisplay wieder die "Basis" zeigt. Da aber ein Wechsel des Pagetabs keinen Reload ausführt, funktioniert das irgendwie nicht...
Beim Screensaver komme ich leider nicht so richtig weiter. Wo muss ich denn den Reload machen?
$(document).on('ready', function() {
if ($('#screensaver')) {
$('#screensaver').hide();
var mousetimeout;
var screensaver_active = false;
var idletime = 60;
function show_screensaver(){
window.location.href = '/fhem/tablet/index_ipm.html#index_body_ipm.html';
screensaver_active = true;
}
function stop_screensaver(){
$('#screensaver').fadeOut();
screensaver_active = false;
}
$(document).mousemove(function(){
clearTimeout(mousetimeout);
if (screensaver_active) {
stop_screensaver();
}
mousetimeout = setTimeout(function(){
show_screensaver();
}, 1000 * idletime); // 5 secs
});
}
});
--> so klappt es leider nicht...
Gruß
Phil
Versuche mal in den Javascriptfile so etwas aufzunehmen wie folgt:
$(document).on('ready', function() {
var mousetimeout;
var idletime = 10;
set_timeout();
function show_basescreen(){
if ( ( document.location.hash != "" ) && ( document.location.hash != "#home.html" ) ) {
var href = document.location.protocol + "//" + document.location.host + document.location.pathname ;
document.location.replace( href );
};
}
function set_timeout(){
mousetimeout = setTimeout(function(){
show_basescreen();
}, 1000 * idletime); // 5 secs
}
$(document).mousemove(function(){
clearTimeout(mousetimeout);
set_timeout();
});
});
Statt #home.html musst Du natürlich Deine "homeseite" eintragen und bei idletime etwas mehr als 10 (sec)
Hallo!
Leider funktioniert es noch nicht. Die Javascript Konsole zeigt:
Uncaught ReferenceError: $ is not defined
--> in der Datei my_screensaver.js
Ich habe in der index.html nur folgende Zeile ergänzt:
<script type="text/javascript" src="/fhem/tablet/js/my_screensaver.js"></script>
Habt ihr dazu noch eine Idee?
Danke und Gruß
Zitat von: Stril am 22 Dezember 2015, 22:04:03
Uncaught ReferenceError: $ is not defined
--> in der Datei my_screensaver.js
Setz den script-include mal weiter nach hinten in der index.html (auf jeden Fall hinter die jquery includes.
Hallo!
Hab ich versucht, aber ohne Erfolg. Jetzt geht es mit folgender Zeile direkt vor dem neuen Code:
<script src="/fhem/pgm2/jquery.min.js"></script>
Gruß
Phil
Hallo!
Ich hätte noch eine Idee, bei der ich nicht weiterkomme:
Wenn der Trockner fertig ist, soll sich ein Popup öffnen und eine Sound-Datei am Tablet abgespielt werden. Habt ihr eine Idee, wie das geht? Ein Popup-Widget gibt es ja grundsätzlich, wobei es scheinbar einen "Button" braucht. Wie sieht es mit dem Sound aus?
Habt ihr dazu auch noch eine Idee?
Danke und Gruß
Phil
Hi,
Zum Abspielen von Sounds, Sprachnachrichten und anzeigen von Toasts nutze ich z. B. das AMAD Modul das funktioniert bestens! Vllt ist es auch etwas für dich?
Gesendet von meinem SM-T335 mit Tapatalk
Hallo!
AMAD kann ich leider nicht nutzen (iPad).
Beim Popup komme ich auch nicht so ganz weiter. Das Popup wird einfach immer geöffnet - egal, ob der Dummy auf 1 oder 0 steht:
<div data-type="popup" data-height="400px" data-width="400px" data-device="dTrocknerPopupStatus"
data-get-on="1"
data-get-off="0">
<div class="dialog">
<header>DIALOG</header>
<div data-type="select"
data-device="TempDummy"
data-items='["-4","-2","-1","0","+1","+2","+4"]'
data-set=""
data-get=""
class="cell w2x" ></div>
</div>
</div>
Habe ich hier irgendwo einen Denkfehler? Das Popup soll nur angezeigt werden, wenn der Dummy auf 1 steht und verschwinden, wenn er auf 0 geht.
Ich vermute, dass dTrocknerPopupStatus ein Dummy ist, oder?
Dann müsste der Code wohl so in dieser Art aussehen:
<div data-type="popup" data-height="400px" data-width="400px" data-device="dTrocknerPopupStatus"
data-get="state"
data-get-on="1"
data-get-off="0">
<div class="dialog">
<header>DIALOG</header>
<div data-type="select"
data-device="TempDummy"
data-items='["-4","-2","-1","0","+1","+2","+4"]'
data-set=""
data-get=""
class="cell w2x" ></div>
</div>
</div>
Hallo!
Leider funktioniert es auch mit dem data-get="state" nicht.
Das Popup öffnet auch, wenn der Dummy "dTrocknerPopupStatus" auf "0" steht. Schließt man es über das Kreuz, öffnet es sich direkt wieder...
Ich habe es sowohl in der "index.html" der Pagetab-Installation getestet, als auch in einer "Tab-Seite". Jeweils öffnet das Popup sofort.
Habt ihr noch eine Idee?
Gruß
Phil
Zitat von: Stril am 23 Dezember 2015, 09:48:14
Habt ihr noch eine Idee?
Ok, pagetab hatte ich nicht auf dem Schirm. Aber gab es da nicht Mal irgendwas wie
activate oder
active?
Mal schauen, ob man dazu was findet...
Hallo!
Also ich habe jetzt einen Zwischenerfolg:
<div data-type="popup" data-height="400px" data-width="400px"
data-device="dTrocknerPopupStatus"
data-get="state"
data-get-on="on"
data-off="off">
<div data-type="switch" data-device='dTrocknerPopupStatus' class="cell"></div>
<div class="dialog">
<header>DIALOG</header>
<div data-type="select"
data-device="TempDummy"
data-items='["-4","-2","-1","0","+1","+2","+4"]'
data-set=""
data-get=""
class="cell w2x" ></div>
</div>
</div>
Beim Laden der Seite öffnet sich das Popup, wenn der Dummy auf "on" steht.
Ist der Dummy auf "off", geht das Popup kurz auf und direkt wieder zu.
ABER: Nur beim Laden der Seite, nicht "reaktiv". Das Icon färbt sich dann zwar um, aber das Popup öffnet sich nicht, wenn sich der Status auf "on" ändert.
Sollte das funktionieren?
Nachtrag: Ich habe das Ganze jetzt ohne Popup, dafür mit Pagetab gelöst. So funktioniert es.
Gruß
Phil
Zitat von: hillbicks am 13 Dezember 2015, 19:32:23
1) Bei dem neuen Chart wird die Beschriftung der x und y Achse im Webviewcontrol nicht angezeigt, im "normalen" Browser hingegen schon. Ist das ein bekannter Bug im Webviewcontrol?
Das Problem habe ich leider auch. Und ich wollte das eigentlich nutzen, um meine Solaranlage zu überwachen. Nur ohne Achsenbeschriftung bringt das leider nichts. Seltsamerweise tritt der Fehler auch mit Dophin, nicht aber mit Firefox oder Chrome auf...
Anzeige im Browser ist aber in meinem ausrangierten Arcos 101 keine wirkliche Alternative...
Zitat von: Speedy68 am 23 Dezember 2015, 18:24:35
Das Problem habe ich leider auch. Und ich wollte das eigentlich nutzen, um meine Solaranlage zu überwachen. Nur ohne Achsenbeschriftung bringt das leider nichts. Seltsamerweise tritt der Fehler auch mit Dophin, nicht aber mit Firefox oder Chrome auf...
Anzeige im Browser ist aber in meinem ausrangierten Arcos 101 keine wirkliche Alternative...
Es wird sogar noch seltsamer, jedenfalls bei mir. Auf meinem odroid C1 mit Android 4.1 wird im Webviewcontrol die Beschriftung nicht angezeigt. Auf den beiden Nexus mit Android 5.1 (CM) mit der gleichen Version von Webviewcontrol hingegen schon. Kann ich mir grade keinen Reim drauf machen, was da die Ursache sein soll.
Hallo,
ich versuche gerade von Floorplan auf Tablet UI umzusteigen, bin aber leider ein wenig am verzweifeln.
Ich habe Problem mit der Status-Aktualisierung. Ich habe alle FAQ gelesen und geprüft aber longpoll will einfach nicht funktionieren.
Im Floorplan mit den selben Kompnenten (z.B. Fensterkontakt von Homematic) funktioniert das einwandfrei.
Wo kann ich noch prüfen an was es liegt?
Grüße
Olli
Zitat von: octek0815 am 25 Dezember 2015, 22:11:44
Hallo,
ich versuche gerade von Floorplan auf Tablet UI umzusteigen, bin aber leider ein wenig am verzweifeln.
Ich habe Problem mit der Status-Aktualisierung. Ich habe alle FAQ gelesen und geprüft aber longpoll will einfach nicht funktionieren.
Im Floorplan mit den selben Kompnenten (z.B. Fensterkontakt von Homematic) funktioniert das einwandfrei.
Wo kann ich noch prüfen an was es liegt?
Grüße
Olli
Ich denke es wäre hilfreich wenn Du vielleicht Deine index.html hier hochlädst, denn wie kann man Dir sonst helfen?
Anbei die index.html mit zwei Beispielen bei den die Status-Aktualisierung nicht funktioniert.
Erst wenn ich ein Refresh des Browsers durchführe ist der Status auch aktuell.
Zitat von: chris1284 am 22 Dezember 2015, 07:47:36
mal dies entfernt?
der rest sieht eigentlich gut aus
Habe die Zeile nun entfernt, hat aber leider auch keine Besserung gebracht.
Hallo ich bin dabei mein UI aufzubauen... leider habe ich dabei schon ein riesen Problem :'( und zwar werden die definierten Buttons für die einzelnen Sektionen TV, Kalender usw. werden nicht angezeigt :(
Ich habe für das Menü ein extra html seite erstellt für eine bessere aufteilung... hier mal der Code
<header>Menü</header>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-color="#aa6900" data-url="heating.html" data-icon="fa-televisio" class="cell small"></div>
<div data-type="label" class="cell darker">TV</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-color="#aa6900" data-url="heating.html" data-icon="fa-calenda" class="cell small"></div>
<div data-type="label" class="cell darker">Kalender</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-color="#aa6900" data-url="heating.html" data-icon="fa-fire" class="cell small"></div>
<div data-type="label" class="cell darker">Wetter</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-color="#aa6900" data-url="heating.html" data-icon="fa-music" class="cell small"></div>
<div data-type="label" class="cell darker">Radio</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-color="#aa6900" data-url="heating.html" data-icon="fa-car" class="cell small"></div>
<div data-type="label" class="cell darker">Tanken</div>
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="button" data-color="#aa6900" data-url="heating.html" data-icon="fa-cog" class="cell small"></div>
<div data-type="label" class="cell darker">System</div>
und in der index wird das ganze so eingebunden
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu_links.html"></li>
aber es werden mir nur die Texte angezeigt die Buttons nicht was ist da falsch?
Auch die Uhr
<header>Uhrzeit</header>
<div data-type="clock" data-format="H:i" class="container bigger"></div>
<div data-type="clock" data-format="d-m-Y" class="cell"></div>
wird z.B. nicht angezeigt :(
Hast Du das bereits mal ohne die direkte Style-Angabe versucht? Ich könnte mir vorstellen, dass das nicht so einfach auf die Icons gematcht werden kann (im extremfall wird das auf Vorder und Hintergrund farben angewendet)?
Standardfragen:
- Funktioniert denn index-example.html bei Dir?
- Sind auch die Zusatzwidgets von nesges (Button/Clock) installiert -> Also gibt es widget_button.js etc in dem js-Verzeichnis?
Zitat von: octek0815 am 26 Dezember 2015, 08:33:40
Anbei die index.html mit zwei Beispielen bei den die Status-Aktualisierung nicht funktioniert.
Erst wenn ich ein Refresh des Browsers durchführe ist der Status auch aktuell.
Ich konnte jetzt auf Anhieb kein Problem in Deinem index.html finden. Gibt es denn andere Devices bei denen der update funktioniert oder gehen alle nicht?
Zitat von: octek0815 am 26 Dezember 2015, 08:33:40
Anbei die index.html mit zwei Beispielen bei den die Status-Aktualisierung nicht funktioniert.
Erst wenn ich ein Refresh des Browsers durchführe ist der Status auch aktuell.
Setz doch mal
<meta name="debug" content="1"> und schau dann mal, was auf der Browser-Konsole ausgegeben wird. Evtl. wird man ja daraus schlauer.
Wolfgang
Zitat von: viegener am 26 Dezember 2015, 21:37:29
Hast Du das bereits mal ohne die direkte Style-Angabe versucht? Ich könnte mir vorstellen, dass das nicht so einfach auf die Icons gematcht werden kann (im extremfall wird das auf Vorder und Hintergrund farben angewendet)?
Standardfragen:
- Funktioniert denn index-example.html bei Dir?
- Sind auch die Zusatzwidgets von nesges (Button/Clock) installiert -> Also gibt es widget_button.js etc in dem js-Verzeichnis?
habs nun hatte die Zusatzwidgets von nesges nicht ::) DANKE
ich richtig mir gerade ein altes tablet neben der eingangstür als übersicht und bedienpannel ein und bis jetzt bin ich begeistert :)
ein punkt an dem ich aber gerade nicht weiter komme ist folgender: wenn ich das volume widget für lautstärke und hue und helligkeit als mini version verwende ist das perfekt um eine übersicht darzustellen, aber es lässt sich nicht besonders gut bedienen.
kann man ein widget beim berühren vergrössern und beim los lassen wieder verkleinern? idealerweise ohne den finger zwischen durch abzuheben oder danach ein popup zu schliessen :).
für kleine slider wäre das auch sehr praktisch.
gruss
andre
@justme1968 - Coole Idee, es gibt so etwas ähnliches beim Dimmer (wenn auch nicht wirklich grösser) und ich wollte so etwas immer für meine Rolläden (Slider) bauen, bei den Slidern bin ich bisher daran gescheitert, dass das zugrundliegende slider widgets meine Ansätze nicht mochte ;D
(Dynamisch Grösse verändern etc)
Zitat von: viegener am 26 Dezember 2015, 21:49:24
Ich konnte jetzt auf Anhieb kein Problem in Deinem index.html finden. Gibt es denn andere Devices bei denen der update funktioniert oder gehen alle nicht?
Ich konnte das Problem inzwischen lösen. Ich habe einfach meine Inhalte und Definitionen in die index-example kopiert und angepasst. Nun funktioniert es.
Trotzdem danke für die Hilfe.
Zitat von: hillbicks am 13 Dezember 2015, 19:32:23
1) Bei dem neuen Chart wird die Beschriftung der x und y Achse im Webviewcontrol nicht angezeigt, im "normalen" Browser hingegen schon. Ist das ein bekannter Bug im Webviewcontrol?
Mir ging es mit der aktuellen Version der "widget_chart.js" genauso. Keine Darstellung der Werte rund um den Chart. Bei keinem der Tablet-Browser.
Am Notebook funktionierts. Ich hab wieder die Vorgängerversion ...damit ist alles i.O.
Halo zusammen,
ich baue gerade mein FTUI neu auf.
Dabei bin ich über folgendem Code aus einem Beispiel von SETSTATE gestossen:
<header>WOHNZIMMER LINKS</header>
<div class="top-space-2x">
<div data-type="switch" data-device="R_WZ_LI"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off="" class="green"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="R_WZ_LI"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="18" data-set-off="" class="blue"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">18</div>
</div>
<div>
<div data-type="switch" data-device="R_WZ_LI"
data-get-on="[0-9]" data-get-off="!on"
data-set-on="0" data-set-off="" class="ligthblue"
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="R_WZ_LI"
data-set-on="stop" data-off-color="#2A2A2A"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
</li>
Ist es richtig das das Icon die Farbe nur wechselt wenn ich es drücke und auch nur solange?
Oder sollte, wenn ich den Aufwärtspfeil drücke das Icon so lange grün bleiben bis das Rollo oben ist oder ich es stoppe?
Ich benutze diese Rolloaktoren: HM-LC-Bl1PBU-FM
Gruß
Ralf
Hallo,
ich habe folgendes Problem, für das ich keine Lösung finde:
In einem Widget werden verpasste Anrufe angezeigt. Das Widget greift auf die Liste von missed-calls aus dem Modul FB_CALLLIST zu:
fhem.cfg
define Call_List_Missed FB_CALLLIST Fritz_Box
attr Call_List_Missed create-readings 1
attr Call_List_Missed language de
attr Call_List_Missed list-type missed-calls
attr Call_List_Missed time-format-string %d.%m. %H:%M
index.html
<tr>
<td><div data-type="label" data-device="Call_List_Missed" data-get="1-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="1-name" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="1-number" class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="Call_List_Missed" data-get="2-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="2-name" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="2-number" class="left"></div> </td>
</tr>
....
Das funktioniert auch so weit. Ich habe mir die eine zusätzliche fhem-tablet-ui-user.js gebastelt, mit der die Liste der verpassten Anrufe in fhem gelöscht wird. Auch das funktioniert, sodass die Liste dann keine Reading mehr hat, sondern leer ist.
Die Aktualisierung des Widgets funktioniert dann aber nicht. Auch wenn ich die Seite neu lade, wird noch der alte verpasste Anruf angezeigt, obwohl die Liste in fhem leer ist. Es wird also irgendwo (im Browser oder serverseitig?) die Info gespeichert.
Kann mir hier jemand helfen, wie ich das Widget "geleert" bekomme?
Gruß
Torben
Zitat von: Torben am 31 Dezember 2015, 09:23:43
Hallo,
ich habe folgendes Problem, für das ich keine Lösung finde:
In einem Widget werden verpasste Anrufe angezeigt. Das Widget greift auf die Liste von missed-calls aus dem Modul FB_CALLLIST zu:
fhem.cfg
define Call_List_Missed FB_CALLLIST Fritz_Box
attr Call_List_Missed create-readings 1
attr Call_List_Missed language de
attr Call_List_Missed list-type missed-calls
attr Call_List_Missed time-format-string %d.%m. %H:%M
index.html
<tr>
<td><div data-type="label" data-device="Call_List_Missed" data-get="1-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="1-name" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="1-number" class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="Call_List_Missed" data-get="2-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="2-name" class="left"></div> </td>
<td><div data-type="label" data-device="Call_List_Missed" data-get="2-number" class="left"></div> </td>
</tr>
....
Das funktioniert auch so weit. Ich habe mir die eine zusätzliche fhem-tablet-ui-user.js gebastelt, mit der die Liste der verpassten Anrufe in fhem gelöscht wird. Auch das funktioniert, sodass die Liste dann keine Reading mehr hat, sondern leer ist.
Die Aktualisierung des Widgets funktioniert dann aber nicht. Auch wenn ich die Seite neu lade, wird noch der alte verpasste Anruf angezeigt, obwohl die Liste in fhem leer ist. Es wird also irgendwo (im Browser oder serverseitig?) die Info gespeichert.
Kann mir hier jemand helfen, wie ich das Widget "geleert" bekomme?
Gruß
Torben
Nette Idee..
Das Caching ist tatsächlich ein Problem. Habe das bei dem GDS-Widget welches neu aufgesetzt wurde. Mir werden z.B. auf meinem Rechner noch alte Wetterwarnungen angezeigt obwohl auf meinem Tablet die neuen/aktuellen angezeigt werden.
Denke also ist es Browsercaching bzw. Java.
Wie und wo man das abstellt ist mir leider nicht bekannt. Aber hier gibt es sciherlich jemanden der das beheben kann.
Vielleicht sogar innerhalb der JS-Dateien?
Grüße
Ggf so wie hier mit der random Zahl https://hungred.com/how-to/tutorial-stop-caching-jquery-javascript/
Gesendet von meinem Huawei Honor 7
Zitat von: masterpete23 am 31 Dezember 2015, 10:47:08
Ggf so wie hier mit der random Zahl https://hungred.com/how-to/tutorial-stop-caching-jquery-javascript/
Gesendet von meinem Huawei Honor 7
habe bei mir mal die html neta-tags eingefügt.
mal testen und sehen was die zeit bringt.
<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>
Zitat von: tilde1970 am 29 Dezember 2015, 18:27:37
Mir ging es mit der aktuellen Version der "widget_chart.js" genauso. Keine Darstellung der Werte rund um den Chart. Bei keinem der Tablet-Browser.
Am Notebook funktionierts. Ich hab wieder die Vorgängerversion ...damit ist alles i.O.
Vielen Dank! Ich wollte das Projekt schon aufgeben... Mit der alten Version geht es jetzt auch bei mir. Und ich kann jetzt auch verschiedene Geräte in einem Widget darstellen, auch das ging vorher nicht...
ich habe gerade ein problem mit dem dimmer bei dem ich nicht weiter komme.
sobald ich data-set-on verwende wird beim einschalten gar kein kommando mehr gesendet.
ich muss für mein device aber den wert mit dem eingeschaltet werden soll fest vorgeben weil der dimmer im aus zustand pct auf 0 setzt. wenn ich dann data-dim="pct" verwende wird der aktuelle wert 0 zum einschalten gesendet -> es wird zwar etwas gesendet aber nichts was zum einschalten führt :(
data-set-off funktioniert wie es soll.
hat jemand ein idee ?
gruss
andre
So schaut mein Dimmer aus.
<div class="top-space">
<div data-type="dimmer" data-device="FSG_70" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="cell darker">FSG_70</div>
</div>
und das ist Device-Listing:
Internals:
DEF 01892A69
IODev TCM_ESP2_1
LASTInputDev TCM_ESP2_1
MSGCNT 16
NAME FSG_70
NR 620
NTFY_ORDER 50-FSG_70
STATE on
TCM_ESP2_1_MSGCNT 16
TCM_ESP2_1_TIME 2015-12-31 09:02:34
TYPE EnOcean
Readings:
2015-12-31 09:02:32 block unlock
2015-12-31 09:02:34 dim 100
2015-12-31 09:02:34 dimValueLast 100
2015-12-31 08:22:15 dimValueStored 1
2015-10-28 12:26:18 observeFailedDev 0
2015-12-31 09:02:34 rampTime 0
2015-12-31 09:02:34 state on
2015-09-22 17:31:57 teach 4BS teach-in sent
Helper:
Attributes:
IODev TCM_ESP2_1
comMode confirm
devStateIcon an:on:B0 aus:off:B0
eep A5-38-08
fp_EG 492,311,0,,
group Licht
gwCmd dimming
manufID 00D
model other
room Bert,EnOcean
subDef FFE5380F
subType gateway
verbose 5
webCmd :
und das geht.
Gruß Bert
ich hatte data-set="pct" data-set-off="0" data-set-on="100" data-pct="pct". damit ging nur off und nicht on.
mit data-set-off="off" data-set-on="on" data-pct="pct" geht es jetzt.
danke
andre
Hallo zusammen.
Ich bin relativ neu in der FHEM Welt. Ich wollte auf die Tablet Ui umsteigen. Ich habe das Beispiel laden wollen und bekomme nur diese Anzeige. Manchmal sehe ich auch die Insturmente aber nicht alle Symbole.
Habe noch nichts schlaues gefunden.
Danke für die Hilfe.
P.S. habe das FHEM auf einem RPI laufen mit einem Homematic USB Adapter
Du hast mächtig was kaputt gemacht. Wie hast du Tablet UI installiert?
Gesendet von meinem Huawei Honor 7
Hallo,
ich habe meine Seite für die Rollos fertig.
Nun, das grau auf schwarz ist nicht sehr ansprechend, kann ich das irgendwie ändern?
Mit den Icons stehe ich irgendwie auf Kriegsfuss, bei einigen Rollos bleiben die Icons farbig bis der Endzustand gemeldet wird, bei anderen gehen sie sofort von Farbe auf Grau!
Beim Herunterfahren bleibt z.b. der blau erst an dann geht er auf Grau und der für die direkte pct Anwahl geht auf blau bis zu zurückgemeldet wird.
Daraus werde ich gar nicht schlau!?
Liegt vielleicht an den Rolloaktoren?
Anbei Bilder und die Dateien
Gruß
Ralf
P.S.
Ich wünsche Allen einen guten Rutsch in das neue Jahr
HAllo masterpete23 das denke ich eben auch. auf meinem Tablet sehe ich das gleiche jedoch die orangen Symbole aber ohne inhalt. ich habe eigentlich alles so installiert wie auf der Seite 1 beschrieben.
Heute sehe ich das:
Danke
Wie rufst du es auf?
Gesendet von meinem Huawei Honor 7
Zitat von: Andmo am 31 Dezember 2015, 18:00:39
Hallo zusammen.
Ich bin relativ neu in der FHEM Welt. Ich wollte auf die Tablet Ui umsteigen. Ich habe das Beispiel laden wollen und bekomme nur diese Anzeige. Manchmal sehe ich auch die Insturmente aber nicht alle Symbole.
Habe noch nichts schlaues gefunden.
Danke für die Hilfe.
P.S. habe das FHEM auf einem RPI laufen mit einem Homematic USB Adapter
/ am ende der url!!!!! absoluter aufruf!
Beispiel:
http://192.168.1.22:8083/fhem/ftui/ <<-- IP und PORT anpassen.
um es ganz genau zu machen:
http://IP:PORT/fhem/ftui/index.html <<-- IP,PORT und html datai anpassen...
auch die HTTPSRV in FHEM anpassen.
Hallo zusammen,
ich habe mich nach länger Zeit auch wieder mit dem UI beschäftigen können.
Derzeit stehe ich vor einer Herausforderung, bei welcher ich ohne Hilfe nicht weiterkomme.
Ich versuche mich gerade an einer Heizungssteuerung mit Anwesenheitserkennung. Das ganze funktioniert auch schon ganz gut, ich möchte nur die Parameter über das Tablet UI einstellen können. Im Anhang ist ein Bild des derzeitigen Standes. Im großen und ganzen funktioniert dies auch schon.
Ich habe aber Schwierigkeiten mit den Slidern, diese möchte ich benutzen um die Tages- Nacht und Abwesenheitstemperatur einzustellen. Ich habe es auch schon mit anderen Widgets probiert, aber ich habe bisher keines gefunden, welches meinen Vorstellungen nahe kommt. (Thermostat und Select empfinde ich als ungünstig)
- Das erste und wichtigste ist, ich habe einen Dummy in welchem der Temperaturwert gespeichert ist in der Form: "22.0". Da der Slider keine Kommagetrennten Zahlen kann (schade eigentlich, eine Schrittweitere von 0.5 fände ich schick), muss ich mittels data-get-Value den Wert auslesen, das bekomme ich aber einfach nicht hin. Ich bin davon ausgegangen, dass die Erkennung mittels RegEx geschehen muss und dass ich den erforderlichen Teil gruppiere, allerdings erkennt er das Ergebnis nicht. Ich habe hierbei folgendes RegEx benutzt: ([0-9]*)...
- Ich kann bei dem Slider das Data-Value einschalten, wenn aber der Slider Horizontal eingestellt ist, ist dieser Wert dennoch unterhalb des Sliders, dies finde ich ungünstig. Kann ich dies einstellen, dass er hinter dem Slider steht?
- ich würde den Slider gerne etwas dicker Gestalten, im Horizontal Modus müsste ich hierzu den Parameter data-height einstellen, der Slider wird auch breiter, aber leider nicht der Button mit welchem ich den Slider verschieben kann. Hat jemand eine Idee, ob ich das mittels CSS oder ähnliches beeinflussen kann?
- Als letztes wäre es natürlich schick, wenn ich mit dem Slider ebenfalls einen Farbwechsel wie er beim Thermostat existiert hinzubekommen, ich vermute allerdings, dies ist aber wahrscheinlich nicht so ohne weiteres umzusetzen?
Schlussendlich zum besseren Verständnis hier noch der Quellcode der Slider:
<div class="row">
<div data-type="label" class="inline">Tagestemperatur</div>
<div data-type="slider" data-device="WZ_Heizung_Temp_Day" data-min="5" data-max="5" data-value="true" data-set-value="$v.0" data-get-value="([0-9]*).." data-width="200" class="inline horizontal"></div>
</div>
<div class="row">
<div data-type="label" class="inline">Nachttemperatur</div>
<div data-type="slider" data-device="WZ_Heizung_Temp_Night" data-min="5" data-max="5" data-value="true" data-set-value="$v.0" data-get-value="([0-9]*).." data-width="200" class="inline horizontal"></div>
</div>
<div class="row">
<div data-type="label" class="inline">Abwesendtemperatur</div>
<div data-type="slider" data-device="WZ_Heizung_Temp_Away" data-min="5" data-max="5" data-value="true" data-set-value="$v.0" data-get-value="([0-9]*).." data-width="200" class="inline horizontal"></div>
</div>
Ich hoffe mir kann jemand hier helfen.
Gruß
Patrick
Hallo zusammen,
ich verwende für die Wettervorhersage das weather Modul mit dem ImageSet kleinklima. Funktioniert soweit alles ganz prima, nur für übermorgen ist Schneefall angekündigt und dafür wird mir kein Image angezeigt.
Leider bin ich nicht wirklich fündig geworden, wo hier was fehlen könnte. Weiß jemand, wie ich das korrigieren kann?
VG Stefan
Zitat von: StefanD am 01 Januar 2016, 15:29:08
Hallo zusammen,
ich verwende für die Wettervorhersage das weather Modul mit dem ImageSet kleinklima. Funktioniert soweit alles ganz prima, nur für übermorgen ist Schneefall angekündigt und dafür wird mir kein Image angezeigt.
Leider bin ich nicht wirklich fündig geworden, wo hier was fehlen könnte. Weiß jemand, wie ich das korrigieren kann?
VG Stefan
Dann nutzt Du Proplant oder einen sonstigen Wetterdienst ?
Das kannst Du in der widget_weather.js korrigieren.
Als erstes schaue mal in den Readings deines Wettermoduls wie das Wetter für den Tag bezeichnet wird, zb. "Schneefall"
Dann editiere die widget_weather.js .
Suche nach kleinklimamap: { dann nach deinem Wetter dienst und füge eine entsprechende Zeile der liste hinzu.
zb.: "Schneefall": "snow.png",
Dann sollte es wieder angezeigt werden.
@roman1528
Habe den (define TABLETUI HTTPSRV tablet/index.html ./www/tablet Tablet-UI) geändert.
Bekomme nun auch auf dem PC das gleiche bild wie auf dem Tablet.
@Andmo : Die Buttons ohne Symbole hatte ich plötzlich auch. Data-type von button auf "pagebutton" geändert hat geholfen. Gruß Andreas
Zitat von: Gerd am 01 Januar 2016, 16:16:42
Dann nutzt Du Proplant oder einen sonstigen Wetterdienst ?
Das kannst Du in der widget_weather.js korrigieren.
Als erstes schaue mal in den Readings deines Wettermoduls wie das Wetter für den Tag bezeichnet wird, zb. "Schneefall"
Dann editiere die widget_weather.js .
Suche nach kleinklimamap: { dann nach deinem Wetter dienst und füge eine entsprechende Zeile der liste hinzu.
zb.: "Schneefall": "snow.png",
Dann sollte es wieder angezeigt werden.
Danke, Gerd! Das war die Lösung! :)
Zitat von: Andmo am 01 Januar 2016, 18:34:01
@roman1528
Habe den (define TABLETUI HTTPSRV tablet/index.html ./www/tablet Tablet-UI) geändert.
Bekomme nun auch auf dem PC das gleiche bild wie auf dem Tablet.
Die Definition funktioniert so nicht. Bei dieser Definition wird gar kein HTTPSRV benutzt sondern nur FHEMWeb.
Richtig wäre:
define TABLETUI HTTPSRV tablet ./www/tablet Tablet-UIWenn es damit nicht funktioniert ist etwas anderes falsch.
Zitat von: viegener am 02 Januar 2016, 00:02:16
Die Definition funktioniert so nicht. Bei dieser Definition wird gar kein HTTPSRV benutzt sondern nur FHEMWeb.
Richtig wäre:
define TABLETUI HTTPSRV tablet ./www/tablet Tablet-UI
define TABLETUI HTTPSRV tablet ./www/tablet/ Tablet-UIFinde den Unterschied... Absoluter Pfad... ohne / bekomme ich bei mir auch nur Schrott angezeigt.
Es gibt doch Frameworks wie Cordova oder Webservice wie appsgeyser mit denen man native Webapps erstellen kann. Hat schon jemand ausprobiert ob das auch mit Tablet Ui klappt? So könnte man ja den gesamten Quellcode samt Bibliotheken in die App packen und nur noch den Status über das Netzwerk abrufen, dadurch müsste doch Tablet Ui noch einen Ticken schneller werden. Hat das schon mal jemand probiert?
Hallo zusammen,
und erstmal vielen Dank für das wirklich geniale Front-end (auch wenn es für einen DAU schwierig zu konfigurieren ist ,o)).
Frage: Kann ich bei dem Knob / Thermostat Widget die Anzeige in der Mitte auf eine Nachkommastelle erweitern?
Irgendwie habe ich um's verrecken in den Sourcecodes nicht den entsprechenden Rundungsbefehl gesehen ...
Ich befürchte das ist in den Tiefen des jquery verborgen... jemand eine Idee wie man das realisieren könnte?
<div data-type="thermostat" data-device="FTR_WZ" data-get="temperature" data-temp="setpointTemp" data-fix="1" data-step="0.1" class="left"></div>
Allerdings habe ich "data-get" und "data-temp" absichtlich vertauscht, weil ich die Temperatur in der Mitte haben wollte.
Gruß Bert
Hallo,
jetzt frage ich doch mal nach, weil ich einfach nicht mehr weiterkomme:
Per Calender und CALVIEW hole ich mir aus unterschiedlichen Kalendern Termine und lasse sie mir im Tablet UI als "label" anzeigen:
<li data-row="2" data-col="7" data-sizex="2" data-sizey="2">
<header>KALENDER</header>
<div class="cell left-align" style="color:#AA6900">
<div style="font-weight: bold; text-decoration: underline;" class="darker">Heute: <div data-type="clock" data-format="j. F" interval="60000" style="font-weight: bold; text-decoration: underline;" class="inline darker"></div>
</div>
<div data-type="label" data-device="myMond" data-get="today_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myFeiertage" data-get="today_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myFerientage" data-get="today_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myTermine" data-get="today_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myTermine" data-get="today_002_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myTermine" data-get="today_003_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myTonne" data-get="today_001_summary" style="color:#AA6900" class="left-align"></div>
<hr style="color: #AA6900; height: 0.5px;">
<div style="font-weight: bold; text-decoration: underline;" class="darker">Morgen:</div>
<div data-type="label" data-device="myMond" data-get="tomorrow_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myFeiertage" data-get="tomorrow_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myFerientage" data-get="tomorrow_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myTermine" data-get="tomorrow_001_summary" style="color:#AA6900" class="left-align"></div>
<div data-type="label" data-device="myTonne" data-get="tomorrow_001_summary" style="color:#AA6900" class="left-align"></div>
</div>
</li>
Das Ganze funktioniert auch soweit es FHEM betrifft. Dort sind die Readings today_001_xxx und tomorrow_001_xxx z.B. für myMond, myFeiertage, myFerientage nicht vorhanden. Alles sind ganztägige Termine.
Im Tablet UI wurden/werden die Termine angezeigt, aber nicht mehr gelöscht.
(http://up.picr.de/24157101fu.png)
define HJ_Termine Calendar ical url https://calendar.google.com/calendar/ical/xxx%40googlemail.com/private-xxx/basic.ics 60
attr HJ_Termine room Server
define myTermine CALVIEW HJ_Termine 0 60
attr myTermine event-on-change-reading .*
attr myTermine modes modeAlarmOrStart
attr myTermine room Server
Die anderen Kalender sind gleich, bis auf das Interval. Mit den modes habe ich erfolglos herumgespielt, ebenso ist es egal, ob das event-on-change-reading vorhanden ist oder nicht.
Ich habe mit dem Test6 ein bisschen herumexperimentiert: Wenn ich den anlege, dann taucht er im Event Log von FHEM nicht auf. Innerhalb der ersten Minute des Events habe ich dann auch den Eintrag im Event Log:
2016-01-02 12:59:23 CALVIEW myTermine t_001_bdate: 02.01.2016
2016-01-02 12:59:23 CALVIEW myTermine t_001_btime: 00:00:00
2016-01-02 12:59:23 CALVIEW myTermine t_001_summary: Petra Geburtstag
2016-01-02 12:59:23 CALVIEW myTermine t_001_source: HJ_Termine
2016-01-02 12:59:23 CALVIEW myTermine t_001_location:
2016-01-02 12:59:23 CALVIEW myTermine t_001_edate: 03.01.2016
2016-01-02 12:59:23 CALVIEW myTermine t_001_etime: 00:00:00
2016-01-02 12:59:23 CALVIEW myTermine t_001_mode: modeAlarmOrStart
2016-01-02 12:59:23 CALVIEW myTermine today_001_bdate: heute
2016-01-02 12:59:23 CALVIEW myTermine today_001_btime: 00:00:00
2016-01-02 12:59:23 CALVIEW myTermine today_001_summary: Petra Geburtstag
2016-01-02 12:59:23 CALVIEW myTermine today_001_source: HJ_Termine
2016-01-02 12:59:23 CALVIEW myTermine today_001_location:
2016-01-02 12:59:23 CALVIEW myTermine today_001_edate: 03.01.2016
2016-01-02 12:59:23 CALVIEW myTermine today_001_etime: 00:00:00
2016-01-02 12:59:23 CALVIEW myTermine today_001_mode: modeAlarmOrStart
2016-01-02 12:59:23 CALVIEW myTermine t: 1 td: 1 tm: 0 ts: 0
2016-01-02 12:59:23 CALVIEW myTermine c-term: 1
2016-01-02 12:59:23 CALVIEW myTermine c-tomorrow: 0
2016-01-02 12:59:23 CALVIEW myTermine c-today: 1
2016-01-02 12:59:23 CALVIEW myTermine c-started: 0
2016-01-02 13:00:23 CALVIEW myTermine t_001_bdate: 02.01.2016
2016-01-02 13:00:23 CALVIEW myTermine t_001_btime: 00:00:00
2016-01-02 13:00:23 CALVIEW myTermine t_001_summary: Petra Geburtstag
2016-01-02 13:00:23 CALVIEW myTermine t_001_source: HJ_Termine
2016-01-02 13:00:23 CALVIEW myTermine t_001_location:
2016-01-02 13:00:23 CALVIEW myTermine t_001_edate: 03.01.2016
2016-01-02 13:00:23 CALVIEW myTermine t_001_etime: 00:00:00
2016-01-02 13:00:23 CALVIEW myTermine t_001_mode: modeAlarmOrStart
2016-01-02 13:00:23 CALVIEW myTermine t_002_bdate: 02.01.2016
2016-01-02 13:00:23 CALVIEW myTermine t_002_btime: 13:00:00
2016-01-02 13:00:23 CALVIEW myTermine t_002_summary: Test6
2016-01-02 13:00:23 CALVIEW myTermine t_002_source: HJ_Termine
2016-01-02 13:00:23 CALVIEW myTermine t_002_location:
2016-01-02 13:00:23 CALVIEW myTermine t_002_edate: 02.01.2016
2016-01-02 13:00:23 CALVIEW myTermine t_002_etime: 13:10:00
2016-01-02 13:00:23 CALVIEW myTermine t_002_mode: modeAlarmOrStart
2016-01-02 13:00:23 CALVIEW myTermine today_001_bdate: heute
2016-01-02 13:00:23 CALVIEW myTermine today_001_btime: 00:00:00
2016-01-02 13:00:23 CALVIEW myTermine today_001_summary: Petra Geburtstag
2016-01-02 13:00:23 CALVIEW myTermine today_001_source: HJ_Termine
2016-01-02 13:00:23 CALVIEW myTermine today_001_location:
2016-01-02 13:00:23 CALVIEW myTermine today_001_edate: 03.01.2016
2016-01-02 13:00:23 CALVIEW myTermine today_001_etime: 00:00:00
2016-01-02 13:00:23 CALVIEW myTermine today_001_mode: modeAlarmOrStart
2016-01-02 13:00:23 CALVIEW myTermine today_002_bdate: heute
2016-01-02 13:00:23 CALVIEW myTermine today_002_btime: 13:00:00
2016-01-02 13:00:23 CALVIEW myTermine today_002_summary: Test6
2016-01-02 13:00:23 CALVIEW myTermine today_002_source: HJ_Termine
2016-01-02 13:00:23 CALVIEW myTermine today_002_location:
2016-01-02 13:00:23 CALVIEW myTermine today_002_edate: 02.01.2016
2016-01-02 13:00:23 CALVIEW myTermine today_002_etime: 13:10:00
2016-01-02 13:00:23 CALVIEW myTermine today_002_mode: modeAlarmOrStart
2016-01-02 13:00:23 CALVIEW myTermine t: 2 td: 2 tm: 0 ts: 0
2016-01-02 13:00:23 CALVIEW myTermine c-term: 2
2016-01-02 13:00:23 CALVIEW myTermine c-tomorrow: 0
2016-01-02 13:00:23 CALVIEW myTermine c-today: 2
2016-01-02 13:00:23 CALVIEW myTermine c-started: 0
Und das label "Test6" wird angezeigt.
Nach Ende des Events verschwindet der Eintrag aus den Readings:
2016-01-02 13:09:25 CALVIEW myTermine t_001_bdate: 02.01.2016
2016-01-02 13:09:25 CALVIEW myTermine t_001_btime: 00:00:00
2016-01-02 13:09:25 CALVIEW myTermine t_001_summary: Petra Geburtstag
2016-01-02 13:09:25 CALVIEW myTermine t_001_source: HJ_Termine
2016-01-02 13:09:25 CALVIEW myTermine t_001_location:
2016-01-02 13:09:25 CALVIEW myTermine t_001_edate: 03.01.2016
2016-01-02 13:09:25 CALVIEW myTermine t_001_etime: 00:00:00
2016-01-02 13:09:25 CALVIEW myTermine t_001_mode: modeAlarmOrStart
2016-01-02 13:09:25 CALVIEW myTermine t_002_bdate: 02.01.2016
2016-01-02 13:09:25 CALVIEW myTermine t_002_btime: 13:00:00
2016-01-02 13:09:25 CALVIEW myTermine t_002_summary: Test6
2016-01-02 13:09:25 CALVIEW myTermine t_002_source: HJ_Termine
2016-01-02 13:09:25 CALVIEW myTermine t_002_location:
2016-01-02 13:09:25 CALVIEW myTermine t_002_edate: 02.01.2016
2016-01-02 13:09:25 CALVIEW myTermine t_002_etime: 13:10:00
2016-01-02 13:09:25 CALVIEW myTermine t_002_mode: modeAlarmOrStart
2016-01-02 13:09:25 CALVIEW myTermine today_001_bdate: heute
2016-01-02 13:09:25 CALVIEW myTermine today_001_btime: 00:00:00
2016-01-02 13:09:25 CALVIEW myTermine today_001_summary: Petra Geburtstag
2016-01-02 13:09:25 CALVIEW myTermine today_001_source: HJ_Termine
2016-01-02 13:09:25 CALVIEW myTermine today_001_location:
2016-01-02 13:09:25 CALVIEW myTermine today_001_edate: 03.01.2016
2016-01-02 13:09:25 CALVIEW myTermine today_001_etime: 00:00:00
2016-01-02 13:09:25 CALVIEW myTermine today_001_mode: modeAlarmOrStart
2016-01-02 13:09:25 CALVIEW myTermine today_002_bdate: heute
2016-01-02 13:09:25 CALVIEW myTermine today_002_btime: 13:00:00
2016-01-02 13:09:25 CALVIEW myTermine today_002_summary: Test6
2016-01-02 13:09:25 CALVIEW myTermine today_002_source: HJ_Termine
2016-01-02 13:09:25 CALVIEW myTermine today_002_location:
2016-01-02 13:09:25 CALVIEW myTermine today_002_edate: 02.01.2016
2016-01-02 13:09:25 CALVIEW myTermine today_002_etime: 13:10:00
2016-01-02 13:09:25 CALVIEW myTermine today_002_mode: modeAlarmOrStart
2016-01-02 13:09:25 CALVIEW myTermine t: 2 td: 2 tm: 0 ts: 0
2016-01-02 13:09:25 CALVIEW myTermine c-term: 2
2016-01-02 13:09:25 CALVIEW myTermine c-tomorrow: 0
2016-01-02 13:09:25 CALVIEW myTermine c-today: 2
2016-01-02 13:09:25 CALVIEW myTermine c-started: 0
2016-01-02 13:10:25 CALVIEW myTermine t_001_bdate: 02.01.2016
2016-01-02 13:10:25 CALVIEW myTermine t_001_btime: 00:00:00
2016-01-02 13:10:25 CALVIEW myTermine t_001_summary: Petra Geburtstag
2016-01-02 13:10:25 CALVIEW myTermine t_001_source: HJ_Termine
2016-01-02 13:10:25 CALVIEW myTermine t_001_location:
2016-01-02 13:10:25 CALVIEW myTermine t_001_edate: 03.01.2016
2016-01-02 13:10:25 CALVIEW myTermine t_001_etime: 00:00:00
2016-01-02 13:10:25 CALVIEW myTermine t_001_mode: modeAlarmOrStart
2016-01-02 13:10:25 CALVIEW myTermine today_001_bdate: heute
2016-01-02 13:10:25 CALVIEW myTermine today_001_btime: 00:00:00
2016-01-02 13:10:25 CALVIEW myTermine today_001_summary: Petra Geburtstag
2016-01-02 13:10:25 CALVIEW myTermine today_001_source: HJ_Termine
2016-01-02 13:10:25 CALVIEW myTermine today_001_location:
2016-01-02 13:10:25 CALVIEW myTermine today_001_edate: 03.01.2016
2016-01-02 13:10:25 CALVIEW myTermine today_001_etime: 00:00:00
2016-01-02 13:10:25 CALVIEW myTermine today_001_mode: modeAlarmOrStart
2016-01-02 13:10:25 CALVIEW myTermine t: 1 td: 1 tm: 0 ts: 0
2016-01-02 13:10:25 CALVIEW myTermine c-term: 1
2016-01-02 13:10:25 CALVIEW myTermine c-tomorrow: 0
2016-01-02 13:10:25 CALVIEW myTermine c-today: 1
2016-01-02 13:10:25 CALVIEW myTermine c-started: 0
Aber im Tablet UI bleibt "Test6" stehen. <F5> oder <Strg>-<F5> hilft nicht.
Ich habe auch festgestellt, dass der Event im Tablet UI nicht erscheint, wenn man die Seite nach dem Event zum ersten Mal in einem anderen Browser aufruft, dann sieht es (heute früh, nach meinem Test mit Testn) so aus:
(http://up.picr.de/24157215mb.png)
Die in FHEM heute nicht mehr vorhandenen Events für Ferien, Feiertage, Monde werde nicht angezeigt. Für mich sieht es so aus, als ob die Readings irgendwo in Tablet UI gecached werden.
Neustart des PC mit den Browsern sowie des FHEM-Servers (Debian) brachte keine Veränderung, auf beiden Browsern bleibt die Anzeige der veralteten Events erhalten.
Ist das ein Bug, ein Feature, oder habe ich etwas falsch gemacht? Zu den Events gibt es keine notify, ich brauche nur die Anzeige auf dem Tablet UI.
Vielen Dank,
Hans-Jörg
Zitat von: StefanJoe am 02 Januar 2016, 12:21:19
Frage: Kann ich bei dem Knob / Thermostat Widget die Anzeige in der Mitte auf eine Nachkommastelle erweitern?
data-step="0.1"
Hallo,
ich hatte vor einigen Monaten schon eine kleine Oberfläche auf einem iPad eingerichtet, aber auf Grund anderer Projekte nicht weiterverfolgt. Jetzt möchte ich es wieder angehen, aber mit einem anderen Ansatz, und wollte gerne wissen, ob so etwas schon gemacht wurde.
Ich möchte gerne im Flur einen TouchScreen installieren, auf dem ich alles Visualisieren und auch Steuern kann. Deswegen ist mir iPad o.ä. von der Anzeigefläche her zu klein. Ich denke da an einen 15" oder ähnliches. Allerdings kosten die über 300 € als Monitor und 500 € als PC . Da ich inzwischen ein Raspi-Fan bin habe ich gesucht, ob man damit einen Monitor ansteuern kann, aber außer 2-Zeilendisplays nichts gefunden.
meine Fragen konkret:
1: Welche Lösungen setzt Ihr ein?
2: Weis jemand, ob man mit dem Raspi so etwas amchen kann?
Gruß Jürgen
wenn dir 14'' reichen schau dir mal den hier an: http://www.amazon.de/gp/product/B011O1YYQ4?colid=2JQDPJN88101T (http://www.amazon.de/gp/product/B011O1YYQ4?colid=2JQDPJN88101T).
raspberry und monitor wird kaum billiger und ist auf jeden fall mehr bastelei und nicht so flach.
gruss
andre
Zitat von: bmwfan am 02 Januar 2016, 15:56:48
Hallo,
ich hatte vor einigen Monaten schon eine kleine Oberfläche auf einem iPad eingerichtet, aber auf Grund anderer Projekte nicht weiterverfolgt. Jetzt möchte ich es wieder angehen, aber mit einem anderen Ansatz, und wollte gerne wissen, ob so etwas schon gemacht wurde.
Ich möchte gerne im Flur einen TouchScreen installieren, auf dem ich alles Visualisieren und auch Steuern kann. Deswegen ist mir iPad o.ä. von der Anzeigefläche her zu klein. Ich denke da an einen 15" oder ähnliches. Allerdings kosten die über 300 € als Monitor und 500 € als PC . Da ich inzwischen ein Raspi-Fan bin habe ich gesucht, ob man damit einen Monitor ansteuern kann, aber außer 2-Zeilendisplays nichts gefunden.
meine Fragen konkret:
1: Welche Lösungen setzt Ihr ein?
2: Weis jemand, ob man mit dem Raspi so etwas amchen kann?
Gruß Jürgen
Ich benutze diesen hier
http://www.amazon.de/HANNS-G-HT231HPB-42cm-23Zoll-Touchscreen/dp/B00FMB15TC/ref=sr_1_1?s=computers&ie=UTF8&qid=1437945720&sr=1-1&keywords=hanns+touch
zusammen mit einem odroid C1
Hallo zusammen,
ich habe mit "pagetab" ein Phänomen ... sobald ich ein pagetab-div einbinde, sind werden "link" als auch "thermostat" aufgedoppelt dargestellt.
Sobald ich das pagetab herausnehme ist alles wieder beim alten (ist auch unabhängig von der Anzahl der pagetabs, der Verweise etc.).
Weiß jemand wo ich anfangen könnte zu suchen ?
Ich möchte als Menü gerne verschiedene Reiter realisieren, da mir insbesondere die SVG Grafiken zu lange dauern um immer alle zu erstellen...
Zitat von: StefanJoe am 02 Januar 2016, 23:03:34
Hallo zusammen,
ich habe mit "pagetab" ein Phänomen ... sobald ich ein pagetab-div einbinde, sind werden "link" als auch "thermostat" aufgedoppelt dargestellt.
Sobald ich das pagetab herausnehme ist alles wieder beim alten (ist auch unabhängig von der Anzahl der pagetabs, der Verweise etc.).
Weiß jemand wo ich anfangen könnte zu suchen ?
Ich möchte als Menü gerne verschiedene Reiter realisieren, da mir insbesondere die SVG Grafiken zu lange dauern um immer alle zu erstellen...
pagetab lädt eine Seite und ersetzt den Gridester-Inhalt der aktuellen Seite mit der angegebenen Seite. Dabei wird u.U. beim Start die erste angegebene pagetab-Seite beim Start geladen. Damit könnte es sein, dass diese erste pagetab-Seite die Inhalt die dann doppelt erscheinen verursacht.
Vielleicht kannst Du mal die problematische Seite und den pagetab hier posten?
Gruss,
Johannes
Zitat von: bmwfan am 02 Januar 2016, 15:56:48
Hallo,
ich hatte vor einigen Monaten schon eine kleine Oberfläche auf einem iPad eingerichtet, aber auf Grund anderer Projekte nicht weiterverfolgt. Jetzt möchte ich es wieder angehen, aber mit einem anderen Ansatz, und wollte gerne wissen, ob so etwas schon gemacht wurde.
Ich möchte gerne im Flur einen TouchScreen installieren, auf dem ich alles Visualisieren und auch Steuern kann. Deswegen ist mir iPad o.ä. von der Anzeigefläche her zu klein. Ich denke da an einen 15" oder ähnliches. Allerdings kosten die über 300 € als Monitor und 500 € als PC . Da ich inzwischen ein Raspi-Fan bin habe ich gesucht, ob man damit einen Monitor ansteuern kann, aber außer 2-Zeilendisplays nichts gefunden.
meine Fragen konkret:
1: Welche Lösungen setzt Ihr ein?
2: Weis jemand, ob man mit dem Raspi so etwas amchen kann?
Gruß Jürgen
Ich habe mal testweise ein billiges 5Zoll touch display (in China bestellt, finde die Quelle aber gerade nicht mehr) am Raspi und auch am Arduino probiert, bin aber mit dem Ergebniss nicht zufrieden gewesen. Deshalb habe ich ein ausgemustertes 7Zoll Android-Tablet verwendet würde aber auch gerne auf 10Zoll gehen.
Für grössere Bildschirme geht natürlich am Raspberry ein beliebiger TFT und vermutlich sogar bei Bildschirmen mit Toucherweiterung wie z.B.
http://www.amazon.com/10-4-Desktop-Monitor-Touch-Screen/dp/B000YA95RK (http://www.amazon.com/10-4-Desktop-Monitor-Touch-Screen/dp/B000YA95RK) (Nicht ausprobiert nur gefunden)
Generell ist bei diesen Preisen aber schon wieder ein vollständiges Androidtablet möglich...
Zitat von: bmwfan am 02 Januar 2016, 15:56:48
Hallo,
ich hatte vor einigen Monaten schon eine kleine Oberfläche auf einem iPad eingerichtet, aber auf Grund anderer Projekte nicht weiterverfolgt. Jetzt möchte ich es wieder angehen, aber mit einem anderen Ansatz, und wollte gerne wissen, ob so etwas schon gemacht wurde.
Ich möchte gerne im Flur einen TouchScreen installieren, auf dem ich alles Visualisieren und auch Steuern kann. Deswegen ist mir iPad o.ä. von der Anzeigefläche her zu klein. Ich denke da an einen 15" oder ähnliches. Allerdings kosten die über 300 € als Monitor und 500 € als PC . Da ich inzwischen ein Raspi-Fan bin habe ich gesucht, ob man damit einen Monitor ansteuern kann, aber außer 2-Zeilendisplays nichts gefunden.
meine Fragen konkret:
1: Welche Lösungen setzt Ihr ein?
2: Weis jemand, ob man mit dem Raspi so etwas amchen kann?
Gruß Jürgen
Hallo Jürgen,
ich nutze zur Zeit noch ein 10.1' Galaxy Tab2.
Für demnächst, als Ausbau habe ich hiervon 2 bestellt:
http://www.gearbest.com/tablet-pcs/pp_70596.html (http://www.gearbest.com/tablet-pcs/pp_70596.html)
Eins für den unteren Flur und eins für den oberen Flur.
Diese Wand-Halterung:http://www.amazon.de/XFlat-UP150-Universelles-Wandhalterung-kompatibel/dp/B00FB9O9I4/ref=sr_1_2?ie=UTF8&qid=1451781775&sr=8-2&keywords=tablet+wandhalterung+10+zoll (http://www.amazon.de/XFlat-UP150-Universelles-Wandhalterung-kompatibel/dp/B00FB9O9I4/ref=sr_1_2?ie=UTF8&qid=1451781775&sr=8-2&keywords=tablet+wandhalterung+10+zoll)
Zum Laden unten:http://www.amazon.de/gp/product/B00TKOJKWG?psc=1&redirect=true&ref_=oh_aui_search_detailpage (http://www.amazon.de/gp/product/B00TKOJKWG?psc=1&redirect=true&ref_=oh_aui_search_detailpage)
Gruß
Ralf
Hallo zusammen,
ich komme bei meiner Visualisierung der Rollos nicht klar.
Ich hätte gerne das die Schalter der aktuellen position des Rollo anzeigen, wenn das Rollo oben ist soll der Schalter für oben grün bleiben, wenn das Rollo geschlossen ist soll der untere Schalter blau bleiben, bei der pct Anwahl ebenso.
Was muss ich am folgenden Code dafür ändern/hinzufügen?
<div data-type="switch" data-device="R_Spielzimmer"
data-get-on="100|[89][0-9]" data-get-off="!on"
data-set-on="100" data-set-off="" class="green"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="R_Spielzimmer"
data-get-on="[1-7][0-9]" data-get-off="!on"
data-set-on="22" data-set-off="" class="blue"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">22</div>
</div>
<div>
<div data-type="switch" data-device="R_Spielzimmer"
data-get-on="[0-9]" data-get-off="!on"
data-set-on="0" data-set-off="" class="ligthblue"
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="R_Spielzimmer"
data-set-on="stop" data-off-color="#2A2A2A"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
Gruß
Ralf
Hallo Ralf,
ich hatte versucht das Beispiel von viegener nachzubauen und hänge an der gleichen Stelle fest (okay , hilft Dir jetzt auch nicht wirklich)
http://forum.fhem.de/index.php/topic,34233.msg301873.html#msg301873 (http://forum.fhem.de/index.php/topic,34233.msg301873.html#msg301873)
gruss
klaus
Zitat von: viegener am 03 Januar 2016, 00:13:04
pagetab lädt eine Seite und ersetzt den Gridester-Inhalt der aktuellen Seite mit der angegebenen Seite. Dabei wird u.U. beim Start die erste angegebene pagetab-Seite beim Start geladen. Damit könnte es sein, dass diese erste pagetab-Seite die Inhalt die dann doppelt erscheinen verursacht.
Vielleicht kannst Du mal die problematische Seite und den pagetab hier posten?
Gruss,
Johannes
Hallo Johannes,
Ersetzt das Pagetab nur den gridster Inhalt? D.h. Ich muss einen "dummy-gridster" definieren? Oder wie bettet der das ein? Braucht dann das einzubindende html irgendwelche Definitionen / Stylesheets oder übernimmt das diese einfache?
Zitat von: kvo1 am 03 Januar 2016, 03:09:34
ich hatte versucht das Beispiel von viegener nachzubauen und hänge an der gleichen Stelle fest (okay , hilft Dir jetzt auch nicht wirklich)
Hi Klaus,
welches Problem hattest Du mit meinem Beispiel, oder ging es nur um die Einfärbung der Knöpfe?
Eine Einfärbung der Knöpfe habe ich bisher auch nicht am Laufen, ich vermute dazu fehlt dem push widget die Möglichkeit auf statusänderungen zu reagieren und das switch widget hat immer einen internen on/off-Status, der hier hinderlich ist.
Gruss,
Johannes
Hallo zusammen,
ich glaube ich habe es hinbekommen.
Für Auf:
<div data-type="switch" data-device="R_KUECHE_RE"
data-get-on="Auf" data-get-off="!on"
data-set-on="Auf" data-set-off="" class="green"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
Für Zu:
<div data-type="switch" data-device="R_KUECHE_RE"
data-get-on="Zu" data-get-off="!on"
data-set-on="Zu" data-set-off="" class="ligthblue"
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
Ich kann es gerade nicht ausfürlich testen, aber ich bleibe dran.
Gruß
Ralf
Edit:
Ich habe es so gelöst:
<div class="top-space-2x">
<div data-type="switch" data-device="R_KUECHE_RE"
data-get-on="Auf" data-get-off="!on"
data-set-on="Auf" data-set-off="" class="green"
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="R_KUECHE_RE"
data-get-on="22" data-get-off="!on"
data-set-on="22" data-set-off="" class="blue"
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">22</div>
</div>
<div>
<div data-type="switch" data-device="R_KUECHE_RE"
data-get-on="Zu" data-get-off="!on"
data-set-on="Zu" data-set-off="" class="ligthblue"
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
<div>
<div data-type="push" data-device="R_KUECHE_RE"
data-set-on="stop" data-off-color="#2A2A2A"
data-icon="fa-ellipsis-h" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Stop</div>
</div>
Zu sehen im letzten Bild: Rollo mit Status
Hallo,
anbei mal der vollständige Sourcecode der problematischen Seite (index_heizung.html ist leer):
Zitat von: viegener am 03 Januar 2016, 00:13:04
pagetab lädt eine Seite und ersetzt den Gridester-Inhalt der aktuellen Seite mit der angegebenen Seite. Dabei wird u.U. beim Start die erste angegebene pagetab-Seite beim Start geladen. Damit könnte es sein, dass diese erste pagetab-Seite die Inhalt die dann doppelt erscheinen verursacht.
Vielleicht kannst Du mal die problematische Seite und den pagetab hier posten?
Gruss,
Johannes
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.4.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<!-- <meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
-->
<meta name="widget_base_width" content="100">
<meta name="widget_base_height" content="100">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="1"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css">
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/pgm2/jquery-ui.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<title>FHEM-Tablet-UI</title>
</head>
<body>
<div class="cell">
<div data-type="pagetab" data-url="index-heizung.html" data-icon="fa-home" class="cell"></div>
</div>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Datum</header>
<div class="darker" data-type="clock" data-format="Y-m-d"></div>
<div class="big darker"data-type="clock" data-format="H:i:s"></div>
</li>
<li data-row="2" data-col="1" data-sizex="1" data-sizey="2">
<header>Wetter</header>
<div data-type="rotor" class="fade">
<ul>
<li>
<div data-type="label"
class="darker big">Heute</div>
<div data-type="weather" data-device="Wetter"
data-get="fc0_weatherDay" data-imageset="kleinklima"></div>
<div data-type="label" data-device="Wetter"
data-get="fc0_weatherDay"
class="large"></div>
<div data-type="label" data-device="Wetter"
data-get="fc0_tempMin" data-unit="%B0C%0A"
class="big blue inline"></div>
<div data-type="label" data-device="Wetter"
data-get="fc0_tempMax" data-unit="%B0C%0A"
class="big red inline"></div>
</li>
<li>
<div data-type="label"
class="darker big">Morgen</div>
<div data-type="weather" data-device="Wetter"
data-get="fc1_weatherDay" data-imageset="kleinklima" class="big"></div>
<div data-type="label" data-device="Wetter"
data-get="fc1_weatherDay"
class="large"></div>
<div data-type="label" data-device="Wetter"
data-get="fc1_tempMin"
data-unit="%B0C%0A"
class="big blue inline "></div>
<div data-type="label" data-device="Wetter"
data-get="fc1_tempMax"
data-unit="%B0C%0A"
class="big red inline"></div>
</li>
<li>
<div data-type="label"
class="darker big">Trend</div>
<div data-type="weather" data-device="Wetter"
data-get="fc2_weatherDay" data-imageset="kleinklima" class="big"></div>
<div data-type="label" data-device="Wetter"
data-get="fc2_weatherDay"
class="large"></div>
<div data-type="label" data-device="Wetter"
data-get="fc2_tempMin"
data-unit="%B0C%0A"
class="big blue inline"></div>
<div data-type="label" data-device="Wetter"
data-get="fc2_tempMax"
data-unit="%B0C%0A"
class="big red inline"></div>
</li>
</ul>
</div>
</li>
<li data-row="4" data-col="1" data-sizex="1" data-sizey="1">
<header> Video </header>
<!-- <iframe src="http://192.168.1.33:8081"></iframe>
--></li>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="3">
<header>Schalter WZ</header>
<div class="container">
<div data-type="label"
class="darker inline">A
</div>
<div data-type="label"
class="darker inline">B
</div>
</div>
<div data-type="switch"
data-device="IT_0FFFF0FFFF">
</div>
<div data-type="switch"
data-device="IT_0FFFFF0FFF">
</div>
<div class="">
<div data-type="label"
class="darker inline">C
</div>
<div data-type="label"
class="darker inline">D
</div>
</div>
<div data-type="switch"
data-device="IT_0FFFFFF0FF">
</div>
<div data-type="switch"
data-device="IT_0FFFFFFF0F">
</div>
<div data-type="label"
class="darker">IR-Detector
</div>
<div data-type="switch"
data-device="IT_FFF00FFFFF">
</div>
</li>
<li data-row="1" data-col="4" data-sizex="2" data-sizey="3">
<header>Temperaturen</header>
<div class="darker">Wohnzimmer</div>
<div class="cell big">
<div class="inline"
data-type="label"
data-device="CUL_TCM97001_80"
data-get="temperature"
data-unit="%B0C%0A"
data-limits='[-20,18,20,24,26]'
data-colors='["blue","skyblue","springgreen","darkorange","orangered"]'>
</div>
<div class="inline"
data-type="label"
data-device="CUL_TCM97001_80"
data-get="humidity"
data-unit="%%0A"
data-fix="1"
data-limits='[0,40,60]'
data-colors='["skyblue","springgreen","orangered"]'>
</div>
</div>
<div class="darker">Klara</div>
<div class="cell big">
<div class="inline"
data-type="label"
data-device="CUL_TCM97001_24"
data-get="temperature"
data-unit="%B0C%0A"
data-limits='[-20,17,19,22,26]'
data-colors='["blue","skyblue","springgreen","darkorange","orangered"]'>
</div>
<div class="inline"
data-type="label"
data-device="CUL_TCM97001_24"
data-get="humidity"
data-unit="%%0A"
data-fix="1"
data-limits='[0,40,60]'
data-colors='["skyblue","springgreen","orangered"]'>
</div>
</div>
</li>
<li data-row="4" data-col="4" data-sizex="2" data-sizey="1">
<div class="cell">
<div class="left">R268e</div>
<div class="inline"
data-type="label"
data-device="Revolt_268e"
data-get="power"
data-unit="W%0A"
data-limits='[0,10,50,100]'
data-colors='["springgreen","skyblue","darkorange","orangered"]'>
</div>
<div class="inline right"
data-type="label"
data-device="Revolt_268e"
data-get="avgpower"
data-unit="W%0A"
data-fix="1"
data-limits='[0,10,50,100]'
data-colors='["springgreen","skyblue","darkorange","orangered"]'>
</div>
</div>
<div class="cell">
<div class="left">R3af1</div>
<div class="inline"
data-type="label"
data-device="Revolt_3af1"
data-get="power"
data-unit="W%0A"
data-limits='[0,10,50,100]'
data-colors='["springgreen","skyblue","darkorange","orangered"]'>
</div>
<div class="inline right"
data-type="label"
data-device="Revolt_3af1"
data-get="avgpower"
data-unit="W%0A"
data-fix="1"
data-limits='[0,10,50,100]'
data-colors='["springgreen","skyblue","darkorange","orangered"]'>
</div>
</div>
<div class="cell">
<div class="left">R7e2c</div>
<div class="inline"
data-type="label"
data-device="Revolt_7e2c"
data-get="power"
data-unit="W%0A"
data-limits='[0,10,50,100]'
data-colors='["springgreen","skyblue","darkorange","orangered"]'>
</div>
<div class="inline right"
data-type="label"
data-device="Revolt_7e2c"
data-get="avgpower"
data-unit="W%0A"
data-fix="1"
data-limits='[0,10,50,100]'
data-colors='["springgreen","skyblue","darkorange","orangered"]'>
</div>
</div>
</li>
<li data-row="6" data-col="1" data-sizex="5" data-sizey="3">
<header>Heizung-Plot</header>
<div class="cell">
<img src="/fhem/SVG_showLog?dev=SVG_VITO_t_log_1&logdev=VITO&gplotfile=SVG_VITO_t_log_1&logfile=CURRENT&pos="
type="image/svg+xml" width="500" height="250"
name="SVG_VITO_t_log_1">
</img>
</div>
</li>
<li data-row="1" data-col="6" data-sizex="2" data-sizey="6">
<header>Heizung</header>
<div>Warmwasser-Speicher</div>
<div data-type="thermostat"
data-device="VITO"
data-get="Temperatur_Speicher_Warmwasser_oben"
data-get-value="4:VITO.*::"
data-temp="Temperatur_Speicher_Warmwasser_mitte"
data-min="35"
data-max="55"
data-step="0.1"
class="cell small readonly">
</div>
<div>VL / RL</div>
<div data-type="thermostat"
data-device="VITO"
data-get="Temperatur_Ruecklauf_sekundaer"
data-get-value="4:VITO.*::"
data-temp="Temperatur_Vorlauf_sekundaer"
data-min="20"
data-max="35"
data-step="0.1"
class="cell small readonly">
</div>
<div> VL-Soll </div>
<div data-type="thermostat"
data-device="VITO"
data-get="Temperatur_Vorlauf_Soll"
data-get-value="4:VITO.*::"
data-temp="Temperatur_Ruecklauf_sekundaer"
data-min="20"
data-max="35"
data-step="0.1"
class="cell small readonly">
</div>
<div> Load </div>
<div data-type="knob"
data-device="VITO"
data-get="Status_NLOAD"
data-get-value="4:VITO.*::"
data-temp=""
data-min="0"
data-max="127"
data-step="1"
data-fix="1"
class="cell small readonly">
</div>
</li>
<li data-row="1" data-col="8" data-sizex="2" data-sizey="6">
<header>Hi-Fi</header>
<div data-type="label"
class="darker">Soundbar
</div>
<div data-type="switch"
data-device="harmony_30698864"
data-get="power"
data-get-on="on"
data-get-off="off"
data-set-on="PowerToggle"
data-set-off="PowerToggle"
data-icon="fa-music">
</div>
<div data-type="label"
class="darker">TV
</div>
<div data-type="switch"
data-device="harmony_30707900"
data-get="power"
data-get-on="on"
data-get-off="off"
data-set-on="PowerOn"
data-set-off="PowerOff"
data-icon="fa-tv">
</div>
<div data-type="label"
class="darker">BD8909
</div>
<div data-type="switch"
data-device="harmony_30705786"
data-get="power"
data-get-on="on"
data-get-off="off"
data-set-on="PowerToggle"
data-set-off="PowerToggle"
data-icon="fa-hdd-o">
</div>
</li>
</ul></div>
</body>
</html>
Zitat von: StefanJoe am 03 Januar 2016, 17:19:42
Hallo,
anbei mal der vollständige Sourcecode der problematischen Seite (index_heizung.html ist leer):
Dann verstehe ich vielleicht nicht, was Du mit pagetab hier erreichen willst, wenn index_heizung.html leer ist, erschiliesst sich mir der Sinn hier nicht.
Zur anderen Frage: pagetab ersetzt innerhalb des Javascripts, wenn es aufgerufen wird beziehungsweise initialisiert wird den Inhalt des Gridster htmls durch das html dass aus dem angegebenen Link geladen wird.
Moins!
Ich bin gerade dabei Spritpreise als Chart darzustellen.
Mein Chart habe ich so konfiguriert:
<div class="normal"
data-type="chart"
data-logdevice="FileLog_TANK_BaWue_Simus"
data-columnspec='["4:TANK_Madfeld_Shell.DieselPreis", "4:TANK_Fuerstenberg_Esso.DieselPreis"]'
data-style='["ftui l0", "ftui l1"]'
data-ptype='["lines", "lines"]'
data-uaxis='["primary", "primary"]'
data-legend='["Madfeld", "Furstenberg"]'
data-yunit="€"
data-ytext="Euro / Liter"
data-minvalue="0.8"
data-maxvalue="1.3"
data-height="135"
data-width="600"
data-nofulldays="true"
data-cursorgroup="1"
data-scrollgroup="1"
data-xticks="auto">
</div> Das funktioniert auch, aber die min / maxvalue Werte lassen scheinbar nur ganzzahlige Werte zu !? Ist dem so?
Oder muss man dafür was anderes noch konfigurieren? Bei Spritpreisen ist die Skalierung 0 bis 2 ziemlich unglücklich ... Vor allem wenn man eh nur ein 140 Pixel hohes Chart darstellt ..
Und hier hatte jemand geschrieben ...
ZitatBei dem neuen Chart wird die Beschriftung der x und y Achse im Webviewcontrol nicht angezeigt, im "normalen" Browser hingegen schon. Ist das ein bekannter Bug im Webviewcontrol?
Das ist bei mir auch so. Aber nur beim IE edge. Wird es da noch einen Fix geben?
Grüße
Zitat von: viegener am 03 Januar 2016, 18:32:20
Dann verstehe ich vielleicht nicht, was Du mit pagetab hier erreichen willst, wenn index_heizung.html leer ist, erschiliesst sich mir der Sinn hier nicht.
Zur anderen Frage: pagetab ersetzt innerhalb des Javascripts, wenn es aufgerufen wird beziehungsweise initialisiert wird den Inhalt des Gridster htmls durch das html dass aus dem angegebenen Link geladen wird.
Hallo Johannes,
ich möchte gerne links eine Navigationsleiste erstellen, die dann im rechten Teil unterschiedliche Ansichten präsentiert.
Inhalte je "Unterseite" werden dafür aktuell noch definiert, daher ist das "noch" leer.
Habe auch bereits versucht das über "button" zu realisieren, aber aus einem mir nicht bekannten Grunde kann ich bei button keine data-icon oder icon definieren ... es bleibt immer nur beim orangenen Kreis.
Ich würde vorschlagen in index_heizung.html mal zumindest auch den Gridster einzusetzen und zusätzlich darin einen button oder label. Mit einer leeren Datei kann es komische Effekte geben.
Beispiel für eine pagetab-Seite, wie ich sie verwende:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="4" >
<header>Menu</header>
</li>
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1">
<header>Test</header>
</li>
</ul>
</div>
</body>
</html>
Zitat von: StefanJoe am 03 Januar 2016, 19:58:23
Habe auch bereits versucht das über "button" zu realisieren, aber aus einem mir nicht bekannten Grunde kann ich bei button keine data-icon oder icon definieren ... es bleibt immer nur beim orangenen Kreis.
Was sagt denn die Console im Browser dazu?
In der Seite oben ist z.B: openautomation und fhemSVG nicht eingebunden (nur font-awesome), deshalb wäre es vermutlich kein Wunder, wenn keine Button-Icons angezeigt werden.
Johannes
Zitat von: viegener am 03 Januar 2016, 21:47:04
Was sagt denn die Console im Browser dazu?
In der Seite oben ist z.B: openautomation und fhemSVG nicht eingebunden (nur font-awesome), deshalb wäre es vermutlich kein Wunder, wenn keine Button-Icons angezeigt werden.
Johannes
habe mal beide CSS eingebunden, aber immer noch derselbe Effekt.
Console-output hier:
GET
http://192.168.1.33:8083/fhem/tablet/css/fhem-tablet-ui-user.css [HTTP/1.1 404 Not Found 129ms]
Unbekannte Eigenschaft 'speak'. Deklaration ignoriert. fhem-tablet-ui.css:46:13
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. fhem-tablet-ui.css:54:31
Fehler beim Verarbeiten des Wertes für 'display'. Deklaration ignoriert. fhem-tablet-ui.css:252:13
Fehler beim Verarbeiten des Wertes für 'display'. Deklaration ignoriert. fhem-tablet-ui.css:253:13
Fehler beim Verarbeiten des Wertes für 'display'. Deklaration ignoriert. fhem-tablet-ui.css:254:13
Fehler beim Verarbeiten des Wertes für 'min-height'. Deklaration ignoriert. fhem-tablet-ui.css:380:16
Unbekannte Eigenschaft 'appearance'. Deklaration ignoriert. fhem-tablet-ui.css:571:14
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. font-awesome.min.css:4:587
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1826
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1989
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2155
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2326
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2499
Unbekannte Eigenschaft 'speak'. Deklaration ignoriert. fhemSVG.css:14:6
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. fhemSVG.css:23:24
Unbekannte Eigenschaft 'speak'. Deklaration ignoriert. openautomation.css:14:6
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. openautomation.css:23:24
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.toast.min.js:4:25327
Farbe erwartet, aber '#-a310a23a' gefunden. from DOM
Farbe erwartet, aber '#-\33 5c41a5' gefunden. from DOM
Fehler beim Verarbeiten des Wertes für 'line-height'. Deklaration ignoriert. index.html
Zitat von: StefanJoe am 03 Januar 2016, 22:28:51
habe mal beide CSS eingebunden, aber immer noch derselbe Effekt.
Einige der Meldungen sind schon etwas rätselhaft.
Hast Du denn mal das Beispiel (index-example.html) bei Dir in Betrieb gesetzt? Wenn auch da keine Icons angezeigt werden, stimmt irgendetwas mit Deiner Installation nicht.
Zitat von: viegener am 03 Januar 2016, 23:32:35
Einige der Meldungen sind schon etwas rätselhaft.
Hast Du denn mal das Beispiel (index-example.html) bei Dir in Betrieb gesetzt? Wenn auch da keine Icons angezeigt werden, stimmt irgendetwas mit Deiner Installation nicht.
Also wenn ich die index-example aufrufe, bekomme ich folgende Ausgabe in der console:
GET
http://192.168.1.33:8083/fhem/tablet/css/fhem-tablet-ui-user.css [HTTP/1.1 404 Not Found 19ms]
Unbekannte Eigenschaft 'speak'. Deklaration ignoriert. fhem-tablet-ui.css:46:13
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. fhem-tablet-ui.css:54:31
Fehler beim Verarbeiten des Wertes für 'display'. Deklaration ignoriert. fhem-tablet-ui.css:252:13
Fehler beim Verarbeiten des Wertes für 'display'. Deklaration ignoriert. fhem-tablet-ui.css:253:13
Fehler beim Verarbeiten des Wertes für 'display'. Deklaration ignoriert. fhem-tablet-ui.css:254:13
Fehler beim Verarbeiten des Wertes für 'min-height'. Deklaration ignoriert. fhem-tablet-ui.css:380:16
Unbekannte Eigenschaft 'appearance'. Deklaration ignoriert. fhem-tablet-ui.css:571:14
Unbekannte Eigenschaft '-moz-osx-font-smoothing'. Deklaration ignoriert. font-awesome.min.css:4:587
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1826
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:1989
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2155
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2326
'none', URL oder Filterfunktion erwartet, aber 'progid' gefunden. Fehler beim Verarbeiten des Wertes für 'filter'. Deklaration ignoriert. font-awesome.min.css:4:2499
Synchrone XMLHttpRequests am Haupt-Thread sollte nicht mehr verwendet werden, weil es nachteilige Effekte für das Erlebnis der Endbenutzer hat. Für weitere Hilfe siehe http://xhr.spec.whatwg.org/ jquery.min.js:4:25327
Unbekannte Eigenschaft 'user-select'. Deklaration ignoriert. powerange.min.css:1:1156
Zitat von: StefanJoe am 03 Januar 2016, 23:53:18
Also wenn ich die index-example aufrufe, bekomme ich folgende Ausgabe in der console:
Was wird denn bei der index-example angezeigt? Werden hier Icons angezeigt?
Johannes
Ja, werden angezeigt.
Dort sind ja aber auch keine "buttons" definiert, sondern nur switch, label .....
Zitat von: StefanJoe am 04 Januar 2016, 00:25:27
Ja, werden angezeigt.
Dort sind ja aber auch keine "buttons" definiert, sondern nur switch, label .....
Ahh ok, Sorry dann hatte ich Dich dabei missverstanden (Button wird auch ind er Doku als Synonym für alle Push-widgets bzw knopfartigen Elemente verwendet). Das heisst switch / push (und auch symbol) können Icons anzeigen? Nur beim widget_button wird das Icon nicht angezeigt?
Kannst Du dann mal ein Beispiel für eine Seite mit Button posten und genau beschreiben was angezeigt wird (auch wenn gedrückt)?
Zitat von: viegener am 04 Januar 2016, 00:46:19
Ahh ok, Sorry dann hatte ich Dich dabei missverstanden (Button wird auch ind er Doku als Synonym für alle Push-widgets bzw knopfartigen Elemente verwendet). Das heisst switch / push (und auch symbol) können Icons anzeigen? Nur beim widget_button wird das Icon nicht angezeigt?
Kannst Du dann mal ein Beispiel für eine Seite mit Button posten und genau beschreiben was angezeigt wird (auch wenn gedrückt)?
Korrekt,
ich kann zwar den button "an / ab" schalten (orange/grau) aber das symbol wird nicht angezeigt...
aber auch nochmal zurück zum Anfangsproblem:
Was ist denn aktuell die Empfehlung wernn man auf einer Seite eine "Übersicht" zeigen möchte und bei Klick auf ein Symbol (egal ob Menü oder sonstwas) Details (z.B. SVG Plots etc) angezeigt bekommen möchte ?
Hallo Johannes,
Zitat von: viegener am 03 Januar 2016, 13:55:30
Hi Klaus,
welches Problem hattest Du mit meinem Beispiel, oder ging es nur um die Einfärbung der Knöpfe?
Eine Einfärbung der Knöpfe habe ich bisher auch nicht am Laufen, ich vermute dazu fehlt dem push widget die Möglichkeit auf statusänderungen zu reagieren und das switch widget hat immer einen internen on/off-Status, der hier hinderlich ist.
Gruss,
Johannes
2 Dinge habe ich hier:
-der Slider ist nicht mittig über den 3 Knöpfen
- wenn ich einen der 3 Knöpfe drücke , passiert (bisher) nichts ! (also unten links kommt keine Meldung)
PS. bin aber zugegeben ein "Neuling" bei FTUI (html / CSS)
Danke für Deine Hilfe
klaus
Kann mir jemand sagen, wie ich die Schriftgrösse im Thermost-Widget verkleinern kann.
Gruß Bert
Selbstgespräche... :-X
Zitat von: Augschburger am 02 Januar 2016, 13:55:20
Hallo,
jetzt frage ich doch mal nach, weil ich einfach nicht mehr weiterkomme:
[...]
Ist das ein Bug, ein Feature, oder habe ich etwas falsch gemacht?
Inzwischen habe ich mich parallel mit der Anwesenheitserkennung per Fritzbox beschäftigt und dort gibt es den Hinweis, dass es nicht funktioniert, wenn die Readings gelöscht werden (verschwinden). Deshalb habe ich folgende Theorie:
Dadurch, dass das Reading today_00n_xxx und tomorrow_00n_xxx in den CALVIEW devices um Mitternacht einfach verschwindet, bekommt Tablet UI das nicht mit und zeigt weiterhin den alten Wert aus dem Cache an. Sollte der durch einen neuen Termin überschrieben werden, ist alles gut und es wird korrekt angezeigt.
Deshalb habe ich mir jetzt für Mitternacht ein paar at Befehle angelegt, die zuerst das Reading auf --- setzen, kurz warten und anschließend löschen. Die Intervalle der CALVIEW devices habe ich auf 60 Minuten gestellt, so wird spätestens eine Stunde später der (eventuell vorhandene) neue Termin wieder richtig eingetragen.
Das Setzen auf --- triggert das Tablet UI, dort filtere ich es mit data-substitution="s/---//g" aus der Anzeige. Leider kann man mit setreading keine Leerstrings übergeben... :(
define myFeiertage_DEL at *23:59:59 setreading myFeiertage today_001_summary ---;;setreading myFeiertage tomorrow_001_summary ---;;sleep 1;;deletereading myFeiertage today_001_summary;;deletereading myFeiertage tomorrow_001_summaryMir taugt das so, weil ich (im Moment) nur ganztägige Termine anzeigen will.
Trotzdem täte mich interessieren, wie andere das Problem gelöst haben?
Danke für sachdienliche Hinweise, :)
Hans-Jörg
Hi zusammen,
nachdem das Thermostat Widget im Haushalt keinen Anklang fand, muss ich mir nun eine neue Möglichkeit zur Steuerung der Heizungen überlegen. Meine erste Idee war, einen Slider mit drei definierten Stufen zu verwenden (also eco, 20.5 und 21,5 °C), aber der Slider ist laut meinem Verständnis leider relativ Stufenlos ausgelegt, korrekt? Also es gibt nicht drei Positionen in denen er "einrasten" könnte?
Vielen Dank im Voraus!
Zitat von: StefanJoe am 04 Januar 2016, 00:59:34
aber auch nochmal zurück zum Anfangsproblem:
Was ist denn aktuell die Empfehlung wernn man auf einer Seite eine "Übersicht" zeigen möchte und bei Klick auf ein Symbol (egal ob Menü oder sonstwas) Details (z.B. SVG Plots etc) angezeigt bekommen möchte ?
Generell haben wohl viele eine oder mehrere Reihen von Auswahlsymbolen an einem oder mehrerer Ränder.
Bei mir ist das links, dbaie ist ein Teil dieser Knöpfe wieder als Circlemenu ausgelegt.
Bei mir sind alle Knöpfe die die Anzeige wechseln "pagetab" widgets, die alle dasselbe menu (ein template) mitbringen und an der selben Stelle haben.
Du findest einige Beispiele im Thread user demos: http://forum.fhem.de/index.php/topic,37378.msg384304.html#msg384304 (http://forum.fhem.de/index.php/topic,37378.msg384304.html#msg384304)
Diese können vielleicht als Anregung dienen auch wenn sie nicht unbedingt auf dem neuesten Stand sind.
Ob pagetabs oder andere Varianten, da kann ich keine grundsätzliche Empfehlung geben, ich finde pagetabs schicker und besser um die Inhalte zu strukturieren.
Johannes
Hallo Johannes,
danke für die Beschreibung , werde mir DEINE Struktur nochmal ansehen.
Ich bin eigentlich genau wie in Wiki http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ) beschrieben vorgegangen.
Wie baue ich ein Menü mit dem Pagetab Widget auf?
Die Index.html beinhaltet nur:
- menu-datetime.html Stellt Zeit / Datum dar
- main-menu.html das eigentliche Menü
- status.html Hier sollen mal globale Statis dargestellt werden
In der main-menu.html sind dann die weiteren SUB´s
hier mal 2 als Bsp.
Dennoch bekomme ich nicht immer die icons in Menü (main-menu.html) angezeigt , manchmal fehlt auch die erste Seite,
teilweise wird nix geladen.
Vielleicht hat noch wer eine Idee oder findet MEINEN Fehler
Gruss
klaus
Zitat von: kvo1 am 04 Januar 2016, 21:29:12
Dennoch bekomme ich nicht immer die icons in Menü (main-menu.html) angezeigt , manchmal fehlt auch die erste Seite,
teilweise wird nix geladen.
Vielleicht hat noch wer eine Idee oder findet MEINEN Fehler
Was sagt denn firebug etc und passiert das nur in einem bestimmten browser/PLattform?
Meine Demo is online 8)
http://forum.fhem.de/index.php/topic,37378.msg384862.html#msg384862 (http://forum.fhem.de/index.php/topic,37378.msg384862.html#msg384862)
Zitat von: kvo1 am 04 Januar 2016, 21:29:12
Vielleicht hat noch wer eine Idee oder findet MEINEN Fehler
Warum hast Du
defer an den Javascript-Teilen (insbesondere am jquery selbst)?
Gab es irgendwo einen Hinweis defer zu verwenden?
Bei mir verrusacht das eine ganze Reihe von Fehlermeldungen beim Laden Deiner Seiten.
Nimm das defer heraus und dann schauen wir weiter...
Zitat von: moelski am 03 Januar 2016, 19:09:29
Moins!
Ich bin gerade dabei Spritpreise als Chart darzustellen.
Mein Chart habe ich so konfiguriert:
<div class="normal"
data-type="chart"
data-logdevice="FileLog_TANK_BaWue_Simus"
data-columnspec='["4:TANK_Madfeld_Shell.DieselPreis", "4:TANK_Fuerstenberg_Esso.DieselPreis"]'
data-style='["ftui l0", "ftui l1"]'
data-ptype='["lines", "lines"]'
data-uaxis='["primary", "primary"]'
data-legend='["Madfeld", "Furstenberg"]'
data-yunit="€"
data-ytext="Euro / Liter"
data-minvalue="0.8"
data-maxvalue="1.3"
data-height="135"
data-width="600"
data-nofulldays="true"
data-cursorgroup="1"
data-scrollgroup="1"
data-xticks="auto">
</div>
Das funktioniert auch, aber die min / maxvalue Werte lassen scheinbar nur ganzzahlige Werte zu !? Ist dem so?
Oder muss man dafür was anderes noch konfigurieren? Bei Spritpreisen ist die Skalierung 0 bis 2 ziemlich unglücklich ... Vor allem wenn man eh nur ein 140 Pixel hohes Chart darstellt ..
Und hier hatte jemand geschrieben ... Das ist bei mir auch so. Aber nur beim IE edge. Wird es da noch einen Fix geben?
Grüße
Habe das gleiche vor, kann auch bestätigen dass die Autoskallierung scheinbar nur geradzahlige werte annimmt.
Eine manuelle skalierung mit einem Array für Min und Max wie es im simplechart gibt funktionieren leider nicht.
Bin prinzipiell begeistert von dem tollen Widget, ich hoffe jedoch dass es noch ein wenig fein geschliffen wird und ein Update bzw. Einstellungsstipps für den Anwendungsfall gibt.
Schöne Grüße
Mirko
Weil es an anderer Stelle nochmals erfragt wurde, hier nochmal eine kurze Info wie man den HTTPSRV (oder FTUISRV)-Eintrags für das tablet UI machen kann (auch wenn das nicht der einzige Weg sein mag):
Der HTTPSRV-Eintrag soll es ermöglichen das FTUI unter einem selbstgewählten url wie zum Beispiel
http://meinfhem:8083/fhem/ftui
erreichbar zu haben, obwohl die Dateien in <fhem-root>/www/tablet stehen.
Wenn man keine HTTPSRV-Definition anlegt wäre das ftui auch unter http://meinfhem:8083/fhem/tablet/index.html erreichbar, da FHEMWeb die Dateien genau dort liest, wenn amn /fhem/tablet im URL angibt (wird übersetzt zu www/tablet). Ob FTUI dann aber korrekt funktioniert kann ich nicht sagen.
Eine HTTPSRV-Definition erzeugt einen anderen URL für ein Verzeichnis (!) im Dateisystem des FHEM-Servers. Also gibt die Definition den Namen an unter dem das FTUI erreichbar sein soll (nach dem verpflichtenden fhem) --> für das Beispiel oben ist das ftui in der commandref als "infix" bezeichnet. Ausserdem gibt sie den Pfad zum FTUI-Verzeichnis an --> In unserem Fall ist das ./www/tablet also relativ zum fhem-Wurzelverzeichnis.
Damit sollte die Definition für das Beispiel so lauten:
define meinftui HTTPSRV ftui ./www/tablet Mein-FTUI
Weder an ftui noch an ./www/tablet muss dabei ein abschliessender "/"
Damit aber das ganze auch wirklich gut funktioniert, sollte in der eigenen index.html noch das folgende Skript enthalten sein:
<script language="javascript">
if ( document.location.pathname == "/fhem/ftui" ) {
var href = document.location.protocol + "//" + document.location.host + document.location.pathname + "/" + document.location.hash ;
document.location.replace( href );
}
</script>
Dann funktioniert auch ein Aufruf ohne das abschliessende / korrekt wie unten:
http://meinfhem:8083/fhem/ftui
Alternativ kann auch eine Definition mit einem angefügten / erfolgen, auch wenn das so eigentlich in HTTPSRV nicht vorgesehen war:
define meinftui HTTPSRV ftui/ ./www/tablet Mein-FTUI
Inzwischen wurde die Behandlung in HTTPSRV so flexibel gemacht auch solche Definitionen zu behandeln.
Lasst mich wissen, wenn ich hier etwas beim Korrekturlesen übersehen habe, passe ich das hier noch an.
Zitat von: viegener am 04 Januar 2016, 22:59:20
Weil es an anderer Stelle nochmals erfragt wurde, hier nochmal eine kurze Info wie man den HTTPSRV (oder FTUISRV)-Eintrags für das tablet UI machen kann (auch wenn das nicht der einzige Weg sein mag):
Der HTTPSRV-Eintrag soll es ermöglichen das FTUI unter einem selbstgewählten url wie zum Beispiel
http://meinfhem:8083/fhem/ftui
erreichbar zu haben, obwohl die Dateien in <fhem-root>/www/tablet stehen.
Wenn man keine HTTPSRV-Definition anlegt wäre das ftui auch unter http://meinfhem:8083/fhem/tablet/index.html erreichbar, da FHEMWeb die Dateien genau dort liest, wenn amn /fhem/tablet im URL angibt (wird übersetzt zu www/tablet). Ob FTUI dann aber korrekt funktioniert kann ich nicht sagen.
Eine HTTPSRV-Definition erzeugt einen anderen URL für ein Verzeichnis (!) im Dateisystem des FHEM-Servers. Also gibt die Definition den Namen an unter dem das FTUI erreichbar sein soll (nach dem verpflichtenden fhem) --> für das Beispiel oben ist das ftui in der commandref als "infix" bezeichnet. Ausserdem gibt sie den Pfad zum FTUI-Verzeichnis an --> In unserem Fall ist das ./www/tablet also relativ zum fhem-Wurzelverzeichnis.
Damit sollte die Definition für das Beispiel so lauten:
define meinftui HTTPSRV ftui ./www/tablet Mein-FTUI
Weder an ftui noch an ./www/tablet muss dabei ein abschliessender "/"
Damit aber das ganze auch wirklich gut funktioniert, sollte in der eigenen index.html noch das folgende Skript enthalten sein:
<script language="javascript">
if ( document.location.pathname == "/fhem/ftui" ) {
var href = document.location.protocol + "//" + document.location.host + document.location.pathname + "/" + document.location.hash ;
document.location.replace( href );
}
</script>
Dann funktioniert auch ein Aufruf ohne das abschliessende / korrekt wie unten:
http://meinfhem:8083/fhem/ftui
Lasst mich wissen, wenn ich hier etwas beim Korrekturlesen übersehen habe, passe ich das hier noch an.
Ich auch nochmal!!!
IMMER EINEN / (SLASH) AM ENDE!!!
Zitat von: roman1528 am 04 Januar 2016, 23:07:09
Ich auch nochmal!!!
IMMER EINEN / (SLASH) AM ENDE!!!
Sorry kannst Du das irgendwie erklären?
Johannes
ich habe eben zusätzlich zu einem 7'' tablet noch ein 10'' in betrieb genommen. beide haben 1280x800 auflösung. wenn ich auf dem 10'' den bildschirm fülle wird auf dem 7'' in beide richtungen eine ganze menge abgeschnitten, wenn ich auf dem 7'' den bildschirm fülle ist auf dem 10'' noch massig platz. hat jemand ein idee warum das trotz gleicher auflösung passiert?
danke
andre
Zitat von: viegener am 04 Januar 2016, 23:08:42
Sorry kannst Du das irgendwie erklären?
Johannes
Mit / = absoluter Aufruf
Ohne / = relativer Aufruf
Wenn ich jetzt eine URL ohne / (http://meine.url/ordner) am Ende aufrufe ist der Browser intelligent genug und sucht sich brav die index.html aus dem angegebenen Ordner. Feiner Browser.
Wenn ich aber wie bei FTUI dumme JavaScripts habe deren Ressourcen auch noch in Unterordnern (http://meine.url/ordner/ressourcen) liegen, funktioniert das nicht. Weil nur der letzte Ordner (ordner) bekannt ist. Aber JavaScript möchte (und da bleibt es stur) in seinem Ordner (ressourcen) ausgeführt werden. Wird aber nicht gefunden, weil kennen wir ja nicht. Doch ein doofer Browser. Oder JavaScript?
Rufe ich jetzt aber mit / (http://meine.url/ordner/ auf wechselt unser scheinbar doch nicht so schlauer Browser vollständig in das angegebene Verzeichniss und findet (endlich) auch den Ordner mit den Ressourcen für JavaScript. Und alle freuen sich des lebens... Wir und JavaScript
;D ;D ;D
Grüße^^
P.S. ohne / (Slash) läuft es bei mir einfach nicht. Egal welchen "schlauen" Browser ich nehme. Es wird nur Müll angezeigt.
Sollten mal eine ganze Seite Icons ausfallen kann es am 'data-type="button"' liegen. Widget von nesges und läuft seit einiger Zeit nicht mehr.
Ich möchte gerne für meine Devices unterschiedliche Tablet UIs aufbauen.
Oder besteht mittlerweile die Möglichkeit das Ganze Full Responsive aufzubauen?
Falls nein, kann ich das wie folgt machen?:
######## Frontends #########
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui/ ./www/tablet07 Tablet-UI
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui/ ./www/tablet10 Tablet-UI
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftui/ ./www/tabletIphone Tablet-UI
Zitat von: roman1528 am 04 Januar 2016, 23:25:39
Mit / = absoluter Aufruf
Ohne / = relativer Aufruf
Das gilt für den Anfang eines URLs nicht für das Ende (siehe auch def in wikipedia, der absolute Pfad enthält das Wurzelverzeichnis oder bei unixfilesystemen / am Anfang)
Zitat von: roman1528 am 04 Januar 2016, 23:25:39
Wenn ich jetzt eine URL ohne / (http://meine.url/ordner) am Ende aufrufe ist der Browser intelligent genug und sucht sich brav die index.html aus dem angegebenen Ordner. Feiner Browser.
Leider stimmt das nicht, denn der Browser hat damit nichts zu tun, diese Funktionialität steckt in 02_HTTPSRV Zeile 174:
$filename= AttrVal($name,"directoryindex","index.html") unless($filename);Im Attribute directoryindex kann sogar angegeben werden, dass eine andere Datei gelesen wird.
Zitat von: roman1528 am 04 Januar 2016, 23:25:39
P.S. ohne / (Slash) läuft es bei mir einfach nicht. Egal welchen "schlauen" Browser ich nehme. Es wird nur Müll angezeigt.
Ich denke das lässt sich lösen, allerdings sprichst Du meines Wissens nach Dein tablet ui unter
.../www/tablet/...
an, das entspricht ja genau dem Fall, den ich oben nicht dargestellt habe, denn dafür benötigt man nicht unbedingt eine HTTPSRV definition.
Zitat von: Gunther am 04 Januar 2016, 23:36:55
Ich möchte gerne für meine Devices unterschiedliche Tablet UIs aufbauen.
Oder besteht mittlerweile die Möglichkeit das Ganze Full Responsive aufzubauen?
Falls nein, kann ich das wie folgt machen?:
######## Frontends #########
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui/ ./www/tablet07 Tablet-UI
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui/ ./www/tablet10 Tablet-UI
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftui/ ./www/tabletIphone Tablet-UI
Leider klappt das nicht:
Ich hätte erwartet, dass mir drei Links oben links in FHEM angezeigt werden, sobei mir jetzt auffällt, dass dort FTUI steht und ich das nirgendwo definiert habe.
Geht das überhaupt mit 3 unterschiedlichen FTUIs? Freue mich über Hinweise.
Hallo Roman,
ich habe mir deine Website mal angesehen.
wo bekomme ich denn inc_home_button.html und alle weiteren inc.x her?
LG
/robin
Zitat von: Gunther am 04 Januar 2016, 23:50:54
Leider klappt das nicht:
Ich hätte erwartet, dass mir drei Links oben links in FHEM angezeigt werden, sobei mir jetzt auffällt, dass dort FTUI steht und ich das nirgendwo definiert habe.
Geht das überhaupt mit 3 unterschiedlichen FTUIs? Freue mich über Hinweise.
Ja das geht problemlos, allerdings hast Du bei allen drei Definitionen ftui/ stehen
Das macht so keinen Sinn, da die Tablet uis ja unter unterschiedlichen URLs erreichbar sein sollen. Damit solltest Du dort die unterschiedlichen Namen unter denen dei verschiedenen UIs erreichbar sein sollen.
Also z.B.
define TABLETUI07 HTTPSRV ftui07 ./www/tablet07 Tablet-UI-07
define TABLETUI10 HTTPSRV ftui10 ./www/tablet10 Tablet-UI-10
Zitat von: viegener am 04 Januar 2016, 22:25:07
Warum hast Du defer an den Javascript-Teilen (insbesondere am jquery selbst)?
Gab es irgendwo einen Hinweis defer zu verwenden?
Bei mir verrusacht das eine ganze Reihe von Fehlermeldungen beim Laden Deiner Seiten.
Nimm das defer heraus und dann schauen wir weiter...
Hallo Johannes,
das
defer war so in der Vorlage die ich aus dem WIKI hatte , siehe link zuvor !
Werde mal testen !
klaus
Zitat von: viegener am 04 Januar 2016, 23:46:54
Ich denke das lässt sich lösen, allerdings sprichst Du meines Wissens nach Dein tablet ui unter
.../www/tablet/...
an, das entspricht ja genau dem Fall, den ich oben nicht dargestellt habe, denn dafür benötigt man nicht unbedingt eine HTTPSRV definition.
Ob HTTPSRV oder Peng. Ob ich die direkt aufrufe oder über /ftui (also mit HTTPSRV) es ist schnuppe!
Packe ich keinen Slash hinten dran bekomm ich nur gewurste aus FHEM und FTUI! Das ist Fakt.
Zitat von: justme1968 am 04 Januar 2016, 23:09:53
ich habe eben zusätzlich zu einem 7'' tablet noch ein 10'' in betrieb genommen. beide haben 1280x800 auflösung. wenn ich auf dem 10'' den bildschirm fülle wird auf dem 7'' in beide richtungen eine ganze menge abgeschnitten, wenn ich auf dem 7'' den bildschirm fülle ist auf dem 10'' noch massig platz. hat jemand ein idee warum das trotz gleicher auflösung passiert?
danke
andre
Dann haben sie NICHT die gleiche Auflösung!
Zitat von: Gunther am 04 Januar 2016, 23:36:55
Ich möchte gerne für meine Devices unterschiedliche Tablet UIs aufbauen.
Oder besteht mittlerweile die Möglichkeit das Ganze Full Responsive aufzubauen?
Falls nein, kann ich das wie folgt machen?:
######## Frontends #########
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui/ ./www/tablet07 Tablet-UI
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui/ ./www/tablet10 Tablet-UI
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftui/ ./www/tabletIphone Tablet-UI
Nicht alle 3 Links gleich nennen (Tablet-UI)
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui/ ./www/tablet07 Tablet-UI-07
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui/ ./www/tablet10 Tablet-UI-10
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftui/ ./www/tabletIphone Tablet-UI-APFEL
Zitat von: fh168 am 04 Januar 2016, 23:57:46
Hallo Roman,
ich habe mir deine Website mal angesehen.
wo bekomme ich denn inc_home_button.html und alle weiteren inc.x her?
LG
/robin
Für meine Tablet-Version sind die Files jetzt auch oben. Am Ende der Seite sie *.zip Datei herunterladen. Da ist alles drin^^
Grüße^^
Zitat von: viegener am 05 Januar 2016, 00:12:22
Ja das geht problemlos, allerdings hast Du bei allen drei Definitionen ftui/ stehen
Das macht so keinen Sinn, da die Tablet uis ja unter unterschiedlichen URLs erreichbar sein sollen. Damit solltest Du dort die unterschiedlichen Namen unter denen dei verschiedenen UIs erreichbar sein sollen.
Also z.B.
define TABLETUI07 HTTPSRV ftui07 ./www/tablet07 Tablet-UI-07
define TABLETUI10 HTTPSRV ftui10 ./www/tablet10 Tablet-UI-10
Leider ist das bei mir nicht so problemlos:
So sieht es bei mir jetzt aus:
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui07 ./www/tablet07 Tablet-UI-07
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui10 ./www/tablet10 Tablet-UI-10
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftuiiphone ./www/tabletIphone Tablet-UI-IphoneIch habe auch ftui07/ versucht.
Unter www habe ich meinen ursprünglichen Ordner tablet in tablet07 umbenannt und kopiert in die Ordner tablet10 und tabletIphone.
Leider kommt nur folgendes zum Vorschein: vgl. Anhang.
Zitat von: Gunther am 05 Januar 2016, 00:37:48
Leider ist das bei mir nicht so problemlos:
So sieht es bei mir jetzt aus:
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui07 ./www/tablet07 Tablet-UI-07
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui10 ./www/tablet10 Tablet-UI-10
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftuiiphone ./www/tabletIphone Tablet-UI-Iphone
Ich habe auch ftui07/ versucht.
Unter www habe ich meinen ursprünglichen Ordner tablet in tablet07 umbenannt und kopiert in die Ordner tablet10 und tabletIphone.
Leider kommt nur folgendes zum Vorschein: vgl. Anhang.
du musst die verweise in deine index <head> bearbeiten.
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-tablet.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>Grüße^^
Schau dir von meinen beiden versionen die index.html an
http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui (http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui)
Danke, das bringt mich einen kleinen Schritt weiter.
Nun sieht es wie im Anhang aus.
Meine Index (head), z. B. für 7 Zoll sieht so aus:
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="144">
<meta name="widget_base_height" content="112">
<meta name="widget_margin" content="2">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta name='gridster_disable' content='1'>
<link rel="stylesheet" href="/fhem/tablet07/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet07/eigenefonts/gk/style.css">
<link rel="stylesheet" href="./css/wopr.css">
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/own.css">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/js/fhem-tablet-ui.js"></script>
<script type="text/javascript" src="/fhem/tablet07/js/widget_calview.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!-- -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
Meine fhem.cfg so:
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui07/ ./www/tablet07 Tablet-UI-7
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui10/ ./www/tablet10 Tablet-UI-10
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftuiiphone/ ./www/tabletiphone Tablet-UI-Iphone
Muss hier z. B. bei 7 Zoll nun
ftui07/ oder ftui07 stehen?
Was mache ich noch falsch?
Habe die Seiten mal in einem anderen Browser mit geleertem Cache geöffnet. Leider wird das auch nichts.
Zitat von: kvo1 am 05 Januar 2016, 00:21:50
Hallo Johannes,
das defer war so in der Vorlage die ich aus dem WIKI hatte , siehe link zuvor !
Werde mal testen !
klaus
Ich denke warum setstate das defer aufgenommen hat, kann er vermutlich selber besser erklären.
In Deinem HTML ist aber wohl eine Mischung von Skripts die sofort ausgeführt werden und welchen die defer verwenden. Problem ein grosser Teil der Skripte setzt aufeinander auf und insbesondere das jquery.min.js ist elementar für alle widgets und auch alle anderen Skripte die jquery im Namen haben.
Eine Alternatvie wäre also alle Skripte auf defer zu setzen.
Zitat von: Gunther am 05 Januar 2016, 01:03:50
Danke, das bringt mich einen kleinen Schritt weiter.
Nun sieht es wie im Anhang aus.
Meine Index (head), z. B. für 7 Zoll sieht so aus:
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="144">
<meta name="widget_base_height" content="112">
<meta name="widget_margin" content="2">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<meta name='gridster_disable' content='1'>
<link rel="stylesheet" href="/fhem/tablet07/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet07/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet07/eigenefonts/gk/style.css">
<link rel="stylesheet" href="./css/wopr.css">
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/own.css">
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet07/js/fhem-tablet-ui.js"></script>
<script type="text/javascript" src="/fhem/tablet07/js/widget_calview.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!-- -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
Meine fhem.cfg so:
# Tablet UI für 7" Tablets
define TABLETUI07 HTTPSRV ftui07/ ./www/tablet07 Tablet-UI-7
# Tablet UI für 10" Tablets
define TABLETUI10 HTTPSRV ftui10/ ./www/tablet10 Tablet-UI-10
# Tablet UI für IPhone
define TABLETUIIPHONE HTTPSRV ftuiiphone/ ./www/tabletiphone Tablet-UI-Iphone
Muss hier z. B. bei 7 Zoll nun
ftui07/ oder ftui07 stehen?
Was mache ich noch falsch?
Habe die Seiten mal in einem anderen Browser mit geleertem Cache geöffnet. Leider wird das auch nichts.
hinter ftui07
UND
hinter ./www/tablet07
also so:
define TABLETUI07 HTTPSRV ftui07/ ./www/tablet07/ Tablet-UI-7
Slash am Ende sonst gibt's Wurstsalat.
Grüße^^
Zitat von: roman1528 am 05 Januar 2016, 00:24:14
Ob HTTPSRV oder Peng. Ob ich die direkt aufrufe oder über /ftui (also mit HTTPSRV) es ist schnuppe!
Packe ich keinen Slash hinten dran bekomm ich nur gewurste aus FHEM und FTUI! Das ist Fakt.
Ich will natürlich nicht das Gewurste kommt oder gar Peng 8)
Insofern packe ich mal in meiner Beschreibung oben noch einen / hintendran als Alternative.
Zitat von: viegener am 05 Januar 2016, 01:16:20
Ich will natürlich nicht das Gewurste kommt oder gar Peng 8)
Insofern packe ich mal in meiner Beschreibung oben noch einen / hintendran als Alternative.
Alternative klingt gut.
Probieren geht über studieren.
Leute, Ihr seid super. Und das um diese Zeit!
Das / hinter dem www... hat gefehlt.
Danke Euch!
Dann geht es nun ums umbauen, oder sagen wir mal neu aufbauen für 10 Zoll.
Bin mal gespannt, ob mein Kram von vor einigen Wochen nach dem Update noch geht.
Muss ich eigentlich etwas beachten, wenn ich update und mehrere Versionen (7, 10 Zoll und Iphone) habe, oder wird das Update immer global gemacht?
Kommt es vor, dass neue css-Dateien oder ähnliches dazukommt und ich das ggf. gar nicht mitbekomme, diese aber in meine index.html-Dateien intergrieren müsste?
Zitat von: Gunther am 05 Januar 2016, 01:23:12
Leute, Ihr seid super. Und das um diese Zeit!
Das / hinter dem www... hat gefehlt.
Danke Euch!
Dann geht es nun ums umbauen, oder sagen wir mal neu aufbauen für 10 Zoll.
Bin mal gespannt, ob mein Kram von vor einigen Wochen nach dem Update noch geht.
Muss ich eigentlich etwas beachten, wenn ich update und mehrere Versionen (7, 10 Zoll und Iphone) habe, oder wird das Update immer global gemacht?
Kommt es vor, dass neue css-Dateien oder ähnliches dazukommt und ich das ggf. gar nicht mitbekomme, diese aber in meine index.html-Dateien intergrieren müsste?
Dazu kommen und integrieren müssen wäre setstate's Gebiet^^
So wie ich das sehe wird das update nur in fhem/www/tablet/ installiert. Also müsste man manuell die updates durchführen. kommt auf mich ja jetzt auch zu...
Zitat von: Gunther am 05 Januar 2016, 01:23:12
Leute, Ihr seid super. Und das um diese Zeit!
Muss ich eigentlich etwas beachten, wenn ich update und mehrere Versionen (7, 10 Zoll und Iphone) habe, oder wird das Update immer global gemacht?
Kommt es vor, dass neue css-Dateien oder ähnliches dazukommt und ich das ggf. gar nicht mitbekomme, diese aber in meine index.html-Dateien intergrieren müsste?
Es geht auch, dass man nur die eigenen Dateien in den verschiedenen tablet07/tablet10-Verzeichnissen hat. Von dort aus verwendet man dann die Dateien in ./www/tablet/...
Dazu muss natürlich in der index.html (und anderen Dateien beim Laden der javascript / js Dateien die URLs auf dem ursprünglichen Wert /fhem/tablet/... bleiben statt /fhem/tablet07/...
Dadurch hat man alle gemeinsam genutzten Dateien nur einmal, die HTML-Dateien und etwaige spezifische CSS-Dateien aber jeweils lokal und der Original-Update funktioniert auch weiterhin.
Super Idee, so werde ich das machen! Danke Dir!
Moin !
Kann man eigentlich das Fadein / Fadeout der Seiten verhindern? Sieht zwar nett aus, aber nervt auf Dauer irgendwie.
Grüße Dominik
Zitat von: moelski am 05 Januar 2016, 09:09:23
Moin !
Kann man eigentlich das Fadein / Fadeout der Seiten verhindern? Sieht zwar nett aus, aber nervt auf Dauer irgendwie.
Grüße Dominik
Statt pagetab als data-Type mal push oder pagebutton verwenden.
Hallo,
ich bekomme die HTTPSRV Definition nicht zum funktionieren.
Aufruf mit:
Zitathttps://raspberry-prod.fritz.box:8083/fhem/ftui
Zitathttps://raspberry-prod.fritz.box:8083/fhem/ftui/
bringt beides mal die Fehlermeldung:
ZitatFile not found: ./www/tablet/index.html
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet Frontendder direkte Aufruf von
Zitathttps://raspberry-prod.fritz.box:8083/fhem/www/tablet/index.html
funktioniert. Der komplette Pfad und Inhalt des Verzeichnisses auf dem RPi ist folgender:
Zitatroot@raspberry-prod:/usr/share/fhem/www/tablet# pwd
/usr/share/fhem/www/tablet
root@raspberry-prod:/usr/share/fhem/www/tablet# ls -l
total 88
drwxr-xr-x 2 root root 4096 Dec 15 20:39 Backup
drwxr-xr-x 2 fhem dialout 4096 Dec 19 18:30 css
drwxr-xr-x 2 fhem dialout 4096 Dec 12 18:44 fonts
drwxr-xr-x 2 fhem dialout 4096 Dec 15 20:22 images
-rw-r--r-- 1 fhem dialout 14033 Dec 18 06:07 index-example.html
-rw-r--r-- 1 fhem dialout 2013 Dec 20 21:50 index.html
drwxr-xr-x 2 fhem dialout 4096 Dec 15 20:23 js
drwxr-xr-x 4 fhem dialout 4096 Dec 15 20:22 lib
-rw-r--r-- 1 fhem dialout 811 Dec 15 18:55 menu.html
-rw-r--r-- 1 fhem dialout 4830 Jan 1 10:35 sub1.html
-rw-r--r-- 1 fhem dialout 17313 Jan 1 13:20 sub2.html
-rw-r--r-- 1 fhem dialout 855 Dec 15 19:01 sub3.html
-rw-r--r-- 1 fhem dialout 855 Dec 15 19:01 sub4.html
-rw-r--r-- 1 fhem dialout 855 Dec 15 19:01 sub5.html
Das Problem habe ich von Anfang an. Aufgrund der Erläuterung von viegener habe ich noch die verschiedenen "Möglichkeiten" probiert, keine führte zum Erfolg.
Wenn ich die Erläuterungen richtig gelesen habe, ist die Basis des Webservers "/usr/share/fhem". die Angabe "./www/tablet" ist bezogen auf diese Basis. Somit müsse das eigentlich passen. Vielleicht kann mir da jemand einen Tipp geben, wie ich da weiterkomme.
Viele Grüße
Achim
Zitat von: Achim am 05 Januar 2016, 14:15:51
ich bekomme die HTTPSRV Definition nicht zum funktionieren.
Das sollten wir gelöst bekommen. Ein paar Fragen und DInge die mehr Klarheit bringen sollten:
1) Läuft FHEM unter dem Benutzer fhem?
2) Ist FHEM wirklich /usr/share/fhem installiert (bei mir in /opt/fhem). Das heisst ist das Wurzelverzeichnis von FHEM wirklich /usr/share/fhem?
3) Kann es sein, dass noch alte HTTPSRV-Definitionen "herumspuken". Also mach vielleicht mal einen
list TYPE= HTTPSRV im FHEM und schaue mal ob da mehr als eine Definition ist.
4) Gibt es vielleicht FTUISRV-Definitionen? analog HTTPSRV?
5) Was passiert beim Aufruf von https://raspberry-prod.fritz.box:8083/fhem/www/tablet/sub5.html (Fehler oder Inhalt)?
Hallo,
gleich mal vorweg, Tablet UI ist super.
Hab fast alles einbinden und anpassen können.
Probleme hab ich mit der Fritz DECT200. Da kommt der Wert mit der Einheit vom Device.
Also z.B. "475.6 W". Somit ist es nicht möglich die Text-Farbe ab einem gewissen Wert zu ändern.
Folgendes hab ich in der INDEX Datei:
<div data-type="label" data-device="FBDECT_17"
data-get="power"
data-limits='["0","500","2000"]'
data-colors='["#004d1a","#cc5200","#990000"]'
class="cell big">
</div>
Da der eingelesene Wert von "power" also keine reine Zahl ist sondern das " W" dranhängt funktioniert das nicht.
Gibt es dafür eine Lösung (z.B. die letzten 2 Zeichen abschneiden)?
Ich bedanke mich für Infos.
Einen schönen Tag noch.
Gruß
Christian
Hallo,
Bei Zahl mit Einheit darf nur die Zahl im Label benutzt werden. Dafür gibt es
data-part="1"
VG
Sven
Wow, super.
Vielen Dank Sven für den Hinweis. Es funktioniert.
Gruß Christian
Hallo viegener,
Zitat2) Ist FHEM wirklich /usr/share/fhem installiert (bei mir in /opt/fhem). Das heisst ist das Wurzelverzeichnis von FHEM wirklich /usr/share/fhem?
da liegt wohl der Fehler. Mein Wurzelverzeichnis ist /etc. Meine fhem.cfg is im Verzeichnis /etc.
Zitatroot@raspberry-prod:/usr/share/fhem/www/tablet# ps aux | grep fhem
fhem 4682 11.5 23.8 46384 44124 ? S Jan04 165:03 /usr/bin/perl /usr/bin/fhem.pl /etc/fhem.cfg
root 6994 0.0 0.9 3548 1804 pts/0 S+ 16:24 0:00 grep fhem
Mit der Definition
define TABLETUI HTTPSRV ftui/ ../usr/share/fhem/www/tablet Tablet Frontendfunktioniert der Aufruf aus der fhem-Oberfläche heraus.
Wenn ich allerdings
https://raspberry-prod.fritz.box:8083/fhem/ftuidirekt als URL eingebe (ohne / als letztes Zeichen), wir die fhem-Oberfläche mit der FTUI Oberfläche überlagert. Mit "/" als letztes Zeichen geht es. Das Thema hast du gestern mit roman1528 schon hier im Thread diskutiert. Gibt es da eine Lösung?
Zitat5) Was passiert beim Aufruf von https://raspberry-prod.fritz.box:8083/fhem/www/tablet/sub5.html (Fehler oder Inhalt)?
mit dem Aufruf bekomme ich nur eine reine Textanzeige mit "Punkten" und nicht die gewünschte "Fensteranzeige"
Zitat
EXAMPLE1
EXAMPLE2
EXAMPLE3
EXAMPLE4
EXAMPLE5
Ich habe mal meine HTML Dateien von meiner Grundstruktur angehängt. Ich habe die aus einem Beispiel von hier.
Viele Grüße
Achim
Zitat von: viegener am 05 Januar 2016, 01:10:38
Ich denke warum setstate das defer aufgenommen hat, kann er vermutlich selber besser erklären.
In Deinem HTML ist aber wohl eine Mischung von Skripts die sofort ausgeführt werden und welchen die defer verwenden. Problem ein grosser Teil der Skripte setzt aufeinander auf und insbesondere das jquery.min.js ist elementar für alle widgets und auch alle anderen Skripte die jquery im Namen haben.
Eine Alternatvie wäre also alle Skripte auf defer zu setzen.
Hallo Johannes,
ich habe die index.html mal entsprechend geändert, alle ohne defer !
Der Aufruf geht generell nur so (mit / )
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UIBeim Start kommt meist eine leere Seite ausser das die 3 frames
- menu-datetime.html
- main-menu.html
- status.html
zu sehen sind, ohne Inhalt bzw. wird Datum/Uhrzeit im main-menu.html dargestellt.
in der Browsereingabe steht
http://SERVER_oder_IP:8083/fhem/ftui/Müsste da nicht die erste Seite aus der main-menu.html erscheinen?
also in meinem Fall so
http://SERVER_oder_IP:8083/fhem/ftui/subw1.htmlNach mehrmaligem strg+f5 steht dann http://SERVER_oder_IP:8083/fhem/ftui/
#subw1.html
Oft kommt es auch vor, das nach dem umschalten der SUB´s wieder die icon´s im Menü (main-menu.html) fehlen,
als ob diese nicht ordentlich geladen wird !?
Gruss
Klaus
PS. Das ist bei FireFox und Safari gleich
@Achim:
Ich würde vorschlagen dann Deine HTTPSRV-Definition ähnlich wie Du sie angelegt hast zu machen:
define TABLETUI HTTPSRV ftui /usr/share/fhem/www/tablet Tablet Frontend
Also also absoluter Pfad, damit es da keine Probleme gibt. Dann solltest Du allerdings in Deine index.html noch den kurzen Javascript-schnipsel aus meinem Post miteinzubauen (Das ist auch die von mir bevorzugte Lösung für das von Dir beschriebene Problem, dass der / nicht am Ende steht).
Du kannst auch
define TABLETUI HTTPSRV ftui/ /usr/share/fhem/www/tablet Tablet Frontend
nehmen, wenn es bei Dir funktioniert, HTTPSRV ist da inzwischen deutlich fehlertoleranter.
Gibt es einen Grund warum bei Dir FHEM (Tablet) und Konfigurationsdateien so verteilt sind?
Ok Daten und Konfiguration entsprechend zu verteilen ist ja eigentlich normal, aber für FHEM macht es manche Dinge schwieriger (abweichende Pfade bei Infos im Forum, Sichern einer kompletten FHEM-installation ist schwieriger, denn dazu gehören eigentlich auch viele anderen Dateien.
Zitat von: kvo1 am 05 Januar 2016, 16:59:16
Hallo Johannes,
ich habe die index.html mal entsprechend geändert, alle ohne defer !
Der Aufruf geht generell nur so (mit / )
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI
Beim Start kommt meist eine leere Seite ausser das die 3 frames
- menu-datetime.html
- main-menu.html
- status.html
zu sehen sind, ohne Inhalt bzw. wird Datum/Uhrzeit im main-menu.html dargestellt.
in der Browsereingabe steht http://SERVER_oder_IP:8083/fhem/ftui/
Müsste da nicht die erste Seite aus der erscheinen main-menu.html ?
also in meinem Fall so http://SERVER_oder_IP:8083/fhem/ftui/subw1.html
Nach mehrmaligem strg+f5 steht dann http://SERVER_oder_IP:8083/fhem/ftui/#subw1.html
Oft kommt es auch vor, das nach dem umschalten der SUB´s wieder die icon´s im Menü (main-menu.html) fehlen,
als ob diese nicht ordentlich geladen wird !?
Gruss
Klaus
PS. Das ist bei FireFox und Safari gleich
Hallo Klaus,
ja der URL-Aufruf ohne / am Ende also
http://SERVER_oder_IP:8083/fhem/ftui kann nur gehen, wenn in der index.html das von mir gepostete Javascript enthalten ist. Wie schon beschrieben ist HTTPSRV inzwischen fehlertoleranter, so dass Du auch mit der Definition
define TABLETUI HTTPSRV ftui/ ./www/tablet Tablet-UI arbeiten kannst, wenn es das einfacher macht.
Ich habe Deine Dateien bei mir (Windows/Firefox und Chrome) installiert und laufen lassen, Nach entfernen des defers sind die Fehlermeldungen zu unbekanntem $ im log verschwunden. Welche Plattfomr und welchen Browser verwendest Du?
Die Seite:
http://SERVER_oder_IP:8083/fhem/ftui/#subw1.htmlist auch richtig, denn eigentlich wird ja immer noch die Einstiegsseite (index.html bzw. leer) gezeigt und in dieser Seite eingebettet (#) der pagetab subw1.html. Damit ist das eigentlich aequivalent zu
http://SERVER_oder_IP:8083/fhem/ftui/index.html#subw1.htmlMainmenu und menu-datetime werden so nicht im aktuellen fenster geladen sondern vom Javascript im hintergrund. Deshalb werden diese in der Adresszeile des Browsers auch nicht angezeigt.
Ein Refresh mit F5 oder Strg-F5 deutet auf ein komplett getrenntes Problem hin (Netzwerkaussetzer / Geschwindigkeit des FHEMservers)?
Ohne Infos zu Plattform und Browser ist das aber raten
hi @all ,
ich bräuchte mal Hilfe beim einbinden eines Himematic Dimmers :
<div data-type="label" class="narrow">Wohnzimmer</div>
<div data-type="dimmer" data-device="WzDimmer" class="cell
data-get="onoff"
data-get-on="1" data-get-off="0"
data-set=""
data-set-on="on" data-set-off="off"
data-dim="pct">
</div>
Der Dimmer lässt sich über das Tablet UI schalten :-)
-wenn ich den Button drücke ( ein 100% und 0% aus ) allerdings wird der Zustand nur auf dem Tablet UI angezeigt, welches benutzt wurde ! ( iPad )
Auf dem Tablet UI auf dem iMac wird der Button nicht auf "eingeschaltet" angezeigt :-(
Die Dammstufen werden allerdings komplett richtig auf allen Endgeräten übernommen , nur der Button nicht ..... was mache ich denn da falsch ?
Das Bild im Anhang zeigt den Ausschnitt auf dem iMac ( Tablet UI ) nachdem über das iPad der Dimmer eingeschaltet wurde :-( Also es wird nur der Dimmlevel übernommen ,der eigentliche Button zeigt immer noch "aus" an .
thx
Aladin212
Ich häng mich mal an die Frage vopn Aladin222 dran.
Ist bei mir auch so.
Wird mit pct geschaltet (set xxx pct yyy) wird der Prozentwert angezeigt, der Button bleib aus.
Bei set xxx on geht der Button an und der Prozentwert 100 wird angezeigt.
schau mal hier: http://forum.fhem.de/index.php/topic,34233.msg382280.html#msg382280
gruss
andre
Zitat von: justme1968 am 05 Januar 2016, 18:02:17
schau mal hier: http://forum.fhem.de/index.php/topic,34233.msg382280.html#msg382280
gruss
andre
leider nein.
data-pct kannte ich nicht, aber wenn ich es anstelle von data-dim verwende, wird eine 1 angezeigt, egal wie hoch der Dim-Level ist... und Button bleibt grau...
EDIT:
das mit der 1 nehme ich zurück, da habe ich was verhauen...
Hallo viegner,
ich habe deinen Javascript Code in meine index.html eingebaut. Funktioniert jetzt mit/ohne "/".
Ich habe auch meine fhem.cfg in das /usr/share/fhem Verzeichnis verschoben und die fhem Startdatei in /etc/init.d angepasst. Das die fhem.cfg im /etc Verzeichnis ist, kommt von einem Image, das ich als Grundlage für meine Installation verwendet habe.
Was nicht funktioniert, ist die relative Pfadangabe in der HTTPSRV Definition. Der Ausgangspunkt ist immer noch /etc. Warum auch immer. (Neustart RPi, Kontrolle ob fhem.cfg auch aus /usr/share/fhem verwendet wird, keine Eintrag über /etc in der fhem.cfg,... ) Ich habe jetzt den absoluten Pfad in der HTTPSRV Definition gelassen.
Vielen Dank für deine Hilfe
Viele Grüße
Achim
@Achim: KLingt gut.
Das mit dem absoluten/relativen Pfad ist strange, allerdings ist mir auch nicht klar, warum die Dateien so verteilt sind.
Hi Johannes,
ZitatEin Refresh mit F5 oder Strg-F5 deutet auf ein komplett getrenntes Problem hin (Netzwerkaussetzer / Geschwindigkeit des FHEMservers)?
Ohne Infos zu Plattform und Browser ist das aber raten
ich nutze Windows 7 Enterprice und Firefox ESR 38.5.1
Habe es aber auch mal mit Firefox 43.0.2 getestet.
Ich bekomme einfach keine "saubere" Anzeige hin !
Werde jetzt mal Chrome installieren
vg und danke für deine Hilfe/Geduld
klaus
Hallo,
ich möchte meine Instar-IP-Kameras über iframe einbinden, aber irgendwie bekomme ich immer einen Fehler, obwohl die URLs direkt im Browser funktionieren. Habe es auch schon mit und ohne data-fill probiert...
Jemand eine Idee, woran das liegen könnte?
<li data-row="1" data-col="2" data-sizex="7" data-sizey="5">
<header>Ipcams</header>
<div data-type="iframe" data-src="http://192.168.1.xxx:80/cgi-bin/hi3510/mjpegstream.cgi?-chn=13&-usr=xxx&-pwd=xxx" data-fill="yes"></div>
<div data-type="label">Ipcam Haustür</div>
<div data-type="iframe" data-src="http://192.168.1.xxx:80/cgi-bin/hi3510/mjpegstream.cgi?-chn=13&-usr=xxx&-pwd=xxx" data-fill="yes"></div>
<div data-type="label">Ipcam Terasse</div>
</li>
Update: gelöst auf basis des javascript codes auf den webseiten von instar...
Zitat von: kvo1 am 05 Januar 2016, 20:46:20
ich nutze Windows 7 Enterprice und Firefox ESR 38.5.1
Habe es aber auch mal mit Firefox 43.0.2 getestet.
Ich befürchte das ist nicht das Problem (bei mir ist es auch Windows 7 prof bzw. ultimate und Firefox zwischendurch sicher auch 43.0.2)
Also liegt es möglicherweise an etwas anderem --> Greifst Du übers lokale Netz zu / was ist die Plattform (ist der vielleicht überlastet)?
Hast Du dasselbe Problem bei der index-example.html
Johannes
Hallo Johannes,
ZitatAlso liegt es möglicherweise an etwas anderem --> Greifst Du übers lokale Netz zu / was ist die Plattform (ist der vielleicht überlastet)?
Hast Du dasselbe Problem bei der index-example.html
Ja der Zugriff erfolgt über das lokale Netzwerk, also per LAN am gleichen Switch !
Als Plattform habe einen CUBIE und testweise einen RPI2 ! Das die damit überlastet sind kann ich mir nicht wirklich vorstellen.
Ich habe sogar noch einen RPI1 (Optolink Adapter für Viessmann) und dort mal Deiner Demo (vom Mai 2015) draufgespielt und das läuft.
Werde das mal schrittweise neu angehen (müssen) :'(
ich melde mich wieder !
Danke
klaus
Zitat von: kvo1 am 05 Januar 2016, 22:54:15
Als Plattform habe einen CUBIE und testweise einen RPI2 ! Das die damit überlastet sind kann ich mir nicht wirklich vorstellen.
Ich habe sogar noch einen RPI1 (Optolink Adapter für Viessmann) und dort mal Deiner Demo (vom Mai 2015) draufgespielt und das läuft.
OK, macht Sinn. Ich glaube auch nicht, dass die überfordert sind ;)
Wenn andere UIs gehen, würde ich in Firefox Firebug installieren und im Detail nach (möglichen) Problemen Ausschau halten.
Hallo,
ich bin schon länger am Probieren und habe schon einiges hin bekommen wie ich finde. Nun habe ich allerdings ein Problem mit der Ausrichtung einiger Elemente. hänge mal meine main.html hier rein .
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* main page
*
load this page via widget pagetab
<div data-type="pagetab" data-url="index_main.html" data-icon="fa-home" class="cell"></div>
-->
<!-- script type="text/javascript" src="/fhem/tablet/js/widget_circlemenu.js"></script -->
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="menu.html"></li>
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header>BAD</header>
<div data-type="thermostat" data-device="Heizung_Bad" data-valve="actuator" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top">
<div data-type="symbol" data-device="Fenster_Bad" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Heizung_Bad" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="1" data-col="5" data-sizex="3" data-sizey="2">
<header>SCHLAFZIMMER</header>
<div data-type="thermostat" data-device="Heiz_Schla_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top">
<div data-type="symbol" data-device="Fenster_Schlafzimmer" data-get="open" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Thermo_Schlaf_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="1" data-col="8" data-sizex="5" data-sizey="2">
<header>KINDERZIMMER</header>
<div data-type="thermostat" data-device="Heiz_Kinder_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top left-space">
<div class="cell top-space left">
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half" data-circle-radius="90" data-item-diameter="50">
<ul class="menu">
<li class="circleborder"><div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='Jalousie_Kinderzimmer'
data-background-icon="fa-wrench"></div>
</li>
<li><div data-type="push"
data-device="Jalousie_Kinderzimmer"
data-cmd="set"
data-set-on="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set-on="75"
data-cmd="set"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set-on="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set-on="off"
data-icon="">zu</div></li>
</ul>
</div>
<div data-type="label" class="narrow darker small">Rollade</div>
</div>
<div class="container top left">
<div data-type="symbol" data-device="Fenster_Kinderzimmer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Thermo_Kinder_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
<div class="cell top left">
<div data-type="slider"
data-device='Dim_Kinder'
data-get="level"
data-min="0"
data-max="100"
data-on="on"
data-off="off"
data-height="85">
</div>
<div data-type="label" class="darker small">Dimmer</div>
</div>
</div>
</li>
<li data-row="4" data-col="5" data-sizex="3" data-sizey="2">
<header>Wohnkueche</header>
<div data-type="thermostat" data-device="Heiz_Wohn_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div calss="top-space right">
<div data-type="switch" class=""
data-device="Zwi_Steck_Wohn"
data-get-on="on"
data-get-off="off"></div>
<div data-type="label" data-device="Thermo_Wohn_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="4" data-col="2" data-sizex="4" data-sizey="2">
<header>Buegelzimmer</header>
<div data-type="thermostat" data-device="Heiz_Buegel_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="inline top-space">
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half" data-circle-radius="90" data-item-diameter="50">
<ul class="menu">
<li class="circleborder">
<div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='Jalousie_Buegelzimmer'
data-background-icon="fa-wrench">
</div>
</li>
<li><div data-type="push"
data-device="Jalousie_Buegelzimmer"
data-cmd="set"
data-set-on="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set-on="75"
data-cmd="set"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set-on="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set-on="off"
data-icon="">zu</div></li>
</ul>
</div>
<div data-type="label" class="narrow darker small">Rollade</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Fenster_Buegelzimmer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="switch" data-device="Zwi_Steck_Buegel" data-get-pn="on" data-get-off="off" class="cell"></div>
</div>
</li>
<li data-row="4" data-col="8" data-sizex="5" data-sizey="2">
<header>Flur</header>
<div data-type="thermostat" data-device="Heiz_Flur_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="col-2-1">
<div class="col-2-1">
<div data-type="switch" class="cell" data-device="Zwi_Steck_Flur" data-get-on="on" data-get-off="off"></div>
<div class="">
<div data-type="symbol" data-icon="ftui-door" data-device="Status_Haustuer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Haustür</div>
</div>
</div>
<div class="col-2-1">
<div class="cell" data-type="multistatebutton"
data-device="Haustuer"
data-get-on='["locked","unlocked"]'
data-icons='["fa-lock", "fa-unlock"]'
data-colors='["red", "green"]'
data-set='["unlock", "lock"]'
></div>
<div class="" data-type="push" data-device="Haustuer"
data-icon="ftui-door" data-background-icon="fa-square-o"
data-set-on="open" data-get-on="open" data-on-color="#aa6900">
</div>
</div>
</div>
</li>
<li data-row="6" data-col="2" data-sizex="4" data-sizey="2">
<header>Garagen</header>
<div class="triplebox-h">
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Roland_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Roland</div>
</div>
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Ingo_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Ingo</div>
</div>
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Opa_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Opa</div>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>
Wie man auf dem Bild sehen kann sind im Flur ein Switch und ein Label so angeordnet wie ich es haben möchte. Jetzt sollen der Multistatebutton und das Push Widget genau so rechts neben dem Switch und dem Label angeordnet sein.
Bin da schon seid 2 Tagen dran und habe einiges ausprobiert aber ich bekomme es nicht so hin wie es sein soll. Kann mir da vielleicht mal jemand auf die Sprünge helfen?
Und das 2. Problem das Label Dimmer im Kinderzimmer steht nicht genau unter dem Slider. Kann man das auch anpassen?
Danke im voraus Roland
Zitat von: Roli1606 am 06 Januar 2016, 01:15:07
Hallo,
ich bin schon länger am Probieren und habe schon einiges hin bekommen wie ich finde. Nun habe ich allerdings ein Problem mit der Ausrichtung einiger Elemente. hänge mal meine main.html hier rein .
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* main page
*
load this page via widget pagetab
<div data-type="pagetab" data-url="index_main.html" data-icon="fa-home" class="cell"></div>
-->
<!-- script type="text/javascript" src="/fhem/tablet/js/widget_circlemenu.js"></script -->
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="menu.html"></li>
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header>BAD</header>
<div data-type="thermostat" data-device="Heizung_Bad" data-valve="actuator" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top">
<div data-type="symbol" data-device="Fenster_Bad" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Heizung_Bad" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="1" data-col="5" data-sizex="3" data-sizey="2">
<header>SCHLAFZIMMER</header>
<div data-type="thermostat" data-device="Heiz_Schla_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top">
<div data-type="symbol" data-device="Fenster_Schlafzimmer" data-get="open" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Thermo_Schlaf_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="1" data-col="8" data-sizex="5" data-sizey="2">
<header>KINDERZIMMER</header>
<div data-type="thermostat" data-device="Heiz_Kinder_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top left-space">
<div class="cell top-space left">
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half" data-circle-radius="90" data-item-diameter="50">
<ul class="menu">
<li class="circleborder"><div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='Jalousie_Kinderzimmer'
data-background-icon="fa-wrench"></div>
</li>
<li><div data-type="push"
data-device="Jalousie_Kinderzimmer"
data-cmd="set"
data-set-on="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set-on="75"
data-cmd="set"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set-on="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set-on="off"
data-icon="">zu</div></li>
</ul>
</div>
<div data-type="label" class="narrow darker small">Rollade</div>
</div>
<div class="container top left">
<div data-type="symbol" data-device="Fenster_Kinderzimmer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Thermo_Kinder_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
<div class="cell top left">
<div data-type="slider"
data-device='Dim_Kinder'
data-get="level"
data-min="0"
data-max="100"
data-on="on"
data-off="off"
data-height="85">
</div>
<div data-type="label" class="darker small">Dimmer</div>
</div>
</div>
</li>
<li data-row="4" data-col="5" data-sizex="3" data-sizey="2">
<header>Wohnkueche</header>
<div data-type="thermostat" data-device="Heiz_Wohn_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div calss="top-space right">
<div data-type="switch" class=""
data-device="Zwi_Steck_Wohn"
data-get-on="on"
data-get-off="off"></div>
<div data-type="label" data-device="Thermo_Wohn_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="4" data-col="2" data-sizex="4" data-sizey="2">
<header>Buegelzimmer</header>
<div data-type="thermostat" data-device="Heiz_Buegel_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="inline top-space">
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half" data-circle-radius="90" data-item-diameter="50">
<ul class="menu">
<li class="circleborder">
<div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='Jalousie_Buegelzimmer'
data-background-icon="fa-wrench">
</div>
</li>
<li><div data-type="push"
data-device="Jalousie_Buegelzimmer"
data-cmd="set"
data-set-on="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set-on="75"
data-cmd="set"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set-on="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set-on="off"
data-icon="">zu</div></li>
</ul>
</div>
<div data-type="label" class="narrow darker small">Rollade</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Fenster_Buegelzimmer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="switch" data-device="Zwi_Steck_Buegel" data-get-pn="on" data-get-off="off" class="cell"></div>
</div>
</li>
<li data-row="4" data-col="8" data-sizex="5" data-sizey="2">
<header>Flur</header>
<div data-type="thermostat" data-device="Heiz_Flur_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="col-2-1">
<div class="col-2-1">
<div data-type="switch" class="cell" data-device="Zwi_Steck_Flur" data-get-on="on" data-get-off="off"></div>
<div class="">
<div data-type="symbol" data-icon="ftui-door" data-device="Status_Haustuer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Haustür</div>
</div>
</div>
<div class="col-2-1">
<div class="cell" data-type="multistatebutton"
data-device="Haustuer"
data-get-on='["locked","unlocked"]'
data-icons='["fa-lock", "fa-unlock"]'
data-colors='["red", "green"]'
data-set='["unlock", "lock"]'
></div>
<div class="" data-type="push" data-device="Haustuer"
data-icon="ftui-door" data-background-icon="fa-square-o"
data-set-on="open" data-get-on="open" data-on-color="#aa6900">
</div>
</div>
</div>
</li>
<li data-row="6" data-col="2" data-sizex="4" data-sizey="2">
<header>Garagen</header>
<div class="triplebox-h">
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Roland_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Roland</div>
</div>
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Ingo_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Ingo</div>
</div>
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Opa_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Opa</div>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>
Wie man auf dem Bild sehen kann sind im Flur ein Switch und ein Label so angeordnet wie ich es haben möchte. Jetzt sollen der Multistatebutton und das Push Widget genau so rechts neben dem Switch und dem Label angeordnet sein.
Bin da schon seid 2 Tagen dran und habe einiges ausprobiert aber ich bekomme es nicht so hin wie es sein soll. Kann mir da vielleicht mal jemand auf die Sprünge helfen?
Und das 2. Problem das Label Dimmer im Kinderzimmer steht nicht genau unter dem Slider. Kann man das auch anpassen?
Danke im voraus Roland
Ich bin das gerade am testen... ich habe da keine erklärung für... normales verhalten von <div> ist die anordnung untereinander. warum die sich jetzt allerdings nebeneinander anordnen.... keine ahnung...
ich bleibe da auf jeden fall dran...
schau dir mal bitte das switch-widget an, damit kannst du auch multi-states nachbilden... statt multibutton.
grüße^^
Hallo,
wenn ich die desired-temp über andere Wege als die thermostat widget ändere, ändert sich die Anzeige der desired-temp im thermostat widget nicht. Ist das ein Bug oder muss ich noch irgendetwas dazu einstellen?
Zitat von: FhemPiUser am 06 Januar 2016, 11:47:56
Hallo,
wenn ich die desired-temp über andere Wege als die thermostat widget ändere, ändert sich die Anzeige der desired-temp im thermostat widget nicht. Ist das ein Bug oder muss ich noch irgendetwas dazu einstellen?
longpoll probleme^^ seite aktualisieren... dann sollte er das richtige anzeigen.
oder zum testen shortpoll aktivieren:
<meta name="longpoll" content="0"> <!-- 1=longpoll;0=shortpoll every 30sec -->
und kurz warten
Grüße^^
Zitat von: Roli1606 am 06 Januar 2016, 01:15:07
Hallo,
ich bin schon länger am Probieren und habe schon einiges hin bekommen wie ich finde. Nun habe ich allerdings ein Problem mit der Ausrichtung einiger Elemente. hänge mal meine main.html hier rein .
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* main page
*
load this page via widget pagetab
<div data-type="pagetab" data-url="index_main.html" data-icon="fa-home" class="cell"></div>
-->
<!-- script type="text/javascript" src="/fhem/tablet/js/widget_circlemenu.js"></script -->
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="9" data-template="menu.html"></li>
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header>BAD</header>
<div data-type="thermostat" data-device="Heizung_Bad" data-valve="actuator" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top">
<div data-type="symbol" data-device="Fenster_Bad" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Heizung_Bad" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="1" data-col="5" data-sizex="3" data-sizey="2">
<header>SCHLAFZIMMER</header>
<div data-type="thermostat" data-device="Heiz_Schla_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top">
<div data-type="symbol" data-device="Fenster_Schlafzimmer" data-get="open" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Thermo_Schlaf_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="1" data-col="8" data-sizex="5" data-sizey="2">
<header>KINDERZIMMER</header>
<div data-type="thermostat" data-device="Heiz_Kinder_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="top left-space">
<div class="cell top-space left">
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half" data-circle-radius="90" data-item-diameter="50">
<ul class="menu">
<li class="circleborder"><div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='Jalousie_Kinderzimmer'
data-background-icon="fa-wrench"></div>
</li>
<li><div data-type="push"
data-device="Jalousie_Kinderzimmer"
data-cmd="set"
data-set-on="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set-on="75"
data-cmd="set"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set="pct"
data-set-on="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Kinderzimmer"
data-set-on="off"
data-icon="">zu</div></li>
</ul>
</div>
<div data-type="label" class="narrow darker small">Rollade</div>
</div>
<div class="container top left">
<div data-type="symbol" data-device="Fenster_Kinderzimmer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="label" data-device="Thermo_Kinder_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
<div class="cell top left">
<div data-type="slider"
data-device='Dim_Kinder'
data-get="level"
data-min="0"
data-max="100"
data-on="on"
data-off="off"
data-height="85">
</div>
<div data-type="label" class="darker small">Dimmer</div>
</div>
</div>
</li>
<li data-row="4" data-col="5" data-sizex="3" data-sizey="2">
<header>Wohnkueche</header>
<div data-type="thermostat" data-device="Heiz_Wohn_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div calss="top-space right">
<div data-type="switch" class=""
data-device="Zwi_Steck_Wohn"
data-get-on="on"
data-get-off="off"></div>
<div data-type="label" data-device="Thermo_Wohn_Climate" data-get="humidity" data-unit="%" class="top-space-2x big"></div>
</div>
</li>
<li data-row="4" data-col="2" data-sizex="4" data-sizey="2">
<header>Buegelzimmer</header>
<div data-type="thermostat" data-device="Heiz_Buegel_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="inline top-space">
<div data-type="circlemenu" class="cell circlemenu" data-direction="bottom-half" data-circle-radius="90" data-item-diameter="50">
<ul class="menu">
<li class="circleborder">
<div data-type="label"
data-limits='["0|off","[12]*[0-9]","[34][0-9]","[56][0-9]","[78][0-9]","([9][0-9]|100|on)"]'
data-colors='["#FFFFFF","#666666","#999999","#BBBBBB","#DDDDDD","#FFFFFF"]'
data-device='Jalousie_Buegelzimmer'
data-background-icon="fa-wrench">
</div>
</li>
<li><div data-type="push"
data-device="Jalousie_Buegelzimmer"
data-cmd="set"
data-set-on="on"
data-icon="">auf</div></li>
<li><div data-type="push"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set-on="75"
data-cmd="set"
data-icon="">75</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set="50"
data-icon="">50</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set="pct"
data-set-on="25"
data-icon="">25</div></li>
<li><div data-type="push"
data-cmd="set"
data-device="Jalousie_Buegelzimmer"
data-set-on="off"
data-icon="">zu</div></li>
</ul>
</div>
<div data-type="label" class="narrow darker small">Rollade</div>
</div>
<div class="inline">
<div data-type="symbol" data-device="Fenster_Buegelzimmer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Fenster</div>
<div data-type="switch" data-device="Zwi_Steck_Buegel" data-get-pn="on" data-get-off="off" class="cell"></div>
</div>
</li>
<li data-row="4" data-col="8" data-sizex="5" data-sizey="2">
<header>Flur</header>
<div data-type="thermostat" data-device="Heiz_Flur_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class="cell left left-space"></div>
<div class="col-2-1">
<div class="col-2-1">
<div data-type="switch" class="cell" data-device="Zwi_Steck_Flur" data-get-on="on" data-get-off="off"></div>
<div class="">
<div data-type="symbol" data-icon="ftui-door" data-device="Status_Haustuer" class="narrow big"></div>
<div data-type="label" class="narrow darker small">Haustür</div>
</div>
</div>
<div class="col-2-1">
<div class="cell" data-type="multistatebutton"
data-device="Haustuer"
data-get-on='["locked","unlocked"]'
data-icons='["fa-lock", "fa-unlock"]'
data-colors='["red", "green"]'
data-set='["unlock", "lock"]'
></div>
<div class="" data-type="push" data-device="Haustuer"
data-icon="ftui-door" data-background-icon="fa-square-o"
data-set-on="open" data-get-on="open" data-on-color="#aa6900">
</div>
</div>
</div>
</li>
<li data-row="6" data-col="2" data-sizex="4" data-sizey="2">
<header>Garagen</header>
<div class="triplebox-h">
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Roland_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Roland</div>
</div>
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Ingo_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Ingo</div>
</div>
<div class="inline">
<div data-type="switch" data-device="Garagen_dm_Tor_Opa_Taster_tr"
data-icon="oa-fts_garage" data-background-icon="fa-square-o"
data-set-on="auf" data-set-off="zu" data-get-on="auf" data-get-off="zu" data-on-color="#aa6900" data-off-color="#505050">
</div>
<div data-type="label" class="narrow darker">Garage</div>
<div data-type="label" class="top-space darker">Opa</div>
</div>
</div>
</li>
</ul>
</div>
</body>
</html>
Wie man auf dem Bild sehen kann sind im Flur ein Switch und ein Label so angeordnet wie ich es haben möchte. Jetzt sollen der Multistatebutton und das Push Widget genau so rechts neben dem Switch und dem Label angeordnet sein.
Bin da schon seid 2 Tagen dran und habe einiges ausprobiert aber ich bekomme es nicht so hin wie es sein soll. Kann mir da vielleicht mal jemand auf die Sprünge helfen?
Und das 2. Problem das Label Dimmer im Kinderzimmer steht nicht genau unter dem Slider. Kann man das auch anpassen?
Danke im voraus Roland
Das war echt nicht einfach!!! Aber wenn man die Tricks kennt.
Wie schon im VorPost gesagt haben die <div>'s in der Kombination ein ganz komisches Verhalten.... aber es geht... hoffentlich auch noch bei dir!
<li data-row="4" data-col="8" data-sizex="5" data-sizey="2">
<header>Flur</header>
<div class="top-space inline">
<div data-type="thermostat" data-device="Heiz_Flur_Clima" data-valve="ValvePosition" data-get="desired-temp" data-temp="measured-temp" class=""></div>
</div>
<div class="inline left-space-2">
<div class="">
<div data-type="switch" class="cell inline" data-device="Zwi_Steck_Flur" data-get-on="on" data-get-off="off"></div>
<div class="cell inline" data-type="switch"
data-device="Haustuer"
data-get=""
data-set=""
data-states='["locked","unlocked"]'
data-icons='["fa-lock", "fa-unlock"]'
data-colors='["red", "green"]'>
</div>
</div>
<div class="top-space">
<div data-type="symbol"
data-icon="ftui-door"
data-device="Status_Haustuer"
class="cell inline">
</div>
<div class="cell inline" data-type="push"
data-device="Haustuer"
data-set=""
data-icon="ftui-door"
data-background-icon="fa-square-o"
data-set-on="open"
data-get-on="open"
data-on-color="#aa6900">
</div>
</div>
<div data-type="label" class="darker small left"> Haustür</div>
</div>
</li>Grüße^^
EDIT:Eine Möglichkeit wäre auch noch das ganze in eine Tabelle zu verpacken^^
Erst einmal vielen Dank für das FTUI und die vielen Beispiele und Demos der Benutzer hier im Forum!
Ihr habt mich echt eine Menge Schlaf gekostet die letzten Wochen ;)
Nachdem ich nun schon mindestens 3x alles verworfen habe und neu angefangen (dank der Inspirationen hier) möchte ich nun auch schon mal ein paar Bilder preisgeben vom ersten Wurf. Ob es so bleiben wird oder mir dann doch wieder was anderes in den Kopf kommen wird, das kann ich allerdings noch nicht genau sagen :D
Zitat von: waschbaerbauch am 07 Januar 2016, 11:02:24
Erst einmal vielen Dank für das FTUI und die vielen Beispiele und Demos der Benutzer hier im Forum!
Ihr habt mich echt eine Menge Schlaf gekostet die letzten Wochen ;)
Nachdem ich nun schon mindestens 3x alles verworfen habe und neu angefangen (dank der Inspirationen hier) möchte ich nun auch schon mal ein paar Bilder preisgeben vom ersten Wurf. Ob es so bleiben wird oder mir dann doch wieder was anderes in den Kopf kommen wird, das kann ich allerdings noch nicht genau sagen :D
Schicke MiLight/Hue Umsetzung :P :P :P :P ;D
Ja das dachte ich mir auch, nachdem ich es vorher anders gelöst hatte :D
Da kam ein roman1528 daher und hat mein bisheriges Konstrukt wieder umgeworfen ;)
Im Ernst: Deine Umsetzung hat mir so gut gefallen, das ich sie natürlich sofort ausgetauscht habe!
PS: Müll und DWD werde ich dir bestimmt auch noch abkupfern :P
@roman1528 Herzlichen dank jetzt sieht es richtig aus
Gruß Roland
hallo,
darf ich mal fragen wie Ihr bei milight den Farbbutton gelöst habt?
Ich versuche auch meine LED's über WEBUI farblich zu steuern. Hab aber noch keinen Plan wie....
Danke.
Gruß
Hermann
@hermann1514
Das hat der roman so gelöst:
<li class="halbTransparent" data-row="1" data-col="4" data-sizex="2" data-sizey="3">
<header>Arbeitsplatz</header>
<div class="top-space centered">
<div class="inline">
<div class="inline top-space">
<div data-type="switch"
data-device="MB02.Z3"
data-get="state"
data-get-on="on.*"
data-get-off="off"
data-set=""
data-set-on="on"
data-set-off="off"
data-icon="oa-light_led_stripe_rgb"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">An/Aus
</div>
</div>
<div class="inline top-space">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="FFFFFF"
data-icon="oa-light_led_stripe_rgb"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">Weiß
</div>
</div>
<div class="top-space">
<div data-type="popup"
data-height="400px"
data-width="700px"
class="">
<div data-type="push"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">Farbe
</div>
<div class="dialog dialogTransparent">
<header class="dialogheaderTransparent">Arbeitsplatz - Farbe</header>
<div class="top-space">
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="FF0000"
data-off-color="#FF0000"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">ROT</div>
</div>
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="00FF00"
data-off-color="#00FF00"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">GRÜN
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="4C00FF"
data-off-color="#0000FF"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">BLAU
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="FFFF00"
data-off-color="#FFFF00"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">GELB
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="00FFFF"
data-off-color="#00FFFF"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">TÜRKIS
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="FF00FF"
data-off-color="#FF00FF"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">PINK
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="MB02.Z3"
data-set="rgb"
data-set-on="FFFFFF"
data-off-color="#FFFFFF"
data-icon="fa-paint-brush"
class="bigger">
</div>
<div data-type="label"
class="cell narrow">WEIß
</div>
</div>
<div data-type="volume"
data-device="MB02.Z3"
data-get="hue"
data-set="hue"
data-min="0"
data-max="340"
class="cell hue-tick hue-front big top-space-2">
</div>
</div>
</div>
</div>
</div>
<div class="top-space-3">
<div data-type="volume"
data-device="MB02.Z3"
data-get="brightness"
data-set="brightness"
data-min="0"
data-max="100"
data-tickstep="6"
class="cell dim-tick dim-front">
</div>
</div>
</div>
</li>
Danke.... :D :D
Werde es mal testen.
Gruß
Hermann
Sehr sehr schön.
Tut euch keinen Zwang an... Dafür hab ich's online gestellt...
Der Link jetzt auch in meiner Signatur!!!
Hallo zusammen,
ich bin heute über die Tablet-UI gestolpert und finde die Möglichkeiten, die sich damit auftun großartig.
Ich habe keine Erfahrungen mit Tablets und Frontends, aber ich würde gerne erfahren, ob sich mit dieser Sache auch meine Vorstellungen umsetzen lassen.
Ich benötige eine Art stationäres "Terminal", welches mir im Schlafzimmer diverse Infos auf dem Screen darstellt und an dem ich Einstellungen (Wecker, Sleep-Timer, Radioprogramm) ändern kann. Ein Sonos System ist bereits in fhem integriert.
Im Nachtmodus soll der Großteil des Displays eine Uhr anzeigen. Zusätzlich möchte ich die aktuelle Weckzeit (Sonos), den laufenden Radiosender und die Restzeit des Sleep-Timers darstellen.
Meine Befürchtung ist aber, dass die Hintergrundbeleuchtung der Tablets zu hell ist und den Schlafraum zu stark ausleuchtet. Ich bin mir nicht sicher, ob man diesen Effekt durch ein hochwertiges OLED-Display ohne Hintergrundbeleuchtung und dunkelen Anzeigefarben (dunkelblau, dunkelrot) abstellen kann. Die Frage ist auch, ob der Browser der dann auf dem Tablet läuft immer im Vordergrund bleibt.
Ich weiß, das sind sehr allgemeine Fragen, aber ich hoffe, dass irgendjemand dieses Frontend in ähnlicher Weise einsetzt und mir seine Erfahrungen diesbezüglich schildern kann.
Danke und Gruß,
Spartacus
Hallo,
wie kann ich einen Stream meiner Kamera im Tablet UI darstellen ?
Diese URL stellt meinen Stream dar : http://192.168.1.168/goform/stream?cmd=get&channel=0
Leider gehts mit einem iframe nicht.
<li data-row="1" data-col="1" data-sizex="6" data-sizey="6">
<header>GARTENTOR</header>
<div data-type="iframe" data-src="http://192.168.1.168/goform/stream?cmd=get&channel=0"></div>
</li>
Als Server dient der Grandstream GXV3504.
Jemand ne Idee ?
Danke
Joe
<li data-row="1" data-col="1" data-sizex="6" data-sizey="6">
<header>GARTENTOR</header>
<img src="http://192.168.1.168/goform/stream?cmd=get&channel=0" height="90%" wight="100%" border="0"></img src>
</li>
Probier es mal so..
Zitat von: Spartacus am 07 Januar 2016, 16:47:35
Hallo zusammen,
Moin
Zitat
Im Nachtmodus soll der Großteil des Displays eine Uhr anzeigen. Zusätzlich möchte ich die aktuelle Weckzeit (Sonos), den laufenden Radiosender und die Restzeit des Sleep-Timers darstellen.
Jap geht. Irgendjemand hat sowas wie einen Screensaver für die Tablet-UI entwickelt.
Zitat
Meine Befürchtung ist aber, dass die Hintergrundbeleuchtung der Tablets zu hell ist und den Schlafraum zu stark ausleuchtet. Ich bin mir nicht sicher, ob man diesen Effekt durch ein hochwertiges OLED-Display ohne Hintergrundbeleuchtung und dunkelen Anzeigefarben (dunkelblau, dunkelrot) abstellen kann. Die Frage ist auch, ob der Browser der dann auf dem Tablet läuft immer im Vordergrund bleibt.
Nich fürchten. Probieren... WebViewControl für Android (Eine Entwicklung für FHEM). Ein Fullscreenbrowser der es erlaubt Grundfunktionen wie z.B. die Helligkeit über FHEM zu steuern. + dunkle Farben. Alles schick.
Ein etwas qualitatives Tablet kann da natürlich auch weiterhelfen, da sich die Hintergrundbeleuchtung präziser einstellen lässt. Ansonsten Netzteil dran und in den Einstellungen die Entwicklungsoptionen aktivieren. Genau "Wach bleiben". Mein Tablet dimmt dann nach einer Zeit auf minimum und dimmt wieder hoch wenn ich es berühre.
Zitat
Ich weiß, das sind sehr allgemeine Fragen, aber ich hoffe, dass irgendjemand dieses Frontend in ähnlicher Weise einsetzt und mir seine Erfahrungen diesbezüglich schildern kann.
Jap... und jap... habe viel Zeit und beantworte gern qualifizierte Fragen 8)
Zitat
Danke und Gruß,
Spartacus
Bitte.
Grüße^^
Zitat von: waschbaerbauch am 07 Januar 2016, 17:52:00
<li data-row="1" data-col="1" data-sizex="6" data-sizey="6">
<header>GARTENTOR</header>
<img src="http://192.168.1.168/goform/stream?cmd=get&channel=0" height="90%" wight="100%" border="0"></img src>
</li>
Probier es mal so..
Cool... einen <img> Tag schließen... hab ich auch noch nicht gesehen. Ist das HTML5 standard geworden? ;D
Keine Ahnung - bin ich HTML Papst? :D
Wenn ich ein Glas Nutella öffne, dann mach ich es nach Gebrauch immer wieder zu ;)
PS: Getrieben durch den Sarkasmus *g* hab ich noch google gefragt - muss man nicht und man kann es wohl eher so machen, also rein optional:
<li data-row="1" data-col="1" data-sizex="6" data-sizey="6">
<header>GARTENTOR</header>
<img src="http://192.168.1.168/goform/stream?cmd=get&channel=0" height="90%" wight="100%" border="0" />
</li>
Zitat von: waschbaerbauch am 07 Januar 2016, 17:55:56
Keine Ahnung - bin ich HTML Papst? :D
Wenn ich ein Glas Nutella öffne, dann mach ich es nach Gebrauch immer wieder zu ;)
Gut... mach ich auch so... aber nicht bei <img> Tags... unnötig. Also nur:
<img src="http://und.so.weiter.jpg.oder.was.auch.immer" alt="eine Kurze Beschreibung oder Schlüsselwort" title="Wer es mag">ohne alt und title auch ok... weil man hier ja bilder oder ähnliches einfügt die definitiv da sind.
Grüße^^
Genau - ich lerne immer gern dazu! :)
Hallo roman1528,
vielen Dank. Probieren ist so ne Sache! Dazu muss ich mir erst so ein Tablet anschaffen. Und da hätte ich gerne vorher gewusst, wie sich ein OLED-Tab (ohne Hintergrundbeleuchtung) im Nachtmodus macht!
Aber wenn niemand so ein Dingen hat, dann kann natürlich auch niemand seine Erfahrungen posten ;).
Dann guck ich erst mal nach einem passenden Gerät!
Danke,
Christian
Zitat von: Spartacus am 07 Januar 2016, 18:11:14
Dann guck ich erst mal nach einem passenden Gerät!
... oder wartest noch ein zwei Tage um denen, die heute noch nicht hier waren, die Gelegenheit zu einer Antwort zu geben ;)
Hallo,
Zitat von: waschbaerbauch am 07 Januar 2016, 17:55:56
Keine Ahnung - bin ich HTML Papst? :D
Wenn ich ein Glas Nutella öffne, dann mach ich es nach Gebrauch immer wieder zu ;)
PS: Getrieben durch den Sarkasmus *g* hab ich noch google gefragt - muss man nicht und man kann es wohl eher so machen, also rein optional:
<li data-row="1" data-col="1" data-sizex="6" data-sizey="6">
<header>GARTENTOR</header>
<img src="http://192.168.1.168/goform/stream?cmd=get&channel=0" height="90%" wight="100%" border="0" />
</li>
So funktioniert es mittlerweile. Mit netten runden Ecken und einem Link, wenn man drauf clickt ...
<a href="http://192.168.1.150:8090/fhem/ftui/cameras_stream.html" target="_top"><img src=http://192.168.1.168/goform/stream?cmd=get&channel=4
width="92%" alt="Tor" style="-webkit-border-radius: 10px;"></a>Leider nur in CHROME und NICHT in WebViewControl !
Weiss da jemand Abhilfe ?
Danke und Gruss
Joe
Hallo setstate,
ich habe die ganze Zeit gedacht, dass ich die Regulären Ausrücke im Bezug auf die Slider nicht verstanden haben, habe jetzt aber festgestellt, dass es sich hierbei anscheinend um einen Bug handelt.
Ein Slider in einem Popup zeigt keine Werte an, egal ob per RegEx oder ohne. Der selber Slider funktioniert außerhalb des Popups Fehlerfrei.
Wenn ich das Popup während des Ladevorgangs geöffnet bekomme, dann schafft es der Slider anscheinen die Daten zu laden.
Ebenso scheint es so zu sein, dass wenn ich während das Popup auf ist und ich überschreibe den Wert in Fhem, dann wird ebenfalls der Wert geladen.
Ich würde selber prüfen wo genau der Fehler liegt, kenne mich aber nicht gut genug im Bereich der Webprogrammierung aus.
Gruß
Patrick
@MrWishbone: Wie sieht der RegEx aus? Bitte mal ein kurzen Beispiel, dann teste ich das bei mir ...
Hallo zusammen,
ich bin über TabletUI gestolpert und war sofort begeistert, so das ich jetzt am konfigurieren bin...
Ich finde es nur etwas umständlich...
Darum ein paar Fragen bzgl. folgendes Codebeispiels:
<table class="cells" width="100%">
<tr><th>Raum</th><th>Temperatur</th><th>Feuchtigkeit</th><th>Taupunkt</th><th>Batterie</th></tr>
<tr>
<td><div data-type="label" class="cell narrow">Bad</div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="temperature"></div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="humidity"></div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="dewpoint"></div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="battery"></div></td>
</tr>
</table>
* Lassen sich Parameter übergeordnet definieren?
<table class="cells" width="100%">
<tr><th>Raum</th><th>Temperatur</th><th>Feuchtigkeit</th><th>Taupunkt</th><th>Batterie</th></tr>
<tr>
<div data-type="label" data-device="BZ_Climate">
<td><div data-type="label" class="cell narrow">Bad</div></td>
<td><div data-get="temperature"></div></td>
<td><div data-get="humidity"></div></td>
<td><div data-get="dewpoint"></div></td>
<td><div data-get="battery"></div></td>
</div>
</tr>
</table>
*Lassen sich so eine Art Template definieren?
Klimasensor=" <td><div data-type="label" data-get="temperature"></div></td>
<td><div data-type="label" data-get="humidity"></div></td>
<td><div data-type="label" data-get="dewpoint"></div></td>
<td><div data-type="label" data-get="battery"></div></td>"
<table class="cells" width="100%">
<tr><th>Raum</th><th>Temperatur</th><th>Feuchtigkeit</th><th>Taupunkt</th><th>Batterie</th></tr>
<tr>
<td><div data-type="label" class="cell narrow" template="Klimasensor" data-device="BZ_Climate">Bad</div></td>
<td><div data-type="label" class="cell narrow" template="Klimasensor" data-device="SZ_Climate">Schlafzimmer</div></td>
<td><div data-type="label" class="cell narrow" template="Klimasensor" data-device="WZ_Climate">Wohnzimmer</div></td>
</tr>
</table>
oder für die Styles (Wertelimits) eine Art Template?
TempLimit="data-limits='[16,22]' data-colors='["#AA6900","#FF0000"]'"
<table class="cells" width="100%">
<tr><th>Raum</th><th>Temperatur</th><th>Feuchtigkeit</th><th>Taupunkt</th><th>Batterie</th></tr>
<tr>
<td><div data-type="label" class="cell narrow">Bad</div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="temperature" Template="TempLimit"></div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="humidity"></div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="dewpoint"></div></td>
<td><div data-type="label" data-device="BZ_Climate" data-get="battery"></div></td>
</tr>
</table>
* Lassen sich in irgend einer Art auch Wildcards/RegEx definieren?
So das alle Defines welche zum RegEx "*Climate" passen auflisten?
<table class="cells" width="100%">
<tr><th>Raum</th><th>Temperatur</th><th>Feuchtigkeit</th><th>Taupunkt</th><th>Batterie</th></tr>
<tr>
<td><div data-type="label" class="cell narrow">Bad</div></td>
<td><div data-type="label" data-device="*_Climate" data-get="temperature"></div></td>
<td><div data-type="label" data-device="*_Climate" data-get="humidity"></div></td>
<td><div data-type="label" data-device="*_Climate" data-get="dewpoint"></div></td>
<td><div data-type="label" data-device="*_Climate" data-get="battery"></div></td>
</tr>
</table>
Besten Dank im Voraus!
@Setstate
Ich habe mal eine abgespeckte Version meines UIs angehängt, welches ich zu Testzwecken auf das wesentliche beschränkt habe (nur das Popup).
Das Chart-Widget wird anscheinend in einem Popup ebenfalls nicht geladen.
Ich überlege schon, ob ich mich eventuell vom Popup trennen sollte und stattdessen mit einem Pagebutton einen Seitenwechsel durchführe, damit sollten dann sämtliche Probleme erledigt sein.
Beim Slider geht es um diesen Code-Teil (Zeile 99):
<div data-type="slider" data-device="WZ_Heizung_Temp_Day" data-min="5" data-max="35" data-value="true" data-set-value="$v.0" data-get-value="([\D]*).." data-height="150" class="inline"></div>
Der Slider funktioniert nur innerhalb des Popups nicht.
Zitat von: waschbaerbauch am 07 Januar 2016, 11:02:24
Nachdem ich nun schon mindestens 3x alles verworfen habe und neu angefangen (dank der Inspirationen hier) möchte ich nun auch schon mal ein paar Bilder preisgeben vom ersten Wurf.
Kann ich mir gut vorstellen, sind aber auch sehr schön geworden. Könntest du den Code evtl. teilen (ggf bei den Github User Demos)?
Vor allem die Wetteransicht gefällt mir sehr gut.
Zitat
... oder wartest noch ein zwei Tage um denen, die heute noch nicht hier waren, die Gelegenheit zu einer Antwort zu geben ;)
Hallo zusammen,
das werde ich mal machen......
Ich habe jetzt den ganzen Abend viel über Tablet-UI gelesen und viele tolle Darstellungen gesehen. Ich bin echt begeistert, was man damit machen kann! Bin gespannt, ob ich das hinkriege. Mit HTML habe ich noch nichts gemacht! Mal schauen...
Eine Frage, bevor ich das Tablet-UI auf meinem prod. fhem installiere und mich daran versuche:
Kann ich das Tool auch wieder sauber entfernen, wenn ich damit nicht klar komme? Ich möchte ungern Dinge auf dem Pi haben, mit denen ich nicht klar komme. Habe leider kein Testsystem
Danke,
Christian
Zitat von: Spartacus am 07 Januar 2016, 22:21:29
Kann ich das Tool auch wieder sauber entfernen, wenn ich damit nicht klar komme? Ich möchte ungern Dinge auf dem Pi haben, mit denen ich nicht klar komme. Habe leider kein Testsystem
Ja, einfach die neu angelegten Devices in der fhem.cfg entfernen und den Pfad /opt/fhem/www/tablet vollständig löschen (bei Standard-Installationspfaden).
Zitat von: TWART016 am 07 Januar 2016, 22:14:09
Kann ich mir gut vorstellen, sind aber auch sehr schön geworden. Könntest du den Code evtl. teilen (ggf bei den Github User Demos)?
Vor allem die Wetteransicht gefällt mir sehr gut.
Ist schon geschehen: http://forum.fhem.de/index.php/topic,37378.msg386691.html#msg386691
@ulli: leider kann ich mit keinem dieser Features dienen. Templates gibt es, aber in anderer Art. Nachzulesen hier:
https://github.com/knowthelist/fhem-tablet-ui#templates
Hallo,
ich habe folgendes seltsames Verhalten.
Klicke ich auf das MENU und Kind öffnet sich mit einem pagebutton eine Kinderzimmer.html
Manchmal öffnet sich der Link
http://192.168.178.25:8083/fhem/ftui/Kinderzimmer.html
und manchmal
http://192.168.178.25:8083/fhem/ftui/Kinderzimmer.html#index.html
Screenshots hänge ich an.
Leider kann ich nicht sagen wann was kommt. Wenn ich nun nochmal auf Kind im Menü klicke, öffnet sich der andere Link. Dies kann ich beliebig oft wiederholen.
In beiden Ansichten stimmt das Format aber nicht.
Bei Kinderzimmer.html ist das Icon bei Home (Feld 1/1) nicht vorhanden.
Bei Kinderzimmer.html#index.html ist die komplette erste Reiche nicht groß genug.
EDIT: Zudem ist es nicht möglich data-row zu ändern. Es hat keine Auswirkung. Ich würde gerne die Zeile von 1 in 3 ändern. data-col funktioniert.
Code:
left_main_menü.html
<header>MENU</header>
<div class="cell">
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="pagebutton" data-color="#aa6900" data-url="Kinderzimmer.html" data-icon="fa-child" class="cell small"></div>
<div data-type="label" class="cell small darker top-narrow">Kind</div>
<div data-type="pagebutton" data-url="index_3.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagebutton" data-url="index_4.html" data-icon="fa-hotel" class="cell"></div>
<div data-type="pagebutton" data-url="index_5.html" data-icon="fa-music" class=""></div>
index.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.4.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<!-- link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" / -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<!-- Remove this line to enable for usage with WebViewControl
<script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<script src="/fhem/pgm2/cordova-2.3.0.js" defer></script>
<script src="/fhem/pgm2/webviewcontrol.js" defer></script>
<!-- End for WebViewControl -->
<title>FHEM-Tablet-UI</title>
</head>
<body>
<div class="gridster">
<ul>
<!-- ============ Home-Button ============= -->
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="homebutton.html"></li>
<!-- ========= Linkes-Hauptmenü =========== -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu_left_main.html"></li>
<!-- ============= Uhrzeit ================ -->
<!-- ====================================== -->
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1" data-template="uhr.html"></li>
<!-- ========= Aussentemperatur =========== -->
<!-- ======================================= -->
<li data-row="1" data-col="4" data-sizex="2" data-sizey="1" data-template="aussentemp.html"></li>
</ul>
</div>
</body>
</html>
Kinderzimmer.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="127">
<meta name="widget_base_height" content="100">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!-- -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<!-- ============ Home-Button ============= -->
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="homebutton.html"></li>
<!-- ========= Linkes-Hauptmenü =========== -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu_left_main.html"></li>
<li data-row="2" data-col="2" data-sizex="3" data-sizey="3">
<div class="centered">
<div data-type="symbol" data-device="testStatus2" class="bigger"></div>
</div>
</li>
</ul>
</div>
</body>
</html>
Was könnte hier nicht stimmen?
Grüße
TWART016
Zitat von: TWART016 am 08 Januar 2016, 01:52:42
Hallo,
ich habe folgendes seltsames Verhalten.
Klicke ich auf das MENU und Kind öffnet sich mit einem pagebutton eine Kinderzimmer.html
Manchmal öffnet sich der Link
http://192.168.178.25:8083/fhem/ftui/Kinderzimmer.html
und manchmal
http://192.168.178.25:8083/fhem/ftui/Kinderzimmer.html#index.html
Screenshots hänge ich an.
Leider kann ich nicht sagen wann was kommt. Wenn ich nun nochmal auf Kind im Menü klicke, öffnet sich der andere Link. Dies kann ich beliebig oft wiederholen.
In beiden Ansichten stimmt das Format aber nicht.
Bei Kinderzimmer.html ist das Icon bei Home (Feld 1/1) nicht vorhanden.
Bei Kinderzimmer.html#index.html ist die komplette erste Reiche nicht groß genug.
EDIT: Zudem ist es nicht möglich data-row zu ändern. Es hat keine Auswirkung. Ich würde gerne die Zeile von 1 in 3 ändern. data-col funktioniert.
Code:
left_main_menü.html
<header>MENU</header>
<div class="cell">
<div style="font-size:30px; color:rgb(96, 0, 0);" data-type="pagebutton" data-color="#aa6900" data-url="Kinderzimmer.html" data-icon="fa-child" class="cell small"></div>
<div data-type="label" class="cell small darker top-narrow">Kind</div>
<div data-type="pagebutton" data-url="index_3.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagebutton" data-url="index_4.html" data-icon="fa-hotel" class="cell"></div>
<div data-type="pagebutton" data-url="index_5.html" data-icon="fa-music" class=""></div>
index.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.4.4
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="131">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<!-- link rel="stylesheet" href="/fhem/tablet/css/fhem-green-ui.css" / -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
<script src="/fhem/pgm2/jquery.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.toast.min.js" defer></script>
<script src="/fhem/tablet/lib/jquery.gridster.min.js" defer></script>
<script src="/fhem/tablet/js/fhem-tablet-ui.min.js" defer></script>
<!-- Remove this line to enable for usage with WebViewControl
<script defer>var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<script src="/fhem/pgm2/cordova-2.3.0.js" defer></script>
<script src="/fhem/pgm2/webviewcontrol.js" defer></script>
<!-- End for WebViewControl -->
<title>FHEM-Tablet-UI</title>
</head>
<body>
<div class="gridster">
<ul>
<!-- ============ Home-Button ============= -->
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="homebutton.html"></li>
<!-- ========= Linkes-Hauptmenü =========== -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu_left_main.html"></li>
<!-- ============= Uhrzeit ================ -->
<!-- ====================================== -->
<li data-row="1" data-col="2" data-sizex="2" data-sizey="1" data-template="uhr.html"></li>
<!-- ========= Aussentemperatur =========== -->
<!-- ======================================= -->
<li data-row="1" data-col="4" data-sizex="2" data-sizey="1" data-template="aussentemp.html"></li>
</ul>
</div>
</body>
</html>
Kinderzimmer.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="127">
<meta name="widget_base_height" content="100">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!-- Enable this lines for usage with WebViewControl --><!-- -->
<script type="text/javascript" src="/fhem/pgm2/cordova-2.3.0.js"></script>
<script type="text/javascript" src="/fhem/js/webviewcontrol.js"></script>
<script type="text/javascript">var wvcDevices = {'12345': 'Tablet'}; var wvcUserCssFile="webviewcontrol.css"</script>
<!-- End for WebViewControl -->
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<!-- ============ Home-Button ============= -->
<!-- ====================================== -->
<li data-row="1" data-col="1" data-sizex="1" data-sizey="1" data-template="homebutton.html"></li>
<!-- ========= Linkes-Hauptmenü =========== -->
<!-- ====================================== -->
<li data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu_left_main.html"></li>
<li data-row="2" data-col="2" data-sizex="3" data-sizey="3">
<div class="centered">
<div data-type="symbol" data-device="testStatus2" class="bigger"></div>
</div>
</li>
</ul>
</div>
</body>
</html>
Was könnte hier nicht stimmen?
Grüße
TWART016
Schau dir bitte meine FTUI ganz genau an. (Link in der Signatur)
In den zu öffnenden Seiten brauchst du keinen <head>-Tag. Nur in der index.html.
In der index.html sollte am besten nur ein include sein. Wie z.B. der HomeButton der auf die z.B. home.html verweist. Diese wird dann bei aufruf der index.html geladen.
Grüße^^
Zitat von: StefanJoe am 07 Januar 2016, 23:06:22
Ja, einfach die neu angelegten Devices in der fhem.cfg entfernen und den Pfad /opt/fhem/www/tablet vollständig löschen (bei Standard-Installationspfaden).
Hallo StefanJoe,
danke für die Antwort. Das ist dann ja echt einfach!
Dann werde ich das mal am WE angehen.
BTW.
Ich habe mehrere RPIs, die per fhem2fhem gekoppelt sind (Gartenhaus-PI, SONOS-PI, Wohnhaus-PI) Ich würde aber gerne Infos vom SONOS-PI, Gartenhaus-PI (Außentemperatur) und Steuerelemente vom Wohnhaus-PI auf einer Anzeigeseite darstellen. Wie baut man das am Besten auf?
Christian
Zitat von: StefanJoe am 07 Januar 2016, 23:06:22
Ja, einfach die neu angelegten Devices in der fhem.cfg entfernen und den Pfad /opt/fhem/www/tablet vollständig löschen (bei Standard-Installationspfaden).
Hallo StefanJoe,
danke für die Antwort. Das ist dann ja echt einfach!
Dann werde ich das mal am WE angehen.
BTW.
Ich habe mehrere RPIs, die per fhem2fhem gekoppelt sind (Gartenhaus-PI, SONOS-PI, Wohnhaus-PI) Ich würde aber gerne Infos vom SONOS-PI, Gartenhaus-PI (Außentemperatur) und Steuerelemente vom Wohnhaus-PI auf einer Anzeigeseite darstellen. Wie baut man das am Besten auf?
Christian
Bevor ich jetzt vor Verzweiflung den Rechner an die Wand klatsche...
ich möchte gerne meine Mülltonne Blinken lassen wenn der 1 oder 0 ist. Ansonsten soll sie ganz normal stehen bleiben mit dem Wert.
Ich muss das irgenwie mit dem data-get-on machen aber bei mir blinkt es dann immer :-( Kann ich da irgendwas kleiner/gleich 1 eingeben?
Der Ausgang:
<!-- Müll -->
<li data-row="3" data-col="2" data-sizex="2" data-sizey="3">
<header><font size="+1">Abfall</font></header>
<table class="calls" width="100%">
<tr>
<td>Was</td>
<td>Wann</td>
</tr>
<tr>
<td><div data-type="label" class="large thin">Hausmüll</div></td>
<td>
<div data-type="symbol"class="bigger warn"
data-device="Restmuell" data-get="state"
data-get-on="(\d+)"
data-on-color="#0E0E0E"
data-icon="fa-trash-o">
</div>
</td>
</tr>
<tr>
<td><div data-type="label" class="inline large thin">Papiermüll</div></td>
<td>
<div data-type="symbol"class="bigger warn"
data-device="Papiertonne" data-get="state"
data-get-on="(\d+)"
data-on-color="#4040D5"
data-icon="fa-trash-o">
</div>
</td>
</tr>
<tr>
<td><div data-type="label" class="inline large thin">Plastikmüll</div></td>
<td>
<div data-type="symbol"class="bigger warn"
data-device="Gelbetonne" data-get="state"
data-get-on="(\d+)"
data-on-color="#E6E600"
data-icon="fa-trash-o">
</div>
</td>
</tr>
</table>
</li>
Auch das liegt schon in der User-Demo vom roman ;)
<li data-row="3" data-col="1" data-sizex="3" data-sizey="1">
<header>Abfallkalender</header>
<div class="cell center">
<div data-type="button"
data-background-icon="none"
data-device="Restmuell"
data-get="state"
data-off-color="#606060"
data-cmd="set Restmuell off"
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]'
data-icons='["fa-trash-o warn","fa-trash-o warn blink","fa-trash-o warn"]'
data-on-colors='["#505050","#505050","#505050"]'
class="bigger">
</div>
<div data-type="label">Restmüll</div>
</li>
Jaaaa Super danke,
leider habe ich nicht verstanden was da passiert!
Ich auch nur so halb, aber ggf. kann uns einer aufklären :D
Zitat von: waschbaerbauch am 08 Januar 2016, 13:46:15
Ich auch nur so halb, aber ggf. kann uns einer aufklären :D
Moin.
Ich habe in einen Google-Kalender die Abfuhrtermine eingetragen.. Da gibt es eine Vorlage zu... fragt mich bitte nicht von wem. Dieser Kalender wird ausgelesen und über ein notify ein bzw. mehrere (Restmüll,Plastik,Papier) Dummys gesetzt.
Diese Dummys lese ich in der FTUI aus. Es werden die Resttage angezeigt. Einen Tag vor Abfuhr blinkt das Icon und es wird eine 1 angezeigt. Wenn ich den Müll draußen habe klick ich auf den Button, er wird konstant angezeigt mit einem ! damit ich weiterhin weiß... morgen ist müll.
<div data-type="button" <- sollte klar sein
data-background-icon="none" <- damit da nichts drum rum is...
data-device="Restmuell" <- Der Dummy
data-get="state" <- Sollte auch klar sein.
data-off-color="#606060" <- .....
data-cmd="set Restmuell off" <- Um das blinken abzuschalten wenn der Müll draußen ist.
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' <- "off" "1" "10-19 oder 2-9" ich glaub 2-9 kann weg?!
data-icons='["fa-trash-o warn","fa-trash-o warn blink","fa-trash-o warn"]' <- "nach dem drücken" "letzter tag" "Resttage"
data-on-colors='["#505050","#505050","#505050"]' <- Farben für die stati... damit die tonne immer grau ist.
class="bigger"> <- sollte auch klar sein.
</div>
Wenn Fragen sind schickt mir doch bitte ne PN oder ne Mail über meine Seite... Hier komme ich immer nicht ganz mit^^
Grüße^^
EDITUnter dem Download auf meinen Seiten sind Kommentarfelder für euch eingerichtet... Da werde ich drüber benachrichtigt... Dann können es auch gleich alle lesen^^
Ja das hatte ich jetzt so. das mit dem CMD hatte ich noch nicht, jetzt aber :-)
Ich meine ich habe den Code nicht verstanden, wie es mit der erkennung für das Blinken geht. Also diese Zeilen
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' <- "off" "1" "10-19 oder 2-9" ich glaub 2-9 kann weg?!
data-icons='["fa-trash-o warn","fa-trash-o warn blink","fa-trash-o warn"]' <- "nach dem drücken" "letzter tag" "Resttage"
Das ist auch bei mir die Zeile die ich mangels Programmierkenntnissen nicht verstanden habe, aber es funktionierte zumindest gestern, von daher - alles gut! :)
Zitat von: RettungsTim am 08 Januar 2016, 14:03:38
Ja das hatte ich jetzt so. das mit dem CMD hatte ich noch nicht, jetzt aber :-)
Ich meine ich habe den Code nicht verstanden, wie es mit der erkennung für das Blinken geht. Also diese Zeilen
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' <- "off" "1" "10-19 oder 2-9" ich glaub 2-9 kann weg?!
data-icons='["fa-trash-o warn","fa-trash-o warn blink","fa-trash-o warn"]' <- "nach dem drücken" "letzter tag" "Resttage"
data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' <- "off" "1" "10-19 oder 2-9" ich glaub 2-9 kann weg?!
Das ist RegEx. Kann ich selber nicht... Aber mit probieren hat es dann geklappt.
"off ist klar" "prüft ob es 1 ist" "prüft ob es 10,11,12,...,19 ist ODER (|) 2,3,4,...,9 wobei das wahrscheinlich weg kann weil mein müll definitiv alle 14 tage abgeholt wird"
data-icons='["fa-trash-o warn","fa-trash-o warn blink","fa-trash-o warn"]'
Die Zuordnungen zu den einzelnen values im data-get-on array.
ich habe es noch etwas vereinfacht:
<div data-type="pagebutton"
data-background-icon="none"
data-device="dummy1"
datacmd="set dummy1 off"
data-states='["off","[01]","[1-9][0-9]|[2-9]"]'
data-icons='["fa-trash-o warn","fa-trash-o warn blink","fa-trash-o warn"]'
data-colors='["#505050","#505050","#505050"]'
class="bigger">
</div>
2-9 müssen aber schon bleiben, weil man sonst kein Icon für die Resttage 2-9 sieht sondern nur von 0-1 und dann wieder 10-19
Zitat von: setstate am 08 Januar 2016, 14:52:57
2-9 müssen aber schon bleiben, weil man sonst kein Icon für die Resttage 2-9 sieht sondern nur von 0-1 und dann wieder 10-19
ha... siehste... das war es xD
Zitat von: roman1528 am 08 Januar 2016, 12:08:43
Schau dir bitte meine FTUI ganz genau an. (Link in der Signatur)
In den zu öffnenden Seiten brauchst du keinen <head>-Tag. Nur in der index.html.
In der index.html sollte am besten nur ein include sein. Wie z.B. der HomeButton der auf die z.B. home.html verweist. Diese wird dann bei aufruf der index.html geladen.
Danke, damit sind fast alle Probleme weg. die <head> entfernen hat geholfen.
In den index.html habe ich im Prinzip nur Verweise auf andere html Seiten mittels data-template.
Jetzt erscheint ein anderes Problem. Manchmal wird die index.html nicht richtig geladen. (siehe Screenhsot index.jpg)
Dann kopieren ich den Link erneut in die Adresszeile -> keine Veränderung. Nach einem Neustart des Browsers geht es wieder, genauso wie F5 (aktualisieren) oder Strg+R (neu laden).
Manchmal ist zudem das ganze Feld Home (Überschrift + Symbol + Text) ebenfalls nicht vorhanden.
Bei beiden Adressen gibt es gleiches Verhalten:
- http://192.168.178.25:8083/fhem/ftui/index.html
- http://192.168.178.25:8083/fhem/ftui/
Probiere mal spaßeshalber den kpl. Inhalt der index.html bis zum </head>-Tag 1:1 aus meinem Beispiel (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_baue_ich_ein_Men.C3.BC_mit_dem_Pagetab_Widget_auf.3F) zu übernehmen.
Mit der defer Angabe weißt man den Renderer darauf hin, dass die JS-Files erst nachdem die Seite vollständig geladen wurde abgearbeitet werden soll.
Zitat von: setstate am 08 Januar 2016, 21:37:05
Probiere mal spaßeshalber den kpl. Inhalt der index.html bis zum </head>-Tag 1:1 aus meinem Beispiel (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI/FAQ#Wie_baue_ich_ein_Men.C3.BC_mit_dem_Pagetab_Widget_auf.3F) zu übernehmen.
Mit der defer Angabe weißt man den Renderer darauf hin, dass die JS-Files erst nachdem die Seite vollständig geladen wurde abgearbeitet werden soll.
Super danke, die Zeile hat geholfen:
<meta http-equiv="Cache-Control" content="no-store" />
Da es gerade Thema war kurz meine Lösung für blinkende Müll-Symbole. Mein persönliches Ziel war es direkt auf meine CALLVIEW Instanz und den dort vorgehaltenen Terminen aufzusetzen, ohne zusätzliche Dummys erzeugen zu müssen. Herausgekommen ist eine Lösung auf Javascript Basis.
1. Zunächst die "klassische" Table UI Definition + eine Ergänzung der Blöcke um eine ID. Wozu folgt später.
<li data-row="3" data-col="1" data-sizex="2" data-sizey="1">
<header>MÜLLABFUHR</header>
<div data-type="symbol" class="big inline top-narrow-10"
data-device="callview_abfall"
data-get="t_001_summary"
id="t_001_summary_blink" <-------- ID für das Symbol Element
data-icons='["fa-trash","fa-trash","fa-trash","fa-trash","fa-tree"]'
data-on-colors='["grey","yellow","green","blue","green"]'
data-get-on='["Restabfall(14-täglich)","Gelber Sack(14-täglich)","Bioabfall(14-täglich)","Papiertonne(4-wöchentlich)","Weihnachtsbaum"]'>
</div>
<div class="cell inline">
<div data-type="label" class="top-narrow-10 w3x"
data-device="callview_abfall"
data-get="t_001_bdate"
id="t_001_bdate_blink"> <---- ID für das Datums Element
</div>
<div data-type="label" class="cw3x small"
data-device="callview_abfall"
data-get="t_001_summary">
</div>
</div>
</li>
Der Termin für die Abholung steht in "t_001_bdate".
2. Jetzt hab ich folgendes Javascript gebaut.
1 function trash_blink(elementid, symbolid) {
2 var abholung = document.getElementById(elementid).innerHTML;
3 var myDateAbholung = abholung;
4 myDateAbholung=myDateAbholung.split(".");
5 var newDateAbholung=myDateAbholung[2]+"-"+myDateAbholung[1]+"-"+myDateAbholung[0];
6
7 var datum=new Date();
8 heute = Math.floor(Date.now());
9
10 var timediff = (new Date(newDateAbholung).getTime()) - heute;
11
12 if (timediff < 86400000) {
13 document.getElementById(symbolid).className += " blink";
14 }
15 }
16 setTimeout(trash_blink, 2000, "t_001_bdate_blink", "t_001_summary_blink");
17 setTimeout(trash_blink, 2000, "t_002_bdate_blink", "t_002_summary_blink");
18 setTimeout(trash_blink, 2000, "t_003_bdate_blink", "t_003_summary_blink");
Kurz ein paar Erklärungen. Zeile 16-18 ruft die Funktion "trash_blink" mit einer Verzögerung von 2000ms auf. Übergeben werden dabei die oben gekennzeichneten IDs. Die muss für jedes Abholdatum geschehen, dessen Symbol blinken soll.
In den Zeilen 2-5 wird das Datum der Abholung eingelesen, an den . gesplittet und in das ISO Format 8601 geändert. Identifiziert wird das zu lesenden Datum über den Funktionsparameter 1. Bsp. "t_001_bdate_blink"
Zeile 7-8 schreiben das aktuelle Datum bzw. die Anzahl der Millisekunden, die seit dem 01.01.1970 00:00:00 UTC vergangen sind in die Variable heute.
In Zeile 10 ziehe ich die Millisekunden von heute von den vergangenen Millisekunden für das Abholdatum ab und speichere das Ergebnis in die Variable timediff.
In den Zeilen 12-14 wird jetzt geprüft, ob das Ergbenis der Subtraktion kleiner als 86400000 Millisekunden ist. Die Anzahl der Millisekunden entspricht dabei genau 24 Std. Ist die zeitliche Differenz von jetzt zum Abholdatum also kleiner 24 Std. füge ich der css Definition den Wert "blink" hinzu. Dadurch fängt das Symbol dann halt an zu blinken. Identifiziert wird das Symbol über den Funktionsparameter 2. Bsp. "t_001_summary_blink"
Viele Grüße
Stephan
Zitat von: TWART016 am 08 Januar 2016, 21:48:51
Super danke, die Zeile hat geholfen:
<meta http-equiv="Cache-Control" content="no-store" />
bei mir steht
<meta http-equiv='pragma' content='no-cache'>Was ist der Unterschied?
Hallo,
ich möchte mein Tablet mit Funk-Steckdose aus dem Standby holen und das Display anschalten lassen sobald jemand davor steht (mit Bewegungsmelder). Leider ist die Tablet UI Anzeige im Webviewcontrol zu träge nach dem Standby. Wenn ich morgens das Tablet aus dem Standby hole ist die Anzeige zwar sofort da, aber mit den alten Readigns vom Vortag und es dauert bis zu 15min bis alle Readings aktualisiert wurden. Longpoll ist natürlich aktiviert. Wie kann ich das automatisiert beschleunigen?
Wenn ich ein Reload der Seite mache, was man ja von fhem aus mit Webviewcontrol initiieren könnte, dauert der Aufbau der Seite recht lange und manchmal wird die Seite nicht korrekt aufgebaut und muss noch einmal manuell gereloaded werden.
Ich würde also gerne alle Readings nach Standby sofort aktualisieren ohne Reload der Seite. Gibt es da eine Möglichkeit automatisiert über Webviewcontrol (z.b. durch kurzzeitiges Setzen von shortpoll)?
@Setstate
Ich würde gerne mit dem Range-widget die Heizzeiten meiner Heizung visualisieren.
Gibt es eine Möglichkeit das Range-widget horizontal darzustellen ?
Weiterhin wäre es schön, wenn man 2 Bereiche darstellen könnte. Siehst du da eine Möglichkeit das so zu realisieren?
Danke schon mal im voraus!
Gruß,
Stefan
Zurück zum Tablet für die Visualisierung. Ich habe mir jetzt nach ausführlichem Studium der Vorschläge - mein Dank dafür - für ein HANNSpad 13,3" (SN14T72) entschieden. Scheint mir für meinen Bedarf ausreichend groß zu sein und hatte für mich die Vorteile:
Großes und gutes Display
Sehr dünn, da ich es an die Wand machen möchte
Hat alles notwendige eingebaut, aber nichts überflüssiges
Kann ich auch mit in den Urlaub nehmen oder als normales Tablet verwenden
Ich habe allerdings auch Rezensionen gefunden, die über schlechten WLAN-Empfang bei einigen Geräten berichten. Mal sehen, wie meines dann ist. Meine Auswahlübersicht stelle ich hier hinein, da sie vielleicht auch anderen bei der Auswahl hilft. Ich erhebe keinen Anspruch auf Vollständigkeit, ebenso keine Gewähr auf die Richtigkeit der Angaben.
@Tommy82: Mir hat Deine Visualisierung sehr gut gefallen und ich würde gerne etwas ähnliches erstellen. Könntest Du mir vielleicht Deine Konfiguration zur Verfügung stellen, damit ich nicht alles neu von 0 an aufsetzen muss? Ändern ist immer einfacher und schneller als neu erstellen. Wie hast Du die Wandhalterung gelöst?
Viele Grüße
Jürgen
Zitat von: Haecksler am 09 Januar 2016, 12:02:15
@Setstate
Ich würde gerne mit dem Range-widget die Heizzeiten meiner Heizung visualisieren.
Gibt es eine Möglichkeit das Range-widget horizontal darzustellen ?
Weiterhin wäre es schön, wenn man 2 Bereiche darstellen könnte. Siehst du da eine Möglichkeit das so zu realisieren?
Klingt realisierbar ... eher eine Fleißarbeit
Es sind ja auch noch ein paar Anforderungen offen in Richtung der Skalierung.
Wie sind die zwei Bereiche im FHEM definiert? n-fache Readings (Start_0, End_0, Start_1, End_1) oder als Array, mit Startpunkt und Endpunkt im Wechsel
Zitat von: setstate am 09 Januar 2016, 12:34:56
Klingt realisierbar ... eher eine Fleißarbeit
Es sind ja auch noch ein paar Anforderungen offen in Richtung der Skalierung.
Wie sind die zwei Bereiche im FHEM definiert? n-fache Readings (Start_0, End_0, Start_1, End_1) oder als Array, mit Startpunkt und Endpunkt im Wechsel
Also ich bin da offen, wäre es nicht am einfachste ein Array zu machen.
Ich hatte mir das so vorgestellt ich mache mir Dummies mit denen ich die Schaltzeiten an einen Weekdaytimer weitergebe...dann würde ich noch ein userReading machen, welches die Uhrzeit in eine Kommazahl also aus 12:30 wird 12,5 umsetzt, dieses Reading würde dann ins Array vom Range-Widget kommen. Also immer 2 Zahlenpaare im Array für einen Bereich.
Hallo zusammen,
ich habe diese Woche das Tablet UI für mich entdeckt. Das ist genau das was ich gesucht hatte. Leider bekomme ich das irgendwie nicht hin mit der Umsetzung. Ich hatte mal all meine MAX Thermostate in die index.html eingefügt und das hat soweit auch funktioniert. Das war aber nur mal als erster Trail-and-Error versuch. Ich hab mir dann die Beispiel UIs angesehen und bemerkt, dass der Aufbau sich grundlegend unterscheidet. Es wird nicht alles in die index.html gepackt, sondern in einzelne htmls. Leider komme ich damit überhaupt nicht klar. Ich schaffe es noch nicht mal die Uhrzeit in einem Feld anzeigen zu lassen. Ich dachte eigentlich, dass das nicht so schwierig sein könnte. Wenn ich dann ein komplettes Beispiel importiere, dann funktioniert es auch nicht, weil dann die ganzen Daten aus FHEM fehlen. Kürze ich das auf 2 Felder, dann sind die einfach nur grau und im Hintergrund sieht man noch das FHEM Logo von der normalen Ansicht.
Lange Reder, kurzer Sinn: gibt es irgendwo ein Howto, Tutorial oder sonst irgendwas, wie man sich da einarbeiten kann??
Gruß persching
Auf voizchat.de gibt es da was:
http://voizchat.de/fhem-tutorial-serie-teil-5-tablet-ui-installieren-und-konfigurieren/ (http://voizchat.de/fhem-tutorial-serie-teil-5-tablet-ui-installieren-und-konfigurieren/)
https://www.youtube.com/watch?v=vlJOol0C-Yg (https://www.youtube.com/watch?v=vlJOol0C-Yg)
https://www.youtube.com/watch?v=vlJOol0C-Yg (https://www.youtube.com/watch?v=vlJOol0C-Yg)
:D Vielen Dank dafür an Jan! :D
Hallo,
hat schon jemand die Funksteckdosen PCA301 sauber mit dem Tablet-UI visualisiert ?
Ich hätte gern einen Button mit Label und der Anzeige der aktuellen Leistung. Und das ganze sehr kompakt.
Durch die variierende Anzahl der Stellen bei der Leistungsanzeige verschiebt sich bei mir immer alles.
Jemand ne Idee oder fertiges Widget fur PCA301 ?
Gruss
Joe
Ich hab das für mich so umgesetzt. Einmal mit Harmony Hub als Schalter inkl. PCA301 Energiewerte und einmal PCA301 komplett. Ist natürlich auch erweiterbar.
<li data-row="3" data-col="8" data-sizex="1" data-sizey="1">
<header>KODI</header>
<div class="container">
<div data-type="switch"
data-device="PCA301.09"
data-icon="fa-power-off"
class="cell">
</div>
<div data-type="label" class="">RPi2 OpenElec<br>Aktueller Verbrauch</div>
<div data-type="label" data-device="PCA301.09" data-get="power" data-unit="W" class=""></div>
</div>
</li>
<li data-row="3" data-col="9" data-sizex="1" data-sizey="1">
<header>AV-Receiver</header>
<div class="container">
<div data-type="switch"
data-device="harmony_31688040"
data-get="STATE"
data-set-on="PowerOn"
data-get-off="PowerOff"
data-icon="fa-power-off"
class="cell"></div>
<div data-type="label" class="">Denon AVR-X4000<br>Aktueller Verbrauch</div>
<div data-type="label" data-device="PCA301.18" data-get="power" data-unit="W" class=""></div>
</div>
</li>
Stellen nach den Komma kann man begrenzen. Wenn dann das Label noch genügend Platz hat, sollte es doch funktionieren. Vermeid sollte man, dass solche Objekte mit variablen Breite zu eng mit anderen Objekten in einer Zeile zu positionieren. Solch einem Label würde ich eine eigene Zeile spendieren oder eine feste Breite durch Anlegen von Columns (siehe col-1-2).
Da gibt es viele Möglichkeiten.
Zur Not poste mal das entsprechende Gridster Element, was dir Ärger bereitet.
Moin zusammen,
habe jetzt das TABLET-UI insalliert und auch schon die Uhr einbinden können.
Da ich noch nicht viel Erfahrung habe:
An welcher Schraube muss ich drehen, um die Ziffern der Uhrzeit zu vergrößern und die Farbe anzupassen!
Danke und Gruß,
Spartacus.
Zitat von: Spartacus am 09 Januar 2016, 17:20:42
Moin zusammen,
habe jetzt das TABLET-UI insalliert und auch schon die Uhr einbinden können.
Da ich noch nicht viel Erfahrung habe:
An welcher Schraube muss ich drehen, um die Ziffern der Uhrzeit zu vergrößern und die Farbe anzupassen!
Danke und Gruß,
Spartacus.
Durch Hinzufügen von vordefinierten CSS Klassen
<div data-type="clock" data-format="H:i" class="large"></div>
<div data-type="clock" data-format="d.n.Y" class="small blue"></div>
https://github.com/knowthelist/fhem-tablet-ui/blob/master/README.md#format
Hallo setstate,
danke für die schnelle Antwort und sorry, wenn ich so doofe Fragen stelle.
Das mit den Klassen funktioniert. Allerdings wird bei "large" die Uhr kleiner anstatt größer:
Ich habe die Zeit jetzt eingefärbt, das ist auch ok so. Aber eigentlich wollte ich die als eigenen Screen über fast die ganze Fläche des Displays laufen lassen. Quasi als Anzeige im Schlafzimmer während der Nacht. Kann man das skalieren?
index.html
<li data-row="1" data-col="2" data-sizex="3" data-sizey="1" data-template="inc_uhr.html"></li>
inc_uhr.html
<div data-type="clock" data-format="H:i:s" class="blue container bigger"></div>
Danke und Gruß,
Christian
Wenn large die Zahlen kleiner macht, dann bringt das Clock Widget schon eine Voreinstellung mit, die größer als 150% ist.
nimm mal "gigantic"
das bringt font-size: 144px
Hallo setstate,
vielen Dank. Es ist zwar jetzt recht groß, aber füllt nicht mal die Hälfte des Displays aus. Irgendwie komme ich damit nicht weiter. Ich müsste auch die Schriftfarbe weiter abdunkeln. Für "class" habe ich nur die Standardfarben "red, green und blue" gefunden. HEX-Code kann man da offenbar nicht übergeben, richtig?
Ich habe es auch noch nicht raus, wie man die Hintergrundfarbe des grauen Kastens, der mit sizex und size y bestimmt wird, ändert. Wie gesagt, die Uhr soll nachts im Schlafraum über das ganze Display gehen und irgendwo vielleicht noch das Datum und die Außentemperatur kleiner und in sehr dunklen Farben anzeigen, damit der Raum nicht zu stark ausgeleuchtet wird.
Ich kann mich nur entschuldigen, aber hast Du ggf. einen Tipp für mich, welche Grundlagen ich hier anpacken muss und wo ich passende Doku dauzu finde, denn ich fürchte ich muss mich erst näher mit HTML beschäftigen um die Sache hier halbwegs zu begreifen...
Spartacus
Wenn die vordefinierten Klassen nicht reichen/passen, muss man mit dem Style-Attribute arbeiten:
Allgemein:
style="property:value;"
Beispiel:
style="color:#333333;font-size:288px;"
Um den Hintergrund zu ändern, kannst du dir eine fhem-tablet-ui-user.css Datei anlegen und mit folgendem Tag in die index.html einbinden:
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
Inhaltlich kann dann dort alles aus der fhem-tablet-ui.css eingetragen werden, was überschrieben werden soll. Zum Beispiel dieser Teil:
body {
background-color: #ffffff;
color: #222222;
}
.gridster ul li {
background-color:#eee;
overflow: hidden;
text-align: center;
}
.gridster li header {
background: #ffffff;
color: #222;
border-bottom: 1px solid #222;
}
@Spartacus
Vor vielen Jahren hab ich mal bei SelfHTML (https://wiki.selfhtml.org/wiki/Startseite) reingeschaut.
Vielleicht ist das auch heute noch recht nützlich als Nachschlagewerk.
Vielen Dank für diese tolle Oberfläche. Die finde ich echt super und meine Frau ist auch begeistert.
Gerade kämpfe ich jedoch mit einer Sache:
Ich würde gern meine Squeezebox steuern und möchte mittels select-Widget die Playlist auswählbar machen. Leider handelt es sich bei dem Reading für die Playlist nicht um eine :-getrennte Liste. Stattdessen sind die Einträge mit einem Komma getrennt.
Gibt es eine Möglichkeit, das select-Widget trotzdem mit diesem Reading zu befüllen?
Hallo,
mit folgenden userReadings werden die Favoriten und die Playlist von komma in ":" wandeln. wz.SqueezPi musst du natürlich in deine eigenen Namen ändern.
attr userReadings sb_name {"wz.SqueezPi"},
FAVSTR_FTUI {my $t=InternalVal($name,'FAVSTR','');;$t=~s/,/:/g;;return($t)},
PLAYLIST_FTUI {my $t=InternalVal($name,'SERVERPLAYLISTS','');;$t=~s/,/:/g;;return($t)}
PS: ich weis nur nicht mehr wer das ursprünglich gepostet hatte 8)
Zitat von: roman1528 am 19 Dezember 2015, 13:03:02
Moin.
Ich habe hier einen Dialog mit zwei Buttons/Links die bewirken, dass entweder FHEM oder der RasPi neustarten.
Wenn ich jetzt einen dieser Buttons/Links klicke wird der Befehl gesendet und anschließend (oder gleichzeitig) soll sich der Dialog schließen.
Bin jetzt schon eine Weile am probieren mit:... <div onclick=".....">
base.close
base.hide(dialog,elem.data('mode'))
close.on('click',function()
dialog.close
dialog.hide
usw.....
Wie geht es denn nun richtig? Bzw. geht das überhaupt?
Danke im Vorraus.
Grüße^^
Das Popup schließt sich beim Klicken auf den Hintergrundschatten und beim Klick auf das X des Fensters. Also muss man dieses Event beim Drücken auf deinen Button auslösen:
- Close-Element selektieren -> $('.dialog-close')
- Klick Event triggern -> trigger('click')
onclick="$('.dialog-close').trigger('click');"Ein komplettes Beispiel:
<li data-row="5" data-col="1" data-sizex="3" data-sizey="3">
<header>EXAMPLE2</header>
<!-- place your widget here -->
<div data-type="popup" data-height="400px" data-width="200px">
<div data-type="link" class="large thin">Show Temperatur</div>
<div class="dialog">
<header>DIALOG</header>
<div class="top-space">
<div class="newline">
<div data-type="label" data-device="THSensorWZ" data-get="temperature" data-limits='[-73,19,23]' data-colors='["#6699FF","#aa6900","#bb6242"]' data-unit="%B0C%0A" class="bigger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
</div>
<div class="newline">
<div data-type="label" data-device="THSensorWZ" data-fix="0" data-part="4" data-limits='[0,40,60]' data-colors='["#bb6242","#aa6900","#bb6242"]' data-unit="%" class="bigger thin"></div>
<div data-type="label" class="cell">Luftfeuchte</div>
</div>
<div data-type="link" class="round top-space-3x left-space-2x"
data-width="130" data-height="50"
data-color="white"
data-background-color="green"
data-icon="fa-check"
onclick="$('.dialog-close').trigger('click');">OK</div>
</div>
</div>
</div>
</li>
Zitat von: harry66 am 09 Januar 2016, 20:34:59
Hallo,
mit folgenden userReadings werden die Favoriten und die Playlist von komma in ":" wandeln. wz.SqueezPi musst du natürlich in deine eigenen Namen ändern.
attr userReadings sb_name {"wz.SqueezPi"},
FAVSTR_FTUI {my $t=InternalVal($name,'FAVSTR','');;$t=~s/,/:/g;;return($t)},
PLAYLIST_FTUI {my $t=InternalVal($name,'SERVERPLAYLISTS','');;$t=~s/,/:/g;;return($t)}
PS: ich weis nur nicht mehr wer das ursprünglich gepostet hatte 8)
Hinweis: ;-)
{my $t=InternalVal($name,'FAVSTR','');;$t=~s/,/:/g;;return($t)},lässt sich auch übersichtlicher als
{ return InternalVal($name,'FAVSTR','') =~ tr/,/:/r }Vielleicht hilfts wem :D
Hallo,
ich bin gerade am "Müllkalender" dran und will die Lösung von roman1528 umsetzen. roman1528 verwendet einen "button", bei der vereinfachten Version von setstate ist es ein "pagebutton".
Was ist der Unterschied zwischen "button" und "pagebutton".
Im FHEMWIKI ist nur die Definition von "button" gefunden. Und in dem Thread von setstate folgende Erklärung:
ZitatEinen Pagebutton braucht man nur zu nutzen, wenn man mit data-url auf eine andere Seite springen will und der Button sich automatisch auf ON schalten soll, wenn die hinterlegte Seite gerade der aktuellen Seite entspricht.
Warum verwendet setstate bei den Müllanzeige einen "pagebutton". Da wird noch nur der Status des Buttons gewechselt und nicht die Seite. Und wo gibt es evtl. eine Doku über "pagebutton", wo die möglichen Attribute aufgelistet sind.
Viele Grüße
Achim
Zitat von: Achim am 09 Januar 2016, 22:11:15
Was ist der Unterschied zwischen "button" und "pagebutton".
"button" ist aus dem nesges-Repo, scheint aber nicht mehr kompatibel zu sein, es erscheint immer nur der Background, das Icon fehlt.
"pagebutton" ist dem am ähnlichsten, man kann aber auch das Basis Widget aller Schalter direkt nutzen -> "famultibutton"
data-type="famultibutton" https://github.com/knowthelist/fhem-tablet-ui#pagebutton-widgets
Zitat von: setstate am 09 Januar 2016, 14:59:40
Auf voizchat.de gibt es da was:
http://voizchat.de/fhem-tutorial-serie-teil-5-tablet-ui-installieren-und-konfigurieren/ (http://voizchat.de/fhem-tutorial-serie-teil-5-tablet-ui-installieren-und-konfigurieren/)
https://www.youtube.com/watch?v=vlJOol0C-Yg (https://www.youtube.com/watch?v=vlJOol0C-Yg)
https://www.youtube.com/watch?v=vlJOol0C-Yg (https://www.youtube.com/watch?v=vlJOol0C-Yg)
:D Vielen Dank dafür an Jan! :D
Danke, das hab ich gesucht. Das hat mich jetzt mal auf die richtige Spur gebracht. Ich hab jetzt auch mal ein Example als Grundlage gewählt und hab dort meine eigenen Sachen eingebaut.
Aktuell stehe ich jetzt vor einem (hoffentlich) kleinen Problem:
Ich habe im Badezimmer 3 Thermostate die ich in FHEM zu einem Structure zusammen geführt habe. Leider kann ich so ein Thermostat-structure nicht auf das thermostat-widget des Tablet-UI anwenden. Ich beobachte schon länger mit Plots parallel alle drei Thermostate und die valveposition und die gemessene Temperatur sind nahezu identisch. Darum war jetzt meine Idee, dass ich für den "data-get" und "data-set" Befehl die structure verwende (somit werden alle 3 Thermostate gleichzeitig mit dem neuen Wert versorgt), gleichzeitig verwende ich aber einen Thermostat beispielhaft für valveposition und temperature. Geht das irgendwie? Oder müsste da eine Veränderung am Widget erfolgen?
Gruß persching
Hallo setstate,
[EDIT]
einfach alles vergessen was weiter unten steht. Die generellen Attribute sind ganz oben beschreiben.
ich habe mal auf https://github.com/knowthelist/fhem-tablet-ui#pagebutton-widgets (https://github.com/knowthelist/fhem-tablet-ui#pagebutton-widgets) nachgesehen. Laut dem Eintrag gibt es für "pagebutton" nur zwei Attribute (nennt man das so?).
ZitatPagebutton widgets
• data-url : URL of the new page to show
• data-active-pattern : RegEx to define active state (default null) all other parameters like switch widget
zu dem Widget "famultibutton" habe ich keine Doku gefunden. Ich habe auch mal in den JS-Code reingesehen, da muss ich aber passen :(
Viele Grüße
Achim
Hallo,
kann ich ein Widget irgendwie komplett ausblenden? Hintergrund ist folgender. Bei uns gibt es 6 verschiedene Mülltermine, es sind aber immer nur maximal 2 an einem Tag. Ich habe in FHEM ein Dummy mit 6 Readings, in denen die Anzahl der Tage steht, bis zum nächsten Termin. Ich kann jetzt 6 Widgets für jede Müllart anlegen und auch das Icon "unsichtbar" machen. Damit bleibt aber ein leeres Feld in der Oberfläche. Ich würde da gerne nur Platz für 2 Mülltermine vorsehen und nur die zwei Termine anzeigen, die die kleinste Zahl haben, also am nächsten dran sind.
Hat da jemand eine Lösung/Lösungsansatz?
Viele Grüße
Achim
Hallo
ich versuche über push
<div data-type="push"
data-set="volumeDown"
data-icon="fa-volume-off"
data-background-icon="-"
data-device="squeezeKueche"
class="inline narrow"></div>
meinen Squeezeplayer dazu zu bewegen, ein set squeezeKueche volumeDown auszuführen.
Leider scheitere ich daran !
Habe das zwar mit switch gelöst
<div data-type="switch"
data-device="squeezeKueche"
ata-set-on="volumeDown"
data-set-off="volumeDown"
data-icon="fa-volume-off"
data-on-background-color="rgba(147, 147, 147, 0)"
data-off-background-color="rgba(147, 147, 147, 0)"
data-on-color="#aa6900"
data-off-color="#aa6900"
data-background-icon="fa-volume-off"
class="inline narrow"></div>
aber push müßte doch auch gehen , was mach ich hier falsch ?
Danke
klaus
Zitat von: kvo1 am 10 Januar 2016, 13:46:02
Hallo
ich versuche über push
<div data-type="push"
data-set="volumeDown"
data-icon="fa-volume-off"
data-background-icon="-"
data-device="squeezeKueche"
class="inline narrow"></div>
meinen Squeezeplayer dazu zu bewegen, ein set squeezeKueche volumeDown auszuführen.
Leider scheitere ich daran !
Habe das zwar mit switch gelöst
<div data-type="switch"
data-device="squeezeKueche"
ata-set-on="volumeDown"
data-set-off="volumeDown"
data-icon="fa-volume-off"
data-on-background-color="rgba(147, 147, 147, 0)"
data-off-background-color="rgba(147, 147, 147, 0)"
data-on-color="#aa6900"
data-off-color="#aa6900"
data-background-icon="fa-volume-off"
class="inline narrow"></div>
aber push müßte doch auch gehen , was mach ich hier falsch ?
Danke
klaus
<div data-type="push"
data-device="vsx_510"
data-set-on="volumeDown"
data-cmd="set"
data-icon="fa-volume-down"
class="bigger">
</div>Grüße^^
Genau: data-set-on ist der letzte Wert und darf nicht leer sein. Leere data-set-on bedeuten: nicht senden (sinnvoll beim Switch, um z.B nur ausschalten zu können, und nicht an)
Wenn man: "set Radio volume 50" senden will, ist data-set="volume" und data-set-on="50"
Dein Befehl ist die Kurzform von "set sqeezeKueche STATE volumeDown"
Ich hätte noch eine Idee für das Thermostat-Widget. Leider bin ich noch nicht fit in js-Programmierung, sonst würde ich es selbst probieren. :( Jedenfalls würde ich es sehr gut finden, wenn ich Temperaturlabel im Kreis ausblenden könnte. Mir gefällt das nicht so mitten in den Strichen drin und dann auch noch in der selben Farbe wie die Skalenstriche. Ich würde es eher unten zur Valveposition dazu setzen, oder sogar komplett ausblenden und die Info mit einem Label neben dran setzen. Jedenfalls wäre dann ein Attribut "TempLabel="hidden"" oder "TempLabel="UnderValve"" oder "TempLabel="OverValve"" oder so irgendwas in der Art genial. Und ich glaube es wäre gar nicht so schwer zu realisieren, oder?
Zitat von: persching am 10 Januar 2016, 14:36:25
Ich hätte noch eine Idee für das Thermostat-Widget. Leider bin ich noch nicht fit in js-Programmierung, sonst würde ich es selbst probieren. :( Jedenfalls würde ich es sehr gut finden, wenn ich Temperaturlabel im Kreis ausblenden könnte. Mir gefällt das nicht so mitten in den Strichen drin und dann auch noch in der selben Farbe wie die Skalenstriche. Ich würde es eher unten zur Valveposition dazu setzen, oder sogar komplett ausblenden und die Info mit einem Label neben dran setzen. Jedenfalls wäre dann ein Attribut "TempLabel="hidden"" oder "TempLabel="UnderValve"" oder "TempLabel="OverValve"" oder so irgendwas in der Art genial. Und ich glaube es wäre gar nicht so schwer zu realisieren, oder?
<div data-type="thermostat" data-device="HzKöTh" data-temp="" ..... </div>
<div data-type="label" data-device="HzKöTh" data-get"temperature"></div>Dann hast du es darunter
<div data-type="thermostat" data-device="HzKöTh" data-temp="" ..... class="inline"</div>
<div data-type="label" data-device="HzKöTh" data-get"temperature" class="inline"></div>Dann hast es daneben.
<div data-type="thermostat" data-device="HzKöTh" data-temp="" ..... </div>Dann hast du es gar nicht......
Grüße^^
Hi Roman,
wenn ich aber data-temp="" mache, dann habe ich auch nicht die schöne Färbung des Kreises. Auch wenn es nur der Teil zwischen der gewählten und der tatsächlichen Temperatur ist finde ich das schon eine schöne Sache.
Gruß persching
Zitat von: persching am 10 Januar 2016, 14:54:19
Hi Roman,
wenn ich aber data-temp="" mache, dann habe ich auch nicht die schöne Färbung des Kreises. Auch wenn es nur der Teil zwischen der gewählten und der tatsächlichen Temperatur ist finde ich das schon eine schöne Sache.
Gruß persching
Da hast du natürlich recht....
Ich für meinen Teil verwende das Thermostat-Widget nicht. Für mich lässt es sich auf meinen Tablets zu schwierig bzw. zu ungenau bedienen.
Grüße^^
@roman1528
wie machst du denn das?
Gruß Bert
Zitat von: bert am 10 Januar 2016, 15:24:43
@roman1528
wie machst du denn das?
Gruß Bert
Mein FTUI: http://goo.gl/1l6b10 (http://goo.gl/1l6b10)
Zitat von: setstate am 10 Januar 2016, 14:17:34
Genau: data-set-on ist der letzte Wert und darf nicht leer sein. Leere data-set-on bedeuten: nicht senden (sinnvoll beim Switch, um z.B nur ausschalten zu können, und nicht an)
Wenn man: "set Radio volume 50" senden will, ist data-set="volume" und data-set-on="50"
Dein Befehl ist die Kurzform von "set sqeezeKueche STATE volumeDown"
@setstate danke für die Erklärung
@roman
data-set-on="volumeUp" data-cmd="set" das war´s
gruss
klaus
Und da data-cmd="set" per default schon gesetzt ist, braucht man es nicht extra nochmal angeben. Nur wenn man es ändern will: z.B. data-cmd="setreading"
Hallo
(ist nicht wirklich ein FTUI Thema , sorry ! vlt. doch einer einen TIP)
ich lass aus 3 Kalender die Termine anzeigen , letzte Spalte zeigt für wem der Termin ist !
<table border="0px" width="100%">
<tr>
<td><div data-type="label" data-device="vocalview2" data-get="t_001_bdate" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_001_btime" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_001_edate" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_001_etime" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_001_summary" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="symbol" data-device="vocalview2"
data-get="t_001_source"
data-icons='["fa-female","fa-male","fa-users"]'
data-get-on='["Frau","Mann","Familie"]'
data-on-colors='["red","blue","green"]' class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="vocalview2" data-get="t_002_bdate" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_002_btime" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_002_edate" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_002_etime" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_002_summary" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="symbol" data-device="vocalview2"
data-get="t_002_source"
data-icons='["fa-female","fa-male","fa-users"]'
data-get-on='["Frau","Mann","Familie"]'
data-on-colors='["red","blue","green"]' class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="vocalview2" data-get="t_003_bdate" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_003_btime" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_003_edate" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_003_etime" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="label" data-device="vocalview2" data-get="t_003_summary" style="color:#AA6900" class="left"></div> </td>
<td><div data-type="symbol" data-device="vocalview2"
data-get="t_003_source"
data-icons='["fa-female","fa-male","fa-users"]'
data-get-on='["Frau","Mann","Familie"]'
data-on-colors='["red","blue","green"]' class="left"></div> </td>
</tr>
</table>
wie kann man den Abstand zwischen den Zeilen etwas kleiner machen ..... ?
Hallo,
mir kam gerade der Gedanke, ob man nicht die normale Darstellung des Thermostaten mit dem Fenster (Status geöffnet/geschlossen soll angezeigt werden) kombinieren könnte...
Wäre echt hilfreich und würde viel Platz sparen... versuche eine Minimaloberfläche auf nem 8 Zoll Tablet auf einer Seite zu gestalten.
Gruß Andreas
Hallo knochenmuehle,
würde da nicht ein kleiner farbiger Punkt innerhalb des Thermostates reichen? Grün für Fenster geschlossen, rot für Fenster offen?
Gruß persching
Zitat von: persching am 10 Januar 2016, 17:13:38
Hallo knochenmuehle,
würde da nicht ein kleiner farbiger Punkt innerhalb des Thermostates reichen? Grün für Fenster geschlossen, rot für Fenster offen?
ja klar, der würde auch reichen ... das war jetzt nur die Luxuxlösung für's Auge ...
Gruß Andreas
Jetzt brauchen wir nur noch das Know-How das Ganze umzusetzen! ;)
Ich hab mal rumprobiert um meine MAX! Stellregler einzubauen.
Die 'Fenster offen' Erkennung ergibt sich bei mir aus der angezeigten 5°C die ich so noch nie von Hand eingestellt habe.
<li data-row="4" data-col="2" data-sizex="1" data-sizey="1">
<header>MAX! Stellregler</header>
<div data-type="popup" data-height="350px" data-width="500px" class="">
<div data-type="push" data-icon="fs-max_heizungsthermostat" class="bigger"></div>
<div data-type="label" class="cell narrow">Wohnen</div><br>
<div data-type="label" data-device="MAX.HT01" data-get="desiredTemperature" data-unit="°C" class="cell narrow"></div>
<div class="dialog dialogTransparent">
<header class="dialogheaderTransparent">MAX! Stellregler - Bereich Wohnen</header>
<div class="top-space">
<div class="inline">
<div data-type="push" data-device="MAX.HT01" data-cmd="set" data-set-on="desiredTemperature eco" data-off-color="#00FF00" data-icon="oa-time_eco_mode" class="bigger"></div>
<div data-type="label" class="cell narrow">eco</div>
</div>
<div class="inline">
<div data-type="push" data-device="MAX.HT01" data-cmd="set" data-set-on="desiredTemperature boost" data-off-color="#FF0000" data-icon="fs-sani_heating_boost" class="bigger"></div>
<div data-type="label" class="cell narrow">boost</div>
</div>
<div class="inline">
<div data-type="push" data-device="MAX.HT01" data-cmd="set" data-set-on="desiredTemperature comfort" data-off-color="#FF0000" data-icon="oa-sani_heating_manual" class="bigger"></div>
<div data-type="label" class="cell narrow">comfort</div>
</div>
<div class="inline">
<div data-type="push" data-device="MAX.HT01" data-cmd="set" data-set-on="desiredTemperature auto" data-off-color="#FF0000" data-icon="oa-sani_heating_automatic" class="bigger"></div>
<div data-type="label" class="cell narrow">auto</div>
</div>
<div class="inline">
<div data-type="push" data-device="MAX.HT01" data-cmd="set" data-set-on="desiredTemperature off" data-off-color="#0000FF" data-icon="fa-power-off" class="bigger"></div>
<div data-type="label" class="cell narrow">off</div>
</div>
<div class="inline">
<div data-type="label" class="cell narrow">Batterie</div>
<div data-type="symbol" data-device="MAX.HT01" data-get="battery" data-icons='["fa-circle","fa-circle"]' data-get-on='["ok","low"]' data-on-colors='["green","red"]' style="font-size:2em"></div>
<div data-type="label" data-device="MAX.HT01" data-get="battery"></div>
</div>
<div class="cell hue-tick hue-front big top-space-2" data-type="thermostat" data-device="MAX.HT01" data-valve="valveposition" data-min="4" data-off="off" data-max="31" data-boost="boostclass" data-get="desiredTemperature" data-temp="temperature"></div>
</div>
</div>
</li>
PS: data-get auf 'desiredTemperature' geändert, macht irgendwie mehr Sinn.
<div data-type="label" data-device="MAX.HT01" data-get="desiredTemperature" data-unit="°C" class="cell narrow"></div>
Hallo setstate, waschbaerbauch,
ganz lieben Dank für Euren Input. Bin leider das WE unterwegs und werde die Tipps erst in der kommenden Woche umsetzen/anwenden können. Selfhtml gibt es noch und da werde ich mich mal etwas einlesen...
Nochmals danke und bis bald,
Christian
Hallo waschbaerbauch,
würdest Du ev. bitte den FTUI Code für das Thermostat posten !
Wäre meine nächste Baustelle!
Danke
Moin kvo1,
aber selbstverständlich - ist doch alles ein Geben und Nehmen ;)
Hab den Code beim Screenshot hinterlegt.
Gruß
Mario
Zitat von: bert am 22 Dezember 2015, 13:27:49
@setstate
Ich kämpfe immer noch mit meinem Layout. Ich habe viele Stellen an denen ich mit class="col-1-2" und class="col-1-3" hantiere.
Nach dem Wegfall von "float: left;" klappt es nicht mehr.
Im Code habe ich darauf geachtet, dass kein Platz "verschwendet" wird. Das obere Bild zeigt das "gute Layout", das untere dasselbe ohne "float: left;" in der CSS, bei gleichem Code. Ich vermute, dass ich das mit dem "col-..." nicht richtig verstanden habe.
Gruß Bert
<!-- WZ -->
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header><font size="+1">Wohnzimmer </font><div data-type="label" data-device="FTR_WZ" data-get="temperature" class="inline" data-limits='[18,20,23]' data-colors='["#6699FF","#aa6900","#ff6242"]' data-unit="°C" ></div></header>
<div class="container top-space">
<div class="col-1-2">
<div class="container top-space">
<div class="col-1-3">
<div data-type="dimmer" data-device="Wohnen_Lampe_oben" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Oben</div>
<div data-type="dimmer" data-device="Wohnen_Lampe_Tür" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Tür</div>
</div>
<div class="col-1-3">
<div data-type="dimmer" data-device="Wohnen_Lampe_hinten" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Hinten</div>
<div data-type="dimmer" data-device="Wohnen_Lampe_vorne" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Vorne</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Wohnen_Blumen_Lampe" data-get-on='B0|an|on' data-get-off='BI|aus|off' data-set-on='B0' data-set-off='BI' ></div>
<div data-type="label" class="darker">Blumen</div>
<div data-type="dimmer" data-device="Wohnen_Kamin_Licht" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div data-type="label" class="darker">Kamin</div>
</div>
</div>
</div>
<div class="centered">
<div data-type="thermostat" data-device="FTR_WZ" data-get="temperature" data-temp="setpointTemp" data-fix="1" data-step="0.1" class=""></div>
</div>
</div>
</li>
Kann mir da jemand hefen?
Gruß Bert
Zitat von: setstate am 16 Dezember 2015, 16:31:46
data-fix="2"
Hallo setstate.
Trotz data-fix sind es noch immer 16 nachkommastellen. Woran kann das liegen?
<td>Gas heute:</td>
<div style="font-size:20px" data-type="label" data-device="Gasverbrauch" data-get="countsPerDay" data-limits='[0,250,375]' data-colors='["#33cc33","#ffff00","#FF0000"]' data-unit=" Euro" data-substitu
tion="trim()*0.004" data-fix="2" class="cell"></div>
Hallo Bert,
ich habe etwas dran herum "geschraubt":
<!-- WZ -->
<li data-row="1" data-col="2" data-sizex="3" data-sizey="2">
<header><font size="+1">Wohnzimmer </font><div data-type="label" data-device="FTR_WZ" data-get="temperature" class="inline" data-limits='[18,20,23]' data-colors='["#6699FF","#aa6900","#ff6242"]' data-unit="°C" ></div></header>
<div class="row top-space-2x">
<div class="col-1-2">
<div class="row">
<div class="col-1-3">
<div data-type="dimmer" data-device="Wohnen_Lampe_oben" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div class="darker top-space bottom-space">Oben</div>
<div data-type="dimmer" data-device="Wohnen_Lampe_Tür" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div class="darker top-space">Tür</div>
</div>
<div class="col-1-3">
<div data-type="dimmer" data-device="Wohnen_Lampe_hinten" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div class="darker top-space bottom-space">Hinten</div>
<div data-type="dimmer" data-device="Wohnen_Lampe_vorne" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div class="darker top-space">Vorne</div>
</div>
<div class="col-1-3">
<div data-type="switch" data-device="Wohnen_Blumen_Lampe" data-get-on='B0|an|on' data-get-off='BI|aus|off' data-set-on='B0' data-set-off='BI' ></div>
<div class="darker top-space bottom-space">Blumen</div>
<div data-type="dimmer" data-device="Wohnen_Kamin_Licht" data-get="dim" data-get-off="0" data-get-on="[1-9][0-9]*" data-set-on="on" data-set-off="off" data-dim="dim" data-min="0" data-max="100"></div>
<div class="darker top-space">Kamin</div>
</div>
</div>
</div>
<div class="col-1-2">
<div data-type="thermostat" data-device="FTR_WZ" data-get="temperature" data-temp="setpointTemp" data-fix="1" data-step="0.1" class=""></div>
</div>
</div>
</li>
Du hast das System von col-1-3 schon verstanden, aber die Browser-Renderer haben das nicht richtig im Zusammenhang mit inline-block".
Man muss die % etwas kürzen, damit man nicht an die 100% ran reicht, dann klappt es .
Ändere mal in der CSS col-1-3 zu:
.col-1-3 { width: 32% !important; }
Die anderen % hatte ich schon gekürzt, 1/3 noch nicht.
@netbus:
das liegt an der Reihenfolge der Funktionsaufrufe. Tausche mal Zeile 83 mit 84 in der widget_label.js
val = base.update_fix(val, elem.data('fix'));
val = base.update_substitution(val, elem.data('substitution'));
Zitat von: MrWishbone am 07 Januar 2016, 19:29:09
Hallo setstate,
ich habe die ganze Zeit gedacht, dass ich die Regulären Ausrücke im Bezug auf die Slider nicht verstanden haben, habe jetzt aber festgestellt, dass es sich hierbei anscheinend um einen Bug handelt.
Ein Slider in einem Popup zeigt keine Werte an, egal ob per RegEx oder ohne. Der selber Slider funktioniert außerhalb des Popups Fehlerfrei.
Wenn ich das Popup während des Ladevorgangs geöffnet bekomme, dann schafft es der Slider anscheinen die Daten zu laden.
Ebenso scheint es so zu sein, dass wenn ich während das Popup auf ist und ich überschreibe den Wert in Fhem, dann wird ebenfalls der Wert geladen.
Das Problem liegt in der Implementierung der Powerange Lib, die das Slider Widget nutzt.
Bei einigen Berechnungen wird der Paremeter "offsetHeight" herangezogen. Der ist aber bei Elementen, die nicht sichtbar sind, gleich 0. Slider auf dem Popup sind unsichtbar und die Position des Reglers wird falsch berechnet.
Ich habe jetzt einen Workaround beim Slider eingebaut, der die Wertsetzung des Sliders nach dem Sichbarwerden auf einem Popdialog wiederholt.
Zitat von: Stril am 22 Dezember 2015, 17:08:18
Hallo!
Kennt ihr eine Möglichkeit, nach einer Zeit immer auf die Startseite zurück zu wechseln nach Inaktivität?
Also via Pagetab diverse Unterseiten und nach einigen Minuten auf die "Basis-Page" zurück wäre optimal
Was ich versucht habe:
<meta http-equiv="refresh" content="3; URL=/fhem/tablet/index_ipm.html#index_body_ipm.html">
--> Das wird aber nur ausgeführt, wenn ich es in die index.html packe - nicht, wenn ich es in die Unterseiten-Heads packe.
Danke für eure Hilfe!
Gruß
Phil
nach
Update ist das jetzt möglich:
Pagetab kennt jetzt
data-return-time (Zeit in Sekunden). Diese Parameter muss beim ersten Pagetab (Hauptseite) platziert werden.
Wenn eine Unterseite angeklickt wurde und die gegebene Zeit abgelaufen ist, wird wieder zurück zur Hauptseite gesprungen.
Ich spiele gerade mit einem Popup rum auf dem ich u.a. einen Slider habe.
1.) Kann ich das Popup fixieren, so dass es sich nicht mit dem Slide-Vorgang gleichzeitig verschiebt?
So ist derzeit der Slider bei mir im Popup nicht zu gebrauchen.
2. Wie bekomme ich den Button Details (vgl. Anhang)
a) als Button (also mit Rahmen)
b) zentriert im Feld dargestellt?
Mein Code:
<li data-row="3" data-col="2" data-sizex="1" data-sizey="1">
<header>Leuchtkästen alle</header>
<div data-type="switch"
data-device="eg_ki_Leuchtkasten_alle.schalten"
data-get="state"
data-set=""
data-set-on="on"
data-set-off="off"
data-icon="fa-lightbulb-o"
class="cell">
</div>
<div data-type="popup" data-height="600px" data-width="800px">
<div data-type="link" class="round top-space center left-space"
data-width="20"
data-height="10"
data-color="grey"
data-icon="fa-server">Details
</div>
<div class="dialog">
<header>Leuchtkasten rechts</header>
<div class="top-space">
<div class="inline centered">
<div data-type="slider"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-min="0"
data-max="100"
data-on="0!"
data-off="0"
data-width="180"
class="horizontal">
</div>
<div data-type="label"
class="narrow darker">Helligkeit
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-set-on="0"
data-icon="oa-light_light_dim_00"
class="cell">
</div>
<div data-type="label"
class="narrow darker">AUS
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-set-on="35"
data-icon="oa-light_light_dim_10"
class="cell">
</div>
<div data-type="label"
class="narrow darker">Perfekt
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-set-on="100"
data-icon="oa-light_light_dim_100"
class="cell">
</div>
<div data-type="label"
class="narrow darker">AN
</div>
</div>
<header>Leuchtkasten rechts</header>
<div class="top-space">
<div class="inline centered">
<div data-type="slider"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-min="0"
data-max="100"
data-on="0!"
data-off="0"
data-width="180"
class="horizontal">
</div>
<div data-type="label"
class="narrow darker">Helligkeit
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-set-on="0"
data-icon="oa-light_light_dim_00"
class="cell">
</div>
<div data-type="label"
class="narrow darker">AUS
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-set-on="35"
data-icon="oa-light_light_dim_10"
class="cell">
</div>
<div data-type="label"
class="narrow darker">Perfekt
</div>
</div>
<div class="inline">
<div data-type="push"
data-device="eg_ki_Leuchtkasten_1m_rechts"
data-set-on="100"
data-icon="oa-light_light_dim_100"
class="cell">
</div>
<div data-type="label"
class="narrow darker">AN
</div>
</div>
</div>
</div>
</div>
</li>
Zitatnach Update ist das jetzt möglich:
Pagetab kennt jetzt data-return-time (Zeit in Sekunden). Diese Parameter muss beim ersten Pagetab (Hauptseite) platziert werden.
Wenn eine Unterseite angeklickt wurde und die gegebene Zeit abgelaufen ist, wird wieder zurück zur Hauptseite gesprungen.
Coooool ;)
Danke
klaus
/EDIT/ gut wäre natürlich wenn die "data-return-time" getriggert würde, also solange man sich in den Untermenüs bewegt soll die
Zeit nicht laufen , erst wenn ich "data-return-time" keine Eingabe/Auswahl getätigt habe soll diese loslaufen !
@Gunter:
1.: Seit dem Update von gestern geht das: <div data-type="popup" data-draggable="false"
2.: <div data-type="link" class="round"
data-color="white"
data-background-color="green"
data-icon="fa-server">Details</div>
oder
<div data-type="link" class="round"
data-color="grey"
data-border-color="grey"
data-icon="fa-server">Details</div>
Danke für die schnelle Antwort. Klappt leider nicht...
<div data-type="popup" data-draggable="false" data-height="600px" data-width="800px">
Edit: Im Webbrowser verschiebt sich das Popup weiterhin. Auf dem Tablet nicht. Der Slider ist dort aber kaum zu bedienen. Er reagiert nur ganz selten. (klingt komisch, ist aber so... ;-) )
Das kann ich so bestätigen. Allerdings ändert es bei mir auch nichts auf dem Tablet, wenn man z.B. den Heizungsregler im Popup bedient ob da
<div data-type="popup" data-draggable="false" data-height="600px" data-width="800px"> eingetragen ist oder nicht.
Laptop -> Maustaste auf den Slider -> Popup wandert mit nach links und rechts
Tablet -> Finger auf dem Slider -> Popup bleibt auf der Stelle wie es soll
Zitat/EDIT/ gut wäre natürlich wenn die "data-return-time" getriggert würde, also solange man sich in den Untermenüs bewegt soll die
Zeit nicht laufen , erst wenn ich "data-return-time" keine Eingabe/Auswahl getätigt habe soll diese loslaufen !
Den Gedanken hatte ich auch schon und habe noch etwas weiter gebaut. Funktioniert soweit, ich teste aber erst noch etwas mehr ...
Hallo waschbaerbauch,
habe mal dein MAX! Stellungsregler Beispiel ausprobiert.
Super gemacht, tolle Idee.
2 Probleme habe ich damit auf meinem Tablet.
Nicht nur dass sich bei mir das PopUp bewegt wenn ich die Temperatur einstellen möchte,
nein auch wenn ich das PopUp schließe und neben das Icon tippe dann sendet das Tablet desiredTemperature eco, desiredTemperature boost etc.
Links vom icon tippen von oben nach unten, eco, boost, comfort, auto.
Aber dieses Phänomen tritt erst nach dem erstmaligen öffnen der PopUps auf.
Ich hoffe das dies nur bei mir so ist und der Fehler bei mir liegt.
Stellt euch vor das würde bei jedem PopUp so sein?
Könnt Ihr mal prüfen ob dieses Phänomen auch bei euch auftritt?
Auch bei andern PopUps?
Ich habe nur diese.
Gruß
Ralf
Zitat von: knochenmuehle am 10 Januar 2016, 17:00:57
Hallo,
mir kam gerade der Gedanke, ob man nicht die normale Darstellung des Thermostaten mit dem Fenster (Status geöffnet/geschlossen soll angezeigt werden) kombinieren könnte...
Wäre echt hilfreich und würde viel Platz sparen... versuche eine Minimaloberfläche auf nem 8 Zoll Tablet auf einer Seite zu gestalten.
Gruß Andreas
keiner eine Idee?
Andreas
Zitat von: knochenmuehle am 12 Januar 2016, 05:47:48
keiner eine Idee?
Andreas
Kombinieren? Man kann kann jedes Widget mit anderen kombinieren.
Mach das Fenster Symbol klein und farblich passend zur deiner Minimalvariante und positioniere es per CSS ganz nah/ überlappend zum Thermostat Widget.
hi @all ,@Roman
auf die Gefahr hin das es langsam hier recht unübersichtlich wird ,frage ich mal hier : ( ...oder sollten für Fragen zum Tablet UI jeweils neue threads eröffnet werden ?)
Ich probiere gerade am Beispiel von Roman´s Demo die Größe auf ein iPad optimal anzupassen :
dachte das funktioniert hier in der index.html
<meta name="widget_base_width" content="138">
<meta name="widget_base_height" content="155">
leider bekomme ich das da nicht gelöst :-( Denke das liegt am Hintergrund ( Farbverlauf ) ,da dieser sich da nicht in der Größe verändern lässt ...
Habt ihr einen Tip ?
Zitat von: Aladin222 am 12 Januar 2016, 09:15:01
hi @all ,@Roman
auf die Gefahr hin das es langsam hier recht unübersichtlich wird ,frage ich mal hier : ( ...oder sollten für Fragen zum Tablet UI jeweils neue threads eröffnet werden ?)
Ich probiere gerade am Beispiel von Roman´s Demo die Größe auf ein iPad optimal anzupassen :
dachte das funktioniert hier in der index.html
<meta name="widget_base_width" content="138">
<meta name="widget_base_height" content="155">
leider bekomme ich das da nicht gelöst :-( Denke das liegt am Hintergrund ( Farbverlauf ) ,da dieser sich da nicht in der Größe verändern lässt ...
Habt ihr einen Tip ?
Bei Tante Google oder wo du deine Bilder auch immer her bekommst ein Bild raussuchen, dass genau der Anzeige-Auflösung deines Device entspricht.
Mit "widget_base_width/height" änderst du nur die Grundgröße der einzelnen <gridster>-Elemente. Nicht die der Gesamtseite.
Dieses tust du um einen gleichmäßigen Außenrand zu bekommen. Kannst sie natürlich auch kleiner machen... Dann bekommst du mehr elemente auf eine Seite, allerdings müssen dann die eigentlich Widgets auch immer kleiner werden, was bis zur Unbedienbarkeit führt.
Grüße^^
P.S.... Wenn ihr mich hier anschreibt bekomme ich das in 99% der Fälle nicht mit. Schreibt mir eine PN oder nutzt die Kommentarfunktion auf meiner Seite.
Servus zusammen!
Ich möchte auf einer pagetab-Seite gerne eine Karte mit der aktuellen Verkehrslage einbinden. Ausgesucht hab ich mir dazu schlichtweg Google Maps.
Leider funzt der von mir im Netz zusammengeklaute Code nicht in Verbindung mit Pagetab. Ich vermute, dass beim Pagetab kein wirklicher "Reload" der Seite angestossen wird und deshalb das Script nicht gezündet wird. Hat jemand eine Idee, wie man das hinbekommen könnte?
style>
html, body, #map-canvas {
margin: 0;
padding: 0;
height: 702px;
width: 486px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.13&sensor=false"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 9,
disableDefaultUI: true,
center: new google.maps.LatLng(53.5333, -113.5000),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
window.setInterval(function(){initialize();}, 60000);
</script>
</head>
<body>
<div id="map-canvas" ></div>
</body>
</html>
Zitat von: tomster am 12 Januar 2016, 11:44:05
Servus zusammen!
Ich möchte auf einer pagetab-Seite gerne eine Karte mit der aktuellen Verkehrslage einbinden. Ausgesucht hab ich mir dazu schlichtweg Google Maps.
Leider funzt der von mir im Netz zusammengeklaute Code nicht in Verbindung mit Pagetab. Ich vermute, dass beim Pagetab kein wirklicher "Reload" der Seite angestossen wird und deshalb das Script nicht gezündet wird. Hat jemand eine Idee, wie man das hinbekommen könnte?
style>
html, body, #map-canvas {
margin: 0;
padding: 0;
height: 702px;
width: 486px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.13&sensor=false"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 9,
disableDefaultUI: true,
center: new google.maps.LatLng(53.5333, -113.5000),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
window.setInterval(function(){initialize();}, 60000);
</script>
</head>
<body>
<div id="map-canvas" ></div>
</body>
</html>
PageTab lädt die aufgerufene seite jedes mal neu... Also quasi schon ein ReLoad.
PageTab lädt allerdings nur all das nach, was im <body>-Tag steht! Deswegen brauch man bei Verwendung von PageTab ja auch nur in der allerersten Seite (index.html) einen <head>-Tag definieren. Auf den Unterseiten nicht.
Du kannst aber in einer PageTab-Unterseite einen iframe (data-type="iframe") einbauen und dort eine vollständige! verkehr.html aufrufen in der dein Script und die Ausgabe dazu läuft.
Grüße^^
Klar, so geht's auch. Hatte das iframe-widget gar nicht mehr auf dem Schirm...
Danke!
Frage zu Thermostat Widget:
Ich verwende MAX-Thermostate, möchte allerdings bei der Anzeige der Ist-Temperatur ein anderes Device verwenden.
Ich habe jetzt testweise den Code des Thermostat-Widgets so angepasst, dass man bei data-temp das Reading über DEVICE:READING angeben kann.
...
// alt (Zeile 13)
// var val_temp = getDeviceValue( device, 'temp');
// neu
var deviceName = device.data('device');
var tempParam = device.data('temp');
// optional "external" temp sensor defined by DEVICE:reading regex
if (tempParam.match(/:/))
deviceName = tempParam;
var val_temp = getDeviceValueByName( deviceName, device.data('temp'));
...
<div
data-type="thermostat"
data-device="EG.wz.HZ"
data-valve="valveposition"
data-get="desiredTemperature"
data-temp="EG.wz.TF:temperature"
data-set="desiredTemperature",
data-step="0.5"
class="big">
</div>
Gibt es diese Möglichkeit eventuell bereits eine andere Möglichkeit dies zu realisieren (ohne dummys, userReading und Co.)?
Vielleicht könnte man ja die Änderung auch mit übernehmen?
Danke,
Gruß
Hulzer
Zitat von: pnewman am 12 Januar 2016, 02:33:35
Hallo waschbaerbauch,
habe mal dein MAX! Stellungsregler Beispiel ausprobiert.
Super gemacht, tolle Idee.
2 Probleme habe ich damit auf meinem Tablet.
Nicht nur dass sich bei mir das PopUp bewegt wenn ich die Temperatur einstellen möchte,
nein auch wenn ich das PopUp schließe und neben das Icon tippe dann sendet das Tablet desiredTemperature eco, desiredTemperature boost etc.
Links vom icon tippen von oben nach unten, eco, boost, comfort, auto.
Aber dieses Phänomen tritt erst nach dem erstmaligen öffnen der PopUps auf.
Ich hoffe das dies nur bei mir so ist und der Fehler bei mir liegt.
Stellt euch vor das würde bei jedem PopUp so sein?
Könnt Ihr mal prüfen ob dieses Phänomen auch bei euch auftritt?
Auch bei andern PopUps?
Ich habe nur diese.
Gruß
Ralf
Moin Ralf,
nachdem du das so geschildert hast hab ich mal hier rumprobiert. Also bei mir wandert das Popup nach links/rechts, je nachdem wohin man den Regler bewegt mit der Maus (am Desktop). Auf boost, off und min scheint es zu stellen wenn ich rechts (boost) links (min) jeweils unterhalb des Skalaendes und unter dem valveWert (off) klicke. Wenn ich einfach das Popup schließe kann ich es nicht nachvollziehen.
Gruß
Mario
ich habe auf meinen beiden Tablets das problem das die popups nicht zentriert werden sondern rechts aus dem bildschirm rausschauen.
manchmal werden sie beim aller ersten popup nach einem kompletten reboot zentriert. aber sogar das ist selten.
hat jemand eine idee woran das liegt?
gruss
andre
Zitat von: setstate am 09 Januar 2016, 22:48:30
"button" ist aus dem nesges-Repo, scheint aber nicht mehr kompatibel zu sein, es erscheint immer nur der Background, das Icon fehlt.
"pagebutton" ist dem am ähnlichsten, man kann aber auch das Basis Widget aller Schalter direkt nutzen -> "famultibutton"
data-type="famultibutton"
https://github.com/knowthelist/fhem-tablet-ui#pagebutton-widgets
Hi setstate,
ich hatte grad mal 'button' gegen 'pagebutton' bzw. 'famultibutton' getauscht. Kann man denen denn genauso Farben mitgeben? Wenn ich lediglich den data-type ändere scheint er die mit 'button' genutzten Farben nicht zu nutzen bzw. verwenden zu können.
PS: Also bei mir laden sie ja für gewöhnlich, manchmal benötigt man allerdings mehrere reloads. Ich bin mir allerdings nicht sicher ob es am button liegt oder am 'integrierten' Webserver. Zum testen hab ich mir mal (mit meinem beschränkten Wissen) einen LAMPP Webserver installiert und meine html Dateien dann unter /opt/lampp/htdocs/fhem/www/tablet abgelegt. Die Seiten werden dann immer geladen, die Buttons machen (bisher) keine Probleme, allerdings lädt er so natürlich nicht die Werte aus dem FHEM in die Seiten ein. Das wäre noch eine Baustelle wo ich mal gucken muss wie ich das dem Apache beibringen kann..
kann man gar nicht die FHEM eigenen Icons nutzen? Also die im images Ordner von FHEM?
Nur diese? http://fortawesome.github.io/Font-Awesome/icons/
Mein Smartphone nimmt die orginale FHEM App mit den orginalen Icons daher wöllte ich am TUI gern die gleichen verwenden.
Weiterhin gibt es dort schönere als die fpr TUI vorgesehenen(Mehrere Türen und Fenster, Rasenroboter, Garagen)
Doch kann man - je nachdem welche es sind mit 'oa-', 'fs-' oder 'fa-'.
PS: Da bin ich aber auch erst drauf gekommen, nachdem ich Stunden im Netz geguckt hab und diverse Versuche gestartet hatte mir einen personalisierten Icon-Font zu bauen ;)
Damit du diese nutzen kannst musst du sie natürlich vorher einbinden.
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css">
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css">
PPS: FTUI Wiki (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Icon-Konfiguration)
vielen Dank
Zitat von: waschbaerbauch am 12 Januar 2016, 17:23:23
Doch kann man - je nachdem welche es sind mit 'oa-', 'fs-' oder 'fa-'.
PS: Da bin ich aber auch erst drauf gekommen, nachdem ich Stunden im Netz geguckt hab und diverse Versuche gestartet hatte mir einen personalisierten Icon-Font zu bauen ;)
Damit du diese nutzen kannst musst du sie natürlich vorher einbinden.
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css">
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css">
PPS: FTUI Wiki (http://www.fhemwiki.de/wiki/FHEM_Tablet_UI#Icon-Konfiguration)
Zitat von: setstate am 12 Januar 2016, 07:10:49
Kombinieren? Man kann kann jedes Widget mit anderen kombinieren.
Mach das Fenster Symbol klein und farblich passend zur deiner Minimalvariante und positioniere es per CSS ganz nah/ überlappend zum Thermostat Widget.
Habs jetzt einfach mit in den Header übernommen und den Text nach links geschoben ...
<header align=left>Schlafzimmer<div data-type="symbol" data-device="MK_Schlafzimmer" class="small right"></div></header>
<div class="container">
<div data-type="thermostat" data-device="RT_SZ_1_Clima" data-valve="ValvePosition" class="cell"></div>
</div>
so reicht's mir
Gruß Andreas
Gibt es eine Übersicht über die ganzen Formatierungsmöglichkeiten?
Also, was macht
col-1-2 left
narrow darker
...
Woran kann ich erkennen, welche es gibt und was ich damit machen kann?
Edit: zumindest habe ich schonmal die class Einträge im wiki gefunden. Dann bleibt vermutlich nur testen... :-)
Zitat von: kvo1 am 11 Januar 2016, 23:47:00
gut wäre natürlich wenn die "data-return-time" getriggert würde, also solange man sich in den Untermenüs bewegt soll die
Zeit nicht laufen , erst wenn ich "data-return-time" keine Eingabe/Auswahl getätigt habe soll diese loslaufen !
Update beim Pagetab: erst wenn nichts mehr gedrückt wird, auf dem Subtabs, läuft der Countdown zum Rücksprung zum Maintab los.
ZitatUpdate beim Pagetab: erst wenn nichts mehr gedrückt wird, auf dem Subtabs, läuft der Countdown zum Rücksprung zum Maintab los.
PERFEKT !
Danke Klaus
Zitat von: roman1528 am 12 Januar 2016, 12:45:40
PageTab lädt die aufgerufene seite jedes mal neu... Also quasi schon ein ReLoad.
PageTab lädt allerdings nur all das nach, was im <body>-Tag steht! Deswegen brauch man bei Verwendung von PageTab ja auch nur in der allerersten Seite (index.html) einen <head>-Tag definieren. Auf den Unterseiten nicht.
Du kannst aber in einer PageTab-Unterseite einen iframe (data-type="iframe") einbauen und dort eine vollständige! verkehr.html aufrufen in der dein Script und die Ausgabe dazu läuft.
Grüße^^
Hallo tomster,
ich versuche auch die Verkehrslage einzubinden, aber bisher :(
Hast Du das hinbekommen wie roman1528 es beschrieben hat ?
Gruß
Zitat von: kumue am 12 Januar 2016, 21:35:33
Hallo tomster,
ich versuche auch die Verkehrslage einzubinden, aber bisher :(
Hast Du das hinbekommen wie roman1528 es beschrieben hat ?
Gruß
Yepp, piece of cake nach dem Hinweis von Roman:
1. googlemaps.html
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
margin: 0;
padding: 0;
height: 560px;
width: 710px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.13&sensor=false"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 9,
disableDefaultUI: true,
center: new google.maps.LatLng(47.6555492,11.6689186),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
window.setInterval(function(){initialize();}, 60000);
</script>
</head>
<body>
<div id="map-canvas" ></div>
</body>
</html>2. Entsprechender Eintrag auf der gewünschten Seite:
<li data-row="3" data-col="2" data-sizex="10" data-sizey="8">
<header>VERKEHRSLAGE</header>
<div data-type="iframe"
data-src="googlemaps.html"
data-width="710"
data-height="560">
</div>
</li>
auch eine Anfängerfrage, deren Antwort ich nicht ergoogeln konnte.... erschießt mich nicht gleich....
Wie speichere ich die Position von verschobenen Fenstern(Raumen) in ftui ab?
Das Verschieben solltest DU sperren. Meiner Ansicht nach kannst Du das nicht abspeichern.
Zitat von: setstate am 09 Januar 2016, 20:59:21
Das Popup schließt sich beim Klicken auf den Hintergrundschatten und beim Klick auf das X des Fensters. Also muss man dieses Event beim Drücken auf deinen Button auslösen:
- Close-Element selektieren -> $('.dialog-close')
- Klick Event triggern -> trigger('click')
onclick="$('.dialog-close').trigger('click');"
Ein komplettes Beispiel:
<li data-row="5" data-col="1" data-sizex="3" data-sizey="3">
<header>EXAMPLE2</header>
<!-- place your widget here -->
<div data-type="popup" data-height="400px" data-width="200px">
<div data-type="link" class="large thin">Show Temperatur</div>
<div class="dialog">
<header>DIALOG</header>
<div class="top-space">
<div class="newline">
<div data-type="label" data-device="THSensorWZ" data-get="temperature" data-limits='[-73,19,23]' data-colors='["#6699FF","#aa6900","#bb6242"]' data-unit="%B0C%0A" class="bigger thin"></div>
<div data-type="label" class="cell">Temperatur</div>
</div>
<div class="newline">
<div data-type="label" data-device="THSensorWZ" data-fix="0" data-part="4" data-limits='[0,40,60]' data-colors='["#bb6242","#aa6900","#bb6242"]' data-unit="%" class="bigger thin"></div>
<div data-type="label" class="cell">Luftfeuchte</div>
</div>
<div data-type="link" class="round top-space-3x left-space-2x"
data-width="130" data-height="50"
data-color="white"
data-background-color="green"
data-icon="fa-check"
onclick="$('.dialog-close').trigger('click');">OK</div>
</div>
</div>
</div>
</li>
Vielen vielen Dank! Habe es leider übersehen...
Das läuft.
Grüße^^
Zitat von: setstate am 12 Januar 2016, 20:55:00
Update beim Pagetab: erst wenn nichts mehr gedrückt wird, auf dem Subtabs, läuft der Countdown zum Rücksprung zum Maintab los.
Irgendwie steig ich durch die Pagetab-Nummer nicht so recht durch...
Seit dem Update zu "return-to-maintab-after-inactivity" scheint wieder etwas an der Funktionalität geändert worden sein.
Ich bin davon ausgegangen, dass in der index.html neben den Header-includes nur z.B. menu.html mit den Pagetabs angegeben werden muss. Beim Aufruf sollte dann automatisch auf den 1. pagetab-Link weitergeleitet werden.
Seit dem o.g. Update bleibt bei mir nun die index.html beim Einblenden des Inhalts von menu.html stehen.
Bug oder neue Funktionalität?
Zitat von: tomster am 12 Januar 2016, 23:07:00
Irgendwie steig ich durch die Pagetab-Nummer nicht so recht durch...
Seit dem Update zu "return-to-maintab-after-inactivity" scheint wieder etwas an der Funktionalität geändert worden sein.
Ich bin davon ausgegangen, dass in der index.html neben den Header-includes nur z.B. menu.html mit den Pagetabs angegeben werden muss. Beim Aufruf sollte dann automatisch auf den 1. pagetab-Link weitergeleitet werden.
Seit dem o.g. Update bleibt bei mir nun die index.html beim Einblenden des Inhalts von menu.html stehen.
Bug oder neue Funktionalität?
So war es und ist es auch immer noch. Daran habe ich nichts geändert. Evtl. musst du den Cache löschen (was sinnvolleres fällt mir im Moment auch nicht ein)
Irgendsowas war's wohl... Cache-leeren und Neustart hat's getan. Sorry für den Aufstand ;-)
Hallo,
ich habe hier noch einen offenen Thread mit der Farbe vom Select-Hintergrund.
forum.fhem.de/index.php?topic=47047.new;topicseen (http://forum.fhem.de/index.php?topic=47047.new;topicseen)
Kann mir das einer beantworten?
Gruß
TWART016
Zitat von: tomster am 12 Januar 2016, 21:50:23
Yepp, piece of cake nach dem Hinweis von Roman:
1. googlemaps.html
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
margin: 0;
padding: 0;
height: 560px;
width: 710px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.13&sensor=false"></script>
<script>
var map;
function initialize() {
var mapOptions = {
zoom: 9,
disableDefaultUI: true,
center: new google.maps.LatLng(47.6555492,11.6689186),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
var trafficLayer = new google.maps.TrafficLayer();
trafficLayer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
window.setInterval(function(){initialize();}, 60000);
</script>
</head>
<body>
<div id="map-canvas" ></div>
</body>
</html>
2. Entsprechender Eintrag auf der gewünschten Seite:
<li data-row="3" data-col="2" data-sizex="10" data-sizey="8">
<header>VERKEHRSLAGE</header>
<div data-type="iframe"
data-src="googlemaps.html"
data-width="710"
data-height="560">
</div>
</li>
Servus Tomster,
funktioniert wunderbar !
Danke Dir !
@setstate
Nur als kleiner Kosmetiktipp:
Wenn Du das nächste Mal zufällig am widget_weather.js zu tun hast, füge doch bitte noch eine Zeile
"Schneeschauer": 'snowflurries.png',
bei den PROPLANTA-DEFs ein. (Zumindest) das Reading scheint zu noch fehlen. Mir schmeisst's die Zeile nach jedem Update wieder raus...
Danke & LG
P.S. Ist beim Update der FA-Icons etwas durcheinander geraten? Mir fehlen einige Icons...
Bei mir sind alle FontAwesome-Icons weg^^
Hatte das mal versucht selbst zu updaten durch einfachen einfügen der fa-Files. 3 Tage gings gut danach war alles futsch... so wie jetzt...
Grüße^^
Hast du heute ein FTUI Update angestoßen? Ich habe heute morgen auf FA 4.5 upgraded.
Gibt es noch andere mit einem Problem damit?
Wenn ja, muss ich doch noch die Font Awesome CSS anpassen. Die dort genutzten ? in der URL konnte Fhem früher nicht verarbeiten. Ich hatte gehofft, weil die 4.5 bei mir ohne Anpassung lief, dass sich das geändert hat.
Ja, ich hab hier vorhin auch ein Update gefahren und seit dem sieht die Oberflaeche etwas komisch aus ;)
Hallo setstate, hatte gestern von Hand die 4.5 Version eingespielt, weil ich das fa-bluetooth icon brauchte, hat funktioniert und ich habe nichts geändert (css und fonts ausgetauscht!), dann hatte ich gesehen, das Du ein update auch auf 4.5 gemacht hast, also update rein, alles schön, aber fa-bluetooth nicht drin (ist in 4.5 dazu gekommen!) ... danach wieder von Hand und icon wieder da ... Gruß Olaf
Ist es jetzt besser beim FA 4.5? Ich habe die www/tablet/lib/font-awesome.min.css geändert
Hallo setstate, update gerade gemacht! Bei mir sieht es gut aus, auch das neue icon "fa-bluetooth" ist da ... perfekt Danke und Gruß Olaf
ZitatRMDIR: ./restoreDir/2015-12-27
UPD www/tablet/fonts/fontawesome-webfont.eot
UPD www/tablet/fonts/fontawesome-webfont.svg
UPD www/tablet/fonts/fontawesome-webfont.ttf
UPD www/tablet/fonts/fontawesome-webfont.woff
UPD www/tablet/fonts/fontawesome-webfont.woff2
UPD www/tablet/fonts/FontAwesome.otf
UPD www/tablet/js/fhem-tablet-ui.js
UPD www/tablet/js/fhem-tablet-ui.min.js
UPD www/tablet/js/widget_calview.js
UPD www/tablet/js/widget_example.js
UPD www/tablet/js/widget_pagetab.js
UPD www/tablet/lib/font-awesome.min.css
New entries in the CHANGED file:
FHEM tablet UI last change:
2016-01-13
- Update to Font Awesome 4.5.0
update finished, "shutdown restart" is needed to activate the changes.
fheminfo server response: ==> ok
Yup, jetzt ist alles wieder da.
Danke!
Zitat von: waschbaerbauch am 12 Januar 2016, 16:50:37
Hi setstate,
ich hatte grad mal 'button' gegen 'pagebutton' bzw. 'famultibutton' getauscht. Kann man denen denn genauso Farben mitgeben? Wenn ich lediglich den data-type ändere scheint er die mit 'button' genutzten Farben nicht zu nutzen bzw. verwenden zu können.
PS: Also bei mir laden sie ja für gewöhnlich, manchmal benötigt man allerdings mehrere reloads. Ich bin mir allerdings nicht sicher ob es am button liegt oder am 'integrierten' Webserver. Zum testen hab ich mir mal (mit meinem beschränkten Wissen) einen LAMPP Webserver installiert und meine html Dateien dann unter /opt/lampp/htdocs/fhem/www/tablet abgelegt. Die Seiten werden dann immer geladen, die Buttons machen (bisher) keine Probleme, allerdings lädt er so natürlich nicht die Werte aus dem FHEM in die Seiten ein. Das wäre noch eine Baustelle wo ich mal gucken muss wie ich das dem Apache beibringen kann..
Hi setstate,
hast du vielleicht eine Idee dazu?
Gruß
Mario
Zitat von: setstate am 13 Januar 2016, 18:54:18
Ist es jetzt besser beim FA 4.5? Ich habe die www/tablet/lib/font-awesome.min.css geändert
Läuft. Vielen Dank!
Grüße^^
@waschbaerbauch:
'Button' müsste wieder uneingeschränkt laufen, ich habe vor wenigen Tagen eine funktionierende Version mit in mein Github Repo aufgenommen.
Den Teil im PS habe ich nicht verstanden.
Wenn es um nicht richtig geladene Seite geht, kann ich nur wiederholt sagen: schaut dir mal meine index_example.html an, wie der <head> Teil aussehen sollte. Stichworte: doctype, defer ...
https://github.com/knowthelist/fhem-tablet-ui/blob/master/www/tablet/index-example.html
Zitat von: setstate am 11 Januar 2016, 18:53:36
Das Problem liegt in der Implementierung der Powerange Lib, die das Slider Widget nutzt.
Bei einigen Berechnungen wird der Paremeter "offsetHeight" herangezogen. Der ist aber bei Elementen, die nicht sichtbar sind, gleich 0. Slider auf dem Popup sind unsichtbar und die Position des Reglers wird falsch berechnet.
Ich habe jetzt einen Workaround beim Slider eingebaut, der die Wertsetzung des Sliders nach dem Sichbarwerden auf einem Popdialog wiederholt.
Es ist auf jeden Fall besser geworden. Bei mir lädt er derzeit die Slider beim zweiten öffnen des Popups, dies mag aber an den Tabs liegen, welche ich im Popup eingebaut habe (im Screenshot zu erkennen). Gibt es irgendwie eine Möglichkeit den Ladeprozess der Widgets manuell anzutriggern? Ich könnte diese dann beim öffnen des Tabs nochmal den Befehl geben die Daten aus FHEM abzuholen.
Dann noch ein zweites Thema, ich habe es hin und wieder, dass das Popup bei mir nicht mittag im Browser geöffnet wird, sondern verschoben nach rechts unten (siehe Screenshot). Gefühlt würde ich sagen, dies geschieht, wenn das FTUI noch nicht vollständig geladen ist. Kann ich dies ebenfalls beeinflussen?
Hi setstate,
erstmal vielen Dank für deine Hinweise. Ich habe diese nun beherzigt und grad alle Seiten dahin gehend geändert, das sie der 'index-example.html' entsprechen. Mit dem Chrome Browser kommt es weiterhin mal zu Problemen beim laden der Webseite(n).
~~schnipp~~ Hier liegt einige Zeit an Codekorrektur und Zeit zwischen ~~schnipp~~
Da ich ja hier und da einige Vorlagen anderer Benutzer verwendet habe und - höflich ausgedrückt ;) - nicht grade ein HTML Papst bin, scheint es bei der einen oder anderen Unterseite mittlerweile keine Probleme mehr zu geben, nachdem Attribute korrigiert (vorher wohl nicht erkannt und/oder falsch interpretiert) und Zeilen in der Position verschoben wurden um geöffnete 'li' etc logisch in der korrekten Reihenfolge zu schließen. Keine Ahnung ob das wirklich so gravierende Auswirkungen hat, ich werde das mal im Auge behalten.
Wenn das Durchforsten der übrigen HTML Dateien ebenfalls damit die Ladeprobleme lösen kann, dann erledigt sich in meinem Fall auch das was ich vorher im PS geschrieben hatte.
Zur Erklärung des PS:
Wegen der Probleme beim laden der HTML Seiten hatte ich erst die Idee, einen LAMPP Webserver zu installieren. Die Installation lief auch gut, die HTML Dateien an der entsprechenden Stelle platziert '/opt/lampp/htdocs/fhem/www/tablet' wurden auch geladen. Allerdings (natürlich) ohne die Inhalte/Werte aus dem FHEM. Hier wurden die Seiten deutlich schneller geliefert/dargestellt, was vermutlich daran liegt, das die Wartezeit auf die Lieferung der FHEM Werte fehlt. Wie und ob man den LAMPP Apache Server dazu überreden kann die Werte aus dem FHEM zu holen ist mir allerdings nicht klar/bekannt. Wenn es hier eine Lösung gibt bin ich über jeden Hinweis, und sei er noch so offensichtlich, dankbar :)
Gruß
Mario
Hat jemand schon den FTUI Screensaver zusammen mit dem swiper Widget genutzt, bei mir funktioniert irgendwie nicht, dass er mit data-autoplay, dann nach einer Weile das nächste Widget zeigt.
<div id="screensaver">
<div data-type="swiper" data-height="200px" data-width="500px" data-autoplay="5000">
<ul>
<li>
<div data-type="label" class="font-size-40px" data-device="HM_A35176" data-get="temperature"
data-unit=" %B0C%0A"></div>
</li>
<li>
<div data-type="label" class="font-size-40px" data-device="HM_A35176" data-get="humidity"
data-unit=" %B0C%0A">
</div>
</li>
</ul>
</div>
</div>
Hallo!
Ich habe leider ein Problem mit structure in Verbindung mit der TabletUI:
<div data-type="switch" data-device='AlleLichterEG' class="cell">
AlleLichterEG ist eine structure, die alle Licht-Aktoren enthält und auch laut FHEM korrekt nur zwischen on und off wechselt:
2016-01-14_07:21:24 AlleLichterEG on
2016-01-14_07:25:24 AlleLichterEG off
2016-01-14_07:44:02 AlleLichterEG on
2016-01-14_07:54:30 AlleLichterEG off
Starte ich Tablet UI und der Status ändert sich in FHEM, wechselt auch die Icon Farbe. ABER: Drücke ich im Browser auf Aktualisieren oder wechsle zeitweise auf einen anderen Pagetab, wird meistens "off" statt "on" angezeigt.
Habt ihr eine Idee, woran das liegen könnte?
Danke und Gruß
Phil
Zitat von: MrWishbone am 13 Januar 2016, 21:03:51
Es ist auf jeden Fall besser geworden. Bei mir lädt er derzeit die Slider beim zweiten öffnen des Popups, dies mag aber an den Tabs liegen, welche ich im Popup eingebaut habe (im Screenshot zu erkennen). Gibt es irgendwie eine Möglichkeit den Ladeprozess der Widgets manuell anzutriggern? Ich könnte diese dann beim öffnen des Tabs nochmal den Befehl geben die Daten aus FHEM abzuholen.
Dann noch ein zweites Thema, ich habe es hin und wieder, dass das Popup bei mir nicht mittag im Browser geöffnet wird, sondern verschoben nach rechts unten (siehe Screenshot). Gefühlt würde ich sagen, dies geschieht, wenn das FTUI noch nicht vollständig geladen ist. Kann ich dies ebenfalls beeinflussen?
Hallo MrWishbone,
sehe ich da richtig und du hast Register in deinem Popup? Könntest du mir einen Tip geben wie das realisiert wird?
Danke im Vorraus
Zitat von: Phil__ am 21 Mai 2015, 20:10:45
Hallo,
so hier meine fertige Lösung zur Anzeige der Müllabfuhrtermine. Mit bestem Dank an mc-hollin!!!
Im Menü meiner index.html wird, am Button das auf die Muellabfuhr übersichtsseite verlinkt, am Vortag einer Lehrung ein Warning engeblendet.
Auf der Übersichtsseite, muell.html, werden die Tonnen mit der Anzahl der Tage bis zur Leerung angezeigt.
Um 18 Uhr am Vortag einer Leerung bekomme ich eine Pushover Mitteilung auf mein Smartphone.
Für die Abfuhrtermin habe ich bei meinem Städischen Entsorger die Termine als .ics downloaden können und sie in einen Googlekalender importiert.
PS: Die Graue Tonne, untem auf dem Screenshot der muell.html, sieht man nicht da sie einen Vortag anfängt zu blinken. Screenshot zum falschen Zeitpunkt! ;)
Hier der FTUI Code:
<header>Muell</header>
<div style="font-size:30px; color:rgb(96, 0, 0);"
data-type="button"
data-device="Muellalert"
data-color="#aa6900"
data-get-on='["on","off"]'
data-url="muell.html"
data-icons='["fa-trash warn blink","fa-trash"]'
class="cell small"></div>
<header>Abfall</header>
<div class="cell">
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Gelbetonne" data-get='STATE' data-off-color="#E6E600" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#E6E600","#E6E600","#E6E600"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Biomuell" data-get='STATE' data-off-color="#996633" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#996633","#996633","#996633"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Papiertonne" data-get='STATE' data-off-color="#4747D1" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["#4747D1","#4747D1","#4747D1"]' class="bigger"></div>
<div data-type="symbol" data-background-icon="fa-circle-thin " data-off-background-color="#7A7A7A" data-on-background-color="#7A7A7A" data-device="Restmuell" data-get='STATE' data-off-color="grey" data-get-on='["off","^[01]$","^[1-9][0-9]|[2-9]$"]' data-icons='["fa-trash warn","fa-trash warn blink","fa-trash warn"]' data-on-colors='["gray","gray","gray"]' class="bigger"></div>
</div>
Hier der zugehörige Fhem Code:
#MuellKalender
define Abfall Calendar ical url https://www.google.com/calendar/ical/xyz/basic.ics 600
attr Abfall room Kalender
define Abfall_Update notify Abfall:(modeUpcoming|modeAlarmOrStart).* {Abfalltermine("$EVENT")}
attr Abfall_Update room Kalender
define Papiertonne dummy
attr Papiertonne group Abfall
attr Papiertonne room Kalender
attr Papiertonne event-on-change-reading state
define Restmuell dummy
attr Restmuell group Abfall
attr Restmuell room Kalender
attr Restmuell event-on-change-reading state
define Gelbetonne dummy
attr Gelbetonne group Abfall
attr Gelbetonne room Kalender
attr Gelbetonne event-on-change-reading state
define Biomuell dummy
attr Biomuell group Abfall
attr Biomuell room Kalender
attr Biomuell event-on-change-reading state
define Psh_Papiertonne at *18:00:00 {if(Value("Papiertonne") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird die Papiertonne abgeholt'")} }
define Psh_Restmuell at *18:00:00 {if(Value("Restmuell") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird der Restmuell abgeholt'")} }
define Psh_Gelbetonne at *18:00:00 {if(Value("Gelbetonne") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird die Gelbetonne abgeholt'")} }
define Psh_Biomuell at *18:00:00 {if(Value("Biomuell") eq "1") {fhem ("set myPushover msg 'Müllkalender' 'Morgen wird der Biomuell abgeholt'")} }
define Muellalert dummy
attr Muellalert room Kalender
attr Muellalert event-on-change-reading state
define at_Muellalert at *06:00:00 {if(Value("Papiertonne") eq "1" || Value("Restmuell") eq "1" || Value("Gelbetonne") eq "1" || Value("Biomuell") eq "1") {fhem("set Muellalert on")} else { fhem("set Muellalert off")}}
und hier der Code für die benötigte 99_myUtilsMuell:
##############################################
# $Id: myUtilsTemplate.pm 7570 2015-01-14 18:31:44Z rudolfkoenig $
#
# Save this file as 99_myUtils.pm, and create your own functions in the new
# file. They are then available in every Perl expression.
package main;
use strict;
use warnings;
use POSIX;
use Time::Local;
sub
myUtils_Initialize($$)
{
my ($hash) = @_;
}
sub
Abfalltermine ($)
{
my ($Ereignis) = @_;
my @Ereignisarray = split(/.*:\s/,$Ereignis);
my $Ereignisteil1 = $Ereignisarray[1];
my @uids=split(/;/,$Ereignisteil1);
my $t = time;
my $dtPapier = '';
my $dtWertstofftonne = '';
my $dtRest = '';
my $dtBiomuell = '';
foreach my $uid (@uids) {
my $Kalendertext = fhem("get Abfall summary $uid");
if ($Kalendertext =~ /Altpapier/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtPapier eq '' || ($eventDate < $dtPapier && $eventDate > $t))
{
$dtPapier = $eventDate;
Log(3, $dtPapier);
}
};
if ($Kalendertext =~ /Gelbe/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtWertstofftonne eq '' || ($eventDate < $dtWertstofftonne && $eventDate > $t))
{
$dtWertstofftonne = $eventDate;
}
};
if ($Kalendertext =~ /Restmüll/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtRest eq '' || ($eventDate < $dtRest && $eventDate > $t))
{
$dtRest = $eventDate;
}
};
if ($Kalendertext =~ /Biomüll/) {
my $dt = fhem("get Abfall start $uid");
my @SplitDt = split(/ /,$dt);
my @SplitDate = split(/\./,$SplitDt[0]);
my $eventDate = timelocal(0,0,0,$SplitDate[0],$SplitDate[1]-1,$SplitDate[2]);
if ($dtBiomuell eq '' || ($eventDate < $dtBiomuell && $eventDate > $t))
{
$dtBiomuell = $eventDate;
}
};
my $dayDiff = floor(($dtPapier - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Papiertonne $dayDiff");
}
my $dayDiff = floor(($dtWertstofftonne - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Gelbetonne $dayDiff");
}
my $dayDiff = floor(($dtRest - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Restmuell $dayDiff");
}
my $dayDiff = floor(($dtBiomuell - $t) / 60 / 60 / 24 + 1);
if ($dayDiff >= 0) {
fhem("set Biomuell $dayDiff");
}
}
}
Hallo Phil__,
kannst du mir bei dem beiden Fehlern weiter gehelfen?
Zitat2016.01.14 09:34:20 1: PERL WARNING: Argument "" isn't numeric in subtraction (-) at ./FHEM/99_myUtilsMuell.pm line 66.
2016.01.14 09:34:20 1: PERL WARNING: Argument "" isn't numeric in subtraction (-) at ./FHEM/99_myUtilsMuell.pm line 70.
2016.01.14 09:34:20 1: PERL WARNING: Use of uninitialized value $Ereignisteil1 in split at ./FHEM/99_myUtilsMuell.pm line 26.
Zitat von: nesges am 18 April 2015, 17:36:07
Gute Idee! Das control-File hat ja schon die benötigten Infos, das müsste man nur prüfen und mit den lokalen Files vergleichen. Kann man mit HTTPMOD machen, man braucht nur eine Prüffunktion, die man irgendwo in eine 99_myUtils.pm legt:
sub controlfile_updatecheck($) {
use Date::Parse;
my $raw = shift;
my $response='';
my @lines = split "\n", $raw;
foreach my $line (@lines) {
my @remote= split " ", $line;
if(@remote>3 && $remote[0] eq "UPD") {
Log 3, $line;
$remote[1]=~s/_/ /;
my @local = stat($remote[3]);
if($local[7] != $remote[2] || $local[9] < str2time($remote[1])) {
$response .= $remote[0]." ".$remote[3]."\n";
}
}
}
return $response;
}
Eine Funktion um das Update durchzuführen und die Readings zu aktualisieren:
sub controlfile_update($) {
my $device = shift;
my $url = InternalVal($device, 'url', '');
my $def = InternalVal($device, 'DEF', '');
fhem("setreading $device available updated");
fhem("setreading $device files -");
fhem("define at_recheck_$device at +00:05:00 modify $device $def");
fhem("update all $url");
}
Und in die fhem.cfg kommen dann diese Definitionen:
define UPDATE_FTUI HTTPMOD https://raw.githubusercontent.com/knowthelist/fhem-tablet-ui/master/controls_fhemtabletui.txt 14400
attr UPDATE_FTUI alias Fhem Tablet UI
attr UPDATE_FTUI userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_FTUI event-on-change-reading available,files
attr UPDATE_FTUI reading01Name files
attr UPDATE_FTUI reading01Regex (?s)(UPD.*)
attr UPDATE_FTUI reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_FTUI reading02Name available
attr UPDATE_FTUI reading02Regex (?s)(UPD.*)
attr UPDATE_FTUI reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_FTUI room hidden
define UPDATE_WIDGETS HTTPMOD https://raw.githubusercontent.com/nesges/Widgets-for-fhem-tablet-ui/master/controls_widgets-for-fhem-tablet-ui.txt 14400
attr UPDATE_WIDGETS alias Widgets for Fhem Tablet UI
attr UPDATE_WIDGETS userattr timeout reading01Name reading01Regex reading02Name reading02Regex
attr UPDATE_WIDGETS event-on-change-reading available,files
attr UPDATE_WIDGETS reading01Name files
attr UPDATE_WIDGETS reading01Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading01Expr $val=controlfile_updatecheck($val);;$val
attr UPDATE_WIDGETS reading02Name available
attr UPDATE_WIDGETS reading02Regex (?s)(UPD.*)
attr UPDATE_WIDGETS reading02Expr $val=controlfile_updatecheck($val) ne ''?'yes':'no';;$val
attr UPDATE_WIDGETS room hidden
define UPDATES readingsGroup UPDATE_FTUI:available,files UPDATE_WIDGETS:available,files
attr UPDATES valueFormat { ($READING eq 'files' && $VALUE !~ /^-?$/)?'<a href="?cmd={controlfile_update(\'$DEVICE\')}">[Start Update]</a>':$VALUE }
attr UPDATES alias 3d Party Updates
attr UPDATES room System
In der readingsGroup wird ein Link mit dem Text "[Start Update]" angezeigt, sobald ein Update verfügbar ist. Die readingsGroup kann man sicher noch schöner machen, aber da kenn ich mich nicht aus und überlasse das euch :)
PS: Habe ein paar Stellen verändert, am besten komplett neu übernehmen.
Sorry ,entweder ich habe da was falsch verstanden , oder es hakt bei mir irgendwo :
- o.g. Erstellt einen Raum System, in dem eine Möglichkeit ist ,wenn ein Update vorhanden ist ,ein Update für das Tablet UI bzw die Widgets anzustoßen .
Soweit sieht das bei mir auch gut aus !
Es wird ein Update beides angezeigt !
Das erste Update lasse ich laufen ... Restart ... Nur noch Update für Widget da :-)
Lasse ich dieses Update laufen ... Restart .... Erscheint wieder ein Update für Tablet UI ...usw.
Da das ja eigentlich nicht sein kann , habe ich es mal händisch versucht und dachte ich bin nun UP to Date .
Hmmmm, mache ich den updatecheck , so wird mir aber immer noch das gleiche Update zu Verfügung gestellt ....grummel
Was mach ich denn da falsch ?
Zitat von: Aladin222 am 14 Januar 2016, 10:55:55
Sorry ,entweder ich habe da was falsch verstanden , oder es hakt bei mir irgendwo :
- o.g. Erstellt einen Raum System, in dem eine Möglichkeit ist ,wenn ein Update vorhanden ist ,ein Update für das Tablet UI bzw die Widgets anzustoßen .
Soweit sieht das bei mir auch gut aus !
Es wird ein Update beides angezeigt !
Das erste Update lasse ich laufen ... Restart ... Nur noch Update für Widget da :-)
Lasse ich dieses Update laufen ... Restart .... Erscheint wieder ein Update für Tablet UI ...usw.
Da das ja eigentlich nicht sein kann , habe ich es mal händisch versucht und dachte ich bin nun UP to Date .
Hmmmm, mache ich den updatecheck , so wird mir aber immer noch das gleiche Update zu Verfügung gestellt ....grummel
Was mach ich denn da falsch ?
Na da schließe ich mich doch mal an!
Gibt es eine Anleitung oder ein Beispiel für das "readingsgroup" widget?
Ich bekomme da irgendwie garnichts angezeigt....
Zitat von: l3skon3 am 14 Januar 2016, 09:22:02
Hallo MrWishbone,
sehe ich da richtig und du hast Register in deinem Popup? Könntest du mir einen Tip geben wie das realisiert wird?
Danke im Vorraus
Hallo I3skon3,
die Tabs sind Marke Eigenbau, ich hab dazu ein Tutorial im Netz gefunden und es entsprechend aufs Tablet UI eingesetzt. Das ganze ist bisher auch nur ein Test und hat auch noch ein paar Macken.
So gibt es z.B. anscheinend Probleme mit einigen Widget, welche ihre Daten nicht korrekt laden können (deswegen fragte ich nach einer Möglichkeit das Datenladen anzustoßen).
Außerdem ist das Layout noch nicht ganz optimal. Mir fehlte bisher die Zeit mir dies noch genauer anzusehen.
Falls du aber dennoch dein Glück versuchen willst, das ganze setzt sich aus drei Teilen zusammen:
Zunächst musst du eine eigene CSS erstellen, bei mir heißt diese: fhem-tablet-ui_cust.css
.dialog {
background-color:#000000;
}
/*----- Tabs -----*/
.tabs {
width:100%;
display:inline-block;
}
/*----- Tab Links -----*/
/* Clearfix */
.tab-links:after {
display:block;
clear:both;
content:'';
}
.tab-links li {
margin:0px 5px;
float:left;
list-style:none;
}
.tab-links a {
padding:9px 15px;
display:inline-block;
border-radius:3px 3px 0px 0px;
background:#191919;
font-size:16px;
font-weight:600;
color:#aa6900;
transition:all linear 0.15s;
}
.tab-links a:hover {
background:#8C8C8C;
text-decoration:none;
}
li.active a, li.active a:hover {
background:#2A2A2A;
color:#aa6900;
}
/*----- Content of Tabs -----*/
.tab-content {
padding:15px;
height:350px;
border-radius:3px;
box-shadow:-1px 1px 1px rgba(0,0,0,0.15);
background:#2A2A2A;
}
.tab {
display:none;
}
.tab.active {
display:block;
}
Wichtig ist hierbei, dass ich im Augenblick unter ".tab-content" noch eine fixe höhe (height:350px) eingebe. Ich habe es noch nicht hinbekommen die höhe dynamisch zu gestalten um unterschiedliche Pop-Up größen zuzulassen.
Zweiter Teil ist eine zusätzliche Java-Script Datei, bei mir heißt sieh schlicht "tabs.js":
jQuery(document).ready(function() {
jQuery('.tabs .tab-links a').on('click', function(e) {
var currentAttrValue = jQuery(this).attr('href');
// Show/Hide Tabs
//jQuery('.tabs ' + currentAttrValue).show().siblings().hide();
jQuery('.tabs ' + currentAttrValue).fadeIn(400).siblings().hide();
// Change/remove current tab to active
jQuery(this).parent('li').addClass('active').siblings().removeClass('active');
e.preventDefault();
});
});
Zuguter letzt musst du es im HTML-Dokument deiner Wahl einbauen.
Zunächst muss die Kopfzeile angepasst werden um die folgenden Zeilen:
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui_cust.css" />
<script type="text/javascript" src="/fhem/tablet/js/tabs.js"></script>Achte hierbei auf die Reihenfolge. Die erste Zeile muss als letzte <link....> Zeile kommen und die zweite Zeile muss zwingend nach "jquery.min.js" kommen. Ansonsten laden die Funktionen nicht richtig.
Ist die Vorbereitung geschafft, kannst du die Tabs einbauen. Ich habe sie im Dialog platziert (deswegen habe ich auch die Hintergrundfarbe im Dialog auf schwarz geändert), aber Theoretisch können sie Überall eingebaut werden.
<div data-type="popup" data-width="1000px" data-height="450px">
<!-- gewünschte Widgets hier -->
<div class="dialog">
<div class="top-space">
<header style="color: #aa6900;" class="big">WOHNZIMMER</header>
</div>
<div class="row">
<div class="tabs">
<ul class="tab-links">
<li class="active"><a href="#wz_tab1">Dashboard</a></li>
<li><a href="#wz_tab2">Temperatur-Config</a></li>
<li><a href="#wz_tab3">Tab #3</a></li>
<li><a href="#wz_tab4">Tab #4</a></li>
</ul>
<div class="tab-content">
<div id="wz_tab1" class="tab active">
<div data-template="include/wz_tab1.html" class="cell"></div>
</div>
<div id="wz_tab2" class="tab">
<div data-template="include/wz_tab2.html" class="cell"></div>
</div>
<div id="wz_tab3" class="tab">
<p>Tab #3 content goes here!</p>
</div>
<div id="wz_tab4" class="tab">
<p>Tab #4 content goes here!</p>
</div>
</div>
</div>
</div>
</div>
</div>
Viel Erfolg
Hallo zusammen,
erstmal muss ich ein großes Lob loswegen: das FHEM Tablet UI ist ratten scharf. Gerade die coolen Widgets und der individuelle Einsatz sind Spitze. Auch die Trennung zwischen Oberflächen-Design und der dahinterliegenden FHEM-Logik ist super, das hat mich bei anderen Oberfläche immer generft.
Die gute Doku und die vielen Beispiel helfen natürlich auch.
Ich hab mir mit dem Tablet UI einen Floorplan erstellt. Dank der Widgets und der Animierungen sieht das recht gut aus. Ist zwar noch nicht fertig, aber es wird.
Ich hab aber auch eine Frage zu dem "Popup"-Widget und dem Verschieben (draggable): Ich hab in einem Popup ein Thermostat zur Temperaturreglung reingepackt. Wenn ich dort aber die Themperatur verändern will, dann verschiede ich damit gleichzeitig auch das Popup. Sehr lustiger Effekt, aber nicht wirklich hilfreich.
Laut Doku auf github kann das Verschieben beim Popup mit data-draggable deaktiviert werden. Funktioniert bei mir aber nicht. Und sofern ich das Codeing in widget_popup.js richtig verstehe, dann wird dort auch niergendswo der Parameter data-draggable abgefragt, sondern jedes Popup in Zeile 76 mit dialog.draggable(); "verschiebbar" gemacht.
Kann es sein, dass die Implementierung zu dem Parameter noch fehlt?
Gruß
Hallo,
Ich habe ein Problem mit meinem Pagetab Menü. Es kommt unabhängig von Browser und Endgerät immer wieder vor, dass mein mit Pagetab aufgebautes Menü nicht angezeigt wird. Nach ein oder mehrmaligem reload der Seite taucht es dann wieder auf. Bei der Umsetzung habe ich mich an das Beispiel gehalten, bei dem das Menü in eine eigene Datei ausgelagert wird und als Template auf jeder Seite eingebunden wird. Anbei ein Einblick meiner Umsetzung. An was kann das liegen?
Schonmal danke für die Hilfe!
menu.html
<html>
<body>
<header>Menü</header>
<div class="cell">
<div data-type="pagetab" data-return-time="15" data-url="index.html" data-icon="fa-home" class="cell"></div>
<div data-type="pagetab" data-url="multimedia.html" data-icon="fa-music" class="cell"></div>
<div data-type="pagetab" data-url="weather.html" data-icon="fa-cloud" class="cell"></div>
<div data-type="pagetab" data-url="wecker.html" data-icon="fa-bell" class="cell"></div>
<div data-type="pagetab" data-url="system.html" data-icon="fa-gears" class="cell"></div>
<div data-type="pagetab" data-url="info.html" data-icon="fa-info" class="cell"></div>
</div>
</body>
</html>
index.html
<!DOCTYPE html>
<html>
<head>
<!--
/* FHEM tablet ui */
/*
* Just another dashboard for FHEM
*
* Version: 1.3.5
* Requires: jQuery v1.7+, font-awesome, jquery.gridster, jquery.toast
* URL: https://github.com/knowthelist/fhem-tablet-ui
*
* Copyright (c) 2015 Mario Stephan <mstephan@shared-files.de>
* Under MIT License (http://www.opensource.org/licenses/mit-license.php)
*
* - create a new folder named 'tablet' in /<fhem-path>/www
* - copy all files incl. sub folders into /<fhem-path>/www/tablet
* - add 'define tablet_ui HTTPSRV tablet ./www/tablet Tablet Frontend' in fhem.cfg
* - Tadaaa! A new fhem ui in http://<fhem-url>:8083/fhem/tablet/
*/
-->
<title>FHEM-Tablet-UI</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="widget_base_width" content="116">
<meta name="widget_base_height" content="146">
<meta name="mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
<meta name="debug" content="0"> <!-- 1=output to console;0=no output -->
<meta name="toast" content="0">
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/css/fhem-blue-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css" />
<!-- define your personal style here, it wont be overwritten -->
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
<script type="text/javascript" src="/fhem/tablet/js/my_screensaver.js"></script>
<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
</head>
<body>
<!-- available class: container,left,right,cell,narrow,darker,big,bigger,small,thin,large,wider -->
<!-- available data-type: symbol,dimmer,homestatus,label,push,slider,switch,thermostat,volume,weather -->
<div class="gridster">
<ul>
<li class="transparent50" data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Uhr</header>
<div class="big top-space-2x" data-type="clock" data-format="H:i"></div>
<div class="" data-type="clock" data-format="d.m.Y"></div>
</li>
<li class="transparent50" data-row="2" data-col="1" data-sizex="1" data-sizey="4" data-template="menu.html"></li>
<li class="transparent50" data-row="1" data-col="1" data-sizex="1" data-sizey="1">
<header>Wohnen</header>
<div data-type="klimatrend"
data-device="OG_Wohnen_Klima"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(120,120,120)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(51,122,183)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
class="inline big"
></div>
<div data-type="label"
data-device="OG_Wohnen_Klima"
data-get="temperature"
data-limits='[-73,10,23]'
data-colors='["#4169E1","#FFA500","#FF0000"]'
data-unit="%B0C%0A"
data-fix="1"
class="big top-space inline">
</div>
<div
style="color: #337ab7"
data-type="label"
data-device="OG_Wohnen_Klima"
data-get="humidity"
data-unit="%"
class="cell big top-space">
</div>
</li>
<li class="transparent50" data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header>Schlafzimmer</header>
<div data-type="klimatrend"
data-device="DG_Schlafzimmer_Klima"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(120,120,120)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(51,122,183)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
class="inline big"
></div>
<div data-type="label"
data-device="DG_Schlafzimmer_Klima"
data-get="temperature"
data-limits='[-73,10,23]'
data-colors='["#4169E1","#FFA500","#FF0000"]'
data-unit="%B0C%0A"
data-fix="1"
class="big top-space inline">
</div>
<div
style="color: #337ab7"
data-type="label"
data-device="DG_Schlafzimmer_Klima"
data-get="humidity"
data-unit="%"
class="cell big top-space">
</div>
</li>
<li class="transparent50" data-row="1" data-col="3" data-sizex="1" data-sizey="1">
<header>Büro</header>
<div data-type="klimatrend"
data-device="DG_Buero_Klima"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(120,120,120)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(51,122,183)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
class="inline big"
></div>
<div data-type="label"
data-device="DG_Buero_Klima"
data-get="temperature"
data-limits='[-73,10,23]'
data-colors='["#4169E1","#FFA500","#FF0000"]'
data-unit="%B0C%0A"
data-fix="1"
class="big top-space inline">
</div>
<div
style="color: #337ab7"
data-type="label"
data-device="DG_Buero_Klima"
data-get="humidity"
data-unit="%"
class="cell big top-space">
</div>
</li>
<li class="transparent50" data-row="1" data-col="4" data-sizex="1" data-sizey="1">
<header>Bäder</header>
<div>
<div data-type="klimatrend"
data-device="DG_Bad_Klima"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(120,120,120)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(51,122,183)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
class="inline big"
></div>
<div data-type="label"
data-device="DG_Bad_Klima"
data-get="temperature"
data-limits='[-73,10,23]'
data-colors='["#4169E1","#FFA500","#FF0000"]'
data-unit="%B0C%0A"
data-fix="1"
class="big top-space inline">
</div>
</div>
<div>
<div data-type="klimatrend"
data-device="OG_WC_Klima"
data-get="statTemperatureTendency"
data-refperiod="1"
data-stagnating-color="rgb(120,120,120)"
data-icon="fa-angle"
data-rising-color="rgb(180,80,80)"
data-falling-color="rgb(51,122,183)"
data-highmark="1"
data-highmark-icon="fa-angle-double"
data-highmark-rising-color="rgb(255,80,80)"
data-highmark-falling-color="rgb(80,80,255)"
class="inline big"
></div>
<div data-type="label"
data-device="OG_WC_Klima"
data-get="temperature"
data-limits='[-73,10,23]'
data-colors='["#4169E1","#FFA500","#FF0000"]'
data-unit="%B0C%0A"
data-fix="1"
class="inline top-space big">
</div>
</div>
</li>
<li class="transparent50" data-row="1" data-col="6" data-sizex="1" data-sizey="1">
<header>Espressomaschine</header>
<div data-type="switch" class="cell bigger top-space"
data-device="OG_Kueche_Strom_Espresso"
data-get-on="on"
data-get-off="off"
data-icon="fa-plug"></div>
<div
data-type="label"
data-device="OG_Kueche_Energie_Espressomaschine_Pwr"
data-unit="W/h"
class="cell darker narrow right">
</div>
</li>
<li class="transparent50" data-row="1" data-col="7" data-sizex="1" data-sizey="1">
<header>Tablet laden</header>
<div data-type="switch" class="cell bigger top-space"
data-device="OG_Wohnen_Strom_Tablet"
data-get-on="on"
data-get-off="off"
data-icon="fa-plug"></div>
<div
data-type="label"
data-device="dummyAkkuTablet"
data-unit="%"
class="cell darker narrow right">
</div>
</li>
<li class="transparent50" data-row="2" data-col="6" data-sizex="1" data-sizey="1">
<header>Beamer</header>
<div data-type="switch" class="cell bigger top-space"
data-device="HM_274860_Schalter_Beamer"
data-get-on="on"
data-get-off="off"
data-icon="fa-plug"></div>
</li>
<li class="transparent50" data-row="2" data-col="7" data-sizex="1" data-sizey="1">
<header>Stehlampe</header>
<div data-type="dimmer" data-device="OG_Wohnen_Dimmer_Stehlampe"
data-get-on="[0-9]{1,3}|on"
data-set-on="pct 50"
data-get-off="off"
data-set-off="pct 0"
data-dim="pct"
class="cell bigger top-space">
</div>
</li>
<li class="transparent50" data-row="1" data-col="8" data-sizex="1" data-sizey="1">
<header>Wasserbett</header>
<div data-type="switch" class="cell bigger readonly top-space"
data-device="DG_Schlafzimmer_Strom_Wasserbett"
data-get-on="on"
data-get-off="off"
data-icon="fa-bed"></div>
<div
data-type="label"
data-device="DG_Schlafzimmer_Energie_Wasserbett_Pwr"
data-unit="W/h"
class="cell darker narrow right">
</div>
</li>
<li class="transparent50" data-row="2" data-col="8" data-sizex="1" data-sizey="1">
<header>Licht Küche</header>
<div data-type="switch" class="cell bigger top-space"
data-device="OG_Kueche_Licht_Decke"
data-get-on="on"
data-get-off="off"
data-icon="fa-lightbulb-o"></div>
</li>
<li class="transparent50" data-row="3" data-col="6" data-sizex="1" data-sizey="1">
<header>Licht Essen</header>
<div data-type="dimmer" data-device="OG_Kueche_Dimmer_Essen"
data-get-on="[0-9]{1,3}|on"
data-set-on="pct 100"
data-get-off="off"
data-set-off="pct 0"
data-dim="pct"
class="cell bigger top-space"></div>
</li>
<li class="transparent50" data-row="3" data-col="7" data-sizex="1" data-sizey="1">
<header>Licht Wohnen</header>
<div data-type="dimmer" data-device="OG_Wohnen_Dimmer_Decke"
data-get-on="[0-9]{1,3}|on"
data-set-on="pct 100"
data-get-off="off"
data-set-off="pct 0"
data-dim="pct"
class="cell bigger top-space"></div>
</li>
<li class="transparent50" data-row="3" data-col="8" data-sizex="1" data-sizey="1">
<header>HUE</header>
<div data-type="dimmer" data-device="HUEBridge_HUEDevice1" data-get-on="!off" data-get-off="off" data-set="pct" class="cell bigger top-space" ></div>
</li>
<li class="transparent50" data-row="2" data-col="2" data-sizex="4" data-sizey="3">
<header>SONOS Wohnzimmer</header>
<div data-type="image" data-device="Sonos_Wohnzimmer" data-get="currentAlbumArtURL" data-size="55%" class="top-space"></div>
<div class="container cell">
<div data-type="label" class="" data-device="Sonos_Wohnzimmer" data-get="infoSummarize1"></div><br>
<div data-type="label" class="darker narrow" data-device="Sonos_Wohnzimmer" data-get="infoSummarize3"></div><br>
</div>
<div class="cell">
<div data-type="push"
data-set-on="VolumeD"
data-icon="fa-volume-off"
data-background-icon="-"
data-device="Sonos_Wohnzimmer"
class="inline"></div>
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-step-backward" data-background-icon="-"
data-set-on="Previous" class="inline">
</div>
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-stop" data-background-icon="-"
data-set-on="Stop" class="inline">
</div>
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-play" data-background-icon="-"
data-set-on="Play" class="inline">
</div>
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-step-forward" data-background-icon="-"
data-set-on="Next" class="inline">
</div>
<div data-type="push"
data-set-on="VolumeU"
data-icon="fa-volume-up"
data-background-icon="-"
data-device="Sonos_Wohnzimmer"
class="inline"></div>
</div>
</li>
<li class="transparent50" data-row="6" data-col="2" data-sizex="4" data-sizey="1">
<header>SONOS Voreinstellungen</header>
<div class="cell wider left">
<div data-type="select" data-device="Sonos_Wohnzimmer" data-list="FavTabletUI" data-set="startFavourite" class="cell " ></div>
<div data-type="label" class="cell">Favouriten</div>
</div>
<div class="right top-space right-space">
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-volume-down"
data-set="Volume 8"
class="cell inline">
</div>
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-volume-off"
data-set="Volume 15"
class="cell inline">
</div>
<div data-type="push" data-device="Sonos_Wohnzimmer"
data-icon="fa-volume-up"
data-set="Volume 30"
class="cell inline">
</div>
<div data-type="label" class="cell">Lautstärke</div>
</div>
</li>
<li class="transparent50" data-row="4" data-col="6" data-sizex="2" data-sizey="2">
<header>Rolladen Gesamt</header>
<div>
<div data-type="switch" data-device="Structure_Rollaeden"
data-get-on="on" data-get-off="!on"
data-set-on="on" data-set-off=""
data-icon="fa-angle-double-up" data-background-icon="fa-square" ></div>
<div data-type="label" class="inline w1x">Auf</div>
</div>
<div>
<div data-type="switch" data-device="Structure_Rollaeden"
data-get-on="75" data-get-off="!on"
data-set-on="75" data-set-off=""
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">75</div>
</div>
<div>
<div data-type="switch" data-device="Structure_Rollaeden"
data-get-on="50" data-get-off="!on"
data-set-on="50" data-set-off=""
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">50</div>
</div>
<div>
<div data-type="switch" data-device="Structure_Rollaeden"
data-get-on="25" data-get-off="!on"
data-set-on="25" data-set-off=""
data-icon="fa-angle-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">25</div>
</div>
<div>
<div data-type="switch" data-device="Structure_Rollaeden"
data-get-on="off" data-get-off="!on"
data-set-on="off" data-set-off=""
data-icon="fa-angle-double-down" data-background-icon="fa-square"></div>
<div data-type="label" class="inline w1x">Zu</div>
</div>
</li>
<li class="transparent50" data-row="4" data-col="8" data-sizex="1" data-sizey="1">
<div data-type="push"
data-icon="fa-bed"
class="cell bigger top-space-2x"
onclick="setFhemStatus('set OG_Wohnen_Dimmer_Stehlampe 0 0 10; set HUEBridge_HUEDevice1 off 10; set OG_Kueche_Dimmer_Essen 0 0 10; set OG_Wohnen_Dimmer_Decke 0 0 10; set OG_Kueche_Licht_Decke off; set OG_Essen_Rolladen 0; set OG_Wohnen_Rolladen 0; set OG_Kueche_Strom_Espresso off')"></div>
</li>
<li class="transparent50" data-row="5" data-col="8" data-sizex="1" data-sizey="1">
<div data-type="switch" class="cell bigger top-space-2x"
data-device="dummy_Anwesenheit"
data-get-on="anwesend"
data-get-off="abwesend"
data-icon="fa-users"></div>
</li>
<li class="transparent50" data-row="1" data-col="9" data-sizex="2" data-sizey="5" data-template="sidebar_wetter.html"></li>
</ul>
</div>
<div data-template="screensaver.html"></div>
</body>
</html>
Hallo,
ist es möglich über einen Button direkt eine Routine in 99_myUtils.pm aufzurufen?
Vielen Dank
Zitat von: wwg2000 am 14 Januar 2016, 19:55:57
Kann es sein, dass die Implementierung zu dem Parameter noch fehlt?
Nö, alles da und funktioniert ...
Aber ich Trottel hab vergessen das ganze hochzuladen.
Sorry, ist soeben passiert.
Zitat von: Dduieh am 14 Januar 2016, 21:17:32
Hallo,
ist es möglich über einen Button direkt eine Routine in 99_myUtils.pm aufzurufen?
Vielen Dank
<div data-type="button" data-fhem-cmd="{discardTV()}"></div>
hallo
sorry, dass ich der warscheinlich der 5 millionste hier bin, der die frage hat:
ich bringe die callist mit meiner fritzbox nicht auf die reihe. in der standard-ui werden mir die anrufe angezeigt, mit icon und allem pipapo.
aber egal welche codeschnippsel ich von hier ausprobiere - ich kriege auf der tablet ui keine anzeige.
in meiner fhem.cfg steht folgendes (einiges aus reiner verzweiflung *g*):
define Anrufliste FB_CALLLIST Telefonanlage
attr Anrufliste create-readings 1
attr Anrufliste disable 0
attr Anrufliste event-on-change-reading .*
attr Anrufliste icon edit_copy
attr Anrufliste language de
attr Anrufliste number-of-calls 3
attr Anrufliste room Telefonanlage
was muß ich nun tun, um in der tablet ui die 3 anrufe sehen zu können? vorzugsweise mit icon. derzeit würde mich aber schon alles freuen, was über eine leere fläche hinaus geht.
@MrWishbone
Danke für die ausführlich Anleitung, ich werde mal versuchen das ganze nachzubauen.
@the ratman
fhem.cfg
define FB7272_LIST FB_CALLLIST FB7272
attr FB7272_LIST comment test auf CUBIE
attr FB7272_LIST create-readings 1
attr FB7272_LIST event-on-change-reading .*
attr FB7272_LIST icon phone_answersing
attr FB7272_LIST icon-mapping {'outgoing.missed' => 'phone_missed_out@red','incoming.missed' => 'phone_missed_in@red'}
attr FB7272_LIST language de
attr FB7272_LIST list-order descending
attr FB7272_LIST list-type all
attr FB7272_LIST number-of-calls 10
attr FB7272_LIST room Telefon
attr FB7272_LIST show-icons 1
attr FB7272_LIST time-format-string %a. %d %b %Y %T
attr FB7272_LIST verbose 0
attr FB7272_LIST visible-columns row,state,timestamp,name,number,internal,connection,duration
FTUI Beispiele
<li data-row="1" data-col="2" data-sizex="6" data-sizey="4">
<header style="color:red">A N R U F L I S T E - B E I S P I E L 1</header>
<table border="0px" width="100%">
<tr>
<td><div data-type="label" data-device="FB7272_LIST" data-get="1-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="1-name" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="1-number" class="left"></div> </td>
<td><div data-type="symbol" data-device="FB7272_LIST"
data-get="1-state"
data-icons='["fa-phone","fa-phone","fa-arrow-down","fa-arrow-up","fa-fax","fa-arrow-circle-down","fa-arrow-circle-up","fa-arrow-circle-down","fa-arrow-circle-up"]'
data-get-on='["<= ((o))","=> ((o))","=> [=]","<= [=]","=> O_O","=>","<=","=> X","<= X"]'
data-on-colors='["yellow","yellow","blue","blue","orange","green","green","red","red"]' class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="FB7272_LIST" data-get="2-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="2-name" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="2-number" class="left"></div> </td>
<td><div data-type="symbol" data-device="FB7272_LIST"
data-get="2-state"
data-icons='["fa-arrow-down","fa-arrow-up","fa-fax","fa-arrow-circle-down","fa-arrow-circle-up","fa-arrow-circle-down","fa-arrow-circle-up"]'
data-get-on='["=> [=]","<= [=]","=> O_O","=>","<=","=> X","<= X"]'
data-on-colors='["blue","blue","orange","green","green","red","red"]' class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="FB7272_LIST" data-get="3-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="3-name" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="3-number" class="left"></div> </td>
<td><div data-type="symbol" data-device="FB7272_LIST"
data-get="3-state"
data-icons='["fa-arrow-down","fa-arrow-up","fa-fax","fa-arrow-circle-down","fa-arrow-circle-up","fa-arrow-circle-down","fa-arrow-circle-up"]'
data-get-on='["=> [=]","<= [=]","=> O_O","=>","<=","=> X","<= X"]'
data-on-colors='["blue","blue","orange","green","green","red","red"]' class="left"></div> </td>
</tr>
<tr>
<td><div data-type="label" data-device="FB7272_LIST" data-get="4-timestamp" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="4-name" class="left"></div> </td>
<td><div data-type="label" data-device="FB7272_LIST" data-get="4-number" class="left"></div> </td>
<td><div data-type="symbol" data-device="FB7272_LIST"
data-get="4-state"
data-icons='["fa-arrow-down","fa-arrow-up","fa-fax","fa-arrow-circle-down","fa-arrow-circle-up","fa-arrow-circle-down","fa-arrow-circle-up"]'
data-get-on='["=> [=]","<= [=]","=> O_O","=>","<=","=> X","<= X"]'
data-on-colors='["blue","blue","orange","green","green","red","red"]' class="left"></div> </td>
</tr>
</table>
</li>
Zitat von: setstate am 14 Januar 2016, 22:48:26
Nö, alles da und funktioniert ...
Aber ich Trottel hab vergessen das ganze hochzuladen.
Sorry, ist soeben passiert.
@setstate
funktioniert, Danke!
Zitat von: setstate am 14 Januar 2016, 22:48:26
Nö, alles da und funktioniert ...
Aber ich Trottel hab vergessen das ganze hochzuladen.
Sorry, ist soeben passiert.
Vielen vielen Dank, nun funktioniert es! ;)
@kvo1
vielen dank! funktioniert.
jetzt hab ich endlich was, was ich ansehen. ausprobieren und testen kann.
Hallo!
Es wurde schon mehrfach kurz angesprochen und ich wollte fragen, ob es hier irgendeine Chance gibt:
Der FHEM-eigene Webserver ist für mich nicht unproblematisch. Die Performance ist nicht der Hit und manchmal ist ein Reload gar nicht möglich trotz starker Hardware.
Wäre es irgendwie möglich, Tablet UI auf einem eigenständigen Apache-Server laufen zu lassen, der im Hintergrund die Daten vom FHEM-Webserver holt?
Danke und Gruß
Phil
Zitat von: Stril am 15 Januar 2016, 11:21:00
Hallo!
Es wurde schon mehrfach kurz angesprochen und ich wollte fragen, ob es hier irgendeine Chance gibt:
Der FHEM-eigene Webserver ist für mich nicht unproblematisch. Die Performance ist nicht der Hit und manchmal ist ein Reload gar nicht möglich trotz starker Hardware.
Wäre es irgendwie möglich, Tablet UI auf einem eigenständigen Apache-Server laufen zu lassen, der im Hintergrund die Daten vom FHEM-Webserver holt?
Danke und Gruß
Phil
Moin.
Ich denke da wäre es interessanter den FHEM-Webserver umzugestalten. Da sollten sich die Entwickler von FHEM dran setzen einen besseren WebServer zu integrieren. So hat man wieder alles in einem System, man muss sich nicht mit der installation und konfiguration von anderer Software rumschlagen und hat weniger zusatzlast auf dem System.
Grüße^^
Hallo!
Ich finde es schon sympathisch, wenn der Webserver der Visualisierung abgekapselt werden kann. Das macht das Ganze schön flexibel und man hat als Abfallprodukt die Sicherheitsfunktionen von Apache im Köcher.
Phil
Hi!
Könnte man den Thread da irgendwann mal beenden und bei neuen Fragen einen neuen erstellen? Versuch schon seit Wochen, die ganze Unterhaltung zu lesen, aber 247 Seiten sind dann doch schon etwas unübersichtlich. Da gehen Fragen und v.a. die brauchbaren Antworten irgendwie unter.
Danke!
Stefan
Zitat von: Stril am 15 Januar 2016, 12:07:20
Hallo!
Ich finde es schon sympathisch, wenn der Webserver der Visualisierung abgekapselt werden kann. Das macht das Ganze schön flexibel und man hat als Abfallprodukt die Sicherheitsfunktionen von Apache im Köcher.
Phil
Faende ich ebenfalls gut, aber das ist wohl ein FeatureRequest der so bald nicht kommen wird. :)
Zufaelligerweise experimentiere ich grade mit mod_cache_disk im Apache als reverse proxy rum, das ist gefuehlt schon besser, allerdings ist das immer noch von einem richtig schnellen Seitenwechsel mit pagetab entfernt. Ich hab trotzdem mal einen Post im Wuensch Dir was Forum aufgemacht, falls der eine oder andere da vielleicht seinen Senf zu abgeben will ;)
http://forum.fhem.de/index.php/topic,47486.0.html
Was diesen Thread angeht kann ich mich dem Wunsch nur anschliessen, mittlerweile fast 3700 Antworten. Bei der Anzahl an Antworten waere mittlerweile ein eigene kategorie unter Frontends angebracht, sofern die Forensoftware hier die Moeglichkeit bietet. Scheint ja mittlerweile mit Abstand das beliebteste Frontend zu sehen, was nicht verwunderlich ist.
Gruss
Zitat von: Stril am 14 Januar 2016, 08:17:26
Hallo!
Ich habe leider ein Problem mit structure in Verbindung mit der TabletUI:
<div data-type="switch" data-device='AlleLichterEG' class="cell">
AlleLichterEG ist eine structure, die alle Licht-Aktoren enthält und auch laut FHEM korrekt nur zwischen on und off wechselt:
Starte ich Tablet UI und der Status ändert sich in FHEM, wechselt auch die Icon Farbe. ABER: Drücke ich im Browser auf Aktualisieren oder wechsle zeitweise auf einen anderen Pagetab, wird meistens "off" statt "on" angezeigt.
Hallo!
Ich habe jetzt mit der Brechstange zumindest einen Teilerfolg:
+*00:00:15 {
my $AlleLichterEGV = Value("AlleLichterEG");;
{fhem "trigger AlleLichterEG $AlleLichterEGV "}
}
--> Alle 15 Sekunden wird der aktuelle Status "angetriggert --> Tablet UI zeigt dann den korrekten Status der structure. Warum das aktuell jedoch nicht automatisch passiert, ist mir absolut unklar...
Leider habe ich das Problem auch bei anderen Readings (z.B. beim Callmonitor). Dort tauchen auch alte Werte auf, wenn ich nicht die Änderung immer mal wieder über "trigger" oder "setreading" bestätige. Gibt es hier irgendeinen Caching Mechanismus?
Phil
@setstate
könntest Du bitte im widget_weather.js
"Schneeschauer": 'chance_of_snow.png',
ergänzen, fällt mir bei jedem update raus !
Danke
Hallo zusammen,
auch Ich bin begeistert von der Tablet UI. Mit einigen Stunden Arbeit und Dank dieses Forums bin ich auch schon auf einem guten Weg.
Ich habe allerdings 2 Dinge, die ich gerne umsetzen würde, weiß aber nicht wie ich da weiterkomme. Vielleicht hat ja jemand einen Tipp für mich.
1.) Ich zeige den BatterieStatus des Tablets an (AMAD), dass funktioniert auch. Ich möchte aber, dass ein "Label" blinkt, wenn die Stromzufuhr aktiv ist, dass Tablet somit geladen wird. Dass Reading dafür gibt aber nur 0 oder 1 aus. Bei 0 würde ich gerne überhauptnichts anzeigen, sobald Stromzufuhr aktiv und Reading=1 wollte ich den Text "...lädt" anzeigen lassen.
Aktuell blinkt bei mir die "1", wenn Stromzufuhr und die "0" wenn keine Stromzufuhr. Ich habe aber die Farbe des off-Readings auf den Hintergrund gesetzt, sodass man die blinkende 0 nicht sieht. Ich finde dass keine schicke Lösung. Gibt es da Möglichkeiten per "data-substitution", im Sinne "wenn 1, dann "...lädt", ansonten "" ?
Sicherlich kann man dass über entsprechende Dummys machen, aber wäre dies der einzige Weg? Wie macht Ihr soetwas?
1.b) Ähnliches Szenario bei u.a. der Lautstärkesteuerung meines Receivers. get & set liegen auf Volume, aber wie schaffe ich es, dass dieses Widet nur angezeigt/ bedienbar ist - wenn der Receiver auch eingeschaltet ist (=anderes Reading)?
2.) zu guter Letzt: mein Weihnachtsbeleuchtungsszenario. Ich würde gerne die Switches für die "WeihnachtsProgramme" (Strukturen in FHEM) nur in den Monaten 11,12 und 1 anzeigen. Ich denke, ich muß mir hier mein eigenes JS basteln oder auch wieder über entsprechende Dummys in FHEM gehen? Hat jemand soetwas ähnliches vielleicht in Betrieb.
vielen Dank für Eure Antworten
luetty
Ich denke, ich muss den Widgets noch die Parameter hide und hide-value verpassen.
Damit kann man dann ein Reading benennen und den erwarteten Wert zum Unsichtbarschalten.
Das wurde schon öfters gefragt.
Hi setstate,
dass fänd ich natürlich klasse! :D
Ich hatte erst die Idee eine Art HideShowWidget zu basteln, welches man dann um dass eigentliche Widget legt und somit die Anzeige/ Unsichtbarkeit steuern kann. Wäre natürlich kein echtes Widget, aber eine Möglichkeit. Dein Vorschlag ist natürlich sauberer! Es gibt ja auch dass Javascript-Widget - mit dem soetwas sicher auch möglich ist -, dass habe ich aber noch nicht ans fliegen gebracht.
Bin aber zu neu in dem Thema und freue mich über jeden Beitrag den ich hier lesen und nachvollziehen kann 8)
DANKE
luetty
Riesendank an alle Macher von Tablet UI. ;)
Ich habe für lange Texte (z.B. Unwetterwarnung) nach eine Implementierung von einer Laufschrift gesucht, aber nicht gefunden. Mit meinen rudimentären jQuery-Kenntnissen habe ich mir dann folgende Lösung selbst zusammengebastelt.
/* Make CSS for a marquee */
.marquee {
position:absolute;
overflow: hidden;
white-space: nowrap;
}
function marquee()
{
$(".marquee").each(function marquee_each(index,obj) {
$(this).hide();
marqueeStartX=$(this).parent().width();
marqueeSizeX =$(this).width();
if (marqueeSizeX==0 || marqueeStartX==0)
{ marqueeOffsetX=0;
marqueeSpeed =1000; // Fake a pause
}
else
{ marqueeOffsetX=marqueeSizeX+marqueeStartX;
marqueeSpeed =marqueeSizeX*20;
}
$(this).css({"margin-left": marqueeStartX+"px"});
$(this).show();
$(this).animate({'marginLeft' : "-="+marqueeOffsetX+"px"},marqueeSpeed,"linear",marquee_each);
});
}
Das funktioniert zumindest in Chrome auch sehr nett. Ich weiß nur nicht, wie ich die Funktion marquee() nach jedem initPage() ausführen lassen kann, ohne die letztere editieren zu müssen. Hat jemand einen Tipp, wie man eigene Handler einbinden kann?
bin gerade am verzweifeln :(
Ich lasse mir das Wetter für den aktuellen Tag anzeigen. Innerhalb der Anzeige soll/gibt es einen Link (Woche) welcher ein
popup-Fenster öffnen soll (tuts auch) und innerhalb dieses popup möchte ich dann per "swiper" die Vorhersage für die nächsten
Tage darstellen. Der aktuelle tag erscheint auch noch , aber das scrollen scheint nicht zu gehen !?
Gewollt ? oder liegt das an mir ?" (häng den code mal als Anhang ran, ist recht lang.
Wäre total happy wenn mir jemand einen Tip geben kann !
Zitat von: Stril am 15 Januar 2016, 12:07:20
Ich finde es schon sympathisch, wenn der Webserver der Visualisierung abgekapselt werden kann. Das macht das Ganze schön flexibel und man hat als Abfallprodukt die Sicherheitsfunktionen von Apache im Köcher.
Ich hab da mal drüber nachgedacht. Eigentlich sind ja - im Falle TabletUI - alles nur AJAX-Abfragen. Man müsste nur die URL ändern.
Hab's auch gerade ausprobiert und dazu die TabletUI-Files auf einen anderen Webserver gelegt. Dann noch die URL zu FHEM in den betreffenden HTML- und JS-Dateien geändert.
Soweit ich das nach kurzen Tests sagen kann, funktioniert das problemlos.
Mir scheint sogar, die fhem-tablet-ui.js wäre dafür ausgelegt, auf einen anderen Server/Verzeichnis zu zeigen.
url: $("meta[name='fhemweb_url']").attr("content") || "/fhem/",
bzw. in der neuen Version
fhem_dir=$("meta[name='fhemweb_url']").attr("content")||"/fhem/";
Da müssten man dann nur noch
fhemweb_url definieren und hätte alles, was man braucht. Haut bei mir aber noch nicht so richtig hin.
Wie ich schon geschrieben hatte. Ich habe einen LAMPP (Apache) auf das System gebracht, die Sourcen unter '/opt/lampp/htdocs/fhem/www/tablet' abgelegt. Die Seiten werden auch angezeigt, leider ohne die Werte welche aus dem FHEM sonst gefüllt werden. Es erscheint nur eine nackte Schablone. Meine Frage ist halt, wie bekomme ich das Konstrukt dazu sich vom FHEM (Port 8083) die Werte zu holen und sie auf dem Webserver (Port 80) anzuzeigen ohne den internen Webserver von FHEM zu nutzen?
Zitat von: kvo1 am 16 Januar 2016, 00:15:59
bin gerade am verzweifeln :(
Ich lasse mir das Wetter für den aktuellen Tag anzeigen. Innerhalb der Anzeige soll/gibt es einen Link (Woche) welcher ein
popup-Fenster öffnen soll (tuts auch) und innerhalb dieses popup möchte ich dann per "swiper" die Vorhersage für die nächsten
Tage darstellen. Der aktuelle tag erscheint auch noch , aber das scrollen scheint nicht zu gehen !?
Gewollt ? oder liegt das an mir ?" (häng den code mal als Anhang ran, ist recht lang.
Wäre total happy wenn mir jemand einen Tip geben kann !
hast du beim popup data-draggable=false gesetzt?
Zitat von: waschbaerbauch am 16 Januar 2016, 12:30:21
Meine Frage ist halt, wie bekomme ich das Konstrukt dazu sich vom FHEM (Port 8083) die Werte zu holen und sie auf dem Webserver (Port 80) anzuzeigen ohne den internen Webserver von FHEM zu nutzen?
Gar nicht. Von irgendwo her müssen die Daten ja kommen.
TabletUI stellt Abfragen an den Webserver von FHEM und der beantwortet sie. Oder nimmt Befehle von TabletUI entgegen.
Port 8083 ist der Webserver.
Könnte mir nur vorstellen, dass man die gewünschte Konstellation mit telnet her bekommt. Aber dafür ist TabletUI nicht ausgelegt.
Zitat von: setstate am 16 Januar 2016, 12:45:33
hast du beim popup data-draggable=false gesetzt?
Ja habe ich, das ist auch nicht das Problem, das Popup Fenster ist fest, aber der Swiper im Popup
Funktioniert nicht!
Zitat von: setstate am 14 Januar 2016, 22:48:26
Nö, alles da und funktioniert ...
Aber ich Trottel hab vergessen das ganze hochzuladen.
Sorry, ist soeben passiert.
ahh, besten Dank. Klappt super.
Ich habe noch weiter mit FTUI rumgebastelt. Es sieht so aus, dass wenn ich pagetab nutze, geht die Datenaktualisierung nicht mehr. Die Daten werden nur noch bei Tab-Wechsel aktualisiert. Auf der Console kommen stattdessen Fehlermeldungen: Uncaught TypeError: Cannot convert undefined or null to object (siehe Anlage). Wie kann man das fixen?
pagetab und fehler in richtung "werte werden nicht mehr aktualisiert" oder "seite wird nicht mehr vollständig geladen" wurden schon öfter berichtet...
ich bin gewechselt auf pagebutton und seit dem ist alles i.O.
Update: New Widget: Spinner
Mit dem Spinner kann man einen Zahlenwert erhöhen oder verringern. Visualisiert wird der Wert als Balken. Es ist aber auch möglich, anstatt des Balkendiagramms nur den Wert anzuzeigen.
Das Senden an FHEM wird verzögert, bis keine Änderung des Wertes mehr erfolgt.
Beispiele:
Default: Bargraph
<div data-type="spinner"
data-device="dummy1">
</div>
(http://knowthelist.github.io/fhem-tablet-ui/ftui_spinner1.png)
Bargraph in zwei Farben
<div data-type="spinner"
data-device="dummy2"
data-min="10"
data-max="30"
data-gradient-color='["blue","red"]'>
</div>
(http://knowthelist.github.io/fhem-tablet-ui/ftui_spinner2.png)
Anstatt Balken Anzeige als Zahlerwert
<div data-type="spinner"
data-device="dummy3"
data-min="10"
data-max="30"
data-step="0.5"
data-unit="°"
class="valueonly">
</div>
(http://knowthelist.github.io/fhem-tablet-ui/ftui_spinner3.png)
Live-Demo Page:
http://knowthelist.github.io/fhem/tablet/demo_spinner.html (http://knowthelist.github.io/fhem/tablet/demo_spinner.html)
ZitatUpdate: New Widget: Spinner
Hallo setstate,
sieht super aus, danke ;)
klaus
Dem schliesse ich mich an, wirklich klasse!
Kann mir jemand sagen, wie ich die Schriftgröße im Widget Thermostat verkleinern kann, im WVC wird die Anzeige verkleinert dargestellt, aber die Zahlen bleiben groß.
Gruß Bert
@setstate: Das sieht sehr gut aus, habe ich gleich mal eingebaut. Eine Sache die mir allerdings aufgefallen ist, Bei einem Reload der Page ist der Wert im Spinner wieder weg, beim thermostat war das nicht der Fall. Vielleicht kannst Du Dir das nochmal ansehen :)
echt klasse geworden!
Zitat von: hillbicks am 16 Januar 2016, 23:56:24
@setstate: Das sieht sehr gut aus, habe ich gleich mal eingebaut. Eine Sache die mir allerdings aufgefallen ist, Bei einem Reload der Page ist der Wert im Spinner wieder weg, beim thermostat war das nicht der Fall. Vielleicht kannst Du Dir das nochmal ansehen :)
Der Spinner speichert seinen Wert nicht. Er kommt nach einem Refresh immer direkt von FHEM.
Hast du data-get und data-set angegeben? Da muss man explizit tun, wenn man nicht mit STATE arbeitet.
<div data-type="spinner"
data-device="AvReceiver"
data-get="volume"
data-set="volume"
data-max="70">
</div>
Klasse Frontend, vielen Dank.
Zitat von: setstate am 16 Januar 2016, 21:45:51
Update: New Widget: Spinner
Sehr cool! Danke vielmals!
Hallo,
bin immer noch dabei, mir das FTUI einzurichten. Dabei habe ich ein Problem mit den Aktualisierungen am Tablet bzw. am PC, wenn ich Änderungen in einer *.html-Datei mache.
Ich ändere die Dateien am PC in NotePad + und schiebe sie mit Filezilla auf den Raspi. Dann mach ich auf dem Tablet HannsPad 13,3" im offenen Browserfenster (der vorinstallierte Browser) einen reload. Leider ist nur in ca. 50 % der Fälle die Änderung auch tatsächlich sichtbar. In den restlichen Fällen wird nach wie vor das Bild vor der Änderung angezeigt, obwohl die Datei auf dem Raspi das neueste Änderungsdatum zeigt. Scheinbar wird es nicht frisch geladen sondern dann aus einem Cache gezogen. Irgendwann (Zeitraum kann ich nicht sagen, da ich dann am PC den Browser aufmache um weiterzumachen) ist dann das geänderte Bild vorhanden. Dasselbe Verhalten habe ich am PC, so dss ich immer beide am Laufen habe und hoffe, dass auf einem der Geräte das Bild aktualisiert ist. So ist das aber sehr umständlich und unbefriedigend.
Habe auch schon den Browser geschlossen und neu gestartet, aber derselbe Effekt.
Weis jemand, wie man erreichen kann dass die Änderungen immer sofort sichtbar sind?
Gruß Jürgen
Zitat von: setstate am 16 Januar 2016, 21:45:51
Update: New Widget: Spinner
Moin. Sehr geiles Teil. Vielen Dank!
Wollte es für meinen Pioneer AVR einsetzen. Leider für mich ohne Funktion.
Normalerweise unterstützen Pioneer AVR das direkte setzen eine Lautstärke. Nur meiner leider nicht. Auch nocht über eine TelNet-Konsole. Der Befehl dafür wird einfach nicht verstanden.
Gibt es also eventuell die Möglichkeit dass ich mit + und - Befehle senden kann wie "set avr volumeUp" / "set avr volumeDown" und der Spinner trotzdem ein Reading (volume) ausliest und anzeigt?
Das wäre total super :)
Grüße^^
Zitat von: setstate am 17 Januar 2016, 08:34:20
Der Spinner speichert seinen Wert nicht. Er kommt nach einem Refresh immer direkt von FHEM.
Hast du data-get und data-set angegeben? Da muss man explizit tun, wenn man nicht mit STATE arbeitet.
<div data-type="spinner"
data-device="AvReceiver"
data-get="volume"
data-set="volume"
data-max="70">
</div>
Ok, das ist schonmal gut zu wissen fuer den Receiver. Ich hab aber noch ein paar Fragen:
1) Was heisst Refresh in dem Zusammenhang? Nur wenn der Wert geaendert wird? Wenn ich die Seite neu lade ist die Anzeige leer, wenn ich + oder - druecke geht es bei data-min los. Hast Du das auf dem Schirm?
2) Du hast geschrieben das spinner immer einen Moment wartet bevor es die Werte an fhem schickt. Wenn ich fuer den Receiver einmal klicke um die Lautstaerke zu erhoehen, dann wird die Zahl im Widget um einen erhoeht, aber Receiver wird die Lautstaerke aber nicht erhoeht. Es wird ein Volume command geschickt, es bleibt aber unveraendert. Erst wenn ich zweimal klicke, wird die Lautstaerke um 1 erhoeht. Ich hab in der README gesehen das beim data-step noch ** dran sind und ich vermute es haengt damit zusammen.
3) Der Receiver zeigt am Display selbst nicht Volumestraight an, sondern Volume, also den eigentlichen db Wert. Der ist natuerlich negativ. Kannst du data-min und data-max dahingehend kompatibel machen? Ich will damit grade nicht weiter experimentieren, denn in Zusammenhang mit 1) sind mir fast die Boxen um die Ohren geflogen. (Ein Klick ging direkt auf maximale Lautstaerke)
Danke nochmal fuer Deine Arbeit, das hebt FHEM auf die naechste Stufe!
@hillbicks:
1.: So ist das nicht richtig und sollte so auch nicht auftreten. Bei mir ist das nicht so. Hat das Problem noch jemand? Ich brauche noch mehr Info, wie ich das bei mir simulieren kann. Wie sehen deine Parameter aus?
2.: Kann ich auch nicht nachvollziehen. data-step steht per default auf 1. Was passiert, wenn du den gesendeten Befehl per FHEM Commandline sendest? Reagiert der Receiver dann auch nur jedes zweite mal?
3.: sollte kein Problem sein. Funktioniert bei mir:
data-max="-10"
data-min="-99"
Also, für meinen Yamaha-Receiver sieht das ganze so aus und funktioniert wunderbar:
<div data-type="spinner"
data-device="RXV777"
data-get="volumeStraight"
data-set="volumeStraight"
data-min="-60"
data-max="-20"
data-step="0.5"
data-unit="db"
data-icon-left="fa-volume-down"
data-icon-right="fa-volume-up"
class="valueonly fullsize centered">
</div>
Mir ist noch etwas aufgefallen. Wenn ich ein Reading mit deletereading entferne, wird der alte Wert im Label weiterhin angezeigt. Selbst nach einem Reload der Seite wird es weiterhin angezeigt, als wäre der alte Wert noch da. Irgendwas läuft da IMHO noch nicht optimal.
Zitat von: roman1528 am 17 Januar 2016, 12:31:24
Moin. Sehr geiles Teil. Vielen Dank!
Wollte es für meinen Pioneer AVR einsetzen. Leider für mich ohne Funktion.
Normalerweise unterstützen Pioneer AVR das direkte setzen eine Lautstärke. Nur meiner leider nicht. Auch nocht über eine TelNet-Konsole. Der Befehl dafür wird einfach nicht verstanden.
Gibt es also eventuell die Möglichkeit dass ich mit + und - Befehle senden kann wie "set avr volumeUp" / "set avr volumeDown" und der Spinner trotzdem ein Reading (volume) ausliest und anzeigt?
Das wäre total super :)
Grüße^^
Da kann nicht klappen, durch den Zähler, die Verzögerungen usw. Die Werte würde ganz schnell auseinander laufen. Oder man baut ganz viele IFs ein, was das Ganze unübersichtlich macht und unschön ist.
Einfachen wäre es doch, das Aussehen mit anderen Widget zu simulieren:
Push+Label:
<div style="width:200px;border-radius: 30px;" class="bg-gray">
<div data-type="push"
data-device="dummy1"
data-set-on="volumeDown"
data-background-icon="none"
data-icon="fa-volume-down"
data-off-color="#aaa"
class="col-1-5"></div>
<div data-type="label"
data-device="dummy1"
data-get="volume"
class="col-2-5 large"></div>
<div data-type="push"
data-device="dummy1"
data-set-on="volumeUp"
data-background-icon="none"
data-off-color="#aaa"
data-icon="fa-volume-up"
class="col-1-5"></div>
</div>
Push + Level:
<div style="width:200px;border-radius: 30px;" class="bg-gray">
<div data-type="push"
data-device="dummy1"
data-set-on="volumeDown"
data-background-icon="none"
data-icon="fa-volume-down"
data-off-color="#aaa"
class="col-1-5"></div>
<div data-type="level"
data-device="dummy1"
data-get="volume"
data-width="80"
data-height="8"
class="inline horizontal"
id="spinnersimu"></div>
<div data-type="push"
data-device="dummy1"
data-set-on="volumeUp"
data-background-icon="none"
data-off-color="#aaa"
data-icon="fa-volume-up"
class="col-1-5"></div>
</div>
für den Level bräuchte man noch etwas Spezial-Tune in der fhem-tablet-ui-user.css
div#spinnersimu .level_horizontal {
margin:6px 0px 25px 0px !important;
}
Zitat von: aloz77 am 17 Januar 2016, 17:24:42
Mir ist noch etwas aufgefallen. Wenn ich ein Reading mit deletereading entferne, wird der alte Wert im Label weiterhin angezeigt. Selbst nach einem Reload der Seite wird es weiterhin angezeigt, als wäre der alte Wert noch da. Irgendwas läuft da IMHO noch nicht optimal.
Mit der aktuellen Art der Implementierung ist das nicht möglich, alle Readings sind im Cache und die Widgets bekommen nur ein Update, wen sich der Wert ändert. Fehlende Reading sind ein Problem.
Es gab schon Ideen mit Expiredates zu arbeiten, aber ich schau mal, ob man doch irgendwie sehen herausbekommen kann, ob ein Reading fehlt.
Zitat von: setstate am 17 Januar 2016, 19:55:25
Da kann nicht klappen, durch den Zähler, die Verzögerungen usw. Die Werte würde ganz schnell auseinander laufen. Oder man baut ganz viele IFs ein, was das Ganze unübersichtlich macht und unschön ist.
Einfachen wäre es doch, das Aussehen mit anderen Widget zu simulieren:
Super ich danke dir. Dann bleib ich bei meinen Push-Widgets. Da die Anzeige des Volume-Readings auch nicht 100% mit dem Wert auf dem AVR übereinstimmt (Berechnungsfehler im Modul).
Grüße^^
Servus setstate!
gibt es beim Spinner-Widget eigentlich auch einen Parameter, der die "Geschwindigkeit" der Value-Änderung beim "longpress" beeinflusst? Klar, indirekt ginge das über den data-step, aber ich sehe in der Praxis unterschiedliche Anforderungen bei unterschiedlichen Anwendungen.
Bei Lautstärkeänderungen fände ich es unangenehm, wenn man mit dem Slider "überschiesst" und das Widget setzt dann nach dem Delay-Timer das Volume auf den zu hohen Wert. Bei der Temperatur ist es wohl weniger kritisch, wenn auch nervig, wenn man ein paar Mal hin-und-her fahren muss, um den richtigen Wert zu treffen.
Selbst im Widget-Code zu wurschteln finde ich immer semi-ideal, weil die Änderungen nach dem nächsten Update wieder weg sind...
Ich erlaube mir mal einen Cross-Post im Bezug auf eine Installations- und Update-Problematik:
http://forum.fhem.de/index.php/topic,47626.0.html
Hallo setstate,
ich würde gerne die "Original Icons" für das Weather-Widget für Proplanta verwendet. Lässt sich das irgendwie in das Widget mit einbauen?
für den Download der Icons hat "Hexenmeister" ein Script geschrieben http://forum.fhem.de/index.php/topic,31160.msg297505.html#msg297505 (http://forum.fhem.de/index.php/topic,31160.msg297505.html#msg297505)
Viele Grüße
Achim
Hab gerade mit TABLET UI angefangen und bin dabei mich einzuarbeiten.
Habe folgendes definiert:
<div class="doublebox-v">
<div data-type="push" data-device="SqueezeBoxRadio"
data-icon="fa-chevron-up"
data-set="volumeUp">
</div>
<div data-type="push" data-device="SqueezeBoxRadio"
data-icon="fa-chevron-down"
data-set="volumeDown">
</div>
</div>
Die PUSH-Tasten funktionieren aber nicht.
Wenn ich dafür SWITCH nehme, geht es. Allerdings bleibt dann der Knopf hell.
Was mach ich da falsch ?
Gruß
data-set-on="volumeUp"
data-set ist für die Angabe eines Readings.
Hallo zusammen,
bin gerade sehr begeistert von TabletUI und bau gerade einiges zusammen, aus den klasse Vorbildern
http://www.juergenstechnikwelt.de/smarthome-2/smarthome-mit-fhem-meine-beispielkonfiguration-ueber-google-drive-verfuegbar/
und
http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui/13-ftui-tablet
Danke für die Bereitstellung.
Jetzt würde ich noch gerne eine TV-Programmansicht ergänzen. Da ich jetzt nicht auf dem weißen Papier anfangen möchte, da mein Verständnis aktuell noch nicht sehr gut ist wollte ich Fragen ob einer schon eine solche Ansicht zusammen gebaut hat?
Hallo Zusammen
was nimmt ihr als Device dafür, wenn ihr es an die Wand montieren solltet?
Gibt es einen Bildschirm der wenig Strom verbraucht, aber dennoch eine Sehr gute Helligkeit ausweisst am besten mit Touchscreen?
Gruss, Markus
Hallo Zusammen
was nimmt ihr als Device dafür, wenn ihr es an die Wand montieren solltet?
Gibt es einen Bildschirm der wenig Strom verbraucht, aber dennoch eine Sehr gute Helligkeit ausweisst am besten mit Touchscreen?
Gruss, Markus
Also im Wiki steht:
"data-set value to send to Fhem"
Funktioniert ja auch wenn ich einen switch definiere.
Nur mit push tut sich nichts.
Zitat von: Lichti am 18 Januar 2016, 21:33:54
Also im Wiki steht:
"data-set value to send to Fhem"
Funktioniert ja auch wenn ich einen switch definiere.
Nur mit push tut sich nichts.
Das Thema hatten wir heute schon mal. Vermutlich ist das WIKI nicht up-to-date.
####Push widgets
- **data-set** : name of the reading to set on FHEM (\<command\> \<device\> **\<reading\>** \<value\>) (default '')
- **data-set-on** : value (or an array of values) to send when the the button get pressed. (default '')
data-set ist für den Reading-Name
data-set-on ist der Wert
Ein leeres data-set-on unterdrückt das Senden.
Danke, das war's.
Zitat von: setstate am 18 Januar 2016, 21:52:51
Das Thema hatten wir heute schon mal. Vermutlich ist das WIKI nicht up-to-date.
####Push widgets
Ich habe das im Wiki mal angepasst
Im github ist bei PUSH übrigens data-icon zweimal mit leicht unterschiedlicher Beschreibung aufgeführt
Zitat von: ulli am 18 Januar 2016, 21:20:14
Hallo zusammen,
bin gerade sehr begeistert von TabletUI und bau gerade einiges zusammen, aus den klasse Vorbildern
http://www.juergenstechnikwelt.de/smarthome-2/smarthome-mit-fhem-meine-beispielkonfiguration-ueber-google-drive-verfuegbar/
und
http://ueberueck.com/index.php/fhem-hausautomatisierung/fhem-tablet-ui/13-ftui-tablet
Danke für die Bereitstellung.
Jetzt würde ich noch gerne eine TV-Programmansicht ergänzen. Da ich jetzt nicht auf dem weißen Papier anfangen möchte, da mein Verständnis aktuell noch nicht sehr gut ist wollte ich Fragen ob einer schon eine solche Ansicht zusammen gebaut hat?
nicht wirklich , nur mal so als Test :-[
<li data-row="8" data-col="2" data-sizex="8" data-sizey="3" class="semitransparent">
<header>TV Programm</header>
<div data-type="swiper" data-height="132px" data-width="740px" class="">
<ul>
<li>
<div data-type="label" class="big">A R D</div>
<div class="cell center">
<div data-type="label" class="cell narrow inline"> Aktuell: </div>
<div data-type="label" data-device="TV_Programme" data-get="ARD" class="cell"></div>
</div>
<div class="cell center">
<div data-type="label" class="cell narrow inline"> Ab </div>
<div data-type="label" data-device="TV_Programme" data-get="ARD_Nexttime" class="cell inline"></div>
<div data-type="label" class="cell narrow inline"> Uhr:</div>
<div data-type="label" data-device="TV_Programme" data-get="ARD_Next" class="cell inline"></div>
</div>
</li>
<li>
<div data-type="label" class="big">P R O 7</div>
<div class="cell center">
<div data-type="label" class="cell narrow inline"> Aktuell: </div>
<div data-type="label" data-device="TV_Programme" data-get="Pro7" class="cell"></div>
</div>
<div class="cell center">
<div data-type="label" class="cell narrow inline"> Ab </div>
<div data-type="label" data-device="TV_Programme" data-get="Pro7_Nexttime" class="cell inline"></div>
<div data-type="label" class="cell narrow inline"> Uhr:</div>
<div data-type="label" data-device="TV_Programme" data-get="Pro7_Next" class="cell inline"></div>
</div>
</li>
<li>
<div data-type="label" class="big">R B B</div>
<div class="cell center">
<div data-type="label" class="cell narrow inline"> Aktuell: </div>
<div data-type="label" data-device="TV_Programme" data-get="RBB" class="cell"></div>
</div>
<div class="cell center">
<div data-type="label" class="cell narrow inline"> Ab </div>
<div data-type="label" data-device="TV_Programme" data-get="RBB_Nexttime" class="cell inline"></div>
<div data-type="label" class="cell narrow inline"> Uhr:</div>
<div data-type="label" data-device="TV_Programme" data-get="RBB_Next" class="cell inline"></div>
</div>
</li>
</li>
</ul>
</div>
</li>
Zitat von: Achim am 18 Januar 2016, 18:36:15
Hallo setstate,
ich würde gerne die "Original Icons" für das Weather-Widget für Proplanta verwendet. Lässt sich das irgendwie in das Widget mit einbauen?
für den Download der Icons hat "Hexenmeister" ein Script geschrieben http://forum.fhem.de/index.php/topic,31160.msg297505.html#msg297505 (http://forum.fhem.de/index.php/topic,31160.msg297505.html#msg297505)
Viele Grüße
Achim
Die originalen Images kann man sich direkt per Image-Widget live anzeigen lassen. Die URL ist ja immer mit dabei:
fc0_weatherDayIcon
http://www.proplanta.de/wetterdaten/images/symbole/t3.gif
Das gibt man bei data-get einfach an
<div data-type="image"
data-device="AgroWeather"
data-get="fc0_weatherDayIcon"
data-width="50">
</div>
Aber wenn du kein helles Theme beim FTUi hast, sonder die Standardfarben nutzt, passen die proplanta Icons absolut zum FTUI. Das sieht nicht schön aus, sieht aus, wie ausgeschnitten und aufgeklebt ... Die Icons sind für weiße Hintergründe designt.
Wo kann ich die Font-Grösse im Thermostat-Widget verändern?
Gruß Bert
Zitat von: bert am 19 Januar 2016, 09:26:51
Wo kann ich die Font-Grösse im Thermostat-Widget verändern?
Gruß Bert
Die große Zahl in der Mitte?
Dafür müsste man einen Eintrag in die *-user.css machen
[data-type="thermostat"] input {
font-size: 50px !important;
}
Hab ich einen Knick in der Pupille, oder ist beim Spinner-Widget das "+" Zeichen horizontal etwas höher als das "-" Zeichen?
Zitat von: tomster am 19 Januar 2016, 11:48:50
Hab ich einen Knick in der Pupille, oder ist beim Spinner-Widget das "+" Zeichen horizontal etwas höher als das "-" Zeichen?
Ich empfinde es eher anders herum...
Aber hättest Du es nicht in den Ring geworfen, mir wäre es garnicht aufgefallen.
Für mich ist es so aber ok.
Mir ist grad beim Spielen mit dem Spinner-Widget eine Idee für ein "integriertes Thermostat-Widget" gekommen. Eine Visualisierung dazu habe ich kurz mit Photoshop zusammengeclickt.
Damit würde bei der Bedienung des Thermostats "the best of both worlds" zur Verfügung stehen:
entweder im-Kreis-Touchen oder aber um die entsprechenden data-steps klickbar. Zudem hätte man noch Platz für die Anzeige von weiteren Features des Thermostaten (z.B. winOpenReporting oder controlMode, oder aber Wechsel Ist-Temp/Humidity ähnlich wie beim Hardware-Thermostat)...
--Edith--
Siehe Bild 2
Vielleicht auch mit "verkehrt herumer" Logik im ARC-Teil (Großer Tick = Ist-Temp, kleiner Wert = Soll-Temp).
Ich hab das Mal so gut wie möglich nachgebaut (ohne die Symbole innerhalb des ARCs), indem ich bei data-get/ data-set measured-temp und desired-temp vertauscht und das Thermostat-Widget auf class="readonly" gesetzt habe. Damit kann man zwar die Soll-Temp nur noch mit den -/+ Zeichen regeln, aber 0.5°C-Schritte sind mir eigentlich Sache genug...
--Edith--
Meinungen?
@setstate
hab ich gemacht es ändert sich aber nichts.
gruß bert
@tomster: die idee finde ich klasse. aber nur nur für den thetmostat sondern auch für colume und hue.
was noch schön wäre: bei streps=0.5 dir ganzen werte als XX.0 anzeigen damit es nicht so hin und her zappelt.
Zitat von: setstate am 16 Januar 2016, 21:45:51
Update: New Widget: Spinner
Super. Gibt es das auch in vertikaler Form?
Zitat von: Haecksler am 09 Januar 2016, 12:57:00
Also ich bin da offen, wäre es nicht am einfachste ein Array zu machen.
Ich hatte mir das so vorgestellt ich mache mir Dummies mit denen ich die Schaltzeiten an einen Weekdaytimer weitergebe...dann würde ich noch ein userReading machen, welches die Uhrzeit in eine Kommazahl also aus 12:30 wird 12,5 umsetzt, dieses Reading würde dann ins Array vom Range-Widget kommen. Also immer 2 Zahlenpaare im Array für einen Bereich.
Hallo setstate,
hast du vielleicht einen Tipp wie ich das range-widget horizontal bekommen könnte? Das mit den zwei oder Mehrbereichen ist erstmal nicht so wichtig, würde dann halt mehrere range-widgets untereinander packen.
Gruß,
Stefan
@tomster: Idee mit dem integriertem Thermostat finde ich auch gut
Hallo,
ich habe Probleme mit dem "data-cmd" Attribut. Es funktioniert nicht so, wie ich es aus der Doku herauslese:
https://github.com/knowthelist/fhem-tablet-ui (https://github.com/knowthelist/fhem-tablet-ui)
Zitat•data-get : name of the reading to get from FHEM (default 'STATE')
•data-set : name of the reading to set from FHEM (default '')
•data-set-on : value for ON status to set. (default: value of data-get-on)
•data-set-off : value for OFF status to set. (default: value of data-get-off)
•data-cmd : name of the command (<command> <device> <reading> <value>) (e.g. setstate, set, setreading, trigger)
Ich habe folgende Widgetkonfiguration:
<div data-type="switch"
data-background-icon="none"
data-device="du_muelltermine"
data-get="Christbaeume"
data-cmd="setreading"
data-states='["-","off","[01]","[1-9][0-9]|[2-9]"]'
data-icons='["fs-christmas_tree","fs-christmas_tree warn","fs-christmas_tree warn blink","fs-christmas_tree warn"]'
data-colors='["Green","Green","Green","Green"]'
class="bigger">
</div>Und egal bei welches Widget ich verwende (switch, button, pagebutton), der Befehl, der beim Klick auf den Button ausgelöst wird, ist:
Zitatsetreading du_muelltermine on
Es fehlt immer die Angabe des Readings. So wie ich das aus der Doku entnehme, müsste als "Reading" der Wert von "data-get" eingefügt werden. Und der fehlt. Wo habe ich da den Denkfehler?
Viele Grüße
Achim
data-set ist das Reading was gesetzt werden soll.
data-get was geholt wird
Range gibt es nur vertikal und Spinner nur horizontal, da gibt es keine Schalter zum Umschalten.
Es wäre eine Fleißaufgabe, da noch jede Menge IFs einzubauen und entsprechende CSS Klassen anzulegen.
Zitat von: kvo1 am 16 Januar 2016, 00:15:59
bin gerade am verzweifeln :(
Ich lasse mir das Wetter für den aktuellen Tag anzeigen. Innerhalb der Anzeige soll/gibt es einen Link (Woche) welcher ein
popup-Fenster öffnen soll (tuts auch) und innerhalb dieses popup möchte ich dann per "swiper" die Vorhersage für die nächsten
Tage darstellen. Der aktuelle tag erscheint auch noch , aber das scrollen scheint nicht zu gehen !?
Gewollt ? oder liegt das an mir ?" (häng den code mal als Anhang ran, ist recht lang.
Wäre total happy wenn mir jemand einen Tip geben kann !
Hallo Zusammen,
ich würde gern das Thema nochmal aufgreifen wollen.
Habe jetzt mehrfach versucht, aber offensichtlich geht das mit dem "swiper" innerhalb eines popup-Fensters nicht !
Oder hat das doch jemand in ähnlicher Art und Weise. ?
data-draggable="false" ist gesetzt ! Das ist auch nicht das Problem!
Das ist wieder das leidige Update Problem bei minimierten Elementen.
Ein Fix ist unterwegs ...
Zitat von: tomster am 19 Januar 2016, 13:51:00
Mir ist grad beim Spielen mit dem Spinner-Widget eine Idee für ein "integriertes Thermostat-Widget" gekommen. Eine Visualisierung dazu habe ich kurz mit Photoshop zusammengeclickt.
Damit würde bei der Bedienung des Thermostats "the best of both worlds" zur Verfügung stehen:
entweder im-Kreis-Touchen oder aber um die entsprechenden data-steps klickbar. Zudem hätte man noch Platz für die Anzeige von weiteren Features des Thermostaten (z.B. winOpenReporting oder controlMode, oder aber Wechsel Ist-Temp/Humidity ähnlich wie beim Hardware-Thermostat)...
--Edith--
Siehe Bild 2
Vielleicht auch mit "verkehrt herumer" Logik im ARC-Teil (Großer Tick = Ist-Temp, kleiner Wert = Soll-Temp).
Ich hab das Mal so gut wie möglich nachgebaut (ohne die Symbole innerhalb des ARCs), indem ich bei data-get/ data-set measured-temp und desired-temp vertauscht und das Thermostat-Widget auf class="readonly" gesetzt habe. Damit kann man zwar die Soll-Temp nur noch mit den -/+ Zeichen regeln, aber 0.5°C-Schritte sind mir eigentlich Sache genug...
--Edith--
Meinungen?
sieht Klasse aus!!! Der Bereich innerhalb des ARC als Slider/Swiper wär ein Traum.
Zitat von: setstate am 19 Januar 2016, 23:03:54
Das ist wieder das leidige Update Problem bei minimierten Elementen.
Ein Fix ist unterwegs ...
Hallo setstate,
Du bist echt schnell ;) Danke funktioniert !
klaus
@Nesges
danke für den Pizzatimer.
Habe zwei Probleme damit.
Kannst Du die seconds_humenreadable sharen ?
fhem> {pizzatimer('TIMER1',600)}
Undefined subroutine &main::seconds_humanreadable called at ./FHEM/99_myUtils.pm line 422.
Habe erstmal die entsprechenden Zeilen auskommentiert.
Starte ich den Timer über FTUI, wird dummerweise kein at angelegt.
Beim Start über die fhem Console wird das at defined.
fhem> {pizzatimer('TIMER1',600)}
fhem> list TIMER1.*
TIMER1
TIMER1_at
Weisst Du warum ?
Danke im voraus und Gruß !
Hallo,
wie ist es möglich Zahlen oder Buchstaben in ein Icon zu schreiben?
Anastatt dem "Bett" hätte ich gerne eine "10"
<div data-type="push" data-device="alles_schalten" class="narrow" data-icon="fa-bed" data-set-on="schlafen"></div>
<div data-type="label" class="cell small darker">schlafen</div>
Gruß
TWART016
Da gibt es einige Icons im FHEM mit 'fs-' z.B. data-icon="fs-rc_1" oder siehe im PS
PS: Wahlweise vor </div> eine '10'
Zitat von: waschbaerbauch am 20 Januar 2016, 22:43:26
Da gibt es einige Icons im FHEM mit 'fs-' z.B. data-icon="fs-rc_1" oder siehe im PS
PS: Wahlweise vor </div> eine '10'
Die 10 zwischen <div> und </div> hat funktioniert. Jedoch ist die Farbe weiß, wie kann ich die auf weiß ändern?
Die fs-icons konnte ich über den command einbinden:
<link rel="stylesheet" href="/fhem/www/tablet/lib/fhemSVG.css" />Wie kann ich mir alle Icons auf der css anzeigen lassen?
Bei der Zahl ist nochmal eine eckige Umrandung. Kann ich die entfernen?
Zitat von: TWART016 am 20 Januar 2016, 23:42:39
Jedoch ist die Farbe weiß, wie kann ich die auf weiß ändern?
Das ist recht simpel: einfach NIX machen ;-)
P.S. Für den Fall, dass ich die Frage mißverstanden hab, hilft vielleicht ein style-tag mit "color:not-white;"
Zitat von: tomster am 20 Januar 2016, 23:54:32
Das ist recht simpel: einfach NIX machen ;-)
Ich will natürlich graue Schrift, bisher ist sie weiß.
<div data-type="push" data-device="alles_schalten" class="narrow" data-icon="10" data-set-on="timer5_einschlafen">10</div>Wie müsste das style-tag aussehen?
Zitat von: TWART016 am 20 Januar 2016, 23:42:39
Wie kann ich mir alle Icons auf der css anzeigen lassen?
Bei der Zahl ist nochmal eine eckige Umrandung. Kann ich die entfernen?
Die Umrandung ist ja Teil des angezeigten Bildes, die wirst du mMn nicht entfernen können. Möglichkeiten hier wären dir eigene svg zu bauen bzw. dir welche im Netz zu suchen welche dir zusagen und einen der online Generatoren für Iconfonts zu bemühen.
Die verfügbaren Bilder findest du unter '/fhem/www/images/fhemSVG/' - die Namen sind in der entsprechenden .css aufgeführt, für diesen Fall unter '/fhem/tablet/lib/fhemSVG.css'.
Hallo zusammen,
meine Kamera am Eingang bietet mir ein Bild auf der Webseite http://xxx.xxx.net:8099/camera.asp. Dieses wollte ich im TabletUI einbinden.
Ich habe es als IFrame versucht, aber das klappt nicht. Auf der FHEM oberfläche funktioniert es allerding.
Ansonnsten bietet meine Kamera RTSP an. Da weiß ich gar nicht wie das Funktioniert :-(
MJPEG RTSP
H.264 RTSP
So habe ich es versucht:
<li data-row="2" data-col="1" data-sizex="9" data-sizey="6">
<header>GARTENTOR</header>
<div data-type="iframe"
data-src="http://xxx.xxx.net:8099/camera.asp"
data-width="646"
data-height="447">
</li>
Zitat von: TWART016 am 21 Januar 2016, 00:09:05
Wie müsste das style-tag aussehen?
So sollte es funktionieren:
<div data-type="push" data-device="alles_schalten" class="narrow" data-icon="10" data-set-on="timer5_einschlafen" style="color:grey;">10</div>Oder halt jede Farbe (evtl. hex-code) einsetzen, die Du haben möchtest.
Zitat von: RettungsTim am 21 Januar 2016, 09:07:03
Hallo zusammen,
meine Kamera am Eingang bietet mir ein Bild auf der Webseite http://xxx.xxx.net:8099/camera.asp. Dieses wollte ich im TabletUI einbinden.
Ich habe es als IFrame versucht, aber das klappt nicht. Auf der FHEM oberfläche funktioniert es allerding.
Ansonnsten bietet meine Kamera RTSP an. Da weiß ich gar nicht wie das Funktioniert :-(
MJPEG RTSP
H.264 RTSP
Ich hab's mit dem iframe-Widget auch nicht zufriedenstellend hinbekommen, drum hab ich's direkt gelöst. Probier Mal:
li data-row="2" data-col="1" data-sizex="9" data-sizey="6">
<header>GARTENTOR</header>
<iframe frameborder="0" width="646" scrolling="no" height="447" src="http://xxx.xxx.net:8099/camera.asp">
</iframe>
</li>Ach ja, RTSP. Das geht auf den meisten Browsern leider nicht mehr. Vor einiger Zeit wurde bei vielen Browsern ein bestimmtes Plug-in-Format "gesperrt". Für das alternativ von den Programmieren vorgesehene Format gibt es aber noch kaum Plug-ins. Drum schaut man momentan ziemlich in die Röhre. Das VLC-Plugin produziert auf meinem RasPi2 in Verbindung mit Iceweasel gut und gerne 80% Prozessorlast.. -> Keine Alternative.
Wenn aber jemand eine vernünftige Lösung (neue Browserversion, etc.) kennt, um RTSP/h.264 direkt im Browser wiederzugeben, dann bitte ich um Benachrichtigung. Ich würd nämlich auch gern meine Überwachungskamera im FTUI anzeigen lassen...
Zitat von: kumue am 20 Januar 2016, 07:25:20
@Nesges
danke für den Pizzatimer.
Habe zwei Probleme damit.
Kannst Du die seconds_humenreadable sharen ?
fhem> {pizzatimer('TIMER1',600)}
Undefined subroutine &main::seconds_humanreadable called at ./FHEM/99_myUtils.pm line 422.
Habe erstmal die entsprechenden Zeilen auskommentiert.
Starte ich den Timer über FTUI, wird dummerweise kein at angelegt.
Beim Start über die fhem Console wird das at defined.
fhem> {pizzatimer('TIMER1',600)}
fhem> list TIMER1.*
TIMER1
TIMER1_at
Weisst Du warum ?
Danke im voraus und Gruß !
Den zweiten Teil habe ich hinbekommen.. :)
data-fhem-cmd ist das Zauberwort... kannte ich noch nicht.
Hallo waschbaerbauch, Hallo tomster,
Zitat von: waschbaerbauch am 21 Januar 2016, 01:02:33
Die verfügbaren Bilder findest du unter '/fhem/www/images/fhemSVG/' - die Namen sind in der entsprechenden .css aufgeführt, für diesen Fall unter '/fhem/tablet/lib/fhemSVG.css'.
Gibt es die Möglichkeit sich alle auf einmal anzeigen zu lassen? Jede einzelne per Doppelklick öffnen ist ziemlich aufwendig.
Zitat von: tomster am 21 Januar 2016, 09:48:15
<div data-type="push" data-device="alles_schalten" class="narrow" data-icon="10" data-set-on="timer5_einschlafen" style="color:grey;">10</div>
Danke, funktioniert :)
Hallo TWART016,
sofern du mit einem Windows Rechner arbeitest.
Ich habe mir die Fontdateien (*.TTF) auf den Rechner kopiert. Dort sehe ich sie mir mit dem Programm "Fontviewer" http://www.fontviewer.de (http://www.fontviewer.de) an. Ist nur eine EXE.
Viele Grüße
Achim
Zitat von: TWART016 am 21 Januar 2016, 20:10:30
Hallo waschbaerbauch, Hallo tomster,
Gibt es die Möglichkeit sich alle auf einmal anzeigen zu lassen? Jede einzelne per Doppelklick öffnen ist ziemlich aufwendig.
Danke, funktioniert :)
Klar, indem du im FHEM ein Device auswählst und auf 'Select Icon' gehst. Alles was dort angezeigt wird ist ein Teil von 'fs-' oder 'oa-'.
Dort kannst du dir das passende Icon aussuchen und wenn du mit der Maus drüber gehst, dann zeigt es dir den Namen an. Alles was du machen muss ist dann im HTML gucken ob es aus 'fs-' oder 'oa-' kommt. Alternativ kopiere dir die Ordner mit den SVGs lokal in ein Verzeichnis und richte eine Vorschau ein.
@Achim
Danke für den Tipp - probier ich auch gleich mal aus :)
PS: Zum ansehen des Fonts ist das Teil ja schon cool, aber wo zum Henker finde ich darin denn die Information wie der entsprechende Name zum Fonticon ist?
PPS: Für die Vorschau im Explorer benötigst du eventuell das hier https://svgextension.codeplex.com/
Zitat von: waschbaerbauch am 21 Januar 2016, 20:40:21
Alternativ kopiere dir die Ordner mit den SVGs lokal in ein Verzeichnis und richte eine Vorschau ein.
Bei wird jedoch nur das Symbol vom Edge angezeigt. Mit welchem Programm sind deine svg's verknüpft?
Zitat von: waschbaerbauch am 21 Januar 2016, 20:40:21
PS: Zum ansehen des Fonts ist das Teil ja schon cool, aber wo zum Henker finde ich darin denn die Information wie der entsprechende Name zum Fonticon
Die Frage habe ich auch?
Gibt es die Möglichkeit die Farbe der Icons zu ändern?
Kann man 2 Icons in einem Kreis sich anzeigen lassen?
Zitat von: TWART016 am 21 Januar 2016, 21:17:34
Bei wird jedoch nur das Symbol vom Edge angezeigt. Mit welchem Programm sind deine svg's verknüpft?
Antwort ist im PPS ;)
Hallo TWART016, waschbaerbauch
die Zuordnung zu dem Dateinamen ist etwas "tricky".
Im Programm "Fontviewer" im unteren Fenster unter Ansicht "alle Glyphen mit Schrift" auswählen und zusätzlich "Zeichenraster" und "Unicodes anzeigen" auswählen. Dann sieht man bei jedem Symbol den Unicode (z.B. F000 beim "Sektglas" in der Fontawesome Schrift.
Jetzt die css Datei der Schrift öffnen (z.B. ../tablet/lib/font-awesome.min.css). Dort dann nach "f000" suchen.
Zitat.fa-glass:before{content:"\f000"}.
und schon hat man den Namen des Icons. Die Datei ist die einzige ohne Newlines, bei den anderen ist es etwas übersichtlicher.
Ich weiß, nicht gerade eine einfache Lösung, aber man kann sich die Icons schön groß von jeder Schrift ansehen.
Viele Grüße
Achim
schaut euch mal die gen_iconsdemo.pl von nesges an. Damit kann man sich Demoseiten für die verfügbaren Icons generieren. Zu finden im Github Projektverzeichnis.
Zitat von: bmwfan am 17 Januar 2016, 12:09:18
Hallo,
bin immer noch dabei, mir das FTUI einzurichten. Dabei habe ich ein Problem mit den Aktualisierungen am Tablet bzw. am PC, wenn ich Änderungen in einer *.html-Datei mache.
Ich ändere die Dateien am PC in NotePad + und schiebe sie mit Filezilla auf den Raspi. Dann mach ich auf dem Tablet HannsPad 13,3" im offenen Browserfenster (der vorinstallierte Browser) einen reload. Leider ist nur in ca. 50 % der Fälle die Änderung auch tatsächlich sichtbar. In den restlichen Fällen wird nach wie vor das Bild vor der Änderung angezeigt, obwohl die Datei auf dem Raspi das neueste Änderungsdatum zeigt. Scheinbar wird es nicht frisch geladen sondern dann aus einem Cache gezogen. Irgendwann (Zeitraum kann ich nicht sagen, da ich dann am PC den Browser aufmache um weiterzumachen) ist dann das geänderte Bild vorhanden. Dasselbe Verhalten habe ich am PC, so dss ich immer beide am Laufen habe und hoffe, dass auf einem der Geräte das Bild aktualisiert ist. So ist das aber sehr umständlich und unbefriedigend.
Habe auch schon den Browser geschlossen und neu gestartet, aber derselbe Effekt.
Weis jemand, wie man erreichen kann dass die Änderungen immer sofort sichtbar sind?
Gruß Jürgen
Gibt es daruf eine Antwort? Ich habe Sie in diesem extremen Thema nicht gefunden?!
Hallo zusammen,
ich benutze eine von @uniqueck angepasste Version des calview Widget. Bei einem Update wird diese Datei immer wieder überschrieben. Wie muss ich vorgehen, damit ich beide Versionen des Widgets parallel verwenden kann? Welche Datei muss ich dafür anpassen? Bin leider nicht so fit in diesen Sachen. Vielen Dank.
Eine weitere Frage ist: Zur Zeit nutze ich das UI für ein 10 Zoll Tablet was an der Wand hängt. Ich möchte mir noch ein UI für mein Smartphone erstellen. Wie kann ich das am besten lösen? Könnte man dazu nicht eine kurze Anleitung schreiben?
Vielen Dank für Eure Hilfe
Zitat von: uniqueck am 27 Oktober 2015, 01:23:46
hallo @skuggy schön das noch ein paar das calview widget nutzen.
ich habe heute mal ein bissl rumprobiert und habe deine anforderungen mal so umgesetzt, allerdings nutze ich nur den part data-get="all", für die anderen müsstest du das dann einfach adaptieren.
des weiteren habe ich noch zwei eigenschaften eingeführt, womit sich die einfärbung steuern lässt.
data-all-forecast-color="#FFF200"
data-all-today-color="6EB54C"
wie gesagt mal schnell zusammen getippt.
was mir noch irgendwie schleier haft ist, ist das cachen, irgendwie cachet der browser die anzeige.
vielleicht kann mir da jemand einen tipp geben, dass das nicht passiert.
wobei ich gerade sehe, dass der termin tatsächlich bei dem device calview zwei mal drin steht.
DEF Geburtstage
INTERVAL 43200
KALENDER Geburtstage
NAME GeburtstageCalView
NR 132
STATE t: 10 td: 2 tm: 1
TYPE CALVIEW
Readings:
2015-10-27 01:38:53 c-term 10
2015-10-27 01:38:53 c-today 2
2015-10-27 01:38:53 c-tomorrow 1
2015-10-27 01:38:53 state t: 10 td: 2 tm: 1
2015-10-27 01:38:53 t_001_bdate 27.10.2015
2015-10-27 01:38:53 t_001_btime 00:00:00
2015-10-27 01:38:53 t_001_edate 28.10.2015
2015-10-27 01:38:53 t_001_etime 00:00:00
2015-10-27 01:38:53 t_001_location 1985
2015-10-27 01:38:53 t_001_source Geburtstage
2015-10-27 01:38:53 t_001_summary Test 1
2015-10-27 01:38:53 t_002_bdate 27.10.2015
2015-10-27 01:38:53 t_002_btime 00:00:00
2015-10-27 01:38:53 t_002_edate 28.10.2015
2015-10-27 01:38:53 t_002_etime 00:00:00
2015-10-27 01:38:53 t_002_location 1985
2015-10-27 01:38:53 t_002_source Geburtstage
2015-10-27 01:38:53 t_002_summary Test 1
2015-10-27 01:38:53 t_003_bdate 28.10.2015
2015-10-27 01:38:53 t_003_btime 00:00:00
2015-10-27 01:38:53 t_003_edate 29.10.2015
2015-10-27 01:38:53 t_003_etime 00:00:00
2015-10-27 01:38:53 t_003_location 1910
2015-10-27 01:38:53 t_003_source Geburtstage
2015-10-27 01:38:53 t_003_summary Morgen 2
gruß uniqueck
Zitat von: RettungsTim am 22 Januar 2016, 07:01:44
Gibt es daruf eine Antwort? Ich habe Sie in diesem extremen Thema nicht gefunden?!
Das ist schwierig zu beantworten. Setstate hat meine ich mal Möglichkeiten für dieses 'Verhalten' aufgezeigt.
Bei mir ist dieses Problem anfangs auch öfter aufgetaucht. Es scheint aus meiner Sicht eine Mischung aus diversen Ursachen zu sein.
Zum einen waren es bei mir 'unsauber programmierte' HTML Seiten (fehlende oder am falschen Ort geschlossene Tags) die mit dem internen FHEM Webserver kollidiert sind. Das liegt mit Sicherheit an meinen mangelnden HTML Kenntnissen und dem daraus resultierenden zusammen kopieren von Blöcken ohne genau zu blicken was da grad genau abläuft. Das hab ich hoffentlich jetzt nach und nach ein wenig bereinigt. Mit einem Apache Server aus dem LAMPP Paket konnte man die Seiten zumindest sauber anzeigen (scheint auf Fehler toleranter zu reagieren), allerdings ohne die Werte aus dem FHEM.
Zum anderen treten diese Reload Probleme aktuell bei mir nur noch im Chrome und Firefox auf, der IE ist davon eher selten betroffen. Es kann aber auch an der Masse der geöffneten Tabs im Chrome/Firefox liegen und ggf. Problemen in der Speicherverwaltung. Im IE hilft idR ein STRG+F5.
Hallo!
Schafft ihr es einen Chart mit "gleitendem" Zeitintervall hinzubekommen?
Ich verstehe das Wiki so, dass das der Parameter "data-nofulldays="true"" machen sollte, aber ich habe noch immer einen Graphen, der von heute Morgen 0 Uhr bis heute 24 Uhr
Gibt es hier noch etwas zu beachten, dass wirklich die letzten 24 Stunden angezeigt werden?
Danke und Grüße
Phil
Zitat von: skuggy am 22 Januar 2016, 07:05:32
Eine weitere Frage ist: Zur Zeit nutze ich das UI für ein 10 Zoll Tablet was an der Wand hängt. Ich möchte mir noch ein UI für mein Smartphone erstellen. Wie kann ich das am besten lösen? Könnte man dazu nicht eine kurze Anleitung schreiben?
http://forum.fhem.de/index.php/topic,37378.msg384862.html#msg384862 (http://forum.fhem.de/index.php/topic,37378.msg384862.html#msg384862)
Hier ist auch ein Template für eine Mobile-Version vorhanden. Diese nutzt aber auch sachen aus dem Ordner tablet. Da musst du mal gucken, wie du das dann bei dir einbaust.
Wenn du auch einen Link aus FHEM heraus haben möchtest, dann definierst du einfach einen weiteren HTTPSRV:
define TABLETUIMobile HTTPSRV ftui-mobile/ ./www/mobile Tablet-UI-MobileGruß Michael
Zitat von: setstate am 21 Januar 2016, 21:31:14
schaut euch mal die gen_iconsdemo.pl von nesges an. Damit kann man sich Demoseiten für die verfügbaren Icons generieren. Zu finden im Github Projektverzeichnis.
Danke für den Tipp!
@Rettungstim
Ich nutze WinSCP und Programmer´s Notepad, damit kann ich direkt auf dem Fhem Rechner editieren.
Gruß Bert
Zitat von: bert am 22 Januar 2016, 10:24:48
@Rettungstim
Ich nutze WinSCP und Programmer´s Notepad, damit kann ich direkt auf dem Fhem Rechner editieren.
Gruß Bert
ich SAMBA und notepad++
Zitat von: l2r am 22 Januar 2016, 09:40:53
http://forum.fhem.de/index.php/topic,37378.msg384862.html#msg384862 (http://forum.fhem.de/index.php/topic,37378.msg384862.html#msg384862)
Hier ist auch ein Template für eine Mobile-Version vorhanden. Diese nutzt aber auch sachen aus dem Ordner tablet. Da musst du mal gucken, wie du das dann bei dir einbaust.
Wenn du auch einen Link aus FHEM heraus haben möchtest, dann definierst du einfach einen weiteren HTTPSRV:
define TABLETUIMobile HTTPSRV ftui-mobile/ ./www/mobile Tablet-UI-Mobile
Gruß Michael
Hallo Michael,
ist mit beiden Varianten das Update sichergestellt und muss man händisch eingreifen?
Zitat von: bert am 22 Januar 2016, 10:24:48
@Rettungstim
Ich nutze WinSCP und Programmer´s Notepad, damit kann ich direkt auf dem Fhem Rechner editieren.
Gruß Bert
Zitat von: kvo1 am 22 Januar 2016, 11:23:54
ich SAMBA und notepad++
Hmmm, ok ich Arbeite mit Notepad++ und dem sftp Plugin.
Aber noch was anderes.
kann mir jemand sagen wie es zu dem Anzeigefehler in der Anruferliste kommt? Siehe Icons FHEM UI und TabletUI.
Ich habe doch da irgendwas übersehen?!
@skuggy
ist mit beiden Varianten das Update sichergestellt und muss man händisch eingreifen?
Soweit ich das gerade gesehen hab nutzt alles was im Ordner mobile liegt die definitionen aus dem Ordner Tablet und dieser wird ja mit Updates versorgt. Also sollte das meiner Meinung nach laufen.
Zitat von: RettungsTim am 22 Januar 2016, 07:01:44
Gibt es daruf eine Antwort? Ich habe Sie in diesem extremen Thema nicht gefunden?!
Beim Ändern von Seiten sollte man immer <meta name="debug" content="1"> setzen.
Das erzwingt auch bei AJAX Anfragen ohne Cache zu arbeiten. Ist Debug aus, wird viel mit Cache gearbeitet, wegen des Geschwindigkeitsgewinns.
Zitat von: RettungsTim am 22 Januar 2016, 12:25:15
Hmmm, ok ich Arbeite mit Notepad++ und dem sftp Plugin.
Aber noch was anderes.
kann mir jemand sagen wie es zu dem Anzeigefehler in der Anruferliste kommt? Siehe Icons FHEM UI und TabletUI.
Ich habe doch da irgendwas übersehen?!
versuche mal
data-icons='["fa-arrow-down","fa-arrow-up","fa-fax","fa-arrow-circle-down","fa-arrow-circle-up","fa-arrow-circle-down","fa-arrow-circle-up"]'
data-get-on='["=> [=]","<= [=]","=> O_O","=>","<=","=> X","<= X"]'da fehlt <= X
Zitat von: setstate am 22 Januar 2016, 12:54:53
Beim Ändern von Seiten sollte man immer <meta name="debug" content="1"> setzen.
Das erzwingt auch bei AJAX Anfragen ohne Cache zu arbeiten. Ist Debug aus, wird viel mit Cache gearbeitet, wegen des Geschwindigkeitsgewinns.
Grad mal im Chrome getestet, scheint wirklich bei mir das Problem hier zu 'fixen'
Zitat von: setstate am 22 Januar 2016, 12:54:53
Beim Ändern von Seiten sollte man immer <meta name="debug" content="1"> setzen.
Das erzwingt auch bei AJAX Anfragen ohne Cache zu arbeiten. Ist Debug aus, wird viel mit Cache gearbeitet, wegen des Geschwindigkeitsgewinns.
Hab ich grad Spaßeshalber Mal probiert. Mit Debug geht bei mir gar nix mehr.
Ich bekomme eigentlich nur das in der index.html definierte "menu.html" angezeigt (ohne Icons) und die beiden Toast-Messages:
"Start Longpoll in 0.1s"
"Longpoll started"
Letztere faden und die Seite steht. Mit debug="0" wird die Seite wenigstens geladen. Jemand eine Idee an was das liegen kann?
Auf die Gefahr hin das sie hier schon wo steht, kannst du bitte mal die komplette Seite hier anhängen?
Ich würde mal gucken ob ich was sehen/erkennen kann..
Zitat von: RettungsTim am 22 Januar 2016, 12:25:15
Hmmm, ok ich Arbeite mit Notepad++ und dem sftp Plugin.
Aber noch was anderes.
kann mir jemand sagen wie es zu dem Anzeigefehler in der Anruferliste kommt? Siehe Icons FHEM UI und TabletUI.
Ich habe doch da irgendwas übersehen?!
Ja das kann ich :)
Da das meine Anruferliste zu sein scheint... es sind nur Icons für eingehende/verpasste/anrufbeantworter definiert! die anderen interessieren mich einfach nicht. :)
Grüße^^
Zitat von: skuggy am 22 Januar 2016, 11:47:45
Hallo Michael,
ist mit beiden Varianten das Update sichergestellt und muss man händisch eingreifen?
Ja ist definitiv gewährleistet. Kein manueller Eingriff nötig :)
Grüße^^
Guten Abend,
ich habe heute mal nach längerer Zeit alles möglich upgedatet, auch TabletUI. Kann es sein, dass speziell Firefox nach wie vor Probleme macht mit Elementen wie z.B. dem Slider?
Ich nutze einen horizontalen Slider zur Anzeige, wieviel einer TV-Sendung schon abgelaufen ist. In Edge, Chrome und Safari (iOS) wird er korrekt angezeigt, in Firefox nicht (mehr).
Definiert ist er so:
<div data-type="slider" data-device='kathi1_prozent' data-min="0" data-max="100" data-width="400" class="horizontal readonly"> </div>
Firefox hat ihn so im Code:
<div style="width: 400px; max-width: 400px; height: 0px;" data-type="slider" data-device="kathi1_prozent" data-min="0" data-max="100" data-width="400" class="horizontal readonly slider_horizontal"> <input style="display: none; visibility: visible;" type="text"><div class="range-container slider_horizontal"><span class="range-bar"><span style="left: 41.25px; visibility: hidden;" class="range-handle"></span><span class="range-min">0</span><span class="range-max">100</span><span style="width: 41.25px;" class="range-quantity"></span></span></div></div>
<input style="display: none; visibility: visible;" type="text">
<div class="range-container slider_horizontal"><span class="range-bar"><span style="left: 45px; visibility: hidden;" class="range-handle"></span><span class="range-min">0</span><span class="range-max">100</span><span style="width: 45px;" class="range-quantity"></span></span></div>
Grüße
Martin
Hallo!
Ich habe aktuell nur ein Problem mit dem Chart-Widget:
Wenn debug=1 gesetzt ist, ist alles prima.
Setze ich debug=0, ist statt dem Plot auf dem iPad nur eine orangene Fläche zu sehen. Zoome ich ein und aus, ist alles wieder da.
Habt ihr das auch?
Gruß
Phil
Hallo,
ist es möglich bei einem push die Farbe des Hintergrundes zu ändern?
Bei dieser config data-icon="fa-heart" data-background-icon="fa-square" data-off-color="rgb(255,0,0)"
ist das Herz rot und das Quadrat grau.
Anstatt grau würde ich gerne blau nehmen.
Gruß
TWART016
passend zum data-off-color
einfach
data-off-background-color
Aber bitte nicht voll aufgedrehte Farben benutzen, z.B. #FF0000 für rot oder #0000FF für blau. Das erscheint meist viel zu grell. So sieht es besser aus
ata-off-color="#aa0000"
data-off-background-color="#4444d3"
Hier gibt es einen Farbpicker: http://www.w3schools.com/TAGS/REF_COLORPICKER.ASP
@setstate: Ich hab grade gesehen das TabletUI nun ein eigenes Subforum hat, das finde ich schonmal super!
Ich haette noch einen Vorschlag zwecks besserer Uebersicht.
1) Diesen Thread hier schliessen mit Verweis auf das Subforum. Dann koennen einzelne Fragen als eigene Threads gestellt werden, das waere fuer die Suche und Lesbarkeit deutlich besser.
2) Einen Sticky der geschlossen ist und dann nur von Dir benutzt wird und nur Aenderungen von neuen Versionen enthaelt, also eine Art changelog. Ansonsten muss man hier immer konstant mitlesen um mitzubekommen das es etwas neues gibt (z.b. spinner).
Hallo setstate,
ist es beim Widget "Switch" auch möglich icon als "warn", also Symbol und Zahl, anzuzeigen?
Beim "Symbol" funktioniert es mit icon="fa-home warn".
Grund:
Ich benutzte Switch als Multistate für Rolläden. Status ist "on", "off" oder die Öffnung in Prozent, z.B. "88.5"
Gruß
Sascha
Zitat von: setstate am 23 Januar 2016, 02:36:12
data-off-color="#aa0000"
data-off-background-color="#4444d3"
Ich hatte nur eines angegeben. Mit beiden funktioniert es, danke.
Ist es möglich eigene Zahlen in dem gleichen Format festzulegen. z.B. 10 in das Icon schreiben, mit einem farbigen Quadrat und weißer Zahl?
meine Config:
data-icon="" data-set-on="timer10_einschlafen" style="color:white;"Mit data-background-icon="fa-square" ist die Zahl nicht sichtbar.
Kurze Frage,
ich habe Tablet Ui vor geraumer Zeit installiert.
Aus dem Forum habe ich mir verschiedene gesamte .html rauskopiert, gespeichert und bearbeitet.
Nun wollte ich bei Tablet UI ein Update machen aber es kommt dieser Fehler:
2016.01.25 19:20:43.482 1 : UPD www/tablet/css/fhem-tablet-ui.css
2016.01.25 19:20:43.707 1 : open ./www/tablet/css/fhem-tablet-ui.css failed: Permission denied, trying to restore the previous version and aborting the update
im Filezilla finde ich bei den Dateien den Besitzer/Gruppe "pi pi"
nun habe ich mal den Ordner umbenannt und ein komplett neues Update gemacht. Dabei erstellt er einen komplett neuen "tablet" Ordner und aktualisiert alles ohne Proobleme. Nur leider kann ich in den Ordner weder eine neuen htlm. kopieren noch kann ich die index-example.html ändern oder kopieren. Der Ordner ist koplett geschützt ich kann ihn nicht mal mehr löschen, nur umbennen. Bei Besitzer/Gruppe steht nun "fhem dialout" drin.
Was ist der Fehler?
MFG Thomas
Hallo zusammen,
ich versuche gerade mit dem spinner widget die die desired Temperatur des TRESHOLD Modules zu ändern, allerding bekomme ich spätestens nach dem 2 mal drücken einen elendslagen Zahl.
Also wenn ich von 21.3° auf 21.5° stellen will bekomme ich z.B. 21.500000000000007° dies ist in der Anzeige nicht wirklich schön.
Hier der Code:
<div data-type="spinner" data-device="TH_Heizung" data-get="desired_value" data-set="desired" data-min="18" data-max="25" data-step="0.1" data-icon-left-color="blue" data-icon-right-color="red" data-unit="°" class="valueonly"></div>
Hat jemand das gleiche Problem?
Gruß,
Stefan
Lösung ist unterwegs. Das ist ein bekanntes JS Problem.
Zitat von: setstate am 25 Januar 2016, 21:25:01
Lösung ist unterwegs. Das ist ein bekanntes JS Problem.
Super. Danke!
Noch eine kurze Frage ist es in Planung für das spinner-widget data-cmd einzuführen?
Dann könnte man nämlich mit ein paar Umwegen mit 2 Spinner und einem dummy Uhrzeiten an FHEM senden...mir gefällt das Handling vom spinner-widget nämlich viel besser als das mit dem settimer.
Zitat von: Haecksler am 25 Januar 2016, 22:42:24
Super. Danke!
Noch eine kurze Frage ist es in Planung für das spinner-widget data-cmd einzuführen?
Dann könnte man nämlich mit ein paar Umwegen mit 2 Spinner und einem dummy Uhrzeiten an FHEM senden...mir gefällt das Handling vom spinner-widget nämlich viel besser als das mit dem settimer.
Die neue Version vom Spinner ist hochgeladen.
data-cmd ist vorhanden (wie bei den meisten Widgets, die an FHEM Senden) und per default auf 'set'
Es gibt jetzt ausserdem noch neu data-longdelay="500" (Zeit in ms die gewartet wird, bis der Wert an FHEM gesendet wird) und data-shortdelay="80" (Zeit in ms die gewartet wird beim Hochzählen)
Hi!
Zitat von: JoJota am 03 Dezember 2015, 12:42:37
<meta name="fhemweb_url" content="https://<benutzername>:<passwort>@<MeineDomain>:8083/fhem/"/>
Die Links sind auch alle über das Internet (mit Authentifizierung) zu erreichen. Es scheint, als ob die Authentifizierungsdaten vor dem HTTP Request rausgefiltert werden. Am HTTPS liegt es nicht, bekomme den gleichen Fehler auch ohne.
Edit: attr WEB CORS 1 hat das 'Access-Control-Allow-Origin' Problem gelöst. "401 (Authorization Required)" bleibt aber weiterhin bestehen. Ist es nicht möglich, eine Verbindung in Kombination mit dem basicAuth von FHEM herzustellen?
Habe leider das gleiche Problem. Gibt's da schon einen Workaround (ausser dem Abschalten von basicAuth und allowfrom natürlich...)?
Gruß
Patrick
Hallo setstate
ich versuche gerade mit dem switch eine multi state notation , möchte mit einen icon bei jedem mal schalten (3 mail) für ein
reading einen anderen Wert senden
<div data-type="switch"
data-device="RolloModTimeAZ"
data-get="Modus"
data-set="Modus"
data-states='["FHEM","ASTRO","HAND"]'
data-icons='["fa-home","fa-home","fa-home"]'
data-colors='["white","white","white"]'
data-background-colors='["green","red","blue"]'
class="bigger top-space"></div>
Leider bekomme ich immer nur on oder off ,
soll wäre ...
set RolloModTimeAZ Modus FHEM
set RolloModTimeAZ Modus ASTRO
set RolloModTimeAZ Modus HAND
was habe ich hier übersehen oder zu viel ?
Hallo!
Ich habe das "data-states" noch nie genutzt/gesehen.
Versuche es mal mit:
data-get-on='["FHEM","ASTRO","HAND"]'
data-set='["A","B","C"]'
Phil
Wenn, dann so
data-get-on='["FHEM","ASTRO","HAND"]'
data-set-on='["FHEM","ASTRO","HAND"]'
data-set-off='["FHEM","ASTRO","HAND"]'
ist aber ein blöde Schreibweise. Ich schaue mal, ob man das auch mit data-state hinbekommt. (ohne Nebenwirkungen)
Zitat von: Depechem am 25 Januar 2016, 19:26:20
2016.01.25 19:20:43.482 1 : UPD www/tablet/css/fhem-tablet-ui.css
2016.01.25 19:20:43.707 1 : open ./www/tablet/css/fhem-tablet-ui.css failed: Permission denied, trying to restore the previous version and aborting the update
im Filezilla finde ich bei den Dateien den Besitzer/Gruppe "pi pi"
nun habe ich mal den Ordner umbenannt und ein komplett neues Update gemacht. Dabei erstellt er einen komplett neuen "tablet" Ordner und aktualisiert alles ohne Proobleme. Nur leider kann ich in den Ordner weder eine neuen htlm. kopieren noch kann ich die index-example.html ändern oder kopieren. Der Ordner ist koplett geschützt ich kann ihn nicht mal mehr löschen, nur umbennen. Bei Besitzer/Gruppe steht nun "fhem dialout" drin.
Dein Problem hat nichts mit Tablet UI zu tun. Du versuchst mit dem Nutzer pi:pi in ein Verzeichnis zu schreiben was fhem:dialout gehört und das Verzeichnis hat dafür (vermutlich) keine Schreibrechte. Mögliche Lösungen gibt es viele, eine könnte sein: steck den pi-Nutzer in die dialout-Gruppe und sorge dafür dass das Verzeichnis für diese Gruppe schreibbar ist.
Zitat von: setstate am 26 Januar 2016, 08:04:46
Wenn, dann so
data-get-on='["FHEM","ASTRO","HAND"]'
data-set-on='["FHEM","ASTRO","HAND"]'
data-set-off='["FHEM","ASTRO","HAND"]'
ist aber ein blöde Schreibweise. Ich schaue mal, ob man das auch mit data-state hinbekommt. (ohne Nebenwirkungen)
habe es jetzt so gelöst
<div data-type="switch"
data-device="RolloModTimeAZ"
data-get="Modus"
data-set="Modus"
data-get-on='["FHEM","ASTRO","HAND"]'
data-set-on='["FHEM","ASTRO","HAND"]'
data-set-off='["FHEM","ASTRO","HAND"]'
data-states='["FHEM","ASTRO","HAND"]'
data-icons='["oa-fts_shutter_automatic","oa-fts_shutter_down","oa-fts_shutter_manual"]'
data-colors='["white","white","white"]'
data-background-colors='["green","cornflowerblue","red"]'
class="bigger top-space"></div>
geht bestimmt schöner / eleganter :D
Hallo,
zuerst muss ich sagen, ich finde das Tablet UI unheimlich gelungen und konnte mit dem Wiki und dem Forum bisher eigentlich alle Probleme lösen, die ich so hatte. Nun hab ich allerdings nichts gefunden was mir weiterhilft.
Es geht um die Kombination von 'swiper' und 'circelmenu'.
Ich hab für meine Rollosteuerung ein circelmenu gebaut, dass soweit einwandfrei funktioniert, sobald ich dies in einem swiper einsetzen will, geht das Menu zwar auf, bleibt aber grau hinterlegt und reagiert auch Eingaben nicht mehr.
<div data-type="circlemenu" class="circlemenu" data-direction="bottom-half" data-circle-radius="60">
<ul class="menu">
<li class="circleborder"><div data-type="progress" data-device="Rollo_Gaestebad" data-get="pct"></div></li>
<li><div data-type="push" data-device="Rollo_Gaestebad" data-set-on="up" data-icon="">auf</div></li>
<li><div data-type="push" data-device="Rollo_Gaestebad" data-set-on="pct 25" data-icon="">25</div></li>
<li><div data-type="push" data-device="Rollo_Gaestebad" data-set-on="pct 50" data-icon="">50</div></li>
<li><div data-type="push" data-device="Rollo_Gaestebad" data-set-on="pct 75" data-icon="">75</div></li>
<li><div data-type="push" data-device="Rollo_Gaestebad" data-set-on="down" data-icon="">zu</div></li>
</ul>
</div>
funktioniert wie gewünscht.
Innerhalb eines swiper's
<div data-type="swiper">
<ul>
<li>
# HIER DER CODE VOM CIRCELMENU
</li>
</ul>
</div>
bleibt das aufgeklappte Menu ausgegraut und reagiert nicht auf Eingaben
Nach ein paar Sekunden Wartezeit geht das Menu wieder zu.
Irgend eine Idee waran das liegen könnte ?
Roman
Zitat von: skuggy am 22 Januar 2016, 07:05:32
Hallo zusammen,
ich benutze eine von @uniqueck angepasste Version des calview Widget. Bei einem Update wird diese Datei immer wieder überschrieben. Wie muss ich vorgehen, damit ich beide Versionen des Widgets parallel verwenden kann? Welche Datei muss ich dafür anpassen? Bin leider nicht so fit in diesen Sachen. Vielen Dank.
Hallo zusammen,
welche Datei muss ich anpassen, damit ich 2 Versionen vom calview Widget parallel betreiben kann?
Danke für eure Hilfe.
Zitat von: setstate am 13 Dezember 2015, 13:04:52
Hintergrund:
data-set - für den Namen des Reading
data-set-on - für den Wert, der bei Press an das Reading geschickt werden soll.
Das funktioniert bei mir nicht mit FS20.
<div data-type="push" data-device="Funktionsgruppe_Rolllaeden_WZ"
data-icon="fa-chevron-down" data-background-icon="fa-square-o"
data-set="STATE" data-set-on="off">Der Button schickt nun ein "set Funktionsgruppe_Rolllaeden_WZ STATE off", damit es funktioniert müsste aber wie früher ""set Funktionsgruppe_Rolllaeden_WZ off" geschickt werden - oder stehe ich auf der Leitung?
List:
Internals:
BTN f3
DEF 1c11 f3
IODev CUL_0
NAME Funktionsgruppe_Rolllaeden_WZ
NR 127
STATE off
TYPE FS20
XMIT 1c11
Code:
1 1c11 f3
Readings:
2016-01-27 14:35:51 state off
Attributes:
IODev CUL_0
alias Alle Rollläden Wohnzimmer
fp_oben 365,717,2,
group Rolllaeden
model fs20ms2
room Wohnzimmer,Favourites Somit ergibt sich
ZitatUnknown argument STATE, choose one of off off-for-timer on on-for-timer reset timer toggle on-till on-till-overnight blink off-till-overnight intervals off-till
Grüße
Martin
Sooooo, nun mache ich den Thread hier mal zu. Über 3800 Antworten lesen ist schon eine Herausforderung.
Seit wir jetzt die eigene Unterkategorie für Fhem Tablet UI haben, ist das Finden von passenden Themen ja etwas einfacher geworden.
Bitte also neue Fragen/Themen als eigenes Thema direkt in FHEM Forum » FHEM » Frontends » TabletUI » * posten
Update: neues Widget Departure siehe Thema hier: http://forum.fhem.de/index.php/topic,48255.0.html