solving the issue of sorting (issue btford#18)

shootermv · Dec 12, 2013 · 5940b04 · 5940b04
1 parent 7c24ca8
commit 5940b04
Show file tree

Hide file tree

Showing 2 changed files with 55 additions and 5 deletions.
diff --git a/dragon-drop.js b/dragon-drop.js
@@ -62,9 +62,18 @@ angular.module('btford.dragon-drop', []).
       }
     };
 
-    var add = function (collection, item, key) {
+    var add = function (collection, item, key, orderBy) {
       if (collection instanceof Array) {
         collection.push(item);
+		/*sorting support*/		
+		if(orderBy){		 
+
+		   collection = collection.sort(function(a, b){
+				a = parseInt(a[orderBy]);
+				b = parseInt(b[orderBy]);
+				return a - b;
+		   })		   
+		 }	
       } else {
         collection[key] = item;
       }
@@ -146,17 +155,23 @@ angular.module('btford.dragon-drop', []).
       if (dropArea.length > 0) {
         var expression = dropArea.attr('btf-dragon');
         var targetScope = dropArea.scope();
-        var match = expression.match(/^\s*(.+)\s+in\s+(.*?)\s*$/);
+        //added "(?:\s+\|\s+(.*))?" for support orderBy
+        var match = expression.match(/^\s*(.+)\s+in\s+(.*?)\s*(?:\s+\|\s+(.*))?$/);
 
+
+
         var targetList = targetScope.$eval(match[2]);
+		var orderBy;
+		if(match[3]){orderBy = match[3].split(':')[1];}
+
         targetScope.$apply(function () {
-          add(targetList, dragValue, dragKey);
+          add(targetList, dragValue, dragKey, orderBy);
         });
       } else if (!dragDuplicate) {
         // no dropArea here
         // put item back to origin
         $rootScope.$apply(function () {
-          add(dragOrigin, dragValue, dragKey);
+          add(dragOrigin, dragValue, dragKey, orderBy);
         });
       }
 
@@ -278,4 +293,4 @@ angular.module('btford.dragon-drop', []).
         };
       }
     };
-  });
+  });
diff --git a/example.html b/example.html
@@ -8,6 +8,9 @@
       padding: 20px;
       border: 1px solid red;
     }
+	[btf-dragon].sortable span{
+		display:block;
+	}
   </style>
 </head>
 <body ng-app="ExampleApp">
@@ -44,6 +47,35 @@ <h3>Other Things</h3>
       </div>
     </div>
 
+	<h3>Sorting Support:</h3>
+	 <div style="border:2px solid blue"></div>
+
+
+
+
+    <div class="row">
+      <div class="span6">
+        <h3>sortableThings</h3>
+        <div class="sortable" btf-dragon="thing in sortablethings | orderBy :'id'">{{thing.name}}</div>
+      </div>
+      <div class="span6">
+        <h3>Other Things</h3>
+        <div class="sortable" btf-dragon="thing in sortableotherThings | orderBy :'id'">{{thing.name}}</div>
+      </div>
+    </div>
+
+    <hr>
+
+    <div class="row">
+      <div class="span6">
+        <h3>sortableThings</h3>
+        <pre>{{sortablethings | json}}</pre>
+      </div>
+      <div class="span6">
+        <h3>Other Things</h3>
+        <pre>{{sortableotherThings | json}}</pre>
+      </div>
+    </div>	 
   </div>
 
   <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
@@ -53,6 +85,9 @@ <h3>Other Things</h3>
       controller('MainCtrl', function ($scope) {
         $scope.things = ['one', 'two', 'three'];
         $scope.otherThings = [];
+
+		$scope.sortablethings = [{name:'one',id:3}, {name:'two',id:2}, {name:'three',id:1}];
+        $scope.sortableotherThings = [];
       });
   </script>
 </body>