Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[liv-in-sky]

@mcu

https://api.jquery.com/

nicht speziell für iobroker - am besten ein paar youtube video's ansehen und bei speziellen fragen googl'n mitjquery am anfang

ps: bin noch nicht ganz happy mit dem img - bin noch am überarbeiten

[MCU]

@liv-in-sky Ja, aber da steht nicht drin, dass man "div.vis-widget-body, img.vis-no-user-select" im Selektor ergänzen muss, damit man an die Attribute kommt. Danke. Ich komme damit schon mal etwas weiter.

[liv-in-sky]

@mcu

das findest du in der entwicklerumgebung von chrome - das muss man sich raussuchen

[MCU]

@liv-in-sky Wieder was dazu gelernt. Ich hab mich immer durch die Elemente gekämpft, bis ich das passende erwischt hatte. Mit dem "Untersuchen"-Trick springt er direkt hin. Echt Klasse. Danke.
Ich zwar schon versucht in den Elementen was zu finden, hab aber nur Scripte gesehen, deswegen hab da die Suche aufgegeben. So ist es viel einfacher.

[liv-in-sky]

@mcu

was auch noch gut ist - du kannst auswählen, ob du die elemente sehen willst oder die console

in der console setze ich zum testen immer die werte mit console.log - so kann ich überprüfen , was beim starten/refresh bzw bei einem click passiert, ob ich überhaupt in der funktion lande oder welchen wert hat window.width usw

console.log("bin in function"
console.log("wert von width: "+window.width)
usw

[RkcCorian]

@liv-in-sky Vielen vielen Dank!!! Diese initiale Info hat mir gefehlt. Ich habe nun Folgendes gemacht... Ist noch viel Fleißarbeit aber ich werde es damit schaffen!!!

$(window).resize(function () 
    {  
        //Fenstergröße
        windowWidth = $(window).width();
        windowHeigth = $(window).height(); 
        
        console.log("Fensterbreite: " + windowWidth);
        console.log("Fensterhöhe: " + windowHeigth);

        //Grundrissgröße
        grundrissFactor = 1.25;
        $("#w00002").css({"width": windowWidth,"height": windowWidth / grundrissFactor});
        
        //Grundrissgröße nach Anpassung und Referenz für alle anderen
        grundrissWidth = $("#w00002").width();
        grundrissHeigth = $("#w00002").height(); 
        
        console.log("Grundrissbreite: " + grundrissWidth);
        console.log("Grundrisshöhe: " + grundrissHeigth);
        
        //Wohnzimmergröße
        wohnzimmerFactorTop = 3.265306122;
        wohnzimmerFactorLeft = 1.62601626;
        wohnzimmerFactorWidth = 2.816901408;
        wohnzimmerFactorHeigth = 2.077922078;
        $("#w00001").css({"top": grundrissHeigth/wohnzimmerFactorTop, "left": grundrissWidth/wohnzimmerFactorLeft, "width": grundrissWidth/wohnzimmerFactorWidth, "height": grundrissHeigth/wohnzimmerFactorHeigth});        
    }
);

Ergebnis

[RkcCorian]

@liv-in-sky Eine Frage noch: Gibt es ein Event, dass mir sagt "Fenster geladen" oder muss ich tatsächlich für eine gewisse Zeit eine "dumme" Schleife bauen?

[MCU]

@rkccorian https://api.jquery.com/ready/#entry-examples

[liv-in-sky]

@rkccorian

suche mal nach "jquery window loaded" da kommt einiges bei google

einen genauen tipp kann ich dir nichtgeben, ich muß auch immer testen und prüfen, ob es funktioniert

ps: ich bin froh, das scrounger mir diese warteschleife gegeben hat - thread darüber folgt noch

[RkcCorian]

@liv-in-sky So, hab jetzt mal geschaut. DOM ready ist wohl viel früher als meine Bilder geladen werden, vermutlich VIS selber und erst danach lädt VIS auch die Bilder. Hab's auch mit einer Schleife probiert, das verzögert aber nur das Laden der Bilder und wenn die Schleife fertig ist sind die Bilder immer noch nicht da.
Load ist deprecated und das Event kommt gar nicht :-( Jetzt scheitert es tatsächlich daran, dass ich kein Event finde sobald auch die Bilder geladen wurden... :-(

Noch jemand eine Idee?

[liv-in-sky]

@rkccorian

genau deshalb gibt es das script von scrounger :-(

[liv-in-sky]

@rkccorian

man kann aber einfach erinen settimeout nehmen - wie oft kommt es vor, dass man direkt nachdem laden der seite schalten will

settimeout von 5-10 swk und alles ist da

[RkcCorian]

@liv-in-sky Ahhh, ich war nur zu doof für das Skript. Jetzt klappt es, vielen Dank!!

[MCU]

@rkccorian ".load" wurde durch ".on" ersetzt.

[RkcCorian]

@mcu Hatte ich gesehen, hat aber leider auch nicht funktioniert. Mit dem Warten geht es...

[ThoHilde]

Hallo,
ich möchte das Icon von Fensterkontakten entsprechend des Zustands ändern.
Hierzu habe ich bei den Kontakten (Aqara Fensterkontakt über zigbee Adapter) bei "Icon (JSON-Format)" folgendes eingetragen:

{
  "an": "window-closed-variant",
  "geschlossen": "window-closed-variant",
  "aus": "window-open-variant",
  "offen": "window-open-variant"
}

An/Geschlossen bzw. aus/geöffnet ist dem Eintrag unter Anzeigevariante geschuldet bzw. da ich nicht sicher bin, welcher Zustandsname verwendet wird.

{
  "an": "geschlossen",
  "aus": "geöffnet"
}

Jedoch wird mir so nun gar kein Icon mehr angezeigt.

Im Wiki wird das so bei Icon als Beispiel geführt, nur mit 0/1 und true/false statt an/aus und offen/geschlossen.

Wo liegt denn hier mein Fehler?

[MCU]

@thohilde Zeig mal das iobroker Objekt und die Geräte Einstellungen
Icon Einstellungen beziehen sich auf den DatenpunktAnzeige

[Diginix]

@thohilde Bei mir sieht das so aus:

Anzeigevariante:

{
  "opened": "offen",
  "tilted": "gekippt",
  "closed": "zu"
}

Icon:

{
  "closed": "window-closed-variant",
  "default": "window-open-variant faded",
  "tilted": "folder-open-outline"
}

Das Objekt hat als Werte: closed, tilded, open

[ThoHilde]

@diginix @MCU Danke. Das war der entscheidende Hinweis!

Ich lasse den contact Datenpunkt anzeigen und habe es nun auf

{
  "true": "window-closed-variant",
  "false": "window-open-variant"
}

geändert. Jarvis zeigt mir die passenden Icons an. Danke!

[Diginix]

Ich habe gerade ein Problem mit der Darstellung der Spalten.
Bis 4 ist alles ok. Aber wenn man 5 erstellt, wird immer eine sechste leere Spalte dargestellt, die es Layout JSON nicht gibt.

Erstelle ich die sechte 6 werden die Widgets genau dort auch angezeigt. Nach dem Löschen der sechsten Spalte werden die 5 wieder mit der leeren 6. angezeigt.

JSON mit zugeklappten Spalten:

Im HTML sind es auch nur 5:

Müsste also ein CSS Fehler sein.

@Zefau @MCU
Edit: ist ein CSS Bug:

Das sind die Prozente für 6 Spalten, die aber zu .MuiGrid-grid-xl-1 gehören müsste. Wenn man beide Werte auf 20% setzt, passen die 5 Spalten. Erstellt man echte 6 Spalten, gibt es aber gar keine class .MuiGrid-grid-xl-1 im DOM.
Technisch funktionieren also nur 1-4 und 6 Spalten mit v2.