MirrorAPI Playgroundの使い方


標準では、ウェアラブルカメラ止まりなGlassです。自分で色々いじれる段階ですのでイジらない手はありません。とはいえ、GDK使ったりGlassware用のサーバ用意したりするのは、初めの一歩にはハードル高いですよね。そこで、Googleさんが用意してくれているPlaygroundを使ってみましょう。
![kobito.1398579524.009205.png](https://qiita-image-store.s3.amazonaws.com/0/4036/146f3069-f1df-7884-3904-75cc43436275.png "kobito.1398579524.009205.png")
[リンク](https://developers.google.com/glass/tools-downloads/playground)

上記ページにアクセスして、認証通してあげればMyGlassに様々なカードを挿入することが出来ます。色々いじって可能性を探りましょう。

# 下準備
- USに移動する
- Gmailアカウント x1
- GCPプロジェクト　x1
- Glass xN

Glassがひも付けされているアカウントで、GCPのプロジェクトをひとつ作っておきます。
## GCPプロジェクト参考ページ
- [GAE](appspot.com)
- [GAS](script.google.com)

上記２ページからプロジェクトを作るのが簡単です。

AppsSpot上での新規作成ボタン
![kobito.1398565278.082419.png](https://qiita-image-store.s3.amazonaws.com/0/4036/7dd20edb-4893-d66e-3e1a-24b982abaa88.png "kobito.1398565278.082419.png")

GAS上での新規作成ダイアログ（空のプロジェクトでOK）
![kobito.1398565220.911319.png](https://qiita-image-store.s3.amazonaws.com/0/4036/951839c3-e2d5-a4a8-705f-4a7461c12d9b.png "kobito.1398565220.911319.png")


## MirrorAPI参考ページ
-  [MirrorAPI ガイド]( https://developers.google.com/glass/develop/mirror/index)
- [MirrorAPIリファレンス](https://developers.google.com/glass/v1/reference/)

# レッツプレイ！全部で４ステップ
Playgroundが使えようになるまで全部で４ステップあります。
（下準備で作成したプロジェクトをhogeGlassだとします）

1. DeveloperコンソールでhogeGlassのMirrorAPIを有効にする
1. hogeGlassのMirrorAPIの設定を行う
1. ClientIDの取得
1. PlaygroundにClientIDでAuthrize

上記設定でPlaygroundが動きます。

## Step0(下準備) プロジェクトの新規作成
[自分のプロジェクトの一覧ページ] (https://console.developers.google.com/project) で、プロジェクトを作成します。プロジェクト名を指定して下さい。プロジェクトIDは自動生成されます。

![kobito.1398565961.995592.png](https://qiita-image-store.s3.amazonaws.com/0/4036/34cbfea5-1e1a-9c88-b0de-6e9345969bea.png "kobito.1398565961.995592.png")

しばらく待つと、空のプロジェクトが作成されました。おめでとうございます！
![kobito.1398566050.904865.png](https://qiita-image-store.s3.amazonaws.com/0/4036/09325824-716d-36ee-6668-e9d82728b772.png "kobito.1398566050.904865.png")


## Step1 DeveloperコンソールでMirrorAPIを有効にする

[自分のプロジェクトの一覧ページ] (https://console.developers.google.com/project) から、今回作成した新しいプロジェクトを選択します。
APIと認証＞API に入りMirrorAPIを有効にします。

初期設定では無効になっている。
![kobito.1398566284.523517.png](https://qiita-image-store.s3.amazonaws.com/0/4036/40d7ae99-b0ef-b045-65ee-3431ecdc7a05.png "kobito.1398566284.523517.png")

有効にすると、リストの上部に移動し有効(緑色)になる。
![kobito.1398566316.878669.png](https://qiita-image-store.s3.amazonaws.com/0/4036/706c0a7c-2fbb-6784-9ff1-7449213f11af.png "kobito.1398566316.878669.png")

＊ この段階でデフォルトで有効になっているAPIでいらないものがあれば外したり、有効になっていないもは有効化しましょう。

## Step2 MirrorAPIの設定を行う

今回の目的は[mirrorAPI Playground](https://developers.google.com/glass/tools-downloads/playground)を使用することなので、hogeGlassプロジェクトに[mirrorAPI Playground](https://mirror-api-playground.appspot.com)のURLを設定します。

プロジェクトページの APIと認証＞認証情報 に入り新しいクライアントIDを作成ボタンをクリックします。

- アプリケーションの種類
 - ウェブアプリケーション

承認済みのJavaScript生成元のフォームに以下のURLをコピペします。
`https://mirror-api-playground.appspot.com`

![kobito.1398579990.618482.png](https://qiita-image-store.s3.amazonaws.com/0/4036/3f8ab970-7e99-9f57-a7db-9ff426e773df.png "kobito.1398579990.618482.png")


保存して元に戻ると、ウェブアプリケーションのクライアントIDが作成されていると思います。

以上で MirrorAPIの設定終了です。


## Step3 ClientIDの取得
前段ステップでClientIDが作成されたので、そのIDをコピーします。

![kobito.1398579828.987426.png](https://qiita-image-store.s3.amazonaws.com/0/4036/b9c18543-4f58-ddd2-bc76-3753c26cb418.png "kobito.1398579828.987426.png")

上記図の1段目の値
（上記IDはサンプルです、既に存在しないので適宜ご自分のIDをコピーしてください）



## Step4 PlaygroundにClientIDでAuthrize
[Playground](https://developers.google.com/glass/tools-downloads/playground)ページに移動し、Authorizeのフォームに全ステップでコピーしたClientIDを入力します。
[Playground](https://developers.google.com/glass/tools-downloads/playground)ページには、Glassにひも付けされたアカウントでログインしておいてください。

![kobito.1398580172.544815.png](https://qiita-image-store.s3.amazonaws.com/0/4036/7f9468ab-ab4c-19a0-2b69-1fd9fde42e8c.png "kobito.1398580172.544815.png")

Authorizeをリクエストすると、許可リクエストの別ウインドウが開きます。PlaygroundアプリケーションがGlassタイムラインの表示と管理を行うことを承認しましょう。

![kobito.1398580249.921430.png](https://qiita-image-store.s3.amazonaws.com/0/4036/f7a3f58a-d3ab-071c-d260-e89008b22912.png "kobito.1398580249.921430.png")

以上で、完了です。

## Step Final　試す＆楽しむ

様々なカードタイプのテンプレートが有りますので、いじりつつInsertItemボタンを押してみますと、無事に配信されると思います。