Ext.onReady(function() {
    
    // Get the featured project container 
    var featuredProject = Ext.get('featuredProject');
    // Bind a mask to the featuredProject update manager
    var mask = new Ext.LoadMask(featuredProject, {msg: 'Updating featured project...'});
    
    // Function called on click of a region
    // Makes ajax call and updates featured project container
    var regionClicked = function(e) {
        
        var regionId;

        if(typeof e == 'object'){
            regionId = e.target.id; 
        } else {
            regionId = e;
        }
        
        // Submit the ajax call
        featuredProject.load({
            method: 'get',
            url: 'projects/featured_project/' + regionId
        });
           
    }
    
    // Set on click even for all regions
    var regions = Ext.select('.region').on('click', regionClicked, this, {preventDefault: true});
    
    // Show first regions featured project
    //regionClicked(regions.elements[0].id);
});