Merge pull request #1010 from jitsi/fullscreen-feature-fixes
Fullscreen feature fixes
This commit is contained in:
commit
33c026cc06
|
@ -142,7 +142,6 @@
|
|||
<a class="button icon-dialpad" id="toolbar_button_dialpad" style="display: none"></a>
|
||||
<a class="button icon-settings" id="toolbar_button_settings"></a>
|
||||
<a class="button icon-raised-hand" id="toolbar_button_raisehand" shortcut="raiseHandPopover"></a>
|
||||
<a class="button icon-full-screen" id="toolbar_button_fullScreen" shortcut="toggleFullscreenPopover"></a>
|
||||
<a class="button icon-toggle-filmstrip" id="toolbar_film_strip" data-container="body" shortcut="filmstripPopover"></a>
|
||||
<a class="button icon-feedback" id="feedbackButton"></a>
|
||||
<div id="sideToolbarContainer">
|
||||
|
|
|
@ -19,8 +19,8 @@ var interfaceConfig = { // eslint-disable-line no-unused-vars
|
|||
INVITATION_POWERED_BY: true,
|
||||
// the toolbar buttons line is intentionally left in one line, to be able
|
||||
// to easily override values or remove them using regex
|
||||
MAIN_TOOLBAR_BUTTONS: ['microphone', 'camera', 'desktop', 'invite', 'hangup'], // jshint ignore:line
|
||||
TOOLBAR_BUTTONS: ['profile', 'authentication', 'microphone', 'camera', 'desktop', 'recording', 'security', 'raisehand', 'chat', 'etherpad', 'sharedvideo', 'fullscreen', 'sip', 'dialpad', 'settings', 'hangup', 'filmstrip', 'contacts'], // jshint ignore:line
|
||||
MAIN_TOOLBAR_BUTTONS: ['microphone', 'camera', 'desktop', 'invite', 'fullscreen', 'hangup'], // jshint ignore:line
|
||||
TOOLBAR_BUTTONS: ['profile', 'authentication', 'microphone', 'camera', 'desktop', 'recording', 'security', 'raisehand', 'chat', 'etherpad', 'sharedvideo', 'sip', 'dialpad', 'settings', 'hangup', 'filmstrip', 'contacts'], // jshint ignore:line
|
||||
SETTINGS_SECTIONS: ['language', 'devices', 'moderator'],
|
||||
// Determines how the video would fit the screen. 'both' would fit the whole
|
||||
// screen, 'height' would fit the original video height to the height of the
|
||||
|
|
|
@ -140,37 +140,11 @@ function setupToolbars() {
|
|||
/**
|
||||
* Toggles the application in and out of full screen mode
|
||||
* (a.k.a. presentation mode in Chrome).
|
||||
* @see https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API
|
||||
*/
|
||||
UI.toggleFullScreen = function() {
|
||||
// alternative standard method
|
||||
let isNotFullScreen = !document.fullscreenElement &&
|
||||
!document.mozFullScreenElement && // current working methods
|
||||
!document.webkitFullscreenElement &&
|
||||
!document.msFullscreenElement;
|
||||
|
||||
if (isNotFullScreen) {
|
||||
if (document.documentElement.requestFullscreen) {
|
||||
document.documentElement.requestFullscreen();
|
||||
} else if (document.documentElement.msRequestFullscreen) {
|
||||
document.documentElement.msRequestFullscreen();
|
||||
} else if (document.documentElement.mozRequestFullScreen) {
|
||||
document.documentElement.mozRequestFullScreen();
|
||||
} else if (document.documentElement.webkitRequestFullscreen) {
|
||||
document.documentElement
|
||||
.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
}
|
||||
} else {
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen();
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
}
|
||||
}
|
||||
(UIUtil.isFullScreen())
|
||||
? UIUtil.exitFullScreen()
|
||||
: UIUtil.enterFullScreen();
|
||||
};
|
||||
|
||||
/**
|
||||
|
@ -380,7 +354,7 @@ function registerListeners() {
|
|||
}
|
||||
});
|
||||
|
||||
UI.addListener(UIEvents.FULLSCREEN_TOGGLE, UI.toggleFullScreen);
|
||||
UI.addListener(UIEvents.TOGGLE_FULLSCREEN, UI.toggleFullScreen);
|
||||
|
||||
UI.addListener(UIEvents.TOGGLE_CHAT, UI.toggleChat);
|
||||
|
||||
|
@ -415,7 +389,12 @@ function bindEvents() {
|
|||
// Resize and reposition videos in full screen mode.
|
||||
$(document).on(
|
||||
'webkitfullscreenchange mozfullscreenchange fullscreenchange',
|
||||
onResize
|
||||
() => {
|
||||
eventEmitter.emit( UIEvents.FULLSCREEN_TOGGLED,
|
||||
UIUtil.isFullScreen());
|
||||
|
||||
onResize();
|
||||
}
|
||||
);
|
||||
|
||||
$(window).resize(onResize);
|
||||
|
|
|
@ -73,9 +73,8 @@ const buttonHandlers = {
|
|||
},
|
||||
"toolbar_button_fullScreen": function() {
|
||||
JitsiMeetJS.analytics.sendEvent('toolbar.fullscreen.enabled');
|
||||
UIUtil.buttonClick("toolbar_button_fullScreen",
|
||||
"icon-full-screen icon-exit-full-screen");
|
||||
emitter.emit(UIEvents.FULLSCREEN_TOGGLE);
|
||||
|
||||
emitter.emit(UIEvents.TOGGLE_FULLSCREEN);
|
||||
},
|
||||
"toolbar_button_sip": function () {
|
||||
JitsiMeetJS.analytics.sendEvent('toolbar.sip.clicked');
|
||||
|
@ -359,6 +358,11 @@ Toolbar = {
|
|||
this._setToggledState("toolbar_button_raisehand", isRaisedHand);
|
||||
});
|
||||
|
||||
APP.UI.addListener(UIEvents.FULLSCREEN_TOGGLED,
|
||||
(isFullScreen) => {
|
||||
Toolbar._handleFullScreenToggled(isFullScreen);
|
||||
});
|
||||
|
||||
if(!APP.tokenData.isGuest) {
|
||||
$("#toolbar_button_profile").addClass("unclickable");
|
||||
UIUtil.removeTooltip(
|
||||
|
@ -657,6 +661,8 @@ Toolbar = {
|
|||
|
||||
/**
|
||||
* Handles the side toolbar toggle.
|
||||
*
|
||||
* @param {string} containerId the identifier of the container element
|
||||
*/
|
||||
_handleSideToolbarContainerToggled(containerId) {
|
||||
Object.keys(defaultToolbarButtons).forEach(
|
||||
|
@ -675,6 +681,25 @@ Toolbar = {
|
|||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* Handles full screen toggled.
|
||||
*
|
||||
* @param {boolean} isFullScreen indicates if we're currently in full
|
||||
* screen mode
|
||||
*/
|
||||
_handleFullScreenToggled(isFullScreen) {
|
||||
let element
|
||||
= document.getElementById("toolbar_button_fullScreen");
|
||||
|
||||
element.className = isFullScreen
|
||||
? element.className
|
||||
.replace("icon-full-screen", "icon-exit-full-screen")
|
||||
: element.className
|
||||
.replace("icon-exit-full-screen", "icon-full-screen");
|
||||
|
||||
Toolbar._setToggledState("toolbar_button_fullScreen", isFullScreen);
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialise main toolbar buttons.
|
||||
*/
|
||||
|
|
|
@ -240,10 +240,50 @@ const TOOLTIP_POSITIONS = {
|
|||
window.location.href = url;
|
||||
},
|
||||
|
||||
isFullScreen () {
|
||||
return document.fullScreen
|
||||
|| document.mozFullScreen
|
||||
|| document.webkitIsFullScreen;
|
||||
/**
|
||||
* Indicates if we're currently in full screen mode.
|
||||
*
|
||||
* @return {boolean} {true} to indicate that we're currently in full screen
|
||||
* mode, {false} otherwise
|
||||
*/
|
||||
isFullScreen() {
|
||||
return document.fullscreenElement
|
||||
|| document.mozFullScreenElement
|
||||
|| document.webkitFullscreenElement
|
||||
|| document.msFullscreenElement;
|
||||
},
|
||||
|
||||
/**
|
||||
* Exits full screen mode.
|
||||
* @see https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API
|
||||
*/
|
||||
exitFullScreen() {
|
||||
if (document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
} else if (document.msExitFullscreen) {
|
||||
document.msExitFullscreen();
|
||||
} else if (document.mozCancelFullScreen) {
|
||||
document.mozCancelFullScreen();
|
||||
} else if (document.webkitExitFullscreen) {
|
||||
document.webkitExitFullscreen();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Enter full screen mode.
|
||||
* @see https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API
|
||||
*/
|
||||
enterFullScreen() {
|
||||
if (document.documentElement.requestFullscreen) {
|
||||
document.documentElement.requestFullscreen();
|
||||
} else if (document.documentElement.msRequestFullscreen) {
|
||||
document.documentElement.msRequestFullscreen();
|
||||
} else if (document.documentElement.mozRequestFullScreen) {
|
||||
document.documentElement.mozRequestFullScreen();
|
||||
} else if (document.documentElement.webkitRequestFullscreen) {
|
||||
document.documentElement
|
||||
.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
|
@ -34,7 +34,8 @@ export default {
|
|||
UPDATE_SHARED_VIDEO: "UI.update_shared_video",
|
||||
USER_KICKED: "UI.user_kicked",
|
||||
REMOTE_AUDIO_MUTED: "UI.remote_audio_muted",
|
||||
FULLSCREEN_TOGGLE: "UI.fullscreen_toggle",
|
||||
TOGGLE_FULLSCREEN: "UI.toogle_fullscreen",
|
||||
FULLSCREEN_TOGGLED: "UI.fullscreen_toggled",
|
||||
AUTH_CLICKED: "UI.auth_clicked",
|
||||
TOGGLE_CHAT: "UI.toggle_chat",
|
||||
TOGGLE_SETTINGS: "UI.toggle_settings",
|
||||
|
|
Loading…
Reference in New Issue