Tablet AJAX/JavaScript/HTML GUI

Begonnen von fhem86, 30 Mai 2013, 14:57:15

Vorheriges Thema - Nächstes Thema

fhem86

Darstellung wurde nochmal verbessert

Das room Attribut wird ignoriert :)

Bitte testen!

@Carsten Wie soll das Statusfeld den aussehen, damit das ganze Wort 'Anwesend' reinpasst?

Als Beschreiben: Carsten Anwesend als status on/off, würde passen.

Wenn du eine Idee für eine passende Optik/Darstellung hast, kann ich diese gerne als Modul einbauen.

fhem86

Neu:
  • Neues Attribut name um den angezeigten Status zu ändern
[on:state>name:JA][off:state>name:NEIN][/list]

@Carsten so z.B.

(siehe Anhang / see attachement)


attr viewFHEM_status item7 Carsten|state[on:left>backcolor:00FF00][off:left>backcolor:FF0000][on:state>name:JA>size:1.2em][off:state>name:NEIN>size:1.2em]|Carsten Anwesend|1

fhem86


(siehe Anhang / see attachement)


Ein aktuelles Feedback wäre gut :)

Carsten

Hallo,

gerade nochmal mit der aktuellen Version getestet. Funktioniert und gefällt mir gut.

Das undefined ist jetzt weg. Kam das vom Room?

Die on/off-Attribute funktionieren auch nur bei on/off-states, oder? Im Moment steht halt direkt in meinem Anwesenheits-Dummy "Anwesend"/"Abwesend".

Dass man aufgrund des nicht unendlichen Platzes pro Spalte irgendwo eine Grenze für die Textbreite ziehen muss ist mir klar. 3-4 Zeichen finde ich aber auch etwas knapp. Für Temperaturen, Luftfeuchtigkeit usw., wo der Wert vor dem Komma 3 Stellen nie überschreitet, reichts ja auch und den Text in meinem Anwesenheits-Dummy könnte ich problemlos in ON/OFF ändern, aber z.B. beim Wetter ("bewölkt", "sonnig" etc ) oder z.B. Stromzählern könnte es schnell eng werden. Aber eine konkrete Idee habe ich auch nicht.

Schön wäre die Möglichkeit, zusätzliche Readings in die Caption zu integrieren und das eigentliche Valuefeld optional ausblendbar zu machen.

So, dass man sowas definieren könnte wie
attr viewFHEM_status item7 Wetter|temp_c|Wetter: <Wetter.condition>|1
und in der View stünde dann in der Caption "Wetter: sonnig" und im Value die Temperatur oder der Value wird eben komplett ausgeblendet, falls er für das jeweilige Element keinen Sinn macht.

Ob das mit vertretbarem Aufwand umsetzbar ist, kann ich allerdings nicht abschätzen.

fhem86

Zitat von: Carsten schrieb am Sa, 08 Juni 2013 22:27Hallo,

gerade nochmal mit der aktuellen Version getestet. Funktioniert und gefällt mir gut.

Das undefined ist jetzt weg. Kam das vom Room?

Die on/off-Attribute funktionieren auch nur bei on/off-states, oder? Im Moment steht halt direkt in meinem Anwesenheits-Dummy "Anwesend"/"Abwesend".

Dass man aufgrund des nicht unendlichen Platzes pro Spalte irgendwo eine Grenze für die Textbreite ziehen muss ist mir klar. 3-4 Zeichen finde ich aber auch etwas knapp. Für Temperaturen, Luftfeuchtigkeit usw., wo der Wert vor dem Komma 3 Stellen nie überschreitet, reichts ja auch und den Text in meinem Anwesenheits-Dummy könnte ich problemlos in ON/OFF ändern, aber z.B. beim Wetter ("bewölkt", "sonnig" etc ) oder z.B. Stromzählern könnte es schnell eng werden. Aber eine konkrete Idee habe ich auch nicht.

Schön wäre die Möglichkeit, zusätzliche Readings in die Caption zu integrieren und das eigentliche Valuefeld optional ausblendbar zu machen.

So, dass man sowas definieren könnte wie
attr viewFHEM_status item7 Wetter|temp_c|Wetter: <Wetter.condition>|1
und in der View stünde dann in der Caption "Wetter: sonnig" und im Value die Temperatur oder der Value wird eben komplett ausgeblendet, falls er für das jeweilige Element keinen Sinn macht.

Ob das mit vertretbarem Aufwand umsetzbar ist, kann ich allerdings nicht abschätzen.

Sollte kein Problem sein, baue ich ein.
Man kann die Schriftgröße im Status Feld aber auch ändern. Dann passt mehr Text rein.

Ist beides auf der Todo Liste :)

Todo:
  • Statusfeld ausblendbar machen
  • state in Caption/Beschreibung integrieren
  • Slider Modul
  • Optionen auch für reine Statusfelder



fhem86


(siehe Anhang / see attachement)


Code Zeile 1 (Das State Feld, wird mit dem width Attribut vergrößert/Die states Anwesend/Abwesend werden wie on/off definiert):
attr viewFHEM_status item7 Carsten|state[state>width:90>size:1.1em][label>size:1.1em][Anwesend:left>backcolor:00FF00][Abwesend:left>backcolor:FF0000}|Carsten|3
Code Zeile 2 (Das State Feld wird entfernt/Der Platzhalter state im Label wird durch den state ersetzt/Die states Anwesend/Abwesend werden wie on/off definiert):
attr viewFHEM_status item8 Carsten|state[state>hide][label>size:1.1em][Anwesend:left>backcolor:00FF00][Abwesend:left>backcolor:FF0000}|Carsten: state|3

Carsten

Gute Arbeit!

Gefällt mir echt gut.

Die bessere Hälfte darf nur nie erfahren, dass das Layout ursprünglich durch Star Trek inspiriert ist ;)

fhem86

Neu:
  • Default Farben können definiert werden

Anleitung:

#Anpassen -> zu wenig Attribute :)
attr global userattr ... item1 item2 item3 item4 item5 item6 item7 item8 item9 item10 item11 item12 item13 item14 item15 item16 item17 item18 item19 item20 item21 item22 item23 item24 item25 item26 item27 item28 item29 item30

#Default Config kann genutzt werden, muss aber nicht!
define viewFHEM_config dummy
attr viewFHEM_config room viewFHEM
attr viewFHEM_config item1 background|color|0000FF
attr viewFHEM_config item2 topleft|color|111111
attr viewFHEM_config item3 topright|color|004444
attr viewFHEM_config item4 bottomleft|color|008888
attr viewFHEM_config item5 bottomright|color|005544
attr viewFHEM_config item6 menuspace|color|00F800
attr viewFHEM_config item7 menubutton|color|770088
attr viewFHEM_config item8 menubuttonselect|color|005500
attr viewFHEM_config item9 menubutton|textcolor|00FF00
attr viewFHEM_config item10 menubuttonselect|textcolor|000000

attr viewFHEM_config item11 statusviewleft|color|005500
attr viewFHEM_config item12 statusviewlabel|color|00FF00
attr viewFHEM_config item13 statusviewstate|color|FFFFFF
attr viewFHEM_config item14 statusviewlabel|textcolor|000000
attr viewFHEM_config item15 statusviewstate|textcolor|FF0000

attr viewFHEM_config item16 onoffviewleft|color_on|00FF00
attr viewFHEM_config item17 onoffviewleft|color_off|FF0000

attr viewFHEM_config item18 onoffviewlabel|color_on|0000FF
attr viewFHEM_config item19 onoffviewlabel|color_off|001100

attr viewFHEM_config item20 onoffviewstate|color_on|FFFFFF
attr viewFHEM_config item21 onoffviewstate|color_off|000000

attr viewFHEM_config item22 onoffviewlabel|textcolor_on|000000
attr viewFHEM_config item23 onoffviewlabel|textcolor_off|FF0000

attr viewFHEM_config item24 onoffviewstate|textcolor_on|000000
attr viewFHEM_config item25 onoffviewstate|textcolor_off|00FF00


Ergebnis :)

(siehe Anhang / see attachement)


rudolfkoenig

> attr global userattr ... item1 item2 item3...

Man koennte auch item.* spezifizieren, es sei denn man will diese Attribute per FHEMWEB dropdown pflegen.
Oder man kopiert dummy.pm, um diese Attribute nicht allen anderen Geraeten anzuhaengen.

>  Ergebnis :)

Mit diesen Farben kommen wir nicht ins Geschaeft...
Will sagen, ich weigere mich das hier auf fhem.de zu verlinken :)


Steffen

Hallo!

Erstmal finde ich es super was du hier geschaffen hast, bin schon die ganze Zeit am Basteln:-)

Nun habe ich eine kurze frage und das mal kurz zu was anderem wenn es ok ist?

Denn ich bekomme das Anwesend oder Abwesend nicht angezeigt in der Ansicht(viewFhem) nur present und absent,
habe auch Eventmap und Webcmd versucht aber das klappt auch nicht.
Obwohl er bei STATE:Anwesend anzeigt, nur bei Readings state:present an?!

Vielleicht eine kleine Tip am Rande von euch;-)

Mfg Steffen

Carsten

Hallo,

ich benutze nicht das Presence-Modul. Das gab es noch nicht, als ich es eingebaut habe.

Den Status, der in der FHEMWeb-Ansicht angezeigt wird, kannst du mittels Eventmap umrouten, also z.B. absent -> Abwesend. Das ist das großgeschriebene "STATE". Das ändert aber nichts am eigentlichen Wert des Readings (kleingeschriebenes "state"). Die View benutzt die Readings. Da musst du das mapping nochmal einbauen.

z.B. so:
attr DeinDummy item1 DeinPresence|state[present:state>name:Anwesend][absent:state>name:Abwesend]Caption|1

fhem86

Neu:
  • Ticker

Anleitung:

attr DummyDeviceFuerDiesenButton itemNummer meinTickerDevice|ticker|länge des Tickers 1-4|Position 1-4

#Wie im Screenshot z.B.:
attr viewFHEM_status item0 meinTicker|ticker|3|1


(siehe Anhang / see attachement)


Steffen

Zitat von: Carsten schrieb am So, 09 Juni 2013 19:21Hallo,

ich benutze nicht das Presence-Modul. Das gab es noch nicht, als ich es eingebaut habe.

Den Status, der in der FHEMWeb-Ansicht angezeigt wird, kannst du mittels Eventmap umrouten, also z.B. absent -> Abwesend. Das ist das großgeschriebene "STATE". Das ändert aber nichts am eigentlichen Wert des Readings (kleingeschriebenes "state"). Die View benutzt die Readings. Da musst du das mapping nochmal einbauen.

z.B. so:
attr DeinDummy item1 DeinPresence|state[present:state>name:Anwesend][absent:state>name:Abwesend]Caption|1

danke aber klappt leider auch nicht, zeigt immer noch present an. Hier mal meine Config:
attr viewFHEM_status item2 Steffen|state[present:state>name:Anwesend][absent:state>name:Abwesend]|Steffen|2

define Steffen PRESENCE lan-bluetooth xxxxxxx xxxxxxx
attr Steffen PRESENCE AlleHandy
attr Steffen Presence AlleHandy
attr Steffen devStateIcon Anwesend:HOME_Status.1 Abwesend:HOME_Status.3
attr Steffen event-on-change-reading state
attr Steffen eventMap /present:Anwesend/absent:Abwesend/
attr Steffen icon icoHandy


Vielleicht noch ne andere Idee???

fhem86

Zitat von: Steffen schrieb am So, 09 Juni 2013 19:44
Zitat von: Carsten schrieb am So, 09 Juni 2013 19:21Hallo,

ich benutze nicht das Presence-Modul. Das gab es noch nicht, als ich es eingebaut habe.

Den Status, der in der FHEMWeb-Ansicht angezeigt wird, kannst du mittels Eventmap umrouten, also z.B. absent -> Abwesend. Das ist das großgeschriebene "STATE". Das ändert aber nichts am eigentlichen Wert des Readings (kleingeschriebenes "state"). Die View benutzt die Readings. Da musst du das mapping nochmal einbauen.

z.B. so:
attr DeinDummy item1 DeinPresence|state[present:state>name:Anwesend][absent:state>name:Abwesend]Caption|1

danke aber klappt leider auch nicht, zeigt immer noch present an. Hier mal meine Config:
attr viewFHEM_status item2 Steffen|state[present:state>name:Anwesend][absent:state>name:Abwesend]|Steffen|2

define Steffen PRESENCE lan-bluetooth xxxxxxx xxxxxxx
attr Steffen PRESENCE AlleHandy
attr Steffen Presence AlleHandy
attr Steffen devStateIcon Anwesend:HOME_Status.1 Abwesend:HOME_Status.3
attr Steffen event-on-change-reading state
attr Steffen eventMap /present:Anwesend/absent:Abwesend/
attr Steffen icon icoHandy


Vielleicht noch ne andere Idee???

Ich habe:
attr viewFHEM_status item2 Steffen|state[present:state>name:Anwesend][absent:state>name:Abwesend]|Steffen|2
mal mit einem dummy getestet. Es funktioniert.

Poste hier mal bitte den Text von:

http://fhemip:8083/fhem?cmd=jsonlist Steffen&XHR=1


Steffen

Zitat von: fhem86 schrieb am So, 09 Juni 2013 19:54
Zitat von: Steffen schrieb am So, 09 Juni 2013 19:44
Zitat von: Carsten schrieb am So, 09 Juni 2013 19:21Hallo,

ich benutze nicht das Presence-Modul. Das gab es noch nicht, als ich es eingebaut habe.

Den Status, der in der FHEMWeb-Ansicht angezeigt wird, kannst du mittels Eventmap umrouten, also z.B. absent -> Abwesend. Das ist das großgeschriebene "STATE". Das ändert aber nichts am eigentlichen Wert des Readings (kleingeschriebenes "state"). Die View benutzt die Readings. Da musst du das mapping nochmal einbauen.

z.B. so:
attr DeinDummy item1 DeinPresence|state[present:state>name:Anwesend][absent:state>name:Abwesend]Caption|1

danke aber klappt leider auch nicht, zeigt immer noch present an. Hier mal meine Config:
attr viewFHEM_status item2 Steffen|state[present:state>name:Anwesend][absent:state>name:Abwesend]|Steffen|2

define Steffen PRESENCE lan-bluetooth xxxxxxx xxxxxxx
attr Steffen PRESENCE AlleHandy
attr Steffen Presence AlleHandy
attr Steffen devStateIcon Anwesend:HOME_Status.1 Abwesend:HOME_Status.3
attr Steffen event-on-change-reading state
attr Steffen eventMap /present:Anwesend/absent:Abwesend/
attr Steffen icon icoHandy


Vielleicht noch ne andere Idee???

Ich habe:
attr viewFHEM_status item2 Steffen|state[present:state>name:Anwesend][absent:state>name:Abwesend]|Steffen|2
mal mit einem dummy getestet. Es funktioniert.

Poste hier mal bitte den Text von:

http://fhemip:8083/fhem?cmd=jsonlist Steffen&XHR=1


ok danke schon mal für deine Hilfe, hier der Code:
{
  "ResultSet": {
    "Results": {
      "ADDRESS": "18:E2:C2:4A:2F:19",
      "ATTRIBUTES": {
        "PRESENCE": "AlleHandy",
        "Presence": "AlleHandy",
        "devStateIcon": "Anwesend:HOME_Status.1 Abwesend:HOME_Status.3",
        "event-on-change-reading": "state",
        "eventMap": "/present:Anwesend/absent:Abwesend/",
        "icon": "icoHandy"
      },
      "CHANGED": "null",
      "DEF": "lan-bluetooth 18:E2:C2:4A:2F:19 192.168.178.42:5222",
      "DeviceName": "192.168.178.42:5222",
      "FD": "27",
      "MODE": "lan-bluetooth",
      "NAME": "Steffen",
      "NR": "173",
      "PARTIAL": "null",
      "READINGS": {
        "command_accepted": {
          "TIME": "2013-06-09 20:00:35",
          "VAL": "yes"
        },
        "device_name": {
          "TIME": "2013-06-09 20:01:11",
          "VAL": "Ewi"
        },
        "room": {
          "TIME": "2013-06-09 20:01:11",
          "VAL": "Arbeitszimmer,Wohnzimmer"
        },
        "state": {
          "TIME": "2013-06-09 20:01:11",
          "VAL": "present"
        }
      },
      "STATE": "Anwesend",
      "TIMEOUT_NORMAL": "30",
      "TIMEOUT_PRESENT": "30",
      "TYPE": "PRESENCE",
      "helper": {
          "null": "null"
      }
    }
  }
}