var welcomeStyle;
var lastClip;
var t_o;
function start() {
  lastClip = 0;
  clips.pointer++;
  if (clips.pointer < clips.length) {  
    welcomeStyle = document.getElementById(clips[clips.pointer]).style;
    t_o = setInterval(welcome_clip, 20);
  } else {
    document.getElementById("clickHere").style.display = "block";
    start2();
  }
}

function welcome_clip() {
  lastClip += 7;
  welcomeStyle.clip = "rect(auto "+lastClip+"px auto auto)";
  if (lastClip >= 700) {
    clearInterval(t_o);
    start();
  }
}

var clips = ["welcome_one", "welcome_two"];
clips.pointer = -1;

var movingPath = null;
var movingPathIndex = -1;
var movingPathT = -100;
var movingSpan = null;
var start_ms;
var length_ms = 10000;

function movingPathY(t) {
  if (t < .1) {
    return (10 - ((.1 - t) * 500)) + "px";
  }
  if (t > .9) {
    return (10 - ((t - .9) * 500)) + "px";
  }
  return "10px";
}

function movingPathX(t) {
  if (t < .1) {
    return "20%";
  }
  if (t > .9) {
    return "60%";
  }
  var response = (((t - .1) / 2) + .2) * 100 + "%";
  return response;
}

function moveSpan() {
  movingPathT = ((new Date() * 1) - start_ms) / length_ms;
  movingSpan.style.left = movingPathX(movingPathT);
  movingSpan.style.top = movingPathY(movingPathT);

  if (movingPathT > 1) {
    start2();
  } else {
    setTimeout(moveSpan, 0);
  }
}

function start2() {
  if (!movingPath) {
    movingPath = document.getElementById("movingPath");
  }
  start_ms = new Date() * 1;
  movingPathIndex++;
  if (movingPathIndex == movingPath.childNodes.length) {
    movingPathIndex = 0;
  }
  movingSpan = movingPath.childNodes[movingPathIndex];
  moveSpan();
}

window.onload = start;

if (window.onload == start) {
  var str="<style type='text/css'><!--\n.welcome {clip: rect(auto 0px auto auto);}#clickHere {display:none;}--></style>"
  document.write(str);
}