var HelpToggler = Class.create();

HelpToggler.prototype =
{
  initialize: function(el, url, options)
  {
    this.el = $(el);
  	this.onBtnEl = el.down();
  	this.offBtnEl = el.down().next();
  	this.helpState = null;
  	this.helpLoaded = false;
  	this.url = null;

    this.options = $H({
      dialog: false
    }).merge(options);


	  if (document.all)
	  {
	    this.hideIeFocusRectangle(onBtnEl);
	    this.hideIeFocusRectangle(offBtnEl);
	  }

	  this.url = onBtnEl.readAttribute("href");
	  this.onBtnEl.setAttribute("href", "javascript:Prototype.emptyFunction()");
	  this.offBtnEl.setAttribute("href", "javascript:Prototype.emptyFunction()");

	  Event.observe(this.onBtnEl, "click", this.helpButtonClick.bind(this));
	  Event.observe(this.offBtnEl, "click", this.helpButtonClick.bind(this));

	  toggleHelpButton(false, false);
  },
  helpButtonClick: function(evt)
  {
		var buttonEl = Event.findElement(evt, "a");
		this.toggleHelpButton(this.onBtnEl == buttonEl, true);
		Event.stop(evt);
  },
	hideIeFocusRectangle: function (el)
	{
	  el.hideFocus = "true";
	},
	toggleHelpButton: function (turnOn, resize)
	{
	  var btn = turnOn ? this.onBtnEl : this.offBtnEl;
	  var helpState = btn.up().readAttribute("helpState");

	  //TODO: make the checking of helpState more robust.
	  if (resize && ((turnOn && helpState) || (!turnOn && !helpState)))
	    return;

	  this.helpState = turnOn;

	  var onImgEl = this.onBtnEl.down("img");
	  var offImgEl = this.offBtnEl.down("img");

	  var contentWrapperEl = btn.up().next();
	  var contentEl, helpContentEl;
	  var  onStr = "" , offStr = "", helpContentStr, contentStr = null, tblStr = null;
	  var contentWidth, tbl, tblWidth;
	  var helpWidth = 260, maxWidth = 750;
	  var otherTables = false;

	  contentEl = contentWrapperEl.down();
	  helpContentEl = contentEl.next();
	  tbl = contentEl.up("table");

	  if (turnOn)
	  {
	    if (!this.helpLoaded)
	    {
	      this.helpLoaded = true;
	      new Ajax.Request(this.url, {
	          method: 'get',
	          onFailure: function(transport)
	          {
	            alert("failed"); // TODO: do something.
	          },
	          onSuccess: this.onHelpLoaded.bind(this)
	      });
	    }

	    onStr = "Selected";
	    offStr = "Normal";
	    helpContentStr = "block";
	    tblWidth = tbl.getWidth();

	    if (!btn.readAttribute("dialog"))
	    {
	      // We're in a full web page.
	      // All we have to do is resize the content column.
	      contentWidth = contentEl.getWidth();
	      contentEl.setAttribute("savewidth", contentWidth);
	      contentStr = (contentWidth - helpWidth - 20) + "px";
	    }
	    else
	    {
	      // We're in a dialog.
	      // We have to increaes the size of the table.
	      tbl.setAttribute("savewidth", tblWidth);
	      tblStr = (tblWidth + helpWidth + 20) + "px";

	      contentWidth = contentEl.getWidth();
	      contentEl.setAttribute("savewidth", contentWidth);
	      contentStr = (contentWidth) + "px";
	      otherTables = true;
	    }

	  }
	  else
	  {
	    onStr = "Normal";
	    offStr = "Selected";
	    helpContentStr = "none";

	    if (resize)
	    {
	      if (!btn.readAttribute("dialog"))
	      {
	        // We're in a full web page.
	        // All we have to do is resize the content column.
	        contentWidth = parseInt(contentEl.readAttribute("savewidth"));
	        contentStr = contentWidth + "px";
	      }
	      else
	      {
	        // We're in a dialog.
	        // We have to increaes the size of the table and set the content col width.
	        tblWidth = parseInt(tbl.readAttribute("savewidth"));
	        tblStr = tblWidth + "px";
	        otherTables = true;
	      }
	    }

	  }

	  onImgEl.src = "/cache/cp/1201819920000/coupon/static/images/laf/help" + onStr + ".gif";
	  offImgEl.src = "/cache/cp/1201819920000/coupon/static/images/laf/help" + offStr + ".gif";

	  if (resize)
	  {
	    helpContentEl.setStyle({display: helpContentStr});

	    if (contentStr != null)
	      contentEl.setStyle({width: contentStr});

	    if (tblStr != null)
	    {
	      tbl.setStyle({width: tblStr});
	      if (otherTables)
	      {
	        tbl.previous().setStyle({width: tblStr});

	        if (document.all)
	          tbl.previous().previous().setStyle({width: tblStr});
	      }
	    }

			//TODO: need to integrate this better.
	    if (_openDialogIds && _openDialogIds.length > 0)
	      Control.Modal.center();
	  }
	},
	onHelpLoaded: function(transport)
	{
		helpContentEl.down().next().update(transport.responseText);

		//TODO: need to integrate this better.
    if (_openDialogIds && _openDialogIds.length > 0)
      Control.Modal.center();
	}
}