//  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' || 'smallbutton'), 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); };
	}
};