Fixed issue of tooltip not disapearing

Tooltips would not disappear if the mouse was never on it. If you move your mouse on an icon and then move the mouse out without passing by the tooltip, the tooltip would remain active until mouse pass and leave or click somewhere else.

With this update, the tooltip will be removed if you leave the target unless you move the mouse to the tooltip.

2 files changed, 22 insertions, 3 deletions

diff --git a/assets/js/app.min.js b/assets/js/app.min.js
index 52653c11..b72308dc 100644
--- a/assets/js/app.min.js
+++ b/assets/js/app.min.js
@@ -53,14 +53,17 @@ return viewport.width<800?'75%':'800px'}
 KB.on('modal.close',function(){destroy()});KB.on('modal.submit',function(){submitForm()});KB.modal={open:function(url,size,overlayClickDestroy){KB.trigger('modal.open');_KB.get('Dropdown').close();destroy();if(typeof overlayClickDestroy==='undefined'){overlayClickDestroy=!0}
 KB.http.get(url).success(function(response){isOpen=!0;create(response,getWidth(size),overlayClickDestroy)})},close:function(){destroy()},isOpen:function(){return isOpen},replace:function(url){KB.http.get(url).success(function(response){replace(response)})},getForm:getForm,submitForm:submitForm}}());KB.tooltip=function(){function onMouseOver(event){if(!exists()){create(event.target)}}
 function onMouseLeaveContainer(){setTimeout(destroy,500)}
+function mouseLeftParent(){setTimeout(destroyIfNotOnTooltip,500)}
+function mouseOnTooltip(){document.getElementById("tooltip-container").mouseOnTooltip=!0}
+function destroyIfNotOnTooltip(){var div=document.getElementById("tooltip-container");if(div!=null&&!div.mouseOnTooltip)destroy()}
 function create(element){var contentElement=element.querySelector("script");if(contentElement){render(element,contentElement.innerHTML);return}
 var link=element.dataset.href;if(link){fetch(link,function(html){if(html){render(element,html)}})}}
 function fetch(url,callback){var request=new XMLHttpRequest();request.open("GET",url,!0);request.setRequestHeader("X-Requested-With","XMLHttpRequest");request.onreadystatechange=function(){if(request.readyState===XMLHttpRequest.DONE){if(request.status===200){callback(request.responseText)}}};request.send(null)}
-function render(element,html){var containerElement=document.createElement("div");containerElement.id="tooltip-container";containerElement.innerHTML=html;containerElement.addEventListener("mouseleave",onMouseLeaveContainer,!1);var elementRect=element.getBoundingClientRect();var top=elementRect.top+window.scrollY+elementRect.height;containerElement.style.top=top+"px";if(elementRect.left>(window.innerWidth-600)){var right=window.innerWidth-elementRect.right-window.scrollX;containerElement.style.right=right+"px"}else{var left=elementRect.left+window.scrollX;containerElement.style.left=left+"px"}
+function render(element,html){var containerElement=document.createElement("div");containerElement.id="tooltip-container";containerElement.innerHTML=html;containerElement.addEventListener("mouseleave",onMouseLeaveContainer,!1);containerElement.addEventListener("mouseenter",mouseOnTooltip,!1);containerElement.mouseOnTooltip=!1;var elementRect=element.getBoundingClientRect();var top=elementRect.top+window.scrollY+elementRect.height;containerElement.style.top=top+"px";if(elementRect.left>(window.innerWidth-600)){var right=window.innerWidth-elementRect.right-window.scrollX;containerElement.style.right=right+"px"}else{var left=elementRect.left+window.scrollX;containerElement.style.left=left+"px"}
 document.body.appendChild(containerElement);document.body.onclick=function(event){if(!containerElement.contains(event.target)){destroy()}}}
 function destroy(){var element=document.getElementById("tooltip-container");if(element){element.parentNode.removeChild(element)}}
 function exists(){return!!document.getElementById("tooltip-container")}
-var elements=document.querySelectorAll(".tooltip");for(var i=0;i<elements.length;i++){elements[i].addEventListener("mouseenter",onMouseOver,!1)}};KB.utils.formatDuration=function(d){if(d>=86400){return Math.round(d/86400)+"d"}else if(d>=3600){return Math.round(d/3600)+"h"}else if(d>=60){return Math.round(d/60)+"m"}
+var elements=document.querySelectorAll(".tooltip");for(var i=0;i<elements.length;i++){elements[i].addEventListener("mouseenter",onMouseOver,!1);elements[i].addEventListener("mouseleave",mouseLeftParent,!1)}};KB.utils.formatDuration=function(d){if(d>=86400){return Math.round(d/86400)+"d"}else if(d>=3600){return Math.round(d/3600)+"h"}else if(d>=60){return Math.round(d/60)+"m"}
 return d+"s"};KB.utils.getSelectionPosition=function(element){var selectionStart,selectionEnd;if(element.value.length<element.selectionStart){selectionStart=element.value.length}else{selectionStart=element.selectionStart}
 if(element.selectionStart===element.selectionEnd){selectionEnd=selectionStart}else{selectionEnd=element.selectionEnd}
 return{selectionStart:selectionStart,selectionEnd:selectionEnd}};KB.utils.arraysIdentical=function(a,b){var i=a.length;if(i!==b.length){return!1}
@@ -291,4 +294,4 @@ input.val(filter);$("form.search").submit()})};Kanboard.Swimlane=function(app){t
 localStorage.setItem(this.getStorageKey(),JSON.stringify(swimlaneIds));$('.board-swimlane-columns-'+swimlaneId).css('display','table-row');$('.board-swimlane-tasks-'+swimlaneId).css('display','table-row');$('.hide-icon-swimlane-'+swimlaneId).css('display','inline');$('.show-icon-swimlane-'+swimlaneId).css('display','none')};Kanboard.Swimlane.prototype.collapse=function(swimlaneId){var swimlaneIds=this.getAllCollapsed();if(swimlaneIds.indexOf(swimlaneId)<0){swimlaneIds.push(swimlaneId);localStorage.setItem(this.getStorageKey(),JSON.stringify(swimlaneIds))}
 $('.board-swimlane-columns-'+swimlaneId+':not(:first-child)').css('display','none');$('.board-swimlane-tasks-'+swimlaneId).css('display','none');$('.hide-icon-swimlane-'+swimlaneId).css('display','none');$('.show-icon-swimlane-'+swimlaneId).css('display','inline')};Kanboard.Swimlane.prototype.isCollapsed=function(swimlaneId){return this.getAllCollapsed().indexOf(swimlaneId)>-1};Kanboard.Swimlane.prototype.getAllCollapsed=function(){return JSON.parse(localStorage.getItem(this.getStorageKey()))||[]};Kanboard.Swimlane.prototype.dragAndDrop=function(){var self=this;$(".draggable-row-handle").mouseenter(function(){$(this).parent().parent().addClass("draggable-item-hover")}).mouseleave(function(){$(this).parent().parent().removeClass("draggable-item-hover")});$(".swimlanes-table tbody").sortable({forcePlaceholderSize:!0,handle:"td:first i",helper:function(e,ui){ui.children().each(function(){$(this).width($(this).width())});return ui},stop:function(event,ui){var swimlane=ui.item;swimlane.removeClass("draggable-item-selected");self.savePosition(swimlane.data("swimlane-id"),swimlane.index()+1)},start:function(event,ui){ui.item.addClass("draggable-item-selected")}}).disableSelection()};Kanboard.Swimlane.prototype.savePosition=function(swimlaneId,position){var url=$(".swimlanes-table").data("save-position-url");var self=this;this.app.showLoadingIcon();$.ajax({cache:!1,url:url,contentType:"application/json",type:"POST",processData:!1,data:JSON.stringify({"swimlane_id":swimlaneId,"position":position}),complete:function(){self.app.hideLoadingIcon()}})};Kanboard.Task=function(app){this.app=app};Kanboard.Task.prototype.onPopoverOpened=function(){var self=this;self.renderColorPicker();$(document).on("click",".assign-me",function(e){var currentId=$(this).data("current-id");var dropdownId="#modal-box #"+$(this).data("target-id");e.preventDefault();if($(dropdownId+' option[value='+currentId+']').length){$(dropdownId).val(currentId)}})};Kanboard.Task.prototype.renderColorPicker=function(){function renderColorOption(color){return $('<div class="color-picker-option">'+'<div class="color-picker-square color-'+color.id+'"></div>'+'<div class="color-picker-label">'+color.text+'</div>'+'</div>')}
 $(".color-picker").select2({minimumResultsForSearch:Infinity,templateResult:renderColorOption,templateSelection:renderColorOption})};Kanboard.BoardDragAndDrop=function(app){this.app=app;this.savingInProgress=!1};Kanboard.BoardDragAndDrop.prototype.execute=function(){if(this.app.hasId("board")){this.executeListeners();this.dragAndDrop()}};Kanboard.BoardDragAndDrop.prototype.dragAndDrop=function(){var self=this;var dropzone=$(".board-task-list");var params={forcePlaceholderSize:!0,tolerance:"pointer",connectWith:".sortable-column:visible",placeholder:"draggable-placeholder",items:".draggable-item",stop:function(event,ui){var task=ui.item;var taskId=task.attr('data-task-id');var taskPosition=task.attr('data-position');var taskColumnId=task.attr('data-column-id');var taskSwimlaneId=task.attr('data-swimlane-id');var newColumnId=task.parent().attr("data-column-id");var newSwimlaneId=task.parent().attr('data-swimlane-id');var newPosition=task.index()+1;task.removeClass("draggable-item-selected");if(newColumnId!=taskColumnId||newSwimlaneId!=taskSwimlaneId||newPosition!=taskPosition){self.changeTaskState(taskId);self.save(taskId,taskColumnId,newColumnId,newPosition,newSwimlaneId)}},start:function(event,ui){ui.item.addClass("draggable-item-selected");ui.placeholder.height(ui.item.height())}};if(isMobile.any){$(".task-board-sort-handle").css("display","inline");params.handle=".task-board-sort-handle"}
-dropzone.each(function(){$(this).css("min-height",$(this).parent().height())});dropzone.sortable(params)};Kanboard.BoardDragAndDrop.prototype.changeTaskState=function(taskId){var task=$("div[data-task-id="+taskId+"]");task.addClass('task-board-saving-state');task.find('.task-board-saving-icon').show()};Kanboard.BoardDragAndDrop.prototype.save=function(taskId,srcColumnId,dstColumnId,position,swimlaneId){var self=this;self.app.showLoadingIcon();self.savingInProgress=!0;$.ajax({cache:!1,url:$("#board").data("save-url"),contentType:"application/json",type:"POST",processData:!1,data:JSON.stringify({"task_id":taskId,"src_column_id":srcColumnId,"dst_column_id":dstColumnId,"swimlane_id":swimlaneId,"position":position}),success:function(data){self.refresh(data);self.savingInProgress=!1},error:function(){self.app.hideLoadingIcon();self.savingInProgress=!1},statusCode:{403:function(data){window.alert(data.responseJSON.message);document.location.reload(!0)}}})};Kanboard.BoardDragAndDrop.prototype.refresh=function(data){$("#board-container").replaceWith(data);this.app.hideLoadingIcon();this.executeListeners();this.dragAndDrop();KB.tooltip()};Kanboard.BoardDragAndDrop.prototype.executeListeners=function(){for(var className in this.app.controllers){var controller=this.app.get(className);if(typeof controller.onBoardRendered==="function"){controller.onBoardRendered()}}};var _KB=null;jQuery(document).ready(function(){_KB=new Kanboard.App();_KB.execute()})
\ No newline at end of file
+dropzone.each(function(){$(this).css("min-height",$(this).parent().height())});dropzone.sortable(params)};Kanboard.BoardDragAndDrop.prototype.changeTaskState=function(taskId){var task=$("div[data-task-id="+taskId+"]");task.addClass('task-board-saving-state');task.find('.task-board-saving-icon').show()};Kanboard.BoardDragAndDrop.prototype.save=function(taskId,srcColumnId,dstColumnId,position,swimlaneId){var self=this;self.app.showLoadingIcon();self.savingInProgress=!0;$.ajax({cache:!1,url:$("#board").data("save-url"),contentType:"application/json",type:"POST",processData:!1,data:JSON.stringify({"task_id":taskId,"src_column_id":srcColumnId,"dst_column_id":dstColumnId,"swimlane_id":swimlaneId,"position":position}),success:function(data){self.refresh(data);self.savingInProgress=!1},error:function(){self.app.hideLoadingIcon();self.savingInProgress=!1},statusCode:{403:function(data){window.alert(data.responseJSON.message);document.location.reload(!0)}}})};Kanboard.BoardDragAndDrop.prototype.refresh=function(data){$("#board-container").replaceWith(data);this.app.hideLoadingIcon();this.executeListeners();this.dragAndDrop();KB.tooltip()};Kanboard.BoardDragAndDrop.prototype.executeListeners=function(){for(var className in this.app.controllers){var controller=this.app.get(className);if(typeof controller.onBoardRendered==="function"){controller.onBoardRendered()}}};var _KB=null;jQuery(document).ready(function(){_KB=new Kanboard.App();_KB.execute()})
diff --git a/assets/js/core/tooltip.js b/assets/js/core/tooltip.js
index acb42bbd..ae5ac1c8 100644
--- a/assets/js/core/tooltip.js
+++ b/assets/js/core/tooltip.js
@@ -9,6 +9,19 @@ KB.tooltip = function () {
         setTimeout(destroy, 500);
     }
 
+    function mouseLeftParent() {
+        setTimeout(destroyIfNotOnTooltip, 500);
+    }
+
+    function mouseOnTooltip() {
+        document.getElementById("tooltip-container").mouseOnTooltip = true;
+    }
+
+    function destroyIfNotOnTooltip() {
+        var div = document.getElementById("tooltip-container");
+        if(div != null && !div.mouseOnTooltip) destroy();
+    }
+
     function create(element) {
         var contentElement = element.querySelector("script");
         if (contentElement) {
@@ -45,6 +58,8 @@ KB.tooltip = function () {
         containerElement.id = "tooltip-container";
         containerElement.innerHTML = html;
         containerElement.addEventListener("mouseleave", onMouseLeaveContainer, false);
+        containerElement.addEventListener("mouseenter", mouseOnTooltip, false);
+        containerElement.mouseOnTooltip = false;
 
         var elementRect = element.getBoundingClientRect();
         var top = elementRect.top + window.scrollY + elementRect.height;
@@ -81,5 +96,6 @@ KB.tooltip = function () {
     var elements = document.querySelectorAll(".tooltip");
     for (var i = 0; i < elements.length; i++) {
         elements[i].addEventListener("mouseenter", onMouseOver, false);
+        elements[i].addEventListener("mouseleave", mouseLeftParent, false);
     }
 };