mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-08-02 16:08:31 +00:00
3.5.331. #MakeHostingGreatAgain. Closes #19.
This commit is contained in:
parent
36f0b33d04
commit
12427d2750
11 changed files with 274 additions and 636 deletions
|
@ -1,3 +1,14 @@
|
|||
<div class="list-header">3.5.331 <time datetime="2016-10-15">(2016-10-15)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>I was thinking to myself "Hey, self, the new hosting page is kind of... bare, right?" but then I thought "Hey wait, I have that thing that can do the stuff to Twitch, right?"</li>
|
||||
<li> </li>
|
||||
<li>Added: Metadata will now display on hosted channels.</li>
|
||||
<li>(Added: That includes the stream title too.)</li>
|
||||
<li>Fixed: The player wasn't the right height for hosted channels.</li>
|
||||
<li>Fixed: Bug preventing hosting from initializing correctly.</li>
|
||||
<li>Fixed: The player width wouldn't respect BetterTTV's chat column width when in hosting.</li>
|
||||
</ul>
|
||||
|
||||
<div class="list-header">3.5.330 <time datetime="2016-10-14">(2016-10-14)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>Added: Click the user's name in timeout and ban notices to open their moderation card.</li>
|
||||
|
|
|
@ -45,6 +45,7 @@ module.exports = FrankerFaceZ.constants = {
|
|||
SEPARATORS: SEPARATORS,
|
||||
SPLITTER: SPLITTER,
|
||||
|
||||
NO_LOGO: "//static-cdn.jtvnw.net/jtv_user_pictures/xarth/404_user_150x150.png",
|
||||
UUID_TEST: /(?:^| +)([0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}) *$/i,
|
||||
|
||||
KNOWN_CODES: {
|
||||
|
|
|
@ -49,6 +49,7 @@ FFZ.prototype.setup_channel = function() {
|
|||
|
||||
Channel.reopen({
|
||||
ffzUpdateInfo: function() {
|
||||
return;
|
||||
if ( this._ffz_update_timer )
|
||||
clearTimeout(this._ffz_update_timer);
|
||||
|
||||
|
@ -59,11 +60,16 @@ FFZ.prototype.setup_channel = function() {
|
|||
}.observes("channelModel"),
|
||||
|
||||
ffzCheckUpdate: function() {
|
||||
return;
|
||||
var t = this,
|
||||
channel_id = t.get('channelModel.id');
|
||||
|
||||
channel_id && utils.api.get("streams/" + channel_id, {}, {version:3})
|
||||
.done(function(data) {
|
||||
// If it's loading, we can't update it or Ember will whine.
|
||||
if ( t.get('channelModel.isLoading') )
|
||||
return;
|
||||
|
||||
if ( ! data || ! data.stream ) {
|
||||
// If the stream is offline, clear its created_at time and set it to zero viewers.
|
||||
t.set('channelModel.stream.createdAt', null);
|
||||
|
@ -108,11 +114,8 @@ FFZ.prototype.setup_channel = function() {
|
|||
if ( f._chatv )
|
||||
f._chatv.ffzUpdateHost(target);
|
||||
|
||||
if ( f.settings.follow_buttons )
|
||||
f.rebuild_following_ui();
|
||||
|
||||
if ( f.settings.srl_races )
|
||||
f.rebuild_race_ui();
|
||||
if ( f._cindex )
|
||||
f._cindex.ffzUpdateMetadata();
|
||||
|
||||
}.observes("channelModel.hostModeTarget")
|
||||
});
|
||||
|
@ -164,6 +167,7 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
|
||||
this.ffzUpdateAttributes();
|
||||
this.ffzFixTitle();
|
||||
this.ffzFixHostTitle();
|
||||
|
||||
this.ffzUpdateMetadata();
|
||||
|
||||
|
@ -184,14 +188,9 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
func();
|
||||
}
|
||||
|
||||
this.$().on("click", ".ffz-creative-tag-link", function(e) {
|
||||
if ( e.button !== 0 || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey )
|
||||
return;
|
||||
|
||||
utils.ember_lookup("router:main").transitionTo('creative.hashtag.index', this.getAttribute('data-tag'));
|
||||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
this.$().on("click", ".ffz-creative-tag-link", utils.transition_link(function(e) {
|
||||
utils.transition('creative.hashtag.index', this.getAttribute('data-tag'));
|
||||
}));
|
||||
},
|
||||
|
||||
ffzUpdateAttributes: function() {
|
||||
|
@ -207,6 +206,15 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
f.ws_sub("channel." + hosted_id);
|
||||
|
||||
this.ffz_host = hosted_id;
|
||||
|
||||
// Destroy the popup if we have a metadata popup.
|
||||
if ( f._popup && f._popup.id === 'ffz-metadata-popup' )
|
||||
f.close_popup();
|
||||
|
||||
if ( hosted_id )
|
||||
this.ffzFixHostTitle();
|
||||
|
||||
this.ffzUpdateMetadata();
|
||||
}
|
||||
|
||||
el.classList.add('ffz-channel');
|
||||
|
@ -228,19 +236,100 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
this.ffz_host = null;
|
||||
}
|
||||
|
||||
var timers = this.ffz_timers || {};
|
||||
for(var key in timers) {
|
||||
var to = timers[key];
|
||||
if ( to )
|
||||
clearTimeout(to);
|
||||
}
|
||||
|
||||
var popup = el.querySelector('#ffz-metadata-popup');
|
||||
if ( popup && popup === f._popup )
|
||||
f.close_popup();
|
||||
|
||||
if ( f._cindex === this )
|
||||
f._cindex = null;
|
||||
|
||||
if ( this._ffz_update_uptime )
|
||||
clearTimeout(this._ffz_update_uptime);
|
||||
|
||||
if ( this._ffz_update_stats )
|
||||
clearTimeout(this._ffz_update_stats);
|
||||
if ( this._fix_host_timer ) {
|
||||
clearTimeout(this._fix_host_timer);
|
||||
this._fix_host_timer = null;
|
||||
}
|
||||
|
||||
document.body.classList.remove('ffz-small-player');
|
||||
utils.update_css(f._channel_style, channel_id, null);
|
||||
},
|
||||
|
||||
ffzFixHostTitle: function() {
|
||||
if ( this._fix_host_timer ) {
|
||||
clearTimeout(this._fix_host_timer);
|
||||
this._fix_host_timer = null;
|
||||
}
|
||||
|
||||
var channel = this.get('channel.hostModeTarget');
|
||||
if ( ! channel || channel.get('isLoading') )
|
||||
return;
|
||||
|
||||
var el = this.get('element'),
|
||||
container = el && el.querySelector('.cn-hosting--top .card');
|
||||
|
||||
if ( ! container ) {
|
||||
// Wait for the host bar to appear.
|
||||
this._fix_host_timer = setTimeout(this.ffzFixHostTitle.bind(this), 250);
|
||||
return;
|
||||
}
|
||||
|
||||
var old_ui = container.querySelector('.ffz.card__layout');
|
||||
if ( old_ui )
|
||||
container.removeChild(old_ui);
|
||||
|
||||
var image = utils.createElement('img'),
|
||||
figure = utils.createElement('figure', 'card__img card__img--avatar', image),
|
||||
avatar_link = utils.createElement('a', '', figure),
|
||||
|
||||
user_link = utils.createElement('a', '', utils.sanitize(channel.get('displayName'))),
|
||||
|
||||
card_title = utils.createElement('h3', 'card__title'),
|
||||
card_info = utils.createElement('p', 'card__info', 'Hosting '),
|
||||
card_body = utils.createElement('div', 'card__body', card_title),
|
||||
|
||||
layout = utils.createElement('div', 'ffz card__layout', avatar_link);
|
||||
|
||||
card_info.appendChild(user_link);
|
||||
layout.appendChild(card_body);
|
||||
card_body.appendChild(card_info);
|
||||
|
||||
container.classList.add('ffz-host-info');
|
||||
container.appendChild(layout);
|
||||
|
||||
var channel_id = channel.get('id'),
|
||||
status = channel.get('status'),
|
||||
game = channel.get('game'),
|
||||
|
||||
tokens = f.tokenize_line(channel_id, channel_id, status, true);
|
||||
|
||||
if ( game === 'Creative' )
|
||||
tokens = f.tokenize_ctags(tokens);
|
||||
|
||||
if ( game ) {
|
||||
var game_link = utils.createElement('a', '', utils.sanitize(game));
|
||||
card_info.appendChild(document.createTextNode(game === 'Creative' ? ' being ' : ' playing '));
|
||||
card_info.appendChild(game_link);
|
||||
|
||||
game_link.href = Twitch.uri.game(game);
|
||||
game_link.addEventListener('click', utils.transition_link(utils.transition_game.bind(this, game)));
|
||||
}
|
||||
|
||||
avatar_link.href = user_link.href = '/' + channel_id;
|
||||
|
||||
var user_handler = utils.transition_link(utils.transition_user.bind(this, channel_id));
|
||||
avatar_link.addEventListener('click', user_handler);
|
||||
user_link.addEventListener('click', user_handler);
|
||||
|
||||
image.src = channel.get('logo') || constants.NO_LOGO;
|
||||
card_title.innerHTML = f.render_tokens(tokens);
|
||||
|
||||
}.observes('channel.hostModeTarget', 'channel.hostModeTarget.isLoading', 'channel.hostModeTarget.id', 'channel.hostModeTarget.status', 'channel.hostModeTarget.game'),
|
||||
|
||||
ffzFixTitle: function() {
|
||||
if ( ! f.settings.stream_title )
|
||||
return;
|
||||
|
@ -261,21 +350,22 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
ffzUpdateMetadata: function(key) {
|
||||
var t = this,
|
||||
keys = key ? [key] : Object.keys(FFZ.channel_metadata),
|
||||
basic_info = [this, this.get('channel')],
|
||||
is_hosting = !!this.get('channel.hostModeTarget'),
|
||||
basic_info = [this, this.get(is_hosting ? 'channel.hostModeTarget' : 'channel'), is_hosting, this.get('channel')],
|
||||
timers = this.ffz_timers = this.ffz_timers || {},
|
||||
|
||||
container = this.get('element'),
|
||||
metabar = container && container.querySelector('.cn-metabar__more');
|
||||
metabar = container && container.querySelector(is_hosting ? '.cn-hosting--bottom' : '.cn-metabar__more');
|
||||
|
||||
// Stop once this is destroyed.
|
||||
if ( this.isDestroyed || ! metabar )
|
||||
return;
|
||||
|
||||
for(var i=0; i < keys.length; i++)
|
||||
this._ffzUpdateStat(keys[i], basic_info, timers, metabar);
|
||||
this._ffzUpdateStat(keys[i], basic_info, timers, metabar, is_hosting);
|
||||
},
|
||||
|
||||
_ffzUpdateStat: function(key, basic_info, timers, metabar) {
|
||||
_ffzUpdateStat: function(key, basic_info, timers, metabar, is_hosting) {
|
||||
var t = this,
|
||||
info = FFZ.channel_metadata[key];
|
||||
if ( ! info )
|
||||
|
@ -332,8 +422,9 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
btn = el = utils.createElement('div', 'cn-metabar__ffz flex__item', static_label);
|
||||
|
||||
el.setAttribute('data-key', key);
|
||||
if ( info.order )
|
||||
el.style.order = info.order;
|
||||
var order = (is_hosting ? info.host_order : null) || info.order;
|
||||
if ( order )
|
||||
el.style.order = order;
|
||||
|
||||
if ( ! dynamic_tooltip && info.tooltip ) {
|
||||
btn.classList.add('html-tooltip');
|
||||
|
@ -354,8 +445,7 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
html: true,
|
||||
gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n'),
|
||||
title: function() {
|
||||
var data = [t, t.get('channel')];
|
||||
data = info.setup ? info.setup.apply(f, data) : data;
|
||||
var data = info.setup ? info.setup.apply(f, basic_info) : basic_info;
|
||||
return info.tooltip.apply(f, data);
|
||||
}
|
||||
})
|
||||
|
@ -368,8 +458,7 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
|
||||
e.update_stat = t._ffzUpdateStat.bind(t, key, basic_info, timers, metabar);
|
||||
|
||||
var data = [t, t.get('channel')];
|
||||
data = info.setup ? info.setup.apply(f, data) : data;
|
||||
var data = info.setup ? info.setup.apply(f, basic_info) : basic_info;
|
||||
data.unshift(btn);
|
||||
data.unshift(e);
|
||||
return info.click.apply(f, data);
|
||||
|
@ -385,7 +474,7 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
if ( popup && popup.id === 'ffz-metadata-popup' && popup.getAttribute('data-key') === key )
|
||||
return;
|
||||
|
||||
var data = [t, t.get('channel')];
|
||||
var data = info.setup ? info.setup.apply(f, basic_info) : basic_info;
|
||||
data = info.setup ? info.setup.apply(f, data) : data;
|
||||
|
||||
var balloon = utils.createElement('div', 'balloon balloon--up show');
|
||||
|
@ -496,546 +585,6 @@ FFZ.prototype.modify_channel_redesign = function(view) {
|
|||
}
|
||||
|
||||
|
||||
/*FFZ.prototype.modify_channel_index = function(view) {
|
||||
var f = this;
|
||||
utils.ember_reopen_view(view, {
|
||||
ffz_init: function() {
|
||||
var channel_id = this.get('model.id'),
|
||||
el = this.get('element');
|
||||
|
||||
f._cindex = this;
|
||||
f.ws_send("sub", "channel." + channel_id);
|
||||
|
||||
el.setAttribute('data-channel', channel_id);
|
||||
el.classList.add('ffz-channel');
|
||||
|
||||
this.ffzFixTitle();
|
||||
this.ffzUpdateUptime();
|
||||
this.ffzUpdateChatters();
|
||||
this.ffzUpdateHostButton();
|
||||
this.ffzUpdatePlayerStats();
|
||||
|
||||
// Listen to scrolling.
|
||||
this._ffz_scroller = this.ffzOnScroll.bind(this);
|
||||
jQuery(el).parents('.tse-scroll-content').on('scroll', this._ffz_scroller);
|
||||
|
||||
var views = this.get('element').querySelector('.svg-glyph_views:not(.ffz-svg)')
|
||||
if ( views )
|
||||
views.parentNode.classList.add('twitch-channel-views');
|
||||
|
||||
if ( f.settings.follow_buttons )
|
||||
f.rebuild_following_ui();
|
||||
|
||||
if ( f.settings.srl_races )
|
||||
f.rebuild_race_ui();
|
||||
|
||||
if ( f.settings.auto_theater ) {
|
||||
var player = f.players && f.players[channel_id] && f.players[channel_id].get('player');
|
||||
if ( player )
|
||||
player.setTheatre(true);
|
||||
}
|
||||
|
||||
this.$().on("click", ".ffz-creative-tag-link", function(e) {
|
||||
if ( e.button !== 0 || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey )
|
||||
return;
|
||||
|
||||
utils.ember_lookup("router:main").transitionTo('creative.hashtag.index', this.getAttribute('data-tag'));
|
||||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
},
|
||||
|
||||
ffz_destroy: function() {
|
||||
var channel_id = this.get('model.id');
|
||||
if ( channel_id )
|
||||
f.ws_send("unsub", "channel." + channel_id);
|
||||
|
||||
this.get('element').setAttribute('data-channel', '');
|
||||
|
||||
if ( f._cindex === this )
|
||||
f._cindex = null;
|
||||
|
||||
if ( this._ffz_update_uptime )
|
||||
clearTimeout(this._ffz_update_uptime);
|
||||
|
||||
if ( this._ffz_update_stats )
|
||||
clearTimeout(this._ffz_update_stats);
|
||||
|
||||
if ( this._ffz_scroller ) {
|
||||
jQuery(this.get('element')).parents('.tse-scroll-content').off('scroll', this._ffz_scroller);
|
||||
this._ffz_scroller = null;
|
||||
}
|
||||
|
||||
document.body.classList.remove('ffz-small-player');
|
||||
utils.update_css(f._channel_style, channel_id, null);
|
||||
},
|
||||
|
||||
|
||||
ffzOnScroll: function(event) {
|
||||
// When we scroll past the bottom of the player, do stuff!
|
||||
var top = event && event.target && event.target.scrollTop,
|
||||
height = this.get('layout.playerSize.1');
|
||||
|
||||
if ( ! top )
|
||||
top = jQuery(this.get('element')).parents('.tse-scroll-content').scrollTop();
|
||||
|
||||
document.body.classList.toggle('ffz-small-player', f.settings.small_player && top >= height);
|
||||
},
|
||||
|
||||
|
||||
ffzFixTitle: function() {
|
||||
if ( f.has_bttv || ! f.settings.stream_title )
|
||||
return;
|
||||
|
||||
var channel_id = this.get('model.id'),
|
||||
status = this.get('model.status'),
|
||||
game = this.get('model.game'),
|
||||
|
||||
tokens = f.tokenize_line(channel_id, channel_id, status, true);
|
||||
|
||||
if ( game === 'Creative' )
|
||||
tokens = f.tokenize_ctags(tokens);
|
||||
|
||||
this.$("#broadcast-meta .title").html(f.render_tokens(tokens));
|
||||
|
||||
status = this.get('hostModeTarget.status');
|
||||
channel_id = this.get('hostModeTarget.id');
|
||||
game = this.get('hostModeTarget.game');
|
||||
|
||||
if ( channel_id ) {
|
||||
tokens = f.tokenize_line(channel_id, channel_id, status, true);
|
||||
if ( game === 'Creative' )
|
||||
tokens = f.tokenize_ctags(tokens);
|
||||
|
||||
this.$(".target-meta .target-title").html(f.render_tokens(tokens));
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
ffzUpdateHostButton: function() {
|
||||
var channel_id = this.get('model.id'),
|
||||
hosted_id = this.get('hostModeTarget.id'),
|
||||
|
||||
user = f.get_user(),
|
||||
room = user && f.rooms && f.rooms[user.login] && f.rooms[user.login].room,
|
||||
now_hosting = room && room.ffz_host_target,
|
||||
hosts_left = room && room.ffz_hosts_left,
|
||||
|
||||
el = this.get('element');
|
||||
|
||||
this.set('ffz_host_updating', false);
|
||||
|
||||
if ( channel_id ) {
|
||||
var container = el && el.querySelector('.stats-and-actions .channel-actions'),
|
||||
btn = container && container.querySelector('#ffz-ui-host-button');
|
||||
|
||||
if ( ! container || ! f.settings.stream_host_button || ! user || user.login === channel_id ) {
|
||||
if ( btn )
|
||||
btn.parentElement.removeChild(btn);
|
||||
} else {
|
||||
if ( ! btn ) {
|
||||
btn = document.createElement('span');
|
||||
btn.id = 'ffz-ui-host-button';
|
||||
btn.className = 'button button--text';
|
||||
|
||||
btn.addEventListener('click', this.ffzClickHost.bind(this, false));
|
||||
|
||||
var before;
|
||||
try { before = container.querySelector(':scope > .theatre-button'); }
|
||||
catch(err) { before = undefined; }
|
||||
|
||||
if ( before )
|
||||
container.insertBefore(btn, before);
|
||||
else
|
||||
container.appendChild(btn);
|
||||
|
||||
jQuery(btn).tipsy({html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
}
|
||||
|
||||
btn.classList.remove('disabled');
|
||||
btn.innerHTML = channel_id === now_hosting ? 'Unhost' : 'Host';
|
||||
if ( now_hosting )
|
||||
btn.title = 'You are now hosting ' + utils.sanitize(FFZ.get_capitalization(now_hosting)) + '.';
|
||||
else
|
||||
btn.title = 'You are not hosting any channel.';
|
||||
|
||||
if ( typeof hosts_left === "number" )
|
||||
btn.title += ' You have ' + hosts_left + ' host command' + utils.pluralize(hosts_left) + ' remaining this half hour.';
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if ( hosted_id ) {
|
||||
var container = el && el.querySelector('#hostmode .channel-actions'),
|
||||
btn = container && container.querySelector('#ffz-ui-host-button');
|
||||
|
||||
if ( ! container || ! f.settings.stream_host_button || ! user || user.login === hosted_id ) {
|
||||
if ( btn )
|
||||
btn.parentElement.removeChild(btn);
|
||||
} else {
|
||||
if ( ! btn ) {
|
||||
btn = document.createElement('span');
|
||||
btn.id = 'ffz-ui-host-button';
|
||||
btn.className = 'button button--text';
|
||||
|
||||
btn.addEventListener('click', this.ffzClickHost.bind(this, true));
|
||||
|
||||
var before;
|
||||
try { before = container.querySelector(':scope > .theatre-button'); }
|
||||
catch(err) { before = undefined; }
|
||||
|
||||
if ( before )
|
||||
container.insertBefore(btn, before);
|
||||
else
|
||||
container.appendChild(btn);
|
||||
|
||||
jQuery(btn).tipsy({html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
}
|
||||
|
||||
btn.classList.remove('disabled');
|
||||
btn.innerHTML = hosted_id === now_hosting ? 'Unhost' : 'Host';
|
||||
if ( now_hosting )
|
||||
btn.title = 'You are currently hosting ' + utils.sanitize(FFZ.get_capitalization(now_hosting)) + '. Click to ' + (hosted_id === now_hosting ? 'unhost' : 'host') + ' this channel.';
|
||||
else
|
||||
btn.title = 'You are not currently hosting any channel. Click to host this channel.';
|
||||
|
||||
if ( typeof hosts_left === "number" )
|
||||
btn.title += ' You have ' + hosts_left + ' host command' + utils.pluralize(hosts_left) + ' remaining this half hour.';
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
ffzClickHost: function(is_host, e) {
|
||||
var btn = e.target,
|
||||
target = is_host ? this.get('hostModeTarget.id') : this.get('model.id'),
|
||||
user = f.get_user(),
|
||||
room = user && f.rooms && f.rooms[user.login] && f.rooms[user.login].room,
|
||||
now_hosting = room && room.ffz_host_target;
|
||||
|
||||
if ( ! room || this.get('ffz_host_updating') )
|
||||
return;
|
||||
|
||||
btn.classList.add('disabled');
|
||||
btn.title = 'Updating...';
|
||||
|
||||
this.set('ffz_host_updating', true);
|
||||
if ( now_hosting === target )
|
||||
room.send("/unhost", true);
|
||||
else
|
||||
room.send("/host " + target, true);
|
||||
},
|
||||
|
||||
|
||||
ffzUpdateChatters: function() {
|
||||
// Get the counts.
|
||||
var room_id = this.get('model.id'),
|
||||
room = f.rooms && f.rooms[room_id];
|
||||
|
||||
if ( ! room || ! f.settings.chatter_count ) {
|
||||
var el = this.get('element').querySelector('#ffz-chatter-display');
|
||||
el && el.parentElement.removeChild(el);
|
||||
el = this.get('element').querySelector('#ffz-ffzchatter-display');
|
||||
el && el.parentElement.removeChild(el);
|
||||
return;
|
||||
}
|
||||
|
||||
var chatter_count = Object.keys(room.room.get('ffz_chatters') || {}).length,
|
||||
ffz_chatters = room.ffz_chatters || 0,
|
||||
ffz_viewers = room.ffz_viewers || 0;
|
||||
|
||||
var el = this.get('element').querySelector('#ffz-chatter-display span');
|
||||
if ( ! el ) {
|
||||
var cont = this.get('element').querySelector('.stats-and-actions .channel-stats');
|
||||
if ( ! cont )
|
||||
return;
|
||||
|
||||
var stat = document.createElement('span');
|
||||
stat.className = 'ffz stat';
|
||||
stat.id = 'ffz-chatter-display';
|
||||
stat.title = "Currently in Chat";
|
||||
|
||||
stat.innerHTML = constants.ROOMS + " ";
|
||||
el = document.createElement("span");
|
||||
stat.appendChild(el);
|
||||
|
||||
var other = cont.querySelector("#ffz-ffzchatter-display");
|
||||
if ( other )
|
||||
cont.insertBefore(stat, other);
|
||||
else
|
||||
cont.appendChild(stat);
|
||||
|
||||
jQuery(stat).tipsy({html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
}
|
||||
|
||||
el.innerHTML = utils.number_commas(chatter_count);
|
||||
|
||||
if ( ! ffz_chatters && ! ffz_viewers ) {
|
||||
el = this.get('element').querySelector('#ffz-ffzchatter-display');
|
||||
el && el.parentNode.removeChild(el);
|
||||
return;
|
||||
}
|
||||
|
||||
el = this.get('element').querySelector('#ffz-ffzchatter-display span');
|
||||
if ( ! el ) {
|
||||
var cont = this.get('element').querySelector('.stats-and-actions .channel-stats');
|
||||
if ( ! cont )
|
||||
return;
|
||||
|
||||
var stat = document.createElement('span');
|
||||
stat.className = 'ffz stat';
|
||||
stat.id = 'ffz-ffzchatter-display';
|
||||
stat.title = "Viewers (In Chat) with FrankerFaceZ";
|
||||
|
||||
stat.innerHTML = constants.ZREKNARF + " ";
|
||||
el = document.createElement("span");
|
||||
stat.appendChild(el);
|
||||
|
||||
var other = cont.querySelector("#ffz-chatter-display");
|
||||
if ( other )
|
||||
cont.insertBefore(stat, other.nextSibling);
|
||||
else
|
||||
cont.appendChild(stat);
|
||||
|
||||
jQuery(stat).tipsy({html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
}
|
||||
|
||||
el.innerHTML = utils.number_commas(ffz_viewers) + " (" + utils.number_commas(ffz_chatters) + ")";
|
||||
},
|
||||
|
||||
|
||||
ffzUpdatePlayerStats: function() {
|
||||
if ( this._ffz_update_stats ) {
|
||||
clearTimeout(this._ffz_update_stats);
|
||||
this._ffz_update_stats = null;
|
||||
}
|
||||
|
||||
// Schedule an update.
|
||||
if ( f.settings.player_stats )
|
||||
this._ffz_update_stats = setTimeout(this.ffzUpdatePlayerStats.bind(this), 1000);
|
||||
|
||||
var channel_id = this.get('model.id'),
|
||||
hosted_id = this.get('hostModeTarget.id'),
|
||||
|
||||
el = this.get('element');
|
||||
|
||||
if ( channel_id ) {
|
||||
var container = el && el.querySelector('.stats-and-actions .channel-stats'),
|
||||
stat_el = container && container.querySelector('#ffz-ui-player-stats'),
|
||||
el = stat_el && stat_el.querySelector('span'),
|
||||
je,
|
||||
|
||||
player_cont = f.players && f.players[channel_id],
|
||||
player = undefined, stats = undefined;
|
||||
|
||||
try {
|
||||
player = player_cont && player_cont.get && player_cont.get('player');
|
||||
stats = player && player.getVideoInfo();
|
||||
} catch(err) {
|
||||
f.error("Channel ffzUpdatePlayerStats: player.getVideoInfo: " + err);
|
||||
}
|
||||
|
||||
if ( ! container || ! f.settings.player_stats || ! stats || ! stats.hls_latency_broadcaster || Number.isNaN(stats.hls_latency_broadcaster) ) {
|
||||
if ( stat_el )
|
||||
stat_el.parentElement.removeChild(stat_el);
|
||||
} else {
|
||||
if ( ! stat_el ) {
|
||||
stat_el = document.createElement('span');
|
||||
stat_el.id = 'ffz-ui-player-stats';
|
||||
stat_el.className = 'ffz stat';
|
||||
|
||||
stat_el.innerHTML = constants.GRAPH + " ";
|
||||
el = document.createElement('span');
|
||||
stat_el.appendChild(el);
|
||||
|
||||
var other = container.querySelector('#ffz-uptime-display');
|
||||
if ( other )
|
||||
container.insertBefore(stat_el, other.nextSibling);
|
||||
else
|
||||
container.appendChild(stat_el);
|
||||
|
||||
je = jQuery(stat_el);
|
||||
je.hover(
|
||||
function() { je.data("hover", true).tipsy("show") },
|
||||
function() { je.data("hover", false).tipsy("hide") })
|
||||
.data("hover", false)
|
||||
.tipsy({trigger: 'manual', html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
} else
|
||||
je = jQuery(stat_el);
|
||||
|
||||
var delay = Math.round(stats.hls_latency_broadcaster / 10) / 100,
|
||||
dropped = utils.number_commas(stats.dropped_frames || 0),
|
||||
bitrate;
|
||||
|
||||
if ( stats.playback_bytes_per_second )
|
||||
bitrate = Math.round(stats.playback_bytes_per_second * 8 / 10.24) / 100;
|
||||
else
|
||||
bitrate = Math.round(stats.current_bitrate * 100) / 100;
|
||||
|
||||
if ( delay > 180 ) {
|
||||
delay = Math.floor(delay);
|
||||
stat_el.setAttribute('original-title', 'Video Information<br>Broadcast ' + utils.time_to_string(delay, true) + ' Ago<br><br>Video: ' + stats.vid_width + 'x' + stats.vid_height + 'p @ ' + stats.current_fps + '<br>Playback Rate: ' + bitrate + ' Kbps<br>Dropped Frames: ' + dropped);
|
||||
el.textContent = utils.time_to_string(Math.floor(delay), true, delay > 172800) + ' old';
|
||||
} else {
|
||||
stat_el.setAttribute('original-title', 'Stream Latency<br>Video: ' + stats.vid_width + 'x' + stats.vid_height + 'p @ ' + stats.current_fps + '<br>Playback Rate: ' + bitrate + ' Kbps<br>Dropped Frames: ' + dropped);
|
||||
delay = delay.toString();
|
||||
var ind = delay.indexOf('.');
|
||||
if ( ind === -1 )
|
||||
delay = delay + '.00';
|
||||
else if ( ind >= delay.length - 2 )
|
||||
delay = delay + '0';
|
||||
|
||||
el.textContent = delay + 's';
|
||||
}
|
||||
|
||||
if ( je.data("hover") )
|
||||
je.tipsy("hide").tipsy("show");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
if ( hosted_id ) {
|
||||
var container = el && el.querySelector('#hostmode .channel-stats'),
|
||||
stat_el = container && container.querySelector('#ffz-ui-player-stats'),
|
||||
el = stat_el && stat_el.querySelector('span'),
|
||||
je,
|
||||
|
||||
player_cont = f.players && f.players[hosted_id],
|
||||
player = undefined, stats = undefined;
|
||||
|
||||
try {
|
||||
player = player_cont && player_cont.ffz_player;
|
||||
stats = player && player.getVideoInfo();
|
||||
} catch(err) {
|
||||
f.error("Channel ffzUpdatePlayerStats: player.getVideoInfo: " + err);
|
||||
}
|
||||
|
||||
if ( ! container || ! f.settings.player_stats || ! stats || ! stats.hls_latency_broadcaster || Number.isNaN(stats.hls_latency_broadcaster) ) {
|
||||
if ( stat_el )
|
||||
stat_el.parentElement.removeChild(stat_el);
|
||||
} else {
|
||||
if ( ! stat_el ) {
|
||||
stat_el = document.createElement('span');
|
||||
stat_el.id = 'ffz-ui-player-stats';
|
||||
stat_el.className = 'ffz stat';
|
||||
|
||||
stat_el.innerHTML = constants.GRAPH + " ";
|
||||
el = document.createElement('span');
|
||||
stat_el.appendChild(el);
|
||||
|
||||
var other = container.querySelector('#ffz-uptime-display');
|
||||
if ( other )
|
||||
container.insertBefore(stat_el, other.nextSibling);
|
||||
else
|
||||
container.appendChild(stat_el);
|
||||
|
||||
je = jQuery(stat_el);
|
||||
je.hover(
|
||||
function() { je.data("hover", true).tipsy("show") },
|
||||
function() { je.data("hover", false).tipsy("hide") })
|
||||
.data("hover", false)
|
||||
.tipsy({trigger: 'manual', html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
} else
|
||||
je = jQuery(stat_el);
|
||||
|
||||
var delay = Math.round(stats.hls_latency_broadcaster / 10) / 100,
|
||||
dropped = utils.number_commas(stats.dropped_frames || 0),
|
||||
bitrate;
|
||||
|
||||
if ( stats.playback_bytes_per_second )
|
||||
bitrate = Math.round(stats.playback_bytes_per_second * 8 / 10.24) / 100;
|
||||
else
|
||||
bitrate = Math.round(stats.current_bitrate * 100) / 100;
|
||||
|
||||
if ( delay > 180 ) {
|
||||
delay = Math.floor(delay);
|
||||
stat_el.setAttribute('original-title', 'Video Information<br>Broadcast ' + utils.time_to_string(delay, true) + ' Ago<br><br>Video: ' + stats.vid_width + 'x' + stats.vid_height + 'p @ ' + stats.current_fps + '<br>Playback Rate: ' + bitrate + ' Kbps<br>Dropped Frames: ' + dropped);
|
||||
el.textContent = utils.time_to_string(Math.floor(delay), true, delay > 172800) + ' old';
|
||||
} else {
|
||||
stat_el.setAttribute('original-title', 'Stream Latency<br>Video: ' + stats.vid_width + 'x' + stats.vid_height + 'p @ ' + stats.current_fps + '<br>Playback Rate: ' + bitrate + ' Kbps<br>Dropped Frames: ' + dropped);
|
||||
delay = delay.toString();
|
||||
var ind = delay.indexOf('.');
|
||||
if ( ind === -1 )
|
||||
delay = delay + '.00';
|
||||
else if ( ind >= delay.length - 2 )
|
||||
delay = delay + '0';
|
||||
|
||||
el.textContent = delay + 's';
|
||||
}
|
||||
|
||||
if ( je.data("hover") )
|
||||
je.tipsy("hide").tipsy("show");
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
ffzUpdateUptime: function() {
|
||||
if ( this._ffz_update_uptime ) {
|
||||
clearTimeout(this._ffz_update_uptime);
|
||||
delete this._ffz_update_uptime;
|
||||
}
|
||||
|
||||
var controller = utils.ember_lookup('controller:channel');
|
||||
if ( ! f.settings.stream_uptime || ! (controller && controller.get('isLiveAccordingToKraken')) ) {
|
||||
var el = this.get('element').querySelector('#ffz-uptime-display');
|
||||
if ( el )
|
||||
el.parentElement.removeChild(el);
|
||||
return;
|
||||
}
|
||||
|
||||
// Schedule an update.
|
||||
this._ffz_update_uptime = setTimeout(this.ffzUpdateUptime.bind(this), 1000);
|
||||
|
||||
// Determine when the channel last went live.
|
||||
var online = this.get("model.stream.created_at"),
|
||||
now = Date.now() - (f._ws_server_offset || 0);
|
||||
|
||||
online = online && utils.parse_date(online);
|
||||
|
||||
var uptime = online && Math.floor((now - online.getTime()) / 1000) || -1;
|
||||
if ( uptime < 0 ) {
|
||||
var el = this.get('element').querySelector('#ffz-uptime-display');
|
||||
if ( el )
|
||||
el.parentElement.removeChild(el);
|
||||
return;
|
||||
}
|
||||
|
||||
var el = this.get('element').querySelector('#ffz-uptime-display span');
|
||||
if ( ! el ) {
|
||||
var cont = this.get('element').querySelector('.stats-and-actions .channel-stats');
|
||||
if ( ! cont )
|
||||
return;
|
||||
|
||||
var stat = document.createElement('span');
|
||||
stat.className = 'ffz stat';
|
||||
stat.id = 'ffz-uptime-display';
|
||||
stat.title = "Stream Uptime <nobr>(since " + online.toLocaleString() + ")</nobr>";
|
||||
|
||||
stat.innerHTML = constants.CLOCK + " ";
|
||||
el = document.createElement("span");
|
||||
stat.appendChild(el);
|
||||
|
||||
var viewers = cont.querySelector(".live-count");
|
||||
if ( viewers )
|
||||
cont.insertBefore(stat, viewers.nextSibling);
|
||||
else {
|
||||
try {
|
||||
viewers = cont.querySelector("script:nth-child(0n+2)");
|
||||
cont.insertBefore(stat, viewers.nextSibling);
|
||||
} catch(err) {
|
||||
cont.insertBefore(stat, cont.childNodes[0]);
|
||||
}
|
||||
}
|
||||
|
||||
jQuery(stat).tipsy({html: true, gravity: utils.tooltip_placement(constants.TOOLTIP_DISTANCE, 'n')});
|
||||
}
|
||||
|
||||
el.innerHTML = utils.time_to_string(uptime, false, false, false, f.settings.stream_uptime === 1 || f.settings.stream_uptime === 3);
|
||||
}
|
||||
});
|
||||
}*/
|
||||
|
||||
|
||||
// ---------------
|
||||
// Settings
|
||||
// ---------------
|
||||
|
|
|
@ -1,8 +1,6 @@
|
|||
var FFZ = window.FrankerFaceZ,
|
||||
utils = require('../utils'),
|
||||
constants = require('../constants'),
|
||||
|
||||
NO_LOGO = "//static-cdn.jtvnw.net/jtv_user_pictures/xarth/404_user_150x150.png";
|
||||
constants = require('../constants');
|
||||
|
||||
|
||||
// --------------------
|
||||
|
@ -465,22 +463,11 @@ FFZ.prototype.modify_directory_live = function(component, is_csgo, is_card) {
|
|||
logo.className = 'profile-photo';
|
||||
logo.classList.toggle('is-csgo', is_csgo);
|
||||
|
||||
logo.src = this.get(pref + 'channel.logo') || NO_LOGO;
|
||||
logo.src = this.get(pref + 'channel.logo') || constants.NO_LOGO;
|
||||
logo.alt = f.format_display_name(this.get(pref + 'channel.display_name'), channel_id, true, true)[0];
|
||||
|
||||
link.href = '/' + channel_id;
|
||||
link.addEventListener('click', function(e) {
|
||||
if ( e.button !== 0 || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey )
|
||||
return;
|
||||
|
||||
var Channel = utils.ember_resolve('model:deprecated-channel');
|
||||
if ( ! Channel )
|
||||
return;
|
||||
|
||||
utils.ember_lookup('router:main').transitionTo('channel.index', Channel.find({id: channel_id}).load());
|
||||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
link.addEventListener('click', utils.transition_link(utils.transition_user.bind(this, channel_id)));
|
||||
|
||||
link.appendChild(logo);
|
||||
meta.insertBefore(link, meta.firstChild);
|
||||
|
@ -555,28 +542,12 @@ FFZ.prototype.modify_video_preview = function(component) {
|
|||
el.classList.toggle('ffz-game-spoilered', f.settings.spoiler_games.indexOf(game && game.toLowerCase()) !== -1);
|
||||
|
||||
if ( ! boxart && thumb && game ) {
|
||||
var img = utils.createElement('img'),
|
||||
c = utils.ember_lookup('router:main');
|
||||
var img = utils.createElement('img');
|
||||
|
||||
boxart = utils.createElement('a', 'boxart');
|
||||
boxart.href = this.get('video.gameUrl');
|
||||
boxart.setAttribute('original-title', game);
|
||||
boxart.addEventListener('click', function(e) {
|
||||
if ( e.button !== 0 || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey )
|
||||
return;
|
||||
|
||||
e.preventDefault();
|
||||
jQuery('.tipsy').remove();
|
||||
|
||||
if ( game === "Counter-Strike: Global Offensive" )
|
||||
c.transitionTo('csgo.channels.index')
|
||||
else if ( game === "Creative" )
|
||||
c.transitionTo('creative.index');
|
||||
else
|
||||
c.transitionTo('game-directory.index', encodeURIComponent(game));
|
||||
|
||||
return false;
|
||||
});
|
||||
boxart.addEventListener('click', utils.transition_link(utils.transition_game.bind(this, game)));
|
||||
|
||||
img.src = this.get('video.gameBoxart');
|
||||
boxart.appendChild(img);
|
||||
|
@ -591,10 +562,6 @@ FFZ.prototype.modify_directory_host = function(component) {
|
|||
var f = this;
|
||||
utils.ember_reopen_view(component, {
|
||||
ffzVisitChannel: function(target, e) {
|
||||
var Channel = utils.ember_resolve('model:deprecated-channel');
|
||||
if ( ! Channel )
|
||||
return;
|
||||
|
||||
if ( e ) {
|
||||
if ( e.button !== 0 || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey )
|
||||
return;
|
||||
|
@ -604,7 +571,7 @@ FFZ.prototype.modify_directory_host = function(component) {
|
|||
}
|
||||
|
||||
f.close_popup();
|
||||
utils.ember_lookup('router:main').transitionTo('channel.index', Channel.find({id: target}).load());
|
||||
utils.transition_user(target);
|
||||
return false;
|
||||
},
|
||||
|
||||
|
@ -636,7 +603,7 @@ FFZ.prototype.modify_directory_host = function(component) {
|
|||
link.className = 'dropmenu_action';
|
||||
link.setAttribute('data-channel', target.name);
|
||||
link.href = '/' + target.name;
|
||||
link.innerHTML = '<img class="image" src="' + utils.sanitize(target.logo || NO_LOGO) + '"><span class="title' + (results[1] ? ' html-tooltip" title="' + utils.quote_attr(results[1]) : '') + '">' + results[0] + '</span>';
|
||||
link.innerHTML = '<img class="image" src="' + utils.sanitize(target.logo || constants.NO_LOGO) + '"><span class="title' + (results[1] ? ' html-tooltip" title="' + utils.quote_attr(results[1]) : '') + '">' + results[0] + '</span>';
|
||||
link.addEventListener('click', t.ffzVisitChannel.bind(t, target.name));
|
||||
menu.appendChild(link);
|
||||
return link;
|
||||
|
@ -720,7 +687,7 @@ FFZ.prototype.modify_directory_host = function(component) {
|
|||
link = document.createElement('a');
|
||||
|
||||
logo.className = 'profile-photo';
|
||||
logo.src = this.get('stream.target.channel.logo') || NO_LOGO;
|
||||
logo.src = this.get('stream.target.channel.logo') || constants.NO_LOGO;
|
||||
logo.alt = f.format_display_name(target.display_name, target.name, true, true)[0];
|
||||
|
||||
link.href = '/' + target.name;
|
||||
|
|
|
@ -203,11 +203,13 @@ FFZ.prototype.setup_layout = function() {
|
|||
var h = this.get('windowHeight'),
|
||||
c = this.get('PLAYER_CONTROLS_HEIGHT'),
|
||||
r = this.get('contentWidth'),
|
||||
|
||||
extra_height = this.get('ffzExtraHeight'),
|
||||
extra_theater_height = 120 + (f.settings.channel_bar_collapse ? 10 : 60) + 40,
|
||||
|
||||
i = Math.round(9 * r / 16) + c,
|
||||
d = h - extra_height,
|
||||
c = h - 94 - 185,
|
||||
c = h - extra_theater_height,
|
||||
|
||||
l = Math.floor(r),
|
||||
o = Math.floor(Math.min(i, d)),
|
||||
|
@ -222,7 +224,7 @@ FFZ.prototype.setup_layout = function() {
|
|||
height = size[1],
|
||||
host_height = size[2];
|
||||
|
||||
return "<style>.ffz-small-player:not(.ffz-bttv)[data-current-path^=\"user.channel.\"] .app-main:not(.theatre) #player,.dynamic-player, .dynamic-player object, .dynamic-player video{width:" + width + "px !important;height:" + height + "px !important} .cn-hosted .dynamic-target-player,.cn-hosted .dynamic-target-player object,.ffz-small-player:not(.ffz-bttv)[data-current-path^=\"user.channel.\"] .app-main:not(.theatre) .cn-hosted #player, .cn-hosted .dynamic-target-player video{width:" + width + "px !important;height:" + host_height + "px !important}</style><style>.dynamic-player .player object, .dynamic-player .player video{width:100% !important; height:100% !important}</style>";
|
||||
return "<style>.ffz-small-player:not(.ffz-bttv)[data-current-path^=\"user.channel.\"] .app-main:not(.theatre) #player,.dynamic-player, .dynamic-player object, .dynamic-player video{width:" + width + "px !important;height:" + height + "px !important} .dynamic-target-player,.dynamic-target-player object,.ffz-small-player:not(.ffz-bttv)[data-current-path^=\"user.channel.\"] .app-main:not(.theatre) .cn-hosted #player, .cn-hosted .dynamic-target-player video{width:" + width + "px !important;height:" + host_height + "px !important}</style><style>.dynamic-player .player object, .dynamic-player .player video{width:100% !important; height:100% !important}</style>";
|
||||
}.property("playerSize"),
|
||||
|
||||
ffzPortraitWarning: function() {
|
||||
|
|
|
@ -270,13 +270,13 @@ FFZ.prototype.modify_navigation = function(component) {
|
|||
|
||||
following_link.addEventListener('click', function(e) {
|
||||
following_link.href = '/directory/following' + (f.settings.sidebar_directly_to_followed_channels ? '/live' : '');
|
||||
var router = utils.ember_lookup('router:main');
|
||||
if ( ! router || e && (e.button !== 0 || e.ctrlKey || e.metaKey) )
|
||||
if ( e && (e.button !== 0 || e.ctrlKey || e.metaKey) )
|
||||
return;
|
||||
|
||||
router.transitionTo('directory.following.' + (f.settings.sidebar_directly_to_followed_channels ? 'channels' : 'index'));
|
||||
e.stopImmediatePropagation();
|
||||
e.preventDefault();
|
||||
|
||||
utils.transition('directory.following.' + (f.settings.sidebar_directly_to_followed_channels ? 'channels' : 'index'));
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
|
|
@ -35,7 +35,7 @@ FFZ.channel_metadata = {};
|
|||
|
||||
// Version
|
||||
var VER = FFZ.version_info = {
|
||||
major: 3, minor: 5, revision: 330,
|
||||
major: 3, minor: 5, revision: 331,
|
||||
toString: function() {
|
||||
return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
|
||||
}
|
||||
|
|
|
@ -9,6 +9,45 @@ var FFZ = window.FrankerFaceZ,
|
|||
// Channel Stats
|
||||
// --------------
|
||||
|
||||
metadata.viewers = {
|
||||
refresh: 5000,
|
||||
host_order: 100,
|
||||
|
||||
static_label: constants.LIVE,
|
||||
label: function(view, channel, is_hosting) {
|
||||
var viewers = channel.get('stream.viewers');
|
||||
return is_hosting && viewers && utils.number_commas(viewers);
|
||||
},
|
||||
|
||||
tooltip: "Watching Now"
|
||||
};
|
||||
|
||||
metadata.followers = {
|
||||
refresh: 5000,
|
||||
host_order: 199,
|
||||
|
||||
static_label: constants.HEART,
|
||||
label: function(view, channel, is_hosting) {
|
||||
var followers = channel.get('followers.content.meta.total');
|
||||
return is_hosting && followers && utils.number_commas(followers);
|
||||
},
|
||||
|
||||
tooltip: "Total Followers"
|
||||
}
|
||||
|
||||
metadata.views = {
|
||||
refresh: 5000,
|
||||
host_order: 200,
|
||||
|
||||
static_label: constants.EYE,
|
||||
label: function(view, channel, is_hosting) {
|
||||
var views = channel.get('views');
|
||||
return is_hosting && views && utils.number_commas(views);
|
||||
},
|
||||
|
||||
tooltip: "Total Views"
|
||||
}
|
||||
|
||||
metadata.uptime = {
|
||||
refresh: function(channel) { return this.settings.stream_uptime > 0; },
|
||||
|
||||
|
@ -22,6 +61,8 @@ metadata.uptime = {
|
|||
},
|
||||
|
||||
order: 2,
|
||||
host_order: 101,
|
||||
|
||||
static_label: constants.CLOCK,
|
||||
label: function(online, uptime) {
|
||||
var setting = this.settings.stream_uptime;
|
||||
|
@ -36,27 +77,10 @@ metadata.uptime = {
|
|||
}
|
||||
};
|
||||
|
||||
metadata.chatters = {
|
||||
refresh: false,
|
||||
|
||||
static_label: constants.ROOMS,
|
||||
label: function(view, channel) {
|
||||
var channel_id = channel.get('id'),
|
||||
room = this.rooms[channel_id];
|
||||
|
||||
if ( ! room || ! this.settings.chatter_count )
|
||||
return null;
|
||||
|
||||
return utils.number_commas(Object.keys(room.room.get('ffz_chatters') || {}).length);
|
||||
},
|
||||
|
||||
tooltip: 'Currently in Chat'
|
||||
};
|
||||
|
||||
metadata.player_stats = {
|
||||
refresh: function() { return this.settings.player_stats },
|
||||
|
||||
setup: function(view, channel) {
|
||||
setup: function(view, maybe_channel, is_hosting, channel) {
|
||||
var channel_id = channel.get('id'),
|
||||
player_cont = this.players && this.players[channel_id],
|
||||
player = player_cont && player_cont.player,
|
||||
|
@ -71,6 +95,8 @@ metadata.player_stats = {
|
|||
},
|
||||
|
||||
order: 3,
|
||||
host_order: 102,
|
||||
|
||||
static_label: constants.GRAPH,
|
||||
label: function(stats, delay, is_old) {
|
||||
if ( ! this.settings.player_stats || ! stats || ! stats.hls_latency_broadcaster )
|
||||
|
@ -107,6 +133,23 @@ metadata.player_stats = {
|
|||
}
|
||||
};
|
||||
|
||||
metadata.chatters = {
|
||||
refresh: false,
|
||||
|
||||
static_label: constants.ROOMS,
|
||||
label: function(view, channel) {
|
||||
var channel_id = channel.get('id'),
|
||||
room = this.rooms[channel_id];
|
||||
|
||||
if ( ! room || ! this.settings.chatter_count )
|
||||
return null;
|
||||
|
||||
return utils.number_commas(Object.keys(room.room.get('ffz_chatters') || {}).length);
|
||||
},
|
||||
|
||||
tooltip: 'Currently in Chat'
|
||||
};
|
||||
|
||||
metadata.host = {
|
||||
refresh: false,
|
||||
|
||||
|
@ -121,6 +164,8 @@ metadata.host = {
|
|||
},
|
||||
|
||||
order: 98,
|
||||
host_order: 3,
|
||||
|
||||
label: function(user, channel_id, hosting_id) {
|
||||
if ( ! this.settings.stream_host_button || ! user || user.login === channel_id )
|
||||
return null;
|
||||
|
|
|
@ -199,6 +199,8 @@ FFZ.channel_metadata.following = {
|
|||
},
|
||||
|
||||
order: 97,
|
||||
host_order: 4,
|
||||
|
||||
button: true,
|
||||
static_label: constants.HEART,
|
||||
label: function(data) {
|
||||
|
|
37
src/utils.js
37
src/utils.js
|
@ -448,6 +448,15 @@ var createElement = function(tag, className, content) {
|
|||
},
|
||||
|
||||
|
||||
ember_transition = function(route, model) {
|
||||
var router = ember_lookup('router:main');
|
||||
if ( model )
|
||||
router.transitionTo(route, model);
|
||||
else
|
||||
router.transitionTo(route);
|
||||
},
|
||||
|
||||
|
||||
CMD_VAR_REGEX = /{(\d+(?:\$(?:\d+)?)?|id|msg_id|message_id|(?:user|room)(?:_id|_name|_display_name)?)}/g;
|
||||
|
||||
|
||||
|
@ -464,6 +473,34 @@ module.exports = FFZ.utils = {
|
|||
return settings && settings.findOne();
|
||||
},
|
||||
|
||||
transition: ember_transition,
|
||||
transition_game: function(game) {
|
||||
if ( game === "Counter-Strike: Global Offensive" )
|
||||
ember_transition('directory.csgo.channels.index')
|
||||
else if ( game === "Creative" )
|
||||
ember_transition('directory.creative.index')
|
||||
else
|
||||
ember_transition('directory.game.index', encodeURIComponent(game))
|
||||
},
|
||||
|
||||
transition_user: function(username) {
|
||||
var Channel = ember_resolve('model:deprecated-channel');
|
||||
ember_transition('channel.index', Channel.find({id: username}).load());
|
||||
},
|
||||
|
||||
transition_link: function(callback) {
|
||||
return function(e) {
|
||||
if ( e.button !== 0 || e.altKey || e.ctrlKey || e.shiftKey || e.metaKey )
|
||||
return;
|
||||
|
||||
e.preventDefault();
|
||||
jQuery('.tipsy').remove();
|
||||
|
||||
callback.call(this, e);
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
ember_reopen_view: function(component, data) {
|
||||
if ( typeof component === 'string' )
|
||||
component = ember_resolve(component);
|
||||
|
|
26
style.css
26
style.css
|
@ -18,6 +18,7 @@ body > div.tipsy .tipsy-arrow { opacity: 0.8; }
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.ffz-host-info .card__layout:not(.ffz),
|
||||
.ffz-following-row[data-loaded="false"] .button,
|
||||
.ffz-following-row[data-loaded="false"] .switch,
|
||||
.ffz-following-row[data-following="false"] .switch,
|
||||
|
@ -284,6 +285,11 @@ 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 .cn-hosting--bottom,
|
||||
.ffz-theater-stats .app-main.theatre .player-column:focus .cn-hosting--bottom,
|
||||
.ffz-theater-stats .app-main.theatre .cn-hosting--bottom:hover,
|
||||
.ffz-theater-stats .app-main.theatre .cn-hosting--bottom:focus,
|
||||
|
||||
.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,
|
||||
|
@ -305,10 +311,12 @@ body.ffz-bttv-dark .ffz-ui-toggle.blue.live:hover svg.svg-emoticons path { fill:
|
|||
padding: 10px !important;
|
||||
}
|
||||
|
||||
.ffz-theater-stats .app-main.theatre .cn-hosting--bottom,
|
||||
.ffz-theater-stats .app-main.theatre .cn-metabar__more {
|
||||
bottom: 55px;
|
||||
}
|
||||
|
||||
.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .app-main.theatre .cn-hosting--bottom,
|
||||
.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .app-main.theatre .cn-metabar__more {
|
||||
bottom: 95px;
|
||||
}
|
||||
|
@ -3524,6 +3532,7 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
|
|||
padding-top: 80px;
|
||||
}
|
||||
|
||||
.cn-hosting .ffz.card__layout .card__title,
|
||||
.ffz-channel-title-top .cn-metabar__more,
|
||||
.app-main.theatre .cn-metabar__more {
|
||||
margin-top: 0 !important;
|
||||
|
@ -3534,6 +3543,9 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
|
|||
.ffz-hide-channel-banner .cn-cover { height: 0 !important }
|
||||
.ffz-minimal-channel-title.ffz-channel-title-top #channel { padding-top: 50px }
|
||||
|
||||
.ffz-channel-title-top .ffz-channel.ffz-host { margin-top: -55px }
|
||||
.ffz-minimal-channel-title.ffz-channel-title-top .ffz-channel.ffz-host { margin-top: -25px }
|
||||
|
||||
.ffz-channel-title-top .cn-metabar__title {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
|
@ -3564,19 +3576,25 @@ body:not(.ffz-channel-bar-bottom).ffz-small-player.ffz-minimal-channel-bar #play
|
|||
|
||||
/* Channel Metadata Sorting */
|
||||
|
||||
.cn-hosting--bottom > *,
|
||||
.cn-metabar__more > * {
|
||||
margin: 0 1rem 0 0 !important;
|
||||
order: 49;
|
||||
}
|
||||
|
||||
.cn-hosting--bottom > *,
|
||||
.cn-metabar__more > span { order: 150 }
|
||||
|
||||
.cn-hosting--bottom:after,
|
||||
.cn-metabar__more:after {
|
||||
content: '';
|
||||
order: 75;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.cn-hosting--bottom { padding-right: 0 }
|
||||
|
||||
.cn-hosting--bottom .button,
|
||||
.ffz-channel-options .qa-channel-options,
|
||||
.ffz-share-box .qa-share-box__button { margin: 0 !important }
|
||||
|
||||
|
@ -3586,11 +3604,17 @@ body:not(.ffz-channel-bar-bottom).ffz-small-player.ffz-minimal-channel-bar #play
|
|||
.cn-metabar__more > #ffz-player-stats { order: 3 }*/
|
||||
.cn-metabar__more > .cn-metabar__viewcount { order: 50; flex-grow: 0 !important }
|
||||
|
||||
.cn-metabar__more > #ffz-ui-host-button { order: 98 }
|
||||
.cn-metabar__more > .ffz-channel-broadcast-link { order: 100 }
|
||||
.cn-metabar__more > .ffz-share-box { order: 101 }
|
||||
.cn-metabar__more > .ffz-channel-options { order: 999; margin-right: 0 !important }
|
||||
|
||||
.cn-hosting--bottom > .follow-button { order: 1; margin-right: 0 !important }
|
||||
.cn-hosting--bottom > .notification-controls { order: 1 }
|
||||
.cn-hosting--bottom > span.ember-view { order: 2 }
|
||||
|
||||
.cn-metabar__ffz[data-key="viewers"] svg { fill: #fc3636 }
|
||||
.cn-metabar__ffz[data-key="viewers"] { color: #fc3636 }
|
||||
|
||||
|
||||
/* Mod Card Notes */
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue