var dragsort = ToolMan.dragsort();
var junkdrawer = ToolMan.junkdrawer();
junkdrawer.restoreListOrder("sequence_reorder");

window.onload = function() {
	dragsort.makeListSortable(document.getElementById("sequence_reorder"), verticalOnly, saveOrder);
}

function verticalOnly(item) {
	item.toolManDragGroup.verticalOnly()
}

function saveOrder(item) {
	var group = item.toolManDragGroup
	var list = group.element.parentNode
	var id = list.getAttribute("id")
	if (id == null) return
	group.register('dragend', function() {
		ToolMan.cookies().set("list-" + id, 
				junkdrawer.serializeList(list), 365)
	})
}

/* Horizontal scrolling pose sequence */
/* 	var scrolling = 0; */
/* 	var elementheight = 82;	 */
/* 	function scroll(dir) { */
/* 		if (dir == 'stop') { */
/* 			scrolling = 0; */
/* 		} else { */
/* 			scrolling = 1; */
/* 			setTimeout("do_scroll('"+dir+"')", 250); */
/* 		} */
/* 	} */
/*  */
/* 	function do_scroll(dir) { */
/* 		var speed = 40; */
/* 		var incr = 10; */
/* 		var yjseq = document.getElementById('scroll'); */
/* 		var stop = (document.getElementById('scroll').getElementsByTagName("li").length * elementheight - 100); */
/* 		 */
/* 		if (scrolling == 1) { */
/* 			if (dir == 'up') { */
/* 				yjseq.scrollTop = yjseq.scrollTop - incr; */
/* 			}  */
/* 			if (dir == 'down') { */
/* 				if (yjseq.scrollTop < stop) { */
/* 					yjseq.scrollTop = yjseq.scrollTop + incr; */
/* 				} else { */
/* 					scrolling = 0; */
/* 					return; */
/* 				} */
/* 			} */
/* 			setTimeout("do_scroll('"+dir+"')", speed); */
/* 		} */
/* 	} */

/* Function to add a new pose to the sequence */
function add_pose(pose_id,path,sanskrit,english,level) {
	var node = document.createElement("li");
	var list = document.getElementById("sequence_reorder");
	var li_tags = list.getElementsByTagName("li");
	var count = li_tags.length + 1;
	var total = count + 1000;
	node.id = total;
	var icon;
	if (level == 1) {
		icon = '<img src="/images/pose_level_all.gif" width="17" height="17" border="0">';
	}
	if (level == 2) {
		icon = '<img src="/images/pose_level_int.gif" width="17" height="17" border="0">';
	}
	if (level == 3) {
		icon = '<img src="/images/pose_level_adv.gif" width="17" height="17" border="0">';
	}
	node.innerHTML = 
		'<table border="0" cellspacing="0" cellpadding="0" width="100%" height="111" id="pose_'+pose_id+'">'+"\n"+
			'<tr>'+"\n"+
				'<td class="pose_counter" valign="top" width="23">'+"\n"+
					'<div style="font-size: 12px">'+count+'</div>'+"\n"+
					'<div onClick="handle_safari2_quirk(\''+pose_id+'\');">'+"\n"+
						'<input type="radio" name="title_image" value="'+count+'" id="build_sequence_item_'+pose_id+'">'+"\n"+
					'</div>'+"\n"+
				'</td>'+"\n"+
				'<td class="pose_details" valign="top">'+"\n"+
					'<div class="pose_delete">'+"\n"+
						icon+"\n"+
						'<a href="Javascript:remove_pose('+total+');void(0);">'+"\n"+
							'<img src="/images/sequence_stop.gif" alt="" border="0" height="14" width="14">'+"\n"+
						'</a>'+"\n"+
					'</div>'+"\n"+
					'<div class="pose_name"><strong>'+sanskrit+'</strong><br>'+english+'</div>'+"\n"+
					'<div class="clear"><!-- --></div>'+"\n"+
					'<div class="pose_image"><img src="'+path+'" alt="" border="0"></div>'+"\n"+
					'<div class="pose_edit"><a href="#" onClick="edit_comments('+total+');return false;" '+"\n"+
						'id="popup_'+total+'" name="popup_'+total+'"><img src="/images/sequence_write_white.gif" alt="Edit comment" border="0" height="16" width="16"></a></div>'+"\n"+
					'<div class="pose_comments" id="comments_'+total+'"></div>'+"\n"+
				'</td>'+"\n"+
			'</tr>'+"\n"+
		'</table>'+"\n";
//	if (li_tags.length == 0) {
		list.appendChild(node);
//	} else {
//		list.insertBefore(node,li_tags[0]);
//	}
	dragsort.makeListSortable(document.getElementById("sequence_reorder"), saveOrder);
	after_dragsort();
}

function remove_pose(item) {
	document.getElementById('sequence_reorder').removeChild(document.getElementById(item));
}

/* Comments/Subtitle Popup Handling */
var comment_id = 0;
var is_subtitle = 0;

function edit_comments(id_num,subtitle) {
	var txt = document.getElementById('comment_field');
	var c = document.getElementById('comment_popup');
	if (subtitle) {
		txt.value = document.getElementById('subtitle').value;
		is_subtitle = 1;
		var coord = getAnchorPosition('edit_subtitle');
/* 		c.style.left = (coord.x) + 'px'; */
/* 		c.style.top = (coord.y) + 'px'; */
 		c.style.left = '512px';
 		c.style.top = '360px';
	} else {
		comment_id = id_num;
		var coord = getAnchorPosition('popup_'+id_num);
		var scr = document.getElementById('scroll').scrollTop;
		txt.value = document.getElementById('comments_'+comment_id).innerHTML;
		
		is_subtitle = 0;
		c.style.left = (coord.x - 45) + 'px';
	//	c.style.top = (coord.y + 15 - scr) + 'px';
		c.style.top = (coord.y - 140 - scr) + 'px';
	}
	c.style.visiblity = 'visible';
	c.style.display = 'block';
	c.style.zIndex = 10000;
	txt.focus()
}

function save_comment() {
	var txt = document.getElementById('comment_field');
	if (is_subtitle) {
		document.getElementById('subtitle').value = txt.value;
	} else {
		document.getElementById('comments_'+comment_id).innerHTML = txt.value;
	}
	txt.value = '';
	close_comment();
}

function close_comment() {
	var c = document.getElementById('comment_popup');
	c.style.visiblity = 'hidden';
	c.style.display = 'none';
	c.style.left = '0px';
	c.style.top = '0px';
}

// TODO: Need to renumber the list when a drag-drop is done
// TODO: Need to renumber the radio buttons when a drag-drop is done, too


/* Save Routine */
function save_prep() {
	var title = document.getElementById('titlefield').value;
	if (title == '' || !title) {
		alert('Please enter a title for your sequence.');
	} else {
		document.getElementById('frm_action').value = 'sequence_save';
		document.getElementById('frm').target = '';
		document.getElementById('frm').action = '/poses/sequence_builder/';
		_add_custom();
		document.getElementById('save_poses').value = get_pose_ids('scroll');
		document.getElementById('save_comments').value = get_comments('scroll','pose_comments');
		document.getElementById('frm').submit();
	}
}

function delete_prep() {
	if (confirm('Are you sure you want to delete this sequence? You cannot undo this action.')) {
		document.getElementById('frm_action').value = 'sequence_delete';
		document.getElementById('frm').target = '';
		document.getElementById('frm').action = '/poses/sequence_builder/';
		_add_custom();
		document.getElementById('frm').submit();
	}
}

function print_prep() {
	// What the hell is this? I'll remove it and see what happens.
	document.getElementById('frm_action').value = 'sequence_print';
	document.getElementById('frm').target = '_blank';
	document.getElementById('frm').action = '/poses/sequence_builder/print_sequence/';
	_add_custom();
	document.getElementById('save_poses').value = get_pose_ids('scroll');
	document.getElementById('save_comments').value = get_comments('scroll','pose_comments');
	document.getElementById('force_print').value = 1;
	document.getElementById('frm').submit();
}

/* Make a temporary copy of the sequence so it can be restored once the user logs in */
function save_anonymous_prep(where) {
	document.getElementById('frm_action').value = 'sequence_save_anonymous';
	document.getElementById('frm').target = '';
	if(where == 'login'){
		document.getElementById('frm').action = '/community/my_yoga_journal/log_in';
	}
	else{
		document.getElementById('frm').action = '/community/my_yoga_journal/sign_me_up';
	}
	_add_custom();
	document.getElementById('save_poses').value = get_pose_ids('scroll');
	document.getElementById('save_comments').value = get_comments('scroll','pose_comments');
	document.getElementById('frm').submit();
}

function _add_custom() {
	var node = document.createElement("input");
	node.type = 'hidden';
	node.name = 'action';
	node.value ='custom';
	document.getElementById('frm').appendChild(node);
}

function edit_sequence(obj) {
	if (obj.selectedIndex != null && obj.selectedIndex != '') {
		var id = obj.options[obj.selectedIndex].value;
		
		if (id != '') {		
			window.location = '?action=custom&yj=sequence_view&id='+id;
		}
	}
}

function after_dragsort() {
	var list = document.getElementById("sequence_reorder");
	var li_tags = list.getElementsByTagName("li");
	for (i = 0; i <= li_tags.length-1 ; i++) {
		var td_tags = li_tags[i].getElementsByTagName("td");
		td_tags[0].getElementsByTagName("div")[0].innerHTML = i+1;
		td_tags[0].getElementsByTagName("input")[0].value = i+1;
	}
}

function show_help(v, element) {
	if (v == 1) {
		document.getElementById(element).style.visibility = 'visible';
		document.getElementById(element).style.display = 'block';
	} else {
		document.getElementById(element).style.visibility = 'hidden';
		document.getElementById(element).style.display = 'none';
	}
}

/* 
Since Safari 2 can't detect clicks in radio buttons inside the draggable list, check for onClick 
inside an enclosing div instead 
*/
function handle_safari2_quirk(sequence_item_id) {
	if(!safari_lt_3) return;
	if(!document.getElementById('build_sequence_item_'+sequence_item_id)) return;
	document.getElementById('build_sequence_item_'+sequence_item_id).checked = true;
}
