Habpanel Dateipfad mit Umlauten

GUI Relevanten, PaperUI, BasicUI, HabPanel ...

Moderatoren: seppy, udo1toni

Antworten
kaloschke
Beiträge: 175
Registriert: 29. Jan 2019 07:20

Habpanel Dateipfad mit Umlauten

Beitrag von kaloschke »

Hallo,

erstmal wünsche ich allen hier ein tolles 2021.
Und dann kommt auch schone meine Frage:

Ich benutze (jetzt in OH 3.0) das Openweather-Binding. Dieses liefert mir die Beschreibung der Wetterlage in deutsch.
Diese Beschreibung benutze ich, um das passende Icon in Habpanel einzubinden. Ich weiß, ich kann auch die aus dem Binding benutzen, aber die gefallen mir nicht.

Probleme gibt es jetzt mit den deutschen Umlauten ect, denn der Apache auf meinem RP4 kann damit wohl nichts anfangen.

Code: Alles auswählen

<img id="weather-icon" src="{{ServerPath}}/images/{{IconDay}}/{{itemState('TodayCondition').split(' ').join('') | lowercase }}.png" />
Mit .split und .join beseitige ich Leerzeichen, lowercase spricht für sich.
Aus "Überwiegend bewölkt" wird also "überwiegendbewölkt". Eine URL Encodierung würde hier ja wohl auch nichts bringen.

Hat jemand einen Tipp?

Vielleicht könnte ich mir die Wetterdaten auch auf Englisch ausgeben lassen, müsste sie dann aber für die Klartextanzeige irgendwie übersetzten. Im PaperUI könnte ich dafür doch eine Transformation nutzen oder? Geht das auch mit Habpanel?

Bin gespannt ...

kaloschke
Beiträge: 175
Registriert: 29. Jan 2019 07:20

Re: Habpanel Dateipfad mit Umlauten

Beitrag von kaloschke »

Habe mir einen eigenen Filter basteln können :D
Wie oben schon überlegt, habe ich das Binding auf Englisch zurückgestellt.
Dann Javascriptdatei weathertranslate.js im HTML-Ordner angelegt ...

Code: Alles auswählen

var app = angular.module('translateweather', []);
app.filter('translateweather', function() {
    return function(input) {
        var weather = [
            ['snow', 'Schnee'],
            ['rain', 'Regen'],
            ['cloudy', 'Bedeckt']
            .
            .
            .
        ];
        for (var i = 0; i < weather.length; i++) {
            if (weather[i][0] == input)
                return weather[i][1]
        }
        return 'Unbekannt'
    }
});

app.controller('translateweather', function($scope) {

    $scope.tutorial = "Angular";
});
und im Widgetcode folgendes eingefügt ...

Code: Alles auswählen

<div oc-lazy-load="['/static/weathertransformation.js']">
        .
        .
     <div class="wa2">{{itemState('TodayCondition') | translateweather}}</div>
	-
	-


</div>
Kann man ähnlich vielleicht auch für was anderes brauchen.

Viele Grüße

Antworten