5.5 KiB
Alfresco Login Component for Angular 2
Node
To correctly use this component check that on your machine is running Node version 5.0.0 or higher.
Install
npm install --save ng2-alfresco-login
Components included:
- Alfresco Login Component
- Alfresco Authentication Service
Dependencies
Add the following dependency to your index.html:
<script src="node_modules/alfresco-js-api/bundle.js"></script>
The following component needs to be added to your systemjs.config:
- ng2-translate
- ng2-alfresco-core
- ng2-alfresco-login
Please refer to the following example to have an idea of how your systemjs.config should look like :
Style
The style of this component is based on material design, so if you want to visualize it correctly you have to add the material design dependency to your project:
npm install --save material-design-icons material-design-lite
Also make sure you include these dependencies in your .html page:
<!-- 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">
Basic usage
<alfresco-login providers=['ECM','BPM']></alfresco-login>
Example of an App that use Alfresco login component :
main.ts
import { Component } from '@angular/core';
import { bootstrap } from '@angular/platform-browser-dynamic';
import { AlfrescoLoginComponent } from 'ng2-alfresco-login';
import { HTTP_PROVIDERS } from '@angular/http';
import {
ALFRESCO_CORE_PROVIDERS,
AlfrescoSettingsService,
AlfrescoAuthenticationService
} from 'ng2-alfresco-core';
@Component({
selector: 'my-app',
template: '
<alfresco-login
providers=['ECM']
(onSuccess)="mySuccessMethod($event)"
(onError)="myErrorMethod($event)">
</alfresco-login>',
directives: [AlfrescoLoginComponent]
})
export class AppComponent {
constructor(public auth: AlfrescoAuthenticationService,
alfrescoSettingsService: AlfrescoSettingsService) {
alfrescoSettingsService.host = 'http://myalfrescoip';
}
mySuccessMethod($event) {
console.log('Success Login EventEmitt called with: ' + $event.value);
}
myErrorMethod($event) {
console.log('Error Login EventEmitt called with: ' + $event.value);
}
}
bootstrap(AppComponent, [
HTTP_PROVIDERS,
ALFRESCO_CORE_PROVIDERS
]);
Events
onSuccess: The event is emitted when the login is done
onError: The event is emitted when the login fails
Options
providers: { string[] } optional) default ECM.
Using the providers attribute, you can specify in which system
(ECM or BPM) you want to be logged in.
By selecting one of the options only the relative components will be
accesible. For instance if you activate the ECM login then only the
ECM component will be visible,same behaviour for BPM selection.
You can also specify ECM and BPM, in this case both system components
are accessible.
Build from sources
Alternatively you can build component from sources with the following commands:
npm install
npm run build
##Build the files and keep watching for changes
```sh
$ npm run build:w
```
Running unit tests
npm test
Running unit tests in browser
npm test-browser
This task rebuilds all the code, runs tslint, license checks and other quality check tools before performing unit testing.
Code coverage
npm run coverage
Demo
If you want have a demo of how the component works, please check the demo folder :
cd demo
npm install
npm start