Hqwidgets - Status Entwicklung, Motion Detector, Mouseover, hover, Text anzeigen mit CSS
-
Ich nutze in meinem Projekt einige hqwidgets - ist ja Sinn der Sache.
Da ich ich gern verstehe, welche Möglichkeiten die einzelnen Widgets bieten, nutze ich auch die Hilfe. Mit Freude habe ich die Beschreibung des "Motion Detector" in der Hilfe zur Kenntnis genommen. Um dann in VIS (hqwidgets v1.0.8) festzustellen, dass dieses Widget dort nicht angeboten wird. Nicht uninteressant sind sicherlich auch das "Battery Indicator"- und das "Ping device widget" aus der Hilfe. In den "ältewren" Quellen zum Widget tauchen dann noch weitere interessante Namen auf.
Auf der Github-Seite sind "nur" die Widgets präsentiert, die auch in VIS verfügbar sind, ist ja auch okay.
Ist die Veröffentlichung der in der Hilfe beschriebenen zusätzlichen Widgets geplant oder ist das inzwischen gestrichen?
Erfreulich ist die relativ ausführliche Beschreibung der hqwidgets im Vergleich zu einigen anderen. Allerdings bleiben für mich einige Möglichkeiten schleierhaft. Wie z. B. "In Arbeit Zustand ID:", "SignalObjektID:", eine ausführlichere Beschreibung zu den Möglichkeiten von "Stile", den Möglichkeiten der "Extrasteuerung" und der "Signalbilder".
Gibt es andere Quellen, wo ich mich zu diesen Punkten informieren kann? Habe leider im Forum nichts gefunden.
-
-
Mit Freude habe ich die Beschreibung des "Motion Detector" in der Hilfe zur Kenntnis genommen. `
Was meinst du mit "der Hilfe"?Gruß
Rainer
-
http://www.iobroker.net/docu/?page_id=2 … =de#Widget ` da war ich beim ersten Lesen vor einigen Monaten noch nicht so weit und dann vergessen, dass da auch etwas für mich immer noch Neues stehen könnte.
-
Was meinst du mit "der Hilfe"? ` die Hilfe zu den Widgets selbst.
Okay, die Erklärungen unter dem "VIS Adapter" hatte ich schon wieder vergessen.
Ich habe aber auch immer wieder mit den Hilfen zu den Witgets selbst Probleme. Entweder, weil sie sehr allgemein gehalten sind oder auf sich auf in Planung oder wieder verworfene (?) Widgets beziehen. Als Bsp. das hqwidget für den Motion Detector. Nach dem Fund in der Hilfe habe ich mir die unter VIS und VIS.beta angebotenen Widgets angeschaut und bin nicht fündig geworden. Anschließend habe ich die hqwidgets-Version aus git installiert - negativ, im ioBroker-Forum gesucht, in www gegoogelt, um dann festzustellen, dass da ggf. "mal" etwas kommt oder schon wieder rausgefallen ist. Den Kurvenverlauf meiner Morphine und des Adrealins möchte ich hier nicht weiter ausführen.
Generell denke ich, ist es für Neueinsteiger ohne Background in Webprogrammierung schwierig, die Einsatzmöglichkeiten der einzelnen Widgets mit ihren Vor- und Nachteilen für ein spezielles Szenario zu erkennen. Sehr hilfreich wäre in meinen Augen ein Art Register mit Erklärungen zu den einzelnen Widgets bzw. Funktionsgruppen und deren vorgesehenen Einsatzzweck, ggf. mit Verweis auf die bereits bestehenden Beispielprojekte oder weiterführende Tutorials. Vielleicht gibt es das ja bereits und ich habe nur den Überblick verloren.
-
Moin,
also bei den Widgets gebe ich dir recht. Da komme ich auch noch nicht mit klar. Wenn ich was basteln will weiß ich nie welches Widget wofür :?
Das manche Sachen noch nicht fertig/da sind finde ich erstmal nicht schlimm. Die Community tut und macht was sie kann, besonders die Mods/Admins stehen einem stehts zur Seite. Die sind auch nur Menschen und investieren viel viel Zeit.
Ohne vorkenntnisse ist ja ok aber man muss bereit sein sich weiterzuentwickeln. Im bereich SmartHome ist immer eigeninitiative gefordert.
Wenn du nun etwas bauen willst und nicht weißt wie es geht erstell einfach einen Foren Beitrag. Dort wird man helfen und wenn es erledigt ist haben wir wieder eine gute Vorlage wenn mal wieder einer sowas oder sowas ähnliches sucht.
Hast du aktuell eine spezielle frage zu dem Widget?
-
Generell denke ich, ist es für Neueinsteiger ohne Background in Webprogrammierung schwierig, die Einsatzmöglichkeiten der einzelnen Widgets mit ihren Vor- und Nachteilen für ein spezielles Szenario zu erkennen. Sehr hilfreich wäre in meinen Augen ein Art Register mit Erklärungen zu den einzelnen Widgets bzw. Funktionsgruppen und deren vorgesehenen Einsatzzweck, ggf. mit Verweis auf die bereits bestehenden Beispielprojekte oder weiterführende Tutorials. Vielleicht gibt es das ja bereits und ich habe nur den Überblick verloren. `
Nein, gibt es leider noch nicht, ich bin aber dran.Wie bereits in anderen Threads beschrieben ist es eine echte Herausforderung so ein Register von mehreren hundert Widgets einerseits übersichtlich und andererseits mit vollumfänglichen Informationen zu versehen. Vom Aufbau und der Pflege ganz abgesehen.
Gruß
Rainer
-
wo ich jetzt da gerade wieder dabei bin und im Forum nichts zum Thema gefunden habe.
Ich möchte z. B. beim hqwidget On/Off oder jqui-mfd-value-Socket beim "Mouseover" zusätzliche statische und ggf. dynamische Informationen anzeigen.
Ist das generell bei allen Widgets möglich? Gibt es Beispiele (z. B. Beispielprojekte), wo ich mir entsprechende Umsetzungen anschauen kann?
Danke und Gruß
GH
-
Das sollte möglich sein.
Ist bestimmt machbar über css mouseover (hover)
Ich habe es gerade probiert scheiter aber leider daran.
Wenn ich den Css code eingebe und speicher und danach die Seite (Editor) neu lade ist der Css code verschwunden. Das sollte nicht so sein oder?
-
Ich denke Bluefox würde gerne helfen wenn ihr euch der Widget-Entwicklung annehmen wolltet.
Alles was ihr macht muss er anschließend nicht mehr machen
Wenn ihr daran ernsthaft interessiert seid, solltet ihr ihn mal anfragen.
Gruß
Rainer
-
:lol: Ich helfe wo ich kann. Leider ist meine CSS Ahnung gegen null. HTML geht so. Müsste halt wissen warum mein CSS Code immer wieder weg ist. Unter Allgemein müsste ich ja dann eine neuen CSS Klasse angezeigt bekommen theoretisch. Tut sich aber nix.
Naja mit Widget selber hat es ja nicht direkt was zu tun. Wir wollen ja an vorhandene Widgets ein Hover Effekt hinzufügen wie ich es jetzt verstanden hab. Quasi so wie unter Instanzen auf das Farbsymbol die Maus halten um Detailinfos zu erhalten.
-
Bevor ich mich an die Entwicklung eines Widgets bzw. deren Erweiterung wage, möchte ich noch einiges mehr verstanden und gemacht haben. Z. B. CSS.
Einfache Korrekturvorschläge/Erweiterungen zu Adaptern habe ich schon getätigt und auch schon eine Idee für einen eigenen Adapter. Es kostet aber eben auch alles seine Zeit und da geht meine Bewunderung an Bluefox und den anderen, die sehr sehr viel Zeit in dieses Projekt investieren. Kriege da schon mal ein schlechtes Gewissen, aber es gibt im Leben leider nicht immer nur Hobby und Spass (zumindest in meinem nicht).
Zurück zum Mausüber - Hover-Effekt. Ich habe mir eine Menge Ideen und Lösungsansätze aus den Beispielprojekten und Skriptdiskussionen geholt. Und richtig,
@kmxak:Quasi so wie unter Instanzen auf das Farbsymbol die Maus halten um Detailinfos zu erhalten. ` , dass ist auch eine Inspiration, wie ich das gerne in meinem Projekt hätte. Wenn es so "einfach" perr CSS geht, dann würde sich ja vielleicht eine CSS-Skriptsammlung analog zu den JavaScript-Beispielen lohnen, ggf. mit Beispielen, wie es für die verschiedene Widget-Implementierungen umzusetzen wäre.
Wenn ich mir mit dem Chrome-Inspector das Status-Widget einer Instanz anschaue, sehe ich die "instance-id" und auch das meine Maus das Ereignis mit der Klasse "instance-state-hover" auslöst.
Mein Widget hat die id "w01008". Wie kann ich nun meinem Widget sagen, dass es beim Mouseover auche einen speziellen Text / Status anzeigt soll.
Ich habe verstanden, dass ich die unter dem Tab CSS definierte Klasse (welche u. U. eine vorhande Klasse überschreibt)
.hq-button-green-normal {
background: red !important;
box-shadow: inset 3px 2px 7px 0px #BB1111 !important;
border: 1px solid #aa1111 !important;
}
einem spezifischen Widget über die Eigenschaft "CSS-Klasse" zuweise bzw. in in diesem Fall über eine Style-Eigenschaft mit dem selben Namen "button-green-normal"
Was bedeutet dann
#w00236_button:hover{ /* der Button bei MouseOver */
border-color:red;
}
und wie wäre die entsprechende Klassendeklaration für mein hq-Widget "#w01008" ?
Wie kann ich die benötigten Informationen über die Chrome Dev-Tools ermitteln?
Oder gibt es nur den Weg "24 Tage mit CSS auf einer Insel"?
Hover for all!
Bin dann leider über Ostern wieder offline.
