Skip to content

Instantly share code, notes, and snippets.

@ShMcK
Created September 5, 2019 04:08
Show Gist options
  • Select an option

  • Save ShMcK/9d85cfe188cb27ffcfad79c18ac2e36e to your computer and use it in GitHub Desktop.

Select an option

Save ShMcK/9d85cfe188cb27ffcfad79c18ac2e36e to your computer and use it in GitHub Desktop.

Revisions

  1. ShMcK created this gist Sep 5, 2019.
    181 changes: 181 additions & 0 deletions machine.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,181 @@

    // Available variables:
    // - Machine
    // - interpret
    // - assign
    // - send
    // - sendParent
    // - spawn
    // - raise
    // - actions
    // - XState (all XState exports)

    const fetchMachine = Machine({
    id: 'root',
    initial: 'Start',
    context: {
    tutorial: null,
    position: {levelId: '', stageId: '', stepId: ''},
    progress: {
    levels: {},
    stages: {},
    steps: {},
    complete: false
    }
    },
    states: {
    Start: {
    initial: 'Startup',
    states: {
    Startup: {
    onEntry: ['newOrContinue'],
    on: {
    CONTINUE: 'ContinueTutorial',
    NEW: 'NewTutorial',
    },
    },
    NewTutorial: {
    id: 'start-new-tutorial',
    initial: 'SelectTutorial',
    states: {
    SelectTutorial: {
    on: {
    TUTORIAL_START: {
    target: 'InitializeTutorial',
    actions: ['setTutorial'],
    },
    },
    },
    InitializeTutorial: {
    onEntry: ['tutorialStart'],
    on: {
    TUTORIAL_LOADED: '#tutorial',
    },
    },
    },
    },
    ContinueTutorial: {
    onEntry: ['tutorialContinue'],
    on: {
    TUTORIAL_START: '#tutorial-load-next',
    },
    },
    },
    },
    Tutorial: {
    id: 'tutorial',
    initial: 'Initialize',
    states: {
    Initialize: {
    onEntry: ['initializeNewTutorial'],
    after: {
    0: 'Summary',
    },
    },
    LoadNext: {
    id: 'tutorial-load-next',
    onEntry: ['loadNext'],
    on: {
    NEXT_STEP: {
    target: 'Stage',
    actions: ['updatePosition']
    },
    NEXT_STAGE: {
    target: 'Stage',
    actions: ['updatePosition']
    },
    NEXT_LEVEL: {
    target: 'Level',
    actions: ['updatePosition']
    },
    COMPLETED: '#completed-tutorial'
    }
    },

    Summary: {
    on: {
    LOAD_TUTORIAL: {
    target: 'Level',
    actions: ['tutorialConfig', 'initPosition', 'setTutorial']
    }
    },
    },
    Level: {
    onEntry: ['loadLevel'],
    on: {
    NEXT: 'Stage',
    BACK: 'Summary',
    },
    },
    Stage: {
    onEntry: ['loadStage'],
    initial: 'Normal',
    states: {
    Normal: {
    on: {
    TEST_RUN: {
    target: 'TestRunning',
    actions: 'testStart',
    },
    STEP_SOLUTION_LOAD: {
    actions: ['callSolution'],
    },
    },
    },
    TestRunning: {
    onEntry: ['testStart'],
    on: {
    TEST_PASS: {
    target: 'TestPass',
    // TODO: combine updateStepProgress & updateStepPosition
    actions: ['updateStepProgress']
    },
    TEST_FAIL: 'TestFail',
    },
    },
    TestPass: {
    onExit: ['updateStepPosition'],
    after: {
    1000: 'StepNext',
    },
    },
    TestFail: {
    onEntry: ['testFail'],
    after: {
    0: 'Normal',
    },
    },
    StepNext: {
    onEntry: ['stepNext'],
    on: {
    LOAD_NEXT_STEP: {
    target: 'Normal',
    actions: ['loadStep']
    },
    STAGE_COMPLETE: {
    target: "StageComplete",
    actions: ['updateStageProgress']
    }
    }
    },
    StageComplete: {
    on: {
    STAGE_NEXT: '#tutorial-load-next',
    },
    },
    },
    },
    Completed: {
    id: 'completed-tutorial',
    on: {
    SELECT_TUTORIAL: {
    target: '#start-new-tutorial',
    actions: ['reset']
    }
    }
    },
    },
    },
    },
    });