diff options
Diffstat (limited to 'uncompressed/skype')
-rw-r--r-- | uncompressed/skype/package.json | 2 | ||||
-rw-r--r-- | uncompressed/skype/service.css | 61 | ||||
-rw-r--r-- | uncompressed/skype/webview.js | 64 |
3 files changed, 121 insertions, 6 deletions
diff --git a/uncompressed/skype/package.json b/uncompressed/skype/package.json index b61e4a3..7437d65 100644 --- a/uncompressed/skype/package.json +++ b/uncompressed/skype/package.json | |||
@@ -1,7 +1,7 @@ | |||
1 | { | 1 | { |
2 | "id": "skype", | 2 | "id": "skype", |
3 | "name": "Skype", | 3 | "name": "Skype", |
4 | "version": "1.3.0", | 4 | "version": "1.4.0", |
5 | "description": "Skype", | 5 | "description": "Skype", |
6 | "main": "index.js", | 6 | "main": "index.js", |
7 | "author": "Stefan Malzner <stefan@adlk.io>", | 7 | "author": "Stefan Malzner <stefan@adlk.io>", |
diff --git a/uncompressed/skype/service.css b/uncompressed/skype/service.css index 80ef7da..543076f 100644 --- a/uncompressed/skype/service.css +++ b/uncompressed/skype/service.css | |||
@@ -1,3 +1,64 @@ | |||
1 | #footer { | 1 | #footer { |
2 | display: none; | 2 | display: none; |
3 | } | 3 | } |
4 | .desktop-capturer-selection { | ||
5 | position: fixed; | ||
6 | top: 0; | ||
7 | left: 0; | ||
8 | width: 100%; | ||
9 | height: 100vh; | ||
10 | background: rgba(30,30,30,.75); | ||
11 | color: #fff; | ||
12 | z-index: 10000000; | ||
13 | display: flex; | ||
14 | align-items: center; | ||
15 | justify-content: center; | ||
16 | } | ||
17 | .desktop-capturer-selection__scroller { | ||
18 | width: 100%; | ||
19 | max-height: 100vh; | ||
20 | overflow-y: auto; | ||
21 | } | ||
22 | .desktop-capturer-selection__list { | ||
23 | max-width: calc(100% - 100px); | ||
24 | margin: 50px; | ||
25 | padding: 0; | ||
26 | display: flex; | ||
27 | flex-wrap: wrap; | ||
28 | list-style: none; | ||
29 | overflow: hidden; | ||
30 | justify-content: center; | ||
31 | } | ||
32 | .desktop-capturer-selection__item { | ||
33 | display: flex; | ||
34 | margin: 4px; | ||
35 | } | ||
36 | .desktop-capturer-selection__btn { | ||
37 | display: flex; | ||
38 | flex-direction: column; | ||
39 | align-items: stretch; | ||
40 | width: 145px; | ||
41 | margin: 0; | ||
42 | border: 0; | ||
43 | border-radius: 3px; | ||
44 | padding: 4px; | ||
45 | color: #fff; | ||
46 | background: #252626; | ||
47 | text-align: left; | ||
48 | transition: background-color .15s, box-shadow .15s; | ||
49 | } | ||
50 | .desktop-capturer-selection__btn:hover, | ||
51 | .desktop-capturer-selection__btn:focus { | ||
52 | background: rgba(98,100,167,.8); | ||
53 | } | ||
54 | .desktop-capturer-selection__thumbnail { | ||
55 | width: 100%; | ||
56 | height: 81px; | ||
57 | object-fit: cover; | ||
58 | } | ||
59 | .desktop-capturer-selection__name { | ||
60 | margin: 6px 0 6px; | ||
61 | white-space: nowrap; | ||
62 | text-overflow: ellipsis; | ||
63 | overflow: hidden; | ||
64 | } \ No newline at end of file | ||
diff --git a/uncompressed/skype/webview.js b/uncompressed/skype/webview.js index 12ad2a8..63f445c 100644 --- a/uncompressed/skype/webview.js +++ b/uncompressed/skype/webview.js | |||
@@ -1,10 +1,63 @@ | |||
1 | "use strict"; | 1 | "use strict"; |
2 | 2 | ||
3 | var _electron = require("electron"); | 3 | const { desktopCapturer, remote: { BrowserWindow } } = require("electron"); |
4 | const path = require('path'); | ||
4 | 5 | ||
5 | const { | 6 | window.navigator.mediaDevices.getDisplayMedia = () => { |
6 | BrowserWindow | 7 | return new Promise(async (resolve, reject) => { |
7 | } = _electron.remote; | 8 | try { |
9 | const sources = await desktopCapturer.getSources({ types: ['screen', 'window'] }); | ||
10 | |||
11 | const selectionElem = document.createElement('div'); | ||
12 | selectionElem.classList = 'desktop-capturer-selection'; | ||
13 | selectionElem.innerHTML = ` | ||
14 | <div class="desktop-capturer-selection__scroller"> | ||
15 | <ul class="desktop-capturer-selection__list"> | ||
16 | ${sources.map(({ id, name, thumbnail, display_id, appIcon }) => ` | ||
17 | <li class="desktop-capturer-selection__item"> | ||
18 | <button class="desktop-capturer-selection__btn" data-id="${id}" title="${name}"> | ||
19 | <img class="desktop-capturer-selection__thumbnail" src="${thumbnail.toDataURL()}" /> | ||
20 | <span class="desktop-capturer-selection__name">${name}</span> | ||
21 | </button> | ||
22 | </li> | ||
23 | `).join('')} | ||
24 | </ul> | ||
25 | </div> | ||
26 | `; | ||
27 | document.body.appendChild(selectionElem); | ||
28 | |||
29 | document.querySelectorAll('.desktop-capturer-selection__btn') | ||
30 | .forEach(button => { | ||
31 | button.addEventListener('click', async () => { | ||
32 | try { | ||
33 | const id = button.getAttribute('data-id'); | ||
34 | const source = sources.find(source => source.id === id); | ||
35 | if (!source) { | ||
36 | throw new Error(`Source with id ${id} does not exist`); | ||
37 | } | ||
38 | |||
39 | const stream = await window.navigator.mediaDevices.getUserMedia({ | ||
40 | audio: false, | ||
41 | video: { | ||
42 | mandatory: { | ||
43 | chromeMediaSource: 'desktop', | ||
44 | chromeMediaSourceId: source.id | ||
45 | } | ||
46 | } | ||
47 | }); | ||
48 | resolve(stream); | ||
49 | |||
50 | selectionElem.remove(); | ||
51 | } catch (err) { | ||
52 | reject(err); | ||
53 | } | ||
54 | }); | ||
55 | }); | ||
56 | } catch (err) { | ||
57 | reject(err); | ||
58 | } | ||
59 | }) | ||
60 | } | ||
8 | 61 | ||
9 | module.exports = (Franz, settings) => { | 62 | module.exports = (Franz, settings) => { |
10 | const getMessages = function getMessages() { | 63 | const getMessages = function getMessages() { |
@@ -27,6 +80,7 @@ module.exports = (Franz, settings) => { | |||
27 | Franz.setBadge(count); | 80 | Franz.setBadge(count); |
28 | }; | 81 | }; |
29 | 82 | ||
83 | Franz.injectCSS(path.join(__dirname, 'service.css')); | ||
30 | Franz.loop(getMessages); | 84 | Franz.loop(getMessages); |
31 | document.addEventListener('click', event => { | 85 | document.addEventListener('click', event => { |
32 | const link = event.target.closest('a[href^="http"]'); | 86 | const link = event.target.closest('a[href^="http"]'); |
@@ -55,4 +109,4 @@ module.exports = (Franz, settings) => { | |||
55 | } | 109 | } |
56 | } | 110 | } |
57 | }, true); | 111 | }, true); |
58 | }; \ No newline at end of file | 112 | }; |