Angular image drag and drop

Maximum bid: $100

Because the hard part is already done...

Modify an existing open source script, such as this one:

[login to view URL]

Use the open source script to create an Angular version of the "drag and drop" and "file upload" on this page: [login to view URL]

1. The user can drag and drop an image anywhere on the page. Or click a button and browse to the file in a file manager dialog.

2. The image file is immediately uploaded on mouse release (no clicks)

3. A progress bar shows the progress of the file upload

4. When the file upload is complete, convert the image file to a base64 string and store the string in an angular variable such as $[login to view URL]

5. Put the string into an <img src="stringHere"> element on the page so the user can see the uploaded image using the base64 string.

Please make a function, directive or module that I can re-use on multiple pages throughout an app (eg, I just copy it into the new page, and it works).

Please make it able to handle multiple inputs at different places on a page. For example, I might have one "drag and drop / file input" at the top of the page, then heaps of text, then at the bottom of the page I might have a 2nd different "drag and drop / file input" for a different input field. Please make it easy for the script to handle this multiple input field scenario.

This script is for commercial production use.

Please include a reference to the Source.

Please use open source, DO NOT copy a commercial product.

Please use Twitter Bootstrap for CSS if the library you use does not have CSS included.

NO JQUERY!!! (Sorry, jQuery causes conflicts in my code environment. Pure angular / javascript please).

Good luck! :)

AngularJS JavaScript

プロジェクトID: #11723014

プロジェクトについて