mirror of
https://github.com/penpot/penpot.git
synced 2025-12-11 22:14:05 +01:00
🎉 Add animations to interactions
This commit is contained in:
Andrés Moya
committed by
Andrey Antukh
Andrey Antukh
parent
24062beebe
commit
81cbc33dbb
@@ -269,12 +269,252 @@
|
||||
(t/testing "Set background-overlay"
|
||||
(let [new-interaction (cti/set-background-overlay i3 true)]
|
||||
(t/is (not (:background-overlay i3)))
|
||||
(t/is (:background-overlay new-interaction))))
|
||||
|
||||
))
|
||||
(t/is (:background-overlay new-interaction))))))
|
||||
|
||||
|
||||
(t/deftest interactions
|
||||
(t/deftest animation-checks
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-action-type i1 :open-overlay)
|
||||
i3 (cti/set-action-type i1 :toggle-overlay)
|
||||
i4 (cti/set-action-type i1 :close-overlay)
|
||||
i5 (cti/set-action-type i1 :prev-screen)
|
||||
i6 (cti/set-action-type i1 :open-url)]
|
||||
|
||||
(t/testing "Has animation?"
|
||||
(t/is (cti/has-animation? i1))
|
||||
(t/is (cti/has-animation? i2))
|
||||
(t/is (cti/has-animation? i3))
|
||||
(t/is (cti/has-animation? i4))
|
||||
(t/is (not (cti/has-animation? i5)))
|
||||
(t/is (not (cti/has-animation? i6))))
|
||||
|
||||
(t/testing "Valid push?"
|
||||
(t/is (cti/allow-push? (:action-type i1)))
|
||||
(t/is (not (cti/allow-push? (:action-type i2))))
|
||||
(t/is (not (cti/allow-push? (:action-type i3))))
|
||||
(t/is (not (cti/allow-push? (:action-type i4))))
|
||||
(t/is (not (cti/allow-push? (:action-type i5))))
|
||||
(t/is (not (cti/allow-push? (:action-type i6)))))))
|
||||
|
||||
|
||||
(t/deftest set-animation-type
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-animation-type i1 :dissolve)]
|
||||
|
||||
(t/testing "Set animation type nil"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i1 nil)]
|
||||
(t/is (nil? (-> new-interaction :animation :animation-type)))))
|
||||
|
||||
(t/testing "Set animation type unchanged"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i2 :dissolve)]
|
||||
(t/is (= :dissolve (-> new-interaction :animation :animation-type)))))
|
||||
|
||||
(t/testing "Set animation type changed"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i2 :slide)]
|
||||
(t/is (= :slide (-> new-interaction :animation :animation-type)))))
|
||||
|
||||
(t/testing "Set animation type reset"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i2 nil)]
|
||||
(t/is (nil? (-> new-interaction :animation)))))
|
||||
|
||||
(t/testing "Set animation type dissolve"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i1 :dissolve)]
|
||||
(t/is (= :dissolve (-> new-interaction :animation :animation-type)))
|
||||
(t/is (= 300 (-> new-interaction :animation :duration)))
|
||||
(t/is (= :linear (-> new-interaction :animation :easing)))))
|
||||
|
||||
(t/testing "Set animation type dissolve with previous data"
|
||||
(let [interaction (assoc i1 :animation {:animation-type :slide
|
||||
:duration 1000
|
||||
:easing :ease-out
|
||||
:way :out
|
||||
:direction :left
|
||||
:offset-effect true})
|
||||
new-interaction
|
||||
(cti/set-animation-type interaction :dissolve)]
|
||||
(t/is (= :dissolve (-> new-interaction :animation :animation-type)))
|
||||
(t/is (= 1000 (-> new-interaction :animation :duration)))
|
||||
(t/is (= :ease-out (-> new-interaction :animation :easing)))))
|
||||
|
||||
(t/testing "Set animation type slide"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i1 :slide)]
|
||||
(t/is (= :slide (-> new-interaction :animation :animation-type)))
|
||||
(t/is (= 300 (-> new-interaction :animation :duration)))
|
||||
(t/is (= :linear (-> new-interaction :animation :easing)))
|
||||
(t/is (= :in (-> new-interaction :animation :way)))
|
||||
(t/is (= :right (-> new-interaction :animation :direction)))
|
||||
(t/is (= false (-> new-interaction :animation :offset-effect)))))
|
||||
|
||||
(t/testing "Set animation type slide with previous data"
|
||||
(let [interaction (assoc i1 :animation {:animation-type :dissolve
|
||||
:duration 1000
|
||||
:easing :ease-out
|
||||
:way :out
|
||||
:direction :left
|
||||
:offset-effect true})
|
||||
new-interaction
|
||||
(cti/set-animation-type interaction :slide)]
|
||||
(t/is (= :slide (-> new-interaction :animation :animation-type)))
|
||||
(t/is (= 1000 (-> new-interaction :animation :duration)))
|
||||
(t/is (= :ease-out (-> new-interaction :animation :easing)))
|
||||
(t/is (= :out (-> new-interaction :animation :way)))
|
||||
(t/is (= :left (-> new-interaction :animation :direction)))
|
||||
(t/is (= true (-> new-interaction :animation :offset-effect)))))
|
||||
|
||||
(t/testing "Set animation type push"
|
||||
(let [new-interaction
|
||||
(cti/set-animation-type i1 :push)]
|
||||
(t/is (= :push (-> new-interaction :animation :animation-type)))
|
||||
(t/is (= 300 (-> new-interaction :animation :duration)))
|
||||
(t/is (= :linear (-> new-interaction :animation :easing)))
|
||||
(t/is (= :right (-> new-interaction :animation :direction)))))
|
||||
|
||||
(t/testing "Set animation type push with previous data"
|
||||
(let [interaction (assoc i1 :animation {:animation-type :slide
|
||||
:duration 1000
|
||||
:easing :ease-out
|
||||
:way :out
|
||||
:direction :left
|
||||
:offset-effect true})
|
||||
new-interaction
|
||||
(cti/set-animation-type interaction :push)]
|
||||
(t/is (= :push (-> new-interaction :animation :animation-type)))
|
||||
(t/is (= 1000 (-> new-interaction :animation :duration)))
|
||||
(t/is (= :ease-out (-> new-interaction :animation :easing)))
|
||||
(t/is (= :left (-> new-interaction :animation :direction)))))))
|
||||
|
||||
|
||||
(t/deftest allowed-animation
|
||||
(let [i1 (cti/set-action-type cti/default-interaction :open-overlay)
|
||||
i2 (cti/set-action-type cti/default-interaction :close-overlay)
|
||||
i3 (cti/set-action-type cti/default-interaction :toggle-overlay)]
|
||||
|
||||
(t/testing "Cannot use animation push for an overlay action"
|
||||
(let [bad-interaction-1 (assoc i1 :animation {:animation-type :push
|
||||
:duration 1000
|
||||
:easing :ease-out
|
||||
:direction :left})
|
||||
bad-interaction-2 (assoc i2 :animation {:animation-type :push
|
||||
:duration 1000
|
||||
:easing :ease-out
|
||||
:direction :left})
|
||||
bad-interaction-3 (assoc i3 :animation {:animation-type :push
|
||||
:duration 1000
|
||||
:easing :ease-out
|
||||
:direction :left})]
|
||||
(t/is (not (cti/allowed-animation? (:action-type bad-interaction-1)
|
||||
(-> bad-interaction-1 :animation :animation-type))))
|
||||
(t/is (not (cti/allowed-animation? (:action-type bad-interaction-2)
|
||||
(-> bad-interaction-1 :animation :animation-type))))
|
||||
(t/is (not (cti/allowed-animation? (:action-type bad-interaction-3)
|
||||
(-> bad-interaction-1 :animation :animation-type))))))
|
||||
|
||||
(t/testing "Remove animation if moving to an forbidden state"
|
||||
(let [interaction (cti/set-animation-type cti/default-interaction :push)
|
||||
new-interaction (cti/set-action-type interaction :open-overlay)]
|
||||
(t/is (nil? (:animation new-interaction)))))))
|
||||
|
||||
|
||||
(t/deftest option-duration
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-animation-type cti/default-interaction :dissolve)]
|
||||
|
||||
(t/testing "Has duration?"
|
||||
(t/is (not (cti/has-duration? i1)))
|
||||
(t/is (cti/has-duration? i2)))
|
||||
|
||||
(t/testing "Set duration"
|
||||
(let [new-interaction (cti/set-duration i2 1000)]
|
||||
(t/is (= 1000 (-> new-interaction :animation :duration)))))))
|
||||
|
||||
|
||||
(t/deftest option-easing
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-animation-type cti/default-interaction :dissolve)]
|
||||
|
||||
(t/testing "Has easing?"
|
||||
(t/is (not (cti/has-easing? i1)))
|
||||
(t/is (cti/has-easing? i2)))
|
||||
|
||||
(t/testing "Set easing"
|
||||
(let [new-interaction (cti/set-easing i2 :ease-in)]
|
||||
(t/is (= :ease-in (-> new-interaction :animation :easing)))))))
|
||||
|
||||
|
||||
(t/deftest option-way
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-animation-type cti/default-interaction :slide)
|
||||
i3 (cti/set-action-type i2 :open-overlay)]
|
||||
|
||||
(t/testing "Has way?"
|
||||
(t/is (not (cti/has-way? i1)))
|
||||
(t/is (cti/has-way? i2))
|
||||
(t/is (not (cti/has-way? i3)))
|
||||
(t/is (some? (-> i3 :animation :way)))) ; <- it exists but is ignored
|
||||
|
||||
(t/testing "Set way"
|
||||
(let [new-interaction (cti/set-way i2 :out)]
|
||||
(t/is (= :out (-> new-interaction :animation :way)))))))
|
||||
|
||||
|
||||
(t/deftest option-direction
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-animation-type cti/default-interaction :push)
|
||||
i3 (cti/set-animation-type cti/default-interaction :dissolve)]
|
||||
|
||||
(t/testing "Has direction?"
|
||||
(t/is (not (cti/has-direction? i1)))
|
||||
(t/is (cti/has-direction? i2)))
|
||||
|
||||
(t/testing "Set direction"
|
||||
(let [new-interaction (cti/set-direction i2 :left)]
|
||||
(t/is (= :left (-> new-interaction :animation :direction)))))
|
||||
|
||||
(t/testing "Invert direction"
|
||||
(let [a-none (:animation i3)
|
||||
a-right (:animation i2)
|
||||
a-left (assoc a-right :direction :left)
|
||||
a-up (assoc a-right :direction :up)
|
||||
a-down (assoc a-right :direction :down)
|
||||
|
||||
a-nil' (cti/invert-direction nil)
|
||||
a-none' (cti/invert-direction a-none)
|
||||
a-right' (cti/invert-direction a-right)
|
||||
a-left' (cti/invert-direction a-left)
|
||||
a-up' (cti/invert-direction a-up)
|
||||
a-down' (cti/invert-direction a-down)]
|
||||
|
||||
(t/is (nil? a-nil'))
|
||||
(t/is (nil? (:direction a-none')))
|
||||
(t/is (= :left (:direction a-right')))
|
||||
(t/is (= :right (:direction a-left')))
|
||||
(t/is (= :down (:direction a-up')))
|
||||
(t/is (= :up (:direction a-down')))))))
|
||||
|
||||
|
||||
(t/deftest option-offset-effect
|
||||
(let [i1 cti/default-interaction
|
||||
i2 (cti/set-animation-type cti/default-interaction :slide)
|
||||
i3 (cti/set-action-type i2 :open-overlay)]
|
||||
|
||||
(t/testing "Has offset-effect"
|
||||
(t/is (not (cti/has-offset-effect? i1)))
|
||||
(t/is (cti/has-offset-effect? i2))
|
||||
(t/is (not (cti/has-offset-effect? i3)))
|
||||
(t/is (some? (-> i3 :animation :offset-effect)))) ; <- it exists but is ignored
|
||||
|
||||
(t/testing "Set offset-effect"
|
||||
(let [new-interaction (cti/set-offset-effect i2 true)]
|
||||
(t/is (= true (-> new-interaction :animation :offset-effect)))))))
|
||||
|
||||
|
||||
(t/deftest modify-interactions
|
||||
(let [i1 (cti/set-action-type cti/default-interaction :open-overlay)
|
||||
i2 (cti/set-action-type cti/default-interaction :close-overlay)
|
||||
i3 (cti/set-action-type cti/default-interaction :prev-screen)
|
||||
@@ -298,7 +538,37 @@
|
||||
(t/testing "Update interaction"
|
||||
(let [new-interactions (cti/update-interaction interactions 1 #(cti/set-action-type % :open-url))]
|
||||
(t/is (= (count new-interactions) 2))
|
||||
(t/is (= (:action-type (last new-interactions)) :open-url))))
|
||||
(t/is (= (:action-type (last new-interactions)) :open-url))))))
|
||||
|
||||
))
|
||||
|
||||
(t/deftest remap-interactions
|
||||
(let [frame1 (cpi/make-minimal-shape :frame)
|
||||
frame2 (cpi/make-minimal-shape :frame)
|
||||
frame3 (cpi/make-minimal-shape :frame)
|
||||
frame4 (cpi/make-minimal-shape :frame)
|
||||
frame5 (cpi/make-minimal-shape :frame)
|
||||
frame6 (cpi/make-minimal-shape :frame)
|
||||
|
||||
objects {(:id frame3) frame3
|
||||
(:id frame4) frame4
|
||||
(:id frame5) frame5}
|
||||
|
||||
ids-map {(:id frame1) (:id frame4)
|
||||
(:id frame2) (:id frame5)}
|
||||
|
||||
i1 (cti/set-destination cti/default-interaction (:id frame1))
|
||||
i2 (cti/set-destination cti/default-interaction (:id frame2))
|
||||
i3 (cti/set-destination cti/default-interaction (:id frame3))
|
||||
i4 (cti/set-destination cti/default-interaction nil)
|
||||
i5 (cti/set-destination cti/default-interaction (:id frame6))
|
||||
|
||||
interactions [i1 i2 i3 i4 i5]]
|
||||
|
||||
(t/testing "Remap interactions"
|
||||
(let [new-interactions (cti/remap-interactions interactions ids-map objects)]
|
||||
(t/is (= (count new-interactions) 4))
|
||||
(t/is (= (:id frame4) (:destination (get new-interactions 0))))
|
||||
(t/is (= (:id frame5) (:destination (get new-interactions 1))))
|
||||
(t/is (= (:id frame3) (:destination (get new-interactions 2))))
|
||||
(t/is (nil? (:destination (get new-interactions 3))))))))
|
||||
|
||||
|
||||
Reference in New Issue
Block a user