Progress has been made. My incredibly simple and inelegant project has been a success. :) After restarting only 3, maybe 4 times. :(
The simplistics of how this works are as follows:
-All JavaScript is contained in a single function. The function is called when one of the buttons (top center) is clicked.
-A button onClick tag returns a unique ID of the chosen element and passes this variable into the function. This confirms the user choice.
-As previously mentioned computerChoice variable is determined by an 0.00 to 1.00 RNG. The number value is passed through an if else statement that splits the 0 to 1 value into thirds and assigns the 'computer's' choice based on which third the generated number has landed in.
-A local variable is created to convert the function id.
-The default function document.getElementById writes the player and computer input into a div tag, the winner / loser results are passed from within the if else statements described below.
-Three if else statements are created, one for each of the options the player is able to choose.
-Three more if else statements are nestled below each player choice option to compare their input versus the choice determined by the RNG.
-When the result is found, text is again set to be written via getElementById.
-A CSS style tag is applied to both div elements to apply some basic formatting for readability.
While this is an incredibly simple program, there are some design ideas and concepts at play here, namely:
-The KISS mantra. The option of allowing the user to manually input an answer (typed) into a prompt has been removed, this negates any need for excess scripting to accommodate for the what ifs of an incorrect or null response.
-The buttons also provide a cleaner layout experience. While its not much to look at now, prompts, especially on page load, are ugly and obtrusive. I'm also able to shape the design later to my liking for a much more modern (read; Less Geocities) look.
I'm not quite done with this little project just yet. I'm looking to expand on this with new 'versions' shortly. There are a few ideas I would like to implement, such as a counter for games or sets, another random element that will display a fourth option, "Magma!" This is an "I win" button for the player, but will also be added to the mix as a low percent chance choice for the computer as well. As discussed above, I'd like to beautify the experience with a modern look. After digging through some basic CSS code examples it became quite apparent I need to brush up on that. Given the simplicity of the program, I'd also like to streamline the code, although this isn't exactly a resource munching beast, there are other and likely better ways to have written this code.
And lastly, although the updates I'd like to perform are again small and seemingly simple changes, they do serve a purpose. The idea is to build good habits for revision control, assigned tasks- that is implementing one or a few new features at a time, and perhaps to punish myself a bit. I don't plan on doing these changes in an evening, but rather spread them out over the course of a few weeks, this way I can come back to the code and see a) just how easy it is to figure out where I left off (as if I'm looking at someone elses work), and b) should I fumble through new concepts along the way to; streamline the codes function and readability.
Up next, more reading, more guided tours.
No comments:
Post a Comment
Note: Only a member of this blog may post a comment.