function SlideShow(content) {

	var slideshow = this;

	slideshow.overlayimage = content.overlayimage;
	this.dh = Ext.DomHelper;
	this.numitems = content.items.length;

	this.slides = [];
	var arr = [];
	this.taskrunner = new Ext.util.TaskRunner();

	var nav = {tag: 'div', id: 'nav'};
	var navchildren = [];

	var newsrc = content.items[0].nav.replace('off.png','on.png');
	content.items[0].nav = newsrc;

	for (var i = 0; i < content.items.length; i++) {
		navchildren.push({tag: 'ul', id: 'nav' + i, 
			children: {id: 'navul-nav' + i, tag: 'li', 
				children: {tag: 'img', src: content.items[i].nav, id: 'image' + i}
			}
		});
		
		if (content.items[i].caption) {
			slideshow.hascaptions = true;
		}
	}

	if (slideshow.hascaptions) {
		Ext.get('slideshow').on('mouseover',function(){
			var captiondiv = Ext.get('captiondiv');
			slideshow.dh.overwrite('captiondiv',content.items[slideshow.currentnav].caption);
			captiondiv.fadeIn();
		});

		Ext.get('slideshow').on('mouseout',function(){
			var captiondiv = Ext.get('captiondiv');
			captiondiv.fadeOut();
		});
	}


	var child = [{id: 'slideimg', tag: 'img', src: content.items[0].mainimg}];
	
	if (slideshow.overlayimage) {
		child[0].style = 'position: absolute; z-index: 1000;';
	}
	
	var wrapchildren = [];

	if (content.items[0].link) {
		wrapchildren = [{tag: 'a', id: 'slidedivlink', href: content.items[0].link, children: child},nav];
	}

	else {
		wrapchildren = [child,nav];
	}

	if (slideshow.overlayimage) {
		wrapchildren.unshift({tag: 'img', 'style': 'position: absolute; z-index: 9999999;', src: '/static/images/slideshow_basic/slideshow_basic_overlay.png'});
	}
	
	nav.children = navchildren;
	this.dh.append('slideshow',{id: 'wrapx', children: wrapchildren});

	if (slideshow.hascaptions) {
		this.dh.append('wrapx',{id: 'captiondiv', style: 'display: none; z-index: 99999999;'});
	}

	this.setbackground = function(){
		var currentid = slideshow.currentnav;
		var nextid = slideshow.nextslide(currentid);
		Ext.get('slideshow').setStyle('background-image','url(' + content.items[nextid].mainimg + ')');
	}

	this.nextslide = function(num) {
		var slideshow = this;
    	if (slideshow.currentnav == parseInt(content.items.length - 1)) {
    		return 0;
    	}

    	else {
    		return slideshow.currentnav + 1;
    	}
	};

	this.rotatejob = {
	    run: function(){
	    	var clickon;
	    	if (slideshow.currentnav == parseInt(content.items.length - 1)) {
	    		clickon = 0;
	    	}

	    	else {
	    		clickon = slideshow.currentnav + 1;
	    	}

	    	slideshow.clicky({clickon: clickon},'junk');
	    },
	    interval: 10000
	};

	this.clicky = function(event,t){
		var slideimg = Ext.get('slideimg');
				
		var oldid = slideshow.currentnav;
		var id;
		
		if (!isNaN(event.clickon)) {
			id = event.clickon;
		}
		
		else {
			id = t.id.substring(t.id.length - 1);
		}

		if (id == slideshow.currentnav) {
			return;
		}

		slideshow.setbackground();
		slideimg.fadeOut({duration: 1.5,
						  callback: function(){

			Ext.get('slideimg').set({src: content.items[id].mainimg});
			
			if (slideshow.hascaptions) {
				slideshow.dh.overwrite('captiondiv',content.items[slideshow.currentnav].caption);
			}
			Ext.get('slideimg').fadeIn({duration: 1.5});

		}});

		if (Ext.get('slidedivlink')) {
			Ext.get('slidedivlink').set({href: content.items[id].link});
		}

		if (Ext.get('nav')) {
	//Change the current button
			var currentid = slideshow.currentnav;
			var src = Ext.get('image' + currentid).getAttribute('src');
			var newsrc2 = src.replace('on.png','off.png');
			Ext.get('image'+currentid).set({src: newsrc2});

	//Change the new button				
			var src2 = Ext.get('image' + id).getAttribute('src');
			var newsrc3 = src2.replace('off.png','on.png');
			Ext.get('image'+id).set({src: newsrc3});
		}
		
		slideshow.currentnav = parseInt(id);
	};

	this.render = function(div,slide){
		var slideshow = this;
		slideshow.currentnav = 0;
		for (var i = 0; i < content.items.length; i++) {
			Ext.get('navul-nav' + i).on('click',function(event,t){	
				slideshow.clicky(event,t);
		})};
		
		slideshow.setbackground();
		
		
		var task = new Ext.util.DelayedTask(function(){
			slideshow.taskrunner.start(slideshow.rotatejob);
		});

		task.delay(10000);
	};
};



