#include colour.js

// try to reduce these and create variations
const UmiThemes = [
    {
        id: 'dark',
        name: 'Dark',
        scheme: 'dark',
        colours: {
            'main-accent': 0x8559A5,
            'main-background': 0x050505,
            'main-colour': 0xFFFFFF,
            'scrollbar-foreground': 0x212121,
            'scrollbar-background': 0x111111,
            'chat-background': 0x111111,
            'chat-box-shadow': 0x111111,
            'message-avatar-background': 0,
            'message-separator': 0x222222,
            'message-time-colour': 0x888888,
            'message-compact-alternate-background': 0x212121,
            'message-compact-highlight': 0x3A3A3A,
            'sidebar-background': 0x111111,
            'sidebar-background-current': 0x222222,
            'sidebar-background-highlight': 0x444444,
            'sidebar-background-option': 0,
            'sidebar-box-shadow': 0x111111,
            'sidebar-selector-background-begin': 0x212121,
            'sidebar-selector-background-end': 0x1A1A1A,
            'sidebar-selector-background-hover': 0x222222,
            'sidebar-selector-background-active': 0x111111,
            'sidebar-selector-attention-shadow': 0x96B6D3,
            'input-background': 0x111111,
            'input-box-shadow': 0x111111,
            'input-colour': 0xFFFFFF,
            'input-border': 0x222222,
            'input-send': 0x222222,
            'input-button-hover': 0x2A2A2A,
            'input-button-active': 0x1A1A1A,
            'input-menu-background': 0x222222,
            'input-menu-box-shadow': 0x222222,
            'input-menu-button': 0x333333,
            'input-menu-button-hover': 0x444444,
            'input-menu-button-active': 0x3A3A3A,
            'settings-category-title-begin': 0x222222,
            'settings-category-title-end': 0x111111,
            'settings-input-border': 0x333333,
            'settings-input-background': 0x111111,
            'settings-input-colour': 0xFFFFFF,
            'settings-input-focus': 0x222222,
            'settings-markup-link-colour': 0x1E90FF,
        },
        sizes: {
            'chat-box-shadow-y': 1,
            'chat-box-shadow-blur': 4,
            'sidebar-box-shadow-y': 1,
            'sidebar-box-shadow-blur': 4,
            'sidebar-selector-attention-shadow-blur': 10,
            'input-box-shadow-y': 1,
            'input-box-shadow-blur': 4,
            'input-menu-box-shadow-y': 1,
            'input-menu-box-shadow-blur': 4,
        },
    },
    {
        id: 'light',
        name: 'Light',
        scheme: 'light',
        colours: {
            'main-accent': 0x8559A5,
            'main-background': 0xFFFFFF,
            'main-colour': 0,
            'scrollbar-foreground': 0xDDDDDD,
            'scrollbar-background': 0xEEEEEE,
            'chat-background': 0xEEEEEE,
            'chat-box-shadow': 0xEEEEEE,
            'message-avatar-background': 0xFFFFFF,
            'message-separator': 0xDDDDDD,
            'message-time-colour': 0x777777,
            'message-compact-alternate-background': 0xDEDEDE,
            'message-compact-highlight': 0xD9D9D9,
            'sidebar-background': 0xEEEEEE,
            'sidebar-background-current': 0xDDDDDD,
            'sidebar-background-highlight': 0xBBBBBB,
            'sidebar-background-option': 0xFFFFFF,
            'sidebar-box-shadow': 0xEEEEEE,
            'sidebar-selector-background-begin': 0xDEDEDE,
            'sidebar-selector-background-end': 0xE9E9E9,
            'sidebar-selector-background-hover': 0xDDDDDD,
            'sidebar-selector-background-active': 0xEEEEEE,
            'sidebar-selector-attention-shadow': 0x96B6D3,
            'input-background': 0xEEEEEE,
            'input-box-shadow': 0xEEEEEE,
            'input-colour': 0,
            'input-border': 0xDDDDDD,
            'input-send': 0xDDDDDD,
            'input-button-hover': 0xD9D9D9,
            'input-button-active': 0xE9E9E9,
            'input-menu-background': 0xDDDDDD,
            'input-menu-box-shadow': 0xDDDDDD,
            'input-menu-button': 0xCCCCCC,
            'input-menu-button-hover': 0xBBBBBB,
            'input-menu-button-active': 0xC9C9C9,
            'settings-category-title-begin': 0xDDDDDD,
            'settings-category-title-end': 0xEEEEEE,
            'settings-input-border': 0xCCCCCC,
            'settings-input-background': 0xEEEEEE,
            'settings-input-colour': 0,
            'settings-input-focus': 0xDDDDDD,
            'settings-markup-link-colour': 0x1E90FF,
        },
        sizes: {
            'chat-box-shadow-y': 1,
            'chat-box-shadow-blur': 4,
            'sidebar-box-shadow-y': 1,
            'sidebar-box-shadow-blur': 4,
            'sidebar-selector-attention-shadow-blur': 10,
            'input-box-shadow-y': 1,
            'input-box-shadow-blur': 4,
            'input-menu-box-shadow-y': 1,
            'input-menu-box-shadow-blur': 4,
        },
    },
    {
        id: 'blue',
        name: 'Blue',
        scheme: 'dark',
        colours: {
            'main-accent': 0x0D355D,
            'main-background': 0x001434,
            'main-colour': 0xFFFFFF,
            'scrollbar-foreground': 0x0B325A,
            'scrollbar-background': 0x002545,
            'chat-background': 0x002545,
            'chat-box-shadow': 0x002545,
            'message-avatar-background': 0x001434,
            'message-separator': 0x0D355D,
            'message-time-colour': 0x888888,
            'message-compact-alternate-background': 0x0D355D,
            'message-compact-highlight': 0x003D8E,
            'sidebar-background': 0x002545,
            'sidebar-background-current': 0x002545,
            'sidebar-background-highlight': 0x0D355D,
            'sidebar-background-option': 0,
            'sidebar-box-shadow': 0x002545,
            'sidebar-selector-background-begin': 0x0D355D,
            'sidebar-selector-background-end': 0x002545,
            'sidebar-selector-background-hover': 0x0D355D,
            'sidebar-selector-background-active': 0x002545,
            'sidebar-selector-attention-shadow': 0x96B6D3,
            'input-background': 0x002545,
            'input-box-shadow': 0x002545,
            'input-colour': 0xFFFFFF,
            'input-border': 0x0D355D,
            'input-send': 0x0D355D,
            'input-button-hover': 0x0D355D,
            'input-button-active': 0x002545,
            'input-menu-background': 0x0D355D,
            'input-menu-box-shadow': 0x0D355D,
            'input-menu-button': 0x0E466E,
            'input-menu-button-hover': 0x0F577F,
            'input-menu-button-active': 0x0E507A,
            'settings-category-title-begin': 0x0D355D,
            'settings-category-title-end': 0x002545,
            'settings-input-border': 0x003D8E,
            'settings-input-background': 0x002545,
            'settings-input-colour': 0xFFFFFF,
            'settings-input-focus': 0x0D355D,
            'settings-markup-link-colour': 0x1E90FF,
        },
        sizes: {
            'chat-box-shadow-y': 1,
            'chat-box-shadow-blur': 4,
            'sidebar-box-shadow-y': 1,
            'sidebar-box-shadow-blur': 4,
            'sidebar-selector-attention-shadow-blur': 10,
            'input-box-shadow-y': 1,
            'input-box-shadow-blur': 4,
            'input-menu-box-shadow-y': 1,
            'input-menu-box-shadow-blur': 4,
        },
    },
    {
        id: 'purple',
        name: 'Purple',
        scheme: 'dark',
        colours: {
            'main-accent': 0x59466B,
            'main-background': 0x251D2C,
            'main-colour': 0xFFFFFF,
            'scrollbar-foreground': 0x4A3A59,
            'scrollbar-background': 0x2C2335,
            'chat-background': 0x2C2335,
            'chat-box-shadow': 0x2C2335,
            'message-avatar-background': 0x251D2C,
            'message-separator': 0x4A3A59,
            'message-time-colour': 0x888888,
            'message-compact-alternate-background': 0x4A3A59,
            'message-compact-highlight': 0x604C74,
            'sidebar-background': 0x2C2335,
            'sidebar-background-current': 0x4A3A59,
            'sidebar-background-highlight': 0x604C74,
            'sidebar-background-option': 0,
            'sidebar-box-shadow': 0x2C2335,
            'sidebar-selector-background-begin': 0x4A3A59,
            'sidebar-selector-background-end': 0x3B2F47,
            'sidebar-selector-background-hover': 0x4A3A59,
            'sidebar-selector-background-active': 0x3B2F47,
            'sidebar-selector-attention-shadow': 0xA591AD,
            'input-background': 0x2C2335,
            'input-box-shadow': 0x2C2335,
            'input-colour': 0xFFFFFF,
            'input-border': 0x4A3A59,
            'input-send': 0x4A3A59,
            'input-button-hover': 0x7E6397,
            'input-button-active': 0x59466B,
            'input-menu-background': 0x4A3A59,
            'input-menu-box-shadow': 0x4A3A59,
            'input-menu-button': 0x59466B,
            'input-menu-button-hover': 0x7E6397,
            'input-menu-button-active': 0x604C74,
            'settings-category-title-begin': 0x4A3A59,
            'settings-category-title-end': 0x3B2F47,
            'settings-input-border': 0x604C74,
            'settings-input-background': 0x3B2F47,
            'settings-input-colour': 0xFFFFFF,
            'settings-input-focus': 0x4A3A59,
            'settings-markup-link-colour': 0x1E90FF,
        },
        sizes: {
            'chat-box-shadow-y': 1,
            'chat-box-shadow-blur': 4,
            'sidebar-box-shadow-y': 1,
            'sidebar-box-shadow-blur': 4,
            'sidebar-selector-attention-shadow-blur': 10,
            'input-box-shadow-y': 1,
            'input-box-shadow-blur': 4,
            'input-menu-box-shadow-y': 1,
            'input-menu-box-shadow-blur': 4,
        },
    },
    {
        id: 'archaic',
        name: 'Archaic',
        scheme: 'dark',
        colours: {
            'main-accent': 0x333333,
            'main-background': 0,
            'main-colour': 0xFFFFFF,
            'scrollbar-foreground': 0x212121,
            'scrollbar-background': 0,
            'chat-background': 0,
            'chat-box-shadow': 0x888888,
            'message-avatar-background': 0x111111,
            'message-separator': 0x222222,
            'message-time-colour': 0x888888,
            'message-compact-alternate-background': 0x212121,
            'message-compact-highlight': 0x3A3A3A,
            'sidebar-background': 0,
            'sidebar-background-current': 0x212121,
            'sidebar-background-highlight': 0,
            'sidebar-background-option': 0,
            'sidebar-box-shadow': 0x888888,
            'sidebar-selector-background-begin': 0x212121,
            'sidebar-selector-background-end': 0x212121,
            'sidebar-selector-background-hover': 0x1A1A1A,
            'sidebar-selector-background-active': 0x111111,
            'sidebar-selector-attention-shadow': 0x888888,
            'input-background': 0,
            'input-box-shadow': 0x888888,
            'input-colour': 0xFFFFFF,
            'input-border': 0,
            'input-send': 0x111111,
            'input-button-hover': 0x333333,
            'input-button-active': 0x222222,
            'input-menu-background': 0,
            'input-menu-box-shadow': 0x888888,
            'input-menu-button': 0x111111,
            'input-menu-button-hover': 0x333333,
            'input-menu-button-active': 0x222222,
            'settings-category-title-begin': 0x212121,
            'settings-category-title-end': 0x212121,
            'settings-input-border': 0x888888,
            'settings-input-background': 0,
            'settings-input-colour': 0xFFFFFF,
            'settings-input-focus': 0,
            'settings-markup-link-colour': 0x1E90FF,
        },
        sizes: {
            'chat-box-shadow-spread': 1,
            'sidebar-box-shadow-spread': 1,
            'sidebar-selector-attention-shadow-blur': 10,
            'input-box-shadow-spread': 1,
            'input-menu-box-shadow-spread': 1,
        },
    },
];

const UmiThemeApply = function(theme) {
    const varPfx = '--theme-',
        themeType = typeof theme;
    if(themeType === 'number')
        theme = UmiThemes[theme];
    else if(themeType === 'string')
        for(const t of UmiThemes)
            if(t.id === theme) {
                theme = t;
                break;
            }

    if(typeof theme !== 'object')
        throw 'Invalid theme.';

    for(let propName in document.body.style) // this doesn't really work
        if(propName && propName.indexOf(varPfx) === 0)
            document.body.style.removeProperty(propName);

    document.body.classList.toggle('scheme-dark', theme.scheme === 'dark');
    document.body.classList.toggle('scheme-light', theme.scheme === 'light');
    if(typeof theme.scheme === 'string')
        document.body.style.setProperty(varPfx + 'scheme', theme.scheme);

    if(theme.colours) {
        if(typeof theme.colours['main-background'] === 'number') {
            const themeColour = $q('meta[name="theme-color"]');
            if(themeColour instanceof Element)
                themeColour.content = MamiColour.hex(theme.colours['main-background']);
        }

        const coloursPfx = varPfx + 'colour-';

        for(const propName in theme.colours) {
            document.body.style.setProperty(coloursPfx + propName, MamiColour.hex(theme.colours[propName]));
        }
    }

    if(theme.sizes) {
        const sizesPfx = varPfx + 'size-';

        for(const propName in theme.sizes)
            document.body.style.setProperty(
                sizesPfx + propName,
                theme.sizes[propName].toString() + 'px'
            );
    }
};
