Add StandardJS workflow

Been running these locally only.
This commit is contained in:
Sean DuBois
2022-02-05 21:56:28 -05:00
parent 7c8064052e
commit ce533d527f
10 changed files with 114 additions and 97 deletions

17
.github/workflows/standardjs.yaml vendored Normal file
View File

@@ -0,0 +1,17 @@
name: StandardJS
on:
pull_request:
types:
- opened
- edited
- synchronize
jobs:
StandardJS:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: 12.x
- run: npm install standard
- run: npx standard

View File

@@ -1,10 +1,10 @@
/* eslint-env browser */
var log = msg => {
const log = msg => {
document.getElementById('logs').innerHTML += msg + '<br>'
}
window.createSession = isPublisher => {
let pc = new RTCPeerConnection({
const pc = new RTCPeerConnection({
iceServers: [
{
urls: 'stun:stun.l.google.com:19302'
@@ -21,7 +21,7 @@ window.createSession = isPublisher => {
if (isPublisher) {
navigator.mediaDevices.getUserMedia({ video: true, audio: false })
.then(stream => {
stream.getTracks().forEach(track => pc.addTrack(track, stream));
stream.getTracks().forEach(track => pc.addTrack(track, stream))
document.getElementById('video1').srcObject = stream
pc.createOffer()
.then(d => pc.setLocalDescription(d))
@@ -34,7 +34,7 @@ window.createSession = isPublisher => {
.catch(log)
pc.ontrack = function (event) {
var el = document.getElementById('video1')
const el = document.getElementById('video1')
el.srcObject = event.streams[0]
el.autoplay = true
el.controls = true
@@ -42,7 +42,7 @@ window.createSession = isPublisher => {
}
window.startSession = () => {
let sd = document.getElementById('remoteSessionDescription').value
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}
@@ -67,9 +67,9 @@ window.createSession = isPublisher => {
} catch (err) {
log('Unable to copy SDP ' + err)
}
}
}
let btns = document.getElementsByClassName('createSessionButton')
const btns = document.getElementsByClassName('createSessionButton')
for (let i = 0; i < btns.length; i++) {
btns[i].style = 'display: none'
}

View File

@@ -1,17 +1,17 @@
/* eslint-env browser */
let pc = new RTCPeerConnection({
const pc = new RTCPeerConnection({
iceServers: [
{
urls: 'stun:stun.l.google.com:19302'
}
]
})
let log = msg => {
const log = msg => {
document.getElementById('logs').innerHTML += msg + '<br>'
}
let sendChannel = pc.createDataChannel('foo')
const sendChannel = pc.createDataChannel('foo')
sendChannel.onclose = () => console.log('sendChannel has closed')
sendChannel.onopen = () => console.log('sendChannel has opened')
sendChannel.onmessage = e => log(`Message from DataChannel '${sendChannel.label}' payload '${e.data}'`)
@@ -27,7 +27,7 @@ pc.onnegotiationneeded = e =>
pc.createOffer().then(d => pc.setLocalDescription(d)).catch(log)
window.sendMessage = () => {
let message = document.getElementById('message').value
const message = document.getElementById('message').value
if (message === '') {
return alert('Message must not be empty')
}
@@ -36,7 +36,7 @@ window.sendMessage = () => {
}
window.startSession = () => {
let sd = document.getElementById('remoteSessionDescription').value
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}

View File

@@ -3,17 +3,17 @@
// cipherKey that video is encrypted with
const cipherKey = 0xAA
let pc = new RTCPeerConnection({encodedInsertableStreams: true, forceEncodedVideoInsertableStreams: true})
let log = msg => {
const pc = new RTCPeerConnection({ encodedInsertableStreams: true, forceEncodedVideoInsertableStreams: true })
const log = msg => {
document.getElementById('div').innerHTML += msg + '<br>'
}
// Offer to receive 1 video
let transceiver = pc.addTransceiver('video')
const transceiver = pc.addTransceiver('video')
// The API has seen two iterations, support both
// In the future this will just be `createEncodedStreams`
let receiverStreams = getInsertableStream(transceiver)
const receiverStreams = getInsertableStream(transceiver)
// boolean controlled by checkbox to enable/disable encryption
let applyDecryption = true
@@ -24,8 +24,8 @@ window.toggleDecryption = () => {
// Loop that is called for each video frame
const reader = receiverStreams.readable.getReader()
const writer = receiverStreams.writable.getWriter()
reader.read().then(function processVideo({ done, value }) {
let decrypted = new DataView(value.data)
reader.read().then(function processVideo ({ done, value }) {
const decrypted = new DataView(value.data)
if (applyDecryption) {
for (let i = 0; i < decrypted.buffer.byteLength; i++) {
@@ -41,7 +41,7 @@ reader.read().then(function processVideo({ done, value }) {
// Fire when remote video arrives
pc.ontrack = function (event) {
document.getElementById('remote-video').srcObject = event.streams[0]
document.getElementById('remote-video').style = ""
document.getElementById('remote-video').style = ''
}
// Populate SDP field when finished gathering
@@ -54,7 +54,7 @@ pc.onicecandidate = event => {
pc.createOffer().then(d => pc.setLocalDescription(d)).catch(log)
window.startSession = () => {
let sd = document.getElementById('remoteSessionDescription').value
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}
@@ -68,8 +68,8 @@ window.startSession = () => {
// DOM code to show banner if insertable streams not supported
let insertableStreamsSupported = true
let updateSupportBanner = () => {
let el = document.getElementById('no-support-banner')
const updateSupportBanner = () => {
const el = document.getElementById('no-support-banner')
if (insertableStreamsSupported && el) {
el.style = 'display: none'
}
@@ -77,7 +77,7 @@ let updateSupportBanner = () => {
document.addEventListener('DOMContentLoaded', updateSupportBanner)
// Shim to support both versions of API
function getInsertableStream(transceiver) {
function getInsertableStream (transceiver) {
let insertableStreams = null
if (transceiver.receiver.createEncodedVideoStreams) {
insertableStreams = transceiver.receiver.createEncodedVideoStreams()
@@ -88,7 +88,7 @@ function getInsertableStream(transceiver) {
if (!insertableStreams) {
insertableStreamsSupported = false
updateSupportBanner()
throw 'Insertable Streams are not supported'
throw new Error('Insertable Streams are not supported')
}
return insertableStreams

View File

@@ -1,19 +1,19 @@
/* eslint-env browser */
let pc = new RTCPeerConnection({
const pc = new RTCPeerConnection({
iceServers: [
{
urls: 'stun:stun.l.google.com:19302'
}
]
})
var log = msg => {
const log = msg => {
document.getElementById('logs').innerHTML += msg + '<br>'
}
navigator.mediaDevices.getUserMedia({ video: true, audio: true })
.then(stream => {
stream.getTracks().forEach(track => pc.addTrack(track, stream));
stream.getTracks().forEach(track => pc.addTrack(track, stream))
pc.createOffer().then(d => pc.setLocalDescription(d)).catch(log)
}).catch(log)
@@ -24,7 +24,7 @@ pc.onicecandidate = event => {
}
}
pc.ontrack = function (event) {
var el = document.createElement(event.track.kind)
const el = document.createElement(event.track.kind)
el.srcObject = event.streams[0]
el.autoplay = true
el.controls = true
@@ -33,7 +33,7 @@ pc.ontrack = function (event) {
}
window.startSession = () => {
let sd = document.getElementById('remoteSessionDescription').value
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}
@@ -59,4 +59,3 @@ window.copySDP = () => {
log('Unable to copy SDP ' + err)
}
}

View File

@@ -1,13 +1,13 @@
/* eslint-env browser */
let pc = new RTCPeerConnection({
const pc = new RTCPeerConnection({
iceServers: [
{
urls: 'stun:stun.l.google.com:19302'
}
]
})
var log = msg => {
const log = msg => {
document.getElementById('logs').innerHTML += msg + '<br>'
}
@@ -26,7 +26,7 @@ pc.onicecandidate = event => {
}
window.startSession = () => {
let sd = document.getElementById('remoteSessionDescription').value
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}

View File

@@ -1,13 +1,13 @@
/* eslint-env browser */
let pc = new RTCPeerConnection({
const pc = new RTCPeerConnection({
iceServers: [
{
urls: 'stun:stun.l.google.com:19302'
}
]
})
var log = msg => {
const log = msg => {
document.getElementById('logs').innerHTML += msg + '<br>'
}
@@ -27,7 +27,7 @@ pc.onicecandidate = event => {
}
window.startSession = () => {
let sd = document.getElementById('remoteSessionDescription').value
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}

View File

@@ -1,95 +1,95 @@
/* eslint-env browser */
// Create peer conn
const pc = new RTCPeerConnection({
iceServers: [
{
urls: "stun:stun.l.google.com:19302",
},
],
});
iceServers: [{
urls: 'stun:stun.l.google.com:19302'
}]
})
pc.oniceconnectionstatechange = (e) => {
console.log("connection state change", pc.iceConnectionState);
};
console.log('connection state change', pc.iceConnectionState)
}
pc.onicecandidate = (event) => {
if (event.candidate === null) {
document.getElementById("localSessionDescription").value = btoa(
document.getElementById('localSessionDescription').value = btoa(
JSON.stringify(pc.localDescription)
);
)
}
};
}
pc.onnegotiationneeded = (e) =>
pc
.createOffer()
.then((d) => pc.setLocalDescription(d))
.catch(console.error);
.catch(console.error)
pc.ontrack = (event) => {
console.log("Got track event", event);
let video = document.createElement("video");
video.srcObject = event.streams[0];
video.autoplay = true;
video.width = "500";
let label = document.createElement("div");
label.textContent = event.streams[0].id;
document.getElementById("serverVideos").appendChild(label);
document.getElementById("serverVideos").appendChild(video);
};
console.log('Got track event', event)
const video = document.createElement('video')
video.srcObject = event.streams[0]
video.autoplay = true
video.width = '500'
const label = document.createElement('div')
label.textContent = event.streams[0].id
document.getElementById('serverVideos').appendChild(label)
document.getElementById('serverVideos').appendChild(video)
}
navigator.mediaDevices
.getUserMedia({
video: {
width: {
ideal: 4096,
ideal: 4096
},
height: {
ideal: 2160,
ideal: 2160
},
frameRate: {
ideal: 60,
min: 10,
min: 10
}
},
},
audio: false,
audio: false
})
.then((stream) => {
document.getElementById("browserVideo").srcObject = stream;
document.getElementById('browserVideo').srcObject = stream
pc.addTransceiver(stream.getVideoTracks()[0], {
direction: "sendonly",
direction: 'sendonly',
streams: [stream],
sendEncodings: [
// for firefox order matters... first high resolution, then scaled resolutions...
{
rid: "f",
rid: 'f'
},
{
rid: "h",
scaleResolutionDownBy: 2.0,
rid: 'h',
scaleResolutionDownBy: 2.0
},
{
rid: "q",
scaleResolutionDownBy: 4.0,
},
],
});
pc.addTransceiver("video");
pc.addTransceiver("video");
pc.addTransceiver("video");
});
rid: 'q',
scaleResolutionDownBy: 4.0
}
]
})
pc.addTransceiver('video')
pc.addTransceiver('video')
pc.addTransceiver('video')
})
window.startSession = () => {
const sd = document.getElementById("remoteSessionDescription").value;
if (sd === "") {
return alert("Session Description must not be empty");
const sd = document.getElementById('remoteSessionDescription').value
if (sd === '') {
return alert('Session Description must not be empty')
}
try {
console.log("answer", JSON.parse(atob(sd)));
pc.setRemoteDescription(new RTCSessionDescription(JSON.parse(atob(sd))));
console.log('answer', JSON.parse(atob(sd)))
pc.setRemoteDescription(new RTCSessionDescription(JSON.parse(atob(sd))))
} catch (e) {
alert(e);
alert(e)
}
};
}
window.copySDP = () => {
const browserSDP = document.getElementById('localSessionDescription')

View File

@@ -1,3 +1,4 @@
/* eslint-env browser */
// Create peer conn
const pc = new RTCPeerConnection({
@@ -38,7 +39,7 @@ requestAnimationFrame(() => drawCircle(document.getElementById('canvasOne').getC
requestAnimationFrame(() => drawCircle(document.getElementById('canvasTwo').getContext('2d'), '#cf635f', 0))
requestAnimationFrame(() => drawCircle(document.getElementById('canvasThree').getContext('2d'), '#46c240', 0))
function drawCircle(ctx, color, angle) {
function drawCircle (ctx, color, angle) {
// Background
ctx.clearRect(0, 0, 200, 200)
ctx.fillStyle = '#eeeeee'

View File

@@ -1,10 +1,10 @@
// This file adds RTCPeerConnection to the global context, making Node.js more
// closely match the browser API for WebRTC.
const wrtc = require("wrtc");
const wrtc = require('wrtc')
global.window = {
RTCPeerConnection: wrtc.RTCPeerConnection
};
}
global.RTCPeerConnection = wrtc.RTCPeerConnection;
global.RTCPeerConnection = wrtc.RTCPeerConnection