diff --git a/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.html b/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.html index e9c271f63f..57d81b1055 100644 --- a/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.html +++ b/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.html @@ -4,6 +4,6 @@ - + -
No metric found
\ No newline at end of file +
No metric found
diff --git a/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.spec.ts b/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.spec.ts index 3be8225c59..bb02e9a5e9 100644 --- a/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.spec.ts +++ b/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.spec.ts @@ -33,9 +33,13 @@ describe('Test ng2-activiti-analytics-report-heat-map', () => { let debug: DebugElement; let element: HTMLElement; - let totalCountPerc = {'sid-fake-id': 0, 'fake-start-event': 100}; - let totalTimePerc = {'sid-fake-id': 10, 'fake-start-event': 30}; - let avgTimePercentages = {'sid-fake-id': 5, 'fake-start-event': 50}; + let totalCountPerc = { 'sid-fake-id': 0, 'fake-start-event': 100 }; + let totalTimePerc = { 'sid-fake-id': 10, 'fake-start-event': 30 }; + let avgTimePercentages = { 'sid-fake-id': 5, 'fake-start-event': 50 }; + + let totalCountValues = { 'sid-fake-id': 2, 'fake-start-event': 3 }; + let totalTimeValues = { 'sid-fake-id': 1, 'fake-start-event': 4 }; + let avgTimeValues = { 'sid-fake-id': 4, 'fake-start-event': 5 }; beforeEach(async(() => { TestBed.configureTestingModule({ @@ -65,7 +69,10 @@ describe('Test ng2-activiti-analytics-report-heat-map', () => { component.report = { totalCountsPercentages: totalCountPerc, + totalCountValues: totalCountValues, totalTimePercentages: totalTimePerc, + totalTimeValues: totalTimeValues, + avgTimeValues: avgTimeValues, avgTimePercentages: avgTimePercentages }; }); @@ -81,7 +88,7 @@ describe('Test ng2-activiti-analytics-report-heat-map', () => { }); it('should render the dropdown with the metric options', async(() => { - component.report = {totalCountsPercentages: {'sid-fake-id': 10, 'fake-start-event': 30}}; + component.report = { totalCountsPercentages: { 'sid-fake-id': 10, 'fake-start-event': 30 } }; component.onSuccess.subscribe(() => { fixture.whenStable().then(() => { @@ -106,21 +113,24 @@ describe('Test ng2-activiti-analytics-report-heat-map', () => { })); it('should change the currentmetric width totalCount', async(() => { - let field = {value: 'totalCount'}; + let field = { value: 'totalCount' }; component.onMetricChanges(field); - expect(component.currentMetric).toEqual(totalCountPerc); + expect(component.currentMetric).toEqual(totalCountValues); + expect(component.currentMetricColors).toEqual(totalCountPerc); })); it('should change the currentmetric width totalTime', async(() => { - let field = {value: 'totalTime'}; + let field = { value: 'totalTime' }; component.onMetricChanges(field); - expect(component.currentMetric).toEqual(totalTimePerc); + expect(component.currentMetric).toEqual(totalTimeValues); + expect(component.currentMetricColors).toEqual(totalTimePerc); })); it('should change the currentmetric width avgTime', async(() => { - let field = {value: 'avgTime'}; + let field = { value: 'avgTime' }; component.onMetricChanges(field); - expect(component.currentMetric).toEqual(avgTimePercentages); + expect(component.currentMetric).toEqual(avgTimeValues); + expect(component.currentMetricColors).toEqual(avgTimePercentages); })); }); diff --git a/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.ts b/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.ts index a9e9bf8db0..5d72668327 100644 --- a/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.ts +++ b/ng2-components/ng2-activiti-analytics/src/components/analytics-report-heat-map.component.ts @@ -40,6 +40,8 @@ export class AnalyticsReportHeatMapComponent implements OnInit { metricForm: FormGroup; currentMetric: string; + currentMetricColors: string; + metricType: string; constructor(private translate: AlfrescoTranslationService, private analyticsService: AnalyticsService, @@ -64,11 +66,17 @@ export class AnalyticsReportHeatMapComponent implements OnInit { onMetricChanges(field: any) { if (field.value === 'totalCount') { - this.currentMetric = this.report.totalCountsPercentages; + this.currentMetric = this.report.totalCountValues; + this.currentMetricColors = this.report.totalCountsPercentages; + this.metricType = 'times'; } else if (field.value === 'totalTime') { - this.currentMetric = this.report.totalTimePercentages; + this.currentMetric = this.report.totalTimeValues; + this.currentMetricColors = this.report.totalTimePercentages; + this.metricType = 'hours'; } else if (field.value === 'avgTime') { - this.currentMetric = this.report.avgTimePercentages; + this.currentMetric = this.report.avgTimeValues; + this.currentMetricColors = this.report.avgTimePercentages; + this.metricType = 'hours'; } } diff --git a/ng2-components/ng2-activiti-diagrams/src/components/activities/diagram-task.component.html b/ng2-components/ng2-activiti-diagrams/src/components/activities/diagram-task.component.html index fe7f52ec74..3b0998e7fb 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/activities/diagram-task.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/activities/diagram-task.component.html @@ -1,4 +1,5 @@ - - \ No newline at end of file + + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-boundary-event.component.html b/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-boundary-event.component.html index 9607de4538..648231ffcd 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-boundary-event.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-boundary-event.component.html @@ -1,5 +1,6 @@ - - \ No newline at end of file + + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-throw-event.component.html b/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-throw-event.component.html index b4dddf5c31..c3d32453f3 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-throw-event.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/boundary-events/diagram-throw-event.component.html @@ -1,6 +1,7 @@ - \ No newline at end of file + [fillColor]="signalFillColor"> + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/diagram-sequence-flow.component.html b/ng2-components/ng2-activiti-diagrams/src/components/diagram-sequence-flow.component.html index 985c72c443..e2bc21f852 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/diagram-sequence-flow.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/diagram-sequence-flow.component.html @@ -1 +1,2 @@ - \ No newline at end of file + + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts b/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts index 67a9b0ebcc..f4bf3704de 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts @@ -74,6 +74,7 @@ describe('Test ng2-activiti-diagrams ', () => { }); describe('Diagrams component Events: ', () => { + beforeEach(() => { jasmine.Ajax.install(); component.processDefinitionId = 'fakeprocess:24:38399'; @@ -91,6 +92,9 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let event: any = element.querySelector('diagram-start-event > diagram-event > raphael-circle'); expect(event).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -113,6 +117,9 @@ describe('Test ng2-activiti-diagrams ', () => { let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + ' diagram-container-icon-event > div > div > diagram-icon-timer > raphael-icon-timer'); expect(iconEvent).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -136,6 +143,9 @@ describe('Test ng2-activiti-diagrams ', () => { let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + ' diagram-container-icon-event > div > div > diagram-icon-signal > raphael-icon-signal'); expect(iconEvent).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -158,6 +168,9 @@ describe('Test ng2-activiti-diagrams ', () => { let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + ' diagram-container-icon-event > div > div > diagram-icon-message > raphael-icon-message'); expect(iconEvent).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -180,6 +193,9 @@ describe('Test ng2-activiti-diagrams ', () => { let iconEvent: any = element.querySelector('diagram-start-event > diagram-event >' + ' diagram-container-icon-event > div > div > diagram-icon-error > raphael-icon-error'); expect(iconEvent).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -198,6 +214,9 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).toBeDefined(); let event: any = element.querySelector('diagram-end-event > diagram-event > raphael-circle'); expect(event).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -220,6 +239,9 @@ describe('Test ng2-activiti-diagrams ', () => { let iconEvent: any = element.querySelector('diagram-end-event > diagram-event >' + ' diagram-container-icon-event > div > div > diagram-icon-error > raphael-icon-error'); expect(iconEvent).not.toBeNull(); + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -257,6 +279,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-user-task > diagram-icon-user-task > raphael-icon-user'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -282,6 +308,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-manual-task > diagram-icon-manual-task > raphael-icon-manual'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -307,6 +337,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-service-task > diagram-icon-service-task > raphael-icon-service'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -348,6 +382,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-camel-task > diagram-icon-camel-task > raphael-icon-camel'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -399,6 +437,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-alfresco-publish-task > diagram-icon-alfresco-publish-task >' + ' raphael-icon-alfresco-publish'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -425,6 +467,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-google-drive-publish-task >' + ' diagram-icon-google-drive-publish-task > raphael-icon-google-drive-publish'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -451,6 +497,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-rest-call-task > diagram-icon-rest-call-task >' + ' raphael-icon-rest-call'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -477,6 +527,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-box-publish-task >' + ' diagram-icon-box-publish-task > raphael-icon-box-publish'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -502,6 +556,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-receive-task > diagram-icon-receive-task > raphael-icon-receive'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -527,6 +585,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-script-task > diagram-icon-script-task > raphael-icon-script'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -552,6 +614,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconTask: any = element.querySelector('diagram-business-rule-task > diagram-icon-business-rule-task > raphael-icon-business-rule'); expect(iconTask).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].name); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -586,6 +652,10 @@ describe('Test ng2-activiti-diagrams ', () => { let shape1: any = element.querySelector('diagram-exclusive-gateway > raphael-cross'); expect(shape1).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -607,6 +677,10 @@ describe('Test ng2-activiti-diagrams ', () => { let shape1: any = element.querySelector('diagram-inclusive-gateway > raphael-circle'); expect(shape1).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -628,6 +702,10 @@ describe('Test ng2-activiti-diagrams ', () => { let shape1: any = element.querySelector('diagram-parallel-gateway > raphael-plus'); expect(shape1).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -659,6 +737,10 @@ describe('Test ng2-activiti-diagrams ', () => { let shape2: any = element.querySelector('diagram-event-gateway > raphael-pentagon'); expect(shape2).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -689,7 +771,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-intermediate-catching-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -700,6 +782,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + ' div > div > diagram-icon-timer'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -718,7 +804,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-intermediate-catching-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -729,6 +815,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + ' div > div > diagram-icon-error'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -747,7 +837,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-intermediate-catching-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -758,6 +848,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + ' div > div > diagram-icon-signal'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -776,7 +870,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-intermediate-catching-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -787,6 +881,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-intermediate-catching-event > diagram-container-icon-event >' + ' div > div > diagram-icon-message'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -817,7 +915,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-boundary-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -828,6 +926,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + ' div > div > diagram-icon-timer'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -846,7 +948,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-boundary-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -857,6 +959,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + ' div > div > diagram-icon-error'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -875,7 +981,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-boundary-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -886,6 +992,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + ' div > div > diagram-icon-signal'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -904,7 +1014,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-boundary-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -915,6 +1025,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + ' div > div > diagram-icon-message'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -933,7 +1047,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-boundary-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -944,6 +1058,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-boundary-event > diagram-container-icon-event >' + ' div > div > diagram-icon-message'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -974,7 +1092,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-throw-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -1003,7 +1121,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-throw-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -1014,6 +1132,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + ' div > div > diagram-icon-error'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -1032,7 +1154,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-throw-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -1043,6 +1165,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + ' div > div > diagram-icon-signal'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -1061,7 +1187,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-throw-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -1072,6 +1198,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + ' div > div > diagram-icon-message'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -1090,7 +1220,7 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-throw-event'); expect(shape).not.toBeNull(); - expect(shape.children.length).toBe(3); + expect(shape.children.length).toBe(4); let outerCircle = shape.children[0]; expect(outerCircle.localName).toEqual('raphael-circle'); @@ -1101,6 +1231,10 @@ describe('Test ng2-activiti-diagrams ', () => { let iconShape: any = element.querySelector('diagram-throw-event > diagram-container-icon-event >' + ' div > div > diagram-icon-message'); expect(iconShape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -1131,6 +1265,10 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-subprocess > raphael-rect'); expect(shape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -1149,6 +1287,10 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-event-subprocess > raphael-rect'); expect(shape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.elements[0].id); + expect(tooltip.textContent).toContain(res.elements[0].type); }); }); component.ngOnChanges(); @@ -1238,6 +1380,10 @@ describe('Test ng2-activiti-diagrams ', () => { expect(res).not.toBeNull(); let shape: any = element.querySelector('diagram-sequence-flow > raphael-flow-arrow'); expect(shape).not.toBeNull(); + + let tooltip: any = element.querySelector('diagram-tooltip > div'); + expect(tooltip.textContent).toContain(res.flows[0].id); + expect(tooltip.textContent).toContain(res.flows[0].type); }); }); component.ngOnChanges(); diff --git a/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.ts b/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.ts index d0c426c9a3..676a6df582 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/diagram.component.ts @@ -20,6 +20,7 @@ import { AlfrescoTranslationService } from 'ng2-alfresco-core'; import { DiagramsService } from '../services/diagrams.service'; import { DiagramColorService } from '../services/diagram-color.service'; import { RaphaelService } from './raphael/raphael.service'; +import { DiagramModel, DiagramElementModel } from '../models/diagram.model'; @Component({ moduleId: module.id, @@ -33,6 +34,12 @@ export class DiagramComponent { @Input() metricPercentages: any; + @Input() + metricColor: any; + + @Input() + metricType: string = ''; + @Input() width: number = 1000; @@ -45,7 +52,7 @@ export class DiagramComponent { @Output() onError = new EventEmitter(); - private diagram: any; + private diagram: DiagramModel; private elementRef: ElementRef; constructor(elementRef: ElementRef, @@ -65,14 +72,15 @@ export class DiagramComponent { ngOnChanges(changes: SimpleChanges) { this.reset(); - this.diagramColorService.setTotalColors(this.metricPercentages); + this.diagramColorService.setTotalColors(this.metricColor); this.getProcessDefinitionModel(this.processDefinitionId); } getProcessDefinitionModel(processDefinitionId: string) { this.diagramsService.getProcessDefinitionModel(processDefinitionId).subscribe( (res: any) => { - this.diagram = res; + this.diagram = new DiagramModel(res); + this.setMetricValueToDiagramElement(this.diagram, this.metricPercentages, this.metricType); this.onSuccess.emit(res); }, (err: any) => { @@ -82,6 +90,19 @@ export class DiagramComponent { ); } + setMetricValueToDiagramElement(diagram: DiagramModel, metrics: any, metricType: string) { + for (let key in metrics) { + if (metrics.hasOwnProperty(key)) { + let foundElement: DiagramElementModel = diagram.elements.find( + (element: DiagramElementModel) => element.id === key); + if (foundElement) { + foundElement.value = metrics[key]; + foundElement.dataType = metricType; + } + } + } + } + reset() { this.raphaelService.reset(); } diff --git a/ng2-components/ng2-activiti-diagrams/src/components/events/diagram-event.component.html b/ng2-components/ng2-activiti-diagrams/src/components/events/diagram-event.component.html index e85a6aee8d..d5f271463e 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/events/diagram-event.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/events/diagram-event.component.html @@ -1,4 +1,5 @@ - \ No newline at end of file + [fillColor]="iconFillColor"> + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/gateways/diagram-gateway.component.html b/ng2-components/ng2-activiti-diagrams/src/components/gateways/diagram-gateway.component.html index 6550ba6dca..675fd3d428 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/gateways/diagram-gateway.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/gateways/diagram-gateway.component.html @@ -1,2 +1,3 @@ - \ No newline at end of file + + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-send-task.component.html b/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-send-task.component.html index 50185da5f6..5f87206541 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-send-task.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-send-task.component.html @@ -1,2 +1,3 @@ \ No newline at end of file + [fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"> + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-timer.component.html b/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-timer.component.html index 1bb93fff2a..73ddeeb3a0 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-timer.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/icons/diagram-icon-timer.component.html @@ -1,4 +1,5 @@ \ No newline at end of file + [fillColors]="timerOptions.fillColors" [fillOpacity]="timerOptions.fillOpacity"> + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/index.ts b/ng2-components/ng2-activiti-diagrams/src/components/index.ts index b6346365b9..68ca24bf0d 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/index.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/index.ts @@ -25,6 +25,7 @@ import { DIAGRAM_BOUNDARY_EVENTS_DIRECTIVES } from './boundary-events/index'; import { DIAGRAM_INTERMEDIATE_EVENTS_DIRECTIVES } from './intermediate-catching-events/index'; import { DIAGRAM_STRUCTURAL_DIRECTIVES } from './structural/index'; import { DIAGRAM_SWIMLANES_DIRECTIVES } from './swimlanes/index'; +import { DiagramTooltip } from './tooltip/index'; import { DiagramColorService } from '../services/diagram-color.service'; import { DiagramsService } from '../services/diagrams.service'; @@ -50,7 +51,8 @@ export const DIAGRAM_DIRECTIVES: any[] = [ DIAGRAM_BOUNDARY_EVENTS_DIRECTIVES, DIAGRAM_INTERMEDIATE_EVENTS_DIRECTIVES, DIAGRAM_STRUCTURAL_DIRECTIVES, - DIAGRAM_SWIMLANES_DIRECTIVES + DIAGRAM_SWIMLANES_DIRECTIVES, + DiagramTooltip ]; export const DIAGRAM_PROVIDERS: any[] = [ diff --git a/ng2-components/ng2-activiti-diagrams/src/components/intermediate-catching-events/diagram-intermediate-catching-event.component.html b/ng2-components/ng2-activiti-diagrams/src/components/intermediate-catching-events/diagram-intermediate-catching-event.component.html index b5eb151f55..d1717ccfab 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/intermediate-catching-events/diagram-intermediate-catching-event.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/intermediate-catching-events/diagram-intermediate-catching-event.component.html @@ -1,5 +1,6 @@ - - \ No newline at end of file + + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-circle.component.ts b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-circle.component.ts index 566ceb0754..2552c03581 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-circle.component.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-circle.component.ts @@ -43,6 +43,9 @@ export class RaphaelCircleDirective extends RaphaelBase implements OnInit { @Input() fillOpacity: any; + @Input() + elementId: string; + @Output() onError = new EventEmitter(); @@ -54,7 +57,8 @@ export class RaphaelCircleDirective extends RaphaelBase implements OnInit { ngOnInit() { console.log(this.elementRef); let opts = {'stroke-width': this.strokeWidth, 'fill': this.fillColors, 'stroke': this.stroke, 'fill-opacity': this.fillOpacity}; - this.draw(this.center, this.radius, opts); + let drawElement = this.draw(this.center, this.radius, opts); + drawElement.node.id = this.elementId; } public draw(center: Point, radius: number, opts: any) { diff --git a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-flow-arrow.component.ts b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-flow-arrow.component.ts index 3cf8ae5cb3..4eee171c9c 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-flow-arrow.component.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-flow-arrow.component.ts @@ -54,7 +54,7 @@ export class RaphaelFlowArrowDirective extends RaphaelBase implements OnInit { polyline.element.attr({'stroke-width': this.SEQUENCEFLOW_STROKE}); polyline.element.attr({'stroke': '#585858'}); - polyline.element.id = this.flow.id; + polyline.element.node.id = this.flow.id; let lastLineIndex = polyline.getLinesCount() - 1; let line = polyline.getLine(lastLineIndex); diff --git a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rect.component.ts b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rect.component.ts index d4b147f914..e2b9fecac1 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rect.component.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rect.component.ts @@ -20,7 +20,7 @@ import { Point } from './models/point'; import { RaphaelBase } from './raphael-base'; import { RaphaelService } from './raphael.service'; -@Directive({selector: 'raphael-rect'}) +@Directive({ selector: 'raphael-rect' }) export class RaphaelRectDirective extends RaphaelBase implements OnInit { @Input() paper: any; @@ -49,6 +49,9 @@ export class RaphaelRectDirective extends RaphaelBase implements OnInit { @Input() fillOpacity: any; + @Input() + elementId: string; + @Output() onError = new EventEmitter(); @@ -59,8 +62,14 @@ export class RaphaelRectDirective extends RaphaelBase implements OnInit { ngOnInit() { console.log(this.elementRef); - let opts = {'stroke-width': this.strokeWidth, 'fill': this.fillColors, 'stroke': this.stroke, 'fill-opacity': this.fillOpacity}; - this.draw(this.leftCorner, this.width, this.height, this.radius, opts); + let opts = { + 'stroke-width': this.strokeWidth, + 'fill': this.fillColors, + 'stroke': this.stroke, + 'fill-opacity': this.fillOpacity + }; + let elementDraw = this.draw(this.leftCorner, this.width, this.height, this.radius, opts); + elementDraw.node.id = this.elementId; } public draw(leftCorner: Point, width: number, height: number, radius: number, opts: any) { diff --git a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rhombus.component.ts b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rhombus.component.ts index 08e2d7d3fd..d55ef0ba12 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rhombus.component.ts +++ b/ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-rhombus.component.ts @@ -43,6 +43,9 @@ export class RaphaelRhombusDirective extends RaphaelBase implements OnInit { @Input() fillOpacity: any; + @Input() + elementId: string; + @Output() onError = new EventEmitter(); @@ -54,11 +57,12 @@ export class RaphaelRhombusDirective extends RaphaelBase implements OnInit { ngOnInit() { console.log(this.elementRef); let opts = {'stroke-width': this.strokeWidth, 'fill': this.fillColors, 'stroke': this.stroke, 'fill-opacity': this.fillOpacity}; - this.draw(this.center, this.width, this.height, opts); + let elementDraw = this.draw(this.center, this.width, this.height, opts); + elementDraw.node.id = this.elementId; } public draw(center: Point, width: number, height: number, opts?: any) { - this.paper.path('M' + center.x + ' ' + (center.y + (height / 2)) + + return this.paper.path('M' + center.x + ' ' + (center.y + (height / 2)) + 'L' + (center.x + (width / 2)) + ' ' + (center.y + height) + 'L' + (center.x + width) + ' ' + (center.y + (height / 2)) + 'L' + (center.x + (width / 2)) + ' ' + center.y + 'z' diff --git a/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-event-subprocess.component.html b/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-event-subprocess.component.html index a3b195375b..35f293f7fb 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-event-subprocess.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-event-subprocess.component.html @@ -1,3 +1,4 @@ \ No newline at end of file + [fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"> + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-subprocess.component.html b/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-subprocess.component.html index a3b195375b..35f293f7fb 100644 --- a/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-subprocess.component.html +++ b/ng2-components/ng2-activiti-diagrams/src/components/structural/diagram-subprocess.component.html @@ -1,3 +1,4 @@ \ No newline at end of file + [fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"> + diff --git a/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip-style.css b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip-style.css new file mode 100644 index 0000000000..93868ce92c --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip-style.css @@ -0,0 +1,21 @@ +.mdl-tooltip { + will-change: unset; +} + +.mdl-tooltip-diagram { + background: white; + padding: 0px; +} + +.mdl-tooltip-header__message { + background: black; + color: white; + margin-top: 0px; + margin-bottom: 3px; + width:100%; +} + +.mdl-tooltip-body__message { + color: black; + text-align: center; +} diff --git a/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip.component.html b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip.component.html new file mode 100644 index 0000000000..0d2084beba --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip.component.html @@ -0,0 +1,6 @@ +
+
+
{{getTooltipHeader(data)}}
+ {{getTooltipMessage(data)}} +
+
diff --git a/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip.component.ts b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip.component.ts new file mode 100644 index 0000000000..daadc6a173 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/diagram-tooltip.component.ts @@ -0,0 +1,39 @@ +/*! + * @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, Input } from '@angular/core'; + +@Component({ + moduleId: module.id, + selector: 'diagram-tooltip', + templateUrl: './diagram-tooltip.component.html', + styleUrls: ['./diagram-tooltip-style.css'] +}) +export class DiagramTooltip { + + @Input() + data: any; + + getTooltipHeader(data: any) { + let headerValue = data.name || data.id; + return data.type + ' ' + headerValue; + } + + getTooltipMessage(data: any) { + return (data.value !== undefined && data.value !== null ) ? data.value + ' ' + data.dataType : ''; + } +} diff --git a/ng2-components/ng2-activiti-diagrams/src/components/tooltip/index.ts b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/index.ts new file mode 100644 index 0000000000..969117c620 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/components/tooltip/index.ts @@ -0,0 +1,18 @@ +/*! + * @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. + */ + +export * from './diagram-tooltip.component'; diff --git a/ng2-components/ng2-activiti-diagrams/src/models/diagram.model.ts b/ng2-components/ng2-activiti-diagrams/src/models/diagram.model.ts new file mode 100644 index 0000000000..b5534067c6 --- /dev/null +++ b/ng2-components/ng2-activiti-diagrams/src/models/diagram.model.ts @@ -0,0 +1,198 @@ +/*! + * @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. + */ + +export class DiagramModel { + diagramBeginX: string; + diagramBeginY: string; + diagramHeight: string; + diagramWidth: string; + elements: DiagramElementModel[] = []; + flows: DiagramFlowElementModel[] = []; + pools: DiagramPoolElementModel[] = []; + + constructor(obj?: any) { + if (obj) { + this.diagramBeginX = obj.diagramBeginX; + this.diagramBeginY = obj.diagramBeginY; + this.diagramHeight = obj.diagramHeight; + this.diagramWidth = obj.diagramWidth; + if (obj.elements) { + obj.elements.forEach((element: DiagramElementModel) => { + this.elements.push(new DiagramElementModel(element)); + }); + } + if (obj.flows) { + obj.flows.forEach((flow: DiagramFlowElementModel) => { + this.flows.push(new DiagramFlowElementModel(flow)); + }); + } + if (obj.pools) { + obj.pools.forEach((pool: DiagramPoolElementModel) => { + this.pools.push(new DiagramPoolElementModel(pool)); + }); + } + } + } +} + +export class DiagramElementModel { + height: string; + id: string; + name: string; + type: string; + width: string; + value: string; + x: string; + y: string; + properties: DiagramElementPropertyModel[] = []; + dataType: string = ''; + eventDefinition: DiagramEventDefinitionModel; + taskType: string = ''; + + constructor(obj?: any) { + if (obj) { + this.height = obj.height || ''; + this.id = obj.id || ''; + this.name = obj.name || ''; + this.type = obj.type || ''; + this.width = obj.width || ''; + this.value = obj.value || ''; + this.x = obj.x || ''; + this.y = obj.y || ''; + this.taskType = obj.taskType || ''; + if (obj.properties) { + obj.properties.forEach((property: DiagramElementPropertyModel) => { + this.properties.push(new DiagramElementPropertyModel(property)); + }); + } + this.dataType = obj.dataType || ''; + if (obj.eventDefinition) { + this.eventDefinition = new DiagramEventDefinitionModel(obj.eventDefinition); + } + } + } +} + +export class DiagramElementPropertyModel { + name: string; + type: string; + value: any; + + constructor(obj?: any) { + if (obj) { + this.name = obj.name; + this.type = obj.type; + this.value = obj.value; + } + } +} + +export class DiagramFlowElementModel { + id: string; + properties: any[] = []; + sourceRef: string; + targetRef: string; + type: string; + waypoints: DiagramWayPointModel[] = []; + + constructor(obj?: any) { + if (obj) { + this.id = obj.id; + this.properties = obj.properties; + this.sourceRef = obj.sourceRef; + this.targetRef = obj.targetRef; + this.type = obj.type; + if (obj.waypoints) { + obj.waypoints.forEach((waypoint: DiagramWayPointModel) => { + this.waypoints.push(new DiagramWayPointModel(waypoint)); + }); + } + } + } +} + +export class DiagramWayPointModel { + x: number; + y: number; + + constructor(obj?: any) { + if (obj) { + this.x = obj.x; + this.y = obj.y; + } + } +} + +export class DiagramEventDefinitionModel { + timeCycle: string; + type: string; + + constructor(obj?: any) { + if (obj) { + this.timeCycle = obj.timeCycle; + this.type = obj.type; + } + } +} + +export class DiagramPoolElementModel { + height: string; + id: string; + name: string; + properties: any; + lanes: DiagramLaneElementModel[] = []; + width: string; + x: number; + y: number; + + constructor(obj?: any) { + if (obj) { + this.height = obj.height; + this.id = obj.id; + this.name = obj.name; + this.properties = obj.properties; + this.width = obj.width; + this.x = obj.x; + this.y = obj.y; + if (obj.lanes) { + obj.lanes.forEach((lane: DiagramLaneElementModel) => { + this.lanes.push(new DiagramLaneElementModel(lane)); + }); + } + } + } +} + +export class DiagramLaneElementModel { + height: number; + id: string; + name: string; + width: number; + x: number; + y: number; + + constructor(obj?: any) { + if (obj) { + this.height = obj.height; + this.id = obj.id; + this.name = obj.name; + this.width = obj.width; + this.x = obj.x; + this.y = obj.y; + } + } +}