//--------------------------------------------------------------------------------
// code for determining the type of browser - found in autosuggest.js
// code for dragging - found in core.js

//--------------------------------------------------------------------------------
// show the given rollup window

function vdb_show_rollup_window (id) {

	document.getElementById ('vdb_rollup_content_' + id).style.display = 'inline';
	document.getElementById ('vdb_rollup_button_'  + id).innerHTML = '\u25B2';

	// reset the drag
	var bResetDrag = (id == 'pokemon') || (id == 'trainer') || (id == 'energy');
	if (bResetDrag)
		vdb_reset_drag (id);

} //function

//--------------------------------------------------------------------------------
// hide the given rollup window

function vdb_hide_rollup_window (id) {

	document.getElementById ('vdb_rollup_content_' + id).style.display = 'none';
	document.getElementById ('vdb_rollup_button_'  + id).innerHTML = '\u25BC';

} //function

//--------------------------------------------------------------------------------
// toggle the given rollup window

function vdb_toggle_rollup_window (id) {

	if (document.getElementById ('vdb_rollup_content_' + id).style.display == 'none')
		vdb_show_rollup_window (id);
	else
		vdb_hide_rollup_window (id);

} //function

//--------------------------------------------------------------------------------
// create rollup window html
function vdb_create_rollup_window (id, title, border, color, content) {

	var html = '';

	// start the rollup window
	html += '<div id="vdb_rollup_' + id + '" style="font-size:12px; border:' + border + '; margin:3px;">';

	// create the window top
	html +=
		'<div id="vdb_rollup_title_' + id + '" style="color:white; background-color:' + color + '; font-weight:bold; border-bottom:1px solid ' + color + '; padding:3px; white-space:nowrap;">' +
			'<a id="vdb_rollup_button_' + id + '" href="javascript:vdb_toggle_rollup_window(\'' + id + '\')"' +
			' style="text-decoration:none; color:white; border:1px solid transparent;"' +
			' onmouseover="this.style.borderColor=\'black\'" onmouseout="this.style.borderColor=\'transparent\'">' +
			'\u25B2</a>&nbsp;' + title +
			'</div>';

	// start the window body
	html += '<div id="vdb_rollup_content_' + id + '" style="background-color:white;">' + content + '</div>';

	// close the rollup window
	html += '</div>';

	return (html);

} //function

//--------------------------------------------------------------------------------
// toggle the size of the main window

function vdb_toggle_size () {

	var size_button = document.getElementById ('vdb_window_size');
	var main_window = document.getElementById ('vdb_main');
	if (size_button.value == '<') {
		vdb_cancel_resize = true;
		size_button.value = '>';
		main_window.style.width = '650px';
	} //if
	else {
		vdb_cancel_resize = false;
		size_button.value = '<';
		main_window.style.width = '100%';
	} //else
	vdb_reset_drag_all();

} //function

//--------------------------------------------------------------------------------
// create the main container divs

function vdb_create_main_divs () {

	return (
	'<div id="vdb_main" style="display:none; border:2px solid black; font-family:verdana,arial,helvetica; width:100%;">' +
		'<table cellspacing="0" cellpadding="5" style="width:100%; background-color:yellow; font-weight:bold; font-size:14px;">' +
			'<tr valign="middle">' +
			'<td style="width:100%; white-space:nowrap; border-bottom:1px solid #CCCCCC;">' +
				(winpic_html ? winpic_html : '<img src="' + vdb_images_loc + 'pokeball.gif" />') + ' Visual Deck Builder - ' +
				'<span id="vdb_span_title" style="font-size:11px; font-weight:normal; white-space:normal;"></span></td>' +
			'<td style="white-space:nowrap; border-bottom:1px solid #CCCCCC;"><input id="vdb_window_size" type="button" value="<" onclick="javascript:vdb_toggle_size()"' +
				' style="background-color:gold; color:gray; width:30px; font-family:verdana,arial,helvetica; font-size:10px; font-weight:bold;" />' +
				'<input type="button" value="X" onclick="javascript:vdb_file_exit()"' +
				' style="background-color:red; color:white; width:30px; font-family:verdana,arial,helvetica; font-size:10px; font-weight:bold;" /></td>' +
			'</tr>' +
			'<tr><td colspan="2" id="vdb_td_menu" style="background-color:#FFFFCC; border-bottom:1px solid gray;"></td></tr></table>' +

		'<div id="vdb_div_cards">' +
			vdb_create_rollup_window ('pokemon', 'Pokemon', '2px solid red', 'red',
				'<div id="vdb_div_cards_pokemon">&nbsp;</div>') +
			vdb_create_rollup_window ('trainer', 'Trainer/Supporter/Stadium', '2px solid green', 'green',
				'<div id="vdb_div_cards_trainer">&nbsp;</div>') +
			vdb_create_rollup_window ('energy', 'Energy', '2px solid blue', 'blue',
				'<div id="vdb_div_cards_energy">&nbsp;</div>') +
		'</div>' +

	'</div>');

} //function

//--------------------------------------------------------------------------------
// display the controls

function vdb_display_controls () {

	// slider cursor image
	var img_src = vdb_images_loc + 'pokeball.gif';
	var img_w   = 12;
	var img_h   = 12;

	var style_button = ' style="' +
		'display:inline;' +
		'margin:0px;' +
		'padding:0px;' +
		'text-align:center;' +
		'vertical-align:middle;' +
		'width:12px;' +
		'height:12px;' +
		'background-color:#CCCCCC;"';

	var style_table = ' style="' +
		'display:' + (is_msie ? 'inline' : 'inline-table') + ';' +
		'margin:3px;' +
		'border:1px solid black;' +
		'background-color:#FFFFCC;' +
		'vertical-align:top;' +
		'font-size:1px;"';

	var style_ftr = ' style="' +
		'text-align:center;' +
		'font-family:verdana,arial,helvetica;' +
		'font-size:12px;' +
		'border-top:1px solid black;' +
		'background-color:yellow;' +
		'padding:3px;"';

	var style_hdr = ' style="' +
		'text-align:center;' +
		'font-family:verdana,arial,helvetica;' +
		'font-size:12px;' +
		'border-bottom:1px solid black;' +
		'background-color:yellow;' +
		'padding:3px;"';

	menu_button_style = ' style="background-color:lightblue; font-family:verdana,arial,helvetica; font-size:10px; margin:0px 3px 0px 3px;"';

	//---------------------
	function options (id) {
		var html = 'Align: <select id="vdb_align_' + id + '" onchange="vdb_re_fan_all();vdb_reset_drag_all();">' +
			'<option value="" selected="selected">Default</option>' +
			'<option value="top">Top</option>' +
			'<option value="bottom">Bottom</option>' +
			'</select>';
		return ('<td colspan="3"' + style_ftr + '>' + html + '</td>');
	} //function

	//--------------------------
	function button (id, x, y) {
		return ('<th><input type="button" onclick="vdb_adj_fan(\'vdb_' + id + '\',' + x + ',' + y + ')"' + style_button + ' /></th>');
	} //function

	//--------------------
	function slider (id) {
		// add in border sides for MSIE
		var style_w = 'width:'  + (2*vdb_max_fanX + img_w) + 'px;';
		var style_h = 'height:' + (2*vdb_max_fanY + img_h) + 'px;';
		return ('<th><div id="vdb_div_slider_' + id + '"' +
			' style="' + style_w + style_h +
			' border:1px solid black; background-color:white; text-align:left;">' +
			'<img id="vdb_' + id + '" src="' + img_src + '" style="position:relative;' +
			' left:' + vdb_max_fanX + 'px; top:' + vdb_max_fanY + 'px;' +
			' width:' + img_w + 'px; height:' + img_h + 'px;" /></div></th>');
	} //function

	//----------------------------
	function control (id, title) {
		return ('<table cellpadding="0" cellspacing="0"' + style_table + '>'+
			'<th colspan="3"' + style_hdr + '>' + title + '</th>' +
			'<tr>' + button (id, -1, -1) + button (id, 0, -1) + button (id, 1, -1) + '</tr>' +
			'<tr>' + button (id, -1,  0) + slider (id)        + button (id, 1,  0) + '</tr>' +
			'<tr>' + button (id, -1,  1) + button (id, 0,  1) + button (id, 1,  1) + '</tr>' +
			'<tr>' + options (id) + '</tr>' +
			'</table>');
	} //function

	//-------------------------
	var deck_title =
		'<table cellspacing="0" cellpadding="0"' +
			' style="border:1px solid black; padding:3px; font-family:verdana,arial,helvetica; font-size:12px; font-weight:normal;' +
				' background-color:#FFFFCC; width:100%; margin-bottom:5px;">' +
		'<tr><td>Title:&nbsp;&nbsp;</td><td style="width:99%;">' +
			'<input type="text" value="" id="vdb_deck_title_input" style="width:97%;"' +
			' onchange="javascript:vdb_update_deck_title();vdb_dirty=true;"' +
			' onkeydown="if (event.keyCode == 13) event.keyCode = 9" /></td></tr>';
		'</table>';

	//-------------------------
	var card_totals =
		'<table cellspacing="0" cellpadding="0"' +
			' style="border:1px solid black; padding:3px; font-family:verdana,arial,helvetica; font-size:12px; font-weight:normal; background-color:#FFFFCC;">' +
		'<tr style="color:red;"><td>Pokemon:&nbsp;&nbsp;</td><td id="vdb_count_pokemon" align="right">0</td></tr>' +
		'<tr style="color:green;"><td>Trainer/Supp/Stad:&nbsp;&nbsp;</td><td id="vdb_count_trainer" align="right">0</td></tr>' +
		'<tr style="color:blue;"><td>Energy:&nbsp;&nbsp;</td><td id="vdb_count_energy" align="right">0</td></tr>' +
		'<tr><td colspan="2"><hr /><td><tr>' +
		'<tr style="color:black;"><th align="left">Total Cards:&nbsp;&nbsp;</th><th id="vdb_count_total" align="right">0</th></tr>' +
		'</table>';

	//-------------------------
	var deck_info = deck_title + card_totals;

	//-------------------------
	function auto_sugg (type) {
		var color = '';
		var title = '';
		var font  = ' font-family:verdana,arial,helvetica; font-size:12px;';
		switch (type) {
			case 'pokemon':  color = ' color:red;'  ;  title = 'Pokemon:';  break;
			case 'trainer':  color = ' color:green;';  title = 'Trainer:';  break;
			case 'energy' :  color = ' color:blue;' ;  title = 'Energy:' ;  break;
			default:;
		} //switch
		var html = '';
		html +=
			'<td style="white-space:nowrap;"><input id="vdb_card_' + type + '" type="text" style="width:300px;" />' +
				'<input id="vdb_info_' + type + '" type="text" disabled="disabled" style="width:60px; background-color:white;" /></td>' +
			'<td><input id="vdb_add_' + type + '" type="button" value="Add" onclick="vdb_add_card(this.id)"' + menu_button_style + ' /></td>' +
			'<input id="vdb_note_' + type + '" type="hidden" value="" /><input id="vdb_img_' + type + '" type="hidden" value="" />';
		return ('<tr><td style="' + color + font + ' text-align:right;">&nbsp;' + title + '</td>' + html + '</tr>');
	} //function

	//--------------------
	function add_card () {
		var html =
			'<form id="vdb_add_card_form" style="display:inline;"><table cellpadding="3" cellspacing="0"' + style_table + '>' +
			auto_sugg ('pokemon') +
			auto_sugg ('trainer') +
			auto_sugg ('energy' ) +
			//auto_sugg ('total'  ) +
			'</table></form>';
		return (html);
	} //function

	//---------------------
	function favorites () {
		var html = '<div id="vdb_div_cards_fav">&nbsp;</div>';
		return (html);
	} //function

	//---------------------
	function trash () {
		var html = '<div id="vdb_div_cards_trash">&nbsp;</div>';
		return (html);
	} //function

	// create the "favorite" decks selection list
	var fav_decks_list ='<select id="vdb_fav_decks_list" style="width:100%;"' +
		' onchange="javascript:vdb_load_fav_data(\'\',this.selectedIndex+1);vdb_display_cards_fav();"></select>';

	// create the "open" decks selection list
	var open_decks_list ='<select id="vdb_open_decks_list" style="min-width:100%;"' +
		' onchange="javascript:vdb_file_open(this.selectedIndex+1);"></select>';

	// create the "empty" trash button
	var empty_button = '<input type="button" value="Empty"' + menu_button_style +
		' onclick="javascript:vdb_empty_trash();" />';

	// create the "default" fanning button
	var default_fan_button = '<input type="button" value="Default"' + menu_button_style +
		' onclick="javascript:' +
			'document.getElementById(\'vdb_align_img\').value=\'\';vdb_set_fan(\'vdb_img\',0,-10);' +
			'document.getElementById(\'vdb_align_img5\').value=\'\';vdb_set_fan(\'vdb_img5\',-10,0);" />';

	// create the "clear" button and "merge dups" checkbox for "add new cards" window
	var add_card_controls = 
		'<input type="reset" value="Clear"' + menu_button_style + ' onclick="javascript:' +
			'document.getElementById(\'vdb_add_card_form\').reset();' +
			'document.getElementById(\'vdb_img_pokemon\').value=\'\';' +
			'document.getElementById(\'vdb_img_trainer\').value=\'\';' +
			'document.getElementById(\'vdb_img_energy\').value=\'\';" />' +
		'<input id="vdb_ctrl_merge_dups" type="checkbox" checked="checked" style="margin-left:30px;" />' +
		'<span style="font-family:verdana,arial,helvetica; font-size:10px;"> Merge Duplicates</span>';

	// width of "add new cards" window
	var add_card_width = (is_msie7 ? 516 : is_msie ? 528 : is_firefox ? 526 : is_safari ? 517 : 526);

	create_window_drag ('vdb_open',  'Open',      300, open_decks_list, '&nbsp;');
	create_window_drag ('vdb_info',  'Deck Info', 300, '&nbsp;', deck_info);
	create_window_drag ('vdb_fav',   'Favorites', 334, fav_decks_list, favorites());
	create_window_drag ('vdb_trash', 'Trash',     334, empty_button, trash());
	create_window_drag ('vdb_fan',   'Fan Cards', 322, default_fan_button, control ('img','1-4 Cards') + control ('img5','5+ Cards'));
	create_window_drag ('vdb_add',   'Add Cards', add_card_width, add_card_controls, add_card());

	// create the control buttons
	var td_menu = document.getElementById ('vdb_td_menu');
	td_menu.innerHTML = vdb_create_menu();

	// create the slider functionality
	dragObject ('vdb_img',  null, new Position (0, 0), new Position (2*vdb_max_fanX, 2*vdb_max_fanY), null, vdb_re_fan_all, vdb_reset_drag_all);
	dragObject ('vdb_img5', null, new Position (0, 0), new Position (2*vdb_max_fanX, 2*vdb_max_fanY), null, vdb_re_fan_all, vdb_reset_drag_all);

	// connect the auto-suggestion controls
	vdb_connect ('pokemon');
	vdb_connect ('trainer');
	vdb_connect ('energy' );

} //function

//--------------------------------------------------------------------------------
// create the VDB menu (styles and main code found in core.js)

function vdb_create_menu () {

	return (
	'<table id="vdb_menu_table" align="left" style="border-collapse:collapse; padding:0px;"><tr>' +
	'<td><div class="horizontalcssmenu">' +
		'<ul id="vdb_css_menu">' +
		'<li style="border-left: 1px solid #202020;"><a href="javascript:do_nothing();" tabindex="-1">File</a>' +
			'<ul>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',0);vdb_file_new();">New</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',0);show_window_drag(\'vdb_open\');">Open</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',0);vdb_file_save();">Save</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',0);vdb_file_exit();">Exit</a></li>' +
			'</ul>' +
		'</li>' +
		'<li><a href="javascript:do_nothing();" tabindex="-1">Edit</a>' +
			'<ul>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',1);vdb_file_clear();">Clear</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',1);vdb_file_copy();">Copy</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',1);vdb_file_delete();">Delete</a></li>' +
			'</ul>' +
		'</li>' +
		'<li><a href="javascript:do_nothing();" tabindex="-1">View</a>' +
			'<ul>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',2);show_window_drag(\'vdb_info\');">Deck Info</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',2);show_window_drag(\'vdb_add\');">Add Cards</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',2);show_window_drag(\'vdb_fav\');">Favorites</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',2);show_window_drag(\'vdb_trash\');">Trash</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',2);show_window_drag(\'vdb_fan\');">Fan Cards</a></li>' +
			'<li><a href="javascript:hide_menu_item(\'vdb_css_menu\',2);vdb_hide_window_drag_all();">Close All</a></li>' +
			'</ul>' +
		'</li>' +
		'</ul>' +
	'</div></td>' +
	'</tr></table>');

} //function

//--------------------------------------------------------------------------------
// query to save first

function vdb_query_save (msg) {

	if (vdb_dirty)
		if (confirm ('Save changes? (Cancel = NO)')) {
			vdb_file_save();
			vdb_dirty = false;
			return true;
		} //if
		else if (confirm (msg)) {
			vdb_dirty = false;
			return true;
		} //else if
		else
			return false;
	else
		return true;

} //function

//--------------------------------------------------------------------------------
// clear the deck

function vdb_file_clear () {

	if (!confirm ('Clear the deck? (Cancel = NO)'))  return;

	// bug fix - must show rollups first
	for (var type in vdb_cards)  vdb_show_rollup_window (type);

	// re-initialize the cards
	vdb_cards = {'pokemon':[], 'trainer':[], 'energy':[]};
	vdb_display_cards_all();

	vdb_dirty = true;

} //function

//--------------------------------------------------------------------------------
// copy the current deck

function vdb_file_copy () {

	if (!vdb_query_save('Lose changes? (Cancel = NO)'))  return;

	if (!copy_deck (true))  return;

	// bug fix - must show rollups first
	for (var type in vdb_cards)  vdb_show_rollup_window (type);

	// re-initialize the cards
	vdb_cards = {'pokemon':[], 'trainer':[], 'energy':[]};
	vdb_fill_decks_list();
	vdb_load_deck_data();
	vdb_display_cards_all();

} //function

//--------------------------------------------------------------------------------
// delete the current deck

function vdb_file_delete () {

//	if (!vdb_query_save('Lose changes? (Cancel = NO)'))  return;

	if (!del_deck (deck_num, true))  return;

	// bug fix - must show rollups first
	for (var type in vdb_cards)  vdb_show_rollup_window (type);

	// re-initialize the cards
	vdb_cards = {'pokemon':[], 'trainer':[], 'energy':[]};
	vdb_fill_decks_list();
	vdb_load_deck_data();
	vdb_display_cards_all();

} //function

//--------------------------------------------------------------------------------
// create a new empty deck

function vdb_file_new () {

	if (!vdb_query_save('Lose changes? (Cancel = NO)'))  return;

	if (!add_deck (true))  return;

	// bug fix - must show rollups first
	for (var type in vdb_cards)  vdb_show_rollup_window (type);

	// re-initialize the cards
	vdb_cards = {'pokemon':[], 'trainer':[], 'energy':[]};
	vdb_fill_decks_list();
	vdb_load_deck_data();
	vdb_display_cards_all();

} //function

//--------------------------------------------------------------------------------
// open the given deck number or the current deck number

function vdb_file_open (num) {

	if (!vdb_query_save('Lose changes? (Cancel = NO)')) {
		document.getElementById('vdb_open_decks_list').selectedIndex = deck_num-1;
		return;
	} //if

	if (num)  get_deck (num, true);  else  document.getElementById('vdb_open_decks_list').selectedIndex = deck_num-1;

	// bug fix - must show rollups first
	for (var type in vdb_cards)  vdb_show_rollup_window (type);

	// re-initialize the cards
	vdb_cards = {'pokemon':[], 'trainer':[], 'energy':[]};
	vdb_load_deck_data();
	vdb_display_cards_all();

} //function

//--------------------------------------------------------------------------------
// save the current deck

function vdb_file_save () {

	vdb_save_deck_data();
	vdb_dirty = false;

} //function

//--------------------------------------------------------------------------------
// exit the vdb

function vdb_file_exit () {

	if (!vdb_query_save('Exit the VDB without saving? (Cancel = NO)'))  return;
	vdb_hide();

} //function

//--------------------------------------------------------------------------------
// set the given slider image position position to the given position, then re-fan all

function vdb_set_fan (img_id, x, y) {

	with (document.getElementById (img_id).style) {

		left = Math.max (0, Math.min (2*vdb_max_fanX, vdb_max_fanX + x)) + 'px';
		top  = Math.max (0, Math.min (2*vdb_max_fanY, vdb_max_fanY + y)) + 'px';

	} //with

	vdb_re_fan_all();
	vdb_reset_drag_all();

} //function

//--------------------------------------------------------------------------------
// adjust the given slider image position position by the given sizes, then re-fan all

function vdb_adj_fan (img_id, x, y) {

	with (document.getElementById (img_id).style) {

		left = Math.max (0, Math.min (2*vdb_max_fanX, parseInt (left) + x)) + 'px';
		top  = Math.max (0, Math.min (2*vdb_max_fanY, parseInt (top ) + y)) + 'px';

	} //with

	vdb_re_fan_all();
	vdb_reset_drag_all();

} //function

//--------------------------------------------------------------------------------
// add a card of the specified type;

function vdb_add_card (id) {

	var card_id  = id.split ('_');
	var is_fav   = (card_id[1] == 'fav');
	var is_trash = (card_id[1] == 'trash');
	var type     = card_id[2];

	var card = info = note = img = '';
	var qty  = 1;

	if (is_fav) {

		var index = card_id[3];
		card = vdb_cards_fav[type][index].data.name;
		info = vdb_cards_fav[type][index].data.info;
		note = vdb_cards_fav[type][index].data.note;
		img  = vdb_cards_fav[type][index].fan.sSrc;
		qty  = vdb_cards_fav[type][index].fan.iNum;

	} // if

	else if (is_trash) {

		var index = card_id[3];
		card = vdb_cards_trash[type][index].data.name;
		info = vdb_cards_trash[type][index].data.info;
		note = vdb_cards_trash[type][index].data.note;
		img  = vdb_cards_trash[type][index].fan.sSrc;
		qty  = vdb_cards_trash[type][index].fan.iNum;

	} // if

	else {

		card = document.getElementById ('vdb_card_' + type).value;
		info = document.getElementById ('vdb_info_' + type).value;
		note = document.getElementById ('vdb_note_' + type).value;
		img  = document.getElementById ('vdb_img_'  + type).value;
		qty  = 1;

	} // else


	if (img) {

		// force open the rollup window (safari bug)
		vdb_show_rollup_window (type);

		vdb_dirty = true;

		// check to increment existing card
		if (document.getElementById ('vdb_ctrl_merge_dups').checked)
		for (var i=0;  i<vdb_cards[type].length;  i++)
			if (img == vdb_cards[type][i].fan.sSrc) {
				vdb_adj_num (vdb_cards[type][i].fan.sId, qty);
				vdb_display_card_counts();
				return;
			} //if

		// add new card
		var index = vdb_cards[type].length;
		vdb_cards[type].push ({
			'data' : { 'name' : card, 'info' : info, 'note' : note},
			'fan'  : new cls_fan_img ('vdb_card_' + type + '_' + index, img, qty, vdb_iWidth, vdb_iHeight, 0, 0, vdb_iBorder, ''),
			'drag' : null});
		vdb_display_cards (type);
		vdb_display_card_counts();

	} //if

} //function

//--------------------------------------------------------------------------------
// display the card counts

function vdb_display_card_counts () {

	var total = 0;
	for (var type in vdb_cards) {
		var count = 0;
		for (var i=0;  i<vdb_cards[type].length;  i++)
			count += vdb_cards[type][i].fan.iNum;
		document.getElementById ('vdb_count_' + type).innerHTML = count;
		total += count;
	} //for
	document.getElementById ('vdb_count_total').innerHTML = total;

} //function

//--------------------------------------------------------------------------------
// fan the given image

function cls_fan_img (sId, sSrc, iNum, iWidth, iHeight, iFanX, iFanY, iBorder, sValign) {

	this.sId       = sId;
	this.sSrc      = sSrc;
	this.iNum      = iNum;
	this.iWidth    = iWidth;
	this.iHeight   = iHeight;
	this.iFanX     = iFanX;
	this.iFanY     = iFanY;
	this.iBorder   = iBorder;
	this.sValign   = sValign;

	// get the width/height
	this.get_width  = function () { return ((this.iWidth  + Math.abs(this.iFanX) * (this.iNum-1) + 2*this.iBorder) + 'px') };
	this.get_height = function () { return ((this.iHeight + Math.abs(this.iFanY) * (this.iNum-1) + 2*this.iBorder) + 'px') };

	// return the fanned image margin setting (first is different)
	this.get_margin = function (index) {

		var iLeft = index == 0
			? (this.iFanX < 0 ? -this.iFanX * (this.iNum-1) : 0)
			: (this.iFanX < 0 && is_msie7 ? index : 1) * this.iFanX - this.iWidth - 2*this.iBorder;

		var iBottom = index == 0
			? (this.iFanY > 0 ? this.iFanY * (this.iNum-1) : 0)
			: (this.iFanY > 0 ? this.iNum-1-index : -index) * this.iFanY;

		return ('0px 0px ' + iBottom + 'px ' + iLeft + 'px');

	} //function

	// generate the html for these settings
	this.get_html = function () {

		var html = '';

		// different display style for IE
		var sDisplay = (is_msie ? ' display:inline;' : ' display:inline-table;') + ' z-index:1;';

		// set the alignment
		var align = (this.sValign ? this.sValign : this.iFanY <= 0 ? 'top' : 'bottom');

		// set the table container styles
		var sDimension   = ' width:' + this.get_width() + '; height:' + this.get_height();
		var sPosition    = ' position:relative; padding:5px; vertical-align:' + align + ';';
		var sBorder      = ' border:1px solid #CCCCCC;';
		var sStyle       = ' style="' + sDisplay + sPosition + sBorder + '"';

		// start the table container
		html += '<table id="' + this.sId + '" cellspacing="0" cellpadding="0"' + sStyle + '<tr><td style="' + sDimension + '">';

		// same settings for all images
		sBorder    = ' border:' + this.iBorder + 'px solid black;';
		sDimension = ' width:' + this.iWidth + 'px; height:' + this.iHeight + 'px;';
		sDisplay   = ' display:inline; z-index:1;';

		// create the fanned images
		for (var i=0;  i<this.iNum;  i++) {

			var sMargin = ' margin:' + this.get_margin(i) + ';';
			var sStyle = ' style="' + sDisplay + sDimension + sMargin + sBorder + '"';
			var sImage = '<img src="' + this.sSrc + '"' + sStyle  + ' />';

			html += sImage;

		} //for

		// end the table container
		html += '</td></tr></table>';

		return html;

	} //function

	// create an image node
	this.create_img_node = function () {

		var img = document.createElement ('img');

		img.src = this.sSrc;

		img.style.display = 'inline';
		img.style.zIndex = 1;
		img.style.width = this.iWidth + 'px';
		img.style.height = this.iHeight + 'px';
		img.style.border = this.iBorder + 'px solid black';

		return (img);

	} //function

	// get the main fan object (returns null if not rendered yet)
	this.get_fan_obj = function () {
		return  document.getElementById (this.sId);
	} //function

	// get the parent node of the images (assume fanned images already rendered)
	this.get_img_parent = function () {
		return  this.get_fan_obj().firstChild.firstChild.firstChild;
	} //function

	// re-align the image container
	this.re_align = function (a) {

		this.sValign = a;

		// re-align the fanned object
		var align = (this.sValign ? this.sValign : this.iFanY <= 0 ? 'top' : 'bottom');
		this.get_fan_obj().style.verticalAlign = align;

	} //function

	// re-adjust the image container after changing the fanning and number count
	this.re_adjust = function () {

		var img_parent = this.get_img_parent();

		// re-adjust the dimensions (assume fanned images already rendered)
		img_parent.style.width  = this.get_width ();
		img_parent.style.height = this.get_height();

		// re-adjust the margins
		for (var i=0;  i<img_parent.childNodes.length;  i++) {
			img_parent.childNodes[i].style.margin = this.get_margin (i);
		} //for

	} //function

	// re-number the images
	this.re_number = function (n) {

		this.iNum = n;

		var img_parent = this.get_img_parent();

		// remove/create images if needed
		var n_nodes = img_parent.childNodes.length;
		if (this.iNum < n_nodes)
			for (var i=n_nodes;  i>this.iNum;  i--)
				img_parent.removeChild (img_parent.childNodes[i-1]);
		else if (this.iNum > n_nodes)
			for (var i=n_nodes;  i<this.iNum;  i++)
				img_parent.appendChild (this.create_img_node());
		else  {}

		this.re_adjust();

	} //function

	// re-fan the images with the given fan settings
	this.re_fan = function (x, y) {

		this.iFanX = x;
		this.iFanY = y;

		this.re_adjust();

	} //function

	// re-size the images after changing dimension
	this.re_size = function (w, h) {

		this.iWidth  = w;
		this.iHeight = h;

		var img_parent = this.get_img_parent();

		// re-draw the images
		for (var i=0;  i<img_parent.childNodes.length;  i++) {
			img_parent.childNodes[i].style.width  = this.iWidth  + 'px';
			img_parent.childNodes[i].style.height = this.iHeight + 'px';
		} //for

		this.re_adjust();

	} //function

	// re-draw all elements after manually changing any/all settings
	this.re_draw = function () {

		var img_parent = this.get_img_parent();

		// re-draw the images
		for (var i=0;  i<img_parent.childNodes.length;  i++) {
			img_parent.childNodes[i].src = this.sSrc;
			img_parent.childNodes[i].style.width  = this.iWidth  + 'px';
			img_parent.childNodes[i].style.height = this.iHeight + 'px';
			img_parent.childNodes[i].style.border = this.iBorder + 'px solid black';
		} //for

		// remove/create images if needed
		var n_nodes = img_parent.childNodes.length;
		if (this.iNum < n_nodes)
			for (var i=n_nodes;  i>this.iNum;  i--)
				img_parent.removeChild (img_parent.childNodes[i-1]);
		else if (this.iNum > n_nodes)
			for (var i=n_nodes;  i<this.iNum;  i++)
				img_parent.appendChild (this.create_img_node());
		else  {}

		this.re_adjust();

		// re-align last
		this.re_align (this.sValign);

	} //function

} //function

//--------------------------------------------------------------------------------
// utility functions for converting between fan and relative css coordinates

function vdb_xFanPos(x) { return (x - vdb_max_fanX) }
function vdb_yFanPos(y) { return (y - vdb_max_fanY) }
function vdb_xRelPos(x) { return (x + vdb_max_fanX) }
function vdb_yRelPos(y) { return (y + vdb_max_fanY) }

//--------------------------------------------------------------------------------
// re-fan a specific card after adjustments

function vdb_re_fan_one (type, index) {

	var sImg = (vdb_cards[type][index].fan.iNum < 5 ? 'img' : 'img5');

	var img = document.getElementById ('vdb_' + sImg);

	var fanx = vdb_xFanPos (parseInt (img.style.left));
	var fany = vdb_yFanPos (parseInt (img.style.top ));

	var align = document.getElementById ('vdb_align_' + sImg).value;

	vdb_cards[type][index].fan.re_fan (fanx, fany);
	vdb_cards[type][index].fan.re_align (align);  //re-align last

} //function

//--------------------------------------------------------------------------------
// re-fan the cards of the given type after adjustments

function vdb_re_fan (type) {

	var img  = document.getElementById ('vdb_img' );
	var img5 = document.getElementById ('vdb_img5');

	var x  = vdb_xFanPos (parseInt (img .style.left));
	var y  = vdb_yFanPos (parseInt (img .style.top ));
	var x5 = vdb_xFanPos (parseInt (img5.style.left));
	var y5 = vdb_yFanPos (parseInt (img5.style.top ));

	sAlign  = document.getElementById ('vdb_align_img' ).value;
	sAlign5 = document.getElementById ('vdb_align_img5').value;

	for (var i=0;  i<vdb_cards[type].length;  i++) {

		var num = vdb_cards[type][i].fan.iNum;

		var fanx  = (num < 5 ? x   : x5);
		var fany  = (num < 5 ? y   : y5);
		var align = (num < 5 ? sAlign : sAlign5);

		vdb_cards[type][i].fan.re_fan (fanx, fany);
		vdb_cards[type][i].fan.re_align (align);  //re-align last

	} //for

} //function

//--------------------------------------------------------------------------------
// re-fan all the cards after adjustments

function vdb_re_fan_all () {

	var img  = document.getElementById ('vdb_img' );
	var img5 = document.getElementById ('vdb_img5');

	var x  = vdb_xFanPos (parseInt (img .style.left));
	var y  = vdb_yFanPos (parseInt (img .style.top ));
	var x5 = vdb_xFanPos (parseInt (img5.style.left));
	var y5 = vdb_yFanPos (parseInt (img5.style.top ));

	sAlign  = document.getElementById ('vdb_align_img' ).value;
	sAlign5 = document.getElementById ('vdb_align_img5').value;

	for (var type in vdb_cards) {

		for (var i=0;  i<vdb_cards[type].length;  i++) {

			var num = vdb_cards[type][i].fan.iNum;

			var fanx  = (num < 5 ? x   : x5);
			var fany  = (num < 5 ? y   : y5);
			var align = (num < 5 ? sAlign : sAlign5);

			vdb_cards[type][i].fan.re_fan (fanx, fany);
			vdb_cards[type][i].fan.re_align (align);  //re-align last

		} //for

	} //for

} //function

//--------------------------------------------------------------------------------
// reset the drag objects for the given type

function vdb_reset_drag (type) {

	var div_type = document.getElementById ('vdb_div_cards_' + type);
	var div_left = vdb_getLeft (div_type);
	var div_top  = vdb_getTop  (div_type);
	var div_borderWidth = parseInt (div_type.style.borderWidth);
	if (isNaN (div_borderWidth))  div_borderWidth = 0;

	for (var i=0;  i<vdb_cards[type].length;  i++) {

		var card_set = document.getElementById (vdb_cards[type][i].fan.sId);

		// BUG - workaround until bug is found
		if (!card_set)  continue;

		card_set.onmouseover = function() {
			if (vdb_is_dragging) return;
			this.style.cursor = 'move';
			document.getElementById('vdb_adj_info').href = "javascript:vdb_adj_num('" + this.id + "','i')";
			document.getElementById('vdb_adj_add' ).href = "javascript:vdb_adj_num('" + this.id + "',+1)";
			document.getElementById('vdb_adj_sub' ).href = "javascript:vdb_adj_num('" + this.id + "',-1)";
			document.getElementById('vdb_adj_del' ).href = "javascript:vdb_adj_num('" + this.id + "','x')";
			document.getElementById('vdb_adj_addf').style.display = 'none';
			document.getElementById('vdb_adj_add' ).style.display = 'inline';
			document.getElementById('vdb_adj_sub' ).style.display = 'inline';
			document.getElementById('vdb_adj_del' ).style.display = 'inline';
			var div_adj_num = document.getElementById('vdb_div_adj_num');
			div_adj_num.style.top  = vdb_getTop  (this) + 'px';
			div_adj_num.style.left = vdb_getLeft (this) + 'px';
			div_adj_num.style.zIndex = 1;
			div_adj_num.style.visibility = 'visible';
		} //event

		card_set.onmouseout = function() {
			if (vdb_is_dragging) return;
			this.style.cursor = 'default';
			document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';
		} //event

		// determine the drag area width and height
		var width  = div_type.offsetWidth  - card_set.offsetWidth  - 2*div_borderWidth;
		var height = div_type.offsetHeight - card_set.offsetHeight - 2*div_borderWidth;

		// get the starting position of the card
		var card_left = vdb_getLeft (card_set);
		var card_top  = vdb_getTop  (card_set);

		// determine the upper-left relative corner of the drag area
		var x1 = div_left - card_left + (is_msie7 ? 10 : div_borderWidth);
		var y1 = div_top  - card_top  + (is_msie7 ? 15 : div_borderWidth);

		// determine the lower-right relative corner of the drag area
		var x2 = x1 + width;
		var y2 = y1 + height;

		// dispose the old drag object
		if (vdb_cards[type][i].drag)  vdb_cards[type][i].drag.Dispose();

		// create the new drag object
		vdb_cards[type][i].drag = new dragObject (card_set.id, null,
			new Position (x1, y1), new Position (x2, y2),
			vdb_card_drag_start, vdb_card_drag, vdb_card_drag_stop);

	} //for

} //function

//--------------------------------------------------------------------------------
// reset all the drag objects

function vdb_reset_drag_all () {

	for (var type in vdb_cards)  vdb_reset_drag (type);

} //function

//--------------------------------------------------------------------------------
// display the cards of the given type

function vdb_display_cards (type) {

	var html = '';

	if (vdb_cards[type].length == 0)  html += '&nbsp;';

	for (var i=0;  i<vdb_cards[type].length;  i++) {

		vdb_cards[type][i].fan.sId = 'vdb_card_' + type + '_' + i;
		html += vdb_cards[type][i].fan.get_html();

	} //for

	document.getElementById('vdb_div_cards_' + type).innerHTML = html;

	vdb_re_fan (type);
	vdb_reset_drag (type);

	vdb_display_card_counts();

} //function

//--------------------------------------------------------------------------------
// display all the cards

function vdb_display_cards_all () {

	for (var type in vdb_cards)  vdb_display_cards (type);

} //function

//--------------------------------------------------------------------------------
// display the favorite cards

function vdb_display_cards_fav() {

	var div_html = '';

	for (var type in vdb_cards_fav) {

		var html = '';

		for (var i=0;  i<vdb_cards_fav[type].length;  i++) {

			vdb_cards_fav[type][i].fan.sId = 'vdb_fav_' + type + '_' + i;
			html += vdb_cards_fav[type][i].fan.get_html();

		} //for

		div_html += html;

	} //for

	div_html = '<div style="width:320px; white-space:normal;">' + (div_html ? div_html : '&nbsp;') + '</div>';

	document.getElementById('vdb_div_cards_fav').innerHTML = div_html;

	for (var type in vdb_cards_fav)
	for (var i=0;  i<vdb_cards_fav[type].length;  i++) {

		var card_set = document.getElementById (vdb_cards_fav[type][i].fan.sId);

		card_set.onmouseover = function() {
			if (vdb_is_dragging) return;
			this.style.cursor = 'move';
			document.getElementById('vdb_adj_info').href = "javascript:vdb_adj_num('" + this.id + "','i')";
			document.getElementById('vdb_adj_addf').href = "javascript:vdb_adj_num('" + this.id + "','a')";
			document.getElementById('vdb_adj_addf').style.display = 'inline';
			document.getElementById('vdb_adj_add' ).style.display = 'none';
			document.getElementById('vdb_adj_sub' ).style.display = 'none';
			document.getElementById('vdb_adj_del' ).style.display = 'none';
			var div_adj_num = document.getElementById('vdb_div_adj_num');
			div_adj_num.style.top  = vdb_getTop  (this) + 'px';
			div_adj_num.style.left = vdb_getLeft (this) + 'px';
			div_adj_num.style.zIndex = parseInt (document.getElementById('window_drag_vdb_fav').style.zIndex) + 1;
			div_adj_num.style.visibility = 'visible';
		} //event

		card_set.onmouseout = function() {
			if (vdb_is_dragging) return;
			this.style.cursor = 'default';
			document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';
		} //event

		// dispose the old drag object
		if (vdb_cards_fav[type][i].drag)  vdb_cards_fav[type][i].drag.Dispose();

		// create the new drag object
		vdb_cards_fav[type][i].drag = new dragObject (card_set.id, null,
			null, null,
			vdb_fav_drag_start, vdb_fav_drag, vdb_fav_drag_stop);

	} //for

} //function

//--------------------------------------------------------------------------------
// display the trash cards

function vdb_display_cards_trash() {

	var div_html = '';

	for (var type in vdb_cards_trash) {

		var html = '';

		for (var i=0;  i<vdb_cards_trash[type].length;  i++) {

			vdb_cards_trash[type][i].fan.sId = 'vdb_trash_' + type + '_' + i;
			html += vdb_cards_trash[type][i].fan.get_html();

		} //for

		div_html += html;

	} //for

	div_html = '<div style="width:320px; white-space:normal;">' + (div_html ? div_html : '&nbsp;') + '</div>';

	document.getElementById('vdb_div_cards_trash').innerHTML = div_html;

	for (var type in vdb_cards_trash)
	for (var i=0;  i<vdb_cards_trash[type].length;  i++) {

		var card_set = document.getElementById (vdb_cards_trash[type][i].fan.sId);

		card_set.onmouseover = function() {
			if (vdb_is_dragging) return;
			this.style.cursor = 'move';
			document.getElementById('vdb_adj_info').href = "javascript:vdb_adj_num('" + this.id + "','i')";
			document.getElementById('vdb_adj_addf').href = "javascript:vdb_adj_num('" + this.id + "','a')";
			document.getElementById('vdb_adj_addf').style.display = 'inline';
			document.getElementById('vdb_adj_add' ).style.display = 'none';
			document.getElementById('vdb_adj_sub' ).style.display = 'none';
			document.getElementById('vdb_adj_del' ).style.display = 'none';
			var div_adj_num = document.getElementById('vdb_div_adj_num');
			div_adj_num.style.top  = vdb_getTop  (this) + 'px';
			div_adj_num.style.left = vdb_getLeft (this) + 'px';
			div_adj_num.style.zIndex = parseInt (document.getElementById('window_drag_vdb_trash').style.zIndex) + 1;
			div_adj_num.style.visibility = 'visible';
		} //event

		card_set.onmouseout = function() {
			if (vdb_is_dragging) return;
			this.style.cursor = 'default';
			document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';
		} //event

		// dispose the old drag object
		if (vdb_cards_trash[type][i].drag)  vdb_cards_trash[type][i].drag.Dispose();

		// create the new drag object
		vdb_cards_trash[type][i].drag = new dragObject (card_set.id, null,
			null, null,
			vdb_fav_drag_start, vdb_fav_drag, vdb_fav_drag_stop);

	} //for

} //function

//--------------------------------------------------------------------------------
// empty the trash of the given type/index or all

function vdb_empty_trash (type, index) {

	if (type && index)
		vdb_cards_trash[type].splice (index, 1);
	else
		vdb_cards_trash = {'pokemon':[], 'trainer':[], 'energy':[]};

	document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';

	vdb_display_cards_trash();

} //function

//--------------------------------------------------------------------------------
// display the card data for the give type/index

var vdb_display_data_timeout_id = null;

function vdb_display_data (type, index, fav_trash) {

	var div_adj  = document.getElementById ('vdb_div_adj_num');
	var div_data = document.getElementById ('vdb_div_card_data');

	var data = (fav_trash=='fav'
		? vdb_cards_fav[type][index].data
		: fav_trash=='trash'
			? vdb_cards_trash[type][index].data
			: vdb_cards[type][index].data);

	var fan = (fav_trash=='fav'
		? vdb_cards_fav[type][index].fan
		: fav_trash=='trash'
			? vdb_cards_trash[type][index].fan
			: vdb_cards[type][index].fan);

	var name = data.name;
	var info = data.info;
	var note = data.note;
	var qty  = fan.iNum;

	var td_data = document.getElementById('vdb_td_card_data');
	td_data.innerHTML = qty + ' x ' + name +
		(info ? ' - '    + info : '') +
		(note ? '<br />' + note : '');

	if (info) {
		var card_data = info.split('-');
		var card_set = info.split('-')[0];
		var card_num = info.split('-')[1];
		if (vdb_CDB_URL[card_set]) {
			var CDB_URL = vdb_CDB_URL[card_set];
			var num = parseInt (info.split('-')[1]);
			if (isNaN (num))    CDB_URL +=   card_num + '/';
			else                CDB_URL +=        num + '/';
			td_data.innerHTML += '<br /><a href="javascript:vdb_CDB_window(\'' + CDB_URL + '\')">Card Database</a>';
		} //if
	} //if

	div_data.style.left = div_adj.style.left;
	div_data.style.top  = (parseInt (div_adj.style.top) - div_data.offsetHeight) + 'px';

	if (vdb_display_data_timeout_id)  clearTimeout (vdb_display_data_timeout_id);
	vdb_display_data_timeout_id = setTimeout (function() { div_data.style.visibility = 'hidden'; }, 2000);

	div_data.onmouseover = function() { this.style.visibility='visible'; clearTimeout (vdb_display_data_timeout_id); }
	div_data.onmouseout  = function() { this.style.visibility='hidden'; }

	div_data.style.zIndex = div_adj.style.zIndex;
	div_data.style.visibility = 'visible';

} //function

function vdb_CDB_window (CDB_URL) {
	window.open (CDB_URL,'_blank',
		'top=10, left=10, height=600, width=600, resizable=yes, scrollbars=yes, ' +
		'location=no, titlebar=no, toolbar=no, menubar=no, status=no');
} //function

//--------------------------------------------------------------------------------
// add/subtract cards and display card data

function vdb_adj_num (sId, iNum) {

	var card_id = sId.split ('_');
	var type    = card_id[2];
	var index   = card_id[3];

//	if (vdb_cards[type].length <= index) {
//		document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';
//		return;
//	} //if

	switch (iNum) {

		case 'i':
			vdb_display_data (type, index, card_id[1]);
			return;

		case 'a': // fav/trash only
			vdb_add_card (sId);
			if (card_id[1] == 'trash')  vdb_empty_trash (type, index);
			break;

		case 'x':
			with (vdb_cards[type][index])
				vdb_cards_trash[type].push ({
					'data' : {'name' : data.name, 'info' : data.info, 'note' : data.note},
					'fan'  : new cls_fan_img ('vdb_trash_' + type + '_' + index,
						fan.sSrc, fan.iNum, vdb_iWidth, vdb_iHeight, 0, -5, vdb_iBorder, ''),
					'drag' : null});
			vdb_display_cards_trash();
			iNum = -vdb_cards[type][index].fan.iNum;

		default:
			vdb_cards[type][index].fan.re_number (vdb_cards[type][index].fan.iNum + iNum);
			if (vdb_cards[type][index].fan.iNum > 0) {
				vdb_re_fan_one (type, index);
				vdb_reset_drag (type);
			} //if
			else {
				vdb_cards[type].splice (index, 1);
				vdb_display_cards (type);
				document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';
			} //else
			vdb_dirty = true;

	} //switch

	vdb_display_card_counts();

} //function

//--------------------------------------------------------------------------------
// create the HTML for the info/add/sub/del buttons - floating DIV

function vdb_create_adj_buttons () {

	// create "shell" buttons - update the position and HREF during run time on mouseover/mouseout
	return (
		'<div id="vdb_div_adj_num" style="visibility:hidden; position:absolute;"' +
			' onmouseover="this.style.visibility=\'visible\'" onmouseout="this.style.visibility=\'hidden\'">' +
			'<table cellpadding="0" cellspacing="0" style="border:1px solid black;"><tr style="background-color:yellow;"><td style="padding:1px;">' +
				'<a id="vdb_adj_info" href=""><img src="' + vdb_images_loc + 'info.gif" style="border:1px solid black; margin:2px;" /></a>' +
				'<a id="vdb_adj_add"  href=""><img src="' + vdb_images_loc + 'add.gif"  style="border:1px solid black; margin:2px;" /></a>' +
				'<a id="vdb_adj_addf" href=""><img src="' + vdb_images_loc + 'addf.gif" style="border:1px solid black; margin:2px;" /></a>' +
				'<a id="vdb_adj_sub"  href=""><img src="' + vdb_images_loc + 'sub.gif"  style="border:1px solid black; margin:2px;" /></a>' +
				'<a id="vdb_adj_del"  href=""><img src="' + vdb_images_loc + 'del.gif"  style="border:1px solid black; margin:2px;" /></a>' +
			'</td></tr></table>' +
		'</div>' +

		'<div id="vdb_div_card_data" style="visibility:hidden; position:absolute;">' +
			'<table cellpadding="10" cellspacing="0" style="border:1px solid black;"><tr style="background-color:yellow;">' +
			'<td id="vdb_td_card_data" style="white-space:nowrap; font-family:verdana,arial,helvetica; font-size:12px;"></td>' +
			'</tr></table>' +
		'</div>');

} //function

//--------------------------------------------------------------------------------
// globals needed for the card drag functionality

// initialize the drag indicator
// used to stop re-display of the floating adjust control during dragging
var vdb_is_dragging = false;

//--------------------------------------------------------------------------------
// call-back when starting the card drag

function vdb_card_drag_start (e, card) {

	// move the card to the front
	card.style.zIndex = 10;

	// set the drag indicator and hide the adjust control
	vdb_is_dragging = true;
	document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';

} //function

//--------------------------------------------------------------------------------
// call-back when dragging cards

function vdb_card_drag () {

} //function

//--------------------------------------------------------------------------------
// call-back when stopping the card drag
// re-position the dragged card

function vdb_card_drag_stop (card) {

	// unset the drag indicator to re-show the adjust control
	vdb_is_dragging = false;

	// get the dragged card type and index
	var card_id = card.id.split ('_');
	var type    = card_id[2];
	var index   = card_id[3];

	// get the position of the dragged card
	var d_x1 = vdb_getLeft (card);
	var d_y1 = vdb_getTop  (card);
	var d_x2 = d_x1 + card.offsetWidth;
	var d_y2 = d_y1 + card.offsetHeight;

	// initialize the new index insertion position (not set if < 0)
	var new_index = -1;

	// find the insert index (check from beginning first)
	if (new_index < 0)
	for (var i=0;  i<vdb_cards[type].length;  i++)
		if (i < index) {

			// get the search card position
			var s_x1 = vdb_getLeft (vdb_cards[type][i].drag.element);
			var s_y1 = vdb_getTop  (vdb_cards[type][i].drag.element);
			var s_x2 = s_x1 + vdb_cards[type][i].drag.element.offsetWidth;
			var s_y2 = s_y1 + vdb_cards[type][i].drag.element.offsetHeight;

			// insertion position criteria
			if (d_x1 <= s_x1)
			if (d_y1 == s_y1 || d_y2 == s_y2 || (d_y1 > s_y1 && d_y1 < s_y2)) {
				new_index = i;
				break;
			} //if
		} //if
		else  break;

	// find the insert index (check from end)
	if (new_index < 0)
	for (var i=vdb_cards[type].length-1;  i>=0;  i--)
		if (i > index) {

			// get the search card position
			var s_x1 = vdb_getLeft (vdb_cards[type][i].drag.element);
			var s_y1 = vdb_getTop  (vdb_cards[type][i].drag.element);
			var s_x2 = s_x1 + vdb_cards[type][i].drag.element.offsetWidth;
			var s_y2 = s_y1 + vdb_cards[type][i].drag.element.offsetHeight;

			// insertion position criteria
			if (d_x1 >= s_x1)
			if (d_y1 == s_y1 || d_y2 == s_y2 || (d_y1 > s_y1 && d_y1 < s_y2)) {
				new_index = i;
				break;
			} //if
		} //if
		else  break;

	// not found - keep current position
	if (new_index < 0)  new_index = index;

	// re-order and re-display
	var new_card = {'data':vdb_cards[type][index].data, 'fan':vdb_cards[type][index].fan, 'drag':null};
	vdb_cards[type].splice (index, 1);
	vdb_cards[type].splice (new_index, 0, new_card);
	vdb_display_cards (type);
	vdb_dirty = true;

} //function

//--------------------------------------------------------------------------------
// call-back when starting the favorite/trash card drag

var vdb_fav_x1 = vdb_fav_x2 = vdb_fav_y1 = vdb_fav_y2 = 0;
var vdb_fav_type = null;
var vdb_fav_add = false;
var vdb_fav_left = '';
var vdb_fav_top  = '';
var vdb_fav_border = '';

function vdb_fav_drag_start (e, card) {

	// move the card to the front
	card.style.zIndex = 9998;

	// set the drag indicator and hide the adjust control
	vdb_is_dragging = true;
	document.getElementById('vdb_div_adj_num').style.visibility = 'hidden';

	// save the original position
	vdb_fav_left = card.style.left;
	vdb_fav_top  = card.style.top;

	// get the dragged card type
	var card_id = card.id.split ('_');
	var type    = card_id[2];

	// set the hover area
	vdb_fav_type = document.getElementById('vdb_rollup_' + type);
	vdb_fav_x1 = vdb_getLeft (vdb_fav_type) + (is_msie7 ? 10 : 0);
	vdb_fav_y1 = vdb_getTop  (vdb_fav_type) + (is_msie7 ? 15 : 0);
	vdb_fav_x2 = parseInt (vdb_fav_type.offsetWidth ) + vdb_fav_x1 - (is_msie ? 2*parseInt (vdb_fav_type.style.borderWidth) : 0);
	vdb_fav_y2 = parseInt (vdb_fav_type.offsetHeight) + vdb_fav_y1 - (is_msie ? 2*parseInt (vdb_fav_type.style.borderWidth) : 0);
	vdb_fav_border = vdb_fav_type.style.borderStyle;
	vdb_fav_add = false;

} //function

//--------------------------------------------------------------------------------
// call-back when dragging favorite/trash cards

function vdb_fav_drag (e, card) {

	// get the card coords
	cx1 = vdb_getLeft (card);
	cy1 = vdb_getTop  (card);
	cx2 = parseInt (card.offsetWidth ) + cx1;
	cy2 = parseInt (card.offsetHeight) + cy1;

	// determine if the dragged card intersects the target area
	vdb_fav_add = !(
		cx1 > vdb_fav_x2 ||
		cx2 < vdb_fav_x1 ||
		cy1 > vdb_fav_y2 ||
		cy2 < vdb_fav_y1);

	// set the border style based on intersection
	if (vdb_fav_add)  vdb_fav_type.style.borderStyle = 'dashed';
	else              vdb_fav_type.style.borderStyle = vdb_fav_border;

} //function

//--------------------------------------------------------------------------------
// call-back when stopping the favorite/trash card drag
// re-position the dragged card

function vdb_fav_drag_stop (card) {

	// unset the drag indicator to re-show the adjust control
	vdb_is_dragging = false;

	// move the card to the back
	card.style.zIndex = 1;

	// restore the original position
	card.style.left = vdb_fav_left;
	card.style.top  = vdb_fav_top;

	// add the card and remove from trash if needed
	if (vdb_fav_add) {
		vdb_adj_num (card.id, 'a');
	} //if

	// reset the hover displays and "add" flag
	vdb_fav_type.style.borderStyle = vdb_fav_border;
	vdb_fav_add = false;

} //function

//------------------------------------------------------------------------------
// get the absolute left x coord of the given DOM node object

function vdb_getLeft (objNode) {

	var iLeft = 0;

	// bubble up to the body node
	while (objNode && objNode.tagName != 'BODY' && objNode.tagName != 'HTML') {

		// adjust for IE (only count DIV borders)
		if (is_msie && objNode.tagName == 'DIV') {
			var iWidth = parseInt (objNode.style.borderLeftWidth);
			iLeft += (isNaN (iWidth) ? 0 : iWidth);
		} //if

		iLeft  += objNode.offsetLeft;
		objNode = objNode.offsetParent;

		// adjust for safari borders (place here to not include textbox border)
		if (objNode && is_safari) {
			var iWidth = parseInt (objNode.style.borderLeftWidth);
			iLeft += (isNaN (iWidth) ? 0 : iWidth);
		} //if

	} //while

	// adjust for FF (needs BODY border)
	if (objNode && is_firefox) {
		var iWidth = parseInt (objNode.style.borderLeftWidth);
		iLeft += (isNaN (iWidth) ? 0 : iWidth);
	} //if

	return iLeft;

}  //function

//------------------------------------------------------------------------------
// get the absolute top y coord of the given DOM node object

function vdb_getTop (objNode) {

	var iTop = 0;

	// bubble up to the body node
	while (objNode && objNode.tagName != 'BODY' && objNode.tagName != 'HTML') {

		// adjust for IE (only count DIV borders)
		if (is_msie && objNode.tagName == 'DIV') {
			var iWidth = parseInt (objNode.style.borderTopWidth);
			iTop += (isNaN (iWidth) ? 0 : iWidth);
		} //if

		iTop   += objNode.offsetTop;
		objNode = objNode.offsetParent;

		// adjust for safari borders (place here to not include textbox border)
		if (objNode && is_safari) {
			var iWidth = parseInt (objNode.style.borderTopWidth);
			iTop += (isNaN (iWidth) ? 0 : iWidth);
		} //if

	} //while

	// adjust for FF (needs BODY border)
	if (objNode && is_firefox) {
		var iWidth = parseInt (objNode.style.borderTopWidth);
		iTop += (isNaN (iWidth) ? 0 : iWidth);
	} //if

	return iTop;

}  //function

//--------------------------------------------------------------------------------
// create the vdb auto-suggest objects from the core.js data

var vdb_objSugg = {
	"pokemon": new clsAutoSuggestControl ('vdb_pokemon', aaSugg.pokemon),
	"trainer": new clsAutoSuggestControl ('vdb_trainer', aaSugg.trainer),
	"energy" : new clsAutoSuggestControl ('vdb_energy' , aaSugg.energy )
} //vdb_objSugg array

var vdb_objSugg_loaded = false;

//--------------------------------------------------------------------------------
// change the auto-suggest object after changes to auto-suggest options

function vdb_change_sugg () {

	for (type in vdb_objSugg)
	with (vdb_objSugg[type]) {
		objHiddenItems[4] = !decklist_options.suggestions.show_set_images;   //show rarity symbol
		objHiddenItems[5] =  decklist_options.suggestions.show_set_images;   //hide rarity symbol
		objHiddenItems[6] = !decklist_options.suggestions.show_set_images;   //show set symbol
		objHiddenItems[7] =  decklist_options.suggestions.show_set_images;   //hide set symbol
		objHiddenItems[8] = !decklist_options.suggestions.show_card_images;  //show card image
		objHiddenItems[9] =  decklist_options.suggestions.show_card_images;  //hide card image
		iMinRowHeight       = (decklist_options.suggestions.show_card_images ? 80 : (decklist_options.suggestions.show_set_images ? 40 : 20));
		iMaxNumDisplayItems = (decklist_options.suggestions.show_card_images ?  4 : (decklist_options.suggestions.show_set_images ?  8 : 12));
		iMaxNumSuggestionItems = Math.min (16, 2*iMaxNumDisplayItems);
		iMinNumCharacters = decklist_options.suggestions.min_num_chars;
		bMatchStartOnly   = decklist_options.suggestions.match_start_only;
		objAllItems       = (decklist_options.suggestions.most_recent_only ? aaSugg_RecentOnly[type] : aaSugg[type]);
	} //with

	with (vdb_objSugg['energy']) {
		for (var i=0;  i<objAllItems.length;  i++)
			if ((objAllItems[i][0].search(' - Basic') >= 0) && (objAllItems[i][10] != ''))
				objExcludeItems[i] = !decklist_options.suggestions.include_basic_energy;
	} //with

} //function

//--------------------------------------------------------------------------------
// initialize the auto-suggest object (once during body.onload)

if (window.addEventListener)
	window.addEventListener("load", vdb_init_sugg, false)
else if (window.attachEvent)
	window.attachEvent("onload", vdb_init_sugg)
else {}

function vdb_init_sugg () {

	if (vdb_objSugg_loaded)  return;
	vdb_objSugg_loaded = true;

	vdb_objSugg['pokemon'].highlightColor = 'Pink';
	vdb_objSugg['trainer'].highlightColor = 'LightGreen';
	vdb_objSugg['energy' ].highlightColor = 'PowderBlue';
	for (type in vdb_objSugg)
	with (vdb_objSugg[type]) {
		objHiddenItems[0]  = true;  //sugg match text
		objHiddenItems[1]  = true;  //sugg fill  text
		objHiddenItems[10] = true;  //info
		objHiddenItems[11] = true;  //note
		objHiddenItems[12] = true;  //complete card name/info
		objHiddenItems[13] = true;  //img src
		iSuggestionMatchIndex   = 0;
		iSuggestionFillIndex    = 1;
		iSuggestionDisplayIndex = 2;
		iWidenDropDown = 66;
		bHideGetOnBlur=true;  //reset to false when showing the add card window
		createDropDown();  // do this last after all the settings
	} //with

	// initialize according to the initial options
	vdb_change_sugg();

	// reset the drag in window-resize
	if (window.addEventListener)
		window.addEventListener("resize", vdb_reset_drag_resize, false)
	else if (window.attachEvent)
		window.attachEvent("onresize", vdb_reset_drag_resize)
	else {}

} //function

var vdb_cancel_resize = true;
function vdb_reset_drag_resize () {
	if (!vdb_cancel_resize)  vdb_reset_drag_all();
} //function

//--------------------------------------------------------------------------------
// connect the textbox to the auto-suggest control

function vdb_connect (sType) {

	var objText = document.getElementById ('vdb_card_' + sType);
	var objInfo = document.getElementById ('vdb_info_' + sType);
	var objNote = document.getElementById ('vdb_note_' + sType);
	var objImg  = document.getElementById ('vdb_img_'  + sType);

	vdb_objSugg[sType].connect (objText,
		[objInfo, 'value', 10, '', false],
		[objNote, 'value', 11, '', false],
		[objImg , 'value', 13, '', false]);

} //function

//--------------------------------------------------------------------------------
// load the deck data

function vdb_load_deck_data () {

	// point at the decklist card data array from core.js
	var deck = decklists[deck_num-1].cards;

	// re-initialize the cards and title
	vdb_cards = {'pokemon':[], 'trainer':[], 'energy':[]};
	vdb_title = '';

	// set the VDB title
	vdb_title = deck.deck_name;
	document.getElementById ('vdb_deck_title_input').value = vdb_title;
	vdb_update_deck_title();

	// fill the cards (global variable) with data
	for (var type in vdb_cards)
	for (var i=0;  i<deck[type].length; i++)
		if (deck[type][i].img) {
			var qty = parseInt (deck[type][i].qty);
			if (isNaN (qty) || qty < 1)  qty = 1;
			vdb_cards[type].push ({
				'data' : {'name' : deck[type][i].name, 'info' : deck[type][i].info, 'note' : deck[type][i].note},
				'fan'  : new cls_fan_img ('vdb_card_' + type + '_' + i,
					card_images_loc + deck[type][i].img, qty, vdb_iWidth, vdb_iHeight, 0, 0, vdb_iBorder, ''),
				'drag' : null});
		} //if

} //function

//--------------------------------------------------------------------------------
// save the deck data

function vdb_save_deck_data () {

	// clear the decklist card data array in core.js
	decklists[deck_num-1].cards.pokemon.splice (0, decklists[deck_num-1].cards.pokemon.length);
	decklists[deck_num-1].cards.trainer.splice (0, decklists[deck_num-1].cards.trainer.length);
	decklists[deck_num-1].cards.energy .splice (0, decklists[deck_num-1].cards.energy .length);

	// save the deck name
	var deck_name = document.getElementById ('vdb_deck_title_input').value;
	decklists[deck_num-1].cards.deck_name = deck_name;
	document.getElementById('deck_list_select').options[deck_num-1].text = get_jump_text (deck_name);

	// fill the new decklist data
	for (var type in vdb_cards) {
		for (var i=0;  i<vdb_cards[type].length; i++) {
			var img = vdb_cards[type][i].fan.sSrc.replace (card_images_loc, '');
			decklists[deck_num-1].cards[type].push ({
				'qty'  : vdb_cards[type][i].fan.iNum.toString(),
				'name' : vdb_cards[type][i].data.name,
				'info' : vdb_cards[type][i].data.info,
				'card' : vdb_cards[type][i].data.name + '\t' + vdb_cards[type][i].data.info,
				'img'  : img,
				'note' : vdb_cards[type][i].data.note});
		} //for
		// push a blank line if needed
		if (vdb_cards[type].length <= 0)
			decklists[deck_num-1].cards[type].push ({
				'qty':'', 'name':'', 'info':'', 'card':'', 'img':'', 'note':''});
	} //for

} //function

//--------------------------------------------------------------------------------
// update the deck list title

function vdb_update_deck_title() {

	var deck_name = document.getElementById ('vdb_deck_title_input').value;
	document.getElementById ('vdb_span_title').innerHTML =
		(deck_name ? (deck_name.length > 50 ? deck_name.substr(0,50) + '&hellip;' : deck_name) : '(no deck name)');
	document.getElementById('vdb_fav_decks_list').options[deck_num-1].text =
	document.getElementById('vdb_open_decks_list').options[deck_num-1].text = get_jump_text (deck_name);

} //function

//--------------------------------------------------------------------------------
// get all the deck names for the decks list - run BEFORE getting the vdb_load_fav_data

function vdb_fill_decks_list() {

	// clear the fav deck list
	var objFavList  = document.getElementById ('vdb_fav_decks_list');
	var objOpenList = document.getElementById ('vdb_open_decks_list');
	while (objFavList .length > 0)  objFavList .remove (objFavList .length-1);
	while (objOpenList.length > 0)  objOpenList.remove (objOpenList.length-1);

	// get the deck names and load them into the fav deck list
	for (var i=0;  i<decklists.length;  i++) {
		var opt = document.createElement ('option');
		opt.text = (decklists[i].cards.deck_name ? decklists[i].cards.deck_name : '(no deck name)');
		try        { objFavList.add (opt, null); }
		catch(ex)  { objFavList.add (opt);       } //IE
		opt = document.createElement ('option');
		opt.text = (decklists[i].cards.deck_name ? decklists[i].cards.deck_name : '(no deck name)');
		try        { objOpenList.add (opt, null); }
		catch(ex)  { objOpenList.add (opt);       } //IE
	} //for

	// point at the current deck list
	objOpenList.selectedIndex = deck_num-1;

} //function

//--------------------------------------------------------------------------------
// load the favorites data

function vdb_load_fav_data (deck_name, deck_num) {

	var deck = (deck_num ? decklists[deck_num-1].cards : null);

	// go find the deck of the given deck_name
	if (deck == null) {

		function  trim(str) { return str.replace(/^\s+|\s+$/g,""); }

		if (deck_name)
			deck_name = trim (deck_name.toLowerCase())
		else
			deck_name = 'favorites';

		for (var i=0;  i<decklists.length;  i++)
			if (trim (decklists[i].cards.deck_name.toLowerCase()) == deck_name) {
				deck = decklists[i].cards;
				deck_num = i+1;
				break;
			} //if
	} //if

	document.getElementById ('vdb_fav_decks_list').selectedIndex = (deck_num ? deck_num-1 : -1);

	// re-initialize the cards
	vdb_cards_fav = {'pokemon':[], 'trainer':[], 'energy':[]};

	if (deck == null)  return;

	// fill the cards (global variable) with data
	for (var type in vdb_cards_fav)
	for (var i=0;  i<deck[type].length; i++)

		if (deck[type][i].img) {
			var qty = parseInt (deck[type][i].qty);
			if (isNaN (qty) || qty < 0)  qty = 1;
			vdb_cards_fav[type].push ({
				'data' : {'name' : deck[type][i].name, 'info' : deck[type][i].info, 'note' : deck[type][i].note},
				'fan'  : new cls_fan_img ('vdb_fav_' + type + '_' + i,
					card_images_loc + deck[type][i].img, qty, vdb_iWidth, vdb_iHeight, 0, -5, vdb_iBorder, ''),
				'drag' : null});
		} //if

} //function

//--------------------------------------------------------------------------------
// create the vdb

function vdb_create() {

	// create the main container divs and display the cards
	document.write (vdb_create_main_divs());
	document.write (vdb_create_adj_buttons());
	vdb_display_controls();
	vdb_display_cards_fav();
	vdb_display_cards_all();

} //function

//--------------------------------------------------------------------------------
// show the vdb

var vdb_hide_id = '';  //global id for hiding the html

function vdb_show (hide_id) {

	vdb_hide_id = hide_id;

	update_decklist();

	document.getElementById (vdb_hide_id).style.display = 'none';
	document.getElementById ('vdb_main' ).style.display = 'block';

	// create the vdb css menu the first time only after it's displayed
	if (cssmenuids) {
		cssmenuids = ["vdb_css_menu"];
		createcssmenu2();
		cssmenuids = [];
	} //if

	for (var type in vdb_cards)  vdb_show_rollup_window (type);

	vdb_fill_decks_list();

	vdb_file_open();

	vdb_load_fav_data();
	vdb_display_cards_fav();

	// set the initial fanning
	vdb_set_fan ('vdb_img',    0, -10);
	vdb_set_fan ('vdb_img5', -10,   0);

	vdb_cancel_resize = false;

} //function

//--------------------------------------------------------------------------------
// hide all the vdb drag windows

function vdb_hide_window_drag_all() {

	hide_window_drag ('vdb_open');
	hide_window_drag ('vdb_info');
	hide_window_drag ('vdb_fav');
	hide_window_drag ('vdb_trash');
	hide_window_drag ('vdb_fan');
	hide_window_drag ('vdb_add');

} //function

//--------------------------------------------------------------------------------
// hide the vdb

function vdb_hide () {

	vdb_cancel_resize = true;

	vdb_hide_window_drag_all();

	document.getElementById ('vdb_main' ).style.display = 'none';
	document.getElementById (vdb_hide_id).style.display = 'block';

	update_displayed_decklist();
	update_totals();

} //function

//--------------------------------------------------------------------------------
// global variables for vdb, then create the vdb

// dirty flag - set when changes occurs, reset on save
var vdb_dirty = false;

// default card size & border
var vdb_iWidth  = 50;
var vdb_iHeight = 70;
var vdb_iBorder = 1;

// max amount of fan size
var vdb_max_fanX = vdb_iWidth  + vdb_iBorder + 2;
var vdb_max_fanY = vdb_iHeight + vdb_iBorder + 2;

// initialize the cards and title
var vdb_cards       = {'pokemon':[], 'trainer':[], 'energy':[]};
var vdb_cards_fav   = {'pokemon':[], 'trainer':[], 'energy':[]};
var vdb_cards_trash = {'pokemon':[], 'trainer':[], 'energy':[]};
var vdb_title = '';

// initialize the window drag objects
window_drag["vdb_open" ] = null;
window_drag["vdb_info" ] = null;
window_drag["vdb_fav"  ] = null;
window_drag["vdb_trash"] = null;
window_drag["vdb_fan"  ] = null;
window_drag["vdb_add"  ] = null;

// create the vdb
// moved to core.js
//vdb_create();