$(function() {

    $(".fancybox").fancybox();

    $('.font-up a').click(function(){

        var taille_police=parseFloat($('.content').css('font-size'),100)+2;

        if(taille_police<30){

            var taille_ligne=parseFloat($('.content').css('line-height'),100)+2;

            $('.content').css({

                'line-height':taille_ligne+'px',

                'font-size':taille_police+'px'

            });

        }

        return false;

    });

    $('.font-down a').click(function(){

        var taille_police=parseFloat($('.content').css('font-size'),100)-2;

        if(taille_police>11){

            var taille_ligne=parseFloat($('.content').css('line-height'),100)-2;

            $('.content').css({

                'line-height':taille_ligne+'px',

                'font-size':taille_police+'px'

            });

        }

        return false;

    });

    /* ANNOTATION HANDLING */

    var basenode = $(".content")[0],

        cleanHtml = cleanTextNodes(basenode).innerHtml,

        textinfo = parseContents(basenode);

    window.annotations = window.annotations || [];

    var colors = ["#ff8", "#f88", "#8f8", "#8ff", "#f8f", "#88f"],

        currentVisibleFrame = null,

        ncol = 0,

        mousedown = false,

        shownByClick = false,

        dragging = false;

    function cleanText(txt, keepbefore, keepafter) {

        var res = txt.replace(/[\n\r\t]+/gm,' ').replace(/ {2,}/g,' ');

        if (!keepbefore) {

            res = res.replace(/^ +/,'');

        }

        if (!keepafter) {

            res = res.replace(/ +$/,'');

        }

        return res;

    }

    function recursiveParse(node, info) {

        var children = node.childNodes;

        for (var i = 0, l = children.length; i < l; i++) {

            var childnode = children[i];

            switch(childnode.nodeType) {

                case node.ELEMENT_NODE:

                    recursiveParse(childnode, info);

                break;

                case node.TEXT_NODE:

                    var startpos = info.text.length;

                    info.text += childnode.textContent;

                    var endpos = info.text.length,

                        nodeinfo = {

                            start: startpos,

                            end: endpos,

                            length: endpos - startpos,

                            textNode: childnode

                        };

                    childnode._nodeInfo = nodeinfo;

                    info.nodes.push(nodeinfo);

                break;

            }

        }

    }

    function parseContents(node) {

        var res = {

            text: '',

            nodes: []

        };

        recursiveParse(node, res);

        return res;

    }

    function cleanTextNodes(node) {

        var children = node.childNodes;

        for (var i = 0, l = children.length; i < l; i++) {

            var childnode = children[i];

            switch(childnode.nodeType) {

                case node.ELEMENT_NODE:

                    cleanTextNodes(childnode);

                break;

                case node.TEXT_NODE:

                    var keepbefore = (i && children[i-1].nodeType == node.ELEMENT_NODE),

                        keepafter = (i < l-1 && children[i+1].nodeType == node.ELEMENT_NODE);

                    childnode.textContent = cleanText(childnode.textContent, keepbefore, keepafter);

                break;

            }

        }

        return node;

    }

    function highlightText(start, end, color) {

        var annotation = {

            startOffset: start,

            length: end - start,

            color: color,

            comment: "",

            creator: currentUser,

            tags: [],

            annotatedText: textinfo.text.substring(start, end),

            beforeText: textinfo.text.substring(start - 40, start).replace(/^[\S]*\s+/,''),

            afterText: textinfo.text.substring(end, end + 40).replace(/\s+[\S]*$/,''),

            documentaryFile: currentDocumentaryFile

        }

        annotations.push(annotation);

        showAnnotation(annotation, true);

        updateAnnotationCounts();

    }

    var frameTpl = _.template(

        '<div class="annotation-frame" style="border-color: <%- annotation.color %>; top: <%-top %>px; left: <%- left %>px;">'

        + '<div class="annotation-area" style="background-color: <%- annotation.color %>; height: <%- height %>px;"></div>'

        + '<form class="annotation-form"><h3>Annoté par&nbsp;: <em><%- annotation.creator.name %></em></h3>'

        + '<h3>Dossier documentaire&nbsp;: <em><%- annotation.documentaryFile.name %></em></h3><h3>Commentaire&nbsp;:</h3>'

        + '<% if (editable) { %><textarea class="annotation-textarea" placeholder="Mon commentaire&hellip;"><%- annotation.comment || "" %></textarea>'

        + '<% } else { %><p><%- annotation.comment || "(sans commentaire)" %></p><% } %>'

        + '<h3>Mots-clés&nbsp;:</h3>'

        + '<ul class="<%- editable ? "annotation-tags-form" : "" %>"><% _(annotation.tags).forEach(function(tag) { %><li><%- tag %></li><% }) %></ul>'

        + '<% if (editable) { %><h3><input class="annotation-public" type="checkbox" <% if (annotation.isPublic) {%>checked <% } %>/>Annotation publique</h3><div><a class="annotation-remove" href="#">Supprimer</a><input class="annotation-submit" type="submit" value="Enregistrer" /></div><% } %>'

        + '</form></div>'

    );

    var liTpl = _.template(

        '<li style="border-color: <%- annotation.color %>;"><div class="annotation-longview"><h3>Texte annoté&nbsp;:</h3></div>'

        + '<p class="annotation-text"><%- annotation.beforeText %><b><%- annotation.annotatedText %></b><%- annotation.afterText %></p>'

        + '<h3>Annoté par&nbsp;: <em><%- annotation.creator.name %></em></h3>'

        + '<div class="annotation-longview"><h3>Commentaire&nbsp;:</h3><p class="annotation-comment"><%- annotation.comment || "(Sans commentaire)" %></p>'

        + '<h3>Mots-clés&nbsp;:</h3><p class="annotation-tags"><%- (annotation.tags || []).join(", ") || "(aucun mot-clé)" %></p></div>'

        + '</li>'

    );

    function showFrameBox() {

        if (currentVisibleFrame) {

            $(".annotation-frame-box").show();

            var offset = currentVisibleFrame.offset(),

                width = currentVisibleFrame.outerWidth(),

                height = currentVisibleFrame.outerHeight();

            $(".annotation-fb-top").css({

                height: offset.top - 77

            });

            $(".annotation-fb-left").css({

                top: offset.top,

                height: height,

                width: offset.left

            });

            $(".annotation-fb-right").css({

                top: offset.top,

                height: height,

                left: offset.left + width

            });

            var fbbtop = offset.top + height;

            $(".annotation-fb-bottom").css({

                top: fbbtop,

                height: ($("body").height() - fbbtop)

            });

            currentVisibleFrame.find(".annotation-textarea").focus();

        } else {

            $(".annotation-frame-box").hide();

        }

    }

    function hideAllFrames() {

        if (currentVisibleFrame) {

            currentVisibleFrame.hide();

        }

        currentVisibleFrame = null;

        showFrameBox();

        $(".annotation-blocks li").removeClass("selected");

    }

    function showAnnotation(annotation, editAfterShow) {

        var start = annotation.startOffset,

            end = annotation.length + start,

            color = annotation.color;

        var spans = [];

        for (var i = 0, l = textinfo.nodes.length; i < l; i++) {

            var nodeinfo = textinfo.nodes[i];

            if (nodeinfo.end > start && nodeinfo.start <= end) {

                var r = document.createRange(),

                    s = document.createElement('span'),

                    rangestart = Math.max(0, start - nodeinfo.start),

                    rangeend = Math.min(nodeinfo.length, end - nodeinfo.start);

                s.style.backgroundColor = color;

                r.setStart(nodeinfo.textNode, rangestart);

                r.setEnd(nodeinfo.textNode, rangeend);

                r.surroundContents(s);

                spans.push(s);

            }

        }

        textinfo = parseContents(basenode);

        var top = Math.min.apply(Math, spans.map(function(s) { return s.offsetTop })),

            height = Math.max.apply(Math, spans.map(function(s) { return s.offsetHeight + s.offsetTop })) - top,

            frame = $(frameTpl({

                annotation: annotation,

                editable: (currentUser.id === annotation.creator.id),

                top: top,

                height: height,

                left: basenode.offsetLeft

            })),

            li = $(liTpl({

                annotation: annotation

            }));

        $(".annotation-frames").append(frame);

        $(annotation.documentaryFile.id === currentDocumentaryFile.id ? ".annotation-file-list" : ".annotation-other-list").append(li);

        frame.find(".annotation-textarea").on("keyup paste input change", function() {

            annotation.comment = $(this).val();

            li.find(".annotation-comment").text(annotation.comment || "(Sans commentaire)");

        });

        frame.find(".annotation-public").change(function() {

            annotation.isPublic = $(this).is(":checked");

        });

        frame.find("")

        var ontagchange = function(evt, ui) {

            annotation.tags = $(this).tagit("assignedTags");

            li.find(".annotation-tags").text((annotation.tags || []).join(", ") || "(aucun mot-clé)");

        };

        frame.find(".annotation-tags-form").tagit({

            afterTagAdded: ontagchange,

            afterTagRemoved: ontagchange

        });

        var show = function() {

            if (mousedown) {

                return;

            }

            shownByClick = false;

            currentVisibleFrame = frame;

            frame.show();

            showFrameBox();

            li.addClass("selected");

        }

        $(spans).mouseenter(show);

        frame

            .mouseleave(function() {

                if (!shownByClick) {

                    hideAllFrames();

                }

            })

            .click(function() {

                shownByClick = true;

            });

        frame.find(".annotation-form").submit(function() {

            hideAllFrames();

            return false;

        });

        frame.find(".annotation-remove").click(function() {

            annotations = _(annotations).reject(function(a) {

                return a === annotation

            });

            $(spans).css("background-color","").off("mouseenter",show);

            li.remove();

            frame.remove();

            hideAllFrames();

            updateAnnotationCounts();

            return false;

        });

        li

            .mouseenter(function() {

                $(spans).addClass("annotation-selected");

                li.addClass("selected");

                li.find(".annotation-longview").stop().slideDown();

            })

            .mouseleave(function() {

                $(spans).removeClass("annotation-selected");

                li.removeClass("selected");

                li.find(".annotation-longview").stop().slideUp();

            })

            .click(function() {

                show();

                shownByClick = true;

                $(window).scrollTop(currentVisibleFrame.offset().top - 100);

            });

        if (editAfterShow) {

            show();

            shownByClick = true;

        }

    }

    function updateAnnotationCounts() {

        $(".annotation-blocks .block").each(function() {

            var $this = $(this), n = $this.find("li").length;

            $this.find(".annotations-count").text(n || "aucune");

            if (n > 1) {

                $this.find(".annotation-plural").show();

            } else {

                $this.find(".annotation-plural").hide();

            }

        })

    }

    annotations.forEach(function(annotation) {

        showAnnotation(annotation);

    });

    updateAnnotationCounts();

    var range = null;

    $(".content").mouseup(function(e) {

        range = document.getSelection().getRangeAt(0);

        var addann = $(".add-annotation");

        if (!range.collapsed && range.startContainer._nodeInfo && range.endContainer._nodeInfo && range.toString() !== " ") {

            addann.show();

            var doc = $(document), rect = range.getBoundingClientRect();

            addann.css({

                left: doc.scrollLeft() + rect.right + 5,

                top: doc.scrollTop() + (rect.top + rect.bottom - addann.outerHeight()) / 2,

            });

        } else {

            range = null;

            $(".add-annotation").hide();

        }

    }).mousedown(function() {

        $(".add-annotation").hide();

    });

    $(".add-annotation").click(function() {

        $(".add-annotation").hide();

        if (range) {

            var start = range.startOffset + range.startContainer._nodeInfo.start,

                end = range.endOffset + range.endContainer._nodeInfo.start;