webアプリ用小物ツールの罠

HelpBalloon.js(ヘルプのバルーン(吹き出し)をajaxで表示する)

http://youmos.com/news/helpbaloon_jsを参考に。
ajaxで、ヘルプのときに、GoogleMapsやガジェットのようなバルーンの中にメッセージを表示することができます。しかも、見た目がなかなか粋です。

作者サイト:http://www.beauscott.com/2006/08/19/ajax-enabled-help-balloons/から、prototype.jsScriptaculous.jsを使うのでDLする必要あり。(リンクでいける)
あと、作者さんが作ってくれた、prototype.improvements.jsもブラウザ間の仕様を吸収する機能っぽくて、あったほうがいいっぽい。(HelpBalloonのzipファイルについてきます)

問題は、それらのファイルの設置の仕方で、HelpBalloonn.zipを解凍したときのファイル構成そのままに、prototypeやらを入れても動かない・・・。
JavaScriptに触れて人生3回目のやつが必死でソースを読んでも、焼け石に水で・・・。

結局、答えは、作者サイトのコメント欄にありました。

1) Download the Scriptaculous library (see link above) and unzip it. Inside the zip you’ll find two directories filled with .js files: lib/ and src/. Copy all the .js files to a directory in your website (for instance: /lib/scriptaculous). This will include the prototype.js framework for you.

2) Download the HelpBalloons.zip file (again, above) and extract it to your base site directory.

3) In the of your HTML pages, make sure to include the following (assuming /lib/scriptaculous is the directory you copied the js files from #1 above to):




つまり、

  1. Scriptaculousのzipファイルを落としとけ、その中の、libディレクトリとsrcディレクトリにあるjsファイルは全部使うぜ
  2. HelpBalloons.zipを解凍しろ
  3. HelpBalloons(インストールした一番上の階層ファイル)/lib/scriptaculous に 1.のファイル全部ぶち込め


↑こんな感じに

ついでに、htmlなりphpなりにJavaScriptを読み込むときは、引用の下からの4行( <script type=" 〜)をコピペすればおk
元のままのソースだと動かない罠に陥りますw*1

結局、prototype.jsscriptaculousディレクトリに設置されているとか、どんだけー な感じがしますが、要は英語のサイトはめんどくさがらずに端からはしまで、しっかり見ろということですね^^

DBDesigner4 (ER図からMySQLへ、クエリやらいろいろ自動で作ってくれるツール)

http://php.sunvisor.net/2007/11/dbdesigner4.html
便利そうなので、いちど試してみると、MySQL(データベース)との接続をできず、正しいユーザ名とパスを設定しているのに、エラーと出てきます。

これは、MySQL4.1以降にMySQLのパスワードの方式が変わった?ためのようで、パスワードを昔の方式で登録しなおさなければなりません。
空想具現化プログラミング DBモデリングツールDBDesigner4の後継は?に、書いてあるようにすれば、接続ができました。

まだ触って間もないので、どういった便利な機能があるかは、あまり見てませんが、ER図がきれいに書けるだけでもなかなか使えそうです。
あと、cakephpとの連携で、ソースの自動生成(Scaffold)もしてくれるようで、すごいツールができたもんですね。*2

*1:どうやら、scriptaculous.jsはprototype.jsを利用するので、同じディレクトリに置かないといかないっぽい

*2:http://php.sunvisor.net/2007/11/scaffold.html