From 5f0f6fec0889746348b58dd7e433934c9d7065c9 Mon Sep 17 00:00:00 2001
From: SirStendec <sir@stendec.me>
Date: Sun, 2 Oct 2016 18:01:40 -0400
Subject: [PATCH] Closes #7 Closes #6 Closes #4

---
 changelog.html          |  6 ++++++
 src/ember/channel.js    | 42 ++++++++++++++++++++---------------------
 src/ember/chat-input.js |  2 +-
 src/ember/layout.js     | 32 ++++++++++++++++++-------------
 src/main.js             |  2 +-
 style.css               | 20 ++++++++++++++++++++
 6 files changed, 68 insertions(+), 36 deletions(-)

diff --git a/changelog.html b/changelog.html
index 2332c46e..ec416d20 100644
--- a/changelog.html
+++ b/changelog.html
@@ -1,3 +1,9 @@
+<div class="list-header">3.5.306 <time datetime="2016-10-02">(2016-10-02)</time></div>
+<ul class="chat-menu-content menu-side-padding">
+	<li>Fixed: FFZ was not connecting to the chat of hosted channels.</li>
+	<li>Fixed: Show channel metadata in theater mode when hovering over the player. (Still not working correctly in Portrait Mode.)</li>
+</ul>
+
 <div class="list-header">3.5.305 <time datetime="2016-10-01T17:40">(2016-10-01)</time></div>
 <ul class="chat-menu-content menu-side-padding">
 	<li>Added: Badge previews to the <code>Hidden Badges</code> setting to make it more obvious how to hide any given badge when the names don't quite lien up.</li>
diff --git a/src/ember/channel.js b/src/ember/channel.js
index d66380d7..684a0a82 100644
--- a/src/ember/channel.js
+++ b/src/ember/channel.js
@@ -79,42 +79,42 @@ FFZ.prototype.setup_channel = function() {
 			if ( this._ffz_update_timer )
 				clearTimeout(this._ffz_update_timer);
 
-			if ( ! this.get('channel.id') )
+			if ( ! this.get('channelModel.id') )
 				return;
 
 			this._ffz_update_timer = setTimeout(this.ffzCheckUpdate.bind(this), 55000 + (Math.random() * 10000));
-		}.observes("channel.id"),
+		}.observes("channelModel"),
 
 		ffzCheckUpdate: function() {
 			var t = this,
-				id = t.get('channel.id');
+				channel_id = t.get('channelModel.id');
 
-			id && utils.api.get("streams/" + id, {}, {version:3})
+			channel_id && utils.api.get("streams/" + channel_id, {}, {version:3})
 				.done(function(data) {
 					if ( ! data || ! data.stream ) {
 						// If the stream is offline, clear its created_at time and set it to zero viewers.
-						t.set('channel.stream.createdAt', null);
-						t.set('channel.stream.viewers', 0);
+						t.set('channelModel.stream.createdAt', null);
+						t.set('channelModel.stream.viewers', 0);
 						return;
 					}
 
-					t.set('channel.stream.createdAt', utils.parse_date(data.stream.created_at) || null);
-					t.set('channel.stream.viewers', data.stream.viewers || 0);
+					t.set('channelModel.stream.createdAt', utils.parse_date(data.stream.created_at) || null);
+					t.set('channelModel.stream.viewers', data.stream.viewers || 0);
 
 					var game = data.stream.game || (data.stream.channel && data.stream.channel.game);
 					if ( game ) {
-						t.set('channel.game', game);
+						t.set('channelModel.game', game);
 					}
 
 					if ( data.stream.channel ) {
 						if ( data.stream.channel.status )
-							t.set('channel.status', data.stream.channel.status);
+							t.set('channelModel.status', data.stream.channel.status);
 
 						if ( data.stream.channel.views )
-							t.set('channel.views', data.stream.channel.views);
+							t.set('channelModel.views', data.stream.channel.views);
 
-						if ( data.stream.channel.followers && t.get('channel.followers.isLoaded') )
-							t.set('channel.followers.total', data.stream.channel.followers);
+						if ( data.stream.channel.followers && t.get('channelModel.followers.isFulfilled') )
+							t.set('channelModel.followers.content.meta.total', data.stream.channel.followers);
 					}
 
 				})
@@ -124,12 +124,12 @@ FFZ.prototype.setup_channel = function() {
 		},
 
 		ffzHostTarget: function() {
-			var target = this.get('channel.hostModeTarget'),
+			var target = this.get('channelModel.hostModeTarget'),
 				name = target && target.get('name'),
 				id = target && target.get('id'),
 				display_name = target && target.get('display_name');
 
-			if ( id !== f.__old_host_target ) {
+			/*if ( id !== f.__old_host_target ) {
 				if ( f.__old_host_target )
 					f.ws_send("unsub", "channel." + f.__old_host_target);
 
@@ -138,7 +138,7 @@ FFZ.prototype.setup_channel = function() {
 					f.__old_host_target = id;
 				} else
 					delete f.__old_host_target;
-			}
+			}*/
 
 			if ( display_name )
 				FFZ.capitalization[name] = [display_name, Date.now()];
@@ -152,7 +152,7 @@ FFZ.prototype.setup_channel = function() {
 			if ( f.settings.srl_races )
 				f.rebuild_race_ui();
 
-		}.observes("channel.hostModeTarget")
+		}.observes("channelModel.hostModeTarget")
 	});
 
 	Channel.ffzUpdateInfo();
@@ -1290,7 +1290,7 @@ FFZ.settings_info.channel_bar_bottom = {
 
 		var Layout = utils.ember_lookup('service:layout');
 		if ( Layout )
-			Ember.propertyDidChange(Layout, 'windowHeight');
+			Ember.propertyDidChange(Layout, 'ffzExtraHeight');
 	}
 }
 
@@ -1324,7 +1324,7 @@ FFZ.settings_info.hide_channel_banner = {
 
 		var Layout = utils.ember_lookup('service:layout');
 		if ( Layout )
-			Ember.propertyDidChange(Layout, 'windowHeight');
+			Ember.propertyDidChange(Layout, 'ffzExtraHeight');
 	}
 
 }
@@ -1348,7 +1348,7 @@ FFZ.settings_info.channel_bar_collapse = {
 
 		var Layout = utils.ember_lookup('service:layout');
 		if ( Layout )
-			Ember.propertyDidChange(Layout, 'windowHeight');
+			Ember.propertyDidChange(Layout, 'ffzExtraHeight');
 	}
 }
 
@@ -1380,7 +1380,7 @@ FFZ.settings_info.channel_title_top = {
 
 		var Layout = utils.ember_lookup('service:layout');
 		if ( Layout )
-			Ember.propertyDidChange(Layout, 'windowHeight');
+			Ember.propertyDidChange(Layout, 'ffzExtraHeight');
 	}
 }
 
diff --git a/src/ember/chat-input.js b/src/ember/chat-input.js
index 300fc564..31b49576 100644
--- a/src/ember/chat-input.js
+++ b/src/ember/chat-input.js
@@ -185,7 +185,7 @@ FFZ.settings_info.input_complete_without_prefix = {
 
 FFZ.settings_info.input_emoji = {
 	type: "boolean",
-	value: false,
+	value: true,
 
 	category: "Chat Input",
 	//visible: false,
diff --git a/src/ember/layout.js b/src/ember/layout.js
index 1709c355..48d52326 100644
--- a/src/ember/layout.js
+++ b/src/ember/layout.js
@@ -174,15 +174,16 @@ FFZ.prototype.setup_layout = function() {
 		isTooSmallForRightColumn: function() {
 			if ( ! f.has_bttv && this.get('portraitMode') ) {
 				var size = this.get('playerSize'),
-					height = size[1];
+					extra = this.get('ffzExtraHeight'),
+					height = size[1] + extra;
 
 				// Make sure we have at least a bit of room for the chat.
-				return this.get("windowHeight") < (height + 120 + 60 + 200);
+				return this.get("windowHeight") < height;
 
 			} else
 				return this.get("windowWidth") < (1090 - this.get('rightColumnWidth'))
 
-		}.property("windowWidth", "rightColumnWidth", "playerSize", "windowHeight"),
+		}.property("ffzExtraHeight", "windowWidth", "rightColumnWidth", "playerSize", "windowHeight"),
 
 		contentWidth: function() {
 			var left_width = this.get("isLeftColumnClosed") ? 50 : 240,
@@ -192,15 +193,17 @@ FFZ.prototype.setup_layout = function() {
 
 		}.property("windowWidth", "portraitMode", "isRightColumnClosed", "isLeftColumnClosed", "rightColumnWidth"),
 
+		ffzExtraHeight: function() {
+			return (f.settings.channel_bar_collapse ? 10 : 60) + 15 +
+				(f.settings.channel_title_top === 2 ? 20 : f.settings.channel_title_top > 0 ? 55 : 0) +
+				(f.settings.channel_title_top ? 70 : 80);
+		}.property(""),
+
 		playerSize: function() {
 			var h = this.get('windowHeight'),
 				c = this.get('PLAYER_CONTROLS_HEIGHT'),
 				r = this.get('contentWidth'),
-
-				extra_height =
-					(f.settings.channel_bar_collapse ? 10 : 60) + 15 +
-					(f.settings.channel_title_top === 2 ? 20 : f.settings.channel_title_top > 0 ? 55 : 0) +
-					(f.settings.channel_title_top ? 70 : 80),
+				extra_height = this.get('ffzExtraHeight'),
 
 				i = Math.round(9 * r / 16) + c,
 				d = h - extra_height,
@@ -211,7 +214,7 @@ FFZ.prototype.setup_layout = function() {
 				s = Math.floor(Math.min(i, c));
 
 			return [l, o, s];
-		}.property("contentWidth", "windowHeight", "portraitMode", "PLAYER_CONTROLS_HEIGHT"),
+		}.property("ffzExtraHeight", "contentWidth", "windowHeight", "portraitMode", "PLAYER_CONTROLS_HEIGHT"),
 
 		playerStyle: function() {
 			var size = this.get('playerSize'),
@@ -258,10 +261,11 @@ FFZ.prototype.setup_layout = function() {
 						var size = this.get('playerSize'),
 							video_below = this.get('portraitVideoBelow'),
 
-							video_height = size[1] + (f.settings.minimal_channel_title ? 75 : 120) + 60,
+							video_height = size[1] + this.get('ffzExtraHeight'),
 							chat_height = window_height - video_height,
 
 							video_top = video_below ? chat_height : 0,
+							video_bottom = window_height - (video_top + video_height),
 							chat_top = video_below ? 0 : video_height,
 
 							theatre_video_height = Math.floor(Math.max(window_height * 0.1, Math.min(window_height - 300, 9 * window_width / 16))),
@@ -304,10 +308,10 @@ FFZ.prototype.setup_layout = function() {
 							'body:not(.ffz-channel-bar-bottom) .cn-bar-fixed {' +
 								'top: ' + video_top + 'px}' +
 							'.ffz-minimal-channel-bar.ffz-channel-bar-bottom .cn-bar {' +
-								'bottom: ' + (chat_top - 40) + 'px}' +
+								'bottom: ' + (video_bottom - 40) + 'px}' +
 							'.ffz-minimal-channel-bar.ffz-channel-bar-bottom .cn-bar:hover,' +
 							'.ffz-channel-bar-bottom .cn-bar {' +
-								'bottom: ' + chat_top + 'px}' +
+								'bottom: ' + video_bottom + 'px}' +
 							'body:not(.ffz-sidebar-swap) .cn-bar-fixed { right: 0 !important }' +
 							'body.ffz-sidebar-swap .cn-bar-fixed { left: 0 !important }';
 
@@ -335,7 +339,7 @@ FFZ.prototype.setup_layout = function() {
 				f._layout_style.innerHTML = out;
 			}
 
-		}.observes("isRightColumnClosed", "playerSize", "rightColumnWidth", "portraitMode", "windowHeight", "windowWidth"),
+		}.observes("ffzExtraHeight", "isRightColumnClosed", "playerSize", "rightColumnWidth", "portraitMode", "windowHeight", "windowWidth"),
 
 		ffzUpdatePlayerStyle: function() {
 			Ember.propertyDidChange(Layout, 'playerStyle');
@@ -365,5 +369,7 @@ FFZ.prototype.setup_layout = function() {
 	// Force re-calculation of everything.
 	Ember.propertyDidChange(Layout, 'windowWidth');
 	Ember.propertyDidChange(Layout, 'windowHeight');
+	Ember.propertyDidChange(Layout, 'ffzExtraHeight');
+	Ember.propertyDidChange(Layout, 'isTooSmallForRightColumn');
 	Layout.ffzUpdatePortraitCSS();
 }
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 4f8586e1..48832f12 100644
--- a/src/main.js
+++ b/src/main.js
@@ -34,7 +34,7 @@ FFZ.msg_commands = {};
 
 // Version
 var VER = FFZ.version_info = {
-	major: 3, minor: 5, revision: 305,
+	major: 3, minor: 5, revision: 306,
 	toString: function() {
 		return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
 	}
diff --git a/style.css b/style.css
index c60064a6..ce229a3f 100644
--- a/style.css
+++ b/style.css
@@ -289,6 +289,10 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
 	display: none;
 }
 
+.ffz-theater-stats .app-main.theatre .player-column:hover + .metadata-box .cn-metabar__more,
+.ffz-theater-stats .app-main.theatre .player-column:focus + .metadata-box .cn-metabar__more,
+.ffz-theater-stats .app-main.theatre .cn-metabar__more:hover,
+.ffz-theater-stats .app-main.theatre .cn-metabar__more:focus,
 .ffz-theater-stats .app-main.theatre .player-column:focus #hostmode > div.clearfix,
 .ffz-theater-stats .app-main.theatre .player-column:hover #hostmode > div.clearfix,
 .ffz-theater-stats .app-main.theatre .player-column:focus .stats-and-actions,
@@ -306,11 +310,27 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
 	opacity: 0.95;
 }
 
+.ffz-theater-stats .app-main.theatre .player-column:hover + .metadata-box .cn-metabar__more,
+.ffz-theater-stats .app-main.theatre .player-column:focus + .metadata-box .cn-metabar__more,
+.ffz-theater-stats .app-main.theatre .cn-metabar__more:hover,
+.ffz-theater-stats .app-main.theatre .cn-metabar__more:focus {
+	width: calc(100% - 20px);
+	margin-bottom: 40px;
+}
+
 .ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .player-column:focus #hostmode > div.clearfix,
 .ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .player-column:hover #hostmode > div.clearfix,
 .ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .player-column:focus .stats-and-actions,
 .ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .player-column:hover .stats-and-actions,
 
+.ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .player-column:hover + .metadata-box .cn-metabar__more,
+.ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .player-column:focus + .metadata-box .cn-metabar__more,
+.ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .cn-metabar__more:hover,
+.ffz-theater-stats.ffz-theatre-conversations .app-main.theatre .cn-metabar__more:focus,
+.ffz-theater-stats.ffz-top-conversations .app-main.theatre .player-column:hover + .metadata-box .cn-metabar__more,
+.ffz-theater-stats.ffz-top-conversations .app-main.theatre .player-column:focus + .metadata-box .cn-metabar__more,
+.ffz-theater-stats.ffz-top-conversations .app-main.theatre .cn-metabar__more:hover,
+.ffz-theater-stats.ffz-top-conversations .app-main.theatre .cn-metabar__more:focus,
 .ffz-theater-stats.ffz-top-conversations .app-main.theatre .player-column:focus #hostmode > div.clearfix,
 .ffz-theater-stats.ffz-top-conversations .app-main.theatre .player-column:hover #hostmode > div.clearfix,
 .ffz-theater-stats.ffz-top-conversations .app-main.theatre .player-column:focus .stats-and-actions,