lsd_rails 0.1

data/Packages/mootools-more/Docs/Drag/Slider.md

@@ -0,0 +1,249 @@
+Class: Slider {#Slider}
+=======================
+
+Creates a slider with two elements: a knob and a container.
+
+### Demo
+
+- [Slider](http://mootools.net/demos/?demo=Slider)
+
+### Note
+
+- Slider requires the page to be in [Standards Mode](http://hsivonen.iki.fi/doctype/).
+
+Slider Method: constructor
+--------------------------
+
+### Syntax
+
+	var mySlider = new Slider(element, knob[, options]);
+
+### Arguments
+
+1. element - (*element*) The container element for the slider.
+2. knob    - (*element*) The handle element for the slider.
+3. options - (*object*) An optional object for customizing the Slider.
+
+### Options
+
+1. snap   - (*boolean*: defaults to false) True if you want the knob to snap to the nearest value.
+2. offset - (*number*: defaults to 0) Relative offset for knob position at start.
+3. range  - (*mixed*: defaults to false) Array of numbers or false. The minimum and maximum limits values the slider will use.
+4. wheel  - (*boolean*: defaults to false) True if you want the ability to move the knob by mousewheeling.
+5. steps  - (*number*: defaults to 100) The number of steps the Slider should move/tick.
+6. mode   - (*string*: defaults to horizontal) The type of Slider can be either 'horizontal' or 'vertical' in movement.
+6. initialStep   - (*number*: defaults to 0) The step the slider will start at.
+
+### Events
+
+#### change
+
+Fires when the Slider's value changes.
+
+##### Signature
+
+	onChange(step)
+
+##### Arguments
+
+1. step - (*number*) The current step that the Slider is on.
+
+
+#### onComplete
+
+Fire when you're done dragging.
+
+##### Signature
+
+	onComplete(step)
+
+##### Arguments
+
+1. step - (*string*) The current step that the Slider is on as a string.
+
+
+#### tick
+
+Fires when the user scrolls or when the container element is clicked. This Event can be overridden to alter the default tick behavior.
+
+##### Signature
+
+	onTick(pos)
+
+##### Arguments
+
+1. pos - (*number*) The current position that slider moved to.
+
+##### Notes
+
+- By default Slider uses the 'tick' event to set the style of the knob to a new position.
+
+
+### Returns
+
+* (*object*) A new Slider instance.
+
+### Examples
+
+	var mySlider = new Slider('myElement', 'myKnob', {
+		range: [-50, 50],
+		wheel: true,
+		snap: true,
+		onTick: function(pos){
+			this.element.setStyle('border-color', '#f00');
+			this.knob.setStyle(this.property, pos);
+		},
+		onComplete: function(){
+			this.element.tween('border').start('#000');
+		}
+	});
+
+
+### Notes
+
+- Range option allows an array of numbers. Numbers can be negative and positive.
+- If snap is enabled, the width of the bar in which the slider resides must fit an equation for the steps to line up just right at it's end value. The equation is:
+
+		(Math.ceil(barWidth/numSteps - knobWidth/numSteps) * numSteps) + knobWidth
+
+For instance, if you had a bar that is 300px wide and a knob that is 15px wide, and have snap enabled and 10 steps specified, then the bar's width divided by the number of steps (300 / 10 = 30) minus room for the knob (15 / 10 = 1.5) gives you the value of each step (28.5). Slider must round this value, and it rounds up (29). Take this and multiply times the number of steps and you get 290, but there must also be room for the knob, which adds 15, yielding 305. The result is that our knob can't be dragged to the 10th position because there isn't room for it; so it stops at the 9th. This takes a little tweaking in your css. Just add a few pixels until you can drag it all the way (or change the knob width).
+
+
+Slider Method: set {#Slider:set}
+--------------------------------
+
+The slider will move to the passed position.
+
+### Syntax
+
+	mySlider.set(step);
+
+### Arguments
+
+1. step - (*number*) A number to position the Slider to.
+
+### Returns
+
+* (*object*) This Slider instance.
+
+### Examples
+
+	var mySlider = new Slider('myElement', 'myKnob');
+	mySlider.set(0);
+
+	var myPeriodical = (function(){
+		if (this.step == this.options.steps) $clear(myPeriodical);
+			this.set(this.step++);
+	}).periodical(1000, mySlider);
+
+### Notes
+
+- Step will automatically be limited between 0 and the optional steps value.
+
+
+
+Slider Method: attach {#Slider:attach}
+--------------------------------------
+
+Attaches the mouse listeners to the Slider making the Slider draggable
+
+### Syntax
+
+	mySlider.attach();
+
+### Returns
+
+* (*object*) This Slider instance.
+
+### Examples
+
+	var mySlider = new Slider('myElement', 'myKnob');
+	mySlider.detach();
+	myElement.addEvent('click', function(){
+		mySlider.attach();
+		alert('Slider enabled!');
+	});
+
+### Notes
+
+- You only need to use this method when you manually detached the mouse listeners before.
+
+### See Also
+
+- [Slider:detach](#Slider:detach), [Element:addEvent][]
+
+
+
+Slider Method: detach {#Slider:detach}
+--------------------------------------
+
+Detaches the mouse listeners from the Slider so its value can't be changed any longer
+
+### Syntax
+
+	mySlider.detach();
+
+### Returns
+
+* (*object*) This Slider instance.
+
+### Examples
+
+	var mySlider = new Slider('myElement', 'myKnob');
+	myElement.addEvent('click', function(){
+		mySlider.detach();
+		alert('Slider disabled!');
+	});
+
+### See Also
+
+- [Slider:attach](#Slider:attach), [Element:removeEvent][]
+
+Slider Method: setRange {#Slider:setRange}
+------------------------------------------
+
+Dynamically sets the range for the slider.
+
+### Syntax
+
+	mySlider.setRange(range);
+
+### Arguments
+
+1. range - (*array*) Same as the `range` option array.
+
+### Returns
+
+* (*object*) This Slider instance.
+
+### Examples
+
+	var mySlider = new Slider('myElement', 'myKnob',{
+		range: [100, 1000]
+	});
+	mySlider.setRange([500, 5000]);
+
+### Notes
+
+- If the current step is now out of the new range it will automatically adjust.
+
+Slider Method: autosize {#Slider:autosize}
+------------------------------------------
+
+Cause the slider to recalculate the allotted drag area for itself (useful if resizing slider).
+
+### Syntax
+
+	mySlider.autosize();
+
+### Returns
+
+* (*object*) This Slider instance.
+
+### Examples
+
+	var mySlider = new Slider('myElement', 'myKnob');
+	window.addEvent('resize', function(){
+		mySlider.autosize();
+	});
+

data/Packages/mootools-more/Docs/Drag/Sortables.md

@@ -0,0 +1,287 @@
+Class: Sortables {#Sortables}
+=============================
+
+Creates an interface for drag and drop sorting of a list or lists.
+
+### Demo
+
+* [Sortables](http://mootools.net/demos/?demo=Sortables)
+
+
+Sortables Method: constructor
+-----------------------------
+
+
+### Syntax:
+
+	new Sortables(list[, options]);
+
+### Arguments:
+
+1. list - (*mixed*) required, the list or lists that will become sortable.
+ * This argument can be an [Element][], an array of [Elements][], or a selector. When a single list (or id) is passed, that list will be sortable only with itself.
+ * To enable sorting between lists, one or more lists or id's must be passed using an array or a selector. See Examples below.
+2. options - (*object*) See options and events below.
+
+### Options:
+
+* clone - (*mixed*: defaults to *false*) Whether or not to display a copy of the actual element under the cursor while dragging. May also be used as a function which will return an element to be used as the clone.  The function will receive the mousedown event, the element, and the list as arguments.
+* handle - (*string*: defaults to *false*) A selector to select an element inside each sortable item to be used as the handle for sorting that item.  If no match is found, the element is used as its own handle.
+* opacity - (*number*: defaults to *1*) Opacity of the place holding element
+* revert - (*mixed*: defaults to *false*) Whether or not to use an effect to slide the element into its final location after sorting. If you pass an object it will be used as additional options for the revert effect.
+* dragOptions - (*object*; defaults to *{}*) The options to apply internally to sortable's [Drag.Move][] instances.
+
+### Events:
+
+#### start
+
+Fired when the item starts dragging.
+
+##### Signature:
+
+	onStart(element, clone)
+
+##### Arguments:
+
+1. element - (*element*) The Element being sorted.
+2. clone - (*element*) The clone of the Element.
+
+#### sort
+
+Fired when the item is inserted into a new place in one of the lists.
+
+##### Signature:
+
+	onSort(element, clone)
+
+##### Arguments:
+
+1. element - (*element*) The Element being sorted.
+2. clone - (*element*) The clone of the Element.
+
+#### complete
+
+Fired when the item ends dragging. Note: fires even if the sort has not changed.
+
+##### Signature:
+
+	onComplete(element)
+
+##### Arguments:
+
+1. element - (*element*) The Element being sorted.
+
+### Examples:
+
+	var mySortables = new Sortables('list-1', {
+		revert: { duration: 500, transition: 'elastic:out' }
+	});
+	//creates a new Sortable instance over the list with id 'list-1' with some
+	//extra options for the revert effect
+
+	var mySortables = new Sortables('#list-1, #list-2', {
+		constrain: true,
+		clone: false,
+		revert: true
+	});
+	//creates a new Sortable instance allowing the sorting of the lists with
+	//ids 'list-1' and 'list-2' with extra options since constrain was set to
+	//true, the items will not be able to be dragged from one list to the other
+
+	var mySortables = new Sortables('#list-1, #list-2, #list-3');
+	//creates a new Sortable instance allowing sorting between the lists with
+	//ids 'list-1', 'list-2, and 'list-3'
+
+Sortables Method: attach {#Sortables:attach}
+--------------------------------------------
+
+Attaches the mouse listener to all the handles, enabling sorting.
+
+### Syntax:
+
+	mySortables.attach();
+
+### Returns:
+
+* (*object*) This Sortables instance.
+
+Sortables Method: detach {#Sortables:detach}
+--------------------------------------------
+
+Detaches the mouse listener from all the handles, disabling sorting.
+
+### Syntax:
+
+	mySortables.detach();
+
+### Returns:
+
+* (*object*) This Sortables instance.
+
+Sortables Method: addItems {#Sortables:addItems}
+------------------------------------------------
+
+Allows one or more items to be added to an existing Sortables instance.
+
+### Syntax:
+
+	mySortables.addItems(item1[, item2[, item3[, ...]]]);
+
+### Arguments:
+
+1. items - (*mixed*) Since Array.flatten is used on the arguments, a single element, several elements, an array of elements, or any combination thereof may be passed to this method.
+
+### Returns:
+
+* (*object*) This Sortables instance.
+
+### Examples:
+
+	var mySortables = new Sortables('#list1, #list2');
+
+	var element1 = new Element('div');
+	var element2 = new Element('div');
+	var element3 = new Element('div');
+
+	$('list1').adopt(element1);
+	$('list2').adopt(element2, element3);
+	mySortables.addItems(element1, element2, element3);
+
+### Notes:
+
+- The items will not be injected into the list automatically as the sortable instance could have many lists.
+- First inject the elements into the proper list, then call addItems on them.
+
+### See Also:
+
+- [Sortables:removeItems](#Sortables:removeItems), [Sortables:addLists](#Sortables:addLists)
+
+Sortables Method: removeItems {#Sortables:removeItems}
+------------------------------------------------------
+
+Allows one or more items to be removed from an existing Sortables instance.
+
+### Syntax:
+
+	mySortables.removeItems(item1[, item2[, item3[, ...]]]);
+
+### Arguments:
+
+1. items - (*mixed*) Since Array.flatten is used on the arguments, a single element, several elements, an array of elements, or any combination thereof may be passed to this method.
+
+### Returns:
+
+* (*Elements*) An Elements collection of all the elements that were removed.
+
+### Examples:
+
+	var mySortables = new Sortables('#list1, #list2');
+
+	var element1 = $('list1').getFirst();
+	var element2 = $('list2').getLast();
+
+	mySortables.removeItems(element1, element2).destroy(); //the elements will be removed and destroyed
+
+### Notes:
+
+- The items will not be removed from the list automatically, they will just no longer be sortable.
+- First call removeItems on the items, and then remove them from their list containers, or destroy them.
+
+### See Also:
+
+- [Sortables:addItems](#Sortables:addItems), [Sortables:removeLists](#Sortables:removeLists)
+
+Sortables Method: addLists {#Sortables:addLists}
+------------------------------------------------
+
+Allows one or more entire lists to be added to an existing Sortables instance, allowing sorting between the new and old lists.
+
+### Syntax:
+
+	mySortables.addLists(list1[, list2[, list3[, ...]]]);
+
+### Arguments:
+
+1. lists - (*mixed*) Since Array.flatten is used on the arguments, a single element, several elements, an array of elements, or any combination thereof may be passed to this method.
+
+### Returns:
+
+* (*object*) This Sortables instance.
+
+### Examples:
+
+	var mySortables = new Sortables('list1');
+	mySortables.addLists($('list2'));
+
+### Notes:
+
+- More complicated usage of this method will allow you to do things like one-directional sorting.
+
+### See Also:
+
+- [Sortables:removeLists](#Sortables:removeLists), [Sortables:addItems](#Sortables:addItems)
+
+Sortables Method: removeLists {#Sortables:removeLists}
+------------------------------------------------------
+
+Allows one or more entire lists to be removed from an existing Sortables instance, preventing sorting between the lists.
+
+### Syntax:
+
+	mySortables.removeLists(list1[, list2[, list3[, ...]]]);
+
+### Arguments:
+
+1. lists - (*mixed*) Since Array.flatten is used on the arguments, a single element, several elements, an array of elements, or any combination thereof may be passed to this method.
+
+### Returns:
+
+* (*Elements*) An Elements collection of all the lists that were removed.
+
+### Examples:
+
+	var mySortables = new Sortables('#list1, #list2');
+	mySortables.removeLists($('list2'));
+
+### See Also:
+
+- [Sortables:addLists](#Sortables:addLists), [Sortables:removeItems](#Sortables:removeItems)
+
+Sortables Method: serialize {#Sortables:serialize}
+--------------------------------------------------
+
+Function to get the order of the elements in the lists of this sortables instance.
+For each list, an array containing the order of the elements will be returned.
+If more than one list is being used, all lists will be serialized and returned in an array.
+
+### Syntax:
+
+	mySortables.serialize(index[, modifier]);
+
+### Arguments:
+
+1. index    - (*mixed*, optional) An integer or boolean false. index of the list to serialize. Omit or pass false to serialize all lists.
+2. modifier - (*function*, optional) A function to override the default output of the sortables.  See Examples below
+
+### Examples:
+
+	mySortables.serialize(1);
+	//returns the second list serialized (remember, arrays are 0 based...);
+	//['item_1-1', 'item_1-2', 'item_1-3']
+
+	mySortables.serialize();
+	//returns a nested array of all lists serialized, or if only one list exists, that lists order
+	/*[['item_1-1', 'item_1-2', 'item_1-3'],
+	  ['item_2-1', 'item_2-2', 'item_2-3'],
+	  ['item_3-1', 'item_3-2', 'item_3-3']]*/
+
+	mySortables.serialize(2, function(element, index){
+		return element.getProperty('id').replace('item_','') + '=' + index;
+	}).join('&');
+	//joins the array with a '&' to return a string of the formatted ids of all the elmements in list 3,with their position
+	//'3-0=0&3-1=1&3-2=2'
+
+
+[Drag.Move]: /more/Drag/Drag.Move
+[Element]: /core/Elements/Element
+[Elements]: /core/Element/Element#Elements

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

@@ -0,0 +1,120 @@
+Type: Element {#Element}
+========================
+
+Extends the [Element][] type to include delegations in the addEvent and addEvents methods. It adds the `:relay` pseudo using [Element.Event.Pseudos][].
+
+### Demo
+
+* [Element.Delegation](http://mootools.net/demos/?demo=Element.Delegation)
+
+### Notes
+
+* By delegating events to parent objects you can dramatically increase the efficiency of your pages. Consider the example above. You could attach events to every link on a page - which may be hundreds of DOM elements - or you can delegate the event to the document body, evaluating your code only when the user actually clicks a link (instead of on page load/domready).
+* You can use any selector in combination with any event
+* Be wary of the cost of delegation; for example, mouseover/mouseout delegation on an entire document can cause your page to run the selector constantly as the user moves his or her mouse around the page. Delegation is not always the best solution.
+* Delegation is especially useful if you are using AJAX to load content into your pages dynamically, as the contents of an element can change with new elements added or others removed and your delegated events need not change.
+* In general it is always better to delegate to the closest parent to your elements as possible; delegate to an element in the page rather than the document body for example.
+
+### Credits
+
+Event checking based on the work of [Daniel Steigerwald](http://daniel.steigerwald.cz).
+
+Element method: addEvent {#Element:addEvent}
+--------------------------------------------
+
+Delegates the methods of an element's children to the parent element for greater efficiency when a filter is provided. Otherwise works normally as [addEvent][] always does.
+
+### Syntax
+
+	myElement.addEvent(typeSelector, fn);
+
+### Arguments
+
+2. typeSelector - (*string*) An event name (click, mouseover, etc) that should be monitored paired with a selector (see example) to limit functionality to child elements.
+3. fn - (*function*) The callback to execute when the event occurs (passed the event just like any other [addEvent][] usage and a second argument, the element that matches your selector that was clicked).
+
+
+### Example
+
+	// Alerts when an anchor element is clicked with class myStyle in myElement
+	document.id(myElement).addEvent('click:relay(a.myStyle)', function(){
+		alert('hello');
+	});
+
+
+	$(element).addEvent('click:relay(a)', function(event, clicked){
+		event.preventDefault(); //don't follow the link
+		alert('you clicked a link!');
+		//you can reference the element clicked with the second
+		//argument passed to your callback
+		clicked.setStyle('color', '#777');
+	});
+
+### Returns
+
+* *element* - This element.
+
+Element method: addEvents {#Element:addEvents}
+----------------------------------------------
+
+Delegates the events to the parent just as with addEvent above. Works as [addEvents][] does.
+
+### Example
+
+	myElement.addEvents({
+		//monitor an element for mouseover
+		mouseover: fn,
+		//but only monitor child links for click
+		'click:relay(a)': fn2
+	});
+
+
+Element method: removeEvent {#Element:removeEvent}
+--------------------------------------------------
+
+Removes a method from an element as [removeEvent][] always does.
+
+### Example
+
+	var monitor = function(event, element){ alert('you clicked a link!')};
+	$(element).addEvent('click:relay(a)', monitor);
+	//link clicks are delegated to element
+
+	//...now we remove the delegation:
+	$(element).removeEvent('click:relay(a)', monitor);
+
+
+Element method: removeEvents {#Element:removeEvents}
+---------------------------------------------------
+
+Removes a series of methods from delegation if the functions were used for delegation or else works as [removeEvents][] always does.
+
+### Example
+
+	var monitor = function(){
+		alert('you clicked or moused over a link!');
+	};
+
+	$(element).addEvents({
+		'mouseover:relay(a)': monitor,
+		'click:relay(a)': monitor
+	});
+
+	// link clicks are delegated to element
+	// ...now we remove the delegation:
+	$(element).removeEvents({
+		'mouseover:relay(a)': monitor,
+		'click:relay(a)': monitor
+	});
+
+	//or we could remove all click:relay(a) events
+	$(element).removeEvents('click:relay(a)');
+
+
+
+[Element]: /core/Element/Element
+[addEvent]: /core/Element/Element.Event#Element:addEvent
+[addEvents]: /core/Element/Element.Event#Element:addEvents
+[removeEvent]: /core/Element/Element.Event#Element:removeEvent
+[removeEvents]: /core/Element/Element.Event#Element:removeEvents
+[Element.Event.Pseudos]: /more/Element/Element.Event.Pseudos