Wysihatエディタを使う（続き）

カスタマイズの仕方

なんとなくわかってきた。script/generate wysihatで生成されるwysihat_engine_pack.jsはいい感じに圧縮されているので見る気はしないのと、あとカスタマイズできないじゃんと思っていましたが、オプションでソース出力もしてくれるらしい。
がんばってgeneratorのソース見てみたけど、--helpでオプション見れるんだね。

$ script/generate wysihat --help
$ script/generate wysihat --include-js-src

wysihat_engine_pack.js はfacebox + wysihat + wysihat_engineということらしい。なので、こいつらを読み込む場合はこうする

<%= javascript_include_tag :defaults, 'facebox', 'wysihat', 'wysihat_engine' %>

faceboxをインクルードするのを忘れててちょっと困った。

出力されたものをみていこう

まず画像。facebox（ポップアップ画面のやつかな）とwysihatのやつ。wysihatの方はツールバーのアイコンです。
css/でwysihatツールバーのアイコンを指定していた（これがわからなくて困ってました。。）。ヘルパーメソッドのwysihat_editorに配列でツールバーのアイテムを渡せるんだけど、全部びっくりマークアイコンになっていたのはそうゆうことだったのか、というのがここを見るとわかる。
カスタマイズしている部分は、wysihat_engine.jsかな。

function wysiHatify(tag_id, buttons){

tag_idはたぶんテキストエリアのid。buttonsはツールバーのボタンたちだと思われる。

buttons.each(function(button){
  switch(button.toLowerCase()){
    case 'image':
      toolbar.addButton({label : button.gsub('_','-').camelize().capitalize()
        , handler: function(editor) { return editor.faceboxFile(editor); }});
      (略)
    default:
      toolbar.addButton({label : button.gsub('_','-').camelize().capitalize()});
  }
});

buttons.eachがrubyっぽくていい感じ。
ハンドラをここで設定している模様。ただし、ここでは主にfaceboxを使った拡張機能のハンドラ設定しかしていないので、たとえばundo／redoなどのボタンはdefaultの方に流れていくはず。どこでハンドラを登録しているのか。

わかった

wysihat.jsのbuttonHandlerメソッドがキモだった。

  function buttonHandler(name, options) {
    if (options.handler)
      return options.handler;
    else if (options.get('handler'))
      return options.get('handler');
    else
      return function(editor) { editor.execCommand(name); };
  }

toolbar.addButtonメソッドでハンドラが設定されている場合にはそれが使われる。ハンドラが未設定の場合には、デフォルトのハンドラ（elseのところ）が用意される。自前ボタンを用意するには、wysihat_editorメソッドの呼び出しとwysihat_engine.jsの拡張が必要になりそう（ついでに、ボタンアイコンを用意してwysihat.cssも更新する）

続きは明日。

ファイルアップロード

自前で

作ってみる。もちろんwebを参考にするけど。なんかディレクトリを深く深く掘っていくところとか、あんまり気にくわないので。

プロジェクト
$ rails uploader
$ script/generate scaffold picture title:string uri:string

ビュー

<% form_for @picture, :html => {:multipart => true}) do |f| %>
(略)
<%= file_field :upload, 'file' %>
(略)
<% end %>

コントローラ

uploaded_file = params[:upload]
File.open("xxxx.jpg", "wb") do |file|
  file.write upload_file[:file].read
end

こんな感じでなんか動きました

参考にしました

WysiHatを使う続き

ImageMagickとRMagickをインストールする

$ sudo apt-get update
$ sudo apt-get install imagemagick libmagick9-dev
$ sudo gem install rmagick

アップデートしないとrmagickが入らないらしいので、apt-get update しました。

で、

できました。Hatena.vim使ってるから画像をアップロードできませんが、動きはこんな感じ。

  • カスタマイズ可能なように初期インターフェースはかなりシンプルだと思っていたwysihat-engineですが、なにげに結構いじれる。(ボールド)(イタリック)(アンダーライン)(取り消し線)(左寄せ／右寄せ／中央寄せ)(箇条書き／段落)(アンドゥ／リドゥ)(リンク)(ソース＜html＞の直接編集)(画像アップロード／貼り付け)
  • ためしにとかやってみたけどうまいことエスケープしてくれた。おそらくDBへの保存時になんかやってるっぽい
  • 画像はpublic/system/files/:id/original/(ファイル名)として保存される。ってことは日本語名はだめか？
  • 記事を消しても画像は消してくれない。自分で管理しないとだめなんだろうね
  • アップロード画面には登録されている画像の一覧がでてくる模様。いっぱいになることを考慮しているのかな？
  • アップロード画面で簡易的に画像の管理ができるっぽい。ここで画像を削除した場合にはファイルごと消えるよ
  • ちなみに、DB上ではwysihat_filesテーブルという名前で管理されているよ

つまり、画像自体は記事とリンクしているわけではないため、どの記事からでも参照することができる。その代わりに画像の管理は自分でやってあげないといけないっていうわけです（きっと）。

参考にしました

37signals製WYSIWYGエディタを使ってみる

wysihat-engineプラグインを使ってみる

rails用のプラグインとして、wysihat-engineというものを使うと、WysiHatが簡単に導入できるらしい。が、ぐぐっても情報が少ないので、備忘録としてメモ
とは言え、基本的にはhttp://github.com/80beans/wysihat-engine/に書いてある通りにやっていけばできるはず。「はず」というのはその通りにやらなかったため。そのせいでいろいろめんどうな手順を踏んだ（と思う）

script/plugin でプラグインをインストール（gemって全体に影響するからなんか好きじゃない）

$ script/plugin install git://github.com/80beans/wysihat-engine/

生成

$ script/generate wysihat
$ rake db:migrate

なんかが作られる。
javascriptとstylesheetはとりあえずapplication.html.erbで読み込むようにしといた。

<%= javascript_include_tag :defaults, 'wysihat_engine_pack' %>
<%= stylesheet_link_tag 'facebox', 'wysihat' %>

最後にビュー。f.wysihat_editor というメソッドが使えるようになるらしい

<% form_for(@model) do |f| %>
  <%= f.wysihat_editor :content %>
<% end %>

これでできるはず
だったけど、wysihat_editorがないとか言われた。やっぱりgemでインストールしないとダメなのかな。

対策１

無理やりrequireする。どうもwysihat_editorメソッドが定義されているプラグインフォルダのlib/wysihat_engine.rbが読み込まれていない模様。プラグインフォルダ下にinit.rbを作って無理やりrequireしてみた。

require 'wysihat-engine'

だめ。paperclipをrequireできないとか言われた。paperclipっていうのは画像アップロード用のプラグインらしい。ImageMagickもいるとか。めんどくさい。。

対策２
$ script/plugin install git://github.com/thoughtbot/paperclip.git
$ script/server

動いた！でも、ImageMagick入れてないからファイルのアップロードはできないんだろうなぁ。それは明日やろう。終わり。

Ubuntu9.10新規インストール

やりなおし

VMWarePlayer3 に Ubuntu9.10 を入れ直す。とりあえずいろいろ作業できるところまで持っていく

まずは

さっそく awesome を入れる。最近お気に入りのウインドウマネージャ（使いこなしてないけど）

$ sudo apt-get install awesome

vim のカスタマイズ（その１）

vimではてなを更新できるように。

$ sudo apt-get install vim-gnome
$ sudo apt-get install git-core
$ git clone git://github.com/motemen/hatena-vim.git 
$ mkdir ~/.vim
$ cp -r hatena-vim/ ~/.vim

~/.vimrcをはてな用にいじくる

 " for Hatena.vim
 :set runtimepath+=$HOME/.vim/hatena-vim
 :let g:hatena_user='nukky_1981'

railsとかのインストール

前に自分で書いた記事を見つつ gem と ruby と rails をインストール

vimのカスタマイズ（その２）

vim-rubyをインストール（これはgemから）

$ sudo gem install vim-ruby
$ vim-ruby-install.rb

あとはがんばってvimスクリプトを~/.vimにぶちこむ。以下、いれたもの

vimのカスタマイズ（その３）

vimrcをいじくって使いやすく。いろいろなところを見つつ最低限の変更のみ

" for Hatena.vim
set runtimepath+=$HOME/.vim/hatena-vim
let g:hatena_user='nukky_1981'

" NERD_commenter.vim
map c ,c
let NERDSpaceDelims=1

" vim-ruby.vim
imap  

"Rubyのオムニ補完を設定(ft-ruby-omni)
 :setlocal omnifunc=syntaxcomplete#Complete
let g:rubycomplete_buffer_loading = 1
let g:rubycomplete_classes_in_global = 1
let g:rubycomplete_rails = 1

"基本
set number
set statusline=%F%m%r%h%w\ [FORMAT=%{&ff}]\ [TYPE=%Y]\ [POS=%l,%v][%p%%]\ [LINES=%L]
set laststatus=2
syntax on
filetype indent on
filetype plugin on

$HOME/.vim/ftplugin/ruby.vimに追記

set expandtab
set tabstop=2 shiftwidth=2 softtabstop=2
set autoindent

refeを使おう

sudo gem install refe

refe.vimというすごいのがあった

$ wget http://rails2u.com/projects/refe.vim/refe.vba
$ vim -c 'so %' refe.vba

参考ページ

Capstranoに挑戦する（２）

Ruby on Rails Ubuntu 作業メモ

続き

Capistranoをインストール
$ sudo gem install capistrano

チェックアウトしたRailsアプリのフォルダで

$ capify .

すると、なんかファイルが作られる
config/deploy.rb を編集すればいいらしい

# リポジトリの場所
set :repository,  "file:///home/{user_name}/svn/rails1/trunk"
# デプロイ先
set :deploy_to, "/home/{user_name}/deploy/test1"
# (たぶん)SSHログイン時のユーザ名
set :user, "{user_name}"
# root権限で実行するか（trueにする意味がよくわからないが、
# デフォルトはtrueっぽい）
set :use_sudo, false
# よくわかってない。passengerの再起動はtask :restartでrestart.txtを置くことで行われるみたい
namespace :deploy do
  [:start, :stop].each do |t|
    desc "#{t} task is a no-op with mod_rails"
    task t, :roles => :app do ; end
  end
  task :restart, :roles => :app, :except => { :no_release => true } do
    run "#{try_sudo} touch #{File.join(current_path,'tmp','restart.txt')}"
  end
end

/etc/apache2/sites-enabled/000-defaultを編集


	DocumentRoot /home/{user_name}/deploy/test1/current/public

初回のみ。deploy先に必要なフォルダを作成している。このデプロイ先のなかでさらに世代管理してくれるらしい
[set :use_sudo, false]しとかないと、作られるフォルダはroot所有となる

$ cap deploy:setup

リポジトリから最新の環境を取得し、さらにproductionモードでマイグレーションまでしてくれる（この作業は:userが行うので、deploy:setupで作ったフォルダがrootさんのものだと、Permission deniedとか言われる。ハマった

$ cap deploy:cold

サーバが起動されるはずですが、なにも設定していないので当然ながら動かず。
手動でApacheを起動する

$ cap deploy:start
$ sudo /etc/init.d/apache2 start

次に、ちょっとだけtrunkの中身を変更、コミットした上で稼働中のサーバにデプロイしてみる
コミットまでは省略

$ cap deploy

再起動までやってくれるみたい。ただ、マイグレーションは行ってくれない（当たり前か）
リポジトリにデータベースファイル（sqlite3使ってるので）も含まれてるので、deployしたところで古いのが消えてしまったようです
-> マイグレーションまでする場合は[cap deploy:cold]、ソースのとっかえだけなら[cap deploy]と覚えるといいそうな

参考ページ（お世話になりました）