Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP

Loading…

Adding a ratio option to Drag class #1169

Open
wants to merge 2 commits into from

2 participants

@challet

These changes will add an option ratio to the Drag class :
if set, it will add a constraint during drag, linking the x and y properties together.
It is designed to always lower one of the properties, in order to stick to the limit option.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
This page is out of date. Refresh to see the latest.
Showing with 11 additions and 1 deletion.
  1. +1 −0  Docs/Drag/Drag.md
  2. +10 −1 Source/Drag/Drag.js
View
1  Docs/Drag/Drag.md
@@ -26,6 +26,7 @@ Drag Method: constructor
* handle - (*element*: defaults to the element passed in) The Element to act as the handle for the draggable element.
* invert - (*boolean*: defaults to false) Whether or not to invert the values reported on start and drag.
* limit - (*object*: defaults to false) An object with an x and a y property, both an array containing the minimum and maximum limit of movement of the Element.
+* ratio - (*number*: defaults to false) Add a ratio constraint between x and y properties (ratio = x / y).
* modifiers - (*object*: defaults to {'x': 'left', 'y': 'top'}) An object with x and y properties used to indicate the CSS modifiers (i.e. 'left').
* snap - (*number*: defaults to 6) The distance to drag before the Element starts to respond to the drag.
* style - (*boolean*: defaults to true) Whether or not to set the modifier as a style property of the element.
View
11 Source/Drag/Drag.js
@@ -43,6 +43,7 @@ var Drag = new Class({
grid: false,
style: true,
limit: false,
+ ratio: false,
handle: false,
invert: false,
preventDefault: false,
@@ -182,7 +183,15 @@ var Drag = new Class({
this.value.now[z] = this.limit[z][0];
}
}
-
+
+ if(options.ratio) {
+ if(this.value.now.x / this.value.now.y < options.ratio) {
+ this.value.now.y = this.value.now.x / options.ratio;
+ } else {
+ this.value.now.x = options.ratio * this.value.now.y;
+ }
+ }
+
if (options.grid[z]) this.value.now[z] -= ((this.value.now[z] - (this.limit[z][0]||0)) % options.grid[z]);
if (options.style) this.element.setStyle(options.modifiers[z], this.value.now[z] + options.unit);
Something went wrong with that request. Please try again.