var nav = navigator.userAgent;
var saf = navigator.userAgent.indexOf("Safari")>-1;
var ie = navigator.userAgent.indexOf("MSIE")>-1;

function getStyle(styleName, el) {
  if (!el) return false;
  if (el.currentStyle) {
    return el.currentStyle[styleName];
  } else if (document.defaultView) {
    return document.defaultView.getComputedStyle(el, null)[styleName];
  }
}

function getOffset(el) {
  var x=0, y=0;
  while(el.offsetParent) {
    x += el.offsetLeft;
    y += el.offsetTop;
    el = el.offsetParent;
  }
  return [x, y];
}

function getYScroll() {
  if (!saf) {
    return document.documentElement.scrollTop;
  } else {
    return document.getElementsByTagName("body")[0].scrollTop;
  }
}

var scrollBoxes = new Array();

function scrollBox(el) {
  this.box = el;
  var c = this.box.childNodes, c2;
  for (var i=0, l=c.length; i<l; i++) {
    if (!c[i].className) continue;
    c2 = c[i].className;
    if (c2.indexOf("scrolled-content")>-1) this.overflow = c[i];
    else if (c2.indexOf("scroll")>-1) this.scroll = c[i];
  }
  c = this.scroll.childNodes;
  for (var i=0, l=c.length; i<l; i++) {
    if (!c[i].className) continue;
    c2 = c[i].className;
    if (c2.indexOf("bg")>-1) this.scrollArea = c[i];
    else if (c2.indexOf("bullet")>-1) this.scrollBullet = c[i];
    else if (c2.indexOf("close")>-1) this.close = c[i];
  }
  if (this.scroll && !this.close) {
    var close = document.createElement("img");
    close.src = "/media/system/images/index/popup-close.gif";
    close.width = 10;
    close.height = 10;
    close.alt = "[x]";
    close.className = "close";
    close.box = scrollBoxes.length;
    close.onclick = function() { scrollBoxes[this.box].box.style.display="none"; };
    this.scroll.appendChild(close);
  }
  c = this.overflow.childNodes;
  for (var i=0, l=c.length; i<l; i++) {
    if (!c[i].className) continue;
    c2 = c[i].className;
    if (c2.indexOf("content-box")>-1) {
      this.content = c[i];
      break;
    }
  }
  this.setCurPos();
  this.updatePos();
  this.checkScrollArea();
  this.setBulletFromContent();
  if (this.scrollArea.addEventListener) {
    this.scrollArea.addEventListener("click", scrollMouse, false)
    this.scrollArea.addEventListener("mousemove", scrollMouse, false)
    // this.scrollArea.addEventListener("mousedown", scrollMouse, false)
    this.scrollArea.onmousedown = function(evt) { scrollMouse(evt); return false; }
    this.scrollArea.addEventListener("mouseup", scrollMouse, false)
    this.scrollBullet.addEventListener("click", scrollMouse, false)
    this.scrollBullet.addEventListener("mousemove", scrollMouse, false)
    // this.scrollBullet.addEventListener("mousedown", scrollMouse, false)
    this.scrollBullet.onmousedown = function(evt) { scrollMouse(evt); return false; }
    this.scrollBullet.addEventListener("mouseup", scrollMouse, false)
    this.scrollArea.ondragdrop = function() { return false; };
    this.scrollBullet.ondragdrop = function() { return false; };
    if (Event && Event.DRAGDROP) {
      this.scrollArea.addEventListener("dragdrop", function() {return false;}, false);
      this.scrollBullet.addEventListener("dragdrop", function() {return false;}, false);
    }
    document.documentElement.addEventListener("mouseup", scrollsDragStop, false);
    document.documentElement.addEventListener("keypress", docKeyPress, false);
  } else {
    this.scrollArea.attachEvent("onclick", scrollMouse)
    this.scrollArea.attachEvent("onmousemove", scrollMouse)
    this.scrollArea.attachEvent("onmousedown", scrollMouse)
    this.scrollArea.attachEvent("onmouseup", scrollMouse)
    this.scrollArea.ondragstart = function() { return false; };
    this.scrollBullet.attachEvent("onclick", scrollMouse)
    this.scrollBullet.attachEvent("onmousemove", scrollMouse)
    this.scrollBullet.attachEvent("onmousedown", scrollMouse)
    this.scrollBullet.attachEvent("onmouseup", scrollMouse)
    this.scrollBullet.ondragstart = function() { return false; };
    document.getElementsByTagName("body")[0].attachEvent("onmouseup", scrollsDragStop);
    document.documentElement.attachEvent("onmouseup", scrollsDragStop);
    document.documentElement.attachEvent("onkeyup", docKeyPress);
  }
  for (var i=0, ancs=this.content.getElementsByTagName("a"), l=ancs.length; i<l; i++) {
    if (!ancs[i].getAttribute("href")) return;
    var h = ancs[i].getAttribute("href");
    if (h.indexOf("#")>-1) {
      h = h.substring(h.indexOf("#"));
      ancs[i].myHref = h;
      ancs[i].href = null;
      ancs[i].removeAttribute("href");
      ancs[i].onclick = checkHash;
    }
  }
}

scrollBox.prototype.setCurPos = function() {
  if (getStyle("display", this.scroll)=="none") this.hideScroll();
  this.curPos = {
    scrollHeight: this.content.scrollHeight,
    scrollTop: this.content.offsetTop,
    offsetHeight: this.overflow.offsetHeight,
    // bulletFrom: Math.round(this.scrollArea.offsetTop - this.scrollBullet.offsetHeight/2),
    bulletFrom: this.scrollArea.offsetTop,
    // bulletTo: Math.round(this.scrollArea.offsetHeight + this.scrollBullet.offsetHeight/2),
    bulletTo: Math.round(this.scrollArea.offsetHeight - this.scrollBullet.offsetHeight),
    scrollAreaTopOffset: getOffset(this.scrollArea.offsetParent)[1]
  };
  var c = this.curPos;
  c.relH = (c.scrollHeight - c.offsetHeight) / c.bulletTo;
  // c.relH = (c.scrollHeight - (c.offsetHeight + this.scrollBullet.offsetHeight/2)) / c.bulletTo;
  // c.bulletNow = this.scrollBullet.offsetTop - c.bulletFrom;
  c.bulletNow = this.scrollBullet.offsetTop;
  c = null;
  return this.curPos;
}

scrollBox.prototype.updatePos = function() {
  this.lastPos = this.curPos;
  this.curPos = this.setCurPos();
  return this.curPos;
}

scrollBox.prototype.checkScrollArea = function() {
  if (this.curPos.offsetHeight > this.curPos.scrollHeight) {
    this.hideScroll();
  } else {
    this.showScroll();
  }
}

scrollBox.prototype.hideScroll = function(display) {
  if (display) {
    this.scroll.style.display = "none";
    this.scroll.style.visibility = "hidden";
  } else {
    this.scroll.style.visibility = "hidden";
    this.scroll.style.display = "block";
  }
}

scrollBox.prototype.showScroll = function(display) {
  if (getStyle("display", this.scroll)=="none") this.scroll.style.display = "block";
  if (getStyle("visibility", this.scroll)=="hidden") this.scroll.style.visibility = "visible";
}

scrollBox.prototype.setBulletTop = function(newTop) {
  this.updatePos();
  /*if (newTop>this.curPos.bulletTo + (this.curPos.bulletFrom + this.scrollBullet.offsetHeight/2)) {
    this.scrollBullet.style.top = this.curPos.bulletTo +"px";
  } else {
  */
  // alert(newTop +": "+ this.curPos.bulletFrom +" - "+ this.curPos.bulletTo +" \n "+ this.scrollBullet.offsetHeight)
  // alert(newTop+', '+this.scrollBullet.offsetHeight/2 +', '+ this.curPos.bulletTo +'\n'+ (this.curPos.bulletTo+this.scrollBullet.offsetHeight/2 > newTop) );
  /*
  var toMax = (newTop-this.scrollBullet.offsetHeight/2) - this.curPos.bulletTo;
  if (toMax > 0) newTop = this.curPos.bulletTo - this.scrollBullet.offsetHeight/2;
  */
  if ((newTop-this.scrollBullet.offsetHeight/2) > this.curPos.bulletTo) {
    newTop = this.curPos.bulletTo;
    return;
  } 
  if (newTop < 0) return;
  this.scrollBullet.style.top = newTop+this.curPos.bulletFrom +"px";
  this.updatePos();
}

scrollBox.prototype.setBulletFromContent = function() {
  this.updatePos();
  this.scrollBullet.style.top = (this.curPos.bulletFrom + Math.abs(this.curPos.scrollTop) / this.curPos.relH) +"px";
  this.updatePos();
}

scrollBox.prototype.setContentFromBullet = function() {
  this.updatePos();
  var newH = (this.curPos.bulletNow - this.curPos.bulletFrom) * this.curPos.relH *-1;
  if ( this.curPos.scrollHeight - this.curPos.offsetHeight*1.2 < newH ) newH = this.curPos.scrollHeight;
  this.content.style.top = newH +"px";
  // this.content.style.top = ((this.curPos.bulletNow) - this.curPos.bulletFrom) * this.curPos.relH *-1 +"px";
  this.updatePos();
}

function docKeyPress(evt) {
  var evt = window.event || evt;
  var el = evt.target || evt.srcElement;
  var curBox = scrollBoxes[0];
  if (getStyle("display", curBox.box)!="block") return;
  curBox.updatePos();
  switch(evt.keyCode) {
    case 33:
      if (Math.abs(curBox.curPos.scrollTop) < curBox.curPos.offsetHeight) {
        curBox.content.style.top = "0px";
      } else {
        curBox.content.style.top = curBox.curPos.scrollTop + curBox.curPos.offsetHeight +"px";
      }
    break;
    case 34:
      if (Math.abs(curBox.curPos.scrollTop) + curBox.curPos.offsetHeight*2 >= curBox.curPos.scrollHeight-100) {
        curBox.content.style.top = (curBox.curPos.scrollHeight - curBox.curPos.offsetHeight + 30) *-1 + "px";
      } else {
        curBox.content.style.top = curBox.curPos.scrollTop - curBox.curPos.offsetHeight +"px";
      }
    break;
  }
  curBox.setBulletFromContent();
}

function scrollsDragStop() {
  for (var i=0, l=scrollBoxes.length; i<l; i++) scrollBoxes[i].ddNow = false;
}

function checkHash() {
  // if (ie) return;
  // var hash = window.location.hash.substring(1);
  if (!this.getAttribute) return;
  // hash = this.getAttribute("myHref");
  hash = this.myHref;
  if (!hash) return;
  hash = hash.substring(1);
  var el = document.getElementById(hash);
  if (!el) return;
  while( !el.className || (el.className && el.className.indexOf("content-box")==-1) ) el = el.parentNode;
  for (var i=0, l=scrollBoxes.length; i<l; i++) if (scrollBoxes[i].content==el) break;
  var curBox = scrollBoxes[i];
  curBox.overflow.scrollTop = 0;
  var el = document.getElementById(hash), toEl = curBox.content.offsetParent;
  var y=0;
  // alert();
  y = el.offsetTop //+ curBox.curPos.offsetHeight
  // if (ie) y += curBox.curPos.offsetHeight + this.offsetTop;
  if (ie) y -= curBox.curPos.scrollTop; 
  // if (ie) y -= el.offsetParent.offsetTop + curBox.curPos.offsetHeight; 
  /*
  while(el!=toEl) {
    y += el.offsetTop;
    el = el.offsetParent;
  }
  // y -= curBox.content.offsetTop;
  alert(y)
  */
  curBox.content.style.top = -1* y +"px";
  curBox.setBulletFromContent();
  // alert(curBox.overflow.scrollTop +', '+ curBox.content.scrollTop +'\n'+ y)
  /*
  curBox.overflow.scrollTop = 0;
  curBox.content.scrollTop = 0;
  if (ie) {
    curBox.setBulletTop(0);
    curBox.setContentFromBullet();
  }
  curBox.content.style.top = -1* y +"px";
  curBox.setBulletFromContent();
  */
}

function scrollMouse(evt) {
  var evt = window.event || evt;
  var el = evt.target || evt.srcElement;
  var type = evt.type;
  var cl = el.className;
  var elType;
  if (!scrollBoxes) return
  if (cl.indexOf("bg")>-1) elType = "scrollArea";
  else if (cl.indexOf("bullet")>-1) elType = "scrollBullet";
  var curBox;
  for (var i=0, l=scrollBoxes.length; i<l; i++) {
    if (scrollBoxes[i][elType]==el) {
      curBox = scrollBoxes[i];
      break;
    }
  }
  if (!curBox) return;
  if (type=="mousedown" || type.indexOf("drag")>-1) {
    curBox.setBulletTop( evt.clientY - (curBox.curPos.scrollAreaTopOffset+curBox.curPos.bulletFrom) + getYScroll() );
    curBox.setContentFromBullet();
    curBox.ddNow = true;
    return false;
  }
  if (type=="mouseup") {
    curBox.ddNow = false;
    // alert("up")
  }
  if ( type=="click" || (type=="mousemove" && curBox.ddNow) ) {
    curBox.setBulletTop( evt.clientY - (curBox.curPos.scrollAreaTopOffset+curBox.curPos.bulletFrom) + getYScroll() );
    curBox.setContentFromBullet();
  }
  evt.cancelBubble = true;
  if (evt.stopPropagation) evt.stopPropagation();
  // curBox.evt = evt;
  a=1;
}

function HTMLready() {
  document.getElementById("rules").onclick = function() {
    box = document.getElementById("popup");
    box.style.display = "block";
    if (box) scrollBoxes.push(new scrollBox(box));
    checkHash();
  }
  if (flash) {
    window.onload = function() {
      var extra = "height=700,width=1000,resizable=0,scrollbars=0,toolbar=0,status=0";
      extra += ",left="+ Math.round(screen.width/2 - 1000/2);
      extra += ",top="+ Math.round(screen.height/2 - 700/2);
    	var newwindow=window.open('/index_flash.wbp','name',extra);
    	if (newwindow && window.focus) {newwindow.focus()}
    	return false;
    }
  }
  document.getElementById("popup-open").onclick = function() {
    var extra = "height=700,width=1000,resizable=0,scrollbars=0,toolbar=0,status=0";
    extra += ",left="+ Math.round(screen.width/2 - 1000/2);
    extra += ",top="+ Math.round(screen.height/2 - 700/2);
  	var newwindow=window.open('/index_flash.wbp','name',extra);
  	if (newwindow && window.focus) {newwindow.focus()}
  	return false;
  }
}

if (navigator.userAgent.indexOf('Safari')>-1) {
  var _timer = setInterval(function() {
    if (/loaded|complete/.test(document.readyState)) {
      clearInterval(_timer);
      delete _timer;
      HTMLready(); 
    }
  }, 10);
} else {
  if (window.addEventListener) {
    // window.addEventListener('load', ready, false);
    window.addEventListener('DOMContentLoaded', HTMLready, false);
  } else {
    void HTMLready();
  } 
}