$(document).ready(function(){
	$("body").append('<div id="heading"></div>')
	$("body").append('<div id="subheading"></div>')
	var subheading = "industries"
	for(var i = 0; i < 10; i++) {
		$("#heading").append('<div class="h'+i+'"></div>')
		$("#subheading").append('<div class="h'+i+'">'+subheading.charAt(i)+'</div>')
	}
	
	$("ul.screenshots li").hide()
	$("ul.screenshots li:first").show()
	
	$("ul.screenshots").append('<div class="tabs"></div>')
	for(var i = 0; i < 5; i++) {
		$("ul.screenshots div.tabs").append('<a href="javascript:;" rel="'+i+'">•</a> ').find("a:last").click(function(e){
			e.stopPropagation()
			$("ul.screenshots li").fadeOut("slow")
			$($("ul.screenshots li").get($(this).attr("rel"))).fadeIn("slow")
			$("ul.screenshots div.tabs a").removeClass("active")
			$(this).addClass("active")
		})
	}
	$("ul.screenshots").click(function(e){
		e.stopPropagation()
		var activeLink = $(this).find("a.active")
		var index = parseInt(activeLink.attr("rel"))
		var nextIndex = (index < 4 ? index + 1 : 0)
		activeLink.removeClass("active")
		$($("ul.screenshots div.tabs a").get(nextIndex)).addClass("active")
		$($("ul.screenshots li").get(index)).fadeOut("slow")
		$($("ul.screenshots li").get(nextIndex)).fadeIn("slow")
	})
	$("ul.screenshots div.tabs a:first").addClass("active")
})