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) {