18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
ieski / deskreen
forked from pavlobu/deskreen
Deskreen turns any device with a web browser to a second screen for your computer
www.deskreen.com
AGPL-3.0 License
0
stars
507
forks
Star
Notifications
Code Pull requests Actions Projects Wiki Security Insights
master
Go to file
This branch is 92 commits behind pavlobu:master.
Contribute
Fetch upstream
pavlobu … on 24 Jan
View code
Deskreen
Website: https://www.deskreen.com
https://github.com/ieski/deskreen 1/7
18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
build and test passing
codecov passing
codecov 64%
Deskreen turns any device with a web browser to a second
screen for your computer
Deskreen is an electron.js based application that uses WebRTC to make a live stream of
your
desktop to a web browser on any device.
It is built on top of Electron React Boilerplate
For better security mechanism, end-to-end encryption is implemented, which is inspired by
darkwire.io. The difference is that it is rewritten
in Typescript and transformed to use
node-forge instead of window.crypto.subtle .
Why this was made? Because a client served
with http without SSL, which makes window.crypto.subtle unavailable.
NOTE: We are looking for a solution to get rid from Dummy
Display Plugs while using Deskreen as a second screen.
Your code support is highly valuable and welcome in
Deskreen!
Display Dummy Plugs are good temporary solution, but it is not that good for everyone.
If
you are a seasoned Windows or Linux or MacOS hacker with a knowledge of low level
tweaks and triks, you can help us to make Deskreen better!
On a long run Deskreen seeks
for getting rid of Display Dummy Plugs, because most people don't like using them.
README.md
Sometimes they can't use them because all available display ports are already taken.
So we
need to have native drivers for Win / Mac / Linux that will help to enable virtual display
wihtout Dummy Display Plugs.
There are already working commercial solutions out there
with their own drivers which they don't disclose, but this task is doable with a help of entire
community.
The goal of Deskreen is to enable community power and knowledge to
overcome these technical challenges and make it a go-to second screen solution that
everyone will benefit from!
We plan on making virtual display driver support for each of three main operating systems
and place all OS related codes in ./drivers subdirectory of this project.
You can find brief
requirements for driver API in ./drivers/README.md .
Thank you in advance!
Get Started for Developers
Prerequisites
You will need to have node npm and yarn installed
globally on your machine.
1. git clone this repo
https://github.com/ieski/deskreen 2/7
18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
2. yarn install
3. yarn dev -- run in dev mode with live updates
Useful yarn commands
yarn start -- run in production mode to test, without packaging
yarn package -- to
package an app and make executables available in release folder
for more yarn commands look at package.json
How to run tests
yarn test -- run all unit tests
yarn build-ux && yarn test-ux -- run User Experience tests
(no tests for app/client yet)
TODO: add e2e tests with host + client app interaction
run tests of host app
yarn test-watch-not-silent -- run tests in watch mode with console logs only for host
app, excluding app/client
yarn test -- -u -- update snapshots
run tests for app/client
yarn test -- run client tests in watch mode
test:nowatch -- run client tests a single time
yarn test -- -u -- update snapshots
Generate test coverage results
yarn coverage -- when run from project root, generates a coverage report for host and
app/client
Instruction for running a local Sonar Qube, community
edition
Prerequisites
You need to install Sonar Qube community edition for your machine.
And sonar-scanner.
Then add sonar scanner to your PATH.
You need to run sonar-scanner separately on root directory
and on app/client directory.
https://github.com/ieski/deskreen 3/7
18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
Luckily for you sonar scanner is automatically triggered after husky checks.
So you only
need to install and configure SonarCube locally and
create two separate projects in
SonarCube panel.
First project for host app, and second project for client viewer app.
TODO:
add how to get started with local SonarCube for Deskreen in details.
Documentation
High level architecture design
https://www.deskreen.com
Deskreen | High level design by Pavlo (Paul) Buidenkov 21 Jan 2021
Windows / MacOs / Linux machine
Deskreen App (electron.js) ./app
Electron main
Any device with a web browser that
UI (react.js) process (deskreen supports WebRTC
web browser window)
Web browser that supports
Signaling Server (port 3131) ./app/server WebRTC
HTTP server (sends web page files to Browser tab with Deskreen client web
client) at moment Koa, can be any page ./app/client
WebSocket socket.io-server.
Responsible client and host app
e2e encrypted
UI (react.js)
WS based communication. signal exchange
unique roomID for each
connection
WiFi or socket.io-client (connect to
LAN or server by roomID ex. 623456)
signal exchange
e2e encrypted
Electron renderer process 127.0.0.1 send my signal receive peer signal
(a no-window web browser) simple-peer ( WebRTC API )
Screen Sharing Session
socket.io client (connect to
server by roomID ex. 623456)
receive peer signal
send my signal
simple-peer ( WebRTC API ) WebRTC video streaming
get desktop stream generated desktop stream
electron desktopCapturer
WebRTC Screen Sharing Session Initiation Step by Step
https://github.com/ieski/deskreen 4/7
18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
https://www.deskreen.com
Deskreen | WebRTC Screen Sharing Session Initiation Step by Step by Pavlo (Paul)
Buidenkov 22 Jan 2021
Computer on private
network with Deskreen
App running WiFi or
Sinaling Server ( HTTP and Client viewing device on
Screen Sharing Session (
connected on 127.0.0.1
Websocket electron main LAN or private network
with a WebRTC compatible
electron renderer process ) process ) 127.0.0.1 WebBrowser
Generate a
public private
keypair, one for socket connect to <roomID> ex. 123456
all sessions HTTP GET <addr>/<roomID>
wait for USER_ENTER event from client,
every event below in this diagram
send static files in response Generate public
is emitted to same roomID private keypair,
one for
current session
socket connect to <roomID> ex. 123456,
every event below in this diagram
is emitted to same roomID
emit GET_MY_IP
associated socket's ID device IP sent back show my device
details in UI with
device IP
passthrough USER_ENTER event to host emit USER_ENTER event with public key in payload
keep client's public key
and encrypt further
payloads with it
emit USER_ENTER with public key to client passthrough USER_ENTER event to client
keep received
host's public key
and encrypt further
payloads with it
emit TOGGLE_LOCK_ROOM immediately to prevent other
clients to connect to this room, if someone tries to
connect, they will receive a ROOM_LOCKED
passthrough ENCRYPTED_MESSAGE event to host emit ENCRYPTED_MESSAGE with
decrypt and store client
DEVICE_DETAILS payload, that
device details, show
contains info of what client device is trying to connect
them in UI alert 'Allow to
connect' dialog box
securely getting client IP
emit GET_IP_BY_SOCKET_ID with client socketID
from 127.0.0.1
signaling server and
return client IP to display it in Partner details UI
storing it to display in
Partner Details UI
User checks details and
clicks 'Allow' to connect
button,
then selects Screen or
App window to be
shared, then clicks
Confirm
emit ENCRYPTED_MESSAGE passthrough ENCRYPTED_MESSAGE with payload
decrypt, set
with CALL_USER payload that has received peer
MY WebRTC signal for call signal to simple-
retrieved from simple-peer peer
passthrough ENCRYPTED_MESSAGE with payload emit ENCRYPTED_MESSAGE with
CALL_ACCEPTED payload, that has MY WebRTC
signal for call retrieved from simple-peer
decrypt, set received
peer signal to simple-
peer
https://github.com/ieski/deskreen 5/7
18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
when electron
desktopCapturer
stream available,
simple-peer sends send stream with WebRTC
stream to client
when simple-
peer.on('stream',
occurs -> show
stream in web
browser UI video
DOM element
Note on versioning:
All versions git tags should start with v ex. v1.0.0
Before making a new release with git push <version-tagname> set version
to
<version-tagname> ! without v in the beginning! (ex. 1.0.0 -- not start with v ) in
these three files:
package.json -- in version key ex. 1.0.0
app/package.json -- in version key ex. 1.0.0
app/package-lock.json -- in version key ex. 1.0.0
Maintainer
Pavlo (Paul) Buidenkov
License
AGPL-3.0 License © Pavlo (Paul) Buidenkov
Copyright
Deskreen Logo PNG Image -- © Nadiia Plaunova
Apache 2.0 © blueprintjs
MIT © Electron React Boilerplate
simple-peer MIT. Copyright (c) Feross Aboukhadijeh.
Thanks
Thanks to Github workflows for enabling a robust CI pipeline for Deskreen creating needs.
Many thanks to all open source community members and maintainers of libraries used in
this project.
https://github.com/ieski/deskreen 6/7
18/06/2021 GitHub - ieski/deskreen: Deskreen turns any device with a web browser to a second screen for your computer
Donate
Click to donate on Deskreen's Patreon page: DONATE!
Releases
1
tags
Packages
No packages published
Languages
TypeScript 92.9%
JavaScript 4.3%
CSS 2.0%
HTML 0.8%
https://github.com/ieski/deskreen 7/7
