Add signal event component

This commit is contained in:
mauriziovitale84 2016-10-25 11:29:19 +01:00
parent f4e73d7d5a
commit 3c036d97b7
6 changed files with 129 additions and 2 deletions

View File

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

View File

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

View File

@ -0,0 +1,48 @@
/*!
* @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-signal',
templateUrl: './diagram-icon-signal.component.html',
styleUrls: ['./diagram-icon-signal.component.css']
})
export class DiagramIconSignalComponent {
@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 - 1, y: this.data.y - 1};
this.options.stroke = 'black';
this.options.fillColors = 'none';
this.options.strokeWidth = 1;
}
}

View File

@ -31,6 +31,7 @@ import { DiagramIconBusinessRuleTaskComponent } from './diagram-icon-business-ru
import { DiagramContainerIconEventTaskComponent } from './diagram-container-icon-event.component';
import { DiagramIconTimerComponent } from './diagram-icon-timer.component';
import { DiagramIconErrorComponent } from './diagram-icon-error.component';
import { DiagramIconSignalComponent } from './diagram-icon-signal.component';
// primitives
export * from './diagram-icon-service-task.component';
@ -49,6 +50,7 @@ export * from './diagram-icon-business-rule-task.component';
export * from './diagram-container-icon-event.component';
export * from './diagram-icon-timer.component';
export * from './diagram-icon-error.component';
export * from './diagram-icon-signal.component';
export const DIAGRAM_ICONS_DIRECTIVES: any[] = [
DiagramIconServiceTaskComponent,
@ -66,5 +68,6 @@ export const DIAGRAM_ICONS_DIRECTIVES: any[] = [
DiagramIconBusinessRuleTaskComponent,
DiagramContainerIconEventTaskComponent,
DiagramIconTimerComponent,
DiagramIconErrorComponent
DiagramIconErrorComponent,
DiagramIconSignalComponent
];

View File

@ -30,6 +30,7 @@ import { RaphaelIconScriptDirective } from './raphael-icon-script.component';
import { RaphaelIconBusinessRuleDirective } from './raphael-icon-business-rule.component';
import { RaphaelIconTimerDirective } from './raphael-icon-timer.component';
import { RaphaelIconErrorDirective } from './raphael-icon-error.component';
import { RaphaelIconSignalDirective } from './raphael-icon-signal.component';
// primitives
export * from './raphael-icon-service.component';
@ -47,6 +48,7 @@ export * from './raphael-icon-script.component';
export * from './raphael-icon-business-rule.component';
export * from './raphael-icon-timer.component';
export * from './raphael-icon-error.component';
export * from './raphael-icon-signal.component';
export const RAPHAEL_ICONS_DIRECTIVES: any[] = [
RaphaelIconServiceDirective,
@ -63,5 +65,6 @@ export const RAPHAEL_ICONS_DIRECTIVES: any[] = [
RaphaelIconScriptDirective,
RaphaelIconBusinessRuleDirective,
RaphaelIconTimerDirective,
RaphaelIconErrorDirective
RaphaelIconErrorDirective,
RaphaelIconSignalDirective
];

View File

@ -0,0 +1,68 @@
/*!
* @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-signal'})
export class RaphaelIconSignalDirective 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.7124971,21.247342 L 23.333334,21.247342 L 16.022915,8.5759512 L 8.7124971,21.247342 z`).attr({
'opacity': this.fillOpacity,
'stroke': this.stroke,
'strokeWidth': this.strokeWidth,
'fill': this.fillColors
});
return path1.transform('T' + position.x + ',' + position.y);
}
}