Darstellungsproblem beim hm-rtr Widget (ddtlabs)

Begonnen von friedleif, 02 Dezember 2017, 11:27:51

Vorheriges Thema - Nächstes Thema

friedleif

Hallo,

ich hab das Widget von https://github.com/ddtlabs/smartvisu-widgets/tree/master/hm-rtr in meine Smartvisu 2.8 Seite eingebunden.

Soweit funktioniert es auch, allerdings ist die Darstellung fehlerhaft (siehe Anhang) und die Batterieanzeige funktioniert nicht (das reading passt, hab es versuchsweise als basiv.value angezeigt)
(Die fehlende Feuchtigkeit ist ok, hab ich bei dem noch nicht festgelegt funktioniert aber)

Leider durchblicke ich das CSS Konstrukt von Smartvisu und dem Widget nicht, hat jemand eine Idee woran es liegen könnte?

Danke!

dev0

Ich habe das Widget mit der ofiziellen 2.8 noch nicht getestet, ich benutze selbst noch eine pre-release 2.8 Version. Aus dem Bauch: Unterhalb des Klassenselktor ".ddtlabs .rtr" das Attribut "height" anpassen. Die Browser Entwicklertools unterstützen Dich dabei: Mac-Firefox: alt-cmd-c (Inspector). Damit kannst Du live die Auswirkungen sehen. Im herrmannj Repositoty gibt es auch ein rtr Widget, vielleicht passt das besser...

Zur Batterieanzeige habe ich spontan keine weitere Idee.

friedleif

Ich hab noch ein paar Kleinigkeiten für die HM-TC-IT-WM-W-EU Thermostate geändert und soweit sieht es jetzt bis auf die Batterie ganz gut aus.

Das widget von herrmannj hab ich auch probiert, da funktionieren die + und - Buttons nicht.
Scheint als würde bei beiden das JavaScript nicht ausgeführt. Ist aber jeweils in die visu.js importiert bzw. testweise auch reinkopiert.

Das hue widget funktioniert übrigens problemlos, da hab ich nur in Bezug auf die white ambiance Leuchtmittel gebastelt.


friedleif

Hallo,

hab die Batterieanzeige jetzt mit den dynamic Icons hinbekommen.

Erst ein entsprechendes userreading um den Wertebereich abzubilden
attr device userReadings batteryfx {my $batteryLevel = sprintf("%0.0f", 231.81*ReadingsVal($name,"batteryLevel",0)-486.81)}

Im Widget dann die icon.html eingebunden
{% import "icon.html" as icon %}

Und den Aufruf geändert
{{ icon.battery(id~'.battery', '', gad~'.batteryfx') }}
bzw.
{% if battery %} {{ icon.battery(id~gad[0]~'.battery', '', gad[0]~'.batteryfx') }} {% endif %}


Komplett sehen die beiden Widgets für die Thermostate jetzt bei mir so aus
/**
* Homematic Thermostat (HM-TC-IT-WM-W-EU)
*
* @param unique id for this widget
* @param name of the rtr
* @param step for plus/minus buttons (optional, default 0.5)
* @author dev0 / ddtlabs
*/
{% macro rtrthermo(id, gad, step) %}
{% import "basic.html" as basic %}
{% import "icon.html" as icon %}

<span class="ddtlabs">
<div id="{{ uid(page, id) }}" data-widget="device.rtr" data-step="{{ step|default(0.5) }}" class="rtr">

<div class="actual">
<div class="temp">
{{ basic.float(id~'.measured-temp', gad~'_Climate.measured-temp', '°' ) }}
&nbsp;&nbsp;&nbsp;-&nbsp;&nbsp;&nbsp; {{ basic.float(id~'.humidity', gad~'_Climate.humidity') }}%
<hr width="60%">
</div>
</div>

<div class="set">
<a data-role="button" data-icon="minus" data-inline="true" data-iconpos="notext" class="ui-mini"></a>
<div class="temp">{{ basic.float(id~'set', gad~'_Climate.desired-temp', '°' ) }}</div>
<a data-role="button" data-icon="plus" data-inline="true" data-iconpos="notext" class="ui-mini"></a>
</div>

<hr style="width: 80%">

<div class="control">
        <span data-role="controlgroup" data-type="horizontal">
{{ basic.dual(id~'.bd.controlMode.manauto', gad~'_Climate.controlMode', 'sani_heating_automatic.svg', 'sani_heating_manual.svg', 'auto', 'manual', 'mini') }}
{{ basic.dual(id~'.bd.controlMode.boost', gad~'_Climate.controlMode', 'icons/or/sani_heating_boost.png', 'icons/ws/sani_heating_boost.png', 'boost', 'auto', 'mini') }}
                {{ basic.dual(id~'.bd.night_day', gad~'_Climate.desired-temp', 'scene_day.svg', 'scene_night.svg', '21', '17', 'mini') }}
</span>

            <span data-role="controlgroup" data-type="horizontal">
                <div class="ui-mini ui-btn ui-shadow ui-btn-corner-all ui-btn-inline ui-btn-icon-center ui-last-child ui-btn-up-a status">
                {{ basic.symbol(id~'.window.open', gad~'_Climate.winOpenReporting', '', 'fts_window_2w_open.svg', 'on', '', 'icon1') }}
{{ basic.symbol(id~'.window.close', gad~'_Climate.winOpenReporting', '', 'fts_window_2w.svg', 'off', '', '') }}
</div>

<div class="ui-mini ui-btn ui-shadow ui-btn-corner-all ui-btn-inline ui-btn-icon-center ui-last-child ui-btn-up-a status">
<div style="margin: 3px 0 0 0 ;">
                {{ icon.battery(id~'.battery', '', gad~'.batteryfx') }}
                    </div>
</div>
    </span>
    </div>
</div>
</span>

{% endmacro %}

/**
* Homematic Thermostat (HM-TC-IT-WM-W-EU)
*
* @param unique id for this widget
* @param name of the rtr
* @param step for plus/minus buttons (optional, default 0.5)
* @info The following SV/FHEM readings will be used:
* @info gad_Climate.measured-temp, gad_Climate.desired-temp, gad_Climate.controlMode, gad_Climate.winOpenReporting, gad.batteryx10
* @info gad.battery is a userReadings with factor 10 of reading batteryLevel
* @author dev0 / ddtlabs
*/
{% macro rtr_listthermo(id, gads) %}
{% import "basic.html" as basic %}
{% import "icon.html" as icon %}

{% set desiredTemp = '_Climate.desired-temp' %}
{% set measuredTemp = '_Climate.measured-temp' %}
{% set controlMode = '_Climate.controlMode' %}
{% set battery = '.batteryx10' %}
{% set humidity = '_Climate.humidity' %}
{% set winOpenReporting = '_Climate.winOpenReporting' %}

<span class="ddtlabs">
<span class="rtr-listthermo">
<table>

<tr>
<th>Raum</th>
<th>Temp</th><th>&nbsp;</th>
            <th>rF</th><th>&nbsp;</th>
<th class="settings">Einstellungen</th>
</tr>

<tr><td colspan="0" align="center"><hr></td></tr>

{% for gad in gads %}

<tr>
<td>{{gad[1]}}</td>
<td><div class="xxx">{{ basic.float(id~gad[0]~'ist', gad[0]~measuredTemp, '°', '') }}</div></td><td>&nbsp;</td>
<td>{{ basic.float(id~gad[0]~'humidity', gad[0]~humidity, '%', '') }}</td><td>&nbsp;</td>
<td>
<div id="{{ uid(page, id~gad[0]) }}" data-widget="device.rtr" data-step="{{ step|default(0.5) }}">
<div class="list">
<a data-role="button" data-icon="minus" data-inline="true" data-iconpos="notext" class="ui-micro"></a>
{{ basic.float(id~gad[0]~'set', gad[0]~desiredTemp, '°' ) }}
<a data-role="button" data-icon="plus" data-inline="true" data-iconpos="notext" class="ui-micro"></a>
<a><img class="space" src="pages/base/pics/trans.png" /></a>
{{ basic.multistate(id~gad[0]~'controlMode', gad[0]~controlMode, ['manual','auto','party'], ['time_manual_mode.svg', 'time_automatic.svg', 'time_calendar.svg'], 'micro') }}
            {{ basic.multistate(id~gad[0]~'winOpenReporting', gad[0]~'_Climate.winOpenReporting', ['on','off'], ['fts_window_2w_open.svg', 'fts_window_2w.svg'], 'micro') }}
{% if battery %} {{ icon.battery(id~gad[0]~'.battery', '', gad[0]~'.batteryfx') }} {% endif %}
</div>
</div>
</td>
</tr>

<tr><td colspan="0" align="center"><hr></td></tr>

{% endfor %}

</table>
</span>
</span>
{% endmacro %}

dev0

Ich bin mir ziemlich sicher, dass es auch ohne Änderungen mit den in der Anleitung angegebenen userReadings funktioniert. Aber die Hauptsache ist, dass du es hinbekommen hast...

friedleif

Hi,

da hast du sicher recht. Irgendwo hab ich wahrscheinlich einen Fehler eingebaut :-\
Hatte ja mit dem anderen Widget von hermannj auch schon Probleme (+ und - Tasten)

Jetzt funktioniert es jedenfalls mit den Thermostaten und der WAF ist auf 100%  ::)