From 7264cd5437c36dfd2141665b401317fc08ab1c50 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jes=C3=BAs=20Espino?= <jespinog@gmail.com>
Date: Thu, 22 Dec 2016 10:11:29 +0100
Subject: [PATCH] Adding initial tooltip support

---
 .../styles/main/partials/workspace-canvas.scss     | 10 ++++++++++
 frontend/src/uxbox/main/data/workspace.cljs        | 11 +++++++++++
 frontend/src/uxbox/main/ui/workspace/base.cljs     |  3 +++
 frontend/src/uxbox/main/ui/workspace/canvas.cljs   | 14 ++++++++++++++
 frontend/src/uxbox/main/ui/workspace/drawarea.cljs |  9 ++++++++-
 5 files changed, 46 insertions(+), 1 deletion(-)

diff --git a/frontend/resources/styles/main/partials/workspace-canvas.scss b/frontend/resources/styles/main/partials/workspace-canvas.scss
index fbc5c8ba72..1b365d5af9 100644
--- a/frontend/resources/styles/main/partials/workspace-canvas.scss
+++ b/frontend/resources/styles/main/partials/workspace-canvas.scss
@@ -46,6 +46,16 @@
     }
   }
 
+  .cursor-tooltip {
+    background-color: $color-dark-bg;
+    border-radius: $br-small;
+    color: $color-white;
+    font-size: $fs14;
+    padding: 3px 8px;
+    transition: none;
+    text-align: center;
+  }
+
   .workspace-canvas {
     height: calc(100vh - 50px);
     overflow: scroll;
diff --git a/frontend/src/uxbox/main/data/workspace.cljs b/frontend/src/uxbox/main/data/workspace.cljs
index 6765e2e78a..a92bae5db9 100644
--- a/frontend/src/uxbox/main/data/workspace.cljs
+++ b/frontend/src/uxbox/main/data/workspace.cljs
@@ -204,6 +204,17 @@
   []
   (ResetZoom.))
 
+;; --- Set tooltip
+
+(defrecord SetTooltip [text]
+  ptk/UpdateEvent
+  (update [_ state]
+    (assoc-in state [:workspace :tooltip] text)))
+
+(defn set-tooltip
+  [text]
+  (SetTooltip. text))
+
 ;; --- Initialize Alignment Index
 
 (declare initialize-alignment?)
diff --git a/frontend/src/uxbox/main/ui/workspace/base.cljs b/frontend/src/uxbox/main/ui/workspace/base.cljs
index 8a9707d716..562e7aaafb 100644
--- a/frontend/src/uxbox/main/ui/workspace/base.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/base.cljs
@@ -119,6 +119,9 @@
        (rx/map :window-coords)
        (rx/share)))
 
+(defonce mouse-absolute-a
+  (rx/to-atom mouse-absolute-s))
+
 (defonce mouse-ctrl-s
   (->> mouse-s
        (rx/map :ctrl)
diff --git a/frontend/src/uxbox/main/ui/workspace/canvas.cljs b/frontend/src/uxbox/main/ui/workspace/canvas.cljs
index 3a1eccce75..f5c9fbdb21 100644
--- a/frontend/src/uxbox/main/ui/workspace/canvas.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/canvas.cljs
@@ -55,6 +55,17 @@
     [:span {:alt "y"}
      (str "Y: " (:y coords "-"))]]))
 
+(mx/defc cursor-tooltip
+  {:mixins [mx/reactive mx/static]}
+  [tooltip]
+  (let [coords (mx/react wb/mouse-absolute-a)]
+   [:span.cursor-tooltip
+    {:style
+     {:position "fixed"
+      :left (str (+ (:x coords) 5) "px")
+      :top (str (- (:y coords) 25) "px")}}
+    tooltip]))
+
 ;; --- Canvas
 
 (mx/defc canvas
@@ -153,6 +164,7 @@
         page (mx/react wb/page-ref)
         flags (:flags workspace)
         drawing? (:drawing workspace)
+        tooltip (:tooltip workspace)
         zoom (or (:zoom workspace) 1)]
     (letfn [(on-mouse-down [event]
               (dom/stop-propagation event)
@@ -188,6 +200,8 @@
                 (rx/push! wb/events-b [:mouse/double-click opts])))]
       [:div
         (coordinates)
+        (when tooltip
+          (cursor-tooltip tooltip))
         [:svg.viewport {:width (* c/viewport-width zoom)
                         :height (* c/viewport-height zoom)
                         :ref "viewport"
diff --git a/frontend/src/uxbox/main/ui/workspace/drawarea.cljs b/frontend/src/uxbox/main/ui/workspace/drawarea.cljs
index 7dbe373488..a33a095c64 100644
--- a/frontend/src/uxbox/main/ui/workspace/drawarea.cljs
+++ b/frontend/src/uxbox/main/ui/workspace/drawarea.cljs
@@ -81,7 +81,12 @@
   (letfn [(on-click [event]
             (dom/stop-propagation event)
             (swap! drawing-shape drop-last-point)
+            (st/emit! (udw/set-tooltip nil))
             (rx/push! drawing-stoper true))
+          (on-mouse-enter [event]
+            (st/emit! (udw/set-tooltip "Click to close the path")))
+          (on-mouse-leave [event]
+            (st/emit! (udw/set-tooltip nil)))
           (drop-last-point [shape]
             (let [points (:points shape)
                   points (vec (butlast points))]
@@ -94,7 +99,9 @@
          [:circle.close-bezier {:cx x
                    :cy y
                    :r 5
-                   :on-click on-click}])])))
+                   :on-click on-click
+                   :on-mouse-enter on-mouse-enter
+                   :on-mouse-leave on-mouse-leave}])])))
 
 ;; --- Drawing Initialization