inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-09-24 14:31:41 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add pool and lane components

Browse Source
This commit is contained in:
mauriziovitale84
2016-10-28 11:10:29 +01:00
parent 1c6871e004
commit 589acc8b33
11 changed files with 246 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
ng2-components/ng2-activiti-diagrams/src/components/diagram.component.html
View File

@@ -61,4 +61,7 @@
</div>
</div>
</div>
<div *ngIf="diagram.pools">
<diagram-pools [pools]="diagram.pools"></diagram-pools>
</div>
</div>

8
ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-text.component.ts
View File

@@ -28,6 +28,9 @@ export class RaphaelTextDirective extends RaphaelBase implements OnInit {
@Input()
position: Point;
@Input()
transform: string;
@Input()
text: string;
@@ -48,11 +51,14 @@ export class RaphaelTextDirective extends RaphaelBase implements OnInit {
}
public draw(position: Point, text: string) {
return this.paper.text(position.x, position.y, text).attr({
let textPaper = this.paper.text(position.x, position.y, text).attr({
'text-anchor' : 'middle',
'font-family' : 'Arial',
'font-size' : '11',
'fill' : '#373e48'
});
textPaper.transform(this.transform);
return textPaper;
}
}

4
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-lane.component.html Normal file
View File

@@ -0,0 +1,4 @@
<raphael-rect [leftCorner]="rectLeftCorner" [width]="width" [height]="height" [radius]="options.radius"
[stroke]="options.stroke" [strokeWidth]="options.strokeWidth"
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-rect>
<raphael-text [text]="text" [position]="textPosition" [transform]="textTransform"></raphael-text>

54
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-lane.component.ts Normal file
View File

@@ -0,0 +1,54 @@
/*!
* @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-lane',
templateUrl: './diagram-lane.component.html'
})
export class DiagramLaneComponent {
@Input()
lane: any;
@Output()
onError = new EventEmitter();
rectLeftCorner: any;
width: any;
height: any;
textPosition: any;
text: string;
textTransform: string;
options: any = {stroke: '#000000', fillColors: 'none', fillOpacity: '', strokeWidth: '1', radius: 0};
constructor(public elementRef: ElementRef,
private diagramColorService: DiagramColorService) {}
ngOnInit() {
this.rectLeftCorner = {x: this.lane.x, y: this.lane.y};
this.width = this.lane.width;
this.height = this.lane.height;
this.textPosition = {x: this.lane.x + 10, y: this.lane.y + ( this.lane.height / 2 )};
this.text = this.lane.name;
this.textTransform = 'r270';
}
}

5
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-lanes.component.html Normal file
View File

@@ -0,0 +1,5 @@
<div *ngIf="lanes">
<div *ngFor="let lane of lanes">
<diagram-lane [lane]="lane"></diagram-lane>
</div>
</div>

37
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-lanes.component.ts Normal file
View File

@@ -0,0 +1,37 @@
/*!
* @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-lanes',
templateUrl: './diagram-lanes.component.html'
})
export class DiagramLanesComponent {
@Input()
lanes: any [];
@Output()
onError = new EventEmitter();
constructor(public elementRef: ElementRef) {}
ngOnInit() {
}
}

4
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-pool.component.html Normal file
View File

@@ -0,0 +1,4 @@
<raphael-rect [leftCorner]="rectLeftCorner" [width]="width" [height]="height" [radius]="options.radius"
[stroke]="options.stroke" [strokeWidth]="options.strokeWidth"
[fillColors]="options.fillColors" [fillOpacity]="options.fillOpacity"></raphael-rect>
<raphael-text [text]="text" [position]="textPosition" [transform]="textTransform"></raphael-text>

54
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-pool.component.ts Normal file
View File

@@ -0,0 +1,54 @@
/*!
* @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-pool',
templateUrl: './diagram-pool.component.html'
})
export class DiagramPoolComponent {
@Input()
pool: any;
@Output()
onError = new EventEmitter();
rectLeftCorner: any;
width: any;
height: any;
textPosition: any;
text: string;
textTransform: string;
options: any = {stroke: '#000000', fillColors: 'none', fillOpacity: '', strokeWidth: '1', radius: 0};
constructor(public elementRef: ElementRef,
private diagramColorService: DiagramColorService) {}
ngOnInit() {
this.rectLeftCorner = {x: this.pool.x, y: this.pool.y};
this.width = this.pool.width;
this.height = this.pool.height;
this.textPosition = {x: this.pool.x + 14, y: this.pool.y + ( this.pool.height / 2 )};
this.text = this.pool.name;
this.textTransform = 'r270';
}
}

6
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-pools.component.html Normal file
View File

@@ -0,0 +1,6 @@
<div *ngIf="pools">
<div *ngFor="let pool of pools">
<diagram-pool [pool]="pool"></diagram-pool>
<diagram-lanes [lanes]="pool.lanes"></diagram-lanes>
</div>
</div>

37
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/diagram-pools.component.ts Normal file
View File

@@ -0,0 +1,37 @@
/*!
* @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-pools',
templateUrl: './diagram-pools.component.html'
})
export class DiagramPoolsComponent {
@Input()
pools: any [];
@Output()
onError = new EventEmitter();
constructor(public elementRef: ElementRef) {}
ngOnInit() {
}
}

35
ng2-components/ng2-activiti-diagrams/src/components/swimlanes/index.ts Normal file
View File

@@ -0,0 +1,35 @@
/*!
* @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 { DiagramPoolsComponent } from './diagram-pools.component';
import { DiagramPoolComponent } from './diagram-pool.component';
import { DiagramLanesComponent } from './diagram-lanes.component';
import { DiagramLaneComponent } from './diagram-lane.component';
// primitives
export * from './diagram-pools.component';
export * from './diagram-pool.component';
export * from './diagram-lanes.component';
export * from './diagram-lane.component';
export const DIAGRAM_SWIMLANES_DIRECTIVES: any[] = [
DiagramPoolsComponent,
DiagramPoolComponent,
DiagramLanesComponent,
DiagramLaneComponent
];