New FHEM Tablet UI

[bjoernbo]

  verstehe ich nicht !

<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>

[nesges]

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:

Code Auswählen Erweitern

<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.

[bjoernbo]

 

haha jetzt verstehe ich deinen vorherigen Post 
tendency ist dann direkt im Device ...Wandthermostat

Danke für die Unterstützung !!!

<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>

[nesges]

Das Verschieben der Widgets wird in der aktuellsten Version übrigens per

Code Auswählen Erweitern

<meta name='gridster_disable' content='1'>

abgeschaltet.

[bjoernbo]

Ok Danke. Dann werde ich die Tage mal versuchen eine Smartphone freundliche UI zu erstellen.

[chris1284]

eine frage zur fhem-tablet-ui.js

was bedeutet in zeile 350 (getDeviceValue function) der doppelpunkt?

var 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.

[nesges]

was bedeutet in zeile 350 (getDeviceValue function) der doppelpunkt?

Das ist die Kurzform von:

Code Auswählen Erweitern

var paraname;
if(src && src != '') {
    paraname = device.data(src);
} else {
    paraname = Object.keys(readings)[0];
}

ich 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:

Code Auswählen Erweitern

$(this).data('xbeliebigesreading', 'xbeliebigesreading');
readings['xbeliebigesreading'] = true;

Dann wird das Reading automatisch geholt und kann in der update-Function mit

Code Auswählen Erweitern

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

[setstate]

wollte ich auch gerade schreiben

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:

Code Auswählen Erweitern

readings['myReadingName'] = true;

im init Teil des Widgets. Oder, wenn du den Reading Namen konfigurierbar als HTML Attribute machen willst, dann so

Code Auswählen Erweitern

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.

[bjoernbo]

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 :-/

<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

[nesges]

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.

[chris1284]

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)

Code Auswählen Erweitern


  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;
}
}
});
  },

[nesges]

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).

[bjoernbo]

Danke nesges! "float" hatte ich nicht auf'm Plan, aber der Name sagt es ja eigentlich schon. 
Dank

[bjoernbo]

Ä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.

[setstate]

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.