Glide the asset and object lists and scroll past their end (#309)
The asset panel stopped with its last group flush on the bottom edge, and both lists on the left jumped on every wheel step while the tabs next to them already zoom with a transition. - ScrollContainer gets tailSpace, empty room always kept below the content. Content that fits only without it scrolls by the rest. The content is made that much taller, so clicks and the context menu on that room work as on any empty part of the list. - The asset panel keeps six rows of it. The other lists keep none. - ScrollContainer gets wheelStep, which by default scrolls at once. - scrollTween() in viewTween.ts hands the wheel step to an axisTween. The duration is the zoom transition's from the General settings, quick steps add up and stop at the end of the list, and dragging the bar or a jump to a row ends the glide where it stands. - Only the asset panel and Scene objects use it. Inspector, menus and the console still jump. - Wiki: Concepts describes the glide and the room below the assets. Not checked in the browser by me. The user picked the six rows and asked for the glide after trying the room below the list. Tests: - Unit scroll-container: 10 tests (3 new for tailSpace). - Unit view-tween: 4 new with a fake clock (glide lands on target, quick steps add up and stop at the end, a jump ends it, 0 ms jumps). - Gate on melektaus-atx: CHECK EXIT 0, 299 files, 4593 tests (4586 before). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
322fc39d16
commit
be41b1f0d7
6 files changed
+133
-5
No files matched your search
@@ -37,6 +37,36 @@ describe('a scroll container told its content changed', () => {
|
||||
});
|
||||
});
|
||||
|
||||
describe('a scroll container with tail space', () => {
|
||||
const filled = (viewportH: number, rowCount: number) => {
|
||||
const scroll = new ScrollContainer();
|
||||
scroll.tailSpace = 40;
|
||||
scroll.resize(200, viewportH);
|
||||
const rows = new VStack();
|
||||
for (let i = 0; i < rowCount; i++) rows.add(new Spacer(20));
|
||||
scroll.setContent(rows);
|
||||
return { scroll, rows };
|
||||
};
|
||||
|
||||
it('scrolls that far past the end of content that scrolls', () => {
|
||||
const { scroll, rows } = filled(50, 3);
|
||||
expect(rows.h).toBe(100);
|
||||
expect(scroll.maxScroll).toBe(50);
|
||||
});
|
||||
|
||||
it('keeps it below content that fits only without it', () => {
|
||||
const { scroll, rows } = filled(80, 3);
|
||||
expect(rows.h).toBe(100);
|
||||
expect(scroll.maxScroll).toBe(20);
|
||||
});
|
||||
|
||||
it('adds nothing to scroll when content and tail fit', () => {
|
||||
const { scroll, rows } = filled(300, 3);
|
||||
expect(rows.h).toBe(300);
|
||||
expect(scroll.maxScroll).toBe(0);
|
||||
});
|
||||
});
|
||||
|
||||
describe('a scroll container and its scrollbar', () => {
|
||||
const filled = (viewportH: number, rowCount: number) => {
|
||||
const scroll = new ScrollContainer();
|
||||
|
||||
Reference in new issue
Block a user