var updateNode;
var container;
var closeNode;
var popupSpeed = 500;
var activePopup = '';

$(document).ready(
  function(){
    InitStoreItemClickEvents();
    
    if($('#storeDirectoryContent').length > 0) {
      $('#storeDirectoryContent').jScrollPane();
    }
  }
);

// Attach click events on all store Items
function InitStoreItemClickEvents(){

  updateNode = $('div#popupMain');
  container = $('div.storePopUp');
  closeNode = $('a.closeStorePopUp');

  $('a.storeItem').each(function(i){
    $(this).click(function(){
      if(this.rel != activePopup){
              
        UpdatePopup(this.id, CalculateOffset($(this)), 'storeid');
        
        if(this.rel != ""){
          var temp = this.rel.split(',');
          $(temp).each(function(){
            setAction(this, 'activate_on');
          });
        } else {
          setAction(activePopup, 'activate_off');
        }
      }
      activePopup = this.rel;
      return false;
    });

    if(this.rel != ""){
      $(this).mouseover(function(){
        var temp = this.rel.split(',');
        $(temp).each(function(){
          setAction(this, 'hover_on');
        });
      });

      $(this).mouseout(function(){
        var temp = this.rel.split(',');
        $(temp).each(function(){
          setAction(this, 'hover_off');
        });
      });
    }
  });

  closeNode.click(function(){
    ToggleStorePopup(false);
    setAction(activePopup, 'activate_off');
    activePopup = null;
  });

  return false;
}

function ToggleStorePopup(action){
  //container.stop().slideToggle(popupSpeed);
  if(action){
    popupOn = true;
    container.show();
  } else {
    popupOn = false;
    container.hide();
  }

  return false;
}

function CalculateOffset(storeItem){
  var pageContainer = $("div#pageContainer");
  if((storeItem.offset().top + container.height()) > pageContainer.height()){
    return storeItem.offset().top - container.height();
  } else{
    return storeItem.offset().top;
  }
}

function UpdatePopup(storeId, top, type){
  
  ToggleStorePopup(false);
      
  container.css("top", top);
  
  var url = window.location.href
  var splitResult = url.split("?");
  url = splitResult[0];
  var id = "";
  
  var re = new RegExp(/id=(\d+)/);
  var m = re.exec(window.location.href);
  
  if (m != null) {
    id = m[0] + '&';
  }

  var url = url + '?' + id + 'ajaxrequest=true' + '&' + type + '=' + storeId;
  jQuery.ajax({
    type: 'GET',
    url: url,
    success: function(html){
      updateNode.html(html);
      ToggleStorePopup(true);
    }
  });
  return false;
}

function callAction(xmlData){
  var on = (xmlData.indexOf("activate_on") > -1);
  var off = (xmlData.indexOf("activate_off") > -1);

  if(on || off){
    var temp = $(parseXML(xmlData)).find('action')[0];
    if(temp){
      if(on){
        var id= temp.attributes.getNamedItem('id').value;
        activePopup = id;
        UpdatePopup(id, 300, 'storeguid');
      } else if(off){
        ToggleStorePopup(false);
      }
    }
  }
}

function parseXML(xml){
  if(window.ActiveXObject && window.GetObject){
    var dom = new ActiveXObject( 'Microsoft.XMLDOM' );
    dom.loadXML( xml );
    return dom;
  }

  if(window.DOMParser){
    return new DOMParser().parseFromString( xml, 'text/xml' );
  }

  return xml;
}

function setAction(storeId, actionName){
  var updateNode = document.getElementById('storeDirectory');

  if(updateNode){
    xmlData = '<?xml version="1.0" encoding="utf-8"?><actions><action id="' + storeId + '" type="' + actionName + '" /></actions>';
    try {
    updateNode.setAction(xmlData);
    } catch (ex) {}
  }
}