function NormalDrop(ev, ui,a) {
	var drag_id = ui.draggable[0].id;
	$("#" + a.id).before($("#" + drag_id));
}
function MakeObjectsDraggable(section,dropfunc,overfunc) {
	$("#"+ section + " .draggable").draggable({helper:'clone',containment:"#"+ this.dom_id,cursorAt: {left:5}});
	 $("#"+ section + " .droppable").droppable({
	 	accept: "#"+ section + " .draggable",
		drop: function a(ev,ui) {var a = this; dropfunc(ev,ui,a)},
		over: overfunc
	});
}
function ModdifiedMakeObjectsDraggable(drag,drop,dropfunc,ref,overfunc) {
	$("#"+ drag).draggable({helper:'clone',containment:"#"+ this.dom_id,cursorAt: {left:5}});
	 $("#"+ drop ).droppable({
	 	accept: "#"+ drag,
		drop: function a(ev,ui) {var a = this; dropfunc(ev,ui,a,ref)},
		over: overfunc
	});
}
function Section(title,dom_id,section_id) {
	this.title = title;
	this.dom_id = dom_id;
	this.children = new Object();
	this.options = new Object();
	this.num_children = 0;
	this.id = section_id;
	this.hide_header = false;
	this.AddChild = function(child,dom_id) {
		if(this.children[dom_id]){
			alert(dom_id + " already exists on this page, please chose a different dom_id"); //later this will return silently
			;
		}
		else{
			if(this.title == "testimonials") {
				//console.log(child)
				//onsole.log(dom_id);
			}
			this.children[dom_id] = child;
			child.SetDomId(dom_id);
			this.num_children++;
		}
	}
	this.RemoveChild = function(child) {
		delete this.children[child.dom_id];
		this.num_children--;
	}
	this.Draw = function() {
		var options = $("<div id='options-" + this.dom_id +"' class='options'></div>");
		for(var i in this.options) {
			var option = this.options[i].Draw();
			options.append(option);
		}
		var div = null;
		//console.log("hiding header " + this.hide_header + " " + this.title);
		if(this.hide_header)
			div = $("<div id='" + this.dom_id + "' class='section'></div>");
		else
			div = $("<div id='" + this.dom_id + "' class='section'><div class='title'>" + this.title + "</div></div>"); 
		div.prepend(options);
		div.prepend($("<a name='"+this.title+"'></a>"));
		for(var i in this.children) {
			var child = this.children[i].Draw();
			div.append(child);
		}
		return(div);
	}
	this.GetValues = function() {
		var html = "";
		for(var i in this.children) {
			html += this.children[i].value;
		}
		return(html);
	}
	this.SetDomId = function(dom_id) {
		this.dom_id = dom_id;
	}
	this.Submit = function() {
		var submit = new Object();
		/*for(var i in this.children) {
			var child = this.children[i];
			submit[child.dom_id] = child.Submit();
		}*/
		var a = this.children;
		var x = 0;
		$("#" + this.dom_id + " .item").each( function() {
			if(a[this.id])
				submit[x++] = a[this.id].Submit();
		});
		return(submit);
	}
	this.AddOption = function(el) {
		this.options[el.dom_id] = el;
	}
	this.AddBlockForm = function() {
		//console.log(this)
		var opt_div = $("#options-" + this.dom_id);
		var temp_div = $("<div id='temp-options-" + this.dom_id + "></div>");
		var select = new Select("Block Type","block_type",-1,new Object({options:this.available_options,val_field:"id",title_field:"name"}));
		select.SetDomId("select-options-" + this.dom_id);
		var a = this;
		select.OnChange( function() {
			a.AddBlock();
		});
		temp_div.append(select.Draw());
		opt_div.append(temp_div);
		temp_div.hide();
		temp_div.slideDown(300);
	}
	this.AddBlock = function() {
		//console.log(this)
		var val = $("#select-options-" + this.dom_id).val();
		var block_type = this.available_options[val];
		var attrs = this.available_options[val].tag_attrs;
		var dom_id = this.title + "-" + block_type['tag'] + "_" + (this.num_children + 1);
		//console.log(dom_id);
		var func = "new " + block_type['tag'] + "(\"\",\"" + dom_id + "\",\"New Values Go here\",\"\")";
		var obj = eval(func);
		this.AddChild(obj,dom_id);
		var temp = obj.Draw();
		$("#" + this.dom_id).append(temp);
		obj.ConvertToInput();
		obj.SetAttr(new Object({content_section_id:this.id,body_type_id:block_type['id'],tag_attrs:attrs}));
		temp.hide().show(1000);
		$("#temp-options-" + this.dom_id).remove();
	}
	this.Set = function(key,value) {
		this[key] = value;
	}
}
function Option(dom_id) {
	this.dom_id = dom_id;
	this.Draw = function() {
		return(this.Create());
	}
	this.SetOnClick = function(func) {
		this.onclick = func;
	}
}
function LinkOption(dom_id,name,href) {
	this.inherit = Option;
	this.inherit(dom_id);
	this.href = href;
	this.onclick = null;
	this.name = name;
	this.Create = function() {
		var el = $("<a class='link-option'>"+this.name+"</a>");
		if(href)
			el.attr("href",this.href);
		if(this.onclick)
			el.click(this.onclick);
		return(el);
	}
}
function Form(action,title,dom_id,method) {
	this.inherit = Section;
	this.inherit(title,dom_id);
	this.action = action;
	this.method = method;
	this.fake_form = false;
	this.json_submit = false;
	this.json_hidden_id = "";
	this.Draw = function() {
		if(!this.fake_form)
			var form = $("<form action='" + this.action + "' method='" + this.method + "' id='" + this.dom_id +"'></form>");
		else
			var form = $("<div id='" + this.dom_id + "'></div>");
		var a = this;
		form.submit( function() { a.Submit();});
		for(var i in this.children) {
			var child = this.children[i].Draw();
			form.append(child);
		}
		return(form);
	}
	this.Submit = function() {
		if(this.json_submit) {			
			var s = new Object();
			for(var i in this.children) {
				var child = this.children[i];
				if(child.dom_id == this.json_hidden_id) continue;
				s[child.dom_id] = child.Submit();
			}
			$("#" + this.json_hidden_id).val($.toJSON(s));
			//console.log($.toJSON(s));
			//console.log(s);
			return(true);
		}
		//put some validating in here at some point.
		return(true); //for now
	}
	this.JSONSubmit = function(bool,hidden_id) {
		this.json_submit = true;
		this.json_hidden_id = hidden_id;
	}
}
function Input(title,name,value,attr) {
	this.title = title;
	this.name = name;
	if(attr)
		this.attr = attr;
	else
		this.attr = new Object();
	this.onclick = null;
	this.onchange = null;
	this.classes = new Object();
	if(attr && attr.classes) {
		console.log(attr.classes)
		for(var i in attr.classes) {
			console.log(attr.classes[i]);
			this.classes[i] = attr.classes[i];
		}
		console.log(this.classes);
	}
	if(!value)
		this.value = '';
	else
		this.value = value;
	this.type = 'text';
	this.GetClasses = function() {
		var html = "";
		for(var i in this.classes) {
			html += this.classes[i] + " ";
		}
		return(html);
	}
	this.Draw = function() {
		var el = $("<div class='" + this.GetClasses() + "'  id='container-" + this.dom_id + "'>");
		var title_div = this.GetTitleDiv();
		var input_field = this.GetInputField();
		if(this.onclick)
			input_field.click(this.onclick);
		if(this.onchange) {
			input_field.change(this.onchange);
		}
		var input_div = this.GetInputDiv(input_field);
		el.append(title_div).append(input_div);
		return(el);
	}
	this.GetInputDiv = function(input_field) {
		var input_div = $("<div class='input item'></div>");
		input_div.append(input_field);
		return(input_div);
	}
	this.GetInputFieldBase = function() {
		var input_field = $("<input id='" +this.dom_id + "' name='" + this.name + "' type='" + this.type + "' value='" + this.value + "'>");
		if(this.attr['size'])
			input_field.attr('size',this.attr['size']);
		if(this.onclick)
			input_field.click(this.onclick);
		if(this.onchange) {
			input_field.change(this.onchange);
		}
		return(input_field);
	}
	this.GetInputField = function() {
		return(this.GetInputFieldBase());
	}
	this.GetTitleDiv = function() {
		return($("<div class='title'> " + this.title + "</div>"));
	}
	this.SetDomId = function(dom_id) {
		this.dom_id = dom_id;
		//console.log("setting dom id: " + this.dom_id);
	}
	this.Submit = function() {
		return(new Object({val:this.value,attr:this.attr}));
	}
	this.OnClick = function(func) {
		this.onclick = func;
	}
	this.OnChange = function(func) {
		this.onchange = func;
	}
	this.SetAttr = function(obj){
		for(var i in obj) {
			this.attr[i] = obj[i];
		}
	}
	this.GetValue = function() {
		return ($("#"+this.dom_id).val());
	}
	this.SetValue = function(val) {
		this.value = val;
	}
	this.PostDraw = function(){
		;
	}
}
function Text(title,name,value,attr) {
	this.inheritFrom = Input;
	this.inheritFrom(title,name,value,attr);
	this.type = 'text';
	this.dom_id = "";
}
function char(title,name,value,attr){
	this.inheritFrom = Text;
	this.inheritFrom(title,name,value,attr);
}
function date(title,name,value,attr) {
	this.inheritFrom = Text;
	this.inheritFrom(title,name,value,attr);
	this.GetInputField = function(){
		var field = this.GetInputFieldBase();
		return(field);
	}
	this.PostDraw = function() {
		$('#' + this.dom_id).date_input();
	}
}
function date_time(title,name,value,attr){
	this.inheritFrom = date;
	this.inheritFrom(title,name,value,attr);
}
function Hidden(title,name,value,attr) {
	this.inheritFrom = Input;
	this.inheritFrom(title,name,value,attr);
	this.type = 'hidden';
	this.dom_id = "";
}
function TextArea(title,name,value,attr) {
	this.inheritFrom = Input;
	this.inheritFrom(title,name,value,attr);
	this.type='textarea'
	this.GetInputField = function() {
		var additional = "";
		if(this.attr) {
			additional  = ((this.attr.rows) ? " rows='" + this.attr.rows +"' " : "") + (this.attr.cols) ? " cols='"+(this.attr.cols)+"' " : "";
		}
		//console.log(additional);
		return($("<textarea " + additional +" class='' id='" +this.dom_id + "' name='" + this.name + "'>" + this.value + "</textarea>"));
	}
}
function Select(title,name,value,attr) {
	this.inheritFrom = Input;
	this.inheritFrom(title,name,value,attr);
	this.type='select';
	this.GetInputField = function() {
		var select = $("<"+this.type+" name='" + this.name + "' id='" + this.dom_id + "'></select>");
		if(this.attr.default_option) {
			select.append("<option selected value='"+this.attr.default_option.value+"'>"+this.attr.default_option.title+"</option>");
		}
		for(var i in this.attr.options) {
			var t = this.attr.options[i];
			var val = t[this.attr.val_field];
			var title = t[this.attr.title_field];
			select.append("<option value='" + val + "'>" + title + "</value>");
		}
		return(select);
	}
}
function Button(title,name,value,attr) {
	this.inheritFrom = Input;
	this.inheritFrom(title,name,value,attr);
	this.type = 'button';
	this.dom_id = "";
}
function Submit(title,name,value,attr) {
	this.inheritFrom = Button;
	this.inheritFrom(title,name,value,attr);
	this.type = 'submit';
	this.dom_id = "";
}
function p(title,name,value,attr) {
	this.inheritFrom = Input;
	this.inheritFrom(title,name,value,attr);
	this.type='p';
	this.self = p;
	this.editable = true;
	this.convert_to_wysiwyg = true;
	this.Draw = function() {	
		this.value = this.value.replace('""','"');
		var additional = "";
		if(this.attr && this.attr.tag_attrs) {
			additional = this.attr.tag_attrs;
		}
		var p = $("<div class='" + this.type +"-class draggable droppable item' id='"+ this.dom_id +"'></div>");
		//var drag_div = $("<div class='draggable dragbox'>&nbsp;</div>");
		var val_div = $("<div class=''><"+this.type+" id='" + this.dom_id + "-actual' " + additional + ">" + this.value + "</"+this.type+"></div>");
		//p.append(drag_div).append(val_div);
		p.append(val_div);
		var a = this;
		if(this.editable)
			val_div.click(function() {a.ConvertToInput();});
		return(p);
	}
	this.ConvertToInput = function() {
		//console.log(this.dom_id);
		var dom = $('#' + this.dom_id);
		var replacer = new TextArea(this.title,this.name,this.value,"");
		replacer.attr = this.attr;
		var button = new Button("","","Update","");
		var del = new Button("","","Delete","");
		var a = this;
		button.OnClick( function() {
			a.ConvertToText();
		});
		del.OnClick( function() {
			a.Remove();
		});
		button.SetDomId("button-" + this.dom_id);
		replacer.SetDomId("input-" + this.dom_id);
		var t = replacer.Draw();
		t.insertBefore(dom).hide().slideDown(500);
		t.append(button.GetInputField()).append(del.GetInputField());
		if(this.convert_to_wysiwyg)
			$("#" + "input-" + this.dom_id).wysiwyg();
		$("#"+this.dom_id).remove();
	}
	this.ConvertToText = function() {
		//console.log(this.dom_id);
		var dom = $("#input-" + this.dom_id);
		var container = $("#container-input-" + this.dom_id);
		this.value = dom.val();
		var replacer = new this.self(this.title,this.name,this.value,this.attr);
		replacer.SetDomId(this.dom_id);
		replacer.attr = this.attr;
		var t = replacer.Draw();
		t.insertBefore(container).hide().show(500);
		container.remove();
		var parents = t.parent(".section");
		MakeObjectsDraggable(parents[0].id,NormalDrop);
	}
	this.Remove = function() {
		$("#container-input-" + this.dom_id).remove();
	}
}
function h1(title,name,value,attr) {
	this.inheritFrom = p;
	this.inheritFrom(title,name,value,attr);
	this.type='h1';
	this.self = h1;
}
function media(title,name,value,attr) {
	this.inheritFrom = p;
	this.inheritFrom(title,name,value,attr);
	this.type='media';
	this.self = media;
	this.convert_to_wysiwyg = false;
}
function h2(title,name,value,attr) {
	this.inheritFrom = p;
	this.inheritFrom(title,name,value,attr);
	this.type='h2';
	this.self = h2;
}
function h3(title,name,value,attr) {
	this.inheritFrom = h1;
	this.inheritFrom(title,name,value,attr);
	this.type='h3';
	this.self = h3;
}
function h4(title,name,value,attr) {
	this.inheritFrom = h1;
	this.inheritFrom(title,name,value,attr);
	this.type='h4';
	this.self = h4;
}
function div(title,name,value,attr) {
	this.inheritFrom = h1;
	this.inheritFrom(title,name,value,attr);
	this.type='div';
	this.self = div;

}
function img(title,name,value,attr) {
	this.inheritFrom = p;
	this.inheritFrom(title,name,value,attr);
	this.type='img';
	this.self = img;
	this.value = value.replace(/\&quot;/g,'"');
	this.GetImageTag = function() {
		return("<"+this.type+" id='" + this.dom_id + "-actual' "+ this.value + " />");
	}
	this.Draw = function() {
		var p = $("<div class='" + this.type +"-class draggable droppable item' id='"+ this.dom_id +"'></div>");
		//var drag_div = $("<div class='draggable dragbox'>&nbsp;</div>");
		var val_div = $("<div class=''>" + this.GetImageTag() +"</div>");
		//p.append(drag_div).append(val_div);
		p.append(val_div);
		var a = this;
		if(this.editable)
			val_div.click(function() {a.ConvertToInput();});
		return(p);
	}
	this.ConvertToInput = function() {

		var dom = $('#' + this.dom_id);
		//console.log(this.value);
		if(this.value == "New Values Go here")
			this.value = "src=\"http://\"";
		var replacer = new TextArea(this.title,this.name,this.value,"");
		var button = new Button("","","Update","");
		var del = new Button("","","Delete","");
		var a = this;
		button.OnClick( function() {
			a.ConvertToText();
		});
		del.OnClick( function() {
			a.Remove();
		});
		button.SetDomId("button-" + this.dom_id);
		replacer.SetDomId("input-" + this.dom_id);
		var t = replacer.Draw();
		t.insertBefore(dom).hide().slideDown(500);
		t.append(button.GetInputField()).append(del.GetInputField());
		$("#"+this.dom_id).remove();
	}
	this.ConvertToText = function() {
		var dom = $("#input-" + this.dom_id);
		var container = $("#container-input-" + this.dom_id);
		this.value = dom.val();
		//this.value = this.value.substring(this.value.indexOf(" "),this.value.length - 2);
		//this.value = this.value.replace("<img","").replace("/>","").replace(">","");
		//console.log(this.value);
		var replacer = new this.self(this.title,this.name,this.value,this.attr);
		//var replacer = $(this.value);
		replacer.SetDomId(this.dom_id);
		var t = replacer.Draw();
		t.insertBefore(container).hide().show(500);
		container.remove();
		var parents = t.parent(".section");
		MakeObjectsDraggable(parents[0].id,NormalDrop);
	}
}

function ul(title,name,value,attr) {
	this.inheritFrom = p;
	this.inheritFrom(title,name,value,attr);
	this.type='ul';
	this.self = ul;
	this.ConvertToInput = function() {

		var dom = $('#' + this.dom_id);
		var t = $("<div id='container-input-" + this.dom_id + "'></div>");
		$('#' + this.dom_id + "-actual").children().each( function() {
			var html = $(this).html().replace(/<span>/g,"").replace(/<\/span>/g,"");
			var text = new TextArea("","",html,new Object({rows:2,cols:70}));
			t.append(text.GetInputField()).append("<br />");
		});

		var add = new Button("","","Add","");
		var button = new Button("","","Update","");
		var del = new Button("","","Delete","");
		var a = this;
		add.OnClick( function() {
			$(new TextArea("","","",new Object({cols:70,rows:1})).GetInputField()).insertBefore("#button-row-" + a.dom_id).wysiwyg();
		});
		button.OnClick( function() {
			a.ConvertToText();
		});
		del.OnClick( function() {
			a.Remove();
		});
		button.SetDomId("button-" + this.dom_id);
		t.attr('id',"container-input-" + this.dom_id);
		t.insertBefore(dom).hide().slideDown(500);
		var button_row = $("<div id='button-row-" + this.dom_id + "'></div>"); 
		button_row.append(add.GetInputField()).append(button.GetInputField()).append(del.GetInputField());
		t.append(button_row);
		$("#"+this.dom_id).remove();
	}
	this.ConvertToText = function() {
		//var dom = $("#input-" + this.dom_id);
		var container = $("#container-input-" + this.dom_id);
		var val = "";
		container.children().each( function() {
			if($(this).val() != "") {//probably a better way to see if its an input field
				//console.log($(this).val());
				val += "<li><span>" + $(this).val() + "</span></li>";
			}
		});
		this.value = val;
		//console.log(val);
		var replacer = new this.self(this.title,this.name,this.value,this.attr);
		replacer.SetDomId(this.dom_id);
		replacer.attr = this.attr;
		var t = replacer.Draw();
		t.insertBefore(container).hide().show(500);
		container.remove();
		var parents = t.parent(".section");
		MakeObjectsDraggable(parents[0].id,NormalDrop);
	}
}
function ol(title,name,value,attr) {
	this.inheritFrom = ul;
	this.inheritFrom(title,name,value,attr);
	this.type='ol';
	this.self = ol;
}
function Chooser(title,name,value,attr) {
	this.inheritFrom = Select;
	this.inheritFrom(title,name,value,attr);
	this.Draw = function() {
		var container = $("<div class='chooser' id='" + this.dom_id + "'>Simply Drag Items from left<->right</div>");
		var available = this.GetColumn('available');
		var selected = this.GetColumn('set');
		container.append(available).append(selected);
		return(container);
	}
	this.GetColumn = function(column) {
		var options = this.attr.options ? this.attr.options : null;
		var t = null;
		if(options && options[column]){

			t = options[column];

		}
		//console.log(this.attr);
		var ret = $("<div id='"+this.name+"-" + column + "-drop' class='"+column+" droppable'>" + column + " " + this.title + "</div>");
		for(var i in t) {
			ret.append("<li class='draggable droppable' id='"+this.name+"-" + column +"-drop_"+i+">" + t[i][this.attr.val_field] + "</li>");
		}
		return(ret);
	}
	this.Drop = function(ev,ui,a,ref) {
		//two options we can move from side to side or up in our own
		//console.log(this);
		//console.log(a);
		//console.log(ref);
		var drag_id = ui.draggable[0].id;
		var drop_id = a.id;
		var new_id = a.id + drag_id.substr(drag_id.indexOf("_"));
		var parent_id = drag_id.substr(0,drag_id.indexOf("_"));
		//console.log(drag_id + " being dragged onto: " + a.id);
		if(parent_id == drop_id) {
			//reorder
			//console.log(ui);
			ui.helper.dropped_on_droppable = true;
			$("#" + a.id).before($("#" + drag_id));
		}
		else {
			var b = this;
			setTimeout(function() {	ModdifiedMakeObjectsDraggable("testimonials-set-drop li","testimonials-available-drop",ref.Drop,ref);},1000);
			setTimeout(function() {ModdifiedMakeObjectsDraggable("testimonials-set-drop li","testimonials-set-drop li",ref.Drop,ref);},1000);
			setTimeout(function() {	ModdifiedMakeObjectsDraggable("sales-set-drop li","sales-available-drop",ref.Drop,ref);},1000);
			setTimeout(function() {ModdifiedMakeObjectsDraggable("sales-set-drop li","sales-set-drop li",ref.Drop,ref);},1000);
			if($(a)[0].tagName == "LI") {
					$("#" + drag_id).insertBefore("#" + a.id);
			}
			else {
				$("#" + drag_id).appendTo($("#" + drop_id)).attr('id',new_id);
			}
		}
		//$("#" + drag_id).parent().remove($("#" + drag_id));
	}
	this.Submit = function() {
		var ret = new Object();
		$("#" + this.name + "-set-drop").children().each( function() {
			var id = this.id.substr(this.id.indexOf("_") + 1);
			ret[id] = id;
		});
		return(new Object({val:ret,attr:new Object()}));
	}
}
function FileUploader(id,name,tab,image_types){
	this.div = $("#" + name + "_container_div");
	//console.log("#" + name + "_container_div")
	this.dom_id = id;
	this.name = name;
	this.tab = tab;
	this.types = image_types;
	//console.log(tab)
	//console.log(this.types);
	this.counter = 0;
	this.AddUpload = function(){
		this.counter++;
		var temp = $("<div class='image_upload'></div>")
		var input = $("<input type='file' name='"+this.name + (this.counter)+"' />");
		var caption = $("<input type='text' name='caption["+this.counter+"]' />");
		var type = new Select("Image Type","image_type["+this.counter+"]",-1,{val_field:'id',title_field:'name',options:this.types});
		var a = this;
		input.click(function(){
			a.AddUpload();
		});
		var input_div = $("<div><div >Image Upload</div></div>").append(input);
		var caption_div = $("<div><div >Caption</div></div>").append(caption);
		temp.append(input_div).append(caption_div).append(type.Draw());
		this.div.append(temp);
	}
	this.AddUpload();
}