design_wev8.js 5.96 KB
function draw(context, workflowBase, p) {

	/*
	var canvas = $("#mainArea")[0];
	var _callBack = function() {
		draw();
	};
	if (canvas == null || canvas == undefined) {
		setTimeout(_callBack, 500);
		return;
	}
	var context = canvas.getContext("2d");
	*/
	for (var i = 0; i < workflowBase.nodeBases.length; i++) {
		var crtNode = workflowBase.nodeBases[i];
		drawNode(context, crtNode);
	}

	for (var i = 0; i < workflowBase.nodeLinks.length; i++) {
		drawLine(context, workflowBase.nodeLinks[i]);
	}

	for (var i = 0; i < workflowBase.groups.length; i++) {
		var g = workflowBase.groups[i];
		//alert(g.direction);
		//console.log(g);
		if (g.direction == 0) {
			//alert("x=" + g.x + ", y=" + g.y + ", width=" + g.width + ", height=" + g.height);
			dashRect(g.x, g.y, g.width, g.height, g.groupName, context);
		} else if (g.direction == 1) {
			drawBlock(0, g.x, g.y, maxWidth, g.height, g.groupName, context);
		} else if (g.direction == 2) {
			drawBlock(1, g.x, g.y, g.width, maxHeight, g.groupName, context);
		}
		//var maxWidth = 800;
		//var maxHeight = 600;
	}
}

/**
 * 初始化节点
 */
function drawNode(content, node) {
	if (node == null || node == undefined) {
		return;
	}
	var textSpacing = 0;
	var borderColor = '';
	var fillColor = '';
	var tfontColor = '';
	var dfontColor = '';

	if (node.nodeOptType == 1) {
		textSpacing = 0;
		borderColor = '#ffa44a';
		fillColor = '#ffe8cc';
		tfontColor = '#7c5423';
		dfontColor = '#c4822b';
	} else if (node.nodeOptType == 0) {
		textSpacing = 0;
		borderColor = '#49a8d4';
		fillColor = '#a9e2ff';
		tfontColor = '#1e4f6d';
		dfontColor = '#3c74af';
	} else {
		textSpacing = 0;
		borderColor = '#5abd6b';
		fillColor = '#bff3c3';
		tfontColor = '#345e3a';
		dfontColor = '#429350';
	}
	if (node.nodetype == 0 || node.nodetype == 3) {
		content.fillStyle = node.fontColor();
		content.lineWidth = 1;
		var circleDiameter = 90;
		drawCircle(parseInt(node.x) + circleDiameter/2 + 2, parseInt(node.y) + circleDiameter/2, circleDiameter/2, borderColor, fillColor, content);
		drawText(content, node.text, 'normal 12px Microsoft YaHei', parseInt(node.x) + (113 - 70) / 2 - 10, parseInt(node.y) + 113 / 2 - 12 - textSpacing, 70, tfontColor);
		drawText(content, node.nodeOperatorName, 'normal 13px Microsoft YaHei', parseInt(node.x) + (113 - 70) / 2 - 10, parseInt(node.y) + 113 / 2 + 5 + textSpacing, 70, dfontColor);
		content.stroke();
	} else if (node.nodetype == 1) {
		diamond(content, parseInt(node.x), parseInt(node.y), 110, 100, 5, borderColor, fillColor, '', '', '', '', node.text, node.nodeOperatorName, tfontColor, dfontColor);
	} else {
		roundRect(content, parseInt(node.x + 2), parseInt(node.y), 108, 70, 0, borderColor, fillColor, '', '', '', '', node.text, node.nodeOperatorName, tfontColor, dfontColor);
	}
	this.fillStyle = "#ffffff";
	this.strokeStyle = "#000000";
	this.lineWidth = 1;
}

function drawLine(ctx, nl) {

	//console.log(nl);
	if (nl == null || nl == undefined || nl.points == null || nl.points == "") return;

	ctx.beginPath();

	ctx.lineWidth = 1;
	var lineFlag = 0.5;
	if (nl.ispass == "true" || nl.ispass == true) {
		ctx.strokeStyle = '#E90B0A';
	} else {
		ctx.strokeStyle = '#8c8c8c';
	}

	var pointAry = new Array();
	//var tempArray = nl.points.split(",");
	for (var i = 0; i < nl.points.length; i++) {
		var point = new Point(nl.points[i].x, nl.points[i].y);
		pointAry.push(point);

	}



	if (pointAry.length <= 0) return;
	ctx.moveTo(pointAry[0].x + lineFlag, pointAry[0].y + lineFlag);
	//记录划线的记录
	nl.pushDrawPoint(pointAry[0]);

	var sPoint = null;
	var ePoint = null;
	//console.log(nl.text + ":" + nl.points);
	var interval = 8;
	for (var i = 0; i < pointAry.length; i++) {
		var p = pointAry[i];

		if (i == 0) {
			if (parseInt(nl.startDirection) == 90) {
				//p.x += interval - 1;
				p.x = nl.startNode.leftPoint().x;
			} else if (parseInt(nl.startDirection) == 180) {
				//p.y += interval;
				p.y = nl.startNode.topPoint().y;
			} else if (parseInt(nl.startDirection) == -90) {
				//p.x -= interval;
				p.x = nl.startNode.rightPoint().x;
			} else if (parseInt(nl.startDirection) == 0) {
				//p.y -= interval;
				p.y = nl.startNode.bottomPoint().y;
			}
		}

		if (i == pointAry.length - 1) {
			if (parseInt(nl.endDirection) == 90) {
				//x += interval;
				p.x = nl.endNode.leftPoint().x;
			} else if (parseInt(nl.endDirection) == 180) {
				//p.y += interval;
				p.y = nl.endNode.topPoint().y;
			} else if (parseInt(nl.endDirection) == -90) {
				//p.x -= interval - 3;
				p.x = nl.endNode.rightPoint().x;
			} else if (parseInt(nl.endDirection) == 0) {
				//p.y -= interval;
				p.y = nl.endNode.bottomPoint().y;
			}
		}

		//记录划线的记录
		nl.pushDrawPoint(p);
		//如果不是最后一个点,即线的结尾节点 && 不是第一个节点
		if (sPoint != null && (i + 1) < pointAry.length) {
			ePoint = pointAry[i + 1];
			//如果3点不在一个坐标轴内,则画曲线
			if (!(sPoint.x == p.x && p.x == ePoint.x) && !(sPoint.y == p.y && p.y == ePoint.y)) {
				//console.log(nl.text + ":" + sPoint.toString() + ", " + p.toString() + "," + ePoint.toString());
				var aPoint = calCenterPoint(sPoint, p);
				var bPoint = calCenterPoint(ePoint, p);
				//ctx.arcTo(p.x + lineFlag, p.y + lineFlag, bPoint.x + lineFlag, bPoint.y + lineFlag, 5);
				ctx.lineTo(p.x + lineFlag, p.y + lineFlag);
			} else {
				ctx.lineTo(p.x + lineFlag, p.y + lineFlag);
			}
		} else {
			ctx.lineTo(p.x + lineFlag, p.y + lineFlag);
		}


		sPoint = p;
	}

	//nl.pushDrawPoint(ePoint);
	ctx.moveTo(pointAry[pointAry.length - 1].x, pointAry[pointAry.length - 1].y);
	ctx.stroke();
	ctx.closePath();


	ctx.beginPath();
	if (nl.ispass == "true" || nl.ispass == true) {
		ctx.fillStyle = '#E90B0A';
		ctx.strokeStyle = '#E90B0A';
	} else {
		ctx.fillStyle = '#8c8c8c';
		ctx.strokeStyle = '#8c8c8c';
	}
	//画箭头
	drawArrow(ctx, pointAry[pointAry.length - 2], pointAry[pointAry.length - 1]);
	ctx.stroke();
	ctx.fill();
	ctx.closePath();

}

function drawGroup(ctx, g) {
	if (g == null || g == undefined) {


		return;
	}
}

function drawBlock(ctx, g) {

}