s3_cors_fileupload 0.2.1 → 0.3.0

data/lib/generators/s3_cors_fileupload/install/templates/views/erb/index.html.erb

@@ -1,4 +1,4 @@
-<%= stylesheet_link_tag '//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css' %>
+<%= stylesheet_link_tag '//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css' %>
 
 <div style="padding: 10px;">
   <h2>Upload file(s)</h2>

data/lib/generators/s3_cors_fileupload/install/templates/views/haml/_template_download.html.haml

@@ -7,21 +7,31 @@
       %span.preview
         {% if (file.thumbnailUrl) { %}
         %a{:download => "{%=file.name%}", :href => "{%=file.url%}", :title => "{%=file.name%}", :"data-gallery" => ''}
-          %img{:src => "{%=file.thumbnailUrl%}"}/
+          %img{:src => "{%=file.thumbnailUrl%}"}
         {% } %}
     %td
       %p.name
+        {% if (file.url) { %}
         %a{:href => "{%=file.url%}", :title => "{%=file.name%}", :download => "{%=file.name%}", :"data-gallery" => !"{%= file.thumbnailUrl ? ' ' : '' %}".html_safe.empty? && ''} {%=file.name%}
+        {% } else { %}
+        %span {%=file.name%}
+        {% } %}
       {% if (file.error) { %}
       %div
-        %span.label.label-important Error
+        %span.label.label-danger Error
         {%=file.error%}
       {% } %}
     %td
       %span.size {%=o.formatFileSize(file.size)%}
     %td
-      %button.btn.btn-danger.delete{"data-type" => "{%=file.delete_type%}", "data-url" => "{%=file.delete_url%}", "data-confirmation" => "Are you sure?", "data-xhr-fields" => !"{% if (file.delete_with_credentials) { %} {'withCredentials': true} {% } %}".blank? && "{% if (file.delete_with_credentials) { %} {'withCredentials': true} {% } %}"}
-        %i.icon-trash.icon-white
+      {% if (file.deleteUrl) { %}
+      %button.btn.btn-danger.delete{"data-type" => "{%=file.deleteType%}", "data-url" => "{%=file.deleteUrl%}", "data-confirmation" => "Are you sure?", "data-xhr-fields" => !"{% if (file.delete_with_credentials) { %} {'withCredentials': true} {% } %}".blank? && "{% if (file.delete_with_credentials) { %} {'withCredentials': true} {% } %}"}
+        %i.glyphicon.glyphicon-trash
         %span Delete
       %input.toggle{:name => "delete", :type => "checkbox", :value => "1"}
+      {% } else { %}
+      %button.btn.btn-warning.cancel
+        %i.glyphicon.glyphicon-ban-circle
+        %span Cancel
+      {% } %}
   {% } %}

data/lib/generators/s3_cors_fileupload/install/templates/views/haml/_template_upload.html.haml

@@ -9,24 +9,24 @@
       %p.name {%=file.name%}
       {% if (file.error) { %}
       %div
-        %span.label.label-important Error
+        %span.label.label-danger Error
         {%=file.error%}
       {% } %}
     %td
       %p.size {%=o.formatFileSize(file.size)%}
       {% if (!o.files.error) { %}
-      .progress.progress-success.progress-striped.active{:role => 'progressbar', :"aria-valuemin" => '0', :"aria-valuemax" => '100', :"aria-valuenow" => '0'}
-        .bar{:style => "width:0%;"}
+      .progress.progress-striped.active{:role => 'progressbar', :"aria-valuemin" => '0', :"aria-valuemax" => '100', :"aria-valuenow" => '0'}
+        .progress-bar.progress-bar-success{:style => "width:0%;"}
       {% } %}
     %td
       {% if (!o.files.error && !i && !o.options.autoUpload) { %}
       %button.btn.btn-primary.start
-        %i.icon-upload.icon-white
+        %i.glyphicon.glyphicon-upload
         %span Start
       {% } %}
       {% if (!i) { %}
       %button.btn.btn-warning.cancel
-        %i.icon-ban-circle.icon-white
+        %i.glyphicon.glyphicon-ban-circle
         %span Cancel
       {% } %}
   {% } %}

data/lib/generators/s3_cors_fileupload/install/templates/views/haml/_template_uploaded.html.haml

@@ -10,11 +10,22 @@
         {% } %}
     %td
       %p.name
-        %a{:href => "{%=o.url%}", :title => "{%=o.name%}", :download => "{%=o.name%}", :"data-gallery" => !"{%= o.thumbnailUrl ? 'true' : '' %}".html_safe.empty? && ''} {%=o.name%}
+        {% if (o.url) { %}
+        %a{:href => "{%=o.url%}", :title => "{%=o.name%}", :download => "{%=o.name%}", :"data-gallery" => !"{%= o.image ? 'true' : '' %}".html_safe.empty? && ''} {%=o.name%}
+        {% } else { %}
+        %span {%=o.name%}
+        {% } %}
     %td
       %span.size {%=formatFileSize(o.size)%}
     %td
+      {% if (o.delete_url) { %}
       %button.btn.btn-danger.delete{"data-type" => "DELETE", "data-url" => "{%=o.delete_url%}", "data-object_id" => "{%=o.id%}", "data-confirmation" => "Are you sure?", "data-xhr-fields" => !"{% if (o.delete_with_credentials) { %} {'withCredentials': true} {% } %}".blank? && "{% if (o.delete_with_credentials) { %} {'withCredentials': true} {% } %}"}
         %i.icon-trash.icon-white
         %span Delete
       %input.toggle{:name => "delete", :type => "checkbox", :value => "1"}
+      {% } else { %}
+      %button.btn.btn-warning.cancel
+        %i.glyphicon.glyphicon-ban-circle
+        %span Cancel
+      {% } %}
+          

data/lib/generators/s3_cors_fileupload/install/templates/views/haml/index.html.haml

@@ -1,4 +1,4 @@
-= stylesheet_link_tag '//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css'
+= stylesheet_link_tag '//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css'
 
 %div{:style => 'padding: 10px;'}
   %h2 Upload file(s)

data/lib/s3_cors_fileupload.rb

@@ -1,2 +1,8 @@
 require 's3_cors_fileupload/version'
 require 's3_cors_fileupload/rails'
+
+module S3CorsFileupload
+  def self.active_record_protected_attributes?
+    @active_record_protected_attributes ||= ActiveRecord::VERSION::STRING.to_f < 4.0 || !!defined?(ProtectedAttributes)
+  end
+end

data/lib/s3_cors_fileupload/rails.rb

@@ -1,6 +1,6 @@
 if defined?(::Rails)
   require 's3_cors_fileupload/rails/config'
-  require 's3_cors_fileupload/rails/engine' if ::Rails.version >= '3.1'
+  require 's3_cors_fileupload/rails/engine' if defined? ::Rails::Engine
   require 's3_cors_fileupload/rails/policy_helper'
   require 's3_cors_fileupload/rails/form_helper'
 

data/lib/s3_cors_fileupload/rails/form_helper.rb

@@ -14,6 +14,9 @@ module S3CorsFileupload
     # :bucket           The name of the bucket on S3 you wish for the files to be uploaded to.
     #                   Defaults to `Config.bucket` (read from the yaml config file).
     #
+    # :secure           Dictates whether the form action URL will be pointing to a secure URL or not.
+    #                   Defaults to `true`.
+    #
     # Any other key creates standard HTML options for the form tag.
     def s3_cors_fileupload_form_tag(options = {}, &block)
       policy_helper = PolicyHelper.new(options)
@@ -28,9 +31,9 @@ module S3CorsFileupload
         :success_action_status => '201'
       }
       # assume that all of the non-documented keys are 
-      _html_options = options.reject { |key, val| [:access_key_id, :acl, :max_file_size, :bucket].include?(key) }
+      _html_options = options.reject { |key, val| [:access_key_id, :acl, :max_file_size, :bucket, :secure].include?(key) }
       # return the form html
-      construct_form_html(hidden_form_fields, policy_helper.options[:bucket], _html_options,  &block)
+      construct_form_html(hidden_form_fields, policy_helper.options[:bucket], options[:secure], _html_options,  &block)
     end
 
     alias_method :s3_cors_fileupload_form, :s3_cors_fileupload_form_tag
@@ -42,31 +45,31 @@ module S3CorsFileupload
     end
 
     # hidden fields argument should be a hash of key value pairs (values may be blank if desired)
-    def construct_form_html(hidden_fields, bucket, html_options = {}, &block)
+    def construct_form_html(hidden_fields, bucket, secure = true, html_options = {}, &block)
       # now build the html for the form
-      form_tag("https://#{bucket}.s3.amazonaws.com", build_form_options(html_options)) do
+      form_tag(secure == false ? "http://#{bucket}.s3.amazonaws.com" : "https://#{bucket}.s3.amazonaws.com", build_form_options(html_options)) do
         hidden_fields.map do |name, value|
           hidden_field_tag(name, value)
         end.join.html_safe + "
         <!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->  
         <div class='row fileupload-buttonbar'>
-          <div class='span7'>
+          <div class='col-lg-7'>
             <span class='btn btn-success fileinput-button'>
-              <i class='icon-plus icon-white'></i>
+              <i class='glyphicon glyphicon-plus'></i>
               <span>Add files...</span>
               ".html_safe +
               file_field_tag(:file, :multiple => true) + "
             </span>
             <button type='submit' class='btn btn-primary start'>
-              <i class='icon-upload icon-white'></i>
+              <i class='glyphicon glyphicon-upload'></i>
               <span>Start upload</span>
             </button>
             <button type='reset' class='btn btn-warning cancel'>
-              <i class='icon-ban-circle icon-white'></i>
+              <i class='glyphicon glyphicon-ban-circle'></i>
               <span>Cancel upload</span>
             </button>
             <button type='button' class='btn btn-danger delete'>
-              <i class='icon-trash icon-white'></i>
+              <i class='glyphicon glyphicon-trash'></i>
               <span>Delete</span>
             </button>
             <input type='checkbox' class='toggle'></input>
@@ -74,10 +77,10 @@ module S3CorsFileupload
 	          <span class='fileupload-loading'></span>
           </div>
           <!-- The global progress information -->
-          <div class='span5 fileupload-progress fade'>
+          <div class='col-lg-5 fileupload-progress fade'>
             <!-- The global progress bar -->
-            <div class='progress progress-success progress-striped active' role='progressbar' aria-valuemin='0' aria-valuemax='100'>
-              <div class='bar' style='width: 0%;'></div>
+            <div class='progress progress-striped active' role='progressbar' aria-valuemin='0' aria-valuemax='100'>
+              <div class='progress-bar progress-bar-success' style='width: 0%;'></div>
             </div>
             <!-- The extended global progress information -->
             <div class='progress-extended'>&nbsp;</div>

data/lib/s3_cors_fileupload/version.rb

@@ -1,5 +1,5 @@
 module S3CorsFileupload
-  VERSION = '0.2.1'
-  JQUERY_FILEUPLOAD_VERSION = '5.32.0'
-  JQUERY_FILEUPLOAD_UI_VERSION = '8.5.0'
+  VERSION = '0.3.0'
+  JQUERY_FILEUPLOAD_VERSION = '5.32.6'
+  JQUERY_FILEUPLOAD_UI_VERSION = '8.8.5'
 end

data/s3_cors_fileupload.gemspec

@@ -6,7 +6,7 @@ Gem::Specification.new do |s|
   s.version     = S3CorsFileupload::VERSION
   s.platform    = Gem::Platform::RUBY
   s.authors     = ["Ben Atkins"]
-  s.email       = ["benatkins@fullbridge.com"]
+  s.email       = ["batkinz@gmail.com"]
   s.homepage    = "http://github.com/fullbridge-batkins/s3_cors_fileupload"
   s.summary     = "File uploads for Rails ~> 3.1 to AWS-S3 via CORS using the jQuery-File-Upload script"
   s.description = "Provides file uploads for Rails ~> 3.1 to AWS-S3 via CORS using the jQuery-File-Upload javascript"
@@ -23,10 +23,9 @@ Gem::Specification.new do |s|
   s.extra_rdoc_files = %w(README.md CHANGELOG.md LICENSE.txt)
   s.rdoc_options = %w(--charset=UTF-8)
 
-  s.add_dependency('rails', ['~> 3.1'])
+  s.add_dependency('rails', ['>= 3.1', '< 5.0'])
   s.add_dependency('multi_json', ['~> 1.0'])
-  s.add_dependency('jquery-rails', ['>= 2.0'])
-  s.add_dependency('aws-s3', ['~> 0.6']) # :require => 'aws/s3'
+  s.add_dependency('aws-s3', ['~> 0.6'])
 
   s.add_development_dependency('rake', ['>= 0.8.7'])
   s.add_development_dependency('bundler', ['>= 0'])

data/spec/dummy/Rakefile

@@ -1,4 +1,3 @@
-#!/usr/bin/env rake
 # Add your own tasks in files placed in lib/tasks ending in .rake,
 # for example lib/tasks/capistrano.rake, and they will automatically be available to Rake.
 

data/spec/dummy/app/assets/javascripts/application.js

@@ -5,11 +5,12 @@
 // or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
 //
 // It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
-// the compiled file.
+// compiled file.
 //
-// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
-// GO AFTER THE REQUIRES BELOW.
+// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
+// about supported directives.
 //
 //= require jquery
 //= require jquery_ujs
+//= require s3_cors_fileupload
 //= require_tree .

data/spec/dummy/app/assets/javascripts/s3_uploads.js

@@ -0,0 +1,92 @@
+/*
+ * s3-cors-file-upload
+ * http://github.com/fullbridge-batkins/s3_cors_fileupload
+ *
+ * Copyright 2013, Ben Atkins
+ * http://batkins.net
+ *
+ * Licensed under the MIT license:
+ * http://www.opensource.org/licenses/MIT
+ */
+
+// This global variable will hold s3 file credentials for files until it's time to submit them
+var s3_upload_hash = {};
+
+$(function() {
+  // hit the controller for info when the file comes in
+  $('#fileupload').bind('fileuploadadd', function (e, data) {
+      var content_type = data.files[0].type;
+      var file_name = data.files[0].name;
+
+      $.getJSON('/source_files/generate_key.json', {filename: file_name}, function(data) {
+        // Now that we have our data, we add it to the global s3_upload_hash so that it can be
+        // accessed (in the fileuploadsubmit callback) prior to being submitted
+        s3_upload_hash[file_name] = {
+                                      key: data.key,
+                                      content_type: content_type
+                                    };
+      });
+  });
+
+  // this gets triggered right before a file is about to be sent (and have their form action submitted)
+  $('#fileupload').bind('fileuploadsubmit', function (e, data) {
+      var file_name = data.files[0].name;
+      // transfer the data from the upload-template .form hidden fields to the real form's hidden fields
+      var form = $('#fileupload');
+      form.find('input[name=key]').val(s3_upload_hash[file_name]['key']);
+      form.find('input[name=Content-Type]').val(s3_upload_hash[file_name]['content_type']);
+      delete s3_upload_hash[file_name];
+  });
+
+  $('#fileupload').bind('fileuploaddone', function (e, data) {
+      // the response will be XML, and can be accessed by calling `data.result`
+      //
+      // Here is an example of what the XML will look like coming back from S3:
+      //  <PostResponse>
+      //    <Location>https://bucket-name.s3.amazonaws.com/uploads%2F3ducks.jpg</Location>
+      //    <Bucket>bucket-name</Bucket>
+      //    <Key>uploads/3ducks.jpg</Key>
+      //    <ETag>"c7902ef289687931f34f92b65afda320"</ETag>
+      //  </PostResponse>
+
+      $.post('/source_files.json',
+          {
+            'source_file[url]': $(data.result).find('Location').text(),
+            'source_file[bucket]': $(data.result).find('Bucket').text(),
+            'source_file[key]': $(data.result).find('Key').text(),
+            authenticity_token: $('meta[name=csrf-token]').attr('content')
+          },
+          function(data) {
+            $('#upload_files tbody').append(tmpl('template-uploaded', data));
+          },
+          'json'
+      );
+   });
+
+   $('#fileupload').bind('fileuploadcompleted', function (e, data) {
+      // remove the downloaded templates, since in the above function we put our own custom 'template-uploaded' onto the list instead
+      data.context.remove();
+   });
+
+   $('#fileupload').bind('fileuploaddestroyed', function (e, data) {
+      if (!data.url) // sometimes this callback seems to get triggered a couple times, and has null data after the first time
+        return null;
+
+      // remove the table row containing the source file information from the page
+      $('#source_file_' + data.object_id).remove();
+   });
+
+});
+
+// used for displaying approximate file size on the file listing index.
+// functionality mimics what the jQuery-File-Upload script does.
+function formatFileSize(bytes) {
+    if (typeof bytes !== 'number')
+      return '';
+    else if (bytes >= 1000000000)
+      return (bytes / 1000000000).toFixed(2) + ' GB';
+    else if (bytes >= 1000000)
+      return (bytes / 1000000).toFixed(2) + ' MB';
+    else
+      return (bytes / 1000).toFixed(2) + ' KB';
+}

data/spec/dummy/app/assets/stylesheets/application.css

@@ -9,5 +9,6 @@
  * compiled file, but it's generally better to create a new file per style scope.
  *
  *= require_self
+ *= require jquery.fileupload-ui
  *= require_tree .
  */

data/spec/dummy/app/controllers/application_controller.rb

@@ -1,3 +1,5 @@
 class ApplicationController < ActionController::Base
-  protect_from_forgery
+  # Prevent CSRF attacks by raising an exception.
+  # For APIs, you may want to use :null_session instead.
+  protect_from_forgery with: :exception
 end

data/spec/dummy/app/controllers/s3_uploads_controller.rb

@@ -0,0 +1,56 @@
+class S3UploadsController < ApplicationController
+  # GET /source_files
+  # GET /source_files.json
+  def index
+    @source_files = SourceFile.all
+
+    respond_to do |format|
+      format.html # index.html.erb
+      format.json { render json: @source_files.map(&:to_jq_upload) }
+    end
+  end
+
+  # POST /source_files
+  # POST /source_files.json
+  def create
+    # this line allows for compatibility with `ProtectedAttributes` or `StrongParameters`
+    parameters = S3CorsFileupload.active_record_protected_attributes? ? params[:source_file] : params.require(:source_file).permit(:url, :bucket, :key)
+    @source_file = SourceFile.new(parameters)
+    respond_to do |format|
+      if @source_file.save
+        format.html {
+          render :json => @source_file.to_jq_upload,
+          :content_type => 'text/html',
+          :layout => false
+        }
+        format.json { render json: @source_file.to_jq_upload, status: :created }
+      else
+        format.html { render action: "new" }
+        format.json { render json: @source_file.errors, status: :unprocessable_entity }
+      end
+    end
+  end
+
+  # DELETE /source_files/1
+  # DELETE /source_files/1.json
+  def destroy
+    @source_file = SourceFile.find(params[:id])
+    @source_file.destroy
+
+    respond_to do |format|
+      format.html { redirect_to source_files_url }
+      format.json { head :no_content }
+      format.xml { head :no_content }
+    end
+  end
+
+  # used for s3_uploader
+  def generate_key
+    uid = SecureRandom.uuid.gsub(/-/,'')
+
+    render json: {
+      key: "uploads/#{uid}/#{params[:filename]}",
+      success_action_redirect: "/"
+    }
+  end
+end

data/spec/dummy/app/models/source_file.rb

@@ -0,0 +1,54 @@
+require 'aws/s3'
+
+class SourceFile < ActiveRecord::Base
+  # This line can be removed for Rails 4 apps that are using Strong Parameters
+  attr_accessible :url, :bucket, :key if S3CorsFileupload.active_record_protected_attributes?
+
+  validates_presence_of :file_name, :file_content_type, :file_size, :key, :bucket
+
+  before_validation(:on => :create) do
+    self.file_name = key.split('/').last if key
+    # for some reason, the response from AWS seems to escape the slashes in the keys, this line will unescape the slash
+    self.url = url.gsub(/%2F/, '/') if url
+    self.file_size ||= s3_object.size rescue nil
+    self.file_content_type ||= s3_object.content_type rescue nil
+  end
+  # make all attributes readonly after creating the record (not sure we need this?)
+  after_create { readonly! }
+  # cleanup; destroy corresponding file on S3
+  after_destroy { s3_object.try(:delete) }
+
+  def to_jq_upload
+    { 
+      'id' => id,
+      'name' => file_name,
+      'size' => file_size,
+      'url' => url,
+      'image' => self.is_image?,
+      'delete_url' => Rails.application.routes.url_helpers.source_file_path(self, :format => :json)
+    }
+  end
+
+  def is_image?
+    !!file_content_type.try(:match, /image/)
+  end
+
+  #---- start S3 related methods -----
+  def s3_object
+    @s3_object ||= AWS::S3::S3Object.find(key, bucket) if self.class.open_aws && key
+  rescue
+    nil
+  end
+
+  def self.open_aws
+    unless @aws_connected
+      AWS::S3::Base.establish_connection!(
+        :access_key_id     => S3CorsFileupload::Config.access_key_id,
+        :secret_access_key => S3CorsFileupload::Config.secret_access_key
+      )
+    end
+    @aws_connected ||= AWS::S3::Base.connected?
+  end
+  #---- end S3 related methods -----
+
+end