Skip to content

E
edx-platform
Commit 910466e0 by jmclaus
Options

Merge pull request #5829 from edx/jmclaus/load_ova_js_from_templates_with_requirejs 

In LMS, load OVA JS only in four OVA templates with requireJS. [TNL-693-outdated]
parents 099d02d1 082cb3b9
Showing with 202 additions and 61 deletions
lms/envs/common.py
......@@ -1015,24 +1015,6 @@ main_vendor_js = base_vendor_js + [
'js/vendor/jquery.qtip.min.js',
'js/vendor/swfobject/swfobject.js',
'js/vendor/jquery.ba-bbq.min.js',
'js/vendor/ova/annotator-full.js',
'js/vendor/ova/annotator-full-firebase-auth.js',
'js/vendor/ova/video.dev.js',
'js/vendor/ova/vjs.youtube.js',
'js/vendor/ova/rangeslider.js',
'js/vendor/ova/share-annotator.js',
'js/vendor/ova/richText-annotator.js',
'js/vendor/ova/reply-annotator.js',
'js/vendor/ova/tags-annotator.js',
'js/vendor/ova/flagging-annotator.js',
'js/vendor/ova/diacritic-annotator.js',
'js/vendor/ova/grouping-annotator.js',
'js/vendor/ova/jquery-Watch.js',
'js/vendor/ova/openseadragon.js',
'js/vendor/ova/OpenSeaDragonAnnotation.js',
'js/vendor/ova/ova.js',
'js/vendor/ova/catch/js/catch.js',
'js/vendor/ova/catch/js/handlebars-1.1.2.js',
'js/vendor/URI.min.js',
]
......
lms/static/require-config-lms.js 0 → 100644
;(function (require, define, _) {
var paths = {}, config;
// URI, tinymce, or jquery.tinymce may already have been loaded before the OVA templates and we do not want to load
// them a second time. Check if it is the case and use the global var in requireJS config.
if (window.URI) {
define("URI", [], function() {return window.URI;});
} else {
paths.URI = "js/vendor/URI.min";
}
if (window.tinymce) {
define('tinymce', [], function() {return window.tinymce;});
} else {
paths.tinymce = "js/vendor/tinymce/js/tinymce/tinymce.full.min";
}
if (window.jquery && window.jquery.tinymce) {
define("jquery.tinymce", [], function() {return window.jquery.tinymce;});
} else {
paths.tinymce = "js/vendor/tinymce/js/tinymce/jquery.tinymce.min";
}
config = {
// NOTE: baseUrl has been previously set in lms/templates/main.html
waitSeconds: 60,
paths: {
// Files only needed for OVA
"annotator": "js/vendor/ova/annotator-full",
"annotator-harvardx": "js/vendor/ova/annotator-full-firebase-auth",
"video.dev": "js/vendor/ova/video.dev",
"vjs.youtube": 'js/vendor/ova/vjs.youtube',
"rangeslider": 'js/vendor/ova/rangeslider',
"share-annotator": 'js/vendor/ova/share-annotator',
"richText-annotator": 'js/vendor/ova/richText-annotator',
"reply-annotator": 'js/vendor/ova/reply-annotator',
"grouping-annotator": 'js/vendor/ova/grouping-annotator',
"tags-annotator": 'js/vendor/ova/tags-annotator',
"diacritic-annotator": 'js/vendor/ova/diacritic-annotator',
"flagging-annotator": 'js/vendor/ova/flagging-annotator',
"jquery-Watch": 'js/vendor/ova/jquery-Watch',
"openseadragon": 'js/vendor/ova/openseadragon',
"osda": 'js/vendor/ova/OpenSeaDragonAnnotation',
"ova": 'js/vendor/ova/ova',
"catch": 'js/vendor/ova/catch/js/catch',
"handlebars": 'js/vendor/ova/catch/js/handlebars-1.1.2',
// end of files only needed for OVA
},
shim: {
// The following are all needed for OVA
"video.dev": {
exports:"videojs"
},
"vjs.youtube": {
deps: ["video.dev"]
},
"rangeslider": {
deps: ["video.dev"]
},
"annotator": {
exports: "Annotator"
},
"annotator-harvardx":{
deps: ["annotator"]
},
"share-annotator": {
deps: ["annotator"]
},
"richText-annotator": {
deps: ["annotator", "tinymce"]
},
"reply-annotator": {
deps: ["annotator"]
},
"tags-annotator": {
deps: ["annotator"]
},
"diacritic-annotator": {
deps: ["annotator"]
},
"flagging-annotator": {
deps: ["annotator"]
},
"grouping-annotator": {
deps: ["annotator"]
},
"ova": {
exports: "ova",
deps: [
"annotator", "annotator-harvardx", "video.dev", "vjs.youtube", "rangeslider", "share-annotator",
"richText-annotator", "reply-annotator", "tags-annotator", "flagging-annotator",
"grouping-annotator", "diacritic-annotator", "jquery-Watch", "catch", "handlebars", "URI"
]
},
"osda": {
exports: "osda",
deps: [
"annotator", "annotator-harvardx", "video.dev", "vjs.youtube", "rangeslider", "share-annotator",
"richText-annotator", "reply-annotator", "tags-annotator", "flagging-annotator",
"grouping-annotator", "diacritic-annotator", "openseadragon", "jquery-Watch", "catch", "handlebars",
"URI"
]
},
// End of OVA
}
};
_.extend(config.paths, paths);
require.config(config);
}).call(this, require || RequireJS.require, define || RequireJS.define, _);
lms/templates/imageannotation.html
......@@ -41,7 +41,9 @@
</div>
<script>
// TODO: Fix indentation in the following block
(function (require) {
var init = function() {
function onClickHideInstructions(){
//Reset function if there is more than one event handler
$(this).off();
......@@ -191,7 +193,12 @@
delete osda;
//Load the plugin Image/Text Annotation
osda = new OpenSeadragonAnnotation($('#imageHolder'),options);
// TODO: Fix to avoid using global scope!
window.options = options;
window.osda = osda;
// END TODO
var userId = ('${default_tab}'.toLowerCase() === 'instructor') ?
'${instructor_email}':
'${user.email}';
......@@ -214,24 +221,24 @@
// 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}" != ""))
if ("${annotation_mode}" == "everyone" || ("${annotation_mode}" == "instructor" && "${instructor_email}" != "")) {
Catch = new CatchAnnotation($('#catchDIV'),catchOptions);
// TODO: Fix to avoid using global scope!
window.Catch = Catch;
// END TODO
}
// 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();
}
// if the following is true, template is being rendered in LMS, otherwise it is in Studio
if (typeof Annotator !== 'undefined') {
startosda();
} else {
try {
require(["osda"], function(osda){
startosda();
});
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
startosda();
};
try {
require(["osda"], init);
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
</script>
\ No newline at end of file
}).call(this, require || RequireJS.require);
</script>
lms/templates/main.html
......@@ -6,6 +6,7 @@
<%
# set doc language direction
from django.utils.translation import get_language_bidi
from dealer.git import git
dir_rtl = 'rtl' if get_language_bidi() else 'ltr'
%>
<head dir="${dir_rtl}">
......@@ -73,6 +74,23 @@
<%static:js group='main_vendor'/>
% endif
<script>
window.baseUrl = "${settings.STATIC_URL}";
(function (require) {
% if settings.DEBUG is True:
## Using what amounts to a random number in the Development environment for cache-busting
var urlArgs = "bust=" + (new Date()).getTime();
% else:
var urlArgs = "v=${git.revision}";
% endif
require.config({
baseUrl: baseUrl,
urlArgs: urlArgs
});
}).call(this, require || RequireJS.require);
</script>
<script type="text/javascript" src="${static.url("require-config-lms.js")}"></script>
<%block name="headextra"/>
<%
......
lms/templates/notes.html
......@@ -4,8 +4,6 @@
${static.css(group='style-vendor-tinymce-content', raw=True)}
${static.css(group='style-vendor-tinymce-skin', raw=True)}
${static.css(group='style-xmodule-annotations', raw=True)}
<script type="text/javascript" src="${static.url('js/vendor/tinymce/js/tinymce/tinymce.full.min.js', raw=True)}"></script>
<script type="text/javascript" src="${static.url('js/vendor/tinymce/js/tinymce/jquery.tinymce.min.js', raw=True)}" ></script>
<%inherit file="main.html" />
<%!
from django.core.urlresolvers import reverse
......@@ -70,7 +68,9 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
<div class="annotationListContainer">${_('You do not have any notes.')}</div>
</section>
<script>
// TODO: Fix indentation in the following block
(function (require) {
var init = function() {
//Grab uri of the course
var parts = window.location.href.split("/"),
uri = '';
......@@ -199,6 +199,10 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
//Load the plugin Video/Text Annotation
var ova = new OpenVideoAnnotation.Annotator($('#notesHolder'),options);
// TODO: Fix to avoid using global scope!
window.options = options;
window.ova = ova;
// END TODO
//Catch
var annotator = ova.annotator,
......@@ -213,6 +217,16 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
default_tab: "${default_tab}",
},
Catch = new CatchAnnotation($('#catchDIV'),catchOptions);
// TODO: Fix to avoid using global scope!
window.Catch = Catch;
// END TODO
};
try {
require(["ova"], init);
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
}).call(this, require || RequireJS.require);
</script>
</div>
</section>
......
lms/templates/textannotation.html
......@@ -32,8 +32,10 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
</div>
</div>
<script>
// TODO: Fix indentation in the following block
(function (require) {
var init = function() {
function onClickHideInstructions(){
//Reset function if there is more than one event handler
$(this).off();
......@@ -179,6 +181,11 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
//Load the plugin Video/Text Annotation
ova = new OpenVideoAnnotation.Annotator($('#textHolder'),options);
// TODO: Fix to avoid using global scope!
window.options = options;
window.ova = ova;
// END TODO
if (typeof Annotator.Plugin["Grouping"] === 'function')
ova.annotator.addPlugin("Grouping");
......@@ -202,18 +209,17 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
annotation_mode: "${annotation_mode}",
};
Catch = new CatchAnnotation($('#catchDIV'),catchOptions);
// TODO: Fix to avoid using global scope!
window.Catch = Catch;
// END TODO
}
// if the following is true, template is being rendered in LMS, otherwise it is in Studio
if (typeof Annotator !== 'undefined') {
startova();
} else {
try {
require(["ova"], function(ova) {
startova();
});
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
startova();
};
try {
require(["ova"], init);
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
}).call(this, require || RequireJS.require);
</script>
lms/templates/videoannotation.html
......@@ -36,8 +36,10 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
</div>
<script>
function onClickHideInstructions(){
// TODO: Fix indentation in the following block
(function (require) {
var init = function() {
function onClickHideInstructions(){
//Reset function if there is more than one event handler
$(this).off();
$(this).on('click',onClickHideInstructions);
......@@ -176,6 +178,11 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
//Load the plugin Video/Text Annotation
ova = new OpenVideoAnnotation.Annotator($('#videoHolder'),options);
// TODO: Fix to avoid using global scope!
window.options = options;
window.ova = ova;
// END TODO
ova.annotator.addPlugin('Tags');
var userId = ('${default_tab}'.toLowerCase() === 'instructor') ?
'${instructor_email}':
......@@ -197,16 +204,17 @@ ${static.css(group='style-xmodule-annotations', raw=True)}
annotation_mode: "${annotation_mode}",
};
Catch = new CatchAnnotation($('#catchDIV'),catchOptions);
// TODO: Fix to avoid using global scope!
window.Catch = Catch;
// END TODO
}
if (typeof Annotator !== 'undefined') {
startova();
} else {
try {
require(["ova"], function(ova) {
startova();
});
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
startova();
};
try {
require(["ova"], init);
} catch(error) {
console.log("Error: " + error.message + " - Annotator not loaded in LMS.");
}
}).call(this, require || RequireJS.require);
</script>
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