over / easy_swf_upload

Rails plugin for easy embedding swf upload into your project

EasySwfUpload¶ ↑

This plugin will help you to embed swf upload into your project Installation:

script/plugin install git://github.com/over/easy_swf_upload.git
#script/generate easy_swf_upload is called for you automatically

Example¶ ↑

In your application.html.erb include javascripts:

<%= javascript_include_tag :defaults, :swf_upload %>

Important: Plugin doesn’t works without prototype javascript library

Then, use this helper to embed swf upload to your application:

<%= swf_upload_area "Upload images", :url => upload_image_block_path,
        :filetypes => "*.jpg; *.gif",
        :button_style => "font-family: Arial, sans-serif; font-size: 14pt; font-weight:bold;" %>

Advanced options: single_file: true – allow upload only 1 file file_size_limit: “500 MB” – set maximum uploadable file size to 500 MB, default - 40 MB

In your controller:

class PagesController < ApplicationController

# If your rails version < 2.3.0, go this way

  session :cookie_only => false, :only => :upload_image_block # this is very important, don't forget to set it to false

  def upload_image_block
    @image_block = ImageBlock.new(:file => swf_upload_data) # here you can use your favourite plugin to work with attachments

    # use RJS here
    render :update do |page|
      page['blocks'].insert("<div><img src="http://domain.com" /></div>")
    end
  end
end

Also, you need to customize uploading area, i used this css:

<style type="text/css">
  ul.uploadContainer { padding: 10px; }
  ul.uploadContainer li { font-size: 14px; position: relative; height: 22px; }
  ul.uploadContainer li h6 { font-size: 14px; }
  ul.uploadContainer li div.bar { width: 100%; height: 4px; }
  ul.uploadContainer li div.progress { position: absolute; top: 17px; height: 4px; background: #63b534; }
</style>

Or if you use LESS or css_dryer:

ul.uploadContainer {
  padding: 10px;

  li {
    font-size: 14px; position: relative; height: 22px;

    h6 { font-size: 14px; }
    div.bar { width: 100%; height: 4px; }
    div.progress { position: absolute; top: 17px; height: 4px; background: #63b534; }
  }
}

Uploading file template:

<li id="#{id}"><h6>#{title}</h6><div class="bar"><div class="progress" style="width:0"></div></div></li>

Thanks.

Contributors¶ ↑

Jason&nbsp;Murad, Joris&nbsp;Trooster, Ivan&nbsp;Kuchin, Igor&nbsp;Gladkoborodov

Copyright © 2008—2010 Mikhail Tabunov, released under the MIT license