Add Erdős discrepancy interactive
Introduce a full Erdős Discrepancy interactive (Prisoner's Walk) with sequence builder, walk visualization, heatmap, and educational panels. Adds new ErdosDiscrepancyPuzzle component, page wrapper, routing, and index/puzzles page entries. Also wires up SocialShare support and an MVP route /puzzles/erdos-discrepancy. X-Lovable-Edit-ID: edt-656659b7-ea52-4d0d-880b-ae0c70666491
This commit is contained in:
gpt-engineer-app[bot]
commit
dc8300f358
5 changed files with 939 additions and 0 deletions
|
|
@ -67,6 +67,7 @@ import BagchalGamePage from './pages/BagchalGamePage';
|
||||||
import AscDescGridPuzzlePage from './pages/AscDescGridPuzzlePage';
|
import AscDescGridPuzzlePage from './pages/AscDescGridPuzzlePage';
|
||||||
import EternalDominationGamePage from './pages/EternalDominationGamePage';
|
import EternalDominationGamePage from './pages/EternalDominationGamePage';
|
||||||
import LadybugClockPuzzlePage from './pages/LadybugClockPuzzlePage';
|
import LadybugClockPuzzlePage from './pages/LadybugClockPuzzlePage';
|
||||||
|
import ErdosDiscrepancyPuzzlePage from './pages/ErdosDiscrepancyPuzzlePage';
|
||||||
|
|
||||||
const queryClient = new QueryClient();
|
const queryClient = new QueryClient();
|
||||||
|
|
||||||
|
|
@ -144,6 +145,7 @@ const App = () => (
|
||||||
<Route path="/puzzles/domino-retiling" element={<DominoRetilingPuzzlePage />} />
|
<Route path="/puzzles/domino-retiling" element={<DominoRetilingPuzzlePage />} />
|
||||||
<Route path="/puzzles/asc-desc-grid" element={<AscDescGridPuzzlePage />} />
|
<Route path="/puzzles/asc-desc-grid" element={<AscDescGridPuzzlePage />} />
|
||||||
<Route path="/puzzles/ladybug-clock" element={<LadybugClockPuzzlePage />} />
|
<Route path="/puzzles/ladybug-clock" element={<LadybugClockPuzzlePage />} />
|
||||||
|
<Route path="/puzzles/erdos-discrepancy" element={<ErdosDiscrepancyPuzzlePage />} />
|
||||||
<Route path="/discrete-math/foundations/zeckendorf" element={<ZeckendorfGamePage />} />
|
<Route path="/discrete-math/foundations/zeckendorf" element={<ZeckendorfGamePage />} />
|
||||||
<Route path="/discrete-math/foundations/zeckendorf-search" element={<ZeckendorfSearchTrickPage />} />
|
<Route path="/discrete-math/foundations/zeckendorf-search" element={<ZeckendorfSearchTrickPage />} />
|
||||||
<Route path="/discrete-math/foundations/rules-of-inference" element={<RulesOfInferencePlaygroundPage />} />
|
<Route path="/discrete-math/foundations/rules-of-inference" element={<RulesOfInferencePlaygroundPage />} />
|
||||||
|
|
|
||||||
902
src/components/ErdosDiscrepancyPuzzle.tsx
Normal file
902
src/components/ErdosDiscrepancyPuzzle.tsx
Normal file
|
|
@ -0,0 +1,902 @@
|
||||||
|
import React, { useState, useEffect, useCallback, useMemo } from 'react';
|
||||||
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
|
||||||
|
import { Button } from '@/components/ui/button';
|
||||||
|
import { Badge } from '@/components/ui/badge';
|
||||||
|
import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert';
|
||||||
|
import { Slider } from '@/components/ui/slider';
|
||||||
|
import {
|
||||||
|
Play, RotateCcw, Info, ChevronDown, ChevronUp,
|
||||||
|
ArrowLeft, ArrowRight, Skull, AlertTriangle,
|
||||||
|
BookOpen, Zap, Eye, Grid3X3, TrendingUp, Pause,
|
||||||
|
Volume2, VolumeX, Target, Trophy
|
||||||
|
} from 'lucide-react';
|
||||||
|
import SocialShare from '@/components/SocialShare';
|
||||||
|
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
|
||||||
|
|
||||||
|
interface ErdosDiscrepancyPuzzleProps {
|
||||||
|
showSocialShare?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
type GamePhase = 'intro' | 'writing' | 'captor-reveal' | 'walking' | 'fallen' | 'survived';
|
||||||
|
type Direction = 1 | -1 | null;
|
||||||
|
|
||||||
|
interface DiscrepancyResult {
|
||||||
|
d: number;
|
||||||
|
k: number;
|
||||||
|
sum: number;
|
||||||
|
positions: number[];
|
||||||
|
}
|
||||||
|
|
||||||
|
const ErdosDiscrepancyPuzzle: React.FC<ErdosDiscrepancyPuzzleProps> = ({ showSocialShare = false }) => {
|
||||||
|
// Core game state
|
||||||
|
const [sequence, setSequence] = useState<Direction[]>([]);
|
||||||
|
const [discrepancyBound, setDiscrepancyBound] = useState(1);
|
||||||
|
const [gamePhase, setGamePhase] = useState<GamePhase>('intro');
|
||||||
|
const [showRules, setShowRules] = useState(false);
|
||||||
|
|
||||||
|
// Walk visualization state
|
||||||
|
const [selectedD, setSelectedD] = useState(1);
|
||||||
|
const [walkPosition, setWalkPosition] = useState(0);
|
||||||
|
const [walkStep, setWalkStep] = useState(0);
|
||||||
|
const [isWalking, setIsWalking] = useState(false);
|
||||||
|
const [walkSpeed, setWalkSpeed] = useState(500);
|
||||||
|
|
||||||
|
// Prisoner's Walk story mode
|
||||||
|
const [captorChosenD, setCaptorChosenD] = useState<number | null>(null);
|
||||||
|
const [prisonerPosition, setPrisonerPosition] = useState(0);
|
||||||
|
const [prisonerStep, setPrisonerStep] = useState(0);
|
||||||
|
|
||||||
|
// Heatmap state
|
||||||
|
const [hoveredCell, setHoveredCell] = useState<{d: number, k: number} | null>(null);
|
||||||
|
const [highlightedSubsequence, setHighlightedSubsequence] = useState<number[]>([]);
|
||||||
|
|
||||||
|
// Best score tracking
|
||||||
|
const [bestLength, setBestLength] = useState<number | null>(null);
|
||||||
|
|
||||||
|
// Load best score from localStorage
|
||||||
|
useEffect(() => {
|
||||||
|
const saved = localStorage.getItem(`erdos-best-length-c${discrepancyBound}`);
|
||||||
|
if (saved) {
|
||||||
|
setBestLength(parseInt(saved));
|
||||||
|
}
|
||||||
|
}, [discrepancyBound]);
|
||||||
|
|
||||||
|
// Calculate all discrepancies for current sequence
|
||||||
|
const allDiscrepancies = useMemo((): DiscrepancyResult[] => {
|
||||||
|
if (sequence.length === 0) return [];
|
||||||
|
|
||||||
|
const results: DiscrepancyResult[] = [];
|
||||||
|
const n = sequence.length;
|
||||||
|
|
||||||
|
for (let d = 1; d <= n; d++) {
|
||||||
|
let sum = 0;
|
||||||
|
const positions: number[] = [];
|
||||||
|
|
||||||
|
for (let k = 1; k * d <= n; k++) {
|
||||||
|
const pos = k * d - 1; // 0-indexed
|
||||||
|
if (sequence[pos] !== null) {
|
||||||
|
sum += sequence[pos]!;
|
||||||
|
positions.push(k * d);
|
||||||
|
results.push({
|
||||||
|
d,
|
||||||
|
k,
|
||||||
|
sum,
|
||||||
|
positions: [...positions]
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return results;
|
||||||
|
}, [sequence]);
|
||||||
|
|
||||||
|
// Find maximum discrepancy
|
||||||
|
const maxDiscrepancy = useMemo(() => {
|
||||||
|
if (allDiscrepancies.length === 0) return { value: 0, result: null };
|
||||||
|
|
||||||
|
let maxAbs = 0;
|
||||||
|
let maxResult: DiscrepancyResult | null = null;
|
||||||
|
|
||||||
|
for (const result of allDiscrepancies) {
|
||||||
|
if (Math.abs(result.sum) > maxAbs) {
|
||||||
|
maxAbs = Math.abs(result.sum);
|
||||||
|
maxResult = result;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return { value: maxAbs, result: maxResult };
|
||||||
|
}, [allDiscrepancies]);
|
||||||
|
|
||||||
|
// Check if current sequence violates bound
|
||||||
|
const hasViolation = maxDiscrepancy.value > discrepancyBound;
|
||||||
|
|
||||||
|
// Find worst step size for captor
|
||||||
|
const findWorstD = useCallback((): number => {
|
||||||
|
let worstD = 1;
|
||||||
|
let worstDiscrepancy = 0;
|
||||||
|
|
||||||
|
for (const result of allDiscrepancies) {
|
||||||
|
if (Math.abs(result.sum) > worstDiscrepancy) {
|
||||||
|
worstDiscrepancy = Math.abs(result.sum);
|
||||||
|
worstD = result.d;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return worstD;
|
||||||
|
}, [allDiscrepancies]);
|
||||||
|
|
||||||
|
// Get discrepancy for specific d,k
|
||||||
|
const getDiscrepancy = (d: number, k: number): number | null => {
|
||||||
|
const result = allDiscrepancies.find(r => r.d === d && r.k === k);
|
||||||
|
return result ? result.sum : null;
|
||||||
|
};
|
||||||
|
|
||||||
|
// Toggle sequence value
|
||||||
|
const togglePosition = (index: number) => {
|
||||||
|
if (gamePhase !== 'writing') return;
|
||||||
|
|
||||||
|
setSequence(prev => {
|
||||||
|
const newSeq = [...prev];
|
||||||
|
if (newSeq[index] === null) {
|
||||||
|
newSeq[index] = 1;
|
||||||
|
} else if (newSeq[index] === 1) {
|
||||||
|
newSeq[index] = -1;
|
||||||
|
} else {
|
||||||
|
newSeq[index] = 1;
|
||||||
|
}
|
||||||
|
return newSeq;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Add new position to sequence
|
||||||
|
const addPosition = () => {
|
||||||
|
if (gamePhase !== 'writing') return;
|
||||||
|
setSequence(prev => [...prev, null]);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Start the game
|
||||||
|
const startGame = () => {
|
||||||
|
setSequence([null, null, null, null, null]);
|
||||||
|
setGamePhase('writing');
|
||||||
|
setWalkPosition(0);
|
||||||
|
setWalkStep(0);
|
||||||
|
setPrisonerPosition(0);
|
||||||
|
setPrisonerStep(0);
|
||||||
|
setCaptorChosenD(null);
|
||||||
|
setHighlightedSubsequence([]);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Reset the game
|
||||||
|
const resetGame = () => {
|
||||||
|
setSequence([]);
|
||||||
|
setGamePhase('intro');
|
||||||
|
setWalkPosition(0);
|
||||||
|
setWalkStep(0);
|
||||||
|
setIsWalking(false);
|
||||||
|
setPrisonerPosition(0);
|
||||||
|
setPrisonerStep(0);
|
||||||
|
setCaptorChosenD(null);
|
||||||
|
setHighlightedSubsequence([]);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Handle captor reveal (Prisoner's Walk mode)
|
||||||
|
const revealCaptor = () => {
|
||||||
|
const worstD = findWorstD();
|
||||||
|
setCaptorChosenD(worstD);
|
||||||
|
setGamePhase('captor-reveal');
|
||||||
|
setPrisonerPosition(0);
|
||||||
|
setPrisonerStep(0);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Start prisoner walking
|
||||||
|
const startPrisonerWalk = () => {
|
||||||
|
if (captorChosenD === null) return;
|
||||||
|
setGamePhase('walking');
|
||||||
|
setPrisonerPosition(0);
|
||||||
|
setPrisonerStep(0);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Prisoner walk animation
|
||||||
|
useEffect(() => {
|
||||||
|
if (gamePhase !== 'walking' || captorChosenD === null) return;
|
||||||
|
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
setPrisonerStep(prev => {
|
||||||
|
const nextStep = prev + 1;
|
||||||
|
const posIndex = nextStep * captorChosenD - 1;
|
||||||
|
|
||||||
|
if (posIndex >= sequence.length || sequence[posIndex] === null) {
|
||||||
|
// Sequence ended without falling
|
||||||
|
setGamePhase('survived');
|
||||||
|
clearInterval(interval);
|
||||||
|
|
||||||
|
// Save best score
|
||||||
|
const validLength = sequence.filter(s => s !== null).length;
|
||||||
|
if (!bestLength || validLength > bestLength) {
|
||||||
|
setBestLength(validLength);
|
||||||
|
localStorage.setItem(`erdos-best-length-c${discrepancyBound}`, validLength.toString());
|
||||||
|
}
|
||||||
|
|
||||||
|
return prev;
|
||||||
|
}
|
||||||
|
|
||||||
|
const newPosition = prisonerPosition + sequence[posIndex]!;
|
||||||
|
setPrisonerPosition(newPosition);
|
||||||
|
|
||||||
|
if (Math.abs(newPosition) > discrepancyBound) {
|
||||||
|
setGamePhase('fallen');
|
||||||
|
clearInterval(interval);
|
||||||
|
return nextStep;
|
||||||
|
}
|
||||||
|
|
||||||
|
return nextStep;
|
||||||
|
});
|
||||||
|
}, walkSpeed);
|
||||||
|
|
||||||
|
return () => clearInterval(interval);
|
||||||
|
}, [gamePhase, captorChosenD, sequence, prisonerPosition, discrepancyBound, walkSpeed, bestLength]);
|
||||||
|
|
||||||
|
// Manual walk control
|
||||||
|
const walkSubsequence = () => {
|
||||||
|
if (isWalking) {
|
||||||
|
setIsWalking(false);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
setWalkPosition(0);
|
||||||
|
setWalkStep(0);
|
||||||
|
setIsWalking(true);
|
||||||
|
};
|
||||||
|
|
||||||
|
// Walk animation effect
|
||||||
|
useEffect(() => {
|
||||||
|
if (!isWalking) return;
|
||||||
|
|
||||||
|
const interval = setInterval(() => {
|
||||||
|
setWalkStep(prev => {
|
||||||
|
const nextStep = prev + 1;
|
||||||
|
const posIndex = nextStep * selectedD - 1;
|
||||||
|
|
||||||
|
if (posIndex >= sequence.length || sequence[posIndex] === null) {
|
||||||
|
setIsWalking(false);
|
||||||
|
return prev;
|
||||||
|
}
|
||||||
|
|
||||||
|
setWalkPosition(current => current + sequence[posIndex]!);
|
||||||
|
return nextStep;
|
||||||
|
});
|
||||||
|
}, walkSpeed);
|
||||||
|
|
||||||
|
return () => clearInterval(interval);
|
||||||
|
}, [isWalking, selectedD, sequence, walkSpeed]);
|
||||||
|
|
||||||
|
// Get color for heatmap cell
|
||||||
|
const getHeatmapColor = (discrepancy: number | null): string => {
|
||||||
|
if (discrepancy === null) return 'bg-muted/30';
|
||||||
|
|
||||||
|
const absVal = Math.abs(discrepancy);
|
||||||
|
if (absVal > discrepancyBound) {
|
||||||
|
return 'bg-destructive/80 text-destructive-foreground';
|
||||||
|
}
|
||||||
|
if (absVal === discrepancyBound) {
|
||||||
|
return 'bg-amber-500/70 text-white';
|
||||||
|
}
|
||||||
|
if (absVal === 0) {
|
||||||
|
return 'bg-emerald-500/50 text-emerald-900 dark:text-emerald-100';
|
||||||
|
}
|
||||||
|
|
||||||
|
const intensity = absVal / discrepancyBound;
|
||||||
|
if (intensity < 0.5) {
|
||||||
|
return 'bg-emerald-400/40 text-emerald-900 dark:text-emerald-100';
|
||||||
|
}
|
||||||
|
return 'bg-amber-400/50 text-amber-900 dark:text-amber-100';
|
||||||
|
};
|
||||||
|
|
||||||
|
// Max valid k for given d
|
||||||
|
const maxK = (d: number) => Math.floor(sequence.length / d);
|
||||||
|
|
||||||
|
// Highlighted positions for selected d
|
||||||
|
const selectedPositions = useMemo(() => {
|
||||||
|
const positions: number[] = [];
|
||||||
|
for (let k = 1; k * selectedD <= sequence.length; k++) {
|
||||||
|
positions.push(k * selectedD);
|
||||||
|
}
|
||||||
|
return positions;
|
||||||
|
}, [selectedD, sequence.length]);
|
||||||
|
|
||||||
|
// Get fill status of sequence
|
||||||
|
const filledCount = sequence.filter(s => s !== null).length;
|
||||||
|
const allFilled = filledCount === sequence.length && sequence.length > 0;
|
||||||
|
|
||||||
|
// Known optimal sequences
|
||||||
|
const optimalSequences: Record<number, Direction[]> = {
|
||||||
|
1: [1, 1, -1, 1, -1, -1, -1, 1, 1, 1, -1], // One of the optimal 11-length sequences for C=1
|
||||||
|
};
|
||||||
|
|
||||||
|
const loadOptimalSequence = () => {
|
||||||
|
const optimal = optimalSequences[discrepancyBound];
|
||||||
|
if (optimal) {
|
||||||
|
setSequence([...optimal]);
|
||||||
|
setGamePhase('writing');
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="space-y-6">
|
||||||
|
{/* Header */}
|
||||||
|
<div className="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4">
|
||||||
|
<div>
|
||||||
|
<h1 className="text-2xl sm:text-3xl font-bold text-foreground">
|
||||||
|
The Erdős Discrepancy Problem
|
||||||
|
</h1>
|
||||||
|
<p className="text-muted-foreground mt-1">
|
||||||
|
Can you write instructions to survive the tunnel forever?
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
size="sm"
|
||||||
|
onClick={() => setShowRules(!showRules)}
|
||||||
|
>
|
||||||
|
{showRules ? <ChevronUp className="w-4 h-4 mr-1" /> : <Info className="w-4 h-4 mr-1" />}
|
||||||
|
{showRules ? 'Hide' : 'Rules'}
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Rules Panel */}
|
||||||
|
{showRules && (
|
||||||
|
<Card className="bg-muted/30">
|
||||||
|
<CardContent className="pt-4">
|
||||||
|
<div className="grid md:grid-cols-2 gap-6">
|
||||||
|
<div>
|
||||||
|
<h3 className="font-semibold text-foreground mb-2 flex items-center gap-2">
|
||||||
|
<Skull className="w-4 h-4" /> The Prisoner's Dilemma
|
||||||
|
</h3>
|
||||||
|
<p className="text-sm text-muted-foreground mb-2">
|
||||||
|
You're trapped in a tunnel with a <span className="text-destructive font-semibold">deadly cliff {discrepancyBound} step{discrepancyBound > 1 ? 's' : ''} to your LEFT</span> and
|
||||||
|
a <span className="text-destructive font-semibold">pit of vipers {discrepancyBound} step{discrepancyBound > 1 ? 's' : ''} to your RIGHT</span>.
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-muted-foreground mb-2">
|
||||||
|
Write a list of instructions: each is either <span className="text-primary font-semibold">LEFT</span> or <span className="text-blue-500 font-semibold">RIGHT</span>.
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
The evil captor then picks a step size <strong>d</strong> and you follow every d-th instruction.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<h3 className="font-semibold text-foreground mb-2 flex items-center gap-2">
|
||||||
|
<AlertTriangle className="w-4 h-4" /> The Impossible Task
|
||||||
|
</h3>
|
||||||
|
<p className="text-sm text-muted-foreground mb-2">
|
||||||
|
<strong>C = 1:</strong> Maximum possible sequence length is <strong>11</strong>
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-muted-foreground mb-2">
|
||||||
|
<strong>C = 2:</strong> Maximum possible sequence length is <strong>1,160</strong>
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Terence Tao proved in 2015: <em>No infinite sequence can survive!</em>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Game Phase: Intro */}
|
||||||
|
{gamePhase === 'intro' && (
|
||||||
|
<Card className="border-2 border-dashed">
|
||||||
|
<CardContent className="py-12 text-center">
|
||||||
|
<div className="max-w-lg mx-auto">
|
||||||
|
<Skull className="w-16 h-16 mx-auto text-muted-foreground mb-4" />
|
||||||
|
<h2 className="text-2xl font-bold mb-4">The Prisoner's Walk</h2>
|
||||||
|
<p className="text-muted-foreground mb-6">
|
||||||
|
You wake up in a dark tunnel. There's a cliff to your left and vipers to your right.
|
||||||
|
Your captor demands you write a sequence of LEFT/RIGHT instructions...
|
||||||
|
but they get to choose which instructions you follow.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="mb-6">
|
||||||
|
<label className="text-sm font-medium mb-2 block">
|
||||||
|
Discrepancy Bound (C): {discrepancyBound}
|
||||||
|
</label>
|
||||||
|
<div className="flex items-center gap-4 max-w-xs mx-auto">
|
||||||
|
<span className="text-xs">1</span>
|
||||||
|
<Slider
|
||||||
|
value={[discrepancyBound]}
|
||||||
|
onValueChange={(v) => setDiscrepancyBound(v[0])}
|
||||||
|
min={1}
|
||||||
|
max={3}
|
||||||
|
step={1}
|
||||||
|
className="flex-1"
|
||||||
|
/>
|
||||||
|
<span className="text-xs">3</span>
|
||||||
|
</div>
|
||||||
|
<p className="text-xs text-muted-foreground mt-2">
|
||||||
|
C=1: Max 11 steps | C=2: Max 1,160 steps | C=3: Unknown (very large)
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex gap-3 justify-center">
|
||||||
|
<Button onClick={startGame} size="lg">
|
||||||
|
<Play className="w-4 h-4 mr-2" />
|
||||||
|
Start Writing
|
||||||
|
</Button>
|
||||||
|
{discrepancyBound === 1 && (
|
||||||
|
<Button variant="outline" onClick={loadOptimalSequence} size="lg">
|
||||||
|
<Trophy className="w-4 h-4 mr-2" />
|
||||||
|
Load Optimal (11)
|
||||||
|
</Button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{bestLength && (
|
||||||
|
<p className="text-sm text-muted-foreground mt-4">
|
||||||
|
Your best: <strong>{bestLength}</strong> steps with C={discrepancyBound}
|
||||||
|
</p>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Main Game UI */}
|
||||||
|
{gamePhase !== 'intro' && (
|
||||||
|
<div className="space-y-6">
|
||||||
|
{/* Status Bar */}
|
||||||
|
<div className="flex flex-wrap gap-3 items-center">
|
||||||
|
<Badge variant="outline" className="text-sm">
|
||||||
|
Length: {sequence.length}
|
||||||
|
</Badge>
|
||||||
|
<Badge variant="outline" className="text-sm">
|
||||||
|
Filled: {filledCount}/{sequence.length}
|
||||||
|
</Badge>
|
||||||
|
<Badge
|
||||||
|
variant={hasViolation ? "destructive" : maxDiscrepancy.value === discrepancyBound ? "secondary" : "outline"}
|
||||||
|
className="text-sm"
|
||||||
|
>
|
||||||
|
Max Discrepancy: {maxDiscrepancy.value}
|
||||||
|
{maxDiscrepancy.result && ` (d=${maxDiscrepancy.result.d}, k=${maxDiscrepancy.result.k})`}
|
||||||
|
</Badge>
|
||||||
|
<Badge variant="outline" className="text-sm">
|
||||||
|
Bound: C = {discrepancyBound}
|
||||||
|
</Badge>
|
||||||
|
{bestLength && (
|
||||||
|
<Badge variant="secondary" className="text-sm">
|
||||||
|
<Trophy className="w-3 h-3 mr-1" />
|
||||||
|
Best: {bestLength}
|
||||||
|
</Badge>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Violation Alert */}
|
||||||
|
{hasViolation && gamePhase === 'writing' && (
|
||||||
|
<Alert variant="destructive">
|
||||||
|
<AlertTriangle className="h-4 w-4" />
|
||||||
|
<AlertTitle>Bound Exceeded!</AlertTitle>
|
||||||
|
<AlertDescription>
|
||||||
|
The subsequence with d={maxDiscrepancy.result?.d}, k={maxDiscrepancy.result?.k} has
|
||||||
|
discrepancy {maxDiscrepancy.value}, which exceeds your bound of {discrepancyBound}.
|
||||||
|
</AlertDescription>
|
||||||
|
</Alert>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<Tabs defaultValue="sequence" className="w-full">
|
||||||
|
<TabsList className="grid w-full grid-cols-3">
|
||||||
|
<TabsTrigger value="sequence" className="flex items-center gap-1">
|
||||||
|
<Target className="w-4 h-4" />
|
||||||
|
<span className="hidden sm:inline">Sequence</span>
|
||||||
|
</TabsTrigger>
|
||||||
|
<TabsTrigger value="walk" className="flex items-center gap-1">
|
||||||
|
<TrendingUp className="w-4 h-4" />
|
||||||
|
<span className="hidden sm:inline">Walk</span>
|
||||||
|
</TabsTrigger>
|
||||||
|
<TabsTrigger value="heatmap" className="flex items-center gap-1">
|
||||||
|
<Grid3X3 className="w-4 h-4" />
|
||||||
|
<span className="hidden sm:inline">Heatmap</span>
|
||||||
|
</TabsTrigger>
|
||||||
|
</TabsList>
|
||||||
|
|
||||||
|
{/* Sequence Builder Tab */}
|
||||||
|
<TabsContent value="sequence" className="mt-4">
|
||||||
|
<Card>
|
||||||
|
<CardHeader className="pb-2">
|
||||||
|
<CardTitle className="text-lg flex items-center gap-2">
|
||||||
|
Write Your Instructions
|
||||||
|
{gamePhase === 'writing' && (
|
||||||
|
<Badge variant="secondary" className="ml-2">Click to toggle</Badge>
|
||||||
|
)}
|
||||||
|
</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
{/* Sequence Grid */}
|
||||||
|
<div className="mb-4 overflow-x-auto">
|
||||||
|
<div className="flex gap-1 min-w-max pb-2">
|
||||||
|
{sequence.map((val, idx) => {
|
||||||
|
const pos = idx + 1;
|
||||||
|
const isHighlighted = highlightedSubsequence.includes(pos) || selectedPositions.includes(pos);
|
||||||
|
const isViolationPart = maxDiscrepancy.result?.positions.includes(pos) && hasViolation;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<button
|
||||||
|
key={idx}
|
||||||
|
onClick={() => togglePosition(idx)}
|
||||||
|
disabled={gamePhase !== 'writing'}
|
||||||
|
className={`
|
||||||
|
relative w-10 h-14 rounded-lg border-2 flex flex-col items-center justify-center
|
||||||
|
transition-all duration-200
|
||||||
|
${val === 1 ? 'bg-blue-500/20 border-blue-500 text-blue-600 dark:text-blue-400' : ''}
|
||||||
|
${val === -1 ? 'bg-rose-500/20 border-rose-500 text-rose-600 dark:text-rose-400' : ''}
|
||||||
|
${val === null ? 'bg-muted/50 border-muted-foreground/30 text-muted-foreground' : ''}
|
||||||
|
${isHighlighted ? 'ring-2 ring-amber-400 ring-offset-1' : ''}
|
||||||
|
${isViolationPart ? 'ring-2 ring-destructive ring-offset-1' : ''}
|
||||||
|
${gamePhase === 'writing' ? 'hover:scale-105 cursor-pointer' : 'cursor-default'}
|
||||||
|
`}
|
||||||
|
>
|
||||||
|
<span className="text-[10px] absolute top-0.5 left-1 opacity-50">{pos}</span>
|
||||||
|
{val === 1 && <ArrowRight className="w-5 h-5" />}
|
||||||
|
{val === -1 && <ArrowLeft className="w-5 h-5" />}
|
||||||
|
{val === null && <span className="text-lg">?</span>}
|
||||||
|
</button>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
|
||||||
|
{gamePhase === 'writing' && (
|
||||||
|
<button
|
||||||
|
onClick={addPosition}
|
||||||
|
className="w-10 h-14 rounded-lg border-2 border-dashed border-muted-foreground/30
|
||||||
|
flex items-center justify-center text-muted-foreground
|
||||||
|
hover:border-primary hover:text-primary transition-colors"
|
||||||
|
>
|
||||||
|
+
|
||||||
|
</button>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Controls */}
|
||||||
|
<div className="flex flex-wrap gap-2">
|
||||||
|
{gamePhase === 'writing' && (
|
||||||
|
<>
|
||||||
|
<Button
|
||||||
|
onClick={revealCaptor}
|
||||||
|
disabled={!allFilled}
|
||||||
|
className="flex-1 sm:flex-none"
|
||||||
|
>
|
||||||
|
<Skull className="w-4 h-4 mr-2" />
|
||||||
|
Face the Captor
|
||||||
|
</Button>
|
||||||
|
<Button variant="outline" onClick={resetGame}>
|
||||||
|
<RotateCcw className="w-4 h-4 mr-2" />
|
||||||
|
Reset
|
||||||
|
</Button>
|
||||||
|
</>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</TabsContent>
|
||||||
|
|
||||||
|
{/* Walk Visualization Tab */}
|
||||||
|
<TabsContent value="walk" className="mt-4">
|
||||||
|
<Card>
|
||||||
|
<CardHeader className="pb-2">
|
||||||
|
<CardTitle className="text-lg">Walk Visualization</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
{/* Step size selector */}
|
||||||
|
<div className="mb-4 flex flex-wrap items-center gap-4">
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<label className="text-sm font-medium">Step size (d):</label>
|
||||||
|
<div className="flex gap-1">
|
||||||
|
{Array.from({ length: Math.min(sequence.length, 8) }, (_, i) => i + 1).map(d => (
|
||||||
|
<Button
|
||||||
|
key={d}
|
||||||
|
variant={selectedD === d ? "default" : "outline"}
|
||||||
|
size="sm"
|
||||||
|
onClick={() => {
|
||||||
|
setSelectedD(d);
|
||||||
|
setWalkPosition(0);
|
||||||
|
setWalkStep(0);
|
||||||
|
setIsWalking(false);
|
||||||
|
}}
|
||||||
|
className="w-8 h-8 p-0"
|
||||||
|
>
|
||||||
|
{d}
|
||||||
|
</Button>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div className="flex items-center gap-2">
|
||||||
|
<label className="text-sm">Speed:</label>
|
||||||
|
<Slider
|
||||||
|
value={[1000 - walkSpeed]}
|
||||||
|
onValueChange={(v) => setWalkSpeed(1000 - v[0])}
|
||||||
|
min={0}
|
||||||
|
max={900}
|
||||||
|
step={100}
|
||||||
|
className="w-24"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Number line visualization */}
|
||||||
|
<div className="relative h-32 bg-muted/20 rounded-lg overflow-hidden mb-4">
|
||||||
|
{/* Danger zones */}
|
||||||
|
<div
|
||||||
|
className="absolute top-0 bottom-0 bg-destructive/20 flex items-center justify-center"
|
||||||
|
style={{ left: 0, width: `${(discrepancyBound / (discrepancyBound * 2 + 3)) * 100}%` }}
|
||||||
|
>
|
||||||
|
<span className="text-destructive text-xs font-bold rotate-90">CLIFF</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
className="absolute top-0 bottom-0 bg-destructive/20 flex items-center justify-center"
|
||||||
|
style={{ right: 0, width: `${(discrepancyBound / (discrepancyBound * 2 + 3)) * 100}%` }}
|
||||||
|
>
|
||||||
|
<span className="text-destructive text-xs font-bold rotate-90">VIPERS</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Safe zone markers */}
|
||||||
|
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 flex items-center">
|
||||||
|
{Array.from({ length: discrepancyBound * 2 + 1 }, (_, i) => i - discrepancyBound).map(pos => (
|
||||||
|
<div
|
||||||
|
key={pos}
|
||||||
|
className={`
|
||||||
|
w-8 h-8 mx-1 rounded-full flex items-center justify-center text-xs font-bold
|
||||||
|
${pos === 0 ? 'bg-primary text-primary-foreground' : 'bg-muted text-muted-foreground'}
|
||||||
|
${Math.abs(pos) === discrepancyBound ? 'border-2 border-amber-500' : ''}
|
||||||
|
`}
|
||||||
|
>
|
||||||
|
{pos}
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Walker position */}
|
||||||
|
<div
|
||||||
|
className="absolute top-1/2 -translate-y-1/2 transition-all duration-300"
|
||||||
|
style={{
|
||||||
|
left: `calc(50% + ${walkPosition * 40}px - 12px)`,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div className="w-6 h-6 bg-amber-500 rounded-full flex items-center justify-center text-white text-xs animate-pulse">
|
||||||
|
👤
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Walk info */}
|
||||||
|
<div className="flex items-center justify-between mb-4 text-sm">
|
||||||
|
<span>Position: <strong>{walkPosition}</strong></span>
|
||||||
|
<span>Steps taken: <strong>{walkStep}</strong></span>
|
||||||
|
<span>Following: positions {selectedPositions.slice(0, 5).join(', ')}{selectedPositions.length > 5 ? '...' : ''}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Walk controls */}
|
||||||
|
<div className="flex gap-2">
|
||||||
|
<Button onClick={walkSubsequence} variant="outline" className="flex-1">
|
||||||
|
{isWalking ? <Pause className="w-4 h-4 mr-2" /> : <Play className="w-4 h-4 mr-2" />}
|
||||||
|
{isWalking ? 'Pause' : 'Walk d=' + selectedD}
|
||||||
|
</Button>
|
||||||
|
<Button
|
||||||
|
variant="outline"
|
||||||
|
onClick={() => {
|
||||||
|
setWalkPosition(0);
|
||||||
|
setWalkStep(0);
|
||||||
|
setIsWalking(false);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<RotateCcw className="w-4 h-4" />
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</TabsContent>
|
||||||
|
|
||||||
|
{/* Heatmap Tab */}
|
||||||
|
<TabsContent value="walk" className="mt-4">
|
||||||
|
{/* This is actually handled in the walk tab above */}
|
||||||
|
</TabsContent>
|
||||||
|
|
||||||
|
<TabsContent value="heatmap" className="mt-4">
|
||||||
|
<Card>
|
||||||
|
<CardHeader className="pb-2">
|
||||||
|
<CardTitle className="text-lg">Discrepancy Heatmap</CardTitle>
|
||||||
|
</CardHeader>
|
||||||
|
<CardContent>
|
||||||
|
<p className="text-sm text-muted-foreground mb-4">
|
||||||
|
Each cell shows the sum of values at positions d, 2d, 3d, ..., kd.
|
||||||
|
Red cells exceed the bound.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<div className="overflow-x-auto">
|
||||||
|
<table className="text-xs">
|
||||||
|
<thead>
|
||||||
|
<tr>
|
||||||
|
<th className="p-1 text-muted-foreground">d \ k</th>
|
||||||
|
{Array.from({ length: Math.min(12, sequence.length) }, (_, i) => i + 1).map(k => (
|
||||||
|
<th key={k} className="p-1 w-8 text-center text-muted-foreground">{k}</th>
|
||||||
|
))}
|
||||||
|
</tr>
|
||||||
|
</thead>
|
||||||
|
<tbody>
|
||||||
|
{Array.from({ length: Math.min(8, sequence.length) }, (_, i) => i + 1).map(d => (
|
||||||
|
<tr key={d}>
|
||||||
|
<td className="p-1 font-medium text-muted-foreground">{d}</td>
|
||||||
|
{Array.from({ length: Math.min(12, sequence.length) }, (_, i) => i + 1).map(k => {
|
||||||
|
const discrepancy = getDiscrepancy(d, k);
|
||||||
|
const isValid = d * k <= sequence.length;
|
||||||
|
|
||||||
|
return (
|
||||||
|
<td
|
||||||
|
key={k}
|
||||||
|
className={`
|
||||||
|
p-1 w-8 h-8 text-center cursor-pointer transition-all
|
||||||
|
${isValid ? getHeatmapColor(discrepancy) : 'bg-transparent'}
|
||||||
|
${hoveredCell?.d === d && hoveredCell?.k === k ? 'ring-2 ring-primary' : ''}
|
||||||
|
`}
|
||||||
|
onMouseEnter={() => {
|
||||||
|
if (isValid) {
|
||||||
|
setHoveredCell({ d, k });
|
||||||
|
const result = allDiscrepancies.find(r => r.d === d && r.k === k);
|
||||||
|
if (result) {
|
||||||
|
setHighlightedSubsequence(result.positions);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
onMouseLeave={() => {
|
||||||
|
setHoveredCell(null);
|
||||||
|
setHighlightedSubsequence([]);
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{isValid && discrepancy !== null ? discrepancy : ''}
|
||||||
|
</td>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</tr>
|
||||||
|
))}
|
||||||
|
</tbody>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{hoveredCell && (
|
||||||
|
<div className="mt-4 p-3 bg-muted/50 rounded-lg text-sm">
|
||||||
|
<strong>d={hoveredCell.d}, k={hoveredCell.k}:</strong> Looking at positions{' '}
|
||||||
|
{Array.from({ length: hoveredCell.k }, (_, i) => (i + 1) * hoveredCell.d).join(', ')}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
</TabsContent>
|
||||||
|
</Tabs>
|
||||||
|
|
||||||
|
{/* Captor Reveal Phase */}
|
||||||
|
{gamePhase === 'captor-reveal' && captorChosenD !== null && (
|
||||||
|
<Card className="border-destructive/50 bg-destructive/5">
|
||||||
|
<CardContent className="py-6 text-center">
|
||||||
|
<Skull className="w-12 h-12 mx-auto text-destructive mb-4" />
|
||||||
|
<h3 className="text-xl font-bold mb-2">The Captor Speaks...</h3>
|
||||||
|
<p className="text-muted-foreground mb-4">
|
||||||
|
"Interesting sequence... Let me see... I choose <strong className="text-destructive text-2xl">d = {captorChosenD}</strong>!"
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-muted-foreground mb-4">
|
||||||
|
You will follow every {captorChosenD === 1 ? '' : captorChosenD === 2 ? '2nd' : captorChosenD === 3 ? '3rd' : `${captorChosenD}th`} instruction:
|
||||||
|
positions {Array.from({ length: Math.floor(sequence.length / captorChosenD) }, (_, i) => (i + 1) * captorChosenD).slice(0, 8).join(', ')}...
|
||||||
|
</p>
|
||||||
|
<Button onClick={startPrisonerWalk} size="lg" variant="destructive">
|
||||||
|
<Play className="w-4 h-4 mr-2" />
|
||||||
|
Begin Walking
|
||||||
|
</Button>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Walking Phase */}
|
||||||
|
{gamePhase === 'walking' && captorChosenD !== null && (
|
||||||
|
<Card>
|
||||||
|
<CardContent className="py-6">
|
||||||
|
<div className="text-center mb-4">
|
||||||
|
<h3 className="text-lg font-bold">Walking with d = {captorChosenD}...</h3>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
Step {prisonerStep} | Position: {prisonerPosition}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* Tunnel visualization */}
|
||||||
|
<div className="relative h-24 bg-gradient-to-r from-destructive/30 via-muted/20 to-destructive/30 rounded-lg overflow-hidden">
|
||||||
|
<div className="absolute inset-y-0 left-0 w-8 flex items-center justify-center">
|
||||||
|
<span className="text-2xl">🏔️</span>
|
||||||
|
</div>
|
||||||
|
<div className="absolute inset-y-0 right-0 w-8 flex items-center justify-center">
|
||||||
|
<span className="text-2xl">🐍</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
className="absolute top-1/2 -translate-y-1/2 text-3xl transition-all duration-300"
|
||||||
|
style={{
|
||||||
|
left: `calc(50% + ${prisonerPosition * (100 / (discrepancyBound * 2 + 2))}% - 16px)`
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
🚶
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Fallen Phase */}
|
||||||
|
{gamePhase === 'fallen' && (
|
||||||
|
<Alert variant="destructive">
|
||||||
|
<Skull className="h-4 w-4" />
|
||||||
|
<AlertTitle>You Fell!</AlertTitle>
|
||||||
|
<AlertDescription>
|
||||||
|
After {prisonerStep} steps with d={captorChosenD}, you ended up at position {prisonerPosition}.
|
||||||
|
The captor found your weakness! Your sequence lasted {sequence.length} instructions.
|
||||||
|
<div className="mt-4 flex gap-2">
|
||||||
|
<Button onClick={startGame} variant="outline" size="sm">
|
||||||
|
Try Again
|
||||||
|
</Button>
|
||||||
|
<Button onClick={resetGame} variant="outline" size="sm">
|
||||||
|
<RotateCcw className="w-4 h-4 mr-2" />
|
||||||
|
Reset
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</AlertDescription>
|
||||||
|
</Alert>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Survived Phase (temporary - sequence ended) */}
|
||||||
|
{gamePhase === 'survived' && (
|
||||||
|
<Alert className="border-emerald-500 bg-emerald-500/10">
|
||||||
|
<Trophy className="h-4 w-4 text-emerald-500" />
|
||||||
|
<AlertTitle className="text-emerald-600 dark:text-emerald-400">Sequence Complete!</AlertTitle>
|
||||||
|
<AlertDescription>
|
||||||
|
Your {sequence.length}-instruction sequence survived d={captorChosenD}!
|
||||||
|
But remember: no sequence can survive forever. Try making it longer!
|
||||||
|
<div className="mt-4 flex gap-2">
|
||||||
|
<Button onClick={() => setGamePhase('writing')} variant="outline" size="sm">
|
||||||
|
Extend Sequence
|
||||||
|
</Button>
|
||||||
|
<Button onClick={resetGame} variant="outline" size="sm">
|
||||||
|
<RotateCcw className="w-4 h-4 mr-2" />
|
||||||
|
New Game
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
</AlertDescription>
|
||||||
|
</Alert>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
{/* Acknowledgement */}
|
||||||
|
<Card className="bg-amber-50 dark:bg-amber-950/20 border-amber-200 dark:border-amber-800">
|
||||||
|
<CardContent className="py-4">
|
||||||
|
<h3 className="font-semibold text-foreground mb-2">Credits & History</h3>
|
||||||
|
<p className="text-sm text-muted-foreground mb-2">
|
||||||
|
This puzzle is based on the Erdős Discrepancy Problem, posed by Paul Erdős in the 1930s
|
||||||
|
(with a $500 prize!). The "Prisoner's Walk" framing comes from various mathematical expositions,
|
||||||
|
popularized by James Grime's singingbanana video.
|
||||||
|
</p>
|
||||||
|
<p className="text-sm text-muted-foreground">
|
||||||
|
<strong>2014:</strong> Boris Konev & Alexei Lisitsa proved C=2 has maximum length 1,160 using SAT solvers
|
||||||
|
(generating a 13GB proof!). <strong>2015:</strong> Terence Tao proved that NO infinite sequence
|
||||||
|
can have bounded discrepancy, settling the problem completely.
|
||||||
|
</p>
|
||||||
|
</CardContent>
|
||||||
|
</Card>
|
||||||
|
|
||||||
|
{/* Social Share */}
|
||||||
|
{showSocialShare !== false && (
|
||||||
|
<SocialShare
|
||||||
|
title="Erdős Discrepancy Problem"
|
||||||
|
description="Can you survive the prisoner's tunnel? Explore why no sequence of instructions can keep you safe forever!"
|
||||||
|
url={typeof window !== 'undefined' ? `${window.location.origin}/puzzles/erdos-discrepancy` : ''}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ErdosDiscrepancyPuzzle;
|
||||||
|
|
@ -288,6 +288,15 @@ const allInteractives: Interactive[] = [
|
||||||
path: '/puzzles/ladybug-clock',
|
path: '/puzzles/ladybug-clock',
|
||||||
theme: 'Puzzles',
|
theme: 'Puzzles',
|
||||||
dateAdded: '2025-01-21'
|
dateAdded: '2025-01-21'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 'erdos-discrepancy',
|
||||||
|
title: 'The Erdős Discrepancy Problem',
|
||||||
|
description: 'Can you write instructions to survive the tunnel forever? Explore this famous mathematical puzzle through the Prisoner\'s Walk game.',
|
||||||
|
tags: ['erdos', 'discrepancy', 'sequences', 'game-theory', 'impossibility', 'puzzle', 'number-theory'],
|
||||||
|
path: '/puzzles/erdos-discrepancy',
|
||||||
|
theme: 'Puzzles',
|
||||||
|
dateAdded: '2025-01-22'
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
|
||||||
16
src/pages/ErdosDiscrepancyPuzzlePage.tsx
Normal file
16
src/pages/ErdosDiscrepancyPuzzlePage.tsx
Normal file
|
|
@ -0,0 +1,16 @@
|
||||||
|
import Layout from "@/components/Layout";
|
||||||
|
import ErdosDiscrepancyPuzzle from "@/components/ErdosDiscrepancyPuzzle";
|
||||||
|
|
||||||
|
const ErdosDiscrepancyPuzzlePage = () => {
|
||||||
|
return (
|
||||||
|
<Layout>
|
||||||
|
<div className="py-8 px-4">
|
||||||
|
<div className="max-w-6xl mx-auto">
|
||||||
|
<ErdosDiscrepancyPuzzle showSocialShare={true} />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Layout>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ErdosDiscrepancyPuzzlePage;
|
||||||
|
|
@ -115,6 +115,16 @@ const Puzzles = () => {
|
||||||
difficulty: "Intermediate" as const,
|
difficulty: "Intermediate" as const,
|
||||||
duration: "5-15 min",
|
duration: "5-15 min",
|
||||||
participants: "1 player"
|
participants: "1 player"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "erdos-discrepancy",
|
||||||
|
title: "The Erdős Discrepancy Problem",
|
||||||
|
description: "Can you write instructions to survive the prisoner's tunnel? Explore this famous mathematical puzzle and discover why no sequence can keep you safe forever!",
|
||||||
|
path: "/puzzles/erdos-discrepancy",
|
||||||
|
tags: ["Number Theory", "Sequences", "Impossibility", "Game Theory"],
|
||||||
|
difficulty: "Advanced" as const,
|
||||||
|
duration: "10-30 min",
|
||||||
|
participants: "1 player"
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue