Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Deutsch
    3. Visualisierung
    4. Vis / JavaScript

    NEWS

    • ioBroker@Smart Living Forum Solingen, 14.06. - Agenda added

    • ioBroker goes Matter ... Matter Adapter in Stable

    • Monatsrückblick - April 2025

    Vis / JavaScript

    This topic has been deleted. Only users with topic management privileges can see it.
    • Bluefox
      Bluefox last edited by

      @diablolot:

      hallo BlueFox,

      vielen, vielen Dank! funktioniert bestens! Sound ist implementiert. 😉

      Super Produkt, danke!

      Viele Grüße

      Mike `
      Das ist ein gutes Beispiel. Kannst du vielleicht dein Projekt hier https://iobroker.net:8080 zeigen?

      1 Reply Last reply Reply Quote 0
      • ruhr70
        ruhr70 last edited by

        ja, bitte.

        Mir fehlt noch die Vorstellungskraft, wofür das gut sein soll.

        1 Reply Last reply Reply Quote 0
        • D
          diablolot last edited by

          @Blue-Fox: Mache ich gerne, ist aber im Prinzip "nur" eine LCARS-Adaption - dann halt auch mit Sound.

          @ruhr70: Ich nutze dies um Sounds bei Eingaben, z.B. Druck eines Buttons, Alarm, etc. auszulösen, ich finde das "netter". 🙂

          1 Reply Last reply Reply Quote 0
          • ruhr70
            ruhr70 last edited by

            verstehe ich 🙂

            kannst Du bitte einen Beispielbutton von Dir als JSON exportieren?

            Gesendet von iPhone mit Tapatalk

            1 Reply Last reply Reply Quote 0
            • D
              diablolot last edited by

              Klar. Gerne.

              [{"tpl":"tplLcarsButtonToggle","data":{"hm_id":"23707","digits":"","factor":1,"min":0,"max":1,"step":0.01,"width":"230","color_default":"blue","color_active":"orange","title":"auto","visibility-cond":"==","visibility-val":1,"subtitle":"","subtitle_show":"none","oid":"hm-rega.0.13984","rounded":"left"},"style":{"left":205,"top":446,"width":150},"widgetSet":"lcars"}]
              

              dazu dann das JS in einem basic-HHTML-Widget.

              1 Reply Last reply Reply Quote 0
              • ruhr70
                ruhr70 last edited by

                Ok, danke 🙂

                Ich höre nicht, da mir das mp3 Verzeichnis unter lcars fehlt.

                Werde dann mal Sounds da rein kopieren. Wird sich dann aber nicht so anhören, wie von Dir gedacht 😉

                1 Reply Last reply Reply Quote 0
                • ruhr70
                  ruhr70 last edited by

                  Wirklich cool 🙂 🙂

                  Ich höre "nur" einen Sound beim anklicken des Buttons, bei jedem Zustandswechsel.

                  Welcher der Elemente (2) oder (3) ist denn dafür zuständig?

                  Oder braucht man dazu (2) und (3).

                  Und wann kommt (1) zum Tragen?

                  (1)
                  @diablolot: `

                  1 Reply Last reply Reply Quote 0
                  • D
                    diablolot last edited by

                    Hallo ruhr70,

                    vorab: das mp3-Verzeichnis habe ich angelegt. kannst du auch anderweitig einbinden. hier bekommst du coole LCARS-Sounds: http://www.trekcore.com/audio/

                    ich habe folgende Widgets, davon dann halt mehrere.

                    1. Haupt-Navigation

                    [{"tpl":"tplLcarsHtmlNav","data":{"hm_id":65535,"digits":"","factor":1,"min":0,"max":1,"step":0.01,"color_default":"orange","color_active":"orange","html":"Übersicht","nav_view":"LCars-Start","visibility-cond":"==","visibility-val":1,"class":"lcars-mainnav","name":"Uebersicht","views":["LCars-Beleuchtung","LCars-Wetter","LCars-Heizung"]},"style":{"left":0,"top":52,"width":"156px","height":"43px","font-size":"40px","text-align":"right","z-index":"10"},"widgetSet":"lcars"}]
                    
                    

                    über JavaScript 1 wird dann an die Click-Funktion über die CSS-Klasse .vis-widget.lcars-mainnav die Aktion gebunden. Bei 1 tausche ich dann auf computerbeep_5.mp3.

                    2. Button Typ1 "Standard Button"

                    [{"tpl":"tplLcarsButtonToggle","data":{"hm_id":"10970","digits":"","factor":1,"min":0,"max":1,"step":0.01,"width":"230","color_default":"blue","color_active":"orange","title":"Anwesend","visibility-cond":"==","visibility-val":1,"subtitle":"","oid":"hm-rega.0.950","rounded":"none"},"style":{"left":357,"top":413,"width":150,"text-align":"","font-style":"normal"},"widgetSet":"lcars"}]
                    
                    

                    über JavaScript 2 wird dann an die Click-Funktion über die CSS-Klasse .vis-widget.vis-lcars die Aktion gebunden. Bei 2 tausche ich dann auf computerbeep_4.mp3.

                    3. Button Typ3 "Radio Buttons"

                    [{"tpl":"tplJquiRadioSteps","data":{"hm_id":"3713","digits":"","factor":1,"min":0,"max":"100","step":0.01,"filterkey":"Innenbeleuchtung","visibility-cond":"==","visibility-val":1,"oid":"hm-rpc.0.JEQ0207333.1.LEVEL"},"style":{"left":"357px","top":303,"font-family":"lcars_font","background-color":"rgb(0, 0, 0)","height":"38px","text-align":"start","background-position":"0% 0%","padding":"0px","z-index":"1","width":""},"widgetSet":"jqui"}]
                    
                    

                    über JavaScript 3 wird dann an die Click-Funktion über die CSS-Klasse .ui-button die Aktion gebunden. Bei 3 tausche ich dann auch auf computerbeep_4.mp3. (werde ich aber noch ändern)

                    Ich hoffe ich konnte etwas aufhellen. 🙂

                    1 Reply Last reply Reply Quote 0
                    • ruhr70
                      ruhr70 last edited by

                      Konntest Du :!: 😄

                      Danke Dir!

                      Ich hatte die Verbindung zwischen dem Code und dem Widget nicht gesehen. Dank Deiner Erklärung, habe ich nun verstanden, dass dies über die CS-Klasse erfolgt, die im Widget eingestellt wird (bei der Navigation: lcars-mainnav).

                      Bei den anderen Buttons sehe ich allerdings keine Verknüpfung zu '.vis-widget.vis-lcars'. :?:

                      Müsste da nicht in der CSS-Klasse 'vis-lcars' stehen?

                      Sie piepen aber trotzdem 😉

                      1 Reply Last reply Reply Quote 0
                      • D
                        diablolot last edited by

                        Super.

                        Ich hatte noch einen Fehler im Beitrag, habe ich geändert. 1) ist ja gebunden an vis-widget.lcars-mainnav. Daher funktioniert es dann. Du kannst die Klasse aber frei wählen und dann über das Widget einstellen.

                        1 Reply Last reply Reply Quote 0
                        • Thisoft
                          Thisoft last edited by

                          Hallo,

                          muss mich auch mal hier ranhängen. Ich wollte jetzt auch mal sowas probieren. habe dazu den folgenden Code in ein Basic-HTML-Widget eingefügt:

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

                          Support us

                          ioBroker
                          Community Adapters
                          Donate

                          930
                          Online

                          31.7k
                          Users

                          79.7k
                          Topics

                          1.3m
                          Posts

                          4
                          14
                          5541
                          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