Annotation Tools: PR Fixes

- Fixed camel case for variable name
- Fixed indentation in imageannotation.html
- Changed all mentions of Instructor Username to Email
- Turned annotation_mode into phrase
- Fixed indentation in imageannotation.html
- Added comments in imageannotation.html

- Changing annotation_mode in OSDA

common/lib/xmodule/xmodule/imageannotation_module.py

@@ -69,17 +69,18 @@ class AnnotatableFields(object):
         scope=Scope.settings,
         default="myNotes",
     )
-    instructor_username = String(
-        display_name=_("Username for 'Instructor' Annotations"),
-        help=_("Username that will be attached to all annotations that will be found in 'Instructor' tab."),
+    # currently only supports one instructor, will build functionality for multiple later
+    instructor_email = String(
+        display_name=_("Email for 'Instructor' Annotations"),
+        help=_("Email of the user that will be attached to all annotations that will be found in 'Instructor' tab."),
         scope=Scope.settings,
         default="",
     )
     annotation_mode = String(
         display_name=_("Mode for Annotation Tool"),
-        help=_("Type in number corresponding to following modes: 1 = only instructor can annotate , 2 = Everyone can annotate"),
+        help=_("Type in number corresponding to following modes:  'instructor' or 'everyone'"),
         scope=Scope.settings,
-        default="2",
+        default="everyone",
     )
 
 
@@ -123,7 +124,7 @@ class ImageAnnotationModule(AnnotatableFields, XModule):
             'tag': self.instructor_tags,
             'openseadragonjson': self.openseadragonjson,
             'default_tab': self.default_tab,
-            'instructor_username': self.instructor_username,
+            'instructor_email': self.instructor_email,
             'annotation_mode': self.annotation_mode,
         }
 

common/lib/xmodule/xmodule/textannotation_module.py

@@ -71,17 +71,18 @@ class AnnotatableFields(object):
         scope=Scope.settings,
         default="myNotes",
     )
-    instructor_username = String(
-        display_name=_("Username for 'Instructor' Annotations"),
-        help=_("Username that will be attached to all annotations that will be found in 'Instructor' tab."),
+    # currently only supports one instructor, will build functionality for multiple later
+    instructor_email = String(
+        display_name=_("Email for 'Instructor' Annotations"),
+        help=_("Email of the user that will be attached to all annotations that will be found in 'Instructor' tab."),
         scope=Scope.settings,
         default="",
     )
     annotation_mode = String(
         display_name=_("Mode for Annotation Tool"),
-        help=_("Type in number corresponding to following modes: 1 = only instructor can annotate , 2 = Everyone can annotate"),
+        help=_("Type in number corresponding to following modes:  'instructor' or 'everyone'"),
         scope=Scope.settings,
-        default="2",
+        default="everyone",
     )
 
 
@@ -120,7 +121,7 @@ class TextAnnotationModule(AnnotatableFields, XModule):
             'token': retrieve_token(self.user_email, self.annotation_token_secret),
             'diacritic_marks': self.diacritics,
             'default_tab': self.default_tab,
-            'instructor_username': self.instructor_username,
+            'instructor_email': self.instructor_email,
             'annotation_mode': self.annotation_mode,
         }
         fragment = Fragment(self.system.render_template('textannotation.html', context))

common/lib/xmodule/xmodule/videoannotation_module.py

@@ -63,17 +63,18 @@ class AnnotatableFields(object):
         scope=Scope.settings,
         default="myNotes",
     )
-    instructor_username = String(
-        display_name=_("Username for 'Instructor' Annotations"),
-        help=_("Username that will be attached to all annotations that will be found in 'Instructor' tab."),
+    # currently only supports one instructor, will build functionality for multiple later
+    instructor_email = String(
+        display_name=_("Email for 'Instructor' Annotations"),
+        help=_("Email of the user that will be attached to all annotations that will be found in 'Instructor' tab."),
         scope=Scope.settings,
         default="",
     )
     annotation_mode = String(
         display_name=_("Mode for Annotation Tool"),
-        help=_("Type in number corresponding to following modes: 1 = only instructor can annotate , 2 = Everyone can annotate"),
+        help=_("Type in number corresponding to following modes:  'instructor' or 'everyone'"),
         scope=Scope.settings,
-        default="2",
+        default="everyone",
     )
 
 class VideoAnnotationModule(AnnotatableFields, XModule):
@@ -125,7 +126,7 @@ class VideoAnnotationModule(AnnotatableFields, XModule):
             'annotation_storage': self.annotation_storage_url,
             'token': retrieve_token(self.user_email, self.annotation_token_secret),
             'default_tab': self.default_tab,
-            'instructor_username': self.instructor_username,
+            'instructor_email': self.instructor_email,
             'annotation_mode': self.annotation_mode,
         }
         fragment = Fragment(self.system.render_template('videoannotation.html', context))

common/static/js/vendor/ova/OpenSeaDragonAnnotation.js

@@ -380,7 +380,7 @@ Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301, USA.
                 clickTimeThreshold: viewer.clickTimeThreshold,
                 clickDistThreshold: viewer.clickDistThreshold
             });
-            if(this.options.viewer.annotation_mode == "2" || this.options.viewer.flags){
+            if(this.options.viewer.annotation_mode == "everyone" || this.options.viewer.flags){
                 /* Set elements to the control menu */
                 viewer.annotatorControl  = viewer.wrapperAnnotation.element;
                 if( viewer.toolbar ){

common/static/js/vendor/ova/catch/js/catch.js

@@ -42,29 +42,29 @@ annotationList:
                 '</div>'+
 
                 '<div class="annotatedBy field">'+
-                    'User'+
+                    gettext('User')+
                 '</div>'+
 
                 '<div class="body field">'+
-                    'Annotation'+
+                    gettext('Annotation')+
                 '</div>'+  
                 
                 '{{#if videoFormat}}'+
                     '<div class="start field">'+
-                        'Start'+
+                        gettext('Start')+
                     '</div>'+
 
                     '<div class="end field">'+
-                        'End'+
+                        gettext('End')+
                     '</div>'+
                 '{{/if}}'+
                 
                 '<div class="totalreplies field">'+
-                    '#Replies'+
+                    gettext('#Replies')+
                 '</div>'+
                 
                 '<div class="annotatedAt field">'+
-                    'Date posted'+
+                    gettext('Date posted')+
                 '</div>'+
             '</div>'+
         '</div>'+
@@ -73,41 +73,41 @@ annotationList:
         '{{/each}}'+
     '</div>'+
     '<div class="annotationListButtons">'+
-        '<div class="moreButtonCatch">More</div>'+
+        '<div class="moreButtonCatch">'+gettext('More')+'</div>'+
     '</div>',
     
 //Main->PublicPrivateInstructor
 annotationPublicPrivateInstructor:
-    '<div class="selectors"><div class="PublicPrivate myNotes active">My Notes<span class="action">myNotes</span></div>'+ 
-    '<div class="PublicPrivate instructor"> Instructor<span class="action">instructor</span></div>'+
-    '<div class="PublicPrivate public"> Public<span class="action">public</span></div></div>'+
-    '<div class="searchbox"><div class="searchinst">Search</div><select class="dropdown-list">'+
-    '<option>Users</option>'+
-    '<option>Tags</option>'+
-    '<option>Annotation Text</option>'+
-    '</select><input type="text" name="search"/><div class="search-icon" alt="Run search."></div><div class="clear-search-icon" alt="Clear search.">Clear</div></div>',
+    '<div class="selectors"><div class="PublicPrivate myNotes active">'+gettext('My Notes')+'<span class="action">myNotes</span></div>'+ 
+    '<div class="PublicPrivate instructor"> '+gettext('Instructor')+'<span class="action">instructor</span></div>'+
+    '<div class="PublicPrivate public"> '+gettext('Public')+'<span class="action">public</span></div></div>'+
+    '<div class="searchbox"><div class="searchinst">'+gettext('Search')+'</div><select class="dropdown-list">'+
+    '<option>'+gettext('Users')+'</option>'+
+    '<option>'+gettext('Tags')+'</option>'+
+    '<option>'+gettext('Annotation Text')+'</option>'+
+    '</select><input type="text" name="search"/><div class="search-icon" alt="Run search."></div><div class="clear-search-icon" alt="Clear search.">'+gettext('Clear')+'</div></div>',
     
 //Main->PublicPrivate
 annotationPublicPrivate:
-    '<div class="selectors"><div class="PublicPrivate myNotes active">My Notes<span class="action">myNotes</span></div>'+ 
-    '<div class="PublicPrivate public"> Public<span class="action">public</span></div></div>'+
-    '<div class="searchbox"><div class="searchinst">Search</div><select class="dropdown-list">'+
-    '<option>Users</option>'+
-    '<option>Tags</option>'+
-    '<option>Annotation Text</option>'+
-    '</select><input type="text" name="search"/><div class="search-icon" alt="Run search."></div><div class="clear-search-icon" alt="Clear search.">Clear</div></div>',
+    '<div class="selectors"><div class="PublicPrivate myNotes active">'+gettext('My Notes')+'<span class="action">myNotes</span></div>'+ 
+    '<div class="PublicPrivate public"> '+gettext('Public')+'<span class="action">public</span></div></div>'+
+    '<div class="searchbox"><div class="searchinst">'+gettext('Search')+'</div><select class="dropdown-list">'+
+    '<option>'+gettext('Users')+'</option>'+
+    '<option>'+gettext('Tags')+'</option>'+
+    '<option>'+gettext('Annotation Text')+'</option>'+
+    '</select><input type="text" name="search"/><div class="search-icon" alt="Run search."></div><div class="clear-search-icon" alt="Clear search.">'+gettext('Clear')+'</div></div>',
     
 //Main->MediaSelector
 annotationMediaSelector:
     '<ul class="ui-tabs-nav">'+
         '<li class="ui-state-default" media="text">'+
-            'Text'+
+            gettext('Text')+
         '</li>'+
         '<li class="ui-state-default" media="video">'+
-            'Video'+
+            gettext('Video')+
         '</li>'+
         'li class="ui-state-default" media="image">'+
-            'Image'+
+            gettext('Image')+
         '</li>'+
     '</ul>',
 
@@ -137,7 +137,7 @@ annotationReply:
                         '<div class="map"></div>'+
                     '</div>'+
                     '{{/if}}'+
-                    '<div class="deleteReply">Delete</div>'+
+                    '<div class="deleteReply">'+gettext('Delete')+'</div>'+
                 '</p>'+
                 '<p>'+
                     '{{#if this.text}}'+
@@ -244,13 +244,13 @@ annotationDetail:
         '</div>'+
 
         '<div class="controlReplies">'+
-            '<div class="newReply" style="text-decoration:underline">Reply</div>&nbsp;'+
+            '<div class="newReply" style="text-decoration:underline">'+gettext('Reply')+'</div>&nbsp;'+
             '<div class="hideReplies" style="text-decoration:underline;display:{{#if hasReplies}}block{{else}}none{{/if}}">Show Replies</div>&nbsp;'+
             '{{#if authToEditButton}}'+
-                '<div class="editAnnotation" style="text-decoration:underline">Edit</div>'+
+                '<div class="editAnnotation" style="text-decoration:underline">'+gettext('Edit')+'</div>'+
             '{{/if}}'+
             '{{#if authToDeleteButton}}'+
-                '<div class="deleteAnnotation" style="text-decoration:underline">Delete</div>'+
+                '<div class="deleteAnnotation" style="text-decoration:underline">'+gettext('Delete')+'</div>'+
             '{{/if}}'+
         '</div>'+
         
@@ -259,7 +259,7 @@ annotationDetail:
         
     '{{#if tags}}'+
         '<div class="tags">'+
-            '<h3>Tags:</h3>'+
+            '<h3>'+gettext('Tags:')+'</h3>'+
             '{{#each tags}}'+
                 '<div class="tag">'+
                     '{{this}}'+
@@ -348,14 +348,22 @@ CatchAnnotation.prototype = {
         this.HTMLTEMPLATES = CatchSources.HTMLTEMPLATES(this.options.imageUrlRoot);
         this.TEMPLATES = {};
         this._compileTemplates();
+        
+        // the default annotations are the user's personal ones instead of instructor
+        // if the default tab is instructor, we must refresh the catch to pull the ones
+        // under the instructor's email. passing empty strings as arguments will default
+        // to pulling the annotations for the email within this.options.userId.
         if(this.options.default_tab.toLowerCase() == 'instructor'){
-            this.options.userId = this.options.instructor_username;
+            this.options.userId = this.options.instructor_email;
             this._refresh('','');
         }
     },
 //    
 //     GLOBAL UTILITIES
 // 
+    getTemplate: function(templateName){
+        return this.TEMPLATES[templateName]() || '';
+    },
     refreshCatch: function(newInstance) {
         var mediaType = this.options.media || 'text',
             annotationItems = [],
@@ -396,18 +404,16 @@ CatchAnnotation.prototype = {
         
         if (newInstance){
             var videoFormat = (mediaType === "video") ? true:false;
-            var publicprivatetemplate = '';
+            var publicPrivateTemplate = '';
             if (self.options.showPublicPrivate) {
-                if(self.options.instructor_username != ''){
-                    publicprivatetemplate = self.TEMPLATES.annotationPublicPrivateInstructor();
-                } else{
-                    publicprivatetemplate = self.TEMPLATES.annotationPublicPrivate();
-                }
+                var templateName = this.options.instructor_email ? 
+                    "annotationPublicPrivateInstructor" : 
+                    "annotationPublicPrivate";
             }
             el.html(self.TEMPLATES.annotationList({ 
                 annotationItems: annotationItems, 
                 videoFormat: videoFormat,
-                PublicPrivate: publicprivatetemplate,
+                PublicPrivate: this.getTemplate(templateName),
                 MediaSelector: self.options.showMediaSelector?self.TEMPLATES.annotationMediaSelector():'',
             }));
         }else{
@@ -433,7 +439,7 @@ CatchAnnotation.prototype = {
                         self.options.userId = '';
                         break;
                     case 'instructor':
-                        self.options.userId = this.options.instructor_username;
+                        self.options.userId = this.options.instructor_email;
                         break;
                     default:
                         self.options.userId = this.annotator.plugins.Permissions.user.id;
@@ -1055,7 +1061,7 @@ CatchAnnotation.prototype = {
                 userId = '';
                 break;
             case 'instructor':
-                userId = this.options.instructor_username;
+                userId = this.options.instructor_email;
                 break;
             default:
                 userId = this.annotator.plugins.Permissions.user.id;
@@ -1119,7 +1125,7 @@ CatchAnnotation.prototype = {
         
     },
     _onClearSearchButtonClick: function(evt){
-        this._refresh("","");    
+        this._refresh('','');    
     },
     _clearAnnotator: function(){
         var annotator = this.annotator,

lms/templates/imageannotation.html

@@ -33,7 +33,6 @@
                 ${static.css(group='style-vendor-tinymce-skin', raw=True)}
             </div> 
             <div id="catchDIV">
-                ## Translators: Notes below refer to annotations. They wil later be put under a "Notes" section.
                 <div class="annotationListContainer">${_('Note: only instructors may annotate.')}</div>
             </div>
         </div>
@@ -72,7 +71,7 @@
     var unit_id = $('#sequence-list').find('.active').attr("data-element");
         uri += unit_id;
     var pagination = 100,
-	 is_staff = ('${user.email}'=='${instructor_username}'),
+     is_staff = ('${user.email}'=='${instructor_email}'),
         options = {
         optionsAnnotator: {
             permissions:{
@@ -191,10 +190,9 @@
         //Load the plugin Image/Text Annotation
         var osda = new OpenSeadragonAnnotation($('#imageHolder'),options);
         
-        var userId = '${user.email}';
-        if('${default_tab}'.toLowerCase() == 'instructor'){
-            userId = '${instructor_username}';
-        }
+        var userId = ('${default_tab}'.toLowerCase() === 'instructor') ? 
+            '${instructor_email}':
+            '${user.email}';
 
         //Catch
         var annotator = osda.annotator;
@@ -208,12 +206,17 @@
             pagination:pagination,//Number of Annotations per load in the pagination,
             flags:is_staff,
             default_tab: "${default_tab}",
-            instructor_username: "${instructor_username}",
+            instructor_email: "${instructor_email}",
             annotation_mode: "${annotation_mode}",
         };
-		if ("${annotation_mode}" == "2" || ("${annotation_mode}" == 1 && "${instructor_username}" != ""))
+
+        // if annotations are opened to everyone (2) or if they want to create no annotations (1 with no instructor)
+        // then the table at the bottom of the source should be displayed
+        if ("${annotation_mode}" == "everyone" || ("${annotation_mode}" == "instructor" && "${instructor_email}" != ""))
             var Catch = new CatchAnnotation($('#catchDIV'),catchOptions);
-        if ("${annotation_mode}" == 1 && "${instructor_username}" == "" && !is_staff)
+
+        // if it is in instructor mode only (1), the annotator should be destroyed for all except the instructor
+        if ("${annotation_mode}" == "instructor" && "${instructor_email}" == "" && !is_staff)
             osda.annotator.destroy();
     }
 </script>
\ No newline at end of file

lms/templates/textannotation.html

@@ -177,10 +177,9 @@ ${static.css(group='style-vendor-tinymce-skin', raw=True)}
     //Load the plugin Video/Text Annotation
     var ova = new OpenVideoAnnotation.Annotator($('#textHolder'),options);
 
-    var userId = '${user.email}';
-    if('${default_tab}'.toLowerCase() == 'instructor'){
-        userId = '${instructor_username}';
-    }
+    var userId = ('${default_tab}'.toLowerCase() === 'instructor') ? 
+            '${instructor_email}':
+            '${user.email}';
 
     //Catch
     var annotator = ova.annotator;
@@ -194,7 +193,7 @@ ${static.css(group='style-vendor-tinymce-skin', raw=True)}
             pagination:pagination,//Number of Annotations per load in the pagination,
             flags:is_staff,
             default_tab: "${default_tab}",
-            instructor_username: "${instructor_username}",
+            instructor_email: "${instructor_email}",
             annotation_mode: "${annotation_mode}",
         };
     var Catch = new CatchAnnotation($('#catchDIV'),catchOptions);

lms/templates/videoannotation.html

@@ -175,10 +175,9 @@ ${static.css(group='style-vendor-tinymce-skin', raw=True)}
     var ova = new OpenVideoAnnotation.Annotator($('#videoHolder'),options);
 
     ova.annotator.addPlugin('Tags');
-    var userId = '${user.email}';
-    if('${default_tab}'.toLowerCase() == 'instructor'){
-        userId = '${instructor_username}';
-    }
+    var userId = ('${default_tab}'.toLowerCase() === 'instructor') ? 
+            '${instructor_email}':
+            '${user.email}';
 
     //Catch
     var annotator = ova.annotator;
@@ -192,7 +191,7 @@ ${static.css(group='style-vendor-tinymce-skin', raw=True)}
             pagination:pagination,//Number of Annotations per load in the pagination,
             flags:is_staff,
             default_tab: "${default_tab}",
-            instructor_username: "${instructor_username}",
+            instructor_email: "${instructor_email}",
             annotation_mode: "${annotation_mode}",
         };
         var Catch = new CatchAnnotation($('#catchDIV'),catchOptions);