OmniAICreator/Qiita-1.07M huggingface dataset:
Redis3.0リリース

###Redis3.0リリース
クラスタのサポートが加わったRedis3.0が正式リリースされました。
また、多数のパフォーマンス改善が行われています。

###リリースノート
https://raw.githubusercontent.com/antirez/redis/3.0/00-RELEASENOTES

###Redis2.8からの変更点(上記より転載)

* Redis Cluster: a distributed implementation of a subset of Redis.
* New "embedded string" object encoding resulting in less cache
  misses. Big speed gain under certain work loads.
* AOF child -> parent final data transmission to minimize latency due
  to "last write" during AOF rewrites.
* Much improved LRU approximation algorithm for keys eviction.
* WAIT command to block waiting for a write to be transmitted to
  the specified number of slaves.
* MIGRATE connection caching. Much faster keys migraitons.
* MIGARTE new options COPY and REPLACE.
* CLIENT PAUSE command: stop processing client requests for a
  specified amount of time.
* BITCOUNT performance improvements.
* CONFIG SET accepts memory values in different units (for example
  you can use "CONFIG SET maxmemory 1gb").
* Redis log format slightly changed reporting in each line the role of the
  instance (master/slave) or if it's a saving child log.
* INCR performance improvements.

###参考記事
Redis3.0でサポートされたクラスタの日本語記事がありました。

- [redis clusterの作り方](http://qiita.com/sawada_masahiko/items/7b7956373b1a159e20c4)
- [Redis Cluster のリシャーディングとorphaned masterの話](https://gist.github.com/yutori/158e5eeea60ba2914d1a)
- [Redisのクラスタリング](http://redis.shibu.jp/admin/cluster/)  
  図入りでクラスタリングの仕組みを解説しているので理解しやすいです。

クラスタの仕様書(英語)

- [Redis Cluster Specification](http://redis.io/topics/cluster-spec)
Javaでログイン時の「パスワードを記憶する」を作るには

現在Java、Seasar2(SAStrats/S2JDBC)、JSP、PostgreSQLで
DBを使ったWebアプリケーションを作っています。

質問があるのですが、
**Javaでログイン時の「パスワードを記憶する」機能を作るにはどうしたらいいでしょうか？**

次のような機能です。
![キャプチャ.JPG](https://qiita-image-store.s3.amazonaws.com/0/60528/8d652822-b807-e895-9211-15e8ee467d2f.jpeg)

<br>
作り方やサンプルコードを調べているのですが、なかなか見つけられません。

もし情報を提供できる方がいれば、参考ページのURLなどを教えて頂けると助かります。
はじめてのAmazon Route 53

##今回の目標
ドメインの入手からRoute 53を用いてEC2上に構築したWEBサーバに独自ドメインで接続することを目標とします。
今回はRoute 53でのドメイン購入は行いません（価格的な意味で）
***

##ドメイン取得

ドメインはレジストラで購入します。
下記サイトとかで.linkや.xyzなんかを取得すると年間200円以下なので検証には良いかと。
[お名前.com](http://www.onamae.com)
[ムームードメイン](http://muumuu-domain.com)

今回はムームードメインを使用します。
![150402-0001.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/a994c646-4e7f-3a3f-d670-1596445270b8.jpeg)

検索を押下すると一覧が表示されるのでその中で欲しいものを選択
アカウントを持っていなければ新規作成してください。
作成は飛ばします。

ドメイン設定画面
![150402-0002.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/74e0e880-2614-40e2-9ec0-baa8f327c9d4.jpeg)


基本既定値で大丈夫です。
DNSに関しても後で設定するのでそのままでOK

支払いはコンビニやクレジットカードが選択できます。
そのまま進んでいき最後にサマリが出てくるので確認して申し込めば完了です。

以上でドメインが取得できました。
***
##Route 53
Route 53での設定に移ります


マネジメントコンソールへログインしRoute 53を選択
![150402-0041.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/62918e8b-770d-19da-3ffd-d6ae2428659c.jpeg)


![150402-0004.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/07793a19-b43b-b0b6-e775-e979a94a27bd.jpeg)
HostedZonesを選択し

![150402-0005.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/e0cd8b59-769a-5e25-0413-06ac5564c6e8.jpeg)
Create

![150402-0006.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/7fbc82b5-ce73-cd23-7abf-a411c2838ebc.jpeg)
ドメインネームを記載（取得したドメイン名：xxxx.xxx）

作成するとこんな画面が出てくるので
![150402-0007.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/419b5922-f684-f2fd-2bbd-f82be6c14c42.jpeg)

![150402-0008.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/f0106d92-fa42-2a24-2b23-0565fce9869e.jpeg)
ネームサーバー欄を確認します

***
##ムームードメインの管理画面へ移動します
![150402-0009.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/70d5635f-e0d0-e137-fe29-276de3e6f130.jpeg)
ネームサーバーをRoute53に変更します。

すごく省略してなぜかというと
>ドメインは一番最後のところ（．ｃｏｍとか）から検索が始まりドットで区切られてるところをDNSが管理して次の登録されている次のDNSへ渡していき辿っていきます。
>なので、このドメインで検索された時にRoute53へ正しく渡されなければいけないのでRoute53の情報を登録します。

先ほどのNameServersの情報を記載します
![9def57ce-17ed-9963-6beb-62f906bb848b.jpeg](https://qiita-image-store.s3.amazonaws.com/0/52141/179a2fc5-184b-43eb-4d57-6133cb8f78e5.jpeg)


以上でRoute 53への登録は終了です。
***
#EC2でのWEBサイト構築は別の投稿で書きますので今回は省略。

WEBサーバのAレコードを登録します。
![150402-0011.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/2ac98e75-57e1-84d8-724c-bd5d29a65023.jpeg)

例ではサブドメインをwwwと定義しました。
![150402-0012.jpg](https://qiita-image-store.s3.amazonaws.com/0/52141/b09e9b69-90b5-0dd3-e76c-19c52f2c47de.jpeg)

これでEC2（WEBサーバ)に独自ドメインで接続できるようになります。
[Go]文字列のスライスをやっつけで比較する

`Go`で文字列のスライスを比較する必要があったときにやっつけで下のようにやった。

```go
import (
    "fmt"
    "strings"
)

var a, b []string

if strings.Join(a, "/") == strings.Join(b, "/") {
    fmt.Println("Match")
} else {
    fmt.Println("NOT match")
}
```

セパレータが`"\n"`とかの方がもうちょっと汎用性があるかな。いい手があったら教えてください。
git > 変更ファイル名を知りたい > git log --name-status

gitのlogコミットに関連してどのファイルを変更したか知りたい時、以下のようにする

    $git log --name-status
    ...
    M    readme.txt

Mで表示されるファイルが変更があったファイル。

[参考](http://transitive.info/article/git/command/log/)
OS X Yosemite 10.10　クリーンインストール&初期設定

# OS X Yosemite 10.10 クリーンインストール

データのバックアップをしっかりと取ってから電源を切る  
電源が落ちたら「Command + R」を押しながら電源をオンにしてリカバリーモード起動させる  
OS X ユーティリティが表示される

## ディスクユーティリティ
ディスクユーティリティを選択する  
左のメニューで`Machintosh HD`を選択し、消去タブをクリックして、消去ボタンをクリックする  
Command + Qでディスクユーティリティを閉じる  

## OS Xを再インストール
OS Xを再インストールを選択する

------

# OS X Yosemite 10.10 スタートアップ

## ようこそ
`日本`を選択  
`続ける`をクリック

## キーボード入力環境を選択
`US`を選択  
`続ける`をクリック

## Wi-Fi ネットワークを選択
ネットワークを選択  
パスワードを入力  
`続ける`をクリック

## このMacに情報を転送
今は情報を転送しない  
`続ける`をクリック

## Apple IDでサインイン
`サインインしない`を選択  
`続ける`をクリック

## 利用条件
`同意する`をクリック

## コンピュータアカウントを作成
`フルネーム` 英単語  
`アカウント名` 英単語  
`パスワード` 打ちやすい単語
`現在の位置情報に基づいて、時間帯を設定`をチェック  
`続ける`をクリック

## 診断と使用状況
`匿名の診断情報および使用状況データをAppleに送信`をチェック外す  
`クラッシュデータをアプリケーションデベロッパと共有`をチェック外す  

`続ける`をクリック

------


# システム環境設定


## 言語と地域

### 優先する言語
+ 日本語
+ 英語 English


## General
Use dark menu bar and Dock -> check

## Desktop & Screen Saver

### Desktop
Solid Colors -> Solid Gray Dark

### Screen Saver
Start after -> Never

## Dock
Size -> Small (1/8)  
Position on screen -> Left
Automatically hide and show the Dock -> check

## Mission Control
Dashboard -> As Space  
Keyboard and Mouse Shortcuts -> 全て解除  
Hot Corners -> 左上 -> Mission Control


## Keyboard
### Keyboard Tab
Key Repeat -> Fast  
Delay Until Repeat -> Short  
Adjust keyboard brightness in low light -> 解除  

Modifier Keys
  - CapsLock -> ^Control
  - Control  -> No Action
  - Option   -> Option
  - Comand   -> Command

### Shortcuts Tab
Mission Control -> uncheck all  
Keyboard -> uncheck all  
Spotlight
  - Show Spotlight search -> ctrl + shift + f
  - Show Finder search window -> uncheck

Input Sources -> 
  - Select the previous input source -> ctrl + space  
  - Select next input source -> uncheck

Services -> uncheck all  
Accessibility -> uncheck all  
App Shortcuts -> uncheck all  

## Spotlight
Spotlight search keyborad shortcut -> 

## Trackpad
### Point & Click Tab 
  - Tap to cick -> check
  - Secondary click -> check
  - Look up -> uncheck
  - Three finger drag -> uncheck
  - Tracking speed -> Fast

### Scroll & Zoom Tab 
uncheck all

### More Gestures
uncheck all

## Energy Saver

### Battery
Turn display off after -> Never

### Power Adapter
Turn display off after -> Never

## Sharing
Computer Name -> name only

## Date & Time

### Date & Time
Set date and time automatically -> check & set Apple Asia

### Clock
Show date -> check

## Accessibility
### Mouse & Trackpad
#### Trackpad Options
enable dragging -> check


------

# Advanced Setting

## Remove App Shortcut from Dock
`Finder` `Safari` `System Preferences`以外消す

------
【Java】オートボクシング、アンボクシング

Javaのまとめ記事です。

# プリミティブ型、参照型

Javaではプリミティブ型(基本型)と参照型の2つの型があります。
プリミティブ型は8つあります。
そして8つのプリミティブ型それぞれに、参照型であるラッパークラスが存在します。

|プリミティブ型|ラッパークラス|
|-----------|------------|
|boolean|Boolean|
|char|Character|
|byte|Byte|
|short|Short|
|int|Integer|
|long|Long|
|float|Float|
|double|Double|

このプリミティブ型とラッパークラスの変換を自動で行ってくれる仕組みがあります。
プリミティブ型からラッパークラスへの変換をオートボクシング、ラッパークラスからプリミティブ型への変換をアンボクシングといいます。

# オートボクシング

プリミティブ型からラッパークラスへの自動変換をオートボクシングといいます。

```java
int numInt = 10;
Integer numInteger = numInt;
``` 

int型で宣言されたnumIntをInteger型へ明示的に変換する必要がありません。

オートボクシングの機能を使わずに明示的に変換しようとすると以下のようになります。

```java
int numInt = 10;
Integer numInteger = new Integer(numInt);
// または以下
Integer numInteger = Integer.valueOf(numInt);
``` 

# アンボクシング

ラッパークラスからプリミティブ型への変換をアンボクシングといいます。

```java
Integer numInteger = new Integer(10);
int numInt =  numInteger;
```

こちらも、Integer型で宣言されたnumIntegerを明示的にint型へ変換する必要がありません。

アンボクシングの機能を使わずに明示的に変換しようとすると以下のようになります。

```java
Integer numInteger = new Integer(10);
int numInt =  numInteger.intValue();
```





# 気をつけたいこと

ラッパークラスは参照型のため、nullが入る可能性があります。
nullが入ったラッパークラスオブジェクトをアンボクシング機能を使ってプリミティブ型へ変換するとNullPointerExceptionが発生します。

```java
Integer numInteger = null;
int numInt =  numInteger;　//実行時にNullPointerException発生
```

`int numInt =  numInteger;`のコードは実際は
`int numInt =  numInteger.intValue();`です。
numIntegerがnullのため、NullPointerExceptionが発生してしまいます。

上記は簡単なコードですが、実際のプログラムでもこのようにnullが格納された変数をアンボクシング機能でプリミティブ型へ変換する可能性はあります。
気をつけないと思わぬバグが入り込んでしまうことがあります。

### Eclipseでの設定
オートボクシング、アンボクシングに対して警告を出せます。
ウィンドウ>設定>Java>コンパイラー>エラー/警告>潜在的なプログラミングの問題>ボクシングおよびアンボクシング変換
binary_to_atom/2 は使わない！！ #Erlang

Erlangで…
<font color="red">**binary_to_atom/2は使わない！！**</font>

以上

・

・

・

だけではよくわからないと思うので、、、

# 理由

| Data type | Memory size |
|:---------:|:------------|
| Atom      | 1 word. Note: an atom refers into an atom table which also consumes memory. The atom text is stored once for each unique atom in this table. <font color="red">The atom table is **not** garbage-collected.</font> |

何が来るかわからない `binary()` を _全て_ `atom()` に変えていたらメモリが開放されないのでメモリが足りなくなります。
なので、Erlangをよく知っていて大丈夫だと思って使う場合以外は使わないようにしましょう。
（僕も結構Erlangを書いていると思っていますが、 `binary_to_atom/2` は使っていません。）

参考URL: http://www.erlang.org/doc/efficiency_guide/advanced.html#id68923

# それでも `binary()` を `atom()` にしたい/しなければならない場合は…
それでも外部から受け取った `binary()` を内部で `atom()` として使用する場面があると思います。その時は、 `binary_to_existing_atom/2` を使いましょう。

> **binary_to_existing_atom(Binary, Encoding) -> atom()**
> 
> Types:
> 
> Binary = binary()
> Encoding = latin1 | unicode | utf8
> Works like binary_to_atom/2, but the atom must already exist.
> 
> Failure: badarg if the atom does not already exist.

この関数では、今変換しようとしている `Binary` が `atom()` として既に存在している場合は `atom()` に変換して存在しない場合は例外を投げます。

基本的にはErlangで `atom()` を使用したい場合、パターンマッチで使うため、既にコード内に `atom()` で存在しているため、この関数でもやりたいことを満たせるはずです。

変換後の `atom()` がコードの中にないという場合は、そもそもそのコードを見直したほうがいいかもしれません。（このほとんどの場合は `atom()` にする必要がないのではないかと思われる）
（変換後の `atom()` がコードの _どこかに_ あった場合でもうまくいかない時がありますが、本題からそれるためここでは説明を省く。）

参考URL: http://erlang.org/doc/man/erlang.html#binary_to_existing_atom-2
WindowsのVisualStudioでDoxygenをビルドする方法

この記事ではWindowsのVisualStudioを用いてDoxygenのソースファイルをコンパイルする方法について解説する。

 **Compiling from source on Windows** 
http://www.stack.nl/~dimitri/doxygen/manual/install.html#install_src_windows


 **環境** 
VisualStudio2008


##事前準備
任意のソースコードをダウンロードして解凍する。
https://codeload.github.com/doxygen/doxygen/zip/Release_1_8_9_1

Doxygenのビルドにはflexを使用している。
flexは字句解析のツールである。このツールはWindowsにも移植されている。
http://sourceforge.net/projects/winflexbison/

ダウンロードしたflexのフォルダにパスを通すか、doxygen-Release_1_8_9_1\winbuildにコピーする。

その後、下記のような改名処理を行う。

win_bison.exe→bison.exe
win_flex.exe→flex.exe

![doxygen2.png](https://qiita-image-store.s3.amazonaws.com/0/47856/ff4fa4fd-d663-9822-0f9d-9d575ef32fd3.png)

##Doxygenプロジェクトのみをビルド
VisualStudioでソリューションを開いてDoxygenプロジェクトのみをビルドする。

なお、他のプロジェクトは別の依存ライブラリが必要なので今回は対象外とする。

・doxysearchにはxapianが必要
http://stackoverflow.com/questions/25209217/missing-xapian-library-in-doxygen-build

・doxywizardにはQt version 4が必要
http://qt-project.org/

###文字コード関係のエラーが発生する場合...
VisualStudioはBOMなしのUTF-8の挙動が怪しい場合がある。
この場合は、プロジェクトで右クリックを押して、プロパティーを表示する。
そして、「Language」にて「Use English Only」を選択すればよい。

![doxygen.png](https://qiita-image-store.s3.amazonaws.com/0/47856/a63367c1-2fa0-1494-98e7-9e8fddb5fe7b.png)

Unicodeが必要な言語を全て排除できるので、円滑にデバッグを開始できる。

##デバッグ実行
デバッグ実行時にコマンドライン引数が与えられるので、問題のdoxyfileを指定してやれば、デバッグが可能になる。

![doxygen3.png](https://qiita-image-store.s3.amazonaws.com/0/47856/aa6b98a6-91b3-0898-fb4b-a0ef2f881f43.png)
レスポンシブなHTMLメールをつくる


仕事でHTMLメールを作る機会があったんですが、メーラーは種類が多く、各メーラーによって実装状況にかなり差があるので、多くのユーザー環境で正しく表示されるHTMLメールを作ろうと思うとなかなか面倒でした。
しかもレスポンシブとなると、通常のwebページでいうクロスブラウザ対応の比ではないほど気を使うことに。。

なので、やったことをここにメモしておきます。
後々、会社のブログで記事にするつもりだけど。


## 基本的なつくりかた

レスポンシブという言葉の響きで、なんかモダンな作りができそうだなーと思ってしまうけど、結局は下記のような昔ながらの作り方をしなくちゃいけないです。

+ tableレイアウトでコーディング。  
これでやらないとOutlookでまともに表示できない。
+ インラインスタイルでCSSを記述。  
\<style>タグに対応していないメーラーが多いため。

また、前述のとおり各メーラーで動作に差異があるので、それらを吸収するようなノウハウも必要です。

ただ、HTMLメールを作成する機会は年に一回あるかどうかといった感じなので（自分の場合）、この辺りの知見がなかなか溜まりにくい。
ここは素直に先人の知恵を借りるべく、既にあるテンプレートを使います。

今回使ったのはFoundationで有名なZURBが公開している[Ink](http://zurb.com/ink/)（教えてもらった）。

特に海外ではHTMLメールが普通に使われているようで、探せばこの手のテンプレートが結構見つかります。

Inkには各メーラーの差異を吸収するリセットCSS的なスタイルや、パネルやボタンなどのコンポーネント、グリッドレイアウト用のスタイルなどが定義されていますが、デザイン的にこれをそのまま使うのは難しい場合もあるかと思います。
なので、リセットCSS部分だけを拝借して、コンポーネントなんかは参考程度にして自前で作ってしまうのがよいかなと。

各メーラーのCSS対応状況なんかは下記を参考にするとよいです。
[The Ultimate Guide to CSS](https://www.campaignmonitor.com/css/)

インラインスタイルでCSSを記述すると書きましたが、コーディング時は普通にwebブラウザで確認するので、CSSを外部ファイルに分けたり、\<style>タグ内に書いてしまって問題ないです。後々変換するので。
最初からインラインでスタイルを書くと、心が擦り減っていくこと間違いなしですからね！

## レスポンシブ対応

インラインスタイルじゃないと読み込めないメーラーがあると書きましたが、最近のスマホのメールアプリは\<style>内のCSSも読み込んでくれます。
また、media queryにも対応しています。

なので、\<style>内にmedia queryを使ってスマホ用のスタイルを定義していきます。
所謂デスクトップファーストな書き方ですね。

ただ、当然インラインスタイルが優先されることになるので、!importantが必須です。


## 公開に向けて

### インラインスタイルへ変換
コーディングが終わったら、メーラーで表示させるための変更を加えます。
前述のとおり、インラインスタイルにしか対応していないメーラーがあるので、頑張って書いたCSS達をstyle属性に移します。

と言っても、Inkにはインラインスタイルに変換してくれる[ジェネレーター](http://zurb.com/ink/inliner.php)があるので、これを使って変換するだけです。
書いたCSSを\<style>タグ内に移してジェネレーターにコード一式をコピペすると、CSSのセレクタを見て、対象となる要素のstyle属性に埋め込んでくれます。
楽ですね。

※ Gulpを使ってインラインスタイル化する方法を[別記事](http://qiita.com/k-takam/items/1a58551868a453631bb9)に書きました。もっと楽したい方はこちらもご参考ください。

### 検証

完成したら各メーラーで動作チェックを行います。
各種メーラーを用意するのは大変なので、[Litmus](https://litmus.com/)のようなオンラインサービスを活用するとさらに楽ができます。
無料期間が7日間だけなのがつらいですが。。


## 完成！だけど問題が…

HTMLメール独特の作り方が多くて疲れますが、これでなんとか完成。
めでたしめでたし。
と思いたいところだったんですが、問題が。

実はGmailが\<style>内のCSSを読み込んでくれず、インラインスタイルにしか対応していないんですよね。
つまり、前述のレスポンシブ対応が有効にならないんです。

今回のやり方はデスクトップファーストで作っているのでPC版は特に問題にならないんですが、スマホのGmailアプリで見た時にもPC版の表示になってしまいます。

PC版が表示されるならいいじゃないかと思うかもしれませんが、これ、文字が小さくなってしまって結構見づらいです。
これじゃ、わざわざHTMLでメールを送っても十分な効果を得られそうにありません。

それならモバイルファーストで作ればいいかというとそうでもなく、モバイルファーストで作ると、今度はOutlookで表示が崩れてしまう。。

完全に詰んでるんですよね、これ。


## 現実的な選択肢

現実的には、下記のいずれかの手法で作成することになるかと思います。
最近はスマホでメールチェックする人が多いので、スマホでの表示を考慮する前提で。

1. レスポンシブはやめて、PCとスマホで完全に共通のデザインにする。
2. GmailはPC表示になってしまうことを割りきって、デスクトップファーストで作る。
3. Outlookで多少崩れてしまうことを割りきって、モバイルファーストでつくる。

1ですが、コーディングだけを見るとこれが一番簡単に作成できます。
普通のHTMLメールなので。

ただ、デザイン的に無理があるというか、写真メインのHTMLメールとかじゃない限りは、どうしてもPCで見ると文字が大きく、スマホで見ると文字が小さく感じてしまいます。
PCとスマホ、どちらで見てもそれなりには見えるという感じですね。

2と3は、PCとスマホのどちらかのユーザーをより重視して作るやり方です。
やっぱり、各デバイスに最適化された表示の方が読みやすいんですよね。

どちらを選ぶかですが、結局はそのコンテンツが誰をターゲットにしているのかという話なので、コンテンツ次第で使い分けるのがよいかなと思います。

今回上に書いた作り方は2に該当しますが、モバイルファーストで作る場合も、どちらのデバイス向けのスタイルをベースにするのかというだけで、今回書いた作り方と基本的に変わりません。

Gmailがレスポンシブに対応してくれれば、もっと満足のいく作り方ができるんですが。
SwiftでUIButtonを動的に生成しクリックされたボタンを判別する方法

SwiftでUIButtonを動的に生成しクリックされたボタンを判別する方法です。

UIButtonを継承したクラスを作って実現しています。
もっとスマートな方法があれば教えてほしいです。

###ソース

`ViewController.swift`

```swift
import UIKit

class ViewController: UIViewController {

    // UIButtonを継承した独自クラス
    class MyButton: UIButton{
        let x:Int
        let y:Int
        init(x:Int,y:Int,frame:CGRect){
            self.x = x
            self.y = y
            super.init(frame:frame)
        }
        required init(coder aDecoder: NSCoder) {
            fatalError("init(coder:) has not been implemented")
        }
    }

    //メイン
    override func viewDidLoad() {
        super.viewDidLoad()
        for x in 0...5{
            for y in 0...5{
            //位置を変えながらボタンを作る
                var btn : UIButton = MyButton(
                    x:x,
                    y:y,
                    frame:CGRectMake(CGFloat(x)*30,CGFloat(y)*30,20,20))
            //ボタンを押したときの動作
            btn.addTarget(self, action: "pushed:", forControlEvents: .TouchUpInside)
            //見える用に赤くした
            btn.backgroundColor = UIColor.redColor()
            //画面に追加
            view.addSubview(btn)
            }
        }
    }

    //ボタンが押されたときの動作
    func pushed(mybtn : MyButton){
        //押されたボタンごとに結果が異なる
        println("button at (\(mybtn.x),\(mybtn.y)) is pushed")
    }
}
```

### 実行結果

画面スナップショット

![hoge.png](https://qiita-image-store.s3.amazonaws.com/0/33447/cb29b25a-f216-43c8-9000-ef09dcfba8bf.png)


左上から右下に順番にボタンを押すと以下のようになる

```
button at (0,0) is pushed
button at (1,1) is pushed
button at (2,2) is pushed
button at (3,3) is pushed
button at (4,4) is pushed
button at (5,5) is pushed
```
C言語の基礎 (文字列操作) NO.10 備忘録

文字列を操作するにはstring.hというヘッダーをincludeするする
#文字列の連結
```c++:test.cpp
  char *szData1 = (char*)"abc";
  
  char *szData2 = (char*)"def";
  
  char *szData3 = NULL; // 連結した文字列を格納するエリア
  
  // それぞれの文字列の長さを調べてその和にNULL文字分の1を足した長さを確保
  szData3 = (char*)malloc(strlen(szData1) + strlen(szData2) + 1);
  
  if ( szData3 == NULL )
    return -1;
  
  // szData1をszData3へコピーする
  strcpy(szData3, szData1);
  
  CCLOG("szData3:%s",szData3);
  
  //szData2をszData3の文字列の後ろに連結コピー
  strcat(szData3, szData2);
  
  CCLOG("%s",szData3);
  
  // 確保したエリアの解放
  free(szData3);
```
実行結果
cocos2d: szData3:abc
cocos2d: szData3:abcdef


#文字列の検索と置換
```c++:test.cpp

  char szData[] = "abcabdabe";   // 検索対象文字列
  
  char *szAbd = (char*)"abd";     // 検索文字列
  
  char *szABD = (char*)"ABD";     // 置換文字列
  
  char *szStart = NULL;           // 検索開始位置ポインタ
  
  CCLOG("処理前のszData:%s",szData);
  CCLOG("処理前のszData_1:%p",szData);
  CCLOG("処理前のszData_2:%p",&szData);
  
  // 検索開始位置ポインタをszDataの先頭にする
  szStart = szData;

  CCLOG("処理前中のszStart:%s",szStart);
  CCLOG("処理前中のszStart_1:%p",szStart);
  CCLOG("処理前中のszStart_2:%p",&szStart);

  
  // 'a'を検索し、その'a'を示すポインタを代入
  szStart = strchr(szStart, *szAbd);
  CCLOG("%c",*szAbd);
  CCLOG("%p",szAbd);
  CCLOG("処理前中のszData:%s",szData);
  
  // 'a'が見つかっている間は繰り返す
  while ( szStart != NULL )
  {
    
    CCLOG("'a'が見つかった場所からの文字列:%s",szStart);
    
    //
    if ( strncmp(szStart, szAbd, strlen(szAbd)) == 0 )
    {
      strncpy(szStart, szABD, strlen(szABD));
    }
    
    szStart += 1;
    
    szStart = strchr(szStart, *szAbd);

  }
  
  
  CCLOG("%s",szData);
```
実行結果
cocos2d: 処理前のszData:abcabdabe
cocos2d: 処理前のszData_1:0x7fff51703bf8
cocos2d: 処理前のszData_2:0x7fff51703bf8
cocos2d: 処理前中のszStart:abcabdabe
cocos2d: 処理前中のszStart_1:0x7fff51703bf8
cocos2d: 処理前中のszStart_2:0x7fff51702d50
cocos2d: a
cocos2d: 0x10eae25aa
cocos2d: 処理前中のszData:abcabdabe
cocos2d: 'a'が見つかった場所からの文字列:abcabdabe
cocos2d: 'a'が見つかった場所からの文字列:abdabe
cocos2d: 'a'が見つかった場所からの文字列:abe
cocos2d: abcABDabe
StoryBoard上でViewControllerを追加したら落ちる話


ちょっとしたところで数時間ハマったのでメモ。

## 環境

Xcode:6.2

## 問題

NavigationController配下のViewを追加しようとしたら、

* 追加した画面へsegueを接続して実行してみると落ちる
(identifierに指定した文字列は合っていても「無い」的な例外発生）

* 追加した画面のNavigationItem（画面タイトルというかナビゲーションバーというか）が表示されない

## 解決
segueは「Show」で。

segueの種類として「Show Detail」を選択していたのがそもそもの原因だった。
「Show」を選択してやったら問題なく遷移できるようになり、NavigationItemも表示されるようになった。

実際、Storyboard上でSegueの指定を「Show」→「Show Detail」に変えるとその時点でNavigationItemが画面上から消える。

>参考：Segueの種類の解説記事
http://dev.classmethod.jp/references/xcode-6-segue/
→ Show Detail: ViewControllerを”置き換える”動きとなる。主にiPadで使う。 とのこと。

事前にViewController/segue追加の仕方を解説しているサイトを幾つか参照したうえでやってたのだが、segueのidentifierを"showDetail"とする例が多かった気がする。
Segue種類の選択肢と名前が一緒でややこしいので区別し易い名称に自分で変えたほうがよいと思った。
その点気付かずにハマったので、これに限らず細部までよく確認するようにする（という自戒の意味で）


![A3E14EB9-F489-452D-A44D-2A4CED73F611.png](https://qiita-image-store.s3.amazonaws.com/0/9039/724244ca-f34a-4446-f569-437c02833f2a.png "A3E14EB9-F489-452D-A44D-2A4CED73F611.png")
Trusterd で Basic 認証をかける

Trusterd の Basic 認証用のライブラリができました。ユーザー名とパスワードで認証することができるようになります。

# Trusterd のビルド

追加するライブラリを build_config.rb に記載し、ビルドします。

```rb
  conf.gem :github => 'qtkmz/mruby-crypt'
  conf.gem :github => 'iij/mruby-io'
```

# htpasswd の準備
Ubuntu で htpasswd コマンドを使う場合は apache2-utils パッケージが必要になります。あらかじめインストールしておきましょう。

以下では、htpasswd を新規に作成し、*mirin* ユーザーを追加します。

```
htpasswd -c /usr/local/trusterd/conf/htpasswd mirin
```

パスワードの形式はデフォルトの MD5 でハッシュしたもののみ対応しています。

# trusterd.conf.rb に設定を記述

```rb
s.set_access_checker_cb {                                                        
  if s.uri =~ /^\/auth\//                                                        
    basic = HTTP2::Server::BasicAuth.new({                                       
      :realm_name  => "Private Area",                                            
      :htpasswd    => "/usr/local/trusterd/conf/htpasswd",                       
    })                                                                           
    basic.authn(s)                                                               
  end           
}
```

# ブラウザでアクセス

/auth にアクセスすると、ユーザー名とパスワード聞かれるようになり、先ほど登録したユーザーでログインすることができます。

![trusterd_basic_auth.png](https://qiita-image-store.s3.amazonaws.com/0/32584/a7262907-7774-c4fd-4d74-7b049063fa6b.png)
【Ruby】なんで.reduce('')なん？とおもったので

このnanapiのブログ記事を見たときに

http://blog.nanapi.co.jp/tech/2015/04/02/basic_training_of_ruby/

詳しい内容は記事を読んでいただくとして、こんなコードが出てきました。

```ruby
def stringify(matrix)
  matrix
    .reduce('') do |result, a|
      result
        << a.map(&:to_s)
          .map { |v| v.rjust(4) }
          .join('|')
        << "\n"
    end
end
```

表示用に文字列を加工するメソッドなんですが、``.reduce('')``を使ってるんですよねー。  
ん、``reduce``って例えば

```ruby
(5..10).reduce() do |sum, value|
  sum + value
end
=> 45

# もしくは
(5..10).reduce(:+)
=> 45
```

こんな感じで合計値を出すときに使うと便利、みたいな感じじゃないん？と思って調べてみるとこんな記事を発見。

http://railspikes.com/2008/8/11/understanding-map-and-reduce

```ruby
(5..10).reduce(0) do |sum, value|
  sum + value
end
```

引数がInitial valueになるんですよねー。上記の記事の解説を引用させていただくと

-----

- Collection: 5, 6, 7, 8, 9, 10
- Initial Value: 0
- Function: add current value to running total

|Pass #   |Collection Value   | Running Total  | Return Value  |
|--:|--:|---:|---:|
|   1|   5|   0 (initializer value)|   5|
|   2|   6|   5|   11|
|   3|   7|   11|   18|
|   4|   8|   18|   26|
|   5|   9|   26|   35|
|   6|   10|   35|   45|
			
-----

こういうことなんですね。

そこで冒頭のコードをコメント付きで引用しますと

```ruby
def stringify(matrix)
  matrix
    .reduce('') do |result, a| # 文字列に畳み込む
      result
        << a.map(&:to_s) # 要素を文字列化して
          .map { |v| v.rjust(4) } # スペースパディングして右寄せして
          .join('|') # | で連結した文字列を結果に詰める
        << "\n" # 改行して区切る
    end
end
```

文字列を返しているわけなので``('')``にすると。

ちょい試してみると

```ruby
(5..10).reduce('') do |sum, value|
  sum.to_s + value.to_s
end  
=> "5678910"
```

こうなるわけですね。ちなみに

```ruby
(5..10).reduce(1) do |sum, value|
  sum + value
end  
=> 46
```

１から始まるわけなので当然結果もプラス１で返ってます。
既存の<form>要素をそのまま利用してAJAXでPOSTする

# はじめに
jQueryを使えばAJAXを利用して画面遷移しないGETなりPOSTなりなんでもできますが、できればJavaScriptのコードはスッキリ書きたい。

そんな想いをいだきつつ、要素が10個近くありつつさらに大量のチェックボックスリストという可変な配列要素を含んだたいへんなformを、画面遷移しないで送らなければならない現実と睨めっこしていたんですが、これがなかなかググっても出てこない。

画面遷移無しのPOSTする方法なんてのは腐るほど出てくるんですが、どれもだいたい空オブジェクト作っては値をセットして送信するという
えらく原始的な
基本に忠実な手法が出てきます。

最初はform配下のinput要素をfindしてeachで回して～みたいなことしてたんですが、配列になったときとかの動作が闇すぎて使う気になれなくてのっぺりしてきたときに、[serializeArray()](http://semooh.jp/jquery/api/ajax/serializeArray/+/)という救世主を見つけたので紹介します。

# サンプル
## コード

```html:こんなイメージ
<form id="myForm" action="/path/to/post" method="post">
  <input type="text" name="element1" />
   :
  <input type="checkbox" name="listData[]" />
  <input type="checkbox" name="listData[]" />
   :
</form>
```

```Javascript:上記コードの直後でもreadyでもどこでも適切なところへ
$('#myForm').on('submit', function(event) {
  event.preventDefault(); // 本来のPOSTを打ち消すおまじない
  $.post(
    $(this).attr('action'),
    $(this).serializeArray(),
    function(result) {
      alert('ｻｲﾀﾏ-----(・∀・)-----!!!');
    },
    'json'
  );
});
```

## 解説
使ってるメソッドもそんなに多くなくてそれぞれのリファレンスみたらだいたいわかるんでそんな語ることもないんですが、このコードの良いところは、$.postを利用する際にformのactionと各種要素を参照しているため、formの内容が変わったりしてもイイカンジに動くところです。

また、HTMLコード上は通常のformであるため、JavaScriptオフ状態でも問題なくpostされます(画面遷移がどうなるかは受け取り側のプログラムによりますが)。

実際にプロダクションで利用する際には、送信後にフラッシュメッセージを表示したり、二重送信防止したり、失敗したときの処理つけたり($.postもう使えないけど)などなど、ゴテゴテとくっつけてご利用くださいませ。

## おわりに
そういえば最近のサイトって超絶リッチなJavaScriptが惜しげもなく動いてますけど、みんなもうnoscript対応とかしてないんでしょうかね...。
シェルのパイプの速度(進捗バー) は pv で

シェルでコマンドをパイプをつなげている時、
どれくらいの速度でパイプをデータが通過しているのか知りたい事がある。
 pv コマンドを使うと分かる。

pipe viewer の略で pv らしい。

# 使用例

```shell-session
$ gzip -dc < something.gz | python analysis.py > result.txt
```

例として ↑ のように gzip を解凍してパイプを通して Python のスクリプトに渡し、
結果は result.txt に出力しているとする。
このとき間に pv　をパイプして通すと進捗バーが表示される。


```shell-session
$ gzip -dc < something.gz | pv | python analysis.py > result.txt
81MiB 0:00:17 [  13MiB/s] [                  <=>                                   ]
```

13 MiB/s の速度が出ていて、それまで計 81MiB のデータが pv を経由したとわかる。
進捗バーは /dev/tty に直接出してくれているようなので
標準出力や標準エラーをリダイレクトしても特に差し障りない。

# 使用例 2

pv は進捗バーを出す他は、完全に内容をそのまま通過させるので cat の代わりに使うこともできる。
たとえば、次のようなコマンドだと、 a.txt から から b.txt に進捗を表示しながらコピーする。

```
$ pv a.txt > b.txt
1.92GiB 0:00:32 [60.8MiB/s] [=======================================================================>] 100%
```

# 他の使用例

```man``` を読むと、全体のサイズを指定する ```-s``` オプションを始め、
フォーマットのオプションやモードのオプションが多岐に渡る。

# インストール方法

## OS X

```shell-session
$ brew install pv
```

## Debian/Ubuntu

```shell-session
$ sudo apt-get install pv
```

## RHEL/CentOS

```shell-session
$ sudo yum install pv
```
React0.13における各flux軍団の対応考察メモ


React0.13になってから触ってみたらいくらかflux事情も変わっていたので調べた話

# React 0.13で何が変わったのか？

- mixinのdepreacted化
	- http://qiita.com/mizchi/items/ce9a128aa2a47804e083
- React.ComponentによりES6な記法で書ける

fluxに絡むところでいうとこのへんがでかい。

やっぱり0.13からはclass使いたい！

今までのfluxライブラリは今まで概ね`mixin`を使うことでviewとstoreを紐付けてきた。

じゃあこれからどうすんの？？？

# 各flux達の対応具合

## [flummox](http://acdlite.github.io/flummox)
~~個人的には今後はこれを使っていこうかなと思っているのがflummox。~~

**2015/07/23追記：[flummoxは4.0で更新止めるからこれからはreduxを使ってね！](https://github.com/acdlite/flummox#40-will-likely-be-the-last-major-release-use-redux-instead-its-really-great)**だそうだ・・


fluxxorと名前似ててややこしい。


[Why flux component is better than flux mixin](https://github.com/acdlite/flummox/blob/master/docs/docs/guides/why-flux-component-is-better-than-flux-mixin.md)という記事があるので詳しくはこちら。

具体的にはざっくりこんな感じ

```jsx
class Container extends React.Component{
  render(){
  	//一個storeとつなぐ親コンポーネントがラップする
    return (
      <FluxComponent flux={this.flux} connectToStores={{
        messages: store => ({
          foo: store.getFoo(),
          baz: store.getBaz()
        })
      }}>
        <InnderCompoent />
      </FluxComponent>
    )
  }
}

class InnderCompoent extends React.Component{
  render(){
  	// 取り出したstoreはpropとして子に伝播
    const { foo, baz } = this.props
    return (
      <div>
      </div>
    )
  }
}
```

概要で言うと、FluxComponentというElementを外側に配置し、それがStoreからデータを呼び出しpropsとして子要素に流してくれる。
結構このパターン多い。みたい。

余談だがflummoxにおいてstoreのサンプルではasync/awaitを利用していた。ナウい。

## [Alt](http://alt.js.org/)
だいたいflummoxと同様な対応っぽいので省略
http://alt.js.org/docs/components/altContainer/
Altは先鋭的ではあったけど若干複雑さを感じて断念

## [Marty](http://martyjs.org/)
以前自分で[こんな紹介記事](http://qiita.com/suisho/items/22ad9efcac90127f87a1)を書いてみたりしていたくせにというのがありつつ、今回のReact0.13の対応の話だと若干微妙かもなあというのがMarty。
どことなく場当たりな雰囲気を感じざる負えない。

```jsx
class User extends React.Component {
  render() {
    return <div className="User">{this.props.user}</div>;
  }
}

// createContainerで今までと似たような記法をする
module.exports = Marty.createContainer(User, {
  listenTo: UserStore,
  fetch: {
    user() {
      return UserStore.for(this).getUser(this.props.id);
    }
  },
  failed(errors) {
    return <div className="User User-failedToLoad">{errors}</div>;
  },
  pending() {
    return this.done({
      user: {}
    });
  }
});
```

結構やっていることが今までのmixinっぽさなのだが、結局ES6っぽくなくてうーんな感じ。

## 未対応っぽいFlux達
あまりちゃんとは追ってないけどこのあたりの初期からある者達対応追いつけてない感じがある。
issueやRoadmapまでは未確認。

- Reflux
	- https://github.com/spoike/refluxjs#convenience-mixin-for-react
- Fluxxor
	- http://fluxxor.com/guides/quick-start.html
- delorean
	- https://github.com/deloreanjs/delorean/blob/master/docs/views.md
- McFly
	- https://github.com/kenwheeler/mcfly#stores


# 結論
もうflummoxでいいんじゃないかな
<a href="tel:***">リンクをスマートフォン端末以外では無効にする

a要素のhref属性を "tel:***" と設定すると、スマートフォン端末ではブラウザタップから直接電話をかけることが可能になります。

~~~html:HTML
お問い合わせ：<a href="tel:0123456789">0123-45-6789</a>
~~~

非常に利便性の高い実装ですが、レスポンシブWebデザインでサイト制作をする場合には、PC端末等での閲覧・操作時に予期しない挙動となる場合があります。

"tel:" リンクを【スマートフォン端末以外では無効】にする方法はいくつかありますが、

- 「カスタムデータ属性の追加」といったHTML側の調整が必要ない
- 余計なDOMの書き換えが発生しない

という条件では以下のシンプルな実装が考えられます。（jQuery使用）

~~~javascript:JavaScript
var ua = navigator.userAgent.toLowerCase();
var isMobile = /iphone/.test(ua)||/android(.+)?mobile/.test(ua);

if (!isMobile) {
	$('a[href^="tel:"]').on('click', function(e) {
		e.preventDefault();
	});
}
~~~

ユーザーエージェントを判別し、スマートフォン端末以外の場合には tel: リンククリック時のイベントを無効化します。

a要素自体はそのまま残るため、マウスオーバー時にはカーソルがpointer（指マーク）となります。
CSSも併せて調整することで、「リンクではない」ということをユーザーに明示できます。

~~~css:CSS
a[href^="tel:"] { cursor: default; }
~~~
主要なプログラミング言語がいつ登場したのかまとめ

※鋭意更新中です。

* 発表年ベースです
* 追加・修正などあれば修正リクエストを送ってください。


|年|言語|
|---|---|
|1972年|C|
|1983年|C++, Objective-C|
|1987年|Perl|
|1990年|Haskell|
|1991年|Python, VisualBasic|
|1995年|Java, JavaScript, PHP, Ruby|
|1996年|
|1997年|
|1998年|
|1999年|
|2000年|
|2001年|
|2002年|C#|
|2003年|Scala|
|2004年|
|2005年|
|2006年|
|2007年|
|2008年|
|2009年|Go|
|2010年|Rust|
|2011年|Kotlin, Dart|
|2012年|
|2013年|
|2014年|Swift, Hack|
|2015年|
第30回オフラインリアルタイムどう書くの答案

[とある世界のタクシー料金 横へな 2015.4.18 問題](http://nabetani.sakura.ne.jp/hena/ord30taxi/)の非リアルタイムの答案です。
最初Andoroidでポチポチと1文字ずつコードを打っていましたが、1時間程で限界が来てPCに環境を移しました。
トータル1時間半ぐらいでしょうか。

```rb
CITY = {
  'A' => :en,
  'B' => :en,
  'C' => :en,
  'D' => :tan,
  'E' => :tan,
  'F' => :tan,
  'G' => :tan,
}.freeze
ROOT = {
  'AB' => [:en,  1090],
  'AC' => [:en,   180],
  'AD' => [:tan,  540],
  'BC' => [:en,   960],
  'BG' => [:en,  1270],
  'CD' => [:tan,  400],
  'CF' => [:en,   200],
  'DE' => [:tan,  720],
  'DF' => [:tan,  510],
  'EG' => [:tan, 1050],
  'FG' => [:tan,  230],
}.freeze
PAY = {
  en:  [[995, 400], [200, 60]],
  tan: [[845, 350], [200, 50]],
}.freeze

def solve(prms)
  roots = prms[:root].chars.each_cons(2).to_a
  first_start, first_goal = roots.first
  rest_distance, pay = PAY[CITY[first_start]][0]

  roots.each do |root|
    root_region, root_distance = ROOT[root.sort.join]
    pay_distance, pay_cost = PAY[root_region][1]
    rest_distance -= root_distance
    if rest_distance < 0
      pay += (-rest_distance / pay_distance + 1) * pay_cost
      rest_distance %= pay_distance
    end
  end

  pay

end


prms_cfg = [[:root, :to_s], [:expect, :to_i]]

answers = DATA.each_with_object([]) do |line, memo|
  id, *prms_str = line.chomp.split("\t")
  prms_val = prms_cfg.zip(prms_str).map{|(name, convert), str| [name, str.send(convert)]}
  prms = Hash[*prms_val.flatten]

  prms[:estimate] = solve(prms)
  if prms[:estimate] == prms[:expect]
    puts "#{id}: Correct."
  else
    puts "#{id}: Wrong."
    puts "  #{prms}"
    memo << id
  end
end
puts
puts 'wrong answer:'
puts answers.join(',')

__END__
0	ADFC	510
1	CFDA	500
2	AB	460
3	BA	460
4	CD	400
5	DC	350
6	BG	520
7	GB	530
8	FDA	450
9	ADF	450
10	FDACB	750
11	BCADF	710
12	EDACB	800
13	BCADE	810
14	EGFCADE	920
15	EDACFGE	910
16	ABCDA	960
17	ADCBA	1000
18	BADCFGB	1180
19	BGFCDAB	1180
20	CDFC	460
21	CFDC	450
22	ABGEDA	1420
23	ADEGBA	1470
24	CFGB	640
25	BGFC	630
26	ABGEDFC	1480
27	CFDEGBA	1520
28	CDFGEDABG	1770
29	GBADEGFDC	1680
```
【Android】Androidの基本を覚えた後に覚えたいこと～はじめてのFragment②～

[【Android】Androidの基本を覚えた後に覚えたいこと～はじめてのFragment①～](http://qiita.com/chihiro/items/793a53c04eb43108778d)の続きです。


# Fragmentの使用
前回も、「コードの中で追加する」で少し触れていますが、コード上でActivityへFragmentを追加する方法を詳しくまとめます。
以下、サンプルコードです。

``` MainActivity.java
// FragmentManagerからFragmentTransactionを作成
FragmentManager fragmentManager = getFragmentManager();
FragmentTransaction transaction = fragmentManager.beginTransaction();

// 実際に使用するFragmentの作成
Fragment newFragment = new SampleFragment();

// Fragmentを組み込む
transaction.replace(R.id.fragment_container, newFragment);

// backstackに追加
transaction.addToBackStack(null);

// 上記の変更を反映する
transaction.commit();
```

**FragmentTransaction**
Fragmentを使用するときには、FragmentTransactionを使用します。

``` Java
FragmentManager fragmentManager = getFragmentManager();
FragmentTransaction transaction = fragmentManager.beginTransaction();
```

このFragmentTransaction(transaction)に対して、Fragmentの変更などを設定していきます。

**ActivityへFragmentを組み込む**
今回のサンプルコードではreplaceメソッドを使用しています。

``` Java
transaction.replace(R.id.fragment_container, newFragment);
```

第1引数はFragmentが入るViewのID、第2引数は挿入するFragmentです。
第1引数で指定したViewのIDの部分にすでにFragmentが存在する場合は、そのFragmentをremnove(削除)してから、第2引数のFragmentをadd(追加)します。

このほかにもFragmentをActivityに追加したり、削除したりすることもできます。
以下に、その他のメソッドをあげます。

|メソッド|説明|
|:-----------|:------------|
|add (int containerViewId, Fragment fragment)もしくはadd (Fragment fragment, String tag)|Fragmentを追加する。追加したいFragmentと追加したい場所のidもしくはtagを指定する|
|remove (Fragment fragment)|Fragmentを削除する|
|replace (int containerViewId, Fragment fragment)|すでにFragmentが存在する場合には、一度removeしてからaddする|
|hide (Fragment fragment)|Fragmentを非表示にする|
|show (Fragment fragment)|Fragmentを表示する|

**Fragmentをbackstackに登録**

``` Java
transaction.addToBackStack(null);
```

このコードは、backstackにFragmentを追加しています。
バックキーを押すことによって、この状態の画面に戻ることができるようになります。

**コミット**
commitメソッドを呼び出すことで、これまでの変更を反映できます。

``` Java
transaction.commit();
```

commitメソッドは、変更をすべて設定し、最後に呼び出す必要があります。

# 参考
* http://developer.android.com/guide/components/fragments.html
* http://developer.android.com/reference/android/app/FragmentTransaction.html
Laravel5.0 CSRFチェックを無効化

Laravel5では全てのPOSTに勝手にCSRFチェックが付いてきます。
サイト内に置く通常のフォームには便利なのですが、Laravel外からのPOSTを受け取りたいときにも自動発動するため大迷惑です。

CSRFチェックを排除する方法が何故かなかなか見当たらなかったので調査結果を記載。

## Kernel

デフォルトで適用されるミドルウェアは
```app/Http/Kernel.php```
に記載されています。
```'App\Http\Middleware\VerifyCsrfToken'```
が書かれている行を削除するとCSRFチェックが無効化されます。

この場合、あらゆるフォームに対してCSRFチェックが無くなります。
特定のフォームに対して有効にしたい場合、コントローラのコンストラクタに

```php
$this->middleware('App\Http\Middleware\VerifyCsrfToken'); 
```
と書けば、そのコントローラでは有効になります。

しかし、各メソッド内に書いても効かないようです。
つまり、同一コントローラ内のフォームAには有効に、フォームBには無効にしたいといったことができません。

さらにデフォルトが危険側に倒れるため、この設定は微妙。

## VerifyCsrfToken

CSRFチェックの本体は
```app/Http/Middleware/VerifyCsrfToken.php```
です。
ここにCSRFチェックを無効にしたいフォームを記載することでどうにかします。

デフォルトのVerifyCsrfToken::handle()は

```php
	public function handle($request, Closure $next){
		return parent::handle($request, $next);
	}
```
とだけ書かれていましたが、ここを変更。
	
```php
	// CSRFを除外したいURLリスト
	protected $routes = [
		'hoge/fuga',
		'foo/bar',
		'baz/qux',
	];
	
	// handleを変更
	public function handle($request, Closure $next){
		if($this->excludedRoutes($request)){
			return $this->addCookieToResponse($request, $next($request));
		}
		return parent::handle($request, $next);
	}
	
	/*
	* CSRFを除外したいURLであるかどうかをチェックする。
	* @param Request リクエスト
	* @return boolean CSRFを除外したいURLであればtrue
	**/
	protected function excludedRoutes($request){
		foreach($this->routes as $route){
			if ($request->is($route)){ return true; }
		}
	}
```

これで特定URLだけCSRFチェックを外すことができました。

一部のフォームを操作したいだけなのに、いちいち全体に影響のあるファイルを変更しないといけないのが微妙。

## コントローラ

```php
	HogeController::postForm(){
		$this->disableMiddleware('App\Http\Middleware\VerifyCsrfToken');
	}
```

みたいなことはできんのか？

## 参考

http://laravel.io/forum/11-14-2014-disabling-the-csrf-middleware-in-laravel-5
http://www.camroncade.com/disable-csrf-for-specific-routes-laravel-5/
http://www.techigniter.in/tutorials/disable-csrf-check-on-specific-routes-in-laravel-5/
Node.jsのHello WorldプログラムをIBM Bluemixで動かしてみる

Github上のNode.jsのサンプルプログラム（Hello World）をIBM Bluemix上で動かしてみる。

## 前提
1. Git クライアントが導入されていること
    * Git のインストールは、「サルでもわかるGit入門」の["チュートリアル1 Gitの基本 Gitのインストール"](http://www.backlog.jp/git-guide/intro/intro2_1.html)を参照
2. cfツールが導入されていること
    * cfツールのインストールは、「Bluemixマニュアル」の["Cloud Foundry コマンド・ライン・インターフェースを使用したコーディングの開始"](https://www.ng.bluemix.net/docs/#starters/install_cli.html)を参照

## 作業の流れ
1. Githubからサンプルプログラムを取得
2. manifest.yml を編集
3. IBM Bluemixにサンプルプログラムをpush

## 1. Githubからサンプルプログラムを取得
Githubからサンプルプログラムを取得してください。

```
git clone https://github.com/asmanabu/HelloWorldNode
```

ここでは、C:\work\HelloWorldNode にcloneしたこととします。

## 2. manifest.yml を編集
manifest.yml は、Bluemixにアプリケーションをデプロイするときに参照されるファイルです。
アプリケーションが使用するホスト名は、Bluemixを利用する全ユーザーで重複が許されないため、ここで編集します。

エディターで C:\work\HelloWorldNode\manifest.yml を開きます。
*\<change to your hostname\>* の部分を修正してください。

```修正前のmanifest.yml
applications:
- disk_quota: 1024M
  host: <change to your hostname>
  name: HelloWorld
  command: node app.js
  path: .
  domain: mybluemix.net
  instances: 1
  memory: 256M
```

manifest.ymlの修正例です。helloworldの後ろに日付と適当な文字列を追加しています（helloworld20150421abc）。

```manifest.ymlの修正例
applications:
- disk_quota: 1024M
  host: helloworld20150421abc
  name: HelloWorld
  command: node app.js
  path: .
  domain: mybluemix.net
  instances: 1
  memory: 256M
```

## 3. IBM Bluemixにサンプルプログラムをpush
サンプルプログラムをBluemixにデプロイします。

C:\work\HelloWorldNode\ に移動し、以下のコマンドを実行します。
現在のディレクトリ以下にあるすべてのファイルをBluemixに転送します。**不要なファイルを転送しないように、必ずディレクトリを移動してください。**

```
cf push
```

以下の出力のように、**running**と表示されれば、Bluemixへのデプロイは完了です。時刻やURLは、各環境に依存します。

```
requested state: started
instances: 1/1
usage: 256M x 1 instances
urls: helloworld20150421abc.mybluemix.net
package uploaded: Tue Apr 21 12:15:47 +0000 2015

     state     since                    cpu    memory          disk          details
#0   running   2015-04-21 09:17:44 PM   0.3%   29.4M of 256M   33.7M of 1G
```

ブラウザを開いて、デプロイされたアプリケーションを確認しましょう。先ほどの出力のなかで、urlsに表示されているURL（この例では、helloworld20150421abc.mybluemix.net）にアクセスしてください。

Hello Wolrdと表示されていますでしょうか？
Go言語でpongコマンドを実装する

![pong.gif](https://qiita-image-store.s3.amazonaws.com/0/33890/12c873d0-de1d-bb19-ccb7-7134984c09cd.gif)

はい。出オチです。

実行ファイルはこちら(WIndows,OSX,CentOS向けを用意)
https://github.com/kurehajime/pong-command/releases/tag/0.2

ソースはこちら
https://github.com/kurehajime/pong-command

# 中身補足

[termbox-go](https://github.com/nsf/termbox-go)というライブラリを利用してGUI風CUIを実現しています。

こんな感じでキーイベント拾えます。

```go

for {
	switch ev := termbox.PollEvent(); ev.Type {
	case termbox.EventKey:
		switch ev.Key {
		case termbox.KeyEsc:
			//Escキー押した時の処理
		case termbox.KeyArrowUp:
			//上キー押した時の処理
		case termbox.KeyArrowDown:
			//下キー押した時の処理
		default:
		}
	default:
	}
}

```

こんな感じで任意の座標に文字を配置できます。

```go

termbox.SetCell(x, y,str, FontColor, BackgroundColor)

```

なんだかRogueクローンが作りたくなるライブラリですね。

Go言語は並列処理がとても簡単に書けるので、この手のちょっとしたアクション要素のあるコマンドが実装しやすいです。
ruby勉強メモ


##シンタックスシュガー

四則演算の+もメソッドであるから

```ruby:syntax_sugar.rb

#メソッドのように書くと
1.+(1)

#シンタックスシュガー（通常このように書く）
1+1
```



##メソッドチェーン

メソッドをつなげて書くことができる

```ruby:method_chain.rb

#Stringのメソッド一覧を表示
"test".methods

#=>

<=>
==
===
eql?
hash
casecmp
+
*


#メソッドチェーン
"test".methods.size
#=>161

```

##デバッグ

```ruby:debag.rb

#クラス名を確認する方法
object.class

#クラスのメソッド一覧を表示
object.methods


#Arrayクラスの要素数を返す
array.size


#オブジェクトの中身を確認
require 'pp'
pp object
```

#クラス

インスタンス変数とsetter,getterを書くと以下のようになる。

```book.rb
class Book

  # インスタンス変数
  def author
    @author
  end

  def title
    @title
  end

  def isbn
    @isbn
  end


  # setter
  def author=(author)
    @author = author
  end

  def title=(title)
    @title = title
  end

  def isbn=(isbn)
    @isbn = isbn
  end

  def get_author
    author
  end

  # getter
  def get_title
    title
  end

  def get_isbn
    isbn
  end

end
```

```class.rb
require_relative 'book.rb'
book = Book.new

# セット
book.author = 'aiueo'
book.title = 'akstn'

book.isbn = 123456

p book
#=> #<Book:0x007fa69488d730 @author="aiueo",@title="akstn", @isbn=123456>

p book.getAuthor
#=> "aiueo"

p book.getTitle
#=> "aiueo"

p book.getIsbn
#=> 123456
```

###attr_accessor
getter setterを自動で設定してくれる

```ruby:book.rb
class Book
  #setter getter設定
  attr_accessor :author, :title, :isbn
end
```

```ruby:class.rb
require_relative 'book.rb'
book = Book.new

book.author = 'aiueo'
book.title = 'akstn'
book.isbn = 1234
p book
#=> #<Book:0x007f8c528fd6e0 @author="aiueo", @title="akstn", @isbn=1234>

p book.author
#=> "aiueo"

p book.title
#=> "akstn"

p book.isbn
#=> 1234
```

### initialize

```ruby:book.rb
class Book

  #setter getter設定
  attr_accessor :author, :title, :isbn

  #コンストラクタ(インスタンス作成時代入を行う)
  def initialize(author, title)
    @author = author
    @title = title
  end
end
```

```ruby:class.rb
require_relative 'book.rb'
book = Book.new('author', 'title')
p book
#=> #<Book:0x007f7ff281e948 @author="author", @title="title">
```
OculusとTHETAでリアルタイムの旅をしよう〜その3

その2は[こちら](http://qiita.com/sandinist/items/94a9d7e2e59afb1699a4)

# サービス概要

遠くの場所を、リアルタイムに360度体験できるサービスをなるべく簡単に作ります。

## ゴールイメージ
* 作成したアプリの入ったiPhoneとTHETAを持って旅にでる
* 家で待っている人が、旅先の風景をOculusでリアルタイムに360°体験できる

## 使ったもの
### Hardware
* THETA m15
* Oculus Rift DK2
* iPhone 6
* MacBook Air (13-inch, Mid 2012)

### Software
* Unity 5.0.0f3

## サービス全体像
![サービス全体像.png](https://qiita-image-store.s3.amazonaws.com/0/2798/19367e26-6122-0a2c-6c53-2bea33c41f5d.png)

# Unity App 編
* 今回はいよいよ (3)Unity App 部分をつくります。

### 前提条件
* その1、その2ができてること
* Unity がインストールされていること
* Oculus Rift DK2 があること

### 開発の準備
下記のURLなどを参考にOculus Riftの開発環境を整えましょう
* [Unity＋Oculus Rift開発メモ（DK2、SDK 0.5.0.1対応）](http://framesynthesis.jp/tech/2013/oculus-rift/)
* [楽しく使う Oculus Rift DK2](https://docs.google.com/spreadsheets/d/1PtYxl2VmlNTJIxU-yrwEXCwGhYaT7bihKGqvfL7k5oE/htmlview?sle=true#gid=0)
* https://developer.oculus.com/downloads/ から Runtime と SDK、Unity 4 Integration（Unity 5でも使用できます）をダウンロードしておきましょう
* Runtime をインストールし、Oculus Rift を接続して、OculusConfigUtil.app や Displayの設定を整えて、デモが動作することを確認しましょう
* SDK に入っている、Oculus World Demo も確認しておきましょう

### 作成するアプリの説明
1. THETA画像を表示するモデルを用意して、テクスチャに貼ります
2. Oculus Riftのカメラを配置し、ぐるぐる見渡せるようにします（この時点で楽しい）
3. Web Appから画像を取得し、テクスチャを変更する処理を追加します
4. Enjoy!!

### 1. THETA画像とモデルの準備
[UnityでTHETAの画像をジャイロでグリグリ動かすアプリを作る](http://www.naturalsoftware.jp/entry/2014/07/25/080711) にて紹介されている方法を参考にします。

* Unity 3D Project を新規に作成します
* [Unity 伊藤さんが公開しているモデル](https://twitter.com/warapuri/status/480915916645863424) （これをSphereモデルと呼びます）と THETA画像の2つをAssetsに追加します
* SphereモデルをHierarchyに追加し、Scale (10, 10, -10) と Position(0, 0, 0) をカッコ内の値に変更します。
* Sphererモデルの ShaderをUnlit/Textureに変更し、テクスチャにTHETAの画像をドラッグ&ドロップします

### 2. Oculus Riftのカメラを配置して見ることが出来るようにする
* Unity 4 Integration の OculusUnityIntegration.unitypackage をインポートします
* Hierarchy の Main Camera を削除し、OVR > Prefabs > OVRCameraRig を代わりに追加します。Position(0, 0, 0)に設定しましょう
* 実行して、Unity とゲームビューを最大化して、Oculus Rift で見てみましょう。THETA画像の世界にワープ出来たと思います（この時点で楽しい）

もし、実行を押して、下の行でエラーが出る場合は

```csharp
c.renderMode = RenderMode.World; 
```

下記の行を生かすように変更してください。

```csharp
c.renderMode = RenderMode.WorldSpace;
```

### 3. Web Appから画像を取得して表示する

Assets フォルダを選択して、空欄を右クリックし create > javascript でスクリプトを追加し、 UpdateTexture.js という名前に変更します。作成したファイルをダブルクリックしてエディタを開き、下記のコードを入力します。[app name] はその1で作ったアプリ名です。

```js
var url = "https://[app name].herokuapp.com/equi";

function Start () {
	while(true) {
		var www = new WWW(url);		
		yield www;

		www.LoadImageIntoTexture(GetComponent.<Renderer>().material.mainTexture);
	}
}
```

Sphereモデルにスクリプトをドラッグ&ドロップで追加すると完成です。アプリをフルスクリーンで実行して見てみましょう。何秒か待って、Web App にアップロードしてある画像に切り替われば成功です。

### 4. 完成！
これでTHETAm15とiPhoneのセットで撮った全天球画像を、インターネットを介して、すぐにMBAとOculusのセットからぐるぐると見渡すことが出来るようになりました。

## おわりに
遠隔地からの全天球画像を、すぐに見ることができるという体験を楽しむことができるようになったと思います。音声もつなぐと、タイムラグはありますが、より楽しむことが出来るかもしれません。
これをきっかけに全天球画像を活用したアプリが増えると嬉しい限りです。

最後まで読んでいただき、ありがとうございました！
[Android][Java] Getting Started

# Introduction
Androidのスマホを買ったので、Javaの勉強がてらAndroidの開発でもしてみます。

# Install

## JDK (Java Development Kit)
http://www.oracle.com/technetwork/java/javase/downloads/

* 最新版の[8u45](http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html)を入れました。(2015/4/19)

## Android Studio
https://developer.android.com/sdk/

* 先にJDKをインストールしておかないといけません。（最初にインストールを促されます）
* 1.1.0でした。(2015/4/19)

# Settings

## 実機で動かす

### 端末側

1. ```[設定]-[端末情報]```の```ビルド番号```を連打して```開発者向けオプション```を出現させる。（Android 4.2から隠しメニューになったらしい）
1. ```[設定]-[開発者向けオプション]```の```USBデバッグ```をONにする。

### Android Studio側

* ```[Configure]-[Project Defaults]-[Run Configrations]```の```[Defaults]-[Android Application]```の```General```タブにある```Target Device```を```Show chooser dialog```か```USB Device```にする。

![android_usbdevice.PNG](https://qiita-image-store.s3.amazonaws.com/0/18828/5ba81764-8e02-51d7-1e6c-29c3ea847164.png)

# Hello World

1. ```Start a new Android Studio Project```で新規作成。
1. 適当な名前を付けて、他はデフォルトのままでFinish。
1. Shift+F10で実行。

![android_hello.PNG](https://qiita-image-store.s3.amazonaws.com/0/18828/b58ac1d8-2e29-c3bf-2b44-706481d2320f.png)
expressで国際化！i18n-nodeを使おう

# はじめに
Railsの国際化の記事は多いのですがexpressがあまりない悲しみ。基本的な流れはそんなに変わらないと思いつつ置いときます。こちらの環境はNode.JS 0.12.x + express4.9です。

# express4のアプリを多言語化する
まずは[i18n](https://www.npmjs.com/package/i18n)を入れましょう。githubのリポジトリ名はi18n-nodeですが、npm名はi18nです。

```
npm install i18n
```

このとき、app.jsの参考設定は下記の通りです。

```app.js
var app = express();
var express = require('express');
var session = require('express-session');
var i18n = require("i18n");
//・・・中略・・・

// i18nの利用設定
i18n.configure({
  // 利用するlocalesを設定。これが辞書ファイルとひも付きます
  locales: ['ja', 'en'],
  defaultLocale: 'ja',
  // 辞書ファイルのありかを指定
  directory: __dirname + "/locales",
  // オブジェクトを利用したい場合はtrue
  objectNotation: true
});

app.use(i18n.init);
// manualでi18nセッション管理できるように設定しておきます
app.use(function (req, res, next) {
  if (req.session.locale) {
    i18n.setLocale(req, req.session.locale);
  }
  next();
});
```

辞書ファイル('/locales'以下)についてはオブジェクト利用OKにしていくと入れ子が使えて便利です。末尾にカンマ（この例だと` "E-Mail": "E-Mail",`になっていたらNG）があるとエラーするので注意しましょう。

```locales/ja.jsonの一部抜粋.
	"addresses": {
		"Addressee": "送付先",
		"Name ": "お名前",
		"Address": "ご住所",
		"Phone": "お電話番号",
		"E-Mail": "E-Mail"
	},
```

swigを利用してviewに記載する場合は`{{ __('addresses.E-Mail')}}`のような形になります。

## localeをマニュアル設定したい

普通にやるのであれば`get.locale(req)`で取った値を利用しますが、今は英語がいい、今は日本語がいいなどあると思いますので、その場合は`req.session.locale`内の値を変更します。

```route/localechange.js(名前は適当).
  router.get('/:locale', function(req, res, next){
      req.session.locale = req.params.locale;
      res.redirect('back');
  });
```

あとは、変更範囲が広いなどの場合にgetLocale(req)の値を使ってテンプレートの出しわけをする、などにも展開できます。route内で利用する場合は

```
var i18n = require('i18n');
var locale = i18n.getLocale(req);
```

のようにi18nを引いてくるのをお忘れなく。レッツ国際化対応！

## おまけ：よくある動かないシーン

セッションを変更しているはずなのに言語が切り替わらないような場合、ほとんどの場合辞書ファイルの不具合です。変な場所にカンマがあったりコロンがなかったりなど、今一度確認してみましょう。
EC-CUBE3 Doctrine SQLFilter で実装したもの

## SQLFilterって？

クエリに何かの条件文を追加してくれる。
soft_delete などで使えます。

http://doctrine-orm.readthedocs.org/en/latest/reference/filters.html


* nostock_hidden
* soft_delete

## 使い方

有効にするとき

```php
$app['orm.em']->getFilters()->enable('nostock_hidden');
```

無効にするとき

```php
$app['orm.em']->getFilters()->disable('nostock_hidden');
```
【SQL Server】ORDER BY句で条件分岐させる

一覧表などで並び順を任意の項目で並び替えるためのSQLメモ書き。

仕様としては
・並び替えの対象となる項目→パラメータ@SortItemで指定（1～3で置き換え）
・「昇順」・「降順」→パラメータ@SortMethodで指定（1：昇順、2：降順）
というもの。

```sql:casewhenorderby.sql
ORDER BY
CASE @SortMethod WHEN "1" THEN
(  CASE @SortItem 
   WHEN '1' THEN Name
   WHEN '2' THEN Birthday
   WHEN '3' THEN PhoneNumber
) END ASC,
CASE @SortMethod WHEN "2" THEN
(  CASE @SortItem 
   WHEN '1' THEN Name
   WHEN '2' THEN Birthday
   WHEN '3' THEN PhoneNumber
) END DESC
```


「ORDER BYって条件分岐できるの…？」と疑問に思いましたが
CASE WHEN使えば難なくできました。というお話。
ほんとは昇順・降順も並び替え項目と同じく
1→ASC、2→DESCと行うことができたら楽になったのかなあと思うんだけど、
それはちとできないようだということで、こんな感じになりました。
【iPhone】:checkedに複数の隣接セレクターが効かない

input[type=checkbox]の:checkedで開閉パネル作ろうとしたら、詰まったのでメモ

#効かない
iOS7とiOS8で。

```css
:checked+label+ul {
//効かない
}
```

#効く
間接セレクターか疑似クラスを使おう。

```css
:checked ~ ul,
:checked + label:only-of-type + ul:only-of-type {
//効く
}
```

参考：[:checked擬似クラスの隣接セレクターのWebkit系での挙動とか - WEBCRE8.jp](http://webcre8.jp/investigate/css-selector-checked.html)