d7053a6783
* fix: eslint operator-linebreak issue * fix: eslint quotes issue * fix: react jsx indent and props issues * fix: eslint trailing spaces issues * fix: eslint line around directives issue * fix: eslint semi rule * fix: eslint newline per chain rule * fix: eslint space infix ops rule * fix: eslint space-in-parens issue * fix: eslint space before function paren issue * fix: eslint space before blocks issue * fix: eslint arrow body style issue * fix: eslint dot-location issue * fix: eslint quotes issue * fix: eslint quote props issue * fix: eslint operator assignment issue * fix: eslint new line after import issue * fix: indent issues * fix: operator assignment issue * fix: all autofixable eslint issues * fix: all react related fixable issues * fix: autofixable eslint issues * chore: remove all template literals * fix: remaining autofixable issues * fix: failing js test
309 lines
14 KiB
JavaScript
309 lines
14 KiB
JavaScript
/* eslint-disable operator-linebreak */
|
|
/**
|
|
* Legacy JavaScript for the student dashboard.
|
|
* Please do not add anything else to this file unless
|
|
* you have an extremely good reason. New JavaScript
|
|
* for the dashboard should be implemented as self-contained
|
|
* modules with unit tests.
|
|
*/
|
|
|
|
/* globals Logger, accessible_modal, interpolate */
|
|
|
|
var edx = edx || {};
|
|
|
|
(function($, gettext, Logger, accessibleModal, interpolate) {
|
|
'use strict';
|
|
|
|
edx.dashboard = edx.dashboard || {};
|
|
edx.dashboard.legacy = {};
|
|
|
|
/**
|
|
* Initialize the dashboard using legacy JavaScript.
|
|
*
|
|
* @param{Object} urls - The URLs used by the JavaScript,
|
|
* which are generated by the server and passed into
|
|
* this function by the rendered page.
|
|
*
|
|
* Specifically:
|
|
* - dashboard
|
|
* - signInUser
|
|
* - changeEmailSettings
|
|
* - verifyToggleBannerFailedOff
|
|
*/
|
|
edx.dashboard.legacy.init = function(urls) {
|
|
var $notifications = $('.dashboard-notifications'),
|
|
$upgradeButtonLinks = $('.action-upgrade'),
|
|
$verifyButtonLinks = $('.verification-cta > .cta');
|
|
|
|
// On initialization, set focus to the first notification available for screen readers.
|
|
if ($notifications.children().length > 0) {
|
|
$notifications.focus();
|
|
}
|
|
|
|
// Track clicks of the upgrade button. The `trackLink` method is a helper that makes
|
|
// a `track` call whenever a bound link is clicked. Usually the page would change before
|
|
// `track` had time to execute; `trackLink` inserts a small timeout to give the `track`
|
|
// call enough time to fire. The clicked link element is passed to `generateProperties`.
|
|
// NOTE: This is a duplicate of the 'edx.course.enrollment.upgrade.clicked' event with
|
|
// location learner_dashboard. This bi event is being left in for now because:
|
|
// 1. I don't know who is relying on it and it is viewable separately in GA.
|
|
// 2. The other event doesn't yet have the benefit of the timeout of trackLink(), so
|
|
// the other event might under-report as compared to this event.
|
|
window.analytics.trackLink($upgradeButtonLinks, 'edx.bi.dashboard.upgrade_button.clicked', generateProperties);
|
|
|
|
// Track clicks of the "verify now" button.
|
|
window.analytics.trackLink($verifyButtonLinks, 'edx.bi.user.verification.resumed', generateProperties);
|
|
|
|
// Track clicks of the LinkedIn "Add to Profile" button
|
|
window.analytics.trackLink(
|
|
$('.action-linkedin-profile'),
|
|
'edx.bi.user.linkedin_add_to_profile',
|
|
function(element) {
|
|
var $el = $(element);
|
|
return {
|
|
category: 'linkedin',
|
|
label: $el.data('course-id'),
|
|
mode: $el.data('certificate-mode')
|
|
};
|
|
}
|
|
);
|
|
|
|
// Generate the properties object to be passed along with business intelligence events.
|
|
function generateProperties(element) {
|
|
var $el = $(element),
|
|
properties = {};
|
|
|
|
if ($el.hasClass('action-upgrade')) {
|
|
properties.category = 'upgrade';
|
|
} else if ($el.hasClass('cta')) {
|
|
properties.category = 'verification';
|
|
}
|
|
|
|
properties.label = $el.data('course-id');
|
|
|
|
return properties;
|
|
}
|
|
|
|
function setDialogAttributes(isPaidCourse, isCourseVoucherRefundable, certNameLong,
|
|
courseNumber, courseName, enrollmentMode, showRefundOption, courseKey) {
|
|
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} ({courseNumber})?');
|
|
} else if (enrollmentMode !== 'verified') {
|
|
diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from {courseName} '
|
|
+ '({courseNumber})?');
|
|
} else if (showRefundOption && !isCourseVoucherRefundable) {
|
|
diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the verified '
|
|
+ '{certNameLong} track of {courseName} ({courseNumber})?');
|
|
} else if (showRefundOption) {
|
|
diagAttr['data-track-info'] = gettext('Are you sure you want to unenroll from the verified '
|
|
+ '{certNameLong} track of {courseName} ({courseNumber})?');
|
|
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} track of {courseName} ({courseNumber})?');
|
|
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,
|
|
type: 'post'
|
|
});
|
|
$('#failed-verification-banner').addClass('is-hidden');
|
|
});
|
|
|
|
$('.action-upgrade').click(function() {
|
|
Logger.log('edx.course.enrollment.upgrade.clicked', {location: 'learner_dashboard'});
|
|
});
|
|
|
|
$('.action-email-settings').click(function(event) {
|
|
$('#email_settings_course_id').val($(event.target).data('course-id'));
|
|
$('#email_settings_course_number').text($(event.target).data('course-number'));
|
|
if ($(event.target).data('optout') === 'False') {
|
|
$('#receive_emails').prop('checked', true);
|
|
}
|
|
});
|
|
$('.action-unenroll').click(function(event) {
|
|
var isPaidCourse = $(event.target).data('course-is-paid-course') === 'True',
|
|
isCourseVoucherRefundable = $(event.target).data('is-course-voucher-refundable') === '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'),
|
|
courseKey = $(event.target).data('course-id'),
|
|
dialogMessageAttr;
|
|
|
|
var request = $.ajax({
|
|
url: courseRefundUrl,
|
|
method: 'GET',
|
|
dataType: 'json'
|
|
});
|
|
request.success(function(data, textStatus, xhr) {
|
|
if (xhr.status === 200) {
|
|
dialogMessageAttr = setDialogAttributes(isPaidCourse, isCourseVoucherRefundable, certNameLong,
|
|
courseNumber, courseName, enrollmentMode, data.course_refundable_status, courseKey);
|
|
|
|
$('#track-info').empty();
|
|
$('#refund-info').empty();
|
|
|
|
edx.HtmlUtils.setHtml(
|
|
$('#track-info'),
|
|
edx.HtmlUtils.interpolateHtml(dialogMessageAttr['data-track-info'], {
|
|
courseNumber: edx.HtmlUtils.joinHtml(
|
|
edx.HtmlUtils.HTML('<span id="unenroll_course_number">'),
|
|
courseNumber,
|
|
edx.HtmlUtils.HTML('</span>')
|
|
),
|
|
courseName: edx.HtmlUtils.joinHtml(
|
|
edx.HtmlUtils.HTML('<span id="unenroll_course_name">'),
|
|
courseName,
|
|
edx.HtmlUtils.HTML('</span>')
|
|
),
|
|
certNameLong: edx.HtmlUtils.joinHtml(
|
|
edx.HtmlUtils.HTML('<span id="unenroll_cert_name">'),
|
|
certNameLong,
|
|
edx.HtmlUtils.HTML('</span>')
|
|
)
|
|
}, 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);
|
|
}
|
|
});
|
|
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);
|
|
});
|
|
|
|
$('#unenroll-modal').css('position', 'fixed');
|
|
});
|
|
|
|
$('#email_settings_form').submit(function() {
|
|
$.ajax({
|
|
type: 'POST',
|
|
url: urls.changeEmailSettings,
|
|
data: $(this).serializeArray(),
|
|
success: function(data) {
|
|
if (data.success) {
|
|
location.href = urls.dashboard;
|
|
}
|
|
},
|
|
error: function(xhr) {
|
|
if (xhr.status === 403) {
|
|
location.href = urls.signInUser;
|
|
}
|
|
}
|
|
});
|
|
return false;
|
|
});
|
|
|
|
$('#send_cta_email').click(function(e) {
|
|
$.ajax({
|
|
type: 'POST',
|
|
url: urls.sendAccountActivationEmail,
|
|
data: $(this).serializeArray(),
|
|
success: function() {
|
|
setTimeout(
|
|
function() {
|
|
$('#activate-account-modal p svg').remove();
|
|
// xss-lint: disable=javascript-jquery-append
|
|
$('#activate-account-modal p').append(
|
|
// xss-lint: disable=javascript-concat-html
|
|
'<svg style="vertical-align:bottom" width="20" height="20"' +
|
|
// xss-lint: disable=javascript-concat-html
|
|
'viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n' +
|
|
// xss-lint: disable=javascript-concat-html
|
|
'<path d="M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z" fill="#178253"/>\n' +
|
|
'</svg>'
|
|
);
|
|
}, 500); // adding timeout to make spinner animation longer
|
|
}
|
|
});
|
|
e.preventDefault();
|
|
$('#activate-account-modal p svg').remove();
|
|
// xss-lint: disable=javascript-jquery-append
|
|
$('#activate-account-modal p').append(
|
|
// xss-lint: disable=javascript-concat-html
|
|
'<svg class="fa-pulse" style="vertical-align:bottom" width="20" height="20"' +
|
|
// xss-lint: disable=javascript-concat-html
|
|
'viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n' +
|
|
// xss-lint: disable=javascript-concat-html
|
|
'<path d="M22 12A10 10 0 116.122 3.91l1.176 1.618A8 8 0 1020 12h2z" fill="#6c757d"/>\n' +
|
|
'</svg>'
|
|
);
|
|
});
|
|
|
|
$('#activate-account-modal').on('click', '#button', function() {
|
|
$('#activate-account-modal').css('display', 'none');
|
|
$('#lean_overlay').css({display: 'none'});
|
|
});
|
|
if ($('#activate-account-modal').css('display') === 'block') {
|
|
$('#lean_overlay').css({
|
|
display: 'block',
|
|
'z-index': 0
|
|
});
|
|
$('#activate-account-modal').focus();
|
|
}
|
|
|
|
$('.action-email-settings').each(function(index) {
|
|
$(this).attr('id', 'email-settings-' + index);
|
|
// a bit of a hack, but gets the unique selector for the modal trigger
|
|
var trigger = '#' + $(this).attr('id');
|
|
accessibleModal(
|
|
trigger,
|
|
'#email-settings-modal .close-modal',
|
|
'#email-settings-modal',
|
|
'#dashboard-main'
|
|
);
|
|
});
|
|
|
|
$('.action-unenroll').each(function(index) {
|
|
$(this).attr('id', 'unenroll-' + 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'
|
|
);
|
|
});
|
|
|
|
$('#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));
|