fix tilt settings

app/AppContext.tsx

@@ -63,14 +63,15 @@ export function AppProvider({ children }: { children: ReactNode }) {
 
 	const { dmID } = gameData;
 	const isDM = !!dmID;
+	const settings = { ...gameData.settings, ...localSettings };
 
 	const appInterface = {
 		gameData,
 		isDM,
 		noGame,
 		selectCardIndex,
-		settings: { ...gameData.settings, ...localSettings },
-		tilts: reduceTilts(gameData, localTilt),
+		settings,
+		tilts: reduceTilts(gameData, localTilt, settings),
 		emitFlip,
 		emitSettings,
 		emitRedraw,

components/TiltCard.tsx

@@ -73,8 +73,6 @@ export default function TiltCard({
 	}, thirtyFPS);
 
 	const handleTouchMove = throttle((e: React.TouchEvent) => {
-		e.stopPropagation();
-
 		const card = cardRef.current;
 		const touch = e.touches[0];
 

tools/reduceTilts.ts

@@ -1,5 +1,5 @@
-import { log, validTilt } from '@/tools';
-import { GameUpdate, Tilt } from '@/types';
+import { validTilt } from '@/tools';
+import { GameUpdate, Settings, Tilt } from '@/types';
 
 const combineTilts = (tilts: Tilt[]) =>
 	tilts.reduce(
@@ -13,13 +13,15 @@ const combineTilts = (tilts: Tilt[]) =>
 		{ pX: 0, pY: 0, rX: 0, rY: 0, count: 0 },
 	);
 
-export function reduceTilts(gameData: GameUpdate, localTilt: Tilt[]): Tilt[] {
+export function reduceTilts(
+	gameData: GameUpdate,
+	localTilt: Tilt[],
+	{ tilt, remoteTilt }: Settings,
+): Tilt[] {
 	const remoteTilts = gameData.tilts;
-	const tiltEnabled = gameData.settings.tilt;
-	const remoteTiltEnabled = gameData.settings.remoteTilt;
 
-	if (!tiltEnabled) return [];
-	if (!remoteTiltEnabled) return Array.from({ length: 5 }, (_, i) => localTilt[i]);
+	if (!tilt) return [];
+	if (!remoteTilt) return localTilt;
 
 	return Array.from({ length: 5 }, (_, i) => (localTilt[i] ? [localTilt[i]] : []))
 		.map((cardTilts, cardIndex) => [...remoteTilts[cardIndex], ...cardTilts])

tools/validTilt.ts

@@ -1,4 +1,9 @@
 import { Tilt } from '@/types';
 
-export const validTilt = ({ percentX, percentY, rotateX, rotateY }: Tilt) =>
-	percentX >= 0 && percentY >= 0 && !!rotateX && !!rotateY;
+export const validTilt = (tilt: Tilt) => {
+	if (!tilt) return false;
+
+	const { percentX, percentY, rotateX, rotateY } = tilt;
+
+	return percentX >= 0 && percentY >= 0 && !!rotateX && !!rotateY;
+};