Salastil/streamwall
1
0
Fork 0
mirror of https://github.com/streamwall/streamwall.git synced 2026-01-31 09:22:49 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add hacky support for playing audio-based pages

Browse Source
This commit is contained in:
Max Goodhart
2020-08-26 23:46:43 -07:00
parent d8e51776e9
commit 4b5e2931eb
2 changed files with 16 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/node/viewStateMachine.js
View File

@@ -10,7 +10,7 @@ const VIDEO_OVERRIDE_STYLE = `
position: static !important; position: static !important;
z-index: 0 !important; z-index: 0 !important;
} }
html, body, video { html, body, video, audio {
display: block !important; display: block !important;
background: black !important; background: black !important;
} }
@@ -18,7 +18,7 @@ const VIDEO_OVERRIDE_STYLE = `
overflow: hidden !important; overflow: hidden !important;
background: black !important; background: black !important;
} }
video, iframe.__video__ { video, iframe.__video__, audio {
display: block !important; display: block !important;
position: fixed !important; position: fixed !important;
left: 0 !important; left: 0 !important;
@@ -31,6 +31,9 @@ const VIDEO_OVERRIDE_STYLE = `
transition: none !important; transition: none !important;
z-index: 999999 !important; z-index: 999999 !important;
} }
audio {
z-index: 999998 !important;
}
.__video_parent__ { .__video_parent__ {
display: block !important; display: block !important;
} }
@@ -210,7 +213,7 @@ const viewStateMachine = Machine(
const wc = view.webContents const wc = view.webContents
wc.audioMuted = true wc.audioMuted = true
await wc.loadURL(content.url) await wc.loadURL(content.url)
if (content.kind === 'video') { if (content.kind === 'video' || content.kind === 'audio') {
wc.insertCSS(VIDEO_OVERRIDE_STYLE, { cssOrigin: 'user' }) wc.insertCSS(VIDEO_OVERRIDE_STYLE, { cssOrigin: 'user' })
} else if (content.kind === 'web') { } else if (content.kind === 'web') {
wc.insertCSS( wc.insertCSS(
@@ -225,19 +228,23 @@ const viewStateMachine = Machine(
}, },
startVideo: async (context, event) => { startVideo: async (context, event) => {
const { content, view } = context const { content, view } = context
if (content.kind !== 'video') { if (content.kind !== 'video' && content.kind !== 'audio') {
return return
} }
const wc = view.webContents const wc = view.webContents
// TODO: generalize "video" terminology to "media"
const info = await wc.executeJavaScript(` const info = await wc.executeJavaScript(`
(function() { (function() {
const sleep = ms => new Promise((resolve) => setTimeout(resolve, ms)) const sleep = ms => new Promise((resolve) => setTimeout(resolve, ms))
const kind = ${JSON.stringify(
content.kind === 'video' ? 'video' : 'audio',
)}
async function waitForVideo() { async function waitForVideo() {
let tries = 0 let tries = 0
let video let video
while ((!video || !video.src) && tries < 10) { while ((!video || !video.src) && tries < 10) {
video = document.querySelector('video') video = document.querySelector(kind)
tries++ tries++
await sleep(200) await sleep(200)
} }
@@ -252,7 +259,7 @@ const viewStateMachine = Machine(
if (!iframe.contentDocument) { if (!iframe.contentDocument) {
continue continue
} }
video = iframe.contentDocument.querySelector('video') video = iframe.contentDocument.querySelector(kind)
if (video) { if (video) {
break break
} }

4
src/web/control.js
View File

@@ -494,7 +494,8 @@ function App({ wsEndpoint, role }) {
) )
const normalStreams = streams.filter( const normalStreams = streams.filter(
(s) => !s.kind || s.kind === 'video' || s.kind === 'web', (s) =>
!s.kind || s.kind === 'video' || s.kind === 'audio' || s.kind === 'web',
) )
return ( return (
@@ -927,6 +928,7 @@ function CustomStreamInput({ idx, onChange, ...props }) {
/> />
<select onChange={handleChangeKind} value={props.kind}> <select onChange={handleChangeKind} value={props.kind}>
<option value="video">video</option> <option value="video">video</option>
<option value="audio">audio</option>
<option value="web">web</option> <option value="web">web</option>
<option value="overlay">overlay</option> <option value="overlay">overlay</option>
<option value="background">background</option> <option value="background">background</option>