fixes for list and map
This commit is contained in:
rlx
parent
e815b2f2e1
commit
6496f4d0f6
4 changed files with 1350 additions and 436 deletions
|
|
@ -7415,36 +7415,38 @@ requires
|
|||
}
|
||||
|
||||
function scroll() {
|
||||
var page = self.page;
|
||||
self.scrollTimeout && clearTimeout(self.scrollTimeout);
|
||||
self.scrollTimeout = setTimeout(function() {
|
||||
self.scrollTimeout = 0;
|
||||
self.page = getPage();
|
||||
if (self.page != page) {
|
||||
//Ox.print('page', page, '-->', self.page);
|
||||
}
|
||||
if (self.page == page - 1) {
|
||||
unloadPage(self.page + 2);
|
||||
loadPage(self.page - 1);
|
||||
} else if (self.page == page + 1) {
|
||||
unloadPage(self.page - 2);
|
||||
loadPage(self.page + 1);
|
||||
} else if (self.page == page - 2) {
|
||||
unloadPage(self.page + 3);
|
||||
unloadPage(self.page + 2);
|
||||
loadPage(self.page);
|
||||
loadPage(self.page - 1);
|
||||
} else if (self.page == page + 2) {
|
||||
unloadPage(self.page - 3);
|
||||
unloadPage(self.page - 2);
|
||||
loadPage(self.page);
|
||||
loadPage(self.page + 1);
|
||||
} else if (self.page != page) {
|
||||
unloadPages(page);
|
||||
loadPages(self.page);
|
||||
}
|
||||
}, 250);
|
||||
that.gainFocus();
|
||||
if (Ox.isFunction(self.options.items)) {
|
||||
var page = self.page;
|
||||
self.scrollTimeout && clearTimeout(self.scrollTimeout);
|
||||
self.scrollTimeout = setTimeout(function() {
|
||||
self.scrollTimeout = 0;
|
||||
self.page = getPage();
|
||||
if (self.page != page) {
|
||||
//Ox.print('page', page, '-->', self.page);
|
||||
}
|
||||
if (self.page == page - 1) {
|
||||
unloadPage(self.page + 2);
|
||||
loadPage(self.page - 1);
|
||||
} else if (self.page == page + 1) {
|
||||
unloadPage(self.page - 2);
|
||||
loadPage(self.page + 1);
|
||||
} else if (self.page == page - 2) {
|
||||
unloadPage(self.page + 3);
|
||||
unloadPage(self.page + 2);
|
||||
loadPage(self.page);
|
||||
loadPage(self.page - 1);
|
||||
} else if (self.page == page + 2) {
|
||||
unloadPage(self.page - 3);
|
||||
unloadPage(self.page - 2);
|
||||
loadPage(self.page);
|
||||
loadPage(self.page + 1);
|
||||
} else if (self.page != page) {
|
||||
unloadPages(page);
|
||||
loadPages(self.page);
|
||||
}
|
||||
}, 250);
|
||||
}
|
||||
//that.gainFocus();
|
||||
}
|
||||
|
||||
function scrollPageDown() {
|
||||
|
|
@ -7749,7 +7751,7 @@ requires
|
|||
that.addItems = function(pos, items) {
|
||||
var $items = [],
|
||||
length = items.length
|
||||
first = self.$items.length == 0;
|
||||
//first = self.$items.length == 0;
|
||||
self.selected.forEach(function(v, i) {
|
||||
if (v >= pos) {
|
||||
self.selected[i] += length;
|
||||
|
|
@ -7777,7 +7779,7 @@ requires
|
|||
|
||||
self.options.items.splice.apply(self.options.items, $.merge([pos, 0], items));
|
||||
self.$items.splice.apply(self.$items, $.merge([pos, 0], $items));
|
||||
if(first)
|
||||
//if(first)
|
||||
loadItems();
|
||||
updatePositions();
|
||||
}
|
||||
|
|
@ -9275,12 +9277,14 @@ requires
|
|||
|
||||
function selectItem(event, data) {
|
||||
Ox.print('selectItem', data.ids[0])
|
||||
self.$map.options({selected: data.ids.length ? data.ids[0] : ''});
|
||||
var id = data.ids.length ? data.ids[0] : null;
|
||||
self.$map.options({selected: id});
|
||||
id && self.$map.panToPlace();
|
||||
}
|
||||
|
||||
function selectPlace(event, data) {
|
||||
Ox.print('selectPlace', data, data.id)
|
||||
data.id[0] != '_' && self.$list.options({
|
||||
data.id && data.id[0] != '_' && self.$list.options({
|
||||
selected: data.id ? [data.id] : []
|
||||
});
|
||||
}
|
||||
|
|
@ -9344,6 +9348,9 @@ requires
|
|||
.css({
|
||||
width: self.options.width + 'px',
|
||||
height: self.options.height + 'px'
|
||||
})
|
||||
.click(function() {
|
||||
that.gainFocus();
|
||||
})
|
||||
.bindEvent({
|
||||
key_0: function() {
|
||||
|
|
@ -9547,6 +9554,8 @@ requires
|
|||
}
|
||||
|
||||
function addPlaceToMap(place) {
|
||||
// via find, click, or new place button
|
||||
var exists = false;
|
||||
if (!place) {
|
||||
var bounds = self.map.getBounds(),
|
||||
center = self.map.getCenter(),
|
||||
|
|
@ -9571,11 +9580,19 @@ requires
|
|||
east: northeast.lng()
|
||||
});
|
||||
}
|
||||
Ox.print('addPlaceToMap', place)
|
||||
Ox.print('self.resultPlace', self.resultPlace)
|
||||
self.resultPlace && self.resultPlace.remove();
|
||||
self.resultPlace = place;
|
||||
place.add();
|
||||
Ox.forEach(self.places, function(p, i) {
|
||||
if (place.bounds.equals(p.bounds)) {
|
||||
place = p;
|
||||
exists = true;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
if (!exists) {
|
||||
self.resultPlace && self.resultPlace.remove();
|
||||
self.resultPlace = place;
|
||||
place.add();
|
||||
}
|
||||
Ox.print('EXISTS', exists, 'SELECTING', place.id)
|
||||
selectPlace(place.id);
|
||||
}
|
||||
|
||||
|
|
@ -9583,7 +9600,6 @@ requires
|
|||
var place = getSelectedPlace();
|
||||
if (self.options.selected == place.id) {
|
||||
self.options.selected = place.id.substr(1);
|
||||
self.selected = self.options.selected;
|
||||
}
|
||||
place.id = place.id.substr(1); // fixme: NOT SAFE!
|
||||
place.name = self.$placeNameInput.value();
|
||||
|
|
@ -9597,7 +9613,6 @@ requires
|
|||
}
|
||||
|
||||
function boundsChanged() {
|
||||
Ox.print('boundsChanged');
|
||||
self.boundsChanged = true;
|
||||
}
|
||||
|
||||
|
|
@ -9609,7 +9624,6 @@ requires
|
|||
}
|
||||
|
||||
function centerChanged() {
|
||||
Ox.print('centerChanged')
|
||||
self.centerChanged = true;
|
||||
}
|
||||
|
||||
|
|
@ -9619,12 +9633,13 @@ requires
|
|||
|
||||
function clickMap(event) {
|
||||
Ox.print('Ox.Map clickMap')
|
||||
that.gainFocus();
|
||||
if (self.options.clickable/* && !editing()*/) {
|
||||
getPlaceByLatLng(event.latLng, self.map.getBounds(), function(place) {
|
||||
if (place) {
|
||||
addPlaceToMap(place);
|
||||
selectPlace(place.id);
|
||||
//selectPlace(place.id);
|
||||
} else {
|
||||
selectPlace(null);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
@ -9779,6 +9794,23 @@ requires
|
|||
return position;
|
||||
}
|
||||
|
||||
function getSelectedMarker() {
|
||||
// needed in case self.options.selected
|
||||
// is changed from outside
|
||||
var id = null;
|
||||
if (self.resultPlace && self.resultPlace.selected) {
|
||||
id = self.resultPlace.id;
|
||||
} else {
|
||||
self.places.forEach(function(place) {
|
||||
if (place.selected) {
|
||||
id = place.id;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
}
|
||||
return id;
|
||||
}
|
||||
|
||||
function getSelectedPlace() {
|
||||
return self.options.selected ?
|
||||
getPlaceById(self.options.selected) : null;
|
||||
|
|
@ -9832,7 +9864,7 @@ requires
|
|||
}, place))/*.add()*/;
|
||||
});
|
||||
google.maps.event.trigger(self.map, 'resize');
|
||||
that.gainFocus();
|
||||
//that.gainFocus();
|
||||
that.triggerEvent('load');
|
||||
}
|
||||
|
||||
|
|
@ -9977,39 +10009,27 @@ requires
|
|||
}
|
||||
|
||||
function selectPlace(id) {
|
||||
Ox.print('Ox.Map selectPlace()', id, self.selected)
|
||||
var place;
|
||||
if (id != self.selected) {
|
||||
place = getPlaceById(self.selected);
|
||||
var place,
|
||||
selected = getSelectedMarker();
|
||||
Ox.print('Ox.Map selectPlace()', id, selected);
|
||||
if (id != selected) {
|
||||
place = getPlaceById(selected);
|
||||
place && place.deselect();
|
||||
place = getPlaceById(id);
|
||||
place && place.select();
|
||||
self.selected = id;
|
||||
self.options.selected = id;
|
||||
setStatus();
|
||||
that.triggerEvent('selectplace', place);
|
||||
}
|
||||
if (id) {
|
||||
//self.map.setCenter(place.center);
|
||||
/*
|
||||
if (
|
||||
self.map.getBounds().contains(place.bounds.getSouthWest()) &&
|
||||
self.map.getBounds().contains(place.bounds.getNorthEast())
|
||||
) {
|
||||
} else {
|
||||
self.map.fitBounds(place.bounds);
|
||||
}
|
||||
*/
|
||||
}
|
||||
//Ox.print('????', place)
|
||||
};
|
||||
|
||||
function setStatus() {
|
||||
Ox.print('setStatus()', self.options.selected)
|
||||
var disabled, place, title;
|
||||
if (self.options.statusbar) {
|
||||
if (self.options.selected) {
|
||||
place = getSelectedPlace();
|
||||
place = getSelectedPlace();
|
||||
if (place) {
|
||||
Ox.print('P L A C E', place)
|
||||
title = place.id[0] == '_' ? 'Add Place' : 'Remove Place';
|
||||
} else {
|
||||
title = 'New Place';
|
||||
|
|
@ -10017,17 +10037,18 @@ requires
|
|||
disabled = place && !place.editable;
|
||||
self.$placeNameInput.options({
|
||||
disabled: disabled,
|
||||
value: self.options.selected ? place.name : ''
|
||||
value: place ? place.name : ''
|
||||
});
|
||||
self.$placeGeonameInput.options({
|
||||
disabled: disabled,
|
||||
value: self.options.selected ? place.geoname : ''
|
||||
value: place ? place.geoname : ''
|
||||
});
|
||||
self.$placeButton.options({
|
||||
disabled: disabled,
|
||||
title: title
|
||||
});
|
||||
}
|
||||
Ox.print('STATUS DONE');
|
||||
}
|
||||
|
||||
function submitFind(event, data) {
|
||||
|
|
@ -10108,11 +10129,7 @@ requires
|
|||
getPlaceByName(name, function(place) {
|
||||
if (place) {
|
||||
addPlaceToMap(place);
|
||||
self.resultPlace = place;
|
||||
selectPlace(place.id);
|
||||
self.bounds = place.bounds;
|
||||
Ox.print('SELF.BOUNDS', self.bounds)
|
||||
self.map.fitBounds(self.bounds);
|
||||
self.map.fitBounds(place.bounds);
|
||||
}
|
||||
callback(place);
|
||||
});
|
||||
|
|
@ -10263,10 +10280,10 @@ requires
|
|||
if (editable()) {
|
||||
that.editing = true;
|
||||
that.original = {
|
||||
east: that.east,
|
||||
north: that.north,
|
||||
south: that.south,
|
||||
west: that.west
|
||||
west: that.west,
|
||||
north: that.north,
|
||||
east: that.east
|
||||
};
|
||||
that.marker.edit();
|
||||
that.rectangle.select();
|
||||
|
|
@ -10285,6 +10302,7 @@ requires
|
|||
|
||||
that.select = function() {
|
||||
that.selected = true;
|
||||
!that.visible && that.add();
|
||||
that.marker.update();
|
||||
that.rectangle.add();
|
||||
return that;
|
||||
|
|
@ -10335,7 +10353,8 @@ requires
|
|||
that.marker = new google.maps.Marker({
|
||||
raiseOnDrag: false,
|
||||
shape: {coords: [8, 8, 8], type: 'circle'},
|
||||
title: that.place.name
|
||||
title: that.place.name,
|
||||
//zIndex: 1000
|
||||
});
|
||||
|
||||
setOptions();
|
||||
|
|
@ -10352,15 +10371,6 @@ requires
|
|||
}
|
||||
}
|
||||
|
||||
function correctLng(lng) {
|
||||
if (lng < -180) {
|
||||
lng += 360;
|
||||
} else if (lng > 180) {
|
||||
lng -= 360;
|
||||
}
|
||||
return lng;
|
||||
}
|
||||
|
||||
function dragstart(e) {
|
||||
|
||||
}
|
||||
|
|
@ -10403,6 +10413,7 @@ requires
|
|||
// after setting draggable from true to false
|
||||
var fix = that.marker.getDraggable() && !that.place.editing;
|
||||
that.marker.setOptions({
|
||||
// fixme: cursor remains pointer
|
||||
cursor: that.place.editing ? 'move' : 'pointer',
|
||||
draggable: that.place.editing,
|
||||
icon: new google.maps.MarkerImage(
|
||||
|
|
@ -10530,7 +10541,6 @@ requires
|
|||
|
||||
that.select = function() {
|
||||
setOptions();
|
||||
Ox.print('MARKERS', that.markers)
|
||||
Ox.forEach(that.markers, function(marker) {
|
||||
marker.add();
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,48 +1,37 @@
|
|||
$(function() {
|
||||
Ox.theme('modern');
|
||||
var listmap = new Ox.ListMap({
|
||||
height: window.innerHeight,
|
||||
places: [
|
||||
{
|
||||
editable: true,
|
||||
flag: 'UK',
|
||||
geoname: 'Westminster, London, UK',
|
||||
id: '0',
|
||||
name: 'London',
|
||||
//lat: 51.5001524,
|
||||
lat: 51.52670875,
|
||||
lng: -0.1262362,
|
||||
south: 51.3493528,
|
||||
west: -0.378358,
|
||||
north: 51.7040647,
|
||||
east: 0.1502295
|
||||
},
|
||||
{
|
||||
editable: false,
|
||||
flag: 'FR',
|
||||
geoname: 'Paris, France',
|
||||
id: '1',
|
||||
name: 'Paris',
|
||||
lat: 48.8566667,
|
||||
lng: 2.3509871,
|
||||
south: 48.8155414,
|
||||
west: 2.2241006,
|
||||
north: 48.9021461,
|
||||
east: 2.4699099,
|
||||
}
|
||||
],
|
||||
width: window.innerWidth
|
||||
})
|
||||
.appendTo($('body'));
|
||||
$.getJSON('../map/json/countries.json', function(data) {
|
||||
|
||||
$(window).resize(function() {
|
||||
Ox.print('RESIZE', window.innerHeight)
|
||||
listmap.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth
|
||||
Ox.theme('modern');
|
||||
var listmap = new Ox.ListMap({
|
||||
height: window.innerHeight,
|
||||
places: data.map(function(place) {
|
||||
return Ox.extend({
|
||||
countryCode: place.code,
|
||||
editable: true,
|
||||
flag: place.code,
|
||||
geoname: place.name,
|
||||
name: place.name,
|
||||
size: place.size,
|
||||
type: 'country',
|
||||
lat: place.lat,
|
||||
lng: place.lng,
|
||||
south: place.south,
|
||||
west: place.west,
|
||||
north: place.north,
|
||||
east: place.east
|
||||
});
|
||||
}),
|
||||
width: window.innerWidth
|
||||
})
|
||||
.appendTo($('body'));
|
||||
$(window).resize(function() {
|
||||
Ox.print('RESIZE', window.innerHeight)
|
||||
listmap.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth
|
||||
});
|
||||
});
|
||||
|
||||
window.listmap = listmap;
|
||||
});
|
||||
|
||||
window.listmap = listmap;
|
||||
|
||||
});
|
||||
|
|
@ -10,9 +10,15 @@ $(function() {
|
|||
height: height,
|
||||
places: data.map(function(place) {
|
||||
return Ox.extend({
|
||||
countryCode: place.code,
|
||||
editable: true,
|
||||
flag: place.code,
|
||||
geoname: place.name,
|
||||
name: place.name,
|
||||
size: place.size,
|
||||
type: 'Country',
|
||||
lat: place.lat,
|
||||
lng: place.lng,
|
||||
south: place.south,
|
||||
west: place.west,
|
||||
north: place.north,
|
||||
|
|
@ -73,7 +79,7 @@ $(function() {
|
|||
sizeNorthSouth: data.sizeNorthSouth,
|
||||
south: data.south,
|
||||
west: data.west,
|
||||
types: data.types
|
||||
type: data.type
|
||||
}
|
||||
}));
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue