# vim:fileencoding=utf-8
# License: GPL v3 Copyright: 2026
from __python__ import hash_literals

from elementmaker import E
from gettext import gettext as _

from book_list.saved_virtual_libraries import (
    DEFAULT_SAVED_VIRTUAL_LIBRARY_ICON, normalize_saved_virtual_library_icon
)
from book_list.theme import get_color
from dom import add_extra_css, build_rule, unique_id


# (emoji stored in session, short description for picker tooltip / a11y)
SAVED_VIRTUAL_LIBRARY_ICON_CHOICES = [
    ('📁', _('Folder')),
    ('📂', _('Open folder')),
    ('🔖', _('Bookmark')),
    ('📖', _('Book')),
    ('📚', _('Library')),
    ('🏠', _('Home')),
    ('⭐', _('Star')),
    ('🌟', _('Sparkle')),
    ('❤️', _('Heart')),
    ('🔍', _('Search')),
    ('➕', _('Plus')),
    ('✏️', _('Pencil')),
    ('🖼️', _('Image')),
    ('🔗', _('Link')),
    ('🤖', _('AI')),
    ('🎲', _('Random')),
    ('✅', _('Checkmark')),
    ('✨', _('Highlight')),
    ('⚠️', _('Warning')),
    ('❓', _('Help')),
    ('🗑️', _('Trash')),
    ('⚙️', _('Settings')),
    ('👤', _('User')),
    ('📣', _('Announcement')),
    ('🔄', _('Refresh')),
    ('⬆️', _('Sort up')),
    ('⬇️', _('Sort down')),
    ('📋', _('Clipboard')),
    ('📤', _('Send')),
    ('🎯', _('Target')),
    ('💡', _('Idea')),
    ('🏷️', _('Tag')),
    ('🌈', _('Rainbow')),
    ('🎵', _('Music')),
    ('🎬', _('Film')),
    ('📌', _('Pin')),
    ('📝', _('Memo')),
]


add_extra_css(def ():
    sel = '.cs-vl-icon-picker '
    ans = build_rule('.cs-vl-icon-picker', margin_top='0.35rem')
    ans += build_rule(sel + '.cs-vl-icon-grid',
        display='flex',
        flex_wrap='wrap',
        gap='0.45rem',
        align_items='stretch',
        justify_content='flex-start',
    )
    ans += build_rule(sel + 'button.cs-vl-icon-btn',
        display='inline-flex',
        align_items='center',
        justify_content='center',
        width='2.35rem',
        height='2.35rem',
        padding='0',
        margin='0',
        box_sizing='border-box',
        border='var(--calibre-border-style-subtle)',
        border_radius='10px',
        background_color='rgba(0,0,0,0.02)',
        color=get_color('window-foreground'),
        cursor='pointer',
        line_height='1',
        transition='background 120ms ease, border-color 120ms ease, box-shadow 120ms ease',
    )
    ans += build_rule(sel + 'button.cs-vl-icon-btn .cs-vl-emoji',
        font_size='1.3rem',
        line_height='1',
        user_select='none',
        pointer_events='none',
    )
    ans += build_rule(sel + 'button.cs-vl-icon-btn:hover',
        background_color='var(--calibre-color-primary-light)',
        border_color='var(--calibre-color-border)',
    )
    ans += build_rule(sel + 'button.cs-vl-icon-btn:focus',
        outline='none',
        box_shadow='var(--calibre-focus-ring)',
    )
    ans += build_rule(sel + 'button.cs-vl-icon-btn-selected',
        background_color='var(--calibre-color-primary-light-2)',
        border_color='var(--calibre-color-border)',
        font_weight='600',
    )
    ans += build_rule(sel + '.cs-vl-icon-custom-wrap',
        margin_top='0.55rem',
        display='flex',
        flex_direction='column',
        gap='0.35rem',
        width='100%',
        max_width='100%',
        box_sizing='border-box',
    )
    ans += build_rule(sel + '.cs-vl-icon-custom-wrap label',
        font_size='0.88rem',
        font_weight='600',
        opacity='0.88',
    )
    ans += build_rule(sel + 'input.cs-vl-icon-custom-input',
        width='100%',
        max_width='100%',
        box_sizing='border-box',
        padding='0.5rem 0.65rem',
        border_radius='10px',
        border='var(--calibre-border-style-subtle)',
        background_color='rgba(0,0,0,0.02)',
        color=get_color('window-foreground'),
        font_size='1.1rem',
        line_height='1.3',
    )
    ans += build_rule(sel + '.cs-vl-icon-custom-hint',
        font_size='0.82rem',
        font_weight='600',
        opacity='0.72',
        line_height='1.35',
    )
    return ans
)


def create_saved_virtual_library_icon_picker(initial_icon=DEFAULT_SAVED_VIRTUAL_LIBRARY_ICON):
    state = {'icon': normalize_saved_virtual_library_icon(initial_icon) + ''}
    grid = E.div(class_='cs-vl-icon-grid', role='radiogroup', aria_label=_('Icon presets'))

    inp_id = unique_id('cs-vl-icon-custom')

    def sync_grid_only():
        found = False
        for btn in grid.querySelectorAll('button.cs-vl-icon-btn'):
            nm = btn.dataset.vlIcon
            on = nm is state.icon
            if on:
                found = True
                btn.classList.add('cs-vl-icon-btn-selected')
            else:
                btn.classList.remove('cs-vl-icon-btn-selected')
            btn.setAttribute('aria-checked', 'true' if on else 'false')
        return found

    def sync_from_input():
        raw = (custom_inp.value or '') + ''
        state.icon = normalize_saved_virtual_library_icon(raw)
        sync_grid_only()

    def make_handler(stored_emoji):
        def on_click(evt):
            evt.preventDefault()
            state.icon = stored_emoji
            custom_inp.value = stored_emoji
            sync_grid_only()
        return on_click

    for emoji_char, label in SAVED_VIRTUAL_LIBRARY_ICON_CHOICES:
        btn = E.button(
            type='button',
            class_='cs-vl-icon-btn',
            role='radio',
            title=label,
        )
        btn.dataset.vlIcon = emoji_char
        btn.setAttribute('aria-label', label)
        btn.appendChild(E.span(emoji_char, class_='cs-vl-emoji'))
        btn.addEventListener('click', make_handler(emoji_char))
        grid.appendChild(btn)

    custom_inp = E.input(
        type='text',
        id=inp_id,
        class_='cs-vl-icon-custom-input',
        placeholder=_('e.g. emoji or a few characters'),
        aria_label=_('Custom icon'),
    )
    custom_inp.addEventListener('input', def (ev):
        sync_from_input()
    )
    custom_inp.addEventListener('change', def (ev):
        sync_from_input()
    )

    custom_wrap = E.div(
        class_='cs-vl-icon-custom-wrap',
        E.label(_('Custom'), class_='cs-vl-custom-label', for_=inp_id),
        custom_inp,
    )
    help_span = E.span(
        _('You can pick a preset above or type your own (emoji, letter, etc.).'),
        class_='cs-vl-icon-custom-hint',
    )
    custom_wrap.appendChild(help_span)

    if not sync_grid_only():
        custom_inp.value = state.icon + ''
    root = E.div(class_='cs-vl-icon-picker', grid, custom_wrap)

    def get_value():
        raw = (custom_inp.value or '') + ''
        trimmed = raw.strip()
        if trimmed:
            return normalize_saved_virtual_library_icon(trimmed)
        return state.icon or DEFAULT_SAVED_VIRTUAL_LIBRARY_ICON

    return {'root': root, 'get_value': get_value}
