$(document).ready(function() {	
	
/*______EXEC ON STARTUP______________________________________________________ */
	
	
	
	$("#label_text span").tooltip({
		track: true,
		delay: 0,
		showURL: false,
		fade: 250,
		top: 15, 
		left: 5,
		bodyHandler: function() {
			var html_echo = "<div class='url_info'>" + $("#url_info").html() + "</div>";
			return html_echo;
		    } 
	});
	
	
	triggerGalleryTooltip();
	function triggerGalleryTooltip() {
		
		$("#recent_loop a").tooltip({
			track: true,
			delay: 0,
			showURL: false,
			fade: 250,
			top: 15, 
			left: 5
		});
	}

        queryUrl = false;
        $("#youtube_id").val("");
        
        $("#ajax_load").hide();
	$("#ajax_load img").css("display","block");
	
	
        $("#gallery").css("marginTop", "5px");
        
	
	
        
/*______INPUT-TXT ONCLICK____________________________________________________ */	
	
        $("#input_url").click(function() {
                $(this).select();
        });
		

/*______INPUT-TXT AJAX EVENT TRIGGER_________________________________________ */

        var timerid;
        $("#input_url").keyup(function() {
                var form = this;
                clearTimeout(timerid);
                timerid = setTimeout(function() {
                        
                        if($("#input_url").val() == "") {
                                $("#ajax_feedback")
                                .removeClass()
                                .text("");
				
				/*
                                $("#youtube_id").val("");
				queryUrl = false;
				*/
                                $("#ajax_load").fadeOut(200);
                                
				
				if($("#gallery").hasClass("transformed")) {
					$("#gallery").animate({ marginTop: "5px"}, 500, function() {
						$(this).removeClass("transformed");
					});
				}
				
				changeCubes("white");
				
                                
                        } else {
				
                                if(queryUrl) {
                                        //only submit, if the input value changed
                                        if(queryUrl != $("#input_url").val()) {
                                                submitAjax();
                                        } else {
						if(!$("#ajax_load").is(":visible")) {
							
							
							$("#ajax_feedback")
							.removeClass()
							.addClass("valid")
							.text("valid youtube ressource")
							.show("slide", { direction: "up" }, 500, function() {
								$("#gallery").animate({ marginTop: "190px"}, 500, function() {
									$(this).addClass("transformed");
									$("#ajax_load").show("blind", { direction: "vertical" }, 500);
								});
							});
						}
					}
                                } else {
                                        submitAjax();
                                }
                        }
              }, 500);
        });


/*______AJAX REQUEST_________________________________________________________ */

	$("#gallery h4, #showAllRecent").click(function changeGallery() {
		
		//h4 markup
		if($(this).attr("id")!="showAllRecent") {
			$("#gallery h4").removeClass();
			$(this).addClass("current");
		}
		
		click_id = $(this).attr("id");

		$.ajax({
                        url: 'ajaxhandle.php',
                        data: {
                                orderby: click_id
                        },
                        dataType: "json",
                        success: function(data) {
				
				
				$("#recent_loop").fadeOut(200, function() {
					$("#recent_loop").html(data.html);
					$("#recent_loop").fadeIn(200);
					
					triggerGalleryTooltip();
				});
				
				
                        }
                });	

	});

        function submitAjax() {
                
                queryUrl = $("#input_url").val();
                lastQuery = $("#youtube_id").val();
                
                $("#input_url").css("background","url(gfx/ajaxload.gif) no-repeat right center #fff");
                
                                                
                $.ajax({
                        url: 'ajaxhandle.php',
                        data: {
                                url: queryUrl,
                                current_id: lastQuery
                        },
                        dataType: "json",
                        success: function(data) {
                                
                                if(data.id_status == "ok" || data.id_status == "no_thumbs") {
                                        
                                        
                                        if(data.id_status == "no_thumbs") {
                                                $("#restrictions").show();
                                        } else {
                                                $("#restrictions").hide();
                                        }
                                        
                                        
                                        
                                        $("#ajax_load").fadeOut(200);

                                        $('#title').html(data.videoTitle);
                                        $('#thumb1').attr("src", data.videoThumb1);
                                        $('#thumb2').attr("src", data.videoThumb2);
                                        $('#thumb3').attr("src", data.videoThumb3);
                                        
                                        $("#ajax_feedback")
                                        .fadeOut(200, function() {
                                                
                                                $(this)
                                                .removeClass()
                                                .addClass("valid")
                                                .text("valid youtube ressource")
                                                .show("slide", { direction: "up" }, 500, function() {
                                                        
                                                        if($("#gallery").hasClass("transformed")) {
                                                                $("#ajax_load").show("blind", { direction: "vertical" }, 500);
                                                        } else {
                                                                $("#gallery").animate({ marginTop: "190px"}, 500, function() {
                                                                        $(this).addClass("transformed");
                                                                        $("#ajax_load").show("blind", { direction: "vertical" }, 500);
                                                                });
                                                        }
                                                        
                                                        $("#youtube_id").val(data.id);
							
                                                        $("#youtube_thumb").val(data.videoThumb2);
                                                        
                                                        $("#youtube_form").attr("action", "?id=" + data.id);
                                                        
                                                        
                                                });
                                                
                                                changeCubes("green");
                                        });
                                        
                                } else if(data.id_status == "no_id") {
                                        
                                        $("#ajax_load").fadeOut(200);
                                        $("#youtube_id").val("");
                                        
                                        
                                        $("#ajax_feedback")
                                        .fadeOut(200, function() {
                                                
                                                $(this)
                                                .removeClass()
                                                .addClass("invalid")
                                                .text("no youtube id found")
                                                .show("slide", { direction: "up" }, 500);
                                                
                                                if($("#gallery").hasClass("transformed")) {
                                                        $("#gallery").animate({ marginTop: "5px"}, 500, function() {
                                                                $(this).removeClass("transformed");
                                                        });
                                                }
                                                
                                                
                                                changeCubes("red");
                                                
                                        });
                                } else if(data.id_status == "invalid_id") {
                                        
                                        $("#ajax_load").fadeOut(200);
                                        $("#youtube_id").val("");
                                        
                                        
                                        $("#ajax_feedback")
                                        .fadeOut(200, function() {
                                                
                                                $(this)
                                                .removeClass()
                                                .addClass("invalid")
                                                .text("invalid youtube id")
                                                .show("slide", { direction: "up" }, 500);
                                                
                                                if($("#gallery").hasClass("transformed")) {
                                                        $("#gallery").animate({ marginTop: "5px"}, 500, function() {
                                                                $(this).removeClass("transformed");
                                                        });
                                                }
                                                
                                                
                                                changeCubes("red");
                                                
                                        });
                                        
                                } else if(data.id_status == "same_id") {
                                }
                                
                                $("#input_url").css("background","#fff");
                        }
                });	
        }

        
});




/*______CHANGE CUBES_________________________________________________________ */

function changeCubes(color) {
	$("#cubes_left").animate({					
		backgroundPosition: "10px 0px"
	}, 400, function() {
		$(this)
		.css({
			"background-image"	:	"url(gfx/cubes_" + color + ".png)",
			"background-position"	:	"10px 0px"
		})
		.animate({
			backgroundPosition: "0px 0px"
		}, 500);
	});
	
	$("#cubes_right").animate({
		backgroundPosition: "-10px 0px"
	}, 400, function() {
		$(this)
		.css({
			"background-image"	:	"url(gfx/cubes_" + color + ".png)",
			"background-position"	:	"-10px 0px"
		})
		.animate({
			backgroundPosition: "0px 0px"
		}, 500);
	});
}






/*______YOUTUBE JS API_______________________________________________________ */

function onYouTubePlayerReady(playerId) {
  ytplayer = document.getElementById("myytplayer");
  ytplayer.addEventListener("onStateChange", "onytplayerStateChange");
  
}


function onytplayerStateChange(newState) {
	switch(newState) {
		case -1:
			trace = "unstarted";
			break;
		case 0:
			trace = "video ended";
			
			stopCounter();
			
			break;
		case 1:
			trace = "video started";
			
			$("#debug #counter").show();
			startCounter();
			
			break;
		case 2:
			trace = "video paused";
			
			stopCounter();
			
			break;
		case 3:
			trace = "buffering..";
			break;
		case 5:
			trace = "video cued";
			break;
		default:
			trace = "unknown process";
	}	

	//$("#debug #output").append("<li>" + trace + "</li>");
}



currentCount = 0;
theCounter = 0;

function startCounter() {
	if(!theCounter) {
		theCounter = setInterval(updateCounter,1000);
	}
}

function stopCounter() {
	clearInterval(theCounter);
	theCounter = 0;
}

function updateCounter() {
	currentCount++;
	
	if(currentCount % 60 == 0) {
		//updateDBDuration();
		currentCount = 0;
	}
	
	//$("#debug #counter span").html(currentCount);
}

function updateDBDuration() {
	$.ajax({
                        url: 'ajaxhandle.php',
                        data: {
                                current_id: $("#playing_id").val(),
				duration: currentCount
                        },
                        dataType: "json",
                        success: function(data) {
				
				
                                
                                //$("#debug #output").append("<li><strong>DB: " + data.status + "</strong></li>");
                        }
                });	
}
