Frase cambiante en el subtítulo

[Pantaláimon]

Orientado a objetos: https://jsfiddle.net/hct6q5ce/

Código HTML:

<h1 id="rotando"></h1>
<script>
var rotor = new Rotor ({
    id: 'rotando',
    interval: 1000,
    frases: [
        "TEXTO FRASE 0<br>-AUTOR 0",
        "TEXTO FRASE 1<br>-AUTOR 1",
        "TEXTO FRASE 2<br>-AUTOR 2"
    ]
});
 
rotor.play();
</script>
 

Código Javascript:

function Rotor(options) {
    if (!(this instanceof Rotor)) {
        return new Rotor(options)
    }
    
    this.frases   = options.frases
    this.elem     = document.getElementById(options.id) //|| options.elem
    this.interval = options.interval
    this.indice   = Math.floor(Math.random() * this.frases.length)
}
 
Rotor.prototype.play = function () {
    if (this.indice === this.frases.length) {
        this.indice = 0
    }
    this.elem.innerHTML = this.frases[this.indice]
    console.log(this.indice)
    ++this.indice
    setTimeout(this.play.bind(this), this.interval)
}