mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-31 17:38:48 +00:00
[ADF-1453] Restructure README.md files (#2239)
* ADF-1453: Restructured Activiti Analytics readme * ADF-1453: Restructured Activiti Diagrams readme * ADF-1453: Restructured Activiti Form readme * ADF-1453: Restructured Activiti Process List readme * ADF-1453: Restructured Activiti Task List readme * ADF-1453: Restructured Alfresco Core readme * [ADF-1453] Restructured DataTable readme * [ADF-1453] Restructured Document List readme * [ADF-1453] Restructured Login readme * [ADF-1453] Restructured Alfresco Search readme * [ADF-1453] Restructured Alfresco Social readme * [ADF-1453] Restructured Alfresco Tag readme * [ADF-1453] Restructured Alfresco User Info readme * [ADF-1453] Restructured Alfresco Viewer readme * [ADF-1453] Restructured Alfresco Webscript readme * [ADF-1453] Fixed table display glitch * [ADF-1453] Fixed Markdown lint errors in readme files * [ADF-1453] Adding missing fileUploadDelete event to table in Upload readme * [ADF-1453] Resolved merge conflict with Upload readme * [ADF-1453] Changes from npm run doc
This commit is contained in:
Andy Stark
Mario Romano
@@ -1,42 +1,85 @@
|
||||
# Alfresco File Viewer Component
|
||||
# Alfresco File Viewer library
|
||||
|
||||
Contains the Alfresco Viewer component.
|
||||
|
||||
<!-- markdown-toc start - Don't edit this section. npm run toc to generate it-->
|
||||
|
||||
<!-- toc -->
|
||||
|
||||
- [Prerequisites](#prerequisites)
|
||||
- [Install](#install)
|
||||
* [Configuring PDF.js library](#configuring-pdfjs-library)
|
||||
- [Basic usage](#basic-usage)
|
||||
- [Properties](#properties)
|
||||
- [Supported file formats](#supported-file-formats)
|
||||
- [PDF Conversion](#pdf-conversion)
|
||||
- [Custom extension handler](#custom-extension-handler)
|
||||
- [Build from sources](#build-from-sources)
|
||||
- [NPM scripts](#npm-scripts)
|
||||
- [Demo](#demo)
|
||||
- [License](#license)
|
||||
- [Alfresco Viewer component](#alfresco-viewer-component)
|
||||
* [Basic usage](#basic-usage)
|
||||
+ [Properties](#properties)
|
||||
* [Details](#details)
|
||||
+ [Supported file formats](#supported-file-formats)
|
||||
+ [PDF Conversion](#pdf-conversion)
|
||||
+ [Configuring PDF.js library](#configuring-pdfjs-library)
|
||||
+ [Custom extension handler](#custom-extension-handler)
|
||||
- [Project Information](#project-information)
|
||||
* [Prerequisites](#prerequisites)
|
||||
* [Install](#install)
|
||||
* [Build from sources](#build-from-sources)
|
||||
* [NPM scripts](#npm-scripts)
|
||||
* [Demo](#demo)
|
||||
* [License](#license)
|
||||
|
||||
<!-- tocstop -->
|
||||
|
||||
<!-- markdown-toc end -->
|
||||
|
||||
## Alfresco Viewer component
|
||||
|
||||
See it live: [Viewer Quickstart](https://embed.plnkr.co/iTuG1lFIXfsP95l6bDW6/)
|
||||
|
||||
## Prerequisites
|
||||
### Basic usage
|
||||
|
||||
Before you start using this development framework, make sure you have installed all required software and done all the
|
||||
necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
|
||||
Using with node id:
|
||||
|
||||
> If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
|
||||
|
||||
## Install
|
||||
|
||||
```sh
|
||||
npm install ng2-alfresco-viewer
|
||||
```html
|
||||
<adf-viewer
|
||||
[showViewer]="true"
|
||||
[overlayMode]="true"
|
||||
[fileNodeId]="'d367023a-7ebe-4f3a-a7d0-4f27c43f1045'">
|
||||
</adf-viewer>
|
||||
```
|
||||
|
||||
### Configuring PDF.js library
|
||||
Using with file url:
|
||||
|
||||
```html
|
||||
<adf-viewer
|
||||
[overlayMode]="true"
|
||||
[urlFile]="'filename.pdf'">
|
||||
</adf-viewer>
|
||||
```
|
||||
|
||||
#### Properties
|
||||
|
||||
| Attribute | Options | Default | Description |
|
||||
| --- | --- | --- | --- |
|
||||
| fileNodeId | string | | Node Id of the file to load |
|
||||
| urlFile | string | | If you want to load an external file that does not come from ECM you can use this Url where to load the file |
|
||||
| urlBlob | Blob | | If you want to load a Blob File |
|
||||
| overlayMode | boolean | false | If `true` show the Viewer full page over the present content otherwise will fit the parent div |
|
||||
| showViewer | boolean | true | Hide or show the viewer |
|
||||
| showToolbar | boolean | true | Hide or show the toolbars |
|
||||
| displayName | string | | You can specify the name of the file |
|
||||
|
||||
### Details
|
||||
|
||||
#### Supported file formats
|
||||
|
||||
| Type | Extension |
|
||||
| --- | --- |
|
||||
| Media | wav, Mp3, Mp4, WebM, Ogv |
|
||||
| Images | png, jpg, jpeg, gif, bmp |
|
||||
| Text | pdf, txt |
|
||||
|
||||
#### PDF Conversion
|
||||
|
||||
|
||||
|
||||
Note for unsupported extensions the viewer will offer the possibility to convert to PDF if that kind of extension is supported by the [content service renditions service](https://community.alfresco.com/docs/DOC-5879-rendition-service)
|
||||
|
||||
#### Configuring PDF.js library
|
||||
|
||||
In order to configure your webpack-enabled application with the PDF.js library please follow the next steps.
|
||||
|
||||
@@ -73,54 +116,7 @@ new CopyWebpackPlugin([
|
||||
|
||||
The Viewer component now should be able displaying PDF files.
|
||||
|
||||
## Basic usage
|
||||
|
||||
Using with node id:
|
||||
|
||||
```html
|
||||
<adf-viewer
|
||||
[showViewer]="true"
|
||||
[overlayMode]="true"
|
||||
[fileNodeId]="'d367023a-7ebe-4f3a-a7d0-4f27c43f1045'">
|
||||
</adf-viewer>
|
||||
```
|
||||
|
||||
Using with file url:
|
||||
|
||||
```html
|
||||
<adf-viewer
|
||||
[overlayMode]="true"
|
||||
[urlFile]="'filename.pdf'">
|
||||
</adf-viewer>
|
||||
```
|
||||
|
||||
## Properties
|
||||
|
||||
| Attribute | Options | Default | Description |
|
||||
| --- | --- | --- | --- |
|
||||
| fileNodeId | string | | Node Id of the file to load |
|
||||
| urlFile | string | | If you want to load an external file that does not come from ECM you can use this Url where to load the file |
|
||||
| urlBlob | Blob | | If you want to load a Blob File |
|
||||
| overlayMode | boolean | false | If `true` show the Viewer full page over the present content otherwise will fit the parent div |
|
||||
| showViewer | boolean | true | Hide or show the viewer |
|
||||
| showToolbar | boolean | true | Hide or show the toolbars |
|
||||
| displayName | string | | You can specify the name of the file |
|
||||
|
||||
## Supported file formats
|
||||
|
||||
| Type | Extension |
|
||||
| --- | --- |
|
||||
| Media | wav, Mp3, Mp4, WebM, Ogv |
|
||||
| Images | png, jpg, jpeg, gif, bmp |
|
||||
| Text | pdf, txt |
|
||||
|
||||
## PDF Conversion
|
||||
|
||||
|
||||
|
||||
Note for unsupported extensions the viewer will offer the possibility to convert to PDF if that kind of extension is supported by the [content service renditions service](https://community.alfresco.com/docs/DOC-5879-rendition-service)
|
||||
|
||||
## Custom extension handler
|
||||
#### Custom extension handler
|
||||
|
||||
If you want to handle other file formats that are not yet supported by the ng2-alfresco-viewer you can define your own custom handler.
|
||||
|
||||
@@ -172,7 +168,22 @@ It is possible to define multiple `extension-viewer` templates:
|
||||
</adf-viewer>
|
||||
```
|
||||
|
||||
## Build from sources
|
||||
## Project Information
|
||||
|
||||
### Prerequisites
|
||||
|
||||
Before you start using this development framework, make sure you have installed all required software and done all the
|
||||
necessary configuration [prerequisites](https://github.com/Alfresco/alfresco-ng2-components/blob/master/PREREQUISITES.md).
|
||||
|
||||
> If you plan using this component with projects generated by Angular CLI, please refer to the following article: [Using ADF with Angular CLI](https://github.com/Alfresco/alfresco-ng2-components/wiki/Angular-CLI)
|
||||
|
||||
### Install
|
||||
|
||||
```sh
|
||||
npm install ng2-alfresco-viewer
|
||||
```
|
||||
|
||||
### Build from sources
|
||||
|
||||
You can build component from sources with the following commands:
|
||||
|
||||
@@ -184,7 +195,7 @@ npm run build
|
||||
> The `build` task rebuilds all the code, runs tslint, license checks
|
||||
> and other quality check tools before performing unit testing.
|
||||
|
||||
## NPM scripts
|
||||
### NPM scripts
|
||||
|
||||
| Command | Description |
|
||||
| --- | --- |
|
||||
@@ -193,7 +204,7 @@ npm run build
|
||||
| npm run test-browser | Run unit tests in the browser
|
||||
| npm run coverage | Run unit tests and display code coverage report |
|
||||
|
||||
## Demo
|
||||
### Demo
|
||||
|
||||
Please check the demo folder for a demo project
|
||||
|
||||
@@ -203,6 +214,6 @@ npm install
|
||||
npm start
|
||||
```
|
||||
|
||||
## License
|
||||
### License
|
||||
|
||||
[Apache Version 2.0](https://github.com/Alfresco/alfresco-ng2-components/blob/master/LICENSE)
|
||||
|
||||
Reference in New Issue
Block a user