Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

JavaScript Object-Oriented JavaScript (2015) Practice Project User Interface Code

Made my own practice game. I am stuck.

Hey all, Working off of the quiz we made here, I tried to make my own Hot or Not game. I made sample images that just show the numbers 1, 2, and 3, rather than showing pic of people. Each pic has an existing score. I am able to get the first score to display. I tried getting the buttons in the game interface to display the options 1 or 2 (1 will eventually be hot, and 2 will be not). I can not get the buttons to display 1 or 2. I don't know why. Can you help find the problem?

Here is the snapshot: https://w.trhou.se/z965v97cp9

Once I get there, I want to work on the voting aspect, when a vote of 1 (hot) will increase the current score by 1. A vote of 2 (not) will just move it to the next pic without raising the score.

Please help me out.

Thank you so much!

3 Answers

Steven Parker
Steven Parker
218,596 Points

A button will display the text placed between the start and end tags, as shown below using "Hot" but "1" could be used there instead:

        <button id="guess0" class="btn--default">Hot</button>

Also, in pic.js I happened to notice "this.votes === 1;", which is a comparison expression that does nothing by itself. Perhaps you intended to increase the value with an addition assignment, which would look like this:

    this.votes += 1;

Hi Steven Parker , Thanks for answer. I know that the button SHOULD be displaying the text between the tags, but it is not, which is why I am submitting my question. As for the other part in pic.js, that is the part I mentioned that I have not worked out yet. I am currently trying to figure out why the buttons aren't displaying. If you have any insight, please let me know.

Thanks!

Steven Parker
Steven Parker
218,596 Points

Before posting the answer, I modified the line shown above in the workspace, opened the preview, and it did indeed display the word "Hot" on the button.

Oh, thank thank you very much. I will check it out and see what happened.

I realize that I can hard code "Hot" and "Not" in. In the quiz exercise, those buttons were being filled dynamically. I am a bit at a loss right now. I am going to keep working on other exercises and come back to this game later. Maybe I will be able to work through the application better once I have a bit more experience.

Steven Parker
Steven Parker
218,596 Points

You could use the same mechanism as the course code to fill the labels from the script, but in your application they don't need to change for each answer so it makes more sense to add them to the HTML.

You are right. I was thinking about that. I am going to come back to this game when I have a bit more skill. I think it will be good practice. Thank you for your help.