angular-dropzone
Advanced tools
angular-dropzone - npm Package Compare versions
Comparing version 1.0.1 to 1.0.2
| { | ||
| "name": "angular-dropzone", | ||
| "version": "1.0.1", | ||
| "version": "1.0.2", | ||
| "description": "An advanced file uploader for Angular", | ||
| "keywords": ["angular", "file-upload", "chunk", "uploader", "chunked-uploads", "upload-manager", "upload-file", "upload-images" ], | ||
| "license": "MIT", | ||
| "homepage": "https://github.com/FaNathan/Angular-DropZone", | ||
| "peerDependencies": { | ||
@@ -5,0 +9,0 @@ "@angular/common": "^13.2.0", |
201
README.md
| <div id="top"></div> | ||
| <!-- PROJECT LOGO --> | ||
| <br /> | ||
| <!-- <a href="https://github.com/github_username/repo_name"> | ||
| <!-- <a href="https://github.com/github_username/repo_name"> | ||
| <img src="images/logo.png" alt="Logo" width="80" height="80"> | ||
| </a> --> | ||
| <h3 align="center">Angular DropZone (Beta)</h3> | ||
| <div align="center"> | ||
| <h3 align="left">Angular DropZone (Beta)</h3> | ||
| <div align="left"> | ||
| An advanced multi purpose file uploader for Angular | ||
| TBC... | ||
| <br/> | ||
| <a href="https://fanathan.github.io/Angular-DropZone/">Demo</a> | ||
| </div> | ||
| <p align="center"> | ||
| <!-- TABLE OF CONTENTS --> | ||
| <!-- <details> | ||
| <summary>Table of Contents</summary> | ||
| <ol> | ||
| <li> | ||
| <a href="#about-the-project">About The Project</a> | ||
| <ul> | ||
| <li><a href="#built-with">Built With</a></li> | ||
| </ul> | ||
| </li> | ||
| <li> | ||
| <a href="#getting-started">Getting Started</a> | ||
| <ul> | ||
| <li><a href="#prerequisites">Prerequisites</a></li> | ||
| <li><a href="#installation">Installation</a></li> | ||
| </ul> | ||
| </li> | ||
| <li><a href="#usage">Usage</a></li> | ||
| <li><a href="#roadmap">Roadmap</a></li> | ||
| <li><a href="#contributing">Contributing</a></li> | ||
| <li><a href="#license">License</a></li> | ||
| <li><a href="#contact">Contact</a></li> | ||
| <li><a href="#acknowledgments">Acknowledgments</a></li> | ||
| </ol> | ||
| </details> | ||
| --> | ||
| <!-- ABOUT THE PROJECT --> | ||
| ## About The Project | ||
| <img align="center" width="530" alt="image" src="https://user-images.githubusercontent.com/102797896/161385043-c975368e-75d9-42f6-b5b1-7bd93f63a4a5.png"> | ||
| </p> | ||
| ### Built With | ||
| - [Angular](https://angular.io/) | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| <!-- GETTING STARTED --> | ||
| <!-- ## Getting Started | ||
| This is an example of how you may give instructions on setting up your project locally. | ||
| To get a local copy up and running follow these simple example steps. | ||
| ### Prerequisites | ||
| This is an example of how to list things you need to use the software and how to install them. | ||
| --> | ||
| ### Installation | ||
| 1. Install the package | ||
| - npm | ||
| `sh npm install angular-dropzone ` | ||
| or | ||
| - yarn | ||
| ```sh | ||
| yarn add angular-dropzone | ||
| ``` | ||
| 2. import Module | ||
| ```typescript | ||
| import { AngularDropzoneModule } from 'angular-dropzone'; | ||
| @NgModule({ | ||
| declarations: [ | ||
| AppComponent | ||
| ], | ||
| imports: [ | ||
| ... | ||
| AngularDropzoneModule <---- | ||
| ], | ||
| providers: [], | ||
| bootstrap: [AppComponent] | ||
| }) | ||
| ``` | ||
| 3. add your api to ts file | ||
| ```typescript | ||
| // test.component.ts | ||
| uploadApi = new AngularDropzoneAPI('http://sample_url:5000/FileUpload', 'POST'); | ||
| ``` | ||
| ```html | ||
| <angular-dropzone [uploadAPI]="uploadApi"></angular-dropzone> | ||
| ``` | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| <!-- USAGE EXAMPLES --> | ||
| ## Usage | ||
| | Feature | Type | Default Value | Description | | ||
@@ -48,11 +133,12 @@ | --------------------- | --------------------------------------------------------------- | ------------- | --------------------------------------------------------------- | | ||
| ``` | ||
| const myValidateFunctions = [ | ||
| { | ||
| fn: (item) => item.size < 100000 , // logic should be here | ||
| errorMessage: 'File size is more than expected.' // custom error message | ||
| } | ||
| ] | ||
| ```typescript | ||
| const myValidateFunctions = [ | ||
| { | ||
| fn: (item) => item.size < 100000 , // logic should be here | ||
| errorMessage: 'File size is more than expected.' // custom error message | ||
| }, | ||
| ... | ||
| ] | ||
| <angular-dropzone validateFunctions="myValidateFunctions"></angular-dropzone> | ||
| <angular-dropzone validateFunctions="myValidateFunctions"></angular-dropzone> | ||
| ``` | ||
@@ -62,6 +148,77 @@ | ||
| ``` | ||
| ```html | ||
| <angular-dropzone [uploadAPI]="uploadApi"> | ||
| <div style="color: darkgoldenrod; font-size: 12px">Max file size is 10 MB</div> | ||
| <div style="color: darkgoldenrod; font-size: 12px">Max file size is 10 MB</div> | ||
| </angular-dropzone> | ||
| ``` | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| <!-- ROADMAP --> | ||
| <!-- ## Roadmap | ||
| - [x] Add Changelog | ||
| - [x] Add back to top links | ||
| - [ ] Add Additional Templates w/ Examples | ||
| - [ ] Add "components" document to easily copy & paste sections of the readme | ||
| - [ ] Multi-language Support | ||
| - [ ] Chinese | ||
| - [ ] Spanish | ||
| See the [open issues](https://github.com/othneildrew/Best-README-Template/issues) for a full list of proposed features (and known issues). | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| --> | ||
| <!-- CONTRIBUTING --> | ||
| ## Contributing | ||
| Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**. | ||
| If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". | ||
| Don't forget to give the project a star! Thanks again! | ||
| 1. Fork the Project | ||
| 2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`) | ||
| 3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`) | ||
| 4. Push to the Branch (`git push origin feature/AmazingFeature`) | ||
| 5. Open a Pull Request | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| <!-- LICENSE --> | ||
| ## License | ||
| Distributed under the MIT License. See `LICENSE.txt` for more information. | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| <!-- CONTACT --> | ||
| <!-- ## Contact | ||
| Your Name - [@your_twitter](https://twitter.com/your_username) - email@example.com | ||
| Project Link: [https://github.com/your_username/repo_name](https://github.com/your_username/repo_name) | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| --> | ||
| <!-- ACKNOWLEDGMENTS --> | ||
| <!-- ## Acknowledgments | ||
| Use this space to list resources you find helpful and would like to give credit to. I've included a few of my favorites to kick things off! | ||
| * [Choose an Open Source License](https://choosealicense.com) | ||
| * [GitHub Emoji Cheat Sheet](https://www.webpagefx.com/tools/emoji-cheat-sheet) | ||
| * [Malven's Flexbox Cheatsheet](https://flexbox.malven.co/) | ||
| * [Malven's Grid Cheatsheet](https://grid.malven.co/) | ||
| * [Img Shields](https://shields.io) | ||
| * [GitHub Pages](https://pages.github.com) | ||
| * [Font Awesome](https://fontawesome.com) | ||
| * [React Icons](https://react-icons.github.io/react-icons/search) | ||
| <p align="right">(<a href="#top">back to top</a>)</p> | ||
| --> |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Long strings
Supply chain riskContains long string literals, which may be a sign of obfuscated or packed code.
Found 1 instance in 1 package
No License Found
License(Experimental) License information could not be found.
Found 1 instance in 1 package
No website
QualityPackage does not have a website.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by1.67%
283731
- Number of low license alerts
- decreased by-100%
0
- Number of low quality alerts
- decreased by-100%
0
- Number of lines in readme file
- increased by237.88%
223
Worsened metrics
- Lines of code
- decreased by-0.16%
1913
No dependency changes