function transitionPage(selectorToFadeOut, selectorToFadeIn)
{
	$(selectorToFadeOut).fadeOut(100, function()
	{ 
		$(selectorToFadeIn).fadeIn(100);
	});	
}

function initMediaWizard()
{
	$("#dialog-wizard-form").dialog(
	{
		autoOpen: false,
		height: 550,
		width:800,
		modal: true,
		resizable:false,
		close: function() 
		{
			resetWizard();
		}
	});
	
	$('#existing_attach_sel').change(function()
	{		
		loadAttachment($('#existing_attach_sel option:selected').val());
		
		if($('#existing_attach_sel option:selected').val().length > 0)
		{
			
			$("#stage-1 button:contains('Next')").button( "option", "disabled", false );
		}
		else
		{
			$("#stage-1 button:contains('Next')").button( "option", "disabled", true );
		}
	});
	
	$('#existing_attach_sel_2').change(function()
	{		
		loadAttachment($('#existing_attach_sel_2 option:selected').val());
		
		if($('#existing_attach_sel_2 option:selected').val().length > 0)
		{
			
			$("#stage-1 button:contains('Next')").button( "option", "disabled", false );
		}
		else
		{
			$("#stage-1 button:contains('Next')").button( "option", "disabled", true );
		}
	});
	
	$('select[name=image_format]').change(function()
	{
		loadFormat($('select[name=image_format] option:selected').val());
		
		if($('select[name=image_format] option:selected').val().length > 0)
		{
			$("#stage-3-image button:contains('Next')").button( "option", "disabled", false );
		}
		else
		{
			$("#stage-3-image button:contains('Next')").button( "option", "disabled", true );
		}
	});
	
	$('select[name=relationship]').change(function()
	{
		loadFormat($('select[name=relationship] option:selected').val());
		
		if($('select[name=relationship] option:selected').val().length > 0)
		{
			$("#stage-3-other button:contains('Next')").button( "option", "disabled", false );
		}
		else
		{
			$("#stage-3-other button:contains('Next')").button( "option", "disabled", true );
		}
	});
	
	/* Set form validation */
		
	$("#upload_form").validate(
 	{
 		submitHandler: function(oForm) 
 		{ 
 			uploadAttachment(oForm);
 		}
 	});
	
	$('#media_form').validate(
	{
		submitHandler: function(oForm) 
		{ 
			createMediaData(oForm);
		}
	});
	
	
	$('#create_format_form').validate(
	{
		submitHandler: function(oForm) 
		{ 
			createFormat(oForm);
		}
	});

	
	/* Set click handlers */
	addFileChangeHandler();
	
	$("#media_type").change(function()
	{
		$("#stage-2 input[name=type]").val($("#media_type option:selected").val());
	});

	
	$("#dialog-wizard-form button:contains('Cancel'), #stage-2-success button:contains('Finish')").button().click(function(evt)
	{
		evt.preventDefault();
		$("#dialog-wizard-form").dialog("close");
	});
	
	$("#stage-1 button:contains('Next')").button().click(function()
	{
		if($('input[name=attach-choice-group]:checked').val() == "Existing")
	    {
			$("input[name=attachment_id]").val($('#existing_attach_sel option:selected').val());
	
			//lookup id
			$.getJSON(CONTEXT_PATH + '/resources/attachments/' + $('#existing_attach_sel option:selected').val() + '.json' , function() 
			{		      
		    })
		    .success(function(data) 
		    {
		    	if(data.type.toLowerCase() === 'image')
		    	{
		    		populateImgResizeFormats(data.id);
					transitionPage("#stage-1","#stage-3-image");
		    	}
		    	else
		    	{
		    		populateRelationships();
					transitionPage("#stage-1","#stage-3-other");
		    	}
		    })
		    .error(function(data) 
		    {
		    	alert("error looking up attachment");
		    	//alert(JSON.stringify(data));
		    });
	    }
		else if($('input[name=attach-choice-group]:checked').val() == "Assigned")
	    {
			$("input[name=attachment_id]").val($('#existing_attach_sel_2 option:selected').val());
			
			//lookup id
			$.getJSON(CONTEXT_PATH + '/resources/attachments/' + $('#existing_attach_sel_2 option:selected').val() + '.json' , function() 
			{		      
		    })
		    .success(function(data) 
		    {
		    	if(data.type.toLowerCase() === 'image')
		    	{
		    		populateImgResizeFormats(data.id);
					transitionPage("#stage-1","#stage-3-image");
		    	}
		    	else
		    	{
		    		populateRelationships();
					transitionPage("#stage-1","#stage-3-other");
		    	}
		    })
		    .error(function(data) 
		    {
		    	alert("error looking up attachment");
		    	//alert(JSON.stringify(data));
		    });
	    }
		else
		{
			transitionPage("#stage-1","#stage-2");
		}
	});
	
	$("#stage-2 button:contains('Upload')").button().click(function(evt)
	{
		evt.preventDefault();
		$("#upload_form").submit();
	});
	
	$("#stage-2 button:contains('Back')").button().click(function(evt)
	{
		evt.preventDefault();
		transitionPage("#stage-2", "#stage-1");
	});
	
	$("#stage-2-fail button:contains('Back')").button().click(function()
	{
		transitionPage("#stage-2-fail", "#stage-1");
	});
	
	$("#stage-2-success button:contains('Next')").button().click(function()
	{
		var fname = $("#upload_file").val();
		
		// this required for ie 
		if(fname && fname.lastIndexOf('\\') > 0)
		{
			fname = fname.substring(fname.lastIndexOf('\\') + 1);
		}
		fname.replace(/%/g,'%25');
		
		//lookup id
		$.post(CONTEXT_PATH + '/resources/attachments/0/lookup?filename=' + fname , function() 
		{		      
	    })
	    .success(function(data) 
	    {
	    	$("input[name=attachment_id]").val(data.id);	    
	    	
	    	if(data.type.toLowerCase() === 'image')
	    	{
	    		populateImgResizeFormats(data.id);
	    		$("input[name=base_height]").val(data.height);
	    		$("input[name=base_width]").val(data.width);	
				transitionPage("#stage-2-success","#stage-3-image");
	    	}
	    	else
	    	{
	    		populateRelationships();
				transitionPage("#stage-2-success","#stage-3-other");
	    	}
	    })
	    .error(function(data) 
	    {
	    	alert("error looking up attachment by filename");
	    	//alert(JSON.stringify(data));
	    });
	});
	
	$("#stage-3-image button:contains('Next')").button().click(function(evt)
	{
		evt.preventDefault();
		
		if($('input[name=format-choice-group]:checked').val() == "Existing")
		{
			transitionPage("#stage-3-image","#stage-5");
		}
		else
		{
			transitionPage("#stage-3-image","#stage-4");
		}
	});
	
	$("#stage-3-other button:contains('Next')").button().click(function(evt)
	{
		evt.preventDefault();
		transitionPage("#stage-3-other","#stage-5");
	});
	
	$("#stage-4 button:contains('Back')").button().click(function(evt)
	{
		evt.preventDefault();
		transitionPage("#stage-4", "#stage-3-image");
	});
	
	$("#stage-4 button:contains('Next')").button().click(function(evt)
	{
		evt.preventDefault();
		$('#create_format_form').submit();
	});
	
	$("#stage-4-success button:contains('Next')").button().click(function(evt)
	{
		evt.preventDefault();
		populateImgResizeFormats($("input[name=attachment_id]").val());
		transitionPage("#stage-4-success", "#stage-3-image");
	});
	
	$("#stage-5 button:contains('Next')").button().click(function(evt)
	{
		evt.preventDefault();
		$('#media_form').submit();
	});
	
	$("#stage-5-success button:contains('Finish')").button().click(function(evt)
	{
		evt.preventDefault();
		notifyChangeMade();	
		
		if($("#addThis:checked").val() === 'on')
		{
			addMediaDataItem($('#media_record_id').val(), $('dd.wizard'), $('#media_schema_field').val());
		}
		
		$("#dialog-wizard-form").dialog("close");
	});
	
	$("[name=format-choice-group]").change(function() 
	{
	    if($('input[name=format-choice-group]:checked').val() == "Existing")
	    {
	    	$("select[name=image_format]").removeAttr('disabled');
	    	
	    	if($('select[name=image_format] option:selected').val().length == 0)
	    	{
	    		$("#stage-3-image button:contains('Next')").button( "option", "disabled", true );
	    	}
	    }
	    else
	    {
	    	$("#stage-3-image button:contains('Next')").button( "option", "disabled", false );
	    	$("select[name=image_format]").attr('disabled','disabled');
	    }
	});
	
	$("[name=attach-choice-group]").change(function() 
	{
	    if($('input[name=attach-choice-group]:checked').val() == "Existing")
	    {
	    	$("#stage-1 .exist").show();	
	    	$("#stage-1 .assigned").hide();
	    	
	    	if($('#existing_attach_sel option:selected').val().length == 0)
	    	{
	    		$("#stage-1 button:contains('Next')").button( "option", "disabled", true );
	    	}
	    }
	    else if($('input[name=attach-choice-group]:checked').val() == "Assigned")
	    {
	    	$("#stage-1 .assigned").show();	
	    	$("#stage-1 .exist").hide();
	    	
	    	if($('#existing_attach_sel_2 option:selected').val().length == 0)
	    	{
	    		$("#stage-1 button:contains('Next')").button( "option", "disabled", true );
	    	}
	    }
	    else
	    {
	    	resetWizard();
	    	$("#stage-1 button:contains('Next')").button( "option", "disabled", false );
	    	$("#stage-1 .exist, #stage-1 .assigned").hide();
	    }
	});
	
	$('#artifacts').click(function()
	{				
		if($(this).is(':checked'))
		{
			$("#small_size").removeAttr('disabled').addClass('required');
			$("#small_size").parent().prev().addClass('mandatory');
			$("#medium_size").removeAttr('disabled').addClass('required');
			$("#medium_size").parent().prev().addClass('mandatory');
			$("#large_size").removeAttr('disabled').addClass('required');
			$("#large_size").parent().prev().addClass('mandatory');
			$("#resize_dimension").removeAttr('disabled').addClass('required');
			$("#resize_dimension").parent().prev().addClass('mandatory');
		}
		else
		{
			$("#small_size").attr('disabled','disabled').removeClass('required');
			$("#small_size").parent().prev().removeClass('mandatory');
			$("#medium_size").attr('disabled','disabled').removeClass('required');
			$("#medium_size").parent().prev().removeClass('mandatory');
			$("#large_size").attr('disabled','disabled').removeClass('required');
			$("#large_size").parent().prev().removeClass('mandatory');
			$("#resize_dimension").attr('disabled','disabled').removeClass('required');
			$("#resize_dimension").parent().prev().removeClass('mandatory');
		}
	});
}

function loadAttachmentsList()
{
	$('#existing_attach_sel').html('<option value="">Select Attachment</option>');
	
	$.getJSON(CONTEXT_PATH + '/resources/attachments.json', function(data) 
	{
	})
	.success(function(data) 
	{
		for(var attach_iter = 0; attach_iter < data.length; ++attach_iter )
		{
			$('#existing_attach_sel').append('<option value="' + data[attach_iter].id + '" title="' + data[attach_iter].type + '">' +  data[attach_iter].name  + '</option>');
		}
		
		$("#existing_attach_sel").combobox();
	})
	.error(function(data)
	{
		//alert(JSON.stringify(data));
		alert("failed to load attachments list");
	});
}

function loadRelatedAttachmentsList()
{
	$('#existing_attach_sel_2').html('<option value="">Select Attachment</option>');
	
	$.getJSON(CONTEXT_PATH + '/resources/attachments.json?resource_identifier=' + $('#stage-2 input[name="identifier"]').val() , function(data) 
	{
	})
	.success(function(data) 
	{
		for(var attach_iter = 0; attach_iter < data.length; ++attach_iter )
		{
			$('#existing_attach_sel_2').append('<option value="' + data[attach_iter].id + '" title="' + data[attach_iter].type + '">' +  data[attach_iter].name  + '</option>');
		}
		
		$("#existing_attach_sel_2").combobox();
	})
	.error(function(data)
	{
		//alert(JSON.stringify(data));
		alert("failed to load attachments list");
	});
}

function loadAttachment(attachment_id)
{
	$(".attach_preview").html("")
	
	if(attachment_id && attachment_id.length > 0)
	{
		//get attachment
		$.getJSON(CONTEXT_PATH + '/resources/attachments/' + attachment_id + '.json' , function() 
		{		      
	    })
	    .success(function(data) 
	    {
	    	if(data.type.toLowerCase() === 'image')
	    	{
	    		$(".attach_preview").append('<img src="' + ATTACH_BASE_DIR + data.name + '">');
	    		$(".attach_preview").append('<br/><ul><li>Height: ' + data.height + 'px</li><li>Width: ' + data.width + 'px</li></ul>')
	    		
	    		$("input[name=base_height]").val(data.height);
	    		$("input[name=base_width]").val(data.width);	
	    	}
	    	else
	    	{
	    		$(".attach_preview").append('(<a href="' + ATTACH_BASE_DIR + data.name + '" target="_blank">Preview selected attachment</a>)');
	    	}
	    })
	    .error(function(data) 
	    {
	    	$(".attach_preview").html("Unable to find attachment")
	    });
	}
}

function loadFormat(format_id)
{
	$(".format_details").html("")
	
	if(format_id && format_id.length > 0)
	{
		//get attachment
		$.getJSON(CONTEXT_PATH + '/resources/formats/' + format_id + '.json' , function() 
		{		      
	    })
	    .success(function(data) 
	    {
	    	if(data && data.allows_resizing.toLowerCase() == 'true')
	    	{
	    		$(".format_details").append('<ul><li>Resize By: ' + data.resize_dimension + '</li><li>Small: ' + data.small_size + 'px</li><li>Medium: ' +  data.medium_size + 'px</li><li>Large: ' + data.large_size + 'px</li></ul>');
	    	}
	    })
	    .error(function(data) 
	    {
	    	$(".format_details").html("Unable to find format")
	    });
	}
}

function resetWizard()
{
	/* Reset server response fields etc */
	$('.attach_preview, .upload_response, .server_response, .format_details').html("");

	$("#create_format_form")[0].reset();
	$("#media_form")[0].reset();
	$("#artifacts").attr('checked','checked');
	
	$(".ui-autocomplete-input").val("");

	$("#upload_file").replaceWith('<input type="file" name="upload_file" id="upload_file" class="required" title=" Please select a file."/>');
	//ensure the change handler is re-added to new file input
	addFileChangeHandler();
	
	$("#dialog-wizard-form div").hide();
	$("#stage-1").show();
	
	$("input[name=base_height]").val('');
	$("input[name=base_width]").val('');
	
	$("#existing_attach_sel option:selected").removeAttr('selected');
	$("#media_type option:selected").removeAttr('selected');
	
	$("input:radio[name=attach-choice-group]:first").attr('checked', true);
	$("#media_type").attr('disabled','disabled');	
}

function openMediaWizard(field_name)
{
	$('#stage-5-success #media_schema_field').val(field_name);
	loadAttachmentsList();
	loadRelatedAttachmentsList();
	$("#stage-1 .exist").hide();
	$("#stage-1 .assigned").hide();
	$("#dialog-wizard-form").dialog("open");
}

function uploadAttachment(form)
{	
	/* the second argument is true to indicate file upload. */
	YAHOO.util.Connect.setForm(form, true);
	 
	var callback = 
    {
		upload: function(oResponse) 
		{
			if(oResponse && oResponse.responseText)
			{
				if(oResponse.responseText === "File Successfully Uploaded.") //success
				{
					/* append message from server */
	   				$('#stage-2-success .upload_response').html(oResponse.responseText);	
	   				/* show page */
					transitionPage("#stage-2","#stage-2-success");
				}
				else if(oResponse.responseText.indexOf("already exists.") >= 0) //attach exists already so use
				{
					/* set specific message */
	   				$('#stage-2-success .upload_response').html("This attachment was previously uploaded. To avoid resource duplication the original attachment will be used if you proceed.");	
					/* show page */
	   				transitionPage("#stage-2","#stage-2-success");
				}
				else //fail
				{
					/* append message from server */
	   				$('#stage-2-fail .upload_response').html(oResponse.responseText);
	   				/* show page */
	   				transitionPage("#stage-2","#stage-2-fail");
				}	
			}
		}		
    };
	
	YAHOO.util.Connect.asyncRequest('POST', CONTEXT_PATH + '/resources/attachments', callback);	
}

function createMediaData(oForm)
{
	YAHOO.util.Connect.setForm(oForm);
	
	var sUrl = CONTEXT_PATH + '/resources/media?attachment_id=' + $('input[name=attachment_id]').val();

    var callback = 
    {
		success: function(oResponse) 
		{
			$('#stage-5-success .server_response').html("Successfully created media record");
			
			var data = {media : JSON.parse(oResponse.responseText)}
						
			$('#stage-5-success #media_record_id').val(data.media.id);
			/* show page */
			transitionPage("#stage-5","#stage-5-success");
		},
		failure: function(oResponse) 
		{
			if(oResponse && oResponse.responseText)
			{
				$('#stage-5-fail .server_response').html(oResponse.responseText);
			}
			else
			{
				$('#stage-5-fail .server_response').html('Failed to convert attachment to media record.');
			}
			
			/* show page */
			transitionPage("#stage-5","#stage-5-fail");
		}
    };		    				    
    
    YAHOO.util.Connect.asyncRequest('POST', sUrl, callback);
}

function populateImgResizeFormats(attachment_id)
{
	$('select[name="image_format"]').html('<option value="">Select Format</option>');
	
	$.ajax(
	{
		type: 'GET',
		url: CONTEXT_PATH + '/resources/formats.json?attachment_id=' + attachment_id,
		dataType: 'json',
		global: false,
		success: function(data)
		{
			if(data && data.length > 0)
			{
				for(var i = 0; i < data.length; ++i)
				{
					$('select[name="image_format"]').append('<option value="' + data[i].id + '">' + data[i].name + '</option>');
				}
			}
		},
		error: function(data)
		{
			if(data && data.responseText && data.responseText == "This Media Item does not use ImgResizeFormats.")
			{
				$('select[name="image_format"]').removeClass("required");
				$('.image_format').hide();
			}
			else
			{
				$('.image_format').show();
				$('dd.image_format').html('No Applicable Formats! Click <a href="' + CONTEXT_PATH + '/resources/formats">here</a> to create one, or press the \'Cancel\' button to exit.').removeClass('mandatory');
			}
		}
	});
}

function populateRelationships()
{
	$('#dialog-wizard-form select[name="relationship"]').html('<option value="">Please Select</option>');
	
	var relationship_string = jQuery.i18n.prop('media_relationships');
	
	if(relationship_string)
	{
		if(relationship_string.indexOf("|") > 0)
		{
			var relationships = relationship_string.split("|");
			
			for(var rel_iter = 0; rel_iter < relationships.length; ++ rel_iter)
			{
				$('#dialog-wizard-form select[name="relationship"]').append('<option value="' + relationships[rel_iter] + '">' + relationships[rel_iter] + '</option>');
			}
		}
		else
		{
			$('#dialog-wizard-form select[name="relationship"]').append('<option value="' + relationship_string + '">' + relationship_string + '</option>');
		}
	}
}

function addFileChangeHandler()
{
	$('#upload_file').change(function(e)
	{
		var oFilename = $(this).val();
		
		if(oFilename && oFilename.length > 0 && oFilename.lastIndexOf('.') > 0)
		{
			var extn = oFilename.substr(oFilename.lastIndexOf('.') + 1);
			
			$.post(CONTEXT_PATH + '/lookup/media_type?extension=' + extn , function() 
			{		      
		    })
		    .success(function(data) 
		    {	
		    	if(data && data.length > 0)
		    	{
		    		$("#media_type").attr('disabled','disabled');	
		    	}
		    	else
		    	{
		    		$("#media_type").removeAttr('disabled');
		    	}
		    	
		    	$("#media_type option:selected").removeAttr('selected');
		    	$('#media_type option[value=' + data + ']').attr('selected','selected');
		    	
		    	$("#stage-2 input[name=type]").val(data);
		    })
		    .error(function(data) 
		    {
		    	alert("error occurred whilst looking up media type via extension");
		    	//alert(JSON.stringify(data));
		    });
		}
		else
		{
			alert('unable to determine file extension, please ensure you select a type');
			$("#media_type").removeAttr('disabled');
		}
	});
}

function createFormat(oForm)
{	
	YAHOO.util.Connect.setForm(oForm);
				
	var sUrl = CONTEXT_PATH + '/resources/formats';

    var callback = 
    {
		success: function(oResponse) 
		{
			/* append message from server */
   			$('#stage-4-success .server_response').html(oResponse.responseText);	
   			/* show page */
			transitionPage("#stage-4","#stage-4-success");
		},
		failure: function(oResponse) 
		{
			$('#stage-4-fail .server_response').html(oResponse.responseText);	
			transitionPage("#stage-4","#stage-4-fail");
		}
    };		    				    
    
    YAHOO.util.Connect.asyncRequest('POST', sUrl, callback);
}

(function( $ ) 
{
	$.widget( "ui.combobox", 
	{
		_create: function() 
		{
			var self = this,
				select = this.element.hide(),
				selected = select.children( ":selected" ),
				value = selected.val() ? selected.text() : "";
				
			var input = this.input = $('<input size="32">')
				.insertAfter( select )
				.val( value )
				.autocomplete(
				{
					delay: 0,
					minLength: 0,
					source: function( request, response ) 
					{
						var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" );
						
						response( select.children( "option" ).map(function() 
						{																		
							var text = $( this ).text();
							var style = 'white-space:nowrap; background:url(' + CONTEXT_PATH + '/images/icons/' + $( this ).attr('title') + '.png) left center no-repeat; padding-left: 25px;';

							if ( this.value && ( !request.term || matcher.test(text) ) )
							{
								return {
									label: text.replace(new RegExp("(?![^&;]+;)(?!<[^<>]*)(" + $.ui.autocomplete.escapeRegex(request.term)+")(?![^<>]*>)(?![^&;]+;)", "gi"), "$1" ),
									value: $( this ).text(),
									id: $( this ).attr('value'),
									style: style, //extra field added by K-INT MJ
									option: this
								};
							}
						}));
					},
					html:true, //required by autocomplete extension plugin...
					select: function( event, ui ) 
					{
						$('#existing_attach_sel option:selected').removeAttr('selected');
						
						$('#existing_attach_sel').children('option').each(function()
						{
							if($(this).attr('value') == ui.item.id)
							{
								$(this).attr('selected', 'selected');
								//$("#stage1 .ui-autocomplete-input").val($(this).text());
							}
						});
						
						$('#existing_attach_sel').change();
							
						ui.item.option.selected = true;
						self._trigger( "selected", event, 
						{
							item: ui.item.option
						});
					},
					change: function( event, ui ) 
					{
						if ( !ui.item ) 
						{
							var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ),
								valid = false;
								select.children( "option" ).each(function() 
								{
									if ( $( this ).text().match( matcher ) ) 
									{
										this.selected = valid = true;
										return false;
									}
								});
							
							if ( !valid ) 
							{
								// remove invalid value, as it didn't match anything
								$( this ).val( "" );
								select.val( "" );
								input.data( "autocomplete" ).term = "";
								
								return false;
							}
						}
					},
					close: function(event, ui) 
					{ 
					}

				})
				.addClass( "ui-widget ui-widget-content ui-corner-left" );

			input.data( "autocomplete" )._renderItem = function( ul, item ) 
			{	
				return $( "<li></li>" )
					.data( "item.autocomplete", item )
					.append( '<a><span style="' + item.style + '">' + item.label + '</span></a>' )
					.appendTo( ul );
			};

			this.button = $( "<button type='button'>&nbsp;</button>" )
				.attr( "tabIndex", -1 )
				.attr( "title", "Show All Items" )
				.insertAfter( input )
				.button(
				{
					icons: 
					{
						primary: "ui-icon-triangle-1-s"
					},
					text: false
				})
				.removeClass( "ui-corner-all" )
				.addClass( "ui-corner-right ui-button-icon" )
				.click(function() 
				{
					// close if already visible
					if ( input.autocomplete( "widget" ).is( ":visible" ) ) 
					{
						input.autocomplete( "close" );
						return;
					}
					
					$( this ).blur();

					// pass empty string as value to search for, displaying all results
					input.autocomplete( "search", "" );
					input.focus();
				});
		},
		destroy: function() 
		{
			this.input.remove();
			this.button.remove();
			this.element.show();
			$.Widget.prototype.destroy.call( this );
		}
	});
})( jQuery );