TNL-213: Let Students Add Personal Notes to Course Content.

Co-Authored-By: Jean-Michel Claus <jmc@edx.org>
Co-Authored-By: Brian Talbot <btalbot@edx.org>
Co-Authored-By: Tim Babych <tim@edx.org>
Co-Authored-By: Oleg Marshev <oleg@edx.org>
Co-Authored-By: Chris Rodriguez <crodriguez@edx.org>

common/static/js/spec/logger_spec.js

@@ -0,0 +1,108 @@
+(function() {
+    'use strict';
+    describe('Logger', function() {
+        it('expose window.log_event', function() {
+            expect(window.log_event).toBe(Logger.log);
+        });
+
+        describe('log', function() {
+            it('can send a request to log event', function() {
+                spyOn(jQuery, 'ajaxWithPrefix');
+                Logger.log('example', 'data');
+                expect(jQuery.ajaxWithPrefix).toHaveBeenCalledWith({
+                    url: '/event',
+                    type: 'POST',
+                    data: {
+                        event_type: 'example',
+                        event: '"data"',
+                        page: window.location.href
+                    },
+                    async: true
+                });
+            });
+
+            it('can send a request with custom options to log event', function() {
+                spyOn(jQuery, 'ajaxWithPrefix');
+                Logger.log('example', 'data', null, {type: 'GET', async: false});
+                expect(jQuery.ajaxWithPrefix).toHaveBeenCalledWith({
+                    url: '/event',
+                    type: 'GET',
+                    data: {
+                        event_type: 'example',
+                        event: '"data"',
+                        page: window.location.href
+                    },
+                    async: false
+                });
+            });
+        });
+
+        describe('listen', function() {
+            beforeEach(function () {
+                spyOn(jQuery, 'ajaxWithPrefix');
+                this.callbacks = _.map(_.range(4), function () {
+                    return jasmine.createSpy();
+                });
+                Logger.listen('example', null, this.callbacks[0]);
+                Logger.listen('example', null, this.callbacks[1]);
+                Logger.listen('example', 'element', this.callbacks[2]);
+                Logger.listen('new_event', null, this.callbacks[3]);
+            });
+
+            it('can listen events when the element name is unknown', function() {
+                Logger.log('example', 'data');
+                expect(this.callbacks[0]).toHaveBeenCalledWith('example', 'data', null);
+                expect(this.callbacks[1]).toHaveBeenCalledWith('example', 'data', null);
+                expect(this.callbacks[2]).not.toHaveBeenCalled();
+                expect(this.callbacks[3]).not.toHaveBeenCalled();
+            });
+
+            it('can listen events when the element name is known', function() {
+                Logger.log('example', 'data', 'element');
+                expect(this.callbacks[0]).not.toHaveBeenCalled();
+                expect(this.callbacks[1]).not.toHaveBeenCalled();
+                expect(this.callbacks[2]).toHaveBeenCalledWith('example', 'data', 'element');
+                expect(this.callbacks[3]).not.toHaveBeenCalled();
+            });
+        });
+
+        describe('bind', function() {
+            beforeEach(function() {
+                this.initialPostWithPrefix = jQuery.postWithPrefix;
+                this.initialGetWithPrefix = jQuery.getWithPrefix;
+                this.initialAjaxWithPrefix = jQuery.ajaxWithPrefix;
+                this.prefix = '/6002x';
+                AjaxPrefix.addAjaxPrefix($, _.bind(function () {
+                    return this.prefix;
+                }, this));
+                Logger.bind();
+            });
+
+            afterEach(function() {
+                jQuery.postWithPrefix = this.initialPostWithPrefix;
+                jQuery.getWithPrefix = this.initialGetWithPrefix;
+                jQuery.ajaxWithPrefix = this.initialAjaxWithPrefix;
+                window.onunload = null;
+            });
+
+            it('can bind the onunload event', function() {
+                expect(window.onunload).toEqual(jasmine.any(Function));
+            });
+
+            it('can send a request to log event', function() {
+                spyOn(jQuery, 'ajax');
+                window.onunload();
+                expect(jQuery.ajax).toHaveBeenCalledWith({
+                    url: this.prefix + '/event',
+                    type: 'GET',
+                    data: {
+                        event_type: 'page_close',
+                        event: '',
+                        page: window.location.href
+                    },
+                    async: false
+                });
+            });
+        });
+    });
+}).call(this);

common/static/js/src/logger.js

@@ -0,0 +1,82 @@
+;(function() {
+    'use strict';
+    var Logger = (function() {
+        // listeners[event_type][element] -> list of callbacks
+        var listeners = {},
+            sendRequest, has;
+
+        sendRequest = function(data, options) {
+            var request = $.ajaxWithPrefix ? $.ajaxWithPrefix : $.ajax;
+
+            options = $.extend(true, {
+                'url': '/event',
+                'type': 'POST',
+                'data': data,
+                'async': true
+            }, options);
+            return request(options);
+        };
+
+        has = function(object, propertyName) {
+            return {}.hasOwnProperty.call(object, propertyName);
+        };
+
+        return {
+            /**
+             * Emits an event.
+             */
+            log: function(eventType, data, element, requestOptions) {
+                var callbacks;
+
+                if (!element) {
+                    // null element in the listener dictionary means any element will do.
+                    // null element in the Logger.log call means we don't know the element name.
+                    element = null;
+                }
+                // Check to see if we're listening for the event type.
+                if (has(listeners, eventType)) {
+                    if (has(listeners[eventType], element)) {
+                        // Make the callbacks.
+                        callbacks = listeners[eventType][element];
+                        $.each(callbacks, function(index, callback) {
+                            callback(eventType, data, element);
+                        });
+                    }
+                }
+                // Regardless of whether any callbacks were made, log this event.
+                return sendRequest({
+                    'event_type': eventType,
+                    'event': JSON.stringify(data),
+                    'page': window.location.href
+                }, requestOptions);
+            },
+
+            /**
+             * Adds a listener. If you want any element to trigger this listener,
+             * do element = null
+             */
+            listen: function(eventType, element, callback) {
+                listeners[eventType] = listeners[eventType] || {};
+                listeners[eventType][element] = listeners[eventType][element] || [];
+                listeners[eventType][element].push(callback);
+            },
+
+            /**
+             * Binds `page_close` event.
+             */
+            bind: function() {
+                window.onunload = function() {
+                    sendRequest({
+                        event_type: 'page_close',
+                        event: '',
+                        page: window.location.href
+                    }, {type: 'GET', async: false});
+                };
+            }
+        };
+    }());
+
+    this.Logger = Logger;
+    // log_event exists for compatibility reasons and will soon be deprecated.
+    this.log_event = Logger.log;
+}).call(this);