// Popup.js
var Popup = {
  Dropdown: function(name, target, hide, state) {
    var obj = document.getElementById(name) || Popup.Create(name);
    var target = document.getElementById(target);

    if (state) {
      Popup.show(obj,target);
    } else if (state == false) {
      Popup.hide(obj,target);    
    } else if (target) {
      if (Popup.Toggle(target, hide)) {
        styleClick(obj,target);
        Popup.PositionDropdown(obj,target);
      } else {
        styleClick(obj,target);
      }
    }
  },
  
  AutoComplete: function(name, parent, response, show) {
    var obj = document.getElementById(name) || Popup.Create(name);
    var parent = document.getElementById(parent);
    
    //Popup.addEvent(document,"click",function(e){Popup.CheckMouseTarget(e,name);});  
    document.onclick = function(e){Popup.CheckMouseTarget(e,name);};

    if (show == 'false') obj.style.display = 'none'
    else {
      Popup.PositionAutoComplete(obj,parent);
      obj.style.display = 'block';
      obj.innerHTML = response;
    }
  },
  
  Create: function(name) {   
    var obj = document.createElement('div');
    obj.setAttribute("id",name);
    obj.style.display = 'none';
    document.body.appendChild(obj);
    
    return obj;
  },
  
  Delete: function(name) {
      var deleteThis = document.getElementById(name) || 0;
      if (deleteThis) document.body.removeChild(deleteThis);
  },
  
  Toggle: function(obj, hide) {  
    if (obj.style.display != 'none') {
      Popup.HideAll(obj,hide);
      obj.style.display = 'none';
      return false;
    } else {
      Popup.HideAll(obj,hide);
      obj.style.display = 'block';
      return true;
    }
  },
  
  show: function(obj, target) {
    obj = document.getElementById(obj) || obj;
    target = document.getElementById(target) || target;
    
    obj.className = "pseudoLink boxOn";
    target.style.display = 'block';
    Popup.PositionDropdown(obj,target);
  },
  
  hide: function(obj, target) {
    obj = document.getElementById(obj) || obj;
    target = document.getElementById(target) || target;
    
    obj.className = "pseudoLink cart";
    target.style.display = 'none';
    Popup.Delete(obj.id + "-hide-me");
  },
  
  HideAll: function(obj,hide) {
      // Hides all other divs... TODO clean this code.
      if (hide) {
        var byClass = document.getElementsByClassName(obj.className);
    
        for (i=0;i<byClass.length;i++) {
            document.getElementById("link" + byClass[i].id).className = "pseudoLink";
            Popup.Delete("link" + byClass[i].id + "-hide-me");
            byClass[i].style.display = 'none';
        }
      }
  },
  
  PositionDropdown: function(obj,target) {
    var position = Popup.findPos(obj);
    var offset = [obj.offsetWidth, obj.offsetHeight];
    
    var style = 'position: absolute;';
    style += 'right: ' + (document.documentElement.clientWidth - position[0] - offset[0]) + 'px;';
    style += 'top: ' + (position[1] + offset[1]) + 'px;';
    
    if (document.documentElement.clientWidth < 991) {
      style += 'right: ' + (991 - position[0] - offset[0]) + 'px;';
    }
  
    // set styles
    target.setAttribute("style",style);
    target.style.cssText = style;
    
    //create and place hidden bar
    var hiddenBar = document.getElementById(obj.id + "-hide-me") || Popup.Create(obj.id + "-hide-me");
    
    style = 'position: absolute;';
    style += 'left: ' + (position[0]) + 'px;';
    style += 'top: ' + (position[1] + offset[1]) + 'px;';
    style += 'z-index: 15;';
    style += 'width: ' + (obj.offsetWidth - 1) + 'px;';
    style += 'border-top: #fffbd2 1px solid;';

    hiddenBar.setAttribute("style",style);
    hiddenBar.style.cssText = style;
    
    Popup.ScrollTo(obj, target)
  },
  
  PositionAutoComplete: function(obj,parent) {
    var position = Popup.findPos(parent);
    var offset = [parent.offsetWidth, parent.offsetHeight];
    
    var style = 'position: absolute;';
    style += 'left: ' + position[0] + 'px;';
    style += 'top: ' + (position[1] + offset[1]) + 'px;';
    style += 'width: ' + (offset[0] - 2) + 'px;';
    style += 'max-height: 250px; overflow:auto; background:white;border:1px solid #c8ccce;';
    
    // for ie6 max-height
    if (document.documentElement && typeof document.documentElement.style.maxHeight=="undefined") style += 'height: 175px;';
    
    // set styles
    obj.setAttribute("style",style);
    obj.style.cssText = style;
  },
  
  ScrollTo: function(obj,target) {
    // Scrolls down to make sure popup fits window. TODO clean this code
    var offset = getScrollXY();
    var windowSize = getWindowSize();
    var popBottom = Popup.findPos(target)[1] + target.offsetHeight;
    
    if ((offset[1] + windowSize[1]) < popBottom) {
        window.scrollBy(0,popBottom-(offset[1] + windowSize[1])+ 10);
    }
  },
  
  CheckMouseTarget: function(e, name) {
    e = e || window.event;
    target = e.target || e.srcElement;
    var hide = true;
    
    do {
      if (target.id == name) hide = false;
    } while(target = target.parentNode);
    
    if (hide) document.getElementById(name).style.display = 'none';
  },

  addEvent: function ( obj, type, fn ) {
    if (obj.addEventListener)
      obj.addEventListener( type, fn, false );
    else if (obj.attachEvent) {
      obj["e"+type+fn] = fn;
      obj[type+fn] = function() { obj["e"+type+fn]( window.event ); }
      obj.attachEvent( "on"+type, obj[type+fn] );
    }
  },

  findPos: function(obj) {
    var curleft = 0;
    var curtop = 0;
    
    if (obj.offsetParent) {
      do {
        curleft += obj.offsetLeft;
        curtop += obj.offsetTop;
      } while (obj = obj.offsetParent); /* this line is correct, this will return false when obj.offsetParent == 'HTML' */
      
      return [curleft, curtop];
    }
  }
}

function styleClick(obj, target) {
  if (target.style.display != 'none') obj.className = "pseudoLink boxOn";
  else obj.className = "pseudoLink";
}




// Special Pricing Popup
function togglePD(sku, target) {
  var obj = document.getElementById("pd" + sku);
  
  var offset = [target.offsetWidth, target.offsetHeight]
  var header = document.getElementById("header").offsetHeight;
  var windowSize = getWindowSize();
  var targetPos = findPos(target);
  
  if (obj) {
    if (obj.style.display == "none") {
      var byClass = document.getElementsByClassName(obj.className);
      for (i=0;i<byClass.length;i++) { // hide all popups with the same class
        byClass[i].style.display = 'none';
      }
    
      obj.style.display = "";
      obj.style.top = (targetPos[1] + offset[1] - header) + "px";
      obj.style.right = (windowSize[0] - targetPos[0] - offset[0] - 18) + "px";
    } else {
      obj.style.display = "none";
    }
  }
}