diff --git a/src/components/global.css b/assets/css/global.css
similarity index 100%
rename from src/components/global.css
rename to assets/css/global.css
diff --git a/src/components/plates/plate.css b/assets/css/plate.css
similarity index 100%
rename from src/components/plates/plate.css
rename to assets/css/plate.css
diff --git a/src/components/plates/plate_container.css b/assets/css/plate_container.css
similarity index 100%
rename from src/components/plates/plate_container.css
rename to assets/css/plate_container.css
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..db6c305
--- /dev/null
+++ b/index.html
@@ -0,0 +1,10 @@
+
+
+
+
+
+
+
+ Yew App
+
+
diff --git a/src/components/main_window.rs b/src/components/main_window.rs
index 9eb47f1..0624f1c 100644
--- a/src/components/main_window.rs
+++ b/src/components/main_window.rs
@@ -1,22 +1,17 @@
#![allow(non_snake_case)]
-use dioxus::prelude::*;
+use yew::prelude::*;
use super::plates::plate_container::PlateContainer;
use super::tree::Tree;
use super::transfer_menu::TransferMenu;
-static STYLE: &'static str = include_str!("global.css");
-pub fn MainWindow(cx: Scope) -> Element {
- cx.render(rsx! {
- style { STYLE },
- div {
- class: "main_container",
- Tree {},
- TransferMenu {},
- PlateContainer {
- source_dims: (24,16),
- destination_dims: (24,16)
- }
- }
- })
+#[function_component]
+pub fn MainWindow() -> Html {
+ html!{
+
+ }
}
diff --git a/src/components/plates/destination_plate.rs b/src/components/plates/destination_plate.rs
index ccc76a1..f168d43 100644
--- a/src/components/plates/destination_plate.rs
+++ b/src/components/plates/destination_plate.rs
@@ -1,8 +1,35 @@
#![allow(non_snake_case)]
-use dioxus::prelude::*;
+use yew::prelude::*;
-#[inline_props]
-pub fn DestinationPlate(cx: Scope, width: u8, height: u8) -> Element {
+#[derive(Properties, PartialEq)]
+pub struct DestinationPlateProps {
+ pub width: u8,
+ pub height: u8,
+}
+
+#[function_component]
+pub fn DestinationPlate(props: &DestinationPlateProps) -> Html {
+ let rows = (1..=props.height).map(|i| {
+ let row = (1..=props.width).map(|j| {
+ html! {
+
+ }
+ }).collect::();
+ html! {
+
+ { row }
+
+ }
+ }).collect::();
+
+ html! {
+
+ }
+ /*
cx.render(rsx! {
div {
class: "dest_plate",
@@ -18,15 +45,29 @@ pub fn DestinationPlate(cx: Scope, width: u8, height: u8) -> Element {
}
}
})
+ */
}
-#[inline_props]
-fn DestPlateCell(cx: Scope, i: u8, j: u8, color: Option) -> Element {
- let color_string = match color {
+#[derive(Properties, PartialEq)]
+pub struct DestPlateCellProps {
+ pub i: u8,
+ pub j: u8,
+ pub color: Option
+}
+
+#[function_component]
+fn DestPlateCell(props: &DestPlateCellProps) -> Html {
+ let color_string = match &props.color {
Some(c) => c.clone(),
None => "None".to_string(),
};
+ html! {
+
+
+ |
+ }
+ /*
cx.render(rsx! {
td {
class: "plate_cell",
@@ -37,4 +78,5 @@ fn DestPlateCell(cx: Scope, i: u8, j: u8, color: Option)
}
}
})
+ */
}
diff --git a/src/components/plates/plate_container.rs b/src/components/plates/plate_container.rs
index d1b4009..9e5910f 100644
--- a/src/components/plates/plate_container.rs
+++ b/src/components/plates/plate_container.rs
@@ -1,20 +1,20 @@
#![allow(non_snake_case)]
-use dioxus::prelude::*;
-use super::source_plate::SourcePlate;
+use yew::prelude::*;
+ use super::source_plate::SourcePlate;
use super::destination_plate::DestinationPlate;
-static STYLE: &'static str = include_str!("plate_container.css");
-
-#[inline_props]
-pub fn PlateContainer(cx: Scope, source_dims: (u8,u8), destination_dims: (u8,u8)) -> Element {
- cx.render(rsx! {
- style { STYLE }
- div {
- class: "plate_container",
- SourcePlate {width: source_dims.0,
- height: source_dims.1},
- DestinationPlate {width: destination_dims.0,
- height: destination_dims.1}
- }
- })
+#[derive(Properties, PartialEq)]
+pub struct PlateContainerProps {
+ pub source_dims: (u8,u8),
+ pub destination_dims: (u8,u8)
+}
+
+#[function_component]
+pub fn PlateContainer(props: &PlateContainerProps) -> Html {
+ html! {
+
+
+
+
+ }
}
diff --git a/src/components/plates/source_plate.rs b/src/components/plates/source_plate.rs
index 181c513..5de1991 100644
--- a/src/components/plates/source_plate.rs
+++ b/src/components/plates/source_plate.rs
@@ -1,62 +1,120 @@
#![allow(non_snake_case)]
-use dioxus::prelude::*;
-static STYLE: &'static str = include_str!("plate.css");
+use yew::prelude::*;
-#[derive(PartialEq, Props)]
+#[derive(PartialEq, Properties)]
pub struct SourcePlateProps {
- width: u8,
- height: u8,
-}
-struct SelectionState {
- m_start: Option<(u8, u8)>,
- m_end: Option<(u8, u8)>,
- m_stat: bool,
+ pub width: u8,
+ pub height: u8,
}
-pub fn SourcePlate(cx: Scope) -> Element {
- use_shared_state_provider(cx, || SelectionState {
+#[function_component]
+pub fn SourcePlate(props: &SourcePlateProps) -> Html {
+ /*
+ let selection_state = use_state_eq(|| SelectionState{
m_start: None,
m_end: None,
- m_stat: false,
+ m_stat: false
});
+ */
- cx.render(rsx! {
- div{
- class: "source_plate",
- style { STYLE }
- table {
- draggable: "false",
- for i in 1..=cx.props.height {
- tr {
- draggable: "false",
- for j in 1..=cx.props.width {
- SourcePlateCell {i: i, j: j}
- }
- }
- },
+ let m_start_handle: UseStateHandle