Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-12 18:18:24 -05:00
Code Issues Activity

🐛 Fixed image upload problems

Browse source
This commit is contained in:
alonso.torres 2020-09-23 16:36:02 +02:00 • committed by Andrey Antukh
parent d5545fadaf
commit 94470dd1fe
5 changed files with 87 additions and 85 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
common/app/common/geom/shapes.cljc
View file

@ -939,3 +939,10 @@
(cleanup combined))) (cleanup combined)))
(defn setup-selrect [{:keys [x y width height] :as shape}]
(-> shape
(assoc :selrect {:x x :y y
:width width :height height
:x1 x :y1 y
:x2 (+ x width) :y2 (+ y height)})))

81
frontend/src/app/main/data/workspace.cljs
View file

@ -578,39 +578,26 @@
(->> (rx/of (start-edition-mode id)) (->> (rx/of (start-edition-mode id))
(rx/observe-on :async)))))))) (rx/observe-on :async))))))))
(defn- calculate-centered-box (defn- viewport-center
[state aspect-ratio] [state]
(if (>= aspect-ratio 1) (let [{:keys [x y width height]} (get-in state [:workspace-local :vbox])]
(let [vbox (get-in state [:workspace-local :vbox]) [(+ x (/ width 2)) (+ y (/ height 2))]))
width (/ (:width vbox) 2)
height (/ width aspect-ratio)
x (+ (:x vbox) (/ width 2))
y (+ (:y vbox) (/ (- (:height vbox) height) 2))]
[width height x y])
(let [vbox (get-in state [:workspace-local :vbox])
height (/ (:height vbox) 2)
width (* height aspect-ratio)
y (+ (:y vbox) (/ height 2))
x (+ (:x vbox) (/ (- (:width vbox) width) 2))]
[width height x y])))
(defn create-and-add-shape (defn create-and-add-shape
[type data aspect-ratio] [type data]
(ptk/reify ::create-and-add-shape (ptk/reify ::create-and-add-shape
ptk/WatchEvent ptk/WatchEvent
(watch [_ state stream] (watch [_ state stream]
(let [[width height x y] (calculate-centered-box state aspect-ratio) (let [{:keys [width height]} data
[vbc-x vbc-y] (viewport-center state)
x (:x data (- vbc-x (/ width 2)))
y (:y data (- vbc-y (/ height 2)))
shape (-> (cp/make-minimal-shape type) shape (-> (cp/make-minimal-shape type)
(merge data) (merge data)
(geom/resize width height) (merge {:x x :y y})
(geom/absolute-move (gpt/point x y)) (geom/setup-selrect))]
(geom/transform-shape))]
(rx/of (add-shape shape)))))) (rx/of (add-shape shape))))))
;; --- Update Shape Attrs ;; --- Update Shape Attrs
@ -1243,13 +1230,18 @@
(defn- image-uploaded (defn- image-uploaded
[image] [image]
(let [shape {:name (:name image) (let [{:keys [x y]} @ms/mouse-position
:metadata {:width (:width image) {:keys [width height]} image
:height (:height image) shape {:name (:name image)
:width width
:height height
:x (- x (/ width 2))
:y (- y (/ height 2))
:metadata {:width width
:height height
:id (:id image) :id (:id image)
:path (:path image)}} :path (:path image)}}]
aspect-ratio (/ (:width image) (:height image))] (st/emit! (create-and-add-shape :image shape))))
(st/emit! (create-and-add-shape :image shape aspect-ratio))))
(defn- paste-image-impl (defn- paste-image-impl
[image] [image]
@ -1318,21 +1310,16 @@
{:keys [x y]} @ms/mouse-position {:keys [x y]} @ms/mouse-position
width (min (* 7 (count text)) 700) width (min (* 7 (count text)) 700)
height 16 height 16
shape {:id id shape (geom/setup-selrect
:type :text {:id id
:name "Text" :type :text
:x x :name "Text"
:y y :x x
:selrect {:x1 x :y1 y :y y
:x2 (+ x width) :width width
:y2 (+ y height) :height height
:x x :y y :grow-type (if (> (count text) 100) :auto-height :auto-width)
:width width :content (as-content text)})]
:height height}
:width width
:height height
:grow-type (if (> (count text) 100) :auto-height :auto-width)
:content (as-content text)}]
(rx/of dwc/start-undo-transaction (rx/of dwc/start-undo-transaction
dws/deselect-all dws/deselect-all
(add-shape shape) (add-shape shape)

1
frontend/src/app/main/ui/workspace/colorpicker.cljs
View file

@ -194,6 +194,7 @@
:r r :g g :b b :r r :g g :b b
:h h :s s :v v :h h :s s :v v
:hex hex) :hex hex)
(reset! value-ref hex)
(when picked-color-select (when picked-color-select
(on-change hex (:alpha @current-color) nil nil picked-shift?)))))) (on-change hex (:alpha @current-color) nil nil picked-shift?))))))

4
frontend/src/app/main/ui/workspace/left_toolbar.cljs
View file

@ -35,12 +35,14 @@
on-uploaded on-uploaded
(fn [{:keys [id name] :as image}] (fn [{:keys [id name] :as image}]
(let [shape {:name name (let [shape {:name name
:width (:width image)
:height (:height image)
:metadata {:width (:width image) :metadata {:width (:width image)
:height (:height image) :height (:height image)
:id (:id image) :id (:id image)
:path (:path image)}} :path (:path image)}}
aspect-ratio (/ (:width image) (:height image))] aspect-ratio (/ (:width image) (:height image))]
(st/emit! (dw/create-and-add-shape :image shape aspect-ratio)))) (st/emit! (dw/create-and-add-shape :image shape))))
on-files-selected on-files-selected
(fn [js-files] (fn [js-files]

79
frontend/src/app/main/ui/workspace/viewport.cljs
View file

@ -475,56 +475,61 @@
;; TODO: seems duplicated callback is the same as one located ;; TODO: seems duplicated callback is the same as one located
;; in left_toolbar ;; in left_toolbar
on-uploaded on-uploaded
(fn [{:keys [id name] :as image}] (fn [{:keys [id name] :as image} {:keys [x y]}]
(let [shape {:name name (let [shape {:name name
:width (:width image)
:height (:height image)
:x (- x (/ (:width image) 2))
:y (- y (/ (:height image) 2))
:metadata {:width (:width image) :metadata {:width (:width image)
:height (:height image) :height (:height image)
:id (:id image) :id (:id image)
:path (:path image)}} :path (:path image)}}
aspect-ratio (/ (:width image) (:height image))] aspect-ratio (/ (:width image) (:height image))]
(st/emit! (dw/create-and-add-shape :image shape aspect-ratio)))) (st/emit! (dw/create-and-add-shape :image shape))))
on-drop on-drop
(fn [event] (fn [event]
(dom/prevent-default event) (dom/prevent-default event)
(cond (let [point (gpt/point (.-clientX event) (.-clientY event))
(dnd/has-type? event "app/shape") viewport-coord (translate-point-to-viewport point)]
(let [shape (dnd/get-data event "app/shape") (cond
point (gpt/point (.-clientX event) (.-clientY event)) (dnd/has-type? event "app/shape")
viewport-coord (translate-point-to-viewport point) (let [shape (dnd/get-data event "app/shape")
final-x (- (:x viewport-coord) (/ (:width shape) 2)) final-x (- (:x viewport-coord) (/ (:width shape) 2))
final-y (- (:y viewport-coord) (/ (:height shape) 2))] final-y (- (:y viewport-coord) (/ (:height shape) 2))]
(st/emit! (dw/add-shape (-> shape (st/emit! (dw/add-shape (-> shape
(assoc :x final-x) (assoc :x final-x)
(assoc :y final-y))))) (assoc :y final-y)))))
(dnd/has-type? event "app/component") (dnd/has-type? event "app/component")
(let [{:keys [component-id file-id]} (dnd/get-data event "app/component")] (let [{:keys [component-id file-id]} (dnd/get-data event "app/component")]
(st/emit! (dwl/instantiate-component file-id component-id))) (st/emit! (dwl/instantiate-component file-id component-id)))
(dnd/has-type? event "text/uri-list") (dnd/has-type? event "text/uri-list")
(let [data (dnd/get-data event "text/uri-list") (let [data (dnd/get-data event "text/uri-list")
lines (str/lines data) lines (str/lines data)
urls (filter #(and (not (str/blank? %)) urls (filter #(and (not (str/blank? %))
(not (str/starts-with? % "#"))) (not (str/starts-with? % "#")))
lines)] lines)]
(->> urls (->> urls
(map (fn [uri] (map (fn [uri]
(with-meta {:file-id (:id file) (with-meta {:file-id (:id file)
:local? true :local? true
:uri uri} :uri uri}
{:on-success on-uploaded}))) {:on-success #(on-uploaded % viewport-coord)})))
(map dw/upload-media-objects) (map dw/upload-media-objects)
(apply st/emit!))) (apply st/emit!)))
:else :else
(let [js-files (dnd/get-files event) (let [js-files (dnd/get-files event)
params {:file-id (:id file) params {:file-id (:id file)
:local? true :local? true
:js-files js-files}] :js-files js-files
(st/emit! (dw/upload-media-objects }]
(with-meta params (st/emit! (dw/upload-media-objects
{:on-success on-uploaded})))))) (with-meta params
{:on-success #(on-uploaded % viewport-coord)})))))))
on-resize on-resize
(fn [event] (fn [event]