use maud::DOCTYPE;

pub mod admin;
pub mod auth;
pub mod dashboard;
pub mod session_auth;

const BRAND: &str = "#e3001a";

pub fn render_layout(
    main_content: &maud::Markup,
    username: Option<&str>,
    is_admin: bool,
) -> maud::Markup {
    maud::html! {
        (DOCTYPE)
        html class="h-100" {
            head {
                meta charset="utf-8";
                meta name="viewport" content="width=device-width, initial-scale=1";
                title { "Hodis - Preseason Challenge" }
                link rel="icon" type="image/svg+xml" href="/assets/hodis.svg";
                link rel="stylesheet" href="/assets/t.css";
                script src="/assets/h.js" {}
                script src="/assets/hx-response-targets.js" {}
                style {
                    ".btn-brand { background-color: " (BRAND) "; color: white; border: none; cursor: pointer; }"
                    ".btn-brand:hover { opacity: 0.9; }"
                    ".btn-outline { background-color: transparent; color: " (BRAND) "; border: 1px solid " (BRAND) "; cursor: pointer; }"
                    ".btn-outline:hover { background-color: " (BRAND) "; color: white; }"
                    ".bg-brand { background-color: " (BRAND) "; }"
                    ".b--brand { border-color: " (BRAND) "; }"
                    ".brand { color: " (BRAND) "; }"
                }
            }
            body hx-ext="response-targets" class="w-100 sans-serif ma0 bg-white black" style="min-height: 100vh;" {
                nav class="dt w-100 bg-brand bb" style="border-bottom: 2px solid #b30015;" {
                    div class="dtc v-mid pa3" {
                        a href="/" class="link white hover-white no-underline fw6 f4 flex items-center" {
                            img src="/assets/hodis.svg" alt="Hodis logo" style="width: 24px; height: 24px; margin-right: 0.5rem;";
                            "Hodis"
                        }
                    }
                    div class="dtc v-mid tr pa3" {
                        @match username {
                            Some(name) => {
                                @if is_admin {
                                    a href="/admin" class="link white-80 hover-white no-underline f6 mr3" { "Admin" }
                                }
                                span class="white-80 f6 mr3" { (name) }
                                form method="POST" action="/auth/logout" class="dib ma0" {
                                    button
                                        type="submit"
                                        class="link white-80 hover-white no-underline f6 bg-transparent bn pointer pa0"
                                    {
                                        "Logout"
                                    }
                                }
                            }
                            None => {
                                a href="/auth/login" class="link white hover-white no-underline f6 mr3" {
                                    "Login"
                                }
                                a href="/auth/signup" class="link white hover-white no-underline f6" {
                                    "Sign Up"
                                }
                            }
                        }
                    }
                }
                main id="feature" class="flex flex-column" style="padding-top: 1rem; padding-left: 10px; padding-right: 10px; padding-bottom: 10px;" {
                    (main_content)
                }
                footer class="tc pa4 black-40 f6" {
                    "Hodis Preseason Challenge"
                }
            }
        }
    }
}

pub fn render_error(message: &str) -> maud::Markup {
    let bg = format!("background-color: #fee; border-color: {}", BRAND);
    let fg = format!("color: {}", BRAND);
    maud::html! {
        div class="ba br2 pa3 mt3" style=(bg) {
            p class="f6 ma0" style=(fg) { (message) }
        }
    }
}

pub fn render_success(message: &str) -> maud::Markup {
    maud::html! {
        div class="ba b--green br2 pa3 bg-washed-green mt3" {
            p class="f6 dark-green ma0" { (message) }
        }
    }
}