/**
	***  delete_widget (  )
	**/
	function mf_delete_box (wnbr) {
		box = wnbr;
		while (box < mf_nbr_boxes() - 1) {

			// Copy the number of fields & values from the next widget
			var nbr_fields = mf_nbr_fields(box + 1);
			for (var row = 0; row < mf_nbr_fields(box); row++) mf_remove(box, 1);
			while (mf_nbr_fields(box) < nbr_fields) mf_add_field(box);			

			// Copy the values from the widget down from this one.
			for (var row = 0; row < nbr_fields; row++) $('key_' + box + '_' + row).value = $('key_' + (box + 1) + '_' + row).value;
			for (var row = 0; row < nbr_fields; row++) $('title_' + box + '_' + row).value = $('title_' + (box + 1) + '_' + row).value;
			for (var row = 0; row < nbr_fields; row++) $('type_' + box + '_' + row).value = $('type_' + (box + 1) + '_' + row).value;
			for (var row = 0; row < nbr_fields; row++) $('select_values_' + box + '_' + row).value = $('select_values_' + (box + 1) + '_' + row).value;
			for (var row = 0; row < nbr_fields; row++) $('page_' + box).value = $('page_' + (box + 1)).value;
			for (var row = 0; row < nbr_fields; row++) $('post_' + box).value = $('post_' + (box + 1)).value;
			for (var row = 0; row < nbr_fields; row++) $('name_' + box).value = $('name_' + (box + 1)).value;
			for (var row = 0; row < nbr_fields; row++) $('position_' + box).value = $('position_' + (box + 1)).value;
		
			box++;		
		}
		// Remove the div!
		$('box_div_' + (mf_nbr_boxes() - 1)).remove();
	}	
	/**
	***  add_box (  )
	**/
	function mf_add_box () {

		// Save state
		var values = mf_store_fields();

		// Create and insert a new widget
		form_html = '\n		<div id=\"box_div_7777\">\n		<hr style=\"display: none;\">\n		<div class=\"box_header\">\n			<div class=\"box_name\">\n				Name of box <br />\n				<input class=\"box_name\" type=\"text\" name=\"name_7777\" id=\"name_7777\" value=\"\" onchange=\"mf_check_for_duplicates(7777)\" /> \n			</div>\n			<div class=\"box_position\">Position <br /><select name=\"position_7777\" id=\"position_7777\"><option value=\"right\" >Right</option><option value=\"left\" >Left</option></select></div>\n			<div class=\"box_options\">\n				<label class=\"field_entry\"><input id=\"post_7777\" type=\"checkbox\" name=\"post_7777\"  /> Include on Post Write/Edit</label>\n				<label class=\"field_entry\"><input id=\"page_7777\" type=\"checkbox\" name=\"page_7777\"  /> Include on Page Write/Edit</label>\n			</div>\n		</div>\n		<div id=\"box_fields_div_7777\" class=\"box_fields\">	\n	\n		<table id=\"box_field_div_7777_0\" class=\"fields\">\n			<tr>\n				<td class=\"fieldKey\"><label for=\"title_7777_0\">Key 0: </label></td>\n				<td class=\"fieldkey-value\"><input type=\"text\" class=\"field\" name=\"key_7777_0\" id=\"key_7777_0\" value=\"\"></td>\n				<td class=\"fieldTitle\"><label for=\"title_7777_0\"> Title 0: </label></td>\n				<td class=\"fieldTitle-value\"><input type=\"text\" class=\"field\" name=\"title_7777_0\" id=\"title_7777_0\" value=\"\"></td>\n				<td class=\"fieldType\"><label class=\"field\"> Type 0: </label></td>\n				<td class=\"fieldType-value\"><select class=\"where\" name=\"type_7777_0\" id=\"type_7777_0\" onchange=\"if (this.value == \'select\') $(\'select_values_div_7777_0\').show(); else $(\'select_values_div_7777_0\').hide();\"><option value=\"text\" >Text</option><option value=\"textarea\" >Text area</option><option value=\"checkbox\" >Checkbox</option><option value=\"select\" >Select list</option></select></td>\n				<td class=\"fieldActions\">		\n					<a href=\"#\" onclick=\"mf_remove(7777,0); return false;\">Remove</a> | \n					<a href=\"#\" onclick=\"mf_move_up(7777, 0); return false;\">Move up</a> |\n					<a href=\"#\" onclick=\"mf_move_down(7777,0); return false;\">Move down</a> \n				</td>\n			</tr>\n			<tr id=\"select_values_div_7777_0\"  style=\"display: none;\">\n				<td></td>\n				<td colspan=\"5\" class=\"fieldValues\">\n					<input class=\"field_select_values\" name=\"select_values_7777_0\" id=\"select_values_7777_0\" type=\"text\" value=\"\">			\n				</td>\n			</tr>\n		</table>\n		</div>\n	<div style=\"background: #335533; padding: 10px; margin-bottom: 20px;\">\n		<div style=\"float: right;\">\n			<a href=\"#\" style=\"color: #ffffff;\" onclick=\"mf_delete_box(7777); return false;\"> Delete this box</a>\n		</div>\n		<div>\n			<a href=\"#\" onclick=\"mf_add_field(7777); return false;\" style=\"color: #ffffff;\">Add new field!</a>\n		</div>	\n	\n	</div><!-- h r --></div>';
		form_html = form_html.replace(/7777/g, mf_nbr_boxes());
		new Insertion.Bottom('boxes_div', form_html);

		// Restore state
		mf_restore_fields(values);
	}
	/**
	***  add_field (  )
	**/
	function mf_add_field (wnbr) {

		// Save our values
		var values = mf_store_fields();

		// Create and insert another field				
		var form_html = "\n		<table id=\"box_field_div_8888_9999\" class=\"fields\">\n			<tr>\n				<td class=\"fieldKey\"><label for=\"title_8888_9999\">Key 9999: </label></td>\n				<td class=\"fieldkey-value\"><input type=\"text\" class=\"field\" name=\"key_8888_9999\" id=\"key_8888_9999\" value=\"\"></td>\n				<td class=\"fieldTitle\"><label for=\"title_8888_9999\"> Title 9999: </label></td>\n				<td class=\"fieldTitle-value\"><input type=\"text\" class=\"field\" name=\"title_8888_9999\" id=\"title_8888_9999\" value=\"\"></td>\n				<td class=\"fieldType\"><label class=\"field\"> Type 9999: </label></td>\n				<td class=\"fieldType-value\"><select class=\"where\" name=\"type_8888_9999\" id=\"type_8888_9999\" onchange=\"if (this.value == \'select\') $(\'select_values_div_8888_9999\').show(); else $(\'select_values_div_8888_9999\').hide();\"><option value=\"text\" >Text</option><option value=\"textarea\" >Text area</option><option value=\"checkbox\" >Checkbox</option><option value=\"select\" >Select list</option></select></td>\n				<td class=\"fieldActions\">		\n					<a href=\"#\" onclick=\"mf_remove(8888,9999); return false;\">Remove</a> | \n					<a href=\"#\" onclick=\"mf_move_up(8888, 9999); return false;\">Move up</a> |\n					<a href=\"#\" onclick=\"mf_move_down(8888,9999); return false;\">Move down</a> \n				</td>\n			</tr>\n			<tr id=\"select_values_div_8888_9999\"  style=\"display: none;\">\n				<td></td>\n				<td colspan=\"5\" class=\"fieldValues\">\n					<input class=\"field_select_values\" name=\"select_values_8888_9999\" id=\"select_values_8888_9999\" type=\"text\" value=\"\">			\n				</td>\n			</tr>\n		</table>\n		";
		form_html = form_html.replace(/8888/g, wnbr);
		form_html = form_html.replace(/9999/g, mf_nbr_fields(wnbr));
		new Insertion.Bottom('box_fields_div_' + wnbr, form_html);

		// Restore the fields
		mf_restore_fields(values);
	}
	/**
	***  nbr_fields (  )
	**/
	function mf_nbr_fields(wnbr) {
		var block = $(('box_fields_div_' + wnbr));
		var fieldsets = block.getElementsByTagName("input");
		return (parseFloat(fieldsets.length)) / 3 ;
	}
	/**
	***  nbr_boxes (  )
	**/
	function mf_nbr_boxes() {
		var block = $('boxes_div');
		var fieldsets = block.getElementsByTagName('hr');
		return (parseFloat(fieldsets.length));
	}
	/**
	***  remove (  )
	**/
	function mf_remove(wnbr, nbr) {
		$(('key_' + wnbr + '_' + nbr)).value = ''; 
		$(('title_' + wnbr + '_' + nbr)).value = ''; 
		$(('type_' + wnbr + '_' + nbr)).value = ''; 
		$(('select_values_' + wnbr + '_' + nbr)).value = ''; 
		if (mf_nbr_fields(wnbr) > 1) {
			while (nbr < mf_nbr_fields(wnbr) - 1) {
			mf_swap('key_' + wnbr + '_' + nbr, 'key_' + wnbr + '_' + (nbr+1)); 
			mf_swap('title_' + wnbr + '_' + nbr, 'title_' + wnbr + '_' + (nbr+1)); 
			mf_swap('type_' + wnbr + '_' + nbr, 'type_' + wnbr + '_' + (nbr+1)); 
			mf_swap('select_values_' + wnbr + '_' + nbr, 'select_values_' + wnbr + '_' + (nbr+1)); 
				mf_swap_select_fields(wnbr + '_' + nbr, wnbr + '_' + (nbr + 1));
				nbr++;
			}
			// Now remove the last div
			$('box_field_div_' + wnbr + '_' + (mf_nbr_fields(wnbr) - 1)).remove();
		}
		return mf_nbr_fields(wnbr);
	}
	/**
	***  store_fields (  )
	**/
	function mf_store_fields () {
		var value = Array();
		var counter = 0;
		for (var box = 0; box < mf_nbr_boxes(); box++) {
			for (var i = 0; i < mf_nbr_fields(box); i++) { value['key_' + box + '_' + i] = $(('key_' + box + '_' + i)).value;  } 
			for (var i = 0; i < mf_nbr_fields(box); i++) { value['title_' + box + '_' + i] = $(('title_' + box + '_' + i)).value;  } 
			for (var i = 0; i < mf_nbr_fields(box); i++) { value['type_' + box + '_' + i] = $(('type_' + box + '_' + i)).value;  } 
			for (var i = 0; i < mf_nbr_fields(box); i++) { value['select_values_' + box + '_' + i] = $(('select_values_' + box + '_' + i)).value;  } 
			value['page_' + box] = $(('page_' + box)).value;  
			value['post_' + box] = $(('post_' + box)).value;  
			value['name_' + box] = $(('name_' + box)).value;  
			value['position_' + box] = $(('position_' + box)).value;  
		}
		return value;
	}
	/**
	***  restore_fields (  )
	**/
	function mf_restore_fields (value) {
		var counter = 0;
		for (var box = 0; box < mf_nbr_boxes(); box++) {
			for (var i = 0; i < mf_nbr_fields(box); i++)  if (value['key_' + box + '_' + i] != undefined) $(('key_' + box + '_' + i)).value = value['key_' + box + '_' + i]; 
			for (var i = 0; i < mf_nbr_fields(box); i++)  if (value['title_' + box + '_' + i] != undefined) $(('title_' + box + '_' + i)).value = value['title_' + box + '_' + i]; 
			for (var i = 0; i < mf_nbr_fields(box); i++)  if (value['type_' + box + '_' + i] != undefined) $(('type_' + box + '_' + i)).value = value['type_' + box + '_' + i]; 
			for (var i = 0; i < mf_nbr_fields(box); i++)  if (value['select_values_' + box + '_' + i] != undefined) $(('select_values_' + box + '_' + i)).value = value['select_values_' + box + '_' + i]; 
			if (value['page_' + box] != undefined) $(('page_' + box)).value = value['page_' + box]; 
			if (value['post_' + box] != undefined) $(('post_' + box)).value = value['post_' + box]; 
			if (value['name_' + box] != undefined) $(('name_' + box)).value = value['name_' + box]; 
			if (value['position_' + box] != undefined) $(('position_' + box)).value = value['position_' + box]; 
		}
		return value;
	}

	/**
	***  move_up (  )
	**/	
	function mf_move_up(wnbr, nbr) {
		if (nbr > 0) {
			var id1 = wnbr + '_' + nbr;
			var id2 = wnbr + '_' + (nbr - 1);
			mf_swap('key_' + id1, 'key_' + id2);
			mf_swap('title_' + id1, 'title_' + id2);
			mf_swap('type_' + id1, 'type_' + id2);
			mf_swap('select_values_' + id1, 'select_values_' + id2);
			mf_swap_select_fields(id1, id2);
		}
	}
	
	/**
	***  swap_select_fields ( )
	**/
	function mf_swap_select_fields (id1, id2) {	
		var vis1 = $('select_values_div_' + id2).style.display;
		$('select_values_div_' + id2).style.display = $('select_values_div_' + id1).style.display;
		$('select_values_div_' + id1).style.display = vis1;	
	}

	/**
	***  move_down (  )
	**/
	function mf_move_down(wnbr, nbr) {
		if (nbr < mf_nbr_fields(wnbr) - 1) {
			var id1 = wnbr + '_' + nbr ;
			var id2 = wnbr + '_' + (nbr + 1);
			mf_swap(('key_' + id1), ('key_' + id2));
			mf_swap(('title_' + id1), ('title_' + id2));
			mf_swap(('type_' + id1), ('type_' + id2));
			mf_swap(('select_values_' + id1), ('select_values_' + id2));
			mf_swap_select_fields(id1, id2);
	
		}	
	}
	/**
	***  swap (  )
	**/
	function mf_swap(id1, id2) {		
		var var1 = $(id1).value;
		var var2 = $(id2).value;
		$(id1).value = var2;
		$(id2).value = var1;		
	}
	
	function mf_check_for_duplicates(nbr) {
		for (var i=0; i < mf_nbr_boxes(); i++) {
			if ((i != nbr) && ($('name_' + nbr).value == $('name_' + i).value)) {
					alert('This key already exists - the box name must be unique!');
					$('name_' + nbr).focus();
					return 0;
			}
		}
	}