構文エラーがあってもテキスト言語（p5.js）とブロック言語を変換可能にした
はじめに
この記事はProcessing Advent Calendar 2018 - Qiitaの11日目の記事となります。
2016年以来2年ぶりのProcessing Advent Calendarへの参加で、最後に過去記事も載せますので宜しければそちらもご覧ください。
※ 今回の記事は以前紹介したシステムの新機能についてなので、上記記事を先に読むと良いかもしれません。
本編
今年のProcessing Advent Calendarにこのような記事や
このような記事
がありましたが、私もProcessingでプログラミングの楽しさを知った一人です。そんな人が一人でも多く増えたら良いなと考え、プログラミング初心者向けとしては主流（？）のブロック型言語とp5.js（JavaScript）を組み合わせたプログラミング環境を作っています。今回はそのプログラミング環境に、ブロック言語の一つの「弱点」を解消しようと実装した機能を紹介したいと思います。
上の動画を見ると、入力した文や式が途中だったり、不完全であってもブロックに変換できているのが分かると思います。今までは文が完全な状態でなければ変換されなかったのですが、入力途中でも変換できるようになったため、テキストからブロックへの変換の即時性が増し、よりブロックとテキストの対応付けが分かりやすくなったのではなと考えています。
以下のような不完全なプログラムでもそれに対応した「穴あき」ブロックを作ることができます。テキストからわざわざ穴あきブロックを作ることはないですが、ブロックでプログラミングをする際はこの穴あきブロックがよく発生します。今までは穴あきブロックがあると構文エラーを起こしテキストからブロックへの変換ができなくなっていたのですが、この機能によってブロックの方でプログラムを作りかけでもテキストとの変換が常に保たれるようになりました。
if文やfor文などでは、（）や｛｝、条件式などがなくても変換出来るようになっています。もし文法を忘れてもそこはブロック言語の良い所を利用して、ブロックの断片を生成できればあとはブロックの組み立てでプログラミングをすることができます。ブロックで組んだとしても右のテキストエディタにはブロックが出力した正しいコードが載っているのでそこで構文を確認できます。構文があやふやなプログラミング学習の初期段階にはもってこいなのではないでしょうか。
今回は短いテキストをリアルタイムにブロックに変換する例だけを見せましたが、以下のような穴あきブロックだらけのプログラムであっても、テキストエディタの方に変更を加えたらブロックへの変換が行われます。ブロックを組んでいる最中にある一部分だけはテキストで組みたいと思ったときは、たとえプログラムを組みかけでもテキストエディタに打ち込めばそれがブロックに変換されます。
利点、出来るようになった事まとめ
ブロックでプログラミングをしようと思ったとき、複雑なものになるといちいちドラッグアンドドロップで作るのは非常に面倒くさく、テキストで書きたくなるときがあります。しかし、ブロックで組んでいるとどうしても穴あきブロックが現れてテキストからブロックへの変換が出来ない場面がありました。それを今回の機能では解決することができます。
また、構文を忘れてしまったとき大量のブロックから該当するブロックを探すのではなく、断片的でもそのブロックの「キーワード」になるようなものさえわかっていれば具体的な構文があやふやでもそのブロックを取ってくることができるようになり、ブロックが出力するテキストのコードから正しい構文も学ぶことができます。
これでまた一歩ブロックとテキストが近づきました。
おわりに
Advent Calendarでは毎年みなさんのオシャレでセンスの塊のようなProcessing作品に出会えるので、毎年この時期を非常に楽しみにしています。私はProcessingでプログラミングをするのが大好きなのですが、皆さんのようなオシャレな作品は到底作れないので参加するのに若干ためらいがありました。しかし、大好きなProcessing業界を少しでも自分も盛り上げたいと思い、ほかのみなさんとは違った角度からにはなってしまいましたが、今年はこの記事を投稿しようと思いました。
昨年は、AtomのAdvent Calendarに浮気してしまいましたが、今年はProcessingで盛り上がる25日間の1日を担当できて良かったです。過去記事もあるのでよろしければご覧ください。
2015年
2016年
2017年（Atom）
