OmniAICreator/Qiita-1.07M huggingface dataset:
msys2でcppcheckを使おうとしたらlibrary configurationがないと怒られるのは嫌だ


# はじめに
ふと思い立ってcppcheckをmsys2でも使おうと思った。というわけで

[ブログズミ: Cppcheck を使ってみた](http://srz-zumix.blogspot.jp/2012/03/cppcheck.html)

を見ながら

```shell-session
$cppcheck --enable=all --std=c99 -x c -v io.c
```

とかおもむろにコマンドを打ったらですね

```
cppcheck: Failed to load library configuration file 'std.cfg'. File not found
cppcheck: Failed to load library configuration file 'windows.cfg'. File not found
(information) Failed to load std.cfg. Your Cppcheck installation is broken, please re-install. The Cppcheck binary was compiled with CFGDIR set to "C:/building/msys64/mingw32/share/cppcheck/cfg" and will therefore search for std.cfg in that path.
```

と怒られました。

![1.png](https://qiita-image-store.s3.amazonaws.com/0/94177/e20a4996-7f3f-781b-4ee5-81d212cce526.png)

# 環境

Windows10 x64 msys2

```
$pacman -Sl | grep pacman
msys pacman 5.0.1-1 [インストール済み]
msys pacman-mirrors 20160112-1 [インストール済み]
$pacman -Sl | grep cppcheck
mingw32 mingw-w64-i686-cppcheck 1.74-1 [インストール済み]
mingw64 mingw-w64-x86_64-cppcheck 1.74-1 [インストール済み]
$cppcheck --version
Cppcheck 1.74
```

# 原因

cppcheckには
[ブログズミ: [Cppcheck] cfg ファイル設定](http://srz-zumix.blogspot.jp/2014/02/cppcheck-cfg.html)
に紹介のあるように``.cfg``ファイルが有ります。

msys2のパッケージビルドするときに、デフォルトのconfigファイルのパスを指定するらしいのですが、これが絶対パスしか受け付けないようで、``C:/building/msys64/mingw32/share/cppcheck/cfg``に固定されてしまったものが``pacman``で落ちてくるっぽいです。

# 対処法

実行ファイルをバイナリエディタで書き換える

![2.png](https://qiita-image-store.s3.amazonaws.com/0/94177/f42292a8-538b-7eca-733d-97dbd02c3d3c.png)

まずは``./msys64/mingw[32か64]/bin``にある``cppcheck.exe``を適当なバイナリエディタで開きます

![3.png](https://qiita-image-store.s3.amazonaws.com/0/94177/cfcb1879-f08b-60a6-aa6e-12da07ed3351.png)

``share/cppcheck/cfg``で検索すると、エラーメッセージ用とそうでない方の2箇所ヒットしますが、**そうでない方**を探して

![4.png](https://qiita-image-store.s3.amazonaws.com/0/94177/e3b7cfee-2406-4fe0-4fa0-0e7cd7f89ed1.png)

書き換えます。文字列は必ずNULL文字で終わらないといけないのがCの仕様なので、ここでも**``00``で終わるようにします**。
当たり前ですが、**それ以降のアドレスがずれないように、長さが増減したらその数に合わせて``00``のbyte数を調整してください。**じゃないと色々壊れます。いや、以降のアドレスを参照する部分を全部書き換えればいいんですが、それくらいならリビルドするほうが早いです。

# 結果

![5.png](https://qiita-image-store.s3.amazonaws.com/0/94177/43b0eaf3-fae6-0a9d-a6a5-35136ab01c0b.png)

やったぜ。

# 感想

msys2の中の人、相対パスにできるようにパッチ当ててください
Android 7.0でonStop()、onDestroy()が呼ばるのが遅れるバグ

致命的ではないバグですが、原因が分かるまでかなり時間を使ってしまったので、残しておきます。

# 発生条件
- Android 7.0 (Nexus 9) で確認
- Activity1にProgressBarを__表示している__
- Activity1からActivity2に遷移する
- バックキーをタップするなどしてActivity2を終了しActivity1に戻る
- 画面はActivity1に戻るが、__Activity2__のonStop()、onDestroy()がすぐに呼ばれない
- 10秒後にonStop()、onDestroy()が呼ばれる（そして次のような警告が出ている）

```
W/ActivityManager: Launch timeout has expired, giving up wake lock!
```

Activity終了時に「セーブしました」みたいなトーストを表示していたのに、表示されなくなったので気がつきました。

ProgressBarが表示されていないとこの問題は発生しません。また、Android 6.0.1 (Nexus 5)では発生しませんでした。

# サンプルコード
https://github.com/oxsoft/ProgressBar

# 動画
## Android 7.0 (Nexus 9) ProgressBar表示
onStopが遅れる
![Android7.0withProgressBar.gif](https://qiita-image-store.s3.amazonaws.com/0/92361/4ccb05c4-a796-1ca6-678c-1267202c9611.gif)

## Android 7.0 (Nexus 9) ProgressBar非表示
onStopが遅れない
![Android7.0withoutProgressBar.gif](https://qiita-image-store.s3.amazonaws.com/0/92361/a331dfe5-f1a4-3674-6d3f-fd0a3678e743.gif)

## Android 6.0.1 (Nexus 5) ProgressBar表示
onStopが遅れない
![Android6.0.1withProgressBar.gif](https://qiita-image-store.s3.amazonaws.com/0/92361/00b2bd5b-d867-6670-d817-068a56e8cfeb.gif)

# バグレポート
たぶん（？）Androidのバグだと思うので、バグレポートを上げてみました。
https://code.google.com/p/android/issues/detail?id=223871

何か間違い・勘違いがあったら教えていただけると嬉しいです :bow:

# 追記
Android 7.1.1では、ProgressBarに関してはこの問題は解決しているようですが、回転アニメーションなどがあると引き続きこの問題は発生しています。

（hackugyoさん、情報提供ありがとうございます :bow:）
もしも法律がgitで管理されるとしたら (GitLaw)

# 概要
* 法律はソースコードで管理
* 裁判と法の解釈は処理系による判断

# リポジトリ
## 法律リポジトリ
![Untitled Diagram.png](https://qiita-image-store.s3.amazonaws.com/0/142575/bcbcb146-0f00-7279-b445-211b470a8beb.png)

## masterブランチ (天皇)
* 国家に1つ
* 実運用（デプロイ）されるリポジトリ
* 天皇しかpushできないリポジトリ

## releaseブランチ (議会)
* 議会に1つ
* 国会議員以上でしかpushできないリポジトリ

## devブランチ (議員個人)
* 議員につき1つ
* 国会議員以上でしかpushできないリポジトリ
* 議員が好きに弄れる

## issueブランチ (国民)
* いくらでも建てられる
* 国民が作成可能で、devにマージするリクエストを送れる

## 憲法(憲法リポジトリ)の改正
* 憲法はそれ自身はテストの集合(spec)であり、他の法律をe2eテストするプログラム群
* 憲法改正は国会議員がissueを建て、国会議員の2/3以上の :thumbsup: で発議
* 国民の過半数がレビューして賛成すると成立し、masterにマージされる

# 法律の立て方
## issue
![Untitled Diagram (1).png](https://qiita-image-store.s3.amazonaws.com/0/142575/33627795-b3c3-d829-417a-ed50840496a2.png)

* 国会議員は、1人1つのdevブランチを所持
* 国民は、国会議員のdevブランチにプルリクエスト付きissueを送ることができる
    * issueは :thumbsup: と :thumbsdown: があるので投票としても効く
    * プルリクエストは憲法に適合するか、既存法律と整合性が取れているかのユニットテストを行う
* 国会議員は送られたプルリクを承認できるし、自分で法律を書くことも可能
* 国会議員は release ブランチにマージできる
    * マージ前にユニットテストが走る

## releaseブランチで国会審議
![Untitled Diagram (2).png](https://qiita-image-store.s3.amazonaws.com/0/142575/38919765-7143-c06c-5f60-1201396f2391.png)

* releaseブランチにマージされたプログラム（法案）をレビューし、 :thumbsup: 多数で可決
    * もちろん憲法e2eテストも通す
* 可決すると、masterにマージリクエストを送る

## 天皇のマージ承認とデプロイ
![Untitled Diagram (3).png](https://qiita-image-store.s3.amazonaws.com/0/142575/a5567dae-d46e-4a9d-222a-4c1bf78616f5.png)

* 天皇はmasterにマージする承認作業を行う。
* マージされると、デプロイされる
* git diffで法律の差分を読むことができる
複数画像からPDF生成/PDFを画像に分割 - ImageMagick編

ImageMagickを使うと、PDFの結合と分割が可能です。

# 複数JPEGファイルからPDFを作成する

```
$ convert *.jpg output.pdf
```

# PDFを複数ファイルに分割する

```
$ convert input.pdf out.jpg
```

ただし、複数ファイルに分割する際、画像の劣化やうまくPDFが画像にならない場合もある。

その際は、Automatorを使う方法などを検討すること。

- (参考) http://qiita.com/kujirahand/items/d34f7c9e6411c08a5ee1
sudo gem install rails --version="4.2.2" でエラー on Ubuntu 

## nokogiriのビルド中にエラー
```
$sudo gem install rails --version="4.2.2"
Fetching: i18n-0.7.0.gem (100%)
Successfully installed i18n-0.7.0
Fetching: thread_safe-0.3.5.gem (100%)
Successfully installed thread_safe-0.3.5
Fetching: tzinfo-1.2.2.gem (100%)
Successfully installed tzinfo-1.2.2
Fetching: activesupport-4.2.2.gem (100%)
Successfully installed activesupport-4.2.2
Fetching: rack-1.6.4.gem (100%)
Successfully installed rack-1.6.4
Fetching: rack-test-0.6.3.gem (100%)
Successfully installed rack-test-0.6.3
Fetching: mini_portile2-2.1.0.gem (100%)
Successfully installed mini_portile2-2.1.0
Fetching: pkg-config-1.1.7.gem (100%)
Successfully installed pkg-config-1.1.7
Fetching: nokogiri-1.6.8.gem (100%)
Building native extensions.  This could take a while...
ERROR:  Error installing rails:
	ERROR: Failed to build gem native extension.

    current directory: /var/lib/gems/2.3.0/gems/nokogiri-1.6.8/ext/nokogiri
/usr/bin/ruby2.3 -r ./siteconf20160928-37664-h6uxpl.rb extconf.rb
mkmf.rb can't find header files for ruby at /usr/lib/ruby/include/ruby.h

extconf failed, exit code 1

Gem files will remain installed in /var/lib/gems/2.3.0/gems/nokogiri-1.6.8 for inspection.
Results logged to /var/lib/gems/2.3.0/extensions/x86_64-linux/2.3.0/nokogiri-1.6.8/gem_make.out
```

railsのインストールを妨げるのはnokogiriと相場が決まっています。前もそうだった気がします。

いくつかのブログを見て対処法を試してみましたが、うまくいきませんでした。

## 結論
[nokogiriの公式ドキュメント](http://www.nokogiri.org/tutorials/installing_nokogiri.html)を見ると、

### [トラブルシューティング Ubuntuでのインストール(英語)](http://www.nokogiri.org/tutorials/installing_nokogiri.html#ubuntu___debian)

Ubuntuまたはdebianでのインストールは、Nokogiriが開発している`libxml2`と`libxslt`を利用します。


```
gem install nokogiri
```

問題が起こったら、最初にCの拡張をコンパイルするために必要なツールが全てインストールされていることを確認してください。

```
sudo apt-get install build-essential patch
```
重要となる開発用ヘッダーファイルは、自分のシステム上に持たなくても大丈夫です。（これは私の個人開発で起こったことはありませんが、優れた会社やRubyの開発者までもが経験したことがあるようです）
それでも問題があるときは、以下のようにして解決してください。

```
sudo apt-get install ruby-dev zlib1g-dev liblzma-dev
```

これでうまくいかないようでしたら、バグとして報告してください。(詳しくは[こちら](http://www.nokogiri.org/tutorials/getting_help.html))

## 
（2つ目のコマンドの後、再び`gem install rails`したら動きました。公式ドキュメントを読むべきですね。）
Kubernetes+s3+RDSを使ったファイルの分散処理の仕組みを作ってみた[詳細編]

#概要
[前回の記事（概要編）](http://qiita.com/mmitti/private/413e99077670eb9341d1)の続きです。
この記事では各コンテナの動作について説明します。

#フローチャート
各コンテナは以下のフローチャートのように連携して動きます。
コンテナ名と処理内容を示しています。
![myfile_fc.png](https://qiita-image-store.s3.amazonaws.com/0/140084/5345c503-bb8c-1d47-65df-a94b00620844.png)

#サンプルコード
各コンテナのコードはGithub上で公開しています。
よろしければ御覧ください。

https://github.com/mmitti/kube-filehash-sample

#init-pod
初期化処理と終了処理をするコンテナです。
(当初はinit container機能を利用して初期化処理のみを行う予定でしたが)

コンテナ起動後etcdサーバーに接続し処理要求とs3、mysqlの設定を読み込みます。
処理要求のジョブ数と起動中のコンテナの数を見てファイルの処理範囲（ファイル名が16進であると仮定しているので0x00~0xFFの間で）を決定しetcdサーバーに書き込みます。

その後conf.jsonを生成し、他のコンテナの終了を待ちます。（正確にはファイルの生成を待ちます）
他のコンテナが終了時に生成するファイル(s3finとhashfin)が生成されるのを待って、終了情報をetcdに書き込み、設定ファイルなどを削除します。

なお、podが動いているノード上のetcdに問い合わせを行うためkubernetesのmasterサーバーに接続し情報を取得しています。

[init-pod/init.py L82](https://github.com/mmitti/kube-filehash-sample/blob/master/init-pod/init.py#L82)

```
with urllib.request.urlopen(os.environ["API"]+"api/v1/namespaces/"\
    +os.environ["NAMESPACE"]+"/pods/"+os.environ["HOSTNAME"]) as res:
    j = res.read().decode('utf-8')
    data = json.loads(j)
nodeIP = data['status']['hostIP']
```

ソースコード：[init-pod/init.py](https://github.com/mmitti/kube-filehash-sample/blob/master/init-pod/init.py)

#s3-fetch-tool2
s3からファイルをダウンロードし共用でマウントしているフォルダーに保存します。
最初にinit-podが生成されたファイルに含まれているファイルの処理範囲を利用し、s3のファイル一覧から保存するファイルを選択します。
その後は、保存されているファイル数が上限10になるようにダウンロードし、全ファイルをダウンロードするとs3finファイルを生成しinit-podが終了するのを待ちます。（ちょっとこの処理が汚いです。）

ソースコード：[s3-fetch-tool_2/s3-fetch-tool.py](https://github.com/mmitti/kube-filehash-sample/blob/master/s3-fetch-tool_2/s3-fetch-tool.py)


#file-hasher2
s3-fetch-toolが保存したファイルに対してハッシュ値を求めてその結果をmysqlに保存します。
s3finファイルが存在しフォルダー内のファイルが空になるまで動かし、hashfinファイルを生成します。
その後はinit-podが終了するまで待ちます。

ソースコード：[file-hasher_2/file-hasher.py](https://github.com/mmitti/kube-filehash-sample/blob/master/file-hasher_2/file-hasher.py)
[Linux][sed] sedで大文字、小文字変換(文字毎に対応した文字に変換する)

`sed` の `y/変換前/変換後/` のメモ

# 大文字変換
```console
$ echo <文字列> | sed 'y/abcdefghijklmnopqrstuvwxyz/ABCDEFGHIJKLMNOPQRSTUVWXYZ/'
```

# 小文字変換
```console
$ echo <文字列> | sed 'y/ABCDEFGHIJKLMNOPQRSTUVWXYZ/abcdefghijklmnopqrstuvwxyz/'
```

# 使用例
```console:例　小文字を大文字に変換
$ echo a | sed 'y/abcdefghijklmnopqrstuvwxyz/ABCDEFGHIJKLMNOPQRSTUVWXYZ/'
A

$ echo abc | sed 'y/abcdefghijklmnopqrstuvwxyz/ABCDEFGHIJKLMNOPQRSTUVWXYZ/'
ABC

$ echo abc | sed 'y/abcdefghijklmnopqrstuvwxyz/XYZDEFGHIJKLMNOPQRSTUVWXYZ/'
XYZ
```
FlexboxでAndroid 4未対応のボックス折り返し(flex-wrap)を実現する方法

CSS3のFlexboxを試した人からよく聞くのが「Android 4系でボックスの折り返しができない」という声です。本記事では**ポリフィルを使ってAndroid 4でも`flex-wrap`によるボックスの折り返しを実現する方法を紹介します**。

なお、Flexboxの基本については記事「[初心者でも始められるFlexbox入門 - ICS MEDIA](https://ics.media/entry/13117)」を参照ください。

# Android 4における`flex-wrap`の挙動

Android 4におけるボックスの折り返しができないとはどういうことなのか、まずその挙動を確認してみましょう。

`flex-wrap`プロパティに`wrap`値を指定すると、親要素の横幅を超えたときにボックスが折り返し、複数行のレイアウトが可能になります。

![](https://qiita-image-store.s3.amazonaws.com/0/67884/8b29926b-b9c8-3861-6dbf-f96600c339c7.png)

下記のようなHTML・CSSコードを例にして考えてみます。リストで並べたボックスに対して、Flexboxレイアウトと折り返しを指定しています。

```html
<ul>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>
```

- [HTMLコード](https://github.com/ics-kano/kano-box/blob/master/docs/160929_flexibility/step1_nopolyfill.html)

```css
ul {
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
}
```

- [CSSコード](https://github.com/ics-kano/kano-box/blob/master/docs/160929_flexibility/css/style.css)

`ul`タグには`flex-wrap: wrap;`が設定されていますが、**Android 4では`flex-wrap`プロパティが無効なため、折り返しできません**。

<img width="360" src="https://qiita-image-store.s3.amazonaws.com/0/67884/00c10a64-95e8-c73d-4b6f-e8ecdc1763a6.png" alt="">

- Android 4用デモ： [https://goo.gl/M7vP8u](https://goo.gl/M7vP8u)

# ポリフィルを使ってAndroid 4の`flex-wrap`を擬似的に再現

Android 4で`flex-wrap`による折り返しを実現する方法の1つは、ポリフィル「[flexibility](https://github.com/jonathantneal/flexibility)」を使うことです。使い方は下記です。

## ① ポリフィルを読み込む
flexibilityのスクリプトを読み込みます。

```html
<script src="https://cdnjs.cloudflare.com/ajax/libs/flexibility/2.0.1/flexibility.js"></script>
```

## ② 要素の`data-style`属性に、Flexboxレイアウト用のスタイルを記述する
Flexbox対応ブラウザ向けに記述していたスタイルを、Flexboxレイアウトを適用したい要素の`data-style`属性にて記述します。**`flex-wrap`を指定する場合は`width`も指定しないと意図したレイアウトにならないのでご注意ください**。

```html
<ul data-style="width:100%; display:flex; flex-wrap:wrap;">
```

また、CSS、`data-style`と、スタイル定義が2箇所になってしまうので、修正する際は必ず両方修正するようにしましょう。

## ③ `flexibility()`メソッドを使ってポリフィルを適用する

flexibilityには、**Flexboxに対応していないブラウザ向けにFlexboxレイアウトを強制的に適用する`flexibility()`メソッドがあります**。Android 4系ブラウザのみに適用するよう、下記のJavaScriptを記述します。

```js
document.addEventListener("DOMContentLoaded", function () {
  var ua = navigator.userAgent;
  if (ua.indexOf("Android 4.") > 0) {
    flexibility(document.body);
  }
});
```

厳密には`flex-wrap`が動作しないのは4.3以下ですが、**4.4系の一部（Galaxy等）で`flex-wrap`が動作しない例もありますので、4系全般に対応するのが望ましい**でしょう。


全コードは下記です。

- [HTMLコード](https://github.com/ics-kano/kano-box/blob/master/docs/160929_flexibility/step2_polyfill.html)
- [JavaScriptコード](https://github.com/ics-kano/kano-box/blob/master/docs/160929_flexibility/js/script.js)

以上で、Android 4でも折り返しが有効になりました。

<img width="360" src="https://qiita-image-store.s3.amazonaws.com/0/67884/22afe4b9-18cb-2601-bd5d-40e2ff505031.png" alt="">

- Android 4用デモ： https://goo.gl/zkQgO9
 
# Android 4でも安心してFlexboxを使おう

Android 4系のユーザーは今後減ってくるとは言え、まだ一定数のユーザーが存在し(参考記事「[Android Developers ](https://developer.android.com/about/dashboards/index.html)」)、対応を余儀なくされる場合もあるでしょう。そのような状況でFlexboxの`flex-wrap`での折り返しを行いたい場合に、この方法を試してみてください。
stateとpropsを使って、viewの表示を変える

##書く動機
共通で使ってるコンポーネントで、「ここの文言だけこっちにして〜」と言われて、「えっと、、それめちゃめんどいんじゃね？」ってなったんですが、瞬殺で終わったのでその理由について（こういう時にべんりなのであろうreact）


##状況
A画面でユーザーが情報を入力し、進むボタンを押すとB画面で確認画面がでてOKなら
「はい」、修正したければ「いいえ」ボタンをおすという仕様。
ー＞B画面の「いいえ」ボタンを「戻る」に修正したい　という要望
B画面で利用している「はい」「いいえ」ボタンは共通のコンポーネントを利用してる

![Slack for iOS Upload.jpg](https://qiita-image-store.s3.amazonaws.com/0/81252/f657ab63-e73e-a6ae-311d-8377ac84150b.jpeg)


##構成
A画面を構成する　A.jade, A.coffee
B画面を構成する　B.jade, B.coffee

A.jade

```
B(onConfirmed = handleSubmit, onAborted = handleAbort)
```
A.coffee

```
module.exports = React.createClass
  handleSubmit: ->
    @props.onSucceed() #実行する関数

  handleAbort: ->
    @props.onBack（） #前の画面に戻る関数
```
B.jade

```
button.css_class_yes(onClick = handleYes)=　yes
button.css_class_no(onClick = handleNo)=　no

```

B.coffee

```
module.exports = React.createClass
  getDefaultProps: ->
    message: 'よろしいですか？'
    yes: 'はい'
    no: 'いいえ'

  handleYes: (e) ->
    e.stopPropagation()
    @props.onConfirmed()

  handleNo: (e) ->
    e.stopPropagation()
    @props.onAborted()
```

##既存の流れ
諸々省略してるのでちょっとわかりにくいですが（Aの中身とか一切書いてないw）、流れを見ていくと

１）A.jade　でBをよぶ。その際に渡す値として`onConfirm`,`onAborted`の２つを渡している。
`onConfirm`,`onAborted`にはA.coffeeの　実行する関数、前の画面に戻る関数が入ってる。

２）B.jadeではyes,noボタンがあり、
`yes`を押すと、`@props.onConfirmed()`
`no`を押すと、`@props.onAborted()`の関数が実行される。
このとき、`yes``no`には`B.coffee`のgetDefaultPropsに記載のある

```
yes: 'はい'
no: 'いいえ'
```
と

```
message: 'よろしいですか？'
```
が渡される


##やりたいこと
やりたいことは
no:'いいえ'を　no:'戻る'にしたい。

最初から流れが頭に入ってればすんなりいきそうだけど、イマイチ理解してないと辛い。
ではやってみると。。。

当然だけど

```
getDefaultProps: ->
    message: 'よろしいですか？'
    yes: 'はい'
    no: 'いいえ'
```
ここを書き換えてはいけませんw

他のコンポーネントも変わってしまうのでw
ここで注目すべきは上記が`getDefaultProps`であるということ。これってなんでしたっけ。
http://qiita.com/koba04/items/bc13d1f42964278ae14e

要はデフォルト値を作ってくれるんです。デフォルトということは変えてしまえばよい。
じゃあどこで変えるのか？

ここでreactの超基本に戻ると、データの受け渡しの流れは

親 ー＞ 子
A ー＞ B
親から子に渡されたデータは@propsとして子に渡されてる

はいなんかさっき出てきてましたね。

B.coffee

```
module.exports = React.createClass
  getDefaultProps: ->
    message: 'よろしいですか？'
    yes: 'はい'
    no: 'いいえ'

  handleYes: (e) ->
    e.stopPropagation()
    @props.onConfirmed()

  handleNo: (e) ->
    e.stopPropagation()
    @props.onAborted()
```

`@props.onConfirmed()` `@props.onAborted()`
ほほう、、、こいつらは。。？

A.jade

```
B(onConfirmed = handleSubmit, onAborted = handleAbort)
```

A.jadeにいますな。。。
つまり、、？
A.jade

```
B(onConfirmed = handleSubmit, onAborted = handleAbort,　no = '戻る')
```

としちゃえばいいのである。

propsとして親から子に渡したい（値を変えたい）時は、親側の関数で引数に値を渡してあげればい良いですね。※わかりにくくなってるんは渡す引数がまた関数だったりするからややこしい。
stateは親からもらった値とか、そのcomponent上で値を上書きしたりする時に使うので、
ここでstateは関係ないっすね。

書いてみたけど、jsをちゃんと書いたことないからイマイチ嬉しさがわからない。
はやくjsをかいてみよう
【小ネタ】console.logを楽にしたい

# エイリアスを作ろう

console.logって便利ですよねー。
初心者の頃にこれを知らずにalertを流しまくってたのが嘘のようです。

ただ、関数名が長くて
**consol.elog**
とか書いちゃって　ああもう！　となる事が多々あったりするので

```JavaScript:JavaScript
function log(value) {
	console.log(value);
}
```

みたいな感じにエイリアスを作っている人も多いかと思います。

# 物足りない

エイリアスでもいいと言えばいいんですが、
関数の戻りをそのまんま引数に使ったり、疲れてたりすると
`Uncaught SyntaxError: Unexpected token )`
が出まくって非常にイライラします！
~~(非エディタ派なのも原因ではある)~~

関数である以上、()で実行するのは当たり前なんですが、
このイライラをどうにかしたい！。

# というわけで

=演算子で関数呼び出しだ！

```JavaScript:JavaScript

Object.defineProperty(window, 'log', (function() {
	function _log(value) {
		console.log(value);
	}
	
	return {
		get: function() {
			return _log;
		},
		set: function(value) {
			_log(value);
		}
	};
})());

log = 1; // 1
log(4);  // 4

```

通常の関数呼び出し方法でも動いているように見えるのは、
変数【log】自体はただのオブジェクトで、
getterでクロージャ内の関数オブジェクト【 \_log】取得＋その関数を実行しています。
setterは【\_log】をそのまま実行。

本来のsetterの用途とは違うため、他人がパッと見た時に若干意味不明なのが弱点ではありますが、
個人的には書きやすくて割と気に入ってます。


# (余談)accessorの似たような用途

配列のラッパ

```JavaScript:JavaScript

function Data() {
	Object.defineProperty(this, '_stack', {
		value: []
	});
}

Object.defineProperties(Data.prototype, {
	data: {
		get: function() {
			return this._stack;
		},
		set: function(value) {
			this._stack.push(value);
		}
	}
});

var data1 = new Data();
data1.data = 1;
data1.data = 2;
data1.data.hoge = 6;
console.log(data1.data) // [1, 2, hoge: 6]


```

オブジェクト的なアクセスはともかくとして、
配列としての代入は
キーを指定しなくていい/push()を書かなくて良くなります。

`data1.data[] = 1;`
みたいな書き方ができれば解決する話ではありますね。

ただ、`var accessor = data1.data`みたいな代入ができない
(【data1.data】というアクセサへの参照ではなく、getterとして参照した場合の戻り値が代入されてしまうため)
ので、どっこいどっこいかもしれない・・・。



# まとめ

JavaScriptにあまり詳しくない同僚にこのコードを見せたら、

**「数値が代入されてる変数がなんで関数呼び出しできるの」**

と~~若干キレ気味に~~言われたので、
やはり自分ひとりでコード書く時だけにしようと思いました。
Rmagickで画像の差分を取得する

## differenceメソッド
```rb
# 画像読み込み
image1 = Magick::Image.read('http://example.com/image1.jpg')[0]
image2 = Magick::Image.read('http://example.com/image2.jpg')[0]

p image1.difference(image2)
# => [0.0, 0.0, 0.0]
# 同じ画像だと0
```
参考: http://genius.hateblo.jp/entry/2016/02/12/131823

## compositeメソッド
```rb
# 画像読み込み
image1 = Magick::Image.read('http://example.com/image1.jpg')[0]
image2 = Magick::Image.read('http://example.com/image2.jpg')[0]

p image1.composite(image2, 0, 0, Magick::DifferenceCompositeOp)
# => 0
# 同じ画像だと0
```

## うまくいかないとき
### no decode delegate for this image format
Magick::Image.read に画像URLを指定すると次のようなエラーが出るときがあります。
<pre>Magick::ImageMagickError: no decode delegate for this image format</pre>

これは指定された画像のフォーマットは扱えないというエラーです。（サンプルの場合だとjpgが扱えないということ）下記のページの通り、ライブラリをインストールすれば解決するはずなんですが私の場合はこのエラーが消えず。。
http://dqn.sakusakutto.jp/2013/10/no_decode_delegate_for_this_image_format.html

同じように画像を読み込めない方はMagick::Image.from_blobを使ってみてください。
私はこれで画像を読み込むことができました。

```rb
Magick::Image.from_blob(open('http://example.com/image1.jpg').read)
```
参考: http://tech.itandi.co.jp/2016/04/image_diff_with_imagemagick/

### 違う画像なのに差分が0になる
differenceで差分を取得すると全く違う画像なのに差分が0になってしまうということがありました。
そういう時はcompositeを使ってみましょう。

```rb
# 画像読み込み
image1 = Magick::Image.from_blob(open('http://example.com/image1.jpg').read).first
image2 = Magick::Image.from_blob(open('http://example.com/image2.jpg').read).first

p image1.composite(image2, 0, 0, Magick::DifferenceCompositeOp)
```
若干differenceで取得した時の値とはズレがありますが許容できる範囲だと思います。

## 終わりに
画像の差分を取得したかっただけなのに丸2日使ってしまいました。というのもローカルだと普通に動くんですよね。サーバに入ってるImageMagickのアップデートにも多大な時間を使ってしまいました（結局できず）。こういう問題へのアプローチはもっと考えないと無駄に時間つかちゃうなと思いました。
localhost:3000に接続出来ない”The requested URL could not be retrieved”

今日朝からずっとWEBrickは起動しているのにブラウザでhttp://localhost:3000 に接続出来なくなる現象に陥った。

# ブラウザ側エラー表示
ERROR
The requested URL could not be retrieved
The following error was encountered while trying to retrieve the URL: http://localhost:3000/
::1 への接続に失敗しました。
システムが以下のエラーを返しました: (111) Connection refused
The remote host or network may be down. Please try the request again.
Your cache administrator is root.

# 環境
Rails備忘録：開発環境
http://qiita.com/Syatiku-Kun/items/61895441e403c2c359ae
(OS windows7 Pro 32bit, Ruby 1.9.3, RubyGem 1.8.24, Rails 4.0.0)

# 解決策
windowsコントロールパネル>インターネットオプション>LANの設定>"プロキシサーバー"内の
「ローカルアドレスにはプロキシサーバーを使用しない」チェックボックスにチェックを入れる

それでも解決しない時
C:\Windows\System32\drivers\etc\hosts
を管理者権限で編集
`# localhost name resolution is handled within DNS itself`
`    127.0.0.1    localhost`
`#   ::1          localhost`

これでもまだ直らないとき
コンソール(cmd)で
\> rails s -b 0.0.0.0
とすると http://0.0.0.0:3000 にアクセスすることが出来るようになる
※0.0.0.0はもちろん変更可

あとはIPv6をコンパネから無効化するのも手
ネットワークと共有センター>アダプターの設定>該当する接続の"プロパティ"を開く>
\>インターネットプロトコルバージョン6(TCP/IPv6)のチェックボックスを外す

それでも直らない場合はとりあえずコンソールで
\> netstat
を打ち込んでみよう。接続先が一覧で出てきて状態も見れます。

結局単純なミスで午前中無駄にしてしまった...。
Soap Out of Memory Issue under Apache2.2 and PHP5.4

Under Apache2.2 + PHP5.4, executing `new SoapClient($url,$option)`, thrown

	Fatal error: Uncaught SoapFault exception: [Client] Allowed memory size of 134217728 bytes exhausted (tried to allocate 1073741952 bytes) in /var/code/erp/RomeoApi/lib_inventory.php:17 
	Stack trace: 
	#0 /var/code/erp/RomeoApi/lib_inventory.php(17): SoapClient->SoapClient('http://localhos...', Array) 
	#1 /var/code/erp/admin/includes/li
main.php(965): require_once('/var/code/erp/R...') 
	#2 /var/code/erp/admin/indexV2.php(291): facility_mapping('30246773,127684...') 
	#3 /var/code/erp/admin/indexV2.php(19): IndexLibrorumProhibitorum->executeDisplay() 
	#4 {main} 
		thrown in /var/code/erp/RomeoApi/lib_inventory.php on line 17

Seeming to be a bug of PHP. To fix, delete PHP WSDL cache, such as `rm -f /tmp/wsdl-admin-*`.

	root@LeqeeAliyunTest:/var/www/erp/RomeoApi# ls /tmp/
	Aegis-<Guid(5A2C30A2-A87D-490A-9281-6765EDAD7CBA)>  phpz67z8z					 wsdl-admin-3dd395e035c78efc1e82fa83930f5c52
	hsperfdata_admin				    qtsingleapp-aegisG-46d2			 wsdl-admin-51d6daaea3757bb85066ebbaa7f58578
	hsperfdata_root					    qtsingleapp-aegisG-46d2-lockfile		 wsdl-admin-682ea83870a65711c49d9e5e289b3951
	hsperfdata_tomcat7				    tomcat7-tomcat7-tmp				 wsdl-admin-9e4336da1dfda9501f003759666a5af1
	nbinstall-20160906-113818-21933.tar		    wsdl-admin-05a59dad63f164977635df99eaf5b3ac  wsdl-admin-beb8fbcd6342cada79e83570f243bd0a
	networkbench.run.log				    wsdl-admin-08affc66ef3c116f5f1e6a4272bc2cb3  wsdl-admin-ca46591d16fcf28f69967a4eb7e6bf3c
	oneapm-install-20160906-182554-29565.tar	    wsdl-admin-2657d5ac4b78d9dadcbbd18016a2f68a  wsdl-admin-ca904ced6c43c297ace6c5fd45bfde5c
	phpKAFCDO					    wsdl-admin-2e47578aa4defc8c78cbe0f3d5ff3c25  wsdl-admin-cf5ca3f80b45aa3467012a7afdedc012
	phpTlqKu6					    wsdl-admin-376d24aba3c4e9d4b77028c0cd4f38f6  wsdl-admin-db9b4ef8649a98ba61084f5824dfb85c
	phpxXMkSQ					    wsdl-admin-386bb2539d4e1018c8ef10d209b40201  wsdl-admin-f605c08e9f5a6f5d75524fa0480fb930
	root@LeqeeAliyunTest:/var/www/erp/RomeoApi# rm -f /tmp/wsdl-admin-*
Sassを使ったz-indexの管理 改

[Sassを使ったz-indexの管理](http://qiita.com/kojika17/items/b4694e3afe0da97e6335) はめちゃ便利。
でも、mapで並べた時に下の方がz-indexの数値が大きいので、下が上になる。レイヤー構造を逆に考えないといけない。

なので配列を逆にする処理を噛ますことで、上の方が上レイヤーとなり、さらに見やすくできる。


## 配列を逆に

```scss
$z-index:(
  header, //1
  nav, //2
  pulldown, //3 
  child //4
);

//リストを逆転させる
@function list-reverse($map) {
  $result: ();
  @for $i from length($map)*-1 through -1 {
    $result: append($result, nth($map, abs($i)), comma);
  }
  @return $result;
}
$z-index: list-reverse($z-index);

// これでこうなってる
//$z-index:(
//  child, //4
//  pulldown, //3
//  nav, //2 
//  header //1
//);
```


## あとは一緒

上の方がz-indexの数値は高くなるので、変数の順番は逆にする。

```scss

$z-index:(
  // ↑レイヤー上
  child,
  pulldown, 
  nav,
  header
  // ↓レイヤー下
);

//リストを逆転させる
@function list-reverse($map) {
  $result: ();
  @for $i from length($map)*-1 through -1 {
    $result: append($result, nth($map, abs($i)), comma);
  }
  @return $result;
}
$z-index: list-reverse($z-index);


@function z($name) {
  @return index($z-index, $name);
}


.child {
  z-index: z(child); // 4
}
.pulldown {
  z-index: z(pulldown); // 3
}
.nav {
  z-index: z(nav); // 2
}
.header {
  z-index: z(header); // 1
}

```


ガワのレイアウトで使うことしか想定していないので、連想配列とか対応してない。
「改」とか付けちゃったけど、そこは退化。第2階層まで対応はいずれ。。
LineNotifyのサンプルをLaravelでサクッと試してみた

* [続き](http://qiita.com/ichikawa_0829/items/9330fb73648bae91bea7)も書きました。

先程LINEからLINE Notifyという、Webサービスからの通知をLINEで受信できるサービスが発表されました。
https://notify-bot.line.me/ja/

なんだか便利そうですね。
ドキュメントをサラッと見てみた所、開発用アクセストークンを使えばメッセージ送るのは超絶楽そうだったんで丁度開いていたLaravelのプロジェクトで試してみました

# Line Notifyの管理画面から開発用アクセストークンを発行する。

ログイン後画面の下の方にこのようなボタンがあるのでクリックします
<img width="928" alt="スクリーンショット 2016-09-29 14.42.45.png" src="https://qiita-image-store.s3.amazonaws.com/0/14172/027a4492-1ae1-dc1e-f787-2ef95fc4b664.png">


するとトークン名の入力と、自分自身に送るかorどこかのグループに送るか選択出来る画面が表示されるので適当に入力します。
<img width="563" alt="スクリーンショット 2016-09-29 14.42.55.png" src="https://qiita-image-store.s3.amazonaws.com/0/14172/730b95a5-b824-625a-25fd-4a71d61c9c6c.png">


発行ボタンを押すとトークンが表示されるのでメモします。
※以後どこからも確認出来ないようなので注意

# エンドポイントにPOSTするプログラムを書く

次にLaravelのartisanコマンドを以下のように作成します。
※丁度Laravelが開いていたのでこうしてますが、本当にただPostしてるだけです。

\<Your Access Token\>の部分を先程メモしたアクセストークンに置き換えてください。

```php
<?php

namespace App\Console\Commands;

use GuzzleHttp\Client;
use Illuminate\Console\Command;

class LineNotifySample extends Command
{
    protected $signature = 'line:notify';

    public function handle()
    {
        $uri = 'https://notify-api.line.me/api/notify';
        $client = new Client();
        $client->post($uri, [
            'headers' => [
                'Content-Type'  => 'application/x-www-form-urlencoded',
                'Authorization' => 'Bearer <Your Access Token>',
            ],
            'form_params' => [
                'message' => 'Hello, World!'
            ]
        ]);
    }
}
```

これで準備完了です。Artisanコマンドとして動かしてみます。
```
$ php artisan line:notify
```

<img width="624" alt="スクリーンショット 2016-09-29 14.55.54.png" src="https://qiita-image-store.s3.amazonaws.com/0/14172/ddecd939-a6dd-8117-b7aa-88cb1dd38c01.png">

「[トークン名]messageで指定した文字列」の形で表示されるようですね。

ということで超絶かんたんにLINEにメッセージが送れました。
実際Webサービス内で使う場合はユーザ毎のアクセストークンを発行する必要があるので、その部分はまた後程試してみたいと思います。
Quantum Chemistry - Classical Harmonic Oscillator 1: Trajectory

関連 http://qiita.com/7of9/items/d3a1799928734375f34f

CG分野で使われるSpherical Harmonics。自分の数値シミュレーション計算に用いたいと思い調べると、量子化学の講義にたどり着く。

短く分かりやすそうな159本のビデオを少しずつ消化中。

Quantum Chemistry - Classical Harmonic Oscillator 1: Trajectory
https://www.youtube.com/watch?v=QuI3IWlByqo&list=PLm8ZSArAXicL3jKr_0nHHs5TwfhdkMFhh&index=43

- 古典力学におけるHarmonic Oscillator ParticleのTime trajectoryを見る
- 緑の式
   - 量子力学で導出したV(x)
   - potential energy of the particle
   - [前回](http://qiita.com/7of9/items/c6d247dd2c4fa5bdf4c1)の最後に導出された
- 紫の式
   - xの定義
   - r - r0
       - r0: r nought
       - r0: 平衡状態の距離r
- ピンク
   - Forceの定義
   - [前回](http://qiita.com/7of9/items/c6d247dd2c4fa5bdf4c1)の左側白の式
   - V()のxによる微分を実際に計算する
- 黄色の式
   - Forceはmassと加速度の積
   - Forceはピンクの式から`-kx`
   - maの加速度aはxの二回微分
- 水色の式
   - 黄色の式から移項したもの
   - xの二回微分は`-k/m x`という値になる
- 紫の式
   - ωの定義
   - [このビデオ](https://www.youtube.com/watch?v=OpTAXlTVnT4&index=9&list=PLm8ZSArAXicL3jKr_0nHHs5TwfhdkMFhh)の右側の黄色の式のbetaに対応するのがω
- オレンジの式
   - 水色の式を解くことで得られる > [参考](http://qiita.com/7of9/items/2f160d03d049d7d39090)
- 緑の式
   - 時刻t=0の時にV()の値が0と仮定する
   - 初期条件
       - 時刻が0(初期)の時の条件
- 紫の式
   - オレンジの式をtで微分した
- ピンクの式
   - 初期条件の値を入れた
       - t = 0
       - V() = 0
   - sin(0)は0
   - cos(0)は1なのでBの項だけが残る
- 黄色
   - ピンクの式でBω = 0
   - 角速度ωは0にならないのでBが0になる
- 右上の図の左側
   - V()とF()の図
   - 横軸はx
   - V()は左上のピンクの式 (-kx)
   - F()は左中段の水色の式
- 右上の図の右側
   - x(t)の図
   - 横軸はt
   - x(t)の式は左側のオレンジの式でB=0
      - Acos()の図
      - ω = 2pi / f (f:周期)の式から
      - f = 2pi / ω
         - 1周期は 2pi / ωという図になっている
- 水色の式
   - 左下の黄色 (B=0)なのでx(t)の式は
   - 左のオレンジからこのようになる
- 緑
   - Aは振幅
   - x(t)は-AからAの範囲を変化する
- ピンク
   - 角速度
   - (補足) 角速度と角周波数の違い
      - [stackoverflow](http://physics.stackexchange.com/questions/108127/difference-between-angular-frequency-and-angular-velocity)
IntelliJでプロジェクトエクスプローラがツリー表示でなくなってしまった時の対処方法


* 自分の環境で稀によく起こるものの、対応方法を調べては次に起こった時には忘れてしまっているのでメモ。。。

## 対処方法

* 以下の手順を実行する。

	1. 「⌘;」でProject Structureウィンドウを開く
	1. Project Setting > Modulesを選択する
	1. 上部の「＋」アイコン > Import Moduleを選択する
	1. エクスプローラが開くので、プロジェクトルートのフォルダを指定する
ElasticIPが足りない場合の上限値変更方法

新しいEC2インスタンスを作って、ElasticIPを割り当てようとしたところ、

```
IP アドレスを割り当てようとしてエラーが発生しました
The maximum number of addresses has been reached.
```

簡単に言うと、上限値に達したので新規追加できないよってことみたいですね。
そんな時はAmazonに追加申請をすれば良いということで、

マネジメントコンソールにログインして、[AWS固定IP追加申請](http://aws.amazon.com/jp/contact-us/eip_limit_request/)へ遷移する。

各項目に以下を設定

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

CC　：　メールアドレス

内容：　サービス制限の増加

制限タイプ　：　Elastic IPs
リージョン：固定IP追加したいリージョンを選択
制限：Elastic IPアドレス上限
新しい制限値：任意
リクエスト２
→特に設定なし

申請理由の説明　：　
　簡易な説明でOK

連絡方法　：　WEB

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

この内容で送信！

以上で申請が完了しているので、結果を待ちましょう。

※以下追記
申請して30分くらいしたらメールで申請通ったよというメールが来ました！
メールの内容ですが、

```
東京リージョンはデフォルトVPCが有効となっておりましたので、ClassicではなくVPCタイプのElastic IPアドレスの上限値を（新しい上限値）に設定いたしました。

※お客様のアカウントは2013年の3月以降に作成されましたアカウントでございますので、
上記リージョンではVPC　(Default VPC) のみご利用可能で、Elastic IPアドレスもVPCとなっております。

参照ドキュメント：http://docs.aws.amazon.com/ja_jp/AmazonVPC/latest/UserGuide/default-vpc.html

※ご申請手順が分かりづらく、大変申し訳ございませんが、次回以降Elastic IPアドレスの上限緩和を依頼される場合は、
お問い合わせフォームより「ご希望のVPC Elastic IP アドレスの合計数」ご選択いただきますようお願い申し上げます。

```
と言われたので、制限タイプは正しく設定してあげましょう！

おわり
AtomでMarkdownをHTMLにして印刷する

# AtomでMarkdownをHTMLにして印刷する
1. 拡張子をmdにしてMarkdownを書く.
2. Ctrl + Shift + m でプレビューを表示する.
3. プレビューを右クリックして「Save As HTML」を選択しHTMLとして保存する.
4. 保存したHTMLをブラウザで開く.
5. 表示されたページを右クリックして「印刷」を選択し印刷する.


HTMLタグで修飾するといい感じになるかもしれない
AndroidStudio 新規にモジュールを追加して、依存関係を解決(新規モジュール側で作成したクラスを既存側から呼び出せるようにする) 


## プロジェクトを作成

![スクリーンショット 2016-09-29 午後1.57.12.png](https://qiita-image-store.s3.amazonaws.com/0/33553/6c650f47-8c0f-0395-b861-b4a7058a8939.png "スクリーンショット 2016-09-29 午後1.57.12.png")

## 新規モジュールを追加
appのパッケージで右クリック -> New -> Module -> Android Libraly -> Next -> Finish

![スクリーンショット 2016-09-29 午後2.01.08.png](https://qiita-image-store.s3.amazonaws.com/0/33553/a500a4db-94ea-639d-112a-3538b54e4c8e.png "スクリーンショット 2016-09-29 午後2.01.08.png")

## 依存関係を解決
File -> Project Stracture -> 追加される側を選ぶ -> Dependences -> + Module dependency -> 追加するモジュールを選択

![スクリーンショット 2016-09-29 午後2.04.41.png](https://qiita-image-store.s3.amazonaws.com/0/33553/44a5d563-18f8-3154-c3db-cf79f21fc2e7.png "スクリーンショット 2016-09-29 午後2.04.41.png")

## 実際に試してみる
myLibraryに適当にUserクラスを追加

```java:User.java
public class User {
    
    String name;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }
}
```

![スクリーンショット 2016-09-29 午後2.14.23.png](https://qiita-image-store.s3.amazonaws.com/0/33553/6699e10d-17c1-e471-03b4-5d822a5b1402.png "スクリーンショット 2016-09-29 午後2.14.23.png")


app側のMainActivityでUserクラスを使ってみる

![スクリーンショット 2016-09-29 午後2.18.56.png](https://qiita-image-store.s3.amazonaws.com/0/33553/ad98945c-28ba-a219-c6d4-f4fec933e75c.png "スクリーンショット 2016-09-29 午後2.18.56.png")
Guzzleを使ってAPI外部通信を行う


Vue.jsを使ってConnpassのAPIを利用したアプリを作ろうと思った。

#クロスオリジン制約

フロントから（jQuery）直接APIをたたくことは出来ない（クロスオリジン制約）。
しかしPHPなら可能。
その場合 **Guzzle** というものを使う。下のような順番のコードを書く。

1. phpでGuzzle使ってAPIをたたく
2. JSONでJSファイルにデータを返す
3. Vue.jsでフロントにデータを表示させる

#Guzzleをインストール

```
$ composer init //composer.jsonつくる
$ composer require guzzlehttp/guzzle
$ composer require illuminate/http
```

#先にhttpライブラリを使ってJSONを返せるように練習

httpライブラリのJsonResponseを使う。

```php:public/api/event.php
<?php
require __DIR__ . "/../../vendor/autoload.php";

use Illuminate\Http\JsonResponse;

$data = [
    "message" => "Hello World",
    "hogehoge" => "hogehoge",
    "event" => [
        "php勉強会",
        "laravel勉強会",
        "jQuery勉強会",
    ]
];

$response = JsonResponse::create($data,200);
$response->send();
```

##タイムゾーンのエラーがでるとき

```
error_reporting(0);
```

を最初に入れる。

###原因

php iniファイルでタイムゾーンがない状態らしい。
上記コードでタイムゾーンエラーはなくなる。
でも根本的な解決ではないからできればphp iniファイルをAsia/Tokyoに直す方が良い。

#guzzleライブラリを使って外部APIをたたく

いよいよAPIをたたく。

```php:public/api/event.php
<?php
require __DIR__ . "/../../vendor/autoload.php";

use Illuminate\Http\JsonResponse;
use GuzzleHttp\Client;

$url = "http://connpass.com/api/v1/event/";

$client = new Client();
$res = $client->get($url, [
	"query" => [
		"start" => $start
	]
]);

$data = json_decode($res->getBody(),true);

$response = JsonResponse::create($data,200);
$response->send();

```

`$data = json_decode($res->getBody(),true);` の **true/false** は **array/object** で返ってくる、ということ。
ちなみにデフォルトだとfalseになるので **object** で返ってくるので注意。
キャストを使った場合はその箇所でしか配列にならない。

#問題発生：phpファイルの生コードがそのまんま返ってきてしまう

```js:common.js
$(function(){
    var app = new Vue ({
        el: "#app",
        data: {
            posts: []
        },
        created: function(){
            var xhr = $.get("./api/event.php", {start: 0});
            xhr.success(function(data){
                app.posts = data.events;
            });
            xhr.error(function(){
                alert("通信に失敗しました"); //失敗時の処理
            });
        }
    });
});
```

これで本来ならAPIのデータが取れているはず。
なのにphpの生コードが返されるだけだった・・・。

##原因：GuzzleでAPIをたたくならphpのサーバーを使わなければいけない。

GulpのWebサーバーを使っていたことが原因。
phpのサーバーの上にGulpのプロキシサーバーをつける感じらしい。
（あまり良くわかってない）

```js:gulpfile.js
var gulp = require("gulp");
var browser = require("browser-sync");
var php = require("gulp-connect-php");

gulp.task("server", function(){
    var config = {
        proxy: "***.*.*.*:8000",
        open: "external"
        //notify: false
    };

    var server = {
        base: "./public" /*phpのサーバー*/
    };

    php.server(server,() => {
        browser(config)
    });

    gulp.watch(`./public/**/*`, () => {
        setTimeout(function(){
            browser.reload();
        },500);
    });

    gulp.watch([
        "./frontend/assets/sass/**/*.scss"
    ], function(){
        setTimeout(function(){
            browser.reload();
        }, 500);
    })
});```
poplib で、top をつかって、ヘッダー解析するサンプルコード

メールサーバにメッセージがのこされっぱなしになっていないかをチェックするプログラムを書いています。
poplib で、header とってきて、解析してというのはできるのですが、どこかにきちんとしたサンプルコードがあるのではないか思っています。ご存知のかたいらっしゃいましたら、教えてください。

やりたいことは、一覧総数(list),サイズ(stat),ヘッダー取得(top)して、タイムスタンプ取得です。
探しているのは、python3.x　のコードで、特に、poplib.top で、取得するサンプルコードがあったらありがたいです。retr でとる既読マークがついてしまうので、top でとってくるようにしています。
[rails]collection_selectでidでなく名前を表示して、変更を禁止する

#collectiodisabled optionを利用する

```rb:form.html.slim
td = q.collection_select :id, User.all, :id, :name, {}, {:disabled => true}
```

htmlオプションなので：disabledだけだとダメなのですね


###参考
http://stackoverflow.com/questions/3055428/how-to-disable-select-option-in-rails
Deployerでローカルへのデプロイを行う方法


####ローカルレシピ(Local recipe)
http://deployer.org/recipes/local

ローカルのデプロイパスを指定これだけでOK。
これをつかうとreleaseを世代管理してアップデートできる。

```
env('local_deploy_path', '/tmp/deployer');
```


逆にこちらのローカルリリースパスを使うと、世代管理なしにフォルダにアプリを展開して終わるので、再度デプロイを実行したときにエラーになった。

```
env('local_release_path', '/tmp/my_application');
```


例：composerで必要なライブラリはインストール済み

```php
#deploy.php

require 'vendor/autoload.php';
require 'recipe/common.php';
require 'vendor/deployphp/recipes/recipes/local.php';

set('repository', 'git@github.com:org/app.git');
#env('local_release_path', './test');
env('local_deploy_path', '/root/app/test');

/**
 * Main task
 * local:を付けないとリモートへのデプロイ用の
 * サーバー設定が必要になる
 */
task('deploy', [
    'local:prepare',
    'local:release',
    'local:update_code',
    #'local:vendors',
    'local:symlink',
    'local:cleanup'
]);

//展開後必要な処理などを
task('do_after', function(){
        writeln('<comment>shell start</comment>');
        run('sh do_after.sh');
        writeln('<comment>shell end</comment>');
});

after('local:cleanup', 'do_after');
```
FinalIKのAim IKのデモシーンを見てみる。

# Final IKとは

Final IKはUnityでIK(Inverse kinematics:逆運動学）を行うための有料Aseetです。

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/8294c702-f655-7c63-81d2-c9a0ff5f07d9.png)

デモシーンを勉強したのでメモをまとめました。

# Aim IK デモシーンでお勉強

## Aim IKコンポーネント

今回は、AimIKのAim Weaponシーンで勉強。実行すると、こういう感じです。銃の先がボールを向きます。

![FinalIK1.gif](https://qiita-image-store.s3.amazonaws.com/0/58503/dca3256b-7a66-347d-9aaa-8073bc4b53d3.gif)

このシーンのAimIKのコンポーネントは以下の通り

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/7489bd7a-710e-23b5-e99a-f584eda57469.png)

## TargetとAim Transform

Aim IKコンポーネントでは、まずTargetとAim Transformを設定します。

"Target"は向けさせたい目標。このシーンではボールです。

"Aim Transform" は、目標に向けさせたいもののTransformです。このシーンでは銃です。銃そのもののTransformが的に向けるときの軸の上に来ない時もあるので、その際は空の子オブジェクトを配置し、それを適切な位置に移動させる。この際、たとえば下図のようにAim Transformの-Y軸を的に向けさせたいなら、Axisの設定を(0,-1,0)にします。

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/65f65a42-611c-b71f-f33c-38364b47bd45.png)

なお、この軸は、Aim TransformのLocalの軸を基準にするので注意しましょう。

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/4aae5a68-9703-a9e0-c57d-0ff4bce5f28e.png)

表示設定が上記のようにLocalなっていることを確認してください。

実行すると、下のように見えます。

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/f283eb86-709e-3400-1649-8b0f3160da07.png)

紫色の矢印がAim Transformの方向で、それが的へ向かっています。



## ボーンの設定

Bonesで、Aim IKを使って動かしたいボーンを指定します。このシーンでは、腕は固定で体幹の湾曲や回転で銃を目標へ向けます。そのため、ボーンはSpine1-3,Neckを指定します。

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/c0cee453-1bd9-4889-1b1a-c23b8eae98cf.png)

ボーンは、ヒエラルキーの上から下の順番に合わせて指定します。

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/fe4c8dac-4f29-043d-fb27-a84f70e62a16.png)

動かしたいボーンだけ指定しましょう。

## Pole Axis

Pole axisは方向の微調整、例えば銃の握りに捻りを加えるのに使います。そのため、Axisの方向とは別の軸に設定する必要があります。

例えば、最初の図では-YをAxisにしたが、ZをPole axisにすれば、Aim Transformの-Y軸を回転軸に、Z軸（青色）をPole Target（コンポーネントで設定できる。何も指定しないと勝手に作られるみたい）に向かうようにひねろうとします。Pole Weightを調整してみましょう。

こちらはAim Transformの軸
![image](https://qiita-image-store.s3.amazonaws.com/0/58503/8cf18ae8-efba-9732-63a0-2290bda21e91.png)

こちらは、Aim TransformのZ軸をPole Targetに向けようとしている様子。
![image](https://qiita-image-store.s3.amazonaws.com/0/58503/c53a8d52-51d8-e087-a3aa-1a1576191680.png)

Pole Axisは(0,0,1)

![image](https://qiita-image-store.s3.amazonaws.com/0/58503/efc19a91-e114-397a-37ce-400e2ba01f80.png)

このように、姿勢の微調整に便利です。

# 最後に

とりあえず、Aim IKがわかれば、たとえばユニティちゃんの腕を動かして対象の方向に向ける、といった動作もできるでしょう。皆さんもいろいろ試してください。
Appium用に、fastlaneでappファイルを生成する

AppiumでiOSのテストを行う場合、`.app`ファイルが必要なようです。

fastlaneのgymの説明( https://github.com/fastlane/fastlane/tree/master/gym )には、

> It takes care of all the heavy lifting and makes it super easy to generate a signed `ipa` or `app` file :muscle:

とあったのですが、appを作る方法が見当たらず。。。

結局、xcodebuildで出来ました。

```ruby:Fastfile
SCHEME_NAME_DEV = 'develop'

platform :ios do
  lane :make_app do
    xcodebuild(
      scheme: SCHEME_NAME_DEV,
      build: true,
      sdk: 'iphonesimulator',
      derivedDataPath: 'build'
    )
  end
  # ...
```

`SCHEME_NAME_DEV`には、生成対象としたいスキーマを指定します。

これにより、`build/Build/Products/Develop-iphonesimulator/(アプリ名).app`にappファイルが作成されます。

RubyでAppiumのスクリプトを書いている場合、下記のように指定できます。

```ruby
    desired_caps = {
      caps: {
        deviceName:   'iPhone Simulator',
        platformName: 'iOS',
        app:          '../project_dir/build/Build/Products/Develop-iphonesimulator/application_name.app'
      },
      appium_lib: {
        wait: 10
      }
    }
    @appium_driver ||= Appium::Driver.new(desired_caps)
```

これで、iOSのAppium始められる :muscle:
名前付きルートを使ってみよう


GETリクエストが /help に送信されたときにStaticPagesコントローラーのhelpアクションを呼び出す

```config/route.rb
Rails.application.routes.draw do
  root             'static_pages#home'
  get 'help'    => 'static_pages#help'
  get 'about'   => 'static_pages#about'
  get 'contact' => 'static_pages#contact'
end

# 実行結果
¥ bin/rake 
Prefix Verb URI Pattern        Controller#Action
   root GET  /                  static_pages#home
   help GET  /help(.:format)    static_pages/help#help
  about GET  /about(.:format)   static_pages/about#about
contact GET  /contact(.:format) static_pages/contact#contact
```

view側でのリンクにはprefixで指定された文字列に`_path`をつければOK

```ruby
<%= link_to "Home", home_path %>
```
【Rails】Bootstrap 4(alpha)をインストール

Railsにbootstrapを導入する際、bootstrap3では`bootstrap-sass`gemを使っていたが、

https://github.com/twbs/bootstrap-sass
>This is Bootstrap 3. For Bootstrap 4 use the Bootstrap Ruby gem if you use Ruby, and the main repo otherwise.

4を使いたかったら`bootstrap`gemを使ってね、とのことらしい

### インストール

Gemfileに次のように記述してbundle install

```ruby
gem 'bootstrap', '~> 4.0.0.alpha4'
```

`app/assets/stylesheets/application.scss`が存在することを確認。もし`application.css`だったりしたらリネームしましょう。

`app/assets/stylesheets/application.scss`の末尾に次の行を追加

```application.scss
@import "bootstrap";
```

`app/assets/javascripts/application.js`に次の行を追加

```application.js
//= require jquery
//= require bootstrap-sprockets
```

bootstrapを利用するページのhtml.erbのheadタグ内に次のように記述(`app/view/layouts/application.html.erb`とかに書くと良さそう)

```application.html.erb
<%= csrf_meta_tags %>
<meta  name="viewport" content="width=device-width">
<%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
```

### おまけ variablesの変更
`@import 'bootstrap'`を呼び出す前に変数を定義しておくと、その変数で上書きされるようです。

試しにこの青色のボタン(btn-primary)を桃色にしてみます。

```html
<div class="btn btn-primary">ぼたん</div>
```

![青ボタン.png](https://qiita-image-store.s3.amazonaws.com/0/132031/c435ccd8-cbf0-576d-1678-5c0de8e058a5.png)

`app/assets/stylesheets/application.scss`の`@import 'bootstrap'`の前に一行追加してみます。

```application.scss
$brand-primary: #e87070 !default;
@import 'bootstrap'
```

![桃ボタン.png](https://qiita-image-store.s3.amazonaws.com/0/132031/2d7b6973-b9da-005e-03af-e4575ee97710.png)

とても桃になりました。

参考: http://qiita.com/tonkotsuboy_com/items/1855734522bfe7ef7dad
各ネットワークOSの正規表現

毎回調べるのでメモ

#cisco IOS

    #show int des | inc (hoge)|(fuga)

 - 囲い文字不要。きもちわるい
 - 大文字小文字は区別する

#cisco NX-OS

    #show int des | inc '(hoge)|(fuga)'

 - シングルクォーテーションで括る
 - 大文字小文字は区別する

#Juniper JUNOS

    > show interfaces descriptions | match "(hoge)|(fuga)"

 - ダブルクォーテーションで括る
 - 大文字小文字は区別しない
Oracleのサービスを起動するときに「Error 1069: ログオンに失敗したため、サービスを開始できませんでした。」エラーの時のメモ

## 環境
- Oracle 12C
- Windows Server 2012 R2

## 事象
サービスからOracleサービスを起動しようとすると、
Error 1069: ログオンに失敗したため、サービスを開始できませんでした。
と表示される

## 解決策
Oracleサービスをダブルクリック、「ログイン」タブからパスワードを変更するか、ログインユーザのパスワードをそのものをDBにログインできるよう変更する

## 参考
[PRB] ログオンの失敗により SQL Server サービスが開始されない https://support.microsoft.com/ja-jp/kb/282254
Raspberry PiにOpenCVを入れて、顔検出した結果の画像を簡単に集める方法 with Python

# はじめに

機械学習に必要な人の顔の画像を集めようと思ったら結構大変だったので、ちょっと作業負荷を軽減させるためにスクリプトを作ってみました。

# OpenCVのインストール

以下のコマンドでインストールします。
ちなみに、Python2.7用です。

```sh:
$ sudo apt install libopencv-dev python-opencv
```

# 機能

集合写真の画像URLを指定すると、インターネット上から画像をダウンロードして顔検出し、検出結果の画像を保存するというものです。

# ライブラリの読込

使用するライブラリを読み込みます。

```py:
import cv2
import sys
from PIL import Image
import urllib
import os
```

# 画像用フォルダの作成

検出用、結果用の画像それぞれを保存するフォルダを作成します。

```py:
if os.path.exists("input") == False:
    os.mkdir("input")
    
if os.path.exists("output") == False:
    os.mkdir("output")
```

# 画像データのダウンロード

指定したURLからinputフォルダに画像を保存します。
また、URLから画像ファイルの名前を取得します。
※ 例では「photo.jpg」

```py:
url = "http://hoge.com/photo.jpg"

# ファイル名の取得
tmp = url.split("/")
imgname = tmp[len(tmp)-1]
imgpath = "input/" + imgname

# 画像データのダウンロード
response = urllib.urlopen(url)

with open(imgpath, "wb") as fout:
    fout.write(response.read())
```

# 画像データの加工

フルカラーだと処理に時間がかかるので、グレースケールに変換します。

```py:
# 画像データ読込
image = cv2.imread(imgpath)
# グレースケール変換
image_gray = cv2.cvtColor(image, cv2.cv.CV_BGR2GRAY)
```

# 顔の検出処理

顔を検出するための学習済データを読み込み、検出します。

```py:
# HAAR分類器の指定
cascade_path = "haarcascades/haarcascade_frontalface_alt.xml"

# カスケード分類器の特徴量を取得する
cascade = cv2.CascadeClassifier(cascade_path)

# 検出処理
faces = cascade.detectMultiScale(image_gray, scaleFactor=1.1, minNeighbors=1, minSize=(1, 1))

print "検出結果",len(faces),"人"
```

# 検出結果から顔の画像を切り取り保存

グレースケールに変換する前の画像データから顔の画像を切り取り、保存します。
この時、機械学習で使いやすいように画像サイズを50x50にリサイズしておきます。

```py:
img = Image.open(imgpath)

for i in range(len(faces)):
    [x,y,w,h] = faces[i]
    imgCroped = img.crop((x,y,x+w,y+h)).resize((50, 50))
    filename = "output/%s_%02d.jpg" % (imgname.split(".")[0], i)
    imgCroped.save(filename)
```

できた！！
いくつか顔以外のものも検出されますが、概ね満足(^-^)

# おわりに

Google先生に「集合写真」でお伺いをすると大量に高解像度の写真が出てきますね。
ちょっと驚きました。
ラズパイ＋Milkcocoaでスマホの傾きでサーボ制御

milkcocoaのチュートリアルを参考に、スマホの傾き(画面状況)でラズパイに繋いだサーボモータを制御してみました。
Qiita初投稿のため、見づらかったり、変な所があるかもしれませんが、その点はご指摘頂けたら幸いです。

##今回使用したもの
・Raspberry Pi2 Model B
・サーボモータ EK2-0500
・Node.js
・Heroku
・Milkcocoa

ラズパイ周りの配線はこんな感じ。サーボの電源はラズパイのvddから取ることにします(複数使う場合は外部電源を用意して下さい)。
![zu1.png](https://qiita-image-store.s3.amazonaws.com/0/90062/1986825d-dde1-6d7a-3686-750c683e3390.png)
サーボの信号線はGPIO18のピンを使っています。今回はServoBlasterを用いてサーボ制御を行います。

##スマホ側
HerokuにNode.jsで書いたWebアプリをデプロイしました。今回はexpress(テンプレートエンジンはejs)で雛形を作って、そこにmilkcocoaのチュートリアルで使われていたコードをそのまま使いました(もちろんuer_idのみ自分の物に変更)。
ここではherokuへのデプロイ、expressの導入・説明は省略します。

```index.ejs
<body>
<div id="output"></div>
<script src='https://cdn.mlkcca.com/v0.6.0/milkcocoa.js'></script>
<script src="javascripts/main-sp.js"></script>
</body>
```

```main-sp.js
window.onload = function(){

  var currentMode = 'portrait';
  var output = document.getElementById('output');

  // app_idは自分のものに書き換えてください
  var milkcocoa = new MilkCocoa('app_id');
  var ds = milkcocoa.dataStore('inclination');

  window.addEventListener('devicemotion', function(e){
    gravity = e.accelerationIncludingGravity;

    output.innerHTML
    = 'x方向: '+gravity.x
    + '<br>y方向: '+gravity.y;

    sendModeFromGravityValue(gravity);

  },true);


  function sendModeFromGravityValue(g){

    // 絶対値を取得
    var x = Math.sqrt(g.x * g.x);
    var y = Math.sqrt(g.y * g.y);

    // portrait -> landscape
    if(currentMode === 'portrait' && x > 8.5 && y < 1.5){
      currentMode = 'landscape';
      ds.send({mode: currentMode});
    }

    // landscape -> portrait
    if(currentMode === 'landscape' && x < 1.5 && y > 8.5){
      currentMode = 'portrait';
      ds.send({mode: currentMode});
    }
  }
};
```
あと`app.js`にmilkcocoaのモジュール読み込ませます。

```app.js
//モジュール読み込みの行の最後に追加
var MilkCocoa = require('milkcocoa');
```

デプロイしてサイトにアクセスすると、スマホのX軸とY軸の傾きの値が左上に出てくると思います。
この値を元にスマホが縦か横の状態判断を行い、データストアにある"inclination"の値が変化します。

##ラズパイ側
まず適当に作ったプロジェクトフォルダにモジュールを用意します。
`npm init`
`npm install milkcocoa`
`npm install servoblaster`
そうしたらservo.jsとして実行プラグラムを書きます。

```servo.js
var MilkCocoa = require('milkcocoa');
var servoblaster = require('servoblaster');

//サーボ番号２(GPIO18)のサーボモータを使用を宣言
var stream = servoblaster.createWriteStream(2);

//use_idは自分の物に書き換えて下さい
var milkcocoa = new MilkCocoa('use_is');
var ds = milkcocoa.dataStore('inclination');

ds.on("send", chengeInclination);

function chengeInclination(sent){
    if(sent.value.mode === 'portrait'){
      //サーボの角度を130に設定(中心150。この場合は左回転)
      //なおこの値はサーボモータによって異なると思われます。
      stream.write(130);
    }
    if(sent.value.mode === 'landscape'){
      //サーボの角度を200に設定(右回転)
      stream.write(200); 
    }
}
```

ServoBlasterのサーボ番号とピンの関係は以下のようになっています。
（サーボ番号の3番についてはRaspberry PiのリビジョンによってGPIOの21か27になるそうです。）

| サーボ番号 | GPIO番号 |
|:-----------:|:------------:|
| 0 | 4 |
| 1 | 17 |
| 2 | 18 |
| 3 | 21/27 |
| 4 | 22 |
| 5 | 23 |
| 6 | 24 |
| 7 | 25 |

`node servo.js`で起動。
スマホでデプロイしたアプリにアクセスして、 スマホの画面を横にしたり縦にするとサーボが動きます。

今後はスマホの角度とサーボの角度を同期させて何か作ってみたいと思っています。

##参考になった記事etc.
・ServoBlaster関連
　http://oohito.com/nqthm/archives/2151
　https://www.npmjs.com/package/servoblaster
・milkcocoa関連
　https://mlkcca.com/tutorial/page1.html
Mac | 大きなサイズのファイルを作る 

# 例

1MBのファイルを作る場合。

```bash
mkfile 1m mega.txt
```

1GBのファイルを作る場合。

```bash
mkfile 1g giga.txt
```

# 環境

- Mac OSX El Capitan

# 参考

- http://stackoverflow.com/questions/11497567/fallocate-command-equivalent-in-os-x








<!-- Update From Qiita API -->

# チャットメンバー募集


何か質問、悩み事、相談などあればLINEオープンチャットもご利用ください。

https://line.me/ti/g2/eEPltQ6Tzh3pYAZV8JXKZqc7PJ6L0rpm573dcQ





# Twitter


https://twitter.com/YumaInaura


<!-- Update From Qiita API -->
HDFSを参照する時のパスにパターンマッチングを使用する

HDFSのパスを指定する時にワイルドカードで`*`と`?`が使えるのは知っている人は多いと思いますが、他にも`[]`と`{}`でパターンマッチングが使えるようです。

[FileSystem (Apache Hadoop Main 2.6.1 API)](https://hadoop.apache.org/docs/r2.6.1/api/org/apache/hadoop/fs/FileSystem.html#globStatus(org.apache.hadoop.fs.Path))

# 文字セットを指定する

```shell-session
$ hadoop fs -du -s /foo/bar/2016090[135]
96798001  /foo/bar/20160901
90981407  /foo/bar/20160903
102644147  /foo/bar/20160905
```

# 文字の範囲を指定する

```shell-session
$ hadoop fs -du -s /foo/bar/2016090[1-3]
96798001  /foo/bar/20160901
97538454  /foo/bar/20160902
90981407  /foo/bar/20160903
```

# 指定文字を除外

```shell-session
$ hadoop fs -du -s /foo/bar/2016090[^123]
93337378  /foo/bar/20160904
102644147  /foo/bar/20160905
101686448  /foo/bar/20160906
102165763  /foo/bar/20160907
105923690  /foo/bar/20160908
97088009  /foo/bar/20160909
```

# 文字列リストを指定する

```shell-session
$ hadoop fs -du -s /foo/bar/{20160901,20160902}
96798001  /foo/bar/20160901
97538454  /foo/bar/20160902
```