get latest version

src/app/components/point-component/drawers/point-drawer.js

@@ -79,11 +79,6 @@ export class PointDrawer extends SelectableDrawer {
       point.setLabel(label);
       const text = PointDrawer.getKonvaText(point, label);
       group.add(text);
-    } else {
-      if (point.label != undefined) {
-        const text = PointDrawer.getKonvaText(point, point.label);
-        group.add(text);
-      }
     }
     if (selectable == undefined || selectable)
       SelectableDrawer.setSelectable(circle);

src/app/core/application/menu.js

@@ -16,7 +16,7 @@ class Menu {
         component.created = true;
         const options = component.options;
         $("#tools").append(`<button id="btn-${options.id}"
-          class="tool icon icon-${options.icon}">
+          class="tool icon icon-${options.icon} fadeInRight">
           <span> ${options.title} </span></button>`);
         $("body").on(
           "click",

src/css/app.css

@@ -24,6 +24,10 @@
   position: relative;
   margin-bottom: 20px;
   opacity: 0.8;
+  -webkit-animation-duration: 1.5s;
+  animation-duration: 1.5s;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both;
 }
 
 #sidebar #tool-bar .tool:hover,
@@ -161,3 +165,29 @@
 .hidden {
   display: none !important;
 }
+
+@-webkit-keyframes fadeInRight {
+  0% {
+    opacity: 0;
+    -webkit-transform: translateX(20px);
+  }
+  100% {
+    opacity: 1;
+    -webkit-transform: translateX(0);
+  }
+}
+@keyframes fadeInRight {
+  0% {
+    opacity: 0;
+    transform: translateX(20px);
+  }
+  100% {
+    opacity: 1;
+    transform: translateX(0);
+  }
+}
+
+.fadeInRight {
+  -webkit-animation-name: fadeInRight;
+  animation-name: fadeInRight;
+}