commit cb89097a6a73327e32fd610178ab4e81a32a630f
author Radek Krejci <rkrejci@cesnet.cz> Fri Jan 26 10:12:45 2018 +0100
committer Radek Krejci <rkrejci@cesnet.cz> Fri Jan 26 10:12:45 2018 +0100
tree c2d1365a7544e73a7fcf828ebc97f9a45132040a
parent fb0c046d67da1f2e3d49206c752add62304940ca

frontend CHANGE delay showing edit menu on config nodes

frontend/config/tree-indent.html

diff --git a/frontend/config/tree-indent.html b/frontend/config/tree-indent.html
index b68039d..2adca0a 100644
--- a/frontend/config/tree-indent.html
+++ b/frontend/config/tree-indent.html
@@ -12,7 +12,7 @@
 <ng-template #menu >
     <span *ngIf="node['info']['config']; else empty"
         (mouseenter)="showEditMenu($event)" 
-        (mouseleave)="hideEditMenu($event.currentTarget.lastElementChild)">
+        (mouseleave)="hideEditMenu($event)">
         <img  class="icon_action" src="assets/netopeer/icons/menu.svg" 
             onmouseover="this.src='assets/netopeer/icons/menu_active.svg'"
             onmouseout="this.src='assets/netopeer/icons/menu.svg'"/>

frontend/config/tree.component.html

diff --git a/frontend/config/tree.component.html b/frontend/config/tree.component.html
index e44351a..ee085f1 100644
--- a/frontend/config/tree.component.html
+++ b/frontend/config/tree.component.html
@@ -2,7 +2,6 @@
 
 	<div class="node" [class.dirty]="node['dirty']" [class.deleted]="node['deleted']">
 		<tree-indent [node]="node" [indentation]="indentation"
-			(onShowEditMenu)="showEditMenu($event)" (onHideEditMenu)="hideEditMenu($event)"
 			(onDeleteSubtree)="deleteSubtree($event)" (onOpenCreatingDialog)="openCreatingDialog($event.element, $event.node, $event.parent)">
 		</tree-indent>
 		<img class="icon" src="assets/netopeer/icons/info.svg" alt="info" title="{{node['info']['dsc']}}"

frontend/config/tree.component.ts

diff --git a/frontend/config/tree.component.ts b/frontend/config/tree.component.ts
index 24c9e16..0741815 100644
--- a/frontend/config/tree.component.ts
+++ b/frontend/config/tree.component.ts
@@ -45,11 +45,11 @@
     @Input() indentation;
     @Input() type = "current";
     @Output() onShowEditMenu = new EventEmitter();
-    @Output() onHideEditMenu = new EventEmitter();
     @Output() onDeleteSubtree = new EventEmitter();
     @Output() onOpenCreatingDialog = new EventEmitter();
     @Output() onCloseCreatingDialog = new EventEmitter();
     activeSession: Session;
+    timeout;
 
     constructor(private sessionsService: SessionsService, private router: Router) {}
 
@@ -58,11 +58,19 @@
     }
 
     showEditMenu(event) {
-        this.onShowEditMenu.emit(event);
+        this.timeout = setTimeout(() => {
+            let menu = event.target.lastElementChild;
+            menu.style.visibility = "visible";
+            menu.style.top = event.clientY + 'px';
+            menu.style.left = event.clientX + 'px';
+        }, 300);
     }
-    hideEditMenu(element) {
-        this.onHideEditMenu.emit(element);
+
+    hideEditMenu(event) {
+        clearTimeout(this.timeout);
+        event.target.lastElementChild.style.visibility = "hidden";
     }
+
     deleteSubtree(node) {
         this.onDeleteSubtree.emit(node);
     }
@@ -109,17 +117,6 @@
         }
     }
 
-    showEditMenu(event) {
-        let menu = event.target.lastElementChild;
-        menu.style.visibility = "visible";
-        menu.style.top = event.clientY + 'px';
-        menu.style.left = event.clientX + 'px';
-    }
-
-    hideEditMenu(editmenu) {
-        editmenu.style.visibility = "hidden";
-    }
-
     startEditing(node, target) {
         if (node['info']['key'] && !node['new']) {
             return;