Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-04-13 15:31:26 -05:00
Code Issues Activity

✨ Fix viewer for new frames

Browse source
This commit is contained in:
alonso.torres 2022-06-13 15:45:16 +02:00
parent cab2b8469e
commit 566dde21a5
7 changed files with 73 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
common/src/app/common/pages/helpers.cljc
View file

@ -237,16 +237,18 @@
[base index-base-a index-base-b]))
(defn is-shape-over-shape?
[objects base-shape-id over-shape-id]
[objects base-shape-id over-shape-id {:keys [top-frames?]}]
(let [[base index-a index-b] (get-base objects base-shape-id over-shape-id)]
(cond
(= base base-shape-id)
(and (frame-shape? objects base-shape-id)
(and (not top-frames?)
(frame-shape? objects base-shape-id)
(root-frame? objects base-shape-id))
(= base over-shape-id)
(or (not (frame-shape? objects over-shape-id))
(or top-frames?
(not (frame-shape? objects over-shape-id))
(not (root-frame? objects over-shape-id)))
:else
@ -256,7 +258,7 @@
([objects ids]
(sort-z-index objects ids nil))
([objects ids {:keys [bottom-frames?]}]
([objects ids {:keys [bottom-frames?] :as options}]
(letfn [(comp [id-a id-b]
(let [type-a (dm/get-in objects [id-a :type])
type-b (dm/get-in objects [id-b :type])]
@ -270,7 +272,7 @@
(= id-a id-b)
0
(is-shape-over-shape? objects id-a id-b)
(is-shape-over-shape? objects id-a id-b options)
1
:else
@ -683,3 +685,15 @@
(= uuid/zero (:frame-id %))))
:id))
(defn get-viewer-frames
([objects]
(get-viewer-frames objects nil))
([objects {:keys [all-frames?]}]
(into []
(comp (map (d/getf objects))
(if all-frames?
identity
(remove :hide-in-viewer)))
(sort-z-index objects (get-frames-ids objects) {:top-frames? true}))))

15
frontend/src/app/main/data/viewer.cljs
View file

@ -85,13 +85,6 @@
(update [_ state]
(dissoc state :viewer))))
(defn select-frames
[{:keys [objects] :as page}]
(into []
(comp (map (d/getf objects))
(remove :hide-in-viewer))
(cph/sort-z-index objects (cph/get-frames-ids objects))))
;; --- Data Fetching
(s/def ::fetch-bundle-params
@ -119,7 +112,9 @@
(let [pages (->> (get-in file [:data :pages])
(map (fn [page-id]
(let [data (get-in file [:data :pages-index page-id])]
[page-id (assoc data :frames (select-frames data))])))
[page-id (assoc data
:frames (cph/get-viewer-frames (:objects data))
:all-frames (cph/get-viewer-frames (:objects data) {:all-frames? true}))])))
(into {}))]
(ptk/reify ::bundle-fetched
@ -491,7 +486,7 @@
(let [route (:route state)
qparams (:query-params route)
page-id (:page-id qparams)
frames (get-in state [:viewer :pages page-id :frames])
frames (get-in state [:viewer :pages page-id :all-frames])
frame (d/seek #(= (:id %) frame-id) frames)
overlays (get-in state [:viewer-local :overlays])]
(if-not (some #(= (:frame %) frame) overlays)
@ -516,7 +511,7 @@
(let [route (:route state)
qparams (:query-params route)
page-id (:page-id qparams)
frames (get-in state [:viewer :pages page-id :frames])
frames (get-in state [:viewer :pages page-id :all-frames])
frame (d/seek #(= (:id %) frame-id) frames)
overlays (get-in state [:viewer-local :overlays])]
(if-not (some #(= (:frame %) frame) overlays)

2
frontend/src/app/main/render.cljs
View file

@ -389,7 +389,7 @@
text-shapes (sequence (filter cph/text-shape?) (vals objects))
render-texts? (and render-texts? (d/seek (comp nil? :position-data) text-shapes))]
[:& (mf/provider export/include-metadata-ctx) {:value true}
[:& (mf/provider export/include-metadata-ctx) {:value false}
[:& (mf/provider embed/context) {:value render-embed?}
[:svg {:id (dm/str "screenshot-" object-id)
:view-box vbox

6
frontend/src/app/main/ui/viewer/interactions.cljs
View file

@ -7,6 +7,7 @@
(ns app.main.ui.viewer.interactions
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.geom.matrix :as gmt]
[app.common.geom.point :as gpt]
[app.common.pages.helpers :as cph]
@ -127,8 +128,9 @@
[:& dropdown {:show @show-dropdown?
:on-close hide-dropdown}
[:ul.dropdown.with-check
(for [flow flows]
[:li {:class (dom/classnames :selected (= (:id flow) (:id @current-flow)))
(for [[index flow] (d/enumerate flows)]
[:li {:key (dm/str "flow-" (:id flow) "-" index)
:class (dom/classnames :selected (= (:id flow) (:id @current-flow)))
:on-click #(select-flow flow)}
[:span.icon i/tick]
[:span.label (:name flow)]])]]])))

21
frontend/src/app/main/ui/workspace/sidebar/options/menus/interactions.cljs
View file

@ -7,6 +7,7 @@
(ns app.main.ui.workspace.sidebar.options.menus.interactions
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.pages.helpers :as cph]
[app.common.spec.interactions :as csi]
[app.common.spec.page :as csp]
@ -178,10 +179,10 @@
(mf/defc interaction-entry
[{:keys [index shape interaction update-interaction remove-interaction]}]
(let [objects (deref refs/workspace-page-objects)
destination (get objects (:destination interaction))
frames (mf/with-memo [objects]
(cph/get-frames objects))
(let [objects (deref refs/workspace-page-objects)
destination (get objects (:destination interaction))
frames (mf/with-memo [objects] (cph/get-viewer-frames objects {:all-frames? (not= :navigate (:action-type interaction))}))
overlay-pos-type (:overlay-pos-type interaction)
close-click-outside? (:close-click-outside interaction false)
@ -313,7 +314,8 @@
(for [[value name] (event-type-names)]
(when-not (and (= value :after-delay)
(not= (:type shape) :frame))
[:option {:value (str value)} name]))]]
[:option {:key (dm/str value)
:value (dm/str value)} name]))]]
; Delay
(when (csi/has-delay interaction)
@ -334,7 +336,8 @@
{:value (str (:action-type interaction))
:on-change change-action-type}
(for [[value name] (action-type-names)]
[:option {:value (str value)} name])]]
[:option {:key (dm/str "action-" value)
:value (str value)} name])]]
; Destination
(when (csi/has-destination interaction)
@ -349,7 +352,8 @@
(for [frame frames]
(when (and (not= (:id frame) (:id shape)) ; A frame cannot navigate to itself
(not= (:id frame) (:frame-id shape))) ; nor a shape to its container frame
[:option {:value (str (:id frame))} (:name frame)]))]])
[:option {:key (dm/str "destination-" (:id frame))
:value (str (:id frame))} (:name frame)]))]])
; Preserve scroll
(when (csi/has-preserve-scroll interaction)
@ -568,7 +572,8 @@
[:div.interactions-help (tr "workspace.options.use-play-button")]])]
[:div.groups
(for [[index interaction] (d/enumerate interactions)]
[:& interaction-entry {:index index
[:& interaction-entry {:key (dm/str (:id shape) "-" index)
:index index
:shape shape
:interaction interaction
:update-interaction update-interaction

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

@ -280,7 +280,7 @@
selected? (contains? selected (:id shape))
level (calc-level index (:interactions shape))]
(when-not selected?
[:& interaction-path {:key (dm/str (:id shape) "-" index)
[:& interaction-path {:key (dm/str "non-selected-" (:id shape) "-" index)
:index index
:level level
:orig-shape shape
@ -307,35 +307,32 @@
(let [dest-shape (when (cti/destination? interaction)
(get objects (:destination interaction)))
level (calc-level index (:interactions shape))]
[:*
[:& interaction-path {:key (dm/str (:id shape) "-" index)
:index index
:level level
:orig-shape shape
:dest-shape dest-shape
:selected selected
:selected? true
:action-type (:action-type interaction)
:zoom zoom}]
(when (and (or (= (:action-type interaction) :open-overlay)
(= (:action-type interaction) :toggle-overlay))
(= (:overlay-pos-type interaction) :manual))
(if (and (some? move-overlay-to)
(= move-overlay-index index))
[:& overlay-marker {:key (dm/str "pos" (:id shape) "-" index)
:index index
:orig-shape shape
:dest-shape dest-shape
:position move-overlay-to
:objects objects
:hover-disabled? hover-disabled?}]
[:& overlay-marker {:key (dm/str "pos" (:id shape) "-" index)
:index index
:orig-shape shape
:dest-shape dest-shape
:position (:overlay-position interaction)
:objects objects
:hover-disabled? hover-disabled?}]))])))
[:g {:key (dm/str "interaction-path-" (:id shape) "-" index)}
[:& interaction-path {:index index
:level level
:orig-shape shape
:dest-shape dest-shape
:selected selected
:selected? true
:action-type (:action-type interaction)
:zoom zoom}]
(when (and (or (= (:action-type interaction) :open-overlay)
(= (:action-type interaction) :toggle-overlay))
(= (:overlay-pos-type interaction) :manual))
(if (and (some? move-overlay-to)
(= move-overlay-index index))
[:& overlay-marker {:index index
:orig-shape shape
:dest-shape dest-shape
:position move-overlay-to
:objects objects
:hover-disabled? hover-disabled?}]
[:& overlay-marker {:index index
:orig-shape shape
:dest-shape dest-shape
:position (:overlay-position interaction)
:objects objects
:hover-disabled? hover-disabled?}]))])))
(when (and shape
(not (cph/unframed-shape? shape))
(not (#{:move :rotate} current-transform)))

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

@ -6,6 +6,7 @@
(ns app.main.ui.workspace.viewport.widgets
(:require
[app.common.data :as d]
[app.common.data.macros :as dm]
[app.common.geom.point :as gpt]
[app.common.geom.shapes :as gsh]
@ -253,9 +254,10 @@
on-frame-leave (unchecked-get props "on-frame-leave")
on-frame-select (unchecked-get props "on-frame-select")]
[:g.frame-flows
(for [flow flows]
(for [[index flow] (d/enumerate flows)]
(let [frame (get objects (:starting-frame flow))]
[:& frame-flow {:flow flow
[:& frame-flow {:key (dm/str (:id frame) "-" index)
:flow flow
:frame frame
:selected? (contains? selected (:id frame))
:zoom zoom