diff --git a/lms/static/js/dashboard/legacy.js b/lms/static/js/dashboard/legacy.js index 06e6b032bf..a2c3a4a4db 100644 --- a/lms/static/js/dashboard/legacy.js +++ b/lms/static/js/dashboard/legacy.js @@ -62,6 +62,7 @@ } ); + // Generate the properties object to be passed along with business intelligence events. function generateProperties(element) { var $el = $(element), @@ -78,6 +79,35 @@ return properties; } + function setDialogAttributes(isPaidCourse, certNameLong, + courseNumber, courseName, enrollmentMode, showRefundOption) { + var diagAttr = {}; + + if (isPaidCourse) { + if (showRefundOption) { + diagAttr['data-refund-info'] = gettext('You will be refunded the amount you paid.'); + } else { + diagAttr['data-refund-info'] = gettext('You will not be refunded the amount you paid.'); + } + diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the purchased course ' + + '%(courseName)s (%(courseNumber)s)?'); + } else if (enrollmentMode !== 'verified') { + diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from %(courseName)s ' + + '(%(courseNumber)s)?'); + } else if (showRefundOption) { + diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the verified ' + + '%(certNameLong)s track of %(courseName)s (%(courseNumber)s)?'); + diagAttr['data-refund-info'] = gettext('You will be refunded the amount you paid.'); + } else { + diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the verified ' + + '%(certNameLong)s track of %(courseName)s (%(courseNumber)s)?'); + diagAttr['data-refund-info'] = gettext('The refund deadline for this course has passed,' + + 'so you will not receive a refund.'); + } + + return diagAttr; + } + $('#failed-verification-button-dismiss').click(function() { $.ajax({ url: urls.verifyToggleBannerFailedOff, @@ -101,6 +131,65 @@ } edx.dashboard.dropdown.toggleCourseActionsDropdownMenu(event); }); + $('.action-unenroll').click(function(event) { + var isPaidCourse = $(event.target).data('course-is-paid-course') === 'True'; + var certNameLong = $(event.target).data('course-cert-name-long'); + var enrollmentMode = $(event.target).data('course-enrollment-mode'); + + var courseNumber = $(event.target).data('course-number'); + var courseName = $(event.target).data('course-name'); + var courseRefundUrl = $(event.target).data('course-refund-url'); + var dialogMessageAttr; + + var request = $.ajax({ + url: courseRefundUrl, + method: 'GET', + dataType: 'json' + }); + request.success(function(data, textStatus, xhr) { + if (xhr.status === 200) { + dialogMessageAttr = setDialogAttributes(isPaidCourse, certNameLong, + courseNumber, courseName, enrollmentMode, data.course_refundable_status); + + $('#track-info').empty(); + $('#refund-info').empty(); + + $('#track-info').html(interpolate(dialogMessageAttr['data-track-info'], { + courseNumber: ['', courseNumber, ''].join(''), + courseName: ['', courseName, ''].join(''), + certNameLong: ['', certNameLong, ''].join('') + }, true)); + + + if ('data-refund-info' in dialogMessageAttr) { + $('#refund-info').text(dialogMessageAttr['data-refund-info']); + } + + $('#unenroll_course_id').val($(event.target).data('course-id')); + } else { + $('#unenroll_error').text( + gettext('Unable to determine whether we should give you a refund because' + + ' of System Error. Please try again later.') + ).stop() + .css('display', 'block'); + + $('#unenroll_form input[type="submit"]').prop('disabled', true); + } + edx.dashboard.dropdown.toggleCourseActionsDropdownMenu(event); + }); + request.fail(function() { + $('#unenroll_error').text( + gettext('Unable to determine whether we should give you a refund because' + + ' of System Error. Please try again later.') + ).stop() + .css('display', 'block'); + + $('#unenroll_form input[type="submit"]').prop('disabled', true); + + edx.dashboard.dropdown.toggleCourseActionsDropdownMenu(event); + }); + $('#unenroll-modal').css('position', 'fixed'); + }); $('#email_settings_form').submit(function() { $.ajax({ @@ -133,5 +222,22 @@ $(this).attr('id', 'email-settings-' + index); }); + $('.action-unenroll').each(function(index) { + // a bit of a hack, but gets the unique selector for the modal trigger + var trigger = '#' + $(this).attr('id'); + accessibleModal( + trigger, + '#unenroll-modal .close-modal', + '#unenroll-modal', + '#dashboard-main' + ); + $(this).attr('id', 'unenroll-' + index); + }); + + $('#unregister_block_course').click(function(event) { + $('#unenroll_course_id').val($(event.target).data('course-id')); + $('#unenroll_course_number').text($(event.target).data('course-number')); + $('#unenroll_course_name').text($(event.target).data('course-name')); + }); }; })(jQuery, gettext, Logger, accessible_modal, interpolate); diff --git a/lms/static/js/learner_dashboard/views/unenroll_view.js b/lms/static/js/learner_dashboard/views/unenroll_view.js index a0189018f6..ab52dfe83e 100644 --- a/lms/static/js/learner_dashboard/views/unenroll_view.js +++ b/lms/static/js/learner_dashboard/views/unenroll_view.js @@ -16,100 +16,14 @@ return Backbone.View.extend({ el: '.unenroll-modal', - unenrollClick: function(event) { - var isPaidCourse = $(event.target).data('course-is-paid-course') === 'True', - certNameLong = $(event.target).data('course-cert-name-long'), - enrollmentMode = $(event.target).data('course-enrollment-mode'), - courseNumber = $(event.target).data('course-number'), - courseName = $(event.target).data('course-name'), - courseRefundUrl = $(event.target).data('course-refund-url'), - dialogMessageAttr, - request = $.ajax({ - url: courseRefundUrl, - method: 'GET', - dataType: 'json' - }); - request.success(function(data, textStatus, xhr) { - if (xhr.status === 200) { - dialogMessageAttr = setDialogAttributes(isPaidCourse, certNameLong, - courseNumber, courseName, enrollmentMode, data.course_refundable_status); - - $('#track-info').empty(); - $('#refund-info').empty(); - - $('#track-info').html(interpolate(dialogMessageAttr['data-track-info'], { - courseNumber: ['', courseNumber, ''].join(''), - courseName: ['', courseName, ''].join(''), - certNameLong: ['', certNameLong, ''].join('') - }, true)); - - - if ('data-refund-info' in dialogMessageAttr) { - $('#refund-info').text(dialogMessageAttr['data-refund-info']); - } - - $('#unenroll_course_id').val($(event.target).data('course-id')); - } else { - $('#unenroll_error').text( - gettext('Unable to determine whether we should give you a refund because' + - ' of System Error. Please try again later.') - ).stop() - .css('display', 'block'); - - $('#unenroll_form input[type="submit"]').prop('disabled', true); - } - edx.dashboard.dropdown.toggleCourseActionsDropdownMenu(event); - }); - request.fail(function() { - $('#unenroll_error').text( - gettext('Unable to determine whether we should give you a refund because' + - ' of System Error. Please try again later.') - ).stop() - .css('display', 'block'); - - $('#unenroll_form input[type="submit"]').prop('disabled', true); - - edx.dashboard.dropdown.toggleCourseActionsDropdownMenu(event); - }); - + switchToSlideOne: function() { + var survey, i, + reasonsSurvey = HtmlUtils.HTML($('.reasons_survey')); // Randomize survey option order survey = document.querySelector('.options'); for (i = survey.children.length - 1; i >= 0; i--) { survey.appendChild(survey.children[Math.random() * i | 0]); } - }, - - function setDialogAttributes(isPaidCourse, certNameLong, - courseNumber, courseName, enrollmentMode, showRefundOption) { - var diagAttr = {}; - - if (isPaidCourse) { - if (showRefundOption) { - diagAttr['data-refund-info'] = gettext('You will be refunded the amount you paid.'); - } else { - diagAttr['data-refund-info'] = gettext('You will not be refunded the amount you paid.'); - } - diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the purchased course ' + - '%(courseName)s (%(courseNumber)s)?'); - } else if (enrollmentMode !== 'verified') { - diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from %(courseName)s ' + - '(%(courseNumber)s)?'); - } else if (showRefundOption) { - diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the verified ' + - '%(certNameLong)s track of %(courseName)s (%(courseNumber)s)?'); - diagAttr['data-refund-info'] = gettext('You will be refunded the amount you paid.'); - } else { - diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the verified ' + - '%(certNameLong)s track of %(courseName)s (%(courseNumber)s)?'); - diagAttr['data-refund-info'] = gettext('The refund deadline for this course has passed,' + - 'so you will not receive a refund.'); - } - - return diagAttr; - }, - - switchToSlideOne: function() { - var reasonsSurvey = HtmlUtils.HTML($('.reasons_survey')); $('.inner-wrapper header').hide(); $('#unenroll_form').after(HtmlUtils.ensureHtml(reasonsSurvey).toString()).hide(); $('.reasons_survey .slide1').removeClass('hidden'); @@ -134,8 +48,12 @@ unenrollComplete: function(event, xhr) { if (xhr.status === 200) { - this.switchToSlideOne(); - $('.submit_reasons').click(this.switchToSlideTwo.bind(this)); + if (!this.isEdx) { + location.href = this.urls.dashboard; + } else { + this.switchToSlideOne(); + $('.submit_reasons').click(this.switchToSlideTwo.bind(this)); + } } else if (xhr.status === 403) { location.href = this.urls.signInUser + '?course_id=' + encodeURIComponent($('#unenroll_course_id').val()) + '&enrollment_action=unenroll'; @@ -145,21 +63,14 @@ ' of System Error. Please try again later.') ).stop() .css('display', 'block'); - } + } }, initialize: function(options) { this.urls = options.urls; - - $('.action-unenroll').click(this.unenrollClick); + this.isEdx = options.isEdx; $('#unenroll_form').on('ajax:complete', this.unenrollComplete.bind(this)); - - $('#unregister_block_course').click(function(event) { - $('#unenroll_course_id').val($(event.target).data('course-id')); - $('#unenroll_course_number').text($(event.target).data('course-number')); - $('#unenroll_course_name').text($(event.target).data('course-name')); - }); } }); } diff --git a/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js b/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js index b99ba17d0e..1aa0c8efc9 100644 --- a/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js +++ b/lms/static/js/spec/learner_dashboard/unenroll_view_spec.js @@ -10,7 +10,8 @@ define([ urls: { dashboard: '/dashboard', browseCourses: '/courses' - } + }, + isEdx: true }, initView; diff --git a/lms/static/sass/multicourse/_dashboard.scss b/lms/static/sass/multicourse/_dashboard.scss index 8dec25eb3a..d27b5be8af 100644 --- a/lms/static/sass/multicourse/_dashboard.scss +++ b/lms/static/sass/multicourse/_dashboard.scss @@ -1499,9 +1499,18 @@ a.fade-cover{ } } +#unenroll-modal { + margin-top: -60px; +} + .reasons_survey { padding: 20px; + .options { + list-style: none; + padding: 0; + } + .option { margin-bottom: 10px; display: block; @@ -1516,7 +1525,6 @@ a.fade-cover{ } .other_text { - margin-top: 10px; margin-top: 0; } @@ -1533,7 +1541,12 @@ a.fade-cover{ margin-top: 10px; margin-left: 2.5%; margin-right: 2.5%; - color: white; + color: $white; + } + + .survey_button:visited, .survey_button:hover, .survey_button:focus { + color: $white; + text-decoration: none; } } diff --git a/lms/templates/dashboard.html b/lms/templates/dashboard.html index 99e2ce6191..13765bdd02 100644 --- a/lms/templates/dashboard.html +++ b/lms/templates/dashboard.html @@ -49,7 +49,8 @@ from openedx.core.djangolib.markup import HTML, Text signInUser: "${reverse('signin_user') | n, js_escaped_string}", changeEmailSettings: "${reverse('change_email_settings') | n, js_escaped_string}", browseCourses: "${marketing_link('COURSES') | n, js_escaped_string}" - } + }, + isEdx: false }); % if settings.FEATURES.get('ENABLE_DASHBOARD_SEARCH'): diff --git a/lms/templates/dashboard/_reason_survey.html b/lms/templates/dashboard/_reason_survey.html index f718535193..b0fffb0b54 100644 --- a/lms/templates/dashboard/_reason_survey.html +++ b/lms/templates/dashboard/_reason_survey.html @@ -26,10 +26,12 @@ from django.utils.translation import ugettext as _ ${_('Thank you for sharing your reasons for unenrolling.')}
${_('You are unenrolled from')} ${course_overview.display_name_with_default}. - - ${_('Return To Dashboard')} - - - ${_('Browse Courses')} - +
+ + ${_('Return To Dashboard')} + + + ${_('Browse Courses')} + +
diff --git a/themes/edx.org/lms/templates/dashboard.html b/themes/edx.org/lms/templates/dashboard.html index e6d9ee4bd6..deaf0cb484 100644 --- a/themes/edx.org/lms/templates/dashboard.html +++ b/themes/edx.org/lms/templates/dashboard.html @@ -43,6 +43,17 @@ from openedx.core.djangoapps.theming import helpers as theming_helpers }); }); + <%static:require_module module_name="js/learner_dashboard/unenrollment_factory" class_name="UnenrollmentFactory"> + UnenrollmentFactory({ + urls: { + dashboard: "${reverse('dashboard') | n, js_escaped_string}", + signInUser: "${reverse('signin_user') | n, js_escaped_string}", + changeEmailSettings: "${reverse('change_email_settings') | n, js_escaped_string}", + browseCourses: "${marketing_link('COURSES') | n, js_escaped_string}" + }, + isEdx: true + }); + % if settings.FEATURES.get('ENABLE_DASHBOARD_SEARCH'): <%static:require_module module_name="course_search/js/dashboard_search_factory" class_name="DashboardSearchFactory"> DashboardSearchFactory(); @@ -258,7 +269,7 @@ from openedx.core.djangoapps.theming import helpers as theming_helpers -
+