Add Camel task component

This commit is contained in:
mauriziovitale84
2016-10-24 11:33:20 +01:00
parent 0e217c49db
commit 9b4e449388
9 changed files with 188 additions and 3 deletions

View File

@@ -0,0 +1,2 @@
<diagram-task [data]="data"></diagram-task>
<diagram-icon-camel-task [data]="data"></diagram-icon-camel-task>

View File

@@ -0,0 +1,38 @@
/*!
* @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';
@Component({
moduleId: module.id,
selector: 'diagram-camel-task',
templateUrl: './diagram-camel-task.component.html',
styleUrls: ['./diagram-camel-task.component.css']
})
export class DiagramCamelTaskComponent {
@Input()
data: any;
@Output()
onError = new EventEmitter();
constructor(public elementRef: ElementRef) {}
ngOnInit() {
}
}

View File

@@ -2,6 +2,9 @@
<div *ngSwitchCase="'mail'">
<diagram-send-task [data]="data"></diagram-send-task>
</div>
<div *ngSwitchCase="'camel'">
<diagram-camel-task [data]="data"></diagram-camel-task>
</div>
<div *ngSwitchDefault>
<diagram-service-task [data]="data"></diagram-service-task>
</div>

View File

@@ -21,6 +21,7 @@ import { DiagramServiceTaskComponent } from './diagram-service-task.component';
import { DiagramSendTaskComponent } from './diagram-send-task.component';
import { DiagramUserTaskComponent } from './diagram-user-task.component';
import { DiagramManualTaskComponent } from './diagram-manual-task.component';
import { DiagramCamelTaskComponent } from './diagram-camel-task.component';
// primitives
export * from './diagram-container-service-task.component';
@@ -29,6 +30,7 @@ export * from './diagram-service-task.component';
export * from './diagram-send-task.component';
export * from './diagram-user-task.component';
export * from './diagram-manual-task.component';
export * from './diagram-camel-task.component';
export const DIAGRAM_ACTIVITIES_DIRECTIVES: any[] = [
DiagramContainerServiceTaskComponent,
@@ -36,5 +38,6 @@ export const DIAGRAM_ACTIVITIES_DIRECTIVES: any[] = [
DiagramServiceTaskComponent,
DiagramSendTaskComponent,
DiagramUserTaskComponent,
DiagramManualTaskComponent
DiagramManualTaskComponent,
DiagramCamelTaskComponent
];

View File

@@ -0,0 +1,2 @@
<raphael-icon-camel [position]="position" [stroke]="options.stroke" [strokeWidth]="options.strokeWidth"
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-icon-camel>

View File

@@ -0,0 +1,46 @@
/*!
* @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-icon-camel-task',
templateUrl: './diagram-icon-camel-task.component.html',
styleUrls: ['./diagram-icon-camel-task.component.css']
})
export class DiagramIconCamelTaskComponent {
@Input()
data: any;
@Output()
onError = new EventEmitter();
position: any;
options: any = {stroke: '', fillColors: '', fillOpacity: '', strokeWidth: ''};
constructor(public elementRef: ElementRef,
private diagramColorService: DiagramColorService) {}
ngOnInit() {
this.position = {x: this.data.x + 8, y: this.data.y + 6};
this.options.stroke = 'none' ;
this.options.fillColors = '#bd4848' ;
}
}

View File

@@ -19,16 +19,19 @@ import { DiagramIconServiceTaskComponent } from './diagram-icon-service-task.com
import { DiagramIconSendTaskComponent } from './diagram-icon-send-task.component';
import { DiagramIconUserTaskComponent } from './diagram-icon-user-task.component';
import { DiagramIconManualTaskComponent } from './diagram-icon-manual-task.component';
import { DiagramIconCamelTaskComponent } from './diagram-icon-camel-task.component';
// primitives
export * from './diagram-icon-service-task.component';
export * from './diagram-icon-send-task.component';
export * from './diagram-icon-user-task.component';
export * from './diagram-icon-manual-task.component';
export * from './diagram-icon-camel-task.component';
export const DIAGRAM_ICONS_DIRECTIVES: any[] = [
DiagramIconServiceTaskComponent,
DiagramIconSendTaskComponent,
DiagramIconUserTaskComponent,
DiagramIconManualTaskComponent
DiagramIconManualTaskComponent,
DiagramIconCamelTaskComponent
];

View File

@@ -29,6 +29,7 @@ import { RaphaelIconServiceDirective } from './raphael-icon-service.component';
import { RaphaelIconSendDirective } from './raphael-icon-send.component';
import { RaphaelIconUserDirective } from './raphael-icon-user.component';
import { RaphaelIconManualDirective } from './raphael-icon-manual.component';
import { RaphaelIconCamelDirective } from './raphael-icon-camel.component';
// primitives
export * from './raphael-circle.component';
@@ -44,6 +45,7 @@ export * from './raphael-icon-service.component';
export * from './raphael-icon-send.component';
export * from './raphael-icon-user.component';
export * from './raphael-icon-manual.component';
export * from './raphael-icon-camel.component';
export const RAPHAEL_DIRECTIVES: any[] = [
RaphaelCircleDirective,
@@ -57,5 +59,6 @@ export const RAPHAEL_DIRECTIVES: any[] = [
RaphaelIconServiceDirective,
RaphaelIconSendDirective,
RaphaelIconUserDirective,
RaphaelIconManualDirective
RaphaelIconManualDirective,
RaphaelIconCamelDirective
];

View File

@@ -0,0 +1,85 @@
/*!
* @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 { Directive, OnInit, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { Point } from './models/point';
import { RaphaelBase } from './raphael-base';
import { RaphaelService } from './raphael.service';
@Directive({selector: 'raphael-icon-camel'})
export class RaphaelIconCamelDirective extends RaphaelBase implements OnInit {
@Input()
paper: any;
@Input()
position: Point;
@Input()
text: string;
@Output()
onError = new EventEmitter();
@Input()
strokeWidth: number;
@Input()
fillColors: any;
@Input()
stroke: any;
@Input()
fillOpacity: any;
constructor(public elementRef: ElementRef,
raphaelService: RaphaelService) {
super(elementRef, raphaelService);
}
ngOnInit() {
console.log(this.elementRef);
this.draw(this.position);
}
public draw(position: Point) {
let path1 = this.paper.path(`m 8.1878027,15.383782 c -0.824818,-0.3427 0.375093,-1.1925 0.404055,-1.7743 0.230509,-0.8159
-0.217173,-1.5329 -0.550642,-2.2283 -0.106244,-0.5273 -0.03299,-1.8886005 -0.747194,-1.7818005 -0.712355,0.3776 -0.9225,1.2309005
-1.253911,1.9055005 -0.175574,1.0874 -0.630353,2.114 -0.775834,3.2123 -0.244009,0.4224 -1.741203,0.3888 -1.554386,-0.1397
0.651324,-0.3302 1.13227,-0.9222 1.180246,-1.6705 0.0082,-0.7042 -0.133578,-1.3681 0.302178,-2.0083 0.08617,-0.3202
0.356348,-1.0224005 -0.218996,-0.8051 -0.694517,0.2372 -1.651062,0.6128 -2.057645,-0.2959005 -0.696769,0.3057005 -1.102947,-0.611
-1.393127,-1.0565 -0.231079,-0.6218 -0.437041,-1.3041 -0.202103,-1.9476 -0.185217,-0.7514 -0.39751099,-1.5209 -0.35214999,-2.301
-0.243425,-0.7796 0.86000899,-1.2456 0.08581,-1.8855 -0.76078999,0.1964 -1.41630099,-0.7569 -0.79351899,-1.2877 0.58743,-0.52829998
1.49031699,-0.242 2.09856399,-0.77049998 0.816875,-0.3212 1.256619,0.65019998 1.923119,0.71939998 0.01194,0.7333 -0.0031,1.5042
-0.18417,2.2232 -0.194069,0.564 -0.811196,1.6968 0.06669,1.9398 0.738382,-0.173 1.095723,-0.9364 1.659041,-1.3729 0.727298,-0.3962
1.093982,-1.117 1.344137,-1.8675 0.400558,-0.8287 1.697676,-0.6854 1.955367,0.1758 0.103564,0.5511 0.9073983,1.7538
1.2472763,0.6846 0.121868,-0.6687 0.785541,-1.4454 1.518183,-1.0431 0.813587,0.4875 0.658233,1.6033 1.285504,2.2454
0.768715,0.8117 1.745394,1.4801 2.196633,2.5469 0.313781,0.8074 0.568552,1.707 0.496624,2.5733 -0.35485,0.8576005 -1.224508,-0.216
-0.64725,-0.7284 0.01868,-0.3794 -0.01834,-1.3264 -0.370249,-1.3272 -0.123187,0.7586 -0.152778,1.547 -0.10869,2.3154
0.270285,0.6662005 1.310741,0.7653005 1.060553,1.6763005 -0.03493,0.9801 0.294343,1.9505 0.148048,2.9272 -0.320479,0.2406
-0.79575,0.097 -1.185062,0.1512 -0.165725,0.3657 -0.40138,0.921 -1.020848,0.6744 -0.564671,0.1141 -1.246404,-0.266
-0.578559,-0.7715 0.679736,-0.5602 0.898618,-1.5362 0.687058,-2.3673 -0.529674,-1.108 -1.275984,-2.0954005 -1.839206,-3.1831005
-0.634619,-0.1004 -1.251945,0.6779 -1.956789,0.7408 -0.6065893,-0.038 -1.0354363,-0.06 -0.8495673,0.6969005 0.01681,0.711
0.152396,1.3997 0.157345,2.1104 0.07947,0.7464 0.171287,1.4944 0.238271,2.2351 0.237411,1.0076 -0.687542,1.1488 -1.414811,0.8598
z m 6.8675483,-1.8379 c 0.114364,-0.3658 0.206751,-1.2704 -0.114466,-1.3553 -0.152626,0.5835 -0.225018,1.1888 -0.227537,1.7919
0.147087,-0.1166 0.265559,-0.2643 0.342003,-0.4366 z`).attr({
'stroke': this.stroke,
'fill': this.fillColors
});
return path1.transform('T' + position.x + ',' + position.y);
}
}