HTML5 fullscreen api - exit issue
Reported by
ab...@breadcreative.com,
Aug 11 2016
|
|||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_11_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36 Steps to reproduce the problem: 1. Enter full screen mode on an element via a chrome extension. 2. Press escape to exit full screen. What is the expected behavior? The browser window should resize to it's original size before entering full screen mode. What went wrong? The browser resizes to a maximised window state. The OS now saves the outer bounds and it will always open with that size - it will ignore bounds set on window creation. The only way to resolve it is to uninstall the app. Did this work before? No Chrome version: 52.0.2743.116 Channel: stable OS Version: OS X 10.11.6 Flash Version: Shockwave Flash 22.0 r0 Important note: This only happens on a chrome extension. The same application online (web app) works without a problem. Another important note is that this only happens on El-Capitan (pre El-Capitan works) - so Apple must of changed the way they handle full screen but Chrome has not been updated to handle this change. I cannot provide you with a live link but only video, screenshots and code (which I will post as a reply after as it's on a different machine).
,
Aug 11 2016
Function to open the viewer (Second window on the screen cast)
openViewer: function(pres_id) {
var self = this;
self.current_presentation_id = pres_id;
chrome.app.window.create(
'view/viewer.html',
{
id: 'presentation-viewer-'+pres_id,
outerBounds: { width: 1024, height: 840 },
resizable: "true",
}, function(createdWindow) {
if(createdWindow.isFullscreen() === true) {
window.setTimeout(function() {
createdWindow.contentWindow.window.viewer.reStoreSize('presentation-viewer-'+pres_id);
}, 500);
}
// Run animation for first slide
window.setTimeout(function() {
createdWindow.contentWindow.window.viewer.reScale();
createdWindow.contentWindow.window.viewer.firstSlideAnimation();
createdWindow.contentWindow.window.viewer.toggleNavigation();
}, 3500);
createdWindow.onClosed.addListener(function() {
//Close all sockets on close
chrome.sockets.tcp.getSockets(function(s) {
$(s).each(function() {
chrome.sockets.tcp.disconnect(this.socketId);
chrome.sockets.tcp.close(this.socketId);
});
});
});
}
);
}
Function to enter full screen
$('#fullscreen-button').unbind("click").on('click', function(){
viewer.setFullscreen();
});
setFullscreen: function() {
if(!viewer.isFullScreen()) {
document.body.webkitRequestFullscreen();
} else {
document.webkitCancelFullScreen();
}
},
document.addEventListener("webkitfullscreenchange", function () {
if(document.webkitIsFullScreen === true) {
document.querySelector('.active webview').contentWindow.postMessage('fullscreen, enter', 'http://'+viewer.app.networkHost+':'+viewer.app.networkPort+'/*');
document.body.webkitRequestFullscreen();
$("#presenter, #slide-container .owl-item").addClass('fullscreen tenTwenty');
$("#viewer-container, #slide-container").addClass('fullscreen thirteenSix');
$("#scroll-left, #scroll-right, #scroll-top").addClass('scroll-fullscreen');
$('.fullscreen').width(screen.width);
$('.fullscreen').height(screen.height);
$('#slide-container').trigger('refresh.owl.carousel');
viewer.showControls();
} else {
//console.log('not fullscreen');
document.webkitCancelFullScreen();
document.querySelector('.active webview').contentWindow.postMessage('fullscreen, exit', 'http://'+viewer.app.networkHost+':'+viewer.app.networkPort+'/*');
$('.tenTwenty').width(1024); $('.tenTwenty').height(768);
$('.thirteenSix').width(1366); $('.thirteenSix').height(768);
$("#presenter, #viewer-container, #slide-container, #slide-container .owl-item").removeClass('fullscreen tenTwenty thirteenSix');
$("#scroll-left, #scroll-right, #scroll-top").removeClass('scroll-fullscreen');
$('#slide-container').trigger('refresh.owl.carousel');
viewer.showControls();
}
}, false);
Content script:
'addEventListener(\'message\', function(e) {',
'if (!messageSource) {',
'if (e.data == "hello, webpage!") {',
'messageSource = e.source;',
'messageOrigin = e.origin;',
'messageSource.postMessage("hello, host!", messageOrigin);',
'console.log("hello host");',
'} else if (e.data == "fullscreen, enter") {',
'chromeAppFullScreen();',
'console.log("enter fullscreen from message")',
'} else if(e.data == "fullscreen, exit") {',
'chromeAppFullScreen();',
'console.log("exit fullscreen from message")',
'} else if (e.data == "stop, video") {',
'$("video")[0].pause();',
'console.log("video is paused");',
'}',
'} else {',
'return false;',
'}',
'});'
,
Aug 15 2016
spqchan, can you investigate?
,
May 23 2017
Issue cannot be reproduced. Please reopen if otherwise |
|||
►
Sign in to add a comment |
|||
Comment 1 by ab...@breadcreative.com
, Aug 11 20169.8 MB
9.8 MB Download