#1471: show speaker status

git-svn-id: https://xpra.org/svn/Xpra/trunk@18737 3bb7dfac-3a0b-4e04-842a-767bc560f471

src/html5/css/client.css

@@ -339,6 +339,11 @@ div.windowinfocus {
 	color: #fff;
 }
 
+.audio {
+	float: right;
+	padding-right: 10px;
+}
+
 @media screen {
 	.notifications .alert.visible {
 		margin-top: 0;

src/html5/index.html

@@ -70,6 +70,11 @@
 				<div class="clock_block">
 					<p id="clock_text"></p>
 				</div>
+				<div class="audio">
+					<div id="speaker">
+						<img id="speaker_icon" src="./icons/speaker-off.png" alt="speaker off" />
+					</div>
+				</div>
 			</div>
 		</div>
 
@@ -596,6 +601,25 @@ <h3>Version 2.3</h3>
 				if (getboolparam("clock")) {
 					init_clock(client);
 				}
+		    	client.on_audio_state_change = function(newstate, details) {
+		    		var tooltip = "";
+		    		var image_name = "";
+		    		if (newstate=="playing") {
+		    			image_name = "speaker.png";
+		    			tooltip = details || "playing";
+		    		}
+		    		else if (newstate=="waiting") {
+		    			image_name = "speaker-buffering.png";
+		    			tooltip = details || "buffering";
+		    		}
+		    		else {
+		    			image_name = "speaker-off.png";
+		    			tooltip = details || "off";
+		    		}
+		    		clog("audio-state:", newstate);
+		    		$("#speaker_icon").attr("src", "./icons/"+image_name);
+		    		$("#speaker_icon").attr("title", tooltip);
+		    	};
 				document.addEventListener("visibilitychange", function (e) {
 					window_ids = Object.keys(client.id_to_window);
 					clog("visibilitychange hidden=", document.hidden);

src/html5/js/Client.js

@@ -2258,18 +2258,23 @@ XpraClient.prototype._process_sound_data = function(packet, ctx) {
 		ctx.add_sound_data(codec, buf, metadata);
 	}
 	catch(e) {
+		this.on_audio_state_change("error", ""+e);
 		this.error("audio failed:", e);
 		this.close_audio();
 	}
 }
 
+XpraClient.prototype.on_audio_state_change = function(newstate, details) {
+	//can be overriden
+}
 
 XpraClient.prototype.add_sound_data = function(codec, buf, metadata) {
 	var MIN_START_BUFFERS = 4;
 	var MAX_BUFFERS = 250;
 	this.debug("audio", "sound-data: ", codec, ", ", buf.length, "bytes");
 	if (this.audio_buffers.length>=MAX_BUFFERS) {
 		this.warn("audio queue overflowing: "+this.audio_buffers.length+", stopping");
+		this.on_audio_state_change("error", "queue overflow");
 		this.close_audio();
 		return;
 	}
@@ -2322,6 +2327,7 @@ XpraClient.prototype._audio_start_stream = function() {
 	else {
 		this.audio_aurora_ctx.play();
 	}
+	this.on_audio_state_change("playing", ""+this.audio_framework+" playing "+this.audio_codec+" stream");
 }
 
 XpraClient.prototype._audio_ready = function() {