diff options
author | Joachim Bauch <bauch@struktur.de> | 2018-11-29 15:27:33 +0100 |
---|---|---|
committer | Joachim Bauch <bauch@struktur.de> | 2018-11-29 15:27:33 +0100 |
commit | 2dec057b8f6aa7d9e0cce5155b2bc9ebd07daee0 (patch) | |
tree | a2f34176fe78a0e3265a6f1e1f493d558f1acf7a | |
parent | 7168c684afd29d0c28b9ad4c148dc590e52fbb4d (diff) |
Add support for sharing fullscreen on Firefox.
Signed-off-by: Joachim Bauch <bauch@struktur.de>
-rw-r--r-- | js/app.js | 128 | ||||
-rw-r--r-- | js/simplewebrtc.js | 17 | ||||
-rw-r--r-- | templates/index-public.php | 8 | ||||
-rw-r--r-- | templates/index.php | 8 |
4 files changed, 105 insertions, 56 deletions
@@ -256,67 +256,103 @@ return; } + var splitShare = false; + if (window.navigator.userAgent.match('Firefox')) { + var ffver = parseInt(window.navigator.userAgent.match(/Firefox\/(.*)/)[1], 10); + splitShare = (ffver >= 52); + } + + // The parent CSS of the menu list items is using "display:block !important", + // so we need to also hide with "!important". if (webrtc.getLocalScreen()) { + $('#show-window-entry').attr('style','display:none !important'); + $('#stop-screen-entry').show(); $('#screensharing-menu').toggleClass('open'); } else { - var screensharingButton = $(this); - screensharingButton.prop('disabled', true); - webrtc.shareScreen(function(err) { - screensharingButton.prop('disabled', false); - if (!err) { - $('#screensharing-button').attr('data-original-title', t('spreed', 'Screensharing options')) - .removeClass('screensharing-disabled icon-screen-off') - .addClass('icon-screen'); - return; - } + if (splitShare) { + $('#show-window-entry').show(); + $('#stop-screen-entry').attr('style','display:none !important'); + $('#screensharing-menu').toggleClass('open'); + return; + } - switch (err.name) { - case "HTTPS_REQUIRED": - OC.Notification.showTemporary(t('spreed', 'Screensharing requires the page to be loaded through HTTPS.')); - break; - case "PERMISSION_DENIED": - case "NotAllowedError": - case "CEF_GETSCREENMEDIA_CANCELED": // Experimental, may go away in the future. - break; - case "FF52_REQUIRED": - OC.Notification.showTemporary(t('spreed', 'Sharing your screen only works with Firefox version 52 or newer.')); - break; - case "EXTENSION_UNAVAILABLE": - var extensionURL = null; - if (!!window.chrome && !!window.chrome.webstore) {// Chrome - extensionURL = 'https://chrome.google.com/webstore/detail/screensharing-for-nextclo/kepnpjhambipllfmgmbapncekcmabkol'; - } - - if (extensionURL) { - var text = t('spreed', 'Screensharing extension is required to share your screen.'); - var element = $('<a>').attr('href', extensionURL).attr('target','_blank').text(text); - - OC.Notification.showTemporary(element, {isHTML: true}); - } else { - OC.Notification.showTemporary(t('spreed', 'Please use a different browser like Firefox or Chrome to share your screen.')); - } - break; - default: - OC.Notification.showTemporary(t('spreed', 'An error occurred while starting screensharing.')); - console.log("Could not start screensharing", err); - break; - } - }); + this.startShareScreen(); } - }); + }.bind(this)); $("#show-screen-button").on('click', function() { - var currentUser = OCA.SpreedMe.webrtc.connection.getSessionid(); - OCA.SpreedMe.sharedScreens.switchScreenToId(currentUser); + if (webrtc.getLocalScreen()) { + var currentUser = OCA.SpreedMe.webrtc.connection.getSessionid(); + OCA.SpreedMe.sharedScreens.switchScreenToId(currentUser); + } else { + this.startShareScreen('screen'); + } $('#screensharing-menu').toggleClass('open', false); - }); + }.bind(this)); + + $("#show-window-button").on('click', function() { + if (webrtc.getLocalScreen()) { + var currentUser = OCA.SpreedMe.webrtc.connection.getSessionid(); + OCA.SpreedMe.sharedScreens.switchScreenToId(currentUser); + } else { + this.startShareScreen('window'); + } + + $('#screensharing-menu').toggleClass('open', false); + }.bind(this)); $("#stop-screen-button").on('click', function() { OCA.SpreedMe.webrtc.stopScreenShare(); }); }, + startShareScreen: function(mode) { + var screensharingButton = $('#screensharing-button'); + screensharingButton.prop('disabled', true); + webrtc.shareScreen(mode, function(err) { + screensharingButton.prop('disabled', false); + if (!err) { + $('#screensharing-button').attr('data-original-title', t('spreed', 'Screensharing options')) + .removeClass('screensharing-disabled icon-screen-off') + .addClass('icon-screen'); + return; + } + + switch (err.name) { + case "HTTPS_REQUIRED": + OC.Notification.showTemporary(t('spreed', 'Screensharing requires the page to be loaded through HTTPS.')); + break; + case "PERMISSION_DENIED": + case "NotAllowedError": + case "CEF_GETSCREENMEDIA_CANCELED": // Experimental, may go away in the future. + break; + case "FF52_REQUIRED": + OC.Notification.showTemporary(t('spreed', 'Sharing your screen only works with Firefox version 52 or newer.')); + break; + case "EXTENSION_UNAVAILABLE": + var extensionURL = null; + if (!!window.chrome && !!window.chrome.webstore) {// Chrome + extensionURL = 'https://chrome.google.com/webstore/detail/screensharing-for-nextclo/kepnpjhambipllfmgmbapncekcmabkol'; + } + + if (extensionURL) { + var text = t('spreed', 'Screensharing extension is required to share your screen.'); + var element = $('<a>').attr('href', extensionURL).attr('target','_blank').text(text); + + OC.Notification.showTemporary(element, {isHTML: true}); + } else { + OC.Notification.showTemporary(t('spreed', 'Please use a different browser like Firefox or Chrome to share your screen.')); + } + break; + default: + OC.Notification.showTemporary(t('spreed', 'An error occurred while starting screensharing.')); + console.log("Could not start screensharing", err); + break; + } + }); + }, + _onKeyUp: function(event) { // Define which objects to check for the event properties. var key = event.which; diff --git a/js/simplewebrtc.js b/js/simplewebrtc.js index 182e43650..150239640 100644 --- a/js/simplewebrtc.js +++ b/js/simplewebrtc.js @@ -3874,8 +3874,8 @@ // cache for constraints and callback var cache = {}; - module.exports = function (constraints, cb) { - var hasConstraints = arguments.length === 2; + module.exports = function (mode, constraints, cb) { + var hasConstraints = arguments.length === 3; var callback = hasConstraints ? cb : constraints; var error; @@ -3970,10 +3970,11 @@ } else if (window.navigator.userAgent.match('Firefox')) { var ffver = parseInt(window.navigator.userAgent.match(/Firefox\/(.*)/)[1], 10); if (ffver >= 52) { + mode = mode || 'window'; constraints = (hasConstraints && constraints) || { video: { - mozMediaSource: 'window', - mediaSource: 'window' + mozMediaSource: mode, + mediaSource: mode } }; getUserMedia(constraints, function (err, stream) { @@ -7607,9 +7608,9 @@ }); }; - LocalMedia.prototype.startScreenShare = function (cb) { + LocalMedia.prototype.startScreenShare = function (mode, cb) { var self = this; - getScreenMedia(function (err, stream) { + getScreenMedia(mode, function (err, stream) { if (!err) { self.localScreens.push(stream); @@ -18295,8 +18296,8 @@ return this.getEl(this.config.remoteVideosEl); }; - SimpleWebRTC.prototype.shareScreen = function (cb) { - this.webrtc.startScreenShare(cb); + SimpleWebRTC.prototype.shareScreen = function (mode, cb) { + this.webrtc.startScreenShare(mode, cb); }; SimpleWebRTC.prototype.getLocalScreen = function () { diff --git a/templates/index-public.php b/templates/index-public.php index abdcb93a1..5623a43d7 100644 --- a/templates/index-public.php +++ b/templates/index-public.php @@ -78,7 +78,13 @@ script( <span><?php p($l->t('Show your screen'));?></span> </button> </li> - <li> + <li id="show-window-entry"> + <button id="show-window-button"> + <span class="icon-screen"></span> + <span><?php p($l->t('Show a single window'));?></span> + </button> + </li> + <li id="stop-screen-entry"> <button id="stop-screen-button"> <span class="icon-screen-off"></span> <span><?php p($l->t('Stop screensharing'));?></span> diff --git a/templates/index.php b/templates/index.php index d351c92fd..9d4bccd5c 100644 --- a/templates/index.php +++ b/templates/index.php @@ -85,7 +85,13 @@ script( <span><?php p($l->t('Show your screen'));?></span> </button> </li> - <li> + <li id="show-window-entry"> + <button id="show-window-button"> + <span class="icon-screen"></span> + <span><?php p($l->t('Show a single window'));?></span> + </button> + </li> + <li id="stop-screen-entry"> <button id="stop-screen-button"> <span class="icon-screen-off"></span> <span><?php p($l->t('Stop screensharing'));?></span> |