0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-08 16:18:11 -05:00

🎉 Allow to drag images from browser to workspace

This commit is contained in:
Andrés Moya 2020-06-24 15:09:50 +02:00 committed by Andrey Antukh
parent 72c36660b9
commit 85c8d544ed
7 changed files with 56 additions and 11 deletions

View file

@ -136,7 +136,7 @@
(s/def ::content ::imgs/upload)
(s/def ::add-file-image-from-url
(s/keys :req-un [::profile-id ::file-id ::name ::url]
(s/keys :req-un [::profile-id ::file-id ::url]
:opt-un [::id]))
(s/def ::upload-file-image
@ -148,7 +148,8 @@
(db/with-atomic [conn db/pool]
(files/check-edition-permissions! conn profile-id file-id)
(let [content (images/download-image url)
params' (merge params {:content content})]
params' (merge params {:content content
:name (:filename content)})]
(create-file-image conn params'))))
(sm/defmutation ::upload-file-image

View file

@ -128,7 +128,7 @@
(s/def ::content ::upload)
(s/def ::add-image-from-url
(s/keys :req-un [::profile-id ::library-id ::name ::url]
(s/keys :req-un [::profile-id ::library-id ::url]
:opt-un [::id]))
(s/def ::upload-image
@ -141,7 +141,8 @@
(let [lib (select-library-for-update conn library-id)]
(teams/check-edition-permissions! conn profile-id (:team-id lib))
(let [content (images/download-image url)
params' (merge params {:content content})]
params' (merge params {:content content
:name (:filename content)})]
(create-image conn params')))))
(sm/defmutation ::upload-image

View file

@ -140,7 +140,6 @@
data {::sm/type :add-file-image-from-url
:profile-id (:id prof)
:file-id (:id file)
:name "testfile"
:url url}
out (th/try-on! (sm/handle data))]
@ -149,7 +148,7 @@
(let [result (:result out)]
(t/is (= (:id file) (:file-id result)))
(t/is (= (:name data) (:name result)))
(t/is (not (nil? (:name result))))
(t/is (= 787 (:width result)))
(t/is (= 2000 (:height result)))
(t/is (= "image/jpeg" (:mtype result)))

View file

@ -116,7 +116,6 @@
:id image-id-1
:profile-id (:id prof)
:library-id (:id lib)
:name "testfile"
:url url}
out (th/try-on! (sm/handle data))]
@ -124,7 +123,7 @@
(t/is (nil? (:error out)))
(t/is (= image-id-1 (get-in out [:result :id])))
(t/is (= "testfile" (get-in out [:result :name])))
(t/is (not (nil? (get-in out [:result :name]))))
(t/is (= "image/jpeg" (get-in out [:result :mtype])))
(t/is (= "image/jpeg" (get-in out [:result :thumb-mtype])))
(t/is (= 787 (get-in out [:result :width])))

View file

@ -1463,6 +1463,7 @@
;; Persistence
(def add-image-from-url dwp/add-image-from-url)
(def upload-image dwp/upload-image)
(def rename-page dwp/rename-page)
(def delete-page dwp/delete-page)

View file

@ -301,6 +301,38 @@
;; and update-photo at main/data/users.cljs
;; https://tree.taiga.io/project/uxboxproject/us/440
(defn add-image-from-url
([url] (add-image-from-url url identity))
([url on-added]
(us/verify fn? on-added)
(ptk/reify ::add-image-from-url
ptk/WatchEvent
(watch [_ state stream]
(let [file-id (get-in state [:workspace-page :file-id])
on-success #(do (st/emit! dm/hide)
(on-added %))
on-error #(do (st/emit! dm/hide)
(if (.-message %)
(rx/of (dm/error (.-message %)))
(rx/of (dm/error (tr "errors.unexpected-error")))))
prepare
(fn [url]
{:file-id file-id
:url url})]
(st/emit! (dm/show {:content (tr "image.loading")
:type :info
:timeout nil}))
(->> (rx/of url)
(rx/map prepare)
(rx/mapcat #(rp/mutation! :add-file-image-from-url %))
(rx/do on-success)
(rx/map image-uploaded)
(rx/catch on-error)))))))
(defn upload-image
([file] (upload-image file identity))
([file on-uploaded]

View file

@ -337,13 +337,15 @@
on-drag-enter
(fn [e]
(when (or (dnd/has-type? e "uxbox/shape")
(dnd/has-type? e "Files"))
(dnd/has-type? e "Files")
(dnd/has-type? e "text/uri-list"))
(dom/prevent-default e)))
on-drag-over
(fn [e]
(when (or (dnd/has-type? e "uxbox/shape")
(dnd/has-type? e "Files"))
(dnd/has-type? e "Files")
(dnd/has-type? e "text/uri-list"))
(dom/prevent-default e)))
on-uploaded
@ -361,8 +363,9 @@
on-drop
(fn [event]
(dom/prevent-default event)
(if (dnd/has-type? event "uxbox/shape")
(cond
(dnd/has-type? event "uxbox/shape")
(let [shape (dnd/get-data event "uxbox/shape")
point (gpt/point (.-clientX event) (.-clientY event))
viewport-coord (translate-point-to-viewport point)
@ -372,6 +375,15 @@
(assoc :x final-x)
(assoc :y final-y)))))
(dnd/has-type? event "text/uri-list")
(let [data (dnd/get-data event "text/uri-list")
lines (str/lines data)
urls (filter #(and (not (str/blank? %))
(not (str/starts-with? % "#")))
lines)]
(run! #(st/emit! (dw/add-image-from-url % on-uploaded)) urls))
:else
(let [files (dnd/get-files event)]
(run! #(st/emit! (dw/upload-image % on-uploaded)) files))))