You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
92 lines
2.3 KiB
JavaScript
92 lines
2.3 KiB
JavaScript
document.addEventListener('keydown', updateChar);
|
|
document.addEventListener('keyup', stopChar);
|
|
|
|
var i = 0;
|
|
var txt = '';
|
|
var speed = 50;
|
|
var keyisdown = 0;
|
|
var newpercentage = 0;
|
|
|
|
var tempwdth = 50;
|
|
var tempXTRA = 400;
|
|
var tempXOPQ = 60;
|
|
|
|
var fontstring = 'font-variation-settings: "wdth" 50, "XTRA" 400, "XOPQ" 60;';
|
|
//------- experiment with keydown keyup
|
|
|
|
var timer;
|
|
|
|
function updateChar(e) {
|
|
// console.log(e);
|
|
if(keyisdown == 0){typeWriter()};
|
|
keyisdown = 1;
|
|
if(timer) return;
|
|
timer= setInterval(growLetter, 1);
|
|
}
|
|
|
|
function stopChar() {
|
|
keyisdown = 0;
|
|
clearInterval(timer);
|
|
timer= null;
|
|
|
|
tempwdth = 50;
|
|
tempXTRA = 400;
|
|
tempXOPQ = 60;
|
|
}
|
|
|
|
//--------------the typewriter stuff
|
|
|
|
function typeWriter() {
|
|
//clear the html initially for a text
|
|
if (i === 0)
|
|
document.getElementById("current").innerHTML = '';
|
|
|
|
if (i < txt.length) {
|
|
restoreText();
|
|
document.getElementById("current").innerHTML += "<span id='"+i+"' class='visible' style='"+fontstring+"'>"+txt.charAt(i)+"</span>";
|
|
i++;
|
|
if(txt.charAt(i-1)==" "){typeWriter()};
|
|
}
|
|
if(i==txt.length){
|
|
clearText();
|
|
i++;
|
|
setTimeout(newQuote, 4000);
|
|
}
|
|
}
|
|
|
|
var quotes = [
|
|
"I was at a festival or summer camp. I looked in the main room and saw loads of synths set up, they were going to play a gig. And my brother was going to play with them. I was so annoyed and upset that they didn't tell me.",
|
|
"I was a designer, a weapons designer. I made a drone for a friend but he used it for evil. A woman got hurt, we were eating jelly. When he died she would go in an orphanage, I would be put in the army. My stomach was going to explode. In the army I finished painting my red stencils, warning signs. "
|
|
]
|
|
//var quotes = ["test1.", "test2."]
|
|
|
|
function newQuote() {
|
|
//set the typing text
|
|
txt = quotes[Math.floor(Math.random() * quotes.length)];
|
|
|
|
//reset the index
|
|
i = 0;
|
|
}
|
|
|
|
function clearText(){
|
|
document.getElementById('current').classList.add("disappear");
|
|
}
|
|
|
|
function restoreText(){
|
|
document.getElementById('current').classList.remove("disappear");
|
|
}
|
|
|
|
function growLetter() {
|
|
targetwdth = 151;
|
|
targetXTRA = 603;
|
|
targetXOPQ = 175;
|
|
document.getElementById(i-1).style.fontVariationSettings = "\"wdth\" " + tempwdth + ", \"XTRA\" " + tempXTRA + ", \"XOPQ\" " + tempXOPQ;
|
|
|
|
tempwdth++;
|
|
tempXTRA++;
|
|
// tempXOPQ++;
|
|
}
|
|
|
|
newQuote();
|
|
|