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

lms/static/js/courseware/course_home_events.js

@@ -0,0 +1,16 @@
+;(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

@@ -1,18 +1,18 @@
 ;(function (define) {
     'use strict';
 
-    define(["jquery"],
-        function ($) {
+    define(['jquery', 'logger', 'moment'],
+        function ($, Logger, moment) {
 
             return function () {
                 // define variables for code legibility
                 var toggleActionElements = $('.toggle-visibility-button');
 
-                var updateToggleActionText = function (targetElement, actionElement) {
+                var updateToggleActionText = function (elementIsHidden, actionElement) {
                     var show_text = actionElement.data('show');
                     var hide_text = actionElement.data('hide');
 
-                    if (targetElement.is(":visible")) {
+                    if (elementIsHidden) {
                         if (hide_text) {
                             actionElement.html(actionElement.data('hide'));
                         } else {
@@ -26,15 +26,21 @@
                 };
 
                 $.each(toggleActionElements, function (i, elem) {
-                    var toggleActionElement = $(elem);
-                    var toggleTargetElement = toggleActionElement.siblings('.toggle-visibility-element');
+                    var toggleActionElement = $(elem),
+                        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) {
                         event.preventDefault();
                         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,0 +1,14 @@
+<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,0 +1,23 @@
+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

@@ -1,5 +1,5 @@
-define(['jquery', 'js/courseware/toggle_element_visibility'],
-    function ($, ToggleElementVisibility) {
+define(['jquery', 'logger', 'js/courseware/toggle_element_visibility'],
+    function ($, Logger, ToggleElementVisibility) {
         'use strict';
 
         describe('show/hide with mouse click', function () {
@@ -9,18 +9,23 @@ define(['jquery', 'js/courseware/toggle_element_visibility'],
                 /*jshint newcap: false */
                 ToggleElementVisibility();
                 /*jshint newcap: true */
+                spyOn(Logger, 'log');
             });
 
             it('ensures update will hide on hide button click', function () {
-                var $shownUpdate = $('.toggle-visibility-element:not(.hidden)').first();
-                $shownUpdate.siblings('.toggle-visibility-button').trigger('click');
+                var $shownUpdate = $('.toggle-visibility-element:not(.hidden)').first(),
+                    $updateButton = $shownUpdate.siblings('.toggle-visibility-button');
+                $updateButton.trigger('click');
                 expect($shownUpdate).toHaveClass('hidden');
+                expect($updateButton.text()).toEqual('Show');
             });
 
             it('ensures update will show on show button click', function () {
-                var $hiddenUpdate = $('.toggle-visibility-element.hidden').first();
-                $hiddenUpdate.siblings('.toggle-visibility-button').trigger('click');
+                var $hiddenUpdate = $('.toggle-visibility-element.hidden').first(),
+                    $updateButton = $hiddenUpdate.siblings('.toggle-visibility-button');
+                $updateButton.trigger('click');
                 expect($hiddenUpdate).not.toHaveClass('hidden');
+                expect($updateButton.text()).toEqual('Hide');
             });
 
             it('ensures old updates will show on button click', function () {
@@ -32,5 +37,14 @@ define(['jquery', 'js/courseware/toggle_element_visibility'],
                 $('.toggle-visibility-button.show-older-updates').trigger('click');
                 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
 <%static:require_module module_name="js/courseware/toggle_element_visibility" class_name="ToggleElementVisibility">
         ToggleElementVisibility();
 </%static:require_module>
+<%static:require_module module_name="js/courseware/course_home_events" class_name="CourseHomeEvents">
+        CourseHomeEvents();
+</%static:require_module>
 
 <%block name="js_extra">
 <script type="text/javascript" src="${static.url('js/jquery.treeview.js')}"></script>