First version of streamdeck-Streamer.bot plugin

nate1280 · Aug 16, 2021 · faf5a33 · faf5a33
1 parent 6a5e450
commit faf5a33
Show file tree

Hide file tree

Showing 15 changed files with 4,745 additions and 0 deletions.
diff --git a/nate1280.streamerbot.sdPlugin/action-pi.html b/nate1280.streamerbot.sdPlugin/action-pi.html
@@ -0,0 +1,28 @@
+<!DOCTYPE html>
+<html>
+	<head>
+		<title>Streamer.bot - Action</title>
+		<link rel="stylesheet" href="css/sdpi.css">
+		<script src="js/StreamDeck.js" charset="utf-8"></script>
+	</head>
+	<body>
+		<div class="sdpi-wrapper">
+			<div class="sdpi-item" id="select_single">
+				<div class="sdpi-item-label">Action</div>
+				<select class="sdpi-item-value select" id="actions">
+					<option></option>
+				</select>
+			</div>
+			<div class="sdpi-heading">Streamer.bot Authentication</div>
+			<div class="sdpi-item">
+				<div class="sdpi-item-label">Host</div>
+				<input class="sdpi-item-value" id="host">
+			</div>
+			<div class="sdpi-item">
+				<div class="sdpi-item-label">Port</div>
+				<input class="sdpi-item-value" id="port">
+			</div>
+		<div>
+		<script src="js/action-pi.js" charset="utf-8"></script>
+	</body>
+</html>
diff --git a/nate1280.streamerbot.sdPlugin/icons/action.png b/nate1280.streamerbot.sdPlugin/icons/action.png
diff --git a/nate1280.streamerbot.sdPlugin/icons/action@2x.png b/nate1280.streamerbot.sdPlugin/icons/action@2x.png
diff --git a/nate1280.streamerbot.sdPlugin/icons/black.png b/nate1280.streamerbot.sdPlugin/icons/black.png
diff --git a/nate1280.streamerbot.sdPlugin/icons/black@2x.png b/nate1280.streamerbot.sdPlugin/icons/black@2x.png
diff --git a/nate1280.streamerbot.sdPlugin/icons/icon.png b/nate1280.streamerbot.sdPlugin/icons/icon.png
diff --git a/nate1280.streamerbot.sdPlugin/icons/icon@2x.png b/nate1280.streamerbot.sdPlugin/icons/icon@2x.png
diff --git a/nate1280.streamerbot.sdPlugin/js/StreamDeck.js b/nate1280.streamerbot.sdPlugin/js/StreamDeck.js
@@ -0,0 +1,71 @@
+const StreamDeck = {
+	BOTH: 0,
+	HARDWARE: 1,
+	SOFTWARE: 2,
+	_ws: null,
+	_openHandler: (event, uuid) => {
+		StreamDeck._send({
+			"event": event,
+			"uuid": uuid
+		})
+	},
+	_send: (data) => {
+		if (StreamDeck.debug) console.log('StreamDeck.send', data)
+		StreamDeck._ws.send(JSON.stringify(data))
+	},
+	_sendWithContext: (context, data) => {
+		if (context.context) context = context.context
+		data.context = context
+		StreamDeck._send(data)
+	},
+	_sendTo: (context, action, to, payload) => {
+		StreamDeck._sendWithContext(context, {
+			action: action,
+			event: to,
+			payload: payload
+		})
+	},
+	send: (context, event, payload) => {
+		let msg = {
+			event: event
+		}
+		if (payload) msg.payload = payload
+		StreamDeck._sendWithContext(context, msg)
+	},
+	sendAlert: (context) => {
+		StreamDeck.send(context, 'showAlert')
+	},
+	sendOk: (context) => {
+		StreamDeck.send(context, 'showOk')
+	},
+	setTitle: (context, title, target) => {
+		StreamDeck.send(context, 'setTitle', {
+			title: title,
+			target: target
+		})
+	},
+	getSettings: (context) => {
+		StreamDeck.send(context, 'getSettings')
+	},
+	setSettings: (context, settings) => {
+		StreamDeck.send(context, 'setSettings', settings)
+	},
+	getGlobalSettings: (context) => {
+		StreamDeck.send(context, 'getGlobalSettings')
+	},
+	setGlobalSettings: (context, settings) => {
+		StreamDeck.send(context, 'setGlobalSettings', settings)
+	},
+	setImage: (context, image, target) => {
+		StreamDeck.send(context, 'setImage', {
+			image: image,
+			target: target
+		})
+	},
+	sendToPlugin: (context, action, payload) => {
+		StreamDeck._sendTo(context, action, 'sendToPlugin', payload)
+	},
+	sendToPI: (context, action, payload) => {
+		StreamDeck._sendTo(context, action, 'sendToPropertyInspector', payload)
+	},
+}
diff --git a/nate1280.streamerbot.sdPlugin/js/action-pi.js b/nate1280.streamerbot.sdPlugin/js/action-pi.js
@@ -0,0 +1,79 @@
+let _currentPlugin
+let sbActions
+let currentAction
+
+function connectElgatoStreamDeckSocket(port, uuid, registerEvent, info, action) {
+	data = JSON.parse(action)
+	currentAction = data.payload.settings.action
+	_currentPlugin = {
+		action: data.action,
+		context: uuid
+	}
+	StreamDeck.debug = true
+	StreamDeck._ws = new WebSocket("ws://localhost:" + port)
+	StreamDeck._ws.onopen = () => {
+		StreamDeck._openHandler(registerEvent, uuid)
+		StreamDeck.getGlobalSettings(_currentPlugin.context)
+	}
+	StreamDeck._ws.onmessage = (e) => {
+		const data = JSON.parse(e.data)
+		switch(data.event) {
+			case 'sendToPropertyInspector':
+				if (data.payload.actions) {
+					if (data.payload.settings) updateSettingsUI(data)
+					sbActions = data.payload.actions
+					updateActionsUI()
+				}
+				break
+			case 'didReceiveGlobalSettings':
+				updateSettingsUI(data)
+				break
+			default:
+				// console.log(data)
+				break
+		}
+	}
+}
+
+function updateSettingsUI(data) {
+	if (data.payload.settings && Object.keys(data.payload.settings).length > 0) {
+		document.getElementById('host').value = data.payload.settings.host
+		document.getElementById('port').value = data.payload.settings.port
+	}
+}
+
+function updateGlobalSettings() {
+	let settings = {
+		host: document.getElementById('host').value,
+		port: document.getElementById('port').value
+	}
+	StreamDeck.setGlobalSettings(_currentPlugin.context, settings)
+	StreamDeck.sendToPlugin(_currentPlugin.context, _currentPlugin.action, {updateGlobalSettings: true})
+}
+
+function updateActionsUI() {
+	document.getElementById('actions').innerText = ''
+	createAction('')
+	sbActions.forEach((action) => {
+		createAction(action)
+	})
+	document.getElementById('actions').value = currentAction
+}
+
+function createAction(action) {
+	const option = document.createElement('option')
+	option.innerText = action.name
+	option.value = action.id
+	document.getElementById('actions').appendChild(option)
+}
+
+function updateSettings() {
+	StreamDeck.setSettings(_currentPlugin.context, {
+		action: document.getElementById('actions').value
+	})
+	currentAction = document.getElementById('actions').value
+}
+
+document.getElementById('host').onchange = updateGlobalSettings
+document.getElementById('port').onchange = updateGlobalSettings
+document.getElementById('actions').onchange = updateSettings
diff --git a/nate1280.streamerbot.sdPlugin/js/buttons.js b/nate1280.streamerbot.sdPlugin/js/buttons.js
@@ -0,0 +1,61 @@
+class Button {
+	constructor(type, data) {
+		this.context = data.context
+		this.type = type
+		this.processStreamDeckData(data)
+	}
+
+	processStreamDeckData(data) {
+		if (this.type == 'action' && data.payload.settings.action) {
+			this.action = data.payload.settings.action
+			this._updateTitle()
+		}
+	}
+
+	keyDown() {
+		switch (this.type) {
+			case 'action':
+				this._doAction()
+				break
+		}
+	}
+
+	hasAction(action){
+		for (var i = 0; i < SB.actions.length; i++) {
+			if (SB.actions[i].id == action) {
+				return true;
+			}
+		}
+	}
+
+	_doAction() {
+		if (this.hasAction(this.action)) {
+			sb.send('DoAction', {
+				'action': {
+					'id': this.action
+				}
+			})
+		} else {
+			StreamDeck.sendAlert(this.context)
+		}
+	}
+
+	_updateTitle() {
+		StreamDeck.setTitle(this.context, this[this.type], StreamDeck.BOTH)
+	}
+
+	setOnline() {
+		switch (this.type) {
+			case 'action':
+				StreamDeck.setImage(this.context, readyImg, StreamDeck.BOTH)
+				break
+			default:
+				StreamDeck.setImage(this.context, blackImg, StreamDeck.BOTH)
+				break
+		}
+	}
+
+	setOffline() {
+		StreamDeck.setImage(this.context, blackImg, StreamDeck.BOTH)
+	}
+}
diff --git a/nate1280.streamerbot.sdPlugin/js/images.js b/nate1280.streamerbot.sdPlugin/js/images.js
@@ -0,0 +1,13 @@
+const canvas = document.getElementById('canvas')
+
+const ctx = canvas.getContext('2d')
+
+	// Black button
+	ctx.fillStyle = '#000000'
+	ctx.fillRect(0, 0, 144, 144)
+	const blackImg = canvas.toDataURL()
+
+	// Ready button
+	ctx.fillStyle = '#3f3f3f'
+	ctx.fillRect(0, 0, 144, 15)
+	const readyImg = canvas.toDataURL()