OmniAICreator/Qiita-1.07M huggingface dataset:
Dropwizard 0.7.1でファイルアップロード時のリクエストから日本語ファイル名を取り出す

文字コードはUTF-8として話をすすめる。

DropwizardはRESTアクセスの解析にjerseyを使っているが、ファイルをアップロードする際にファイル名が日本語だと期待通りファイル名を取り出せない。
この問題は[こちらのスレッド](https://java.net/jira/browse/JERSEY-1428 "File name for uploaded files not decoded with the correct character set")を見るとjersey 2.2で修正されているようだ。

ところで Dropwizard 0.7.1 が標準で取り込む jersey は1.8系統。
Dropwizard は出来るだけ標準構成で使いたいのでパッケージを差し替えるような無茶な対応はせずシンプルにコードで頑張る。

レスポンスの内容とメソッドの名前が一致していないがそこはご愛嬌。

```java
@POST
@Path("/upload")
@Consumes(MediaType.MULTIPART_FORM_DATA)
public Response upload(@FormDataParam("data") InputStream inputStream, @FormDataParam("data") FormDataContentDisposition disposition) {
	String filename = new String(disposition.getFileName().getBytes(StandardCharsets.ISO_8859_1), StandardCharsets.UTF_8);
	// ここで何か処理
	
	return Response.ok(filename.getBytes(StandardCharsets.UTF_8)).build();
}
```
Chromeアプリ：screen shareを作りたい（DesktopCapture編）

chromeアプリのscreen shareでよく使われるDesktopCaptureについてメモメモ
とりあえず既にあるものを見てみる。
-----------
[chrome extensions samples の desktopcaptureからファイルを取得](https://developer.chrome.com/extensions/samples#search:desktopcapture)
![Sample Extensions   Google Chrome.png](https://qiita-image-store.s3.amazonaws.com/0/67439/bcc50728-ee44-30be-d298-fe1d275627ba.png)

前回の記事と同じようにchromeの拡張機能に読み込ませて実行すれば使える。
>[chromeアプリ：アイコンをクリックしたら表示されるアプリ](http://qiita.com/simanezumi1989/items/21577f56a2a7b715578d)

今日のテーマ：アイコンから実行できるように改良する
-----------
1.アイコンから実行できるようにmanifest.jsonに
browser_actionを追加する。またbackgroundも変更する。


```manifest.json
{
  "name": "sample app",
  "description": "sample app",
  "version": "0.1",
  "manifest_version": 2,
  "icons": {
    "16": "icon.png",
    "128": "icon.png"
  },
    "background": {
      "scripts": ["background.js"]
  },
  "permissions": [
    "desktopCapture"
  ],
  "browser_action": {
  }
}
```

<br>
2.アイコンがクリックされたら実行される命令をbackground.jsに書く。

```background.js
chrome.browserAction.onClicked.addListener(function(){
	chrome.windows.create({
		url: "index.html",
		focused: true,
		type: "popup"
	});
});
```
クリックされた時，index.htmlに基づいてページが作られる。
<br>
3.index.htmlを作る
startボタンを押せば，共有画面選択ページが開き，選択するとhtmlに共有画面が出力されるものを作る。
つまりhtmlではstartボタンとvideoがあればよいので以下のようになる。

```index.html
<video id="video" autoplay></video>

<button id="start">Start</button>
<script src="app.js"></script>
```

ただし，app.jsはstartボタンを押した時のイベントコードが記述されるjsファイルである。
<br>
4.app.jsを作る
startボタンをクリックしたら発動する命令は

```
document.getElementById("start").addEventListener("click", function(e){///}
```
となる。また共有画面選択ページを表示する命令は

```
chrome.desktopCapture.chooseDesktopMedia(
		["screen", "window"], function(streamId) {///選択した画面のIdをstreamIdとして取得している///},エラーのときに実行される関数)
```
となる。このstreamIdをつかってvideoに情報を渡す。

```
navigator.webkitGetUserMedia(
{音声：なし，画像：streamIdの情報},
function(stream){id="video"のsrcにstreamで作ったURLをわたす},
エラーのときに実行される);
```
このときstreamは{音声：なし，画像：streamIdの情報}からの情報を受け取っている。

まとめると

```app.js
document.getElementById("start").addEventListener("click", function(e){
	chrome.desktopCapture.chooseDesktopMedia(
		["screen", "window"], function(streamId) {
			navigator.webkitGetUserMedia(
				{
					audio: false,
					video: { mandatory: {
						chromeMediaSource: "desktop",
						chromeMediaSourceId: streamId
						}
					}
				},
				function(stream){
					document.getElementById("video").src = URL.createObjectURL(stream);
				},
				function(){alert("error")}
			);	
		}
	);
});
```
となる。

![スクリーンショット 2015-01-30 07.40.58.png](https://qiita-image-store.s3.amazonaws.com/0/67439/492864b7-1ca0-cf32-913e-6e9864ae6357.png)
他人が書いた良質なソースは、どこで手に入るのか？

初めまして。
現在クラウドファンディングサイトを作ろうと思い、ＰＨＰの勉強をしています。（まだ想像もつきませんが・・・。）

プログラミングの勉強方法をネットで検索してみると、「他の人が書いたソースコードをとにかく見ろ！」という話が結構出てくるのですが、htmlやcssならともかく、phpなどのサーバーサイド言語はソースが見れません。

皆さんはいつもどこで他人が書いたソースを手に入れているのでしょうか？
すごく初歩的な事かもしれませんが、良ければ教えてください。

またプログラミングの勉強をしていく中で、お勧めのやり方等あれば、それも書いていただけると非常にうれしいです。
RAID1を保持したまま、HDDを別のサーバへ移動させた。

限られた環境でしか使えない方法かもしれないが、備忘録として残す。

HDD2枚でRAID1を構成しているDELL製の古いサーバで System halt が発生した。
たまたまもう一台、同じ型のサーバがあったのでHDDだけ移設し起動を試みた。

しかし、OSが起動することはなかった。

##そうだ。RAIDカードも移設しよう。

ダメ元で、RAIDカードも古いマシンから移設し起動したところ、無事にOSが起動した。
その後問題なく使用できた。

RAIDカードは、DELL SAS6/iR RAIDカード と言うもの。
参照：http://pc.usy.jp/wiki/index.php?DELL%2FSAS6iR

他のRAIDカードで同じようになるかは分からない。

RAIDカードがシステムボード内臓のものならシステムボード毎移設すればいいのでは？
NICのMACアドレスも変わらないし一石二鳥。
故障の被疑箇所にもよりますが。
enchant.jsとtmlib.jsを使ったゲーム作成フレームワーク「enforce」モーションセンサー

ここでは、「**game01**」というディレクトリ内で作業しているという前提で説明しています。

# モーションセンサーの値を取得する
スマートフォンに搭載されている、

1. 加速度センサー
1. 重力加速度センサー
1. ジャイロスコープ

という3つのセンサーの値を、リアルタイムで格納しているグローバル変数を用意しています。

1. MOTION_ACCEL
1. MOTION_GRAVITY
1. MOTION_ROTATE

がその3つのオブジェクトです。
それぞれが各フレーム毎に値を更新されていきます。

1. MOTION_ACCEL   = [x, y, z]
1. MOTION_GRAVITY = [x, y, z]
1. MOTION_ROTATE  = [alpha, beta, gamma]

という形になっています。
グローバルなのでどこからでもアクセスすることが出来ます。
例）MOTION_ROTATE.alpha

「**MOTION_ROTATE**」の各要素は、

|要素名|回転軸|
|-----:|----:|
| alpha|  z軸|
|  beta|  x軸|
| gamma|  y軸|

での傾きになります。


---

[enforceチュートリアル一覧](http://qiita.com/digitarhythm/items/9e75c871f5ce582a4d01)
例のゲームの都市伝説を再現したかった

[すぐにけせとは (スグニケセとは) [単語記事] - ニコニコ大百科](http://dic.nicovideo.jp/a/%E3%81%99%E3%81%90%E3%81%AB%E3%81%91%E3%81%9B)

```rb:shut_you_down.rb
require 'colorize'

MESSAGE = (/ja/i === ENV["LANG"]) ? "すぐにけせ" : "SHUTDOWN"

COLOR = :light_red
BGCOLOR = :black

PROBABILITY = $DEBUG ? 1 : 65536

BEEP = true
BEEP_DELAY = 0.05

def size #画面の大きさ
  `stty size`.scan(/\d+/).map(&:to_i)
end

def cols #ヨコ
  size[1]
end

def rows #タテ
  size[0]
end

def str_cols(str) #文字列の幅。全角を2としてカウント
  # 参考: http://programming.ironsand.net/2014/get-string-size-considering-double-width-and-normal-width-ruby/
  str.chars.map{|c| c.ascii_only? ? 1 : 2}.inject(:+) || 0
end

def line(msg, separator:" ", fill_to_period:true) #横幅いっぱいの行を作る
  str = msg + separator

  (str * (cols / str_cols(str))).tap do |line|
    if fill_to_period #文字列を細切れにして右端まで詰める
      str.each_char do |c|
        break if cols - str_cols(line + c) <= 0
        line << c
      end
    end
  end
end

if rand(PROBABILITY).zero?
  msg = ([line(MESSAGE)] * rows) * "\n"
  msg = msg.colorize({color:COLOR, background:BGCOLOR}).bold

  print msg

  if BEEP #再現動画では「ビー」と鳴り続けるのでビープでも鳴らしておく
    Signal.trap(:INT){break} # Control + Cで通常の処理に戻る (exitしない)
    loop {print "\a"; sleep BEEP_DELAY}
  end
end
```

とあるゲームの起動時に **1/65536** の確率で発生すると言われている例のアレです。
イタズラに使えるかも？

普通にやってたらほぼ100%何も起こりません。
Rubyのコマンドラインオプションで`-d`をつけると100%発生します。
終了は`Control + C`です。

けっこうガセっぽくて、Youtubeやニコニコの動画はフェイクだそうです。
確率は65535の間違いなんじゃ？

<div color="#ff0000" bgcolor="#000000" style="color:red;background:black">(KobitoではHTMLが使えるのでこのページにも黒画面に赤文字で書こうと思ったのですが、Qiitaではspanタグでcssいじったりできないんですね)</div>

# 追記

一行で表示できた。

```
ruby -e 's=%|すぐに消せ　|;v,h=`stty size`.split.map(&:to_i);puts [s.ljust(h/2,s)]*v'
```
PHP5.1で新規開発するよ！

今さらPHP5.1で新規開発とかちょっとよくわからないことを言われたので、泣きながらバージョンアップによる機能の追加履歴をチェックする。
うっかり\_\_DIR\_\_とか書くだけで死ぬとかひどい。
他にも色々あるけど、ひっかかりそうな有名どころだけ。

*PHP5.2*
http://php.net/manual/ja/migration52.php

・DateTime
・ArrayObject::*sort
・Filter
・JSON
・PDO::ATTR_DEFAULT_FETCH_MODE

*PHP5.3*
http://php.net/manual/ja/migration53.php

・\_\_DIR\_\_ / E_DEPRECATED
・名前空間
・遅延静的束縛
・クロージャ
・クラス外のconst
・\$a ?: $b;
・Fileinfo
・Phar
・DateInterval / DatePeriod
・SplFixedArray / SplPriorityQueue / SplQueue
・PDO default charset
・goto

*PHP5.4*
http://php.net/manual/ja/migration54.php

・[];
・trait
・foo()[0];
・(new HOGE())->bar();
・SessionHandler / session_register_shutdown

*PHP5.5*
http://php.net/manual/ja/migration55.php

・ジェネレータ
・finally
・password_hash
・[1,2,3][0];

*PHP5.6*
http://php.net/manual/ja/migration56.php

・ http://qiita.com/rana_kualu/items/206d786a2be7942c6dc3 を参照。

以上の機能が『使えない』。

*その他*

ちょっと対象サーバを見てみる。
・register_globalsがon
・magic_quotes_gpcがon

夜逃げしていいっすかね？
Git初心者に役立つ「よく使うコマンド集」②

[Git初心者に役立つ「よく使うコマンド集」](http://qiita.com/chihiro/items/fc94e5de02fd37328040)
の続きで書こうと思います。

### リモートリポジトリを追加する
>git　remote　add　[reponame]　[url]

このように、リモートリポジトリに名前([reponame])をつけることができます。
ちなみにクローンしたリポジトリの名前はデフォルトで **origin** という名前がついています。

### リモートリポジトリの一覧を表示する
>git　remote

自分で設定した名前が表示されます。

```lang:ex
git　remote

origin
other
```

urlをみたいときは**-v**を付けます。

```lang:ex
git　remote　-v

origin git://github.com/*****/*****.git (fetch)
origin git://github.com/*****/*****.git (push)
other git://github.com/*****/*****.git (fetch)
other git://github.com/*****/*****.git (push)
```

### fetchする
>git　fetch　[reponame]

### ローカルにブランチを作成する
>git　checkout　-b　[branchname] [(reponame/) branch]

branchnameを指定して、ローカルにブランチを作成します。
**-b**を付けることでブランチを作成した後、自動的にcheckoutします。
リモートリポジトリが一つ(origin)のみの場合は**reponame/**がなくても実行できます。

### pushする
>git　push　[reponame]　[branchname]:[branch]

**reponame**リポジトリの**branch**に、ローカルブランチの**branchname**をプッシュします。
しばしば以下のように省略されます。

```lang:ex
git push origin develop
```

省略して書かないと以下のようになります。

```lang:ex
git push origin develop:develop
```
ローカルブランチとリモートブランチが同じ名前の場合は省略して書くことができます。

### pullする
>git　pull　[reponame]　[branch]

### ブランチを削除する
>git　branch　-d　[branchname]

### リモートリポジトリを削除する
>git　remote　rm　[reponame]

### ブランチの一覧を見る
>git　branch　-a

**-a**をつけることでローカルブランチだけではなく、リモートブランチの一覧も一緒に表示することができます。
EC2のインスタンスIDを中から取得する

## 169.254.169.254
169.254.169.254 というリンクローカルアドレスにアクセスすると様々なそのインスタンスに関連する情報が取得できる．このアドレスはホストOS側が管理していると思われるので，仮にDocker等を使ってさらに仮想化した場合も参照できる．

```
$ curl --fail http://169.254.169.254/latest/meta-data/instance-id
i-364653c4
```

## スポットインスタンスの終了時刻
多くのアドレスは常に存在するがスポットインスタンスの終了時刻を返してくれる URL は必要な時にしか存在しない．

終了時刻が決定している時：

```
$ curl --fail http://169.254.169.254/latest/meta-data/spot/termination-time
2015-01-28T15:41:19Z
```

終了する予定が今のところない時：

```
$ curl --fail http://169.254.169.254/latest/meta-data/spot/termination-time
curl: (22) The requested URL returned error: 404 Not Found
```

## その他
その他の詳しい情報は
http://docs.aws.amazon.com/AWSEC2/latest/UserGuide/ec2-instance-metadata.html
ちょっと暗いUIColorを取得する

UIColorでちょっと暗い色が欲しいということがあると思います。

```objc
        CGFloat hue,saturation,brightness,alpha;
        [color getHue:&hue saturation:&saturation brightness:&brightness alpha:&alpha];
        color = [UIColor colorWithHue:hue saturation:saturation brightness:brightness/2 alpha:alpha];
```

このようにhueの各要素を取得し、明るさを半分にして返せばちょっと暗い色を作ることができます。
ただし、brightnessが暗すぎる場合は上手くいかないように見えるので気をつけてください。
ターミナルの色設定 Tangoカラーパレット風

16色原色は目に厳しいので差し替えたいのだが、よく設定値を忘れるのでメモしておく。(Evernoteに入ってたやつから転記)

![commandprompt.png](https://qiita-image-store.s3.amazonaws.com/0/1126/18a8fc6d-48a7-d6b1-b2a9-9f6a740ec2ff.png)

基本的に[Tango Icon Theme Guidelines - Tango Desktop Project](http://tango.freedesktop.org/Tango_Icon_Theme_Guidelines)をベースにし、シアン系の色がTangoには含まれていないので適当に足した感じ。

```plain
Windows用

black 23 26 27
darkblue 52 101 164
darkgreen 78 154 6
darkcyan 0 153 204
darkred 204 0 0
darkmagenta 117 80 123
darkyellow 196 160 0
gray 186 189 182
darkgray 136 138 133
blue 114 159 207
green 138 226 52
cyan 51 181 229
red 239 41 41
magenta 173 127 168
yellow 237 212 0
white 238 238 236
```

```plain
ASCIカラーパレット順
0 black 23 26 27
1 darkred 204 0 0
2 darkgreen 78 154 6
3 darkyellow 196 160 0
4 darkblue 52 101 164
5 darkmagenta 117 80 123
6 darkcyan 0 153 204
7 gray 186 189 182

8 darkgray 136 138 133
9 red 239 41 41
10 green 138 226 52
11 yellow 237 212 0
12 blue 114 159 207
13 magenta 173 127 168
14 cyan 51 181 229
15 white 238 238 236
```
fluentd に elasticsearch プラグインを入れる (Ubuntu 14.04)


fluentd から elasticsearch へoutput するときに
プラグインが必要だが、ややはまったのでメモ

```bash
sudo apt-get install libcurl4-openssl-dev 
sudo apt-get install make

sudo /opt/td-agent/embedded/bin/fluent-gem install fluent-plugin-elasticsearch
```
[Unity] UnityのShaderでステンシルバッファを試す


ステンシルバッファについてはこちらの記事が詳しいです。
[ステンシルバッファ | wgld.org](http://wgld.org/d/webgl/w038.html)

上記サイトから説明を引用させてもらうと、

>ステンシル( stencil )は直訳すると[ 型紙 ]や[ 原紙 ]といった意味になる言葉で、3D プログラミングにおいては[ 型抜き ]という意味としてステンシルバッファは利用されています。

ということ。
要は、3Dのオブジェクトにマスクを掛けることができる、というものです。
そして当然、Unityでも同じように処理することが可能です。（[Unityのドキュメントはこちら](http://docs-jp.unity3d.com/Documentation/Components/SL-Stencil.html)）

## サンプルコード

Unityのドキュメントに書かれているコードを引用すると、以下のように記述します。

```hlsl:stencile-sample
Shader "Red" {
	SubShader {
		Tags { "RenderType"="Opaque" "Queue"="Geometry"}
		Pass {
			Stencil {
				Ref 2
				Comp always
				Pass replace
				ZFail decrWrap
			}

			CGPROGRAM
			#pragma vertex vert
			#pragma fragment frag
			struct appdata {
				float4 vertex : POSITION;
			};
			struct v2f {
				float4 pos : SV_POSITION;
			};
			v2f vert(appdata v) {
				v2f o;
				o.pos = mul(UNITY_MATRIX_MVP, v.vertex);
				return o;
			}
			half4 frag(v2f i) : COLOR {
				return half4(1,0,0,1);
			}
			ENDCG
		}
	} 
}
```

具体的には

```hlsl:stencile-snipet
Stencil {
	Ref 2
	Comp always
	Pass replace
	ZFail decrWrap
}
```

の部分がステンシルを実行している箇所です。

解説の詳細は最初に紹介した記事を見ていただいたほうがいいので割愛します。
概要としてはシェーダの役割である「ピクセルに対するレンダリング」を行う際、該当のシェーダのピクセルをレンダリングすべきかどうか、の判断を行うために使われるのがこの **ステンシルバッファ** です。

つまり、このステンシルバッファを使った「ステンシルテスト」に合格しなかった場合はそのシェーダの該当ピクセルへのレンダリングはたんに無視されます。
そして、現在計算中のピクセルに対してのステンシルテストの結果によって該当ピクセルのステンシル値の値が変更されます。

変更されうるステータスとしては以下の3つがあります。

- 合格
- 不合格
- 合格したが深度テスト不合格

合格／不合格は読んで字のごとくなので問題ないでしょう。
最後の項目は、「ステンシルテストには合格したが、深度テストが不合格でピクセルがレンダリングされなかった場合」にどうするかを決めるものとなります。
（ピクセルがレンダリングされるかどうかは、ステンシル以外にも深度値によるテストがあるためです）

ステンシルの設定については以下の構文になっています。

### 構文

```hlsl:syntax-stencil
Ref [整数値]
Comp [比較関数]
Pass [合格]
Fail [不合格]
ZFail [合格だが深度テスト不合格]
```


| 種類 | 意味 |
|:----|:-----|
| Ref | ステンシル値。比較対象とされる値。 |
| Comp | 比較関数。Equalなどいくつかの種類がある。 |
| Pass | 合格時にステンシル値をどうするか。 |
| Fail | 不合格時にステンシル値をどうするか。 |
| ZFail | 合格だが深度テストが不合格だった場合にどうするか。 |


#### 比較関数

比較関数は以下のものがあります。（ドキュメントから引用）

| 関数名 | 意味 |
|:------|:------|
| Greater | 参照値がバッファ値より大きい参照値のピクセルのみレンダリング |
| GEqual | 参照値がバッファ値と等しいまたは大きい参照値のピクセルのみレンダリング |
| Less | 参照値がバッファ値より小さい参照値のピクセルのみレンダリング |
| LEqual | 参照値がバッファ値と等しいまたは小さい参照値のピクセルのみレンダリング |
| Equal | 参照値がバッファ値と等しい参照値のピクセルのみレンダリング |
| NotEqual | 参照値がバッファ値と等しくない参照値のピクセルのみレンダリング |
| Always | 常にステンシル テストは成功 |
| Never | 常にステンシル テストは失敗 |

#### 処理

また、合格時などの処理については以下の項目があります。（ドキュメントから引用）

| 項目 | 意味 |
|:------|:------|
| Keep | バッファの現在コンテンツを保持します |
| Zero | バッファにゼロを書き込みます |
| Replace | 参照値をバッファに書き込みます |
| IncrSat | バッファの現在値を増分させる。値がすでに 255 の場合は維持する |
| DecrSat | バッファの現在値を減分させる。値がすでに 0 の場合は維持する |
| Invert | すべてのビットを無効にする |
| IncrWrap | バッファの現在値を増分する。値がすでに 255 の場合は 0 にする |
| DecrWrap | バッファの現在値を減分する。値がすでに 0 の場合は 255 にする |
eclipseを使って、fuelphpでcoreへ定義移動する方法

fuelphpでcoreクラスの定義にジャンプしたいことがあります。

例えば、`welcome.php`には下記の記述がありますが、

```php:welcome.php
public function action_index()
{
  return Response::forge(View::forge('welcome/index'));
}
```

`Response::forge`とか`View::forge`にカーソルを合わせて`F3`を押しても定義にジャンプする事はできません。

@kenjis さんのブログにある、[Eclipse で FuelPHP のコード補完を行わせる冴えたやり方](http://d.hatena.ne.jp/Kenji_s/20120123/1327301678)を参考に定義ジャンプできるように設定している方もいるかと思いますが、今回は、新しいファイルを生成することなく、定義ジャンプできるようにします。

やり方は簡単です。
Eclipseでグレップ置換して、`Fuel`名前空間を`\`から始めるようにします。

```php
- namespace Fuel\Core;
+ namespace \Fuel\Core;
```

ちなみに、グレップ置換は

```
windows: ctrl+h
mac: command+h
```

から、置換ボタンを押すことで可能です。
EHCacheのgetSizeは厳密ではない

## やりたかったこと
EHCacheを使って、揮発するCacheを作る。そのとき、getする前に揮発したことを検知して、特定の処理を行なう、みたいな処理をしたかった。

ので、揮発しないHeapでsizeを保存しておき、必要なときにgetSizeを呼び出して揮発をチェックしようとした。

## Cache.getSizeの挙動
ところがCache.getSizeの挙動は厳密ではない。少なくとも揮発したレコードの値が反映されるまで少々掛かる。

http://ehcache.org/apidocs/2.9/net/sf/ehcache/Cache.html#getSize%28%29

英語読めないが（笑）多分そんなようなことが書いてある。厳密なsizeを求めたいときはgetKeysWithExpiryCheck().size()を使えば良さそうだ。

とはいえ非常に重い処理だと思われるので、そもそも頻繁に揮発のチェックをするのは、原理的に無理だと思った方が良さそうだ。
bashスクリプトをツール一発でキレイに整形する

bashスクリプトのインデントがぐちゃぐちゃになってウンザリという時に、ツール一発で簡単にキレイにしてくれるものを探していたら、[beautify_bash](http://www.arachnoid.com/linux/beautify_bash/)を見つけた。

早速使ってみたところ、想定しているRubyのバージョンが古いらしく、`String`に対する`each`メソッドが存在しないというエラーが。

> undefined method `each' for data:String (NoMethodError)

ちょっと調べてみたところ、Ruby1.9からeachメソッドは[廃止されたとのこと](http://ref.xaio.jp/ruby/classes/string/each)。

ということで、エラーになっている部分を`each_line`メソッドに書き換えたところ、ちゃんと動くようになり、bashスクリプトの整形も期待していた動作をしてくれるようになった。
bashスクリプトをgitレポジトリにpushしたときに自動的にこのスクリプトを適用するようにしておけば幸せになれそうだ。

diffはこちら。

```diff:beautify.rb
diff --git a/beautify_bash.rb b/beautify_bash.rb
index 601ca5e..d0b0f9e 100644
--- a/beautify_bash.rb
+++ b/beautify_bash.rb
@@ -42,7 +42,7 @@ module BeautifyBash
       ext_quote_string = ""
       here_string = ""
       output = []
-      data.each do |record|
+      data.each_line do |record|
          record.chomp!
          stripped_record = record.strip
          if(in_here_doc)
```

ついでに[github](https://github.com/mtdmn/beautify_bash)にもあげておいた。
[エンジニアCROSS 2015] はやぶさ２開発者に聞く～一度きりのテスト対策～

- [プログラム説明](http://2015.cross-party.com/program/x1)
- 有料の講演なので書いて良いか気になりましたが、[ブログに書くまでが勉強会](https://twitter.com/e_s_cross/status/560790097222574081)とのことなので書きます

# 自己紹介

### Web 系、業務系システム一般

- `t_wada`
- テストが大事という考えを持っていて、`power-assert` 作ってる

### TV 連動プラットフォーム　「M.I.E.S」

- `鳥居さん / バスキュール`
-  リアルタイムにクイズ・アンケート・応援をアプリ（スマホアプリ・web）から受け付けて、TV コンテンツに反映させる
 - ex) TV に流したゲーム画面（アクション）をスマホから操作して、リアルタイムに集計・ランキング・表示する
- サービス特徴
 - アクセスのスパイクが発生する
 - TV 中だけサーバーが必要なので disposable なインフラ設計
- サービス設計
 - スパイクに対しては、視聴率などからアクセス数をある程度見積もる
 - 本番が来たらスケールアウト出来るようにして、かつ、複数同時並行で環境構築が必要になるのでそれも自動化している

### はやぶさ 2 の機体制御担当

- `成田さん / 航空宇宙エンジニア`
- ロケット
 - 衛生を軌道まで運ぶ
- 衛生
 - 地球や天体を観測する
 - 探査機とも呼ぶ
- 航法・誘導・姿勢制御（を成田さんは開発担当している）
 - C で書く
 - 位置を求める・ex) GPSなど
 - 目的地点まで誘い導くこと・ex) 東京に電波を要求するなど
 - 姿勢を自由に変える・ex) 太陽光を安定的に受け止めたい、通信を安定させるために、写真を撮ったり
- `EDL` を JAXA, JPL で研究していた
 - Entry・大気圏などを高速で超える
 - Decent・地表に降下する
 - Landing・ピンポイントに止める

# テスト

### テレビ連動サービス

スパイクへの対応

- Node.js 製の負荷テストツールを自作して使っている
- 50 万人など対応人数を超えたら参加できないようにするなど、制約をつけた運用でリスクヘッジしている

### 航空宇宙

地上で宇宙空間を可能な限り再現して試したりはしている

とはいえ、完全な再現は出来ないので、過去の実績数をもとに方法や材料などを評価して選択することで、再現出来ないことによるリスクを抑える

- なので、はやぶさ2 もローテクで支えられている

用語としては、`ミッション`と`バス`の 2 つがある

- 新しい技術を使う場合には、それを`ミッション`として行う（ex. 新型バッテリーを搭載するミッション）
- 月探査などの`ミッション`には、実績のある古い技術（`バス` = 手段）を使う（ex. 新型バッテリーをそこで使ったりはしない）

知見の溜め方・属人性の排除

- `Lessons & Learn（気づき事項）` というやり方を採用して、全員が日々書かないといけない
- それが体系的にまとまっているのが、`システムエンジニアリング`
 - アポロ開発以来、発展している学問体系で、一般的に採用されている
ListViewの選択項目を取得/設定する

※前からWPFやってる人には常識なんだろうなあとは思うけどそういうことは気にしない

## 問題

ListViewの選択項目をプログラムから操作するには、VMに`IsSelected`プロパティを用意して、`ListViewItem.IsSelected` にバインドすればよい

```xml
<ListView.ItemContainerStyle>
  <Style TargetType="ListViewItem">
    <Setter Property="IsSelected" Value="{Binding IsSelected}" />
  </Style>
</ListView.ItemContainerStyle>
```

という記述がぐぐるとよく見つかるのだけど、これは正しくない。

ListViewはデフォルトで仮想化されるため、見えている範囲＋αの分しかListViewItemのインスタンスは生成されない。ListViewItemが存在しなければバインディングも働かないので、範囲外の項目に対してはVとVMでの同期は行われない。

実際どういう動きになるのか、簡単なテストプログラムで確認してみた。

## テストプログラム

### 説明

画面はこんな感じ。
![SelectedItemsTest.png](https://qiita-image-store.s3.amazonaws.com/0/11109/0a7d8a98-97bd-655d-5ca6-3be2c8e233ab.png)

```csharp:item.cs
public class Item : INotifyPropertyChanged
{
    public string Name { get; }
    public bool IsSelected { get; set; }
}
```

こんな感じのViewModelがあって、そのコレクション(要素数50、Name=00～49)が左上のListViewと右のItemsControlのItemsSourceに指定されている。

ListViewの方では `ListViewItem.IsSelected` と `Item.IsSelected` が双方向でBindingされていて、ItemsControlの方では `Item.IsSelected` がtrueなら背景色が変わるようになっている。

ソースは [こちら](https://gist.github.com/wonderful-panda/6a4cdfa1913585af5f85)

### 動かしてみる

ListView上で適当なアイテムを選択してみると、ViewModel側のIsSelectedもtrueになる。
![SelectedItemsTest-1.png](https://qiita-image-store.s3.amazonaws.com/0/11109/06ea822e-9f0e-2bae-e070-e046be10cd93.png)

Ctrl+AでListView上のアイテムを全選択してみる。
`ListView.SelectedItems` には50項目すべてちゃんと追加されるけれど、ViewModel側の`IsSelected`は、画面に見えているもの＋αしか変わっていない。
![SelectedItemsTest-2.png](https://qiita-image-store.s3.amazonaws.com/0/11109/9aec555e-b5bd-3550-92d2-4a0d3e47ebb8.png)

そのままListViewをスクロールしていくと、それに合わせてViewModel側の`IsSelected`も順番にtrueに変わっていく。
![SelectedItemsTest-3.png](https://qiita-image-store.s3.amazonaws.com/0/11109/b4a12a93-0404-adf3-916e-8b1b8d3b5ff6.png)

すべてのViewModelの`IsSelected`がtrueになったところで、またListView上の適当な項目をクリックしてみる。
全選択が解除されてその項目だけが選択された状態になるので `SelectedItems.Count` は1になるけれど、画面に見えていない部分のViewModelの`IsSelected`はtrueのまま。
![SelectedItemsTest-4.png](https://qiita-image-store.s3.amazonaws.com/0/11109/2588138d-193e-4e80-9582-e4cd699622ce.png)

---
ViewModel側で `IsSelected` を操作した時の挙動も確認する。
ListView上に見えているItem-01の`IsSelected`をtrueに変更すると、`SelectedItems` にも反映されるが、
![SelectedItemsTest-5.png](https://qiita-image-store.s3.amazonaws.com/0/11109/7357e5d0-8257-c849-749f-0d8508bbe367.png)

見えていないItem-49の`IsSelected`をtrueにしても `SelectedItems` には反映されない。
![SelectedItemsTest-6.png](https://qiita-image-store.s3.amazonaws.com/0/11109/85267d45-8eb0-2ab7-eb54-dd5c25f98cca.png)

## 解決策
* `ListViewItem.IsSelected` に対するバインディングは `OneWay` (VM -> Vのみ)にする
* `ListView.SelectedItems` の内容は一切信用しない
* VからVMへの反映は、`SelectionChanged` イベントで自力でやる

```csharp
void lvw_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    foreach (var item in e.RemovedItems.Cast<Item>())
        item.IsSelected = false;
    foreach (var item in e.AddedItems.Cast<Item>())
        item.IsSelected = true;
}
```

とのこと。
IsSelectedに対するバインディングをしないならSelectedItemsを見ても大丈夫っぽいけど。


(参考) [VirtualizingStackPanel + MVVM + multiple selection](http://stackoverflow.com/questions/1273659/virtualizingstackpanel-mvvm-multiple-selection)
構造体のフィールドを列挙する

```go
package main

import (
	"reflect"
	"strconv"
)

type Test struct {
	Field1 string
	Field2 string
	Field3 int
}

func main() {

	st := Test{"value1", "value2", 1234}

	v := reflect.Indirect(reflect.ValueOf(st))
	t := v.Type()

	for i := 0; i < t.NumField(); i++ {
		// フィールド名
		println("Field: " + t.Field(i).Name)

		// 値
		f := v.Field(i)
		i := f.Interface()
		if value, ok := i.(int); ok {
			println("Value: " + strconv.Itoa(value))
		} else {
			println("Value: " + f.String())
		}
	}
}

```
[https://play.golang.org/p/krjCI9Zvhn](https://play.golang.org/p/krjCI9Zvhn)
Mac OS X Dockメニュー

昔作ったJavaScriptのDockメニューを、jQuery抜きのVanillaで作りなおしたので紹介します。
![Dock](https://qiita-image-store.s3.amazonaws.com/0/62792/1b34bb18-2f99-c98a-0139-357f141bebc4.gif)
何はともあれ、上図のようなマウスオーバーで拡大するメニューで、一時期はいろんなjQueryプラグインなどが出て流行った感じでしたが、なんともしっくりしないので自分で作ったものです。

最近アイコンをフォントじゃなくてSVGにしたものを作りなおしました。
[egashira.jp](https://egashira.jp/javascript-osx-dock)を見てくださいな

コードは、[github](https://github.com/EgaK/Javascript-dock)においてありますが、依存関係とかないのでZIPファイルをそのままダウンロードして解凍しindex.htmlファイルをブラウザで開けば動作確認できます。

jsファイルだけならmin版が圧縮しないでも５００バイト程度なので、わりと使いやすいと思います。
各アイコンはアイコンフォントを使用して作ったもので、[glyphter](http://glyphter.com/) とか [icomoon](https://icomoon.io/)のサービスを使って簡単無料で作れますよ。

cssも書く必要がありますが、index.html内に書いてあるスタイルを参考にすれば難しいことはないと思います。
Mercurial-hgrcメモ

Mercurialを使用しcommitなどを行う場合,hgrcファイルを設定する。
これはhgrcの設定についての備忘録です。
そのうちGitHubにファイルを上げたい。

hgrc
--------------------
[ui]
username = user-id <user@template.com>
editor = vim

[extensions]
color = 
graphlog =
info = /.hgdir/info.py

[color]
mode = ansi

[alias]
slog = log --template '{rev}:{node|short} {desc|firstline}\n'

--------------------

・hgrcの内容説明
user名 & mail-address
username = user-id <user@template.com>

エディターにはvimerなのでvimを設定
editor = vim

以下を設定するとhg infoコマンド(svn info相当)が実行可能となる
info = /.hgdir/info.py

以下を設定するとhg glogコマンドが実行可能となる
graphlog =

info.pyは以下のURLから取得し上記に指定したフォルダに格納する
URL:https://www.mercurial-scm.org/wiki/InfoExtension

slogはlogコマンド表示を1行に要約してくれる(結構便利)
slog = log --template '{rev}:{node|short} {desc|firstline}\n'

この便利コマンドは以下のURLが元ネタ
URL:http://ja.hgtip.com/tips/beginner/2009-10-07-shortlog-for-fun-and-profit/


hgrcのマニュアルは以下を参照
http://mercurial-users.jp/manual/hgrc.5.html
showdownについて


[showdown](https://rubygems.org/gems/showdown)という Gem を(ちょっと前に)作ったので、勝手に紹介させていただきます。

# showdown とは？

Ruby で作った Markdown ビューワーです。

![screencast.gif](https://qiita-image-store.s3.amazonaws.com/0/13998/b7d50137-7cfb-8488-64a9-c02be042bd83.gif)

ファイルの更新を検出して、（ほぼ）リアルタイムで変更が反映されます。

# インストール

※ Ruby が入っていない場合は、rbenv 等を使って Ruby をイントールしてください。

```
$ gem install showdown
```

# 使い方

```
$ showdown /path/to/your.md
tartget: /path/to/your.md
Thin web server (v1.6.3 codename Protein Powder)
Maximum connections set to 1024
Listening on 0.0.0.0:3000, CTRL+C to stop
```

ブラウザで `http://localhost:3000` にアクセス！
指定したファイルをエディタで更新すると、ブラウザ上のプレビューも更新されます！

詳しい GitHub の README を御覧ください。
https://github.com/toku345/showdown
ダイアログのボタンのOSごとの表示順について

#概要
* ダイアログに表示されるボタンの表示順がOSごとに違ってたので整理してみました。
* 誤りなどあったら指摘いただけるとありがたいです。

# 確認用コード
メインとなるアクティビティのonCreateに以下の記述を追加します。

```java
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        AlertDialog.Builder alertDialog = new AlertDialog.Builder(this);

        alertDialog.setTitle("test");
        alertDialog.setMessage("Sample Message");

        // positiveボタン
        alertDialog.setPositiveButton("OK", new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(MainActivity.this, "OK" + which, Toast.LENGTH_SHORT).show();
            }
        });
        // neutralボタン
        alertDialog.setNeutralButton("SKIP", new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(MainActivity.this, "SKIP" + which, Toast.LENGTH_SHORT).show();
            }
        });
        // negativeボタン
        alertDialog.setNegativeButton("NO", new DialogInterface.OnClickListener() {
            public void onClick(DialogInterface dialog, int which) {
                Toast.makeText(MainActivity.this, "NO" + which, Toast.LENGTH_SHORT).show();
            }
        });

        alertDialog.show();
    }
```


#表示内容
## OS 2.3.7
![2_3_7.png](https://qiita-image-store.s3.amazonaws.com/0/4052/9c428a4a-8cd8-c391-de34-dd67e063724c.png)

## OS 4.3
![4_3_2.png](https://qiita-image-store.s3.amazonaws.com/0/4052/6b0592b7-9785-8bb9-7bc9-db753a6cd14b.png)

## OS 5.0
![スクリーンショット 2015-01-29 22.30.10.png](https://qiita-image-store.s3.amazonaws.com/0/4052/542a82d6-adcb-65e5-054e-a431bcec0d30.png)

# 結果
* ICS以前

```
Positive Neutral Negative
```

* ICS以降

```
Negative Neutral Positive
```

* Lolipop

```
Neutral Negative Positive
```

※ICSを境に変更になったのかは人づてに聞いたので、若干自信ありません。。
開発環境のソースをコンテナでなくボリュームで管理する


Dockerを使っていて、開発中に頻繁に変更する部分、ソースコードなどを`COPY`などでコンテナ内に持って行くと毎回ビルドされて大変。とりあえずホストのディレクトリをボリュームとして使えるのでそれを利用すると楽。

-  [document](https://docs.docker.com/userguide/dockervolumes/#mount-a-host-directory-as-a-data-volume)

### 構成
Dockerfileの隣にある`./mnt/`にnodeアプリケーションをおき、ボリュームとして利用してみる例。もしベストプラクティスの構成があるなら早く覚えたい気持ちはある。

```console:
$ tree
.
├── Dockerfile
├── README.md
├── conf
│   └── aws
│       ├── credentials
│       └── credentials.orig
└── mnt
    └── app
        ├── index.html
        └── index.js
```

### 設定
以下はnodeの`aws-sdk`を使うための設定で本題には関係ない。

```console:
$ cp -p conf/aws/credentials.orig conf/aws/credentials
$ vi conf/aws/credentials.orig
```

```credentials.orig
[default]
aws_access_key_id = XXXX
aws_secret_access_key = XXXX
```

全体をgit管理に入れ、`credentials`は`.gitignore`しておく。

### Dockerfile

必要なコマンドを書く。アプリケーションのある `./mnt/` は`COPY`の対象から除いてあるが、あとでボリュームとして使えるようになる。nodeモジュール管理も`package.json`でうまくやりたい。

```Dockerfile
FROM centos:centos6
ENV HOME /root/
WORKDIR $HOME

RUN     yum -y install tcpdump 
RUN     yum -y install cairo cairo-devel cairomm-devel libjpeg-turbo-devel pango pango-devel pangomm pangomm-devel giflib-devel

RUN     rpm -Uvh http://download.fedoraproject.org/pub/epel/6/i386/epel-release-6-8.noarch.rpm
RUN     yum -y install npm

EXPOSE  8080

COPY conf/aws/* $HOME/.aws/

RUN npm install express@3.2.4
RUN npm install d3
RUN npm install aws-sdk
RUN npm install canvas
RUN npm install fs
RUN npm install socket.io

ENV NODE_PATH $HOME/node_modules

CMD ["node", "/mnt/app/index.js"]
```

ボリュームを使うには`-v`オプションで`docker run`する。[ホスト側のディレクトリは絶対パスでないといけない](https://docs.docker.com/userguide/dockervolumes/#mount-a-host-directory-as-a-data-volume)。


```console:
$ docker build -t node .

$ docker run -it -v `pwd`/mnt/app:/mnt/app node
Running on port...
```

コマンドを指定しない場合、`CMD`で指定しておいたコマンドが実行される。

これで

- 大半一度で決まる設定やインストールはコンテナ内
- 頻繁なソースコード変更はコンテナ外

におき、ビルド工数を最小化しながら両方git管理するという分離ができる。
パターンマッチでクイックソート

# 使用するライブラリ 

+ [lodash](https://lodash.com/)
+ [matches.js](https://github.com/natefaubion/matches.js)

javascriptは拡張性が高いのでライブラリひとつでガラッとコードの書き方が変わります。個人的にはこの辺を使ってコードを書くのが好み。

>Matches.js is deprecated. Please check out sparkler, a native pattern matching engine built using sweet.js macros. It does everything matches.js does and more, except it isn't a hideous hack!

Matches.jsが非推奨っぽいですが、sparklerがsweet.jsを使っているためマクロ変換が必要なので、個人的にはMatches.jsを使いたいんですよね～

# クイックソートを書く
n行で書くクイックソートなんて話題がたまに出ますが、ネタを書く側からすると出しやすいんですよね。

で、コード。

``` javascript
var _ = require('lodash');
var pattern = require('matches').pattern;

var sort = pattern({
    '[]' : function() { return []; },
    '[x]' : function(x) { return [x]; },
    '[x, ...xs]' : function(x, xs) {
        var lt = _.filter(xs, function(n) { return n < x; });
        var gt = _.filter(xs, function(n) { return n > x; });
        return sort(lt).concat([x]).concat(sort(gt));
    }
});

console.log(sort([5,3,2,7,9,8,6,4,1]));
```

あまり短くないですが、パターンマッチを使うと抽象度が一段上がって理解しやすいと思います。

# 解説
処理は単純なので主にmatches.jsの説明です。

``` javascript
var pattern = require('matches').pattern;
```

今回のキモとなるpattern関数です。引数にパターンと実行すべき関数の組を持つオブジェクトを指定します。

で、そのパターンですが、

``` javascript
    '[]' : function() { return []; },
```

このように文字列で指定します。上記の例は、「空の配列」というパターンが来たら、空の配列を返す関数を実行しなさいという指定。

``` javascript
    '[x]' : function(x) { return [x]; },
```

これは、「要素が１つの配列」というパターンが来たら、取り出した要素xを配列にして返す関数を実行しなさいという指定。

最後はちょっと長いので、まずはパターン部分

``` javascript
    '[x, ...xs]' : function(x, xs) {
```

「...xs」という箇所が見慣れない形ですが、ここでは配列と考えておいて問題ないです。パターン全体の意味としては、配列を先頭要素と残りに分割して、先頭要素はx、残りの部分配列はxsとするって感じです。

ここまで来たら、あとはクイックソートのアルゴリズムです。

``` javascript
        var lt = _.filter(xs, function(n) { return n < x; });
        var gt = _.filter(xs, function(n) { return n > x; });
        return sort(lt).concat([x]).concat(sort(gt));
```

配列を先頭要素xより小さいものと大きいものに分割して、分割したそれぞれを更にソートし、ソート済み配列(小さい方)と分割に使った要素xとソート済み配列(大きい方)を連結すれば配列全体のソートが完了となります。

# 蛇足
記事の趣旨はパターンマッチでコードがすっきり書けるぜーってだけなんですが、クイックソートのアルゴリズムが手抜き(データに左右されまくる)とか、パターンマッチの[...xs]は配列のコピーを作るので、パフォーマンスを考えたら

``` javascript
'xs@Array' : function(xs) {
    var x = xs[0];
    // 以下略
```

とした方が無駄がないんじゃないかと思いますが、見た目重視ということで…

あと、著者がjavascriptのド素人なので、酷い間違いがあるかもしれません。
Emacsから辞書.appを簡単に使う


最近，国際会議に投稿するための英語論文を書いています．
(もちろん[org-mode](http://orgmode.org/ja/)で書いてLaTeXにエクスポート．)

OS Xには「辞書(Dictionary.app)」が標準搭載されています．
そこで，Emacsから辞書の検索を試してみました．

## カーソル位置の単語を検索

「[EmacsからDictionary.appを起動する方法 - Crossroad (tunefsの日記)](http://d.hatena.ne.jp/tunefs/20130212/p1)」を参考にしました．

OS Xでは`dict://`というスキーマで辞書を起動できるらしい．
ここでは，記事の設定内容をそのまま流用しました．

```el
(global-set-key (kbd "C-c w o")
 (lambda () (interactive)
   (let ((url (concat "dict://" (read-from-minibuffer "" (current-word)))))
     (browse-url url))))
```

## 単語を入力して検索

任意の単語を入力して検索する関数も作ってみました．
上の関数を参考に，ミニバッファで単語を入力するようにしただけですが…．
これを使うと，和英辞書だけでなく，Wikipediaも検索できて便利です．

```el
(global-set-key (kbd "C-c w s")
 (lambda (key) (interactive "MSearch: ")
   (let ((url (concat "dict://" key)))
     (browse-url url))))
```
【Android】Libraryを作ってprivateなgithubリポジトリにpushして、チームのみんなでgradleに書くだけで使えるようにするまで




どのアプリを作るにしても共通のものを毎回実装するのは無駄なのでライブラリ化して使い回したいなぁとうすうす思っていたのでやってみました。

## ライブラリプロジェクトつくってgithubにあげる

### ライブラリプロジェクトを作って実装する

いろんなやり方があるのでしょうが、僕の場合は普通にNew Projectしてbuild.gradleの

```
apply plugin: 'com.android.application'
```

を

```
apply plugin: 'com.android.library'
```

に変更して中身をがりがり書きました。

また `app` というモジュール名が気持ち悪い方は モジュール名を`library`などと適切な名前に変えておきましょう。 setting.gradleの更新もお忘れなく。

以下は `library` に変更したとして説明してきます。

### aarファイルの作成

[aar](http://tools.android.com/tech-docs/new-build-system/aar-format)は Android Library Projectの配布用ファイルといったところです。

このファイルを作成するには、プロジェクトのルートで下記コマンドを打って

```
./gradlew assembleRelease
```

下記ファイルが作られていることを確認できればOKです。

```
./library/build/outputs/aar/library.aar
```

### [maven-plugin](http://gradle.monochromeroad.com/docs/userguide/maven_plugin.html)を導入してpomなどの成果物を作る

ライブラリプロジェクトのbuild.gradleに下記を追記します。

```
def repo = new File(rootDir, "repository")

apply plugin: 'maven'

uploadArchives {
    repositories {
        mavenDeployer {
            repository url: "file://${repo.absolutePath}"
            pom.version = '1.0.0'             // version
            pom.groupId = 'com.genestream'    // グループ名
            pom.artifactId = 'common-library' // ライブラリ名
        }
    }
}
```

追記したら、プロジェクトのルートで下記コマンドを打ち成果物を作ります。

```
./gradlew uploadArchives
```

repositoryディレクトリの中にpomファイルなどができていれば成功です。

### githubにpushする

あとは `gh-pages` ブランチを切って、そこにpushするだけです。

gh-pagesなのはそうすると後々URLが奇麗だから、ただそれだけです。


## つくったライブラリを使用する

### (一応) githubリポジトリがpublicな場合

使用したいアプリプロジェクトのアプリ用のbuild.gradleに下記を追記するだけ。

```
repositories {
    maven { url 'http://<githubユーザー名>.github.com/<githubリポジトリ名>/repository' }
}

dependencies {
    compile '<グループ名>:<ライブラリ名>:<バージョン>' 
}
```

今回の場合は下記になります。

```
repositories {
    maven { url 'http://genestream.github.com/library/repository' }
}

dependencies {
    compile 'com.genestream:library:1.0.0' 
}
```

簡単。

### githubリポジトリがprivateな場合

puhblicな場合に比べて数行増えます。

まず[git-repo](https://github.com/layerhq/gradle-git-repo-plugin)を導入します。

ルートのbuild.gradleに下記を追加します。


```build.gradle
buildscript {
    repositories {
        maven { url "https://github.com/layerhq/releases-gradle/raw/master/releases" }
    }
    dependencies {
        classpath group: 'com.layer', name: 'git-repo-plugin', version: '1.0.0'
    }
}
```

次にアプリのbuild.gradleに下記を追加します。

```build.gradle

apply plugin: 'git-repo'

repositories {
    github("<github name>", "<リポジトリ名>", "<ブランチ名>", "<Direcotry>")
}

dependencies {
    compile '<グループ名>:<ライブラリ名>:<バージョン>'
}

```

今回の場合は下記です。

```
apply plugin: 'git-repo'

repositories {
    github("genestream", "library", "gh-pages", "repository")
}

dependencies {
    compile 'com.genestream:library:1.0.+'
}
```

以上です！
jquery $.extend() について調べたので、メモ

# $.extend() とは
$.extend() は、複数のオブジェクトをまとめてくれる、jqueryの機能の一つです。
以下の解説は、jQueryがよみこまれていることが前提です。

記事の内容は、こちらに移行しました

https://hackerslog.net/posts/jquery/about-extend-function/
【Android・CSS】4系で幅が効かないで余白が出てしまう

PCサイトをAndroidで表示するという要件があった。
普通に考えなしでコーディングしていたらAndroidで意図しないところで改行されてしまう問題が起きたので、解決策のメモになります。

## 対象デバイス

* Android 4系全般
* pタグなどのテキスト要素

### 対策01

* スペーサー的な画像をbackgroundに差し込む
* （display:tableなどを使っていた場合は効かない）

```
p{
  background: url(../images/spacer.gif) no-repeat;
}
```

### 対策02

* JSのユーザエージェントで、viewportをかましての対処

```js
(function(){
var agent = navigator.userAgent;
if (agent.search(/Android 4/) !== -1) {//Android4系のみ。下位バージョンで効くとバグが起きる
$("head").append($('<meta name="viewport" content="width=device-width,user-scalable=yes,target-densitydpi=device-dpi,initial-scale='+(screen.width/＊＊＊)+'">'));
//＊＊＊のところは、コンテンツのサイズを入れる
}
});

```

## 参考サイト

* [http://mania-ku.info/?p=304](http://mania-ku.info/?p=304)
* [http://webutubutu.com/webdesign/1555](http://webutubutu.com/webdesign/1555)
POV-RAYのIntel Mac導入

POV-RAYはPowerPC・Windows向けのビルドはあるものの、Intel Mac向けにはありません。
そこで非公式のビルドを利用します。

http://megapov.inetart.net/povrayunofficial_mac/

Applicationsフォルダに解凍したフォルダをコピーし、フォルダ名を"POVRAY"にします。（初期状態だとアンダーバーやハイフンがついてますが、なんかコレがあると具合が悪くなるっぽいです。）

preferencesからSystem Includesを開き、
POVRAYフォルダの中の`include`フォルダを追加します。
![スクリーンショット 2015-01-29 20.45.34.png](https://qiita-image-store.s3.amazonaws.com/0/24979/cdae8339-6b39-c87f-ee90-a77783dee70e.png)


以上です。
⌘＋Rでビルド出来ます。
Javascriptを理解したい時にみるとはかどる記事まとめ



# **入門**

* <a href="http://morizyun.github.io/blog/javascript-learning-tech-yourself_01/" target="_blank">【はてぶ900】JavaScript 徹底入門のための資料＆書籍まとめ</a>
* <a href="http://yut.hatenablog.com/entry/20120312/1331509053" target="_blank">【はてぶ80】超絶簡単！JavaScriptの性質を10分で理解するための重要なポイントのまとめ</a>
* <a href="http://gifnksm.hatenablog.jp/entry/20100131/1264934942" target="_blank">【はてぶ2000】JavaScript基礎文法最速マスター</a>
* <a href="http://yosuke-furukawa.hatenablog.com/entry/2014/12/31/161922" target="_blank">【はてぶ300】JavaScriptの科目</a>



# **プロトタイプベースのオブジェクト指向**

* <a href="https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Working_with_Objects#Object_everything" target="_blank">Working with Objects - JavaScript | MDN</a>
* <a href="http://qiita.com/awakia/items/8ff451ca5f8ae0122be7" target="_blank">【はてぶ80】Javascriptでオブジェクト指向するときに覚えておくべきこと - Qiita</a>
* <a href="http://www.slideshare.net/yuka2py/javascript-23768378" target="_blank">【はてぶ2000】最強オブジェクト指向言語 JavaScript 再入門！</a>



# **デバッグ**

* <a href="http://20kaido.com/archives/7524821.html" target="_blank">【はてぶ700】Web開発に必携の「Google Chrome デベロッパーツール」の便利ワザ10個まとめ</a>
* <a href="http://qiita.com/dayoshix/items/0d4043bf7dbaa1dc9184" target="_blank">【はてぶ900】フロントエンドエンジニアになってから11ヶ月間で覚えたちょっと捗るChromeの使い方 - Qiita</a>

# **その他**

* <a href="http://ginpen.com/2014/12/01/large-function/" target="_blank">【はてぶ200】JSファイル全体を括るfunctionについての話。（JavaScriptおれおれAdvent Calendar 2014 – 01日目）</a>
* <a href="http://uhyohyo.net/javascript/index.html" target="_blank">【はてぶ1000】JavaScript初級者から中級者になろう</a>
* <a href="http://tech.kayac.com/archive/javascript-url-dispatcher.html" target="_blank">【はてぶ200】そこそこ規模が大きくても何とかなるjavascriptの設計（URL dispatcherの薦め）</a>
* <a href="http://qiita.com/KENJU/items/c7fad62a12cc2809b507" target="_blank">【はてぶ130】中上級者になるためのJavaScript【知識編】 - Qiita</a>
nodejsのplugin方式のやり方

# はじめに

node.jsでモジュールの追加変更を本体のプログラム変更なしに行うやり方です
プラグイン的に追加できるようにしておくと本体のコードをいじらなくて済むのでフレームワークを作るときに
コードの変更なく機能を追加できるので便利です

# やりかた

## ディレクトリ構造

```
web/
 app.js
 plugin_loader.js
 /plugins
  /hello
   index.js
```

## プラグインローダー

名前とインスタンス生成のペアを作ります

```plugin_loader.js
var fs = require('fs');
var scan = exports.scan = function(dir){
    var files = fs.readdirSync(dir);
    return files.filter(function(v){return fs.statSync([dir, v].join('/')).isDirectory()}).
        map(function(v){
            return {
                name : v,
                createInstance : require([dir, v].join('/')),
            }
        })
}
```

## 本体

プラグインの配列ができるのでこれを本体側で呼び出せる仕組みを作ります。
※WEBなどであればURLにページ名を入れておきページ名をプラグイン名にして呼び出すなど。

```app.js
var pluginLoader = require('./plugin_loader');
var plugins = pluginLoader.scan(__dirname+'/plugins').reduce(function(r,v){
    r['/'+v.name] = v.createInstance;
    return r;
}, {});

var http = require('http');
var url = require('url');
http.createServer(function (request, response) {
    response.writeHead(200, {'Content-Type': 'text/html'});
    var urlinfo = url.parse( request.url , true );
    var f = plugins[urlinfo.pathname];
    if(f){
        f(request, response);
    }else{
        response.end();
    }
}).listen(8080);
```

## プラグイン

```plugins/hello/index.js
module.exports = function(request, response){
    response.write('hello world');
    response.end();
}
```

## 実行

```
node app.js
```

起動したらブラウザでテストします

http://ipaddress:8080/hello

```
hello world
```

# その他

サンプルはWEBサーバーですが私はボットのエージェントにこの仕組を使ってます。
今のところ問題は出てませんが問題があるとご指摘あればコメントにお願いしたいです。
一覧の最後のテキストボックスのタブ移動先を先頭のテキストボックスに戻す

「検索画面と組み合わせてiframe内に検索結果を出す一覧形式の編集画面」とかの場合です。
特に何も制御していないと、最後のテキストボックスでTabキーを押すとフォーカスが明後日の方向に吹っ飛んで行ったりします。

で、設計者の要望でフレーム内だけでタブ移動を制限することになりましてー

***
まぁ タブ移動時のフォーカスを制御してやればいいので、以下の制御をすることになりました。

1. 最後のテキストボックスでTabキーが押されたら先頭のテキストボックスにフォーカス移動
2. 最初のテキストボックスでShift+Tabキーが押されたら最後のテキストボックスにフォーカス移動


### サンプル
制御には無難にjQuery使っています。

```js
$(function() {
	$('input:text:first').keydown(function(event){
		if (event.keyCode == 9 && event.shiftKey) {
			$('input:text:last').focus();
			return false;
		}
	});
	$('input:text:last').keydown(function(event){
		if (event.keyCode == 9 && !event.shiftKey) {
			$('input:text:first').focus();
			return false;
		}
	});
});
```

***

タブ移動先がテキストボックスしか無い前提です。


以上!
Playground コンパイラー

# Playground コンパイラー

[Playground](https://github.com/KLab/PlaygroundOSS)はKLab株式会社のゲームエンジンです。**C#**でスクリプトを書いて、**Android**でも、**iOS**でもリリースが出来ます。

## 原点
エンジンはC++で書いてますし、APIはC#ですから、元々**Mono**を使うつもりでした。Androidが出来ましたがiOSはダメになりましたので、オリジナルC#からC++までのコンパイラーを作るに決めました。

## コンパイラー
コンパイラーはC++,LexとYaccで開発されました。コンピレーションは三つ部分があります：**字句解析** (じくかいせき、Lexical Analysis)、**構文解析**（こうぶんかいせき、Syntactic Analysis）と**コード生成**（コードせいせい、Code Generation）

### 字句解析
先ずC#のコードはLexとYaccのパーサーで読まれた。プログラムの言葉は皆**トークン**になります。結果は**構文木**です。
例：
![Untitled drawing.jpg](https://qiita-image-store.s3.amazonaws.com/0/59430/2dd9ca31-5725-d159-e24e-4f6355367004.jpeg)

### 構文解析
前の構文木で様々解析して、プログラムの意味を理解します。例えば、あるブロックで、`a`は`24`です。

### コード生成
構文解析が終わったら、コード生成が出来ます。目的はC++で同じ意味のプログラムを作る。C++にありません物は沢山ありますから、トリックを良く使います。例えば、無名関数毎で、新しいクラスを作ります。

## ランタイム
コンパイラーだけは十分ではない。C#は**CLR**(Common Language Runtime)という.NETのバーチャルマシンで実行されています。もちろん、C++はCLRの機能がありませんから、C++用のランタイムを開発しました。そのランタイムはStringなど、CLRの基本的なクラスを持ってますし、**カスタムなガベージコレクター**もあります。
ポート出力によるアクチュエータのロギングライブラリ

電磁弁などアクチュエータの動作累積回数や累積動作時間をロギング（カウントアップ）できる機能を持ったポート出力ライブラリを作成してみました。近日中には部品交換によるカウントクリア機能も追加予定。
[LogDigitalOut](http://developer.mbed.org/users/naseba_atsushi/code/LogDigitalOut/)
【GAS】天気予報を取得してチャットワークに投稿

##概要

GoogleAppsScriptでlivedoorが提供するお天気情報「[Weather Hacks](http://weather.livedoor.com/weather_hacks/webservice "Weather Hacks")」からJSONデータをリクエストし、

取得したデータをチャットワークに自動投稿する処理を作り、GASのタイマー機能を使って一定時間でそのスクリプトを実行するといった、とってもシンプルなやつです。

何よりお手軽なのがGASの良いところ。

###てかGASって何？

GoogleAppsScriptの略で、簡単に言うとGoogle製のサービスのプログラム環境です。JavaScriptで記述できます。プログラムを作ることで、例えば表計算を自動化したり、サービス間の連携を行うといったことが可能になります。


####簡単に使用する場合
スプレッドシートを新規作成 > ツール　> スクリプトエディタ

##コード


```ruby:
function forecastBot() { 
    
    // Weather Hacks
    
    var response = UrlFetchApp.fetch("http://weather.livedoor.com/forecast/webservice/json/v1?city=270000"); //URL + cityID(270000)
    
    if (response.getResponseCode() != 200) {
        return false;
    }
    var json = JSON.parse(response.getContentText());
    var forecast = json["forecasts"][1]["telop"];
   
  
    var client = ChatWorkClient.factory({token: "チャットワークのAPIトークン"}); 
     
    // Chatwork API
    
    client.sendMessage({
         room_id:****, 
         body: "[info][title]お知らせ[/title]明日の天気は "+forecast+" です。[/info]"
     }); 
  
}
```
チャットワークのAPIトークンはチャットワークで取得しといてください。※有料プランの場合、管理者の申請が必要です

ルームIDはチャットのルームのURLの末尾にある数字です。


###ChatWorkClientライブラリの追加

スクリプトエディタの
リソース　> ライブラリ

からライブラリを追加します。プロジェクトキーは以下に記述されています。
https://github.com/cw-shibuya/chatwork-client-gas

**拡張子を「ChatWorkClient」にして下さい。**

あとはスクリプトエディタから時計のようなアイコン（トリガー）で好きな時間でこの関数が実行されるように設定。


##発展

・GoogleカレンダーやGoogle Appsまわりでもっと連携する
→とにかく何でもかんでも「自動化」する

・外部の他の様々なAPIと繋いでみる
ELB で https 通信ができなかった件について

いろんなサイトでELBのSSL設定が説明されていたけどどうも繋がらなかった.
http://docs.aws.amazon.com/ja_jp/ElasticLoadBalancing/latest/DeveloperGuide/US_SettingUpLoadBalancerHTTPS.html

**原因**
Security Group の inbound に https(443) の許可をしていなかった.
追加したらできました(^o^)
複数ファイルから指定した文字列とマッチした行を削除する


`-i`で上書き、`-e`で処理する内容を指定する。
下はディレクトリにあるyamlファイルで`abc`という文字列が含まれている行をすべて削除(`d`)する。

```
$ sed -i -e '/abc/d' *.yaml
```

##参考
[Linux である文字を含む行を削除したい - Enjoi Blog](http://blog.enjoitech.com/article/71)
[sedでファイルを上書き保存](http://www.dab.hi-ho.ne.jp/sasa/biboroku/unix/sed-i.html)
sshfs使ってみる

初投稿。Linuxのホストへnfsとかsmbで接続するのもいいけど、手軽にやりたいときはこいつが便利です。Macならhomebrewでインストール出来ます

`brew install sshfs`

使い方は簡単で、こんな感じです。

`sshfs linux-host:/home/ /Users/kakikubo/Desktop/linux-host`

以下のようなシェルスクリプトを用意しておけば、

```lang:sshfs-mount.sh
sshfs $1:/home/ /Users/teruo.kakikubo/Desktop/$1
```

簡単にマウントできちゃいますね

`
./sshfs-mount.sh linux-host
`
Scikit-ImageのHOGの出力について


```skimage.feature.hog``` (http://scikit-image.org/docs/dev/api/skimage.feature.html#hog) は入力画像からHOG特徴量を抽出してくれるのだが，出力結果は1d-arrayであり，何がなんだかわからないという問題がある．https://github.com/holtzhau/scikits.image/blob/master/skimage/feature/hog.py にあるコードを読むと，このarrayをどう解釈すれば良いかがわかる．

### 入力引数で重要なもの

- ```orientations```: ヒストグラムのビン数（default=9）
- ``` pixels_per_cell```: セルのサイズ（default=(8,8)）
- ``` cells_per_block```: ブロックごとのセル数（default=(3, 3)）

### 出力を見てみる

180行目

```py:hog.py
return normalised_blocks.ravel()
```

ここravelせずに返して欲しかった．normalised_blocksの宣言を見てみると，

160行目

```py:hog.py
n_blocksx = (n_cellsx - bx) + 1
n_blocksy = (n_cellsy - by) + 1
normalised_blocks = np.zeros((n_blocksx, n_blocksy, bx, by, orientations))
```

ここで使われている変数は100行目あたりで宣言されている

```py:hog.py
sx, sy = image.shape
cx, cy = pixels_per_cell
bx, by = cells_per_block

n_cellsx = int(np.floor(sx // cx))  # number of cells in x
n_cellsy = int(np.floor(sy // cy))  # number of cells in y
```

というわけで，hogを回して得られる1-d array（```retval```とする）は，

```
retval.reshape((n_blocksx, n_blocksy, bx, by, orientations))
```

としてあげると，元の形に戻すことができる．

### 活用例

たとえば，blockごとの最大勾配方向を可視化することができる．

```py:visualize_argmaxhog.py
from skimage.feature import hog
from skimage.data import camera
import matplotlib.pyplot as plt

img = camera()
orientations = 9
pixels_per_cell = (8, 8)
cells_per_block = (3, 3)

h = hog(img, orientations=orientations, pixels_per_cell=pixels_per_cell, cells_per_block=cells_per_block)

sx, sy = img.shape[:2]
cx, cy = (8, 8)
bx, by = (3, 3)
n_cellsx = int(np.floor(sx // cx))  # number of cells in x
n_cellsy = int(np.floor(sy // cy))  # number of cells in y
n_blocksx = (n_cellsx - bx) + 1
n_blocksy = (n_cellsy - by) + 1

himg = h.reshape((n_blocksx * n_blocksy, bx, by, orientations))
vis = np.array([np.argmax(x.sum(axis=(0, 1))) for x in himg]).reshape((n_blocksx, n_blocksy))

plt.subplot(1, 2, 1)
plt.imshow(img)
plt.axis('off')
plt.subplot(1, 2, 2)
plt.imshow(vis, interpolation='nearest')
plt.axis('off')

```

![kobito.1422522927.516947.png](https://qiita-image-store.s3.amazonaws.com/0/69/59dc140a-4b5f-7e88-deca-3dd82ba6203c.png "kobito.1422522927.516947.png")
Docker で GitBucket 環境をつくる


GitBucket の永続的な運用環境を Docker でつくってみるメモ。CoreOS 使っています。

* [takezoe/gitbucket](https://github.com/takezoe/gitbucket)


# イメージ作成

GitBucket が Scala 製 web アプリケーションということで、Tomcat の公式イメージを元に GitBucket のイメージを作ることにします。

```
core@coreos ~ $ docker search tomcat
NAME                                  DESCRIPTION                                     STARS     OFFICIAL   AUTOMATED
tomcat                                Apache Tomcat is an open source implementa...   56        [OK]       
```

* [tomcat Repository | Docker Hub Registry - Repositories of Docker Images](https://registry.hub.docker.com/_/tomcat/)


## Dockerfile 作成

`Dockerfile` は下記のような感じ。

```Dockerfile:Dockerfile
FROM tomcat:8-jre8

MAINTAINER Yu I. <yu.inao@facebook.com>

ENV GITBUCKET_HOME /var/gitbucket

RUN rm -rf /usr/local/tomcat/webapps/ROOT

ADD https://github.com/takezoe/gitbucket/releases/download/2.7/gitbucket.war /usr/local/tomcat/webapps/ROOT.war

VOLUME /var/gitbucket

EXPOSE 8080 29418

CMD [ "/usr/local/tomcat/bin/catalina.sh", "run" ]
```

これを適当なディレクトリの中に保存します:

```
gitbucket/
└── Dockerfile
```


## ビルド

ビルドしてイメージを作成します:

```
docker build -t japboy/gitbucket:2.7 ./gitbucket/
```


## 確認

ビルドが完了したらホストのイメージ一覧に追加されているのを確認します:

```
core@coreos ~ $ docker images
REPOSITORY            TAG                 IMAGE ID            CREATED             VIRTUAL SIZE
japboy/gitbucket      2.7                 1b4270aac1cc        27 minutes ago      368 MB
```


# コンテナ実行

GitBucket サーバーをバックグランドコンテナとして起動します。

```
docker run -d -P -v /media/volume/gitbucket:/var/gitbucket japboy/gitbucket:2.7
```

* `-v` でデータボリューム `/var/gitbucket` をホストの `/media/volume/gitbucket` に割り当てている。
* CoreOS 側で `/media/volume` に NFS で NAS をマウントしてデータの永続化を行なうようにしている。

ホストに割り当てられたポート番号をプロセス一覧から確認します:

```
core@coreos ~ $ docker ps
CONTAINER ID        IMAGE                        COMMAND                CREATED             STATUS              PORTS                     NAMES
5f5b141841b9        japboy/gitbucket:2.7         "/usr/local/tomcat/b   29 minutes ago      Up 29 minutes       0.0.0.0:49159->8080/tcp   romantic_bartik  
```

これだと `49159` が公開ポートとして割り当てらています。

あとは web ブラウザから GitBucket にアクセスします。アドレスは上記ポート番号を指定して下記のような感じです:

```
http://192.168.0.98:49159/
```

データコンテナで永続化しようと思ったけど、あんまりポータビリティ高くなさそうなので、CoreOS で NFS をマウントして、それをデータボリュームに割り当てる事にした。
Bootstrapでフォーム部品を横一行に表示したい

Bootstrapって、横幅全部使ってフォーム部品が表示される、みたいなのがデフォルトっぽくて、
日付とか時間とかね、入力欄は小さくていいから一行におさめたいって場合に結構悩んだのでメモ。
ちょっと、labelの使い方が間違ってるがまあとりあえずこんな感じで。


```html
				<div class="form-inline">
					<div class="form-group">
						<label>日付</label>
						<input name="jikan" id="datepicker" class="form-control" type="text">
					</div>
					<div class="form-group">
						<label>時間</label>
						<select name="hour" class="form-control">
							<option>10</option>
							<option>11</option>
							<option>12</option>
						</select> 
						<label>:</label>
					</div>
					<div class="form-group">
						<select name="min" class="form-control">
							<option>57</option>
							<option>58</option>
							<option>59</option>
						</select> 
					</div>
				</div>
```							

もしこれの時間セレクト部分をCakePHPのフォームヘルパーを使って表現したい、
ということだったら、以下のように書けばよい。

```php
					<div class="form-group">
<?php
					echo $this->Form->input('jikan', array(
						'type' => 'time',
						'label' => '時間',
						'timeFormat' => 24,
						'selected' => '13:30:00',
						'class' => 'form-control',
						'interval' => 15
					));
?>
					</div>
```

formのnameは自動的にhourがついてくれる

```html
<select id="ModelJikanHour" class="form-control" name="data[Model][jikan][hour]">
```