An html multiple-choice game: The Spy part 2

<%= @topic_view.topic.title %>
<%= @topic_view.topic.average_rating %> <%= @topic_view.topic.posts.count { |p| !!p.custom_fields['rating'] } %>

I’ll put the answers in there.

I put the answers in there so you can cheat!

Do you guys think I should make a third part?

sorry for the delayed response. I was talking about your first game with black background.

Okay. I will try and fix that up today.

Is this shade of color okay?

this seems much better. You could make it even better by making the color light gray. This green color is a little bit brighter than necessary. By the way, you gave me a great idea to create a game for language learners. I’m an English teacher and I always use stories in my class.

1 Like

Do you guys think I should make a third part?

Why not? This could turn into something really serious with a little bit of css, animations and pictures

1 Like

How about a gray border and a greenish-gray background?

i think greenish-grey bg would be a good choice

1 Like

This good enough for you, man?

Here is how to use it:
//how to use the game engine
{
/*
To use it, here are the basic steps:
first, in your html tab, create as many div’s as scenes you want. each div should look like this:
<div class = "storytile scene[number]" id = "scene[number]"></div>.

Now you have to make sure the class scene number is the same as the id scene number. in this game I had 51 scenes. and a 52nd one to keep the game alive. always start at scene1. not 0.

Once you have an idea about how many scenes you need, you may use my css, or you can style the scenes however you want.

to use the functions, you will first learn how to use the `newTile()` function.

so first, let's say I am going to use my first scene.

in my html tab, I will put :

`<div class = "storytile scene1" id = "scene1"></div>`

in my JS tab, I will put:

`newTile('1','[h1 text]','[paragraph or main text]','[text of first button]','[text of second button]','[text of third button]','scene[number of next scene]','[number of next scene]','[number of next scene]');`

A little confusing. to make my intro, for example, I will write this:

`newTile('1','A RANDOM GAME','welcome to the random game! you can put html in this tab and can make text <b>STRONG!</b> and <em>ITALIC!</em> to start the game, you need to pick the right choice! Here is the first riddle: What gets bigger the more you take away?','a hole','uh... void','negative numbers?','scene2','scene3','scene4');`

I will explain all of the parameters:
the first one is the scene number. that means that the first scene (1) gets styled as so.
if the second scene or first button was correct, you'd write newTile('2','blah -- and so on...') which would bring you to the next scene.
if scene 2 was the wrong answer, you'd put fail('2','you lost!','blah...')

the second one it the title of the scene. if you don't want a title, you could enter the value as ''.

the third one is the section that tells the story.

the fourth, fifth and sixth ones are the first, second, and third texts on the buttons.

the last three are what scenes the buttons bring you to.
*/

}

@ConnerOw1115 bro, I did not get a chance to comment until now.
I have played the game and I died many times. You have to give me the cheat codes. Lol.

Here are the suggestions I have for you to improve your project.

  • Have only one ‘continue’ button on the first page or hide the other two.
  • Make the images bigger. I think that will make the game look nicer.
  • Set a minimum width on the text so that it will not go all the way across the screen on large monitors.
  • Make all the buttons the same size no matter what text is inside to keep things consistent.
  • You must add sound effects, that would be so cool since you created a game. There is a way to add sound to Codepen projects but I do not know how it is done.

I can tell you put a lot of work into the project. Good job!

1 Like

this bg color looks much more pleasant b/c it doesn’t cause any eye strain. Good job brother!

1 Like

Thank you sooo much for taking the time to create this awesome game and sharing your work with me brother. I really appreciate that. I’ll get back to you as soon as I have done my story game for English learners. You ROCK!

1 Like

I don’t know how to add sound either :frowning:
I have an answer button at the bottom of the other three.

I do have the cheat codes. there is a button that allows you to see the answers.

I was too lazy to only show one continue button.
I also couldn’t do sound effects. all other things you requested are done.

did you write this story on your own?

Yup. Parts are created along the way as I create more of the game.