// Vars defined, global:
	var productFullviewTiming='10';
	var productImages= [
        {
	 	'src':'product1.png',
		'zoom':''
	 },	 	 {
	 	'src':'product2.png',
		'zoom':''
	 },	 	 {
	 	'src':'product3.png',
		'zoom':''
	 }
        ];

// from an included js file.

(function(){

	/* product switcher */

	var ProductSwitcher = new Class({

		timeout : productFullviewTiming*1000,

		slider : null,

		bound : {},

		cloner : null,

		initialize : function(options) {

			this.slides = options;

			this.slider = $('fullview-slider');

			this.slideOptions = $('slide-options');

			if ( ! this.slider ) {

				return;

			}



			this.cloner = new Element('img',{

				'id' : 'temp'

			});



			this.timer=productFullviewTiming*1000;

			this.preloadImages();

			this.buildSwitchList();

			this.initRotation();

		},

		preloadImages : function() {

			this.slides.each( function( slide ) {

				var img = new Image();

				img.src=slide.src;

				slide.img = img;

			});

		},

		initRotation : function() {

			var self = this;

			if( this.interval !== null ) {

				window.clearInterval( this.interval );

			};

			console.log( "calling timeout for "+this.timeout );

			this.interval = window.setInterval( function() {

				self.rotate.apply(self);

				}, this.timeout);

		},

		rotate : function() {
## working in this section here....
//  thought it would be easiest to
"fake" a click on the links
// since they already work and are present.

			console.log( "rotate() called" );

			var nextindex=0;

			var slideopts= $$('ul a', this.slideOptions );

			slideopts.each( function(item){

				nextindex++;

				if ( nextindex > slideopts.length ) {

					nextindex=0;

				}

				// ----

				if ( $(item).hasClass('current') ) {

					console.log( "calling fireEvent for click for "+nextindex );

					console.log( slideopts[nextindex] );

					slideopts[nextindex].fireEvent('click');

					return;

				}

			});

		},

		buildSwitchList : function() {
##  this function creates the links used in the section I'm in, above.

			var ul = new Element('ul');

			ul.injectInside(this.slideOptions);



			this.bound.click = this.onclick.bindWithEvent(this);

			var len = this.slides.length;

			// bookmark

			var width = len*13;

			var margin = Math.ceil( width/2 );

			ul.setStyle( 'width', width+'px' );

			/*

			ul.setStyle( 'margin-left', '-'+margin+'px' );

			*/



			var i = 1;

			this.slides.each(function(slide) {

				var li = new Element('li');

				var a = new Element('a',{

					'href' : '#'

				});

				if (i === 1) {

					a.addClass('current');

				}

				a.imgSrc = slide.src;

				a.zoom = slide.zoom;

				a.setText(parseInt(i, 10));

				a.injectInside(li);

				li.injectInside(ul);



				a.addEvent('click', this.bound.click);

				i = i + 1;

			}, this);

		},

		resetCurrentAnchor : function(el) {

			$ES('ul a',this.slideOptions).each(function(item){

				item.removeClass('current');

			});

			$(el).addClass('current');

		},

		onclick : function(event) {

			event = new Event(event).stop();



			var newSrc = event.target.imgSrc;

			var zoomSrc = event.target.zoom;



			var current = $('gloryshot');

			if (current.getProperty('src') === newSrc) {

				return;

			}



			var temporary = this.cloner.clone(false);

			temporary.setProperty('src',current.getProperty('src'));

			temporary.injectInside(this.slider);



			current.src = newSrc;



			var self = this;

			var mfx = new Fx.Style(temporary,'opacity', {

				duration: 200,

				onComplete : function(){

					temporary.remove();

					self.resetCurrentAnchor(event.target);

				}

			});



			var img = new Image();

			img.onload = function() {

				mfx.start(1,0);

			};

			img.src = newSrc;

			$('expanded-zoom').removeClass('disabled');

			$('expanded-zoom').removeEvents( 'click' );

			if ( zoomSrc.length > 0 ) {

				this.bound.zoom=this.showZoom.bindWithEvent(this, zoomSrc);

				// need a new onclick fn for the zoom image thing

				$('expanded-zoom').addEvent( 'click', this.bound.zoom );

			}

			else {

				$('expanded-zoom').addClass('disabled');

			}

		},

		showZoom : function(event, zoomSrc){

			event = new Event( event ).stop();

			var current = $('gloryshot');

			if ( current.getProperty('src')===zoomSrc) {

				return;

			}

			var temporary = this.cloner.clone(false);

			temporary.setProperty('src',current.getProperty('src'));

			temporary.injectInside(this.slider);

			current.src=zoomSrc;

			var self = this;

			var mfx = new Fx.Style( temporary, 'opacity', {

				duration:200,

				onComplete : function() {

					temporary.remove();

				}

			});

			var img = new Image();

			img.onload = function() {

				mfx.start(1,0);

			};

			img.src = zoomSrc;

		}

	});



	var ps = new ProductSwitcher(productImages);

})();