mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-10-23 19:49:50 +02:00
fix: mobile cursor
This commit is contained in:
1 parent
31b628049a
commit
9368d058f2
3 files changed
+16
-3
No files matched your search
@@ -0,0 +1,5 @@
|
|||||||
|
# BlitzKit 1.27.14
|
||||||
|
|
||||||
|
## Fixes
|
||||||
|
|
||||||
|
- Optimized the rendering of the shells in the Tankopedia search
|
||||||
+1
-1
@@ -1,7 +1,7 @@
|
|||||||
{
|
{
|
||||||
"name": "blitzkit",
|
"name": "blitzkit",
|
||||||
"private": true,
|
"private": true,
|
||||||
"version": "1.27.13",
|
"version": "1.27.14",
|
||||||
"description": "🎉 Tools for everything World of Tanks Blitz",
|
"description": "🎉 Tools for everything World of Tanks Blitz",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"types": "./types.d.ts",
|
"types": "./types.d.ts",
|
||||||
|
|||||||
+10
-2
@@ -25,25 +25,30 @@ export function AssaultCursor({ maxDistance, maxFakeDistance }: Props) {
|
|||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let localX = x;
|
let localX = x;
|
||||||
|
let lastX = 0;
|
||||||
|
|
||||||
function handlePointerDown(event: PointerEvent) {
|
function handlePointerDown(event: PointerEvent) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
|
lastX = event.clientX;
|
||||||
|
|
||||||
window.addEventListener('pointermove', handlePointerMove);
|
window.addEventListener('pointermove', handlePointerMove);
|
||||||
window.addEventListener('pointerup', handlePointerUp);
|
window.addEventListener('pointerup', handlePointerUp);
|
||||||
}
|
}
|
||||||
|
|
||||||
function handlePointerMove(event: PointerEvent) {
|
function handlePointerMove(event: PointerEvent) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
|
|
||||||
const parent = cursor.current?.parentElement;
|
const parent = cursor.current?.parentElement;
|
||||||
|
|
||||||
if (!parent) return;
|
if (!parent) return;
|
||||||
|
|
||||||
const width = parent.clientWidth;
|
const width = parent.clientWidth;
|
||||||
|
const movementX = event.clientX - lastX;
|
||||||
|
lastX = event.clientX;
|
||||||
|
|
||||||
setX((state) => {
|
setX((state) => {
|
||||||
localX = clamp(state + event.movementX / width, 0, 1);
|
localX = clamp(state + movementX / width, 0, 1);
|
||||||
return localX;
|
return localX;
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
@@ -62,6 +67,8 @@ export function AssaultCursor({ maxDistance, maxFakeDistance }: Props) {
|
|||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
cursor.current?.removeEventListener('pointerdown', handlePointerDown);
|
cursor.current?.removeEventListener('pointerdown', handlePointerDown);
|
||||||
|
window.removeEventListener('pointermove', handlePointerMove);
|
||||||
|
window.removeEventListener('pointerup', handlePointerUp);
|
||||||
};
|
};
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
@@ -75,6 +82,7 @@ export function AssaultCursor({ maxDistance, maxFakeDistance }: Props) {
|
|||||||
width="2pt"
|
width="2pt"
|
||||||
id="assault-cursor"
|
id="assault-cursor"
|
||||||
style={{
|
style={{
|
||||||
|
touchAction: 'none',
|
||||||
transform: 'translateX(-50%)',
|
transform: 'translateX(-50%)',
|
||||||
backgroundColor: Var('accent-11'),
|
backgroundColor: Var('accent-11'),
|
||||||
}}
|
}}
|
||||||
|
|||||||
Reference in new issue
Block a user