2021-06-29 22:37:10 +00:00
|
|
|
class typer{
|
2021-06-27 21:44:28 +00:00
|
|
|
|
2021-06-29 22:37:10 +00:00
|
|
|
constructor(text, retypeText){
|
|
|
|
this.i = 0;
|
|
|
|
this.x = 0;
|
|
|
|
this.item = document.getElementById("type");
|
|
|
|
this.text = text;
|
|
|
|
this.retypeText = retypeText;
|
|
|
|
}
|
|
|
|
|
|
|
|
type(){
|
|
|
|
this.item.innerHTML += this.text[this.x].charAt(this.i);
|
|
|
|
this.i++;
|
|
|
|
|
|
|
|
if (this.i < this.text[this.x].length) {
|
|
|
|
setTimeout(() => {
|
|
|
|
this.type();
|
|
|
|
}, 150);
|
|
|
|
}else{
|
|
|
|
if(this.retypeText == true){
|
|
|
|
this.i = 0;
|
|
|
|
setTimeout(() => {
|
|
|
|
this.retype();
|
2021-07-26 19:46:24 +00:00
|
|
|
}, 2000);
|
2021-06-29 22:37:10 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2021-06-27 21:44:28 +00:00
|
|
|
|
2021-06-29 22:37:10 +00:00
|
|
|
retype() {
|
|
|
|
this.item.innerHTML = this.item.innerHTML.substring(0, this.item.innerHTML.length-1);
|
2021-06-27 21:44:28 +00:00
|
|
|
|
2021-06-29 22:37:10 +00:00
|
|
|
if (this.item.innerHTML.length > 0) {
|
|
|
|
setTimeout(() => {
|
|
|
|
this.retype();
|
|
|
|
}, 100);
|
|
|
|
}else{
|
|
|
|
this.x++;
|
2021-07-26 19:46:24 +00:00
|
|
|
//this.x > this.text.length -1 || loop
|
2021-06-29 22:37:10 +00:00
|
|
|
if(this.x >= this.text.length - 1){
|
|
|
|
//this.x = 0;
|
|
|
|
this.retypeText = false;
|
|
|
|
}
|
|
|
|
this.type();
|
|
|
|
}
|
2021-06-27 21:44:28 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2021-07-26 19:46:24 +00:00
|
|
|
var pagetyper = new typer(["//Junior Software Developer", "//Aspiring Backend Engineer"], true);
|
|
|
|
|
|
|
|
setTimeout(() =>{
|
|
|
|
pagetyper.type();
|
|
|
|
}, 750)
|