inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-07-24 17:32:15 +00:00
Code Issues Packages Projects Releases Wiki Activity

#878 #797 demo folder form component and documentation update

Browse Source
This commit is contained in:
Mario Romano
2016-11-07 17:37:11 +00:00
parent 7cbee40b4a
commit d908cf4754
40 changed files with 620 additions and 158 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
ng2-components/ng2-activiti-analytics/README.md
View File

@@ -81,6 +81,7 @@ Follow the 3 steps below:
<!-- Polyfill(s) for dialogs --> <!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script> <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" /> <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>._dialog_overlay { position: static !important; } </style>
<!-- Modules --> <!-- Modules -->
<script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script>

3
ng2-components/ng2-activiti-analytics/demo/index.html
View File

@@ -35,6 +35,7 @@
<!-- Polyfill(s) for dialogs --> <!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script> <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" /> <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>._dialog_overlay { position: static !important; } </style>
<!-- Modules --> <!-- Modules -->
<script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script>
@@ -52,7 +53,7 @@
<body> <body>
<activiti-analytics-demo></activiti-analytics-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-activiti-analytics/demo/src/main.ts
View File

@@ -22,7 +22,7 @@ import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } fr
import { AnalyticsModule } from 'ng2-activiti-analytics'; import { AnalyticsModule } from 'ng2-activiti-analytics';
@Component({ @Component({
selector: 'activiti-analytics-demo', selector: 'alfresco-app-demo',
template: ` template: `
<label for="ticket"><b>Insert a valid ticket:</b></label><br> <label for="ticket"><b>Insert a valid ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>

1
ng2-components/ng2-activiti-diagrams/README.md
View File

@@ -74,6 +74,7 @@ Follow the 3 steps below:
<!-- Polyfill(s) for dialogs --> <!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script> <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" /> <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>._dialog_overlay { position: static !important; } </style>
<!-- Modules --> <!-- Modules -->
<script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script>

4
ng2-components/ng2-activiti-diagrams/demo/index.html
View File

@@ -28,7 +28,7 @@
<!-- Polyfill(s) for dialogs --> <!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script> <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" /> <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>._dialog_overlay { position: static !important; } </style>
<!-- Modules --> <!-- Modules -->
<script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script>
@@ -43,7 +43,7 @@
</head> </head>
<body> <body>
<activiti-diagrams-demo></activiti-diagrams-demo> <alfresco-app-demo</activiti-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-activiti-diagrams/demo/src/main.ts
View File

@@ -23,7 +23,7 @@ import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } fr
import { DiagramsModule } from 'ng2-activiti-diagrams'; import { DiagramsModule } from 'ng2-activiti-diagrams';
@Component({ @Component({
selector: 'activiti-diagrams-demo', selector: 'alfresco-app-demo',
template: ` template: `
<label for="ticket"><b>Insert a valid ticket:</b></label><br> <label for="ticket"><b>Insert a valid ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>

258
ng2-components/ng2-activiti-form/README.md
View File

@@ -1,4 +1,35 @@
# Alfresco Bpm Form component for Angular 2 # Alfresco Login Component for Angular 2
<p>
<a title='Build Status Travis' href="https://travis-ci.org/Alfresco/alfresco-ng2-components">
<img src='https://travis-ci.org/Alfresco/alfresco-ng2-components.svg?branch=master' alt='travis
Status' />
</a>
<a title='Build Status AppVeyor' href="https://ci.appveyor.com/project/alfresco/alfresco-ng2-components">
<img src='https://ci.appveyor.com/api/projects/status/github/Alfresco/alfresco-ng2-components' alt='travis
Status' />
</a>
<a href='https://codecov.io/gh/Alfresco/alfresco-ng2-components'>
<img src='https://img.shields.io/codecov/c/github/Alfresco/alfresco-ng2-components/master.svg?maxAge=2592000' alt='Coverage Status' />
</a>
<a href='https://www.npmjs.com/package/ng2-activiti-form'>
<img src='https://img.shields.io/npm/dtng2-activiti-form.svg' alt='npm downloads' />
</a>
<a href='https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE'>
<img src='https://img.shields.io/hexpm/l/plug.svg' alt='license' />
</a>
<a href='https://www.alfresco.com/'>
<img src='https://img.shields.io/badge/style-component-green.svg?label=alfresco' alt='alfresco component' />
</a>
<a href='https://angular.io/'>
<img src='https://img.shields.io/badge/style-2-red.svg?label=angular' alt='angular 2' />
</a>
<a href='https://www.typescriptlang.org/docs/tutorial.html'>
<img src='https://img.shields.io/badge/style-lang-blue.svg?label=typescript' alt='typescript' />
</a>
<a href='https://www.alfresco.com/'>
<img src='https://img.shields.io/badge/style-%3E5.0.0-blue.svg?label=node%20version' alt='node version' />
</a>
</p>
## Prerequisites ## Prerequisites
@@ -7,67 +38,119 @@ necessary configuration, see this [page](https://github.com/Alfresco/alfresco-ng
## Install ## Install
Follow the 3 steps below:
1. Npm
```sh ```sh
npm install --save ng2-activiti-form npm install ng2-activiti-form --save
``` ```
### Dependencies 2. Html
Add the following dependency to your index.html: Include these dependencies in your index.html page:
```html ```html
<script src="node_modules/alfresco-js-api/dist/alfresco-js-api.js"></script>
```
You must separately install the following libraries for your application: <!-- Moment js -->
<script src="node_modules/moment/min/moment.min.js"></script>
- [ng2-translate](https://github.com/ocombe/ng2-translate) <!-- Date picker -->
- [ng2-alfresco-core](https://www.npmjs.com/package/ng2-alfresco-core) <script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>
<script src="node_modules/md-date-time-picker/dist/js/draggabilly.pkgd.min.js"></script>
<link rel="stylesheet" href="node_modules/md-date-time-picker/dist/css/mdDateTimePicker.css" media="all">
```sh
npm install --save ng2-translate ng2-alfresco-core
```
#### Material Design Lite
The style of this component is based on [material design](https://getmdl.io/), so if you want to visualize it correctly you have to add the material
design dependency to your project:
```sh
npm install --save material-design-icons material-design-lite
```
Also make sure you include these dependencies in your `index.html` file:
```html
<!-- Google Material Design Lite --> <!-- Google Material Design Lite -->
<link rel="stylesheet" href="node_modules/material-design-lite/material.min.css"> <link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
<script src="node_modules/material-design-lite/material.min.js"></script> <script src="node_modules/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css"> <link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
```
#### Dialogs Polyfill
To make the dialog working with all the browser you have to add the dialog polyfill to you project: <!-- Polyfill(s) for Safari (pre-10.x) -->
<script src="node_modules/intl/dist/Intl.min.js"></script>
<script src="node_modules/intl/locale-data/jsonp/en.js"></script>
```sh <!-- Polyfill(s) for older browsers -->
npm install --save dialog-polyfill <script src="node_modules/core-js/client/shim.min.js"></script>
``` <script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
<script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
Also make sure you include these dependencies in your `index.html` file:
```html
<!-- Polyfill(s) for dialogs --> <!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script> <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" /> <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style> <style>._dialog_overlay { position: static !important; } </style>
._dialog_overlay {
position: static !important; <!-- Modules -->
} <script src="node_modules/zone.js/dist/zone.js"></script>
</style> <script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
``` ```
3. SystemJs
Add the following components to your systemjs.config.js file:
- ng2-translate
- ng2-alfresco-core
Please refer to the following example file: [systemjs.config.js](demo/systemjs
.config.js) .
## Basic usage examples ## Basic usage examples
The component shows a Form from Activiti
```html
<analytics-report-list></analytics-report-list>
```
Example of an App that use Activiti Analytics List component :
**main.ts**
```ts
import { NgModule, Component } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
import { ActivitiFormModule } from 'ng2-activiti-form';
@Component({
selector: 'activiti-app-demo',
template: `<activiti-form [taskId]="77501"></activiti-form>`
})
export class FormDemoComponent {
constructor(private authService: AlfrescoAuthenticationService, private settingsService: AlfrescoSettingsService) {
settingsService.bpmHost = 'http://localhost:9999';
this.authService.login('admin', 'admin').subscribe(
ticket => {
console.log(ticket);
},
error => {
console.log(error);
});
}
}
@NgModule({
imports: [
BrowserModule,
CoreModule.forRoot(),
ActivitiFormModule.forRoot()
],
declarations: [FormDemoComponent],
bootstrap: [FormDemoComponent]
})
export class AppModule {
}
platformBrowserDynamic().bootstrapModule(AppModule);
```
### Display form instance by task id ### Display form instance by task id
```html ```html
@@ -138,42 +221,38 @@ The recommended set of properties can be found in the following table:
| Name | Type | Default | Description | | Name | Type | Default | Description |
| --- | --- | --- | --- | | --- | --- | --- | --- |
| taskId | string | | Task id to fetch corresponding form and values. | | `taskId` | string | | Task id to fetch corresponding form and values. |
| formId | string | | The id of the form definition to load and display with custom values. | | `formId` | string | | The id of the form definition to load and display with custom values. |
| formName | string | | Name of hte form definition to load and display with custom values. | | `formName` | string | | Name of hte form definition to load and display with custom values. |
| data | `FormValues` | | Custom form values map to be used with the rendered form. | | `data` | FormValues | | Custom form values map to be used with the rendered form. |
| showTitle | boolean | true | Toggle rendering of the form title. | | `showTitle` | boolean | true | Toggle rendering of the form title. |
| showCompleteButton | boolean | true | Toggle rendering of the `Complete` outcome button. | | `showCompleteButton` | boolean | true | Toggle rendering of the `Complete` outcome button. |
| showSaveButton | boolean | true | Toggle rendering of the `Save` outcome button. | | `showSaveButton` | boolean | true | Toggle rendering of the `Save` outcome button. |
| showDebugButton | boolean | false | Toggle debug options. | | `showDebugButton` | boolean | false | Toggle debug options. |
| readOnly | boolean | false | Toggle readonly state of the form. Enforces all form widgets render readonly if enabled. | | `readOnly` | boolean | false | Toggle readonly state of the form. Enforces all form widgets render readonly if enabled. |
| showRefreshButton | boolean | true | Toggle rendering of the `Refresh` button. | | `showRefreshButton` | boolean | true | Toggle rendering of the `Refresh` button. |
| saveMetadata | boolean | false | Store the value of the form as metadata. | | `saveMetadata` | boolean | false | Store the value of the form as metadata. |
| path | string | | Path of the folder where to store the metadata. | | `path` | string | | Path of the folder where to store the metadata. |
| nameNode (optional) | string | true | Name to assign to the new node where the metadata are stored. | | `nameNode` (optional) | string | true | Name to assign to the new node where the metadata are stored. |
* {path} string - path of the folder where the to store the metadata
*
* {nameNode} string (optional) - name of the node stored, if not defined the node will be sotred with an uuid as name
#### Advanced properties #### Advanced properties
The following properties are for complex customisation purposes: The following properties are for complex customisation purposes:
| Name | Type | Default | Description | | Name | Type | Default | Description |
| --- | --- | --- | --- | | --- | --- | --- | --- |
| form | `FormModel` | | Underlying form model instance. | | `form` | FormModel | | Underlying form model instance. |
| debugMode | boolean | false | Toggle debug mode, allows displaying additional data for development and debugging purposes. | | `debugMode` | boolean | false | Toggle debug mode, allows displaying additional data for development and debugging purposes. |
### Events ### Events
| Name | Description | | Name | Description |
| --- | --- | | --- | --- |
| formLoaded | Invoked when form is loaded or reloaded. | | `formLoaded` | Invoked when form is loaded or reloaded. |
| formSaved | Invoked when form is submitted with `Save` or custom outcomes. | | `formSaved` | Invoked when form is submitted with `Save` or custom outcomes. |
| formCompleted | Invoked when form is submitted with `Complete` outcome. | | `formCompleted` | Invoked when form is submitted with `Complete` outcome. |
| executeOutcome | Invoked when any outcome is executed, default behaviour can be prevented via `event.preventDefault()` | | `executeOutcome` | Invoked when any outcome is executed, default behaviour can be prevented via `event.preventDefault()` |
| onError | Invoked at any error | | `onError` | Invoked at any error |
All `form*` events receive an instance of the `FormModel` as event argument for ease of development: All `form*` events receive an instance of the `FormModel` as event argument for ease of development:
@@ -242,46 +321,11 @@ There are two additional functions that can be of a great value when controlling
**Please note that if `event.preventDefault()` is not called then default outcome behaviour **Please note that if `event.preventDefault()` is not called then default outcome behaviour
will also be executed after your custom code.** will also be executed after your custom code.**
## Supported form widgets
Form renderer provides support for all basic widgets:
- [x] Tabs
- [x] Text
- [x] Multiline Text
- [x] Number
- [x] Checkbox
- [x] Date
- Dropdown
* [x] Manual
* [x] REST service
- [x] Typeahead
- [x] Amount
- Radio buttons
* [x] Manual
* [x] REST service
- [x] People
- [x] Group of People
- [x] Dynamic Table
- [x] Hyperlink
- Header
* [x] Plain header
* [x] Collapsible header
- [x] Attach file **
- [x] Display value
- [x] Display text
** Files may be uploaded from a user's device if the file source selected is
'Local file' or 'All sources' and 'link to files' is not selected. Alternatively
you can link to files in a configured Alfresco repository by selecting this source
explicitly from the list and making sure that 'link to files' is selected. Copying
files from Alfresco into Activiti via the control (no linking) is not currently
supported, nor is allowing the user to choose between more than one source.
## Build from sources ## Build from sources
Alternatively you can build component from sources with the following commands: Alternatively you can build component from sources with the following commands:
```sh ```sh
npm install npm install
npm run build npm run build
@@ -293,7 +337,7 @@ npm run build
$ npm run build:w $ npm run build:w
``` ```
### Running unit tests ## Running unit tests
```sh ```sh
npm test npm test
@@ -313,3 +357,17 @@ before performing unit testing.
```sh ```sh
npm run coverage npm run coverage
``` ```
## Demo
If you want have a demo of how the component works, please check the demo folder :
```sh
cd demo
npm install
npm start
```
## License
[Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)

6
ng2-components/ng2-activiti-form/demo/.gitignore vendored Normal file
View File

@@ -0,0 +1,6 @@
node_modules
.idea
coverage
dist
typings
!systemjs.config.js

3
ng2-components/ng2-activiti-form/demo/.npmignore Normal file
View File

@@ -0,0 +1,3 @@
node_modules
dist
typings

13
ng2-components/ng2-activiti-form/demo/README.md Normal file
View File

@@ -0,0 +1,13 @@
# Activiti Form demo
Install:
```
npm install
```
Run the project:
```
npm start
```

55
ng2-components/ng2-activiti-form/demo/index.html Normal file
View File

@@ -0,0 +1,55 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Alfresco Angular 2 Activiti Form - Demo</title>
<base href="./">
<!-- Moment js -->
<script src="node_modules/moment/min/moment.min.js"></script>
<!-- Date picker -->
<script src="node_modules/md-date-time-picker/dist/js/mdDateTimePicker.min.js"></script>
<script src="node_modules/md-date-time-picker/dist/js/draggabilly.pkgd.min.js"></script>
<link rel="stylesheet" href="node_modules/md-date-time-picker/dist/css/mdDateTimePicker.css" media="all">
<!-- Google Material Design Lite -->
<link rel="stylesheet" href="node_modules/material-design-lite/material.min.css">
<script src="node_modules/material-design-lite/material.min.js"></script>
<link rel="stylesheet" href="node_modules/material-design-icons/iconfont/material-icons.css">
<!-- Polyfill(s) for Safari (pre-10.x) -->
<script src="node_modules/intl/dist/Intl.min.js"></script>
<script src="node_modules/intl/locale-data/jsonp/en.js"></script>
<!-- Polyfill(s) for older browsers -->
<script src="node_modules/core-js/client/shim.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/dom4/1.8.3/dom4.js"></script>
<script src="node_modules/element.scrollintoviewifneeded-polyfill/index.js"></script>
<!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>._dialog_overlay { position: static !important; } </style>
<!-- Modules -->
<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>
<style> .chart {display: block; width: 100%;}</style>
<body>
<alfresco-app-demo></alfresco-app-demo>
</body>
</html>

44
ng2-components/ng2-activiti-form/demo/package.json Normal file
View File

@@ -0,0 +1,44 @@
{
"name": "ng2-activiti-form-demo",
"description": "Alfresco Activiti Form Component - Demo",
"version": "0.1.0",
"author": "Alfresco Software, Ltd.",
"main": "index.js",
"scripts": {
"clean": "npm install rimraf && rimraf dist node_modules typings dist",
"postinstall": "npm run build",
"start": "npm run build && concurrently \"npm run tsc:w\" \"npm run server\" ",
"server": "wsrv -o -s -l",
"build": "npm run tslint && rimraf dist && tsc",
"build:w": "npm run tslint && rimraf dist && tsc -w",
"tsc": "tsc",
"tsc:w": "tsc -w",
"tslint": "tslint -c tslint.json *.ts && tslint -c tslint.json src/{,**/}**.ts"
},
"license": "Apache-2.0",
"contributors": [
{
"name": "Mario Romano",
"email": "mario.romano@alfresco.com"
}
],
"keywords": [
"ng2",
"angular",
"angular2",
"activiti",
"activiti-form"
],
"dependencies": {
"ng2-activiti-form": "^0.3.0"
},
"devDependencies": {
"@types/core-js": "^0.9.32",
"@types/jasmine": "^2.2.33",
"concurrently": "^2.2.0",
"rimraf": "2.5.2",
"tslint": "^3.8.1",
"typescript": "^2.0.3",
"wsrv": "^0.1.5"
}
}

100
ng2-components/ng2-activiti-form/demo/src/main.ts Normal file
View File

@@ -0,0 +1,100 @@
/*!
* @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 { NgModule, Component, OnInit } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } from 'ng2-alfresco-core';
import { ActivitiFormModule } from 'ng2-activiti-form';
@Component({
selector: 'alfresco-app-demo',
template: `
<label for="ticket"><b>Insert a valid ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>
<label for="host"><b>Insert the ip of your Activiti instance:</b></label><br>
<input id="host" type="text" size="48" (change)="updateHost()" [(ngModel)]="host"><br><br>
<div *ngIf="!authenticated" style="color:#FF2323">
Authentication failed to ip {{ host }} with user: admin, admin, you can still try to add a valid ticket to perform
operations.
</div>
<hr>
<label for="taskId"><b>Insert the taskId:</b></label><br>
<input id="taskId" size="10" type="text" [(ngModel)]="taskId">
<activiti-form [taskId]="taskId"></activiti-form>`
})
export class FormDemoComponent implements OnInit {
taskId: number;
authenticated: boolean;
host: string = 'http://localhost:9999';
ticket: string;
constructor(private authService: AlfrescoAuthenticationService, private settingsService: AlfrescoSettingsService) {
settingsService.bpmHost = this.host;
settingsService.setProviders('BPM');
if (this.authService.getTicketBpm()) {
this.ticket = this.authService.getTicketBpm();
}
}
public updateTicket(): void {
localStorage.setItem('ticket-BPM', this.ticket);
}
public updateHost(): void {
this.settingsService.bpmHost = this.host;
this.login();
}
public ngOnInit(): void {
this.login();
}
login() {
this.authService.login('admin', 'admin').subscribe(
ticket => {
console.log(ticket);
this.ticket = this.authService.getTicketBpm();
this.authenticated = true;
},
error => {
console.log(error);
this.authenticated = false;
});
}
}
@NgModule({
imports: [
BrowserModule,
CoreModule.forRoot(),
ActivitiFormModule.forRoot()
],
declarations: [FormDemoComponent],
bootstrap: [FormDemoComponent]
})
export class AppModule {
}
platformBrowserDynamic().bootstrapModule(AppModule);

48
ng2-components/ng2-activiti-form/demo/systemjs.config.js Normal file
View File

@@ -0,0 +1,48 @@
/**
* System configuration for Angular 2 samples
* Adjust as necessary for your application needs.
*/
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'dist',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
// other libraries
'rxjs': 'npm:rxjs',
'moment': 'npm:moment/min/moment.min.js',
'ng2-translate': 'npm:ng2-translate',
'alfresco-js-api': 'npm:alfresco-js-api/dist',
'ng2-alfresco-core': 'npm:ng2-alfresco-core/dist',
'ng2-activiti-form': 'npm:ng2-activiti-form/dist'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
main: './main.js',
defaultExtension: 'js'
},
rxjs: {
defaultExtension: 'js'
},
'ng2-translate': { defaultExtension: 'js' },
'ng2-charts': { main: 'ng2-charts.js', defaultExtension: 'js'},
'alfresco-js-api': { main: './alfresco-js-api.js', defaultExtension: 'js'},
'ng2-alfresco-core': { main: './index.js', defaultExtension: 'js'},
'ng2-activiti-form': { main: './index.js', defaultExtension: 'js'}
}
});
})(this);

26
ng2-components/ng2-activiti-form/demo/tsconfig.json Normal file
View File

@@ -0,0 +1,26 @@
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"sourceMap": true,
"removeComments": true,
"declaration": true,
"noLib": false,
"allowUnreachableCode": false,
"allowUnusedLabels": false,
"noImplicitAny": false,
"noImplicitReturns": false,
"noImplicitUseStrict": false,
"noFallthroughCasesInSwitch": true,
"outDir": "dist",
"types": ["core-js", "jasmine", "node"]
},
"exclude": [
"demo",
"node_modules",
"dist"
]
}

124
ng2-components/ng2-activiti-form/demo/tslint.json Normal file
View File

@@ -0,0 +1,124 @@
{
"rules": {
"align": [
true,
"parameters",
"arguments",
"statements"
],
"ban": false,
"class-name": true,
"comment-format": [
true,
"check-space",
"check-lowercase"
],
"curly": true,
"eofline": true,
"forin": true,
"indent": [
true,
"spaces"
],
"interface-name": false,
"jsdoc-format": true,
"label-position": true,
"label-undefined": true,
"max-line-length": [
true,
180
],
"member-ordering": [
true,
"public-before-private",
"static-before-instance",
"variables-before-functions"
],
"no-any": false,
"no-arg": true,
"no-bitwise": true,
"no-conditional-assignment": true,
"no-consecutive-blank-lines": true,
"no-console": [
true,
"debug",
"info",
"time",
"timeEnd",
"trace"
],
"no-construct": true,
"no-constructor-vars": false,
"no-debugger": true,
"no-duplicate-key": true,
"no-duplicate-variable": true,
"no-empty": true,
"no-eval": true,
"no-inferrable-types": false,
"no-internal-module": true,
"no-require-imports": true,
"no-shadowed-variable": true,
"no-switch-case-fall-through": true,
"no-trailing-whitespace": true,
"no-unreachable": true,
"no-unused-expression": true,
"no-unused-variable": true,
"no-use-before-declare": true,
"no-var-keyword": true,
"no-var-requires": true,
"object-literal-sort-keys": false,
"one-line": [
true,
"check-open-brace",
"check-catch",
"check-else",
"check-whitespace"
],
"quotemark": [
true,
"single",
"avoid-escape"
],
"radix": true,
"semicolon": true,
"switch-default": true,
"trailing-comma": [
true,
{
"multiline": "never",
"singleline": "never"
}
],
"triple-equals": [
true,
"allow-null-check"
],
"typedef": false,
"typedef-whitespace": [
true,
{
"call-signature": "nospace",
"index-signature": "nospace",
"parameter": "nospace",
"property-declaration": "nospace",
"variable-declaration": "nospace"
}
],
"use-strict": false,
"variable-name": [
true,
"check-format",
"allow-leading-underscore",
"ban-keywords"
],
"whitespace": [
true,
"check-branch",
"check-operator",
"check-separator",
"check-type",
"check-module",
"check-decl"
]
}
}

19
ng2-components/ng2-activiti-form/package.json
View File

@@ -45,27 +45,8 @@
"activiti" "activiti"
], ],
"dependencies": { "dependencies": {
"@angular/common": "2.0.0",
"@angular/compiler": "2.0.0",
"@angular/core": "2.0.0",
"@angular/forms": "2.0.0",
"@angular/http": "2.0.0",
"@angular/platform-browser": "2.0.0",
"@angular/platform-browser-dynamic": "2.0.0",
"@angular/router": "3.0.0",
"@angular/upgrade": "2.0.0",
"@types/node": "^6.0.42",
"core-js": "^2.4.1",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.12",
"systemjs": "0.19.27",
"zone.js": "^0.6.23",
"ng2-translate": "2.5.0",
"moment": "2.15.1", "moment": "2.15.1",
"md-date-time-picker": "^2.2.0", "md-date-time-picker": "^2.2.0",
"alfresco-js-api": "^0.3.0",
"ng2-alfresco-core": "0.3.2" "ng2-alfresco-core": "0.3.2"
}, },
"devDependencies": { "devDependencies": {

4
ng2-components/ng2-activiti-processlist/demo/index.html
View File

@@ -24,9 +24,9 @@
</head> </head>
<body> <body>
<my-app> <alfresco-app-demo>
<div id="loader-spin" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div> <div id="loader-spin" class="mdl-progress mdl-js-progress mdl-progress__indeterminate"></div>
</my-app> </alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-activiti-processlist/demo/src/main.ts
View File

@@ -24,7 +24,7 @@ import { ActivitiProcessListModule } from 'ng2-activiti-processlist';
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core'; import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
@Component({ @Component({
selector: 'my-app', selector: 'alfresco-app-demo',
template: `<label for="token"><b>Insert a valid access token / ticket:</b></label><br> template: `<label for="token"><b>Insert a valid access token / ticket:</b></label><br>
<input id="token" type="text" size="48" (change)="updateToken();documentList.reload()" [(ngModel)]="token"><br> <input id="token" type="text" size="48" (change)="updateToken();documentList.reload()" [(ngModel)]="token"><br>
<label for="token"><b>Insert the ip of your Alfresco instance:</b></label><br> <label for="token"><b>Insert the ip of your Alfresco instance:</b></label><br>

2
ng2-components/ng2-activiti-tasklist/demo/index.html
View File

@@ -26,7 +26,7 @@
</head> </head>
<body> <body>
<activiti-tasklist-demo></activiti-tasklist-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-activiti-tasklist/demo/src/main.ts
View File

@@ -26,7 +26,7 @@ import { ActivitiTaskListModule } from 'ng2-activiti-tasklist';
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core'; import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
@Component({ @Component({
selector: 'activiti-tasklist-demo', selector: 'alfresco-app-demo',
template: `<label for="token"><b>Insert a valid access token / ticket:</b></label><br> template: `<label for="token"><b>Insert a valid access token / ticket:</b></label><br>
<input id="token" type="text" size="48" (change)="updateToken();documentList.reload()" [(ngModel)]="token"><br> <input id="token" type="text" size="48" (change)="updateToken();documentList.reload()" [(ngModel)]="token"><br>
<label for="token"><b>Insert the ip of your Activiti instance:</b></label><br> <label for="token"><b>Insert the ip of your Activiti instance:</b></label><br>

2
ng2-components/ng2-alfresco-datatable/demo/index.html
View File

@@ -26,7 +26,7 @@
</head> </head>
<body> <body>
<alfresco-datatable-demo></alfresco-datatable-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-datatable/demo/src/main.ts
View File

@@ -30,7 +30,7 @@ import {
} from 'ng2-alfresco-datatable'; } from 'ng2-alfresco-datatable';
@Component({ @Component({
selector: 'alfresco-datatable-demo', selector: 'alfresco-app-demo',
template: ` template: `
<div class="container"> <div class="container">
<div class="p-10"> <div class="p-10">

2
ng2-components/ng2-alfresco-documentlist/demo/index.html
View File

@@ -31,7 +31,7 @@
</head> </head>
<body> <body>
<alfresco-documentlist-demo></alfresco-documentlist-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-documentlist/demo/src/main.ts
View File

@@ -32,7 +32,7 @@ import {
import { DocumentActionsService } from 'ng2-alfresco-documentlist'; import { DocumentActionsService } from 'ng2-alfresco-documentlist';
@Component({ @Component({
selector: 'alfresco-documentlist-demo', selector: 'alfresco-app-demo',
template: ` template: `
<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br> <label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket(); documentList.reload()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket(); documentList.reload()" [(ngModel)]="ticket"><br>

1
ng2-components/ng2-alfresco-login/README.md
View File

@@ -69,6 +69,7 @@ Follow the 3 steps below:
<!-- Polyfill(s) for dialogs --> <!-- Polyfill(s) for dialogs -->
<script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script> <script src="node_modules/dialog-polyfill/dialog-polyfill.js"></script>
<link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" /> <link rel="stylesheet" type="text/css" href="node_modules/dialog-polyfill/dialog-polyfill.css" />
<style>._dialog_overlay { position: static !important; } </style>
<!-- Modules --> <!-- Modules -->
<script src="node_modules/zone.js/dist/zone.js"></script> <script src="node_modules/zone.js/dist/zone.js"></script>

2
ng2-components/ng2-alfresco-login/demo/index.html
View File

@@ -37,7 +37,7 @@
</head> </head>
<body> <body>
<my-app></my-app> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-login/demo/src/main.ts
View File

@@ -23,7 +23,7 @@ import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } fr
import { LoginModule } from 'ng2-alfresco-login'; import { LoginModule } from 'ng2-alfresco-login';
@Component({ @Component({
selector: 'my-app', selector: 'alfresco-app-demo',
template: ` template: `
<label for="host"><b>Insert the ip of your Alfresco and Activiti instance:</b></label><br> <label for="host"><b>Insert the ip of your Alfresco and Activiti instance:</b></label><br>
ECM Host: <input id="ecmHost" type="text" size="48" (change)="updateEcmHost()" [(ngModel)]="ecmHost"><br> ECM Host: <input id="ecmHost" type="text" size="48" (change)="updateEcmHost()" [(ngModel)]="ecmHost"><br>

2
ng2-components/ng2-alfresco-search/demo/index.html
View File

@@ -26,7 +26,7 @@
<body> <body>
<div mdl class="mdl-layout mdl-js-layout"> <div mdl class="mdl-layout mdl-js-layout">
<alfresco-search-demo></alfresco-search-demo> <alfresco-app-demo></alfresco-app-demo>
</div> </div>
</body> </body>

2
ng2-components/ng2-alfresco-search/demo/src/main.ts
View File

@@ -30,7 +30,7 @@ import {
@Component({ @Component({
selector: 'alfresco-search-demo', selector: 'alfresco-app-demo',
template: `<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br> template: `<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>
<label for="host"><b>Insert the ip of your Alfresco instance:</b></label><br> <label for="host"><b>Insert the ip of your Alfresco instance:</b></label><br>

2
ng2-components/ng2-alfresco-tag/demo/index.html
View File

@@ -30,7 +30,7 @@
</head> </head>
<body> <body>
<alfresco-tag-demo></alfresco-tag-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-tag/demo/src/main.ts
View File

@@ -23,7 +23,7 @@ import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } fr
import { TagModule } from 'ng2-alfresco-tag'; import { TagModule } from 'ng2-alfresco-tag';
@Component({ @Component({
selector: 'alfresco-tag-demo', selector: 'alfresco-app-demo',
template: ` template: `
<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br> <label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>

2
ng2-components/ng2-alfresco-upload/demo/index.html
View File

@@ -28,7 +28,7 @@
</head> </head>
<body> <body>
<my-app></my-app> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-upload/demo/src/main.ts
View File

@@ -23,7 +23,7 @@ import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } fr
import { UploadModule } from 'ng2-alfresco-upload'; import { UploadModule } from 'ng2-alfresco-upload';
@Component({ @Component({
selector: 'my-app', selector: 'alfresco-app-demo',
template: `<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br> template: `<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>
<label for="host"><b>Insert the ip of your Alfresco instance:</b></label><br> <label for="host"><b>Insert the ip of your Alfresco instance:</b></label><br>

2
ng2-components/ng2-alfresco-userinfo/demo/index.html
View File

@@ -26,7 +26,7 @@
</head> </head>
<body> <body>
<alfresco-userinfo-demo></alfresco-userinfo-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-userinfo/demo/src/main.ts
View File

@@ -24,7 +24,7 @@ import { CoreModule } from 'ng2-alfresco-core';
import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core'; import { AlfrescoAuthenticationService, AlfrescoSettingsService } from 'ng2-alfresco-core';
@Component({ @Component({
selector: 'alfresco-userinfo-demo', selector: 'alfresco-app-demo',
template: `<h4> START DEMO USERINFO </h4> template: `<h4> START DEMO USERINFO </h4>
<div style="border-radius: 8px; position: absolute; background-color:papayawhip; color: cadetblue; left: 320px; top: 30px; z-index: 1;"> <div style="border-radius: 8px; position: absolute; background-color:papayawhip; color: cadetblue; left: 320px; top: 30px; z-index: 1;">
<p style="width:120px;margin: 20px;"> <p style="width:120px;margin: 20px;">

2
ng2-components/ng2-alfresco-viewer/demo/index.html
View File

@@ -29,7 +29,7 @@
</head> </head>
<body> <body>
<my-app></my-app> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-viewer/demo/src/main.ts
View File

@@ -22,7 +22,7 @@ import { CoreModule, AlfrescoSettingsService, AlfrescoAuthenticationService } fr
import { ViewerModule } from 'ng2-alfresco-viewer'; import { ViewerModule } from 'ng2-alfresco-viewer';
@Component({ @Component({
selector: 'my-app', selector: 'alfresco-app-demo',
template: ` template: `
<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br> <label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>

2
ng2-components/ng2-alfresco-webscript/demo/index.html
View File

@@ -33,7 +33,7 @@
</head> </head>
<body> <body>
<alfresco-webscript-demo></alfresco-webscript-demo> <alfresco-app-demo></alfresco-app-demo>
</body> </body>
</html> </html>

2
ng2-components/ng2-alfresco-webscript/demo/src/main.ts
View File

@@ -24,7 +24,7 @@ import { DataTableModule } from 'ng2-alfresco-datatable';
import { WebScriptModule } from 'ng2-alfresco-webscript'; import { WebScriptModule } from 'ng2-alfresco-webscript';
@Component({ @Component({
selector: 'alfresco-webscript-demo', selector: 'alfresco-app-demo',
template: ` template: `
<label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br> <label for="ticket"><b>Insert a valid access ticket / ticket:</b></label><br>
<input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br> <input id="ticket" type="text" size="48" (change)="updateTicket()" [(ngModel)]="ticket"><br>