-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtyped.min.js
1 lines (1 loc) · 1.78 KB
/
typed.min.js
1
class Typed{constructor(a,{strings:b=[""],typeSpeed:c=1,backSpeed:d=1,loop:e=!1,IPColor:f="rgb(0, 0, 0)"}){this.text=document.querySelector(a),this.typeSpeed=1/c*1e3,this.backSpeed=1/d*1e3,this.words=b,this.loop=e,this.IPColor=f}start(){let a=this.words,b=(this.typeSpeed+this.backSpeed)*2;this.text.textContent=this.text.textContent||" ",this.addIP(),this.typeOut(),this.loop?(this.display(),setInterval(()=>{this.display()},b*a.length)):(this.display(),setTimeout(()=>{this.typeIn(a[0])},b*(a.length+1)),setTimeout(()=>{let a=document.querySelector(`.${this.IPClass}`);a.style.display="none"},b*(a.length+1)+1e3))}display(){let a=this.words,b=(this.typeSpeed+this.backSpeed)*2;a.forEach((c,a)=>{setTimeout(()=>{this.typeIn(c),this.typeOut()},b*(a+1))})}animateIP(b){let c=document.querySelector(`.${this.IPClass}`),a={duration:800,iterations:1/0};b||(a.iterations=0),c.animate([{background:"transparent"}],a)}addIP(){let b=this.text;b.style.position="relative",b.style.width="max-content";let a=document.createElement("div");this.IPClass=`IP${Math.floor(1e17*Math.random())}`,a.className=this.IPClass,b.append(a),a.style.content="",a.style.position="absolute",a.style.height="100%",a.style.transform="translateX(100%)",a.style.background=`${this.IPColor}`,a.style.width="2px",a.style.top="0",a.style.right="0",this.animateIP(!0)}typeIn(a){let b=this.typeSpeed/a.length,c="";a.split("").forEach((d,a)=>{setTimeout(()=>{c+=d,this.text.firstChild.textContent=c},b*(a+1))})}typeOut(){this.animateIP(!1);let a=this.backSpeed;setTimeout(()=>{let b=document.querySelector(`.${this.IPClass}`),c=this.text.innerText,d=c.split("");d.forEach((_,e)=>{setTimeout(()=>{d.pop(),this.text.firstChild.textContent=d.join(""),b.style.animation="none"},a/c.length*(e+1)+a)}),b.style.animation="blink 0.8s infinite"},a)}}export default Typed