"); if (id == 1) { } else if (id == 2) { } w.document.write(s); w.document.write("
"); w.document.write(" "); w.document.close(); } // -->

Vanilla(縦書き掲示板)


QUICK LINK


INDEX

機能
掲示板機能
ケータイ対応
縦書き機能
管理者機能
以下未実装
ユーザーガイド
起動
読む
最近の発言を読む
ページをめくる
ページをめくる(2)
発言内のリンクをたどる
発言者にメールを出す
書き込む
新規に発言する
内容を送信する
画像のアップロードをする
削除する
名前等を記憶させる
コメントを付ける
元の発言を選ぶ
コメント発言の送信
その他
縦書き・横書き切り替え
スレッド表示・投稿順表示切り替え
エラー一覧
管理者ガイド
設置方法
前提条件
ファイル一覧
一括ダウンロード
設置手順
管理画面
起動
パスワード入力
メニュー
項目設定
項目設定内容説明
発言管理
発言削除
発言削除確認
発言削除完了
発言復活
利用規定
変更履歴
Q&A
スレッドの伸びる方向
オフライン表示
画像がある時に表示がヘン
Operaで見ると横書き(ヘンな表示)になる
その他書いておきたいこと
縦書きの実装について
vanillaの名前
ソースコードの汚さ
拝借コード

機能

掲示板機能

ケータイ対応

縦書き機能

管理者機能

以下未実装(今後実装するかも)


ユーザーガイド

起動

起動する

起動は他の掲示板と変わりなく、普通に指定のURL(http://.../vanilla.pl)にアクセスするだけである。

まず、一瞬灰色でリンクを表示する画面が出る。
この画面は掲示板を使用する方から見ると単に起動を遅くしている余計なものに見える。実際はこの画面を表示している時に現在のウィンドウのサイズと文字の大きさを取得している。縦向きに文字を並べるための前準備である。

その後通常の掲示板らしい画面の表示に変わる。

読む

最近の発言を読む

最近の発言から順に並んでいるので、適当に横スクロールバーを使用して読みたい発言まで移動する。

ページをめくる

ページ左端の発言より過去の発言はページをめくって表示する。そのためには書き込みフォームの下あたりの「最初のページへ」、「前のページへ」、「次のページへ」のボタンを押す。また、ページ番号を指定して直接希望のページに飛ぶこともできる。

ページをめくる(2)

ページ左端にもページ移動用のボタンおよびリンクがあり、同様の操作を行うことができる。

発言内のリンクをたどる
発言者にメールを出す

リンクはブラウザ設定によりリンクを示す色(ここでは青字)で表示される(下線の変わりに傍線を表示する)。通常のリンクと同じくクリックすることでメール送信あるいはリンク先のページ表示を行うことができる。なお「名前」がリンクになっている場合には発言者へのメールアドレスへのリンクである。

書き込む

新規に発言する

画面右端のフォームに発言内容を書く。

項目名内容
名前 名前やハンドル名
メールアドレス メールアドレス
ホームページ ホームページや推薦URLなど(ここに記入しなくても発言内のURLは自動でリンクされる)
カスタムフィールド 管理画面で設定した自由設定項目
内容 発言内容
画像ファイル 「画像のアップロードをする」参照
箱の色 発言表示時の箱の色
削除パスワード 削除するために使用するパスワード。「削除する」参照。

発言内には一部のタグが使用できる。新規発言とコメント発言の違いについてはこちら

内容を送信する

発言内容を書いた後、「新規に発言する」ボタンを押すと書いた内容が送信され、掲示板に書き込まれる。

画像のアップロードをする

画像のアップロードを行いたい時には、画像ファイル欄の「参照」のボタンを押す。

するとポップアップでファイルを選択する画面が出るのでアップロードしたい画像を選択する。(下のポップアップはWindows 98の場合)

選択後送信するとアップロードした画像が表示される。

削除する

削除したい発言の下の削除ボタンを押す。なお削除するには発言時に使用したパスワードとフォーム内の「削除パスワード」欄の内容が一致していなければならない。

名前等を記憶させる

発言を行うと「名前」、「メールアドレス」、「ホームページ」、「箱の色」、「削除パスワード」の各欄の内容はクッキーによってブラウザに記録され、その内容が初期値として表示される。発言以外の特別な操作は不要。

コメントを付ける

元の発言を選ぶ

コメント元となる発言の下にある「コメント」のボタンを押す。

コメント発言の送信

コメント発言用の画面表示になる。コメント元の発言はピンク表示になり、元発言がフォームの「内容」欄に引用マーク(">")付きで引用される。

コメント内容を書き込んで「コメントとして発言する」ボタンを押すとコメントとして書き込まれる。

その他

縦書き・横書き切り替え

縦書きがうまく行かない、あるいは見にくいなどの理由で横書きにしたい場合には、「横書き表示」のリンクを押すと横書きで表示する。

縦書きに戻したい場合には同様に「縦書き表示」のリンクを押すと縦書きで表示する。ブラウザが原因等でどうにも画面からの操作ができない場合には次のURLを指定すると横書きで表示する。

http://.../vanilla.pl?mode=env&disp=horiz

スレッド表示・投稿順表示切り替え

スレッド(ツリー)表示を投稿順にしたい場合には「投稿順表示」のリンクを押すと投稿順(新しい順)で表示する。

投稿順表示をスレッド表示に戻したい場合には同様に「スレッド表示」のリンクを押すとスレッド表示になる。

エラー一覧

エラー発生時にはエラー画面を表示する。エラー内容と対処については表示メッセージの通りだが、主なエラーを以下に一覧にしておく。

操作メッセージエラー内容・対処
表示・書き込み送信システムが混んでいるようです。しばらくしてからやり直してください。 内部的にロック状態が発生している。混んでいるかシステム容量不足の時このメッセージが出る。対処としてはしばらくしてやり直す。数度繰り返してダメならば管理者に連絡する。
主に書き込み送信システムのエラーが発生しました。お問い合わせください。 種々のシステムエラー。管理者に問い合わせていただく。
書き込み送信削除パスワードが正しくありません。やり直してください。 削除を実行しようとしたが、指定した削除パスワードが発言時のものと一致しなかった。対処としては発言時に指定したパスワードを「削除パスワード」の項目に指定して再実行する。
書き込み送信パスワードは英数字で指定して下さい。 パスワードに英数字以外の文字が含まれている。対処は英数字のみの指定に変更する。
書き込み送信メールアドレスが不適切です。やり直してください。 メールアドレスの欄にメールアドレス以外の内容が入っている。対処は正しいメールアドレスを指定するか何も指定しないよう変更する。
書き込み送信ホームページURLが不適切です。やり直してください。 ホームページの欄にURL以外の内容が入っている。対処は正しいURLを指定するか何も指定しないよう変更する。
書き込み送信パスワードを指定して下さい。 パスワード指定がない。申し訳ないが、この掲示板ではパスワード指定をしないと発言できないようになっているので、パスワードを入れていただく。
書き込み送信内容(名前)がありません。やり直してください。 内容あるいは名前が入力されていない。それらは必ず入力していただく。


管理者ガイド

設置方法

前提条件

ファイル一覧

ファイル名説明
vanilla.pl掲示板本体
kv.plケータイ用掲示板
vanilla-config.pl設定ファイル(随時変更)
vanilla-common.pl共通関数等
vanilla-set-config.pl管理画面
fly.plfly使用時文字ファイル生成
以下フリーのライブラリ類(一部修正)
cgi-lib.plCGI用汎用モジュール
image/letter/****.gif縦書き文字イメージ
なお、ジオシティーズではディレクトリの深さに限界があるため、imageと同じレベルにletterディレクトリを作成している。
以下フリーのライブラリ類(修正なし)
jcode.plCGI用汎用モジュール
fly(あれば)GIFファイル動的生成プログラム
gzip(あれば)GNUzip 圧縮プログラム
以下ヘルプ等
index.htmlこのヘルプファイル
image/****.pngヘルプ用の画像ファイル

一括ダウンロード

http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.7.tar.gz(1901K) CURRENT
http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.6.tar.gz(894K)
http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.5.tar.gz(894K)
http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.4d.tar.gz バグ版なので0.9.5との差異2ファイルのみを置いておく。
http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.3.tar.gz(892K)
http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.2.tar.gz(891K)
http://www.geocities.co.jp/SiliconValley/7757/v/vanilla-0.9.1.tar.gz(896K)
(なお、ここに含まれているflyは@Niftyで稼働しているもの)

設置手順

MACの操作は分からず、またWindowsから設置を行ったことはない。たぶんいずれからでもインストールは出来るはずであるが、不明点は適当に推測して進めていただくことになる。

問題になる可能性があるのは改行コードと日本語の文字コード。文字コードはおそらくEUCでないと動作しない。改行コードもたぶんUNIXの改行コードでないと動作しないと思われる。EUCや改行コードに対応したエディタの使用をお勧めする。Windowsで有名なものでは秀丸がある。

  1. ファイルを適当な作業用ディレクトリに展開する。
    • Windowsで「Vanilla」などという名前のフォルダを作成し、そこに上の各ファイルをダウンロードして保存する。
    • あるいはUNIXならば一括ダウンロードして
      $gzip -dc vanilla-0.9.1.tar.gz | tar xvf -
      などとして展開する。
  2. ftpツールなどを用いてプロバイダのサイトにアップロードを行う。
    • vanilla.pl,vanilla-set-config.pl,kv.plについてperlバスの設定を確認および変更する。各スクリプト一行目はperlのパスが指定してあり初期値は
      #!/usr/local/bin/perl
      となっているので環境に応じて
      #!/usr/bin/perl
      等と書き換える必要がある。
    • vanilla.pl,vanilla-config.pl,vanilla-set-config.pl,jcode.pl,cgi-lib.plは必要。これらはプロバイダよりCGIが動作するフォルダとして指定されたところにアップロードする。
      (@Niftyの場合ftpログイン後の/cgi-binの下)
    • kv.plは上に同様。ケータイから使用する場合にはアップロードする。
    • image/letter/以下の画像ファイルはHTMLを置くフォルダの下にimage/letterというフォルダを作成して置くのが割りと簡単。
      (@Niftyではログイン後/homepageの下にimage/letterというフォルダを作成して(/homepage/image/letter/)その下に置いた。これに合わせて「文字イメージURLプリフィックス($LETTERIMGPATH)」の値を設定する必要がある。(後述))
  3. 実行パーミッションを設定する。
    • vanilla.pl,kv.pl,vanilla-set-config.pl,fly,fly.plはCGI実行ユーザに対して読み込み、実行のパーミッションが必要。
    • vanilla-config.plは同じく読み込み、書き込みのパーミッションが必要。
    • jcode.pl,cgi-lib.plは同じく読み込みのパーミッションが必要。
    • 通常は以下のコマンドを出すが、FTPのクライアントソフトによっては少し手順が異なる場合がある。
      読み込み、実行ftp> site chmod 755 (ファイル名)
      読み込み、書き込み ftp> site chmod 766 (ファイル名)
      読み込み ftp> site chmod 744 (ファイル名)
  4. 使用前準備
    項目設定画面より設定
    設定画面を立ち上げ、必要な項目の設定を行う。文言部分は後でどうにでもなるので、まず「環境設定のために使用開始時に一回だけ設定する」値を設定する。設定画面の値と下での準備の内容が合うように調整を行いながら設定する必要がある。
    ロックファイル
    「ロックファイルのディレクトリ($LOCK_DIR)」を作成、CGI実行ユーザが書き込めるようにパーミッションを設定。また、「ロックファイル($LOCK_FILE)」の名前のファイルをそこに置き(中身は空ファイル)、CGI実行ユーザが書き込めるよう設定する。(ftp> site chmod 766)
    データファイル、ログファイル
    データファイルとログファイルをどういう名前(パス)にするか決定する。ログファイルについては設定のみでよい。データファイルについては面倒だが空のファイルを作成してアップロードする必要がある(CGI実行ユーザが書き込めるよう設定(同上))。
    アップロードファイルディレクトリ(アップロード機能使用時)
    「アップロードファイルのディレクトリ($cgi_lib::writefiles)」で指定したディレクトリを作成、CGI実行ユーザが書き込めるようにパーミッションを設定する。
    fly,gzipのインストール(それぞれ使用時)
    flyのインストールは別に行っていただく。@NiftyではSolaris(バージョンの詳細は忘れた)コンパイル済のバイナリーを/cgi-binにアップロードし、実行パーミッションを付けたら動作した。ちなみにgzipについても同様にコンパイル済のものをのせたら動作した。またfly.plの中の"$flyprog"の値を"./fly"(共に/cgi-binに置く場合)等設定する。fly,gzipともに置かなくても一応は動くはずだが、実際置かないで試したことはありません。
  5. 動作の確認
    以上が終われば動くはずだが、色々な原因で動かない場合には再度確認が必要になる。チェックポイントの主なものは以下。
    • 何かしら実行されるか
      ダメな場合の確認→プログラムをアップロードしたか。プログラムを直した時に文法エラーがでていないか。実行のパーミッションを設定したか。文字コードがSJISになっていないか、等
    • 表示でエラーがでていないか
      ダメな場合の確認→データファイルの設定。空ファイルがアップロードされているか。書き込みのパーミッションが設定されているか。ロックファイルパスの設定。ロックファイルがアップロードされているか。書き込みのパーミッションが設定されているか。
    • 書き込みできるか
      ダメな場合の確認→データファイルの設定。空ファイルがアップロードされているか。書き込みのパーミッションが設定されているか。ロックファイルパスの設定。ロックファイルがアップロードされているか。書き込みのパーミッションが設定されているか。
    • 画像表示「文字イメージURLプリフィックス($LETTERIMGPATH)」に設定したURLで画像が表示されるか。
      例:http://homepage1.nifty.com/kiosk/image/letter/2122.gif
      ダメな場合の確認→イメージがアップロードされているか。「文字イメージURLプリフィックス($LETTERIMGPATH)」の設定
    • fly.plの使用 fly.plが動作するか。
      例:http://hpcgi1.nifty.com/kiosk/fly.pl?l=2122
      ダメな場合の確認→「イメージ表示プログラムURL($FLY)」の値。fly.plの$flyprogの設定。fly.plのパーミッション。fly自体のインストール。
    • 画像がアップロードできるか
      ダメな場合の確認→画像アップロードディレクトリの設定。画像アップロードディレクトリのパーミッションが書き込みできるようになっているか。サイズの上限が0になっていないか、等
管理画面

プログラムファイル自体の編集をあまり行わなくていいように設定画面を作成してある。しばしば変更したくなるような文言の修正、および使用開始時に環境に合わせて設定必要な値の設定、および管理者権限による発言の削除と復活はこの画面上から行うことができる。

起動

URL(http://.../vanilla-set-config.pl)を直接叩くと管理画面に移動する。管理画面用のリンク(後述の「管理用URL」の値)を設定すると掲示板の「管理用」のリンクから移動できるようになる。

パスワード入力

パスワードが設定されていればパスワード入力の画面が出るので設定済のパスワードを入力する。パスワードを忘れてしまった場合には、vanilla-config.plの$passwdと書いてある行を削除してアップロードし直すとこの画面をスルーして項目設定画面に移動する。
(※つまりパスワードを設定しないと誰でも管理画面を使用できてしまうということなので要注意。)
なお、一度パスワード認証がされるとログイン状態はブラウザを落すまで持続する。

メニュー

パスワードが正しければまずメニュー画面を表示する。現在使用可能なのは「設定画面」と「発言管理画面」の二種類だけである。「設定画面」は文言等の変更と実行に必要なパラメータの変更を行う。「発言管理画面」は不適切な発言等の管理者権限による削除および復活を行う。

項目設定

パスワード未設定時、あるいは入力バスワードが正しければ項目設定の画面が出る。各項目を入力・設定し、「送信」ボタンを押すと各項目が設定される。

項目設定内容説明

文言等しばしば変更が必要なもの

No.項目名内容
1パスワード変更 この設定画面用の新しいパスワードを入力。
2パスワード変更(確認) この設定画面用の新しいパスワードを確認用にもう一度入力。
(※パスワード設定をしないと誰でもこの画面にアクセスできるのでご注意ください。)
3項目1-4 管理者が自由に設定できる掲示板の項目(カスタムフィールド)。4つまで指定できる。
4タイトル1 ウィンドウ内のタイトル文字列を指定。
5タイトル2 コメント発言中のウィンドウ内のタイトル文字列を指定。
6ヘッダー1 ウィンドウタイトルの文字列を指定。
7ヘッダー2 コメント発言中のウィンドウタイトルの文字列を指定。
8説明1 掲示板のタイトルの下の説明文を指定。
9説明2 コメント発言時のタイトルの下の説明文を指定。
10戻り先URL タイトル説明文下のリンク先のURL。不要時空白。
例:/
11戻り先URL文言 タイトル説明文下のリンクの文言。「表紙に戻る」など。
12管理用URL 管理用の画面のURLを指定。不要時空白。
例:http://hpcgi1.nifty.com/kiosk/vanilla-set-config.pl
13掲示板URL 管理用の画面から掲示板に戻るURLを指定。不要時空白。
例:http://hpcgi1.nifty.com/kiosk/vanilla.pl

以下は環境設定のために使用開始時に一回だけ設定するような値である。

No.項目名変数名(*)@Nifty設定例
設定内容
1ログファイル $LOGFILE../homepage/vanilla.log
掲示板アクセスログのファイル名(cgi実行ディレクトリからの相対パス)を指定。ログを使用しない場合は空白にする。
2データファイル $DATAFILE ../homepage/data.txt
掲示板の書き込み内容を保存するデータファイル名(cgi実行ディレクトリからの相対パス)を指定。設定時には読み書き可能なパーミッションで空ファイルを作成しておく必要がある。
3gzipのパス $GZIP ./gzip
圧縮プログラムgzipを使用するときはそのパスを指定。使用しないときは空白とする。gzip自体は別途実行できるようにインストールしておく必要がある。
4アップロードファイルサイズの上限 $cgi_lib::maxdata 30000
アップロードするファイルサイズの上限バイト数を指定。使用できるディスク容量を元に適当に決定する。アップロードを許可しない場合は0または空白とする。
5アップロードファイルのディレクトリ $cgi_lib::writefiles ../homepage/uploadimg
画像をアップロードする宛先のディレクトリ(絶対パスあるいはcgi実行ディレクトリからの相対パス)を指定。
設定値は環境によりけり。
@NiftyではCGI実行ディレクトリが"/cgi-bin/"、HTMLを置くディレクトリが"/homepage"なので、"../homepage"の下にファイルを置かないと通常のHTMLから表示できない。設定例の初期値がややこしいのはそのためである。使用しない場合は設定不要。
6イメージURLの置き換え元 $IMG_DIR_PRE ../homepage
イメージURLの置き換え先 $IMG_URL_PRE http://homepage1.nifty.com/kiosk
@Niftyを想定しているために必要な設定。不要時は空白。
@NiftyではHTMLは
"http://homepage?.nifty.com/xxxxxx/"
でCGIは
"http://hpcgi?.nifty.com/xxxxxx/"(?は数字一文字、xxxxxxは作成者が付けた英数字の文字列)
とホスト名が異っているため、「イメージURLの置き換え元($IMG_DIR_PRE)」を「イメージURLの置き換え先($IMG_URL_PRE)」に置き換えたときHTMLの<IMG>タグから表示できるように設定する。
「イメージURLの置き換え元」については「アップロードファイルのディレクトリ($cgi_lib::writefiles)」の前半部分(全体)となる。
7イメージ表示プログラムURL $FLY /kiosk/fly.pl
イメージの大きさと色を変更するプログラムflyを使用する場合にはfly.plのURLを指定。使用しない場合には空白。flyは別途インストールする必要がある。(@Niftyでは添付のものを/cgi-binに置けばよい。)
8ロックファイルのディレクトリ $LOCK_DIR ../homepage/
複数の人が同時に掲示板に書き込みを行うと掲示板データが破壊されることがあるため同時に書き込みできないような仕組としてロックファイルを使用している。
このファイルを置くディレクトリ。通常カレントディレクトリで問題ないtが、CGI実行者が読み書きできる必要があるので必要に応じて作成する。
@Niftyでは"../homepage/"の指定で使用できている。
9ロックファイル $LOCK_FILE lockfile
ロックファイルの元となるプリフィックス部分。任意の名前で問題ない。
10ログロックファイル $LOG_LOCK_FILE loglockfile
ログ書き込みのためのロックファイルの元となるプリフィックス部分。任意の名前で問題ない。ログ使用しない場合は指定不要。
11ページ記事数 $PAGE_MAX 10
1ページに最低表示する記事の数。スレッドが長い場合この数字を越えて表示することがある。通常は10程度。
12文字イメージURLプリフィックス $LETTERIMGPATH http://homepage1.nifty.com/kiosk/image/letter/
文字イメージのURLの前半部分。HTMLの<IMG>タグで"${LETTERIMGPATH}xxx.gif"が画像として表示できるように設定。文字イメージを該当の場所に置く必要がある。

(*)この設定画面で値を設定するとvanilla-config.pl内にcgiプログラム用の変数として設定される。その変数名のことで通常あまり意識する必要はない。

発言管理

不適切な発言等の削除、復活を行う。メニューより選択すると横書きモードの発言一覧とほぼ同様のものを表示する。(違いは削除済発言でも表示しているところ。)

発言削除

不適切な発言等を削除するには発言右の「削除」ボタンを押す。(確認する画面が次にあり、復活も可能なのでそう慎重にすることもない。)

発言削除確認

選択した発言を本当に削除するか確認の画面を表示する。そのまま削除する場合はもう一度ボタンを押す。取りやめる場合は「戻る」のリンクを押す。

発言削除完了

削除完了すると発言リストに戻る。削除した発言は背景白となり「(管理者削除)」と発言上段に表示する。

発言復活

誤って削除した発言を復活させたい場合は発言右の「復活」ボタンを押す。以下削除の場合と同様である。


利用規定

  1. この掲示板はフリーソフトとする。
    • 利用者は無償で自由に使用することができる。
    • ソースコードの利用・改変等も自由とする。
    • ソースコードを利用した場合にはその旨記述いただければうれしい。
    • また連絡いただければさらにうれしい。
  2. この掲示板を利用した事によるいかなる損害も作者は一切の責任を負わない。
  3. 作者に著しく不利益があると判断した場合には一方的にスクリプトの使用を中止してもらうことがある。
  4. 設置や内容に関する質問はメールでも掲示板でもお受けする。ただしその後の対応は以下とする。フリーであるということで許していただきたい。
    • 設置については作者がアットニフティに置いているため、それ以外のプロバイダでの設置については分かる範囲でしかお答えできない。
    • スクリプトやコンピュータ、ネットワークについてある程度の知識のあることを前提とした説明しか行っていない。知識のない方がこれを利用するためにトライされることは歓迎するが、使用できるまでのサポートを保証するものではない。
    • 時間的、精神的な余裕の範囲で回答はするつもりだが、回答の義務はないものとする。
  5. このスクリプトに関しての質問・感想・コメントは以下の掲示板で受付ける。
    http://www.geocities.co.jp/SiliconValley/7757/guestbook1.html
    このスクリプトは実際に以下のURLで稼働している。
    http://hpcgi1.nifty.com/kiosk/vanilla.pl
    テストで書き込みをしたいという要望はひとつもなかったが、テスト書き込み用の掲示板を以下に作成してみた。ご自由に書き込んでいただける。
    http://hpcgi1.nifty.com/kiosk/test/vanilla.pl
  6. このスクリプトに関してリンクをはる場合のURLは以下を勧める。
    http://www.geocities.co.jp/SiliconValley/7757/v/
  7. 作者の連絡先は
    yoshidanaohiro@geocities.co.jp

変更履歴


Q&A(掲示板より)

(この上まではマニュアル的なものなので文章は常体で、ここからは読み物的なものなのでですます調です。)

質問とその答えです。ユーザ的な質問とシステム的な質問が両方混ざっていて特に区別していません。質問の文章は微妙に修正した箇所もありますので、もしも問題と思われる方がおられたらご連絡ください。

スレッドの伸びる方向

Q.横書きの場合でもスレッドにする場合は下に行くほど新しくなるんだから、縦書きでも最新が左側に来る方が正しいんじゃないですか?正確には、スレッド内では下または左が最新で、スレッド同士の間では、新しいスレッドほど上または右に来るのが正しい。てゆーか少なくとも読みやすい。

A.ご指摘の件は意図的なものです。

確かにスレッドの場合「通常」コメントの発言が下にあるので、その場合にはコメントの発言が左にある方が正しいと思います。

しかし、スレッドのないゲストブック等では新規発言が最初に目に入るように上に来るものが多いのに、スレッド式のものの場合だけ新しいものが下にあるということ自体を私はヘンではないかと感じていたため、自分で作成するときには自分の好みのようにしました。

つまり、スレッドとしての発言の順位より、新規発言かどうかをより重視して、新しい方を常に初期表示位置に近いところ(つまり右)に表示するようにしてあります。発言欄の横書きチェックをつけて横書きにしてもらえば分かる通り、これは横書きの場合でも同様です。新規の発言の方が上にあります。

スレッド内でのコメントの深さはネストの量で示されているため、情報として犠牲になっているものは特になく、これはこれで慣れれば使いやすいと私は確信しています。

オフライン表示

Q.ワタシの環境では「新友情破壊計画」がグレードアップしてからオフラインで見られないようになりました。前は一度見るとパソコンがその様子を憶えていて後からいくらでも見直せたんだけれど、今は見ようとすると「オフラインでは見られません(接続し直せ、バカ)」って意味のことを言われます。ちょっと残念です。

ブロードバンドで常時接続とかって値打ちあるのかなと思っている最中です。近所のケーブルテレビ局が、月に4000円で常時接続OKってサービスをやってるのを知って、検討しています。

A.家にあるIEで見たら確かにオフラインでは見られないです。確かになんていうのか掲示板の作りが前とは違っていて、前はデータを加工してHTMLを作成していたんですが、今は書き込むと決まった場所にデータはほぼそのままの形で保存します。そんで表示するときに縦にしたり横にしたりして出しています。

結論的にはいろんなブラウザとか要求に対応しようとしたために、オフライン表示機能が犠牲になったと思ってください。質問されているアナタ個人には不便になった訳ですが、前のよりはいろんな環境の人が読めるということにおいて「よりいい」と思っています。申し訳ないですが、IEでのオフラインには対応できそうもありません。巡回ソフトを使えばオフラインでも表示できるのかもしれないですが、案内できるほどは知りません。

画像がある時に表示がヘン

Q.画像がある時に表示が乱れます。なんとかなりませんか。

A.(Ver.0.9.3までについて)画像があるときの表示の乱れにはある程度対応しました。IE4,5,5.5,6,NN4.7,6.1で確認。6個のバージョンのブラウザで5種類のHTMLを吐いてます。MACでは確認していないので、うまく行くか行かないかも不明です。また、ある程度対応したとは言っても相当不自然にスタイルシートやJavaScriptを使用しているので、ときたまやはり画像と文字が重なったりしてヘンになります。その時はリロードしてみてください。それでも使用に耐えないようでしたら横書きモードにして使用してください。

(Ver.0.9.4から)スタイルシートやJavaScriptをなるべく使用せずtableタグを使用して縦書きするように変更しました。そのことにより画像表示の乱れはなくなった(かなり少なくなった)と思いますが、注意事項としては同様で、表示がおかしくなったらリロードしてみてください。それでも使用に耐えないようでしたら横書きモードにして使用してください。

Operaで見ると横書き(ヘンな表示)になる

Q.(1).この掲示板って、Operaで見ると横書きになるんですね。新鮮です。
(2).私のOperaは、VER6で、軽いし、以前のOperaと違ってデフォルトで日本語表示できるのですが、ボタンがうまく表示できないのと、スレッド表示の際の桁ずれが出ないんで掲示板には使いにくいです。
しかし、ボタンはともかくスレッドは日本語フォントのせいじゃないよな。何でだろう?

A.OperaについてはWindows版のVer.6については縦書き対応しました。最新版(Ver.0.9.6ただしVer.0.9.3でも対応はしている)をご使用ください。

このプログラムは内部でUSER_AGENTという環境変数の値を見てブラウザを判定し、それぞれに応じた出力を吐くように作成されていますが、OperaではこのUSER_AGENTの値が何種類か切り換え可能になっています。

前の版のこのプログラムではUSER_AGENTが"Opera..."になっている場合にはNetscapeでもIEでもないので横書きで表示し、USER_AGENTが"Mozilla..."になっている場合には、MozillaかNetscapeと思って動作しようとして、微妙なブラウザの違いによってヘンな表示になっていました。

新しい版ではOperaにも対応した出力を吐くようになっているので、ほぼ問題なく使用できるはずです。(0.9.3ではOpera用の独自な出力をしていたが、0.9.4からは独自の出力ではなくなった。)Operaの利点の軽さはだいぶ犠牲になっていますが(というかどのブラウザでも速さは相当犠牲になってますね…)。横書きモードの使用はもちろん問題ありません。


その他書いておきたいこと

縦書きの実装について

この掲示板のいわゆる目玉の機能は縦書き表示機能と言えます。それを除いてはまあスレッドの伸びる方向が通常と逆なくらいで普通の掲示板となんら変わるところのない一般的な掲示板に過ぎません。しかし、念のために書いておきますが、このプログラムの縦書きの実装はプログラム設計としては言わばムチャクチャで正しい実装と言えば嘘になり、間違ったやり方と言っても過言ではない、と言った感じのものです。HTMLのタグとJavaScriptとスタイルシートの機能を用いて、無理矢理縦書きに見えるような小細工をしています。

では、正しい実装としてはどうなるのかと言うと、スタイルシートには文字の流れる方向を指定するdirectionというプロパティがありますが、これで縦方向に流れるという指定をし、各ブラウザがその指定に従って正しく表示するように実装するという話になるのではないかと思います、おそらく。しかし、例の載っているヘブライ語の場合などと違って、日本語の場合は横書きでも特に問題ないため、縦書きが考慮される日が近々来るとは考えにくいです。

ところでIEの5.5(IE6でどうなったのか知らない)にはスタイルシートにwriting-modeという属性があり、これに"tb-rl"という値を指定することでこのスタイル指定が適用されるコンテンツの表示を縦書きにするという話です。これは上の方針から言ってまともなやり方とも言えます。ブラウザはスタイルシートとして解釈できない属性は無視して表示しますから、勝手に属性を追加しても他のブラウザで表示できなくなるというような心配はありません。IEを使っている人は多いので、IEに機能を追加すると、それが事実上標準となって広まって行くことが実際これまでもあり、それは何かやり方としてはゲリラ的なのかもしれないですが、ユーザからしたらそんなに無茶な話でもないように感じます。

まあ私が例えばブラウザを作る立場であればIEと同じく新しい属性を導入するようなやり方で縦書きを実装したのかもしれません。Netscapeのブラウザから派生したMozillaはソースが公開されていますから、ブラウザに修正を入れるという方向は確かにある意味正しいとも言えます。でも、残念ながらブラウザのソースを読んで直すほどの時間と技術がありません。もうひとつにはそういうものを作ったとしても実際に使ってくれる人がいなければあんまり意味がありません。そこで割りと一般的にみんなが使っているIEやNetscapeのブラウザで縦に表示できるような仕組を無理矢理作ったという話です。

まあ、IEの5.5以降でwriting-mode属性がずっと使えるようになるのであれば、別段ヘンチクリンなことをしてまで縦書きに見えるようにする必要はこれっぽっちもないのですが、これに取り掛かった時(2年も前!)はまだそのような属性はスタイルシートになかったし、私はNetscapeユーザなので、Netscapeでも縦書きに見えるようなものが作りたかった、それだけのことです。

なお、IEでの縦書きレイアウトについてはここを参照ください。(2002.2.4修正)

vanillaの名前

縦書きverticalの頭文字のvから始まり、ブラウザとしてある程度有名なNetscape社のMozilla(これはなぜか知らないがゴジラから来ているらしい)に似ている単語、そしてかわいくポップな感じにしようと思って、vanillaとつけました。まあ気に入っていたのですが、私の普段使っているDebian GNU/Linuxのどれかのバージョンのインストールの際、どっかにvanillaという名前がでてきていて「ああ使われてる」とちょっとがっかりしました。でもあんまり気にしないでそのままです。

ソースコードの汚さ

ソースコードは公開しますが、かなり汚い上、あんまり整理もしてないし、コメントもほとんどありません。特に割りとメインの機能とも言える文章の折り返し機能のところは無惨です。

時間的な問題もありますが、能力的なものや性格的なものもかなりあります。

これは通常のアプリケーション開発の場合もそうなのですが、あるアイディアで一通り動くものを作って使いはじめ、しばらく使っていると、どこかで都合の悪いケースが出てきます。もちろん修正して対応するのですが、修正の数がある程度多くなって来ると作った人間もどうなっているのか良く分からなくなって来ます。90%くらい動作していると、残りの10%は無理矢理なんとかつぎはぎしてでも動かしてしまおうとするので、更に判読不能なソースとなって行きます。

そんなにどんどん修正の入るものというのは実際は設計というか方針自体が間違っている可能性が高いのですが、まあ大抵のケースで動いているので動いているものはいじらない(つまりその上に追加して直して行く)、そういう原則の元に他人には判読不能で修正不能なヘンなシステムができあがったりするものです。面白がっている場合じゃないですが。

またそうして開発したものなので、実行速度についてもほとんど考えられていません。まあ常識的にファイルの読み書きは時間がかかるので、その回数があんまり多くならないようにするという程度です。

拝借コード

いろいろな方のコードを改変したりしなかったりして使用しているところがあります。以下が主なところです。

cgi-lib.pl Steven E. Brenner氏
jcode.pl fold.pl 歌代 和正氏
Perlメモ 大崎 博基氏
Ywai with DynamicHTML CLOSED Yusuke Miyakita 氏
TZBBS CLOSED?
特に「Perlメモ」と「Ywai」は大変参考になるサイトでしょっちゅう利用させていただいています。この場を借りてお礼申し上げます(「Ywai」はクローズしていました、残念)。


YOSHIDA Naohiro
Last modified: Sun Oct 5 21:07:34 JST 2003