var slogans = new Array (
  "Det er sjovt at danse hos <b>Reinhardt dans</b>",
  "Vi danser alle sammen hos <b>Reinhardt dans</b>");

var colors = new Array (
  "#FFFFFF",
  "#F2F2F2",
  "#E6E6E6",
  "#D9D9D9",
  "#CCCCCC",
  "#BFBFBF",
  "#B2B2B2",
  "#A6A6A6",
  "#999999",
  "#8C8C8C",
  "#808080",
  "#737373",
  "#666666",
  "#595959",
  "#4D4D4D",
  "#404040",
  "#333333",
  "#262626",
  "#191919",
  "#0D0D0D",
  "#000000");

var sloganIdx = -1;
var colorIdx1 = 0;
var colorIdx2 = colors.length - 1;
var emp1 = document.getElementById('emp1');
var emp2 = document.getElementById('emp2');

function startSlogan() {
  changeSlogan(true);
}

function changeSlogan(empDiv) {
  sloganIdx += 1;
  if (sloganIdx >= slogans.length) {
    sloganIdx = 0;
  }
  if (empDiv) {
    emp1.innerHTML = slogans[sloganIdx];
  } else {
    emp2.innerHTML = slogans[sloganIdx];
  }

  fadeText(empDiv, 1);
  fadeText(!empDiv, -1);
}

function fadeText(empDiv, change) {
  var color;
  if (empDiv) {
    colorIdx1 += change;
    color = colorIdx1;
  } else {
    colorIdx2 += change;
    color = colorIdx2;
  }
  if (color > -1 && color < colors.length) {
    if (colorIdx1 == Math.floor(colors.length / 2)) {
      if (change > 0) {
        if (empDiv) {
          emp1.style.zIndex = 1;
          emp2.style.zIndex = 0;
        } else {
          emp1.style.zIndex = 0;
          emp2.style.zIndex = 1;
        }
      }
    }
    if (empDiv) {
      emp1.style.color = colors[color];
    } else {
      emp2.style.color = colors[color];
    }

    setTimeout("fadeText(" + empDiv + ", " + change + ");", 4000 / colors.length);
  } else if (change > 0) {
    setTimeout("changeSlogan(" + !empDiv + ");", 10000);
  }
}

startSlogan();