var palMax = 6;
var canvasPadding = 170;
var loading = false;
var saving = false;
var arrPalette = new Array();
var arrCanvas = new Array();
var arrMove = new Array();
var drag;
var divDrag;
var dragStatus = false;
var canvas;
var palette;
var bThumbing = false;
var bDragging = false;
var idCount = 0;
var loadCount = 0;
var initing = true;
var thumbSet = false;

var fromUserId = '';
var fromWardrobeId = '';
var fromStoreId = '';

var rFail = function() {
	loading = false;
	alert('Error loading Outfit Builder');
}

var rSuccess = function(html, xml) {
	$('outfitDisplay').innerHTML = html;
	init();
}

var rThumbSuccess = function(html, xml) {
	var a = html.trim().split('|');
	if(a.length != 10) {
		alert('There was an error loading the thumbnail');
		return false;
	}
	addPalette(a[0], a[1], a[2], a[3], a[4], a[5], a[6], a[7], a[8], a[9]);
	loading = false;
}

var rCropSuccess = function(html, xml) {
	var a = html.trim().split('|');
	if(a.length != 7) {
		alert('There was an error cropping this image');
		return false;
	}
	cropReplace(a[0], a[1], a[2], a[3], a[4], a[5], a[6]);
	hideEnlarged();
}

var rWardASuccess = function(html, xml) {
	$('myOutWardBoxA').innerHTML = html;
	wardrobeAChangeB($('clothingTypeA').options[$('clothingTypeA').selectedIndex].value, $('wardKwA').value, mcEditUser);
}

var rWardBSuccess = function(html, xml) {
	$('myOutWardBoxC').set('html', '');
	$('myOutWardBoxB').set('html', html);
	wardrobeBChangeB($('clothingTypeB').options[$('clothingTypeB').selectedIndex].value, $('wardKwA').value, fromUserId);
}

var rWardCSuccess = function(html, xml) {
	$('myOutWardBoxB').set('html', '');
	$('myOutWardBoxC').set('html', html);
	if($('ShowResults')) $('ShowResults').addEvent('click', filterResults);
}

var rSaveSuccess = function(html, xml) {
	var savedId = html.trim();

	if((savedId == outfitId) || !outfitId) {
		document.location = './?share=' + savedId;
	} else {
		alert('There was an error saving this outfit');
		hideLoading();
	}
}

var r = new Request({method:'get', url:'/my_closet/_includes/outfit2Display.php', onSuccess:rSuccess, onException:rFail, onFailure:rFail, onCancel:rFail});
var rThumb = new Request({method:'get', url:'getThumb.php', onSuccess:rThumbSuccess, onException:rFail, onFailure:rFail, onCancel:rFail});
var rCrop = new Request({method:'get', url:'crop.php', onSuccess:rCropSuccess, onException:rFail, onFailure:rFail, onCancel:rFail});
var rWardA = new Request({method:'get', url:'box.php', onSuccess:rWardASuccess, onException:rFail, onFailure:rFail, onCancel:rFail});
var rWardB = new Request({method:'get', url:'box.php', onSuccess:rWardBSuccess, onException:rFail, onFailure:rFail, onCancel:rFail});
var rWardC = new Request({method:'get', url:'box.php', onSuccess:rWardCSuccess, onException:rFail, onFailure:rFail, onCancel:rFail});
var rSave = new Request({method:'get', url:'save.php', onSuccess:rSaveSuccess, onException:rFail, onFailure:rFail, onCancel:rFail});

<!-- B versions now used for 2 wardrobeA/BChange functions below as of 9/30/09 -->
function wardrobeAChange(trgCat, uid){
	$('wardrobeDisplayA').set('html', 'Searching ...');
	$('wardrobeDisplayA').load('/my_closet/_includes/outfitWardrobe2.php?trgCat='+ trgCat + '&uid=' + uid + '&oid=' + outfitId + '&container=wardrobeDisplayA'+ '&editor=on');
}
function wardrobeAChangeB(trgCat, kw, uid){
	if(kw == 'keywords') kw = '';
	$('wardrobeDisplayA').set('html', 'Searching ...');
	$('wardrobeDisplayA').load('/my_closet/_includes/outfitWardrobe2.php?trgCat='+ trgCat + '&uid=' + uid + '&keywords=' + kw + '&oid=' + outfitId + '&container=wardrobeDisplayA'+ '&editor=on');
}

function wardrobeBChange(trgCat, uid){
	$('wardrobeDisplayB').set('html', 'Searching ...');
	$('wardrobeDisplayB').load('/my_closet/_includes/outfitWardrobe2.php?trgCat='+ trgCat + '&uid=' + uid + '&oid=' + outfitId + '&container=wardrobeDisplayB'+ '&editor=on');
}
function wardrobeBChangeB(trgCat, kw, uid){
	if(kw == 'keywords') kw = '';
	$('wardrobeDisplayB').set('html', 'Searching ...');
	$('wardrobeDisplayB').load('/my_closet/_includes/outfitWardrobe2.php?trgCat='+ trgCat + '&uid=' + uid + '&keywords=' + kw + '&oid=' + outfitId + '&container=wardrobeDisplayB'+ '&editor=on');
}

function editOutfitName() {
	$('OutfitNameShow').setStyle('display', 'none');
	$('OutfitNameEdit').setStyle('display', 'inline');
	$('OutfitNameInput').value = $('OutfitName').get('text');
	$('OutfitNameInput').focus();
}

function saveOutfitName() {
	$('OutfitNameShow').setStyle('display', 'inline');
	$('OutfitNameEdit').setStyle('display', 'none');
	$('OutfitRename').set('text', 'Rename');
	$('OutfitName').set('text', $('OutfitNameInput').value);
}

function editOutfitDesc() {
	$('OutfitDescShow').setStyle('display', 'inline');
	$('OutfitDescEdit').setStyle('display', 'inline');
	$('OutfitDescInput').value = $('OutfitDesc').get('text');
	$('OutfitDescInput').select();
}

function saveOutfitDesc() {
	$('OutfitDescShow').setStyle('display', 'inline');
	$('OutfitDescEdit').setStyle('display', 'none');
	$('OutfitReDesc').set('html', '<a href="#" onclick="editOutfitDesc(); return false;">Edit</a>');
	$('OutfitDesc').set('text', $('OutfitDescInput').value);
}

function addToOutfit(oid, iid){
	addImage(iid);
	divHide('screener');
	$('enLg').load('/flash/blank.php');
	divHide('enLg');
	return false;
}

function addToWishList(oid, iid){
	$('enLg').load('/my_closet/wish_list/add.php?oid='+ oid + '&iid=' + iid + '&addwl=1');
	return false;
}

function updateOutfit(oid, edOn){
//	window.open('/my_closet/_includes/outfit2Display.php?oid=' + oid + '&editor=' + editor);
	r.send('oid=' + oid + '&editor=' + editor + '&userId=' + userId);
//	$('outfitDisplay').load('/my_closet/_includes/outfit2Display.php?oid=' + oid + '&editor=<?=$editor ?>');
	return false;
}

function updateOName(actn){
	if(actn == "edit") {
		var e = $('OutfitName');
		var i = new Element('input', {
			id: 'EditOutfitName'
		});
		e.set('html', '<input name="EditOutfitName" type="text" size="20" maxlength="30" value="' + e.innerHTML + '" class="outfitNameTxt" onblur="" /><input type="submit" name="button" id="button" value="Update" onClick="updateOName();" />');
	}
	if(actn == "show") $('outfitDispName').load('/my_closet/_includes/outfitDispName.php?oid=' + outfitId + '&task=show');
	if(actn == "edit") $('outfitDispName').load('/my_closet/_includes/outfitDispName.php?oid=' + outfitId + '&task=edit');
	if(actn == "store") $('outfitDispName').load('/my_closet/_includes/outfitDispName.php?oid=' + outfitId + '&task=store&oName=' + escape(document.oNameForm.outfitName.value));
	return false;
}

function updateODesc(actn){
	if(actn == "show") $('outfitDispDesc').load('/my_closet/_includes/outfitDispDesc.php?oid=' + outfitId + '&task=show');
	if(actn == "edit") $('outfitDispDesc').load('/my_closet/_includes/outfitDispDesc.php?oid=' + outfitId + '&task=edit');
	if(actn == "store") $('outfitDispDesc').load('/my_closet/_includes/outfitDispDesc.php?oid=' + outfitId + '&task=store&oDesc=' + escape(document.oDescForm.outfitDesc.value));
	return false;
}

function deleteOutfit(oid){
	var ckDel = confirm("Are you sure you want to permanently delete this outfit?")
	if (ckDel){
		window.location.href="./?delId=" + oid;
	}
	return false;
}

var toggleAltWard = function(s, h) {
	divHide('altWard' + h);
	divShow('altWard' + s);
	return false;
}

/*
function showCropTool(iid, yOf, linkId) {
	divHide('enLg');
	$('enLg').load('/flash/showCrop.php?iid='+ iid + '&type=outfit&xdat=' + outfitId + '&linkId=' + linkId + '&yOf=' + yOf);
	divShow('enLg');
	divShow('screener');
	return false; // flash elements do not return
}
*/

function performCrop(iid,linkId,xpos,ypos,width,height){
	rCrop.send('iid=' + iid + '&xpos=' + xpos + '&ypos=' + ypos + '&width=' + width + '&height=' + height + '&linkId=' + linkId); 
}

function usrWardChangeout(disp, srchTrmA, srchTrmB) {
	$('altWardUsrSrch').load('/my_closet/_includes/outfitUserSearch2.php?disp='+ disp + '&srchTrmA=' + srchTrmA + '&srchTrmB=' + srchTrmB + '&oid=' + outfitId + '');
	return false; // flash elements do not return
}

function infoDescToggle(togState){
	if(togState == 0){
		divHide('outCatDesc');
		divShow('outCatLink');
	}
	if(togState == 1){
		divShow('outCatDesc');
		divHide('outCatLink');
	}
	return false;
}

function showCustClMsg(showNum){
	divShow('cliqueCust_' + showNum + '_');
	$('cliqueMsg_' + showNum + '_').focus();
	$('cliqueBx_' + showNum + '_').checked = 1;
	return false;
}

function showCustMsg(showNum){
	divShow('emailCust_' + showNum + '_');
	$('emailMsg_' + showNum + '_').focus();
	return false;
}

var removeOpacity = function(e) {
	e.setStyle('opacity', 1);
	if(Browser.Engine.trident) {
		e.style.removeAttribute('filter');
	}
}

var checkLinks = function() {
	
}

var addLink = function(e) {
	var s = e.split('|');
	var id = s[0];
	var xPos = s[1];
	var yPos = s[2];
	var pSlot = s[3];
	
	if(editor) {
		addImage(id);
		
		if(pSlot == 0) {
			arrMove.include(e);
		}
	} else {
		if(pSlot == 0) {
			arrMove.include(e);
			addImage(id);
		} else {
			if(loadCount) loadCount--;
			if(!loadCount && initing) initFinish();
		}
	}
}

var addImage = function(i) {
	if(loading) {
		(function() { addImage(i)}).delay(500);
	} else {
		loading = true;

		if(arrPalette.length >= palMax) {
			alert('Your palette is full.  Please drag an item to the canvas or remove one from your palette before adding another.');
			loading = false;
			return false;
		}
	
		rThumb.send('iid=' + i);
	}
}

var cancelButton = false;
var cancelClick = function(e) {
	if(confirm('Do you want to remove this item?\n\nYou can always add it back later.')) {
		arrPalette.erase($(e.target.parentNode).id);
		arrCanvas.erase($(e.target.parentNode).id);
		$(e.target.parentNode).destroy();
		cleanPalette();
	}
}

var cancelEnter = function(e) {
	cancelButton = true;
}

var cancelLeave = function(e) {
	cancelButton = false;
}

var cropClick = function(e) {
	var a = $(e.target.parentNode).id.split('_');
	var iid = a[0];
	var linkId = a[1];
	var yOf = 160;
	divHide('enLg');
	$('enLg').load('/flash/showCrop.php?iid='+ iid + '&type=outfit&xdat=' + outfitId + '&linkId=' + linkId + '&yOf=' + yOf);
	divShow('enLg');
	divShow('screener');
}

var zoomClick = function(e) {
	var a = $(e.target.parentNode).id.split('_');
	var iid = a[0];
	var linkId = a[1];
	var yOf = 160;
	return showEnlarged(iid, '180', 'ui', 'outfit');
	divHide('enLg');
	$('enLg').load('/flash/showCrop.php?iid='+ iid + '&type=outfit&xdat=' + outfitId + '&linkId=' + linkId + '&yOf=' + yOf);
	divShow('enLg');
	divShow('screener');
}

var cropReplace = function(a, l, b, f, w, h, m) {
	a = a + '_' + l;
	b = b + '_' + l;
	arrCanvas.erase(a);
	arrCanvas.include(b);
	a = $(a);
	a.setProperty('id', b).setProperty('mini', m);
	a.setStyles({'background-image': 'url(/_ui/' + f + ')', 'width': w + 'px', 'height': h + 'px'});
}

var thumbEnter = function(e) {
	if(bDragging) return;
	bThumbing = true;
	e = $(e.target);
	if(e.hasClass('text') || e.hasClass('cancel') || e.hasClass('crop') || e.hasClass('zoom')) {
		e = $(e.parentNode);
	}
	if(e.hasClass('thumbnail')) {
		var l = parseInt(e.getProperty('dropLeft'), 10);
		var t = parseInt(e.getProperty('dropTop'), 10);
		try {
			e.setStyles({
						'border': '1px solid silver',
						'left': (l-1) + 'px',
						'top': (t-1) + 'px'
						});
		} catch (ex) {}
	}
	e.addClass('hover');
}

var thumbLeave = function(e) {
	if(bDragging) return;
	bThumbing = false;
	if(e.target) {
		e = $(e.target);
	}
	if(e.hasClass('text') || e.hasClass('cancel') || e.hasClass('crop') || e.hasClass('zoom')) {
		e = $(e.parentNode);
	}
	if(e.hasClass('thumbnail')) {
		var l = parseInt(e.getProperty('dropLeft'), 10);
		var t = parseInt(e.getProperty('dropTop'), 10);
		try {
			e.setStyles({
						'border': '0px',
						'left': l + 'px',
						'top': t + 'px'
						});
		} catch (ex) {}
	}
	e.removeClass('hover');
}

var thumbDown = function(e) {
	if(bThumbing) bDragging = true;
}

var thumbUp = function(e) {
	bDragging = false;
}

var checkMove = function(id) {
	for(var i = 0; i < arrMove.length; i++) {
		var s = arrMove[i].split('|');
		if(s[0] == id) {
			arrMove[i] = '';
			return s;
		}
	}
	return false;
}

var thumbClick = function(e) {
	e = $(e.target);
	if(e.id) {
		showEnlarged(e.id.split('_')[0], 0, 'ui', 'outfit', (editor ? 'edit': 'view'));
	}
}

var dragCreate = function(li, id, mini, thumb, thumbW, thumbH, u, userName, affiliateName, storeId, affiliateLink, e) {
	var prefix = affiliateName ? '/_ai/' : '/_ui/';
	
		var dragWidth = parseInt(thumbW, 10);
		var dragHeight = parseInt(thumbH, 10);
		var dragHTML = '';
		
		if(affiliateName) {
			dragHeight += 14;
			if(editor) {
				dragHTML = affiliateName;
			} else {
				dragHTML = '<div style="width: ' + parseInt(dragWidth - 14, 10) + 'px; overflow: hidden; float: left;"><a target="_blank" href="/m_c_storefronts/?sid=' + storeId + '">' + affiliateName + '</a> <a href="' + affiliateLink + '" title="Purchase" target="_blank"></div><img align="absmiddle" src="/images/icons/buy.gif" width="14" height="14" border="0"></a>';
			}
		} else if(u != userId) {
			dragHeight += 14;
			if(editor) {
				dragHTML = 'From ' + userName;
			} else {
				dragHTML = 'From <a target="_blank" href="/my_closet/?id=' + u + '">' + userName + '</a>';
			}
		}

		var divDrag = new Element('div')
			.setStyles(li.getCoordinates()) // this returns an object with left/top/bottom/right, so its perfect
			.setStyles({'width': dragWidth + 'px', 'height': dragHeight + 'px', 'opacity': 0.5, 'position': 'absolute', 'cursor': 'not-allowed', 'backgroundImage': 'url(' + prefix + thumb + ')'})
			.addClass('thumbnail')
			.setProperties({
					 mini: mini,
					 thumb: thumb,
					 userId: u,
					 userName: userName,
					 affiliateName: affiliateName,
					 storeId: storeId,
					 affiliateLink: affiliateLink
					 })
			.inject(document.body);

		if(editor) {
			divDrag.addEvent('mouseenter', thumbEnter).addEvent('mousedown', thumbDown);
			divDrag.addEvent('mouseleave', thumbLeave).addEvent('mouseup', thumbUp);
		} else {
			divDrag.addEvent('click', thumbClick);
		}

		divDrag.parentId = li.id;
		divDrag.id = li.id;

		if(editor) {
			var cancel = new Element('div').addClass('cancel').setProperty('title', 'Click to remove').addEvent('click', cancelClick).inject(divDrag);
			if(!affiliateName) {
				var crop = new Element('div').addClass('crop').setProperty('title', 'Click to crop').addEvent('click', cropClick).inject(divDrag);
			}
			var zoom = new Element('div').addClass('zoom').setProperty('title', 'Click to enlarge').addEvent('click', zoomClick).inject(divDrag);
			var dummy = new Element('div').addClass('dummy').inject(divDrag);
		}
		
		if(dragHTML) {
			var text = new Element('div').setStyle('margin-top', thumbH + 'px').addClass('text').set('html', dragHTML).inject(divDrag);
		}

		if(editor) {
			divDrag.addEvent('mouseup', function(e) {
				if(!divDrag.getProperty('dragging')) divDrag.destroy();
			});
	
	
			drag = divDrag.makeDraggable({
				onDrag: function(e) {
					e.setProperty('dragging', true);
					if(dragDetect(e)) {
						if(!dragStatus) {
							dragStatus = true;
							removeOpacity(e);
							e.setStyle('cursor', 'move');
						}
					} else {
						if(dragStatus) {
							dragStatus = false;
							e.setStyle('opacity', 0.5);
							e.setStyle('cursor', 'not-allowed');
						}
					}
				},
				onStart: function(e) {
					dragStatus = true;
					e.style.zIndex = 10;
					e.oldXY = e.getCoordinates();
				},
				onDrop: function(e, d, event) {
					e.setProperty('dragging', false);
					e.style.zIndex = 9;
					if(e.parentId) {
						if(d && dragDetect(e)) {
							dropCanvas(e);
						} else {
							e.destroy();
						}
					} else {
						if(dragDetect(e)) {
							dropCanvas(e);
						} else {
							if(!canvasDetect(e)) {
								addImage(e.id.split('_')[0]);
								arrCanvas.erase(e.id);
								e.destroy();
							}
							e.setStyles({ left: e.oldXY.left, top: e.oldXY.top });
							removeOpacity(e);
						}
					}
				},
	
				droppables: $('Canvas')
			});
			
			if(e) drag.start(e);
		}
	return divDrag;
}

var addPalette = function(id, mini, thumb, thumbW, thumbH, u, userName, affiliateName, storeId, affiliateLink) {
	var prefix = affiliateName ? '/_ai/' : '/_ui/';

	var move = checkMove(id);
	
	idCount++;
	var li = new Element('li');
	li = $(li);
	li.setProperties({
					 id: id + '_' + idCount,
					 mini: mini,
					 thumb: thumb,
					 userId: u,
					 userName: userName,
					 affiliateName: affiliateName,
					 storeId: storeId,
					 affiliateLink: affiliateLink
					 })
		.setStyles({
				   'background-image': 'url(' + prefix + mini + ')',
				   'left': parseInt(arrPalette.length * 81 + 1, 10) + 'px',
				   'top': '1px'
				   })
		.addClass('mini')
		.addEvent('mouseenter', thumbEnter)
		.addEvent('mouseleave', thumbLeave);
			
	var cancel = new Element('div').addClass('cancel').setProperty('title', 'Click to remove').addEvent('mouseenter', cancelEnter).addEvent('mouseleave', cancelLeave).addEvent('click', cancelClick).inject(li);
	
	if(!outfitThumbnail || (outfitThumbnail == id)) {
		setThumb(li);
	}

	li.addEvent('mousedown', function(e) {
		if(cancelButton) return;
		e = new Event(e).stop();
		
		divDrag = dragCreate(li, id, mini, thumb, thumbW, thumbH, u, userName, affiliateName, storeId, affiliateLink, e);
	});
	
	$('Palette').appendChild(li);
	arrPalette.include(li.id);

	if(move) {
		divDrag = dragCreate(li, id, mini, thumb, thumbW, thumbH, u, userName, affiliateName, storeId, affiliateLink, null);
		var cPos = canvas.getCoordinates();
		var xPos = parseInt(move[1], 10);
		var yPos = parseInt(move[2], 10);
		if(xPos < 0) xPos = 1;
		if(yPos < 0) { yPos = 1; }
		var left = xPos + cPos.left - 1;
		var top = yPos + cPos.top - 1;
		if(!editor) { top -= moveTop; }
		divDrag.setStyles({ left: left + 'px', top: top + 'px'});
		divDrag.setProperty('dragging', true);
		dropCanvas(divDrag);
		thumbLeave(divDrag);
		if(!dragDetect(divDrag)) {
			autoDrop(divDrag);
		}
		if(editor) {
			divDrag.setStyle('cursor', 'move');
		} else {
			divDrag.setStyle('cursor', 'pointer');
		}
	}
	
	if(loadCount) loadCount--;
	if(!loadCount && initing) initFinish();
}

var cleanPalette = function() {
	for(var i = 0; i < arrPalette.length; i++) {
		$(arrPalette[i]).style.left = (81 * i + 1) + 'px';
	}
}

var dropCanvas = function(e) {
	if(e.parentId) {
		$(e.parentId).destroy();
		e.id = e.parentId;
		e.parentId = null;
	}

	arrPalette.erase(e.id);
	arrCanvas.include(e.id);
	
	removeOpacity(e);
	
	var c = e.getCoordinates();
	e.setProperty('dropLeft', c.left + 1);
	e.setProperty('dropTop', c.top + 1);

	if(editor) {
//		drag.container = $('Canvas');
		cleanPalette();
	}
	
	var bottom = 0;
	var c; var b;
	for(var i = 0; i < arrCanvas.length; i++) {
		c = $(arrCanvas[i]).getCoordinates();
		b = c.top + c.height;
		if(b > bottom) bottom = b;
	}
	c = canvas.getCoordinates();

	if(editor) {
		if(
		   ((bottom + canvasPadding * 2) < (c.top + c.height)) || ((bottom + canvasPadding - c.top) > c.height)
		   ) {
			$('CanvasHeight').setStyle('height', parseInt((bottom + canvasPadding - c.top - 40), 10) + 'px');
		}
	} else {
		$('CanvasHeight').setStyle('height', parseInt((bottom - c.top), 10) + 'px');
	}
}

var autoDrop = function(e) {
	var c = canvas.getCoordinates();
	var r = 0;
	var b = 0;
	var t = 1;
	var p;
	
	for(var i = 0; i < arrCanvas.length; i++) {
		if(arrCanvas[i] != e.id) {
			p = $(arrCanvas[i]).getCoordinates();
			if((p.left + p.width) > r) r = p.left + p.width;
			if((p.top + p.height) > b) { lb = b; b = p.top + p.height; }
			if(p.top > t) { t = p.top; }
		}
	}
	
	p = $(e).getCoordinates();
	if(c.width + c.left - r > p.width) {
		e.setStyle('left', (r+1) + 'px');
		e.setStyle('top', t + 'px');
	} else {
		if(b + p.top > c.height) {
			$('CanvasHeight').setStyle('height', parseInt((c.height + canvasPadding), 10) + 'px');
		}
		e.setStyle('left', c.left + 'px');
		e.setStyle('top', (b+1) + 'px');
	}

	p = e.getCoordinates();
	e.setProperty('dropLeft', p.left);
	e.setProperty('dropTop', p.top);
}

var dragDetect = function(e) {
	var p = e.getCoordinates();
	var wh = window.getHeight();
	var wt = window.getScrollTop();
	var cd = canvasDetect(e);

	if((p.top + p.height > (wh + wt - 20)) && cd) {
		window.scrollTo(false, p.top + p.height - wh + 20);
	}

	for(var i = 0; i < arrCanvas.length; i++) {
		if(arrCanvas[i] != e.id) {
			if(overlapDetect(e, $(arrCanvas[i]))) {
				return false;
			}
		}
	}

	return cd;
}

var dropDetect = function(e) {
}

var canvasDetect = function(e) {
	var p = canvas.getCoordinates();
	var p2 = e.getCoordinates();
	
	return (p2.left >= p.left) && (p2.top >= p.top) && ((p2.left + p2.width) <= (p.left + p.width)) && ((p2.top + p2.height) <= (p.top + p.height));
}

var overlapDetect = function(a, b) {
	try {
		a = a.getCoordinates();
		b = b.getCoordinates();
		
		return (
			((a.left + a.width) > b.left) &&
			(a.left < (b.left + b.width)) &&
			((a.top + a.height) > b.top) &&
			(a.top < (b.top + b.height))
		);
	} catch(ex) {
		return true;
	}
}

var loadThumb = function(i) {
	if(loading) {
		(function() { loadThumb(i)}).delay(500);
	} else {
		loading = true;
		rThumb.send('iid=' + i);
	}
}

var setThumb = function(e) {
	$('OutfitThumbnail').setStyle('background-image', e.getStyle('background-image'));
	outfitThumbnail = e.id.replace('t_', '');
	thumbSet = true;
}

var clickThumb = function(e) {
	setThumb($(e.target));
}

var closeThumb = function(e) {
	if(e.target.id == 'SelectThumb') return false;
	$('SelectThumb').setStyle('display', 'none');
	document.removeEvent('mouseup', closeThumb);
}

var selectThumb = function() {
	var a = new Array().extend(arrCanvas).extend(arrPalette);
	var e = $('SelectThumb');
	var div;
	
	e.empty();
	if(!a.length) {
		e.set('html', '<div style="font-size: 12px; text-align: center;">You must add items to the Palette or Canvas before selecting a thumbnail for this outfit.</div>');
	}
	for(var i = 0; i < a.length; i++) {
		var img = $(a[i]);
		var prefix = img.getProperty('affiliateName') ? '/_ai/' : '/_ui/';
		div = new Element('div')
			.setStyle('background-image', 'url(' + prefix + img.getProperty('mini') + ')')
			.setProperty('id', 't_' + img.id)
			.addClass('thumbnail')
			.addEvent('click', clickThumb)
			.inject(e);
	}
	
	document.addEvent('mouseup', closeThumb);
	
	var p = $('OutfitThumbnail').getCoordinates();
	e.setStyle('left', (p.left - 30) + 'px');
	e.setStyle('top', (p.top + p.height + 20) + 'px');
	
	e.setStyle('display', 'block');
}

var wardChange = function(e, t) {
	if(t == 'a') {
		wardrobeAChangeB($('clothingTypeA').value, $('wardKwA').value, mcEditUser);
	}
	if(t == 'b') {
		wardrobeBChangeB($('clothingTypeB').value,  $('wardKwB').value,  fromUserId);
	}
}

var cliqueSelect = function(i) {
	$('myOutWardBoxC').setStyle('display', 'none');
	$('myOutWardBoxB').setStyle('display', 'block');
	$('myOutWardBoxB').set('html', '<div class="headSec"><h3>Loading ...</h3></div>');
	fromUserId = i;
	fromWarehouseId = '';
	fromStoreId = '';
	rWardB.send('userId=' + fromUserId + '&type=b');
}

var warehouseSelect = function(i) {
	$('myOutWardBoxB').setStyle('display', 'none');
	$('myOutWardBoxC').setStyle('display', 'block');
	$('myOutWardBoxC').set('html', '<div class="headSec"><h3>Loading ...</h3></div>');
	fromUserId = '';
	fromWarehouseId = i;
	fromStoreId = '';
	rWardC.send('wid=' + fromWarehouseId + '&type=c');
}

var storeSelect = function(i) {
	$('myOutWardBoxB').setStyle('display', 'none');
	$('myOutWardBoxC').setStyle('display', 'block');
	$('myOutWardBoxC').set('html', '<div class="headSec"><h3>Loading ...</h3></div>');
	fromUserId = '';
	fromWarehouseId = '';
	fromStoreId = i;
	rWardC.send('sid=' + fromStoreId + '&type=c');
}

var filterResults = function() {
	$('wardrobeDisplayB').set('html', 'Searching ...');
	
	var k = $('kws').value;
	if(k == 'keywords') k = '';

	(function() {
		$('wardrobeDisplayB').load('/my_closet/_includes/outfitWardrobe2.php?uid=' + fromUserId + '&oid=' + outfitId + '&wid=' + fromWarehouseId + '&sid=' + fromStoreId + '&editor=on' + '&ctypeId=' + $('ctypeId').value + '&genderId=' + $('genderId').value + '&colorId=' + $('colorId').value + '&keywords=' + k + '&container=wardrobeDisplayB');
	}).delay(10);
	//alert('/my_closet/_includes/outfitWardrobe2.php?uid=' + fromUserId + '&oid=' + outfitId + '&wid=' + fromWarehouseId + '&sid=' + fromStoreId + '&editor=on' + '&ctypeId=' + $('ctypeId').value + '&genderId=' + $('genderId').value + '&colorId=' + $('colorId').value + '&keywords=' + k + '&container=wardrobeDisplayB');
	//$('wardrobeDisplayB').load
}

var kbNumeric = new objKB('01234567890');

function objKB(strValid) {
	var reWork = new RegExp('[a-z]','gi');

	if(reWork.test(strValid)) this.valid = strValid.toLowerCase() + strValid.toUpperCase();
	else this.valid = strValid;

	this.getValid = keybEditGetValid;

	function keybEditGetValid() { return this.valid.toString(); }
}

var forceNumeric = function(n, e) {
	var k = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;

	if(k == 13 || k == 8) return true;

	var strWork = kbNumeric.getValid();
	
	bValid = false;

	if(!bValid) {
		for(i=0;i < strWork.length;i++) {
			if(k == strWork.charCodeAt(i)) {
				bValid = true;
				break;
			}
		}
	}
	
	if(!bValid) {
		if(window.event) window.event.returnValue = false; else e.preventDefault();
		n.focus();
	}
}

var ofGroupStr //string of groups to attach
var ofCustGroup //custom group (new)
var numOfGroups

var compileOfGroups = function() {
	ofGroupStr = "0";
	ofCustGroup = "";
	if($('isRevision').value != "1"){
		numOfGroups = Number($('numOfGroups').value);
		if(numOfGroups > 0){
			for(i=0;i<numOfGroups;i++){
				if($('ofGrp_' + i + '_').checked) ofGroupStr = ofGroupStr + "_" + $('ofGrpN_' + i + '_').value;
			}
		}
		
		if($('ofGrpCst').checked && $('ofCustGroup').value != ""){
			ofCustGroup = escape($('ofCustGroup').value);
		}
	}
}

var toggleCustGroup = function() {
	if($('ofGrpCst').checked){
		divShow('otherCat_0_');
		divHide('custPrompt');
	} else {
		divShow('custPrompt');
		divHide('otherCat_0_');
	}
}
var saveOutfit = function() {
	showLoading('Saving ...');
	var e;
	var id;
	var pos;
	var data;
	var left;
	var top;

	var p = '';
	var c = '';

	var cPos = canvas.getCoordinates();

	var error = 0;
	
	for(var i = 0; i < arrPalette.length; i++) {
		e = arrPalette[i];
		id = e.split('_')[0];
		p += id + '|';
	}
	
	for(var i = 0; i < arrCanvas.length; i++) {
		e = arrCanvas[i];
		id = e.split('_')[0];
		e = $(e);
		pos = e.getCoordinates();
		left = pos.left - cPos.left;
		top = pos.top - cPos.top;
		data = id + '!' + left + '!' + top;
		c += data + '|';

		if(left < 0 || top < 0) {
			error = 1;
		}
	}
	//compile outfit catalog string and new catalog name (if any)
	compileOfGroups();
	rSave.send('oid=' + outfitId + '&p=' + p + '&c=' + c + '&userId=' + userId + '&authorId=' + mcUID + '&outfitName=' + $('OutfitName').get('text') + '&outfitDesc=' + $('OutfitDesc').get('text') + '&groupStr=' + ofGroupStr + '&custGroup=' + ofCustGroup + '&thumbId=' + outfitThumbnail.split('_')[0] + '&error=' + error);
}

var showLoading = function(t) {
	$('LoadingText').set('text', t);
	divShow('screener');
	divShow('Loading');
}

var hideLoading = function() {
	divHide('Loading');
	divHide('screener');
}

var init = function() {
	canvas = $('Canvas');
	palette = $('Palette');

	loadCount = arrLinks.length;

	if(loadCount) {
		for(var i = 0; i < arrLinks.length; i++) {
			addLink(arrLinks[i]);
		}
	} else {
		initFinish();
	}

	return;
	addImage('38957');
	addImage('7786');
	addImage('3424');
	addImage('430');
}

var initFinish = function() {
	if(!thumbSet && outfitThumbnail) {
		$('OutfitThumbnail').setStyle('background-image', 'url(' + outfitThumbnailBG + ')');
	}
	hideLoading();
	if(editor) {
		$('myOutWardBoxA').set('html', '<div class="headSec"><h3>Loading ...</h3></div>');
		rWardA.send('type=a&userId=' + mcEditUser);
	}
	initing = false;
}

var initPage = function() {
	showLoading('Loading ...');
	
	updateOutfit(outfitId, editor);
}

var test = function() {
	return;
	addImage('7786');
	addImage('3424');
	addImage('54');
	addImage('53');
}