From 1881d62c561a1a9e9a6783e715ee2d4311dcf8f7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Kav=C3=ADk?= Date: Sun, 9 Jun 2024 22:53:02 +0200 Subject: [PATCH] set_var_format --- frontend/src/platform.rs | 3 +- frontend/src/platform/browser.rs | 8 ++-- frontend/src/platform/tauri.rs | 14 ++++-- frontend/src/waveform_panel.rs | 31 ++++++++++-- frontend/src/waveform_panel/pixi_canvas.rs | 16 +++++-- frontend/typescript/bundles/pixi_canvas.js | 30 ++++++++++-- frontend/typescript/bundles/tauri_glue.js | 4 +- .../typescript/pixi_canvas/pixi_canvas.ts | 47 ++++++++++++++++--- frontend/typescript/tauri_glue/tauri_glue.ts | 10 +++- shared/src/var_format.rs | 9 +++- src-tauri/src/lib.rs | 8 ++-- 11 files changed, 145 insertions(+), 35 deletions(-) diff --git a/frontend/src/platform.rs b/frontend/src/platform.rs index 7e60fd9..967468e 100644 --- a/frontend/src/platform.rs +++ b/frontend/src/platform.rs @@ -33,8 +33,9 @@ pub async fn load_signal_and_get_timeline( signal_ref: wellen::SignalRef, screen_width: u32, block_height: u32, + var_format: shared::VarFormat, ) -> shared::Timeline { - platform::load_signal_and_get_timeline(signal_ref, screen_width, block_height).await + platform::load_signal_and_get_timeline(signal_ref, screen_width, block_height, var_format).await } pub async fn unload_signal(signal_ref: wellen::SignalRef) { diff --git a/frontend/src/platform/browser.rs b/frontend/src/platform/browser.rs index dfd4041..8192d25 100644 --- a/frontend/src/platform/browser.rs +++ b/frontend/src/platform/browser.rs @@ -78,13 +78,14 @@ pub(super) async fn load_signal_and_get_timeline( signal_ref: wellen::SignalRef, screen_width: u32, block_height: u32, + var_format: shared::VarFormat, ) -> shared::Timeline { let mut waveform_lock = STORE.waveform.lock().unwrap(); let waveform = waveform_lock.as_mut().unwrap(); waveform.load_signals_multi_threaded(&[signal_ref]); let signal = waveform.get_signal(signal_ref).unwrap(); let time_table = waveform.time_table(); - let timeline = signal_to_timeline(signal, time_table, screen_width, block_height); + let timeline = signal_to_timeline(signal, time_table, screen_width, block_height, var_format); timeline } @@ -100,11 +101,12 @@ fn signal_to_timeline( time_table: &[wellen::Time], screen_width: u32, block_height: u32, + var_format: shared::VarFormat, ) -> shared::Timeline { const MIN_BLOCK_WIDTH: u32 = 3; // Courier New, 16px, sync with `label_style` in `pixi_canvas.rs` const LETTER_WIDTH: f64 = 9.61; - const LETTER_HEIGHT: u32 = 21; + const LETTER_HEIGHT: u32 = 18; const LABEL_X_PADDING: u32 = 10; let Some(last_time) = time_table.last().copied() else { @@ -139,7 +141,7 @@ fn signal_to_timeline( } // @TODO cache? - let value = shared::VarFormat::default().format(value); + let value = var_format.format(value); let value_width = (value.chars().count() as f64 * LETTER_WIDTH) as u32; // @TODO Ellipsis instead of hiding? diff --git a/frontend/src/platform/tauri.rs b/frontend/src/platform/tauri.rs index 853dc4a..e376506 100644 --- a/frontend/src/platform/tauri.rs +++ b/frontend/src/platform/tauri.rs @@ -21,11 +21,18 @@ pub(super) async fn load_signal_and_get_timeline( signal_ref: wellen::SignalRef, screen_width: u32, block_height: u32, + var_format: shared::VarFormat, ) -> shared::Timeline { + let var_format = serde_wasm_bindgen::to_value(&var_format).unwrap_throw(); serde_wasm_bindgen::from_value( - tauri_glue::load_signal_and_get_timeline(signal_ref.index(), screen_width, block_height) - .await - .unwrap_throw(), + tauri_glue::load_signal_and_get_timeline( + signal_ref.index(), + screen_width, + block_height, + var_format, + ) + .await + .unwrap_throw(), ) .unwrap_throw() } @@ -56,6 +63,7 @@ mod tauri_glue { signal_ref_index: usize, screen_width: u32, block_height: u32, + var_format: JsValue, ) -> Result; #[wasm_bindgen(catch)] diff --git a/frontend/src/waveform_panel.rs b/frontend/src/waveform_panel.rs index 87e74ad..0548f2a 100644 --- a/frontend/src/waveform_panel.rs +++ b/frontend/src/waveform_panel.rs @@ -13,6 +13,7 @@ const ROW_GAP: u32 = 4; pub struct WaveformPanel { selected_var_refs: MutableVec, hierarchy: Mutable>>, + canvas_controller: Mutable>>, } impl WaveformPanel { @@ -23,6 +24,7 @@ impl WaveformPanel { Self { selected_var_refs, hierarchy, + canvas_controller: Mutable::new(Mutable::default().read_only()), } .root() } @@ -54,11 +56,13 @@ impl WaveformPanel { fn canvas(&self, selected_vars_panel_height: ReadOnlyMutable) -> impl Element { let selected_var_refs = self.selected_var_refs.clone(); let hierarchy = self.hierarchy.clone(); + let canvas_controller = self.canvas_controller.clone(); PixiCanvas::new(ROW_HEIGHT, ROW_GAP) .s(Align::new().top()) .s(Width::fill()) .s(Height::exact_signal(selected_vars_panel_height.signal())) .task_with_controller(move |controller| { + canvas_controller.set(controller.clone()); selected_var_refs.signal_vec().delay_remove(clone!((hierarchy) move |var_ref| { clone!((var_ref, hierarchy) async move { if let Some(hierarchy) = hierarchy.get_cloned() { @@ -112,12 +116,15 @@ impl WaveformPanel { ) { let hierarchy = hierarchy.get_cloned().unwrap(); + let var_format = shared::VarFormat::default(); + let var = hierarchy.get(var_ref); let signal_ref = var.signal_ref(); let timeline = platform::load_signal_and_get_timeline( signal_ref, controller.screen_width(), ROW_HEIGHT, + var_format, ) .await; @@ -128,7 +135,8 @@ impl WaveformPanel { // Note: Sync `timeline`'s type with the `Timeline` in `frontend/typescript/pixi_canvas/pixi_canvas.ts' let timeline = serde_wasm_bindgen::to_value(&timeline).unwrap_throw(); let signal_ref_index = signal_ref.index(); - controller.push_var(signal_ref_index, timeline); + let var_format = serde_wasm_bindgen::to_value(&var_format).unwrap_throw(); + controller.push_var(signal_ref_index, timeline, var_format); } fn selected_var_panel( @@ -141,8 +149,8 @@ impl WaveformPanel { }; let var = hierarchy.get(var_ref); Row::new() - .item(self.selected_var_name_button(var.name(&hierarchy), index)) - .item(self.selected_var_format_button()) + .item(self.selected_var_name_button(var.name(&hierarchy), index.clone())) + .item(self.selected_var_format_button(index)) .apply(Some) } @@ -174,9 +182,10 @@ impl WaveformPanel { }) } - fn selected_var_format_button(&self) -> impl Element { + fn selected_var_format_button(&self, index: ReadOnlyMutable>) -> impl Element { let var_format = Mutable::new(shared::VarFormat::default()); let (hovered, hovered_signal) = Mutable::new_and_signal(false); + let canvas_controller = self.canvas_controller.clone(); Button::new() .s(Height::exact(ROW_HEIGHT)) .s(Width::exact(70)) @@ -191,6 +200,18 @@ impl WaveformPanel { .child_signal(var_format.signal().map(|format| format.as_static_str())), ) .on_hovered_change(move |is_hovered| hovered.set_neq(is_hovered)) - .on_press(move || var_format.update(|format| format.next())) + .on_press(move || { + let next_format = var_format.get().next(); + var_format.set(next_format); + if let Some(canvas_controller) = canvas_controller.get_cloned().lock_ref().as_ref() + { + if let Some(index) = index.get() { + canvas_controller.set_var_format( + index, + serde_wasm_bindgen::to_value(&next_format).unwrap_throw(), + ); + } + } + }) } } diff --git a/frontend/src/waveform_panel/pixi_canvas.rs b/frontend/src/waveform_panel/pixi_canvas.rs index 95f6eb8..f577110 100644 --- a/frontend/src/waveform_panel/pixi_canvas.rs +++ b/frontend/src/waveform_panel/pixi_canvas.rs @@ -52,13 +52,14 @@ impl PixiCanvas { let task_with_controller = Mutable::new(None); // -- FastWave-specific -- let timeline_getter = Rc::new(Closure::new( - |signal_ref_index, screen_width, row_height| { + |signal_ref_index, screen_width, row_height, var_format| { future_to_promise(async move { let signal_ref = wellen::SignalRef::from_index(signal_ref_index).unwrap_throw(); let timeline = platform::load_signal_and_get_timeline( signal_ref, screen_width, row_height, + serde_wasm_bindgen::from_value(var_format).unwrap_throw(), ) .await; let timeline = serde_wasm_bindgen::to_value(&timeline).unwrap_throw(); @@ -114,8 +115,9 @@ mod js_bridge { type SignalRefIndex = usize; type ScreenWidth = u32; type RowHeight = u32; + type VarFormatJs = JsValue; type TimelineGetter = - Closure TimelinePromise>; + Closure TimelinePromise>; // Note: Add all corresponding methods to `frontend/typescript/pixi_canvas/pixi_canvas.ts` #[wasm_bindgen(module = "/typescript/bundles/pixi_canvas.js")] @@ -145,11 +147,19 @@ mod js_bridge { // -- FastWave-specific -- + #[wasm_bindgen(method)] + pub fn set_var_format(this: &PixiController, index: usize, var_format: JsValue); + #[wasm_bindgen(method)] pub fn remove_var(this: &PixiController, index: usize); #[wasm_bindgen(method)] - pub fn push_var(this: &PixiController, signal_ref_index: usize, timeline: JsValue); + pub fn push_var( + this: &PixiController, + signal_ref_index: usize, + timeline: JsValue, + var_format: JsValue, + ); #[wasm_bindgen(method)] pub fn pop_var(this: &PixiController); diff --git a/frontend/typescript/bundles/pixi_canvas.js b/frontend/typescript/bundles/pixi_canvas.js index c253d19..3291b1f 100644 --- a/frontend/typescript/bundles/pixi_canvas.js +++ b/frontend/typescript/bundles/pixi_canvas.js @@ -35156,7 +35156,7 @@ var PixiController = class { const width_changed = width !== this.previous_parent_width; this.previous_parent_width = width; if (width_changed) { - await this.redraw_rows(); + await this.redraw_all_rows(); } } destroy() { @@ -35175,20 +35175,35 @@ var PixiController = class { return this.app.screen.width; } // -- FastWave-specific -- - async redraw_rows() { + async redraw_all_rows() { await Promise.all(this.var_signal_rows.map(async (row) => { - const timeline = await this.timeline_getter(row.signal_ref_index, this.app.screen.width, this.row_height); + const timeline = await this.timeline_getter(row.signal_ref_index, this.app.screen.width, this.row_height, row.var_format); row.redraw(timeline); })); } + async redraw_row(index) { + const row = this.var_signal_rows[index]; + if (typeof row !== "undefined") { + const timeline = await this.timeline_getter(row.signal_ref_index, this.app.screen.width, this.row_height, row.var_format); + row.redraw(timeline); + } + } + async set_var_format(index, var_format) { + const row = this.var_signal_rows[index]; + if (typeof row !== "undefined") { + row.set_var_format(var_format); + this.redraw_row(index); + } + } remove_var(index) { if (typeof this.var_signal_rows[index] !== "undefined") { this.var_signal_rows[index].destroy(); } } - push_var(signal_ref_index, timeline) { + push_var(signal_ref_index, timeline, var_format) { new VarSignalRow( signal_ref_index, + var_format, timeline, this.app, this.var_signal_rows, @@ -35206,6 +35221,7 @@ var PixiController = class { }; var VarSignalRow = class { signal_ref_index; + var_format; timeline; app; owner; @@ -35223,8 +35239,9 @@ var VarSignalRow = class { fontSize: 16, fontFamily: '"Courier New", monospace' }); - constructor(signal_ref_index, timeline, app, owner, rows_container, row_height, row_gap) { + constructor(signal_ref_index, var_format, timeline, app, owner, rows_container, row_height, row_gap) { this.signal_ref_index = signal_ref_index; + this.var_format = var_format; this.timeline = timeline; this.app = app; this.row_height = row_height; @@ -35244,6 +35261,9 @@ var VarSignalRow = class { this.row_container.addChild(this.signal_blocks_container); this.draw(); } + set_var_format(var_format) { + this.var_format = var_format; + } redraw(timeline) { this.timeline = timeline; this.draw(); diff --git a/frontend/typescript/bundles/tauri_glue.js b/frontend/typescript/bundles/tauri_glue.js index 9bb4b24..c4cf8f8 100644 --- a/frontend/typescript/bundles/tauri_glue.js +++ b/frontend/typescript/bundles/tauri_glue.js @@ -2520,8 +2520,8 @@ async function pick_and_load_waveform() { async function get_hierarchy() { return await invoke2("get_hierarchy"); } -async function load_signal_and_get_timeline(signal_ref_index, screen_width, block_height) { - return await invoke2("load_signal_and_get_timeline", { signal_ref_index, screen_width, block_height }); +async function load_signal_and_get_timeline(signal_ref_index, screen_width, block_height, var_format) { + return await invoke2("load_signal_and_get_timeline", { signal_ref_index, screen_width, block_height, var_format }); } async function unload_signal(signal_ref_index) { return await invoke2("unload_signal", { signal_ref_index }); diff --git a/frontend/typescript/pixi_canvas/pixi_canvas.ts b/frontend/typescript/pixi_canvas/pixi_canvas.ts index 390ac21..021dee9 100644 --- a/frontend/typescript/pixi_canvas/pixi_canvas.ts +++ b/frontend/typescript/pixi_canvas/pixi_canvas.ts @@ -16,7 +16,18 @@ type TimeLineBlockLabel = { y: number, } -type TimelineGetter = (signal_ref_index: number, screen_width: number, row_height: number) => Promise; +// @TODO sync with Rust +enum VarFormat { + ASCII, + Binary, + BinaryWithGroups, + Hexadecimal, + Octal, + Signed, + Unsigned, +} + +type TimelineGetter = (signal_ref_index: number, screen_width: number, row_height: number, var_format: VarFormat) => Promise; export class PixiController { app: Application @@ -26,7 +37,7 @@ export class PixiController { row_height: number; row_gap: number; previous_parent_width: number | null; - timeline_getter: TimelineGetter + timeline_getter: TimelineGetter; constructor(row_height: number, row_gap: number, timeline_getter: TimelineGetter) { this.app = new Application(); @@ -51,7 +62,7 @@ export class PixiController { const width_changed = width !== this.previous_parent_width; this.previous_parent_width = width; if (width_changed) { - await this.redraw_rows(); + await this.redraw_all_rows(); } } @@ -74,22 +85,39 @@ export class PixiController { // -- FastWave-specific -- - async redraw_rows() { + async redraw_all_rows() { await Promise.all(this.var_signal_rows.map(async row => { - const timeline = await this.timeline_getter(row.signal_ref_index, this.app.screen.width, this.row_height); + const timeline = await this.timeline_getter(row.signal_ref_index, this.app.screen.width, this.row_height, row.var_format); row.redraw(timeline); })) } + async redraw_row(index: number) { + const row = this.var_signal_rows[index]; + if (typeof row !== 'undefined') { + const timeline = await this.timeline_getter(row.signal_ref_index, this.app.screen.width, this.row_height, row.var_format); + row.redraw(timeline); + } + } + + async set_var_format(index: number, var_format: VarFormat) { + const row = this.var_signal_rows[index]; + if (typeof row !== 'undefined') { + row.set_var_format(var_format); + this.redraw_row(index); + } + } + remove_var(index: number) { if (typeof this.var_signal_rows[index] !== 'undefined') { this.var_signal_rows[index].destroy(); } } - push_var(signal_ref_index: number, timeline: Timeline) { + push_var(signal_ref_index: number, timeline: Timeline, var_format: VarFormat) { new VarSignalRow( signal_ref_index, + var_format, timeline, this.app, this.var_signal_rows, @@ -110,6 +138,7 @@ export class PixiController { class VarSignalRow { signal_ref_index: number; + var_format: VarFormat; timeline: Timeline; app: Application; owner: Array; @@ -130,6 +159,7 @@ class VarSignalRow { constructor( signal_ref_index: number, + var_format: VarFormat, timeline: Timeline, app: Application, owner: Array, @@ -138,6 +168,7 @@ class VarSignalRow { row_gap: number, ) { this.signal_ref_index = signal_ref_index; + this.var_format = var_format; this.timeline = timeline; this.app = app; @@ -168,6 +199,10 @@ class VarSignalRow { this.draw(); } + set_var_format(var_format: VarFormat) { + this.var_format = var_format; + } + redraw(timeline: Timeline) { this.timeline = timeline; this.draw(); diff --git a/frontend/typescript/tauri_glue/tauri_glue.ts b/frontend/typescript/tauri_glue/tauri_glue.ts index f686f6c..7231c40 100644 --- a/frontend/typescript/tauri_glue/tauri_glue.ts +++ b/frontend/typescript/tauri_glue/tauri_glue.ts @@ -9,6 +9,7 @@ type WellenHierarchy = unknown; type WellenTimeTable = unknown; type WellenSignal = unknown; type Timeline = unknown; +type VarFormat = unknown; export async function show_window(): Promise { return await invoke("show_window"); @@ -22,8 +23,13 @@ export async function get_hierarchy(): Promise { return await invoke("get_hierarchy"); } -export async function load_signal_and_get_timeline(signal_ref_index: number, screen_width: number, block_height: number): Promise { - return await invoke("load_signal_and_get_timeline", { signal_ref_index, screen_width, block_height }); +export async function load_signal_and_get_timeline( + signal_ref_index: number, + screen_width: number, + block_height: number, + var_format: VarFormat, +): Promise { + return await invoke("load_signal_and_get_timeline", { signal_ref_index, screen_width, block_height, var_format }); } export async function unload_signal(signal_ref_index: number): Promise { diff --git a/shared/src/var_format.rs b/shared/src/var_format.rs index 4f9a51c..dc1d844 100644 --- a/shared/src/var_format.rs +++ b/shared/src/var_format.rs @@ -1,4 +1,7 @@ -#[derive(Default, Clone, Copy, Debug)] +use moonlight::*; + +#[derive(Default, Clone, Copy, Debug, Serialize, Deserialize)] +#[serde(crate = "serde")] pub enum VarFormat { ASCII, Binary, @@ -55,12 +58,14 @@ impl VarFormat { } VarFormat::Binary => value, VarFormat::BinaryWithGroups => { + let char_count = value.len(); value .chars() .enumerate() .fold(String::new(), |mut value, (index, one_or_zero)| { value.push(one_or_zero); - if (index + 1) % 4 == 0 { + let is_last = index == char_count - 1; + if !is_last && (index + 1) % 4 == 0 { value.push(' '); } value diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs index c51649b..2417b81 100644 --- a/src-tauri/src/lib.rs +++ b/src-tauri/src/lib.rs @@ -44,6 +44,7 @@ async fn load_signal_and_get_timeline( signal_ref_index: usize, screen_width: u32, block_height: u32, + var_format: shared::VarFormat, store: tauri::State<'_, Store>, ) -> Result { // @TODO run (all?) in a blocking thread? @@ -53,7 +54,7 @@ async fn load_signal_and_get_timeline( waveform.load_signals_multi_threaded(&[signal_ref]); let signal = waveform.get_signal(signal_ref).unwrap(); let time_table = waveform.time_table(); - let timeline = signal_to_timeline(signal, time_table, screen_width, block_height); + let timeline = signal_to_timeline(signal, time_table, screen_width, block_height, var_format); Ok(serde_json::to_value(timeline).unwrap()) } @@ -94,11 +95,12 @@ fn signal_to_timeline( time_table: &[wellen::Time], screen_width: u32, block_height: u32, + var_format: shared::VarFormat, ) -> shared::Timeline { const MIN_BLOCK_WIDTH: u32 = 3; // Courier New, 16px, sync with `label_style` in `pixi_canvas.rs` const LETTER_WIDTH: f64 = 9.61; - const LETTER_HEIGHT: u32 = 21; + const LETTER_HEIGHT: u32 = 18; const LABEL_X_PADDING: u32 = 10; let Some(last_time) = time_table.last().copied() else { @@ -133,7 +135,7 @@ fn signal_to_timeline( } // @TODO cache? - let value = shared::VarFormat::default().format(value); + let value = var_format.format(value); let value_width = (value.chars().count() as f64 * LETTER_WIDTH) as u32; // @TODO Ellipsis instead of hiding?