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

machine.js

  function getSelectedAngle() {
    return 60
  }
  
  function getSliceNumber() {
    return 6
  }
  
  const pizzaMachine = Machine(
    {
      id: 'Pizza Cutter',
      initial: 'idle',
      context: {
        angle: 0,
        remain: 360,
        slice: 0,
        live: 3,
        counter: 0
      },

      states: 
      {
        idle: {
          on: {
            CREATE_ORDER: {
              target: 'haveOrder',
              actions: assign({
                slice: getSliceNumber
              })
            }
          }
        },
        haveOrder: {
          on: {
            INPUT_ANGLE: {
              target: 'updateAngle',
              actions: assign({
                angle: getSelectedAngle
              })
            }
          }
        },
        updateAngle: {
          on: {
            CONFIRM: 'cutting'
          }
        },
        cutting: {
          on: {
            CHECK: [
              {
                target: 'rotate', 
                cond: 'isNotDone'
              },
              {
                target: 'success',
                cond: 'isSuccess'
              },
              {
                target: 'failure'
              }
            ]
          }
        },
        rotate: {
          on: {
            UPDATE: {
                target: 'cutting',
                actions: assign({
                  remain: (context) => context.remain - context.angle,
                  slice: (context) => context.slice - 1
                })
              }
          }
        },
        success: {
          on: {
            UPDATE_COUNTER: {
              target: 'result',
              actions: assign({
                counter: (context) => context.counter + 1
              })
            }
          }
        },
        failure: {
          on: {
            UPDATE_LIVE: {
              target: 'result',
              actions: assign({
                live: (context) => context.live - 1
              })
            }
            
          }
        },
        result: {
          on: {
            CHECK: [
              {
                target: 'idle',
                cond: 'isAlive',
                actions: assign({
                  remain: 360,
                  angle: 0,
                  slice: 0
                })              
                
              },
              {
                target: 'gameover'
              }
              
            ]
          }
        },
        gameover: {}
      }
    },
    {
      guards: {
        isNotDone: context => context.remain > context.angle,
        isSuccess: context => context.remain === context.angle && context.slice === 1,
        isAlive: context => context.live > 0
      }
    }
    
  )