/*******************************************************************************
 * UI Components
 ******************************************************************************/
var masterFrame			= null;
var masterTab			= null;
var masterToolbar		= null;

/*******************************************************************************
 * Current Design
 ******************************************************************************/
var designWoodTile		= null;

/*******************************************************************************
 * Application Stuff
 ******************************************************************************/
var	activeDesign		= null;
var closeDesignTab		= null;
var originalDesignName	= null;

var clipboard			= new Array();
var mousePositionX		= -1;
var mousePositionY		= -1;

var currentPart			= null;
var siteDocument 		= null;
var commandToRepeat 	= null;
var intervalId			= 0;
var repeatSpeed 		= 1;
var currentEvent		= null;
var designHandler 		= null;
var designerOpen 		= false;
var openPreviewName		= null;
var woodPreviewName		= null;

var rubberband			= null;
var dragGroup			= null;
var selectedArea		= null;
var partType			= 'CrossHairs';
var tips				= null;
var partsXML			= null;

var keyboardEvents		= null;

/*******************************************************************************
 * UI Windows
 ******************************************************************************/
var designsWindow 		= null;
var helpWindow 			= null;
var toolbarWindow		= null;
var infoWindow			= null;
var introWindow			= null;
var partsListWindow		= null;
var partBinWindow		= null;
var uploadWindow		= null;

/*******************************************************************************
 * UI Dialogs
 ******************************************************************************/
var reloadDialog		= null;
var newDialog			= null;
var openDialog			= null;
var saveDialog			= null;
var alertDialog			= null;
var designsDialog		= null;
var uploadDialog		= null;
var didYouKnowDialog	= null;
var cartDialog			= null;
var woodsDialog			= null;

var dialog				= null;
var infoGrid			= null;
var infoGridModel		= null;

var partDialogs			= new Hash();

/*******************************************************************************
 * UI Menus
 ******************************************************************************/
var menuContextPart		= null;
var menuContextRotate	= null;
var menuContextDesign	= null;

/*******************************************************************************
 * UI Icons
 ******************************************************************************/
var iconYes				= '/resources/images/icons/tick-circle-frame.png';
var iconNo				= '/resources/images/icons/cross-circle-frame.png';
var iconCancel			= '/resources/images/icons/minus-circle-frame.png';
var iconNext			= '/resources/images/icons/arrow.png';
var iconPrev			= '/resources/images/icons/arrow-180.png';
var iconClose			= '/resources/images/icons/cross.png';

var iconOpen			= '/resources/images/icons/folder-open-document-text.png';
var iconCart			= '/resources/images/icons/shopping-basket.png';
var iconCartGo			= '/resources/images/icons/shopping-basket--arrow.png';
var iconCartPlus		= '/resources/images/icons/shopping-basket--plus.png';
var iconCartMinus		= '/resources/images/icons/shopping-basket--minus.png';
var iconCartDelete		= '/resources/images/icons/shopping-basket--exclamation.png';

var iconDesign			= '/resources/images/icons/block.png';
var iconRefresh			= '/resources/images/icons/arrow-circle-double-135.png';

var iconFileNew			= '/resources/images/icons/document--pencil.png';
var iconOpen			= '/resources/images/icons/folder-open-document-text.png';
var iconFileSave		= '/resources/images/icons/disk--arrow.png';
var iconFileSaveAs		= '/resources/images/icons/disks--arrow.png';
var iconEditCopy		= '/resources/images/icons/clipboard-sign-out.png';
var iconEditCut			= '/resources/images/icons/clipboard--plus.png';
var iconEditPaste		= '/resources/images/icons/clipboard-sign.png';
var iconEditEmpty		= '/resources/images/icons/clipboard-empty.png';
var iconSelectAll		= '/resources/images/icons/arrow-in.png';
var iconSelectNone		= '/resources/images/icons/arrow-out.png';
var iconDelete			= '/resources/images/icons/cross-circle-frame.png';
var iconDuplicate		= '/resources/images/icons/layers.png';
var iconRotateCW		= '/resources/images/icons/arrow-circle-315.png';
var iconRotateCCW		= '/resources/images/icons/arrow-circle-225-left.png';
var iconMirrorRight		= '/resources/images/icons/book-open-next.png';
var iconMirrorLeft		= '/resources/images/icons/book-open-previous.png';
var iconFlipDown		= '/resources/images/icons/book-open-down.png';
var iconFlipUp			= '/resources/images/icons/book-open-up.png';


/*******************************************************************************
 * Did You Know
 ******************************************************************************/
var DidYouKnowCount 	= 8;
var DidYouKnow 			= randRange(1, DidYouKnowCount);


/*******************************************************************************
 * Pegs
 ******************************************************************************/
var currentPeg 			= null;
var pegsRed				= 0;
var pegsBlue			= 0;
var pegsGreen			= 0;
var pegsYellow			= 0;

var dupeDirection		= null;
var dupeCount			= 1;


/*******************************************************************************
 * Cart
 ******************************************************************************/
var cart				= new Array();
var designPrice			= 5;

var mainWindow			= null;
var dragCoords			= null;
var designListTab		= null;

function initDesigner() {
	initKeyboard();


	//masterTab = new Jx.TabBox({width: 900});
	masterTab = new Jx.TabBox({});

	
	
	// Add a tab with all designs in it
	//var all_tab = new Jx.Button.Tab({
	designListTab = new Jx.Button.DesignerListTab({
		id: 'tab_0',
		label: 'All Designs',
		image: iconRefresh,
		close: false,
		active: false,
		width: 900,
		name: 'All Designs'
	});

	
	designListTab.content.setStyle('width', '900px');
	masterTab.add(designListTab);
	listDesigns(designListTab.content, false);



	if (window.location.href.toLowerCase().contains('facebook')) {
		var fb_tab = new Jx.Button.Tab({
			label: 'Your Designs',
			image: iconDesign,
			close: false,
			active: true,
			name: 'Your Designs'
		});
		masterTab.add(fb_tab);
	}



	if (window.location.href.toLowerCase().contains('facebook')) {
		var box = $('main');
		if (box) {
			box.setStyles({
				'width': '760px',
				'height': '800px'
			});
		}
	}

	masterFrame = new Jx.Panel({
    	id: 'masterFrame',
        label: 'Custom Cribbage Board Designer',
        menu: false,
        collapse: false,
        height: 2400,
        width: 2400,
        content: masterTab,
        onContentLoaded: function() {
	    	masterFrame = this;
    	}
    });

	masterFrame.addTo($('designerBody'));
    //masterFrame.addTo('designerBody');

	var tab = null;
	masterTab.tabSet.tabs.each(function(t) {
		if (t.options.active) {
			tab = t;
		}
	});


	$('main').setStyle('display', 'none');

	currentDesign = null;
	designerOpen = true;

	$(window).addEvent('resize', function(e) {
		masterFrame.maximize();
	});

	/*dragGroup = new Drag.Group({
		'filter' : function(item){
			return item.hasClass('selectedPart');
		}
	});*/

	/*
	if ($('body')) {
		$('body').addEvent('mousemove', function(event) {
			trackMousePosition(event);
		});
	}
	*/

	makePanelSet();

	var x = loadAllParts();


	var autoLoaded = false;

	var myURI = new URI(window.location);
	var qyString = myURI.get('query');

	if (qyString.length) {
		var params = qyString.split('&');

		params.each(function (param, pIdx) {
			paramVals = param.split('=');

			if (paramVals.length == 2 && (paramVals[0].toUpperCase() == 'DESIGN')) {
				var designCode = decodeURIComponent(paramVals[1]);
				var designPassword = null;

				if (params.length > pIdx+1) {
					nextParamVals = params[pIdx+1].toUpperCase().split('=');
					if (nextParamVals.length == 2 && (nextParamVals[0] == 'PASSWORD')) {
						var designPassword = nextParamVals[1];
					}
					loadDesign(designCode, designPassword);
				} else {
					loadDesign(designCode);
				}

				autoLoaded = true;
			}
		});
	} 
	
	if (!autoLoaded && 1==0) {
		var newTab = createNewDesign();
		masterTab.add(newTab);
		masterTab.tabSet.tabs[masterTab.tabSet.tabs.length-1].focus();
	}

} Onload.add(initDesigner);


function initKeyboard() {
	keyboardEvents = new Keyboard({
	    eventType: 'keydown', 
	    events: { 
			'ctrl+up': 			function() { getActiveTab().movePartsUp(false); 			},
			'ctrl+down':		function() { getActiveTab().movePartsDown(false);			},
			'ctrl+left':		function() { getActiveTab().movePartsLeft(false);			},
			'ctrl+right':		function() { getActiveTab().movePartsRight(false);			},

			'shift+ctrl+up': 	function() { getActiveTab().movePartsUp(true); 				},
			'shift+ctrl+down':	function() { getActiveTab().movePartsDown(true);			},
			'shift+ctrl+left':	function() { getActiveTab().movePartsLeft(true);			},
			'shift+ctrl+right':	function() { getActiveTab().movePartsRight(true);			},
	
			'ctrl+r':			reloadPage,
			'ctrl+shift+r':		reloadPage,
			'F5':				reloadPage,
	
			'n':				startNewDesign,
			'l': 				function() { listDesigns($('designsList'), true);			},
			's':				saveDesign,
			'b': 				uploadImage,
			'w': 				listWoods,
	
			'r':				function() { getActiveTab().rotatePart(false);				},
			't':				function() { getActiveTab().turnSelectedParts(false); 		},
			'm':				function() { getActiveTab().mirrorPart(false);				},
			'f':				function() { getActiveTab().flipPart(false);				},
			
			'shift+r':			function() { getActiveTab().rotatePart(true);				},
			'shift+t':			function() { getActiveTab().turnSelectedParts(true); 		},
			'shift+m':			function() { getActiveTab().mirrorPart(true);				},
			'shift+f':			function() { getActiveTab().flipPart(true);					},
			
			'a':				function() { getActiveTab().selectAllParts();				},
			'u':				function() { getActiveTab().unselectAllParts();				},
			'delete':			function() { getActiveTab().deleteParts();					},
			'd':				function() { getActiveTab().duplicateParts();				},
	
			'i':				requestDesignQuote,
			'h':				showHelp,
	
			'ctrl+c':			function() { getActiveTab().copyCutParts(false);			},
			'ctrl+x':			function() { getActiveTab().copyCutParts(true);				},
			'ctrl+v':			function() { getActiveTab().pasteParts(clipboard, false);	},
			'ctrl+e':			function() { emptyClipboard();								},
	
			'9':				function() { getActiveTab().makeNextCirclePart(true);		},
			'0':				function() { getActiveTab().makeNextCirclePart(false);		},
				
			'c':				calculateDimensions,
	
			'g':				sendMessage,
			'f':				sendToFriend,
			'o':				newsSignUp,
			'p':				displayCart,
	
			'z':				function() { getActiveTab().calculateSelectedArea();		},
				
			'alt+2':			function() { getActiveTab().rotateSelected(false, 20);		},
			'alt+1':			function() { getActiveTab().rotateSelected(true, 20);		},
			'ctrl+2':			function() { getActiveTab().rotateSelected(false, 10);		},
			'ctrl+1':			function() { getActiveTab().rotateSelected(true, 10);		},
			'shift+2':			function() { getActiveTab().rotateSelected(false, 5);		},
			'shift+1':			function() { getActiveTab().rotateSelected(true, 5);		},
			'2':				function() { getActiveTab().rotateSelected(false, 1);		},
			'1':				function() { getActiveTab().rotateSelected(true, 1);		},
	
			'3':				setPartTypeFull,
			'4':				setPartTypeNoLanes,
			'5':				setPartTypeNoEnds,
			'5':				setPartTypeCrossHairs,
	
			'7':				function() { buildHires(getActiveTab().getTabName());			},
			'8':				function() { buildPDF(getActiveTab().getTabName());			}
	    }
	});
	
	keyboardEvents.activate();
} Onload.add(initKeyboard);


/*******************************************************************************
 * Part Stuff (Maybe moved to DesignerTab.js ?)
 ******************************************************************************/
function setPartType(pType) {
	var parts = getActiveTab().getParts();
	
	parts.each(function(part) {
		part.src = part.src.toLowerCase().replace('/'+getPartType(part.getAttribute('src'))+'/', '/'+pType+'/');
	});


	var binParts = $$('.binpart');
	binParts.each(function(binPart) {
		binPart.setAttribute('src', binPart.getAttribute('src').toLowerCase().replace('/'+getPartType(binPart.getAttribute('src'))+'/', '/'+pType+'/'));
	});

		
	partType = pType;
}


function setPartTypeFull() {
	//setPartType('Full');
}


function setPartTypeNoLanes() {
	//setPartType('NoLanes');
}


function setPartTypeNoEnds() {
	//setPartType('NoEnds');
}


function setPartTypeCrossHairs() {
	setPartType('CrossHairs');
}


function getPartType(src) {
	var paths = src.split('/');
	return paths[paths.length-3];
}


function getPartImage(src) {
	var paths = src.split('/');
	return paths[paths.length-1];
}


function getPartAngle(src) {
	var paths = src.split('/');
	return paths[paths.length-2];
}


function getPartInfo(src, attr) {
	var angle = getPartAngle(src);
	src = getPartImage(src).toLowerCase();
	
	var groups = partsXML.getElementsByTagName('group');
	
	for(var mc=0; mc<groups.length; mc++) {
		var parts = groups[mc].getElementsByTagName('part');
		for(var sc=0; sc<parts.length; sc++) {
			if (parts[sc].getAttribute('image').toLowerCase() == src) {
				if (attr == 'title') {
					return groups[mc].getAttribute('title');
				} else {
					return parts[sc].getAttribute('title') + ' (' + angle + '&deg;)';
				}
			}
		}
	};
}


function initToolbar() {
	$('tb_new').addEvent('click', 			function(e){ startNewDesign(e); 					});
	$('tb_list').addEvent('click', 			function(e){ listDesigns($('designsList'), true);	});
	$('tb_save').addEvent('click', 			function(e){ saveDesign(e);							});
	$('tb_background').addEvent('click', 	function(e){ uploadImage();							});

	$('tb_copy').addEvent('click', 			function(e){ clipboard = getActiveTab().copyCutParts(false);	});
	$('tb_cut').addEvent('click', 			function(e){ clipboard = getActiveTab().copyCutParts(true);		});
	$('tb_paste').addEvent('click', 		function(e){ getActiveTab().pasteParts(clipboard, true);		});
	//$('tb_empty').addEvent('click', 		function(e){ emptyClipboard();			});

	$('tb_selectall').addEvent('click', 	function(e){ getActiveTab().selectAllParts();					});
	$('tb_unselectall').addEvent('click', 	function(e){ getActiveTab().unselectAllParts();					});
	$('tb_rotate').addEvent('click', 		function(e){ getActiveTab().rotatePart(e.shift);				});
	$('tb_mirror').addEvent('click', 		function(e){ getActiveTab().mirrorPart(e.shift);				});
	$('tb_flip').addEvent('click', 			function(e){ getActiveTab().flipPart(e.shift);					});
	$('tb_turn').addEvent('click', 			function(e){ getActiveTab().turnSelectedParts(e.shift);			});
	$('tb_duplicate').addEvent('click', 	function(e){ getActiveTab().duplicateParts();					});
	$('tb_delete').addEvent('click', 		function(e){ getActiveTab().deleteParts();						});

	$('tb_moveleft').addEvent('click', 		function(e){ currentEvent = e; getActiveTab().movePartsLeft();	});
	$('tb_moveup').addEvent('click', 		function(e){ currentEvent = e; getActiveTab().movePartsUp();	});
	$('tb_movedown').addEvent('click', 		function(e){ currentEvent = e; getActiveTab().movePartsDown();	});
	$('tb_moveright').addEvent('click', 	function(e){ currentEvent = e; getActiveTab().movePartsRight();	});

	$('tb_email').addEvent('click',			function(e){ sendToFriend();						});
	$('tb_news').addEvent('click',			function(e){ newsSignUp();							});

	$('tb_message').addEvent('click', 		function(e){ sendMessage();							});
	$('tb_help').addEvent('click', 			function(e){ showHelp();							});
	$('tb_quote').addEvent('click', 		function(e){ requestDesignQuote();					});
	$('tb_calculate').addEvent('click', 	function(e){ calculateDimensions();					});
	$('tb_addtocart').addEvent('click', 	function(e){ addToCart();							});
	$('tb_cart').addEvent('click', 			function(e){ displayCart();							});

	$('tb_partfull').addEvent('click', 		function(e){ setPartType('full');					});
	$('tb_partnolanes').addEvent('click', 	function(e){ setPartType('nolanes');				});
	$('tb_partnoends').addEvent('click', 	function(e){ setPartType('noends');					});
	$('tb_partcrosshairs').addEvent('click',function(e){ setPartType('crosshairs');				});


	$('tb_moveleft').addEvent('mousedown', 	function(event){
		currentEvent = event;
		if (intervalId==0) {
			intervalId=setInterval('getActiveTab().movePartsLeft()', repeatSpeed);
		}
	});
	$('tb_moveright').addEvent('mousedown', 	function(event){
		currentEvent = event;
		if (intervalId==0) {
			intervalId=setInterval('getActiveTab().movePartsRight()', repeatSpeed);
		}
	});
	$('tb_moveup').addEvent('mousedown', 	function(event){
		currentEvent = event;
		if (intervalId==0) {
			intervalId=setInterval('getActiveTab().movePartsUp()', repeatSpeed);
		}
	});
	$('tb_movedown').addEvent('mousedown', 	function(event){
		currentEvent = event;
	    if (intervalId==0) {
	    	intervalId=setInterval('getActiveTab().movePartsDown(currentEvent)', repeatSpeed);
	    }
	});


	$('tb_moveleft').addEvent('mouseup', function(e) {
	    if (intervalId!=0) {
	        clearInterval(intervalId);
	        intervalId=0;
	    }
	});
	$('tb_moveright').addEvent('mouseup', function(e) {
	    if (intervalId!=0) {
	        clearInterval(intervalId);
	        intervalId=0;
	    }
	});
	$('tb_moveup').addEvent('mouseup', function(e) {
	    if (intervalId!=0) {
	        clearInterval(intervalId);
	        intervalId=0;
	    }
	});
	$('tb_movedown').addEvent('mouseup', function(e) {
	    if (intervalId!=0) {
	        clearInterval(intervalId);
	        intervalId=0;
	        currentEvent = null;
	    }
	});

	
	$('tb_cribbage').addEvent('click', function(e){ window.location.href='http://www.crazycribbage.com'; });

	
	
	$('tb_peg_white').addEvent('click', 		function(e) { 
		currentPeg=null;
		$('tb_peg_white').setStyle('border',	'2px solid #000000');	
		$('tb_peg_red').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_blue').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_green').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_yellow').setStyle('border',	'2px solid #ffffff');	
	});
	$('tb_peg_red').addEvent('click', 			function(e) { 
		currentPeg='peg_point_red';
		$('tb_peg_white').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_red').setStyle('border',		'2px solid #ff0000');	
		$('tb_peg_blue').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_green').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_yellow').setStyle('border',	'2px solid #ffffff');	
	});
	$('tb_peg_blue').addEvent('click', 			function(e) { 
		currentPeg='peg_point_blue';
		$('tb_peg_white').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_red').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_blue').setStyle('border',		'2px solid #0000ff');	
		$('tb_peg_green').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_yellow').setStyle('border',	'2px solid #ffffff');	
	});
	$('tb_peg_green').addEvent('click', 		function(e) { 
		currentPeg='peg_point_green';
		$('tb_peg_white').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_red').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_blue').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_green').setStyle('border',	'2px solid #00d000');	
		$('tb_peg_yellow').setStyle('border',	'2px solid #ffffff');	
	});
	$('tb_peg_yellow').addEvent('click', 		function(e) { 
		currentPeg='peg_point_yellow';
		$('tb_peg_white').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_red').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_blue').setStyle('border',		'2px solid #ffffff');	
		$('tb_peg_green').setStyle('border',	'2px solid #ffffff');	
		$('tb_peg_yellow').setStyle('border',	'2px solid #d0d000');	
	});

	$('tb_peg_align_right').addEvent('click', 	function(e){ getActiveTab().pegsAlignRight(); 	});
	$('tb_peg_align_left').addEvent('click', 	function(e){ getActiveTab().pegsAlignLeft(); 	});
	$('tb_peg_align_top').addEvent('click', 	function(e){ getActiveTab().pegsAlignTop(); 	});
	$('tb_peg_align_bottom').addEvent('click', 	function(e){ getActiveTab().pegsAlignBottom(); 	});



	$('tb_peg_delete').addEvent('click', 		function(e){ getActiveTab().pegsDelete(); 				});
	$('tb_peg_fix').addEvent('click', 			function(e){ getActiveTab().calcBoardPosFromPagePos(); 	});
	
	
	
	$('tb_peg_dupe_none').addEvent('click', 	function(e) { 
		dupeDirection = null;
		dupeCount = 1;
		
		$('tb_peg_dupe_none').setStyle('border',	'2px solid #ff0000');
		$('tb_peg_dupe_up').setStyle('border',		'2px solid #ffffff');
		$('tb_peg_dupe_down').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_left').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_right').setStyle('border',	'2px solid #ffffff');
	});
	
	$('tb_peg_dupe_up').addEvent('click', 		function(e) { 
		dupeDirection = 'Up';
		dupeCount = 5;
		
		$('tb_peg_dupe_none').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_up').setStyle('border',		'2px solid #ff0000');
		$('tb_peg_dupe_down').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_left').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_right').setStyle('border',	'2px solid #ffffff');
	});
	
	$('tb_peg_dupe_down').addEvent('click', 	function(e) { 
		dupeDirection = 'Down';
		dupeCount = 5;
		
		$('tb_peg_dupe_none').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_up').setStyle('border',		'2px solid #ffffff');
		$('tb_peg_dupe_down').setStyle('border',	'2px solid #ff0000');
		$('tb_peg_dupe_left').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_right').setStyle('border',	'2px solid #ffffff');
	});
	
	$('tb_peg_dupe_left').addEvent('click', 	function(e) { 
		dupeDirection = 'Left';
		dupeCount = 5;
		
		$('tb_peg_dupe_none').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_up').setStyle('border',		'2px solid #ffffff');
		$('tb_peg_dupe_down').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_left').setStyle('border',	'2px solid #ff0000');
		$('tb_peg_dupe_right').setStyle('border',	'2px solid #ffffff');
	});
	
	$('tb_peg_dupe_right').addEvent('click', 	function(e) { 
		dupeDirection = 'Right';
		dupeCount = 5;
		
		$('tb_peg_dupe_none').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_up').setStyle('border',		'2px solid #ffffff');
		$('tb_peg_dupe_down').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_left').setStyle('border',	'2px solid #ffffff');
		$('tb_peg_dupe_right').setStyle('border',	'2px solid #ff0000');
	});
	
	
	//menuContext();
	//menuToolbar();

	buildMenu('context');
	//buildMenu('toolbar');
}


function trimLeadingZero(s) {
	s = s.replace(/(^0*)/gi,"");
	return s;
}


/*******************************************************************************
 * Design File Stuff
 ******************************************************************************/
function doSaveDesign(qryParams) {
	var background = getActiveTab().options.background.image;
	if (!background) {
		background = '';
	}
	background = background.replace(/url\(/, '');
	background = background.replace(/\)/, '');

	var backgroundrepeat = getActiveTab().content.getStyle('background-repeat');

	var myHTMLRequest = new Request( {
		url :'/saveDesign.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			if (JSON.decode(responseText).saved) {
				designName = JSON.decode(responseText).design;
				doAlert("Design Saved", "Your design has been saved as: " + designName);
				getActiveTab().setTabName(designName);
				getActiveTab().setTabLabel(designName);
			} else {
				if (JSON.decode(responseText).error) {
					doAlert("Error", JSON.decode(responseText).error);
				} else {
					doAlert("Error", "Sorry, we could not save your design.");
				}
			}
		}
	}).send('data='+designToJSON()+'&backgrounds='+backgroundsToJSON()+'&designName='+getActiveTab().getTabName()+'&pegs='+pegsToJSON()+'&'+qryParams);

	closeDesignTab = null;

	displayInfo();
}


function doCancelDesign() {
	closeDesignTab = null;
}


function saveDesign(shift) {
	if (getActiveTab().getParts().length) {
		var name = '';
		if ($defined(shift) && shift) {
			name = '';
		} else {
			name = getActiveTab().getTabName();
		}
		doInputDialog(400, 200, 'Save Design: ' + name , '/window_save.html', {designNameAs: getActiveTab().getTabName()}, {label: 'Okay', icon: iconYes, func: doSaveDesign}, {label: 'Cancel', icon: iconNo, func: doCancelDesign});
	} else {
		doAlert("Error", "Sorry, there is nothing to save.");
	}
}


function doCancelSaveAs() {
	getActiveTab().setTabName(originalDesignName);
}


function saveDesignAs() {
	var name = '';
	originalDesignName = getActiveTab().getTabName();
	getActiveTab().setTabName('');

	doInputDialog(400, 200, 'Save Design: ' + name , '/window_save.html', null, {label: 'Okay', icon: iconYes, func: doSaveDesign}, {label: 'Cancel', icon: iconNo, func: doCancelDesign});
}


function loadDesignFromAll(params) {
	var keys = params.parseQueryString();
	loadDesign(keys.design, keys.password);
}


function loadDesign(design, pwd) {
	track('load/'+design);
	
	designLoading = true;

	var newDesign = design;

	if (arguments.length == 1) {
		pwd = '';
	}

	var dialog = doNotice('', 'Loading Design... Please Wait..');

	var myHTMLRequest = new Request( {
		url :'/loadDesign.cfm',
		method :'post',
		wait: true,
		onSuccess : function(responseText, responseXML) {
			var result = JSON.decode(responseText);
			try {
				if (result.loaded == false) {
					doAlert('Error', 'Unable to open the design you specified.');

				} else if (result.loaded == 'password required') {
					//doAlert('Error', 'Password Required.');
					doInputDialog(400, 150, 'Password required for: '+newDesign, '/window_password.html', {'design': newDesign}, {label: 'Okay', icon: iconYes, func: loadDesignFromAll}, {label: 'Cancel', icon: iconNo});
					
				} else if (result.loaded == 'incorrect password') {
					doAlert('Error', 'Incorrect Password.');

				} else {
					designPassword = JSON.decode(responseText).password;
					designName = newDesign;
					
					redrawDesign(JSON.decode(responseText).data);
					redrawPegs(JSON.decode(responseText).pegs);
					
					if ($defined(JSON.decode(responseText).backgrounds)) {
						var bgs = JSON.decode(responseText).backgrounds;
						
						bgs.each(function(bg) {	
							var bgImage = new Asset.image(bg.src, {
								onload: function() {
									buildBGImage(this, bg);
								}
							});
						});
					}

					if (JSON.decode(responseText).readonly == 'true') {
						doAlert('Notice', 'This is a read only design, <br />you must save it with a new name.');
						designPassword = null;
						designName = null;
					}

					designLoading = false;
					//calculateDimensions();
				}
			}
			catch (e) {
				dialog.close();
			}

			dialog.close();
		}
	}).send('designName=' + design + '&designpassword='+pwd);
}


function buildBGImage(asset, bg) {
	var iId = getNextImageContainerId();
	
	var patternImage = new Element('img');
	patternImage.set('id', 'patternImage_'+iId);
	patternImage.addClass('patternImage');
	patternImage.set('src', bg.src);
    patternImage.setStyle('top', '0px');
    patternImage.setStyle('left', '0px');
    patternImage.setStyle('width', parseInt(bg.width)+'px');
    patternImage.setStyle('height', parseInt(bg.height)+'px');
    
    var patternHandle = new Element('div');
    patternHandle.addClass('patternHandle');
    patternHandle.set('id', 'patternHandle_'+iId);
    
    var patternContainer = new Element('div');
    patternContainer.set('id', 'patternContainer_'+iId);
    patternContainer.addClass('patternContainer');
    patternContainer.setStyle('top', parseInt(bg.top)+'px');
    patternContainer.setStyle('left', parseInt(bg.left)+'px');
    patternContainer.setStyle('width', parseInt(bg.width)+'px');
    patternContainer.setStyle('height', parseInt(bg.height)+'px');
    setBGImageAngle(patternContainer, parseInt(bg.angle));
    
    patternImage.inject(patternContainer);
	patternHandle.inject(patternContainer);
	patternContainer.inject(getActiveTab().content);
	
    patternContainer.makeDraggable({
    	droppedOn: null,
    	
    	onStart: function(element, event) {
			this.droppedOn = null;

			var trash = new Element('img', {
	    		'position': 'absolute',
	    		'top': '0px',
	    		'left': '0px',
	    		'display': 'block'
	    	}).set('src', '/resources/images/trashBin.png').set('id', 'trashBin').inject(getActiveTab().content)
	
			var pcDroppables = new Array();
			pcDroppables.push(getActiveTab().content);
			pcDroppables.push($('trashBin'));

	    	this.droppables = pcDroppables;
	    	
	    	element.setStyle('border', '1px solid blue');
    	},
    	
    	onCancel: function(element, event) {
    		var trashBin = $('trashBin');
    		if (trashBin) {
    			trashBin.dispose();
    		}
	    	
	    	element.setStyle('border', '');
    	},
    	
    	onComplete: function(element, event) {
    		var trashBin = $('trashBin');
    		if (trashBin) {
    			trashBin.dispose();
    		}
    		
    		if (this.droppedOn.get('id') == 'trashBin') {
    			element.dispose();
    		}
	    	
	    	element.setStyle('border', '');
    	},
    	
    	onEnter: function(element, droppable) {
    		this.droppedOn = droppable;
    	}
    });

    patternContainer.makeResizable({
    	stopPropagation: true,
    	prevenDefault: true,
    	handle: patternHandle,

    	onStart: function(element, event) {
    		element.setStyle('border', '1px solid blue');
    	},
    	
    	onCancel: function(element, event) {
	    	element.setStyle('border', '');
    	},
    	
    	onComplete: function(element) {
    		var pi = $('patternImage_'+iId);
    		var pc = $('patternContainer_'+iId).getDimensions();
    		
    		pi.setStyle('width', pc.width+'px');
    		pi.setStyle('height', pc.height+'px');

    		element.setStyle('border', '');
    	}
    });
	
	patternContainer.addEvent('dblclick', function(evt) {
		rotateBGImage(patternContainer, 5, evt.shift);
	});
}


function getNextImageContainerId() {
	var pcs = $$('.patternContainer');
	var nId = 0;
	var tmpId = 0;
	var tmpIds = null;
	
	pcs.each(function(pc) {
		tmpIds = pc.get('id').split('_');
		if (tmpIds.length == 2) {
			if (tmpIds[1] > nId) {
				nId = tmpIds[1];
			}
		}
	});
	
	return parseInt(nId)+1;
}


function rotateBGImage(bgImage, count, shift) {
	var angle = bgImage.retrieve('angle');

	if (!angle) {
		angle=0;
	}

	angle = parseInt(angle);

	if (shift) {
		angle -= count;
		if (angle < 0) {
			angle=360;
		}
	} else {
		angle += count;
		if (angle > 360) {
			angle=0;
		}
	}

	this.setBGImageAngle(bgImage, angle);
}


function setBGImageAngle(bgImage, angle) {
	bgImage.setStyles({
		'-moz-transform': 'rotate(' + angle + 'deg)',
		'-webkit-transform': 'rotate(' + angle + 'deg)'
	});
	bgImage.store('angle', angle);
}


function designRequiresPassword(design) {
	var required = true;

	var myHTMLRequest = new Request( {
		url :'/designRequiresPassword.cfm',
		method :'post',
		wait: true,
		async: false,
		onSuccess : function(responseText, responseXML) {
			var result = JSON.decode(responseText);
			try {
				if (result.required == true) {
					required = true;
				} else {
					required = false;
				}
			}
			catch (e) {
			}
		}
	}).send('designName=' + design);

	return required;
}


function listDesigns(elem, isDialog) {
	keyboardEvents.deactivate();

	var myHTMLRequest = new Request( {
		url :'/listDesigns.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			var designsData = JSON.decode(responseText);
			var designs = new Array();

			if (designsData.recordcount) {
				for (var d=0; d<designsData.recordcount; d++) {
					var obj = { name: designsData.data.NAME[d].toString(), modified: designsData.data.MODIFIED[d].toString() };
					designs.push(obj);
				}

				displayDesignList(designs, elem, isDialog);
			}
		}
	}).send();
}


function displayDesignList(list, elem, isDialog) {
	if (!designsDialog) {
		designsDialog = new Jx.Dialog({
	        label: 'Browse Designs',
	        image: '/images/page_white_text.png',
	        modal: false,
	        resize: true,
	        move: true,
	        close: true,
	        width: 735,
	        height: 400,
	        vertical: '50 top',
	        contentURL: '/window_designs.html',

	        onContentLoaded: function() {
				keyboardEvents.deactivate();

			    new Jx.Button({
					id: 'openDesign',
					label: 'Open',
					image: iconOpen,
					tooltip: 'Click To Open The Design',
					onClick: function() {
						loadDesign(openPreviewName, $('designPassword').value);
						keyboardEvents.activate();
						designsDialog.close();
			    	}
			    }).addTo('designsAction');


			    new Jx.Button({
					id: 'buyDesign',
					label: 'Add To Cart',
					image: iconCart,
					tooltip: 'Click To Add To your Cart',
					onClick: function() {
			    		if (openPreviewName && openPreviewName.length) {
							keyboardEvents.activate();
							if (!designRequiresPassword(openPreviewName)) {
								addToCart(openPreviewName);
								designsDialog.close();
							}
			    		}
			    	}
			    }).addTo('designsAction');

			    buildDesignsList(list, elem, isDialog);
	        },

	        onResize: function() {
	        	if (this.options.width < 555 || this.options.height < 400) {
	        		var nw = this.options.width;
	        		var nh = this.options.height;

		        	if (this.options.width < 555) {
		        		nw = 555;
		        	}

		        	if (this.options.height < 400) {
		        		nh = 400;
		        	}

		        	this.resize(nw, nh, false);
	        	}

	        	$('designsBin').setStyles({
	        		width: this.options.width-25,
	        		height: this.options.height-45
	        	});

	        	$('designsList').setStyles({
	        		width: this.options.width-25-$('designsPreview').getDimensions().width-14,
	        		height: this.options.height-45-12
	        	});
	        },

	        onClose: function() {
	        	keyboardEvents.activate();
	        }
		});
	} else {
		buildDesignsList(list, elem, isDialog);
	}
}


function buildDesignsList(list, elem, isDialog) {
	elem.empty();

	list.each(function(des, idx) {
		var dl = new Element('div');

		dl.addClass('designPreview');

		if (des.name.length) {
			var txt = new Element('span');
			txt.setStyles({
				'font-size': '10px',
				'font-weight': 'normal',
				'float': 'left',
				'clear': 'right',
				'background': '#000000',
				'color': '#ffffff',
				'width': '83px',
				'height': '26px'
			});
			txt.set('html', des.name);
			txt.inject(dl);

			var dt = des.modified.replace("{ts \'", "");
			dt = dt.replace("\'}", "");
			dt = dt.replace("-", "");
			dt = dt.replace("-", "");
			dt = dt.replace(":", "");
			dt = dt.replace(":", "");

			var ico = new Element('img');
			ico.setAttribute('src', '/resources/designs/icons/' + escape(des.name) + '.png?id='+dt);
			ico.setAttribute('alt', des.name);
			ico.setAttribute('title', des.name);
			ico.setStyles({
				'padding': '1px 1px 1px 1px'
			});

			dl.setAttribute('href', '/resources/designs/previews/' + escape(des.name) + '.png?id='+dt);
			dl.addClass('icon');
			ico.inject(dl);
		}

		dl.addEvent('click', function() {
			openPreviewName = des.name;
			$('designsImage').empty();
			var di = new Element('img');
			di.setAttribute('src', '/resources/designs/previews/' + escape(des.name) + '.png?id='+dt);
			di.inject($('designsImage'));
		});

		dl.addEvent('dblclick', function() {
			loadDesign(des.name, $('designPassword').value);
			if (isDialog) {
				keyboardEvents.activate();
				designsDialog.close();
			}
		});

		dl.addEvent('mouseenter', function() {
			dl.addClass('overDesignIconBox');
		});

		dl.addEvent('mouseleave', function() {
			dl.removeClass('overDesignIconBox');
		});

		dl.inject(elem);
	});

	if (isDialog) {
		designsDialog.open();
	}
}


function doSendToFriend(qryParams) {
	var myHTMLRequest = new Request( {
		url :'/sendToFriend.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			if (JSON.decode(responseText).saved) {
				doAlert("Design Sent", "The design was sent to your friend.");
			} else {
				doAlert("Error", "Sorry, we could not send the design to your friend.");
			}
		}
	}).send('designName='+getActiveTab().getTabName()+'&'+qryParams);
}


function sendToFriend() {
	if (!getActiveTab().getParts().length) {
		doAlert("Error", "Sorry, there is nothing to send.");
	} else if (!getActiveTab().options.label.length) {
		doAlert("Error", "Sorry, you must save the design first.");
	} else {
		doInputDialog(400, 320, 'Send To Friend', '/window_sendtofriend.html', null, {label: 'Okay', icon: iconYes, func: doSendToFriend}, {label: 'Cancel', icon: iconNo});
	}
}


function doNewsSignUp(qryParams) {
	var myHTMLRequest = new Request( {
		url :'/news.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			var msg = JSON.decode(responseText).message;
			if (msg == 'alreadyexists') {
				doAlert("News", "You are already signed up.");
			} else if (msg == 'added') {
				doAlert("News", "You are now signed up.");
			} else if (msg == 'removed') {
				doAlert("News", "You are have been removed.");
			} else {
				doAlert("News", "An unkown error has occurred.");
			}
		}
	}).send('action=add&'+qryParams);
}


function newsSignUp() {
	doInputDialog(400, 250, 'Sign Up For News', '/window_news.html', null, {label: 'Okay', icon: iconYes, func: doNewsSignUp}, {label: 'Cancel', icon: iconNo});
}


function uploadImage() {
	if (!uploadDialog) {
		keyboardEvents.deactivate();
		
		uploadDialog = new Jx.Dialog({
	        label: 'Upload Background Image',
	        image: '/images/page_white_text.png',
	        modal: true,
	        resize: false,
	        move: true,
	        close: true,
	        width: 500,
	        height: 210,
	        vertical: '50 top',
	        contentURL: '/window_upload.html',
	        
	        onClose: function() {
	        	keyboardEvents.activate();
	        },
	        
	        onContentLoaded: function() {
				var link = $('select-0');
				var linkIdle = link.get('html');

				function linkUpdate() {
					if (!swf.uploading) return;
					var size = Swiff.Uploader.formatUnit(swf.size, 'b');
					link.set('html', '<span class="small">' + swf.percentLoaded + '% of ' + size + '</span>');
				}

				// Uploader instance
				var swf = new Swiff.Uploader({
					path: '/resources/js/fancyupload/Swiff.Uploader.swf',
					url: '/upload.cfm',
					verbose: true,
					queued: false,
					multiple: false,
					target: link,
					instantStart: true,
					typeFilter: {
						'Images (*.jpg, *.jpeg, *.gif, *.png)': '*.jpg; *.jpeg; *.gif; *.png'
					},
					fileSizeMax: 2 * 1024 * 1024,
					onSelectSuccess: function(files) {
						if (Browser.Platform.linux) window.alert('Warning: Due to a misbehaviour of Adobe Flash Player on Linux,\nthe browser will probably freeze during the upload process.\nSince you are prepared now, the upload will start right away ...');
						//console.log('Starting Upload', 'Uploading <em>' + files[0].name + '</em> (' + Swiff.Uploader.formatUnit(files[0].size, 'b') + ')');
						this.setEnabled(false);
					},
					onSelectFail: function(files) {
						//console.log('<em>' + files[0].name + '</em> was not added!', 'Please select an image smaller than 2 Mb. (Error: #' + files[0].validationError + ')');
					},
					appendCookieData: true,
					onQueue: linkUpdate,
					onFileComplete: function(file) {
						// We *don't* save the uploaded images, we only take the md5 value and create a monsterid ;)
						if (file.response.error) {
							//console.log('Failed Upload', 'Uploading <em>' + this.fileList[0].name + '</em> failed, please try again. (Error: #' + this.fileList[0].response.design + ' ' + this.fileList[0].response.error + ')');
						} else {
							//var md5 = JSON.decode(file.response.text, true).hash; // secure decode
							var filename = JSON.decode(file.response.text).filename; // secure decode

							
							


							var bgImage = new Asset.image('/resources/images/backgrounds/' + filename, {
								onload: function() {
									var bg = {
										'top':		0, 
										'left':		0,
										'width': 	this.getStyle('width'),
										'height': 	this.getStyle('height'),
										'src':		this.get('src')
									};
									
									console.log("upload image");
									console.log(this, bg);
									buildBGImage(this, bg);
								}
							});
							
							uploadDialog.close();
						}

						file.remove();
						this.setEnabled(true);
					},
					onComplete: function() {
						link.set('html', linkIdle);
					}
				});

				// Button state
				link.addEvents({
					click: function() {
						return false;
					},
					mouseenter: function() {
						this.addClass('hover');
						swf.reposition();
					},
					mouseleave: function() {
						this.removeClass('hover');
						this.blur();
					},
					mousedown: function() {
						this.focus();
					}
				});
			}
		});
		uploadDialog.show();
	} else {
		//var img = $('newBackground');
		//img.setAttribute('src', '/resources/images/transparent.gif');
		uploadDialog.show();
	}
}


function redrawDesign(parts) {
	var newTab = createNewDesign(designName);
	newTab.options.password = designPassword;
	var angle = 0;

	masterTab.add(newTab);

	masterTab.tabSet.tabs[masterTab.tabSet.tabs.length-1].focus();

	parts.each(function(part) {
		if (!$defined(part.angle) || isNaN(part.angle)) {
			angle = 0;
		} else {
			angle = part.angle;
		}

		getActiveTab().makeDesignPart(part.src, part.left, part.top, angle, getPartInfo(part.src, "title"), getPartInfo(part.src, "text"));
	});
}


function redrawPegs(pegs) {
	getActiveTab().drawPegs(pegs);	
}
	
	
function getActiveTab() {
	var tab = null;

	masterTab.tabSet.tabs.each(function(t) {
		if (t.isActive()) {
			tab = t;
		}
	});

	return tab;
}


function getClickedTab(id) {
	var tab = null;

	masterTab.tabSet.tabs.each(function(t) {
		if (t.options.id == id) {
			tab = t;
		}
	});

	return tab;
}


function getMaxTabNumber() {
	var max = 0;
	var parts = null;
	
	masterTab.tabSet.tabs.each(function(t) {
		if (t.options.id.length) {
			parts = t.options.id.split('_');
			if (parts.length == 2) {
				if (!isNaN(parts[1])) {
					if (parseInt(parts[1]) > max) {
						max = parseInt(parts[1]);
					}
				}
			}
		}
	});

	return max;
}


function getNextTabNumber() {
	var max = getMaxTabNumber();

	return max+1;
}


function displayInfo() {
	/*
	if (infoGrid) {
		var colHeaders = [''];
		var rowHeaders = ['Design', 'Parts', 'Selected', 'Dimensions', "Read Only"];

		if (getActiveTab()) {
			var data =	[
			          	 [getActiveTab().getTabName() == null ? 'None' : getActiveTab().getTabName()],
						 [getActiveTab().getParts().length],
						 [getActiveTab().getSelectedParts().length],
			          	 //[getActiveTab().options.designDimensions.width + '"' + " x " + getActiveTab().options.designDimensions.height + '"'],
						 ['0 x 0'],
			          	 [getActiveTab().getIsReadOnly()]
			          	  ];
		} else {
			var data =	[
			          	 [''],
			          	 [0],
			          	 [0],
			          	 ['0" x 0"'],
			          	 [false]
			          	  ];
		}

		infoGridModel = new Jx.Grid.Model(data, {
			rowHeaders: rowHeaders,
			columnHeaders: colHeaders,
			rowHeaderWidth: 100,
			colWidth: 200
		});

		infoGrid.setModel(infoGridModel);
	}
	*/
}


function calculateDimensions() {
	getActiveTab().calculateDimensions();
	var msg = 'For 1/8" Holes: '  + getActiveTab().options.dimensions.width + '" Wide x ' + getActiveTab().options.dimensions.height + '" High<br />'; 
	msg = msg + 'For 1/16" Holes: ' + getActiveTab().options.dimensions.width/2 + '" Wide x ' + getActiveTab().options.dimensions.height/2 + '" High<br />'; 
	msg = msg + 'For 1/4" Holes: ' + getActiveTab().options.dimensions.width*2 + '" Wide x ' + getActiveTab().options.dimensions.height*2 + '" High'; 
	doAlert('Estimated Dimensions For ' + getActiveTab().getParts().length + ' Parts' , msg);
}


/*******************************************************************************
 * Toolbar
 ******************************************************************************/
function doNewDesign() {
	getActiveTab().getParts().each(function(part) {
		part.destroy();
	});

	designName = null;
	designPassword	= null;
	designIsDirty = false;

	displayInfo();
}


function createNewDesign(name) {
	if (!$defined(name)) {
		label = 'Untitled';
		name = '';
	} else {
		label = name;
	}

	var tab = new Jx.Button.DesignerTab({
		label: label,
		image: iconDesign,
		close: true,
		active: true,
		name: name,
		id: 'tab_'+getNextTabNumber()
	});

	return tab;
}


function startNewDesign() {
	var newTab = createNewDesign();
	masterTab.add(newTab);

	masterTab.tabSet.tabs[masterTab.tabSet.tabs.length-1].focus();
}


function designToJSON() {
	if (closeDesignTab) {
		parts = closeDesignTab.content.getElements('.part');
	} else {
		parts = getActiveTab().getParts();
	}
	
	var data = new Array();
	
	if (parts.length) {
		parts.each(function(part) {
			var angle = parseInt(part.retrieve('angle'));
			if (!angle) {
				angle=0;
			}
			var curPart = {
					src: part.getAttribute('src'),
					top: parseInt(part.getStyle('top')),
					left: parseInt(part.getStyle('left')),
					width: parseInt(part.getWidth()),
					height: parseInt(part.getHeight()),
					angle: parseInt(angle)
			};
			data.push(curPart);
		});
	}
	
	return JSON.encode(data);
}


function pegsToJSON() {
	if (closeDesignTab) {
		var pegs = closeDesignTab.content.getElements('.peg_point');
	} else {
		var pegs = getActiveTab().getPegs();
	}

	var data = new Array();

	if (pegs.length) {
		pegs.each(function(peg) {
			var curPeg = {
				top: parseInt(peg.getStyle('top')),
				left: parseInt(peg.getStyle('left')),
				class: peg.getAttribute('class'),
				boardXPos: parseInt(peg.retrieve('boardXPos')),
				boardYPos: parseInt(peg.retrieve('boardYPos'))
			};
			data.push(curPeg);
		});
	}

	return JSON.encode(data);
}


function backgroundsToJSON() {
	var bgs = getActiveTab().content.getElements('.patternContainer');

	var data = new Array();

	if (bgs.length) {
		bgs.each(function(bg) {
			var angle = parseInt(bg.retrieve('angle'));
			if (!angle) {
				angle=0;
			}
			
			var BGdims = bg.getCoordinates();
			var BGIdims = bg.getElement('.patternImage').getCoordinates();
			
			var curBG = {
					src: bg.getElement('.patternImage').getAttribute('src'),
					top: BGdims.top-50,
					left: BGdims.left,
					width: BGIdims.width,
					height: BGIdims.height,
					angle: parseInt(angle)
			};
			data.push(curBG);
		});
	}

	return JSON.encode(data);
}


function trackMousePosition(e) {
	mousePositionX = e.event.layerX;
	mousePositionY = e.event.layerY;
}


function emptyClipboard() {
	clipboard = new Array();
}


function showHelp() {
	if (!helpWindow) {
		new Jx.Dialog({
	        label: 'Help',
	        image: '/images/page_white_text.png',
	        modal: false,
	        resize: false,
	        move: true,
	        close: true,
	        width: 600,
	        height: 530,
	        vertical: '50 top',
	        contentURL: '/window_help.html',
	        onContentLoaded: function() {
				helpWindow = true;
			},
	        onClose: function() {
	    		helpWindow = false;
	    	}
	    }).open();
	}

	return true;
}


function doReloadPage() {
	window.location.reload();
}


function reloadPage(e) {
	e.preventDefault();
	e.stop();
	e.stopPropagation();

	doConfirm('Reload Page', 'Are sure you want to reload the page?', {label: 'Yes', func: doReloadPage, icon: iconYes}, {label: 'No', func: null, icon: iconNo});
}


function sendDesignQuote() {
}


function requestDesignQuote() {
	doInputDialog(400, 300, 'Request Quote', '/window_request_info.html', {designName: getActiveTab().getTabName()}, {label: 'Okay', icon: iconYes, func: sendDesignQuote}, {label: 'Cancel', icon: iconNo});
}


function buildMenu(where) {
    /* put together some sub menus for the context menu */
    var fileMenu = new Jx.Menu.SubMenu({label: 'File', image: iconDesign});
    fileMenu.add(
        new Jx.Menu.Item({
            label: 'New',
            imageClass: 'file-new',
        	image: iconFileNew,
        	onClick: startNewDesign
        }),
        new Jx.Menu.Item({
            label: 'Open',
            imageClass: 'file-open',
            image: iconOpen,
            onClick: function() {
            	listDesigns($('designsList'), true);
            }
        }),
        new Jx.Menu.Item({
            label: 'Save',
            imageClass: 'file-save',
            image: iconFileSave,
            onClick: saveDesign
        }),
        new Jx.Menu.Item({
            label: 'Save As',
            imageClass: 'file-save-as',
            image: iconFileSaveAs,
            onClick: saveDesignAs
        })
    );
	//menuContextDesign = new Jx.Menu.Context(document.body).add(designMenu);



    var editMenu = new Jx.Menu.SubMenu({label: 'Edit', image: '/resources/images/icons/pencil--plus.png'});
    editMenu.add(
        new Jx.Menu.Item({
            label: 'Copy',
            imageClass: 'edit-copy',
            image: iconEditCopy,
           	onClick: function() {
           		clipboard = getActiveTab().copyCutParts(false);
           	}
        }),
        new Jx.Menu.Item({
            label: 'Cut',
            imageClass: 'edit-cut',
            image: iconEditCut,
           	onClick: function() {
           		clipboard = getActiveTab().copyCutParts(true);
           	}
        }),
        new Jx.Menu.Item({
            label: 'Paste',
            imageClass: 'edit-paste',
            image: iconEditPaste,
           	onClick: function() {
           		getActiveTab().pasteParts(clipboard, true);
           	}
        }),
        new Jx.Menu.Item({
            label: 'Empty Clipboard',
            imageClass: 'edit-paste',
            image: iconEditEmpty,
           	onClick: function() {
           		emptylipboard();
           	}
        }),
        new Jx.Menu.Separator(),
        new Jx.Menu.Item({
            label: 'Select All',
            imageClass: 'edit-copy',
            image: iconSelectAll,
           	onClick: function() {
           		getActiveTab().selectAllParts();
           	}
        }),
        new Jx.Menu.Item({
            label: 'Unselect All',
            imageClass: 'edit-paste',
            image: iconSelectNone,
           	onClick: function() {
           		getActiveTab().unselectAllParts();
           	}
        }),
        new Jx.Menu.Separator(),
        new Jx.Menu.Item({
            label: 'Delete',
            imageClass: 'edit-copy',
            image: iconDelete,
           	onClick: function() {
           		getActiveTab().deleteParts();
           	}
        }),
        new Jx.Menu.Item({
            label: 'Duplicate',
            imageClass: 'edit-paste',
            image: iconDuplicate,
           	onClick: function() {
           		getActiveTab().duplicateParts();
           	}
        })
    );

    
    var viewMenu = new Jx.Menu.SubMenu({label: 'View', image: iconDesign});
	viewMenu.add(
        new Jx.Menu.Item({
            label: 'Full',
            imageClass: 'view-new',
        	image: '/resources/images/icons/document--pencil.png',
        	onClick: setPartTypeFull
		}),	        	
		new Jx.Menu.Item({
			label: 'No Lanes',
			imageClass: 'view-new',
			image: '/resources/images/icons/document--pencil.png',
        	onClick: setPartTypeNoLanes
		}),
		new Jx.Menu.Item({
			label: 'No Ends',
			imageClass: 'view-new',
			image: '/resources/images/icons/document--pencil.png',
        	onClick: setPartTypeNoEnds
		}),
        new Jx.Menu.Item({
            label: 'Cross Hairs',
            imageClass: 'view-new',
        	image: '/resources/images/icons/document--pencil.png',
        	onClick: setPartTypeCrossHairs
        })
    );


    var rotateMenu = new Jx.Menu.SubMenu({label: 'Rotate', image: '/resources/images/icons/arrow-circle-double.png'});
    rotateMenu.add(
        new Jx.Menu.Item({
            label: 'Clockwise',
            toggle: true,
            imageClass: 'format-text-bold',
            image: iconRotateCW,
           	onClick: function() {
           		getActiveTab().rotatePart(false);
           	}
        }),
        new Jx.Menu.Item({
            label: 'Counter Clockwise',
            toggle: true,
            imageClass: 'format-text-bold',
            image: iconRotateCCW,
           	onClick: function() {
           		getActiveTab().rotatePart(true);
           	}
        }),
        new Jx.Menu.Separator(),
        new Jx.Menu.Item({
            label: 'Mirror Left',
            toggle: true,
            imageClass: 'format-text-bold',
            image: iconMirrorLeft,
           	onClick: function() {
           		getActiveTab().mirrorPart(true);
           	}
        }),
        new Jx.Menu.Item({
            label: 'Mirror Right',
            toggle: true,
            imageClass: 'format-text-bold',
            image: iconMirrorRight,
           	onClick: function() {
           		getActiveTab().mirrorPart(false);
           	}
        }),
        new Jx.Menu.Separator(),
        new Jx.Menu.Item({
            label: 'Flip Down',
            toggle: true,
            imageClass: 'format-text-bold',
            image: iconFlipDown,
           	onClick: function() {
           		getActiveTab().flipPart(false);
           	}
        }),
        new Jx.Menu.Item({
            label: 'Flip Up',
            toggle: true,
            imageClass: 'format-text-bold',
            image: iconFlipUp,
           	onClick: function() {
           		getActiveTab().flipPart(true);
           	}
        })
    );

    if (where == 'context') {
    	new Jx.Menu.Context(document.body).add(fileMenu,editMenu,viewMenu,rotateMenu);
    } else {
    	masterToolbar.add(fileMenu,editMenu,viewMenu,rotateMenu);
    }
}


function makePanelSet() {
    infoGrid = new Jx.Grid({
        alternateRowColors: false,
        rowHeaders: true,
        columnHeaders: true,
        rowPrelight: false,
        columnPrelight: false,
        rowHeaderPrelight: false,
        columnHeaderPrelight: false,
        cellPrelight: false,
        rowSelection: false,
        columnSelection: false,
        cellSelection: false
    });

    var panelSet = new Jx.PanelSet({panels: [
         new Jx.Panel({
             label: 'Parts',
             maximize: true,
             collapse: false,
             height: 150,
	         contentURL: '/window_toolbar_parts.html',
	         onContentLoaded: function() {
	        	 initToolbar();
  	         }
         }),

         new Jx.Panel({
             label: 'Pegs',
             maximize: true,
             collapse: false,
             height: 85,
	         contentURL: '/window_toolbar_pegs.html',
	         onContentLoaded: function() {
	        	 initToolbar();
	        	 $('tb_peg_white').fireEvent('click');
  	         }
         }),

         new Jx.Panel({
        	 label: 'Part Groups - Click To Show Parts',
        	 maximize: true,
        	 collapse: false,
        	 height: 160,
        	 contentURL: '/window_parts.html',
        	 id: 'partgroupbin',
        	 onContentLoaded: function() {
        	 	initParts();
         	 }
         })
		 /*
		 ,

         new Jx.Panel({
        	 id: 'infoPanel',
             label: 'Design Information',
             maximize: true,
             collapse: false,
             height: 170,
             content: infoGrid
      	})
      	*/
    ]});

	new Jx.Dialog({
        label: '',
        image: '/images/page_white_text.png',
        modal: false,
        resize: true,
        move: true,
        close: false,
        width: 380,
        height: 515,
        vertical: '50 top',
        horizontal: '-30 right',
        content: panelSet
    }).open();
}


function initParts() {
	var binParts = $$('.binpart');
	binParts.each(function(binPart) {
		binPart.setAttribute('src', binPart.getAttribute('src').toLowerCase().replace('/full/', '/'+partType+'/'));
	});

	
	var binListParts = $$('.binlistpart');
	binListParts.each(function(binListPart) {
		binListPart.addEvent('click', function() {
			var binListPartChildren = $(binListPart.getAttribute('id')+'_children');
			
			if (binListPartChildren) {
				//if (binListPartChildren.getStyle('display') == 'block') {
				//	binListPartChildren.setStyle('display', 'none');
				//} else {
					binListPartChildren.setStyle('display', 'block');
					var dialogName = binListPart.getAttribute('rel').split('::')[0].replace(' ', '_');
					var dialogTitle = binListPart.getAttribute('rel').split('::')[0];
					if (!partDialogs.contains(dialogName)) {
						partDialogs[dialogName] = new Jx.Dialog({
					        label: dialogTitle + ' - Drag to Design',
					        image: '/images/page_white_text.png',
					        modal: false,
					        resize: true,
					        move: true,
					        close: true,
					        width: 350,
					        height: 350,
					        vertical: '250 top',
					        horizontal: '-250 right',
					        content: $(binListPart.getAttribute('id')+'_children')
					    });
					}
				    partDialogs[dialogName].open();
				//}
			} else {
				//var newPart = getActiveTab().makeDesignPart(binPart.getAttribute('src'), 10, 10, binPart.retrieve('angle'));
			}
		});
	});

	// Drag and Drop from part Dialog Boxes to Design
	$$('.binpart').each(function(el){
		el.makeGhostDraggable({
			//droppables: $$('.tabContent'),
			droppables: $$('.designTabContent'),

			onStart: function(el, evt) {
	            var curleft=0, curtop=0;
	            var client = evt.client;
	            
	            do {
	                curleft += parseInt(el.offsetLeft);
	                curtop += parseInt(el.offsetTop);
	            } while (el = el.offsetParent);
	
	            this.offsets = {x: client.x-curleft+10, y: client.y-curtop+50};
	            this.xOffset = client.x-curleft+10;
	            this.yOffset = client.y-curtop+50;
			},

			onDrop: function(element, droppable, event) {
				if (element && getActiveTab() && $defined(getActiveTab().options.dimensions)) {
					getActiveTab().makeDesignPart(element.getAttribute('src'), parseInt(event.client.x)-this.xOffset-17, parseInt(event.client.y)-this.yOffset-9, element.retrieve('angle'), element.retrieve('tip:title'), element.retrieve('tip:text'));
				}
			}
		
		});
	});

	$$('.binpart').setStyles({
		'position': 'relative'
	});
}


/*******************************************************************************
 * Dialog Boxes
 ******************************************************************************/
function doNotice(title, message) {
	return doConfirm(title, message);
}


function doAlert(title, message) {
	return doConfirm(title, message, {label: 'Okay', func: null, icon: iconYes});
}


function doConfirm(title, question) {
	var dialog;
	var tbBottom = new Jx.Toolbar({position: 'bottom'});
	var arg;
	
	if (arguments.length > 2) {
		for (arg=2; arg<arguments.length; arg++) {
			var but = arguments[arg];

			but.button = new Jx.Button({
				id: 'button_'+arg,
				image: but.icon,
				label: but.label,
				func: but.func,
				onClick: function() {
					closeDialog(dialog);
					if (this.options.func) {
						this.options.func();
					}
	        	}
	        });

			tbBottom.add(but.button);
		}
	}
	
    dialog = new Jx.Dialog({
        label: title,
        collapse: false,
        modal: true,
        resize: false,
        move: true,
        close: false,
        width: 400,
        height: 160,
        vertical: (window.getScroll().y+50)+' top',
        //content: '<div id="vertical"><div id="hoz"><h1>' + question + '</h1></div></div>',
        content: '<div id="hoz"><h1>' + '<br />'+question + '</h1></div>',
        onContentLoaded: function() {
    		keyboardEvents.deactivate();
			dialog = this;
		},
		onContentLoadFailed: function() {
			dialog.close();
		},
		onClose: function() {
			keyboardEvents.activate();
		},
        toolbars:[tbBottom]
    });

    dialog.open();

    return dialog;
}


function doInputDialog(width, height, title, formUrl, fieldValues) {
	var dialog;
	var tbBottom = new Jx.Toolbar({position: 'bottom'});
	var arg;

	if (arguments.length > 5) {
		for (arg=5; arg<arguments.length; arg++) {
			var but = arguments[arg];

			but.button = new Jx.Button({
				id: 'button_'+arg,
				image: but.icon,
				label: but.label,
				func: but.func,
				onClick: function() {
					if (this.options.func) {
						this.options.func(dialog.contentContainer.getElement('form').toQueryString());
					}
					dialog.contentContainer.getElement('form').destroy();
					closeDialog(dialog);
	        	}
	        });

			tbBottom.add(but.button);
		}
	}

    dialog = new Jx.Dialog({
        label: title,
        collapse: false,
        modal: true,
        resize: false,
        move: true,
        close: false,
        width: width,
        height: height,
        vertical: (window.getScroll().y+50)+' top',
        contentURL: formUrl,
        onContentLoaded: function() {
    		keyboardEvents.deactivate();
    		
			dialog = this;
			var properties = '';

			for (var propertyName in fieldValues) {
				// 	Check if it's NOT a function
				if (!(fieldValues[propertyName] instanceof Function)) {
					if (dialog.contentContainer.getElement('form').getElement('input#'+propertyName+'.dialogInput')) {
						dialog.contentContainer.getElement('form').getElement('input#'+propertyName+'.dialogInput').value = fieldValues[propertyName];
					}
				}
			}
		},
        toolbars:[tbBottom]
    });

    dialog.open();

    return dialog;
}


function doTimedMessage(title, question, seconds) {
	var dialog;

    dialog = new Jx.Dialog({
        label: title,
        collapse: false,
        modal: true,
        resize: false,
        move: true,
        close: false,
        width: 400,
        height: 160,
        vertical: '50 top',
        content: '<div id="vertical"><div id="hoz"><h1>' + question + '</h1></div></div>',
        onContentLoaded: function() {
        	dialog = this;
        	setTimeout(function(){closeDialog(dialog); dialog = null}, seconds * 1000);
		}
    });

    dialog.open();

    return dialog;
}


function closeDialog(dialog) {
	keyboardEvents.activate();
	dialog.close();
}


function showIntroduction() {
    dialog = new Jx.Dialog({
        label: 'Introduction',
        collapse: false,
        modal: true,
        resize: false,
        move: true,
        close: true,
        width: 500,
        height: 630,
        vertical: '50 top',
        contentURL: '/window_introduction.html',
        onClose: doDidYouKnow  //listDesigns
    }).open();
}
// Onload.add(showIntroduction);
//} if (parseUrl().url.toLowerCase().contains('cribboards.com')) { Onload.add(showIntroduction); }
//Onload.add(listDesigns);




/*******************************************************************************
 * Did You Know
 ******************************************************************************/
function nextDidYouKnow() {
	if (++DidYouKnow > DidYouKnowCount)
		DidYouKnow = 1;
	doDidYouKnow();
}


function prevDidYouKnow() {
	if (--DidYouKnow < 1)
		DidYouKnow = DidYouKnowCount;
	doDidYouKnow();
}


function closeDidYouKnowDialog() {
	didYouKnowDialog.close();
}


function doDidYouKnow() {
	var num = DidYouKnow;
	var numStr = '';

	if (num < 10) {
		numStr = '0' + num;
	} else {
		numStr = num;
	}

	if (!didYouKnowDialog) {
		var tbBottom = new Jx.Toolbar({position: 'bottom'});
		butPrev = new Jx.Button({
			id: 'button_next',
			image: iconPrev,
			label: 'Prev',
			onClick: prevDidYouKnow
	    });
		tbBottom.add(butPrev);

		butClose = new Jx.Button({
			id: 'button_close',
			image: iconClose,
			label: 'Close',
			onClick: closeDidYouKnowDialog
	    });
		tbBottom.add(butClose);

		butNext = new Jx.Button({
			id: 'button_next',
			image: iconNext,
			label: 'Next',
			onClick: nextDidYouKnow
	    });
		tbBottom.add(butNext);

	    didYouKnowDialog = new Jx.Dialog({
	        label: 'Did You Know',
	        collapse: false,
	        modal: true,
	        resize: false,
	        move: true,
	        close: true,
	        width: 400,
	        height: 200,
	        vertical: '50 top',
	        contentURL: '/DidYouKnow_'+numStr+'.html',
	        onContentLoaded: function() {
				didYouKnowDialog = this;
			},
			onContentLoadFailed: function() {
				didYouKnowDialog.close();
			},
			onClose: function() {
				//listDesigns($('designsList'), true);
			},
	        toolbars:[tbBottom]
	    });
		didYouKnowDialog.open();
	} else {
		didYouKnowDialog.openURL('/DidYouKnow_'+numStr+'.html');
	}
} if (!window.location.href.toLowerCase().contains('design=')) { Onload.add(doDidYouKnow); }


function randRange(from,to) {
	return Math.floor((to-(from-1))*Math.random()) + from;
}


function doSendMessage(qryParams) {
	var myHTMLRequest = new Request( {
		url :'/sendMessage.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			if (JSON.decode(responseText).saved) {
				doAlert("Message Sent", "Thank you, your message has been sent.");
			} else {
				doAlert("Error", "Sorry, we could not send the message.");
			}
		}
	}).send(qryParams);
}


function sendMessage() {
	doInputDialog(400, 250, 'Send Us A Message', '/window_sendmessage.html', null, {label: 'Okay', icon: iconYes, func: doSendMessage}, {label: 'Cancel', icon: iconNo});
}




/*******************************************************************************
 * Cart
 ******************************************************************************/
function payPalSingle(product) {
	var params = 'https://www.paypal.com/cgi-bin/webscr?cmd=_xclick&business=thefamilywoodshed@yahoo.com';
	params = params + '&item_name=' + product.name;
	params = params + '&item_number=' + product.sku;
	params = params + '&amount=' + product.price;

	window.location.href=params;
}


function payPalCart() {
	var params = 'https://www.paypal.com/cgi-bin/webscr?cmd=_cart&upload=1&business=thefamilywoodshed@yahoo.com';
	//var params = 'https://www.sandbox.paypal.com/cgi-bin/webscr?cmd=_cart&upload=1&business=thefamilywoodshed@yahoo.com';
	params = params + '&return=http://www.customcribboards.com/builder.html%3Fcontent=OrderRecieved';

	cart.each(function(product, index) {
		params = params + '&item_name_' 	+ parseInt(index+1) + '=' + product.design;
		params = params + '&item_number_' 	+ parseInt(index+1) + '=' + product.design;
		params = params + '&amount_' 		+ parseInt(index+1) + '=' + designPrice;
		params = params + '&quantity_' 		+ parseInt(index+1) + '=' + product.quantity;
	});

	window.location.href=params;
}


function addToCart(name) {
	if (!$defined(name)) {
		name = getActiveTab().getTabName();
	}
	var updated = false;
	var product = new Object();

	if (name && name.length) {
		product.design = name;
		product.quantity = 1;

		readCart();

		if (cart) {
			if (cart.length) {
				for (var p=0; p<cart.length; p++) {
					if (cart[p].design == product.design) {
						cart[p].quantity++;
						updated = true;
					}
				}
			}
		} else {
			cart = new Array();
		}

		if (!updated) {
			product.quantity = 1;
			cart.push(product);
		}

		writeCart();
		displayCart();
	}
}


function readCart() {
	cart = JSON.decode(Cookie.read('cart'));
	if (!cart) {
		cart = new Array();
	}
} Onload.add(readCart);


function writeCart() {
	Cookie.write('cart', JSON.encode(cart));
}


function clearCart() {
	Cookie.destroy('cart');
}


function displayCart() {
	if (cart.length) {
		var cartContents = '';

	    var cartGrid = new Jx.Grid({
	        alternateRowColors: false,
	        rowHeaders: true,
	        columnHeaders: true,
	        rowPrelight: false,
	        columnPrelight: false,
	        rowHeaderPrelight: false,
	        columnHeaderPrelight: false,
	        cellPrelight: false,
	        rowSelection: false,
	        columnSelection: false,
	        cellSelection: false
	    });


		var colHeaders = ['Item', 'Quantity', 'Price', 'Item Total'];
		var rowHeaders = [	];
		var data = [];

		var total = 0;
		for (var ci=0; ci<cart.length; ci++) {
			var cr = new Array();
			cr[0] = cart[ci].design;
			cr[1] = cart[ci].quantity;
			cr[2] = dollarFormat(designPrice);
			cr[3] = dollarFormat(designPrice * cart[ci].quantity);

			total = total + (designPrice * cart[ci].quantity);

			data[data.length] = cr;
		}

		var cr = new Array();
		cr[0] = '';
		cr[1] = '';
		cr[2] = '';
		cr[3] = dollarFormat(total);
		data[data.length] = cr;


		cartGridModel = new Jx.Grid.Model(data, {
			rowHeaders: rowHeaders,
			columnHeaders: colHeaders,
			rowHeaderWidth: 100,
			colWidth: 100,
			rowHeight: 30
		});

		cartGrid.setModel(cartGridModel);

		var tbBottom = new Jx.Toolbar({position: 'bottom'});
		var button = new Jx.Button({
			image: iconCart,
			label: 'Checkout',
			onClick: function() {
				payPalCart();
	    	}
	    });

		tbBottom.add(button);

		cartDialog = new Jx.Dialog({
	        label: 'Your Cart',
	        image: '/images/page_white_text.png',
	        modal: true,
	        resize: false,
	        move: false,
	        close: true,
	        width: 550,
	        height: 300,
	        vertical: '50 top',
	        content: cartGrid.domObj,

	        onClose: function() {
	        	cartDialog = null;
	        },

	        toolbars: [tbBottom]
		});

		var els = cartGrid.rowTable.getChildren().getChildren();
		els = els[0];

		for (var row = 1; row<els.length; row++) {
			var el = els[row].getChildren();
			var elem = el[1];

			if (row < els.length-2) {
				createButtons(row, elem);
			} else {
				addTotalLabel(row, elem);
			}
		}

		cartDialog.open();
	} else {
		doAlert('Notice', "You're cart is currently empty");
	}
}


function createButtons(row, el) {
	new Jx.Button({
		image: iconCartPlus,
		tooltip: 'Increase Quantity',
		onClick: function() {
			cartDialog.close();
			changeCartQuantityByRow(row-1, 1);
		}
	}).addTo(el);

	new Jx.Button({
		image: iconCartMinus,
		tooltip: 'Decrease Quantity',
		onClick: function() {
			cartDialog.close();
			changeCartQuantityByRow(row-1, -1);
		}
	}).addTo(el);

	new Jx.Button({
        image: iconCartDelete,
		tooltip: 'Remove From Cart',
        onClick: function() {
			cartDialog.close();
			removeFromCartByRow(row-1);
        }
    }).addTo(el);
}


function addTotalLabel(row, el) {
	new Jx.Button({
		image: iconCart,
		label: 'Cart Total',
		tooltip: 'Cart Total',
		enabled: false
	}).addTo(el);
}


function removeFromCart(design) {
	readCart();

	cart.each(function(product, index) {
		if (product.design == design) {
			cart.splice(index, 1);

			writeCart();
		}
	});
}


function removeFromCartByRow(row) {
	readCart();

	cart.each(function(product, index) {
		if (index == row) {
			cart.splice(index, 1);

			writeCart();

			displayCart();
		}
	});
}


function changeCartQuantity(design, qty) {
	readCart();

	cart.each(function(product, index) {
		if (product.design == design) {
			var newQty = cart[index].quantity + qty;

			if (newQty >= 1) {
				cart[index].quantity = newQty;

				writeCart();

				displayCart();
			}
		}
	});
}


function changeCartQuantityByRow(row, qty) {
	readCart();

	cart.each(function(product, index) {
		if (index == row) {
			var newQty = cart[index].quantity + qty;

			if (newQty >= 1) {
				cart[index].quantity = newQty;

				writeCart();
			}

			displayCart();
		}
	});
}


function redrawCartItem(design) {
	cart.each(function(product, index) {
		if (product.design == design) {
		}
	});
}


function dollarFormat(num) {
	num = num.toString().replace(/\$|\,/g,'');

	if(isNaN(num))
		num = "0";

	var sign = (num == (num = Math.abs(num)));

	num = Math.floor(num*100+0.50000000001);
	var cents = num%100;
	num = Math.floor(num/100).toString();

	if(cents<10)
		cents = "0" + cents;

	for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
		num = num.substring(0,num.length-(4*i+3))+','+

	num.substring(num.length-(4*i+3));

	return (((sign)?'':'-') + '$' + num + '.' + cents);
}




/*******************************************************************************
 * Woods
 ******************************************************************************/
function listWoods(index) {
	if (!$defined(index)) {
		index='';
	}

	keyboardEvents.deactivate();

	var myHTMLRequest = new Request( {
		url :'/listWoods.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			var woodsData = JSON.decode(responseText);
			var woods = new Array();

			if (woodsData.recordcount) {
				for (var w=0; w<woodsData.recordcount; w++) {
					var obj = { name: woodsData.data.NAME[w].toString().replace('.jpg', ''), modified: woodsData.data.MODIFIED[w].toString() };
					woods.push(obj);
				}

				displayWoodsList(woods);
			}
		}
	}).send('index='+index);
}


function displayWoodsList(list) {
	if (!woodsDialog) {
		woodsDialog = new Jx.Dialog({
	        label: 'Browse Woods',
	        image: '/images/page_white_text.png',
	        modal: true,
	        resize: false,
	        move: true,
	        close: true,
	        width: 735,
	        height: 400,
	        vertical: '50 top',
	        contentURL: '/window_woods.html',

	        onContentLoaded: function() {
				keyboardEvents.deactivate();

			    new Jx.Button({
					id: 'useWood',
					label: 'Use As Background',
					image: iconOpen,
					tooltip: 'Click To Use As Background',
					onClick: function() {
						var background = "url('/resources/images/woods/large/" + escape(woodPreviewName) + ".jpg')";
						getActiveTab().setBackground('image', background);
			    	}
			    }).addTo('woodsAction');

				var letters = $$('.woodLetter');
				letters.each(function(letter) {
					letter.addEvent('click', function() {
						var let = letter.get('html');
						listWoods(let);
					});
				});

			    buildWoodsList(list);
	        },

	        onClose: function() {
	        	keyboardEvents.activate();
	        }
		});
	} else {
		buildWoodsList(list);
	}
}


function buildWoodsList(list) {
	$('woodsList').empty();

	list.each(function(wood, idx) {
		var dl = new Element('div');

		dl.addClass('woodPreview');

		if (wood.name.length) {
			var txt = new Element('span');
			txt.setStyles({
				'font-size': '8px',
				'font-weight': 'normal',
				'float': 'left',
				'clear': 'right',
				'background': '#000000',
				'color': '#ffffff',
				'width': '100px',
				'height': '20px',
				'overflow': 'hidden'
			});
			txt.set('html', wood.name);
			txt.inject(dl);

			var dt = wood.modified.replace("{ts \'", "");
			dt = dt.replace("\'}", "");
			dt = dt.replace("-", "");
			dt = dt.replace("-", "");
			dt = dt.replace(":", "");
			dt = dt.replace(":", "");

			var ico = new Element('img');
			ico.setAttribute('src', '/resources/images/woods/small/' + escape(wood.name) + '.jpg?id='+dt);
			ico.setAttribute('alt', wood.name);
			ico.setAttribute('title', wood.name);
			ico.setStyles({
				'padding': '1px 1px 1px 1px',
				'vertical-align': 'bottom'
			});

			dl.setAttribute('href', '/resources/images/woods/large/' + escape(wood.name) + '.jpg?id='+dt);
			dl.addClass('icon');

			ico.inject(dl);
		}

		dl.addEvent('click', function() {
			woodPreviewName = wood.name;
			$('woodsImage').empty();
			var di = new Element('img');
			di.setAttribute('src', '/resources/images/woods/large/' + escape(wood.name) + '.jpg?id='+dt);
			di.inject($('woodsImage'));

			$('woodPreviewName').value = wood.name;
		});

		dl.addEvent('dblclick', function() {
			var background = "url('/resources/images/woods/large/" + escape(wood.name) + ".jpg')";
			getActiveTab().setBackground('image', background);
			woodsDialog.close();
		});

		dl.addEvent('mouseenter', function() {
			dl.addClass('overDesignIconBox');
		});

		dl.addEvent('mouseleave', function() {
			dl.removeClass('overDesignIconBox');
		});

		dl.inject($('woodsList'));
	});

	woodsDialog.open();
}


/*******************************************************************************
 * Pattern File Generation
 ******************************************************************************/
function buildHires(design) {
	var myHTMLRequest = new Request( {
		url :'/buildHires.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
		if (JSON.decode(responseText).saved) {
			doAlert("Build Hires", "Your hires image has been generated");
		} else {
			if (JSON.decode(responseText).error) {
				doAlert("Error", JSON.decode(responseText).error);
			} else {
				doAlert("Error", "Sorry, we could not generate your hires image");
			}
		}
	}
	}).send('design='+design);
}


function buildPDF(design) {
	var myHTMLRequest = new Request( {
		url :'/buildPDF.cfm',
		method :'post',
		onSuccess : function(responseText, responseXML) {
			if (JSON.decode(responseText).saved) {
				doAlert("Build PDF", "Your PDF has been generated");
			} else {
				if (JSON.decode(responseText).error) {
					doAlert("Error", JSON.decode(responseText).error);
				} else {
					doAlert("Error", "Sorry, we could not generate your PDF");
				}
			}
		}
	}).send('design='+design);
}


function loadAllParts() {
	var productsXML = '/resources/xml/parts.xml';
	
	var partgroupbin = $('partgroupbin');
	partgroupbin.empty();
	
	var myHTMLRequest = new Request( {
		url: productsXML,
		method: 'get',
		wait: true,
		async: false,
		
		onSuccess: function(responseText, responseXML) {
			partGroups = new Array();
			
			partsXML = responseXML;
			var groups = partsXML.getElementsByTagName('group');
			
			for(var mc=0; mc<groups.length; mc++) {
				var groupImg = new Element('img', {
					title: 	'Group::'+groups[mc].getAttribute('title'),
					rel: 	groups[mc].getAttribute('title'),
					src: 	'/resources/images/parts/icons/' + groups[mc].getAttribute('image'),
					class:	'binlistpart tip',
					id:		'blp_'+groups[mc].getAttribute('id')
				}).inject(partgroupbin);
				
				var groupDiv = new Element('div', {
					id: 'blp_'+groups[mc].getAttribute('id')+'_children',
					styles: {
						'display': 'none'
					}
				});
				
				var parts = groups[mc].getElementsByTagName('part');

				for(var sc=0; sc<parts.length; sc++) {
					var part = new Element('img', {
						title: 	groups[mc].getAttribute('title')+'::'+parts[sc].getAttribute('title'),
						rel: 	parts[sc].getAttribute('title'),
						src: 	'/resources/images/parts/Small/CrossHairs/000/'+parts[sc].getAttribute('image'),
						id:		'part_'+mc+'_'+sc,
						class:	'binpart tip'
					}).inject(groupDiv);
				}
				
				groupDiv.inject(partgroupbin);	
			};
			
			initParts();
			initTips();
		}
	}).send();
} 


function initTips() {
	var ti = $$('.tip');

	ti.each(function(element,index) {
		var content = element.get('title').split('::');
		element.store('tip:title', content[0]);
		element.store('tip:text', content[1]);
	});
	
	tips = new Tips($$('.tip'), {
		className: 'tip',
		fixed: false,
		hideDelay: 50,
		showDelay: 50
	});

	tips.addEvents({
		'show': function(tip) {
			tip.setStyle('z-index', '9999');
		}
	});
}



/*
String.prototype.trim = function() {
	return this.replace(/^\s+|\s+$/g,"");
}

String.prototype.ltrim = function() {
	return this.replace(/^\s+/,"");
}

String.prototype.rtrim = function() {
	return this.replace(/\s+$/,"");
}
String.prototype.swapcase = function(){
	return this.replace(/([a-z]+)|([A-Z]+)/g,function($0,$1,$2){
		return ($1) ? $0.toUpperCase() : $0.toLowerCase();
	});
}
String.prototype.left = function(chars) {
	return this.substring(0, parseInt(chars));
}
String.prototype.right = function(chars) {
	return this.substring(this.length-chars, this.length);
}
String.prototype.mid = function(start, end) {
	return this.substring(start, end);
}
String.prototype.camelCase = function() {
	var s = this.trim();

	return ( /\S[A-Z]/.test( s ) ) ?
		s.replace( /(.)([A-Z])/g, function(t,a,b) { return a + ' ' + b.toLowerCase(); } ) :
		s.replace( /( )([a-z])/g, function(t,a,b) { return b.toUpperCase(); } );
}
String.prototype.stripTags = function () {
	return this.replace(/<([^>]+)>/g,'');
}
String.prototype.htmlEntities = function() {
   return this.replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;');
}
*/
String.prototype.toHash = function(listSep, hashSep) {
	var h = new Hash();
	var listArray = this.split(listSep);

	for (var i=0; i< listArray.length; i++) {
		var hashArray = listArray[i].split(hashSep);

		var k = null;
		var v = null;

		if (hashArray.length) {
			k = hashArray[0];
			if (hashArray.length == 2) {
				v = hashArray[1];
			}
			h.set(k, v);
		}
	}

	return h;
}