dyna3/app-proto/sketch-outline/src/app.rs

use nalgebra::DVector;
use sycamore::{prelude::*, web::tags::div};

#[derive(Clone, PartialEq)]
struct Element {
    id: String,
    label: String,
    color: [f32; 3],
    rep: DVector<f64>,
}

struct AppState {
    elements: Signal<Vec<Element>>
}

#[component]
pub fn App() -> View {
    let state = AppState {
        elements: create_signal(vec![
            Element {
                id: String::from("central"),
                label: String::from("Central"),
                color: [0.75_f32, 0.75_f32, 0.75_f32],
                rep: DVector::<f64>::from_column_slice(&[0.0, 0.0, 0.0, 0.25, -1.0])
            },
            Element {
                id: String::from("wing_a"),
                label: String::from("Wing A"),
                color: [1.00_f32, 0.25_f32, 0.00_f32],
                rep: DVector::<f64>::from_column_slice(&[0.5, 0.5, 0.0, 0.5, -0.25])
            },
            Element {
                id: String::from("wing_b"),
                label: String::from("Wing B"),
                color: [1.00_f32, 0.25_f32, 0.00_f32],
                rep: DVector::<f64>::from_column_slice(&[-0.5, -0.5, 0.0, 0.5, -0.25])
            }
        ])
    };
    
    view! {
        ul {
            Keyed(
                list=state.elements,
                view=|elt| {
                    let label = elt.label.clone();
                    let rep_components = elt.rep.iter().map(
                        |u| View::from(div().children(u.to_string().replace("-", "\u{2212}")))
                    ).collect::<Vec<_>>();
                    view! {
                        li {
                            div(class="elt-label") { (label) }
                            div(class="elt-rep") { (rep_components) }
                        }
                    }
                },
                key=|elt| elt.id.clone()
            )
        }
    }
}