$(document).ready(function() {
//alert('test');
$('.btnEnlarge').click(enlargeImage);
/*$('.btnEnlarge').click(function(){
alert('test');
})//btnEnlarge*/


$('.viewArticle').click(function(){
								
$(this).next().next().next().addClass("long");
})//viewArticle


$('.closeArticle').click(function(){
								
$(this).next().next().removeClass("long");

})//viewArticle

//window.HomePageHero = new SuperHero($('#mainHero'));


});//document



var SuperHero = function(container) {
	var self = this;
	var timer = null;
	this.panels = new Array();
	this.currentIndex = 0;
	var flashPlayerVersion = swfobject.getFlashPlayerVersion();
	this.hasFlash = (flashPlayerVersion && flashPlayerVersion.major >= 8 ? true : false);

	this.init = function() {
		$('.panel', container).each(function(i) {
			var duration = Number($(this).attr('data-duration'));
			var imgDuration = Number($(this).attr('data-img-duration'));
			var swfDuration = Number($(this).attr('data-swf-duration'));
			var imgSrc = $(this).attr('data-img');
			var swfSrc = $(this).attr('data-swf');
			var type = 'image';
			var altText = $('a', this).text();
			var date = new Date();
			var id = 'hero' + i + date.getTime();
			$('a', this).attr('id', id).html('<img src="' + imgSrc + '" width="378" height="302" border="0" alt="' + altText + '" />');
			if (swfSrc) {
				if (self.hasFlash) {
					type = 'flash';
					var flashvars = {};
					var autoplay = (i == 0 ? 'true' : 'false' );
					var params = {wmode: 'opaque', play: autoplay, allowScriptAccess: 'always'};
					var attributes = {id: id, name: id};
					swfobject.embedSWF(swfSrc, id, '378', '302', '9', '', flashvars, params, attributes);
					duration = swfDuration;
				} else {
					duration = imgDuration;
				}
			}
			self.panels.push({elem: this, duration: duration, type: type, id: id});
		}).eq(0).addClass('show');
		
		self.buildControls();
		self.play();
		container.removeClass('loading');
	}
	
	this.buildControls = function() {
		var controls = $('<div class="controls"><a class="button btnPause" href="#">Play/Pause</a><div class="pagination"></div></div>');
		for (var i = 0; i < self.panels.length; i++) {
			$('<a href="#">' + (i+1) + '</a>').appendTo($('.pagination', controls));
		}
		$('.pagination a', controls).eq(0).addClass('selected');
		
		
		$('.button', controls).click(function() {
			if ($(this).hasClass('btnPlay')) {
				self.play();
			}
			else if ($(this).hasClass('btnPause')) {
				self.pause();
			}
			return false;
		});
		
		$('.pagination a', controls).click(function() {
			var index = Number($(this).text()) - 1;
			self.pause();
			self.gotoIndex(index);
			return false;
		});
		
		container.append(controls);
	}
	
	

	this.next = function() {
		var nextIndex = self.currentIndex + 1;
		if (self.currentIndex == (self.panels.length - 1)) nextIndex = 0;
		self.gotoIndex(nextIndex);
		var duration = self.panels[nextIndex].duration * 1000;
		self.timer = setTimeout(self.next, duration);
	}
	
	this.gotoIndex = function(nextIndex) {
		if (self.currentIndex == nextIndex) return false;
		
		var currentPanel = self.panels[self.currentIndex ].elem;
		var nextPanel = self.panels[nextIndex].elem;
		
		if (self.panels[self.currentIndex].type == 'flash') {
			var id = self.panels[self.currentIndex].id;
			document.getElementById(id).StopPlay();
			document.getElementById(id).Rewind();
		}
		$(currentPanel).fadeOut().removeClass('show');
		$(nextPanel).fadeIn(500, function() {
			$(this).addClass('show');
			if (self.panels[nextIndex].type == 'flash') {
				var id = self.panels[nextIndex].id;	
				document.getElementById(id).Play();
			}
		});
		self.currentIndex = nextIndex;
		
		$('.pagination a', container).removeClass('selected').eq(nextIndex).addClass('selected');
	}
	
	this.play = function() {
		var currentPanel = self.panels[self.currentIndex];
		var duration = currentPanel.duration * 1000;
		self.timer = setTimeout(self.next, duration);
		$('.controls .button', container).removeClass('btnPlay').addClass('btnPause');
	}
	
	this.pause = function() { 
		clearTimeout(self.timer);
		$('.controls .button', container).removeClass('btnPause').addClass('btnPlay');
	}
	
	this.init();
}

function enlargeImage(e) {
    //alert(e);
	if ($('#enlargedImage').size() > 0) return false;
	var offsetLeft = Math.round(( $(document).width() - 450) / 2);
	//var offsetTop = Math.round(($(document).height() - 677) / 2 );
	var isIE6 = ($.browser.msie && parseInt($.browser.version) <= 6);
	var imgSrc= $(this).attr("src").replace(/thumbnails/, "");
	//var bIndex = $(this).parent().next().firstChild().attr("src").replace(/thumbnails/, "");
	//alert($(this).attr("src"));
	

	
	$('<div id="enlargedImage"/>')
		.css({left: e.pageX, top: e.pageY})
		.appendTo('body')
		//.draggable({start: function() {$(this).appendTo('body')}})
		//.draggable()
		.css({width:'473px', height:'450px', left:offsetLeft, top:270})
		.append('<span class="shadow" /><span class="button btnClose" id="btnClose"/><div class="clear"/>', function(){  });
		$('#btnClose').click(function() {
							  //alert("dfdf");
				$('#enlargedImage').remove();
			});
	$('<img width="450" height="450" border="0" />').attr('src', imgSrc).appendTo($('#enlargedImage'));

	return false;
}//enlargeImage

/*function enlargeImage(e) {
    //alert(e);
	if ($('#enlargedImage').size() > 0) return false;
	var offsetLeft = Math.round(( $(document).width() - 450) / 2);
	var offsetTop = Math.round(($(document).height() - 677) / 2 );
	var isIE6 = ($.browser.msie && parseInt($.browser.version) <= 6);
	var imgSrc= $(this).attr("src").replace(/thumbnails/, "");
	//var bIndex = $(this).parent().next().firstChild().attr("src").replace(/thumbnails/, "");
	//alert($(this).attr("src"));
	
	$('<div id="enlargedImage"/>')
		.css({left: e.pageX, top: e.pageY})
		.appendTo('body')
		//.draggable({start: function() {$(this).appendTo('body')}})
		//.draggable()
		.animate({width:'473px', height:'450px', left:offsetLeft, top:offsetTop}, 300, function() {
			//if (isIE6) {
//				$(this).bgiframe({top: '-3px', left: '-3px', width: '348px', height: '248px'});
//			}
			$(this).css({border:0}).append('<span class="shadow" /><span class="button btnClose"/><div class="clear"/>');
				$('<img width="450" height="450" border="0" />').attr('src', imgSrc).appendTo(this);
			$('.btnClose', this).click(function() {
				$(this).parent().fadeOut('fast', function() { $(this).remove(); });
			});
		})
		.click(function() {
			$(this).appendTo('body');
		});
	return false;
}//enlargeImage*/