var MainPageImageGallery = function (node) {
    var thisInstance = this;
    this.node = node;
    this.propertyIds = $('#PropertyIds', node).html().split(',');
    this.images = new Array();
    this.pris = new Array();
    this.summary = new Array();

    this.copyImage(this.propertyIds.length - 2, $('.carousel .old img', node));
    this.copyImage(this.propertyIds.length - 1, $('.carousel .prev img', node));
    this.copyImage(0, $('.carousel .current img', node));
    this.copyImage(1, $('.carousel .next img', node));
    this.copyImage(2, $('.carousel .new img', node));

    var pris = $('.carousel .pris', node).toArray();
    this.pris[this.propertyIds.length - 2] = pris[0].firstChild.data;
    this.pris[this.propertyIds.length - 1] = pris[1].firstChild.data;
    this.pris[0] = pris[2].firstChild.data;
    this.pris[1] = pris[3].firstChild.data;
    this.pris[2] = pris[4].firstChild.data;

    var summary = $('.carousel .shortSummary', node).toArray();
    this.summary[this.propertyIds.length - 2] = summary[0].firstChild.data;
    this.summary[this.propertyIds.length - 1] = summary[1].firstChild.data;
    this.summary[0] = summary[2].firstChild.data;
    this.summary[1] = summary[3].firstChild.data;
    this.summary[2] = summary[4].firstChild.data;

    this.setSelectedIndex(0);

    $('.carousel', node).addClass('loaded');

    $('.carousel .current', node).live('click', function (e) {
        window.location.href = "/kjope/eiendom?Id=" + thisInstance.propertyIds[thisInstance.currentPos];
    });
    $('.carousel .next', node).live('click', function (e) {
        e.preventDefault();
        thisInstance.showNextPicture(thisInstance, node);
    });

    $('.carousel .prev', node).live('click', function (e) {
        e.preventDefault();
        thisInstance.showPreviousPicture(node);
    });
    this.timeout = setTimeout(function () { thisInstance.showNextPicture(thisInstance, node); }, 5000);
}

MainPageImageGallery.prototype.rePositionImages = function (node, oldWidth, prevWidth, currentWidth, nextWidth, newWidth) {
    var next = $('.carousel .next', node);
    var current = $('.carousel .current', node);
    var leftPos = $(current).offset().left;

    if (oldWidth + prevWidth < leftPos) {
        $('.carousel .old', node).css('left', leftPos - prevWidth - oldWidth);
    } else {
        $('.carousel .old', node).removeAttr("style");
    }
    $('.carousel .prev', node).css('left', leftPos - prevWidth);

    $(next).css('left', leftPos + currentWidth);
    $(next).css('width', nextWidth);

    if (leftPos + currentWidth + nextWidth + newWidth < window.innerWidth) {
        var newImg = $('.carousel .new', node);
        $(newImg).css('left', leftPos + currentWidth + nextWidth);
        $(newImg).css('width', newWidth);
    } else {
        $('.carousel .new', node).removeAttr("style");
    }
}
MainPageImageGallery.prototype.showNextPicture = function (thisInstance, node) {
    if (this.timeout != null) {
        clearTimeout(this.timeout);
    }
    if (this.currentPos >= this.propertyIds.length - 1) {
        this.currentPos = 0;
    } else {
        this.currentPos++;
    }
    this.setSelectedIndex(this.currentPos);
    this.timeout = setTimeout(function () {
        thisInstance.showNextPicture(thisInstance, node);
    },
    5000);
}
MainPageImageGallery.prototype.showPreviousPicture = function (node) {
    clearTimeout(this.timeout);
    if (this.currentPos == 0) {
        this.currentPos = this.images.length - 1;
    } else {
        this.currentPos--;
    }

    this.setSelectedIndex(this.currentPos);
}
MainPageImageGallery.prototype.setSelectedIndex = function (index) {
    this.currentPos = index;
    var oldPos = this.currentPos > 1 ? this.currentPos - 2 : (this.images.length - 2);
    var nPos = this.currentPos + 2 < this.images.length ? this.currentPos + 2 : 1;
    var prevPos = this.currentPos > 0 ? this.currentPos - 1 : this.images.length - 1;
    var nextPos = this.currentPos < (this.images.length - 1) ? this.currentPos + 1 : 0;
    if (this.pris[nPos] == null) {
        this.loadNewImageAndSummary(nPos, this.propertyIds[nPos], this.images, this.pris, this.summary, oldPos, nPos, prevPos, nextPos, this);
    }
    else if (this.pris[oldPos] == null) {
        this.loadNewImageAndSummary(oldPos, this.propertyIds[oldPos], this.images, this.pris, this.summary, oldPos, nPos, prevPos, nextPos, this);
    } else {
        this.showNewImageAndSummary(oldPos, nPos, prevPos, nextPos);
    }
}
MainPageImageGallery.prototype.showNewImageAndSummary = function (oldPos, nPos, prevPos, nextPos) {
    $('.current .shortSummary', this.node).html(this.summary[this.currentPos]);
    $('.current .pris', this.node).html(this.pris[this.currentPos]);
    var nav = $('.current .picCounter', this.node);
    nav.text("Ukens nyheter: " + (this.currentPos + 1) + ' / ' + this.images.length);
    this.setImages(oldPos, nPos, prevPos, nextPos);
}
MainPageImageGallery.prototype.loadNewImageAndSummary = function (index, propertyId, images, pris, summary, oldPos, nPos, prevPos, nextPos, mpigPrototype) {

    $.ajax(
        {
            type: "POST",
            url: "/layouts/EmV/sublayouts/PropertyService.asmx/GetPropertyView",
            dataType: "json",
            data: "{id:" + propertyId + ", height:" + 300 + "}",
            contentType: "application/json; charset=utf-8",
            success: function (json) {
                if (json != null) {
                    var image = new Image();
                    image.src = '/layouts/EmV/sublayouts/EmvImageHandler.ashx?Image=' + json.d.ImageId + "&height=300";
                    image.width = json.d.PictureWidth;
                    image.height = 300;
                    images[index] = image;
                    pris[index] = json.d.PrisFormatted;
                    summary[index] = json.d.ShortSummary;
                    mpigPrototype.showNewImageAndSummary(oldPos, nPos, prevPos, nextPos);
                }
            },
            error: function (xhr, msg, e) {
                logErrorMsg(xhr.responseText);
            }
        });
}

MainPageImageGallery.prototype.setImages = function (oldPos, nPos, prevPos, nextPos) {
    var current = this.images[this.currentPos];
    var currentImg = $('.carousel .current img', this.node);
    this.setFullsizeImgSrc(currentImg, current);

    if (this.images.length == 1) {
        $('#bilder .carousel .old').hide();
        $('#bilder .carousel .prev').hide();
        $('#bilder .carousel .new').hide();
        $('#bilder .carousel .next').hide();
    }
    else {
        var next = this.images[nextPos];
        var n = this.images[nPos];

        var prev = this.images[prevPos];
        var old = this.images[oldPos];

        var nextImg = $('.carousel .next img', this.node);
        var nImg = $('.carousel .new img', this.node);
        var prevImg = $('.carousel .prev img', this.node);
        var oldImg = $('.carousel .old img', this.node);

        this.setFullsizeImgSrc(nextImg, next);
        this.setFullsizeImgSrc(nImg, n);
        this.setFullsizeImgSrc(prevImg, prev);
        this.setFullsizeImgSrc(oldImg, old);
        this.rePositionImages(this.node, this.images[oldPos].width, this.images[prevPos].width, this.images[this.currentPos].width, this.images[nextPos].width, this.images[nPos].width);
    }
}

MainPageImageGallery.prototype.setFullsizeImgSrc = function (fullSizeImg, newImage) {
    if (newImage != null  && newImage.src.indexOf(fullSizeImg.attr('src')) == -1) {
        fullSizeImg.attr('src', newImage.src);
        fullSizeImg.attr('height', 300);
        fullSizeImg.attr('width', newImage.width);
    }
}

MainPageImageGallery.prototype.copyImage = function (index, oldImage) {
    var image = new Image();
    image.src = oldImage.attr('src');
    image.height = oldImage.attr('height');
    image.width = oldImage.attr('width');
    this.images[index] = image;
}