Skip to content

E
edx-platform
Commit 6589139e by Brian Jacobel
Options

Merge pull request #12266 from edx/bjacobel/requirejs-sync 

Load requirejs bundles synchronously
parents 2241ca59 a46f87d9
Showing with 69 additions and 41 deletions
common/djangoapps/pipeline_mako/templates/static_content.html
...@@ -78,27 +78,48 @@ source, template_path = Loader(engine).load_template_source(path) ...@@ -78,27 +78,48 @@ source, template_path = Loader(engine).load_template_source(path)
%>${source | n, decode.utf8}</%def> %>${source | n, decode.utf8}</%def>
<%def name="require_module(module_name, class_name)"> <%def name="require_module(module_name, class_name)">
<%doc>
Loads Javascript onto your page synchronously.
Uses RequireJS in development and a plain script tag in production.
Use this form of require_module for all new code.
</%doc>
% if not settings.REQUIRE_DEBUG:
<script type="text/javascript" src="${staticfiles_storage.url(module_name + '.js') + '?raw'}"></script>
% endif
<script type="text/javascript"> <script type="text/javascript">
(function (require) { (function (require) {
% if settings.REQUIRE_DEBUG: require(['${module_name | n, js_escaped_string}'], function (${class_name | n, decode.utf8}) {
require(['${module_name | n, js_escaped_string}'], function (${class_name | n, decode.utf8}) { ${caller.body() | n, decode.utf8}
${caller.body() | n, decode.utf8} });
});
% else:
## The "raw" parameter is specified to avoid the URL from being further maninpulated by
## static_replace calls (as woudl happen if require_module is used within courseware).
## Without specifying "raw", a call to static_replace would result in the MD5 hash being
## being appended more than once, causing the import to fail in production environments.
require(['${staticfiles_storage.url(module_name + ".js") + "?raw" | n, js_escaped_string}'], function () {
require(['${module_name | n, js_escaped_string}'], function (${class_name | n, decode.utf8}) {
${caller.body() | n, decode.utf8}
});
});
% endif
}).call(this, require || RequireJS.require); }).call(this, require || RequireJS.require);
</script> </script>
</%def> </%def>
<%def name="require_module_async(module_name, class_name)">
<%doc>
Legacy mode of require_module that operates asynchronously, required for certain edge cases
(notably where Javascript is required outside of a <%block name="js_extra" or "headextra").
Do not use for any new code; instead create a factory and use require_module above.
</%doc>
<script type="text/javascript">
(function (require) {
% if settings.REQUIRE_DEBUG:
require_module(module_name, class_name);
% else:
## The "raw" parameter is specified to avoid the URL from being further maninpulated by
## static_replace calls (as woudl happen if require_module is used within courseware).
## Without specifying "raw", a call to static_replace would result in the MD5 hash being
## being appended more than once, causing the import to fail in production environments.
require(['${staticfiles_storage.url(module_name + ".js") + "?raw" | n, js_escaped_string}'], function () {
require(['${module_name | n, js_escaped_string}'], function (${class_name | n, decode.utf8}) {
${caller.body() | n, decode.utf8}
});
});
% endif
}).call(this, require || RequireJS.require);
</script>
</%def>
<%def name="optional_include_mako(file, is_theming_enabled=False)"><% <%def name="optional_include_mako(file, is_theming_enabled=False)"><%
# http://stackoverflow.com/q/21219531 # http://stackoverflow.com/q/21219531
if is_theming_enabled: if is_theming_enabled:
......
common/templates/edxnotes_wrapper.html
<%namespace name='static' file='/static_content.html'/>
<%page expression_filter="h"/>
<%! <%!
import json import json
from django.utils.translation import ugettext as _ from django.utils.translation import ugettext as _
from student.models import anonymous_id_for_user from student.models import anonymous_id_for_user
from openedx.core.djangolib.js_utils import js_escaped_string, dump_js_escaped_json
%> %>
<%namespace name='static' file='/static_content.html'/>
<% <%
if user: if user:
params.update({'user': anonymous_id_for_user(user, None)}) params.update({'user': anonymous_id_for_user(user, None)})
%> %>
<div id="edx-notes-wrapper-${uid}" class="edx-notes-wrapper"> <div id="edx-notes-wrapper-${uid}" class="edx-notes-wrapper">
<div class="edx-notes-wrapper-content">${content}</div> <div class="edx-notes-wrapper-content">${content | n, decode.utf8 }</div>
</div> </div>
<%static:require_module module_name="js/edxnotes/views/notes_visibility_factory" class_name="NotesVisibilityFactory">
var element = document.getElementById('edx-notes-wrapper-${uid}'); <%static:require_module_async module_name="js/edxnotes/views/notes_visibility_factory" class_name="NotesVisibilityFactory">
NotesVisibilityFactory.VisibilityDecorator.factory(element, ${json.dumps(params)}, ${edxnotes_visibility}); var element = document.getElementById('edx-notes-wrapper-${uid | n, js_escaped_string}');
</%static:require_module> NotesVisibilityFactory.VisibilityDecorator.factory(element, ${params | n, dump_js_escaped_json}, ${edxnotes_visibility | n, decode.utf8});
</%static:require_module_async>
lms/templates/courseware/accordion.html
...@@ -84,7 +84,7 @@ else: ...@@ -84,7 +84,7 @@ else:
% if toc: % if toc:
<%static:require_module module_name="js/courseware/accordion_events" class_name="AccordionEvents"> <%static:require_module_async module_name="js/courseware/accordion_events" class_name="AccordionEvents">
AccordionEvents(); AccordionEvents();
</%static:require_module> </%static:require_module_async>
% endif % endif
lms/templates/courseware/course_navigation.html
...@@ -106,7 +106,7 @@ include_special_exams = settings.FEATURES.get('ENABLE_SPECIAL_EXAMS', False) and ...@@ -106,7 +106,7 @@ include_special_exams = settings.FEATURES.get('ENABLE_SPECIAL_EXAMS', False) and
"masqueradeUsername" : masquerade_user_name if masquerade_user_name is not UNDEFINED else None, "masqueradeUsername" : masquerade_user_name if masquerade_user_name is not UNDEFINED else None,
} }
%> %>
<%static:require_module module_name="lms/js/preview/preview_factory" class_name="PreviewFactory"> <%static:require_module_async module_name="lms/js/preview/preview_factory" class_name="PreviewFactory">
PreviewFactory(${preview_options | n, dump_js_escaped_json}); PreviewFactory(${preview_options | n, dump_js_escaped_json});
</%static:require_module> </%static:require_module_async>
% endif % endif
lms/templates/courseware/info.html
...@@ -38,12 +38,12 @@ from openedx.core.djangolib.markup import HTML, Text ...@@ -38,12 +38,12 @@ from openedx.core.djangolib.markup import HTML, Text
<%include file="/courseware/course_navigation.html" args="active_page='info'" /> <%include file="/courseware/course_navigation.html" args="active_page='info'" />
<%static:require_module module_name="js/courseware/toggle_element_visibility" class_name="ToggleElementVisibility"> <%static:require_module_async module_name="js/courseware/toggle_element_visibility" class_name="ToggleElementVisibility">
ToggleElementVisibility(); ToggleElementVisibility();
</%static:require_module> </%static:require_module_async>
<%static:require_module module_name="js/courseware/course_home_events" class_name="CourseHomeEvents"> <%static:require_module_async module_name="js/courseware/course_home_events" class_name="CourseHomeEvents">
CourseHomeEvents(); CourseHomeEvents();
</%static:require_module> </%static:require_module_async>
<%block name="js_extra"> <%block name="js_extra">
## CourseTalk widget js script ## CourseTalk widget js script
......
lms/templates/edxnotes/toggle_notes.html
...@@ -22,9 +22,9 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str ...@@ -22,9 +22,9 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str
</button> </button>
</div> </div>
<%static:require_module module_name="js/edxnotes/views/notes_visibility_factory" class_name="NotesVisibilityFactory"> <%static:require_module_async module_name="js/edxnotes/views/notes_visibility_factory" class_name="NotesVisibilityFactory">
NotesVisibilityFactory.ToggleVisibilityView( NotesVisibilityFactory.ToggleVisibilityView(
${edxnotes_visibility | n, dump_js_escaped_json}, ${edxnotes_visibility | n, dump_js_escaped_json},
'${edxnotes_visibility_url | n, js_escaped_string}' '${edxnotes_visibility_url | n, js_escaped_string}'
); );
</%static:require_module> </%static:require_module_async>
lms/templates/instructor/instructor_dashboard_2/certificates.html
...@@ -4,15 +4,16 @@ ...@@ -4,15 +4,16 @@
<%! <%!
from django.utils.translation import ugettext as _ from django.utils.translation import ugettext as _
from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_string from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_string
from openedx.core.djangolib.markup import HTML
%> %>
<%static:require_module module_name="js/certificates/factories/certificate_whitelist_factory" class_name="CertificateWhitelistFactory"> <%static:require_module_async module_name="js/certificates/factories/certificate_whitelist_factory" class_name="CertificateWhitelistFactory">
CertificateWhitelistFactory(${certificate_white_list | n, dump_js_escaped_json}, '${generate_certificate_exceptions_url | n, js_escaped_string}', '${certificate_exception_view_url | n, js_escaped_string}', '${generate_bulk_certificate_exceptions_url | n, js_escaped_string}', ${bool(section_data['active_certificate']) | n, dump_js_escaped_json}); CertificateWhitelistFactory(${certificate_white_list | n, dump_js_escaped_json}, '${generate_certificate_exceptions_url | n, js_escaped_string}', '${certificate_exception_view_url | n, js_escaped_string}', '${generate_bulk_certificate_exceptions_url | n, js_escaped_string}', ${bool(section_data['active_certificate']) | n, dump_js_escaped_json});
</%static:require_module> </%static:require_module_async>
<%static:require_module module_name="js/certificates/factories/certificate_invalidation_factory" class_name="CertificateInvalidationFactory"> <%static:require_module_async module_name="js/certificates/factories/certificate_invalidation_factory" class_name="CertificateInvalidationFactory">
CertificateInvalidationFactory('${certificate_invalidations | n, dump_js_escaped_json}', '${certificate_invalidation_view_url | n, js_escaped_string}'); CertificateInvalidationFactory('${certificate_invalidations | n, dump_js_escaped_json}', '${certificate_invalidation_view_url | n, js_escaped_string}');
</%static:require_module> </%static:require_module_async>
<div class="certificates-wrapper"> <div class="certificates-wrapper">
...@@ -85,7 +86,7 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str ...@@ -85,7 +86,7 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str
<input type="button" id="disabled-btn-start-generating-certificates" class="is-disabled" aria-disabled="true" value="${_('Generate Certificates')}"/> <input type="button" id="disabled-btn-start-generating-certificates" class="is-disabled" aria-disabled="true" value="${_('Generate Certificates')}"/>
% else: % else:
<p class="under-heading"> <p class="under-heading">
${_("When you are ready to generate certificates for your course, click Generate Certificates. You do not need to do this<br/>if you have set the certificate mode to on-demand generation.")} ${HTML(_("When you are ready to generate certificates for your course, click Generate Certificates. You do not need to do this<br/>if you have set the certificate mode to on-demand generation."))}
</p> </p>
<input type="button" class="btn-blue" id="btn-start-generating-certificates" value="${_('Generate Certificates')}" data-endpoint="${section_data['urls']['start_certificate_generation']}"/> <input type="button" class="btn-blue" id="btn-start-generating-certificates" value="${_('Generate Certificates')}" data-endpoint="${section_data['urls']['start_certificate_generation']}"/>
%endif %endif
...@@ -112,7 +113,7 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str ...@@ -112,7 +113,7 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str
<h2>${_("Regenerate Certificates")}</h2> <h2>${_("Regenerate Certificates")}</h2>
<form id="certificate-regenerating-form" method="post" action="${section_data['urls']['start_certificate_regeneration']}"> <form id="certificate-regenerating-form" method="post" action="${section_data['urls']['start_certificate_regeneration']}">
<p class="under-heading"> <p class="under-heading">
${_('To regenerate certificates for your course, choose the learners who will receive regenerated certificates and click <br/> Regenerate Certificates.')} ${HTML(_('To regenerate certificates for your course, choose the learners who will receive regenerated certificates and click <br/> Regenerate Certificates.'))}
</p> </p>
<label style="display: inline" for="certificate_status_${section_data['status'].downloadable}"> <label style="display: inline" for="certificate_status_${section_data['status'].downloadable}">
......
scripts/safe_template_linter.py
...@@ -2376,8 +2376,8 @@ class MakoTemplateLinter(BaseLinter): ...@@ -2376,8 +2376,8 @@ class MakoTemplateLinter(BaseLinter):
r""" r"""
<script.*?> | # script tag start <script.*?> | # script tag start
</script> | # script tag end </script> | # script tag end
<%static:require_module.*?> | # require js script tag start <%static:require_module(_async)?.*?> | # require js script tag start (optionally the _async version)
</%static:require_module> | # require js script tag end </%static:require_module(_async)?> | # require js script tag end (optionally the _async version)
<%block[ ]*name=['"]requirejs['"]\w*> | # require js tag start <%block[ ]*name=['"]requirejs['"]\w*> | # require js tag start
</%block> # require js tag end </%block> # require js tag end
""", """,
......
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