getaroom.io
Pretty nifty cross device and cross browser WebRTC audio/video conferencing demo of SkylinkJS using React. Try it out at http://getaroom.io
Demo Query Parameters
| Parameter | Description |
|---|---|
mcu |
Set to 1 or true to enable MCU connections |
forceTurn |
Set to 1 or true to force TURN connections |
forcePlugin |
Set to 1 or true to force Temasys WebRTC Plugin in Safari 11 |
media |
Set to av to fetch audio and video media, v to fetch only video media, a to fetch only audio media and none to no media. |
signalingNode |
Configure custom Temasys Signaling server URL (e.g. https://signaling.temasys.io:3443) |
turnNode |
Configure custom Temasys TURN server URL (e.g. turn:turn.temasys.io:3478) |
appkeyId |
Configure custom App key ID for testing purposes on getaroom.io. |
appkeySecret |
Configure custom App key secret for the configured appkeyId for testing purposes on getaroom.io. |
res |
Set to fhd to fetch FHD resolution, hd to fetch HD resolution, vga to fetch VGA resolution and qvga to fetch QVGA resolution. If local video appears black, it means it failed to retrieve the resolution because it is not available. |
Setup / Development
Skip relevant steps when required.
1. Install required dependencies
Do npm install, and npm install grunt grunt-cli --save-dev if required.
Install node.js here as it should also include with npm.
2. Make modifications in source/ folder.
In the contents of the source/ folder:
-
configs.jsx: Defines the App Keys based on the different environment. Modifylocalonly. You can sign up for your own App key here. -
index.html: Defines the HTML file for getaroom app. This contains the Google Analytics settings in which you can modify for your custom getaroom app. -
jsx/: The React JSX files for the Javascript end.-
constants.jsx: Defines the getaroom constants used across the getaroom app. -
loader.jsx: Defines the dependencies and libraries versions. -
main.jsx: Handles the Temasys Web SDK connection. -
utils.jsx: Handles the utilities functionalities used across the getaroom app. -
components/controls.jsx: Handles the getaroom app controls. -
components/userareas.jsx: Handles the user video element.
-
-
js/: The generated output Javascript files from the React JSX files. Do not modify changes on here.libs/: Stores the custom dependencies Javascript files if needed.
-
img/: Stores thejsx/components/controls.jsxicons. -
assets/: Stores the getaroom logo. -
styles/: The Stylus files for the CSS end. Dont not modify the.cssfiles in there as they are auto-generated.-
mixins/: The mixin files. -
app.styl: The getaroom app styling. -
fonts.styl: The getaroom font styling if needed.
-
-
ca.crt: The CA cert file for localhost webserverhttps:. This is self-signed. Replace for your own app when required. -
server.crt: The server cert file for localhost webserverhttps:. This is self-signed. Replace for your own app when required. -
server.key: The certificate private key for localhost webserverhttps:. This is self-signed. Replace for your own app when required.
3. Start testing modifications
Run grunt dev to compile the React JSX (js) and Stylus (css) files.
This opens https://localhost:8085 in your browser as it runs localhost webserver on your device.
4. Make it production ready
Once ready for production, run grunt stage to create a staging/ folder which contains the compiled and minified version of the application.
Then run grunt publish to move the staging/ contents to publish/ folder. Use files from the publish/ folder to host on your own webserver.