window.addEvent('load',  function(){
	if($('contentGreen')){
		var idContent = $('contentGreen');
		var arrImg = idContent.getElement('div').getElements('p');
		if(arrImg.length ==0 ) return true;
		var index = 0;
		var pre = $('btnPre');
		var next = $('btnNext');
		var durationTime = 1000;
		var mySlideShowEff;
		var conWay = {};
		conWay.padding = 50;
		conWay.duration = 100000;
		idContent.setStyles({'position' : 'relative' , 'height' :  arrImg[0].getCoordinates().height + 27});
		 // Loop thru the children and hide all but the first
        for (var i = 0; i < arrImg.length; i ++) {
            if (i == 0) { // Styles for the first child
                arrImg[i].setStyles({'position': 'absolute', 'opacity': '1'});
            } else { // Styles for the other hidden children  
                arrImg[i].setStyles({
                    'position': 'absolute',
                    'left': arrImg[0].getStyle('left'),
                    'top': arrImg[0].getStyle('top'),
                    'opacity': '0'
                });
            }
        }
		//click pre 
		pre.removeEvents().addEvents({
		'click' :  function(evt) {
			var myEffects = new Fx.Morph(arrImg[index],{ 'duration': durationTime });
			myEffects.start({
				'opacity' : [1 , 0]
			});
			if(index == 0) {
				index = arrImg.length - 1;
			} else {
				index--;
			}
			if(mySlideShowEff) {
				$clear(mySlideShowEff);
				mySlideShowEff = conWay.mySlideShow.periodical(conWay.duration); 
			}
					
			var myEffects = new Fx.Morph(arrImg[index],{ 'duration': durationTime });
			myEffects.start({
				'opacity' : [0 , 1]
			});
			idContent.setStyles({'height' :  arrImg[index].getCoordinates().height + conWay.padding});	
				
		},
		'mouseenter': function(){
			//pre.fireEvent('click');
		}		
		});
		//click next
		next.removeEvents().addEvents({
		'click' : function(evt) {
			var myEffects = new Fx.Morph(arrImg[index],{ 'duration': durationTime });
			myEffects.start({
				'opacity' : [1 , 0]
			});
			if(index == arrImg.length - 1) {
				index = 0;
			} else {
				index++;
			}
			if(mySlideShowEff) {
				$clear(mySlideShowEff);
				mySlideShowEff = conWay.mySlideShow.periodical(conWay.duration); 
			}
			
			var myEffects = new Fx.Morph(arrImg[index],{ 'duration': durationTime });
			myEffects.start({
				'opacity' : [0 , 1]
			});
			idContent.setStyles({'height' :  arrImg[index].getCoordinates().height +conWay.padding});	
				
		},
		'mouseenter': function(){
			//next.fireEvent('click');
		}
		});		
		conWay.mySlideShow = function() {
			var myEffects = new Fx.Morph(arrImg[index],{ 'duration': durationTime });
			myEffects.start({
				'opacity' : [1 , 0]
			});
			if(index == arrImg.length - 1) {
				index = 0;
			} else {
				index++;
			}
			var myEffects = new Fx.Morph(arrImg[index],{ 'duration': durationTime });
			myEffects.start({
				'opacity' : [0 , 1]
			});
		};
		
		if(mySlideShowEff) $clear(mySlideShowEff);
		mySlideShowEff = conWay.mySlideShow.periodical(conWay.duration); 		
	}
});