dojo.require("dojo.parser"); // scan page for widgets
	 dojo.require("dojo.fx");


	

 dojo.addOnLoad(function(){
	var images = dojo.query(".mcimage");
	var button = 1;
	var buttonlength = dojo.query(".mcimage").length;
	//console.log("Number of Buttons " + buttonlength);
	var randomImage = Math.floor(Math.random() *  buttonlength);
	//console.log(randomImage);
	 if (randomImage == -1){
		randomImage = 0;
	 }
	var widthtimesposition = randomImage * -219;
	var cssImage = {"background" : "url(/images/off-state.jpg) left top no-repeat","outline":"none"};
	var cssImageReplace = {"background" : "url(/images/on-state.jpg) left top no-repeat","outline":"none"};
	dojo.query('#imageContainer').style({position :'relative'});
	dojo.query('#slideStrip').style({position:'relative'}); 
dojo.animateProperty({
    node: "slideStrip",
    properties: { left: widthtimesposition }
}).play();

	dojo.forEach(
	dojo.query(".mcimage", document), function(i){
	var mcbuttons=dojo.byId("mccontrol_buttons_bullets"); //this is my ContentPane
	mcbuttons.innerHTML += '<a class="mcbutton" id="' + (button++) + '" href="javascript:;" style="">&nbsp;</a>';

	var elementlistlinks = dojo.query("a.mcbutton");
	var index = dojo.indexOf(elementlistlinks, elementlistlinks[randomImage]);
		
		var elementlistlinks = dojo.query(".mcbutton");
	var index = dojo.query("a.mcbutton").at(randomImage).style(cssImageReplace);
	//	console.log(index);

	});

	
		dojo.query("a#1.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 0;
		  
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = thisbutton  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
		dojo.query("a#2.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 1;
		  randomImage = thisbutton
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = randomImage  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
		dojo.query("a#3.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 2;
		  randomImage = thisbutton
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = randomImage  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
		dojo.query("a#4.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 3;
		  randomImage = thisbutton
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = randomImage  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
		dojo.query("a#5.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 4;
		  randomImage = thisbutton
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = randomImage  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
		dojo.query("a#6.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 5;
		  randomImage = thisbutton
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = randomImage  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
		dojo.query("a#7.mcbutton").connect("onclick",function(){
		 var thisbutton;
		  thisbutton = 6;
		  randomImage = thisbutton
		//var checkattrstylehide = dojo.query('.mcimage').at(thisbutton).attr("style");
		var widthtimesposition = randomImage  * -219;
		//var widthtimesposition = thisbutton * -219;
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: widthtimesposition }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(thisbutton).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
});	
	
	dojo.query("#nextbtn a").connect("onclick",function(){
		
		
		//var widthtimesposition = thisbutton * -219;
		
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(randomImage).attr('style', cssImageReplace);
		console.log(widthtimesposition);
		
		if ((randomImage < buttonlength -1) && (randomImage > -1)){
	randomImage = randomImage + 1;
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": -219.5 * randomImage }, 450);
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: -219.5 * randomImage }
		}).play();
		
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(randomImage).attr('style', cssImageReplace);
	}
	else {
		randomImage = 0;
				dojo.animateProperty({
			node: "slideStrip",
			properties: { left: 219.5 * -randomImage }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left":  219.5 * -randomImage  }, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(randomImage).attr('style', cssImageReplace);
	}
	});	
	
	
	dojo.query("#prevbtn a").connect("onclick",function(){
		
		
		//var widthtimesposition = thisbutton * -219;
		
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left": widthtimesposition}, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(randomImage).attr('style', cssImageReplace);
		//console.log(widthtimesposition);
		
		if ((randomImage <= buttonlength) && (randomImage != 0)){
	randomImage = randomImage - 1;
		
		dojo.animateProperty({
			node: "slideStrip",
			properties: { left: 219.5 * -randomImage  }
		}).play();
		
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(randomImage).attr('style', cssImageReplace);
	}
	else {
		randomImage = buttonlength - 1;
				dojo.animateProperty({
			node: "slideStrip",
			properties: { left: 219.5 * -randomImage  }
		}).play();
		
		//dojo.query('#slideStrip').style({'position':'relative'}).animate({"left":  219.5 * -randomImage  }, 450);
		dojo.query('a.mcbutton').attr('style', cssImage);
		dojo.query('a.mcbutton').at(randomImage).attr('style', cssImageReplace);
	}
	});	

});