From debc5be8e10fbd105fedfbed6702e5ed1de49e93 Mon Sep 17 00:00:00 2001
From: Julian_Chu <walkingice@0xlab.org>
Date: Mon, 21 Jul 2014 00:26:22 +0800
Subject: [PATCH 1/3] demo: apply responsive design to demo page

Since already use bootstrap to demo page, we could layout components
by boostrap classes to instead of using hard-coded width.
---
 demo/demo.css  | 21 +++++++++------------
 demo/demo.html | 10 +++++-----
 2 files changed, 14 insertions(+), 17 deletions(-)

diff --git a/demo/demo.css b/demo/demo.css
index 95cc741..c0ad799 100644
--- a/demo/demo.css
+++ b/demo/demo.css
@@ -1,10 +1,17 @@
+.section {
+	margin-top: 30px;
+	margin-bottom: 30px;
+}
+
 .list {
+	border: 1px solid #000;
+	border-radius: 15px;
 	list-style: none outside none;
-	margin: 10px 0 30px;
+	margin: 10px;
+	padding: 10px;
 }
 
 .item {
-	width: 200px;
 	padding: 5px 10px;
 	margin: 5px 0;
 	border: 2px solid #444;
@@ -21,22 +28,12 @@
 /***  Extra ***/
 
 .logList {
-	margin-top: 20px;
-	width: 250px;
 	min-height: 200px;
-	padding: 5px 15px;
 	border: 5px solid #000;
 	border-radius: 15px;
 }
 
 .logList:before {
-	content: 'log';
-	padding: 0 5px;
-	position: relative;
-	top: -1.1em;
 	background-color: #FFF;
 }
 
-ul[ui-sortable] {
-	float: right;
-}
diff --git a/demo/demo.html b/demo/demo.html
index ab85984..3ba03fe 100644
--- a/demo/demo.html
+++ b/demo/demo.html
@@ -1,14 +1,14 @@
-<section ng-app="sortableApp" ng-controller="sortableController">
-  <div class="row">
-    <div class="col-md-6">
+<section ng-app="sortableApp">
+  <div ng-controller="sortableController" class="section row">
+    <div class="col-sm-offset-2 col-sm-4">
       <ul ui-sortable="sortableOptions" ng-model="list" class="list">
         <li ng-repeat="item in list" class="item">{{item.text}}</li>
       </ul>
     </div>
-    <div class="col-md-6">
+    <div class="col-sm-4">
       <ul class="list logList">
         <li ng-repeat="entry in sortingLog" class="logItem">{{entry.Text}}</li>
       </ul>
     </div>
   </div>
-</section>
\ No newline at end of file
+</section>

From ca522690f93709c005b680245ddd96e025698309 Mon Sep 17 00:00:00 2001
From: Julian_Chu <walkingice@0xlab.org>
Date: Mon, 21 Jul 2014 00:42:09 +0800
Subject: [PATCH 2/3] demo: add case of connected list

connected list is also a good feature of ui-sortable.
add one more case to demo.
---
 demo/demo.html | 15 +++++++++++++++
 demo/demo.js   | 22 +++++++++++++++++++++-
 2 files changed, 36 insertions(+), 1 deletion(-)

diff --git a/demo/demo.html b/demo/demo.html
index 3ba03fe..03690e0 100644
--- a/demo/demo.html
+++ b/demo/demo.html
@@ -1,4 +1,5 @@
 <section ng-app="sortableApp">
+  <h1>Sortable items</h1>
   <div ng-controller="sortableController" class="section row">
     <div class="col-sm-offset-2 col-sm-4">
       <ul ui-sortable="sortableOptions" ng-model="list" class="list">
@@ -11,4 +12,18 @@
       </ul>
     </div>
   </div>
+
+  <h1>Connected items</h1>
+  <div ng-controller="connectedController" class="section row">
+    <div class="col-sm-offset-2 col-sm-4">
+      <ul ui-sortable="sortableOptions" ng-model="leftArray" class="list">
+        <li ng-repeat="item in leftArray" class="item">{{item.text}}</li>
+      </ul>
+    </div>
+    <div class="col-sm-4">
+      <ul ui-sortable="sortableOptions" ng-model="rightArray" class="list">
+        <li ng-repeat="item in rightArray" class="item">{{item.text}}</li>
+      </ul>
+    </div>
+  </div>
 </section>
diff --git a/demo/demo.js b/demo/demo.js
index 2a54125..b5fd132 100644
--- a/demo/demo.js
+++ b/demo/demo.js
@@ -28,4 +28,24 @@ myapp.controller('sortableController', function ($scope) {
       $scope.sortingLog.push(logEntry);
     }
   };
-});
\ No newline at end of file
+});
+
+myapp.controller('connectedController', function ($scope) {
+  function buildArray(name, size) {
+      var i, array = [];
+      for (i = 1; i <= size; i = i + 1){
+        array.push({
+          text: name + ' ' + i ,
+          value: i
+        });
+      }
+
+      return array;
+    }
+
+  $scope.leftArray = buildArray('Left', 5);
+  $scope.rightArray = buildArray('Right', 7);
+  $scope.sortableOptions = {
+    connectWith: '.list'
+  };
+});

From bbbf0e14e87af311f2859c30ca3f9cc7551cefe3 Mon Sep 17 00:00:00 2001
From: Thodoris Greasidis <thgreasi@gmail.com>
Date: Sat, 15 Nov 2014 19:34:07 +0200
Subject: [PATCH 3/3] fix(demo): disable sorting between examples

---
 demo/demo.css  |  5 -----
 demo/demo.html |  2 +-
 demo/demo.js   | 38 ++++++++++++++------------------------
 3 files changed, 15 insertions(+), 30 deletions(-)

diff --git a/demo/demo.css b/demo/demo.css
index c0ad799..30a55ac 100644
--- a/demo/demo.css
+++ b/demo/demo.css
@@ -32,8 +32,3 @@
 	border: 5px solid #000;
 	border-radius: 15px;
 }
-
-.logList:before {
-	background-color: #FFF;
-}
-
diff --git a/demo/demo.html b/demo/demo.html
index 03690e0..56817d4 100644
--- a/demo/demo.html
+++ b/demo/demo.html
@@ -14,7 +14,7 @@ <h1>Sortable items</h1>
   </div>
 
   <h1>Connected items</h1>
-  <div ng-controller="connectedController" class="section row">
+  <div ng-controller="connectedController" class="section row connectedItemsExample">
     <div class="col-sm-offset-2 col-sm-4">
       <ul ui-sortable="sortableOptions" ng-model="leftArray" class="list">
         <li ng-repeat="item in leftArray" class="item">{{item.text}}</li>
diff --git a/demo/demo.js b/demo/demo.js
index b5fd132..ffcdadd 100644
--- a/demo/demo.js
+++ b/demo/demo.js
@@ -1,20 +1,22 @@
 
 var myapp = angular.module('sortableApp', ['ui.sortable']);
 
-myapp.controller('sortableController', function ($scope) {
-  'use strict';
-
-  var tmpList = [];
-
-  for (var i = 1; i <= 6; i++){
-    tmpList.push({
-      text: 'Item ' + i,
+myapp.buildArray = function(name, size) {
+  var i, array = [];
+  for (i = 1; i <= size; i++){
+    array.push({
+      text: name + ' ' + i ,
       value: i
     });
   }
 
-  $scope.list = tmpList;
+  return array;
+};
 
+myapp.controller('sortableController', function ($scope) {
+  'use strict';
+
+  $scope.list = myapp.buildArray('Item', 5);
 
   $scope.sortingLog = [];
 
@@ -31,21 +33,9 @@ myapp.controller('sortableController', function ($scope) {
 });
 
 myapp.controller('connectedController', function ($scope) {
-  function buildArray(name, size) {
-      var i, array = [];
-      for (i = 1; i <= size; i = i + 1){
-        array.push({
-          text: name + ' ' + i ,
-          value: i
-        });
-      }
-
-      return array;
-    }
-
-  $scope.leftArray = buildArray('Left', 5);
-  $scope.rightArray = buildArray('Right', 7);
+  $scope.leftArray = myapp.buildArray('Left', 5);
+  $scope.rightArray = myapp.buildArray('Right', 7);
   $scope.sortableOptions = {
-    connectWith: '.list'
+    connectWith: '.connectedItemsExample .list'
   };
 });