IriSP.Widgets.AnnotationsList = function(player, config) {

    IriSP.Widgets.Widget.call(this, player, config);

    this.lastIds = [];

    var _this = this;

    this.throttledRefresh = IriSP._.throttle(function() {

        _this.refresh(false);

    }, 800);

    this.searchString = false;

    this.lastSearch = false;

};

IriSP.Widgets.AnnotationsList.prototype = new IriSP.Widgets.Widget();

IriSP.Widgets.AnnotationsList.prototype.defaults = {

    pre_draw_callback: function(){

        return this.importUsers();

    },

    /*

     * URL when the annotations are to be reloaded from an LDT-like segment API

     * e.g.

     * http://ldt.iri.centrepompidou.fr/ldtplatform/api/ldt/segments/{{media}}/{{begin}}/{{end}}?callback=?

     */

    ajax_url : false,

    /*

     * number of milliseconds before/after the current timecode when calling the

     * segment API

     */

    ajax_granularity : 600000, 

    default_thumbnail : "",

    /*

     * URL when the annotation is not in the current project, e.g.

     * http://ldt.iri.centrepompidou.fr/ldtplatform/ldt/front/player/{{media}}/{{project}}/{{annotationType}}#id={{annotation}}

     */

    foreign_url : "",

    annotation_type : false,

    refresh_interval : 0,

    limit_count : 20,

    newest_first : false,

    always_visible : false,

    start_visible: true,

    show_audio : true,

    show_filters : false,

    keyword_filter: true,

    date_filter: true,

    user_filter: true,

    segment_filter: true,

    latest_contributions_filter: false,

    current_day_filter: true,

    show_header : false,

    custom_header : false,

    annotations_count_header : true,

    show_creation_date : false,

    show_timecode : true,

    /*

     * Only annotation in the current segment will be displayed. Designed to work with the Segments Widget.

     */

    allow_annotations_deletion: false,

    /*

     * URL to call when deleting annotation. Expects a mustache template with {{annotation_id}}, ex /api/anotations/{{annotation_id}}/

     */

    api_delete_endpoint : "",

    api_delete_method: "DELETE",

    api_users_endpoint: "",

    api_users_method: "GET",

    make_name_string_function: function(params){

        return params.username ? params.username : "Anonymous";

    },

    filter_by_segments: false,

    segment_filter: true,

    segments_annotation_type: "chap",

    /*

     * Set to a username if you only want to display annotations from a given user

     */

    show_only_annotation_from_user: false,

    /*

     * Show a text field that filter annotations by username

     */

    tags : true,

    polemics : [{

        keyword: "++",

        background_color: "#c9ecc6"

    },{

        keyword: "--",

        background_color: "#f9c5c6"

    },{

        keyword: "??",

        background_color: "#cec5f9"

    },{

        keyword: "==",

        background_color: "#f9f4c6"

    }]

};

IriSP.Widgets.AnnotationsList.prototype.importUsers = function(){

    if (!this.source.users_data){

        this.usernames = Array();

        var _this = this,

            _list = this.getWidgetAnnotations(),

            usernames_list_string = "";

        _list.forEach(function(_annotation){

            if(_this.usernames.indexOf(_annotation.creator) == -1){

                _this.usernames.push(_annotation.creator);

            }

        });

        this.usernames.forEach(function(_username){

            usernames_list_string+=_username+","

        })

        usernames_list_string = usernames_list_string.substring(0, usernames_list_string.length - 1);

        _url = Mustache.to_html(this.api_users_endpoint, {usernames_list_string: encodeURIComponent(usernames_list_string), usernames_list_length: this.usernames.length});

        return IriSP.jQuery.ajax({

            async: false,

            url: _url,

            type: "GET",

            success: function(_data) {

                _this.source.users_data = _data.objects

            },

            error: function(_xhr, _error, _thrown) {

                console.log(_xhr)

                console.log(_error)

                console.log(_thrown)

            }

        })

    }

}

IriSP.Widgets.AnnotationsList.prototype.messages = {

    en: {

        voice_annotation: "Voice Annotation",

        now_playing: "Now playing...",

        everyone: "Everyone",

        header: "Annotations for this content",

        segment_filter: "All cuttings",

        latest_contributions: "Latest contributions",

        close_widget: "Close",

        confirm: "Confirm",

        cancel: "Cancel",

        annotation_deletion_delete: "You will delete this annotation : ",

        annotation_deletion_sending: "Your deletion request is being sent ... ",

        annotation_deletion_success: "The annotation has been deleted.",

        annotation_deletion_error: "There was an error contacting the server. The annotation has not been deleted."

    },

    fr: {

        voice_annotation: "Annotation Vocale",

        now_playing: "Lecture en cours...",

        everyone: "Tous",

        header: "Annotations sur ce contenu",

        segment_filter: "Tous les segments",

        latest_contributions: "Dernières contributions",

        close_widget: "Fermer",

        confirm: "Confirmer",

        cancel: "Annuler",

        annotation_deletion_delete: "Vous allez supprimer cette annotation: ",

        annotation_deletion_sending: "Votre demande de suppression est en cours d'envoi ... ",

        annotation_deletion_success: "L'annotation a été supprimée.",

        annotation_deletion_error: "Une erreur s'est produite en contactant le serveur. L'annotation n'a pas été supprimée."

    }

};

IriSP.Widgets.AnnotationsList.prototype.template =

    '{{#show_header}}<p class="Ldt-AnnotationsList-header">'

    +     '{{#custom_header}}{{custom_header}}{{/custom_header}}'

    +     '{{^custom_header}}{{l10n.header}}{{/custom_header}}'

    + '</p>{{/show_header}}'

    + '<div class="Ldt-AnnotationsListWidget">'

    +     '<div class="Ldt-AnnotationsList-ScreenMain">'

    +         '{{#show_filters}}'

    +         '<div class="Ldt-AnnotationsList-Filters">'

    +             '{{#keyword_filter}}<input class="Ldt-AnnotationsList-filter-text" id="Ldt-AnnotationsList-keywordsFilter" type="text" value=""></input>{{/keyword_filter}}'

    +             '{{#user_filter}}<select class="Ldt-AnnotationsList-filter-dropdown" id="Ldt-AnnotationsList-userFilter"><option selected value="">{{l10n.everyone}}</option></select>{{/user_filter}}'

    +             '{{#date_filter}}<label class="Ldt-AnnotationsList-filter-date">Date: <input id="Ldt-AnnotationsList-dateFilter" type="text"></input></label>{{/date_filter}}'

    +             '{{#segment_filter}}<label class="Ldt-AnnotationsList-filter-checkbox"><input type="checkbox" id="Ldt-AnnotationsList-ignoreSegmentsFilter">{{l10n.segment_filter}}</label>{{/segment_filter}}'

    +             '{{#latest_contributions_filter}}<label class="Ldt-AnnotationsList-filter-checkbox"><input type="checkbox" id="Ldt-AnnotationsList-latestContributionsFilter">{{l10n.latest_contributions}}</label>{{/latest_contributions_filter}}'

    +         '</div>'

    +         '{{/show_filters}}'

    +         '{{#show_audio}}<div class="Ldt-AnnotationsList-Audio"></div>{{/show_audio}}'

    +         '<ul class="Ldt-AnnotationsList-ul">'

    +         '</ul>'

    +     '</div>'    

    +     '{{#allow_annotations_deletion}}'

    +     '<div id="{{id}}" class="Ldt-AnnotationsList-Screen Ldt-AnnotationsList-ScreenDelete">'

    +         '<a title="{{l10n.close_widget}}" class="Ldt-AnnotationsList-Close" href="#"></a>' 

    +         '<ul class="Ldt-AnnotationsList-ul-ToDelete"></ul>'

    +         '{{l10n.annotation_deletion_delete}} <a class="Ldt-AnnotationsList-ConfirmDelete">{{l10n.confirm}}</a> <a class="Ldt-AnnotationsList-CancelDelete">{{l10n.cancel}}</a>'

    +     '</div>'

    +     '<div id="{{id}}" class="Ldt-AnnotationsList-Screen Ldt-AnnotationsList-ScreenSending">'

    +         '<a title="{{l10n.close_widget}}" class="Ldt-AnnotationsList-Close" href="#"></a>'  

    +         '{{l10n.annotation_deletion_sending}}'

    +     '</div>'

    +     '<div id="{{id}}" class="Ldt-AnnotationsList-Screen Ldt-AnnotationsList-ScreenSuccess">'

    +         '<a title="{{l10n.close_widget}}" class="Ldt-AnnotationsList-Close" href="#"></a>'  

    +         '{{l10n.annotation_deletion_success}}'

    +     '</div>'

    +     '<div id="{{id}}" class="Ldt-AnnotationsList-Screen Ldt-AnnotationsList-ScreenError">'

    +         '<a title="{{l10n.close_widget}}" class="Ldt-AnnotationsList-Close" href="#"></a>'  

    +         '{{l10n.annotation_deletion_error}}'

    +     '</div>'

    +     '{{/allow_annotations_deletion}}'

    + '</div>';

IriSP.Widgets.AnnotationsList.prototype.annotationTemplate = 

    '<li class="Ldt-AnnotationsList-li Ldt-TraceMe" trace-info="annotation-id:{{id}}, media-id:{{media_id}}" style="{{specific_style}}">'

    + '<div id="{{id}}" class="Ldt-AnnotationsList-ThumbContainer Ldt-AnnotationsList-Annotation-Screen Ldt-AnnotationsList-Annotation-ScreenMain">'

    + '<a href="{{url}}" draggable="true">'

    + '<img class="Ldt-AnnotationsList-Thumbnail" src="{{thumbnail}}" />'

    + '</a>'

    + '</div>'

    + '{{#allow_annotations_deletion}}'

    + '<div id={{id}} class="Ldt-AnnotationsList-DeleteButton">&#10006;</div>'

    + '{{/allow_annotations_deletion}}'

    + '{{#show_timecode}}<div class="Ldt-AnnotationsList-Duration">{{begin}} - {{end}}</div>{{/show_timecode}}'

    + '<h3 class="Ldt-AnnotationsList-Title" draggable="true">'

    + '<a {{#url}} href="{{url}}" {{/url}}>{{{htitle}}}</a>'

    + '</h3>'

    + '<p class="Ldt-AnnotationsList-Description">{{{hdescription}}}</p>'

    + '{{#created}}'

    + '<div class="Ldt-AnnotationsList-CreationDate">{{{created}}}</div>'

    + '{{/created}}'

    + '{{#tags.length}}'

    + '<ul class="Ldt-AnnotationsList-Tags">'

    + '{{#tags}}'

    + '{{#.}}'

    + '<li class="Ldt-AnnotationsList-Tag-Li">'

    + '<span>{{.}}</span>'

    + '</li>'

    + '{{/.}}'

    + '{{/tags}}'

    + '</ul>'

    + '{{/tags.length}}'

    + '{{#audio}}<div class="Ldt-AnnotationsList-Play" data-annotation-id="{{id}}">{{l10n.voice_annotation}}</div>{{/audio}}'    

    + '</li>';

// obj.url = this.project_url + "/" + media + "/" + annotations[i].meta.project

// + "/" + annotations[i].meta["id-ref"] + '#id=' + annotations[i].id;

IriSP.Widgets.AnnotationsList.prototype.ajaxSource = function() {

    var _currentTime = this.media.getCurrentTime(),

        _duration = this.media.duration;

    this.lastAjaxQuery = _currentTime;

    var _url = Mustache.to_html(this.ajax_url, {

        media : this.source.currentMedia.id,

        begin : Math.max(0, _currentTime - this.ajax_granularity),

        end : Math.min(_duration.milliseconds, _currentTime + this.ajax_granularity)

    });

    this.currentSource = this.player.loadMetadata(IriSP._.defaults({

        "url" : _url

    }, this.metadata));

};

IriSP.Widgets.AnnotationsList.prototype.showScreen = function(_screenName) {

    this.$.find('.Ldt-AnnotationsList-Screen' + _screenName).show()

        .siblings().hide();

}

IriSP.Widgets.AnnotationsList.prototype.ajaxMashup = function() {

    var _currentTime = this.media.getCurrentTime();

    var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime);

    if (typeof _currentAnnotation !== "undefined" && _currentAnnotation.id !== this.lastMashupAnnotation) {

        this.lastMashupAnnotation = _currentAnnotation.id;

        var _currentMedia = _currentAnnotation.getMedia(),

            _url = Mustache.to_html(this.ajax_url, {

                media : _currentMedia.id,

                begin : Math.max(0, _currentAnnotation.annotation.begin.milliseconds - this.ajax_granularity),

                end : Math.min(_currentMedia.duration.milliseconds, _currentAnnotation.annotation.end.milliseconds + this.ajax_granularity)

            });

        this.currentSource = this.player.loadMetadata(IriSP._.defaults({

            "url" : _url

        }, this.metadata));

    }

};

IriSP.Widgets.AnnotationsList.prototype.refresh = function(_forceRedraw) {

    _forceRedraw = (typeof _forceRedraw !== "undefined" && _forceRedraw);

    if (this.currentSource.status !== IriSP.Model._SOURCE_STATUS_READY) {

        return 0;

    }

    var _this = this,

        _currentTime = this.media.getCurrentTime();

    var _list = this.annotation_type ? this.currentSource.getAnnotationsByTypeTitle(this.annotation_type) : this.currentSource.getAnnotations();

    if (this.mashupMode) {

        var _currentAnnotation = this.source.currentMedia.getAnnotationAtTime(_currentTime);

        if (typeof _currentAnnotation !== "undefined") {

            _currentTime = _currentTime - _currentAnnotation.begin + _currentAnnotation.annotation.begin;

            var _mediaId = _currentAnnotation.getMedia().id;

            _list = _list.filter(function(_annotation) {

                return _annotation.getMedia().id === _mediaId;

            });

        }

    }

    _list = _list.filter(function(_annotation) {

        return _annotation.found !== false;

    });

    if ((this.filter_by_segments)&&(!(this.show_filters && this.segment_filter && this.ignoresegmentcheckbox_$[0].checked))) {

        /*

         *  A given annotation is considered "in" segment if the middle of it is between the segment beginning and the segment end. 

         *  Note this is meant to be used for "markings" annotations (not segments)

         */

        _segmentsAnnotation = this.currentSource.getAnnotationsByTypeTitle(this.segments_annotation_type)

        if (this.media.getTimeRange()){

            _currentSegments = _segmentsAnnotation.filter(function(_segment){

                return (_this.media.getTimeRange()[0] == _segment.begin && _this.media.getTimeRange()[1] == _segment.end)

            });

        }

        else {

            _currentSegments = _segmentsAnnotation.filter(function(_segment){

                return (_currentTime >= _segment.begin && _currentTime <= _segment.end)

            });

        }

        if (_currentSegments.length == 0) {

            _list = _list.filter(function(_annotation){

                return false;

            });

        }

        else {

            _list = _list.filter(function(_annotation){

                _annotation_time = (_annotation.begin+_annotation.end)/2;

                return (_currentSegments[0].begin <= _annotation_time && _currentSegments[0].end >= _annotation_time)

            });

        }

        if(this.annotations_count_header && this.annotations_count != _list.length){

            this.annotations_count = _list.length;

            this.refreshHeader();

        }

    }

    if (this.show_only_annotation_from_user){

        _list = _list.filter(function(_annotation){