diff --git a/src/renderer/components/Meta.tsx b/src/renderer/components/Meta.tsx index 900f1159..29a2c4e7 100644 --- a/src/renderer/components/Meta.tsx +++ b/src/renderer/components/Meta.tsx @@ -430,7 +430,7 @@ export default class Meta extends React.Component { createStyles({ deleteIcon: { @@ -55,7 +56,7 @@ class Tutorial extends React.Component { classes: any, config: Config, route: Route[], - scene: Scene, + scene: Scene | SceneGrid, tutorial: string, onDoneTutorial(lastTutorial: string): void, onSetTutorial(nextTutorial: string): void, @@ -1189,7 +1190,7 @@ class Tutorial extends React.Component { Audio Library - > + From here we can
  • manage tags
  • @@ -1663,6 +1664,11 @@ class Tutorial extends React.Component { Make this grid 2x2 + + + ; break; case SGT.cells: @@ -1854,7 +1860,7 @@ class Tutorial extends React.Component { return; } case "scene": - if (this.props.scene.generatorWeights == null) { + if ((this.props.scene as Scene).generatorWeights == null) { switch (this.props.config.tutorials.sceneDetail) { case SDT.welcome: this.setTutorial(SDT.title); @@ -1932,21 +1938,21 @@ class Tutorial extends React.Component { this.setTutorial(SDT.effects2); return; case SDT.effects2: - if (this.props.scene.zoom == true) { + if ((this.props.scene as Scene).zoom == true) { this.props.onDoneTutorial(SDT.zoom1); } else { this.setTutorial(SDT.zoom1); } return; case SDT.zoom1: - if (this.props.scene.zoomStart == 0.8 && this.props.scene.zoomEnd == 1.2) { + if ((this.props.scene as Scene).zoomStart == 0.8 && (this.props.scene as Scene).zoomEnd == 1.2) { this.props.onDoneTutorial(SDT.zoom2); } else { this.setTutorial(SDT.zoom2); } return; case SDT.zoom2: - if (this.props.scene.transTF == TF.sin) { + if ((this.props.scene as Scene).transTF == TF.sin) { this.props.onDoneTutorial(SDT.zoom3); } else { this.setTutorial(SDT.zoom3); @@ -1956,7 +1962,7 @@ class Tutorial extends React.Component { this.setTutorial(SDT.zoom4); return; case SDT.zoom4: - if (this.props.scene.crossFade) { + if ((this.props.scene as Scene).crossFade) { this.props.onDoneTutorial(SDT.fade1); } else { this.setTutorial(SDT.fade1); @@ -2185,17 +2191,20 @@ class Tutorial extends React.Component { onSkipStep() { switch (this.props.tutorial) { case SDT.zoom1: - this.props.scene.zoom = true; + (this.props.scene as Scene).zoom = true; break; case SDT.zoom2: - this.props.scene.zoomStart = 0.8; - this.props.scene.zoomEnd = 1.2; + (this.props.scene as Scene).zoomStart = 0.8; + (this.props.scene as Scene).zoomEnd = 1.2; break; case SDT.zoom3: - this.props.scene.transTF = TF.sin; + (this.props.scene as Scene).transTF = TF.sin; break; case SDT.fade1: - this.props.scene.crossFade = true; + (this.props.scene as Scene).crossFade = true; + break; + case SGT.dimensions: + (this.props.scene as SceneGrid).grid = [[-1, -1], [-1, -1]]; break; } this.onContinue(); diff --git a/src/renderer/components/config/GridSetup.tsx b/src/renderer/components/config/GridSetup.tsx index 0309e93f..ad13c260 100644 --- a/src/renderer/components/config/GridSetup.tsx +++ b/src/renderer/components/config/GridSetup.tsx @@ -314,6 +314,30 @@ class GridSetup extends React.Component { newGrid[1][0] = sceneID; newGrid[1][1] = sceneID; this.changeKey('grid', newGrid); + } else if (this.props.tutorial == SGT.cells) { + let height = this.state.height; + let width = this.state.width; + let changed = false; + if (this.props.grid.grid.length != height) { + height = this.props.grid.grid.length; + this.setState({height: height}); + changed = true; + } + if (this.props.grid.grid[0].length != width) { + width = this.props.grid.grid[0].length; + this.setState({width: width}); + changed = true; + } + if (changed && width == 2 && height == 2) { + this.props.onTutorial(SGT.dimensions); + const sceneID = this.props.allScenes[0].id; + const newGrid = this.props.grid.grid; + newGrid[0][0] = sceneID; + newGrid[0][1] = sceneID; + newGrid[1][0] = sceneID; + newGrid[1][1] = sceneID; + this.changeKey('grid', newGrid); + } } }