use crate::shared::clickable_view::*;
use crate::shared::stack_view_action::StackViewAction;
use makepad_widgets::widget::WidgetCache;
use makepad_widgets::*;

live_design! {
    import makepad_draw::shader::std::*;
    import makepad_widgets::base::*;
    import makepad_widgets::theme_desktop_dark::*;

    import crate::shared::helpers::*;
    import crate::shared::helpers::Divider;
    import crate::shared::styles::*;
    import crate::shared::clickable_view::ClickableView
    import crate::shared::search_bar::SearchBar;
    import crate::shared::custom_button::CustomButton;

    IMG_DEFAULT_AVATAR = dep("crate://self/resources/img/default_avatar.png")
    IMG_FAVORITES = dep("crate://self/resources/img/favorites.png")
    IMG_MY_POSTS = dep("crate://self/resources/img/my-posts.png")
    IMG_STICKER_GALLERY = dep("crate://self/resources/img/sticker-gallery.png")
    IMG_SETTINGS = dep("crate://self/resources/img/settings.png")
    IMG_QR = dep("crate://self/resources/img/qr_icon.png")

    Welcome = {{Welcome}} {
        view: {
            width: Fill, height: Fit
            // flow: Down, 
            spacing: 10.
            // show_bg: true,
            draw_bg: {
                color: #000
            }
            WelcomeInfo = <View> {
                width: Fill, height: Fill
                flow: Right, 
                spacing: 10., 
                // padding: {top: 100., bottom: 100., right: 10., left: 10.}
                align: {
                    x: 0.5,
                    y: 0.5
                },
                show_bg: true
                draw_bg: {
                    color: #fff
                }
                <View> {
                    width: Fit
                    height: Fill
                    show_bg: false
                    // align:{ x: 0.5 }
                    container = <RoundedView> {
                        width: Fit
                        height: Fill
                        // flow: Down
                        align: {x: 0.5, y: 0.0}
                        // margin: {left: 200.0, right: 200.0, top: 100.0, bottom: 100.0}
                        spacing: 2.0
                        draw_bg: {
                            color: #ddd,
                            // border_width: 1.0,
                            // border_color: #000,  
                            radius: (CARD_CORNER_RADIUS)
                        }
                        <View> {
                            width: Fit, height: Fill
                            flow: Down, 
                            align: {x: 0, y: 0.5}, padding: {top: 5., left: 10., right: 10.}, spacing: 20.
                            username = <Label> {
                                // padding: {top: 50., left: 140.}
                                draw_text:{
                                    color: #000,
                                    text_style: <TEXT_SUB>{font_size: 20.},
                                }
                                text:"Welcome To Simple Nav"
                            }
                            // <FillerY> {}
                            message_input = <SearchBar> {
                                show_bg: false
                                input = {
                                    width: Fill, height: Fit, margin: 0
                                    empty_message: "Enter Your Name"
                                    draw_bg: {
                                        color: #fff
                                        border_width: 0.5,
                                        border_color: #b4b4b4,
                                    }
                                }
                            }
                            welcome_frame = <CustomButton> {
                                button = {
                                    // width: Fill, height: Fit, margin: 0
                                    text: "Welcome"
                                }
                            }
                            // <FillerY> {}
                        }
                    }
                }

            }
        }
    }

    WelcomeScreen = <View> {
        width: Fill, height: Fill
        <Welcome> {}
    }
}

#[derive(Live)]
pub struct Welcome {
    #[live]
    view:View,
}

impl LiveHook for Welcome {
    fn before_live_design(cx: &mut Cx) {
        register_widget!(cx, Welcome);
    }
}

impl Widget for Welcome {
    fn handle_widget_event_with(
        &mut self,
        cx: &mut Cx,
        event: &Event,
        dispatch_action: &mut dyn FnMut(&mut Cx, WidgetActionItem),
    ) {
        let uid = self.widget_uid();
        self.handle_event_with(cx, event, &mut |cx, action: StackViewAction| {
            dispatch_action(cx, WidgetActionItem::new(action.into(), uid));
        });
    }

    fn redraw(&mut self, cx: &mut Cx) {
        self.view.redraw(cx);
    }

    fn find_widgets(&mut self, path: &[LiveId], cached: WidgetCache, results: &mut WidgetSet) {
        self.view.find_widgets(path, cached, results);
    }

    fn draw_walk_widget(&mut self, cx: &mut Cx2d, walk: Walk) -> WidgetDraw {
        self.view.draw_walk_widget(cx, walk)
    }
}

impl Welcome {
    fn handle_event_with(
        &mut self,
        cx: &mut Cx,
        event: &Event,
        dispatch_action: &mut dyn FnMut(&mut Cx, StackViewAction),
    ) {
        let actions = self.view.handle_widget_event(cx, event);

        if self
            .view
            .clickable_view(id!(welcome_frame))
            .clicked(&actions)
        {
            dispatch_action(cx, StackViewAction::ShowCounterScreen);
        }
    }
}