Neues YouTube-Video: Visualisierung im Devices-Adapter

[TripleX]

Ich habe mehrere Widgets HTML & VAL gruppiert.
Anschließend einen Rahmen rumgelegt und wieder gruppiert.
Wenn ich nun diese Gruppe kopieren möchte, wird mir in der Anzeige der Zwischenablage die Gruppe korrekt angezeigt.
Wenn ich diese dann erneut einfüge, fehlt aber ein Teil.

Hier mal ein Beispiel bei dem Versuch die Benzinpreise anzuzeigen.
Links der Ursprung und rechts die Kopie.

[oFbEQnpoLKKl6mbY5e13]

@triplex

Plus zig andere Fehler (z. B. Größenänderung) beim Gruppieren von Widgets. Ich hoffe allerdings nicht mehr auf Fehlerbehebung.

[OliverIO]

@ofbeqnpolkkl6mby5e13
Die Größenänderung müsste behoben sein.

[OliverIO]

@triplex
Kannst du beides bitte exportieren
Und hier posten?
Ich kann nächste Woche mal schauen.

[oFbEQnpoLKKl6mbY5e13]

@oliverio

Nein, bei diversen Widgets ist das Problem weiterhin vorhanden.

[OliverIO]

@ofbeqnpolkkl6mby5e13
Was sein kann, man muss erst entgruppieren und dann neu gruppieren, da mittlerweile eine weitere Information gemerkt wird, die in den alten Gruppierungen nicht enthalten war

Ansonsten auch hier einfach ein beispielexport (aber möglichst simple konstellationen)

[oFbEQnpoLKKl6mbY5e13]

@oliverio

Ich ziehe einen Rahmen um ungruppierte Widgets. Sobald sie gruppiert sind, ändert sich die Größe. Ist aber auch egal, ich hoffe auf die neue VIS...

[OliverIO]

@ofbeqnpolkkl6mby5e13

also ich habe es gerade mit 2 Number widgets probiert.
kann kein Problem entdecken. gruppieren/entgruppieren funktioniert einwandfrei.
auch keine größenänderung mehr.
das wurde hiermit behoben
https://github.com/ioBroker/ioBroker.vis/issues/432

wenn es bei anderen typen von widgets nicht funktioniert muss man da reinschauen.
gibt es dazu ein github issue? kannst du die widgettypen benennen?

darüber hinaus muss man bei dieser art von fehler leider auch noch nach css-seiteneffekte schauen. nicht das da eine css-anweisung auf ein das element wirkt, was so nicht beabsichtigt wurde. css-anweisungen wirken immer global und wenn der css-selektor nicht sehr starkt differenziert trifft es auch andere elemente die nicht gemeint sind.

[oFbEQnpoLKKl6mbY5e13]

@oliverio

Metro Tile Widgets oder hqwidgets Door zum Beispiel.

Ja, ich habe wenige CSS:

.rotate90{
    transform: rotate(90deg);
}
.rotate180{
    transform: rotate(180deg);
}
.rotate270{
    transform: rotate(270deg);
}
@keyframes blink {
  50% {
    opacity: 0.0;
  }
}
@-webkit-keyframes blink {
  50% {
    opacity: 0.0;
  }
}
.blinkingtext {
  animation: blink 2s step-start 0s infinite;
  -webkit-animation: blink 2s step-start 0s infinite;
}
.blink {
  animation: blinker 2s linear infinite;
}
 
@keyframes blinker {
  40% {
    opacity: 0;
  }
}
.rotateanimation {
  -webkit-animation: rotation 2s infinite linear;
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
  } to {
     -webkit-transform: rotate(359deg);
  }
}

[TripleX]

@oliverio werde es versuchen.
Habe gerade meinen Editor geöffnet und beim Entgruppieren ist mir das Ding um die Ohren geflogen. Der gelbe Hintergrund geht jetzt über die ganze View und alle Datenpunkte sind verschwunden.

Habe das ganze jetzt nochmal neu erstellt.
Bin jetzt aber wieder an einem Punkt wo es nicht funktioniert.
Wenn ich die Gruppe Diesel+Preis kopieren möchte, Wird nur Diesel und € kopiert.
Hier der Export.

[{"tpl":"_tplGroup","data":{"members":["w00002","w00137","w00138","g00026"],"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","attrCount":"1","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},"widgetSet":null,"style":{"top":234.984375,"left":684.984375,"width":"160px","height":"500px"}},{"tpl":"tplFrame","data":{"g_fixed":false,"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":true,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","title":"","title_color":"#ffffff","title_top":"0","title_left":"5","header_height":"0","header_color":"","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,"title_back":"","title_font":""},"style":{"left":"0%","top":"0%","width":"93.75%","height":"100%","overflow-x":"hidden","overflow-y":"hidden","background-color":"#ffcb29","background-repeat":"","border-width":"5px","border-style":"outset","border-radius":"","z-index":0,"opacity":"","font-size":"x-large","font-weight":"bolder","font-variant":"small-caps","text-shadow":"","font-family":"Verdana, Geneva, sans-serif","font-style":"normal","border-color":"#ffcb29"},"widgetSet":"basic","grouped":true,"groupid":"g00034","groupName":"w00002"},{"tpl":"tplImage","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":false,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"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,"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,"src":"/vis.0/main/img/Tankstellen/Logo - Jet.png","stretch":false},"style":{"left":"9.38%","top":"3%","width":"81.25%","height":"16%","z-index":1},"widgetSet":"basic","grouped":true,"groupid":"g00034","groupName":"w00137"},{"tpl":"tplValueString","data":{"oid":"tankerkoenig.0.stations.1.name","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","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,"test_html":""},"style":{"left":"0%","top":"23%","width":"100%","height":"4%","text-align":"center","color":"#173b64","z-index":2},"widgetSet":"basic","grouped":true,"groupid":"g00034","groupName":"w00138"},{"tpl":"_tplGroup","data":{"members":["w00139","g00018"],"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","attrCount":"1","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},"widgetSet":null,"style":{"top":"32%","left":"9.38%","width":"81.25%","height":"12%"},"grouped":true,"groupid":"g00034","groupName":"g00026"},{"tpl":"tplHtml","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","refreshInterval":"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,"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,"html":"Diesel"},"style":{"left":"0%","top":"0%","color":"#173b64","font-size":"20px","width":"100%","height":"33.33%","z-index":2},"widgetSet":"basic","grouped":true,"groupid":"g00026","groupName":"w00139"},{"tpl":"_tplGroup","data":{"members":["w00119","w00140","w00141"],"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","attrCount":"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,"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,"attrType1":""},"widgetSet":null,"style":{"top":"41.68%","left":"0%","width":"92.31%","height":"58.33%","background-color":"#ffaf24","border-style":"inset","border-width":"5px","border-color":"#ffaf24","z-index":1,"color":"#173b64"},"grouped":true,"groupid":"g00026","groupName":"g00018"},{"tpl":"tplHtmlNav","data":{"g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","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,"html":"€"},"style":{"left":"79.65%","top":"0%","font-size":"30px","text-align":"center","width":"20.35%","height":"100%","font-weight":"bold"},"widgetSet":"basic","grouped":true,"groupid":"g00018","groupName":"w00119"},{"tpl":"tplValueFloat","data":{"oid":"tankerkoenig.0.stations.1.diesel.short","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","is_comma":true,"factor":"1","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,"digits":"2","oid-quality":"","is_tdp":false},"style":{"left":"0%","top":"0%","font-size":"30px","width":"66.37%","height":"100%","text-align":"right","font-weight":"bold"},"widgetSet":"basic","grouped":true,"groupid":"g00018","groupName":"w00140"},{"tpl":"tplValueFloat","data":{"oid":"tankerkoenig.0.stations.1.diesel.3rd","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","is_comma":"true","factor":"1","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,"digits":"0","oid-quality":""},"style":{"left":"66.37%","top":"0%","height":"100%","width":"13.27%","font-size":"23px","text-align":"center","font-weight":"bold"},"widgetSet":"basic","grouped":true,"groupid":"g00018","groupName":"w00141"}]

[OliverIO]

@triplex

ok habe reingeschaut. konnte es so nachvollziehen wie du gesagt hast.
es liegt wohl daran, das gruppen in gruppen nicht korrekt kopiert werden, sondern nur jeweils das erste widget in der untergruppe

ich debugge da mal rein, allerdings nicht vor montag

[OliverIO]

@triplex

leider wie befürchtet ist hier etwas komplexerer code.
da brauche ich ein wenig um das zu durchschauen.
melde mich

[OliverIO]

@triplex

nachdem ich über die tage mehrere stunden den code debugged habe,
habe ich einen fehler im copy-anteil gefunden
und einen im paste anteil

der fehler im copy-anteil ist leicht behebbar.
im paste-anteil habe ich ein problem gefunden, das im design steckt und eigentlich nur durch neuprogrammieren mindestens einer funktion (dupWidgets gelöst werden müsste.)
da ich keinen überblick habe von wo aus und wie diese funktion noch mit eingebunden ist und welche anforderung daran gestellt wird, ist es aufwändig und wieder fehleranfällig da etwas daran zu ändern.
es sind einfach zu viele schalter in der funktion enthalten, deren funktion und auswirkung nicht immer überschaut werden kann.

Falls jemand einen tieferen Einblick/Überblick in vis hat, kann ich gerne meine Erkenntnisse schildern. Evtl kann man über diesen Weg die Seiteneffekte einer Neuprogrammieren von Copy/Paste vermindern.
Zum beheben müsste man die komplette Mechanik und die Datenstruktur des Clipboards entsprechend anpassen/ändern.

Als Workaround für Copy/Paste:
Verwendet keine in sich verschachtelte gruppierte Widgets, welche kopiert werden sollen.
Nach einmal gruppieren ist schluss.
Falls es für die bessere Bearbeitung notwendig ist, dann nach dem einfügen erneut manuell gruppieren.

https://github.com/ioBroker/ioBroker.vis/issues/506

[TripleX]

@oliverio Danke für die Info.
Habe mir jetzt so beholfen, indem ich von der ganzen Gruppe einen Export gemacht haben und dann direkt wieder importiert habe. Dann war es auch egal ob man Gruppierungen in mehreren Ebenen hatte.

[OliverIO]

@triplex

ja stimmt, export/import ist in diesem fall das bessere copy/paste