パチョ奮闘記
2002年1月

　あけましておめでと。
　去年2.13の登場以来、見た目がほとんど変わらなかったこのページも、やっとフルリニューアルされました。11.29にほのめかしたことを実行できてなによりです。
　さて、成果はどんなもんでしょう。見た目の新鮮さなんて1日で消えるので、あくまでもスクリプトの実用性に重点を置いているんですが。
　これまでの記事はこれまで通りの配色で表示される（要JavaScript）ので、昔のが懐かしくなることはないけどね。

　本当は「暗い背景に明るい文字」が目に優しくて俺的に好みなんですが、今年からはペースも落とすことだし、そこまで目に痛い配色でもなかろうので、まぁよしとします。
　そう、今年からはパチョ奮闘記のペースをかなり落とします。他のコンテンツ（特にゆきこのおへや）に力を入れていくのです。いつまでもパ奮をメインコンテンツにしておくつもりはないのだ。
　そこ！ありがたやありがたやと言うなかれ！

　加えて、Scrawl Notes も同時リニューアルです。生まれた日は違えど、双子の兄弟ですから。
　見た目としては、配色や素材に変更はなく、新しい記事フォーマットを作ったくらいですが、GTS版のみ、記事の表示方法ががらりと変わっております。
　これは stage1 の「スクロールの重さ」への、ひとつの解決案なのですが、どんなもんでしょうか。果たして、全記事のロードが終わるまで閲覧が一切不可なんて代償を払う価値はあるのでしょうか。謎です。

　とりあえずは、ま、今年もよろしくおつきあいください。

追記：2004.4.11

ここでリニューアルされたデザインはすでに退役しています。Public Edition のパチョ奮闘記とScrawl Notesで当時の様子を拝めます。

　明日書く記事の下調べをしていたら、7.1の記事が目にとまりました。うわっ懐かしい。
　てなわけで、計画の達成度をちょこり評価してみることに。

　達成度がかなり低い原因は、「JavaScript」が視野に入ってないせいと思われます。勉強を始めたのは、これの半月後だもの。
　ていうか、この人、同じWebページを3つ作ろうとしてたんですか。そりゃ恐ろしい話ですな。そうまでしてクロスブラウザを達成させたい気持ちはご苦労ですが、できるもんならやってみろっつの！
　JavaScript万歳！（どかぁん）

　今日はsiteCTSの1歳の誕生日です。
　Test Version に始まり、Sample Version、Provisional Edition（暫定版）、そして現在の Public Edition（正式公開版）と進化してきましたが、すべて通して変わらないのは常に実験中。あぁ。困ったものです。
　とりあえず記念日には過去をふり返るのが慣わしなので、「特集・siteCTSの今まで」をお送りします。

2000.12月

ZEROのおもちゃツールを使って Test Version を作成。

2001.1月

Sample Versionを公開。

この頃はまだ「siteCTS」なんて名前はついてなかった。

ドリームウィーバー2を使っていたが、すぐにホムペビルダー2001へ乗り換え。

2月

パチョ奮闘記が登場。

秀丸を導入し、徐々に手書きへ移行。

CSSの勉強を始める。

3月

初めての JavaScript を書く。

パ奮の思わぬペースに混乱する。この時すでにメインコンテンツ化してたとの噂。

HTMLの本を入手してちゃんとした勉強を始める。順序が逆。

リニューアルへ向けてサイトのフレーム化。

4月

Provisional Edition の登場。サイト名も「siteCTS」に。

Scrawl Notes が登場。

ホムペ制作日記が Editing Note を経て Editing History へリニューアル。（現在は廃止）

リンク集からリニューアルした暫定版 Chains が、いったん廃止される。

一部のコンテンツが廃止。

掲示板がZERO→Res9→KENTを経て、現在のものになる。

ネスケ6.0を導入。現在まで続くネスケとの戦いは、ここから始まった。

5月

ネスケ4.73を導入。あまりの性能の悪さに絶句し、全ブラウザ対応版の検討を始める。

あこがれのブラウザ、Lynxを導入。泣ける。

完全に手書きへ移行し、ホムペビルダーはお払い箱。

Scrawl Notes とパチョ奮闘記の全ブラウザ対応版を作成。

6月

JavaScript 第2弾が登場。かわいすぎる。

7月

JavaScript の勉強が本格的に始まる。

8月

JavaScript 大爆発。一月丸々費やしてサイトすべてをスクリプト化した。

Scribble Garden がリニューアル、現在に至る。

Chains がリニューアルして復活、現在に至る。

いろいろ紹介が俺紹介++へ改名してリニューアル、現在に至る。

siteCTSのバナーがやっと誕生。

9月

siteCTSが Public Edition にグレードアップ。

ネスケ6.1が透過PNGにバグを出したことが原因で、素材をPNGからGIFへ移行。

プレーン版の構想が始まる。この構想は、現在のところ「ノンフレーム版」へ結実。

10月

トップページがリニューアル、現在に至る。

ゆきこのおへやが仮開通。

11月

決定的な新呪文のゲットにより、多くのスクリプトがネスケ6でも実現可能になる。

Lynxとのお別れ。泣ける。

サイトのノンフレーム対応が全部終了する。

12月

さらに決定的な新呪文のゲットにより、サイト全体のスクリプトが大きく変わる。

ゆきこのおへやに PrettyJavaScript が仮開通。

　…と、こんな感じの1年でした。
　HTMLに悪戦苦闘し、CSSに悪戦苦闘し、JavaScript に悪戦苦闘し、常に進化を続けてきたsiteCTSと、俺。今年はCGIだ。

　秀丸にはマクロ機能が搭載されております。まぁ「アプリケーションの中で動くプログラム」という点では JavaScript と同じです。
　秀丸はそのままでも卒倒級の便利さを誇りますが、マクロを使いこなすと、これが即死級になります。死ぬまでついていく気分になれます。プログラムを書かない人には「高機能メモ帳」で終わります。

　マクロはプログラムなので、いろんなことができます。JavaScript とは違ってファイルの生成もできるし、レジストリにだってアクセスできます。
　仕様書を眺めながら「なにか作れないかな〜」と考えておるのですが、たいていのものはすでに存在するので、わざわざ自分で作る必要がありません。

　でも、ひとつだけ欲しいのがないんです。「カレントフォルダを開く」が。お好きなフォルダを登録して、メニューから選ぶとエクスプローラで開く…っていう便利なのはあるんですが、実行即問答無用速攻起動！ってのがない。

　なので作ってみました。「そのファイルがあるフォルダをエクスプローラで開く」マクロ。
　仕様書を見ながら、えーと、まずアプリケーションの実行は run で、これでエクスプローラを起動させりゃいいんだろ。んでコマンドラインにカレントフォルダを入れりゃいいわけだから、…えーと、カレントフォルダのパスはどうやって取得するんだ。えーと、えと、あ、あった、なんだ、directory だけでいいのか。JavaScript より楽に取れるんだな。あれれ、Windows のパスは windir でいいんかい、なるほど。こりゃ便利だ。

　そんな感じでできあがった、俺の初めての自作マクロ。

run windir + "\\Explorer.exe \"" + directory + "\"";

　あぁ、これじゃあ誰も公開しないわけです。納得。
　そういえば初めて書いた JavaScript も、たった1行だったっけなぁ…。

　なお、このマクロが欲しい人は、上記の1行をメモ帳にコピペして、ファイル名を「カレントフォルダを開く.mac」にでもして、マクロ登録してお使いください。
　「ツリー付きじゃないとヤダ！」って我侭な人は、下の1行の方をお使いください。

run windir + "\\Explorer.exe /e,\"" + directory + "\"";

var path = "sndExc/allTitle.html";
if (self.name != "menu")
  path = "../" + path;

この3行が

var path = ((self.name != "menu") ? "../" : "") + "sndExc/allTitle.html";

1行になるプログラムの不思議。

document.imgNameYK.src = num + ".jpg";
num += 1;
if (num > 7)
  num = 0;

この4行が

document.imgNameYK.src = ((num++) & 7) + ".jpg";

やっぱり1行になってしまうプログラムの不思議。

var menuForm = parent.menu.document.form;
if (nowPos != "0102")
  menuForm.backSlideBtn.value = "＜前の月";
else
  menuForm.backSlideBtn.value = "";
if (nowPos != snpCurrent) {
  menuForm.nextSlideBtn.value = "次の月＞";
  menuForm.currentBtn.value = "最新号（" + snpCurrent.substring(3,4) + "月）";
} else {
  menuForm.nextSlideBtn.value = "";
  menuForm.currentBtn.value = "";
}

この13行が

with (parent.menu.document.form) {
  backSlideBtn.value = (nowPos != "0102") ? "＜前の月" : "";
  nextSlideBtn.value = (nowPos != snpCurrent) ? "次の月＞" : "";
  currentBtn.value = (nowPos != snpCurrent) ? "最新号（" +
    snpCurrent.substring(3,4) + "月）" : "";
}

半分以下になっちゃったプログラムの不思議。

あぁ不思議な論理演算の世界。
あぁ癖になるわぁ〜

改変前（サイトマップで現在位置を赤くボヤボヤさせる部分）
var cnt = true;
var opa = 100;
var incnt = 0;
var outcnt = 0;
var maxcnt = 15;
function current() {
  if (cnt) {
    opa -= 5;
    incnt++;
    if (incnt == maxcnt) {
      cnt = false;
      outcnt = 0;
    }
  } else if (!cnt) {
    opa += 5;
    outcnt++;
    if (outcnt == maxcnt) {
      cnt = true;
      incnt = 0;
    }
  }
  cel[idNum].style.filter = "alpha(opacity=" + opa + ")"; }

改変後
var rvs = true;
var opa = 100;
function current() {
  opa = rvs ? opa-5 : opa+5;
  cel[idNum].style.filter = "alpha(opacity=" + opa + ")";
  rvs = (opa == 25 || opa == 100) ? !rvs : rvs;
}

　あぁ癖になるわぁ〜。

　ネスケ6.2.1が登場したので、早速ダウンロード。
　ネスケ6.1bの時は2時間かかったけど、今は無敵のADSLがある雪子ちゃん。
　でも、16MBもあると、ADSLでもそれなりにかかるかな。
　我が家のADSLは「安かろう悪かろう」にのっとって、すんごく遅いし。
　最低記録はナント11KB/秒！ダイヤルアップの3倍！
　まぁ、平均は80KB/秒なんだけどね。元が8Mbpsだけに、これでも遅いのよね。
　おし、ちょっと計ってみよう。パ奮のネタにもなるし。
　ダウンロード開始。ぽちっとな。
　トイレへ行って、手を洗いつつ、おっと、ストップウォッチを起動するの忘れてた。
　慌てて部屋に戻って、ストップウォッチを起動。
　…って、なんでもう完了してんねん！

　ただいまネットスケープ6.2.1をインストールしています…
　がりがり…
　しています…
　がりがり…
　ただいまSUN JAVAをセットアップしています…
　がりがり…
　しています…
　…
　しています…
　しています…
　もう1回、トイレへ行って手を洗えたな。

　その後、不可思議な気持ちをいだきつつ計測サイトへ。
　新記録、172KB/秒。一気に40KBも更新。
　単純計算でも1分半ですか…。16MBが…。
　最低記録との161KBもの差は、一体どのような仕組みで生じるのだろう。誰か教えてくれ。

　ご覧の通り、パ奮では画面写真を多用してます。つまり、それだけ画面をキャプチャするソフトをよく使うわけです。
　雪子ちゃんには3つばかり入っておりまして、大体は ScreenShot を使ってます。起動すれば、PrintScreen を押すたびに連番で次々保存してくれて便利です。しかしタスクバーに居座るので画面全体をキャプチャするには具合が悪く、そんな時はWinCatchをご使用します。

　しかし、ついに見つけた感じがします。「究極のキャプチャソフト」、その名はきゃぷら。
　コマンドラインで起動・連番保存・終了。猫ちゃんで適当なキーに割り当てれば、いつでもどこでも即キャプチャ、かつ消費リソースゼロ。わお！

　キャプチャ方法も多彩で、普通は画面全体とアクティブウィンドウだけですが、こいつはクライアントウィンドウ（ツールバーやウィンドウ枠を除いた実質部分）も取れたり、驚いたことに普通はできない「カーソルのキャプチャ」にも対応してます。
　無論コマンドラインも多様で、起動方法、保存方法、各種オプションなど、こと細かく指定可能。これは具合がよろしいですなぁ。

　キャプチャした画像の編集・PNGやJPEG圧縮もできます…が、こればかりはホトソに敵いません、あたり前ですが。サイズをぎりぎりまで減らしたい奴にとって、ホトソの減色は使いやすいからねぇ…。

　ともあれ、どうやらまたひとつ、旅が終わったようです。
　次はレジストリエディタかなぁ…。あ、あとクリップボードツールももう少し強いのが欲しい。（常駐秀丸は最低限ですし）

　プログラムの超基本技のひとつとして、「配列」というものがあります。
　通常、変数（箱）にはひとつしか値（中身）を入れられませんが、これを使うといくつでも入れられるので、とっても幅のあるプログラムが可能になります。

普通の変数
box = 1; //boxに1を入れる

配列
box[0] = 1;    //boxの0番に1を入れる
box[1] = 2;    //boxの1番に2を入れる
box[2] = "あ"; //boxの2番に「あ」を入れる

　これが配列の基本。
　さらに高度な配列として、Perl言語やC言語などでは「多次元配列」や「連想配列」というのもあり、さらに便利な使い方ができます。
　多次元配列とは、配列の中へさらに配列を作っていくもの。
　連想配列とは、[ ] の中の添え字に、数字ではなく文字列を指定するもの。（通常は「数字」か「数字の入った変数」を指定）

　特に有用なのは多次元配列で、PerlやC++の講座サイトを見ながら、「いいなぁ…JavaScript にもこんなのあったらなぁ…」と思っていました。
　それは、頭の中で「あそこをああして…」と、勝手にスクリプトを組み始めてしまうくらいの「あこがれ」だったのです。

　明日に続きます。

　皆様ご予想の通り、多次元配列・連想配列が JavaScript でも可能であることが発覚しました。
　発覚は、某Webサイトでなんとなくソースをのぞいてた時。そこで目にとまった、この2行。

score = new Array();
score[0] = new Array();

　ちょっと待てコラ。なんやねんソレ。思いましたとも。
　new Array() は「この変数を配列にするよ」という宣言。つまり「変数scoreを配列にして、その0番をさらに配列にする」というもので、要するに「多次元配列」です。

　まさかと思い、大慌てで Google 先生に「連想配列 JavaScript」を探してもらいます。やってみりゃわかりますが、うじゃっと出てきます。
　こんなにあるのに、なんで今までひとつも目にしなかったのか。使い方は普通の配列とほとんど同じだから、存在さえ明らかになるだけでいいのに。
　まったく、己の運の悪さに泣けてきます。

　すなわち、JavaScript でも

pr = new Array();
pr["俺"] = new Array();
pr["俺"]["容姿"] = "かっこいい";
pr["俺"]["頭脳"] = "よろしい";
pr["俺"]["性格"] = "イケてる";
pr["俺"]["特徴"] = "うそつき";

　このような多次元連想配列が使用可能であり、そして

msg = pr["俺"]["特徴"]; alert(msg);

　と呼び出すことができます。
　この場合、変数 msg には「うそつき」が入って、ダイアログに表示されます。
　サンプル

　ハテナ事件といい今回といい、俺ってば一体なにを勉強しているのでしょう。なんでそんな簡単に「JavaScript にはない」と思いこんでしまうのでしょう。
　JavaScript はそんなに底の浅いものじゃないってことを、私は改めて認識せねばなりません。

　色々調べてまわったところ、JavaScript の多次元配列や連想配列は、どうやら正式なドキュメントにはないようです。つまり仮想的なものであり正式なものではない、と解釈した方が安全かもしれません。
　連想配列は、 [ ] の中が一致している値を参照/設定すると解釈すれば、動くのも当然でしょうけど。

　といいますか、そろそろちゃんとしたムヅカシイリファレンスを購入しよう。長らくお世話になったアンク著 JavaScript 辞典から学ぶことは、もうないのです。
　（ちなみにこの本は初心者にもわかりやすくて実用的な、なかなかオススメの一冊）

　ウィルスの温床と名高いメールソフト、Outlook Express。このメーラーが世から消え去れば、ウィルス感染率は何十分の一、何百分の一にもなると言われます。
　多彩なセキュリティホール、圧倒的なシェア、無知に比例する危機感の無さ。知らぬは罪なのよ。

　俺は、パソコンを買ってからの数ヵ月は Eudora4.3 を使っていたのですが、どういうわけかある日突然これに乗り換えました。
　普通、パソコンのことを知るに従い、アウトルックから離れていくのがあたり前です。それこそ Becky! か AL Mail、秀丸ユーザーなら鶴亀メール、とか。他からアウトルックへ乗り換えるなんて、今まで一度も聞いたことありません。

　えぇ、たしかに俺もそうするべきだと思います。アウトルックは自分どころか友達まで危険な目に遭わせるし、協調のかけらもない自分勝手なヘッダをつけた挙句に一人でバグ起こすし、なによりデフォルトがHTML形式。

　でも僕はアウトルックユーザー。そしておそらく改善の見こみなし。ごめんね、みんな。
　しかし、アウトルックユーザーとして最低限の義務は果たしております。果たしておりますとも。

　義務、それは「アドレス帳にメールアドレスを書かない」。
　今どき、アウトルックのアドレス帳をのぞかないウィルスなんて存在しません。中には、インプローラのキャッシュからアドレスを拾ってバラまくのもありますが、とりあえず友達を無闇に巻き添えにする心配はかなり低くなります。

　ちなみに私の場合、メールを書く時は猫ちゃんにアドレスの代筆をお願いしております。

　多くのアウトルックユーザーの皆様。
　これは義務であり、また礼儀です。
　「アウトルック」とは、そこまで言うほど危険であることを認識して使うべきなのです。
　最近、目立ってアンチMS化が進む僕でした。（M$と書かないだけまだマシ）
　かしこ。

　siteCTS監査委員会は、1月28日、webmaster に対して以下の勧告文を発表した。

文書型宣言で

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

と宣言しているにもかかわらず、仕様からの逸脱が目にあまる。
siteCTS監査委員は、非推奨タグ/属性の是正、誤った文法の早急なる修正を勧告する。

　この勧告に対し、webmaster は以下の回答を提出。

• 非推奨タグ/属性の早急なる是正
• 文法の誤りの早急な修正
• フレームの撤廃
• 広範囲なブラウザのサポート
• その他、可能な限りの対応

　また、webmaster は編集部のインタビューに対し、「siteCTSの全面的な解体も視野に入れている」と発言した。また、「この勧告は予期していた。そのための準備もすでに始めていた」と付け加えた。
　編集部では、氏のアクセス記録に W3C HTML Validation Service や Another HTML lint が含まれていたことから、あまりの減点の多さに「現在のページレイアウトを維持したままの修正は不可能」と判断した意味合いが強い、と推測している。

　siteCTSは2001年1月9日に開設されて以来、CSSや JavaScript を積極的に取りこんできたが、ここにきて飽和状態に達し、現状の維持が困難になっている。もっぱらの興味が JavaScript 以外に移れば、たちまち破綻することが誰の目にも明らかだ。
　そんな webmaster の懸念が、「解体」という発言にも現れているのだろう。

　ともあれ、「解体」がもし「再生」を意味するのであれば、間違いなく HTML4.01 の仕様に準拠するはずであり、すなわち無数にはびこる JavaScript は、ほとんどが消え去ることになる。
　「にぎやかで楽しいsiteCTS」がWWW上から消えるのは、そう遠い日ではないのかもしれない。

追記：2004.4.12

この日を境に、でたらめだったsiteCTSのHTML改善が始まり、今のXHTML1.1につながってるわけです。