maciejpedzi.ch/assets/js/script.js

75 lines
2.8 KiB
JavaScript
Raw Normal View History

2020-11-27 23:12:38 +01:00
const input = document.querySelector('#cmd');
const cmdHistoryElement = document.querySelector('#cmd-history');
const today = new Date();
const cmdHistory = [];
let cmdIndex = 0;
document.querySelector('#currentYear').textContent = today.getFullYear();
input.focus();
input.addEventListener('blur', (evt) => input.focus());
window.addEventListener('keypress', (evt) => {
2020-12-13 18:01:59 +01:00
const command = input.value.trim();
2020-11-27 23:12:38 +01:00
2020-12-13 18:01:59 +01:00
if (evt.key === 'Enter' && command.length > 0) {
const cmdToSave = document.createElement('p');
const output = document.createElement('p');
cmdToSave.textContent = `> ${command}`;
cmdHistoryElement.append(cmdToSave);
2020-11-27 23:12:38 +01:00
2020-12-13 18:01:59 +01:00
switch (command.toLowerCase()) {
default:
output.style.color = 'red';
output.textContent = `ERROR: Unknown command '${command}'`;
break;
case 'about':
const age = today.getFullYear() - new Date('2005-05-08').getFullYear();
output.textContent = `Maciej Pedzich is a ${age}-year-old high school student from Kielce, Poland.
2020-11-27 23:12:38 +01:00
He makes web applications using Vue.js, Node.js, Express and MongoDB/PostgreSQL, but he likes experimenting with other solutions too.
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.`;
2020-12-13 18:01:59 +01:00
break;
case 'contact':
output.innerHTML = `Email address:
2020-11-27 23:12:38 +01:00
<a href="mailto:contact@maciejpedzi.ch">contact@maciejpedzi.ch</a>`;
2020-12-13 18:01:59 +01:00
break;
case 'github':
window.open('https://github.com/maciejpedzich');
break;
case 'help':
output.innerHTML = `<p>about - shows everything you need to know about Maciej</p>
2020-11-27 23:12:38 +01:00
<p>contact - displays contact information</p>
<p>github - shows Maciej's Github profile</p>
<p>help - displays a list of available commands</p>
2020-12-13 18:01:59 +01:00
<p>skills - presents a set of current skills</p>
<p>Use up and down arrows to retype previous commands</p>`;
break;
case 'skills':
output.innerHTML = `<p>Frontend: HTML, CSS, JavaScript, TypeScript, Vue.js</p>
2020-11-27 23:12:38 +01:00
<p>Backend: JavaScript, TypeScript, Node.js, Express</p>
<p>Database: MongoDB, PostgreSQL</p>
<p>Tooling: Git, Visual Studio Code, Linux Bash, Windows PowerShell</p>
<p>Hosting/Deployment: Netlify, Amazon Web Services, MongoDB Atlas</p>`;
2020-12-13 18:01:59 +01:00
break;
}
2020-11-27 23:12:38 +01:00
2020-12-13 18:01:59 +01:00
cmdHistory.push(command);
cmdHistoryElement.append(output);
input.value = '';
input.scrollIntoView();
}
});
window.addEventListener('keydown', (evt) => {
if (cmdHistory.length > 0) {
if (evt.key === 'ArrowUp') {
cmdIndex - 1 >= 0 ? cmdIndex-- : (cmdIndex = cmdHistory.length - 1);
input.value = cmdHistory[cmdIndex];
} else if (evt.key === 'ArrowDown') {
cmdIndex + 1 < cmdHistory.length ? cmdIndex++ : (cmdIndex = 0);
input.value = cmdHistory[cmdIndex];
}
}
2020-11-27 23:12:38 +01:00
});