FHEM Forum

FHEM => Frontends => fronthem / smartVISU => Thema gestartet von: KraxelHuber am 04 Februar 2017, 10:39:16

Titel: smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: KraxelHuber am 04 Februar 2017, 10:39:16
Ich versuche einen Fibaro Dimmer 2 FGD-212 in smartVISU einzurichten. Dabei würde ich gerne device.dimmer benutzen, aber mir ist die Einrichtung nicht klar. In der entsprechenden html-Datei sieht meine Einbindung wie folgt aus:

{{ device.dimmer('Dimmer', 'dimmer_wz.sw', 'dimmer_wz.sl', 0, 100, 5) }}

Mir ist jetzt nicht klar, welche Einstellungen ich für die beiden GADs vornehmen muss. Kann hier jemand aushelfen?


Wenn ich den Dimmer nur als Switch definiere, funktioniert die Steuerung über smartVISU:
{{ basic.switch('Dimmer', 'dimmer_wz.sw') }}

Dabei habe ich das GAD wie folgt in FHEM definiert:

mode: item
device: dimmer_wz
reading: state
converter: OnOff
cmd set: state
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: raman am 04 Februar 2017, 12:02:21
Deine erste Definition ist nicht ganz richtig, da an 2. Stelle noch der Name des Dimmers mitgegeben wird.

{{ device.dimmer('Dimmer', 'Name_des_Dimmers', 'dimmer_wz.sw', 'dimmer_wz.sl', 0, 100, 5) }}
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: KraxelHuber am 04 Februar 2017, 14:42:06
Du hast Recht, habe es hier falsch gepostet. Die eigentliche Frage ist aber, wie ich die GADs in FHEM definieren muss?
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: KraxelHuber am 04 Februar 2017, 21:20:50
Ich habe eine Lösung gefunden, mit der ich das Licht direkt an- und ausschalten als auch per Slider dimmen kann.

In der entsprechenden HTML Datei habe ich den Dimmer wie folgt definiert:

{{ device.dimmer('Dimmer', 'dimmer_wz', 'dimmer_wz.sw', 'dimmmer_wz.sl', 0, 100, 5) }}

Die GADs in FHEM habe ich dann wie folgt definiert:

dimmer_wz.sw:

mode: item
device: dimmer_wz
reading: state
converter: OnOff
set cmd: state


dimmer_wz.sl

mode: item
device: dimmer_wz
reading: state
converter: NumDirekct
set cmd: dim
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: wthiess am 28 Februar 2017, 19:52:23
Hallo!

Frage? Soweit so gut.
Allerdings wenn ich z.B. den Dimmer auf 30% setze und dann auf off (egal ob in Fhem oder smartVisu) schalte bleibt er Dimmer auf 30%. Ich habe nun mit einigen notifys gespielt komm aber nicht ganz zurecht. Es gibt immer einen Hacken.

lg
Wolfgang

define WZ_Dimmer_on notify ZWave_SWITCH_MULTILEVEL_8:on set ZWave_SWITCH_MULTILEVEL_8 dim 100
define WZ_Dimmer_off notify ZWave_SWITCH_MULTILEVEL_8:off set ZWave_SWITCH_MULTILEVEL_8 dim 0

define WZ_Dimmer_0 notify ZWave_SWITCH_MULTILEVEL_8:dim:0 set ZWave_SWITCH_MULTILEVEL_8 off
define WZ_Dimmer_100 notify ZWave_SWITCH_MULTILEVEL_8:dim:100 set ZWave_SWITCH_MULTILEVEL_8 on

Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: australien am 10 Januar 2018, 11:32:13
Zitat von: KraxelHuber am 04 Februar 2017, 21:20:50
Ich habe eine Lösung gefunden, mit der ich das Licht direkt an- und ausschalten als auch per Slider dimmen kann.

In der entsprechenden HTML Datei habe ich den Dimmer wie folgt definiert:

{{ device.dimmer('Dimmer', 'dimmer_wz', 'dimmer_wz.sw', 'dimmmer_wz.sl', 0, 100, 5) }}

Die GADs in FHEM habe ich dann wie folgt definiert:

dimmer_wz.sw:

mode: item
device: dimmer_wz
reading: state
converter: OnOff
set cmd: state


dimmer_wz.sl

mode: item
device: dimmer_wz
reading: state
converter: NumDirekct
set cmd: dim

Hallo

ich habe gerade mit smartVISU begonnen und komme bei den Dimmer nicht weiter.

habe alles so gemacht wie du es beschrieben hast, leider funktioniert nur der Switch. von einen Slider ist leider nichts zu sehen (siehe screenshot)
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: herrmannj am 10 Januar 2018, 13:30:39
schau mal hier, die doku ist gut brauchbar http://docu.smartvisu.de/2.7/index.php?page=basic/widget_basic.slider

Beliebter Fehler: die id falsch (doppelt). Sonst in der browser console nach (js/html) Fehlern suchen. Und (sv) cache löschen !!!

... cache löschen sagte ich - oder ? ;) (ganz wichtig)
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: australien am 10 Januar 2018, 13:46:53
ich dachte bei device.dimmer ist der slider schon integriert?
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: herrmannj am 10 Januar 2018, 14:23:22
ja, hab Deinen post nicht genau genug gelesen. Die Antwort bleibt aber gleich nur der doku link ist dann anders http://docu.smartvisu.de/2.7/index.php?page=device/widget_device.dimmer

Wenn Du den slider nicht siehst:

ZitatBeliebter Fehler: die id falsch (doppelt). Sonst in der browser console nach (js/html) Fehlern suchen. Und (sv) cache löschen !!!

... cache löschen sagte ich - oder ? ;) (ganz wichtig)
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: australien am 10 Januar 2018, 15:51:48
kein Problem, ich sage danke für die Hilfe

der Cache ist nun leer und es funktioniert fast, der slider ist leider nur ca 1-2mm! also nicht verschiebbar? egal ob am PC mit IE, edge oder iPhone oder AndroidTablet

die Werte sind 0-100, meine smartVISU ist 2.8

{{ device.dimmer('dimmer_wz', 'Dimmer', 'dimmer_wz.sw', 'dimmmer_wz.sl', 10, 95, 5) }}
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: herrmannj am 10 Januar 2018, 16:22:27
dann scheint da was im html nicht zu stimmen ..
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: smai am 11 Januar 2018, 08:46:38
Zeig mal das den Quellcode der ganzen Seite.
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: australien am 11 Januar 2018, 10:39:33
der smartVISU Code

/**
* -----------------------------------------------------------------------------
* @package     smartVISU
* @author      Robert
* @copyright   2018
* @license     GPL [http://www.gnu.de]
* -----------------------------------------------------------------------------
*/


{% extends "rooms.html" %}

{% block content %}

<h1><img class="icon" src='{{ icon0 }}scene_livingroom.svg'/>Wohnzimmer</h1>
<div class="preblock">
</div>
<div class="block">
<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
<div data-role="collapsible" data-collapsed="false" >
<h3>Licht</h3>
<table width="90%">
<tr>
<td align="left" width="100px">
{{ basic.switch('Christbaum', 'Christbaum.sw', 'light_downlight.svg', 'light_downlight.svg') }}
</td>
<td>Christbaum</td>
</tr>

<tr>
<td align="left" width="100px">
{{ basic.switch('TabletAccu', 'TabletAccu.sw', 'light_wire_system_1.svg', 'light_wire_system_1.svg') }}
</td>
<td>TabletAccu</td>
</tr>

<tr>
<td align="left" width="100px">
{{ device.dimmer('dimmer_wz', 'Dimmer', 'dimmer_wz.sw', 'dimmmer_wz.sl', 10, 95, 5) }}
</td>
<td>DeckenDimmer</td>
</tr>
</table>
</div>
<div data-role="collapsible" data-collapsed="false" >
<h3>Rollo</h3>
<table width="90%">
<tr>
<td align="left" width="100px">
  {{ basic.slider('Fenster_SE', 'Fenster_SE.value', 0, 100, 10, 'vertical') }}
</td>
<td>Fenter Südost</td>
</tr>




</table>
</div>
</div>
</div>


{% endblock %}




der generierte html Code

<!DOCTYPE html>

<html>
<head>
<title>fronthem [smartVISU]</title>

<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, user-scalable=yes, initial-scale=1, maximum-scale=1.3, minimum-scale=1" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta http-equiv="expires" content="0" />

<link rel="icon" href="favicon.png" />
<link rel="icon" href="favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon" href="favicon.png" />

<link rel="stylesheet" href="vendor/jquery.mobile/jquery.mobile.structure-1.3.2.min.css" />
<script type="text/javascript" src="vendor/jquery/jquery-2.0.3.min.js"></script>


<script type="text/javascript" src="vendor/jquery.mobile/jquery.mobile-1.3.2.min.js"></script>
<script type="text/javascript" src="lib/base/jquery.mobile.slider.js"></script>

<script type="text/javascript" src="vendor/plot.highcharts/highcharts.js"></script>
<script type="text/javascript" src="designs/cube.js"></script>
<script type="text/javascript" src="widgets/widget.js"></script>


<script type="text/javascript" src="lib/base/base.js"></script>
<script type="text/javascript" src="lib/base/base.php"></script>
<script type="text/javascript" src="driver/io_domotiga.js"></script>

<link rel="stylesheet" type="text/css" href="designs/cube.min.css" />
<link rel="stylesheet" type="text/css" href="pages/base/base.css" />

<script type="text/javascript" src="pages/MeineWohnung/visu.js"></script>
<link rel="stylesheet" type="text/css" href="pages/MeineWohnung/visu.css" />

</head>


<body>

<script type="text/javascript">
io.init('10.68.0.21', '2121');
activateAutoReconnect();

// Do some actions before page is shown
$(document).on('pagebeforeshow', function () {
fx.init();
repeater.init();
widget.prepare();
// repeater.list();
});

// Run the io and all widgets
$(document).on('pageshow', function () {
io.run(1);
// console.log('[io] run');       
notify.display();
// widget.list();
});

$.mobile.page.prototype.options.domCache = true;
</script>


<div data-role="page" id="room_wohnen" class="base" data-theme="a">
<div data-role="header" data-position="fixed" data-tap-toggle="false">
<div class="ui-left">


<div id="menu" class="menu">

<a id="menu-rooms" class="icon1" href="index.php">
<img class="icon" src="icons/ws/control_building_empty.svg" /></a>

<a id="menu-category" class="icon1" href="index.php?page=category">
<img class="icon" src="icons/ws/time_manual_mode.svg" /></a>

<a id="menu-apps" class="icon1" href="index.php?page=apps">
<img class="icon" src="icons/ws/it_net.svg" /></a>

<a id="menu-system" class="icon1" href="index.php?page=config">
<img class="icon" src="icons/ws/edit_settings.svg" /></a>

</div>
</div>
<div class="ui-right">
<a href="javascript:window.location.href=window.location.href" style="text-decoration:none;color:#fff;">

<span class="smartvisu"><span class="smart">smart</span><span class="visu">VISU</span></span>


<div class="mini">
<span id="miniclock" class="miniclock" data-widget="clock.miniclock" data-repeat="1i">10:36</span>, 11.01, v2.8</div>
</a>
</div>
<div class="signal hide" onClick="$('.ui-page-active .alert').popup('open');"></div>
<div class="alert" data-role="popup" data-overlay-theme="a">
<div data-role="header" data-theme="c"><h1></h1></div>
<p></p>

<div class="control">
<span class="stamp"></span>
<a onClick="notify.remove();" class="ui-mini" data-icon="check" data-iconpos="top" data-role="button" data-inline="true">OK</a>
<a onClick="$('.alert').popup('close');" class="ui-mini" data-icon="delete" data-iconpos="top" data-role="button" data-inline="true">Cancel</a>
</div>
</div>
</div>

<div data-role="content" class="page-bg">
<div class="primary" style="background-image: none;">

<h1><img class="icon" src='icons/ws/scene_livingroom.svg'/>Wohnzimmer</h1>
<div class="preblock">
</div>
<div class="block">
<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">
<div data-role="collapsible" data-collapsed="false" >
<h3>Licht</h3>
<table width="90%">
<tr>
<td align="left" width="100px">

<span id="room_wohnen-Christbaum" data-widget="basic.switch" data-item="Christbaum.sw"
data-val-on="1" data-val-off="0"
data-pic-on="icons/ws/light_downlight.svg" data-pic-off="icons/ws/light_downlight.svg"
class="switch icon">
<a>


<img id="room_wohnen-Christbaum-off" class="icon " src="icons/ws/light_downlight.svg">




<img id="room_wohnen-Christbaum-on" class="icon icon1 hide" src="icons/ws/light_downlight.svg">


</a>
</span>


</td>
<td>Christbaum</td>
</tr>

<tr>
<td align="left" width="100px">

<span id="room_wohnen-TabletAccu" data-widget="basic.switch" data-item="TabletAccu.sw"
data-val-on="1" data-val-off="0"
data-pic-on="icons/ws/light_wire_system_1.svg" data-pic-off="icons/ws/light_wire_system_1.svg"
class="switch icon">
<a>


<img id="room_wohnen-TabletAccu-off" class="icon " src="icons/ws/light_wire_system_1.svg">




<img id="room_wohnen-TabletAccu-on" class="icon icon1 hide" src="icons/ws/light_wire_system_1.svg">


</a>
</span>


</td>
<td>TabletAccu</td>
</tr>

<tr>
<td align="left" width="100px">

<div class="dimmer">

<span id="room_wohnen-dimmer_wzswitch" data-widget="basic.switch" data-item="dimmer_wz.sw"
data-val-on="1" data-val-off="0"
data-pic-on="icons/ws/light_light.svg" data-pic-off="icons/ws/light_light.svg"
class="switch icon">
<a>


<img id="room_wohnen-dimmer_wzswitch-off" class="icon " src="icons/ws/light_light.svg">




<img id="room_wohnen-dimmer_wzswitch-on" class="icon icon1 hide" src="icons/ws/light_light.svg">


</a>
</span>


<p>Dimmer</p>

<input id="room_wohnen-dimmer_wzslider" data-widget="basic.slider" data-item="dimmmer_wz.sl"
type="range" value="0" min="10" max="95" step="5"
orientation="" data-highlight="true" />


</div>


</td>
<td>DeckenDimmer</td>
</tr>
</table>
</div>
<div data-role="collapsible" data-collapsed="false" >
<h3>Rollo</h3>
<table width="90%">
<tr>
<td align="left" width="100px">
 
<input id="room_wohnen-Fenster_SE" data-widget="basic.slider" data-item="Fenster_SE.value"
type="range" value="0" min="0" max="100" step="10"
orientation="vertical" data-highlight="true" />


</td>
<td>Fenter Südost</td>
</tr>




</table>
</div>
</div>
</div>


</div>
<div class="secondary minimum-tablet">


<ul data-role="listview" data-dividertheme="c">

<li data-role="list-divider">Erdgeschoss</li>
<li data-icon="false">
<a href="index.php?page=room_kueche">
<img class="icon"' src='icons/ws/scene_sleeping_alternat.svg'/><h3>Kueche</h3>

<div class="ui-li-aside"></div>
</a>
</li>
<li data-icon="false">
<a href="index.php?page=room_essen">
<img class="icon"' src='icons/ws/scene_sleeping_alternat.svg'/><h3>Esszimmer</h3>

<div class="ui-li-aside"></div>
</a>
</li>
<li data-icon="false">
<a href="index.php?page=room_wohnen">
<img class="icon"' src='icons/ws/scene_sleeping_alternat.svg'/><h3>Wohnzimmer</h3>

<div class="ui-li-aside"></div>
</a>
</li>
<li data-role="list-divider">Obergeschoss</li>
<li data-icon="false">
<a href="index.php?page=room_schlafen">
<img class="icon"' src='icons/ws/scene_sleeping_alternat.svg'/><h3>Schlafzimmer</h3>

<div class="ui-li-aside"></div>
</a>
</li>
<li data-icon="false">
<a href="index.php?page=room_bad">
<img class="icon"' src='icons/ws/scene_sleeping_alternat.svg'/><h3>Bad</h3>

<div class="ui-li-aside"></div>
</a>
</li>
<li data-icon="false">
<a href="index.php?page=room_buben">
<img class="icon"' src='icons/ws/scene_sleeping_alternat.svg'/><h3>Buben</h3>

<div class="ui-li-aside"></div>
</a>
</li>

</ul>

</div>
</div>
</div>


</body>
</html>

Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: australien am 11 Januar 2018, 12:35:29
wenn ich die Table weglasse funktioniert es, komisch?
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: smai am 11 Januar 2018, 12:52:33
Zitat von: australien am 11 Januar 2018, 12:35:29
wenn ich die Table weglasse funktioniert es, komisch?
Nein, nicht komisch:
100px sind einfach viel zu schmal für den Dimmer; da passt wie in deinem Screenshot genau der Handle rein.
Das Icon und der Abstand links ergeben schon 68px. Der Handle hat dann 30px - sind zusammen 98px.

Die Breite von Tabellen und Zellen in Pixeln wird übrigens im width-Attribut korrekterweise ohne "px" geschrieben (im Gegensatz zu CSS).
Tables sind in einem responsive Design allgemein nicht zu empfehlen. Erst recht nicht mit den deprecated Attributen width und align, diese sollten per CSS gesetzt werden.
Titel: Antw:smartVISU: device.dimmer in Verbindung mit Fibaro Dimmer 2 FGD-212
Beitrag von: australien am 11 Januar 2018, 14:17:01
Danke smai!
das erklärt natürlich einiges.