Permalink
Browse files

- tagging 1.2 beta 1

git-svn-id: http://svn.mootools.net/tags/1-2b1@1218 4db308c1-fb21-0410-9919-de62e267375e
  • Loading branch information...
0 parents commit 01f34aa49c73a3c011e5a8264e0779d44e83df79 kamicane committed Nov 13, 2007
Showing with 18,270 additions and 0 deletions.
  1. +1 −0 Compatibility/Class/Class.js
  2. +8 −0 Compatibility/Core/Browser.js
  3. +18 −0 Compatibility/Core/Core.js
  4. +1 −0 Compatibility/Drag/Drag.js
  5. +1 −0 Compatibility/Element/Element.Event.js
  6. +7 −0 Compatibility/Element/Element.Style.js
  7. +55 −0 Compatibility/Element/Element.js
  8. +1 −0 Compatibility/Fx/Fx.Morph.js
  9. +7 −0 Compatibility/Fx/Fx.Scroll.js
  10. +1 −0 Compatibility/Fx/Fx.Tween.js
  11. +13 −0 Compatibility/Fx/Fx.js
  12. +7 −0 Compatibility/Native/Array.js
  13. +9 −0 Compatibility/Native/Function.js
  14. +2 −0 Compatibility/Native/Hash.js
  15. +25 −0 Compatibility/Request/Request.JSON.js
  16. +34 −0 Compatibility/Request/Request.js
  17. +39 −0 Compatibility/Selectors/Selectors.js
  18. +55 −0 Compatibility/Utilities/Dimensions.js
  19. +4 −0 Compatibility/Utilities/JSON.js
  20. +377 −0 Docs/Class/Class.Extras.md
  21. +135 −0 Docs/Class/Class.md
  22. +46 −0 Docs/Core/Browser.md
  23. +557 −0 Docs/Core/Core.md
  24. +160 −0 Docs/Drag/Drag.Move.md
  25. +199 −0 Docs/Drag/Drag.md
  26. +474 −0 Docs/Element/Element.Event.md
  27. +129 −0 Docs/Element/Element.Style.md
  28. +1,544 −0 Docs/Element/Element.md
  29. +5 −0 Docs/Fx/Fx.CSS.md
  30. +195 −0 Docs/Fx/Fx.Morph.md
  31. +214 −0 Docs/Fx/Fx.Scroll.md
  32. +249 −0 Docs/Fx/Fx.Slide.md
  33. +189 −0 Docs/Fx/Fx.Transitions.md
  34. +240 −0 Docs/Fx/Fx.Tween.md
  35. +163 −0 Docs/Fx/Fx.md
  36. +489 −0 Docs/Native/Array.md
  37. +291 −0 Docs/Native/Function.md
  38. +520 −0 Docs/Native/Hash.md
  39. +129 −0 Docs/Native/Number.md
  40. +372 −0 Docs/Native/String.md
  41. +137 −0 Docs/Plugins/Accordion.md
  42. +131 −0 Docs/Plugins/Assets.md
  43. +108 −0 Docs/Plugins/Fx.Elements.md
  44. +109 −0 Docs/Plugins/Hash.Cookie.md
  45. +86 −0 Docs/Plugins/Scroller.md
  46. +114 −0 Docs/Plugins/Selectors.Children.md
  47. +124 −0 Docs/Plugins/Slider.md
  48. +43 −0 Docs/Plugins/SmoothScroll.md
  49. +84 −0 Docs/Plugins/Sortables.md
  50. +87 −0 Docs/Plugins/Tips.md
  51. +166 −0 Docs/Request/Request.HTML.md
  52. +49 −0 Docs/Request/Request.JSON.md
  53. +275 −0 Docs/Request/Request.md
  54. +162 −0 Docs/Selectors/Selectors.Pseudo.md
  55. +112 −0 Docs/Selectors/Selectors.md
  56. +249 −0 Docs/Utilities/Color.md
  57. +104 −0 Docs/Utilities/Cookie.md
  58. +210 −0 Docs/Utilities/Dimensions.md
  59. +68 −0 Docs/Utilities/Group.md
  60. +55 −0 Docs/Utilities/JSON.md
  61. +104 −0 Docs/Utilities/Swiff.md
  62. +134 −0 Docs/assets/docs.js
  63. BIN Docs/assets/images/Back.png
  64. BIN Docs/assets/images/Bounce.png
  65. BIN Docs/assets/images/Circ.png
  66. BIN Docs/assets/images/Cubic.png
  67. BIN Docs/assets/images/Elastic.png
  68. BIN Docs/assets/images/Expo.png
  69. BIN Docs/assets/images/Linear.png
  70. BIN Docs/assets/images/Quad.png
  71. BIN Docs/assets/images/Quart.png
  72. BIN Docs/assets/images/Quint.png
  73. BIN Docs/assets/images/Sine.png
  74. +1,296 −0 Docs/assets/showdown.js
  75. +293 −0 Docs/assets/style.css
  76. +52 −0 Docs/index.html
  77. +8 −0 Docs/license.md
  78. +85 −0 Source/Class/Class.Extras.js
  79. +85 −0 Source/Class/Class.js
  80. +88 −0 Source/Core/Browser.js
  81. +242 −0 Source/Core/Core.js
  82. +85 −0 Source/Drag/Drag.Move.js
  83. +130 −0 Source/Drag/Drag.js
  84. +285 −0 Source/Element/Element.Event.js
  85. +130 −0 Source/Element/Element.Style.js
  86. +602 −0 Source/Element/Element.js
  87. +139 −0 Source/Fx/Fx.CSS.js
  88. +69 −0 Source/Fx/Fx.Morph.js
  89. +90 −0 Source/Fx/Fx.Scroll.js
  90. +135 −0 Source/Fx/Fx.Slide.js
  91. +98 −0 Source/Fx/Fx.Transitions.js
  92. +85 −0 Source/Fx/Fx.Tween.js
  93. +121 −0 Source/Fx/Fx.js
  94. +136 −0 Source/Native/Array.js
  95. +60 −0 Source/Native/Function.js
  96. +131 −0 Source/Native/Hash.js
  97. +44 −0 Source/Native/Number.js
  98. +77 −0 Source/Native/String.js
  99. +103 −0 Source/Plugins/Accordion.js
  100. +80 −0 Source/Plugins/Assets.js
  101. +49 −0 Source/Plugins/Fx.Elements.js
  102. +48 −0 Source/Plugins/Hash.Cookie.js
  103. +64 −0 Source/Plugins/Scroller.js
  104. +63 −0 Source/Plugins/Selectors.Children.js
  105. +107 −0 Source/Plugins/Slider.js
  106. +38 −0 Source/Plugins/SmoothScroll.js
  107. +178 −0 Source/Plugins/Sortables.js
  108. +124 −0 Source/Plugins/Tips.js
  109. +60 −0 Source/Request/Request.HTML.js
  110. +27 −0 Source/Request/Request.JSON.js
  111. +202 −0 Source/Request/Request.js
  112. +168 −0 Source/Selectors/Selectors.Pseudo.js
  113. +240 −0 Source/Selectors/Selectors.js
  114. +125 −0 Source/Utilities/Color.js
  115. +46 −0 Source/Utilities/Cookie.js
  116. +185 −0 Source/Utilities/Dimensions.js
  117. +40 −0 Source/Utilities/Group.js
  118. +53 −0 Source/Utilities/JSON.js
  119. +96 −0 Source/Utilities/Swiff.js
  120. +99 −0 Specs/Builder.js
  121. +194 −0 Specs/Class/Class.Extras.js
  122. +136 −0 Specs/Class/Class.js
  123. +40 −0 Specs/Core/Browser.js
  124. +376 −0 Specs/Core/Core.js
  125. +504 −0 Specs/Element/Element.js
  126. +141 −0 Specs/Native/Array.js
  127. +102 −0 Specs/Native/Function.js
  128. +130 −0 Specs/Native/Hash.js
  129. +75 −0 Specs/Native/Number.js
  130. +98 −0 Specs/Native/String.js
  131. +20 −0 Specs/Selectors/Selectors.js
  132. +17 −0 Specs/Selectors/index.html
Sorry, we could not display the entire diff because it was too big.
1 Compatibility/Class/Class.js
@@ -0,0 +1 @@
+Class.empty = $empty;
8 Compatibility/Core/Browser.js
@@ -0,0 +1,8 @@
+window.extend = document.extend = function(properties){
+ for (var property in properties) this[property] = properties[property];
+};
+window.extend(Browser.Engine);
+
+window.ie = window.trident;
+window.ie6 = window.trident4;
+window.ie7 = window.trident5;
18 Compatibility/Core/Core.js
@@ -0,0 +1,18 @@
+$A = function(iterable, start, length){
+ if (Browser.Engine.trident && $type(iterable) == 'collection'){
+ start = start || 0;
+ if (start < 0) start = iterable.length + start;
+ length = length || (iterable.length - start);
+ var array = [];
+ for (var i = 0; i < length; i++) array[i] = iterable[start++];
+ return array;
+ }
+ start = (start || 0) + ((start < 0) ? iterable.length : 0);
+ var end = ((!$chk(length)) ? iterable.length : length) + start;
+ return Array.prototype.slice.call(iterable, start, end);
+};
+
+(function(){
+ var natives = [Array, Function, String, RegExp, Number];
+ for (var i = 0, l = natives.length; i < l; i++) natives[i].extend = natives[i].implement;
+})();
1 Compatibility/Drag/Drag.js
@@ -0,0 +1 @@
+Drag.Base = Drag;
1 Compatibility/Element/Element.Event.js
@@ -0,0 +1 @@
+Event.keys = Event.Keys;
7 Compatibility/Element/Element.Style.js
@@ -0,0 +1,7 @@
+Element.implement({
+
+ setOpacity: function(op){
+ return this.set('opacity', op);
+ }
+
+});
55 Compatibility/Element/Element.js
@@ -0,0 +1,55 @@
+Element.extend = Element.implement;
+
+Elements.extend = Elements.implement;
+
+Element.implement({
+
+ getFormElements: function(){
+ return this.getElements('input, textarea, select');
+ },
+
+ getValue: function(){
+ return this.get('value');
+ },
+
+ getText: function(){
+ return this.get('text');
+ },
+
+ setText: function(text){
+ return this.set('text', text);
+ },
+
+ setHTML: function(){
+ return this.set('html', $A(arguments));
+ },
+
+ getTag: function(){
+ return this.get('tag');
+ },
+
+ replaceWith: function(el){
+ el = $(el);
+ this.parentNode.replaceChild(el, this);
+ return el;
+ },
+
+ removeElements: function(){
+ return this.dispose();
+ },
+
+ remove: function(){
+ return this.dispose();
+ }
+
+});
+
+(function(){
+ var methods = {};
+ Element.Inserters.each(function(value, key){
+ methods['inject' + key.capitalize()] = function(el){
+ return Element.inject(this, el, key);
+ };
+ });
+ Element.implement(methods);
+})();
1 Compatibility/Fx/Fx.Morph.js
@@ -0,0 +1 @@
+Fx.Styles = Fx.Morph;
7 Compatibility/Fx/Fx.Scroll.js
@@ -0,0 +1,7 @@
+Fx.Scroll.implement({
+
+ scrollTo: function(y, x){
+ return this.start(y, x);
+ }
+
+});
1 Compatibility/Fx/Fx.Tween.js
@@ -0,0 +1 @@
+Fx.Style = Fx.Tween;
13 Compatibility/Fx/Fx.js
@@ -0,0 +1,13 @@
+Fx.implement({
+
+ custom: function(from, to){
+ return this.start(from, to);
+ },
+
+ clearTimer: function(){
+ return this.cancel();
+ }
+
+});
+
+Fx.Base = Fx;
7 Compatibility/Native/Array.js
@@ -0,0 +1,7 @@
+Array.implement({
+
+ copy: function(start, length){
+ return $A(this, start, length);
+ }
+
+});
9 Compatibility/Native/Function.js
@@ -0,0 +1,9 @@
+Function.extend({
+
+ bindAsEventListener: function(bind, args){
+ return this.create({'bind': bind, 'event': true, 'arguments': args});
+ }
+
+});
+
+Function.empty = $empty;
2 Compatibility/Native/Hash.js
@@ -0,0 +1,2 @@
+Hash.alias('getKeys', 'keys').alias('getValues', 'values').alias('has', 'hasKey');
+var Abstract = Hash;
25 Compatibility/Request/Request.JSON.js
@@ -0,0 +1,25 @@
+JSON.Remote = new Class({
+
+ options: {
+ key: 'json'
+ },
+
+ Extends: Request.JSON,
+
+ initialize: function(url, options){
+ arguments.callee.parent(options);
+ this.onComplete = $empty;
+ this.url = url;
+ },
+
+ send: function(data){
+ if (!this.check(data)) return this;
+ return arguments.callee.parent({url: this.url, data: {json: Json.encode(data)}});
+ },
+
+ onSuccess: function(text){
+ arguments.callee.parent(text);
+ this.fireEvent('onComplete', [this.response.json]);
+ }
+
+});
34 Compatibility/Request/Request.js
@@ -0,0 +1,34 @@
+Object.toQueryString = Hash.toQueryString;
+
+var XHR = new Class({
+
+ Extends: Request,
+
+ options: {
+ update: false
+ },
+
+ initialize: function(url, options){
+ arguments.callee.parent(options);
+ this.onComplete = $empty;
+ this.url = url;
+ },
+
+ request: function(data){
+ return this.send(this.url, data);
+ },
+
+ send: function(url, data){
+ if (!this.check(url, data)) return this;
+ return arguments.callee.parent({url: url, data: data});
+ },
+
+ onSuccess: function(text, xml){
+ if (this.options.update) $(this.options.update).empty().set('html', text);
+ arguments.callee.parent(text, xml);
+ this.fireEvent('onComplete', [text, xml]);
+ }
+
+});
+
+var Ajax = XHR;
39 Compatibility/Selectors/Selectors.js
@@ -0,0 +1,39 @@
+Native.implement([Element, Document], {
+
+ getElementsByClassName: function(className){
+ return this.getElements('.' + className);
+ },
+
+ getElementsBySelector: function(selector){
+ return this.getElements(selector);
+ }
+
+});
+
+Elements.implement({
+
+ filterByTag: function(tag){
+ return this.filterBy(tag);
+ },
+
+ filterByClass: function(className){
+ return this.filterBy('.' + className);
+ },
+
+ filterById: function(id){
+ return this.filterBy('#' + id);
+ },
+
+ filterByAttribute: function(name, operator, value){
+ return this.filterBy('[' + name + (operator || '') + (value || '') + ']');
+ }
+
+});
+
+$E = function(selector, filter){
+ return ($(filter) || document).getElement(selector);
+};
+
+var $ES = function(selector, filter){
+ return ($(filter) || document).getElements(selector);
+};
55 Compatibility/Utilities/Dimensions.js
@@ -0,0 +1,55 @@
+Window.implement({
+
+ getSize: function(){
+ return {
+ size: this.document.getOffsetSize(),
+ scroll: this.document.getScroll(),
+ scrollSize: this.document.getScrollSize()
+ };
+ },
+
+ getHeight: function(){
+ return this.document.getOffsetSize().y;
+ },
+
+ getWidth: function(){
+ return this.document.getOffsetSize().x;
+ },
+
+ getScrollTop: function(){
+ return this.document.getScroll().y;
+ },
+
+ getScrollLeft: function(){
+ return this.document.getScroll().x;
+ },
+
+ getScrollHeight: function(){
+ return this.document.getScrollSize().y;
+ },
+
+ getScrollWidth: function(){
+ return this.document.getScrollSize().x;
+ }
+
+});
+
+Element.implement({
+
+ getSize: function(){
+ return {
+ size: this.getOffsetSize(),
+ scroll: this.getScroll(),
+ scrollSize: this.getScrollSize()
+ };
+ },
+
+ getTop: function(){
+ return this.getPosition().y;
+ },
+
+ getLeft: function(){
+ return this.getPosition().x;
+ }
+
+});
4 Compatibility/Utilities/JSON.js
@@ -0,0 +1,4 @@
+var Json = JSON;
+
+JSON.toString = JSON.encode;
+JSON.evaluate = JSON.decode;
377 Docs/Class/Class.Extras.md
@@ -0,0 +1,377 @@
+Class.Extras.js
+---------------
+
+Contains common implementations for custom classes.
+In MooTools these Utilities are implemented in [Ajax][], [XHR][], [Fx][] and many other Classes to provide rich functionality.
+
+### License:
+
+MIT-style license.
+
+
+
+Class: Chain {#Chain}
+=====================
+
+**A "Utility" Class which executes functions one after another, with each function firing after completion of the previous.
+Its methods can be implemented with [Class:implement][] into any [Class][], and it is currently implemented in [Fx][], [XHR][] and [Ajax][].
+In [Fx][], for example, it is used to create custom, complex animations.**
+
+
+
+Chain Method: constructor {#Chain:constructor}
+----------------------------------------------
+
+
+### Syntax:
+
+#### For new classes:
+
+ var MyClass = new Class({ Implements: Chain });
+
+#### For existing classes:
+
+ MyClass.implement(Chain);
+
+#### Stand alone
+
+ var myChain = new Chain;
+
+### Example:
+
+ var Todo = new Class({
+ Implements: Chain,
+ initialize: function(){
+ this.chain.apply(this, arguments);
+ }
+ });
+
+ var myTodoList = new Todo(
+ function(){ alert('get groceries'); },
+ function(){ alert('go workout'); },
+ function(){ alert('code mootools documentation until eyes close involuntarily'); },
+ function(){ alert('sleep'); }
+ );
+
+### See Also:
+
+- [Class][]
+
+
+
+Chain Method: chain {#Chain:chain}
+----------------------------------
+
+**Adds functions to the end of the call stack of the Chain instance.**
+
+### Syntax:
+
+ myClass.chain(fn[, fn2[, fn3[, ...]]]);
+
+### Arguments:
+
+1. Any number of functions.
+
+### Returns:
+
+* (*object*) This Class instance. Calls to chain can also be chained.
+
+### Example:
+
+ //will fade the element in and out three times
+ var myFx = new Fx.Style('myElement', 'opacity'); //Fx.Style has implemented class Chain because of inheritance.
+ myFx.start(1,0).chain(
+ function(){ this.start(0,1); }, //notice that "this" refers to the calling object. In this case: myFx object.
+ function(){ this.start(1,0); },
+ function(){ this.start(0,1); }
+ );
+
+
+### See Also:
+
+- [Fx][], [Fx.Tween][]
+
+
+
+Chain Method: callChain {#Chain:callChain}
+------------------------------------------
+
+**Removes the first function of the Chain instance stack and executes it. The next function will then become first in the array.**
+
+### Syntax:
+
+ myClass.callChain([any arguments]);
+
+### Arguments:
+
+1. any arguments passed in will be passed to the "next" function
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Example:
+
+ var myChain = new Chain();
+ myChain.chain(
+ function(){ alert('do dishes'); },
+ function(){ alert('put away clean dishes'); }
+ );
+ myChain.callChain(); //alerts 'do dishes'
+ myChain.callChain(); //alerts 'put away clean dishes'
+
+
+
+Chain Method: clearChain {#Chain:clearChain}
+--------------------------------------------
+
+**Clears the stack of a Chain instance.**
+
+### Syntax:
+
+ myClass.clearChain();
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Example:
+
+ var myFx = Fx.Style('myElement', 'color'); //Fx.Style inherited Fx's implementation of Chain see <Fx>
+ myFx.chain(function(){ while(true) alert('doh!'); }); //don't try this at home, kids.
+ myFx.clearChain(); // .. that was a close one ...
+
+### See Also:
+
+- [Fx][], [Fx.Tween][]
+
+
+
+Class: Events {#Events}
+=======================
+
+**A "Utility" Class. Its methods can be implemented with [Class:implement][] into any [Class][].
+In [Fx][], for example, this Class is used to allow any number of functions to be added to the Fx events, like onComplete, onStart, and onCancel.
+Events in a Class that implements [Events](#Events) must be either added as an option or with addEvent, not directly through .options.onEventName.**
+
+### Syntax:
+
+#### For new classes:
+
+ var MyClass = new Class({ Implements: Events });
+
+#### For existing classes:
+
+ MyClass.implement(Events);
+
+### Implementing:
+
+- This class can be implemented into other classes to add its functionality to them.
+- It has been designed to work well with the [Options](#Options) class.
+
+### Example:
+
+ var Widget = new Class({
+ Implements: Events,
+ initialize: function(element){
+ ...
+ },
+ complete: function(){
+ this.fireEvent('onComplete');
+ }
+ });
+
+ var myWidget = new Widget();
+ myWidget.addEvent('onComplete', myFunction);
+
+
+### See Also:
+
+- [Class][], [Options](#Options)
+
+
+
+Events Method: addEvent {#Events:addEvent}
+------------------------------------------
+
+**Adds an event to the Class instance's event stack.**
+
+### Syntax:
+
+ myClass.addEvent(type, fn[, internal]);
+
+### Arguments:
+
+1. **type** - (*string*) The type of event (e.g. 'onComplete').
+2. **fn** - (*function*) The function to execute.
+3. **internal** - (*boolean*, optional) Sets the function property: internal to true. Internal property is used to prevent removal.
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Example:
+
+ var myFx = new Fx.Style('element', 'opacity');
+ myFx.addEvent('onStart', myStartFunction);
+
+
+
+Events Method: fireEvent {#Events:fireEvent}
+--------------------------------------------
+
+**Fires all events of the specified type in the Class instance.**
+
+### Syntax:
+
+ myClass.fireEvent(type[, args[, delay]]);
+
+### Arguments:
+
+1. **type** - (*string*) The type of event (e.g. 'onComplete').
+2. **args** - (*mixed*, optional) The argument(s) to pass to the function. To pass more than one argument, the arguments must be in an array.
+3. **delay** - (*number*, optional) Delay in miliseconds to wait before executing the event (defaults to 0).
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Example:
+
+ var Widget = new Class({
+ Implements: Events,
+ initialize: function(arg1, arg2){
+ ...
+ this.fireEvent("onInitialize", [arg1, arg2], 50);
+ }
+ });
+
+
+
+Events Method: removeEvent {#Events:removeEvent}
+------------------------------------------------
+
+**Removes an event from the stack of events of the Class instance.**
+
+### Syntax:
+
+ myClass.removeEvent(type, fn);
+
+### Arguments:
+
+1. **type** - (*string*) The type of event (e.g. 'onComplete').
+2. **fn** - (*function*) The function to remove.
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Notes:
+
+- If the function has the property internal and is set to true, then the event will not be removed.
+
+
+Events Method: removeEvents {#Events:removeEvents}
+--------------------------------------------------
+
+**Removes all events of the given type from the stack of events of a Class instance. If no type is specified, removes all events of all types.**
+
+### Syntax:
+
+ myClass.removeEvents([type]);
+
+### Arguments:
+
+1. **type** - (*string*, optional) The type of event to remove (e.g. 'onComplete'). If no type is specified, removes all events of all types.
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Example:
+
+ var myFx = new Fx.Style('element', 'opacity');
+ myFx.removeEvents('onComplete');
+
+
+### Notes:
+
+- Will not remove internal events. See [Events:removeEvent][].
+
+
+
+Class: Options {#Options}
+=========================
+
+**A "Utility" Class. Its methods can be implemented with [Class:implement][] into any [Class][].**
+**Used to automate the setting of a Class instance's options.**
+**Will also add Class [Events](#Events) when the option property begins with on, followed by a capital letter (e.g. 'onComplete').**
+
+### Syntax:
+
+#### For new classes:
+
+ var MyClass = new Class({Implements: Options});
+
+#### For existing classes:
+
+ MyClass.implement(Options);
+
+
+
+Options Method: setOptions {#Options:setOptions}
+------------------------------------------------
+
+**Merges the default options of the Class with the options passed in.**
+
+### Syntax:
+
+ myClass.setOptions([options]);
+
+### Arguments:
+
+1. **options** - (*object*, optional) The user defined options to merge with the defaults.
+
+### Returns:
+
+* (*object*) This Class instance.
+
+### Example:
+
+ var Widget = new Class({
+ Implements: Options,
+ options: {
+ color: '#fff',
+ size: {
+ width: 100,
+ height: 100
+ }
+ },
+ initialize: function(options){
+ this.setOptions(options);
+ }
+ });
+
+ var myWidget = new Widget({
+ color: '#f00',
+ size: {
+ width: 200
+ }
+ });
+
+ //myWidget.options is now {color: #f00, size: {width: 200, height: 100}}
+
+### Notes:
+
+- Relies on the default options of a Class defined in its options property.
+- If a Class has [Events](#Events) implemented, every option beginning with 'on' and followed by a capital letter (e.g. 'onComplete') becomes a Class instance event, assuming the value of the option is a function.
+
+
+
+[Fx]: /Fx/Fx
+[Fx.Tween]: /Fx/Fx.Tween
+[Ajax]: /Remote/Request.HTML
+[XHR]: /Request/Request
+[Class]: /Class/Class
+[Class:implement]: /Class/#Class:implement
+[Events:removeEvent]: /Element/Element.Event/#Element:removeEvent
135 Docs/Class/Class.md
@@ -0,0 +1,135 @@
+Class.js
+--------
+
+Contains the Class Function for easily creating, extending, and implementing reusable Classes.
+
+### License:
+
+MIT-style license.
+
+
+
+Native: Class {#Class}
+======================
+
+The base Class of the [MooTools](http://mootools.net/) framework.
+
+Class Method: constructor {#Class:constructor}
+----------------------------------------------
+
+### Syntax:
+
+ var MyClass = new Class(properties);
+
+### Arguments:
+
+1. **properties** - (*object*) The collection of properties that apply to the Class. Also accepts some special properties such as Extends, Implements, and initialize (see below).
+
+#### Property: Extends
+
+* (*class*) The Class that this class will extend.
+
+The methods of This Class that have the same name as the Extends Class, will have a parent property, that allows you to call the other overridden method.
+
+#### Property: Implements
+
+* (*object*) An object which properties will be copied into this Class.
+* (*class*) A Class which properties will be copied into this Class.
+* (*array*) An array of objects or Classes which properties will be copied into this Class.
+
+Similar to Extends, but it simply overrides the properties, without inheritance.
+Useful when implementing a default set of properties in multiple Classes.
+
+#### Property: initialize
+
+* (*function*) The initialize function will be the constructor for this class when new instances are created.
+
+### Returns:
+
+* (*class*) The Class created.
+
+### Examples:
+
+#### Class Example:
+
+ var Cat = new Class({
+ initialize: function(name){
+ this.name = name;
+ }
+ });
+ var myCat = new Cat('Micia');
+ alert(myCat.name); //alerts 'Micia'
+
+ var Cow = new Class({
+ initialize: function(){
+ alert('moooo');
+ });
+ });
+ var Effie = new Cow($empty); //will not alert 'moooo'
+
+#### Extends Example:
+
+ var Animal = new Class({
+ initialize: function(age){
+ this.age = age;
+ }
+ });
+ var Cat = new Class({Extends: Animal
+ initialize: function(name, age){
+ this.parent(age); //will call initalize of Animal
+ this.name = name;
+ }
+ });
+ var myCat = new Cat('Micia', 20);
+ alert(myCat.name); //alerts 'Micia'
+ alert(myCat.age); //alerts 20
+
+#### Implements Example:
+
+ var Animal = new Class({
+ initialize: function(age){
+ this.age = age;
+ }
+ });
+ var Cat = new Class({
+ Implements: Animal,
+ setName: function(name){
+ this.name = name
+ }
+ });
+ var myCat = new Cat(20);
+ myAnimal.setName('Micia');
+ alert(myAnimal.name); //alerts 'Micia'
+
+
+
+
+Class Method: implement {#Class:implement}
+------------------------------------------
+
+**Implements the passed in properties into the base Class prototypes, altering the base Class.**
+**The same as creating a [new Class](#Class:constructor) with the Implements property, but handy when you need to modify existing classes.**
+
+### Syntax:
+
+ MyClass.implement(properties);
+
+### Arguments:
+
+1. **properties** - (*object*) The properties to add to the base Class.
+
+### Examples:
+
+ var Animal = new Class({
+ initialize: function(age){
+ this.age = age;
+ }
+ });
+ Animal.implement({
+ setName: function(name){
+ this.name = name
+ }
+ });
+ var myAnimal = new Animal(20);
+ myAnimal.setName('Micia');
+ alert(myAnimal.name); //alerts 'Micia'
46 Docs/Core/Browser.md
@@ -0,0 +1,46 @@
+Browser.js
+----------
+Browser Contains Browser Initialization, including Window and Document, plus the Browser Hash.
+
+### License:
+
+MIT-style license.
+
+
+
+Browser {#Browser}
+==================
+
+Hash: Browser {#Browser}
+------------------------
+
+**Some browser properties are attached to the Browser Object for browser and platform detection.**
+
+### Features:
+
+* **Browser.Features.xpath** - (*boolean*) True if the browser supports dom queries using xpath.
+* **Browser.Features.xhr** - (*boolean*) True if the browser supports native XMLHTTP object.
+
+### Engine:
+
+* **Browser.Engine.trident** - (*boolean*) True if the current browser is Internet Explorer (any).
+* **Browser.Engine.trident4** - (*boolean*) True if the current browser is Internet Explorer 6.
+* **Browser.Engine.trident5** - (*boolean*) True if the current browser is Internet Explorer 7.
+* **Browser.Engine.gecko** - (*boolean*) True if the current browser is Mozilla/Gecko.
+* **Browser.Engine.webkit** - (*boolean*) True if the current browser is Safari/Konqueror.
+* **Browser.Engine.webkit419** - (*boolean*) True if the current browser is Safari2 / webkit till version 419.
+* **Browser.Engine.webkit420** - (*boolean*) True if the current browser is Safari3 (Webkit SVN Build) / webkit over version 419.
+* **Browser.Engine.presto** - (*boolean*) True if the current browser is opera.
+* **Browser.Engine.name** - (*string*) The name of the engine.
+
+### Platform:
+
+* **Browser.Platform.mac** - (*boolean*) True if the platform is mac.
+* **Browser.Platform.windows** - (*boolean*) True if the platform is windows.
+* **Browser.Platform.linux** - (*boolean*) True if the platform is linux.
+* **Browser.Platform.other** - (*boolean*) True if the platform is neither mac, windows or linux.
+* **Browser.Platform.name** - (*string*) The name of the platform.
+
+### Notes:
+
+- Engine detection is entirely feature-based.
557 Docs/Core/Core.md
@@ -0,0 +1,557 @@
+Core.js
+-------
+
+Core contains an handful of common sense functions used in [MooTools](http://mootools.net/). It also contains some basic [Hash][] and [Array][] methods.
+
+### License:
+
+MIT-style license.
+
+
+
+Core Utilities {#Core}
+======================
+
+**Core contains an handful of common sense functions used in [MooTools](http://mootools.net).**
+**It also contains some basic [Hash][] and [Array][] methods.**
+
+
+
+Function: $chk {#chk}
+---------------------
+
+**Checks to see if a value exists or is 0. Useful for allowing 0.**
+
+### Syntax:
+
+ $chk(item);
+
+### Arguments:
+
+1. **item** - (*mixed*) The item to inspect.
+
+### Returns:
+
+* (*boolean*) If the object passed in exists or is 0, returns true. Otherwise, returns false.
+
+### Example:
+
+ function myFunction(arg){
+ if($chk(arg)) alert('The object exists or is 0.');
+ else alert('The object is either null, undefined, false, or ""');
+ }
+
+
+
+Function: $clear {#clear}
+-------------------------
+
+**Clears a Timeout or an Interval.**
+
+### Syntax:
+
+ $clear(timer);
+
+### Arguments:
+
+1. **timer** - (*number*) The identifier of the setInterval (periodical) or setTimeout (delay) to clear.
+
+### Returns:
+
+* (*false*) returns null.
+
+### Example:
+
+ var myTimer = myFunction.delay(5000); //Wait 5 seconds and execute myFunction.
+ myTimer = $clear(myTimer); //Nevermind.
+
+### See also:
+
+- [Function:delay][], [Function:periodical][]
+
+
+
+Function: $defined {#defined}
+-----------------------------
+
+**Checks to see if a value is defined.**
+
+### Syntax:
+
+ $defined(obj);
+
+### Arguments:
+
+1. **obj** - (*mixed*) The object to inspect.
+
+### Returns:
+
+* (*boolean*) If the object passed is not null or undefined, returns true. Otherwise, returns false.
+
+### Example:
+
+ function myFunction(arg){
+ if($defined(arg)) alert('The object is defined.');
+ else alert('The object is null or undefined.');
+ }
+
+
+
+Function: $empty {#empty}
+-------------------------
+
+**An empty function, that's it. Typically used for as a placeholder inside classes event methods.**
+
+### Syntax:
+
+ var emptyFn = $empty;
+
+### Example:
+
+ var myFunc = $empty;
+
+
+
+Function: $extend {#extend}
+---------------------------
+
+**Copies all the properties from the second object passed in to the first object passed in.**
+**In myWhatever.extend = $extend, the first parameter will become myWhatever, and the extend function will only need one parameter.**
+
+### Syntax:
+
+ $extend(original[, extended]);
+
+### Arguments:
+
+1. **original** - (*object*) The object to be extended.
+2. **extended** - (*object*, optional) The object whose properties will be copied to src.
+
+### Returns:
+
+* (*object*) The extended object.
+
+### Examples:
+
+#### Normal Extension:
+
+ var firstObj = {
+ 'name': 'John',
+ 'lastName': 'Doe'
+ };
+ var secondObj = {
+ 'age': '20',
+ 'sex': 'male',
+ 'lastName': 'Dorian'
+ };
+ $extend(firstObj, secondObj);
+ //firstObj is now: { 'name': 'John', 'lastName': 'Dorian', 'age': '20', 'sex': 'male' };
+
+
+#### Without the Second Parameter:
+
+ var myFunction = function(){ ... };
+ myFunction.extend = $extend;
+ myFunction.extend(secondObj);
+ //myFunction now has the properties: 'age', 'sex', and 'lastName', each with its respected values.
+
+
+
+Function: $merge {#merge}
+-------------------------
+
+**Merges any number of objects recursively without referencing them or their sub-objects.**
+
+### Syntax:
+
+ var merged = $merge(obj1, obj2[, obj3[, ...]]);
+
+### Arguments:
+
+1. (**objects**) Any number of objects.
+
+### Returns:
+
+* (*object*) The object that is created as a result of merging all the objects passed in.
+
+### Examples:
+
+ var obj1 = {a: 0, b: 1};
+ var obj2 = {c: 2, d: 3};
+ var obj3 = {a: 4, d: 5};
+ var merged = $merge(obj1, obj2, obj3); //returns {a: 4, b: 1, c: 2, d: 5}, (obj1, obj2, and obj3 are unaltered)
+
+ var nestedObj1 = {a: {b: 1, c: 1}};
+ var nestedObj2 = {a: {b: 2}};
+ var nested = $merge(nestedObj1, nestedObj2); //returns: {a: {b: 2, c: 1}}
+
+
+
+Function: $pick {#pick}
+-----------------------
+
+**Returns the first defined argument passed in, or null.**
+
+### Syntax:
+
+ var picked = $pick(var1[, var2[, var3[, ...]]]);
+
+### Arguments:
+
+* (*mixed*) Any number of variables.
+
+### Returns:
+
+* (*mixed*) The first variable that is defined.
+* (*false*) If all variables passed in are null or undefined, returns null.
+
+### Example:
+
+ function say(infoMessage, errorMessage){
+ alert($pick(errorMessage, infoMessage, 'There was no message supplied.'));
+ }
+
+
+
+Function: $random {#random}
+---------------------------
+
+**Returns a random integer number between the two passed in values.**
+
+### Syntax:
+
+ var random = $random(min, max);
+
+### Arguments:
+
+1. **min** - (*number*) The minimum value (inclusive).
+2. **max** - (*number*) The maximum value (inclusive).
+
+### Returns:
+
+* (*number*) A random number between min and max.
+
+### Example:
+
+ alert($random(5, 20)); //alerts a random number between 5 and 20
+
+
+
+Function: $splat {#splat}
+-------------------------
+
+**Array-ifies the argument passed in if it is defined and not already an array.**
+
+### Syntax:
+
+ var splatted = $splat(obj);
+
+### Arguments:
+
+1. **obj** - (*mixed*) Any type of variable.
+
+### Returns:
+
+* (*array*) If the variable passed in is an array, returns the array. Otherwise, returns an array with the only element being the variable passed in.
+
+### Example:
+
+ $splat('hello'); //returns ['hello']
+ $splat(['a', 'b', 'c']); //returns ['a', 'b', 'c']
+
+
+
+Function: $time {#time}
+-----------------------
+
+**Returns the current time as a timestamp.**
+
+### Syntax:
+
+ var time = $time();
+
+### Returns:
+
+* (*number*) - Current timestamp.
+
+
+
+Function: $try {#try}
+---------------------
+
+**Tries to execute a function. Returns false if it fails.**
+
+### Syntax:
+
+ $try(fn[, bind[, args]]);
+
+### Arguments:
+
+1. **fn** - (*function*) The function to execute.
+2. **bind** - (*object*, optional: defaults to the function passed in) The object to use as 'this' in the function. For more information see [Function:bind][].
+3. **args** - (*mixed*, optional) Single item or array of items as arguments to be passed to the function.
+
+### Returns:
+
+* (*mixed*) Standard return of the called function.
+* (*boolean*) `false` on failure.
+
+### Examples:
+
+ var result = $try(eval, window, 'some invalid javascript'); //false
+
+### Notes:
+
+- Warning: if the function passed can return false, there will be no way to know if it has been successfully executed or not.
+
+
+
+Function: $type {#type}
+-----------------------
+
+**Returns the type of object that matches the element passed in.**
+
+### Syntax:
+
+ $type(obj);
+
+### Arguments:
+
+1. **obj** - (*object*) The object to inspect.
+
+### Returns:
+
+* *'element'* - (string) If object is a DOM element node.
+* *'textnode'* - (string) If object is a DOM text node.
+* *'whitespace'* - (string) If object is a DOM whitespace node.
+* *'arguments'* - (string) If object is an arguments object.
+* *'array'* - (string) If object is an array.
+* *'object'* - (string) If object is an object.
+* *'string'* - (string) If object is a string.
+* *'number'* - (string) If object is a number.
+* *'boolean'* - (string) If object is a boolean.
+* *'function'* - (string) If object is a function.
+* *'regexp'* - (string) If object is a regular expression.
+* *'class'* - (string) If object is a Class (created with new Class, or the extend of another class).
+* *'collection'* - (string) If object is a native htmlelements collection, such as childNodes, getElementsByTagName, etc.
+* *'window'* - (string) If object is the window object.
+* *'document'* - (string) If object is the document object.
+* *false* - (boolean) If object is undefined, null, NaN or none of the above.
+
+### Examples:
+
+ var myString = 'hello';
+ $type(myString); //returns "string"
+
+
+
+Native: Hash {#Hash}
+====================
+
+**A Custom "Object" ({}) implementation which does not account for prototypes when setting, getting, iterating.**
+**Useful because in Javascript we cannot use Object.prototype. You can now use Hash.prototype!**
+
+
+Hash Method: constructor {#Hash:constructor}
+--------------------------------------------
+
+### Syntax:
+
+ var myHash = new Hash([object]);
+
+### Arguments:
+
+1. **object** - (*mixed*) A hash or object to implement.
+
+### Returns:
+
+* (*hash*) A new Hash instance.
+
+### Examples:
+
+ var myHash = new Hash({
+ aProperty: true,
+ aMethod: function(){
+ return true;
+ }
+ });
+ alert(myHash.has('aMethod')); //true
+
+
+
+Hash Method: each {#Hash:each}
+-------------------------------
+
+**Calls a function for each key-value pair in the object.**
+
+### Syntax:
+
+ myHash.each(fn[, bind]);
+
+### Arguments:
+
+1. **fn** - (*function*) The function which should be executed on each item in the array. This function is passed the item and its index in the array.
+2. **bind** - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
+
+#### Argument: fn
+
+##### Syntax:
+
+ fn(value, key, hash)
+
+##### Arguments:
+
+1. **value** - (*mixed*) The current value in the hash.
+2. **key** - (*string*) The current value's key in the hash.
+3. **hash** - (*hash*) The actual hash.
+
+### Examples:
+
+ var hash = new Hash({first: "Sunday", second: "Monday", third: "Tuesday"});
+ hash.each(function(value, key){
+ alert("the " + key + " day of the week is " + value);
+ }); //alerts "the first day of the week is Sunday", "the second day of the week is Monday", etc.
+
+
+
+Function: $H {#H}
+-----------------
+
+**Shortcut for new [Hash](/Core/#Hash).**
+
+### See Also:
+
+- [Hash][]
+
+
+
+Native: Array {#Array}
+======================
+
+
+Array Method: each {#Array:each}
+---------------------------------
+
+**Calls a function for each element in the array.**
+
+### Syntax:
+
+ myArray.each(fn[, bind]);
+
+### Arguments:
+
+1. **fn** - (*function*) The function which should be executed on each item in the array. This function is passed the item and its index in the array.
+2. **bind** - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
+
+#### Argument: fn
+
+##### Syntax
+
+ fn(item, index, array)
+
+##### Arguments:
+
+1. **item** - (*mixed*) The current item in the array.
+2. **index** - (*number*) The current item's index in the array.
+3. **array** - (*array*) The actual array.
+
+### Examples:
+
+ ['apple', 'banana', 'lemon'].each(function(item, index){
+ alert(index + " = " + item); //alerts "0 = apple" etc.
+ }, bind); //optional second argument for binding, not used here
+
+
+### See Also:
+
+- [MDC Array.forEach](http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Array:forEach)
+
+### Notes:
+
+- This method is only available for browsers without native [Array.forEach](/Core/#Array:forEach) support.
+
+
+
+Function: $A {#A}
+-----------------
+
+**Creates a copy of an Array. Useful for applying the Array prototypes to iterable objects such as a DOM Node collection or the arguments object.**
+
+### Syntax:
+
+ var copiedArray = $A(iterable);
+
+### Arguments:
+
+1. **iterable** - (array) The iterable to copy.
+
+### Returns:
+
+* (*array*) The new copied array.
+
+### Examples:
+
+#### Apply Array to arguments:
+
+ function myFunction(){
+ $A(arguments).each(function(argument, index){
+ alert(argument);
+ });
+ }; //will alert all the arguments passed to the function myFunction.
+
+#### Copy an Array:
+
+ var anArray = [0, 1, 2, 3, 4];
+ var copiedArray = $A(anArray); //returns [0, 1, 2, 3, 4]
+
+
+
+Function: $each {#each}
+-----------------------
+
+**Use to iterate through iterables that are not regular arrays, such as builtin getElementsByTagName calls, arguments of a function, or an object.**
+
+### Syntax:
+
+ $each(iterable, fn[, bind]);
+
+### Arguments:
+
+1. **iterable** - (*object* or *array*) The object or array to iterate through.
+2. **fn** - (*function*) The function to test for each element.
+3. **bind** - (*object*, optional) The object to use as 'this' in the function. For more information see [Function:bind][].
+
+#### Argument: fn
+
+##### Syntax:
+
+ fn(item, index, object)
+
+##### Arguments:
+
+1. **item** - (*mixed*) The current item in the array.
+2. **index** - (*number*) The current item's index in the array. In the case of an object, it is passed the key of that item rather than the index.
+3. **object** - (*mixed*) The actual array/object.
+
+### Examples:
+
+#### Array Example:
+
+ $each(['Sun','Mon','Tue'], function(day, index){
+ alert('name:' + day + ', index: ' + index);
+ }); //alerts "name: Sun, index: 0", "name: Mon, index: 1", etc.
+
+
+#### Object Example:
+
+ $each({first: "Sunday", second: "Monday", third: "Tuesday"}, function(value, key){
+ alert("the " + key + " day of the week is " + value);
+ }); //alerts "the first day of the week is Sunday", "the second day of the week is Monday", etc.
+
+
+
+[Function:bind]: /Native/#Function:bind
+[Hash]: Native/Hash
+[Array]: /Native/Array
+[Function:delay]: /Native/#Function:delay
+[Function:periodical]: /Native/#Function:periodical
160 Docs/Drag/Drag.Move.md
@@ -0,0 +1,160 @@
+Drag.Move.js
+------------
+Contains Drag.Move, Element.makeDraggable
+
+### License:
+
+MIT-style license.
+
+### Remark:
+
+Drag.Move requires an XHTML doctype.
+
+
+
+Class: Drag.Move {#Drag.Move}
+=============================
+
+**An extension to the base Drag class with additional functionality for dragging an Element. Supports snapping and droppables.**
+**Inherits methods, properties, options and events from [Drag][].**
+
+
+
+Drag.Move Method: constructor {#Drag:constructor}
+-------------------------------------------------
+
+### Syntax:
+
+ var myMove = new Drag.Move(myElement[, options]);
+
+### Arguments:
+
+1. **el** - (*element*) The Element to apply the drag to.
+2. **options** - (*object*, optional) The options object. See below.
+
+### Options:
+
+All the base Drag options, plus:
+
+* **container** - (*element*) If an Element is passed, drag will be limited to the passed Element's size and position.
+* **overflown** - (*array*) Array of nested scrolling containers. See [Element:getPosition](/Element/#getPosition).
+* **droppables** - (*array*) The Elements that the draggable can drop into.
+
+ Interaction with droppable work with events fired on the doppable element or, for 'emptydrop', on the dragged element.
+
+ The Events 'over', 'leave' and 'drop' get fired on the droppable element with the dragged element as first argument when the dragged element hovers,leaves or get dropped on the droppable.
+
+### Properties:
+
+All the base Drag properties, plus:
+
+* **droppables** - (*element*) The Elements that the draggable can drop into.
+
+### Example:
+
+ var droppables = $$('li.placements').addEvents({
+ 'over': function() {
+ this.addClass('overed');
+ },
+ 'leave': function() {
+ this.removeClass('overed');
+ },
+ 'drop': function(el) {
+ alert(el.id + ' dropped');
+ }
+ });
+
+ var myMove = new Drag.Move('product-placement', {
+ 'droppables': droppables
+ });
+
+### Notes:
+
+- Drag.Move requires an XHTML doctype.
+- Drag.move supports either position absolute or relative. If no position is found, absolute will be set.
+
+### Demos:
+
+* Drag.Cart - <http://demos.mootools.net/Drag.Cart>
+* Drag.Absolutely - <http://demos.mootools.net/Drag.Absolutely>
+* DragDrop - <http://demos.mootools.net/DragDrop>
+
+### See Also:
+
+- [Drag][]
+
+
+
+Drag.Move Method: stop {#Drag.Move:stop}
+----------------------------------------
+
+**Checks if the Element is above a droppable and fires the drop event. Else, fires the 'emptydrop' event that is attached to this Element. Lastly, calls the Drag Class stop method.**
+
+### Syntax:
+
+ myMove.stop();
+
+### Example:
+
+ var myElement = $('myElement').addEvent('emptydrop', function(){
+ alert('no drop occurred');
+ });
+
+ var myMove = new Drag.Move(myElement, {
+ onSnap: function(){ // due to MooTool's inheritance, all [Drag][]'s Events are also available.
+ this.moved = this.moved || 0;
+ this.moved++;
+ if(this.moved > 1000){
+ alert("You've gone far enough.");
+ this.stop();
+ }
+ }
+ });
+
+### See Also:
+
+- [Drag:stop](/Drag/#stop)
+
+
+
+Native: Element {#Element}
+==========================
+
+**Custom Native to allow all of its methods to be used with any DOM element via the dollar function [$][].**
+
+
+
+Element Method: makeDraggable {#Element:makeDraggable}
+------------------------------------------------------
+
+**Adds drag-to-move behavior to an Element using supplied options.**
+
+### Syntax:
+
+ var myDrag = myElement.makeDraggable([options]);
+
+### Arguments:
+
+1. **options** - (*object*, optional) See [Drag][] and [Drag.Move](#Drag.Move) for acceptable options.
+
+### Returns:
+
+* (*object*) The Drag.Move instance that was created.
+
+### Example:
+
+ var myDrag = $('myElement').makeDraggable({
+ onComplete: function(){
+ alert('done dragging');
+ }
+ });
+
+### See Also:
+
+- [Drag][], [Drag.Move](#Drag.Move)
+
+
+
+[$]: /Element/#dollar
+[Drag]: /Drag/#Drag
+[Element:getPosition]: /Element/#getPosition
199 Docs/Drag/Drag.md
@@ -0,0 +1,199 @@
+Drag.js
+-------
+
+Contains [Drag](#Drag), [Element:makeResizable](#Element:makeResizable)
+
+### License:
+
+MIT-style license.
+
+
+
+Class: Drag {#Drag}
+===================
+
+**Enables the modification of two CSS properties of an Element based on the position of the mouse while the mouse button is down.**
+
+### Implements:
+
+[Events][], [Chain](/Class/Class.Extras#Options)
+
+
+Drag Method: constructor {#Drag:constructor}
+--------------------------------------------
+
+### Syntax:
+
+ var myDragInstance = new Drag(el[, options]);
+
+### Arguments:
+
+1. **el** - (*element*) The Element to apply the transformations to.
+2. **options** - (*object*, optional) The options object.
+
+### Options:
+
+* **handle** - (*element*: defaults to the element passed in) The Element to act as the handle for the draggable element.
+* **grid** - (*integer*: defaults to: false) Distance in pixels for snap-to-grid dragging.
+* **unit** - (*string*: defaults to 'px') A string indicating the CSS unit to append to all integer values.
+* **snap** - (*integer*: defaults to 6) The distance to drag before the Element starts to respond to the drag.
+* **limit** - (*object*: defaults to false) An object with x and y properties used to limit the movement of the Element.
+* **modifiers** - (*object*: defaults to {'x': 'left', 'y': 'top'}) An object with x and y properties used to indicate the CSS modifiers (i.e. 'left').
+
+### Events:
+
+* **onBeforeStart** - Executed before the Drag instance attaches the events. Receives the dragged element as an argument
+* **onStart** - Executed when the user starts to drag (on mousedown). Receives the dragged element as an argument
+* **onSnap** - Executed when the user has dragged past the snap option. Receives the dragged element as an argument
+* **onDrag** - Executed on every step of the drag. Receives the dragged element as an argument
+* **onComplete** - Executed when the user completes the drag. Receives the dragged element as an argument
+
+### Properties:
+
+* **element** - (*element*) The Element being transformed.
+* **handle** - (*element*) The Element acting as the handle for the draggable element.
+
+### Examples:
+
+ var myDrag = new Drag('myDraggable', {
+ snap: 0,
+ onSnap: function(el){
+ el.addClass('dragging');
+ },
+ onComplete: function(el){
+ el.removeClass('dragging');
+ }
+ });
+
+### Notes:
+
+- Drag.Move requires an XHTML doctype.
+
+### See Also:
+
+- [w3schools: CSS Units][]
+
+
+
+Drag Method: attach {#Drag:attach}
+----------------------------------
+
+**Attaches the mouse listener to the handle.**
+
+### Syntax:
+
+ myDrag.attach();
+
+### Returns:
+
+* (*object*) This Drag instance.
+
+### Examples:
+
+ var myDrag = new Drag('myElement').detach(); //the element is inert
+ $('myActivator').addEvent('click', function(){
+ alert('ok now you can drag.');
+ myDrag.attach();
+ });
+
+### See Also:
+
+- [$][], [Element:makeDraggable][], [Drag:detach](#detach), [Element:addEvent][]
+
+
+
+Drag Method: detach {#Drag:detach}
+----------------------------------
+
+**Detaches the mouse listener from the handle.**
+
+### Syntax:
+
+ myDrag.detach();
+
+### Returns:
+
+* (*object*) This Drag instance.
+
+### Examples:
+
+ var myDrag = new Drag('myElement');
+ $('myDeactivator').addEvent('click', function(){
+ alert('no more dragging for you mr.');
+ myDrag.detach();
+ });
+
+### See Also:
+
+- [$][], [Element:makeDraggable][], [Element:addEvent][]
+
+
+
+Drag Method: stop {#Drag:stop}
+------------------------------
+
+**Stops (removes) all attached events from the Drag instance and executes the onComplete Event.**
+
+### Syntax:
+
+ myDrag.stop();
+
+### Examples:
+
+ var myDrag = new Drag('myElement', {
+ onSnap: function(){
+ this.moved = this.moved || 0;
+ this.moved++;
+ if(this.moved > 100) {
+ this.stop();
+ alert("Stop! You'll make the Element angry.");
+ }
+ }
+ });
+
+
+
+Native: Element {#Element}
+==========================
+
+**Custom Native to allow all of its methods to be used with any DOM element via the dollar function [$][].**
+
+
+
+Element Method: makeResizable {#Element:makeResizable}
+------------------------------------------------------
+
+**Adds drag-to-resize behavior to an Element using supplied options.**
+
+### Syntax:
+
+ var myResize = myElement.makeResizable([options]);
+
+### Arguments:
+
+1. **options** - (*object*, optional) See [Drag][] for acceptable options.
+
+### Returns:
+
+* (*object*) The Drag instance that was created.
+
+### Examples:
+
+ var myResize = $('myElement').makeResizable({
+ onComplete: function(){
+ alert('done resizing');
+ }
+ });
+
+### See Also:
+
+- [Drag](#Drag)
+
+
+
+[$]: /Element/#dollar
+[Element:addEvent]: /Element/Element#addEvent
+[Element:makeDraggable]: #Element:makeDraggable
+[Events]: /Class/Class.Extras#Events
+[Chain]: /Class/Class.Extras#Options
+[w3schools: CSS Units]: http://www.w3schools.com/css/css_units.asp
474 Docs/Element/Element.Event.md
@@ -0,0 +1,474 @@
+[$]: /Element/#dollar
+[Function]: /Native/Function
+
+Element.Event
+-------------
+
+Contains Element methods to deal with Element events, and custom Events.
+
+Class: Event {#Element.Event}
+=============================
+
+Cross browser Class to manage Events.
+
+### Syntax:
+
+ new Event([event[, win]]);
+
+### Arguments:
+
+1. event - (event) An HTMLEvent Object.
+2. win - (window, optional: defaults to window) The context of the event.
+
+#### Properties:
+
+* shift - (boolean) True if the user pressed the shift
+* control - (boolean) True if the user pressed the control
+* alt - (boolean) True if the user pressed the alt
+* meta - (boolean) True if the user pressed the meta key
+* wheel - (number) The amount of third button scrolling
+* code - (number) The keycode of the key pressed
+* page.x - (number) The x position of the mouse, relative to the full window
+* page.y - (number) The y position of the mouse, relative to the full window
+* client.x - (number) The x position of the mouse, relative to the viewport
+* client.y - (number) The y position of the mouse, relative to the viewport
+* key - (string) The key pressed as a lowercase string. key also returns 'enter', 'up', 'down', 'left', 'right', 'space', 'backspace', 'delete', 'esc'.
+* target - (element) The event target, not extended with <$> for performance reasons.
+* relatedTarget - (element) The event related target, NOT 'extended' with <$>.
+
+### Example:
+
+ $('myLink').addEvent('keydown', function(event){
+ // event is already the Event class, if you use el.onkeydown you have to write e = new Event(e);
+ alert(event.key); //returns the lowercase letter pressed
+ alert(event.shift); //returns true if the key pressed is shift
+ if (event.key == 's' && event.control) alert('document saved');
+ });
+
+### Note:
+
+- Accessing event.page / event.client requires an XHTML doctype.
+
+#### Hash: Event.Keys
+
+You can add additional Event keys codes by adding properties to the Event.Keys Hash:
+
+#### Example:
+
+ Event.Keys.whatever = 80;
+ $('myInput').addEvent('keydown', function(event){
+ if (event.key == 'whatever') alert('whatever key clicked');
+ });
+
+Event Method: stop {#Element.Event:stop}
+----------------------------------------
+
+Stop an Event from propagating and also executes preventDefault.
+
+### Syntax:
+
+ myEvent.stop();
+
+### Returns:
+
+* (object) This Event instance.
+
+### Example:
+
+##### HTML:
+
+ <a id="myAnchor" href="http://google.com/">Visit Google.com</a>
+
+##### Javascript
+
+ $('myAnchor').addEvent('click', function(event){
+ event.stop(); // prevent the user from leaving the site.
+ this.setText("Where do you think you're going?"); //'this' is Element that fire's the Event.
+ (function(){
+ this.setText("Instead visit the Blog.").set('href', 'http://blog.mootools.net');
+ }).delay(500, this);
+ });
+
+### Note:
+
+- Returning false within the function can also stop the propagation of the Event.
+
+### See Also:
+
+- [Element.addEvent](#Element:addEvent), [Element.stopPropagation](#Event:stopPropagation), [Event.preventDefault](#Event:preventDefault), [Function.delay](#Function:delay)
+
+Event Method: stopPropagation {#Element.Event:stopPropagation}
+--------------------------------------------------------------
+
+Cross browser method to stop the propagation of an event (will not allow the event to bubble up through the DOM).
+
+### Syntax:
+
+ myEvent.stopPropagation();
+
+### Returns:
+
+* (object) This Event object.
+
+### Example:
+
+##### HTML:
+
+ <!-- #myChild does not cover the same area as myElement. Therefore, the 'click' differs from parent and child depending on the click location. -->
+ <div id="myElement">
+ <div id="myChild"></div>
+ </div>
+
+##### Javascript
+
+ $('myElement').addEvent('click', function(){
+ alert('click');
+ return false; // equivalent to stopPropagation.
+ });
+ $('myChild').addEvent('click', function(event){
+ event.stopPropagation(); // this will prevent the event to bubble up, and fire the parent's click event.
+ });
+
+### See Also:
+
+- [Element.addEvent](#Element:addEvent), <http://developer.mozilla.org/en/docs/DOM:event.stopPropagation>
+
+Event Method: preventDefault {#Element.Event:preventDefault}
+------------------------------------------------------------
+
+Cross browser method to prevent the default action of the event.
+
+### Syntax:
+
+ myEvent.preventDefault();
+
+### Returns:
+
+* (object) This Event object.
+
+### Example:
+
+##### HTML:
+
+ <!-- credits: mozilla.org/en/docs/DOM:event.preventDefault -->
+ <form>
+ <input id="myCheckbox" type="checkbox" />
+ </form>
+
+##### Javascript
+
+ $('myCheckbox').addEvent('click', function(event){
+ event.preventDefault(); // will not allow the checkbox to be "checked"
+ });
+
+### See Also:
+
+- [Element.addEvent](#Element:addEvent), <http://developer.mozilla.org/en/docs/DOM:event.preventDefault>
+
+Native: Element {#Element}
+==========================
+
+- Custom Native to allow all of its methods to be used with any DOM element via the dollar function <$>.
+- These methods are also available on window and document.
+
+Element Method: addEvent {#Element:addEvent}
+--------------------------------------------
+
+Attaches an event listener to a DOM element.
+
+### Syntax:
+
+ myElement.addEvent(type, fn[, nativeType]);
+
+### Arguments:
+
+1. type - (string) The event name to monitor ('click', 'load', etc) without the prefix 'on'.
+2. fn - (funtion) The function to execute.
+
+### Returns:
+
+* (element) This Element.
+
+### Example:
+
+##### HTML:
+
+ <div id="myElement">Click me.</div>
+
+##### Javascript
+
+ $('myElement').addEvent('click', function(){ alert('clicked!'); });
+
+### Notes:
+
+- You can stop the Event by returning false in the listener or calling [Event.stop](#Event:stop).
+- This method is also attached to Document and Window.
+
+### See Also:
+
+- <http://www.w3schools.com/html/html_eventattributes.asp>
+
+Element Method: removeEvent {#Element:removeEvent}
+--------------------------------------------------
+
+Works as Element.addEvent, but instead removes the previously added event listener.
+
+### Syntax:
+
+ myElement.removeEvent(type, fn);
+
+### Arguments:
+
+1. type - (string) The event name.
+2. fn - (funtion) The function to remove.
+
+### Returns:
+
+* (element) This Element.
+
+### Examples:
+
+#### Standard usage:
+
+ var destroy = function(){ alert('Boom: ' + this.id); } // this is the Element
+ $('myElement').addEvent('click', destroy);
+ // later in the code
+ $('myElement').removeEvent('click', destroy);
+
+
+#### Example with bind:
+
+ var destroy = function(){ alert('Boom: ' + this.id); } // this is the Element
+ var destroy2 = destroy.bind($('anotherElement'));
+ $('myElement').addEvent('click', destroy2); // this is now another Element
+
+ // later in the code
+ $('myElement').removeEvent('click', destroy); // DOES NOT WORK
+ $('myElement').removeEvent('click', destroy.bind($('anotherElement')); // DOES ALSO NOT WORK
+ $('myElement').removeEvent('click', destroy2); // Finally, this works
+
+### Notes:
+
+- When the function was added using [Function.bind] (#Function:bind) or [Function.pass] (#Function:pass) a new reference was created and you can not use removeEvent with the original function.
+- This method is also attached to Document and Window.
+
+Element Method: addEvents {#Element:addEvents}
+----------------------------------------------
+
+As [Element.addEvent](#Element:addEvent), but accepts an object and add multiple events at once.
+
+### Syntax:
+
+ myElement.addEvents(events);
+
+### Arguments:
+
+1. events - (object) An object with key/value representing: key the event name, and value the function that is called when the Event occurs.
+
+### Returns:
+
+*(element) This Element.
+
+### Example:
+
+ $('myElement').addEvents({
+ 'mouseover': function(){
+ alert('mouse over');
+ },
+ 'click': function(){
+ alert('clicked');
+ }
+ });
+
+### Note:
+
+- This method is also attached to Document and Window.
+
+### See Also:
+
+- [Element.addEvent](#Element:addEvent)
+
+Element Method: removeEvents {#Element:removeEvents}
+----------------------------------------------------
+
+Removes all events of a certain type from an Element. If no argument is passed in, removes all events.
+
+### Syntax:
+
+ myElements.removeEvents([type]);
+
+### Arguments:
+
+1. type - (string, optional) The event name (e.g. 'click'). If null, removes all events.
+
+### Returns:
+
+* (element) This Element.
+
+### Example:
+
+ var myElement = $('myElement');
+ myElement.addEvents({
+ 'mouseover': function(){
+ alert('mouse over');
+ },
+ 'click': function(){
+ alert('clicked');
+ }
+ });
+
+ myElement.addEvent('click': function(){ alert('clicked again'); });
+ myElement.addEvent('click': function(){ alert('clicked and again :('); });
+ // addEvent will keep appending each function. Unfortunately for the visitors, that'll be three alerts they'll receive.
+
+ myElement.removeEvents('click'); //ahhh saved the visitor's finger.
+
+### Note:
+
+- This method is also attached to Document and Window.
+
+### See Also:
+
+- [Element.removeEvent](#Element:removeEvent)
+
+Element Method: fireEvent {#Element:fireEvent}
+----------------------------------------------
+
+Executes all events of the specified type present in the Element.
+
+### Syntax:
+
+ myElement.fireEvent(type[, args[, delay]]);
+
+### Arguments:
+
+1. type - (string) The event name (e.g. 'click')
+2. args - (mixed, optional) Array or single object, arguments to pass to the function. If more than one argument, must be an array.
+3. delay - (number, optional) Delay (in ms) to wait to execute the event.
+
+### Returns:
+
+* (element) This Element.
+
+### Example:
+
+ $('myElement').fireEvent('click', $('anElement'), 1000); // Fires all the added 'click' events and passes the element 'anElement' after 1 sec.
+
+### Notes:
+
+- This will not fire the DOM Event (this concerns all inline events ie. onmousedown="..").
+- This method is also attached to Document and Window.
+
+Element Method: cloneEvents {#Element:cloneEvents}
+--------------------------------------------------
+
+Clones all events from an Element to this Element.
+
+### Syntax:
+
+ myElement.cloneEvents(from[, type]);
+
+### Arguments:
+
+1. from - (element) Copy all events from this Element.
+2. type - (string, optional) Copies only events of this type. If null, copies all events.
+
+### Returns:
+
+* (element) This Element.
+
+### Example:
+
+ var myElement = $('myElement');
+ var myClone = myElement.clone().cloneEvents(myElement); //clones the element and its events
+
+### Note:
+
+This method is also attached to Document and Window.
+
+### Hash: Element.Events
+
+You can add additional custom events by adding properties (objects) to the Element.Events Hash
+
+#### Arguments:
+The Element.Events.yourproperty (object) can have:
+
+1. base - (string, optional) the base event the custom event will listen to. Its not optional if condition is set.
+2. condition - (function, optional) the condition from which we determine if the custom event can be fired. Is bound to the element you add the event to. The Event is passed in.
+3. onAdd - (function, optional) the function that will get fired when the custom event is added. Is bound to the element you add the event to.
+4. onRemove - (function, optional) the function that will get fired when the custom event is removed. Is bound to the element you add the event to.
+
+#### Example:
+
+ Element.Events.shiftclick = {
+ base: 'click', //we set a base type
+ condition: function(event){ //and a function to perform additional checks.
+ return (event.shift == true); //this means the event is free to fire
+ }
+ }
+
+ $('myInput').addEvent('shiftclick', function(event){
+ log('the user clicked the left mouse button while holding the shift key');
+ });
+
+#### Note:
+
+- There are different types of custom Events you can create:
+
+- Custom Events with only base: they will just be a redirect to the base event.
+- Custom Events with base and condition: they will be redirect to the base event, but only fired if the condition is met.
+- Custom Events with onAdd and/or onRemove and any other of the above: they will also perform additional functions when the event is added/removed.
+
+#### Warning:
+
+If you use the condition option you NEED to specify a base type, unless you plan to overwrite a native event
+(highly unrecommended: use only when you know exactly what you're doing).
+
+### Custom Events
+
+#### Event: mouseenter
+
+This event fires when the mouse enters the area of the dom Element and will not be fired again if the mouse crosses over children of the Element (unlike the broken mouseover).
+
+#### Example:
+
+ $('myElement').addEvent('mouseenter', myFunction);
+
+#### See Also:
+
+- [Element.addEvent](#Element:addEvent)
+
+#### Event: mousewheel
+
+This event fires when the mouse wheel is rotated;
+
+#### Example:
+
+ $('myElement').addEvent('mousewheel', myFunction);
+
+#### Note:
+
+This custom event just redirects DOMMouseScroll (mozilla) to mousewheel (opera, internet explorer), making it crossbrowser.
+
+#### See Also:
+
+- [Element.addEvent](#Element:addEvent)
+
+
+#### Event: domready
+
+Executes a function when the dom tree is loaded, without waiting for images. Only works when called from window.
+
+### Arguments:
+
+* fn - (function) The function to execute when the DOM is ready.
+
+### Example:
+
+ window.addEvent('domready', function(){
+ alert('the dom is ready');
+ });
+
+### Credits: