/*****************************************************************************************
/  SET ALL VARIABLES
/*****************************************************************************************/

var mlsid;
var UserLastPage;
var address;
var beds;
var baths;
var bathhalf;
var sqft;
var city;
var state;
var ptype;
var price;
var yearbuilt;
var propimg;
var loopCount = 1;

var currentPage = getFileName();
var strDebug = '';
var currentProperty = '';
var loadProperty = '';
var firstProperty = '';
var loadMLSID = '';
var StartItem = 1;
var CarouselHTML = '<div class="gdtabs"><div class="contentPanelWhite" style="background-color:transparent;height:177px"><div id="Carousel" class="jcarousel-skin-tango gdtabNavigation"><ul></ul></div></div></div>';
var listingArea = '<div id="gdtab" class="contentPanel2 fLeft" style="width:100%">' +
                        '<div id="gdtabCnt">' +
                            '<div class="fLeft inline">' +
                                '<div class="tw1">' +
                                    '<div class="tw2">' +
                                        '<div class="tw3">' +
                                            '<div class="tw4">' +
                                                '<div class="tw5">' +
                                                    '<div class="tw6">' +
                                                        '<div class="tw7">' +
                                                            '<div class="tw8">' +
                                                                '<div class="w9">' +
                                                                    '<div>' +
                                                                        '<a href="" id="featPropLink"><img id="propimg" width="300" alt="" class="b0"></a>' +
                                                                    '</div>' +
                                                                '</div>' +
                                                            '</div>' +
                                                        '</div>' +
                                                    '</div>' +
                                                '</div>' +
                                            '</div>' +
                                        '</div>' +
                                    '</div>' +
                                '</div>' +
                            '</div>' +
                            '<div id="greatPropDealDisplay" class="fRight">' +
                                '<div><span id="varTitle" class="propTitle"></span><span id="subdivTxt" class="propTitle"></span></div>' +
                                '<p><span id="varAddress"></span></p>' +
                                '<p>&nbsp;</p>' +
                                '<p><span id="varBeds"></span>&nbsp;Beds</p>' +
                                '<p><span id="varBaths"></span>&nbsp;Baths</p>' +
                                '<p id="halfbathTxt"><span id="varHalfBaths"></span>&nbsp;Half Baths</p>' +
                                '<p><span id="varSQFT"></span>&nbsp;SF.</p>' +
                                '<p><span id="varPtype"></span></p>' +
                                '<p>&nbsp;</p>' +
                                '<p><span id="varPrice" class="varPrice"></span></p>' +
                                
                                '<p>&nbsp;</p>' +
                            '</div>' +
                            '<div id="greatPropbttns" class="fRight mainTxt">' +
                                '<a id="surl" href=""><img src="images/learnMore.gif" alt="Learn More" class="bttnPad fRight inline"></a>' +
                                '<a id="reqinfo" href=""><img src="images/requestInfo.gif" alt="Request Info" class="bttnPad fRight inline"></a>' +
                            '</div>' +
                        '</div>' +
                    '</div>';


MM_preloadImages('images/learnmore1.gif', 'images/learnmore2.gif', 'images/next1.gif', 'images/next2.gif', 'images/previous1.gif', 'images/previous2.gif', 'images/search2.gif', 'images/search2.gif', 'images/loading2.gif', 'images/tab-bg.gif', 'images/featured1.png', 'images/featured2.png', 'images/featpricetab1.png', 'images/featpricetab2.png');

/*****************************************************************************************
/  DOCUMENT READY LOAD FUNCTIONS
/*****************************************************************************************/

jQuery(document).ready(function() {

    /*************************************************************************************************************************************************/
    /*  CAROUSEL events
    /*************************************************************************************************************************************************/

    $(".featcarouselbg").live("click", function() {
        ChangeProp(this.id);
        return false;
    }).live("mouseover", function() {
        $(this).css("cursor", "pointer").css("background-image", "url('images/featured2.png')");
        $('#gdprice' + this.id).css("background-image", "url('images/featpricetab2.png')");
        $(this).parent().parent().parent().css("background-color", "#b5b5a9");
    }).live("mouseout", function() {
        $(this).css("cursor", "pointer").css("background-image", "url('images/featured1.png')");
        $('#gdprice' + this.id).css("background-image", "url('images/featpricetab1.png')");
        $(this).parent().parent().parent().css("background-color", "");
    });

    $('#btnSearch').live("mouseover", function() {
        $(this).attr("src", $(this).attr("src").replace(/\s*1\s*/, "2"));
    }).live("mouseout", function() {
        $(this).attr("src", $(this).attr("src").replace(/\s*2\s*/, "1"));
    });

    /*************************************************************************************************************************************************/
    /*  LOAD CAROUSEL
    /*************************************************************************************************************************************************/
    
    //alert(IsIE6);
    CarouselStart();

});


/*************************************************************************************************************************************************/
/*  CALL CAROUSEL XML
/*************************************************************************************************************************************************/

function mycarousel_itemLoadCallback(carousel, state) {

    if (carousel.has(carousel.first, parseInt(carousel.last) - 1)) {
        afterAnimate();
        return;
    } else {
        jQuery.get(
            'inc-greatPropDeals.asp',
            {
                first: carousel.first,
                last: carousel.last
            },
            function(xml) {

                mycarousel_itemAddCallback(carousel, carousel.first, carousel.last, xml);
            },
            'xml'
        );
    }
};

/*************************************************************************************************************************************************/
/*  ADD CAROUSEL ITEMS
/*************************************************************************************************************************************************/

function historyLoad(CurrentPage, mlsID) {
    jQuery.ajax({
        url: "inc-greatPropDeals.asp?action=historyLoad&CurrentPage=" + CurrentPage + '&mlsID=' + mlsID,
        dataType: "script",
        cache: false,
        //async: false,
        timeout: 10000,
        error: function(xhr, desc, e) {

        },
        success: function(response) {

        }
    });
}

function CarouselStart() {

    $('#greatdeals').html(CarouselHTML).append(listingArea);
    //alert('CarouselStart()')

    jQuery.ajax({
        url: "inc-greatPropDeals.asp?action=historyInit",
        dataType: "script",
        cache: false,
        //async: false,
        timeout: 20000,
        error: function(xhr, desc, e) {
            //alert('Error:\n\nxhr: ' + xhr + '\n\ndesc: ' + desc + '\n\ne: ' + e);
        },
        success: function(response) {
            //alert('Success: ' + response);
            $('#Carousel').jcarousel({
                scroll: 4,
                start: StartItem,
                itemVisibleOutCallback: { onAfterAnimation: function(carousel, item, i, state, evt) { carousel.remove(i); } },
                itemLastOutCallback: { onAfterAnimation: beforeAnimate },
                itemLoadCallback: mycarousel_itemLoadCallback
            });
        }
    });
}

function mycarousel_itemAddCallback(carousel, first, last, xml) {
    carousel.size(parseInt(jQuery('total', xml).text())); // Set the size of the carousel

    UserLastPage = last;

    afterAnimate();

    jQuery('listing', xml).each(function(i) {
        var objThis = $(this);
        propimg = objThis.attr('propimg'); MM_preloadImages(propimg);
        mlsid = objThis.attr('mlsid');
        address = objThis.attr('address');
        beds = objThis.attr('beds');
        baths = objThis.attr('baths');
        bathhalf = objThis.attr('bathhalf');
        sqft = objThis.attr('sqft');
        surl = objThis.attr('surl');
        city = objThis.attr('city');
        reqinfo = objThis.attr('reqinfo');
        state = objThis.attr('state');
        ptype = objThis.attr('ptype');
        subdiv = objThis.attr('subdiv');
        price = objThis.attr('price');
        yearbuilt = objThis.attr('yearbuilt');

        carousel.add(first + i, mycarousel_getItemHTML(mlsid, address, beds, baths, bathhalf, sqft, city, state, price, ptype, yearbuilt, propimg, surl, reqinfo, subdiv));

        if ((first + i) == 1) {
            loadProperty = mlsid;
            //ChangeProp(mlsid);
        }

        if (i == 0) {
            firstProperty = mlsid;
        }

        if (loadMLSID != '') {

            if (loadMLSID == mlsid) {
                //alert('match loadMLSID: ' + loadMLSID + '\nmlsid: ' + mlsid);
                loadProperty = mlsid;
            } else {
                //alert('NO match loadMLSID: ' + loadMLSID + '\nmlsid: ' + mlsid);
            }
        }

        loopCount = first + i;

    });
    //alert('loadproperty: ' + loadProperty + '\ncurrentProperty: ' + currentProperty + '\nfirstProperty: ' + firstProperty);
    if (loadProperty != '' && currentProperty == '') {
        ChangeProp(loadProperty);
    } else if (loadProperty == '' && currentProperty == '') {
        ChangeProp(firstProperty);
    }

    historyLoad(last, firstProperty);

};


/*************************************************************************************************************************************************/
/*  CAROUSEL FUNCTIONS
/*************************************************************************************************************************************************/

function ChangeProp(propertyId) {
    $('#propimg').attr('src', $('#propimg' + propertyId).val());
    $('#mlsid').text($('#mlsid' + propertyId).val());
    $('#varAddress').text($('#address' + propertyId).val() + ', ' + $('#city' + propertyId).val() + ' ' + $('#state' + propertyId).val());
    $('#varTitle').html($('#city' + propertyId).val() + ',&nbsp;');
    $('#subdivTxt').text($('#subdiv' + propertyId).val());
    $('#varBeds').text($('#beds' + propertyId).val());
    $('#varBaths').text($('#baths' + propertyId).val());
    $('#varCity').text($('#city' + propertyId).val());
    $('#varState').text($('#state' + propertyId).val());
    $('#varPtype').text($('#ptype' + propertyId).val());
    $('#varPrice').text($('#price' + propertyId).val());
    $('#surl').attr('href', $('#surl' + propertyId).val());
    $('#featPropLink').attr('href', $('#surl' + propertyId).val());
    $('#reqinfo').attr('href', $('#reqinfo' + propertyId).val());
    $('#varSQFT').text($('#sqft' + propertyId).val());

    yearbuilt = $('#yearbuilt' + propertyId).val();

    var tempbathHalf = $('#bathhalf' + propertyId).val();

    $('#varHalfBaths').text(tempbathHalf);

    if (tempbathHalf == 0 || tempbathHalf == '0') {
        $('#halfbathTxt').hide();
    } else {
        $('#halfbathTxt').show();
    }
    currentProperty = propertyId

    historyLoad(UserLastPage, propertyId);

}

function beforeAnimate() {
    $('#Carousel').addClass('loadingbg');
}

function afterAnimate() {
    $('#Carousel').removeClass('loadingbg');
}

function mycarousel_getItemHTML(mlsid, address, beds, baths, bathhalf, sqft, city, state, price, ptype, yearbuilt, propimg, surl, reqinfo, subdiv) {

    var strHTML = '<div class="greatPropDeal">' +
                    '<div class="wc greatdealdiv">' +
                        '<div id="' + mlsid + '" class="featcarouselbg">' +
                            '<img id="' + mlsid + '" class="featListingImg" src="' + propimg + '" alt="Property Id: ' + mlsid + '">' +
                            '<div id="gdprice' + mlsid + '" class="gdprice"><p>' + price + '</p></div>' +

                        '</div>' +
                        '<div id="gdcity' + mlsid + '" class="gdcity" stylex="position:relative;top:-7px;text-align:center"><p>' + subdiv + '<br><span class="featCity">' + city + '</span></p></div>' +
                        '<input type="hidden" id="mlsid' + mlsid + '" value="' + mlsid + '">' +
                            '<input type="hidden" id="address' + mlsid + '" value="' + address + '">' +
                            '<input type="hidden" id="beds' + mlsid + '" value="' + beds + '">' +
                            '<input type="hidden" id="baths' + mlsid + '" value="' + baths + '">' +
                            '<input type="hidden" id="bathhalf' + mlsid + '" value="' + bathhalf + '">' +
                            '<input type="hidden" id="sqft' + mlsid + '" value="' + sqft + '">' +
                            '<input type="hidden" id="city' + mlsid + '" value="' + city + '">' +
                            '<input type="hidden" id="state' + mlsid + '" value="' + state + '">' +
                            '<input type="hidden" id="price' + mlsid + '" value="' + price + '">' +
                            '<input type="hidden" id="reqinfo' + mlsid + '" value="' + reqinfo + '">' +
                            '<input type="hidden" id="surl' + mlsid + '" value="' + surl + '">' +
                            '<input type="hidden" id="ptype' + mlsid + '" value="' + ptype + '">' +
                            '<input type="hidden" id="yearbuilt' + mlsid + '" value="' + yearbuilt + '">' +
                            '<input type="hidden" id="propimg' + mlsid + '" value="' + propimg + '">' +
                            '<input type="hidden" id="subdiv' + mlsid + '" value="' + subdiv + '">' +
                    '</div>' +
                '</div>';
    return strHTML;

};