ruote-kit 2.1.4

data/lib/ruote-kit/public/_ruote/javascripts/SimplyButtons.js

@@ -0,0 +1,191 @@
+//  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); };
+  }
+
+};