react-native-games 1.1.0 → 1.3.0

package/lib/module/games/popit-fidget/PopitFidgetConstants.js

@@ -1,113 +1 @@
-"use strict";
-
-// Popit Fidget Game Constants
-export const POPIT_FIDGET_GAME_CONFIG = {
-  GAME_DURATION: 120,
-  // seconds
-  POINTS_PER_BUBBLE: 10,
-  COMPLETION_BONUS: 500,
-  TIME_BONUS_MULTIPLIER: 5,
-  BUBBLE_SIZE: 40,
-  ANIMATION_DURATION: 300,
-  PARTICLE_COUNT: 4,
-  // Reduced for better performance
-  PARTICLE_LIFETIME: 800,
-  // Difficulty-based square grid sizes
-  GRID_SIZES: {
-    easy: 5,
-    // 5x5 = 25 bubbles
-    medium: 6,
-    // 6x6 = 36 bubbles
-    hard: 7 // 7x7 = 49 bubbles
-  }
-};
-export const POPIT_FIDGET_ANIMATION_CONFIG = {
-  POP_SCALE: 1.3,
-  POP_DURATION: 200,
-  FADE_DURATION: 300,
-  BOUNCE_SCALE: 0.9,
-  PARTICLE_VELOCITY: 3,
-  PARTICLE_GRAVITY: 0.2
-};
-export const POPIT_FIDGET_COLORS = {
-  BACKGROUND: '#f5f5f5',
-  // Light gray background
-  FIDGET_BORDER: '#333',
-  FIDGET_SHADOW: 'rgba(0,0,0,0.3)',
-  SCORE: '#4a90e2',
-  UI: '#6c5ce7',
-  POPPED_BUBBLE: '#d0d0d0',
-  PARTICLE_GLOW: 'rgba(255,255,255,0.9)',
-  // Pop It fidget toy colors - rainbow gradient
-  FIDGET_BASE: '#ffffff',
-  BUBBLE_SHADOW: 'rgba(0,0,0,0.2)',
-  BUBBLE_HIGHLIGHT: 'rgba(255,255,255,0.6)'
-};
-
-// Rainbow gradient colors for authentic Pop It fidget toy look - enhanced vibrancy
-export const RAINBOW_COLORS = ['#E91E63',
-// Vibrant pink/magenta (like image)
-'#F44336',
-// Bright red
-'#FF5722',
-// Deep orange
-'#FF9800',
-// Orange
-'#FFC107',
-// Amber/yellow
-'#8E24AA',
-// Deep purple
-'#CDDC39',
-// Lime
-'#8BC34A',
-// Light green
-'#4CAF50',
-// Green
-'#009688',
-// Teal
-'#00BCD4',
-// Cyan
-'#03A9F4',
-// Light blue
-'#2196F3',
-// Blue
-'#3F51B5',
-// Indigo
-'#9C27B0',
-// Purple
-'#E91E63' // Back to vibrant pink for seamless loop
-];
-
-// Legacy bubble colors for backward compatibility
-export const BUBBLE_COLORS = RAINBOW_COLORS;
-
-// Popit Fidget Game Theme - Matches scoreboard purple
-export const POPIT_FIDGET_THEME = {
-  backgroundColor: '#fef7ff',
-  // Very light lavender to match game background
-  headerBackgroundColor: 'rgba(108, 92, 231, 0.9)',
-  // Purple header to match scoreboard
-  headerTextColor: '#ffffff',
-  sectionBackgroundColor: 'rgba(108, 92, 231, 0.4)',
-  // Match scoreboard transparency
-  sectionTitleColor: '#ffffff',
-  // White text on purple sections
-  buttonSelectedColor: '#9c27b0',
-  // Match start button purple
-  buttonUnselectedColor: 'rgba(255, 255, 255, 0.3)',
-  buttonSelectedTextColor: '#ffffff',
-  buttonUnselectedTextColor: '#1f2937',
-  switchTrackColorFalse: 'rgba(108, 92, 231, 0.5)',
-  switchTrackColorTrue: '#9c27b0',
-  // Match start button
-  switchThumbColor: '#ffffff',
-  infoTextColor: '#1f2937' // Dark text for readability
-};
-
-// Popit Fidget Difficulty Descriptions
-export const POPIT_FIDGET_DIFFICULTY_DESCRIPTIONS = {
-  easy: 'Smaller fidget grids, relaxing pace',
-  medium: 'Medium grids, satisfying pops',
-  hard: 'Large complex shapes, ultimate satisfaction!'
-};
-//# sourceMappingURL=PopitFidgetConstants.js.map
+"use strict";export const POPIT_FIDGET_GAME_CONFIG ={GAME_DURATION:120,POINTS_PER_BUBBLE:10,COMPLETION_BONUS:500,TIME_BONUS_MULTIPLIER:5,BUBBLE_SIZE:40,ANIMATION_DURATION:300,PARTICLE_COUNT:4,PARTICLE_LIFETIME:800,GRID_SIZES:{easy:5,medium:6,hard:7}};export const POPIT_FIDGET_ANIMATION_CONFIG ={POP_SCALE:1.3,POP_DURATION:200,FADE_DURATION:300,BOUNCE_SCALE:0.9,PARTICLE_VELOCITY:3,PARTICLE_GRAVITY:0.2};export const POPIT_FIDGET_COLORS ={BACKGROUND:'#f5f5f5',FIDGET_BORDER:'#333',FIDGET_SHADOW:'rgba(0,0,0,0.3)',SCORE:'#4a90e2',UI:'#6c5ce7',POPPED_BUBBLE:'#d0d0d0',PARTICLE_GLOW:'rgba(255,255,255,0.9)',FIDGET_BASE:'#ffffff',BUBBLE_SHADOW:'rgba(0,0,0,0.2)',BUBBLE_HIGHLIGHT:'rgba(255,255,255,0.6)'};export const RAINBOW_COLORS = ['#E91E63','#F44336','#FF5722','#FF9800','#FFC107','#8E24AA','#CDDC39','#8BC34A','#4CAF50','#009688','#00BCD4','#03A9F4','#2196F3','#3F51B5','#9C27B0','#E91E63' ];export const BUBBLE_COLORS = RAINBOW_COLORS;export const POPIT_FIDGET_THEME ={backgroundColor:'rgba(0,0,0,0.7)',headerBackgroundColor:'#9c27b0',headerTextColor:'#ffffff',sectionBackgroundColor:'rgba(156,39,176,0.15)',sectionTitleColor:'#9c27b0',buttonSelectedColor:'#9c27b0',buttonUnselectedColor:'rgba(255,255,255,0.2)',buttonSelectedTextColor:'#ffffff',buttonUnselectedTextColor:'rgba(255,255,255,0.7)',switchTrackColorFalse:'rgba(156,39,176,0.3)',switchTrackColorTrue:'#9c27b0',switchThumbColor:'#ffffff',infoTextColor:'rgba(255,255,255,0.9)'};export const POPIT_FIDGET_DIFFICULTY_DESCRIPTIONS ={easy:'Smaller fidget grids,relaxing pace',medium:'Medium grids,satisfying pops',hard:'Large complex shapes,ultimate satisfaction!'};

package/lib/module/games/popit-fidget/PopitFidgetConstants.js.map

@@ -1 +1 @@
-{"version":3,"names":["POPIT_FIDGET_GAME_CONFIG","GAME_DURATION","POINTS_PER_BUBBLE","COMPLETION_BONUS","TIME_BONUS_MULTIPLIER","BUBBLE_SIZE","ANIMATION_DURATION","PARTICLE_COUNT","PARTICLE_LIFETIME","GRID_SIZES","easy","medium","hard","POPIT_FIDGET_ANIMATION_CONFIG","POP_SCALE","POP_DURATION","FADE_DURATION","BOUNCE_SCALE","PARTICLE_VELOCITY","PARTICLE_GRAVITY","POPIT_FIDGET_COLORS","BACKGROUND","FIDGET_BORDER","FIDGET_SHADOW","SCORE","UI","POPPED_BUBBLE","PARTICLE_GLOW","FIDGET_BASE","BUBBLE_SHADOW","BUBBLE_HIGHLIGHT","RAINBOW_COLORS","BUBBLE_COLORS","POPIT_FIDGET_THEME","backgroundColor","headerBackgroundColor","headerTextColor","sectionBackgroundColor","sectionTitleColor","buttonSelectedColor","buttonUnselectedColor","buttonSelectedTextColor","buttonUnselectedTextColor","switchTrackColorFalse","switchTrackColorTrue","switchThumbColor","infoTextColor","POPIT_FIDGET_DIFFICULTY_DESCRIPTIONS"],"sourceRoot":"../../../../src","sources":["games/popit-fidget/PopitFidgetConstants.ts"],"mappings":";;AAEA;AACA,OAAO,MAAMA,wBAAwB,GAAG;EACtCC,aAAa,EAAE,GAAG;EAAE;EACpBC,iBAAiB,EAAE,EAAE;EACrBC,gBAAgB,EAAE,GAAG;EACrBC,qBAAqB,EAAE,CAAC;EACxBC,WAAW,EAAE,EAAE;EACfC,kBAAkB,EAAE,GAAG;EACvBC,cAAc,EAAE,CAAC;EAAE;EACnBC,iBAAiB,EAAE,GAAG;EACtB;EACAC,UAAU,EAAE;IACVC,IAAI,EAAE,CAAC;IAAK;IACZC,MAAM,EAAE,CAAC;IAAG;IACZC,IAAI,EAAE,CAAC,CAAK;EACd;AACF,CAAU;AAEV,OAAO,MAAMC,6BAA6B,GAAG;EAC3CC,SAAS,EAAE,GAAG;EACdC,YAAY,EAAE,GAAG;EACjBC,aAAa,EAAE,GAAG;EAClBC,YAAY,EAAE,GAAG;EACjBC,iBAAiB,EAAE,CAAC;EACpBC,gBAAgB,EAAE;AACpB,CAAU;AAEV,OAAO,MAAMC,mBAAmB,GAAG;EACjCC,UAAU,EAAE,SAAS;EAAE;EACvBC,aAAa,EAAE,MAAM;EACrBC,aAAa,EAAE,iBAAiB;EAChCC,KAAK,EAAE,SAAS;EAChBC,EAAE,EAAE,SAAS;EACbC,aAAa,EAAE,SAAS;EACxBC,aAAa,EAAE,uBAAuB;EACtC;EACAC,WAAW,EAAE,SAAS;EACtBC,aAAa,EAAE,iBAAiB;EAChCC,gBAAgB,EAAE;AACpB,CAAU;;AAEV;AACA,OAAO,MAAMC,cAAc,GAAG,CAC5B,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS,CAAE;AAAA,CACH;;AAEV;AACA,OAAO,MAAMC,aAAa,GAAGD,cAAc;;AAE3C;AACA,OAAO,MAAME,kBAAqC,GAAG;EACnDC,eAAe,EAAE,SAAS;EAAE;EAC5BC,qBAAqB,EAAE,yBAAyB;EAAE;EAClDC,eAAe,EAAE,SAAS;EAC1BC,sBAAsB,EAAE,yBAAyB;EAAE;EACnDC,iBAAiB,EAAE,SAAS;EAAE;EAC9BC,mBAAmB,EAAE,SAAS;EAAE;EAChCC,qBAAqB,EAAE,0BAA0B;EACjDC,uBAAuB,EAAE,SAAS;EAClCC,yBAAyB,EAAE,SAAS;EACpCC,qBAAqB,EAAE,yBAAyB;EAChDC,oBAAoB,EAAE,SAAS;EAAE;EACjCC,gBAAgB,EAAE,SAAS;EAC3BC,aAAa,EAAE,SAAS,CAAE;AAC5B,CAAC;;AAED;AACA,OAAO,MAAMC,oCAAoC,GAAG;EAClDrC,IAAI,EAAE,qCAAqC;EAC3CC,MAAM,EAAE,+BAA+B;EACvCC,IAAI,EAAE;AACR,CAAU","ignoreList":[]}
+{"version":3,"names":["POPIT_FIDGET_GAME_CONFIG","GAME_DURATION","POINTS_PER_BUBBLE","COMPLETION_BONUS","TIME_BONUS_MULTIPLIER","BUBBLE_SIZE","ANIMATION_DURATION","PARTICLE_COUNT","PARTICLE_LIFETIME","GRID_SIZES","easy","medium","hard","POPIT_FIDGET_ANIMATION_CONFIG","POP_SCALE","POP_DURATION","FADE_DURATION","BOUNCE_SCALE","PARTICLE_VELOCITY","PARTICLE_GRAVITY","POPIT_FIDGET_COLORS","BACKGROUND","FIDGET_BORDER","FIDGET_SHADOW","SCORE","UI","POPPED_BUBBLE","PARTICLE_GLOW","FIDGET_BASE","BUBBLE_SHADOW","BUBBLE_HIGHLIGHT","RAINBOW_COLORS","BUBBLE_COLORS","POPIT_FIDGET_THEME","backgroundColor","headerBackgroundColor","headerTextColor","sectionBackgroundColor","sectionTitleColor","buttonSelectedColor","buttonUnselectedColor","buttonSelectedTextColor","buttonUnselectedTextColor","switchTrackColorFalse","switchTrackColorTrue","switchThumbColor","infoTextColor","POPIT_FIDGET_DIFFICULTY_DESCRIPTIONS"],"sourceRoot":"../../../../src","sources":["games/popit-fidget/PopitFidgetConstants.ts"],"mappings":";;AAEA;AACA,OAAO,MAAMA,wBAAwB,GAAG;EACtCC,aAAa,EAAE,GAAG;EAAE;EACpBC,iBAAiB,EAAE,EAAE;EACrBC,gBAAgB,EAAE,GAAG;EACrBC,qBAAqB,EAAE,CAAC;EACxBC,WAAW,EAAE,EAAE;EACfC,kBAAkB,EAAE,GAAG;EACvBC,cAAc,EAAE,CAAC;EAAE;EACnBC,iBAAiB,EAAE,GAAG;EACtB;EACAC,UAAU,EAAE;IACVC,IAAI,EAAE,CAAC;IAAK;IACZC,MAAM,EAAE,CAAC;IAAG;IACZC,IAAI,EAAE,CAAC,CAAK;EACd;AACF,CAAU;AAEV,OAAO,MAAMC,6BAA6B,GAAG;EAC3CC,SAAS,EAAE,GAAG;EACdC,YAAY,EAAE,GAAG;EACjBC,aAAa,EAAE,GAAG;EAClBC,YAAY,EAAE,GAAG;EACjBC,iBAAiB,EAAE,CAAC;EACpBC,gBAAgB,EAAE;AACpB,CAAU;AAEV,OAAO,MAAMC,mBAAmB,GAAG;EACjCC,UAAU,EAAE,SAAS;EAAE;EACvBC,aAAa,EAAE,MAAM;EACrBC,aAAa,EAAE,iBAAiB;EAChCC,KAAK,EAAE,SAAS;EAChBC,EAAE,EAAE,SAAS;EACbC,aAAa,EAAE,SAAS;EACxBC,aAAa,EAAE,uBAAuB;EACtC;EACAC,WAAW,EAAE,SAAS;EACtBC,aAAa,EAAE,iBAAiB;EAChCC,gBAAgB,EAAE;AACpB,CAAU;;AAEV;AACA,OAAO,MAAMC,cAAc,GAAG,CAC5B,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS;AAAE;AACX,SAAS,CAAE;AAAA,CACH;;AAEV;AACA,OAAO,MAAMC,aAAa,GAAGD,cAAc;;AAE3C;AACA,OAAO,MAAME,kBAAqC,GAAG;EACnDC,eAAe,EAAE,oBAAoB;EAAE;EACvCC,qBAAqB,EAAE,SAAS;EAAE;EAClCC,eAAe,EAAE,SAAS;EAC1BC,sBAAsB,EAAE,0BAA0B;EAAE;EACpDC,iBAAiB,EAAE,SAAS;EAAE;EAC9BC,mBAAmB,EAAE,SAAS;EAAE;EAChCC,qBAAqB,EAAE,0BAA0B;EACjDC,uBAAuB,EAAE,SAAS;EAClCC,yBAAyB,EAAE,0BAA0B;EAAE;EACvDC,qBAAqB,EAAE,yBAAyB;EAChDC,oBAAoB,EAAE,SAAS;EAAE;EACjCC,gBAAgB,EAAE,SAAS;EAC3BC,aAAa,EAAE,0BAA0B,CAAE;AAC7C,CAAC;;AAED;AACA,OAAO,MAAMC,oCAAoC,GAAG;EAClDrC,IAAI,EAAE,qCAAqC;EAC3CC,MAAM,EAAE,+BAA+B;EACvCC,IAAI,EAAE;AACR,CAAU","ignoreList":[]}

package/lib/module/games/popit-fidget/PopitFidgetService.js

@@ -1,132 +1 @@
-"use strict";
-
-import { Dimensions } from 'react-native';
-import { POPIT_FIDGET_GAME_CONFIG as GAME_CONFIG, POPIT_FIDGET_ANIMATION_CONFIG as ANIMATION_CONFIG, POPIT_FIDGET_COLORS as COLORS, RAINBOW_COLORS, BUBBLE_COLORS } from "./PopitFidgetConstants.js";
-const {
-  width,
-  height
-} = Dimensions.get('window');
-
-// Constants now imported from PopitFidgetConstants.ts
-// Re-export for backward compatibility
-export { GAME_CONFIG, ANIMATION_CONFIG, COLORS, BUBBLE_COLORS };
-
-// Types - Simplified to always use square grids
-
-export class PopitFidgetService {
-  gameTimerRef = null;
-  constructor() {}
-
-  // Generate square fidget grid based on difficulty
-  generateFidgetGrid(difficulty) {
-    const availableWidth = width * 0.85; // Match PopitFidget component calculation
-    const availableHeight = height * 0.6; // Match PopitFidget component calculation
-
-    // Get grid size from difficulty-based configuration
-    const gridSize = GAME_CONFIG.GRID_SIZES[difficulty];
-
-    // Use same bubble size calculation as PopitFidget component
-    const maxSize = Math.min(availableWidth / gridSize, availableHeight / gridSize);
-    const bubbleSize = Math.max(45, Math.min(80, maxSize * 0.9));
-
-    // Calculate grid dimensions with proper spacing
-    const spacing = bubbleSize * 1.1;
-    const gridWidth = (gridSize - 1) * spacing + bubbleSize;
-    const gridHeight = (gridSize - 1) * spacing + bubbleSize;
-    const bubbles = [];
-
-    // Generate square grid - all bubbles are included (no shape filtering)
-    for (let row = 0; row < gridSize; row++) {
-      bubbles[row] = [];
-      for (let col = 0; col < gridSize; col++) {
-        // Position bubbles with proper spacing to prevent overlap
-        const x = col * spacing + bubbleSize / 2;
-        const y = row * spacing + bubbleSize / 2;
-        bubbles[row][col] = {
-          id: `${row}-${col}`,
-          row,
-          col,
-          x,
-          y,
-          isPopped: false,
-          color: this.getRainbowColorForPosition(row, gridSize),
-          animationProgress: 0
-        };
-      }
-    }
-    return {
-      size: gridSize,
-      bubbles,
-      centerX: gridWidth / 2,
-      centerY: gridHeight / 2,
-      width: gridWidth,
-      height: gridHeight
-    };
-  }
-
-  // Get rainbow gradient color based on row position for authentic Pop It look
-  getRainbowColorForPosition(row, totalRows) {
-    // Create rainbow gradient effect like real Pop It fidget toys
-    const colorIndex = Math.floor(row / totalRows * RAINBOW_COLORS.length);
-    return RAINBOW_COLORS[colorIndex] || RAINBOW_COLORS[0];
-  }
-
-  // Check if all bubbles are popped
-  checkAllBubblesPopped(grid) {
-    for (let row = 0; row < grid.size; row++) {
-      for (let col = 0; col < grid.size; col++) {
-        const bubble = grid.bubbles[row]?.[col];
-        if (bubble && !bubble.isPopped) {
-          return false;
-        }
-      }
-    }
-    return true;
-  }
-
-  // Calculate completion percentage
-  calculateCompletionPercentage(grid) {
-    let totalBubbles = 0;
-    let poppedBubbles = 0;
-    for (let row = 0; row < grid.size; row++) {
-      for (let col = 0; col < grid.size; col++) {
-        const bubble = grid.bubbles[row]?.[col];
-        if (bubble) {
-          totalBubbles++;
-          if (bubble.isPopped) {
-            poppedBubbles++;
-          }
-        }
-      }
-    }
-    return totalBubbles > 0 ? poppedBubbles / totalBubbles * 100 : 0;
-  }
-
-  // Start game timer
-  startGameTimer(duration, onTick, onComplete) {
-    this.stopGameTimer();
-    let timeLeft = duration;
-    this.gameTimerRef = setInterval(() => {
-      timeLeft -= 1;
-      onTick(timeLeft);
-      if (timeLeft <= 0) {
-        this.stopGameTimer();
-        onComplete();
-      }
-    }, 1000);
-  }
-
-  // Stop game timer
-  stopGameTimer() {
-    if (this.gameTimerRef) {
-      clearInterval(this.gameTimerRef);
-      this.gameTimerRef = null;
-    }
-  }
-
-  // Cleanup
-  cleanup() {
-    this.stopGameTimer();
-  }
-}
-//# sourceMappingURL=PopitFidgetService.js.map
+"use strict";import{Dimensions}from 'react-native';import{POPIT_FIDGET_GAME_CONFIG as GAME_CONFIG,POPIT_FIDGET_ANIMATION_CONFIG as ANIMATION_CONFIG,POPIT_FIDGET_COLORS as COLORS,RAINBOW_COLORS,BUBBLE_COLORS}from "./PopitFidgetConstants.js";const{width,height}= Dimensions.get('window');export{GAME_CONFIG,ANIMATION_CONFIG,COLORS,BUBBLE_COLORS};export class PopitFidgetService{gameTimerRef = null;constructor(){}generateFidgetGrid(difficulty){const availableWidth = width * 0.85;const availableHeight = height * 0.6;const gridSize = GAME_CONFIG.GRID_SIZES[difficulty];const maxSize = Math.min(availableWidth / gridSize,availableHeight / gridSize);const bubbleSize = Math.max(45,Math.min(80,maxSize * 0.9));const spacing = bubbleSize * 1.1;const gridWidth =(gridSize - 1)* spacing + bubbleSize;const gridHeight =(gridSize - 1)* spacing + bubbleSize;const bubbles = [];for(let row = 0;row < gridSize;row++){bubbles[row] = [];for(let col = 0;col < gridSize;col++){const x = col * spacing + bubbleSize / 2;const y = row * spacing + bubbleSize / 2;bubbles[row][col] ={id:`${row}-${col}`,row,col,x,y,isPopped:false,color:this.getRainbowColorForPosition(row,gridSize),animationProgress:0};}}return{size:gridSize,bubbles,centerX:gridWidth / 2,centerY:gridHeight / 2,width:gridWidth,height:gridHeight};}getRainbowColorForPosition(row,totalRows){const colorIndex = Math.floor(row / totalRows * RAINBOW_COLORS.length);return RAINBOW_COLORS[colorIndex] || RAINBOW_COLORS[0];}checkAllBubblesPopped(grid){for(let row = 0;row < grid.size;row++){for(let col = 0;col < grid.size;col++){const bubble = grid.bubbles[row]?.[col];if(bubble && !bubble.isPopped){return false;}}}return true;}calculateCompletionPercentage(grid){let totalBubbles = 0;let poppedBubbles = 0;for(let row = 0;row < grid.size;row++){for(let col = 0;col < grid.size;col++){const bubble = grid.bubbles[row]?.[col];if(bubble){totalBubbles++;if(bubble.isPopped){poppedBubbles++;}}}}return totalBubbles > 0 ? poppedBubbles / totalBubbles * 100:0;}startGameTimer(duration,onTick,onComplete){this.stopGameTimer();let timeLeft = duration;this.gameTimerRef = setInterval(()=>{timeLeft -= 1;onTick(timeLeft);if(timeLeft <= 0){this.stopGameTimer();onComplete();}},1000);}stopGameTimer(){if(this.gameTimerRef){clearInterval(this.gameTimerRef);this.gameTimerRef = null;}}cleanup(){this.stopGameTimer();}}

package/lib/module/games/popit-fidget/PopitFidgetStore.js

@@ -1,125 +1 @@
-"use strict";
-
-import { create } from 'zustand';
-import { subscribeWithSelector } from 'zustand/middleware';
-import { immerMiddleware } from "../../services/UtilsService.js";
-// Optimized store with selective subscriptions for low-end devices
-export const usePopitFidgetStore = create()(subscribeWithSelector(immerMiddleware((set, get) => ({
-  // Initial state
-  timeElapsed: 0,
-  isPlaying: false,
-  gameOver: false,
-  gameWon: false,
-  fidgetGrid: null,
-  bubblesPopped: 0,
-  totalBubbles: 0,
-  bubbleStates: {},
-  // Actions
-  startGame: _gameDuration => {
-    set(draft => {
-      draft.isPlaying = true;
-      draft.gameOver = false;
-      draft.gameWon = false;
-      draft.timeElapsed = 0;
-      draft.bubblesPopped = 0;
-    });
-  },
-  stopGame: () => {
-    set(draft => {
-      draft.isPlaying = false;
-      draft.gameOver = true;
-    });
-  },
-  resetGame: () => {
-    set(draft => {
-      draft.timeElapsed = 0;
-      draft.isPlaying = false;
-      draft.gameOver = false;
-      draft.gameWon = false;
-      draft.fidgetGrid = null;
-      draft.bubblesPopped = 0;
-      draft.totalBubbles = 0;
-    });
-  },
-  setFidgetGrid: grid => {
-    // For square grids, total bubbles = size * size
-    const totalCount = grid.size * grid.size;
-    set(draft => {
-      draft.fidgetGrid = grid;
-      draft.totalBubbles = totalCount;
-      draft.bubblesPopped = 0;
-
-      // Initialize bubble states for all bubbles
-      draft.bubbleStates = {};
-      for (let row = 0; row < grid.size; row++) {
-        for (let col = 0; col < grid.size; col++) {
-          const bubble = grid.bubbles[row]?.[col];
-          if (bubble) {
-            draft.bubbleStates[bubble.id] = {
-              isPopped: bubble.isPopped || false,
-              popTime: bubble.popTime
-            };
-          }
-        }
-      }
-    });
-  },
-  popBubble: (row, col) => {
-    set(draft => {
-      if (!draft.fidgetGrid) return;
-      const bubble = draft.fidgetGrid.bubbles[row]?.[col];
-      if (!bubble) return;
-
-      // Check if bubble is already popped using bubbleStates
-      const bubbleState = draft.bubbleStates[bubble.id];
-      if (bubbleState?.isPopped) return;
-
-      // Update only the bubbleStates, not the fidgetGrid
-      // This prevents the entire fidgetGrid array from changing references
-      draft.bubbleStates[bubble.id] = {
-        isPopped: true,
-        popTime: Date.now()
-      };
-      draft.bubblesPopped = draft.bubblesPopped + 1;
-    });
-
-    // Check if game is won (only if actively playing)
-    const state = get();
-    if (state.isPlaying) {
-      get().checkGameWon();
-    }
-  },
-  incrementTime: () => {
-    set(draft => {
-      draft.timeElapsed = draft.timeElapsed + 1;
-    });
-  },
-  checkGameWon: () => {
-    const state = get();
-    if (!state.fidgetGrid) return;
-
-    // Check if all bubbles are popped using bubbleStates
-    let allPopped = true;
-    for (let row = 0; row < state.fidgetGrid.size; row++) {
-      for (let col = 0; col < state.fidgetGrid.size; col++) {
-        const bubble = state.fidgetGrid.bubbles[row]?.[col];
-        if (bubble) {
-          const bubbleState = state.bubbleStates[bubble.id];
-          if (!bubbleState?.isPopped) {
-            allPopped = false;
-            break;
-          }
-        }
-      }
-      if (!allPopped) break;
-    }
-    if (allPopped && state.isPlaying) {
-      set(draft => {
-        draft.isPlaying = false;
-        draft.gameWon = true;
-        draft.gameOver = true;
-      });
-    }
-  }
-}))));
-//# sourceMappingURL=PopitFidgetStore.js.map
+"use strict";import{create}from 'zustand';import{subscribeWithSelector}from 'zustand/middleware';import{immerMiddleware}from "../../services/UtilsService.js";export const usePopitFidgetStore = create()(subscribeWithSelector(immerMiddleware((set,get)=>({timeElapsed:0,isPlaying:false,gameOver:false,gameWon:false,fidgetGrid:null,bubblesPopped:0,totalBubbles:0,bubbleStates:{},startGame:_gameDuration =>{set(draft =>{draft.isPlaying = true;draft.gameOver = false;draft.gameWon = false;draft.timeElapsed = 0;draft.bubblesPopped = 0;});},stopGame:()=>{set(draft =>{draft.isPlaying = false;draft.gameOver = true;});},resetGame:()=>{set(draft =>{draft.timeElapsed = 0;draft.isPlaying = false;draft.gameOver = false;draft.gameWon = false;draft.fidgetGrid = null;draft.bubblesPopped = 0;draft.totalBubbles = 0;});},setFidgetGrid:grid =>{const totalCount = grid.size * grid.size;set(draft =>{draft.fidgetGrid = grid;draft.totalBubbles = totalCount;draft.bubblesPopped = 0;draft.bubbleStates ={};for(let row = 0;row < grid.size;row++){for(let col = 0;col < grid.size;col++){const bubble = grid.bubbles[row]?.[col];if(bubble){draft.bubbleStates[bubble.id] ={isPopped:bubble.isPopped || false,popTime:bubble.popTime};}}}});},popBubble:(row,col)=>{set(draft =>{if(!draft.fidgetGrid)return;const bubble = draft.fidgetGrid.bubbles[row]?.[col];if(!bubble)return;const bubbleState = draft.bubbleStates[bubble.id];if(bubbleState?.isPopped)return;draft.bubbleStates[bubble.id] ={isPopped:true,popTime:Date.now()};draft.bubblesPopped = draft.bubblesPopped + 1;});const state = get();if(state.isPlaying){get().checkGameWon();}},incrementTime:()=>{set(draft =>{draft.timeElapsed = draft.timeElapsed + 1;});},checkGameWon:()=>{const state = get();if(!state.fidgetGrid)return;let allPopped = true;for(let row = 0;row < state.fidgetGrid.size;row++){for(let col = 0;col < state.fidgetGrid.size;col++){const bubble = state.fidgetGrid.bubbles[row]?.[col];if(bubble){const bubbleState = state.bubbleStates[bubble.id];if(!bubbleState?.isPopped){allPopped = false;break;}}}if(!allPopped)break;}if(allPopped && state.isPlaying){set(draft =>{draft.isPlaying = false;draft.gameWon = true;draft.gameOver = true;});}}}))));

package/lib/module/games/popit-fidget/components/BubbleComponent.js

@@ -1,198 +1 @@
-"use strict";
-
-import React, { useState, useCallback, useMemo } from 'react';
-import { View, TouchableOpacity } from 'react-native';
-import { Canvas, Circle, LinearGradient, vec, Shadow } from '@shopify/react-native-skia';
-import { playHaptic, HapticType } from "../../../services/HapticsService.js";
-import { usePopitFidgetStore } from "../PopitFidgetStore.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const BubbleComponent = ({
-  bubble,
-  size,
-  onPop,
-  hapticEnabled = true,
-  isPlaying
-}) => {
-  // Get bubble state from store to prevent re-renders when other bubbles change
-  const bubbleState = usePopitFidgetStore(state => state.bubbleStates[bubble.id]);
-  const isPopped = bubbleState?.isPopped || false;
-  // Simple state for press feedback - no animations to prevent crashes
-  const [isPressed, setIsPressed] = useState(false);
-
-  // Memoize callbacks to prevent unnecessary re-renders
-  const handlePop = useCallback(() => {
-    // Only allow popping when game is actively playing
-    if (!isPlaying || isPopped) return;
-
-    // Enhanced haptic feedback - stronger for more satisfaction
-    playHaptic(HapticType.MEDIUM, hapticEnabled || false);
-
-    // Trigger pop callback
-    onPop();
-  }, [onPop, hapticEnabled, isPlaying, isPopped]);
-  const handlePressIn = useCallback(() => {
-    if (!isPopped && isPlaying) {
-      setIsPressed(true);
-      // Haptic feedback on press
-      playHaptic(HapticType.LIGHT, hapticEnabled || false);
-    }
-  }, [isPopped, isPlaying, hapticEnabled]);
-  const handlePressOut = useCallback(() => {
-    setIsPressed(false);
-  }, []);
-
-  // Memoize bubble style to prevent recalculation
-  const bubbleStyle = useMemo(() => ({
-    position: 'absolute',
-    left: bubble.x - size / 2,
-    top: bubble.y - size / 2,
-    width: size,
-    height: size,
-    transform: [{
-      scale: isPressed ? 0.95 : 1
-    }]
-  }), [bubble.x, bubble.y, size, isPressed]);
-
-  // Simplified popped state rendering
-  if (isPopped) {
-    return /*#__PURE__*/_jsx(View, {
-      style: bubbleStyle,
-      children: /*#__PURE__*/_jsxs(Canvas, {
-        style: {
-          width: size,
-          height: size
-        },
-        children: [/*#__PURE__*/_jsx(Circle, {
-          cx: size / 2,
-          cy: size / 2,
-          r: size / 2,
-          color: bubble.color,
-          children: /*#__PURE__*/_jsx(LinearGradient, {
-            start: vec(0, 0),
-            end: vec(size, size),
-            colors: [`${bubble.color}60`,
-            // Muted to show flatness
-            `${bubble.color}40`,
-            // More muted
-            `${bubble.color}30` // Very muted to show depression
-            ]
-          })
-        }), /*#__PURE__*/_jsx(Circle, {
-          cx: size / 2,
-          cy: size / 2 + 1,
-          r: size / 2 - 6,
-          color: bubble.color,
-          children: /*#__PURE__*/_jsx(LinearGradient, {
-            start: vec(size * 0.7, size * 0.7),
-            end: vec(size * 0.3, size * 0.3),
-            colors: ['#FFFFFF30',
-            // Light highlight
-            `${bubble.color}80`,
-            // Bubble color
-            '#00000020' // Subtle shadow
-            ]
-          })
-        }), /*#__PURE__*/_jsx(Circle, {
-          cx: size / 2 + size * 0.15,
-          cy: size / 2 + size * 0.2,
-          r: size * 0.06,
-          color: "#FFFFFF",
-          opacity: 0.6
-        })]
-      })
-    });
-  }
-
-  // Simplified unpopped bubble rendering with TouchableOpacity wrapper for iOS/Android compatibility
-  return /*#__PURE__*/_jsxs(View, {
-    style: bubbleStyle,
-    children: [/*#__PURE__*/_jsxs(Canvas, {
-      style: {
-        width: size,
-        height: size
-      },
-      children: [/*#__PURE__*/_jsx(Circle, {
-        cx: size / 2,
-        cy: size / 2,
-        r: size / 2,
-        color: bubble.color,
-        children: /*#__PURE__*/_jsx(LinearGradient, {
-          start: vec(0, 0),
-          end: vec(size, size),
-          colors: [`${bubble.color}E0`, `${bubble.color}A0`, `${bubble.color}80`]
-        })
-      }), /*#__PURE__*/_jsx(Circle, {
-        cx: size / 2,
-        cy: size / 2 + 2,
-        r: size / 2 - 4,
-        color: "rgba(0,0,0,0.15)"
-      }), /*#__PURE__*/_jsxs(Circle, {
-        cx: size / 2,
-        cy: size / 2 - 1,
-        r: size / 2 - 4,
-        color: bubble.color,
-        children: [/*#__PURE__*/_jsx(LinearGradient, {
-          start: vec(size * 0.2, size * 0.2),
-          end: vec(size * 0.8, size * 0.8),
-          colors: ['#FFFFFF', '#FFFFFFA0', bubble.color, `${bubble.color}C0`, '#00000020']
-        }), /*#__PURE__*/_jsx(Shadow, {
-          dx: 0,
-          dy: 3,
-          blur: 6,
-          color: "rgba(0,0,0,0.2)"
-        })]
-      }), /*#__PURE__*/_jsx(Circle, {
-        cx: size / 2 - size * 0.15,
-        cy: size / 2 - size * 0.2,
-        r: size * 0.12,
-        color: "#FFFFFF",
-        opacity: 0.8,
-        children: /*#__PURE__*/_jsx(LinearGradient, {
-          start: vec(0, 0),
-          end: vec(size * 0.24, size * 0.24),
-          colors: ['#FFFFFF', '#FFFFFF80', '#FFFFFF00']
-        })
-      }), /*#__PURE__*/_jsx(Circle, {
-        cx: size / 2 + size * 0.1,
-        cy: size / 2 - size * 0.15,
-        r: size * 0.06,
-        color: "#FFFFFF",
-        opacity: 0.6
-      })]
-    }), /*#__PURE__*/_jsx(TouchableOpacity, {
-      style: {
-        position: 'absolute',
-        top: 0,
-        left: 0,
-        width: size,
-        height: size,
-        backgroundColor: 'transparent'
-      },
-      onPress: handlePop,
-      onPressIn: handlePressIn,
-      onPressOut: handlePressOut,
-      activeOpacity: 1,
-      disabled: isPopped || !isPlaying,
-      hitSlop: {
-        top: 10,
-        bottom: 10,
-        left: 10,
-        right: 10
-      },
-      delayPressIn: 0,
-      delayPressOut: 0
-    })]
-  });
-};
-
-// Memoized BubbleComponent with custom comparison to prevent unnecessary re-renders
-// Note: We don't compare onPop function reference as it may change but functionality remains the same
-// Note: We don't compare bubble.isPopped as we now use store state which is subscribed individually
-const MemoizedBubbleComponent = /*#__PURE__*/React.memo(BubbleComponent, (prevProps, nextProps) => {
-  return prevProps.bubble.id === nextProps.bubble.id && prevProps.bubble.x === nextProps.bubble.x && prevProps.bubble.y === nextProps.bubble.y && prevProps.bubble.color === nextProps.bubble.color && prevProps.size === nextProps.size && prevProps.hapticEnabled === nextProps.hapticEnabled && prevProps.isPlaying === nextProps.isPlaying
-  // Removed bubble.isPopped comparison as we now use individual store subscriptions
-  // Removed onPop comparison as function reference may change but behavior is the same
-  ;
-});
-export default MemoizedBubbleComponent;
-//# sourceMappingURL=BubbleComponent.js.map
+"use strict";import React,{useState,useCallback,useMemo}from 'react';import{View,TouchableOpacity}from 'react-native';import{Canvas,Circle,LinearGradient,vec,Shadow}from '@shopify/react-native-skia';import{playHaptic,HapticType}from "../../../services/HapticsService.js";import{usePopitFidgetStore}from "../PopitFidgetStore.js";import{jsx as _jsx,jsxs as _jsxs}from "react/jsx-runtime";const BubbleComponent =({bubble,size,onPop,hapticEnabled = true,isPlaying})=>{const bubbleState = usePopitFidgetStore(state => state.bubbleStates[bubble.id]);const isPopped = bubbleState?.isPopped || false;const [isPressed,setIsPressed] = useState(false);const handlePop = useCallback(()=>{if(!isPlaying || isPopped)return;playHaptic(HapticType.MEDIUM,hapticEnabled || false);onPop();},[onPop,hapticEnabled,isPlaying,isPopped]);const handlePressIn = useCallback(()=>{if(!isPopped && isPlaying){setIsPressed(true);playHaptic(HapticType.LIGHT,hapticEnabled || false);}},[isPopped,isPlaying,hapticEnabled]);const handlePressOut = useCallback(()=>{setIsPressed(false);},[]);const bubbleStyle = useMemo(()=>({position:'absolute',left:bubble.x - size / 2,top:bubble.y - size / 2,width:size,height:size,transform:[{scale:isPressed ? 0.95:1}]}),[bubble.x,bubble.y,size,isPressed]);if(isPopped){return _jsx(View,{style:bubbleStyle,children:_jsxs(Canvas,{style:{width:size,height:size},children:[_jsx(Circle,{cx:size / 2,cy:size / 2,r:size / 2,color:bubble.color,children:_jsx(LinearGradient,{start:vec(0,0),end:vec(size,size),colors:[`${bubble.color}60`,`${bubble.color}40`,`${bubble.color}30` ]})}),_jsx(Circle,{cx:size / 2,cy:size / 2 + 1,r:size / 2 - 6,color:bubble.color,children:_jsx(LinearGradient,{start:vec(size * 0.7,size * 0.7),end:vec(size * 0.3,size * 0.3),colors:['#FFFFFF30',`${bubble.color}80`,'#00000020' ]})}),_jsx(Circle,{cx:size / 2 + size * 0.15,cy:size / 2 + size * 0.2,r:size * 0.06,color:"#FFFFFF",opacity:0.6})]})});}return _jsxs(View,{style:bubbleStyle,children:[_jsxs(Canvas,{style:{width:size,height:size},children:[_jsx(Circle,{cx:size / 2,cy:size / 2,r:size / 2,color:bubble.color,children:_jsx(LinearGradient,{start:vec(0,0),end:vec(size,size),colors:[`${bubble.color}E0`,`${bubble.color}A0`,`${bubble.color}80`]})}),_jsx(Circle,{cx:size / 2,cy:size / 2 + 2,r:size / 2 - 4,color:"rgba(0,0,0,0.15)"}),_jsxs(Circle,{cx:size / 2,cy:size / 2 - 1,r:size / 2 - 4,color:bubble.color,children:[_jsx(LinearGradient,{start:vec(size * 0.2,size * 0.2),end:vec(size * 0.8,size * 0.8),colors:['#FFFFFF','#FFFFFFA0',bubble.color,`${bubble.color}C0`,'#00000020']}),_jsx(Shadow,{dx:0,dy:3,blur:6,color:"rgba(0,0,0,0.2)"})]}),_jsx(Circle,{cx:size / 2 - size * 0.15,cy:size / 2 - size * 0.2,r:size * 0.12,color:"#FFFFFF",opacity:0.8,children:_jsx(LinearGradient,{start:vec(0,0),end:vec(size * 0.24,size * 0.24),colors:['#FFFFFF','#FFFFFF80','#FFFFFF00']})}),_jsx(Circle,{cx:size / 2 + size * 0.1,cy:size / 2 - size * 0.15,r:size * 0.06,color:"#FFFFFF",opacity:0.6})]}),_jsx(TouchableOpacity,{style:{position:'absolute',top:0,left:0,width:size,height:size,backgroundColor:'transparent'},onPress:handlePop,onPressIn:handlePressIn,onPressOut:handlePressOut,activeOpacity:1,disabled:isPopped || !isPlaying,hitSlop:{top:10,bottom:10,left:10,right:10},delayPressIn:0,delayPressOut:0})]});};const MemoizedBubbleComponent = React.memo(BubbleComponent,(prevProps,nextProps)=>{return prevProps.bubble.id === nextProps.bubble.id && prevProps.bubble.x === nextProps.bubble.x && prevProps.bubble.y === nextProps.bubble.y && prevProps.bubble.color === nextProps.bubble.color && prevProps.size === nextProps.size && prevProps.hapticEnabled === nextProps.hapticEnabled && prevProps.isPlaying === nextProps.isPlaying;});export default MemoizedBubbleComponent;