improving event drawing shapes

This commit is contained in:
Fernando Ontiveros
2011-03-01 03:45:19 +00:00
parent c81092d389
commit 6ccd61d3e0
6 changed files with 168 additions and 152 deletions

View File

@@ -17,8 +17,8 @@
$oHeadPublisher->addExtJsScript('bpmn/EventEmptyStart');
$oHeadPublisher->addExtJsScript('bpmn/EventMessageStart');
$oHeadPublisher->addExtJsScript('bpmn/EventTimerStart');
//$oHeadPublisher->addExtJsScript('bpmn/EventRuleStart');
//$oHeadPublisher->addExtJsScript('bpmn/EventTimerStart');
//$oHeadPublisher->addExtJsScript('bpmn/EventSignalStart');
//$oHeadPublisher->addExtJsScript('bpmn/EventMulStart');
//$oHeadPublisher->addExtJsScript('bpmn/EventLinkStart');

View File

@@ -29,19 +29,6 @@ this.graphics.fillEllipse(x_cir2,y_cir2,this.getWidth()-6,this.getHeight()-6);
this.graphics.setColor("#adae5e");
this.graphics.drawEllipse(x_cir2,y_cir2,this.getWidth()-6,this.getHeight()-6);
/*
//drawing clock's minutes lines
this.graphics.setColor("#adae5e");
//this.graphics.drawEllipse(x_cir3,y_cir3,this.getWidth()-20,this.getHeight()-20);
this.graphics.drawLine(this.getWidth()/2,this.getHeight()/2,this.getWidth()/1.3,this.getHeight()/2);
this.graphics.drawLine(this.getWidth()/2,this.getHeight()/2,this.getWidth()/2,this.getHeight()/4.5);
*/
//var x_cir3=10;
//var y_cir3=10;
//this.graphics.setColor( "#f9faf2" );
//this.graphics.fillEllipse(x_cir3,y_cir3,this.getWidth()-20,this.getHeight()-20);
this.graphics.setColor("#adae5e");
//this.graphics.drawEllipse(x_cir3,y_cir3,this.getWidth()-20,this.getHeight()-20);
this.graphics.drawLine(this.getWidth()/2.2,this.getHeight()/2,this.getWidth()/1.6,this.getHeight()/2); //horizontal line

View File

@@ -1,14 +1,15 @@
bpmnEventEmptyStart=function(){
VectorFigure.call(this);
VectorFigure.call(this);
};
bpmnEventEmptyStart.prototype=new VectorFigure;
bpmnEventEmptyStart.prototype.type="bpmnEventEmptyStart";
bpmnEventEmptyStart.prototype.paint=function(){
VectorFigure.prototype.paint.call(this);
this.stroke=2;
if(typeof workflow.zoomfactor == 'undefined')
workflow.zoomfactor = 1;
//Set the Task Limitation
bpmnEventEmptyStart.prototype.paint=function() {
VectorFigure.prototype.paint.call(this);
if(typeof workflow.zoomfactor == 'undefined')
workflow.zoomfactor = 1;
//Set the Limitation
if(typeof this.limitFlag == 'undefined' || this.limitFlag == false) {
this.originalWidth = 30;
this.originalHeight = 30;
@@ -16,30 +17,34 @@ if(typeof workflow.zoomfactor == 'undefined')
this.orgYPos = this.getY();
this.orgFontSize =this.fontSize;
}
this.width = this.originalWidth * workflow.zoomfactor;
this.height = this.originalHeight * workflow.zoomfactor;
var x_cir = 0;
var y_cir = 0;
this.graphics.setColor("#c0c0c0");
this.graphics.fillEllipse(x_cir+4,y_cir+4,this.getWidth(),this.getHeight());
this.graphics.setStroke(this.stroke);
this.graphics.setColor( "#e4f7df" );
this.graphics.fillEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setColor("#4aa533");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.paint();
this.width = this.originalWidth * workflow.zoomfactor;
this.height = this.originalHeight * workflow.zoomfactor;
/*Code Added to Dynamically shift Ports on resizing of shapes
**/
if(this.output1!=null){
this.output1.setPosition(this.width/2,this.height);
}
if(this.output2!=null){
this.output2.setPosition(this.width,this.height/2);
}
var x_cir = 0;
var y_cir = 0;
//draw the circle
this.graphics.setColor("#d0d0d0");
this.graphics.fillEllipse(x_cir+2,y_cir+2,this.getWidth(),this.getHeight());
this.graphics.setColor( "#F6FFDA" );
this.graphics.fillEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(2);
this.graphics.setColor("#97C759");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(1);
this.graphics.setColor("#98C951");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.paint();
//Code Added to Dynamically shift Ports on resizing of shapes
if(this.output1!=null) {
this.output1.setPosition(this.width/2,this.height);
}
if(this.output2!=null){
this.output2.setPosition(this.width,this.height/2);
}
};
bpmnEventEmptyStart.prototype.setWorkflow=function(_40c5){

View File

@@ -1,88 +1,89 @@
bpmnEventMessageStart=function(){
VectorFigure.call(this);
//Setting width and height values as per the zoom ratio
if(typeof workflow.zoomWidth != 'undefined' || typeof workflow.zoomHeight != 'undefined')
this.setDimension(workflow.zoomWidth, workflow.zoomHeight);
else
this.setDimension(30,30);
this.stroke = 3;
VectorFigure.call(this);
};
bpmnEventMessageStart.prototype=new VectorFigure;
bpmnEventMessageStart.prototype.type="bpmnEventMessageStart";
bpmnEventMessageStart.prototype.paint=function(){
VectorFigure.prototype.paint.call(this);
if (this.getWidth() < 30 || this.getHeight() < 30) {
this.setDimension(30, 30);
}
var x_cir = 0;
var y_cir = 0;
VectorFigure.prototype.paint.call(this);
if(typeof workflow.zoomfactor == 'undefined')
workflow.zoomfactor = 1;
this.graphics.setColor("#c0c0c0");
this.graphics.fillEllipse(x_cir+5,y_cir+5,this.getWidth(),this.getHeight());
//Set the Limitation
if(typeof this.limitFlag == 'undefined' || this.limitFlag == false) {
this.originalWidth = 30;
this.originalHeight = 30;
this.orgXPos = this.getX();
this.orgYPos = this.getY();
this.orgFontSize =this.fontSize;
}
this.width = this.originalWidth * workflow.zoomfactor;
this.height = this.originalHeight * workflow.zoomfactor;
var x_cir = 0;
var y_cir = 0;
//draw the circle
this.graphics.setColor("#d0d0d0");
this.graphics.fillEllipse(x_cir+2,y_cir+2,this.getWidth(),this.getHeight());
this.graphics.setColor( "#F6FFDA" );
this.graphics.fillEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(2);
this.graphics.setColor("#97C759");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(1);
this.graphics.setColor("#98C951");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(this.stroke);
this.graphics.setColor( "#e4f7df");
this.graphics.fillEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setColor("#4aa533");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(0);
//var x=new Array(12,12,35,35,23.5,12);
//var y=new Array(16,33,33,17,26,17);
var x=new Array(this.getWidth()/3.75,this.getWidth()/3.75,this.getWidth()/1.28,this.getWidth()/1.28,this.getWidth()/1.91,this.getWidth()/3.75);
var y=new Array(this.getHeight()/2.64,this.getHeight()/1.36,this.getHeight()/1.36,this.getHeight()/2.8,this.getHeight()/1.7,this.getHeight()/2.8);
this.graphics.setColor( "#4aa533" );
//this.graphics.fillPolygon(x,y);
this.graphics.setColor("#4aa533");
this.graphics.drawPolygon(x,y);
//var x_tri=new Array(12,23.5,35);
//var y_tri=new Array(13,22,13);
var x_tri=new Array(this.getWidth()/3.75,this.getWidth()/1.91,this.getWidth()/1.28);
var y_tri=new Array(this.getHeight()/3.46,this.getHeight()/2.04,this.getHeight()/3.46);
this.graphics.setColor( "#e4f7df" );
//this.graphics.fillPolygon(x_tri,y_tri);
this.graphics.setColor("#4aa533");
this.graphics.drawPolygon(x_tri,y_tri);
this.graphics.paint();
//draw the mail icon
var cw = this.getWidth();
var ch = this.getHeight();
var x = new Array( cw*0.25, cw*0.25, cw*0.78, cw*0.78, cw*0.52, cw*0.25, cw*0.25, cw*0.78);
var y = new Array( ch*0.31, ch*0.71, ch*0.71, ch*0.32, ch*0.52, ch*0.32, ch*0.31, ch*0.31);
this.graphics.setColor("#4aa533");
this.graphics.drawPolygon(x,y);
/*Code Added to Dynamically shift Ports on resizing of shapes
**/
if(this.input1!=null){
this.input1.setPosition(0,this.height/2);
}
if(this.output1!=null){
this.output1.setPosition(this.width/2,this.height);
}
if(this.input2!=null){
this.input2.setPosition(this.width/2,0);
}
if(this.output2!=null){
this.output2.setPosition(this.width,this.height/2);
}
this.graphics.paint();
/*Code Added to Dynamically shift Ports on resizing of shapes
**/
if(this.input1!=null){
this.input1.setPosition(0,this.height/2);
}
if(this.output1!=null){
this.output1.setPosition(this.width/2,this.height);
}
if(this.input2!=null){
this.input2.setPosition(this.width/2,0);
}
if(this.output2!=null){
this.output2.setPosition(this.width,this.height/2);
}
};
bpmnEventMessageStart.prototype.setWorkflow=function(_40c5){
VectorFigure.prototype.setWorkflow.call(this,_40c5);
if(_40c5!=null){
VectorFigure.prototype.setWorkflow.call(this,_40c5);
if(_40c5!=null){
var eventPortName = ['output1','output2'];
var eventPortType = ['OutputPort','OutputPort'];
var eventPositionX= [this.width/2,this.width];
var eventPositionY= [this.height,this.height/2];
for(var i=0; i< eventPortName.length ; i++){
eval('this.'+eventPortName[i]+' = new '+eventPortType[i]+'()'); //Create New Port
eval('this.'+eventPortName[i]+'.setWorkflow(_40c5)'); //Add port to the workflow
eval('this.'+eventPortName[i]+'.setName("'+eventPortName[i]+'")'); //Set PortName
eval('this.'+eventPortName[i]+'.setZOrder(-1)'); //Set Z-Order of the port to -1. It will be below all the figure
eval('this.'+eventPortName[i]+'.setBackgroundColor(new Color(255, 255, 255))'); //Setting Background of the port to white
eval('this.'+eventPortName[i]+'.setColor(new Color(255, 255, 255))'); //Setting Border of the port to white
eval('this.addPort(this.'+eventPortName[i]+','+eventPositionX[i]+', '+eventPositionY[i]+')'); //Setting Position of the port
}
}
eval('this.'+eventPortName[i]+' = new '+eventPortType[i]+'()'); //Create New Port
eval('this.'+eventPortName[i]+'.setWorkflow(_40c5)'); //Add port to the workflow
eval('this.'+eventPortName[i]+'.setName("'+eventPortName[i]+'")'); //Set PortName
eval('this.'+eventPortName[i]+'.setZOrder(-1)'); //Set Z-Order of the port to -1. It will be below all the figure
eval('this.'+eventPortName[i]+'.setBackgroundColor(new Color(255, 255, 255))'); //Setting Background of the port to white
eval('this.'+eventPortName[i]+'.setColor(new Color(255, 255, 255))'); //Setting Border of the port to white
eval('this.addPort(this.'+eventPortName[i]+','+eventPositionX[i]+', '+eventPositionY[i]+')'); //Setting Position of the port
}
}
};
bpmnEventMessageStart.prototype.getContextMenu=function(){
if(this.id != null){
this.workflow.handleContextMenu(this);
}
if(this.id != null){
this.workflow.handleContextMenu(this);
}
};

View File

@@ -1,50 +1,73 @@
bpmnEventTimerStart=function(){
VectorFigure.call(this);
//Setting width and height values as per the zoom ratio
if(typeof workflow.zoomWidth != 'undefined' || typeof workflow.zoomHeight != 'undefined')
this.setDimension(workflow.zoomWidth, workflow.zoomHeight);
else
this.setDimension(30,30);
this.stroke = 2;
VectorFigure.call(this);
};
bpmnEventTimerStart.prototype=new VectorFigure;
bpmnEventTimerStart.prototype.type="bpmnEventTimerStart";
bpmnEventTimerStart.prototype.paint=function(){
VectorFigure.prototype.paint.call(this);
var x_cir1=0;
var y_cir1=0;
VectorFigure.prototype.paint.call(this);
if(typeof workflow.zoomfactor == 'undefined')
workflow.zoomfactor = 1;
this.graphics.setColor("#c0c0c0");
this.graphics.fillEllipse(x_cir1+5,y_cir1+5,this.getWidth(),this.getHeight());
this.graphics.setStroke(this.stroke);
this.graphics.setColor( "#e4f7df" );
this.graphics.fillEllipse(x_cir1,y_cir1,this.getWidth(),this.getHeight());
this.graphics.setColor("#4aa533");
this.graphics.drawEllipse(x_cir1,y_cir1,this.getWidth(),this.getHeight());
var x_cir2=5;
var y_cir2=5;
this.graphics.setColor( "#e4f7df" );
this.graphics.fillEllipse(x_cir2,y_cir2,this.getWidth()-10,this.getHeight()-10);
this.graphics.setColor("#4aa533");
this.graphics.drawEllipse(x_cir2,y_cir2,this.getWidth()-10,this.getHeight()-10);
this.graphics.drawLine(this.getWidth()/2,this.getHeight()/2,this.getWidth()/1.3,this.getHeight()/2); //horizontal line
this.graphics.drawLine(this.getWidth()/2,this.getHeight()/2,this.getWidth()/2,this.getHeight()/4.5); //vertical line
this.graphics.paint();
//Set the Limitation
if(typeof this.limitFlag == 'undefined' || this.limitFlag == false) {
this.originalWidth = 30;
this.originalHeight = 30;
this.orgXPos = this.getX();
this.orgYPos = this.getY();
this.orgFontSize =this.fontSize;
}
this.width = this.originalWidth * workflow.zoomfactor;
this.height = this.originalHeight * workflow.zoomfactor;
var x_cir = 0;
var y_cir = 0;
//draw the circle
this.graphics.setColor("#d0d0d0");
this.graphics.fillEllipse(x_cir+2,y_cir+2,this.getWidth(),this.getHeight());
this.graphics.setColor( "#F6FFDA" );
this.graphics.fillEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(2);
this.graphics.setColor("#97C759");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
this.graphics.setStroke(1);
this.graphics.setColor("#98C951");
this.graphics.drawEllipse(x_cir,y_cir,this.getWidth(),this.getHeight());
/*Code Added to Dynamically shift Ports on resizing of shapes
**/
if(this.input1!=null){
this.input1.setPosition(0,this.height/2);
}
if(this.output1!=null){
this.output1.setPosition(this.width/2,this.height);
}
if(this.input2!=null){
this.input2.setPosition(this.width/2,0);
}
if(this.output2!=null){
this.output2.setPosition(this.width,this.height/2);
}
//draw the clock
var cw = this.getWidth();
var ch = this.getHeight();
this.graphics.setColor("#98C951");
this.graphics.drawEllipse(cw*0.15, ch*0.15, ch*0.7, ch*0.7 );
var x = new Array( cw*0.60, cw*0.50, cw*0.75, 0.5);
var y = new Array( ch*0.31, ch*0.50, ch*0.50, 0.5);
this.graphics.setColor("#4aa533");
//this.graphics.drawPolygon(x,y);
this.graphics.drawLine( cw*0.60, ch*0.31, cw*0.50, ch*0.50);
this.graphics.drawLine( cw*0.75, ch*0.50, cw*0.50, ch*0.50);
//this.graphics.setColor("#4aa533");
//this.graphics.drawEllipse(x_cir2,y_cir2,this.getWidth()-10,this.getHeight()-10);
//this.graphics.drawLine(this.getWidth()/2,this.getHeight()/2,this.getWidth()/1.3,this.getHeight()/2); //horizontal line
//this.graphics.drawLine(this.getWidth()/2,this.getHeight()/2,this.getWidth()/2,this.getHeight()/4.5); //vertical line
this.graphics.paint();
//Code Added to Dynamically shift Ports on resizing of shapes/
if(this.input1!=null){
this.input1.setPosition(0,this.height/2);
}
if(this.output1!=null){
this.output1.setPosition(this.width/2,this.height);
}
if(this.input2!=null){
this.input2.setPosition(this.width/2,0);
}
if(this.output2!=null){
this.output2.setPosition(this.width,this.height/2);
}
};
bpmnEventTimerStart.prototype.setWorkflow=function(_40c5){

View File

@@ -584,7 +584,7 @@ MyWorkflow.prototype.AddEventStartContextMenu=function(oShape)
type:'bpmnEventRuleStart',
scope:oShape,
handler: MyWorkflow.prototype.toggleShapes
}, {
}/*, {
text: 'Signal',
type:'bpmnEventSignalStart',
scope:oShape,