#erledigt#Wettericons von weather (darkSky) in FTUI darstellen

[Helmi55]

Mahlzeit aus Niederösterreich,
ich bin ratlos. Habe schon alle möglichen Kombination durch.
Ich hätte gerne die bunten Kleinklima Icons verwendet. Aber die sehen anders aus als im htmlWetter?
Als readings habe ich schon icon, iconAPI versucht.
Zusätzlich werden sie auch noch in verschiedenen Größen dargestellt....

Mein wetter sheet schaut so aus

Code Auswählen Erweitern

<li data-row="1" data-col="1" data-sizex="18" data-sizey="6">
                <header>Wetter</header>
               <div class="sheet">
                    <div class="row">
                        <div class="cell">
                  <div data-type="label" data-device="Wetter" data-get="fc1_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc1_precipType" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_low_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc1_high_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc1_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc2_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc2_precipType" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_low_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc2_high_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc2_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc3_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc3_precipType" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_low_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_high_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc4_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc4_precipType" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_low_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_high_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc5_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc5_precipType" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_low_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_high_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_wind_condition" class="cell small"></div>
                        </div>
                       
                    </div>
                </div>
            </li>

Kann mir das bitte jemand erklären.
Oder funktionieren nur die B/W Icons von Meteocon?

Danke
Helmut

[Guenni1404]

Hallo,

ich habe das Problem auch. Wie hast du es gelöst?

[GeZi3560]

Ich häng mich auch mal dran ... 

[Mitch]

Da steht zwar im Titel erledigt, aber hier keine Lösung?

Welches Reading wird denn nun benutzt?

[schka17]

bin auch gerade dabei die Änderungen nachzuziehen und habe gesucht ob das Problem schon gelöst wurde.

Ich nehme das reading "code" also z.b.

Code Auswählen Erweitern

<div data-type="weather"
data-device="WetterOW"
data-get="hfc1_code"
data-imageset="kleinklima" style="width:100px">

[Helmi55]

Sorry dass ich euch die Antwort schuldig geblieben bin.
Ist sicher keine saubere Lösung, Aber besser als nix.
Habe den Hinweis auf die Datei /opt/fhem/www/tablet/js/widget_weather.js hier im Forum bekommen (Hier nach Kleinklima suchen)
Im Moment habe ich die 2 Zeilen angefügt

'partly_cloudy': 'partly_cloudy.png',
        'partly_cloudy_night': 'partly_cloudy.png',

Den Rest sehe ich erst bei einer Wetteränderung

Habe jetzt im Wettermodul DarkSky und somit diesen Code im FTUI

Code Auswählen Erweitern

<header>Wetter</header>
               <div class="sheet">
                    <div class="row">
                        <div class="cell">
                  <div data-type="label" data-device="Wetter" data-get="fc1_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc1_icon" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_low_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc1_high_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc1_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc1_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc2_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc2_icon" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_low_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc2_high_c" data-unit="%B0C%0A"  class="cell inline big" ></div>
<div data-type="label" data-device="Wetter" data-get="fc2_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc2_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc3_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc3_icon" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_low_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_high_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc3_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc4_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc4_icon" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_low_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_high_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc4_wind_condition" class="cell small"></div>
                        </div>
                        <div class="cell">
                        <div data-type="label" data-device="Wetter" data-get="fc5_day_of_week" class="small"></div>
            <div data-type="weather" data-device="Wetter" data-get="fc5_icon" data-imageset="kleinklima" class="mini"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_condition" class="cell"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_low_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_high_c" data-unit="%B0C%0A" class="cell inline big"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_uvIndex" data-unit= "UV - Index" class="cell big"></div>
<div data-type="label" data-device="Wetter" data-get="fc5_wind_condition" class="cell small"></div>
                        </div>
                       
                    </div>
                </div>

und das sieht dann so aus:

Leider liefert das Modul für Mittwoch bei Icon
   
fc3_icon partly_cloudy_night   -   was hat ein night Icon am Tage zu suchen. Darum hab ich es mit dem partly_cloudy verknüpft

Gruß
Helmut

[GeZi3560]

Darf ich fragen ...  Wie ist die obere Anzeiger erstellt? In FHEMWEB mit Weblink ?

[Helmi55]

Die gelbe Anzeige?
das ist ein weblink auf das Wettermodul.

htmlCode {WeatherAsHtmlH("Wetter",7)}

Wetter heißt bei mir das Wettermodul. 7 gibt die Tage für die Vorschau an

Gruß
helmut

[GeZi3560]

Danke, kannte ich noch nicht 

[moonsorrox]

also bei mir zeigt er auch jetzt da es eine Änderung in der "condition" gab auch kein Icon mehr
Aktuell: condition
Leichter Schneefall

Icon: keins

Heute vormittag: condition
Überwiegend bewölkt

Icon: keins

Tja das ist etwas wenig, wenn gar nichts angezeigt wird. Werde wohl erst einmal die Anzeige von Proplanta nutzen bis das richtig läuft

[Helmi55]

condition schreibt ja nur den aktuellen Wetterzustand
das ICON kommt jaüber

Code Auswählen Erweitern

<div data-type="weather" data-device="Wetter" data-get="fc1_icon" data-imageset="kleinklima" class="mini"></div>

Oder hab ich dich da falsch verstanden

[moonsorrox]

Das ist schon richtig über condition kommt der deutsche Text und fc_Icon ist auch richtig, da ich aber keine Modifikation an der wetter.js gemacht habe wie du es getan hast funktioniert bei mir das mit dem Icon nicht, der passende Text ist schon richtig.

[Helmi55]

Ja dann hänge die zwei Zeilen an und es passt

[Tommy82]

Hi, ich hänge hier mal meine widget_weather.js ran, ich hab mal einige Wetter daten die aus darkSky kommen eingepflegt, sollte es weitere geben die mir jetzt noch nicht aufgefallen sind werd ich die auch einpflegen.
Als reading benutze ich aber in der FTUI und damit auch in der widget_weather.js die fcx_icon.

Wenn einer schöne "Nacht" Bilder hätte könnte man die natürlich auch einbauen.

[Helmi55]

Servus
wie meinst du das mit den fcx_icon.
DarkSky stellt doch nur fc und hfc zur Verfügung?

[moonsorrox]

er meint sicherlich das "x" stellvertretend für die Zahlen

[Helmi55]

auweia guten morgen - ich hätte doch vorher einen Kaffee trinken sollen.....

[Helmi55]

Na dann hänge ich meine auch noch dazu. Vielleicht brauchst jemand
Gruß
Helmut

[GeZi3560]

Danke !

[RZNYKJ]

Hi, habe auch aufgrund der Yahoo-Probleme nun auf Darksky für die Wetterdaten gewechselt und kämpfe nun ebenfalls mit den Icons. Dank eurer Tipps oben habe ich das JS File angepasst aber darf es über Filezilla (sorry, bin auf der Linux-Seite nicht fit) nicht übertragen.

Meldung: /opt/fhem/www/tablet/js/widget_weather.js: open for write: permission denied

Ok, habe wohl mit dem "pi" User, mit dem ich verbunden bin, nicht die entsprechenden Rechte auf das Verzeichnis, oder? Was muss ich tun??

Vielen Dank
Achim

[Helmi55]

Bin nicht der Berechtigungsspezialist - kann sein dass ich für diese Aussage gesteinigt were
aber sudo chmod 777 /opt/fhem/www/tablet
sollte helfen
Gruß
Helmut

[schka17]

Bin nicht der Berechtigungsspezialist - kann sein dass ich für diese Aussage gesteinigt were
aber sudo chmod 777 /opt/fhem/www/tablet
sollte helfen
Gruß
Helmut

Da kannst du jetzt recht haben, das kommt gleich nach passwort 123456.

Im Ernst, das ganze ist nicht so schwierig,aber 777 ist ein nogo wenn es nicht wirklich so geplant ist.

Die Berechtigungen sind in drei Gruppen aufgeteilt, und zwar die erste Zahl für den Besitzer, die zweite für die gruppe und die dritte für alle Benutzer. Dir Rechte sind binär, excecute ist 1(001), write 2(010) und read ist 4(100). 7 bedeutet also ausführen, schreiben und lesen. Eine nicht ausführbare Datei sollte also 0, 4 oder 6 haben, also lesen schreiben für alle wäre 666. lesen schreiben nur für Besitzer wäre 600 usw.



Es gibt dann noch ein paar spezielle Bits aber das ist mal das wichtigste.


Sent from my iPad using Tapatalk

[Tommy82]

Servus
wie meinst du das mit den fcx_icon.
DarkSky stellt doch nur fc und hfc zur Verfügung?

fc1_icon das x stand nur für einen Platzhalter für die Nummern

[Tommy82]

Hi, habe auch aufgrund der Yahoo-Probleme nun auf Darksky für die Wetterdaten gewechselt und kämpfe nun ebenfalls mit den Icons. Dank eurer Tipps oben habe ich das JS File angepasst aber darf es über Filezilla (sorry, bin auf der Linux-Seite nicht fit) nicht übertragen.

Meldung: /opt/fhem/www/tablet/js/widget_weather.js: open for write: permission denied

Ok, habe wohl mit dem "pi" User, mit dem ich verbunden bin, nicht die entsprechenden Rechte auf das Verzeichnis, oder? Was muss ich tun??

Vielen Dank
Achim

Würde mich per ftp mit dem root user verbinden, dann kannste das auch überschreiben ohne alle Türen per 777 zu öffnen (wobei mal realisitisch betrachtet 777 auf einer einzelnen Datei , wo der Rechner vieleicht nicht von außen erreichbar ist, im normalfall auch kein Problem ergeben dürfte! auch wenn es natürlich nicht optimal ist)

Mal zurück zu den Icons, kleinwetter hat ja wenn ich das richtig sehe keine "night" Icons oder? Die Fehlen irgendwie find ich

Hab auch noch ein anderes Problem, wo vieleicht einer eine idee zu hat,
die Texte sind bei darkSky deutlich länger wie bei yahoo früher, jetzt hab ich immer so unschöne versprünge an den einzelnen Tagen wie auf dem Bild im Anhang zu sehen. Hat einer eine idee wie ich das gleich bekomme?

[Paul]

Mal zurück zu den Icons, kleinwetter hat ja wenn ich das richtig sehe keine "night" Icons oder?

Wenn du Kleinklima meinst, die haben Night-icons.

[Tommy82]

Wo?

[Paul]

Habe sie so eingebunden:

Code Auswählen Erweitern

<div class="mini" data-type="weather" data-device="WetterPro" data-get="fc0_weather21Icon" data-imageset="kleinklima"></div>

benutze aber Proplanta

[TWART016]

Wird die js noch eingecheckt? Ich würde ungern, dass die Datei beim Update überschrieben wird.

[Tommy82]

Wird die js noch eingecheckt? Ich würde ungern, dass die Datei beim Update überschrieben wird.

Im moment werden diese beim update überschrieben. Würde sie auch gerne einchecken, weiss aber ehrlich gesagt nicht wie, hatte gehofft @setstate liest mit

[moonsorrox]

das mit den Icons wird wohl auch noch eine Weile Probleme machen... Ich hatte vorhin wieder auf OpenWeatherMap gewechselt weil es kein Icon bei "partly_cloudy" gab und nun hat OpenWeatherMap gewchselt und es gibt "chance_of _snow" und wieder kein Icon...

Da weiß man im Moment nicht was man nehmen soll.

[hermi]

Ich habe heute in https://darksky.net/dev/docs#data-point-object nachgeschaut. Dort finden sich unter dem icon-property aktuell folgende möglichen Werte:

• clear-day
• clear-night
• rain
• snow
• sleet
• wind
• fog
• cloudy
• partly-cloudy-day
• partly-cloudy-night

Wenn ich das richtig sehe, werden diese im Reading "iconAPI" übertragen.

In widget_weather.js müsste man deshalb ab Zeile 272 folgenden Block einfügen, um die nicht definierten Icon-Definitionen zu ergänzen.:

Code Auswählen Erweitern


        // Dark Sky (IconAPI, see https://darksky.net/dev/docs#data-point-object)
        'clear-day': 'clear.png',
        'clear-night': 'mostly_clear_night.png',
        // 'rain': 'rain.png',      // already defined
        // 'snow': 'snow.png',      // already defined
        // 'sleet': 'sleet.png',    // already defined
        'wind': 'windy.png',
        // 'fog': 'fog.png',        // already defined
        // 'cloudy': 'cloudy.png',  // already defined
        'partly-cloudy-day': 'partly_cloudy.png',
        'partly-cloudy-night': 'partly_cloudy_night.png',


Ich kann einen Pull-Request für https://github.com/knowthelist/fhem-tablet-ui erzeugen. Damit sollte dann der Code offiziell eingepflegt werden können.

[remo]

Hallo ihr Lieben,

wie ist der Stand der Dinge was die Icons betrifft?
Geht es voran?

Der Request scheint noch nicht durch zu sein...

Ich komme auch einfach nicht weiter!
Ich benutze die Icons von Meteocons und das einzige Icon was ich angezeigt bekomme ist "partly_cloudy" ...
Ich habe die "widget_weather.js" hoch- und runter-editiert - kein zufriedenstellendes Ergebnis.
Hat vielleicht noch jemand einen Tipp für mich?


-remo

[hermi]

Hallo remo,

ich wollte zuerst noch auf Feedback von Helmi55 und Tommy82 warten, ob meine Änderungen mit ihren übereinstimmen.

Und dass eventuell setstate diese Änderung hier mitbekommt und sie auf dem kleinen Dienstweg einpflegt (liest er alle Nachrichten in diesem Board mit?).

Die Änderung ansich ist nicht kompliziert:
Im aktuellen widget_weather.js ist der o.g. Code im Bereich

Code Auswählen Erweitern

var kleinklimamap = { zwischen den Blöcken "Weather (YAHOO) en" und "PROPLANTA" einzufügen uns speichern. Bei mir ist das ab Zeile 272 (siehe Anhang).
Danach die TabletUI-Oberfläche neu laden.

[Tommy82]

Hallo remo,

ich wollte zuerst noch auf Feedback von Helmi55 und Tommy82 warten, ob meine Änderungen mit ihren übereinstimmen.

Und dass eventuell setstate diese Änderung hier mitbekommt und sie auf dem kleinen Dienstweg einpflegt (liest er alle Nachrichten in diesem Board mit?).

Hi,
aus meiner Sicht passt das so und wäre schön wenn es eingecheckt würde.

[remo]

Guten Morgen zusammen,

vielen Dank für eure Rückmeldungen.
Ich Nutze zwar nicht das kleinklima-ImageSet,
aber diese Variante der neuen Definitionen habe ich schon getestet.
Ich nutze Meteocons.

Die Logik ist mir schon klar,
aber eigenartigerweise hat das nicht funktioniert.
Muss unter der Sektion translationmap auch noch etwas ergänzt werden?

Gruß

[hermi]

Ok, verstehe...

Dann schau mal, ob es klappt, wenn Du diese Zeilen ab Zeile 102 einfügst:

Code Auswählen Erweitern


        // Dark Sky (IconAPI, see https://darksky.net/dev/docs#data-point-object)
        'clear-day': 'B',
        'clear-night': '2',
        // 'rain': 'R',      // already defined
        // 'snow': 'W',      // already defined
        // 'sleet': 'X',     // already defined
        'wind': 'S',
        // 'fog': 'F',       // already defined
        // 'cloudy': '5',    // already defined
        'partly-cloudy-day': 'H',
        'partly-cloudy-night': '5',


Die Zuordnung der Icons zu den Zahlen/Buchstaben habe ich bei einer Schnellsuche nicht gefunden. Ich habe versucht die Zuordnung so ähnlich wie bei Yahoo, Proplanta usw. zu machen.


Ob man der Vollständigkeit halber auch noch die weathericonsmap anpassen müsste, kann ich nicht sagen. So gut verstehe ich den Code auch wieder nicht.

[Helmi55]

Hallo
und sorry fürs lange nicht melden. War Busy.
Ich habe die fehlenden Ausdrücke einfach ab 272 eingefügt. Heute ist mir aufgefallen dass 'Fog' bei mir fehlte.
Jetzt passt wieder
Gruß
Helmut

[hermi]

Gut, dann werde ich noch auf die Rückmeldung von Remo warten. Wenn bei ihm die meteocons-Änderung funktioniert, werde ich eine Pull-Request erstellen.

Wann dieser dann in den Hauptzweig eingepflegt wird, kann ich nicht sagen.

[remo]

Danke für eure Bemühungen,
das sieht erstmal alles ganz gut aus.

Request kann starten

[hermi]

Ok, erledigt: https://github.com/knowthelist/fhem-tablet-ui/pull/237

Jetzt hängt es an setstate, wann die Änderung in den master-Zweig eingepflegt wird.

Schönes Wochenende!
Hermann

[remo]

Na, wie sieht's aus?
Gibt es schon Fortschritte?

[somansch]

Ich arbeite gerade an einer Komplettüberarbeitung des Weather_Widgets. Näheres später in einem neuen Threat 

VG
Andreas

[remo]

@somansch:
klingt super - bin gespannt

Wirst du dann den Link zum neuen Thread hier posten?

[somansch]

@somansch:
klingt super - bin gespannt

Wirst du dann den Link zum neuen Thread hier posten?

Ich habe eine neue Version des "Weather_Widgets" zur Darstellung der Icons in FTUI zum Testen bereitgestellt. Diese Version unterstützt DarkSky, OpenWeather, ProPlanta und DWD https://forum.fhem.de/index.php/topic,96954.0.html

Viele Grüße
Andreas

[myhome]

Heute nach Update keine Icons mehr. Nutze Proplanta .  In der CSS von wdtimer ist auch was krumm, die Version aus Form geht dort zumindest

[somansch]

Hast du den schon mal in der Wiki und in diesem Thread geschaut? https://forum.fhem.de/index.php/topic,96954.0.html

Dort wäre deine "Frage" auch besser aufgehoben