非公式Scratch 3.0のIchigoJam用extension

#1.はじめに
ScratchID:[Sheep_maker](https://scratch.mit.edu/users/Sheep_maker/)という方が、[非公式Scratch 3.0](https://sheeptester.github.io/scratch-gui/)を公開しています(以下、Scratch 3.0SMと呼ぶことにします)。
このScratch 3.0SMは、ブロックを自作し、「extension」として追加できるようになっています。

そこで、IchigoJamのプログラムを作成して実機に送信できるブロックのextensionを公開しました。
[Scratch 3.0 IchigoJam extension](https://sije.shizentai.jp/)

#2.何ができる？
Scratchのビジュアルプログラミングで、IchigoJamのプログラムを作成できます。
IchigoLinkとUSBモジュールを合わせて使えば、ブロックで作ったプログラムを実機に転送できます。

[シリアル通信とブラウザJavaScriptをブリッジする IchigoLink のご紹介](http://mitsuji.org/?p=393)
[イチゴジャムレシピ - USB-シリアル](https://15jamrecipe.jimdo.com/周辺機器/パソコンと接続/usb-シリアル/)


#3.使いかた
はじめにIchigoLinkを起動させておきます。
![img_terminal_ichigolink.png](https://qiita-image-store.s3.amazonaws.com/0/325198/e6245eef-54dd-d9da-af94-73edbf5ae8f2.png)

[Scratch 3.0SM](https://sheeptester.github.io/scratch-gui/)にアクセスし、画面右下のボタンを押すと、extensionの選択画面が表示されます。
![img_menu_button.png](https://qiita-image-store.s3.amazonaws.com/0/325198/6cdb04eb-b59b-74e3-915c-0471f11cdff1.png)
![img_menu_extension.png](https://qiita-image-store.s3.amazonaws.com/0/325198/7af84164-bde8-153d-ba55-b23e44a8c626.png)

「Choose an extension」を選択すると、URLの入力フォームが表示されるので、ここにextensionのURLを入力します（先にIchigoLinkを起動させておかないとエラーになるのでご注意ください）。
今回作ったextensionのURLは以下の通りです。
https://sije.shizentai.jp/extension/ichigojam_2.js

これでIchigoJam用のブロックが追加されます。
![img_menu_ichigojam.png](https://qiita-image-store.s3.amazonaws.com/0/325198/6d474b0c-158b-caf3-a63d-5b2055c21963.png)

USBモジュールでIchigoJam実機とパソコンをつないであれば、IchigoJamのブロックをクリックすることでプログラムを実機に送信できるようになります。
IchigoLinkを起動する前にextensionの読み込みを行ってしまうと、エラーになるので気をつけてください。
エラーになった場合は、ページの再読み込みが必要になります。
![img_setup.png](https://qiita-image-store.s3.amazonaws.com/0/325198/377416ba-0531-10fd-6867-9040a46ff992.png)
![img_example_led.png](https://qiita-image-store.s3.amazonaws.com/0/325198/7c2c2e8a-db00-cdaa-5500-efb91222544a.png)
![img_example_console.png](https://qiita-image-store.s3.amazonaws.com/0/325198/7db5cb0a-54ad-1272-cbc4-597dbb0f868d.png)


#4.ブロック
ブロックに書かれているコマンドがそのままIchigoJamに送信されます。
プログラムを作る際は、最初をNEWブロック、最後をRUNブロック（またはSAVEブロック）にします。
引数はプルダウンメニューから選びます。

###NEWブロック
![img_block_new.png](https://qiita-image-store.s3.amazonaws.com/0/325198/223286f1-08c2-a57d-834a-c84c4229a8c6.png)

実行すると、ESCコードを送信後、NEWコマンドを送信します。
このブロックが実行されると、次のブロックからは行番号付きでコマンドが送信されるようになります。

###LED, OUT, PWM, WAITブロック
![img_block_led.png](https://qiita-image-store.s3.amazonaws.com/0/325198/2f5b063d-0baf-0680-28e5-d4637b81ffa1.png)
![img_block_out.png](https://qiita-image-store.s3.amazonaws.com/0/325198/3c6be32f-24e4-40bc-a492-651021e0eb80.png)
![img_block_pwm.png](https://qiita-image-store.s3.amazonaws.com/0/325198/451e58e7-a0a0-ee4b-6562-4bf3172a88cb.png)
![img_block_wait.png](https://qiita-image-store.s3.amazonaws.com/0/325198/750c47f4-4b00-3117-fe13-5d277b595ae4.png)

各コマンドを送信します。引数はプルダウンメニューから選択できるようになっています。
ブロックを実行するたびに、行番号がインクリメントされます。

###GOTO, LABELブロック
![img_block_goto.png](https://qiita-image-store.s3.amazonaws.com/0/325198/1dceb046-378f-0075-3eab-ea338aa8702a.png)
![img_block_label.png](https://qiita-image-store.s3.amazonaws.com/0/325198/3d556a52-98f4-6585-4e92-71c86238762b.png)

GOTOの引数はラベルになっています。
ラベルブロックは行番号とラベルを送信します。GOTOブロックと組み合わせて使ってください。
こちらもブロックを実行するたびに、行番号がインクリメントされます。


###SAVE,RUNブロック
![img_block_save.png](https://qiita-image-store.s3.amazonaws.com/0/325198/b539cd91-465a-8050-3b32-a1e828b85371.png)
![img_block_run.png](https://qiita-image-store.s3.amazonaws.com/0/325198/f5076f9e-d66b-3231-aa60-488168ee5b8f.png)

プログラムの末尾に使ってください。
それぞれSAVEコマンド、RUNコマンドが送信されます。


#5.プログラム例
Lチカのプログラム例です。
![img_example_ledlight.png](https://qiita-image-store.s3.amazonaws.com/0/325198/e90bad15-dece-23ab-4015-a0e4e8a9f778.png)

#6.まとめ
[Scratch 3.0SM](https://sheeptester.github.io/scratch-gui/)で使えるIchigoJam用extensionを使えば、ScratchのブロックでIchigoJamのプログラムを作成できます。公式のScratchでは使えないのでご注意ください。
より詳細な説明はwebサイトをご覧ください。
[Scratch 3.0 IchigoJam extension](https://sije.shizentai.jp/)

#7.課題
・IFコマンドの実装
・NEWコマンドの上にブロックをつなげられないようにする
ただし、この2点は[Scratch 3.0SM](https://sheeptester.github.io/scratch-gui/)の仕様上、現在は実現できないようです。
Sheepmaker氏のアップデートを待って、可能になり次第、実現したいと考えています。

また、公式にScratch 3.0がリリースされたら、そちらでも使えるextensionを作る予定です。

#8.訂正(2018/12/18)
IchigoLinkの起動のタイミングについて修正しました。
先にIchigoLinkを起動させてから、extensionを読み込むようにお願いします。