deckdeckgo
deckdeckgo copied to clipboard
deckgo
core: swipe and fade animation 60fps with requestAnimationFrame
Affected part of DeckDeckGo
- [X] Web Components
Feature Description
Our core components takes care of displaying the slides. The transition happening when switching slides can happens either instantly or with an animation.
This animation can either be swipe or fade.
In both cases, CSS variables are set though Javascript to apply the effects but none of these are implement with requestAnimationFrame which would enhance the quality and the smoothness of the animation to achieve 60 fps.
Use Case
I would be smoother
Getting started
git clone https://github.com/deckgo/deckdeckgo
cd deckdeckgo/core
npm i
npm run start
The animation can be set with a related attribute / property on the deckgo-deck element.
To try it out, you can modify your local deckdeckgo/core/src/index.html such as
<deckgo-deck animation="swipe">
or
<deckgo-deck animation="fade">
Code
The swipe effect finds place in the core
The fade effect happens with a Functional component so to be honest, there I am not sure how to achieve this goal. Looking forward to your inputs.
Get Started
If you need help to get started with this feature, I'll be happy to help.
Ping me: @peterpeterparker | twitter | email | slack
Hi @peterpeterparker , This looks really interesting, I would love to explore more and contribute on the same :)
@Harshi7016 are you working on that one or should I un-assign you the issue?
Hi @peterpeterparker , Shall I update you about my progress in 3 days, I am extremely sorry , I got struck in other prs and forgot to update... Extremely sorry for this delay If you are ok I will be updating you soon Sorry again
no worries about delay @Harshi7016, there is no rush. I was interesting about the status to get to know if someone should take over or not, so all cool. Ping me when you've got time, thx.