diff --git a/lms/static/js/dashboard/legacy.js b/lms/static/js/dashboard/legacy.js index 55c9a445dd..fb7b6c5565 100644 --- a/lms/static/js/dashboard/legacy.js +++ b/lms/static/js/dashboard/legacy.js @@ -31,23 +31,51 @@ */ edx.dashboard.legacy.init = function(urls) { - // On initialization, set focus to the first notification available - // for screen readers. - var notifications = $('.dashboard-notifications'); - if (notifications.children().length > 0) { + 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(); } $('.message.is-expandable .wrapper-tip').bind('click', toggleExpandMessage); - function toggleExpandMessage(e) { - (e).preventDefault(); + // 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`. + 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); + + // 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 toggleExpandMessage(event) { + var course = $(event.target).closest('.message-upsell').find('.action-upgrade').data('course-id'); + + event.preventDefault(); $(this).closest('.message.is-expandable').toggleClass('is-expanded'); - var course = $("#upgrade-to-verified").data("course-id"); - analytics.track('edx.bi.dashboard.upsell_copy.clicked', { - category: 'user-engagement', + window.analytics.track('edx.bi.dashboard.upgrade_copy.expanded', { + category: 'upgrade', label: course }); } @@ -61,8 +89,9 @@ }); $("#upgrade-to-verified").click(function(event) { - var user = $(event.target).data("user"); - var course = $(event.target).data("course-id"); + var user = $(event.target).closest(".action-upgrade").data("user"), + course = $(event.target).closest(".action-upgrade").data("course-id"); + Logger.log('edx.course.enrollment.upgrade.clicked', [user, course], null); }); diff --git a/lms/static/js/verify_student/views/enrollment_confirmation_step_view.js b/lms/static/js/verify_student/views/enrollment_confirmation_step_view.js index e865e30fca..20491c7b91 100644 --- a/lms/static/js/verify_student/views/enrollment_confirmation_step_view.js +++ b/lms/static/js/verify_student/views/enrollment_confirmation_step_view.js @@ -11,6 +11,11 @@ var edx = edx || {}; // Currently, this step does not need to install any event handlers, // since the displayed information is static. - edx.verify_student.EnrollmentConfirmationStepView = edx.verify_student.StepView.extend({}); + edx.verify_student.EnrollmentConfirmationStepView = edx.verify_student.StepView.extend({ + postRender: function() { + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'verification', this.templateName ); + } + }); })( jQuery ); diff --git a/lms/static/js/verify_student/views/face_photo_step_view.js b/lms/static/js/verify_student/views/face_photo_step_view.js index 17822b688a..8008565a13 100644 --- a/lms/static/js/verify_student/views/face_photo_step_view.js +++ b/lms/static/js/verify_student/views/face_photo_step_view.js @@ -19,6 +19,9 @@ var edx = edx || {}; errorModel: this.errorModel }).render(); + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'verification', this.templateName ); + this.listenTo( webcam, 'imageCaptured', function() { // Track the user's successful image capture window.analytics.track( 'edx.bi.user.face_image.captured', { diff --git a/lms/static/js/verify_student/views/id_photo_step_view.js b/lms/static/js/verify_student/views/id_photo_step_view.js index cb7724f444..35ed9e7b5d 100644 --- a/lms/static/js/verify_student/views/id_photo_step_view.js +++ b/lms/static/js/verify_student/views/id_photo_step_view.js @@ -19,6 +19,9 @@ var edx = edx || {}; errorModel: this.errorModel }).render(); + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'verification', this.templateName ); + this.listenTo( webcam, 'imageCaptured', function() { // Track the user's successful image capture window.analytics.track( 'edx.bi.user.identification_image.captured', { diff --git a/lms/static/js/verify_student/views/intro_step_view.js b/lms/static/js/verify_student/views/intro_step_view.js index d79b12e61b..4de4efd9ee 100644 --- a/lms/static/js/verify_student/views/intro_step_view.js +++ b/lms/static/js/verify_student/views/intro_step_view.js @@ -21,6 +21,9 @@ var edx = edx || {}; el: $( '.requirements-container', this.el ), requirements: this.stepData.requirements }).render(); + + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'verification', this.templateName ); } }); diff --git a/lms/static/js/verify_student/views/make_payment_step_view.js b/lms/static/js/verify_student/views/make_payment_step_view.js index e0d498db41..28c22e6519 100644 --- a/lms/static/js/verify_student/views/make_payment_step_view.js +++ b/lms/static/js/verify_student/views/make_payment_step_view.js @@ -17,6 +17,9 @@ var edx = edx || {}; requirements: this.stepData.requirements }).render(); + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'payment', this.templateName ); + // Update the contribution amount with the amount the user // selected in a previous screen. if ( this.stepData.contributionAmount ) { @@ -84,7 +87,7 @@ var edx = edx || {}; // Marketing needs a way to tell the difference between users // leaving for the payment processor and users dropping off on // this page. A virtual pageview can be used to do this. - window.analytics.page( 'verification', 'payment_processor_step' ); + window.analytics.page( 'payment', 'payment_processor_step' ); form.submit(); }, diff --git a/lms/static/js/verify_student/views/payment_confirmation_step_view.js b/lms/static/js/verify_student/views/payment_confirmation_step_view.js index 40e0129241..47f8443d1a 100644 --- a/lms/static/js/verify_student/views/payment_confirmation_step_view.js +++ b/lms/static/js/verify_student/views/payment_confirmation_step_view.js @@ -71,18 +71,20 @@ var edx = edx || {}; * those used to track business intelligence events. */ postRender: function() { + var $verifyNowButton = $('#verify_now_button'), + $verifyLaterButton = $('#verify_later_button'); + + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'payment', this.templateName ); + // Track the user's decision to verify immediately - $( '#verify_now_button' ).on( 'click', function() { - window.analytics.track( 'edx.bi.user.verification.immediate', { - category: 'verification' - }); + window.analytics.trackLink( $verifyNowButton, 'edx.bi.user.verification.immediate', { + category: 'verification' }); // Track the user's decision to defer their verification - $( '#verify_later_button' ).on( 'click', function() { - window.analytics.track( 'edx.bi.user.verification.deferred', { - category: 'verification' - }); + window.analytics.trackLink( $verifyLaterButton, 'edx.bi.user.verification.deferred', { + category: 'verification' }); }, diff --git a/lms/static/js/verify_student/views/review_photos_step_view.js b/lms/static/js/verify_student/views/review_photos_step_view.js index 8617893b09..1e434dcf19 100644 --- a/lms/static/js/verify_student/views/review_photos_step_view.js +++ b/lms/static/js/verify_student/views/review_photos_step_view.js @@ -30,6 +30,9 @@ var edx = edx || {}; // When moving to the next step, submit photos for verification $( '#next_step_button' ).on( 'click', _.bind( this.submitPhotos, this ) ); + + // Track a virtual pageview, for easy funnel reconstruction. + window.analytics.page( 'verification', this.templateName ); }, toggleSubmitEnabled: function() { @@ -38,7 +41,7 @@ var edx = edx || {}; retakePhotos: function() { // Track the user's intent to retake their photos - window.analytics.track( 'edx.bi.user.verification_images.retaken', { + window.analytics.track( 'edx.bi.user.images.retaken', { category: 'verification' }); diff --git a/lms/static/js/verify_student/views/step_view.js b/lms/static/js/verify_student/views/step_view.js index a069b96eb9..869754566a 100644 --- a/lms/static/js/verify_student/views/step_view.js +++ b/lms/static/js/verify_student/views/step_view.js @@ -47,9 +47,6 @@ this.postRender(); } ).fail( _.bind( this.handleError, this ) ); - - // Track a virtual pageview, for easy funnel reconstruction. - window.analytics.page( 'verification', this.templateName ); }, handleResponse: function( data ) { diff --git a/lms/templates/dashboard/_dashboard_course_listing.html b/lms/templates/dashboard/_dashboard_course_listing.html index c8b801379f..026d4c0e95 100644 --- a/lms/templates/dashboard/_dashboard_course_listing.html +++ b/lms/templates/dashboard/_dashboard_course_listing.html @@ -141,7 +141,7 @@ % endif
- ${_('Verify Now')} + ${_('Verify Now')}
% elif verification_status['status'] == VERIFY_STATUS_SUBMITTED:

${_('You have already verified your ID!')}

@@ -173,13 +173,13 @@