(function ($) {
    $.fn.rsGallery = function (options) {
        var settings = $.extend({
            size: { width: 332, height: 350 },
            moreInfoText: "Plus d'infos",
            showAllText: "Voir toutes les propriétés",
            delay: 5000
        }, options);

        var lTimeout = null;
        var lCurrentProperty = 0;

        return this.each(function (i, widget) {
            // hide all items
            $(widget).children().hide();

            // build layout
            $(widget).append(
                $('<div>').attr('id', 'gallery').append(
                    $('<div>').attr('id', 'image-container')
                        .append($('<div>').attr('id', 'data-overlay')
                            .append($('<div>').attr('id', 'price'))
                           
                        )
                        .append($('<div>').attr('id', 'image-scroller').css('width', ($(widget).find('li').length * 350)))
                    ).append(
                    $('<div>').attr('id', 'info-panel')
                        .append($('<div>').attr('id', 'genre'))
                        .append($('<div>').attr('id', 'city'))
			.append($('<div>').attr('id', 'previews'))
                     )
            );
            $(widget).find('li').each(function (i, e) {
                $(widget).find("#image-scroller").append(
                        $('<img>').attr('class', 'prop-image').attr('src', $(e).attr('picture'))
                    )


            });

            function _updateData() {
                var lData = $(widget).find('li')[lCurrentProperty];
                var lBedrooms = $(lData).attr("bedrooms");
                var lBathrooms = $(lData).attr("bathrooms")
                var lWaterrooms = $(lData).attr("waterrooms")

                $("#gallery").find("#price").html(($(lData).attr("price").indexOf('$') >= 0) ? $(lData).attr("price") : $(lData).attr("price") + '$');
                if (lBedrooms > 0) { $("#gallery").find("#bedrooms").show().html(lBedrooms); }
                else { $("#gallery").find("#bedrooms").hide() }

                if (lBathrooms > 0) { $("#gallery").find("#bathrooms").show().html(lBathrooms); }
                else { $("#gallery").find("#bathrooms").hide() }

                if (lWaterrooms > 0) { $("#gallery").find("#waterrooms").show().html(lWaterrooms); }
                else { $("#gallery").find("#waterrooms").hide() }

                $("#gallery").find("#city").html($(lData).attr("city"));

                var lCount = 0
                $(widget).find("#previews").children().each(function (i, elm) { $(elm).remove() });
                $(widget).find('li').each(function (i, e) {
                    if ((i != lCurrentProperty) && (lCount < 4)) {
                        $(widget).find("#previews").append(
                            $('<img>').attr('class', 'prop-image').attr('src', $(e).attr('picture').replace('lightbox', '75X58')).click(function () {
                                _showItem(i);
                            })
                        )
                        lCount++;
                    }
                });
            }
            _updateData();

            function _showItem(index) {
                lCurrentProperty = index - 1;
                _showNext();
            }

            function _showNext() {
                if (lTimeout != null) {
                    window.clearTimeout(lTimeout);
                    lTimeout = null;
                }

                lCurrentProperty = ((lCurrentProperty + 1) % $(widget).find('li').length);

                if (lCurrentProperty > 0) {
                    $(widget).find("#image-scroller").animate({ 'margin-left': (-1 * 640 * lCurrentProperty).toString() }, 'fast', function () {
                        _updateData();
                        lTimeout = window.setTimeout(function () { _showNext() }, settings.delay);
                    });
                }
                else {
                    $(widget).find("#image-scroller").animate({ 'margin-left': '0' }, 'fast', function () {
                        _updateData();
                        lTimeout = window.setTimeout(function () { _showNext() }, settings.delay);
                    });
                }
                
            }


            lTimeout = window.setTimeout(function () { _showNext() }, settings.delay);

        });


    }
})(jQuery);

