make the flag icon an actual control

This commit is contained in:
rolux 2012-04-03 16:45:49 +02:00
parent 9f9c2df862
commit 47976fb6fb

View file

@ -425,7 +425,15 @@ Ox.Map = function(options, self) {
self.$placeControls = { self.$placeControls = {
flag: Ox.Element() flag: Ox.Element()
.addClass('OxPlaceControl OxPlaceFlag'), .addClass('OxPlaceControl OxPlaceFlag')
.bindEvent({
anyclick: function() {
var country = this.data('country');
country && getPlaceByName(country, function(place) {
place && self.map.fitBounds(place.bounds);
});
}
}),
name: Ox.Label({ name: Ox.Label({
textAlign: 'center', textAlign: 'center',
tooltip: 'Click to pan, doubleclick to zoom' tooltip: 'Click to pan, doubleclick to zoom'
@ -1180,13 +1188,23 @@ Ox.Map = function(options, self) {
function setPlaceControls(place) { function setPlaceControls(place) {
var $placeControls = that.$element.find('.OxPlaceControl'), var $placeControls = that.$element.find('.OxPlaceControl'),
country,
isVisible = self.$placeControls.name.is(':visible'); isVisible = self.$placeControls.name.is(':visible');
if (place) { if (place) {
self.$placeControls.flag.empty().append( country = place.geoname.indexOf(', ') > -1
? place.geoname.split(', ').pop()
: '';
self.$placeControls.flag.options({
tooltip: country ? 'Zoom to ' + country : ''
})
.data({country: country})
.empty()
.append(
$('<img>').attr({ $('<img>').attr({
src: Ox.getFlagByGeoname(place.geoname, 16) src: Ox.getFlagByGeoname(place.geoname, 16)
}) })
).show(); )
.show();
self.$placeControls.name.options({ self.$placeControls.name.options({
title: place.name ||'<span class="OxLight">Unnamed</span>' title: place.name ||'<span class="OxLight">Unnamed</span>'
}); });