function box_initialize(item_id)
{
	if(item_id == null)
	{
		prepare_inputs();
		size_inputs();
		prepare_ratings();
	}
	else
	{
		prepare_input(item_id);
		size_input(item_id);
		prepare_rating(item_id);
		prepare_tags(item_id);
	}
}

function size_inputs()
{
	size_input();//TODO better would be to pass a special id here
}

function size_input(item_id)
{
	var css_selector = "";
	if(item_id==null)
		{css_selector = ".item input.item_title_input";}
	else
		{css_selector = "#"+item_id+" input.item_title_input";}

	$$(css_selector).each(
		function(input)
		{
			input.style.width=get_input_width(input, "item_title_input")+"px";
		}
	);
}

function prepare_inputs()
{
	prepare_input();//TODO special id, s.a.
}

function prepare_input(item_id)
{
	var css_selector = "";
	if(item_id==null)
		{css_selector = ".item input[type=text]";}
	else
		{css_selector = "#"+item_id+" input[type=text]";}
	
	$$(css_selector).each(
		function(input)
		{
			input.item_title=input.value;
		}
	);
}

function prepare_tags(item_id)
{
}

function get_input_width(element, css_class)
{
	var box = element;
	var cr = document.createElement('div');
	var inv = document.createElement('span');
	var form = $$('form')[0];
	cr.appendChild(inv);
	form.appendChild(cr);
	inv.className = css_class;
	inv.style.display='inline';
	//inv.style.fontFamily="arial";
	cr.style.position="absolute";
	cr.style.top = "-1000px";
	cr.style.left = "-1000px";
	cr.style.width = "1000px";
	cr.style.visibility = "hidden";
	inv.innerHTML = box.value;
	var val = inv.offsetWidth;
	if(val < 5) val = 100;
	if(val > 500) val = 500;
	form.removeChild(cr);
	return val;
}

function prepare_ratings()
{
	prepare_rating();
}

function prepare_rating(item_id)
{
	var css_selector = "";
	if(item_id==null)
		{css_selector = ".item div.rating";}
	else
		{css_selector = "#"+item_id+" div.rating";}
	
	$$(css_selector).each(function(element)
	{
		element.onmousemove = function(evt)
		{
			var e = evt || window.event; //FF or IE
			var mask = get_child("mask", element);
			//var personal = element.childNodes[0];
			
			var x_mouse = Event.pointerX(e) - Position.page(mask)[0];
			var el_width = mask.offsetWidth;
			var rating = x_mouse / el_width * 10;
			set_rating_visuals(element, rating);
		}
		element.onmouseout = function(){reset_rating_visuals(element)};
		element.onclick = function(evt){
			var e = evt || window.event; //FF or IE
			var mask = get_child("mask", element);
			var x_mouse = Event.pointerX(e) - Position.page(mask)[0];
			var el_width = mask.offsetWidth;
			var personal = get_child("personal", element);
			//new Effect.Morph(mask, {style:{opacity:0.0},duration:0.0});
			//personal.morph('width:0');
			

			var rating = x_mouse / el_width * 10;
			//alert(x_mouse / el_width);
			//alert(get_child("box_id", element).value);
			new Ajax.Request('/boxes/update_rating/'+get_child("box_id",$(element.id)).value, {asynchronous:true, evalScripts:true, parameters:'personal_rating='+rating});
			mask.style.backgroundPosition = "-8px -128px";
		}
		
		reset_rating_visuals(element);
	});
}

//public; set the rating visuals
//element: the div that contains all the rating-relevant divs.
//rating: the rating as float between 0.0 and 10.0, 10 being best.
function set_rating_visuals(element, rating)
{
	var mask = get_child("mask", element);
	var personal = get_child("personal", element);
	var el_width = mask.offsetWidth;
	var rating_pos = Math.min((rating / 10 * el_width), el_width);
	if(rating!="")
	{
		//set personal rating
		personal.style.width = rating_pos + "px";
	}
	else
	{
		//if there is no rating then use average for deciding which locks look open
		rating = get_child('average_value', element).value;
		//set personal rating to 0
		personal.style.width = "0px";
	}
	
	//set icons accordingly
	var icon_count = Math.ceil(rating/2 - 0.5);
	var bg_pos = "-8px -8px"
	switch(icon_count)
	{
		case 0: bg_pos = "-8px -8px";
		break;
		case 1: bg_pos = "-8px -28px";
		break;
		case 2: bg_pos = "-8px -48px";
		break;
		case 3: bg_pos = "-8px -68px";
		break;
		case 4: bg_pos = "-8px -88px";
		break;
		case 5: bg_pos = "-8px -108px";
		break;
	}
	if(mask.style.backgroundPosition != "-8px -128px")
		mask.style.backgroundPosition = bg_pos;
}

function reset_rating_visuals(element)
{	
	var personal_value = get_child("personal_value", element).value;
	set_rating_visuals(element, personal_value);
	//now set the average rating
	var average = get_child("average", element);
	var rating = get_child("average_value", element).value;
	var mask = get_child("mask", element);
	var el_width = mask.offsetWidth;
	var rating_pos = Math.min((rating / 10 * el_width), el_width);
	//alert(average);
	average.style.left = (rating_pos-2)+"px";
}

//returns the first direct child (with spec. classname) of the passed-in parent.
function get_child(class_name, direct_parent)
{
	var children = $(direct_parent).childNodes;
	if(children == null) return null;
	for(var i=0; i<children.length; i++)
	{
		var n = children.item(i);
		if(n.className == class_name) return n;
	}
	return null;
}

function add_hidden_field(id)
{
	var i = 0;
	while($(id+"_hf_"+i))
	{
		i++;
	}
	var code_to_insert = "<div id='"+id+"_hf_"+i+"'>";
	code_to_insert += "<input type='text' name='field_name"+i+"'> = <input type='text' name='field_value"+i+"'>";
	code_to_insert += " <a href='#' onclick=\"remove_hidden_field('"+id+"_hf_"+i+"'); return false;\" >x</a>"; //<%= link_to_function 'l&ouml;schen', "delete_hidden_field('#{box.id}', '#{h(hf.name)}')" %>
	code_to_insert += "</div>";
	new Insertion.Before('insertion_link_'+id, code_to_insert);
}

function remove_hidden_field(id)
{
	Element.remove(id);
}

function delete_hidden_field(box_id, field_name)
{
	var id = box_id + "_hf_" + field_name;
	$(box_id+"_hf_"+field_name).remove();
	var code_to_insert = "<input type='hidden' name='delete_"+field_name+"' value='delete_"+field_name+"'>";
	new Insertion.Before('insertion_link_'+box_id, code_to_insert);
}

function restore_title_input(item_id)
{
	$$("#"+item_id+" input.item_title_input").each(
		function(input)
		{
			input.value = input.item_title;
		}
	);
}

//for scraping start
function hilite_dynamic_textfield(input, form)
{
    var css = "#scrape_result #"+form+" .field input[type=text]";
    var textfields = $$(css);
    textfields.each(function(field)
    {
      field.className = "";
    });
    if(input) $(input).className = "dynamic";
    else if(textfields[2]) textfields[2].className = "dynamic"
}

function hilite_submit_button(input, form)
{
    var css = "#scrape_result #"+form+" .field input[type=submit]";
    var buttons = $$(css);
    buttons.each(function(btn)
    {
      btn.disabled = true;
    });
    if(input) $(input).disabled = false;
    else if(buttons[0]) buttons[0].disabled = false;   
}

function scraper_add_hidden_field()
{
	var hf = "hidden_field";
	var hf_name = hf+"_name";
	var hf_value = hf+"_value";
	var i = 0;
	var field = null;
	do
	{
		i++;
		field = $(hf+i);
	}while(field!=null)
	
	var html = "<div class='field' id='"+hf+i+"' >";
	html += "	<div class='plucked'>";
	html += "		<span class='input_label'>";
	html += "			<input type='text' name='"+hf_name+i+"' class='label' />:";
	html += "		</span>";
	html += "		<span class='element'>";
	html += "			<input type='text' name='"+hf_value+i+"' />";
	html += "		</span>";
	html += "	</div>";
	html += "	<div class='meta'>";
	html += "		<a href=\"javascript:remove_hidden_field('"+hf+i+"')\">X</a>";
	html += "	</div>";
	html += "</div>";
	new Insertion.Bottom('hidden_fields_part', html);
}

function display_single_form(form_id, num_of_forms)
{
    for(var i=0; i<num_of_forms; i++)
    {
       $('form'+i).hide();
       $('form'+i+'link').className = "";
    }
    $(form_id).show();
    $(form_id+'link').className = "active_tab";
}

function add_form_as_searchbox(action, form_id, method, title)
{
  var params = Form.serialize(form_id);
  params += "&form_action="+action;
  params += "&submit_method="+method;
  params += "&title="+title; 
  window.location = "/boxes/create_search_box_from_scrapi?"+params;
}

function test_form(action, form_id, method)
{
    //window.open(action+(action.indexOf("?") != -1 ? "&" : "?")+Form.serialize(form_id), new Date().getTime());
    var params = Form.serialize(form_id);
    params += "&form_action="+action;
    params += "&submit_method="+method;
	params += "&form_id="+form_id;
    new Ajax.Request(
			'/tools/test_form/', 
			{
				asynchronous:true, 
				evalScripts:true, 
				onLoading:function(request)
				{
				}, 
				onLoaded:function(request)
				{
				},
				onSuccess:function(request)
				{
				},
				onFailure:function(request)
				{
				},
				onException:function(request)
				{
				},					
				parameters:params
			}
		);
}

//for scraping end

//for dropdown lists start
function load_box_list_with_properties(type, order)
{
	//this.location.href = "/boxes/list?kind="+type+"&sort="+order;
	this.location.href = "/"+type+"/"+order;
}

function load_user_list_with_properties(type, order)
{
	this.location.href = "/people/"+type+"/"+order;
}
//for dropdown lists end

//restore a textfieds value after blur
function restore_after_delay(id, string, delay)
{
	setTimeout("$('"+id+"').value='"+string+"'", delay);
}

function merge_lookpicks(id_joining)
{
	var el = $$('#lookpick_to_merge_'+id_joining+'_with .item')[0];
	if(el != null)
	{
		var id_staying = el.id.split('_')[1];
		new Ajax.Updater('merge_box', '/boxes/merge_box/'+id_joining, {parameters:'merge_into_id='+id_staying});
	}else
	{
		alert("Please select a lookpick to merge into first.");
	}
}

function handle_var_name_fields(field, type, is_narrow, default_text, is_narrow)
{
	var active_class_name = is_narrow ? "narrow_field_active" : "wide_field_active";
	var inactive_class_name = is_narrow ? "narrow_field_inactive" : "wide_field_inactive";
	var val = field.value;
	if(type == 'focus')
	{
		field.className = active_class_name;
		if (val == default_text)
		{
			field.value = "";
		}
	}
	if(type == 'blur')
	{
		if(val == "")
		{
			field.value = default_text;
			field.className = inactive_class_name;
		}
	}
}

function submit_testing_form(box, query, form)
{
	var box = eval(box);
	var url = box.url;
	var field = box.search_field;
	var hidden_fields = eval(box.hidden_fields);
	if(field == "")//opensearch-like syntax
	{
		if(url.indexOf("{%2}")==-1) //just one parameter
		{
			url = url.replace("{searchTerms}", query);
		}
		else //more than one field
		{
			//allow any of |, >, / as separators
			var separator = "|";
			var query_arr = [];
			query_arr = query.split(separator);
			if(query_arr.length < 2)
			{
				separator = ">";
				query_arr = query.split(separator);
			}
			if(query_arr.length < 2)
			{
				separator = "/";
				query_arr = query.split(separator);
			}
			url = url.replace("{searchTerms}", escape(query_arr.shift().trim()));
			var next_placeholder = "{%2}";
			var i = 2;
			while(next_placeholder != "" && i <= 10)
			{
				var possible_next = "{%"+(i+1)+"}";
				if(url.indexOf(possible_next) == -1)
				{
					url = url.replace(next_placeholder, escape(query_arr.join(separator).trim()));
					next_placeholder = "";
				}else
				{
					var query_part = escape(query_arr.shift().trim()) || "";
					url = url.replace(next_placeholder, query_part);
					next_placeholder = possible_next;
				}
				i++;
			}
		}
		var fields_string = "";
		for(var i=0; i<hidden_fields.length; i++)
		{
			var conn = '&'
			if(i==0 && fields_string.indexOf('?') == -1 && url.indexOf('?') == -1) conn = '?';
			fields_string += conn + hidden_fields[i].name + '=' + hidden_fields[i].value;
		}
		url += fields_string;
		window.open(url);
		return false;
	}
	return true;//traditional syntax, so test via form not js.
}

// Add left trim, right trim, and trim functions
if (!String.prototype.lTrim) {
    String.prototype.lTrim = function() { return this.replace(/^\s*/, ''); }
}
if (!String.prototype.rTrim) {
    String.prototype.rTrim = function() { return this.replace(/\s*$/, ''); }
}
if (!String.prototype.trim) {
    String.prototype.trim = function() { return this.lTrim().rTrim(); }
}

//some global initialization stuff start
function global_init()
{
	var global_handlers = {
		onCreate: function()
		{
			el = $('busy');
			el.show();
			//Element.show(el);
			offset = Position.realOffset(el);
			el.style.left = (offset[0]+10) + "px";
			el.style.top = (offset[1]+10) + "px";
			document.body.className = 'busy';
		},
		onComplete: function(request, xhrObj, header) {
			if(Ajax.activeRequestCount == 0)
			{
				Element.hide('busy');
				document.body.className = '';
			}
			if(xhrObj.status > 299 || xhrObj.status < 200)
			{
				alert('Sorry, there has been a serverside error (code '+xhrObj.status+').');
			}
		}
	};
	Ajax.Responders.register(global_handlers);
}
global_init();
//some global initialization stuff end