// Fireworks AutoShape
// Description: Table-like cell based grid, with alternating cell styles.
// Install by copying to Fireworks/Configuration/AutoShapes/
// Run in Fireworks via the Window > AutoShapes
// Aaron Beall - http://abeall.com

/* TODO
- [DONE] draggable row/column counters
- [DONE] alt-drag corner/size control points to absolute resize
- - alt drag corner to do the same
- - live drag switching between absolute/relative by pressing and releasing alt during drag
- [PART] finish cell style inheritence
- - inherit live effects
- - maintain fill handle relative positions
- [DONE] constrain Size and Corner to not allow inverted grid
- constrain padding to not allow overpadding
- individual column/row size control points
- - alt drag a row/column control point to create new row or column
- text blocks
- [PART] vertical and horizontal dividers
- - [DONE] style propogation
- - [DONE] changing cells to update dividers
- - make dividers optional
- create helper commands
- - copy grid styles
- - paste grid styles
- - redraw grid styles(use top left 2x2 grid as basis to style entire grid)
- - distribute to grid(duplicate to fill grid, cell position, element position, x offset, y offset)
- allow cells to be manipulated into different shapes, and resize cells rather than redraw in order to respect different shapes
- - when creating new cells, copy previous cells shape as well as visual style
- [DONE] when adding rows and columns, look at the entire previous row/column instead of the just the bottom right 2x2
- optimize code
- optimize preview rendering
- cleanup deprecated code

BUGS
- divider strokes are behind the cells, which is a problem when there is no padding
- [FIXED] cell style propogation breaks a lot when pathAttributes are not as expected, need to try the toSource eval method for pathAttributes
- brushTexture is not propogated
- [FIXED] canceling on the Size numeric prompt throws an error
- somehow the Column/Row control points get offset sometimes
*/

var dom = fw.getDocumentDOM();

var mouse = smartShape.currentMousePos;
var cps = smartShape.elem.controlPoints;
var data = smartShape.elem.customData;
var elems = smartShape.elem.elements;
var CP_PADDING = 8;

var operation = new Object();
operation.InsertSmartShapeAt = function(){
	var width = 150, height = 150;
	if(!fw.GridAutoShape_lastSettings) fw.GridAutoShape_lastSettings = {};
	
	data.shapeName = "grid";
	data.cols = 3//fw.GridAutoShape_lastSettings.cols||3;
	data.colpad = 3//fw.GridAutoShape_lastSettings.colpad||3;
	data.rows = 3//fw.GridAutoShape_lastSettings.rows||3;
	data.rowpad = 3//fw.GridAutoShape_lastSettings.rowpad||3;
	data.vDivs = true;//fw.GridAutoShape_lastSettings.vDivs||true;
	data.hDivs = true;//fw.GridAutoShape_lastSettings.hDivs||true;
	
	//data._cells = {};
	
	cps.length = 7;
	SetControlPoint(cps[0], AddPoints(mouse, {x:-width/2, y:-height/2}), "Corner", "Corner");
	SetControlPoint(cps[1], AddPoints(mouse, {x:width/2, y:height/2}), "Size", "Size: "+width+"x"+height+"; Alt/Opt drag to add cells");
	cps[1].toolTipTracksDrag = true;
	SetControlPoint(cps[2], AddPoints(mouse, {x:-width/2-CP_PADDING, y:height/2}), "Rows", "Rows: 3");
	cps[2].type = 'defaultInverted';
	cps[2].toolTipTracksDrag = true;
	SetControlPoint(cps[3], AddPoints(mouse, {x:width/2, y:-height/2-CP_PADDING}), "Columns", "Columns: 3");
	cps[3].type = 'defaultInverted';
	cps[3].toolTipTracksDrag = true;
	SetControlPoint(cps[4], AddPoints(mouse, {x:-width/2+CP_PADDING, y:-height/2+height/data.rows}), "Row Padding", "Row Padding: 3px");
	cps[4].toolTipTracksDrag = true;
	SetControlPoint(cps[5], AddPoints(mouse, {x:-width/2+width/data.cols, y:-height/2+CP_PADDING}), "Column Padding", "Column Padding: 3px");
	cps[5].toolTipTracksDrag = true;
	SetControlPoint(cps[6], AddPoints(mouse, {x:-width/2, y:-height/2}), "Redraw", "Redraw Cells; the top left 2x2 cells will define the style for all cells in the grid");
	cps[6].type = 'crossHair';
	
	updateControlPointToolTips();
	
	createGrid();
}
operation.BeginDragControlPoint = function(){
	data._click = true;
	var parms = smartShape.GetDefaultMoveParms();
	var cp = smartShape.currentControlPoint;
	switch(cp.name){
		case 'Size': 
			data._resizeAbsolute = smartShape.altOptKeyDown;
			data._prevSize = {x:cp.x,y:cp.y};
			parms.minX = cpt('Corner').x+data.cols+data.colpad*data.cols;
			parms.minY = cpt('Corner').y+data.rows+data.rowpad*data.rows;
		case 'Corner':
			if(cp.name=='Corner') parms.maxX = cpt('Size').x-data.cols-data.colpad*data.cols;
			if(cp.name=='Corner') parms.maxY = cpt('Size').y-data.rows-data.rowpad*data.rows;
			parms.constrain45Key = 'shiftKey';
			cp.RegisterMove(parms);
			break;
		case 'Columns':
			data._prevCols = data.cols;
			data._prevX = cp.x;
			data._colWidth = elems[2].elements[elems[2].elements.length-1].width;
			cp.RegisterLinearMove({x:cp.x-5,y:cp.y},parms);
			break;
		case 'Rows':
			data._prevRows = data.rows;
			data._prevY = cp.y;
			data._rowHeight = elems[2].elements[elems[2].elements.length-1].height;
			cp.RegisterLinearMove({x:cp.x,y:cp.y-5},parms);
			break;
		case 'Row Padding':
			data._prev = data.rowpad;
			parms.maxLinear = data.rowpad;//(cpt('Corner').y+data.rowpad*2+elems[2].elements[0].height)-(cpt('Corner').y+elems[2].elements[0].height);
			cp.RegisterLinearMove({x:cp.x,y:cp.y-5},parms);
			break
		case 'Column Padding':
			data._prev = data.colpad;
			parms.maxLinear = data.colpad;
			cp.RegisterLinearMove({x:cp.x-5,y:cp.y},parms);
			break;
	}
	smartShape.getsDragEvents = true;
}
operation.DragControlPoint = function(){
	data._click = false;
	var cp = smartShape.currentControlPoint;
	switch(cp.name){
		case 'Size': 
			if(data._resizeAbsolute){
				var cell = elems[2].elements[elems[2].elements.length-1];
				var cellWidth = cell.width + data.colpad;
				var cellHeight = cell.height + data.rowpad;
				var travel = cp.x - data._prevSize.x;
				if(travel >= cellWidth || travel <= -cellWidth){
					var dir = travel > 1 ? 1 : -1;
					var newCols = Math.floor( (Math.abs(mouse.x - data._prevSize.x))/cellWidth ) * dir;
					var cpX = cp.x, cpY = cp.y;
					cp.x = data._prevSize.x + cellWidth*newCols;
					cp.y = data._prevSize.y;
					data._prevSize = {x:data._prevSize.x + cellWidth*newCols, y:data._prevSize.y};
					changeGrid(data.rows,data.cols + newCols);
					cp.x = cpX;
					cp.y = cpY;
				}
				travel = cp.y - data._prevSize.y;
				if(travel >= cellHeight || travel <= -cellHeight){
					var dir = travel > 1 ? 1 : -1;
					var newRows = Math.floor( (Math.abs(mouse.y - data._prevSize.y))/cellHeight ) * dir;
					var cpX = cp.x, cpY = cp.y;
					cp.x = data._prevSize.x;
					cp.y = data._prevSize.y + cellHeight*newRows;
					data._prevSize = {x:data._prevSize.x, y:data._prevSize.y + cellHeight*newRows};
					changeGrid(data.rows + newRows,data.cols);
					cp.x = cpX;
					cp.y = cpY;
				}
			}
			updateControlPointToolTips();
		case 'Corner':
			updateControlPoints();
			break;
		case 'Rows':
			var newRows = Math.max(1, data._prevRows + Math.round((mouse.y - data._prevY)/data._rowHeight) );
			changeGrid(newRows, data.cols);
			updateControlPointToolTips();
			break;
		case 'Columns':
			var newCols = Math.max(1, data._prevCols + Math.round((mouse.x - data._prevX)/data._colWidth) );
			changeGrid(data.rows, newCols);
			updateControlPointToolTips();
			break;
		case 'Column Padding':
			data.colpad = fw.GridAutoShape_lastSettings.colpad = Math.floor(cp.x-cpt('Corner').x);
			updateControlPointToolTips();
			updateControlPoints();
			break;
		case 'Row Padding':
			data.rowpad = fw.GridAutoShape_lastSettings.rowpad = Math.floor(cp.y-cpt('Corner').y);//Math.floor((cp.y-elems[2].elements[0].height-cpt('Corner').y)/2);
			updateControlPointToolTips();
			updateControlPoints();
			break;
	}
	if(!data._resizeAbsolute)
		updateGrid();
}

operation.EndDragControlPoint = function(){
	var cp = smartShape.currentControlPoint;
	switch(cp.name){
		case 'Columns':
			if(data._click){
				var cols = Number(prompt('Enter the number of columns:',data.cols));
				if(!isNaN(cols) && cols>0 && Math.floor(cols)==cols && data.cols!=cols)
					changeGrid(data.rows,cols);
			}
			updateControlPoints();
			break;
		case 'Rows':
			if(data._click){
				var rows = Number(prompt('Enter the number of rows:',data.rows));
				if(!isNaN(rows) && rows>0 && Math.floor(rows)==rows && data.rows!=rows)
					changeGrid(rows,data.cols);
			}
			updateControlPoints();
			break;
		case 'Column Padding':
			if(data._click/*data.colpad==data._prev*/){
				var pad = prompt('Enter the amount of column padding:',data.colpad);
				if(pad == null) break;
				pad = Number(pad);
				if(!isNaN(pad) && pad>=0){
					data.colpad = fw.GridAutoShape_lastSettings.colpad = pad;
					updateControlPoints();
					updateGrid();
				}
			}
			break;
		case 'Row Padding':
			if(data._click/*rowpad==data._prev*/){
				var pad = prompt('Enter the amount of row padding:',data.rowpad);
				if(pad == null) break;
				pad = Number(pad);
				if(!isNaN(pad) && pad>=0){
					data.rowpad = fw.GridAutoShape_lastSettings.rowpad = pad;
					updateControlPoints();
					updateGrid();
				}
			}
			break;
		case 'Redraw':
			redrawCellStyles();
			break;
		case 'Size':
			if(data._click){
				var size = prompt('Enter a new size, formatted as "Width,Height":',(cpt('Size').x-cpt('Corner').x)+','+(cpt('Size').y-cpt('Corner').y));;
				if(size==null) break;
				size = size.split(',');
				if(size.length!=2 || isNaN(Number(size[0])) || isNaN(Number(size[1]))) break;
				cpt('Size').x = cpt('Corner').x+Number(size[0]);
				cpt('Size').y = cpt('Corner').y+Number(size[1]);
				updateGrid();
			}else if(data._resizeAbsolute){
				var cell = elems[2].elements[elems[2].elements.length-1];
				cp.x = cell.left + cell.width + data.colpad;
				cp.y = cell.top + cell.height + data.rowpad;
				data._resizeAbsolute = null;
			}
		default:
			updateControlPoints();
			updateGrid();
			break;
	}
	updateControlPointToolTips();
}

operation.SmartShapeEdited = function(){
	updateGrid();
}

SetNodePosition = function(node, pt){
	SetBezierNodePosition(node, pt,pt,pt);
}
SetBezierNodePosition = function(node, ptp, pt, pts){
	node.predX	= ptp.x;	node.predY	= ptp.y;
	node.x		= pt.x;		node.y		= pt.y;
	node.succX	= pts.x;	node.succY	= pts.y;
}
SetControlPoint = function(cp, pt, name, toolTip){
	cp.x = pt.x;
	cp.y = pt.y;
	cp.name = name;
	cp.toolTip = toolTip;
}
AddPoints = function(pt1, pt2){
	return {x:pt1.x + pt2.x, y:pt1.y + pt2.y};
}

if (operation[smartShape.operation]) operation[smartShape.operation]();

// initial creation of the grid
function createGrid(){
	var rows = data.rows, cols = data.cols;
	var rowCount = 0, rowOpacity;
	var p = -1;
	elems[0] = new Group();
	//elems[0].name = "Horizontal Dividers";
	elems[1] = new Group();
	//elems[1].name = "Vertical Dividers";
	elems[2] = new Group();
	//elems[2].name = "Cells";
	var cell;
	for(var r=0; r<rows; r++){
		rowOpacity = ++rowCount%2 ? 100 : 50;
		for(var c=0; c<cols; c++){
			p++;
			//if(elems[p]) continue;
			cell = createCell(elems[2].elements,p);
			cell.opacity = rowOpacity;
			if(!cell.pathAttributes.fill){
				cell.pathAttributes.fill = new Fill();
				cell.pathAttributes.fillColor = '#666666';
			}
			cell.pathAttributes.fill.edgeType = 'hard';
			cell.pathAttributes.brush = null;
				
			// vertical(column) dividers
			if(data.vDivs && c<cols-1)
				createNewDivider(elems[1].elements,c);
		}
		
		// horizontal(row) dividers
		if(data.hDivs && r<rows-1)
			createNewDivider(elems[0].elements,r);
	}
	
	updateControlPoints();
	updateGrid();
	updateControlPoints(); // intentional
}

// changing the number of columns or rows of the grid
// not straight forward because we have to preserve existing cell locations and styles
function changeGrid(rows,cols){
	//elems[2].name = 'Cells('+rows+'x'+cols)+')';
	if(cols != data.cols){
		// column change
		if(cols>data.cols){
			// add columns
			// first add all the new cell paths


			newPathCount = cols*data.rows;
			for(var p=data.cols*data.rows; p<newPathCount; p++)
				createCell(elems[2].elements,p);
			
			// second, enumerate cells from last to first, and restyle all cells to what they used to be before the path count shifted them all
			var p = elems[2].elements.length, oldPathCount = data.cols*data.rows;;
			for(var r=data.rows-1; r>=0; r--){
				for(var c=cols-1; c>=0; c--){
					p--;
					if(c<=data.cols-1)
						applyStyles(elems[2].elements[p],elems[2].elements[p-(cols-data.cols)*r]);
				}
			}
			
			// and lastly, enumerate from first to last and apply new cell styles based on previous cell styles
			p = -1;
			for(var r=0; r<data.rows; r++){
				for(var c=0; c<cols; c++){
					p++;
					if(c>data.cols-1){
						applyStyles(elems[2].elements[p],elems[2].elements[p - (data.cols>1 ? 2 : 1)]);
					}
				}
			}
			
			// add new column dividers
			if(data.vDivs){
				var div;
				for(var c=data.cols-1; c<cols-1; c++){
					div = createDivider(elems[1].elements,c);
					applyStyles(div,elems[1].elements[Math.max(0,c-2)]);
				}
			}
		}else{
			// delete columns
			var p = -1, oldP = -1;
			for(var r=0; r<data.rows; r++){
				for(var c=0; c<data.cols; c++){
					oldP++;
					if(c>cols-1)
						continue;
					p++;
					applyStyles(elems[2].elements[p],elems[2].elements[oldP]);
				}
			}
			elems[2].elements.length = p+1;
			elems[1].elements.length = cols-1;
		}
		data.cols = fw.GridAutoShape_lastSettings.cols = cols;
	}
	
	if(rows != data.rows){
		// row change
		if(rows>data.rows){
			// adding rows
			var p = data.rows*data.cols - 1;
			for(var r=data.rows; r<rows; r++){
				for(var c=0; c<cols; c++){
					p++;
					createCell(elems[2].elements,p);
					var prevP = p-data.cols*2;
					if(prevP<0)prevP = p-data.cols;
					applyStyles(elems[2].elements[p],elems[2].elements[prevP]);
				}
			}
			
			// add new row dividers
			if(data.vDivs){
				var div;
				for(var r=data.rows-1; r<rows-1; r++){
					div = createDivider(elems[0].elements,r);
					applyStyles(div,elems[0].elements[Math.max(0,r-2)]);
				}
			}
		}else{
			// delete rows
			elems[2].elements.length = rows*cols;
			elems[0].elements.length = rows-1;
		}
		data.rows = fw.GridAutoShape_lastSettings.rows = rows;
	}
	
	updateGrid();
}

// resizing and positioning all the cells of the grid
function updateGrid(){
	var colWidth = (cpt('Size').x-cpt('Corner').x)/data.cols;
	colWidth -= (data.colpad*(data.cols+1))/data.cols;
	var rowHeight = (cpt('Size').y-cpt('Corner').y)/data.rows;
	rowHeight -= (data.rowpad*(data.rows+1))/data.rows;
	var rows = data.rows, cols = data.cols, p = -1;
	var nods, colPad, rowPad;
	for(var r=0; r<rows; r++){
		rowPad = data.rowpad*(r+1);
		for(var c=0; c<cols; c++){
			p++;
			nods = elems[2].elements[p].contours[0].nodes;
			colPad = data.colpad*(c+1);
			//elems[2].elements[p].top = rowHeight*r + rowPad;
			//elems[2].elements[p].height = elems[2].elements[p].top + rowHeight*(r+1) + rowPad;
			//elems[2].elements[p].left = colWidth*c + colPad;
			//elems[2].elements[p].width = elems[2].elements[p].left + rowHeight*r + rowPad;
			SetNodePosition(nods[0], AddPoints(cpt('Corner'),{x:(colWidth*c)+colPad,y:(rowHeight*r)+rowPad}));
			SetNodePosition(nods[1], AddPoints(cpt('Corner'),{x:(colWidth*(c+1))+colPad,y:(rowHeight*r)+rowPad}));
			SetNodePosition(nods[2], AddPoints(cpt('Corner'),{x:(colWidth*(c+1))+colPad,y:(rowHeight*(r+1))+rowPad}));
			SetNodePosition(nods[3], AddPoints(cpt('Corner'),{x:(colWidth*c)+colPad,y:(rowHeight*(r+1))+rowPad}));
		}
	}
	for(var i in elems[1].elements){
		nods = elems[1].elements[i].contours[0].nodes, id = elems[1].elements[i].customData.id+1;
		SetNodePosition(nods[0], AddPoints(cpt('Corner'),{x:(colWidth+data.colpad)*id + data.colpad/2,y:data.rowpad}));
		SetNodePosition(nods[1], {x:cpt('Corner').x+(colWidth+data.colpad)*id + data.colpad/2,y:cpt('Size').y - data.rowpad});
	}
	for(var i in elems[0].elements){
		nods = elems[0].elements[i].contours[0].nodes, id = elems[0].elements[i].customData.id+1;
		SetNodePosition(nods[0], AddPoints(cpt('Corner'),{x:data.colpad,y:(rowHeight+data.rowpad)*id + data.rowpad/2}));
		SetNodePosition(nods[1], {x:cpt('Size').x-data.colpad,y:cpt('Corner').y+(rowHeight+data.rowpad)*id + data.rowpad/2});
	}
}

// update all the cell styles to conform to the grid pattern as defined by the top left 2x2
function redrawCellStyles(){
	var cellTL = elems[2].elements[0];
	var cellTR = data.cols>1 ? elems[2].elements[1] : cellTL;
	var cellBL = data.rows>1 ? elems[2].elements[data.cols] : cellTL;
	var cellBR = data.rows>1 && data.cols>1 ? elems[2].elements[data.cols+1] : cellTR;
	var vDiv1 = elems[1].elements[0];
	var vDiv2 = elems[1].elements.length>1 ? elems[1].elements[1] : vDiv1;
	var hDiv1 = elems[0].elements[0];
	var hDiv2 = elems[0].elements.length>1 ? elems[0].elements[1] : hDiv1;
	var rows = data.rows, cols = data.cols, p = -1;
	var rowCount = 0, colCount = 0;
	for(var r=0; r<rows; r++){
		rowCount++;
		colCount = 1;
		for(var c=0; c<cols; c++){
			p++;
			if(rowCount%2){
				++colCount%2 ? applyStyles(elems[2].elements[p],cellTR) : applyStyles(elems[2].elements[p],cellTL);
			}else{
				++colCount%2 ? applyStyles(elems[2].elements[p],cellBR) : applyStyles(elems[2].elements[p],cellBL);
			}
			if(c<cols-1)
				applyStyles(elems[1].elements[c],(colCount%2?vDiv2:vDiv1));
		}
		if(r<rows-1)
			applyStyles(elems[0].elements[r],(rowCount%2?hDiv1:hDiv2));
	}
}

// updating the control point positions when resizing the grid
function updateControlPoints(){
	cpt('Rows').x = cpt('Corner').x-CP_PADDING;
	cpt('Rows').y = cpt('Size').y;
	cpt('Columns').x = cpt('Size').x;
	cpt('Columns').y = cpt('Corner').y-CP_PADDING;
	cpt('Row Padding').x = cpt('Corner').x+(elems[2].elements[0].width+data.colpad*2)/2;
	cpt('Row Padding').y = cpt('Corner').y+data.rowpad;
	cpt('Column Padding').x = cpt('Corner').x+data.colpad;
	cpt('Column Padding').y = cpt('Corner').y+(elems[2].elements[0].height+data.rowpad*2)/2;
	cpt('Redraw').x = cpt('Corner').x+(cpt('Size').x-cpt('Corner').x)/2;
	cpt('Redraw').y = cpt('Corner').y+(cpt('Size').y-cpt('Corner').y)/2;
}

// update control point tooltip
function updateControlPointToolTips(){
	cpt('Size').toolTip = "Size: "+Math.round(cpt('Size').x-cpt('Corner').x)+"x"+Math.round(cpt('Size').y-cpt('Corner').y)+"; Alt/Opt drag to add cells";
	cpt('Rows').toolTip = "Rows: "+data.rows+"";
	cpt('Columns').toolTip = "Columns: "+data.cols+"";
	cpt('Row Padding').toolTip = "Row Padding: "+data.rowpad+"px";
	cps[5].toolTip = "Column Padding: "+data.colpad+"px";
}

// create a cell path
function createCell(parent,index){
	parent[index] = new Path();
	parent[index].contours[0] = new Contour();
	parent[index].contours[0].isClosed = true;
	parent[index].contours[0].nodes.length = 4;
	return parent[index];
}

// create a divider path
function createDivider(parent,index){
	parent[index] = new Path();
	parent[index].contours[0] = new Contour();
	parent[index].contours[0].isClosed = false;
	parent[index].contours[0].nodes.length = 2;
	parent[index].customData.id = index;
	return parent[index];
}

// create a new divider, includes extra default styling
function createNewDivider(parent,index){
	var div = createDivider(parent,index);
	div.pathAttributes.fill = null;
	if(div.pathAttributes.brush == null)
		div.pathAttributes.brush = new Brush();
	div.pathAttributes.brush.type = 'simple';
	div.pathAttributes.brush.feedback = 'none';
	if(div.pathAttributes.brushColor == dom.backgroundColor)
		div.pathAttributes.brushColor = '#666666';
}

// apply path styles to an element based on an existing element or copy
function applyStyles(element, copyObject){
	//eval('var pa = ' + copyObject.pathAttributes.toSource());
	//element.pathAttributes = pa;
	//return cloneObject(element, copyObject);
	
	// copy basic element attributes
	element.opacity = copyObject.opacity;
	element.blendMode = copyObject.blendMode;
	element.fillOnTop = copyObject.fillOnTop;
	element.brushPlacement = copyObject.brushPlacement;
	element.pathAttributes.fillColor = copyObject.pathAttributes.fillColor;
	element.pathAttributes.brushColor = copyObject.pathAttributes.brushColor;
	
	// copy fill
	if(copyObject.pathAttributes.fill){
		if(!element.pathAttributes.fill)
			element.pathAttributes.fill = new Fill();
		element.pathAttributes.fill.shape = copyObject.pathAttributes.fill.shape;
		element.pathAttributes.fill.webDitherTransparent = copyObject.pathAttributes.fill.webDitherTransparent;
		element.pathAttributes.fill.feather = copyObject.pathAttributes.fill.feather;
		element.pathAttributes.fill.edgeType = copyObject.pathAttributes.fill.edgeType;
		element.pathAttributes.fill.stampingMode = copyObject.pathAttributes.fill.stampingMode;
		element.pathAttributes.fill.textureBlend = copyObject.pathAttributes.fill.textureBlend;
		element.pathAttributes.fill.name = copyObject.pathAttributes.fill.name;
		element.pathAttributes.fill.category = copyObject.pathAttributes.fill.category;
		
		// copy pattern
		if(copyObject.pathAttributes.fill.pattern){
			if(!element.pathAttributes.fill.pattern)
				element.pathAttributes.fill.pattern = new Pattern();
			element.pathAttributes.fill.pattern.image = copyObject.pathAttributes.fill.pattern.image;
			element.pathAttributes.fill.pattern.name = copyObject.pathAttributes.fill.pattern.name;
		}else{
			element.pathAttributes.fill.pattern = null;
		}
		
		// copy gradient
		if(copyObject.pathAttributes.fill.gradient){
			if(!element.pathAttributes.fill.gradient)
				element.pathAttributes.fill.gradient = new Gradient();
			element.pathAttributes.fill.gradient.name = copyObject.pathAttributes.fill.gradient.name;
			var nodes = [], opacityNodes = [];
			for(var n in copyObject.pathAttributes.fill.gradient.nodes){
				nodes[n] = {}//new GradientNode();
				for(var i in copyObject.pathAttributes.fill.gradient.nodes[n]){
					if(i=='javascriptString') continue;
					nodes[n][i] = copyObject.pathAttributes.fill.gradient.nodes[n][i];
				}
			}
			for(var n in copyObject.pathAttributes.fill.gradient.opacityNodes){
				opacityNodes[n] = {}//new GradientNode();
				for(var i in copyObject.pathAttributes.fill.gradient.opacityNodes[n]){
					if(i=='javascriptString') continue;
					opacityNodes[n][i] = copyObject.pathAttributes.fill.gradient.opacityNodes[n][i];
				}
			}
			element.pathAttributes.fill.gradient.nodes = nodes;
			element.pathAttributes.fill.gradient.opacityNodes = opacityNodes;
		}else{
			element.pathAttributes.fill.gradient = null;
		}
		
		// copy fill handles
		if(element.pathAttributes.fill.pattern || element.pathAttributes.fill.gradient){
			//alert('fillhandles');
			element.pathAttributes.fillHandle1.x = copyObject.pathAttributes.fillHandle1.x;
			element.pathAttributes.fillHandle1.y = copyObject.pathAttributes.fillHandle1.y;
			element.pathAttributes.fillHandle2.x = copyObject.pathAttributes.fillHandle2.x;
			element.pathAttributes.fillHandle2.y = copyObject.pathAttributes.fillHandle2.y;
			element.pathAttributes.fillHandle3.x = copyObject.pathAttributes.fillHandle3.x;
			element.pathAttributes.fillHandle3.y = copyObject.pathAttributes.fillHandle3.y;
		}
	}else{
		element.pathAttributes.fill = null;
	}
	// copy stroke
	if(copyObject.pathAttributes.brush){
		if(!element.pathAttributes.brush)
			element.pathAttributes.brush = new Brush();
		for(var i in copyObject.pathAttributes.brush)
			element.pathAttributes.brush[i] = copyObject.pathAttributes.brush[i];
		element.pathAttributes.brushTexture.name = copyObject.pathAttributes.brushTexture.name;
	}else{
		element.pathAttributes.brush = null;
	}
	// copy effectList
	// copy relative fill handle positions
}
/*function cloneObject(element, copyObject){
	for(var i in copyObject){
		if(i=='javascriptString' || i=='customData') continue;
		if(hasChildren(copyObject[i])){
			try{
				if(!element[i]){
					//element[i] = new Object();
					var type = String(copyObject[i]).split('[object ')[1].split(']')[0];
					eval('element[i] = new '+type); // [object Thing]
				}
				cloneObject(element[i],copyObject[i]);
			}catch(err){alert(i+':'+type)}
		}else{
			try{
				element[i] = copyObject[i];
			}catch(err){alert(i)}
		}
	}
	function hasChildren(obj){
		if(typeof(obj)=='string') return false;
		for(var o in obj) return true;
		return false;
	}
}*/

// copy styles into generic object
/*function copyCellStyle(element){
	var obj = {};
	obj.opacity = element.opacity;
	obj.blendMode = element.blendMode;
	obj.pathAttributes = {};
	obj.pathAttributes.fillColor = element.pathAttributes.fillColor;
	obj.pathAttributes.brushColor = element.pathAttributes.brushColor;
	if(element.pathAttributes.fill)	obj.pathAttributes.fill = {edgeType:element.pathAttributes.fill.edgeType};
	// copy stroke
	// copy fill
	// copy effectList
	// copy relative fill handle positions
	// copy fillTexture and strokeTexture
	return obj;
}*/

// get a control point by name
function cpt(name){
	for(var c in cps){
		if(cps[c].name == name)
			return cps[c];
	}
	return false;
}