diff --git a/docIndex.md b/docIndex.md index c30d6e8534..b9ced80ce7 100644 --- a/docIndex.md +++ b/docIndex.md @@ -8,22 +8,22 @@ the links lead to the appropriate code source file. ## Contents - [User Guide](#user-guide) -- [ng2-activiti-analytics](#ng2-activiti-analytics) -- [ng2-activiti-diagrams](#ng2-activiti-diagrams) -- [ng2-activiti-form](#ng2-activiti-form) -- [ng2-activiti-processlist](#ng2-activiti-processlist) -- [ng2-activiti-tasklist](#ng2-activiti-tasklist) -- [ng2-alfresco-core](#ng2-alfresco-core) -- [ng2-alfresco-datatable](#ng2-alfresco-datatable) -- [ng2-alfresco-documentlist](#ng2-alfresco-documentlist) -- [ng2-alfresco-login](#ng2-alfresco-login) -- [ng2-alfresco-search](#ng2-alfresco-search) -- [ng2-alfresco-social](#ng2-alfresco-social) -- [ng2-alfresco-tag](#ng2-alfresco-tag) -- [ng2-alfresco-upload](#ng2-alfresco-upload) -- [ng2-alfresco-userinfo](#ng2-alfresco-userinfo) -- [ng2-alfresco-viewer](#ng2-alfresco-viewer) -- [ng2-alfresco-webscript](#ng2-alfresco-webscript) +- [ADF Analytics](#adf-analytics) +- [ADF Diagrams](#adf-diagrams) +- [ADF Form](#adf-form) +- [ADF Processlist](#adf-processlist) +- [ADF Tasklist](#adf-tasklist) +- [ADF Core](#adf-core) +- [ADF Datatable](#adf-datatable) +- [ADF Documentlist](#adf-documentlist) +- [ADF Login](#adf-login) +- [ADF Search](#adf-search) +- [ADF Social](#adf-social) +- [ADF Tag](#adf-tag) +- [ADF Upload](#adf-upload) +- [ADF Userinfo](#adf-userinfo) +- [ADF Viewer](#adf-viewer) +- [ADF Webscript](#adf-webscript) ## User guide @@ -36,7 +36,7 @@ the links lead to the appropriate code source file. [(Back to Contents)](#contents) -## ng2-activiti-analytics +## ADF Analytics Contains the Analytics component and other related items. See the library's [README file](ng2-components/ng2-activiti-analytics/README.md) @@ -64,7 +64,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-activiti-diagrams +## ADF Diagrams Contains the Diagram component and other related items. See the library's [README file](ng2-components/ng2-activiti-diagrams/README.md) @@ -165,7 +165,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-activiti-form +## ADF Form Contains the Form component and other related items. See the library's [README file](ng2-components/ng2-activiti-form/README.md) @@ -232,7 +232,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-activiti-processlist +## ADF Processlist Contains the Processlist component and other related items. See the library's [README file](ng2-components/ng2-activiti-processlist/README.md) @@ -265,7 +265,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-activiti-tasklist +## ADF Tasklist Contains the Tasklist component and other related items. See the library's [README file](ng2-components/ng2-activiti-tasklist/README.md) @@ -309,7 +309,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-core +## ADF Core Contains a variety of components, directives and other classes used throughout ADF. See the library's [README file](ng2-components/ng2-alfresco-core/README.md) @@ -388,7 +388,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-datatable +## ADF Datatable Contains the Datatable component and other related items. See the library's [README file](ng2-components/ng2-alfresco-datatable/README.md) @@ -412,7 +412,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-documentlist +## ADF Documentlist Contains the Document List component and other related items. See the library's [README file](ng2-components/ng2-alfresco-documentlist/README.md) @@ -446,16 +446,16 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -### ng2-alfresco-login +## ADF Login Contains the Login component and other related items. See the library's [README file](ng2-components/ng2-alfresco-login/README.md) for more information about installing and using the source code. - + **Documented** -- [Login component](ng2-components/ng2-alfresco-login/README.md) +- [Login component](docs/login.component.md) **Undocumented** @@ -466,17 +466,17 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-search +## ADF Search Contains the Search component and other related items. See the library's [README file](ng2-components/ng2-alfresco-search/README.md) for more information about installing and using the source code. - + **Documented** -- [Search control component](ng2-components/ng2-alfresco-search/README.md) -- [Search component](ng2-components/ng2-alfresco-search/README.md) +- [Search control component](docs/search-control.component.md) +- [Search component](docs/search.component.md) **Undocumented** @@ -485,17 +485,17 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-social +## ADF Social Contains components for adding likes and ratings to items. See the library's [README file](ng2-components/ng2-alfresco-social/README.md) for more information about installing and using the source code. - + **Documented** -- [Like component](ng2-components/ng2-alfresco-social/README.md) -- [Rating component](ng2-components/ng2-alfresco-social/README.md) +- [Like component](docs/like.component.md) +- [Rating component](docs/rating.component.md) **Undocumented** @@ -504,18 +504,18 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-tag +## ADF Tag Contains components for adding tags to documents. See the library's [README file](ng2-components/ng2-alfresco-tag/README.md) for more information about installing and using the source code. - + **Documented** -- [Tag actions component](ng2-components/ng2-alfresco-tag/README.md) -- [Tag list component](ng2-components/ng2-alfresco-tag/README.md) -- [Tag node list component](ng2-components/ng2-alfresco-tag/README.md) +- [Tag actions component](docs/tag-actions.component.md) +- [Tag list component](docs/tag-list.component.md) +- [Tag node list component](docs/tag-node-list.component.md) **Undocumented** @@ -524,7 +524,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-upload +## ADF Upload Contains components for uploading files to Content Services. See the library's [README file](ng2-components/ng2-alfresco-upload/README.md) @@ -548,7 +548,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-userinfo +## ADF Userinfo Contains the User Info component and other related items. See the library's [README file](ng2-components/ng2-alfresco-userinfo/README.md) @@ -570,7 +570,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-viewer +## ADF Viewer Contains the Viewer component and other related items. See the library's [README file](ng2-components/ng2-alfresco-viewer/README.md) @@ -596,7 +596,7 @@ for more information about installing and using the source code. [(Back to Contents)](#contents) -## ng2-alfresco-webscript +## ADF Webscript Contains the Webscript component. See the library's [README file](ng2-components/ng2-alfresco-webscript/README.md) diff --git a/docassets/images/custom-footer.png b/docassets/images/custom-footer.png new file mode 100644 index 0000000000..7a791c8fbd Binary files /dev/null and b/docassets/images/custom-footer.png differ diff --git a/docassets/images/custom-header.png b/docassets/images/custom-header.png new file mode 100644 index 0000000000..8dad6608f8 Binary files /dev/null and b/docassets/images/custom-header.png differ diff --git a/docassets/images/custom-login.png b/docassets/images/custom-login.png new file mode 100644 index 0000000000..aa1e2e62e6 Binary files /dev/null and b/docassets/images/custom-login.png differ diff --git a/docassets/images/login-extra-content.png b/docassets/images/login-extra-content.png new file mode 100644 index 0000000000..09971bfd50 Binary files /dev/null and b/docassets/images/login-extra-content.png differ diff --git a/docassets/images/social1.png b/docassets/images/social1.png new file mode 100644 index 0000000000..55984b8db0 Binary files /dev/null and b/docassets/images/social1.png differ diff --git a/docassets/images/social2.png b/docassets/images/social2.png new file mode 100644 index 0000000000..94cb875c2f Binary files /dev/null and b/docassets/images/social2.png differ diff --git a/docassets/images/tag1.png b/docassets/images/tag1.png new file mode 100644 index 0000000000..e6568ebe25 Binary files /dev/null and b/docassets/images/tag1.png differ diff --git a/docassets/images/tag2.png b/docassets/images/tag2.png new file mode 100644 index 0000000000..b5906e0dbe Binary files /dev/null and b/docassets/images/tag2.png differ diff --git a/docassets/images/tag3.png b/docassets/images/tag3.png new file mode 100644 index 0000000000..278c2b9f68 Binary files /dev/null and b/docassets/images/tag3.png differ diff --git a/docs/like.component.md b/docs/like.component.md new file mode 100644 index 0000000000..27c9631864 --- /dev/null +++ b/docs/like.component.md @@ -0,0 +1,33 @@ +# ADF Like component + +![Custom columns](../docassets/images/social1.png) + + + + + +- [Basic Usage](#basic-usage) + * [Properties](#properties) + * [Events](#events) + + + + + +## Basic Usage + +```html + +``` + +### Properties + +| Attribute | Type | Default | Description | +| --- | --- | --- | --- | +| nodeId | string | | The identifier of a node.| + +### Events + +| Name | Description | +| --- | --- | +| changeVote | Raised when vote gets changed | diff --git a/docs/login.component.md b/docs/login.component.md new file mode 100644 index 0000000000..ce36f5a098 --- /dev/null +++ b/docs/login.component.md @@ -0,0 +1,232 @@ +# Login component + +Authenticates to Alfresco Content Services and Alfresco Process Services. + +![Login component](../docassets/images/custom-footer.png) + + + + + +- [Basic usage](#basic-usage) + * [Properties](#properties) + * [Events](#events) +- [Details](#details) + * [Handling events](#handling-events) + * [Change footer content](#change-footer-content) + * [Change header content](#change-header-content) + * [Extra content](#extra-content) + * [Custom logo and background](#custom-logo-and-background) + * [Customize Validation rules](#customize-validation-rules) + * [Controlling form submit execution behaviour](#controlling-form-submit-execution-behaviour) + + + + + +## Basic usage + +```html + + +``` + +### Properties + +| Name | Type | Default Value | Description | +| --- | --- | --- | --- | +| providers | string | | Possible valid values are ECM, BPM or ALL. The default behaviour of this component will log in only in the ECM . If you want to log in in both systems the correct value to use is ALL. | +| successRoute | string | | Route to redirect to upon successful login. | +| disableCsrf | boolean | false | To prevent the CSRF Token from being submitted. Only for Alfresco Process Services call | +| needHelpLink | string | | It will change the url of the NEED HELP link in the footer | +| registerLink | string | | It will change the url of the REGISTER link in the footer | +| logoImageUrl | string | \ | To change the logo image with a customised image | +| copyrightText | string | \ | The copyright text below the login box | +| backgroundImageUrl | string | \ | To change the background image with a customised image | +| fieldsValidation | { [key: string]: any; }, extra?: { [key: string]: any; } | | Use it to customise the validation rules of the login form | +| showRememberMe | boolean | false | Toggle `Remember me` checkbox visibility | +| showLoginActions | boolean | false | Toggle extra actions visibility (`Need Help`, `Register`, etc.) | + +### Events + +| Name | Description | +| --- | --- | +| onSuccess | Raised when the login is done | +| onError | Raised when the login fails | +| executeSubmit | Raised when the form is submitted | + +## Details + +### Handling events + +**app.component.html** + +```html + + +``` + +**app.component.ts** + +```ts +export class AppComponent { + + mySuccessMethod($event) { + console.log('Success Login EventEmitt called with: ' + $event.value); + } + + myErrorMethod($event) { + console.log('Error Login EventEmitt called with: ' + $event.value); + } +} +``` + +### Change footer content + +![Login with custom footer](../docassets/images/custom-footer.png) + +You can replace the entire content in the footer of the login component with your custom content. + +```html + + +` +``` + +### Change header content + +![Login with custom header](../docassets/images/custom-header.png) + +You can replace the entire content in the header of the login component with your custom content. + +```html + + +` +``` + +### Extra content + +You can put additional html content between `alfresco-login` tags to get it rendered as part of the login dialog. +This becomes handy in case you need to extend it with custom input fields handled by your application or parent component: + +```html + +
+
Your extra content
+
+ +``` + +Here's an example of custom content: + +![Login with custom content](../docassets/images/login-extra-content.png) + +### Custom logo and background + +It is possible changing logo and background images to custom values. + +```html + + +``` + +Should give you something like the following: + +![Login with custom logo and background](../docassets/images/custom-login.png) + +Alternatively you can bind to your component properties and provide values dynamically if needed: + +```html + + +``` + +### Customize Validation rules + +If needed it is possible to customise the validation rules of the login +form. You can add/modify the default rules of the login form. + +**MyCustomLogin.component.html** + +```html + + +``` + +**MyCustomLogin.component.ts** + +```ts +export class MyCustomLogin { + + @ViewChild('alfrescologin') + alfrescologin: any; + + customValidation: any; + + constructor(public router: Router) { + this.customValidation = { + username: ['', Validators.compose([Validators.required, Validators.minLength(8), Validators.maxLength(10)])], + password: ['', Validators.required] + }; + } + + ngOnInit() { + this.alfrescologin.addCustomValidationError('username', 'minlength', 'Username must be at least 8 characters.'); + this.alfrescologin.addCustomValidationError('username', 'maxlength', 'Username must not be longer than 11 characters.'); + } +} +``` + +### Controlling form submit execution behaviour + +If absolutely needed it is possible taking full control over form +submit execution by means of `executeSubmit` event. +This event is fired on form submit. + +You can prevent default behaviour by calling `event.preventDefault()`. +This allows for example having custom form validation scenarios and/or additional validation summary presentation. + +Alternatively you may want just running additional code without suppressing default one. + +**MyCustomLogin.component.html** + +```html + + +``` + +**MyCustomLogin.component.ts** + +```ts +export class MyCustomLogin { + + validateForm(event: any) { + let values = event.values; + + // check if the username is in the blacklist + if (values.controls['username'].value === 'invalidUsername') { + this.alfrescologin.addCustomFormError('username', 'the + username is in blacklist'); + event.preventDefault(); + } + } + +} +``` + +**Please note that if `event.preventDefault()` is not called then default behaviour +will also be executed after your custom code.** diff --git a/docs/rating.component.md b/docs/rating.component.md new file mode 100644 index 0000000000..08866fa34e --- /dev/null +++ b/docs/rating.component.md @@ -0,0 +1,23 @@ +# ADF Rating component + +![Custom columns](../docassets/images/social2.png) + +## Basic Usage + +```html + + +``` + +### Properties + +| Attribute | Type | Default | Description | +| --- | --- | --- | --- | +| nodeId | string | | The identifier of a node | + +### Events + +| Name | Description | +| --- | --- | +| changeVote | Raised when vote gets changed | \ No newline at end of file diff --git a/docs/search-control.component.md b/docs/search-control.component.md new file mode 100644 index 0000000000..eda804946f --- /dev/null +++ b/docs/search-control.component.md @@ -0,0 +1,66 @@ +# Search component + + + + + +- [Basic usage](#basic-usage) + * [Properties](#properties) + * [Events](#events) +- [Details](#details) + + + + + +## Basic usage + +```html + + +``` + +### Properties + +| Name | Type | Default | Description | +| --- | --- | --- | --- | +| searchTerm | string | | Search term to pre-populate the field with | +| inputType | string | "text" | Type of the input field to render, e.g. "search" or "text" (default) | +| expandable | boolean | true | Whether to use an expanding search control, if false then a regular input is used. | +| autocomplete | boolean | true | Whether the browser should offer field auto-completion for the input field to the user. | +| highlight | boolean | false | Use the true value if you want to see the searched word highlighted. | +| liveSearchEnabled | boolean | true | Whether find-as-you-type suggestions should be offered for matching content items. Set to false to disable. | +| liveSearchRoot | string | "-root-" | NodeRef or node name where the search should start. | +| liveSearchResultType | string | | Node type to filter live search results by, e.g. 'cm:content'. | +| liveSearchMaxResults | number | 5 | Maximum number of results to show in the live search. | +| liveSearchResultSort | string | | Criteria to sort live search results by, must be one of "name" , "modifiedAt" or "createdAt" | + +### Events + +| Name | Description | +| --- | --- | +| searchChange | Emitted when the search term is changed. The search term is provided in the 'value' property of the returned object. If the term is less than three characters in length then the term is truncated to an empty string. | +| searchSubmit | Emitted when the search form is submitted. The search term is provided in the 'value' property of the returned object. | +| fileSelect | Emitted when a file item from the list of find-as-you-type results is selected | +| expand | Emitted when the expanded state of the control changes based on focus events and the content of the input control | + +## Details + +```html + + +``` + +Example of a component that uses the search control. In this example the search term is simply logged to the console +but instead the component could emit an event to be consumed upstream, or it could trigger a change inside a search +results component embedded inside the same component. diff --git a/docs/search.component.md b/docs/search.component.md new file mode 100644 index 0000000000..4dac17bb4f --- /dev/null +++ b/docs/search.component.md @@ -0,0 +1,54 @@ +# Search Results component + + + + + +- [Basic usage](#basic-usage) + * [Properties](#properties) + * [Events](#events) +- [Details](#details) + + + + + +## Basic usage + +```html + + +``` + +### Properties + +| Name | Type | Default | Description | +| --- | --- | --- | --- | +| searchTerm | string | | Search term to use when executing the search. Updating this value will run a new search and update the results | +| rootNodeId | string | "-root-" | NodeRef or node name where the search should start. | +| resultType | string | | Node type to filter search results by, e.g. 'cm:content', 'cm:folder' if you want only the files. | +| maxResults | number | 20 | Maximum number of results to show in the search. | +| resultSort | string | | Criteria to sort search results by, must be one of "name" , "modifiedAt" or "createdAt" | +| navigationMode | string | "dblclick" | Event used to initiate a navigation action to a specific result, one of "click" or "dblclick" | +| navigate | boolean | true | Allow documentlist to navigate or not. For more information see documentlist component's documentation | + +### Events + +| Name | Description | +| --- | --- | +| preview | Emitted when user acts upon files with either single or double click (depends on `navigation-mode`), recommended for Viewer components integration | +| nodeDbClick | Emitted when user acts upon files or folders with double click **only when `navigation-mode` is set to false**, giving more freedom then just simply previewing the file | +| resultsLoad | Emitted when search results have fully loaded | + +## Details + +```html + + +``` + +Example of a component that displays search results, using the Angular2 router to supply a 'q' parameter containing the +search term. If no router is present on the page or if the router does not provide such parameter then an empty +results page will be shown. \ No newline at end of file diff --git a/docs/tag-actions.component.md b/docs/tag-actions.component.md new file mode 100644 index 0000000000..f81707a374 --- /dev/null +++ b/docs/tag-actions.component.md @@ -0,0 +1,28 @@ +# Alfresco Tag Node Actions List component + +![Custom columns](../docassets/images/tag3.png) + + + + + +- [Basic Usage](#basic-usage) + * [Properties](#properties) + + + + + +## Basic Usage + +```html + + +``` + +### Properties + +| Attribute | Type | Default | Description | +| --- | --- | --- | --- | +| nodeId | string | | The identifier of a node | \ No newline at end of file diff --git a/docs/tag-list.component.md b/docs/tag-list.component.md new file mode 100644 index 0000000000..2cc0fb23a2 --- /dev/null +++ b/docs/tag-list.component.md @@ -0,0 +1,3 @@ +# Alfresco Tag List component + +![Custom columns](../docassets/images/tag2.png) \ No newline at end of file diff --git a/docs/tag-node-list.component.md b/docs/tag-node-list.component.md new file mode 100644 index 0000000000..ac6686615a --- /dev/null +++ b/docs/tag-node-list.component.md @@ -0,0 +1,28 @@ +# Alfresco Tag Node List component + +![Custom columns](../docassets/images/tag1.png) + + + + + +- [Basic Usage](#basic-usage) + * [Properties](#properties) + + + + + +## Basic Usage + +```html + + +``` + +### Properties + +| Attribute | Type | Default | Description | +| --- | --- | --- | --- | +| nodeId | string | | The identifier of a node | diff --git a/ng2-components/README.md b/ng2-components/README.md index 16c7d4b25d..73244aa349 100644 --- a/ng2-components/README.md +++ b/ng2-components/README.md @@ -13,9 +13,9 @@ READMEs but the complete index for the docs can now be found in the - [Core](#core) * [Components](#components) * [Directives](#directives) -- [Content service](#content-service) +- [Content services](#content-services) * [Components](#components-1) -- [Business service](#business-service) +- [Process services](#process-services) * [components](#components) - [Services](#services) @@ -61,7 +61,7 @@ READMEs but the complete index for the docs can now be found in the - [adf-node-permission](ng2-alfresco-core/README.md) - [adf-highlight](ng2-alfresco-core/README.md) -## Content service +## Content services ### Components @@ -102,7 +102,7 @@ READMEs but the complete index for the docs can now be found in the -## Business service +## Process services ### components