kristoferssolo/kristofersxyz
1
0
Fork 0
mirror of https://github.com/kristoferssolo/kristofersxyz.git synced 2025-10-21 18:30:34 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Rewrite typewriter.js

Browse Source
This commit is contained in:
Kristofers Solo 2023-01-19 19:23:32 +02:00
parent a4f3648320
commit e2bbdd7bc3
2 changed files with 32 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
static/main/js/typewriter.js
View File

@ -1,46 +1,38 @@
const TEXT_DISPLAY = document.getElementById("text")
const PHRASES = ["Software Developer", "Jedi"]
let i = 0
let j = 0
let current_phrase = []
let is_deleting = false
let is_end = false
const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms))
typewriter = () => {
is_end = false
TEXT_DISPLAY.innerHTML = current_phrase.join("")
async function typewriter() {
const TEXT_DISPLAY = document.getElementById("rotating-text")
const PHRASES = ["Software Developer", "Jedi", "Student"]
let current_phrase = []
let is_end = false
if (i < PHRASES.length) {
if (!is_deleting && j <= PHRASES[i].length) {
current_phrase.push(PHRASES[i][j])
j++
TEXT_DISPLAY.innerHTML = current_phrase.join("")
}
if (is_deleting && j <= PHRASES[i].length) {
current_phrase.pop(PHRASES[i][j])
j--
TEXT_DISPLAY.innerHTML = current_phrase.join("")
}
if (j == PHRASES[i].length) {
is_end = true
is_deleting = true
}
if (is_deleting && j === 0) {
current_phrase = []
is_deleting = false
i++
if (i === PHRASES.length) {
i = 0
while (1) {
for (let phrase in PHRASES) {
console.log(PHRASES[phrase])
if (!is_end) {
for (let character in PHRASES[phrase]) {
current_phrase.push(PHRASES[phrase][character])
TEXT_DISPLAY.innerHTML = current_phrase.join("")
await sleep(150)
}
if (current_phrase.join("") == PHRASES[phrase]) {
await sleep(1000)
is_end = true
}
} else {
while (1) {
current_phrase.pop()
if (!current_phrase.length) {
is_end = false
TEXT_DISPLAY.innerHTML = "&nbsp;"
await sleep(500)
break
}
TEXT_DISPLAY.innerHTML = current_phrase.join("")
await sleep(80)
}
}
TEXT_DISPLAY.innerHTML = "&nbsp;" // prevent element movement
}
}
const TYPING_SPEED = Math.random() * 300
const DELETE_SPEED = Math.random() * 100
const TIME = is_end ? 2000 : is_deleting ? DELETE_SPEED : TYPING_SPEED
setTimeout(typewriter, TIME)
}
window.addEventListener("load", typewriter)

2
templates/main/index.html
View File

@ -20,7 +20,7 @@
<h1 class="text">
I&#39;m <span class="highlight">Kristofers Solo</span>
</h1>
<h1 id="text" class="text">&nbsp;</h1>
<h1 id="rotating-text" class="text">&nbsp;</h1>
<!-- ICONS -->
<div class="landing-icons">
<a class="social-link email"