fix: remove auto-hide, toolbar always visible
This commit is contained in:
1 parent
8c2fe603d1
commit
b922f6d49f
1 file changed
+2
-24
@@ -121,28 +121,9 @@ export function ClientView({
|
|||||||
|
|
||||||
useEffect(() => { if (pos) posRef.current = pos; }, [pos]);
|
useEffect(() => { if (pos) posRef.current = pos; }, [pos]);
|
||||||
|
|
||||||
const [hidden, setHidden] = useState(false);
|
|
||||||
const [snapTween, setSnapTween] = useState(false);
|
const [snapTween, setSnapTween] = useState(false);
|
||||||
const SNAP = 40;
|
const SNAP = 40;
|
||||||
|
|
||||||
/* auto-hide: show on mouse activity, fade after 2s idle */
|
|
||||||
useEffect(() => {
|
|
||||||
let t: ReturnType<typeof setTimeout>;
|
|
||||||
function poke() {
|
|
||||||
setHidden(false);
|
|
||||||
clearTimeout(t);
|
|
||||||
if (!dragging) t = setTimeout(() => setHidden(true), 2000);
|
|
||||||
}
|
|
||||||
window.addEventListener("mousemove", poke);
|
|
||||||
window.addEventListener("touchstart", poke);
|
|
||||||
poke();
|
|
||||||
return () => {
|
|
||||||
window.removeEventListener("mousemove", poke);
|
|
||||||
window.removeEventListener("touchstart", poke);
|
|
||||||
clearTimeout(t);
|
|
||||||
};
|
|
||||||
}, [dragging]);
|
|
||||||
|
|
||||||
function snapPos(top: number, left: number) {
|
function snapPos(top: number, left: number) {
|
||||||
const el = toolbarRef.current;
|
const el = toolbarRef.current;
|
||||||
if (!el) return { top, left };
|
if (!el) return { top, left };
|
||||||
@@ -226,14 +207,11 @@ export function ClientView({
|
|||||||
{pos ? (
|
{pos ? (
|
||||||
<div
|
<div
|
||||||
ref={toolbarRef}
|
ref={toolbarRef}
|
||||||
onMouseEnter={() => setHidden(false)}
|
className={`fixed z-[9999] backdrop-blur-xl bg-black/30 rounded-xl border border-white/10 shadow-2xl px-1.5 py-1 select-none ${dragging ? "cursor-grabbing" : "cursor-grab"}`}
|
||||||
className={`fixed z-[9999] backdrop-blur-xl bg-black/30 rounded-xl border border-white/10 shadow-2xl px-1.5 py-1 select-none ${dragging ? "cursor-grabbing" : "cursor-grab"} ${hidden && !dragging ? "opacity-[0.08]" : "opacity-100"}`}
|
|
||||||
style={{
|
style={{
|
||||||
top: pos.top,
|
top: pos.top,
|
||||||
left: pos.left,
|
left: pos.left,
|
||||||
transitionProperty: snapTween ? "top, left, opacity" : "opacity",
|
transition: snapTween ? "top 0.18s ease-out, left 0.18s ease-out" : undefined,
|
||||||
transitionDuration: snapTween ? "0.18s, 0.18s, 0.3s" : "0.3s",
|
|
||||||
transitionTimingFunction: snapTween ? "ease-out, ease-out, ease" : "ease",
|
|
||||||
}}
|
}}
|
||||||
onMouseDown={handleMouseDown}
|
onMouseDown={handleMouseDown}
|
||||||
onTouchStart={handleTouchStart}
|
onTouchStart={handleTouchStart}
|
||||||
|
|||||||
Reference in new issue
Block a user