3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-05-21 01:06:11 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎉 Adds feedback when dragging interactions

Browse source
This commit is contained in:
alonso.torres 2020-06-04 11:33:56 +02:00
parent 3b0ea9b7fd
commit 353e86c49d
3 changed files with 23 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

18
frontend/src/uxbox/main/data/workspace.cljs
View file

@ -1296,21 +1296,29 @@
(ptk/reify ::move-create-interaction (ptk/reify ::move-create-interaction
ptk/UpdateEvent ptk/UpdateEvent
(update [_ state] (update [_ state]
(if (= position initial-pos) (let [page-id (:current-page-id state)
state objects (get-in state [:workspace-data page-id :objects])
(assoc-in state [:workspace-local :draw-interaction-to] position))))) selected-shape-id (-> state (get-in [:workspace-local :selected]) first)
selected-shape (get objects selected-shape-id)
selected-shape-frame-id (:frame-id selected-shape)
start-frame (get objects selected-shape-frame-id)
end-frame (dwc/get-frame-at-point objects position)]
(cond-> state
(not= position initial-pos) (assoc-in [:workspace-local :draw-interaction-to] position)
(not= start-frame end-frame) (assoc-in [:workspace-local :draw-interaction-to-frame] end-frame))))))
(defn finish-create-interaction (defn finish-create-interaction
[initial-pos] [initial-pos]
(ptk/reify ::finish-create-interaction (ptk/reify ::finish-create-interaction
ptk/UpdateEvent ptk/UpdateEvent
(update [_ state] (update [_ state]
(assoc-in state [:workspace-local :draw-interaction-to] nil)) (-> state
(assoc-in [:workspace-local :draw-interaction-to] nil)
(assoc-in [:workspace-local :draw-interaction-to-frame] nil)))
ptk/WatchEvent ptk/WatchEvent
(watch [_ state stream] (watch [_ state stream]
(let [position @ms/mouse-position (let [position @ms/mouse-position
page-id (:current-page-id state) page-id (:current-page-id state)
objects (get-in state [:workspace-data page-id :objects]) objects (get-in state [:workspace-data page-id :objects])
frame (dwc/get-frame-at-point objects position) frame (dwc/get-frame-at-point objects position)

10
frontend/src/uxbox/main/ui/workspace/shapes/interactions.cljs
View file

@ -19,7 +19,8 @@
[uxbox.main.store :as st] [uxbox.main.store :as st]
[uxbox.main.refs :as refs] [uxbox.main.refs :as refs]
[uxbox.main.data.workspace :as dw] [uxbox.main.data.workspace :as dw]
[uxbox.main.ui.keyboard :as kbd])) [uxbox.main.ui.keyboard :as kbd]
[uxbox.main.ui.workspace.shapes.outline :refer [outline]]))
(defn- get-click-interaction (defn- get-click-interaction
[shape] [shape]
@ -154,7 +155,10 @@
[:& interaction-marker {:x dest-x [:& interaction-marker {:x dest-x
:y dest-y :y dest-y
:arrow-dir arrow-dir :arrow-dir arrow-dir
:zoom zoom}]]))) :zoom zoom}]
(when dest-shape
[:& outline {:shape dest-shape}])])))
(mf/defc interaction-handle (mf/defc interaction-handle
@ -179,6 +183,7 @@
active-shapes (filter #(first (get-click-interaction %)) (vals objects)) active-shapes (filter #(first (get-click-interaction %)) (vals objects))
selected-shapes (map #(get objects %) selected) selected-shapes (map #(get objects %) selected)
draw-interaction-to (:draw-interaction-to local) draw-interaction-to (:draw-interaction-to local)
draw-interaction-to-frame (:draw-interaction-to-frame local)
first-selected (first selected-shapes)] first-selected (first selected-shapes)]
[:* [:*
(for [shape active-shapes] (for [shape active-shapes]
@ -197,6 +202,7 @@
[:& interaction-path {:key "interactive" [:& interaction-path {:key "interactive"
:orig-shape first-selected :orig-shape first-selected
:dest-point draw-interaction-to :dest-point draw-interaction-to
:dest-shape draw-interaction-to-frame
:selected? true :selected? true
:zoom zoom}] :zoom zoom}]

4
frontend/src/uxbox/main/ui/workspace/shapes/outline.cljs
View file

@ -30,8 +30,8 @@
common {:fill "transparent" common {:fill "transparent"
:stroke "#31EFB8" :stroke "#31EFB8"
:stroke-width "1px" :strokeWidth "1px"
:pointer-events "none" :pointerEvents "none"
:transform transform} :transform transform}
props (case (:type shape) props (case (:type shape)