mirror of
https://github.com/FrankerFaceZ/FrankerFaceZ.git
synced 2025-06-27 21:05:53 +00:00
3.5.387. Remove FFZ's small player feature. Add support for Twitch's native mini player.
This commit is contained in:
SirStendec
parent
fc9373947a
commit
60c3d51c7e
7 changed files with 61 additions and 52 deletions
|
|
@ -1,3 +1,9 @@
|
|||
<div class="list-header">3.5.387 <time datetime="2016-11-30">(2016-11-30)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>Removed: Mini Player. Twitch has its own feature for that now.</li>
|
||||
<li>Fixed: Twitch's mini player didn't get along with FFZ's.</li>
|
||||
</ul>
|
||||
|
||||
<div class="list-header">3.5.386 <time datetime="2016-11-30">(2016-11-30)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>Added: Support high-DPI images for custom moderator badges.</li>
|
||||
|
|
@ -54,10 +60,5 @@
|
|||
<li>Fixed: Properly generate CSS for bits emoticons with every possible prefix.</li>
|
||||
</ul>
|
||||
|
||||
<div class="list-header">3.5.376 <time datetime="2016-11-21">(2016-11-21)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>Fixed: Cheers aren't working yet, but they also don't break chat completely.</li>
|
||||
</ul>
|
||||
|
||||
<div class="list-header" id="ffz-old-news-button"><a href="#">View Older</a></div>
|
||||
<div id="ffz-old-news"></div>
|
||||
2
dark.css
2
dark.css
|
|
@ -139,6 +139,8 @@ body.ffz-dark:not([data-page="teams#show"]),
|
|||
background-color: rgba(16,16,16,0.3) !important;
|
||||
}
|
||||
|
||||
.ffz-dark .player-placeholder { background: #000 }
|
||||
|
||||
.ffz-dark div.title > span.over:hover,
|
||||
.ffz-dark div.title > span.real:hover,
|
||||
.ffz-dark #broadcast-meta .info .title:hover {
|
||||
|
|
|
|||
|
|
@ -1,3 +1,8 @@
|
|||
<div class="list-header">3.5.376 <time datetime="2016-11-21">(2016-11-21)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>Fixed: Cheers aren't working yet, but they also don't break chat completely.</li>
|
||||
</ul>
|
||||
|
||||
<div class="list-header">3.5.375 <time datetime="2016-11-21">(2016-11-21)</time></div>
|
||||
<ul class="chat-menu-content menu-side-padding">
|
||||
<li>Added: Option to disable subscriber loyalty badges in favor of displaying the lowest tier for all subscribers.</li>
|
||||
|
|
|
|||
|
|
@ -183,6 +183,23 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
this.$().on("click", ".ffz-creative-tag-link", utils.transition_link(function(e) {
|
||||
utils.transition('directory.creative.hashtag.index', this.getAttribute('data-tag'));
|
||||
}));
|
||||
|
||||
var t = this;
|
||||
this.$('.player-placeholder').on('click', function() { t.updatePlayerPosition() })
|
||||
|
||||
if ( this.updatePlayerPosition ) {
|
||||
this._ffz_loaded = Date.now();
|
||||
this._ffz_player_repositoner = setInterval(this.ffzUpdatePlayerPosition.bind(this), 250);
|
||||
}
|
||||
},
|
||||
|
||||
ffzUpdatePlayerPosition: function() {
|
||||
if ( this._ffz_player_repositoner && Date.now() - this._ffz_loaded > 60000 ) {
|
||||
clearInterval(this._ffz_player_repositoner);
|
||||
this._ffz_player_repositoner = null;
|
||||
}
|
||||
|
||||
this.updatePlayerPosition();
|
||||
},
|
||||
|
||||
ffzUpdateAttributes: function() {
|
||||
|
|
@ -247,7 +264,11 @@ FFZ.prototype.modify_channel_live = function(view) {
|
|||
this._fix_host_timer = null;
|
||||
}
|
||||
|
||||
document.body.classList.remove('ffz-small-player');
|
||||
if ( this._ffz_player_repositoner ) {
|
||||
clearInterval(this._ffz_player_repositoner);
|
||||
this._ffz_player_repositoner = null;
|
||||
}
|
||||
|
||||
utils.update_css(f._channel_style, channel_id, null);
|
||||
},
|
||||
|
||||
|
|
@ -554,8 +575,6 @@ FFZ.prototype.modify_channel_redesign = function(view) {
|
|||
|
||||
handleScroll: function(top) {
|
||||
this._super();
|
||||
var height = this.channelCoverHeight + Layout.get('fullSizePlayerDimensions.height');
|
||||
document.body.classList.toggle('ffz-small-player', f.settings.small_player && top >= (height * .8));
|
||||
},
|
||||
|
||||
ffzUpdateCoverHeight: function() {
|
||||
|
|
@ -568,9 +587,12 @@ FFZ.prototype.modify_channel_redesign = function(view) {
|
|||
this.channelCoverHeight = new_height;
|
||||
this.$("#channel").toggleClass('ffz-bar-fixed', this.get('isFixed'));
|
||||
|
||||
if ( old_height !== new_height )
|
||||
if ( this.$scrollContainer && old_height !== new_height )
|
||||
this.scrollTo(this.$scrollContainer.scrollTop() + (new_height - old_height));
|
||||
|
||||
if ( this.updatePlayerPosition )
|
||||
setTimeout(this.updatePlayerPosition.bind(this));
|
||||
|
||||
}.observes('isFixed')
|
||||
})
|
||||
}
|
||||
|
|
@ -593,28 +615,6 @@ FFZ.settings_info.auto_theater = {
|
|||
};
|
||||
|
||||
|
||||
FFZ.settings_info.small_player = {
|
||||
type: "boolean",
|
||||
value: false,
|
||||
no_mobile: true,
|
||||
no_bttv: true,
|
||||
|
||||
category: "Appearance",
|
||||
name: "Mini-Player on Scroll",
|
||||
help: "When you scroll down on the page, shrink the player and put it in the upper right corner so you can still watch.",
|
||||
|
||||
on_update: function(val) {
|
||||
if ( ! val )
|
||||
return document.body.classList.remove('ffz-small-player');
|
||||
|
||||
else if ( this._vodc )
|
||||
this._vodc.ffzOnScroll();
|
||||
else if ( this._cindex )
|
||||
this._cindex.ffzOnScroll();
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
FFZ.settings_info.chatter_count = {
|
||||
type: "boolean",
|
||||
value: false,
|
||||
|
|
|
|||
|
|
@ -271,11 +271,9 @@ FFZ.prototype.setup_layout = function() {
|
|||
var size = this.get('fullSizePlayerDimensions');
|
||||
|
||||
return '<style>' +
|
||||
'.ffz-small-player:not(.ffz-bttv)[data-current-path^="user."] .app-main:not(.theatre) .js-player,' +
|
||||
'.dynamic-player, .dynamic-player object, .dynamic-player video {' +
|
||||
'width:' + size.width + 'px !important;' +
|
||||
'height:' + size.height + 'px !important}' +
|
||||
'.ffz-small-player:not(.ffz-bttv)[data-current-path^="user."] .app-main:not(.theatre) .js-player,' +
|
||||
'.dynamic-target-player, .dynamic-target-player object, .dynamic-target-player video {' +
|
||||
'width:' + size.width + 'px !important;' +
|
||||
'height:' + size.targetHeight + 'px !important}' +
|
||||
|
|
@ -303,21 +301,10 @@ FFZ.prototype.setup_layout = function() {
|
|||
var window_height = this.get('windowHeight'),
|
||||
window_width = this.get('windowWidth'),
|
||||
width = this.get('rightColumnWidth'),
|
||||
out = 'body.ffz-small-player .js-player .dynamic-player {' +
|
||||
'position: fixed;' +
|
||||
'z-index: 9;' +
|
||||
'box-shadow: 0 0 20px 0 black;';
|
||||
|
||||
if ( .25 * window_width >= .5 * window_height )
|
||||
out += 'width: 25vw !important; height: 14.0625vw !important;';
|
||||
else
|
||||
out += 'width: 50vh !important; height: 28.125vh !important;';
|
||||
out = '';
|
||||
|
||||
if ( ! f.has_bttv ) {
|
||||
if ( this.get('isRightColumnClosed') )
|
||||
out += 'top: 0; right: 0}';
|
||||
|
||||
else {
|
||||
if ( ! this.get('isRightColumnClosed') ) {
|
||||
if ( this.get('portraitMode') ) {
|
||||
var size = this.get('fullSizePlayerDimensions'),
|
||||
video_below = this.get('portraitVideoBelow'),
|
||||
|
|
@ -336,7 +323,14 @@ FFZ.prototype.setup_layout = function() {
|
|||
theatre_video_bottom = window_height - (theatre_video_top + theatre_video_height),
|
||||
theatre_chat_top = video_below ? 0 : theatre_video_height;
|
||||
|
||||
out += 'top: ' + video_top + 'px;right: 0}' +
|
||||
out += '.player-mini {' +
|
||||
'bottom: ' + (10 + video_bottom) + 'px}' +
|
||||
'.ffz-channel-bar-bottom .player-mini {' +
|
||||
'bottom: ' + (60 + video_bottom) + 'px}' +
|
||||
'.ffz-channel-bar-bottom.ffz-minimal-channel-bar .player-mini {' +
|
||||
'bottom: ' + (20 + video_bottom) + 'px}' +
|
||||
'.ffz-sidebar-swap .player-mini {' +
|
||||
'left: 10px !important}' +
|
||||
'body[data-current-path^="user."] #left_col .warp { min-height: inherit }' +
|
||||
'body[data-current-path^="user."] #left_col { overflow: hidden }' +
|
||||
'body[data-current-path^="user."] #left_col .warp,' +
|
||||
|
|
@ -384,8 +378,8 @@ FFZ.prototype.setup_layout = function() {
|
|||
'.ffz-theater-stats:not(.ffz-theatre-conversations):not(.ffz-top-conversations) .app-main.theatre .cn-metabar__more {' +
|
||||
'bottom: ' + (theatre_video_bottom + 90) + 'px !important}';
|
||||
|
||||
} else {
|
||||
out += 'top: 0; right: ' + width + 'px}' +
|
||||
} else {
|
||||
out += '.ffz-sidebar-swap .player-mini{left:' + (width + 10) + 'px !important}' +
|
||||
'#main_col.expandRight #right_close{left: none !important}' +
|
||||
'#right_col{width:' + width + 'px}' +
|
||||
'body:not(.ffz-sidebar-swap) #main_col:not(.expandRight){' +
|
||||
|
|
@ -447,5 +441,6 @@ FFZ.prototype.setup_layout = function() {
|
|||
Ember.propertyDidChange(Layout, 'windowHeight');
|
||||
Ember.propertyDidChange(Layout, 'ffzExtraHeight');
|
||||
Ember.propertyDidChange(Layout, 'isTooSmallForRightColumn');
|
||||
Ember.propertyDidChange(Layout, 'fullSizePlayerDimensions');
|
||||
Layout.ffzUpdatePortraitCSS();
|
||||
}
|
||||
|
|
@ -61,7 +61,7 @@ FFZ.channel_metadata = {};
|
|||
|
||||
// Version
|
||||
var VER = FFZ.version_info = {
|
||||
major: 3, minor: 5, revision: 386,
|
||||
major: 3, minor: 5, revision: 387,
|
||||
toString: function() {
|
||||
return [VER.major, VER.minor, VER.revision].join(".") + (VER.extra || "");
|
||||
}
|
||||
|
|
|
|||
10
style.css
10
style.css
|
|
@ -3591,6 +3591,7 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
|
|||
.ffz-channel-title-top .cn-metabar__title {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.ffz-channel-title-top:not(.ffz-channel-bar-bottom):not(.ffz-minimal-channel-bar) #channel.ffz-bar-fixed .cn-metabar__title {
|
||||
|
|
@ -3602,8 +3603,7 @@ body.ffz-bttv #ffz-feed-tabs .tabs { margin-bottom: 0 }
|
|||
transition: top ease-in-out 75ms, bottom ease-in-out 75ms;
|
||||
}
|
||||
|
||||
body:not(.ffz-channel-bar-bottom).ffz-small-player .js-player .dynamic-player { margin-top: 50px }
|
||||
body:not(.ffz-channel-bar-bottom).ffz-small-player.ffz-minimal-channel-bar .js-player .dynamic-player { margin-top: 10px }
|
||||
.ffz-channel-bar-bottom .player-mini { bottom: 20px }
|
||||
|
||||
.ffz-minimal-channel-bar .cn-bar-fixed:hover { top: 0 }
|
||||
.ffz-minimal-channel-bar.ffz-channel-bar-bottom .cn-bar-fixed { top: auto; bottom: -40px }
|
||||
|
|
@ -3839,4 +3839,10 @@ body.ffz-sidebar-swap .app-main.theatre #main_col:not(.expandRight) #player[data
|
|||
.ffz-pinned-cheer-expand-hover .pinned-cheers__message:hover .pinned-cheer__expando-arrow { transform: none }
|
||||
.ffz-pinned-cheer-expand-hover .pinned-cheers__message .pinned-cheer__expando-arrow {
|
||||
transform: rotateX(180deg);
|
||||
}
|
||||
|
||||
/* Player Mini Positioning Stuff */
|
||||
|
||||
.ffz-sidebar-swap .expandRight .player-mini {
|
||||
left: 10px !important;
|
||||
}
|
||||
Loading…
Add table
Add a link
Reference in a new issue