« FlashおよびAjaxを戻るボタンに対応する | メイン | 自宅のFedora Core5で作るF's Garage »

JavaScriptによるwindowマネージャの研究


2006年の2月ぐらいにひっそりと公開していたものですが、JavaScriptによるWindowマネージャを作ってみました。script.aculo.usを見ていて、こういうの簡単にできそうだなぁと思ったら案の定簡単でした。

簡易Windowマネージャ

このサンプルではファイルの拡張子に応じて最適なHTMLテンプレートを選択して描画しています。

外枠のWindowはJavaScriptを使ってレイヤー管理されています。Windowsマネージャというとおりウインドウ間の重なりも管理しています。(重なり制御は、ちょっと怪しい)

ウインドウ重なりの制御は、Flash MX 2004 Professionalに添付されていたWindowコンポーネントでやっていることを参考にしています。

なお外枠のウインドウは、Jemplateを使ってテンプレート化しているのでデザイン変更があっても簡単に反映することができますし、document.writeでダラダラとHTMLを書くような作業は不要です。

なおこのサンプルで考えたのは画像やFlash、動画を動的に読み込むことでマルチメディアビューワーみたいなことができるんじゃないかなぁと思っています。

カラメルでは、このソースを流用しヘルプウインドウなどに使っています。
カラメルの画面上に丸い「?」のアイコンがあるのですが、それをクリックすることで表示されます。

カラメルを見る

カラメルの方はウインドウをドラッグできないように変更し、代わりに画面上のどこをクリックしても開いているヘルプウインドウが閉じるようにしていますが、こういうのが簡単に変更できるのもシンプルなレイヤーコンポーネントが故のポイントだと思います。



About

2006年07月26日 01:32に投稿されたエントリーのページです。

ひとつ前の投稿は「FlashおよびAjaxを戻るボタンに対応する」です。

次の投稿は「自宅のFedora Core5で作るF's Garage」です。

他にも多くのエントリーがあります。メインページアーカイブページも見てください。

Powered by
Movable Type

Authored by
Shinichi Fujikawa(えふしん)