Foros del Web » Programando para Internet » Javascript »

Modificar Script de Subtitulos

Estas en el tema de Modificar Script de Subtitulos en el foro de Javascript en Foros del Web. Hola gente, quiero modificar un script que muestra subtitulos srt en videos que estan dentro de la etiqueta video, el tema está en que logicamente ...
  #1 (permalink)  
Antiguo 16/09/2016, 05:58
 
Fecha de Ingreso: septiembre-2009
Mensajes: 39
Antigüedad: 14 años, 7 meses
Puntos: 0
Modificar Script de Subtitulos

Hola gente, quiero modificar un script que muestra subtitulos srt en videos que estan dentro de la etiqueta video, el tema está en que logicamente muestra un solo subtitulo, y yo quisiera que muestre 2 a la vez, los subtitulos tal como dije son archivos srt y en el html se ve un formulario con el listado de idiomas dentro de labels de tipo radio, por lo cual le cambie el tipo y le puse que sea checkbox, ahora si bien permite elegir mas de uno, me muestra solo el primer checkbox que encuentre con el checked activado.

El script está conformado por 2 archivos: uno que es el que se encarga de traer el srt, y el otro de incrustarlo dentro del html, he probado de mil formas y no me sale que se muestren 2 subtitulos elegidos, les dejo los JS aqui debajo a ver si me pueden dar una mano, gracias.

video_subtitles.js
Código:
var submanager = {
	video: null,
	init: function(videoElt, subElement) {
		this.video = videoElt;
		this._conductor.subElt = subElement;

    var self = this;
    this.video.addEventListener("timeupdate", function() {
      if (self.video.paused || self.video.ended) {
        return;
      }
      self._conductor.update(self.video.currentTime);
    }, false);


	},
	setSubtitles: function(srtURL) {
		this._compileSubtitle(srtURL);
	},


  _compileSubtitle: function(srtURL) {
    var xhr = new XMLHttpRequest();

    this._conductor.flush();
    var self = this;
    xhr.onreadystatechange = function() {
      if (xhr.readyState == 4) {
        subSource = xhr.responseText;
        subSource = subSource.split("\n");
        self._parseSubtitles(subSource); 
      }
    }
    xhr.open("GET", srtURL, true); 
    xhr.send(null);
  },

  _parseSubtitles: function(srt) {
    var l = 0;

    function eatTheMess(srt, l) {
      while (true) {
        var currentLine = srt[l];
        if (currentLine.indexOf(" --> ") == -1 || currentLine[0] == "#") {
          l++;
          if (l >= srt.length)
            break;
        } else {
          break;
        }
      }
      return l;
    }
    function getTimeCodes(srt, l, t1, t2) {
      function str2seconds(str) {
        var s = str.split(':');
        s[3] = s[2].split(',')[1];
        s[2] = s[2].split(',')[0];
        return (parseInt(s[2], 10) + s[0] * 3600 + s[1] * 60 + s[3] / 1000);
      }
      var currentLine = srt[l];

      var i = currentLine.indexOf(" --> ");
      var t1AsStr = currentLine.substring(0, i);
      var t2AsStr = currentLine.substring(i + 5);
      t1.value = str2seconds(t1AsStr);
      t2.value = str2seconds(t2AsStr);
    }
    function getText(srt, l, text) {
      text.value = srt[l];
    }

    var subTitles = [];
    while (true) {
      var t1 = {};
      var t2 = {};
      var text = {};

      l = eatTheMess(srt, l);
      if (l >= srt.length)
        break;
      getTimeCodes(srt, l, t1, t2);
      l++;
      getText(srt, l, text);
      subTitles.push({t1: t1.value, t2: t2.value, txt: text.value});
      l++;

      if (l >= srt.length) {
        break;
      }
    }
    for (var i in subTitles)
      this._conductor.pool.push(subTitles[i]);
    return;
  },

	_conductor: {
		currentAction: null,
		pool: [],
		displaySubtitle: function(str) {
			this.subElt.innerHTML = str;
			this.subElt.style.visibility = "visible";
		},
		hideSubtitle: function() {
			this.subElt.style.visibility = "hidden";
		},
		flush: function(t) {
			this.hideSubtitle();
			this.currentAction = null;
			this.pool = [];
		},
		update: function(t) {
			if (this.pool.length == 0) return;

			for (var i in this.pool) {
				var a = this.pool[i];
				if (this.currentAction && t >= this.pool[this.currentAction].t2)
					this.hideSubtitle();

				if (t >= a.t1 && t < a.t2) {
					if (this.currentAction != i) {
						this.currentAction = i;
						this.displaySubtitle(a.txt);
					} else {break;}
				}
			}
		}
	}
}
main.js
Código:
var processor = {
  video: null,

  compileArgs: function() {
    var en = document.getElementById("en").checked;
    var es = document.getElementById("es").checked;
    var fr = document.getElementById("fr").checked;
    var src = en ? "srt/en.srt" : es ? "srt/es.srt" : "srt/fr.srt";
    this.video.setAttribute("subtitles", src);
    document.getElementById("source").setAttribute("href", src);
  },

  doLoad: function() {
    var args = document.getElementById("args");
		
		var self = this;
    args.addEventListener("click", function() {
			self.compileArgs();
			submanager.setSubtitles(video.getAttribute("subtitles"));
    }, true);

    var video = document.getElementById("video");
		this.video = video;

		this.compileArgs();

		var subElt = document.getElementById("subtitle");
		submanager.init(video, subElt);
		submanager.setSubtitles(video.getAttribute("subtitles"));
  }
};

Etiquetas: html, js, modificar, subtitulos, text
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:25.