 angular.module('markever', ['ui.ace'])
 
 angular.module('markever')
-.controller "EditorController", ['$scope','$window', '$http', '$sce',
-($scope, $window, $http, $sce) ->
+.controller "EditorController", ['$scope','$window', '$http', '$sce', 'enmlRenderer', 'scrollSyncor'
+($scope, $window, $http, $sce, enmlRenderer, scrollSyncor) ->
     # ------------------------------------------------------------------------------------------------------------------
     # define frequently-used jquery elements
     # ------------------------------------------------------------------------------------------------------------------

            allowedAttributes: [["href", ["a"]], ["style"]],
            removeAttrs: ["id", "class", "onclick", "ondblclick", "accesskey", "data", "dynsrc", "tabindex",],
        }
        cleaned_html = $.htmlClean($html_div_hidden.html(), html_clean_option);
        # FIXME hack for strange class attr not removed
        cleaned_html = cleaned_html.replace(/class="[^"]*"/g, "")

        # embbed raw markdown content into the html
        cleaned_html = cleaned_html +
            "<center style='display:none'>" +
            $('<div />').text(vm.markdown).html() +
            "</center>"

        # add XML header & wrap with <en-note></en-note>

    # ------------------------------------------------------------------------------------------------------------------
    vm.save_note = ->
        # fill the hidden html div
        html_div_hidden = $("#md_html_div_hidden")
        final_note_xml = enmlRenderer.getEnmlFromElement(html_div_hidden, vm.markdown)
        # set title to content of first H1 tag
        title = "New Note - Markever"
        if html_div_hidden.find("h1").size() > 0
            title = html_div_hidden.find("h1").text()
        else if html_div_hidden.find("h2").size() > 0
            title = html_div_hidden.find("h2").text()
        else if html_div_hidden.find("h3").size() > 0
            title = html_div_hidden.find("h3").text()
        else if html_div_hidden.find("p").size() > 0
            title = html_div_hidden.find("p").text()
        # invoke the api
        $.post("/api/v1/notes", {title: title, contentXmlStr: final_note_xml})
            .done (data) ->
                alert("create note succeed: \n" + JSON.stringify(data))
            .fail (data) ->
                alert("create note failed: \n" + JSON.stringify(data))
]


# ----------------------------------------------------------------------------------------------------------------------
# Service: enmlRenderer
# ----------------------------------------------------------------------------------------------------------------------
angular.module('markever').factory 'enmlRenderer', ->
    getEnmlFromElement = (jq_element, markdown) ->
        # highlight code & style Latex
        jq_element.find('pre code').each (i, block) ->
            hljs.highlightBlock(block)
        MathJax.Hub.Queue(["Typeset", MathJax.Hub, jq_element.get(0)])

        # remove all script tags
        jq_element.find("script").remove()

        # add inline style
        # refer: https://github.com/Karl33to/jquery.inlineStyler
