Sonos Frontend mit Raumauswahl

e3xtreme · 17 Dezember 2015, 21:37:10

Hallo, ich habe an einem Sonos Frontend gearbeitet und wollte quasi das App Interface nachbauen, jedoch stoße ich bei zwei Punkten an die Grenzen meiner HTML Kenntnisse.

Ich würde gerne eine Variable durch ein Select-Widget setzen und damit für alle anderen Widgets den Raum festlegen. Damit könnte ich dann wie im tatsächlichem App mit nur einer Instanz der Cover und Buttons auskommen, hat da wer eine idee?

Weiters würde ich gerne die derzeitige Position im Lied per Slider angezeigt bekommen und im besten Fall in Echtzeit spulen können, da bei meinem Sonos-Fhem Device jedoch die 'currentTrackPosition' immer auf 00:00:00 bleibt hilft mir das nicht, hab ich da schon in der Definition einen Fehler, oder zeigt das bei euch auch immer nur Nullen?

Danke

Hier mal der derzeitige code, gerne auch weiterzuverwenden.

Code Auswählen

<html>
	<title>E3 FHEM Musik</title>
	<head>
	</head>
	<body>
		<div class="gridster">
			<ul>
				<li data-row="1" data-col="1" data-sizex="1" data-sizey="5" data-template="menu.html"/>

				<li data-row="3" data-col="2" data-sizex="2" data-sizey="3.5">
					<header>Sonos Schlafzimmer</header>
					<div class="centered container" style="max-width:16em;">
						<div data-type="image" data-device="Sonos_Schlafzimmer" data-get="currentAlbumArtURL" data-size="100%"/>
						<div data-type="label" data-device="Sonos_Schlafzimmer" data-get="infoSummarize1"/>
						<div class="centered container">

							<div data-type="push" data-device="Sonos_Schlafzimmer"
									data-icon="fa-step-backward" data-background-icon="-" data-set="Previous"
									data-set-on='["1","0"]' data-set-off="0" 	data-on-color="#ffffff" data-off-color="#666666" class="inline">
							</div>
							<div data-type="multistatebutton"
									data-device="Sonos_Schlafzimmer"
									data-get="transportState"
									data-get-on='["PAUSED_PLAYBACK","PLAYING"]'
									data-set='["PLAY","PAUSE"]'
									data-set-default="PAUSE"
									data-icons='["fa-play","fa-pause"]'
									data-background-icon="-"
									data-colors='["#666666", "#666666"]'
									class="cell"/>
							<div data-type="push" data-device="Sonos_Schlafzimmer"
									data-icon="fa-step-forward" data-background-icon="-" data-set="Next"
									data-set-on='["1","0"]' data-set-off="0" 	data-on-color="#ffffff" data-off-color="#666666" class="inline"></div>
							<div class="centered container">
								<div data-type="switch" data-device="Sonos_Schlafzimmer" data-icon="fa-volume-off" data-background-icon="-" 
										data-set="Mute" data-set-on='["1","0"]' data-set-off="0" data-get="Mute" 	data-on-color="#666666" data-off-color="#ffffff" class="top-space inline">
								</div>
								<div data-type="slider" data-device="Sonos_Schlafzimmer" data-get="Volume" data-set="Volume" data-min="0" data-max="100"  		class=" inline horizontal">
								</div>
							</div>
						</div>
						<div>
						</li>
					</ul>
				</div>
			</body>
		</html>

justme1968 · 17 Dezember 2015, 21:57:36

für die aktuelle position brauchst du etwas js code auf browser seite der den indikator weiter bewegt so lange der status auf play
bleibt. das jedes mal von FHEM aus zu aktualisieren wäre sehr ineffizient.

irgendwo im sonos thread gab es dazu schon mal etwas.

gruss
andre

dev0 · 17 Dezember 2015, 22:04:16

Reinerlein hatte mir den Tipp mit dem js timer gegeben. Da js und ich wohl keine Freunde mehr werden, habe ich es für smartvisu simple und ineffizient über ein get trackpos alle x sekunden gelöst, solange ein Track gespielt wird.

e3xtreme · 17 Dezember 2015, 22:24:27

Hmmm.... danke schonmal, soll ich diesen Timer auf Tablet UI seite programmieren oder im FHEM selbst, das Problem liegt ja daran, dass der Wert fix auf 00:00:00 eingestellt ist. Laut einem Changelog gabs da mal Troubles mit dem Sonos speak drum wurde der Wert fest gesetzt... oder soll der Timer beim ändern eines andren Attributes mitlaufen und die Zeit von der Gesamt-Tracklänge abziehen?

Code Auswählen

# 16.01.2015
 #	Speak hatte eine fehlerhafte Überprüfung der Attribute, und konnte nicht ausgeführt werden.
+#	Bei Streams wird das Reading "currentTrackPosition" nun fest auf "0:00:00" gesetzt, und nicht mehr beim Player angefragt

justme1968 · 17 Dezember 2015, 23:06:24

der timer gehört auf browser seite.

das 0:00:00 betrifft streams die keine currentTrackPosition haben. titel aus deiner mediathek haben die normalerweise schon. aber sich dann ist der timer im
browser sinnvoll.

gruss
andre

dev0 · 18 Dezember 2015, 07:42:19

Zitat von: e3xtreme am 17 Dezember 2015, 22:24:27
das Problem liegt ja daran, dass der Wert fix auf 00:00:00 eingestellt ist.

Du kennst die Tracklänge (currentTrackDuration) und den Startzeitpunkt des Tracks (event currentTrackPosition -> 0:00:00), dann kannst du einen js timer staten, der am Trackende zB. 100% erreicht.

Reiners Antwort zu meiner Anfrage bezüglich des Themas findest Du hier. Falls Du ein Blick auf mein Sonos smartvisu Widget werfen möchtest, dann findest du das hier.

e3xtreme · 18 Dezember 2015, 18:43:39

Wow... das sieht ja genial aus, werd mir das mal genauer ansehen, wenn ich Zeit hab und dir das ein oder andere Codeschnipsel klauen