Add Channel Check mode

src/api/preset/presetRouter.ts

@@ -2,7 +2,6 @@ import { Preset } from './../../database/model/Preset'
 import { DatabasePreset, PresetRepository } from './../../database/repository/preset'
 import { createDatabaseObject, Database, sendDatabaseObject } from './../database'
 import axios from 'axios'
-import { OSCFormValue } from '../../app/Components/Admin/Controls/Presets/EditModal/OSC'
 /**
  * This is a REST router for the preset API.
  * @param path - The path requested by the original route requestor

src/app/Components/Admin/Controls/Presets/EditModal/Macro.tsx

@@ -68,7 +68,10 @@ export const MacroPresetEditModal = (props: GetInputProps<'input'>) => {
 						<Select
 							placeholder="Page"
 							{...form.getListInputProps('steps', index, 'value')}
-							data={[{ value: '/controlPanel/lxKeypad', label: 'Lighting Keypad' }]}
+							data={[
+								{ value: '/controlPanel/lxKeypad', label: 'Lighting Keypad' },
+								{ value: '/controlPanel/channelCheck', label: 'Lighting Channel Check' },
+							]}
 						/>
 					) : null}
 					<ActionIcon color="red" variant="hover" onClick={() => form.removeListItem('steps', index)}>

src/app/Navigation/ControlPanelNavigation.tsx

@@ -7,7 +7,6 @@ import { NavbarItem } from './NavbarItem'
 import { useAppSelector } from './../apis/redux/mainStore'
 import { DatabasePresetFolder } from './../../database/repository/presetFolder'
 import { PresetFolderIcon } from './../Components/ControlPanel/PresetFolderIcon'
-import { FaCogs } from '@react-icons/all-files/fa/FaCogs'
 
 const TopLevelPresetFolders = ({
 	active,

src/app/Pages/ControlPanel/ChannelCheck.tsx

@@ -0,0 +1,98 @@
+import { Button, Center, Container, SimpleGrid, Space, Text } from '@mantine/core'
+import React, { useEffect, useState } from 'react'
+import { ApiCall } from '../../../app/apis/wrapper'
+import { channelData } from '../../../output/e131'
+
+export const ChannelCheckPage = () => {
+	const [channel, setChannel] = useState<number>(-1)
+	const [channelText, setChannelText] = useState<string>('Off')
+
+	useEffect(() => {
+		if (channel > 0) {
+			setChannelText(channel.toString())
+			setChannelLX(channel, 180)
+		} else if (channel === 0) {
+			setAllLX(180)
+			setChannelText('All')
+		} else {
+			setAllLX(0)
+			setChannelText('Off')
+		}
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [channel])
+
+	function setAllLX(intensity: number) {
+		const channels: Array<channelData> = []
+		for (let i = 1; i <= 512; i++) {
+			channels.push({ channel: i, level: intensity })
+		}
+		const data: apiObject = {
+			universe: 1,
+			channelData: channels,
+			fadeTime: 0,
+		}
+		ApiCall.get('/outputModules/e131/output', data)
+	}
+
+	function setChannelLX(thisChannel: number, intensity: number) {
+		setAllLX(0)
+		const data: apiObject = {
+			universe: 1,
+			channelData: [{ channel: thisChannel, level: intensity }],
+			fadeTime: 0,
+		}
+		ApiCall.get('/outputModules/e131/output', data)
+	}
+
+	function checkPrevious() {
+		if (channel == 1 || channel < 1) {
+			setChannel(512)
+		} else {
+			setChannel(channel - 1)
+		}
+	}
+
+	function checkNext() {
+		if (channel == 512 || channel < 1) {
+			setChannel(1)
+		} else {
+			setChannel(channel + 1)
+		}
+	}
+
+	return (
+		<Container>
+			<Space h="xl" />
+			<SimpleGrid cols={3}>
+				<Button size="xl" onClick={checkPrevious}>
+					Previous
+				</Button>
+				<Center>
+					<Text size="xl" color="white">
+						{channelText}
+					</Text>
+				</Center>
+				<Button size="xl" onClick={checkNext}>
+					Next
+				</Button>
+				<Button
+					size="xl"
+					onClick={() => {
+						setChannel(-1)
+					}}
+				>
+					Off
+				</Button>
+				<Space />
+				<Button
+					size="xl"
+					onClick={() => {
+						setChannel(0)
+					}}
+				>
+					All
+				</Button>
+			</SimpleGrid>
+		</Container>
+	)
+}

src/app/router.tsx

@@ -13,6 +13,7 @@ import { PresetsConfigurationPage } from './Pages/Admin/Presets'
 import { FadersConfigurationPage } from './Pages/Admin/Faders'
 import { ControlsConfigurationPage } from './Pages/Admin/Controls'
 import { Locked } from './Components/Locked'
+import { ChannelCheckPage } from './Pages/ControlPanel/ChannelCheck'
 import { KeypadPage } from './Pages/ControlPanel/Keypad'
 
 const Router = () => {
@@ -29,6 +30,7 @@ const Router = () => {
 				>
 					<Route path="presetFolder/:folderId" element={<PresetPage />} />
 					<Route path="help" element={<HelpPage />} />
+					<Route path="channelCheck" element={<ChannelCheckPage />} />
 					<Route path="lxkeypad" element={<KeypadPage />} />
 				</Route>
 				<Route path="e131sampler" element={<div>Sampling E1.31</div>} />