lsd_rails 0.1

data/Packages/mootools-more/Docs/Element/Element.Event.Pseudos.Keys.md

@@ -0,0 +1,67 @@
+Element.Event.Pseudo :keys {#Pseudos}
+=====================================
+
+Defines the `:keys` Element Event Pseudo. It captures key combinations and fires an event when all keys are pressed.
+
+### See Also
+
+- [Element.Event.Pseudos][]
+- [Keyboard][]
+
+### Note
+
+- This plugin adds some common used keys to the keys you can use, like `-`, `end` or `=`. See for the complete list below.
+
+Pseudo: keys {#Pseudos:keys}
+----------------------------
+
+The event will only fire when a key combination is pressed. This only works with the `keydown` and `keyup` events.
+
+### Example
+
+	myElement.addEvent('keydown:keys(shift+a+b)', function(){
+		alert('You pressed the following keys: shift, a and b');
+	});
+
+
+Element Event Keys
+------------------
+
+The following list is a list of the special characters you can use besides the alpha-numerical characters like a, b, 1 and 3.
+
+- enter
+- up
+- down
+- left
+- right
+- esc
+- space
+- backspace
+- tab
+- delete
+- shift
+- control
+- alt
+- capslock
+- pageup
+- pagedown
+- end
+- home
+- numlock
+- scrolllock
+- ;
+- =
+- ,
+- -
+- .
+- /
+- `
+- [
+- \
+- ]
+- '
+- +
+
+
+[Element.Event.Pseudos]: /more/Element/Element.Event.Pseudos
+[Keyboard]: /more/Interface/Keyboard

data/Packages/mootools-more/Docs/Element/Element.Event.Pseudos.md

@@ -0,0 +1,124 @@
+Element.Event.Pseudos {#Pseudos}
+================================
+
+Defines a useful pseudo event: `:once` as well as the `definePseudo` method to create your own. See also the `:relay` pseudo in [Element.Delegation][].
+
+### Demo
+
+* [Element.Event.Pseudos](http://mootools.net/demos/?demo=Element.Event.Pseudos)
+
+Pseudo: once {#Pseudos:once}
+----------------------------
+
+The event will only fire once. The once pseudo will remove itself after the first excecution.
+
+### Example:
+
+	myElement.addEvent('click:once', function(){
+		alert('you clicked me');
+	});
+
+	// If the user clicks the element twice, it will only once alert 'you clicked me'
+
+### Note:
+
+This is exactly the same as the [Events.Pseudos :once][] pseudo event.
+
+
+Pseudo: throttle {#Pseudos:throttle}
+------------------------------------
+
+Makes sure the event is not fired more than once in a certain timespan.
+This is especially useful for events that might fire a lot, like the scroll, resize
+or keydown events. To get better performance instead of executing a heavy function,
+like Request a lot of times, the event only fired once in, for example, 250 milliseconds.
+
+The default timespan is *250* milliseconds.
+
+### Example:
+
+	$('myElement').addEvent('scroll:throttle', function(){
+		// Will only fire once every 250 ms
+	});
+
+	window.addEvent('resize:throttle(400)', function(){
+		// Will only fire once every 400 ms
+	});
+
+### Note:
+
+This is exactly the same as the [Events.Pseudos :throttle][] pseudo event.
+
+
+Pseudo: pause {#Pseudos:pause}
+------------------------------
+
+The event is only fired when the original event is not fired again in the given
+time. So when the first event is fired, and a second after 100 ms, the first
+event is cancelled and only the second is fired. This is useful for example with
+field autocompletion which uses Request.
+
+The default pausetime is *250* milliseconds.
+
+### Example:
+
+	$('myElement').addEvent('keydown:pause', function(){
+		// Default time is 250 ms
+	});
+
+	$('myElement').addEvent('keydown:pause(100)', function(){
+		// The pause time is now 100 ms.
+	});
+
+
+### Note:
+
+This is exactly the same as the [Events.Pseudos :pause][] pseudo event.
+
+
+Event {#Event}
+=============
+
+Function: Event.definePseudo {#Event:Event-definePseudo}
+----------------------------------------------------------
+
+It's possible to define your own pseudos with Event.definePseudo
+
+### Syntax
+	Event.definePseudo(name, fn);
+
+### Arguments:
+1. name - (*string*) The pseudo name, for example `once` will become `click:once`
+2. fn - (*function*) The function that will get fired when the event is fired. This function should decide what will happen with the event, for example execute the event and remove the event
+
+#### Signature:
+
+	fn(split, fn, args){
+
+1. split - (*object*) a parsed object of the `event:pseudo(value)` string
+	- event - (*string*) the part before the `:`
+	- value - (*string*) between `(` and `)`
+	- pseudo - (*string*) between the `:` and `(`
+	- original - (*string*) the original event name, thus `event:pseudo(value)`
+2. fn - (*function*) This is the function that has been passed in the `addEvent` method. So it is the 'fn' in `myEvent.addEvent('event:pseudo', fn)`
+3. args - (*array*) An array with arguments. The [Event][] object is in most cases the first element.
+
+The `this` variable refers to the Element where the event is added to.
+
+### Example
+
+This is how the :once pseudo is implemented
+
+	Event.definePseudo('once', function(split, fn, args){
+		fn.apply(this, args);
+		this.removeEvent(split.original, fn);
+	});
+
+
+[Event]: /core/Types/Event
+[Element.Delegation]: /more/Element/Element.Delegation
+[Events.Pseudos :once]: /more/Class/Events.Pseudos#Pseudos:once
+[Events.Pseudos :throttle]: /more/Class/Events.Pseudos#Pseudos:throttle
+[Events.Pseudos :pause]: /more/Class/Events.Pseudos#Pseudos:pause
+
+

data/Packages/mootools-more/Docs/Element/Element.Forms.md

@@ -0,0 +1,231 @@
+Type: Element {#Element}
+==========================
+
+Extends the [Element][] Type to include methods useful in managing inputs.
+
+### Tutorial/Demo
+
+* [Online Tutorial/Demo](http://www.clientcide.com/wiki/cnet-libraries/04-element/00-element.forms)
+
+
+Element Method: tidy {#Element:tidy}
+------------------------------------
+
+Uses [String:tidy][] to clean up common special characters with their ASCII counterparts (smart quotes, elipse characters, stuff from MS Word, etc.).
+
+### Syntax
+
+	$('myInput').tidy();
+
+### Returns
+
+* (*element*) This Element.
+
+Element Method: getTextInRange {#Element:getTextInRange}
+--------------------------------------------------------
+
+Returns the text of an input within a range.
+
+### Syntax
+
+	$('myInput').getTextInRange(start, end);
+
+###	Arguments
+
+1. start - (*number*) beginning select position
+2. end - (*number*) end position
+
+### Returns
+
+* (*string*) the text in the specified range
+
+### Notes
+
+- If the range specified is out of bounds (for instance, if the text is "123" and you query for the range 2-10) the text that is found within the bounds is returned. If no text falls within the bounds, an empty string is returned.
+
+Element Method: getSelectedText {#Element:getSelectedText}
+----------------------------------------------------------
+
+Get the text selected in an input, returns a range (see [Element:getTextInRange][]).
+
+### Syntax
+
+	$('myInput').getSelectedText();
+
+### Returns
+
+* (*string*) The text that is selected
+
+### Notes
+
+- If no text is selected, an empty string is returned.
+
+Element Method: getSelectionStart {#Element:getSelectionStart}
+--------------------------------------------------------------
+
+Returns the index of start of the selected text.
+
+### Syntax
+
+	$('myInput').getSelectionStart();
+
+### Returns
+
+* (*number*) The numerical index of the start of the selection.
+
+Element Method: getSelectionEnd {#Element:getSelectionEnd}
+--------------------------------------------------------------
+
+Returns the index of end of the selected text.
+
+### Syntax
+
+	$('myInput').getSelectionEnd();
+
+### Returns
+
+* (*number*) The numerical index of the end of the selection.
+
+### Notes
+
+- If there is no selection, this value will be equal to [Element:getSelectionStart][]
+
+Element Method: getSelectedRange {#Element:getSelectedRange}
+------------------------------------------------------------
+
+Returns the range of what is selected within the element.
+
+### Syntax
+
+	$('myInput').getSelectedRange();
+
+###	Returns
+
+* (*object*) start and end values (each an *number*).
+
+###	Example return
+	{start: 2, end: 12}
+
+Element Method: setCaretPosition {#Element:setCaretPosition}
+------------------------------------------------------------
+
+Sets the caret at the given position.
+
+### Syntax
+
+	$('myInput').setCaretPosition(pos);
+
+### Arguments
+
+1. pos - (*number*) the location to place the caret OR "end" to place it at the end.
+
+### Returns
+
+* (*element*) This Element.
+
+### Example
+
+	$('myInput').setCaretPosition(3);
+	$('myInput').setCaretPosition("end");
+
+Element Method: getCaretPosition {#Element:getCaretPosition}
+------------------------------------------------------------
+
+Returns the caret position.
+
+### Syntax
+
+	$('myInput').getCaretPosition();
+
+### Returns
+
+* (*number*) The caret position.
+
+Element Method: selectRange {#Element:selectRange}
+--------------------------------------------------
+
+Selects text within a given range.
+
+### Syntax
+
+	$('myInput').selectRange(start, end);
+
+###	Arguments
+
+1. start - (*number*) starting number
+2. end - (*number*) ending number
+
+### Returns
+
+* (*element*) This Element.
+
+### Example
+
+	$('myInput').selectRange(2, 4);
+
+	<input id="test" value="012345" />
+	$('test').selectRange(2, 4); //selects "23"
+
+Element Method: insertAtCursor {#Element:insertAtCursor}
+--------------------------------------------------------
+
+Inserts a value at the cursor location; if text is selected, it replaces this text.
+
+### Syntax
+
+	$('myInput').insertAtCursor(value[, selectText]);
+
+### Arguments
+
+1. value - (*string*) value to insert.
+2. selectText - (*boolean*) selects the text after it's been inserted
+
+### Returns
+
+* (*element*) This Element.
+
+### Example
+
+	$('myInput').insertAtCursor("<br />");
+	$('myInput').insertAtCursor("type something here", true);
+
+Element Method: insertAroundCursor
+----------------------------------
+
+Inserts two strings around the selected text.
+
+### Syntax
+
+	$('myInput').insertAroundCursor(options);
+
+### Arguments
+
+1. options - (*object*) key/value set of options.
+
+### Options
+
+1. before - (*string*) the prefix to insert before the selected text
+2. after - (*string*) the suffix to insert after the selected text
+3. defaultMiddle - (*string*) value to insert between the prefix and the suffix if no text was selected (defaults to "SOMETHING HERE")
+
+### Returns
+
+* (*element*) This Element.
+
+### Example
+
+	<input id="test" value="ninjas are the most dangerous thing in the world" />
+	//let's assume that the user selects the word "ninjas"
+	$('test').insertAroundCursor({before: "<", after: ">", defaultMiddle: "tag-name"});
+	//value is now:
+	//<ninjas> are the most dangerous thing in the world
+
+
+
+[String:tidy]: /more/Types/String.Extras#String:tidy
+[Element:getTextInRange]: #Element:getTextInRange
+[Element:getSelectionStart]: #Element:getSelectionStart
+[Element]: /core/Element/Element
+[Element:get]: /core/Element/Element#Element:get
+[Element:set]: /core/Element/Element#Element:set
+[Element:erase]: /core/Element/Element#Element:erase

data/Packages/mootools-more/Docs/Element/Element.Measure.md

@@ -0,0 +1,130 @@
+Type: Element {#Element}
+==========================
+The following functions are treated as [Element][] methods.
+
+### Tutorial/Demo
+
+* [Online Tutorial/Demo](http://www.clientcide.com/wiki/cnet-libraries/04-element/01-element.measure)
+
+
+Element Method: measure {#Element:measure}
+------------------------------------------
+
+Exposes an element for measurement in a way the user cannot see and then restores it's state after the measurement.
+
+### Syntax
+
+	element.measure(fn);
+
+### Arguments
+
+1. fn - (*function*) a function to run while the element is visible (but not to the user); bound to the element by default.
+
+### Example
+
+	var size = myHiddenElement.measure(function(){
+		return this.getSize();
+	});
+
+### Returns
+
+* *mixed* - whatever the passed in function returns.
+
+### Notes
+
+* You cannot ascertain the location or size for an element whose display style is 'none'. With this method, the element is set to *display:block*, *position:absolute*, and *visibility:hidden* and then the function passed is applied. Then the element is restored to it's previous state. This allows you to safely measure the element even if it is hidden.
+* This method was authored by Daniel Steigerwald and granted use by the MIT License.
+
+
+Element Method: getDimensions {#Element:getDimensions}
+------------------------------------------------------
+
+Returns width and height for element even if the element is not visible.
+
+### Syntax
+
+	element.getDimensions([options]);
+
+### Arguments
+
+1. options - (*object*; optional) a key/value set of options
+
+### Options
+
+1. computeSize - (*boolean*) use [Element:getComputedSize][] or not; defaults to *false*
+2. styles - (*array*) see [Element:getComputedSize][]
+3. planes - (*array*) see [Element:getComputedSize][]
+
+###	Returns
+
+* (*object*) An object with .x and .y defined as numbers. If options.computeSize is true, returns all the values that [Element:getComputedSize][] returns.
+
+### Example
+
+	$('myElement').getDimensions();
+	//returns {width: #, height: #}
+	$('myElement').getDimensions(true);
+	//returns the getComputedSize object; see getComputedSize
+
+Element Method: getComputedSize {#Element:getComputedSize}
+----------------------------------------------------------
+
+Calculates the size of an element including the width, border, padding, etc.
+
+### Syntax
+
+	element.getComputedSize([options]);
+
+### Arguments
+
+1. options - (*object*) an object with key/value options
+
+### Options
+
+1. styles - (*array*) the styles to include in the calculation; defaults to ['padding','border']
+2. planes - (*object*) an object with height and width properties, each of which is an array including the edges to include in that plane. defaults to *{height: ['top','bottom'], width: ['left','right']}*
+3. mode - (*string*) limit the plane to 'vertical' or 'horizontal'; defaults to 'both'
+
+### Returns
+
+* (*object*) An object that contains dimension values (*numbers*); see list below
+
+### Dimension Values Returned
+
+* width - the actual width of the object (not including borders or padding)
+* height - the actual height of the object (not including borders or padding)
+* border-\* width - (where \* is top, right, bottom, and left) the width of the border on that edge
+* padding-\* - (where \* is top, right, bottom, and left) the width of the padding on that edge
+* computed\* - (where \* is Top, Right, Bottom, and Left; e.g. computedRight - case sensitive) the width of all the styles on that edge computed (so if options.styles remains unchanged with the default *padding* and *border*, computedRight is the sum of *border-right-width* and *padding-right*)
+* totalHeight - the total sum of the height plus all the computed styles on the top or bottom. By default this is just padding and border, but if you were to specify in the styles option margin, for instance, the totalHeight calculated would include the margin.
+* totalWidth - same as totalHeight, only using width, left, and right
+
+### Example
+
+	$(el).getComputedSize();
+
+### Returns
+
+An object with all the style properties as well as summed properties (like *totalWidth*).
+
+	{
+		'padding-top': 0,
+		'border-top-width': 1,
+		'padding-bottom': 0,
+		'border-bottom-width': 1,
+		'padding-left': 0,
+		'border-left-width': 1,
+		'padding-right': 0,
+		'border-right-width': 1,
+		'width': 100,
+		'height': 100,
+		'totalHeight': 102,
+		'computedTop': 1,
+		'computedBottom': 1,
+		'totalWidth': 102,
+		'computedLeft': 1,
+		'computedRight': 1
+	}
+
+[Element:getComputedSize]: #Element:getComputedSize
+[Element]: /core/Element/Element

data/Packages/mootools-more/Docs/Element/Element.Pin.md

@@ -0,0 +1,56 @@
+Type: Element {#Element}
+========================
+Extends the [Element][] Type to include the *pin* method useful for fixed positioning for elements.
+
+### Tutorial/Demo
+
+* [Online Tutorial/Demo](http://www.clientcide.com/wiki/cnet-libraries/04-element/03-element.pin)
+
+
+Element Method: pin {#Element:pin}
+----------------------------------
+
+Affixes an element at its current position, even if the window is scrolled.
+
+### Arguments
+
+1. pin - (*boolean*, optional) *true*: pins the element; *false*: unpins the element; defaults to *true*; See also [Element:unpin][].
+
+### Syntax
+
+	$('myElement').pin();
+
+### Returns
+
+* (*element*) This Element.
+
+Element Method: unpin {#Element:unpin}
+--------------------------------------
+
+Un-pins an element at its current position (see [Element:pin][]).
+
+### Syntax
+
+	$('myElement').unpin();
+
+
+### Returns
+
+* (*element*) This Element.
+
+Element Method: togglePin {#Element:togglepin}
+----------------------------------------------
+
+Toggles the pin state of the element.
+
+### Syntax
+
+	$('myElement').togglePin();
+
+### Returns
+
+* (*element*) This Element.
+
+[Element:unpin]: #Element:unpin
+[Element:pin]: #Element:pin
+[Element]: /core/Element/Element

data/Packages/mootools-more/Docs/Element/Element.Position.md

@@ -0,0 +1,77 @@
+Type: Element {#Element}
+==========================
+Extends the [Element][] Type with the method *position* which sets the location of an element relative to another.
+
+### Tutorial/Demo
+
+* [Online Tutorial/Demo](http://www.clientcide.com/wiki/cnet-libraries/04-element/04-element.position)
+
+
+Element Method: position {#Element:position}
+--------------------------------------------------
+
+Sets the location of an element relative to another (defaults to the document body).
+
+### Syntax
+
+	myElement.position(options);
+
+###	Arguments
+
+1. options - (*object*) a key/value object with options
+
+### Options
+
+* relativeTo - (*element*) the element relative to which to position this one; defaults to *document.body*.
+* position - (*string* OR *object*) the aspect of the relativeTo element that this element should be positioned. See position section below.
+* edge - (*string* OR *object*) the edge of the element to set relative to the relative element's corner; this way you can specify to position this element's upper right corner to the bottom left corner of the relative element. This is optional; the default behavior positions the element's upper left corner to the relative element unless position == center, in which case it positions the center of the element to the center of the relative element. See position section below.
+* offset - (*object*) x/y coordinates for the offset (i.e. {x: 10, y:100} will move it down 100 and to the right 10). Negative values are allowed.
+* returnPos - (*boolean*) don't move the element, but instead just return the position object ({top: '#', left: '#'}); defaults to *false*
+* relFixedPosition - (*boolean*) *true*: adds the scroll position of the window to the location to account for a fixed position relativeTo item; defaults to *false*
+* ignoreMargins - (*boolean*) you can have the position calculate the offsets added margins if you like; defaults to *false*. If *true*, the corner of the element will be used EXCLUDING the margin.
+* ignoreScroll - (*boolean*) if *true*, the scroll offset of the parent is ignored. defaults to *false*.
+* allowNegative - (*boolean*) if *true* (the default), AND the element is not a descendent of an element that is positioned (relative or absolute), then the position will not allow negative values.
+* minimum - (*object*) *x* and *y* values (*number*) for hard minimum limits on the position. Unlike allowNegative, these are not conditional; if you give zero values for the x/y values, they will be obeyed regardless of any other setting.
+* maximum - (*object*) *x* and *y* values (*number*) for hard maximum limits on the position.
+
+### Position & Edge Options
+
+There are two ways to specify the position: strings and objects. The strings are combinations of "left", "right", and "center" with "top" (or "upper"), "bottom", and "center". These are case insensitive. These translate to:
+
+* upperLeft, topLeft (same thing) - or upperleft, leftupper, LEFTUPPER etc.
+* bottomLeft
+* centerLeft
+* upperRight, topRight (same thing)
+* bottomRight
+* centerRight
+* centerTop
+* centerBottom
+* center
+
+Alternatively, you can be a little more expicit by using an object with x and y values. Acceptable values for the x axis are "left", "right", and "center", and for y you can use "top", "bottom" and "center".
+
+* {x: 'left', y: 'top'} // same as "upperLeft" or "topLeft"
+* {x: 'left', y: 'bottom'} // same as "bottomLeft"
+* etc.
+
+Using these options you can specify a position for each corner of the relativeTo object as well as the points between those corners (center, left, top, right, bottom and the center of the entire object).
+
+### Returns
+
+* (*element* or *object*) This Element *unless* the option *returnPos* is set to true, in which case an object is returned with top and left values that can be passed to *Element.setStyle* (example: ({top: '200px', left: '100px'})).
+
+### Example
+
+	$('myElement').position(); //centered to the middle of the window
+	$('myElement').position({relativeTo: 'myDiv'}); //element is in the center of myDiv
+	$('myElement').position({
+		relativeTo: $('myDiv'),
+		position: 'upperLeft',
+		edge: 'upperRight'
+	}); //myElement's upper right corner is against myDiv's upper left corner
+
+### Notes
+
+* The element must be absolutely positioned (if it isn't, this method will set it to be).
+
+[Element]: /core/Element/Element