3.5.250. Temporary implementation of getVideoInfo() while Twitch gets their player in order.

changelog.html

@@ -1,3 +1,8 @@
+<div class="list-header">3.5.250</div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Changed: Stream Latency now works with the HTML5 player! For now, until Twitch implements <code>getVideoInfo</code>, FFZ will parse stats from the overlay that shows on-stream.</li>
+</ul>
+
 <div class="list-header">3.5.249</div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Added: Option to hide the Bits Tag display on certain channels (notably EVO).</li>

src/ember/player.js

@@ -154,6 +154,136 @@ FFZ.prototype.modify_twitch_player = function(player) {
 
 				container.insertBefore(btn, el.nextSibling);
 			}
+
+			// Check player statistics. If necessary, override getVideoInfo.
+			if ( ! Object.keys(player.getVideoInfo()).length && ! player.ffz_stats_hooked ) {
+				f.log("No Video Data. Installing handler.");
+				player.ffz_stats_hooked = true;
+
+				var stats_el = stats[0],
+					toggle_btn = this.$('.js-stats-toggle'),
+
+					setup_player = function() {
+						// If this player is destroyed, stop trying.
+						if ( ! document.contains(stats_el) )
+							return;
+
+						stats_el.classList.add('hidden');
+
+						if ( stats_el.getAttribute('data-state') !== 'on' )
+							toggle_btn.click();
+
+						setTimeout(function() {
+							var res = jQuery('.js-stat-display-resolution', stats_el).text();
+							if ( ! res || ! res.length ) {
+								// Not available yet. Keep going.
+								toggle_btn.click();
+								setTimeout(setup_player, 100);
+								return;
+							}
+
+							toggle_btn.text('Show Video Stats');
+
+							jQuery('.js-stats-close', stats_el).remove();
+							/*off().on('click', function(e) {
+								stats_el.classList.add('hidden');
+								toggle_btn.text('Show Video Stats');
+							});*/
+
+							toggle_btn.off().on('click', function(e) {
+								var visible = stats_el.classList.contains('hidden');
+								stats_el.classList.toggle('hidden', ! visible);
+								this.textContent = (visible ? 'Hide' : 'Show') + ' Video Stats';
+								e.preventDefault();
+								return false;
+							});
+
+							player.getVideoInfo = function() {
+								var output = {};
+
+								// Video Resolution
+								var el = stats_el.querySelector('.js-stat-video-resolution'),
+									match = el && / *([\d,]+) *x *([\d,]+)/i.exec(el.textContent);
+								if ( match ) {
+									output.vid_width = parseInt(match[1]);
+									output.vid_height = parseInt(match[2]);
+								}
+
+								// Display Resolution
+								el = stats_el.querySelector('.js-stat-display-resolution');
+								match = el && / *([\d,]+) *x *([\d,]+)/i.exec(el.textContent);
+								if ( match ) {
+									output.stageWidth = output.vid_display_width = parseInt(match[1]);
+									output.stageHeight = output.vid_height = parseInt(match[2]);
+								}
+
+								// FPS
+								el = stats_el.querySelector('.js-stat-fps');
+								if ( el && el.textContent )
+									output.current_fps = parseInt(el.textContent);
+
+								// Skipped Frames
+								el = stats_el.querySelector('.js-stat-skipped-frames');
+								if ( el && el.textContent )
+									output.dropped_frames = parseInt(el.textContent);
+
+								// Buffer Size
+								el = stats_el.querySelector('.js-stat-buffer-size');
+								if ( el && el.textContent ) {
+									var val = parseFloat(el.textContent);
+									if ( ! isNaN(val) && isFinite(val) ) {
+										if ( val < 1000 ) val *= 1000;
+										output.hls_buffer_duration = val;
+									}
+								}
+
+								// Latency to Broadcaster
+								el = stats_el.querySelector('.js-stat-hls-latency-broadcaster');
+								var el2 = stats_el.querySelector('.js-stat-hls-latency-encoder');
+
+								if ( el && el.textContent && el2 && el2.textContent ) {
+									var val = parseFloat(el.textContent),
+										val2 = parseFloat(el2.textContent);
+
+									if ( ! isNaN(val) && isFinite(val) && ! isNaN(val2) && isFinite(val2) ) {
+										if ( val < 1000 && val2 < 1000) {
+											val *= 1000;
+											val2 *= 1000;
+										}
+
+										if ( val > val2 ) {
+											output.hls_latency_broadcaster = val;
+											output.hls_latency_encoder = val2;
+										} else {
+											output.hls_latency_broadcaster = val2;
+											output.hls_latency_encoder = val;
+										}
+									}
+								}
+
+								// Playback Rate
+								el = stats_el.querySelector('.js-stat-playback-rate');
+								if ( el && el.textContent ) {
+									var val = parseFloat(el.textContent);
+									if ( ! isNaN(val) && isFinite(val) ) {
+										output.bandwidth = output.current_bitrate = val;
+										output.playback_bytes_per_second = val * 1024 / 8;
+									}
+								}
+
+								// Other Stats
+								output.paused = player.paused;
+								output.playing = ! player.paused;
+								output.volume = player.volume;
+
+								return output;
+							}
+
+						}, 10);
+					};
+
+				setup_player();
+			}
 		}
 	});
 }

src/main.js

@@ -37,7 +37,7 @@ FFZ.msg_commands = {};
 
 // Version
 var VER = FFZ.version_info = {
-	major: 3, minor: 5, revision: 249,
+	major: 3, minor: 5, revision: 250,
 	toString: function() {
 		return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
 	}