110 lines
4.2 KiB
Rust
110 lines
4.2 KiB
Rust
use gloo::events::EventListener;
|
|
use wasm_bindgen::prelude::*;
|
|
use wasm_bindgen_futures::spawn_local;
|
|
use web_sys::{Element, HtmlInputElement};
|
|
|
|
use crate::{
|
|
calendar,
|
|
recipe_scheduler::RecipeScheduler,
|
|
shopping_list::ShoppingList,
|
|
utils::{SelectorExt, by_id, get_locale, selector},
|
|
};
|
|
|
|
pub fn setup_page(is_user_logged: bool) {
|
|
let recipe_scheduler = RecipeScheduler::new(!is_user_logged);
|
|
|
|
calendar::setup(
|
|
selector(".calendar"),
|
|
calendar::CalendarOptions {
|
|
can_select_date: false,
|
|
with_link_and_remove: true,
|
|
},
|
|
recipe_scheduler,
|
|
);
|
|
|
|
let shopping_list = ShoppingList::new(!is_user_logged);
|
|
|
|
spawn_local(async move {
|
|
let item_template: Element = selector("#hidden-templates .shopping-item");
|
|
let container: Element = by_id("shopping-list");
|
|
let container_checked: Element = by_id("shopping-list-checked");
|
|
let date_format =
|
|
selector::<Element>("#hidden-templates .calendar-date-format").inner_html();
|
|
for item in shopping_list.get_items().await.unwrap() {
|
|
let item_element = item_template.deep_clone();
|
|
|
|
// item_element.set_id(format!("shopping-item-{}", ));
|
|
|
|
item_element
|
|
.selector::<Element>(".item-name")
|
|
.set_inner_html(&item.name);
|
|
|
|
if let Some(quantity_value) = item.quantity_value {
|
|
item_element
|
|
.selector::<Element>(".item-quantity")
|
|
.set_inner_html(&format!("{} {}", quantity_value, item.quantity_unit));
|
|
}
|
|
|
|
// Display associated sheduled recipe information if it exists.
|
|
if let (Some(recipe_id), Some(recipe_title), Some(date)) =
|
|
(item.recipe_id, item.recipe_title, item.date)
|
|
{
|
|
let recipe_element = item_element.selector::<Element>(".item-scheduled-recipe a");
|
|
recipe_element.set_inner_html(&format!(
|
|
"{} @ {}",
|
|
recipe_title,
|
|
date.format_localized(&date_format, get_locale()),
|
|
));
|
|
recipe_element
|
|
.set_attribute("href", &format!("/recipe/view/{}", recipe_id))
|
|
.unwrap();
|
|
}
|
|
|
|
EventListener::new(
|
|
// TODO: Find the right place to move the item based on:
|
|
// 1) recipe id, 2) name, 3) shopping entry id
|
|
// Se shopping_list.rs@L30
|
|
&item_element.selector(".item-is-checked"),
|
|
"change",
|
|
move |event| {
|
|
let input: HtmlInputElement = event.target().unwrap().dyn_into().unwrap();
|
|
spawn_local(async move {
|
|
shopping_list
|
|
.set_item_checked(item.id, input.checked())
|
|
.await
|
|
.unwrap();
|
|
let item_element = input.parent_element().unwrap();
|
|
item_element.remove();
|
|
// TODO: Find the correct place to insert the element.
|
|
if input.checked() {
|
|
by_id::<Element>("shopping-list-checked")
|
|
.append_child(&item_element)
|
|
.unwrap();
|
|
} else {
|
|
by_id::<Element>("shopping-list")
|
|
.append_child(&item_element)
|
|
.unwrap();
|
|
}
|
|
});
|
|
},
|
|
)
|
|
.forget();
|
|
|
|
EventListener::new(&item_element, "click", move |event| {
|
|
let target: Element = event.target().unwrap().dyn_into().unwrap();
|
|
|
|
// if target.class_name() == "item-is-checked"
|
|
})
|
|
.forget();
|
|
|
|
if item.is_checked {
|
|
item_element
|
|
.selector::<HtmlInputElement>(".item-is-checked")
|
|
.set_checked(true);
|
|
container_checked.append_child(&item_element).unwrap();
|
|
} else {
|
|
container.append_child(&item_element).unwrap();
|
|
}
|
|
}
|
|
});
|
|
}
|