関連エントリイリスト in this Blog

• マウスカーソル位置の取得とpopupコメントの表示位置
• マウスイベント座標などの各種座標テスト
• mouseover時の説明用Popupコンテンツに画像活用を開始
• 「イベント」関連エントリイ in this Blog

　やっかいなり！イベント座標系

２年ほど前から文字だけのポップアップを行ってきたが、この場合にはマウスカーソル位置の右下にポップアップするように設計していた。ここにおいて注意しなければならないことは、ポップアップアイテムがwindow内辺からはみ出さないようにすることであり、その点でかなり苦労した。

それは、ブラウザ毎にイベント座標の表現方法が異なるためであり、特にIEの場合にはスクロール値が、ブラウザの描画モード（標準か互換か）によっても変わるため、「window内の任意の一点」を取得するのにかなり難儀した。また、イベント座標系における各種のプロパティが、一体どの部分の寸法なのかをしっかりと把握するのにも苦労した。手持ちのJavascript参考書にも、イベント座標系について全面的に説明されているものがなく、またネット上でもこれと言った解説は、なかなかなかった。強いて言えばマイクロソフトmsdn：「エレメントの位置と大きさの取得」くらいだ。

　だから自分で整理した

そこで、やむを得ず今後の備忘録として、イベント座標系及びwindowとscreenサイズに係るプロパティについて整理してみた。かなり時間が掛かったが今後のためにも必要な作業であり、理解をきちんと整理する上でも大変役立った。

以下に、オリジナルの整理図を掲載しておく。共にクリックすると別窓で原寸大画像が開きます。

図説：イベント座標系及びスクリーンとWindowのサイズ

　onmousemove位置について

マウスカーソルの位置をscriptで常時監視する場合、onmousemoveまたはonclickイベント発生位置による場合が多いようだ。このブログの場合onmousemoveを採用しており、それは２年半ほど前、Javascriptを覚え始めた頃に　イヌでもわかるJavaScript講座　で得た知識である。

当初は見よう見まねで、理解不能なscriptをただ複写して利用していたが、次第に内容を理解できるようになり、自分なりの改竄を繰り返し今日に至ったものの、現在のmyBLOG's scriptでも借用先の原形は大きく残している。

さて、上記のイベント座標とscreenn＆windowサイズを踏まえて、このブログのscriptにおける座標取得・設定が行われているわけであるが、設定した各種座標値は上図左側の下部にある一覧表の通りであり、ここに辿り着くのにさんざん苦労したのだ。その長い経過と思いを総括することも含めて、以下にマウスカーソル移動発生位置取得に関するscriptの関連部分を抜粋し、説明を加えて今後の備忘録としておきたい。

　あるサイトを見て同感し、それは始まった。

或る言葉やリンク部分にマウスオーバーすると、するっと画像が表示されるサイトがあった。

多忙な中でのサイト閲覧だったので、そのサイト名やURIは全く記憶していないが、そのポップアップに鮮烈な印象を受けた。

どの様にしてそれを実現しているのかは直ぐに理解できたので（正確に言えば、myblogでそれをどう実現すればよいか直ぐに推測出来たので）、早速昨年暮れの休暇に入ってから我がブログ上でそれを実現しようと、これまで文字しかポップアップしてこなかったmyblogのポップアップに係るscript改造に取りかかった。

それは容易に実現でき、既に12月27日のエントリイから多用している。まるでそれが当たり前であるかのように、リンク部分にはリンク先サイトのスクリーンショット画像をポップアップさせるようにしたのである。

この小細工は次のような特徴を持つ。

第一に、ブログエントリイの一見した見栄えに全く無関係であり、よって余り知られることがないであろうこと、第二に、それにも拘わらず、否それ故に、オンマウスオーバー時に画像が表示されることは不意を突く効果があること。そして第三に、何と言っても作成が大変なことである（苦笑）。

　ポップアップ画像表示のための作業について

それは次のような工程を経ねばならない。
（【】内は作業に必要なソフト。因みに、当該ソフト名にonmouseoverすると、当該ソフトの本家サイトスクリーンショットがポップアップし、また当該ソフト名をクリックすると本家サイトが開くようにしてある。）

1. 必要なサイト等のスクリーンキャプチャ画像を取得する。【画像キャプチャーソフト：WinShot】
2. これを適当にリサイズする。【画像処理ソフト：JTrim】
3. 必要に応じてコメントや矢印などを画像に加え、あるいは不要な箇所を画像から削除する。【画像編集ソフト：PictBear2】
4. FC2ブログサーバーへの画像アップロード。
   →　相変わらずファイルを１つずつアップロードしなければならない！！FC2さん！早く複数ファイルの一括アップロードを実現しろ〜〜！！
5. エントリイ内の必要なＡタグ内に、onmouseover時のPopup表示のためのイベントハンドラー関数を設定する。
6. この時、Popupイベントハンドラー関数の属性値に、必要に応じて画像に対するコメントを挿入する。
7. エントリイを投稿する。

以上の過程を経てやっと画像ポップアップが可能となるので、時間と暇がないととてもやってられない作業ではある。年末年始休暇が開けたらば、こんなに手間の掛かるエントリイ作成はしないかもしれない（苦笑）。

　やはりB's Recorder Gold８は使えない！

直前のエントリイに従い（笑）、B's Recorder Gold８にて、早速書き込みを行おうとしてみた。そして直ぐに過去の嫌な記憶がよみがえってきた。

すなわち、いざ書き込みを行おうとすると、B'sによって「ファイル名が長すぎる」とイチャモンを付けられてしまうのだ。そういえば過去に何度かそうしたイチャモンを付けられて、ファイル名を編集した記憶がよみがえってきた。

B'sは、Joliet形式のファイル名長を越えるものをはじくためのに、ファイル名を変えろ、と指令する。そんな無体な！！そんなことは「自動でやれ！」と言いたい。ネットラジオから録音したファイル名は一般に長い。最低限でも演奏者名と曲名がファイル名に記されている。だから自動カット機能を装備した上で、自動カットが嫌なら個々に編集する。そんなユーザーフレンドリイな仕様にすべきだ。

長すぎるファイル名をいちいち編集して最大64文字までの制限をクリするなんて、余りにユーザーに時間を掛けさせすぎであろう。

　かくして結局mp3のCD焼きはCDBurnerXPProで！

何時落ちるか分からないソフトを使ってまで、書き込まざるを得ないなんて悲劇的と言わねばならない。

安いCD-Rに焼き込む事も考えたが、書き込んでから初めてじっくり聴く曲が多いため、何回も編集して書き込み直したいわけで、そのためにはCD-RWでなければならず、失敗しても書き換えられるからこそ、CDBurnerXPProを使う意味も出てくるわけだ。

もっと快適に書き込めるソフトの登場が待ち遠しい昨今である。

　今でも「CD」burnとは！───DVDリッピング無料定番ソフトを比較する。

アプリ名で、DVDではなくCDの名を冠しているソフトが未だに健在なのには驚かされる。それでも、DeepBurnerやBurn4Freeよりも、CDBurnerXPProを好む。まあ、携帯デジタルプレーヤ全盛の時代に、CDでmp3を聞こうとしている人間もいるわけだし、私には「CD」burnerが相応しいのだろう。（笑）

起動時のカラフルなスプラッシュスクリーンが気に入っているわけではないが、Burn4Freeの巨大なツールバーには反吐が出そうだし、大体起動に時間が掛かりすぎる。他方、Deep BurnerはUSB接続DVDドライブ（２層書き込みDVDドライブだから？）を認識してくれない。これらの点から、これらの２つのソフトを使う気にならない。

その点、CDBurnerXPProは、操作画面が整理されており理に適った部分が多い。複数のDVDドライブを操作画面から直接選択できるのも便利だし、Deep Burner同様に、discが挿入されている時にはセッションモード選択画面が表示されるのも親切だ。（但し、この「先指定機能」はDeepBurnerの方が遥かに分かりやすい。）

しかしながら、CDBurnerXPProには、小さな欠点として、メニューなどが日本語対応になってないことがあり、大きな致命的欠点として、時々エラーが出てアプリがダウンしてしまう問題がある。後者の問題は致命的欠陥だが、それでもなお、他の２つのリッピングソフトの各々の持つ欠点故に、CDBurnerXPProを仕方なく優先して利用している。勿論 CD-Rにではなく、CD-RW にmp3を焼くときだけの限定的利用だが・・・。

CD-RやDVDに焼き付ける場合には、何時落ちるかも知れない不安定なソフトを使うわけには行かないことは火を見るより明らかであり、Deep BurnerがUSB接続DVDドライブを認識してくれさえすれば、こちらに乗り換えたい、とは思う。しかし、Deep Burner には、何らかのプラグイン等により、ドライブを追加認識させるする機能はないし、今後もそれは期待出来ないだろう。

かくして仕方なく、CDBurnerXP Pro を使っている訳だ。(/_;)シクシク

無理してフリーウェアを使わずに、正式に購入した B's Recorder Gold を使うべきだろうか？！（爆笑）

　各ソフトのスクリーンショット

画像をクリックするとそれぞれのダウンロードサイト（本家）が別窓で開きます。

• CDBurnerXPPro
  
• DeepBurner
  
• Burn4Free