[WIP] Add screensharing support. #227

fancycode · 2017-01-20T11:42:00Z

This PR adds support for screensharing (#31).

Currently more a tech demo 🙈 various parts still need implementation:

Chrome support (see https://github.com/nextcloud/spreed-screensharing-chrome-extension for the required extension)
Firefox support (see https://github.com/nextcloud/spreed-screensharing-firefox-addon for the required extension)
Add custom icon to toggle screensharing (currently shows a play icon below the avatar)
Better layout of the streams (currently only renders stacked below the other videos)
Feedback to the user about why it could not be started (currently logs through console.log in app.js)

cc @jancborchardt for ui, @nickvergessen @LukasReschke, @Ivansss for general review

nickvergessen · 2017-01-20T12:07:10Z

extensions/chrome/manifest.json

+  },
+  "content_scripts": [ {
+    "js": [ "content.js" ],
+    "matches": [ "https://replace-with-your-hostname/*" ]


This one actually would allow wildcard hostnames, it's the matches below that doesn't allow it.
I'll look if there is another way to communicate between website and the extension, or if we have to deal with the "one extension per hostname".

Updated extension to work with all domains 🎉

fancycode · 2017-01-23T09:41:10Z

I think we should develop the extensions in separate repositories as their release cycle (and versioning) will be different from the app itself. What do you think?

nickvergessen · 2017-01-23T09:41:28Z

extensions/chrome/manifest.json

@@ -1,24 +1,28 @@
 {
  "name": "Nextcloud Screensharing",
  "description": "Screensharing utility for the Nextcloud video calls app.",
+  "author": "Joachim Bauch <bauch@struktur.de>"


missing ,

nickvergessen · 2017-01-23T09:42:32Z

chrome-screensharing-extension ?

codecov-io · 2017-01-23T15:16:34Z

Codecov Report

Merging #227 into master will decrease coverage by 0.39%.
The diff coverage is n/a.

@@             Coverage Diff             @@
##             master     #227     +/-   ##
===========================================
- Coverage     17.31%   16.92%   -0.4%     
- Complexity      240      291     +51     
===========================================
  Files            16       16             
  Lines          1155     1312    +157     
===========================================
+ Hits            200      222     +22     
- Misses          955     1090    +135

Impacted Files	Coverage Δ	Complexity Δ
lib/Controller/ApiController.php	`0% <0%> (ø)`	`113% <0%> (+41%)`	✅
lib/Notification/Notifier.php	`95.19% <0%> (+1.28%)`	`27% <0%> (+10%)`	✅

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update c29495a...ae9d60d. Read the comment docs.

nickvergessen · 2017-01-23T17:10:19Z

Created https://github.com/nextcloud/chrome-screensharing-extension

jancborchardt · 2017-01-23T20:47:42Z

Interface-wise what about:

»Share screen« and the current »Fullscreen« function should be in a (to be created) popover menu of a 3-dot-menu next to the audio and video buttons of your own video.
If someone shares a screen then that screen should be shown as the promoted (big) video permanently as long as it’s shared. Sized so that it’s not overlayed by the participant videos below though.
Should we limit screensharing to one screen at a time? Otherwise we need to reconsider the interface.
Anything else?

fancycode · 2017-01-26T14:30:56Z

Firefox support is now blocked on #234 (no PeerConnection is being established, so also no screensharing possible).

This is required to support screensharing in Chrome for the Nextcloud Spreed app (see nextcloud/spreed#227). Signed-off-by: Joachim Bauch <bauch@struktur.de>

This is required to support screensharing in Firefox for the Nextcloud Spreed app (see nextcloud/spreed#227). Signed-off-by: Joachim Bauch <bauch@struktur.de>

nickvergessen · 2017-01-28T21:55:28Z

js/app.js

@@ -211,7 +211,7 @@
 			});

 			var screensharingStopped = function() {
-				console.log("Screensharing now stopped");
+				// No need to notify the user.


log is only done in debug mode, I guess it would be fine to keep.

fancycode · 2017-02-09T10:30:08Z

@Ivansss did you make sure to keep my screensharing-related changes (and any other changes that might have happened in the past) in your simplewebrtc upgrade? Maybe it would make sense to upgrade in a separate PR.

Ivansss · 2017-02-09T10:32:58Z

@fancycode Yes, I applied all the changes we did in simplewebrtc.js since the initial commit on top.

Ivansss · 2017-02-09T11:15:51Z

Reverted SimpleWebRTC update, doing it in a different PR #242 .

nickvergessen · 2017-02-09T11:36:24Z

Rebased and simply dropped the commit and the revert.

fancycode · 2017-02-09T11:41:55Z

FYI, you could have rebased only up to my last commit to avoid getting new hashes for all old commits.

jancborchardt · 2017-02-13T13:48:51Z

jancborchardt · 2017-02-14T20:06:34Z

Icon PR at nextcloud/server#3480 and stable11 backport at nextcloud/server#3481

Let me know if you need anything else here. :)

Signed-off-by: Joachim Bauch <bauch@struktur.de>

Firefox needs the domain to be whitelisted, so this is done by the addon. Signed-off-by: Joachim Bauch <bauch@struktur.de>

Signed-off-by: Joachim Bauch <bauch@struktur.de>

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Ivansss · 2017-02-16T15:42:46Z

Rebased to use SimpleWebRTC v2.2.3.

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Ivansss · 2017-02-24T17:58:15Z

@jancborchardt Could you please take a look to the current state? I would like to know your opinion about the layout when a screen is being shared and discuss how to improve it 😄

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

nickvergessen · 2017-03-07T11:46:44Z

Addons are now published:

jancborchardt · 2017-03-10T14:49:51Z

@Ivansss I’m using Google Chrome 55 with the extension on Ubuntu 16.04 and on clicking the »Share screen« it says »Screensharing is not supported by your browser«. :\

But generally judging from the screenshots it looks great! :) There’s just two things:

I would change the background of the content from this grey to black. (Below the shared screen)
When video of one participant is deactivated, the layout of the current speaker avatar is wrong:
Master (correct):

This branch (see the avatar on the bottom and a bit to the right):

I can look into both, but for that I have to get the actual screensharing working :\ we could also merge this first and polish it forward?

nickvergessen · 2017-03-10T15:10:42Z

Works fine here, are you having your netflix-cheat in place again?

jancborchardt · 2017-03-10T15:24:37Z

@nickvergessen no, I also just disabled all extensions and it’s the same issue. We are also trying on @gsambrotta’s setup and couldn’t get a video call to run at all yet :\ (@gsambrotta best open an issue about it).

I’ll try if it works with Firefox.

jancborchardt · 2017-03-10T15:26:23Z

Oh and screensharing doesn’t work for public call guests, does it? Because the icon is shown and nothing happens on clicking it.

Ivansss · 2017-03-10T15:34:43Z

It should work for guests too, but I noticed that notifications are not shown for guests.

So probably in your case »Screensharing is not supported by your browser« notification is being triggered, but you can't see it because of the problem with notifications for guests.

gsambrotta · 2017-03-10T16:38:21Z

no problem from my side, just wrong branch (oooops!)

jancborchardt · 2017-03-10T22:45:06Z

@Ivansss ah ok, can you then make sure the notification – if it’s not supported – is also shown for guests?

Will need to see what’s wrong with my setup then 😕

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>

jancborchardt · 2017-03-10T22:51:00Z

@Ivansss @nickvergessen ok, I changed the grey background to black in the CSS.

If there’s no layout issues for you, and the rest of the issues in my other comment at #227 (comment) are fixed (or should be postponed) and the notification about screensharing not being available is also shown for guests → we can merge this! :)

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

nickvergessen reviewed Jan 20, 2017

View reviewed changes

fancycode force-pushed the screensharing branch from d3bc486 to b8f9ca8 Compare January 23, 2017 09:35

nickvergessen reviewed Jan 23, 2017

View reviewed changes

fancycode force-pushed the screensharing branch from b8f9ca8 to cea1341 Compare January 23, 2017 09:43

fancycode force-pushed the screensharing branch from cea1341 to 51270b5 Compare January 27, 2017 15:01

nickvergessen reviewed Jan 28, 2017

View reviewed changes

nickvergessen force-pushed the screensharing branch from b77b42d to bcfae4c Compare February 9, 2017 11:36

This was referenced Feb 14, 2017

add screensharing icon nextcloud/server#3480

Merged

[stable11] add screensharing icon nextcloud/server#3481

Merged

fancycode and others added 6 commits February 16, 2017 16:37

Implement first draft of screensharing support.

4058c39

Signed-off-by: Joachim Bauch <bauch@struktur.de>

Add marker class for the screensharing extension to detect the NC app.

b774419

Signed-off-by: Joachim Bauch <bauch@struktur.de>

Call to Firefox addon when starting screensharing.

cb41ca3

Firefox needs the domain to be whitelisted, so this is done by the addon. Signed-off-by: Joachim Bauch <bauch@struktur.de>

Show notifications to the user in case of an error.

2525921

Signed-off-by: Joachim Bauch <bauch@struktur.de>

Keep log about stopped screensharing.

ff8e944

Signed-off-by: Joachim Bauch <bauch@struktur.de>

Move fullscreen button to the top-right corner.

19c90ae

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Add proper icons to screensharing toggle button.

735a2d3

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Ivansss force-pushed the screensharing branch from fba8c48 to 735a2d3 Compare February 16, 2017 15:41

Ivansss added 3 commits February 22, 2017 12:03

Fix typo.

9812e03

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Show full-screen and screensharing buttons only during calls.

31202e4

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Change video layouts when screensharing.

cb930c8

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Ivansss added 2 commits March 1, 2017 16:04

Send shared screen to new call participants.

ad27ee1

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Add tooltips to call buttons.

4039951

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Ivansss requested a review from jancborchardt March 4, 2017 15:27

make empty background on bottom of screensharing black too

639f1ed

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>

Fix position and resize screensharing videos.

ae9d60d

Signed-off-by: Ivan Sein <ivan@nextcloud.com>

Ivansss force-pushed the screensharing branch from a2ba0ba to ae9d60d Compare March 14, 2017 19:15

Ivansss merged commit d884803 into master Mar 14, 2017

Ivansss deleted the screensharing branch March 14, 2017 19:33

Ivansss mentioned this pull request Mar 15, 2017

Add screensharing extension links to notifications #262

Merged

MariusBluem mentioned this pull request Mar 23, 2017

Screensharing #31

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[WIP] Add screensharing support. #227

[WIP] Add screensharing support. #227

fancycode commented Jan 20, 2017 •

edited by Ivansss

nickvergessen Jan 20, 2017

fancycode Jan 20, 2017

fancycode Jan 23, 2017

fancycode commented Jan 23, 2017

nickvergessen Jan 23, 2017

nickvergessen commented Jan 23, 2017

codecov-io commented Jan 23, 2017 •

edited

nickvergessen commented Jan 23, 2017

jancborchardt commented Jan 23, 2017

fancycode commented Jan 26, 2017

nickvergessen Jan 28, 2017

fancycode commented Feb 9, 2017

Ivansss commented Feb 9, 2017

Ivansss commented Feb 9, 2017

nickvergessen commented Feb 9, 2017

fancycode commented Feb 9, 2017

jancborchardt commented Feb 13, 2017 •

edited

jancborchardt commented Feb 14, 2017

Ivansss commented Feb 16, 2017

Ivansss commented Feb 24, 2017

nickvergessen commented Mar 7, 2017

jancborchardt commented Mar 10, 2017 •

edited

nickvergessen commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

Ivansss commented Mar 10, 2017

gsambrotta commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

[WIP] Add screensharing support. #227

[WIP] Add screensharing support. #227

Conversation

fancycode commented Jan 20, 2017 • edited by Ivansss

nickvergessen Jan 20, 2017

Choose a reason for hiding this comment

fancycode Jan 20, 2017

Choose a reason for hiding this comment

fancycode Jan 23, 2017

Choose a reason for hiding this comment

fancycode commented Jan 23, 2017

nickvergessen Jan 23, 2017

Choose a reason for hiding this comment

nickvergessen commented Jan 23, 2017

codecov-io commented Jan 23, 2017 • edited

Codecov Report

nickvergessen commented Jan 23, 2017

jancborchardt commented Jan 23, 2017

fancycode commented Jan 26, 2017

nickvergessen Jan 28, 2017

Choose a reason for hiding this comment

fancycode commented Feb 9, 2017

Ivansss commented Feb 9, 2017

Ivansss commented Feb 9, 2017

nickvergessen commented Feb 9, 2017

fancycode commented Feb 9, 2017

jancborchardt commented Feb 13, 2017 • edited

jancborchardt commented Feb 14, 2017

Ivansss commented Feb 16, 2017

Ivansss commented Feb 24, 2017

nickvergessen commented Mar 7, 2017

jancborchardt commented Mar 10, 2017 • edited

nickvergessen commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

Ivansss commented Mar 10, 2017

gsambrotta commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

jancborchardt commented Mar 10, 2017

fancycode commented Jan 20, 2017 •

edited by Ivansss

codecov-io commented Jan 23, 2017 •

edited

jancborchardt commented Feb 13, 2017 •

edited

jancborchardt commented Mar 10, 2017 •

edited