diff --git a/source/Ox.UI/js/List/ColumnList.js b/source/Ox.UI/js/List/ColumnList.js index fd81eb39..4f7db72f 100644 --- a/source/Ox.UI/js/List/ColumnList.js +++ b/source/Ox.UI/js/List/ColumnList.js @@ -14,15 +14,18 @@ Ox.ColumnList = function(options, self) { custom: {}, items: [], list: 'table', - selected: [], + resize: null, width: 768 }) .options(options || {}) .update({ width: function() { self.columnWidths = getColumnWidths(); - self.$panel.size(0, self.columnWidths[0]), - self.$panel.size(2, self.columnWidths[2]) + self.$panel.size(0, self.columnWidths[0]); + self.$panel.size(2, self.columnWidths[2]); + self.$lists.forEach(function($list, i) { + $list.options({itemWidth: self.columnWidths[i]}); + }); } }) .addClass('OxColumnList'); @@ -31,56 +34,88 @@ Ox.ColumnList = function(options, self) { self.numberOfColumns = self.options.columns.length; self.$lists = self.options.columns.map(function(column, i) { - var isLastColumn = i == self.numberOfColumns - 1; + //Ox.print('SELECTED::', self.options.selected[i]); return Ox.CustomList({ item: self.options.columns[i].item, itemHeight: self.options.columns[i].itemHeight, items: i == 0 ? self.options.items : [], itemWidth: self.columnWidths[i], keys: self.options.columns[i].keys, - max: 1, + max: self.options.columns[i].max, + resize: self.options.resize, scrollbarVisible: true, + selected: self.options.columns[i].selected, + sort: self.options.columns[i].sort, unique: 'id' }) .bindEvent({ key_left: function() { - i && self.$lists[i - 1].gainFocus(); + if (i > 0) { + self.$lists[i - 1].gainFocus(); + that.triggerEvent('select', { + id: self.options.columns[i - 1].id, + ids: self.$lists[i - 1].options('selected') + }); + } }, key_right: function() { - var object, selected = self.$lists[i].options('selected'); + var index, object, selected = self.$lists[i].options('selected'); if (selected.length) { if (i < self.numberOfColumns - 1) { - object = Ox.getObjectById(self.options.items, self.options.selected[0][0]); - if (i == 1) { - object = Ox.getObjectById(object.items, self.options.selected[1][0]); + if (self.$lists[i + 1].options('selected').length == 0) { + self.$lists[i + 1].selectPosition(0); } - self.$lists[i + 1] - .options({selected: [object.items[0].id]}) - .gainFocus(); + self.$lists[i + 1].gainFocus(); + that.triggerEvent('select', { + id: self.options.columns[i + 1].id, + ids: self.$lists[i + 1].options('selected') + }); } - } }, select: function(data) { - var id = data.ids[0], index; - self.options.selected[i] = data.ids; - if (i == 0) { - index = Ox.getIndexById(self.options.items, id); - self.$lists[1].options({ - items: id ? self.options.items[index].items : [] + var items = []; + self.options.columns[i].selected = data.ids; + if (i < self.numberOfColumns - 1) { + data.ids.forEach(function(id) { + var index; + if (i == 0) { + index = Ox.getIndexById(self.options.items, id); + items = items.concat( + self.options.items[index].items + ); + } else if (i == 1) { + index = []; + Ox.forEach(self.options.columns[0].selected, function(id_) { + index[0] = Ox.getIndexById( + self.options.items, id_ + ); + index[1] = Ox.getIndexById( + self.options.items[index[0]].items, id + ); + if (index[1] > -1) { + return false; + } + }); + items = items.concat( + self.options.items[index[0]].items[index[1]].items + ); + } }); - } else if (i == 1) { - index = []; - index[0] = Ox.getIndexById(self.options.items, self.options.selected[0][0]); - index[1] = Ox.getIndexById(self.options.items[index[0]].items, id); - self.$lists[2].options({ - items: id ? self.options.items[index[0]].items[index[1]].items : [] + self.$lists[i + 1].options({items: items}) + } + if (i == 0 || data.ids.length) { + that.triggerEvent('select', { + id: column.id, + ids: data.ids + }); + } else { + self.$lists[i - 1].gainFocus(); + that.triggerEvent('select', { + id: self.options.columns[i - 1].id, + ids: self.$lists[i - 1].options('selected') }); } - that.triggerEvent('select', { - id: column.id, - ids: data.ids - }); } }); });