Finish MP13

2023-04-18 23:40:43 -05:00
parent 414a06957d
commit 2dc89a3b93
6 changed files with 262 additions and 21 deletions
--- a/Assignments/JavaScript/MP13_CalebFontenot/public_html/Problem4.html
+++ b/Assignments/JavaScript/MP13_CalebFontenot/public_html/Problem4.html
@@ -5,17 +5,85 @@ Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/html.html to edit this
 -->
 <html>
    <head>
-        <title>TODO supply a title</title>
+        <title>Problem 4</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
+    <style>
+        table, th, td {
+            border: 1px solid;
+        }
+    </style>
    <body>
-        
+        <div id="tableDiv"></div>
+        <!div><!input type="button" onclick="tableBuilder()" value="Build table"><!/div>
    </body>
+
    <script>
-       function tableBuilder(field) {
-           
-       }
+        const formatter = new Intl.NumberFormat('en-US', {
+            style: 'currency',
+            currency: 'USD',
+        });
+        let itemPrices = [];
+        let multipliers = [1, 1, 1, 1, 1, 1, 1, 1];
+        let ids = ["notebookVal", "penVal", "mechanicalPencilVal", "refilPackVal", "laptopCaseVal", "cellphoneCaseVal", "threeRingBinderVal", "threeHolePaperRefilVal"];
+        tableBuilder();
+        function getTotal() {
+            let total = 0;
+            for (let i = 0; i < itemPrices.length; ++i) {
+                total += itemPrices[i];
+            }
+            return total;
+        }
+        function updateMultiplier(id) {
+            let basePrices = [5.95, 4.95, 2.95, 0.98, 29.99, 18.99, 6.95, 2.00];
+            let multValue;
+            // Set item values to base prices on page load.
+            if (id == undefined) {
+                multValue = -1; // This prevents the function from crashing when the page loads.
+                for (let i = 0; i < basePrices.length; ++i) {
+                    itemPrices[i] = (basePrices[i]);
+                }
+            } else {
+                multValue = document.getElementById(id).value;
+            }
+            // Determine index to update
+            for (let i = 0; i < ids.length; ++i) {
+                if (id == ids[i]) {
+                    var idIndex = i;
+                    multipliers[i] = multValue;
+                    console.log("idIndex:", idIndex);
+                }
+            }
+            // Set itemPrices;
+            //itemPrices = []; //Clear array
+            for (let i = 0; i < basePrices.length; ++i) {
+                if (idIndex == i) {
+                    itemPrices[i] = (basePrices[i] * multValue);
+                } else {
+                    //
+                }
+            }
+            tableBuilder();
+            console.log(id + ": ", itemPrices[idIndex]);
+        }
+        function tableBuilder() {
+            let itemNames = ["Notebook", "Pen", "Mechanical Pencil", "Lead refil pack", "Laptop case", "Cellphone case", "3-ring binder", "3-hole paper refil"];
+            let tableString = "";
+            tableString = "<table>" + "<tr>" + " <th>Item Name</th>" + " <th>Quantity</th>" + " <th>Price</th>" + " </tr>";
+
+            for (let i = 0; i < itemNames.length; ++i) {
+                tableString += "<tr>";
+                tableString += "<td>" + itemNames[i] + "</td>";
+                tableString += "<td>" + "<input type='number' min='0'" + "id='" + ids[i] + "' onChange='updateMultiplier(this.id);'" + "value='" + multipliers[i] + "' >" + "</td>";
+                tableString += "<td>" + formatter.format(itemPrices[i]) + "</td>";
+                tableString += "</tr>";
+            }
+            tableString += "</table>";
+            tableString += "<p> Total: " + formatter.format(getTotal()) + "</p>"; 
+            document.getElementById("tableDiv").innerHTML = tableString;
+        }
+        updateMultiplier();
    </script>
-        
+
 </html>