OmniAICreator/Qiita-1.07M huggingface dataset:
Unity本まとめメモ　2015/4/15時点

#リファレンス
    エンジニアのためのUnity実践リファレンス ～ ゲーム開発にすぐに役立つスクリプト入門
    2015/4/10
    赤坂 玲音
    
    Unity実践技術大全 (GAME DEVELOPER BOOKS)
    2014/3/29
    菊田 剛、 只野 顕二
    
    Unityライブラリ辞典 ランタイム編
    2012/4
    圭吾, 安藤

    Unity 4ライブラリ辞典 エディタ編
    2013/10
    安藤 圭吾

##達人出版会
    UNIBOOK
    日本Androidの会Unity部
    達人出版会

    UNIBOOK2
    日本Androidの会Unity部
    達人出版会

#入門
    Unityで作るスマートフォン3Dゲーム開発講座　Unity4対応
    2014/7/3
    夏木 雅規、 寺園 聖文
    
    Unity5 3Dゲーム開発講座 ユニティちゃんで作る本格アクションゲーム
    2015/2/17
    まつだす、 BATA

    Unity4入門　最新開発環境による簡単3Dゲーム制作
    2015/3/17
    浅野 祐一、 荒川 巧也
    
    Unity4ゲームコーディング 　本当にゲームが作れるスクリプトの書き方
    2015/3/2
    浅野 祐一、 荒川 巧也

    見てわかるUnityゲーム制作超入門
    2014/11/14
    掌田津耶乃
    
    ゲーム開発者になるためのUnity 4徹底ガイド プロが教える効果的なゲーム制作技法
    2015/3/20
    李 在賢、 金 凡峻

#企画・レベルデザイン
    ゲーム作りのはじめかた　Unityで覚える企画からレベルデザインまで
    2014/12/4
    あすな こうじ

#アルゴリズム
    ゲームの作り方　Unityで覚える遊びのアルゴリズム
    2014/2/3
    加藤 政樹

#2D
    Unityではじめる2Dゲーム作り徹底ガイド 　スマートフォンでも遊べる本格ゲーム開発に挑戦
    2015/1/20
    大野功二
    
    Unityによる2Dゲーム開発入門〜プログラミング初心者がゲームを公開する最短コース
    2014/4/11
    中島安彦
    
#GUI
    UnityゲームUI実践ガイド　開発者が知っておきたいGUI構築の新スタンダード
    2015/3/6
    池和田 有輔、 時村 良平
    
#オンライン
    Unityゲーム開発　オンライン3Dアクションゲームの作り方
    2014/12/4
    竹内 大五郎、 石黒 赳彦
    
    オンラインゲームのしくみ　Unityで覚えるネットワークプログラミング
    2014/11/14
    河田 匡稔

#アセット
    Unity4プログラミング アセット活用テクニック
    2015/1/28
    荒川 巧也、 浅野 祐一
    
    Unity Asset PRESS (GAME DEVELOPER BOOKS)
    2015/1/26
    金本融治、 菊田剛

#Oculus
    主婦ゆに!もしも､ﾌﾟﾛｸﾞﾗﾐﾝｸﾞ経験がない文系の主婦がUnityをはじめて1ｹ月でﾐｸさんを出
    2015/2/27
    「主婦ゆに! 」制作委員会
    
    Oculus Riftでオレの嫁と会える本 UnityとMMDモデルで作る初めてのバーチャルリアリティ
    2014/12/16
    桜花一門、 ゆーじ

#Kindle本
    Unity4.6/5.0でつくる 2Dゲーム制作入門
    2015/3/20
    尾関 俊介
    
    Unity初めの一歩: 超初心者のためのUnity入門
    2015/1/12
    薬師寺国安

    Unity4.xまるごと早わかり学習帳: 入門編からUnity Script,Asset StoreのAssetの使い方全部網羅
    2015/2/17
    薬師寺国安

    Unity Scriptの基本+Unity Script Tisp集
    2015/1/9
    薬師寺国安

    ユニティちゃんではじめるUnityゲーム開発 (Think IT Books)
    2015/3/26
    薬師寺 国安

    Unity5 サンプル集: Unity4.6/5対応サンプル集
    2015/3/31
    薬師寺国安
Android を PowerPoint のリモコンにする Office Remote を使ってみた

こんにちは。エクセルソフトの田淵です。

[Microsoft、Android端末をパワポのリモコンにするアプリ「Office Remote」を公開 - ITmedia Mobile](http://www.itmedia.co.jp/mobile/articles/1504/13/news063.html)

こんな記事が紹介されていました。割と講演、セッションなどを行う機会が多いのでネタにもなりますし、触ってみました。

# Office Remote とは

どういうものかは上の記事を見ていただくのが早いですが、Bluetooth 接続した Android 端末で、PC の PowerPoint のスライドをスライドショーで遠隔操作できる。というものです。
(PowerPoint 以外も操作できます)

# インストール

Android 端末は Google Play [Office Remote for Android - Google Play の Android アプリ](https://play.google.com/store/apps/details?id=com.microsoft.office.officeremote) からインストールしましょう。

PC にも [Download Microsoft Office Remote PC Setup from Official Microsoft Download Center](http://www.microsoft.com/en-us/download/details.aspx?id=41149) のインストールが必要なのでインストールしておきましょう。

# 使い方

PC と Android を Bluetooth で接続しておきます。

Office Remote をインストールした PC でスライドショーしたい PowerPoint を開き、追加された OFFICE REMOTE メニューで Turn On します。
![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003240.png)

Android 端末で Office Remote を起動します。

![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003347.png)
PC にはインストール済みなので次へ

![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003422.png)
Bluetooth がオンになっていることを確認し、次へ

![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003452.png)
PC の Office Remote がオンになっていることを確認し、次へ

![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003532.png)
接続する PC を選択します。

![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003607.png)
表示するスライドをタップすると PC 側でスライドショーが開始されます。

![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415003846.png)
スライドショー画面では

- 現在のスライドと、その右下に次のスライド
- 画面中央には経過時間と全体スライド数と現在のスライド番号
- 画面下には「ノート」
- ノートは上下にスワイプでスクロール
- そのノートの表示領域で左にスワイプまたは → をタップするとｳﾞｯと一回振動と共に次のスライドを表示し、右にスワイプまたは ← をタップするとｳﾞｳﾞｯっと二回振動と共に前のスライドを表示
- 画面上部の 日 のアイコンでノートのみ表示をトグル
- 画面上部の 田 のアイコンでスライド一覧を表示
- 画面のスライド領域を長押し＆スワイプで普段は発表者ビューから操作する赤いポインターを表示・操作

などが出来ます。

バイブや次のスライドなどは設定でオンオフできるようです。
![スクリーンショット](http://cdn-ak.f.st-hatena.com/images/fotolife/y/ytabuchi/20150415/20150415005228.png)

プレゼンターの方は便利なので是非使ってみてください。

以上です。
node.js インストール備忘録（windows7）

半年前ほどnode.js環境を放置してたらあっという間にバージョンが古くなっていたので、最新にしようとしたらなにやらエラーが出て、、、もう一度インストールし直した。備忘録のために手順をまとめておく。


#nodistインストール
[公式のインストーラー](https://nodejs.org/download/) を使うのが簡単だけど、バージョン管理ツールを使った方がよいので、そちらを先にインストール。（すでにインストーラーからインストールしちゃった場合は削除）

windowのバージョン管理ツールではnodistが評判よい。

2015/12/22
[nodist のインストーラー](https://github.com/marcelklehr/nodist/releases/)が出たようだ。
pathの設定も全部やってくれるので楽。（次の「nodist の pathを通す」の手順は飛ばしてOK ⇒ 「node.jsインストール」へ）
【参考】[Windowsでnode.jsをバージョン管理する](http://qiita.com/takuyakojima/items/780b3b3133a17cceb175)


手動でやるなら [nodist](https://github.com/marcelklehr/nodist) からzipダウンロード、もしくは git clone git://github.com/marcelklehr/nodist.git する。
ダウンロードした nodist フォルダを任意の場所に置く。


#nodist の pathを通す
1. ［コントロールパネル］⇒［システムとセキュリティ］⇒［システム］⇒［システムの詳細設定］⇒ 「システムのプロパティ」ダイアログが開く
2. ［環境変数］クリック
3. 「システム環境変数」の「path」を選択して［編集］クリック
4. ...\nodist\bin (nodist.cmd があるパス) を追記　（例）C:\nodist\bin;
5. 続いて「システム環境変数」の［新規］クリック
6. 以下3つの変数を追加

・変数名：NODIST_PREFIX ／ 変数値：...\nodist (package.json があるパス) を追加　（例）C:\nodist
・変数名：PATH ／ 変数値：%NODIST_PREFIX%\bin
・変数名：NODE_PATH ／ 変数値：%PATH%\node_modules

Windowsが64bitの場合は以下も追加。
・変数名： NODIST_X64 ／ 変数値：1

コマンドプロンプトを開いて、nodistコマンドが使えることを確認。

```
> nodist -v
v0.5.2
```


#node.jsインストール
nodist依存ファイルのアップデート

```
nodist update
```

node.jsの最新の安定板をインストール

```
nodist stable
```

バージョン確認して表示されれば完了！これで npm も使えるようになります。

```
node -v
```

以下でインストール可能な nodeバージョンが確認できる。

```
nodist dist
```

#その他 nodist コマンド
node.jsの最新バージョンを表示

```
nodist latest
```

指定バージョンのnode.jsをダウンロード

```
nodist + v0.10.32
 or
nodist add v0.10.32
```

指定バージョンの切り替え

```
nodist v0.10.32
 or
nodist use v0.10.32
```

指定バージョンをアンインストール

```
nodist - v0.10.22
 or
nodist rm v0.10.22
```

インストールされているnode.jsの一覧を表示

```
nodist ls
```


#ついでによく使う npm コマンド

npm の最新版のインストール

```
npm install npm
```

npmのアップデート

```
npm update -g npm
```

依存ライブラリやプロジェクトの基本情報を記述する package.jsonを作成する

```
npm init
```

package.jsonに書いてあるライブラリをインストール

```
npm install
```

指定したライブラリをインストール
「-D（--save-dev）」をつけると、インストールしたライブラリが package.jsonに記述される

```
npm install (ライブラリ名) -D
```



こんな記事もあるけど... → [Update npm to v.2.0.x on Windows 7](http://qiita.com/masakinihirota/items/2ef445be20cf9047648b)

おまけに、gem（Rubyに付属しているライブラリ・モジュール）のアップデートはこちら
⇒　[Gemのアップデート](http://qiita.com/t4kmru/items/ac0a61e099f0345186b7)

```
gem i rubygems-update
```

#nodist update でこんなエラーが出たら...

```
> nodist update
Installing latest stable version...
Couldn't fetch 4.0.0: HTTP 404.
Sorry.
Update dependencies...
```

今回は nodist 自体がバージョンアップされていたので、ごそっと入れ替えバージョンアップ。（2015年10月）
1. [nodist](https://github.com/marcelklehr/nodist) からzipダウンロード（または git clone）
2. インストールフォルダの中身をごそっと入れ替え
3. nodist -v でバージョン確認（2015年10月現在 v.0.6.1）
4. nodist update で node 最新バージョンに

＜参考＞
["nodist update"の実行に失敗し、Node.jsがインストールできません](https://teratail.com/questions/16052)
MaterialDesignでよく使うサイズのまとめ

MaterialDesignの特徴の１つとして、全てのコンポーネントが8dp四方のグリッドに沿ってデザインされています。
[MaterialDesign: Layout > Metrics & keylines](http://www.google.com/design/spec/layout/metrics-keylines.html#)

とりわけ余白は重要視されていて、適切な余白を設定することでいろんなことを表現しようとしているようです。

その中でも、特によく使うサイズをまとめてみました。またAndroidアプリ開発では、そのような固定値は`dimens.xml`ファイルにまとめることが推奨されているので、実装例として作ってみました。

```xml
<resources>
    <!-- リストアイテムの余白 -->
    <dimen name="list_item_first_left_margin">16dp</dimen>
    <dimen name="list_item_second_left_margin">72dp</dimen>
    <dimen name="list_item_right_margin">16dp</dimen>

    <!-- リストの余白 -->
    <dimen name="list_vertical_margin">8dp</dimen>

    <!-- リストの高さ -->
    <dimen name="list_sigle_line_height">48dp</dimen>
    <dimen name="list_icon_and_text_height">56dp</dimen>
    <dimen name="list_two_line_height">72dp</dimen>
    <dimen name="list_three_line_height">88dp</dimen>

    <!-- ボタンの大きさ -->
    <dimen name="button_height">36dp</dimen>
    <dimen name="button_minimum_width">88dp</dimen>

    <!-- CardViewのコンテンツの余白 -->
    <dimen name="card_contens_padding">24dp</dimen>

    <!-- SnackBarの大きさ -->
    <dimen name="snackbar_single_line_height">48dp</dimen>
    <dimen name="snackbar_multi_line_height">80dp</dimen>
</resources>
```

ビジュアル的に確認するのは、公式のガイドラインを見た方が早いです。
Componentsにまとまってます。よく使うのはこの辺りだと思います。
- [Lists](http://www.google.com/design/spec/components/lists.html)
- [Buttons](http://www.google.com/design/spec/components/buttons.html)
- [Cards](http://www.google.com/design/spec/components/cards.html)
- [Dialogs](http://www.google.com/design/spec/components/dialogs.html)

ちなみにフォントサイズについてはAppCompatにたくさん定義されているので、それを使うのが良さそうです。
フォントサイズは、`@dimen/abc_text_size_xxx`でいろいろありますし、スタイルとしても`@style/TextAppearance.AppCompat.xxxx`でたくさん定義があります。
SVProgressHUDでトーストを表示する

SVProgressHUDといえば、以下のようにローディングインジケータを表示するのによく使います。

![image](https://qiita-image-store.s3.amazonaws.com/0/12352/c8078160-2462-fe52-585c-9442f9849a75.png)

```objc
[SVProgressHUD show];
```

ですが、それ以外のメッセージをユーザーに伝えるトーストとしても使えます。

ローディングインジケータは明示的に`dissmiss`するまで表示されますが、トーストの場合は、数秒表示されたら勝手に消えます

## 何らかの情報をユーザーに伝える

![image](https://qiita-image-store.s3.amazonaws.com/0/12352/278cd2c1-518d-8807-bb42-9df3677c361c.png)

```objc
[SVProgressHUD showInfoWithStatus:@"hoge"];
```

## 処理に成功したことをユーザーに伝える
![image](https://qiita-image-store.s3.amazonaws.com/0/12352/6824d3b5-41a3-6d37-9ad2-4558234a808a.png)

```objc
[SVProgressHUD showSuccessWithStatus:@"hoge"];
```

## 処理に失敗したことをユーザーに伝える
![image](https://qiita-image-store.s3.amazonaws.com/0/12352/a7aae4f6-44a1-d337-630b-ca0fd68c847e.png)

```objc
[SVProgressHUD showErrorWithStatus:@"hoge"];
```

## カスタマイズ
[TransitApp/SVProgressHUD](https://github.com/TransitApp/SVProgressHUD#customization) にあるとおり、色や画像は変更できます。


## 表示時間
> The display time depends on the length of the given string (between 0.5 and 5 seconds).

https://github.com/TransitApp/SVProgressHUD#dismissing-the-hud

とあるように、statusの文字数で表示される時間は変わります。
Ruby の Pathname に / メソッドがあればと思ったら既にあったという話

## Pathname とは

[Ruby リファレンスマニュアル](http://docs.ruby-lang.org/ja/2.2.0/class/Pathname.html) より引用:

> パス名をオブジェクト指向らしく扱うクラスです。
> Pathname オブジェクトはパス名を表しており、ファイルやディレクトリそのものを表してはいません。 当然、存在しないファイルのパス名も扱えます。絶対パスも相対パスも扱えます。

Pathname クラスを使えば

```rb
home = Pathname('/Users/foo')
home.join('Documents').to_path #=> "/Users/foo/Documents"

desktop = home.join 'Desktop'
desktop.join('hoge.txt').write('hogehoge')
destkop.join('hoge.txt').read #=> "hogehoge"

hoge_txt = desktop.join 'hoge.txt'
hoge_txt.to_s # => "/Users/foo/Desktop/hoge.txt"
hoge_txt.relative_path_from(home).to_s #=> "Desktop/hoge.txt"
```

のように割と辛いパスの扱いから解放してくれます。大変助かります。ちなみに Rails で

```rb
Rails.root.join('tmp').to_path #=> "/path/to/rails/tmp"
```

のように書けるのも、 `Rails.root` が Pathname を返すからですね。

## 本題

大変便利な Pathname ですが、

```rb
hoge_txt = home.join('Desktop').join('hoge.txt') # もしくは home.join('Desktop', 'hoge.txt')
hoge_txt.to_path #=> "/Users/foo/Desktop/hoge.txt"
```

パスを生成する場合、このようなコードを書くと思います。
こんなとき、 `Pathname#/` メソッドがあったらいいんじゃないの、と思って調べてみたら普通にありました。

で、この [Pathname#/](http://docs.ruby-lang.org/ja/2.2.0/method/Pathname/i/=2b.html) メソッドを使うと先ほどのコードが...

```rb
hoge_txt = home / 'Desktop' / 'hoge.txt'
hoge_txt.to_path #=> "/Users/foo/Desktop/hoge.txt"
```

こんな風に書けてしまいます。やばい。

### ちなみに

この `Pathname#/` メソッドは、Ruby 2.2 で入ったようです。`Pathname#+` の別名ですね。 `Pathname#+` もこの時初めて知りましたが。

`Pathname` はいろいろ捗るので、ドキュメントをきちんと読んでいろいろ試すと良いと思います。
UIRefreshControlのBlocks対応カテゴリ書いた

# UIRefreshControlのBlocks対応カテゴリ書いた

<blockquote class="twitter-tweet" lang="ja"><p>UIRefreshControlのBlocks対応カテゴリ書いた&#10;<a href="https://t.co/j0SB8DJanx">https://t.co/j0SB8DJanx</a></p>&mdash; MOAI (@__moai) <a href="https://twitter.com/__moai/status/587997968038371328">2015, 4月 14</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" lang="ja"><p>Swiftで下みたいに書ける&#10;&#10;var refreshControl = UIRefreshControl()&#10;refreshControl.addRefreshAction {&#10; some()&#10; refreshControl.endRefreshing()&#10;}</p>&mdash; MOAI (@__moai) <a href="https://twitter.com/__moai/status/587998701282406401">2015, 4月 14</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>

<blockquote class="twitter-tweet" lang="ja"><p>Swiftで書くのがめんどくさい事案としてUIKitのクラスに対して保持Propertyを定義したい場合、案としてset or get associateしかないのでClosureをAnyObjectにどう変換する問題が出てくる</p>&mdash; MOAI (@__moai) <a href="https://twitter.com/__moai/status/587999922986713088">2015, 4月 14</a></blockquote>
<script async src="//platform.twitter.com/widgets.js" charset="utf-8"></script>
Pythonで簡易な文字コード変換をする

# 1. やりたいこと
文字コードAのファイルを文字コードBに変換したい。
例えば、UTF-8のファイルをMS932に変換して保存する。

# 2. 環境
* Python 2.7.5
* Mac OS X Mountain Lion

# 3. コードサンプル

```py
import sys

with open(sys.argv[2], 'w') as f:
  for line in open(sys.argv[1]):
    f.write(unicode(line, 'utf-8').encode('ms932'))
```

パラメータ1で入力ファイル(UTF-8)を指定して、パラメータ2で出力ファイル(MS932)を指定している。

こんなんでいいのかな？
[Ruby基礎学習] パターンの表示②

# はじめに
前回に続いて、次のパターンの表示を考えてみた。

# 問題
以下を表示する。

```
#
##
###
####
###
##
#
```

# 解答
まずは前回のパターンの表示①の時にやったものと、教えてもらったことを思い出して以下の3つを思いついた。

```rb
1.upto(3){ |i| puts "#" * i }
4.downto(1){ |i| puts "#" * i }
```

```rb
[*1..3].each{ |i| puts "#" * i }
[*1..4].reverse.each{ |i| puts "#" * i }
```

```rb
puts 1.upto(3).map{ |i| "#" * i }
puts 4.downto(1).map{ |i| "#" * i }
```

1行でどうにかしたいなぁと思ったら以下になった。
数字を全列挙っていまいちなんだろうなぁと思った。

```rb
[*1,2,3,4,3,2,1].each{ |i| puts "#" * i }
```

数字を全列挙じゃない方法で`1,2,3,4,3,2,1`ってできないだろうかと考えた。
しばらくコードを書きながら悩んでいたが、本はどういう風に書いてあるのだろうと見てみたら、同じことを本でも書いていたので参考にした。
本はC++という言語を用いて説明してあるので、それをRubyに置き換えてみようと四苦八苦した。
本の内容がなかなか理解できなくて時間がかかった。
`abs`を利用すると数値に対する絶対値が求められるみたい。
とりあえず目的のパターンの表示はできるので正解といえば正解なのだろうが、ぱっと見わかりにくいなと思った。
ただ、頭の体操にはなった。

```rb
7.times do |i|
	(4-(3-i).abs).times do |j|
		print "#"
	end
	puts ""
end
```

思いついたのはここまでです。

# 問題の出典

* プログラマの考え方がおもしろいほど身につく本　問題解決能力を鍛えよう！
Ubuntuでnodejs入れてみる


何番煎じかわからないけど、自分用のメモ

#### 環境
Ubuntu14.04(64bit)

## nodejsのインストール
<pre>
>$ sudo apt-get install -y nodejs npm
>$ nodejs -v
v0.10.25
</pre>

## Hello World
``` Javascript:hello.js
var http = require('http');
http.createServer(function(request, response) {
	response.writeHead(200, {'Content-Type': 'text/plain'});
	response.end('Helllo World¥n');
}).listen(8080);
```

<pre>
>$ nodejs hello.js
</pre>

待機状態になったらブラウザからアクセスする。

<pre>
>$ http://hostname:8080
</pre>

![スクリーンショット 2015-04-14 23.51.50.png](https://qiita-image-store.s3.amazonaws.com/0/52545/c477f118-ba7e-c37a-1e7f-3e817820f29a.png "スクリーンショット 2015-04-14 23.51.50.png")
非同期な自動再試行をネイティブのPromiseを用いて実装

…できてるのかどうか分からないんだけど、用途を絞っちゃう場合はこんな感じでいいの？

```html:3000ミリ秒後にコンソールに出力される例
<!DOCTYPE html>
<html>
    <head>
        <script>
            var RetryableQuerySelector = function self(selector, maxRetries, delay) {
                return new Promise(function (resolve) {
                    var element = document.querySelector(selector);
                    if (element) {
                        resolve(element);
                    } else if (maxRetries-- > 0) {
                        setTimeout(function () {
                            self(selector, maxRetries, delay).then(function (element) {
                                return resolve(element);
                            });
                        }, delay);
                    } else {
                        console.error('Failed to select: ' + selector);
                    }
                });
            };
            RetryableQuerySelector('div', 5, 1000).then(function (element) {
                console.log(element);
            });
            setTimeout(function () {
                document.body.appendChild(document.createElement('div'));
            }, 3000);
        </script>
    </head>
    <body>
    </body>
</html>
```

もっと一般的な実装の仕方がよく分からないので、詳しい方おられましたらコメントや編集リクエストお願いします…

↓

書きました

- [【Promise】再施行出来るPromise (Retmise)](http://qiita.com/mpyw/items/b7192d3aadf90d55ad49)
Node.js で AWSを操作する環境を作る（Mac）


Lambdaも出たことだし、node.jsもやってみようということで環境構築します。


# 1. Nodeのインストール

http://qiita.com/ryosy383/items/2ea9c92a792302b159b0

これみてやる。

```
$ brew update
$ brew install nodebrew
$ nodebrew install latest (データダウンロードとコンパイルに超時間かかる…)

$ nodebrew list
v0.12.2

current: none


$ nodebrew use v0.12.2

$ echo 'export PATH=$PATH:/Users/ユーザー名/.nodebrew/current/bin' >> ~/.bashrc
```

nodebrew使うと時間かかるので、サクッと試したいだけなら、 nodebrewではなく、brew installでいいかもしんない。


```
$ brew install node
```


# 2. AWS SDKのインストール

インストールするパッケージの定義作成 (package.json)

```
cat << EOT > package.json
{
    "dependencies": {
        "aws-sdk": ">= 2.0.9",
        "node-uuid": ">= 1.4.1"
    }
}
EOT
```

インストール

```
$ npm install

npm WARN package.json @ No description
npm WARN package.json @ No repository field.
npm WARN package.json @ No README data
node-uuid@1.4.3 node_modules/node-uuid

aws-sdk@2.1.23 node_modules/aws-sdk
├── xmlbuilder@0.4.2
├── xml2js@0.2.8
└── sax@0.5.3

```

# 3. サンプルを見てみる

下記にサンプルがあるので見てみる。

http://aws.amazon.com/jp/developers/getting-started/nodejs/


```
$ git clone https://github.com/awslabs/aws-nodejs-sample.git
$ cd aws-nodejs-sample
$ cat sample.js
```

```node

// Load the SDK and UUID
var AWS = require('aws-sdk');
var uuid = require('node-uuid');

// Create an S3 client
var s3 = new AWS.S3();

// Create a bucket and upload something into it
var bucketName = 'node-sdk-sample-' + uuid.v4();
var keyName = 'hello_world.txt';

s3.createBucket({Bucket: bucketName}, function() {
  var params = {Bucket: bucketName, Key: keyName, Body: 'Hello World!'};
  s3.putObject(params, function(err, data) {
    if (err)
      console.log(err)
    else
      console.log("Successfully uploaded data to " + bucketName + "/" + keyName);
  });
});
```

S3にバケット作ってファイル上げる例ですね。

実行すると、下記のような感じでUUID付きの長いバケットが作られてその中にhello_world.txt が置かれるようです。

```
$ node sample.js
Successfully uploaded data to node-sdk-sample-a0038ade-1189-45be-84ca-c19ff5685644/hello_world.txt
```

確認してみる。

```
$ aws s3 ls s3://node-sdk-sample-a0038ade-1189-45be-84ca-c19ff5685644/

2015-04-14 20:45:43         12 hello_world.txt

```

# 4. APIリファレンスで学ぶ

それぞれのサービス（S3とかDynamoDBとか）の操作方法は下記リファレンスを見てみる。

http://docs.aws.amazon.com/AWSJavaScriptSDK/latest/index.html

# 5. 試しにDynamoDB

```
$ vim dynamodb.js
```


```
var AWS = require('aws-sdk');

var dynamodb = new AWS.DynamoDB({region: 'ap-northeast-1'});

// テーブルリストを取得する

var params = {
    ExclusiveStartTableName: 'STRING_VALUE',
    Limit: 10
};

dynamodb.listTables(params, function(err, data) {
    if (err) {
        console.log(err, err.stack); // an error occurred
    } else {
        console.log(data);           // successful response
    }
});
```

```
$ node dynamodb.js

{ LastEvaluatedTableName: 'test9',
  TableNames:
   [ 'test1',
     'test2',
      :
      :
     'test9' ] }

```

とりあえずテーブル一覧取り出せた。なんとかなりそう。

# 開発環境構築

ローカルの開発環境として、WebStromを入れて、下記の設定をした。
	
[WebStorm の Node.js 開発環境を構築する](http://qiita.com/oukayuka/items/bcadcfd714f39e25c818)

すごくまとまってて良い記事。
groonga ソースコード読書会に参加してきた(Windows編)


「groonga ソースコード読書会」というイベントに参加してきました。
[blogroonga](http://groonga.org/ja/blog/2015/04/01/groonga-source-code-read-announce.html) | [Doorkeeper](https://groonga.doorkeeper.jp/events/23042)

読書会というよりはソースコード探検隊みたいな感じ。
「groongaのLoadコマンドの内部処理を追いかける」というお題の元、各人黙々とソースを読んでいました。
自分の場合には普段ほとんど接しないC言語のコードをじっくり眺める良い機会となりました。
会の雰囲気などは[groonga のソースコードリーディングに参加してきた - あいつの日誌β](http://okamuuu.hatenablog.com/entry/2015/04/13/224707)にもレポートがあります。



参加者の8割くらいがMacの中、Windows + Visual Studioという環境でエラー対応に時間がかかってあまり進められなかったのが心残り。
ということで次回以降Windowsで参加する方のために、環境構築でハマった点をまとめておきたいと思います。


##Windows環境での準備
Amazon WorkSpaces を1つ立てて、その上にVisual Studio 2013環境を作りました。
設定手順下記の通りです。

- VS2013 Express for Windows Desktopのインストール
デバッガのついている for Windows Desktop 版をダウンロードしてインストールする。
[Visual Studion 2013 Express](https://www.visualstudio.com/ja-jp/products/visual-studio-express-vs.aspx)

- CMakeのインストール
[CMake](http://www.cmake.org/)

- groonga ソースコードのダウンロード
読書会では v5.0.2 を使用。下記URLよりダウンロードし、unzipする。
http://packages.groonga.org/source/groonga/groonga-5.0.2.zip

- ビルド用ファイルの生成

```
cd D:\Downloads\groonga-5.0.2
cmake . -G "Visual Studio 12 2013" -DCMAKE_INSTALL_PREFIX=D:\groonga
```

- デバッグ用にビルド

```
cmake --build . --config Debug
```

- インストール

```
cmake --build . --config Debug --target Install
```

- VS2013でソリューションファイルを開く
cmakeを実行するとD:\Downloads\groonga-5.0.2ディレクトリにソリューションファイル（groonga.sln）ができるので、これをVisual Studio 2013で開く

- スタートアッププログラムの変更
Visual Studio が起動したら「groonga」を右クリックして「スタートアッププロジェクトに設定」を選択する

上記実施後、ローカルWindowsデバッガーを実行するとVisual Studioでgroongaのソースコードにブレイクポイント貼ることができます。

-デバッグ手順（作成中）
Swift - 不用 Storyboard 來啟動 App

最近開始做自己的小專案，試著用純 Swift 來寫，第一步就是想要把跟不太喜歡在開發時又有點吃資源的 Storyboard 移掉 XD

<!-- more -->

我其實是 UI 手刻控、也都不用 Interface Builder。最近也認真的開始使用 xib 搭配 autolayout 使用（其實有可能是數學算太久了有點累 XD），配置的方式也比較物件導向，因此我也優先選擇這個方式做；這樣的話，也不會用到 Xcode 預設配置的 Main Storyboard。

# 初步清場

首先，在專案設定頁中，選中一個 Target ，在 **General** 頁籤下 **Deployment Info** 區塊中的 **Main Interface** 中的文字清除，就可以避免專案開啟時，去讀取 Main Storyboard。

<img src="https://farm9.staticflickr.com/8702/17136268635_9c1981c5b0_o.png"><br>

來到 AppDelefate.swift 中，去除一些其他不需要的 application delegate methods ，只留下開啟時會呼叫的 `application:didFinishLaunchingWithOptions:`，剩下這樣：

``` swift:AppDelefate.swift
import UIKit

@UIApplicationMain
class AppDelegate: UIResponder, UIApplicationDelegate {

    var window: UIWindow?

    func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {

        return true
    }
}
```

# 顯示畫面

## UIWindow

預設就有配置一個 optional variable `window` ，他就是用來顯示 app 所有畫面的視窗。這個類別類似於桌面程式中「視窗」，只不過差別在 Mac app 中的 `NSWindow` 可以有不只一個 instances 在切換；在 iOS 中沒有切換視窗的概念，則只需要一個 instance 作為根視窗。

## 初始化

首先，這個 window 並還沒有被初始化，我們將它初始化，並將 frame 設定為主要螢幕的大小

``` swift
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
    
    // 初始化 self.window
    self.window = UIWindow(frame: UIScreen.mainScreen().bounds)
    
    return true
}
```

## 顯示出來

這個 window 不會憑空就顯示在畫面上，我們則需要透過 `makeKeyAndVisible` 這個 method 讓它顯示出來。為了可以清楚知道真的有顯示，在這邊先把他的背景色改成白色。

``` swift
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
    
    self.window = UIWindow(frame: UIScreen.mainScreen().bounds)
    // 把 window 的背景改成白色
    self.window?.backgroundColor = UIColor.whiteColor()

    // 把 window 顯示出來
    self.window?.makeKeyAndVisible()
    
    return true
}
```

由於 window property 是一個 optional variable ，使用它的時候則需要幫他解開束縛、在後面加上 `!` 來 unwrapping 這個值

## 加入 Root View Controller

`UIWindow` 有一個屬性是用來顯示根 view controller - `rootViewController` ，只要將需要第一個顯示的 view controller 丟給她，在 app 開啟時，就會幫我們在顯示 launch image 之後第一個顯示出來。

為了清楚知道有顯示 view controller 出來，在這裡先指定背景為灰色來清楚識別。

``` swift
func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool {
    
    self.window = UIWindow(frame: UIScreen.mainScreen().bounds)
    self.window?.backgroundColor = UIColor.whiteColor()
    
    // 宣告一個 view controller 並指定背景為灰色
    let viewController = UIViewController()
    viewController.view.backgroundColor = UIColor.grayColor()
    
    // 指定 root view controller
    self.window?.rootViewController = viewController
    
    self.window?.makeKeyAndVisible()
    
    return true
}
```

# 完成

到這裡即告一個段落，接著只要根據需求，根據這個方式，把主要的 view controller (如 tab bar controller) 替換上去即可。

## 同步發佈

- [Swift - 不用 Storyboard 來啟動 App - 熊屋 | 技術小記](http://blog.kumaya.co/2015/04/14/launch-without-storyboard-in-swift/)

<hr>
<small><span>
本文範例以 Xcode Version 6.3 (6D570), iOS SDK 8.3 建置。如果發現相關內容有更新，麻煩請在下方留言告知，謝謝。<br>
<span></small>
数値を通貨形式へフォーマットする

## str.format()

Python 2.7以降では「1000区切りのための書式指定子」を使って3桁毎にカンマで区切る事ができる。（区切る桁数や区切り文字の変更はできない）
[What’s New in Python 2.7 — Python 2.7ja1 documentation](http://docs.python.jp/2/whatsnew/2.7.html#pep-378-1000)

```pycon
>>> print "¥{:,d}".format(1000000)
¥1,000,000
>>> print "¥{:,.2f}".format(1000000)
¥1,000,000.00
```

Jinja2の中でも使うことができる。

```pycon
>>> import jinja2
>>> print jinja2.Template("{{ '\u00A5{:,d}'.format(num) }}").render(num=1000000)
¥1,000,000
```

## 正規表現

```pycon
>>> import re
>>> to_yen = lambda n: "¥" + re.sub("(\d{3}(?=\d))", "\\1,", str(n)[::-1])[::-1]
>>> print to_yen(1000000)
¥1,000,000
```

## リスト内包表記

```pycon
>>> to_yen = lambda n: "¥" + ",".join([str(n)[::-1][i:i+3] for i in range(0, len(str(n)), 3)])[::-1]
>>> print to_yen(1000000)
¥1,000,000
```

## localeモジュール

```pycon
>>> import locale
>>> locale.setlocale(locale.LC_ALL, '')
'ja_JP.UTF-8'
>>> print locale.currency(1000000, grouping=True)
¥1,000,000
>>> print locale.currency(1000000, grouping=True, international=True)
JPY 1,000,000
```

localeを変更するとシンボルや区切り文字が変更される。

```pycon
>>> locale.setlocale(locale.LC_ALL, 'en_US.UTF-8')
'en_US.UTF-8'
>>> print locale.currency(1000000, grouping=True)
$1,000,000.00
>>> locale.setlocale(locale.LC_ALL, 'de_DE.UTF-8')
'de_DE.UTF-8'
>>> print locale.currency(1000000, grouping=True)
Eu1.000.000,00
>>> locale.setlocale(locale.LC_ALL, 'fr_FR.UTF-8')
'fr_FR.UTF-8'
>>> print locale.currency(1000000, grouping=True)
1 000 000,00 Eu
```

## 参考

str.format()

* [What’s New in Python 2.7 — Python 2.7ja1 documentation](http://docs.python.jp/2/whatsnew/2.7.html#pep-378-1000)

正規表現

* [[Ruby] 数字に「12,345,678」と3桁区切りでカンマを入れたいときの話 : 読書メモ＋tips＋日記](http://blog.livedoor.jp/takaaki_bb/archives/51133994.html)

リスト内包表記

* [How do you split a list into evenly sized chunks in Python? - Stack Overflow](http://stackoverflow.com/questions/312443/how-do-you-split-a-list-into-evenly-sized-chunks-in-python)

localeモジュール

* [22.2. locale — 国際化サービス — Python 2.7ja1 documentation](http://docs.python.jp/2/library/locale.html)
macでdockerからGUIアプリを立ち上げる

```
brew install socat
brew install caskroom/cask/brew-cask
brew cask install xquartz
open -a XQuartz

socat TCP-LISTEN:6000,reuseaddr,fork UNIX-CLIENT:\"$DISPLAY\"
# in another window
docker run -e DISPLAY=192.168.59.3:0 docker_tag
```
Selenium IDEでテストケース実行毎にblankページがポコポコ開く謎現象が発生したときにする対処法

# はじめに
* [これだけはおさえておきたい！Selenium IDEのコマンド](http://qiita.com/oh_rusty_nail/items/c59d4345d5372213128f#comment-0e393dff65d838f21de9)の記事での質問があり、解決までのやりとりをQiitaでしました
* これからSeleniumをはじめる人のために記事を残しておきます

# 対処法
* Selenium IDEの「オプション」⇒「WebDriver」⇒ **Enable WebDriver Playbackのチェックボックスが選択されていない**か確認する
 * 有効になっていれば、それを解除するだけでおそらく現象は発生しなくなる



# ～ただの宣伝～
* [全国のSeleniumer必読](http://qiita.com/oh_rusty_nail/items/b8ba525d31ea7c522856)
* Selenium, SauceLabs, Travis, Jenkinsに関するノウハウ書いているのでよかったら参考にしてみてください
kick GAS!

会社の独自GroupwareのスケジュールをGoogle Calendarに同期するべく、Google Apps Scriptを使ってみました。

手順は以下。
1. Ruby/Mechanize/nokogiriで社内グループウェアからスケジュールを抜き出す。
2. 抜いたスケジュールをGoogle Drive(SpreadSheet)に保存する。
3. Ruby/Mechanizeで、GASをKickする。
4. GASが、Google DriveのデータをGoogle Calendarに転記する。

1.は力技で、2.は見よう見まねで、それぞれ実現できたものの
3.4.が曲者でした。

3.なっかなか思い通りに開始してくれないw。仕方ないのでFormつくってそのフォームをPOSTするとGASが始動するようにしました。
4.スケジュールがあらぬところに登録されるw。RubyDate型=>文字列=>JavaScriptDate型が期待通り変換されなかった模様。仕方なく文字列ではなくUNIX Time型を中継することに。
Alloyのcontroller同士を上手に連携させる

Alloyを使っていて慣れない人が一番最初に戸惑うのは、コントローラ同士の連携だといわれています（記事を書く側はいつでも勝手に読み手の考えを決めつけることができます）。そこでいい機会なので（どんな機会なんでしょうね）まとめておきます。

# 1. 引数で連携する

まず、最も単純な例です。あるコントローラの中から別のコントローラを呼び出す際に引数を渡します。

```javascript
var args = {
  tab: $.index.tab,
  model: e.model
};
var window = Alloy.createController('another_controller', args).getView();
```

createControllerされる別のコントローラの中で引数`args`を受け取るには

```js
var args = arguments[0] || {};
var tab = args.tab;
var model = args.model;
```

このように記述します。

## 1.5 呼び出された側から呼び出し元の機能にアクセスする

もう少しましな例を。呼び出されたコントローラ側から呼び出し元の機能にアクセスする手段も同じやり方で提供することができます。

```js
var API = {
  setTitle: function(title){
    $.index.setTitle(title);
  },
  removeAllFriends: function(){
    $.index.removeAllFriends({force: true});
  }
};
var window = Alloy.createController('another_controller', API).getView();
```

コントローラらしくなってきましたね。

# 2. 呼び出し元が呼び出したコントローラの機能にアクセスする

親の機能に子からアクセスするのはデータを渡すだけなので上のように簡単に実現できるのですが、反対に子の機能に親の方からアクセスする方法はどうでしょう。

最も単純なのは、exportsを使ってこちらもAPIを用意するやり方です。実際の例を見てみましょう。

アプリ内で共通のActivityIndicatorを用意して使いまわしたい場合、デフォルトのメッセージを渡したり、状況に応じてmessageプロパティを更新したいなんてことはよくあるはずです。そこで、こんなViewとControllerを用意しました。

```xml
<Alloy><!-app/views/indicator.xml-->
  <View class="container">
    <ActivityIndicator id="ind" />
  </View>
</Alloy>
```
```js
// app/controllers/indicator.js
var args = arguments[0] || {};
$.ind.message = args.message ? args.message : "お待ちください…";
exports.API = {
  setMessage: function(message){
    $.ind.message = message;
  }
};
```

tssは省略しましたが、これを実際に呼び出して使ってみます。

```js
// app/controllers/index.js
var indicator = Alloy.createController('indicator', {message: "スタート！"}); //ここではgetViewはしない
var indicator_view = indicator.getView();
$.index.add(indicator_view);

var i = 0, timer = null;
timer = setInterval(function(){
  //exportsで指定されたオブジェクトにアクセスできる
  indicator.API.setMessage(i + "秒経過…");
  i++;
  if(i > 10){
    $.index.remove(indicator_view);
    clearInterval(timer);
  }
}, 1000);
```

このように、呼び出されるコントローラ側でexportsを使って呼び出し元のコントローラにアクセスさせるAPIを用意してあげると、簡単にコントローラ同士を連携させることができます。他にも例えばViewの要素のプロパティに関数をセットしてアクセスさせるやり方もありますが、呼び出し元から直接Viewにアクセスさせず、処理はAPIとして公開するだけの方が、コードの見通しもいい上に気軽に外観の変更もできるのでメンテナンスも楽になります。
JavaScriptでフルスクラッチゲーム開発しよう 第3回 画像表示編

第1回: [JavaScriptでフルスクラッチゲーム開発しよう 第1回 準備編](http://qiita.com/zukkun/items/4ea9542a6dde45c6a9fd)
第2回: [JavaScriptでフルスクラッチゲーム開発しよう 第2回 画像読み込み編](http://qiita.com/zukkun/items/f0348a8cc14090f184b8)

それでは、前回読み込み処理を書いた画像を、実際に表示させる部分を進めてみましょう。

## 画像を表示するためのAPI

Canvasに対して画像を表示するには、RenderingContextの`drawImage`メソッドを使用します。

- 参考：[CanvasRenderingContext2D.drawImage() - Web API インターフェイス | MDN](https://developer.mozilla.org/ja/docs/Web/API/CanvasRenderingContext2D/drawImage)
- 参考：[drawImage() メソッド - Canvasリファレンス - HTML5.JP](http://www.html5.jp/canvas/ref/method/drawImage.html)

```js
ctx.drawImage(image, x, y);
```

`image`は、表示したい画像のオブジェクトで、前回読み込んだ`Image`オブジェクトをそのまま渡すことができます。

`x`と`y`は、Canvas内での表示座標で、ここで指定した座標が、表示したい画像の左上の位置になります。

## 画像を表示してみる

では、前回読み込みを行った画像の読み込みを行ってみます。

描画時に使用する画像は、前回作成した`Asset.images`から、`Asset.assets`で定義した名前で参照して使用します。

```js
Asset.assets = [
  { type: 'image', name: 'back', src: 'assets/back.png' },
  { type: 'image', name: 'box', src: 'assets/box.png' }
];
```

描画は、第1回で作成した`render`関数の中で行います。

```main.js
function render() {
  // 画面全体をクリア
  ctx.clearRect(0, 0, canvas.width, canvas.height);

  // 背景を表示
  ctx.drawImage(Asset.images['back'], 0, 0);

  // みかん箱を表示
  ctx.drawImage(Asset.images['box'], 0, 0);
}
```

上記は仮で、背景もみかん箱も座標(0, 0)で表示しています。

では、実行してみようと思いますが、ここで実行環境について説明しておきます。

## 実行環境について

こちらで動作を確認している環境は、以下のものになります。

- Mac OS X 10.9.5
    - Chrome 41

最近のモダンなWebブラウザであれば、今回使用しているAPIはたいてい使用できますが、自分が使用しているWebブラウザで特定のAPIが使用できるか確認する方法が2つあります。

### 「Can I use」で確認する

まずは「Can I use」というサイトで確認する方法です。

[Can I use... Support tables for HTML5, CSS3, etc](http://caniuse.com/)

![caniuse_top.png](https://qiita-image-store.s3.amazonaws.com/0/636/9e7e2cba-6f8e-981c-25c8-17bd0134fc11.png)

こちらで「canvas」を検索してみると、

![caniuse_canvas.png](https://qiita-image-store.s3.amazonaws.com/0/636/b19d4e7c-4bf9-497b-142f-14aeaefdc64f.png)

Webブラウザごとのサポート状況を確認することができます。

### Webブラウザで直接調べる

モダンなWebブラウザであれば、開発者向けのツールが充実しており、JavaScriptコンソールというもので直接JavaScriptのコードを対話型で実行することができるようになっています。

![chromedevtool.png](https://qiita-image-store.s3.amazonaws.com/0/636/078c3a62-068e-ba66-5b3b-44c1e82c9827.png)

上のスクリーンショットは、Chrome Developer Toolsで、CanvasのdrawImageが使えることが確認しているところです。

## 実行してみる

以下が、実行した時のスクリーンショットです。

![fullscratch_screenshot_03.png](https://qiita-image-store.s3.amazonaws.com/0/636/4c25e8e0-f4f6-3b46-f559-148b1f79ba1d.png)

もし、何も表示されない場合は、ご使用のWebブラウザのJavaScriptコンソールを確認し、エラーが出ていないか確認してみてください。

次回は、~~ゲームとしての設計に関わる部分に入っていきます~~まだ設計編に入れませんでした……次回は更新編です。

次回: [JavaScriptでフルスクラッチゲーム開発しよう 第4回 更新編](http://qiita.com/zukkun/items/43466ba12e94b90a9f8d)
小ネタ：elasticsearch の query DSL にはコメントやJSONでないものも受け付ける

ソースはここ https://github.com/elastic/elasticsearch/blob/master/src/main/java/org/elasticsearch/common/xcontent/json/JsonXContent.java#L46

以下の3つどれもOKでした。

```bash
curl -XPOST http://localhost:9200/twitter/tweets/_search -d'{    
    "query" : { /* コメント！！！ */
        "filtered" : {
            "query" : { "match_all" : {}}
        }
    } // コメコメ
}'
```

```bash
curl -XPOST http://localhost:9200/twitter/tweets/_search -d'{    
    query : { 
        filtered : {
            query : { match_all : {}}
        }
    }
}'
```

```bash
curl -XPOST http://localhost:9200/twitter/tweets/_search -d'{    
    'query' : { 
        'filtered' : {
            'query' : { 'match_all' : {}}
        }
    } 
}'
```
CakePHP2で複数のパンくずリストを生成するヘルパー


Amazonのように、一つのページに複数のパンくずリストを表示したい時に使えるヘルパー。

![スクリーンショット 2015-04-14 20.36.15.png](https://qiita-image-store.s3.amazonaws.com/0/18614/2611321c-cb30-5695-d707-540ecb3ac665.png "スクリーンショット 2015-04-14 20.36.15.png")

以下、最終的に以下の2つのパンくずリストを得たいとした時の具体的な使い方。

```
カテゴリ１ > カテゴリ２ 
ジャンル１ > ジャンル２ > ジャンル３ 
```


# 導入と使い方

## 1. ヘルパーの作成

以下のファイルをapp/View/Helper以下に置く。

```php:app/View/Helper/MultiCrumbsHelper.php

<?php
App::uses('AppHelper', 'View/Helper');

class MultiCrumbsHelper extends AppHelper {
    public $helpers = array('Html');
    private $crumbsList;

    public function __construct(View $view, $settings = array()){
       parent::__construct($view, $settings);
    }

    public function setCrumbs($crumbs = array()) {
      $this->Html->_crumbs = array();
      if (empty($crumbs)) {
        return;
      }
      foreach ($crumbs as $crumb) {
        $name = $link = $options = null;
        if (isset($crumb[0])) {
          $name = $crumb[0];
        }
        if (isset($crumb[1])) {
          $link = $crumb[1];
        }
        if (isset($crumb[2])) {
          $options = $crumb[2];
        }
        $this->Html->addCrumb($name, $link, $options);
      }
      $this->crumbsList[] = $this->Html->getCrumbList(array('separator' => '&nbsp;&gt;&nbsp;'));
      $this->log($this->crumbsList);
    }

    public function getCrumbsList() {
      return $this->crumbsList;
    }
}

```

## 2. パンくずリストの登録

配列の0番目にパンくず名、1番目にパンくずのリンク先を格納した配列を、親から順に登録する。

### 1つめのパンくずリストの配列を作成

```php:
$crumbs1 = array(
	array(
		'カテゴリ１', 
		array(
		'controller' => 'categories', 
		'action' => 'view', 
		1
		)
	), 
	array(
		'カテゴリ２',
		array(
		'controller' => 'categories', 
		'action' => 'view', 
		2
		)		
	)
);
```


### 2つめのパンくずリストの配列を作成

```php:
$crumbs2 = array(
	array(
		'ジャンル１', 
		array(
		'controller' => ' genres', 
		'action' => 'view', 
		1
		)
	), 
	array(
		'ジャンル２',
		array(
		'controller' => ' genres', 
		'action' => 'view', 
		2
		)		
	), 
	array(
		'ジャンル３',
		array(
		'controller' => ' genres', 
		'action' => 'view', 
		3
		)		
	)	
);
```

### パンくずリストの配列を格納

ヘルパーのsetCrumbsメソッドを、作成した配列を引数として実行する。

```
$this->MultiCrumbs->setCrumbs($crumbs1);
$this->MultiCrumbs->setCrumbs($crumbs2);
```



## 3. パンくずリストの取得

getCrumbsListメソッドでパンくずリストが格納された配列を取得。リストを出力したい部分で以下のようにすれば出力される。

```
$crumbsList = $this->MultiCrumbs->getCrumbsList();
foreach ($crumbsList as $crumbs) {
	echo $crumbs.'<br>';
}
```

```
カテゴリ１ > カテゴリ２ 
ジャンル１ > ジャンル２ > ジャンル３ 
```
jQueryプラグインを作ってみる


## まずはプラグインのファイル名
接頭辞は **jQuery** として、その後にわかりやすい **プラグイン名** を、拡張子として **.js** にするのが通例のよう。

## プラグインを書く前にjQueryがどのように動くかを理解する
以下のコードを例にとってみる。

```js
$("a").css( "color", "red");
```

上記の例では、`$`関数を使うことでjQueryオブジェクトが返却される。このオブジェクトの中には、通常僕らが使うメソッド（例えば、　 **.css()** や **.click()** などなど）が含まれている。

これらのメソッドは、jQueryオブジェクトに含まれる`$.fn`オブジェクトから取得することできる。

ということは、自身のメソッドを書きたい場合には、`$.fn`オブジェクトに含めて書いていけば良いということになる。

## 標準的なプラグインの書き方
例えば、cssで指定されているcolorがgreenである要素を取り出して、テキストを作成したいと考えた時は、`$.fn`オブジェクトに、`greenify`というようなメソッドを追加し、呼び出すことで実現することができる。

```js
$.fn.greenify = function(){
    this.css( "color", "green");
};

$( "a" ).greenify(); // aタグは緑で表示される。
```

## Chaining（チェイニング）
jQueryの特徴として、チェーン化されていることが挙げられる。例えば、プラグインとして幾つかのメソッドを追加した時、それらのメソッドがjQueryオブジェクトを返却することによって達成されていることを把握しておく必要がある。（ただし、.width()などのように要素の幅だけを返却するだけで、チェーン化されていない例外はあるようだ。）

Chaining（チェイニング）の例を以下に示す。

```js
$.fn.greenify = function(){
    this.css( "color", "green");
    return this;
};

$( "a" ).greenify().addClas(); 
```

## `$`エイリアスの保護とスコープの追加
`$`変数というのはJavaScriptライブラリの中ですごい人気があるようで。（prototype.jsなんかにも使われてます。）

もしjQueryと一緒に他のライブラリ（例えばprototype.js）を使っていたりすると、JQueryが`$`変数を使用しないように`jQuery.noConflict`を使わなければいけなくなる。

だけど、そんなことをしてしまうとこれから書こうとするプラグインが利用できなくなることにつながってしまい不都合が生じる。

それを **回避するため** 、 **jQueryの$エイリアスを保護するため** 以下のようにしてスコープを追加してあげる必要がある。

```js
(function ($) {
    $.fn.greenify = function(){
        this.css( "color", "green");
        return this;
    };

    $( "a" ).greenify().addClas(); 
}( jQuery ));
```

プライベートな変数を利用する場合には、以下のようにする。

```js
(function ($) {
    var shade = "#556b2f";
    
    $.fn.greenify = function(){
        this.css( "color", shade);
        return this;
    };

    $( "a" ).greenify().addClas(); 
}( jQuery ));
```

## 最小のプラグインを作ってみる
注意したいのは、関数をやたらめったら作成するのではなく、パラメータをうまく利用して関数の種類を少なくすることが望ましい。

以下は推奨されないコード。

```js
(function($){

	$.fn.openPopup = function(){
		// Open popup code.
	};
	$.fn.closePopup = function(){
		// Close popup code.
	};
	
}( jQuery ));
```

上記のコードは、open/closeの処理をパラメータで分けることができ、そうすることで関数をより少なくできる（同じスコープ内でも関数名が競合しにくくなる）。

以下のコードのようにする。

```js
(function($){
	
	$.fn.popup = function(action){
		if( action === "open"){
			// Open popup code.
		}
		if( action === "close"){
			// Close popup code.
		}
	}
	
}(jQuery));
```

## `each()`メソッドを使って見る
jQueryを使っていると、時々特定の要素（たとえばDiv要素全体など）に対して操作したい時がある。その場合は、return値の箇所で`each()`メソッドを使う方法がある。

```js
$.fn.myNewPlugin = function(){
	
	return this.each(function(){
		// Do something to each element here
	});
}
```

## Optionを受け取ってみる
関数への引数の数が多くなってくると、その関数自体はすごく複雑になりがち。そういう時は、複数の値をまとめてオプションとして渡す方がより効果的である。

```js
(function($){
	
	$.fn.greenify = function(options){
		
		// デフォルト値を定義しておく。
		var settings = $.extended({
			color 				: "#556b2f"
		,	backgroundcolor	: "white"
		}, options);
		
		return this.css({
			color				: settings.color
		,	backgroundcolor	: settings.backgroundcolor
		});
	};
	
}(jQuery));
```

実際の使い方は以下。

```js
$("div").greenify({color : "orange"});
```

## その他
- 参考にしたサイトはこちら。
 - [http://learn.jquery.com/plugins/basic-plugin-creation/](http://learn.jquery.com/plugins/basic-plugin-creation/)
Slimでの改行

# 動作環境

> Ruby **2.2.0**
Rails **4.2.0**
slim-rails **3.0.1**

# Slimで以下のような記述を書いたとき

```slim:index.html.slim
.
  = @hoge
  = @fuga
  = @huge
```

## こうなっちゃう(´・ω・｀)

```html:index.html
<div>
  hogefugahuge
</div>
```

## こうなって欲しい( ･`ω･´)

```html:index.html
<div>
  hoge
  fuga
  huge
</div>
```

## イロイロ検討したけど、こうしかできなかった。。。

```slim:index.html.slim
.
  = @hoge << "\n"
  = @fuga << "\n"
  = @huge
```

htmlのソースコードなんて気にするなって言われそうだけど、
なんか方法ないのぉ...って話でした。
iOSで動画を撮影・保存する(UIImagePickerController)


写真の撮影やカメラロールから画像を選択するときと同じように、動画の撮影でも`UIImagePickerController`が利用できる。

# 手順

1. `MobileCoreServices.framework`をプロジェクトに追加する。
2. 利用するUIViewControllerで`UIImagePickerControllerDelegate`・`UINavigationControllerDelegate`を採用する。
3. 以下のサンプルを参照。

## カメラを起動して動画を撮影、カメラロールに保存するまでのサンプル

```swift:
class ViewController: UIViewController, UIImagePickerControllerDelegate, UINavigationControllerDelegate {
	 // (略)
	 
	 /*
	  * 動画用のカメラを起動する
	  */
    func startCamera() {
        // カメラが利用できる端末かどうか確認
        if UIImagePickerController.isSourceTypeAvailable(UIImagePickerControllerSourceType.Camera) {
            var ipc: UIImagePickerController = UIImagePickerController()
            ipc.delegate = self
            ipc.sourceType = UIImagePickerControllerSourceType.Camera
            ipc.mediaTypes = [kUTTypeMovie] // ここで動画を指定する。
            ipc.allowsEditing = false
            ipc.showsCameraControls = true
            self.presentViewController(ipc, animated: true, completion: nil)
        } else {
            println("この端末ではカメラを利用できません")
        }
    }
    
	 /*
	  * 動画の撮影が完了して戻ってきたとき
	  */
    func imagePickerController(picker: UIImagePickerController!, didFinishPickingMediaWithInfo info:NSDictionary!) {
        picker.dismissViewControllerAnimated(true, completion: nil)

		if let url = info[UIImagePickerControllerMediaURL] as? NSURL {
			// 端末のカメラロールに保存する
	        UISaveVideoAtPathToSavedPhotosAlbum(url.path, self, "video:didFinishSavingWithError:contextInfo:", nil)
		}
    }
    
	 /*
	  * カメラロールへの保存が終了したとき
	  */
    func video(videoPath: String, didFinishSavingWithError error: NSError!, contextInfo: UnsafeMutablePointer<Void>) {
        if (error != nil) {
            println("動画の保存に失敗しました。")
        } else {
            println("動画の保存に成功しました。")
        }
    }
}
```
# 参考

【文法】UIImagePickerControllerを使った動画（ムービー、ビデオ）撮影の方法 - creativi.tea
http://teapipin.blog10.fc2.com/blog-entry-63.html

【iOS】【swift】アルバムへの保存 UIImageWriteToSavedPhotosAlbum - Qiita
http://qiita.com/kitanoow/items/995d254fa6cd89f066cb

Taking Pictures and Movies
https://developer.apple.com/library/ios/documentation/AudioVideo/Conceptual/CameraAndPhotoLib_TopicsForIOS/Articles/TakingPicturesAndMovies.html#//apple_ref/doc/uid/TP40010406
Windowsのバッチファイルから、slackに投稿

curlコマンドと、nkfコマンドを使います。

curlコマンドは、httpやhttps、ftpなどで通信を行うコマンドで、POSTを送ることが出来ます。
日本語コードはUTF8で送ってあげないといけないので、nkfでShiftJISからUTF8へ変換します。

#バッチファイル
``` bat:post.bat:
@echo off

setlocal

rem Webhook URL
set URL=https://hooks.slack.com/services/XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

rem 投稿するメッセージ (改行は\n)
set TEXT="ようこそ %USERNAME% さん.\nこれはcurlを使ったコマンドラインからslackへの送信テストです。"

rem 投稿するチャンネルやメンション(#randomとか @user)
set TO="#random"

rem 投稿者の名前(この名前のBOTが投稿したように見える)
set FROM="コマンドラインより"

rem 投稿アイコン(slackで使える絵文字記号)
set ICON_EMOJI=":computer:"


rem 送信
echo {"text":%TEXT%,"channel":%TO%,"username":%FROM%,"icon_emoji":%ICON_EMOJI%}| nkf -w | curl -k -X POST --data-urlencode payload@- %URL%

```

#ダウンロード

curlコマンド
 DL : http://curl.haxx.se/download.html
 (WinXX - Generic　のSSL対応版をダウンロードしてください）

nkfコマンド
 DL : http://www.vector.co.jp/soft/win95/util/se295331.html

#参考

 [Slack APIを使ってプッシュ通知を受け取ろう | 株式会社バニーホップ]( http://www.bunnyhop.jp/lab-20141020/)
 
 [Windowsでcurlを使おう。あるいはMicrosoft Security Essentialの定義ファイルをcurlでダウンロード。 | Nobwak's Lair]( http://april.fool.jp/blogs/2014/02/windows%E3%81%A7curl%E3%82%92%E4%BD%BF%E3%81%8A%E3%81%86%E3%80%82%E3%81%82%E3%82%8B%E3%81%84%E3%81%AFmicrosoft-security-essential%E3%81%AE%E5%AE%9A%E7%BE%A9%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB/)

 [tire.retire: cURLで標準入力の内容をPOSTパラメータとして連携する]( http://tire-retire.blogspot.jp/2015/03/curlpost.html)

 [Windows TIPS：nkfツールで文字コードを変換する - ＠IT ](http://www.atmarkit.co.jp/ait/articles/1301/25/news092.html)
UITableViewでSectionHeader/SectionFooterを残さない方法


UITableVieで、デフォルトではSectionHeader/SectionFooterが
常に見えるようにスクロールしますよね？
それを残さずに一緒にスクロールさせる方法です。

#SectionHeader

SectionHeaderHeightについては、調整してください。

```objc:MyTableViewController.m
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
	// SectionHeaderの高さ
	CGFloat sectionHeaderHeight = [[self tableView] sectionHeaderHeight];
	CGFloat offsetY = [scrollView contentOffset].y;
	
	if ( offsetY <= sectionHeaderHeight && offsetY >= 0.f ) {
		[scrollView setContentInset:UIEdgeInsetsMake( -offsetY, 0.f, 0.f, 0.f )];
	}
	else if ( offsetY >= sectionHeaderHeight ) {
		[scrollView setContentInset:UIEdgeInsetsMake( -sectionHeaderHeight, 0.f, 0.f, 0.f )];
	}
}
```

#SectionFooter

SectionFooterHeightについては、調整してください。

```objc:MyTableViewController.m
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
	// SectionFooterの高さ
	CGFloat sectionFooterHeight = [[self tableView] sectionFooterHeight];
	CGFloat offsetY = [scrollView contentOffset].y;
	CGFloat contentHeight = [scrollView contentSize].height;
	CGFloat bottomHeight = contentHeight - CGRectGetHeight( [scrollView bounds] );
	
	if ( bottomHeight - sectionFooterHeight <= offsetY && contentHeight > 0.f ) {
		[scrollView setContentInset:UIEdgeInsetsZero];
	}
	else {
		[scrollView setContentInset:UIEdgeInsetsMake( 0.f, 0.f, -sectionFooterHeight, 0.f )];
	}
}
```

#初期表示時にズレが生じる場合
```objc:MyTableViewController.m
- (void)viewDidLoad {
	[super viewDidLoad];
	
	[self scrollViewDidScroll:[self tableView]];
}
```
Twitter公式Webに自由度の高いミュート機能を付与するChrome拡張

# twitter-web-mutor

カスタマイズ可能なミュート機能をTwitter公式Web版に提供します．

## インストール

1. [「Download ZIP」](https://github.com/mpyw/twitter-web-mutor/archive/master.zip)で落としてきて展開
2. [chrome://extensions](chrome://extensions) を開く
3. 「デベロッパーモード」にチェックを入れる
4. 「パッケージ化されていない拡張機能を読み込む」で先ほど展開した **フォルダ** を選択<br /> (`manifest.json`などのファイルが直下にくるフォルダ)

## 使い方

インストールすると勝手に変なタブが増えます．

![スクリーンショット 2015-04-15 11.41.28.png](https://qiita-image-store.s3.amazonaws.com/0/25060/f26a373a-4e34-962e-3654-5f95d464cb89.png)

![スクリーンショット 2015-04-15 11.39.54.png](https://qiita-image-store.s3.amazonaws.com/0/25060/2fd1bace-0751-1551-4cab-6c4dc1ab0ef6.png)

1行しかないので窮屈ですが，あとは下記の変数を用いて自由にJavaScript関数の内容を書いちゃってください．

|変数|型|意味|
|:--:|:--:|:--:|
|user_id_str|string|ツイート主のユーザID|
|screen_name|string|ツイート主のスクリーンネーム|
|name|string|ツイート主の名前|
|is_promoted|boolean|広告であるかどうか|
|is_retweeted|boolean|公式リツイートであるかどうか|
|retweeter_user_id_str|string<br />null|リツイート主のユーザID|
|retweeter_screen_name|string<br />null|リツイート主のスクリーンネーム|
|retweeter_name|string<br />null|リツイート主の名前|
|stream_type|string| "home" "connect" "discover" "search" の何れか<br />それぞれ「ホーム」「通知」「見つける」「検索」の意味|

**ミュートしたい場合は`true`を返し，そうでない場合は`false`を返します．**  

## 設定例

#### 何もしない (規定値)

```javascript
return false;
```

#### 反原発タグをミュート

```javascript
return text.indexOf('#反原発') !== -1;
```
NetBeans で Tomcat の「デバッグモードで起動」が失敗する

# 現象

NetBeans から tomcat を「デバッグモードで起動」をしようとすると
「Tomcatの起動に失敗しました。」というダイアログと、下記のエラーログが出て起動に失敗しました。

![error.png](https://qiita-image-store.s3.amazonaws.com/0/43328/2db5424a-09a9-2bc0-8c7a-6a3ce7dfd00b.png)


```text
ERROR: transport error 202: failed to create shared memory listener: 既に存在するファイルを作成することはできません。
ERROR: JDWP Transport dt_shmem failed to initialize, TRANSPORT_INIT(510)
JDWP exit error AGENT_ERROR_TRANSPORT_INIT(197): No transports initialized [debugInit.c:750]
FATAL ERROR in native method: JDWP No transports initialized, jvmtiError=AGENT_ERROR_TRANSPORT_INIT(197)
```

# 解決

サーバープロパティで [起動]タブ > 「ソケットポート」を選択して起動するとうまくいきました。

![nb-property.png](https://qiita-image-store.s3.amazonaws.com/0/43328/30167f9b-4a9c-428f-dfb2-304f5d08ca10.png)

何が原因かさっぱりわからないままです。。
git ls-tree

Gitに`ls-tree`というサブコマンドがあったのを知ったのでメモ。

```console:Terminal
$ git ls-tree -dr --name-only --full-name --full-tree HEAD
```

リポジトリ内の全ディレクトリが表示できる。っぽい。速い。

```console:Terminal
$ git rev-parse --show-toplevel
```

でリポジトリのルートディレクトリの絶対パスが取得できるので、

```bash:.bashrc
peco-cd() {
  cd "$(git ls-tree -dr --name-only --full-name --full-tree HEAD | sed -e "s|^|`git rev-parse --show-toplevel`/|" | peco)"
}
```

とか書いて

```console:Terminal
$ peco-cd
```

でやったーって感じになる。

---

ターミナルだけじゃなくてunite.vimでも`directory_rec/async`の代わりに使いたい感じだ( ˘ω˘)
CloudFront料金が急増した原因の調査

突然CloudFrontの料金が急増した際の原因調査方法です。

# 調査方法

いちいちログの解析とかしなくても、CloudFrontには便利なレポート画面があります。
レポートはCloudWatchでなく、CloudFrontの画面で確認できます。

## Usage

まずは、Usageを確認しコスト増の原因となっている期間、リージョン、ディストリビューションを特定します。
そして、リクエスト数が増えているのか、データ転送量のみが増えているのかを確認します。

![Usage.png](https://qiita-image-store.s3.amazonaws.com/0/57615/a6014afc-5c64-80e2-b88c-954edd43236c.png)

上記画像のケースでは、リクエスト数は増えていないのにデータ転送量が増えているため、容量の大きなデータが転送されているのが原因と推測できます。
リクエスト数が著しく増えている場合は、単純に何かがバズった、DoS攻撃に遭った等の理由が考えられます。

## Popular Objects

次に、Popular Objectsを見ます。ここでは、指定期間内で50番目までのアクセス数が多いコンテンツを見ることが出来ます。
ただのアクセス増やDoS攻撃の場合はリクエスト数でソートすれば一目瞭然です。
データ転送量でもソートできるので、転送量の大きいコンテンツも確認できます。
※注意点として、転送量の大きいコンテンツが「50番目までのアクセス数が多いコンテンツ」に含まれない場合は表示されません。

![Popular Object.png](https://qiita-image-store.s3.amazonaws.com/0/57615/de5acab0-d347-09d3-ecf0-5ef86de08f69.png)

これを確認し、アクセスが多い、帯域を食っているコンテンツに対して対応を行います(データの圧縮を行う等)。
JavaScriptでHTML5 Audioが使えるか確認する方法

AACが使えるかどうか確認するために調査した結果。
以下のようにすると簡単に対応状況を確認できる。

    var a=document.createElement("audio");
    return !!(a.canPlayType && a.canPlayType('audio/mp4').replace(/no/, ''));

`canPlayType`
でprobablyかmaybeと返ってくればたぶん使えるってことかな。
いずれもあいまいな答えですが。
ブラウザによって返す答えは違うと思われます。

その他のコーデックについては
下記を参考
http://diveintohtml5.info/everything.html
http://www.leanbackplayer.com/test/h5mt.html
端末での例外処理、使い所について

例外処理の使い所について

ファイル書き込み、読み取りとか
　言語内で完結してるとき以外の↑の例で使うかも

例外事例：
ファイル書き込み権限がなかった
ファイル容量がいっぱいだった
ファイルが破損していた
ファイルがロックされていた

とか全部if文でかくのがめんどいから
try catcheでまとめて捕捉する

実直に対応すると：
if 書き込み権限があるか？
if 容量は足りているか？
if ファイルシステムは正常化？
if ファイルが書き込み中でないか？

以上を書いたとしても、、

知りたいのは、ファイルを書き込めたかどうか？
なので、try〜catch楽だぜ。ってことか
間に挟まってる過去のコミットを分割する


こんな状態だとして、

```bash
$ g hist -4
* \c755efd 2015-04-14 | yellow (HEAD, feature/10) [toshi0383]\
* \ae8bf80 2015-04-14 | hello [toshi0383]\
```

helloを２つに分けます。

```bash
$ git rebase -i HEAD~~   # pick your commit
$ git reset --soft HEAD^
$ git reset -p           # unstage
$ git commit -m "hello1"
$ git add -p             # stage
$ git commit -m "hello2"
$ git rebase --continue
```

rebase -i で過去に戻って、コミットをキャンセルしてコミットし直してrebase --continue したらできました。