## module:Tutorial(appInstance, onTutorialClosedopt)

Display and manage the tutorial

#### new module:Tutorial(appInstance, onTutorialClosedopt)
`modules/ui/Tutorial.js`, `line 5`

  ##### Parameters:

  Name | Type | Attributes | Description
  --- | --- | --- | ---
  `appInstance` | App |  | instance of App for this tutorial
  `onTutorialClosed` | function | <optional> | callback function when user closes or finishes the tutorial

### Members

#### $tutorialContent :Array
`modules/ui/Tutorial.js`, `line 33`

  jQuery element for the dynamic part of the tutorial popup (text and buttons that are dependent on the current state of the tutorial)

#### $tutorialWindow :jQuery.element
`modules/ui/Tutorial.js`, `line 27`

  jQuery element containing the tutorial popup

#### appInstance :App
`modules/ui/Tutorial.js`, `line 15`

  instance of App for this tutorial

#### currentStep :Number
`modules/ui/Tutorial.js`, `line 21`

  helper variable for the `step` property, stores current state of the tutorial (step `0` means that tutorial is closed)

#### step
`modules/ui/Tutorial.js`, `line 55`

  get the current step of the tutorial, this number corresponds to the index in the `this.steps` array that contains the function for the last displayed step

#### step
`modules/ui/Tutorial.js`, `line 63`

  change the current step of the tutorial, `0` means "stop the tutorial"

#### steps :Array
`modules/ui/Tutorial.js`, `line 40`

  array of functions that represent intividual steps in the tutorial by default populated with step `0` that closes the tutorial

### Methods

#### closeWindow(onTutorialClosedopt)
`modules/ui/Tutorial.js`, `line 356`

  close the tutorial window

  ##### Parameters:

  Name | Type | Attributes | Description
  --- | --- | --- | ---
  `onTutorialClosed` | function | <optional> | callback function that is called when the tutorial is closed

#### displayWindow()
`modules/ui/Tutorial.js`, `line 348`

  display the tutorial window

#### next()
`modules/ui/Tutorial.js`, `line 505`

  go to the next step of the tutorial

#### onBoxMoved()
`modules/ui/Tutorial.js`, `line 95`

  tutorial hook, called when a box is moved

#### onBoxRotated()
`modules/ui/Tutorial.js`, `line 100`

  tutorial hook, called when a box is rotated

#### onCanvasMoved()
`modules/ui/Tutorial.js`, `line 110`

  tutorial hook, called when the canvas is moved

#### onCanvasZoomed()
`modules/ui/Tutorial.js`, `line 115`

  tutorial hook, called when the canvas is zoomed

#### onChangeInputBoxState()
`modules/ui/Tutorial.js`, `line 125`

  tutorial hook, called when user changes the state of an input box

#### onContextMenuOpened()
`modules/ui/Tutorial.js`, `line 85`

  tutorial hook, called when the context menu is opened

#### onElementAdded()
`modules/ui/Tutorial.js`, `line 90`

  tutorial hook, called when a new element is added

#### onElementRemoved()
`modules/ui/Tutorial.js`, `line 120`

  tutorial hook, called when a box is removed

#### onOutputBoxTrue()
`modules/ui/Tutorial.js`, `line 105`

  tutorial hook, called when an output box value is set to `on`

#### prev()
`modules/ui/Tutorial.js`, `line 512`

  go to the previous step of the tutorial

#### resetHooks()
`modules/ui/Tutorial.js`, `line 81`

  reset all tutorial hooks

#### setUpTutorial()
`modules/ui/Tutorial.js`, `line 131`

  set up the tutorial: reset all tutorial hooks and define the order of tutorial steps

#### start()
`modules/ui/Tutorial.js`, `line 498`

  start the tutorial

#### stepAddBoxes()
`modules/ui/Tutorial.js`, `line 181`

  tutorial step: add input box, output box and a NOT gate

#### stepFinish()
`modules/ui/Tutorial.js`, `line 323`

  tutorial step: ask the user if they want to clean the canvas before closing the tutorial

#### stepMoveBoxes()
`modules/ui/Tutorial.js`, `line 249`

  tutorial step: move the boxes

#### stepMoveCanvas()
`modules/ui/Tutorial.js`, `line 220`

  tutorial step: move the canvas

#### stepRemoveBox()
`modules/ui/Tutorial.js`, `line 308`

  tutorial step: remove a box

#### stepWelcome()
`modules/ui/Tutorial.js`, `line 168`

  tutorial step: display context menu

#### stepWiring()
`modules/ui/Tutorial.js`, `line 276`

  tutorial step: create an invertor

#### stepZoomCanvas()
`modules/ui/Tutorial.js`, `line 235`

  tutorial step: zoom the canvas

#### stop()
`modules/ui/Tutorial.js`, `line 519`

  stop the tutorial

#### switchInputBox()
`modules/ui/Tutorial.js`, `line 293`

  tutorial step: change the state of an input box

#### windowChoice(…choices)
`modules/ui/Tutorial.js`, `line 478`

  add buttons with choices to the tutorial window

  ##### Parameters:

  Name | Type | Attributes | Description
  --- | --- | --- | ---
  `choices` | object | <repeatable> | each choice is an object in with a `string` property text and a `function` property func

#### windowContent(…text)
`modules/ui/Tutorial.js`, `line 368`

  set the tutorial window text content

  ##### Parameters:

  Name | Type | Attributes | Description
  --- | --- | --- | ---
  `text` | string | <repeatable> | each string is a separate paragraph