var HomeSlide = new Class({
	slidePlayer: true,
    navId: 'nav',
	pauseId: 'playPause',
    initialize: function () {
    },

	load: function(slideshowId) {
		homeSlideShow = new SlideShow(slideshowId,{ delay: 5000, autoplay: true });
        this.createNav(this.navId);
		testFx = new Fx.Tween($('slideWrapper'));
		testFx.set('display', 'block');
		testFx.start('opacity', '0', '1');
		homeSlideShow.addEvent('show', this.navTransition.bind(this));
        $$('.pager').addEvent('click', this.gotoSlide.bind(this));
        $('playPause').addEvent('click', this.pauseToggler.bind(this));
	},	
	
    createNav: function(el) {
		var p = homeSlideShow.slides.length -1;
		for ( p=0;p<=homeSlideShow.slides.length-1;p++ ) {
			var t = $(el).get('html') ;
			displayNum = p + 1;
			if (displayNum == 1) {
                $(el).set('html', t +'<a href="JavaScript:void(0);" class="navDiv first pager" id=nav'+  p + '>' + displayNum + '</a>');
			} else {
                $(el).set('html', t +'<a href="JavaScript:void(0);" class="navDiv pager" id=nav'+  p + '>' + displayNum + '</a>');
				};
			};
			$(el).set('html', $(el).get('html') + '<a href="JavaScript:void(0);" id="playPause" class="navDiv first playing" ></a>');
	},
	
    pauseToggler: function() {
		var pauseButton = $(this.pauseId);
			if (this.slidePlayer) {
				homeSlideShow.pause();
				$(this.pauseId).morph({'background-color': '#fff', 'color': '#808285', 'background-image':'url("/images/butPlay.png")'});
				this.slidePlayer = false;
			} else {
				$(this.pauseId).morph({'background-color': '#d60c8c', 'color': '#fff', 'background-image':'url("/images/butPause.png")'});
                homeSlideShow.showNext();
				homeSlideShow.play();
				this.slidePlayer = true;
		};
	},
	
    gotoSlide: function(e) {
        var slideIndex= parseInt($(e.target).id.substr(3))
		homeSlideShow.show(slideIndex);
        if (this.slidePlayer) {
		    homeSlideShow.stopLoop();
		    homeSlideShow.startLoop();
	    };
    },
	
    navTransition: function(data) {
		var curSlide = data.next.index;
		var prevSlide = data.previous.index;
        
		$('nav' + curSlide).morph({'background-color': '#d60c8c', 'color': '#fff'});
		$('nav' + prevSlide).morph({'background-color': '#fff', 'color': '#808285'});
	}
});