Navigation

    Logo
    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Unread
    • Categories
    • Unreplied
    • Popular
    • GitHub
    • Docu
    • Hilfe
    1. Home
    2. Русский
    3. ioBroker
    4. Визуализация
    5. ioBroker.vis Драйвер
    6. Написание своего виджета

    NEWS

    • Neuer Blog: Fotos und Eindrücke aus Solingen

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

    • ioBroker goes Matter ... Matter Adapter in Stable

    Написание своего виджета

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

      Пытаюсь написать виджет.

      В виджете есть код.

      Почему вподставляется значение <%= this.data.attr('oid') %>

      А в

      <canvas id="<%= this.data.attr('oid') %>" ставится/!/!/?/Код/вроде/идентичный./(В/width="<%==this.data.attr('dialog_width')%>" аналогично)<br="">````

                  <%== this.data.attr("html_prepend") %>
      

      <canvas id="<%= this.data.attr('oid') %>" width="<%==this.data.attr('dialog_width')%>" height="100%"></canvas>

      <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>

      В элемент
      
      <canvas id="<%= this.data.attr('oid') %>" потом/скриптом/вставляются/данные<br="">
      Как в скрипте присвоить занчения из переменных виджета?
      </canvas>
      
      </canvas>
      1 Reply Last reply Reply Quote 0
      • Bluefox
        Bluefox last edited by

        @instalator:

        Пытаюсь написать виджет.

        В виджете есть код.

        Почему вподставляется значение <%= this.data.attr('oid') %>

        А в

        <canvas id="<%= this.data.attr('oid') %>" ставится/!/!/?/Код/вроде/идентичный./(В/width="<%==this.data.attr('dialog_width')%>" аналогично)<br="">````

                    <%== this.data.attr("html_prepend") %>
        

        <canvas id="<%= this.data.attr('oid') %>" width="<%==this.data.attr('dialog_width')%>" height="100%"></canvas>

        <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>

        В элемент
        
        <canvas id="<%= this.data.attr('oid') %>" потом/скриптом/вставляются/данные<br="">
        Как в скрипте присвоить занчения из переменных виджета?
        </canvas>
        
        </canvas> `  
        

        По моему браузер пытается на каждом этапе отрисовать canvas.

        Я обошёл эту проблему так:

        <%== this.data.attr("html_prepend") %><%
        var canvas = '
        
        <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
        
        ';
        <%== canvas %>
        <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
        
        

        То есть сначала полностью собрать canvas тег, а потом его за раз отрисовать.

        1 Reply Last reply Reply Quote 0
        • I
          instalator last edited by

          @Bluefox:

          По моему браузер пытается на каждом этапе отрисовать canvas.

          Я обошёл эту проблему так:

          <%== this.data.attr("html_prepend") %><%
          var canvas = '
          
          <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
          
          ';
          <%== canvas %>
          <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
          
          

          То есть сначала полностью собрать canvas тег, а потом его за раз отрисовать. `
          <%== canvas %> Должен вывести переменную? у меня ничего не выводится

          1 Reply Last reply Reply Quote 0
          • I
            instalator last edited by

            Вообщем все печально, я вообще въехать не могу как добавить виджет, запутался в коде.

            Еще и index.html и edit.html не пересоздаются каждый раз.

            Приходится редактировать виджет в файлах index.html и edit.html.

            Хотел добавить вот такой виджет http://www.3quarks.com/en/SegmentDisplay/

            Может кто возьмется или объяснит на пальцах, что и как устроено в коде vis

            Все что удалось это тупо вывести значение переменной…
            6305_flot_arbeit.png
            6305_flot_bad_gross.png
            6305_flot_bad_klein.png
            6305_flot_zimmer3.png
            6305_flot_zimmer2.png
            6305_flot_zimmer1.png
            6305_flot_eg.png
            6305_flot_lueftung.png
            6305_flot_aussen.png

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

              @instalator:

              @Bluefox:

              По моему браузер пытается на каждом этапе отрисовать canvas.

              Я обошёл эту проблему так:

              <%== this.data.attr("html_prepend") %><%
              var canvas = '
              
              <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
              
              ';
              <%== canvas %>
              <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
              
              

              То есть сначала полностью собрать canvas тег, а потом его за раз отрисовать. <%== canvas %> Должен вывести переменную? у меня ничего не выводится
              Я забыл указать закрывающую скобку

              <%== this.data.attr("html_prepend") %><%
              var canvas = '
              
              <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
              
              ';
              %>
              <%== canvas %>
              <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
              
              

              или так

              <%== this.data.attr("html_prepend") %><%
              <%== '
              
              <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
              
              ' %>
              <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
              
              
              1 Reply Last reply Reply Quote 0
              • I
                instalator last edited by

                @Bluefox:

                Я забыл указать закрывающую скобку

                <%== this.data.attr("html_prepend") %><%
                var canvas = '
                
                <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
                
                ';
                %>
                <%== canvas %>
                <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
                
                

                или так

                <%== this.data.attr("html_prepend") %><%
                <%== '
                
                <canvas id="' + this.data.attr('oid') +'" width="' + this.data.attr('dialog_width') +'" height="100%"></canvas>
                
                ' %>
                <%== (parseFloat(vis.binds.basic.formatFloat(this.data)) == 1 ? this.data.attr("html_append_singular") : this.data.attr("html_append_plural")) %>
                
                ```` `  
                

                Хорошо, а как в script засунуть параметры виджета? и чтобы потом в '

                <canvas id="…" отобразить/с/определенными/параметрами?/Вообще/как/из/виджета/можно/выполнить/код/js?</r=""></canvas>

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

                  Например````
                  vis.binds.basic.formatFloat

                  и есть код JS.
                  [6305_flot_lueftung.png](/assets/uploads/files/6305_flot_lueftung.png)
                  1 Reply Last reply Reply Quote 0
                  • I
                    instalator last edited by

                    @Bluefox:

                    Например````
                    vis.binds.basic.formatFloat

                    и есть код JS. `  
                    

                    т.е. это мы вызываем функуию formatFloat а это типо ветки с функциями vis.binds.basic.?

                    Что означают эти скобки <%== ? <% или <%= и <%== в чем разница?

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

                      @instalator:

                      @Bluefox:

                      Например````
                      vis.binds.basic.formatFloat

                      и есть код JS. `  
                      

                      т.е. это мы вызываем функуию formatFloat а это типо ветки с функциями vis.binds.basic.? `
                      Всё верно.
                      @instalator:

                      Что означают эти скобки <%== ? <% или <%= и <%== в чем разница? `
                      Это синтаксис CanJS-EJS (Описание http://canjs.com/guides/EJS.html)

                      <%== - вывод HTML текста без изменнений в это место

                      <%= - вывод текста (все теги будут преобразованы - escaped)

                      <% выполняет написанный JS код

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

                        Можешь вот здесь посмотреть, как можно было встраивать:

                        https://github.com/ioBroker/ioBroker.vi … ather.html

                        Ищи tplSegmentClock: function (el, data)
                        48_clock.gif

                        1 Reply Last reply Reply Quote 0
                        • I
                          instalator last edited by

                          @Bluefox:

                          Это синтаксис CanJS-EJS (Описание http://canjs.com/guides/EJS.html)

                          <%== - вывод HTML текста без изменнений в это место

                          <%= - вывод текста (все теги будут преобразованы - escaped)

                          <% выполняет написанный JS код `
                          Да это просто магия) Буду дальше вникать… Спасибо.

                          @Bluefox:

                          Можешь вот здесь посмотреть, как можно было встраивать:

                          https://github.com/ioBroker/ioBroker.vi … ather.html

                          Ищи tplSegmentClock: function (el, data) `
                          😮 час и готово?) я два вечера разобраться не мог.

                          1 Reply Last reply Reply Quote 0
                          • I
                            instalator last edited by

                            Добавил себе, часы почему то не работают, да они и не нужны были, переменную отображает, теперь окно управления нагревателем выглядит как оригинальная панель управления)

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

                              Часы поправил.

                              Вот только недавно хотел написать в форум вопрос о хороших цифровых часах. А тут ты со ссылкой.

                              Поэтому я так быстро встроил.

                              Если ещё какие-нибудь виджеты найдёшь, говори. 😉

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

                                Тоже неплохо выглядит http://www.3quarks.com/en/SVGClock/index.html

                                1 Reply Last reply Reply Quote 0
                                • I
                                  instalator last edited by

                                  @Bluefox:

                                  Если ещё какие-нибудь виджеты найдёшь, говори. 😉 `
                                  Не совсем готовые виджеты, интересная библиотечка, выбор дат и т.п. можно организовать

                                  http://demo.mobiscroll.com/select/basic/

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

                                  Support us

                                  ioBroker
                                  Community Adapters
                                  Donate

                                  408
                                  Online

                                  31.8k
                                  Users

                                  80.0k
                                  Topics

                                  1.3m
                                  Posts

                                  2
                                  15
                                  2954
                                  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