change to my style :)

author: Rikki <i@rikki.moe> 2025-04-17 12:24:00 +0800
committer: Rikki <i@rikki.moe> 2025-04-17 12:24:00 +0800
commit: 47ba0d44aa91d642e8b653ac4855274afe3455a8 (patch)
tree: 274d6a49cedc529a56d520041f9fbc70803c07fe
parent: 09f6079cb7a0d1142e81b85c218571237d6fc540 (diff)
6 files changed, 164 insertions, 95 deletions
diff --git a/LICENSE b/LICENSE
index 96236ef..cc89db7 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,5 +1,6 @@
 MIT License
 
+Copyright (c) 2025 Rikki (https://rikki.moe)
 Copyright (c) 2021 Heber Leonard
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
diff --git a/README.md b/README.md
deleted file mode 100644
index 637c04e..0000000
--- a/README.md
+++ /dev/null
@@ -1,11 +0,0 @@
-# Terminal Style Portfolio Page
-
-Site simulando um terminal feito com Javascript, Html e Css.
-#### https://heberleonard2.github.io/terminal-style-portfolio-page/
-
-![](https://user-images.githubusercontent.com/51919658/86963051-477f2400-c13a-11ea-9d34-22885d426c10.gif)
-
-#### Sobre o autor
-###### Héber Leonard
-###### heber.leonard2@gmail.com
-###### Idéias? Fala comigo.
diff --git a/_config.yml b/_config.yml
deleted file mode 100644
index cc35c1d..0000000
--- a/_config.yml
+++ /dev/null
@@ -1 +0,0 @@
-theme: jekyll-theme-modernist
-\ No newline at end of file
diff --git a/index.html b/index.html
index a2ce6a6..19b92e3 100644
--- a/index.html
+++ b/index.html
@@ -7,7 +7,7 @@
    rel="stylesheet">
   <link href="styles/all.css" rel="stylesheet">
   <link rel="stylesheet" href="styles/main.css">
-  <title>Héber Leonard</title>
+  <title>guest@rikki.moe: ~</title>
 </head>
 <body>
   <div class="container">
@@ -18,7 +18,7 @@
       <div class="button green"></div>
     </div>
     <div class="title">
-      <a href="https://github.com/heberleonard2" target="_blank"><h1><i class='fab fa-github'></i> github.com/heber-leonard</h1></a>
+      <a><h1><i class='fas fa-terminal'></i> guest@rikki.moe: ~</h1></a>
     </div>
     </div>
     <div id="app">
diff --git a/scripts/main.js b/scripts/main.js
index a638a61..4ab3be1 100644
--- a/scripts/main.js
+++ b/scripts/main.js
@@ -1,52 +1,83 @@
-
 const app = document.querySelector("#app");
 const delay = ms => new Promise(res => setTimeout(res, ms));
-    
-    
-app.addEventListener("keypress", async function(event){
-  if(event.key === "Enter"){
-    await delay(150);
-   getInputValue();
-   
-    removeInput();
+
+links = [
+  {
+    name: "blog",
+    url: "https://blog.rikki.moe",
+    desc: "Who am i and what do i do.",
+  },
+  {
+    name: "git",
+    url: "https://git.rikki.moe",
+    desc: "My personal git server.",
+  },
+  {
+    name: "github",
+    url: "https://github.com/rikkix",
+    desc: "My github page with my projects. Follow me there ;)",
+  },
+  {
+    name: "matrix-chat",
+    url: "https://chat.mtf.moe",
+    desc: "My personal matrix chat server.",
+  }
+]
+
+commands = [
+  ...links,
+  {
+    name: "email",
+    desc: "Get my email address.",
+  },
+  {
+    name: "help",
+    desc: "Show the list of commands.",
+  },
+  {
+    name: "clear",
+    desc: "Clear the terminal.",
+  }
+]
+
+app.addEventListener("keypress", async function (event) {
+  if (event.key === "Enter") {
     await delay(150);
-    new_line();
+    await executeInput();
   }
 });
 
-app.addEventListener("click", function(event){
+app.addEventListener("click", function (event) {
   const input = document.querySelector("input");
   input.focus();
 })
 
 
-async function open_terminal(){
-  createText("Welcome");
+async function open_terminal() {
+  createText("Welcome to Rikki's terminal");
   await delay(700);
-  createText("Starting the server...");
-  await delay(1500);
-  createText("You can run several commands:");
- 
-  createCode("about me", "Who am i and what do i do.");
-  createCode("all", "See all commands.");
-  createCode("social -a", "All my social networks.");
-
+  createText("Type 'help' to see the list of commands.");
   await delay(500);
+
   new_line();
+
+  executeInput("help")
+}
+
+function scrollToBottom() {
+  const scrollHeight = app.scrollHeight;
+  app.scrollTop = scrollHeight;
 }
 
 
-function new_line(){
-  
+function new_line() {
   const p = document.createElement("p");
   const span1 = document.createElement("span");
-  const span2 = document.createElement("span");
   p.setAttribute("class", "path")
-  p.textContent = "# user";
-  span1.textContent = " in";
-  span2.textContent = " ~/heber-leonard";
+  p.textContent = "guest@rikki";
+  span1.textContent = " ~";
   p.appendChild(span1);
-  p.appendChild(span2);
+
   app.appendChild(p);
   const div = document.createElement("div");
   div.setAttribute("class", "type")
@@ -57,58 +88,65 @@ function new_line(){
   div.appendChild(input);
   app.appendChild(div);
   input.focus();
-  
 }
 
-function removeInput(){
+function removeInput() {
   const div = document.querySelector(".type");
   app.removeChild(div);
 }
 
-async function getInputValue(){
-  
-  const value = document.querySelector("input").value;
-  if(value === "all"){
-    trueValue(value);
-    
-    createCode("projects", "My github page with my projects. Follow me there ;)");
-    createCode("about me", "Who am i and what do i do.");
-    createCode("social -a", "All my social networks.");
-    createCode("clear", "Clean the terminal.");
-    
-  }
-  else if(value === "projects"){
-    trueValue(value);
-    createText("<a href='https://github.com/heberleonard2' target='_blank'><i class='fab fa-github white'></i> github.com/heberleonard2</a>")
+function help() {
+  for (let i = 0; i < commands.length; i++) {
+    printCommand(commands[i].name, commands[i].desc);
   }
-  else if(value === "about me"){
-    trueValue(value);
-    createText("Oi, meu nome é Héber ;)")
-    createText("Desenvolvedor atualmente focado em todo o ecossistema Javascript. Utilizando principalmente a stack <span class='blue'>Node, React e React Native </span>por permitir criar aplicações de forma descomplicada e produtiva.")
-  }
-  else if(value === "social -a"){
-    trueValue(value);
-    createText("<a href='https://github.com/heberleonard2' target='_blank'><i class='fab fa-github white'></i> github.com/heberleonard2</a>")
-    createText("<a href='https://www.linkedin.com/in/heber-leonard/' target='_blank'><i class='fab fa-linkedin-in white'></i> linkedin.com/in/heber-leonard</a>")
-    createText("<a href='https://www.instagram.com/heber_leonard/' target='_blank'><i class='fab fa-instagram white'></i> instagram.com/heber_leonard</a>")
+}
+
+async function executeInput(command) {
+  var value = "";
+  if (command) {
+    value = command;
+  } else {
+    value = document.querySelector("input").value;
   }
-  else if(value === "social"){
-    trueValue(value);
-    createText("Didn't you mean: social -a?")
+  removeInput();
+
+  await showOutput(value);
+  new_line();
+}
+
+async function showOutput(command) {
+  if (command === "help") {
+    trueValue(command);
+
+    help();
   }
-  
-  else if(value === "clear"){
+  else if (command === "clear") {
     document.querySelectorAll("p").forEach(e => e.parentNode.removeChild(e));
     document.querySelectorAll("section").forEach(e => e.parentNode.removeChild(e));
   }
-  else{
-    falseValue(value);
+  else if (command === "email") {
+    trueValue(command);
+    createText("Getting email address...");
+    const email = await getEmailAddress();
+    createText(`The email address is: <a href="mailto:${email}" target="_blank">${email}</a>`);
+  }
+  else {
+    for (let i = 0; i < links.length; i++) {
+      if (command === links[i].name) {
+        trueValue(command);
+        createText(`Opening ${links[i].name} (<a href="${links[i].url}" target="_blank">${links[i].url}</a>)`);
+        scrollToBottom();
+        await delay(400);
+        window.open(links[i].url, "_blank");
+        return;
+      }
+    }
+    falseValue(command);
     createErrorText(`command not found: ${value}`)
   }
 }
 
-function trueValue(value){
-  
+function trueValue(value) {
   const div = document.createElement("section");
   div.setAttribute("class", "type2")
   const i = document.createElement("i");
@@ -121,8 +159,7 @@ function trueValue(value){
   app.appendChild(div);
 }
 
-function falseValue(value){
-  
+function falseValue(value) {
   const div = document.createElement("section");
   div.setAttribute("class", "type2")
   const i = document.createElement("i");
@@ -135,20 +172,36 @@ function falseValue(value){
   app.appendChild(div);
 }
 
-function createText(text, classname){
+function createText(text) {
   const p = document.createElement("p");
-  
-  p.innerHTML =
-  text
-  ;
+
+  p.innerHTML = text;
   app.appendChild(p);
 }
 
-function createCode(code, text){
+function printCommand(command, desc) {
   const p = document.createElement("p");
   p.setAttribute("class", "code");
-  p.innerHTML =
- `${code} <br/><span class='text'> ${text} </span>`;
+  const cmdEle = document.createElement("a");
+  cmdEle.setAttribute("class", "command");
+  cmdEle.innerText = command;
+
+  // Add click event to the command
+  cmdEle.addEventListener("click", async function () {
+    await delay(150);
+    await executeInput(command);
+  });
+
+  // make cursor pointer
+  cmdEle.style.cursor = "pointer";
+
+  const descEle = document.createElement("span");
+  descEle.setAttribute("class", "text");
+  descEle.innerText = desc;
+  p.appendChild(cmdEle);
+  p.appendChild(document.createElement("br"));
+  p.appendChild(descEle);
+
   app.appendChild(p);
 }
 
@@ -159,3 +212,28 @@ function createErrorText(text) {
 }
 
 open_terminal();
+
+async function getEmailAddress() {
+  const partHash = "2f5ab71af6dfd2f3c5444a2d690fbbb880ee87f9";
+  const remainingPart = "rikki.moe";
+  const chars = 'abcdefghijklmnopqrstuvwxyz1234567890!@#$%^&*()';
+
+  for (let i = 0; i < chars.length; i++) {
+    for (let j = 0; j < chars.length; j++) {
+      const part = chars[i] + chars[j];
+      const hash = await String2Hash(part);
+      if (hash === partHash) {
+        return part + remainingPart;
+      }
+    }
+  }
+
+  return null;
+}
+
+async function String2Hash(username) {
+  const encoder = new TextEncoder();
+  const data = encoder.encode(username);
+  const hashBuffer = await crypto.subtle.digest('SHA-1', data);
+  return Array.from(new Uint8Array(hashBuffer)).map(b => b.toString(16).padStart(2, '0')).join('');
+}
diff --git a/styles/main.css b/styles/main.css
index 499efd3..d2f0344 100644
--- a/styles/main.css
+++ b/styles/main.css
@@ -48,7 +48,7 @@ body{
   flex-direction: column;
   width:100%;
   max-width:800px;
-  height:500px;
+  height:900px;
   overflow: hidden;
   border-radius: 6px;
   border: 1px solid gray;
@@ -121,7 +121,7 @@ h2{
   font-size:16px;
   color:rgb(238, 238, 238);
 }
-p.code{
+p.code a{
   color:#66C2CD;
   margin-left:8px;
 }
@@ -131,13 +131,14 @@ span.text{
 }
 p.path{
   color:#F7FCA0;
+  padding-bottom: 0;
 }
 p.path span{
-  color:#6A77D2;
-}
-p.path span + span{
   color:#9CEAF3;
 }
+{{/* p.path span + span{
+  color:#9CEAF3;
+} */}}
 
 .sucess{
   color:#5AD786;
@@ -167,12 +168,13 @@ input:focus{
 .type{
   display:flex;
   align-items: center;
-  padding:8px 0;
+  padding-top: 0;
+  padding-bottom: 8px;
 }
 .type2{
   display:flex;
   align-items: center;
-  padding:8px 0;
+  padding: 0;
 }
 .icone{
   color:#5AD786;
author	Rikki <i@rikki.moe>	2025-04-17 12:24:00 +0800
committer	Rikki <i@rikki.moe>	2025-04-17 12:24:00 +0800
commit	47ba0d44aa91d642e8b653ac4855274afe3455a8 (patch)
tree	274d6a49cedc529a56d520041f9fbc70803c07fe
parent	09f6079cb7a0d1142e81b85c218571237d6fc540 (diff)