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

[MCU]

@loddl
Datenpunkt-Stil

{"false":{"color":"red","font-weight":"bold","text-shadow":"0 0 5px black;"}}

Anzeigevariante (blink5 kann man auch weg lassen)

{"false":"<div class='card'><span></span><span></span><span></span><span></span><div class='content blink5'><p>Nicht aktiv</p></div></div>","true":"<a href='https://www.google.de'>GoogleDE</a>"}

Styles (für mehrere Durchgänge muss man die Anzahl anpassen: 3 forwards)

Styles-Einträge für snake-Effekt

.card 
{
 position: relative;
 width: auto;
 height: 25px;
 display:flex;
 justify-content: center;
 align-items: center;
 margin: 0px;
 overflow:hidden;
}

.card .content 
{
 padding: 10px;
 text-align: center;
}

.card span
{
 transition: 1;
}

.card span:nth-child(1) 
{
 position: absolute;
 top:0;
 left:0;
 width:100%;
 height:3px;
 background: linear-gradient(to right, transparent, red);
 animation: animate1 2s linear 3 forwards;
}
@keyframes animate1
{  
 0% { transform: translateX(-100%);}
 100% { transform: translateX(100%);}
}

.card span:nth-child(2)
{
 position: absolute;
 top:0;
 right:0;
 width:3px;
 height:100%;
 background: linear-gradient(to bottom, transparent, red);
 animation: animate2 2s linear 3 forwards;
 animation-delay: 1s;
}
@keyframes animate2
{  
 0% { transform: translateY(-100%);}
 100% { transform: translateY(100%);}
}

.card span:nth-child(3) 
{  
 position: absolute;  
 bottom:0;
 left:0;
 width:100%;
 height:3px;
 background: linear-gradient(to left, transparent, red);
 animation: animate3 2s linear 3 forwards;
}
@keyframes animate3
{
 0% { transform: translateX(100%);}
 100% { transform: translateX(-100%);}
}

.card span:nth-child(4) 
{
 position: absolute;
 top:0;
 left:0;
 width:3px;
 height:100%;
 background: linear-gradient(to top, transparent, red);
 animation: animate4 2s linear 3 forwards;
 animation-delay: 1s;
}
@keyframes animate4
{
 0% { transform: translateY(100%);}
 100% { transform: translateY(-100%);}
}

[LoDDl]

@mcu vielen Dank! :)

[Algie]

Hallo,

ich habe jarvis vor kurzem erst entdeckt und bin begeistert.
Beim umsetzen meiner Visualisierung habe ich eine Frage. Ist es möglich die Spritpreise ohne VIS und iFrame so darzustellen?

Also die dritte Dezimalzahl erhöht?

[MCU]

@algie
Würde es so reichen?

Vorraussetzung ist, die Zahl hat immer den Aufbau x.xxx

{"value":"val => String(val).substr(0,4)+'<sup>'+String(val).substr(4,1)+'</sup>' + ' €'"}

[Algie]

@mcu perfekt, vielen Dank für die schnelle Hilfe.

Ist es möglich VIS-Seiten in Jarvis zu skalieren? Mit iFrame geht das nicht.

[MCU]

@algie Zeig mal Deine iFrame Einstellungen und die Anzeige.

[Algie]

@mcu

[Algie]

@mcu

Das ist die Anzeige. Wird abgeschnitten. Aber man kann nach links scrollen.
Ich möchte aber, dass die Seite auf die Widgetgröße angepasst wird.

[MCU]

@algie
Setz mal hier 100% nicht 600px

[Algie]

@mcu ändert sich leider nichts.

[MCU]

@algie
Hast du mal die Skalierung raus genommen? Und mal mit den Prozentwert versucht? Also mal 90% und so weiter.
Dann auch in der Höhe mal mit Prozent oder geringere Höhe arbeiten?
Oder in der VIS selbst das Element (Müll) verkleinern?

[Renegade 0]

Moin,

hat sonst noch wer Probleme mit Jarvis 2.2.1 Uhrzeit und Wetter-Widget?

hab irgendwie immer diese Ladeanzeige drinnen.

[neunteufels]

@renegade-0

Ich hatte das Problem beim Wetter-Widget dass die Icons nicht mehr angezeigt wurden.
Ein Update auf 2.2.2 hat geholfen.

Das Update wurde weiter oben schon mal diskutiert:
https://forum.iobroker.net/post/654032

lg

[Renegade 0]

@neunteufels
OK, muss ich mal schauen, aber den daswetter.com Adapter brauche ich nicht im Broker oder?

[neunteufels]

@renegade-0

Kann ich nicht sagen, da ich den schon vor Jarvis in Verwendung hatte.

[Renegade 0]

@neunteufels
Hast du das als Gerät importiert oder das weather widget verwendet?

[neunteufels]

@renegade-0

Wetter Widget

[Renegade 0]

@neunteufels
OK läuft jetzt. War wirklich das Update. Nur bei der Uhr hab ich noch permanent eine Ladeanzeige.

[neunteufels]

@renegade-0

Keine Ahnung dazu, das Problem hatte ich bis jetzt nicht.

Eventuell Widget löschen, speichern und dann nochmal neu anlegen?!?

[Ceel]

Moin
Ersteinmal danke an den Ersteller von Jarvis
Sehr geile Vis!

Jetzt zu meiner Frage.

Ist es möglich wenn ein Datenpunkt sich ändert (es hat geklingelt) automatisch ein Kamerabild anzeigen zu lassen?
habe es hinbekommen das sich ein Popup öffnen mit dem Script:

var jarvisNotify = {};
//Beispiele
jarvisNotify.title = "Es hat geklingelt";
// "<b>Dies ist BOLD</b>"
jarvisNotify.message= getState('synology.0.SurveillanceStation.cameras.Eingang.linkMjpegHttpPath').val;
jarvisNotify.state = "unread";          //Damit bleibt die Benachrichtigung auch nach POPUP ungelesen und wird oben angezeigt mit der Zahl
jarvisNotify.criticality = "none";      // error,warning,info,success
jarvisNotify.display ="popup";          //drawer,snackbar,popup, none für focusTab
jarvisNotify.autoHideDuration = 180000;  //5000ms -> 5 Sekunden
jarvisNotify.snackbarOrigin = {};       //"snackbarOrigin": { "horizontal": "...", "vertical": "" }, 
                                        // optional, applies when display is snackbar, { horizontal: 'center' | 'left' | 'right', vertical: 'bottom' | 'top' }
jarvisNotify.icon = "bell-ring-outline"; //mdi Iconify
jarvisNotify.iconColor = "#5D5DED";
jarvisNotify.backgroundColor = "black";
jarvisNotify.fontColor = "white";
jarvisNotify.focusTab = ""; //focus a certain tab
setState('jarvis.0.addNotification',JSON.stringify(jarvisNotify));

leider wird das Bild der Kamera nicht angezeigt. Es steht im Popup nur der html Link.