Merge remote-tracking branch 'origin/staging' into develop

common/src/app/common/geom/shapes/effects.cljc

@@ -1,3 +1,9 @@
+;; 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.common.geom.shapes.effects)
 
 (defn update-shadow-scale

common/src/app/common/geom/shapes/path.cljc

@@ -845,13 +845,11 @@
 (defn close-content
   [content]
   (into []
-        (comp  (filter sp/is-closed?)
+        (mapcat :data)
-               (mapcat :data))
         (->> content
              (sp/close-subpaths)
              (sp/get-subpaths))))
 
-
 (defn ray-overlaps?
   [ray-point {selrect :selrect}]
   (and (>= (:y ray-point) (:y1 selrect))

common/src/app/common/geom/shapes/strokes.cljc

@@ -1,3 +1,9 @@
+;; 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.common.geom.shapes.strokes)
 
 (defn update-stroke-width

common/src/app/common/types/modifiers.cljc

@@ -737,30 +737,32 @@
 
           (apply-scale-content
             [shape value]
-            (cond-> shape
+            ;; Scale can only be positive
-              (cfh/text-shape? shape)
+            (let [value (mth/abs value)]
-              (update-text-content scale-text-content value)
+              (cond-> shape
+                (cfh/text-shape? shape)
+                (update-text-content scale-text-content value)
 
-              :always
+                :always
-              (gsc/update-corners-scale value)
+                (gsc/update-corners-scale value)
 
-              (d/not-empty? (:strokes shape))
+                (d/not-empty? (:strokes shape))
-              (gss/update-strokes-width value)
+                (gss/update-strokes-width value)
 
-              (d/not-empty? (:shadow shape))
+                (d/not-empty? (:shadow shape))
-              (gse/update-shadows-scale value)
+                (gse/update-shadows-scale value)
 
-              (some? (:blur shape))
+                (some? (:blur shape))
-              (gse/update-blur-scale value)
+                (gse/update-blur-scale value)
 
-              (ctl/flex-layout? shape)
+                (ctl/flex-layout? shape)
-              (ctl/update-flex-scale value)
+                (ctl/update-flex-scale value)
 
-              (ctl/grid-layout? shape)
+                (ctl/grid-layout? shape)
-              (ctl/update-grid-scale value)
+                (ctl/update-grid-scale value)
 
-              :always
+                :always
-              (ctl/update-flex-child value)))]
+                (ctl/update-flex-child value))))]
 
     (let [remove-children
           (fn [shapes children-to-remove]

frontend/scripts/_helpers.js

@@ -32,7 +32,6 @@ async function findFiles(basePath, predicate, options={}) {
   predicate = predicate ?? function() { return true; }
 
   let files = await fs.readdir(basePath, {recursive: options.recursive ?? false})
-  files = files.filter((path) => path.endsWith(".svg"));
   files = files.map((path) => ph.join(basePath, path));
 
   return files;
@@ -54,7 +53,11 @@ export function isSassFile(path) {
 }
 
 export function isSvgFile(path) {
-  return path.endsWith(".scss");
+  return path.endsWith(".svg");
+}
+
+export function isJsFile(path) {
+  return path.endsWith(".js");
 }
 
 export async function compileSass(worker, path, options) {
@@ -378,7 +381,7 @@ export async function compilePolyfills() {
   log.info("init: compile polyfills")
 
 
-  const files = await findFiles("resources/polyfills/");
+  const files = await findFiles("resources/polyfills/", isJsFile);
   let result = [];
   for (let path of files) {
     const content = await fs.readFile(path, {encoding:"utf-8"});

frontend/scripts/build

@@ -20,6 +20,7 @@ rm -rf target/dist;
 clojure -M:dev:shadow-cljs release main --config-merge "{:release-version \"${CURRENT_HASH}\"}" $EXTRA_PARAMS || exit 1
 
 yarn run compile || exit 1;
+mkdir -p target/dist;
 rsync -avr resources/public/ target/dist/
 
 sed -i -re "s/\%version\%/$CURRENT_VERSION/g" ./target/dist/index.html;

frontend/src/app/main/data/workspace.cljs

@@ -1573,7 +1573,9 @@
                            (->> (:strokes obj)
                                 (keep :stroke-image))
                            (when (cfh/image-shape? obj)
-                             [(:metadata obj)]))]
+                             [(:metadata obj)])
+                           (when (:fill-image obj)
+                             [(:fill-image obj)]))]
 
               (if (seq imgdata)
                 (->> (rx/from imgdata)
@@ -1833,13 +1835,19 @@
 (defn paste-shapes
   [{in-viewport? :in-viewport :as pdata}]
   (letfn [(translate-media [mdata media-idx attr-path]
-            (let [id   (get-in mdata attr-path)
+            (let [id   (-> (get-in mdata attr-path)
+                           (:id))
                   mobj (get media-idx id)]
               (if mobj
-                (update-in mdata attr-path (fn [value]
+                (if (empty? attr-path)
-                                             (-> value
+                  (-> mdata
-                                                 (assoc :id (:id mobj))
+                      (assoc :id (:id mobj))
-                                                 (assoc :path (:path mobj)))))
+                      (assoc :path (:path mobj)))
+                  (update-in mdata attr-path (fn [value]
+                                               (-> value
+                                                   (assoc :id (:id mobj))
+                                                   (assoc :path (:path mobj))))))
+
                 mdata)))
 
           (add-obj? [chg]
@@ -1849,15 +1857,15 @@
           ;; references to the new uploaded media-objects.
           (process-rchange [media-idx change]
             (let [;; Texts can have different fills for pieces of the text
-                  tr-fill-xf    (map #(translate-media % media-idx [:fill-image :id]))
+                  tr-fill-xf    (map #(translate-media % media-idx [:fill-image]))
-                  tr-stroke-xf  (map #(translate-media % media-idx [:stroke-image :id]))]
+                  tr-stroke-xf  (map #(translate-media % media-idx [:stroke-image]))]
-
               (if (add-obj? change)
                 (update change :obj (fn [obj]
                                       (-> obj
                                           (update :fills #(into [] tr-fill-xf %))
                                           (update :strokes #(into [] tr-stroke-xf %))
-                                          (d/update-when :metadata translate-media media-idx [:id])
+                                          (d/update-when :metadata translate-media media-idx [])
+                                          (d/update-when :fill-image translate-media media-idx [])
                                           (d/update-when :content
                                                          (fn [content]
                                                            (txt/xform-nodes tr-fill-xf content)))
@@ -1983,7 +1991,7 @@
         (let [file-id      (:current-file-id state)
               page         (wsh/lookup-page state)
 
-              media-idx    (->> (:media pdata)
+              media-idx    (->> (:images pdata)
                                 (d/index-by :prev-id))
 
               selected     (:selected pdata)

frontend/src/app/main/data/workspace/transforms.cljs

@@ -971,7 +971,7 @@
             selrect   (gsh/shapes->rect shapes)
             center    (grc/rect->center selrect)
             modifiers (dwm/create-modif-tree selected (ctm/resize-modifiers (gpt/point -1.0 1.0) center))]
-        (rx/of (dwm/apply-modifiers {:modifiers modifiers}))))))
+        (rx/of (dwm/apply-modifiers {:modifiers modifiers :ignore-snap-pixel true}))))))
 
 (defn flip-vertical-selected []
   (ptk/reify ::flip-vertical-selected
@@ -983,4 +983,4 @@
             selrect   (gsh/shapes->rect shapes)
             center    (grc/rect->center selrect)
             modifiers (dwm/create-modif-tree selected (ctm/resize-modifiers (gpt/point 1.0 -1.0) center))]
-        (rx/of (dwm/apply-modifiers {:modifiers modifiers}))))))
+        (rx/of (dwm/apply-modifiers {:modifiers modifiers :ignore-snap-pixel true}))))))

frontend/src/app/main/ui/workspace/shapes/debug.cljs

@@ -10,8 +10,12 @@
    [app.common.data.macros :as dm]
    [app.common.files.helpers :as cfh]
    [app.common.geom.shapes :as gsh]
+   [app.common.geom.shapes.path :as gsp]
    [app.common.geom.shapes.text :as gst]
    [app.common.math :as mth]
+   [app.common.svg.path.bool :as pb]
+   [app.common.svg.path.shapes-to-path :as stp]
+   [app.common.svg.path.subpath :as ups]
    [app.main.refs :as refs]
    [app.util.color :as uc]
    [app.util.debug :as dbg]
@@ -87,13 +91,98 @@
                   :style {:stroke "green"
                           :stroke-width (/ 2 zoom)}}]]))]))
 
+(mf/defc debug-bool-shape
+  {::mf/wrap-props false}
+  [{:keys [shape]}]
+
+  (let [objects (mf/deref refs/workspace-page-objects)
+        zoom (mf/deref refs/selected-zoom)
+
+        radius (/ 3 zoom)
+
+        c1 (-> (get objects (first (:shapes shape)))
+               (stp/convert-to-path objects))
+        c2 (-> (get objects (second (:shapes shape)))
+               (stp/convert-to-path objects))
+
+        content-a (:content c1)
+        content-b (:content c2)
+
+        bool-type (:bool-type shape)
+        should-reverse? (and (not= :union bool-type)
+                             (= (ups/clockwise? content-b)
+                                (ups/clockwise? content-a)))
+
+        content-a (-> (:content c1)
+                      (pb/close-paths)
+                      (pb/add-previous))
+
+        content-b (-> (:content c2)
+                      (pb/close-paths)
+                      (cond-> should-reverse? (ups/reverse-content))
+                      (pb/add-previous))
+
+
+        sr-a (gsp/content->selrect content-a)
+        sr-b (gsp/content->selrect content-b)
+
+        [content-a-split content-b-split] (pb/content-intersect-split content-a content-b sr-a sr-b)
+
+        ;;content-a-geom (gsp/content->geom-data content-a)
+        ;;content-b-geom (gsp/content->geom-data content-b)
+        ;;content-a-split (->> content-a-split #_(filter #(pb/contains-segment? % content-b sr-b content-b-geom)))
+        ;;content-b-split (->> content-b-split #_(filter #(pb/contains-segment? % content-a sr-a content-a-geom)))
+        ]
+    [:*
+     (for [[i cmd] (d/enumerate content-a-split)]
+       (let [p1 (:prev cmd)
+             p2 (gsp/command->point cmd)
+
+             hp (case (:command cmd)
+                  :line-to  (-> (gsp/command->line cmd)
+                                (gsp/line-values 0.5))
+
+                  :curve-to (-> (gsp/command->bezier cmd)
+                                (gsp/curve-values 0.5))
+                  nil)]
+         [:*
+          (when p1
+            [:circle {:data-i i :key (dm/str "c11-" i) :cx (:x p1) :cy (:y p1) :r radius :fill "red"}])
+          [:circle {:data-i i :key (dm/str "c12-" i) :cx (:x p2) :cy (:y p2) :r radius :fill "red"}]
+
+          (when hp
+            [:circle {:data-i i :key (dm/str "c13-" i) :cx (:x hp) :cy (:y hp) :r radius :fill "orange"}])]))
+
+     (for [[i cmd] (d/enumerate content-b-split)]
+       (let [p1 (:prev cmd)
+             p2 (gsp/command->point cmd)
+
+             hp (case (:command cmd)
+                  :line-to  (-> (gsp/command->line cmd)
+                                (gsp/line-values 0.5))
+
+                  :curve-to (-> (gsp/command->bezier cmd)
+                                (gsp/curve-values 0.5))
+                  nil)]
+         [:*
+          (when p1
+            [:circle {:key (dm/str "c21-" i) :cx (:x p1) :cy (:y p1) :r radius :fill "blue"}])
+          [:circle {:key (dm/str "c22-" i) :cx (:x p2) :cy (:y p2) :r radius :fill "blue"}]
+
+          (when hp
+            [:circle {:data-i i :key (dm/str "c13-" i) :cx (:x hp) :cy (:y hp) :r radius :fill "green"}])]))]))
+
 (mf/defc shape-debug
   [{:keys [shape]}]
   [:*
    (when ^boolean (dbg/enabled? :bounding-boxes)
      [:& debug-bounding-boxes {:shape shape}])
 
-   (when (and ^boolean (cfh/text-shape? shape)
+   (when (and ^boolean (dbg/enabled? :bool-shapes)
-              ^boolean (dbg/enabled? :text-outline)
+              ^boolean (cfh/bool-shape? shape))
+     [:& debug-bool-shape {:shape shape}])
+
+   (when (and ^boolean (dbg/enabled? :text-outline)
+              ^boolean (cfh/text-shape? shape)
               ^boolean (seq (:position-data shape)))
      [:& debug-text-bounds {:shape shape}])])

frontend/src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs

@@ -268,6 +268,7 @@
                  :on-click on-remove} i/remove-icon])
      (when select-only
        [:button {:class (stl/css :select-btn)
+                 :title (tr "settings.select-this-color")
                  :on-click handle-select}
         i/move])]))
 

frontend/src/app/main/ui/workspace/viewport.cljs

@@ -553,7 +553,7 @@
            :offset-y offset-y
            :show-rulers? show-rulers?}])
 
-       (when show-rulers?
+       (when (and show-rulers? show-grids?)
          [:& guides/viewport-guides
           {:zoom zoom
            :vbox vbox

frontend/src/app/main/ui/workspace/viewport/path_actions.cljs

@@ -27,7 +27,7 @@
   (i/icon-xref :add (stl/css :add-icon :pathbar-icon)))
 
 (def ^:private remove-icon
-  (i/icon-xref :remove-icon (stl/css :remove-icon :pathbar-icon)))
+  (i/icon-xref :remove (stl/css :remove :pathbar-icon)))
 
 (def ^:private merge-nodes-icon
   (i/icon-xref :merge-nodes (stl/css :merge-nodes-icon :pathbar-icon)))

frontend/src/app/main/ui/workspace/viewport/rulers.cljs

@@ -101,13 +101,13 @@
         rulers-size (* rulers-size zoom-inverse)]
     (if (= axis :x)
       {:text-x val
-       :text-y (+ (:y vbox) (- rulers-pos (* 4 zoom-inverse)))
+       :text-y (+ (:y vbox) rulers-pos (* -1 zoom-inverse))
        :line-x1 val
        :line-y1 (+ (:y vbox) rulers-pos (* 2 zoom-inverse))
        :line-x2 val
        :line-y2 (+ (:y vbox) rulers-pos (* 2 zoom-inverse) rulers-size)}
 
-      {:text-x (+ (:x vbox) (- rulers-pos (* 4 zoom-inverse)))
+      {:text-x (+ (:x vbox) rulers-pos (* -1 zoom-inverse))
        :text-y val
        :line-x1 (+ (:x vbox) rulers-pos (* 2 zoom-inverse))
        :line-y1 val
@@ -171,7 +171,6 @@
           [:text {:x text-x
                   :y text-y
                   :text-anchor "middle"
-                  :dominant-baseline "middle"
                   :transform (when (= axis :y) (str "rotate(-90 " text-x "," text-y ")"))
                   :style {:font-size (* font-size zoom-inverse)
                           :font-family font-family
@@ -250,18 +249,16 @@
                     :fill-opacity selection-area-opacity}}]
 
     [:text {:x (- (:x1 selection-rect) (* 4 zoom-inverse))
-            :y (+ (:y vbox) (* 10.6 zoom-inverse))
+            :y (+ (:y vbox) (* 13.6 zoom-inverse))
             :text-anchor "end"
-            :dominant-baseline "middle"
             :style {:font-size (* font-size zoom-inverse)
                     :font-family font-family
                     :fill selection-area-color}}
      (fmt/format-number (- (:x1 selection-rect) offset-x))]
 
     [:text {:x (+ (:x2 selection-rect) (* 4 zoom-inverse))
-            :y (+ (:y vbox) (* 10.6 zoom-inverse))
+            :y (+ (:y vbox) (* 13.6 zoom-inverse))
             :text-anchor "start"
-            :dominant-baseline "middle"
             :style {:font-size (* font-size zoom-inverse)
                     :font-family font-family
                     :fill selection-area-color}}
@@ -293,18 +290,16 @@
                       :fill-opacity over-number-opacity}}]
 
       [:text {:x (- center-x (/ (:height selection-rect) 2) (* 15 zoom-inverse))
-              :y center-y
+              :y (+ center-y (* 4 zoom-inverse))
               :text-anchor "end"
-              :dominant-baseline "middle"
               :style {:font-size (* font-size zoom-inverse)
                       :font-family font-family
                       :fill selection-area-color}}
        (fmt/format-number (- (:y2 selection-rect) offset-y))]
 
       [:text {:x (+ center-x (/ (:height selection-rect) 2))
-              :y center-y
+              :y (+ center-y (* 4 zoom-inverse))
               :text-anchor "start"
-              :dominant-baseline "middle"
               :style {:font-size (* font-size zoom-inverse)
                       :font-family font-family
                       :fill selection-area-color}}

frontend/src/app/util/debug.cljs

@@ -86,7 +86,10 @@
     :shape-panel
 
     ;; Show what is touched in copies
-    :display-touched})
+    :display-touched
+
+    ;; Show some visual indicators for bool shape
+    :bool-shapes})
 
 (defn enable!
   [option]

frontend/translations/en.po

@@ -2527,6 +2527,10 @@ msgstr "Detach"
 msgid "settings.multiple"
 msgstr "Mixed"
 
+#: src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs
+msgid "settings.select-this-color"
+msgstr "Select items using this style"
+
 # SECTIONS
 msgid "shortcut-section.basics"
 msgstr "Basics"

frontend/translations/es.po

@@ -2573,6 +2573,10 @@ msgstr "Desacoplar"
 msgid "settings.multiple"
 msgstr "Varios"
 
+#: src/app/main/ui/workspace/sidebar/options/rows/color_row.cljs
+msgid "settings.select-this-color"
+msgstr "Seleccionar elementos que usan este estilo"
+
 # SECTIONS
 msgid "shortcut-section.basics"
 msgstr "Básicos"