Important Notice: Read all the requirements below. This is the second part of th

Important Notice: Read all the requirements below. This is the second part of the project, building off Project #1. Each part of the project will be equally weighted. NOTE: Make sure to zip all your files (i.e. 3 HTML files, 1 CSS file, all image files) in a folder. Do not submit individual files to D2L or else it will mess up the formatting. ● Link to instructions on how to zip and unzip your files: Mac vs. Windows MAKE SURE YOU READ ALL OF THE INSTRUCTIONS CAREFULLY BEFORE STARTING, ESPECIALLY THE NOTES AT THE END OF THE PROJECT. Overview For Project Part #2, you will be creating one new HTML page. All of the Javascript will go on the new HTML page. This HTML page will link to the other two pages from part #1 through the “navigation bar” in the 2 nd row of the table. You must use an IDE for this assignment. You may use Sublime Text, the IDE you should have downloaded from the lecture. Alternatively, if you have another preferred IDE, you may use that. You are not allowed to use any code generators for this part of the project. You must hand-type all of the HTML and CSS. Do not use tags beyond what is in your HTML, CSS, and JavaScript handouts (though you are allowed to use CSS properties/values not in the notes). Other tags and attributes are off-limits. DO NOT use the style attribute with any tag. Also, you may see examples online of people embedding their CSS in their HTML files with the use of a tag. Do not do this. All your CSS needs to be in its own file. You are only allowed to use tools and techniques I have shown you in the handouts or during class lectures. Use of any feature not covered in handouts or lectures will result in a zero for that portion of the project. For example, I did not show you how to change text color with JavaScript, but I did show you how to do it with HTML and CSS. Goal Reference image attached below. Please note that your page might look slightly different based on your chosen country and their corresponding temperatures. For a good chunk of your assignment, you will need to use Javascript to display the correct items on your webpage. If you use HTML, you will not receive credit. Please read the directions carefully to figure out which sections allow HTML and which require you to use Javascript. Culture Page: TIP: Save your file and check your web page periodically to ensure your changes are being correctly reflected. ——————————————————————————————————————— ● You will be adding on to the first part of the project. You will be creating a page with the subject of “The historic culture of the country”. ● When adding your own information, the subject material should be clean. ● No additional downloads for this project. You will create everything from scratch. Culture Page 1. Save the file as TheCulture.html in the text editor. 2. The table structure of the page will be identical to the first two pages you created including the link to the CSS file. The easiest thing to do would be to copy and paste one of those pages into TheCulture.html and change the third row’s contents. ● Change the tab title in the tags to say Culture. ● Change the text in the first row to the name of the country followed by a hyphen and then the word Culture. So, in my example, it would be Peru – Culture. ● In Row #2, make the word Home link back to the home page. ● In Row #2, make the word Cities link to the Cities page. ● In Row #2 cell #3, put the word Culture in the cell, but don’t make it a hyperlink. ● Keep the 4 th row of the table the same. 3. Go back to your homepage and your cities pages and add a hyperlink to this new page in the third cell of the 2 nd row. The text should say Culture and it should link to the TheCulture.html page. 4. For the body of your page in row #3, I want you to replace all the text (and any pictures) with a total of 200 words of text about the historic culture of the country you have chosen. ● For example: My country of Peru’s culture originates with the Incas. I might talk about the way they lived, the food they ate, and the traditions they had that have carried over to modern-day Peru. 5. Ensure that you are using at least one

tag in the Row #3 text to ensure that your CSS is working on this page too. 6. After the 200 words, but still in row #3, I want you to add one simple horizontal rule tag. Javascript Tasks Note: The following tasks should be completed using JavaScript instead of HTML. 1. Do some research and look up the average Fahrenheit temperature for your country in your birth month and also the average Fahrenheit temperature for your country 3 months after your birth month. ● For example, I was born in July and the average temperature in Peru in July is 66 degrees Fahrenheit the average temperature 3 months later in October is 68. ● Utilizing the keyword var, create 3 variables in your javascript file with the following names: current_temperature, future_temperature, and temperature_difference. ● Now assign the numeric value to the first two variables. In my case, I would assign the number 66 to current_temperature and the number 68 to future_temperature. 2. In a separate programming statement, subtract the current_temperature from the future_temperature and save the results in temperature_difference. ● In my case, the value in temperature_difference would be 2 (because of the math: 68-66). 3. After the

tag from step 6 in the Culture Page section, put the following text with a document.write programming statement: The average temperature for countryname in birthmonth is current_temperature degrees. ● Replace the word countryname with the country you are using, replace the birthmonth with the month you were born, and then concatenate the value stored in the current_temperature variable (you do not need to italicize or bold this text). ● For example, I would have used the text: The average temperature for Peru in July is 66 degrees. 4. Using a separate document.write statement, add a line break after step 3’s text. 5. Create a while loop that: ● Will print the following: oo- to the screen every time through the loop (if you are wondering that is two lowercase letter “oh’s” with a hyphen after them). Otherwise known as the letter that follows the letter “n” in the alphabet. ● Add this after step 4’s line break. ● The loop will repeat based on the absolute value of the number stored in temperature_difference. ○In my case, the absolute value of 2 is 2. As a result of the math, my loop would repeat 2 times and print oo-oo- ○ You may find the abs method described here useful: https://www.w3schools.com/jsref/jsref_obj_math.asp ● Note: If there is no temperature difference between your 3 months, then your code will skip over your loop, and that is okay. It is not okay to not have the loop there though aka you must have a working while loop. 6. Using a separate document.write statement, add a line break after step 5’s oo- text. If Statements Note: The following tasks should be completed using JavaScript instead of HTML. 1. Utilizing the data you collected and stored in your variables create a single if statement that will do the following: ● If the temperature_difference value is less than zero, use a document.write statement to print the following text in a blue italicized font color: The weather is getting colder. ● Else if the temperature_difference is equal to 0 or 1 (you must use a logical and or logical or), use a document.write statement to print the text in a green italicized font color: The weather is pretty much staying the same. ● Else if the temperature_difference is greater than 1 but less than or equal to 4 (you must use a logical and or logical or), use a document.write statement to print the following text in a red italicized font color: The weather is heating up a little bit. ● Otherwise, print the following text in a purple italicized font color: The weather is getting really hot. ● Note: Make sure you are getting the correct results. Test your code for all four scenarios to make sure every branch of the if is working correctly. ● Common mistakes: ○Make sure all numeric values are saved and compared as numbers and not Strings. For example, assigning a numeric value to a variable called my_answer would be something like 20 not “20”. Also, when comparing values, you would check if(my_answer>15) not if(my_answer>”15”) as the latter would be comparing a numeric value against a String value. ○When utilizing AND or OR operators, make sure each condition is complete. For example, if(my_answer==24 || 36) would be incorrect, but if(my_answer==24 || my_answer==36) is correct. ○Make sure when using the tag inside the document.write statement, you use a corresponding tag for each color change. 2. Using a separate document.write statement, add a line break after step 1’s text. 3. Inside the tags, create a section of