Home - Old Man Programmer

Displaying webapps/vt100/player.js

var player = {
  width : 0, height: 0,
  keyFrames  : null,
  scriptData : null,
  timingData : null,
  sz : null,
  sp : 0, 
  td : 0,
  ms : 0,
  playing : false,
  timeout : null,
  tpos: 0, ttime : 0,
  // Control elements:
  vpos : null, pp : null, rp : null, pbspeed : null,
  speed : 1000,

  starttime : 0,
  
  init : function(script) {
    var data = JSON.parse(script);
    this.width = data.size[0];
    this.height = data.size[1];
    this.scriptData = data.script;
    this.timingData = data.timing;
    this.keyFrames = data.kf;
    this.tpos = 0;
    this.ttime = 1000*data.ttime;
    this.sz = data.sz;
    this.sp = this.td = 0;
    this.ms = 0.0;

    if ("audio" in data) {
      this.hasaudio = true;
      this.audio = new Audio(data.audio);
      console.log("Loading audio ", data.audio, this.audio);
      this.audio.autoplay = false;
      this.audio.controls = false;
      this.audio.loop = false;
      document.body.appendChild(this.audio);
    } else this.hasaudio = false;

    this.vpos = document.getElementById('vpos');
    this.vpos.onclick = this.moveto;
    this.vpos.value = 0;

    this.pp = document.getElementById('pp');
    this.rp = document.getElementById('replay');
    this.pp.onclick = this.play;
    this.rp.onclick = this.replay;
    this.pp.disabled = this.rp.disabled = false;

    this.pbspeed = document.getElementById('pbspeed');
    this.pbspeed.oninput = this.setspeed;
    this.pbspeed.value = 1000;
    console.log("script loaded");
    terminal.init(this.width, this.height, false);
  },

  setspeed : function() {
    player.speed = player.pbspeed.value;
    console.log("speed = %d", player.speed);
  },

  moveto : function() {
    if (player.timeout != null) {
      clearTimeout(player.timeout);
      player.timeout = null;
    }
    var per = vpos.value;
    var kfn = Math.floor((player.keyFrames.length/100)*per);
    console.log(per, kfn);
    var kf = player.keyFrames[kfn];
    player.td = kf.td;
    player.sp = kf.sp;
    player.tpos = kf.ts;
    terminal.loadState(kf.frame);

    if (player.playing) {
      player.starttime = Date.now()-kf.ts;
      player.timeout = setTimeout(player.player, kf.ms);
      if (player.hasaudio) {
	player.audio.fastSeek(kf.ts/1000.0);
	player.audio.play();
      }
    }
  },
  setvpos : function() {
    this.vpos.value = 100 * (this.tpos/ this.ttime);
  },
  player : function() {
    var time = Date.now() - player.starttime;
    var tdiff = player.tpos - time;
//    console.log(player.tpos, time, tdiff);

    if (player.td >= player.timingData.length) return;
    var r = player.timingData[player.td++];
    player.ms = parseInt(player.speed * r[0]);
    if (tdiff < 0) player.ms = Math.max(0, player.ms + tdiff);

    terminal.addstr(player.scriptData.substr(player.sp, r[1]));

    player.sp += r[1];
    player.tpos += 1000 * r[0];
    player.setvpos();

    player.timeout = setTimeout(player.player, player.ms);
  },
  replay : function () {
    if (player.timeout != null) {
      clearTimeout(player.timeout);
      player.timeout = null;
    }
    player.sp = player.td = player.tpos = 0;
    terminal.reset();
    player.pp.innerHTML = "||";
    player.pp.onclick = player.pause;
    player.starttime = Date.now();
    player.setvpos();
    player.ms = 0;
    if (player.hasaudio) {
      player.audio.fastSeek(0.0);
      player.audio.play();
    }
    player.playing = true;
    player.timeout = setTimeout(player.player, 0);
  },
  pause : function () {
    if (player.timeout != null) {
      clearTimeout(player.timeout);
      player.timeout = null;
    }
    player.pp.innerHTML = "&rtrif;";
    player.pp.onclick = player.play;
    player.playing = false;
    if (player.hasaudio) player.audio.pause();
  },
  play : function () {
    player.pp.innerHTML = "||";
    player.pp.onclick = player.pause;
    player.starttime = Date.now() - player.tpos;
    player.playing = true;
    player.timeout = setTimeout(player.player, player.ms);
    if (player.hasaudio) {
      player.audio.fastSeek(player.tpos/1000.0);
      player.audio.play();
    }
  }
}

function loadscript() {
  var e = document.getElementById("script");
  if (e.value.length == 0) return;

  var req = new XMLHttpRequest();
  req.open("GET", "script/" + e.value, true);
  req.onreadystatechange = function() {
    if (req.status == 200 && req.readyState == 4) {
      player.init(req.responseText);
    }
  }
  req.send();
}