﻿RCRMSliderHammarby = Class.create();
RCRMSliderHammarby.prototype =
{
    initialize: function() {
        this.slides = $A();
        this.currentSlide = -1;
        this.t = null;
        this.slideDuration = 5000;
        this.paused = false;
    },
    show: function(request, offers) {
        this.view = request.elementToUpdate;
        this.view.onmouseover = this.onMouseOver.bind(this);
        this.view.onmouseout = this.onMouseOut.bind(this);

        if (offers.numOffers > 0) {
            this.view.show();

            // Slides ..
            var imageContainer = Element.extend(this.view.getElementsBySelector(".slide-content").first());
            var navContainer = Element.extend(this.view.getElementsBySelector(".slide-nav").first());
            //   var headingContainer = Element.extend(this.view.getElementsBySelector(".slide-heading").first());
            //   var ingressContainer = Element.extend(this.view.getElementsBySelector(".slide-text").first());
            var link = Element.extend(this.view.getElementsBySelector(".slide-link").first());

            var hiddenDataContainer = Element.extend(this.view.getElementsBySelector(".hiddenContainer").first());

            // OK, we add all our offers, to be able to parse them ..
            var offerData = "";
            for (var i = 0; i < offers.offers.length; i++) {
                offerData += offers.offers[i];
            }
            hiddenDataContainer.update(offerData);

            // OK, init slides
            var idx = 0;
            var me = this;
            hiddenDataContainer.getElementsBySelector("li").each(
            function(e) {
                me.slides[idx] = new RCRMSliderHammarbyPage(idx, me, imageContainer, navContainer, link, e);
                idx++;
            });

            /*
            // OK, vi bygger erbjudandena
            for (var i = 0; i < offers.offers.length; i++) {
            this.slides[i] = new RCRMSliderPage(i, this);
            this.slides[i].show(slideContainer, navButtons, offers.offers[i]);

            }
            */
            this.autoSlide(offers.offers.length);

        }
    },
    autoSlide: function(numoffers) {
        this.t = setTimeout(this.autoSlide.bind(this), this.slideDuration);

        if (!this.paused)
            this.nextSlide();

        if (numoffers < 2)
            this.paused = true;
    },
    nextSlide: function() {
        var nextIdx = this.currentSlide + 1;

        if (nextIdx >= this.slides.length)
            nextIdx = 0;

        this.showSlide(nextIdx);
    },
    showSlide: function(idx) {
        if (this.currentSlide >= 0) {
            var oldSlide = this.slides[this.currentSlide];
            oldSlide.deactivate();
        }
        this.currentSlide = idx;
        var newSlide = this.slides[idx];
        newSlide.activate();
    },
    onNavigate: function(selectedIdx) {
        this.showSlide(selectedIdx);
    },
    onMouseOver: function() {
        // OK, on mouse over we should pause
        this.paused = true;
    },
    onMouseOut: function() {
        this.paused = false;
    }
};
RCRMSliderHammarbyPage = Class.create();
RCRMSliderHammarbyPage.prototype =
{
    initialize: function(idx, parent, imageContainer, navContainer, link, dataElement) {
        this.container = parent;
        this.idx = idx;

        this.imageContainer = Element.extend(imageContainer);
        this.imageContainer.forceRerendering = function(element) {
            try {
                element = $(element);
                var n = document.createTextNode(' ');
                element.appendChild(n);
                element.removeChild(n);
            } catch (e) { }
        };

        this.imageTag = Element.extend(imageContainer.getElementsBySelector("img").first());
        this.myImage = Element.extend(dataElement.getElementsBySelector("img").first());

        this.navContainer = Element.extend(navContainer);

        //this.headingContainer = headingContainer;
        //this.myHeading = Element.extend(dataElement.getElementsBySelector(".slide-heading").first());

        //this.ingressContainer = ingressContainer;
        //this.myIngress = Element.extend(dataElement.getElementsBySelector(".ingress").first());
        // this.ingressContainer = ingressContainer;
        //  this.myIngress = Element.extend(dataElement.getElementsBySelector(".slide-text").first());

        this.link = link;
        this.myLink = Element.extend(dataElement.getElementsBySelector("a").first());

        // OK, lets create our nav button
        var butt = Element.extend(document.createElement("li"));
        var buttLink = Element.extend(document.createElement("a"));

        // OK, handle old version of prototype
        buttLink.onclick = this.onClick.bind(this);

        butt.appendChild(buttLink);
        navContainer.appendChild(butt);

        //        new Insertion.Bottom(butt, buttLink);
        //        new Insertion.Bottom(navContainer, butt);

        // butt.insert({ bottom: buttLink });
        // this.navContainer.insert({ bottom: butt });


        this.button = butt;
    },
    onClick: function() {
        this.container.onNavigate(this.idx);
    },
    activate: function() {
        this.button.addClassName("active");

        //         this.imageContainer.hide();
        this.imageContainer.style.opacity = "0";
        this.imageContainer.style.filter = "alpha(opacity=0)";
        Effect.Appear(this.imageContainer);

        // OK, copy all our stuff to container
        this.imageTag.src = this.myImage.src;

        // this.headingContainer.update(this.myHeading.firstChild.data);
        //this.ingressContainer.update(this.myIngress.firstChild.data);

        this.link.href = this.myLink.href;
        this.link.update(this.myLink.innerHTML);

        //         this.slideElement.show();
        //         this.slideElement.appear();

    },
    deactivate: function() {
        this.button.removeClassName("active");
        //         this.slideElement.hide();
        //         this.slideElement.fade();
    }
}
