3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-07-29 22:07:17 +02:00
Code Issues Projects Releases Packages Wiki Activity

🎉 Add new shape & rect data structures

Browse source 
Also optimizes some functions for faster shape and rect props
access (there is still a lot of work ahead optimizing the rest of
the functions)

Also normalizes shape creation and validation for ensuring
correct setup of all the mandatory properties.
This commit is contained in:
Andrey Antukh 2023-05-26 16:37:15 +02:00
parent 9f5640c1db
commit 405aa66357
130 changed files with 3038 additions and 2901 deletions
Download patch file Download diff file Expand all files Collapse all files

2
frontend/src/app/util/code_gen/style_css_values.cljs
View file

@ -48,7 +48,7 @@
[selrect _ _]
(-> (:points shape)
(gsh/transform-points (gsh/center-shape parent) (:transform-inverse parent))
(gsh/transform-points (gsh/shape->center parent) (:transform-inverse parent))
(gsh/calculate-geometry))
;;shape (gsh/transform-shape)

4
frontend/src/app/util/dom.cljs
View file

@ -9,6 +9,7 @@
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.geom.point :as gpt]
[app.common.geom.rect :as grc]
[app.common.logging :as log]
[app.common.media :as cm]
[app.util.globals :as globals]
@ -340,8 +341,7 @@
(defn get-client-size
[^js node]
(when (some? node)
{:width (.-clientWidth ^js node)
:height (.-clientHeight ^js node)}))
(grc/make-rect 0 0 (.-clientWidth ^js node) (.-clientHeight ^js node))))
(defn get-bounding-rect
[node]

134
frontend/src/app/util/geom/grid.cljs
View file

@ -1,134 +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) KALEIDOS INC
(ns app.util.geom.grid
(:require
[app.common.data :as d]
[app.common.geom.point :as gpt]
[app.common.math :as mth]))
(def ^:private default-items 12)
(defn calculate-default-item-length
"Calculates the item-length so the default number of items fits inside the frame-length"
[frame-length margin gutter]
(/ (- frame-length (+ margin (- margin gutter)) (* gutter default-items)) default-items))
(defn calculate-size
"Calculates the number of rows/columns given the other grid parameters"
[frame-length item-length margin gutter]
(let [item-length (or item-length (calculate-default-item-length frame-length margin gutter))
frame-length-no-margins (- frame-length (+ margin (- margin gutter)))]
(mth/floor (/ frame-length-no-margins (+ item-length gutter)))))
(defn- calculate-generic-grid
[v total-length {:keys [size gutter margin item-length type]}]
(let [size (if (number? size)
size
(calculate-size total-length item-length margin gutter))
parts (/ total-length size)
item-length (if (number? item-length)
item-length
(+ parts (- gutter) (/ gutter size) (- (/ (* margin 2) size))))
offset (case type
:right (- total-length (* item-length size) (* gutter (dec size)) margin)
:center (/ (- total-length (* item-length size) (* gutter (dec size))) 2)
margin)
gutter (if (= :stretch type)
(let [gutter (max 0 gutter (/ (- total-length (* item-length size) (* margin 2)) (dec size)))]
(if (d/num? gutter) gutter 0))
gutter)
next-v (fn [cur-val]
(+ offset v (* (+ item-length gutter) cur-val)))]
[size item-length next-v gutter]))
(defn- calculate-column-grid
[{:keys [width height x y] :as frame} params]
(let [[size width next-x] (calculate-generic-grid x width params)]
[size width height next-x (constantly y)]))
(defn- calculate-row-grid
[{:keys [width height x y] :as frame} params]
(let [[size height next-y] (calculate-generic-grid y height params)]
[size width height (constantly x) next-y]))
(defn- calculate-square-grid
[{:keys [width height x y] :as frame} {:keys [size] :as params}]
(let [col-size (quot width size)
row-size (quot height size)
as-row-col (fn [value] [(quot value col-size) (rem value col-size)])
next-x (fn [cur-val]
(let [[_ col] (as-row-col cur-val)] (+ x (* col size))))
next-y (fn [cur-val]
(let [[row _] (as-row-col cur-val)] (+ y (* row size))))]
[(* col-size row-size) size size next-x next-y]))
(defn grid-gutter
[{:keys [x y width height]} {:keys [type params] :as grid}]
(case type
:column
(let [[_ _ _ gutter] (calculate-generic-grid x width params)]
gutter)
:row
(let [[_ _ _ gutter] (calculate-generic-grid y height params)]
gutter)
nil))
(defn grid-areas
"Given a frame and the grid parameters returns the areas defined on the grid"
[frame grid]
(let [grid-fn (case (-> grid :type)
:column calculate-column-grid
:row calculate-row-grid
:square calculate-square-grid)
[num-items item-width item-height next-x next-y] (grid-fn frame (-> grid :params))]
(->> (range 0 num-items)
(map #(hash-map :x (next-x %)
:y (next-y %)
:width item-width
:height item-height)))))
(defn grid-area-points
[{:keys [x y width height]}]
[(gpt/point x y)
(gpt/point (+ x width) y)
(gpt/point (+ x width) (+ y height))
(gpt/point x (+ y height))])
(defn grid-snap-points
"Returns the snap points for a given grid"
[shape {:keys [type params] :as grid} coord]
(when (:display grid)
(case type
:square
(let [{:keys [x y width height]} shape
size (-> params :size)]
(when (> size 0)
(if (= coord :x)
(mapcat #(vector (gpt/point (+ x %) y)
(gpt/point (+ x %) (+ y height))) (range size width size))
(mapcat #(vector (gpt/point x (+ y %))
(gpt/point (+ x width) (+ y %))) (range size height size)))))
:column
(when (= coord :x)
(->> (grid-areas shape grid)
(mapcat grid-area-points)))
:row
(when (= coord :y)
(->> (grid-areas shape grid)
(mapcat grid-area-points))))))

49
frontend/src/app/util/geom/snap_points.cljs
View file

@ -1,49 +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) KALEIDOS INC
(ns app.util.geom.snap-points
(:require
[app.common.geom.point :as gpt]
[app.common.geom.shapes :as gsh]
[app.common.pages.helpers :as cph]
[app.common.types.shape-tree :as ctst]))
(defn selrect-snap-points [{:keys [x y width height] :as selrect}]
#{(gpt/point x y)
(gpt/point (+ x width) y)
(gpt/point (+ x width) (+ y height))
(gpt/point x (+ y height))
(gsh/center-selrect selrect)})
(defn frame-snap-points [{:keys [x y width height blocked hidden] :as selrect}]
(when (and (not blocked) (not hidden))
(into (selrect-snap-points selrect)
#{(gpt/point (+ x (/ width 2)) y)
(gpt/point (+ x width) (+ y (/ height 2)))
(gpt/point (+ x (/ width 2)) (+ y height))
(gpt/point x (+ y (/ height 2)))})))
(defn shape-snap-points
[{:keys [hidden blocked] :as shape}]
(when (and (not blocked) (not hidden))
(case (:type shape)
:frame (-> shape :points gsh/points->selrect frame-snap-points)
(into #{(gsh/center-shape shape)} (:points shape)))))
(defn guide-snap-points
[guide frame]
(cond
(and (some? frame)
(not (ctst/rotated-frame? frame))
(not (cph/root-frame? frame)))
#{}
(= :x (:axis guide))
#{(gpt/point (:position guide) 0)}
:else
#{(gpt/point 0 (:position guide))}))

25
frontend/src/app/util/snap_data.cljs
View file

@ -10,13 +10,13 @@
https://en.wikipedia.org/wiki/Range_tree"
(:require
[app.common.data :as d]
[app.common.geom.grid :as gg]
[app.common.geom.snap :as snap]
[app.common.pages.diff :as diff]
[app.common.pages.helpers :as cph]
[app.common.types.shape-tree :as ctst]
[app.common.types.shape.layout :as ctl]
[app.common.uuid :as uuid]
[app.util.geom.grid :as gg]
[app.util.geom.snap-points :as snap]
[app.util.range-tree :as rt]))
(def snap-attrs [:frame-id :x :y :width :height :hidden :selrect :grids])
@ -72,12 +72,15 @@
(defn- add-frame
[objects page-data frame]
(let [frame-id (:id frame)
parent-id (:parent-id frame)
frame-data (->> (snap/shape-snap-points frame)
(mapv #(array-map :type :shape
:id frame-id
:pt %)))
(let [frame-id (:id frame)
parent-id (:parent-id frame)
frame-data (if (:blocked frame)
[]
(->> (snap/shape->snap-points frame)
(mapv #(array-map :type :shape
:id frame-id
:pt %))))
grid-x-data (get-grids-snap-points frame :x)
grid-y-data (get-grids-snap-points frame :y)]
@ -101,7 +104,9 @@
(defn- add-shape
[objects page-data shape]
(let [frame-id (:frame-id shape)
snap-points (snap/shape-snap-points shape)
snap-points (if (:blocked shape)
[]
(snap/shape->snap-points shape))
shape-data (->> snap-points
(mapv #(array-map
:type :shape
@ -119,7 +124,7 @@
[objects page-data guide]
(let [frame (get objects (:frame-id guide))
guide-data (->> (snap/guide-snap-points guide frame)
guide-data (->> (snap/guide->snap-points guide frame)
(mapv #(array-map
:type :guide
:id (:id guide)