Need help completing assignment
Assignment12 CSC 230 Assignment 12 – Parallel Arrays –Voting for Actor in Films 100 points Pre-Lab (Do Before Lab): Read through the whole assignment; hints and details are spelled out throughout. Think about the programming that must be done. Bring materials – a way to save a copy for you. Main Assignment: Put two film actors pictures up for a vote and the user will vote for one or the other. Your program is to tally votes and present them when requested. . Provide the capability to: • Go – displaying two pictures randomly, • Vote for the actor in a particular film on the left • Vote for the actor in a particular film on the right • See All results – for all actors in films, display name of actor, name of film, chances, votes, percent of chances they were voted for • See Actor results – for the selected actor, display name of actor, name of film, chances, votes, percent of chances they were voted for • Reset –reset tally arrays back to zero, and clear pictures and results text area. The user should be kept informed of what’s is going on via information in the text area (see sample interaction – use friendly name, not file name): • Choice to be made • Vote recorded Background Knowledge:. • See sample interface pictures below for some examples of the page in action. Provided Details • You are provided a partial file as a starting point – it includes html and .css that creates an interface good enough for this assignment. • The provided file also has JavaScript, including: o Global variables that you can use. This is all based on parallel arrays that are providing. Code to create the arrays for pictures is included in the provided file. o Two other global variables representing indexes into the arrays. o a function for random number generation. • The page design is not crucial. Things are lined up. The colors are not awful. You can change CSS and HTML, but be careful, as we haven’t covered much. • Image files are provided in the .zip file on Canvas. These need to be extracted and put in the same folder as your other files. Task Details: • The parallel arrays are central to this assignment. You must use the arrays, as that is what we are exercising in this assignment. There is a set of 6 parallel arrays, which basically give info about actor and film o First names of actors (firstnames) o Last names of actors (lastnames) o The file names each containing a photo of actor (pictures) o Films the actor starred in (movies) o The number of times an actor in a film has been used as a choice (chances) o The number of votes the actor in a film has received (votes ) • Most buttons need to access the arrays, so they are declared as global. Any variables that are used only in one button should be declared locally in the event handling function. • Two global variables (named picture1Index and picture2Index respectively) should keep track of the index of the pictures currently displayed on the page. • Note: You can do anything to an array element that you can do to a regular element of the same type. This includes changing its value via assignment or incrementing. • You want to control what the user can do at a given time. o After the user clicks Go, they shouldn’t be able to hit Go again until they vote o After the user votes they shouldn’t be able to vote again; they should have to go back to “Go” to get a new selection of pictures (this will stop the ballot box stuffers!)) • There is no user input to validate. • Be sure your program works (i.e. gets the correct answers) - it doesn’t have to just run, it needs to run correctly. Think, “what different possibilities need to be checked?” For each, determine the correct answer by hand and see if your program gets it! Miscellaneous: Good Practices: o Put your name, e-mail address, date, and purpose of the program in JavaScript comments at the top of the JavaScript code (and comments in other files as well if used). The purpose should be what the program is supposed to do, not the learning goals. o Any variables that you declare should have meaningful names – descriptive of the data that they hold. o You must include comments that explain your JavaScript program in order to get full credit. o Help me grade - Add your name to mine on the web page where it says PUT STUDENT NAME HERE Hand in: • Compressed (zipped) folder with all of the project file(s) related to the project, submitted to Canvas. Be sure to include the image files you were given in the zip file. (zipping is important because Canvas will try to protect me from executable code) Sample Interface: (the beginning) (after pictures chosen from Go button) Note – info in the text boxes and text area list the actors name and film, not file name of the actor’s photo. It is a bit hard to see, but Go button is disabled (After voting) NOTE: info in text area states who was voted for (in this case Drew Barrymore), and Vote buttons are disabled and Go button is reenabled. (after a while of voting) If you hit “See All Results” button, you see data from all the relevant arrays. Note that votes percent is calculated on the fly and must avoid divide by zero. Next, choose a specific actor from the drop down (in this example Denzel Washington was chosen) and hit the “See Actor Results“ button. You see data from all the relevant arrays, but only the data for Denzel Washington. Once again, note that votes percent is calculated on the fly and must avoid divide by zero. After reset Note: Reset sets the arrays back, doesn’t just clear the interface. See all zeroes and Pct: -- when hitting “ See All Results“ button at this point.