WebGLの続きでもやるか！
こちらのチュートリアルを参考に、２つのcanvasを使ってみた。Chromeでは赤と青の三角形が表示できている。あとは、共通のコードを抽出して、シェーダや頂点などの固有のデータだけを指定して描画できるようにしたいな。
WebGL の勉強でもするか！
Chrome で WebGL がデフォルトでサポートされたし、他のブラウザも開発版がサポートしだしたし、WebGL の何か作っていくぞ。
OpenGL ES2.0 アプリでなくて WebGL を選んだのならば、Web ならではのものを作りたいな。Web から何かデータを取り込んで動的に表示してみたい。でも、シェーダのソースファイルとか、データに応じて動的に変更するようなこととか、必要なのか、できるのか、、、自分でも何言ってるのかわからんな。
何を勉強していけば面白そうなことができるか、ぐだぐだ書いてくぞ！
1. 色んな人がホームページとかブログとかつぶやきから用意された WebGL アプリを利用する。
文字とかをパラメータとして与えたら、それが WebGL を使ってクルクル回るとか。。そういうアプリを提供するAPIを作ってみる？
色々いじっていると WebGL の規格が正式1.0になるまでに少しずつ仕様が変わったため、世の中には動いたり動かなかったりするページがある。そうならないよう、アプリというフレームワークはどこかのサーバでアップデートして、個々のホームページはメンテナンス不要ってのがいいな。
２．やっぱ写真とかを WebGL でかっこ良く表示する！
サムネイルとかを3Dっぽく表示したり、大きさとか色とか、3Dならではで表示したりしても面白いんじゃないか！？
３．ちがうでしょ、3Dやるなら3Dモデル読みこんでもっとマニアックにするとか。
3DモデルってGoogleのWareHouseから取ってくるのか？なんだろ、3Dモデルに対してそれぞれシェーダなくてもある程度汎用的なシェーダを作れば使いまわせるのかな？なんにもわかってないな。。くそう。何が嬉しいのかもいまいちわからんな。。。人気のある3Dモデルをスクリーンセーバー的に自動で表示するのも楽しいかも。
うーん、妄想は広がるが、やっぱ簡単なところからだな。
じゃあ、まずは、以下の順番で勉強してみよう。
１−１．WebGLのHelloTriangleをこのブログから書いてみる。
１−２．WebGLのプログラムに外からパラメータを与えてみる。
ポイント１：オリジナルのソースだと body の onLoad に WebGL のプログラム開始の main 関数を割り当てていたのだが、fc2 のブログでそういう風に書く方法がわからないので、script の最後で main 関数を自動的に実行するようにした。
ポイント２：上記に伴い、canvas の要素はそれよりも前に記載しておく。そうしないと、WebGL の コンテキストが初期化できない、的なエラーが出てしまうようだ。
１−２．WebGLのプログラムにパラメータ代入
本筋に入る前に、そもそもひとつのページに WebGL を表示するための canvas を複数表示したりできるのかな？今使っているソースコードだと、WebGL関連のライブラリのソースコードの中でグローバルな変数（glとか）を使っているようだし、少し試したけどうまく動作しない。どのソースコードが共有できて、どこが canvas 毎に記載すべきなのかわからんぞ。ああ、Javascript がわかっていないのが痛い。。。
OpenGL ES2.0 アプリでなくて WebGL を選んだのならば、Web ならではのものを作りたいな。Web から何かデータを取り込んで動的に表示してみたい。でも、シェーダのソースファイルとか、データに応じて動的に変更するようなこととか、必要なのか、できるのか、、、自分でも何言ってるのかわからんな。
何を勉強していけば面白そうなことができるか、ぐだぐだ書いてくぞ！
1. 色んな人がホームページとかブログとかつぶやきから用意された WebGL アプリを利用する。
文字とかをパラメータとして与えたら、それが WebGL を使ってクルクル回るとか。。そういうアプリを提供するAPIを作ってみる？
色々いじっていると WebGL の規格が正式1.0になるまでに少しずつ仕様が変わったため、世の中には動いたり動かなかったりするページがある。そうならないよう、アプリというフレームワークはどこかのサーバでアップデートして、個々のホームページはメンテナンス不要ってのがいいな。
２．やっぱ写真とかを WebGL でかっこ良く表示する！
サムネイルとかを3Dっぽく表示したり、大きさとか色とか、3Dならではで表示したりしても面白いんじゃないか！？
３．ちがうでしょ、3Dやるなら3Dモデル読みこんでもっとマニアックにするとか。
3DモデルってGoogleのWareHouseから取ってくるのか？なんだろ、3Dモデルに対してそれぞれシェーダなくてもある程度汎用的なシェーダを作れば使いまわせるのかな？なんにもわかってないな。。くそう。何が嬉しいのかもいまいちわからんな。。。人気のある3Dモデルをスクリーンセーバー的に自動で表示するのも楽しいかも。
うーん、妄想は広がるが、やっぱ簡単なところからだな。
じゃあ、まずは、以下の順番で勉強してみよう。
１−１．WebGLのHelloTriangleをこのブログから書いてみる。
１−２．WebGLのプログラムに外からパラメータを与えてみる。
１−１．WebGLのHelloTriangle
以下のサンプルは、OpenGL ES2.0 プログラミングガイドのサイトからダウンロードしてきたChapter2のコードをベースとしたものだ。WebGLをサポートしたブラウザでないと、エラーダイアログが表示されるはず。現時点でのGoogle Chromeは標準でサポートしているので、Chromeを使うのがらくちんかな。それ以外のブラウザを使いたいのならば、Learning WebGL（の翻訳）を参考にしよう。ポイント１：オリジナルのソースだと body の onLoad に WebGL のプログラム開始の main 関数を割り当てていたのだが、fc2 のブログでそういう風に書く方法がわからないので、script の最後で main 関数を自動的に実行するようにした。
ポイント２：上記に伴い、canvas の要素はそれよりも前に記載しておく。そうしないと、WebGL の コンテキストが初期化できない、的なエラーが出てしまうようだ。
１−２．WebGLのプログラムにパラメータ代入
本筋に入る前に、そもそもひとつのページに WebGL を表示するための canvas を複数表示したりできるのかな？今使っているソースコードだと、WebGL関連のライブラリのソースコードの中でグローバルな変数（glとか）を使っているようだし、少し試したけどうまく動作しない。どのソースコードが共有できて、どこが canvas 毎に記載すべきなのかわからんぞ。ああ、Javascript がわかっていないのが痛い。。。
ということで、ひとまずここで一旦区切る！
Rails3.0
今更というか、相変わらずというか、Ruby on Rails 3.0 をほそぼそと学習している。2.3系もまともに理解していないけど、3.0の新しいところは、WebDB Press Vol.58で詳しく書かれている。
やっぱりというか、AWDwRの4版のPDFを購入してパソコンで読みながらプログラミングだ！
このPDFをMacのSafariで開いて読みながら、わからない単語があったらLiveDictionaryというエクステンションを使ってカーソルを英単語に合わせてポップアップで翻訳しながら進めている。シェアウェアなんで期間が来ると使えなくなると思うが、使い勝手は悪くないかな。でも使っている辞書はいまいちかも。辞書も変更できるのかな？英辞郎とかって良いのかなあ。
まあ、あまり英語に悩まずにソースコード中心で読み進めていったほうがいいのかも。悩むと時間かかってしょうがないし。
やっぱりというか、AWDwRの4版のPDFを購入してパソコンで読みながらプログラミングだ！
このPDFをMacのSafariで開いて読みながら、わからない単語があったらLiveDictionaryというエクステンションを使ってカーソルを英単語に合わせてポップアップで翻訳しながら進めている。シェアウェアなんで期間が来ると使えなくなると思うが、使い勝手は悪くないかな。でも使っている辞書はいまいちかも。辞書も変更できるのかな？英辞郎とかって良いのかなあ。
まあ、あまり英語に悩まずにソースコード中心で読み進めていったほうがいいのかも。悩むと時間かかってしょうがないし。
ActionScript と Red5 と OpenCL の連携
なぜこんな連携を考えているか。
クライアントで高速な描画を行うにはまだまだ Flash というか ActionScript のお世話になるのが最適だと思う。HTML5も仕様が固まっていないし、普及もしていないし。
ActionScript でのデータ転送に適したサーバが Red5 で、これは Java で動く。
サーバー側でグラフィック的な重たい処理をするときに、GPU を活用できる OpenCL を用いようと考えた。ホスティングで OpenCL をサポートしているところは一般向けにサービスしているところでは聞いた事ないが、自作サーバだと可能だ。また、将来的にはそういうサービスも現れてくるだろう。
今悩んでいるのが、Java と OpenCL をどのように連携させるか。Java から OpenCL の命令を叩くための JOCL や OpenCL4java を使うこともできるが、ネイティブ（c,c++）で OpenCL の命令を叩くプログラムを作成し、それを JNI や JNA 経由で呼び出す、というやり方もある。サーバー側で３Dの重たい処理を行おうと思っているため、既存のネイティブのライブラリを活用しようとすると、JNI や JNA のお世話になることになりそうだ。
なんだか、連携するだけで大変だ。でも、すでに普及している技術なので、参考になる情報がどこかにあるのが嬉しいところだ。続く。
クライアントで高速な描画を行うにはまだまだ Flash というか ActionScript のお世話になるのが最適だと思う。HTML5も仕様が固まっていないし、普及もしていないし。
ActionScript でのデータ転送に適したサーバが Red5 で、これは Java で動く。
サーバー側でグラフィック的な重たい処理をするときに、GPU を活用できる OpenCL を用いようと考えた。ホスティングで OpenCL をサポートしているところは一般向けにサービスしているところでは聞いた事ないが、自作サーバだと可能だ。また、将来的にはそういうサービスも現れてくるだろう。
今悩んでいるのが、Java と OpenCL をどのように連携させるか。Java から OpenCL の命令を叩くための JOCL や OpenCL4java を使うこともできるが、ネイティブ（c,c++）で OpenCL の命令を叩くプログラムを作成し、それを JNI や JNA 経由で呼び出す、というやり方もある。サーバー側で３Dの重たい処理を行おうと思っているため、既存のネイティブのライブラリを活用しようとすると、JNI や JNA のお世話になることになりそうだ。
なんだか、連携するだけで大変だ。でも、すでに普及している技術なので、参考になる情報がどこかにあるのが嬉しいところだ。続く。
dango や Shooting Star でチャットを作る
Flash と Ruby on Rails を連携させる dango のチャットチュートリアルと
Ruby on Rails で comet する Shooting Star のチャットチュートリアルを実際に作ってみた。
【環境】
Mac OS X 10.6.2
Rails 2.2.2
Flash Player 10.0.42
Firefox 3.5.7
Safari 4.0.4
Flex SDK 3.5.0
【結果】
dangoは、チュートリアルに書いてあるいくつかの dangoXXX というクラス名を DangoXXX に直し、Flex Builder の替りに Flex SDK を使うのでその辺りをよろしくやったら動いた。
Shooting Star は、チュートリアルが古いのか、こちらの通りに、いくつか変更を行えば動いた。db も mysql じゃなくて rails のデフォルトの sqlite でやってます。
Ruby on Rails で comet する Shooting Star のチャットチュートリアルを実際に作ってみた。
【環境】
Mac OS X 10.6.2
Rails 2.2.2
Flash Player 10.0.42
Firefox 3.5.7
Safari 4.0.4
Flex SDK 3.5.0
【結果】
dangoは、チュートリアルに書いてあるいくつかの dangoXXX というクラス名を DangoXXX に直し、Flex Builder の替りに Flex SDK を使うのでその辺りをよろしくやったら動いた。
Shooting Star は、チュートリアルが古いのか、こちらの通りに、いくつか変更を行えば動いた。db も mysql じゃなくて rails のデフォルトの sqlite でやってます。
