cinera: Fix mobile scrolling and centring
This commit fixes spurious scrolling in DeriveReliableWindowDimensions() on mobile. It also fixes centring of Vimeo videos on mobile. In addition, it replaces some deprecated JavaScript: • window.orientation → screen.orientation.type • window.onorientationchange → screen.orientation.onchange
This commit is contained in:
parent
9d5f0f9146
commit
026585e50b
|
@ -23,7 +23,7 @@ typedef struct
|
||||||
version CINERA_APP_VERSION = {
|
version CINERA_APP_VERSION = {
|
||||||
.Major = 0,
|
.Major = 0,
|
||||||
.Minor = 10,
|
.Minor = 10,
|
||||||
.Patch = 25
|
.Patch = 26
|
||||||
};
|
};
|
||||||
|
|
||||||
#define __USE_XOPEN2K8 // NOTE(matt): O_NOFOLLOW
|
#define __USE_XOPEN2K8 // NOTE(matt): O_NOFOLLOW
|
||||||
|
|
|
@ -42,7 +42,7 @@ window.addEventListener("resize", function() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
window.onorientationchange = function() {
|
screen.orientation.onchange = function() {
|
||||||
if(CineraProps.IsMobile)
|
if(CineraProps.IsMobile)
|
||||||
{
|
{
|
||||||
setTimeout(DelayedUpdateSize, 512, player);
|
setTimeout(DelayedUpdateSize, 512, player);
|
||||||
|
|
|
@ -955,8 +955,7 @@ Player.prototype.InitMobileStyle = function()
|
||||||
this.IconifyMenuTogglers();
|
this.IconifyMenuTogglers();
|
||||||
this.InitMobileControls();
|
this.InitMobileControls();
|
||||||
this.ConnectMobileControls();
|
this.ConnectMobileControls();
|
||||||
var VideoContainer = this.root.querySelector(".video_container");
|
this.ApplyMobileStyle(this.videoContainer);
|
||||||
this.ApplyMobileStyle(VideoContainer);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Call this after changing the size of the video container in order to update the platform player.
|
// Call this after changing the size of the video container in order to update the platform player.
|
||||||
|
@ -1461,7 +1460,10 @@ Player.prototype.onPlatformReady = function() {
|
||||||
case vod_platform.VIMEO:
|
case vod_platform.VIMEO:
|
||||||
{
|
{
|
||||||
this.videoContainer.style.position = "relative";
|
this.videoContainer.style.position = "relative";
|
||||||
this.videoContainer.style.alignSelf = "unset";
|
if(!CineraProps.IsMobile)
|
||||||
|
{
|
||||||
|
this.videoContainer.style.alignSelf = "unset";
|
||||||
|
}
|
||||||
|
|
||||||
var CallData = {
|
var CallData = {
|
||||||
id: this.videoContainer.getAttribute("data-videoId"),
|
id: this.videoContainer.getAttribute("data-videoId"),
|
||||||
|
|
|
@ -13,6 +13,9 @@ DeriveReliableWindowDimensions()
|
||||||
Y: null,
|
Y: null,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
var ScrollPosX = window.scrollX;
|
||||||
|
var ScrollPosY = window.scrollY;
|
||||||
|
|
||||||
var DisplaySettings = [];
|
var DisplaySettings = [];
|
||||||
for(var i = 0; i < document.body.children.length; ++i)
|
for(var i = 0; i < document.body.children.length; ++i)
|
||||||
{
|
{
|
||||||
|
@ -40,6 +43,9 @@ DeriveReliableWindowDimensions()
|
||||||
Child.style.display = DisplaySettings.shift();
|
Child.style.display = DisplaySettings.shift();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ScrollTriggeredInternally = true;
|
||||||
|
window.scroll(ScrollPosX, ScrollPosY);
|
||||||
|
|
||||||
return Result;
|
return Result;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -76,7 +82,7 @@ function IsVisible(Element, WindowDim) {
|
||||||
function
|
function
|
||||||
GetRealOrientation(PreferredLandscape, IsMobile)
|
GetRealOrientation(PreferredLandscape, IsMobile)
|
||||||
{
|
{
|
||||||
var Result = window.orientation;
|
var Result = screen.orientation.angle;
|
||||||
var WindowDim = GetWindowDim(IsMobile);
|
var WindowDim = GetWindowDim(IsMobile);
|
||||||
if(WindowDim.Y > WindowDim.X)
|
if(WindowDim.Y > WindowDim.X)
|
||||||
{
|
{
|
||||||
|
@ -317,6 +323,7 @@ function IsInRangeEx(Min, N, Max)
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Auto-scrolling */
|
/* Auto-scrolling */
|
||||||
|
var ScrollTriggeredInternally = false;
|
||||||
var LastScrollYPos = 0;
|
var LastScrollYPos = 0;
|
||||||
var ScrollTicking = false;
|
var ScrollTicking = false;
|
||||||
var ScrollerFunction;
|
var ScrollerFunction;
|
||||||
|
@ -383,7 +390,11 @@ function
|
||||||
InitScrollEventListener(Element, IsMobile, StickyObscuringElement)
|
InitScrollEventListener(Element, IsMobile, StickyObscuringElement)
|
||||||
{
|
{
|
||||||
window.addEventListener('scroll', function() {
|
window.addEventListener('scroll', function() {
|
||||||
if(ScrollCondition == undefined || ScrollCondition == true)
|
if(ScrollTriggeredInternally)
|
||||||
|
{
|
||||||
|
ScrollTriggeredInternally = false;
|
||||||
|
}
|
||||||
|
else if(ScrollCondition == undefined || ScrollCondition == true)
|
||||||
{
|
{
|
||||||
LastScrollYPos = window.scrollY;
|
LastScrollYPos = window.scrollY;
|
||||||
|
|
||||||
|
|
|
@ -3866,7 +3866,7 @@ InitResizeEventListener()
|
||||||
function
|
function
|
||||||
InitOrientationChangeListener()
|
InitOrientationChangeListener()
|
||||||
{
|
{
|
||||||
window.onorientationchange = function()
|
screen.orientation.onchange = function()
|
||||||
{
|
{
|
||||||
if(CineraProps.IsMobile)
|
if(CineraProps.IsMobile)
|
||||||
{
|
{
|
||||||
|
|
Loading…
Reference in New Issue