I was thinking of whether it was possible to have a command-line interface in HTML, with some CSS or script whatsoever. Like you type a command and it does a function like revealing text or something.
Alright so here's an update for the JS. I'm gonna find a way to have it perform a hide/unhide action upon typing "run [insert name]"
function getInput() {
return document.getElementById("answer").value;
}
var submitButton = document.getElementById("submit").addEventListener("click", mySubmit);
function mySubmit() {
var text;
var database = [{
answer: "help",
clue: "info, credits, run"
},
{
answer: "info",
clue: "made by: SkyKrye"
},
{
answer: "credits",
clue: "StackOverflow, W3Schools, Discord"
},
{
answer: "run",
clue: "unspecified program: run [insert program name]"
}
];
for (var i = 0; i < database.length; i++) {
if (database[i].answer === getInput()) {
text = database[i].clue;
console.log(text);
}
}
if (!text) {
text = "Syntax Error";
}
document.getElementById("demo").innerText = text;
}
button {
font-family: consolas;
margin: 10px;
color: white;
background: #111;
box-shadow: #111;
border-radius: 5px;
border-width: 2px;
background-color: #222;
display: inline-block;
width: 120px;
height: 26px;
overflow: hidden;
text-overflow: ellipsis;
}
button:hover {
transform: scale(1.5);
transition: all .2s ease-in-out;
body {
background-color: #333;
color: white;
font-family: consolas;
font-size: 20px;
}
<input type="text" name="inputField" id="answer" placeholder="Enter command" required>
<button id="submit" type="button" name="button">Submit</button>
<p id="demo"></p>