/*!
 * Jodit Editor (https://xdsoft.net/jodit/)
 * License GNU General Public License version 2 or later;
 * Copyright 2013-2019 Valeriy Chupurnov https://xdsoft.net
 */

import { Config } from '../Config';
import { KEY_DOWN, KEY_ENTER, KEY_LEFT, KEY_RIGHT, KEY_UP } from '../constants';
import { Alert, Dialog } from '../modules/dialog/';
import { IControlType } from '../types/toolbar';
import { IJodit } from '../types';

declare module '../Config' {
    interface Config {
        specialCharacters: string[];
        usePopupForSpecialCharacters: boolean;
    }
}

Config.prototype.usePopupForSpecialCharacters = false;

Config.prototype.specialCharacters = [
    '!',
    '"',
    '#',
    '$',
    '%',
    '&',
    "'",
    '(',
    ')',
    '*',
    '+',
    '-',
    '.',
    '/',
    '0',
    '1',
    '2',
    '3',
    '4',
    '5',
    '6',
    '7',
    '8',
    '9',
    ':',
    ';',
    '<',
    '=',
    '>',
    '?',
    '@',
    'A',
    'B',
    'C',
    'D',
    'E',
    'F',
    'G',
    'H',
    'I',
    'J',
    'K',
    'L',
    'M',
    'N',
    'O',
    'P',
    'Q',
    'R',
    'S',
    'T',
    'U',
    'V',
    'W',
    'X',
    'Y',
    'Z',
    '[',
    ']',
    '^',
    '_',
    '`',
    'a',
    'b',
    'c',
    'd',
    'e',
    'f',
    'g',
    'h',
    'i',
    'j',
    'k',
    'l',
    'm',
    'n',
    'o',
    'p',
    'q',
    'r',
    's',
    't',
    'u',
    'v',
    'w',
    'x',
    'y',
    'z',
    '{',
    '|',
    '}',
    '~',
    '€',
    '‘',
    '’',
    '“',
    '”',
    '–',
    '—',
    '¡',
    '¢',
    '£',
    '¤',
    '¥',
    '¦',
    '§',
    '¨',
    '©',
    'ª',
    '«',
    '»',
    '¬',
    '®',
    '¯',
    '°',
    '²',
    '³',
    '´',
    'µ',
    '¶',
    '·',
    '¸',
    '¹',
    'º',
    '¼',
    '½',
    '¾',
    '¿',
    'À',
    'Á',
    'Â',
    'Ã',
    'Ä',
    'Å',
    'Æ',
    'Ç',
    'È',
    'É',
    'Ê',
    'Ë',
    'Ì',
    'Í',
    'Î',
    'Ï',
    'Ð',
    'Ñ',
    'Ò',
    'Ó',
    'Ô',
    'Õ',
    'Ö',
    '×',
    'Ø',
    'Ù',
    'Ú',
    'Û',
    'Ü',
    'Ý',
    'Þ',
    'ß',
    'à',
    'á',
    'â',
    'ã',
    'ä',
    'å',
    'æ',
    'ç',
    'è',
    'é',
    'ê',
    'ë',
    'ì',
    'í',
    'î',
    'ï',
    'ð',
    'ñ',
    'ò',
    'ó',
    'ô',
    'õ',
    'ö',
    '÷',
    'ø',
    'ù',
    'ú',
    'û',
    'ü',
    'ý',
    'þ',
    'ÿ',
    'Œ',
    'œ',
    'Ŵ',
    '&#374',
    '&#373',
    'ŷ',
    '‚',
    '‛',
    '„',
    '…',
    '™',
    '►',
    '•',
    '→',
    '⇒',
    '⇔',
    '♦',
    '≈',
];

Config.prototype.controls.symbol = {
    icon: 'omega',
    hotkeys: ['ctrl+shift+i', 'cmd+shift+i'],
    tooltip: 'Insert Special Character',
    popup: (editor: IJodit, current, control, close): any => {
        const container: HTMLElement | undefined = editor.events.fire(
            'generateSpecialCharactersTable.symbols'
        );
        if (container) {
            if (editor.options.usePopupForSpecialCharacters) {
                const box: HTMLDivElement = editor.ownerDocument.createElement(
                    'div'
                );
                box.classList.add('jodit_symbols');
                box.appendChild(container);
                editor.events.on(container, 'close_dialog', close);
                return box;
            } else {
                const dialog: Dialog = Alert(
                    container,
                    editor.i18n('Select Special Character'),
                    void 0,
                    'jodit_symbols'
                );
                const a: HTMLAnchorElement | null = container.querySelector(
                    'a'
                );
                a && a.focus();
                editor.events.on('beforeDestruct', () => {
                    dialog && dialog.close();
                });
            }
        }
    },
} as IControlType;

/**
 * The plugin inserts characters that are not part of the standard keyboard.
 */
export class symbols {
    private countInRow: number = 17;

    constructor(editor: IJodit) {
        editor.events.on('generateSpecialCharactersTable.symbols', () => {
            const container: HTMLDivElement = editor.create.fromHTML(
                    '<div class="jodit_symbols-container">' +
                        '<div class="jodit_symbols-container_table"><table><tbody></tbody></table></div>' +
                        '<div class="jodit_symbols-container_preview"><div class="jodit_symbols-preview"></div></div>' +
                        '</div>'
                ) as HTMLDivElement,
                preview: HTMLDivElement = container.querySelector(
                    '.jodit_symbols-preview'
                ) as HTMLDivElement,
                table: HTMLTableElement = container.querySelector(
                    'table'
                ) as HTMLTableElement,
                body: HTMLTableSectionElement = table.tBodies[0],
                chars: HTMLAnchorElement[] = [];

            for (
                let i: number = 0;
                i < editor.options.specialCharacters.length;

            ) {
                const tr: HTMLTableRowElement = editor.create.element('tr');

                for (
                    let j: number = 0;
                    j < this.countInRow &&
                    i < editor.options.specialCharacters.length;
                    j += 1, i += 1
                ) {
                    const td: HTMLTableCellElement = editor.create.element(
                            'td'
                        ),
                        a: HTMLAnchorElement = editor.create.fromHTML(
                            `<a
                                    data-index="${i}"
                                    data-index-j="${j}"
                                    href="javascript:void(0)"
                                    role="option"
                                    tabindex="-1"
                                >${editor.options.specialCharacters[i]}</a>`
                        ) as HTMLAnchorElement;

                    chars.push(a);
                    td.appendChild(a);
                    tr.appendChild(td);
                }
                body.appendChild(tr);
            }

            const self: symbols = this;

            editor.events
                .on(chars, 'focus', function(this: HTMLAnchorElement) {
                    preview.innerHTML = this.innerHTML;
                })
                .on(chars, 'mousedown', function(
                    this: HTMLAnchorElement,
                    e?: MouseEvent
                ) {
                    if (this && this.nodeName === 'A') {
                        editor.selection.focus();
                        editor.selection.insertHTML(this.innerHTML);
                        editor.events.fire(this, 'close_dialog');
                        e && e.preventDefault();
                        e && e.stopImmediatePropagation();
                    }
                })
                .on(chars, 'mouseenter', function(this: HTMLAnchorElement) {
                    if (this && this.nodeName === 'A') {
                        this.focus();
                    }
                })
                .on(chars, 'keydown', (e: KeyboardEvent) => {
                    const target: HTMLAnchorElement = e.target as HTMLAnchorElement;
                    if (target && target.nodeName === 'A') {
                        const index: number = parseInt(
                                target.getAttribute('data-index') || '0',
                                10
                            ),
                            jIndex: number = parseInt(
                                target.getAttribute('data-index-j') || '0',
                                10
                            );

                        let newIndex: number;

                        switch (e.which) {
                            case KEY_UP:
                            case KEY_DOWN:
                                newIndex =
                                    e.which === KEY_UP
                                        ? index - self.countInRow
                                        : index + self.countInRow;
                                if (chars[newIndex] === undefined) {
                                    newIndex =
                                        e.which === KEY_UP
                                            ? Math.floor(
                                                  chars.length / self.countInRow
                                              ) *
                                                  self.countInRow +
                                              jIndex
                                            : jIndex;

                                    if (newIndex > chars.length - 1) {
                                        newIndex -= self.countInRow;
                                    }
                                }

                                chars[newIndex] && chars[newIndex].focus();
                                break;
                            case KEY_RIGHT:
                            case KEY_LEFT:
                                newIndex =
                                    e.which === KEY_LEFT
                                        ? index - 1
                                        : index + 1;
                                if (chars[newIndex] === undefined) {
                                    newIndex =
                                        e.which === KEY_LEFT
                                            ? chars.length - 1
                                            : 0;
                                }

                                chars[newIndex] && chars[newIndex].focus();
                                break;
                            case KEY_ENTER:
                                editor.events.fire(target, 'mousedown');
                                e.stopImmediatePropagation();
                                e.preventDefault();
                                break;
                        }
                    }
                });

            return container;
        });
    }
}