Well documented final assignment with code snippets

,Table of Contents
JavaScript code............................................................................................................................................................... 3
Implementation of coding – Date Object...................................................................................................................... 3
Implementation of code – Images................................................................................................................................ 3
Implementation of code – Arrays to populate calendar................................................................................................ 6
Implementation of code – Graphical User Interfaces elements...................................................................................7
Implementation of coding – Validation of user input fields, try/catch error handling...................................................11
Implementation of coding – Cookies.......................................................................................................................... 21
Implementation of code – Use of if, if/else, else if, switch or loop statement.............................................................28
Implementation of coding – Mathematical calculation to compute cost.....................................................................33
Implementation of code – Event listener.................................................................................................................... 35
Implementation of calender – Build Links.................................................................................................................. 38
Implementation of reset forms................................................................................................................................... 39
Images........................................................................................................................................................................... 40
Home Page................................................................................................................................................................ 40
Images rotate........................................................................................................................................................ 41
.............................................................................................................................................................................. 41
Zoom..................................................................................................................................................................... 43
Create Promotion Page............................................................................................................................................. 43
Validation.............................................................................................................................................................. 43
Cookies................................................................................................................................................................. 45
Sign-up Page............................................................................................................................................................. 46
Validation.............................................................................................................................................................. 47
Cookies................................................................................................................................................................. 49
Edit Promotion Page.................................................................................................................................................. 49
Validation.............................................................................................................................................................. 51
Cookies................................................................................................................................................................. 51
Delete Promotion Page.............................................................................................................................................. 52
Promotion 1 Summary Page...................................................................................................................................... 55
Promotion 2 Summary Page...................................................................................................................................... 57
Promotion 3 Summary Page...................................................................................................................................... 58
Student’s Disciplinary Code Page.............................................................................................................................. 60
Sub Page 1 – Student’s Disciplinary Code................................................................................................................ 60
Sub Page 6 – Student’s Disciplinary Code Validation................................................................................................ 60
Sub Page 9 – Student’s Disciplinary Code................................................................................................................ 62
Question 1..................................................................................................................................................................... 63
Question 2..................................................................................................................................................................... 63
Rubric – Examination Project – ICT1512....................................................................................................................... 64

,JavaScript code
Implementation of coding – Date Object
var today = new Date();
var currentMonth = today.getMonth();
var currentYear = today.getFullYear();
var selectYear = document.getElementById("year");
var selectMonth = document.getElementById("month");

var month = months[today.getMonth()];
var dayOfWeek = today.getDay();
var year = today.getFullYear();

//Get the day of the week in string value
if (dayOfWeek == 0) {
document.getElementById("imgDay").innerHTML = "Sunday";
} else if (dayOfWeek == 1) {
document.getElementById("imgDay").innerHTML = "Monday";
} else if (dayOfWeek == 2) {
document.getElementById("imgDay").innerHTML = "Tuesday";
} else if (dayOfWeek == 3) {
document.getElementById("imgDay").innerHTML = "WednesDay";
} else if (dayOfWeek == 4) {
document.getElementById("imgDay").innerHTML = "ThursDay";
} else if (dayOfWeek == 5) {
document.getElementById("imgDay").innerHTML = "Friday";
} else if (dayOfWeek == 6) {
document.getElementById("imgDay").innerHTML = "Saturday";
}
Implementation of code – Images
/* global variables */
var photoOrder = [1, 2, 3, 4, 5];
var figureCount = 3;
var autoAdvance = setInterval(rightArrow, 5000);
var btnPrevious = document.getElementById("previous");
var btnNext = document.getElementById("next");


/* Gallery Functions Start */

//populate figures based on the figure count
function populateFigures() {
var filename;
var currentFig;
if (figureCount === 3) {
for (var i = 1; i < 4; i++) {
filename = "Images/Gallery/GalleryImage-" + photoOrder[i] + ".jpg";
currentFig =
document.getElementById("galleryDiv").getElementsByTagName("img")[i - 1];;

currentFig.src = filename;
}
} else {
for (var i = 0; i < 5; i++) {
filename = "Images/Gallery/GalleryImage-" + photoOrder[i] + ".jpg";
currentFig = document.getElementById("galleryDiv").getElementsByTagName("img")[i];
currentFig.src = filename;
}
}
}

// stop automatic image switching and call rightAdvance() function

, function rightArrow() {
clearInterval(autoAdvance);
rightAdvance();
}
// shift all Images one figure to the left, and change values in photoOrder array to match
function rightAdvance() {
for (var i = 0; i < 5; i++) {
if ((photoOrder[i] + 1) === 6) {
photoOrder[i] = 1;
} else {
photoOrder[i] += 1;
}
populateFigures();
}
}

// shift all Images one figure to the right, and change values in photoOrder array to match

function leftArrow() {
clearInterval(autoAdvance);
for (var i = 0; i < 5; i++) {

if ((photoOrder[i] - 1) === 0) {
photoOrder[i] = 5;
} else {
photoOrder[i] -= 1;
}
populateFigures();
}
}
//Display 5 images for the gallery
function previewFive() {
var articleEl = document.getElementsByTagName("article")[0];
var lastFigure = document.createElement("figure");
lastFigure.id = "fig5";
lastFigure.style.zIndex = "5";
lastFigure.style.position = "absolute";
lastFigure.style.right = "45px";
lastFigure.style.top = "67px";
var lastImage = document.createElement("img");
lastImage.width = "240";
lastImage.height = "135";
lastFigure.appendChild(lastImage);
// articleEl.appendChild(lastFigure);
articleEl.insertBefore(lastFigure,document.getElementById("rightarrow"));
//clone figure element for fifth image and edit to be first image
var firstFigure = lastFigure.cloneNode(true);
firstFigure.id = "fig1";
firstFigure.style.right = "";
firstFigure.style.left = "45px";
articleEl.insertBefore(firstFigure,
document.getElementById("fig2"));
figureCount = 5;
// check directory and build image names
document.getElementById("galleryDiv").getElementsByTagName("img")[0].src =
"Images/Gallery/GalleryImage-" + photoOrder[0] + ".jpg";
document.getElementById("galleryDiv").getElementsByTagName("img")[4].src =
"Images/Gallery/GalleryImage-" + photoOrder[4] + ".jpg";


//change button to hide extra Images
var numberButton = document.querySelector("#fiveButton p");
numberButton.innerHTML = "Show fewer Images";
if (numberButton.addEventListener) {
numberButton.removeEventListener("click", previewFive,
false);