Merge pull request #23614 from edx/dcs/notes-toggle
Support learning MFE for notes toggle
This commit is contained in:
@@ -1682,7 +1682,8 @@ def render_xblock(request, usage_key_string, check_if_enrolled=True):
|
||||
'staff_access': bool(request.user.has_perm(VIEW_XQA_INTERFACE, course)),
|
||||
'xqa_server': settings.FEATURES.get('XQA_SERVER', 'http://your_xqa_server.com'),
|
||||
'display_reset_dates_banner': display_reset_dates_banner,
|
||||
'web_app_course_url': reverse(COURSE_HOME_VIEW_NAME, args=[course.id])
|
||||
'web_app_course_url': reverse(COURSE_HOME_VIEW_NAME, args=[course.id]),
|
||||
'is_learning_mfe': request.META.get('HTTP_REFERER', '').startswith(settings.LEARNING_MICROFRONTEND_URL),
|
||||
}
|
||||
return render_to_response('courseware/courseware-chromeless.html', context)
|
||||
|
||||
|
||||
@@ -12,13 +12,17 @@
|
||||
errorMessage: gettext('An error has occurred. Make sure that you are connected to the Internet, and then try refreshing the page.'),
|
||||
|
||||
initialize: function(options) {
|
||||
_.bindAll(this, 'onSuccess', 'onError', 'keyDownToggleHandler');
|
||||
_.bindAll(this, 'onSuccess', 'onError', 'keyDownToggleHandler', 'receiveMessage');
|
||||
this.visibility = options.visibility;
|
||||
this.visibilityUrl = options.visibilityUrl;
|
||||
|
||||
this.label = this.$('.utility-control-label');
|
||||
this.actionLink = this.$('.action-toggle-notes');
|
||||
this.actionLink.removeClass('is-disabled');
|
||||
this.actionToggleMessage = this.$('.action-toggle-message');
|
||||
if (options.hideUI) {
|
||||
$(window).on('message', this.receiveMessage);
|
||||
}
|
||||
this.notification = new Annotator.Notification();
|
||||
$(document).on('keydown.edxnotes:togglenotes', this.keyDownToggleHandler);
|
||||
},
|
||||
@@ -28,6 +32,18 @@
|
||||
Backbone.View.prototype.remove.call(this);
|
||||
},
|
||||
|
||||
receiveMessage: function(event) {
|
||||
var data = event.originalEvent.data;
|
||||
if (data === 'tools.toggleNotes') {
|
||||
event.preventDefault();
|
||||
this.visibility = !this.visibility;
|
||||
if (this.visibility) {
|
||||
this.enableNotes();
|
||||
} else {
|
||||
this.disableNotes();
|
||||
}
|
||||
}
|
||||
},
|
||||
toggleHandler: function(event) {
|
||||
event.preventDefault();
|
||||
this.visibility = !this.visibility;
|
||||
@@ -94,11 +110,12 @@
|
||||
});
|
||||
|
||||
return {
|
||||
ToggleVisibilityView: function(visibility, visibilityUrl) {
|
||||
ToggleVisibilityView: function(visibility, visibilityUrl, hideUI) {
|
||||
return new ToggleVisibilityView({
|
||||
el: $('.edx-notes-visibility').get(0),
|
||||
visibility: visibility,
|
||||
visibilityUrl: visibilityUrl
|
||||
visibilityUrl: visibilityUrl,
|
||||
hideUI: hideUI
|
||||
});
|
||||
},
|
||||
VisibilityDecorator: VisibilityDecorator
|
||||
|
||||
@@ -46,29 +46,23 @@ ${static.get_page_title_breadcrumbs(course_name())}
|
||||
<%static:css group='style-student-notes'/>
|
||||
% endif
|
||||
|
||||
<script type="text/javascript" src="${static.url('js/jquery.autocomplete.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('js/src/tooltip_manager.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('js/jquery.autocomplete.js')}" async></script>
|
||||
<script type="text/javascript" src="${static.url('js/src/tooltip_manager.js')}" async></script>
|
||||
|
||||
<link href="${static.url('css/vendor/jquery.autocomplete.css')}" rel="stylesheet" type="text/css">
|
||||
<link href="${static.url('css/vendor/jquery.autocomplete.css')}" rel="preload" type="text/css">
|
||||
${HTML(fragment.head_html())}
|
||||
|
||||
<script type="text/javascript">
|
||||
// If this chromeless view is in an iframe in the learning microfrontend app
|
||||
// then add a base tag in the head (of the iframe document) to force links
|
||||
// in this iframe to navigate the parent window.
|
||||
var learningAppUrl = "${settings.LEARNING_MICROFRONTEND_URL | n, js_escaped_string}";
|
||||
var parentIsLearningApp = document.referrer.indexOf(learningAppUrl) === 0;
|
||||
if (window !== window.parent && parentIsLearningApp) {
|
||||
var baseElement = document.createElement('base');
|
||||
baseElement.setAttribute('target', '_parent');
|
||||
document.head.appendChild(baseElement);
|
||||
}
|
||||
</script>
|
||||
% if is_learning_mfe:
|
||||
## If this chromeless view is in an iframe in the learning microfrontend app
|
||||
## then add a base tag in the head (of the iframe document) to force links
|
||||
## in this iframe to navigate the parent window.
|
||||
<base target="_parent">
|
||||
%endif
|
||||
</%block>
|
||||
|
||||
<%block name="js_extra">
|
||||
<script type="text/javascript" src="${static.url('common/js/vendor/jquery.scrollTo.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.js')}"></script>
|
||||
<script type="text/javascript" src="${static.url('common/js/vendor/jquery.scrollTo.js')}" async></script>
|
||||
<script type="text/javascript" src="${static.url('js/vendor/flot/jquery.flot.js')}" async></script>
|
||||
|
||||
<%static:js group='courseware'/>
|
||||
|
||||
@@ -99,7 +93,9 @@ ${HTML(fragment.foot_html())}
|
||||
</main>
|
||||
</section>
|
||||
</div>
|
||||
% if course.show_calculator or edx_notes_enabled:
|
||||
% if not is_learning_mfe:
|
||||
|
||||
% if course.show_calculator or edx_notes_enabled:
|
||||
<nav class="nav-utilities ${"has-utility-calculator" if course.show_calculator else ""}" aria-label="${_('Course Utilities')}">
|
||||
## Utility: Notes
|
||||
% if edx_notes_enabled:
|
||||
@@ -111,17 +107,20 @@ ${HTML(fragment.foot_html())}
|
||||
<%include file="/calculator/toggle_calculator.html" />
|
||||
% endif
|
||||
</nav>
|
||||
% endif
|
||||
% else:
|
||||
% if edx_notes_enabled:
|
||||
<%include file="/edxnotes/toggle_notes.html" args="course=course"/>
|
||||
% endif
|
||||
% endif
|
||||
|
||||
% if is_learning_mfe:
|
||||
<script type="text/javascript">
|
||||
(function() {
|
||||
// If this view is rendered in an iframe within the learning microfrontend app
|
||||
// it will report the height of its contents to the parent window when the
|
||||
// document loads, window resizes, or DOM mutates.
|
||||
var learningAppUrl = "${settings.LEARNING_MICROFRONTEND_URL | n, js_escaped_string}";
|
||||
var parentIsLearningApp = document.referrer.indexOf(learningAppUrl) === 0;
|
||||
|
||||
if (window !== window.parent && parentIsLearningApp) {
|
||||
if (window !== window.parent) {
|
||||
var lastHeight = window.offsetHeight;
|
||||
var lastWidth = window.offsetWidth;
|
||||
var contentElement = document.getElementById('content');
|
||||
@@ -166,3 +165,4 @@ ${HTML(fragment.foot_html())}
|
||||
}
|
||||
}());
|
||||
</script>
|
||||
% endif
|
||||
|
||||
@@ -9,8 +9,12 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str
|
||||
<%
|
||||
edxnotes_visibility = course.edxnotes_visibility
|
||||
edxnotes_visibility_url = reverse("edxnotes_visibility", kwargs={"course_id": course.id})
|
||||
if is_learning_mfe is UNDEFINED:
|
||||
hide_ui = False
|
||||
else:
|
||||
hide_ui = is_learning_mfe
|
||||
%>
|
||||
<div class="wrapper-utility edx-notes-visibility">
|
||||
<div class="wrapper-utility edx-notes-visibility ${'hidden' if hide_ui else ''}">
|
||||
<span class="action-toggle-message" aria-live="polite"></span>
|
||||
<button class="utility-control utility-control-button action-toggle-notes is-disabled ${"is-active" if edxnotes_visibility else ""}">
|
||||
<span class="icon fa fa-pencil" aria-hidden="true"></span>
|
||||
@@ -25,6 +29,7 @@ from openedx.core.djangolib.js_utils import dump_js_escaped_json, js_escaped_str
|
||||
<%static:require_module_async module_name="js/edxnotes/views/notes_visibility_factory" class_name="NotesVisibilityFactory">
|
||||
NotesVisibilityFactory.ToggleVisibilityView(
|
||||
${edxnotes_visibility | n, dump_js_escaped_json},
|
||||
'${edxnotes_visibility_url | n, js_escaped_string}'
|
||||
'${edxnotes_visibility_url | n, js_escaped_string}',
|
||||
${hide_ui | n, dump_js_escaped_json}
|
||||
);
|
||||
</%static:require_module_async>
|
||||
|
||||
@@ -838,6 +838,13 @@ class CourseOverview(TimeStampedModel):
|
||||
"""
|
||||
return self._original_course.show_calculator
|
||||
|
||||
@property
|
||||
def edxnotes_visibility(self):
|
||||
"""
|
||||
TODO: move this to the model.
|
||||
"""
|
||||
return self._original_course.edxnotes_visibility
|
||||
|
||||
def __str__(self):
|
||||
"""Represent ourselves with the course key."""
|
||||
return six.text_type(self.id)
|
||||
|
||||
@@ -8,6 +8,7 @@ from django.urls import reverse
|
||||
from rest_framework import serializers
|
||||
|
||||
from course_modes.models import CourseMode
|
||||
from edxnotes.helpers import is_feature_enabled
|
||||
from lms.djangoapps.courseware.tabs import get_course_tab_list
|
||||
from lms.djangoapps.courseware.utils import verified_upgrade_deadline_link
|
||||
|
||||
@@ -88,6 +89,7 @@ class CourseInfoSerializer(serializers.Serializer): # pylint: disable=abstract-
|
||||
show_calculator = serializers.BooleanField()
|
||||
is_staff = serializers.BooleanField()
|
||||
can_load_courseware = serializers.BooleanField()
|
||||
notes = serializers.SerializerMethodField()
|
||||
|
||||
# TODO: TNL-7053 Legacy: Delete these two once ready to contract
|
||||
user_has_access = serializers.BooleanField()
|
||||
@@ -134,3 +136,12 @@ class CourseInfoSerializer(serializers.Serializer): # pylint: disable=abstract-
|
||||
'sku': mode.sku,
|
||||
'upgrade_url': verified_upgrade_deadline_link(course_overview.effective_user, course_overview),
|
||||
}
|
||||
|
||||
def get_notes(self, course_overview):
|
||||
"""
|
||||
Return whether edxnotes is enabled and visible.
|
||||
"""
|
||||
return {
|
||||
'enabled': is_feature_enabled(course_overview, course_overview.effective_user),
|
||||
'visible': course_overview.edxnotes_visibility,
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user