src/widgets/AnnotationsList.js
changeset 1053 149a4ea20ea7
parent 1046 eb77616c245f
child 1055 b45522b1b2af
--- a/src/widgets/AnnotationsList.js	Fri Sep 18 14:42:52 2015 +0200
+++ b/src/widgets/AnnotationsList.js	Fri Sep 18 14:44:36 2015 +0200
@@ -12,6 +12,9 @@
 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.
@@ -37,14 +40,33 @@
     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
@@ -53,7 +75,6 @@
     /*
      * Show a text field that filter annotations by username
      */
-    filter_by_user: false,
     tags : true,
     polemics : [{
         keyword: "++",
@@ -70,18 +91,70 @@
     }]
 };
 
+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) {
+                console.log(_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"
+        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"
+        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."
     }
 };
 
@@ -91,29 +164,54 @@
     +     '{{^custom_header}}{{l10n.header}}{{/custom_header}}'
     + '</p>{{/show_header}}'
     + '<div class="Ldt-AnnotationsListWidget">'
-    + '{{#show_filters}}'
-    + '<div class="Ldt-AnnotationsList-Filters">'
-    +    '<input class="Ldt-AnnotationsList-filter-text" id="Ldt-AnnotationsList-keywordsFilter" type="text" value=""></input>'
-    +    '<select class="Ldt-AnnotationsList-filter-dropdown" id="Ldt-AnnotationsList-userFilter"><option selected value="">{{l10n.everyone}}</option></select>'
-    +    '<label class="Ldt-AnnotationsList-filter-date">Date: <input id="Ldt-AnnotationsList-dateFilter" type="text"></input></label>'
-    +    '<label class="Ldt-AnnotationsList-filter-checkbox"><input type="checkbox" id="Ldt-AnnotationsList-ignoreSegmentsFilter">Toutes annotations</label>'
-    + '</div>'
-    + '{{/show_filters}}'
-    + '{{#show_audio}}<div class="Ldt-AnnotationsList-Audio"></div>{{/show_audio}}'
-    + '<ul class="Ldt-AnnotationsList-ul">'
-    + '</ul>'
+    +     '<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 class="Ldt-AnnotationsList-ThumbContainer">'
+    + '<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 href="{{url}}">{{{htitle}}}</a>'
+    + '<a {{#url}} href="{{url}}" {{/url}}>{{{htitle}}}</a>'
     + '</h3>'
     + '<p class="Ldt-AnnotationsList-Description">{{{hdescription}}}</p>'
     + '{{#created}}'
@@ -130,7 +228,7 @@
     + '{{/tags}}'
     + '</ul>'
     + '{{/tags.length}}'
-    + '{{#audio}}<div class="Ldt-AnnotationsList-Play" data-annotation-id="{{id}}">{{l10n.voice_annotation}}</div>{{/audio}}'
+    + '{{#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
@@ -150,6 +248,11 @@
     }, 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);
@@ -189,7 +292,7 @@
         return _annotation.found !== false;
     });
     
-    if ((this.filter_by_segments)&&(!(this.show_filters && this.ignoresegmentcheckbox_$[0].checked))) {
+    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)
@@ -216,6 +319,10 @@
                 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){
@@ -240,25 +347,43 @@
     }
     
     if (this.show_filters){
-        _username = this.userselect_$[0].options[this.userselect_$[0].selectedIndex].value;
-        if (_username != "false")
-        {
-            _list = _list.filter(function(_annotation){
-                return _annotation.creator == _username
-            })
+        if (this.user_filter){
+            _username = this.userselect_$[0].options[this.userselect_$[0].selectedIndex].value;
+            if (_username != "false")
+            {
+                _list = _list.filter(function(_annotation){
+                    return _annotation.creator == _username
+                })
+            }
         }
+        if (this.keyword_filter){
         _keyword = this.keywordinput_$[0].value;
-        if (_keyword != ""){
-            _list = _list.filter(function(_annotation){
-               return _annotation.description.toLowerCase().match(_keyword.toLowerCase());
-            });
+            if (_keyword != ""){
+                _list = _list.filter(function(_annotation){
+                   return _annotation.description.toLowerCase().match(_keyword.toLowerCase());
+                });
+            }
         }
-        
-        
-        if(this.datefilterinput_$[0].value != ""){
-            _date = this.datefilterinput_$.datepicker("getDate");
-            _list = _list.filter(function(_annotation){
-                return ((_annotation.created.getDate() == _date.getDate())&&(_annotation.created.getMonth() == _date.getMonth())&&(_annotation.created.getFullYear() == _date.getFullYear()))
+        if (this.date_filter){
+            if(this.datefilterinput_$[0].value != ""){
+                _date = this.datefilterinput_$.datepicker("getDate");
+                _list = _list.filter(function(_annotation){
+                    return ((_annotation.created.getDate() == _date.getDate())&&(_annotation.created.getMonth() == _date.getMonth())&&(_annotation.created.getFullYear() == _date.getFullYear()));
+                });
+            }
+        }
+        if (this.latest_contributions_filter && this.latestcontributionscheckbox_$[0].checked){
+            _list = _list.sortBy(function(_annotation) {
+                return -_annotation.created.valueOf();
+            });
+            this.usernames.forEach(function(_user){
+                
+                latest_ann = _list.filter(function(_annotation){
+                    return _annotation.creator == _user;
+                })[0];
+                _list = _list.filter(function(_annotation){
+                    return _annotation.id == (latest_ann ? latest_ann.id : false) || _annotation.creator != _user;
+                });
             });
         }
         
@@ -295,7 +420,17 @@
             
             // Update : display creator
             if (_annotation.creator) {
-                _title = _annotation.creator;
+                var _users = _this.source.users_data.filter(function(_user_data){
+                    return _user_data.username == _annotation.creator
+                }),
+                    _user = {};
+                if (_users.length == 0){
+                    _user.username = _annotation.creator
+                }
+                else{
+                    _user = _users[0]
+                }
+                _title = _this.make_name_string_function(_user);
             }
             if (_annotation.title) {
                 var tempTitle = _annotation.title;
@@ -334,7 +469,8 @@
                 url : _url,
                 tags : _tags,
                 specific_style : (typeof _bgcolor !== "undefined" ? "background-color: " + _bgcolor : ""),
-                l10n: _this.l10n
+                l10n: _this.l10n,
+                allow_annotations_deletion: _this.allow_annotations_deletion
             };
             if (_this.show_audio && _annotation.audio && _annotation.audio.href && _annotation.audio.href != "null") {
                 _data.audio = true;
@@ -426,6 +562,8 @@
                 _$.html(IriSP.textFieldHtml(_$.text(), rx));
             });
         }
+
+        this.$.find(".Ldt-AnnotationsList-DeleteButton").click(_this.functionWrapper("onDeleteClick"))
     }
     
     if (this.ajax_url) {
@@ -441,6 +579,75 @@
     return _list.length;
 };
 
+IriSP.Widgets.AnnotationsList.prototype.onDeleteClick = function(event){
+    
+    ann_id = event.target.id;
+    console.log(ann_id)
+    delete_preview_$ = this.$.find(".Ldt-AnnotationsList-ul-ToDelete");
+    delete_preview_$.html("");
+    _list = this.getWidgetAnnotations()
+    _list = _list.filter(function(_annotation){
+        return _annotation.id == ann_id
+    })
+    var _annotation = _list[0],
+        _title = "",
+        _this = this;
+    console.log(_annotation)
+    if (_annotation.creator) {
+        var _users = _this.source.users_data.filter(function(_user_data){
+            return _user_data.username == _annotation.creator
+        }),
+            _user = {};
+        if (_users.length == 0){
+            _user.username = _annotation.creator
+        }
+        else{
+            _user = _users[0]
+        }
+        _title = _this.make_name_string_function(_user);
+    }
+    if (_annotation.title) {
+        var tempTitle = _annotation.title;
+        if( tempTitle.substr(0, _title.length + 1) == (_title + ":") ){
+            _title = "";
+        }
+        _title = _title + ( (_title=="") ? "" : ": ") + _annotation.title;
+    }
+    var _created = false;
+    if (this.show_creation_date) {
+        _created = _annotation.created.toLocaleDateString()+", "+_annotation.created.toLocaleTimeString();
+    }
+    var _data = {
+            id : _annotation.id,
+            media_id : _annotation.getMedia().id,
+            htitle : IriSP.textFieldHtml(_title),
+            hdescription : IriSP.textFieldHtml(_annotation.description),
+            begin : _annotation.begin.toString(),
+            end : _annotation.end.toString(),
+            created : _created,
+            show_timecode : this.show_timecode,
+            tags : false,
+            l10n: this.l10n,
+            allow_annotations_deletion: false
+    }
+    _html = Mustache.to_html(this.annotationTemplate, _data)
+    delete_preview_$.html(_html)
+    
+    this.$.find(".Ldt-AnnotationsList-ConfirmDelete").click(function(){
+        _this.sendDelete(ann_id);
+    });
+    
+    this.showScreen("Delete");    
+}
+
+IriSP.Widgets.AnnotationsList.prototype.refreshHeader = function() {
+    var annotation_count_string = " (" + this.annotations_count +" annotations)";
+    this.$.find('.Ldt-AnnotationsList-header').html("");
+    this.$.find('.Ldt-AnnotationsList-header').html(
+        this.custom_header && typeof this.custom_header == "string"? this.custom_header + annotation_count_string : this.l10n.header + annotation_count_string
+    );
+}
+
 IriSP.Widgets.AnnotationsList.prototype.hide = function() {
     var _this = this;
     if (this.visible){
@@ -448,6 +655,7 @@
         this.widget_$.slideUp(function(){
             _this.$.find('.Ldt-AnnotationsList-header').hide();            
         });
+        this.showScreen("Main")
     }
 }
 
@@ -456,6 +664,7 @@
         this.visible = true;
         this.$.find('.Ldt-AnnotationsList-header').show();
         this.widget_$.slideDown();
+        this.showScreen("Main")
     }
 }
 
@@ -470,34 +679,89 @@
     }
 };
 
+IriSP.Widgets.AnnotationsList.prototype.revertToMainScreen = function(){
+    if (this.$.find(".Ldt-AnnotationsList-ScreenMain").is(":hidden")){
+        this.showScreen("Main");
+    }
+}
+
+IriSP.Widgets.AnnotationsList.prototype.sendDelete = function(id){
+    console.log("deleting "+id)
+    var _this = this,
+        _url = Mustache.to_html(this.api_delete_endpoint, {annotation_id: id})
+    
+    IriSP.jQuery.ajax({
+        url: _url,
+        type: this.api_delete_method,
+        contentType: 'application/json',
+        success: function(_data) {
+            _this.showScreen('Success');
+            window.setTimeout(_this.functionWrapper("revertToMainScreen"),(_this.after_send_timeout || 2000));
+            _this.currentSource.getAnnotations().removeId(id);
+            _this.player.trigger("AnnotationsList.refresh");
+        },
+        error: function(_xhr, _error, _thrown) {
+            IriSP.log("Error when sending annotation", _thrown);
+            _this.showScreen('Error');
+            window.setTimeout(_this.functionWrapper("revertToMainScreen"),(_this.after_send_timeout || 2000));
+        }
+    });
+    this.showScreen('Sending');
+}
+
 IriSP.Widgets.AnnotationsList.prototype.draw = function() {
-    
     this.jwplayers = {};
     this.mashupMode = (this.media.elementType === "mashup");
     
     this.renderTemplate();
     
     var _this = this;
-        
+    
     this.list_$ = this.$.find(".Ldt-AnnotationsList-ul");
     this.widget_$ = this.$.find(".Ldt-AnnotationsListWidget");
-    this.userselect_$ = this.$.find("#Ldt-AnnotationsList-userFilter");
-    this.userselect_$.change(function(){
-        _this.player.trigger("AnnotationsList.refresh");
-    });
-    this.keywordinput_$ = this.$.find("#Ldt-AnnotationsList-keywordsFilter");
-    this.keywordinput_$.keyup(function(){
-        _this.player.trigger("AnnotationsList.refresh");
-    });
-    this.ignoresegmentcheckbox_$ = this.$.find("#Ldt-AnnotationsList-ignoreSegmentsFilter");
-    this.ignoresegmentcheckbox_$.click(function(){
-        _this.player.trigger("AnnotationsList.refresh");
-    });
-    this.datefilterinput_$ = this.$.find("#Ldt-AnnotationsList-dateFilter");
-    this.datefilterinput_$.datepicker({ dateFormat: 'dd/mm/yy' });
-    this.datefilterinput_$.change(function(){
-        _this.player.trigger("AnnotationsList.refresh")
-    })
+    
+    if (this.show_filters){
+        if (this.user_filter){
+            this.userselect_$ = this.$.find("#Ldt-AnnotationsList-userFilter");
+            this.userselect_$.change(function(){
+                _this.player.trigger("AnnotationsList.refresh");
+            });
+            this.userselect_$.html("<option selected value='false'>"+this.l10n.everyone+"</option>");
+            this.usernames.forEach(function(_user){
+                _this.userselect_$.append("<option value='"+_user+"'>"+_user+"</option>");
+            });
+        }
+        if (this.keyword_filter){
+            this.keywordinput_$ = this.$.find("#Ldt-AnnotationsList-keywordsFilter");
+            this.keywordinput_$.keyup(function(){
+                _this.player.trigger("AnnotationsList.refresh");
+            });
+            
+        }
+        if (this.segment_filter){
+            this.ignoresegmentcheckbox_$ = this.$.find("#Ldt-AnnotationsList-ignoreSegmentsFilter");
+            this.ignoresegmentcheckbox_$.click(function(){
+                _this.player.trigger("AnnotationsList.refresh");
+            });
+        }
+        if(this.date_filter){
+            this.datefilterinput_$ = this.$.find("#Ldt-AnnotationsList-dateFilter");
+            this.datefilterinput_$.datepicker({ dateFormat: 'dd/mm/yy' });
+            this.datefilterinput_$.change(function(){
+                _this.player.trigger("AnnotationsList.refresh")
+            })
+            if (this.current_day_filter){
+                currentDate = new Date();
+                this.datefilterinput_$.datepicker("setDate",currentDate);
+            }
+        }
+        if(this.latest_contributions_filter){
+            this.latestcontributionscheckbox_$ = this.$.find("#Ldt-AnnotationsList-latestContributionsFilter");
+            this.latestcontributionscheckbox_$.click(function(){
+                _this.player.trigger("AnnotationsList.refresh");
+            });
+        }
+    }
     
     this.source.getAnnotations().on("search", function(_text) {
         _this.searchString = _text;
@@ -518,24 +782,15 @@
             _this.currentSource.getAnnotations().trigger("clear-search");
         }
     });
+    
+    this.$.find(".Ldt-AnnotationsList-Close").click(function(){
+        _this.showScreen("Main");
+    })
+    
     this.source.getAnnotations().on("search-cleared", function() {
         _this.throttledRefresh();
     });
     
-    if (this.show_filters){
-        _usernames = Array();
-        _list = this.getWidgetAnnotations()
-        _list.forEach(function(_annotation){
-            if(_usernames.indexOf(_annotation.creator) == -1){
-                _usernames.push(_annotation.creator);
-            }
-        });
-        this.userselect_$.html("<option selected value='false'>"+this.l10n.everyone+"</option>");
-        _usernames.forEach(function(_user){
-            _this.userselect_$.append("<option value='"+_user+"'>"+_user+"</option>");
-        });
-    }
-    
     this.onMdpEvent("AnnotationsList.refresh", function() {
         if (_this.ajax_url) {
             if (_this.mashupMode) {
@@ -563,6 +818,10 @@
         }, this.refresh_interval);
     }
     
+    if (this.annotations_count_header){
+        this.annotations_count = false;
+    }
+    
     this.onMdpEvent("AnnotationsList.toggle","toggle");
     this.onMdpEvent("AnnotationsList.hide", "hide");
     this.onMdpEvent("AnnotationsList.show", "show");
@@ -580,9 +839,13 @@
     
     this.throttledRefresh();
     
+    this.showScreen("Main");
+    this.$.find(".Ldt-AnnotationsList-CancelDelete").click(function(){
+        _this.showScreen("Main")
+    });
+    
     this.visible = true;
     if (!this.start_visible){
         this.hide();
     }
-    
 };