Lab 16 Reflection

     Lab 16 implemented skills from our previous lab to make a web page with a game embedded in it. We were to make a game called "Color Sleuth", a 2 player game in which the players are presented with 4 colored tiles. While the tiles are of the same base color one is slightly different. The player gains a point if they choose the different colored tile and losses 3 points if they choose the wrong one. The 2 players take turn until one gets 10 points and wins the game. This game, like other games created so far, was created in App Lab as part of a guided lesson. In short, we set variables meant to store data such as points. We created one main, checkCorrect(), function which itself is comprised of 3 function (and many if statements that call the sub functions under certain conditions). The sub functions were: switchPlayer(),  updateScore(),  setBoard(). They switched the player in control, updated the score, and (re)set the board every time they were called, respectively. The main function was called by event handlers for each button and let our game function as intended. To embed this game on our webpage we used the <iframe></iframe> tag like in the previous lab. We put the shareable link for src and added a /embed at the end of the URL to give functionality to the iframe.
     These skills are important for a web designer because they make it easier to add more functionality to a website. Iframes give a web designer the ability to embed interactive web pages inside another web page. This can be useful when a web designer wants to insert an interactive element without wanting to do too much coding on a single page. Since interactive elements along with other elements on a single page may require the designer open up many divs and troubleshoot the properties of every element on the page since they might be getting in the way of functionality the designer could simply create on page that has the interactive element and another page to house the element.  This way the designer doesn't have to pull out too many hairs when making an interactive site with JS and lessens the amount of troubleshooting necessary.