Add event message component

ng2-components/ng2-activiti-analytics/src/components/diagrams/icons/diagram-container-icon-event.component.html

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

ng2-components/ng2-activiti-analytics/src/components/diagrams/icons/diagram-icon-message.component.html

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

ng2-components/ng2-activiti-analytics/src/components/diagrams/icons/diagram-icon-message.component.ts

@@ -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-message',
+    templateUrl: './diagram-icon-message.component.html',
+    styleUrls: ['./diagram-icon-message.component.css']
+})
+export class DiagramIconMessageComponent {
+    @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 + 6, y: this.data.y + 6};
+
+        this.options.stroke = 'none';
+        this.options.fillColors = '#585858';
+        this.options.strokeWidth = 1;
+    }
+}

ng2-components/ng2-activiti-analytics/src/components/diagrams/icons/index.ts

@@ -32,6 +32,7 @@ import { DiagramContainerIconEventTaskComponent } from './diagram-container-icon
 import { DiagramIconTimerComponent } from './diagram-icon-timer.component';
 import { DiagramIconErrorComponent } from './diagram-icon-error.component';
 import { DiagramIconSignalComponent } from './diagram-icon-signal.component';
+import { DiagramIconMessageComponent } from './diagram-icon-message.component';
 
 // primitives
 export * from './diagram-icon-service-task.component';
@@ -51,6 +52,7 @@ 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 * from './diagram-icon-message.component';
 
 export const DIAGRAM_ICONS_DIRECTIVES: any[] = [
     DiagramIconServiceTaskComponent,
@@ -69,5 +71,6 @@ export const DIAGRAM_ICONS_DIRECTIVES: any[] = [
     DiagramContainerIconEventTaskComponent,
     DiagramIconTimerComponent,
     DiagramIconErrorComponent,
-    DiagramIconSignalComponent
+    DiagramIconSignalComponent,
+    DiagramIconMessageComponent
 ];

ng2-components/ng2-activiti-analytics/src/components/raphael/icons/index.ts

@@ -31,6 +31,7 @@ import { RaphaelIconBusinessRuleDirective } from './raphael-icon-business-rule.c
 import { RaphaelIconTimerDirective } from './raphael-icon-timer.component';
 import { RaphaelIconErrorDirective } from './raphael-icon-error.component';
 import { RaphaelIconSignalDirective } from './raphael-icon-signal.component';
+import { RaphaelIconMessageDirective } from './raphael-icon-message.component';
 
 // primitives
 export * from './raphael-icon-service.component';
@@ -49,6 +50,7 @@ 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 * from './raphael-icon-message.component';
 
 export const RAPHAEL_ICONS_DIRECTIVES: any[] = [
     RaphaelIconServiceDirective,
@@ -66,5 +68,6 @@ export const RAPHAEL_ICONS_DIRECTIVES: any[] = [
     RaphaelIconBusinessRuleDirective,
     RaphaelIconTimerDirective,
     RaphaelIconErrorDirective,
-    RaphaelIconSignalDirective
+    RaphaelIconSignalDirective,
+    RaphaelIconMessageDirective
 ];

ng2-components/ng2-activiti-analytics/src/components/raphael/icons/raphael-icon-message.component.ts

@@ -0,0 +1,69 @@
+/*!
+ * @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-message'})
+export class RaphaelIconMessageDirective 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 1 3 L 9 11 L 17 3 L 1 3 z M 1 5 L 1 13 L 5 9 L 1 5 z M 17 5 L 13 9 L 17 13 L 17 5 z M 6 10 L 1 15
+        L 17 15 L 12 10 L 9 13 L 6 10 z`).attr({
+            'opacity': this.fillOpacity,
+            'stroke': this.stroke,
+            'strokeWidth': this.strokeWidth,
+            'fill': this.fillColors
+        });
+        return path1.transform('T' + position.x + ',' + position.y);
+    }
+}