url controller updates, list bugfixes

source/Ox.UI/js/Core/Ox.Element.js

@@ -348,7 +348,9 @@ Ox.Element = function(options, self) {
                     'draganddropstart', 'draganddrop', 'draganddropenter', 'draganddropleave', 'draganddropend',
                     'playing', 'position', 'progress'
                 ].indexOf(event) == -1) {
-                    Ox.print(that.id, self.options.id, 'trigger', event, data);
+                    if (!/^pandora_/.test(event)) {
+                        Ox.print(that.id, self.options.id, 'trigger', event, data);
+                    }
                 }
                 // it is necessary to check if self.$eventHandler exists,
                 // since, for example, when removing the element on click,

source/Ox.UI/js/Core/Ox.Event.js

@@ -19,7 +19,9 @@ Ox.Event = (function() {
     @*/
     that.bind = function() {
         Ox.forEach(Ox.makeObject(arguments), function(callback, event) {
+            var foo = event;
             self.$eventHandler.bind('ox_' + event, function(event, data) {
+                Ox.print('CALLBACK', foo, data.value);
                 callback(data.value);
             });
         });

source/Ox.UI/js/Core/Ox.URL.js

@@ -242,7 +242,7 @@ Ox.URL = function(options) {
             ].indexOf(state.view) > -1) {
                 parts.push(state.view);
             }
-            if (state.span) {
+            if (state.span && state.span.length) {
                 parts.push(constructSpan(state.span, state));
             }
             if (state.sort && state.sort.length) {
@@ -444,7 +444,7 @@ Ox.URL = function(options) {
                     parseBeyondItem();
                 } else {
                     // test for item id or name
-                    self.options.getItem(parts[0], function(item) {
+                    self.options.getItem(parts[0].replace(/%20/g, ' '), function(item) {
                         state.item = item;
                         if (item) {
                             parts.shift();
@@ -585,10 +585,13 @@ Ox.URL = function(options) {
                 + document.location.search
                 + document.location.hash,
             callback = arguments[arguments.length - 1];
+        /*
         parseURL(str, function(state) {
             that.replace(constructURL(state));
             callback(state);
         });
+        */
+        parseURL(str, callback);
         return that;
     }
 
@@ -602,34 +605,61 @@ Ox.URL = function(options) {
 
     /*@
     push <f> Pushes a new URL
-        (url, callback) -> <o> URL controller
+        (state, title, url, callback) -> <o> URL controller
-        (state) -> <o> URL controller
+        state <o> State for the new URL
-        url <s> New URL
+        title <s> Title for the new URL
+        url <s|o> New URL, or state object to construct it from
+            This state object can be different from the first one
+            (for example: save full state, create URL from reduced state)
         callback <f> callback function
             state <o> New state
-        state <o> State to construct the new URL from
     @*/
-    that.push = function(url, callback) {
+    that.push = function(state, title, url, callback) {
-        url = callback ? url : constructURL(url);
+        if (Ox.isString(url)) {
-        saveURL();
+            if (state) {
-        Ox.print('PUSH', url);
+                pushState(state, title, url);
-        history.pushState({}, '', url);
+            } else {
-        callback && parseURL(url, callback);
+                parseURL(url, function(state) {
-        return that;
+                    pushState(state, title, url);
-    };
+                });
+            }
+        } else {
+            url = constructURL(url);
+            pushState(state, title, url);
+        }
+        function pushState(state, title, url) {
+            history.pushState(state, title, url);
+            callback && callback(state);
+        }
+    }
 
-    that.replace = function(url) {
+    /*@
-        saveURL();
+    replace <f> Replaces the URL with a new URL
-        history.replaceState({}, '', url);
+        (state, title, url, callback) -> <o> URL controller
-        return that;
+        state <o> State for the new URL
-    };
+        title <s> Title for the new URL
-
+        url <s|o> New URL, or state object to construct it from
-    that.update = function(state) {
+        callback <f> callback function
-        // pushes a new URL, constructed from state
+            state <o> New state
-        // state can have type, item, view, span, sort, find
+    @*/
-        that.push(constructURL(state));
+    that.replace = function(state, title, url, callback) {
-        return that;
+        if (Ox.isString(url)) {
-    };
+            if (state) {
+                replaceState(state, title, url);
+            } else {
+                parseURL(url, function(state) {
+                    replaceState(state, title, url);
+                });
+            }
+        } else {
+            url = constructURL(url);
+            replaceState(state, title, url);
+        }
+        function replaceState(state, title, url) {
+            history.replaceState(state, title, url);
+            callback && callback(state);
+        }
+    }
 
     return that;
   

source/Ox.UI/js/Form/Ox.Select.js

@@ -195,7 +195,7 @@ Ox.Select = function(options, self) {
         id <s> item id
     @*/
     that.selectItem = function(id) {
-        //Ox.print('selectItem', id, Ox.getObjectById(self.options.items, id).title)
+        Ox.print('selectItem', id, self.options.items, self.options.items.length, Ox.getObjectById(self.options.items, id))
         self.options.type == 'text' && self.$title.html(
             Ox.getObjectById(self.options.items, id).title
         );

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

@@ -134,6 +134,7 @@ Ox.IconItem = function(options, self) {
     );
 
     function formatText(text, maxLines, maxLength) {
+        text = Ox.isArray(text) ? text.join(', ') : text;
         var lines = Ox.wordwrap(text, maxLength, '<br/>', true, false).split('<br/>');
         return Ox.map(lines, function(line, i) {
             if (i < maxLines - 1) {

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

@@ -113,9 +113,8 @@ Ox.IconList = function(options, self) {
     }
 
     function updateKeys() {
-        self.options.keys = Ox.unique(Ox.merge(self.options.keys, [self.options.sort[0].key]));
         that.$element.options({
-            keys: self.options.keys
+            keys: Ox.unique(Ox.merge(self.options.sort[0].key, self.options.keys))
         });
     }
 
@@ -129,7 +128,9 @@ Ox.IconList = function(options, self) {
         } else if (key == 'selected') {
             that.$element.options(key, value);
         } else if (key == 'sort') {
+            updateKeys();
             that.$element.options(key, value);
+            //that.$element.sortList(key, operator);
         }
     };
 
@@ -177,6 +178,7 @@ Ox.IconList = function(options, self) {
         that.$element.size();
     };
 
+    // fixme: deprecate, use options()
     /*@
     sortList <f> sort list
         (key, operator) -> <o> the list

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

@@ -37,7 +37,7 @@ Ox.List <f:Ox.Element> List Element
     draganddropstart <i> Fires when drag starts
     copy <!> copy
     paste <!> paste
-    movie <!> move item
+    move <!> move item
     load <!> list loaded
     openpreview <!> preview of selected item opened
     closepreview <!> preview closed
@@ -291,7 +291,7 @@ Ox.List = function(options, self) {
             Ox.Request.cancel(v);
         });
         Ox.extend(self, {
-            //$items: [],
+            $items: [],
             $pages: [],
             page: 0,
             requests: []
@@ -677,6 +677,7 @@ Ox.List = function(options, self) {
 
     function loadItems() {
         that.$content.empty();
+        self.$items = [];
         self.options.items.forEach(function(item, pos) {
             // fixme: duplicated
             self.$items[pos] = Ox.ListItem({
@@ -1649,17 +1650,20 @@ Ox.List = function(options, self) {
         value <s> value, can be whatever that property is
     @*/
     that.value = function(id, key, value) {
-        //Ox.print('that.value', id, getPositionById(id))
         var pos = getPositionById(id),
             $item = self.$items[pos],
-            data = $item.options('data'),
+            data = $item.options('data');
-            oldValue;
         if (arguments.length == 1) {
             return data;
         } else if (arguments.length == 2) {
             return data[key];
         } else {
-            oldValue = data[key];
+            if (key == self.options.unique) {
+                // unique id has changed
+                self.options.selected = self.options.selected.map(function(id_) {
+                    return id_ == data[key] ? value : id_
+                });
+            }
             data[key] = value;
             $item.options({data: data});
             return that;

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

@@ -196,7 +196,7 @@ Ox.TextList = function(options, self) {
             sortable: self.options.sortable,
             type: 'text',
             unique: self.unique
-        }, Ox.extend({}, self)) // pass event handler
+        }, Ox.clone(self)) // pass event handler
         .addClass('OxBody')
         .css({
             top: (self.options.columnsVisible ? 16 : 0) + 'px',
@@ -222,7 +222,6 @@ Ox.TextList = function(options, self) {
                 //that.triggerEvent('init', data);
             },
             select: function() {
-                Ox.print('SELECT????')
                 self.options.selected = that.$body.options('selected');
             }
         })
@@ -929,18 +928,19 @@ Ox.TextList = function(options, self) {
             return that.$body.value(id, key);
         } else {
             that.$body.value(id, key, value);
-            //Ox.print('? ? ?', column, column.format)
+            if (key == self.unique) {
+                // unique id has changed
+                self.options.selected = self.options.selected.map(function(id_) {
+                    return id_ == id ? value : id_
+                });
+                id = value;
+            }
             $cell = getCell(id, key);
             $cell && $cell.html(formatValue(key, value));            
             if (key == self.options.sort[0].key) {
+                // sort key has changed
                 that.$body.sort();
             }
-            /* fixme: something like this is needed:
-            if (column.unique) {
-                that.$body.setId($item.data('id'), value);
-                $item.data({id: value});
-            }
-            */
             return that;
         }
     }

source/Ox.UI/js/Panel/Ox.SplitPanel.js

@@ -196,6 +196,8 @@ Ox.SplitPanel = function(options, self) {
         that.$elements[pos] = element
             .css(self.edges[2], (parseInt(element.css(self.edges[2])) || 0) + 'px')
             .css(self.edges[3], (parseInt(element.css(self.edges[3])) || 0) + 'px');
+        // fixme: it would be better to call removeElement here,
+        // or have a custom replaceElement function that removes event handlers
         self.options.elements[pos].element.replaceWith(element.$element.$element || element.$element);
         self.options.elements[pos].element = element;
         setSizes();

source/Ox.UI/js/Video/Ox.VideoPreview.js

@@ -65,6 +65,7 @@ Ox.VideoPreview = function(options, self) {
 
     function getFrameCSS() {
         var css = {};
+        // fixme: these are still wrong
         if (!self.options.scaleToFill) {
             css.width = self.options.width;
             css.height = Math.round(css.width / self.options.frameRatio);

source/Ox.UI/js/Window/Ox.Dialog.js

@@ -261,6 +261,7 @@ Ox.Dialog = function(options, self) {
     function getButtonById(id) {
         var ret = null;
         Ox.forEach(self.options.buttons, function(button) {
+            Ox.print(button.options(), button.options('id'))
             if (button.options && button.options('id') == id) {
                 ret = button;
                 return false;
@@ -271,6 +272,7 @@ Ox.Dialog = function(options, self) {
 
     function keypress(key) {
         var id = self.options.keys[key];
+        Ox.print(id, getButtonById(id));
         id && getButtonById(id).$element.trigger('click');
     }
 

source/Ox.js

@@ -431,6 +431,8 @@ Ox.clone <f> Returns a (shallow or deep) copy of an object or array
     'val'
     > (function() { a = {key: 'val'}; b = Ox.clone(a); a.key = null; return b.key; }())
     'val'
+    > Ox.clone(0)
+    0
 @*/
 
 Ox.clone = function(col, deep) {
@@ -442,7 +444,9 @@ Ox.clone = function(col, deep) {
                 ? Ox.clone(val, true) : val;
         });
     } else {
-        ret = Ox.isArray(col) ? col.slice() : Ox.extend({}, col);
+        ret = Ox.isArray(col) ? col.slice()
+            : Ox.isObject(col) ? Ox.extend({}, col)
+            : col;
     }
     return ret;
 };
@@ -670,10 +674,10 @@ Ox.getset = function(obj, args, callback, context) {
     var obj_ = Ox.clone(obj), ret;
     if (args.length == 0) {
         // getset([])
-        ret = obj;
+        ret = obj_;
     } else if (args.length == 1 && !Ox.isObject(args[0])) {
         // getset([key])
-        ret = obj[args[0]];
+        ret = Ox.clone(obj[args[0]]);
     } else {
         // getset([key, val]) or getset([{key: val, ...}])
         args = Ox.makeObject(args);