from lib.snabbdom import h, patch
from message import *
import random
from view.utils import *
from model import Translation, Sense, Example
from browser import document

from export import export_to_xml


class View:
    def __init__(self, container):
        self.vdom = h('div', {}, "Loading...")
        self.model = None
        patch(container, self.vdom)
        
        # this does not work on parent div, so attaching to document here
        document.addEventListener("keyup", msg(KeyboardPress()))
    
    def view(self, model):
        self.model = model
        new_vdom = self._view()
        patch(self.vdom, new_vdom)
        self.vdom = new_vdom
    
    def _view(self):
        return h("div", {"on": { "click": msg(Reset()) }}, [
          View.view_entry(self.model.entry, self.model),
          h("button.blk", {"on": { "click": lambda _: check_export(self.model) } }, "CHK"),
          View.view_menu(self.model.menu_location, self.model.menu_target),
          View.view_modal(self.model.modal_shown, self.model.modal)])
       
    @staticmethod
    def view_entry(entry, model):
        view_sense_list = [View.view_sense(sense, idx, model) for idx, sense in enumerate(entry.senses)]
        
        return h("div#entry", {}, [
          h("div#entry-status", {}, entry.status),
          h("div#entry-header", {}, [
            h("span#headword", {}, entry.headword),
            h("span#grammar", {}, entry.grammar),
            h("span#measure", {}, entry.get_measure_text())]),
          View.view_entry_button_section(entry, model),
          h("div#sense-container", {}, view_sense_list),
          h("button.add-button", {"on": {"click": msg(AddSense())}}, "+")])
    
    
    @staticmethod
    def view_entry_button_section(entry, model):
        clk = lambda cls: {"on": {"click": msg(cls)}}
        buttons = [
            h("button.normal", clk(ShowVariantsEdit()), "Variante"),
            h("button.success", clk(ShowRelatedEntriesEdit()), "Povezano"),
            h("button.success", clk(ShowEntryLabelsEdit()), "Oznake"),
            h("button.normal", clk(ShowCommentEdit()), "Opombe")]
        
        view_buttons = []
        view_table = []
        
        if len(entry.variants) == 0:
            view_buttons.append(buttons[0])
        else:
            view_table.append((buttons[0], ", ".join(entry.variants)))
            
        if len(entry.related_entries) == 0:
            view_buttons.append(buttons[1])
        else:
            view_table.append((buttons[1], ", ".join(entry.related_entries)))
            
        if len(entry.labels) == 0:
            view_buttons.append(buttons[2])
        else:
            labels = ", ".join([clean_label(val) for _, val in entry.labels])
            view_table.append((buttons[2], labels))
            
        if entry.comment == "":
            view_buttons.append(buttons[3])
        else:
            view_table.append((buttons[3], entry.comment))
        
        table_rows = [
            h("tr", {}, [ h("td", {}, btn), h("td", {}, content)]) 
            for btn, content in view_table]
        
        view_buttons.append(h("table", {}, table_rows))
        return h("div", {}, view_buttons)
          
    @staticmethod
    def view_sense(sense, senseNum, model):
        examples = [View.view_example(example, model) for example in sense.examples]
        
        result = h("div.elm-div", {}, [
          h("div.sense-num", {"on": {"click": msg(ShowSenseMenu(sense))}}, str(senseNum + 1)),
          h("div.sense", {}, [
            h("span.sense-label-list", { "on": { "click": msg(ShowSenseLabelEdit(sense)) }}, [
                h("span.sense-label", {}, clean_label(slabel)) for _, slabel in sense.labels ]), 
            h("span.sense-definition", { "on": { "click": msg(ShowSenseDefinitionEdit(sense)) }}, sense.definition["indicator"]),
            h("div", {}, View.view_translations(sense.translations, sense, model)),
            h("div", {}, examples)])])
        return result
    
    @staticmethod
    def view_example(example, model):
        example_tag = "div.example-rest"
        if example in model.chosen_examples:
            example_tag += ".example-chosen"
        
        return h("div.example", {}, [
          h("div.example-dot", {"on": {"click": msg(ShowExampleMenu(example))} }, "▣"),
          h(example_tag, {}, [
            h("span.example-text", {"on": {"click": msg(ShowExampleEdit(example))}}, example.text),
            h("div.example-translation-list", {}, [
                h("div.example-translation", {}, [
                    h("span.example-arrow", {}, "↪"),
                    vt
                    ]) for vt in View.view_translations(example.translations, example, model)])])])
    
    @staticmethod
    def view_translations(translations, parent, model):
        result = []
        for cluster in translations:
            result.append(h("div.translation-div-cluster", {}, [View.view_one_translation(t, model) for t in cluster]))
        
        result.append(h("button.add-button", {"on": {"click": msg(ShowAddTranslation(parent))}}, "+"))
        return result
    
    @staticmethod
    def view_one_translation(translation, model):
        elements = []
    
        if translation.tags:
            tags = h("div.translation-tags", {}, [
              h("span", {"attr": {"title": key}}, clean_label(value)) 
              for key, value in translation.tags])
            elements.append(tags)
        
        elements.append(h("span.translation-text", {}, translation.translation))
        if translation.source:
            elements.append(h("span.translation-source", {}, translation.source))
            
        explanation_class = ".translation-explanation" if translation.translation else ""
        elements.append(h("span{}".format(explanation_class), {}, translation.explanation))
            
        return h("div.translation-div", {"on": {"click": msg(ShowTranslationMenu(translation)) }}, elements)

    
    @staticmethod
    def view_menu(location, menu_target): 
        style = {
            "left": "{}px".format(location[0]),
            "top": "{}px".format(location[1])
        }
        
        if menu_target is None:
            style["opacity"] = "0"
            style["visibility"] = "hidden"
        
        elif type(menu_target) is Translation:
            translation = menu_target
            return h("span.popup-menu", { "style": style }, [
                h("button.shyButton", { "on": {"click": msg(ShowEditTranslation(translation))}}, "✎"),
                h("button.shyButton", { "on": {"click": msg(MoveRight(translation))}}, "→"),
                h("button.shyButton", { "on": {"click": msg(MoveLeft(translation))}}, "←"),
                h("button.shyButton", { "on": {"click": msg(BinTranslation(translation))}}, "🗑")])
        
        elif type(menu_target) is Sense:
            sense = menu_target
            return h("span.popup-menu", { "style": style }, [
                h("button.shyButton", { "on": {"click": msg(SenseMoveUp(sense))}}, "↑"),
                h("button.shyButton", { "on": {"click": msg(SenseMoveDown(sense))}}, "↓"),
                h("button.shyButton", { "on": {"click": msg(SenseBin(sense))}}, "🗑")])
        
        elif type(menu_target) is Example:
            return h("span.popup-menu", { "style": style }, [
                h("button.shyButton", {}, "a"),
                h("button.shyButton", {}, "b"),
                h("button.shyButton", {}, "🗑")])
        else:
            console.log("Should not be heree!!")
        
        
    @staticmethod
    def view_modal(modal_shown, modal):
        return h("div.modal", {}, [
            h("input", { "props": {"type": "checkbox", "checked": modal_shown} }, ""), 
            h("label.overlay", {}, ""), 
            h("article", {"on": { "click": msg(NoReset()) }}, modal())])