Compare commits

..

No commits in common. "86e9b072bcb5bb9e0ee52df1d1a30e048084b9c7" and "9ec030488aa17b3231e7a75eff358165a299cec0" have entirely different histories.

10 changed files with 223 additions and 185 deletions

View File

@ -17,6 +17,14 @@ pub enum Border {
Right, Right,
} }
#[derive(Clone, Copy, Serialize, Deserialize, Debug)]
pub struct LedStripConfigOfBorders {
pub top: Option<LedStripConfig>,
pub bottom: Option<LedStripConfig>,
pub left: Option<LedStripConfig>,
pub right: Option<LedStripConfig>,
}
#[derive(Clone, Copy, Serialize, Deserialize, Debug)] #[derive(Clone, Copy, Serialize, Deserialize, Debug)]
pub struct LedStripConfig { pub struct LedStripConfig {
pub index: usize, pub index: usize,
@ -111,7 +119,6 @@ impl LedStripConfigGroup {
mappers.push(SamplePointMapper { mappers.push(SamplePointMapper {
start: (j + i * 4) * 30, start: (j + i * 4) * 30,
end: (j + i * 4 + 1) * 30, end: (j + i * 4 + 1) * 30,
pos: (j + i * 4) * 30,
}) })
} }
} }
@ -119,11 +126,124 @@ impl LedStripConfigGroup {
} }
} }
#[derive(Clone, Copy, Serialize, Deserialize, Debug)]
pub struct LedStripConfigOfDisplays {
pub id: u32,
pub index_of_display: usize,
pub led_strip_of_borders: LedStripConfigOfBorders,
}
impl LedStripConfigOfBorders {
pub fn default() -> Self {
Self {
top: None,
bottom: None,
left: None,
right: None,
}
}
}
impl LedStripConfigOfDisplays {
pub fn default(id: u32, index_of_display: usize) -> Self {
Self {
id,
index_of_display,
led_strip_of_borders: LedStripConfigOfBorders::default(),
}
}
pub async fn read_from_disk() -> anyhow::Result<Self> {
let path = config_dir()
.unwrap_or(current_dir().unwrap())
.join("led_strip_config_of_displays.toml");
let exists = tokio::fs::try_exists(path.clone())
.await
.map_err(|e| anyhow::anyhow!("Failed to check config file exists: {}", e))?;
if exists {
let config = tokio::fs::read_to_string(path).await?;
let config: Self = toml::from_str(&config)
.map_err(|e| anyhow::anyhow!("Failed to parse config file: {}", e))?;
Ok(config)
} else {
info!("config file not exist, fallback to default config");
Ok(Self::get_default_config().await?)
}
}
pub async fn write_to_disk(&self) -> anyhow::Result<()> {
let path = config_dir()
.unwrap_or(current_dir().unwrap())
.join("led_strip_config_of_displays.toml");
let config = toml::to_string(self).map_err(|e| {
anyhow::anyhow!("Failed to parse config file: {}. config: {:?}", e, self)
})?;
tokio::fs::write(&path, config).await.map_err(|e| {
anyhow::anyhow!("Failed to write config file: {}. path: {:?}", e, &path)
})?;
Ok(())
}
pub async fn get_default_config() -> anyhow::Result<Self> {
let displays = display_info::DisplayInfo::all().map_err(|e| {
error!("can not list display info: {}", e);
anyhow::anyhow!("can not list display info: {}", e)
})?;
let mut configs = Vec::new();
for (i, display) in displays.iter().enumerate() {
let config = Self {
id: display.id,
index_of_display: i,
led_strip_of_borders: LedStripConfigOfBorders {
top: Some(LedStripConfig {
index: i * 4 * 30,
display_id: display.id,
border: Border::Top,
start_pos: i * 4 * 30,
len: 30,
}),
bottom: Some(LedStripConfig {
index: i * 4 * 30 + 30,
display_id: display.id,
border: Border::Bottom,
start_pos: i * 4 * 30 + 30,
len: 30,
}),
left: Some(LedStripConfig {
index: i * 4 * 30 + 60,
display_id: display.id,
border: Border::Left,
start_pos: i * 4 * 30 + 60,
len: 30,
}),
right: Some(LedStripConfig {
index: i * 4 * 30 + 90,
display_id: display.id,
border: Border::Right,
start_pos: i * 4 * 30 + 90,
len: 30,
}),
},
};
configs.push(config);
}
Ok(configs[0])
}
}
#[derive(Debug, Clone, Serialize, Deserialize)] #[derive(Debug, Clone, Serialize, Deserialize)]
pub struct SamplePointMapper { pub struct SamplePointMapper {
pub start: usize, pub start: usize,
pub end: usize, pub end: usize,
pub pos: usize,
} }
#[derive(Debug, Clone, Serialize, Deserialize)] #[derive(Debug, Clone, Serialize, Deserialize)]

View File

@ -122,8 +122,7 @@ impl ConfigManager {
log::info!("mapper: {:?}", mapper); log::info!("mapper: {:?}", mapper);
} }
} }
log::info!("mapper: {:?}", config.mappers[4]);
Self::rebuild_mappers(&mut config);
let cloned_config = config.clone(); let cloned_config = config.clone();
@ -139,31 +138,17 @@ impl ConfigManager {
} }
fn rebuild_mappers(config: &mut LedStripConfigGroup) { fn rebuild_mappers(config: &mut LedStripConfigGroup) {
let mut prev_pos_end = 0; let mut prev_end = 0;
let mappers: Vec<SamplePointMapper> = config let mappers: Vec<SamplePointMapper> = config
.strips .strips
.iter() .iter()
.enumerate() .map(|strip| {
.map(|(index, strip)| {
let mapper = &config.mappers[index];
if mapper.start < mapper.end {
let mapper = SamplePointMapper { let mapper = SamplePointMapper {
start: mapper.start, start: prev_end,
end: mapper.start + strip.len, end: prev_end + strip.len,
pos: prev_pos_end,
}; };
prev_pos_end = prev_pos_end + strip.len; prev_end = mapper.end;
mapper mapper
} else {
let mapper = SamplePointMapper {
end: mapper.end,
start: mapper.end + strip.len,
pos: prev_pos_end,
};
prev_pos_end = prev_pos_end + strip.len;
mapper
}
}) })
.collect(); .collect();

View File

@ -1,6 +1,6 @@
use std::{sync::Arc, time::Duration}; use std::{sync::Arc, time::Duration};
use paris::{info, warn}; use paris::warn;
use tauri::async_runtime::{Mutex, RwLock}; use tauri::async_runtime::{Mutex, RwLock};
use tokio::{sync::watch, time::sleep}; use tokio::{sync::watch, time::sleep};
@ -8,7 +8,7 @@ use crate::{
ambient_light::{config, ConfigManager}, ambient_light::{config, ConfigManager},
rpc::MqttRpc, rpc::MqttRpc,
screenshot::Screenshot, screenshot::Screenshot,
screenshot_manager::ScreenshotManager, led_color::LedColor, screenshot_manager::ScreenshotManager,
}; };
use itertools::Itertools; use itertools::Itertools;
@ -16,10 +16,8 @@ use itertools::Itertools;
use super::{LedStripConfigGroup, SamplePointConfig}; use super::{LedStripConfigGroup, SamplePointConfig};
pub struct LedColorsPublisher { pub struct LedColorsPublisher {
sorted_colors_rx: Arc<RwLock<watch::Receiver<Vec<u8>>>>, rx: Arc<RwLock<watch::Receiver<Vec<u8>>>>,
sorted_colors_tx: Arc<RwLock<watch::Sender<Vec<u8>>>>, tx: Arc<RwLock<watch::Sender<Vec<u8>>>>,
colors_rx: Arc<RwLock<watch::Receiver<Vec<LedColor>>>>,
colors_tx: Arc<RwLock<watch::Sender<Vec<LedColor>>>>,
} }
impl LedColorsPublisher { impl LedColorsPublisher {
@ -27,29 +25,26 @@ impl LedColorsPublisher {
static LED_COLORS_PUBLISHER_GLOBAL: tokio::sync::OnceCell<LedColorsPublisher> = static LED_COLORS_PUBLISHER_GLOBAL: tokio::sync::OnceCell<LedColorsPublisher> =
tokio::sync::OnceCell::const_new(); tokio::sync::OnceCell::const_new();
let (sorted_tx, sorted_rx) = watch::channel(Vec::new());
let (tx, rx) = watch::channel(Vec::new()); let (tx, rx) = watch::channel(Vec::new());
LED_COLORS_PUBLISHER_GLOBAL LED_COLORS_PUBLISHER_GLOBAL
.get_or_init(|| async { .get_or_init(|| async {
LedColorsPublisher { LedColorsPublisher {
sorted_colors_rx: Arc::new(RwLock::new(sorted_rx)), rx: Arc::new(RwLock::new(rx)),
sorted_colors_tx: Arc::new(RwLock::new(sorted_tx)), tx: Arc::new(RwLock::new(tx)),
colors_rx: Arc::new(RwLock::new(rx)),
colors_tx: Arc::new(RwLock::new(tx)),
} }
}) })
.await .await
} }
pub fn start(&self) { pub fn start(&self) {
let sorted_colors_tx = self.sorted_colors_tx.clone(); let tx = self.tx.clone();
let colors_tx = self.colors_tx.clone();
tokio::spawn(async move { tokio::spawn(async move {
loop { loop {
let sorted_colors_tx = sorted_colors_tx.write().await; log::info!("colors update loop AAA");
let colors_tx = colors_tx.write().await;
let tx = tx.write().await;
let screenshot_manager = ScreenshotManager::global().await; let screenshot_manager = ScreenshotManager::global().await;
let config_manager = ConfigManager::global().await; let config_manager = ConfigManager::global().await;
@ -84,13 +79,13 @@ impl LedColorsPublisher {
} }
let colors = screenshot_manager let colors = screenshot_manager
.get_all_colors(&configs.sample_point_groups, &screenshots) .get_all_colors(
&configs.sample_point_groups,
&configs.mappers,
&screenshots,
)
.await; .await;
match tx.send(colors) {
let sorted_colors =
ScreenshotManager::get_sorted_colors(&colors, &configs.mappers).await;
match colors_tx.send(colors) {
Ok(_) => { Ok(_) => {
// log::info!("colors updated"); // log::info!("colors updated");
} }
@ -99,31 +94,17 @@ impl LedColorsPublisher {
} }
} }
match sorted_colors_tx.send(sorted_colors) { if some_screenshot_receiver_is_none
Ok(_) => { || config_receiver.has_changed().unwrap_or(true)
// log::info!("colors updated"); {
}
Err(_) => {
warn!("colors update failed");
}
}
if some_screenshot_receiver_is_none {
info!("some screenshot receiver is none. reload.");
sleep(Duration::from_millis(1000)).await; sleep(Duration::from_millis(1000)).await;
break; break;
} }
if config_receiver.has_changed().unwrap_or(true) {
info!("config changed. reload.");
sleep(Duration::from_millis(100)).await;
break;
}
} }
} }
}); });
let rx = self.sorted_colors_rx.clone(); let rx = self.rx.clone();
tokio::spawn(async move { tokio::spawn(async move {
let mut rx = rx.read().await.clone(); let mut rx = rx.read().await.clone();
loop { loop {
@ -155,8 +136,8 @@ impl LedColorsPublisher {
mqtt.publish_led_sub_pixels(payload).await mqtt.publish_led_sub_pixels(payload).await
} }
pub async fn clone_sorted_colors_receiver(&self) -> watch::Receiver<Vec<u8>> { pub async fn clone_receiver(&self) -> watch::Receiver<Vec<u8>> {
self.sorted_colors_rx.read().await.clone() self.rx.read().await.clone()
} }
pub async fn get_colors_configs(configs: &LedStripConfigGroup) -> AllColorConfig { pub async fn get_colors_configs(configs: &LedStripConfigGroup) -> AllColorConfig {
@ -226,10 +207,6 @@ impl LedColorsPublisher {
screenshot_receivers: local_rx_list, screenshot_receivers: local_rx_list,
}; };
} }
pub async fn clone_colors_receiver(&self) -> watch::Receiver<Vec<LedColor>> {
self.colors_rx.read().await.clone()
}
} }
pub struct AllColorConfig { pub struct AllColorConfig {

View File

@ -348,24 +348,7 @@ async fn main() {
let app_handle = app.handle().clone(); let app_handle = app.handle().clone();
tokio::spawn(async move { tokio::spawn(async move {
let publisher = ambient_light::LedColorsPublisher::global().await; let publisher = ambient_light::LedColorsPublisher::global().await;
let mut publisher_update_receiver = publisher.clone_sorted_colors_receiver().await; let mut publisher_update_receiver = publisher.clone_receiver().await;
loop {
if let Err(err) = publisher_update_receiver.changed().await {
error!("publisher update receiver changed error: {}", err);
return;
}
let publisher = publisher_update_receiver.borrow().clone();
app_handle
.emit_all("led_sorted_colors_changed", publisher)
.unwrap();
}
});
let app_handle = app.handle().clone();
tokio::spawn(async move {
let publisher = ambient_light::LedColorsPublisher::global().await;
let mut publisher_update_receiver = publisher.clone_colors_receiver().await;
loop { loop {
if let Err(err) = publisher_update_receiver.changed().await { if let Err(err) = publisher_update_receiver.changed().await {
error!("publisher update receiver changed error: {}", err); error!("publisher update receiver changed error: {}", err);

View File

@ -10,7 +10,7 @@ use tokio::sync::{watch, OnceCell};
use crate::{ use crate::{
ambient_light::{SamplePointConfig, SamplePointMapper}, ambient_light::{SamplePointConfig, SamplePointMapper},
screenshot::{LedSamplePoints, ScreenSamplePoints, Screenshot, ScreenshotPayload}, led_color::LedColor, screenshot::{LedSamplePoints, ScreenSamplePoints, Screenshot, ScreenshotPayload},
}; };
pub fn take_screenshot(display_id: u32, scale_factor: f32) -> anyhow::Result<Screenshot> { pub fn take_screenshot(display_id: u32, scale_factor: f32) -> anyhow::Result<Screenshot> {
@ -218,9 +218,14 @@ impl ScreenshotManager {
pub async fn get_all_colors( pub async fn get_all_colors(
&self, &self,
configs: &Vec<SamplePointConfig>, configs: &Vec<SamplePointConfig>,
mappers: &Vec<SamplePointMapper>,
screenshots: &Vec<Screenshot>, screenshots: &Vec<Screenshot>,
) -> Vec<LedColor> { ) -> Vec<u8> {
let total_leds = configs
.iter()
.fold(0, |acc, config| acc + config.points.len());
let mut global_colors = vec![0u8; total_leds * 3];
let mut all_colors = vec![]; let mut all_colors = vec![];
for (index, screenshot) in screenshots.iter().enumerate() { for (index, screenshot) in screenshots.iter().enumerate() {
@ -230,42 +235,20 @@ impl ScreenshotManager {
all_colors.append(&mut colors); all_colors.append(&mut colors);
} }
all_colors
}
pub async fn get_sorted_colors(colors: &Vec<LedColor>, mappers: &Vec<SamplePointMapper>) -> Vec<u8> {
let total_leds = mappers
.iter()
.map(|mapper| usize::max(mapper.start, mapper.end))
.max()
.unwrap_or(0) as usize;
let mut global_colors = vec![0u8; total_leds * 3];
let mut color_index = 0; let mut color_index = 0;
mappers.iter().for_each(|group| { mappers.iter().for_each(|group| {
if group.end > global_colors.len() || group.start > global_colors.len() { if group.end > all_colors.len() || group.start > all_colors.len() {
warn!( warn!(
"get_sorted_colors: group out of range. start: {}, end: {}, global_colors.len(): {}", "get_all_colors: group out of range. start: {}, end: {}, all_colors.len(): {}",
group.start, group.start,
group.end, group.end,
global_colors.len() all_colors.len()
); );
return; return;
} }
if color_index + group.start.abs_diff(group.end) > colors.len() {
warn!(
"get_sorted_colors: color_index out of range. color_index: {}, strip len: {}, colors.len(): {}",
color_index,
group.start.abs_diff(group.end),
colors.len()
);
return;
}
if group.end > group.start { if group.end > group.start {
for i in group.start..group.end { for i in group.start..group.end {
let rgb = colors[color_index].get_rgb(); let rgb = all_colors[color_index].get_rgb();
color_index += 1; color_index += 1;
global_colors[i * 3] = rgb[0]; global_colors[i * 3] = rgb[0];
@ -274,7 +257,7 @@ impl ScreenshotManager {
} }
} else { } else {
for i in (group.end..group.start).rev() { for i in (group.end..group.start).rev() {
let rgb = colors[color_index].get_rgb(); let rgb = all_colors[color_index].get_rgb();
color_index += 1; color_index += 1;
global_colors[i * 3] = rgb[0]; global_colors[i * 3] = rgb[0];

View File

@ -44,7 +44,7 @@ function App() {
// listen to led_colors_changed event // listen to led_colors_changed event
createEffect(() => { createEffect(() => {
const unlisten = listen<Array<string>>('led_colors_changed', (event) => { const unlisten = listen<Uint8ClampedArray>('led_colors_changed', (event) => {
const colors = event.payload; const colors = event.payload;
setLedStripStore({ setLedStripStore({
@ -57,21 +57,6 @@ function App() {
}); });
}); });
// listen to led_sorted_colors_changed event
createEffect(() => {
const unlisten = listen<Uint8ClampedArray>('led_sorted_colors_changed', (event) => {
const sortedColors = event.payload;
setLedStripStore({
sortedColors,
});
});
onCleanup(() => {
unlisten.then((unlisten) => unlisten());
});
});
const [ledStripConfiguration, setLedStripConfiguration] = createStore< const [ledStripConfiguration, setLedStripConfiguration] = createStore<
LedStripConfigurationContextType[0] LedStripConfigurationContextType[0]
>({ >({

View File

@ -16,7 +16,6 @@ import { useTippy } from 'solid-tippy';
import { followCursor } from 'tippy.js'; import { followCursor } from 'tippy.js';
import { LedStripConfig } from '../models/led-strip-config'; import { LedStripConfig } from '../models/led-strip-config';
import { LedStripConfigurationContext } from '../contexts/led-strip-configuration.context'; import { LedStripConfigurationContext } from '../contexts/led-strip-configuration.context';
import { ledStripStore } from '../stores/led-strip.store';
type LedStripPartProps = { type LedStripPartProps = {
config?: LedStripConfig | null; config?: LedStripConfig | null;
@ -56,31 +55,44 @@ export const LedStripPart: Component<LedStripPartProps> = (props) => {
const [ledSamplePoints, setLedSamplePoints] = createSignal(); const [ledSamplePoints, setLedSamplePoints] = createSignal();
const [colors, setColors] = createSignal<string[]>([]); const [colors, setColors] = createSignal<string[]>([]);
// update led strip colors from global store // get led strip colors when screenshot updated
createEffect(() => { createEffect(() => {
if (!localProps.config) { const samplePoints = ledSamplePoints();
if (!localProps.config || !samplePoints) {
return; return;
} }
const index = ledStripStore.strips.findIndex( let pendingCount = 0;
(s) => const unlisten = listen<{
s.display_id === localProps.config!.display_id && base64_image: string;
s.border === localProps.config!.border, display_id: number;
); height: number;
width: number;
if (index === -1) { }>('encoded-screenshot-updated', (event) => {
if (event.payload.display_id !== localProps.config!.display_id) {
return; return;
} }
if (pendingCount >= 1) {
const mapper = ledStripStore.mappers[index];
if (!mapper) {
return; return;
} }
pendingCount++;
const offset = mapper.pos; invoke<string[]>('get_one_edge_colors', {
samplePoints,
const colors = ledStripStore.colors.slice(offset, offset + localProps.config.len); displayId: event.payload.display_id,
})
.then((colors) => {
setColors(colors); setColors(colors);
})
.finally(() => {
pendingCount--;
});
});
subscribeScreenshotUpdate(localProps.config.display_id);
onCleanup(() => {
unlisten.then((unlisten) => unlisten());
});
}); });
// get led strip sample points // get led strip sample points

View File

@ -12,18 +12,21 @@ import { LedStripConfig, LedStripPixelMapper } from '../models/led-strip-config'
import { ledStripStore } from '../stores/led-strip.store'; import { ledStripStore } from '../stores/led-strip.store';
import { invoke } from '@tauri-apps/api'; import { invoke } from '@tauri-apps/api';
import { LedStripConfigurationContext } from '../contexts/led-strip-configuration.context'; import { LedStripConfigurationContext } from '../contexts/led-strip-configuration.context';
import background from '../assets/transparent-grid-background.svg?url';
const SorterItem: Component<{ strip: LedStripConfig; mapper: LedStripPixelMapper }> = ( const SorterItem: Component<{ strip: LedStripConfig; mapper: LedStripPixelMapper }> = (
props, props,
) => { ) => {
const [fullLeds, setFullLeds] = createSignal<Array<string | null>>([]); const [fullLeds, setFullLeds] = createSignal<string[]>([]);
const [dragging, setDragging] = createSignal<boolean>(false); const [dragging, setDragging] = createSignal<boolean>(false);
const [dragStart, setDragStart] = createSignal<{ x: number; y: number } | null>(null); const [dragStart, setDragStart] = createSignal<{ x: number; y: number } | null>(null);
const [dragCurr, setDragCurr] = createSignal<{ x: number; y: number } | null>(null); const [dragCurr, setDragCurr] = createSignal<{ x: number; y: number } | null>(null);
const [dragStartIndex, setDragStartIndex] = createSignal<number>(0); const [dragStartIndex, setDragStartIndex] = createSignal<number>(0);
const [, { setSelectedStripPart }] = useContext(LedStripConfigurationContext); const [, { setSelectedStripPart }] = useContext(LedStripConfigurationContext);
const totalLedCount = createMemo(() => {
return ledStripStore.strips.reduce((acc, strip) => acc + strip.len, 0);
});
const move = (targetStart: number) => { const move = (targetStart: number) => {
if (targetStart === props.mapper.start) { if (targetStart === props.mapper.start) {
return; return;
@ -67,8 +70,7 @@ const SorterItem: Component<{ strip: LedStripConfig; mapper: LedStripPixelMapper
} }
setDragCurr({ x: ev.clientX, y: ev.clientY }); setDragCurr({ x: ev.clientX, y: ev.clientY });
const cellWidth = const cellWidth = (ev.currentTarget as HTMLDivElement).clientWidth / totalLedCount();
(ev.currentTarget as HTMLDivElement).clientWidth / ledStripStore.totalLedCount;
const diff = ev.clientX - dragStart()!.x; const diff = ev.clientX - dragStart()!.x;
const moved = Math.round(diff / cellWidth); const moved = Math.round(diff / cellWidth);
if (moved === 0) { if (moved === 0) {
@ -83,14 +85,12 @@ const SorterItem: Component<{ strip: LedStripConfig; mapper: LedStripPixelMapper
// update fullLeds // update fullLeds
createEffect(() => { createEffect(() => {
const fullLeds = new Array(ledStripStore.totalLedCount).fill(null); const fullLeds = new Array(totalLedCount()).fill('rgba(255,255,255,0.5)');
for ( for (let i = props.mapper.start, j = 0; i < props.mapper.end; i++, j++) {
let i = props.mapper.start, j = props.mapper.pos; fullLeds[i] = `rgb(${ledStripStore.colors[i * 3]}, ${
i < props.mapper.end; ledStripStore.colors[i * 3 + 1]
i++, j++ }, ${ledStripStore.colors[i * 3 + 2]})`;
) {
fullLeds[i] = ledStripStore.colors[j];
} }
setFullLeds(fullLeds); setFullLeds(fullLeds);
}); });
@ -114,12 +114,11 @@ const SorterItem: Component<{ strip: LedStripConfig; mapper: LedStripPixelMapper
{(it) => ( {(it) => (
<div <div
class="flex-auto flex h-full w-full justify-center items-center relative" class="flex-auto flex h-full w-full justify-center items-center relative"
title={it ?? ''} title={it}
> >
<div <div
class="absolute top-1/2 -translate-y-1/2 h-2.5 w-2.5 rounded-full ring-1 ring-stone-100" class="absolute top-1/2 -translate-y-1/2 h-2.5 w-2.5 rounded-full ring-1 ring-stone-300"
classList={{ 'ring-stone-300/50': !it }} style={{ background: it }}
style={{ background: it ?? 'transparent' }}
/> />
</div> </div>
)} )}
@ -132,13 +131,15 @@ const SorterResult: Component = () => {
const [fullLeds, setFullLeds] = createSignal<string[]>([]); const [fullLeds, setFullLeds] = createSignal<string[]>([]);
createEffect(() => { createEffect(() => {
const fullLeds = new Array(ledStripStore.totalLedCount).fill('rgba(255,255,255,0.1)'); const strips = ledStripStore.strips;
const totalLedCount = strips.reduce((acc, strip) => acc + strip.len, 0);
const fullLeds = new Array(totalLedCount).fill('rgba(255,255,255,0.5)');
ledStripStore.mappers.forEach((mapper) => { ledStripStore.mappers.forEach((mapper) => {
for (let i = mapper.start, j = 0; i < mapper.end; i++, j++) { for (let i = mapper.start, j = 0; i < mapper.end; i++, j++) {
fullLeds[i] = `rgb(${ledStripStore.sortedColors[i * 3]}, ${ fullLeds[i] = `rgb(${ledStripStore.colors[i * 3]}, ${
ledStripStore.sortedColors[i * 3 + 1] ledStripStore.colors[i * 3 + 1]
}, ${ledStripStore.sortedColors[i * 3 + 2]})`; }, ${ledStripStore.colors[i * 3 + 2]})`;
} }
}); });
setFullLeds(fullLeds); setFullLeds(fullLeds);
@ -167,12 +168,7 @@ export const LedStripPartsSorter: Component = () => {
const context = createContext(); const context = createContext();
return ( return (
<div <div class="select-none overflow-hidden">
class="select-none overflow-hidden"
style={{
'background-image': `url(${background})`,
}}
>
<SorterResult /> <SorterResult />
<For each={ledStripStore.strips}> <For each={ledStripStore.strips}>
{(strip, index) => ( {(strip, index) => (

View File

@ -3,7 +3,6 @@ import { Borders } from '../constants/border';
export type LedStripPixelMapper = { export type LedStripPixelMapper = {
start: number; start: number;
end: number; end: number;
pos: number;
}; };
export type LedStripConfigContainer = { export type LedStripConfigContainer = {

View File

@ -1,12 +1,10 @@
import { createStore } from 'solid-js/store'; import { createStore } from 'solid-js/store';
import { DisplayConfig } from '../models/display-config';
import { LedStripConfig, LedStripPixelMapper } from '../models/led-strip-config'; import { LedStripConfig, LedStripPixelMapper } from '../models/led-strip-config';
export const [ledStripStore, setLedStripStore] = createStore({ export const [ledStripStore, setLedStripStore] = createStore({
displays: new Array<DisplayConfig>(),
strips: new Array<LedStripConfig>(), strips: new Array<LedStripConfig>(),
mappers: new Array<LedStripPixelMapper>(), mappers: new Array<LedStripPixelMapper>(),
colors: new Array<string>(), colors: new Uint8ClampedArray(),
sortedColors: new Uint8ClampedArray(),
get totalLedCount() {
return Math.max(0, ...ledStripStore.mappers.map((m) => Math.max(m.start, m.end)));
},
}); });