Neues Design, ähnlich Homeserver

[stromie]

Ich bin noch dabei und bleibe auch. Hab durch den Beruf jedoch zur Zeit viel zu tun.

Grüße Stromie

[JuMi2006]

Ich hab noch einige Bugs gefunden und einiges hinzugefügt. Jetzt ist es wirklich an der Zeit für css und breitere Masse.
Wer nutzt denn jetzt noch die Quad-Visu? Sind das wirklich so wenige?
Ich hab mir mal eine Sample Seite für meine neuen Widgets gebaut. Man bekommt meiner Meinung mit wenig Code eine Umfangreiche Darstellung. Sofern man in der css der Textspalte nur noch 40% zuweist sind die Buttons auch auf unseren Smartphones noch gut zu bedienen.

Hier mal der sample.html-Code und die dargestellte Visu:

/**
 * -----------------------------------------------------------------------------
 * @package     smartVISU
 * @author      Mirko Hirsch
 * @copyright   2015
 * @license     GPL <http://www.gnu.de>
 * -----------------------------------------------------------------------------
 */

{% extends "base.html" %}
{% import "widget_list.html" as list %}
{% import "widget_visu.html" as visu %}

{% block title %}
Samples
{% endblock %}

{% block header %}
<img class="icon" src='{{ icon0 }}measure_power_meter.png'/>
{% endblock %}

{% block content %}
    
<ul data-role="listview" data-dividertheme="c" class="nw_list">
    <li data-role="list-divider">plot-popup</li>
    <div>
    <a href="#plot-popup10" data-rel="popup">plot1 ... just as textlink </a>
        <div class="nw_plot-popup" id="plot-popup10" data-role="popup">
        {{ plot.period('ptag1', 'zaehler.haushalt.verbrauch.gestern', 'avg', '1w', '', '', '', '', 'Haushalt', '#aa0', 'area', '', '') }}
        </div>
    </div>
    {{ list.plotpopup('plot0', 'Überschrift', 'Text', 'icons/ws/measure_power_meter.png', 'zaehler.haushalt.verbrauch.gestern', 'avg', '1w', '', '', '', '', 'Haushalt', '#aa0', 'area', '', '') }}    
    {{ list.plotpopup('plot1', 'Überschrift1', ['Text1','Text2'], ['icons/ws/measure_power_meter.png',''], ['zaehler.haushalt.verbrauch.gestern','zaehler.wp.verbrauch.gestern'], ['avg','avg'], ['1w','2w'], ['',''], ['',''], ['',''], ['',''], ['Haushalt','WP'], ['#aa0','#a00'], ['area','line'], ['',''], ['','']) }}
    {{ list.plotpopup('plot2', 'Überschrift2', ['Text1','Text2',' '], ['icons/ws/measure_power_meter.png','',' '], ['zaehler.haushalt.verbrauch.gestern','zaehler.wp.verbrauch.gestern',' '], ['avg','avg',' '], ['1w','2w',' '], ['','',' '], ['','',' '], ['','',' '], ['','',' '], ['Haushalt','WP',' '], ['#aa0','#a00',' '], ['area','line',' '], ['','',' '], ['','',' ']) }}
    {{ list.plotpopup('plot3', 'Überschrift3', ['Text1',' ','Text3'], ['icons/ws/measure_power_meter.png',' ','icons/ws/measure_power_meter.png'], ['zaehler.haushalt.verbrauch.gestern',' ','zaehler.haushalt.verbrauch.gestern'], ['avg',' ','avg'], ['1w',' ','2w'], ['','',''], ['','',''], ['','',''], ['','',''], ['Haushalt','','WP'], ['#aa0','','#a00'], ['area','line',' '], ['','',' '], ['','',' ']) }}
    
    <li data-role="list-divider">mvalue</li>
    {{ list.mvalue('mvalue1', 'Alle', ['zaehler.haushalt.leistung','zaehler.wp.cop.tag','zaehler.wp.leistung'], ['kW','COP','kW']) }}
    {{ list.mvalue('mvalue2', 'Zweispaltig', ['zaehler.haushalt.leistung','zaehler.wp.cop.tag'], ['kW','COP']) }}
    {{ list.mvalue('mvalue3', 'Dreispaltig mitte leer', ['zaehler.haushalt.leistung',' ','zaehler.wp.leistung'], ['kW',' ','kW']) }}
    {{ list.mvalue('mvalue4', 'Einspaltig', 'zaehler.haushalt.leistung', 'kW') }}
    
    <li data-role="list-divider">mswitch</li>
    {{ list.mswitch('mswitch1', 'Mit UZSU', ['gad1','gad2','gad3'],['gad1.uzsu','gad2.uzsu','gad3.uzsu'], '' , '') }}
    {{ list.mswitch('mswitch2', 'ohne UZSU', ['gad1','gad2','gad3'],'', '' , '') }}
    {{ list.mswitch('mswitch3', 'gemischt', ['gad1','gad2','gad3'],['gad1.uzsu','gad3.uzsu'], '' , '') }}
    {{ list.mswitch('mswitch4', 'Zweispaltig', ['gad1','gad2'],['gad1.uzsu',''], '' , '') }}
    {{ list.mswitch('mswitch5', 'Dreispaltig mitte leer', ['gad1',' ','gad2'],['gad1.uzsu','',''], '' , '') }}

</ul>    
{% endblock %}

{% block quad_main_bottom %}   
{% endblock %}


{% block quad_top %}
<ul data-role="listview" data-dividertheme="c" class="nw_list">
    <li data-role="list-divider">mstring</li>
    {{ list.mstring('string1', 'Überschrift',['Spalte1','Spalte2','Spalte 3'],['icons/ws/measure_power_meter.png','icons/ws/message_socket.png','icons/ws/sani_heating.png'])}}
    {{ list.mstring('string2', 'Alle',['Spalte1','Spalte2','Spalte 3'])}}
    {{ list.mstring('string3', 'Zweispaltig',['Spalte1','Spalte2'])}}
    {{ list.mstring('string4', 'Dreispaltig mitte leer',['Spalte1',' ','Spalte 3'])}}
    {{ list.mstring('string5', 'Überschrift','Spalte1')}}
</ul>
{% endblock %}

{% block quad_bottom %}
<ul data-role="listview" data-dividertheme="c" class="nw_list">
    <li data-role="list-divider">maptext</li>
    {{ list.maptext('status_hk_text1', 'maptext', 'ebus.status_hk', ['Heizen','Aus','Auto','Eco','Absenken'], [1, 2, 3, 4, 5], 1) }}
    {{ list.mmaptext('status_hk_text2', 'mmaptext', ['ebus.status_hk',' ',' '], [['Heizen','Aus','Auto','Eco','Absenken'],' ',' '], [[1, 2, 3, 4, 5],' ',' ']) }}
    {{ list.mmaptext('status_hk_text3', 'Heizbetrieb', ['ebus.status_hk','ebus.status_ww'], [['Heizen','Aus','Auto','Eco','Absenken'],['ens','zwe','dre','vier','fünf']], [[1, 2, 3, 4, 5],[1, 2, 3, 4, 5]]) }}
</ul>
{% endblock %} 

Ich denke der Übersichtlichkeit würde ich das in ein separates git-Repo überführen.

[JuMi2006]

Gibt es jemand der momentan ein bisschen Luft hat um einige CSS-Änderungen zu machen? Ich sehe da ehrlich gesagt nicht durch und habe so ein paar neue kleine Widgets die funktional o.k. sind aber deren Positionierung/Größe einfach nicht gelingen wird.

Das wäre z.B:

list.flip (basic-flip in der Liste)
list.slider (basic.slider in der Liste)
plot.popup (Popup-Plot)

Wäre super wenn jemand da Interesse und Lust hat.

[stromie]

Hallo JuMi2006

sieht gut aus, ich setzte auch noch auf das quad. Werd deine Neuerungen mal testen.

Grüße Stromie

[JuMi2006]

Hallo Niko und andere,

ich hab da mal ein paar Widgets erweitert, und auch all PR in github erstellt.
Wird das da noch bearbeitet oder ist das eher tot?

https://github.com/2ndsky/quad/pull/3

Damit hat man folgende neuen Widgets:

list.button - Ein einfacher Button der einen Wert sendet
list.mbutton - Bis zu 3 Buttons nebeneinander die entsprechende Werte senden
list.mswitch - Bis zu 3 Switches in einer Linie, daneben dann optional jeweils ein UZSU-Icon
list.mvalue - Bis zu 3 Werten die in einer Linie angezeigt werden

Das waren die Sachen die mir als erstes gefehlt haben. Vielleicht brauchts ja noch wer und es kommt wieder ein wenig Schwung rein .

[yachti]

Ich glaub, die wurde im letzten Release der smartVISU umgebaut. Bei mir funktionieren die Icons seither auch nicht mehr wie sie sollen. Ich muss das bei Gelegenheit im nächsten Urlaub überarbeiten.

Danke passt jetzt bei mir. Hab die icon.html von der SV Projektseite aus dem Source gemäß threat #278 angepasst

[Apollo]

Die icon.html wir nur für die volldynamischen SVGs eingebunden.

Gruss

[2ndsky]

Ich glaub, die wurde im letzten Release der smartVISU umgebaut. Bei mir funktionieren die Icons seither auch nicht mehr wie sie sollen. Ich muss das bei Gelegenheit im nächsten Urlaub überarbeiten.

[yachti]

Für Jalousien habe ich einen Button implementiert, der zwischen kurzem und langem Tastendruck unterscheiden kann. Damit kann man dann direkt in der Listenansicht die Jalousien per Kurzzeit- oder Langzeitobjekt fahren.

Hallo Nico,

auch ich finde deine Visu sehr gelungen und da ich auch mit dem Ipad arbeite perfekt aufgeteilt. Ich habe daher Teile deiner Visu übernommen.

Für die Einbindung der Blinds verweist du in der widget_list.html
auf eine icon.html

    {% import "basic.html" as basic %}
   [COLOR=Red]{% import "icon.html" as icon %}[/COLOR]
    {% import "widget_visu.html" as visu %}
    {% import "widget_popup.html" as popup %}

Diese finde ich in deinem GitHub nicht. Kannst Du mir die bitte zur Verfügung stellen

[cassiopeia]

Anzeigeproblem beim Firefox-Browser

Ich weiß nicht ob das Problem bekannt ist.

Habe gerade mal das Design gezogen und in smartvisu eingestellt.

Beim betrachten der Seiten mit Firefox scheint n Wurm drinnen zu sein. Habe mal Screenshots gemacht und angehängt.

Grüße
Benni

Das Problem mit der Anzeige beim Firefox scheint immer dann aufzutreten, wenn in einer Tabellenzelle kein Zeichen enthalten ist.
Zur Abhilfe habe ich in der Datei "widget_list.html" ein paar zusätzliche " " eingefügt.

z.B.

{% macro switch(id, txt, gad_switch, gad_uzsu, pic_on, pic_off) %}
    {% import "basic.html" as basic %}
    {% import "widget_visu.html" as visu %}
    {% import "widget_uzsu.html" as uzsu %}
    {% import "widget_popup.html" as popup %}
    <li data-icon="false">
    <div class="nw_table">
        <div class="text">{{ txt|e }}</div>
        <div>
            {{ basic.switch(id~'list_switch', gad_switch, pic_on, pic_off) }}
        </div>
        <div>&nbsp;</div>
        <div class="landscape">
            &nbsp;
{% if gad_uzsu %}
            {{ uzsu.uzsu_icon(id~'list_uzsu', gad_uzsu, 'UZSU - '~txt, '2','','','bool') }}
{% endif %}
        &nbsp;</div>
    </div>
    </li>
{% endmacro %}

Dadurch wird die Schrift auch dann korrekt ausgegeben, wenn in der letzten Zelle einer Zeile keine Zeichen (Daten) enthalten sind.

[henfri]

- Only sometimes in the example, you list the name of the icon used - does this mean if nothing is mentioned, it uses the "bulb" default?

Yes.

The eg.wohnen.licht must be the switch, .wert is the value, but is it only needed to "tell" smartvisu eg.wohnen.licht.uzsu? Then it knows to use the UZSU plugin (offcourse the item must be defined as described in USZU - and installed as a plugin)

That's correct.
If you use no uzsu for one Item, you give an empty value ...,'',...

So when using this "mod" the commands must be list.dimmer,switch,rgb and so on - correct?

Yes and no. You can still use the classic format. The list.* are only abbreviations/macros that create this list-design.

Greetings,
Hendrik


Is it same structure as earlier eith RTR?

Is it also possible to use the feature, to set the temperature or something like that inside the navigation button for etc "Kochen"?[/QUOTE]

[Rasmus7700]

Hello.
I've installed 2ndsky's mod - seems to Work
I was wondering about a thing:
- Only sometimes in the example, you list the name of the icon used - does this mean if nothing is mentioned, it uses the "bulb" default?

example line 30 from licht.html

[FONT=Consolas][SIZE=2][COLOR=#dcdcdc][FONT=Consolas][SIZE=2][COLOR=#dcdcdc][FONT=Consolas][SIZE=2][COLOR=#dcdcdc]
 [B]{{[/B] [/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Consolas][SIZE=2][COLOR=#ff00ff][FONT=Consolas][SIZE=2][COLOR=#ff00ff][FONT=Consolas][SIZE=2][COLOR=#ff00ff]list.dimmer('eg.wohnen.licht','Wohnen','eg.wohnen.licht','eg.wohnen.licht.wert',[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Consolas][SIZE=2][COLOR=#dcdcdc][FONT=Consolas][SIZE=2][COLOR=#dcdcdc][FONT=Consolas][SIZE=2][COLOR=#dcdcdc] [/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Consolas][SIZE=2][COLOR=#ff00ff][FONT=Consolas][SIZE=2][COLOR=#ff00ff][FONT=Consolas][SIZE=2][COLOR=#ff00ff]'eg.wohnen.licht.uzsu')[/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][FONT=Consolas][SIZE=2][COLOR=#dcdcdc][FONT=Consolas][SIZE=2][COLOR=#dcdcdc][FONT=Consolas][SIZE=2][COLOR=#dcdcdc] [B]}}
[/B][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT][/COLOR][/SIZE][/FONT]

The eg.wohnen.licht must be the switch, .wert is the value, but is it only needed to "tell" smartvisu eg.wohnen.licht.uzsu? Then it knows to use the UZSU plugin (offcourse the item must be defined as described in USZU - and installed as a plugin)

So when using this "mod" the commands must be list.dimmer,switch,rgb and so on - correct?

Is it same structure as earlier eith RTR?

Is it also possible to use the feature, to set the temperature or something like that inside the navigation button for etc "Kochen"?

[stromie]

Das ist schade.

Grüße Stromie

[2ndsky]

Hallo Kollegen,

bin ja gerade dabei, auf den HS umzusteigen... zumindest was die Oberfläche an geht. Die smartVISU auf dem iPhone 5 war mir einfach zu langsam (teilweise 5 Sekunden und länger für eine Page). Mittlerweile habe ich das iPhone 6 und dort werden die Seiten selbst mit vielen Items in unter einer Sekunde geladen. Damit bestätigt sich meine Vermutung, dass es doch relativ lange dauert, bis die Stati ausgewertet werden und nicht die Übertragung das Problem ist. Allerdings passt das Design vorne und hinten nicht für das Display des iPhone 6. Auf dem Plus kann es schon wieder ganz anders aussehen. Ob ich daran noch weiter machen werden... das weiß ich momentan noch nicht.

Sorry, haven't read the Whole thread - but is this project in a release state? or still beta?

Then read it first, please

[Rasmus7700]

Hello Guys.

Sorry, haven't read the Whole thread - but is this project in a release state? or still beta?

Is there any installation instructions?

Seems pretty awesome

Great Work...