Trigger notification when marked cells are offscreen

notebook/static/notebook/js/cell.js

@@ -298,6 +298,7 @@ define([
                 } else {
                     this.element.removeClass('marked');
                 }
+                this.events.trigger('marked_changed.Cell', {cell: this, value: value});
             }
         }
     });

notebook/static/notebook/js/notebook.js

@@ -186,6 +186,10 @@ define(function (require) {
     Notebook.prototype.bind_events = function () {
         var that = this;
 
+        this.events.on('marked_changed.Cell', function() {
+            that.update_marked_status();
+        });
+
         this.events.on('set_next_input.Notebook', function (event, data) {
             if (data.replace) {
                 data.cell.set_text(data.text);
@@ -293,6 +297,10 @@ define(function (require) {
             expand_time(time);
         });
 
+        this.scroll_manager.element.scroll(function () {
+            that.update_marked_status();
+        });
+
         // Firefox 22 broke $(window).on("beforeunload")
         // I'm not sure why or how.
         window.onbeforeunload = function (e) {
@@ -732,6 +740,19 @@ define(function (require) {
         this.ensure_focused();
     };
 
+    Notebook.prototype.update_marked_status = function() {
+        var marked_cells = this.get_marked_cells();
+        var num_offscreen = 0;
+        var i;
+        for (i = 0; i < marked_cells.length; i++) {
+            if (!this.scroll_manager.is_cell_visible(marked_cells[i])) {
+                num_offscreen += 1;
+            }
+        }
+
+        this.events.trigger('marked_offscreen.Cell', num_offscreen);
+    };
+
     // Cell selection.
 
     /**
@@ -753,6 +774,7 @@ define(function (require) {
             }
             var cell = this.get_cell(index);
             cell.select();
+            this.update_marked_status();
             if (cell.cell_type === 'heading') {
                 this.events.trigger('selected_cell_type_changed.Notebook',
                     {'cell_type':cell.cell_type,level:cell.level}

notebook/static/notebook/js/notificationarea.js

@@ -25,6 +25,7 @@ define([
     NotebookNotificationArea.prototype.init_notification_widgets = function () {
         this.init_kernel_notification_widget();
         this.init_notebook_notification_widget();
+        this.init_marked_cells_notification_widget();
     };
 
     /**
@@ -339,5 +340,22 @@ define([
         });
     };
 
+    /**
+     * Initialize the notification widget for marked cells.
+     *
+     * @method init_marked_cells_notification_widget
+     */
+    NotebookNotificationArea.prototype.init_marked_cells_notification_widget = function () {
+        var mcnw = this.new_notification_widget('marked_cells');
+
+        this.events.on('marked_offscreen.Cell', function (evt, num) {
+            if (num === 0) {
+                mcnw.hide();
+            } else {
+                mcnw.set_message(num + " marked cells offscreen");
+            }
+        });
+    };
+
     return {'NotebookNotificationArea': NotebookNotificationArea};
 });

notebook/static/notebook/js/scrollmanager.js

@@ -73,6 +73,12 @@ define(['jquery'], function($){
         return Math.min(i + 1, cell_count - 1);
     };
 
+    ScrollManager.prototype.is_cell_visible = function (cell) {
+        var cell_rect = cell.element[0].getBoundingClientRect();
+        var scroll_rect = this.element[0].getBoundingClientRect();
+        return ((cell_rect.top <= scroll_rect.bottom) && (cell_rect.bottom >= scroll_rect.top));
+    };
+
 
     var TargetScrollManager = function(notebook, options) {
         /**