Skip to content

E
edx-platform
Commit 68acf66f by lduarte1991
Options

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
parent b22643ad
Showing with 164 additions and 153 deletions
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
......@@ -48,7 +48,7 @@ class AnnotatableFields(object):
annotation_storage_url = String(
help=_("Location of Annotation backend"),
scope=Scope.settings,
default="http://your_annotation_storage.com",
default="http://your_annotation_storage.com",
display_name=_("Url for Annotation Storage"),
)
annotation_token_secret = String(
......@@ -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
......@@ -9,70 +9,69 @@
</style>
<div class="annotatable-wrapper">
<div class="annotatable-header">
% if display_name is not UNDEFINED and display_name is not None:
<div class="annotatable-title">${display_name}</div>
% endif
</div>
% if instructions_html is not UNDEFINED and instructions_html is not None:
<div class="annotatable-section shaded">
<div class="annotatable-section-title">
${_('Instructions')}
<a class="annotatable-toggle annotatable-toggle-instructions expanded" href="javascript:void(0)">${_('Collapse Instructions')}</a>
</div>
<div class="annotatable-section-body annotatable-instructions">
${instructions_html}
</div>
</div>
% endif
<div class="annotatable-section">
<div class="annotatable-content">
<div id="imageHolder" class="openseadragon1">
<div class="annotatable-header">
% if display_name is not UNDEFINED and display_name is not None:
<div class="annotatable-title">${display_name}</div>
% endif
</div>
% if instructions_html is not UNDEFINED and instructions_html is not None:
<div class="annotatable-section shaded">
<div class="annotatable-section-title">
${_('Instructions')}
<a class="annotatable-toggle annotatable-toggle-instructions expanded" href="javascript:void(0)">${_('Collapse Instructions')}</a>
</div>
<div class="annotatable-section-body annotatable-instructions">
${instructions_html}
</div>
</div>
% endif
<div class="annotatable-section">
<div class="annotatable-content">
<div id="imageHolder" class="openseadragon1">
<%namespace name='static' file='/static_content.html'/>
${static.css(group='style-vendor-tinymce-content', raw=True)}
${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>
</div>
<div id="catchDIV">
<div class="annotationListContainer">${_('Note: only instructors may annotate.')}</div>
</div>
</div>
</div>
</div>
<script>
function onClickHideInstructions(){
//Reset function if there is more than one event handler
$(this).off();
$(this).on('click',onClickHideInstructions);
var hide = $(this).html()=='Collapse Instructions'?true:false,
cls, txt,slideMethod;
txt = (hide ? 'Expand' : 'Collapse') + ' Instructions';
cls = (hide ? ['expanded', 'collapsed'] : ['collapsed', 'expanded']);
slideMethod = (hide ? 'slideUp' : 'slideDown');
$(this).text(txt).removeClass(cls[0]).addClass(cls[1]);
$(this).parents('.annotatable-section:first').find('.annotatable-instructions')[slideMethod]();
}
$('.annotatable-toggle-instructions').on('click', onClickHideInstructions);
//Grab uri of the course
var parts = window.location.href.split("/"),
uri = '',
courseid;
for (var index = 0; index <= 9; index += 1) uri += parts[index]+"/"; //Get the unit url
courseid = parts[4] + "/" + parts[5] + "/" + parts[6];
//Change uri in cms
var lms_location = $('.sidebar .preview-button').attr('href');
if (typeof lms_location!='undefined'){
courseid = parts[4].split(".").join("/");
uri = window.location.protocol;
for (var index = 0; index <= 9; index += 1) uri += lms_location.split("/")[index]+"/"; //Get the unit url
}
var unit_id = $('#sequence-list').find('.active').attr("data-element");
function onClickHideInstructions(){
//Reset function if there is more than one event handler
$(this).off();
$(this).on('click',onClickHideInstructions);
var hide = $(this).html()=='Collapse Instructions'?true:false,
cls, txt,slideMethod;
txt = (hide ? 'Expand' : 'Collapse') + ' Instructions';
cls = (hide ? ['expanded', 'collapsed'] : ['collapsed', 'expanded']);
slideMethod = (hide ? 'slideUp' : 'slideDown');
$(this).text(txt).removeClass(cls[0]).addClass(cls[1]);
$(this).parents('.annotatable-section:first').find('.annotatable-instructions')[slideMethod]();
}
$('.annotatable-toggle-instructions').on('click', onClickHideInstructions);
//Grab uri of the course
var parts = window.location.href.split("/"),
uri = '',
courseid;
for (var index = 0; index <= 9; index += 1) uri += parts[index]+"/"; //Get the unit url
courseid = parts[4] + "/" + parts[5] + "/" + parts[6];
//Change uri in cms
var lms_location = $('.sidebar .preview-button').attr('href');
if (typeof lms_location!='undefined'){
courseid = parts[4].split(".").join("/");
uri = window.location.protocol;
for (var index = 0; index <= 9; index += 1) uri += lms_location.split("/")[index]+"/"; //Get the unit url
}
var unit_id = $('#sequence-list').find('.active').attr("data-element");
uri += unit_id;
var pagination = 100,
is_staff = ('${user.email}'=='${instructor_username}'),
var pagination = 100,
is_staff = ('${user.email}'=='${instructor_email}'),
options = {
optionsAnnotator: {
permissions:{
......@@ -103,7 +102,7 @@
if (annotation.permissions) {
tokens = annotation.permissions[action] || [];
if (is_staff){
return true;
return true;
}
if (tokens.length === 0) {
return true;
......@@ -153,7 +152,7 @@
offset:0,
uri:uri,
media:'image',
userid:'${user.email}',
userid:'${user.email}',
}
},
highlightTags:{
......@@ -181,39 +180,43 @@
};
var imgURLRoot = "${settings.STATIC_URL}" + "js/vendor/ova/catch/img/";
if (typeof Annotator != 'undefined'){
//remove old instances
if (Annotator._instances.length !== 0) {
$('#imageHolder').annotator("destroy");
}
delete osda;
//Load the plugin Image/Text Annotation
var osda = new OpenSeadragonAnnotation($('#imageHolder'),options);
var userId = '${user.email}';
if('${default_tab}'.toLowerCase() == 'instructor'){
userId = '${instructor_username}';
//remove old instances
if (Annotator._instances.length !== 0) {
$('#imageHolder').annotator("destroy");
}
delete osda;
//Load the plugin Image/Text Annotation
var osda = new OpenSeadragonAnnotation($('#imageHolder'),options);
var userId = ('${default_tab}'.toLowerCase() === 'instructor') ?
'${instructor_email}':
'${user.email}';
//Catch
var annotator = osda.annotator;
var catchOptions = {
media:'image',
externalLink:false,
imageUrlRoot:imgURLRoot,
showMediaSelector: false,
showPublicPrivate: true,
userId:userId,
//Catch
var annotator = osda.annotator;
var catchOptions = {
media:'image',
externalLink:false,
imageUrlRoot:imgURLRoot,
showMediaSelector: false,
showPublicPrivate: true,
userId:userId,
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);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment