#![allow(non_snake_case)]

use js_sys::Function;
use wasm_bindgen::{prelude::*, JsCast};
use web_sys::{
    FileReader, HtmlButtonElement, HtmlDialogElement, HtmlElement, HtmlFormElement,
    HtmlInputElement, HtmlOptionElement, HtmlSelectElement,
};

use yew::prelude::*;
use yewdux::prelude::*;

use crate::components::states::{CsvExportType, MainState};

use super::create_close_button;

type NoParamsCallback = Box<dyn Fn(())>;

pub fn toggle_in_transfer_hashes_callback(
    main_dispatch: Dispatch<MainState>,
) -> Callback<web_sys::MouseEvent> {
    let main_dispatch = main_dispatch.clone();
    Callback::from(move |_| {
        main_dispatch.reduce_mut(|state| {
            state.preferences.in_transfer_hashes ^= true;
        })
    })
}

pub fn toggle_volume_heatmap_callback(
    main_dispatch: Dispatch<MainState>,
) -> Callback<web_sys::MouseEvent> {
    let main_dispatch = main_dispatch.clone();
    Callback::from(move |_| {
        main_dispatch.reduce_mut(|state| {
            state.preferences.volume_heatmap ^= true;
        })
    })
}

pub fn change_csv_export_type_callback(
    main_dispatch: Dispatch<MainState>,
) -> Callback<web_sys::MouseEvent> {
    let main_dispatch = main_dispatch.clone();
    Callback::from(move |_| {
        let window = web_sys::window().unwrap();
        let document = window.document().unwrap();
        let body = document.body().unwrap();
        let modal = document
            .create_element("dialog")
            .unwrap()
            .dyn_into::<HtmlDialogElement>()
            .unwrap();
        let onclose_callback = {
            let modal = modal.clone();
            Closure::<dyn FnMut(_)>::new(move |_: Event| {
                modal.remove();
            })
        };
        modal.set_onclose(Some(onclose_callback.as_ref().unchecked_ref()));
        modal.set_text_content(Some("CSV Export Type"));

        let close_button = create_close_button(&onclose_callback);
        onclose_callback.forget();
        modal.append_child(&close_button).unwrap();

        let form = document
            .create_element("form")
            .unwrap()
            .dyn_into::<HtmlFormElement>()
            .unwrap();
        let export_type = document
            .create_element("select")
            .unwrap()
            .dyn_into::<HtmlSelectElement>()
            .unwrap();
        for t in [CsvExportType::Normal, CsvExportType::EchoClient] {
            let option = document
                .create_element("option")
                .unwrap()
                .dyn_into::<HtmlOptionElement>()
                .unwrap();
            option.set_value(&t.to_string());
            option.set_text(&t.to_string());
            option.set_selected(t == main_dispatch.get().preferences.csv_export_type);

            export_type.append_child(&option).unwrap();
        }
        form.append_child(&export_type).unwrap();

        let form_change_callback = {
            let export_type = export_type.clone();
            let main_dispatch = main_dispatch.clone();
            Closure::<dyn FnMut(_)>::new(move |_: Event| {
                let current: CsvExportType = export_type.value().as_str().into();
                main_dispatch.reduce_mut(|state| {
                    state.preferences.csv_export_type = current;
                });
        })};
        form.set_onchange(Some(form_change_callback.as_ref().unchecked_ref()));
        form_change_callback.forget();

        modal.append_child(&form).unwrap();

        body.append_child(&modal).unwrap();
        modal.show_modal().unwrap();
    })
}