// market_research.js
// ------------------
// Handles the functionality of the Market Research statistics page.

// FUNCTIONS

// Updates the chart on the page using the latest settings.
function UpdateChart() {

    // Show loading animation
    $( '.loading-message' ).show();

    // Start with default settings
    var settings = {
        statistic: 'mean',
        rollingAverage: 'c',
        quartile: 'a',
        residenceType: '',
        state: 'CA',
        cityId: '55',
        zipCode: 'a', 
        size: 'i',
        timeSpan: 'e',
        service: 'chart',
        accountId: '123456'
    };
    
    // Update settings based on current selections
    
    // ... city and state
    var ddlCity = $( '#DdlCity' )[ 0 ];
    settings.cityId = ddlCity.value;
    var cityText = ddlCity.options[ ddlCity.selectedIndex ].text;
    settings.state = cityText.match( '.+?, ([A-Z]{2})' )[ 1 ];
    
    // ... zip code
    settings.zipCode = $( '#DdlZipCode' ).val();
    
    // ... statistic
    settings.statistic = $( '#DdlStatistic' ).val();
    
    // ... residence type
    settings.residenceType = $( '#DdlResidenceType' ).val();
    
    // ... quartile
    settings.quartile = $( '#DdlQuartile' ).val();
    
    // Assemble the chart URL
    var chartUrl = 'http://charts.altosresearch.com/altos/app' + 
        '?s=' + settings.statistic + 
        '&ra=' + settings.rollingAverage + 
        '&q=' + settings.quartile + 
        '&rt=' + settings.residenceType + 
        '&st=' + settings.state + 
        '&cid=' + settings.cityId + 
        '&z=' + settings.zipCode + 
        '&sz=' + settings.size + 
        '&e=' + settings.timeSpan + 
        '&service=' + settings.service + 
        '&pai=' + settings.accountId; 
    
    // Update the chart image
    $( '#ImgChart' ).attr( 'src', chartUrl );
    $( '#ImgChart' ).load( function() {
        $( '.loading-message' ).hide();
    } );

} // end UpdateChart()



// Updates the list of cities to correspond to the selected region.
function UpdateCityList() {

    // Show loading animation
    $( '.loading-message' ).show();

    // Get the current region
    var currentRegion = $('input[name=region]:checked').val();
    
    // Load its dropdown items, reattach the event handler and refresh the chart
    var cityListUrl = 'Ajax/CityDropdowns/' + currentRegion + '.html';
    $( '#HtmCityCell' ).load( cityListUrl, function() {
        $( '#DdlCity' ).bind( 'change keydown keypress', UpdateZipCodeList );
        UpdateZipCodeList();
    } );
}



// Updates the list of zip codes to correspond to the selected city.
function UpdateZipCodeList() {

    // Show loading animation
    $( '.loading-message' ).show();

    // Get the current city
    var cityId = $('#DdlCity').val();
    
    // Load its dropdown items, reattach the event handler and refresh the chart
    var zipListUrl = 'Ajax/ZipCodes/GetByCity.aspx?CityId=' + cityId;
    $( '#HtmZipCodeCell' ).load( zipListUrl, function() {
        $( '#DdlZipCode' ).bind( 'change keydown keypress', UpdateChart );
        UpdateChart();
    } );
}



// MAIN SCRIPT

// When the page is ready...
$( function() {

    // Assign form control event handlers
    $( '#DdlCity' ).bind( 'change keydown keypress', UpdateChart );
    $( '#DdlZipCode' ).bind( 'change keydown keypress', UpdateChart );
    $( '#DdlStatistic' ).bind( 'change keydown keypress', UpdateChart );
    $( '#DdlResidenceType' ).bind( 'change keydown keypress', UpdateChart );
    $( '#DdlQuartile' ).bind( 'change keydown keypress', UpdateChart );
    $( 'input[name=region]' ).bind( 'click keydown keypress', UpdateCityList );
    
    // Update the city list and chart
    UpdateCityList();
    UpdateChart();
    
} ); // end when page ready