Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. [Showcase] Jarvis - just another remarkable vis

    NEWS

    • [erledigt] 15. 05. Wartungsarbeiten am ioBroker Forum

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    [Showcase] Jarvis - just another remarkable vis

    This topic has been deleted. Only users with topic management privileges can see it.
    • W
      WW1983 @Bloody last edited by

      @Bloody Hey

      Ich habe das „Theme“ manuell hinzugefügt und angepasst. So sieht meine Einstellungsebene im Expertenmodus aus.

      
      {
         "_isTablet": true,
         "params": "{\"socketPort\":\"8082\",\"socketSecure\":\"false\"}",
         "theme": {
            "palette": {
               "common": {
                  "black": "#000",
                  "white": "#fff"
               },
               "type": "dark",
               "primary": {
                  "light": "#4dd0e1",
                  "main": "#4dd0e1",
                  "dark": "#4dd0e1",
                  "contrastText": "#fff"
               },
               "secondary": {
                  "light": "#f9a825",
                  "main": "#f9a825",
                  "dark": "#f9a825",
                  "contrastText": "#fff"
               },
               "error": {
                  "light": "#e57373",
                  "main": "#f44336",
                  "dark": "#d32f2f",
                  "contrastText": "#fff"
               },
               "warning": {
                  "light": "#ffb74d",
                  "main": "#ff9800",
                  "dark": "#f57c00",
                  "contrastText": "rgba(0, 0, 0, 0.87)"
               },
               "info": {
                  "light": "#64b5f6",
                  "main": "#2196f3",
                  "dark": "#1976d2",
                  "contrastText": "#fff"
               },
               "success": {
                  "light": "#81c784",
                  "main": "#4caf50",
                  "dark": "#388e3c",
                  "contrastText": "rgba(0, 0, 0, 0.87)"
               },
               "grey": {
                  "50": "#fafafa",
                  "100": "#f5f5f5",
                  "200": "#eeeeee",
                  "300": "#e0e0e0",
                  "400": "#bdbdbd",
                  "500": "#9e9e9e",
                  "600": "#757575",
                  "700": "#616161",
                  "800": "#424242",
                  "900": "#212121",
                  "A100": "#d5d5d5",
                  "A200": "#aaaaaa",
                  "A400": "#303030",
                  "A700": "#616161"
               },
               "text": {
                  "primary": "#fff",
                  "secondary": "rgba(255, 255, 255, 0.7)",
                  "disabled": "rgba(255, 255, 255, 0.5)"
               },
               "hint": "rgba(255, 255, 255, 0.5)",
               "icon": "rgba(255, 255, 255, 0.5)",
               "divider": "rgba(255, 255, 255, 0.12)",
               "background": {
                  "paper": "#1f1f1f",
                  "default": "#171717"
               },
               "action": {
                  "active": "#fff",
                  "hover": "rgba(255, 255, 255, 0.08)",
                  "hoverOpacity": "0.08",
                  "selected": "rgba(255, 255, 255, 0.16)",
                  "selectedOpacity": "0.16",
                  "disabled": "rgba(255, 255, 255, 0.3)",
                  "disabledBackground": "rgba(255, 255, 255, 0.12)",
                  "disabledOpacity": "0.38",
                  "focus": "rgba(255, 255, 255, 0.12)",
                  "focusOpacity": "0.12",
                  "activatedOpacity": "0.24"
               }
            }
         },
         "language": "de-DE",
         "pageFavicon": "home-circle-outline",
         "themeColorPrimary": "cyan|300",
         "tabsHideLabels": true,
         "hideTopBarIconTitle": true,
         "themeDarkMode": true,
         "palette.background.default": "#1c1c1c",
         "palette.background.paper": "#1c1c1c",
         "themeColorSecondary": "yellow|800",
         "columnsOnSmallScreenSizes": "1",
         "sendUsageData": true,
         "configExpertMode": true,
         "configTab": "settingsRaw",
         "columnsOnMediumScreenSizes": "2"
      }
      
      

      Ob ich alles davon hätte anpassen müssen, weiß ich nicht. Kenne mich da auch nicht all zu gut aus. Habe das eher zurecht gebastelt. Problem ist, dass bei jedem Update die „Theme Einestellung“ wieder manuell hinzugefügt werden muss.

      Zu deiner zweiten Frage. Es sind States vom ioBroker Adapter. Um genauer zu sein von Proxmox. Habe die Server über einzelne virtuelle Maschinen angelegt.

      B hssteuerung C 3 Replies Last reply Reply Quote 0
      • B
        Bloody @WW1983 last edited by

        @WW1983 said in [Showcase] Jarvis - just another remarkable vis:

        @Bloody Hey

        Ich habe das „Theme“ manuell hinzugefügt und angepasst. So sieht meine Einstellungsebene im Expertenmodus aus.

        
        {
           "_isTablet": true,
           "params": "{\"socketPort\":\"8082\",\"socketSecure\":\"false\"}",
           "theme": {
              "palette": {
                 "common": {
                    "black": "#000",
                    "white": "#fff"
                 },
                 "type": "dark",
                 "primary": {
                    "light": "#4dd0e1",
                    "main": "#4dd0e1",
                    "dark": "#4dd0e1",
                    "contrastText": "#fff"
                 },
                 "secondary": {
                    "light": "#f9a825",
                    "main": "#f9a825",
                    "dark": "#f9a825",
                    "contrastText": "#fff"
                 },
                 "error": {
                    "light": "#e57373",
                    "main": "#f44336",
                    "dark": "#d32f2f",
                    "contrastText": "#fff"
                 },
                 "warning": {
                    "light": "#ffb74d",
                    "main": "#ff9800",
                    "dark": "#f57c00",
                    "contrastText": "rgba(0, 0, 0, 0.87)"
                 },
                 "info": {
                    "light": "#64b5f6",
                    "main": "#2196f3",
                    "dark": "#1976d2",
                    "contrastText": "#fff"
                 },
                 "success": {
                    "light": "#81c784",
                    "main": "#4caf50",
                    "dark": "#388e3c",
                    "contrastText": "rgba(0, 0, 0, 0.87)"
                 },
                 "grey": {
                    "50": "#fafafa",
                    "100": "#f5f5f5",
                    "200": "#eeeeee",
                    "300": "#e0e0e0",
                    "400": "#bdbdbd",
                    "500": "#9e9e9e",
                    "600": "#757575",
                    "700": "#616161",
                    "800": "#424242",
                    "900": "#212121",
                    "A100": "#d5d5d5",
                    "A200": "#aaaaaa",
                    "A400": "#303030",
                    "A700": "#616161"
                 },
                 "text": {
                    "primary": "#fff",
                    "secondary": "rgba(255, 255, 255, 0.7)",
                    "disabled": "rgba(255, 255, 255, 0.5)"
                 },
                 "hint": "rgba(255, 255, 255, 0.5)",
                 "icon": "rgba(255, 255, 255, 0.5)",
                 "divider": "rgba(255, 255, 255, 0.12)",
                 "background": {
                    "paper": "#1f1f1f",
                    "default": "#171717"
                 },
                 "action": {
                    "active": "#fff",
                    "hover": "rgba(255, 255, 255, 0.08)",
                    "hoverOpacity": "0.08",
                    "selected": "rgba(255, 255, 255, 0.16)",
                    "selectedOpacity": "0.16",
                    "disabled": "rgba(255, 255, 255, 0.3)",
                    "disabledBackground": "rgba(255, 255, 255, 0.12)",
                    "disabledOpacity": "0.38",
                    "focus": "rgba(255, 255, 255, 0.12)",
                    "focusOpacity": "0.12",
                    "activatedOpacity": "0.24"
                 }
              }
           },
           "language": "de-DE",
           "pageFavicon": "home-circle-outline",
           "themeColorPrimary": "cyan|300",
           "tabsHideLabels": true,
           "hideTopBarIconTitle": true,
           "themeDarkMode": true,
           "palette.background.default": "#1c1c1c",
           "palette.background.paper": "#1c1c1c",
           "themeColorSecondary": "yellow|800",
           "columnsOnSmallScreenSizes": "1",
           "sendUsageData": true,
           "configExpertMode": true,
           "configTab": "settingsRaw",
           "columnsOnMediumScreenSizes": "2"
        }
        
        

        Ob ich alles davon hätte anpassen müssen, weiß ich nicht. Kenne mich da auch nicht all zu gut aus. Habe das eher zurecht gebastelt. Problem ist, dass bei jedem Update die „Theme Einestellung“ wieder manuell hinzugefügt werden muss.

        Zu deiner zweiten Frage. Es sind States vom ioBroker Adapter. Um genauer zu sein von Proxmox. Habe die Server über einzelne virtuelle Maschinen angelegt.

        Super, Danke dir. Das hat mir schon mal weitergeholfen 🙂

        Hier mal grob die Umsetzung. Ist noch nicht ganz fertig.
        0D88AEE2-97DA-4950-9239-FED180695649.png B1642276-2D0A-43B3-8DA8-705BFB4F9B79.png

        W 1 Reply Last reply Reply Quote 0
        • W
          WW1983 @Bloody last edited by

          @Bloody

          Ah sehr cool! Sieht klasse aus!

          1 Reply Last reply Reply Quote 1
          • hssteuerung
            hssteuerung @WW1983 last edited by

            @WW1983 Weist du wie man die Titel der Widgaths einfärben kann?

            W 1 Reply Last reply Reply Quote 0
            • W
              WW1983 @hssteuerung last edited by

              @Bloody

              Ah sehr cool! Sieht klasse aus!

              Leider nein. Sorry

              hssteuerung 1 Reply Last reply Reply Quote 0
              • hssteuerung
                hssteuerung @WW1983 last edited by

                @WW1983 said in [Showcase] Jarvis - just another remarkable vis:

                @Bloody

                Ah sehr cool! Sieht klasse aus!

                Leider nein. Sorry

                woher weist du welche bezeichnung für welches Einfärben ist? also auch background? Komme nicht klar 😕

                W 1 Reply Last reply Reply Quote 0
                • W
                  WW1983 @hssteuerung last edited by

                  @hssteuerung

                  Ich habe nur den Hintergrund und primary und secondery Farben. Und die Positionen heißen auch entsprechend:

                  background = Hintergrund
                  primary = Hauptfarbe zB Icons usw (in meinem Fall Cyan)
                  Sacondary = taucht hier kaum auf

                  Ansonsten kenne ich mich da nicht wirklich aus. Habe mich eher durch ausprobieren ran getastet

                  hssteuerung 1 Reply Last reply Reply Quote 0
                  • hssteuerung
                    hssteuerung @WW1983 last edited by

                    @WW1983 und was ist mit error etc?

                    W 1 Reply Last reply Reply Quote 0
                    • W
                      WW1983 @hssteuerung last edited by

                      @hssteuerung

                      Habe ich nicht geändert

                      hssteuerung 1 Reply Last reply Reply Quote 0
                      • hssteuerung
                        hssteuerung @WW1983 last edited by

                        @WW1983 wo hast du das den her? bei meinen Experteneinstellungen stehen diese details garnicht drinnen

                        W 1 Reply Last reply Reply Quote 0
                        • W
                          WW1983 @hssteuerung last edited by

                          @hssteuerung in Wiki gibt es einen Link. An dem habe ich mich etwas orientiert. Dort ist auch der „Standard Theme“ definiert. https://material-ui.com/de/customization/default-theme/

                          Eigentlich wollte ich nur gezielt den Hingrund ändern. Das schien mir aber das gesamte Darktheme auszuhebeln. Also habe ich das Standardtheme genommen und Hintergrund und die zwei Farben angepasst

                          1 Reply Last reply Reply Quote 1
                          • H
                            Hohenbostler last edited by

                            @WW1983 sagte in [Showcase] Jarvis - just another remarkable vis:

                            Ob ich alles davon hätte anpassen müssen, weiß ich nicht. Kenne mich da auch nicht all zu gut aus. Habe das eher zurecht gebastelt. Problem ist, dass bei jedem Update die „Theme Einestellung“ wieder manuell hinzugefügt werden muss.
                            Zu deiner zweiten Frage. Es sind States vom ioBroker Adapter. Um genauer zu sein von Proxmox. Habe die Server über einzelne virtuelle Maschinen angelegt.

                            Moin dann will ich auch mal meine aktuelle (Jar)Vis zeigen .

                            c66b66e6-1dbf-458e-86be-dc1be593ff39-grafik.png

                            d31e5d57-a462-48a3-b95d-310c5a4cc27f-grafik.png

                            7e3ba10d-14ce-4aa1-8db2-32ae8a42a2ce-grafik.png

                            Naja habe noch ein paar mehr Seiten allerdings bin ich da noch nicht wirklich so weit das Sie sehenswert sind ;

                            W M M 3 Replies Last reply Reply Quote 1
                            • W
                              WW1983 @Hohenbostler last edited by

                              @Hohenbostler

                              Sehr cool! Gefällt mir sehr gut.

                              Wie hast du das mit der Uhr gemacht? Kannst du mir mal die Einstellungen schicken?

                              H 1 Reply Last reply Reply Quote 0
                              • H
                                Hohenbostler @WW1983 last edited by

                                @WW1983

                                Klar. Es sind zwei Widgets. Das erste nur mit Uhr.

                                468ccdcb-624d-4614-b9f9-75b846113caa-grafik.png

                                Das zweite dann nur mit Datum usw.

                                e16c8fa9-27ab-4e49-bffe-6242fe49469c-grafik.png

                                W 1 Reply Last reply Reply Quote 0
                                • amg_666
                                  amg_666 @WW1983 last edited by amg_666

                                  @WW1983 Cool, jetzt noch "Spritpreise" mit einem "t" schreiben, dann ist es nahezu perfekt 🙂

                                  Ich habe die Optik an die SpritpreisAnzeige der Tanke angepasst:

                                  1455c358-58e9-4aca-9800-7a5b4debc146-grafik.png

                                  W 1 Reply Last reply Reply Quote 0
                                  • W
                                    WW1983 @Hohenbostler last edited by

                                    @Hohenbostler cool danke!

                                    1 Reply Last reply Reply Quote 0
                                    • W
                                      WW1983 @amg_666 last edited by

                                      @amg_666 😄 stimmt! Danke für den Hinweis!

                                      Wie hast du die Anzeige angepasst?

                                      amg_666 1 Reply Last reply Reply Quote 0
                                      • amg_666
                                        amg_666 @WW1983 last edited by amg_666

                                        @WW1983 Easy, das ist einfach ein Bild vom Shell-Logo (basic-widget "image") und darunter sind 3 graue Balken mit der Beschriftung Diesel bzw E10. Da habe ich dann einfach je ein basic widget "string" drübergelegt, gelber Hintergrund und Wert aus Tankerkönig Datenpunkt, fertig.
                                        shell.txt

                                        H 1 Reply Last reply Reply Quote 1
                                        • H
                                          Hohenbostler @amg_666 last edited by

                                          @amg_666 sagte in [Showcase] Jarvis - just another remarkable vis:

                                          o (basic-widget "image") und darunter sind 3 graue Balken mit der Beschriftung Diesel bzw

                                          Das war aber ürpsrünglich mal für die normale VIS gebaut oder ? Und speichert du das so als link irgendwie ab oder wie bekommst du es in jarvis ?

                                          amg_666 1 Reply Last reply Reply Quote 0
                                          • amg_666
                                            amg_666 @Hohenbostler last edited by

                                            @Hohenbostler Ja klar, das ist über die normale vis gebaut, siehe widget export in meinem post oben

                                            hssteuerung 1 Reply Last reply Reply Quote 0
                                            • First post
                                              Last post

                                            Support us

                                            ioBroker
                                            Community Adapters
                                            Donate

                                            615
                                            Online

                                            31.6k
                                            Users

                                            79.5k
                                            Topics

                                            1.3m
                                            Posts

                                            vis
                                            81
                                            453
                                            91912
                                            Loading More Posts
                                            • Oldest to Newest
                                            • Newest to Oldest
                                            • Most Votes
                                            Reply
                                            • Reply as topic
                                            Log in to reply
                                            Community
                                            Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                            The ioBroker Community 2014-2023
                                            logo