Merge pull request #33 from XAOPT/master

Scale relative to center
gthmb · Sep 4, 2015 · a6fa00f · a6fa00f
2 parents b6fef23 + ba88ab2
commit a6fa00f
Show file tree

Hide file tree

Showing 6 changed files with 10,417 additions and 9,417 deletions.
diff --git a/README.md b/README.md
@@ -6,15 +6,15 @@ Provides simple controls that allows you to move/rotate/scale a div. Kind of lik
 [example page](http://jsfiddle.net/66Bna/293/)
 
 Dependencies:
-  - jQuery - tested with 1.7.2
+  - jQuery - tested with 1.11.2
   - [Matrix.js](https://github.com/STRd6/matrix.js "awesome and simple Matrix lib from STRd6") - awesome and simple Matrix lib from STRd6
 
 TODOs:
   - handle control placement for negative scaling
 
 ### API
 
-The `$.freetrans()` method is used for all access to the plugin. 
+The `$.freetrans()` method is used for all access to the plugin.
 
 ##### Initialization
 When called without any parameters, the plugin will be initiailized for the selector(s)
@@ -122,7 +122,7 @@ You can retrieve the bounding box of the transformed selector by passing `'getBo
 	var b = $('mydiv').freetrans('getBounds');
 	console.log(b.xmin, b.ymax, b.height, b.center.x);
 
-##### Getting the current options 
+##### Getting the current options
 
 You can retrieve the current options of the transformed selector by passing
 `'getOptions'` which is useful for persistence. This method is only available for single selectors, not groups. It returns an object with the bounds information. This method is not chainable.
@@ -131,7 +131,7 @@ You can retrieve the current options of the transformed selector by passing
 	console.log(o.angle, o.maintainAspectRatio, o['rot-origin'], o.scaleLimit, o.scalex, o.scaley, o.x, o.y);
 
 ##### Destroying the plugin
-If you want to remove the freetrans functionality from a selector, you can pass `'destroy'`. It will unbind any events, and destroy the `$.data('freetrans')` object. 
+If you want to remove the freetrans functionality from a selector, you can pass `'destroy'`. It will unbind any events, and destroy the `$.data('freetrans')` object.
 
 	// destroy plugin for mydiv
 	$('mydiv').freetrans('destroy');
@@ -144,6 +144,10 @@ While scaling, holding down the Shift key will maintain the aspect ratio of the
 
 While rotating, the Shift key causes the rotation to snap to 15 degree increments.
 
+##### The ALT key
+
+While scaling, holding down the Alt key will scale div relative to its center.
+
 ##### Chainability
 
 This plugin keeps chainability in tact. Chain away!

diff --git a/css/jquery.freetrans.css b/css/jquery.freetrans.css
@@ -52,4 +52,8 @@
     width: 16px;
     height: 16px;
     background-image: url('./rotate_ccw.png');
+}
+
+.ft-scaler-mid.ft-scaler-center {
+    visibility: hidden;
 }
diff --git a/example/index.html b/example/index.html
@@ -1,7 +1,7 @@
 <html>
 	<head>
 		<link rel="stylesheet" href="../css/jquery.freetrans.css">
-		
+
 		<style>
 			body{
 				user-select: none;
@@ -23,8 +23,8 @@
 				border: 1px solid red;
 			}
 		</style>
-		
-		<script src="../js/jquery-1.7.2.js"></script>
+
+		<script src="../js/jquery-1.11.2.js"></script>
 		<script src="../js/Matrix.js"></script>
 		<script src="../js/jquery.freetrans.js"></script>
 	</head>
@@ -37,16 +37,16 @@
 		$(function(){
 			// do a selector group
 			$('.trans').freetrans({
-				x: 50, 
+				x: 50,
 				y: 50
 			});
-			
+
 			//updating options, chainable
 			$('#two').freetrans({
-				x: 200, 
-				y: 100, 
+				x: 200,
+				y: 100,
 				angle: 45,
-				'rot-origin': "50% 100%"  
+				'rot-origin': "50% 100%"
 			})
 			.css({border: "1px solid pink"})