BBPicker

A small Marionettejs component for uploading images with filepicker.

Usage

1. You need to have an account and api key from Inkfilepicker in order to use this utility.
2. Import the inkfilepicker js library as stated in their docs.
3. Set the API Key that was assigned to you.

filepicker.setKey("AN_API_KEY");

5. Start the BBPicker Application.

Backpicker.start();

6. Create a callback that is executed when the file is uploaded successfully.

var callback = function(optionalArgs){
   ....
}

This callback will be passed the result from a successful upload. This contains the url of the file amongst other details. You can process this information within the callback (e.g. saving the url in a database).

7. Render the view. You can either render directly unto a div:

var view = Backpicker.show(callback, context, options);
$('#myDiv').append(view.render().el);

Or you can you render within a Marionettejs Layout:

var layout = new MyLayout();
var view = Backpicker.show(callback, this, options);
layout.imageRegion.show(view);

8. You can also style the image placeholder by passing a 'className' value:

var view = Backpicker.show(callback, context, {className: 'someCssClass'});

## Requirements
* Nodejs
* npm
* gruntjs

# Development
1. Set up the dev environment after checking out the code:
```bash
$ npm install

2. The code is contained inside the src dir, and the specs inside spec dir.

3. Run the specs:

$ grunt spec

The specs are run with Testem and uses Jasmine.

4. Clean compiled assets:

$ grunt clean

5. Building

$ grunt build

Build files will be generated in /dist directory. It will have both a minified version and a development version.

To Do

Test the filepicker events. Currently I don't know how to simulate drag and drop or fake an event that will trigger filePicker.makeDropPanel(). Any help would be greatly appreciated.

License

GPLv3