OmniAICreator/Qiita-1.07M huggingface dataset:
Serverless Frameworkで既存のS3バケットにトリガーをアタッチする


Serverless Frameworkで既存のS3バケットにトリガーをアタッチしようとすると、デプロイ時に以下のようなエラーが出てしまった。

```ｓｈ
Serverless: Packaging service...
Serverless: Uploading CloudFormation file to S3...
Serverless: Uploading service .zip file to S3 (3.85 KB)...
Serverless: Updating Stack...
Serverless: Checking Stack update progress...
.........................Serverless: Deployment failed!

  Serverless Error ---------------------------------------

     An error occurred while provisioning your stack: S3BucketServerlessexample
     - mybucket already exists
     in stack arn:aws:cloudformation:us-east-1:872755943855:stack/example-dev/06bf9a10-f42b-11e6-a0f4-500c221b72d1.
```

CloudFormation側の制限により、既存のS3バケットに手を加えることができないらしい。

## 解決策

結論としては[serverless-external-s3-event](https://github.com/matt-filion/serverless-external-s3-event)というプラグインを使った。使い方はREADMEがわかりやすいので割愛する。

デプロイコマンドのあとに、`sls s3deploy`を流す必要があるので、以下のようなコマンドをまとめて実行するyarnコマンドだけ作成した。

```sh
sls deploy --stage development && sls s3deploy --stage development
```

IAM権限を絞っている場合は、以下のように該当バケットに対して権限を加える必要がある。

```json
{
    "Effect": "Allow",
    "Action": [
        "s3:Get*",
        "s3:List*",
        "s3:PutBucketNotification"
    ],
    "Resource": [
        "arn:aws:s3:::BUCKET-NAME",
        "arn:aws:s3:::BUCKET-NAME/*"
    ]
}
```

これで、既存のS3バケットにもトリガーを設置することができた。
Ionic3 のアプリ起動を高速化する

Ionic3で普通に「build」したアプリの起動時間が４〜5秒ぐらいかかる。
テンプレート「blank」とかで作った最もシンプルなものでも遅い。
最低でも3秒以下にしたいなと思って調べたら、実にカンタンに高速化できました。

# 環境

Ionic3

# 対応

ビルド時にAoTコンパイルするようにする

AoTについては、以下の資料がわかりやすい。

https://medium.com/@techfeed/angular2-aot%E3%82%B3%E3%83%B3%E3%83%91%E3%82%A4%E3%83%AB%E3%81%A7techfeed%E3%82%92%E9%AB%98%E9%80%9F%E5%8C%96%E3%81%97%E3%81%9F%E8%A9%B1-55efa68189a5

# やり方

「--prod」を付けてビルドする

```shell-session:androidアプリの場合
ionic cordova build android --release --device --prod
```

```shell-session:iosアプリの場合
ionic cordova build ios --release --device --prod
```

# 結果

（Android, iOS共に)
AoT前: 4秒　⇒　AoT後: 2秒

ざっと2倍に！ (^O^)

# 補足: AoTは使いたいが、JSのMinifyはしたくない場合

「--aot」を付ける

```shell-session
ionic emulate ios --aot
```
Bluemix で使えるComposeとはなんですか？ について調べてみた

IBMのクラウドサービスの中で、以外と知られていないオープンソースのDBaaSのサービス Compose についてのメモです。

![スクリーンショット 2017-06-30 10.41.53.png](https://qiita-image-store.s3.amazonaws.com/0/42829/693418b3-7fab-3f34-f5d4-1f17dc6a2165.png)


# IBM Compose社 とは
コンポース社は2010年創業、 ソフトウェア開発チームがデータサービスを迅速かつ容易に導入できるように、自動スケーリング、プロダクション対応のデータベースを提供しています。 コンポース社は、2015年7月現在、MongoDB、Redis、Elasticsearch、PostgreSQL、RethinkDBなどの5つの一般的なオープンソースデータベースをサポートしています。各データベースは数分でプロビジョニングされ、高可用性（HA）、フェイルオーバー、および日次バックアップが含まれます。さらに、データストア間でデータの移動と同期を継続的に行うためのトランスポーターを提供しています。サービスとしても、無料のオープンソースアプリケーションとしても利用できます。3600社を超える企業が、24時間年中無休で、本番業務で コンポース社のデータベース クラウドサービスを利用しています。 2015年に、IBMは、クラウドのデータベースサービスを拡充させるために、コンポース社を買収しました。
参考資料(1)


# 提供するサービスの概要
IBMコンポース社のプラットフォームは、本番運用に対応したデータベースのサービスです。 各データベースは、高可用性構成 と オートスケーリング が提供されます。 利用を開始すると、自動バックアップと一定のヘルスチェックを使用してデータベースを管理および保守し、そのデータベースに接続するアプリケーションの円滑な運用を保証します。データベースの管理に要する時間の短縮は、アプリケーションを開発してビジネスを成長させるために集中できることを意味します。
参考資料(2)

# IBMコンポース社が提供するデータベース・サービス
参考資料(3)によると、2017年7月現在、次のサービスが提供されています。

* [MongoDB](https://www.compose.com/mongodb) JSON形式で蓄えるNoSQL型ドキュメント指向 データベース
* [Elasticsearch](https://www.compose.com/elasticsearch) 目的のワードで全文検索エンジン
* [RethinkDB](https://www.compose.com/rethinkdb) 分散型データベース（RethinkDB社倒産)
* [Redis](https://www.compose.com/redis) インメモリNoSQLデータベース KVS
* [PostgreSQL](https://www.compose.com/postgresql) RBMS
* [etcd](https://www.compose.com/etcd) Beta 分散KVSで、クラスタのマシンでデータを共有
* [RabbitMQ](https://www.compose.com/rabbitmq) AMQPを使用したメッセージング
* [ScyllaDB](https://www.compose.com/scylladb) Beta Cassandraの互換性を持つKVS
* [MySQL](https://www.compose.com/mysql) Beta RDBMS
* [JanusGraph](https://www.compose.com/janusgraph) Beta グラフデータベース

Bluemix のカタログ以外に、IBMコンポース社 [フリートライアル](https://www.compose.com/signup) のページから試してみることができます。

# Bluemix のカタログから利用できるサービス
参考資料(4)のスクリーンショットでは、前述の全てのサービスが利用できる様です。

![スクリーンショット 2017-06-30 9.48.00.png](https://qiita-image-store.s3.amazonaws.com/0/42829/6966607d-9a12-933e-6e56-680652f2e13e.png)

# IBMコンポースに関する日本語の情報源
* [オープンソースDBのクラウドサービス「IBM Compose」よくある質問](https://www.ibm.com/developerworks/jp/analytics/library/ba-compose-faq/index.html) 参考資料(5)
* [IBM Compose](https://www.ibm.com/analytics/jp/ja/technology/cloud-data-services/compose/) 参考資料(6)
* [テクニカルホワイトペーパー](https://public.dhe.ibm.com/common/ssi/ecm/cd/ja/cdw12353jpja/CDW12353JPJA.PDF) 参考資料(7)






# 参考資料
(1) IBM Acquires Compose to Expand Cloud Data Services (23 Jul 2015), IBM New room http://www-03.ibm.com/press/us/en/pressrelease/47363.wss
(2) Getting Started with Compose https://help.compose.com/docs/getting-started
(3) IBM Compose ホームページ https://www.compose.com/
(4) IBM Bluemix カタログ https://console.bluemix.net/catalog/?env_id=ibm:yp:us-south&category=data
(5) IBM DeveloperWorks オープンソースDBのクラウドサービス「IBM Compose」 よくある質問 https://www.ibm.com/developerworks/jp/analytics/library/ba-compose-faq/index.html
(6) IBM Compose https://www.ibm.com/analytics/jp/ja/technology/cloud-data-services/compose/
(7) テクニカルホワイトペーパー https://public.dhe.ibm.com/common/ssi/ecm/cd/ja/cdw12353jpja/CD
ATOMでtwigファイルを見やすくする方法

#Twigファイルがとにかく見づらい
PHPを勉強しはじめてSymfonyを使うようになり、テンプレートエンジンがTwigになった。ATOMでファイルを開くと、文字が全て白色になってめちゃくちゃ見づらかったので変更することにした。そしてSymfonyがマイナーなのか全然日本語文献に出会わない。（悲しい）

#PHP-twig for atom
twig用のパッケージをインストールする。
[PHP-twig for atom](https://atom.io/packages/php-twig)

環境設定(Settings)を開いてinstallでtwigを検索する。

![スクリーンショット 2017-06-30 10.35.12.png](https://qiita-image-store.s3.amazonaws.com/0/167850/850eedd7-bf22-bbc5-8811-6291d3af69e4.png)

インストール後に適当なtwigファイルを開いてみると色が付いてくれている！！！感動！！！見やすい。

![スクリーンショット 2017-06-30 10.36.03.png](https://qiita-image-store.s3.amazonaws.com/0/167850/79efa4cb-e630-9540-26a6-130a7af12587.png)

#参考サイト
[PHP-twig for atom](https://atom.io/packages/php-twig)
[How do I make a default syntax by filetype in Atom text editor?](https://stackoverflow.com/questions/22363070/how-do-i-make-a-default-syntax-by-filetype-in-atom-text-editor/32508353#32508353)
[xgboostエラー]Cannot find XGBoost Libarary in the candicate path, did you install compilers and run build.sh in root path


初めpipするとエラーになってて、makeしろとか書いてたけどmakeしたくないなーって思って調べた。
結論gccを新しいのを入れたらpip通りました。

```
brew install gcc@5
pip install xgboost
```

#参考
https://github.com/dmlc/xgboost/issues/1501
Akka Streams について

# 背景

この記事では、ストリーム処理に関する内容をまとめています。

# そもそもストリーム処理はどういう用途で使用されているの?

1. 無限に発生し続けるデータを処理する場合

2. 処理が永続的に継続する場合


例えば、Beaconなどから検知して送られてくる位置情報のストリームデータがあれば、仮に対象範囲外の位置データは必要とせず、処理しないとする場合に、必要なデータのみを保管し、それ以外のデータは価値がないのでフィルタリングするケースがあると思います。そのような時に、無限かつ流動的に発生するデータをリアルタイムで処理する為にストリーム処理を使用します。

# 課題を解決するために

## Akka Actor

リアルタイムの処理をするための一つの解決策として、Akka Actorが挙げられます。
(Akka Actorに関しては、次回の記事で詳細にまとめていきます。)

## What is Akka Actor 

アクターと呼ばれるメッセージの送受信出来るオブジェクトが、非同期でお互いにやりとりするという仕組みです。しかし、Actor間のメッセージングを安定して実現する事は難しいです。

その一つの要因として

1. Publisher側の処理が早く完了する場合に、Subscriber側のバッファーが溢れてしまう。

2. Subscriberに対して、Publisher側の処理を抑えた場合は、その分だけ無駄になる

## Akka Stream

そこで、Akka Streamを提案します。主な理由としては、

1. Back Pressureによりバッファ溢れせず、性能を最大限まで引き出す事ができる。
2. 構成要素のInput/Outputに型がついている
3. マイクロサービス化の実現

# Back Pressureとは

Subscriberが自分が処理できる量をPublisherにリクエストを送ることで、無駄なくSubscriberが処理できる量を処理する仕組み。

Subscriberが自分が処理できる量をPublishserに伝え、PublisherはSubscriberから伝えられた情報に合わせて、適切な量のメッセージをSubscriber側に送り、これによってSubscriberを溢れさせず、Subscriberのリソースを最大限に使って動作させることが可能となります。
BackPressure自体はakka-streamが勝手に裏側で制御してくれているので、特に制御について意識する必要はないです。

# 実際にakka streamsを実装してみた

## Source
データの出力を行う。アウトプットチャンネルをひとつだけ持つ。(Publisher)

## Flow
インプットとアウトプットのチャンネルをひとつずつ持つ。Sourceで取得したデータをフィルタリングの処理を実装したりする。

## Sink
データの受信側。(Subscriber) インプットのチャンネルをひとつだけ持つ。

## RunnableGraph
Source + Flow + Sink　の要素を３つを連結したグラフをRunnableGraphと言います。
データを処理する一連の流れを形態を表す物になります。

## ソースコード

* フローの流れ
  * webページのスクレイピング → 
  保存した画像サイズフィルター → 1000*1000以下のimgファイル削除

```
class ScrapeStream extends ImgHelper{

  implicit val system = ActorSystem("ScrapeSystem")
  implicit val materializer = ActorMaterializer()
  implicit val ec: ExecutionContext = ExecutionContext.Implicits.global

  val targetUrls: List[String] = List (
    // スクレーピングしたいページのURL
    "http://hoge.com"
  )

  //webページのスクレイピング
  val source = Source(targetUrls).mapAsyncUnordered(3) { url => scrape(url)}

  //imgサイズフィルター
  val step = Flow[List[File]].mapAsyncUnordered(3) { files =>
    Future(for {
        file <- files
        if (check(file))} yield file)
  }

  //imgファイルの移動
  val sink = Sink.foreachParallel[List[File]](3) { files => files.map(file => delete(file))}

  val graph = source via step to sink
  
  def executeScrape(): Unit = {
    graph.run()
  }
}

trait ImgHelper {

def delete(file: File) = {
 file.delete()
}

def scrape(url: String) = Future {
  val img = JsoupBrowser().get(url) >?> elementList("img")
  img match {
    case Some(l) => for {e <- l} yield {save(e.attr("src"))}
    case None => List.empty[File]
  }
}

private def save(url: String) = {
  val file = new File("保存したいファイルパス")
  Resource.fromFile(file).write(Resource.fromURL(url).byteArray)
  file
}

def check(file: File) = {
  val image = ImageIO.read(file)
  image.getHeight() <= 1000 && image.getWidth() <= 1000
}

```

# まとめ

Source、Flow、Sinkの独立した要素として実装することで、各々がマイクロサービス化されていることもメリットの一つかと思います。
お互いのフローに影響を与えずに、Sourceを「S3からのファイル読み込み」に書き換えることや、Sinkの部分を「別サーバへのファイルバックアップ処理」などに変更することも出来ます。
それぞれの要素のInput/Outputの型を合わせるだけで、処理要素を追加したり、入れ替えたりすることが容易に書き換えることが出来るのも、akka streamsのメリットかと思います。
AWS のAPI Gateway + Lambda を使って GraphQL をやってみる


サーバレス構成でGraphQLを使うにはどうすればよいか？を調べていたところ、serverless framework にExampleを見つけたので、動かしてみます。

[serverless-graphql-api](https://github.com/boazdejong/serverless-graphql-api)

- - -
- インストール


serverless frameworkをインストールし、serverless-graphql-apiをインストールします。


```bash
npm install serverless -g
```

```bash
git clone https://github.com/boazdejong/serverless-graphql-api
cd serverless-graphql-api
npm install
```


Resourceのリージョンの指定がデフォルト(`us-east-1`)になっています。
必要であれば、`serverless.yml`を動作させるリージョンに修正してください。


```serverless.yml
      6 provider:
      7   name: aws
      8   runtime: nodejs4.3
      9   iamRoleStatements:
     10     - Effect: Allow
     11       Action: 
     12         - dynamodb:DescribeTable
     13         - dynamodb:Query
     14         - dynamodb:Scan
     15         - dynamodb:GetItem
     16         - dynamodb:PutItem
     17         - dynamodb:UpdateItem
     18         - dynamodb:DeleteItem
     19       Resource: arn:aws:dynamodb:us-east-1:*:*
```

東京リージョンに変更する場合は、9行目に `region: ap-northeast-1`を1行追加し、19行目の`us-east-1`を`ap-northeast-1`に変更してください。

- - -
- デプロイ

```bash
npm run deploy
```

deployが終了すると以下のように出力されます。

```
Serverless: Stack update finished...
Service Information
service: graphql-api
stage: dev
region: us-west-1
api keys:
  None
endpoints:
  POST - https://xxxxxxx.execute-api.us-west-1.amazonaws.com/dev/graphql
functions:
  graphql: graphql-api-dev-graphql

Stack Outputs
GraphqlLambdaFunctionQualifiedArn: arn:aws:lambda:us-west-1:nnnnnnnnnn:function:graphql-api-dev-graphql:2
ServiceEndpoint: https://xxxxxxx.execute-api.us-west-1.amazonaws.com/dev
ServerlessDeploymentBucketName: graphql-api-dev-serverlessdeploymentbucket-xxxxxxxxx 
```

Service Informationの endpointsに [GraphiQL.app](https://github.com/skevy/graphiql-app)などでアクセスし、動作することを確認してください。



今回動かしてみた[serverless-graphql-api](https://github.com/boazdejong/serverless-graphql-api)ですが、[Apollo](https://www.apollodata.com/)の[graphql-server-lambda](https://github.com/apollographql/graphql-server/tree/master/packages/graphql-server-lambda)ベースで実装されています。
serverless framework をpythonで使う。


Amazon Linux上に serverless frameworkの開発環境を構築し、pythonでlambda functionを実装します。

Amazon Linuxの標準のpythonは、2.7系の為、3系をインストールします。なお、Amazon linuxに用意されているpython3系は、3.5までの為、3.６をビルドしてインストールします。(**2017/6/5時点**)

```bash
$ sudo yum install gcc gcc-c++ make git openssl-devel bzip2-devel zlib-devel readline-devel sqlite-devel

```
 
環境を汚さないようホームディレクトリ配下にlocalを作成し、インストールします。

```bash
$ curl https://www.python.org/ftp/python/3.6.1/Python-3.6.1.tgz -o Python-3.6.1.tgz
$ tar xfz Python-3.6.1.tgz
$ cd Python-3.6.1
$ ./configure --prefix=$HOME/local
$ make
$ make install

```

python3.6を利用するように以下の２行を`.bash_profile`に追加し、PATHを変更します。

```
$PATH=$HOME/local/bin:$PATH
export PATH
```

反映後、python3にパスが通っていることを確認。

```bash
$ python3 --version
Python 3.6.1
```

仮想化に必要となるvirtualenvをインストールします。

```bash
$ pip3 install virtualenv
```

serverless framework でpythonを利用して開発する為にまずはpython3.6の仮想環境を作ります。

```bash
$ virtualenv -p ~/local/bin/python3.6 hello3.6
$ source python3.6/bin/activate
(hello3.6) $
```

次にserverless のコマンドを実行し、関数の作成とローカル実行を行います。

```bash
(hello3.6) $ sls create --template aws-python3 --path chat
(hello3.6) $ cd chat
(hello3.6) $ sls invoke local -f hello
```

以下のような出力が出れば、OK.

```bash
(hello3.6) $ sls invoke local -f hello
{
    "statusCode": 200,
    "body": "{\"message\": \"Go Serverless v1.0! Your function executed successfully!\", \"input\": {}}"
}
```

pipでインストールして利用する拡張モジュール類は、slsコマンドで作成されたフォルダ配下で、pip のオプション`-t`をつけてインストールすることで、デプロイ対象ファイルに含まれます。

```bash
(hello3.6) $  pip install flask -t .
```
amazon linux 上に serverless framework 開発環境構築


EC2インスタンスを Amazon Linux (AMI)で立ち上げて、[serverless framework](https://serverless.com/) の開発環境を作ります。

sshでec2インスタンスに接続するところまでは、省略。

## nodejsの導入
nvm経由でnodejsを導入します。

```bash:yumでは、nodejs見つからず
$ yum search nodejs
Loaded plugins: priorities, update-motd, upgrade-helper
Warning: No matches found for: nodejs
No matches found
```


[nvm](https://github.com/creationix/nvm)をインストールします。[amazonのTutorial](http://docs.aws.amazon.com/ja_jp/sdk-for-javascript/v2/developer-guide/setting-up-node-on-ec2-instance.html)に記載されているコマンドは、nvmのバージョンがv0.32.0と古いので、本家サイトに記載のコマンドを実行。

```bash
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash
```


環境変数、PATH設定等を行う為の処理が、.bashrcに追記されていることを確認し、反映します。


```bash
source ~/.bash_profile
```

以下のような処理が'.bashrc'追記されます。

```bash
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion
```


lambaのnodejs環境は、v6.10 (2017/6/2時点)ですので、v6.10をインストールします。
なおlambda@edge環境に配置する場合は、v4.3にします。


```bash
# v6.10系があることを確認
nvm ls-remote
# v6.10をインストール(v6.10.3が最新)
nvm install v6.10
# v6.10を使用開始
nvm use 6.10
```


インストールされたことを確認します。

```
$ node -e "console.log('Running Node.js ' + process.version)"
Running Node.js v6.10.3
$ node -v
v6.10.3
```

## serverless frameworkのインストール
serverless framework をインストールします。
https://serverless.com/framework/docs/providers/aws/guide/installation/


```
npm install -g serverless
```

インストールされたことを確認します。

```
$ serverless --version
1.14.0
$ sls --version
1.14.0
```

serverless framework を使って、lambda functionを作成してみます。
serverless では、lambdaで利用可能な言語環境をtemplateとして指定し、functionを作成していきます。
以下のコマンドを実行します。

```bash
sls create --template aws-nodejs --path chat
```

`handler.js`, `serverless.yml`の2ファイルが作成されます。
aws上のサービスを定義するserverlessの定義ファイルも含めて作成されています。

単純なメッセージを返すfunctionの`hello`が作成されているので、ローカルで動作させてみます。

```bash
$ cd chat
$ sls invoke local -f hello
{
    "statusCode": 200,
    "body": "{\"message\":\"Go Serverless v1.0! Your function executed successfully!\",\"input\":\"\"}"
}
```

実行されたfunctionの`hello`は、`handler.js`に実装されています。

```js:handler.js
'use strict';

module.exports.hello = (event, context, callback) => {
  const response = {
    statusCode: 200,
    body: JSON.stringify({
      message: 'Go Serverless v1.0! Your function executed successfully!',
      input: event,
    }),
  };

  callback(null, response);

  // Use this code if you don't use the http event with the LAMBDA-PROXY integration
  // callback(null, { message: 'Go Serverless v1.0! Your function executed successfully!', event });
};
```


## 補足
Serverless Framework　のコマンドでのエラーが発生した時、エラーの詳細を知りたくなります。
エラー詳細に出力させる場合は、以下の環境変数を設定してください。

```bash
export SLS_DEBUG=true
```
kintoneでifを使用したいのですが…

kintoneにてif文を使用したいのですが…javascriptを使用しなければならないのでしょうか。
if文である文字と文字が一致した時に数字を自動入力するプログラムです。
(例)
1.自宅
2.徒歩
の場合は13のような感じで数字が自動入力されるプログラムです。

このようなプログラムをご教授お願い申し上げます。
【Unity】簡単に、Buttonの子オブジェクトの色を押下時に同期できるスクリプトの紹介

# 概要
　Unityで、以下のような階層で複数の画像やテキストを重ねて一つのボタンを作るとする

<img width="202" alt="スクリーンショット 2017-06-27 17.28.32.png" src="https://qiita-image-store.s3.amazonaws.com/0/63597/9d2e619c-b470-41f4-2182-abd867a46278.png">

　すると、以下のように`Button`に指定されている`Target Graphic`の色しか変更されない問題が発生し、違和感のあるボタンができてしまう

![button_but.gif](https://qiita-image-store.s3.amazonaws.com/0/63597/0d63e2ca-f2f2-592b-b7ea-a679d69f6c8d.gif)

　本来以下のような挙動になってほしい

![gif_button_color_sync.gif](https://qiita-image-store.s3.amazonaws.com/0/63597/148dd86a-8ebd-052a-bed0-601fbc2aa5af.gif)

　そこで今回は、最初に説明したような作りのボタンでも簡単に上のような挙動のボタンにできるスクリプトを作成したので紹介する


# スクリプト
   [SyncButtonPressedColorBehaviour](https://github.com/kazuman519/SyncButtonPressedColorBehaviour)

　スクリプト自体は上記Repositoryに上げているのですぐにコピペで使用 & デモで試しに触ってみることができる

## 使い方
### 1. 事前準備
- このスクリプトでは、ボタンを押した時のフェードアニメーションでDOTweenというTweenエンジンを利用している
- もし入れてないない場合 & 単純なコピペですぐに利用したい場合はAssetsStoreからインストールする必要がある
    - [DOTween](https://www.assetstore.unity3d.com/jp/#!/content/27676)
- DOTweenを利用しないで対応したい場合は、フェードアニメーションをしている部分を独自の実装に置き換えていただければ利用できる

### 2. アタッチ
- 先ほど紹介したリポジトリにある、[SyncButtonPressedColorBehaviour.cs](https://github.com/kazuman519/SyncButtonPressedColorBehaviour/blob/master/Assets/Scripts/SyncButtonPressedColorBehaviour.cs)を目的のボタンにアタッチすれば完了

<img width="507" alt="スクリーンショット 2017-06-30 8.39.23.png" src="https://qiita-image-store.s3.amazonaws.com/0/63597/16ce965c-a93e-fee6-30df-492042213523.png">

- これで、ボタンを押下した時、離した時、押しながら指を動かした時の色の挙動が通常のボタンの挙動と同じになる
Max7とArduino unoを連携させる


くさるほど情報がありそうなんですが、Max7での例があんまりないのでメモ程度。

#やったこと
1. Arduinoの環境設定
2. maxuinoのインストール

## Arduinoの環境設定

1. Arduino IDEのインストール。公式サイトから落してきて入れる。
2. ドライバーのインストールはOSXの場合、こちらのページによると必要ないらしい > http://trac.switch-science.com/wiki/Arduino (購入したのもスイッチサイエンスさんの「Arduinoを始めよう」のキット。それにUNOがついてきたのでUNO使ってます)
3. Arduino IDEの起動

これで準備おわり。

## maxiunoをMax7にインストール

1. ここからmaxuinoの最新版をダウンロード > http://www.maxuino.org/downloads
2. で、こっから悩んだのですがMax7でのエクスターナルオブジェクトの手動でのインストール先が良くわからない。しらべていったところこちらで ~/Documents/Max7/Libraryに入れろ、というのを見かけたので、1でダウンロードしてきたフォルダをそのまま放り込んだところオブジェクトは認識した。パッケージマネージャがインストールするところに入れるにはmaxuinoを解凍して出来たディレクトリのなかの構成を変える必要があるのでそのまま放り込めるほうがいい(あとからアップデートとかする必要があったら)と考えてこちらを採用。MaxのファイルパスにUser Libraryとして始めから登録されてるしね。
3. 実際にオブジェクトが認識しててヘルプパッチも開くか確認

## とりあえずArduino IDEでLチカ

1. Arduino IDEを起動。
2. メニューのTools > Boardから"Arduino/Genuino UNO"が選択されてなければ選択
3. メニューのTools > Portから、USBで接続されているArduino UNOを選択
4. メニューのFiles > Examples > 01.Basics > Blinkを選択
5. それをArduinoにUploadボタンでアップロード
6. そしたらオンボードのLEDが光りますが、初期状態でも点滅してるので、コードのこの辺を弄ります。

```
void loop() {
  digitalWrite(LED_BUILTIN, HIGH);   // turn the LED on (HIGH is the voltage level)
  delay(1000);                       // wait for a second
  digitalWrite(LED_BUILTIN, LOW);    // turn the LED off by making the voltage LOW
  delay(1000);                       // wait for a second
}
```

7. delay(1000)というのは1000msec処理を送らせる、というものなので、そこを適当な数字に変えて再びプログラムをアップロードすれば光る間隔が変ります。

というわけで、Arduino IDEでの動作確認はおしまい。

## Max7で同じことやる。

1. Arduino IDEのFiles > Examples > Firmata > StandardFirmataを開き、Arduinoにアップロード
2. Max7を起動して、Maxuinoオブジェクトを一つ作る。
3. ヘルプパッチを開き、1、2、3、、、という手順にしたがい、ポートの選択、イニシャラインズ、オンボードのLEDをmetroで点滅、というのを試して光ってたら連携は出来てるのが確認できる

パッチとか回路とかをどう組むかになるので一旦ここで終了。
RubyonRailsのDeviseでユーザー情報うをパスワードなしで更新するときにハマった話

以下の通り書いたのだけれどね、Railsくん
**unknown attribute 'current_password'**
と、オッシャイマスノ。

```rb:\app\controllers\users\registrations_controller.rb
  def update_resource(resource, params)
    resource.update_without_password(params)
  end
```

原因は、以下の記入漏れでした。

```rb:\app\models\user.rb
attr_accessor :current_password
```

これで、パスワードの入力なしに、ユーザー情報を更新することができました。
macOS(Sierra）にHomebrew経由にてzshをインストールする

## インストール

ターミナル（Terminal.app）を起動し、brewにてインストールする。

```
brew install zsh --without-etcdir
```

## ログインシェルをzshに変更する

/etc/shells に「/usr/local/bin/zsh」を追記。

次のコマンドでデフォルトシェルを切り替える。

```
chsh -s /usr/local/bin/zsh
```
## インストール確認

ターミナル（Terminal.app）を再起動して、このコマンドで確認する。

```
% echo $SHELL
/usr/local/bin/zsh
```
python-social-auth v0.2 から v0.3 への移行手順

## はじめに
基本的に全てここに書いてあります．
https://github.com/omab/python-social-auth/blob/master/MIGRATING_TO_SOCIAL.md

python-social-auth は v0.3 以降，パッケージが細分化されたため，パッケージを追加して設定を変更する必要があるそうです．

## 書き換え
コメントアウトしてあるところが書き換えた箇所です．

```settings.py
INSTALLED_APPS = [
    # 'social.apps.django_app.default',
    'social_django',
]

TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
        'DIRS': [os.path.join(BASE_DIR, 'templates'),],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
                # 'social.apps.django_app.context_processors.backends',
                # 'social.apps.django_app.context_processors.login_redirect',
                'social_django.context_processors.backends',
                'social_django.context_processors.login_redirect',
            ],
        },
    },
]

AUTHENTICATION_BACKENDS = [
    # 'social.backends.twitter.TwitterOAuth',
    'social_core.backends.twitter.TwitterOAuth',
    'django.contrib.auth.backends.ModelBackend',
]
```

```urls.py
urlpatterns = [
    # url(r'^social/', include('social.apps.django_app.urls', namespace='social')),
    url(r'^social/', include('social_django.urls', namespace='social')),
]
```

## アップグレード
```bash
# python-social-auth をアップグレードすると関連パッケージがいっぱいインストールされる
pip install -U python-social-auth
# Django 用の追加パッケージをインストール
pip install social-auth-app-django

# migrate
python manage.py migrate
```
macOS(Sierra）にHomebrewをインストールする

## インストール

ターミナル（Terminal.app）にて以下のワンライナーを実行する。

```
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
```
## パス関係

```
export PATH=/usr/local/bin:$PATH
export PATH=/usr/local/sbin:$PATH
```

.bashrc や .zshrc に記述しておく。
if @blog.save という書き方ができる理由


## Rubyにおけるif文

ifを使うことで、「XXを満たしたらこの処理、そうでなければこの処理」といったような、条件分岐が実現できる。

```rb
num = 5

if num < 0
  puts '符号はマイナスです'
else
  puts '符号はプラスです'
end
```

上記を実行すると `符号はプラスです` と出力される、のは置いといて...。
`num < 0` ここが条件式に当たる。
条件式にはルールがある。

* 条件式を評価して `nil` または `false` が得られたら偽
* それ以外は真

従って以下のような書き方でもOK

```rb
num = 5

if num
  puts '符号はマイナスです'
else
  puts '符号はプラスです'
end
```

この性質を利用して、Railsでは以下のようなちょっと不思議な書き方ができる。

```rb:app/controllers/blogs_controller.rb
@blog = Blog.new(title: 'aaa', content: 'bbb')

if @blog.save
  redirect_to @blog
else
  render :new
end
```

`if @blog.save` 当然注目すべきはココ。
なぜこんな書き方ができるのか


その答えはrailsコンソールで実行すればわかる。


```
irb(main):001:0> blog = Blog.new(title: 'aaa', content: 'bbb')
=> #<Blog id: nil, title: "aaa", content: "bbb", created_at: nil, updated_at: nil>
irb(main):002:0> blog.save
   (0.2ms)  begin transaction
  SQL (8.4ms)  INSERT INTO "blogs" ("title", "content", "created_at", "updated_at") VALUES (?, ?, ?, ?)  [["title", "aaa"], ["content", "bbb"], ["created_at", "2017-06-29 16:26:35.819755"], ["updated_at", "2017-06-29 16:26:35.819755"]]
   (1.2ms)  commit transaction
=> true
```

saveメソッドを実行したら `INSERT INTO "blogs"...` とSQLが実行され、最後に `true` という値が返ってきてるのが確認できる。

では今度はモデルにバリデーションを実装して、わざと引っ掛けてみる。

```rb:app/models/blog.rb
class Blog < ActiveRecord::Base
  validates :title, presence: true
end
```

先ほどと同じようにrailsコンソールでBlogクラスのインスタンスを生成した後、saveメソッドを実行させる。

```
irb(main):001:0> blog = Blog.new(content: 'bbb')
=> #<Blog id: nil, title: nil, content: "bbb", created_at: nil, updated_at: nil>
irb(main):002:0> blog.save
   (0.2ms)  begin transaction
   (1.2ms)  rollback transaction
=> false
```

今度は `false` が返ってきてるのが確認できる。

この２つから、 `@blog.save` も条件式となるための条件は満たしているのだ。


ちなみにsaveに `!` をつけるとtrue/falseではなく例外 `Title can't be blank` が返るので、こちらも合わせて覚えておきたい。

```
irb(main):003:0> blog.save!
   (0.1ms)  begin transaction
   (0.1ms)  rollback transaction
ActiveRecord::RecordInvalid: Validation failed: Title can't be blank
```


## まとめ

* Rubyのif文において条件式を評価し、戻り値がnilまたはfalseの時は `偽` それ以外は `真` となる。
* `if @blog.save` と書けるのは、saveメソッドがINSERT INTO (table_name) .....というSQLの実行だけでなく、保存が成功したらtrue、Validationなどにより失敗したらfalseが戻り値として得られるから。
クラスの動的継承。～僕はまだまだrubyのことを知らない～

参考：[知って得する！５５のRubyのトリビアな記法](http://melborne.github.io/2013/03/04/ruby-trivias-you-should-know-4/)


ずっと読もうと思っていたこの記事をやっと最近読んでいて、
こんなのあったんだとびっくりしたので、ご報告になります。

# 動的継承(23.)

```rb

class Male
  def laugh
    'Ha ha ha!'
  end
 end

 class Female
  def laugh
    'Fu fu fu..'
  end
 end

 class Me < [Male, Female][rand 2]
 end

# 以下はランダムでMale,Femaleが継承されメソッドが呼ばれている。
 Me.superclass # => Female
 Me.new.laugh # => 'Fu fu fu..'
```

動的継承は継承先をランダムで決めることができます。
あまり、仕事で使うシーンは思い浮かんでないのですが、
描画系のコードで使えそうだなと思いました。:joy:
Ruby｜複数のヒアドキュメントをメソッドの引数にする


n番煎じでしょうが、ヒアドキュメントで感動したのでQiitaに投稿します。

## まえおき

ヒアドキュメントはSQLとか複数行にわたって書く必要があるときに便利です:smile:
ですが、メソッドに渡したいときは変数に格納する必要があると思っていました。。。

```ruby
def heredoc(document)
  puts document
end

document = <<-EOD
ヒアドキュメント
EOD

heredoc(document)
#=> ヒアドキュメント
```

## しっったこと＃１

ところがどっこい！
`<<`か`<<-`と識別子を引数とすることで余分な（？）変数をなくすことができます。

```ruby
def heredoc(document)
  puts document
end

heredoc(<<-EOD)
ヒアドキュメント
EOD
#=> ヒアドキュメント
```

## しっったこと＃２

さらにさらに！
タイトルにある通り、複数のヒアドキュメントをメソッドの引数にできます！:thumbsup: 

```ruby
def heredocs(doc1, doc2)
  puts "doc1"
  puts doc1
  puts "doc2"
  puts doc2
end

heredocs(<<-DOC1, <<-DOC2)
ヒアドキュメントのテキストです。＃１
DOC1
ヒアドキュメントのテキストです。＃２
DOC2
#=> 
# doc1
# ヒアドキュメントのテキストです。＃１
# doc2
# ヒアドキュメントのテキストです。＃２
```

わかりやすいように識別子を分けていますが、識別子が同じでも動くようです。。。

```ruby
def heredocs(doc1, doc2)
  puts "doc1"
  puts doc1
  puts "doc2"
  puts doc2
end

heredocs(<<-DOC1, <<-DOC1)
ヒアドキュメントのテキストです。＃１
DOC1
ヒアドキュメントのテキストです。＃２
DOC1
#=> 
# doc1
# ヒアドキュメントのテキストです。＃１
# doc2
# ヒアドキュメントのテキストです。＃２
```

ヒアドキュメントがひとつだとグッと読みやすくなるケースが多いように思います:smile: 
ですが、ヒアドキュメントが複数ある場合はどうみても読みづらいです。。。
Laravel5.4 Semantic UI（less）のコンパイルでハマったこと

# 概要
Semantic UIを何となく使ってみたくなったので、Laravel Mixでアセットのコンパイルを試したらハマった件・・・

# ハマったこと
Laravel Mixでアセットコンパイル時にフォントファイルが見つからないエラーが発生した。

```
These relative modules were not found:

* ./semantic/src/themes/themes/default/assets/fonts/icons.eot in ./~/css-loader?{"url":true,"sourceMap":false}!./~/postcss-loader?{"sourceMap":false}!./~/less-loader?{}!./resources/assets/less/app.less
* ./semantic/src/themes/themes/default/assets/fonts/icons.woff2 in ./~/css-loader?{"url":true,"sourceMap":false}!./~/postcss-loader?{"sourceMap":false}!./~/less-loader?{}!./resources/assets/less/app.less
* ./semantic/src/themes/themes/default/assets/fonts/icons.woff in ./~/css-loader?{"url":true,"sourceMap":false}!./~/postcss-loader?{"sourceMap":false}!./~/less-loader?{}!./resources/assets/less/app.less
* ./semantic/src/themes/themes/default/assets/fonts/icons.ttf in ./~/css-loader?{"url":true,"sourceMap":false}!./~/postcss-loader?{"sourceMap":false}!./~/less-loader?{}!./resources/assets/less/app.less
* ./semantic/src/themes/themes/default/assets/fonts/icons.svg in ./~/css-loader?{"url":true,"sourceMap":false}!./~/postcss-loader?{"sourceMap":false}!./~/less-loader?{}!./resources/assets/less/app.less                                                                                                                                                                    
```

#環境
Laravel 5.4.25
PHP 7.1.3
Semantic UI 2.2.10

#実行手順

- Semantic UIを[マニュアル](https://semantic-ui.com/introduction/getting-started.html)通りにインストール<br>※置き場所は「resources/assets/less/semantic」
- app.lessファイルを作成
- webpack.mix.jsを修正

```less:resources/assets/less/app.less
& { @import "semantic/src/semantic"; }
```

```js:webpack.mix.js
const { mix } = require('laravel-mix');
mix.less('resources/assets/less/app.less', 'public/css');
```

この状態でコンパイルするとフォントファイルが見つからないエラーが発生しました。
※パスが間違ってる。themesが一つ余分。。

# 解決方法１（非推奨）
解決方法というか、とりあえずコンパイルを通す方法。
以下のようにする。

```js:webpack.mix.js
const { mix } = require('laravel-mix');
mix.less('resources/assets/less/app.less', 'public/css')
    .options( processCssUrls: false });
```

デフォルトでは、相対パスで記述されたurl()を書き換えて、ファイルをpublicディレクトリにコピーする挙動の模様。processCssUrlsをfalseにすることで、書き換え（ファイルコピー）をさせなくできるみたい。
とはいえ、手動でCSSに記載された場所へフォントファイルをコピーしないといけないので非推奨。

# 解決方法２
こっちが本命。フォントのパスを書き換える。
この書き換え方法（対象の変数）を探すのにハマった。
今回はデフォルトのthemeを使用したのだが、その中のsite.variablesファイルにフォントのパスが定義されていた。

```less:resources/assets/less/semantic/src/themes/default/site.variables
/*-------------------
        Paths
--------------------*/

/* For source only. Modified in gulp for dist */
@imagePath : '../../themes/default/assets/images';
@fontPath  : '../../themes/default/assets/fonts';
```

なので、以下のファイルで定義を上書きすればOK

```less:resources/assets/less/semantic/src/site/globals/site.variables
/*******************************
     User Global Variables
*******************************/

@fontPath  : '../../default/assets/fonts';
```

以上です。
CORS (UBUNTU+APACHE on EC2)クロスドメインで困った事

# CORS　クロスドメインを利用（自分用メモ）
環境：AWS EC2
OS:UBUNTU
サーバー：Apache2.4

#やりたかった事
1:www.hogehoge.comとwww.fugafuga.com間でAjaxを利用しデータをやり取りしたい。

#普通にやると
1:www.hogehoge.comから
```
$.ajax({
            url: "https://www.fugafuga.com",
            method: "POST",
            dataType: "json",
            withCredentials: true,
            crossOrigin: true,
            data: JSON.stringify(postList),
            processData: false,
            contentType:"application/json; charset=utf-8",
        })
```
２：エラーゲット
XMLHttpRequest cannot load http://www.fugafuga.com. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://hogehoge.com' is therefore not allowed access.

3:どういう問題か？
CORSヘッダとは？
 
Cross-origin resource sharing (CORS)はWebサーバがドメインをまたいでリソースを配信するために、
W3Cによって勧告されたアクセス制御の仕組みです。リソースを提供するサーバが、どのサーバに対して自身のリソース利用を許可するかを示すHTTP ヘッダを追加することによって動作します。この仕組みの中で定義されたHTTPヘッダの事をCORSヘッダと呼びます。

参照：https://community.akamai.com/groups/akamai-japan/blog/2016/07/05/cors%E3%83%98%E3%83%83%E3%83%80%E3%81%AE%E8%A8%AD%E5%AE%9A%E6%96%B9%E6%B3%95%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6

４：ならばHeaderを追加
サーバー側に以下のheaderを付与。私の場合はApacheなので、
以下を追加。

```
Header always set Access-Control-Allow-Origin "*"
Header always set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
Header always set Access-Control-Max-Age "1000"
Header always set Access-Control-Allow-Headers "x-requested-with, Content-Type, origin, authorization, accept, client-security-token"
```

５：これで、、、、できない、、、なんでやねん。
OPTIONS http://fugafuga.com 405 (Method Not Allowed) 

どうやら、JSONでPOSTしているのでOPTION扱いになり、preflightで弾かれておるようです。
その場合は、以下をApacheに追加。GETとかなら大丈夫だった。

このコマンドを有効にするにはmod_rewriteを有効にしておく必要あり。REQUESTが OPTIONだったら200を返すように指示。
参考：http://oxynotes.com/?p=7392

```

<Directory /var/www/>
RewriteCond %{REQUEST_METHOD} OPTIONS RewriteRule ^(.*)$ $1 [R=200,L]
</ Directory>
```


これでめでたしめでたし。
備忘録_iOS(fixed)


##safariでのメニューバーの挙動

safariの下部にあるメニューバーはスクロールに応じて表示・非表示が切り替わる。
この時の高さを取得する時に注意しておく必要がある。

###解決策

下記のようにして高さを取得する

```
// 非jQuery
var height = window.innerHeight;
```

下記のjQueryを使用して下記のように高さを取得するとメニューバーの分の高さが含まれない

```
// jQuery
var height = $(window).height();
```

##safariでのスクロール問題

通常、body要素に`overflow: hidden;`を設定することでスクロールを無効化できる。
しかし、safariではそれを利用することはできず、普通にスクロールできてしまう。

###解決策

これを解決する一番簡単な方法は`touchmove.noScroll`イベントを利用してスクロールを止めるだと思う。
ただ、この設定をするとすべてのスクロールイベントが無効化される。

例えば、内包する要素をスクロールさせたいときはこの方法では実現できない。

内包する要素をスクロールさせたいときには下記のように設定することでスクロールイベントを無効化せずにスクロールさせないように設定できる

```
var current_scrollY;

// OPEN MODAL
$( '.js-open' ).on( 'click', function(){

    current_scrollY = $( window ).scrollTop(); 

    // 固定処理
    $( 'body' ).css( {
        position: 'fixed',
        width: '100%',
        top: -1 * current_scrollY
    });

} );

// CLOSE MODAL
$( '.js-close' ).on( 'click', function( e ){

    // リセット処理
    $( '#wrapper' ).attr( { style: '' } );
    $( 'html, body' ).prop( { scrollTop: current_scrollY } );

});
```

上記のようにして、body要素に対して`position: fixed;`を適用してスクロールを無効化したように見せる。
ただ、body要素に`position: fixed;`を設定後、解除するとページの一番上まで強制的に戻ってします。

これでは使い勝手が非常に悪いので、jsを利用して高さを記憶しておく。

###注意点

body要素に対して、`overflow: hidden;`を設定するとスクロールを無効ができるが、これを設定するとchromeの上にスクロールして画面をリフレッシュすることができなくなる。


##参考にさせていただいた記事

https://noji.wpblog.jp/2016/11/30/%E3%80%90%E3%81%BE%E3%81%95%E3%81%AB%E5%BA%95%E3%81%AA%E3%81%97%E6%B2%BC%E3%80%91%E3%81%82%E3%81%AE%E3%80%8C%E5%B7%A6%E5%81%B4%E3%81%8B%E3%82%89%E5%87%BA%E3%81%A6%E3%81%8F%E3%82%8B%E3%83%A1%E3%83%8B/
Tensorflow系のライブラリで使用するGPUを指定する

# はじめに
Tensorflowでは，デフォルトの設定で回すと搭載されているGPUすべてのメモリを確保してしまいます．TensorflowをバックエンドにしたKerasも同様です．個人のデスクトップPCで回す場合には問題ありませんが，複数のGPUを搭載した共有のGPUサーバを利用する場合，大変迷惑です．
以下に使用するGPUを指定するサンプルコードをまとめました．

## Tensorflow
```py
import tensorflow as tf
config = tf.ConfigProto(
    gpu_options=tf.GPUOptions(
        visible_device_list="0,1", # specify GPU number
        allow_growth=True
    )
)
sess = tf.Session(config=config)
```
``Session``を確保するときに``config``を渡してやります．
``allow_growth=True``を指定することによって，指定したGPUのメモリを最初にすべて確保するのではなく，必要に応じて確保するように設定できます．
あまりうれしくはありませんが他に空いているGPUがない場合，メモリが空いていれば複数のプログラムを回すことが可能です．

## keras
```py
import tensorflow as tf
from keras.backend.tensorflow_backend import set_session
config = tf.ConfigProto(
    gpu_options=tf.GPUOptions(
        visible_device_list="2", # specify GPU number
        allow_growth=True
    )
)
set_session(tf.Session(config=config))
```
(https://github.com/fchollet/keras/issues/1538)

基本的にはバックエンドとして動作するTensorflowの設定を変更します．``keras.backend.tensorflow_backend.set_session``を用います．
注意点としては，コードの内部でtf.Sessionを取得しているようなケースでは，先頭に上記を記述しても意味がありません（とくに自分で書いていないコードを走らせる場合）．

## (nvidia-docker)
nvidia-dockerにはコンテナに対してマウントするGPUをを設定するオプションがあります．

```
$ NV_GPU=3,4 nvidia-docker run HOGEHOGE
```
``NV_GPU``によって設定できます．
VR空間移動用いす型デバイスを作成する②デバイスを作成してみて思ったこと

とりあえず思った事等を羅列。覚書に近い・・・。

#目次
（見出し１）　VRデバイス（特に体で動かすデバイス）作成時に気づいた点
１．HMD装着時は体のバランスが低下する
２．酔い対策（振動モーター）とか
３．重量センサを使う良い点、悪い点
４．腰と足は同時に動かさないほうが良い
５．椅子の回転検出の必要性
６．HMDを外したほうがプレーしやすい
（見出し2）　VR用のデバイスを自作することのメリット
１．手が動かせる
２．ライバルが少ないかも
３．いろんな展示会に出せる
４．面白い

#VRデバイス（特に体で動かすデバイス）作成時に気づいた点
１．HMD装着時は体のバランスが低下する
　HMDをかぶると、目をつぶった状態に近くなる。直立した状態から前後に体重を移動すると、バランスを崩し転倒する可能性が大きい。
　最初は下のように立って使う構想でしたが、試してみるとバランスが悪く、いすを使う形状に変更しました。
<img width=50% src=https://qiita-image-store.s3.amazonaws.com/0/184089/5988d92e-1370-371b-cf3c-672e8e825b12.png>
　　　＜初期作成時は上に立って動かそうとしていた＞
　体を使うデバイスを作成する際はご注意を。なお、左右への立っての体重移動は問題なさそうだった。

２．酔い対策とか
　等速運動より加速運動の方が酔いやすいといわれているが、個人的には
　　（酔いやすい）　減速運動　＞　加速運動　＞　等速運動　（酔いにくい）
　と感じる。私自身加速時やジャンプ時は酔わないのだが、ブレーキや停止、着地時には酔いやすい。
　今回のデバイスではブレーキ・停止時には体を動かし、着地時にはモーターで振動させ酔い対策としている。
　振動は展示会では意外と好評であった。振動モーター（体に刺激を与えること）は酔い対策として、効果が大きいようだ。

３．重量センサを使う良い点、悪い点
　重量センサを使っているが、現状は問題なく重心の偏りを検知できていると感じている。
　重量センサ自体はそこそこ精度が高いものの、OculusRiftやOculusTouchコントローラーのように1mm以下の位置を取得できるわけではない。それでも十分と感じるのは人のバランス感覚が視覚や手の位置の認識感覚ほど鋭敏でないためと思われる。あえて鋭敏でないところを使えば、精度の低いセンサでも十分そうだ。まとめると、
　ⅰ．感度が高い人体器官（手・指とか）でコントロール　
　　　⇒メリット　細かいコントロールが可能
　　　⇒デメリット　検知に精度の高いセンサが必要
　ⅱ．感度の低い人体器官（バランスとか）でコントロール
　　　⇒メリット　検知は精度の低いセンサで十分
　　　⇒デメリット　おおざっぱな動きしかできない
ⅱについては、仮にお尻で文字を書くようなVRコンテンツを考えた場合、正確な文字を書くことはできないだろうが、逆にそれほど（OculusTouchほど）高い精度でお尻の位置検知を行う必要はないというなイメージか。

４．腰と足は同時に動かさないほうが良い
　VR EXPOに出展したときに光センサで足のつま先の上下を検知するコントローラー（当時はつま先の上下でVR内でジャンプさせていた）も作ったがうまくいかなかった。原因として人は（重心を偏らせるために）腰を動かしてしまうのと同時に足を動かすのは困難らしい（当然か・・・。）。同じ下半身同士で相性が良いと思ったが、そうでもなかった。
　VRというコンテンツの性質上、体の一部を固定することになる可能性があるが、できるだけ固定個所は少なくするほうが良いのではないかと思う。

５．椅子の回転検出の必要性
　体重の偏りとは別に椅子の回転を検知し、VR内に反映している。体重の重心移動で前左右に動けるので、回転しなくても好きな場所に動けるのだが、実際に使ってもらうと回転は好評であった。
　好評のわりに実際ゲーム中に使いこなしている人はそんなにいなかったため、これは動きの自由度が高くなったことによる精神的負荷の軽減が原因と思われる。
　VR内では窮屈に感じるため、できる限り自由に動けるほうが良いようだ。（当たり前か・・・）。

６．HMDを外したほうがプレーしやすい
　ぶっちゃけ普通のディスプレイに表示させたほうが使いやすい。バランス全然安定するし。
　（視覚からの情報量に格段の差があるのかなぁ・・・。）
　なぜVRでやるのかってところを今後詰めていかないと途中で破綻するかも・・・。

#VR用のデバイスを自作することのメリット
１．手が動かせる
　ハードウェアは手を動かして作成するため、問題にぶち当たった時に頭を動かす以外に手を動かすという選択肢が残っている。
　問題に対し、
　　頭や机上で試行錯誤⇒煮詰まって頭が動かない⇒今度は手を動かして試行錯誤⇒煮詰まってくる⇒頭や机上で・・・
　とループを繰り返して解決できるので、進捗が停止状態に陥らない。
　また、ハードとソフトを使うので、
　　ハードで試行錯誤⇒ハードでは無理⇒ソフトで試行錯誤⇒ソフトでは無理⇒ハードで・・・
　のループも可能。選択肢が多くてよろしい。

２．ライバルが少ないかも
　あんまりやっている人が少ない。競争相手が少ないので、気持ち的に楽といえば楽。
　ただし、その分情報は少ないような気がする。Vive Trackerみたいな何にでも応用が利きそうなデバイスをメーカーが出すと、これで代替可能なうえに感度も高いとなって、一瞬でコツコツやってきた成果がパーになるかも・・・。

３．いろんな展示会に出せる
　VR系の展示会だけでなく、電子工作系の展示会にも出せる。無料で出展できる展示会に困らない。
　ある程度の進捗ごとに人に見てもらえるし、体験者や交流の幅を広げられる。（私はあんまり交流するほうではないが・・・。）
　あと、自作品の展示会の歴史はVR系よりも電子工作系のほうが長いせいか、電子工作系の展示には展示経験が豊富な方が多いように感じる。技術にかかわらず、展示経験が豊富な人と話せるのは良い。
　ついでに電子工作好きにVRのアピールもできる。

４．面白い
　面白いから。ぶっちゃけこれに尽きる。

長くなったので、残りは別に書く。
Jenkinsをとりあえず使う際のメモ

承認ワークフロー等を作るときにはJenkins2のPipeline（旧Workflow Plugin）を使いますが、ここではワークフローではなく通常のジョブを作る際の設定についてのメモを記載していきます。

## 全体的なメモ

* Windows版はユーザーに注意
Linuxの場合はシェルスクリプトからユーザーを変更するのは楽ですが、Windowsの場合は管理ツールのサービスのJenkinsのプロパティのログオンタブからユーザーを設定する必要があります。これを行わないと権限で怒られたりします。

* WindowsバッチのPAUSE
ビルドのWindowsバッチからPAUSEの入っているバッチを実行するとPAUSEは無視されます。
groovyからバッチを呼び出すとPAUSEは無視されません。（groovyからだとずっと止まるので注意）

* ジョブのAPIが便利
JENKINS_URL/JOB_NAME/BUILD_NUMBER/api/json

* safeRestartが便利
JENKINS_URL/safeRestart

## Pluginメモ

* Role Strategy Plugin
https://wiki.jenkins.io/display/JENKINS/Role+Strategy+Plugin
ユーザー毎に使用できる機能やviewを制限するために使用します。（設定はJenkinsの管理画面）

* Build Blocker Plugin
https://wiki.jenkins.io/display/JENKINS/Build+Blocker+Plugin
競合するジョブがある場合に、競合するジョブが同時に実行されないように制限するために使用します。（設定は各ジョブの設定画面）

* Build Pipeline Plugin
https://wiki.jenkins.io/display/JENKINS/Build+Pipeline+Plugin
Aジョブ⇒Bジョブ⇒Cジョブといったようにジョブを順序付けて実行するものを作ると現在の状況が分かりにくくなるために視覚的にわかりやすくVIEW表示するために使用します。（設定はVIEWの設定画面）（例：使用ブランチ設定ジョブ⇒ビルドジョブ⇒テストジョブ⇒デプロイジョブ）

* Groovy plugin
https://wiki.jenkins.io/display/JENKINS/Groovy+plugin
windowsバッチやshellだけでは遠回りな実装になってしまったり実装できない場合のためのスクリプトとして使用します。（設定はJenkinsの管理画面のシステム設定しておき、各ジョブのビルドの設定でgroovyを使うドロップダウンで使用　※その際はsystemのgroovyと間違わないようにする・使用するgroovyのバージョンを忘れずに選択する）

* Groovy Postbuild Plugin
https://wiki.jenkins.io/display/JENKINS/Groovy+Postbuild+Plugin
ビルド後にビルドの設定のdescription等を設定することでビルド履歴から何のパラメータを渡したビルドなのか等がわかるようにするためにしようします。manager.buildで直接オブジェクトに触れるので便利です。（設定は各ジョブの設定画面　ビルド後の処理）
http://javadoc.jenkins-ci.org/hudson/model/Build.html
例）ビルドパラメーター（例　BUILD_PARAMETER）をビルド履歴に表示

```groovy
def buildParameter = manager.build.buildVariables.get("BUILD_PARAMETER")
manager.build.setDescription(buildParameter)
```

* Text-finder Plugin
https://wiki.jenkins.io/display/JENKINS/Text-finder+Plugin
コンソール等から文字列を検索しその結果からビルド結果を操作するために使用します。
<b>ビルドでバッチやshellの結果等で既に結果が確定している場合に結果を操作できない場合がありました。その場合はビルドはgroovyで行いgroovyからバッチを実行して、失敗しても```System.exit(1)```等で結果を確定しない（バッチの実行結果は無視する）でおけば、Text-finder Pluginで結果の操作は可能でした。</b>
（設定は各ジョブの設定画面　ビルド後の処理）

* Monitoring
https://wiki.jenkins.io/display/JENKINS/Monitoring
JVMの情報等を確認するために使用します。
（確認はJenkinsの管理画面）

* Simple Theme Plugin
https://wiki.jenkins.io/display/JENKINS/Simple+Theme+Plugin
cssやjsで画面のカスタマイズを行う際に使用します。
userContentフォルダにcssやjsを置いておき、Jenkins管理画面のThemeのcssとjsの設定欄で```/userContent/hoge.css```        や```/userContent/fuga.js```等の設定をすることで読み込ませることが出来ます。

* テスト系プラグイン
https://wiki.jenkins.io/display/JENKINS/JUnit+Plugin
https://wiki.jenkins.io/display/JENKINS/NUnit+Plugin
https://wiki.jenkins.io/display/JENKINS/Clover+PHP+Plugin
テスト結果を見やすく表示するために使用します。（言語にあったものを選択）（設定は各ジョブの設定画面　ビルド後の処理）

## Groovyメモ

* Groovyでビルドパメータを取得

```groovy
System.getenv("パラメータ名")
```

* Groovyからコマンド実行（windows linux）

```groovy
// stdout.txtに標準出力し実行結果を取得
def resultCode = 'cmd /c コマンド > stdout.txt'.execute().waitFor()

// 標準出力をそのままコンソールに出す
println 'cmd /c コマンド'.execute().text
```

* Groovyからビルドを終了させる

```groovy
System.exit(0)
System.exit(1)
```
[Swift] WKWebViewを使ってみた

#WKWebViewを使ってみた

```swift:ViewController.swift
import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
    // WebViewページへ
    @IBAction func showGooglePage(_ sender: Any) {
        let vc = WebViewViewController()
        // 表示するURLを設定
        vc.url = "https://www.google.co.jp"
        if let navigator = self.navigationController {
            navigator.pushViewController(vc, animated: true)
        }
    }

}
```

```swift:WebViewViewController.swift
import UIKit
import WebKit

class WebViewViewController: UIViewController, WKUIDelegate, WKNavigationDelegate {
    
    var webView: WKWebView!
    
    var url: String?
    var pageTitle: String?
    var requestUrl: String?
    
    override func loadView() {
        super.loadView()
        let webConfiguration = WKWebViewConfiguration()
        webView = WKWebView(frame: .zero, configuration: webConfiguration)
        webView.uiDelegate = self
        webView.navigationDelegate = self
        self.view = webView
    }
    
    override func viewDidLoad() {
        super.viewDidLoad()
        self.navigationItem.title = self.pageTitle
        
        if let url = self.url {
            self.requestUrl = url
        }
        
        if let url = URL(string: self.requestUrl ?? "") {
            let request = URLRequest(url: url)
            webView.load(request)
        }
    }
    
    func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
    }
    
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
    }
    
}
```
MS Inspire2017まとめ

## Microsoft Inspireとは

- Microsoft社が年に１回、全世界の主要パートナーを招待して行う大規模カンファレンス。<br>
  https://partner.microsoft.com/ja-jp/inspire/sessions

## 「Digital Transfomation/デジタル変革」

- 今回のメインメッセージは「Digital Transfomation/デジタル変革」。
- 技術パラダイムシフトは、定期的にくるもの。
- 今のパラダイムシフトは、「Intelligent Cloud」と「Intelligent Edge」への変化。
- 「Intelligent Cloud」と「Intelligent Edge」は、以下３つの特性で構成されるとのこと。
  - Multi-device,Multi-sense(マルチデバイス、マルチセンス)
  - Artificial Intelligence(AI)
  - Serverless(サーバレス)

![スクリーンショット (255).png](https://qiita-image-store.s3.amazonaws.com/0/189488/d68da943-d33c-7e4d-4164-2bc165215a72.png)

## 「Digital Transfomation/デジタル変革」へのキーワード

- 次の４つがキーワード<br>
  - Empower employees（力を発揮しやすい仕事環境を作る）
  - Engage customers（顧客を引き付ける）
  - Optimize operations（作業を最適化する）
  - Transform products（プロダクトからデータを抽出し利用する）

![スクリーンショット (257).png](https://qiita-image-store.s3.amazonaws.com/0/189488/21fbf781-12e9-fbda-9872-89eb4b95d968.png)

- ４つのキーワードを可能にするのは、以下の４つの要素
  - Modern workplace（近代的な職場）
  - Business applications（営業、マーケティングツール）
  - applications & infrastructure（アプリケーション、インフラ基盤）
  - Data & AI(データ、AI)

![スクリーンショット (259).png](https://qiita-image-store.s3.amazonaws.com/0/189488/37d5b8b3-0eb7-3d37-a6bf-52889d5f3728.png)

## Modern workplaceでの変化要素

- Routine tasks(ルーチンワーク) ⇒ Creative & critical thinking(クリエイティブ & クリティカルシンキング)
- Individual productivity(個人的な生産) ⇒ Dynamic & integrated solutions(動的でアジャイル型のチームワーク)
- Disparate system & tools(個別のシステムとツール) ⇒ Coherent & integrated solutions(統合されたソリューション)
- Individual threats(個人的なセキュリティ脅威) ⇒ Sophisticated organizationl breaches(組織的なリスク対策)

![スクリーンショット (265).png](https://qiita-image-store.s3.amazonaws.com/0/189488/c2eacdc2-4555-3b0e-2561-6dad30559456.png)

## Business applicationsでの変化要素

- Monolithic suites(パッケージソフト) ⇒ Modular, modern,business applications(モジューラ型の近代的な営業ツール)
- Disconnected data silos(分断されたデータ類) ⇒ Connected data graphs & artificial intelligence(統合データのグラフ化とAI活用)
- Custom logic & extensibility(カスタムロジック、拡張性) ⇒ Common data model & composite apps (共通データモデル、複合アプリケーション)

![スクリーンショット (264).png](https://qiita-image-store.s3.amazonaws.com/0/189488/ca89b324-a2fb-74e2-252c-236de52cf5ac.png)

## Applications & infrastructure / Data & AIでの変化要素

- Private versus public cloud(プライベート、パブリッククラウド) ⇒ Distributed hybrid cloud(分散型ハイブリットクラウド)
- Virtualization(仮想化) ⇒ Containers & microservices(コンテナー、マイクロサービス)
- Disparate databases(個別のデータベース) ⇒ Connected data estate(統合データベース)
- Big data & machine learning(ビッグデータ、機械学習) ⇒ Cognitive services & AI(コグニティブサービス、AI)

![スクリーンショット (263).png](https://qiita-image-store.s3.amazonaws.com/0/189488/8b6c8853-9342-7d87-2999-328950696949.png)

## デザインシンキング
- システムでValue(価値)を生み出すには、デザインシンキングが重要
  - 理解（顧客業務、環境、市場）
  - 発想（新しいアイデア）
  - 試作（アイデア、イメージを素早く形にして、検証する）⇒ POC

## チームワーク
- 成功に導くには、各チームが力を合わせて、同じ方向を向くことが重要
  - Salesチーム(営業)
  - Marketingチーム(マーケティング)
  - Technicalチーム(技術)

# 参考

**デザイン・シンキングとは何か**
http://business.nikkeibp.co.jp/article/design/20140508/264172/
Unity 2017 で .NET 4.6 にしたら Rider が赤くなった


## TL;DR

C# のバージョンを上げて Rider が赤くなった場合、 Mono のバージョンを確認する

## 症状

Unity 2017.1 で .NET 4.6 / C# 6.0 が使えるようになりました。

https://docs.unity3d.com/2017.1/Documentation/Manual/ScriptingRuntimeUpgrade.html

ということで設定したところ、 [Rider](https://www.jetbrains.com/rider/) がうまくソリューションを読んでいないような様子。

![Screen Shot 2017-07-19 at 22.14.15.png](https://qiita-image-store.s3.amazonaws.com/0/21888/4e608b01-edcf-1564-7806-6e8b5b3d047c.png "Screen Shot 2017-07-19 at 22.14.15.png")

`Cannot resolve symbol 'int'` と言われていたり、随所に赤波線が…
ちなみに Editor でのコンパイルは通っている。

## 原因と解決

### Mono のバージョンを確認

![Kobito.SDdQxu.png](https://qiita-image-store.s3.amazonaws.com/0/21888/c0bd107b-35b2-dd02-8330-67c0adae2170.png "Kobito.SDdQxu.png")

Preferences > Build, Execution, Deployment > Toolset and Build 

から Mono executable path を確認

```
$ ls -la /Library/Frameworks/Mono.framework/Versions/Current
lrwxr-xr-x  1 root  admin  49  4  2  2016 /Library/Frameworks/Mono.framework/Versions/Current@ -> /Library/Frameworks/Mono.framework/Versions/4.2.3
```

4.2.3 でした。

### Mono のアップデート

せっかくなので brew でインストールしなおす。


```
$ brew install mono

$ mono -V
Mono JIT compiler version 5.0.1.1 (2017-02/5077205 Wed May 31 14:47:04 BST 2017)
```

ちなみにアンインストール方法は
http://www.mono-project.com/docs/about-mono/supported-platforms/osx/#uninstalling-mono-on-mac-os-x

### Mono を指定し直す

![Kobito.30HJbm.png](https://qiita-image-store.s3.amazonaws.com/0/21888/690adc29-8f80-86c0-e114-ff5ffc6490a4.png "Kobito.30HJbm.png")

候補に出てこないときは、再起動したら出てくるような気がする。

### 直った

![Kobito.mSZo67.png](https://qiita-image-store.s3.amazonaws.com/0/21888/c05ea4b5-9f7f-8146-7d9f-eb4afb02e425.png "Kobito.mSZo67.png")

### 謎

Mono 4.0.0 で C# 6.0 自体はサポートされているのだが…?
http://www.mono-project.com/docs/about-mono/releases/4.0.0/

そのあたりはちゃんと追究していない。
とりあえず最新は正義。


## 感想

- C# 6 は神
- Mono のバージョンとか依存謎


## 他にためしたこと

- File > Invalidate Caches / Restart...
Swiftの辞書(Dictionary)をkeyの長さでsortする。

```swift
var dic:[String:String] = ["しし":"cc", "お":"o", "あああ":"aaa"]
print(dic.sorted { return $0.key.characters.count < $1.key.characters.count })
// -> [(key: "お", value: "o"), (key: "しし", value: "cc"), (key: "あああ", value: "aaa")]
```
戻ってくるのは「sortされた辞書」ではなく，[(key,value)] （※key,valueを内容とするタプルの配列）のようだ。
[Unity]AssetBundleとの歩み

# AssetBundleとの歩み
Unityでモバイル開発と言えばAssetBundle。
AssetBundleと言えば毎年UniteTokyoやCEDECでもセッションが組まれる命題。
振り返れば自分もAssetBundleとの付き合いが長い。
そこでAssetBundleに対してこれまでどういったアプローチをかけてきたかを残しておこうと思います。

## ○1.触り始めの印象(Unity3系？の時代)
 - 管理クラスや内部の処理、エディタ拡張は他の担当者が実装していた。正直関心が薄かった。
 - 「Unity上のアセットをファイルに固めてダウンロードリソースに使える凄い機能」程度の認識。
 - Unity製スマホアプリ(実行ファイルそのものを最小にして公開する)ならほぼ必須。

## ○2.読み込み機能を一通り作ってみた(Unity4系から5系への変遷期)
 - 転職先でがっつりUnityを触ることになる。
 - しかし転職先では担当する人がいなかった。誰も居なかったので担当になる。
 - 圧縮設定がいくつもあってよく分からん。調べないと。
 - 予想よりもストレージ使用量が膨らんでいる何故だ。調べないと。
 - LoadFromCacheOrDownload は何やってるんや…。調べないと。
 - UniteTokyo2015の[コロプラのセッション](http://colopl.co.jp/news/pdf/2015042701.pdf)での記事が印象的だった…。同じような問題に直面しつつあったため、似たような機能を作ろうかと着手。(安易)

## ○3.コロプラセッションの影響を受けて管理クラスを設計(Unity4系)
 - 独自スクリプトがアタッチされたPrefabは動的コンパイルで地雷する可能性がありキケン(浅い理解度、予防策)
 - アセットの依存関係の解消がコスト高(PushAssetDependencies と PopAssetDependencies)と判断し依存しないリソース設計を提唱…。
 - 出力するアセット名、バンドル名、圧縮設定、バージョンなどを記載したリソース設定ファイルを用意。それに則ってひたすら BuildAssetBundle、バージョンやCRC、ファイルサイズなどが記載されたJsonを使って管理する機能を開発。
 - ジョブスケジューラ「Rundeck」と連携し、バージョン管理ソフトとの連携、ビルドからアップロードまで自動化。
 - しかしこの機能を用いたプロジェクトはペンディングとなる。
 - まぁ使いまわせる機能だしな！と自分に言い聞かせる。

## ○4.Unity5の登場
 - Inspectorからオーサリング設定できるのか…神か。
 - manifest？なにそれ美味しいの？依存関係が管理されてるの？ありがたい…。
 - Unity4系で実装した処理が BuildAssetBundles にまとまってるやんけ…まじか…。
 - オーサリング設定できるのに肝心のビルドを行うにはエディタプログラムやコマンド叩く必要があるのは何でなのさ…。

## ○5.Unity公式の[AssetBundleManager](https://www.assetstore.unity3d.com/jp/#!/content/45836)と出会う
 - <b>いやま゛っ↓てたよぉ！やっと公式さんが対応してくれたゆぉ！</b>
 - と思ったのも束の間… LoadFromCacheOrDownload が用いられており、2.や3.の時代に起きた問題が脳内リフレイン。
 - アセットで公開されているプログラムを直接編集する事は更新時に手動マージが発生すると恐れ、参考にしつつｵﾚｵﾚAssetBundleManager設計へ着手することに…。
 - 多々問題になる音声データに関してはＣＲＩに丸投げした。
 - やはり自社の都合の良いように開発した方が早いかな…。

## ○6.運用までに至れた時の理解度および印象
 - AssetBundle のほかに色々付随した機能を提供する必要があったため、それらを実装、サービスインに至る。
 - 自動化は常に並行作業。
 - このときはリソース量がそこまで多くないことが幸いし、エディタプログラムでｺﾞﾘｺﾞﾘ自動化し運用に耐えていた。
 - しかし仕組みを見直す必要を感じる。

## ○7.そしてUniteTokyo2017
 - [新アセットバンドルツール詳解：アセット設定とアセットバンドルのワークフローを簡単に](https://www.slideshare.net/Unite2017Tokyo/unite-2017-tokyo-75808089)
 - <b>いやま゛っｒｙ</b>
 - ｵﾚｵﾚAssetBundleManagerの再設計は保留にするべきだろうか…。

## ○8.それでも残る課題や願望
 - PC版プラットホームとのマルチ展開がここ数年普及し始めている
    - PC版といえばなにより解析の敷居が低い(モバイルでも解析できますけども)
    - コンテンツ保護を厳密にするのであれば次の機能が欲しい
        - アセットバンドル生成後に生成されたアセットバンドルを暗号化する処理
        - 暗号化したアセットバンドルをランタイム動作時に複合化する処理
    - パフォーマンスの影響がなぁ…上手い具合に出来ないものか…と思案中
 - 端末種別によってバンドルに含める対象ファイルを変えたい
    - 同一のファイルをもとに生成するとどうしても妥協せざる得ない事象が発生する
    - 例えば iOS の Tex.unity3d には hoge.pvr を Android の Tex.unity3d には hoge.png を設定したい
 - 新しいアセットバンドルツールに機種ごとの設定を持たせるような機能入らないかな…(他力本願)
    - 「親フォルダで階層を分けてiOSバンドル生成時にはAndroid専有アセットの情報をクリアする」といった力技しかないのかなと悩み中。