in listcalendar, cache formatted duration strings

source/Ox.UI/js/Calendar/Ox.ListCalendar.js

@@ -26,6 +26,8 @@ Ox.ListCalendar = function(options, self) {
             height: self.options.height + 'px'
         });
 
+    self.durationCache = {};
+
     Ox.print('EVENT[0]', self.options.events[0])
 
     self.columns = [
@@ -59,11 +61,6 @@ Ox.ListCalendar = function(options, self) {
             width: 64
         },
         {
-            /*
-            format: function(value, data) {
-                return Ox.formatDateRange(data.start, data.end, true).split(' - ')[0];
-            },
-            */
             id: 'start',
             map: function(value) {
                 return Ox.parseDate(value);
@@ -74,11 +71,6 @@ Ox.ListCalendar = function(options, self) {
             width: 144
         },
         {
-            /*
-            format: function(value, data) {
-                return Ox.formatDateRange(data.start, data.end, true).split(' - ')[1];
-            },
-            */
             id: 'end',
             map: function(value) {
                 return Ox.parseDate(value);
@@ -90,7 +82,12 @@ Ox.ListCalendar = function(options, self) {
         },
         {
             format: function(value, data) {
-                return Ox.formatDateRangeDuration(data.start, data.end, true);
+                // return Ox.formatDateRangeDuration(data.start, data.end, true);
+                var key = data.start + ' - ' + data.end;
+                if (!self.durationCache[key]) {
+                    self.durationCache[key] = Ox.formatDateRangeDuration(data.start, data.end, true);
+                }
+                return self.durationCache[key]; 
             },
             id: 'id',
             map: function(value, data) {
@@ -491,26 +488,25 @@ Ox.ListCalendar = function(options, self) {
         var id = self.selectedEvent,
             index = Ox.getPositionById(self.options.events, id),
             data = {id: id};
-        self.options.events[index][key] = value;
-        data[key] = value;
-        self.$list.value(id, key, value);
-        if (['name', 'type', 'start', 'end'].indexOf(key) > -1) {
-            self.$calendar.editEvent(id, key, value);
-        }
-        if (key == 'name') {
-            self.$eventName.options({title: value});
-        } else if (['start', 'end'].indexOf(key) > -1) {
-            self.$durationInput.options({
-                value: Ox.formatDateRangeDuration(
-                    self.$startInput.options('value'),
-                    self.$endInput.options('value')
-                        || Ox.formatDate(new Date(), '%Y-%m-%d %H%:%M:%S'),
-                    true
-                )
-            });
-        }
         self.options.editEvent(data, function(result) {
-            // ...
+            self.options.events[index][key] = value;
+            data[key] = value;
+            self.$list.value(id, key, value);
+            if (['name', 'type', 'start', 'end'].indexOf(key) > -1) {
+                self.$calendar.editEvent(id, key, value);
+            }
+            if (key == 'name') {
+                self.$eventName.options({title: value});
+            } else if (['start', 'end'].indexOf(key) > -1) {
+                self.$durationInput.options({
+                    value: Ox.formatDateRangeDuration(
+                        self.$startInput.options('value'),
+                        self.$endInput.options('value')
+                            || Ox.formatDate(new Date(), '%Y-%m-%d %H%:%M:%S'),
+                        true
+                    )
+                });
+            }
         });
     }
 
@@ -544,14 +540,13 @@ Ox.ListCalendar = function(options, self) {
     function removeEvent() {
         var id = self.selectedEvent,
             index = Ox.getPositionById(self.options.events, id);
-        self.options.events.splice(index, 1);
-        var time0 = +new Date();
-        self.$list.options({items: Ox.clone(self.options.events, true)});
-        Ox.print('TIME TO SET LIST OPTIONS:', +new Date() - time0);
-        self.$calendar.removeEvent();
-        selectEvent({});
         self.options.removeEvent({id: id}, function(result) {
-            // ...
+            self.options.events.splice(index, 1);
+            var time0 = +new Date();
+            self.$list.options({items: Ox.clone(self.options.events, true)});
+            Ox.print('TIME TO SET LIST OPTIONS:', +new Date() - time0);
+            self.$calendar.removeEvent();
+            selectEvent({});
         });
     }
 

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

@@ -413,6 +413,7 @@ Ox.TextList = function(options, self) {
                     }
                 });
             } else {
+                // this is faster
                 $cell = $('<div>');
             }
             $cell.addClass(