var _listings;
var carousel_addToUrl = "";

function load_xml(jumpSearchID, numberOfListingsVisible, autoScroll, addToUrl, maxResults) {
    carousel_addToUrl = addToUrl ? addToUrl : "";
    if (carousel_addToUrl.length > 0 && carousel_addToUrl.substring(0, 1) != '?') {
        carousel_addToUrl = '?' + carousel_addToUrl;
    }
    jQuery.ajax({
    url: Utils.PublicAppName + '/Listing/JumpSearchListings.aspx?MaxResults=' + maxResults + '&JumpSearch=' + jumpSearchID,
        type: 'GET',
        async: true,
        dataType: 'json',
        success: function(json) {
            try {
                _listings = json.listing;
                
                if (json.count > 0) {
                    $("#mycarousel-container").show();
                    init_jcarousel(json.count, numberOfListingsVisible, autoScroll);
                }
                else {
                    $("#fp-jcarousel-loading").hide();
                }
            } catch (err) {
                if (typeof (console) != 'undefined')
                    console.error('Error: %s', err.message);
            }
        }
    });
}

function mycarousel_initCallback(carousel) {
    // Disable autoscrolling if the user clicks the prev or next button.
    carousel.buttonNext.bind('click', function() {
        //carousel.startAuto(0);
    });

    carousel.buttonPrev.bind('click', function() {
        //carousel.startAuto(0);
    });

    // Pause autoscrolling if the user moves with the cursor over the clip.
    carousel.clip.hover(function() {
        carousel.stopAuto();
    }, function() {
        carousel.startAuto();
    });

    // buttons
    $(".jcarousel-prev-horizontal").hover(function() {
        this.src = this.src.replace("_off", "_on");
    }, function() {
        this.src = this.src.replace("_on", "_off");
    });

    carousel.startAutoOrig = carousel.startAuto;
    carousel.startAuto = function(secs) {
        if (!carousel.paused)
            carousel.startAutoOrig(secs);
    } 
    
        carousel.paused = false;
        // Click event for playback toggle button, conditionally calls play/pause
        $('#details').click(function() {
            if (carousel.paused) {
                carousel.paused = false;
                carousel.startAuto();
            } else {
                carousel.startAuto();
                carousel.paused = true;
                carousel.stopAuto();
            }
        });
};

function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt) {
    // The index() method calculates the index from a
    // given index who is out of the actual item range.
    var idx = carousel.index(i, _listings.length);
    //alert(idx);
    carousel.add(i, mycarousel_getItemHTML(_listings[idx - 1]));
};

function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt) {
    carousel.remove(i);
};

function mycarousel_getItemHTML(item) {
    //id,listingid,listingtypeid,thumbpicurl,city,state,bedrooms,bathstotal,price,acres,propertyurl
    if (document.images) {
        preload_image = new Image();
        preload_image.src = item.imagefilename;
    }
    var line_three_val = "";
    if (item.listingtypeid == "3") {
        line_three_val = item.acreage //lnd
    } else {
        line_three_val = item.beds
        if (item.baths != "") {
            line_three_val += ", " + item.baths; //res, com, mul
        }
    }
    var city_state = item.city;
    if (item.city != "" && item.state != "") {
        city_state = city_state + ", ";
    }
    city_state = city_state + item.state;
    var city_state_trimmed = city_state.trimToPx(138);

    var html_string = "<div id='" + item.id + "' onclick='open_detail(" + item.listingid + ", \"" + item.listingurl + "/popup" + carousel_addToUrl + "\", " + item.overrideWebsiteid + ");' style='cursor:pointer;'>" +
					"<img class='property_photo' src='" + item.imagefilename + "'  />" +
					"<br /><div class='jcarousel-description-container'>" +
					"<div class='jcarousel-price-text'>" + item.price + "</div>" +
					"<div class='jcarousel-address-text'>" + item.address + "</div>" +
					"<div class='jcarousel-city-state-text' title='" + city_state + "'>" + city_state_trimmed + "</div>" +
					"<div class='jcarousel-line-three-text'>" + line_three_val + "</div>" +
					"</div></div>";
    return html_string;
};

function init_jcarousel(rc, numberOfListingsVisible, autoScroll) {
    //var randomnumber = Math.floor(Math.random() * (rc + 1))
    jQuery('#mycarousel').jcarousel({
        auto: autoScroll,
        wrap: 'circular',
        visible: numberOfListingsVisible,
        scroll: numberOfListingsVisible,
        start: 1,
        initCallback: mycarousel_initCallback,
        buttonPrevHTML: '<img class=\'prev_button\' src=\'http://images.fnistools.com/images/common/jcarousel/prev_off.png\' onmouseover=\'this.src="http://images.fnistools.com/images/common/jcarousel/prev_on.png"\' onmouseout=\'this.src="http://images.fnistools.com/images/common/jcarousel/prev_off.png"\' />',
        buttonNextHTML: '<img class=\'next_button\' src=\'http://images.fnistools.com/images/common/jcarousel/next_off.png\' onmouseover=\'this.src="http://images.fnistools.com/images/common/jcarousel/next_on.png"\' onmouseout=\'this.src="http://images.fnistools.com/images/common/jcarousel/next_off.png"\' />',
        itemVisibleInCallback: { onBeforeAnimation: mycarousel_itemVisibleInCallback },
        itemVisibleOutCallback: { onAfterAnimation: mycarousel_itemVisibleOutCallback }
    });
    // carousel.startAuto(5);

    $("#fp-jcarousel-loading").hide();
}

function open_detail(listingid, listingurl, overrideWebsiteID) {
    // For BAC:
    if (overrideWebsiteID && overrideWebsiteID > 0) {
        createCookie('rBW-PublicWebsiteID', overrideWebsiteID);
    }
    
    var root = "";
    if (window.location.hostname.indexOf("-dev") != -1) {
        root = "/public"; 
    }
    var s_url = root + listingurl;
    window.open(s_url, listingid, "width=820, height=650, location=1, scrollbars=1");
}

String.prototype.visualLength = function() {
    var ruler = g("ruler");
    ruler.innerHTML = this;
    return ruler.offsetWidth;
}

function g(id) {
    return document.getElementById(id);
}

String.prototype.trimToPx = function(length) {
    var tmp = this;
    var trimmed = this;
    if (tmp.visualLength() > length) {
        trimmed += "...";
        while (trimmed.visualLength() > length) {
            tmp = tmp.substring(0, tmp.length - 2);
            trimmed = tmp + "...";
        }
    }

    return trimmed;
}