Servus zusammen!
Nachdem ich nach dem Update auf 2.4 so langsam sämtliche (alten) Unterseiten wieder reaktivieren möchte, ist mir aufgefallen, dass die meisten Openautomation-Icons nicht mehr angezeigt werden. Hat sich da etwas an der Syntax geändert in den letzten Monaten?
Ich dachte, den Icons ein oa- voranzustellen genügt:
<div data-type="label">Heizmodus</div>
<div data-type="symbol"
data-device="WZ_Thermostat"
data-get="controlMode"
data-icons='["oa-sani_heating_manual","oa-time_automatic"]'
data-get-on='["manual","auto"]'
data-on-color="#aa6900"
class="small"></div>
Lieder zeigt es mir kein Icon an. Kann mich Mal bitte einer auf eine meiner Unzulänglichkeiten hinweisen?
Hab's selber gefunden. Hatte ein Typo in der index.html. Mit einem Slash vor lib geht's natürlich nicht...
<link rel="stylesheet" href="lib/openautomation.css" />
Hallo, ich habe auch ein Problem mit den openautomation Icons!
Bei einem Pagereload wird ganz kurz das richtige Icon angezeigt, danach sehe ich nur noch komische Zeichen! Kann da jemand helfen, oder ist das ein generelles Problem?
FHEM und ftui sind aktuell.
hier noch der Code:
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" /
<div class="big" data-type="symbol" data-device="Tuer_Kueche" data-icon="oa-secur_locked" data-off-color='#269935'></div>
<div data-type="label" class="top-narrow darker small">Tür</div>
Grüsse
Hallo??
Muss ich sonst noch etwas einstellen, oder was mache ich falsch? Sorry, ich stehe voll auf dem Schlauch!
Lasst einfach die Links für die Font stylesheet ganz weg.
Danke für den Tipp!
Aber das sollte in dem Fall im Wiki angepasst werden...
Moinsen,
eine Frage in die Runde, such mich schon zu tode...
In Fhem gibts ja die openautomation Icons. Ich habe einige davon im Einsatz in meiner Navi-Struktur:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<header class="">Menü</header>
<div class="sheet">
<div class="row">
<div data-type="pagetab" class="big"
data-url="rdo_alexa.html"
data-icon="fab fa-amazon"
data-text="Alexa"
class="big cell"></div>
</div>
<div class="row">
<div data-type="pagetab"
data-url="rdo_alarm.html"
data-icon="far fa-bell"
data-text="Alarm"
class="big cell"></div>
</div>
<div class="row">
<div data-type="pagetab"
data-url="rdo_licht.html"
data-icon="fas fa-lightbulb"
data-text="Licht"
class="big cell"></div>
</div>
<div class="row">
<div data-type="pagetab"
data-url="rdo_garten.html"
data-icon="oa-scene_garden"
data-text="Garten"
class="big cell"></div>
</div>
<div class="row">
<div data-type="pagetab"
data-url="rdo_hwr.html"
data-icon="fa-home"
data-text="Hauswirtschaftsraum"
class="big cell"></div>
</div>
</div>
</body>
</html>
Zu finden in der Fhem Installation hier: http://pi:8083/fhem/ftui/icons_table.html
Nun aber will ich jetzt auf einer Seite einen homestatus nutzen und darin diese Icons und jetzt wird mir immer "undefined" angezeigt. Andere Icons gehen und wie gesagt, die openautomation icons funktionieren in der Navistruktur ja auch...
Wo liegt mein PRoblem, muss ich noch genauer auf die Lage der Icons referenzieren?
VG
René
@fireball
Um hier was sagen zu können, wäre es bestimmt hilfreich, Deinen nicht funktionieren HTML-Teil für Homestatus hier bereitszustellen.
Hi, das ist natürlich richtig.
Anbei der Code...
Die 4 Zeilen im Header habe ich jetzt noch in jeder meiner Dateien hinzugefügt, weil ich dachte, viell werden die Stylesheets gebraucht um die Icons anzuzeigen, aber es hat nichts gebracht.
Komisch ist ja auch das die openautomation icons in meiner menü.html funktionieren, auch ohne die Stylsheet einträge.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />
</head>
<body>
<div class="gridster">
<ul>
<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="rdo_menu_rechts.html">Menü rechts</li>
<li data-row="1" data-col="2" data-sizex="1" data-sizey="1">
<header class="">TEMPERATUR / LUFTFEUCHTE</header>
<div class="top-space" style="height: calc(100% + 0px);">
<div data-type="label" data-device="LAD7" data-get="ambientTemperature" data-unit="°C" data-limits="[-70,20,25]" data-colors="["cornflowerblue","green","firebrick"]" class="big inline" style="color: firebrick;"><span class="label-precomma">25</span><span class="label-comma">.</span><span class="label-aftercomma">7</span><span class="label-unit">°C
</span></div>
<div data-type="label" data-device="BZ_Luftfeuchtigkeit" data-get="state" data-unit="%" data-limits="[0,50,71]" data-colors="["cornflowerblue","green","firebrick"]" class="big inline left-space" style="color: firebrick;"><span class="label-precomma">78</span><span class="label-comma">.</span><span class="label-aftercomma">3</span><span class="label-unit">%</span></div>
<hr class="top-space" width="85%">
<div class="bigger orange">
Garten
</div>
</div>
</li>
<li data-row="1" data-col="3" data-sizex="4" data-sizey="5">
<header class="">Gartensteuerung</header>
<div data-type="homestatus"
data-device="Gartenbewaesserung_Homestatus"
data-set-on='["0","1","2","3","4"]'
data-alias='["Bewässerung","Kreis 1","Kreis 2","Kreis 3","Kreis 4"]'
data-icons='["fa-wheelchair","oa-sani_sprinkling","fa-wheelchair","fa-wheelchair","fa-wheelchair"]'
data-version="roommate"
data-height="200"
data-width="200">
</div>
</li>
<li data-row="6" data-col="1" data-sizex="1" data-sizey="1" data-template="rdo_info.html">Informationen</li>
<li data-row="6" data-col="2" data-sizex="5" data-sizey="1" data-template="rdo_menu_unten.html">Menü unten</li>
</ul>
</div>
</body>
</html>
Anbei auch mal ein Screenshot, da sieht man das viele OA-Icons gehen, nur nicht im Homestatus. Man sieht das die fa-icons angezeigt werden...
Ich habe schon mit der Größe rumgespielt vom Homestatus, hilft auch nicht... steht immer "undefined"
VG
@fireball
Ein wenig Recherche hat ergeben, dass das Homestatus-Widget spezielle Anforderungen an verwendete Icon-Fonts stellt.
Standardmäßig wird Font Awesome 5 Free unterstützt. Desweiteren gibt es (undokumentierte) Attribute data-icon-font und data-icon-weight. Wenn überhaupt, kann man wohl mit diesen einen anderen Icon-Font festlegen - fraglich nur wie; man kann aber auf jeden Fall immer nur einen Icon-Font verwenden.
Es sieht so aus, als wäre ein Icon aus dem fa-Universum aktuell die einzige Lösung ...
Hallo OdfFhem,
vielen Dank für die Info und deine Recherche. Ich glaube so tief wäre ich gar nicht abgebogen.
Ich hatte auch schon versucht, einfach mit den FA-Icons zu arbeiten, aber das richtige für meinen Anwendungsfall war leider nicht dabei.
Trotzdem vielen Dank erstmal
René