Skip to content


Subversion checkout URL

You can clone with
Download ZIP
Browse files

update readme, add small tests

  • Loading branch information...
commit 02c94bc3134de17a9c5c630cd2af2fa1d3e6ab3b 1 parent 86804cd
Wayne authored
1  .gitignore
@@ -1,4 +1,5 @@
@@ -1,6 +1,9 @@
# S3DirectUpload
-TODO: Write a gem description
+Easily generate a form that allows you to upload directly to Amazon S3.
+Multi file uploading supported by jquery-fileupload.
+Code extracted from Ryan Bates' [gallery-jquery-fileupload](
## Installation
@@ -8,8 +11,10 @@ Add this line to your application's Gemfile:
gem 's3_direct_upload'
-Then add a new initalizer with this code:
+Then add a new initalizer with your AWS credentials:
S3DirectUpload.config do |c|
c.access_key_id = "" # your access key id
c.secret_access_key = "" # your secret access key
@@ -17,7 +22,7 @@ S3DirectUpload.config do |c|
-S3 Cors Config should look like this:
+Make sure your AWS S3 CORS settings for your bucket look something like this:
@@ -30,29 +35,89 @@ S3 Cors Config should look like this:
+In production the AllowedOrigin key should be your domain.
-This gem requires the gem "jquery-fileupload-rails", which is already included by the gem.
-You will need to add the following jquery-fileupload assets to your asset pipeline:
+Add the following js and css to your asset pipeline:
+//= require s3_direct_upload
-//= require jquery-fileupload/basic
-//= require jquery-fileupload/vendor/tmpl
+//= require s3_direct_upload_progress_bars
## Usage
Create a new view that uses the helper:
-<%= s3_uploader_form post: paintings_url, as: "painting[image_url]" do %>
+<%= s3_uploader_form post: model_url, as: "model[image_url]" do %>
<%= file_field_tag :file, multiple: true %>
<% end %>
-## Contributing
+Also place this template in the same view for the progress bars:
+<script id="template-upload" type="text/x-tmpl">
+<div class="upload">
+ {}
+ <div class="progress"><div class="bar" style="width: 0%"></div></div>
+### Customizations
+Feel free to override the styling for the progress bars in s3_direct_upload_progress_bars, look at the source for inspiration.
+Also feel free to write your own js to interface with jquery-file-upload. You might want to do this to do custom validations on the files before it is sent to S3 for example.
+To do this remove `s3_direct_upload` from your application.js and include the necissary jquery-file-upload scripts (they are included in this gem automatically):
+//= require jquery-fileupload/basic
+//= require jquery-fileupload/vendor/tmpl
+and use the `s3_direct_upload` script as a guide, the form helper will still work fine if thats all you need.
+### s3_uploader_form options and after upload callback
+After the upload is complete, the script will execute an ajax POST to the model_url given in the `post` option in the form helper.
+The url to the file on S3 will be passed as a key to whatever is in the `as` option.
+You could have your create action render a javascript file like this:
+<% if @model.new_record? %>
+ alert("Failed to upload model: <%= j @model.errors.full_messages.join(', ').html_safe %>");
+<% else %>
+ $("#paintings").append("<%= j render(@model) %>");
+<% end %>
+So that javascript code would be executed after the model instance is created, which would render your _model.html.erb template without a page reload if you wish.
+It is recommended that you persist the image_url as an attribute on the model. To do this To do this add `resources model` in the routes file, and add the 'image_url' attribute to your model (can be whatever you set it as in the as options)
+## Gotchas
+Right now you can only have one upload form on a page.
+Upload form is hardcoded with id '#fileupload'
+## Contributing / TODO
+This is just a simple gem that only really provides some javascript and a form helper.
+This gem could go all sorts of ways based on what people want and how people contribute.
+More specs!
+More options to control expiration, max filesize, file types etc.
+Create generators.
+Model methods.
+## Credit
+This gem is basically a small wrapper around code that [Ryan Bates]( wrote for [Railscast#383]( Most of the code in this gem was extracted from [gallery-jquery-fileupload](
+Thank you Ryan Bates!
-1. Fork it
-2. Create your feature branch (`git checkout -b my-new-feature`)
-3. Commit your changes (`git commit -am 'Added some feature'`)
-4. Push to the branch (`git push origin my-new-feature`)
-5. Create new Pull Request
+This code also uses the excellecnt [jQuery-File-Upload](, which is included in this gem by its rails counterpart [jquery-fileupload-rails](
5 lib/s3_direct_upload.rb
@@ -1,4 +1,5 @@
-require "s3_direct_upload/version"
+require 's3_direct_upload/version'
+require 'jquery-fileupload-rails' if defined?(Rails)
require 'base64'
require 'openssl'
@@ -6,6 +7,6 @@
require 's3_direct_upload/config_aws'
require 's3_direct_upload/form_helper'
-require 's3_direct_upload/engine'
+require 's3_direct_upload/engine' if defined?(Rails)
ActionView::Base.send(:include, S3DirectUpload::UploadHelper) if defined?(ActionView::Base)
6 s3_direct_upload.gemspec
@@ -5,10 +5,10 @@ do |gem|
gem.authors = ["Wayne"] = [""]
gem.description = %q{Direct Upload to Amazon S3 With CORS}
- gem.summary = %q{Gives a form helper for Rails which allows direct uploads to s3}
+ gem.summary = %q{Gives a form helper for Rails which allows direct uploads to s3. Based on RailsCast#383}
gem.homepage = ""
- gem.files = `git ls-files`.split($\)
+ gem.files = Dir["{lib,app}/**/*"] + ["LICENSE", ""]
gem.executables = gem.files.grep(%r{^bin/}).map{ |f| File.basename(f) }
gem.test_files = gem.files.grep(%r{^(test|spec|features)/}) = "s3_direct_upload"
@@ -16,5 +16,7 @@ do |gem|
gem.version = S3DirectUpload::VERSION
gem.add_dependency 'rails', '~> 3.2'
+ gem.add_dependency 'coffee-rails', '~> 3.2.1'
+ gem.add_dependency 'sass-rails', '~> 3.2.1'
gem.add_dependency 'jquery-fileupload-rails', '~> 0.3.4'
7 spec/existance_spec.rb
@@ -8,11 +8,4 @@
S3DirectUpload.config.should be_true
- it "engine must be defined"
- pending
- end
- it "form helper must be defined"
- pending
- end
Please sign in to comment.
Something went wrong with that request. Please try again.