diff --git a/lectureCodeExamples/Week2/JavaScript2Code/ArraysLengthProp.html b/lectureCodeExamples/Week2/JavaScript2Code/ArraysLengthProp.html new file mode 100755 index 0000000000000000000000000000000000000000..d62738a566511f1e5fd67d393a4bed705a7748f0 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/ArraysLengthProp.html @@ -0,0 +1,46 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8"> + <title>Arrays Length Property</title> +</head> + +<body> + <script> + "use strict"; + + main(); + + function main() { + let languages = ["English", "Spanish", "French"]; + + document.writeln("Array: "); + printArray(languages); + document.writeln("Length: " + languages.length + "<br><br>"); + + /* See what values are used for the elements in the middle */ + languages[8] = "Italian"; + document.writeln("After adding Italian<br>"); + printArray(languages); + + /* The Object.keys() method returns an array of a given + object's own enumerable property names, in the same order as + we get with a normal loop. */ + document.writeln("<br>Keys: " + Object.keys(languages) + "<br>"); + document.writeln("Length: " + languages.length + "<br>"); + + languages.length = 2; + document.writeln("<br>After changing length<br>"); + printArray(languages); + + } + + function printArray(data) { + for (let i = 0; i < data.length; i++) { + document.writeln(data[i] + " "); + } + document.writeln("<br>"); + } + </script> +</body></html> \ No newline at end of file diff --git a/lectureCodeExamples/Week2/JavaScript2Code/ArraysOneDim.html b/lectureCodeExamples/Week2/JavaScript2Code/ArraysOneDim.html new file mode 100755 index 0000000000000000000000000000000000000000..585ee51592a24ad9ab3cbcacd217ad4f8ad3eae6 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/ArraysOneDim.html @@ -0,0 +1,49 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8"> + <title>Arrays</title> +</head> + +<body> + <script> + "use strict"; + main(); + + function main() { + let numOfBeds = 4; + + let roomNumber = reserveRoom(numOfBeds); + printRoom(roomNumber); + + cleanRoom(roomNumber); + printRoom(roomNumber); + } + + function reserveRoom(numberOfBeds) { + let roomNumber = new Array(numberOfBeds); + + for (let idx = 0; idx < roomNumber.length; idx++) { + roomNumber[idx] = "Bed" + idx; + } + + return roomNumber; + } + + function printRoom(roomNumberParameter) { + for (let idx = 0; idx < roomNumberParameter.length; idx++) { + document.writeln(roomNumberParameter[idx] + "<br>"); + } + } + + function cleanRoom(roomNumberParameter) { + for (let idx = 0; idx < roomNumberParameter.length; idx++) { + roomNumberParameter[idx] += " cleaned "; + } + } + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/ArraysTwoDim.html b/lectureCodeExamples/Week2/JavaScript2Code/ArraysTwoDim.html new file mode 100755 index 0000000000000000000000000000000000000000..b0996ff38283c08be3d973eb483608973f8e95c1 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/ArraysTwoDim.html @@ -0,0 +1,70 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8"> + <title>Two-Dimensional Arrays</title> +</head> + +<body> + <script> + "use strict"; + main(); + + function main() { + document.writeln("<h2>First Data Set</h2>"); + const firstArray = [ + [10, 20, 30], + [40, 50, 60], + [70, 80, 90] + ]; + printArray(firstArray); + + document.writeln("<h2>Second Data Set</h2>"); + let secondArray = createArray(2, 3); + initializeArray(secondArray, 1); + printArray(secondArray); + + document.writeln("<h2>Third Data Set (Ragged Array)</h2>"); + const thirdArray = [ + [100, 200, 300], + [400], + [700, 800], + [], + [500, 600, 900, 1000] + ]; + printArray(thirdArray); + } + + function createArray(maxRows, maxCols) { + let newArray = new Array(maxRows); + + for (let row = 0; row < maxRows; row++) { + newArray[row] = new Array(maxCols); + } + + return newArray; + } + + function initializeArray(data, initialValue) { + for (let row = 0; row < data.length; row++) { + for (let col = 0; col < data[row].length; col++) { + data[row][col] = initialValue; + initialValue++; + } + } + } + + function printArray(data) { + for (let row = 0; row < data.length; row++) { + for (let col = 0; col < data[row].length; col++) { + document.writeln(data[row][col] + " "); + } + document.writeln("<br>"); + } + } + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/CharAt.html b/lectureCodeExamples/Week2/JavaScript2Code/CharAt.html new file mode 100755 index 0000000000000000000000000000000000000000..6dfea50bd5e0aecbfc48a55c468af3f2bda2f614 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/CharAt.html @@ -0,0 +1,50 @@ +<!doctype html> +<html> + <head> + <meta charset="utf-8" /> + <title>charAt Example</title> +</head> + +<body> + <script> + "use strict"; + + main(); + + function main() { + let value = prompt("Enter four digit value"), message; + + if (validDigits(value, 4)) { + message = "Correct value provided"; + } else { + message = "Incorrect value provided"; + } + alert(message); + } + + function findInstancesOfChar(str, target) { + let count = 0; + + for (let idx = 0; idx < str.length; idx++) { + if (str[idx] === target) { + count++; + } + } + + return count; + } + + function validDigits(data, length) { + if (data.length !== length) { + return false; + } else { + for (let idx = 0; idx < data.length; idx++) { + if (isNaN(data.charAt(idx))) { + return false; + } + } + return true; + } + } + </script> +</body></html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/ConsoleEx.html b/lectureCodeExamples/Week2/JavaScript2Code/ConsoleEx.html new file mode 100755 index 0000000000000000000000000000000000000000..427b43703bd6a2cc6cfe42dda8b4a2bb1a57b6bf --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/ConsoleEx.html @@ -0,0 +1,28 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>JS Example</title> +</head> + +<body> + <script> + var option = prompt("Enter log, info, warn or error"); + + if (option === "log") { + console.log("Using console.log"); + } else if (option === "info") { + console.info("Using console.info"); + } else if (option === "warn") { + console.warn("Using console.warn"); + } else if (option === "error") { + console.error("Using console.error"); + } else { + console.log("Invalid option: " + option); + } + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/DefiningFunctions.html b/lectureCodeExamples/Week2/JavaScript2Code/DefiningFunctions.html new file mode 100755 index 0000000000000000000000000000000000000000..717aff6d2acad098ba51aebd03f6ad804252cef9 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/DefiningFunctions.html @@ -0,0 +1,32 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>JS Example</title> +</head> + +<body> + <script> + /* Function declaration */ + function product(x, y) { + return x * y; + } + document.writeln("Function declaration: " + product(3, 4) + "<br>"); + + + /* Function expression (anonymous function) */ + let productTwo = function(x, y) { + return x * y; + }; + document.writeln("Function expression: " + productTwo(100, 200) + "<br>"); + + + /* Using Function constructor */ + var productThree = new Function("x", "y", "return x * y"); + document.writeln("Function constructor: " + productThree(2, 3)); + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/FunctionsAsData.html b/lectureCodeExamples/Week2/JavaScript2Code/FunctionsAsData.html new file mode 100755 index 0000000000000000000000000000000000000000..b52fcf6ac4c4084b8675345c2787ca27fa77e335 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/FunctionsAsData.html @@ -0,0 +1,28 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>Functions as Data</title> +</head> + +<body> + <script> + "use strict"; + + /* We don't need to have a main function */ + main(); + + function main() { + var sayHi = hello; + var hi = hello; + hi("John"); + hello("John"); + sayHi("John"); + } + + function hello(name) { + document.writeln("Hello " + name + "<br>"); + } + </script> +</body></html> \ No newline at end of file diff --git a/lectureCodeExamples/Week2/JavaScript2Code/InputOutput.html b/lectureCodeExamples/Week2/JavaScript2Code/InputOutput.html new file mode 100755 index 0000000000000000000000000000000000000000..d5da5e48e010c2be7d73f51006729cf6dd1b256d --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/InputOutput.html @@ -0,0 +1,29 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8" /> + <title>Input/Output</title> +</head> + +<body> + <script> + "use strict"; + + document.writeln("<strong>" + "Bill Calculation System</strong><br />"); + + let costPerCredit, numberOfCredits, tuitionCost; + + /* Reading values from the user */ + costPerCredit = Number(prompt("Enter cost per credit:")); + numberOfCredits = prompt("Enter number of credits:", 15); + + /* Computing cost */ + tuitionCost = costPerCredit * numberOfCredits; + + document.writeln("<strong>Tuition Cost: </strong>" + tuitionCost); + </script> +</body> + +</html> + diff --git a/lectureCodeExamples/Week2/JavaScript2Code/Network.html b/lectureCodeExamples/Week2/JavaScript2Code/Network.html new file mode 100755 index 0000000000000000000000000000000000000000..368bd7096f8e0c571b77b81855cb9ea1e25628af --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/Network.html @@ -0,0 +1,34 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8" /> + <title>Network</title> +</head> + +<body> + <script> + "use strict"; + + /* You need to allow browser pop-ups to run this program */ + let network = prompt("Enter network name (abc, cbs)"); + alert("Network specified is: " + network); + let webSite; + + switch (network) { + case "abc": + webSite = "http://www.abc.com/"; + break; + case "cbs": + webSite = "http://www.cbs.com/"; + break; + default: + webSite = "http://www.cnn.com/"; + break; + } + window.open(webSite); + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/ProcessValues.html b/lectureCodeExamples/Week2/JavaScript2Code/ProcessValues.html new file mode 100755 index 0000000000000000000000000000000000000000..b8c1eeb4071f7334b9c88eba50cedac9466e8f33 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/ProcessValues.html @@ -0,0 +1,46 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>Process Values</title> +</head> + +<body> + <script> + "use strict"; + + main(); + + function main() { + let numberOfValues = Number(prompt("Enter number of values to print")); + let wantHTML = window.confirm("Press OK for formatted output and Cancel otherwise"); + let printingFunction; + + if (wantHTML) { + // processValues(numberOfValues, htmlFormat); + printingFunction = formatOutput; + } else { + // processValues(numberOfValues, textFormat); + printingFunction = textFormat; + } + + processValues(numberOfValues, printingFunction); + } + + function textFormat(data) { + document.writeln(data); + } + + function formatOutput(data) { + document.writeln("<span style='color:red;font-size:4em'><strong>" + data + " </strong></span>"); + } + + function processValues(maximum, printOption) { + for (let curr = 1; curr < maximum; curr++) { + printOption(curr); + } + printOption(maximum); + } + </script> +</body></html> \ No newline at end of file diff --git a/lectureCodeExamples/Week2/JavaScript2Code/SqrTable.html b/lectureCodeExamples/Week2/JavaScript2Code/SqrTable.html new file mode 100755 index 0000000000000000000000000000000000000000..b0005d00ce42265e437902dfd35e2bb6a2a4bacc --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/SqrTable.html @@ -0,0 +1,42 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8" /> + <title>Square Root Table</title> +</head> + +<body> + <script> + "use strict"; + + let currValue = 0, + maximumValue; + + /* Reading a value from the user and verifying is correct */ + do { + maximumValue = Number(prompt("Enter a value")); + if (maximumValue < 0) { + alert("Invalid value: " + maximumValue); + } + } while (maximumValue < 0); + + /* Generating the table */ + // document.writeln writes a string of text followed by a newline + // character to a document. Try also document.write(...) + document.writeln("<table border=\"2\">"); + document.writeln("<caption><strong>Square Root Table</strong></caption>"); + document.writeln("<tr><th>Number</th><th>Square Root</th></tr>"); + + while (currValue <= maximumValue) { + document.writeln("<tr><td>" + currValue + "</td><td>"); + document.writeln(Math.sqrt(currValue) + "</td></tr>"); + currValue = currValue + 1; + } + + document.writeln("</table>"); + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/Strict.html b/lectureCodeExamples/Week2/JavaScript2Code/Strict.html new file mode 100755 index 0000000000000000000000000000000000000000..1a5ed92baa81b933ace9b98e3f25159e5d3f7a2f --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/Strict.html @@ -0,0 +1,20 @@ +<!doctype html> +<html> +<head> + <meta charset="utf-8" /> + <title>Strict Example</title> +</head> + +<body> + <script> + // Inspect the console for each case below + 'use strict'; + + /* strict mode requires variable to be declared first */ + // bookTitle = "Introduction to JavaScript"; + + /* Following variable name not allowed in strict mode */ + // let interface = 10; + + </script> +</body></html> \ No newline at end of file diff --git a/lectureCodeExamples/Week2/JavaScript2Code/StringMethods.html b/lectureCodeExamples/Week2/JavaScript2Code/StringMethods.html new file mode 100755 index 0000000000000000000000000000000000000000..debbf3db63847bff7650dcd1ae04c9fa5a1449cb --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/StringMethods.html @@ -0,0 +1,71 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>String Methods</title> +</head> + +<body> + <script> + "use strict"; + + main(); + + function main() { + let str1 = prompt("Enter string value"); + let str2 = prompt("Enter string value"), result; + + /* string comparison */ + if (str1 <= str2) { + document.writeln(str1 + " <= " + str2); + } else if (str1 > str2) { + document.writeln(str1 + " > " + str2); + } else { + document.writeln("str1 equal to str2"); + } + + if (str1.includes(str2)) { + document.writeln("<br>" + str1 + " includes " + str2); + } else { + document.writeln("<br>" + str1 + " does not include " + str2); + } + + if (str1.startsWith("the")) { + document.writeln("<br>" + str1 + " starts with \"the\""); + } else { + document.writeln("<br>" + str1 + " does not start with \"the\""); + } + + if (str1.endsWith("ing")) { + document.writeln("<br>" + str1 + " ends with \"ing\""); + } else { + document.writeln("<br>" + str1 + " does not end with \"ing\""); + } + + document.writeln("<br>\"Fear the turtle\".indexOf(\"the\")→" + + "Fear the turtle".indexOf("the")); + document.writeln("<br>\"Fear the turtle\".indexOf(\"boat\")→" + + "Fear the turtle".indexOf("boat")); + document.writeln("<br>\"Fear the turtle\".indexOf(\"\")→" + "Fear the turtle" + .indexOf("")); + document.writeln("<br>\"Fear the turtle\".lastIndexOf(\"e\")→" + + "Fear the turtle".lastIndexOf("e")); + + document.writeln("<br>" + str1 + ".repeat(5)→" + str1.repeat(5)); + document.writeln("<br>" + "\"Feartheturtle\".slice(2, 7) " + + "Feartheturtle".slice(2, 7)); + document.writeln("<br>" + "\"Feartheturtle\".slice(-7) " + "Feartheturtle".slice(-7)); + + str1 = prompt("Enter comma separated string"); + let strArray = str1.split(","); + document.writeln("<br>String components:<br>") + for (let i = 0; i < strArray.length; i++) { + document.writeln(strArray[i] + " Length: " + strArray[i].length + "<br>"); + } + } + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/Wrapper.html b/lectureCodeExamples/Week2/JavaScript2Code/Wrapper.html new file mode 100755 index 0000000000000000000000000000000000000000..6f4d80b67a1d5ba0c7fe21e573733b943ba34d49 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/Wrapper.html @@ -0,0 +1,28 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>charAt Example</title> +</head> + +<body> + <script> + "use strict"; + + let name = "Testudo"; + let letter = name.charAt(1); /* Autoboxing takes place */ + document.writeln("Letter is " + letter + "<br>"); + + // JavaScript engine processing for above code + name = "Testudo"; + let x = new String(name); + letter = x.charAt(1); + x = null; /* x will be destroyed once is no longer needed */ + + document.writeln("Letter is " + letter); + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScript2Code/WrapperType.html b/lectureCodeExamples/Week2/JavaScript2Code/WrapperType.html new file mode 100755 index 0000000000000000000000000000000000000000..5038a94575e844d32c27ab8e40427f27cea621f0 --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScript2Code/WrapperType.html @@ -0,0 +1,32 @@ +<!doctype html> +<html> + +<head> + <meta charset="utf-8" /> + <title>Wrapper object type example</title> +</head> + +<body> + <script> + "use strict"; + + let name = "Testudo"; + let objName = new String("Testudo"); + + if (name == objName) { + document.writeln('Same value'); + } else { + document.writeln('Different value'); + } + + document.writeln("<br>") + if (name === objName) { + document.writeln('Same type!'); + } else { + document.writeln('Different type'); + } + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScriptIntroCode/SqrTable.html b/lectureCodeExamples/Week2/JavaScriptIntroCode/SqrTable.html new file mode 100755 index 0000000000000000000000000000000000000000..b0005d00ce42265e437902dfd35e2bb6a2a4bacc --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScriptIntroCode/SqrTable.html @@ -0,0 +1,42 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8" /> + <title>Square Root Table</title> +</head> + +<body> + <script> + "use strict"; + + let currValue = 0, + maximumValue; + + /* Reading a value from the user and verifying is correct */ + do { + maximumValue = Number(prompt("Enter a value")); + if (maximumValue < 0) { + alert("Invalid value: " + maximumValue); + } + } while (maximumValue < 0); + + /* Generating the table */ + // document.writeln writes a string of text followed by a newline + // character to a document. Try also document.write(...) + document.writeln("<table border=\"2\">"); + document.writeln("<caption><strong>Square Root Table</strong></caption>"); + document.writeln("<tr><th>Number</th><th>Square Root</th></tr>"); + + while (currValue <= maximumValue) { + document.writeln("<tr><td>" + currValue + "</td><td>"); + document.writeln(Math.sqrt(currValue) + "</td></tr>"); + currValue = currValue + 1; + } + + document.writeln("</table>"); + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaScriptIntroCode/TemplateJS.html b/lectureCodeExamples/Week2/JavaScriptIntroCode/TemplateJS.html new file mode 100755 index 0000000000000000000000000000000000000000..ff17dd69a4c7dea32d805bafc8e5c6cd24e0725f --- /dev/null +++ b/lectureCodeExamples/Week2/JavaScriptIntroCode/TemplateJS.html @@ -0,0 +1,24 @@ +<!doctype html> +<html lang="en"> + +<head> + <meta charset="utf-8"> + <title>JavaScript Program Template</title> +</head> + +<body> + <script> + // "use strict"; Defines that JavaScript code should be executed in strict mode. + + "use strict"; + + let value = 10; + console.log("value is: " + value); + document.writeln("Output available in the console"); + + /* Your JavaScript here */ + + </script> +</body> + +</html> diff --git a/lectureCodeExamples/Week2/JavaToyWebServer/bin/.gitignore b/lectureCodeExamples/Week2/JavaToyWebServer/bin/.gitignore new file mode 100644 index 0000000000000000000000000000000000000000..48f7540c5e638675f7f0d43e04585a8f82926caa --- /dev/null +++ b/lectureCodeExamples/Week2/JavaToyWebServer/bin/.gitignore @@ -0,0 +1 @@ +/toyWebServer/ diff --git a/lectureSlides/Week02/JavaScript2.pdf b/lectureSlides/Week02/JavaScript2.pdf new file mode 100644 index 0000000000000000000000000000000000000000..9374dbc398f015b5cfc8996f9bbc608b484393a2 Binary files /dev/null and b/lectureSlides/Week02/JavaScript2.pdf differ diff --git a/lectureSlides/Week02/JavaScriptIntro.pdf b/lectureSlides/Week02/JavaScriptIntro.pdf new file mode 100644 index 0000000000000000000000000000000000000000..97a27ab81a6178c0f8a8cac8365184582d9efda3 Binary files /dev/null and b/lectureSlides/Week02/JavaScriptIntro.pdf differ