OmniAICreator/Qiita-1.07M huggingface dataset:
epub形式の電子書籍作成方法

1年前にNaverまとめにまとめてたこれからEPUB作るよっていうWEB制作者向けに書いたやつ持ってきました。

<h1>そもそもEPUBってなあに</h1>
EPUBは電子書籍の形式ですが、
中身はほぼxhtmlファイルで構成されています。
htmlがわかる人ならある程度さくさく作成できるのではないでしょうか。

[EPUBとは？ | 電子書籍の作成＆出版成功ガイド](http://leadconsulting.jp/ebook/%E9%9B%BB%E5%AD%90%E6%9B%B8%E7%B1%8D%E3%81%A8%E3%81%AF%EF%BC%9F/epub%E3%81%A8%E3%81%AF%EF%BC%9F)
[10分で読めるePubの基礎ーその1：ePubとは？／OPS、OPF、OCFの3仕様](http://www.ipad-howto.com/ibook/epub_basic1.cfm)

私はJBasicのテンプレート文書を参考にデータを作成しました。
[JBasic08 - epubcafé](http://www.epubcafe.jp/jbasic)
困ったときも上記サイトからダウンロードできる「JBasicマークアップ指針」を紐解けばなんとかなるかんじです。ありがたや。

<h1>作業のながれ</h1>
基本的には以下の繰り返しです。
コーディング指針に基づいてEpubデータ作成
↓
epubcheckでエラーが出ないか確認
↓
実機検証
諸事情でcontent.opfとnav.xhtmlはDreamweaverで、本文はFUSEeで作業しました。
.epub ファイルは .zipにリネームすればzipファイルとして解凍できます。

<h1>ルビの設定は？</h1>
\<ruby>タグを使用します。
例：\<ruby>漢字\<rt>かんじ\</rt>\</ruby>
↓
<ruby>漢字<rt>かんじ</rt></ruby>

cssでルビを上に表示したり下に表示したりしたい場合は以下参照。
もっとこだわりたい方はmagin開けたりいろいろしましょう。
[ruby-position－CSS3リファレンス](http://www.htmq.com/css3/ruby-position.shtml)

<h1>実機での確認方法</h1>
itunesでライブラリに追加し同期を行います。
詳細は以下参照。
[iPhoneのiBooksで自作のEPUBを開く: DTP-Sブログ-ひねもすデジタルビヘイビア](http://dtp-s2.seesaa.net/article/154107903.html)

<h1>使用ソフト</h1>

[Adobe Dreamweaver](http://www.adobe.com/jp/products/dreamweaver.html)
秀丸とかCS3でもいいんですがCS5以上だとプレビューできるので便利です。

[FUSEe](http://fusee.fusenetwork.co.jp/product.php)
EPUB形式のまま加工できるので便利です。

[EPUB圧縮ツール: すべて夢のように](http://systemphoto.sblo.jp/article/58812243.html)
Windows用の圧縮ツール。すごく助かりました。

<h1>EPUBCHECKでチェックを行う</h1>
[epubcheck - Validation tool for EPUB - Google Project Hosting](https://code.google.com/p/epubcheck/)
[epubcheckの使い方 - NAVER まとめ](http://matome.naver.jp/odai/2135575090906207901)

以下はmacでサービスとして使う方法。
windowsならバッジファイルを作成してチェックを自動化するととても楽です。
[EPUBバリデータepubcheckをサービス化する(for OSX)](http://wakufactory.jp/densho/tools/epubcheck.html)

<h1>詰んだところと参考リンク</h1>
>iBooksは目次要素（toc.ncxとかnav.xhtmlとか）をopfファイルと同じ階層（OEBPS直下）に置かないとリンク切れになる
[出典](http://takahashifumiki.com/web/design/2364/)

[EPUB書き出し | Learn InDesign CS6 | Adobe TV](http://tv.adobe.com/jp/watch/learn-indesign-cs6-jp/13955/)
自動書き出しがあんまりうまくいかなかった思い出
[これでマスター！ EPUB 3 固定レイアウト - 電書ちゃんねる](http://densho.hatenablog.com/entry/fixed-layout-metadata)

<h1>所感など</h1>
当時ibooks authorで書けないこととかを入れ込む必要があったのでかなりゴチャゴチャやってます。今ならツールだけで完結するんじゃないかな（適当）
case文の不思議な挙動


あるオブジェクトの型によって処理を場合分けしたいとき

```ruby:1.rb
case "".class
when String
  print "HELLO"
else
  print "NOT FOUND"
end
```

以上のように書き実行すると、直感に反して`NOT FOUND`となる。

## ===演算子
case文では、 **==演算子ではなく===演算子を使っている**。そして

```ruby:
String === String #=> false
```

である。

ClassクラスはModuleのサブクラスである。
`Module#===`は[右辺が左辺modクラスのインスタンスかどうか](http://ref.xaio.jp/ruby/classes/module/eqq)を見ている。

`String === String`について、
右辺`String`はClassクラスのインスタンスなので、Stringクラスのインスタンスではない。
よってfalseが返る。

===演算子は通常、==演算子と同じ挙動をするが

- `Module#===`では、親クラスを左辺に書いてもtrueを返す。
- `Regexp#===`では`/[A-Z]/ === "HELLO" #=> true`となる。

という違いが見られる（[他にもある](http://rurema.clear-code.com/query:%3D%3D%3D/)）。==で分岐するよりも柔軟に書ける。

## まとめ
`1.rb`を直感どおりに動かしたいならば

```ruby:1.rb
case ""
when String
  print "HELLO"
else
  print "NOT FOUND"
end
```

と書くべきである。

## 参考
- [Rubyのcaseを〇〇(言語名)のswitch文だと思っている人たちにぼくから一言ガツンと申し上げたい](http://melborne.github.io/2013/02/25/i-wanna-say-something-about-rubys-case/)
- [Rubyのcase式と===演算子について - しばそんノート](http://d.hatena.ne.jp/shibason/20090617/1245231492)
- [=== (Module) - Rubyリファレンス](http://ref.xaio.jp/ruby/classes/module/eqq)
- [クエリ:=== | るりまサーチ](http://rurema.clear-code.com/query:%3D%3D%3D/)
linux版fr24feederがエラーで動かなくなっていた件


最近鳥取空港周辺のログが取れてないなあと思っていたら、私のfeederがエラー吐いて死んでました。

```
[i]FR24Feed v242 - built on May  7 2014/13:05:06
[i]Downloading configuration...[e]HTTP Response: [HTTP/1.1 404 Not Found]
```

調べてみると
http://forum.flightradar24.com/threads/4270-Linux-feeder-software-for-Flightradar24/page65
で同じようにはまっている人が居ました。ナカーマ

結局、fr24feeder起動前にに設定している環境変数が悪さしているようで、

```bash:
export FR24AUTHIP=83.140.247.20
```
これを外してあげれば動くようになりました。
そんなことよりVJしようぜ！！！

こんにちは :open_hands: 
vvvvを使えば動く映像 :hammer: が簡単に作れますね！ :clap: :joy_cat: 
難しいことはわかりませんが :information_desk_person: 、何となくVJ :bulb: ができそうなのでやってみましょう :dash: 

:cat2: 

自分は普段QuartzComposer :tada: を使ってVJをすることが多いのですが、:seat: 
基本的には
[シンプル :no_mouth: な素材をたくさん :two_hearts: 用意] :arrow_right: [ミキサーのプログラム :japanese_goblin: で混ぜてパフォーマンス :tractor: ]
という、オールドスクール :ghost: な形式をとっています。 :tv: 

:cat2: 

今回もまずはこの流れ :blowfish: でシステムを構築してみます :office: :office: :office: 
:point_down: :point_down: :point_down: :point_down: :point_down: 動作サンプル :point_down: :point_down: :point_down: :point_down: :point_down: 
https://www.youtube.com/watch?v=PD5p2K5POeA
:point_up: :point_up_2: :point_up: :point_up_2: :point_up: :point_up_2: :point_up: :point_up_2: :point_up: :point_up_2: :point_up: :point_up_2: :point_up: :point_up_2: 

素材はこんな感じで作りました :hatching_chick: 
![v1.png](https://qiita-image-store.s3.amazonaws.com/0/62787/5818d7bb-173a-8bdb-5090-7556afeb8d55.png)
![v2.png](https://qiita-image-store.s3.amazonaws.com/0/62787/de0fa67c-44a1-cfc6-5634-8ed34252709b.png)
![v3.png](https://qiita-image-store.s3.amazonaws.com/0/62787/daabe914-e571-6bad-9aa5-fe9cd006e59c.png)
![v4.png](https://qiita-image-store.s3.amazonaws.com/0/62787/3238445e-bb34-b344-c267-bfd315c0f7a9.png)

せっかくの :v: vvvv :v: なのでSpread :statue_of_liberty: をドンドコ :mega: 活用していきたいですね  :zap: :zap: :zap: :zap: 

:cat2: 

ここでポイント :paw_prints: になるのは、一番下についてるS > ◯◯ (呼び出すときはS(node))というやつです。
これにつなげたnode :electric_plug: をR > ◯◯というnodeで受け取ることができます :sun_with_face: :full_moon_with_face: 

ミキサーのパッチでR > ◯◯を使って素材を受け取ってQuad :chart_with_upwards_trend: に貼って混ぜれば :performing_arts: ミキサー :performing_arts: の完成です！ :dolphin: :shell: :shell: 
![v5.png](https://qiita-image-store.s3.amazonaws.com/0/62787/b65ad775-160c-0830-30cb-ddbc1fb02b6b.png)



ちなみに :cactus: 実際に使用した時は :last_quarter_moon_with_face: ミキサー :first_quarter_moon_with_face: だけを開いておいて :bento: 、使うパッチをミキサーのウインドウに投げ込んで :rocket: 使ってました!


間にフィルター :pineapple: 挟んだりMIDIアサイン :bread: したりしていい感じにパッチ :seedling: を育てましょう :barber: 

:cat2: 

今回紹介したパッチですー :fire:ご活用ください :metal: 
 :family: http://goo.gl/zt34Q9 :family: 
enjoy!!


:whale: http://twitter.com/onom
Vagrantの起動メモ（環境MacBOOKAir　BootCamp Windows7）

こちらを参考にさせていただきました。

http://qiita.com/epy0n0ff/items/de22023b86032e1f2d73


http://blog.kondoyoshiyuki.com/2014/06/12/windows7-vagrant-ubuntu14-04/


ちょっとはまった点
vagrant init をするフォルダを
Users ですると　[vagrant up]できませんでした。
C:\Users\ユーザ名\vagrnt

そこで
[C:\vagrant]で
[vagrant init]しましたら
うまくいきました。
デザインをやってみて知ったこと、感じたこと（iOS向け）

もともとはプログラマなのだけど、最近、デザインもやるようになった。
いまちょうどiOSアプリを作っていて、デザインとプログラミングの繋ぎこみの部分で得られた知見をメモっておく。

# 位置指定が面倒
画像やボタンの配置で、「左から3px〜」とか、「左から5%の位置に〜」という指定は、実は面倒くさかった。

## グリッド・ガイド
フォトショにはグリッド・ガイドという補助線を引く機能がある。
綺麗なデザインは、「整っている」、つまり「何らかの規則に従って並べられている」という仕組みが大きく寄与しているため、補助線は重要。

自分だけなのかもしれないが、「左から3px〜」とかよりも、「縦軸を10分割して、3番目の線にぴったりくっつける」みたいに引いた補助線を元に指定したいことがある。
（ここではStoryboardは一旦忘れよう）

## 実例
何を言ってるか分からないと思うので画像で。
![スクリーンショット 2014-12-13 11.29.13.png](https://qiita-image-store.s3.amazonaws.com/0/42541/12417960-e06c-a3ab-59dc-9a86a0803162.png)

これは画面を10分割するようにグリッドを設定しているんだけど、buttonをどの位置に置きたいかと言うと、

- 横は<strong>2番目</strong>の箱に、buttonの<strong>左辺</strong>が接するように
- 縦は<strong>4番目</strong>の箱に、buttonの<strong>底辺</strong>が接するように

って感じに置きたい。

しかし、プログラマにとっては描画の始点(x, y)だけが重要。
この例だと横軸については、画面幅に対して20%の位置で良いと思う。

```swift
let x = self.view.frame.width * 0.2
```

じゃあ縦軸は？
デザイナが計算してみる。「このbuttonの縦の長さだと、だいたい31%ぐらいの位置に始点がくればいいんかね…？」みたいな。


```swift
let y = self.view.frame.height * 0.31
```

<strong>これ、めんどい。</strong>

第一に、いちいち計算するのたるい。個数が多いとめんどくさい。
フォトショでグリッドを見たまんま書きたい。

第二に、0.31ならまだしも、0.11455みたいな謎数値は、<strong>デザイナとして</strong>メンテナンスしづらい。
複雑怪奇なピクセル指定、パーセント指定がはびこってしまい、デザインを変更したい時にササッと変更するのは至難の技。変更した時に計算が間違っていて、ビミョーにズレてるんだけど気づかない、みたいなことも避けたい。

今の環境で良いのは、自分がデザイナでありプログラマであるので、変更のイテレーションを高速に回せることだと思う。
こうした謎数値は良いことがないので、極力排除していきたい。

## 解決案
酔ってる頭で見ても分かるように、簡単に指定できるクラスを導入する。

```swift
let y = Divider(blockSize: 10, length: viewHeight) // 縦を10分割して、
  .boxAt(5) // その5番目の箱の
  .bottom(buttonHeight) // 底辺にbuttonがつくような、yの始点
```
実際にはちょっと違うのだけど、だいたいこんな感じ。

## 学び
デザイナも保守性に割と気を使っている。
勉強してても、保守性（デザインの変更性）を高めるために、レイヤーの構築方法をくどくど書いてる本に出会ったりする。

みんな気をつけているのだから、保守性を最大化するために、デザイナとプログラマの境界線上のテキトーさを潰す必要があると思った。
デザイナとプログラマ、両方にとって保守しやすいプログラミングというものがある、という知見を得た。

# vector画像を使いたい
自分のケースだと、UIに関しては、イラレでできる限りはとにかくイラレ。
なんと言っても、vector画像であれば、@2xとか@3xとか、解像度が上がるたびに画像を作らなくていい。

## 高解像度の画像の用意
冷静に高解像度の画像の用意を考えてほしい。
10pxの正方形で作ってたのを、20pxで作れと言われる。
でもそれって、元画像の引き伸ばしではなく（つまりギザギザな画像ではなく）、元画像が良い感じに補間された、アップスケール画像を望んでいるわけよね？

フォトショにもそーいう機能あるんだけど、魔法みたいな事が起きるわけじゃない。

まぁそんな事もあろうかと思って、元画像を大きく25px正方形で作ったりする。
でも悲しいかな、時代が進めば、さらなる高解像度を求められる（そろそろ高解像度の戦争は終わったと思いたいが…）。

ビットマップである限り、そうした、「俺、最大どのぐらいの解像度を想定してたらいいんだろう…？」という恐怖から逃れることはできない。

## 今のXcodeではpdfが使える！！！
Xcode6からは、Asset Catalogでpdf（vector画像）が扱えるようになり、解像度の恐怖から逃れることができる！ 素晴らしい！
@2xどうこう、みたいな世界から切り離される幸せ感、はんぱない。

# 変更することについての感想
デザインが未熟なので、新しいことを学んだ時に、過去のデザインを見てアチャーってなる。
また追加機能を入れていく内に、だんだんキモくなっていってしまう。

つまり、やっていけばやっていくほど、過去のモノが負債になるのはプログラマー固有の事情じゃない。

プログラマであれば、負債を定期的に解消していきたいムードみたいなのが暗黙の内に現場にあった。
実施できるかどうかは置いといて、負債を解消する気持ち自体は、現場、そして業界全体として許されてたように思う。

デザイナも同じなのだけど、リファクタ期間みたいなのを設けられているのを、あまり見たことがない（バージョンアップによるデザイン変更とかは置いとくとして）。
直すとなるとプログラマも動かす必要があるので大変なのだろうけど、負債を出せない緊張感みたいなのあるんだろうなぁと思った。

自分としては、定期的に負債を返上するように予定を組むようにしている。
バーチャルロボット設定方法

Choregraphe入れたはいいけどバーチャルロボットがどこにもいないでござるなときの設定方法です。

![1.png](https://qiita-image-store.s3.amazonaws.com/0/57159/d7ae49e7-78c6-d9bf-a876-a9921a0e02e2.png)
中にだれも居ませんね…

<h1>設定方法</h1>
## メニュー＞設定＞設定をクリック
![2.png](https://qiita-image-store.s3.amazonaws.com/0/57159/e871aea2-f6e1-c5de-b6ff-815c0d6cb0e3.png)

## バーチャルロボットタブを選んでお好きなロボットモデルを選びます。
![3.png](https://qiita-image-store.s3.amazonaws.com/0/57159/5a93d778-dffa-c9b2-d6d6-df4b37ae7cf5.png)

![4.png](https://qiita-image-store.s3.amazonaws.com/0/57159/a5dcbcea-7ff6-cb52-ac00-78310c1a759f.png)
Pepperの場合はJULIETTEY20PP.xmlを選んでOKを押して設定を保存します。

## Choregrapheを再起動
![5.png](https://qiita-image-store.s3.amazonaws.com/0/57159/aa0baaee-fcfc-7ae2-4b93-a0312114b789.png)
バーチャルロボットが表示されました！やったー！

<aside>
<h2>所感など</h2>
<p>Macに入れた時は設定しなくても表示されたので、Windowsのみでの現象なのかなという気がとてもします。Pepper開発はMacがおすすめかも。以上小ネタでした。</p>
</aside>
Swiftとキー値コーディング


「ヒレガス本」ことアーロン・ヒレガス著「Mac OS X Cocoa プログラミング」の例題をSwiftで書いてみようと思っているのですが、Cocoaバインディングまわりで思ったように動かず停滞中です。Cocoaバインディングではキー値コーディングと呼ばれるオブジェクトのプロパティを文字列で指定して操作する技術が用いられているのですが、Objective-CとSwiftではいろいろ違いがあるのかもしれません。

先日発売された萩原剛志著「詳解Swift」読んでもキー値コーディングについては解説がなかったので、基本的なトコを簡単にはですがちょっと調べてみました。

まず、Swiftで単純なクラスを定義してキー値コーディングに対応しているか調べてみました。

```swift
class Person
{
    var name = ""
    var email = ""
    var age = 0
}

var p1 = Person()
p1.setValue("Jhone Doe", forKey: "name")  // エラー！！

```

`setValue`というメソッドがないとエラーになってしまいました。
Objective-Cでは全てのクラスはNSObjectの派生クラスでしたが、Swiftでは当たり前といえば当たり前ですが違うようです。

そこで、PersonクラスをNSObjectから派生するように変更してみます。

```Swift
class Person : NSObject  // ← NSObjectから派生させる
{
    var name = ""
    var email = ""
    var age = 0
}

var p1 = Person()
p1.setValue("Jhone Doe", forKey: "name")	// 成功！！
```

今度は成功しました。SwiftではNSObjectからクラスを派生させることで、プロパティへのキー値コーディングが可能になるようです。

念のため値の取得も試してみます。

```swift
let name = p1.valueForKey("name") as String?
```

こちらも問題ないようです。`valueForKey`はAnyObject?を返すのでダウンキャストが必要になります。

```swift
p1.setValue(14, forKey: "age")
let age = p1.valueForKey("age") as Int?
```

文字列以外、Int型のプロパティも問題ありません。Objecttive-Cだと、直接整数リテラルを渡すことはできずNSNumberにラップしてやる必要がありましたが、Swiftでは適切に変換されるためリテラル値を直接渡すことが可能です。

`setValue`や`valueForKey`に対して存在しないキー値を指定した場合、`setValue: forUndefinedKey`や`valueForUndefinedKey`が呼び出されます。これらのメソッドをPersonクラスに実装して呼び出されるか確認します。

```swift
class Person : NSObject
{
    var name = ""
    var email = ""
    var age = 0
    
    override func setValue(value: AnyObject?, forUndefinedKey key: String) {
        println("\(key)は存在しません")
    }
    override func valueForUndefinedKey(key: String) -> AnyObject? {
        println("\(key)は存在しません")
        return nil
    }
}

p1.setValue("Hoge", forKey: "foo")
p1.valueForKey("bar")
```

実行すると「fooは存在しません」「barは存在しません」と表示され、それぞれのメソッドが呼び出されていることが確認できます。

`setValue`メソッドは設定する値をAnyObject?で受け取るので、どのような値でも渡すことができてしまいます。では異なる型の値を渡すとどうなるでしょうか？

```swift
p1.setValue(100, forKey: "email")	// エラー！！
```

実行時エラーが発生しプログラムが終了してしまいます。Swiftには例外処理がないのでエラーをトラップすることができません。したがって異なる型の値を渡さないようにプログラマが保証してやる必要があります。

ただ、スカラ型のプロパティにnilを設定しようとした場合は、`setNilValueForKey`が呼び出されるとなっています。Personクラスに`setNilValueForKey`を実装して試してみます。

```swift
class Person : NSObject
{
    var name = ""
    var email = ""
    var age = 0
    
    override func setValue(value: AnyObject?, forUndefinedKey key: String) {
        println("\(key)は存在しません")
    }
    override func valueForUndefinedKey(key: String) -> AnyObject? {
        println("\(key)は存在しません")
        return nil
    }
    
    override func setNilValueForKey(key: String) {
        if key == "age"
        {
            age = 0
        }
        else
        {
            setValue("", forKey: key)
        }
    }
}

p1.setValue(nil, forKey: "email") // エラー！！
```

何故か`setNilValueForKey`は呼び出されずに、不正アクセスでエラーになってしまいました。
自分のコードの問題なのか、Swiftのバグなのか仕様上の制限なのか今の所良く判りません。

ちなみに、プロパティをオプショナル型にすれば（当たり前ですが）エラーにはなりません。

とりあえず、文字列や数値といった単純な値型のプロパティ値に関していえば、SwiftでもクラスをNSObjectから派生させることでキー値コーディングに対応させることができること判りました。ただ、キー値コーディングでは値をAnyObject?としてやりとりするので型については注意が必要。でないとエラーで落ちる。というトコでしょうか？

次はより複雑な場合について試してみようと思います。
Love:2Dゲームエンジンその１



01:Hello Worldまで
環境：Mac OSX 10.7.5

ダウンロード

https://love2d.org/wiki/Getting_Started_(%E6%97%A5%E6%9C%AC%E8%AA%9E)
![kobito.1418422593.076689.png](https://qiita-image-store.s3.amazonaws.com/0/33317/422ddac5-dd25-48b0-07ea-5460d3b68efe.png "kobito.1418422593.076689.png")

zip展開するとdmgなので、インストールしてアプリケーションに登録。

作業ディレクトリ作成、main.luaの配置

![kobito.1418443164.695731.png](https://qiita-image-store.s3.amazonaws.com/0/33317/1fe59658-f08e-1eb6-c272-2f8a58f0cebe.png "kobito.1418443164.695731.png")


main.lua
![kobito.1418443385.386748.png](https://qiita-image-store.s3.amazonaws.com/0/33317/2246b082-9441-337c-0632-25ac721b87ea.png "kobito.1418443385.386748.png")

loveファイル作成（zip作成）

ターミナル起動し、作業ディレクトリに移動。
zipコマンド： zip -r ../${PWD##*/}.love *

loveファイルをダブルクリックで起動します。
![kobito.1418443769.350548.png](https://qiita-image-store.s3.amazonaws.com/0/33317/5f143578-db44-2b7e-716c-5004e27b454b.png "kobito.1418443769.350548.png")
jsonにおけるクソカンマ問題

json作成時にforeach文でまわした最後の要素のカンマだけなくしたい！と思うことがよくある。この"jsonにおけるクソカンマ問題"を解決するスマートな方法を模索中。

いまのところ一番の解決方法。

```php:kusocomma.php
<?php
$outputcomma = 0; //←ここ
echo '{"type":"FeatureCollection",
   "features":[';
   foreach ($muchData as $data): 
      $geom = json_decode($data['geom'], true);
      if ($outputcomma) {  　//←ここ
         echo ',';　　　　　　//←ここ　
      } else {　　　　　　　　//←ここ
         $outputcomma = 1;　//←ここ
      }   　　　　　　　　　　　//←ここ　　
      echo '{"type":"Feature",
         "geometry":{"type":"Point", "coordinates":['.$geom['coordinates'][1].','.$geom['coordinates'][0].']},
         "properties":{"prop0":"value0"}
      }';
   endforeach;
echo' ]
}';
```

要素の一番めだけ"直前のカンマ"をつけないという発想。もっといいのあるかな。
google map上にgeojsonデータを表示させる

![スクリーンショット 2014-12-13 12.42.52.png](https://qiita-image-store.s3.amazonaws.com/0/34879/f4dcc641-c86c-f9ee-37be-4b406f1d1c65.png)


こんな感じでgoogle map上に位置情報をプロットできるようにする。

```json:mapData.json
{"type":"FeatureCollection",
   "features":[{"type":"Feature",
         "geometry":{"type":"Point", "coordinates":[139.6934361947,35.7065873901]},
         "properties":{"prop0":"value0"}
      },{"type":"Feature",
         "geometry":{"type":"Point", "coordinates":[139.6940198,35.65529179]},
         "properties":{"prop0":"value0"}
      },{"type":"Feature",
         "geometry":{"type":"Point", "coordinates":[139.6899114,35.64338274]},
         "properties":{"prop0":"value0"}
      }  
   ]
}
```

coordinatesの中身が緯度経度だが、[経度,緯度]である点に注意。さらにいえば[北緯,東経]である。
あとはhtmlを下記のように作ってやればok。

```html:map.html
<!DOCTYPE html>
<html>
  <head>
    <title>Data Layer: Simple</title>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <style>
      html, body, #map-canvas {
        height: 100%;
        margin: 0px;
        padding: 0px 
      }   
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script>
    <script>
var map;
function initialize() {
  // Create a simple map.
  map = new google.maps.Map(document.getElementById('map-canvas'), {
    zoom: 4,
    center: {lat: 36.3894816, lng: 139.0634281}
  });

  // Load a GeoJSON from the same server as our demo.
  //map.data.loadGeoJson('https://storage.googleapis.com/maps-devrel/google.json');
  map.data.loadGeoJson('http://xxxxx.com/mapData.json');
}

google.maps.event.addDomListener(window, 'load', initialize);

    </script>
  </head>
  <body>
    <div id="map-canvas"></div>
  </body>
</html>
```

実際の挙動は、
1. htmlレスポンスを受け取る
2. htmlのローディング（google mapの描画）がはじまる
3. jsonデータを取りに行く
4. マップデータ表示

という感じ。
フィンガープリントを表示

```bash:フィンガープリントが記録されている。
sudo journalctl -u sshd | grep publickey
```

```bash:フィンガープリント表示
ssh-keygen -lf id_rsa.pub
```

## 面白そうだがうまく行かなかったもの

* authorized_keysの何行目のものでログインしたかをログに保存
  * [鍵認証のサーバで「いつ」「誰が」「どの鍵で」ログインしたかを調べる方法 | infra.xyz](http://infra.xyz/archives/23)

ssh接続ができなくなった(´・ω・｀)
ログアウト時にコマンドヒストリをメールで送ってもらう

## コマンドヒストリに時間をつける

```bash:~/.bash_profile
export HISTTIMEFORMAT="%Y-%m-%d %T "
```

## ログアウト時

```bash:~/.bash_logout
#!/bin/sh
SSH_IPADDR=`echo $SSH_CLIENT | cut -f 1 -d " "`
history | tac | mail -s "log ${HOSTNAME}: ${SSH_IPADDR}" myaddr+${HOSTNAME}@hoge.com
```

作業後にどんなコマンド打ったか後で気になることがある。
とはいえわざわざログインしてhistory打つのも面倒だし見づらい。

スマホで受信し移動中に読んでる。
複数接続同時処理するサーバを立てる

pythonでTCPサーバを立てるのに `SocketServer.TCPServer` を使った例をよく見かけます。

```py:SocketServer.TCPServerを使った例
import SocketServer

HOST, PORT = "", 12345

class SampleHandler(SocketServer.BaseRequestHandler):
    def handle(self):
        client = self.request
        address = self.client_address[0]
        client.send("May I ask your name? ")
        name = client.recv(80).strip()
        self.request.send("Welcome %s from %s\n" % (name, address))

if __name__ == "__main__":
    server = SocketServer.TCPServer((HOST, PORT), SampleHandler)
    server.serve_forever()
```

ですが、これですと1時点に1接続しか処理できず、処理中に新たな接続要求が来た場合には前の処理が終了するまで待たされてしまいます。
この `SocketServer.TCPServer` を `SocketServer.ThreadingTCPServer` に変えるだけで複数接続を同時処理できるようになります。

```py:SocketServer.TCPServerをSocketServer.ThreadingTCPServerに変更(メイン部分のみ)
if __name__ == "__main__":
    server = SocketServer.ThreadingTCPServer((HOST, PORT), SampleHandler)
    server.serve_forever()
```

ただし、使用ソケット数が増えてしまうので、iptablesで接続数上限を設定したり、sysctlでTIME_WAIT時間を短くするなどの対処も行うといいでしょう。上限や時間はサービスに合わせて調整してください。

```text:iptables設定で一つのIPアドレスからは15接続に制限
-A INPUT -p tcp -m tcp --dport 12345 --tcp-flags FIN,SYN,RST,ACK SYN -m connlimit --connlimit-above 15 --connlimit-mask 32 --connlimit-saddr -j REJECT --reject-with tcp-reset
```

```text:/etc/sysctl.confでTIME_WAIT時間を15秒に短縮(未設定時は60秒)
net.ipv4.tcp_tw_recycle = 1
net.ipv4.tcp_tw_reuse = 1
net.ipv4.tcp_fin_timeout = 15
```

また、スクリプトを再起動するとアドレス使用中エラーになるなら、次のようにスクリプト側でアドレス再利用設定をしておくといいでしょう。

```py
import SocketServer
import socket

HOST, PORT = "", 12345

class SampleHandler(SocketServer.BaseRequestHandler, object):
    def handle(self):
        client = self.request
        address = self.client_address[0]
        client.send("May I ask your name? ")
        name = client.recv(80).strip()
        self.request.send("Welcome %s from %s\n" % (name, address))

class SampleServer(SocketServer.ThreadingTCPServer, object):
    def server_bind(self):
        self.socket.setsockopt(socket.SOL_SOCKET, socket.SO_REUSEADDR, 1)
        self.socket.bind(self.server_address)

if __name__ == "__main__":
    server = SampleServer((HOST, PORT), SampleHandler)
    server.serve_forever()
```

ThreadingTCPServerを使ってCTF問題サーバを2つほど運用してみました。

SECCON CTF 2014 winter online qualifications
Choose the number : https://github.com/shiracamus/seccon2014/blob/master/number/number.py
Let's disassemble : https://github.com/shiracamus/seccon2014/blob/master/disassemble/disassemble.py
[druby] リモートのファイル内容をサクッと取得する。

セキュリティ的には、問題があるが、
サクッと リモートマシンのファイル内容を取得するのに druby を使えます。

server.rb, client.rb の２つのファイルから構成します。

```ruby:server.rb
# coding: utf-8

# See http://docs.ruby-lang.org/ja/2.0.0/library/drb.html

require 'drb/drb'
require "open3"

# 通信を待ち受ける URI
URI="druby://localhost:8787"

class RunCommandServer
  def read(file_path)
    File.new(file_path).read
  end

  def command(command)
    Open3.capture3(command)
  end
end

# サーバ側でリクエストを受け付けるオブジェクト
FRONT_OBJECT = RunCommandServer.new

# サーバを起動する
# DRb.start_service(URI, FRONT_OBJECT, :safe_level => 1)
 DRb.start_service(URI, FRONT_OBJECT, :safe_level => 0)
# DRb のスレッドが終了するのを待つ
DRb.thread.join
````

```ruby:client.rb
# coding: utf-8

# See http://docs.ruby-lang.org/ja/2.0.0/library/drb.html
require 'pp'
require 'drb/drb'

# 接続先の URI
SERVER_URI="druby://localhost:8787"

# DRbサーバを起動する
# この例には必要ないが、front オブジェクト以外の
# リモートオブジェクトのメソッドを呼び出す時には必要
DRb.start_service
# リモートオブジェクトの取得
rpc = DRbObject.new_with_uri(SERVER_URI)

# リモートメソッドの呼び出し
pp rpc.command('cat server.rb')
pp rpc.read('server.rb')

````

 コードは  同一マシン(localhost) 用になっているけど、サーバー指定を書き換えればよいはず。
localhost 上では次のようにして動作確認できる。

  2 つ端末を開く。
  1 つ目の端末で　　"ruby server.rb"
  2 つ目の端末で   "ruby clinet.rb"
 ==> 2 つ目の端末に server.rb の内容が表示される。
[Ruby] nokogiriをインストールする



RailsでRSpecを使う勉強で、`$ bundle exec rspec`を実行するとnokogiriとやらが見つからないとエラーが出た。
インストールしようとしてみたら以下のエラー。


```
Building native extensions.  This could take a while...
Building nokogiri using packaged libraries.
ERROR:  Error installing nokogiri:
    ERROR: Failed to build gem native extension.

    /usr/local/Cellar/ruby/2.0.0-p247/bin/ruby extconf.rb
Building nokogiri using packaged libraries.
-----
libiconv is missing.  please visit http://nokogiri.org/tutorials/installing_nokogiri.html for help with installing dependencies.
-----

```


libiconvとやらが見つからなくてnokogiriとやらのインストール中にエラーが起きたらしい。

下記の記事を参考にlibiconvからインストールを試みる。
http://qiita.com/tarr1124/items/3ef609961b3c425a75b9

```
# srcディレクトリがなかったので作成
$ mkdir /usr/local/src
$ cd /usr/local/src/
$ wget http://ftp.gnu.org/pub/gnu/libiconv/libiconv-1.13.1.tar.gz
$ tar xzvf libiconv-1.13.1.tar.gz 
$ cd libiconv-1.13.1
$ ./configure --prefix=/usr/local/Cellar/libiconv/1.13.1
$ make
$ make install
```

`$ make install`のところでまたしてもエラー。

```
/usr/local/include is not writable
```

/user/local/include に書き込めないと。
これあれだよね、ぱーみっしょんとかいうやつ変えるんだよね。
ということで下記を参考に
http://qiita.com/u1_fukui/items/b82704555f6cd04a4209

```
$ cd /usr/local/
$ sudo chmod g+w include
$ sudo chown :admin include
$ sudo chmod g+w lib
$ sudo chown :admin lib

```

これでlibiconvのインストールも出来た。
というわけでついにnokogiriをインストール

```
$ brew install libxml2 libxslt
$ brew link libxml2 libxslt --force
$ gem install nokogiri
```

そして`$ bundle install`。
そしてエラー。
そして検索。

```
$ bundle config build.nokogiri --use-system-libraries
$ bundle install --path vendor/bundle
```

下記参照にしたところ、こうすればいいらしいですね。
http://qiita.com/pugiemonn/items/4b23a709ed194b02be6d


ようやくrspecコマンドが通りました。
vagrant上、共有ファイルのパーミッションを変更する

vagrantはホスト（あなたのPC）とゲスト（仮想マシン）で共有フォルダを作ってくれていて、わざわざvagrant sshしなくても、ソースコードをいじれたりします。

ただ共有フォルダ内のファイル・フォルダのパーミッションがchmodをしても変えられなかったので、変える方法をメモ。（ちなみになんでこうゆう仕様になってるんですかね・・？）


```text:Vagrantfile
 config.vm.synced_folder ".", "/vagrant", mount_options: ['dmode=777','fmode=755']
```

上記を追加すればok。'dmode'がディレクトリ、'fmode'がファイルのパーミッションのこと。
Vagrantfileを書き換えるときは、最初に

```linux
cp Vagrantfile Vagrantfile.dist
```

としてバックアップをとっておいたほうが◎。
Windows7のパッチをあてたら、VirtualBoxが起動しなくなった

Windows7のパッチをあてたら
起動しなくなった。。
アンインストールしたらなおりました。

[KB3004394]をアンインストールし、
VirtualBoxを再インストールすることによって修復。。

https://www.virtualbox.org/ticket/13677
依存関係を自動生成するMakefile

## 特徴
* make するだけで依存関係を理解したビルドが可能
* makedepend などの外部ツール依存なし

パブリックドメインとするので自由に利用してください。

## Makefile
利用の際は行頭の8字連続スペースをタブに変換すること

```make:Makefile
PROGRAM_NAME := $(shell basename `pwd`)
 
# compiler
CXX := clang++
CXXFLAGS := -O2 -Wextra
LIBS :=

# directory
OUT_DIR := out
SOURCE_DIR := src
HEADER_DIR := include

SOURCES := $(wildcard $(SOURCE_DIR)/*.cpp)
HEADERS := $(wildcard $(HEADER_DIR)/*.hpp)

PROGRAM_DIR := $(OUT_DIR)/bin
OBJ_DIR := $(OUT_DIR)/obj
DEPEND_DIR := $(OUT_DIR)/depend

PROGRAM := $(PROGRAM_DIR)/$(PROGRAM_NAME)
SOURCE_NAMES = $(notdir $(SOURCES))
OBJS := $(addprefix $(OBJ_DIR)/,$(SOURCE_NAMES:.cpp=.o))
DEPENDS := $(addprefix $(DEPEND_DIR)/,$(SOURCE_NAMES:.cpp=.depend))
 
.PHONY: all
all: $(DEPENDS) $(PROGRAM)
$(PROGRAM): $(OBJS)
        @mkdir -p $(PROGRAM_DIR)
        $(CXX) $(CXXFLAGS) $(LIBS) $^ -o $(PROGRAM)
 
$(DEPEND_DIR)/%.depend: $(SOURCE_DIR)/%.cpp $(HEADERS)
        @echo "generating $@"
        @mkdir -p $(DEPEND_DIR)
        @$(CXX) $(CXXFLAGS) $(LIBS) -I$(HEADER_DIR) -MM $< > $@
 
$(OBJ_DIR)/%.o: $(SOURCE_DIR)/%.cpp
        @mkdir -p $(OBJ_DIR)
        $(CXX) $(CXXFLAGS) $(LIBS) -I$(HEADER_DIR) -c $^ -o $@
 
 
ifneq "$(MAKECMDGOALS)" "clean"
-include $(DEPENDS)
endif
 
.PHONY : clean
clean:
        $(RM) -r $(OUT_DIR)
```
すべてのチェックボックスにチェックを入れるスクリプト

ページ内のチェックボックスすべてにチェックを入れたいとき用


非jQueryバージョン
```
inputs = document.getElementsByTagName('input');
for(i=0;i<inputs.length;i++){
    inputs[i].checked=true;
}
```

jQueryバージョン
`$('input[type="checkbox"]').each(function(){$(this).attr('checked', true)})`
ActionBarのタイトルのTextViewを取得する方法

```java
int titleResId;
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
    titleResId = getResources().getIdentifier("action_bar_title", "id", "android");
} else {
    titleResId = R.id.action_bar_title;
}

TextView txtTitle = (TextView) activity.findViewById(titleResId);
if (txtTitle != null) {
    // 
}
```

なぜこんなことを調べたかというと、ActionBarにCustomViewをセットした時、Android2の端末でタップ領域が`<`の部分だけになってしまい、タイトルをタップしても反応しないことがあったためです。
![Skitch_Image.png](https://qiita-image-store.s3.amazonaws.com/0/15267/f81ddb19-8732-d9a3-1c20-3c6ef8f2220e.png "Skitch_Image.png")

苦肉の策で、Android2の場合のみタイトルのTextViewにOnClickListenerをセットして対応しました。

```java
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.HONEYCOMB) {
    TextView txtTitle = (TextView) activity.findViewById(R.id.action_bar_title);
    if (txtTitle != null) {
        txtTitle.setTextColor(getResources().getColor(R.color.white));
        txtTitle.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                finish();
            }
        });
    }
}
```

何かいい解決方法があればぜひ教えてください。
JSONのSyntaxチェックやDiffを手っ取り早く確認する

この記事は、「[1分で実現できる有用な技術 Advent Calendar 2014](http://qiita.com/advent-calendar/2014/one-minute)」の13日目の記事です。

＼　この記事は1分で読めます。　／
　
みなさん、JSONを確認する際に整形やDiffはどうしていますか？

コマンドから「[jq](http://stedolan.github.io/jq/)」などを使って整形・フィルタリングしているのでしょうか？

今日は「jq」のように高機能ではありませんが、普段からお世話になっている

Syntax・Diffチェックが手軽に利用できる「[JSONLint Pro](http://pro.jsonlint.com/)」を紹介します。


## 目次

+ サイト紹介
+ Syntaxチェック・整形
+ URLから取得
+ Diffチェック
+ あとがき


## サイト紹介

まず、「[JSONLint Pro](http://pro.jsonlint.com/)」を開くと入力画面いっぱいのサイトになっています。

![jsonlint0.png](http://iideacraft.com/blog-img/jsonlint0.png)

```
Enter json or a url to validate...
```

プレースホルダーに書いてある通りなのですが、JSONかURLを入力するとデータの検証（Syntax、整形、Diff）チェックしてくれます。


## Syntaxチェック・整形

使い方の説明する必要があるのか怪しいですが、

以下の様なJSONデータを貼り付けて右上の「v」を選択すると`Syntaxチェック・整形`をしてくれます。

```
{"name": "Lavonne Pace", "age": 39, "gender": "female", "email": "lavonnepace@dymi.com"}
```

![1.gif](http://iideacraft.com/blog-img/jsonlint1.gif)

もし文法に問題があれば、ポップアップで知らせてくれます。

![9.png](http://iideacraft.com/blog-img/jsonlint9.png)

※ 大きいデータは向いていないです

## URLから取得

「[Weather Hacks - livedoor 天気情報](http://weather.livedoor.com/weather_hacks/)」というサービスのAPIを使わせて頂いた例です。

こちらも対象のURLを貼り付けて右上の「v」を選択すると先ほど同様`Syntaxチェック・整形`をしてくれます

```
http://weather.livedoor.com/forecast/webservice/json/v1?city=200010
```

![2.gif](http://iideacraft.com/blog-img/jsonlint2.gif)

※ 通信が発生します


## Diffチェック

プチ便利な差分チェックです。

右側のメニューの一番下に「見開きっぽい」ボタンがあります。

選択すると`２カラム`になるので、左右にデータを入力したあとに最後に「比較っぽい」ボタンを選択しましょう

簡易的な差分が確認できます

![3.gif](http://iideacraft.com/blog-img/jsonlint3.gif)

※ ダミーデータには「[JSON Generator – Tool for generating random data](http://www.json-generator.com/)」を使用しています


## あとがき

あっさりと終わってしまいましたが、整形とDiffを１つのサービスで出来るのは便利だと思いました。

ちなみにこっちなら利用したことある！っていう人は多いかもしれません「[JSONLint](http://jsonlint.com/)」

今回はその`機能拡張版?`でしたが、意外と`はてブ数`が`少なかった`ので紹介させて頂きました。

ブログっぽい内容でも大丈夫だったかな...？

## Note

+ keyが数値だけの場合は順番が変わる
+ unicodeはデコードされる
+ https://github.com/arc90/jsonlintpro
公開鍵なし/パスワードなしでSSHログインする設定


普通に危険なので、どうしても公開鍵を使いたくない && 閉じたネットワーク 以外では絶対にやるべきではない。

検証環境: Ubuntu 14.04

## sshdの設定

`PermitEmptyPasswords`を`yes`に、`UsePAM`を`no`に指定する。変更後、sshdを再起動する。

```bash:
$ vi /etc/ssh/sshd_config
...
PermitEmptyPasswords yes
...
UsePAM no

$ sudo service ssh restart
```

## パスワードなしユーザの作成

作成時点ではSSHログインする際にパスワードを要求される。`passwd -d <ユーザ名>`としてパスワードを空にしてしまえば、パスワードなしでログインできる。

```bash:
$ sudo useradd -m hoge
$ ssh hoge@localhost
hoge@localhost's password:

$ sudo passwd -d hoge
passwd: password expiry information changed.
$ ssh hoge@localhost
$ pwd
/home/hoge
```
依存の再束縛

# 依存の再束縛

11日目の記事[アプリケーションコンテキスト](http://qiita.com/koriym/items/d8d14682ce0a542c3b42)と９日目の@zukimochiさんの記事[BEAR.SundayのRouterCollection](http://qiita.com/zukimochi/items/486d5401d600faaba50e)に関連した内容です。

Ray.Di 2.0の新機能、依存の再束縛です。
インターフェイスとクラスの接続（束縛）を後から変更することができます。

## ユースケース

### Before

例えば[BEAR.SundayのRouterCollection](http://qiita.com/zukimochi/items/486d5401d600faaba50e)の記事では元々

```php
$this->bind(RouterInterface::class)->(WebRouter::class);
```
と束縛しているのを

```php
$this->bind(RouterInterface::class)->(RouterCollectionProvider::class);
```

と束縛を上書きして、`RouterCollectionProvider`では`RouterCollection`という以下のように２つのルーターを受け取ってグルグル回していました。

```php

    /**
     * @Inject
     * @Named("auraRouter=aura_router,webRouter=web_router")
     */
    public function __construct(AdapterInterface $auraRouter, AdapterInterface $webRouter)
    {
```

`WebRouter`から`WebRouter`と`AuraRouter`を持つ`RouterCollection`へと変更です。

### After

これを「**依存の再束縛**」を使って**現在束縛されているルーター**と`AuraRouter`を持つ`RouterCollection`へと変更してみます。

まず現在の`RouterInterface`にされている束縛に`original`と名前をつけます。

```php
$this->rename(RouterInterface::class, 'original');
```
つぎに新しいルーターを束縛します。

```php
$this->bind(RouterInterface::class)->(RouterCollection::class);
``` 
`RouterCollection`では`AdapterInterface`の`original`という名前で以前の束縛を利用することができます。オリジナルの束縛が変わってもコードに変更はありません！

```php
    /**
     * @Inject
     * @Named("original")
     */
    public function __construct(AdapterInterface $router)
    {
```

## アプリケーションのデコレーション

`cli`コンテキストではこの依存の再束縛を使っています。

```php
class CliModule extends AbstractModule
{
    /**
     * {@inheritdoc}
     */
    protected function configure()
    {
        $this->rename(RouterInterface::class, 'original');
        $this->bind(RouterInterface::class)->to(CliRouter::class);
        $this->bind(TransferInterface::class)->to(CliResponder::class);
    }
}
```

コンソールから入力された値を`RouterInterface`に束縛されてあったルーターに渡します。

```php
class CliRouter implements RouterInterface
{
    private $router;

    /**
     * @Inject
     * @Named("original")
     */
    public function __construct(RouterInterface $router)
    {
        $this->router = $router;
    }

    public function match(array $globals = [])
    {
        list(, $method, $uri) = $globals['argv'];
        $globals = [
            // ...コンソールから受け取った値で$globalsを作成
        ];
        return $this->router->match($globals);
    }
}
```

## まとめ

ルーターインターフェイスに束縛されてルーターを**それが何のルーターであるかを知らず**に利用して、コンソールから受け取った引数を渡して**インターフェイスにあるメソッドを使って元のルーターを利用**しています。元のwebアプリケーションに変更することなしに、コンソールアプリケーションにデコレーションすることができました！

> 「抽象」は実装の詳細に依存してはならない。実装の詳細が「抽象」に依存すべきである。

この[依存性逆転の原則](http://d.hatena.ne.jp/asakichy/20090128/1233144989)が可能にした機能です。

__これが何のルーターであるかを知らずに__は「実装の詳細に依存してはならない」に対応して、__インターフェイスにあるメソッドを使って元のルーターを利用__が「実装の詳細が「抽象」に依存すべき」に対応します。

明日は@mackstarさんの「BEARとBDD」です。楽しみにしてます！
UbuntuのOSアップデートで、VirtualBoxが起動しなくなった時の回復方法

##症状
Vagrant+VirtualBoxでの開発便利ですよね。
ですが、Ubuntuのカーネルのバージョンアップを行うと下記のようなダイアログが出て、いきなり起動しなくなることがあります。
UbuntuでVirtualBoxを使っているとよく有ることなのですが、初めて見た時には、ダイアログのインパクトも有って、かなりビックリします。
![Screenshot from 2014-12-13 02:44:46.png](https://qiita-image-store.s3.amazonaws.com/0/7839/ae477b79-1926-84a8-71d1-ebf646f9dedf.png)

![Screenshot from 2014-12-13 02:38:49.png](https://qiita-image-store.s3.amazonaws.com/0/7839/2bd4a164-13d9-7af1-7fe3-6aa029ebaa1d.png)

##回復方法
ご丁寧なことに、ダイアログにコマンドの例まで記載されているのですが、これだけ入力しても解決しません。
新しいカーネルのヘッダー情報を取得してから実行する必要があります。
おそらくVirtualBoxは、エミュレーションする際に、Linuxカーネルの低レベルAPIを直叩きしていて
APIを叩くために必要な情報を持ったlinux-headersは、カーネルのバージョンと合っていないと駄目なのだということなのでしょう。
下記のコマンドを入力してやれば、また起動できるようになります。

```bash
$ sudo aptitude install linux-headers-`uname -r`
$ sudo /etc/init.d/vboxdrv setup
```

##VirtualBox5
VirtualBox5だとコマンドのインストール場所が変更になったみたいです。

![Screenshot from 2016-06-12 15-44-06.png](https://qiita-image-store.s3.amazonaws.com/0/7839/2fa91147-85dd-255b-2ad1-0e220b5a623d.png)

```bash
$ sudo aptitude install linux-headers-`uname -r`
$ sudo /sbin/rcvboxdrv setup
```
コマンドの出力結果に色を付ける

# 目的

`git`や`bundle`などの

* コンソールに出力する場合は色をつける
* パイプなど、結果を利用する場合は色を付けない

という挙動を実現する

# 方法

## Rubyの場合

### コード

```rb:hello.rb
#!/usr/bin/env ruby

message = 'hello, world'

if STDOUT.tty?
  puts "\033[32m#{message}\033[0m"
else
  puts message
end
```

### 結果

![hello_rb.png](https://qiita-image-store.s3.amazonaws.com/0/12356/dd11ae27-8600-5c4c-5c98-8d030714aeac.png)

## node.jsの場合

### コード

```js:hello.js
#!/usr/bin/env node

var message = 'hello, world'

if (process.stdout.isTTY) {
  console.log("\033[32m" + message + "\033[0m");
} else {
  console.log(message);
}
```

### 結果

![hello_js.png](https://qiita-image-store.s3.amazonaws.com/0/12356/8e085a36-a790-aa73-3e33-7722303f84fa.png)

# 結論

自作コマンドが捗る

# 参考

- https://github.com/erikhuda/thor/blob/v0.19.1/lib/thor/shell/color.rb
- http://nodejs.org/api/tty.html#tty_tty
カメラで撮影した画像の向きをデバイスに合わせる



※画面向き設定をPortraitに固定して、デバイスを横などに向けて撮る時に使うものです。
画面向きを固定しない場合はAVCaptureVideoOrientationを対応させれば良いみたいです。

## デバイスの向き取得と対応したUIImageOrientation
CMMotionManaferでデバイスの向きを取得して
画像を生成する際に回転させるためのUIImageOrientationを取得する。

```
var manager: CMMotionManager!
var photoOrientation: UIImageOrientation!

private func initMotion() {
    manager = CMMotionManager()
    manager.accelerometerUpdateInterval = 0.01;
    let handler:CMAccelerometerHandler = {(data:CMAccelerometerData!, error:NSError!) -> Void in
        let x = data.acceleration.x
        let y = data.acceleration.y
        let z = data.acceleration.z
        NSLog("x: %@%.2f", (x < 0 ? "-" : " "), fabs(x))
        NSLog("y: %@%.2f", (y < 0 ? "-" : " "), fabs(y))
        NSLog("z: %@%.2f", (z < 0 ? "-" : " "), fabs(z))
        self.photoOrientation = self.getOrientation(x, y: y)
    }
    manager.startAccelerometerUpdatesToQueue(NSOperationQueue.currentQueue(), withHandler:handler)
}

private func getOrientation(x: Double, y: Double) -> UIImageOrientation {
    var orientation :UIImageOrientation!
    if (fabs(x) < 0.5) {
        if (y < 0) {
            // ホームボタン：下
            orientation = UIImageOrientation.Right
        } else {
            // ホームボタン：上
            orientation = UIImageOrientation.Left
        }
    } else {
        if (x < 0) {
            // ホームボタン：右
            orientation = UIImageOrientation.Up
        } else {
            // ホームボタン：左
            orientation = UIImageOrientation.Down
        }
    }
    return orientation
}
```

## 画像の回転
UIImageを回転させる

```
let result = UIImage(CGImage: image.CGImage, scale: 1.0, orientation: orientation)!
```

## 注意
CMMotionManagerはメソッド内にしかスコープのないオブジェクトに格納するとstartAccelerometerUpdatesなどで検知できない。
クラスにメンバ変数として持たせる必要がある。
gitlab-flowをgitコマンドラインツールとGitHubを使って一通りおさらい

gitlab-flowとgitの基本を一通り勉強した気がするのでとりあえずまとめておく


大体この2サイト参考にした

・gitlab-flow（概要）
http://sssslide.com/speakerdeck.com/ogom/gitlab-flow
・gitコマンドラインツール
https://www.atlassian.com/ja/git/

~~~~~~~~

①GitHubでレポジトリを作成する。
作成したレポジトリ
git@ghe.hoge.local:louis_rui/test_gitlabflow.git

②gitレポジトリをローカルにチェックアウトしてフィーチャーブランチを作る
$ git clone git@ghe.hoge.local:louis_rui/test_gitlabflow.git
$ cd test_gitflow
$ touch test
\#ステージして
$ git add test
\#コミット
$ git commit test -m "add test file"
\#コミットされてる
$ git branch -v
* master 2559bcb add test file
\#logにも残ってる
$ git log
commit 2559bcb9728eff8859a0f77dfd1c492f9d7fae22
Author: louis_rui <louis_rui@hoge.co.jp>
Date:   Fri Dec 12 23:53:26 2014 +0900

    add test file
③remoteのレポジトリへpushする
$ git remote -v
origin	git@ghe.hoge.local:louis_rui/test_gitlabflow.git (fetch)
origin	git@ghe.hoge.local:louis_rui/test_gitlabflow.git (push)
\# pushついでにこのブランチでpushしたらoriginのmasterにpushと登録する
$ git push -u origin master

④GitHubでファイルを確認して、一旦実験的にローカルのレポジトリを消してクーロンしてみる
$ cd ../
$ rm -rf test_gitlabflow/
$ git clone git@ghe.hoge.local:louis_rui/test_gitlabflow.git
$ cd test_gitlabflow/
\# ファイルがある事を確認

③フィーチャーブランチ作成してファイル作成
$ git branch feature/louis_rui001
\# 追加された事を確認
$ git branch -v 
  feature/louis_rui001 2559bcb add test file
* master                  2559bcb add test file
$ git checkout feature/louis_rui001
Switched to branch 'feature/louis_rui001'
$変わった事を確認
Switched to branch 'feature/louis_rui001'
PC-5455:test_gitlabflow A12693$ git branch -v
* feature/louis_rui001 2559bcb add test file
  master                  2559bcb add test file
\# testファイルを編集してコミット
$ echo 123 > test
$ git add test
$ git commit -m "update test"

④フィーチャーブランチのファイルをmasterにプルリク経由でコミットする
$ git push -u origin feature/louis_rui001

⑥プルリクでマスターにマージする
GitHub上の【compare & pull request】のボタンからプルリク送信
トップページに戻って【pull request】のボタンからプルリク内容を開き
【Merge pull Request】をおして【Delete branch】でブランチも削除
トップページのtestファイルが変更されている事を確認する

⑦タグ切りする
\#まずはmasterを更新
$ git checkout master
$ git pull
remote: Counting objects: 1, done.
remote: Total 1 (delta 0), reused 0 (delta 0)
Unpacking objects: 100% (1/1), done.
From ghe.hoge.local:louis_rui/test_gitlabflow
   2559bcb..f73498e  master     -> origin/master
Updating 2559bcb..f73498e
Fast-forward
 test |    1 +
 1 files changed, 1 insertions(+), 0 deletions(-)
# タグ用のstableブランチを切る
$ git branch stable
$ git checkout stable
\# タグ付け
$ git log --pretty=oneline
f73498e57ea61722516bf9b45b0d6e46b094f831 Merge pull request \#1 from louis_rui/feature/louis_rui001
1746ad8ed35df0fb1428b610e28f626279a530c3 update test
2559bcb9728eff8859a0f77dfd1c492f9d7fae22 add test file
$ git tag test-0.0.0 f73498e57ea61722516bf9b45b0d6e46b094f831
\# 確認
$ git tag
test-0.0.0
$ git push origin stable 
$ git push origin test-0.0.0
\# GitHubでtest-0.0.0のタグが出来ている事を確認する

⑧タグからhotfixを作成する
$ git checkout stable
$ git branch hotfix
$ git checkout hotfix
\# 編集
$ sed -i '' -e "s/123/abc/" test
$ git add test
$ git commit -m "add hotfix"
\# リモートにpush
$ git push origin hotfix

⑨masterとstableにプルリク経由でマージする
手順⑥と同様にしてマージ


~~~~~~~~~~~

終わりに。
gitlabだと、hotfixはtagとmasterにマージ出来るのかな？
gheではそれが出来ないぽいな
TitaniumでAndroid開発する時の画像パスについて

# 概要

各解像度に合わせたsplashとかappiconを配置する時どこに配置すればいいか調べたけど公式ドキュメントや世にあるたくさんの資料を見てもよく分からなかったので

# 環境

Titanium SDK 3.4

# まずどこ見たか

公式ドキュメント
http://docs.appcelerator.com/titanium/latest/#!/guide/Icons_and_Splash_Screens-section-29004897_IconsandSplashScreens-Androidgraphicassetrequirementsandoptions

- platform/android/res/
- Resources/android/images/

この2パターンがありそうなことは分かった

# Resource/ではなかった

Resource/以下に画像を配置してもビルドしたら消えてしまった
いろいろググったけどここで分からなくなった

# 結論

結局Titaniumのとあるwidgetのディレクトリ構成見て同じにしたらいけるんじゃね？と思ってやったらできた

- Launcher Icon
	- ```platform/android/res/``` 以下に各解像度のディレクトリ作って配置
- その他(Splash Screen, Action Bar Icons, ...)
	- ```app/assets/android/images/``` 以下に各解像度のディレクトリ作って配置

# 補足

上記配置した画像を参照する時は ```/images/hoge.png```のように/imagesが必要な点にも注意
Vimを体系的に学ぶつもりのない人のためのVim講座―Exコマンド編

[前回](http://qiita.com/okuramasafumi/items/50c64825cf365e8f6e78)からだいぶ間が空いてしまいましたが、今日こそExコマンドについて、あんまりVimが得意でないそこのあなたのために書きます（得意な方は間違っていたらツッコミを…）

## Exコマンドの基本

Exコマンドは、Vimを一度でも使ったことがある人なら必ずお世話になっています（その意味で、使用頻度はノーマルモードの次、ヘタしたらインサートモードより上ということもありえます、文字を消すだけならインサートモードに入る必要もないので）。そう、Vimを閉じるときに使う`:q`です。あれは`:quit`の省略形ですが、立派なExコマンドです。

Exコマンドを入力するには`:`をノーマルモードで押します。すると画面の一番下にカーソルが移動するので（**コマンドライン**といいます）、そこにコマンドを入力してEnterを押せばコマンドが実行されます。アラ簡単。

## 置換を試す

では、最も使われるコマンドの一つであろう、`substitute`コマンドを実行してみましょう。といっても、`substitute`では長すぎるので普通は`s`が使われますので、そちらで行きましょう。`foofoo`という内容のテキストを適当に作り、以下のコマンドを実行します。

```
:s/foo/bar
```

…おや、確かに置換は実行されましたが、`barfoo`となってしまいました。実は`substitute`は最初の一回のマッチだけ置換し、残りは置換しないのです。

この動作を変更するには、コマンドの最後に`/g`を追加します。ノーマルモードで`u`を押して置換を取り消し、以下のコマンドを実行します。

```
:s/foo/bar/g
```

どうでしょうか、うまく`barbar`の結果が得られたでしょうか。

## 範囲指定

さらに試してみましょう。
以下の内容のテキストを用意します。

```
hoge
fuga
foo
bar
```


そしてカーソルを`hoge`の行に移動させ、以下のコマンドを実行します。

```
:s/f/z/g
```

さて結果は…おや、変わっていないですね。実はこれがExコマンドの弱点、今いる行にしか効果がないのです。もともとVim（というより前身のVi）がラインエディタなので、そういう制約があるのだと思われます。

しかし、21世紀でも現役バリバリのエディタであるVim、そこは（少々不格好ですが）しっかりと対応しています。先ほどの置換コマンドをファイル全体に適用させてみましょう。

Exコマンドの書式は

```
:[range]Command
```

という書式です。そしてファイル全体を表すには`%`を使います。よって、ファイル全体に対して置換する際のコマンドは

```
:%s/f/z/g
```

となります。

ね、簡単でしょう？

## 続・範囲指定

範囲の指定方法は`%`以外にもたくさんあります。むしろ、`%`の指定は方法としては特殊な部類に入ります（が、多用されるので自然とおぼえます）。最も汎用的な説明としては、`行指定子,行指定子`となります。行指定子には数字の他に正規表現を使うこともできます。さらにオフセットも使えるために異常なほど高度な範囲指定も行えます。例えば、「5行目から下、最初に`foobar`という文字列が出現する行の2行上まで」であれば

```
:5,/foobar/-3
```

のように書けます（`-3`となっているのは、該当行を-1とカウントしているためです）。
…とまあ仰々しく説明しましたが、ぶっちゃけ、使用頻度としては`%`がダントツ一番なため、それだけ覚えましょう。

## ビジュアルモードと組み合わせる

…おっと、一つ忘れていました。範囲指定をするのに書式を使って指定するのは慣れれば速くてクールだし、何よりハッカーっぽいのですが、実際問題として、範囲というのは人間の目に見えるものなので、それをインタラクティブに表わしてくれる、ようするにマウスで範囲選択するみたいに指定できると便利ですよね。まあ、Vimmerとしては範囲選択にマウスを使った時点で敗北感を噛みしめるわけですが、範囲選択とハイライトをインタラクティブに行えるモードがVimには用意されています。それが**ビジュアルモード**です。

このモードはその説明だけで本の1章に値するほどのものですが、ここではあくまでExコマンドの説明に必要な分にとどめておきます。

ノーマルモードで`v`を押すとビジュアルモードに移行しますので、`w`とかを押して適当にカーソルを移動させましょう。すると、移動した部分がハイライトされていると思います。ある程度ハイライトされた部分が大きくなったら、`:`を押しましょう。すると…

おや、コマンドラインに`:'<,'>`と表示されていますね。これは、**今ビジュアルモードで選択した部分がすでに範囲指定されている状態**であることを意味しています。続けて置換コマンドを実行すると、範囲内のみが置換の対象となることがわかるかと思います。

これは実際非常に便利です。というのは、実際のプログラミングにおいては、置換したい部分が事前にハッキリしていることは稀であり、かつ微妙に散らばっている場合が多いからです。そんな場合は、事前に範囲を綿密に考えてからやるより、ビジュアルモードのままファイル内を移動し、ここだと思ったタイミングで置換するほうが効率的な場合も多いと思います。

## 外部コマンドを使ってみる

（以下は微妙にオマケっぽいです）

ところで、コマンドラインと言えば当然、シェルが思い浮かびます（ですよね？）。シェルのコマンドはVimで使えるのでしょうか。例えば、

```
:pwd
```

おお、動いた。なんだ、できるんじゃん。じゃあ、

```
:ls
```

！？

なんかよくわかんないのが出力された！

実はこのコマンド、listはlistでも、バッファーのリストを表示するコマンドなんですね（バッファーというのはこの場合は開いているファイルのことです）。いやでも、俺はカレントディレクトリのファイル一覧が見たいんだ！という人のためにVimが用意してくれている方法はこちら。

```
:!ls
```

出力が画面下方に表示されたと思います。今度はちゃんと期待通りでしたね。ちなみにオプションも渡せますので、

```
:!ls -la
```

とすることもできます。画面が出力に埋め尽くされると思いますが…

## よく使うコマンドリスト

せっかくなのでよく使うコマンドを挙げておきます。

|コマンド（）内は省略可|説明|
|:----------------:|:-:|
|q(uit)|言わずと知れた終了コマンド|
|w(rite)|これも必須、保存コマンド|
|s(ubstitute)|置換コマンド、範囲指定と合わせて|
|h(elp)|ヘルプを見ます、ヘルプ重要|
|ver(sion)|バージョン情報、どの機能が有効化されているか確かめるのに便利|
|reg(isters)|レジスタの一覧を表示します。コピペ時に便利|

この記事を最後まで呼んでくださった上級者の方は、自分でよく使うコマンドを教えてくださいー。
Android 2.xのアプリを簡単に最新の見た目にする方法

昔ブログでも書いたことがあった記事だけど、今回AndroidStudioが出たこともあり、
再度、掲載します。


Android 3.0以降UIも含めて、Androidの見た目はドラスティックに変わりました。
でも様々な事情で、敢えてUIの変化をしなかったアプリもあります。
それを最新のUIにするために作り直す必要はないんです！！！
簡単に出来ちゃうんです！

ではその方法。
まず、
<uses-sdk>タグ部分を変更します。

android:minSdkVersionを「11以上」に変更し、
android:targetSdkVersionを「14以上」に変更します。


次に
<application>タグにテーマを追加します。

android:theme="@android:style/Theme.Holo.Light"

などとテーマを追加します。


はい！以上です！
簡単でしょ？

もちろん、Fragment等を使いたい場合は、プログラムの変更が必要です。


ただし注意！
この変更を行うと、2.xでは動作しなくなります！！！
ご注意を！！！
BMI指数を求める


こんにちは、[@Solpha](https://twitter.com/solpha)です。

今読んでいる参考書を1/3ぐらいしか読み進めていないくせに、既に発狂しそうになってきたので、モチベーション維持のため、今ある知識を活用してBMI指数を計算するプログラムを書いてみました。

#概要
BMI（体格指数：Body Math Index）指数を計算できるプログラムをつくり、肥満度チェックを行う。

##BMI指数の計算式

![BMI.png](https://qiita-image-store.s3.amazonaws.com/0/46695/007132e4-3e57-2e5b-f378-e113f34ea8e5.png "BMI.png")

#コード

```go:bmi.go
package main

import "fmt"

func main() {
	var height, weight, bmi float32

	// 身長と体重を入力
	fmt.Printf("身長（cm）を入力してください --> ")
	fmt.Scanln(&height)
	fmt.Printf("体重（kg）を入力してください --> ")
	fmt.Scanln(&weight)

	// cmで入力した身長をm換算
	height = height / 100

	// BMIを計算
	bmi = weight / (height * height)

	//BMI値を元に肥満度を判定し、結果を表示。
	if bmi < 18.5 {
		fmt.Printf("あなたのBMI指数は\"%.1f\"で、「痩せぎみ」です。\n", bmi)
	} else if 18.5 <= bmi && bmi < 25.0 {
		fmt.Printf("あなたのBMI指数は\"%.1f\"で、「普通体重」です。\n", bmi)
	} else {
		fmt.Printf("あなたのBMI指数は\"%.1f\"で、「肥満体型」です。\n", bmi)
	}

}

```

##実行結果

```
$ go run bmi.go
身長（cm）を入力してください --> 177.5
体重（kg）を入力してください --> 68.5
あなたのBMI指数は"21.7"で、「普通体重」です。
```

##ポイント

- 身長をm換算するのが面倒なので、入力は一般的なcmで受け付け、プログラム内でm換算するようにした。
- そのままBMI値の結果を表示させると小数点以下数桁が表示されてしまうので、Printf関数で「%.1f」とすることで、小数点以下1桁（2桁目を四捨五入してるっぽい）までを表示させるようにした。
- 自分は”普通体重”らしい。

#所感
これぐらいの条件分岐であれば頭が追いつくのですが、これから先、より複雑になった時に頭がついていくかが心配です。

まぁ、深く考えずに楽しんでやります。プログラムを仕事にしてる人間じゃないですしね・・・。
Ruboty | Ruboty Twitter Adapter でツイートボット を作成 ( ローカル環境確認 ) #ruboty #twitter

# Ruboty | Ruboty Twitter Adapter で <i class="fa fa-twitter" style="font-size:1em;"></i> ツイートボット を作成 ( ローカル環境確認 )

## <i class="fa fa-cubes" style="font-size:1em;"></i> 概要
Ruboty Twitter Adapter でツイートボットを作成します
( ローカル環境での確認 )

## <i class="fa fa-files-o" style="font-size:1em;"></i> 手順
### <i class="fa fa-cube" style="font-size:1em;"></i> ruboty の generate オプションでひな形を生成します

~~~bash
$ ruboty -g
$ tree
.
┗ ruboty
    ┗ Gemfile
~~~

### <i class="fa fa-cube" style="font-size:1em;"></i> ruboty ディレクトリに移動

~~~bash
$ cd ruboty
~~~

### <i class="fa fa-search-plus" style="font-size:1em;"></i> Gemfile を確認

~~~bash
$ cat Gemfile
source "https://rubygems.org"

gem "ruboty"
~~~

### <i class="fa fa-edit" style="font-size:1em;"></i> Gemfile を編集

* <i class="fa fa-github-square" style="font-size:1em;"></i> [ruboty-twitter GitHub](https://github.com/r7kamura/ruboty-twitter) を追加
* <i class="fa fa-github-square" style="font-size:1em;"></i> [ruboty-eto GitHub](https://github.com/tbpgr/ruboty-eto) を追加（動作確認用に追加しただけで、深い意味はない）

~~~ruby
source "https://rubygems.org"

gem "ruboty"
gem "ruboty-twitter"
gem "ruboty-eto"
~~~

### <i class="fa fa-cloud-download" style="font-size:1em;"></i> bundle install で gem をインストール

~~~bash
$ bundle install
~~~

### <i class="fa fa-cloud-download" style="font-size:1em;"></i> .env ファイルを作成し、 ruboty-twitter が利用する環境変数を設定します

* <i class="fa fa-external-link-square" style="font-size:1em;"></i> https://dev.twitter.com/ にて Twitter の認証情報を取得

~~~ruby
TWITTER_CONSUMER_KEY=your_twitter_consumer_key
TWITTER_CONSUMER_SECRET=your_twitter_consumer_secret
TWITTER_ACCESS_TOKEN=your_twitter_access_token
TWITTER_ACCESS_TOKEN_SECRET=your_token_secret
~~~

### <i class="fa fa-play" style="font-size:1em;"></i> .env ファイルを読み込み、 ruboty を起動します

~~~bash
$ bundle exec ruboty --dotenv
~~~

## <i class="fa fa-twitter-square" style="font-size:1em;"></i> 試行

注意点として、 bot 用のアカウントの名前ではなく、
`ruboty command` 形式で呼び出す必要があります。
※アットマークは無し

ボット用アカウント( tbpgr_bot )で予め tbpgr のアカウントをフォローしておきます。
そして、 tbpgr のアカウントで対象コマンドをツイートします。
すると、 TL のストリームからコマンドを受け取り、 tbpgr_bot が Handler + Action を実行します。

* tbpgr の tweet

~~~
ruboty eto name
~~~

* tbpgr_bot の tweet

~~~
巳
~~~

* tbpgr の tweet

~~~
ruboty eto emoji
~~~

* tbpgr_bot の tweet

~~~
:snake:
~~~

### 画像

![tweet_sample.png](https://qiita-image-store.s3.amazonaws.com/0/43480/7c3cd9c9-3f63-1c9e-232b-bc38fcce36c2.png)

## 補足
ただし、ツイッターは文字数制限や重複投稿への配慮が必要なため、
他のチャットツールと同じ処理のまま Ruboty を利用するには、やや使い勝手が悪いかもしれません。

## <i class="fa fa-arrow-circle-right" style="font-size:1em;"></i> 参照
* <i class="fa fa-github-square" style="font-size:1em;"></i> [ruboty GitHub](https://github.com/r7kamura/ruboty)
* <i class="fa fa-github-square" style="font-size:1em;"></i> [ruboty-twitter GitHub](https://github.com/r7kamura/ruboty-twitter)

## Ruboty Advent Calendar
明日は @cielavenir さんです。