Simple Typing Script

[TrinityCore]

Buenas.
Quería dejarles un simple script que acabo de crear al estar aburrido.

La verdad es muy simple, pero bueno, ami me viene bien para los juegos, en los momentos de "cinemáticas" donde hablan los personajes.
O para mostrar mensajes en nuestras webs de manera sencilla.

Clase Typed:

Código Javascript:

class Typed{
    constructor(){
        this.selector;
        this.typeds = [];
        this.id = 0;
        this.char = 0;
        this.interval;
        this.lightActive = true;
        this.html;
        this.string;
        Typed.light = {fade: 250};
        return this;
    }
    create(selector, object, typingTime, timeBeforeClear, timeNextText, repeat){
        if(!typingTime){
            this.typingTime = 0;
        }
        if(!timeBeforeClear){
            this.timeBeforeClear = 0;
        }
        if(!timeNextText){
            this.timeNextText = 0;
        }
        if(!repeat){
            this.repeat = false;
        }
        this.typingTime = typingTime;
        this.timeBeforeClear = timeBeforeClear;
        this.timeNextText = timeNextText;
        this.repeat = repeat;
        for(var i = 0; i < object.length; i++){
            this.typeds.push(object[i]);
        }
        this.selector = selector;
        return this;
    }
    add(object){
        for(var i = 0; i < object.length; i++){
            this.typeds.push(object[i]);
        }
    }
    start(){
        var self = this;
        if(!this.lightEffect){
            this.LightInterval = setInterval("Typed.lightFade()", 0);
            this.lightEffect = true;
        }
        if(this.typeds[this.id] != undefined){
            setTimeout(function(){
                self.read();
            }, this.typingTime);
        }else{
            if(this.repeat){
                this.resetTypping();
            }
        }
    }
    read(){
        this.removeLight();
        var self = this;
        if(this.char >= this.typeds[this.id].length){
            setTimeout(function(){
                self.delete();
            }, this.timeBeforeClear);
            this.addLight();
            return false;
        }
        $(this.selector.selector).append(this.typeds[this.id].charAt(this.char));
        this.addLight();
        this.char++;
        setTimeout(function(){
            self.read();
        }, this.typingTime);
    }
    delete(){
        var self = this;
        this.removeLight();
        this.html = $(this.selector.selector).html();
        if(this.char <= 0){
            this.id++;
            setTimeout(function(){
                self.start();
            }, this.timeNextText);
            this.addLight();
            return false;
        }
        this.string = this.html.substr(0, this.html.length-1);
        $(this.selector.selector).html(this.string);
        this.char--;
        this.addLight();
        setTimeout(function(){
            self.delete();
        }, this.typingTime);
    }
    addLight(){
        $(this.selector.selector).append("<span class='light'></span>");
    }
    removeLight(){
        $(this.selector.selector+" .light").remove();
    }
    static lightFade(){
        this.lightActive = !this.lightActive;
        if(this.lightActive){
            $(".light").fadeOut(Typed.light.fade);
            return false;   
        }
        $(".light").fadeIn(Typed.light.fade);
    }
    resetTypping(){
        this.id = 0;
        this.char = 0;
        this.start();
    }
}
 

Código para inicializar:

#1 = Elemento donde escribira Ej: $(".text")
#2 = Array de textos Ej: ["Mensaje 1", "Mensaje 2", "Etc..."]
#3 = Tiempo que tardara en escribir el mensaje
#4 = Tiempo de espera antes de borra mensaje
#5 = Tiempo de espera antes de mostrar el siguiente mensaje
#6 = Repeticion >> True = si, False = no.

Código Javascript:

var T1 = new Typed();
T1.create(#1, #2, #3, #4, #5, #6);
T1.start();
 

html basico:

Código HTML:

<div id='typping-content'>
      <p class='text'></p>
</div> 

DEMO: AQUI

Espero que a alguien le sirva aunque sea muy básico.
saludos!