FileColumn

画像ファイルなどのファイルの扱いが簡単にできるFileColumnを紹介します。
ベースとするプロジェクトを「i18nによる日本語化」で使用したproj001とします。


１．file_columnのインストール

コマンド プロンプト


D:\Rails_Projects\proj001>ruby script/plugin install http://filecolumn.googlecode.com/svn/tags/file_column

 ./CHANGELOG

 ./README

 ./Rakefile

 ./TODO

 ./init.rb

 ./lib/file_column.rb

 ./lib/file_column_helper.rb

 ./lib/file_compat.rb

 ./lib/magick_file_column.rb

 ./lib/rails_file_column.rb

 ./lib/test_case.rb

 ./lib/validations.rb

 ./test/abstract_unit.rb

 ./test/connection.rb

 ./test/file_column_helper_test.rb

 ./test/file_column_test.rb

 ./test/fixtures/entry.rb

 ./test/fixtures/invalid-image.jpg

 ./test/fixtures/kerb.jpg

 ./test/fixtures/mysql.sql

 ./test/fixtures/schema.rb

 ./test/fixtures/skanthak.png

 ./test/magick_test.rb

 ./test/magick_view_only_test.rb


２．項目の追加
　　NetBeansで［生成］を選択します。
　　　ジェネレータ(G):migration
　　　引数(A)：add_image_to_addresses image:string
    



３．マイグレーションファイルの確認
　　db/migrate/yyyymmddhhmmss_add_image_to_addresses.rbを確認してみましょう。
　　項目imageが追加されています。
/db/migrate/yyyymmddhhmmss_add_image_to_addresses.rb


class AddImageToAddresses < ActiveRecord::Migration

  def self.up

    add_column :addresses, :image, :string

  end
  def self.down

    remove_column :addresses, :image

  end

end


４．マイグレーションの実行
　　［データベースマイグレーション］より［現在のバージョンへ］を選択します。


５．モデルの修正
/app/models/address.rb


class Address < ActiveRecord::Base

  file_column :image

  

  validates_presence_of :namae

  validates_uniqueness_of :namae

  validates_length_of :namae, :maximum => 12

  validates_presence_of :yubin

  validates_length_of :yubin, :within => 3..8

  validates_presence_of :jusho

  validates_presence_of :denwa

  validates_format_of :denwa, :with => /\d{3}-\d{3}-\d{4}|\d{4}-\d{2}-\d{4}/

end


６．ビューの修正
追加した項目imageをそれぞれのビュープログラムに埋め込みます。


/app/views/index.html.erb


<r/>

<h1><%= t('label.Listing_addresses') %></h1>




<table>

　<tr>

　　<th><%= t('label.Namae') %></th>

　　<th><%= t('label.Yubin') %></th>

　　<th><%= t('label.Jusho') %></th>

　　<th><%= t('label.Denwa') %></th>

　　<th><%= t('label.Image') %></th>

　</tr>




<% for address in @addresses %>

　<tr>

　　<td><%=h address.namae %></td>

　　<td><%=h address.yubin %></td>

　　<td><%=h address.jusho %></td>

　　<td><%=h address.denwa %></td>

　　<td><%=h address.image %></td>

　　<td><%= link_to t('link.Show'), address %></td>

　　<td><%= link_to t('link.Edit'), edit_address_path(address) %></td>

　　<td><%= link_to t('link.Destroy'), address,

　　　　　　:confirm => t('label.Are_you_sure?'), :method => :delete %></td>

　</tr>

<% end %>

</table>




<div class="pagination_link">

　<%= will_paginate @addresses, :prev_label => "« 前", :next_label => "次 »" %>

</div>




<br />




<%= link_to t('link.New_address'), new_address_path %>




/app/views/new.html.erb


<br/>

<h1><%= t('label.New_address') %></h1>




<% form_for(@address, :html => {:multipart => true}) do |f| %>

　<%= f.error_messages %>




　<p>

　　<%= f.label t('label.Namae') %><br />

　　<%= f.text_field :namae %>

　</p>

　<p>

　　<%= f.label t('label.Yubin') %><br />

　　<%= f.text_field :yubin %>

　</p>

　<p>

　　<%= f.label t('label.Jusho') %><br />

　　<%= f.text_field :jusho %>

　</p>

　<p>

　　<%= f.label t('label.Denwa') %><br />

　　<%= f.text_field :denwa %>

　</p>

　<p>

　　<%= f.label t('label.Image') %><br />

　　<%= f.file_field :image %>

　</p>




　<p>

　　<%= f.submit t('button.Create') %>

　</p>

<% end %>




<%= link_to t('link.Back'), addresses_path %>




/app/views/edit.html.erb


<br/>

<h1><%= t('label.Editing_address', :html => {:multipart => true}) %></h1>




<% form_for(@address) do |f| %>

　<%= f.error_messages %>




　<p>

　　<%= f.label t('label.Namae') %><br />

　　<%= f.text_field :namae %>

　</p>

　<p>

　　<%= f.label t('label.Yubin') %><br />

　　<%= f.text_field :yubin %>

　</p>

　<p>

　　<%= f.label t('label.Jusho') %><br />

　　<%= f.text_field :jusho %>

　</p>

　<p>

　　<%= f.label t('label.Denwa') %><br />

　　<%= f.text_field :denwa %>

　</p>

　<p>

　　<%= f.label t('label.Image') %><br />

　　<%= f.file_field :image %>

　</p>




　<p>

　　<%= f.submit t('button.Update') %>

　</p>

<% end %>




<%= link_to t('link.Show', @address %> |

<%= link_to t('link.Back'), addresses_path %>




/app/views/show.html.erb


<p>

　<b><%= t('label.Namae') %>:</b>

　<%=h @address.namae %>

</p>




<p>

　<b><%= t('label.Yubin') %>:</b>

　<%=h @address.yubin %>

</p>




<p>

　<b><%= t('label.Jusho') %>:</b>

　<%=h @address.jusho %>

</p>




<p>

　<b><%= t('label.Denwa') %>:</b>

　<%=h @address.denwa %>

</p>




<p>

　<b><%= t('label.Image') %>:</b>

　<%=h @address.image %>

</p>




<%= link_to t('link.Edit'), edit_address_path(@address) %> |

<%= link_to t('link.Back'), addresses_path %>

７．file_columnプラグインプログラムの修正
これで実行をするとNameErrorが発生します。
    

これの対処法は、http://d.hatena.ne.jp/aki-s-119/20081201/1228168584に詳しいですが、
次の部分を書き換えることでエラーは回避できます。

/vender/plugins/file_column/lib/file_column.rb


require 'fileutils'

require 'tempfile'

require 'magick_file_column'
module FileColumn # :nodoc:

    ：

    ：

    def file_column(attr, options={})

      options = DEFAULT_OPTIONS.merge(options) if options

      

      my_options = FileColumn::init_options(options, 

                                            self.name.to_s.underscore,

                                            attr.to_s)

    ：

    ：

    end

    ：

    ：

end

８．動作確認
　　実際にプログラムを実行してみます。
　　ファイル名が英字の場合はうまくアップロードされますが、漢字の場合うまくいきません。
　　（アップロードするファイル名が「顔写真-画像02.jpg」の場合）
    

　　（アップロードされたファイル名が「___-__02.jpg」となってしまう）
    

９．file_columnプラグインプログラムの修正
日本語のファイル名も使用できるようにするために、ふたたびfile_columnを修正します。

/vender/plugins/file_column/lib/file_column.rb


require 'fileutils'

require 'tempfile'

require 'magick_file_column'
module FileColumn # :nodoc:

    ：

    ：

  

  def self.sanitize_filename(filename)



    filename = File.basename(filename.gsub("\\", "/")) # work-around for IE

    filename.gsub!(/[^\w\.\-\+_]/,"_")

    filename = "_#{filename}" if filename =~ /^\.+$/

    filename = "unnamed" if filename.size == 0

    filename

  end

  

end

１０．動作確認
　　　これで日本語のファイル名も扱うことができます。
　　（アップロードするファイル名が「顔写真-画像03.jpg」の場合）
    

　　（アップロードされたファイル名も「顔写真-画像03.jpg」となる）
    



１１．画像の表示
　　　さらに画像については表示するようにします。
　　　

/app/views/show.html.erb


<p>

　<b><%= t('label.Namae') %>:</b>

　<%=h @address.namae %>

</p>




<p>

　<b><%= t('label.Yubin') %>:</b>

　<%=h @address.yubin %>

</p>




<p>

　<b><%= t('label.Jusho') %>:</b>

　<%=h @address.jusho %>

</p>




<p>

　<b><%= t('label.Denwa') %>:</b>

　<%=h @address.denwa %>

</p>




<p>

　<b><%= t('label.Image') %>:</b>

　<%= image_tag url_for_file_column(@address, :image) %>

</p>




<%= link_to t('link.Edit'), edit_address_path(@address) %> |

<%= link_to t('link.Back'), addresses_path %>

　　（実際に画像を表示した場合）
    


１２．画像の拡大縮小
　　　表示される画像の大きさを制御しましょう。

/app/views/show.html.erb


<p>

　<b><%= t('label.Namae') %>:</b>

　<%=h @address.namae %>

</p>




<p>

　<b><%= t('label.Yubin') %>:</b>

　<%=h @address.yubin %>

</p>




<p>

　<b><%= t('label.Jusho') %>:</b>

　<%=h @address.jusho %>

</p>




<p>

　<b><%= t('label.Denwa') %>:</b>

　<%=h @address.denwa %>

</p>




<p>

　<b><%= t('label.Image') %>:</b>

　<%= image_tag url_for_file_column(@address, :image), :size=>"50x50" %>

</p>




<%= link_to t('link.Edit'), edit_address_path(@address) %> |

<%= link_to t('link.Back'), addresses_path %>


　　なお、ここで:size=>"50x50"を:width=>"50"や:hight=>"50"と書くことができます。
　　これにより横幅を揃えたり、高さを揃えたりすることができます。

　　（縮小された画像を表示）