Mozillians Country Select

HTML

<script src="https://api.tiles.mapbox.com/mapbox.js/v1.6.2/mapbox.js"></script>
<link rel="stylesheet" href="https://api.tiles.mapbox.com/mapbox.js/v1.6.2/mapbox.css">
<link rel="stylesheet" href="http://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-locatecontrol/v0.24.0/L.Control.Locate.css">
<script src="http://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-locatecontrol/v0.24.0/L.Control.Locate.js"></script>
<div id='map'></div>

<div class="results">
    <div>Country: <span id="result_country"></span></div>
    <div>Region: <span id="result_region"></span></div>
    <div>City: <span id="result_city"></span></div>
</div>

CSS

select{
    width: 100%;
}

#map { width:100%; height:180px; }

JavaScript

var mapboxString = 'fabmud.hd0kn6ee';

// DOM elements
var result_country = $('#result_country');
var result_region = $('#result_region');
var result_city = $('#result_city');

var marker_added = false;

function reverseGeocode(coordinates){
    var url = 'http://api.tiles.mapbox.com/v3/'
    +mapboxString
    +'/geocode/'
    +coordinates.lon
    +','
    +coordinates.lat
    +'.json';
    
    $.ajax({
        url: url
    })
    .success(function(data){
        console.log ('reverse data', data);
    });
}

function displayResults(args){
    console.log('data',args);
    args.data = args.data || [];
    console.log('display results',args.data);
    result_country.text('');
    result_region.text('');
    result_city.text('');
    for(var i=0; i<args.data.length; i++){
        if(args.data[i].type === 'country'){
            result_country.text(args.data[i].name);
        }
        if(args.data[i].type === 'province'){
            result_region.text(args.data[i].name);
        }
        if(args.data[i].type === 'city'){
            result_city.text(args.data[i].name);
        }
    }
    if(args.bounds === undefined){
        map.center(args.latlng);
    }
}

var geocoder = L.mapbox.geocoder(mapboxString);
var map = L.mapbox.map('map', mapboxString)
          .addControl(
                L.mapbox.geocoderControl(mapboxString, {})
                .on('select',displayResults)
                .on('found',displayResults)
            )
            .addControl(
                L.control.locate()
            ).on('locationfound', displayResults)
;

map.setZoom(0);

L.marker([50.5, 30.5], {draggable:true}).addTo(map);

function centerMap(err,data){
    map.fitBounds(data.lbounds);
}

L.marker([50.5, 30.5]).addTo(map);