Generated by XState Viz: https://xstate.js.org/viz

machine.js

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)
  
  const fetchMachine = Machine({
    id: 'boardLogic',
    initial: 'idle',
    context: {
      width: 4,
      height: 8,
      tileTypes: 4,
  
      topmostRow: 8 - 1,
      bottommostRow: 0,
      leftmostColumn: 0,
      rightmostColumn: 4 - 1,
  
      /** @type {number} In seconds. */
      growthSpeed: 1,
  
      /** @type {number} In seconds. */
      growthElapsed: 0,
  
      rowSelected: 0,
    },
    states: {
      idle: {
        on: {
          GROW: 'ticking',
          MOVE_ROW_SELECTOR_UP: {
            actions: ['moveSelectorUp'],
          },
          MOVE_ROW_SELECTOR_DOWN: {
            actions: ['moveSelectorDown'],
          },
          ROTATE_ROW_LEFT: 'awaitingMatchResolution',
          ROTATE_ROW_RIGHT: 'awaitingMatchResolution',
        },
      },
      
      ticking: {
        entry: 'grow',
        always: [
          { target: 'addingRow', cond: 'shouldAddRow' },
          { target: 'idle' },
        ],
      },

      addingRow: {
        entry: 'addRow',
        always: {target: 'awaitingMatchResolution'},
      },
  
      awaitingMatchResolution: {
        on: {
          RESOLVE_MATCHES: 'awaitingGravityResolution',
        },
      },
  
      awaitingGravityResolution: {
        on: {
          RESOLVE_GRAVITY: 'gravityResolved',
        },
      },
  
      gravityResolved: {
        always: { target: 'idle' },
      },
  
      gameOver: {
        type: 'final',
      },
    },
  },
  {
    guards: {
      shouldAddRow: ({ growthElapsed, growthSpeed }) => {
        return growthElapsed > growthSpeed;
      },
    },
        
    actions: {
      grow: assign({
        growthElapsed: (context, event) => {
          return context.growthElapsed + 0.2;
        },
      }),
      
      addRow: assign({
        growthElapsed: context => 0,
        // TODO: update the board
      }),
      
      moveSelectorUp: assign({
        rowSelected: context => {
          const min = context.bottommostRow;
          const max = context.topmostRow;
          const n = context.rowSelected + 1;
          // return clamp(min, max, n);
          return Math.min(Math.max(n, min), max);
        },
      }),
  
      moveSelectorDown: assign({
        rowSelected: context => {
          const min = context.bottommostRow;
          const max = context.topmostRow;
          const n = context.rowSelected - 1;
          // return clamp(min, max, n);
          return Math.min(Math.max(n, min), max);
        },
      }),
    },
  });