OmniAICreator/Qiita-1.07M huggingface dataset:
eclipseでVisualStudioの#regionみたいにcode foldingできました

eclipseでコーディング中コードを俯瞰したい場合はよくあると思いますが、eclipse標準機能ではVisualStudioのように細やかにcode folding（ここではエディタ上でコードの一部を折りたたむ機能のことを言います）できません。

この度、eclipseででもVisualStudioのようにcode foldingできるプラグインを見つました。

###追記(2015/5/6)

私の環境では、coffee-bytesとGradle IDE Pack(3.6.4)は相性が悪いみたいです。build.gradleを編集できません。coffee-bytesプラグインを選ぶため、*.gradleの編集はMinimalist Gradle Editorを使うことにしました。

##環境

- Windows 7 ( 64bit )
- eclipse Mars(4.5)
- coffee-bytes (バージョン不明, 2015/5/4ダウンロード版）

##エディタ画面イメージ

折りたたみ前：
![beforefolding.png](https://qiita-image-store.s3.amazonaws.com/0/72237/c79d4dd8-3f69-e937-bd65-1b35af68c845.png)

インストール後（デフォルト折りたたみ）：
![afterfolding.png](https://qiita-image-store.s3.amazonaws.com/0/72237/34d5efee-6dab-166c-8d7e-60784ac961d1.png)

###ダウンロードとインストール

プラグインはMarketPlaceやInstall New Software...メニューからインストールできないようでしたので、プラグインファイルをダウンロードして、eclipse実行ファイルのあるディレクトリ下に自分でコピーしました。

[Bartosz Kosarzycki's blog](http://kosiara87.blogspot.jp/2011/12/how-to-install-coffee-bytes-plugin-in.html)にプラグイン・ファイルへのリンクがありました。

使い方はすごく簡単ですが、最初は[How to use Coffee-Bytes code folding](http://stackoverflow.com/questions/6940199/how-to-use-coffee-bytes-code-folding)を参考にしまいた。


##参考

- [Bartosz Kosarzycki's blog](http://kosiara87.blogspot.jp/2011/12/how-to-install-coffee-bytes-plugin-in.html)
- [eclipse-folding-plugin.tar.gz](http://sites.google.com/site/bkosarzyckistorage1/eclipse-folding-plugin.tar.gz)
- [How to use Coffee-Bytes code folding](http://stackoverflow.com/questions/6940199/how-to-use-coffee-bytes-code-folding)
開発環境構築

インストール
Vagrant
https://www.vagrantup.com/
>vagrant box add CentOS7.0 https://f0fff3908f081cb6461b407be80daf97f07ac418.googledrive.com/host/0BwtuV7VyVTSkUG1PM3pCeDJ4dVE/centos7.box

Vagrant Plugin
>vagrant plugin install vagrant-vbguest

Git
https://msysgit.github.io/

>git config --global user.name "お名前"
>git config --global user.email メールアドレス


Node.js
https://nodejs.org/download/

Mongo DB
インストールする。
起動する。

Ruby
http://rubyinstaller.org/downloads/

>gem install bundler
>gem install compass

Yeoman
http://yeoman.io/
>npm install -g yo grunt-cli bower
>npm install -g generator-angular-fullstack

プロジェクト取り込み後
>npm install
>bower install
8pinoをATTiny85で置き換える


[前回詳細した回路](http://qiita.com/snumano/items/3a2b1a1968a450370cc1)をATTiny85で置き換えてみます。

# ATTiny85とは
Atmelの[8ピンDIP小型AVRマイコン](http://www.marutsu.co.jp/pc/i/40455/)で、[8pino](http://8pino.cc/)で使用されているマイコンです。

ちなみに、[Arduino UNO](https://www.switch-science.com/catalog/789/)は約3000円、そのマイコンの[ATmega328](http://www.marutsu.co.jp/pc/i/104664/)は約500円です。対して、[8pino](https://www.switch-science.com/catalog/2108/)は888円で、そのマイコンの[ATTiny85](http://www.marutsu.co.jp/pc/i/40455/)は約200円です。

ATTiny85はIOピン数が少ないですが、省電力なので、ボタン電池をくっつけて、ばらまく的な使い方ができそうです。(まだネット接続できていないので、まだ具体的な紹介ができませんが。。。)


# ATTiny85書き込み手順
下記を参考にしました。
[Programming an ATtiny w/ Arduino 1.6 (or 1.0)](http://highlowtech.org/?p=1695)

私の場合は、MacBookAirにて、Arduiono IDE1.6.xを使っていますので、上記手順に従って下記のように対応しました。

* 「ide-1.6.x.zip」をダウンロードし、解凍。
* ~/Documents/Arduino/以下に、「hardware」dirを作成
* 上記で作成した「hardware」以下に、解凍した「attiny」以下を移動。
* Arduino IDEを終了し、再度起動

上記手順を参考に、ATTiny85にスケッチを書き込みます。
スケッチ内容は[前回のもの](http://qiita.com/snumano/items/3a2b1a1968a450370cc1)をそのまま使用します。

# 結果

* 8pinoをATTiny85に置き換えて、8pinoと同様の動作を確認できました。
![attiny85.JPG](https://qiita-image-store.s3.amazonaws.com/0/4779/8ec2b074-9ece-7458-2119-2b44ce14c80e.jpeg "attiny85.JPG")

* ATTiny85への給電用に、Arduinoの3.3VとGNDを接続しています。

# まとめ

* 今回、8pinoをATTiny85に置き換え、同じ動作をすることを確認できました。
* 実は、ATTiny85に置き換えた場合、反応スピードがかなり遅くなりました、ATTiny85は内部クロック8MHzですが、ここがうまく動作していないようです(ARduinoで書き込む際、defaultの1Mhzになってるかも)。ATTiny85に書き込む際のArduinoのパラメータおよびsleepの値の見直しでなんとかできそうです。

# 参考
* [wikipedia](http://ja.wikipedia.org/wiki/Atmel_AVR)
* [8pino回路図](https://www.dropbox.com/s/4nhjsoas0obvc9k/8pinoSchematic_v11.pdf?dl=0)
Hubot の動作確認のための npm run-script 「npm run robot」のすすめ

# 問題

Hubot の動作確認をしたい。しかしコマンドを入力するのは面倒だ。

# 解決策

`npm run-script` を活用する。事前に `npm run-script` として登録しておくことで入力の手間を省くことができる。

以下に @bouzuya の `npm run robot` の登録・利用例を示す。

1\. `package.json` に `npm run-script` として Shell アダプターで動作する Hubot コマンドを `robot` という名前で登録する。

```json:package.json
{
  "scripts": {
    "robot": "HUBOT_SHELL_USER_NAME='bouzuya' hubot --adapter shell --name hubot",
  }
}
```

https://github.com/bouzuya/hubot-script-boilerplate/blob/1dd356a34e34f63cfd14ba109d523c89f3f9e3fa/package.json#L45

2\. 動作確認したい場合には `npm run robot` を実行する。

以上
recent-finder つくった


# recent-finder

recent-finder という Package を作った。

[recent-finder](https://atom.io/packages/recent-finder)

# これは何？なぜ？

Atom にはデフォルトでは '最近開いたファイル' を開く機能がついてない。 
組み込みの `fuzzy-finder:toggle-file-finder` はプロジェクト配下のファイルを開けるが、
プロジェクトをまたいで開くことは出来ない。
複数のプロジェクトを平行して作業している時、別のプロジェクトの特定の１ファイル
を参考にしたい、という状況が良くある。
そういうファイルは大体"最近開いたファイル"なので、これを気楽に開けると便利だ。

この Package(プラグイン) はプロジェクト関係なく、最近使ったファイルを開く事
が出来るようにするもの。

以下の表を見れば目的が分かりやすいかもしれない。

| コマンド     | 対象ファイル |
| :------------- | :------------- |
| `recent-finder:toggle` | プロジェクト関係なく、"最近使ったファイル" |
| `fuzzy-finder:toggle-buffer-finder` | 開いてるファイル |
| `fuzzy-finder:toggle-file-finder` | プロジェクト配下のファイル |

# 雑感

Atom の [Serialization](https://atom.io/docs/latest/behind-atom-serialization-in-atom) を使って実装してたのだが、機能自体は使えるのだが、across project でうまくいかない。
調べてみると、現状 serialization, deserialization のスコープは per-project (from: 
[Can you serialize data between program sessions?](https://discuss.atom.io/t/can-you-serialize-data-between-program-sessions/14682) )になってるようだ。

あきらめて Chromium 組み込みの `localStorage` を使った。

この Package と同じ様な目的の Package は結構あり、複数つかってみたが、以下のようないろんな理由があって自分で作った。実装は参考にさせてもらった。

- 勉強の為
- API の deprecation alert が良く出てる
- いっぱいコマンド追加したりして微妙
- デフォルト Keymap 設定されるのがそもそも嫌

FuzzyFinder を `extends` して作った。
Vagrantで公開box利用してVMを起動するメモ

Vagrantを試してみようと思っていくつかの記事を見たけど、
汎用としてはいまいちわかりづらかったので自分用にメモ。

※Windowx7/64bit環境

とりあえずインストールする。
[Vagrant](https://www.vagrantup.com/downloads.html)
[Vitrualbox](https://www.virtualbox.org/wiki/Downloads)

[公開されているbox](https://atlas.hashicorp.com/boxes/search)から欲しいものをさがす。
青字リンク部分の[boxname]でvagrantから指定する。

割と使いそうなBox
CentOS centos/7
Ubuntu ubuntu/trusty64

作業ディレクトリで、コマンドプロンプトから。

```
vagrant box add [boxname]
vagrant init [boxname]
vagrant up
```

デフォルトのネットワーク設定だけなので、WebなりにつかうPort Forwardは設定すること。
Vagrantfileに追記。
```

 config.vm.network "forwarded_port", guest: 80, host: 8080
```
ホストの8080がゲストの80へ転送されます。
設定変更後はVMを再起動すること。

```
vagrant halt
vagrant up
```


起動Log

```
D:\VagVM\lamp1>vagrant box add laravel/homestead
==> box: Loading metadata for box 'laravel/homestead'
    box: URL: https://atlas.hashicorp.com/laravel/homestead
This box can work with multiple providers! The providers that it
can work with are listed below. Please review the list and choose
the provider you will be working with.

1) virtualbox
2) vmware_desktop

Enter your choice: 1
==> box: Adding box 'laravel/homestead' (v0.2.6) for provider: virtualbox
    box: Downloading: https://atlas.hashicorp.com/laravel/boxes/homestead/versio
ns/0.2.6/providers/virtualbox.box
    box: Progress: 100% (Rate: 1353k/s, Estimated time remaining: --:--:--)
==> box: Successfully added box 'laravel/homestead' (v0.2.6) for 'virtualbox'!

D:\VagVM\lamp1>vagrant init laravel/homestead
A `Vagrantfile` has been placed in this directory. You are now
ready to `vagrant up` your first virtual environment! Please read
the comments in the Vagrantfile as well as documentation on
`vagrantup.com` for more information on using Vagrant.

D:\VagVM\lamp1>vagrant up
Bringing machine 'default' up with 'virtualbox' provider...
==> default: Importing base box 'laravel/homestead'...
==> default: Matching MAC address for NAT networking...
==> default: Checking if box 'laravel/homestead' is up to date...
==> default: Setting the name of the VM: lamp1_default_1430707456633_49658
==> default: Clearing any previously set network interfaces...
==> default: Preparing network interfaces based on configuration...
    default: Adapter 1: nat
==> default: Forwarding ports...
    default: 22 => 2222 (adapter 1)
==> default: Booting VM...
==> default: Waiting for machine to boot. This may take a few minutes...
    default: SSH address: 127.0.0.1:2222
    default: SSH username: vagrant
    default: SSH auth method: private key
    default: Warning: Connection timeout. Retrying...
    default:
    default: Vagrant insecure key detected. Vagrant will automatically replace
    default: this with a newly generated keypair for better security.
    default:
    default: Inserting generated public key within guest...
    default: Removing insecure key from the guest if its present...
    default: Key inserted! Disconnecting and reconnecting using new SSH key...
==> default: Machine booted and ready!
==> default: Checking for guest additions in VM...
==> default: Mounting shared folders...
    default: /vagrant => D:/VagVM/lamp1

D:\VagVM\lamp1>

```
ObjC to Swift : Doing some work inside setter


Objective-C

```Objective-C
@property (assign) BOOL selected;

- (void) setSelected: (BOOL) aBool
{
	_selected = aBool;
	
	self.color = _selected ? [NSColor redColor] : [NSColor blackColor];
}
```

Swift

```Swift
var selected: Bool = false
{
	didSet
	{
		self.color = selected ? NSColor.redColor() : NSColor.blackColor()
	}
}
```
Mac OS X への AWS CLI のセットアップ

AWS Command Line Interface (CLI) を Mac OS X にセットアップした時のメモ。Linuxでも同じです。

## Install

```bash
# Install
$ sudo pip install awscli

# Confirm installation
$ aws --version
aws-cli/1.7.19 Python/2.7.5 Linux/3.10.0-123.20.1.el7.x86_64
```

## Config

```bash
# Configure
$ aws configure
AWS Access Key ID [None]: <Access Key>
AWS Secret Access Key [None]: <Secret Access Key>
Default region name [None]: ap-northeast-1		# "ap-northeast-1 for Japan region"
Default output format [None]: json				# "text" or "table" or "json"
```

設定は `.asw/{config|credentials}` に保存される

```bash
$ ls -l ~/.aws/
total 16
-rw-------  1 user01  staff   49 Feb  6 22:23 config
-rw-------  1 user01  staff  116 Apr  5 17:23 credentials

$ cat ~/.aws/config
[default]
output = json
region = ap-northeast-1

$ cat .aws/credentials
[default]
aws_access_key_id = AKIAXXXXXXXXXXXXXXXXX
aws_secret_access_key = DXhqXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
```

ひとまずこんな感じで出力されればOK

```bash
$ aws ec2 describe-vpcs --output json
{
    "Vpcs": [
        {
            "VpcId": "vpc-9f1fc8fa",
            "InstanceTenancy": "default",
            "State": "available",
            "DhcpOptionsId": "dopt-c5a7bca7",
            "CidrBlock": "172.31.0.0/16",
            "IsDefault": true
        },
        {
            "VpcId": "vpc-2ce93449",
            "InstanceTenancy": "default",
            "Tags": [
                {
                    "Value": "aws_book_vpc",
                    "Key": "Name"
                }
            ],
            "State": "available",
            "DhcpOptionsId": "dopt-c5a7bca7",
            "CidrBlock": "10.0.0.0/16",
            "IsDefault": false
        }
    ]
}
```



## Upgrade

```bash
$ sudo pip install -U awscli
```


## コマンド補完の設定

コマンド補完には、aws_completer というプログラムが使える。

Mac OS Xの場合 `/usr/local/bin/aws_completer`

```bash
$ type aws_completer
aws_completer is /usr/local/bin/aws_completer
```


completeコマンドのoptionにパスを、argsにawsを指定して.bash_profileに追記。

```bash
$ echo "complete -C '/usr/local/bin/aws_completer' aws" >> $HOME/.bash_profile 
```

- [aws-cliをタブキーで補完する - Qiita](http://qiita.com/szk3/items/dfba6ec3cefdefb35060)




## リンク

- [AWS コマンドラインインターフェイス](http://aws.amazon.com/jp/cli/)
- [aws — AWS CLI 1.7.25 documentation](http://docs.aws.amazon.com/cli/latest/reference/)
- [【AWS】CLIの初期設定について（認証情報とコマンド補完） - TASK NOTES](http://www.task-notes.com/entry/20141026/1414322858)
- [Configuring the AWS Command Line Interface - AWS Command Line Interface](http://docs.aws.amazon.com/cli/latest/userguide/cli-chap-getting-started.html)
- [第1回　AWS CLIをインストール：インフラ屋のAWSはじめた日記─GUIを捨てよ｜gihyo.jp … 技術評論社](http://gihyo.jp/admin/serial/01/awscli_diary/0001)
Mac OS X のターミナルアプリで単語ごとにカーソルを移動する

Macではターミナルアプリとして主にiTerm2を使ってます。

標準では1単語カーソルを移動する操作が、bashのデフォルト設定で、
**ESC + b : 戻る**
**ESC + f : 進む**
でできるようになってますが、この操作は使いづらいので、
**option + → : 戻る**
**option + ← : 進む**
で操作できるように変更。

## iTerm2の場合

#### 1. iTerms > Preference > Keys > + でショートカットの追加  

#### 2. ショートカットキーの設定

![スクリーンショット 2015-04-29 午前0.51.36.png](https://qiita-image-store.s3.amazonaws.com/0/65167/8340f761-822c-0155-0717-2e1432dea816.png)  

上の画面で以下のように設定。

- **option + → : 戻る**
  - Keyboard Shortcut: option + →(右カーソル)を打鍵
  - Action: Send Escape Sequence
  - Esc+: f
- **option + ← : 進む**
  - Keyboard Shortcut: option + ←(左カーソル)を打鍵
  - Action: Send Escape Sequence
  - Esc+: f

#### 3. Profileに定義されている重複するショートカットを削除

Profileに定義されているショートカットと重複するので、iTerms > Preference > Profile > Profile Shortcut Keys から削除

## Tereminal.app(Mac標準)の場合

標準の状態で、option + →、option + ← 単語ごとに移動できるっぽいです。


## リンク

- [Mac のターミナルの Bash に単語単位カーソル移動のキーバインド設定をする | Idea, Design, Engineering, Architecture, etc](http://voidptr.seesaa.net/article/395408528.html)
- [Macのターミナルで単語ごとにカーソル移動をする方法 - Qiita](http://qiita.com/shoma2da/items/9d64a80ff36d0a9b6f88)
ObjC to Swift : [NSString rangeOfString:] - NSNotFound


Objective-C

```Objective-C
NSString * nsString = @"NSString type";
NSRange range = [nsString rangeOfString( @"type" )];
BOOL exist = ( range.location != NSNotFound );
```

Swift

```Swift
let swiftString = "Swift String type"
let range = swiftString.rangeOfString( "type" )
let exist = ( range != nil )
```
ObjC to Swift : [NSArray enumerateObjectsUsingBlock:]


Objective-C

```Objective-C
NSArray * array = @[ obj0, obj1, ... ];

[array enumerateObjectsUsingBlock: ^( id object,
                                      NSUInteger index,
                                      BOOL * stop )
{
	// do some stuff for each "object" at "index"
}
```

<br>

Swift 2.0 (using "object" and "index" inside the loop)

```Swift
let swiftArray: Array = [ obj0, obj1, ... ]

for ( index, object ) in swiftArray.enumerate()
{
	// do some stuff for each "object" at "index"
	// no explicit "stop" parameter ...
}
```

<br>

Swift 1.2 (using "object" and "index" inside the loop)

```Swift
let swiftArray: Array = [ obj0, obj1, ... ]

for ( index, object ) in enumerate( swiftArray )
{
	// do some stuff for each "object" at "index"
	// no explicit "stop" parameter ...
}
```

Swift (using only "object" inside the loop)

```Swift
for object in swiftArray
{
	// do some stuff for each "object"
}
```

Swift (using no object information inside the loop)


```Swift
for _ in swiftArray
{
	// do some stuff swiftArray.count times
}
```
Macでバックスラッシュを標準で


![スクリーンショット 2015-05-04 11.26.42.png](https://qiita-image-store.s3.amazonaws.com/0/36362/63f8f203-bbf7-a5c0-142c-7f2163c29eac.png "スクリーンショット 2015-05-04 11.26.42.png")


メニューバーのことえりメニュー(「A」とか「あ」のアイコン)→「環境設定を表示」→入力ソースの下に行き、"￥"キーで入力する文字をバックスラッシュに設定すればOKです。
Macのホームディレクトリ名を変更する

適当に本名からつけた名前が気に入らなかったので修正しました。メモ。

1. 管理者権限を持つ、別ユーザーを作成して、そこからログイン。
2. システム環境設定 -> ユーザーとグループ
3. 左下の鍵を解除
4. 該当のユーザー名を右クリック -> 詳細オプション
5. アカウント名とホームディレクトリを変更
6. ターミナルで `mv /Users/[oldname] /Users/[newname]`
7. うまく行ったら別ユーザーは消す

こんな感じです。なお、pyenvとかに影響はでまくるのでその辺は再インストール推奨。
pixi.js　入門メモ リサイズする

読み込んだ画像をどうやってリサイズするのか調査した際のメモです。

#コード
````showResizedImage.js
function showResizedImage(){
        var stage = new PIXI.Stage(0x000000);
        var renderer = PIXI.autoDetectRenderer(1920,1080,{antialias:true});
        $("pixitest").append(renderer.view);//JQuery

        //リサイズ用コンテナを作成
        var container = new PIXI.Container();
        //コンテナをリサイズ
        container.scale.x = container.scale.y = 0.5;         

        //画像を追加
        container.addChild(new PIXI.Sprite(PIXI.Texture.fromImage("test.png")));

        //ステージにコンテナを追加
        stage.addChild(container);

        //描画
        requestAnimationFrame(animate);

        function animate(){
            requestAnimationFrame(animate);
            renderer.render(stage);  
        }

}

````

#補足1ステージはもういらない
補足ですが、Chromeのコンソールを見てたらこんなメッセージが出てました。
![Chromeコンソール](https://qiita-image-store.s3.amazonaws.com/0/75209/c8db8547-18ae-e794-e94d-3eacc2a9187b.png)
You do not need to use a PIXI Stage any more , youcan simply render any conainer.

ステージはもういらないよといっています。
つまり、下記コードでも同じように動作します。

````showResizedImage.js
function showResizedImage(){
        var renderer = PIXI.autoDetectRenderer(1920,1080,{antialias:true});
        $("pixitest").append(renderer.view);//JQuery

        //リサイズ用コンテナを作成
        var container = new PIXI.Container();
        //コンテナをリサイズ
        container.scale.x = container.scale.y = 0.5;
        //画像を追加
        container.addChild(new PIXI.Sprite(PIXI.Texture.fromImage("test.png")));
        //描画
        requestAnimationFrame(animate);

        function animate(){
            requestAnimationFrame(animate);
            renderer.render(container);  
        }

}
````

render.renderでコンテナを直接渡しています。
これでも同じように動作します。

#補足2.読み込んだ画像サイズに合わせる
下記のようにすると可能ですが、正しい方法かわかりません。

````showResizedImage.js
        //テクスチャを作成
        var texture=PIXI.Texture.fromImage("test.png");
        texture.baseTexture.addListener("loaded",function(){
              renderer.resize(texture.width,texture.height);
        });
        container.addChild(new PIXI.Sprite(texture));
````

[参考 pixi.jsメモ テクスチャに読み込んだ画像サイズの取得](http://qiita.com/PianoScoreJP/items/ac1d7ba5af90909b05b1)
Amazon S3上の画像ファイルをGoogle cloud storageに移行する

Googleが公式に[gsutil](https://cloud.google.com/storage/docs/gsutil)というツールを公開しており、コマンドをいくつか叩くだけでデータの以降が行えます。

#### gsutilのセットアップ
1. python 2.6.xまたは2.7.xのインストール
2. [公式ページ](https://cloud.google.com/storage/docs/gsutil_install)からgsutil.tar.gzをダウンロードし、ホームディレクトリにgsutilとして解凍
3. _$HOME/gsutil_ にパスを通しておく
4. gsutilで使うプロジェクトIDの設定

```bash

 gsutil config
```

をタイプし、画面の指示に従い表示されているURLをブラウザで表示、コンソールに認証コードとプロジェクトIDを入力する

####  Amazon S3にアクセスするための認証情報を設定
ホームディレクトリ以下の.botoファイルを開き、以下の二行を編集してコメントアウト

```
aws_access_key_id = your_access_key
aws_secret_access_key = your_secret_access_key
```

#### 移行先bucketの作成

```bash

 gsutil mb gs://your_backet_name # mbはmove bucketの意味

 # ACL (Access Control List)をpublic-readに設定
 gsutil acl set public-read gs://your_backet_name
```

#### データのコピー
```bash

gsutil -m cp -R -a public-read "s3://from_bucket_name/*" gs://to_bucket_name # -mオプションを指定するとマルチスレッドでコピーする
```
pixi.jsメモ テクスチャに読み込んだ画像サイズの取得

目的：````PIXI.Texture.fromImage(url)````で画像を読み込んだ際に、rendererのサイズを画像サイズに合わせたい

ドキュメントとか見てもわからなかったので、ソースコードをから取得する方法を考えてみました。
公式な取得方法をご存知の方は教えてください。
※本記事は公式ドキュメントのソースコードを見て書いています。
公開されているドキュメントのバージョンは2.0.0となっており、最新版（投稿時のバージョン3.0.2)とは違っている可能性がありますが、正しく動作はします。

#コードの流れ
#1.PIXI.Texture.fromImage(url)を呼ぶ

````src/pixi/textures/Texture.js_238行目
PIXI.Texture.fromImage = function(imageUrl, crossorigin, scaleMode)
{
    var texture = PIXI.TextureCache[imageUrl];
 
    if(!texture)
    {
        texture = new PIXI.Texture(PIXI.BaseTexture.fromImage(imageUrl, crossorigin, scaleMode));
        PIXI.TextureCache[imageUrl] = texture;
    }
 
    return texture;
};
````
#2.PIXI.BaseTexture.fromImage(url)が呼ばれる。
ここでImageオブジェクトが作成され、BaseTextureクラスのコンストラクタに渡されます。

````src/pixi/textures/BaseTexture.js_223行目以降

PIXI.BaseTexture.fromImage = function(imageUrl, crossorigin, scaleMode)
        ///省略
        var image = new Image();//document.createElement('img');
        if (crossorigin)
        {
            image.crossOrigin = '';
        }
 
        image.src = imageUrl;
        baseTexture = new PIXI.BaseTexture(image, scaleMode);
````

#3.PIXI.BaseTexture(source,scalemode)が呼ばれる。
ここで画像の読み込み完了処理が行われます。

````src/pixi/textures/BaseTexture.js_18行目以降

PIXI.BaseTexture = function(source, scaleMode){
//略
//64行目 this.sourceにimgオブジェクトを代入しています。
/**
     * The image source that is used to create the texture.
     *
     * @property source
     * @type Image
     */
    this.source = source;
//略
//115行目。ここで画像の読み込み完了処理が行われています。ちなみに、scope=thisです。
        this.source.onload = function() {
 
            scope.hasLoaded = true;
            scope.width = scope.source.naturalWidth || scope.source.width;
            scope.height = scope.source.naturalHeight || scope.source.height;
 
            scope.dirty();
 
            // add it to somewhere...
            scope.dispatchEvent( { type: 'loaded', content: scope } );
        };
````

読み込み完了後、dispatcheEventでloadedイベントを発火しているのがわかります。
ですので、読み込み完了後の処理はこれを使えばよいと思います。
具体的には、

````loadImage.js
        //いろいろ省略・・・・・
        var texture=PIXI.Texture.fromImage("./img/sample.jpg");
        texture.baseTexture.addListener("loaded",function(){
                renderer.resize(texture.width,texture.height);
        });
````

これで画像読み込み完了後に、レンダラーのサイズを変更することができました。
補足ですが、
````var texture=PIXI.Texture.fromImage("./img/sample.jpg");
````
とすると、自動的に````PIXI.TextureCache["./img/sample.jpg"]````にもtextureがコピーされますので、読み込んだ画像名からテクスチャを取得することも可能です。
また、コードをみるとわかりますが、読み込んだ画像は
````texture.baseTexture.source````に代入されています。

[参考 本家のドキュメント](http://www.goodboydigital.com/pixijs/docs/files/src_pixi_textures_BaseTexture.js.html#l9)
今更ながらのAtomでいれているパッケージ一覧


PGもすなるAtomパッケージ晒しといふものを、SEもしてみんとてするなり。[^1]

[^1]: SE=しょぼいエンジニア。

language-*とlinter-*、autocomplete-*は多すぎるので省略してます。
あと、自分が作ったパッケージも除いてます。作者が使ってないと言うことはありません。

* Remote-FTP
* Sublime-Style-Column-Selection
* atom-beautify
* atom-charcode
* atom-color-highlight
* atom-pronama-chan
* atom-rails
* atom-terminal
* color-picker
* editorconfig
* file-icons
* git-plus
* highlight-column
* highlight-selected
* ide-haskell
* japanese-menu
* line-ending-converter
* linter
* localization
* merge-conflicts
* minimap
* pandoc
* pigments
* project-palette-finder
* rails-rspec
* regex-railroad-diagram
* sort-lines
* svg-preview
* term2
* terminal-panel
* todo-show
* trailing-spaces
* video-player
* web-view

一部無効だったり、機能が被っていたりするけど気にしちゃ駄目です。
興味がありそうなものがあれば、ぜひ試してみて下さい。
ちょっと注意事項で、atom-pronama-chanはAtomのパッケージレポジトリにpublishされていないので、[hurumeki/atom-pronama-chan](https://github.com/hurumeki/atom-pronama-chan)から入れて下さい。プロ生ちゃんを有効にして、プログラミング生放送すれば、一躍有名になれる！かもしれませんよ。[^2]

[^2]: もちろん、私が生放送するときは毎回無効にしてますよ。
EventSystem を使った Tap入力処理


1. Main Camera に Physics Raycasterコンポーネントを追加
2. 「UI」→「EventSystem」を追加
3. Tapしたときに入力を検出したい場所に Cube を配置する（形状に合わせて Cube以外のオブジェクトでもいい）
4. Cube の Box Collider の Is Trigger のチェックをつける
5. Cube の Mesh Renderer のチェックを外す（ Cube が非表示になる）
6. Cube に Add Component で Script を設定する
7. IPointerDownHandler などのインターフェイスを追加する

```cs:いろいろ試してみる
using UnityEngine;
using UnityEngine.EventSystems;

public class PlayerMoveArea : MonoBehaviour
, IDeselectHandler
, IDragHandler
, IDropHandler
, IMoveHandler
, IPointerClickHandler
, IPointerDownHandler
, IPointerEnterHandler
, IPointerExitHandler
, IPointerUpHandler
, IScrollHandler
, ISelectHandler
, IUpdateSelectedHandler
{
	public void OnPointerEnter(PointerEventData eventData) { Debug.Log ("OnPointerEnter"); }
	public void OnPointerDown(PointerEventData eventData) { Debug.Log ("OnPointerDown"); }
	public void OnDrag(PointerEventData eventData) { Debug.Log ("OnDrag"); }
	public void OnPointerUp(PointerEventData eventData) { Debug.Log ("OnPointerUp"); }
	public void OnPointerExit(PointerEventData eventData) { Debug.Log ("OnPointerExit"); }

	public void OnPointerClick(PointerEventData eventData) { Debug.Log ("OnPointerClick"); }
	public void OnScroll(PointerEventData eventData) { Debug.Log ("OnScroll"); }

	public void OnDeselect(BaseEventData eventData) { Debug.Log ("OnDeselect"); }
	public void OnDrop(PointerEventData eventData) { Debug.Log ("OnDrop"); }
	public void OnMove(AxisEventData eventData) { Debug.Log ("OnMove"); }
	public void OnSelect(BaseEventData eventData) { Debug.Log ("OnSelect"); }
	public void OnUpdateSelected(BaseEventData eventData) { Debug.Log ("OnUpdateSelected"); }
}
```
UniRxのシンプルなサンプル その7(完了の通知)

[UniRxのシンプルなサンプルの取扱説明書](http://qiita.com/Marimoiro/items/b0c66c6c22cf58bde049)
[前(購読の停止)](http://qiita.com/Marimoiro/items/819ddb3e68aab7ee3b95)
[後(ObservableWWW.Get ダウンロード)](http://qiita.com/Marimoiro/items/dbd84ed9c6d5aa129f2a)

# 完了の通知(OnCompleted) #
今回は機能というか概念の紹介
RxにはOnCompletedというもう値がプッシュされないことを示す機能があります。

例えばFirst()メソッドなんかはその典型で1回でも値が流れたらそれでもう値はプッシュされません。
こんな風にもう値がプッシュされない状態になったらそのことを通知することにしています。(OnCompletedと言います)

なんでこんなものがあるのかというと、この通知を利用するメソッドがあるからとかなわけですが、そのへんの話はおいておいて今回はOnCompletedの動作をTakeを使ってみていきます。

## 前準備 ##
いつものようにOnCompletedというGameObjectにOnCompletedSampleというスクリプトを貼り付けています。
![スクリーンショット 2015-05-04 03.51.56.png](https://qiita-image-store.s3.amazonaws.com/0/77177/0bcc2e82-dcd1-1422-2d37-b3a84d618924.png)

## 100Frame後に色が変わる ##

今回は100Frameの間は右に移動し続けて、最後に色が青に変わって停止するGameObjectを作ります。
コードはこちら

```csharp:OCompletedSample
using UnityEngine;
using System.Collections;
using UniRx;
using UniRx.Triggers;

public class OnCompletedSample : Base
{
	// Use this for initialization
	void Start () {
        gameObject.transform.position = new Vector2(0, 1f);


        //100Frameだけ右に行くそれが終わったらもうプッシュされる値がないのでOnCompleteに行って青くなる
        this.UpdateAsObservable()
            .Take(100).Subscribe(
            _ => { Move(0.01f, 0); }, //プッシュされた時は右へ移動
            //全て終わったら色を青に
           () => { GetComponent<SpriteRenderer>().color = Color.blue; });

    }
	
}

```
Take(100)で最初の100回だけ右に移動させているのは[UniRxのシンプルなサンプル その3(FirstとTake)](http://qiita.com/Marimoiro/items/b24510b0ffd273f69f8a)と変わりません。

変わっているのはSubscribeに第二引数が追加されています。実はSubscribeにはいくつかのオーバーロードがあります。その内の一つの以下のオーバーロードを使っています。
Subscribe<T>(Action<T> onNext, Action onCompleted)
onNextは今までのやって欲しい処理と言っていた部分なので問題ないのです。

今回の主役は第二引数のonCompletedの方です。
これはもう値が来ないよという完了通知が来たら実行されます。
(内部的な話をするとこのonCompletedの呼び出しこそが完了通知そのものです。)

Take(100)は100回値がプッシュされたらもう値をプッシュすることがないので完了通知(OnCompleted)を発行します。
その完了通知をうけて今回はSpriteRendererの色を青にしています。
(ちなみに色を100Frame後に青くしたいだけならObservable.Timerおすすめです。)

## 実行結果 ##
というわけで100Frame後に青くなるGameObjectの完成です。
![スクリーンショット 2015-05-04 04.21.30.png](https://qiita-image-store.s3.amazonaws.com/0/77177/b34f6374-e962-ea71-d258-6a3d41a8c683.png)

## 完了通知の来ないメソッド ##

完了通知の来ないメソッドもあります。
例えばthis.UpdateAsObservable()はその典型です。
何故ならば、アップデートはGameObjectが生きている間起こるので原理的に終わりはありません。
Skipもそうです。あるタイミングから素通しするようになるのでその後の終わりはありません。

ただし、こいつらの前後に完了通知の来るようなメソッドを挟んでやるとOnCompletedを発行できるようになります。
今回のTakeはまさにそれで100回の後は何が何でもプッシュしないのでこれは終わりを通知できます。
前回のTakeUntilDestroyも同様にOnCompletedの発行をもって削除します。


## その他OnCompletedの話 ##
Firstは一度もonNextが呼ばれずにonCompleteが発行されると例外を起こします。
FirstOrDefaultは同様の場合一度だけデフォルト値をプッシュしてonCompletedを発行します。
この辺りはIEnumerableと同様の動きをします。

SingleなんかもそうでSingleはonCompletedが発行されるまで値をキャッシュします。
もう一度onNextが発行された場合、それは例外になりプッシュしてはいけないためです。
しかし使い道とかあるんだろうか…？
AWSと自宅をVPNで接続した際のメモ2

自宅側のActiveDirectoryとAWS側のWebサーバを連動させてみる。
ADとwebの連動とその際に設定した内容について記載。

#環境

自宅側
ADサーバのIP：192.168.1.9

AWS側
WebサーバのIP：10.0.1.7

#ADの設定
下図の様に、ユーザを作っておく。
![スクリーンショット 2015-04-30 22.52.41.png](https://qiita-image-store.s3.amazonaws.com/0/64421/51c6b856-0aec-473e-4677-6b5f232f1d18.png "スクリーンショット 2015-04-30 22.52.41.png")


#Webサーバの設定

##Security Group
下図の通り、SSHとHTTPを設定する。
ICMPは疎通確認のpingを通す為の設定なので、消しても良い。
![スクリーンショット 2015-05-04 3.54.17.png](https://qiita-image-store.s3.amazonaws.com/0/64421/12c3765b-5153-4a63-ff8c-8904fb2ca795.png "スクリーンショット 2015-05-04 3.54.17.png")

##httpdインストール

インストール前に、一時的にVPN側でnatを設定し、Webサーバが外部に出れるようにする。

```@VPNサーバ
$ configure
# set nat source rule 1 source address 10.0.1.0/24
# set nat source rule 1 translation address masquerade
# set nat source rule 1 outbound-interface eth0
# commit
# save
```

```@Webサーバ
sudo yum -y install httpd
```

インストールが終わったらNATは解除する。

```@VPNサーバ
$ configure
# delete nat
# commit
# save
```

##ADとの連動設定や動作確認ページの作成

```/etc/httpd/conf/httpd.conf
<Directory "/var/www/html">
    AllowOverride All
</Directory>
```

```/var/www/html/index.html
test fo private web
```

```/var/www/html/.htaccess
AuthType Basic
AuthName "ActiveDirectory Auth"
AuthBasicProvider ldap
AuthLDAPURL "ldap://192.168.1.9/DC=sample,DC=local?sAMAccountName?sub?(objectClass=*)"
AuthLDAPBindDN "sample\administrator"
AuthLDAPBindPassword "XXXXXXXX"
AuthzLDAPAuthoritative Off
require valid-user
```


##動作確認

###サーバにアクセスするとベーシック認証のダイアログが出る。
![スクリーンショット 2015-04-30 22.46.39.png](https://qiita-image-store.s3.amazonaws.com/0/64421/e253343a-ca8b-4efb-b66c-efa812e55104.png "スクリーンショット 2015-04-30 22.46.39.png")

###適当なIDを入れると。。。
![スクリーンショット 2015-04-30 22.47.05.png](https://qiita-image-store.s3.amazonaws.com/0/64421/abde42b2-529f-c5dd-57bd-c8cd1b5b8d4f.png "スクリーンショット 2015-04-30 22.47.05.png")
![スクリーンショット 2015-04-30 22.48.11.png](https://qiita-image-store.s3.amazonaws.com/0/64421/0c35b64c-57dc-01a7-ce7d-65b98a1aa6d5.png "スクリーンショット 2015-04-30 22.48.11.png")
###弾かれた。


###然るべきIDを入れると
![スクリーンショット 2015-04-30 22.47.28.png](https://qiita-image-store.s3.amazonaws.com/0/64421/59c8242d-8815-900f-f2cd-854040beab71.png "スクリーンショット 2015-04-30 22.47.28.png")
![スクリーンショット 2015-04-30 22.47.38.png](https://qiita-image-store.s3.amazonaws.com/0/64421/7369ffec-1841-83f2-631d-fbd9fe1e580d.png "スクリーンショット 2015-04-30 22.47.38.png")
###ページが表示された。
aws::lambdaでアップロード通知

lambdaが楽しいらしい。
とりあえず動かしてみた。（2015/05/04 00:00ごろ）

# 目標
S3の特定のバケットにファイルがアップロードされたらメールでダウンロードリンクを通知する。

# 準備
* Lambdaが使えるリージョンでバケットを作成
* Amazon SNSでTopicを作成
* 作ったTopicに対してSubscriptionをemailで作成

# やったこと
Lambdaで新しいfunctionを作成。

Code entry typeを inline
CodeTemplate を"S3 Get Object"
ロールはBasicExecutionRoleで動作した。（他のサービスへの許可いらないのかなーなどと思ったけど放置）

他はデフォルト値。


zipにしてライブラリなどごとごそっとあげてもいいようだけど、今回はやらない。

#できたもの

上記の"S3 Get Object"のテンプレートから sns系の処理を書き足して、if文の書きっぷりをちょっと修正したのが以下。

```
var aws = require('aws-sdk');
var s3 = new aws.S3({apiVersion: '2006-03-01'});
var sns = new aws.SNS({apiVersion: '2010-03-31'});
var snsParams = {
  Message: 'modify by code...',
  Subject: 'upload notice',
  TopicArn: 'arn:aws:sns:us-east-1:123456789012:uploaded'
};

exports.handler = function(event, context) {
    console.log('Received event:', JSON.stringify(event, null, 2));
    // Get the object from the event and show its content type
    var bucket = event.Records[0].s3.bucket.name;
    var key = event.Records[0].s3.object.key;
    s3.getObject({Bucket: bucket, Key: key}, function(err, data) {
        if (err) {
            console.log("Error getting object " + key + " from bucket " + bucket +
                ". Make sure they exist and your bucket is in the same region as this function.");
            context.fail('Error', "Error getting file: " + err);
        }
        var downloadLink = 'https://s3.amazonaws.com/' + bucket + '/' + key;
        var message = 'download link is ' + downloadLink;
        // snsで通知するメッセージにダウンロードリンクを設定。
        snsParams.Message = message;
        sns.publish(snsParams, function() {
            context.succeed("success");
        });
    });
};
```
[AWSのドキュメント](http://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/SNS.html#publish-property) によるとsns.publishのcallbackは2つ引数をとる気がするんだけど、なぜか動かないので今の形にしている。

# バケットとLambdaの紐付け
S3の管理画面、イベントから設定。
ObjectCreatedに対してLambdaを設定する。
※Lambda非対応のリージョンのバケットでは選択肢にLambdaが現れない。

# 届いたメッセージ
upload noticeっていうタイトルの、
download link is https://example.com/hogehoge という本文と
AWSで勝手に付けてるフッタのようなものがついたメッセージが届き無事に動作。

# 感想
今回はS3に新しいファイルが生まれたところを基点でやってみましたが、[最近のアップデート](http://www.slideshare.net/keisuke69/aws-lambda-update)で同期呼び出しなども可能になったようで使いどころを考えるのが面白い感じになってますね。
iPadではvideoタグの利用にcontrolが必須？

HTML5では、mp4などのビデオファイルを再生するとき、次のvideoタグが利用できます。

```html:再生用HTML
<video id="movie">
  <source src="動画ファイル">
  このブラウザでは動画を再生できません。
</video>
```

このままの表記で、Javascriptなどから、```$("#movie")[0].play();```とすると、どうがを再生できます(iOSで動画を自動再生させる場合は、[ひと工夫](http://stackoverflow.com/questions/3009888/autoplay-audio-files-on-an-ipad-with-html5)必要です。今のiOSでもこのままの記載で大丈夫なのかどうかは不明(効いてるような気もするし、効いてないような気もする挙動))。

ただし、iOSではどうもこのコントロールが画面に表示されない模様。なぜだろうと思うと、controlの指定が必須（？）みたい。

```html:再生用HTML
<video id="movie" controls="controls">
  <source src="動画ファイル">
  このブラウザでは動画を再生できません。
</video>
```

ついでに、iOSでvideoタグが表示されてから、実際に再生するまでの間に表示させる画像は、videoタグのposter属性で指定可能です。

```html:再生用HTML
<video id="movie" controls="controls" poster="画像ファイル">
  <source src="動画ファイル">
  このブラウザでは動画を再生できません。
</video>
```

面倒なので、↓のような真っ黒画像をあらかじめ作っておくと、色々なところに使い回せて便利です。
![blank.png](https://qiita-image-store.s3.amazonaws.com/0/14499/28152929-621d-4ce1-bc4f-a841b689dcf9.png)
Hadoop(2.7.0) + Tez(0.5.3) + Hive(0.14.0) 擬似分散モードで動かす

マニュアルを読み進めながらで動かすことができる。
ただ、躓いた箇所がいくつかあったため記載。

## 環境
- OS : OS X Yosemite 10.10.2

## 前提
- Javaがインストールされていること。

今回はJava8(update 40)を使用。

```bash
$ java -version
java version "1.8.0_40"
Java(TM) SE Runtime Environment (build 1.8.0_40-b27)
Java HotSpot(TM) 64-Bit Server VM (build 25.40-b25, mixed mode)
```

## Hadoop 2.7.0

http://hadoop.apache.org/docs/current/hadoop-project-dist/hadoop-common/SingleCluster.html

- インストール先 : /usr/local/

- 環境変数

```bash:.bashrc
# hadoop
export HADOOP_HOME=/usr/local/hadoop-2.7.0
export HADOOP_PATH=$HADOOP_HOME/bin
export PATH="$PATH:$HADOOP_PATH"
```

- ページに載っているもの以外の例を試す

```
$ bin/hadoop jar share/hadoop/mapreduce/hadoop-mapreduce-examples-2.7.0.jar pi 10 100
```

こちらの方がmap数や精度を変更できるので分かりやすい。（input, outputの準備も必要ないし）

- sbin/start-all.shは非推奨

```
$ sbin/start-all.sh
This script is Deprecated. Instead use start-dfs.sh and start-yarn.sh
```

警告文通り、代わりに start-dfs.sh, start-yarn.sh の2つを起動させるようにする。


## Tez
http://tez.apache.org/install.html

- インストール先 : /usr/local

- pom.xmlを編集したあとにmvn clean packageを打つ
  - hadoopのバージョンを確認 -> 2.7.0へ

```xml:pom.xml
  <properties>
    <maven.test.redirectTestOutputToFile>true</maven.test.redirectTestOutputToFile>
    <clover.license>${user.home}/clover.license</clover.license>
    <hadoop.version>2.7.0</hadoop.version>
    <jetty.version>7.6.10.v20130312</jetty.version>
```

- デフォルトのtez-site.xmlが無いのでfindで探して最初に出てきたものをコピーして使用。

```
$ find . -name tez-site.xml
./tez-api/src/test/resources/tez-site.xml
./tez-api/target/test-classes/tez-site.xml
./tez-runtime-library/src/test/resources/tez-site.xml
./tez-runtime-library/target/test-classes/tez-site.xml
```

- 環境変数

```bash:.bashrc
# tez
export TEZ_CONF_DIR=/usr/local/tez-0.5.3/conf
export TEZ_JARS=/usr/local/tez-0.5.3/jars
export HADOOP_CLASSPATH=${HADOOP_CLASSPATH}:${TEZ_CONF_DIR}:${TEZ_JARS}/*:${TEZ_JARS}/lib/*
```

conf, jarsは事前にmkdirで作成。

それぞれの中身。

```
$ ls conf/
tez-site.xml
$ ls jars/
lib                                      tez-mbeans-resource-calculator-0.5.3.jar
tez-api-0.5.3.jar                        tez-runtime-internals-0.5.3.jar
tez-common-0.5.3.jar                     tez-runtime-library-0.5.3.jar
tez-dag-0.5.3.jar                        tez-tests-0.5.3.jar
tez-examples-0.5.3.jar                   tez-yarn-timeline-history-0.5.3.jar
tez-mapreduce-0.5.3.jar
```
confの中身はtez-site.xml（前述のとおりコピーしてきたもの）。

jarsの中身はマニュアル内のコマンド```tar -xvzf tez-dist/target/tez-x.y.z-minimal.tar.gz -C $TEZ_JARS```の際に格納される。

- MapReduceかTezで動いているかの確認

ここで見れる。http://localhost:8088/cluster

編集箇所。「yarn」「yarn-tez」で切り替えられる。

```xml:/usr/local/hadoop-2.7.0/etc/hadoop/mapred-site.xml
<property>
  <name>mapreduce.framework.name</name>
  <value>yarn-tez</value>
</property>
```

## Hive
- インストール先 : /usr/local

- 環境変数

```bash:.bashrc
# hive
export HIVE_HOME=/usr/local/hive-0.14.0
export PATH="$PATH:${HIVE_HOME}/bin"
```

hiveは特に設定することなく、パスを通すだけで動いた。
OctaveをMac OS X Yosemiteへインストール

はじめに
==========
Qiita初投稿です。最近、[Courseraの機械学習のサイト]を復習する機会があったので、1週間前に買ったMacBook ProにOctaveを入れてみました。(Mac超初心者)

Macの環境
==========
* MacOS X 10.10 Yosemite
* homebrew, Xcode, Xcode Command Line Tools, Java8は入っているけど、ほぼまっさらな状態

準備
==========
基本的には[ここのサイト]の手順に従って、必要なパッケージを入れます。

Octaveのインストール
==========
先程のサイトの**"After dependencies"**の項目の最後、octaveのインストールで、以下のようなエラーが出ます。

```bash

$ brew install octave
Error: No available formula for octave 
Searching formulae...
Searching taps...
homebrew/science/octave	    Caskroom/cask/octave	Caskroom/cask/octave

```

この場合、以下をtapしてください。

```bash

$ brew tap homebrew/science
==> Tapping Homebrew/science
Cloning into '/usr/local/Library/Taps/homebrew/homebrew-science'...
remote: Counting objects: 10385, done.
remote: Compressing objects: 100% (10/10), done.
remote: Total 10385 (delta 4), reused 0 (delta 0), pack-reused 10375
Receiving objects: 100% (10385/10385), 2.78 MiB | 1.29 MiB/s, done.
Resolving deltas: 100% (5798/5798), done.
Checking connectivity... done.
Tapped 488 formulae (514 files, 5.3M)

```

これでhomebrew/scienceがインストールできたので、その後に改めてoctaveをインストールします。インストールには少し時間がかかります。

```bash

$ brew install octave

```

最後に、octaveを起動します。

```bash

$ octave
No Java runtime present, requesting install.

```

Javaが無いよ。インストールするように怒られてしまいました。Java8は入っていても、Java6のインストールが必要のようです。
[ここ]からダウンロードしてインストール後、改めてOctaveを起動すると、

```bash
$ octave
GNU Octave, version 3.8.2
Copyright (C) 2014 John W. Eaton and others.
This is free software; see the source code for copying conditions.
There is ABSOLUTELY NO WARRANTY; not even for MERCHANTABILITY or
FITNESS FOR A PARTICULAR PURPOSE.  For details, type 'warranty'.

Octave was configured for "x86_64-apple-darwin14.1.0".

Additional information about Octave is available at http://www.octave.org.

Please contribute if you find this software useful.
For more information, visit http://www.octave.org/get-involved.html

Read http://www.octave.org/bugs.html to learn how to submit bug reports.
For information about changes from previous versions, type 'news'.

octave:1>

```

特に警告もなく、無事起動できました！
一応、動作確認しておきます。

``` bash
octave:1> w = 10 + sqrt(10)*(randn(1,10000));
octave:2> hist(w)
```

![スクリーンショット 2015-05-04 0.43.20.png](https://qiita-image-store.s3.amazonaws.com/0/60470/5a5518f5-21a0-8838-40f8-7d6522b4fd02.png)


[Courseraの機械学習のサイト]: https://www.coursera.org/course/ml
[ここのサイト]: https://kiskeyix.org/articles/605
[ここ]: https://support.apple.com/kb/DL1572?locale=ja_JP
Go言語: マップのキーが存在するかチェックしたい

Go言語でマップにキーが定義されているのかを調べる方法です。マップのキーを参照すると、値と存在有無のbool値が戻り値になります。このbool値を確認することで、キーの有無が分かります。

```go
package main

import "fmt"

func main() {
	dict := map[string]int{
		"foo": 1,
	}

	if val, ok := dict["foo"]; ok {
		fmt.Printf("foo exists. The value is %#v", val)
	}
}

```

[このコードを実行してみる](http://play.golang.org/p/YtySs_MYXV)
React超入門。propsとstateの動きを理解するコード

こちら6年前の記事です(現在2020/4/30)。今ならもうちょっと説明できるので興味ある方はこちらをご覧ください。

[【Reactのstateとpropsの違いが知りたい！(変更・更新の仕方等DEMOあり)】過去のReact初心者の自分にpropsとstateの違いを説明する](https://kenjimorita.jp/imadakarawakattareact/)


以降は当時の記事

--------------
GWにReactを完全に理解して、目標を掲げ２日目ですが、
React。
まだ仲良くなれない。。
どうも参考文献が難しい。。簡単に教えて欲しいなあという思いがありました。

とくに肝のpropsとstate
どの文献も同じ事言っているからもうちょっと違う角度で教えて欲しいなあと


一応おライリーのReactの本とか、
![2015-05-03 23.55.54.jpg](https://qiita-image-store.s3.amazonaws.com/0/64377/bd3a7054-30a8-21f1-44a1-441ddbf05558.jpeg)


ここに書いてあるReact入門だったり、本家英語のチュートリアルだったり調べて、写経してのですが、
どうも難しいなあと、
役割はわかったし、理屈は分かるんだけど、やっぱちょっと難しいことやってない？？って思っちゃって、
一番わかりやすい動きする部品はないものかとおもっていました。


で、
これが一番わかりやすかったので共有です。


```html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>react0502</title>
<!-- 	// <script src="build/react.js"></script>
// <script src="build/JSXTransformer.js"></script>
 -->

</head>
<body>
	<div id="content"></div>
	<script src="src/js/react.js"></script>
	<script src="src/js/app.js"></script>

</body>
</html>
```
htmlは共通です。
### props
```javascript

var Hello = React.createClass({
	render(){
		return (
			<div>Hello!{this.props.name}</div>
		);
	}
});

React.render(
	<Hello name="moritakenji" />,document.getElementById('content')

)

```
propsを渡す

```javascript
var Hello = React.createClass({
	render(){
		return (
			<div>myMovieTime!{this.props.fafa}</div>
		);
	}
});
var sub = [{title:'reon',time:'120'}];
React.render(
	<Hello fafa={sub[0].time} />,document.getElementById('content')

)
```


### stateとsetState
ルール
 - render()内では値を直接代入してはいけない。
 - 変える際はsetState()内で変える

```javascript
var Hello = React.createClass({
	getInitialState(){
		return{
			name:'morita'
		};
	},
	onClick(){
		this.setState({
			name:this.state.name + '!'
		});
	},
	render(){
		return (
			<div>
			<h1>Hello!{this.state.name}</h1>
				<button onClick={this.onClick}>click</button>
			</div>
		);
	}
});

React.render(
	<Hello name="moritakenji" />,document.getElementById('content')

)

```
setPropsでコンポーネントのオブジェクトとして

```javascript
var Hello = React.createClass({
	render(){
		return (
			<div>myMovieTime!{this.props.title}</div>
		);
	}
});
var re = React.render(
	<Hello />,document.getElementById('content')
)
re.setProps({title:'reon',time:'120'});
```
1000円以下でArduinoを自作する。


Arduinoが簡単に自作できるので、その手順のメモ

## はじめに

```資材
 ATMEGA328P
 抵抗 1KΩ
 コンデンサ 22pF x2
 水晶発振子 16MHz
 ジャンパワイヤ
 ブレッドボード
 書き込み用のArduino
```

書き込み用のArduinoを除いて全部買っても、秋葉原で５００円程度で手に入ります。

![IMG_0616.JPG](https://qiita-image-store.s3.amazonaws.com/0/52867/3d090c62-77f1-4c86-8877-907c1fa87ea7.jpeg "IMG_0616.JPG")

## 配線の準備

以下のサイトにある通りに配線
http://www.arduino.cc/en/Tutorial/ArduinoToBreadboard

![BreadboardAVR.png](https://qiita-image-store.s3.amazonaws.com/0/52867/4f499409-eb8a-44ce-960c-07df543f5f31.png "BreadboardAVR.png")


実際に配線したところ
![IMG_0630.JPG](https://qiita-image-store.s3.amazonaws.com/0/52867/1a2805e6-486e-bcdc-045a-641a4bed8017.jpeg "IMG_0630.JPG")

## ブートローダの書き込み
まず、ブレッドボードの5vを外して、設定します。

[ここ](http://forum.arduino.cc/index.php/topic,28733.0.html)の書き込みにある、Optifix.zipをダウンロードします。

ダウンロードしたファイルを解凍して、optiLoader.hのヘッダファイルを開き、

```
#include ＜WProgram.h＞　を　#include ＜Arduino.h＞　に変更します。
```
そしてコンパイルして書き込み用のUnoにアップロードします。

次にSerial Monitorを起動して「19200　baud」を選択します。

以下のように表示されます。
![Screen Shot 2015-05-03 at 04.46.45.png](https://qiita-image-store.s3.amazonaws.com/0/52867/49e071b2-8108-454a-741b-4fe03b2d7a9e.png "Screen Shot 2015-05-03 at 04.46.45.png")

表示されたら、ブレッドボードに5Vを差し込んで「G」をシリアル経由でSendします。
![Screen Shot 2015-05-03 at 05.10.40.png](https://qiita-image-store.s3.amazonaws.com/0/52867/5fa2a7a8-2710-77ab-f9a5-aa0e13e484b9.png "Screen Shot 2015-05-03 at 05.10.40.png")

これだけで、ブートローダの書き込みは完了です。

あとは、Arduino差し込むか、UART経由でスケッチをアップロードすれば、Arduinoとして利用可能です。

## ブートローダ書き込み用基盤
ブレッドボードだけでやってると、ピン欠け等が発生しやすくなるので、書き込み用の基盤を作成しようと思います。

【作成中の基盤】
![IMG_0631.JPG](https://qiita-image-store.s3.amazonaws.com/0/52867/9f0f25c4-fa0e-27aa-f7b5-737843e60c66.jpeg "IMG_0631.JPG")
Pepper君の関節温度をモニターする Webアプリ「drpepper」を作ってみた


## はじめに

* Pepper君の関節の温度を定期的に取得し、頭・腰・左手・右手の 4つの分類に分けてグラフ表示する Webアプリです。
* Pepper君側でのプログラミングはありません。全て外部の Webページから QiMessaging JavaScriptでデータを取得しての処理です。
* Pepper君のオーバーヒート自己申告前に状態を把握できるのではと期待しています(いました)。
* 勉強がてらの作成というのもあるので、特に類似ツールの存在は調べていません。

## 概要

* Pepper君に接続し、3秒毎に頭(2)・腰(2)・左手(6)・右手(6)の 16箇所の温度を取得・グラフ表示します。
* 最新 10回分(30秒分)のみ表示し、それ以前のデータは捨てています。

![2015050301.png](https://qiita-image-store.s3.amazonaws.com/0/20418/74799470-fab7-59f5-104f-9ff42f83afc6.png "2015050301.png")


## 使い方

* [http://sunahub.github.io/drpepper/](http://sunahub.github.io/drpepper/) へアクセス
* 右上の入力欄から、接続する Pepper君の IPアドレスを入力
* 「Start」ボタン押下でデータ取得開始
* 「Stop」ボタン押下でデータ取得停止
* グラフ上をタップすると、その時間の値一覧が表示


![2015050302.png](https://qiita-image-store.s3.amazonaws.com/0/20418/9811c3c7-46ee-dbbc-0aeb-93dc21444ae4.png "2015050302.png")


## ソース

* https://github.com/sunahub/drpepper/tree/gh-pages


## 感想

* Pepper App Challenge 2015 に出したアプリに組み込もうと思いつつ、時間がなくて外していた機能を作ってみた感じです。
* アトリエ秋葉原に行ってからの実機での動作確認・調整なので、あまりテストしていません。
* 思ったより温度の動きがなくて面白くないです。
* アトリエ秋葉原で一人オーバーヒートさせましたが、まったく察知できませんでした。役に立たなそうです。
Windows 10 Insider Preview をUSBメモリからインストール

2015/4/29に公開されたWindows 10 Insider PreviewをUSBからインストールしたメモ。前はTechnical Previewだったけど名前が変わった。

アップグレードでもよかったんだけど、一応前のデータは念のため残しておきたいのと、今のSSD(256G)からSSD(1T)に差し替えたかったので、それに新規で入れることにした。

#手順
##ISOのダウンロード
[Windows 10 Insider Preview ISO のダウンロード](http://windows.microsoft.com/ja-jp/windows/preview-iso)
まずisoファイルをダウンロード。Windows 10 Insider Preview (x64) - ビルド 10074を選択した。

##Windows USB/DVD Donwload Toolのインストール
[Windows USB/DVD Download Tool](https://www.microsoft.com/en-us/download/windows-usb-dvd-download-tool)
ダウンロードしたisoファイルをUSBメモリに書き込むために、このツールをインストール。インストール後、USBメモリをPCにさして、ツールを起動して、説明名通りにISOファイル選択とUSBメモリ選択してしばらく待てば完了。
この作業を行うとUSBメモリがフォーマットされるので、消してはいけないファイルは別の場所に退避させておくこと。

##PCの電源を落としSSDを差し替える
Samsung SSD 840 EVO(1T)に差し替え。やっぱり256Gだと少ない。2014年9月にAmazonで47,268円で購入したやつ。

##PC起動
起動前に必要最低限の機器のみ残して。必要ないUSB機器は抜いておく。デュアルディスプレイしているなら、1台にしておいたほうがいいかも。(昔Win 8インストールするときにハマった。)
USBメモリをさして起動。
そしたらお馴染みのWindowsのセットアップ画面が開くので説明に沿って選択していけばOK。
(このときLogicoolの無線マウスが効かなくて慌てて有線のマウス引っ張り出してきた。キーボードも必要かと思ったが、ソフトウェアキーボードが実装されていたの大丈夫だった。)

ちなみにWindows 8、8.1ではユーザをMicrosofotアカウントで作成するとユーザ名がそのままユーザディレクトリになって日本語やスペースが入り残念なことになるので、最初はログインせずにユーザを作り、その後Microsoftアカウントでログインしていた。
今回も同じ方法で最初ログインせず作った。

##所感
PCスペックがある程度高ければ、待ち時間合わせても1～2時間ですむ。
Windows 10ちょっと触ってみたけど、タスクビューが地味に便利なのと、Windowsストアアプリの表示が全画面じゃなくてウィンドウで表示されるようになっていた。
Google CodeのWikiを手動でGithubのWikiにマイグレーション


2ヶ月ほど前に[2016年にGoogle Codeが閉鎖](http://www.itmedia.co.jp/news/articles/1503/13/news055.html)というニュースが流れた。
自分も[dtl](https://code.google.com/p/dtl-cpp/)というプロジェクトをGoogle Codeにホスティングしていたのでこれを機に移行することにした。

## Export to Github

Google CodeからGithubへの移行についてはGoogleが公式に提供している[エクスポートツール](https://code.google.com/export-to-github/)がある。しかし、自分のプロジェクトだと何故かうまく動かなかった。

![image](https://qiita-image-store.s3.amazonaws.com/0/1608/a5971bc2-9e74-a25e-a1db-17e0dd01ed61.png)

あれから2ヶ月が経ち、GWで時間の余裕も出来たので再度チャレンジしてみたが、やっぱり上記のエラーが表示されてしまう。

## Wikiの手動マイグレーション

一方で既にGithubに[ミラー](https://github.com/cubicdaiya/dtl)(現本家)を作っていたので、実際に移行しなければいけないのは[全5ページのWiki](https://code.google.com/p/dtl-cpp/w/list)だけだったので諦めて手動でやることにした。

Google CodeのWikiは[MoinMoin](https://moinmo.in/)のそれによく似た独自記法なのでそのままだとGithubのWikiに移行することはできないのだが、Googleが提供している[エクスポート用ツールキット](https://code.google.com/p/support-tools/)の中にMarkdownへの変換ツール(wiki2gfm.py)がある。

使い方はこんな感じ。

```console
$ git clone https://code.google.com/p/support-tools/
$ cd support-tools/wiki_to_md
$ python wiki2gfm.py --input_file ${入力ファイル名} --output_file ${出力ファイル名}
```

で、これを使って移行したWikiがこちら↓。

https://github.com/cubicdaiya/dtl/wiki#documents

# まとめ

というわけで無事Google CodeからGithubに移行することができた。[support-tools](https://code.google.com/p/support-tools/)はWikiのほかにもIssue Trackerの移行ツールも提供しているのでGoogle CodeからGithubへの自動エクスポートがうまく動かない人は試してみるとよいのではないでしょうか。

# おまけ

ちなみに[dtl](https://github.com/cubicdaiya/dtl)は7年ほど前にC++で書いたdiffのライブラリなんだけど、もう長いことC++書いてないし、別の言語(Goとか)で書き直そうかなぁ。

なお、このライブラリを書いた知見を元にしてSoftware Designに寄稿したdiffのアルゴリズムの解説記事が↓のページで読めます。

[diffの動作原理を知る～どのようにして差分を導き出すのか
](http://gihyo.jp/dev/column/01/prog/2011/diff_sd200906)
GulpによるLiveReload入門(Windows版)


社内共有用に書きました。手順の検証をしてないのでまた修正するかも
__※BrowserSyncのインストールでこける環境があるっぽいです。。。（調査中）__
↑公式ページに解決方法でていました。Windowsで発生すると
http://www.browsersync.io/docs/#windows-users (追記 2015/08/07)

Gulpを使ったLiveReload環境を構築しましょう。 
BrowserSyncというソフトを使い、ファイルを編集するたびに表示確認で開いている画面が自動更新される便利なローカルサーバーを動作させます。

詳しく言うとnpde.js上で動作するBrowserSyncというローカルサーバツールを、これまたnode.js上で動作するgulpから起動し、gulpがあなたが編集しているディレクトリ以下のファイルを常に監視し、ファイルの更新を検知したらリロードの命令をBrowserSyncに行うということをやります。
はい、頭が痛くなってきましたね。今は詳しい中身について理解しなくとも問題ありません。

## 目的
* ソース編集！ブラウザ自動リロード！サクサクコーディング！な環境を作る
* Gulpもついでにぶっこむ！気づいたらGulp入門してたジャン  

## 手順


1. node.jsインストール
1. gulpインストール
1. gulpfileの準備 
1. 実行環境(LiveReload)インストール
1. gulpの起動
1. シュパパパパパパパ

## node.jsインストール
node.jsとはサーバサイドで動作するJavaScript実行環境です。 Web制作の現場においては各種制作ツールを動作させるために使わることが多いです。


![スクリーンショット-2015-05-03-20.48.41（2）.gif](https://qiita-image-store.s3.amazonaws.com/0/73240/bc1d3a9e-1411-e29b-c1f4-0d7e1fbeb433.gif)


1. https://nodejs.org/ にアクセス

1. 「INSTALL」ボタンをクリック
2. DLしたインストーラーでnode.jsをインストール
3. 「Win + R」でファイル名を指定して実行ウィンドウを開き、「cmd」と入力してコマンドプロンプトを起動
4. 下のコマンドを入力しnode.jsがインストールされていることを確認

```
node -v
# v 0.XX.XX.XXみたいなバージョンが表示されるはず
```
※エラーがでたら、Windowsを再起動してみる

# Gulpのインストール
1. 引き続きコマンドプロンプトで下のコマンドを力のかぎり叩き込む
2. 正座して待つ
3. Welcome to underground.

```
npm install -g gulp
```
※もしかしたら管理権限が必要かも

### npmとは

node.jsに付属するパッケージ管理ツールのこと。黒い画面からnode.js上で動くツールのインストール・更新・削除が行える。ネットを駆けずり回っていろんなソフトを拾ってくるよりはるかに便利。

## gulpfileの準備

LiveReloadを行うために、gulpを通してBrowserSyncを実行する。gulpの動作を設定するにはgulpfile.jsが必要。

[livereload_template](https://github.com/8845musign/livereload_template)

Githubに準備しておいた。右にあるメニューから「Download ZIP」ボタンを押してファイルをダウンロード、解凍しておく。
解凍後は以下のようなフォルダ構成になっていることを確認。

```
livereload_template/
├── document_root
├── gulpfile.js
└── package.json
```

## LiveReloadで検証するファイルの準備

document_root以下にそのまま製作中のファイル群をぶちこむ

```
document_root/index.html
```

がサイトルートになり、一番初めに表示されます。

## 実行環境(Gulp&BrowserSync)インストール
上で落としたファイルを解凍してできたフォルダにコマンドプロンプト上で移動する。そして下のコマンドを叩いて逆立ちし、待つ。

```
cd livereload_templateのディレクトリパス
npm install
```

## gulpの起動
続けてコマンドプロンプトで下のコマンドを実行

```
cd livereload_templateのディレクトリパス
gulp
```

自動的にブラウザが立ち上がってサイトが表示されるはず。時たまエラーで動作が止まるのでそうしたら再度同じコマンドを実行する

document_root/以下のファイルを編集すると、ブラウザがリロードされることを確認する。

## シュパパパパパパ
__バリバリバリバリ r( ﾟω ﾟ )r__　（コーディングイメージ）

## こんな機能もありまっせ - 複数ブラウザでの同期

Gulpを立ち上げると

```
http://localhost:3002
```

みたいなURLに自動接続される。（後半の```3002```は動作させた状況によって```3001```とか```3003```とか変わる）

このURLは複数ブラウザからアクセス可能で、ファイルを変更した際にアクセスしている __ブラウザ全部__  がリロードされる。

また

* ページスクロール
* ページ遷移

なんかも同期される。

__えらいこっちゃ！__

説明は長いので避けるが、例えばgulpを立ち上げているPCにAndroidやiPhoneでアクセスすると同時に複数端末での検証が可能。

## そもそもなぜLiveReloadか

### 高速に失敗するワークフローを作りたい

一発でコードをかける人は稀、我々は必ず失敗する。
十分な品質のあるコードを書くのにN回失敗するとしたら。
そのN回、リライトする時間を極力少なくしたい。

コーディング →　検証

の検証工程にかかる時間を減らしたい。ブラウザのリロードを人力でやるのは回数を重ねると意外に多くの時間を使う。

### ローカルサーバを立てよう

単純な静的サイトの構築では、リモート（開発）サーバとローカルサーバでの検証に違いはない。Ajaxもローカルサーバなら動く。

リモートサーバでの検証は大きなイテレーションの区切りで行えば良い。

__その検証用ファイルアップロードに使う時間は、本当に問題を解決するための時間になっていますか？__

## 終わりに

正直、BrowserSync立ち上げるためにGulp入れる必要もあまりない気がしますが、Gulpが使えるとSassやJadeのコンパイル、コードの圧縮・結合などいろんなタスクを自動化できるようになります。Gulp入門のきっかけとしてどうぞ。

暇ができたらgulpfile.jsの中身の解説を書きます。ではではー。