Finished bugfixing new layout, fixed mobile support(still not perfect, will fix in either hotfix or next
update) and user tooltip menu positioning.
This commit is contained in:
rainbownapkin
parent
37980669d5
commit
a16da4c3f1
|
|
@ -144,7 +144,7 @@ dev goals for 1.1 pineapple express:
|
|||
- dailymotion ✓
|
||||
- vimeo ✓
|
||||
- shade player ✓
|
||||
- player controls in title bar when video shaded (play/pause, mute, current time/video duration), hidden when video open ✓
|
||||
- player controls in title bar when video shaded (play/pause, mute, current time/video duration), hidden when video open ✓
|
||||
- minicont update in videojs ✓
|
||||
- minicont update in dailymotion ✓
|
||||
- minicont update in vimeo ✓
|
||||
|
|
@ -153,6 +153,9 @@ dev goals for 1.1 pineapple express:
|
|||
- scroll over minicont mutebtn to change vol ✓
|
||||
- remove legacy cytube themes. If they wheren't compatible after the emote panel, they certainly won't be now lmao ✓
|
||||
- fix bugs created by flex layout ✓
|
||||
- fix fpanel width ✓
|
||||
- fix portrait/mobile mode ✓
|
||||
- fix user tooltip menu position ✓
|
||||
|
||||
- decaffeinate player.js
|
||||
- Coffee script was a bad idea then, and it makes even less sense now.
|
||||
|
|
@ -180,7 +183,7 @@ dev goals for 1.1 pineapple express:
|
|||
|
||||
- merge tokebot into ourfore.st codebase, one server instead of two.
|
||||
- profile and userlist entry
|
||||
-bot specific rank
|
||||
- bot specific rank
|
||||
- reset cooldown accessible from modmenu (quiet and loud, quiet by default)
|
||||
- log tokes w/ date to file. This will be switched to mariadb in the next update
|
||||
- tokefile, list of usernames with toke count. This will be switched to mariadb in the next update
|
||||
|
|
@ -199,7 +202,7 @@ dev goals for 1.1 pineapple express:
|
|||
- open playlist below video by default
|
||||
|
||||
|
||||
-merge fore.st theme changes to fore.st dusk, consider moving some of them over to cytube.css for easier management
|
||||
- merge fore.st theme changes to fore.st dusk, consider moving some of them over to cytube.css for easier management
|
||||
|
||||
- extra shit(probs wait til next update, or hotfix)
|
||||
- short chats (acronyms, emoji, single letters/numbers/symbols) pop in over video from left starting at top left, overflow pops in below, instead of in chat box. Chats slide back up into top of vid after 2s. (optional, default on)
|
||||
|
|
|
|||
|
|
@ -67,11 +67,6 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
|
|||
setMini();
|
||||
)
|
||||
|
||||
@player.on('canplay', =>
|
||||
handleVideoResize()
|
||||
console.log(@player.children)
|
||||
)
|
||||
|
||||
# Once the video stops, the internal state of the player
|
||||
# becomes unusable and attempting to load() will corrupt it and
|
||||
# crash the player with an error. As a short–medium term
|
||||
|
|
@ -82,7 +77,7 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
|
|||
)
|
||||
@dm.addEventListener('playback_ready', =>
|
||||
@dmReady = true
|
||||
handleVideoResize()
|
||||
handleWindowResize()
|
||||
|
||||
if @playbackReadyCb
|
||||
@playbackReadyCb()
|
||||
|
|
@ -101,7 +96,7 @@ window.DailymotionPlayer = class DailymotionPlayer extends Player
|
|||
# TODO: Player::load() needs to be made asynchronous in the future
|
||||
console.log('Warning: load() called before DM is ready, queueing callback')
|
||||
@playbackReadyCb = () =>
|
||||
handleVideoResize()
|
||||
handleWindowResize()
|
||||
|
||||
@dm.load(data.id)
|
||||
@dm.seek(data.currentTime)
|
||||
|
|
|
|||
|
|
@ -171,7 +171,7 @@ window.VideoJSPlayer = class VideoJSPlayer extends Player
|
|||
|
||||
|
||||
@player.on('canplay', =>
|
||||
handleVideoResize()
|
||||
handleWindowResize()
|
||||
console.log(@player.children)
|
||||
)
|
||||
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ window.VimeoPlayer = class VimeoPlayer extends Player
|
|||
@vimeo.on('play', =>
|
||||
@paused = false
|
||||
setMini();
|
||||
handleVideoResize()
|
||||
handleWindowResize()
|
||||
if CLIENT.leader
|
||||
sendVideoUpdate()
|
||||
)
|
||||
|
|
|
|||
|
|
@ -31,6 +31,7 @@ function closeFPanel(cb){//close and null out fpanel, cb function to call when p
|
|||
}
|
||||
|
||||
function sizeFPDiv(){//set inner div height to fix overflow
|
||||
$("#fpaneldiv").outerWidth($("#chatwrap").outerWidth() * 0.7);
|
||||
$("#fpcontdiv").outerHeight($("#fpaneldiv").height() - $("#fptitlediv").outerHeight());
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -131,7 +131,7 @@
|
|||
_this.vimeo.on('play', function() {
|
||||
_this.paused = false;
|
||||
setMini();
|
||||
handleVideoResize();
|
||||
handleWindowResize();
|
||||
if (CLIENT.leader) {
|
||||
return sendVideoUpdate();
|
||||
}
|
||||
|
|
@ -421,16 +421,12 @@
|
|||
_this.dm.addEventListener('volumechange', function() {
|
||||
return setMini();
|
||||
});
|
||||
_this.player.on('canplay', function() {
|
||||
handleVideoResize();
|
||||
return console.log(_this.player.children);
|
||||
});
|
||||
_this.dm.addEventListener('video_end', function() {
|
||||
return _this.dmReady = false;
|
||||
});
|
||||
return _this.dm.addEventListener('playback_ready', function() {
|
||||
_this.dmReady = true;
|
||||
handleVideoResize();
|
||||
handleWindowResize();
|
||||
if (_this.playbackReadyCb) {
|
||||
_this.playbackReadyCb();
|
||||
return _this.playbackReadyCb = null;
|
||||
|
|
@ -450,7 +446,7 @@
|
|||
console.log('Warning: load() called before DM is ready, queueing callback');
|
||||
return this.playbackReadyCb = (function(_this) {
|
||||
return function() {
|
||||
handleVideoResize();
|
||||
handleWindowResize();
|
||||
_this.dm.load(data.id);
|
||||
return _this.dm.seek(data.currentTime);
|
||||
};
|
||||
|
|
@ -719,7 +715,7 @@
|
|||
}
|
||||
});
|
||||
_this.player.on('canplay', function() {
|
||||
handleVideoResize();
|
||||
handleWindowResize();
|
||||
return console.log(_this.player.children);
|
||||
});
|
||||
_this.player.on('timeupdate', function() {
|
||||
|
|
|
|||
|
|
@ -1076,7 +1076,7 @@ $("#cs-emotes-import").click(function () {
|
|||
});
|
||||
|
||||
var toggleUserlist = function () {
|
||||
var direction = !USEROPTS.layout.match(/synchtube/) ? "glyphicon-chevron-right" : "glyphicon-chevron-left"
|
||||
var direction = "glyphicon-chevron-left"
|
||||
if ($("#userlist")[0].style.display === "none") {
|
||||
$("#userlist").show();
|
||||
$("#userlisttoggle").removeClass(direction).addClass("glyphicon-chevron-down");
|
||||
|
|
|
|||
100
www/js/util.js
100
www/js/util.js
|
|
@ -426,7 +426,7 @@ function addUserDropdown(entry) {
|
|||
}
|
||||
});
|
||||
menu.show();
|
||||
menu.css("top", entry.position().top);
|
||||
menu.css("top", entry.position().top - $("#chatwrap").offset().top);
|
||||
} else {
|
||||
menu.hide();
|
||||
}
|
||||
|
|
@ -1812,47 +1812,90 @@ function showDesktopNotification(notificationTitle, notificationBody)
|
|||
}
|
||||
|
||||
function handleWindowResize() {
|
||||
var vid = $("#videowrap");
|
||||
var cht = $("#chatwrap");
|
||||
var isPortrait = (window.innerWidth - parseInt(vid.css("width"))) == 0;
|
||||
|
||||
if(!isPortrait){
|
||||
vid.css("height",window.innerHeight);
|
||||
cht.css("height",window.innerHeight);
|
||||
}
|
||||
var vid = $("#videowrap");
|
||||
var cht = $("#chatwrap");
|
||||
var res;
|
||||
var isPortrait = (parseInt(window.innerWidth) - parseInt(window.innerHeight)) <= 0;
|
||||
|
||||
//if ($("body").hasClass("chatOnly")) {
|
||||
var rawh = $("body").outerHeight() -
|
||||
($("#motdwrap").is(":visible") ? $("#motdwrap").outerHeight() : 0) -
|
||||
($("#footer").is(":visible") ? $("#footer").outerHeight() : 0) -
|
||||
($(".navbar").is(":visible") ? $(".navbar").outerHeight() : 0) -
|
||||
$("#chatheader").outerHeight() - 1;
|
||||
|
||||
var h = rawh - $("#chatline").outerHeight();
|
||||
var h = rawh - $("#chatline").outerHeight();
|
||||
|
||||
$("#messagebuffer").outerHeight(h);
|
||||
$("#fpaneldiv").outerHeight(h - 1);
|
||||
$(".embed-responsive").outerHeight(rawh);
|
||||
$("#ytapiplayer").outerHeight(rawh);
|
||||
$("#userlist").outerHeight(h);
|
||||
$("#sidepanel").outerHeight(h);
|
||||
$("#chatwrap").outerHeight(rawh);
|
||||
$("#videowrap").outerHeight(rawh);
|
||||
|
||||
chatWidthLockoff = 0;
|
||||
|
||||
if(($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth() >= 1)){
|
||||
lastmin = ((($("#videowrap").outerWidth() - ($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth())) / $("body").outerWidth()) * 100);
|
||||
$("#videowrap").css("flex-basis", lastmin + "%");
|
||||
chatWidthLockoff = $("#chatwrap").offset().left;
|
||||
if(!isPortrait){
|
||||
//set default layout
|
||||
if($("#videowrap").parent().attr("id") != "main"){
|
||||
$("#titles").append($("#videowrap-header"));
|
||||
$("#titles").append($("#chatheader"));
|
||||
$("#main").append($("#videowrap"));
|
||||
$("#main").css("flex-direction", "row");
|
||||
$("#titles").css("flex-direction", "row");
|
||||
$("#main").append($("#chatwrap"));
|
||||
}
|
||||
|
||||
|
||||
//if ($("body").hasClass("chatOnly")) {
|
||||
|
||||
|
||||
|
||||
$("#videowrap").outerHeight(rawh);
|
||||
$(".embed-responsive").outerHeight(rawh);
|
||||
$("#ytapiplayer").outerHeight(rawh);
|
||||
|
||||
chatWidthLockoff = 0;
|
||||
|
||||
if(($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth() >= 1)){
|
||||
lastmin = ((($("#videowrap").outerWidth() - ($("#chatwrap").offset().left + $("#chatwrap").outerWidth() - $("body").outerWidth())) / $("body").outerWidth()) * 100);
|
||||
$("#videowrap").css("flex-basis", lastmin + "%");
|
||||
chatWidthLockoff = $("#chatwrap").offset().left;
|
||||
}
|
||||
|
||||
}else{
|
||||
//set mobile layout
|
||||
if($("#videowrap").parent().attr("id") != "titles"){
|
||||
$("#titles").append($("#videowrap-header"));
|
||||
$("#titles").append($("#videowrap"));
|
||||
$("#main").append($("#chatheader"));
|
||||
$("#main").append($("#chatwrap"));
|
||||
$("#main").css("flex-direction", "column");
|
||||
$("#titles").css("flex-direction", "column");
|
||||
}
|
||||
|
||||
if(window.PLAYER != null && typeof(window.PLAYER.getRes) === "function"){
|
||||
window.PLAYER.getRes(function(x){
|
||||
res = x != null ? x : [0,0];
|
||||
});
|
||||
|
||||
rheight = (res[1]/res[0]) * parseInt(window.innerWidth);
|
||||
|
||||
//if(!$("#chatbar").is(":focus")){
|
||||
$("#videowrap").outerHeight(rheight);
|
||||
$(".embed-responsive").outerHeight(rheight);
|
||||
$("#ytapiplayer").outerHeight(rheight);
|
||||
h = h - rheight - $("#videowrap-header").outerHeight();
|
||||
rawh = rawh - rheight - $("#videowrap-header").outerHeight();
|
||||
//}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//if(!isPortrait || !$("#chatbar").is(":focus")){
|
||||
$("#messagebuffer").outerHeight(h);
|
||||
$("#fpaneldiv").outerHeight(h - 1);
|
||||
$("#userlist").outerHeight(h);
|
||||
$("#sidepanel").outerHeight(h);
|
||||
$("#chatwrap").outerHeight(rawh);
|
||||
sizeFPDiv();//resize fpanel
|
||||
//}
|
||||
|
||||
|
||||
sizeFPDiv();
|
||||
$("#fpaneldiv").outerWidth($("#chatwrap").outerWidth() * 0.7);
|
||||
handleVideoResize();
|
||||
|
||||
//scrollChat();
|
||||
}
|
||||
|
||||
function handleVideoResize() {//rewritten to adjust width to aspect ratio
|
||||
|
|
@ -2949,7 +2992,6 @@ function formatScriptAccessPrefs() {
|
|||
|
||||
var channelName = channel.substring(0, idx);
|
||||
var prefType = channel.substring(idx + 1);
|
||||
console.log(channelName, prefType);
|
||||
if (prefType !== "external" && prefType !== "embedded") {
|
||||
// Invalid
|
||||
console.error("Channel JS pref: invalid key '" + channel + "', deleting it");
|
||||
|
|
|
|||
Loading…
Reference in a new issue