From 95f4b2357d9f8c0937062807da697b3cb038ffd5 Mon Sep 17 00:00:00 2001
From: yflory <yann.flory@xwiki.com>
Date: Mon, 22 Jun 2020 11:32:42 +0200
Subject: [PATCH] Don't redraw kanban when the tab is not focused

---
 www/common/visible.js    |  6 ++++--
 www/kanban/jkanban_cp.js | 38 ++++++++++++++++++++++++++++----------
 2 files changed, 32 insertions(+), 12 deletions(-)

diff --git a/www/common/visible.js b/www/common/visible.js
index f73fa49bc..61512ff59 100644
--- a/www/common/visible.js
+++ b/www/common/visible.js
@@ -25,10 +25,12 @@
             typeof document[hidden] === "undefined");
     };
 
-    Visible.onChange = function (f) {
+    Visible.onChange = function (f, once) {
         document.addEventListener(visibilityChange, function (ev) {
             f(!document[hidden], ev);
-        }, false);
+        }, {
+            once: once
+        });
     };
 
     Visible.currently = function () {
diff --git a/www/kanban/jkanban_cp.js b/www/kanban/jkanban_cp.js
index 54fb71f46..1604a1315 100644
--- a/www/kanban/jkanban_cp.js
+++ b/www/kanban/jkanban_cp.js
@@ -1,8 +1,9 @@
 define([
     'jquery',
     '/customize/messages.js',
+    '/common/visible.js',
     '/bower_components/dragula.js/dist/dragula.min.js',
-], function ($, Messages, Dragula) {
+], function ($, Messages, Visible, Dragula) {
         /**
          * jKanban
          * Vanilla Javascript plugin for manage kanban boards
@@ -739,6 +740,8 @@ define([
             return self;
         };
 
+        var todoOnVisible = function () {};
+        var onVisibleHandler = false;
         this.setBoards = function (boards) {
             var scroll = {};
             // Fix the tags
@@ -754,15 +757,30 @@ define([
                 this.removeBoard(boardkey);
             }
             this.options.boards = boards;
-            // Add all new boards
-            this.addBoards();
-            self.options.refresh();
-            // Preserve scroll
-            this.options.boards.list.forEach(function (id) {
-                if (!scroll[id]) { return; }
-                $('.kanban-board[data-id="'+id+'"] .kanban-drag').scrollTop(scroll[id]);
-            });
-            $el.scrollLeft(scrollLeft);
+
+            todoOnVisible = function () {
+                // Add all new boards
+                self.addBoards();
+                self.options.refresh();
+                // Preserve scroll
+                self.options.boards.list.forEach(function (id) {
+                    if (!scroll[id]) { return; }
+                    $('.kanban-board[data-id="'+id+'"] .kanban-drag').scrollTop(scroll[id]);
+                });
+                $el.scrollLeft(scrollLeft);
+            };
+
+            // If the tab is not focused, redraw on focus
+            if (!Visible.currently()) {
+                if (onVisibleHandler) { return; }
+                onVisibleHandler = true;
+                return void Visible.onChange(function (visible) {
+                    if (!visible) { return; }
+                    todoOnVisible();
+                    onVisibleHandler = false;
+                }, true);
+            }
+            todoOnVisible();
         };
 
         this.findBoard = function (id) {