design a simple a choose your own adventure text based game

[Bundaberg North5E42]

Ok team,

thought I woud try to nail something a bit more simple - so how about this-

A text based game with 10 different states/pages you can get to.

The text is on an external class file so that if you can change it without having to go into the animate file.

extention activity 1

I was thinking once I get the text to work I can then have 10 different Movieclips on the stage that can become visible when its their turn (to add images to the text)

extention activity 2

There might be a couple of points in the story where you get lost or fight a zombie and need to roll above 3 on a dice to give some randomness to the outcome of your choice.

the mainText is a dynamic text box on the stage

but to start here is the code I have so far that works-

class Game{
	constructor(stage, root){
		this.stage = stage;
		this.root = root;
		
		this.init();
	}
	
	init(){
        this.mainText = this.root.mainText;
		const game = this;
		createjs.Ticker.addEventListener("tick", function(){ game.update(); })
		
		this.newGame();
	}
	
newGame(){
		var str = "hello world";
    
    
		this.mainText.text = str;
	}
}

But why cant I set that variable at the top of the code?  If I try to put this.str at the start (or var or let) it wont work?

Thanks for your help and have a great day

Aa

[Bundaberg North5E42]

class Game{
	constructor(stage, root){
		this.stage = stage;
		this.root = root;
		this.str = "start";
		this.init();

	}
	
	init(){
 
        this.mainText = this.root.mainText;
		const game = this;
		createjs.Ticker.addEventListener("tick", function(){ game.update(); })
        this.setState = 0;
    
		
		
	}
	
update(){
		if (this.setState == 0 ){
            this.str = "yes";
        }
    this.setText();
	}
    setText(){
        this.mainText.text = this.str;
   
    }
}

So I got this to work so far- But I dont want it to update every frame like a shooter, just when a button gets pressed (or a choice gets made) - so I need to change the update() from being connected to the tick to a "click" event listener.

[Bundaberg North5E42]

class Game{
	constructor(stage, root){
		this.stage = stage;
		this.root = root;
		this.str = "start";
		this.init();

	}
	
	init(){
 
        this.mainText = this.root.mainText;
		const game = this;
		this.root.starter.addEventListener("click", function(){ game.update(); })
        this.setState = 0;
    
		
		
	}
	
update(){
		if (this.setState == 0 ){
            this.root.starter.visible = false;
            this.str = "yes";
        }
    this.setText();
	}
    setText(){
        this.mainText.text = this.str;
   
    }
}

getting somewhere!