chapters = [],

    annotations = [];

$(function(){

var global = {

    colorsIndex : 0,

    colors : 

};

//position de la video setCurrentTime

$(".indicateur-annotation").draggable({

    axis: "x",

    containment: "parent",

    drag: function(e, ui) {

        var t = myMedia.duration * parseInt(ui.helper.css("left")) / ( $(".timeline-annotations").width() - 2 * ui.helper.width() );

        myMedia.setCurrentTime(t);

    }

});

$('.timeline-annotations').bind('click', function(e){

    var x = e.pageX - $(this).offset().left;

    myMedia.setCurrentTime(myMedia.duration * x / $(this).width());

});

myProject.onLoad(function() {

    $(".project-title").text(myProject.title);

    $('.project-title-nav').text(myProject.title);

    myMedia = myProject.getCurrentMedia();

//load Chapitre

var _chapters = myProject.getAnnotationsByTypeTitle("chapitrage");

if(_chapters.length){

    $.each(_chapters, function(k, v){

        v.color = getRandomColor();

        chapters.push(v);

        if((k+1) == _chapters.length){

            renderChapter();

        }

    });

}

//load Annotations

var _annotations = myProject.getAnnotationsByTypeTitle("annotations");

if(_annotations.length){

    $.each(_annotations, function(k, v){

        v.color = getRandomColor();

        var type = v.content.mimetype.split('-');

        type = type[type.length-1]

        v.type = type;

        annotations.push(v);

        if((k+1) == _annotations.length){

            renderAnnotation();

        }

    });

}

    IriSP.htmlPlayer(

        myMedia,

        $(".main-video"),

        {

            width: 460,

            height: 345,

            controls: true,

            autostart: true,

            url_transform: function(src) {

                return [{

                    type: "video/mp4",

                    src: src.replace(/\.[\d\w]+$/,'.mp4')

                }, {

                    type: "video/webm",

                    src: src.replace(/\.[\d\w]+$/,'.webm')

                }];

            }

        }

    );

    myMedia.on("timeupdate", function(t) {

        //curseur chapitre

        var wContainer = $('.chapitre-cut-wrap').width() - 1,

            pos = wContainer * t / myMedia.duration,

            btnCutChapter = $('.btn-cut-chapter'),

            wBtnCutChapter = btnCutChapter.outerWidth();

        $(".indicateur-chapter, .indicateur-annotation").css("left",pos);

        if(pos+wBtnCutChapter>wContainer){

            btnCutChapter.css("left",(pos - wBtnCutChapter));

        }else{

            btnCutChapter.css("left",pos);

        }

        //annotations view

    });//timeupdate

});//myProject.onLoad

//display annotation view

$('.list-current-annotations').on('click', 'a', function(e){

    e.preventDefault();

    var annotationDisplayView = $('.annotation-display-view'),

        idAnnotation = $(this).attr('data-id');

    var annotation = _.find(annotations, function(c){ return c.id == idAnnotation; });

    if(annotationDisplayView.attr('data-id') == idAnnotation && annotationDisplayView.is(":visible")){

        annotationDisplayView.hide();

    }else{

        annotationDisplayView

            .attr('data-id', idAnnotation)

            .css('backgroundColor', annotation.color)

            .text(annotation.type)

            .show();

    }

});

//########### modal

    $(document).on('click', 'a.open-modal', function(e){

    });

//edition image

    $('.popup').on('change', '#media-type-select', function(e){

        var typeImage = $(this).val();

        $('.input-image-url, .input-image-upload').hide();

        $('.input-image-'+typeImage).show();

    });

//select on bibliotheque

    //confirmation suppression

    $("#modal-confirm").on('click', '#btn-delete-modal', function(e){

        var typeDelete = $(this).attr('data-type-delete'),

            idAnnotation = $(this).attr('data-id');

        if(typeDelete == 'chapter' || typeDelete == 'annotation'){

            e.preventDefault();

            if(typeDelete == 'chapter') deleteChapter(idAnnotation);

            if(typeDelete == 'annotation') deleteAnnotation(idAnnotation);

        }

    });

//--apercu projet

$(document).on('click', '.btn-apercu-projet.disabled', function(e){

    e.preventDefault();

});

//--title-editor

    $(document).on('click', '.project-title-editor i, .project-title', function () {

        var html = $('.project-title').html();

        var input = $('<input type="text" />');

        input.val(html);

        $('.project-title').replaceWith(input);

    });

    $(document).on('blur', '.project-title-editor input', function(){

        var newTitle = $(this).val();

        myProject.title = newTitle;

        $(this).replaceWith('<span class="project-title">'+newTitle+'</span></td>');

        $('.project-title-nav').text(newTitle);

    });

//######################## chapter

//edit

    $('.list-chapter-wrap').on('click', '.btn-edit-chapter', function(e){

        e.preventDefault();

        var idChapter = $(this).attr('data-chapter-id');

        loadFormChapter(idChapter);

    });

    $('.chapter-segments').on('click', 'li', function(){

        var idChapter = $(this).attr('id');

        loadFormChapter(idChapter);

    });

    $('.chapter-widget-info').on('keyup', 'input[name=title], textarea', function(e){

        var name = $(this).attr('name'),

            value = $(this).val();

        currentChapter[name] = value;

        if(name == 'title'){

            var idChapter = $(this).parents('form').attr('data-chapter-id');

            $('.chapter-segments').find('#'+idChapter).text(value);

            $('#row-list-chapter-'+idChapter).find('td:first').text(value);

        }

    });

    function loadFormChapter(idChapter){

        currentChapter = _.find(chapters, function(c){ return c.id == idChapter; });

        var chapterWrap = $('.chapter-widget-info'),

            indexChapter = _.indexOf(chapters, currentChapter),

            beginTangle = (indexChapter>0) ? true : false,

            endTangle = (indexChapter<(chapters.length-1)) ? true : false;

        currentChapter.beginTangle = beginTangle;

        currentChapter.endTangle = endTangle;

        var tpl = getTemplate('#tpl-chapter-edit');

            tpl = Mustache.render(tpl, currentChapter);

            chapterWrap.empty().append(tpl);

            chapterWrap.find('.tag-it').tagit(tagitParam);

        myMedia.setCurrentTime(currentChapter.begin);

    }

    function getTemplate(idTpl){

        return $('#templates').find(idTpl).html();

    }

//supprimer

$('.list-chapter-wrap').on('click', '.btn-delete-chapter', function(e){

    e.preventDefault();

    if(chapters.length == 1){alert('Le projet doit contenir au moins un chapitre.'); return;}

    var idChapter = $(this).attr('data-chapter-id'),

        btnDeleteModal = $("#modal-confirm #btn-delete-modal");

    btnDeleteModal.attr('data-type-delete', 'chapter');

    btnDeleteModal.attr('data-id', idChapter);

   // $("#modal-confirm #btn-delete-modal").attr('onclick', 'deleteChapter("'+idChapter+'")')

/*

    var idChapter = $(this).attr('data-chapter-id'),

        chapter = _.find(chapters, function(c){ return c.id == idChapter; }),

        indexChapter = _.indexOf(chapters, chapter),

        chapterModify;

    if(indexChapter == 0){

        chapterModify = chapters[1];

        chapterModify.setBegin(0);

    }else{

        chapterModify = chapters[indexChapter-1];

        //var newEnd = new IriSP.Model.Time(chapter.end)

        chapterModify.setEnd(chapter.end);

    }

    chapters = _(chapters).reject(function(c) { return c.id == idChapter; });

    renderChapter();

    //si le formulaire est visible

    if($('#form-chapter-edit-'+idChapter).length){

        $('#form-chapter-edit-'+idChapter).remove();

    }

*/

});

function deleteChapter(idChapter){

    $("#modal-confirm").modal('hide')

    var chapter = _.find(chapters, function(c){ return c.id == idChapter; }),

        indexChapter = _.indexOf(chapters, chapter),

        chapterModify;

    if(indexChapter == 0){

        chapterModify = chapters[1];

        chapterModify.setBegin(0);

    }else{

        chapterModify = chapters[indexChapter-1];

        //var newEnd = new IriSP.Model.Time(chapter.end)

        chapterModify.setEnd(chapter.end);

    }

    chapters = _(chapters).reject(function(c) { return c.id == idChapter; });

    renderChapter();

    //si le formulaire est visible

    if($('#form-chapter-edit-'+idChapter).length){

        $('#form-chapter-edit-'+idChapter).remove();

    }

}

function getRandomColor(){

    return global.colors[(global.colorsIndex<global.colors.length) ? global.colorsIndex++ : (global.colorsIndex=0)];

}

//nouveau chapitre

    function newChapter(dataChapter, render){

        var chapter = new IriSP.Model.Annotation(false, myProject);

            chapter.setMedia(myMedia.id);

            chapter.setBegin(dataChapter.begin);

            chapter.setEnd(dataChapter.end);

            chapter.title = dataChapter.title;

            chapter.description = dataChapter.description;

            chapter.keywords = dataChapter.keywords;

            chapter.color = getRandomColor();