Update 2.7.2.

FabJoe · 02 Oktober 2018, 22:07:54

Zitat von: FabJoe am 01 Oktober 2018, 23:18:52
Code Auswählen Erweitern
<div data-type="symbol" class="cell small left" data-device="wc_froll_klein" data-get="state" data-icons='["oa-fts_window_2w","oa-fts_shutter_10","oa-fts_shutter_20","oa-fts_shutter_30","oa-fts_shutter_40","oa-fts_shutter_50","oa-fts_shutter_60","oa-fts_shutter_70","oa-fts_shutter_80", "oa-fts_shutter_90","oa-fts_shutter_100"]' data-states='["0","10","20","30","40","50","60","70","80","90","100"]' data-colors='["#2A2A2A"]' data-background-colors='["#aa6900"]' data-background-icons='["fa-square"]'> </div>

Viele Grüße
Fabian

Genau das wars, super. Jetzt muss ich nur noch kleine Feinheiten bereinigen, z.B.: Beschriftung "WC" oder das Gridster-Gerüst, damit keine Scrollbalken mehr angezeigt werden.

Ingo298 · 03 Oktober 2018, 12:50:54

Hallo zusammen,
nachdem ich gestern wieder mal ein update durchgeführt habe, habe ich nun folgendes Problem.
Wenn ich das Widget Chart benutze wird das Aussehen des gesamten UI verändert (andere Schriftart, größe der Schrift)
Wo könnte das Problem liegen?

Das Problem besteht auch bei meine tablet_prod instans welche durch das Update nicht verändert wird

MfG Ingo

moonsorrox · 03 Oktober 2018, 13:03:15

ich denke das ist deine komplette Icon Anpassung, soll heißen das du evtl. eine Größe runter gehen solltest...! Nur eine Vermutung

Sailor · 03 Oktober 2018, 17:38:53

Ein herzerfrischendes "MoinMoin" vom hintern-Deich vorweg

seit dem ich gestern ein Update der "fhem-tablet-ui.css" vorgenommen habe, fällt mir beim Thermostat Widget die Soll-Temperatur aus dem Rahmen.
Allerdings nur im Chrome Version 69.0.3497.100 (Offizieller Build) (64-Bit) Browser.
Im Firefox 62.0.3 (64-Bit) ist alles ok.

Was ist denn seit gestern geändert worden?

Anfang der index.html

Code Auswählen


<!DOCTYPE html>
<html>
	<head>
		<!--
		 /* FHEM tablet ui */
		 /*
		 */
		-->

		<!-- Basic Stylesheet with Darkblue AddOn -->
		<link rel="stylesheet" href="css/fhem-tablet-ui.css" />
		<link rel="stylesheet" href="css/fhem-darkblue-ui.css" />

		<!-- Different Stylesheet depending on daylight conditions calculated by the twilight module -->
		<link rel="stylesheet" href="css/lightscene-0.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="0" data-get-off="!0" />
		<link rel="stylesheet" href="css/lightscene-1.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="1" data-get-off="!1" />
		<link rel="stylesheet" href="css/lightscene-2.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="2" data-get-off="!2" />
		<link rel="stylesheet" href="css/lightscene-3.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="3" data-get-off="!3" />
		<link rel="stylesheet" href="css/lightscene-4.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="4" data-get-off="!4" />
		<link rel="stylesheet" href="css/lightscene-5.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="5" data-get-off="!5" />
		<link rel="stylesheet" href="css/lightscene-6.css" data-type="theme" data-device="OS_Twilight" data-get="light" data-get-on="6" data-get-off="!6" />

		<script src="js/fhem-tablet-ui.js" defer></script>

		<title>Sailor's Home</title>
	</head>

	<meta http-equiv="Cache-Control"	content = "no-cache, no-store, must-revalidate" />
	<meta name = "longpoll_type" 		content = "websocket" />
	<meta name = "GoogleMapsApiKey" 	content = "AIzaSyAqjYRFJUa7Kc_VUsyDOXj_Ny5gnQQEotQ" />
	<meta name = "viewport" 			content = "width=device-width, initial-scale=1.0" />
	<meta name = "gridster_disable" 	content = "1"  />
    <meta name = "gridster_cols" 		content = "10" />
	<meta name = "gridster_rows" 		content = "6"  />		
	<meta name = "widget_margin" 		content = "5"  />
	

<!-- 	<div data-type="reload" 
		 data-device="UI_ReloadFtui" 
		 data-get-on="1" 
		 data-set-off="0">
	</div> -->


	<body style="overflow:hidden;" onload="createImageLayer();" > 
		<div class="gridster">
			<ul>
				<li data-row="1" data-col="1" data-sizex="1" data-sizey="6" class="semitransparent">

Thermostat Kitchen:

Code Auswählen


<!-- ******* Kitchen ********************************************************************************************* -->
<li data-row="1" data-col="1" data-sizex="2" data-sizey="3" class="semitransparent">
	<header><div data-type="label" class="large">Kitchen</div></header>
	<br>
	<div class="table top">
		<div class="row center">
			<div class="cell big">
				T =&nbsp;
			</div>
			<div class="cell bigger">
				<div data-type	= "label"
					 data-device	= "KT_Thermostat_Climate" data-get="measured-temp" data-unit="%B0C%0A" data-fix="1"
					 data-limits	= '[-20,20,24,29]' data-colors='["skyblue","darkorange","orangered","red"]'>
				</div>
			</div>
			<div class="cell big">
				&nbsp;&nbsp;&nbsp;&nbsp;
			</div>
			<div class="cell big">
				&phi; =&nbsp;
			</div>
			<div class="cell bigger">
				<div data-type	 = "label"
					 data-device = "KT_Thermostat_Climate" data-get="humidity" data-unit="%rel%0A" data-fix="0"
					 data-limits = '[0,40,60,80]' data-colors='["skyblue","darkorange","orangered","red"]'>
				</div>
			</div>				
		</div>
	</div>
	
	<br>
			
	<div class="table top">
		<div class="row center">
			<div class="cell top-center">
				<div class="row top-center">
					<div data-type				= "switch"
						 data-device			= "KT_Thermostat_Climate"
						 data-get				= "controlMode"
						 data-get-on			= '["auto","manual"]'
						 data-icons				= '["oa-sani_heating_automatic","oa-sani_heating_manual"]'
						 data-colors			= '["darkgreen","darkblue"]'
						 data-set-states		= '["controlMode manual","controlMode auto"]'
						 data-background-icon	= "fa-square"
						 data-background-colors	= '["dimgrey","dimgrey"]'>
					</div>
				</div>
				<div class="row top-center">
					<br>
					<br>
					<br>
				</div>
				<div class="row top-center">
					<div data-type				= "switch"
						 data-device			= "KT_Thermostat"
						 data-get				= "R-btnLock"
						 data-get-on			= '["on|set_on","off|set_off"]'
						 data-icons				= '["oa-secur_locked","oa-secur_open"]'
						 data-colors			= '["darkred","darkblue"]'
						 data-set-states		= '["regSet btnLock off","regSet btnLock on"]'
						 data-background-icons	= '["fa-square","fa-square"]'
						 data-background-colors	= '["dimgrey","dimgrey"]'>
					</div>
				</div>
			</div>
			<div class="cell center big">		
				<div data-type	 = "thermostat"
					 data-device = "KT_Thermostat_Climate"
					 data-height = "150"
					 data-width	 = "150"
					 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">
				</div>		
			</div>
			<div class = "cell top-center">	
				<div class = "row top-center">
					<div data-type					= "push"
						 data-device				= "KT_Thermostat_Climate"
						 data-set					= "controlMode"
						 data-set-off				= ""
						 data-on-color				= "darkred"
						 data-off-color				= "black"
						 data-icon					= "fs-sani_heating_boost"
						 data-background-icon		= "fa-square"
						 data-on-background-color	= "dimgrey"
						 data-off-background-color	= "dimgrey"
						 data-set-on				= "boost"
						 data-countdown			  	= "300">
					</div>
				</div>
				<div class = "row top-center">
				</div>
				<div class = "row top-center">
					<br>
					<br>
					<br>
				</div>
				<div class = "row top-center">
					<div data-type					= "symbol"
						 data-device				= "KT_Window"
						 data-get					= "state"
						 data-states				= '["closed","open"]'
						 data-icons					= '["oa-fts_window_1w","oa-fts_window_1w_open"]'
						 data-colors				= '["darkgreen","#ff0000"]'
						 data-background-icon		= "fa-square"
						 data-on-background-color	= "dimgrey"
						 data-off-background-color	= "dimgrey">
					</div>
				</div>
			</div>
		</div>
	</div>
	<br>
	<br>
	<div class="table">
		<div class="row center">
			<div class="cell">
				<div data-type = "label" class="cell">
					Roller Shutter
				</div>
			</div>
			<div class="cell">
				<div data-type = "label" class="cell">
					Ceiling Light
				</div>
			</div>
		</div>
		<div class="row center">
			<!-- ******* Blind ******************************************************************************************** -->
			<div class="cell">
				<div class="container">
					<div data-type="circlemenu" class="cell circlemenu">
						<ul class="menu">
							<li>
								<div data-type		= "symbol" 
									 data-device	= "KT_Blind" 
									 data-get		= "state" 
									 data-states	= '["on","off","100","9[0-9]","8[0-9]","7[0-9]","6[0-9]","5[0-9]","4[0-9]","3[0-9]","2[0-9]","1[0-9]","[0-9]"]'
									 data-icons		= '["oa-fts_window_2w","oa-fts_shutter_100","oa-fts_shutter","oa-fts_shutter_10","oa-fts_shutter_20","oa-fts_shutter_30","oa-fts_shutter_40","oa-fts_shutter_50","oa-fts_shutter_60","oa-fts_shutter_70","oa-fts_shutter_80","oa-fts_shutter_90","oa-fts_shutter_100"]'
									 data-colors	= '["#505050","#505050","#505050","#505050","#505050","#505050","#505050","#505050","#505050","#505050","#505050","#505050","#505050"]'>
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "stop"
									 data-icon	 	= "fa-hand-stop-o"
									 data-off-color	= "red"
									 data-on-color	= "red">
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "off"
									 data-icon		= "fa-angle-up"
									 data-off-color	= "green"
									 data-on-color	= "green">
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "100"
									 data-icon		= "oa-fts_window_2w">
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "80"
									 data-icon		= ""><FONT SIZE=3>80%</FONT>
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "60"
									 data-icon		= ""><FONT SIZE=3>60%</FONT>
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "40"
									 data-icon		= ""><FONT SIZE=3>40%</FONT>
								</div>
							</li>								
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "20"
									 data-icon		= ""><FONT SIZE=3>20%</FONT>
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "0"
									 data-icon		= "oa-fts_shutter_100">
								</div>
							</li>
							<li>
								<div data-type		= "push"
									 data-device	= "KT_Blind"
									 data-set-on	= "on"
									 data-icon		= "fa-angle-down"
									 data-off-color	= "green"
									 data-on-color	= "green">
								</div>
							</li>
						</ul>
					</div>
				</div>
			</div>
			<!-- ******* Ceiling Light ************************************************************************************ -->
			<div class="cell center ">
				<div data-type	  = "switch"
					 data-device  = "KT_Light_Sw"
					 data-get	  = "state"
					 data-get-on  = "[0-9]{1,3}|on"
					 data-get-off = "off"
					 data-set-on  = "on"
					 data-set-off = "off">
				</div>
			</div>
		</div>
	</div>
</li>

Gruss
    Sailor

setstate · 04 Oktober 2018, 20:06:56

Das passiert immer, wenn Thermostat zu sehr gequetscht wird.

In deiner Anordnung bekommt der mittlere Teil 33,3% width. Das Thermostat soll aber laut deiner Definition 150px breit sein.
Wenn die 33,3% keine 150px hergeben, schwuppt die innere Zahl raus.
Du musst das Thermostat kleiner machen: z.B.

Code Auswählen

		data-height = "138"
			data-width	 = "138"

Sailor · 04 Oktober 2018, 21:56:28

Hallo setstate

Zitat von: setstate am 04 Oktober 2018, 20:06:56
Das passiert immer, wenn Thermostat zu sehr gequetscht wird.
In deiner Anordnung bekommt der mittlere Teil 33,3% width. Das Thermostat soll aber laut deiner Definition 150px breit sein.
Wenn die 33,3% keine 150px hergeben, schwuppt die innere Zahl raus.
Du musst das Thermostat kleiner machen: z.B.

Code Auswählen Erweitern
data-height = "138" data-width = "138"

Habe es auf 124 verkleinert und hat geklappt.
Sind jetzt zwar merklich kleiner, aber ich werde mal daran nachforschen, wie ich die Spaltenmits der Buttons links und rechts neben dem Thermostat auf 20 - 25% limitiert bekomme.
Dann kann ich die Thermostate auch wieder vergrößern.

DANKE!

Gruss
Sailor

setstate · 05 Oktober 2018, 00:37:30

das kann man mit cell-25 oder cell-1-4

Sailor · 05 Oktober 2018, 21:38:27

Hallo setstate

Zitat von: setstate am 05 Oktober 2018, 00:37:30
das kann man mit cell-25 oder cell-1-4

Danke, auch der Tipp hat geklappt!

Gruss
Sailor

Vaddi · 05 Oktober 2018, 23:39:06

Mir ist gestern noch etwas aufgefallen.
Leider ist die on-for-timer Anzeige bei meinem Pushbutton fehlerhaft.

Sailor · 06 Oktober 2018, 01:12:37

Kann ich in Chrom bestätigen.
Ausserdem ist sie bei mir Amber statt blau...

Gruss
Sailor

Vaddi · 06 Oktober 2018, 10:39:22

Das blaue kommt bei mir von der css, habe ich so eingestellt.

Tabularasa · 09 Oktober 2018, 22:15:24

Servus. Ich glaube seitdem ich das Update gemacht hatte, dauert es an meinem Tablet ewig bis sich alles aktualisiert hat. Wenn ich zB um 22 Uhr den Bildschirm aus mache und morgens wieder an dann geht er alles durch was seitdem passiert ist. Also zB der Homestatus ändert sich mehrmals auf absent, sleep wieder home usw... Die letzte Aktualisierung hat bis zum aktuellen Stand über 60 Sekunden gedauert. Das ging vorher unter 10 Sekunden weil es da nicht alles durchgegangen ist. Habe auch schon fade_time' content='0' ausprobiert aber da ändert sich nix. Gibt es da einen Vorschlag woran es liegen kann, bzw was ich noch probieren kann? Danke

Edit
Von gestern um 20 Uhr bis eben um 8 habe ich sieben Zustandswechsel gezählt mit einer Aktualisierungszeit von 74 Sekunden $:-\$

Sailor · 10 Oktober 2018, 14:13:29

Hallo Vaddi

Zitat von: Vaddi am 06 Oktober 2018, 10:39:22
Das blaue kommt bei mir von der css, habe ich so eingestellt.

Ich habe auch die "css/fhem-darkblue-ui.css" im Einsatz.
Trotzdem ist der Ring bei mir Amber.

Hast du noch was individuell nachgebessert?

Gruss
Sailor

Vaddi · 10 Oktober 2018, 16:26:05

Ja, habe ich. Kann das nachher hier mal posten, wenn ich Zuhause bin.

pataya · 10 Oktober 2018, 17:22:45

Moin setstate,

möchte kein Thread extra aufmachen, da das Problem scheinbar nur mich betrifft.
Bekomme auf jeden Fall seit dem Update 2.7.6 folgende Fehlermeldung beim Aufruf von FTUI angezeigt:

Code Auswählen

Uncaught SyntaxError: Unexpected token (
    at Object.substitution (fhem-tablet-ui.js:176)
    at update_value (widget_label.js:34)
    at HTMLDivElement.<anonymous> (widget_label.js:149)
    at Function.each (jquery.min.js:2)
    at m.fn.init.each (jquery.min.js:2)
    at Object.update (widget_label.js:143)
    at Object.<anonymous> (fhem-tablet-ui.js:440)
    at Function.each (jquery.min.js:2)
    at Object.update (fhem-tablet-ui.js:437)
    at checkReading (fhem-tablet-ui.js:1070)

Liegt, wie ich herausgefunden habe, an Zeile 175 der fhem-tablet-ui.js:

≤ v2.7.5 (funktioniert):

Code Auswählen


else if (subst.match(/.*\(\)/))

v2.7.6 (Problem s. o.):

Code Auswählen


else if (subst.match(/.*\(.*\)/))

Vielleicht kannst du damit ja was anfangen.