file_columnプラグインを使ってみる・前

In: Ruby / Rails| technology

11 2月 2008

ということで、まただいぶ間を空けてしまってますが。
自分の復習の意味も込めて、画像処理周りのことをまとめます。
前回、RMagickはインストールしたので、そこからどうプログラムに落としていくかのメモ。

プロジェクト作成からテーブル設計まで

まずは、おなじみ。サンプル用お題から。
画像の扱いってことなので、画像管理サイトもどきにしてみます。

イメージとしては、mixiのフォトアルバムみたいなの(わからない人ごめんなさい)。
単純に画像が貼り付けられて、その画像についてのコメントが書ける、というレベルのもの。

プロジェクト作成については、コマンドたたくなり、Aptanaなどのエディタを使うなりで適当に。

テーブルはこんなのを作ってみました。
[mysql]
CREATE TABLE `images` (
`id` INTEGER UNSIGNED NOT NULL AUTO_INCREMENT,
`image` VARCHAR(255) NOT NULL,
`comment` VARCHAR(50) NOT NULL,
`created_at` DATETIME,
`updated_at` DATETIME,
PRIMARY KEY (`id`)
)
ENGINE = InnoDB;
[/mysql]

ついでに、created_at・updated_atとやると、登録・更新の際、Railsが勝手に入れてくれるらしいので、一緒に試してみます。

scaffoldからfile_columnプラグインのインストールまで

テーブル設計が終わったので、早速scaffoldしてしまいます。
この辺はもはや説明するまでもないですね。
これまた、適宜自分に一番しっくりしたやり方で作成します。
すると、こーんな感じになるはずですね。

最初の状態

次に、file_columnプラグインをインストールします。
Aptanaだと、Railsプラグインというビューがエディタにあるはずなので、そこから「File Column Plugin」という奴を選択してインストールすればOKです。
コマンドだと、

ruby script/plugin install http://opensvn.csie.org/rails_file_column/plugins/file_column/trunk

ですね。

単純に実行しただけだと、vendor/pluginsの配下にtrunkというディレクトリでできてしまうので、trunkの名前を「file_column」など、わかりやすい名前に変えてしまうとよいでしょう。

実際に使うところまで

プラグインをインストールしたところで、今度は実際に画像がアップロードできるところまで持って行きます。
上の画像の状態だと、アップロードできそうな気配は1ピクセルもありませんので。

まずは、先ほどscaffoldで作った、app/modelsにあるimage.rbに以下のコードを書き加えます。

class Image < ActiveRecord::Base

  # 画像保存処理の設定
  file_column :image,
              :magick => {
                :versions => {
                  :thumb => {:size => "240x320>"}
                }
              }

end

「file_column」でプラグインを適用するカラム名、「magick」でオプションをつけます。
今回は、オリジナル画像を保存するほかに、サムネイル用の画像(:thumb)を保存し、そのときのサイズは「240×320」。「ただし、それより小さい画像はそのままとする」。
という設定になっています。
sizeのところの書き方は、ほかにもいくつかありますので、詳細はここを参考にするとよい感じです。

次に、viewを直します。
_form.rhtmlの5行目。imageカラムのところを変えます。
ついでに、作成日と更新日は消してしまいます。

< %= error_messages_for 'image' %>

<!--[form:image]-->
<p><label for="image_image">Image</label><br />
< %= file_column_field 'image', 'image'  %></p>

<p><label for="image_comment">Comment</label><br />
< %= text_field 'image', 'comment'  %></p>
<!--[eoform:image]-->

続いて、これだけだと、アップロードができないので、new.rhtmlとedit.rhtmlもこう直します。

< %- form_tag ({:action => 'create'}, :multipart => true) do %>
  < %= render :partial => 'form' %>
  < %= submit_tag "Create" %>
< %- end %>
< %- form_tag ({:action => 'update', :id => @image}, :multipart => true) do %>
  < %= render :partial => 'form' %>
  < %= submit_tag 'Edit' %>
< %- end %>

すると、こんな感じに。
ちなみに、プラグインをインストールした後は、きちんとサーバーを再起動させてください。
でないとNoMethodErrorが出ちゃいます。

修正後の状態

おお。いい感じですね^^
ためしに登録してみると、これであっさりとうろくできちゃいます。
さりげなく、登録日も更新日も勝手に入ってくれてますね。

じゃあ、できたものを早速確認してみます。

orz

……orz

確かに画像はアップロードできているらしい(プロジェクトを更新してみると、うまいこと中にファイルが格納されてます)
画像が表示できるところまで行くには、もうちょっと努力が必要みたいです。
長くなってきたので、もうちょっとつづく。

Via:


1 Response to file_columnプラグインを使ってみる・前

Avatar

file_columnプラグインを使ってみる・後 at Katawara.*

2月 13th, 2008 at 23:45:55

[...] Archives « file_columnプラグインを使ってみる・前 [...]

Comment Form

About this blog

ゆるーく、ふわーっと、興味のままに。

自分のかたわらに置いておくメモ代わり。

Photostream