fng-jq-upload v0.12.0-beta.308
fng-jq-upload
jQuery file upload plugin for forms-angular, storing data in Mongo. A wrapper for BlueImp jquery-file-upload, heavily influenced Dominic Bottger's fork of that project.
Usage
npm install fng-jq-upload
To get all the dependencies at the top level of your node_modules run
npm dedupe
On the server side:
Install ImageMagick for creating image thumbnails.
In the call to create the forms-angular object (normally in the main server express start-up module) add a plugins property to the options as follows:
var fngJqUpload = require('fng-jq-upload');
var DataFormHandler = new (formsAngular)(app, {
plugins: {
JQMongoFileUploader: { plugin: fngJqUpload.Controller, options: { } },
}
});
Configuration options:
- inhibitAuthentication : boolean. Inhibit calling any authentication middleware that forms-angular has been told to use. Prevents having to intercept http calls in BlueImp (PRs to enable this would be more than welcome).
On the client side:
Add the following lines to your index.html (or equivalent) file
<!-- blueimp Gallery styles -->
<link rel="stylesheet" href="blueimp-gallery/css/blueimp-gallery.css">
<!-- CSS to style the file input field as button and adjust the Bootstrap progress bars -->
<link rel="stylesheet" href="fng-jqfile-upload/css/jquery.fileupload.css">
<link rel="stylesheet" href="fng-jqfile-upload/css/jquery.fileupload-ui.css">
<script type="text/javascript" src="blueimp-load-image/js/load-image.min.js"></script>
<!-- The Canvas to Blob plugin is included for image resizing functionality -->
<script type="text/javascript" src="blueimp-canvas-to-blob/js/canvas-to-blob.min.js"></script>
<!-- blueimp Gallery script -->
<script type="text/javascript" src="blueimp-gallery/js/jquery.blueimp-gallery.min.js"></script>
<script type="text/javascript" src="fng-jq-upload/fng-jq-upload.js"></script>
Ensure that your application module (or whatever module is going to use the uploader) specifies uploadModule as a dependency.
angular.module('myApplication', ['uploadModule']);
File fields need to be set up as follows:
var uploadSchema = new mongoose.Schema({
filename: String,
size: Number
});
var mySchema = new mongoose.Schema({
domrField: String,
files: {
type: [uploadSchema],
form: {
directive: 'fng-jq-upload-form',
fngJqUploadForm: {
sizeLimit: 5000000,
autoUpload:true
}
}
}
});
You can extend the schema and add the additFields property to the fngJqUploadForm object to generate an inline form to capture the extra fields. For example:
additFields: JSON.stringify([{name:'param'}]),
the additFields property is of type form schema.
The chunks and file details get stored in the collection.files and collection.chunks collections where 'collection' is the collection in which the data for mySchema is stored. Additional fields, if any, get stored in the main collection.
This is done using the following api endpoints:
- POST /file/upload/:model stores the uploaded file to a model. In the case of gif, png or jpg files creates a thumbnail. Other file types get a reference to a generic file icon as a thumbnail.
- GET /file/:model/:id retrieves a stored file
- GET /file/:model/thumbnail/:id retrieves a thumbnail for a stored graphical file
DELETE /file/:model/:id deletes a stored file
4 days ago
4 days ago
4 days ago
13 days ago
13 days ago
20 days ago
23 days ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
4 months ago
4 months ago
4 months ago
4 months ago
4 months ago
6 months ago
7 months ago
7 months ago
7 months ago
8 months ago
8 months ago
8 months ago
8 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
10 months ago
10 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
12 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
3 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
4 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
6 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
7 years ago
8 years ago
8 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
9 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago