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 sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms))
const PHRASES = ["Software Developer", "Jedi"]
let i = 0
let j = 0
let current_phrase = []
let is_deleting = false
let is_end = false
typewriter = () => { async function typewriter() {
is_end = false const TEXT_DISPLAY = document.getElementById("rotating-text")
TEXT_DISPLAY.innerHTML = current_phrase.join("") const PHRASES = ["Software Developer", "Jedi", "Student"]
let current_phrase = []
let is_end = false
if (i < PHRASES.length) { while (1) {
if (!is_deleting && j <= PHRASES[i].length) { for (let phrase in PHRASES) {
current_phrase.push(PHRASES[i][j]) console.log(PHRASES[phrase])
j++ if (!is_end) {
TEXT_DISPLAY.innerHTML = current_phrase.join("") for (let character in PHRASES[phrase]) {
} current_phrase.push(PHRASES[phrase][character])
if (is_deleting && j <= PHRASES[i].length) { TEXT_DISPLAY.innerHTML = current_phrase.join("")
current_phrase.pop(PHRASES[i][j]) await sleep(150)
j-- }
TEXT_DISPLAY.innerHTML = current_phrase.join("") if (current_phrase.join("") == PHRASES[phrase]) {
} await sleep(1000)
is_end = true
if (j == PHRASES[i].length) { }
is_end = true } else {
is_deleting = true while (1) {
} current_phrase.pop()
if (!current_phrase.length) {
if (is_deleting && j === 0) { is_end = false
current_phrase = [] TEXT_DISPLAY.innerHTML = "&nbsp;"
is_deleting = false await sleep(500)
i++ break
if (i === PHRASES.length) { }
i = 0 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) window.addEventListener("load", typewriter)

2
templates/main/index.html
View File

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