// When the DOM has loaded, init the form link.
$(
	function(){
		// Get the add new upload link.
		var jAddNewUpload = $( "#add-file-upload" );

		// Hook up the click event.
		jAddNewUpload
			.attr( "href", "javascript:void( 0 )" )
			.click(
				function( objEvent ){
					AddNewUpload();

					// Prevent the default action.
					objEvent.preventDefault();
					return( false );
				}
				)
		;

	}
	)

function replaceFields(intNewFileCount, field) {

   if(strNewHTML.replace(new RegExp( field, "i" ), intNewFileCount)) {
      return true;
    }
    else {
      return false;
    }
}


// This adds a new file upload to the form.
function AddNewUpload(){
	// Get a reference to the upload container.
	var jFilesContainer = $( "#files" );

	// Get the file upload template.
	var jUploadTemplate = $( "#element-templates div.row" );

	// Duplicate the upload template. This will give us a copy
	// of the templated element, not attached to any DOM.
	var jUpload = jUploadTemplate.clone();

	// At this point, we have an exact copy. This gives us two
	// problems; on one hand, the values are not correct. On
	// the other hand, some browsers cannot dynamically rename
	// form inputs. To get around the FORM input name issue, we
	// have to strip out the inner HTML and dynamically generate
	// it with the new values.
	var strNewHTML = jUpload.html();

	// Now, we have the HTML as a string. Let's replace the
	// template values with the correct ones. To do this, we need
	// to see how many upload elements we have so far.
	var intNewFileCount = (jFilesContainer.find( "div.row" ).length + 1);

	// Set the proper ID.
	jUpload.attr( "id", ("file" + intNewFileCount) );

	// Replace the values.
	
        strNewHTML = strNewHTML
		.replace(
			new RegExp( "::FIELD2::", "i" ),
			intNewFileCount
			)
		.replace(
			new RegExp( "::FIELD3::", "i" ),
			("file" + intNewFileCount)
			)
                .replace(
			new RegExp( "::FIELD4::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD5::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD6::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD7::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD8::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD9::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD10::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD11::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD12::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD13::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD14::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD15::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD16::", "i" ),
			intNewFileCount
			)
                .replace(
			new RegExp( "::FIELD17::", "i" ),
			intNewFileCount
			);



	// Now that we have the new HTML, we can replace the
	// HTML of our new upload element.
	jUpload.html( strNewHTML );

	// At this point, we have a totally intialized file upload
	// node. Let's attach it to the DOM.
	jFilesContainer.append( jUpload );
}