Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Exercise: Making a Game with Script Editor

Table of ContentsmaxLevel4minLevel1includeoutlinefalseindentexcludeExercise: Making a Game with Script Editortypelistprintabletrueclass

Script Editor Configuration

  1. Create eight Tags. The first tag will be named “Color,” and it will be a STRING tag. Set the default value to #ff0000. Another tag named “Game ON.” This will be a BOOL with an Initial Value of false. Another tag named Points. This will be an INT (INT16) tag. Another named “sleepTime” and “level”. These both will be INT(INT16) tags. The tag sleepTime will be a default of 500. The tag level will be defaulted at one. Another BOOL named clicked. The next tag will be “difficulty”; this will be an INT(INT16). The final tag default_sleep will be an INT(INT16) with a default of 500.

  1. Select the page and rename it to “Main Menu.” Under Appearances, select the Background Color to be Black.

  2. Createthree Text Boxes. The first one will say “Main Menu”. Under appearances, select a Black Fill, and White Font Color. The final change will be the Font Size set to 30. The second one will say, “Start Game!”. Under appearances, select a Black Fill, and White Font Color. The final one will say “Exit Program”. Under appearances, select a Black Fill, and White Font Color. Set these on the screen evenly spaced apart in the middle, going down the screen.

  1. Create two new pages. One will be named “Gameplay”. The second will be named “Selection”. Both of these screens will have Black Background Colors.

  2. On the Gameplay Page, Create two Text Boxes and one Rectangle. Drag one Text Box into the top center of the page. Under appearances, select a Black Fill, and White Font Color. Move the Rectangle to the center of the screen. Drag and Drop the “Color” Tag onto the Fill section under the Appearance tab of the Rectangle. Drag the “Points” Tag onto the Text Box. The last Text Box will be placed on the bottom left of the screen. Rename the text to “Exit”. Under appearances, select a Black Fill, and White Font Color.

  1. On the Selection Page, create three Text Boxes. The first one will have text saying “Easy,” and second with “Medium,” and a third with “Hard”. Place them on the screen and spread them out in a way so that none overlaps with each other. Under appearances, select a Black-and White Font Color.

  1. Now that all the pages are created, it is time to write all the scripts we need. We will need nine scripts for all of the functionality to work. All of the created scripts are to be set to Manual Scripts. The first script is named “Gameplay,” copy and paste the following code into a script named “Gameplay”:

Code Block
languagejs
while(tag.read("Game ON")){
	var currPoint = tag.read("Points"); // saves the current points
	var chance = Math.floor( Math.random() * (100 - 1 + 1)) + 1; // random num generator
	tag.write("clicked", 0); // resets click status
	thread.msleep(100);
	if(chance > 50){ // 50/50 chance of being green or red
		tag.write("Color", "#00FF00");
	}
	else{
		tag.write("Color", "#FF0000");
	}
	thread.msleep(tag.read("sleepTime"));
	if(tag.read("Points") > currPoint){ // if the user gets a point
		tag.write("level", tag.read("Points") + 1); // increases the level
		thread.msleep(100);
		if(tag.read("sleepTime") > 250) // as long as sleep is not below 250 ms
			tag.write("sleepTime", tag.read("default_sleep") - (tag.read("Points") * 20)); // reduce it by 20 for every point
		thread.msleep(100);
	}
}

The next one is titled “Exit Game”. Copy and paste the following code into a script named “Exit Game”:

Code Block
system.exit(); // will just quit the game 

The next one is titled “Start Game”. Copy and paste the following code into a script named “Start Game”:

Code Block
page.open("Selection"); // opens the difficulty selection screen

The next one is titled “Point”. Copy and paste the following code into a script named “Point”:

Code Block
while(!tag.read("clicked")){ // while user has not clicked
	tag.write("clicked", 1); // will set that the user has clicked
	if(tag.read("Color") == "#FF0000")
	{
		tag.write("Points", tag.read("Points") - 1); // lose a point if red
		
	}
	if(tag.read("Color") == "#00FF00")
	{
		tag.write("Points", tag.read("Points") + 1); // gain a point if green
		thread.msleep(100);
		tag.write("Color", "#FF0000"); // change color to red.
	}
}

The next one is titled “Difficulty”. Copy and paste the following code into a script named “Difficulty”:

Code Block
switch(tag.read("difficulty")){
	case 1:
		tag.write("sleepTime", 1500);
		tag.write("default_sleep", 1500);
		page.open("Gameplay");
		tag.write("Game ON", 1);
		thread.msleep(100);
		system.runScript("Gameplay");
		break;
	case 2:
		tag.write("sleepTime", 1000);
		tag.write("default_sleep", 1000);
		page.open("Gameplay");
		tag.write("Game ON", 1);
		thread.msleep(100);
		system.runScript("Gameplay");
		break;
	case 3:
		tag.write("sleepTime", 500);
		tag.write("default_sleep", 500);
		page.open("Gameplay");
		tag.write("Game ON", 1);
		thread.msleep(100);
		system.runScript("Gameplay");
		break;
}

The next one is titled “Hard_Selection”. Copy and paste the following code into a script named “Hard_Selection”:

Code Block
tag.write("difficulty", 3); //difficulty set to hard
thread.msleep(100);
system.runScript("Difficulty");

The next one is titled “Med_Selection”. Copy and paste the following code into a script named “Med_Selection”:

Code Block
tag.write("difficulty", 2);// difficulty set to medium
thread.msleep(100);
system.runScript("Difficulty");

The next one is titled “Easy_Selection”. Copy and paste the following code into a script named “Easy_Selection”:

Code Block
tag.write("difficulty", 1); //difficulty set to easy
thread.msleep(100);
system.runScript("Difficulty");

The final script is titled “Return Main Menu.” Copy and paste the following cope into a script named “Return Main Menu”:

Code Block
page.open("Main Menu");
thread.msleep(100);
tag.write("Game ON", 0);
thread.msleep(100);
tag.write("Points", 0);
tag.write("level", 1);
thread.msleep(100);
  1. Now, we have to attach these scripts to some of the objects for this game to function properly. On the Main Menu, in the Text Box with “Start Game,” under the Actions Tab, select the “Start Game” script under On Press. For the Text Box saying “Exit Program,” put the “Exit Game” script in On Press. Now, on the Selection Page, select the Text Box that says “Easy” and under the Actions Tab, and On Press, select the Easy_selection. For each difficulty, put the respective script. For Medium, put the Med_Selection script; for Hard, select the Hard_selection Script. Finally, under the Gameplay Page, on the Rectangle, on the Actions Tab under On Press, select the “Point Script,” for the Exit Text Box, select the “Return to Main Menu” script.

Script Editor Runtime

  1. Click Tools >Launch Simulator to launch the Canvas Simulator.

  1. Click on Start Game! This will open up the difficulty selection screen. Select any difficulty. This will then open up the gameplay screen.

  1. Click on the box when it turns green; the text at the top should increment the number of times you click the box. This will also cause the level to increase and the sleepTime to decrease. Click exit whenever the user is ready to move on.

  1. Click on “Start Game” again, and click a new difficulty. Once done with playing the game, click the “Exit Game” text to exit fully.