[FHEM-Tablet-UI] User-Demos

RoBra81 · 20 Dezember 2015, 23:28:18

Zitat von: eki am 20 Dezember 2015, 22:50:48
das feature im Definitionsfile festzulegen, welche Graphen sichtbar sind und welche nicht, habe ich schon eingebaut, gibts in den nächsten Tagen .

Zitat von: eki am 20 Dezember 2015, 22:50:48
Wenn Du bei Deiner Definition einen Farbverlauf wie in meinen anderen Stilen verwendest, wird das so nicht funktionieren. Ich habe es nicht geschafft, Verläufe aus css Dateien so einzubinden, dass sie von den SVGs richtig verwendet werden und die Verläufe deshalb per js Code eingebunden. Man kann also nur auf die Verläufe aus den fhem plots und auf ein paar, die ich dazu erfunden habe zurückgreifen. Wenn Du mir deine Styles schickst füge ich zusätzliche passende Verläufe mit dazu.

Ich habe einfach ein l5 analog den anderen eingebaut und ihm die Farbe 113311 gegeben - in FHEM selbst geht's ja von l1 bis l8 und l1fill bis l6fill...

Ronny

pnewman · 29 Dezember 2015, 11:19:24

Hallo zusammen,

nach einem Update vor Weihnachten sieht es bei meinem FTUI katastrophal aus.

Jetzt werde ich von vorne anfangen, so erhalte ich auch die Möglichkeit viele Neuheiten die entwickelt wurden einzubauen.

Am Anfang dieseS Thread sind einige Demos eingestellt, die mittlerweile sicherlich überholt wurden.

Könntet ihr bitte eure neuen Dateien nochmals teilen und mit den neuen Screenshots einstellen?

Somit bleibt dieser Thread auf seiner eigentlichen Mission.

Alles andere sollte hier rein:http://forum.fhem.de/index.php/topic,34233.0.html

Vielen Dank für die Ideen und die Arbeit die Ihr hier hereinsteckt!

Durch euch alle ist diese Oberfläche die BESTE die mir bisher untergekommen ist!

Gruß
Ralf

pnewman · 31 Dezember 2015, 23:32:37

Hallo,

ich habe ein wenig Zeit investiert und soweit bin ich nun:

Ein wenig Farbe bei den Rollos wäre super.

Vielleicht weiss jemand Rat?

Gruß
Ralf

Und einen guten Rutsch in das neue Jahr.

wkarl · 01 Januar 2016, 09:54:24

Hallo,

da zumindest die Ansteuerung der Thermostate dem entspricht was ich mir hier vorgestellt habe, folgend der code und ein screenshot wie die aussieht.

Aufbau der Dateiverküpfungen:
>index.html
>menu-main.html
>main.html (Baustelle)
>h-og-r.html
> widgets zur Steuerung der Heizkörper & Fussbodenheizung
als Beispiel h-eg-r-buero-hz.html
>h-eg-r.html
> widgets zur Steuerung der Heizkörper & Fussbodenheizung
>h-kg-r.html
> widgets zur Steuerung der Heizkörper & Fussbodenheizung
>etc (Rest Baustelle)
>menu-datetime.html

index.html:

Code Auswählen

<!DOCTYPE html>
<html>
<head>
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> 

	<title>FHEM-Tablet-UI</title>
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<meta name="widget_base_width" content="100">
	<meta name="widget_base_height" content="120">
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
	<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
	<meta name="gridster_disable" content="0"> <!-- verschieben abschalten -->
	
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css"/>

	<!-- Charts Theme CSS -->	
	<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />  
<!--	<link rel="stylesheet" href="/fhem/pgm2/jquery-ui.min.css" /> -->


   <!-- define your personal style here, it wont be overwritten  -->
   <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
	
	<!-- Javascript -->
	<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
   <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
   <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>
<!--	<script type="text/javascript" src="/fhem/pgm2/jquery-ui.min.js"></script> -->
	
</head>
<body>

	<div class="gridster">
		<ul>
		<!-- Menu -->
		<div class="container">
      	<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu-main.html"></li>
         <li data-row="5" data-col="1" data-sizex="1" data-sizey="0.5" data-template="menu-datetime.html"></li>
      </div>
		<!-- Content -->

		</ul>
	</div>
</body>
</html>

menu-main.html:

Code Auswählen

<html>
<body>
<header class="top-space"><font size="+1">MENU</font></header>
<div class="container">
	<div class="cell"
      data-type="pagetab"
      data-url="main.html"
		data-icon="fa-home"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
	<div  class="cell"
		data-type="pagetab"
		data-url="h-og-r.html"
		data-icon="oa-control_building_og"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
   <div  class="cell"
   	data-type="pagetab"
		data-url="h-eg-r.html"
		data-icon="oa-control_building_eg"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
   <div  class="cell"
   	data-type="pagetab"
      data-url="h-kg-r.html"
      data-icon="oa-control_building_kg"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
   <div  class="cell"
   	data-type="pagetab"
      data-url="h-dv-versorgung.html"
      data-icon="oa-time_statistic"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
	<div class="cell"
      data-type="pagetab"
      data-url="g-bewaesserung.html"
		data-icon="oa-sani_irrigation"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
	<div class="cell"
      data-type="pagetab"
      data-url="w-ingolstadt.html"
		data-icon="oa-scene_day"
      data-background-icon="fa-circle"
		data-off-background-color="dimgrey"
      data-on-background-color="darkorange"
		data-on-color="black"
		data-off-color="black">
   </div>
</div>
</body>
</html>

h-eg-r.html: (og und kg sind ähnlich aufgebaut)

Code Auswählen

<!DOCTYPE html>
<html>
<head>

   <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<meta name="widget_base_width" content="100">
	<meta name="widget_base_height" content="120">
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
	<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
	<meta name="gridster_disable" content="0"> <!-- verschieben abschalten -->
	
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css"/>

	<!-- Charts Theme CSS -->	
	<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />  

   <!-- define your personal style here, it wont be overwritten  -->
   <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
	
	<!-- Javascript -->
	<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
   <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
   <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>

	<title>EG Heizung</title>

</head>

<body>
	<div class="gridster">

		<ul>
		<!-- Menu -->
			<div class="container">
				<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu-main.html"></li>
				<li data-row="6" data-col="1" data-sizex="1" data-sizey="1.5" data-template="menu-datetime.html"></li>
			</div>	

		<!-- Content -->
			<li data-row="2" data-col="2" data-sizex="2" data-sizey="3" data-template="h-eg-r-buero-hz.html"></li>
			<li data-row="2" data-col="4" data-sizex="2" data-sizey="3" data-template="h-eg-r-kueche-hz.html"></li>
			<li data-row="2" data-col="6" data-sizex="2" data-sizey="3" data-template="h-eg-r-esszimmer-hz.html"></li>
			<li data-row="2" data-col="8" data-sizex="2" data-sizey="3" data-template="h-eg-r-wohnzimmer-hz.html"></li>
			<li data-row="5" data-col="2" data-sizex="2" data-sizey="2" data-template="h-eg-r-gaestetoilette-hz.html"></li>
			<li data-row="5" data-col="4" data-sizex="2" data-sizey="2" data-template="h-eg-r-dielewindfang-hz.html"></li>
		</ul>

	</div>
	
</body>
</html>

h-eg-r-buero-hz.html: (als Beispiel für die anderen Heizungssteuerung der verbleibenden Räume)

Code Auswählen

<!DOCTYPE html>
<html>
<body>

<header><font size="+1">Büro</font></header>
</div>
<div class="container">
	<div class="container row big top-space">
		<div class="col-1-2 left">
			<div data-type="label" 
			data-device="Buero_TC" data-get="measured-temp" data-unit="%B0C%0A" data-fix="1"
			data-limits='[-20,20,24]' data-colors='["skyblue","darkorange","orangered"]'>
			</div>
		</div>
		<div class="col-1-2 right">
			<div data-type="label" 
			data-device="Buero_TC" data-get="humidity" data-unit="%%0A" data-fix="1"
			data-limits='[0,40,60]' data-colors='["skyblue","darkorange","orangered"]'>
			</div>
		</div>				
	</div>

	<div class="container row">
		<div class="top-space" data-type="label">Heizkörper</div>
		<div class="container top-space">
		<div class="col-2-3 left">
			<div data-type="thermostat" 
				data-device="Buero_HK_Clima" data-get="desired-temp" data-set="desired-temp" data-temp="measured-temp" data-valve="ValvePosition"
	                                  data-min="0" data-max="30" data-step="0.5"
				data-mode="controlMode"
				data-off="controlManu off" data-boost="controlMode boost" 
				data-fgColor="darkorange"
				data-height="96px"
				data-width="96px"> 
			</div>
		</div>
		<div class="col-1-3 top-space right"><font size="-2">
			<div	data-type="multistatebutton" 
				data-device="Buero_HK_Clima" data-get="controlMode" data-get-on='["auto","manual"]'
					data-set='["controlMode manual","controlMode auto"]' data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual"]' data-colors='["darkgreen","darkblue"]' 
					data-background-icon="fa-square" data-background-colors='["dimgrey","dimgrey"]'
					>
			</div><br>
			<div data-type="multistatebutton" 
				data-device="Buero_HK" data-get="R-btnLock" data-get-on='["on","off"]' 
					data-set='["regSet btnLock off","regSet btnLock on"]' data-icons='["oa-secur_locked","oa-secur_open"]' data-colors='["darkred","darkblue"]' 
					data-background-icon="fa-square" data-background-colors='["dimgrey","dimgrey"]'
					>
			</div>
		</font>
		</div>
		</div>
	</div>

	<div class="container row">
		<div data-type="label">Fussboden</div>
		<div class="container top-space">
		<div class="col-2-3 left">
			<div data-type="thermostat" 
				data-device="Buero_TC" data-get="desired-temp" data-set="desired-temp" data-temp="measured-temp" data-valve="actuator"
	                                  data-min="0" data-max="30" data-step="0.5"
	         data-mode="controlMode"
				data-off="controlManu off" data-boost="controlMode boost" 
				data-fgColor="darkorange"
				data-height="96px"
				data-width="96px"> 
			</div>
		</div>
		<div class="col-1-3 top-space right"><font size="-2">
			<div	data-type="multistatebutton" 
				data-device="Buero_TC_Climate" data-get="controlMode" data-get-on='["auto","manual"]'
					data-set='["controlMode manual","controlMode auto"]' data-icons='["oa-sani_heating_automatic","oa-sani_heating_manual"]' data-colors='["darkgreen","darkblue"]' 
					data-background-icon="fa-square" data-background-colors='["dimgrey","dimgrey"]'
					>
			</div><br>
			<div data-type="multistatebutton" 
				data-device="Buero_TC" data-get="R-btnLock" data-get-on='["on","off"]' 
					data-set='["regSet btnLock off","regSet btnLock on"]' data-icons='["oa-secur_locked","oa-secur_open"]' data-colors='["darkred","darkblue"]' 
					data-background-icon="fa-square" data-background-colors='["dimgrey","dimgrey"]'
					>
			</div>
		</font>
		</div>
		</div>
	</div>


</div>
</body>
</html>

Aktuell arbeite ich u.a. am Popup-Dialog, wenn der Bereich der Temperatur/Luftfeuchtigkeit berührt wird soll ein Graph mit IST-, SOLL-Temperatur und Actuator-Verlauf dargestellt werden. Das funktioniert aber noch nicht.

Kritiken, Kommentare und weitere Ideen sind willkommen.

ciao walter

kvo1 · 01 Januar 2016, 12:40:56

Moin Walter,
danke für die Anregungen, werde ich mir mal ansehen

Klaus

pnewman · 01 Januar 2016, 23:26:52

Hallo Walter,

interessante Ansicht.

Wofür ist der Button gut?

Code Auswählen

<div data-type="multistatebutton"
				data-device="Buero_HK" data-get="R-btnLock" data-get-on='["on","off"]'
			        data-set='["regSet btnLock off","regSet btnLock on"]' 
                                data-icons='["oa-secur_locked","oa-secur_open"]' data-colors='["darkred","darkblue"]'
				data-background-icon="fa-square" data-background-colors='["dimgrey","dimgrey"]'
					>

Sperrst du damit die Tasten an dem Thermostaten?

Gruß
Ralf

kvo1 · 02 Januar 2016, 01:12:11

bin zwar nicht Walter

aber ja , er sperrt die Tasten an dem Thermostaten!

Ergibt sich hieraus !
data-set='["regSet btnLock off","regSet btnLock on"]'

wkarl · 02 Januar 2016, 14:23:30

Hallo,

was weiterhin auch fertig ist (aber man weiß ja nie) ist die Gartenbewässerung.

Aufbau der Dateiverküpfungen:
>index.html
>menu-main.html
>main.html (Baustelle)
>h-og-r.html
> widgets zur Steuerung der Heizkörper & Fussbodenheizung
als Beispiel h-eg-r-buero-hz.html
>h-eg-r.html
> widgets zur Steuerung der Heizkörper & Fussbodenheizung
>h-kg-r.html
> widgets zur Steuerung der Heizkörper & Fussbodenheizung
>g-bewaesserung.html
>g-bw-pumpe-01.html
>g-bw-programm-01.html
>g-bw-sued-busch.html
> restliche widges
>etc (Rest Baustelle)
>menu-datetime.html

index.html und menu-main.html findet ihr weiter oben und behandle ich hier nicht mehr.

g-bewaesserung.html:

Code Auswählen

<!DOCTYPE html>
<html>
<head>

   <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
	<meta name="widget_base_width" content="100">
	<meta name="widget_base_height" content="120">
	<meta name="mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="longpoll" content="1"> <!-- 1=longpoll;0=shortpoll every 30sec -->
	<meta name="debug" content="0"> <!-- 1=output to console;0=not output -->
	<meta name="gridster_disable" content="0"> <!-- verschieben abschalten -->
	
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.gridster.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/font-awesome.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/jquery.toast.min.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/powerange.min.css"/>

	<!-- Charts Theme CSS -->	
	<link rel="stylesheet" href="/fhem/tablet/lib/openautomation.css" />
	<link rel="stylesheet" href="/fhem/tablet/lib/fhemSVG.css" />  

   <!-- define your personal style here, it wont be overwritten  -->
   <link rel="stylesheet" href="/fhem/tablet/css/fhem-tablet-ui-user.css" />
	
	<!-- Javascript -->
	<script type="text/javascript" src="/fhem/pgm2/jquery.min.js"></script>
   <script type="text/javascript" src="/fhem/tablet/lib/jquery.knob.mod.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.toast.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.circlemenu.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/powerange.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/lib/jquery.gridster.min.js"></script>
   <script type="text/javascript" src="/fhem/tablet/lib/fa-multi-button.min.js"></script>
	<script type="text/javascript" src="/fhem/tablet/js/fhem-tablet-ui.js"></script>

	<title>Bewässerung</title>

</head>

<body>

	<div class="gridster">

        <ul>
		<!-- Menu -->
				<div class="container">
					<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu-main.html"></li>
					<li data-row="6" data-col="1" data-sizex="1" data-sizey="1.5" data-template="menu-datetime.html"></li>
				</div>	

       <!-- Content -->

			 <li data-row="2" data-col="2" data-sizex="2" data-sizey="1" data-template="g-bw-pumpe-01.html"></li>
				 <li data-row="4" data-col="2" data-sizex="2" data-sizey="1" data-template="g-bw-programm-01.html"></li>
             <li data-row="2" data-col="4" data-sizex="2" data-sizey="1" data-template="g-bw-sued-busch.html"></li>
             <li data-row="4" data-col="4" data-sizex="2" data-sizey="1" data-template="g-bw-sued-rasen.html"></li>
             <li data-row="2" data-col="6" data-sizex="2" data-sizey="1" data-template="g-bw-teich&ost-busch.html"></li>
				 <li data-row="4" data-col="6" data-sizex="2" data-sizey="1" data-template="g-bw-ost-rasen.html"></li>
				 <li data-row="2" data-col="8" data-sizex="2" data-sizey="1" data-template="g-bw-terasse&west-rasen.html"></li>
				 <li data-row="4" data-col="8" data-sizex="2" data-sizey="1" data-template="g-bw-teich.html"></li>

				 <li data-row="6" data-col="2" data-sizex="2" data-sizey="1" data-template="g-bw-pumpe-02.html"></li>
				 <li data-row="8" data-col="2" data-sizex="2" data-sizey="1" data-template="g-bw-programm-02.html"></li>
				 <li data-row="6" data-col="4" data-sizex="2" data-sizey="1" data-template="g-bw-ost-heide.html"></li>
				 <li data-row="8" data-col="4" data-sizex="2" data-sizey="1" data-template="g-bw-ost-busch.html"></li>
				 <li data-row="6" data-col="6" data-sizex="2" data-sizey="1" data-template="g-bw-ost-tanne.html"></li>

			</ul>

	</div>
</body>
</html>

g-bw-pumpe-01.html:

Code Auswählen

<!DOCTYPE html>
<html>
<body>

<header><font size="+1">Pumpe</font></header>
<div class="centered container">

	<div class="cell">
		<div class="cell inline" data-type="switch"
	   	data-device="SwitchSocketPwr_12_Sw"
	   	data-get-on="on" date-get-off="off"
			data-icon="fa-circle-o-notch" 
			data-background-icon="fa-circle"
			data-off-background-color="dimgrey"
			data-on-background-color="darkgreen">
	      </div>
		<div class="cell inline left-space">
			<div class="large" data-type="label"
				data-device="SwitchSocketPwr_12_Pwr" data-get="power" data-unit="W%0A" data-fix="1">
			</div>
			<div class="large" data-type="label"
				data-device="SwitchSocketPwr_12_Pwr" data-get="energy" data-unit="Wh%0A" data-fix="1">
			</div>
		</div>
	</div>

</div>

</body>
</html>
[/code

[b][u]g-bw-programm-01.html[/u][/b]
[code]<!DOCTYPE html>
<html>
<body>

<header><font size="+1">Programme</font></header>
<div class="centered container">

	<div class="cell">
		<div class="cell circlemenu inline right-space" data-type="circlemenu" 
			data-direction="right-half" data-circle-radius="60">
			<ul class="menu">
				<li><div data-type="push" data-icon="fa-gear"
					data-background-icon="fa-circle"
				   data-off-background-color="dimgrey"
					data-on-background-color="dimgrey"
					data-off-color="darkorange"
					data-on-color="darkorange"
				></div></li>
			   <li><div data-type="push" 
			   	data-device="IrrigationWF_Start_01" data-set="30" 
			      data-icon="">30</div></li>
			   <li><div data-type="push" 
			   	data-device="IrrigationWF_Start_01" data-set="45" 
			      data-icon="">45</div></li>
			   <li><div data-type="push" 
			   	data-device="IrrigationWF_Start_01" data-set="60" 
			      data-icon="">60</div></li>
			   <li><div data-type="push" 
			   	data-device="IrrigationWF_Start_01" data-set="off" 
			      data-icon="">off</div></li>
			</ul>
		</div>
	</div>

</div>

</body>
</html>

Definition von Irrigation_WF01:

Code Auswählen

#================================================
#==== Workflow 01 - Garden back
#================================================
define Irrigation_WF01 DOIF ([IrrigationWF_Start_01] eq "30") \
	(set Irrigation_0(1|2)_Sw_0. off) \
    (set SwitchSocketPwr_12_Sw on-for-timer 9000)\
    (set Irrigation_01_Sw_04 on-for-timer 1800)\
    (set Irrigation_02_Sw_02 on-for-timer 1800)\
    (set Irrigation_01_Sw_01 on-for-timer 1800)\
    (set Irrigation_01_Sw_03 on-for-timer 1800)\
    (set Irrigation_01_Sw_02 on-for-timer 1800)\
	(set Irrigation_0(1|2)_Sw_0. off, set SwitchSocketPwr_12_Sw off, set IrrigationWF_Start_01 off) \
DOELSEIF ([IrrigationWF_Start_01] eq "45")\
	(set Irrigation_0(1|2)_Sw_0. off) \
    (set SwitchSocketPwr_12_Sw on-for-timer 13500)\
    (set Irrigation_01_Sw_04 on-for-timer 2700)\
    (set Irrigation_02_Sw_02 on-for-timer 2700)\
    (set Irrigation_01_Sw_01 on-for-timer 2700)\
    (set Irrigation_01_Sw_03 on-for-timer 2700)\
    (set Irrigation_01_Sw_02 on-for-timer 2700)\
	(set Irrigation_0(1|2)_Sw_0. off, set SwitchSocketPwr_12_Sw off, set IrrigationWF_Start_01 off) \
DOELSEIF ([IrrigationWF_Start_01] eq "60")\
	(set Irrigation_0(1|2)_Sw_0. off) \
    (set SwitchSocketPwr_12_Sw on-for-timer 18000)\
    (set Irrigation_01_Sw_04 on-for-timer 3600)\
    (set Irrigation_02_Sw_02 on-for-timer 3600)\
    (set Irrigation_01_Sw_01 on-for-timer 3600)\
    (set Irrigation_01_Sw_03 on-for-timer 3600)\
    (set Irrigation_01_Sw_02 on-for-timer 3600)\
	(set Irrigation_0(1|2)_Sw_0. off, set SwitchSocketPwr_12_Sw off, set IrrigationWF_Start_01 off) \
DOELSE (set Irrigation_0(1|2)_Sw_0. off, set SwitchSocketPwr_12_Sw off)
attr Irrigation_WF01 group Control
attr Irrigation_WF01 room G-Bewaesserung
attr Irrigation_WF01 wait 0,0,5,1800,1800,1800,1800,1800:0,0,5,2700,2700,2700,2700,2700:0,0,5,3600,3600,3600,3600,3600

g-bw-sued-busch.html:

Code Auswählen

<!DOCTYPE html>
<html>
<body>

<header><font size="+1">Süd Busch</font></header>
<div class="centered container">

	<div class="cell">
		<div class="cell circlemenu inline right-space" data-type="circlemenu" 
			data-direction="right-half" data-circle-radius="60">
			<ul class="menu">
				<li><div data-type="push" data-icon="fa-clock-o"
					data-background-icon="fa-circle"
				   data-off-background-color="dimgrey"
					data-on-background-color="dimgrey"
					data-off-color="darkorange"
					data-on-color="darkorange"
				></div></li>
			   <li><div data-type="push" 
			   	data-device="Irrigation_01_Sw_04,SwitchSocketPwr_12_Sw" data-set="on-for-timer 1800" 
			      data-icon="">30</div></li>
			   <li><div data-type="push" 
			   	data-device="Irrigation_01_Sw_04,SwitchSocketPwr_12_Sw" data-set="on-for-timer 2700" 
			      data-icon="">45</div></li>
			   <li><div data-type="push" 
			   	data-device="Irrigation_01_Sw_04,SwitchSocketPwr_12_Sw" data-set="on-for-timer 3600" 
			      data-icon="">60</div></li>
			   <li><div data-type="push" 
			   	data-device="Irrigation_01_Sw_04,SwitchSocketPwr_12_Sw" data-set="off" 
			      data-icon="">off</div></li>
			</ul>
		</div>
		<div class="cell inline big blue" data-type="label" 
			data-device="Irrigation_01_Sw_04" data-get="usrCountDown"
		> 
	 	</div>
		<div class="cell inline left-space right" data-type="switch" data-device="Irrigation_01_Sw_04" 
			data-get-on="on" data-get-off="off"
			data-icon="fa-circle-o-notch" 
			data-background-icon="fa-circle"
			data-off-background-color="dimgrey"
			data-on-background-color="darkgreen">
	 	</div>
	</div>

</div>

</body>
</html>

Der erste screenshot zeigt das Ergebnis. Der zweite mit aufgeklappten circle-menu.

Ach ja, den CountDown-Zähler habe ich hier http://forum.fhem.de/index.php/topic,39090.msg312198.html#msg312198 beschrieben.

ciao walter

wkarl · 02 Januar 2016, 16:06:59

Zitat von: kvo1 am 02 Januar 2016, 01:12:11
bin zwar nicht Walter

aber ja , er sperrt die Tasten an dem Thermostaten!

Stimmt beides

kvo1 · 02 Januar 2016, 23:39:00

Hi Walter,
Saubere Arbeit, danke. Das Thema Bewässerung habe ich auch noch vor mir.

Gruß
Klaus

pnewman · 03 Januar 2016, 03:41:24

Zitat von: kvo1 am 02 Januar 2016, 01:12:11
bin zwar nicht Walter

aber ja , er sperrt die Tasten an dem Thermostaten!

Ergibt sich hieraus !
data-set='["regSet btnLock off","regSet btnLock on"]'

Hallo,

danke für die Antworten.

Da ich MAX! Thermostatantriebe nutze und diese kein regSet unterstützen war ich verwundert.

@Walter
Warum benötigst du diesen Schalter im FTUI?
Ich kann meine Knöpfe direkt am Stellantrieb sperren!

Wenn du diese Sperre am FTUI einschaltest, kann man dies nicht wieder am Stellantrieb freigeben?

Gruß
Ralf

wkarl · 03 Januar 2016, 06:47:30

Zitat von: pnewman am 03 Januar 2016, 03:41:24
@Walter
Warum benötigst du diesen Schalter im FTUI?
Ich kann meine Knöpfe direkt am Stellantrieb sperren!

Wenn du diese Sperre am FTUI einschaltest, kann man dies nicht wieder am Stellantrieb freigeben?

Hallo Ralf,

nun, irgendwann entstand der Bedarf. Vorwiegend gegen versehentliches verstellen der Thermostate.

Ja, Du kannst nach aktivieren/deaktivieren der Sperre am Thermostat dies wieder rückgängig machen.

ciao walter

sam50 · 03 Januar 2016, 11:51:32

Hallo Zusammen.
Ich habe ein kleines Problem mit der Chart Funktion. Bei mir werden im EDGE und auf meinem Android Tablet die Achsen Beschriftungen nicht angezeigt. Bei Win 10 mit Google Chrome funktioniert es. Weiß jemand woran das liegen könnte. ?
Ach ja ich habe noch ein paar andere kleinere Fragen zum Chart Thema:
1.Bei mir werden die Buttons oben (+ - Links rechts) etwas abgeschnitten.
2. Wie kann ich im SVG einen Monat (aktueller) fix anzeigen
3. Wenn ich den zurück Button drücke wird der vorherige Monat (12/2015) nicht angezeigt

Ich würde gerne ein Bild mit anhängen, leider kenne ich mich im Forum noch nicht so gut aus und weiß nicht wie man das macht ?

Sorry wenn mein Beitrag etwas unprofessionell wirkt, aber bin erst am dazulernen.

Nobby1805 · 03 Januar 2016, 12:33:33

Zitat von: sam50 am 03 Januar 2016, 11:51:32
Ich würde gerne ein Bild mit anhängen, leider kenne ich mich im Forum noch nicht so gut aus und weiß nicht wie man das macht ?

das + vor Erweiterte Optionen anklicken und dann "Datei anhängen:"

sam50 · 03 Januar 2016, 12:49:36

Zitat von: Nobby1805 am 03 Januar 2016, 12:33:33
das + vor Erweiterte Optionen anklicken und dann "Datei anhängen:"

Ok
Habs versucht
Hier beide Darstellungen. Einmal Chrome und einmal Edge/Android