OmniAICreator/Qiita-1.07M huggingface dataset:
Elastic Beanstalk vs Heroku 料金比較

Railsで作っているとPaaS超便利！なので料金比較のメモ。
(Google App Engineも追記したい)

# 無料枠

| PaaS | サーバー| DB | ロードバランサ | メモ |
|:--|:--|:--|:--|:--|
| Elastic Beanstalk(AWS) | t2.micro(CPUx1, RAM1G)が1年 | db.t2.micro(CPUx1, RAM1G)が1年 | 1年 | 2つめ以降の環境には料金発生 |
| Heroku | Free dyno(RAM512MB) 18h稼働/1day | 10000行まで | - | 1アカウント5つまで無料環境を作れる |

開発環境を無料で提供してくれている印象。
AWSのt2.microはよく落ちるのでイライラする。
Herokuはスリープするので作業時間(定時内)だけ定期的にアクセスするようなcron(自分はJenkinsから適当にwget)を書いておくといい。
Herokuは1アカウントで5つまで作れるFree dyno作れるので、開発中はHerokuおすすめ。

# プロダクション環境(小規模)

こっちがメイン。
独断と偏見で、小規模の以下の構成
・サーバーインスタンス x2
・それなりのサーバー(CPUx2)
・それなりのDB
※1ヶ月は24x30=720時間で計算
※リージョンはアメリカ(日本リージョンは若干割高)

| PaaS | サーバー(インスタンスx2)| DB | ロードバランサ | 合計 |
|:--|:--|:--|:--|:--|
| Elastic Beanstalk(AWS) | \$74.88 (t2.medium-$0.052/1h) | \$52.56(db.t2.medium-$0.073)が1h | \$18 | \$145.44 |
| EB(3年全額前払) | \$33.12 (t2.medium-$0.023/1h) | \$23.76(db.t2.medium-$0.033)が1h | \$18 | \$74.88 |
| Heroku | \$100(standard-2x) | $50(Standard 0) | - | \$150 |

上記表のスペックは、おそらくAWS>Heroku。
料金的にはBeanstalkの全額前払が半額くらいやすい。(\$74.88x3年間=25〜30万円くらいの前払いなので為替レートの影響もある)
プロダクション環境は、最初は月額払いにしておいて、インスタンスプランを稼働見ながら調整していって、落ち着いたらリザーブドインスタンスを買う。という感じがいいのかな。

Google App Engineの料金体系が理解できない…
だれか教えて下さいー。
Gmailに同時ログインしているときに、特定のアカウントへのブックマークを作る方法

Gmailに複数のアカウントでログインしているとき、特定のアカウントにブックマークを作りたい。
普通にブックマークを作ると、アカウントごとに`0,1...`のように番号で別れる。

`https://mail.google.com/mail/u/0/#inbox`
`https://mail.google.com/mail/u/1/#inbox`

この番号はログインした順序なので、

- cookie をクリアしてログインしなおしたり、
- 別のPCでログインしたりすると、

番号が変わってしまうので、別のアカウントになってしまう。
(必ず特定の順序でログインするのなら問題はないが……)

どうにかならないかと調べたら、stackexchange に情報があった。
http://webapps.stackexchange.com/a/49168

> https://mail.google.com/mail/u/?authuser=user@gmail.com

ログインしたいメールアドレスを authuser の引数にすれば良いとのこと。
これでどんな時でも、特定の gmail アカウントをブックマークできるようになる。
【MySQL】SQL文覚書


SQL構文メモ。

## ログイン

### mysql -u \<username> -p
usernameでログインする
-pを付けることでパスワードの入力を求められる


## データベース操作

### use \<dbname>
databasenameを使用する


### create database \<dbname>
dbnameを作成

### drop database \<dbname>
dbnameを削除



## show (情報の表示)

### show databases
データベースの一覧を表示

### show tables
現在使用しているデータベースのテーブル一覧を表示

### show columns from \<tableName>
tableNameの各カラムの定義を表示


### show create table \<tableName>
tableNameを作成したときのcreate文を表示


# 挿入

### insert into \<tableName> ('column1','column2',...) values ('value1','value2',...)
データを挿入する


# 更新
### update \<tableName> set 'column' = 'value'
データの更新をする

# 削除
### delete from \<tableName> where \<条件>
Python, matplotlibでリアプノフ・フラクタルを描く

# はじめに
2016年8月22日より，2ヶ月の予定でマレーシアに出張してきている．ホテル暮らしで休日は暇なので，久しぶりに趣味のプログラムを作ってみることにした．

フラクタル関係では，マンデルブロー，ブッダブロ，ジュリア集合などを描いたことがあるが，いずれもFortranで座標の色を計算し，GMTで出力させるものであったが，今回は全てPythonでやってみることにした．

作図機能としては，Python-matplotlibのヒートマップ描画機能（pcolor）を使っている．x座標，y座標，z値（作図上は色を示す値）をそれぞれ2次元配列で準備する必要があるが，作図用コーディングは非常にシンプルにでき，このような作図には便利である．



# プログラム事例
以下のプログラムは，参考サイト(1)に記載のBASICプログラムをPythonに書き換えたものです．多少筆者の趣味で変更してある．

変化させる変数は以下のとおり

<table>
<tr><td>ab</td><td>a=0, b=1 として描きたい基本文字列（プログラム上では1次元配列）を作成</td></tr>

<tr><td>nm</td><td>1次元配列 *ab* の繰り返し数</td></tr>

<tr><td>a0, a1</td><td>x軸の範囲</td></tr>

<tr><td>b0, b1</td><td>y軸の範囲</td></tr>

<tr><td>irx, iry</td><td>x軸範囲およびy軸範囲の分割数</td></tr> 
</table>
<br>

```python:py_lyapunov0.py
import numpy as np
import matplotlib.pyplot as plt

ab=np.array([0,1])
nab=len(ab)
nm=10
a0=2
a1=4
b0=2
b1=4
irx=800
iry=600

x = np.linspace(a0,a1,irx+1)
y = np.linspace(b0,b1,iry+1)
X, Y = np.meshgrid(x, y)

z=np.empty((iry+1,irx+1))
for i in range(0,irx+1):
    a=a0+(a1-a0)/(irx)*i
    for j in range(0,iry+1):
        b=b0+(b1-b0)/(iry)*j
        s=0
        xx=0.5
        for n in range(0,nm):
            for m in range(0,nab):
                if ab[m]==0:
                    rr=a
                else:
                    rr=b
                xx=rr*xx*(1-xx)
                v=np.abs(rr*(1-2*xx))
                if 0<v: s=s+np.log(v)
        s=s/(nm*nab)
        if 2<s:
            z[j,i]=2
        elif s<-5:
            z[j,i]=-5
        else:
            z[j,i]=s

print(np.max(z))
print(np.min(z))

z=-1.0*z
plt.xlim(a0,a1)
plt.ylim(b0,b1)
plt.pcolor(X, Y, z, cmap=plt.cm.spectral)
plt.colorbar()
plt.show()
```

#作図事例
上記プログラムに記載の変数により作図した事例を以下に示す．

![figure_1.png](https://qiita-image-store.s3.amazonaws.com/0/129300/16844e2b-a35b-2232-35e6-77ad32a3e503.png)



# 参考サイト

(1) Lyapunov フラクタル作図プログラム事例
[http://www.rowan.edu/colleges/csm/departments/math/facultystaff/osler/15.%20A%20quick%20look%20at%20Lyapunov%20space.pdf](http://www.rowan.edu/colleges/csm/departments/math/facultystaff/osler/15.%20A%20quick%20look%20at%20Lyapunov%20space.pdf)

(2) ヒートマップ実例
[http://yoshihikomuto.hatenablog.jp/entry/2015/04/10/105615](http://yoshihikomuto.hatenablog.jp/entry/2015/04/10/105615)

(3) ヒートマップ基礎
[http://d.hatena.ne.jp/y_n_c/20091122/1258904025](http://d.hatena.ne.jp/y_n_c/20091122/1258904025)

(4) リアプノフ・フラクタル（Wikipedia）
[https://ja.wikipedia.org/wiki/%E3%83%AA%E3%82%A2%E3%83%97%E3%83%8E%E3%83%95%E3%83%BB%E3%83%95%E3%83%A9%E3%82%AF%E3%82%BF%E3%83%AB]
(https://ja.wikipedia.org/wiki/%E3%83%AA%E3%82%A2%E3%83%97%E3%83%8E%E3%83%95%E3%83%BB%E3%83%95%E3%83%A9%E3%82%AF%E3%82%BF%E3%83%AB)

以上
【Processing】Windows10のフォトに代わるフォトビューワーを自作

#Windows10のフォトに失望

Windows10の標準フォトビューワーの「フォト」がWindows7の時のものより
使い勝手が悪くなっている気がした。

そして何よりもgifやSVGをIE(Edge)で開くのが面倒くさかった。

人人人人人人人人人人人人人人人人人人人人人人人
.jpg .pngはともかく.svg .gifも見れるようにしたい
Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y

そこで・・・
Windows10で使えるフォトビューワーを作ろうと思った。
(どうやら以前のフォトビューワーも使えるようだが・・・？)


##プログラム作成は「Processing」で
自分でソースが書ける言語で一番画像が強そうだったから。

あぁ
もうちょっとマシでキレイなプログラムを書きたいなぁ・・・



#ソース
まだまだ途中。
SVG,PNG、JPGに対応した。
拡大は左上の部分しかできない。
つまり、指定して拡大ができない。



```java:view.pde

static String gz_pth;
String rv_pth;
StringBuffer sb1;
int sls;
String em_pth; 
String exten;

PShape r_svg;    
int nf_cn=1;     
int bf_cn=0;     
float scl=1.0;   
float mo_rt=0;

int mx=0;
int my=0;
int x_sum=0;
int y_sum=0;

PImage img;


void setup() {
  background(255);
  size(1000,1000);
  frameRate(12);
  
  selectInput("Select a folder to process:", "folderSelected",null, this);
}

void fileSelected(File selection) {
  if (selection == null) {
    println("CANCELED");
  } else {
  }
}

void folderSelected(File selection){
  
  println("User selected " + selection.getAbsolutePath());
  
  gz_pth=selection.getAbsolutePath();
  sb1=new StringBuffer(gz_pth);
  rv_pth=sb1.reverse().toString();
  
  exten=rv_pth;
  
  sls=rv_pth.indexOf("\\");
  em_pth=rv_pth.substring(sls);
  sb1=new StringBuffer(em_pth);
  em_pth=sb1.reverse().toString();
  println(em_pth);
  
  sls=exten.indexOf(".");
  exten=exten.substring(0,sls);
  sb1=new StringBuffer(exten);
  exten=sb1.reverse().toString();
  println(exten);
}

void roadSVG(){
  float hei,wid;

  r_svg=loadShape(gz_pth);
  hei=r_svg.height;
  wid=r_svg.width;
  scl=1.0+mo_rt*0.05;
  
  shape(r_svg,0,0,wid*scl,hei*scl);
  
  //r_svg.scale(scl);

}

void img(){
  
  img = loadImage(gz_pth);
  scl = 1.0+mo_rt*0.05;
  image(img,0,0,img.width*scl,img.height*scl);

}

void draw(){
  background(255);
  if(exten==null ){
  }
  
  else{
    //SVG
    if(exten.equals("svg")){
      roadSVG();
    }
    //END SVG
    
    
    else if(exten.equals("jpg")){
      img();
    }
    
    else if(exten.equals("png")){
      img();
    }
    
    else if(exten.equals("gif")){
      img();
    }
    
  }
}


void mouseWheel(MouseEvent e) {
  mo_rt+=(e.getCount()*-1);
}
```

あまりにもひどいソースなので
いちおうこういうことをしているというおおまかな流れと変数の
紹介をここで

![syori.PNG](https://qiita-image-store.s3.amazonaws.com/0/139300/cd780c9d-34dc-72dc-5dcc-0aa2b8eb4889.png)

こんだけ宣言しておいて大したことやってないから、
もっと効率よく変数を使う方法が必ずあるはず。




###参照
-SVG関係-
https://processing.org/reference/PShape.html
↑SVGの扱いについて
https://processing.org/reference/PShape_width.html
↑SVGのサイズ取得
http://www.musashinodenpa.com/p5/index.php?pos=57
↑描写について

-ファイル関係-
http://syunpon.com/programing/java/sample/substring.shtml
↑文字列操作
https://processing.org/reference/selectInput_.html
↑ファイル操作
Unreal Engine C++ Codings

[Unreal Engine プログラミングガイド（日本語）](https://docs.unrealengine.com/latest/JPN/Programming/index.html)
とりあえずここから初めて動くコードを置こう。

#### Viewport上に任意のメッセージを表示する。
```cpp:*.cpp
// GEngineを使用するのに必要。
#include "Engine.h"

	// GEngineが存在しない場合がある
	if (GEngine)
	{
		// キーが-1の場合、上書きされずに常に新メッセージとして表示される（デバッグ向け）
		const int32 AlwaysAddKey = -1;
		// Viewport上にメッセージを表示する
		// キー, 表示時間, 文字色, 表示文字
		GEngine->AddOnScreenDebugMessage(AlwaysAddKey, 5.0f, FColor::Yellow, "MESSAGE");
	}
```

#### Output Log対象のメッセージ表示。
- [Unreal Engine : C/C++ コードからのログ出力](http://increment.hatenablog.com/entry/2015/12/13/230308)
- [UE4 でログ出力を確認する](http://qiita.com/maprog/items/4e1765567bbe0e23d894)

```cpp:*.cpp
	UE_LOG(LogTemp, Log,		TEXT("output : %s"), L"Log Message");
	UE_LOG(LogTemp, Display,	TEXT("output : %s"), L"Display Message");
	UE_LOG(LogTemp, Warning,	TEXT("output : %s"), L"Warning Message");
	UE_LOG(LogTemp, Error,		TEXT("output : %s"), L"Error Message");
```
##### 結果
![キャプチャ.PNG](https://qiita-image-store.s3.amazonaws.com/0/135051/ead9d13d-5423-3d35-79d4-b30f308d59a6.png)

#### 変数の公開・編集可能範囲設定（UPROPERTY）
- [UE4 よく使うUPROPERTYメモ](http://qiita.com/bigengelt/items/b17545fffe7b8d69e5e8)
- [プロパティ指定子] (https://docs.unrealengine.com/latest/JPN/Programming/UnrealArchitecture/Reference/Properties/Specifiers/index.html)（公）

```cpp:*.cpp
	UPROPERTY(EditAnywhere)
	int32 inputVal1;
	UPROPERTY(EditAnywhere, Category = "User Input")
	int32 inputVal2;
```
*BlueprintReadWrite*等を指定する場合は*public:*後に書く必要がある。
さもなくば*OtherCompilationError (5)*が発生する。

初期値はcpp側のクラスと同名のコンストラクタで設定できる。

UPROPERTY/UFUNCTION等はpublic:後・コンストラクタ（初期化）前に呼び出す必要がある？

```cpp:*.h
public:	

	UPROPERTY(EditAnywhere, BlueprintReadWrite, Category = "Damage")
	int32 TotalDamage;

	UPROPERTY(EditAnywhere, BlueprintReadWrite, Category = "Damage")
	float DamageTimeInSeconds;

	UPROPERTY(BlueprintReadOnly, VisibleAnywhere, Transient, Category = "Damage")
	float DamagePerSecond;
	
	UFUNCTION(BlueprintCallable, Category = "Damage")
	void CalculateValues();
	
	AEditableSpotLightCpp();
```
技術英語 > [The corollary to this rule] is to use explicit type casting when you have to make a type conversion.

@ Code Complete (No. 11216 / 36077)

> The <font color=red>corollary</font> to this rule is to use explicit type casting when you have to make a type conversion.

http://eow.alc.co.jp/search?q=corollary&ref=sa
> `3. 必然的帰結、当然の結果

以下の文章が続く

> For example, in this fragment, it's clear that a variable of type NODE_PTR is being allocated:

```
NodePtr = (NODE_PTR) calloc(1, sizeof( NODE ));
```
cssでimgに影つけてボタンっぽくする

##サンプル

![https://gyazo.com/1eb8fe26f5d2be5535e1f56977f42d0d](https://i.gyazo.com/1eb8fe26f5d2be5535e1f56977f42d0d.gif)
[http://codepen.io/maruware/pen/YGPKVN](http://codepen.io/maruware/pen/YGPKVN)

## 手順

### filter: drop-shadow

filter: drop-shadowは透過画像の非透過部分に影をつけられる。

```css
.btn.github{
    -webkit-filter: drop-shadow(0px 7px 0 #ccc);
    filter: drop-shadow(0px 7px 0 #ccc);
}

.btn.qiita{
    -webkit-filter: drop-shadow(0px 7px 0 #459109);
    filter: drop-shadow(0px 7px 0 #459109);
}
```

のように影の色をそれっぽくして設定。
[Adobe Color](https://color.adobe.com)で元の色入れてイジると楽。

### transition

```css
.btn {
    transition-property: all;
    transition-duration: 0.1s;
    transition-timing-function: ease-in-out;

    position: relative;
    top: 0px;
}

.btn:active {
  top: 7px;
}

.btn.github:active {
  -webkit-filter: drop-shadow(0 0 0 #ccc);
  filter: drop-shadow(0 0 0 #ccc);
}

.btn.qiita:active {
  -webkit-filter: drop-shadow(0 0 0 #459109);
  filter: drop-shadow(0 0 0 #459109);
}
```

などとしてtransitionでアニメーションする。
positionを影のサイズ分下げて押し込んだようにする。
Google Apps ScriptでFormに紐付いているSpreadsheetを引っ張ってくる

* フォームを開く
* `回答を表示`を押下
* ここで出てくるSpreadsheetのURLの例を次に示す

```
https://docs.google.com/spreadsheets/d/XXXXXXXXXXXXXXXXXXXX-YYYYYYYYYYYYYYYYYYYYYYY/edit#gid=0000000000
```

* `XXXXXXXXXXXXXXXXXXXX-YYYYYYYYYYYYYYYYYYYYYYY`の部分をコピーする
* Formのスクリプト内で次のように宣言すると使える

```
var spreadSheet = SpreadsheetApp.openById("XXXXXXXXXXXXXXXXXXXX-YYYYYYYYYYYYYYYYYYYYYYY");
```
ConohaのVPS一台でVPNを立てたうえでローカルアドレスにアクセスしてみる。

# 重要

もしかしたらうまくいってないかも・・・
ツッコミ歓迎です。というか誰かやり方おしえてくだされ・・・


# はじめに

[前の投稿](http://qiita.com/cha2maru/items/e6efb976cc1cb6eb7f7a)でPritunlを使ってVPNを構築してみたのですが、イマイチうまい使いみちが思いつかなかったのですが、ConohaのVPSではローカルネットワークが独自に構築できるということを知りました。
なので、VPS一台ではありますが、VPNからローカルネットワークにアクセスできる環境を構築してみました。

# Conoha上にローカルネットワークを構築

[ここ](https://www.conoha.jp/conoben/archives/4451)を参照。
サブネットマスクは10.0.0.0/24、IPアドレスは10.0.0.11としました。

# 構築イメージ

![Untitled Diagram.png](https://qiita-image-store.s3.amazonaws.com/0/40541/6546d6cb-d9f6-57d4-364b-9932894c4af2.png)

Dockerが独自に立てるネットワーク、VPNで構築されるネットワーク、グローバルIP、ローカルネットワークとサーバ一台なのにネットワークが４つ。もう意味がわからない。
otherserviceはDockerで構築する際に10.0.0.11からのアクセスを許容するようにし、pritunlはグローバルIPからのVPN接続を許容、かつローカルネットワークにブリッジさせます。

# Docker-Composeの設定

[前回](http://qiita.com/cha2maru/items/e6efb976cc1cb6eb7f7a)からの設定と違い、docker-compose.ymlの記法はversion2を利用します。
version2からはネットワークスタックなどもdocker-compose.ymlに定義できるようになっているので、より自由度の高い構築ができるようになっています。

```yaml:docker-compose.yml
version: '2'

services:
  mongo:
    image: mongo
    volumes:
      - ./mongo:/data/db
    networks:
      - default
      - local
    ports:
      - "127.0.0.1:9700:443"
      - "1194:1194/udp"
      - "1194:1194/tcp"
    restart: always
  pritunl:
    image: fridus/pritunl
    privileged: true
    environment:
      - MONGO_URI=mongodb://127.0.0.1:27017/pritunl
    restart: always
    network_mode: service:mongo

networks:
  local:
    driver: bridge
    ipam:
      driver: default
      config:
        - subnet: 10.0.10.0/24
          ip_range: 10.0.10.0/24
          gateway: 10.0.10.1
```

[前回](http://qiita.com/cha2maru/items/e6efb976cc1cb6eb7f7a)と違い、ネットワーク専用のサービスは削除して、MongoDBのサービスのネットワークにPritunlがあいのりするようにしました。
MongoDBはデフォルトのDockerのネットワークおよびNetworksで定義しているローカルネットワークに接続しつつ、Portsで外部に対してVPN用のポートおよび管理コンソール用のポートを開放しています。

# Pritunlの設定

[ここ](https://docs.pritunl.com/docs/accessing-a-private-network)を参照

# その他のサービスの設定

その他のサービスについては、以下のように設定して10.0.0.11へのアクセスが可能なようにしておきます。

```yaml:docker-compose.yml
version: '2'

services:
  service:
    image: hogehoge
    ports:
      - "127.0.0.1:8080:80"
      - "10.0.0.11:8080:80"
    restart: always
```

その後はUFWを解放してあげて終了。
Pritunlがつくった192.168.232.0/24からのアクセスだけ許可してあげればいいのかな？
ちょっとココらへんが怪しい

```shell-session
$ sudo ufw allow from 192.168.232.0/24
$ sudo ufw allow from 10.0.10.0/24
```

あとはdocker-compose upでローカルネットワークにもアクセスできる環境が構築できます。
一応10.0.0.11:8080に対してTelnetが通ることだけは確認。
Debian8 でインストール後に暗号化パーティションを作成する

# 概要

最近の Debian GNU/Linux では、インストール時に暗号化パーティションの作成を選択できるようになっているようです。しかし、インストール後に暗号化パーティションを作成する方法については、適切なドキュメントが見つからなかったので、少し試行錯誤してみました。

# 暗号化の単位

今回、調査してみたところ、暗号化する単位がいくつか存在することが分かりました。

- ディレクトリ単位で暗号化
  - 例えば、あるユーザのホームディレクトリのみを暗号化します。ユーザはログイン時にパスフレーズを入力し、そのユーザのホームディレクトリのみを復号化してマウントします。
- 物理ボリューム単位で暗号化
  - 物理ボリューム（例えば、`/dev/sdb1`）単位で暗号化します。システムには複数の物理ボリュームが存在する場合は、LVM の初期化時に複数回のパスフレーズの入力が必要になります。
- 論理ボリューム単位で暗号化

今回の私の用途では、システムが起動している間は常にマウントした状態である必要があること、起動時にパスフレーズの問合せを受ける回数を最小限にしたかった、という2点から論理ボリューム単位で暗号化することにしました。

# 手順

## 暗号化論理ボリュームを用意してマウントする

最初に、論理ボリュームを用意するため、ボリュームグループ名を確認します。

```shell-session
# vgs
  VG   #PV #LV #SN Attr   VSize VFree
  vg1    2   1   0 wz--n- 3.29t 1.29t
```

この例では、`vg1` というボリュームグループに空き領域があるので、このボリュームグループに新たな論理ボリューム（容量100GB）を作成することにします。

```shell-session
# lvcreate -L 100G -n lv1 vg1
```

これで `/dev/vg1/lv1` という論理ボリュームができているはずです。結果は、`lvs` コマンドで確認できます。

次に、論理ボリューム全体を暗号化します。`cryptsetup` パッケージのインストールが必要です。

```shell-session
# apt-get update
# apt-get install cryptsetup
# cryptsetup luksFormat /dev/vg1/lv1 
```

ここで暗号化のパスフレーズが聞かれるので、慎重に決定・入力してください。パスフレーズを忘れたら、この暗号化論理ボリューム上に格納されているデータは全て失われます。

暗号化した論理ボリュームを、システムに接続します。

```shell-session
# cryptsetup luksOpen /dev/vg1/lv1 secure
```

うまく接続できていれば、`/dev/mapper/secure` というデバイスができているはずです。後は、このデバイスを対象として、通常通りにファイルシステムの作成とマウントを行います。

```shell-session
# mkfs -t ext4 /dev/mapper/secure
# mkdir /secure
# mount /dev/mapper/secure /secure
```

## 起動時に自動的に暗号化論理ボリュームがマウントされるようにする

以下のように、/etc/crypttab と /etc/fstab を編集してください。

```ini:/etc/crypttab
# <target name>	<source device>		<key file>	<options>
secure			/dev/vg1/lv1		none		luks
```

```ini:/etc/fstab
# <file system> <mount point>   <type>  <options>       <dump>  <pass>
/dev/mapper/secure	/secure		ext4	defaults		0		0
```

起動時にパスフレーズが聞かれるので、正しく入力すると `/secure` にマウントされます。

# 未解決の問題

`lvextend` コマンドを使って論理ボリュームを拡張した場合に何が起きるのかは確かめていません。
gitでいろいろ取り消したい


# ローカルの変更取り消し
```
$ git checkout .
```

変更はこれで全部ないことにしてくれるが、
新規追加したファイルに関しては削除されないので
完全に元に戻したいのなら別途削除する必要がある

```
$ git clean -df .
```

# addを取り消し
```
$ git reset HEAD .
```

これだけだとaddの状態しか取り消されないので、
変更も取り消したいのであれば、
ローカルの変更取り消し作業も行う必要がある

# commitを取り消し
```
$ git reset [<mode>] [<commit>] .
```

modeのデフォルトは--mixedであるため
変更したファイルはすべてそのままでgitの履歴が変わるだけ。

変更したファイルも含めてすべて指定のcommit状態に
戻したいのであれば、modeに--hardを指定する

また、こちらも--hardを指定したとしても新規追加のファイルは
残ったままになっているので、
完全に元に戻したいのであれば別途削除する必要がある

# pushを取り消し
```
$ git revert [<commit>]
$ git push
```

こちらはどちらかというとundoするという感じではなく
指定commitまでの変更を相殺するcommitを作成するというもの

なのでrevert後にpushすることで
リモートが実質undoをしたような状態になる

ちなみに...

複数コミットを取り消したい時は
-nオプションを指定することでできる

```
$ git revert -n [<commit>]
$ git revert -n [<commit>]
...
$ git commit
$ git push
```

-nは--no-commitと同じオプションで
その名の通り、自動でコミットをしないようにする
SourceTree　作業コピー　反映されない

#　経緯
.gitignoreファイルに設定していないのに、編集したファイルがsourcetreeの作業コピーにでてこないという事があった。解除方法が分からず、困ったのでメモとして書いとく。

#　状況
編集したファイルをプッシュしようとsourcetreeにいったのですが、
<img width="143" alt="スクリーンショット 2016-09-04 1.59.34.png" src="https://qiita-image-store.s3.amazonaws.com/0/122936/7cfdd2d2-9a8c-b8f9-65ed-e032e16b16fe.png">
　となっていて、編集内容が反映されていなかった。
.gitignoreに設定した覚えもなく、編集が反映されない理由がわからなくて困り、調べてみると、
`$ git status --ignored`
このコマンドで、無視されているファイルを確認できるみたい。
確認してみると、確かに無視したくないファイルが一覧にありました。。。
しかし、解除方法がわからない。。。

# 解除方法
１、cdコマンドでホームディレクトリに移動
２、ls -a コマンドで、　.gitignore_globalファイルを探す
３、catコマンドで、.gitignore_globalの中身を確認
`$cat .gitignore_global`
すると、
`$git status --ignored`
で確認した一覧と同じ、無視されているファイルが表示されます。
そして、
４、vimコマンドで、.gitignore_globalファイルを編集し、無視したくないファイルをここから削除します。
これで、sourcetreeに編集内容が反映されるようになりました！！
<img width="141" alt="スクリーンショット 2016-09-04 2.18.39.png" src="https://qiita-image-store.s3.amazonaws.com/0/122936/05419b84-227e-2cbb-ef71-73b950c79c47.png">
参考資料

学習用の資料。
YouTubeの動画はアプリケーション開発を学ぶ上で非常に有用。人によると思うけど、僕は本より動画の方が楽しく学べる。英語のヒヤリングにも慣れるのでオススメです。
JavaとかCとかのコンピュータ言語を開発しているのは英語話者だし、Windows, MacOs, LinuxといったOSもUnity, Spine, mayaなどのアプリケーションを作っているのも向こうの人々。動画も英語のものが多数なので、英語理解はほぼ必須。

#Unity
公式の動画が一番わかりやすい。
https://unity3d.com/jp/learn/tutorials/projects/survival-shooter-tutorial
https://unity3d.com/jp/learn/tutorials/projects/tanks-tutorial
https://www.youtube.com/channel/UCG08EqOAXJk_YXPDsAvReSg

#Spine
これらはいつ見ても感動する。
https://www.youtube.com/watch?v=twUz99ek5do
https://www.youtube.com/watch?v=VreetwYUqog
https://www.youtube.com/watch?v=Sul-lc9D-8I
https://www.youtube.com/watch?v=We6TsnHuTQM

Unity export to Spine
https://www.youtube.com/watch?v=bSf37t2RiYQ
Spine extensions for Unity
https://www.youtube.com/watch?v=UopOOYVj1gc

#Maya
3Dの知識は皆無だったので色々な所で勉強しました。
Spineはアニメーションのさせ方はMayaと同じ。Mayaの機能の中から透明板ポリゴンだけを抜き出して、2Dに特化させたのがSpineって感じ。
3Dは行程がモデリング、テキスチャリング、リギング、アニメーティングに分かれる。
組織開発だとそれぞれの行程に専任の人が割り当てられるらしい。
https://www.youtube.com/user/MayaHowTos
https://www.youtube.com/watch?v=XII9aKbVXrg
https://www.youtube.com/watch?v=m9N_sIBRWvY
https://www.youtube.com/watch?v=shBlqu-8fSA
https://www.youtube.com/watch?v=6-yXiIYKEHo

こんな感じで去年ボックスモデリングを練習しました。
ローポリモデルはMayaでボックスモデルで作るのがベストかも。
もう古い手法かも知れないけど。

![Screen Shot 2015-12-24 at 18.20.57.png](https://qiita-image-store.s3.amazonaws.com/0/115418/5a259ebf-a3cb-84b0-d807-f47e1fe4baa6.png)

![Screen Shot 2015-12-28 at 23.20.41.png](https://qiita-image-store.s3.amazonaws.com/0/115418/9cde151e-564b-2049-0eaa-a8fa6f4fb013.png)

![Screen Shot 2016-01-02 at 19.36.16.png](https://qiita-image-store.s3.amazonaws.com/0/115418/687ada4a-6785-5d18-ae52-9dafff594831.png)

![Screen Shot 2016-01-04 at 17.18.56.png](https://qiita-image-store.s3.amazonaws.com/0/115418/61934728-ff9c-146e-d37b-ada7e3f14a67.png)
ポリゴンは四角形が基本。三角形は極力少なくする。
この頭は側面に三角が沢山あるし、まだ綺麗な並びになっていないのでもう少し作業が必要。

#ZBrush
3Dの世界は非常に奥が深い。モデリング、テクスチャリング、ノーマルマップの方法が複数あり、最適な組み合わせをあれこれ勉強した。
ローポリ、ハイポリでアプローチの仕方は異なるが、多分ノーマルマップを焼くのはXNormalがベスト。
https://www.youtube.com/watch?v=e8M4wrCBcDE
スカルプティングソフトを去年知ってあまりにも直感的に作れるので感動した。
ただリトポしてポリゴン数を落とさないとゲームには使えない。
https://www.youtube.com/watch?v=PO--0h8XHiw
これも参考になった。
偏見じゃなく向こうの人々の方が楽しんで仕事してるだろう。
https://www.youtube.com/watch?v=6BrpCrBhK3Q

MayaでモデリングしてZBrushに取り込んでテクスチャ&ノーマルマップを作ったキノコ男。
![Screen Shot 2016-01-07 at 16.40.32.png](https://qiita-image-store.s3.amazonaws.com/0/115418/07e77952-b672-a5b5-b563-cb09532e0b66.png)

2D絵を3D化しようとスカルプティング。
![スクリーンショット 2015-07-29 13.35.09.png](https://qiita-image-store.s3.amazonaws.com/0/115418/713c7c5a-8aa9-a823-1c5d-ef425f93904f.png)

![スクリーンショット 2015-07-30 19.28.50.png](https://qiita-image-store.s3.amazonaws.com/0/115418/3bbc54f7-d390-c3ca-74c5-0154430a81e4.png)

#Mixamo
二足歩行のモデルに自動でリグを入れ、アニメーションも提供してくれるサービス。
リグ入れと一部アニメーションは無料。このサービスもうまく使って時間削減を図りたい。
https://www.mixamo.com/
Vuforiaであそぼう！ その3

<a href="http://qiita.com/ayumegu/items/91c1811acab95da817f4" target="_blank">Vuforiaであそぼう！</a>
<a href="http://qiita.com/ayumegu/items/fce21e35f6c9fac0a83d" target="_blank">Vuforiaであそぼう！ その2</a>
Vuforiaであそぼう！ その3
<a href="http://qiita.com/ayumegu/items/a9c8218cbe187bb0c445" target="_blank">Vuforiaであそぼう！ その4</a>

結構できないことがわかってきたところで
もともとやりたかったことが調べたらできた〜！

夜中にプリンターを動かすわけにはいかないので、すでにあるマーカーでなんとかしよう。
本来はだめだろうけどこんなUV展開のシリンダーを用意して、
![スクリーンショット 2016-09-04 01.48.28.png](https://qiita-image-store.s3.amazonaws.com/0/46444/f36999ea-73f8-5f94-5416-56e89783a34a.png)

やりたかったのはこういうやつ。マーカーをUVとして使うってやつ。
ほらよくお菓子のおまけとかについてる塗り絵のやつで塗ったやつがテクスチャに反映されるやつ〜。
あれ憧れだったんだ。子供が喜ぶこと間違いなし！私も喜ぶ！
![スクリーンショット 2016-09-04 01.51.30.png](https://qiita-image-store.s3.amazonaws.com/0/46444/423f01dc-9870-4cbd-ccc2-9a63b7f8650f.png)![スクリーンショット 2016-09-04 01.51.46.png](https://qiita-image-store.s3.amazonaws.com/0/46444/a86ac13a-fc68-38e7-1a94-e3c043a4bfee.png)

多分これならあとはモデルとかちゃんとつくってあげたりすればできそう
ちなみにソースはこちらの<a href="https://developer.vuforia.com/forum/unity-3-extension-technical-discussion/region-capture-0" target="_blank">フォーラム</a>にあったgithubのソースを使ってます。
githubのurlは<a href="https://github.com/maximrouf" target="_blank">ここのRegionCapture</a>のソースを借りてきております。

Unity5.4で動かすと一箇所TextureとTexture2Dのところでキャストのエラー吐いてましたがそこだけキャストしてあげれば動きます。
あとはインスペクターの設定いじったり、好みにスクリプトいじれば完成！

<img src="http://ayumegu.daa.jp/img/Qiita/VuforiaTest6.gif" />

これですっきり寝れます。わ〜い
git config基本操作


# 確認

#### すべて
```
$ git config [--list|-l]
```

#### 名前指定
```
$ git config --get $name
```
	
# 編集

```
$ git config [--edit|-e]
```

# 追加・変更

```
$ git config $name $value
```

# 削除

```
$ git config --unset $name
```
IE8では不可視のinputをlabelで操作出来ない件

ほぼタイトルで落ちているが。

ラジオボタンに好きなスタイルを適用するのにlabelと隣接セレクタを使っていたページがあった。
ラジオボタンの切り替えで非同期にコンテンツを切り替える仕組み。
これを急遽IE8対応させねばならなくなったが、IE8では隣接セレクタは使えないため、```display:block```にして背景に画像を仕込んだlabelをクリックしても```label```が選択状態にならないのは良いのだが、コンテンツが切り替わらないのは納得がいかず、調べてみるとIE8ではラジオボタンが不可視だと```label```をクリックしても選択状態が切り替わらない事が判った。
因みに、```display:none```でも```visibility:hidden```でもダメ。そしてIE8に```opacity```はない。
さしあたっては```zoom:0.001```で動いたのでこれで対処した（0だと無効）。

##追記
思いついて試してみたら```position:absolute;z-index:-1;```で動くのでこれが良さ気。

##実証コード
IE8で不可視のinputがlabelで操作できない件 - js do it
http://jsrun.it/hadakadenkyu/u13k/
【GAS】国土交通省が公表している不動産取引価格情報をスプレッドシートに取り込む

　とある会合で不動産の減損判定に必要な時価評価に関して国土交通省が公表しているデータが参考になるぞということを小耳に挟んだのと、キータの記事で「[日本の行政機関が公開中のAPIについてのまとめ（2016年8月17日暫定版）](http://qiita.com/kimuraya/items/3cc6c84bf6eac30851f1)」も見て、気になったので調べてみました。

　国土交通省公表（平成28年3月31日付）
　http://www.mlit.go.jp/report/press/totikensangyo05_hh_000089.html

　すでに約半年前に公表していたようです。API利用などにあたって特にAPIキー取得に必要な申請やら規約のようなものは見当たらなかったので投稿します。普通にCSVをダウンロードして取得してもよいのですがせっかくなのでAPIを使ってみます。

　JSONデータがずらずらっと返ってくるパターンで、JSONデータをいかにスプレッドシートに取り込むかがテーマとなります。

　場所や価格など、28項目あるのですが、取引によっては5項目目がないとか、全項目揃っているという保証がないことで、その部分は空欄で埋めてすべての行が同じ列数を持つように加工する作業が必要となります（そのままでも実はいけるんですが「undefined」で埋め尽くされて見栄えが良くないかなと）。

　今回は平成27年第1四半期～平成27年第2四半期の沖縄県の不動産取引価格情報を取得するという設定です。

~~~js:コード.gs
var ss = SpreadsheetApp.getActiveSpreadsheet();
var sh = ss.getActiveSheet();

function getLandPriceData() {

  // データを取得
  var url = "http://www.land.mlit.go.jp/webland/api/TradeListSearch?from=20151&to=20152&area=47";
  var response = UrlFetchApp.fetch(url);
  var json = response.getContentText();
  json = JSON.parse(json);
    
  // 予め全28項目を列挙
  var item = [
    "Type",
    "Region",
    "MunicipalityCode",
    "Prefecture",
    "Municipality",
    "DistrictName",
    "NearestStation",
    "TimeToNearestStation",
    "TradePrice",
    "PricePerUnit",
    "FloorPlan",
    "Area",	
    "UnitPrice",
    "LandShape",
    "Frontage",
    "TotalFloorArea",
    "BuildingYear",
    "Structure",
    "Use",
    "Purpose",
    "Direction",
    "Classification",
    "Breadth",
    "CityPlanning",
    "CoverageRatio",
    "FloorAreaRatio",
    "Period",
    "Remarks"
  ];
  
  // 2次元配列に組み直し
  var ary = [];
  var ary2 = [];
  for (var i=0; i<json.data.length; i++) {
    for (var j=0; j<item.length; j++) {
      ary.push(json.data[i][item[j]]);
      // もしundefinedなら空欄に直す
      if (!ary[j]) {
        ary[j] = "";
      }
    }
    ary2.push(ary);
    ary = [];
  }
  
  // シートに反映
  sh.getRange(2,1,ary2.length,ary2[0].length).setValues(ary2);

}
~~~

　結果です。JSONじゃなくてXMLでくれればスクリプトを書かないでスプレッドシート上でIMPORTXML関数を唱えて一発で取得できて楽なんですが。

![スクリーンショット 2016-09-03 23.29.05.png](https://qiita-image-store.s3.amazonaws.com/0/139134/e4ff6229-2d65-8185-a14f-e91e6f4256fd.png)
ansibleでSSHトンネリング（SSHポートフォワーディング）

#要件
ansibleを使ってローカルPCから踏み台サーバへSSH接続したあとに、SSH接続をしたサーバに対して操作がしたい

ローカルPC -----SSH-----> 踏み台サーバ -----SSH-----> 対象サーバ

#実現するには
そのためには以下の二つが必要
・トンネルを掘る
・インベントリの設定

#トンネルを掘る
以下のコマンドを実行
```
ssh -L 10022:対象サーバ:22 ユーザー名@踏み台サーバ
```
（ポート番号は10022にしたが、空いているローカルPCの任意のポート番号でよい）

SSH接続が完了したら、そのまま接続済の状態にしておく

#インベントリの設定
作成したトンネルを利用するようにインベントリを記述する。

```ini:ansible/etc/hosts
[local]
127.0.0.1
[local:vars]
ansible_port = 10022
```

以上で設定が完了
#テスト
試しにファイルのコピーを行ってみる
```
ansible local -m copy -a "src=~/a.txt dest=~/b.txt" --ask-pass
```
対象サーバへファイルがコピーできることがわかる

#参考
http://openscript.org/tech_blogs/1
9/3　今日の学習内容～Railsのリクエスト処理の流れについて学習～

###今日の学習内容
***
前回、Railsは普通のウェブサーバーと違い、URLのパスとクエリーを解釈してコントローラのアクションを呼び出し[レンダリング](https://ja.wikipedia.org/wiki/%E3%83%AC%E3%83%B3%E3%83%80%E3%83%AA%E3%83%B3%E3%82%B0_(%E3%82%B3%E3%83%B3%E3%83%94%E3%83%A5%E3%83%BC%E3%82%BF))の結果をブラウザーに返す、といいましたね。

今日は[改訂３版基礎Ruby on Rails](https://www.amazon.co.jp/dp/4844338153)を読みながら、**Railsのリクエスト処理の流れ**について学習していきました(-ω-)/

####Railsのリクエスト処理の流れ
***
パスからアクションを選ぶ、**ルーティング**を図で表してみました。
（間違っていたら、ご指摘くださいm(__)m）
![request.png](https://qiita-image-store.s3.amazonaws.com/0/137880/1e9a48a5-9dc7-3ac3-1f8a-84fa518b7ea7.png)

ウェブサーバーはブラウザーからRailsアプリケーションに関するリクエストを受けると、Railsアプリケーションに回されるようです。
リクエストを受けたRailsアプリケーションはパスを調べ、それに対応したアクションを選択するのですね。

続いて、Railsは選ばれたアクションを実行するという流れになるようです。
アクションはモデルと値のやりとりを行い、モデルはデータベースとやりとりを行います。

アクションはモデルから取得した情報の中でも、表示に必要なもの（あとでビューに渡すため）を[インスタンス変数](http://www.rubylife.jp/ini/class/index4.html)に保存しておくわけですね(-ω-)/

![request_2.png](https://qiita-image-store.s3.amazonaws.com/0/137880/5e84927c-f85e-35a0-31d0-9481ab9504c8.png)

また、アクションはブラウザーへレスポンスを返すためにビュー（テンプレート）を選びます。

最後に、選ばれたテンプレートがコントローラのインスタンス変数を参照し、HTMLソースに埋め込むのです。この処理を**レンダリング**と呼ぶそうです。

その後、出来上がったHTML文書がブラウザーに返されて画面に表示されます。

![request_3.png](https://qiita-image-store.s3.amazonaws.com/0/137880/674ad190-2f9b-8ad3-4b7f-9611a4b55f97.png)


###あとがき
***
今日の学習で、MVCアーキテクチャについて、以前よりも理解できてきたように感じました(*‘∀‘)
明日も頑張って学習していきたいですね(-ω-)/
あ、でも明日はバイトでした...残念...(;´д｀)


ここまで読んで下さり、ありがとうございましたm(__)m
　
###参考にさせていただいたサイトなど
***
- [改訂３版基礎Ruby on Rails](https://www.amazon.co.jp/dp/4844338153)
- [RailsにおけるMVC(モデル/ビュー/コントローラ)](http://www.rubylife.jp/rails/ini/index7.html)
- [インスタンス変数](http://www.rubylife.jp/ini/class/index4.html)
CSS3で3D変形

だいぶ前にホームページで使おうと思ったけど、結局ボツになったのでメモ

## 3D回転描画
3D回転と書いているがアニメーションではなく、以下のようにX軸やY軸に傾けて表示を行う。
![image](https://qiita-image-store.s3.amazonaws.com/0/128475/51870c96-3881-a8d2-15b8-39b379003036.png)

```sample.html
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>Transform Sample</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <style>
    .container {
      float: left;
      perspective: 100px;
      width: 400px;
      margin: 45px;
      font-size: 80%;
      color: #666;
      border: solid #333 2px;
      font-family: "Hiragino Kaku Gothic","メイリオ", sans-serif;
    }

    .rotate3d {
      margin: 0px;
      transform-style: preserve-3d;
      border: dotted #ccc 1px;
      text-align: center;
    }

    .rotate3d.X {
      transform: rotateX(-7deg);
    }

    .rotate3d.Y {
      transform: rotateY(-7deg);
    }
    </style>
  </head>

  <body>

    <div class="container">
      <div class="rotate3d X">
        <h1>Title</h1>
        <p>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
        </p>
      </div>
    </div>

    <div class="container">
      <div class="rotate3d Y">
        <h1>Title</h1>
        <p>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
          TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT<br>
        </p>
      </div>
    </div>

    <br style="clear:both">
  </body>
</html>
```

### 解説
点線の枠の`rotate3d`スタイルクラスの以下の部分が３D回転を行うスタイルだが、これだけでは3D変形は行われない。

```
transform-style: preserve-3d;
transform: rotateX(-7deg);
```

実線の枠で表示している親の`container`スタイルクラスがポイントとなる。

```
perspective: 100px;
```

3D表示する際の視点で、どれだけ離れた場所から見ているかの指定。同じ角度で回転させても、この値を大きくすると、回転角度が少なくなったように表示される。
以下は同じコードで`perspective: 200px;`に設定した場合の表示。
![image](https://qiita-image-store.s3.amazonaws.com/0/128475/25056657-72a4-1287-03cc-ee7fa11b748b.png)

ちなみにサンプルでは3D回転させた角度がわかりやすいように、実践枠をはみ出た部分も表示しているが、`container`に`overflow: hidden;`を追加してあげると、実践枠内のみの表示となる。
小さいアプリを書いてデザインパターンを覚えたい（Stateパターン編）

#はじめに

本稿は、デザインパターンっていくら記事や本を読んでもいまいち理解できない、という方（僕）のための記事です。
デザインパターンを適用した小さなアプリを作って、何が嬉しいのかを実際に見ていくことで、デザインパターンのありがたさと使いどころを感じてもらえれば嬉しいです。


#環境
Unityを使用しています。
開発したソースはGitにあげています。

https://github.com/mutsuyuki/DesignPattern
（当記事投稿時点では、今回取り上げるのStateパターンのみです。）

また、作成済みのデモはこちらからご覧いただけます。
http://mtool.dip.jp/design_pattern/State_StopWatch/
　※表示まで１０秒くらいかかります。

[起動後画面イメージ]
![スクリーンショット 2016-09-03 22.46.39.png](https://qiita-image-store.s3.amazonaws.com/0/139559/4ab635cd-e815-8192-f57f-4da1c6c492c9.png)

#Stateパターン

アプリケーションを書いていると状態によってするべき処理が異なることがよくあります。
・ゲームなら、自分のターン・敵のターン、エフェクト表示中・入力待ち、などなど、 
　状況に応じてUIのグラフィックや挙動を変える必要がある。
・事務処理なら、ビジター、会員、プレミアム会員で画面の挙動を変える必要がある。

考えればきりがありませんね。

最近アプリケーションを書いていて、こういった状態管理をif文で分けまくっていました。
するとどうでしょう、納品直前、微調整の要望があるたび（なぜかあるんです・・）
・ソース読みづらい
・ソース直す箇所多い
・ようやく直すと別のところがバグる
・チームのメンバーにも迷惑をかける
といった悲しい事態に襲われました。

頭のいい人はどんな設計をしているのだろう、と思ってあちこちを探しまくっていたところStateパターンというのを知りました。

状態をオブジェクトにする、という考え方は目からウロコでした。
この記事がわかりやすかったです。
http://www.techscore.com/tech/DesignPattern/State.html/


また、その便利さを実際のアプリケーションレベルで提供してくれているこの記事は神です。
http://qiita.com/ms2sato/items/416dd5c2db88997deb0c

今回書いた小さいアプリはストップウォッチなのですが、実のところ、上記記事でcoffeeスクリプトで書かれたものをUnityに置き換えただけです。
そんなわけで、上記記事の作者のms2satoさんには大大大感謝致します。

元記事の方にもありますが、このストップウォッチにはif文が一つも使われていません。
そのかわりに、状態を表すStateクラスを作成し、稼働中（Running）、一時停止（Pause）、停止（Stop）のそれぞれの状態ですべきことだけをStateクラスを継承したクラスの中で記述する、という部分が肝です。

細かい部分はソースコードを読んでもらえればということで省略いたしますが、要望があればコードを掲載して解説を追記します。




#さいごに
実際に書いてみて思ったのですが、サンプルアプリはビューとその他のロジックの結合度が高すぎる（ビューにモデル、コントローラーを直接渡したりする）ので、そこら辺を疎結合にして、次回はMVCで記事を書いてみようかと思っています。

MVCはデザインパターンじゃないじゃないか、というご意見もあるかもしれませんが、GoFのにこだわっているわけではなく、設計の手法として有用そうなものがあればそれを小さくまとめてリファレンスにしたい、という感じです。

ツッコミなどあれば大歓迎です。

また、もし得意なデザインパターンとか感心したデザインパターンがあれば、サンプル作りに参加して頂けたりしたら泣いて喜びます。
ファイル選択ダイアログ

	class OpenFileDialog : Java.Lang.Object, IDialogInterfaceOnKeyListener
	{
		private Context _context;
		private AlertDialog _dialog;
		private List<FileSystemInfo> _info;

		private static string _parent = "";
		private static string _current = "/";

		public OpenFileDialog(Context context)
		{
			_context = context;
			_info = new List<FileSystemInfo>();
			
			Show(_current);
		}

		public void Show(string parent)
		{
			_dialog = new AlertDialog.Builder(_context)
				.SetTitle(parent)
				.SetItems(GetPathList(parent), OnClick)
				.SetOnKeyListener(this)
				.Show();
		}

		public void OnClick(object sender, DialogClickEventArgs e)
		{
			_current = _info[e.Which].FullName;

			if (IsDirectory(_info[e.Which]) == true)
			{
				_parent = ((DirectoryInfo)_info[e.Which]).Parent.FullName;
				Show(_current);
			}
		}

		public string[] GetPathList(string directory)
		{
			var item = new List<string>();

			_info.Clear();

			try
			{
				foreach (var n in (new DirectoryInfo(directory)).GetFileSystemInfos().Where(n => IsEnable(n)))
				{
					_info.Add(n);
					item.Add(n.Name + (IsDirectory(n) ? "/" : ""));
				}
			}
			catch (Exception ex)
			{
				Toast.MakeText(_context, ex.Message, ToastLength.Long).Show();

				return null;
			}

			return item.ToArray();
		}

		public bool IsDirectory(FileSystemInfo info)
		{
			if (info == null || !info.Exists)
			{
				return false;
			}

			return (info.Attributes & FileAttributes.Directory) == FileAttributes.Directory;
		}

		public bool IsEnable(FileSystemInfo info)
		{
			if (info == null || !info.Exists)
			{
				return false;
			}

			return !((info.Attributes & FileAttributes.Hidden) == FileAttributes.Hidden);
		}

		public bool OnKey(IDialogInterface dialog, Keycode keyCode, KeyEvent e)
		{
			switch (keyCode)
			{
				case Keycode.Back:
					if (e.Action == KeyEventActions.Up)
					{
						if (_parent != "")
						{
							_current = _parent;

							if (_parent != "/")
							{
								_parent = new DirectoryInfo(_parent).Parent.Name;
							}
							else
							{
								_parent = "";
							}

							Show(_current);
						}
					}

					return false;
				case Keycode.Search:
					return true;
				default:
					return false;
			}
		}
	}
人生初のライブラリ作成で学んでいったことメモ in Swift

現在、前々からライブラリ作ってみたいなぁっていう気持ちがあったのと、たまたま発展途上というと言葉が悪いかもしれませんが研究途中の音楽分析APIがあるという話を聞いたことからsongle.jpというサイトのAPIラッパーライブラリを勝手に制作させていただいています。

- [touyou/Swingle on Github](https://github.com/touyou/Swingle)（2016/09/03現在、REST APIの呼び出し部分のみ実装が終わっています）

そこでこれを作るにあたって参考にしたリンク集をまとめていきたいと思います。ライブラリが拡充されるにつれての随時更新です。ライブラリに関しては完成という判断をしてからまた紹介記事を書きたいと思います。

## ライブラリ作成法
- [Swiftを使ってモダンなWeb APIクライアントを爆速で開発する](http://qiita.com/giginet/items/1e64f584f948661cffd1)
- [Swiftでライブラリを公開する](http://qiita.com/morizotter/items/2e45f8f94c1010ebd69f)

## 依存ライブラリ関係
### HimotokiとAPIKitについて
- [Swift 2でのAPIKit + Himotoki](http://blog.ishkawa.org/2015/07/29/1438165961/)
- [Swift 2 で ConoHa API に APIKit と Himotoki を使って接続してみる。](https://ez-net.jp/article/29/Oq3LtahN/DYYKiC3ifJlW/)
- [[Swift] タイプセーフなJSONデコーダ「Himotoki」を試してみた](http://dev.classmethod.jp/smartphone/himotoki/)
- [SwiftでHimotokiの使い方メモ](http://wata.hateblo.jp/entry/himotoki_swift)
- [ikesyo/Himotoki on Github](https://github.com/ikesyo/Himotoki)
- [ishkawa/APIKit on Github](https://github.com/ishkawa/APIKit)

## Songle API
- [Songle Widget API (version 1)](https://widget.songle.jp/docs/v1)

## その他雑多なこと
- [[Swift] 文字列の分割](http://qiita.com/satomyumi/items/dd4f1c90ac16dd6652c9)
- [iOSで特定の周波数の音を鳴らす方法](http://qiita.com/yuky_az/items/62ad3c5caf0f566891fb)
- [Swift protocol defining class method returning self](http://stackoverflow.com/questions/26244732/swift-protocol-defining-class-method-returning-self)
- [NSDateFormatter](https://developer.apple.com/library/mac/documentation/Cocoa/Reference/Foundation/Classes/NSDateFormatter_Class/)
JAVAでのコマンドラインを通したCaboCha実行を高速化する

#背景
JavaでCabochaを使う方法の一つに外部プロセスを使う方法がありますが、よく紹介されている一文ずつ解析を行うやり方はとにかく時間がかかる。数万から数百万件のデータの処理完了に数日かかることもあるため、一括で解析を行う方法を書いておく。

#一般的な方法

```
public void executeCabocha (String sentence) {
        String cabochaPath = "C:\\Program Files (x86)\\CaboCha\\bin\\cabocha.exe -f1";/
		
		//cabochaの結果を返す変数
		ArrayList<String> wordslist = new ArrayList<String>();
		try {
			//cabochaの起動
			process = Runtime.getRuntime().exec(cabochaPath);
		    OutputStream out= process.getOutputStream();
		    OutputStreamWriter writer = new OutputStreamWriter(out, "Shift-JIS");
		    writer.write(sentence);
		    writer.close();
		    InputStream is = process.getInputStream();
		    BufferedReader br = new BufferedReader(new InputStreamReader(is, "Shift-JIS"));
		    String line;
		    while ((line = br.readLine()) != null) {
		    	wordslist.add(line);
		    }
　　　　　　　　　　　　　　　　　　　　　　　process.destroy();
    　　　　　　　　　　　　　　　process.waitFor();
		} catch( Exception e ) {
		    System.out.println(e);
		}		
	}
```

この方法で"wordlist"というArrayListに"sentence"を係り受け解析した結果が入ります。
"sentence"の中身は普通の日本語の文章です。単文でも複文でも構いません。
データ数が少ない場合はこれでも十分なのですが、データ数が３桁超えてくる（このexecuteCabochaが呼ばれる回数が多くなる）と処理完了までに数分かかるようになってしまいます。

参考
- [WindowsのCabochaをJavaからexecで使う　が　文字化け](http://shinbashi.hatenablog.com/entry/20091103/1257244208)
- [外部プロセス起動](http://www.ne.jp/asahi/hishidama/home/tech/java/process.html#Runtime_cmd)


#.txtファイルを読み込ませて実行すると早い
cabochaには文章を直接入力する方法とは別にtxtファイルを入力する方法が用意されています。

```
$cabocha  -f1 inputfile --output=outputfile
```
のようにするとinputfileの中身を読み込んでoutputfileに結果を出力してくれます。
コード一例：

```
public void getcabocharesult(ArrayList<String> sentences) {
		Random r = new Random();
		String serialcode = String.valueOf(r.nextInt(99999999));
		String path = "C:/pleiades/workspace/CaboCha/bin/cabocha";
		String pathinput = "C:/pleiades/workspace/CaboCha/bin/" + serialcode + "_inputtext.txt";
		String output ="--output=C:/pleiades/workspace/CaboCha/bin/" + serialcode + "_output.txt";
		String[] cmd = {path,"-f1", pathinput, output};
		this.makeinputfile(sentences, pathinput);

		//cabocha実行
		try {
			Process p = Runtime.getRuntime().exec(cmd);
			if (p.waitFor() == 0) {
				
			} else {
				System.out.println("--Cabocha起動失敗");
				System.exit(-1);
			}
		} catch (IOException | InterruptedException e) {
			e.printStackTrace();
		}
	}
```

　途中"makeinputfile(...,...)"って関数がありますが、これは引数のsentencesに入っている文章データを一行ずつのデータにしてテキストファイルに出力しているだけです。出力先がpathinput。これでoutputにcabochaの出力結果がテキストファイルとしてはき出されるので後はこれを読み込むだけです。
　数万件のテキストデータをそれぞれcabochaで解析しようと思ったらこのように一度テキストデータにしてcabochaに入力する方が絶対に早いです。

比較データ等は今後掲載予定。
とりあえず今回はメモ程度にここまで。
Visual Studio CodeのTeraTermマクロ用拡張機能が便利

# はじめに
以前から、あったらいいなと思っていたのですが、
Visual Studio Code の TeraTermマクロ用の拡張機能が
2016年7月にリリーリスされていることに気が付きましたので試します。

- 紹介ページ
 - [Tera Term Language Support ](https://marketplace.visualstudio.com/items?itemName=SamHurne.vscode-teraterm-lang)

# インストール
(キーボード操作はWindows版です)
Visual Studio Code上で`Ctrl + P` を押すと表示される入力箇所に
`ext install vscode-teraterm-lang`と入力してエンターを押します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/124069/bd198ed6-4b1c-f134-2d49-aff3430d2909.png)

左に該当の拡張機能のインストールボタンが表示されるのでクリックします。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/124069/7353fa6e-eddd-6e1d-5fa1-63efd5f68379.png)

少し待つと、インストールが終わるので、Visual Studio Code を再起動します。


言語モードを切り替えるには、右下の言語モードの切り替えのところをクリック
（または`Ctrl+K→M`）して、表示される入力箇所で`TeraTerm`を選択します。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/124069/aa9c4826-b2d9-e9e7-c4b6-f0c9b8554a24.png)
![image.png](https://qiita-image-store.s3.amazonaws.com/0/124069/508fa2bf-03e0-3a4d-2bf2-29a4ead02b59.png)

また、拡張子`.ttl`のファイルを開くと自動認識します。

# お試し

以下のような動作イメージです。シンタックスハイライトされます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/124069/e1f3fc2a-b7f6-8dba-3363-940a8286910c.png)

また、候補も表示れます。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/124069/e0bd8f45-ba1e-232d-eaf7-ebd87aee94dd.png)

テキストエディタでTeraTermマクロを書くよりだいぶ効率化できるのではないでしょうか。
pythonでrstripを使う時の注意。

# rstripとは
文字列を右から削除してくれる便利な関数rstrip。以下のように使用していました。

```py3
x = 'abcdefg'
x.rstrip('efg')
print(x)
```

とすると、出力は

```text
abcd
```

が返ってきます。

# 今回気づいた間違い
今回、リストの要素から'_1'と付いているものの後ろの'_1'を削除するプログラムを書いていたのですが、'101_1'や'141_1'など、'_1'以外の場所にも'1'が入っている部分でエラーになっていることに気づきました。もしかしてと思って調べてみるとやはり、rstripでは引数('_1')だけを削除するのではなく、'_'だけや、'1'だけでも削除するみたいです。つまり上の例だと以下の様。

```py3
x = 'abcdefggefgfegef'
x.rstrip('efg')
print(x)
```

とすると、出力は変わらず

```text
abcd
```

# 代わりにreplaceを使う。
例えば今回自分が書いていたプログラムでは以下のように修正できます。

before

```py3
list = ['101_1', '102_1', '102_2', '103_1']
list = [x.rstrip('_1') for x in list]
```

after

```py3
list = ['101_1', '102_1', '102_2', '103_1']
list = [x.replace('_1','') for x in list]
```

もちろんこれは厳密ではありません。_1が付いているのは最後だけという仮定の元こうしましたが、気になるようでしたら正規表現を使ってください。
別マシンにSSH(SFTP)接続するときに2段階認証を設定する


## はじめに

今回は，普段私がサーバにSSH接続をする際に2段階認証を導入した話があったので記事にしました。  
2段階認証にGoogle Authenticatorを使用しました。

<div id="appreach-box" style="text-align:left;">
    <div class="appreach-info" style="margin: 10px;">
        <div id="appreach-appname">Google Authenticator</div>
        <div id="appreach-developer" style="font-size:80%; display:inline-block; _display:inline;">
            開発元:<a id="appreach-developerurl" href="https://itunes.apple.com/jp/developer/google-inc./id281956209?uo=4" target="_blank" rel="nofollow">Google, Inc.</a>
        </div>
        <div id="appreach-price" style="font-size:80%; display:inline-block; _display:inline;">無料</div>
        
        <div class="appreach-links" style="float:left;">
            <div id="appreach-itunes-link" style="display: inline-block; _display: inline;">
                <a id="appreach-itunes" href="https://itunes.apple.com/jp/app/google-authenticator/id388497605?mt=8&amp;uo=4&amp;at=11lHd9" target="_blank" rel="nofollow">
                    <img src="http://nabettu.github.io/appreach/img/itune_en.png" style="width:200px;">
                </a>
            </div>
            <div id="appreach-gplay-link" style="display:inline-block; _display:inline;">
                <a id="appreach-gplay" href="https://play.google.com/store/apps/details?id=com.google。android.apps.authenticator2" target="_blank" rel="nofollow">
                    <img src="http://nabettu.github.io/appreach/img/gplay_en.png" style="width:200px;">
                </a>
            </div>
        </div>
    </div>
    <div class="appreach-footer" style="margin-bottom:10px; clear: left;"></div>
</div>

ダウンロードは上のリンクからどうぞ〜

## Google Authenticationをインストール

```bash
$ sudo apt-get install libpam-google-authenticator -y
```

## アプリとの連携

```bash
$ google-authenticator
```

![](http://cdn-ak.f.st-hatena.com/images/fotolife/n/nanashinodonbee/20151210/20151210030843.png)

背景画像は気にしないでください。私の愛です。
モザイク下手すぎかよ...

何やら出てくるので，アプリ側で登録！

登録方法は省略します。。。。

あとターミナル側で聞かれる質問には全部「 __y__ 」でOK

QRコードの下にリカバリーキーとかが出てるのでメモをするのをお忘れずに！

## SSH設定ファイルの編集

51行目当たりの「 __ChallengeResponseAuthentication__ 」を「 __yes__ 」に変更

```:/etc/ssh/sshd_config
ChallengeResponseAuthentication no  
↓  
ChallengeResponseAuthentication yes
```

下記を追加

```:/etc/pam.d/sshd
auth required pam_google_authenticator.so
```

## SSHDemon再起動

```bash
$ sudo service ssh restart
```

## 実際に接続

![](http://cdn-ak.f.st-hatena.com/images/fotolife/n/nanashinodonbee/20151210/20151210031936.png)

こんな感じにはじめにログインパスワード，そして __ワンタイムパスワード__ を入力してくれと表示されるようになりました。

パスワード同様にワンタイムパスワードもどうやら入力してもターミナルには表示されない仕様になっておらせられるようです。ワンタイムパスワードだからあんまり関係ないんですけどね

## 注意事項

アプリが入っている端末とSSH接続先のホストのタイムゾーンが合っていないとログイン出来ないと思います。なので時間は合わせておきましょう！

## 最後に

ポート番号を変えるとかRSA認証とかを組み合わせてセキュリティ面で少しでも優位に立つことが重要だと思うので，ワンタイムパスワードも中々良いツールだと思ったので今回は導入をしてみました。

ただ弱点としてあげるならば，リカバリーキーなくしたら死亡ということでしょうか。あとは，ユーザが毎回アプリを開いて文字列を入力しなくてはならないという面倒臭さが発生してしまう。といったところでしょうか？
メリットは言うまでもなく，使い捨てパスワードなのでパスワードを自ら生成しなくてもいいということ，もし漏洩しても1分程度で新しくパスワードが生成されるから使用できなくなる。  

## 参考文献

http://www.sorinmustaca.com/2013/04/09/enable-two-factor-authentication-for-the-ssh-on-your-raspberry-pi/
niced cpu time

the "nice" priority is something that linux have for not increasing the LOAD. 
processes that run on nice priority is running when the cpu have not any other User or System work. it means when the cpu have free resource , the nice process will be run.
but if nice process want to access the HDD , it make hdd slow and push some load to server.

http://blog.scoutapp.com/articles/2015/02/24/understanding-linuxs-cpu-stats
RaspberryPi3 CentOS7のyumがエラーになった

#状況
RaspberryPi3 に CentOS7 を入れてyumを動かすとリポジトリが404 - Not foundだった。

インストールしたイメージは
```CentOS-Userland-7-armv7hl-Minimal-1606-RaspberryPi3.img.xz```

#対応
リポジトリ設定ファイルを修正する。

```/etc/yum.repos.d/CentOS-Base.repo
[base]
・・・
baseurl=http://mirror.centos.org/altarch/7/os/armhfp/
・・・
```
以下[extra]なども同様に。

それでも

``` base/primary_db FAILED
http://mirror.centos.org/altarch/7/os/armhfp/repodata/c3a66164f590e8991176b4c0a5494859742ccf4de1351ed5bac8cfdcd2196405-primary.sqlite.bz2: [Errno 14] HTTP Error 404 - Not Found
```

エラーは出るので調査中。
【ゲームAI】迎撃アルゴリズム

#概要
`ゲームAI`に関して勉強し始めたので，その備忘録．
この記事では`迎撃`アルゴリズムについて示す．
`迎撃`アルゴリズムは，敵に対して待ち伏せ行動をする際に使用する経路探索アルゴリズムで，
敵の行動を元に移動先を予測して，その地点に向かって移動する．
実装内容は多種多様だと思うが，ここでは簡易な実装を示す．

なお，この記事では離散的なゲームを想定したサンプルを示す．
連続的なゲームでの`迎撃`アルゴリズムも，考え方は同じである．

また，この記事のサンプルでは，`LOS`アルゴリズムを使用している．
`LOS`アルゴリズムに関しては，以下の記事を参照してもらいたい．
[【ゲームAI】LOSアルゴリズム](http://qiita.com/keny30827/items/8c7a8fdfac41a3dc72ff)

#参考書
ありきたりではあるが以下の書籍を用いた．
[ゲーム開発者のためのAI入門](https://www.amazon.co.jp/%E3%82%B2%E3%83%BC%E3%83%A0%E9%96%8B%E7%99%BA%E8%80%85%E3%81%AE%E3%81%9F%E3%82%81%E3%81%AEAI%E5%85%A5%E9%96%80-David-M-Bourg/dp/4873112168)

#迎撃アルゴリズム
##概要
原理は非常にシンプルなもので，
プレイヤー・敵の相対位置，相対速度から，接敵するまでの大体の時間を計算し，
その時間とプレイヤーの現在位置，現在速度から計算した地点を，
敵の移動先に設定して`LOS`アルゴリズムを走らせるというものである．

##サンプル
```cpp:main.cpp
/*　　velP
 posP ●→　　●posF
	　＼
	　　＼
	　　　＼
	　　　　●↑velE
	      posE

	プレイヤー位置をposP，速度をvelP，
	敵位置をposE，速度をvelE，
	目標地点をposFとする．

	相対距離の計算式は以下
	d = posP - posE

	相対速度の計算式は以下
	v = velP - velE

	接近時間の計算式は以下
	t = d / v

	プレイヤーの到着予想地点は以下
	posF = posP + (velP * t)

	到着予測地点posFに向かってLOSアルゴリズムを適用すれば，
	待ち伏せ行動が可能になる．
*/
void UpdateIntercept( POINT& posP, POINT& velP, POINT& posE, POINT& velE )
{
	if( posP.x == 0 && posP.y == 0 ){ return; }

	//目標地点予測.
	POINT posF;
	{
		//相対距離.
		POINT dis;
		dis.x = posP.x - posE.x;
		dis.y = posP.y - posE.y;

		//相対速度.
		POINT vel;
		vel.x = velP.x - velE.x;
		vel.y = velP.y - velE.y;

		//接近時間.
		double time = 0;
		double distance = sqrt( dis.x * dis.x + dis.y * dis.y );
		double velcity	= sqrt( vel.x * vel.x + vel.y * vel.y );
		if( !( 0.000f <= velcity && velcity <= 0.000f ) ){
			time = distance / velcity;
			time = fabs( time );
		}

		//予測ポイントを目標地点に設定.
		posF.x = posP.x + (LONG)( (double)velP.x * time );
		posF.y = posP.y + (LONG)( (double)velP.y * time );
	}

	//LOSアルゴリズムを使って移動.
	UpdateBresenham( posE, posF );
}
```
今回は`Windows.h`内に定義されている`POINT`構造体を二次元ベクトルとして利用している．
正直，自前の構造体を用意して，四則演算関連の演算子を定義して使えば，
途中の計算をもっとスマートにかけるはずである．

##解説
###考え方
基本的にサンプルに書いてある計算式通りである．

【接近時間】の計算に関しては，多少曖昧な所があると感じるだろう．
個人的にしっくりきた考え方は以下である．
1，【相対距離】を半径に，プレイヤーを中心にした円があるとする．
2，プレイヤーの現在の移動方向に，中心から弧に向かって直線を引く．
3，目標となる地点はその直線上にあるはずなので，【相対速度】を加味してあげて場所を確定する．
4，【相対速度】が大きければそれだけ手前が目標になるし，小さければ奥になる．
【相対速度】が小さいということは，速度差がないということなので，
目標地点が遠ざかるのは直感的に分かると思う．

###注意
【相対速度】は方向も加味する必要があるので，
プレイヤー，敵間で減算処理を施す時点では，ベクトルとして扱う必要がある．
この時点でスカラーにしたもので計算してしまうと，挙動がおかしくなるので注意．

~~また，相手の速度の方が速い場合などで正しく動作しないケースもあるので，
一定距離以上離れたら迎撃を中止する，などといった処理は必要になる．~~
2016/09/07追記
プレイヤー側の速度が速い場合に，迎撃としては正しく動作しない(迎撃に失敗する)ケースはあるが，
予測地点の計算自体は正しく行うことができる．
【相対速度】は絶対値を取って計算に使うので，敵側が速くてもプレイヤー側が速くても，
絶対値は同じになることがある．
ここだけ見ると，プレイヤー側の速度が速い場合に，予測地点がやたら手前になってしまうように
感じるが，実際には予測地点の計算時にプレイヤーの速度を加味しているため，ちゃんと奥になる．
迎撃失敗時に一定距離離れたら中止扱いにする，という処理はどちらにせよ必要になる．


#総括
簡単な手法の割には，それなりに賢く見えるので，
使い所は多い気もする．
銃弾やロケットなど，一度動き始めたら止められないものなどにはより有効だと思う．
twilioの1架電ごとの料金一覧出力


twilioで架電した際、1架電の料金を知りたい際に参考にしてください。

##環境構築

まずはいつものcomposer揃えるところから。
環境ある人は飛ばしちゃってください。

```
curl -sS https://getcomposer.org/installer | php
php composer.phar require twilio/sdk
```

##サンプルPHPコード
今回は架電先の電話番号を条件に指定して、
通話時間と料金を出力してみました。


```cost.php
<?php
require __DIR__ . '/vendor/autoload.php';

use Twilio\Rest\Client;

$sid = '自分のSID';
$token = '自分のtoken';
$client = new Client($sid, $token);

$records = $client->calls->read(
  array(
    "to" => "条件に指定したい電話番号"
  )
);
foreach ($records as $record) {
    echo "通話時間: " . $record->duration ."<br>";
    echo "料金: " . substr($record->price, 1,-1) . "<br>";}

```

`$record->price`は一文字目にハイフンがなぜかくっついてくるのでsubstrしています。

今月分の料金〜とか、他に条件を指定したい場合は
下記ドキュメントをご参考に。

https://jp.twilio.com/docs/api/rest/call