diff --git a/dev/Common/Fullscreen.js b/dev/Common/Fullscreen.js new file mode 100644 index 000000000..dc7e42fb5 --- /dev/null +++ b/dev/Common/Fullscreen.js @@ -0,0 +1,23 @@ +import { doc, elementById, $htmlCL } from 'Common/Globals'; + +// Fullscreen must be on app, else other popups fail +export const + app = elementById('rl-app'), + appFullscreen = () => (doc.fullscreenElement || doc.webkitFullscreenElement) === app, + exitFullscreen = () => appFullscreen() && (doc.exitFullscreen || doc.webkitExitFullscreen).call(doc), + isFullscreen = ko.observable(false), + toggleFullscreen = () => isFullscreen() ? exitFullscreen() : app.requestFullscreen(); + +if (app) { + let event = 'fullscreenchange'; + if (!app.requestFullscreen && app.webkitRequestFullscreen) { + app.requestFullscreen = app.webkitRequestFullscreen; + event = 'webkit'+event; + } + if (app.requestFullscreen) { + doc.addEventListener(event, () => { + isFullscreen(appFullscreen()); + $htmlCL.toggle('rl-fullscreen', appFullscreen()); + }); + } +} diff --git a/dev/Common/Globals.js b/dev/Common/Globals.js index 0e1baae0f..e260e79ea 100644 --- a/dev/Common/Globals.js +++ b/dev/Common/Globals.js @@ -11,13 +11,6 @@ export const elementById = id => doc.getElementById(id), - // Fullscreen must be on app, else other popups fail - app = doc.getElementById('rl-app'), - appFullscreen = () => (doc.fullscreenElement || doc.webkitFullscreenElement) === app, - exitFullscreen = () => appFullscreen() && (doc.exitFullscreen || doc.webkitExitFullscreen).call(doc), - isFullscreen = ko.observable(false), - toggleFullscreen = () => isFullscreen() ? exitFullscreen() : app.requestFullscreen(), - Settings = rl.settings, SettingsGet = Settings.get, SettingsCapa = Settings.capa, @@ -65,20 +58,6 @@ export const shortcuts.setScope(value); }; -if (app) { - let event = 'fullscreenchange'; - if (!app.requestFullscreen && app.webkitRequestFullscreen) { - app.requestFullscreen = app.webkitRequestFullscreen; - event = 'webkit'+event; - } - if (app.requestFullscreen) { - doc.addEventListener(event, () => { - isFullscreen(appFullscreen()); - $htmlCL.toggle('rl-fullscreen', appFullscreen()); - }); - } -} - dropdownVisibility.subscribe(value => { if (value) { keyScope(ScopeMenu); diff --git a/dev/Stores/User/Message.js b/dev/Stores/User/Message.js index ce2ef1a4b..e6c44d530 100644 --- a/dev/Stores/User/Message.js +++ b/dev/Stores/User/Message.js @@ -1,5 +1,6 @@ import { Scope } from 'Common/Enums'; -import { elementById, exitFullscreen } from 'Common/Globals'; +import { elementById } from 'Common/Globals'; +import { exitFullscreen } from 'Common/Fullscreen'; import { addObservablesTo, addSubscribablesTo } from 'External/ko'; import { AppUserStore } from 'Stores/User/App'; diff --git a/dev/View/Popup/Compose.js b/dev/View/Popup/Compose.js index 4eadb6460..7aaf9645d 100644 --- a/dev/View/Popup/Compose.js +++ b/dev/View/Popup/Compose.js @@ -20,7 +20,8 @@ import { messagesDeleteHelper } from 'Common/Folders'; import { serverRequest } from 'Common/Links'; import { i18n, getNotification, getUploadErrorDescByCode, timestampToString } from 'Common/Translator'; import { MessageFlagsCache, setFolderHash } from 'Common/Cache'; -import { Settings, SettingsGet, elementById, addShortcut/*, exitFullscreen, isFullscreen, toggleFullscreen*/ } from 'Common/Globals'; +import { Settings, SettingsGet, elementById, addShortcut } from 'Common/Globals'; +//import { exitFullscreen, isFullscreen, toggleFullscreen } from 'Common/Fullscreen'; import { AppUserStore } from 'Stores/User/App'; import { SettingsUserStore } from 'Stores/User/Settings'; diff --git a/dev/View/User/MailBox/MessageList.js b/dev/View/User/MailBox/MessageList.js index 4cbc26425..4b5f6595a 100644 --- a/dev/View/User/MailBox/MessageList.js +++ b/dev/View/User/MailBox/MessageList.js @@ -9,13 +9,13 @@ import { UNUSED_OPTION_VALUE } from 'Common/Consts'; import { doc, leftPanelDisabled, moveAction, Settings, SettingsCapa, SettingsGet, addEventsListeners, - addShortcut, registerShortcut, formFieldFocused, - isFullscreen, toggleFullscreen + addShortcut, registerShortcut, formFieldFocused } from 'Common/Globals'; import { computedPaginatorHelper, showMessageComposer, populateMessageBody } from 'Common/UtilsUser'; import { FileInfo } from 'Common/File'; import { folderListOptionsBuilder, moveMessagesToFolder } from 'Common/Folders'; +import { isFullscreen, toggleFullscreen } from 'Common/Fullscreen'; import { mailBox, serverRequest } from 'Common/Links'; import { Selector } from 'Common/Selector'; diff --git a/dev/View/User/MailBox/MessageView.js b/dev/View/User/MailBox/MessageView.js index a55f9af43..a3dcf3d32 100644 --- a/dev/View/User/MailBox/MessageView.js +++ b/dev/View/User/MailBox/MessageView.js @@ -23,12 +23,12 @@ import { SettingsCapa, fireEvent, addShortcut, - registerShortcut, - isFullscreen, exitFullscreen, toggleFullscreen + registerShortcut } from 'Common/Globals'; import { arrayLength } from 'Common/Utils'; import { download, mailToHelper, showMessageComposer } from 'Common/UtilsUser'; +import { isFullscreen, exitFullscreen, toggleFullscreen } from 'Common/Fullscreen'; import { SMAudio } from 'Common/Audio';