feat: rework surface size properties

lib/Service/Satellite.js

@@ -120,8 +120,10 @@ class ServiceSatellite extends ServiceBase {
 
 		const device = this.surfaces.addSatelliteDevice({
 			path: id,
-			keysTotal: keysTotal,
-			keysPerRow: keysPerRow,
+			gridSize: {
+				columns: keysPerRow,
+				rows: keysTotal / keysPerRow,
+			},
 			socket: socket,
 			deviceId: params.DEVICEID,
 			productName: params.PRODUCT_NAME,

lib/Surface/Handler.js

@@ -205,12 +205,11 @@ class SurfaceHandler extends CoreBase {
 	}
 
 	updateMaxOffset() {
-		const keysPerRow = this.panel.info.keysPerRow || 0
-		const keysTotal = this.panel.info.keysTotal || 0
-		if (keysPerRow && keysTotal) {
+		const gridSize = this.panel.gridSize
+		if (gridSize.columns && gridSize.rows) {
 			const maxRows = Math.ceil(global.MAX_BUTTONS / global.MAX_BUTTONS_PER_ROW)
-			this.panelInfo.xOffsetMax = Math.max(Math.floor(global.MAX_BUTTONS_PER_ROW - keysPerRow), 0)
-			this.panelInfo.yOffsetMax = Math.max(Math.floor(maxRows - Math.ceil(keysTotal / keysPerRow)), 0)
+			this.panelInfo.xOffsetMax = Math.max(Math.floor(global.MAX_BUTTONS_PER_ROW - gridSize.columns), 0)
+			this.panelInfo.yOffsetMax = Math.max(Math.floor(maxRows - gridSize.rows), 0)
 		}
 	}
 
@@ -258,11 +257,14 @@ class SurfaceHandler extends CoreBase {
 			} else if (this.#xkeysPageCount > 0) {
 				this.#xkeysDrawPages()
 			} else if (this.panel.info.type === 'Loupedeck CT') {
-				for (let y = 0; y < 7; y += 1) {
+				const gridSize = this.panel.gridSize
+
+				for (let y = 0; y < gridSize.rows; y += 1) {
 					let pageNumber = this.currentPage
-					if (y > 3) pageNumber += 1
+					if (y >= gridSize.rows) pageNumber += 1
 					if (pageNumber > 99) pageNumber = 1
-					for (let x = 0; x < this.panel.info.keysPerRow; x += 1) {
+
+					for (let x = 0; x < gridSize.columns; x += 1) {
 						const image = this.graphics.getBank({
 							pageNumber,
 							column: x,
@@ -276,9 +278,10 @@ class SurfaceHandler extends CoreBase {
 				const xOffset = Math.min(Math.max(this.panelconfig.config.xOffset || 0, 0), this.panelInfo.xOffsetMax)
 				const yOffset = Math.min(Math.max(this.panelconfig.config.yOffset || 0, 0), this.panelInfo.yOffsetMax)
 
-				const rows = this.panel.info.keysTotal / this.panel.info.keysPerRow
-				for (let y = 0; y < rows; y++) {
-					for (let x = 0; x < this.panel.info.keysPerRow; x++) {
+				const gridSize = this.panel.gridSize
+
+				for (let y = 0; y < gridSize.rows; y++) {
+					for (let x = 0; x < gridSize.columns; x++) {
 						const image = this.graphics.getBank({
 							pageNumber: this.currentPage,
 							column: x + xOffset,

lib/Surface/IP/ElgatoEmulator.js

@@ -68,8 +68,6 @@ class SurfaceIPElgatoEmulator extends EventEmitter {
 			type: 'Emulator',
 			devicepath: `emulator:${emulatorId}`,
 			configFields: ['emulator_control_enable', 'emulator_prompt_fullscreen', 'emulator_size'],
-			keysPerRow: 8, // Overridden later
-			keysTotal: 32, // Overridden later
 			deviceId: `emulator:${emulatorId}`,
 		}
 
@@ -78,6 +76,13 @@ class SurfaceIPElgatoEmulator extends EventEmitter {
 		this.imageCache = {}
 	}
 
+	get gridSize() {
+		return {
+			columns: this.#lastSentConfigJson?.emulator_columns || 8,
+			rows: this.#lastSentConfigJson?.emulator_rows || 4,
+		}
+	}
+
 	setupClient(client) {
 		client.emit('emulator:images', this.imageCache)
 
@@ -99,10 +104,6 @@ class SurfaceIPElgatoEmulator extends EventEmitter {
 		if (!config.emulator_columns) config.emulator_columns = this.getDefaultConfig().emulator_columns
 		if (!config.emulator_rows) config.emulator_rows = this.getDefaultConfig().emulator_rows
 
-		// Ensure info is accurate
-		this.info.keysPerRow = config.emulator_columns
-		this.info.keysTotal = config.emulator_columns * config.emulator_rows
-
 		// Send config to clients
 		const roomName = EmulatorRoom(this.id)
 		if (this.io.countRoomMembers(roomName) > 0) {
@@ -113,15 +114,13 @@ class SurfaceIPElgatoEmulator extends EventEmitter {
 		}
 
 		// Handle resize
-		if (
-			config.emulator_columns !== this.#lastSentConfigJson.emulator_columns ||
-			config.emulator_rows !== this.#lastSentConfigJson.emulator_rows
-		) {
+		const oldSize = this.gridSize
+		if (config.emulator_columns !== oldSize.columns || config.emulator_rows !== oldSize.rows) {
 			// Clear the cache to ensure no bleed
 			this.imageCache = {}
 
-			for (let y = 0; y < this.#lastSentConfigJson.emulator_rows; y++) {
-				for (let x = 0; x < this.#lastSentConfigJson.emulator_columns; x++) {
+			for (let y = 0; y < oldSize.rows; y++) {
+				for (let x = 0; x < oldSize.columns; x++) {
 					this.#trackChanged(x, y)
 				}
 			}
@@ -138,8 +137,8 @@ class SurfaceIPElgatoEmulator extends EventEmitter {
 	quit() {}
 
 	draw(x, y, render) {
-		if (x < 0 || y < 0 || x >= this.#lastSentConfigJson.emulator_columns || y >= this.#lastSentConfigJson.emulator_rows)
-			return true
+		const size = this.gridSize
+		if (x < 0 || y < 0 || x >= size.columns || y >= size.rows) return true
 
 		const dataUrl = render.asDataUrl
 		if (!dataUrl) {

lib/Surface/IP/ElgatoPlugin.js

@@ -40,11 +40,14 @@ class SurfaceIPElgatoPlugin extends EventEmitter {
 			type: 'Elgato Streamdeck Plugin',
 			devicepath: devicepath,
 			configFields: ['rotation'],
-			keysPerRow: 8,
-			keysTotal: 32,
 			deviceId: 'plugin',
 		}
 
+		this.gridSize = {
+			columns: 8,
+			rows: 4,
+		}
+
 		this._config = {
 			rotation: 0,
 		}
@@ -101,7 +104,7 @@ class SurfaceIPElgatoPlugin extends EventEmitter {
 			let right = data.ticks > 0
 
 			if (key !== undefined) {
-				const xy = convertPanelIndexToXY(key, this.info)
+				const xy = convertPanelIndexToXY(key, this.gridSize)
 				if (xy) {
 					this.emit('rotate', ...xy, right)
 				}
@@ -144,7 +147,7 @@ class SurfaceIPElgatoPlugin extends EventEmitter {
 	}
 
 	#emitClick(key, state) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('click', ...xy, state)
 		}

lib/Surface/IP/Satellite.js

@@ -36,12 +36,12 @@ class SurfaceIPSatellite extends EventEmitter {
 			type: deviceInfo.productName,
 			devicepath: deviceInfo.path,
 			configFields: ['brightness'],
-			keysPerRow: deviceInfo.keysPerRow,
-			keysTotal: deviceInfo.keysTotal,
 			deviceId: deviceInfo.path,
 			location: deviceInfo.socket.remoteAddress,
 		}
 
+		this.gridSize = deviceInfo.gridSize
+
 		this.deviceId = deviceInfo.deviceId
 
 		this.socket = deviceInfo.socket
@@ -128,7 +128,7 @@ class SurfaceIPSatellite extends EventEmitter {
 	}
 
 	draw(x, y, render) {
-		const key = convertXYToIndexForPanel(x, y, this.info)
+		const key = convertXYToIndexForPanel(x, y, this.gridSize)
 		if (key === null) return true
 
 		if (this.#streamBitmapSize) {
@@ -142,14 +142,14 @@ class SurfaceIPSatellite extends EventEmitter {
 	}
 
 	doButton(key, state) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('click', ...xy, state)
 		}
 	}
 
 	doRotate(key, direction) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('rotate', ...xy, direction)
 		}

lib/Surface/USB/ElgatoStreamDeck.js

@@ -44,11 +44,17 @@ class SurfaceUSBElgatoStreamDeck extends EventEmitter {
 			type: `Elgato ${this.streamDeck.PRODUCT_NAME}`,
 			devicepath: devicepath,
 			configFields: ['brightness', 'rotation'],
-			keysPerRow: this.streamDeck.KEY_COLUMNS,
-			keysTotal: this.streamDeck.NUM_KEYS,
 			deviceId: undefined, // set in #init()
 		}
 
+		this.gridSize = {
+			columns: this.streamDeck.KEY_COLUMNS,
+			rows: this.streamDeck.KEY_ROWS,
+		}
+		if (this.streamDeck.MODEL === DeviceModelId.PLUS) {
+			this.gridSize.rows += 2
+		}
+
 		this.write_queue = new ImageWriteQueue(this.logger, async (key, buffer) => {
 			let newbuffer = buffer
 			const targetSize = this.streamDeck.ICON_SIZE
@@ -103,8 +109,6 @@ class SurfaceUSBElgatoStreamDeck extends EventEmitter {
 		})
 
 		if (this.streamDeck.MODEL === DeviceModelId.PLUS) {
-			this.info.keysTotal += 8
-
 			const encoderOffset = 12
 			this.streamDeck.on('rotateLeft', (encoderIndex) => {
 				this.#emitRotate(encoderOffset + encoderIndex, false)
@@ -175,14 +179,14 @@ class SurfaceUSBElgatoStreamDeck extends EventEmitter {
 	}
 
 	#emitClick(key, state) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('click', ...xy, state)
 		}
 	}
 
 	#emitRotate(key, direction) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('rotate', ...xy, direction)
 		}
@@ -251,7 +255,7 @@ class SurfaceUSBElgatoStreamDeck extends EventEmitter {
 	}
 
 	draw(x, y, render) {
-		const key = convertXYToIndexForPanel(x, y, this.info)
+		const key = convertXYToIndexForPanel(x, y, this.gridSize)
 		if (key === null) return true
 
 		if (key >= 0 && key < this.streamDeck.NUM_KEYS) {

lib/Surface/USB/Infinitton.js

@@ -38,11 +38,14 @@ class SurfaceUSBInfinitton {
 			type: 'Infinitton iDisplay device',
 			devicepath: devicepath,
 			configFields: ['brightness', 'rotation'],
-			keysPerRow: 5,
-			keysTotal: 15,
 			deviceId: `infinitton:${serialnumber}`,
 		}
 
+		this.gridSize = {
+			columns: 5,
+			rows: 3,
+		}
+
 		this.ipcWrapper.log('debug', 'Infinitton detected')
 
 		this.Infinitton.on('down', (keyIndex) => {
@@ -150,7 +153,8 @@ class SurfaceUSBInfinitton {
 	clearDeck() {
 		this.ipcWrapper.log('debug', 'infinitton.prototype.clearDeck()')
 
-		for (let x = 0; x < this.info.keysTotal; x++) {
+		const keysTotal = this.gridSize.columns * this.gridSize.rows
+		for (let x = 0; x < keysTotal; x++) {
 			this.Infinitton.clearKey(x)
 		}
 	}

lib/Surface/USB/LoupedeckCt.js

@@ -72,11 +72,14 @@ class SurfaceUSBLoupedeckCt extends EventEmitter {
 			type: `Loupedeck CT`,
 			devicepath: devicepath,
 			configFields: ['brightness'],
-			keysPerRow: 8,
-			keysTotal: 56,
 			deviceId: `loupedeck:${serialnumber}`,
 		}
 
+		this.gridSize = {
+			columns: 8,
+			rows: 7,
+		}
+
 		this.loupedeck.on('error', (error) => {
 			this.logger.error(`error: ${error}`)
 			this.emit('remove')
@@ -105,7 +108,7 @@ class SurfaceUSBLoupedeckCt extends EventEmitter {
 			for (const touch of data.changedTouches) {
 				if (touch.target.key !== undefined) {
 					const keyIndex = translateTouchKeyIndex(this.modelInfo.displays[touch.target.screen], touch.target.key)
-					const xy = convertPanelIndexToXY(keyIndex, this.info)
+					const xy = convertPanelIndexToXY(keyIndex, this.gridSize)
 					this.#emitClick(xy, true)
 				} else if (touch.target.screen == LoupedeckDisplayId.Wheel) {
 					this.#emitClick([2, 4], true)
@@ -117,7 +120,7 @@ class SurfaceUSBLoupedeckCt extends EventEmitter {
 			for (const touch of data.changedTouches) {
 				if (touch.target.key !== undefined) {
 					const keyIndex = translateTouchKeyIndex(this.modelInfo.displays[touch.target.screen], touch.target.key)
-					const xy = convertPanelIndexToXY(keyIndex, this.info)
+					const xy = convertPanelIndexToXY(keyIndex, this.gridSize)
 					this.#emitClick(xy, false)
 				} else if (touch.target.screen == LoupedeckDisplayId.Wheel) {
 					this.#emitClick([2, 4], false)

lib/Surface/USB/LoupedeckLive.js

@@ -131,11 +131,14 @@ class SurfaceUSBLoupedeckLive extends EventEmitter {
 			type: `Loupedeck ${this.loupedeck.modelName}`,
 			devicepath: devicepath,
 			configFields: ['brightness'],
-			keysPerRow: this.modelInfo.totalCols,
-			keysTotal: this.modelInfo.totalCols * this.modelInfo.totalRows,
 			deviceId: `loupedeck:${serialnumber}`,
 		}
 
+		this.gridSize = {
+			columns: this.modelInfo.totalCols,
+			rows: this.modelInfo.totalRows,
+		}
+
 		this.loupedeck.on('error', (error) => {
 			this.logger.error(`error: ${error}`)
 			this.emit('remove')
@@ -230,7 +233,7 @@ class SurfaceUSBLoupedeckLive extends EventEmitter {
 	}
 
 	#emitClick(key, state) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('click', ...xy, state)
 		}

lib/Surface/USB/XKeys.js

@@ -43,9 +43,11 @@ class SurfaceUSBXKeys extends EventEmitter {
 			devicepath: devicepath,
 			configFields: ['brightness', 'illuminate_pressed'],
 			deviceId: deviceId,
+		}
 
-			keysPerRow: global.MAX_BUTTONS_PER_ROW,
-			keysTotal: global.MAX_BUTTONS,
+		this.gridSize = {
+			columns: global.MAX_BUTTONS_PER_ROW,
+			rows: global.MAX_BUTTONS / global.MAX_BUTTONS_PER_ROW,
 		}
 
 		this.config = {
@@ -164,7 +166,7 @@ class SurfaceUSBXKeys extends EventEmitter {
 	}
 
 	#emitClick(key, state, pageOffset) {
-		const xy = convertPanelIndexToXY(key, this.info)
+		const xy = convertPanelIndexToXY(key, this.gridSize)
 		if (xy) {
 			this.emit('click', ...xy, state, pageOffset)
 		}
@@ -247,7 +249,7 @@ class SurfaceUSBXKeys extends EventEmitter {
 			b: color & 0xff,
 		}
 
-		const key = convertXYToIndexForPanel(x, y, this.info)
+		const key = convertXYToIndexForPanel(x, y, this.gridSize)
 		if (!key) return
 
 		const buttonNumber = page * global.MAX_BUTTONS + key