more list

build/js/ox.ui.js

@@ -743,10 +743,10 @@ requires
     // rather then $element, $content, and potentially others,
     // 0, 1, 2, etc, so that append would append 0, and appendTo
     // would append (length - 1)?
-    Ox.Container = function() {
+    Ox.Container = function(options, self) {
-        var that = new Ox.Element()
+        var that = new Ox.Element(options, self)
             .addClass("OxContainer");
-        that.$content = new Ox.Element()
+        that.$content = new Ox.Element(options, self)
             .addClass("OxContent")
             .appendTo(that);
         return that;
@@ -875,6 +875,7 @@ requires
                 */
                 self.defaults = defaults;
                 delete self.options; // fixme: hackish fix for that = Ox.Foo({...}, self).defaults({...}).options({...})
+                Ox.print("self.defaults", self.defaults, "self.options", self.options)
                 return that;
             };
             that.gainFocus = function() {
@@ -911,6 +912,7 @@ requires
                     // options (str, val) or options({str: val, ...})
                     // translate (str, val) to ({str: val})
                     args = Ox.makeObject.apply(that, arguments);
+                    Ox.print("args", args, "self.options", self.options, "self.defaults", self.defaults)
                     /*
                     options = self.options;
                     */
@@ -2385,6 +2387,7 @@ requires
         var self = self || {},
             that = new Ox.Container({}, self)
                 .defaults({
+                    construct: function() {},
                     itemHeight: 16,
                     itemWidth: 16,
                     keys: [],
@@ -2398,6 +2401,8 @@ requires
                 .options(options || {})
                 .scroll(scroll);
 
+        Ox.print("List options", options, self, self.options);
+
         $.extend(self, {
             $items: [],
             $pages: [],
@@ -2418,11 +2423,11 @@ requires
                     pageHeight: self.options.orientation == "horizontal" ? 0 :
                             self.pageLength * self.options.itemHeight / self.options.rowLength
                 });
+                Ox.print("List self", self);
                 loadPages(self.page);                
             }
         });
 
-
         function addAllToSelection(pos) {
             var arr,
                 len = self.$items.length;
@@ -2529,8 +2534,8 @@ requires
             if (Ox.isUndefined(self.$pages[page])) {
                 Ox.print("request...")
                 self.requests.push(self.options.request({
-                    callback: function(data) {
+                    callback: function(result) {
-                        Ox.print("callback", data)
+                        Ox.print("callback", result)
                         self.$pages[page] = new Ox.ListPage();
                         if (self.options.type == "text") {
                             self.$pages[page].css({
@@ -2541,9 +2546,13 @@ requires
 
                             });
                         }
-                        $.each(data, function(i, v) {
+                        $.each(result.data.items, function(i, v) {
                             var pos = offset + i;
-                            self.$items[pos] = new Ox.ListItem(v);
+                            self.$items[pos] = new Ox.ListItem({
+                                construct: self.options.construct,
+                                data: v,
+                                pos: pos
+                            });
                             if (isSelected(pos)) {
                                 self.$items[pos].addClass("OxSelected");
                             }
@@ -2551,9 +2560,7 @@ requires
                         });
                         self.$pages[page].appendTo(that.$content);
                     },
-                    keys: $.map(self.visibleColumns, function(v, i) {
+                    keys: self.options.keys,
-                        return v.id;
-                    }),
                     range: range,
                     sort: self.options.sort
                 }));
@@ -2702,7 +2709,28 @@ requires
     };
 
     Ox.ListItem = function(options, self) {
-        
+
+        var self = self || {},
+            that = new Ox.Element({}, self)
+                .defaults({
+                    construct: function() {},
+                    data: {},
+                    pos: 0
+                })
+                .options(options || {})
+
+        Ox.print("ListItem self", self, "options", options)
+
+        $.each(self.options.data, function(k, v) {
+            self.options.data[k] = $.isArray(v) ? v.join(", ") : v;
+        });
+
+        Ox.print("ListItem self", self, "options", options)
+
+        that.append(self.options.construct(self.options.data, self.options.pos));
+
+        return that;
+
     };
 
     Ox.ListPage = function(options, self) {
@@ -2738,7 +2766,7 @@ requires
         $.extend(self, {
             pageHeight: self.pageLength * self.itemHeight
         });
-        Ox.print("self", self);
+        Ox.print("TextList self", self);
 
         // Head
 
@@ -2815,15 +2843,18 @@ requires
 
         // Body
 
-        Ox.print("self", self);
         that.$body = new Ox.List({
+                construct: constructItem,
                 itemHeight: 16,
                 itemWidth: Ox.sum(self.columnWidths),
+                keys: $.map(self.visibleColumns, function(v, i) {
+                    return v.id;
+                }),
                 orientation: "vertical",
                 request: self.options.request,
                 sort: self.options.sort,
                 type: "text"
-            }, self)
+            })
             .addClass("OxBody")
             .scroll(function() {
                 var scrollLeft = $(this).scrollLeft();
@@ -2833,7 +2864,6 @@ requires
                 }
             })
             .appendTo(that);
-        Ox.print("that.$body", that.$body)
         that.$body.$content.css({
             width: Math.max(Ox.sum(self.columnWidths), that.$element.width() - 12) + "px",
             height: self.listHeight + "px"
@@ -2843,24 +2873,27 @@ requires
             
         }
 
-        function constructItem(item, pos) {
+        function constructItem(data, pos) {
-            var item = $("<div>")
+            var $item = $("<div>")
                     .addClass("OxListItem")
                     .css({
-                        width: Ox.sum(columnWidths) + "px"
+                        width: Ox.sum(self.columnWidths) + "px"
                     })
                     .data("pos", pos)
                     .click(function() {});
-            $.each(self.options.columns, function(i, v) {
+            Ox.print(1);
+            $.each(self.visibleColumns, function(i, v) {
+                Ox.print(data, v.id)
                 var $cell = $("<div>")
                         .addClass("OxCell OxColumn" + Ox.toTitleCase(v.id))
                         .css({
-                            width: (columnWidths[i] - 9) + "px",
+                            width: (self.columnWidths[i] - 9) + "px",
                             textAlign: v.align
                         })
-                        .html(item[v.id])
+                        .html(data[v.id])
                         .appendTo($item)
             });
+            Ox.print(2);
             return $item;
         }