mirror of
https://github.com/pewdiepie-archdaemon/odysseus.git
synced 2026-10-28 08:42:24 +01:00
feat(photo-editor): Ajax Image Editor client (Photoshop-parity tools)
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>
This commit is contained in:
co-authored by
Claude Opus 5.5
parent
c74f475679
commit
5fac693c1c
@@ -0,0 +1,41 @@
|
||||
// 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;
|
||||
}
|
||||
Reference in New Issue
Block a user