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
8 changed files with 87 additions and 50 deletions
|
|
@ -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…
Add table
Add a link
Reference in a new issue