//  Simply Buttons, version 2.0
//  (c) 2007-2009 Kevin Miller
//
//  This script is freely distributable under the terms of an MIT-style license.
// 
/*-----------------------------------------------------------------------------------------------*/
// 
// * Adjusts the buttons so that they will not have an outline when they are pressed.
// * If the browser is mobile then we replace the buttons with inputs for compatibility.
// * Disables the text in the buttons from being selected.
// * The default styles here are meant for use with the Sliding Doors technique http://alistapart.com/articles/slidingdoors/
//     to be used for IE so we can have nice states with a horrid browser too!
//
/*-----------------------------------------------------------------------------------------------*/

var SimplyButtons = {

    options: {
        hyperlinkClass: 'button'
    , activeButtonClass: 'button_active'
    , states: {
        outer: {
            active: {
                backgroundPosition: 'bottom left'
            }
        , inactive: {
            backgroundPosition: 'top left'
        }
        }
      , inner: {
          active: {
              backgroundPosition: 'bottom right'
          }
        , inactive: {
            backgroundPosition: 'top right'
        }
      }
    }
    , iphone: {
        replaceButtons: true
    }
    }

  , buttons: []

  , iphone: false

  , init: function(options) {
      for (var property in options) {
          this.options[property] = options[property];
      }

      this.iphone = (navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i));

      this.process(document.getElementsByTagName('button'), false);
      this.process(document.getElementsByTagName('a'), true);

      if (this.iphone && this.options.iphone.replaceButtons) {
          this.remove();
      }
  }

  , process: function(elements, links) {
      var linkTest = new RegExp('\\b' + this.options.hyperlinkClass + '\\b');
      for (var a = 0; a < elements.length; a++) {
          if ((links && linkTest.test(elements[a].className)) || !links) {
              if (this.iphone && !links) {
                  this.mobile(elements[a]);
              }
              else {
                  this.disable(elements[a]);
                  this.setup(elements[a]);
              }

              if (!links) {
                  this.buttons.push(elements[a]);
              }
          }
      }
  }

  , mobile: function(element) {
      var input = document.createElement('input');
      input.setAttribute('type', element.getAttribute('type') == 'submit' ? 'submit' : 'button');

      var attributes = new Array('id', 'name', 'value', 'class', 'onclick', 'onmouseover', 'onmouseout', 'onpress', 'onfocus', 'onblur', 'onmouseup', 'onmousedown');
      for (var a = 0; a < attributes.length; a++) {
          if (element.getAttribute(attributes[a])) {
              input.setAttribute(attributes[a], element.getAttribute(attributes[a]));
          }
      }

      input.style.marginLeft = element.style.marginLeft;
      input.style.marginRight = element.style.marginRight;

      element.parentNode.insertBefore(input, element);

  }

	, remove: function() {
	    for (var a = 0; a < this.buttons.length; a++) {
	        this.buttons[a].parentNode.removeChild(this.buttons[a]);
	    }
	}

  , disable: function(element) {
      element.onselectstart = function() { return false; };
      element.style.MozUserSelect = 'none';
      element.style.KhtmlUserSelect = 'none';
      element.style.UserSelect = 'none';
      //element.style.cursor = 'default';
  }

  , setup: function(element) {
      if (document.all) {
          if (element.tagName == 'BUTTON') {
              element.attachEvent('onfocus', this.bind(this.toggle, this, element));
          }
          else {
              element.attachEvent('onmousedown', this.bind(this.toggle, this, element));
          }
          element.attachEvent('onmouseup', this.bind(this.toggle, this, element));
      }
      else {
          element.onfocus = function() { this.blur(); };
      }
  }

  , toggle: function(o, element) {
      if (element.tagName != 'BUTTON' && element.tagName != 'A') {
          while (element.tagName != 'A') {
              element = element.parentNode;
          }
      }
      if (event.type == 'focus' || event.type == 'mousedown') {
          element.className += ' ' + o.options.activeButtonClass;
          o.style(element.childNodes[0], o.options.states.inner.active);
          o.style(element.childNodes[0].childNodes[0], o.options.states.outer.active);
          element.blur();
      }
      else {
          element.className = element.className.replace(o.options.activeButtonClass, '');
          o.style(element.childNodes[0], o.options.states.inner.inactive);
          o.style(element.childNodes[0].childNodes[0], o.options.states.outer.inactive);
      }
  }

  , style: function(element, styles) {
      for (var property in styles) {
          element.style[property] = styles[property];
      }
  }

  , bind: function(func) {
      var args = [];
      for (var a = 1; a < arguments.length; a++) {
          args.push(arguments[a]);
      }
      return function() { return func.apply(this, args); };
  }

};