Add Throw Event Component

This commit is contained in:
mauriziovitale84
2016-10-25 12:18:50 +01:00
parent 5d95c1203f
commit 042a6f6765
9 changed files with 84 additions and 4 deletions

View File

@@ -2,4 +2,4 @@
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-circle> [fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-circle>
<raphael-circle [center]="center" [radius]="circleRadiusOuter" [strokeWidth]="options.strokeWidth" [stroke]="options.stroke" <raphael-circle [center]="center" [radius]="circleRadiusOuter" [strokeWidth]="options.strokeWidth" [stroke]="options.stroke"
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-circle> [fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-circle>
<diagram-container-icon-event [data]="data" [type]="data.eventDefinition.type"></diagram-container-icon-event> <diagram-container-icon-event [data]="data" [type]="data.eventDefinition.type" [fillColor]="signalFillColor"></diagram-container-icon-event>

View File

@@ -34,6 +34,8 @@ export class DiagramBoundaryEventComponent {
center: any = {}; center: any = {};
options: any = {stroke: '', fillColors: '', fillOpacity: '', strokeWidth: 1}; options: any = {stroke: '', fillColors: '', fillOpacity: '', strokeWidth: 1};
signalFillColor: string;
circleRadiusInner: number; circleRadiusInner: number;
circleRadiusOuter: number; circleRadiusOuter: number;
@@ -50,5 +52,7 @@ export class DiagramBoundaryEventComponent {
this.options.stroke = this.diagramColorService.getBpmnColor(this.data, DiagramColorService.MAIN_STROKE_COLOR); this.options.stroke = this.diagramColorService.getBpmnColor(this.data, DiagramColorService.MAIN_STROKE_COLOR);
this.options.fillColors = this.diagramColorService.getFillColour(this.data.id); this.options.fillColors = this.diagramColorService.getFillColour(this.data.id);
this.options.fillOpacity = this.diagramColorService.getFillOpacity(); this.options.fillOpacity = this.diagramColorService.getFillOpacity();
this.signalFillColor = 'none';
} }
} }

View File

@@ -0,0 +1,6 @@
<raphael-circle [center]="center" [radius]="circleRadiusInner" [strokeWidth]="options.strokeWidth" [stroke]="options.stroke"
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-circle>
<raphael-circle [center]="center" [radius]="circleRadiusOuter" [strokeWidth]="options.strokeWidth" [stroke]="options.stroke"
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-circle>
<diagram-container-icon-event [data]="data" [type]="data.eventDefinition && data.eventDefinition.type"
[fillColor]="signalFillColor"></diagram-container-icon-event>

View File

@@ -0,0 +1,58 @@
/*!
* @license
* Copyright 2016 Alfresco Software, Ltd.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { Component, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { DiagramColorService } from './../services/diagram-color.service';
@Component({
moduleId: module.id,
selector: 'diagram-throw-event',
templateUrl: './diagram-throw-event.component.html',
styleUrls: ['./diagram-throw-event.component.css']
})
export class DiagramThrowEventComponent {
@Input()
data: any;
@Output()
onError = new EventEmitter();
center: any = {};
options: any = {stroke: '', fillColors: '', fillOpacity: '', strokeWidth: 1};
signalFillColor: string;
circleRadiusInner: number;
circleRadiusOuter: number;
constructor(public elementRef: ElementRef,
private diagramColorService: DiagramColorService) {}
ngOnInit() {
this.center.x = this.data.x + (this.data.width / 2);
this.center.y = this.data.y + (this.data.height / 2);
this.circleRadiusInner = 12;
this.circleRadiusOuter = 15;
this.options.stroke = this.diagramColorService.getBpmnColor(this.data, DiagramColorService.MAIN_STROKE_COLOR);
this.options.fillColors = this.diagramColorService.getFillColour(this.data.id);
this.options.fillOpacity = this.diagramColorService.getFillOpacity();
this.signalFillColor = 'black';
}
}

View File

@@ -16,10 +16,13 @@
*/ */
import { DiagramBoundaryEventComponent } from './diagram-boundary-event.component'; import { DiagramBoundaryEventComponent } from './diagram-boundary-event.component';
import { DiagramThrowEventComponent } from './diagram-throw-event.component';
// primitives // primitives
export * from './diagram-boundary-event.component'; export * from './diagram-boundary-event.component';
export * from './diagram-throw-event.component';
export const DIAGRAM_BOUNDARY_EVENTS_DIRECTIVES: any[] = [ export const DIAGRAM_BOUNDARY_EVENTS_DIRECTIVES: any[] = [
DiagramBoundaryEventComponent DiagramBoundaryEventComponent,
DiagramThrowEventComponent
]; ];

View File

@@ -40,6 +40,9 @@
<div *ngSwitchCase="'BoundaryEvent'"> <div *ngSwitchCase="'BoundaryEvent'">
<diagram-boundary-event [data]="element"></diagram-boundary-event> <diagram-boundary-event [data]="element"></diagram-boundary-event>
</div> </div>
<div *ngSwitchCase="'ThrowEvent'">
<diagram-throw-event [data]="element"></diagram-throw-event>
</div>
<div *ngSwitchCase="'IntermediateCatchEvent'"> <div *ngSwitchCase="'IntermediateCatchEvent'">
<diagram-intermediate-catching-event [data]="element"></diagram-intermediate-catching-event> <diagram-intermediate-catching-event [data]="element"></diagram-intermediate-catching-event>
</div> </div>

View File

@@ -6,7 +6,7 @@
<diagram-icon-error [data]="data"></diagram-icon-error> <diagram-icon-error [data]="data"></diagram-icon-error>
</div> </div>
<div *ngSwitchCase="'signal'"> <div *ngSwitchCase="'signal'">
<diagram-icon-signal [data]="data"></diagram-icon-signal> <diagram-icon-signal [data]="data" [fillColor]="fillColor"></diagram-icon-signal>
</div> </div>
<div *ngSwitchCase="'message'"> <div *ngSwitchCase="'message'">
<diagram-icon-message [data]="data"></diagram-icon-message> <diagram-icon-message [data]="data"></diagram-icon-message>

View File

@@ -31,6 +31,9 @@ export class DiagramContainerIconEventTaskComponent {
@Input() @Input()
type: string; type: string;
@Input()
fillColor: string;
@Output() @Output()
onError = new EventEmitter(); onError = new EventEmitter();

View File

@@ -28,6 +28,9 @@ export class DiagramIconSignalComponent {
@Input() @Input()
data: any; data: any;
@Input()
fillColor: string;
@Output() @Output()
onError = new EventEmitter(); onError = new EventEmitter();
@@ -42,7 +45,7 @@ export class DiagramIconSignalComponent {
this.position = {x: this.data.x - 1, y: this.data.y - 1}; this.position = {x: this.data.x - 1, y: this.data.y - 1};
this.options.stroke = 'black'; this.options.stroke = 'black';
this.options.fillColors = 'none'; this.options.fillColors = this.fillColor;
this.options.strokeWidth = 1; this.options.strokeWidth = 1;
} }
} }