From 42d2a471b5c7af731fba6bab07da6bf0364682a3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maciej=20P=C4=99dzich?= Date: Tue, 16 Feb 2021 18:06:27 +0100 Subject: [PATCH] Version 2.4.0 release --- CHANGELOG.md | 6 ++++++ assets/js/script.js | 52 +++++++++++++++++++++++++++++++-------------- index.html | 4 ++-- 3 files changed, 44 insertions(+), 18 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 5db61be..f9cbfb0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,11 @@ # Changelog +## 2.4.0 + +- Persist input history (up to 10 entries) using `localStorage` +- Add `bgcolor` and `color` commands for setting background color and text color respectively +- Add _Looking to learn_ in skills section + ## 2.3.0 - Add special _'help'_ command for dummies diff --git a/assets/js/script.js b/assets/js/script.js index 512aa74..d17d04c 100644 --- a/assets/js/script.js +++ b/assets/js/script.js @@ -2,26 +2,29 @@ const input = document.querySelector('#cmd'); const cmdHistoryElement = document.querySelector('#cmd-history'); const today = new Date(); const currentYear = today.getFullYear(); -const cmdHistory = []; - +const inputHistory = localStorage.getItem('inputHistory') + ? localStorage.getItem('inputHistory').split(',') + : []; let cmdIndex = 0; + document.querySelector('#current-year').textContent = currentYear; input.focus(); -input.addEventListener('blur', (evt) => input.focus()); - window.addEventListener('keypress', (evt) => { - const command = input.value.trim(); + const inputText = input.value.trim(); + const split = inputText.split(/ +/); + const command = split[0]; if (evt.key === 'Enter' && command.length > 0) { + const args = split.slice(1); + const cmdToSave = document.createElement('p'); const output = document.createElement('p'); - cmdToSave.textContent = `> ${command}`; + cmdToSave.textContent = `> ${inputText}`; cmdHistoryElement.append(cmdToSave); switch (command.toLowerCase()) { default: - output.style.color = 'red'; output.textContent = `ERROR: Unknown command '${command}'`; break; case 'about': @@ -33,14 +36,24 @@ window.addEventListener('keypress', (evt) => { He believes that by being creative and cooperating with others, you can achieve success. When not coding, he is probably watching an F1 race, or playing retro video games.`; break; + case 'bgcolor': + const bgcolor = args[0]; + document.body.style.backgroundColor = bgcolor; + break; case 'cls': cmdHistoryElement.textContent = ''; break; + case 'color': + const color = args[0]; + document.body.style.color = color; + input.style.color = color; + break; case 'contact': output.innerHTML = `Email address: contact@maciejpedzi.ch`; break; case 'github': + output.innerHTML = `If new tab didn't show up, go here`; window.open('https://github.com/maciejpedzich'); break; case "'help'": @@ -48,9 +61,11 @@ window.addEventListener('keypress', (evt) => { break; case 'help': output.innerHTML = `

about - shows everything you need to know about Maciej

-

cls - clears screen

+

bgcolor [color] - sets background color to given [color]

+

cls - clears screen

+

color [color] - sets text color to given [color]

contact - displays contact information

-

github - opens Maciej's Github profile

+

github - opens Maciej's Github profile page

help - displays a list of available commands

skills - presents a set of current skills

If on desktop/laptop, use up and down arrows to retype commands

`; @@ -60,11 +75,14 @@ window.addEventListener('keypress', (evt) => {

Backend: JavaScript, TypeScript, Node.js, Express

Database: MongoDB, PostgreSQL

Tooling: Git, Visual Studio Code, Bash, Windows PowerShell, Postman

-

Hosting/Deployment: Netlify, Heroku, Amazon Web Services, MongoDB Atlas

`; +

Hosting/Deployment: Netlify, Heroku, Amazon Web Services, MongoDB Atlas

+

Looking to learn: Nuxt.js, GraphQL, Vim

`; break; } - cmdHistory.push(command); + inputHistory.unshift(inputText); + localStorage.setItem('inputHistory', inputHistory.slice(0, 10).join()); + cmdHistoryElement.append(output); input.value = ''; input.scrollIntoView(); @@ -72,13 +90,15 @@ window.addEventListener('keypress', (evt) => { }); window.addEventListener('keydown', (evt) => { - if (cmdHistory.length > 0) { + if (inputHistory.length > 0) { if (evt.key === 'ArrowUp') { - cmdIndex - 1 >= 0 ? cmdIndex-- : (cmdIndex = cmdHistory.length - 1); - input.value = cmdHistory[cmdIndex]; + cmdIndex - 1 >= 0 ? cmdIndex-- : (cmdIndex = inputHistory.length - 1); + input.value = inputHistory[cmdIndex]; } else if (evt.key === 'ArrowDown') { - cmdIndex + 1 < cmdHistory.length ? cmdIndex++ : (cmdIndex = 0); - input.value = cmdHistory[cmdIndex]; + cmdIndex + 1 < inputHistory.length ? cmdIndex++ : (cmdIndex = 0); + input.value = inputHistory[cmdIndex]; } } }); + +input.addEventListener('blur', (evt) => input.focus()); diff --git a/index.html b/index.html index a0ffdb2..63a4620 100644 --- a/index.html +++ b/index.html @@ -12,14 +12,14 @@
>
- +