MA-240 Added window beforeunload handler to the ActiveVideoUploadList view,

which shows a notification if there are any "Queued" or "Uploading" videos still in progress.

cms/static/js/spec/views/active_video_upload_list_spec.js

@@ -22,6 +22,11 @@ define(
                 $(document).ajaxError(this.globalAjaxError);
             });
 
+            // Remove window unload handler triggered by the upload requests
+            afterEach(function() {
+                $(window).off("beforeunload");
+            });
+
             it("should trigger file selection when either the upload button or the drop zone is clicked", function() {
                 var clickSpy = jasmine.createSpy();
                 clickSpy.andCallFake(function(event) { event.preventDefault(); });
@@ -33,6 +38,10 @@ define(
                 expect(clickSpy).toHaveBeenCalled();
             });
 
+            it('should not show a notification message if there are no active video uploads', function () {
+                expect(this.view.onBeforeUnload()).toBeUndefined();
+            });
+
             var makeUploadUrl = function(fileName) {
                 return "http://www.example.com/test_url/" + fileName;
             };
@@ -152,6 +161,10 @@ define(
                                 });
                             });
 
+                            it('should show a notification message when there are active video uploads', function () {
+                                expect(this.view.onBeforeUnload()).toBe("Your video uploads are not complete.");
+                            });
+
                             // TODO: test progress update; the libraries we are using to mock ajax
                             // do not currently support progress events. If we upgrade to Jasmine
                             // 2.0, the latest version of jasmine-ajax (mock-ajax.js) does have the
@@ -211,6 +224,21 @@ define(
                                                 expect($uploadElem).not.toHaveClass("queued");
                                             });
                                         }
+
+                                        // If we're uploading more files than the one we've closed above, 
+                                        // the unload warning should still be shown
+                                        if (caseInfo.numFiles > 1) {
+                                            it('should show notification when videos are still uploading', 
+                                                function () {
+                                                    expect(this.view.onBeforeUnload()).toBe(
+                                                        "Your video uploads are not complete.");
+                                            });
+                                        } else {
+                                            it('should not show notification once video uploads are complete', 
+                                                function () {
+                                                    expect(this.view.onBeforeUnload()).toBeUndefined();
+                                            });
+                                        }
                                     });
                                 }
                             );

cms/static/js/views/active_video_upload_list.js

@@ -48,10 +48,25 @@ define(
                 };
                 $(window).on("dragover", preventDefault);
                 $(window).on("drop", preventDefault);
+                $(window).on("beforeunload", this.onBeforeUnload.bind(this));
 
                 return this;
             },
 
+            onBeforeUnload: function () {
+                // Are there are uploads queued or in progress?
+                var uploading = this.collection.filter(function(model) {
+                    var stat = model.get("status");
+                    return (model.get("progress") < 1) &&
+                          ((stat === ActiveVideoUpload.STATUS_QUEUED ||
+                           (stat === ActiveVideoUpload.STATUS_UPLOADING)));
+                });
+                // If so, show a warning message.
+                if (uploading.length) {
+                    return gettext("Your video uploads are not complete.");
+                }
+            },
+
             addUpload: function(model) {
                 var itemView = new ActiveVideoUploadView({model: model});
                 this.itemViews.push(itemView);