fix a bug where in empty icon lists, an icon grid would appear for a split-second

source/Ox.UI/css/Ox.UI.css

@@ -680,20 +680,21 @@ input.OxInput {
 OxEditable
 --------------------------------------------------------------------------------
 */
-.OxEditable > .OxValue {
+// clashes with editable text list cell
+._OxEditable > .OxValue {
     cursor: pointer;
     padding: 0 0 0 1px;
 }
-.OxEditable div.OxInput {
+._OxEditable div.OxInput {
     height: 14px;
     padding: 0 1px 0 0;
 }
-.OxEditable input.OxInput {
+._OxEditable input.OxInput {
     height: 14px;
     padding: 0 1px 0 0;
     border: 0;
 }
-.OxEditable textarea.OxInput {
+._OxEditable textarea.OxInput {
     padding: 0 0 0 1px;
     border: 0;
 }

source/Ox.UI/js/List/Ox.IconList.js

@@ -8,7 +8,7 @@ Ox.IconList <f:Ox.Element> IconList Object
         borderRadius <n|0> border radius for icon images
         centerSelection <b|false> scroll list so selection is always centered
         defaultRatio <n|1> aspect ratio of icon placeholders
-        draggable <b|true> can be dragged
+        draggable <b|false> If true, items can be dragged
         fixedRatio <b|n|false> if set to a number, icons have a fixed ratio
         id <s|''> element id
         item <f|null> called with data, sort, size,
@@ -33,7 +33,7 @@ Ox.IconList = function(options, self) {
                 borderRadius: 0,
                 centerSelection: false,
                 defaultRatio: 1,
-                draggable: true,
+                draggable: false,
                 fixedRatio: false,
                 id: '',
                 item: null,

source/Ox.UI/js/List/Ox.List.js

@@ -65,7 +65,7 @@ Ox.List = function(options, self) {
             .options(options || {})
             .scroll(scroll);
 
-    that.$content.mousedown(_mousedown);
+    that.mousedown(_mousedown);
     //that.bindEvent('doubleclick', function() {alert('d')})
     /*
     that.$content.bindEvent({ // fixme: port to new Ox mouse events
@@ -283,13 +283,11 @@ Ox.List = function(options, self) {
 
     function constructEmptyPage(page) {
         var i, $page = Ox.ListPage().css(getPageCSS(page));
-        for (i = 0; i < getPageLength(page); i++
-        ) {
-            // fixme: why does chainging fail here?
+        Ox.loop(getPageLength(page), function() {
             Ox.ListItem({
                 construct: self.options.construct
             }).appendTo($page);
-        }
+        });
         return $page;
     }
 
@@ -556,7 +554,7 @@ Ox.List = function(options, self) {
 
     function getPageLength(page) {
         var mod = self.listLength % self.pageLength;
-        return page < self.pages - 1 || mod == 0 ? self.pageLength : mod;
+        return page < self.pages - 1 || (self.listLength && mod == 0) ? self.pageLength : mod;
     }
 
     function getPositionById(id) {
@@ -699,6 +697,7 @@ Ox.List = function(options, self) {
             offset = page * self.pageLength,
             range = [offset, offset + getPageLength(page)];
         if (Ox.isUndefined(self.$pages[page])) { // fixme: unload will have made this undefined already
+            Ox.print('###################################', self.listLength, getPageLength(0))
             self.$pages[page] = constructEmptyPage(page);
             self.options.type == 'text' && page == 0 && fillFirstPage();
             self.$pages[page].appendTo(that.$content);
@@ -1239,7 +1238,7 @@ Ox.List = function(options, self) {
             self.pageLength = self.options.orientation == 'both' ?
                     self.pageLengthByRowLength[self.rowLength] :
                     self.options.pageLength;
-            $.extend(self, {
+            Ox.extend(self, {
                 listLength: result.data.items,
                 pages: Math.max(Math.ceil(result.data.items / self.pageLength), 1),
                 pageWidth: self.options.orientation == 'vertical' ? 0 :

source/Ox.UI/js/List/Ox.TextList.js

@@ -24,6 +24,7 @@ Ox.TextList <f:Ox.Element> TextList Object
         columnsResizable <b|false>
         columnsVisible <b|false>
         columnWidth <a|[40, 800]>
+        draggable <b|false> If true, items can be dragged
         id <s|''>
         items <f|null> function() {} {sort, range, keys, callback} or array
         max <n|-1>
@@ -48,7 +49,7 @@ Ox.TextList = function(options, self) {
                 columnsResizable: false,
                 columnsVisible: false,
                 columnWidth: [40, 800],
-                droppable: null,
+                draggable: false,
                 id: '',
                 items: null, // function() {} {sort, range, keys, callback} or array
                 max: -1,
@@ -169,6 +170,7 @@ Ox.TextList = function(options, self) {
 
     that.$body = Ox.List({
             construct: constructItem,
+            draggable: self.options.draggable,
             id: self.options.id,
             items: self.options.items,
             itemHeight: 16,
@@ -381,7 +383,7 @@ Ox.TextList = function(options, self) {
 
     function constructItem(data) {
         var $item = $('<div>')
-                .addClass('OxTarget' + (data.droppable ? ' OxDroppable' : ''))
+                .addClass('OxTarget')
                 .css({
                     width: getItemWidth(true) + 'px'
                 });
@@ -779,9 +781,10 @@ Ox.TextList = function(options, self) {
             // fixme: leaky, inputs remain in focus stack
             $cell.removeClass('OxEdit')
                 .css({
+                     // account for padding
                     width: (width - 8) + 'px'
                 })
-                .html(value)
+                .html(value);
             that.triggerEvent('submit', {
                 id: id,
                 key: key,