//======== For when download button is pressed ========

function DownloadSelected () {
	
	//create comma separated list of tutorial ids to look for pdfs for
	var items_to_download = '';
	$('input:checked[name=clip_item]').each(function() {
		items_to_download += $(this).val()+',';
	});
	
	id_list = items_to_download.substring(0, items_to_download.length-1); //remove last comma
	
	//if tutorials in list, download their pdfs
	if (id_list != '') { 
		window.open('/secrets/step-by-step-guide/download_all.php?ids='+id_list, 'Download guides', 'width=1,height=1');
	}
}

//================ Initialise clipboard ===============

jQuery.fn.customInput = function(){
	
	$(this).each(function(i){
		if($(this).is('[type=checkbox],[type=radio]')){
			var input = $(this);
			
			// get the associated label using the input's id
			var label = $('label[for='+input.attr('id')+']');
			
			//get type, for classname suffix 
			var inputType = (input.is('[type=checkbox]')) ? 'checkbox' : 'radio';
			
			// wrap the input + label in a div 
			
			
		$('<div class="custom-'+ inputType +'"></div>').insertBefore(input).append(input, label);
			// find all inputs in this set using the shared name attribute
			var allInputs = $('input[name='+input.attr('name')+']');
			
			// necessary for browsers that don't support the :hover pseudo class on labels
			label.hover(
				function(){ 
					$(this).addClass('hover'); 
					if(inputType == 'checkbox' && input.is(':checked')){ 
						$(this).addClass('checkedHover'); 
					} 
				},
				function(){ $(this).removeClass('hover checkedHover'); }
			);
			
			//bind custom event, trigger it, bind click,focus,blur events					
			input.bind('updateState', function(){	
				if (input.is(':checked')) {
					if (input.is(':radio')) {				
						allInputs.each(function(){
							$('label[for='+$(this).attr('id')+']').removeClass('checked');
						});		
					};
					label.addClass('checked');
				}
				else { label.removeClass('checked checkedHover checkedFocus'); }
										
			})
			.trigger('updateState')
			.click(function(){ 
				$(this).trigger('updateState'); 
			})
			.focus(function(){ 
				label.addClass('focus'); 
				if(inputType == 'checkbox' && input.is(':checked')){ 
					$(this).addClass('checkedFocus'); 
				} 
			})
			.blur(function(){ label.removeClass('focus checkedFocus'); });
		}
	});
};

/* 
UpdateClipboard - pass it a tutorial id to add it to the clipboard for this user, or pass it '' to just refresh the clipboard
 */
function UpdateClipboard (tutorial_id) { //NOTE: changes made here may need to be made to UpdateClipboard2 as well
	
	var data = 'id='+tutorial_id;
	
	$.ajax({
		url: "/secrets/update_clipboard.ajax",
		type: "get",
		data: data,
		dataType: 'json',
		cache: false,
		success: function (result) {
			var clipboard_html = '';
			
			for (i = 0; i < result.items.length; i++) {
				clipboard_html += '<input type="checkbox" name="clip_item" id="clip_item_'+i+'" value="'+result.items[i]['id']+'"></input><label for="clip_item_'+i+'" class="clipboard_link"><div class="std_no_show_link_opposite"><a href="/secrets/'+result.items[i]['slug']+'" class="clipboard_link"><span class="hover_ts_colour">'+result.items[i]['title']+'</span></a></div></label>';
			}
			
			$('#cb_items').html(clipboard_html);
			$('#cb_count_num').html(result.count['num']);
			
			 // customisation of check boxes
		
			$('input').customInput();

			 // customisation of check boxes end

			
			if	(result.count['num'] == 0) {
				HideCircle2();
			}
		},
	});
}
var HideCircle2 = function () { //NOTE: changes made here may need to be made to HideCircle as well
	
	//circle
	
	$( "#count_circle" ).animate({	//bounce bigger for a moment
								marginTop: "-=2px",	// 18(previous height) - 22(new height) = -4 / 2 = -2
								marginLeft: "-=2px",
								height: 22,	//default * 1.2 (roughly)
								width: 22,	//default * 1.2 (roughly)
						}, 0);
							
	$( "#count_circle" ).animate({ //fade and shrink out
								marginTop: "+=7px",	// 22(previous height) - 9(new height) = 13 / 2 = 7 (roughly)
								marginLeft: "+=7px",
								opacity: 0,
								height: 9,	//default * 0.5
								width: 9,	//default * 0.5	
						}, 0);
	
	//text
	
	$( "#count" ).animate({	//bounce bigger for a moment
								fontSize: 16,	//default * 1.2 (roughly)
						}, 0);
							
	$( "#count" ).animate({ //fade and shrink out
								fontSize: 6,	//default * 0.5 (roughly)
								opacity: 0,	
						}, 0);
}

//========= Update accoring to user interaction =============

soundManager.url = '/sounds/soundmanagerv297a-20110918/swf/'; // directory where SM2 .SWFs live
soundManager.debugMode = false;

soundManager.onready(function() {
	
	$("#cb_add_to").click(function() {
		
		tutorial_id = $("#cb_add_to_id").html();
		UpdateClipboard2(tutorial_id);
		
	});
	
	function UpdateClipboard2 (tutorial_id) { //NOTE: changes made here may need to be made to UpdateClipboard as well
		
		if (tutorial_id == '') var play_sound = false; 
		else var play_sound = true;
		
		var data = 'id='+tutorial_id;
		var old_count = $('#cb_count_num').html();
		
		$.ajax({
			url: "/secrets/update_clipboard.ajax",
			type: "get",
			data: data,
			dataType: 'json',
			cache: false,
			success: function (result) {
				var clipboard_html = '';
		
				for (i = 0; i < result.items.length; i++) {
					clipboard_html += '<input type="checkbox" name="clip_item" id="clip_item_'+i+'" value="'+result.items[i]['id']+'"></input><label for="clip_item_'+i+'" class="clipboard_link">	<div class="std_no_show_link_opposite"><a href="/secrets/'+result.items[i]['slug']+'"><span class="hover_ts_colour">'+result.items[i]['title']+'</span></a></div></label><br />';
				}
				
				$('#cb_items').html(clipboard_html);
				$('#cb_count_num').html(result.count['num']);
				$('input').customInput();
				if (result.count['num'] == 1 && old_count == 0) { //first item so do fade in animation
					ShowCircle();
				} else if (play_sound) {
					mySound.play();
				}
			},
		});
	}
	
	$("#remove_btn").click(function() {
		
		total_items = $('#cb_count_num').html();
		played_sound = false;
		
		for (i = 0; i < total_items; i++) {
			var tutorial_id = $('#clip_item_'+i).val();
			
			if ($('#clip_item_'+i).is(':checked')) { //if this item has been checked for deletion
				var data = 'id='+tutorial_id+'&delete=y';
				
				//delete tutorial_id
				$.ajax({
					url: "/secrets/update_clipboard.ajax",
					type: "get",
					data: data,
					cache: false,
					success: function (result) {
						UpdateClipboard2(''); 
						i = 0;	//since we reset the clipboard (UpdateClipboard), reset the counter as well
						total_items = result;	//update the total count
						
						if (total_items == 0) { //no more items so do fade out animation
							HideCircle(played_sound);
						} else if (played_sound == false) {
							mySound.play();
							played_sound = true;
						}
					},
				});
			}
		}
	});
	
	//---------------------------------------
	// SM2 has loaded - now you can create and play sounds!

	var mySound = soundManager.createSound({
		id: 'aSound',
		url: '/sounds/pop-Sith_Mas-7724_hifi.mp3'
		// onload: myOnloadHandler,
		// other options here..
	});
	
	//================ Count Circle Animations ===============
		
		var ShowCircle = function () {
			
			//circle
			
			$( "#count_circle" ).animate({ //fade and grow in bigger than normal
										marginTop: "-=7px", // 9(previous height) - 22(new height) = -13 / 2 = -7 (roughly)
										marginLeft: "-=7px",
										opacity: 1,
										height: 22,	//default * 1.2 (roughly)
										width: 22,	//default * 1.2 (roughly)
								}, 800, 'linear', function() { mySound.play(); });
									
			$( "#count_circle" ).animate({ //shrink back to normal size
										marginTop: "+=2px", // 22(previous height) - 18(new height) = 4 / 2 = 2
										marginLeft: "+=2px",
										height: 18,	//default
										width: 18,	//default	
								}, 500);
								
			//text
			
			$( "#count" ).animate({ //fade and grow in bigger than normal
										fontSize: 16,	//default * 1.2 (roughly)
										opacity: 1,		
								}, 800);			
			
			$( "#count" ).animate({ //shrink back to normal size			
										fontSize: 10, //default	
								}, 500);
		}
		
		//---------------------------------------
		
		var HideCircle = function (played_sound) { //NOTE: changes made here may need to be made to HideCircle2 as well
			
			//circle
			
			$( "#count_circle" ).animate({	//bounce bigger for a moment
										marginTop: "-=2px",	// 18(previous height) - 22(new height) = -4 / 2 = -2
										marginLeft: "-=2px",
										height: 22,	//default * 1.2 (roughly)
										width: 22,	//default * 1.2 (roughly)
								}, 500, 'linear', function() { if (!played_sound) mySound.play(); });
									
			$( "#count_circle" ).animate({ //fade and shrink out
										marginTop: "+=7px",	// 22(previous height) - 9(new height) = 13 / 2 = 7 (roughly)
										marginLeft: "+=7px",
										opacity: 0,
										height: 9,	//default * 0.5
										width: 9,	//default * 0.5	
								}, 800);
			
			//text
			
			$( "#count" ).animate({	//bounce bigger for a moment
										fontSize: 16,	//default * 1.2 (roughly)
								}, 500);
									
			$( "#count" ).animate({ //fade and shrink out
										fontSize: 6,	//default * 0.5 (roughly)
										opacity: 0,	
								}, 800);
		}
		
		//---------------------------------------
	});
//});
