0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

improve listmap editing functionality

Browse source
This commit is contained in:
rolux 2011-05-24 12:44:34 +02:00
parent 76606689d7
commit 02442a24f7
6 changed files with 81 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
demos/listmap/js/listmap.js
View file

@ -9,6 +9,7 @@ Ox.load('UI', {
height: window.innerHeight,
places: Ox.map(Ox.COUNTRIES, function(place) {
return {
alternativeNames: place.googleName ? [place.googleName] : [],
area: place.area,
countryCode: place.code,
editable: true,

11
source/Ox.UI/js/Form/Ox.ArrayInput.js
View file

@ -132,9 +132,14 @@ Ox.ArrayInput = function(options, self) {
self.setOption = function(key, value) {
if (key == 'value') {
return Ox.map(self.$input, function($input) {
var value = $input.value();
return value === '' ? null : value;
if (self.options.value.length == 0) {
self.options.value = [''];
}
self.$input && self.$input.forEach(function($input, i) {
removeInput(i);
});
self.options.value.forEach(function(value, i) {
addInput(i, value);
});
} else if (key == 'width') {
setWidths();

2
source/Ox.UI/js/Form/Ox.Form.js
View file

@ -123,7 +123,7 @@ Ox.Form = function(options, self) {
} else {
Ox.forEach(arguments[0], function(value, key) {
var index = getItemIndexById(key);
//index > -1 && Ox.print(key, value)
index > -1 && Ox.print(':::::::', key, value)
index > -1 && self.options.items[index].options({value: value});
});
return that;

11
source/Ox.UI/js/List/Ox.List.js
View file

@ -1240,11 +1240,16 @@ Ox.List = function(options, self) {
}
self.setOption = function(key, value) {
//Ox.print('list onChange', key, value);
Ox.print('list setOption', key, value);
if (key == 'items') {
updateQuery();
if (Ox.typeOf(value) == 'array') {
loadItems();
updateSort();
} else {
updateQuery();
}
} else if (key == 'selected') {
Ox.print('onChange selected', value)
Ox.print('setOption selected', value)
setSelected(value);
}
};

9
source/Ox.UI/js/List/Ox.TextList.js
View file

@ -626,6 +626,7 @@ Ox.TextList = function(options, self) {
}
self.setOption = function(key, value) {
Ox.print('---------------------------- TextList setOption', key, value)
if (key == 'items') {
that.$body.options(key, value);
} else if (key == 'paste') {
@ -638,6 +639,14 @@ Ox.TextList = function(options, self) {
// fixme: doesn't work, doesn't return that
that.closePreview = that.$body.closePreview;
that.addItem = function(item) {
/*
self.options.items.push(item);
that.$body.options({items: self.options.items});
//that.$body.options({selected: [item.id]});
*/
}
that.editCell = function(id, key) {
Ox.print('editCell', id, key)
var $item = getItem(id),

103
source/Ox.UI/js/Map/Ox.ListMap.js
View file

@ -86,6 +86,18 @@ Ox.ListMap = function(options, self) {
visible: true,
width: 144
},
{
editable: false,
format: function(value) {
return value.join('; ');
},
id: 'alternativeNames',
removable: false,
operator: '+',
title: 'Alternative Names',
visible: true,
width: 144
},
{
editable: true,
id: 'geoname',
@ -222,7 +234,7 @@ Ox.ListMap = function(options, self) {
columns: self.columns,
columnsRemovable: true,
columnsVisible: true,
items: self.options.places,
items: Ox.clone(self.options.places),
pageLength: 100,
scrollbarVisible: true,
sort: [
@ -303,6 +315,10 @@ Ox.ListMap = function(options, self) {
//sort: true,
values: [],
width: 240
}).bindEvent({
change: function(data) {
Ox.print('CHANGE........', data)
}
}),
], ['South', 'West', 'North', 'East', 'Latitude', 'Longitude'].map(function(v) {
var id = (
@ -325,10 +341,10 @@ Ox.ListMap = function(options, self) {
}
});
}), [
Ox.Input({
self.$areaInput = Ox.Input({
disabled: true,
id: 'size',
label: 'Size',
id: 'area',
label: 'Area',
labelWidth: 80,
textAlign: 'right',
width: 240
@ -346,53 +362,44 @@ Ox.ListMap = function(options, self) {
size: 24
});
self.$newPlaceButton = Ox.Button({
self.$placeButton = Ox.Button({
title: 'New Place',
width: 96
})
.css({float: 'left', margin: '4px'})
.css({float: 'left', margin: '4px 2px 4px 4px'})
.bindEvent({
click: function() {
self.$map.newPlace();
var title = self.$placeButton.options('title');
if (title == 'New Place') {
self.$map.newPlace();
self.$placeButton.options({title: 'Add Place'})
} else if (title == 'Add Place') {
var place = self.$placeForm.values();
place.id = self.selectedPlace.substr(1); // fixme: safe?
self.options.places.push(place);
self.$map.addPlace(place);
self.$list.options({items: Ox.clone(self.options.places)});
self.$list.options({selected: [place.id]});
//self.$list.addItem(place);
self.$placeButton.options({title: 'Remove Place'})
} else if (title == 'Remove Place') {
var index = Ox.getPositionById(self.options.places, self.selectedPlace);
self.options.places.splice(index, 1);
self.$list.options({items: Ox.clone(self.options.places)});
self.$map.removePlace();
self.$placeButton.options({title: 'Add Place'});
}
Ox.print('PLACES.LENGTH', self.options.places.length)
Ox.print('ITEMS.LENGTH', self.$list.options('items').length)
}
})
.appendTo(self.$placeStatusbar);
self.$removePlaceButton = Ox.Button({
title: 'Remove Place',
width: 96
})
.css({float: 'left', margin: '4px'})
.hide()
.bindEvent({
click: function() {
self.$map.removePlace(self.selectedPlace);
self.$removePlaceButton.hide();
self.$addPlaceButton.show();
}
})
.appendTo(self.$placeStatusbar);
self.$addPlaceButton = Ox.Button({
title: 'Add Place',
width: 96
})
.css({float: 'left', margin: '4px'})
.bindEvent({
click: function() {
self.$map.addPlace(self.$placeForm.values);
self.$addPlaceButton.hide();
self.$removePlaceButton.show();
}
})
.hide()
.appendTo(self.$placeStatusbar);
self.$revertPlaceButton = Ox.Button({
self.$revertButton = Ox.Button({
title: 'Revert',
width: 96
})
.css({float: 'right', margin: '4px'})
.css({float: 'right', margin: '4px 4px 4px 2px'})
.hide()
.appendTo(self.$placeStatusbar);
@ -440,6 +447,7 @@ Ox.ListMap = function(options, self) {
},
changeplace: function(event, data) {
self.$placeForm.values(Ox.map(data, function(val, key) {
// fixme: no size key anymore
return key == 'size' ? Ox.formatArea(val) : val;
})).show();
},
@ -506,7 +514,7 @@ Ox.ListMap = function(options, self) {
}
}),
resizable: true,
resize: [128, 256, 384],
resize: [204, 256, 384],
size: 256
}
],
@ -551,26 +559,23 @@ Ox.ListMap = function(options, self) {
});
self.$placeTitleName.options({title: place.geoname || ''});
self.$placeTitle.show();
Ox.print('>>>>', place)
self.$placeForm.values(Ox.map(place, function(val, key) {
return key == 'size' ? Ox.formatArea(val) : val;
})).show();
self.$newPlaceButton.hide();
self.$addPlaceButton[isResult ? 'show' : 'hide']();
self.$removePlaceButton[isResult ? 'hide' : 'show']();
self.$revertPlaceButton.options({disabled: true}).show();
self.$placeButton.options({title: isResult ? 'Add Place' : 'Remove Place'});
self.$revertButton.options({disabled: true}).show();
} else {
self.selectedPlace = null;
self.$placeTitle.hide();
self.$placeForm.hide();
self.$newPlaceButton.show();
self.$addPlaceButton.hide();
self.$removePlaceButton.hide();
self.$revertPlaceButton.hide();
self.$placeButton.options({title: 'New Place'});
self.$revertButton.hide();
}
}
function toFixed(val) {
return val.toFixed(8);
return Ox.isNumber(val) ? val.toFixed(8) : val; // fixme: why can a string be passed ??
}
/*@