notify users of changes if the visibility api is supported

www/slide/main.js

@@ -6,10 +6,12 @@ define([
     '/bower_components/textpatcher/TextPatcher.amd.js',
     '/common/cryptpad-common.js',
     '/slide/slide.js',
+    '/common/notify.js',
+    '/common/visible.js',
     '/bower_components/file-saver/FileSaver.min.js',
     '/bower_components/jquery/dist/jquery.min.js',
     '/customize/pad.js'
-], function (Config, Messages, Realtime, Crypto, TextPatcher, Cryptpad, Slide) {
+], function (Config, Messages, Realtime, Crypto, TextPatcher, Cryptpad, Slide, Notify, Visible) {
     var $ = window.jQuery;
     var saveAs = window.saveAs;
 
@@ -49,6 +51,18 @@ define([
         return title;
     };
 
+    var unnotify = function () {
+        if (!(module.tabNofification &&
+            typeof(module.tabNofification.cancel) === 'function')) { return; }
+        module.tabNofification.cancel();
+    };
+
+    var notify = function () {
+        if (!(Visible.isSupported() && !Visible.currently())) { return; }
+        unnotify();
+        module.tabNofification = Notify.tab(document.title, 1000, 10);
+    };
+
     var $modal = $('#modal');
     var $content = $('#content');
     Slide.setModal($modal, $content);
@@ -213,8 +227,9 @@ define([
         elem.selectionEnd = selects[1];
 
         Slide.update(content);
-    };
 
+        notify();
+    };
 
     var onReady = config.onReady = function (info) {
         var realtime = module.realtime = info.realtime;
@@ -228,6 +243,12 @@ define([
 
         Slide.update(content);
 
+        if (Visible.isSupported()) {
+            Visible.onChange(function (yes) {
+                if (yes) { unnotify(); }
+            });
+        }
+
         setEditable(true);
         initializing = false;
     };