﻿
function cityQuery(txtCity, txtZip, txtState, txtCountry) {
    

    this.txtCity = txtCity;
    this.txtZip = txtZip;
    this.txtState = txtState;
    this.txtCountry = txtCountry;

    this.searchPopUp = null;
    this.searchBox = null;
    this.loader = null;

    /* maximum results returned */
    this.maxresult = 6;

    /* order by */
    this.sort = 'city asc';

    this._timeout = null;

    /* event binding */
    this.bindEvents = function() {
        txtCity.handler = this;

        //txtCity event
        if (this.txtCity) {
            $('#' + this.txtCity.id).keydown(function(event) {
                if (this._timeout) { clearTimeout(this._timeout); }
                this._timeout = setTimeout(function() {
                    $('#' + txtCity.handler.loader.id).css("display", "inline");
                    Library.asmx.Ajax_City.getCities(txtCity.value, '', txtCity.handler.maxresult, txtCity.handler.sort, search_callback);
                }, 350);
            }
            );
        }

        //txtZip event
        if (this.txtZip) {
            $('#' + this.txtZip.id).keydown(function(event) {
                if (this._timeout) { clearTimeout(this._timeout); }
                this._timeout = setTimeout(function() {
                    $('#' + txtCity.handler.loader.id).css("display", "inline");
                    Library.asmx.Ajax_City.getCities('', txtZip.value, txtCity.handler.maxresult, txtCity.handler.sort, search_callback);
                }, 350);
            }
            );
        }

        //add window onclick
        $(window).click(function(event) {
            fadeOut();
        })
    }

    /* init */
    if (txtCity) {
        /* bind events */
        this.bindEvents();
        
        /* rollback after postback */
        var input = document.forms[0][this.txtCity.id + '_city'];
        if (input) {
            Library.asmx.Ajax_City.getCity(input.value, function(dataObject) {
                if (txtCity) { txtCity.value = dataObject.City };
                if (txtZip) { txtZip.value = dataObject.Zip; };
                if (txtState) { txtState.value = dataObject.State; };
                if (txtCountry) { txtCountry.value = dataObject.Country; };
            });
        }
    } else {
        alert('Define txtCity!!');
    }

    /* callbacks */
    function search_callback(result) {
        if ((result == "") || ((txtCity.value == "") && (txtZip.value == ""))) {
            fadeOut();
            $('#' + txtCity.handler.loader.id).hide();
        } else {
            //remove prev childs
            if (txtCity.handler.searchBox.hasChildNodes()) {
                while (txtCity.handler.searchBox.childNodes.length >= 1) {
                    txtCity.handler.searchBox.removeChild(txtCity.handler.searchBox.firstChild);
                }
            }
            //create new childs
            for (var i = 0; result.length > i; i++) {
                var child = document.createElement("li");
                var child_link = document.createElement("a");
                child_link.innerHTML = result[i].City + " (" + result[i].Zip + ")";
                child_link.dataObject = result[i];
                child.appendChild(child_link);
                child.onclick = function() {
                    /* Set values */
                    if (txtCity) { txtCity.value = this.firstChild.dataObject.City };
                    if (txtZip) { txtZip.value = this.firstChild.dataObject.Zip; };
                    if (txtState) { txtState.value = this.firstChild.dataObject.State; };
                    if (txtCountry) { txtCountry.value = this.firstChild.dataObject.Country; };

                    /* create hidden field */
                    var input = document.forms[0][txtCity.id + '_city'];
                    if (!input) {
                        var input = document.createElement("input");
                        input.setAttribute("type", "hidden");
                        input.setAttribute("name", txtCity.id + '_city');
                        input.setAttribute("value", this.firstChild.dataObject.Id);
                        document.forms[0].appendChild(input);
                    } else {
                        input.value = this.firstChild.dataObject.Id;
                    }

                    fadeOut();
                }
                this.searchBox.appendChild(child);
            }
            fadeIn();
            $('#' + txtCity.handler.loader.id).hide();
        }
    }

    /* Other functions */
    function fadeIn() {
        var boxHeight = $('#' + txtCity.handler.searchPopUp.id).height() + $('#' + txtCity.handler.txtCity.id).height();
        //$('#' + txtCity.handler.searchPopUp.id).css({ 'margin-top': '-' + boxHeight + 'px' });
        $('#' + txtCity.handler.searchPopUp.id).show();
    }

    function fadeOut() {
        if (txtCity) {
            $('#' + txtCity.handler.searchPopUp.id).hide();
        }
    }

}
