Convert to integer type of property value when sorting.

src/jquery.gridster.js

@@ -153,6 +153,28 @@
     Gridster.defaults = defaults;
     Gridster.generated_stylesheets = [];
 
+    /**
+     * Convert properties to Integer
+     *
+     * @param {Object}
+     * @return {Objct} Returns the converted object.
+     */
+    function convInt(obj) {
+      var props = ['col', 'row', 'size_x', 'size_y'];
+      var tmp = {};
+      for (var i=0, len=props.length; i<len; i++) {
+        var prop = props[i];
+        if (!(prop in obj)) {
+          throw new Error('Not exists property `'+ prop +'`');
+        }
+        var val = obj[prop];
+        if (!val || isNaN(val)) {
+          throw new Error('Invalid value of `'+ prop +'` property');
+        }
+        tmp[prop] = +val;
+      }
+      return tmp;
+    }
 
     /**
     * Sorts an Array of grid coords objects (representing the grid coords of
@@ -169,6 +191,8 @@
                 b = $(b).coords().grid;
             }
 
+            a = convInt(a);
+            b = convInt(b);
            if (a.row > b.row) {
                return 1;
            }
@@ -189,6 +213,8 @@
     */
     Gridster.sort_by_row_and_col_asc = function(widgets) {
         widgets = widgets.sort(function(a, b) {
+          a = convInt(a);
+          b = convInt(b);
            if (a.row > b.row || a.row === b.row && a.col > b.col) {
                return 1;
            }
@@ -209,6 +235,8 @@
     */
     Gridster.sort_by_col_asc = function(widgets) {
         widgets = widgets.sort(function(a, b) {
+          a = convInt(a);
+          b = convInt(b);
            if (a.col > b.col) {
                return 1;
            }
@@ -229,6 +257,8 @@
     */
     Gridster.sort_by_row_desc = function(widgets) {
         widgets = widgets.sort(function(a, b) {
+          a = convInt(a);
+          b = convInt(b);
             if (a.row + a.size_y < b.row + b.size_y) {
                 return 1;
             }

test/jquery.gridster_test.js

@@ -27,6 +27,13 @@
 
       this.el = $('#qunit-fixture').find(".wrapper ul");
 
+      this.serialization = [
+		  { name: "A", col: "1",  row: "1",  size_x: "2",  size_y: "2"  },
+		  { name: "B", col: "4",  row: "1",  size_x: "1",  size_y: "2"  },
+		  { name: "C", col: "10", row: "10", size_x: "10", size_y: "10" },
+		  { name: "D", col: "3",  row: "1",  size_x: "1",  size_y: "1"  },
+		  { name: "E", col: "2",  row: "3",  size_x: "3",  size_y: "1"  }
+	  ];
     }
   });
 
@@ -35,4 +42,87 @@
   //   strictEqual(this.el, this.el.gridster(), 'should be chaninable');
   // });
 
+  test('Gridster.sort_by_row_asc', function(assert) {
+    var sorted = Gridster.sort_by_row_asc(this.serialization);
+
+    var result = pickup(sorted, 'name').join(',');
+    var expected = 'A,B,D,E,C';
+    assert.equal(result, expected);
+  });
+
+  test('Gridster.sort_by_row_and_col_asc', function(assert) {
+    var sorted = Gridster.sort_by_row_and_col_asc(this.serialization);
+
+    var result = pickup(sorted, 'name').join(',');
+    var expected = 'A,D,B,E,C';
+    assert.equal(result, expected);
+  });
+
+  test('Gridster.sort_by_col_asc', function(assert) {
+    var sorted = Gridster.sort_by_col_asc(this.serialization);
+
+    var result = pickup(sorted, 'name').join(',');
+    var expected = 'A,E,D,B,C';
+    assert.equal(result, expected);
+  });
+
+  test('Gridster.sort_by_row_desc', function(assert) {
+    var sorted = Gridster.sort_by_row_desc(this.serialization);
+
+    var result = pickup(sorted, 'name').join(',');
+    var expected = 'C,E,A,B,D';
+    assert.equal(result, expected);
+  });
+
+  // erros
+  test('Throws not exists property', function(assert) {
+    assert.throws(function() {
+      var data = [{row:1, size_x:1, size_y:1},{col:2,row:1,size_x:1,size_y:1}];
+      Gridster.sort_by_row_asc(data);
+      },
+      Error,
+      'raise error not exists required property'
+    );
+  });
+
+  test('Throws invalid type of value', function(assert) {
+    // inconvertible types
+    assert.throws(function() {
+      Gridster.sort_by_row_asc([{col:"AAA", row:1, size_x:1, size_y:1},{col:2,row:1,size_x:1,size_y:1}]);
+      },
+      Error,
+      'raise error inconvertible types'
+    );
+
+    // null
+    assert.throws(function() {
+      Gridster.sort_by_row_asc([{col:null, row:1, size_x:1, size_y:1},{col:2,row:1,size_x:1,size_y:1}]);
+      },
+      Error,
+      'raise error value is null'
+    );
+
+    // array
+    assert.throws(function() {
+      Gridster.sort_by_row_asc([{col:[1,2,3], row:1, size_x:1, size_y:1},{col:2,row:1,size_x:1,size_y:1}]);
+      },
+      Error,
+      'raise error value is array'
+    );
+
+    // object
+    assert.throws(function() {
+      Gridster.sort_by_row_asc([{col:{k:1}, row:1, size_x:1, size_y:1},{col:2,row:1,size_x:1,size_y:1}]);
+      },
+      Error,
+      'raise error value is object'
+    );
+  });
+
+  // helper
+  function pickup(data, prop) {
+	return data.map(function(elm) {
+		return elm[prop];
+	});
+  }
 }(jQuery));