The new Media Library module in Orchard 1.7 has many interesting new features, and I was particularly excited by the ability to import images from Bing via the Web Search feature which was presented at Orchard Harvest this year.
Being a regular Dropbox user, the idea of being able to import media straight from the cloud seemed very useful, so I got to work on a Dropbox media import feature which you can now find over on the Orchard Gallery.
Installation & Getting Started
After installing the module on your Orchard site you will need to create an API Key over on your Dropbox Developer Console. There are a few questions that you have to answer to create the right kind of key, so ensure you create a Dropbox API app, with access to files and datastores, that can access all file types already present on Dropbox. See the screenshot below if you aren’t sure.
Once you receive the App Key and App Secret, head over to your Orchard site and go to Dashboard » Settings » Media to save them.
When you are ready to start importing media, you’ll see Dropbox appear on the media import screen. The first time you do this, you’ll need to link your Orchard user with a Dropbox account. This uses OAuth, so you’ll be briefly redirected to the Dropbox site to confirm that you wish to proceed.
After authenticating with Dropbox, you are ready to start importing media! You can browse all your Dropbox folders, and can preview images Ctrl-clicking will allow multiple selection.
The source is available over on GitHub. Please direct your pull requests there.
The UI was implemented using knockout.js. This was my first foray into client side MVVM, and a very pleasant experience. Needless to say I will be client side MVVM’ing all the things in the future.
The thumbnail images are cached in the browser, although ideally they would be downloaded directly from Dropbox without generating another request to Orchard (see below). If you notice thumbnails not updating, try clearing your browser cache.
There are still one or two things left to do with this module but haven’t got round to just yet, namely:
- Ability to delete Dropbox credentials from a user in case they want to switch accounts
- Offer the option to use public links to files, hosting the files on Dropbox instead of importing them into the media library.
- Download thumbnail images directly rather than through Orchard site
That’s all! I hope you find this module useful, I’ve had a lot of fun writing it.
Questions, comments, suggestions? I sporadically tweet.