From 045da2b95c9f7a92b06ec34da28d10e45408f739 Mon Sep 17 00:00:00 2001 From: Angela Yu <8798027+angelabauer@users.noreply.github.com> Date: Thu, 7 Mar 2024 12:32:28 +0000 Subject: [PATCH] Add files via upload --- index.html | 27 +++++++++ index.js | 146 ++++++++++++++++++++++++++++++++++++++++++++++++ styles/main.css | 61 ++++++++++++++++++++ 3 files changed, 234 insertions(+) create mode 100644 index.html create mode 100644 index.js create mode 100644 styles/main.css diff --git a/index.html b/index.html new file mode 100644 index 0000000..8862918 --- /dev/null +++ b/index.html @@ -0,0 +1,27 @@ + + + + + + + + + + + Demo + + + +
+
Click to run the final project you will build.
+
+ +
+ + + + \ No newline at end of file diff --git a/index.js b/index.js new file mode 100644 index 0000000..83760b8 --- /dev/null +++ b/index.js @@ -0,0 +1,146 @@ +//Current line +var CurrentId = undefined; + +var inputValues = []; +const inputPrompts = [ + "What is your name?: ", + "What is your bid?: $", + `Are there any other bidders? Type 'yes or 'no'. + `, +]; + +const logo = ` + ___________ + \ / + )_______( + |"""""""|_.-._,.---------.,_.-._ + | | | | | | ''-. + | |_| |_ _| |_..-' + |_______| '-'''---------'' '-' + )"""""""( + /_________\\ + .-------------. + /_______________\\ +`; +let bids = []; +let biddingShouldContinue = true; + +//Click Run +$(document).ready(function () { + $("#run-button").click(function () { + $("#Content").empty(); + restart(); + }); +}); + +function restart() { + inputValues = []; + NewLine(logo, false); + NewLine("What is your name?: ", true); +} + +let person = ""; +//Enter button +$(document).on("keydown", function (e) { + var x = event.which || event.keyCode; + if (x === 13 || x == 13) { + var consoleLine = $("#" + CurrentId + " input").val(); + inputValues.push({ id: CurrentId, val: consoleLine.toLowerCase() }); + + if ((inputValues.length + 2) % 3 == 0) { + person = consoleLine; + $(".console-carrot").remove(); + NewLine(inputPrompts[1], true); + } + + if ((inputValues.length + 1) % 3 == 0) { + let bid = { name: person, amount: Number(consoleLine) }; + bids.push(bid); + $(".console-carrot").remove(); + NewLine(inputPrompts[2], true); + } + + if (inputValues.length % 3 == 0) { + if (consoleLine == "no") { + biddingShouldContinue = false; + NewLine(find_highest_bidder(bids), false); + return; + } else { + $("#Content").empty(); + $(".console-carrot").remove(); + NewLine(inputPrompts[0], true); + } + } + + // $(".console-carrot").remove(); + // if (biddingShouldContinue) { + // NewLine(inputPrompts[inputValues.length - 1], true); + // } + } +}); +$(document).on("keydown", function (e) { + var x = event.which || event.keyCode; + var line = $("#" + CurrentId + " input"); + var length = line.val().length; + if (x != 8) { + line.attr("size", 1 + length); + } else { + line.attr("size", length * 0.95); + } + if (length === 0) { + $("#" + CurrentId + " input").attr("size", "1"); + } +}); +$(document).on("click", function (e) { + $("#" + CurrentId + " input").focus(); +}); + +//New line +function NewLine(text, isPrompt) { + $(".console-carrot").remove(); + if (CurrentId !== undefined) { + $("#" + CurrentId + " input").prop("disabled", true); + } + CurrentId = "consoleInput-" + GenerateId(); + + if (isPrompt) { + $("#Content").append( + //One Line + '
' + + text + + '
' + ); + $("#" + CurrentId + " input").focus(); + $("#" + CurrentId + " input").attr("size", "1"); + } else { + $("#Content").append('
' + text + "
"); + } + document.getElementById(CurrentId).scrollIntoView(); +} + +function find_highest_bidder(bidding_record) { + let highest_bid = 0; + let winner = ""; + for (bidder in bidding_record) { + let bid_amount = bidding_record[bidder].amount; + if (bid_amount > highest_bid) { + highest_bid = bid_amount; + winner = bidding_record[bidder].name; + } + } + return `The winner is ${winner} with a bid of \$${highest_bid}`; +} + +function GenerateId() { + return Math.random().toString(16).slice(2); +} + +function shuffleArray(array) { + for (let i = array.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [array[i], array[j]] = [array[j], array[i]]; + } + return array; +} diff --git a/styles/main.css b/styles/main.css new file mode 100644 index 0000000..214c38e --- /dev/null +++ b/styles/main.css @@ -0,0 +1,61 @@ +body { + background: #141414; +} + +button { + font-size: 30px; +} + +.content { + white-space: pre; +} + +.terminal { + font-family: "IBM Plex Mono", monospace; + color: rgb(187, 187, 187); + font-size: 30px; + font-weight: 100; +} + +.terminal-input { + background: rgba(0, 0, 0, 0); + font-family: monospace; + color: transparent; + font-size: 30px; + outline: none; + border: none; + -webkit-text-fill-color: rgb(187, 187, 187); +} + +.terminal-purple { + color: #5050f2; +} + +.console-line { + color: rgb(0, 178, 0); +} + +.login-line { + color: #fff; +} + +.console-carrot { + vertical-align: middle; + background: #fff; + height: 32px; + width: 17px; + margin-left: -7px; + display: inline-block; + animation: blink 1s step-start 0s infinite; +} + +::selection { + background-color: #fff; + color: #000; +} + +@keyframes blink { + 50% { + opacity: 0; + } +}