JSFiddle - React, Tailwind, and code Playground

HTML

<div id="contenedor_barra" style="width:300px; margin:0 auto; position:relative">
<div id="barra" onclick="reproductor.ir(event)"  style="width:300px;height:80px; background-color:#900"></div>
<div id="navegacion" style="width:5px;  height:80px; position:absolute; left:0; top:0;  background-color: #9C0"></div>

<br />
<div id="time">0:00</div>
<br />
<button id="pausar" onclick="if(reproductor.pausado){this.innerHTML = 'Pausar'; reproductor.pausado = false;}else{reproductor.pausado = true; this.innerHTML = 'Play'}">Pausar</button>

CSS

div {
    margin:0;
    padding:0;
    
}

JavaScript

function reproductor(){
    this.tiempo = "01:15", 
    this.barra = document.getElementById("barra")
    this.ir = function(event){ this.segundoActual = (this.segundos / barra.style.width.replace("px","")) * event.offsetX; this.pausado = false; document.getElementById("pausar").innerHTML = "Pausar"  }
    this.navegacion = document.getElementById("navegacion")
    this.time = document.getElementById("time")
    this.segundos =  Number(this.tiempo.split(":")[0] * 60) + Number(this.tiempo.split(":")[1])
    this.pasos = barra.style.width.replace("px","") / this.segundos
    this.segundoActual = 0;    
    this.pausado = false;
    this.animacion = setInterval(function(){
        if(!reproductor.pausado){
        reproductor.navegacion.style.left = (Math.round((reproductor.pasos ) * reproductor.segundoActual)) + "px";
        reproductor.segundoActual += 0.03125;
        reproductor.final = reproductor.barra.style.width.replace("px","") - reproductor.navegacion.style.width.replace("px","");
        reproductor._minutos = Math.floor(Math.round(reproductor.segundoActual)/60)
        reproductor._segundos =  Math.round(reproductor.segundoActual) - (reproductor._minutos*60)
        if(String(reproductor._minutos).length < 2){
            reproductor._minutos = String("0") + String(reproductor._minutos)            
        }
        if(String(reproductor._segundos).length < 2){
            reproductor._segundos = String("0")+ String(reproductor._segundos)            
        }
        reproductor.time.innerHTML = reproductor._minutos + ":" + reproductor._segundos
        if(reproductor.segundoActual >= reproductor.segundos || reproductor.navegacion.style.left.replace("px","") > reproductor.final ){
                
            reproductor.navegacion.style.left = reproductor.final  + "px"
            reproductor.time.innerHTML = reproductor.tiempo;
            reproductor.pausado = true;
            document.getElementById("pausar").innerHTML = "Pausar"
        }        ...