mirror of
https://github.com/penpot/penpot.git
synced 2025-06-13 09:51:39 +02:00
🐛 Fix relative position overlay positioning
This commit is contained in:
alonso.torres
parent
0c8d8d92ba
commit
532caea169
2 changed files with 73 additions and 63 deletions
|
|
@ -74,6 +74,7 @@
|
||||||
- Fix dashboard scrolling using 'Page Up' and 'Page Down' [Taiga #5081](https://tree.taiga.io/project/penpot/issue/5081)
|
- Fix dashboard scrolling using 'Page Up' and 'Page Down' [Taiga #5081](https://tree.taiga.io/project/penpot/issue/5081)
|
||||||
- Fix view mode header buttons overlapping in small resolutions [Taiga #5058](https://tree.taiga.io/project/penpot/issue/5058)
|
- Fix view mode header buttons overlapping in small resolutions [Taiga #5058](https://tree.taiga.io/project/penpot/issue/5058)
|
||||||
- Fix precision for wrap in flex [Taiga #5072](https://tree.taiga.io/project/penpot/issue/5072)
|
- Fix precision for wrap in flex [Taiga #5072](https://tree.taiga.io/project/penpot/issue/5072)
|
||||||
|
- Fix relative position overlay positioning [Taiga #5092](https://tree.taiga.io/project/penpot/issue/5092)
|
||||||
|
|
||||||
### :heart: Community contributions by (Thank you!)
|
### :heart: Community contributions by (Thank you!)
|
||||||
- To @ondrejkonec: for contributing to the code with:
|
- To @ondrejkonec: for contributing to the code with:
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,7 @@
|
||||||
(ns app.main.ui.viewer.shapes
|
(ns app.main.ui.viewer.shapes
|
||||||
"The main container for a frame in viewer mode"
|
"The main container for a frame in viewer mode"
|
||||||
(:require
|
(:require
|
||||||
|
[app.common.geom.point :as gpt]
|
||||||
[app.common.geom.shapes :as gsh]
|
[app.common.geom.shapes :as gsh]
|
||||||
[app.common.pages.helpers :as cph]
|
[app.common.pages.helpers :as cph]
|
||||||
[app.common.types.shape.interactions :as ctsi]
|
[app.common.types.shape.interactions :as ctsi]
|
||||||
|
|
@ -46,80 +47,88 @@
|
||||||
|
|
||||||
(defn- activate-interaction
|
(defn- activate-interaction
|
||||||
[interaction shape base-frame frame-offset objects overlays]
|
[interaction shape base-frame frame-offset objects overlays]
|
||||||
(case (:action-type interaction)
|
|
||||||
:navigate
|
|
||||||
(when-let [frame-id (:destination interaction)]
|
|
||||||
(let [viewer-section (dom/get-element "viewer-section")
|
|
||||||
scroll (if (:preserve-scroll interaction)
|
|
||||||
(dom/get-scroll-pos viewer-section)
|
|
||||||
0)]
|
|
||||||
(st/emit! (dv/set-nav-scroll scroll)
|
|
||||||
(dv/go-to-frame frame-id (:animation interaction)))))
|
|
||||||
|
|
||||||
:open-overlay
|
(let [;; When the interactive item is inside a nested frame we need to add to the offset the position
|
||||||
(let [dest-frame-id (:destination interaction)
|
;; of the parent-frame otherwise the position won't match
|
||||||
viewer-objects (deref (refs/get-viewer-objects))
|
shape-frame (cph/get-frame objects shape)
|
||||||
dest-frame (get viewer-objects dest-frame-id)
|
|
||||||
relative-to-id (if (= :manual (:overlay-pos-type interaction))
|
|
||||||
(:id shape) ;; manual interactions are allways from "self"
|
|
||||||
(:position-relative-to interaction))
|
|
||||||
relative-to-shape (or (get objects relative-to-id) base-frame)
|
|
||||||
close-click-outside (:close-click-outside interaction)
|
|
||||||
background-overlay (:background-overlay interaction)
|
|
||||||
overlays-ids (set (map :id overlays))
|
|
||||||
relative-to-base-frame (find-relative-to-base-frame relative-to-shape objects overlays-ids base-frame)
|
|
||||||
position (ctsi/calc-overlay-position interaction
|
|
||||||
viewer-objects
|
|
||||||
relative-to-shape
|
|
||||||
relative-to-base-frame
|
|
||||||
dest-frame
|
|
||||||
frame-offset)]
|
|
||||||
(when dest-frame-id
|
|
||||||
(st/emit! (dv/open-overlay dest-frame-id
|
|
||||||
position
|
|
||||||
close-click-outside
|
|
||||||
background-overlay
|
|
||||||
(:animation interaction)))))
|
|
||||||
|
|
||||||
:toggle-overlay
|
frame-offset (if (or (cph/root-frame? shape-frame) (cph/root? shape-frame))
|
||||||
(let [frame-id (:destination interaction)
|
frame-offset
|
||||||
dest-frame (get objects frame-id)
|
(gpt/add frame-offset (gpt/point shape-frame)))]
|
||||||
relative-to-id (if (= :manual (:overlay-pos-type interaction))
|
(case (:action-type interaction)
|
||||||
(:id shape) ;; manual interactions are allways from "self"
|
:navigate
|
||||||
(:position-relative-to interaction))
|
(when-let [frame-id (:destination interaction)]
|
||||||
relative-to-shape (or (get objects relative-to-id) base-frame)
|
(let [viewer-section (dom/get-element "viewer-section")
|
||||||
overlays-ids (set (map :id overlays))
|
scroll (if (:preserve-scroll interaction)
|
||||||
relative-to-base-frame (find-relative-to-base-frame relative-to-shape objects overlays-ids base-frame)
|
(dom/get-scroll-pos viewer-section)
|
||||||
position (ctsi/calc-overlay-position interaction
|
0)]
|
||||||
objects
|
(st/emit! (dv/set-nav-scroll scroll)
|
||||||
relative-to-shape
|
(dv/go-to-frame frame-id (:animation interaction)))))
|
||||||
relative-to-base-frame
|
|
||||||
dest-frame
|
|
||||||
frame-offset)
|
|
||||||
|
|
||||||
close-click-outside (:close-click-outside interaction)
|
:open-overlay
|
||||||
background-overlay (:background-overlay interaction)]
|
(let [dest-frame-id (:destination interaction)
|
||||||
(when frame-id
|
viewer-objects (deref (refs/get-viewer-objects))
|
||||||
(st/emit! (dv/toggle-overlay frame-id
|
dest-frame (get viewer-objects dest-frame-id)
|
||||||
|
relative-to-id (if (= :manual (:overlay-pos-type interaction))
|
||||||
|
(:id shape) ;; manual interactions are allways from "self"
|
||||||
|
(:position-relative-to interaction))
|
||||||
|
relative-to-shape (or (get objects relative-to-id) base-frame)
|
||||||
|
close-click-outside (:close-click-outside interaction)
|
||||||
|
background-overlay (:background-overlay interaction)
|
||||||
|
overlays-ids (set (map :id overlays))
|
||||||
|
relative-to-base-frame (find-relative-to-base-frame relative-to-shape objects overlays-ids base-frame)
|
||||||
|
position (ctsi/calc-overlay-position interaction
|
||||||
|
viewer-objects
|
||||||
|
relative-to-shape
|
||||||
|
relative-to-base-frame
|
||||||
|
dest-frame
|
||||||
|
frame-offset)]
|
||||||
|
(when dest-frame-id
|
||||||
|
(st/emit! (dv/open-overlay dest-frame-id
|
||||||
position
|
position
|
||||||
close-click-outside
|
close-click-outside
|
||||||
background-overlay
|
background-overlay
|
||||||
(:animation interaction)))))
|
(:animation interaction)))))
|
||||||
|
|
||||||
:close-overlay
|
:toggle-overlay
|
||||||
(let [frame-id (or (:destination interaction)
|
(let [frame-id (:destination interaction)
|
||||||
(if (= (:type shape) :frame)
|
dest-frame (get objects frame-id)
|
||||||
(:id shape)
|
relative-to-id (if (= :manual (:overlay-pos-type interaction))
|
||||||
(:frame-id shape)))]
|
(:id shape) ;; manual interactions are allways from "self"
|
||||||
(st/emit! (dv/close-overlay frame-id (:animation interaction))))
|
(:position-relative-to interaction))
|
||||||
|
relative-to-shape (or (get objects relative-to-id) base-frame)
|
||||||
|
overlays-ids (set (map :id overlays))
|
||||||
|
relative-to-base-frame (find-relative-to-base-frame relative-to-shape objects overlays-ids base-frame)
|
||||||
|
position (ctsi/calc-overlay-position interaction
|
||||||
|
objects
|
||||||
|
relative-to-shape
|
||||||
|
relative-to-base-frame
|
||||||
|
dest-frame
|
||||||
|
frame-offset)
|
||||||
|
|
||||||
:prev-screen
|
close-click-outside (:close-click-outside interaction)
|
||||||
(st/emit! (rt/nav-back-local))
|
background-overlay (:background-overlay interaction)]
|
||||||
|
(when frame-id
|
||||||
|
(st/emit! (dv/toggle-overlay frame-id
|
||||||
|
position
|
||||||
|
close-click-outside
|
||||||
|
background-overlay
|
||||||
|
(:animation interaction)))))
|
||||||
|
|
||||||
:open-url
|
:close-overlay
|
||||||
(st/emit! (dom/open-new-window (:url interaction)))
|
(let [frame-id (or (:destination interaction)
|
||||||
|
(if (= (:type shape) :frame)
|
||||||
|
(:id shape)
|
||||||
|
(:frame-id shape)))]
|
||||||
|
(st/emit! (dv/close-overlay frame-id (:animation interaction))))
|
||||||
|
|
||||||
nil))
|
:prev-screen
|
||||||
|
(st/emit! (rt/nav-back-local))
|
||||||
|
|
||||||
|
:open-url
|
||||||
|
(st/emit! (dom/open-new-window (:url interaction)))
|
||||||
|
|
||||||
|
nil)))
|
||||||
|
|
||||||
;; Perform the opposite action of an interaction, if possible
|
;; Perform the opposite action of an interaction, if possible
|
||||||
(defn- deactivate-interaction
|
(defn- deactivate-interaction
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue