var sections;
var sectionlist;
var eb;
var editing;
var created = new Array();
var changed = new Array();
var removed = new Array();
var sectionorder;
var itemorder;
var item_nr = 1;
var section_nr = 1;

function select_template() {
	var form = document.forms['checklistform'];
	var t = form.template.value;
	var c1 = $("sections-col1");
	var c2 = $("sections-col2");
	if (t == "onecolumn")  {
		c1.adopt(sections.serialize(1));
	} else {
		sections.serialize(0).each(function(item, index){
			if (index % 2) c2.grab($(item));
		});
	}
	$("sections-col1").className = t;
	$("sections-col2").className = t;
}

function save() {
	unedit();
	var form = document.forms['checklistform'];
	var slist = new Array();
	form.checklist_title.value = $("ctitle").innerHTML;
	form.descr.value = $("descript").innerHTML;
	form.readmore.value = $("readmorelink").innerHTML;

	var s = sections.serialize().flatten();
	form.sections.value = s.join(",");
	form.col1.value = sections.serialize(0).join(",");
	form.col2.value = sections.serialize(1).join(",");
	form.created.value = created.join(",");
	form.changed.value = changed.join(",");
	form.removed.value = removed.join(",");
	for (var j = 0; j < sectionorder.length; j++) slist[sectionorder[j]] = sectionlist.serialize(j);
	for (var j = 0; j < s.length; j++) {
		var _sectionlist = new Element('input', {
			'type': 'hidden',
			'name': "itemlist-" + s[j],
			'value': slist[s[j]].join(",")
		});
		$('checklistform').appendChild(_sectionlist);
	}
	var details = created;
	details.extend(changed);
	for (var j = 0; j < details.length; j++) {
		if ($(details[j])) {
			if (details[j].indexOf("section")>-1) {
				var _section = new Element('input', {
					'type': 'hidden',
					'name': details[j],
					'value': $(details[j]).getElement('h2').innerHTML
				});
				$('checklistform').appendChild(_section);
			} else {
				var indent = $(details[j]).getAttribute('indent') || "0";
				var _item = new Element('input', {
					'type': 'hidden',
					'name': details[j],
					'value': indent + $(details[j]).getElement('span').innerHTML
				});
				$('checklistform').appendChild(_item);
			}
		}
	}
	form.submit();
}
function removeSection(id) {
	if (confirm("Delete section and items?")) {
		var _section_sc = $(id);
		var _section = _section_sc.getParent('li');
		sectionlist.removeLists(_section_sc);
		sectionorder.remove(_section.id);
		sections.removeItems(_section);
		_section.dispose();
		if (!created.contains(_section.id)) removed.include(_section.id);
		created.remove(_section.id);
		changed.remove(_section.id);
	}
}

function removeItems(section) {
	unedit();
	var boxes = $(section).getElements('input');
	boxes.each(function(elem, index) {
		if (elem.checked) {
			var item = elem.parentNode;
			if (!created.contains(item.id)) removed.include(item.id);
			created.remove(item.id);
			changed.remove(item.id);
			sectionlist.removeItems($(item.id));
			item.dispose();
		}
	});
}

function addItem(section) {
	var item = document.createElement('li');
	item.id = 'newitem-' + item_nr;
	item_nr++;
	item.className = "editable";
	item.innerHTML = '<div class="handle"> </div><input type="checkbox"><span>item</span>';
	$(section).appendChild(item);
	created.include(item.id);
	sectionlist.addItems($(item.id));
	return item.id;
}

function addSection() {
	var section = document.createElement('li');
	var section_id = section_nr;
	section_nr++;
	section.id = 'newsection-' + section_id;
	section.className = "section";
	var item_id = 'newitem-' + item_nr;
	item_nr++;
	var s = '<div class="tophandle"></div>';
	s += '<a href="#" onclick="removeSection(\'newsc-' + section_id + '\');return false;"><img src="images/delete.jpg" border=0 vspace=4 align=right></a>';
	s += '<h2 class="editable">section</h2>';
	s += '<ul class="section" id="newsc-' + section_id + '">';
	s += '<li class="editable" id="' + item_id + '"><div class="handle"> </div><input type="checkbox"><span>item</span></li>';
	s += '</ul>';
	s += '<div class="actions"><a href="#" onclick="removeItems(\'newsc-' + section_id + '\');return false;">remove selected</a> | ';
	s += '<a href="#" onclick="addItem(\'newsc-' + section_id + '\');return false;">add item</a></div>';
	section.innerHTML = s;
	$("sections-col1").appendChild(section);
	created.include(section.id);
	created.include(item_id);
	sections.addItems($(section.id));
	sectionorder.push(section.id);
	sectionlist.addLists($('newsc-' + section_id));
	sectionlist.addItems($(item_id));
	var h2 = $(section.id).getFirst('h2');
	edit(h2);
	return section.id;
}

function check_tab(e) {
	if (editing) {
		if (editing.tagName == 'SPAN') {
			var ul = editing.getParent('ul');
			var li = editing.getParent('li');
			unedit();
			var nextli = li.getNext() || $(addItem(ul.id));
			if (nextli) {
				var spans = nextli.getElementsByTagName('span');
				if (spans) edit($(spans[0]));
			}
		} else if (editing.tagName == 'H2') {
			var ul = editing.getParent('li').getFirst('ul');
			var nextli = ul.getFirst('li');
			unedit();
			if (nextli) {
				var spans = nextli.getElementsByTagName('span');
				if (spans) edit($(spans[0]));
			}
		} else {
			unedit();
		}
		e.preventDefault();
	} else {
		unedit();
	}
}
function indent(delta) {
	if (!editing) return;
	var item = $(editing.id || editing.parentNode.id);
	var current_indent = parseInt(item.getProperty("indent")) || 0;
//	$("message").innerHTML = "ci: " + current_indent;
	var new_indent = current_indent + delta;
	if (new_indent < 0) new_indent = 0;
	if (new_indent > 4) new_indent = 4;
	if (new_indent != current_indent) {
		var eb = $("editbox");
		eb.style.left = parseInt(eb.style.left) + (delta * 30) + "px";
		eb.style.width = parseInt(eb.style.width) - (delta * 30) + "px";
//		$("message").innerHTML = "ci: " + current_indent + " ni: " + new_indent;
		item.setProperty("indent", new_indent);
		item.removeClass("indent-" + current_indent);
		if (indent) item.addClass("indent-" + new_indent);
	}
}


function check_key(e) {
	if (e.key == 'enter') unedit();
	if (e.key == 'esc') unedit(1);
	if (e.key == 'tab') check_tab(e);
	if (e.key == 'left') indent(-1);
	if (e.key == 'right') indent(1);
}

function unedit(cancel) {
	if (editing && eb) {
		if (cancel == 1) {
		} else {
			var id = editing.id || editing.parentNode.id;
			if (editing.innerHTML != eb.value) {
				editing.innerHTML = eb.value;
				if ((id != "ctitle") && (id != "descript") && (id != "readmorelink") && !created.contains(id)) changed.include(id);
			}
			if ($(id).get("tag") == "li") {
				var indent = parseInt($(id).getProperty("indent")) || 0;
				var orgindent = parseInt($(id).getProperty("orgindent")) || 0;
				if ((indent != orgindent) && !created.contains(id)) changed.include(id);
			}
		}
		eb.parentNode.removeChild(eb);
		editing = 0;
		document.removeEvent('keyup', check_key);
	}
}

function edit(obj) {
	if (editing) unedit();
	eb = new Element('input', {
		'type': 'text',
		'class': 'editbox',
		'id': 'editbox',
		'value': obj.get('text')
	});
	var c = obj.getCoordinates();
	eb.style.top = c.top - 1 + "px";
	eb.style.left = c.left - 1 + "px";
	if (obj.tagName == "SPAN" || obj.tagName == "H2") {
		var parent = obj.getParent();
		var d = parent.getCoordinates();
		eb.style.width = d.width-35 + "px";
	} else {
		eb.style.width = c.width-5  + "px";
	}
	eb.style.height = c.height - 1 + "px";
	eb.setStyles(obj.getStyles('fontFamily', 'fontSize', 'fontWeight'));
	window.document.body.appendChild(eb);
	document.addEvent('keydown', check_key);
	editing = obj;
	eb.focus();
	eb.select();
}