Einfach mal zeigen will….. :-) - Teil 3

[eMd]

Ich habe mir da was mit iQontrol gebastelt fürs Handy.

Handyvisualisierung

Bilder von icon8 und der Rest alles aus dem iobroker ui kit...

MfG
eMd

[Glasfaser]

@Nashra

[Glasfaser]

@eMd

Sieht gut aus auf dem Handy auf .. übersichtliche Buttons angelegt und so leicht bedienbar .

[padrino]

@Nashra sagte in Einfach mal zeigen will….. - Teil 3:

Danke für den Link schade, leider keine blaue und grüne Tonne dabei.

Taddaa!

Vielleicht nicht ganz perfekt, aber ich denke, man kann damit arbeiten.

[Glasfaser]

@padrino sagte in Einfach mal zeigen will….. - Teil 3:

Vielleicht nicht ganz perfekt, aber ich denke, man kann damit arbeiten.

Doch …. sieht gut aus

[padrino]

So, die "Zungen" sind oben gefixt.

[joergeli]

@Nashra
Hi, ich hatte hier schon mal meine Tonnen eingestellt:
https://forum.iobroker.net/topic/12723/einfach-mal-zeigen-will-teil-2/839

Gruß
Jörg

[opossum]

Hallo,

hier mal meine Bilder für lustige Mülltonnen. Habe die von oben mal eingefärbt.

muelltonne_1.zip

[Nashra]

Moin @Glasfaser, @padrino, @opossum , ihr seit einfach Klasse
Danke für die Tonnenauswahl

[lesiflo]

Hallo,
auf vielfachen Wunsch hier ein aktueller Export meiner Vis im "Material Design" von Uhula.

Hatte ich auch schon mal hier vorgestellt:
https://forum.iobroker.net/topic/12723/einfach-mal-zeigen-will-teil-2/607

[Flexer]

Habe meine Vis mal abgefilmt!

Hier der Link

https://m.youtube.com/watch?v=DQ9PoF1Vjlo&feature=youtu.be

[Negalein]

@Flexer sagte in Einfach mal zeigen will….. - Teil 3:

Habe meine Vis mal abgefilmt!

Hier der Link

https://m.youtube.com/watch?v=DQ9PoF1Vjlo&feature=youtu.be

Schaut richtig gut aus!

Der Netzwerkview gefällt mir. Vorallem das mit den blauen animierten Linien.

[Nashra]

Toll gemacht und wie @Negalein schon schreibt, auch mir hat es das Netzwerkview angetan mit den Linien
Würdest du es hier zum Download anbieten

[Flexer]

Ich könnte es zur Verfügung stellen jedoch bringt es dir nichts. Der Aufbau ist recht einfach. Im Hintergrund läuft ein Video. Die gibt es im Internet kostenlos zum Download zum Beispiel auf Pixabay. Das musst du mit dem HTML widget einbauen. Eine Ebene höher legst du ein Bild von deinem Netzwerkplan drauf. Hier müssen die „Verbindungen“ transparent sein dass das Video durchscheint. Jetzt noch eine Ebene höher die Widgets die rot sichtbar sind wenn kein Ping möglich ist.

Fertig!

[Nashra]

@Flexer sagte in Einfach mal zeigen will….. - Teil 3:

Ich könnte es zur Verfügung stellen jedoch bringt es dir nichts. Der Aufbau ist recht einfach. Im Hintergrund läuft ein Video. Die gibt es im Internet kostenlos zum Download zum Beispiel auf Pixabay. Das musst du mit dem HTML widget einbauen. Eine Ebene höher legst du ein Bild von deinem Netzwerkplan drauf. Hier müssen die „Verbindungen“ transparent sein dass das Video durchscheint. Jetzt noch eine Ebene höher die Widgets die rot sichtbar sind wenn kein Ping möglich ist.

Fertig!

Geniale Idee, werde versuchen es nachzubauen. Danke für die Anleitung

[Leviathan09]

@Flexer Mit was hast du den Netzwerkplan denn erstellt? Wollte das nach meiner Umkabel-Aktion nun auch angehen, kenne da aber bisher kein Programm. Wäre sehr nett wenn du mir da mal einen Tipp geben könntest.
Oder die anderen User hier. Thx
Anonsten wie auch schon unter YT geschrieben, klasse VIS

[Homer.J.]

@lesiflo Hi lesiflo kannst du die Datei nochmal als zip packen geht so nicht zu importieren, hab es auch schon versucht umzuwandeln von rar auf eine zip geht leider auch nicht.

Grüße

[Flexer]

@Leviathan09

Habe das mit Photoshop gemacht. Ein Softwar dafür die das am Ende so darstellt gibt es nicht bzw ist mir nicht bekannt

[Negalein]

@Flexer sagte in Einfach mal zeigen will….. - Teil 3:

Habe meine Vis mal abgefilmt!

Wie hast du das mit dem Gast-WLAN Code gelöst?

[Glasfaser]

@Negalein

Wurde eigentlich nicht gefragt … aber meinst du soetwas :

QR-Code ändert sich je Tag :

Widget :

Spoiler

[{"tpl":"tplBulbOnOffCtrl","data":{"oid":"tr-064.0.states.wlanGuest","g_fixed":true,"g_visibility":false,"g_css_font_text":false,"g_css_background":true,"g_css_shadow_padding":true,"g_css_border":true,"g_gestures":false,"g_signals":true,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","icon_off":"/vis.0/Wohnen/WLAN_grau.png","icon_on":"/vis.0/Wohnen/WLAN_grauan.png","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"min":"false","max":"true","urlTrue":"","urlFalse":"","oidTrue":"","oidFalse":"","class":"mdui-state"},"style":{"left":"531px","top":"560px","width":"60px","height":"60px","border-radius":"10px","box-shadow":"2px 2px 3px rgba(20, 20, 20, 50)","background-color":"#303030","z-index":"20"},"widgetSet":"basic"},{"tpl":"tplShapes","data":{"g_fixed":true,"g_visibility":true,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":"true","visibility-groups-action":"hide","svgType":"circle","strokeColor":"green","fill":"transparent","strokeWidth":"8","scaleWidth":"1","scaleHeight":"1","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis.0/Forum/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis.0/Forum/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis.0/Forum/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"visibility-oid":"tr-064.0.states.wlanGuest","name":"Lichtstatus 1 Blau"},"style":{"left":"528px","top":"556px","z-index":"8","width":"69px","height":"69px","border-width":"5px","background":"green","border-radius":"12px"},"widgetSet":"basic"},{"tpl":"tplValueString","data":{"oid":"","g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"name":"Uptime","comment":"","visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","html_prepend":"Wlan Gast","html_append":""},"style":{"left":"463px","top":"625px","width":"188px","height":"25px","color":"#e6e6e6","font-family":"Verdana, Geneva, sans-serif","font-weight":"","font-size":"small","background-color":"","text-align":"center","z-index":"10","background":"-webkit-linear-gradient(-45deg, #272727 0%,#090909 100%)","border-radius":"10px","line-height":"25px","font-style":"normal","font-variant":"normal"},"widgetSet":"basic"},{"tpl":"tplValueStringRaw","data":{"hm_id":"80101","digits":"","factor":1,"min":0,"max":1,"step":0.01,"visibility-cond":"==","visibility-val":1,"oid":"javascript.0.QR-Code.Gast","gestures-offsetX":0,"gestures-offsetY":0,"signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"visibility-groups-action":"hide","lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0},"style":{"left":"496px","top":"653px","width":"125px","height":"125px","border":"2px solid rgb(255, 255, 255)","border-radius":"5px","z-index":"44","color":"","background":"#ffffff"},"widgetSet":"basic"}]

Script :

Spoiler

// https://www.npmjs.com/package/qr-image

var MySSID          = "FRITZ!Box Gastzugang";           //  SSID Name

var MyCrypt         = "WPA2";                //  [WEP|WPA|WPA2]

var MyVisibility    = "n";                  //  Hidden SSID? 

var cronStr         = "1 3 * * *"           // Script wird jeden Tag um 03:01 Ausgeführt



var idQRZiel = "javascript.0.QR-Code.Gast"; // Zieldatenpunkt für QR-Code

var IdGPasswd = "tr-064.0.states.wlanGuestPassword"; /*wlanGuestPassword*/



if(MyVisibility == "y") {

   var MyHidden="H:true";

} 

else {

   MyHidden="";

} 



createState(idQRZiel, "", {



    name: 'QR-Code für Gastpasswort',

    desc: 'QR-Code für Gastpasswort',

    type: 'string',

    role: 'value'

});



function randomString(length) {         // Methode zur Erstellung eines Random-Passworts kann angepasst werden



   return Math.round((Math.pow(36, length + 1) - Math.random() * Math.pow(36, length))).toString(36).slice(1);



}



function createQRcode() {



   var qr = require('qr-image');

   var NewPasswd = randomString(16);       // 16 Stelliges Passwort

   var svg_string = qr.imageSync('WIFI:S:'+MySSID+';T:'+MyCrypt+';P:'+NewPasswd+';'+MyHidden+';', { type: 'svg' });

        

   setState(idQRZiel, svg_string);
   setState(IdGPasswd, NewPasswd);
   console.log('+++ Wlan Gast QR-Code neu erstellt +++');
}




// regelmässige Wiederholungen

schedule(cronStr, createQRcode);

In Javascript eintragen :