Laravel5入門として画像投稿機能付き掲示板作成を目指す：画像投稿偏(LightBox使用)

[前回](http://qiita.com/banaba0207/items/5f8e6ecb8bc840b3850a)では base64を使用してブラウザに画像を表示していたのですが、画像の保存やlightboxが使えなかったので別のアプローチから攻めてみます。

#方針
- 画像はDBではなく、public/mediaにユニークな名前で保存する
    - その際、サムネイルを生成し、public/media/mini に同名で保存する
- DBには画像の名前（fig_name）と拡張子（fig_mime)を保存する
- 表示する際は、DBから名前を取り出し、サムネイル表示のため public/media/mini を参照する
    - 画像をクリックした場合、lightboxでオリジナルサイズの画像を表示する

#DBの設定

```php.database/migrations/2016_02_10_162119_create_posts_table.php
~~
    public function up()
    {
        Schema::create('posts', function (Blueprint $table) {
            $table->increments('id');
            $table->integer('post_id')->nullable();
            $table->integer('res_id')->nullable();
            $table->string('title');
            $table->string('contributor');
            $table->string('body');
            $table->string('fig_name')->nullable();
            $table->string('fig_mime')->nullable();
            $table->timestamps();
        });
    }
 ~~
}
```

#コントローラー

```php.app/Http/Controllers/PostsController.php
~~
    public function store(PostRequest $request){
        //        Post::create($request->all());
        $this->post = new Post();
        $this->post->fill($request->all());

        $tmp_post_id = $_POST['post_id'];
        if ( $tmp_post_id == '-1') { //新規作成
            $this->post->post_id = Post::max('post_id') + 1;
            $this->post->res_id = 0;
        } else {
            $this->post->post_id = $tmp_post_id;
            $this->post->res_id = Post::where('post_id', '=', $tmp_post_id)->max('res_id') + 1;
        }

        $image = Input::file('data');
        if(!empty($image)) {
            $this->post->fig_mime = $image->getMimeType();
            switch ($this->post->fig_mime) {
            　　case "image/jpeg": $flag = TRUE; break;
            　　case "image/png": $flag = TRUE; break;
            　　case "image/gif": $flag = TRUE; break;
            　　default: $flag = FALSE;
            }
            if ($flag == FALSE) {
                \Flash::error('アップロード可能な画像ファイルは jpg, png, gif のみです。');
                return redirect()->back();
            }
            
            //ユニークな名前を作成
            $name = md5(sha1(uniqid(mt_rand(), true))).'.'.$image->getClientOriginalExtension();
　　　　　　 //オリジナルサイズの画像をpublic/mediaに保存
            $upload = $image->move('media', $name);

            //サムネイルを作成し、public/media/mini に保存
            Image::make('media/'.$name)
                ->resize(400, 400)
                ->save('media/mini/'.$name);
            $this->post->fig_name = $name;
        }

        $this->post->save();
        \Flash::success('記事が投稿されました。');

        if ( $tmp_post_id == '-1') { //新規作成
            return redirect()->route('posts.index');
        }
        return redirect()->route('posts.show', [$tmp_post_id]);

    }
 ~~
}
```

#ビューファイル
- lightboxの導入については[このサイト様](https://narugaro.wordpress.com/2015/07/16/lightbox%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%9F%E3%81%91%E3%81%A9%E3%81%AA%E3%81%8B%E3%81%AA%E3%81%8B%E5%8B%95%E3%81%8B%E3%81%AA%E3%81%8F%E3%81%A6js%E3%81%AE%E8%AA%AD%E3%81%BF%E8%BE%BC%E3%81%BF%E3%82%92b/)を参考にしました。

```PHP.resources/views/posts/one_article.blade.php
~~
        {{-- Image view start --}}
        @if (!empty($post->fig_name))
            <div style="padding:10px">
                <a href="http://localhost/my_bbs/public/media/{{ $post->fig_name}}" 
                    data-lightbox="image-1">
                <img src="http://localhost/my_bbs/public/media/mini/{{ $post->fig_name}}"
                    alt="test" height="400" width="400"/>
                </a>
            </div>
        @endif
        {{-- Image view end --}}
~~
```

- `<a/>`タグ内の `data-lightbox="image-1"`でlightboxを使用しています

#結果
画像クリック前(サムネイル)
![クリック前.png](https://qiita-image-store.s3.amazonaws.com/0/111756/612159b5-3146-216d-9915-070582e31130.png)

画像クリック後（オリジナルサイズ）
![スクリーンショット 2016-02-29 1.23.52.png](https://qiita-image-store.s3.amazonaws.com/0/111756/556c6b50-0a14-6daa-6b0a-8aacb9c45732.png)