/* ============================================================
cau1_global_nav.js
 javascript for cau1 global navigations
  created: 2009-06-18
  modified:
  $Date:: 2009-06-24 13:02:51#$
  $Author: nakamurak $
  $Revision: 88860 $
============================================================ */


(function() {
  var SiteArea = function(target) { //class
    this.targetObj = target;
    var idPrefix = target.id;
    this.buttonObj = document.getElementById(idPrefix + "Button");
    this.listObj = document.getElementById(idPrefix + "List");
    this._initialize();
  };
  SiteArea.prototype = { //methods
    _initialize: function() {
      var self = this;
      this.isIE6 = navigator.userAgent.toLowerCase().indexOf("msie 6") != -1;
      this.swapImg = this.buttonObj.getElementsByTagName("img")[0];
      this._set_swap();
      // alt/title popup for swapImg not needed.
      this.namePrefix = this.swapImg.getAttribute("alt");
      this.swapImg.setAttribute("alt","");
      this.swapImg.setAttribute("title","");

      //event handlers
      this.showHandler = function(e) {self._show(e)};
      this.hideHandler = function(e) {self._hide(e)};
      this.setEvent(this.targetObj, "mouseenter", this.showHandler);
      this.setEvent(this.targetObj, "mouseleave", this.hideHandler);
      this._set_scCustomClick();
      this._setPosition();
    },
    _show: function(e) {
      this.listObj.style.visibility = "visible";
      this._setPosition();
      if (this.isIE6) this._showShimForIE6();
      this._swap_on();
    },
    _hide: function(e) {
      this.listObj.style.visibility = "hidden";
      if (this.isIE6) this._hideShimForIE6();
      this._swap_off();
    },
    _setPosition: function() {
      //assuming listObj is positioned left.
      var listRight = this.targetObj.offsetLeft + this.listObj.offsetWidth
      var windowSize = document.documentElement.clientWidth || document.body.clientWidth;
      if (listRight > windowSize) {
        //listObj too big, move to right positioned.
        this.listObj.style.left = "auto";
        this.listObj.style.right = "0px";
        this.listObj.style.backgroundPosition = "90% 0";
      } else {
        this.listObj.style.right = "auto";
        if (this.listObj.style.left) this.listObj.style.left = "";
        if (this.listObj.style.backgroundPosition) this.listObj.style.backgroundPosition = "";
      }
    },
    _set_scCustomClick: function() {
      var self = this;
      var as = this.targetObj.getElementsByTagName("a");
      var handler = function(a) {
        return function() {self._scCustomClick(a)};
      }
      for (var i=0,len=as.length; i<len; i++) {
        this.setEvent(as[i], "click", handler(as[i]));
      };
    },
    _scCustomClick: function(a) {
      if (window.s_account) {
        var valuePrefix = "グローバルナビ: " + this.namePrefix;
        var value = this.isInsideTarget(this.buttonObj, a)? valuePrefix: valuePrefix + ": " + a.firstChild.nodeValue;
        var isOuterLink = a.search.match(/cid=/);
        var s_account = window.s_account;
        var targetEvar;
        if (s_account.match(/^c1depart|^c1mall/))
          targetEvar = isOuterLink? "eVar39" : "eVar42";
        else if (s_account.match(/^c1books|^cau1recycle/))
          targetEvar = isOuterLink? "eVar20" : "eVar19";
        else
          return true; // don't submit this, but other events should be executed.
        var s = s_gi(s_account);
        s.linkTrackVars = targetEvar;
        s[targetEvar] = value;
        s.tl(a, 'o', 'グローバルナビ');
      }
    },
    _set_swap: function() {
      // image swap of buttonObj
      this.swapImgSrcOriginal = this.swapImg.src;
      var dot = this.swapImgSrcOriginal.lastIndexOf('.');
      this.swapImgSrcHover = this.swapImgSrcOriginal.substr(0, dot) + '_on' + this.swapImgSrcOriginal.substr(dot);
      //preload
      var imgCache = new Image();
      imgCache.src = this.swapImgSrcHover;
    },
    _swap_on: function() {this.swapImg.src = this.swapImgSrcHover;},
    _swap_off: function() {this.swapImg.src = this.swapImgSrcOriginal;},
    _createShimForIE6: function() {
      //shim iframe for IE6
      this.iframeShimForIE6 = document.createElement('iframe');
      this.iframeShimForIE6.src = "javascript:false;";
      this.iframeShimForIE6.setAttribute('frameBorder','0');
      this.iframeShimForIE6.style.position = "absolute";
      this.iframeShimForIE6.style.margin = "0";
      this.iframeShimForIE6.style.padding = "0";
      this.iframeShimForIE6.style.zIndex = this.listObj.style.zIndex - 1;
      this.iframeShimForIE6.style.filter = "alpha(opacity = 0)";
      this.targetObj.appendChild(this.iframeShimForIE6);
    },
    _showShimForIE6: function() {
      //create one if there isn't
      if (!this.iframeShimForIE6) this._createShimForIE6();
      for (var props = ["offsetWidth","offsetHeight","offsetLeft","offsetTop"], i=0, len=props.length; i<len; i++) {
        this.iframeShimForIE6.style[props[i].replace(/^offset/,"").toLowerCase()] = this.listObj[props[i]] + "px";
      }
      this.iframeShimForIE6.style.display = "block";
    },
    _hideShimForIE6: function() {
      this.iframeShimForIE6.style.display = "none";
    },
    //1. normalize event handling
    //2. simulate mouseenter/mouseleave eventlisteners to unsupported browsers.
    setEvent: function(elem, type, handle) {
      var self = this;
      if (this.targetObj.addEventListener) {//w3c dom
        if (type == "mouseenter") {
          this.setEvent(elem, "mouseover", function(e) {
            if (!self.isInsideTarget(elem, e.relatedTarget)) handle(e);
          });
        } else if (type == "mouseleave") {
          this.setEvent(elem, "mouseout", function(e) {
            if (!self.isInsideTarget(elem, e.relatedTarget)) handle(e);
          });
        } else {
          elem.addEventListener(type, handle, false);
        }
      } else //ie, already have mouseenter/mouseleave
        elem.attachEvent("on" + type, handle);
    },
    isInsideTarget: function(target, elem) {
      while (elem) {
        if (elem == target) return true;
        elem = elem.parentNode;
      }
      return false;
    }
  };

  // execute
  var targetArea = document.getElementById("cau1GlobalNavWrap");
  var sites = targetArea.childNodes;
  for (var i=0,len=sites.length; i<len; i++) {
    if (sites[i].nodeName.toLowerCase() == "div" && sites[i].className.match(/cau1GlobalNavSites/))
      new SiteArea(sites[i]);
  };
})()