FHEM Forum

FHEM => Frontends => FHEMWEB => Thema gestartet von: Bootscreen am 30 November 2016, 14:53:28

Titel: Reading mit Javascript anstelle des Logos?
Beitrag von: Bootscreen am 30 November 2016, 14:53:28
Moin moin,

ist es möglich Readings über Javascript auszulesen und z.B. anstelle des Logos anzuzeigen?

Derzeit lass ich mir anstelle des Logos eine Uhr anzeigen:
function GetClock() {
    d = new Date();
    nhour = d.getHours();
    nmin = d.getMinutes();
    if (nmin <= 9) {nmin="0"+nmin}
    document.getElementById('logo').innerHTML = nhour + ":" + nmin;
    setTimeout("GetClock()", 1000);
}
window.addEventListener("load",GetClock,false);


Nun würde ich mir gerne noch aktuelle Außentemperatur und den Spritpreis der nächsten Tanke (Beides sind bereits Devices in FHEM) anzeigen lassen. Ist das irgendwie machbar?
Titel: Antw:Reading mit Javascript anstelle des Logos?
Beitrag von: DeeSPe am 30 November 2016, 17:05:08
Klar ist das machbar, aber mehr Aufwand denke ich.

Mit:
http://<IP>:8083/fhem?cmd=jsonlist2&XHR=1
bekommst Du ein JSON aller Devices.
Damit solltest Du in JS arbeiten können.

Gruß
Dan
Titel: Antw:Reading mit Javascript anstelle des Logos?
Beitrag von: Bootscreen am 01 Dezember 2016, 12:44:44
Dank dir. Mit dem Ansatz hab ichs hin bekommen. Man can jsonlist2 mit devspec auch reduzieren.

Falls es wen intressieren sollte:
function GetReading(device, reading) {
   url="fhem?cmd=jsonlist2 NAME=" + device + "&XHR=1";
   
   
   $.getJSON( url, function( ret ) {
         readingsVal = getValues(ret,reading)[0];
         aliasVal = getValues(ret,"alias_overview")[0];

         //Neues Element in dem die Readings angezeigt werden sollen:
         var newChild = document.createElement('td');
         newChild.innerHTML = aliasVal + ": " + readingsVal;
         newChild.style.cssText = "padding-left:20px;color:#000 !important; font-size:26px; font-weight:bold; height:20px;";

         //Element an dem das neue Element angehängt wird
         document.getElementById('hdr').getElementsByTagName("tr")[0].appendChild(newChild);
   });
   
}
function getValues(obj, key) {
    var objects = [];
    for (var i in obj) {
        if (!obj.hasOwnProperty(i)) continue;
        if (typeof obj[i] == 'object') {
            objects = objects.concat(getValues(obj[i], key));
        } else if (i == key) {
            objects.push(obj[i]);
        }
    }
    return objects;
}

GetReading("tanke1","STATE");
GetReading("tanke2","STATE");
GetReading("temperature","STATE");


Mit dem Code werden mir Spritpreise von 2 Tankstellen und die Außentemparatur oben neben der Eingabezeile in FHEMWEB angezeigt. ANbei noch ein Bild damit ihr euch das vorstellen könnt. Zur besseren Lesbarkeit hab ich noch ein userAttr "alias_overview" eingebaut.
Titel: Antw:Reading mit Javascript anstelle des Logos?
Beitrag von: DeeSPe am 01 Dezember 2016, 14:54:17
Zitat von: Bootscreen am 01 Dezember 2016, 12:44:44
Dank dir. Mit dem Ansatz hab ichs hin bekommen. Man can jsonlist2 mit devspec auch reduzieren.

Klar, Du kannst in der URL alles angeben/filtern was auch sonst in FHEM geht.

Schön dass Du es mit der Information umsetzen konntest!
Was Ähnliches ist mir auch schon mal im Kopf rumgeschwirrt zu machen, allerdings habe ich dann angefangen Perl Module zu schreiben und die rauben mir gerade die Zeit für das JS Projekt... :-\

Gruß
Dan