#![allow(unused, dead_code)]
use gpui::{Hsla, Length};
use std::{
    cell::LazyCell,
    sync::{Arc, LazyLock, OnceLock},
};
use theme::{Theme, ThemeColors, ThemeRegistry};
use ui::{
    IntoElement, RenderOnce, component_prelude::Documented, prelude::*, utils::inner_corner_radius,
};

#[derive(Clone, PartialEq)]
pub enum ThemePreviewStyle {
    Bordered,
    Borderless,
    SideBySide(Arc<Theme>),
}

/// Shows a preview of a theme as an abstract illustration
/// of a thumbnail-sized editor.
#[derive(IntoElement, RegisterComponent, Documented)]
pub struct ThemePreviewTile {
    theme: Arc<Theme>,
    seed: f32,
    style: ThemePreviewStyle,
}

static CHILD_RADIUS: LazyLock<Pixels> = LazyLock::new(|| {
    inner_corner_radius(
        ThemePreviewTile::ROOT_RADIUS,
        ThemePreviewTile::ROOT_BORDER,
        ThemePreviewTile::ROOT_PADDING,
        ThemePreviewTile::CHILD_BORDER,
    )
});

impl ThemePreviewTile {
    pub const SKELETON_HEIGHT_DEFAULT: Pixels = px(2.);
    pub const SIDEBAR_SKELETON_ITEM_COUNT: usize = 8;
    pub const SIDEBAR_WIDTH_DEFAULT: DefiniteLength = relative(0.25);
    pub const ROOT_RADIUS: Pixels = px(8.0);
    pub const ROOT_BORDER: Pixels = px(2.0);
    pub const ROOT_PADDING: Pixels = px(2.0);
    pub const CHILD_BORDER: Pixels = px(1.0);

    pub fn new(theme: Arc<Theme>, seed: f32) -> Self {
        Self {
            theme,
            seed,
            style: ThemePreviewStyle::Bordered,
        }
    }

    pub fn style(mut self, style: ThemePreviewStyle) -> Self {
        self.style = style;
        self
    }

    pub fn item_skeleton(w: Length, h: Length, bg: Hsla) -> impl IntoElement {
        div().w(w).h(h).rounded_full().bg(bg)
    }

    pub fn render_sidebar_skeleton_items(
        seed: f32,
        colors: &ThemeColors,
        skeleton_height: impl Into<Length> + Clone,
    ) -> [impl IntoElement; Self::SIDEBAR_SKELETON_ITEM_COUNT] {
        let skeleton_height = skeleton_height.into();
        std::array::from_fn(|index| {
            let width = {
                let value = (seed * 1000.0 + index as f32 * 10.0).sin() * 0.5 + 0.5;
                0.5 + value * 0.45
            };
            Self::item_skeleton(
                relative(width).into(),
                skeleton_height,
                colors.text.alpha(0.45),
            )
        })
    }

    pub fn render_pseudo_code_skeleton(
        seed: f32,
        theme: Arc<Theme>,
        skeleton_height: impl Into<Length>,
    ) -> impl IntoElement {
        let colors = theme.colors();
        let syntax = theme.syntax();

        let keyword_color = syntax.get("keyword").color;
        let function_color = syntax.get("function").color;
        let string_color = syntax.get("string").color;
        let comment_color = syntax.get("comment").color;
        let variable_color = syntax.get("variable").color;
        let type_color = syntax.get("type").color;
        let punctuation_color = syntax.get("punctuation").color;

        let syntax_colors = [
            keyword_color,
            function_color,
            string_color,
            variable_color,
            type_color,
            punctuation_color,
            comment_color,
        ];

        let skeleton_height = skeleton_height.into();

        let line_width = |line_idx: usize, block_idx: usize| -> f32 {
            let val =
                (seed * 100.0 + line_idx as f32 * 20.0 + block_idx as f32 * 5.0).sin() * 0.5 + 0.5;
            0.05 + val * 0.2
        };

        let indentation = |line_idx: usize| -> f32 {
            let step = line_idx % 6;
            if step < 3 {
                step as f32 * 0.1
            } else {
                (5 - step) as f32 * 0.1
            }
        };

        let pick_color = |line_idx: usize, block_idx: usize| -> Hsla {
            let idx = ((seed * 10.0 + line_idx as f32 * 7.0 + block_idx as f32 * 3.0).sin() * 3.5)
                .abs() as usize
                % syntax_colors.len();
            syntax_colors[idx].unwrap_or(colors.text)
        };

        let line_count = 13;

        let lines = (0..line_count)
            .map(|line_idx| {
                let block_count = (((seed * 30.0 + line_idx as f32 * 12.0).sin() * 0.5 + 0.5) * 3.0)
                    .round() as usize
                    + 2;

                let indent = indentation(line_idx);

                let blocks = (0..block_count)
                    .map(|block_idx| {
                        let width = line_width(line_idx, block_idx);
                        let color = pick_color(line_idx, block_idx);
                        Self::item_skeleton(relative(width).into(), skeleton_height, color)
                    })
                    .collect::<Vec<_>>();

                h_flex().gap(px(2.)).ml(relative(indent)).children(blocks)
            })
            .collect::<Vec<_>>();

        v_flex().size_full().p_1().gap_1p5().children(lines)
    }

    pub fn render_sidebar(
        seed: f32,
        colors: &ThemeColors,
        width: impl Into<Length> + Clone,
        skeleton_height: impl Into<Length>,
    ) -> impl IntoElement {
        div()
            .h_full()
            .w(width)
            .border_r(px(1.))
            .border_color(colors.border_transparent)
            .bg(colors.panel_background)
            .child(v_flex().p_2().size_full().gap_1().children(
                Self::render_sidebar_skeleton_items(seed, colors, skeleton_height.into()),
            ))
    }

    pub fn render_pane(
        seed: f32,
        theme: Arc<Theme>,
        skeleton_height: impl Into<Length>,
    ) -> impl IntoElement {
        v_flex().h_full().flex_grow().child(
            div()
                .size_full()
                .overflow_hidden()
                .bg(theme.colors().editor_background)
                .p_2()
                .child(Self::render_pseudo_code_skeleton(
                    seed,
                    theme,
                    skeleton_height.into(),
                )),
        )
    }

    pub fn render_editor(
        seed: f32,
        theme: Arc<Theme>,
        sidebar_width: impl Into<Length> + Clone,
        skeleton_height: impl Into<Length> + Clone,
    ) -> impl IntoElement {
        div()
            .size_full()
            .flex()
            .bg(theme.colors().background.alpha(1.00))
            .child(Self::render_sidebar(
                seed,
                theme.colors(),
                sidebar_width,
                skeleton_height.clone(),
            ))
            .child(Self::render_pane(seed, theme, skeleton_height))
    }

    fn render_borderless(seed: f32, theme: Arc<Theme>) -> impl IntoElement {
        Self::render_editor(
            seed,
            theme,
            Self::SIDEBAR_WIDTH_DEFAULT,
            Self::SKELETON_HEIGHT_DEFAULT,
        )
    }

    fn render_border(seed: f32, theme: Arc<Theme>) -> impl IntoElement {
        div()
            .size_full()
            .p(Self::ROOT_PADDING)
            .rounded(Self::ROOT_RADIUS)
            .child(
                div()
                    .size_full()
                    .rounded(*CHILD_RADIUS)
                    .border(Self::CHILD_BORDER)
                    .border_color(theme.colors().border)
                    .child(Self::render_editor(
                        seed,
                        theme.clone(),
                        Self::SIDEBAR_WIDTH_DEFAULT,
                        Self::SKELETON_HEIGHT_DEFAULT,
                    )),
            )
    }

    fn render_side_by_side(
        seed: f32,
        theme: Arc<Theme>,
        other_theme: Arc<Theme>,
        border_color: Hsla,
    ) -> impl IntoElement {
        let sidebar_width = relative(0.20);

        div()
            .size_full()
            .p(Self::ROOT_PADDING)
            .rounded(Self::ROOT_RADIUS)
            .child(
                h_flex()
                    .size_full()
                    .relative()
                    .rounded(*CHILD_RADIUS)
                    .border(Self::CHILD_BORDER)
                    .border_color(border_color)
                    .overflow_hidden()
                    .child(div().size_full().child(Self::render_editor(
                        seed,
                        theme,
                        sidebar_width,
                        Self::SKELETON_HEIGHT_DEFAULT,
                    )))
                    .child(
                        div()
                            .size_full()
                            .absolute()
                            .left_1_2()
                            .bg(other_theme.colors().editor_background)
                            .child(Self::render_editor(
                                seed,
                                other_theme,
                                sidebar_width,
                                Self::SKELETON_HEIGHT_DEFAULT,
                            )),
                    ),
            )
            .into_any_element()
    }
}

impl RenderOnce for ThemePreviewTile {
    fn render(self, _window: &mut ui::Window, _cx: &mut ui::App) -> impl IntoElement {
        match self.style {
            ThemePreviewStyle::Bordered => {
                Self::render_border(self.seed, self.theme).into_any_element()
            }
            ThemePreviewStyle::Borderless => {
                Self::render_borderless(self.seed, self.theme).into_any_element()
            }
            ThemePreviewStyle::SideBySide(other_theme) => Self::render_side_by_side(
                self.seed,
                self.theme,
                other_theme,
                _cx.theme().colors().border,
            )
            .into_any_element(),
        }
    }
}

impl Component for ThemePreviewTile {
    fn scope() -> ComponentScope {
        ComponentScope::Onboarding
    }

    fn name() -> &'static str {
        "Theme Preview Tile"
    }

    fn sort_name() -> &'static str {
        "Theme Preview Tile"
    }

    fn description() -> Option<&'static str> {
        Some(Self::DOCS)
    }

    fn preview(_window: &mut Window, cx: &mut App) -> Option<AnyElement> {
        let theme_registry = ThemeRegistry::global(cx);

        let one_dark = theme_registry.get("One Dark");
        let one_light = theme_registry.get("One Light");
        let gruvbox_dark = theme_registry.get("Gruvbox Dark");
        let gruvbox_light = theme_registry.get("Gruvbox Light");

        let themes_to_preview = vec![
            one_dark.clone().ok(),
            one_light.ok(),
            gruvbox_dark.ok(),
            gruvbox_light.ok(),
        ]
        .into_iter()
        .flatten()
        .collect::<Vec<_>>();

        Some(
            v_flex()
                .gap_6()
                .p_4()
                .children({
                    if let Some(one_dark) = one_dark.ok() {
                        vec![example_group(vec![single_example(
                            "Default",
                            div()
                                .w(px(240.))
                                .h(px(180.))
                                .child(ThemePreviewTile::new(one_dark, 0.42))
                                .into_any_element(),
                        )])]
                    } else {
                        vec![]
                    }
                })
                .child(
                    example_group(vec![single_example(
                        "Default Themes",
                        h_flex()
                            .gap_4()
                            .children(
                                themes_to_preview
                                    .into_iter()
                                    .map(|theme| {
                                        div()
                                            .w(px(200.))
                                            .h(px(140.))
                                            .child(ThemePreviewTile::new(theme, 0.42))
                                    })
                                    .collect::<Vec<_>>(),
                            )
                            .into_any_element(),
                    )])
                    .grow(),
                )
                .into_any_element(),
        )
    }
}