From fdd5ad8d1c98493c7b219e66369faccc72b44eaa Mon Sep 17 00:00:00 2001 From: YeonV Date: Tue, 20 Jun 2023 04:26:12 +0200 Subject: [PATCH] Add OpenRGB Devices and Launchpad to Assistant --- src/components/Dialogs/IntroDialog.tsx | 131 ++++++++++++++++++++----- src/icons/png/launchpad.png | Bin 0 -> 101851 bytes src/icons/png/openrgb.png | Bin 0 -> 5360 bytes src/store/api/storeActions.tsx | 61 +++++++++++- src/store/api/storeDevices.tsx | 4 +- src/store/ui/storeDialogs.tsx | 17 ++++ src/store/useStore.ts | 7 ++ 7 files changed, 196 insertions(+), 24 deletions(-) create mode 100644 src/icons/png/launchpad.png create mode 100644 src/icons/png/openrgb.png diff --git a/src/components/Dialogs/IntroDialog.tsx b/src/components/Dialogs/IntroDialog.tsx index 4176b4a1..3a2eeef9 100644 --- a/src/components/Dialogs/IntroDialog.tsx +++ b/src/components/Dialogs/IntroDialog.tsx @@ -19,6 +19,8 @@ import useStore from '../../store/useStore' import logoCircle from '../../icons/png/128x128.png' import banner from '../../icons/png/banner.png' import wledLogo from '../../icons/png/wled.png' +import openrgbLogo from '../../icons/png/openrgb.png' +import launchpadLogo from '../../icons/png/launchpad.png' import BladeScene from '../../pages/Home/BladeScene' import BladeSchemaForm from '../SchemaForm/SchemaForm/SchemaForm' import BladeIcon from '../Icons/BladeIcon/BladeIcon' @@ -28,7 +30,13 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) const navigate = useNavigate() const intro = useStore((state) => state.intro) const devices = useStore((state) => state.devices) + const openRgbDevices = useStore((state) => state.openRgbDevices) + const launchpadDevice = useStore((state) => state.launchpadDevice) // const virtuals = useStore((state) => state.virtuals) + const scanForOpenRgbDevices = useStore((state) => state.scanForOpenRgbDevices) + const scanForLaunchpadDevices = useStore( + (state) => state.scanForLaunchpadDevices + ) const setIntro = useStore((state) => state.setIntro) const setTour = useStore((state) => state.setTour) const setTourOpen = useStore((state) => state.setTourOpen) @@ -50,12 +58,15 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) const graphsMulti = useStore((state) => state.graphsMulti) + const assistant = useStore((state) => state.assistant) + const setAssistant= useStore((state) => state.setAssistant) const toggleGraphsMulti = useStore((state) => state.toggleGraphsMulti) const getSystemConfig = useStore((state) => state.getSystemConfig) const setSystemConfig = useStore((state) => state.setSystemConfig) const onSystemSettingsChange = (setting: string, value: any) => { setSystemConfig({ [setting]: value }).then(() => getSystemConfig()) } + const setFeatures = useStore((state) => state.setFeatures) const features = useStore((state) => state.features) @@ -88,10 +99,10 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) }, { key: 'gotWled', - title: 'Scan for WLEDs in network?', + title: 'Scan for Devices?', icon: 'wled', - label_left: 'Nah, no WLEDs', - label_right: 'Yes, please scan my network for WLEDs', + label_left: 'No', + label_right: 'Yes', action_left: handleNext, action_right: handleNext, }, @@ -143,31 +154,44 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) }, { key: 'gotWled', - title: 'Scan for WLEDs in network?', + title: 'Scan for devices?', icon: 'wled', - label_left: 'No WLEDs', - label_right: 'Yes, scan my network', - action_left: handleNext, - action_right: handleNext, - }, - s.gotWled === 'right' && { - key: 'wledSegs', - title: 'Import Segments from WLED?', - icon: 'wled', - label_left: 'No, only main devices', - label_right: 'Yes, import segments', + label_left: 'Skip', + label_right: 'Yes', action_left: () => { - onSystemSettingsChange('create_segments', false) - handleScan() + onSystemSettingsChange('create_segments', assistant.wledSegments) + if (assistant.openRgb) scanForOpenRgbDevices() + if (assistant.launchpad) scanForLaunchpadDevices() + if (assistant.wled) setScanning(0) + if (assistant.wled) handleScan() setTour('home') handleNext() }, action_right: () => { - onSystemSettingsChange('create_segments', true) - handleScan() + onSystemSettingsChange('create_segments', assistant.wledSegments) + if (assistant.openRgb) scanForOpenRgbDevices() + if (assistant.launchpad) scanForLaunchpadDevices() + if (assistant.wled) setScanning(0) + if (assistant.wled) handleScan() handleNext() }, }, + // s.gotWled === 'right' && { + // key: 'wledSegs', + // title: 'Import Segments from WLED?', + // icon: 'wled', + // label_left: 'No, only main devices', + // label_right: 'Yes, import segments', + // action_left: () => { + // handleScan() + // setTour('home') + // handleNext() + // }, + // action_right: () => { + // handleScan() + // handleNext() + // }, + // }, s.gotWled === 'right' && { key: 'wledScanning', title: `${devices && Object.keys(devices)?.length}`, @@ -221,7 +245,7 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) ].filter((n: any) => n !== false) setSteps(ste) - }, [s, graphsMulti]) + }, [s, graphsMulti, assistant]) @@ -266,14 +290,29 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) {steps[activeStep].key === 'wledScanning' - ? `${devices && Object.keys(devices)?.length} new WLEDs found` + ? <>New Devices found:
+ + :steps[activeStep].title} + {steps[activeStep].key === 'wledScanning' + && + + {devices && Object.keys(devices)?.length}WLEDs + {openRgbDevices.length > 1 && <>
{`${openRgbDevices.length}`}OpenRGB Devices} + {launchpadDevice !== '' && <>
1Launchpad} + } {steps[activeStep].key === 'audio' &&
@@ -321,6 +360,54 @@ export default function IntroDialog({ handleScan, scanning, setScanning }: any) />
} + {steps[activeStep].key === 'gotWled' &&
+ + + + wled + setAssistant('wled', !assistant.wled)} + style={{ fontSize: 16, paddingLeft: '0.75rem'}} + direct + /> + + + wled + setAssistant('wledSegments', !assistant.wledSegments)} + style={{ fontSize: 16, paddingLeft: '0.75rem'}} + direct + /> + + + wled + setAssistant('openRgb', !assistant.openRgb)} + style={{ fontSize: 16, paddingLeft: '0.75rem'}} + direct + /> + + + wled + setAssistant('launchpad', !assistant.launchpad)} + style={{ fontSize: 16, paddingLeft: '0.75rem'}} + direct + /> + + + + + +
} {steps[activeStep].label_left &&