From 8793d85c2da156336d7a5ee7bcb4d62be5ed8bbf Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 20 Aug 2022 22:14:51 -0400
Subject: [PATCH 01/15] Create filler.html
---
Project_Based_Course/Calculator/Problem_1_Solution/filler.html | 1 +
1 file changed, 1 insertion(+)
create mode 100644 Project_Based_Course/Calculator/Problem_1_Solution/filler.html
diff --git a/Project_Based_Course/Calculator/Problem_1_Solution/filler.html b/Project_Based_Course/Calculator/Problem_1_Solution/filler.html
new file mode 100644
index 0000000..861f0a2
--- /dev/null
+++ b/Project_Based_Course/Calculator/Problem_1_Solution/filler.html
@@ -0,0 +1 @@
+
From eb4714995923edac7f15e84d4edaea87672d04cc Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 20 Aug 2022 22:15:03 -0400
Subject: [PATCH 02/15] Add files via upload
---
.../Calculator/Problem_1_Solution/style.css | 112 ++++++++++++++++++
1 file changed, 112 insertions(+)
create mode 100644 Project_Based_Course/Calculator/Problem_1_Solution/style.css
diff --git a/Project_Based_Course/Calculator/Problem_1_Solution/style.css b/Project_Based_Course/Calculator/Problem_1_Solution/style.css
new file mode 100644
index 0000000..644d1bf
--- /dev/null
+++ b/Project_Based_Course/Calculator/Problem_1_Solution/style.css
@@ -0,0 +1,112 @@
+/*
+*, *::before, *::after {
+ box-sizing: border-box;
+ font-family: Gotham Rounded, sans-serif;
+ font-weight: normal;
+}
+*/
+
+
+
+ body {
+ padding: 0;
+ margin: 0;
+ background: #0F2027; /* fallback for old browsers */
+ background: -webkit-linear-gradient(to right, #2C5364, #203A43, #0F2027); /* Chrome 10-25, Safari 5.1-6 */
+ background: linear-gradient(to right, #2C5364, #203A43, #0F2027); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+
+ font-family: 'ReactiveAnchor-L3L0n', sans-serif;
+
+ }
+
+ .calculator-grid {
+ display: grid;
+ justify-content: center;
+ align-content: center;
+ min-height: 100vh;
+ grid-template-columns: repeat(4, 100px);
+ grid-template-rows: minmax(120px, auto) repeat(5, 100px);
+ grid-gap: 20px 20px;
+ }
+
+
+ .calculator-grid > button {
+ cursor: pointer;
+ font-size: 2rem;
+ font-family: 'ReactiveAnchor-L3L0n', sans-serif;
+ outline: none;
+ background-color: rgba(0, 0, 0, .75);
+ color: #2ca8fd;
+ border-radius: 20px;
+ padding: 0px;
+ /* Adding Transitions; different transitions properties due to compatibility issues in different browsers */
+ -webkit-transition: background-color 2s ease-out;
+ -moz-transition: background-color 2s ease-out;
+ -o-transition: background-color 2s ease-out;
+ transition: background-color 2s ease-out;
+
+ }
+
+ .calculator-grid > button:hover {
+ background-color: rgba(255, 255, 255, .9);
+ font-family: 'ReactiveAnchor-L3L0n', sans-serif;
+ }
+
+ .span-two {
+ grid-column: span 2;
+ }
+
+ .output {
+ grid-column: 1 / -1;
+ background: #0F2027; /* fallback for old browsers */
+ background: -webkit-linear-gradient(to right, #2C5364, #203A43, #0F2027); /* Chrome 10-25, Safari 5.1-6 */
+ background: linear-gradient(to right, #2C5364, #203A43, #0F2027); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
+ display: flex;
+ align-items: flex-end;
+ justify-content: space-around;
+ flex-direction: column;
+ padding: 10px;
+ word-wrap: break-word;
+ word-break: break-all;
+ border-radius: 5px;
+ }
+
+ .output .previous-operand {
+ color: rgba(255, 255, 255, .75);
+ font-size: 1.5rem;
+ }
+
+ .output .current-operand {
+ color: white;
+ font-size: 2.5rem;
+ }
+
+#op {
+ background-color: #065caf;
+ color: #28a5fd;
+ font-family: 'ReactiveAnchor-L3L0n', sans-serif;
+ /* Adding Transitions for operator backgrounds*/
+ -webkit-transition: background-color 2s ease-out;
+ -moz-transition: background-color 2s ease-out;
+ -o-transition: background-color 2s ease-out;
+ transition: background-color 2s ease-out;
+}
+
+#op:hover {
+ background-color: #0f9;
+}
+
+#misc {
+ background-color: #5f5f60;
+ color: #9d9fa0;
+ font-family: 'ReactiveAnchor-L3L0n', sans-serif;
+ /* Adding Transitions for AC / DEL button backgrounds*/
+ -webkit-transition: background-color 2s ease-out;
+ -moz-transition: background-color 2s ease-out;
+ -o-transition: background-color 2s ease-out;
+ transition: background-color 2s ease-out;
+}
+
+#misc:hover {
+ background-color: #0F2027;
+}
\ No newline at end of file
From 208b32a54bf317865d1c79d3cb0452da9b4bdf76 Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 20 Aug 2022 22:15:24 -0400
Subject: [PATCH 03/15] Delete filler.html
---
Project_Based_Course/Calculator/Problem_1_Solution/filler.html | 1 -
1 file changed, 1 deletion(-)
delete mode 100644 Project_Based_Course/Calculator/Problem_1_Solution/filler.html
diff --git a/Project_Based_Course/Calculator/Problem_1_Solution/filler.html b/Project_Based_Course/Calculator/Problem_1_Solution/filler.html
deleted file mode 100644
index 861f0a2..0000000
--- a/Project_Based_Course/Calculator/Problem_1_Solution/filler.html
+++ /dev/null
@@ -1 +0,0 @@
-
From d2b8bdabcf17fca5a08376c2316b2d0dbf3c7776 Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 3 Sep 2022 17:27:26 -0400
Subject: [PATCH 04/15] Create filler.html
---
Project_Based_Course/Calculator/Problem_2_Solution/filler.html | 1 +
1 file changed, 1 insertion(+)
create mode 100644 Project_Based_Course/Calculator/Problem_2_Solution/filler.html
diff --git a/Project_Based_Course/Calculator/Problem_2_Solution/filler.html b/Project_Based_Course/Calculator/Problem_2_Solution/filler.html
new file mode 100644
index 0000000..861f0a2
--- /dev/null
+++ b/Project_Based_Course/Calculator/Problem_2_Solution/filler.html
@@ -0,0 +1 @@
+
From dff97edddf6f56368499bf0319406652bc3957be Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 3 Sep 2022 17:45:04 -0400
Subject: [PATCH 05/15] Add files via upload
---
.../Calculator/Problem_2_Solution/index2.html | 41 +++++
.../Calculator/Problem_2_Solution/script2.js | 158 ++++++++++++++++++
.../Calculator/Problem_2_Solution/style2.css | 66 ++++++++
3 files changed, 265 insertions(+)
create mode 100644 Project_Based_Course/Calculator/Problem_2_Solution/index2.html
create mode 100644 Project_Based_Course/Calculator/Problem_2_Solution/script2.js
create mode 100644 Project_Based_Course/Calculator/Problem_2_Solution/style2.css
diff --git a/Project_Based_Course/Calculator/Problem_2_Solution/index2.html b/Project_Based_Course/Calculator/Problem_2_Solution/index2.html
new file mode 100644
index 0000000..3ed5aaa
--- /dev/null
+++ b/Project_Based_Course/Calculator/Problem_2_Solution/index2.html
@@ -0,0 +1,41 @@
+
+
+
+
+
+
+ Calculator
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/Project_Based_Course/Calculator/Problem_2_Solution/script2.js b/Project_Based_Course/Calculator/Problem_2_Solution/script2.js
new file mode 100644
index 0000000..f7f2422
--- /dev/null
+++ b/Project_Based_Course/Calculator/Problem_2_Solution/script2.js
@@ -0,0 +1,158 @@
+class Calculator {
+ constructor(previousOperandTextElement, currentOperandTextElement) {
+ this.previousOperandTextElement = previousOperandTextElement
+ this.currentOperandTextElement = currentOperandTextElement
+ this.clear()
+ }
+
+ clear() {
+ this.currentOperand = ''
+ this.previousOperand = ''
+ this.operation = undefined
+ }
+
+ delete() {
+ this.currentOperand = this.currentOperand.toString().slice(0, -1)
+ }
+
+ appendNumber(number) {
+ if (number === '.' && this.currentOperand.includes('.')) return
+ this.currentOperand = this.currentOperand.toString() + number.toString()
+ }
+
+ chooseOperation(operation) {
+
+ if (this.currentOperand === '') return
+
+ this.operation = operation
+ this.previousOperand = this.currentOperand
+ this.currentOperand = ''
+
+ //console.log("prev" + this.previousOperand)
+ //console.log("cur" + this.currentOperand)
+ }
+
+ compute() {
+ let computation
+
+ //console.log(this.previousOperand + ", " + this.currentOperand)
+ //console.log(typeof(this.previousOperand) + ", " + typeof(this.currentOperand))
+
+ const prev = typeof(this.previousOperand) === "string" || typeof(this.previousOperand) === "number" ? parseFloat(this.previousOperand) : ""
+ const current = typeof(this.currentOperand) === "string" || typeof(this.currentOperand) === "number" ? parseFloat(this.currentOperand) : ""
+
+ //console.log(prev + "\n" + current + "\n")
+
+ if (isNaN(prev) && isNaN(current)) return
+
+ if (!isNaN(prev) && !isNaN(current))
+ switch (this.operation) {
+ case '+':
+ computation = prev + current
+ break
+ case '-':
+ computation = prev - current
+ break
+ case '*':
+ computation = prev * current
+ break
+ case '÷':
+ computation = prev / current
+ break
+ // New feature 1
+ case '^':
+ computation = prev**current
+ break
+ // New feature 1
+ default:
+ return
+ }
+ else if (!isNaN(prev))
+ switch (this.operation) {
+ // New feature 2
+ case '√':
+ computation = Math.sqrt(prev)
+ break
+ case '^2':
+ computation = prev * prev;
+ break
+ case '^3':
+ computation = prev * prev * prev;
+ break
+ // New feature 2
+ default:
+ return
+ }
+
+ this.currentOperand = computation
+ this.operation = undefined
+ this.previousOperand = ''
+ }
+
+ getDisplayNumber(number) {
+ const stringNumber = number.toString()
+ const integerDigits = parseFloat(stringNumber.split('.')[0])
+ const decimalDigits = stringNumber.split('.')[1]
+ let integerDisplay
+ if (isNaN(integerDigits)) {
+ integerDisplay = ''
+ } else {
+ integerDisplay = integerDigits.toLocaleString('en', { maximumFractionDigits: 0 })
+ }
+ if (decimalDigits != null) {
+ return `${integerDisplay}.${decimalDigits}`
+ } else {
+ return integerDisplay
+ }
+ }
+
+ updateDisplay() {
+ this.currentOperandTextElement.innerText =
+ this.getDisplayNumber(this.currentOperand)
+ if (this.operation != null) {
+ this.previousOperandTextElement.innerText =
+ `${this.getDisplayNumber(this.previousOperand)} ${this.operation}`
+ } else {
+ this.previousOperandTextElement.innerText = ''
+ }
+ }
+}
+
+const numberButtons = document.querySelectorAll('[data-number]')
+const operationButtons = document.querySelectorAll('[data-operation]')
+const equalsButton = document.querySelector('[data-equals]')
+const deleteButton = document.querySelector('[data-delete]')
+const allClearButton = document.querySelector('[data-all-clear]')
+const previousOperandTextElement = document.querySelector('[data-previous-operand]')
+const currentOperandTextElement = document.querySelector('[data-current-operand]')
+
+const calculator = new Calculator(previousOperandTextElement, currentOperandTextElement)
+
+numberButtons.forEach(button => {
+button.addEventListener('click', () => {
+ calculator.appendNumber(button.innerText)
+ calculator.updateDisplay()
+})
+})
+
+operationButtons.forEach(button => {
+button.addEventListener('click', () => {
+ calculator.chooseOperation(button.innerText)
+ calculator.updateDisplay()
+})
+})
+
+equalsButton.addEventListener('click', button => {
+calculator.compute()
+calculator.updateDisplay()
+})
+
+allClearButton.addEventListener('click', button => {
+calculator.clear()
+calculator.updateDisplay()
+})
+
+deleteButton.addEventListener('click', button => {
+calculator.delete()
+calculator.updateDisplay()
+})
\ No newline at end of file
diff --git a/Project_Based_Course/Calculator/Problem_2_Solution/style2.css b/Project_Based_Course/Calculator/Problem_2_Solution/style2.css
new file mode 100644
index 0000000..c17866c
--- /dev/null
+++ b/Project_Based_Course/Calculator/Problem_2_Solution/style2.css
@@ -0,0 +1,66 @@
+
+*, *::before, *::after {
+ box-sizing: border-box;
+ font-family: Gotham Rounded, sans-serif;
+ font-weight: normal;
+}
+
+body {
+ padding: 0;
+ margin: 0;
+ background: linear-gradient(to right, #13547a, #80d0c7);
+}
+
+.calculator-grid {
+ display: grid;
+ justify-content: center;
+ align-content: center;
+ min-height: 100vh;
+ grid-template-columns: repeat(5, 100px); /* We need 5 columns with the new calculator */
+ grid-template-rows: minmax(120px, auto) repeat(6, 100px); /* We need 6 rows */
+}
+
+
+.calculator-grid > button {
+ cursor: pointer;
+ font-size: 2rem;
+ border: 1px solid white;
+ outline: none;
+ background-color: rgba(255, 255, 255, .75);
+}
+
+.calculator-grid > button:hover {
+ background-color: rgba(255, 255, 255, .9);
+}
+
+.span-two {
+ grid-column: span 2;
+}
+
+/* New */
+.equal {
+ grid-column-start: 3;
+ grid-column-end: -1;
+}
+
+.output {
+ grid-column: 1 / -1;
+ background-color: rgba(0, 0, 0, .75);
+ display: flex;
+ align-items: flex-end;
+ justify-content: space-around;
+ flex-direction: column;
+ padding: 10px;
+ word-wrap: break-word;
+ word-break: break-all;
+}
+
+.output .previous-operand {
+ color: rgba(255, 255, 255, .75);
+ font-size: 1.5rem;
+}
+
+.output .current-operand {
+ color: white;
+ font-size: 2.5rem;
+}
\ No newline at end of file
From 3c0402be2cd4c25ec2d1d80094802df382d207ac Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 1 Oct 2022 21:11:21 -0400
Subject: [PATCH 06/15] Create Readme.txt
---
ch10_JSON/Readme.txt | 1 +
1 file changed, 1 insertion(+)
create mode 100644 ch10_JSON/Readme.txt
diff --git a/ch10_JSON/Readme.txt b/ch10_JSON/Readme.txt
new file mode 100644
index 0000000..d8f7e90
--- /dev/null
+++ b/ch10_JSON/Readme.txt
@@ -0,0 +1 @@
+This folder holds the solution code for the JSON chapter of Javascript intermediate
From 4a9be50fcb572bbda9757d3fe806d95a16467b14 Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 1 Oct 2022 21:11:33 -0400
Subject: [PATCH 07/15] Add files via upload
---
ch10_JSON/JSON_P1_Solution.html | 42 +++++++++++++++++++++++++++++++++
1 file changed, 42 insertions(+)
create mode 100644 ch10_JSON/JSON_P1_Solution.html
diff --git a/ch10_JSON/JSON_P1_Solution.html b/ch10_JSON/JSON_P1_Solution.html
new file mode 100644
index 0000000..9fff34d
--- /dev/null
+++ b/ch10_JSON/JSON_P1_Solution.html
@@ -0,0 +1,42 @@
+
+
+
+
+
+
+
LOL
+
+
+
+
+
+
+
+
\ No newline at end of file
From 086ac5267c8a22fe7f9d6f9d2d2c27f586f7db98 Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 8 Oct 2022 18:07:53 -0400
Subject: [PATCH 08/15] Create JSON_P1_Template.html
---
ch10_JSON/JSON_P1_Template.html | 11 +++++++++++
1 file changed, 11 insertions(+)
create mode 100644 ch10_JSON/JSON_P1_Template.html
diff --git a/ch10_JSON/JSON_P1_Template.html b/ch10_JSON/JSON_P1_Template.html
new file mode 100644
index 0000000..b461122
--- /dev/null
+++ b/ch10_JSON/JSON_P1_Template.html
@@ -0,0 +1,11 @@
+
+
+
+
+
+
LOL
+
+
+
+
+
From 5198fa09e8dd12e71382a5dbad84db1a9279025e Mon Sep 17 00:00:00 2001
From: Jerry W <70043570+TomM-and-jerry@users.noreply.github.com>
Date: Sat, 5 Nov 2022 19:44:08 -0400
Subject: [PATCH 09/15] Rename ch10_JSON/JSON_P1_Solution.html to
ch10_JSON/JSONP1/JSON_P1_Solution.html
---
ch10_JSON/{ => JSONP1}/JSON_P1_Solution.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
rename ch10_JSON/{ => JSONP1}/JSON_P1_Solution.html (96%)
diff --git a/ch10_JSON/JSON_P1_Solution.html b/ch10_JSON/JSONP1/JSON_P1_Solution.html
similarity index 96%
rename from ch10_JSON/JSON_P1_Solution.html
rename to ch10_JSON/JSONP1/JSON_P1_Solution.html
index 9fff34d..c9e0928 100644
--- a/ch10_JSON/JSON_P1_Solution.html
+++ b/ch10_JSON/JSONP1/JSON_P1_Solution.html
@@ -39,4 +39,4 @@
// should print Spotify