OmniAICreator/Qiita-1.07M huggingface dataset:
react-native-dotenv で定数を環境ごとに切り替える


開発中、環境によって API のエンドポイントの向き先や設定を変更して動作チェックしたい、ということがよくある。

しかしながら、ReactNative では、process.env に渡されるのが基本 process.env.NODE_ENV だけで、かつ[内部で development か production](https://github.com/facebook/react-native/blob/dba133a29194e300e9a2e9e6753f9d4e3a13c194/Libraries/Core/InitializeCore.js#L96) に書き換えているため、適当な環境変数を外部から渡して挙動を変えることが、development or production しか行えない。

そのためのアプローチの一つとして [react-native-config](https://github.com/luggit/react-native-config) があり、それについての詳細は以下に解りやすくまとまっている。

- [React Native で development, staging, production など環境を切り替える](http://qiita.com/janus_wel/items/750ffd1ae912e67d7df8)


ただ、react-native-config では、あくまでネイティブ側に埋め込み、JS 側ではブリッジ経由で取得というアプローチを取っているため

- アプリのビルド時にターゲット(stagingとか)変更
- 定数を変えたらアプリの再コンパイルが必要

が必要となる。また ReactNative のテスト環境は、基本的に実機やシュミレータを使わずにテストを実行するため、テスト用にうまく動く設定が必要となる。

- https://github.com/CureApp/react-native-config-node
  - ↑を jest で利用するために babel でテスト時に書き換える設定
  - https://gist.github.com/alanshaw/5002182652163a1c8c3a8ed2c25eee1d

# react-native-dotenv を使う

別のアプローチとして、babel でソースコード自体を書き換えてしまい動かす、react-native-dotenv というライブラリがある。

- https://github.com/zetachang/react-native-dotenv

これを入れ、babel の設定を書くことで、.env に記述した定数を

```
import { API_URL } from 'react-native-dotenv'
```

のように記載することが出来る。.env.production を用意すると、リリースビルド時に適用される。また JS 側だけで使えるため、テスト時にも問題無く利用することが出来る。

ただ、.env の定数を書き換えただけでは反映されず、利用箇所すべての .js ファイルのタイムスタンプを更新して babel がトランスパイルすることを待つか、Config.js 的なファイルを一つ用意して、こいつが import && export をすることで修正ファイルを一箇所に集約する

```
// Config.js。このファイルだけ .env を書き換えたら更新する。びみょう…
import { API_URL } from 'react-native-dotenv'

export { API_URL }
```


か、

```
$ rm -rf $TMPDIR/react-*
$ yarn start
```

のように一度キャッシュファイルを削除してから、再度起動する必要がある。なおキャッシュファイルを消して再度起動すると、ロードに非常に時間がかかるため、react-native-config でアプリをビルドし直した方がむしろ早い環境もある。

また、ネイティブ側からの定数の取得はもちろんできない。

## react-native-config とどちらを使うべきか

単純に比較すると react-native-config と比べても一長一短あるため、どちらが良いかはプロジェクトによると思うが、とりあえず始めるに当たり少ない設定で react-native-dotenv で使うことができるので、まず使ってみるのも良いと思う。

なお ci では `cp .env.ci .env` みたいに CI 用の環境を .env とすることで、設定を切り分けて動かしている。
メタ文字1

#　^　$について

（２）行の先頭と最後　　^　$
  
行の先頭や最後にのみ存在する文字列を検索したい場合があります。
例１	
　今日はありがとうございました。
例２	　 
　ありがとうと言いたい
例３	
　君に心よりありがとう

これらの例に対して、
正　　規　　表　　現	
  ^ありがとう　

によって検索すると、合致するのは例２だけとなります。
つまり、半角の ^ は、行の先頭を意味します。ですから、この｢正規表現｣の場合は、行の先頭に存在する「ありがとう」の文字しか検索しないのです。

逆に、
正　　規　　表　　現	　 
　ありがとう$　
の場合は、 $ が行の終わりを意味します。この例では行の終わりにある「ありがとう」しか検索しません。ですので、合致するのは、例３だけとなります。
　また、以下のようにこの両方を同時に指定した場合、　　　
正　　規　　表　　現	
　^ありがとう$　

とすると、「ありがとう」の文字だけのある行に合致します。 
なお、行頭にある普通の文字の ^ 、行末にある $ を検索したい場合は、それぞれ 
 
正　　規　　表　　現	
　^^　
正　　規　　表　　現	
　$$　　

として下さい。 
これからもおわかりのように、^は正規表現の先頭、$は終端のものしかメタ文字として認識されません。
Swift3/Xcode8で「お問い合わせ」機能の実装

簡易的な「お問い合わせ」機能の実装をしました。不完全ですが、備忘録の為に書いておきます。


# 実行

<img width="375" alt="S__4341764.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/135794/157f89bd-f750-d39d-0ad6-24d8890b5118.jpeg">
<img width="375" alt="S__4341763.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/135794/493820c5-4bb3-deaf-03f7-632b783d6376.jpeg">
<img width="375" alt="S__4341762.jpg" src="https://qiita-image-store.s3.amazonaws.com/0/135794/c198e735-24e5-b4de-8843-a355a401ed98.jpeg">


# GitHub

https://github.com/Ryosuke-Hujisawa/Swift3-ContactUsDemo
Arduinoに接続したNeoPixelの色と明るさをシリアル通信で制御する


# 1. 概要

タイトルのままです。本来やりたいのはopenFrameworksからシリアルで信号を送り、Arduinoに接続したNeoPixelの色と明るさを変更することですが、まずはArduino IDEのシリアルモニタから制御するところまでやってみます。
これまで通信というとFirmataを使っていたのですが、[馬場さんのページ](http://tetsuakibaba.jp/index.php?page=workshop/of/arduino)を見てシリアル通信をちゃんと勉強しようと思いました。

# 2. 用意するもの

* Arduino UNO (今回はDuemilanoveを使用)
* NeoPixel (今回はLEDが19個つながっているものを使用)
* PC (MacBook Pro(Retina, 13-inch, Mid 2014) & macOS Sierra 10.12.3)
* Arduino IDE 1.8.1

# 3. 参考サイト

1. [ArduinoでNeoPixelのLEDを使ってみる。 &#8211; あかさたな](http://www.ningendesu.net/?p=579)
2. [Read line from Serial](https://forum.arduino.cc/index.php?topic=100429.0)
	* #12の回答を参考にしています


# 4. NeoPixelを光らせる

まずは[参考サイト1](http://www.ningendesu.net/?p=579)に掲載されたプログラムを見ながらNeoPixelを白く光らせます。
ライブラリをインストールしていない場合は、先に「Adafruit neopixel」というライブラリをインストールしてください。
今回はLEDの数が19個だったので`#define NUMPIXELS      1 `を`#define NUMPIXELS      19 `に変更しました。

# 5. シリアルモニタから色と明るさを制御する

[参考サイト2](https://forum.arduino.cc/index.php?topic=100429.0)の#12のプログラムを参考にしながら、



``` cpp:NeoPixel_test.ino
#include <Adafruit_NeoPixel.h>
#ifdef __AVR__
  #include <avr/power.h>
#endif
 
#define PIN            6   //Arduinoで使うピン
#define NUMPIXELS      19   //LEDの数。

#define red  9
#define green 10
#define blue 11

Adafruit_NeoPixel pixels = Adafruit_NeoPixel(NUMPIXELS, PIN, NEO_GRB + NEO_KHZ800);

int tblue = 0;
int tgreen = 0;
int tred = 0;
int tbrightness = 0;

void setup() {
  pixels.begin(); // ライブラリ使用開始
  pinMode(blue, OUTPUT);
  pinMode(red, OUTPUT);
  pinMode(green, OUTPUT);
  Serial.begin(9600);
  color(255,0,0,100);

}

void loop() {
  if(Serial.available()>0){
    tred=Serial.parseInt();
    tgreen=Serial.parseInt();
    tblue=Serial.parseInt();
    tbrightness=Serial.parseInt();
    color(tred,tgreen,tblue, tbrightness);
    
    Serial.println("red " + (String)tred + " green  " + (String)tgreen + " blue " + (String)tblue + " brightness " + (String)tbrightness);
  }
  pixels.show(); 
}

void color(int cred, int cgreen, int cblue, int brightness) {
  pixels.setBrightness(brightness);
  for(int i=0; i < NUMPIXELS; i++){
    pixels.setPixelColor(i,pixels.Color(cred,cgreen,cblue));
  }
}

```

# 5. 結果

今回は最初に赤く光るようにしてあります。

![IMG_4494.JPG](https://qiita-image-store.s3.amazonaws.com/0/94069/c63921be-af6e-df6b-5a8b-4d49751243d8.jpeg "IMG_4494.JPG")

シリアルモニタを立ち上げて例えば`0,100,100,150`と入力してenterを押すと、`red 0 green  100 blue 100 brightness 150`という表示が出てLEDの色が変わります。

![スクリーンショット 2017-05-09 10.51.27.png](https://qiita-image-store.s3.amazonaws.com/0/94069/9121de3a-f5ab-3262-2e26-0424d79fe644.png "スクリーンショット 2017-05-09 10.51.27.png")

![IMG_4495.JPG](https://qiita-image-store.s3.amazonaws.com/0/94069/57b64950-82b0-8a53-3e73-75a63e81aa34.jpeg "IMG_4495.JPG")


`Serial.parseInt()`のおかげで、ビットを操作しなくてもシリアル通信できていますが、結局あんまり勉強になってないのではないかという問題が残ります…。
Pythonのインタプリタをスクリプト内で実行させる

# Pythonのインタプリタをスクリプト内で実行させるには

みなさんはPythonのスクリプト内で **インタプリタを実行させたい** と思ったことはありませんか？
自分が作成した関数やクラスなどが最初から使えて、しかも普通のPythonコードも実行できる。
素敵ではありませんか！

## 基礎編

Pythonでは、`code.py` という、**標準ライブラリ** にインタプリタを実行できるものがあります。

```py:myconsole.py
import code
console = code.InteractiveConsole(locals=locals()) # <- locals=locals() が重要
console.interact()
```

このように書きます。ここで `code.InteractiveConsole` に `locals=locals()` という引数を与えていますが、
`locals()` は自身（ここではスクリプト内）の**ローカル領域の変数の値を全て辞書形式で返してくれる** 関数で、
これを引数に与えることによって、起動されたpythonインタプリタに **スクリプト内の関数などが渡されます**

このスクリプトを実行すると、

```
$ python myconsole.py
Python 2.7.5 (default, May 15 2013, 22:43:36) [MSC v.1500 32 bit (Intel)] on win32
Type "help", "copyright", "credits" or "license" for more information.
(InteractiveConsole)
>>>
```

このように、Pythonのインタプリタが実行されます！

## 応用編

自分がこの `code.py` をこのように使用しました。

```py:color.py
import code


def split_code(colorcode, sep=2):

    for index, letter in enumerate(colorcode, start=1):
        if index == 1:
            continue

        elif index % sep == 0:
            yield colorcode[index-sep:index]


def get_rgb(colorcode):

    result = []

    for element in split_code(colorcode):
        result.append( int(element, 16) )

    return result

def get_colorcode(r, g, b):

    code = hex(r) + hex(g) + hex(b)

    result = list(split_code(code))

    return "".join(result[1::2])


if __name__ == "__main__":

    code.InteractiveConsole(locals=locals()).interact()
```

このpythonスクリプトは、カラーコードを変換する関数が書かれています。このスクリプトを実行すると…

```
$ python color.py
Python 2.7.5 (default, May 15 2013, 22:43:36) [MSC v.1500 32 bit (Intel)] on win32
Type "help", "copyright", "credits" or "license" for more information.
(InteractiveConsole)
>>> dir()
['__builtins__', '__doc__', '__file__', '__name__', '__package__', 'split_code', 'code', 'get_colorcode', 'get_rgb']
>>>
```

このようにPythonインタプリタが起動し、しかも、 **何もimportしなくても** 作成した関数が使えるようになっております。
この何もimportしなくて良い理由は、上記のコードで `locals=locals()` としているからです。

もしここで、 `locals=locals()` としなかった場合、

```
Python 2.7.5 (default, May 15 2013, 22:43:36) [MSC v.1500 32 bit (Intel)] on win32
Type "help", "copyright", "credits" or "license" for more information.
(InteractiveConsole)
>>> dir()
['__builtins__', '__doc__', '__name__']
>>>
```

このようにスクリプト内にある関数を使うことができなくなります。

# 参考リンク

* [29.1. code — インタプリタ基底クラス](https://docs.python.jp/2.7/library/code.html)(python2.7)
* [30.1. code — インタプリタ基底クラス](https://docs.python.jp/3.5/library/code.html)(python3.5)
機械学習② ナイーブベイズ (NaiveBayes) まとめ

# ナイーブベイズ NaiveBayes のまとめ

## What is ナイーブベイズ ?

ナイーブベイズは、ベイズ定理を元に作られ、事前確率(Prior probability) とその尤度（likelihood）（[尤度の説明](http://www.genstat.net/statistics.html)）から、事後確率(Posterior probability) を割り出し、その事後確率がもっとも高いカテゴリへ分類するというものです。スパムメールの判断などに使われているで有名です。

![Screen Shot 2017-05-08 at 17.58.18.png](https://qiita-image-store.s3.amazonaws.com/0/161691/028c22d9-4c9a-e0e2-95eb-0c8ca491f967.png)
Extracted from 'Introduction to Machine Learning', Udacity

上記は、'LIFE DEAL' というメールの文面から、Sara と Chris どちらが送ったのかをナイーブベイズで予想している。
Chris と Sara のそれぞれのメールの送る確率は、50% ずつで、（事前確率）
Chris は LOVE 10%, DEAL 80%, LIFE 10% の割合で単語を使うのに対し、
Sara は LOVE 30%, DEAL 20%, LIFE 30% の割合で単語を使う。（尤度）

つまり事後確率は、
事前確率 × 尤度  = 事後確率
Chris 10% × 80% × 50%  = 0.04
Sara  30% × 20% × 50%  = 0.03 

これを直すと、
0.04 + 0.03 = 0.07 (これが100% の状態)
Chris 0.04 / 0.07 = 0.57 → 57%
Sara 0.03 / 0.07 = 0.43 → 43% 

つまり、57%の確率で Chris な訳なので、結果この LIFE DEAL と書かれたメールは
Chris に分類されるわけです。 


## default のコード

```python:

from sklearn.naive_bayes import GaussianNB

GaussianNB(priors=None)

#以上が default のコードです、シンプルですね。

```



## NaiveBayes の 良い点悪い点。

- 良い点

ひとつひとつの特徴量を独立して考え、それぞれ一次元上に表すので、次元の呪い(curse of dimentionality) を緩和することができる。 

- 悪い点

例えば、最初の Chris と Sara のメール判断からもわかるように、Naive Bayes は、単語の頻度だけを見ているので、その文章の順序だったり、組み合わせだったりを判断することはできない。例えば、英語であれば動詞の直前に not がつくだけで、意味が180度変わったりしてしまう。つまり、特徴量を一つの独立したものとして捉え、特徴量同士の相関は考慮されていない。

## まとめ

以上が現在筆者のわかる範囲での NaiveBayes の概要です。
日々更新していきますので、追加すべきところ、直すべきところありましたら、コメントいただけると幸いです。
docker system df と docker system prune を使ってみた


dockerの1.13から便利なコマンドが増えたので、遅ればせながら試してみました。

- `docker system df`
    - Image,Container,Volumeの数や容量を表示してくれます。
    - https://docs.docker.com/engine/reference/commandline/system_df/
- `docker system prune`
    - 止まってるコンテナ、使われてないボリューム、使われてないネットワーク、使われてないイメージを削除してくれます。
    - https://docs.docker.com/engine/reference/commandline/system_prune/

開発しながらだと使い捨てのイメージやボリュームが溜まりがちなので、きれいになってスッキリしました。
Dockerでディスク容量が圧迫されて、困る前に実行してみてください。

```bash

$ docker system df
TYPE                TOTAL               ACTIVE              SIZE                RECLAIMABLE
Images              51                  12                  13.8GB              12.64GB (91%)
Containers          14                  0                   2.379GB             2.379GB (100%)
Local Volumes       47                  4                   6.754GB             5.841GB (86%)
$ docker system prune
WARNING! This will remove:
    - all stopped containers
    - all volumes not used by at least one container
    - all networks not used by at least one container
    - all dangling images
Are you sure you want to continue? [y/N] y
〜〜中略〜〜

$ docker system df
TYPE                TOTAL               ACTIVE              SIZE                RECLAIMABLE
Images              39                  0                   13.8GB              13.8GB (100%)
Containers          0                   0                   0B                  0B
Local Volumes       0                   0                   0B                  0B
```
【初心者備忘録】エンジニア始めて1ヶ月でもっとも使ったLinux/Unixコマンドの略称と意味まとめ一覧

Linux/Unixコマンのド略称が多く、初心者だった私は心が折れる事がしばしばありました。
そこで備忘録の為に、まとめてみました！
※今後も増やして行く予定です。


|      コマンド	   |       本来の意味	 |    処理内容    |  
|:-----------------|------------------:|:------------------:|:------------------:|
| ls               |     list segments |         区分けして一覧にせよ   |                    |
| pwd	           | print working directory |       作業しているディレクトリを表示せよ       |              |
| cd               |        change directory |        ディレクトリを変更せよ        |                |
| mkdir            |         Make Directory|         ディレクトリを作成せよ         |             |
| mv               |         move |        移動せよ          |            |
| cp               |         copy |         複製せよ         |             |
| rm               |         remove |         削除せよ         |             |
| cat              |       catenate|         連結せよ         |             |
| chmod            |     change mode   |      ファイルやディレクトリのアクセス権を変更         |             |
| chown            |        Change Owner	|     ファイルの所有者やグループを変更          |             |
| chgrp            |      Change Group	|        ファイルやディレクトリのグループを変更         |             |
| df               |         Disk Free	 |         ディスク容量の確認         |             |
メタ文字　種類

#説明
----------------------------------------------------------------------------------------------
　
＜バック・スラッシュ（\）＞

・・・メタ文字を表示したい場合は，メタ文字の前にバック・スラッシュ（\）を付ける。・・・

たとえば，「$100」と表示したい場合は，

$ echo \$100 

（出力結果）$100

のようにする。また，複数のメタ文字がある場合は，それぞれのメタ文字の前にバック・スラッシュを付ける。例えば，「A&B : $10」と表示したい場合は，「&」と「$」，スペースのそれぞれの前にバック・スラッシュを付ける。

$ echo A\&B\ :\ \$10 

（出力..）A&B : $10

　バック・スラッシュ自身を表したい場合はバック・スラッシュを2つ並べて記述する。

$ echo \\ 

（出力..）\

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

＜シングル・クォーテイション（'）＞

・メタ文字を多く利用する場合は，多数のバック・スラッシュを使うことになり，見にくくなってしまう。シングル・クォーテイション（'）記号でくくると，くくられた中のメタ文字は特殊な意味を持たなくなり，スクリプトもすっきりと表記できる。
（（'）記号でくくると，くくられた中のメタ文字は特殊な意味を持たずにただの文字列になる）

たとえば，「A&B : $10」であれば，

$ echo 'A&B : $10' 
A&B : $10

とすればよい。
また，シングル・クォーテイションのみは特殊な意味を持っているため，シングル・クォーテイション内にシングル・クォーテイションを記述することはできない。

　ダブル・クォーテイション（"）

・ダブル・クォーテイション（"）にくくられた場合も，メタ文字は特殊な意味を持たなくなる。ただし，以下のメタ文字については特殊な意味を保持し続ける。

↓
"  $  `  \

　これらのメタ文字を表記したい場合は，メタ文字の前にバック・スラッシュを付ける必要がある。たとえば，「My "Fantastic" Car : $2000」と表記したい場合は，

$ echo "My \"Fantastic\" Car : \$2000" 
My "Fantastic" Car : $2000
とする。

----------------------------------------------------------------------------------------------
＜エスケープ・シーケンス＞

　コンピュータでは改行やタブといった目で見える形で表せない文字がある。これらの文字を取り扱いたい場合は，エスケープ・シーケンスを利用する。エスケープ・シーケンスには以下のようなものがある。

-------------------------------------------------------
エスケープ・シーケンス	意味
\a	ベルを鳴らす
\b	バック・スペース
\e	エスケープ文字
\f	フォーム・フィールド文字
\n	改行
\r	復帰
\t	水平タブ
\v	垂直タブ
\数字	指定したASCIIコードの文字。数字は8進数3桁で表記する
\x数字	指定したASCIIコードの文字。数字は16進数3桁で表記する

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

　エスケープ・シーケンスを利用すれば，1行で複数行を表すこともできる。

$ echo -e "Fukuda\t: PlanA\nAso\t: PlanB" 
Fukuda  : PlanA
Aso     : PlanB

　この場合は，エスケープ・シーケンスにタブ「\t」と改行「\n」を利用している。また，echoでエスケープ・シーケンスを使う場合は「-e」オプションを付ける。
Scratchで体験するゲームプログラミングのための物理シミュレーション (中高生向け)

この記事のURL: ``https://goo.gl/skkmra``

---

# この記事でやること

- ゲームにリアルな動きを！
  - ゲームの中では、キャラクターが飛んだり落ちたりする。
  - こうした「**動き**」をリアルに再現したい。
- では、どうすればいい？
  - モノの動きは**物理法則**に従う。
  - コンピュータの中で**物理法則**を**シミュレート(真似)**しよう！
  - これが「**物理シミュレーション**」。

**カンタンな物理シミュレーションを覚えて、リアルなゲームを作ろう！**

---

# 第1回: キャラクターを加速させてみる

---

## やってみよう(1)

まず、Scratchの復習を兼ねて、キャラクターが一定のスピードで動くだけのプログラムを作ってみよう。具体的には、次のような形でプログラムを作ってみよう。

1. 最初にキャラクターの向きを45度にする。
2. 0.1秒ごとに、10歩ずつ動かし、もし端についたら跳ね返る。

![スクリーンショット 2017-05-09 10.25.54.png](https://qiita-image-store.s3.amazonaws.com/0/155441/4811b00e-fc90-a296-8b8d-000cd9336d99.png)

**ヒント**:

- 「動き」の「〜度に向ける」や「〜歩動かす」を使う。
- 「制御」の「ずっと」(くり返し)を使う。

---

## 「位置」だけでなく「速さ」を考えよう

- モノの動き方をリアルに再現するには、未来の動き方を予想できないとダメ。
- そのためには、「速さ」を考えることが大事。
  - モノの「位置」だけでは、ある瞬間の後どのように動くかが分からない。
  - 「速さ」が分かっていれば、ある瞬間の後どのように動くかが予想できる。
- 身近な例
  - モノが落ちるときの動き(一定のスピード=重力加速度で速くなる)
  - 自動車の動き(アクセルで速く、ブレーキで遅くなる)

**リアルな動きを再現するには「速さ」が必要！**

---

## やってみよう(2)

上のプログラムを改良して、キャラクターが動く速さが時間の経過とともに変化するプログラムを作ってみよう。具体的には、以下のように作ってみよう。

- 「速さ」という名前の変数を用意する。
- 0.1秒ごとに、「速さ」の分だけ進むようにする。
- 0.1秒ごとに、「速さ」を1ずつ増やす。

![スクリーンショット 2017-05-09 10.27.02.png](https://qiita-image-store.s3.amazonaws.com/0/155441/02498118-9130-c34b-0cf8-f2706d4828b2.png)

**ヒント**:

- 「データ」の「変数を作る」から変数を作れる。
- 「速さ」の値を最初に0にリセットしておこう。

---

## チャレンジ(1)

上のプログラムを改良して、キャラクターが一つだけでなく、1秒ごとに1つずつ増えるプログラムを作ってみよう。具体的には、次のように作ってみよう。

- 1秒ごとにキャラクターをクローンする。
- クローンされたキャラクターの位置と向きをランダムに決める。

![スクリーンショット 2017-05-09 10.29.49.png](https://qiita-image-store.s3.amazonaws.com/0/155441/79561721-a79e-01bb-1fd0-54babc05be9d.png)

**ヒント**:

- 「制御」の「〜のクローンを作る」を使う。
- クローン元は隠しておき、クローンされたときに表示されるようにする。

## チャレンジ(2)

上のプログラムを改良して、キャラクターをクリックすると消えるようにしてみよう。

---

## チャレンジ(3)

上のプログラムを改良して、今画面の上に表示されているキャラクターの数を表す変数を作り、もしキャラクターの数が10を超えたら、ゲームオーバーとするプログラムを作ってみよう。また、キャラクターの向きが少しずつランダムに変わるようにしてみましょう。

---

# 第1回の解答(例)

## やってみよう(1)

![](https://qiita-image-store.s3.amazonaws.com/0/155441/04f161fd-28b6-c9a9-6afe-62240ed765b0.png)

## やってみよう(2)

![スクリーンショット 2017-05-09 10.19.41.png](https://qiita-image-store.s3.amazonaws.com/0/155441/7131a19a-60b4-4d8a-5f93-777913771a3c.png)

## チャレンジ(1), (2)

![スクリーンショット 2017-05-10 11.45.30.png](https://qiita-image-store.s3.amazonaws.com/0/155441/6cae39d6-25f3-8924-34cd-505fc78b0c32.png)

## チャレンジ(3)

キャラクターのスプライトに加え、「Game Over」と表示するためのスプライトを作りましょう。

![スクリーンショット 2017-05-09 10.40.57.png](https://qiita-image-store.s3.amazonaws.com/0/155441/68be0e41-2e3e-062d-8fd0-a8084f412a7b.png)

キャラクターのスプライトの方のスクリプトは、次のように作ります。

![スクリーンショット 2017-05-10 12.36.18.png](https://qiita-image-store.s3.amazonaws.com/0/155441/c236108a-baab-1c10-70f5-f5f01fb3e40d.png)
![スクリーンショット 2017-05-10 12.36.26.png](https://qiita-image-store.s3.amazonaws.com/0/155441/f7ad9eb6-da4f-c8b1-bee7-536a469b4903.png)

「Game Over」のスプライトの方のスクリプトは、次のように作ります。

![スクリーンショット 2017-05-09 10.40.43.png](https://qiita-image-store.s3.amazonaws.com/0/155441/7b5b669f-bcf6-7ec4-d43f-c24af880e3db.png)

<!--

---

# 第2回: キャラクターをジャンプさせる

---

-->
メタ文字の取り扱い    

/*(経緯....bashで使用)*/

＃はじめに

シェルではいくつかの記号について，特殊な意味を持っているものがある。たとえば，
スペースはファイルの区切りとして利用されている。

------------------------------------------------
「My Document」というファイルを表示したい場合に，

$ cat My Document 

としてしまうと，「My」と「Document」の2つのファイルを表示しようとしてしまう。
　これらシェルで予約されている記号（メタ文字）や改行といったエスケープ・シーケンスを使いたい場合は，
文字列をクォーテイション（"や'）記号でくくったり，メタ文字の前にバックスラッシュ（\）記号を付ける。

前述した例では↓

$ cat "My Document" 
$ cat 'My Document' 
$ cat My\ Document 
のように表記できる。

-------------------------------------------------
メタ文字は以下の通のようなものがある。

"  $  @  &  '  (  )  ^  |  [  ]  {  }  ;  *  ?  <  >  `  \  スペース
改行，タブといったエスケープ・シーケンス
windowsでTensorFlow その17

#概要
windowsでTensorFlowやってみた。
tensorboardを使ってみた。
#環境
windows 7 sp1 64bit
anaconda3
tensorflow 1.0
pyqt5
OpenAi Gym 0.5
#プログラムの手順

tensorboardでloss見る

```
tf.summary.scalar("loss", loss)
merged = tf.summary.merge_all()

with tf.Session() as sess:
	sess.run(tf.initialize_all_variables())
	writer = tf.summary.FileWriter("./logs", graph = sess.graph)
	for i in range(100001):
		sess.run(train, feed_dict = {
			x_in: batch_x,
			y_out: batch_y
		})
		if i % 10000 == 0:
			print (i)
			summary = sess.run(merged, feed_dict = {
				x_in: batch_x,
				y_out: batch_y
			})
			writer.add_summary(summary, i)
```

#tensorboard起動

```
tensorboard --logdir=./logs
```

localhost:6006をブラウザで見る。

#写真

![loss.jpg](https://qiita-image-store.s3.amazonaws.com/0/18104/30eac4a1-3782-cc58-65e5-cca1fc92adc3.jpeg)
Invoke-WebReqestコマンドレット実行時エラーのHTTPステータスコード（200以外）の取得について

# はじめに
Invoke-WebRequestコマンドレット便利ですね。
WebAPIへのアクセスをテストしていた際、HTTPステータスが200以外の場合にInvoke-WebRequestコマンドレットの実行時エラーが発生してしまい、HTTPステータスが戻り値から取得できませんでした。

なんとかかんとか解決したので、備忘として記載しておきます。
ありがとう、stackoverflowと外国の人。

# 環境
- PowerShell3.0

# コード
```sample.ps1
try {
    $response = Invoke-WebRequest -Uri $webApiUrl -Method Post
} catch {
    // HTTPステータスコード
    $_.Exception.Response.StatusCode.Value__
}
```

# 参考サイト
http://stackoverflow.com/questions/19122378/powershell-web-request-without-throwing-exception-on-4xx-5xx
ghqとpecoをつかって、bashでもrepository管理するスクリプト

# 概要
ghqを使って、repositoryを管理していると、インタラクティブに管理しているrepositoryにアクセスしたくなる。当然pecoを使ってやりたいのだけれど、だいたいzshのスクリプトが出てくる。「ぶっちゃけzshよりも、もうbashでよくね？」派なので、bashでもghqをpecoれるのを書いた。

# source
これを`bashrc`に書いて、`source ~/.bashrc`してください。`repo`と打てばハッピーになれます。

```bash
function repo {
    pushd $HOME/.ghq
    local dir="$( ls -1d */*/* | peco )"
    if [ ! -z "$dir" ] ; then
        cd "$dir"
    else
        popd
    fi
}
```
[memo]LinuxでUSB-Serial

###個人的メモも兼ねてます。

##はじめに
サーバでもクライアントでもLinuxを常用している方
CISCOやApresiaのメンテナンスもLinuxを使いたいですよね？

##FTDI chipset USB RJ45 コンソールケーブル
FTDI chipset USB RJ45 コンソールケーブル持ってるので
LinuxでUSB-Serialも使ってます。
使用しているディストリビューションは、openSUSE Thumbleweedです。
![ファイル 2017-05-09 8 28 19.jpeg](https://qiita-image-store.s3.amazonaws.com/0/84011/38142c67-f6b2-2e90-f66b-0e2b0cda43b9.jpeg)

とりあえずUSBを接続してデバイス名を確認。

```
[  175.508862] usb 1-1.2: new full-speed USB device number 5 using ehci-pci
[  175.625253] usb 1-1.2: New USB device found, idVendor=0403, idProduct=6001
[  175.625260] usb 1-1.2: New USB device strings: Mfr=1, Product=2, SerialNumber=3
[  175.625263] usb 1-1.2: Product: FT232R USB UART
[  175.625266] usb 1-1.2: Manufacturer: FTDI
[  175.625269] usb 1-1.2: SerialNumber: A5026T8I
[  176.165486] usbcore: registered new interface driver usbserial
[  176.165500] usbcore: registered new interface driver usbserial_generic
[  176.165513] usbserial: USB Serial support registered for generic
[  176.168119] usbcore: registered new interface driver ftdi_sio
[  176.168135] usbserial: USB Serial support registered for FTDI USB Serial Device
[  176.168223] ftdi_sio 1-1.2:1.0: FTDI USB Serial Device converter detected
[  176.168265] usb 1-1.2: Detected FT232RL
[  176.169875] usb 1-1.2: FTDI USB Serial Device converter now attached to ttyUSB0
```

ttyUSB0のグループをrootに変更します。
その後、cuコマンドで接続するだけです。

```
sudo chgrp root /dev/ttyUSB0
sudo cu -s 9600 -l /dev/ttyUSB0 
``` 

たった2行ですが、シェルスクリプト書いとけば面倒も減ります。
cuコマンドは、デフォルトでインストールされてないことが多いので
追加してください。
RPGツクール製ゲームで出るエラーの対処方法(コーデック起因)

本件についてまとまった記事がないため、Qiitaに記すこととする。
この問題の解決に多くの時間を要したため、今後、似たような問題に遭遇した際に参考となれば幸いである。


# コーデック問題

#### 発生状況
ゲームをプレイ中、または起動時に突然「RGSS Playerは動作を停止しました」となり強制終了される

#### 原因

ゲーム中に何らかのメディア(BGM等)を再生しようとした際に、OSに組み込まれているコーデックを読みに行こうとして失敗するようだ。

下記の画像は、イベントビューアー上で確認できたApplication Errorのイベントログだ。

![image222.jpg](https://qiita-image-store.s3.amazonaws.com/0/59328/d171001f-3af2-cf90-21e6-644fdfe9552c.jpeg)


#### 解決策
下記のコーデックを削除したところ問題が解決した。

・Xiph.org Ogg Vorbis


※Windows7から10へのアップグレード前にコーデックパック等をインストールした事がある場合は、それらも一旦削除して動作確認することをお勧めする。

#### 参考URL
[まったりとDTMに挑戦する記録 - RPGツクールVXのゲームが動かなかったのが動くようになった話](http://730ri.blog103.fc2.com/blog-entry-562.html)
[TIPS - Wind Messer - Windows7 でMP３再生時にフリーズする](http://windmesser.cc/wiki/index.php?%E5%89%B5%E4%BD%9C%2F%E3%83%84%E3%82%AF%E3%83%BC%E3%83%AB%2FTIPS#k3d21578)

# 筆者の環境
OS: Windows10 Pro 64bit CreatorsUpdate適用済み
CPU: Core i7-6700K 4GHz
RAM: 32GB
GPU: MSI GeForce GTX1070 8GB
SSD: 240GB
HDD: 2TB

# おきまりごと

・本ページの情報を参照して発生したいかなる不利益/損害について責任を負いません。
・記事内容の無断転載は認めません。本ページへのリンクを含んでください。
・必要に応じて随時追加/修正を行います。
Flickr　画像url作成からDOM生成まで

忘れそうなので、memoしました。

```js
$(function() {
    call_api();
});
//api取得
var apiKey = "number";

//url作成
var getUrl = function(photo, size) {
    var url = "https://farm" + photo.farm + ".staticflickr.com/" +
        photo.server + "/" + photo.id + "_" + photo.secret;
    if (size) {
        url += "_" + size;
    }
    url += ".jpg";
    return url;
};

var parameters = $.param({
    method: "flickr.photos.search",
    api_key: apiKey,
    text: "math",
    per_page: 11,
    sort: "interestingness-desc",
    license: "4",
    format: "json",
    nojsoncallback: 1,
});

var flickr_url_1 = "url" + parameters;
//callback
//要素の自動生成
var callback = function(data) {

    var ul = $("要素");
    var md = $("要素");

        for (var i = 0; i <= data.photos.photo.length-1; i++) {
            var pict = data.photos.photo[i];
            ul.append($("要素").append($("<img>", {
                src: getUrl(pict, "q"),
                width: 400,
                height: 300,
            }))
          );
        }
        md.append(ul);

}

var call_api = function(data){

  $.ajax({
    url:flickr_url_1,
      type: "POST",
      dataType: "json",
      success: function(data) {
      callback(data);
      }
  });
}
```

フリッカーの画像のurl作成から、フリッカーの画像を欲しい分だけ生成し、
最後、DOM要素の生成を行なっています。

ご指摘、ぜひ伺いたいです。

では、参考までに
oracleRDSへの接続でORA-12154エラー

oracleのRDSを立てたときにエラーが出てはまった話です。
同じようにはまる人のためと自分のメモのために残しておきます。

### 実現したかったこと

VPC内のEC2インスタンスから同一VPC内にあるRDS(oracle)へsqlplusで接続しようとしました。
RDSはパブリックアクセス不可の設定です。


### 発生したエラー

```bash
> sqlplus username/password@db_instance_identifier.abcdefghijklmn.ap-northeast-1.rds.amazonaws.com:1521/orcl

ORA-12154: TNS:could not resolve the connect identifier specified
```

ただし、IPアドレスだと通ります

```bash
> sqlplus username/password@11.22.33.44:1521/orcl
```

### 原因（と思われるもの）

こんな記事を見つけました。
http://toatoshi.hatenablog.com/entry/2014/06/16/201922

> ホスト名（Endpoint）の制限値が63byteとなっているようで、それ以上になるとsqlplus側でホスト名をハンドルできない状態となりORA-12154が出力するようです。

たしかに、VPC内にRoute53でDNSを設定し、CNAMEレコードを作成して63byte/64byteで試してみると確かにそのような挙動になっている・・！

AWSのデフォルトのサブドメインが結構長いのでDBインスタンス名が少し長くなっただけでこの問題に引っかかってしまいますね。


### 対策

tnenames.oraに書く接続記述子を指定して接続すればOK。

```bash
> sqlplus username/password@(DESCRIPTION=(ADDRESS_LIST=(ADDRESS=(PROTOCOL=TCP)(HOST=db_instance_identifier.abcdefghijklmn.ap-northeast-1.rds.amazonaws.com)(PORT=1521)))(CONNECT_DATA=(SERVICE_NAME=orcl)))

SQL> 
```

めでたしめでたし。
Kubernetes: ConfigMap / Secret の内容を一度に環境変数として読み込む (envFrom)

kubernetes v1.6.0 で追加された ConfigMap / Secret の内容を一度に Pod への環境変数として読み込むという機能 ([envFrom](https://kubernetes.io/docs/api-reference/v1.6/#envfromsource-v1-core)) が便利だったのでご紹介します。

# v1.6 以前の指定方法

v1.6 以前は ConfigMap / Secret のキーを環境変数として読み込む場合、以下のようにひとつづつキーを読み込まなければならず、キーが多い場合に冗長な記述となっていました。

```yaml
kind: Pod
metadata:
  name: mypod
spec:
  containers:
  - name: nginx
    image: nginx
    env:
    # 一つづつ環境変数に読み込まなければいけなかった
    - name: USERNAME
      valueFrom:
        configMapKeyRef:
          name: myconfig # ConfigMap の name
          key: USERNAME  # ConfigMap のキー名
    - name: PASSWORD
      valueFrom:
        configMapKeyRef:
          name: myconfig
          key: PASSWORD
    # 環境変数の数だけ繰り返し
```

# v1.6 で追加された envFrom

v1.6.0 で下記のように [envFrom](https://kubernetes.io/docs/api-reference/v1.6/#envfromsource-v1-core) という項目で ConfigMap または Secret の内容を一度に同名または prefix 付きの環境変数として読み込むことができようになりました。

以下では簡略のため Pod を例にしていますが Deployment や ReplicaSet でも同じ指定ができます。

```yaml
apiVersion: v1
kind: Pod
metadata:
  name: envfrom-test
spec:
  containers:
  - name: nginx
    image: nginx:1.11
    envFrom:  # env ではなく envFrom
    - configMapRef:
        name: envfrom-test # ConfigMap の name を指定。すべてのキーが環境変数として展開される
      prefix: MY_PREFIX_     # 名前衝突しないように prefix を指定することもできる
    # Secret の場合は secretRef で Secret の name を指定
```

ConfigMap はキー名が環境変数として使われること以外、今までと変わりません。

```yaml
kind: ConfigMap
apiVersion: v1
metadata:
  name: envfrom-test
data:
  # キー名が環境変数名として展開される
  URL: myurl
  USERNAME: myuser
  PASSWORD: mypassword
```

上記の例でデプロイした Pod の環境変数を `kubectl exec` を使って見てみます。指定した prefix + ConfigMap のキー名で環境変数に展開されていることがわかります。

```bash
$ kubectl exec envfrom-test env | grep MY_PREFIX
# ConfigMap に入っている 3つのキーが環境変数として自動的に設定されている
MY_PREFIX_PASSWORD=mypassword
MY_PREFIX_URL=myurl
MY_PREFIX_USERNAME=myuser
```

# 参考

- [Allow auto-population of environment variables from ConfigMap #26299](https://github.com/kubernetes/kubernetes/issues/26299)
- [Allow pods to define multiple environment variables from a whole ConfigMap #36245](https://github.com/kubernetes/kubernetes/pull/36245)
- https://kubernetes.io/docs/api-reference/v1.6/#envfromsource-v1-core
カルーセル（スライダー）メモ

とても基本的なことだと思いましたので、memoしました。    

```js
    //スライダー
    var index = 0; // 現在、表示している画像の順番
    var width = 400; // 画像１つの幅
    var left = 0; // 画像一覧の左端のポジション

    var anime = function() {
        var parent = $("#slider_id ul");
        var child = parent.children();
        var len = child.length;

        // index が 全ての画像枚数より小さい場合は、 indexを１つ大きくする
        if (index < len - 1) {
            index++;
            $(child).eq(index).clone().appendTo(parent);
        }
        // index に応じた left のポジションを計算し、アニメーションさせる
        parent.animate({
            left: -width * index + "px"
        }, 500);
    };
    // 2500ms に１度 animeという関数を実行する
    setInterval(anime, 2500);
```

画像はフリッカーから取り出し、clone（）の箇所で、増えるごとに違う画像が出て来ています。
ご指摘などありましたらぜひ、伺いたいです。

では、参考までに
ルー語翻訳のChrome拡張を作ってみた

# きっかけ
[ルー語で遊んでいたらJSONPが作れてしまった](http://qiita.com/Bong/items/0ea35fc7481d43f384b2)の記事を読んでみて「面白いAPIだなぁ」と思い作ってみました

# 使い方
[Chromeウェブストア](https://chrome.google.com/webstore/detail/ルー語翻訳/nlnbgfcjlgjckbmbagalgdeaacmlcobb)からダウンロード

使い方もリンク先に書いています

# ソース解説
ソースコード https://github.com/taqm/rulang-extension

## 処理の流れ
1. backgroundページでコンテキスメニューへ追加
2. 追加したメニューがクリックされたらcontent_scriptsへイベントを送信
3. content_scriptsでイベントをハンドリングし、選択範囲の情報を取得(文字、座標)
4. 選択範囲の文字列をAPIへ送信
5. APIの結果をポップアップとして表示する

やっていることはすごくシンプルです!

重要なものは以下のファイル

- manifest.json
- background.js
- content.js

## manifest.json
[公式ページ](https://developer.chrome.com/extensions/manifest)をみながらぽちぽちと記述していきました
特筆する部分のみ解説します

```manifest.json
{
  "background": {
    "scripts": ["background.js"]
  },
  "content_scripts": [
    {
      "matches": ["*://*/*"],
      "js": ["jquery-3.2.1.min.js", "content.js"],
      "css": ["content.css"]
    }
  ],
  "permissions": [
    "contextMenus"
  ]
}
```

#### bacground
[このページ](https://developer.chrome.com/extensions/background_pages)ではbackgroundページの利用は控えて
Eventページにしましょうと書いてあるのですが、
コンテキストメニューへの追加はイベントではないので無視(というかEventページだと動かない)

#### content_scripts
- 全てのページで実行できるようにmatchesはゆるゆるに
- 色々と楽するためにjQueryを読み込み
- ポップアップのスタイルは外部CSSで

#### permissions
コンテキストメニューに追加するので権限を追加

## background.js

```js:background.js
chrome.contextMenus.create({
  title : 'ルー語に翻訳',
  type  : 'normal',
  contexts : ['selection'],
  onclick(info, tab) {
    chrome.tabs.sendRequest(tab.id, {})
  }
})
```

選択範囲を対象とするのでcontextsはselectionに設定

onClickの第１引数のオブジェクトには選択している文字列が入っているのですが
改行が取得できなかったためここでは単純にcontent_scriptへイベントを送信するのみとなっております

## content.js

### 選択範囲取得処理
```js:content.js
  const selection = window.getSelection()
  const text = selection.toString()
  const range = selection.getRangeAt(0)
  const rect = range.getBoundingClientRect()
```
text = 選択している文字列
rect = 選択している範囲

### 翻訳処理

```js:content.js
function transform(text) {
  const form = new FormData()
  form.append('text', text)
  return fetch('https://lou5.jp/api', {
    method: 'post',
    body: form
  }).then(res => res.text())
}
```
きっかけとなったhttps://lou5.jp/api 様のAPIへ接続しております
ちなみにこの拡張はこの部分の処理をいじることで色々な翻訳アドオンとなります

### ポップアップ表示処理
```js:content.js
  const replaced = text.replace('\n', '<br>')
  const $dom = $(`
    <div>
      <div class="rulang-highlight"></div>
      <div class="rulang-label">
        <span class='rulang-close'>×</span>
        ${replaced}
      </div>
    </div>
  `)
```
改行を`<br>`に置き換えてDOM構築
あとはスタイルに選択範囲rectオブジェクトの値を設定していきます

また、特に意味もなく選択範囲を黄色でハイライトしています
選択範囲を含む矩形になるので少し範囲は外れますが。。。

# 作ってみて
普段のフロントエンド開発ならwebpackでbabelやらpolyfillを使ってますが
今回はChrome固定なので何もせず楽な構成をとっております

見ての通り、接続先APIがルー語変換APIというだけでこの拡張は何もしていないです
サクッと作れる何かを作りたい気分だったのでいい気分転換になりました

おかしなところやアドバイス等あればぜひご意見ください！

# 関連
[ルー語変換](https://lou5.jp/)
[ルー語で遊んでいたらJSONPが作れてしまった](http://qiita.com/Bong/items/0ea35fc7481d43f384b2)
Visual Studio / WPF > string > =""; と = null;

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
Sublime Text 2
```

09 CheckBox与可空数据类型
https://www.youtube.com/watch?v=C7Uoy1CVYJU&list=PLaYqF7AnyNPfTfZiGqTwedIKW_FkZv4Xj&index=9
03:20あたりからstringに代入する""とnullの違いが紹介されている。

試してみた。

```MainWindow.xaml
<Window x:Class="_170509_t0725_stringNull.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:_170509_t0725_stringNull"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Button Content="Button" HorizontalAlignment="Left" Margin="50,53,0,0" VerticalAlignment="Top" Width="75" Click="Button_Click"/>

    </Grid>
</Window>
```

```MainWindow.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace _170509_t0725_stringNull
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            string emptyStr = "";
            string nullStr = null;

            MessageBox.Show(emptyStr.Length.ToString());
            MessageBox.Show(nullStr.Length.ToString());
        }
    }
}
```

emptyStrの方はLengthを取得できる。
nullStrの方は以下の例外が発生した。

![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/2c707acd-0330-c536-967b-417bedc72ca3.png)
Visual Studio / WPF > コントロール > PasswordBox > MaxLengthプロパティ

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
Sublime Text 2
```

関連 http://qiita.com/7of9/items/58590852bb07e7e489a1

https://www.youtube.com/watch?v=SBeDgl7CX6E&list=PLaYqF7AnyNPfTfZiGqTwedIKW_FkZv4Xj&index=8
PasswordBoxが紹介されている。

MaxLengthプロパティと組み合わせて、指定長さのパスワードを入力するInterfaceを用意できる。

```MainWindow.xaml
<Window x:Class="_170509_t0708_passwordBox.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:_170509_t0708_passwordBox"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <PasswordBox x:Name="PB_pass" HorizontalAlignment="Left" Margin="47,43,0,0" VerticalAlignment="Top" Width="100" MaxLength="8"/>
        <Button Content="Button" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="176,39,0,0" Click="Button_Click"/>

    </Grid>
</Window>
```

```MainWindow.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace _170509_t0708_passwordBox
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            MessageBox.Show(PB_pass.Password);
        }
    }
}
```

3.1415926535と入力。
![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/9fc29e8c-66e7-2255-8c06-39efa456e09f.png)

Buttonクリック時 (MaxLength=8での表示)
![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/c6fa324d-c583-1341-0b21-719740feceb8.png)
Visual Studio / WPF > 08 TextBox和PasswordBox > TextBox > MaxLengthプロパティ > 入力時:長さ制限がかかる | Csharp script: 長さ制限がかからない

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
Sublime Text 2
```

https://www.youtube.com/watch?v=SBeDgl7CX6E&list=PLaYqF7AnyNPfTfZiGqTwedIKW_FkZv4Xj&index=8
3:50あたり

TextBoxのMaxLengthプロパティの例が紹介されている。
MaxLengthプロパティを使うと、入力時にテキストの長さに制限がかかるようだ。

一方で、以下のようなコードでTextBoxの中身を代入する場合には、長さ制限がかからないようだ。

```csharp
T_pass1.Text = "3.141592";
```


入力時 (長さ制限あり MaxLength=5)
![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/b687b607-d97b-bdb8-5910-82475fa04e54.png)

C# scriptでの代入時 (長さ制限なし)
![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/7d74d645-230a-7cdd-e360-8aa0e4e4e7fa.png)
Visual Studio / WPF > 08 TextBox和PasswordBox > TextBox > IsReadOnly | TextWrapping プロパティ

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
Sublime Text 2
```

https://www.youtube.com/watch?v=SBeDgl7CX6E&list=PLaYqF7AnyNPfTfZiGqTwedIKW_FkZv4Xj&index=8

TextBoxのプロパティとしてIsReadOnlyとTextWrappingを使った例が紹介されている。

試したみた。

```MainWindow.xaml
<Window x:Class="_170509_t0640_TextBox.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:_170509_t0640_TextBox"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <TextBox x:Name="T_memo" HorizontalAlignment="Left" Height="142" Margin="35,28,0,0" TextWrapping="Wrap" Text="J'ai étudié le français pendant huit ans, mais Je e ne peux pas parler français bien maintenant. Tant pis." VerticalAlignment="Top" Width="272" IsReadOnly="True"/>

    </Grid>
</Window>
```

MainWindow.xaml.cs側のコードは追加実装なし。

![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/d1a06732-7b13-ed1b-74f8-1cf4b88cb7aa.png)

TextBoxのTextには[アクサンテギュ](https://ja.wikipedia.org/wiki/%E3%82%A2%E3%82%AD%E3%83%A5%E3%83%BC%E3%83%88%E3%83%BB%E3%82%A2%E3%82%AF%E3%82%BB%E3%83%B3%E3%83%88)なども普通に使えるようだ。

IsReadOnly という名前のプロパティはメソッド名のようにも見えてしまう。
IsTextWrappedでなくTextWrappingという命名にも違和感はある。
Visual Studio / WPF > 07 控件的常用通用属性 > System.Windows.Visibility. > Collapsed | Hidden | Visible

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
Sublime Text 2
```

https://www.youtube.com/watch?v=dIk2J_uANUY&list=WL&index=32

ボタンを押したときにTextBoxコントロールの非表示・表示のコード例が紹介されている。

非表示・表示はVisibilityプロパティを設定するようだ。

- System.Windows.Visibility.Collapsed;
  - 要素を表示しません。また、その要素の領域もレイアウト内に予約しません。
- System.Windows.Visibility.Hidden;
  - 要素を表示しませんが、その要素の領域をレイアウト内に予約します。
- System.Windows.Visibility.Visible;
  - 要素を表示します

試してみた。

```MainWindow.xaml
<Window x:Class="_170509_t0615_visibility.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:_170509_t0615_visibility"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <Button x:Name="B_show" Content="Show" HorizontalAlignment="Left" Margin="58,37,0,0" VerticalAlignment="Top" Width="75" Click="B_showClick"/>
        <TextBox x:Name="T_hello" HorizontalAlignment="Left" Height="23" Margin="164,47,0,0" TextWrapping="Wrap" Text="Hello" VerticalAlignment="Top" Width="120"/>
        <Button x:Name="B_collapse" Content="Collapse" HorizontalAlignment="Left" Margin="58,83,0,0" VerticalAlignment="Top" Width="75" Click="B_collapseClick"/>
        <Button x:Name="B_hide" Content="Hide" HorizontalAlignment="Left" Margin="58,130,0,0" VerticalAlignment="Top" Width="75" Click="B_hideClick"/>

    </Grid>
</Window>
```

```MainWindow.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace _170509_t0615_visibility
{
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }

        private void B_showClick(object sender, RoutedEventArgs e)
        {
            T_hello.Visibility = System.Windows.Visibility.Visible;
        }

        private void B_collapseClick(object sender, RoutedEventArgs e)
        {
            T_hello.Visibility = System.Windows.Visibility.Collapsed;
        }

        private void B_hideClick(object sender, RoutedEventArgs e)
        {
            T_hello.Visibility = System.Windows.Visibility.Hidden;
        }
    }
}
```

collapseの状態
![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/a838f25b-a37d-f62a-b2b5-b8e9fc614e8d.png)

showした状態
![work.png](https://qiita-image-store.s3.amazonaws.com/0/32870/b1455cb6-ac3b-7e9a-84ee-337dcdf0d655.png)

### 備考

collapseとhiddenの違いは周りのコントロールの配置と関係するのかもしれない。
今後の使い方で消化予定。

Collapsed / Hidden / Visible という命名は対象性が悪い。
各种免费开源的sqlite管理工具

|sqlite管理工具  |     平台   |下载链接                                        |
|----------------|:----------------:|-----------------------------------------------------|
|sqlitestudio |支持多平台 |https://sqlitestudio.pl/index.rvt?act=download
|sqlitespy |windows |https://www.yunqa.de/delphi/products/sqlitespy/index
|sqliteadmin| windows |http://sqliteadmin.orbmu2k.de/
|sqlitebrowser| 多平台 |http://sqlitebrowser.org/

codegay 2017-4-8 19:03:58
Visual Studio / WPF > 04 复习继承和类型转换 > 継承関連

```txt:動作環境
Windows 7 Pro (32bit)
Microsoft Visual Studio 2017 Community
Sublime Text 2
```

https://www.youtube.com/watch?v=OK8sfbcNLF0&list=WL&index=31

AnimalクラスからDogクラスを継承で作る例。
senderからButtonに型変換することと関連して紹介しているようだ。

```
Animal al = new Dog();
Dog dl = al;
```

AnimalにメソッドJian()を追加した場合や、DogにメソッドBark()を追加した場合などの紹介。

暗黙の型変換など紹介しているかは不明。

[スライス問題](http://qiita.com/7of9/items/d4686403c04e5a58ff5f)については議論していなさそう。

### 中国語

复习(fùxí)
http://cjjc.weblio.jp/content/%E5%A4%8D%E4%B9%A0
> 復習する
技術英語 > Dual scan technology makes the sensor highly [immune to] EMI, RFI, ambient light, weld flash, and strobe light / weld flash / strobe light

EZ-SCREEN LS Safety Light Screen
Simple, Rugged Safety Light Curtains: LS Series
https://www.bannerengineering.com/us/en/products/machine-safety/safety-light-curtains/simple-rugged-safety-light-curtains-ls-series.html

> Dual scan technology makes the sensor highly **immune to** EMI, RFI, ambient light, **weld flash**, and **strobe light**

https://www.merriam-webster.com/dictionary/immune
> 2 :  not susceptible or responsive 

`highly immune to`を直訳すると 「の影響に対して強い免疫性を持つ」。

上記の意訳 「Dual scan technologyにより、センサーはEMI, RFI, 環境光、溶接光、ストロボ光の影響をほとんど受けない」

意訳案2「Dual scan technologyにより、センサーはEMI, RFI, 環境光、溶接光、ストロボ光に強い耐性を持つ」

<hr>
関連して思い出したのは

immune system sabotage
http://eow.alc.co.jp/search?q=immune+system+sabotage
> 免疫系機能障害
[Swift]APIで取得したJSONをswiftyJSONでパースして、天気情報をUITableViewで表示。お天気アプリを作ってみる。をSwift3 SwiftyJSONにバージョンアップ

参考サイトhttp://qiita.com/yonell/items/c5432207868fa2d5cfc9
のxcode8、swift3にて編集してみました。 
![swiftyjson001.jpg](https://qiita-image-store.s3.amazonaws.com/0/101462/7de965cb-3479-2ed6-5b18-3cdbe9344c65.jpeg)
下記サイトよりswift2対応のSwiftyJSONダウンロード
https://github.com/SwiftyJSON/SwiftyJSON/tree/swift2
json.swiftを削除SwiftyJSONをコピペするだけでOK
xcode7.3で変更後をビルド   
// APIをたたいて、配列に保存する
    // 非同期でAPIを叩いている
    func makeTableData() {
        let url = NSURL(string: self.urlString)!
        let task = NSURLSession.sharedSession().dataTaskWithURL(url, completionHandler: {data, response, error in
            // リソースの取得が終わると、ここに書いた処理が実行される
            let json = JSON(data: data!)
            // 各セルに情報を突っ込む
            for var i = 0; i < self.cellNum; i++ {
                let dt_txt = json["list"][i]["dt_txt"]
                let weatherMain = json["list"][i]["weather"][0]["main"]
                let weatherDescription = json["list"][i]["weather"][0]["description"]
                let info = "\(dt_txt), \(weatherMain), \(weatherDescription)"
                print(info)
                self.cellItems[i] = info
            }
            self.tableView.reloadData()
        })
        task.resume()
    }
さらに
https://github.com/SwiftyJSON/SwiftyJSON
より最新のSwiftyJSONダウンロード
上記コーディングを下記に変更ビルド    

func makeTableData() {
        let url = URL(string: self.urlString)!
        let task = URLSession.shared.dataTask(with: url) {(data, response, error) in
            
            if error == nil {
                do {
                    // リソースの取得が終わると、ここに書いた処理が実行される
                    let json = try JSON(data: data!)
                    // 各セルに情報を突っ込む
                    for i in 0 ..< self.cellNum {
                        let dt_txt = json["list"][i]["dt_txt"]
                        let weatherMain = json["list"][i]["weather"][0]["main"]
                        let weatherDescription = json["list"][i]["weather"][0]["description"]
                        let info = "\(dt_txt), \(weatherMain), \(weatherDescription)"
                        print(info)
                        self.cellItems[i] = info
                    }
                    self.tableView.reloadData()
                    
                } catch let jsonError {
                    //print(jsonError.localizedDescription)
                }
            }
        }
            
        task.resume()
    }
![swiftyjson002.jpg](https://qiita-image-store.s3.amazonaws.com/0/101462/a4b403d4-bed9-6008-b6ab-5687680e0380.jpeg)
初めてのheroku事始め 〜Rails編〜

# 初めてherokuにdeployする時の注意点

Railsアプリを初めてherokuにデプロイする時の注意点です。
公式のチュートリアルをやると5行ぐらいコマンドを打てば実はherokuにデプロイできちゃうという脅威の簡単さで、Elastic Beanstalk大好きな私もびっくりしましたが、そのままでは動かなかったのでその足跡を記録に残しておきます。

## 1. herokuではsqlite3をカバーしていない
RailsのデフォルトのDB設定はsqlite3なのでDB設定を初期値のままデプロイすると、sqlite3がインストール出来なくて落ちます。
ですから、Gemfileを


``` 
  gem 'sqlite3', group: :development
  gem 'pg', group: :production
```


のように書き換え本番はpgを使うように変更します。

``` database.yml
  adapter: pg
  database: db/production.pg
```

もpgに変更して下さい。

## 2.データベースのmigrationを実行


```
$ heroku create （Herokuアプリケーション名）
```

```
$ git push heroku master
```

とコンソールに打ち込めばRailsがdeployされ

```
$ heroku open
```
コマンドでherokuにデプロイされたRailsアプリケーションにアクセスできます。
ただ、実はデータベースのマイグレーションは自動でやってくれないので、このままだとアクセスエラーで落ちてしまいます。

```
$ heroku run rake db:migrate
```

をしてDBを構築して再度、サイトにアクセスすれば正しく動きます。
いったん、これでherokuにデプロイまでは完了ですね。
背景差分, python, mog, gmg, opencv3.1

ネットで書かれているものだとそのまま使えなかったのでちょっとだけ. 
```bgsegm```を追加しただけですが. 
mog2は何故か上手くいかなかったのでなし. 

# 環境
Python 3.5.2
opencv '3.1.0'

## check方法 (python)
```
$ python --version
Python 3.5.2 :: Anaconda 2.4.1 (x86_64)
```

## check方法 (opencv)
```
$ python
Python 3.5.2 |Anaconda 2.4.1 (x86_64)| (default, Jul  2 2016, 17:52:12) 
[GCC 4.2.1 Compatible Apple LLVM 4.2 (clang-425.0.28)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
>>> import cv2 
>>> cv2.__version__
'3.1.0'
```


# codes

```mog.py
# coding=utf-8
import cv2
cap = cv2.VideoCapture(0)
fgbg = cv2.bgsegm.createBackgroundSubtractorMOG()

while True:
    ret, src = cap.read()
    fgmask = fgbg.apply(src, learningRate=0.01)
    dst = src.copy()
    dst = cv2.bitwise_and(src, src, mask=fgmask)

    cv2.imshow('frame',dst)

    k = cv2.waitKey(30) & 0xff
    if k == 27:  # ESC key
        break
cap.release()
cv2.destroyAllWindows()
```


```gmg.py
# coding=utf-8
import cv2
cap = cv2.VideoCapture(0)
fgbg = cv2.bgsegm.createBackgroundSubtractorGMG()

while True:
    ret, src = cap.read()
    fgmask = fgbg.apply(src, learningRate=0.01)
    dst = src.copy()
    dst = cv2.bitwise_and(src, src, mask=fgmask)

    cv2.imshow('frame',dst)

    k = cv2.waitKey(30) & 0xff
    if k == 27:  # ESC key
        break
cap.release()
cv2.destroyAllWindows()
```

# results
mog
https://youtu.be/GSFa-6DObLI

gmg
https://youtu.be/Qaq1Y8w5Bjk


# refs
http://www.weed.nagoya/entry/2015/07/21/154130

http://docs.opencv.org/3.1.0/db/d5c/tutorial_py_bg_subtraction.html

http://answers.opencv.org/question/77435/cannot-find-backgroundsubtractormog-and-backgroundsubtractorgmg-in-opencv-30-with-python-27/

check opencv ver
http://qiita.com/PeaceAndHiLight/items/8372c5719ca73aa11d46