$(document).ready(function(){

var queue=new Array();
var timer;
var timer0;
var timer1;
var timer2;
var fullscreen;
var locker;
var lock = false;
var aniload = false;
var autoplay = false;
var autoadd = true;
var addcolorbttn = false;
var playing = false;
var playlanding = false;
var url = location.pathname.substr(1); 
var scenario = '';
var height = $(window).height();
var f11count = 0;

$.preloadImages("/img/marker.png", "/img/mask.png", "/img/wheel.png", "/img/play_b.png", "/img/play_w.png", "/img/stop_b.png", "/img/stop_w.png", "/img/reset_b.png", "/img/reset_w.png");

$('#color').focus(function() {
		$(this).data('hex', $(this).val());//.val('');
		$('#colorok').show();
		clearAllTimeouts();
		$('body').unbind();
	})
	.blur(function() {
		$('body').mousemove(ShowDialog); 	
		if ($(this).val() == '' || $(this).val() == $(this).data('hex')) {
			$('#colorok').hide();
			 $(this).val($(this).data('hex'));
		}
		
	});

$("form").submit(function() {
	var hexcolor = "#"+$("#color").val().replace('#','');
	if (hexvalidate(hexcolor) == true) {
		if (hexcolor.length == 4) {
			hexcolor = "#" + hexcolor.charAt(1) + hexcolor.charAt(1) + hexcolor.charAt(2) + hexcolor.charAt(2) + hexcolor.charAt(3) + hexcolor.charAt(3);
		}
		updateColor(hexcolor, false, false);
		$('#colorok').hide(); 
	} else {
		alert ("Invalid color: "+ hexcolor);	
	}
	return false;
});
    



	 
//var randomnumber=Math.floor(Math.random()*64);
var randomnumber = 33;
(function($) {
  $.fn.colorPicker = function($$options) {
    // Defaults
    var $defaults = {
   color:new Array(
  /* 
	"#0b420e", "#257228", "#4e9152", "#a8b6c4", "#73839e", "#3e64a6", "#192e50", "#0d182c",
	"#f2eab1", "#f7eba4", "#fbb162", "#dc5f1f", "#933c06", "#71300b", "#572600", "#3e1400", 
	"#fab99d", "#fcd7cb", "#fed6b7", "#fcdfe7", "#b25757", "#723636", "#661a1a", "#380909",
	"#cd2585", "#a30046", "#c60b46", "#86001c", "#7a003c", "#88184e", "#860038", "#571c1f",
	"#cfd3d5", "#bcc2c6", "#babcbe", "#859ab1", "#455560", "#96b4de", "#49638f", "#0055a5",
	"#1b4164", "#626d9c", "#9a9bcd", "#8988b7", "#63619a", "#6e2f56", "#352c66", "#41132f",
	"#dcf1f9", "#00929f", "#76a5c3", "#498bae", "#004f5f", "#daebec", "#d7eac5", "#c9ded7",
	"#d5d69c", "#4c721d", "#085642", "#566422", "#aba66f", "#6c592f", "#5f5a32", "#231f20"
*/

'#000000', '#ffffff', '#1693a5', '#fbb829', '#fcfbe3', '#c3ff68', '#f02311', '#cdd7b6', '#add8c7', '#f0f0d8', '#800f25', '#d2e4fc', '#f7fdfa', '#f4fce8', '#ff0000', '#f4fff9', '#edf7ff', '#d8d8c0', '#d9ffa9', '#a40778', '#333333', '#f0f0f0', '#7fff24', '#faf2f8', '#6cdfea', '#ff9900', '#e1fafc', '#ad234b', '#ff099c', '#e3f6f3', '#948c75', '#fef9f0', '#7f94b0', '#025d8c', '#556270', '#fcf9fc', '#77cca4', '#fc0f3e', '#ff5eaa', '#ff0066', '#369699', '#a40802', '#b0f8ff', '#2a8fbd', '#a1bee6', '#e9eff2', '#b3c7eb', '#8eafd1', '#e73525', '#ccff00', '#c0addb', '#fcf7fa', '#901f0f', '#919999', '#fbffe5', '#d3b2d1', '#1b70e0', '#2b2b2b', '#666666', '#7ba5d1', '#ffff00', '#a30006', '#ffcc00', '#f20f62'

	),
      defaultColor: randomnumber,
      columns: 0,
      click: function($color){}
    };
		
    var $settings = $.extend({}, $defaults, $$options);
		
    // Iterate and reformat each matched element
    return this.each(function() {
      var $this = $(this);
      // build element specific options
      var o = $.meta ? $.extend({}, $settings, $this.data()) : $settings;
      var $$oldIndex = typeof(o.defaultColor)=='number' ? o.defaultColor : -1;
      
      var _html = "";
      for(i=0;i<o.color.length;i++){
	_html += '<div style="background-color:'+o.color[i]+';"></div>';
	if($$oldIndex==-1 && o.defaultColor==o.color[i]) $$oldIndex = i;
      }
      
      $this.html('<div class="colorselect">'+_html+'</div>');
      var $color = $this.children('.colorselect').children('div');
      
      // Subscribe to click event of each color box
      $color.each(function(i){
	$(this).click(function(){

	updateColor(o.color[i], false, false);

	  // Trigger user event
	  o.click(o.color[i]);
	});
      });
      
      // Simulate click for defaultColor
      _tmp = $$oldIndex;
      $$oldIndex = -1;
  //    $color.eq(_tmp).trigger('click');
    });    
    return this;
  };
  
  
})(jQuery);

/**
 * Return true if color is dark, false otherwise.
 * (C) 2008 Syronex / J.M. Rosengard
 **/
/*function isdark1(color){
  var colr = parseInt(color.substr(1), 16);
  return (colr >>> 16) // R
    + ((colr >>> 8) & 0x00ff) // G 
    + (colr & 0x0000ff) // B
    < 400;
}
*/

function isdark(color){ 
return (Number('0x'+color.substr(1)).toString(10) < 0xffffff/2); 
}


var blinktimer;
function blink(swtch){
	if (swtch == 'on') {
    blinktimer = window.setInterval(function(){
        $("#playimg").animate({opacity: "0.1"}, 150);
        window.setTimeout(function(){
            $("#playimg").animate({opacity: "1"}, 150);
        }, 250);
    }, 1500);
    } else {
    	clearInterval(blinktimer);
   	}
    //window.setTimeout(function(){clearInterval(timer);}, time);
}




var f = $.farbtastic('#picker', function callback(color) { 
//	updateColor(color, false);
});







$(".tab:not(:first)").hide();
$(".tab:first").show();

$(".htabs a:first").addClass('selectedTab');
$(".htabs a:not(:first)").addClass('NotselectedTab');
	
$('.htabs li a:eq(0)').click(function() {
	if ($('.htabs li a:eq(0)').hasClass('selectedTab')) { randomizeColor(); }
});


$(".htabs a").click(function(){
	$(".htabs a").removeClass('selectedTab').addClass('NotselectedTab');

	if ($(this).attr('href') == '#random' && $(this).hasClass('selectedTab')) randomizeColor();
	stringref = $(this).addClass('selectedTab').removeClass('NotselectedTab').attr("href").split('#')[1];

if (stringref == 'custom') {
    f.linkTo(function callback(color) { 
	updateColor(color, false, true);
});
    
} else {
    f.linkTo(function callback(color) { 
//	updateColor(color, false);
});
        
}


	
	if (jQuery.browser.msie && jQuery.browser.version.substr(0,3) == "6.0") {
		$('.tab#' + stringref).show();
	}
	else {
		$('.tab#' + stringref).fadeIn();
	}
		$('.tab:not(#'+stringref+')').hide();
	return false;
});
	
function clearAllTimeouts() {
	clearTimeout(locker);
	clearTimeout(timer);
	clearTimeout(timer0);
	clearTimeout(timer1);
	clearTimeout(timer2);
	clearTimeout(fullscreen);
}


function ShowDialog() {
	clearAllTimeouts();
	//$('#fullscreen').stop().fadeOut('fast');
	$('#closebutton').text("X");
	$('body').css('cursor', 'default');
if (aniload == true) {
	aniload = false;
	//alert (queue);
	$('#control').show();
	//fadeIn("slow", function(){
		
//		alert ('ok2');

//});
fillPlaylist(queue);
	
} else {
$('#control').fadeIn("slow");
}
	aniload = false;
	timer2 = setTimeout(function() { $('#closebutton').text("2");}, 900);
	timer1 = setTimeout(function() { $('#closebutton').text("1");}, 1800);
	timer0 = setTimeout(function() { $('#closebutton').text("0");}, 2700);
	timer = setTimeout(function() {  
		$('#control').fadeOut("slow", function () {
			$('body').css('cursor', 'none');
			
			if ($(window).height() <= height && f11count < 3 && (navigator.platform == "Win32" || navigator.platform == "Win64")) {
			
				fullscreen = setTimeout(function() {
					$('#fullscreen').slideDown(500).delay(3200).slideUp(500);
					f11count++;
				}, 2500);
				
			}
	
		});   
		$('body').unbind();
		//	$('#control').hide();
	$('body').css('cursor', 'none');  
		var moveCount = 0;
		//locker = setTimeout(function() {  $('body').mousemove(ShowDialog); }, 1000);
		
		locker = setTimeout(function() {
		$('body').mousemove(ShowDialog);
		//$('body').unbind();
	/*
			$('body').mousemove(function() {
			
				if(moveCount > 0) return; //first run?
				moveCount++;
				clearAllTimeouts();
				
				$('body').unbind('mousemove');
				
				ShowDialog();		
				//$(this).unbind('mousemove'); 
*/
	
		//	}); 
		}, 500);
	
	}, 3000);

		

};



$('#closebutton').click(function() {
	$('body').unbind('mousemove');
	clearAllTimeouts();
	$('#control').hide();
	$('body').css('cursor', 'none');   
	locker = setTimeout(function() {  $('body').mousemove(ShowDialog); }, 1000);
});

$('#colors1').colorPicker({			
   color: [
 
	"#0b420e", "#257228", "#4e9152", "#a8b6c4", "#73839e", "#3e64a6", "#192e50", "#0d182c",
	"#f2eab1", "#f7eba4", "#fbb162", "#dc5f1f", "#933c06", "#71300b", "#572600", "#3e1400", 
	"#fab99d", "#fcd7cb", "#fed6b7", "#fcdfe7", "#b25757", "#723636", "#661a1a", "#380909",
	"#cd2585", "#a30046", "#c60b46", "#86001c", "#7a003c", "#88184e", "#860038", "#571c1f",
	"#cfd3d5", "#bcc2c6", "#babcbe", "#859ab1", "#455560", "#96b4de", "#49638f", "#0055a5",
	"#1b4164", "#626d9c", "#9a9bcd", "#8988b7", "#63619a", "#6e2f56", "#352c66", "#41132f",
	"#dcf1f9", "#00929f", "#76a5c3", "#498bae", "#004f5f", "#daebec", "#d7eac5", "#c9ded7",
	"#d5d69c", "#4c721d", "#085642", "#566422", "#aba66f", "#6c592f", "#5f5a32", "#231f20"]
});

$('#colors3').colorPicker({			
	color: ['#000000', '#FFFFFF', '#1693A5', '#FBB829', '#CDD7B6', '#C3FF68', '#FF0000', '#ADD8C7', '#FF0066', '#556270', '#333333', '#FCFBE3', '#F0F0D8', '#F02311', '#FF9900', '#800F25', '#2A8FBD', '#CCFF00', '#A40802', '#FF5EAA', '#666666', '#6CDFEA', '#AD234B', '#D8D8C0', '#77CCA4', '#025D8C', '#FE4365', '#FF0033', '#F0F0F0', '#C7F464', '#D2E4FC', '#7F94B0', '#7F94B0', '#948C75', '#FC0F3E', '#D9FFA9', '#E73525', '#CCCCCC', '#999999', '#FF6666', '#FFCC00', '#420943', '#FFFF00', '#A0D4A4', '#7FAF1B', '#050505', '#2B2B2B', '#FF6600', '#F4FCE8', '#F7FDFA', '#0B8C8F', '#7FFF24', '#00B4FF', '#C0ADDB', '#630947', '#303030', '#FF099C', '#A1BEE6', '#A40778', '#FEF9F0', '#CAE8A2', '#E9EFF2', '#D7217E', '#F23A65']
});

$('#colors4').colorPicker({			
	color: ['#000000', '#1F75FE', '#B4674D', '#1CAC78', '#FF7538', '#EE204D', '#926EAE', '#FCE883', '#7366BD', '#FFAACC', '#0D98BA', '#C0448F', '#FF5349', '#5D76CB', '#F0E891', '#95918C', '#FDD9B5', '#FDDB6D', '#1DACD6', '#FC2847', '#F75394', '#FFFFFF', '#C5E384', '#FFAE42', '#FDBCB4', '#1A4876', '#C8385A', '#EDD19C', '#CD4A4C', '#F664AF', '#FFF44F', '#E7C697', '#1164B4', '#FD7C6E', '#EA7E5D', '#CB4154', '#9ACEEB', '#FF9BAA', '#BAB86C', '#FF2B2B', '#F8D568', '#158078', '#C5D0E6', '#FFCFAB', '#E6A8D7', '#EBC7DF', '#FAA76C', '#ECEABE', '#CDC5C2', '#9FE2BF', '#324AB2', '#77DDE7', '#FCB4D5', '#6DAE81', '#FCD975', '#6699CC', '#78DBE2', '#B0B7C6', '#FF7F49', '#BC5D58', '#DD9475', '#714B23', '#8E4585', '#D68A59']
	
});


function rndHex() {
	var rval = '00000'+(Math.random()*16777216<<0).toString(16);
	return ('#'+rval.substr(rval.length-6));
}

$('#colors2').colorPicker({			
	color: [
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),
		rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex(),rndHex()]	
//	,click: function(color){
	//	$('body').css('background-color', color);
//	} 
});

$('a').click(function(){$(this).blur();});

$('a.scroll').click(function() {
	if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'')
		&& location.hostname == this.hostname) {
		var $target = $(this.hash);
		$target = $target.length && $target	|| $('[name=' + this.hash.slice(1) +']');
		if ($target.length) {
			var targetOffset = $target.offset().top;
			$('#stop').trigger('click');
			$('html,body').animate({scrollTop: targetOffset}, 2000);
			return false;
		}
	}
});


ia = 0;

AddClr = setTimeout(function(){}, 1);
		
		
var prevcolor = '#ffffff';

function updateTxtColor (color) {
	altcolor = isdark(color) ? '#ffffff' : '#000000'; 
	altcolor2 = isdark(color) ? 'w' : 'b'; 
	$('body').css('color', altcolor);
	$('a').css('color', altcolor);
	$('#color').css('color', altcolor);
	$('#addcolor').css('color', altcolor);
	$('#navigation ul li').css('border-color', altcolor);
	$('#navigation ul ul').css('border-color', altcolor);
	$('#color').css('background-color', color).val(color.substr(color.length-6));
	$("#playimg").attr('src', '/img/play_'+altcolor2+'.png');
	$("#stopimg").attr('src', '/img/stop_'+altcolor2+'.png');
	$("#resetimg").attr('src', '/img/reset_'+altcolor2+'.png');  
  	$("#navigation ul li a ").each(function(){$(this).css('backgroundImage', 'url("/img/dd_'+altcolor2+'.png")');}); 
 	$("#tweetcolor").attr('href', 'http://twitter.com/home?status=my favorite color of the day: http://xoki.com/' + color.substr(color.length-6) + ' %40xoki_com');

}

$("#repeat").toggle(
      function () {
        $(this).html('<span><font face="Tahoma">&radic;</font> repeat</span>').addClass('buttondown');
        autoplay = true;
      },
      function () {
        $(this).html('<span>&nbsp;&nbsp; repeat</span>').removeClass('buttondown');
        autoplay = false;
      }
);
    
$("#autoadd").toggle(
      function () {
        $(this).html('<span>&nbsp;&nbsp; auto-add</span>').removeClass('buttondown');
        autoadd = false;
       $("#addcolor").show();
//$("#navigation ul:first").after('<a id="addcolor" class="button"><span>+ add color</span></a>');
      },
      function () {
        $(this).html('<span><font face="Tahoma">&radic;</font> auto-add</span>').addClass('buttondown');
        autoadd = true;
		$('#addcolor').hide();
      }
);


function AddPlaylistColor (color) {

	var prevcolor = $('#navigation li.colorbox:last').css('background-color');
    var altcolor = isdark(color) ? '#ffffff' : '#000000';

    $('#navigation li.colorbox:last').removeClass('currentColor');
    
    $("#navigation ul:first").append('<li class="gradient"></li>');
    $('#navigation li:last').gradientz({start: prevcolor, end: color}).css('z-index', '-5');
    
    $("#navigation ul:first").append('<li style="background-color:'+color+';color:'+altcolor+';" class="colorbox" id="id'+ia+'"><p>&nbsp;</p>'+
    '   <ul style="background-color:'+color+';color:'+altcolor+';">'+
    '      <li class="delete">! delete !</li>'+
    '      <li>fade in'+
    '        <ul style="background-color:'+color+';color:'+altcolor+';" class="fadein">'+
    '        <li alt="2">very fast</li>'+
    '        <li alt="4">fast</li>'+
    '        <li alt="6" class="selectedOption">normal</li>'+
    '        <li alt="8">slow</li>'+  
    '        <li alt="0">very slow</li>'+  
    '      </ul>'+
    '      </li>'+
    '      <li>hold'+
    '        <ul style="background-color:'+color+';color:'+altcolor+';" class="hold">'+
    '        <li alt="2">very short</li>'+
    '        <li alt="4">short</li>'+
    '        <li alt="6" class="selectedOption">normal</li>'+
    '        <li alt="8">long</li>'+
    '        <li alt="0">very long</li>'+
    '      </ul>'+
    '</li>'+
    '      <li class="copy">duplicate</li>'+
    '   </ul>'+
    '</li>');

    $('#navigation li.colorbox:last').addClass('currentColor');

}

    
function updateColor(color, addplaylist, picker) {

	if (playing === true) {
		if (playlanding === true) {
			$('#reset').trigger('click');
			playlanding = false;
		} else {
			$('#stop').trigger('click');
		}
   	}
   	
	if (picker == true) {
		altcolor = 	isdark(color) ? '#ffffff' : '#000000'; 
		$('body').css({'background-color': color});
		updateTxtColor (color)
		clearTimeout(AddClr);
		AddClr = setTimeout(function(){
			if (autoadd == true) AddPlaylistColor(color);
			queue.push([color,6,6]);
		}, 1500);

	} else {
	
	 altcolor = 	isdark(color) ? '#ffffff' : '#000000'; 
	 altcolor2 = 	isdark(color) ? 'w' : 'b'; 

	$('body').animate({ backgroundColor:  color}, 300);
	
	f.setColor(color);

 	updateTxtColor(color);

   	 
    //   $("#inputurlcolor").val('http://xoki.com/' + color.substr(color.length-6));
//	$('#twittertext').css('background-color', altcolor).css('color', isdark(color) ? '#000000' : '#ffffff');
	   	
	clearTimeout(AddClr);
	if ((autoadd == true || addplaylist == true) && blockaddcolor == false) {
		AddPlaylistColor(color);
		queue.push([color,6,6]);
	}


    
		ia++;
		if (ia == 4) {$('#playlist').slideDown('slow');}
		

	}
}

$('#tweetplaylist').click(function(){
	if (queue.length < 2) {
		alert("First select more colors");
		return false;
	}
	
	BitlyCB.shortenResponse = function(data) {
	        var s = '';
	        var first_result;
	        // Results are keyed by longUrl, so we need to grab the first one.
	        for     (var r in data.results) {
	                first_result = data.results[r]; break;
		}
	
	
		var dest = 'http://twitter.com/home?status=my color playlist of the day : '+ first_result['shortUrl'] + ' %40xoki_com';
	      	window.location = dest;  
	}
	
  	BitlyClient.shorten('http://xoki.com/play/'+colors2url(queue), 'BitlyCB.shortenResponse');
	
	
});



function fillPlaylist(colors) {
	prevcolor = "#ffffff";


	var SelOptHold = ['', '', '', '', '', '', '', '', '', ''];
	var SelOptFadeIn = ['', '', '', '', '', '', '', '', '', ''];
	var liwidth, grwidth, color; 
	for (x=0;x<colors.length;x++) { 
		
		color = queue[x][0];
//alert (color);
		liwidth = val2px(queue[x][2])+"px";
		SelOptHold[queue[x][2]] =  ' class="selectedOption"';
		grwidth = val2px(queue[x][1])+"px";
		SelOptFadeIn[queue[x][1]] =  ' class="selectedOption"';
		altcolor = isdark(color) ? '#ffffff' : '#000000';

		//alert (queue[x][0]+"|"+queue[x][1]+"|"+queue[x][2]+"|");

		$("#navigation ul:first").append('<li class="gradient" style="width: '+grwidth+';"></li>');
		$('#navigation li:last').gradientz({start: prevcolor, end: color}).css('z-index', '-5');
		
		$("#navigation ul:first").append('<li style="background-color:'+color+';color:'+altcolor+';width: '+liwidth+';" class="colorbox" id="id'+ia+'"><a href="">&nbsp;</a>'+
		' <ul style="background-color:'+color+';color:'+altcolor+';">'+
		'  <li class="delete">! delete !</li>'+
		'  <li>fade in'+
	        '   <ul style="background-color:'+color+';color:'+altcolor+';" class="fadein">'+
		'    <li alt="2"' + SelOptFadeIn[2] + '>very fast</li>'+
		'    <li alt="4"' + SelOptFadeIn[4] + '>fast</li>'+
		'    <li alt="6"' + SelOptFadeIn[6] + '>normal</li>'+
		'    <li alt="8"' + SelOptFadeIn[8] + '>slow</li>'+
		'    <li alt="0"' + SelOptFadeIn[0] + '>very slow</li>'+
		'   </ul>'+
		'  </li>'+
		'  <li>hold'+
		'   <ul style="background-color:'+color+';color:'+altcolor+';" class="hold">'+
		'    <li alt="2"' + SelOptHold[2] + '>very short</li>'+
		'    <li alt="4"' + SelOptHold[4] + '>short</li>'+
		'    <li alt="6"' + SelOptHold[6] + '>normal</li>'+
		'    <li alt="8"' + SelOptHold[8] + '>long</li>'+
		'    <li alt="0"' + SelOptHold[0] + '>very long</li>'+
		'   </ul>'+
		'  </li>'+
		'  <li class="copy">duplicate</li>'+
		' </ul>'+
		'</li>');
		SelOptHold[queue[x][2]] = '';
		SelOptFadeIn[queue[x][2]] = '';
		prevcolor = color;
}


}


var tstp = "";


function url2colors(string) {
	var outputArr = new Array();
	var u2c1 = string.split("-");
	for (var i=0; i<u2c1.length;i++) {
		outputArr2 = u2c1[i].split("_");
		outputArr.push(['#'+outputArr2[0], outputArr2[1], outputArr2[2]]);
//alert (outputArr2[0]);
	}
	return(outputArr);
}

function colors2url(arr) {
	var output = '';
	for (var i=0;i<arr.length;i++){
	   output += arr[i][0].substring(1) + "_" + arr[i][1] + "_" + arr[i][2] + "-"; 
	};
	return output.slice(0, -1);
}




$('#reset').click(function() {
 queue = [];
 $("#playingcolors div").remove();
});


$("#navigation ul li.colorbox").live('mouseover mouseout', function(event) {
  if (event.type == 'mouseover') {
   // $(this).addClass('selectedColor');
  } else if (event.type == 'mouseout'){
  //  $(this).removeClass('selectedColor');
  } 
});


var blockaddcolor = false;
//$("#navigation ul li").delegate('a', 'click', function(event) {
//$("#navigation ul li > a").live('click', function(event) {
$("#navigation ul li > p").live('click', function(event) {

//alert (rgb2hex($(this).parent().css('background-color')));
	blockaddcolor = true;
	updateColor(rgb2hex($(this).parent().css('background-color')), false, false);
	blockaddcolor = false;
//	$(this).parent().addClass('selectedColor');
	return false;
 
});



$("#navigation ul ul li.delete").live('click', function() {
	var $libase = $(this).parent().parent();
    var index = $libase.index('li.colorbox');
	$libase.prev().remove();
	$libase.next().remove();
	var pc = $libase.prev().css('background-color');
	var nc = $libase.next().css('background-color');
	if ((index + 1) != queue.length) {
	$libase.before('<li class="gradient"></li>');
	$libase.prev().gradientz({start: pc, end: nc}).css('z-index', '-5');
	}
	$libase.remove();
	queue.remove(index);
});

// SET FADE IN
$("#navigation ul.fadein li").live('click', function() {
	$(this).addClass('selectedOption').siblings().removeClass('selectedOption');
	var $libase = $(this).parent().parent().parent().parent();
    var index = $libase.index('li.colorbox');
	var svalue = $(this).attr('alt');
	queue[index][1] = svalue;
	var pc = $libase.prev().prev().css('background-color');
	var nc = $libase.css('background-color');
	$libase.prev().remove();
	$libase.before('<li class="gradient"></li>');
	$libase.prev().css('width', val2px(svalue)).gradientz({start: pc, end: nc}).css('z-index', '-5');
});

// SET HOLD
$("#navigation ul.hold li").live('click', function() {
	$(this).addClass('selectedOption').siblings().removeClass('selectedOption');
	var $libase = $(this).parent().parent().parent().parent();
    var index = $libase.index('li.colorbox');
	var svalue = $(this).attr('alt');
	queue[index][2] = svalue;
	$libase.css('width',  val2px(svalue));
});

// SET HOLD
$("#navigation ul ul li.copy").live('click', function() {
	updateColor(rgb2hex($(this).parent().css('background-color')), true, false);
});
	
$('#play').click(function() {
	if (queue.length < 2) {
		alert ("First select at least 2 colors");
	} else {
	playing = true;
    $('#navigation li.colorbox:last').removeClass('currentColor');
	clearInterval(blinktimer);
    blink('on');
    $(this).addClass('buttondown');
	$('#playstatus').html("Playing...");
	$('#navigation ul li.colorbox').removeClass('selectedColor');
	var current = 0;
	var nextli = 0;
	var playarray = queue;

	$('#navigation ul li.colorbox:eq(0)').addClass('selectedColor').css('background-position', '-71px 5px').animate({backgroundPosition: ( -71 + val2px(playarray[0][2])) + "px 5px"},val2ms(playarray[0][1]), function() {
		$(this).delay(val2ms(playarray[0][2])).animate({backgroundPosition: "0px 5px"}, 0).animate({backgroundPosition: val2px(playarray[0][2]) + "px 5px"},val2ms(playarray[1][2]), function() {$(this).removeClass('selectedColor');});
	});
	
	for (z in playarray) {
 		if (playarray.hasOwnProperty(z)) {

			(function(x) {
	
				$("body").animate({ backgroundColor: playarray[x][0] }, val2ms(playarray[x][1]), function() {
						updateTxtColor(playarray[x][0]);
					}).animate({opacity:1.0}, val2ms(playarray[x][2]), function() {
						
						if ((parseInt(x) + 1) < playarray.length) {
						//	alert (val2px(playarray[(parseInt(x) + 1)][2]));
		    				$('#navigation ul li.colorbox:eq('+(parseInt(x) + 1)+')').addClass('selectedColor').css('background-position', '-71px 5px').animate({backgroundPosition: ( -71 + val2px(playarray[(parseInt(x) + 1)][2]) ) + "px 5px"},val2ms(playarray[(parseInt(x) + 1)][1]), function() {
		    					if ((parseInt(x) + 2) < playarray.length) {
									$(this).delay(val2ms(playarray[(parseInt(x) + 1)][2])).animate({backgroundPosition: "0px 5px"}, 0).animate({backgroundPosition: ( val2px(playarray[(parseInt(x) + 1)][2]) + 1) + "px 5px"},val2ms(playarray[(parseInt(x) + 2)][1]), function() {$(this).removeClass('selectedColor');});
								} else {
									$(this).delay(val2ms(playarray[(parseInt(x) + 1)][2])).animate({backgroundPosition: "0px 5px"}, 0).animate({backgroundPosition: ( val2px(playarray[(parseInt(x) + 1)][2]) + 1) + "px 5px"},val2ms(playarray[0][1]), function() {$(this).removeClass('selectedColor');});			
								}
							});
						}
					});
	
			})(z);
		}
	}

	
		$("body").animate({opacity:1.0}, 1000, function() {

			if (autoplay == true) {
				$('#play').click();
			} else {
				blink('off');	
				$('#play').removeClass('buttondown');	
				//ShowDialog();
			}

		});
				
		}

});

$('#stop').click(function() {
	playing = false;
	$('#play').removeClass('buttondown');
	$("body").stop(true);
	$('#navigation ul li.colorbox').stop(true).removeClass('selectedColor');
	blink('off');
	return false;
});


$('#reset').click(function() {
	playing = false;
	$('#play').removeClass('buttondown');
	$("body").stop(true);
	$('#navigation ul').empty();
	blink('off');
	queue = [];
	return false;
});

$('#addcolor').click(function() {
	addcolorbttn = true;
	updateColor(rgb2hex($("body").css('background-color')), true, false);
	addcolorbttn = false;
});

$('#urlcolor').click(function() {
	var color = rgb2hex($("body").css('background-color'));
	$('#inputurlcolor').css('background-color', color);
	$(this).empty().html('');
	$('#stop').trigger('click');
	$("#inputurlcolor").val('http://xoki.com/' + color.substr(1));
	var pos = $('#urlcolor').offset();  
  	var width = $('#urlcolor').width();
	$('#inputurlcolor').css( { "left": (pos.left + width) + "px", "top":pos.top + "px" } );
	$('#inputurlcolor').attr('readonly', true).show().focus().select();
});

$('#inputurlcolor').blur(function() {
	$(this).hide();
	$('#urlcolor').html('(color url)');
});
	
	
$('#urlplaylist').click(function() {
	if (queue.length < 2) {
		alert("First select more colors");
		return false;
	}
	var color = rgb2hex($("body").css('background-color'));
	$('#inputurlplaylist').css('background-color', color);
	$(this).empty().html('');
	$('#stop').trigger('click');
	
	BitlyCB.shortenResponse = function(data) {
	        var s = '';
	        var first_result;
	        // Results are keyed by longUrl, so we need to grab the first one.
	        for     (var r in data.results) {
	                first_result = data.results[r]; break;
		}
	
	
	//	var dest = 'http://twitter.com/home?status=my color playlist of the day : '+ first_result['shortUrl'] + ' %40xoki_com';
	//      	window.location = dest;  
	$("#inputurlplaylist").val(first_result['shortUrl']);
	var pos = $('#urlplaylist').offset();  
  	var width = $('#urlplaylist').width();
	$('#inputurlplaylist').css( { "left": (pos.left + width) + "px", "top":pos.top + "px" } );
	$('#inputurlplaylist').attr('readonly', true).show().focus().select();
	
	}
	
  	BitlyClient.shorten('http://xoki.com/play/'+colors2url(queue), 'BitlyCB.shortenResponse');	
	
				
	
});

$('#inputurlplaylist').blur(function() {
	$(this).hide();
	$('#urlplaylist').html('(playlist url)');
});
	
function randomizeColor() {
	//randomcolor = '#'+('00000'+(Math.random()*16777216<<0).toString(16)).substr(-6);
	randomcolor= rndHex();
	updateColor(randomcolor, true, false);
}

if (document.referrer.indexOf('blankscreen.org') != -1) { 
	randomizeColor();
	$('#random').show();
} else {
	// TIJDELIJK UIT, SCROLL DOWN EFFECT
//	$('a[href*=#about]').click();
}



$('#colors').colorPicker({
color: ["#000000", "#0000aa", "#00aa00", "#00aaaa", "#aa0000", "#aa00aa",
	"#aaaa00", "#aaaaaa", "#000055", "#0000ff", "#00aa55", "#00aaff",
	"#aa0055", "#aa00ff", "#aaaa55", "#aaaaff", "#005500", "#0055aa",
	"#00ff00", "#00ffaa", "#aa5500", "#aa55aa", "#aaff00", "#aaffaa",
	"#005555", "#0055ff", "#00ff55", "#00ffff", "#aa5555", "#aa55ff",
	"#aaff55", "#aaffff", "#550000", "#5500aa", "#55aa00", "#55aaaa",
	"#ff0000", "#ff00aa", "#ffaa00", "#ffaaaa", "#550055", "#5500ff",
	"#55aa55", "#55aaff", "#ff0055", "#ff00ff", "#ffaa55", "#ffaaff",
	"#555500", "#5555aa", "#55ff00", "#55ffaa", "#ff5500", "#ff55aa",
	"#ffff00", "#ffffaa", "#555555", "#5555ff", "#55ff55", "#55ffff",
	"#ff5555", "#ff55ff", "#ffff55", "#ffffff"],
	defaultColor: 63	
//	,click: function(color){
//	//	$('body').css('background-color', color);
//	} 
});

function intro() {
	$('#repeat').trigger('click');
	setTimeout(function() { 
	$('body').mousemove(ShowDialog); 
	}, 2000);	
	$('#leftpane').css({marginLeft: '-125px'});
	$('#leftpane .inner').animate({marginLeft: '0px'}, 2000).delay(6000).animate({marginLeft: '-265px'}, 2000);
}

//$('.htabs li a:eq(0)').trigger('click');

if (url.length == 6) {
	
	playlanding = true;
	intro();
	updateColor("#"+url, false, false);
} else if (url.substr(0,4) == 'play') {
	playlanding = true;
	$('#repeat').trigger('click');
	queue = url2colors(url.substr(5));
	$('#thiscolor').text('these colors');
	aniload = true;
	intro();
	$('#play').trigger('click');
} else {
	intro();
	randomizeColor(); 
}


/**********************/
/* STANDARD FUNCTIONS 
/**********************/

function val2ms(value) {
	output = parseInt(value);
	if (output == 0) output = 10;
	return ((output * 300) - 300 + (output * output * 50));
}

function val2px(value) {
	output = parseInt(value);
	if (output == 0) output = 10;
	return (output * 4);
}

function hexvalidate(color) {
	var reg = /^(#)?([0-9a-fA-F]{3})([0-9a-fA-F]{3})?$/;
	return reg.test(color);
}

function randomnr(max) {
	return (Math.floor(Math.random()*max)+1);
}

function rgb2hex(rgbString) {

	if (hexvalidate(rgbString)) {
		return rgbString;
	} else {

		var parts = rgbString.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
		delete (parts[0]);
		for (var i = 1; i <= 3; ++i) {
			parts[i] = parseInt(parts[i]).toString(16);
			if (parts[i].length == 1) parts[i] = '0' + parts[i];
		}
		return "#" + parts.join(''); 

	}

};

if (navigator.platform != "Win32" && navigator.platform != "Win64") {
	$('#aboutf11').hide();	
	$('#introf11').hide();	
}

});