Direkt zum Hauptbereich

rails + carrierwavve + plupload = multiple file upload

Right now I am very happy! I finished my work on creating a file upload method in rails for more than one file, altogether handled by rails sessions and as objects.

First I had to learn a bit more about how rails works and I achieved that by reading a lot: books, screencasts and blogs.

In this blog post I like to share what I accomplished, but without the hussle of putting code blocks in here, so watch out for bold formatted text as that is the code.

My goal was to have one site with just the pure option of uploading files.
All file handling would be done behind the scenes by myself logging onto my server. That said you are not going to see any fancy CRUD here.

Lets start then!

And dont forget to versioning your app BEFORE you try something new!
[e.g. git]


> rails g scaffold Photo title:string

Now add carrierwave to you Gemfile and run

> bundle install
>rails g uploader Photo

Alltogether you have model, controller, views and an uploader folder with the PhotoUploader; and run:

> rake db:migrate

And dont forget to download the plupload files and putting them into the right folders, app/assets/.., and test the whole thing first with the plupload custom.html file you will find in the archive downloaded from the official site;
I just used that sample code e.g.


Now we take a look at our model:

# models/photo.rb
class Photo < ActiveRecord::Base
  attr_accessible :title, :title_cache  # access?!
 
  mount_uploader :title, PhotoUploader   # on what column? title!
end



These option differ on what storage, filetypes etc you want:


#uploaders/photo_uploader.rb

storage :file
  

def store_dir
    "uploads/#{model.class.to_s.underscore}"    # its in "root"/public/..
  end


def extension_white_list
     %w(jpg jpeg png zip rar)   # adjust this also in plupload!

end
 

#the next method is for big files not to be copied but moved
 

def move_to_store
    true
end


Well, carrierwave is installed now and will put files on your disk.
We just have to tell rails to work with carrierwave:
(here my full photos_controller.rb with BREAKS!)

# controller/photos_controller.rb
class PhotosController < ApplicationController
  # GET /photos
  # GET /photos.json


  def index
    @photos = Photo.all

    respond_to do |format|
      format.html # index.html.erb
      format.json { render json: @photos }
    end
  end

  # GET /photos/1
  # GET /photos/1.json
  def show
    @photo = Photo.find(params[:id])

    respond_to do |format|
      format.html # show.html.erb
      format.json { render json: @photo }
    end
  end



#BREAK:
#The next part took me a while to understand. The browser sends a GET new #and gets a form to fill out. Thats why the object is created here:


  # GET /photos/new
  # GET /photos/new.json
  def new
    @photo = Photo.new

    respond_to do |format|
      format.html # new.html.erb
      format.json { render json: @photo }
    end
  end

  # GET /photos/1/edit
  def edit
    @photo = Photo.find(params[:id])
  end

  

# BREAK:
# After the user has filled out the form its send automaticly to the browser
# and invokes "create"
. The first and commented block shows just carrierwave
# dealing with the parameter in the url and fetching the right one
# to save the data; also a flash message is printed out.



# POST /photos
# POST /photos.json 

def create

## carrierwave as single   
#    @photo = Photo.new(params[:photo])
#
#    if @photo.save

#     flash[:notice] = "Successfully created photo."
#    redirect_to @photo
# else
#  render :action => 'new'
#end

# BREAK:
# when you mastered carrierwave on its own you should get plupload
# get to work with the following lines.
# IMPORTANT is that plupload has a different url parameter, but see:
# and in this case we just leave the user on the page


    @photo = Photo.new(:title => params[:file])
    @photo.save!
    render :nothing => true
  end








  # PUT /photos/1
  # PUT /photos/1.json
  def update
    @photo = Photo.find(params[:id])

    respond_to do |format|
      if @photo.update_attributes(params[:photo])
        format.html { redirect_to @photo, notice: 'Photo was successfully updated.' }
        format.json { head :no_content }
      else
        format.html { render action: "edit" }
        format.json { render json: @photo.errors, status: :unprocessable_entity }
      end
    end
  end

  # DELETE /photos/1
  # DELETE /photos/1.json
  def destroy
    @photo = Photo.find(params[:id])
    @photo.destroy

    respond_to do |format|
      format.html { redirect_to photos_url }
      format.json { head :no_content }
    end
  end
end



Rails took care of all the other files and for carrierwave you just have to tell the form helper what to do for whom:

# views/photos/_form.html.erb
<%= form_for @photo, :html => {:multipart => true} do |f| %>
  <% if @photo.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@photo.errors.count, "error") %> prohibited this photo from being saved:</h2>

      <ul>
      <% @photo.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <p>
    <label>Photo:</label>
    <%= f.file_field :title %>
    <%= f.hidden_field :title_cache %>
  </p>
  </div>
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %> 


In the views/photos/new.html.erb I put the code for plupload:

# views/new.html.erb

<div id="container">
    <div id="filelist">Photos</div>
    <br />
    <a id="pickfiles" href="javascript:;">[Select files]</a>
    <a id="uploadfiles" href="javascript:;">[Upload files]</a>
</div>


<script type="text/javascript">
// Custom example logic
function $(id) {
    return document.getElementById(id);   
}


var uploader = new plupload.Uploader({
    runtimes : 'gears,html5,flash,silverlight,browserplus',
    browse_button : 'pickfiles',
    container: 'container',
    url : '/photos',
    multipart: true,
    multipart_params: {
     "authenticity_token" : '<%= form_authenticity_token %>'
    },
    filters : [
        {title : "Image files", extensions : "jpg,jpeg,png"},
        {title : "Zip files", extensions : "zip, rar"}
    ]   
   
});


[...] ATTENTION: for the rest look at the custom.html of plupload



That should have done the trick of letting rails handle multiple file uploads.
And if you want to see those files, e.g. pictures:

<%= image_tag(@photo.title_url) if @photo.title? %>



The whole process took me some hours, quite a lot actually,
but it was a good practise getting to know rails too.

Have fun!

PS: try to move the js out of you application.html.erb by putting your "special" js files in subfolders.

# application.html.erb
<%= yield :javascript_includes %>

# new.html.erb
<% content_for :javascript_includes do %>
<%= javascript_include_tag "plupload/plupload.full.js" %>
<%= javascript_include_tag "plupload/plupload.queue.js" %>
<%= javascript_include_tag "plupload/jquery.ui.plupload.js" %>
<% end %>




PPS: to go through all the uploads I made the folders more specific:
def store_dir
    d = Date.today
    "uploads/#{model.class.to_s.underscore}/#{d.to_s(:db)}-#{d.strftime("%A")}"
  end



PPPS: tell capistrano to let the upload folder alone!
how-to-get-capistrano-to-ignore-upload-directories-carrierwave


 

Kommentare

Beliebte Posts aus diesem Blog

Virtuelles Wasser?!

In den letzten Tagen habe ich immer mal wieder etwas mit Rails programmiert und werde mich ebenso heute dem neuen Auftrag "multiple file upload" kümmern. Und weil vieles "Versuch-Irrtum" ist, gucke ich auf dem zweiten Monitor immer Reportagen.

Letztens kam mir "Der große Haushaltscheck" unter die Finger:
ARD Mediathek "Der große Haushaltscheck"

In der Sendung vom 11.3.2013 ging es um unser Trinkwasser.

Jedem sollte klar sein, dass Plastikflaschen nicht die erste Wahl sind, weil man nicht darauf vertrauen kann, dass der Hersteller wirklich "gutes" Plastik nahm (BPA, Phtalate, Benzol, Xylol usw.),
aber das interessante waren die genannten Zahlen in puncto virtuellem Wasser bzw. Wassersparen.

Wasser sparen an und für sich ist ja gut, nur heisst das nicht, dass wir weniger die Klospühlung benutzen sollten, sondern dass wir uns Gedanken machen über das "virtuelle Wasser".

Unsere Kanalisation ist eine Schwemm-Kanalisation, und ohne …

Pflanzsack aus Jute

Nachdem ich die Bücher vom Arche Noah Verein schon vorstellte, möchte ich hier eine Topfalternative zeigen, die obendrein noch dekorativ ist.

Pflanzsäcke Oder "grow bags", wenn man etwas moderner daher komme möchte bzw. mehr Suchergenisse will.

Dabei wollte ich wenig Geld ausgeben, und auch nicht ganz spartan bleiben und den Blumenerdesack dafür nutzen; und bestellte mir 50 kg Jutesäcke für ca. 1,20 EUR/Stück.

Nimmt man den ganzen Sack, wird der Topf schon recht groß, auch wenn man etwas des Materials nach innen oder außen faltet.

Also nahm ich mir die Freiheit und nähte aus einem großen vier kleine und verbrauchte den letzten Rest unserer Erde fürs Umtopfen der Habanero.
Die machte nämlich nun Platz für die sibirische Hauschili und die restlichen von beiden Sorten mischte ich zusammen und stellte sie auf die Fensterbank.

Der Vorteil dieser Art von Töpfen liegt auf der Hand:

sie sind billig im Vergleich zum Volumensie sind dekorativ - wirken rustikalbieten der Pflanze nicht nu…

Kochmesser aus Korea - 11 EUR sehr gut investiert

Schon seit einiger Zeit bin ich bei Messern in Richtung robusterer bzw. einfacherer Stähle am Gucken. Dies Ganze geschah aufgrund eines Zufalls auf Ebay, dass ich ein Windmühlenmesser von Herder erstand, dazu aber später vielleicht mehr.

Hier soll es nun um ein Kochmesser aus Korea gehen, genauer gesagt Südkorea, also nichts vom Bum-Bum Kim ;)

Hier könnt Ihr Bilder einsehen sowie Diskussionen auf englisch:
http://www.kitchenknifeforums.com/showthread.php/9016-Korean-kitchen-knives?p=169860&viewfull=1#post169860

Und hier das Abgebot: http://www.ebay.de/itm/330839166898

Die Stichwörter dabei sind "Cast Iron Forged".

Das Kochmesser selber ist sehr robust bzw. sieht aus als wäre es gerade frisch "ausgeschnitten", denn ich glaube nicht wirklich, dass es geschmiedet wurde als denn geschnitten/herausgeschweißt aus irgendwelchem Müll.

So muss man es eben pflegen, da es sonst rostet, dies verleiht dem Messer aber auch eine umgeheure Schärfe.

Wenn ich nun ein kohlenstoffr…