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

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

    this.lastIds = [];

    var _this = this;

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

        _this.refresh(full);

    }, 800);

    this.searchString = false;

    this.lastSearch = false;

    this.localSource = undefined;

};

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 : "",

    custom_external_icon : "",

    /*

     * 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,

    show_title: true,

    show_audio: true,

    show_creator: true,

    show_controls: false,

    show_end_time: true,

    show_publish: false,

    show_twitter: false,

    twitter_hashtag: '',

    // Callback for Edit action. Leave undefined for default action.

    on_edit: undefined,

    publish_type: "PublicContribution",

    // Used to publish annotations

    api_endpoint_template: "",

    api_serializer: "ldt_annotate",

    api_method: "POST",

    editable: false,

    // Id that will be used as localStorage key

    editable_storage: "",

    widget_max_height: 680,

    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,

    annotations_count_header_string: "annotations",

    show_creation_date : false,

    show_timecode : true,

    show_end_time : true,

    project_id: "",

    /*

     * 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.api_users_endpoint){

        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...",

        previous: "Previous",

        next: "Next",

        set_time: "Double-click to update to current player time",

        edit_annotation: "Edit note",

        delete_annotation: "Delete note",

        publish_annotation: "Make note public",

        import_annotations: "Paste or load notes in this field and press Import.",

        confirm_delete_message: "You are about to delete {{ annotation.title }}. Are you sure you want to delete it?",

        confirm_publish_message: "You are about to publish {{ annotation.title }}. Are you sure you want to make it public?",

        tweet_annotation: "Tweet annotation",

        external_annotation: "This annotation was submitted to another project",

        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...",

        previous: "Précédent",

        next: "Suivant",

        set_time: "Double-cliquer pour fixer au temps du lecteur",

        edit_annotation: "Éditer la note",

        delete_annotation: "Supprimer la note",

        publish_annotation: "Rendre la note publique",

        import_annotations: "Copiez ou chargez des notes dans ce champ et appuyez sur Import",

        confirm_delete_message: "Vous allez supprimer {{ annotation.title }}. Êtes-vous certain(e) ?",

        confirm_publish_message: "Vous allez publier {{ annotation.title }}. Êtes-vous certain(e) ?",

        tweet_annotation: "Tweeter l'annotation",

        external_annotation: "Cette annotation a été postée sur un autre projet",

        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_controls}}<div class="Ldt-AnnotationsList-Controls"><span class="Ldt-AnnotationsList-Control-Prev">{{ l10n.previous }}</span> | <span class="Ldt-AnnotationsList-Control-Next">{{ l10n.next }}</span></div>{{/show_controls}}'

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

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

    +         '</ul>'

    +     '</div>'    

    +     '{{#allow_annotations_deletion}}'

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

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

    +         '{{l10n.annotation_deletion_delete}}'

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

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

    +     '</div>'

    +     '<div data-annotation="{{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 data-annotation="{{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 data.annotation="{{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-Highlighter-Annotation Ldt-TraceMe" data-annotation="{{ id }}" data-begin="{{ begin_ms }}" data-end="{{ end_ms }}" trace-info="annotation-id:{{id}}, media-id:{{media_id}}" style="{{specific_style}}">'

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

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

    +     '<img title="{{^external}}{{ begin }} - {{ end }}{{/external}}{{#external}}{{l10n.external_annotation}}{{/external}}" class="Ldt-AnnotationsList-Thumbnail" src="{{thumbnail}}" />'

    +     '{{#external}}<div title="{{l10n.external_annotation}}" class="Ldt-AnnotationsList-External-Icon"></div>{{/external}}'

    +   '</a>'

    + '</div>'

    + '{{#allow_annotations_deletion}}'

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

    + '{{/allow_annotations_deletion}}'

    + '{{#show_timecode}}<div title="{{l10n.set_time}}" class="Ldt-AnnotationsList-Duration"><span class="Ldt-AnnotationsList-Begin Ldt-live-editable Ldt-AnnotationsList-TimeEdit" data-editable_value="{{begin}}" data-editable_id="{{id}}" data-editable_field="begin" data-editable_type="timestamp">{{begin}}</span>{{#show_end_time}} - <span class="Ldt-AnnotationsList-End Ldt-live-editable" data-editable_value="{{end}}" data-editable_id="{{id}}" data-editable_field="end" data-editable_type="timestamp">{{end}}</span>{{/show_end_time}}</div>{{/show_timecode}}'

    + '<h3 class="Ldt-AnnotationsList-Title Ldt-Annotation-Timecode" data-timecode="{{ begin_ms }}" draggable="true">'

    + '{{#show_title}}<span class="Ldt-AnnotationsList-TitleContent Ldt-live-editable" data-editable_value="{{title}}" data-editable_type="multiline" data-editable_id="{{id}}" data-editable_field="title">{{{htitle}}}</span>{{/show_title}}'

    + '{{#show_creator}}<span class="Ldt-AnnotationsList-Creator">{{ creator }}</span>{{/show_creator}}'

    + '</h3>'

    + '<p class="Ldt-AnnotationsList-Description Ldt-live-editable" data-editable_type="multiline" data-editable_value="{{description}}" data-editable_id="{{id}}" data-editable_field="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}}'

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

    +    '{{#show_twitter}}<a title="{{l10n.tweet_annotation}}" target="_blank" href="https://twitter.com/intent/tweet?{{twitter_param}}"><img width="16" height="16" src="metadataplayer/img/twitter.svg"></a>{{/show_twitter}}'

    +    '{{#show_publish}}<div title="{{l10n.publish_annotation}}" class="Ldt-AnnotationsList-PublishAnnotation" data-editable_id="{{id}}"></div>{{/show_publish}}'

    +    '{{#editable}}<div title="{{l10n.edit_annotation}}" class="Ldt-AnnotationsList-Edit" data-editable_id="{{id}}"></div>'

    +    '<div title="{{l10n.delete_annotation}}" class="Ldt-AnnotationsList-Delete" data-editable_id="{{id}}"></div>{{/editable}}'

    + '</div>'

    + '</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));

    }

};

/*

 * Import annotations