mirror of
https://github.com/pewdiepie-archdaemon/odysseus.git
synced 2026-10-16 11:52:25 +02:00
pewdiepie-archdaemonandClaude Opus 5.5
5fac693c1c
Photoshop-parity editor client: layers, selection/masking, brushes,
smart filters, LUT import, Quick Edit, mobile gestures, workspaces,
batch operations, and the service-worker versioning (v978->v1006).
Source: vendor/photocraft (ad1cff44) photo-editor client files, merged
onto upstream/dev (a8c147b2). Conflict resolution documented in
pr_work/A_conflicts.md; editor files taken from vendor/photocraft
(upstream's editor is an earlier snapshot of the same feature).
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
42 lines
1.5 KiB
JavaScript
42 lines
1.5 KiB
JavaScript
// Edge-fade affordance for horizontally scrolling bars (audit #5).
|
|
//
|
|
// On phones the editor's menu row (.ge-topbar-left) and tool rail (.ge-toolbar)
|
|
// scroll sideways with their scrollbars hidden, so they look static and people
|
|
// miss the off-screen File…Help menus and tools. This mirrors the doc-tab
|
|
// behaviour (static/js/document.js updateArrowVisibility): toggle is-at-left /
|
|
// is-at-right so the CSS mask gradient only fades the side that still has
|
|
// content to scroll to.
|
|
export function attachScrollAffordance(el) {
|
|
if (!el) return () => {};
|
|
if (el.__geScrollAffordance) return el.__geScrollAffordance;
|
|
el.classList.add('ge-scroll-fade');
|
|
|
|
const update = () => {
|
|
const max = el.scrollWidth - el.clientWidth;
|
|
const atLeft = el.scrollLeft <= 1;
|
|
const atRight = el.scrollLeft >= max - 1;
|
|
el.classList.toggle('is-at-left', atLeft);
|
|
el.classList.toggle('is-at-right', atRight);
|
|
};
|
|
|
|
el.addEventListener('scroll', update, { passive: true });
|
|
window.addEventListener('resize', update);
|
|
let ro = null;
|
|
if (typeof ResizeObserver !== 'undefined') {
|
|
ro = new ResizeObserver(update);
|
|
ro.observe(el);
|
|
}
|
|
if (typeof requestAnimationFrame === 'function') requestAnimationFrame(update);
|
|
else update();
|
|
|
|
const detach = () => {
|
|
el.removeEventListener('scroll', update);
|
|
window.removeEventListener('resize', update);
|
|
if (ro) ro.disconnect();
|
|
el.classList.remove('ge-scroll-fade', 'is-at-left', 'is-at-right');
|
|
delete el.__geScrollAffordance;
|
|
};
|
|
el.__geScrollAffordance = detach;
|
|
return detach;
|
|
}
|