From b0dfd0105d387ee5d88b7292335acf236386655e Mon Sep 17 00:00:00 2001 From: Rolux Date: Tue, 29 Jun 2010 23:24:07 +0200 Subject: [PATCH] more fixes (list) --- build/js/ox.ui.js | 70 +++++++++++++++++++++++++++++----------------- demos/test/list.js | 8 ++++++ 2 files changed, 53 insertions(+), 25 deletions(-) diff --git a/build/js/ox.ui.js b/build/js/ox.ui.js index 73d541b..fb41fc6 100644 --- a/build/js/ox.ui.js +++ b/build/js/ox.ui.js @@ -2724,6 +2724,7 @@ requires that = new Ox.Element({}, self) .defaults({ columns: [], + columnWidth: [40, 800], request: function() {}, // {sort, range, keys, callback} sort: [] }) @@ -2736,7 +2737,7 @@ requires page: 0, pageLength: 100, scrollLeft: 0, - selectedColumn: getColumnById(self.options.sort[0].key), + selectedColumn: getColumnIndexById(self.options.sort[0].key), visibleColumns: $.map(self.options.columns, function(v, i) { return v.visible ? v : null; }) @@ -2767,7 +2768,7 @@ requires }) .html(v.title) .click(function() { - clickColumn(v) + clickColumn(v.id) }) .appendTo(that.$head.$content.$element); $order = $("
") @@ -2786,8 +2787,12 @@ requires initialX = e.clientX; $window.mousemove(function(e) { var x = e.clientX, - width = Ox.limit(initialWidth - initialX + x, 40, 512); - resizeColumn(i, width); + width = Ox.limit( + initialWidth - initialX + x, + self.options.columnWidth[0], + self.options.columnWidth[1] + ); + resizeColumn(v.id, width); }); $window.mouseup(function() { $window.unbind("mousemove"); @@ -2795,7 +2800,7 @@ requires }); }) .dblclick(function() { - resizeColumn(i, v.width); + resizeColumn(v.id, v.width); }) .appendTo(that.$head.$content.$element); $left = $("
").addClass("OxLeft").appendTo($resize); @@ -2805,8 +2810,8 @@ requires that.$head.$content.css({ width: (Ox.sum(self.columnWidths) + 2) + "px" }); - toggleSelected(self.selectedColumn); - that.$titles[self.selectedColumn].css({ + toggleSelected(self.options.columns[self.selectedColumn].id); + that.$titles[getColumnPositionById(self.options.columns[self.selectedColumn].id)].css({ width: (self.options.columns[self.selectedColumn].width - 25) + "px" }); that.$select = $("
") @@ -2846,10 +2851,13 @@ requires } - function clickColumn(data) { - var isSelected = self.options.sort[0].key == data.id; + function clickColumn(id) { + var i = getColumnIndexById(id), + isSelected = self.options.sort[0].key == self.options.columns[i].id; that.sort( - data.id, isSelected ? (self.options.sort[0].operator == "+" ? "-" : "+") : data.operator + self.options.columns[i].id, isSelected ? + (self.options.sort[0].operator == "+" ? "-" : "+") : + self.options.columns[i].operator ); } @@ -2873,7 +2881,7 @@ requires return $item; } - function getColumnById(id) { + function getColumnIndexById(id) { var pos = -1; $.each(self.options.columns, function(i, v) { if (v.id == id) { @@ -2884,6 +2892,17 @@ requires return pos; } + function getColumnPositionById(id) { + var pos = -1; + $.each(self.visibleColumns, function(i, v) { + if (v.id == id) { + pos = i; + return false; + } + }); + return pos; + } + function moveColumn(id) { } @@ -2892,13 +2911,15 @@ requires } - function resizeColumn(pos, width) { + function resizeColumn(id, width) { + var i = getColumnIndexById(id), + pos = getColumnPositionById(id); self.columnWidths[pos] = width; that.$head.$content.css({ width: (Ox.sum(self.columnWidths) + 2) + "px" }); that.$titles[pos].css({ - width: (width - 9 - (pos == self.selectedColumn ? 16 : 0)) + "px" + width: (width - 9 - (i == self.selectedColumn ? 16 : 0)) + "px" }); that.$body.$content.find(".OxItem").css({ // fixme: can we avoid this lookup? width: Ox.sum(self.columnWidths) + "px" @@ -2906,18 +2927,15 @@ requires that.$body.$content.css({ width: Math.max(Ox.sum(self.columnWidths), that.$element.width() - 12) + "px" // fixme: check if scrollbar visible, and listen to resize/toggle event }); - $(".OxColumn" + Ox.toTitleCase(self.options.columns[pos].id)).css({ + $(".OxColumn" + Ox.toTitleCase(self.options.columns[i].id)).css({ width: (width - 9) + "px" }); that.$body.clearCache(); } - function selectColumn(pos) { - that.sort(args.columns[pos].id, args.columns[pos].operator); - } - - function toggleSelected(pos) { - updateOrder(pos); + function toggleSelected(id) { + var pos = getColumnPositionById(id); + updateOrder(id); pos > 0 && that.$titles[pos].prev().children().eq(2).toggleClass("OxSelected"); that.$titles[pos].toggleClass("OxSelected"); that.$titles[pos].next().toggleClass("OxSelected"); @@ -2929,7 +2947,9 @@ requires }); } - function updateOrder(pos) { + function updateOrder(id) { + var pos = getColumnPositionById(id); + Ox.print(id, pos) that.$titles[pos].next().html(oxui.symbols[ "triangle_" + (self.options.sort[0].operator == "+" ? "up" : "down") ]); @@ -2944,11 +2964,11 @@ requires } ]; if (isSelected) { - updateOrder(self.selectedColumn); + updateOrder(self.options.columns[self.selectedColumn].id); } else { - toggleSelected(self.selectedColumn); - self.selectedColumn = getColumnById(key); - toggleSelected(self.selectedColumn); + toggleSelected(self.options.columns[self.selectedColumn].id); + self.selectedColumn = getColumnIndexById(key); + toggleSelected(self.options.columns[self.selectedColumn].id); } that.$body.sort(self.options.sort[0].key, self.options.sort[0].operator); }; diff --git a/demos/test/list.js b/demos/test/list.js index e01ba3c..64130c9 100644 --- a/demos/test/list.js +++ b/demos/test/list.js @@ -34,6 +34,14 @@ $(function() { }), $list = new Ox.TextList({ columns: [ + { + align: "left", + id: "id", + operator: "+", + title: "ID", + visible: false, + width: 80 + }, { align: "left", id: "title",