Add Mule task component

This commit is contained in:
mauriziovitale84 2016-10-24 11:45:26 +01:00
parent 9b4e449388
commit d047e98e72
9 changed files with 174 additions and 3 deletions

View File

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

View File

@ -0,0 +1,2 @@
<diagram-task [data]="data"></diagram-task>
<diagram-icon-mule-task [data]="data"></diagram-icon-mule-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-mule-task',
templateUrl: './diagram-mule-task.component.html',
styleUrls: ['./diagram-mule-task.component.css']
})
export class DiagramMuleTaskComponent {
@Input()
data: any;
@Output()
onError = new EventEmitter();
constructor(public elementRef: ElementRef) {}
ngOnInit() {
}
}

View File

@ -22,6 +22,7 @@ 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';
import { DiagramMuleTaskComponent } from './diagram-mule-task.component';
// primitives
export * from './diagram-container-service-task.component';
@ -31,6 +32,7 @@ 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 * from './diagram-mule-task.component';
export const DIAGRAM_ACTIVITIES_DIRECTIVES: any[] = [
DiagramContainerServiceTaskComponent,
@ -39,5 +41,6 @@ export const DIAGRAM_ACTIVITIES_DIRECTIVES: any[] = [
DiagramSendTaskComponent,
DiagramUserTaskComponent,
DiagramManualTaskComponent,
DiagramCamelTaskComponent
DiagramCamelTaskComponent,
DiagramMuleTaskComponent
];

View File

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

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-mule-task',
templateUrl: './diagram-icon-mule-task.component.html',
styleUrls: ['./diagram-icon-mule-task.component.css']
})
export class DiagramIconMuleTaskComponent {
@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 + 2, y: this.data.y + 2};
this.options.stroke = 'none' ;
this.options.fillColors = '#bd4848' ;
}
}

View File

@ -20,6 +20,7 @@ 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';
import { DiagramIconMuleTaskComponent } from './diagram-icon-mule-task.component';
// primitives
export * from './diagram-icon-service-task.component';
@ -27,11 +28,13 @@ 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 * from './diagram-icon-mule-task.component';
export const DIAGRAM_ICONS_DIRECTIVES: any[] = [
DiagramIconServiceTaskComponent,
DiagramIconSendTaskComponent,
DiagramIconUserTaskComponent,
DiagramIconManualTaskComponent,
DiagramIconCamelTaskComponent
DiagramIconCamelTaskComponent,
DiagramIconMuleTaskComponent
];

View File

@ -30,6 +30,7 @@ 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';
import { RaphaelIconMuleDirective } from './raphael-icon-mule.component';
// primitives
export * from './raphael-circle.component';
@ -46,6 +47,7 @@ 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 * from './raphael-icon-mule.component';
export const RAPHAEL_DIRECTIVES: any[] = [
RaphaelCircleDirective,
@ -60,5 +62,6 @@ export const RAPHAEL_DIRECTIVES: any[] = [
RaphaelIconSendDirective,
RaphaelIconUserDirective,
RaphaelIconManualDirective,
RaphaelIconCamelDirective
RaphaelIconCamelDirective,
RaphaelIconMuleDirective
];

View File

@ -0,0 +1,71 @@
/*!
* @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-mule'})
export class RaphaelIconMuleDirective 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,0 C 3.581722,0 0,3.5817 0,8 c 0,4.4183 3.581722,8 8,8 4.418278,0 8,-3.5817 8,-8 L 16,7.6562
C 15.813571,3.3775 12.282847,0 8,0 z M 5.1875,2.7812 8,7.3437 10.8125,2.7812 c 1.323522,0.4299 2.329453,1.5645 2.8125,2.8438
1.136151,2.8609 -0.380702,6.4569 -3.25,7.5937 -0.217837,-0.6102 -0.438416,-1.2022 -0.65625,-1.8125 0.701032,-0.2274
1.313373,-0.6949 1.71875,-1.3125 0.73624,-1.2317 0.939877,-2.6305 -0.03125,-4.3125 l -2.75,4.0625 -0.65625,0 -0.65625,0 -2.75,-4
C 3.5268433,7.6916 3.82626,8.862 4.5625,10.0937 4.967877,10.7113 5.580218,11.1788 6.28125,11.4062 6.063416,12.0165 5.842837,12.6085
5.625,13.2187 2.755702,12.0819 1.238849,8.4858 2.375,5.625 2.858047,4.3457 3.863978,3.2112 5.1875,2.7812 z`).attr({
'stroke': this.stroke,
'fill': this.fillColors
});
return path1.transform('T' + position.x + ',' + position.y);
}
}