Skip to content

E
edx-platform
Commit 244843d9 by Peter Fogg
Options

Track events on the course home page. 

Events are added for accessing the courseware, entering the verified
upgrade flow, and toggling a course update.

ECOM-2983
parent 0c1dc272
Showing with 90 additions and 14 deletions
lms/static/js/courseware/course_home_events.js 0 → 100644
;(function(define) {
'use strict';
define(['jquery', 'logger'], function ($, Logger) {
return function () {
$('.last-accessed-link').on('click', function (event) {
Logger.log('edx.course.home.resume_course.clicked', {
url: event.currentTarget.href
});
});
$('.date-summary-verified-upgrade-deadline .date-summary-link').on('click', function () {
Logger.log('edx.course.home.upgrade_verified.clicked', {});
});
};
});
}).call(this, define || RequireJS.define);
lms/static/js/courseware/toggle_element_visibility.js
;(function (define) { ;(function (define) {
'use strict'; 'use strict';
define(["jquery"], define(['jquery', 'logger', 'moment'],
function ($) { function ($, Logger, moment) {
return function () { return function () {
// define variables for code legibility // define variables for code legibility
var toggleActionElements = $('.toggle-visibility-button'); var toggleActionElements = $('.toggle-visibility-button');
var updateToggleActionText = function (targetElement, actionElement) { var updateToggleActionText = function (elementIsHidden, actionElement) {
var show_text = actionElement.data('show'); var show_text = actionElement.data('show');
var hide_text = actionElement.data('hide'); var hide_text = actionElement.data('hide');
if (targetElement.is(":visible")) { if (elementIsHidden) {
if (hide_text) { if (hide_text) {
actionElement.html(actionElement.data('hide')); actionElement.html(actionElement.data('hide'));
} else { } else {
...@@ -26,15 +26,21 @@ ...@@ -26,15 +26,21 @@
}; };
$.each(toggleActionElements, function (i, elem) { $.each(toggleActionElements, function (i, elem) {
var toggleActionElement = $(elem); var toggleActionElement = $(elem),
var toggleTargetElement = toggleActionElement.siblings('.toggle-visibility-element'); toggleTargetElement = toggleActionElement.siblings('.toggle-visibility-element'),
elementIsHidden = toggleTargetElement.is(':visible'),
date = toggleTargetElement.siblings('.date').text();
updateToggleActionText(toggleTargetElement, toggleActionElement); updateToggleActionText(elementIsHidden, toggleActionElement);
toggleActionElement.on('click', function (event) { toggleActionElement.on('click', function (event) {
event.preventDefault(); event.preventDefault();
toggleTargetElement.toggleClass('hidden'); toggleTargetElement.toggleClass('hidden');
updateToggleActionText(toggleTargetElement, toggleActionElement); updateToggleActionText(!toggleTargetElement.hasClass('hidden'), toggleActionElement);
Logger.log('edx.course.home.course_update.toggled', {
action: elementIsHidden ? 'hide' : 'show',
publish_date: moment(date, 'MMM DD, YYYY').format()
});
}); });
}); });
}; };
......
lms/static/js/fixtures/courseware/course_home_events.html 0 → 100644
<div class="date-summary-container">
<div class="date-summary date-summary-verified-upgrade-deadline">
<h3 class="heading">Verification Upgrade Deadline</h3>
<h4 class="date">in 3 weeks - Feb 12, 2016</h4>
<p class="description">You are still eligible to upgrade to a Verified Certificate! Pursue it to highlight the knowledge and skills you gain in this course.</p>
<span class="date-summary-link">
<a href="/verify_student/upgrade/course-v1:Test+TestX+2015/">Upgrade to Verified Certificate</a>
</span>
</div>
</div>
<div class="page-header-secondary">
<a href="/courses/course-v1:edX+DemoX+Demo_Course/courseware/19a30717eff543078a5d94ae9d6c18a5/" class="last-accessed-link">Resume Course</a>
</div>
lms/static/js/spec/courseware/course_home_events.js 0 → 100644
define(['jquery', 'logger', 'js/courseware/course_home_events'], function ($, Logger, courseHomeEvents) {
'use strict';
describe('Course home page eventing', function () {
beforeEach(function () {
loadFixtures('js/fixtures/courseware/course_home_events.html');
courseHomeEvents();
spyOn(Logger, 'log');
});
it('sends an event when "Resume Course" is clicked', function () {
$('.last-accessed-link').click();
expect(Logger.log).toHaveBeenCalledWith('edx.course.home.resume_course.clicked', {
url: "/courses/course-v1:edX+DemoX+Demo_Course/courseware/19a30717eff543078a5d94ae9d6c18a5/"
});
});
it('sends an event when "Upgrade to Verified" is clicked', function () {
$('.date-summary-link').click();
expect(Logger.log).toHaveBeenCalledWith('edx.course.home.upgrade_verified.clicked', {});
});
});
});
lms/static/js/spec/courseware/updates_visibility.js
define(['jquery', 'js/courseware/toggle_element_visibility'], define(['jquery', 'logger', 'js/courseware/toggle_element_visibility'],
function ($, ToggleElementVisibility) { function ($, Logger, ToggleElementVisibility) {
'use strict'; 'use strict';
describe('show/hide with mouse click', function () { describe('show/hide with mouse click', function () {
...@@ -9,18 +9,23 @@ define(['jquery', 'js/courseware/toggle_element_visibility'], ...@@ -9,18 +9,23 @@ define(['jquery', 'js/courseware/toggle_element_visibility'],
/*jshint newcap: false */ /*jshint newcap: false */
ToggleElementVisibility(); ToggleElementVisibility();
/*jshint newcap: true */ /*jshint newcap: true */
spyOn(Logger, 'log');
}); });
it('ensures update will hide on hide button click', function () { it('ensures update will hide on hide button click', function () {
var $shownUpdate = $('.toggle-visibility-element:not(.hidden)').first(); var $shownUpdate = $('.toggle-visibility-element:not(.hidden)').first(),
$shownUpdate.siblings('.toggle-visibility-button').trigger('click'); $updateButton = $shownUpdate.siblings('.toggle-visibility-button');
$updateButton.trigger('click');
expect($shownUpdate).toHaveClass('hidden'); expect($shownUpdate).toHaveClass('hidden');
expect($updateButton.text()).toEqual('Show');
}); });
it('ensures update will show on show button click', function () { it('ensures update will show on show button click', function () {
var $hiddenUpdate = $('.toggle-visibility-element.hidden').first(); var $hiddenUpdate = $('.toggle-visibility-element.hidden').first(),
$hiddenUpdate.siblings('.toggle-visibility-button').trigger('click'); $updateButton = $hiddenUpdate.siblings('.toggle-visibility-button');
$updateButton.trigger('click');
expect($hiddenUpdate).not.toHaveClass('hidden'); expect($hiddenUpdate).not.toHaveClass('hidden');
expect($updateButton.text()).toEqual('Hide');
}); });
it('ensures old updates will show on button click', function () { it('ensures old updates will show on button click', function () {
...@@ -32,5 +37,14 @@ define(['jquery', 'js/courseware/toggle_element_visibility'], ...@@ -32,5 +37,14 @@ define(['jquery', 'js/courseware/toggle_element_visibility'],
$('.toggle-visibility-button.show-older-updates').trigger('click'); $('.toggle-visibility-button.show-older-updates').trigger('click');
expect($oldUpdates).not.toHaveClass('hidden'); expect($oldUpdates).not.toHaveClass('hidden');
}); });
it('sends a tracking event on hide and show', function () {
var $update = $('.toggle-visibility-element:not(.hidden)').first();
$update.siblings('.toggle-visibility-button').trigger('click');
expect(Logger.log).toHaveBeenCalledWith('edx.course.home.course_update.toggled', {
action: 'hide',
publish_date: '2015-12-01T00:00:00+00:00'
});
});
}); });
}); });
lms/templates/courseware/info.html
...@@ -37,6 +37,9 @@ from openedx.core.djangoapps.self_paced.models import SelfPacedConfiguration ...@@ -37,6 +37,9 @@ from openedx.core.djangoapps.self_paced.models import SelfPacedConfiguration
<%static:require_module module_name="js/courseware/toggle_element_visibility" class_name="ToggleElementVisibility"> <%static:require_module module_name="js/courseware/toggle_element_visibility" class_name="ToggleElementVisibility">
ToggleElementVisibility(); ToggleElementVisibility();
</%static:require_module> </%static:require_module>
<%static:require_module module_name="js/courseware/course_home_events" class_name="CourseHomeEvents">
CourseHomeEvents();
</%static:require_module>
<%block name="js_extra"> <%block name="js_extra">
<script type="text/javascript" src="${static.url('js/jquery.treeview.js')}"></script> <script type="text/javascript" src="${static.url('js/jquery.treeview.js')}"></script>
......
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