fix: restructered root dir
This commit is contained in:
84
src/routes/+page.svelte
Normal file
84
src/routes/+page.svelte
Normal file
@@ -0,0 +1,84 @@
|
||||
<!-- <div id="navbar">
|
||||
<button>Home</button>
|
||||
<button>About</button>
|
||||
<!-- turning ideas into reality with tech -->
|
||||
<!-- into gritty hard-scifi games -->
|
||||
<!-- <button>Projects</button>
|
||||
<button>Hobbies</button>
|
||||
<button>Contact</button>
|
||||
</div> -->
|
||||
|
||||
<svelte:head>
|
||||
<title>Jeremy Janella | Computer Scientist</title>
|
||||
</svelte:head>
|
||||
|
||||
<div id="name-card" class="align-right card">
|
||||
<p id="HeyIm">Hey! My name is</p>
|
||||
<span use:animateTyping={["Jeremy Janella"]} id="jeremymaxxing"></span>
|
||||
<p>An experienced full stack developer, cybersecurity enthusiast, and computer science student at the University of Toronto active in CTFs, hackathons, programming competitions, and indie developer of the soon-to-be-released game Subterworks</p>
|
||||
<p>This site is still being ported!</p>
|
||||
<!-- <p>Computer nerd, gamer, mountain biker, adventurer, hard sci-fi enjoyer, ethics enjoyer, swimmer, jumper</p> -->
|
||||
</div>
|
||||
|
||||
<!-- <p>Computer Science Student, Interested in Cyber Security, Networiking, Open source, and always learning something new</p>-->
|
||||
|
||||
<!-- Game dev, servers experiements, cyberpatriot, linux, ai serversresume-->
|
||||
|
||||
<script lang="ts">
|
||||
export function animateTyping(node: HTMLElement, texts: string[]) {
|
||||
let textsToType = texts;
|
||||
|
||||
let textsIndex = 0;
|
||||
let charIndex = 0;
|
||||
let currentText = '';
|
||||
|
||||
const updateInnerHTML = () => {
|
||||
// Always include the zero-width space and conditionally add the text and cursor
|
||||
node.innerHTML = '​' + currentText;
|
||||
};
|
||||
|
||||
const waitMsec = (delay: number) => {
|
||||
setTimeout(() => { updateInnerHTML();}, delay);
|
||||
};
|
||||
|
||||
// Typing animation effect
|
||||
const typeEffect = () => {
|
||||
const currentString = textsToType[textsIndex];
|
||||
const delay = currentString[charIndex] === ' ' ? 25 : 30;
|
||||
|
||||
if (charIndex < currentString.length) {
|
||||
currentText += currentString[charIndex++];
|
||||
setTimeout(typeEffect, delay);
|
||||
} else {
|
||||
waitMsec(3000);
|
||||
setTimeout(deleteEffect, 6000); // Wait before starting to delete
|
||||
}
|
||||
|
||||
updateInnerHTML();
|
||||
};
|
||||
|
||||
// Deleting animation effect
|
||||
const deleteEffect = () => {
|
||||
if (charIndex > 0) {
|
||||
currentText = currentText.slice(0, --charIndex);
|
||||
setTimeout(deleteEffect, 20);
|
||||
} else {
|
||||
textsIndex = (textsIndex + 1) % textsToType.length;
|
||||
currentText = ''; // Clear text but keep zero-width space
|
||||
setTimeout(typeEffect, 1250);
|
||||
}
|
||||
|
||||
updateInnerHTML();
|
||||
};
|
||||
|
||||
// Start typing effect
|
||||
setTimeout(typeEffect, 250);
|
||||
|
||||
return {
|
||||
onDestroy() {},
|
||||
update(newTexts: string[]) {
|
||||
textsToType = newTexts;
|
||||
}
|
||||
};
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user