make find work in listcalendar; fill first page in static text lists with few items; listen to width/height changes in listmap and listcalendar; fix a bug where maps would load without zoombar

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

@@ -578,23 +578,34 @@ Ox.ListCalendar = function(options, self) {
     }
 
     function updateList(key, value) {
-        var query = {
+        var events;
-                conditions: Ox.merge(
+        if (value === '') {
+            events = Ox.clone(self.options.events);
+        } else {
+            events = [];
+            self.options.events.forEach(function(event) {
+                if ((
                     ['all', 'name'].indexOf(key) > -1
-                        ? [{key: 'name', value: value, operator: '='}] : [],
+                    && event.name.toLowerCase().indexOf(value) > -1
+                ) || (
                     ['all', 'alternativeNames'].indexOf(key) > -1
-                        ? [{key: 'alternativeNames', value: value, operator: '='}] : []
+                    && event.alternativeNames.join('\n').toLowerCase().indexOf(value) > -1
-                ),
+                )) {
-                operator: key == 'all' ? '|' : '&'
+                    events.push(event)
-            };
-        self.$list.options({
-            items: function(data, callback) {
-                return pandora.api.findEvents(Ox.extend(data, {
-                    query: query
-                }), callback);
                 }
             });
         }
+        self.$list.options({items: events});
+    }
+
+    self.setOption = function(key, value) {
+        if (key == 'height') {
+            // fixme: should be .resizeList
+            self.$list.size();
+        } else if (key == 'width') {
+            self.$calendar.resizeCalendar();
+        }
+    };
 
     return that;
 

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

@@ -192,7 +192,8 @@ Ox.List = function(options, self) {
     }
 
     if (!self.isAsync) {
-        self.$page = Ox.Element()
+        self.$pages = [];
+        self.$pages[0] = Ox.Element()
             .addClass('OxPage')
             .css({
                 left: self.listMargin / 2 + 'px',
@@ -426,6 +427,7 @@ Ox.List = function(options, self) {
                 var height = getHeight(),
                     lastItemHeight = height % self.options.itemHeight || self.options.itemHeight,
                     visibleItems = Math.ceil(height / self.options.itemHeight);
+                Ox.print('FILL', self.listLength, visibleItems);
                 if (self.listLength < visibleItems) {
                     Ox.range(self.listLength, visibleItems).forEach(function(v) {
                         var $item = Ox.ListItem({
@@ -685,7 +687,7 @@ Ox.List = function(options, self) {
     }
 
     function loadItems() {
-        self.$page.empty();
+        self.$pages[0].empty();
         self.$items = [];
         var timeC = 0, timeA = 0;
         self.options.items.forEach(function(item, pos) {
@@ -700,9 +702,10 @@ Ox.List = function(options, self) {
             timeC += +new Date() - time0;
             isSelected(pos) && self.$items[pos].addClass('OxSelected');
             var time0 = +new Date();
-            self.$items[pos].appendTo(self.$page);
+            self.$items[pos].appendTo(self.$pages[0]);
             timeA += +new Date() - time0;
         });
+        fillFirstPage();
         self.selected.length && scrollToPosition(self.selected[0]);
         Ox.print('CONSTRUCT:', timeC, 'APPEND:', timeA);
         // that.triggerEvent('init', {items: self.options.items.length});
@@ -1387,6 +1390,7 @@ Ox.List = function(options, self) {
             // fixme: this could be used to change the list
             // from sync to async or vice versa, which wouldn't work
             if (Ox.isArray(value)) {
+                self.listLength = value.length;
                 updateSelected();
                 updateSort();
             } else {

source/Ox.UI/js/Map/Ox.ListMap.js

@@ -824,15 +824,13 @@ Ox.ListMap = function(options, self) {
     setOption <f> setOption
     @*/
     self.setOption = function(key, value) {
-        Ox.print('ONCHANGE')
+        if (key == 'height') {
-        if (key == 'height' || key == 'width') {
+            self.$list.size();
-            Ox.print('ONCHANGE...')
+            self.$map.resizeMap();
-            self.$map.options({
-                height: self.options.height,
-                width: self.options.width
-            })
         } else if (key == 'selected') {
             self.$list.options({selected: value});
+        } else if (key == 'width') {
+            self.$map.resizeMap();
         }
     }
 

source/Ox.UI/js/Map/Ox.Map.js

@@ -743,14 +743,12 @@ Ox.Map = function(options, self) {
 
             Ox.print('init', mapBounds.getSouthWest(), mapBounds.getNorthEast(), mapBounds.getCenter())
 
-            updateFormElements();
-
             self.elevationService = new google.maps.ElevationService();
             self.geocoder = new google.maps.Geocoder();
             self.maxZoomService = new google.maps.MaxZoomService();
 
             self.center = mapBounds ? mapBounds.getCenter() : new google.maps.LatLng(0, 0);
-            self.zoom = 1; // fixme: should depend on height
+            self.zoom = self.minZoom;
             that.map = self.map = new google.maps.Map(self.$map.$element[0], {
                 center: self.center,
                 disableDefaultUI: true,
@@ -772,12 +770,14 @@ Ox.Map = function(options, self) {
                 selectPlace(self.options.selected, true);
             } else {
                 mapBounds && self.map.fitBounds(mapBounds);
-                ///*
                 if (self.map.getZoom() < self.minZoom) {
                     self.map.setZoom(self.minZoom);
                 }
-                //*/
             }
+            updateFormElements();
+
+            // fixme: this is just guessing
+            // setTimeout(updateFormElements, 2500);
 
             self.places = [];
             if (!self.isAsync) {
@@ -1239,7 +1239,12 @@ Ox.Map = function(options, self) {
 
     function updateFormElements() {
         var width = that.width();
-        self.$zoomInput && constructZoomInput();
+        if (self.options.zoombar) {
+            getMaxZoom(function(zoom) {
+                self.maxZoom = zoom;
+                constructZoomInput();
+            });
+        }
         if (self.options.statusbar) {
             self.$placeNameInput.options({
                 width: Math.floor((width - 132) / 2)
@@ -1275,9 +1280,9 @@ Ox.Map = function(options, self) {
 	}
 
     self.setOption = function(key, value) {
-        /*if (key == 'height' || key == 'width') {
+        if (key == 'height' || key == 'width') {
-            resizeMap();
+            that.resizeMap();
-        } else */if (key == 'places') {
+        } else if (key == 'places') {
             //fixme: should zoom to new bounds
             zoom(0);
         } else if (key == 'selected') {
@@ -1385,7 +1390,6 @@ Ox.Map = function(options, self) {
         self.options.width = that.$element.width();
         self.mapHeight = getMapHeight();
         self.minZoom = getMinZoom();
-        Ox.print('map w/h', self.options.width, self.options.height)
         self.$map.css({
             height: self.mapHeight + 'px',
             width: self.options.width + 'px'

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

@@ -512,6 +512,10 @@ Ox.Dialog = function(options, self) {
 
     function resizeend() {
         that.unwrap();
+        that.triggerEvent('resizeend', {
+            width: self.options.width,
+            height: self.options.height
+        });
     }
 
     function setButtons() {