From c2e63d56031b6405ca1f261b5e4196efa568ed52 Mon Sep 17 00:00:00 2001 From: Andrey Antukh Date: Fri, 22 Apr 2016 19:51:34 +0300 Subject: [PATCH] Add initial alignment on movement and resize. --- src/uxbox/data/shapes.cljs | 44 +++++++++++++++++++++++++++- src/uxbox/ui/workspace/align.cljs | 32 -------------------- src/uxbox/ui/workspace/movement.cljs | 7 ++--- src/uxbox/ui/workspace/resize.cljs | 7 +++-- src/uxbox/util/geom.cljs | 18 ++++++++++++ 5 files changed, 68 insertions(+), 40 deletions(-) delete mode 100644 src/uxbox/ui/workspace/align.cljs diff --git a/src/uxbox/data/shapes.cljs b/src/uxbox/data/shapes.cljs index 088ff2e5f4..b3ee88f7e8 100644 --- a/src/uxbox/data/shapes.cljs +++ b/src/uxbox/data/shapes.cljs @@ -7,15 +7,18 @@ (ns uxbox.data.shapes (:require [beicon.core :as rx] + [uxbox.constants :as c] [uxbox.rstore :as rs] [uxbox.router :as r] [uxbox.state :as st] [uxbox.state.shapes :as stsh] [uxbox.schema :as sc] + [uxbox.data.core :refer (worker)] [uxbox.data.pages :as udp] [uxbox.util.geom :as geom] [uxbox.util.geom.point :as gpt] - [uxbox.util.data :refer (index-of)])) + [uxbox.util.data :refer (index-of)] + [uxbox.util.workers :as uw])) (defn add-shape "Create and add shape to the current selected page." @@ -56,6 +59,25 @@ (let [shape (get-in state [:shapes-by-id sid])] (update-in state [:shapes-by-id sid] geom/move delta))))) +(declare align-point) + +(def coords + (gpt/point c/canvas-start-x + c/canvas-start-y)) + +(defn initial-align-shape + [id] + (reify + rs/WatchEvent + (-apply-watch [_ state s] + (let [shape (get-in state [:shapes-by-id id]) + shape (geom/outer-rect state shape) + point (gpt/point (:x shape) (:y shape)) + point (gpt/add point coords)] + (->> (align-point point) + (rx/map #(gpt/subtract % point)) + (rx/map #(move-shape id %))))))) + (defn update-line-attrs [sid {:keys [x1 y1 x2 y2] :as opts}] (reify @@ -110,6 +132,18 @@ (-apply-update [_ state] (update-in state [:shapes-by-id id] geom/move-vertex vid delta)))) +(defn initial-vertext-align + [id vid] + (reify + rs/WatchEvent + (-apply-watch [_ state s] + (let [shape (get-in state [:shapes-by-id id]) + point (geom/get-vertex-point shape vid) + point (gpt/add point coords)] + (->> (align-point point) + (rx/map #(gpt/subtract % point)) + (rx/map #(update-vertex-position id {:vid vid :delta %}))))))) + (defn update-position "Update the start position coordenate of the shape." [sid {:keys [x y] :as opts}] @@ -444,3 +478,11 @@ (-apply-update [_ state] (let [selected (get-in state [:workspace :selected])] (stsh/move-layer state selected loc))))) + +;; --- Point Alignment (with Grid) + +(defn align-point + [point] + (let [message {:cmd :grid/align :point point}] + (->> (uw/ask! worker message) + (rx/map :point)))) diff --git a/src/uxbox/ui/workspace/align.cljs b/src/uxbox/ui/workspace/align.cljs deleted file mode 100644 index 7c287c0116..0000000000 --- a/src/uxbox/ui/workspace/align.cljs +++ /dev/null @@ -1,32 +0,0 @@ -;; This Source Code Form is subject to the terms of the Mozilla Public -;; License, v. 2.0. If a copy of the MPL was not distributed with this -;; file, You can obtain one at http://mozilla.org/MPL/2.0/. -;; -;; Copyright (c) 2016 Andrey Antukh - -(ns uxbox.ui.workspace.align - "Shape alignmen impl." - (:require [beicon.core :as rx] - [lentes.core :as l] - [uxbox.state :as st] - [uxbox.data.core :refer (worker)] - [uxbox.ui.workspace.base :as wb] - [uxbox.util.geom.point :as gpt] - [uxbox.util.workers :as uw])) - -;; (defn- move -;; [shape p1] -;; (let [dx (- (:x2 shape) (:x1 shape)) -;; dy (- (:y2 shape) (:y1 shape)) -;; p2 (gpt/add p1 [dx dy])] -;; (assoc shape -;; :x1 (:x p1) -;; :y1 (:y p1) -;; :x2 (:x p2) -;; :y2 (:y p2)))) - -(defn translate - [point] - (let [message {:cmd :grid/align :point point}] - (->> (uw/ask! worker message) - (rx/map :point)))) diff --git a/src/uxbox/ui/workspace/movement.cljs b/src/uxbox/ui/workspace/movement.cljs index ac693adc6a..5df0ff54a5 100644 --- a/src/uxbox/ui/workspace/movement.cljs +++ b/src/uxbox/ui/workspace/movement.cljs @@ -14,12 +14,10 @@ [uxbox.state :as st] [uxbox.ui.core :as uuc] [uxbox.ui.workspace.base :as wb] - [uxbox.ui.workspace.align :as align] [uxbox.data.shapes :as uds] [uxbox.util.geom :as geom] [uxbox.util.geom.point :as gpt])) - ;; --- Lenses (defn- resolve-selected @@ -61,12 +59,13 @@ (rs/emit! (uds/move-shape id delta))) (defn- watch-movement - [stoper align? shape] + [stoper align? {:keys [id] :as shape}] + (when align? (rs/emit! (uds/initial-align-shape id))) (let [stream (->> wb/mouse-viewport-s (rx/sample 10) (rx/mapcat (fn [point] (if align? - (align/translate point) + (uds/align-point point) (rx/of point)))) (rx/buffer 2 1) (rx/map wb/coords-delta) diff --git a/src/uxbox/ui/workspace/resize.cljs b/src/uxbox/ui/workspace/resize.cljs index cda43a9fc2..ba8acbf7ce 100644 --- a/src/uxbox/ui/workspace/resize.cljs +++ b/src/uxbox/ui/workspace/resize.cljs @@ -11,7 +11,6 @@ [uxbox.data.shapes :as uds] [uxbox.ui.core :as uuc] [uxbox.ui.workspace.base :as wb] - [uxbox.ui.workspace.align :as align] [uxbox.util.geom.point :as gpt])) (declare initialize) @@ -30,7 +29,7 @@ (defn- initialize [event] - (let [payload (:payload event) + (let [{:keys [vid shape] :as payload} (:payload event) stoper (->> uuc/actions-s (rx/map :type) (rx/filter #(empty? %)) @@ -41,13 +40,15 @@ (rx/sample 10) (rx/mapcat (fn [point] (if align? - (align/translate point) + (uds/align-point point) (rx/of point)))) (rx/buffer 2 1) (rx/map wb/coords-delta) (rx/take-until stoper) (rx/map #(gpt/divide % @wb/zoom-l)) (rx/with-latest-from vector wb/mouse-ctrl-s))] + (when align? + (rs/emit! (uds/initial-vertext-align shape vid))) (rx/subscribe stream #(handle-resize payload %)))) (defn- handle-resize diff --git a/src/uxbox/util/geom.cljs b/src/uxbox/util/geom.cljs index 38a35b6a28..0f30c33287 100644 --- a/src/uxbox/util/geom.cljs +++ b/src/uxbox/util/geom.cljs @@ -138,6 +138,24 @@ {:width (- x2 x1) :height (- y2 y1)}) +;; --- Vertex Access + +(declare get-rect-vertext-point) + +(defn get-vertex-point + [shape id] + (case (:type shape) + :icon (get-rect-vertext-point shape id) + :rect (get-rect-vertext-point shape id))) + +(defn- get-rect-vertext-point + [{:keys [x1 y1 x2 y2]} id] + (case id + 1 (gpt/point x1 y1) + 2 (gpt/point x2 y1) + 3 (gpt/point x1 y2) + 4 (gpt/point x2 y2))) + ;; --- Vertex Movement (Relative) (declare move-rect-vertex)