var TimeToFade = 900.0;

function fadeIn(eid, fullOpacity) {
	var element = document.getElementById(eid);
	if(element == null)
    return;
	
	element.style.visibility = 'visible';
	
	if (!fullOpacity)
		var fullOpacity = 100;
	
	if(element.FadeState == null) {
		element.FadeState = -2;
	}
	
	if(element.FadeState == 1 || element.FadeState == -1)
	{
		element.FadeState = 1;
		element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
	}
	else
	{
		element.FadeState = 1;
		element.FadeTimeLeft = TimeToFade;
		setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "'," + fullOpacity + ")", 33);
	}  
}

function fadeOut(eid, fullOpacity) {
	var element = document.getElementById(eid);
	if(element == null)
    return;
	
	if (!fullOpacity)
		var fullOpacity = 100;
	
	if(element.FadeState == null) {
		element.FadeState = 2;
	}
	
	if(element.FadeState == 1 || element.FadeState == -1)
	{
		element.FadeState = -1;
		element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
	}
	else
	{
		element.FadeState = -1;
		element.FadeTimeLeft = TimeToFade;
		setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "'," + fullOpacity + ")", 33);
	}  
}

function animateFade(lastTick, eid, fullOpacity)
{
	if (!fullOpacity)
		var fullOpacity = 100;
		
  var curTick = new Date().getTime();
  var elapsedTicks = curTick - lastTick;
 
  var element = document.getElementById(eid);
 
  if(element.FadeTimeLeft <= elapsedTicks)
  {
    element.style.opacity = element.FadeState == 1 ? (fullOpacity/100) : '0';
    element.style.filter = 'alpha(opacity = '
        + (element.FadeState == 1 ? (fullOpacity) : '0') + ')';
    element.FadeState = element.FadeState == 1 ? 2 : -2;
	if ( element.FadeState == -2)
		element.style.visibility='hidden';
    return;
  }
 
  element.FadeTimeLeft -= elapsedTicks;
  var newOpVal = element.FadeTimeLeft/TimeToFade*fullOpacity/100;
  if(element.FadeState == 1)
    newOpVal = (fullOpacity/100) - newOpVal;

  element.style.opacity = newOpVal;
  element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
 
  setTimeout("animateFade(" + curTick + ",'" + eid + "'," + fullOpacity + ")", 33);
}

function allFadeOut() {
	fadeIn('the_paint_button');
	
	fadeOut('secondary_focus');
	fadeOut('header');
	fadeOut('paint_sub_text');
	fadeOut('globe');
}

function allFadeIn() {
	fadeOut('the_paint_button');
	
	fadeIn('secondary_focus');
	fadeIn('header');
	fadeIn('paint_sub_text');
	fadeIn('globe');
}


function disableAll() {
	// Reset the Mouse Overs	
	document.getElementById('paint_button_container').onmouseover=null;
	document.getElementById('paint_button_container').onmouseout=null;
	document.getElementById('paint_button_img').onclick=null;
	
	document.getElementById('globe').visibility="hidden";
}

// Supporting steps
function step1_support() {
	document.getElementById("paint_sub_text").innerHTML="<h3>Step 1: Like us on Facebook</h3>";
	var element = document.getElementById('step1_container');
	element.style.display="block";
	fadeIn("step1_container");
	fadeIn("paint_sub_text");
}

function step2_support() {
	document.getElementById("step1_container").style.display="none";
	document.getElementById("paint_sub_text").innerHTML="<h3>Step 2: Follow us on Twitter</h3>";
	var element = document.getElementById('step2_container');
	element.style.display="block";
	fadeIn("step2_container");
	fadeIn("paint_sub_text");
}
function step3_support() {
	document.getElementById("step2_container").style.display="none";
	document.getElementById("paint_sub_text").innerHTML="<h3>Step 3: Share this Website with the World</h3>";
	var element = document.getElementById('step3_container');
	element.style.display="block";
	fadeIn("step3_container");
	fadeIn("paint_sub_text");
}

function step4_support() {
	document.getElementById("paint_sub_text").innerHTML="<h3>Step 4: Get Your Free 4-Track EP</h3>";
	var element = document.getElementById('steps_wrapper');
	element.style.textAlign='center';
	element.innerHTML='<div class="topspin-widget topspin-widget-email-for-media"><object type="application/x-shockwave-flash" width="400" height="80" id="TSWidget96223" data="http://cdn.topspin.net/widgets/email2/swf/TSEmailMediaWidget.swf?timestamp=1314707342" bgColor="#000000"><param value="always" name="allowScriptAccess" />  <param name="allowfullscreen" value="true" />  <param name="quality" value="high" />  <param name="movie" value="http://cdn.topspin.net/widgets/email2/swf/TSEmailMediaWidget.swf?timestamp=1314707342" /> <param name="flashvars" value="widget_id=http://cdn.topspin.net/api/v1/artist/2132/email_for_media/96223?timestamp=1314707342&amp;theme=black&amp;highlightColor=0x6993C8&amp;viewtype=player&amp;displayInitialScreen=false;" /></object></div><p style="font-size:11px;color:#777;">Included Tracks: Sophistry, Contradicting Clouds, Daylight and Champion<br />Tracks can be downloaded individually in High-Quality MP3 (320 Kbps, DRM free)</p><button type="button" onclick="step5_showMe()">Next >></button>';
	fadeIn("steps_wrapper");
	fadeIn("paint_sub_text");
}

function step5_support() {
	document.getElementById("paint_sub_text").innerHTML="<h3>Step 5: Watch the Sophistry Music Video</h3>";
	document.getElementById("paint_sub_text").style.backgroundImage="url('images/CTE/black_transparent_fill.png')";
	var element = document.getElementById('steps_wrapper');
	//element.innerHTML='<iframe width="560" height="345" src="http://www.youtube.com/embed/eLuhJYKjLFU" frameborder="0" allowfullscreen></iframe><button type="button" style="margin-top:15px;" onclick="step6_showMe()">Next >></button>';
	element.innerHTML='<iframe title="YouTube video player" width="560" height="345" src="http://www.youtube.com/embed/eLuhJYKjLFU?rel=0&controls=1&autohide=1&autoplay=1&playlist=gKCf1eKYOYc" frameborder="0" allowfullscreen></iframe><button type="button" style="margin-top:15px;" onclick="step6_showMe()">Next >></button>';
	fadeIn("paint_sub_text");
	fadeIn("steps_wrapper");
}

function step6_support() {
	document.getElementById("paint_sub_text").innerHTML="<h3>Step 6: Grab Yourself an Album</h3>";
	document.getElementById("paint_sub_text").style.backgroundImage="url('images/CTE/black_transparent_fill.png')";
	var element = document.getElementById('steps_wrapper');
	element.style.backgroundImage="url('images/CTE/black_transparent_fill.png')";
	element.innerHTML='<style type="text/css">table { width: 530px; } td { text-align:left; } .button_td { text-align:right } a { color:#fff; text-decoration:none; } a:hover { text-decoration:underline; }</style><table><tr><td colspan="3" style="text-align:right;padding-bottom:10px;font-size:12px;" align="right">Not from South Africa? Click <a href="store/index.php?location=int" target="_blank" style="text-decoration:underline;">here</a> <img style="margin-left: 10px" src="images/CTE/sa_flag_small.gif" /></td></tr><tr><td class="product_td"><a href="http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=1" target="_blank">Limited Edition CD</a></td><td><a href="http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=1" target="_blank">R 89.99 + P&H</a></td><td class="button_td"><button type="button" onclick="window.location.href=' + "'http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=1'" + '">Buy It</button></td></tr><tr><td class="product_td"><a href="http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=3" target="_blank">Download - Apple Lossless</a></td><td><a href="http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=3" target="_blank">R 49.99</a></td><td class="button_td"><button type="button" onclick="window.location.href=' + "'http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=3'" + '">Buy It</button></td></tr><tr><td class="product_td"><a href="http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=2" target="_blank">Download - MP3</a></td><td><a href="http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=2" target="_blank">R 39.99</a></td><td class="button_td" onclick="window.location.href=' + "'http://www.sellmusic.co.za/contradictingclouds/store/?action=checkout&productID=2'" + '"><button type="button">Buy It</button></td></tr><tr><td colspan="3" class="button_td" style="padding-top:20px;"><button type="button" onclick="credits_band_showMe()">Next >></button></td></tr></table>';
	fadeIn("paint_sub_text");
	fadeIn("steps_wrapper");
}

function credits_band_support() {
	document.getElementById("paint_sub_text").innerHTML="<h3>Credits</h3>";
	var element = document.getElementById('steps_wrapper');
	element.style.backgroundImage="none";
	element.innerHTML='<p><strong>Contradicting Clouds Are</strong><br />Eln&eacute; Pretorius - Vocals & Keys<br />Gerhard Van Der Merwe - Guitar & ProTools<br />Paul Pretorius - Drums<br />Brendon Bezuidenhout - Guitar<br />Matt Kennedy van Dam - Bass</p><p><button type="button" style="margin-top:15px;" onclick="end_message_showMe()">Skip >></button></p>';
	fadeIn("steps_wrapper");
		fadeIn("paint_sub_text");
	setTimeout('credits_design_showMe()', ( TimeToFade + 5000 ));
}

function credits_design_support() {
	var element = document.getElementById('steps_wrapper');
	element.style.backgroundImage="none";
	element.innerHTML="<p><strong>Web Design</strong><br />Paul Pretorius</p><p><strong>Background Image</strong><br />Eon by <a href='http://hameed.deviantart.com' target='_blank'>Hameed</a><br />(Thanks a million!)</p>" + '<p><button type="button" style="margin-top:15px;" onclick="end_message_showMe()">Skip >></button></p>';
	fadeIn("steps_wrapper");
	setTimeout('credits_shotopop_showMe()', ( TimeToFade + 5000 ));
}

function credits_shotopop_support() {
	var element = document.getElementById('steps_wrapper');
	element.style.backgroundImage="none";
	element.innerHTML="<p><strong>Sophistry Music Video</strong><br />Casper Franken & Carin Stanford<br /><a href='http://www.shotopop.com' target='_blank'>www.shotopop.com</a></p><p><strong>Album Art</strong><br />Casper Franken</p>" + '<p><button type="button" style="margin-top:15px;" onclick="end_message_showMe()">Skip >></button></p>';
	fadeIn("steps_wrapper");
	setTimeout('end_message_showMe()', ( TimeToFade + 5000 ));
}

function end_message_support() {
	document.getElementById("paint_sub_text").innerHTML="<h3>You are AWESOME!</h3>";
	var element = document.getElementById('steps_wrapper');
	element.style.backgroundImage="none";
	element.innerHTML="<p>Thanks for conquering the Earth with us.</p><p>We hope you love the music and share it with everyone!</p><p>Good bye!<br />Contradicting Clouds</p>";
	fadeIn("steps_wrapper");
	fadeIn("paint_sub_text");
}

// Main steps
function step1_showMe() {
	disableAll();
	fadeOut('the_paint_button');
	setTimeout('step1_support()', ( TimeToFade + 200 ));
}

function step2_showMe() {
	fadeOut("step1_container");
	fadeOut("paint_sub_text");
	setTimeout('step2_support()', ( TimeToFade + 200 ));
}

function step3_showMe() {
	fadeOut("step2_container");
	fadeOut("paint_sub_text");
	setTimeout('step3_support()', ( TimeToFade + 200 ));
}

function step4_showMe() {
	fadeOut("steps_wrapper");
	fadeOut("paint_sub_text");
	setTimeout('step4_support()', ( TimeToFade + 200 ));
}

function step5_showMe() {
	fadeOut("steps_wrapper");
	fadeOut("paint_sub_text");
	moveTheMargin('paint_button_container', 92);
	setTimeout('step5_support()', ( TimeToFade + 200 ));
}

function step6_showMe() {
	fadeOut("steps_wrapper");
	fadeOut("paint_sub_text");
	setTimeout('step6_support()', ( TimeToFade + 200 ));
}

function credits_band_showMe() {
	fadeOut("steps_wrapper");
	fadeOut("paint_sub_text");
	setTimeout('credits_band_support()', ( TimeToFade + 200 ));
}

function credits_design_showMe() {
	fadeOut("steps_wrapper");
	setTimeout('credits_design_support()', ( TimeToFade + 200 ));
}

function credits_shotopop_showMe() {
	fadeOut("steps_wrapper");
	setTimeout('credits_shotopop_support()', ( TimeToFade + 200 ));
}

function end_message_showMe() {
	fadeOut("steps_wrapper");
	fadeOut("paint_sub_text");
	setTimeout('end_message_support()', ( TimeToFade + 200 ));
	setTimeout('backgroundFadeOut(100)', ( TimeToFade + 5000 ) );
}

function moveTheMargin( eid, oldVal ) {

	var element = document.getElementById( eid );
	if ( element == null ) return;
	
	if ( oldVal <= 1 ) {
		element.style.marginTop='0';
		return;
	}
	element.style.marginTop=( oldVal +  'px');
	var newVal = oldVal - 5;
	setTimeout( "moveTheMargin('" + eid + "', " + newVal + ")", 33 );
}

function backgroundFadeOut( newOpVal ) {
	var element = document.getElementById('wrapper');

	if ( newOpVal < 5 ) {
		newOpVal = 0;
		element.style.opacity = '0';
		element.style.filter = ( 'alpha(opacity=0)' );
		window.location.href="http://contradictingclouds.com";
		return;
	}

	element.style.opacity = ( newOpVal/100 + '');
	element.style.filter = ( 'alpha(opacity=' + newOpVal + ')' );
	
	setTimeout( "backgroundFadeOut(" + (newOpVal-1) + ")", 33 );
}

// Functions for displaying bottom thumbnail tabs
function bf_show_tab( tab_id ) {
	document.getElementById( tab_id + '_title' ).style.display = 'none';
	document.getElementById( tab_id + '_internal' ).style.display = 'block';
}

function bf_hide_tab( tab_id ) {
	document.getElementById( tab_id + '_title' ).style.display = 'inline';
	document.getElementById( tab_id + '_internal' ).style.display = 'none';
}

