Timeline improvements for smallest frames and zooming
Nobody has claimed this yet.
Assessment
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Newbie friendliness
- 52/100
- Issue type
- Feature
- Clarity
- Mostly clear
- Activity status
- Active
- Tech stack
- javascript
- Domain
- frontend
Research direction
No files or tests are named. Start by locating the timeline, frame, tween, and zoom interaction entry points in the JavaScript code, then reproduce the listed problems at the smallest zoom levels. Done means the seven numbered behaviors are addressed without disrupting ordinary frame selection, stretching, tween manipulation, or timeline navigation.
Written by the indexing model from the issue text.
Description
Is your feature request related to a problem? Please describe.
There are a variety of things about the timeline that I think we can improve, particularly when it is zoomed out.
- The plus sign overflows the thin frame.
- The frame numbers overflow to the left of the frame they're at.
- The frame bubbles are still a bit too big.
- The tween keyframe is weirdly circular (probably corner radius shenanigans, I'm guessing), and the arrow start/end are very far from the diamonds.
- Dragging the tween diamond takes precedence over stretching the frame. This makes it very hard to stretch the frame. Also, the tween diamond's preview shadow thingy is larger than it should be.
https://github.com/user-attachments/assets/34ccdf1f-4c1f-4c0b-8c53-f577e580dd66
- We made it so that for a zoomed-enough-out timeline, a frame can only be stretched if it is selected. I think the current implementation might be a bit too strict. If a frame is stretched, the hover target is definitely good enough to allow stretching the frame.
- When zooming in and out, you often lose your place in the timeline because the stretch's origin is at the very left. (So, zooming in makes you go backwards in frames as everything gets pushed right)
Describe the solution you'd like
I think it'd be reasonable to slightly increase the minimum frame width, to give just a bit more breathing room.
For everything else:
- Remove (or shrink) the plus sign if the frame is too thin. The highlight might be good enough, so removing might be okay.
- Force the frame number to sit to the right of the line. (But let's be careful that it doesn't abruptly snap when you hit a threshold)
- Shrink the bubbles.
- Shrink the corner radius as the keyframe gets smaller, and shrink the margin for the arrows.
- Favor stretching the frame over selecting/dragging the tween.
- If a frame is a certain number of pixels wide, the frame is actively selected, or a tween on the frame is actively selected, the frame can be stretched.
- Stretch relative to the middle of the timeline (or maybe the cursor, or maybe maybe the playhead if it's visible - I don't know what feels good).
- Dominant language
- JavaScript
- Stars
- 51
- Forks
- 20
- Avg merge
- 14d 12h
- Merged PRs (30d)
- 3
Contributor guide
No contributing guide indexed for this repository
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from Candlestickers/Candlestick
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
Candlestickers/Candlestick#203 · 1 comment ·
-
bug
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
Candlestickers/Candlestick#142 ·
-
`Wick.Script` class Openenhancement
Difficulty 5/5 Over a week Newbie friendliness 35/100
Candlestickers/Candlestick#215 · 2 comments ·
-
bug
Difficulty 3/5 1-2 days Newbie friendliness 65/100
Candlestickers/Candlestick#212 ·
-
enhancement
Difficulty 5/5 Over a week Newbie friendliness 32/100
Candlestickers/Candlestick#207 · 7 comments ·
All issues in Candlestickers/Candlestick
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 88/100
HarperFast/skills#96 ·
-
[Block] Latest Posts [Type] Bug
Difficulty 2/5 1-3 hours Newbie friendliness 76/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Automattic/studio#4908 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 74/100
-
Difficulty 2/5 1-3 hours Newbie friendliness 86/100
sugarlabs/musicblocks#8847 ·