Ankündigung

Einklappen
Keine Ankündigung bisher.

Szenen-Widget mit Aktivstatus

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    Szenen-Widget mit Aktivstatus

    Liebe smartVISU'ler,

    nachdem ich mein Szenenlogik-Problem im 'smarthome.py'-Unterforum in den zugehörigen Thread gelöst hatte, habe ich mich an die Visu gemacht. Hier nun das Resultat:

    Leider war das auch nicht so einfach, da basic.buttom keine Symboländerung (Rückmeldung) kann und basic.dual, der die Symboländerung beherrscht, dann aber zwei Werte, den eigentlichen Szenenwert und den Dummy-Szenen-Wert senden möchte. Musste also beide Code-Welten verheiraten. basic.multistate ist zwar auch zum Umschalten geeignet, allerdings wenn man an eine hintere Szene will, muss man alles vorher aktivieren/durchleben, sind Rolladen oder Jalousien mit in der Szene gehts gar nicht und selbst bei Lampen will man das Hin- und Her nicht.

    So sieht es nun aus: scenebutton.jpg


    Der passende Aufruf dazu so:
    Code:
    {{ mydevice.scenes('szene', 'Szene', [1, 2, 31, 4, 19, 6], 0 , ['scene_day.svg', 'scene_night.svg', 'scene_livingroom.svg', 'scene_party.svg', 'scene_sleeping.svg', 'light_light_dim_100.svg' ] ) }}
    Als Code unter dem Unterordner widgets ist es nur HTML, bei mir steht alles selbstkreiertes in der Datei mydevice.html, hier der entsprechende Ausschnitt dieser Datei:
    Code:
    /*
     * scenebutton
     *
     * @param unique id for this widget
     * @param a numeric item for the scene number
     * @param pic as the icon for this button
     * @param vals as a list of scene numbers behind foreign buttons
     * @param val as the scene number for this button,
     * @param zeroval as dummy scene number for inactive scenes
     * @param type: 'micro', 'mini', 'midi' (optional, default: 'mini')
     * @param col_on is the color for the on state of the button (optional, defautl: 'icon1')
     * @param orientation of the controlgroup
     */
    
    {% macro scenebutton(id, item, pic, vals, val, zeroval, type, col_on ) %}
            {% import   "basic.html" as basic %}
    
            <a id="{{ uid(page, id) }}" data-widget="basic.button" data-item="{{ item }}" data-val="{{ val }}"
                    class="ui-{{ type|default('midi') }}" data-role="button" data-inline="true"
                    data-iconpos="center">
               {{ basic.symbol(id|_('s')|_(val~'-'~zeroval), item, '', pic, zeroval) }}
               {% for i in vals %}
                 {% if ( i == val ) %}
                   {{ basic.symbol(id|_(val~'-'~i), item, '', pic, val, 'or', col_on|default('icon1') ) }}
                 {% else %}
                   {{ basic.symbol(id|_(val~'-'~i), item, '', pic, i) }}
                 {% endif %}
               {% endfor %}
            </a>
    {% endmacro %}
    
    /*
     * scenes()
     *
     * @param unique id for this widget
     * @param a numeric item for the scene number
     * @param vals as a list of scene numbers for every button
     * @param zeroval as dummy scene number for inactive scenes
     * @param pics as a list of icons for every button
     * @param type: 'micro', 'mini', 'midi' (optional, default: 'mini')
     * @param orientation of the controlgroup (optional, default: 'horizontal')
     * @param col_on is the color for the on state of the buttons (optional, default: 'icon1')
     */
    
    {% macro scenes(id, gad_scene, vals, zeroval, pics, type, orientation, col_on ) %}
        {% import _self as mydevice %}
    
        <div class="basic">
          <span data-role="controlgroup" data-type="{{ orientation|default('horizontal') }}">
            {% for i in 0..(vals|length - 1) %}
              {{ mydevice.scenebutton(id|_(vals[i]), gad_scene, pics[i], vals, vals[i], zeroval|default('0'), type|default('midi'), col_on|default('icon1') ) }}
            {% endfor %}
          </span>
        </div>
    {% endmacro %}
    Wer es ausprobieren möchte, viel Spaß dabei. Anregungen sind auch gerne willkommen.

    Viele Grüße,

    Ralf
    Zuletzt geändert von ralf9000; 03.03.2017, 18:23.

    #2
    Hallo Ralf,
    ich hab das Widget ausprobiert. Szenen-Wahl kann man damit schnell und einfach realisieren.
    Mit SmartVISU 2.9 funktioniert das Umschalten jedoch nicht, Der Szene-Status wird richtig angezeigt, jedoch passiert beim Klicken nichts..
    mit SmartVISU 2.8 alles OK.

    Gruß Ivan

    Kommentar


      #3
      Zitat von ivande Beitrag anzeigen
      Mit SmartVISU 2.9 funktioniert das Umschalten jedoch nicht
      SmartVISU 2.9 habe ich leider nicht installiert. Was funktioniert genau nicht, werden die Icons nicht auf 'icon1' umgesetzt, oder wird nichts zum Backend (z.B. smarthome.py) geschickt? Könnte evtl. die Längenfunktion für die Listen sein ...

      Grüße, Ralf.


      Kommentar


        #4
        Die aktuelle Szene wird richtig angezeigt. Wenn ich die Szene z.B. über Taster ändere, wird das richtige Icon in Farbe dargestellt. Klicke ich (mit Maus oder Finger) auf eines der Icons, zum Umschalter der Szene über SmartVISU sowird nichts zu SH geschickt.



        Kommentar


          #5
          Wenn ich in der Demo-Seite "basic.button" (SmartVISU 2.9) den Quelltext ansehe:

          HTML-Code:
          <span data-role="controlgroup" data-type="horizontal">  
              <a id="widget_basic_button-cg21" data-widget="basic.button" data-item="bath.light.switch" data-val="1"
                  class="ui-btn ui-mini ui-btn-corner-all ui-btn-inline ui-shadow ui-nodisc-icon ui-btn-icon-top ui-icon-plus">Up</a>
              <a id="widget_basic_button-cg22" data-widget="basic.button" data-item="bath.light.switch" data-val="0"
                  class="ui-btn ui-mini ui-btn-corner-all ui-btn-inline ui-shadow ui-nodisc-icon ui-btn-icon-top ui-icon-minus">Down</a>
              <a id="widget_basic_button-cg23" data-widget="basic.dual" data-item="bath.light.switch"
                  data-val-on="1" data-val-off="0"
                  class="ui-btn ui-mini ui-btn-corner-all ui-btn-inline ui-shadow">
                      <img id="widget_basic_button-cg23-off" class="icon " src="icons/ws/control_arrow_down.svg">
                      <img id="widget_basic_button-cg23-on" class="icon icon1 hide" src="icons/ws/control_arrow_up.svg">
              </a>
                  </span>
          ich habe dann versucht dein Widget ein wenig anzupassen, jedoch reagiert es immer noch nicht auf Klicks auf die Icons..

          HTML-Code:
          <a id="{{ uid(page, id) }}" data-widget="basic.button" data-item="{{ item }}" data-val="{{ val }}"
              class="ui-btn ui-{{ type|default('midi') }} ui-btn-corner-all ui-btn-inline ui-shadow">

          Kommentar


            #6
            Guck mal in der 2.9er Distribution auf dem Hauptverzeichnus ('/var/www/smartvisu/') in die Datei 'basic.html' und such dort bitte das Macro button. Da müsste dann etwas gegenüber 2.8 sich geändert haben. In 2.8 stand da
            Code:
            <a id="{{ uid(page, id) }}" data-widget="basic.button" data-item="{{ item }}" data-val="{{ val|default('1') }}"
                            class="ui-{{ type|default('mini') }}" data-role="button" data-inline="true"
            Das habe ich einfach übernommen und das ist für die Button-Funktionalität zuständig. Die Symbole sind ja nur Kosmetik. Wenn da nun etwas anderes in 2.9 steht, müsstes Du das nachziehen ...

            Grüße, Ralf
            Zuletzt geändert von ralf9000; 04.03.2017, 16:04.

            Kommentar


              #7
              basic.button wurde / wird ersetzt mit stateswitch..

              Code:
              /**
              * A versatile button/switch
              * (supersedes basic.button, basic.dual, basic.hiddenswitch, basic.multistate and basic.switch)
              *
              * @param unique id for this widget (optional)
              * @param a gad/item
              * @param valid types: 'micro', 'mini', 'midi', 'icon' (optional, default: mini)
              * @param array of values (optional, default [0,1])
              * @param array of icons (optional, default: control_on_off.svg)
                  dynamic icons can be used, e.g. icon.light('', '', value_item); please note: these must not be wrapped by apostrophs (')
                  Hint: Use 'none' to display text only
              * @param array of texts (optional)
              * @param array of colors; 'icon1' or e. g. '#f00' for red or 'hidden' to not diplay (optional, default: icon0)
              *
              * [USER="30828"]see[/USER] design/design_icons#Icons
              *
              * @author Stefan Widmer
              * [USER="25162"]info[/USER] Based on work of Martin GLEISS and Pierre-Yves KERVIEL
              */
              {% macro stateswitch(id, item, type, value, icon, text, color) %}
                  {% import _self as basic %}
              
                  {% set value = (value|default([0,1]) is iterable ? value|default([0,1]) : [value]) %}
                  {% set color = color|default(['','icon1']) %}
              
                  <span{% if not id is empty %} id="{{ uid(page, id) }}"{% endif %} data-widget="basic.stateswitch" data-item="{{ item }}"
                      data-value="{{ value|first }}" data-vals="{{ implode(value) }}"
                      style="display: none; !important">
                  {% for val in value %}
                      {% set pic = (icon is iterable ? icon[loop.index0] : icon)|deficon('control_on_off.svg') %}
                      {% set pic = pic != 'none' ? pic %} /** set pic to empty if it is 'none' */
                      {% set col = (color is iterable ? color[loop.index0] : color)|default('') %}
                      {% set txt = (text is iterable ? text[loop.index0] : text)|default('') %}
                  <a data-widget="basic.stateswitch" data-val="{{ val }}" data-index="{{ loop.index0 }}" {{ col == 'hidden' ? 'style="visibility: hidden;"'|raw : col != 'icon1' and col != 'icon0' and not col is empty ? ('style="color: ' ~ col ~ ';"')|raw }} class="{{ col == 'icon1' ? 'icon1 ' }}
                          {%- if type == 'icon' -%} /**- display as icon -*/
                              switch ui-link
                          {%- else -%} /**- display as button -*/
                              ui-btn ui-{{ type|default('mini') }} ui-corner-all ui-btn-inline
                          {%- endif -%}
                              {%- if pic is empty -%}
                                  ">
                              {%- else -%}
                                  {{ txt ? ' ui-btn-icon-top' : '' }} ui-nodisc-icon">{{ basic._icon(pic, col) }}
                              {%- endif -%}
                          {{- txt|e -}}
                      </a>
                {% endfor %}
                <a class="ui-btn" style="display: none !important"></a> /** placeholder for last moved control */
                </span>
              
              {% endmacro %}

              Kommentar


                #8
                Zitat von ivande Beitrag anzeigen
                basic.button wurde / wird ersetzt mit stateswitch.
                Dann wird es das sein, er kennt die alte Methode nicht mehr, das muss also analog umgesetzt werden. Ich kann momentan leider nicht testen, habe kein 2.9 installiert. Muss mal sehen, wann ich Zeit dafür finde ...

                Grüße, Ralf

                Kommentar


                  #9
                  bei mir läuft das Widget nun testweise auf SmartVISU 2.9
                  das macro scenebutton wird gar nicht mehr benötigt.

                  Gruß Ivan

                  HTML-Code:
                  /*
                   * scenes()
                   *
                   * @param unique id for this widget
                   * @param a numeric item for the scene number
                   * @param vals as a list of scene numbers for every button
                   * @param zeroval as dummy scene number for inactive scenes
                   * @param pics as a list of icons for every button
                   * @param type: 'micro', 'mini', 'midi' (optional, default: 'midi')
                   * @param orientation of the controlgroup (optional, default: 'horizontal')
                   * @param col_on is the color for the on state of the buttons (optional, default: 'icon1')
                   */
                  
                  {% macro scenes(id, gad_scene, vals, zeroval, pics, type, orientation, col_on ) %}
                      {% import   "basic.html" as basic %}
                  
                      <div class="basic">
                        <span data-role="controlgroup" data-type="{{ orientation|default('horizontal') }}">
                          {% for i in 0..(vals|length - 1) %}
                              {{basic.stateswitch(id|_(vals[i]), gad_scene, type|default('midi'), [vals[i], zeroval], pics[i], '', [col_on|default('icon1'), ''])}}
                          {% endfor %}
                        </span>
                      </div>
                  {% endmacro %}
                  will man die Szenen-Nummer auf den Button als Text ausgeben, dann kann man die basic.stateswitch ein wenig ändern:

                  HTML-Code:
                  {{basic.stateswitch(id|_(vals[i]), gad_scene, type|default('midi'), [vals[i], zeroval], pics[i], vals[i], [col_on|default('icon1'), ''])}}

                  Kommentar


                    #10
                    SmartVISU 2.9

                    Beim linken Button "verschwindet" an den Ecken die Rundung, sobald dieser Button nicht mehr aktiv ist.

                    Button Links aktiv - Rundung OK SzenenWidget2.jpg



                    Button Links nicht aktiv - Rundung nicht OK SzenenWidget1.jpg



                    Code:
                    {{ mydevice.scenes(id~'scenes', 'Dg.Bad.Szene', [1, 10, 11, 12, 13, 14, 15], 1, ['light_light_dim_00.svg', 'scene_night.svg', 'scene_day.svg', 'scene_shower.svg', 'scene_toilet_alternat.svg', 'light_mirror.svg', 'scene_bath.svg'] ) }}
                    Gruß Ivan
                    Zuletzt geändert von ivande; 05.03.2017, 08:34.

                    Kommentar


                      #11
                      Zitat von ivande Beitrag anzeigen
                      das macro scenebutton wird gar nicht mehr benötigt.
                      Hallo Ivan,

                      ohne es austesten zu können, der Code sieht so aus, das durch die Angabe [vals[i], zeroval] bei basic.stateswitch nun basic.stateswitch auch Nullen ("zeroval") sendet. Das sollte nicht sein, bei der Umschaltung der Szenen, sollten nur die "richtigen" Szenennummern gesendet werden. Kannst Du das mal prüfen?

                      Das war ja der Sinn der Funktion szenebutton, nur die Ein-Werte zu senden (alte basic.button Funktionalität), die Icons aber trotzdem auf die anderen Werte reagieren zu lassen. Die Buttons selber dürfen niemals Nullen ("zeroval") senden, das muss durch das Backend smarthome.py kommen.

                      Grüße, Ralf.

                      Kommentar


                        #12
                        zeroval wird gesendet wenn man auf den derzeitig aktiven Button klickt.. also den aktiven Button "ausschaltet"

                        bei mir läuft SmartVISU 2.8, nur die neuen Entwicklungen mache ich auf 2.9.

                        man kann mehrere Visu's / bzw. Versionen Parallel laufel lassen..

                        dazu hab ich mir einfach in /var/www/html/smartVISUdev angelegt und dort 2.9 reinkopiert..

                        Kommentar


                          #13
                          Zitat von ivande Beitrag anzeigen
                          zeroval wird gesendet wenn man auf den derzeitig aktiven Button klickt.. also den aktiven Button "ausschaltet"
                          Dann ist die Hautpfunktionalität meines Widgets verloren gedanken, es darf "die Szene nicht ausgeschaltet werden". Der Status zeroval ist nur für die Anzeige gewesen, nicht für eine Button-Funktionalität. Das war der Sinn und hat eine Implementation erst notwendig gemacht. Das andere wäre immer über basic.dual auch gegangen.
                          Aber warum will man per Hand eine Szene auf ungültig schalten, wo sie evtl. ja in der realen Welt aktiv ist, also keine Änderung an allen beteiligten Parametern stattgefunden hat? Das macht keinen Sinn. Mein Widgetansatz läßt das nicht zu.

                          Ralf.
                          Zuletzt geändert von ralf9000; 05.03.2017, 13:01.

                          Kommentar


                            #14
                            .... so, hab jetzt mal ne VM mit smartVISU 2.9 hochgezogen, so müsste es unter 2.9 funktionieren, ganz habe ich es aber noch nicht getestet:

                            Code:
                            /*
                             * scenebutton
                             *
                             * @param unique id for this widget
                             * @param a numeric item for the scene number
                             * @param pic as the icon for this button
                             * @param vals as a list of scene numbers behind foreign buttons
                             * @param val as the scene number for this button,
                             * @param zeroval as dummy scene number for inactive scenes
                             * @param type: 'micro', 'mini', 'midi' (optional, default: 'mini')
                             * @param col_on is the color for the on state of the button (optional, defautl: 'icon1')
                             * @param orientation of the controlgroup
                             */
                            
                            {% macro scenebutton(id, item, pic, vals, val, zeroval, type, col_on ) %}
                                    {% import   "basic.html" as basic %}
                            
                                    <span{% if not id is empty %} id="{{ uid(page, id) }}"{% endif %} data-widget="basic.stateswitch" data-item="{{ item }}"
                                            data-value="{{ [val]|first }}" data-vals="{{ val }}" data-indicator-type="{{ '' }}" data-indicator-duration="{{ config_indicator_duration|default(3) }}"
                                            style="display: none; !important">
                            
                                    <a data-widget="basic.stateswitch"  data-item="{{ item }}" data-val="{{ [val] }}" data-index="{{ 0 }}" data-col="{{ ['icon0'] }}"
                                        class="ui-btn ui-{{ type|default('mini') }} ui-nodisc-icon ui-corner-all ui-btn-inline">
                                       {{ basic.symbol(id|_('s')|_(val~'-'~zeroval), item, '', pic, zeroval) }}
                                       {% for i in vals %}
                                         {% if ( i == val ) %}
                                           {{ basic.symbol(id|_(val~'-'~i), item, '', pic, val, 'or', col_on|default('icon1') ) }}
                                         {% else %}
                                           {{ basic.symbol(id|_(val~'-'~i), item, '', pic, i) }}
                                         {% endif %}
                                       {% endfor %}
                                    </a>
                            </span>
                            {% endmacro %}
                            
                            
                            /*
                             * scenes()
                             *
                             * @param unique id for this widget
                             * @param a numeric item for the scene number
                             * @param vals as a list of scene numbers for every button
                             * @param zeroval as dummy scene number for inactive scenes
                             * @param pics as a list of icons for every button
                             * @param type: 'micro', 'mini', 'midi' (optional, default: 'mini')
                             * @param orientation of the controlgroup (optional, default: 'horizontal')
                             * @param col_on is the color for the on state of the buttons (optional, default: 'icon1')
                             */
                            
                            {% macro scenes(id, gad_scene, vals, zeroval, pics, type, orientation, col_on ) %}
                                {% import _self as mydevice %}
                            
                                <div class="basic">
                                  <span data-role="controlgroup" data-type="{{ orientation|default('horizontal') }}">
                                    {% for i in 0..(vals|length - 1) %}
                                      {{ mydevice.scenebutton(id|_(vals[i]), gad_scene, pics[i], vals, vals[i], zeroval|default('0'), type|default('mini'), col_on|default('icon1') ) }}
                                    {% endfor %}
                                  </span>
                                </div>
                            {% endmacro %}
                            Grüße, Ralf.

                            Kommentar


                              #15

                              Wozu soll den "zeroval" gut sein, das hab ich nocht nicht verstanden?

                              Kommentar

                              Lädt...
                              X