Tutorial System

Relevant source files

The following files were used as context for generating this wiki page:

• app/js/tutorial.js
• test-tutorial-disable.html
• src/renderer/save-manager.js
• index.html
• app/js/console.js

The Tutorial System is a feature designed to onboard new players by guiding them through the initial game mechanics. It operates as a multi-step, interactive guide presented within the game's terminal. The system is state-driven, progressing through steps as the player completes specific actions.

A key aspect of the tutorial is its integration with the Save System. When a player loads a saved game, the tutorial is automatically and forcefully completed and hidden. This ensures that returning players are not required to go through the tutorial again, providing a seamless transition back into the game. The tutorial state is managed by a global skidinc.tutorial object.

Core Logic and State

The entire tutorial is managed through the skidinc.tutorial object. This object holds the state and provides the core functions to control the tutorial flow.

Sources: app/js/tutorial.js:1-4

skidinc.tutorial Object Properties

Property	Type	Default	Description
enabled	Boolean	true	A flag to determine if the tutorial should run. Set to false when finished.
finish	Boolean	false	A flag indicating if the tutorial has been completed.
step	Number	0	The current step of the tutorial the player is on.

Sources: app/js/tutorial.js:1-4

Key Functions

Function	Description
begin()	Starts the tutorial if enabled is true and finish is false. Otherwise, it skips the intro and shows the main game screen.
switchStep()	Advances the tutorial to a specified step and calls core() to execute the logic for that step.
core()	The main logic hub containing a switch statement that defines the actions and text for each tutorial step.
finished()	Marks the tutorial as complete by setting enabled to false and finish to true. It also handles the UI transition from the intro screen to the main game screen.
skip()	A convenience function that calls finished() to immediately end the tutorial and enables console input.

Sources: app/js/tutorial.js:6-33

Tutorial Flow

The tutorial consists of four distinct steps (0-3), starting from the moment the game loads. Each step introduces a new concept to the player via the game's console.

Sources: app/js/tutorial.js:35-73

The following diagram illustrates the step-by-step progression of the tutorial.

Tutorial Steps Breakdown

Step	Player Action Required	System Response
0	username [yourUsername]	Introduces the game, the terminal, and prompts the player to set a username. Console input is enabled for this.
1	help	Prompts the player to use the help command to see available commands.
2	script [script_name]	Explains the script command for earning money and experience. Waits 5 seconds before displaying the prompt.
3	None	Displays a "TUTORIAL COMPLETE" message. After a 5-second delay, it calls finished() to transition to the main game.

Sources: app/js/tutorial.js:35-73, app/js/console.js:33-40

Integration with Save/Load System

The Tutorial System is tightly coupled with the SaveStateManager to ensure a smooth experience for players loading a saved game. When any save file is loaded, the tutorial is automatically marked as complete and all its UI elements are hidden.

Sources: src/renderer/save-manager.js

Disabling on Game Load

The SaveStateManager class contains specific logic to bypass the tutorial.

1. Applying Game State: When applyGameState is called with data from a save file, it explicitly sets window.skidinc.tutorial.finish = true. This is done for any save, regardless of whether the save file itself contains tutorial data.
2. Ensuring Completion: After applying the state, the ensureTutorialCompleted method is called. This function is the primary mechanism for disabling the tutorial.
3. Hiding UI: ensureTutorialCompleted calls hideTutorialElements, which removes all visual components of the tutorial from the DOM.

Sources: src/renderer/save-manager.js:464-474, src/renderer/save-manager.js:659-715, src/renderer/save-manager.js:555-619

The sequence diagram below shows the process when a user loads a game.

ensureTutorialCompleted() Method

This method is the cornerstone of the tutorial-disabling logic. Its responsibilities include:

• Setting skidinc.tutorial.enabled to false and finish to true.
• Calling the tutorial's own finished() and skip() methods to trigger its internal cleanup.
• Directly manipulating the DOM to hide the .intro screen and show the .game screen.
• Focusing the command input field to allow the player to immediately start playing.
• Enabling console input via skidinc.console.inputEnabled = true.
• Storing the completed tutorial state in localStorage as a fallback.

Sources: src/renderer/save-manager.js:659-715, test-tutorial-disable.html:41-92

Saving Game State

When the game state is gathered for saving via getCurrentGameState, the tutorial state is always set to be finished. This ensures that any new save file created will correctly disable the tutorial when loaded.

// From src/renderer/save-manager.js
          tutorial: {
            finish: true // Always mark tutorial as finished in saves
          },

Sources: src/renderer/save-manager.js:338-340

Summary

The Tutorial System serves as a guided introduction for new players, using the game's console as its primary interface. It is designed to be a one-time experience. The robust integration with the SaveStateManager ensures that upon loading any game, the tutorial is decisively and completely bypassed, allowing players to jump straight into the action without repetitive introductions. This is achieved by forcefully setting tutorial completion flags, calling cleanup functions, and directly manipulating the UI whenever a save is loaded.