Processingで作ったものをWordPressにアップする →p5.jsで書き直すのがイイみたい
こんにちは。
野郎です。
今日はProcessingで作ったものをwordpressにアップする方法だよー。
あのね、野郎はこのあたり、だいぶ調べなきゃわからなかったです。遠回りした・・・。聞ける人がいないとは、時にこういうことになるのを受け入れることなのだ・・・。自分で調べたから、筋肉になったよ！
結論から書くよ。
結論：javaで書いたスケッチは、processing.js（ほぼjavascript）かp5.js（これもjavascript）に移植しましょう。
予想：すごいヤヤコシイことやってれば別だけど、移植はそんなに難しくないと思われる。
最初はさ、移植しなくても動くのかな？と思ったのよ。だけど全部は動かなかったのね。今回は、その思考試行愚行過程も少し反映された構成です。
ProcessingをWordpressへ
processingはグリグリ動くので、とっても面白いです。まだ教科書を写経しつつ改造などが多いけど、それでも楽しいっす。やはり楽しいほうがイイよね！野郎は長年鍛えた修行回路があるんで、つい苦行にしてしまいがちですが、そりゃ楽しいほうがイイのでであります。
せっかく作ったんだから、ここに乗せたいなと思うのは人情です。それで、少し調べてみたの。
このブログはwordpress書いているんだけどさ、processingで作ったものを乗っけようかと思ったんだけど、イマイチピタッとしたのが見つけられなかったんだよ。できないわけは絶対にない（だって載せてる人がいるんだもの）けど、どうすりゃいいんだーって思ったのです。
よーく調べて、ちゃんとよく考えたらできました。焦ってはいけません。落ち着きが大事です。
備忘録的にも書いておこうと思ったのですな。
このサイトを見るのです！
検索したのは、processing wordpress how to とかだったかな。この手のは英語のほうが情報が多い気がするので。
えーと、試行錯誤しましたが、最終的にはここに書いてある通りにやればできます。
How To Insert Processing Sketches Into WordPress Posts
ありがとうございますー。
ここに書いてある通りにやればできるんだけど、一つだけ注意です。「MINE types」っていうプラグインを使って、WordPressにアップしても大丈夫な拡張子を登録するのね。お手本サイトではProcessingの「.PDE」を登録してって書いてあります。ここで、「.js」ってjavascriptの拡張子も同時に登録するのね（ウルトラ重要）。
「.js」を登録しておかないと、security reasonで「Processing.min.js」ってブラウザでProcessingを動かすファイルがアップできません。これがアップできないとProcessingの「.pde」ファイルを乗せても何も表示されないっすー。
ここだけが注意点で、他は書いてある通りにやってくださいな。
作ったもの
試しに作ったものを載せてみるね。
一つ目は今使っている、learn processingって本のエクササイズとかを改造したものです。動くー。これだけでも楽しいー。
なんだかキラキラしていてアッパーな気持ちです。
次は二つ目ー。
ボールがキラキラして色が変わるもの。重力加速度を変えたりした。
野郎はこういうの見てるの好きみたいなんだよな。眺めてしまう。
あれ・・・？
真っ黒いままだな・・・・。
うーん。
グリグリ動か、、、、ない。ガビーン。
動かないのかー。
違いは何かしら
うーんとさ、一応ちゃんと動いたものがあったってことはさ、wordpressにもっていき方はたぶんあってるんだと思うんだ。そこは一つ進歩です。前進。野郎頑張ってる。えらい。自分を褒めるのです。大事。
一つ目のはさ、変数と条件分岐と繰り返しだけでできているのね。二つ目のは、配列とかクラスとか使ってるの。違いはきっとそこで、動かなかった原因がこれなのかと。
よく考えたら当たり前な気がするけど、やっぱりjavascriptの書き方に直さなきゃいけないのじゃないのかな。調べてみたら、書き方結構違うんだもん。varとかfunctionとか。
参考にしたサイト（ありがとう！）：
Processing to P5 — How to convert?
OpenProcessing: converting code written in Java to JavaScript
読んでたらだんだん理解してきました。そしてさ、前に紹介したprocessing の入門書は、コードをp5.jsで書いたものがあった気がしたんだよな。その本の配列とかクラスとかの部分を読んでみたら、移植も簡単にできそうな気がする。知りたい部分を読んでみて、わからないところだけネットで調べればいいんだもんな。
そして、調べたらP5.jsバージョンの本、やっぱりあった！そしてPDFもありました！ヒャッホーーーーゥ！
結論
野郎は、基本的にはjavaベースのProcessingで勉強を続けます。はい。やってる本、やりたい本がjavaベースだし。
そして、ここに乗せたいときだけ、頑張って翻訳します。それはそれで勉強になると思われるし。
しかし、この結論に至るまで長かった。。。。調べまくった・・・。
