The purpose of this document is to explain the utility, integration and the use of the omni-attachment directive.
To integrate the directive in your angularJS application, you just have to import it in your application by adding the following line in your bower.json :
"omniAttachment": "http://10.10.1.170:10080/os-angularjs/omni-attachement.git",
...
You can then put the directive in anywhere of your html page by using the <omni-attachment></omni-attachment>
html tag.
This directive contain 4 attributes which provide the ability to customization all the operations offered by the directive (upload, download, delete and consultation).
- id : The id of the entity to whom belongs the attachment
- class-name : The complete name of the entity class
- application-name : the name of the application
- mode : write/read
- read : offers the possibility to view and download attachments.
- write : gives access to upload (size < 17MB) and delete attachments functionalities, in addition to what read mode offers.
The directive's rendering will appear as follows:
You can click on the 'download' icon to download the file or preview it on your browser in case of PDF files.
Here you have the possibility to upload, download and delete attachments.
NB: You should specify a name for your file before uploading it.
The omni-attachment directive relies on the famous pascal precht translate directive to localize its output text. It sets automatically the language to use by looking at your browser preferences, settings ...
NB: Currently, the directive supports only english and french.
A bunch of css classes are available to give you total control of the appearance of all the components of the directive. The following schema shows you which css class controls which part of the directive's rendering.
-
attachment-container : controls the style of the whole container div of the directive
-
attachment-success-message : controls the style of the success message shown after a successful operation
-
attachment-error-message : controls the style of the error message shown after a failure.
-
attachment-progressbar : controls the style of the progress bar shown while uploading a file.
-
Other components: