Merge branch 'main' into fix/search-dropdown-reopen

Author: Dhavanesh24cs412

src/components/Gam.tsx

@@ -37,16 +37,71 @@ declare global {
 
 export function GamOnPageChange() {
   if (typeof window === 'undefined' || !window.fusetag) return
-  window.fusetag.que.push(function () {
-    window.fusetag.pageInit()
-  })
+  try {
+    window.fusetag.que.push(function () {
+      try {
+        window.fusetag.pageInit()
+      } catch (error) {
+        // Suppress cross-origin errors from Publift Fuse ad viewability measurement
+        // These can occur on iOS Safari due to strict Same-Origin Policy enforcement
+        console.debug('Error during fusetag.pageInit():', error)
+      }
+    })
+  } catch (error) {
+    // Suppress cross-origin errors from Publift Fuse ad viewability measurement
+    console.debug('Error calling fusetag.que.push():', error)
+  }
 }
 
 export const GamScripts = () => (
   <>
+    <script
+      dangerouslySetInnerHTML={{
+        __html: `
+  // Add global error handler to suppress Publift Fuse cross-origin errors
+  // These errors occur in iOS Safari due to strict Same-Origin Policy enforcement
+  // when the ad viewability script tries to access parent window properties
+  (function() {
+    var originalErrorHandler = window.onerror;
+    window.onerror = function(message, source, lineno, colno, error) {
+      // Check if this is a Publift Fuse cross-origin error
+      if (
+        source && (
+          source.includes('/media/native/') ||
+          source.includes('fuse.js') ||
+          source.includes('fuseplatform.net')
+        ) && (
+          (message && typeof message === 'string' && (
+            message.includes('contextWindow.parent') ||
+            message.includes('null is not an object')
+          )) ||
+          (error && error.message && (
+            error.message.includes('contextWindow.parent') ||
+            error.message.includes('null is not an object')
+          ))
+        )
+      ) {
+        // Suppress the error - log to console in debug mode
+        console.debug('Suppressed Publift Fuse cross-origin error:', message, source);
+        return true; // Prevent default error handling
+      }
+      // Call original error handler for other errors
+      if (originalErrorHandler) {
+        return originalErrorHandler.apply(this, arguments);
+      }
+      return false;
+    };
+  })();
+`,
+      }}
+    />
     <script
       async
       src="https://cdn.fuseplatform.net/publift/tags/2/4019/fuse.js"
+      onError={(e) => {
+        // Suppress script loading errors from Publift Fuse
+        console.debug('Error loading fuse.js:', e)
+      }}
     />
     <script
       dangerouslySetInnerHTML={{

src/components/game/IslandExplorer.tsx

@@ -2,6 +2,7 @@
 // Uses vanilla Three.js engine for better performance
 
 import { useState } from 'react'
+
 import { VanillaGameScene } from './scene/VanillaGameScene'
 import { IntroOverlay } from './ui/IntroOverlay'
 import { GameHUD } from './ui/GameHUD'
@@ -16,16 +17,40 @@ import { CompassIndicator } from './ui/CompassIndicator'
 import { GameOverOverlay } from './ui/GameOverOverlay'
 import { WinOverlay } from './ui/WinOverlay'
 import { StatsHUD } from './ui/StatsHUD'
+import { GameMachineProvider } from './machines/GameMachineProvider'
+import { ProgressionSync } from './machines/ProgressionSync'
+import { BadgeOverlay } from './ui/BadgeOverlay'
+
+const LOADING_MESSAGES = [
+  ['Convincing the waves to behave...', 'They never listen'],
+  ['Teaching fish to avoid the boat...', 'Mixed results so far'],
+  ['Polishing the cannon balls...', 'Shiny = more damage, right?'],
+  ['Bribing the wind gods...', 'They only accept doubloons'],
+  ['Untangling the anchor chain...', 'Who even tied this?'],
+  ['Inflating the ocean...', 'It was looking a bit flat'],
+  ['Waking up the sea monsters...', 'Just kidding, letting them sleep'],
+  ['Calibrating the compass...', 'North is... that way. Probably.'],
+  ['Stocking up on seasickness bags...', 'Better safe than sorry'],
+  ['Negotiating with seagulls...', 'They want crackers'],
+  ['Waterproofing the treasure maps...', 'Learned that lesson the hard way'],
+  ['Training the AI pirates...', 'They keep missing on purpose'],
+  ['Generating procedural waves...', 'Each one is unique and special'],
+  ['Hiding easter eggs...', 'You will never find them all'],
+  ['Rendering exactly 7 million polygons...', 'Give or take a few'],
+]
 
 function LoadingOverlay() {
+  const [messageIndex] = useState(() =>
+    Math.floor(Math.random() * LOADING_MESSAGES.length),
+  )
+  const [headline, subtext] = LOADING_MESSAGES[messageIndex]
+
   return (
     <div className="absolute inset-0 bg-gradient-to-b from-sky-400 to-cyan-600 flex items-center justify-center z-50">
       <div className="text-center">
         <div className="w-16 h-16 mx-auto mb-4 border-4 border-white/30 border-t-white rounded-full animate-spin" />
-        <p className="text-white text-lg font-medium">Loading assets...</p>
-        <p className="text-white/60 text-sm mt-2">
-          Preparing ocean, boats, and islands
-        </p>
+        <p className="text-white text-lg font-medium">{headline}</p>
+        <p className="text-white/60 text-sm mt-2">{subtext}</p>
       </div>
     </div>
   )
@@ -35,38 +60,42 @@ export default function IslandExplorer() {
   const [isLoading, setIsLoading] = useState(true)
 
   return (
-    <div className="relative w-full h-[calc(100dvh-var(--navbar-height))] bg-sky-500">
-      {/* Loading overlay */}
-      {isLoading && <LoadingOverlay />}
+    <GameMachineProvider>
+      <ProgressionSync />
+      <div className="relative w-full h-[calc(100dvh-var(--navbar-height))] bg-sky-500">
+        {/* Loading overlay */}
+        {isLoading && <LoadingOverlay />}
 
-      {/* 3D Scene */}
-      <div className="absolute inset-0">
-        <VanillaGameScene onLoadingChange={setIsLoading} />
-      </div>
+        {/* 3D Scene */}
+        <div className="absolute inset-0">
+          <VanillaGameScene onLoadingChange={setIsLoading} />
+        </div>
 
-      {/* Vignette overlay for depth */}
-      <div
-        className="absolute inset-0 pointer-events-none"
-        style={{
-          background:
-            'radial-gradient(ellipse at center, transparent 40%, rgba(0,20,40,0.3) 100%)',
-        }}
-      />
+        {/* Vignette overlay for depth */}
+        <div
+          className="absolute inset-0 pointer-events-none"
+          style={{
+            background:
+              'radial-gradient(ellipse at center, transparent 40%, rgba(0,20,40,0.3) 100%)',
+          }}
+        />
 
-      {/* UI Overlays */}
-      <IntroOverlay />
-      <UpgradeOverlay />
-      <CompleteOverlay />
-      <GameOverOverlay />
-      <WinOverlay />
-      <GameHUD />
-      <StatsHUD />
-      <Minimap />
-      <IslandIndicator />
-      <CompassIndicator />
-      <TouchControls />
-      <Shop />
-      <DebugPanel />
-    </div>
+        {/* UI Overlays */}
+        <IntroOverlay />
+        <UpgradeOverlay />
+        <CompleteOverlay />
+        <GameOverOverlay />
+        <WinOverlay />
+        <BadgeOverlay />
+        <GameHUD />
+        <StatsHUD />
+        <Minimap />
+        <IslandIndicator />
+        <CompassIndicator />
+        <TouchControls />
+        <Shop />
+        <DebugPanel />
+      </div>
+    </GameMachineProvider>
   )
 }

src/components/game/engine/GameEngine.ts

@@ -364,6 +364,13 @@ export class GameEngine {
     const initialState = useGameStore.getState()
 
     // Handle loading directly into battle stage (page reload while in battle)
+    console.log('[Game Init] State:', {
+      stage: initialState.stage,
+      phase: initialState.phase,
+      showcaseUnlocked: initialState.showcaseUnlocked,
+      showcaseIslandsCount: initialState.showcaseIslands.length,
+      worldBoundary: initialState.worldBoundary,
+    })
     if (initialState.stage === 'battle' && initialState.phase === 'playing') {
       // Generate expanded islands if needed
       if (initialState.expandedIslands.length === 0) {
@@ -382,10 +389,21 @@ export class GameEngine {
       }
 
       if (initialState.showcaseUnlocked && showcaseIslands.length === 0) {
+        console.log(
+          '[Game Init] Showcase was unlocked but no islands - fetching...',
+        )
         // Fetch and generate showcase islands async
         fetchGameShowcases().then((showcases) => {
+          console.log(
+            '[Game Init] Fetched showcases for reload:',
+            showcases.length,
+          )
           if (showcases.length > 0) {
             const generated = generateShowcaseIslands(showcases)
+            console.log(
+              '[Game Init] Generated showcase islands:',
+              generated.length,
+            )
             initialState.setShowcaseIslands(generated)
             this.islands.setIslands(
               initialState.islands,
@@ -401,6 +419,11 @@ export class GameEngine {
             )
           }
         })
+      } else {
+        console.log('[Game Init] Showcase state:', {
+          showcaseUnlocked: initialState.showcaseUnlocked,
+          showcaseIslandsCount: showcaseIslands.length,
+        })
       }
 
       this.islands.setIslands(
@@ -530,8 +553,19 @@ export class GameEngine {
         }
 
         // Showcase unlock (generate showcase islands - NOT corner islands yet)
+        // Debug: Log showcase state on every subscription tick
+        if (state.showcaseUnlocked !== prevShowcaseUnlocked) {
+          console.log('[Game] Showcase state changed:', {
+            showcaseUnlocked: state.showcaseUnlocked,
+            prevShowcaseUnlocked,
+            showcaseIslandsCount: state.showcaseIslands.length,
+          })
+        }
         if (state.showcaseUnlocked && !prevShowcaseUnlocked) {
           prevShowcaseUnlocked = true
+          console.log(
+            '[Game] Showcase unlocked! Expanding world and generating showcase islands...',
+          )
 
           // Expand world boundary for showcase zone
           state.setWorldBoundary(520)
@@ -541,24 +575,32 @@ export class GameEngine {
 
           // Fetch and generate showcase islands async (no corner islands yet)
           if (state.showcaseIslands.length === 0) {
+            console.log('[Game] Fetching showcase data...')
             fetchGameShowcases().then((showcases) => {
+              console.log('[Game] Fetched showcases:', showcases.length)
               if (showcases.length > 0) {
                 const generated = generateShowcaseIslands(showcases)
-                state.setShowcaseIslands(generated)
+                console.log(
+                  '[Game] Generated showcase islands:',
+                  generated.length,
+                )
+                // Get fresh state for current islands
+                const currentState = useGameStore.getState()
+                currentState.setShowcaseIslands(generated)
 
                 // Update islands entity with showcase islands
                 this.islands.setIslands(
-                  state.islands,
-                  state.expandedIslands,
+                  currentState.islands,
+                  currentState.expandedIslands,
                   generated,
-                  state.cornerIslands,
+                  currentState.cornerIslands,
                 )
                 // Update ocean gradients
                 this.updateOceanIslandPositions(
-                  state.islands,
-                  state.expandedIslands,
+                  currentState.islands,
+                  currentState.expandedIslands,
                   generated,
-                  state.cornerIslands,
+                  currentState.cornerIslands,
                 )
               }
             })