//
// HTML.msl - HTMLファイル編集支援ライブラリ Version 1.03
// Copyright 2004-2007 Anchor Systems Corporation
// $Id: HTML.msl,v 1.56 2007/03/26 14:58:36 monnai Exp $
//
//【概要】
//	HTMLファイル編集の支援スクリプトを作成するためのライブラリです。
//	個々のタグの編集機能、色の編集機能などを使って利用することができます。
//	編集対象外の属性やその出現順序は、できるだけそのまま保存するので、安心
//	して編集できます。
//
//【HTMLタグヘルプに関して】
//	HTML.tagHelpURL に設定されている URL の <TAG> の部分を実際の小文字タグ
//	名に置換したものを参照します。 デフォルトでは、「とほほのWWW入門」を参
//	照させてもらっています。「サイト内のどのページでもリンクは確認不要」と
//	あり、大変便利に使わせてもらっています。ありがとうございます。各タグの
//	編集ダイアログボックスからは、F1キーでヘルプを表示できます。
//
//【グローバルオブジェクト】
//	このライブラリを読み込むと、以下の２つオブジェクトがグローバルオブジェ
//	クトに追加されます。
//
//		HtmlTag ...	HTMLタグを表すクラス
//		HTML ......	HTMLの編集をサポートする関数、定数を集めたオブジェクト
//
//	グローバルオブジェクトではありませんが、何かと便利なので String クラス
//	に splitcsv() というメソッドを追加しています。これは、文字列をコンマで
//	分離し(文字列の)配列に変換するメソッドです。コンマの前後のスペースも区
//	切りの一部と見なして削除されます。これは、配列を [ "a", "b", "c", ...]
//	とだらだら記述するより、文字列を１つにまとめてそれを分解した方が簡潔に
//	見え、しかもプログラムのコンパクトになるためです。
//
//【TODO】
//	1.	リンクの検証で<a name="...">、<a href="...">以外にも、<img usemap>
//		<map name>などもチェックしたい。
//	2.	同じファイル内で name 属性がユニークであることの検証もあれば便利。
//		ただしチェックやラジオボタンの名前を賢く処理する必要がある。
//	3.	スタイルシートの編集のサポート。
//	4.	href="/abc/def.html"のように、絶対パスで記述されている場合、どこが
//		ルートかを指定する方法が必要。もちろん自動判別できれば、なおよい。
//		(たぶんファイルのあるところからフォルダを上がっていって index.html
//		のあるところがROOT?)
//	5.	フレームを使ったページを表示しているとき、そのどこかに表示されてい
//		るファイルを編集した後での再描画を行えるようにしたい。
//	6.	タグの終りを示す > の前にスペースを入れるオプション。
//
//【ライセンス】
//	このライブラリの著作権は、アンカーシステムズ株式会社にあります。誰でも
//	このライブラリを無償で使用、改変あるいは改変することなく再配布できます。
//	ただし、オリジナルの著作権表示はそのまま残さなければなりません。
//
//【保証】
//	このライブラリを使った結果に対してアンカーシステムズ(株)は如何なる責任
//	も負うものではありません。あくまでも利用される方の判断と責任においてご
//	利用ください。
//
//【バージョン】
// HTML.msl Version 1.03 2007/03/26
//	H1、H2、H3、H4、H5、H6 のヘルプを H1 で代表させるようにしました。
// HTML.msl Version 1.02 2007/02/02
//	エンティティからの変換で、&apos; を ' に変換するようにしました。
// HTML.msl Version 1.01 2007/01/18
//	エンティティへの変換で、" を &quot; に変換しないように修正しました。
// HTML.msl Version 1.00 2006/06/06
//	この拡張スクリプトは、Peggy Series バージョン 4.14 以上でお使い下さい。
//


/////////////////////////////////////////////////////////////////////////////
// HtmlTag - HTML TAG を表すクラス

global.HtmlTag = HtmlTag;
String.prototype.splitcsv = function() { return this.split(/\s*,\s*/); };

function HtmlTag(elem, type)
{
	// HtmlTag クラスのコンストラクタ。
	this.elementName = HtmlTag.formatNewElementName(elem);
	this.type		= type || 1; // 1: <...>、2: </...>、3: <.../>
	this.pieces		= [ ];		// 属性と空白の断片の順序を記憶する配列
	this.values		= { };		// 連想配列: 小文字の属性名 => 値
	this.quotes		= { };		// 連想配列: 小文字の属性名 => 引用符
}

HtmlTag.elemCase	= 0;		// エレメント名の大文字小文字を	-> 0:変えない、1:小文字、2:大文字、3:強制CAP
HtmlTag.attrCase	= 0;		// 属性名の大文字小文字を		-> 0:変えない、1:小文字、2:大文字、3:強制CAP
HtmlTag.newElemCase	= 1;		// 新規エレメント名の大/小文字	-> 0:(未使用)、1:小文字、2:大文字、3:強制CAP
HtmlTag.newAttrCase	= 1;		// 新規属性名の大/小文字		-> 0:(未使用)、1:小文字、2:大文字、3:強制CAP

HtmlTag.caseConverters =		// 大文字/小文字変換関数の配列 (0〜3)
[
	function(str)	{ return str; },
	function(str)	{ return str.toLowerCase(); },
	function(str)	{ return str.toUpperCase(); },
	function(str)	{ return str.substr(0, 1).toUpperCase() + str.substr(1).toLowerCase(); }
];

HtmlTag.valueQuote	= 1;		// 属性値の引用符を
								//	0: できるだけ変えない(新規属性には付けない)
								//	1: できるだけ変えない(新規属性にはつける)
								//	2: できるだけ付けない(必要なときだけ付ける)
								//	3: 数字以外付ける
								//	4: 必ず付ける
HtmlTag.quoteChar	= "\"";		// 引用符として使うデフォルト文字( " または ' または空文字列 )
HtmlTag.quoteName	= true;		// name, href, src の値には常に引用符を付ける

HtmlTag.typefaces	=			// <font> タグでコンボボックスから選択できるタイプフェイスリスト
[
	"ＭＳ ゴシック",
	"ＭＳ Ｐゴシック",
	"MS UI Gothic",
	"ＭＳ 明朝",
	"ＭＳ Ｐ明朝",
	"Arial",
	"Century",
	"Times New Roman",
	"Terminal",
	"Courier"
];

HtmlTag.parse = function(vw, pt)
{
	// ポイント pt、またはカーソル位置のHTMLタグを解析するクラスメソッド。
	// view がない、pt、カーソル位置にタグがない、またはエレメント名が正し
	// く取得できなかった場合は、null を返す。
	//
	// NOTE:
	//	言語モードは、HTML、JSP、PHP など HTML ベースのものであること。
	//	この関数を呼び出してもカーソルや選択範囲は変化しない。
	//	ポイント pt、カーソルは、タグ開始位置(<の位置)からタグの途中のどこに
	//	あってもよい。そのタグ全体を解析して以下の形式で返す。
	//
	//	tag[0] ............. Point		開始ポイント位置
	//	tag[1] ............. Point		終了ポイント位置
	//	tag.elementName .... string		エレメント名
	//	tag.type ........... integer	タグ形式: 1=<...>、2=</...>、3=<.../>
	//	tag.pieces ......... Array		属性と空白の配列 (出現順・大文字小文字もそのまま)
	//	tag.values ......... Object		連想配列: 小文字の属性名 => 値 (引用符なし)
	//	tag.quotes ......... Object		連想配列: 小文字の属性名 => 引用符
	//	tag.text ........... string		タグ文字列
	//	tag.editor ......... View		編集ウインドウ
	//	tag.postOpen ....... string		開きタグの後に追加する文字列
	//	tag.preClose ....... string		閉じタグの前に追加する文字列
	//	tag.postProcess .... function	タグ挿入後に行う追加処理関数
	//
	// NOTE: 属性の表し方
	//	values にエントリーがない場合は、タグに属性が存在しないことを意味する。
	//	values にエントリーがある場合は、下表の値と引用符の組み合わせに従う。
	//
	//	===========	===============	=========================================
	//	   属性値	   引用符			属性値
	//	-----------	---------------	-----------------------------------------
	//		あり		あり			="value" または ='value'
	//		あり		空				=value
	//		あり		未定義			新規登録属性である
	//		なし		あり			="" または =''
	//		なし		空				フラグ属性 (=value の部分がない属性)
	//		なし		未定義			(				同上				)
	//	===========	===============	=========================================
	//

	var tag = vw && vw.htmlGetTag(pt || vw.CP);
	if (!tag)
		return null;

	// <!DOCTYPE ... > のようなタグ(?)ではエレメント名がセットされないので、
	// エラーを避けるため、取りあえず ! をセットしている。
	if (!tag.elementName)
		tag.elementName = "!";

	// テキストを取得し、マッチング開始位置(エレメント名の直後)をセットする。
	var text = vw.getTextBetween(tag[0], tag[1]);
	var rexp = /([A-Za-z_][A-Za-z0-9_-]*)\s*(=\s*("[^"]*"|'[^']*'|[^\s>]+))?|\s+/g;
	rexp.lastIndex = tag.elementName.getByteLength() + (tag.type == 2 ? 2 : 1);

	// 属性を解析し、属性名と空白の出現順序をpieces配列、属性値をvalues連想配列、
	// 引用符をquotes連想配列へそれぞれ保存する。
	var pieces = [ ];
	var values = { };
	var quotes = { };

	var array;
	while (array = rexp.exec(text))
	{
		var name = array[1];
		if (name)
		{
			// 属性の名前、値、引用符の種類("、'、なし)を分離してを記録する。
			pieces.push(name);
			var quote = "";
			var value = array[2] ? array[3] : "";

			var first = value.substr(0, 1);
			if (value.length >= 2 && (first == "\"" || first == "'") && first == value.substr(-1))
			{
				quote = first;
				value = value.slice(1, -1);
			}
			name = name.toLowerCase();
			quotes[name] = quote;
			values[name] = value;
		}
		else
		{
			// 属性間の空白文字を記録する。
			pieces.push(array[0]);
		}
	}

	// 属性とその値の解析結果をtagに追加し結果として返す。
	tag.pieces	= pieces;
	tag.values	= values;
	tag.quotes	= quotes;
	tag.editor	= vw;
	tag.text	= text;

	// tag を HtmlTag クラスのインスタンスに化けさせる。
	tag.__proto__ = this.prototype;
	return tag;
};

HtmlTag.prototype.dump = function(page)
{
	// タグの内容をデバッグ用にできるだけ加工せずにダンプする。
	if (!page)
		page = output[7];

	// エレメント名とタイプをダンプする。
	page.writeln("Element Name: ", this.elementName);
	page.writeln("Element Type: ", [ "unknown", "open", "close", "self-close" ][this.type || 0]);
	if (this[0] && this[1])
		page.writeln("Points: (", this[0].line, ", ", this[0].index, ") 〜 (", this[1].line, ", ", this[1].index, ")");

	// 属性情報をダンプする。
	var pieces	= this.pieces;
	var values	= this.values;
	var quotes	= this.quotes;
	var check	= { };

	writeln("Attributes:");
	for (var i in pieces)
	{
		// 属性間の空白は無視する。
		var piece = pieces[i];
		if (HtmlTag.isBlank(piece))
			continue;

		// pieces に重複して登録されている属性を無視する。
		var lower = piece.toLowerCase();
		if (check[lower])
			continue;
		check[lower] = true;

		// values に登録されている属性と値をダンプする。
		if (lower in values)
		{
			var quote = quotes[lower];
			writeln("\t", piece, " = ", quote, values[lower], quote);
		}
	}
};

HtmlTag.getTagText = function(elem, type)
{
	// 単純なテキスト表現のタグを作成する。
	return (type == 2 && !HtmlTag.wantClose(elem))
		? ""
		: (new HtmlTag(elem, type)).compose();
};

HtmlTag.prototype.compose = function(separator)
{
	// HTML タグテキストを組み立てる。
	// separator が指定されているときは、それを使って属性間を区切る。
	// 指定されていないときは、できるだけ元の空白文字列を使って区切る。

	if (!this.type || !this.elementName)
		return "";

	// タグ開始部分を作成する。
	var text = (this.type == 2 ? "</" : "<") + HtmlTag.formatElementName(this.elementName);

	// できるだけ空白なども含め元に近い形で属性情報を付け加える。
	var pieces	= this.pieces;
	var values	= this.values;
	var quotes	= this.quotes;
	var check	= { };
	var space	= "";

	for (var i in pieces)
	{
		var piece = pieces[i];
		if (HtmlTag.isBlank(piece))
		{
			// 属性間の空白を覚えておき、次の属性名の直前に挿入する。
			if (!space)
				space = piece;
			continue;
		}

		// pieces に重複して登録されている属性を無視する。
		var lower = piece.toLowerCase();
		if (check[lower])
			continue;
		check[lower] = true;

		// values に登録されている属性だけ出力する。
		if (lower in values)
		{
			// 少なくとも1つの空白文字、続いて属性名とその値を追加する。
			text += (separator || space || " ") + HtmlTag.formatAttrName(piece);
			space = "";

			var value = values[lower];
			var quote = quotes[lower];
			if (value || quote)
				text += "=" + HtmlTag.formatAttrValue(lower, value, quote);
		}
	}
	return text + (this.type == 3 ? " />" : ">");
};

HtmlTag.formatElementName = function(name)
{
	// エレメント名の大文字/小文字を整形する。
	return HtmlTag.caseConverters[ HtmlTag.elemCase || 0 ](name);
};

HtmlTag.formatNewElementName = function(name)
{
	// エレメント名の大文字/小文字を整形する。
	return HtmlTag.caseConverters[ HtmlTag.newElemCase || 1 ](name);
};

HtmlTag.formatAttrName = function(name)
{
	// 属性名の大文字/小文字を整形する。
	return HtmlTag.caseConverters[ HtmlTag.attrCase || 0 ](name);
};

HtmlTag.formatNewAttrName = function(name)
{
	// 属性名の大文字/小文字を整形する。
	return HtmlTag.caseConverters[ HtmlTag.newAttrCase || 1 ](name);
};

HtmlTag.formatAttrValue = function(attr, value, quote)
{
	// 属性値を整形し、設定により必要に応じて引用符を付ける。
	var qchar = HtmlTag.quoteChar || quote || "\"";

	// 設定に従って属性値に引用符を付ける。
	switch (HtmlTag.valueQuote) {
	case 1:
		// できるだけ変えない(新規属性にはつける) --> quoteが未定義なら新規定義なので付ける。
		if (quote === undefined)
			quote = qchar;

	case 0:
		// できるだけ変えない(新規属性には付けない) --> 付いていなくて必要なら付ける。
		if (quote)
			break;

	case 2:
		// できるだけ付けない --> A-Z、a-z、0-9、_、-、:、. だけなら付けない。
		// NOTE: HTML4.01 から _ と : が引用符省略可能文字に追加された。
		if (HtmlTag.quoteName && (String.stricmp(attr, "href") == 0 || String.stricmp(attr, "src") == 0 || String.stricmp(attr, "name") == 0))
			quote = qchar;
		else
			quote = /^[-.:_0-9A-Za-z]+$/.test(value) ? "" : qchar;
		break;

	case 3:
		// 数字以外付ける --> 数字は付けない。
		quote = /^\d+$/.test(value) ? "" : qchar;
		break;

	default:
		// 必ず付ける。
		quote = qchar;
		break;
	}

	if (quote)
	{
		// 値に含まれている引用符は使えないのでもう一方に変更する。
		// どちらも含まれていないのであれば、そのまま使えばよい。
		var sq = /'/.test(value);
		var dq = /"/.test(value);
		if (sq && dq)
		{
			// 両方ある場合は、" を &quot; に変換してから " を使う?
			value = value.replace(/"/g, "&quot;");
			quote = "\"";
		}
		else if (dq)
			quote = "\'";
		else if (sq)
			quote = "\"";
	}
	return quote + value + quote;
};

HtmlTag.isBlank = function(str)
{
	// 空白文字だけからなる文字列かどうかテストする。
	return !str || !str.trim();
};

HtmlTag.prototype.getAttr = function(attr)
{
	// 属性値を取得する。
	return this.values[ attr.toLowerCase() ];
};

HtmlTag.prototype.setAttr = function(attr, value, quote)
{
	// 属性値を設定する。
	var lower = attr.toLowerCase();
	if (!(lower in this.values))
	{
		// 初めての属性ならば、順序配列の最後に追加する。
		// 新規属性を追加する場合は、新規属性の大文字/小文字ルールに従う。
		this.pieces.push(HtmlTag.formatNewAttrName(attr));
	}

	// 値と(指定されていれば)引用付の形式を設定する。
	this.values[lower] = value;
	if (arguments.length >= 3)
		this.quotes[lower] = quote;
};

HtmlTag.prototype.delAttr = function(attr)
{
	// 属性値を削除する。
	return delete this.values[ attr.toLowerCase() ];
};

HtmlTag.prototype.testAttr = function(attr, value)
{
	// 属性値を大文字小文字を区別せずに一致しているかどうか調べる。
	var val = this.getAttr(attr);
	return val && String.stricmp(val, value) == 0;
};

HtmlTag.prototype.updateAttr = function(attr, value)
{
	// 属性を更新(セットまたは削除)する。
	if (value === undefined || value == "")
		this.delAttr(attr);
	else
		this.setAttr(attr, String(value));
};

HtmlTag.prototype.updateByNames = function(names, values)
{
	// namesに名前が列挙されている複数の属性をまとめて更新する。
	// 名前リストとして文字列が渡された場合は、| を区切りと見なして分解する。
	if (typeof names == "string")
		names = names.splitcsv();

	for (var i in names)
	{
		var notrim = false;
		var attr = names[i];
		var code = attr.charCodeAt(0);
		if (code == 0x21 /* "!" */)
		{
			// 属性名の先頭が(!)なら、フラグとして処理する。
			attr = attr.substr(1);
			this.updateFlag(attr, values[attr]);
			continue;
		}

		if (code == 0x23 /* "#" */)
		{
			// 属性名の先頭が(#)なら、属性値のトリミングをしない。
			attr = attr.substr(1);
			notrim = true;
		}
		var value = String(values[attr]);
		this.updateAttr(attr, notrim ? value : value.trim());
	}
};

HtmlTag.prototype.updateFlag = function(attr, flag)
{
	// 属性名があることだけが意味を持つ属性(例: <hr noshade>)を設定/削除する。
	if (flag)
		this.setAttr(attr, "", "");
	else
		this.delAttr(attr);
};

HtmlTag.prototype.getQuote = function(attr)
{
	// 属性値が囲まれていた引用符を返す。
	return this.quotes[ attr.toLowerCase() ] || "";
};

HtmlTag.prototype.setQuote = function(attr, quote)
{
	// 属性値が囲まれている引用符を設定する。
	this.quotes[ attr.toLowerCase() ] = quote || "";
};

HtmlTag.prototype.setPostPre = function(post, pre)
{
	this.postOpen = post;
	this.preClose = pre;
};


/////////////////////////////////////////////////////////////////////////////
// HtmlTag - 閉じタグ必要性の判定

HtmlTag.wantClose = function(elem)
{
	// elem が閉じタグを必要とするかどうかを判定する。
	// closeTags[] になければ必要とみなす。
	// closeTags[] にあれば、それをインデックスとして closeOpt[] を参照する。

	elem = elem.toLowerCase();
	return !(elem in HtmlTag.closeTags) || HtmlTag.closeOpt[ HtmlTag.closeTags[elem] ];
};

HtmlTag.mustClose = function(elem)
{
	// elem が必ず閉じなければならないタグかどうかを判定する。
	return !(elem.toLowerCase() in HtmlTag.closeTags);
};

HtmlTag.isOpenOnly = function(elem)
{
	// elem が閉じタグなしのタグであるかどうかを判定する。
	return HtmlTag.closeTags[ elem.toLowerCase() ] === 0;
};

HtmlTag.mayOmitClose = function(elem)
{
	// elem が省略可能タグであるかどうかを判定する。
	return HtmlTag.closeTags[ elem.toLowerCase() ] >= 2;
};

HtmlTag.closeTags	=
{
	// Group 0 - 閉じタグなし
	area: 0, base: 0, basefont: 0, bgsound: 0, br: 0, col: 0, embed: 0,
	frame: 0, hr: 0, img: 0, input: 0, isindex: 0, keygen: 0, link: 0,
	meta: 0, nextid: 0, param: 0, plaintext: 0, spacer: 0, wbr: 0,

	// Group 1 - 常に必要 (この連想配列になければ常に必要なので該当なし)
	// Group 2 - 省略可能 <p>
	p: 2,

	// Group 3 - 省略可能 <table> (1) 関連タグ
	tr: 3, th: 3, td: 3,

	// Group 4 - 省略可能 <table> (2) 関連タグ
	colgroup: 4,

	// Group 5 - 省略可能 <table> (3) 関連タグ
	thead: 5, tfoot: 5, tbody: 5,

	// Group 6 - 省略可能 <ol>、<ul> 関連タグ
	li: 6,

	// Group 7 - 省略可能 <dl> .... </dl> 関連タグ
	dt: 7, dd: 7,

	// Group 8 - 省略可能 <option>
	option: 8,

	// Group 9 - 省略可能 <ruby> 関連タグ
	rb: 9, rp: 9, rt: 9
};

HtmlTag.closeOpt	=
[
	false,			// Group 0 - 閉じタグなし
	true,			// Group 1 - 閉じタグ必須

					// ここから後ろは、ユーザの好みに従って on/off するオプション
	true,			// Group 2 - <p>
	false,			// Group 3 - <table> (1) 関連 <tr>、<th>、<td>
	false,			// Group 4 - <table> (2) 関連 <colgroup>
	false,			// Group 5 - <table> (3) 関連 <thead>、<tfoot>、<tbody>
	false,			// Group 6 - <ol>、<ul> 関連 <li>
	false,			// Group 7 - <dl> 関連 <dt>、<dd>
	false,			// Group 8 - <option>
	false			// Group 9 - <ruby> 関連 <rb>、<rp>、<rt>
];


/////////////////////////////////////////////////////////////////////////////
// HTML - private variables in the HTML library name space

global.HTML = { };						// HTML 作成支援ライブラリのネームスペース

HTML.colorPalette	= CPS_SAFECOLORS;	// 0:基本色、CPS_SAFECOLORS: 216色、CPS_HTMLCOLORS: 140色
HTML.useColorName	= 1;				// 0:すべて数値、1:基本色は名前、2:できるだけ名前

HTML.pickCloseMax	= 1;				// closeTag で閉じタグ候補の最大数
HTML.pickCloseAll	= true;				// 省略を選択しているタグも候補とする。

HTML.enterPHP		= "<?php";			// PHPへ移行するシーケンス
HTML.leavePHP		= "?>";				// PHPを終了するシーケンス
HTML.valuePHP		= "<?=";			// <?php echo > 代替記述

HTML.enterASP		= "<%";				// ASP/JSP/PSP の切り替えシーケンス
HTML.leaveASP		= "%>";				// ASP/JSP/PSP から HTML へ戻るシーケンス
HTML.valueASP		= "<%=";			// ASP/JSP/PSP の式の値

HTML.scriptUseType	= false;			// true なら <script type="text/JavaScript"> で言語を指定し、
										// false なら <script language="JavaScript"> 形式で指定する。
HTML.itemizeLines	= true;				// 行をリスト項目に変換する。

HTML.tableAddItems	= false;			// 最後に作成したテーブルで項目を作成する。
HTML.tableHeader	= false;			// 最後に作成したテーブルのヘッダの有無。
HTML.tableRows		= "";				// 最後に作成したテーブルの行数。
HTML.tableCols		= "";				// 最後に作成したテーブルの桁数。
HTML.tableComment	= false;			// 最後に作成したテーブルにコメントを付加する。
HTML.tableIndent	= true;				// 最後に作成したテーブルをインデントする。
HTML.tableSeparator	= 0;				// カラムの分離方法 0:なし、1:コンマ、2:タブ、3:正規表現
HTML.tableRegexp	= [ "\\s*,\\s*" ];	// カラム部分の分離正規表現。

HTML.sortAnchorList = true;				// アンカー名のリストをソートする
HTML.hrefHistory	= [ ];				// <a href="..."> に設定したリンク先の履歴

HTML.imageHistory	= [ ];				// イメージファイルの履歴
HTML.scriptHistory	= [ ];				// スクリプトファイルの履歴
HTML.soundHistory	= [ ];				// サウンドファイルの履歴

HTML.hrefFilter		=    "s?html?,aspx?,php[345]?,jsp,psp,cgi,txt,pdf,css,js,jpe?g,gif,png";
HTML.hrefFilterRexp	= /\.(s?html?|aspx?|php[345]?|jsp|psp|cgi|txt|pdf|css|js|jpe?g|gif|png)$/i;

HTML.styleHistory	= [ ];
HTML.storeProfile	= true;				// 設定を変更したら保存する。


/////////////////////////////////////////////////////////////////////////////
// HTML - inserting tag

HTML.insertTag = function(elem, bSkipDialog)
{
	if (!view)
		error("編集ウインドウが開いていません.");
	if (getReadOnly())
		error("編集禁止ウインドウです.");

	// 新しくタグを作成する。
	var tag		= (elem instanceof HtmlTag) ? elem : new HtmlTag(elem);
	var name	= tag.elementName;
	tag.editor	= view;

	if (!bSkipDialog)
	{
		// タグエディタがあれば編集する。
		var editor	= HTML.tagEditors[ name.toLowerCase() ];
		if (editor && !editor(tag))
			return;
	}

	// 開きタグ文字列を作成する。
	var text1 = tag.compose();
	if (tag.postOpen)
		text1 += tag.postOpen;

	// 必要なら閉じタグ文字列を作成する。
	var text2 = "";
	if (HtmlTag.wantClose(name))
	{
		if (tag.preClose)
			text2 = tag.preClose;
		text2 += HtmlTag.getTagText(name, 2);
	}

	// 編集ウインドウへ挿入する。
	HTML.doInsertTag(text1, text2);

	// 途中のデータを加工(アイテム化)する。
	var postProcess = tag.postProcess;
	if (postProcess)
		postProcess(tag, view);
};

HTML.doInsertTag = function(openTag, closeTag, cpos, len)
{
	// 改行コードを合わせながら、後ろ(閉じタグ)から挿入する。
	var sel = getSelection();
	var rex = /\012\015?|\015/g;
	if (closeTag)
	{
		// 閉じタグの先頭に改行があるが、すでに選択範囲の終点が行頭であれば、
		// 改行すると1行空いてしまうため、この場合に限り改行を削除する。

		if (closeTag.substr(0, 1) == "\n" && sel[1].index == 0 && sel.direction)
			closeTag = closeTag.substr(1);
		insertTextAt(sel[1], closeTag.replace(rex, getNewline()));
	}
	insertTextAt(sel[0], openTag.replace(rex, getNewline()));

	if (cpos > 0)
	{
		// 挿入後のカーソル位置が指定されている。
		sel[1] = sel[0];
		setSelection(sel);
		charRight(cpos);

		// 更に選択する文字数が指定されていれば選択する。
		if (len > 0)
			charRight(len, true);
	}
	else
	{
		// カーソル位置が無指定ならば、以前と同じ部分を選択する。
		// 複数の改行を含んでいる場合まで考慮するとかなり面倒になる。
		// NOTE: movePoint() のために改行を1文字(\n)に変換する。

		var text = openTag.replace(rex, "\015");
		if (sel[0].line == sel[1].line)
		{
			// もともと同じ行内で選択していた。
			var diff = sel[1].index - sel[0].index;
			movePoint(sel[0], text.length);
			sel[1].line = sel[0].line;
			sel[1].index = sel[0].index + diff;
		}
		else // (sel[0].line < sel[1].line)
		{
			// もともと行をまたいで選択していた。
			movePoint(sel[0], text.length);
			sel[1].line += text.replace(/[^\015]/g).length;
		}
		setSelection(sel);
	}
};


/////////////////////////////////////////////////////////////////////////////
// HTML - editing existing tag

HTML.editTag = function(vw, pt)
{
	// TAG を編集する。
	if (!vw)
		vw = view;
	if (!vw)
		error("編集ウインドウが開かれていません.");

	var tag = HtmlTag.parse(vw, pt);
	if (!tag)
		error("カーソルがTAG上にありません.");
	if (tag.type == 2)
		error("閉じタグには編集すべき属性値がありません.");

	HTML.doEditTag(vw, tag);
};

HTML.doEditTag = function(vw, tag)
{
	// vw 編集ウインドウの tag を編集する。
	if (!vw || !tag)
		return;

	// TAG エディタを選択する。
	// 専用タグエディタが存在しないタグは、一般属性のエディタで代用する。
	var editor = HTML.tagEditors[ tag.elementName.toLowerCase() ];
	if (!editor)
		editor = HTML.editGeneral;

	// タグ全体を選択し、TAG エディタを開く。
	vw.setSelection(tag[1], tag[0]);
	if (!editor(tag))
		return;

	// [OK] ボタンが押された。
	// 何か変化したときだけタグを置換する。
	var text = tag.compose();
	if (text != tag.text)
	{
		// 編集禁止ならばエラーを出す。
		if (vw.getReadOnly())
			error(vw + " は書き込み禁止です.");

		// タグを置き換え、後ろから前向きに選択する。
		vw.insertText(text);
		vw.setSelection(CP, tag[0]);
	}
	return tag;
};

HTML.canEditTag = function(tag)
{
	// 専用編集をサポートしているタグかどうかを判定する。
	return tag && tag.elementName && HTML.tagEditors[ tag.elementName.toLowerCase() ];
};

HTML.tagEditors =
{
	// TAG エディタのテーブル
	a:			editA,
	abbr:		editAbbrAcronym,
	acronym:	editAbbrAcronym,
	area:		editArea,
	base:		editBase,
	basefont:	editFont,
	bgsound:	editBgsound,
	blockquote:	editBlockquote,
	body:		editBody,
	button:		editButton,
	caption:	editCaption,
	col:		editColgroup,
	colgroup:	editColgroup,
	del:		editInsDel,
	div:		editDivPara,
	fieldset:	editFieldset,
	font:		editFont,
	form:		editForm,
	frame:		editFrame,
	frameset:	editFrameset,
	h1:			editH,
	h2:			editH,
	h3:			editH,
	h4:			editH,
	h5:			editH,
	h6:			editH,
	hr:			editHr,
	iframe:		editIframe,
	img:		editImg,
	input:		editInput,
	ins:		editInsDel,
	label:		editLabel,
	legend:		editLegend,
	li:			editLi,
	link:		editLink,
	map:		editMap,
	marquee:	editMarquee,
	meta:		editMeta,
	ol:			editOl,
	optgroup:	editOptgroup,
	option:		editOption,
	p:			editDivPara,
	param:		editParam,
	pre:		editPre,
	script:		editScript,
	select:		editSelect,
	style:		editStyle,
	table:		editTable,
	tbody:		editTbody,
	td:			editTableCell,
	textarea:	editTextarea,
	tfoot:		editTbody,
	th:			editTableCell,
	thead:		editTbody,
	tr:			editTr,
	ul:			editUl
};

HTML.tagTitles =
{
	// タグの簡単な機能説明。
	a:			"リンク定義",
	abbr:		"略語",
	acronym:	"頭字語略語",
	address:	"アドレス",
	applet:		"Javaアプレット",
	area:		"クリッカブルマップエリア",
	b:			"太字",
	base:		"ベースURL",
	basefont:	"基本フォント",
	bdo:		"国際化情報",
	bgsound:	"バックグラウンドミュージック",
	big:		"大きな文字",
	blink:		"点滅文字",
	blockquote:	"引用",
	body:		"本文",
	br:			"改行",
	button:		"ボタン",
	caption:	"テーブルの見出し",
	center:		"中央揃え",
	cite:		"参照",
	code:		"プログラムコード",
	col:		"テーブルのカラム設",
	colgroup:	"テーブルのカラム設定",
	dd:			"定義の説明",
	del:		"削除",
	dfn:		"定義",
	dir:		"ディレクトリリスト",
	div:		"ブロック要素",
	dl:			"定義リスト",
	dt:			"定義語",
	em:			"強調",
	embed:		"オブジェクト埋め込み",
	fieldset:	"フィールドセット",
	font:		"フォント",
	form:		"フォーム",
	frame:		"フレーム",
	frameset:	"フレームセット",
	h1:			"見出し1",
	h2:			"見出し2",
	h3:			"見出し3",
	h4:			"見出し4",
	h5:			"見出し5",
	h6:			"見出し6",
	head:		"ヘッダ",
	hr:			"水平線",
	html:		"HTML文書",
	i:			"イタリック文字",
	iframe:		"インラインフレーム",
	img:		"イメージ",
	input:		"入力欄",
	ins:		"挿入",
	isindex:	"検索フォーム",
	kbd:		"キーボード",
	keygen:		"鍵の作成",
	label:		"ラベル",
	legend:		"フォーム部品群の説明",
	li:			"リストアイテム",
	link:		"リンク",
	map:		"クリッカブルマップ",
	marquee:	"流れる文字",
	menu:		"メニュー",
	meta:		"メタ情報",
	nobr:		"改行禁止",
	noembed:	"埋め込み未対応",
	noframes:	"フレーム未対応",
	noscript:	"スクリプト未対応",
	object:		"オブジェクト貼り付け",
	ol:			"順序付きリスト",
	optgroup:	"オプショングループ",
	option:		"オプション",
	p:			"段落",
	param:		"パラメータ",
	pre:		"整形済みテキスト",
	q:			"短い引用",
	rb:			"ルビ",
	rp:			"ルビ",
	rt:			"ルビ",
	ruby:		"ルビ",
	s:			"打ち消し線",
	samp:		"サンプル",
	script:		"スクリプト",
	select:		"セレクト",
	small:		"小さな文字",
	spacer:		"スペーサー",
	span:		"インライン要素",
	strike:		"打ち消し線",
	strong:		"強調",
	style:		"スタイル",
	sub:		"下付き文字",
	sup:		"上付き文字",
	table:		"テーブル",
	tbody:		"テーブル本体部",
	td:			"テーブルデータ",
	textarea:	"テキストエリア",
	tfoot:		"テーブルフッタ部",
	th:			"テーブルヘッダ項目",
	thead:		"テーブルヘッダ部",
	title:		"タイトル",
	tr:			"テーブルの列",
	tt:			"テレタイプ文字",
	u:			"アンダーライン",
	ul:			"順序無しリスト",
	"var":		"変数",
	wbr:		"単語の区切り",
	xmp:		"例"
};


/////////////////////////////////////////////////////////////////////////////
// HTML - タグの一般属性の編集

HTML.editTagGeneral = function(vw, tag)
{
	// スタイルなどすべてのタグに共通している TAG の一般属性を編集する。
	if (!vw || !tag)
		return;

	// タグ全体を選択する。
	vw.setSelection(tag[1], tag[0]);
	if (!HTML.doEditTagGeneral(vw, tag))
		return;

	// 何か変化したときだけタグを置換する。
	var text = tag.compose();
	if (text != tag.text)
	{
		// 編集禁止ならばエラーを出す。
		if (vw.getReadOnly())
			error(vw + " は書き込み禁止です.");

		// タグを置き換え、後ろから前向きに選択する。
		vw.insertText(text);
		vw.setSelection(CP, tag[0]);
	}
	return tag;
};

HTML.doEditTagGeneral = function(vw, tag)
{
	// 編集可能なイベントハンドラのリストを作成する。
	var attr = tag.values;
	var events = "onClick,onDblClick,onKeyDown,onKeyPress,onKeyUp,onMouseDown,onMouseUp,onMouseOver,onMouseOut,onMouseMove,onLoad,onUnload,onFocus,onBlur,onSubmit,onReset,onChange,onResize,onMove,onDragDrop,onAbort,onError,onSelect".splitcsv();
	var treelist = [ ];

	for (var i in events)
	{
		var event = events[i];
		treelist.push([ event, { name: event, value: attr[event.toLowerCase()] || "", edit: true }]);
	}

	// 利用可能なスタイルの一覧を取得し、クラスとIDに分離する。
	var ids = [ ];
	var classes = [ ];
	var styles = HTML.pickupStyles(vw, tag);
	styles.sort(String.stricmp);

	for (i in styles)
	{
		var style = styles[i];
		if (/[.#]/.test(style))
		{
			if (RegExp.lastMatch == "#")
				ids.push(style);
			else
				classes.push(style);
		}
	}

	// ダイアログボックスのテンプレートを作成する。
	var header = [[ "イベント", 100 ], [ "ハンドラ", 274 ]];
	var template =
	[
		{ type: "EDIT",  name: "name",  label: "名前(&N):", value: attr.name, x: 45, width: 95, labelWidth: 40,
			onChange: function(dialog, control) { dialog.enableControl("uniq", dialog.getValue(control)); }},
		{ type: "BUTTON", name: "uniq", label: "名前の重複チェック(&V)...", x: 175, y: 5, width: 95,
			onClick: function(dialog, control)
			{
				var tag = dialog.tag;
				var name = dialog.getValue("name");
				var count = HTML.checkNameUniqueness(name, tag.editor, tag[0]);
				if (count == 0)
					messageBox("名前 " + name + " は重複していません.");
				else
					messageBox("名前 " + name + " は他" + count + "ヶ所定義されています.\nアウトプットウインドウからタグジャンプできます.");
			}
		},
		{ type: "EDIT",  name: "title", label: "タイトル(&T):", value: attr.title, x: 45, width: 225 },
		{ type: "STATIC", x: 45, y: 41, width: 225, height: 1, style: SS_BLACKFRAME | SS_SUNKEN },
		{ type: "COMBO", name: "class", label: "クラス(&C):", options: classes, x: 45, y: 48, width: 95 },
		{ type: "COMBO", name: "id",    label: "&ID:", options: ids, x: 175, y: 48, labelWidth: 15 },
		{ type: "COMBO",  name: "style", label: "スタイル(&S):", options: HTML.styleHistory, x: 45, y: 64, width: 225, labelWidth: 40 },
	//	{ type: "BUTTON", label: "&...", x: 258, y: 64, width: 12, onClick: HTML.onEditStyle },
		{ type: "STATIC", x: 45, y: 83, width: 225, height: 1, style: SS_BLACKFRAME | SS_SUNKEN },
		{ type: "TREELIST", name: "event", label: "イベント(&E):", value: treelist, header: header, x: 45, y: 90, width: 225, height: 120, style: TLS_NOBUTTONSPACE }
	];

	// タイトル文字列を作成する。
	var title = HTML.tagTitles[ tag.elementName.toLowerCase() ] || "";
	title = (title ? title + " - " : "") + "<" + HtmlTag.formatElementName(tag.elementName) + ">タグの一般属性";

	// ダイアログボックスオブジェクトを準備する。
	var dialog = new Dialog(title, template);
	dialog.tag = tag;
	dialog.attr = tag.values;
	dialog.addOkCancel = Dialog.ADD_OKCANCELLINE | Dialog.ADD_HELP;

	dialog.onOpen = function()
	{
		var attr = this.attr;
		this.setValue("class", attr.class);
		this.setValue("id", attr.id);
		this.setValue("style", attr.style);
		this.setLabel(0xE146 /* ID_HELP */, "ヘルプ(&H) ▼");
		this.enableControl("uniq", attr.name);
	};

	dialog.onHelp = function()
	{
		// [ヘルプ]ボタンがクリックされたら、どの一般属性に対しての
		// ヘルプを見たいかのメニューを表示し、選択されたものを出す。

		var pos = this.getControlPosition(0xE146 /* ID_HELP */);
		pos[1] += 20;
		var subcmd = popupMenu(["&Name属性", "&Title属性", "&Class属性", "&Id属性", "&Style属性", "イベント(&E)"], pos);
		if (subcmd)
		{
			// 「とほほのWWW入門」を参照させてもらっています。
			var url = "http://www.tohoho-web.com/";
			if (subcmd.charAt(0) == "&")
				url += "html/attr/" + subcmd.replace(/[^A-Z]+/ig).toLowerCase() + ".htm";
			else // (イベント)
			{
				// イベントをどれか選択していれば、そこを直接参照する。
				url += "js/onevent.htm";
				var sel = this.getCurSel("event");
				if (sel)
					url += "#" + sel[0];
			}
			shellExecute(null, url);
		}
		return true;
	};

	// ダイアログボックスを表示する。
	if (dialog.open() != IDOK)
		return;

	// [OK] ボタンが押された。
	var res = dialog.results;

	// 実際のクラス名、IDの部分だけを取り出す。
	if (/\.([^.:#]+)/.test(res.class))
		res.class = RegExp.$1;
	if (/\#([^.:#]+)/.test(res.id))
		res.id = RegExp.$1;

	// タグの一般属性を更新する。
	tag.updateByNames("name,#title,class,id,style", res);
	tag.updateByNames(events, res.event);
	HTML.updateHistory(HTML.styleHistory, res.style);
	return true;
};

HTML.checkNameUniqueness = function(name, vw, exclude)
{
	// 名前がユニークであることを検証する。
	var count = 0;
	for (var pt = 1; pt = vw.htmlGetNextTag(pt); pt = pt[1])
	{
		// 閉じタグ、開始位置が exclude であるタグを除く。
		if (pt.type == 2 || (exclude && HTML.comparePoints(exclude, pt[0]) == 0))
			continue;

		// タグを詳しく解析して、name 属性の値を取り出す。
		// NOTE: HtmlTag.parse は少し重いかもしれない。
		var tag = HtmlTag.parse(vw, pt[0]);
		var value = tag.values.name;

		if (value && String.stricmp(value, name) == 0)
		{
			// 同じ名前を定義しているタグが見つかった。
			// 最初の重複個所を出力する直前にアウトプットウインドウをクリアする。
			if (++count == 1)
				output.select(7).clear();

			// タグジャンプできる形式で重複個所を出力する。
			printf("%s:%d: 名前 %s の定義位置\n", vw, pt[0].line, name);
		}
	}
	return count;
};

/////////////////////////////////////////////////////////////////////////////
// HTML - タグの補完挿入

HTML.completeTag = function(vw)
{
	// 途中まで入力したタグを補完入力する。
	if (!vw)
		return;
	if (vw.getReadOnly())
		error("編集禁止です.");

	// ヒントとなるタグの先頭部分(キャレット直前の < に続く英文字の部分)を取得する。
	// NOTE: ヒントは0文字以上。
	var point = vw.getCurrentPoint();
	var head = "";
	var hint = "";
	var text = vw.getTextBetween(point.line, point);
	if (/<[a-z]*$/i.test(text))
	{
		head = RegExp.lastMatch;
		hint = head.substr(1);
	}

	// 全エレメント名(106)のリストとヒントを付き合わせ、先頭部分が一致する
	// ものを拾い集める。例外的に <a> タグだけは、最初の属名 name または、
	// href までを含めてメニューから選択するようにしている。

	var taglist = "a name,a href,abbr,acronym,address,applet,area,b,base,basefont,bdo,bgsound,big,blink,blockquote,body,br,button,caption,center,cite,code,col,colgroup,dd,del,dfn,dir,div,dl,dt,em,embed,fieldset,font,form,frame,frameset,h1,h2,h3,h4,h5,h6,head,hr,html,i,iframe,img,input,ins,isindex,kbd,keygen,label,legend,li,link,map,marquee,menu,meta,nobr,noembed,noframes,noscript,object,ol,optgroup,option,p,param,pre,q,rb,rp,rt,ruby,s,samp,script,select,small,spacer,span,strike,strong,style,sub,sup,table,tbody,td,textarea,tfoot,th,thead,title,tr,tt,u,ul,var,wbr,xmp".splitcsv();
	var candidates = [ ];
	for (var i in taglist)
	{
		text = taglist[i];
		if (hint)
		{
			if (text.length < hint.length)
				continue;
			if (String.stricmp(text.substr(0, hint.length), hint))
				continue;
		}
		candidates.push(text);
	}

	// ヒントに一致するものがないこともある。
	if (candidates.length <= 0)
		error("<", hint, " で始めるタグはありません.");

	// 複数一致した場合は、カーソル位置にメニューを表示して選択する。
	var name = candidates[0];
	if (candidates.length > 1)
	{
		var index = 0;
		var count = 20;

		name = "";
		do {
			// 最大20項目までに制限してメニューを作成する。
			var items = [];
			if (index + count < candidates.length)
				items.push([ "&> 次の候補", 1 ]);
			if (index > 0)
				items.push([ "&< 前の候補", 2 ]);
			if (items.length)
				items.length++;

			var key = 0;
			var cnt = count;
			for (i = index; i < candidates.length && --cnt >= 0; i++)
			{
				// オプションに合わせてエレメント名を大文字/小文字/頭文字化する。
				// さらにキーボードシンボル(1〜9、0、A〜Z)を付ける。
				var elem = candidates[i];
				text = "<" + HtmlTag.formatNewElementName(elem) + ">";
				if (HtmlTag.wantClose(elem))
					text += "</" + HtmlTag.formatNewElementName(elem) + ">";
				if (++key <= 10)
					text = "&" + (key % 10) + " " + text;
				else if (key <= 36)
					text = "&" + String.fromCharCode(key + 54) + " " + text;

				// ダイアログボックスが現れるタグには、... を付加する。
				// さらに説明文のあるタグには、短い説明文を付ける。
				if (i == 0 || HTML.tagEditors[elem])
					text += "...";
				if (HTML.tagTitles[elem])
					text += "\t" + HTML.tagTitles[elem];

				items.push([ text, elem ]);
			}

			// メニューを表示して選択してもらう。
			var choice = popupMenu(items, vw);
			if (!choice)
				return;
			else if (choice == 1)
				index += count;
			else if (choice == 2)
				index -= count;
			else // (chosen)
				name = choice;
		} while (!name);
	}

	// "a href"、"a name" の場合のエレメント名と属性名を分離する。
	var attr = "";
	if (/^(\i)\s+(\i)$/.test(name))
	{
		name = RegExp.$1;
		attr = RegExp.$2;
	}

	// 新しくタグを作成する。
	var tag = new HtmlTag(name);
	tag.editor	= vw;

	// <a> タグの name または href 属性を追加する。これにより、<a name="...">
	// の編集なのか、<a href="..."> の編集なのかを区別している。
	if (attr)
		tag.setAttr(attr, "");

	// タグエディタがあれば編集する。
	// NOTE: 選択範囲を調べるエディタがあるので、補完挿入では常に
	// 選択範囲なしとなるように、ここで選択範囲をクリアしている。
	vw.cancelSelection();
	var editor	= HTML.tagEditors[ name ];
	if (editor && !editor(tag))
		return;

	// 開きタグ、必要に応じて閉じタグを作成する。
	var text1 = tag.compose() + (tag.postOpen || "");
	var text2 = HtmlTag.wantClose(name) ? (tag.preClose || "") + HtmlTag.getTagText(name, 2) : "";

	// ヒントの部分があればクリアしてから挿入位置にカーソルを合わせ、
	if (head)
	{
		point.index -= head.length;
		vw.gotoPoint(point);
		vw.deleteTextAt(point, head.length);
	}

	// タグを挿入して、(あれば)途中のデータを加工(アイテム化)する。
	HTML.doInsertTag(text1, text2);
	if (tag.postProcess)
		tag.postProcess(tag, vw);
};


/////////////////////////////////////////////////////////////////////////////
// HTML - スタイルの編集

HTML.onEditStyle = function(dialog, control)
{
	// スタイルは項目が多すぎるため、プロパティシート形式をページ切り替えを
	// サポートしてから実装することにする。プロパティーを種類毎に分けページ
	// 単位でまとめて表示するようにしないと、収拾がつかない。CSS 関連の機能
	// は、CSS.msl に分けて実装する予定。

	// require("CSS.msl");
	// CSS.doEditStyle();
	messageBox("CSSの編集機能は、只今工事中です m(_ _)m");
};


/////////////////////////////////////////////////////////////////////////////
// HTML.closeTag() - 閉じタグを挿入

HTML.closeTag = function(vw, pick)
{
	// 最初に見つけた対になっていない開きタグに対応する閉じタグを挿入する。
	// pick が指定されている場合は、閉じタグ必須のタグか、省略可能なタグが
	// pick 個見つかるまで検索し、候補が複数であれば、ポップアップメニューを
	// 表示して選択＆挿入する。

	if (!vw)
		vw = view;
	if (!vw)
		error("編集ウインドウが開かれていません.");

	// タグの途中に閉じタグを挿入することはできない。
	var tag = vw.htmlGetTag();
	if (tag && HTML.comparePoints(vw.CP, tag[0]))
		error("タグの途中です.");

	// 無指定ならば閉じタグ候補のデフォルト個数を取得する。
	if (!pick)
		pick = HTML.pickCloseMax || 1;

	var nest = { };	// 種類毎にタグの入れ子状況をカウントする連想配列( エレメント名 => 入れ子レベル )
	var list = [ ];	// 閉じタグ候補の配列(二重登録防止の連想配列としても使う)

	for (tag = vw.htmlGetPreviousTag(vw.CP); tag; tag = vw.htmlGetPreviousTag(tag[0]))
	{
		// HTMLは大文字小文字を区別しないので、小文字に変換してキーとする。
		// Self-closeタグ(<.../>)と、もともと対にならないタグを除外する。
		var name = tag.elementName.toLowerCase();
		if (!name || tag.type == 3 || HtmlTag.isOpenOnly(name))
			continue;

		// すべての候補を表示するがOFFで、省略するタグとなっている場合も除外する。
		if (!HTML.pickCloseAll && !HtmlTag.wantClose(name))
			continue;

		if (tag.type == 2)
		{
			// 閉じタグ発見。入れ子レベルを+1する。
			if (name in nest)
				nest[name]++;
			else
				nest[name] = 1;
		}
		else if (tag.type == 1)
		{
			// 開きタグ発見。
			if (nest[name] > 0)
			{
				// ネストされていれば入れ子レベルを-1する。
				nest[name]--;
			}
			else if (!list[name])
			{
				// 閉じタグのない開きタグを発見した。
				// 大文字小文字を新規タグのルールに合わせて閉じタグを作成する。
				list[name] = true;
				list.push("</" + HtmlTag.formatNewElementName(tag.elementName) + ">");
				if (HtmlTag.mustClose(name) || list.length >= pick)
					break;
			}
		}
	}

	if (list.length == 0)
	{
		// 閉じる必要のある(かもしれない)タグは見つからなかった。
		setWarningStatusText("対になっていないタグはありません.");
		return;
	}

	name = list[0];
	if (list.length > 1)
	{
		// 候補が複数ある場合はキーシンボルを追加してメニューを表示する。
		for (var i in list)
		{
			list[i] = "&" + (i + 1) % 10 + " " + list[i];
			if (i == 9)
				break;
		}
		name = popupMenu(list, vw);
		if (!name)
			return;
		name = name.replace(/^&\d /);
	}

	// 閉じタグを挿入して後ろから前に選択する。
	var cp = vw.getCurrentPoint();
	vw.insertText(name);
	vw.setSelection(EP(cp.line, cp.index + name.length), cp);
};


/////////////////////////////////////////////////////////////////////////////
// <BODY> TAG EDITOR

function editBody(tag)
{
	// <body>タグを編集する。
	var colors	= HTML.listColorNames();
	var attr	= tag.values;
	var template =
	[
		{ type: "GROUPBOX", label: "テキスト色", length: 8, x: 5, y: 5, width: 155, height: 80,
			0: { type: "COMBO",  name: "text",   pair: "tcolor", label: "標準(&T):", x: 65, y: 12, width: 50, labelWidth: 60, options: colors, onChange: HTML.setColorToButton },
			1: { type: "COLOR",  name: "tcolor", pair: "text", x: 120, y: 12, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			2: { type: "COMBO",  name: "link",   pair: "lcolor", label: "リンク(&L):", x: 65, y: 28, width: 50, labelWidth: 60, options: colors, onChange: HTML.setColorToButton },
			3: { type: "COLOR",  name: "lcolor", pair: "link", x: 120, y: 28, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			4: { type: "COMBO",  name: "alink",  pair: "acolor", label: "アクティブリンク(&C):", x: 65, y: 44, width: 50, labelWidth: 60, options: colors, onChange: HTML.setColorToButton },
			5: { type: "COLOR",  name: "acolor", pair: "alink", x: 120, y: 44, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			6: { type: "COMBO",  name: "vlink",  pair: "vcolor", label: "訪問済みリンク(&V):", x: 65, y: 60, width: 50, labelWidth: 60, options: colors, onChange: HTML.setColorToButton },
			7: { type: "COLOR",  name: "vcolor", pair: "vlink", x: 120, y: 60, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo }
		},
		{ type: "GROUPBOX", label: "マージン", length: 4, x: 170, y: 5, width: 80, height: 80,
			0: { type: "EDIT",   name: "topmargin",    label: "上(&O):", value: attr.topmargin, x: 30, y: 12, width: 40, spin: [0, 255], style: ES_NUMBER },
			1: { type: "EDIT",   name: "bottommargin", label: "下(&M):", value: attr.bottommargin, spin: [0, 255], style: ES_NUMBER },
			2: { type: "EDIT",   name: "leftmargin",   label: "左(&F):", value: attr.leftmargin, spin: [0, 255], style: ES_NUMBER },
			3: { type: "EDIT",   name: "rightmargin",  label: "右(&R):", value: attr.rightmargin, spin: [0, 255], style: ES_NUMBER }
		},
		{ type: "GROUPBOX", label: "背景", length: 6, x: 5, y: 90, width: 245,
			0: { type: "COMBO",  name: "bgcolor", pair: "bgclbox", label: "背景色(&B):", x: 65, y: 12, width: 50, labelWidth: 60, options: colors, onChange: HTML.setColorToButton },
			1: { type: "COLOR",  name: "bgclbox", pair: "bgcolor", x: 120, y: 12, width: 25, style: HTML.colorPalette, onChange:HTML.setColorToCombo },
			2: { type: "COMBO",  name: "background",   label: "背景イメージ(&I):", options: HTML.imageHistory, x: 65, y: 28, width: 150, labelWidth: 60, style: ES_AUTOHSCROLL, value: attr.background },
			3: { type: "BUTTON", pair: "background",   label: "&...", x: 215, y: 28, width: 12, onClick: HTML.imageChooser },
			4: { type: "BUTTON", pair: "background",   label: "&?", x: 227, y: 28, width: 12, onClick: HTML.imageViewer },
			5: { type: "CHECK",  name: "bgproperties", label: "背景イメージをスクロールしない(&X)", value: tag.testAttr("bgproperties", "fixed"), x: 65, y: 46 }
		}
	];

	// [<body>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 250, 148, false, "%text,%link,%alink,%vlink,%bgcolor,background");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<body>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("text,link,alink,vlink,bgcolor,background,topmargin,bottommargin,leftmargin,rightmargin", res);
	tag.updateAttr("bgproperties", res.bgproperties ? "fixed" : undefined, true);
	tag.setPostPre("\n", "\n");
	HTML.updateHistory(HTML.imageHistory, res.background);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <META> TAG EDITOR

function editMeta(tag)
{
	// <meta>タグを編集する。
	var names = "Author,Keywords,Description,Generator".splitcsv();
	var equvs = "Content-Type,Content-Script-Type,Content-Style-Type,Refresh,Expires,Pragma,robots,Page-Enter,imagetoolbar".splitcsv();
	var conts = "text/html; charset=Shift_JIS,text/html; charset=euc-jp,text/html; charset=iso-2022-jp,text/javascript,text/css".splitcsv();

	var attr = tag.values;
	var template =
	[
		{ type: "COMBO", name: "name", label: "名前(&N):", options: names, x: 55, width: 80, labelWidth: 50 },
		{ type: "COMBO", name: "http-equiv", label: "&HTTPヘッダ名:", options: equvs },
		{ type: "COMBO", name: "content", label: "内容(&C):", options: conts, width: 200 }
	];

	// [<meta>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 260, 51, true, "name,http-equiv,content");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<meta>タグのプロパティを更新する。
	tag.updateByNames("name,http-equiv,#content", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <BASE> TAG EDITOR

function editBase(tag)
{
	// <base href="...">タグを編集する。
	var attr = tag.values;
	var template =
	[
		{ type: "COMBO", name: "href", label: "基準&URL:", options: HTML.hrefHistory, x: 40, width: 180, labelWidth: 35 },
		{ type: "BUTTON", pair: "href", label: "&...", x: 222, y: 5, width: 12, onClick: HTML.onBrowseURL }
	];

	// [<base>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 239, 19, true, "href");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<base>タグのプロパティを更新する。
	tag.updateByNames("href", dialog.results);
	HTML.updateHistory(HTML.hrefHistory, dialog.results.href);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <HR> TAG EDITOR

function editHr(tag)
{
	// <hr>タグを編集する。
	var aligns	= "left,center,right".splitcsv();
	var colors	= HTML.listColorNames();
	var attr	= tag.values;

	// 幅が % で指定されている場合は % を分離する。
	var percent	= [ "width" ];
	HTML.separatePercent(attr, percent);

	var template =
	[
		{ type: "EDIT", name: "size", label: "太さ(&S):", value: attr.size, labelWidth: 55, x: 60, width: 70, spin: [0, 100], style: ES_NUMBER },
		{ type: "EDIT", name: "width", label: "長さ(&W):", value: attr.width, x: 60, y: 21, spin: [0, 1000], style: ES_NUMBER },
		{ type: "CHECK", name: "width_P", label: "%", value: attr.width_P, x: 135, y: 23 },
		{ type: "COMBO", name: "align", label: "配置(&G):", x: 60, y: 37, options: aligns },
		{ type: "COMBO", name: "color", pair: "cwell", label: "線の色(&C):", x: 60, y: 53, width: 70, labelWidth: 55, options: colors, onChange: HTML.setColorToButton },
		{ type: "COLOR", name: "cwell", pair: "color", x: 135, y: 53, width: 30, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
		{ type: "CHECK", name: "noshade", x: 60, y: 69, label: "影を付けない(&N)", value: "noshade" in attr },
		{ type: "STATIC", value: "ピクセル", x: 135, y: 7 }
	];

	// [<hr>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 80, true, "align,%color");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<hr>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res, percent);
	tag.updateByNames("size,width,align,color,!noshade", res);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <FONT>, <BASEFONT> TAG EDITOR

function editFont(tag)
{
	// <font>、<basefont>タグを編集する。
	var sizes	= "1,2,3,4,5,6,7,-6,-5,-4,-3,-2,-1,+1,+2,+3,+4,+5,+6".splitcsv();
	if (String.stricmp(tag.elementName, "basefont") == 0)
		sizes.length = 7;

	var colors	= HTML.listColorNames();
	var attr	= tag.values;
	var template =
	[
		{ type: "COMBO", name: "face", label: "タイプフェイス(&T):", options: HtmlTag.typefaces, x: 60, width: 160, labelWidth: 55 },
		{ type: "COMBO", name: "size", label: "サイズ(&S):", width: 50, options: sizes },
		{ type: "COMBO", name: "color", pair: "cwell", label: "色(&C):", options: colors, onChange: HTML.setColorToButton },
		{ type: "COLOR", name: "cwell", pair: "color", x: 115, y: 37, width: 30, height: 13, style: HTML.colorPalette, onChange: HTML.setColorToCombo }
	];

	// [<font>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 50, true, "face,size,%color");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<font>、<basefont>タグのプロパティを更新する。
	tag.updateByNames("face,size,color", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <DIV>, <P> TAG EDITOR

function editDivPara(tag)
{
	// <div>、<p>タグを編集する。
	var template =
	[
		{ type: "COMBO", name: "align", label: "配置(&G):", x: 60, labelWidth: 55,
		  options: "left,center,right".splitcsv() }
	];

	// [<div>、<p>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 19, true, "align");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<div>、<p>タグのプロパティを更新する。
	tag.updateByNames("align", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <IMG> TAG EDITOR

function editImg(tag)
{
	// <img>タグを編集する。
	var maps	= HTML.pickupMapNames(tag.editor);
	var attr	= tag.values;
	var aligns	= "top,middle,bottom,left,right".splitcsv();

	// 幅と高さが % で指定されている場合は % を分離する。
	HTML.separatePercent(attr);

	var template =
	[
		{ type: "GROUPBOX", label: "イメージ", length: 7, width: 265,
			0: { type: "COMBO", name: "src",    label: "イメージファイル(&F):", options: HTML.imageHistory, x: 65, y: 12, width: 168, labelWidth: 60 },
			1: { type: "BUTTON", pair: "src",  label: "&...", x: 235, y: 12, width: 12, onClick: HTML.imageChooser },
			2: { type: "BUTTON", pair: "src",  label: "&?", x: 247, y: 12, width: 12, onClick: HTML.imageViewer },
			3: { type: "COMBO", name: "lowsrc", label: "粗いイメージ(&L):", options: HTML.imageHistory, x: 65, y: 28, width: 168, labelWidth: 60 },
			4: { type: "BUTTON", pair: "lowsrc", label: "...", x: 235, y: 28, width: 12, onClick: HTML.imageChooser },
			5: { type: "BUTTON", pair: "lowsrc", label: "?", x: 247, y: 28, width: 12, onClick: HTML.imageViewer },
			6: { type: "EDIT", name: "alt", label: "代替テキスト(&T):", value: attr.alt, x: 65, y: 44, width: 194, style: ES_AUTOHSCROLL }
		},
		{ type: "GROUPBOX", label: "位置と大きさ", length: 13, width: 265,
			0: { type: "EDIT", name: "width",  label: "横幅(&W):", value: attr.width, x: 65, y: 12, width: 40, labelWidth: 60, spin: [0, 2000], style: ES_NUMBER },
			1: { type: "CHECK", name: "width_P", label: "%", value: attr.width_P, x: 110, y: 14 },
			2: { type: "EDIT", name: "height", label: "高さ(&H):", value: attr.height, x: 65, y: 28, spin: [0, 2000], style: ES_NUMBER },
			3: { type: "CHECK", name: "height_P", label: "%", value: attr.height_P, x: 110, y: 30 },
			4: { type: "BUTTON", name: "setsize", label: "サイズ取得(&S)", x: 65, y: 45, width: 60, height: 14,
				onClick: function(dialog)
				{
					var path = HTML.toWindowsPath(dialog.getValue("src"));
					var info;
					if (File.exists(path) && (info = HTML.getImageSize(path)))
					{
						dialog.setValue("width", info.width);
						dialog.setValue("width_P", false);
						dialog.setValue("height", info.height);
						dialog.setValue("height_P", false);
					}
				}},
			6: { type: "EDIT", name: "hspace", label: "横スペース(&Z):", value: attr.hspace, x: 190, y: 12, labelWidth: 45, spin: [0, 100], style: ES_NUMBER },
			7: { type: "STATIC", value: "ピクセル", x: 232, y: 14 },
			8: { type: "EDIT", name: "vspace", label: "縦スペース(&V):", value: attr.vspace, x: 190, y: 28, spin: [0, 100], style: ES_NUMBER },
			9: { type: "STATIC", value: "ピクセル", x: 232, y: 30 },
		   10: { type: "EDIT", name: "border", label: "ボーダー(&B):", value: attr.border, x: 190, y: 44, spin: [0, 100], style: ES_NUMBER },
		   11: { type: "STATIC", value: "ピクセル", x: 232, y: 46 },
		   12: { type: "COMBO", name: "align", label: "配置(&G):", options: aligns, x: 190, y: 60, width: 40 }
		},
		{ type: "GROUPBOX", label: "マップ", length: 1, width: 265,
			0: { type: "COMBO", name: "usemap", label: "マップ名(&M):", options: maps, x: 65, width: 195, labelWidth: 60 }
		}
	];

	// [<img>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 275, 180, false, "src,lowsrc,align,usemap");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<img>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res);
	tag.updateByNames("src,lowsrc,#alt,width,height,align,hspace,vspace,border,usemap", res);
	HTML.updateHistory(HTML.imageHistory, res.lowsrc);
	HTML.updateHistory(HTML.imageHistory, res.src);
	return true;
}

function editMap(tag)
{
	// <map name="..."> ... </map>
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "name", label: "マップ名(&N):", value: attr.name, x: 60, width: 160, labelWidth: 55 }
	];

	// [<map>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 19, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<map>タグのプロパティを更新する。
	tag.updateByNames("name", dialog.results);
	tag.setPostPre("\n", "\n");
	return true;
}

function editArea(tag)
{
	// <area shape="..." coords="..." href="..." alt="...">
	var attr = tag.values;
	var shapes = "default,rect,circle,poly".splitcsv();
	var hreftree = HTML._createHrefTree(tag);
	hreftree.height = 227;

	var template =
	[
		{ type: "STATIC", name: "memo", x: 110, y: 7, width: 145 },
		{ type: "COMBO",  name: "shape",  label: "形状(&S):", value: attr.shape, options: shapes, x: 55, y: 5, labelWidth: 50,
			onChange: function(dialog, control)
			{
				var shape = dialog.getValue(control, true);
				dialog.setValue("memo", dialog.memos[shape]);
			}
		},
		{ type: "EDIT",   name: "coords", label: "座標(&C):", value: attr.coords, x: 55, width: 200 },
		{ type: "EDIT",   name: "alt",    label: "代替テキスト(&T):", value: attr.alt },
		{ type: "COMBO",  name: "href",   label: "リンク先(&L):", width: 188, options: HTML.hrefHistory },
		{ type: "BUTTON", label: "&...", width: 11, height: 13, x: 244, y: 53, onClick: HTML._onClickPopupView },
		{ type: "SPACER", height: 5 },
		hreftree
	];

	// [<area>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 260, 297, true);
	dialog.memos = [ "", "イメージ全体", "左上X, 左上Y, 右下X, 右下Y", "中心X, 中心Y, 半径", "X1,Y1,X2,Y2,...,Xn,Yn" ];
	dialog.onOpen = function()
	{
		this.setValues("shape,href");
		this.setValue("memo", this.memos[ this.getValue("shape", true) ]);
		this.setCurSel("tree", "first");
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<area>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("shape,coords,#alt,href", res);
	HTML.updateHistory(HTML.hrefHistory, res.href);
	return true;
}

HTML.pickupMapNames = function(vw)
{
	// ファイル vw からMAPタグを探して名前のリストを構築する。
	var maps = [ ];
	if (vw)
	{
		for (var pt = 1; pt = vw.htmlGetNextTag(pt, "map"); pt = pt[1])
		{
			if (pt.type != 1)
				continue;

			var maptag = HtmlTag.parse(vw, pt[0]);
			if (maptag && maptag.values.name)
				maps.push("#" + maptag.values.name);
		}
		maps.sort(String.stricoll);
	}
	return maps;
};


/////////////////////////////////////////////////////////////////////////////
// HTML Image Size
//
//	以下のイメージサイズを取得する２つの関数するは、PHP 4.3.4 の実装から
//	必要な部分だけを抜き出して簡略化し、MocaScriptで実装し直したものです。
//
//		HTML.getImageSize
//		HTML.getNextJpegMarker
//
//	PHP のライセンスに基づき、以下の文を掲載します。
//
// --------------------------------------------------------------------
//                  The PHP License, version 3.0
//  Copyright (c) 1999 - 2002 The PHP Group. All rights reserved.
// --------------------------------------------------------------------
//
//	THIS SOFTWARE IS PROVIDED BY THE PHP DEVELOPMENT TEAM ``AS IS'' AND
//	ANY EXPRESSED OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO,
//	THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A
//	PARTICULAR PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL THE PHP
//	DEVELOPMENT TEAM OR ITS CONTRIBUTORS BE LIABLE FOR ANY DIRECT,
//	INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
//	(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
//	SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION)
//	HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT,
//	STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE)
//	ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED
//	OF THE POSSIBILITY OF SUCH DAMAGE.
//

HTML.getImageSize = function(path)
{
	// GIF、JPEG、PNG ファイルのイメージサイズを取得する。
	var param, info;
	var file = new File(path);
	if (file.open("rb"))
	{
		var sig = HTML.readbytes(file, 3);
		if (sig.text == "GIF")
		{
			// GIF
			param = HTML.readbytes(file, 8);
			if (param.length == 8)
				info = { type: "GIF", width: param[3] | param[4] << 8, height: param[5] | param[6] << 8 };
		}
		else if (sig.text == "\xff\xd8\xff")
		{
			// JPEG
			var marker = 0xffd8;
			var ffread = true;
LOOP:		for (;;)
			{
				marker = HTML.getNextJpegMarker(file, marker, 1, ffread);
				ffread = false;

				switch (marker) {
				case 0xda:	// SOS
				case 0xd9:	// EOI
					break LOOP;

				case 0xc0:	// SOF0
				case 0xc1:	// SOF1
				case 0xc2:	// SOF2
				case 0xc3:	// SOF3
				case 0xc5:	// SOF5
				case 0xc6:	// SOF6
				case 0xc7:	// SOF7
				case 0xc9:	// SOF9
				case 0xca:	// SOF10
				case 0xcb:	// SOF11
				case 0xcd:	// SOF13
				case 0xce:	// SOF14
				case 0xcf:	// SOF15
					param = HTML.readbytes(file, 8);
					if (param.length == 8)
						info = { type: "JPG", width: param[5] << 8 | param[6], height: param[3] << 8 | param[4] };
					break LOOP;

				default:
					var byte1 = file.readByte();
					var byte2 = file.readByte();
					if (byte1 < 0 || byte2 < 0)
						break LOOP;

					var skip = (byte1 << 8 | byte2) - 2;
					if (skip)
						file.setPosition(skip, 1);
					break;
				}
			}
		}
		else if (sig.text == "\x89\x50\x4e" && HTML.readbytes(file, 5).text == "\x47\x0d\x0a\x1a\x0a")
		{
			// PNG
			param = HTML.readbytes(file, 17);
			if (param.length == 17)
				info = { type:   "PNG",
						 width:  param[ 8] << 24 | param[ 9] << 16 | param[10] << 8 | param[11],
						 height: param[12] << 24 | param[13] << 16 | param[14] << 8 | param[15] };
		}
		file.close();
	}
	return info;
};

HTML.readbytes = function(file, size)
{
	var data = [];
	var text = "";
	var byte;

	while (--size >= 0 && (byte = file.readByte()) >= 0)
	{
		data.push(byte);
		text += String.fromCharCode(byte);
	}

	data.text = text;
	return data;
};

HTML.getNextJpegMarker = function(file, last, comment, ffread)
{
	if (last == 0xfe && comment)
		comment = 2;
	else
	{
		comment = 0;
		last = 0;
	}

	var count = ffread ? 1 : 0;
	var marker;
	do {
		if ((marker = file.readByte()) < 0 || ++count > 10)
			return 0xd9;

		if (last == 0xfe && comment > 0)
		{
			if (marker == 0xff)
				last = 0xffd8;
			else
			{
				marker = 0xff;
				comment--;
			}
		}
	} while (marker == 0xff);
	return count < 2 || (last == 0xfe && comment) ? 0xd9 : marker;
};


/////////////////////////////////////////////////////////////////////////////
// <LINK> TAG EDITOR

function editLink(tag)
{
	// <link rel="stylesheet,fontdef,Contents,Index,Glossay,Copyright,Next,Prev,Parent,Help,Bookmark"
	//		 href=url type="text/css,text/javascript" target="_blank,_self,_top,_parent"
	//		 media="all,screen,print" >
	var rels	= "alternate,appendix,bookmark,chapter,contents,copyright,fontdef,glossay,help,index,parent,prev,section,start,next,stylesheet,subsection".splitcsv();
	var types	= "text/css,text/javascript".splitcsv();
	var targets	= "_blank,_self,_top,_parent".splitcsv();
	var medias	= "all,screen,print".splitcsv();

	var attr = tag.values;
	var template =
	[
		{ type: "COMBO",  name: "rel",		label: "関連(&R):", options: rels, x: 45, width: 60, labelWidth: 40 },
		{ type: "COMBO",  name: "href",		label: "参照先(&H):", options: HTML.hrefHistory, width: 201 },
		{ type: "BUTTON", pair: "href",		label: "&...", x: 248, y: 21, width: 12, onClick: HTML.onBrowseURL },
		{ type: "COMBO",  name: "type",		label: "タイプ(&T):", x: 45, y: 37, width: 60, options: types },
		{ type: "COMBO",  name: "target",	label: "ターゲット(&G):", x: 186, y: 37, options: targets },
		{ type: "COMBO",  name: "media",	label: "出力先(&M):", x: 45, y: 53, options: medias },
		{ type: "CHECK",  name: "disabled",	label: "無効(&D)", value: "disabled" in attr, x: 186, y: 55 }
	];

	// [<link>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 265, 67, true, "rel,href,type,target,media");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<link>タグのプロパティを更新する。
	tag.updateByNames("rel,href,type,target,media,!disabled", dialog.results);
	HTML.updateHistory(HTML.hrefHistory, dialog.results.href);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <A> TAG EDITOR

function editA(tag)
{
	if ("href" in tag.values)
		return HTML.editA_Href(tag);
	if ("name" in tag.values)
		return HTML.editA_Name(tag);
}

HTML.editA_Name = function(tag)
{
	// <a name="...">
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "name", label: "名前(&N):", value: attr.name, x: 60, width: 160, labelWidth: 55 }
	];

	var dialog = HTML.newTagDialog(tag, template, 225, 19, true);
	if (dialog.open() != IDOK)
		return;

	// 結果を <a name> タグに戻す。
	tag.updateByNames("name", dialog.results);
	return true;
};

HTML.editA_Href = function(tag)
{
	// <a href="...">
	var attr = tag.values;
	var targets  = "_blank,_self,_top,_parent".splitcsv();

	var hreftree = HTML._createHrefTree(tag);
	hreftree.width = 250;
	hreftree.height = 227;

	var template =
	[
		hreftree,
		{ type: "COMBO", name: "href", label: "リンク先(&H):", options: HTML.hrefHistory, x: 47, y: 235, width: 195, labelWidth: 42 },
		{ type: "BUTTON", label: "&...", x: 244, y: 235, width: 11, height: 13, onClick: HTML._onClickPopupView },
		{ type: "COMBO", name: "target", label: "ターゲット(&T):", options: targets, x: 47, y: 253, width: 65, labelWidth: 42 },
		{ type: "EDIT", name: "tabindex", label: "タブ順(&B):", value: attr.tabindex, x: 151, y: 253, width: 25, labelWidth: 30, spin: [1,100], style: ES_NUMBER },
		{ type: "EDIT", name: "accesskey", label: "アクセスキー(&K):", value: attr.accesskey, x: 235, y: 253, width: 20, labelWidth: 50 }
	];

	var dialog = HTML.newTagDialog(tag, template, 260, 267, true);
	dialog.onOpen = function()
	{
		this.setValues("href,target");
		this.setCurSel("tree", "first");
	};
	if (dialog.open() != IDOK)
		return;

	var res = dialog.results;
	tag.updateByNames("href,target,tabindex,accesskey", res);
	HTML.updateHistory(HTML.hrefHistory, res.href);
	return true;
};


/////////////////////////////////////////////////////////////////////////////
// HTML - HREFを選択するためのツリーリストコントロール作成

HTML.onBrowseURL = function(dialog, control)
{
	// URLをローカルファイルのツリーを表示して選択する。
	var url = HTML.browseURL(dialog.getValue(control.pair));
	if (url)
		dialog.setValue(control.pair, url);
};

HTML.browseURL = function(url)
{
	// URL 位置を参照・変更するために呼び出せる専用ダイアログボックス。
	var tag = new HtmlTag("a");
	tag.editor = view;
	tag.setAttr("href", url);

	var hreftree = HTML._createHrefTree(tag);
	hreftree.width = 250;
	hreftree.height = 227;

	var template =
	[
		{ type: "COMBO", name: "href", label: "リンク先(&H):", options: HTML.hrefHistory, x: 47, y: 5, width: 195, labelWidth: 42 },
		{ type: "BUTTON", label: "&...", x: 244, y: 5, width: 11, height: 13, onClick: HTML._onClickPopupView },
		hreftree
	];

	var dialog = new Dialog("リンク先ブラウザ", template);
	dialog.addOkCancel = Dialog.ADD_OKCANCELLINE;
	dialog.url = url;
	dialog.onOpen = function()
	{
		this.setValue("href", this.url);
		this.setCurSel("tree", "first");
	};
	if (dialog.open() != IDOK)
		return;

	var res = dialog.results;
	HTML.updateHistory(HTML.hrefHistory, res.href);
	return res.href;
};

HTML._createHrefTree = function(tag)
{
	// href ツリーコントロール作成。
	// 最初にどこを選択するかを決定する(結果は -> path と name)。
	// タグに有効な href があれば、できるだけそこを初期値として選択する。
	// それが選択できないときは、現在アクティブなファイルを初期選択する。

	var vw   = tag.editor;
	var path = vw && vw.getFilePath();
	var href = tag.values.href;
	var name = "";

	if (href)
	{
		// まず href があるときは、URLorFILE と名前に分解する。
		// path#name または path?command=... という記述の可能性がある。
		if (/[#?]/.test(href))
		{
			href = RegExp.leftContext;
			name = RegExp.rightContext;
		}

		// (1) # より前に文字がなければ、このファイル(path)を基準にする。
		// (2) # より前に文字があれば、それを Windows の絶対パスに変換し、
		//     ファイル/フォルダが実在すればそのファイルを基準にする。
		//     ファイル/フォルダが実在しなければ、アクティブドキュメント
		//     (path) を基準にし、ファイル内までは立ち入らない。name は、
		//     path が示すファイルのものではないので、path 中にはない。

		if (href)
		{
			// 整形後、パスの最後に付いているかもしれない \ を削除する。
			href = HTML.toWindowsPath(href);
			href = href.replace(/([^:\\])\\+$/, "$1");

			if (File.exists(href))
				path = href;
			else
				name = "";
		}
	}

	// HREF 属性のためのツリーコントロールを作成する。
	var treectrl =
	{
		type: "TREELIST", name: "tree", x: 5, width: 250, height: 227,
		header: [[ "フォルダ・ファイル", 295 ], [ "サイズ", 61, 1 ], [ "行番号", 61, 1 ]],
		value: HTML._createLinkTree(path, name),
		onDoubleClick: function(dialog, control)
		{
			// ダブルクリックしたアイテムがファイルか名前ならダイアログボックスを閉じる。
			var item = dialog.getCurSel(control);
			if (item && (1 in item || 2 in item))
				dialog.close(IDOK);
			else
				beep();
		},
		onSelChange: function(dialog, control)
		{
			// 選択されたリンク先の文字列を作成してhrefに表示する。
			var item, link;
			if ((item = dialog.getCurSel(control)) && (link = HTML._getTreeLink(item)))
				dialog.setValue("href", link);
		}
	};
	return treectrl;
};

HTML._createLinkTree = function(path, name)
{
	// パスからTREELIST用のアイテム木を作成する。
	var dirs = null;
	var items = null;
	if (path)
	{
		while (/\\[^\\]+$/.test(path))
		{
			var children = items;
			var entity = RegExp.lastMatch.substr(1);
			var folder = RegExp.leftContext;
			var files = File.dir(folder + "\\", "*.*");

			// 最初にフォルダ、続いてファイルを並べるため配列を2つ用意する。
			dirs = [ ];
			items = [ ];

			for (var i in files)
			{
				var stat = File.getStatus(folder + "\\" + files[i]);
				var item = [ files[i] ];
				var first = true;

				if (String.stricmp(files[i], entity) == 0)
				{
					if (children)
					{
						item.children = children;
						item.expand = true;
					}
					else
					{
						// children なしで名前が一致するのは最初の1つだけ。
						var links;

						// (1)ファイル内の名前が指定されていて、(2)HTML ファイルで、
						// (3)ファイル内の名前が取得できれば、まず子として登録する。

						if (name && HTML.isHTML(path) && (links = HTML.pickupLinks(path)))
						{
							item.children = links;

							// (4)さらに<a name="...">のアイテムがあり、(5)その中に
							// name と一致するものがあれば、最初にそれを選択させる。

							var kids = links.names && links.names.children;
							if (kids)
							{
								for (var k in kids)
								{
									if (name == kids[k][0])
									{
										kids[k].name = "first";
										first = false;
										break;
									}
								}
							}
						}
						if (first)
						{
							item.name = "first";
							first = false;
						}
					}
				}

				if (stat[3] & File.ATTRIBUTE_DIRECTORY)
				{
					// 展開する関数を追加。
					dirs.push(item);
					item.color = 0xc00000;
					item.folder = true;
					item[0] += "\\";
					if (!item.children)
						item.children = HTML._expandFolder;
				}
				else if (HTML.filterHref(item[0]) || !first)
				{
					// ファイルならサイズを表示する。
					items.push(item);
					item[1] = stat[2];

					// HTML ファイルなら内部のリンクを探す関数を追加する。
					if (!item.children && HTML.isHTML(files[i]))
						item.children = HTML._pickupLinks;
				}
			}

			items = dirs.concat(items);
			path = folder;
		}
	}

	// すべてのドライブにアクセスできるようにルートを登録する。
	var hreftree = [ ];
	for (var drive = 0x41; drive <= 0x5A; drive++)
	{
		var root = String.fromCharCode(drive) + ":";
		if (File.isFolder(root))
		{
			if (items && String.stricmp(root, folder) == 0)
				hreftree.push({ 0: folder + "\\", children: items, expand: true, color: 0xc00000 });
			else
				hreftree.push({ 0: root + "\\", children: HTML._expandFolder, color: 0xc00000 });
		}
	}
	return hreftree;
};

HTML._expandFolder = function(dialog, control, parent)
{
	// フォルダ内のファイル/サブフォルダをリストする。
	var folder = HTML._getTreePath(parent);
	var files = File.dir(folder, "*.*");
	var items = [ ];
	var dirs = [ ];

	for (var i in files)
	{
		var item = { 0: files[i] };
		var stat = File.getStatus(folder + "\\" + files[i]);

		if (stat[3] & File.ATTRIBUTE_DIRECTORY)
		{
			dirs.push(item);
			item.color = 0xc00000;
			item.folder = true;
			item[0] += "\\";
			item.children = arguments.callee;
		}
		else if (HTML.filterHref(item[0]))
		{
			items.push(item);
			item[1] = stat[2];
			if (HTML.isHTML(files[i]))
				item.children = HTML._pickupLinks;
		}
	}
	return dirs.concat(items);
};

HTML._pickupLinks = function(dialog, control, parent)
{
	// ファイルの[+]をクリックされたときにname/href子アイテムを作成する関数。
	return HTML.pickupLinks(HTML._getTreePath(parent));
};

HTML.pickupLinks = function(path)
{
	// HTML ファイル中の<A (NAME|HREF)="....">を表す子アイテムを作成する。
	// NOTE	コメント <!-- --> の中など、コンテキストを意識しないで拾い上
	//		げるため、無効な名前までピックアップしてしまう。時間があれば
	//		改善しましょう。

	var file = new File(path);
	if (!file.open("rb"))
		return;

	var text, hit;
	var rexp = /<a\s+(name|href)\s*=\s*("[^"]+"|'[^']+')/ig;
	var line = 0;
	var names = [ ];
	var hrefs = [ ];
	var dupmap = { };

	while (text = file.readLine())
	{
		line++;
		rexp.lastIndex = 0;

		while (hit = rexp.exec(text))
		{
			var url = hit[2].slice(1, -1);

			// ファイル内へのリンク<a href="#...">は、対応する<a name="...">が
			// (まとであれば)あるはずなので、ピックアップしない。
			if (url.charCodeAt(0) == 0x23 /* # */)
				continue;

			// 重複ピックアップを避ける。
			if (url in dupmap)
				continue;
			dupmap[url] = true;

			// name と href を別々に登録する。
			if (String.stricmp(hit[1], "name") == 0)
				names.push([ url, /* size */, line ]);
			else
				hrefs.push([ url, /* size */, line ]);
		}
	}
	file.close();

	// オプションいよりソートする。
	if (HTML.sortAnchorList)
	{
		var comp = function(a, b) { return String.stricmp(a[0], b[0]); };
		names.sort(comp);
		hrefs.sort(comp);
	}

	// name と href に分けて子孫アイテムを作成する。
	// NOTE: 配列のインデックス 0、1 以外にプロパティとしても登録する。
	// NOTE: skip プロパティは、パス生成時にこのアイテムを無視させるため。

	var items = [ ];
	if (names.length)
	{
		items.names = { 0: "name", children: names, skip: true };
		items.push(items.names);
	}
	if (hrefs.length)
	{
		items.hrefs = { 0: "href", children: hrefs, skip: true };
		items.push(items.hrefs);
	}

	return items;
};

HTML._getTreeLink = function(item)
{
	// アイテムから href="..." に書き込みリンク先文字列を作成する。
	// item[0] 名前、item[1] ファイルサイズ、item[2] ファイル内の行番号
	if (!item)
		return;

	// サイズがある -> ファイル自身を表すアイテムからジャンプ先を作成する。
	// folderがある -> フォルダを表すアイテムからジャンプ先を作成する。
	// NOTE: 同じフォルダであったために相対パスに変換したら何も無くなった
	// 場合、仕方ないので、便宜上 "./" を返すことにした。- JM 2004/01/22

	if (1 in item || item.folder)
		return HTML.toHtmlPath(HTML._getTreePath(item)) || "./";

	// 行番号がある -> ファイル中の <a name="...">、<a href="..."> エントリーからジャンプ先を作成する。
	if (2 in item)
	{
		var name = item[0];
		var path = view ? view.getFilePath() : "";
		var link = HTML._getTreePath(item.parent);

		if (item.parent[0] == "name")
		{
			// name の子アイテムならば、このファイルの中で定義しているアンカーポイントである。
			return (String.stricmp(path, link) ? HTML.toHtmlPath(link) : "") + "#" + name;
		}
		else if (HTML.isURL(name) || name.charCodeAt(0) == 0x2f /* / */)
		{
			// href から取得したリンク先がURLか絶対パスならそのまま使う。
			return name;
		}
		else // (relative path)
		{
			// 相対パスなら、それが埋め込まれていたファイルのパスを前に付けて
			// 絶対パスに変換し、埋め込もうとしているファイルからの相対パスに
			// 変換する。しかしファイルが存在しない場合はそのまま使う。正解!?
			// NOTE: ファイルの存在を調べるとき、# や ? から後を取り除くこと。

			link = HTML.reformPath(link.replace(/[^\\]*$/, name));
			return File.exists(link.replace(/[#?].*/)) ? HTML.toHtmlPath(link) : name;
		}
	}
};

HTML._getTreePath = function(item)
{
	// ツリーを遡りながらこのアイテムのパスを作成する。
	var path = "";

	do {
		// NOTE: skip の定義してあるアイテムはパスに組み込まない。また、定義
		// 行番号(item[2])があるのはファイル中の行を表しているアイテムなので、
		// 生成するパスには含めない。
		if (item.skip || (2 in item))
			continue;

		// NOTE: parentプロパティは、ツリーが表示されるときに自動作成される。
		path = item[0] + path;
	} while (item = item.parent);

	return path;
};

HTML._onClickPopupView = function(dialog, control)
{
	// tree で選択している個所をポップアップ表示して確認する。
	var item, path, file;
	if ((item = dialog.getCurSel("tree")) &&
		(path = HTML._getTreePath(item)) &&
		File.isFile(path))
	{
		HTML.popupOpenText(path, item[2]);
		return;
	}
	beep();
};

HTML.popupOpenText = function(path, line)
{
	// ファイルを Peggy Pad でポップアップ表示し、行指定があればそこへジャンプする。
	var win = HTML.findWindow(path + " - Peggy Pad");
	if (win)
	{
		if (line > 0)
		{
			// Peggy Pad に指定行へジャンプする命令(0x7401)をポストする。
			// NOTE: Peggy Pad 4.14a 以上をインストールしている必要あり。
			postMessage(win, 0x7401, line);
		}
		setForegroundWindow(win);
		return;
	}
	line = line ? "-L" + line + " " : "";
	shellExecute(null, getPeggyFolder() + "\\..\\PeggyPad\\PeggyPad.exe", line + path);
};


/////////////////////////////////////////////////////////////////////////////
// <Hn> TAG EDITOR

function editH(tag)
{
	// <hn align="...">
	var aligns = "center,left,right,justify".splitcsv();
	var levels = [ 1, 2, 3, 4, 5, 6 ];
	var level  = parseInt(tag.elementName.substr(1)) - 1;
	var attr = tag.values;
	var template =
	[
		{ type: "COMBO", name: "level", label: "見出しレベル(&L):", options: levels, value: level, x: 60, y: 5, labelWidth: 55, style: CBS_DROPDOWNLIST },
		{ type: "COMBO", name: "align", label: "配置(&G):", options: aligns }
	];

	// [<Hn>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 35, true, "align");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<Hn>タグのプロパティを更新する。
	tag.elementName = tag.elementName.substr(0, 1) + dialog.results.level;
	tag.updateByNames("align", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <PRE> TAG EDITOR

function editPre(tag)
{
	// <pre col="123" wrap>
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "cols", label: "横文字数(&C):", value: attr.cols, x: 60, labelWidth: 55, spin: [0, 255], style: ES_NUMBER },
		{ type: "CHECK", name: "wrap", label: "折り返し(&W)", value: "wrap" in attr, x: 125, y: 7 }
	];

	// [<pre>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 19, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<pre>タグのプロパティを更新する。
	tag.updateByNames("cols,!wrap", dialog.results);
	if (!tag.text)
		tag.setPostPre("\n", "\n");
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <BLOCKQUOTE> TAG EDITOR

function editBlockquote(tag)
{
	// <blockquote cite="url">
	var template =
	[
		{ type: "COMBO", name: "cite", label: "引用元&URL:", options: HTML.hrefHistory, x: 45, width: 176, labelWidth: 40 },
		{ type: "BUTTON", pair: "cite", label: "&...", x: 223, y: 5, width: 12, onClick: HTML.onBrowseURL }
	];

	// [<blockquote>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 240, 19, true, "cite");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<blockquote>タグのプロパティを更新する。
	tag.updateByNames("cite", dialog.results);
	if (!tag.text)
		tag.setPostPre("\n", "\n");
	HTML.updateHistory(HTML.hrefHistory, dialog.results.cite);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <TABLE> TAG EDITOR

function editTable(tag)
{
	// <table border bordercolor bordercolorlight bordercolordark
	//		 align vspace hspace width height cellspacing cellpadding frame rules bgcolor background>
	var alignoptions = "left,center,right".splitcsv();
	var ruleoptions  = "none,groups,rows,cols,all".splitcsv();
	var frameoptions = "void,above,below,hsides,vsides,lhs,rhs,box,border".splitcsv();
	var sepoptions   = "区切らない,コンマ,TAB,正規表現".splitcsv();

	var attr	= tag.values;
	var colors	= HTML.listColorNames();

	// 幅と高さが % で指定されている場合は % を分離する。
	HTML.separatePercent(attr);

	var template =
	[
		{ type: "GROUPBOX", label: "大きさと背景", length: 9, x: 5, y: 5, width: 275, height: 81,
			0: { type: "EDIT", name: "width", label: "横幅(&W):", value: attr.width, x: 65, y: 12, width: 40, labelWidth: 60, spin: [0, 1000], style: ES_NUMBER },
			1: { type: "CHECK", name: "width_P", label: "%", value: attr.width_P, x: 108, y: 14 },
			2: { type: "EDIT", name: "height", label: "高さ(&H):", value: attr.height, x: 65, y: 28, spin: [0, 1000], style: ES_NUMBER },
			3: { type: "CHECK", name: "height_P", label: "%", value: attr.height_P, x: 108, y: 30 },
			4: { type: "COMBO", name: "bgcolor", pair: "bgcwell", label: "背景色(&K):", x: 65, y: 44, options: colors, onChange: HTML.setColorToButton },
			5: { type: "COLOR", name: "bgcwell", pair: "bgcolor", x: 108, y: 44, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			6: { type: "COMBO", name: "background", label: "背景イメージ(&I):", options: HTML.imageHistory, x: 65, y: 60, width: 178 },
			7: { type: "BUTTON", pair: "background", label: "&...", x: 245, y: 60, width: 12, onClick: HTML.imageChooser },
			8: { type: "BUTTON", pair: "background", label: "&?", x: 257, y: 60, width: 12, onClick: HTML.imageViewer }
		},
		{ type: "GROUPBOX", label: "レイアウト", length: 9, x: 5, y: 90, width: 135, height: 112,
			0: { type: "COMBO", name: "align", label: "配置(&G):", options: alignoptions, x: 65, y: 12, width: 40, labelWidth: 60 },
			1: { type: "EDIT", name: "hspace", label: "横スペース(&Z):", value: attr.hspace, x: 65, y: 28, spin: [0, 1000], style: ES_NUMBER },
			2: { type: "STATIC", value: "ピクセル", x: 107, y: 30 },
			3: { type: "EDIT", name: "vspace", label: "縦スペース(&V):", value: attr.vspace, x: 65, y: 44, spin: [0, 1000], style: ES_NUMBER },
			4: { type: "STATIC", value: "ピクセル", x: 107, y: 46 },
			5: { type: "EDIT", name: "cellspacing", label: "セル間隔(&S):", value: attr.cellspacing, x: 65, y: 60, spin: [0, 32], style: ES_NUMBER },
			6: { type: "STATIC", value: "ピクセル", x: 107, y: 62 },
			7: { type: "EDIT", name: "cellpadding", label: "セル内マージン(&P):", value: attr.cellpadding, x: 65, y: 76, spin: [0, 32], style: ES_NUMBER },
			8: { type: "STATIC", value: "ピクセル", x: 107, y: 78 }
		},
		{ type: "GROUPBOX", label: "ボーダー", length: 10, x: 145, y: 90, width: 135, height: 112,
			0: { type: "EDIT", name: "border", label: "幅(&B):", value: attr.border, x: 60, y: 12, width: 40, labelWidth: 55, spin: [0, 100], style: ES_NUMBER },
			1: { type: "STATIC", value: "ピクセル", x: 103, y: 14 },
			2: { type: "COMBO", name: "bordercolor", pair: "colorcolor", label: "色(&C):", value: bordercolor, x: 60, y: 28, width: 40, options: colors, onChange: HTML.setColorToButton },
			3: { type: "COLOR", name: "colorcolor", pair: "bordercolor", x: 103, y: 27, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			4: { type: "COMBO", name: "bordercolorlight", pair: "colorlight", label: "明るい側の色(&L):", value: light, x: 60, y: 44, options: colors, onChange: HTML.setColorToButton },
			5: { type: "COLOR", name: "colorlight", pair: "bordercolorlight", x: 103, y: 44, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			6: { type: "COMBO", name: "bordercolordark", pair: "colordark", label: "暗い側の色(&D):", value: dark, x: 60, y: 60, options: colors, onChange: HTML.setColorToButton },
			7: { type: "COLOR", name: "colordark", pair: "bordercolordark", x: 103, y: 60, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			8: { type: "COMBO", name: "frame", label: "外枠(&F):", options: frameoptions, x: 60, y: 76, width: 40 },
			9: { type: "COMBO", name: "rules", label: "罫線(&R):", options: ruleoptions, x: 60, y: 92, width: 40 }
		}
	];

	var height = 196;
	if (!tag.text)
	{
		// テーブル挿入では、<th>、<tr>、<td> を自動作成するかどうかのパラメータも入力できるようにする。
		template.push(
			{ type: "GROUPBOX", label: "表作成", length: 8, x: 5, y: 206, width: 275, height: 52,
				0: { type: "CHECK", name: "rowcol", label: "テーブル項目を作成(&T)", value: HTML.tableAddItems, x: 5, y: 0,
					 onClick: function(dialog, control) { dialog.grayout(); }},
				1: { type: "EDIT",  name: "numrows", label: "行数(&Y):", value: HTML.tableRows, x: 35, y: 13, spin: [0, 100], style: ES_NUMBER, width: 30, labelWidth: 30 },
				2: { type: "EDIT",  name: "numcols", label: "欄数(&X):", value: HTML.tableCols, y: 30, spin: [0, 100], style: ES_NUMBER },
				3: { type: "CHECK", name: "header",  label: "1行目をヘッダとする(&E)", value: HTML.tableHeader, x: 75, y: 13 },
				4: { type: "CHECK", name: "comment", label: "コメントを付ける(&M)", value: HTML.tableComment, y: 24 },
				5: { type: "CHECK", name: "indent",  label: "インデントする(&N)", value: HTML.tableIndent, y: 35 },
				6: { type: "COMBO", name: "itemsep", label: "区切り(&O):", value: HTML.tableSeparator, x: 200, y: 13, width: 67, labelWidth: 40, options: sepoptions, style: CBS_DROPDOWNLIST,
					 onChange: function(dialog, control) { dialog.grayout(); }},
				7: { type: "COMBO", name: "seprexp", label: "正規表現(&U):", value: 0, options: HTML.tableRegexp, y: 30 }});
		height += 55;
	}

	// [<table>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 285, height, false, "align,frame,rules,%bgcolor,background,%bordercolor,%bordercolorlight,%bordercolordark");
	dialog.grayout = function()
	{
		// [テーブル項目を作成]、[区切り] の値に従って、関連コントロールの有効/無効を切り替える。
		var rowcol = this.controls.rowcol;
		if (!rowcol)
			return;

		var onoff = this.getValue(rowcol);
		var ctrls = "header,numrows,numcols,comment,indent,itemsep".splitcsv();
		for (var i in ctrls)
			this.enableControl(ctrls[i],  onoff);
		this.enableControl("seprexp", onoff && this.getValue("itemsep", true) == 3 /* 正規表現 */);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<table>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res);
	HTML.updateHistory(HTML.imageHistory, res.background);

	tag.updateByNames("width,height,bgcolor,background,align,hspace,vspace,cellspacing,cellpadding,border,bordercolor,bordercolorlight,bordercolordark,frame,rules", res);
	if (!tag.text)
		tag.setPostPre("\n", "\n");

	if ("rowcol" in res)
	{
		// tag に作成する中身の情報を tag 自身に保存する。
		// 同時に次回のデフォルト値としても保存する。
		HTML.tableHeader	= tag.header	= res.header;
		HTML.tableComment	= tag.comment	= res.comment;
		HTML.tableRows		= tag.rows		= res.numrows;
		HTML.tableCols		= tag.cols		= res.numcols;
		HTML.tableIndent	= tag.indent	= res.indent;
		HTML.updateHistory(HTML.tableRegexp, tag.regexp	= res.seprexp);
		HTML.tableSeparator	= tag.itemsep	= HTML.valueToIndex(sepoptions, res.itemsep, 0);

		// <table>...</table>タグ挿入後の後処理関数を指定する。
		if (HTML.tableAddItems = res.rowcol)
			tag.postProcess = HTML.tableItemizer;
	}
	return true;
}

HTML.tableItemizer = function(tag, vw)
{
	// テーブルの中身を作成する後処理関数。
	var sel = vw.getSelection();
	if (sel.block)
		return;

	// 作成するテーブルの行とカラム数を取得する。
	var cols = Integer(tag.cols || 0);
	var rows = Integer(tag.rows || 0);

	// 行数が無指定または0ならば、選択範囲を対象とする。
	if (rows <= 0)
		rows = sel[1].line - sel[0].line;

	// 既存テキスト変換が指定されていれば、カラム分離用の正規表現を作成する。
	var seprexp;
	if (tag.itemsep && sel.direction)
	{
		seprexp = new RegExp([ ",", "\\t", tag.regexp ][tag.itemsep - 1]);
		if (!seprexp.isValid())
			error("正規表現(" + tag.regexp + "に誤りがあります.");
	}

	// 先頭と途中の行に <LI> ... </LI> を挿入する。
	var openTr	= HtmlTag.getTagText("tr");			// "<tr>"
	var closeTr	= HtmlTag.getTagText("tr", 2);		// "</tr>" または ""
	var openTh	= HtmlTag.getTagText("th");			// "<th>"
	var closeTh	= HtmlTag.getTagText("th", 2);		// "</th>" または ""
	var openTd	= HtmlTag.getTagText("td");			// "<td>"
	var closeTd	= HtmlTag.getTagText("td", 2);		// "</td>" または ""

	// ヘッダーの有無により小細工をする。
	if (!tag.header)
	{
		openTh = openTd;
		closeTh = closeTd;
	}

	// ヘッダーの小細工を考慮しながらコメントを生成する(しない)補助関数。
	var comment = function() { return ""; };
	if (tag.comment)
	{
		comment = function(header, row, col)
		{
			// 行・カラムを表すコメントを追加する。
			if (!header)
				return sprintf("<!-- %d:%d -->", row, col);
			else if (row > 1)
				return sprintf("<!-- %d:%d -->", row - 1, col);
			else // (先頭行)
				return sprintf("<!-- H:%d -->", col);
		};
	}

	// 挿入位置を特定するための変数。
	var index = sel[0].index;
	var line  = sel[0].line;
	var last  = sel[1].line;
	var endx  = sel[1].index;

	var row = 0;
	while (++row <= rows)
	{
		// 当初の終点を越えている場合は、終点の次行へ伸ばす。
		if (line > last)
		{
			vw.insertTextAt(sel[1], vw.getNewline());
			sel[1].line = ++last;
			sel[1].index = 0;
		}

		// この行の開始/終了位置を決める。
		// NOTE: 最終行の場合は、sel[1] への参を直接使うことで選択範囲の補正もできる。
		var endpt = (line < last) ? EP(line, vw.getLineLength(line)) : sel[1];
		var range = [ EP(line, index), endpt ];

		// 行の開始タグ <td> を挿入する。オプションにより先頭にタブも挿入する。
		var text = (tag.indent && range[0].index == 0) ? "\t" + openTr : openTr;
		vw.insertTextAt(range[0], text);
		range[0].index += text.length;
		range[1].index += text.length;

		var col = 0;
		if (++col <= cols || cols <= 0)
		{
			// 最初のアイテム <th> or <td> を挿入する。
			text = openTh + comment(tag.header, row, col);
			vw.insertTextAt(range[0], text);
			range[0].index += text.length;
			range[1].index += text.length;

			var rexp = seprexp;
			while (++col <= cols || cols <= 0)
			{
				// 2番目以降のアイテム <th> or <td> を挿入する。
				text = closeTh + openTh + comment(tag.header, row, col);

				var found;
				if (rexp && (found = vw.search(rexp, range[0], range[1])))
				{
					// 置換してから次の検索開始/終了位置を補正する。
					vw.replaceTextBetween(found[0], found[1], text);
					range[0].index  = found[0].index + text.length;
					range[1].index += text.length - (found[1].index - found[0].index);
				}
				else if (cols > 0)
				{
					// 行の最後へ追加挿入する。
					vw.insertTextAt(endpt, text);
					endpt.index += text.length;
					rexp = null;
				}
				else // (no more item)
					break;
			}

			// 必要に応じて閉じ </th>、</td> タグを挿入する。
			if (closeTh)
			{
				vw.insertTextAt(endpt, closeTh);
				endpt.index += closeTh.length;
			}
		}

		// 必要に応じて閉じ </tr> タグを挿入する。
		if (closeTr)
		{
			vw.insertTextAt(endpt, closeTr);
			endpt.index += closeTh.length;
		}

		// 次行の先頭へ進める。
		line++;
		index = 0;
		openTh = openTd;
		closeTh = closeTd;
	}

	// 再び挿入後の範囲を選択する。
	if (endx == 0 && sel[1].index > 0 && tag.text)
	{
		// NOTE: 挿入前は選択範囲の終点が行頭で挿入後は行の途中になって
		// しまった場合、改行して次行の先頭まで選択した方が自然に感じる。
		vw.insertTextAt(sel[1], vw.getNewline());
		sel[1].line++;
		sel[1].index = 0;
	}
	vw.setSelection(sel);
};


/////////////////////////////////////////////////////////////////////////////
// <TR> TAG EDITOR

function editTr(tag)
{
	// <tr align valign bgcolor background>
	var haligns = "left,center,right".splitcsv();
	var valigns = "top,middle,bottom,baseline".splitcsv();
	var attr	= tag.values;
	var colors	= HTML.listColorNames();

	var template =
	[
		{ type: "COMBO",  name: "bgcolor", pair: "bgcwell", label: "背景色(&B):", x: 60, y: 5, width: 75, labelWidth: 55, options: colors, onChange: HTML.setColorToButton },
		{ type: "COLOR",  name: "bgcwell", pair: "bgcolor", x: 140, y: 5, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
		{ type: "COMBO",  name: "background", label: "背景イメージ(&I):", options: HTML.imageHistory, x: 60, y: 21, width: 134 },
		{ type: "BUTTON", pair: "background", label: "&...", x: 196, y: 21, width: 12, onClick: HTML.imageChooser },
		{ type: "BUTTON", pair: "background", label: "&?", x: 208, y: 21, width: 12, onClick: HTML.imageViewer },
		{ type: "COMBO",  name: "align", label: "横方向(&G):", options: haligns, x: 60, y: 37, width: 75 },
		{ type: "COMBO",  name: "valign", label: "縦方向(&V):", options: valigns, x: 60, y: 53, width: 75 },
	];

	// [<tr>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 67, true, "%bgcolor,background,align,valign");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<tr>タグのプロパティを更新する。
	tag.updateByNames("bgcolor,background,align,valign", dialog.results);
	HTML.updateHistory(HTML.imageHistory, dialog.results.background);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <TD>、<TH> TAG EDITOR

function editTableCell(tag)
{
	// <td|th  width height align valign bgcolor background nowrap rowspan colspan>
	var haligns	= "left,center,right".splitcsv();
	var valigns	= "top,middle,bottom,baseline".splitcsv();
	var attr	= tag.values;
	var colors	= HTML.listColorNames();
	HTML.separatePercent(attr);

	var template =
	[
		{ type: "GROUPBOX", label: "大きさと背景", length: 9, x: 5, y: 5, width: 250, height: 81,
			0: { type: "EDIT",   name: "width",      label: "横幅(&W):", value: attr.width,    x:  55, y: 12, width: 50, labelWidth: 50, spin: [0, 1000], style: ES_NUMBER },
			1: { type: "CHECK",  name: "width_P",    label: "%", value: attr.width_P,  x: 110, y: 14 },
			2: { type: "EDIT",   name: "height",     label: "高さ(&H):", value: attr.height,   x:  55, y: 28, spin: [0, 1000], style: ES_NUMBER },
			3: { type: "CHECK",  name: "height_P",   label: "%", value: attr.height_P, x: 110, y: 30 },
			4: { type: "COMBO",  name: "bgcolor",    pair:  "bgcwell", label: "背景色(&B):", options: colors, x: 55, y: 44, width: 50, onChange: HTML.setColorToButton },
			5: { type: "COLOR",  name: "bgcwell",    pair:  "bgcolor", x: 110, y: 44, width: 25, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			6: { type: "COMBO",  name: "background", label: "背景イメージ(&I):", options: HTML.imageHistory, x: 55, y: 60, width: 162 },
			7: { type: "BUTTON", pair: "background", label: "&...", x: 219, y: 60, width: 12, onClick: HTML.imageChooser },
			8: { type: "BUTTON", pair: "background", label: "&?", x: 231, y: 60, width: 12, onClick: HTML.imageViewer }
		},
		{ type: "GROUPBOX", label: "レイアウト", length: 6, x: 5, y: 90, width: 250,
			0: { type: "COMBO",  name: "align",		label: "横方向(&G):", options: haligns, x: 55, y: 12, labelWidth: 50 },
			1: { type: "COMBO",  name: "valign",	label: "縦方向(&V):", options: valigns, x: 55, y: 28 },
			2: { type: "EDIT",   name: "colspan",	label: "横スパン(&C):", value: attr.colspan, x: 193, y: 12, labelWidth: 40, spin: [2, 100], style: ES_NUMBER },
			3: { type: "EDIT",   name: "rowspan",	label: "縦スパン(&R):", value: attr.rowspan, x: 193, y: 28, spin: [2, 100], style: ES_NUMBER },
			4: { type: "CHECK",  name: "nowrap",	label: "折り返さない(&N)", value: "nowrap" in attr, x: 55, y: 44 }
		},
	];

	// [<tr>/<td>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 260, 145, false, "%bgcolor,background,align,valign");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<tr>/<td>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res);
	tag.updateByNames("width,height,bgcolor,background,align,valign,colspan,rowspan,!nowrap", res);
	HTML.updateHistory(HTML.imageHistory, res.background);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <CAPTION> TAG EDITOR

function editCaption(tag)
{
	// <caption align="..." valign="...">
	HTML._getTextAfterTag(tag);
	var haligns = "top,bottom,left,right,center".splitcsv();
	var valigns = "top,bottom".splitcsv();
	var attr	= tag.values;

	var template =
	[
		{ type: "EDIT",  name: "after", label: "キャプション(&C):", value: tag.after, x: 60, width: 160, labelWidth: 55 },
		{ type: "COMBO", name: "align", label: "位置(&G):", options: haligns, width: 50 },
		{ type: "COMBO", name: "valign", label: "上下位置(&V):", options: valigns }
	];

	// [<caption>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 51, true, "align,valign");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<caption>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("align,valign", res);

	// 次のタグとの間のラベル文字列を更新する。
	if (res.after != tag.after)
		HTML._putTextAfterTag(tag, res.after);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <COL>、<COLGROUP> TAG EDITOR

function editColgroup(tag)
{
	// <col align="center,char,justify,left,right" valign="baseline,bottom,middle,top"
	//	bgcolor="..." char="..." charoff="..." span="..." width="...">
	var haligns	= "left,right,center,char,justify".splitcsv();
	var valigns = "top,middle,bottom,baseline".splitcsv();
	var colors	= HTML.listColorNames();
	var attr	= tag.values;

	// 幅が % で指定されている場合は % を分離する。
	var percent	= [ "width" ];
	HTML.separatePercent(attr, percent);

	var template =
	[
		{ type: "EDIT", name: "width", label: "横幅(&W):", value: attr.width, x: 60, labelWidth: 55, spin: [0, 1000], style: ES_NUMBER },
		{ type: "CHECK", name: "width_P", label: "%", value: attr.width_P, x: 115, y: 7 },
		{ type: "COMBO", name: "bgcolor", pair: "bgclbox", label: "背景色(&B):", x: 60, y: 21, options: colors },
		{ type: "COLOR", name: "bgclbox", pair: "bgcolor", x: 115, y: 21, width: 25, style: HTML.colorPalette, onChange:HTML.setColorToCombo },
		{ type: "EDIT", name: "span", label: "スパン(&S):", value: attr.span, x: 60, width: 50, spin: [0, 100], style: ES_NUMBER },
		{ type: "COMBO", name: "align", label: "横配置(&G):", options: haligns, onChange: function(dialog, control) { dialog.grayout(); } },
		{ type: "COMBO", name: "valign", label: "縦配置(&V):", options: valigns },
		{ type: "EDIT", name: "char",    label: "揃える文字(&C):", value: attr.char, x: 190, y: 53, width: 30, labelWidth: 50 },
		{ type: "EDIT", name: "charoff", label: "オフセット(&O):", value: attr.charoff, spin: [0, 100], style: ES_NUMBER },
	];

	// [<col>タグ編集]、[<colgroup>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 83, true, "%bgcolor,align,valign");
	dialog.grayout = function()
	{
		var ischar = String.stricmp(this.getValue("align"), "char") == 0;
		this.enableControl("char", ischar);
		this.enableControl("charoff", ischar);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<col>、<colgroup>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res, percent);
	tag.updateByNames("width,align,valign,bgcolor,char,charoff,span", res);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <HBODY>、<THEAD>、<TFOOT> TAG EDITOR

function editTbody(tag)
{
	// <tbody align="..." valign="..." bgcolor="..." char="..." charoff="...">
	// <thead ... > も <tfoot ... > も同じ。
	var haligns	= "left,right,center,char,justify".splitcsv();
	var valigns = "top,middle,bottom,baseline".splitcsv();
	var colors	= HTML.listColorNames();
	var attr	= tag.values;

	var template =
	[
		{ type: "COMBO", name: "bgcolor", pair: "bgclbox", label: "背景色(&B):", x: 60, labelWidth: 55, options: colors },
		{ type: "COLOR", name: "bgclbox", pair: "bgcolor", x: 115, y: 5, width: 25, style: HTML.colorPalette, onChange:HTML.setColorToCombo },
		{ type: "COMBO", name: "align", label: "横配置(&G):", x: 60, y: 21, options: haligns, onChange: function(dialog, control) { dialog.grayout(); } },
		{ type: "COMBO", name: "valign", label: "縦配置(&V):", options: valigns },
		{ type: "EDIT", name: "char",    label: "揃える文字(&C):", value: attr.char, x: 190, y: 21, width: 30, labelWidth: 50 },
		{ type: "EDIT", name: "charoff", label: "オフセット(&O):", value: attr.charoff, spin: [0, 100], style: ES_NUMBER },
	];

	// [<tbody>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 51, true, "%bgcolor,align,valign");
	dialog.grayout = function()
	{
		var ischar = String.stricmp(this.getValue("align"), "char") == 0;
		this.enableControl("char", ischar);
		this.enableControl("charoff", ischar);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<tbody>、<thead>、<tfoot>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res, percent);
	tag.updateByNames("align,valign,bgcolor,char,charoff", res);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <OL> TAG EDITOR

function editOl(tag)
{
	// <ol>タグを編集する。
	var attr		= tag.values;
	var types		= [ "", "1, 2, 3, 4, 5, ...", "a, b, c, d, e, ...", "A, B, C, D, E, ...", "i, ii, iii, iv, v, ...", "I, II, III, IV, V, ..." ];
	var typechars	= [ "", "1", "a", "A", "i", "I" ];
	var typeindex	= HTML.valueToIndex(typechars, attr.type, 0);

	var template =
	[
		{ type: "COMBO", name: "type", label: "番号のタイプ(&T):", options: types, value: typeindex, x: 60, width: 75, labelWidth: 55, style: CBS_DROPDOWNLIST },
		{ type: "EDIT",  name: "start", label: "開始番号(&S):", value: attr.start, spin: [ 1, 100 ], style: ES_NUMBER },
		{ type: "CHECK", name: "compact", label: "コンパクト(&C):", value: "compact" in attr }
	];
	var itemize = HTML.addItemizerCheck(tag, template);

	// [<ol>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, itemize ? 60 : 48, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<ol>タグのプロパティを更新する。
	var res = dialog.results;
	res.type = typechars[ HTML.valueToIndex(types, res.type) ];
	tag.updateByNames("type,start,!compact", res);

	// 新規 OL タグの挿入であれば改行する。
	if (!tag.text)
		tag.setPostPre("\n", "\n");

	// 途中をリスト項目に変換する場合は、ポスト処理を追加する。
	if (itemize && (HTML.itemizeLines = res.itemize))
		tag.postProcess = HTML.listItemizer;
	return true;
}

function editUl(tag)
{
	// <ul>タグを編集する。
	var attr		= tag.values;
	var types		= [ "", "○", "●", "■" ];
	var typechars	= [ "", "circle", "disc", "square" ];
	var typeindex	= HTML.valueToIndex(typechars, attr.type, 0);

	var template =
	[
		{ type: "COMBO", name: "type", label: "番号のタイプ(&T):", options: types, value: typeindex, x: 60, width: 50, labelWidth: 55, style: CBS_DROPDOWNLIST },
		{ type: "CHECK", name: "compact", label: "コンパクト(&C)", value: "compact" in attr, x: 125, y: 7 }
	];
	var itemize = HTML.addItemizerCheck(tag, template);

	// [<ul>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, itemize ? 31 : 19, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<ul>タグのプロパティを更新する。
	var res = dialog.results;
	res.type = typechars[ HTML.valueToIndex(types, res.type) ];
	tag.updateByNames("type,!compact", res);

	// 新規 UL タグの挿入であれば改行する。
	if (!tag.text)
		tag.setPostPre("\n", "\n");

	// 途中をリスト項目に変換する場合は、ポスト処理を追加する。
	if (itemize && (HTML.itemizeLines = res.itemize))
		tag.postProcess = HTML.listItemizer;
	return true;
}

HTML.addItemizerCheck = function(tag, template)
{
	if (!tag.text && view)
	{
		var sel = getSelection();
		if (sel.direction)
			return template.push({ type: "CHECK", name: "itemize", label: "行をリスト項目に変換(&V)", value: HTML.itemizeLines });
	}
};

HTML.listItemizer = function(tag, vw)
{
	// 選択範囲の行をリストアイテム化する。
	var sel = vw.getSelection();
	if (sel.direction == 0 || sel.block)
		return;

	// 先頭と途中の行に <LI> ... </LI> を挿入する。
	var openTag  = HtmlTag.getTagText("li");
	var closeTag = HtmlTag.getTagText("li", 2);
	var pt = sel[0];
	while (pt.line < sel[1].line)
	{
		vw.insertTextAt(pt, openTag);
		if (closeTag)
			vw.insertTextAt(EP(pt.line, 65000), closeTag);
		pt.line++;
		pt.index = 0;
	}

	// 最後に行に <LI> ... </LI> を挿入する。
	if (HTML.comparePoints(pt, sel[1]) < 0)
	{
		if (closeTag)
			vw.insertTextAt(sel[1], closeTag);
		vw.insertTextAt(pt, openTag);

		sel[1].index += openTag.length + closeTag.length;
		vw.setSelection(sel);
	}
};

function editLi(tag)
{
	// <li>タグを編集する。
	var attr		= tag.values;
	var types		= [ "", "1, 2, 3, 4, 5, ...", "a, b, c, d, e, ...", "A, B, C, D, E, ...", "i, ii, iii, iv, v, ...", "I, II, III, IV, V, ...",
						"○", "●", "■" ];
	var typechars	= [ "", "1", "a", "A", "i", "I", "circle", "disc", "square" ];
	var typeindex	= HTML.valueToIndex(typechars, attr.type, 0);

	var template =
	[
		{ type: "COMBO", name: "type", label: "番号のタイプ(&T):", options: types, value: typeindex, x: 60, width: 75, labelWidth: 55, style: CBS_DROPDOWNLIST },
		{ type: "EDIT",  name: "value", label: "項目番号(&V):", value: attr.value, spin: [ 1, 100 ], style: ES_NUMBER }
	];

	// [<li>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 35, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<li>タグのプロパティを更新する。
	var res = dialog.results;
	res.type = typechars[ HTML.valueToIndex(types, res.type) ];
	tag.updateByNames("type,value", res);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <MARQUEE> TAG EDITOR

function editMarquee(tag)
{
	// <marquee>タグを編集する。
	var attr		= tag.values;
	var colors		= HTML.listColorNames();
	var behaviors	= "scroll,alternate,slide".splitcsv();
	var directions	= "left,right,up,down".splitcsv();
	HTML.separatePercent(attr);

	var template =
	[
		{ type: "GROUPBOX", label: "大きさと背景", length: 10, width: 250,
			0: { type: "EDIT",   name: "width",    label: "横幅(&W):", value: attr.width,    x: 45, y: 12, width: 40, labelWidth: 40, spin: [0, 1000], style: ES_NUMBER },
			1: { type: "CHECK",  name: "width_P",  label: "%",         value: attr.width_P,  x: 90, y: 14 },
			2: { type: "EDIT",   name: "height",   label: "高さ(&H):", value: attr.height,   x: 45, y: 28, spin: [0, 1000], style: ES_NUMBER },
			3: { type: "CHECK",  name: "height_P", label: "%",         value: attr.height_P, x: 90, y: 30 },
			4: { type: "COMBO",  name: "bgcolor", pair: "bgcwell", label: "背景色(&B):", options: colors, x: 45, y: 44, onChange: HTML.setColorToButton },
			5: { type: "COLOR",  name: "bgcwell", pair: "bgcolor", x: 90, y: 44, width: 30, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
			6: { type: "EDIT",   name: "hspace", label: "横スペース(&O):", value: attr.hspace, x: 175, y: 12, labelWidth: 45, spin: [0, 256], style: ES_NUMBER },
			7: { type: "STATIC", value: "ピクセル", x: 217, y: 14 },
			8: { type: "EDIT",   name: "vspace", label: "縦スペース(&V):", value: attr.vspace, x: 175, y: 28, spin: [0, 256], style: ES_NUMBER },
			9: { type: "STATIC", value: "ピクセル", x: 217, y: 30 }},

		{ type: "GROUPBOX", label: "動作", length: 8, width: 250,
			0: { type: "COMBO",  name: "behavior",  label: "動作(&E):",  value: attr.behavior, options: behaviors, x: 45, y: 12, width: 40, labelWidth: 40 },
			1: { type: "COMBO",  name: "direction", label: "方向(&D):",  value: attr.direction, options: directions, x: 45, y: 28 },
			2: { type: "CHECK",  name: "truespeed", label: "&TRUESPEED", value: "truespeed" in attr, x: 45, y: 46 },
			3: { type: "EDIT",   name: "loop",      label: "回数(&L):",  value: attr.loop, x: 175, y: 12, spin: [0, 100], style: ES_NUMBER, labelWidth: 45 },
			4: { type: "EDIT",   name: "delay",     label: "遅延(&Y):",  value: attr.delay, x: 175, y: 28, spin: [0, 100], style: ES_NUMBER },
			5: { type: "STATIC", value: "秒", x: 217, y: 30 },
			6: { type: "EDIT",   name: "amount",	label: "描画距離(&M):", value: attr.amount, x: 175, y: 44, spin: [0, 1000], style: ES_NUMBER },
			7: { type: "STATIC", value: "ピクセル", x: 217, y: 46 }},
	];

	// [<marquee>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 260, 132, false, "%bgcolor,behavior,direction");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<marquee>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res);
	tag.updateByNames("width,height,bgcolor,hspace,vspace,behavior,direction,loop,delay,amount,!truespeed", res);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <SCRIPT> TAG EDITOR

function editScript(tag)
{
	// <script language="..." src="..."> </script>
	// <script type="text/JavaScript" src="..."> </script>
	var langs = ",JavaScript,JavaScript1.1,JavaScript1.2,JavaScript1.3,JavaScript1.4,JScript,VBScript".splitcsv();

	// 少々面倒ではあるが、type="text/..." と language="..." の両方を考慮する。
	var attr = tag.values;
	var lang = "";
	var text = "";
	var type = false;
	if ("language" in attr)
	{
		// language="JavaScript" 形式で言語を指定している。
		lang = attr.language;
	}
	else if ("type" in attr)
	{
		// type="text/JavaScript" 形式で言語を指定している。
		type = true;
		lang = attr.type;
		if (/^([^\/]*\/)/.test(lang))
		{
			text = RegExp.lastMatch;
			lang = RegExp.rightContext;
		}
	}
	else if (type = HTML.scriptUseType)
	{
		// どちらもなければ、オプションに従う。
		text = "text/";
	}

	var template =
	[
		{ type: "COMBO",  name: "language", label: "言語(&L):", options: langs, x: 70, y: 5, width: 60, labelWidth: 65 },
		{ type: "COMBO",  name: "src",      label: "スクリプトファイル(&F):", y: 21, options: HTML.scriptHistory, width: 180 },
		{ type: "BUTTON", pair: "src",      label: "&...", x: 252, y: 21, width: 12, onClick: HTML.scriptChooser }
	];

	// [<script>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 269, 35, true);
	dialog.lang = lang;
	dialog.onOpen = function()
	{
		this.setValue("src", this.attr.src);
		this.setValue("language", this.lang);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<script>タグのプロパティを更新する。
	var res = dialog.results;
	lang = res.language.trim();
	if (type)
		tag.updateAttr("type", text || lang ? text + lang : "");
	else
		tag.updateAttr("language", lang);

	tag.updateByNames("src", res);
	HTML.updateHistory(HTML.scriptHistory, res.src);

	if (!attr.src && !tag.text)
	{
		// ソースファイル指定なしの挿入では、コメントも追加する。
		tag.postOpen = "\n<!--\n";
		tag.preClose = String.stricmp(lang, "VBScript") == 0 ? "\n'-->\n" : "\n//-->\n";
	}
	return true;
};


/////////////////////////////////////////////////////////////////////////////
// <STYLE> TAG EDITOR

function editStyle(tag)
{
	// <style type="text/css" src="..."> </style>
	var types = [ "text/css", "text/javascript" ];
	if (!tag.text)
		tag.setAttr("type", types[0]);

	var attr = tag.values;
	var template =
	[
		{ type: "COMBO", name: "type", label: "タイプ(&T):", options: types, x: 60, y: 5, width: 105, labelWidth: 55 },
		{ type: "COMBO", name: "media", label: "出力先(&M):", options: [ "all", "screen", "print" ]  },
		{ type: "CHECK", name: "disabled", label: "無効(&D)", value: "disabled" in attr }
	];

	// [<style>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 46, true, "type,media");
	if (dialog.open() != IDOK)
		return;

	tag.updateByNames("type,media,!disabled", dialog.results);
	if (!attr.src && !tag.text)
	{
		// ソースファイル指定なしの挿入では、コメントも追加する。
		tag.postOpen = "\n<!--\n";
		tag.preClose = "\n-->\n";
	}
	return true;
};


/////////////////////////////////////////////////////////////////////////////
// <ABBR>、<ACRONYM> TAG EDITOR

function editAbbrAcronym(tag)
{
	// <abbr>、<acronym> タグを編集する。
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "title", label: "タイトル(&T):", value: attr.title, x: 60, width: 160, labelWidth: 55 }
	];

	// [<abbr>、<acronym>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 19, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<abbr>、<acronym>タグのプロパティを更新する。
	tag.updateByNames("#title", dialog.results);
	return true;
};


/////////////////////////////////////////////////////////////////////////////
// <FRAMESET> TAG EDITOR

function editFrameset(tag)
{
	// <frameset> タグを編集する。
	// <frameset cols="..." or rows="..." frameborder=0/1 framespacing=10 bordercolor=red>
	var attr = tag.values;
	var border = (attr.frameborder == 1) || (String.stricmp(attr.frameborder, "yes") == 0);

	var template =
	[
		{ type: "GROUPBOX", label: "分割方法", width: 215, height: 50 },
		{ type: "BUTTON", label: "左右(&V):", value: HV, name: "HV", x: 12, y: 18, width: 40, style: BS_AUTORADIOBUTTON | WS_GROUP | WS_TABSTOP,
			onClick: function(dialog, control) { dialog.rowscols(); }},
		{ type: "BUTTON", label: "上下(&H):", x: 12, y: 34, width: 40, style: BS_AUTORADIOBUTTON,
			onClick: function(dialog, control) { dialog.rowscols(); }},
		{ type: "EDIT", name: "cols", value: attr.cols, x: 60, y: 18, width: 152, style: WS_GROUP },
		{ type: "EDIT", name: "rows", value: attr.rows, x: 60, y: 34, width: 152 },

		{ type: "GROUPBOX", x: 5, y: 60, width: 215, height: 50 },
		{ type: "CHECK", name: "frameborder", x: 10, y: 60, label: "境界線(&B)", value: border,
			onClick: function(dialog, control) { dialog.border(); }},
		{ type: "EDIT", name: "framespacing", x: 60, y: 73, width: 50, value: attr.framespacing, spin: [0, 1000], label: "境界の幅(&W):", labelWidth: 43, style: ES_NUMBER },
		{ type: "COMBO", name: "bordercolor", pair: "color", x: 60, y: 89, width: 50, label: "境界の色(&C):", options: HTML.listColorNames(), onChange: HTML.setColorToButton },
		{ type: "COLOR", name: "color", pair: "bordercolor", x: 115, y: 89, width: 30, style: HTML.colorPalette, onChange: HTML.setColorToCombo },
	];

	// [<frameset>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 105);
	dialog.onOpen = function()
	{
		// 各種初期値をセットする。
		var attr = this.attr;
		this.setValues("%bordercolor");
		this.setValue("HV", attr.cols || !attr.rows ? 0 : 1);
		this.rowscols();
		this.border();
	};
	dialog.rowscols = function()
	{
		// 上下/左右ラジオボタンの状態によって入力欄を有効/無効にする。
		var hv = this.getValue("HV");
		this.enableControl("cols", hv == 0);
		this.enableControl("rows", hv == 1);
	};
	dialog.border = function()
	{
		// [境界] チェックの状態によって影響するコントロールを有効/無効にする。
		var border = this.getValue("frameborder");
		var ctrls = [ "framespacing", "bordercolor", "color" ];
		for (var i in ctrls)
			this.enableControl(ctrls[i], border);
	};
	if (dialog.open() != IDOK)
		return;

	// 左右か上下かによって、cols か rows かのどちらか一方を設定し、
	// 他方を削除しなければならない。
	var ups = [ "frameborder", "framespacing", "bordercolor" ];
	var res = dialog.results;
	if (res.HV)
	{
		ups.unshift("rows");
		delete attr.cols;
	}
	else
	{
		ups.unshift("cols");
		delete attr.rows;
	}
	tag.updateByNames(ups, res);
	if (!tag.text)
		tag.setPostPre("\n", "\n");
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <FRAME> TAG EDITOR

function editFrame(tag)
{
	// <frame> タグを編集する。
	// <frame src="url" height="..." width="..." bordercolor="..." frameborder="..." marginheight="..."
	//  marginwidth="..." noresize scrolling="yes,no,auto" allowtransparency="true,false">

	var attr = tag.values;
	var border = (attr.frameborder == 1) || (String.stricmp(attr.frameborder, "yes") == 0);
	var scrolling = "auto,yes,no".splitcsv();
	HTML.separatePercent(attr);

	var template =
	[
		{ type: "COMBO", name: "src", label: "文章&URL:", options: HTML.hrefHistory, x: 60, y: 5, width: 190, labelWidth: 50 },
		{ type: "BUTTON", pair: "src", label: "&...", x: 253, y: 5, width: 12, onClick: HTML.onBrowseURL },
		{ type: "EDIT", name: "name", label: "フレーム名(&N):", value: attr.name, x: 60, y: 21, width: 90 },
		{ type: "GROUPBOX", label: "配置", length: 9, x: 5, y: 40, width: 260, height: 80,
			0: { type: "EDIT", name: "width", label: "横幅(&W):", value: attr.width,
				 x: 55, y: 12, width: 50, labelWidth: 50, spin: [0, 2000], style: ES_NUMBER },
			1: { type: "CHECK", name: "width_P", label: "%", value: attr.width_P, x: 110, y: 14 },
			2: { type: "EDIT", name: "marginwidth", label: "左右マージン(&Z):", value: attr.marginwidth,
				 x: 210, y: 12, width: 40, labelWidth: 55, spin: [0, 255], style: ES_NUMBER },
			3: { type: "EDIT", name: "height", label: "高さ(&H):", value: attr.height,
				 x: 55, y: 28, width: 50, labelWidth: 50, spin: [0, 2000], style: ES_NUMBER },
			4: { type: "CHECK", name: "height_P", label: "%", value: attr.height_P, x: 110, y: 30 },
			5: { type: "EDIT", name: "marginheight", label: "上下マージン(&V):", value: attr.marginheight,
				 x: 210, y: 28, width: 40, labelWidth: 55, spin: [0, 255], style: ES_NUMBER },
			6: { type: "COMBO", name: "scrolling", label: "スクロール(&S):",
				 x: 55, y: 44, width: 50, labelWidth: 50, options: scrolling },
			7: { type: "COMBO", name: "allowtransparency", label: "透明(&T):", x: 55, y: 60, options: [ "true", "false" ] },
			8: { type: "CHECK", name: "noresize", label: "リサイズ禁止(&R)", x: 155, y: 62, value: "noresize" in attr }
		},
		{ type: "GROUPBOX", x: 5, y: 124, width: 260, height: 33 },
		{ type: "CHECK", name: "frameborder", x: 10, y: 124, label: "境界線(&B)", value: border,
			onClick: function(dialog, control) { dialog.grayout(); }},
		{ type: "COMBO", name: "bordercolor", pair: "color", x: 60, y: 136, width: 50,
			label: "境界色(&C):", labelWidth: 50, options: HTML.listColorNames(), onChange: HTML.setColorToButton },
		{ type: "COLOR", name: "color", pair: "bordercolor", x: 115, y: 136, width: 30,
			style: HTML.colorPalette, onChange: HTML.setColorToCombo }
	];

	// [<frame>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 270, 152, false, "src,scrolling,allowtransparency,%bordercolor");
	dialog.grayout = function()
	{
		// [境界] チェックの状態によって影響するコントロールを有効/無効にする。
		var border = this.getValue("frameborder");
		var ctrls = [ "bordercolor", "color" ];
		for (var i in ctrls)
			this.enableControl(ctrls[i], border);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<frame>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res);
	tag.updateByNames("src,name,width,height,marginwidth,marginheight,frameborder,bordercolor,scrolling,allowtransparency,!noresize", res);
	HTML.updateHistory(HTML.hrefHistory, res.src);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <IFRAME> TAG EDITOR

function editIframe(tag)
{
	// <iframe> タグを編集する。
	// <iframe src="url" align="top,texttop,center,middle,absmiddle,bottom,baseline,absbottom,left,right"
	//	height=n% width=n% hspace=n vspace=n marginheight=n marginwidth=n allowtransparency="true,false"
	//	border=n bordercolor=color frameborder="1,0" framespacing=n scrolling="yes,no,auto">

	var aligns = "top,texttop,center,middle,absmiddle,bottom,baseline,absbottom,left,right".splitcsv();
	var scrolling = "auto,yes,no".splitcsv();
	var attr = tag.values;
	var border = (attr.frameborder == 1) || (String.stricmp(attr.frameborder, "yes") == 0);
	HTML.separatePercent(attr);

	var template =
	[
		{ type: "COMBO", name: "src", label: "文章&URL:", options: HTML.hrefHistory, x: 60, y: 5, width: 190, labelWidth: 50 },
		{ type: "BUTTON", pair: "src", label: "&...", x: 253, y: 5, width: 12, onClick: HTML.onBrowseURL },
		{ type: "EDIT", name: "name", label: "フレーム名(&N):", value: attr.name, x: 60, y: 21, width: 90 },
		{ type: "GROUPBOX", label: "配置", length: 9, x: 5, y: 40, width: 260, height: 80,
			0: { type: "COMBO", name: "align", label: "配置(&G):", options: aligns,
				 x: 55, y: 12, labelWidth: 50 },
			1: { type: "EDIT", name: "width", label: "横幅(&W):", value: attr.width,
				 x: 55, y: 12+16, width: 50, labelWidth: 50, spin: [0, 2000], style: ES_NUMBER },
			2: { type: "CHECK", name: "width_P", label: "%", value: attr.width_P, x: 110, y: 14+16 },
			3: { type: "EDIT", name: "marginwidth", label: "左右マージン(&Z):", value: attr.marginwidth,
				 x: 210, y: 12+16, width: 40, labelWidth: 55, spin: [0, 255], style: ES_NUMBER },
			4: { type: "EDIT", name: "height", label: "高さ(&H):", value: attr.height,
				 x: 55, y: 28+16, width: 50, labelWidth: 50, spin: [0, 2000], style: ES_NUMBER },
			5: { type: "CHECK", name: "height_P", label: "%", value: attr.height_P, x: 110, y: 30+16 },
			6: { type: "EDIT", name: "marginheight", label: "上下マージン(&V):", value: attr.marginheight,
				 x: 210, y: 28+16, width: 40, labelWidth: 55, spin: [0, 255], style: ES_NUMBER },
			7: { type: "COMBO", name: "scrolling", label: "スクロール(&S):",
				 x: 55, y: 44+16, width: 50, labelWidth: 50, options: scrolling },
			8: { type: "COMBO", name: "allowtransparency", label: "透明(&T):",
				 x: 210, y: 44+16, width: 40, labelWidth: 55, options: [ "true", "false" ] }
		},
		{ type: "GROUPBOX", x: 5, y: 124, width: 260, height: 33 },
		{ type: "CHECK", name: "frameborder", x: 10, y: 124, label: "境界線(&B)", value: border,
			onClick: function(dialog, control) { dialog.grayout(); }},
		{ type: "COMBO", name: "bordercolor", pair: "color", x: 60, y: 136, width: 50,
			label: "境界色(&C):", labelWidth: 50, options: HTML.listColorNames(), onChange: HTML.setColorToButton },
		{ type: "COLOR", name: "color", pair: "bordercolor", x: 115, y: 136, width: 30,
			style: HTML.colorPalette, onChange: HTML.setColorToCombo }
	];

	// [<iframe>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 270, 152, false, "src,align,scrolling,allowtransparency,%bordercolor");
	dialog.grayout = function()
	{
		// [境界] チェックの状態によって影響するコントロールを有効/無効にする。
		var border = this.getValue("frameborder");
		var ctrls = [ "bordercolor", "color" ];
		for (var i in ctrls)
			this.enableControl(ctrls[i], border);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<iframe>タグのプロパティを更新する。
	var res = dialog.results;
	HTML.combinePercent(res);
	tag.updateByNames("src,name,align,width,height,marginwidth,marginheight,frameborder,bordercolor,scrolling,allowtransparency", res);
	HTML.updateHistory(HTML.hrefHistory, res.src);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <BGSOUND> TAG EDITOR

function editBgsound(tag)
{
	// <bgsound src="..." loop="-1">
	var attr = tag.values;
	var template =
	[
		{ type: "COMBO",  name: "src", label: "サウンドファイル(&F):", x: 70, y: 5, options: HTML.soundHistory, width: 186, labelWidth: 65 },
		{ type: "BUTTON", pair: "src", label: "&...", x: 258, y: 5, width: 12, onClick: HTML.soundChooser },
		{ type: "EDIT",   name: "loop", label: "再生回数(&L):", value: attr.loop, x: 70, y: 21, width: 40, spin: [-1, 100], style: ES_NUMBER },
		{ type: "EDIT",   name: "volume", label: "ボリューム(&V):", value: attr.volume, spin: [ -10000, 0 ], style: ES_NUMBER },
		{ type: "EDIT",   name: "balance", label: "バランス(&B):", value: attr.balance, spin: [ -10000, 10000 ], style: ES_NUMBER },
		{ type: "STATIC", x: 115, y: 24, value: "(-1で無限回の繰り返し)" }
	];

	// [<bgsound>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 275, 67, true, "src");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<bgsound>タグのプロパティを更新する。
	tag.updateByNames("src,loop,volume,balance", dialog.results);
	HTML.updateHistory(HTML.soundHistory, dialog.results.src);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <INS><DEL> TAG EDITOR

function editInsDel(tag)
{
	// <ins>、<del> タグを編集する。
	// <ins cite="url" datetime="1999-12-31T23:59:59+09:00">
	// <del cite="url" datetime="1999-12-31T23:59:59+09:00">

	var elem = tag.elementName.toLowerCase();
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "datetime", label: elem == "ins" ? "挿入日時(&D):" : "削除日時(&D):",
			x: 50, y: 5, width: 150, labelWidth: 45, value: attr.datetime },
		{ type: "BUTTON", label: "現在時刻(&N)", x: 205, y: 5, width: 50,
			onClick: function(dialog, control)
			{
				var date = new Date();
				var parts = date.toString().split(" ");
				dialog.setValue("datetime", date.format("%Y-%#m-%#d") + "T" + parts[3] + parts[4].substr(3));
			}
		},
		{ type: "COMBO", name: "cite", label: elem == "ins" ? "挿入理由(&C):" : "削除理由(&C):",
			options: HTML.hrefHistory, x: 50, y: 21, width: 150, labelWidth: 45 },
		{ type: "BUTTON", pair: "cite", label: "参照(&B)...", x: 205, y: 21, width: 50,
			onClick: HTML.onBrowseURL }
	];

	// [<ins>タグ編集]、[<del>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 260, 35, true, "cite");
	if (dialog.open() != IDOK)
		return;

	// 結果をタグに反映させる。
	tag.updateByNames("datetime,cite", dialog.results);
	HTML.updateHistory(HTML.hrefHistory, dialog.results.cite);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <FORM> TAG EDITOR

// ---- ▼ 2007/10/29 Rocksam Edited ▼ ----
function editForm(tag)
{
	// <form name="..." action="..." method="post,get" enctype="...">
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT",   name: "name",    label: "名前(&N):", value: attr.name, x: 50, width: 75, labelWidth: 45 },
		{ type: "COMBO",  name: "action",  label: "アクション(&C):", width: 198, options: HTML.hrefHistory },
		{ type: "BUTTON", pair: "action",  label: "&...", x: 250, y: 21, width: 12, onClick: HTML.onBrowseURL },
		{ type: "COMBO",  name: "method",  label: "メソッド(&M):", options: [ "get", "post" ], x: 50, width: 75 },
		{ type: "COMBO",  name: "enctype", label: "enctype(&E):", options: [ "multipart/form-data", "text/plane", "application/x-www-form-urlencoded" ] },
	];

	// [<form>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 267, 66, true, "action,method");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<form>タグのプロパティを更新する。
	tag.updateByNames("name,action,method,enctype", dialog.results);
	tag.setPostPre("\n", "\n");
	HTML.updateHistory(HTML.hrefHistory, dialog.results.action);
	return true;
}
// ---- ▲ 2007/10/29 Rocksam Edited ▲ ----


/////////////////////////////////////////////////////////////////////////////
// <SELECT><OPTION> TAG EDITOR

function editSelect(tag)
{
	// <select name="..." accesskey="." align="..." disabled multiple size=n tabindex=n>
	var items = [ ];
	var endat = null;

	var vw = tag.editor;
	if (vw && tag.text)
	{
		// タグ編集の場合は、ポイント tag[1] から </select> までの間にある
		// <option></option>を拾い上げてoptionリストも編集できるようにする。

		var next, item;
		for (var pt = tag[1]; next = vw.htmlGetNextTag(pt); pt = next[1])
		{
			endat = next[0];
			if (item)
			{
				// <option>... と次のタグの間のテキストを保存する。そのとき、
				// 文字とその後に続くスペースとを分離して記憶する。編集でき
				// るのは文字の部分だけで、スペースはタグを再度挿入するとき
				// のために使う。 また itwas は、value が変更されたかどうか
				// を判定するために使う。

				var text = vw.getTextBetween(item.tag[1], endat);
				item[1].itwas =
				item[1].value = text.trimRight();
				item[1].space = text.substr(item[1].value.length);

				item.tag[2] = endat;
				item = null;
			}

			// <!DOCTYPE なんてのがあると、エレメント名なしでエラーになる。
			if (!next.elementName)
				continue;
			var elem = next.elementName.toLowerCase();
			if (elem == "select" && next.type == 2)
				break;
			if (elem != "option")
				continue;

			if (next.type == 1)
			{
				// <option .... > のタグアイテムを作成する。
				var option = HtmlTag.parse(vw, next[0]);
				item = [
					{ value: option.values.value, edit: true },
					{ value: "", edit: true },
					{ check: "selected" in option.values },
					{ check: "disabled" in option.values }
				];
				item.tag = option;
				items.push(item);
			}
		}
	}

	// 新規option追加ようの空アイテムを最後に追加する。
	items.push([{ edit: true }, { edit: true }]);

	var attr = tag.values;
	var aligns = "left,center,right".splitcsv();
	var header = [[ "値", 80 ], [ "テキスト", 222 ], ["選択", 40], [ "無効", 40 ]];
	var template =
	[
		// 最初は、<select>タグ自身の属性
		{ type: "EDIT", name: "name", label: "名前(&N):", value: attr.name, x: 50, y: 5, width: 95, labelWidth: 45 },
		{ type: "COMBO", name: "align", label: "配置(&G):", options: aligns, x: 50, y: 21 },
		{ type: "CHECK", name: "multiple", label: "複数選択(&M)", value: "multiple" in attr, x: 160, y: 7 },
		{ type: "CHECK", name: "disabled", label: "無効(&I)", value: "disabled" in attr, x: 160, y: 23 },
		{ type: "EDIT", name: "size", label: "サイズ(&S):", value: attr.size, x: 50, y: 37, width: 25, spin: [1, 100], style: ES_NUMBER },
		{ type: "EDIT", name: "tabindex", label: "タブ順(&B):", value: attr.tabindex, x: 120, y: 37, width: 25, labelWidth: 32, spin: [1,100], style: ES_NUMBER },
		{ type: "EDIT", name: "accesskey", label: "アクセスキー(&K):", value: attr.accesskey, x: 215, y: 37, width: 20, labelWidth: 55 },

		// ここからオプションリスト
		{ type: "STATIC", x: 5, y: 58, width: 230, height: 1, style: SS_BLACKFRAME | SS_SUNKEN },
		{ type: "STATIC", value: "オプション(&O):", x: 5, y: 65 },
		{ type: "TREELIST", name: "options", value: items, x: 5, y: 75, width: 230, height: 184, header: header, style: TLS_NOBUTTONSPACE,
			onChange: function(dialog, control)
			{
				// 最後に何か入力されたら、さらに新規の入力用項目を追加する。
				var count = dialog.getCount(control);
				var item = dialog.getItem(control, count - 1);
				if (item && (item[0].value || item[1].value))
				{
					// selected と disabled のチェックを追加する。
					item[2] = { check: false };
					item[3] = { check: false };

					// 次の新規アイテムを追加する。
					dialog.addItem(control, [{ edit: true }, { edit: true }]);
				}
			}
		},

		// [+] (追加)ボタン
		{ type: "BUTTON", label: "&+", x: 215, y: 65, width: 9, height: 9,
			onClick: function(dialog, control)
			{
				// 新規アイテムを追加する。
				var opts = dialog.controls.options;
				var item = dialog.getCurSel(opts);
				var index = item
							? dialog.addItem(opts, [{ edit: true }, { edit: true }, { check: false }, { check: false }], item)
							: dialog.getCount(opts) - 1;
				dialog.setCurSel(opts, index);
				dialog.gotoControl(opts);
			}
		},

		// [-] (削除)ボタン
		{ type: "BUTTON", label: "&-", x: 225, y: 65, width: 9, height: 9,
			onClick: function(dialog, control)
			{
				// 選択されているアイテムを削除する。
				// ただし、最後のは常に新規アイテムなので削除しない。
				// 既存のアイテムを削除した場合は、削除リストに入れる。

				var opts = dialog.controls.options;
				var item = dialog.getCurSel(opts);
				if (item && item[2])
				{
					dialog.deleteItem(opts, item);
					if (item.tag)
						dialog.dellist.push(item);
				}
				else
					beep();
			}
		},
	];

	// [<select>タグ編集]ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 240, 259, true, "align");
	dialog.dellist = [ ];
	dialog.onOK = function()
	{
		// 独自にoption項目の配列を作成する。
		var opts = this.controls.options;
		var count = this.getCount(opts) - 1;
		var optlist = [ ];
		for (var i = 0; i < count; i++)
			optlist.push(this.getItem(opts, i));

		// options項目の配列とダイアログの結果を保存する。
		this.optlist = optlist;
		this.results = this.saveValues();
		return true;
	};
	if (dialog.open() != IDOK)
		return;

	// 結果をタグに反映させる。
	tag.updateByNames("name,accesskey,align,size,tabindex,!multiple,!disabled", dialog.results);
	tag.setPostPre("\n", "\n");
	var optlist = dialog.optlist;

	if (endat)
	{
		// Option タグ群を後ろから順番に(※)修正する。
		// NOTE: ※前から修正すると後ろのoptionsの位置が変化してしまうため。
		// NOTE: 修正、挿入、削除されたoptionタグの順序を乱さないようにしながら
		// 編集する必要があるため、かなり面倒なことになっている。

		// 削除されたoptionタグを出現順にソートし、後ろから順番に使う。
		var dellist = dialog.dellist;
		dellist.sort(function(item1, item2) { return HTML.comparePoints(item1.tag[0], item2.tag[0]); });
		var dellast = dellist.pop();

		var index = optlist.length;
		var space;

		while (--index >= 0)
		{
			item = optlist[index];
			var orgtag = item.tag;

			if (orgtag)
			{
				// 既存のタグが修正された。
				// まずこのタグより後ろで削除されているoptionタグを取り除く。
				while (dellast && HTML.comparePoints(dellast.tag[0], orgtag[0]) < 0)
				{
					vw.deleteTextBetween(dellast.tag[0], dellast.tag[2] || dellast.tag[1]);
					dellast = dellist.pop();
				}

				if (item[1].value != item[1].itwas)
				{
					// optionタグと次のタグとの間の部分が修正された。
					vw.replaceTextBetween(orgtag[1], orgtag[2] || orgtag[1], item[1].value + item[1].space);
				}

				if (item[0].value != orgtag.values.value			||
					item[2].check != ("selected" in orgtag.values)	||
					item[3].check != ("disabled" in orgtag.values))
				{
					// optionタグ内が修正されていたら更新する。
					orgtag.updateAttr("value",    item[0].value);
					orgtag.updateFlag("selected", item[2].check);
					orgtag.updateFlag("disabled", item[3].check);
					vw.replaceTextBetween(orgtag[0], orgtag[1], orgtag.compose());
				}

				// 新規option挿入のために役に立つ(かもしれない)情報を保存しておく。
				space = item[1].space;
				endat = orgtag[0];
			}
			else
			{
				// 新規に挿入されたoptionタグ
				orgtag = new HtmlTag("option");
				orgtag.updateAttr("value",    item[0].value);
				orgtag.updateFlag("selected", item[2].check);
				orgtag.updateFlag("disabled", item[3].check);

				// オプション設定により </option> 閉じタグも追加する。
				vw.insertTextAt(endat || vw.EOF, orgtag.compose() + (item[1].value || "") +
								 HtmlTag.getTagText("option", 2) + (space || vw.getNewline()));
			}
		}

		// 残っている削除アイテムを削除する。
		while (dellast)
		{
			vw.deleteTextBetween(dellast.tag[0], dellast.tag[2] || dellast.tag[1]);
			dellast = dellist.pop();
		}
	}
	else if (optlist.length > 0)
	{
		// <select>文挿入の場合は、タグ挿入後に <option>...</option> タグ群を挿入する。
		tag.optlist = dialog.optlist;
		tag.postProcess = HTML.postInsertOptions;
	}

	// 最後に true を返して select タグ自体を修正する。
	return true;
}

HTML.postInsertOptions = function(tag, vw)
{
	// 新規に<select></select>挿入した後、<option>タグを追加挿入する。
	var sel = vw.getSelection();
	var text = sel[1].index ? vw.getNewline() : "";

	var optlist = tag.optlist;
	for (var i in optlist)
	{
		// <option> 開始タグを作成する。
		var item = optlist[i];
		var opttag = new HtmlTag("option");
		opttag.updateAttr("value",    item[0].value);
		opttag.updateFlag("selected", item[2].check);
		opttag.updateFlag("disabled", item[3].check);

		// オプション設定により </option> 閉じタグも追加する。
		text += (i ? vw.getNewline() : "") + opttag.compose() + (item[1].value || "") + HtmlTag.getTagText("option", 2);
	}

	// 現在の選択範囲の最後に挿入し、選択範囲もその分だけ広げる。
	if (text)
	{
		vw.setSelection(sel[1], sel[1]);
		vw.insertText(text);
		sel[1] = vw.CP;
		vw.setSelection(sel);
	}
};


/////////////////////////////////////////////////////////////////////////////
// <OPTION> TAG EDITOR

function editOption(tag)
{
	// <option value="..." disabled selected label="...">.....
	// こちらは、option 単体で編集する。

	HTML._getTextAfterTag(tag);
	var vw = tag.editor;
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "after", label: "テキスト(&T):", value: tag.after, x: 45, width: 200, labelWidth: 40 },
		{ type: "EDIT", name: "label", label: "ラベル(&L):", value: attr.label },
		{ type: "EDIT", name: "value", label: "値(&V):", value: attr.value, width: 90  },
		{ type: "CHECK", name: "selected", label: "選択(&S)", value: "selected" in attr, x: 150, y: 40 },
		{ type: "CHECK", name: "disabled", label: "無効(&D)", value: "disabled" in attr, x: 195, y: 40 }
	];

	// [<option>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 250, 51, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<option>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("value,label,!selected,!disabled", res);

	// <option>後のテキストを更新する。
	if (tag.after != res.after)
		HTML._putTextAfterTag(tag, res.after);
	return true;
}

HTML._getTextAfterTag = function(tag)
{
	// 次のタグとの間の文字列を取得し、文字とその後に続く空白に分解する。
	var vw = tag.editor;
	var text = "";
	if (!tag.text)
	{
		// 新規 <option> タグの挿入では、選択範囲を取得する。
		text = vw.getSelectedText();
	}
	else if (tag[1])
	{
		// 既存 <option> タグの編集では、次タグとの間のテキストを取得する。
		var next = vw.htmlGetNextTag(tag[1]);
		tag[2] = next ? next[0] : vw.EOF;
		text = vw.getTextBetween(tag[1], tag[2]);
	}

	// 文字とその後に続く空白を分け、文字の部分だけを編集対象とする。
	tag.after = text.trimRight();
	tag.space = text.substr(tag.after.length);
	return text;
};

HTML._putTextAfterTag = function(tag, text)
{
	// 次のタグとの間のテキストを更新する。
	var vw = tag.editor;
	if (!vw)
		return;

	if (!tag.text)
	{
		// 新規 <option> タグ挿入では、選択範囲を置き換える。
		var sel = vw.getSelection();
		vw.insertText(text + tag.space);
		sel[1] = vw.CP;
		vw.setSelection(sel);
	}
	else if (tag[1])
	{
		// 既存の option タグ編集で、タグに続くテキストが編集された。
		vw.replaceTextBetween(tag[1], tag[2], text + tag.space);
	}
};


/////////////////////////////////////////////////////////////////////////////
// <OPTGROUP> TAG EDITOR

function editOptgroup (tag)
{
	// <optgroup label="....." disabled>
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "label", label: "ラベル(&L):", value: attr.label, x: 60, width: 160, labelWidth: 55 },
		{ type: "CHECK", name: "disabled", label: "無効(&D)", value: "disabled" in attr }
	];

	// [<optgroup>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 32, true);
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<optgroup>タグのプロパティを更新する。
	tag.updateByNames("label,!disabled", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <INPUT> TAG EDITOR

function editInput(tag)
{
	// <input name="..." type="text,password,file,checkbox,radio,hidden,submit,reset,button,image"
	//	size="n" value="default" checked maxlength=maxch accesskey="A" tabindex=10 >
	//
	// type:
	//	text		-->	autocomplete=on,off maxlength=n readonly size=n value="..."
	//	password	-->	autocomplete=on,off maxlength=n readonly size=n value="..."
	//	file		-->	(accept=accept)     maxlength=n          size=n
	//	checkbox	-->	checked value="..."
	//	radio		-->	checked value="..."
	//	hidden		-->	value="..."
	//	submit		-->	value="..."
	//	reset		-->	value="..."
	//	button		-->	value="..."
	//	image		-->	align="left,center,right" alt="..." border="pixel" width="50" height="10" src="url" lowsrc="url"

	var types = "text,password,file,checkbox,radio,hidden,submit,reset,button,image".splitcsv();
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT",  name: "name",			label: "名前(&N):", value: attr.name, x: 45, width: 85, labelWidth: 40 },
		{ type: "COMBO", name: "type",			label: "タイプ(&T):", options: types, onChange: function(dialog, control) { dialog.grayout(); }},
		{ type: "EDIT",  name: "value",			label: "値(&V):", value: attr.value, width: 225 },
		{ type: "EDIT",  name: "size",			label: "サイズ(&S):", value: attr.size, x: 45, y: 55, width: 30, spin: [1, 100], style: ES_NUMBER },
		{ type: "EDIT",  name: "maxlength",		label: "最大文字数(&M):", value: attr.maxlength, x: 150, y: 55, labelWidth: 50, spin: [1, 1000], style: ES_NUMBER  },
		{ type: "COMBO", name: "autocomplete",	label: "入力補完(&C):", options: [ "on", "off" ], x: 240, y: 55, labelWidth: 40 },
		{ type: "CHECK", name: "checked",		label: "チェック(&K)", value: "checked"  in attr, x: 200, y:  8 },
		{ type: "CHECK", name: "readonly",		label: "編集禁止(&R)", value: "readonly" in attr, x: 200, y: 20 },

		{ type: "GROUPBOX", name: "group",		label: "ボタンイメージ", x: 5, y: 75, width: 265, height: 98 },
		{ type: "COMBO",  name: "src",			label: "イメージファイル(&I):", options: HTML.imageHistory, x: 70, y: 87, width: 168, labelWidth: 60 },
		{ type: "BUTTON", name: "srcbr",		label: "&...", pair: "src", x: 240, y:  87, width: 12, onClick: HTML.imageChooser },
		{ type: "BUTTON", name: "srcvw",		label: "&?", pair: "src", x: 252, y:  87, width: 12, onClick: HTML.imageViewer },
		{ type: "COMBO",  name: "lowsrc",		label: "粗いイメージ(&O):", options: HTML.imageHistory, x: 70, y: 103  },
		{ type: "BUTTON", name: "lowbr",		label: "...", pair: "lowsrc", x: 240, y: 103, width: 12, onClick: HTML.imageChooser },
		{ type: "BUTTON", name: "lowvw",		label: "?", pair: "lowsrc", x: 252, y: 103, width: 12, onClick: HTML.imageViewer },
		{ type: "EDIT",  name: "alt",			label: "代替テキスト(&L):", value: attr.alt, x: 70, y: 119, width: 194 },
		{ type: "EDIT",  name: "width",			label: "幅(&W):", value: attr.width, width: 40, spin: [1, 255], style: ES_NUMBER },
		{ type: "EDIT",  name: "height",		label: "高さ(&H):", value: attr.height, spin: [1, 255], style: ES_NUMBER },
		{ type: "COMBO", name: "align",			label: "配置(&G):", options: [ "left", "center", "right" ], x: 200, y: 135, width: 64, labelWidth: 40 },
		{ type: "EDIT",  name: "border",		label: "境界線(&B):", value: attr.border, spin: [0, 25], style: ES_NUMBER },
	];

	// [<input>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 275, 168, false, "type,autocomplete,src,lowsrc,align");

	// type=... の値によって必要なコントロールだけを有効にするための
	// テーブルと関数を、ダイアログボックスのプロパティとして追加する。
	dialog.values = "value,size,maxlength,autocomplete,checked,readonly,src,lowsrc,alt,width,height,align,border,group,srcbr,srcvw,lowbr,lowvw".splitcsv();
	dialog.valids = {
		text:		0x0002f,
		password:	0x0002f,
		file:		0x00006,
		checkbox:	0x00011,
		radio:		0x00011,
		hidden:		0x00001,
		submit:		0x00001,
		reset:		0x00001,
		button:		0x00001,
		image:		0x3ffc0
	};
	dialog.grayout = function()
	{
		// タイプによって必要ないコントロールを無効化する。
		var mask = this.valids[ this.getValue("type").trim().toLowerCase() || "text" ] || 0;
		for (var i = 0; i < this.values.length; i++, mask >>= 1)
			this.enableControl(this.values[i], mask & 1);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<input>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("name,type,value,size,maxlength,autocomplete,src,lowsrc,#alt,width,height,align,border,!readonly,!checked", res);
	HTML.updateHistory(HTML.imageHistory, res.lowsrc);
	HTML.updateHistory(HTML.imageHistory, res.src);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <TEXTAREA> TAG EDITOR

function editTextarea(tag)
{
	// <textarea name="..." rows=n cols=m wrap="off,soft,hard" readonly
	//	align="left,right,center" tabindex="" accesskey="A">
	var wrapmodes = "off,soft,hard".splitcsv();
	var aligns = "left,center,right".splitcsv();
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT",  name: "name",      label: "名前(&N):", value: attr.name, x: 60, y: 5, width: 100, labelWidth: 55 },
		{ type: "CHECK", name: "readonly",  label: "編集禁止(&O)", value: "readonly" in attr, x: 170, y: 7, width: 50 },
		{ type: "EDIT",  name: "rows",      label: "行数(&R):", value: attr.rows, spin: [1, 100], style: ES_NUMBER, x: 60, y: 27, width: 30 },
		{ type: "EDIT",  name: "cols",      label: "桁数(&C):", value: attr.cols, spin: [1, 100], style: ES_NUMBER },
		{ type: "EDIT",  name: "tabindex",  label: "タブ順(&B):", value: attr.tabindex, spin: [1,100], style: ES_NUMBER },
		{ type: "COMBO", name: "wrap",      label: "折り返し(&W):", x: 170, y: 27, width: 50, labelWidth: 55, options: wrapmodes },
		{ type: "COMBO", name: "align",     label: "配置(&G):", options: aligns },
		{ type: "EDIT",  name: "accesskey", label: "アクセスキー(&K):", value: attr.accesskey, width: 25 }
	];

	// [<textarea>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 73, true, "wrap,align");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<textarea>タグのプロパティを更新する。
	tag.updateByNames("name,rows,cols,wrap,align,tabindex,accesskey,!readonly", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <BUTTON> TAG EDITOR

function editButton(tag)
{
	// <button type="button,submit,reset" onclick="alert('OK')" value="..."
	//	accesskey="a" tabindex=5 disabled>LabelText</button>

	HTML._getTextAfterTag(tag);
	var attr = tag.values;
	var template =
	[
		{ type: "COMBO", name: "type", label: "タイプ(&T):", options: [ "button", "submit", "reset" ], x: 60, labelWidth: 55 },
		{ type: "CHECK", name: "disabled", label: "無効(&D)", value: "disabled" in attr, x: 180, y: 7 },
		{ type: "EDIT",  name: "after", label: "ラベル(&L):", value: tag.after, x: 60, y: 21, width: 160 },
		{ type: "EDIT",  name: "onclick", label: "クリック(&C):", value: attr.onclick },
		{ type: "EDIT",  name: "value", label: "値(&V):", value: attr.value },
		{ type: "EDIT",  name: "tabindex", label: "タブ順(&B):", value: attr.tabindex, width: 30, spin: [1, 100], style: ES_NUMBER },
		{ type: "EDIT",  name: "accesskey", label: "アクセスキー(&K):", value: attr.accesskey, x: 190, y: 69, labelWidth: 55 }
	];

	// [<button>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 83, true, "type");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<button>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("type,onclick,value,tabindex,accesskey,!disabled", res);

	// 次のタグとの間のラベル文字列を更新する。
	if (res.after != tag.after)
		HTML._putTextAfterTag(tag, res.after);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <LABEL> TAG EDITOR

function editLabel(tag)
{
	// <label for="..." accesskey="A">
	HTML._getTextAfterTag(tag);
	var names = HTML._pickupNames(tag.editor);

	var attr = tag.values;
	var template =
	[
		{ type: "EDIT",  name: "after",		label: "ラベル(&L)", value: tag.after, x: 60, width: 160, labelWidth: 55 },
		{ type: "COMBO", name: "for",		label: "名前(&F):", options: names },
		{ type: "EDIT",  name: "accesskey",	label: "アクセスキー(&K):", value: attr.accesskey, width: 20 }
	];

	// [<label>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 51, true);
	dialog.onOpen = function()
	{
		// 既に for="name" と名前がセットされていればその名前に、
		// セットされていなければ拾い集めた最初の名前を設定する。
		var name = this.attr["for"];
		if (name)
			this.setValue("for", name);
		else
			this.setValue("for", 0, true);
	};
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<label>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("for,accesskey", res);

	// 次のタグとの間のラベル文字列を更新する。
	if (res.after != tag.after)
		HTML._putTextAfterTag(tag, res.after);
	return true;
}

HTML._pickupNames = function(vw, pt)
{
	// pt 以後にある name の値を拾い集め、出現順に返す。
	// pt が指定されていないときは、現在のカーソル位置から後を探す。
	// NOTE: 重複している名前があっても1つしか拾わない。

	var names = [ ];
	var check = { };
	if (!pt)
		pt = vw.CP;

	for ( ; pt = vw.htmlGetNextTag(pt); pt = pt[1])
	{
		var tag = HtmlTag.parse(vw, pt[0]);
		var name = tag.values.name;
		if (name && !check[name])
		{
			names.push(name);
			check[name] = true;
		}
	}
	return names;
};


/////////////////////////////////////////////////////////////////////////////
// <FIELDSET> TAG EDITOR

function editFieldset(tag)
{
	// <fieldset align="left,center,right,top,texttop,middle,absmiddle,bottom,baseline,absbottom">
	var template =
	[
		{ type: "COMBO", name: "align", label: "配置(&G):", x: 60, labelWidth: 55,
		  options: "left,center,right,top,texttop,middle,absmiddle,bottom,baseline,absbottom".splitcsv() }
	];

	// [<fieldset>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 19, true, "align");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<fieldset>タグのプロパティを更新する。
	tag.updateByNames("align", dialog.results);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <LEGEND> TAG EDITOR

function editLegend(tag)
{
	// <legend align="top,bottom,left,right,center" accesskey="K">
	HTML._getTextAfterTag(tag);
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "after", label: "見出し(&L):", value: tag.after, x: 60, width: 160, labelWidth: 55 },
		{ type: "COMBO", name: "align", label: "配置(&G):", width: 50, options: "top,bottom,left,right,center".splitcsv() },
		{ type: "EDIT", name: "accesskey", label: "アクセスキー(&K):", value: attr.accesskey, width: 20 }
	];

	// [<legend>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 51, true, "align");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<legend>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("align,accesskey", res);

	// 次のタグとの間のラベル文字列を更新する。
	if (res.after != tag.after)
		HTML._putTextAfterTag(tag, res.after);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// <OBJECT> TAG EDITOR



/////////////////////////////////////////////////////////////////////////////
// <APPLET> TAG EDITOR



/////////////////////////////////////////////////////////////////////////////
// <PARAM> TAG EDITOR

function editParam(tag)
{
	// <param name="..." value="..." valuetype="..." type="...">
	var types = "text/html,text/plain,image/gif,image/jpeg,text/javascript,text/css".splitcsv();
	var attr = tag.values;
	var template =
	[
		{ type: "EDIT", name: "name", label: "名前(&N):", value: attr.name, x: 60, width: 160, labelWidth: 55 },
		{ type: "EDIT", name: "value", label: "値(&V):", value: attr.value },
		{ type: "COMBO", name: "type", label: "タイプ(&T):", options: types, width: 50 },
		{ type: "COMBO", name: "valuetype", label: "値のタイプ(&Y):", options: "data,ref,object".splitcsv(), x: 170, y: 37, labelWidth: 45 }
	];

	// [<param>タグ編集] ダイアログボックスを表示する。
	var dialog = HTML.newTagDialog(tag, template, 225, 51, true, "type,valuetype");
	if (dialog.open() != IDOK)
		return;

	// 結果に従い<param>タグのプロパティを更新する。
	var res = dialog.results;
	tag.updateByNames("name,value,type,valuetype", res);
	return true;
}


/////////////////////////////////////////////////////////////////////////////
// 固有属性を持たないタグのエディタ -> 一般属性だけが編集対象
// おおよそ以下のタグが固有属性を持たないタグとして扱う。
//
//	<address>、<b>、<bdo>、<big>、<blink>、<center>、<cite>、
//	<code>、<em>、<i>、<kbd>、<nobr>、<noframes>、<noscript>、
//	<rb>、<rp>、<rt>、<ruby>、<s>、<samp>、<small>、<strike>、
//	<strong>、<sub>、<sup>、<title>、<tt>、<u>、<var>、<wbr>、
//	<xmp>、<dfn>、<dd>、<dt>、<span>
//

HTML.editGeneral = function(tag)
{
	// 一般属性のエディタで代用する。
	return HTML.doEditTagGeneral(tag.editor, tag);
};


/////////////////////////////////////////////////////////////////////////////
// Insert/delete <br> tag

HTML.insertLineBreaks = function(vw, sel)
{
	// <br> を追加し、次の行へカーソルを移動させる。
	// 範囲が選択されているときは、範囲中の各行の最後へ挿入する。

	var text = HtmlTag.getTagText("br");
	if (!sel)
		sel = vw.getSelection();
	var line = sel[0].line;
	var last = sel[1].line;
	if (line < last && sel[1].index == 0)
		last--;

	while (line <= last)
		vw.insertTextAt(EP(line++, 65000), text);
	if (sel.direction == 0)
		vw.gotoPoint(last + 1);
};

HTML.deleteLineBreaks = function(vw, sel)
{
	// カーソル行の最後にある改行タグ<br>を削除する。
	// 範囲が選択されているときは、範囲中の各行末の<br>タグを削除する。

	if (!sel)
		sel = vw.getSelection();
	var line = sel[0].line;
	var last = sel[1].line;
	if (line < last && sel[1].index == 0)
		last--;

	while (line <= last)
	{
		var length = vw.getLineLength(line);
		var point = EP(line, length);
		var text = vw.getTextAt(point, -4);
		if (String.stricmp(text, "<br>") == 0)
			vw.deleteTextAt(point, -4);
		line++;
	}
	if (sel.direction == 0)
		vw.gotoPoint(last + 1);
};


/////////////////////////////////////////////////////////////////////////////
// HTML.editColor() and HTML.insertColor() - カラー編集

HTML.editColor = function(vw)
{
	// カーソル位置のカラーを表示・編集する。
	if (!vw)
		return;

	// カーソル位置のカラー名とカラー値を取得する。
	vw.selectWord();
	var cname = vw.getSelectedText().trim();
	var color = cname ? HTML.swapRGB(HTML.getColorValue(cname)) : undefined;

	// ダイアログボックスを表示する。
	var res = HTML.openColorDialog("色の編集", color, cname);
	if (!res)
		return;

	// 色が修正されても編集禁止ならば変更できない。
	var text = res.combo;
	if (String.strcmp(cname, text) == 0)
		return;

	// 編集禁止では置換できない(色の確認は可能)。
	if (vw.getReadOnly())
		error("編集禁止です.");

	// 修正された色情報を選択している部分と置換し、その部分を再び選択する。
	vw.insertText(text);
	vw.charLeft(text.length, true);
};

HTML.insertColor = function()
{
	// 選択されている部分のテキストの色を変える<font>タグを挿入する。
	var res = HTML.openColorDialog("色の挿入");
	if (res)
	{
		// 結果を <font> タグとして挿入する。
		var tag = new HtmlTag("font");
		tag.setAttr("color", res.combo);
		HTML.insertTag(tag, true);
	}
};

HTML.openColorDialog = function(title, color, name)
{
	// 色を選択するためのダイアログボックスを開く。
	if (color === undefined)
		color = HTML.lastColor;
	if (color === undefined)
		color = 0;
	if (!name)
		name = HTML.getColorName(HTML.swapRGB(color));

	// ダイアログボックスのテンプレート。
	var template =
	[
		{	type: "COMBO", name: "combo", pair: "color", label: "カラー値(&V):",
			x: 45, width: 80, labelWidth: 40, options: HTML.listColorNames(),
			onChange: function (dialog, control)
			{
				var color = HTML.setColorToButton(dialog, control);
				dialog.showRGB(color);
			}
		},
		{	type: "COLOR", name: "color", pair: "combo", value: color,
			x: 5, width: 120, height: 60, style: HTML.colorPalette,
			onChange: function (dialog, control)
			{
				var color = HTML.setColorToCombo(dialog, control);
				dialog.showRGB(color);
			}
		}
	];

	// [色のＸＸ] ダイアログボックスを表示する。
	var dialog = new Dialog(title, template);
	dialog.addOkCancel = Dialog.ADD_OKCANCELLINE;
	dialog.name = name;
	dialog._title = title;
	dialog.showRGB = function(color)
	{
		this.setTitle(sprintf("%s - RGB: %d %d %d", this._title,
							  (color >> 16) & 0x00ff, (color >> 8) & 0x00ff, color & 0x00ff));
	};
	dialog.onOpen = function()
	{
		this.setValue("combo", this.name);
		this.showRGB(HTML.getColorValue(this.name));
	};

	if (dialog.open() != IDOK)
		return;

	// 結果を返す。
	var res = dialog.results;
	HTML.lastColor = res.color;
	return res;
};


/////////////////////////////////////////////////////////////////////////////
// HTML - dialog helpers and callbacks

HTML.newTagDialog = function(tag, template, width, height, bar, combos)
{
	// HTML タグを編集するための Dialog オブジェクトを作成する。
	var name = tag.text
				? HtmlTag.formatElementName(tag.elementName)
				: HtmlTag.formatNewElementName(tag.elementName);
	var title = HTML.tagTitles[ name.toLowerCase() ] || "";
	title = (title ? title + " - " : "") + "<" + name + ">タグの" + (tag.text ? "編集" : "挿入");

	var dialog	= new Dialog(title, template);
	dialog.tag	= tag;
	dialog.attr	= tag.values;

	// [一般属性]、[OK]、[キャンセル]、[ヘルプ]ボタンを追加する。
	// NOTE: 横幅は最低 225 必要。
	if (width < 225)
		width = 225;

	height += 5;
	if (bar)
		template.push({ type: "STATIC", x: 5, y: height, width: width - 10, height: 1, style: SS_BLACKFRAME | SS_SUNKEN });

	height += 5;
	template.push(
		{ type: "BUTTON", label: "一般属性(&A)", x: 5, y: height, width: 50, height: 14, onClick: HTML.onEditTagStyle },
		{ type: "BUTTON", id: IDOK,     label: "OK", x: width - 165, y: height, style: BS_DEFPUSHBUTTON },
		{ type: "BUTTON", id: IDCANCEL, label: "キャンセル", x: width - 110, y: height },
		{ type: "BUTTON", id: 0xE146,   label: "ヘルプ(F1)", x: width - 55, y: height });

	// TAG エディタ専用のメソッドを追加する。
	dialog.onHelp = function()
	{
		return HTML.showTagHelp(this.tag.elementName);
	};

	// コンボボックスに初期値を設定するメソッドを追加する。
	dialog.setValues = function(names)
	{
		if (typeof names == "string")
			names = names.splitcsv();

		for (var i in names)
		{
			var name = names[i];
			if (name.charAt(0) == "%")
			{
				// % で始まっている場合は、カラーボタン付きコンボボックスと見なす。
				name = name.substr(1);
				HTML.setComboAndButton(this, name, this.attr[name]);
			}
			else // (コンボボックスだけ)
				this.setValue(name, this.attr[name]);
		}
	};

	// 初期値設定の必要なコントロールのリストがあれば、onOpen とともにセットする。
	if (combos)
	{
		dialog.combos = combos;
		dialog.onOpen = function()
		{
			this.setValues(this.combos);
			if (this.grayout)
				this.grayout();
		};
	}
	return dialog;
};

HTML.onEditTagStyle = function(dialog, control)
{
	// [一般属性]ボタンにより一般属性編集ダイアログボックスを表示する。
	var tag = dialog.tag;
	var attrs = "name,title,class,id,style".splitcsv();
	var i, attr, ctrl;

	// 呼び出し元のダイアログボックスに一般属性があれば、それをtagに戻す。
	for (i in attrs)
	{
		attr = attrs[i];
		if (ctrl = dialog.controls[attr])
			tag.updateAttr(attr, dialog.getValue(ctrl));
	}

	if (!HTML.doEditTagGeneral(tag.editor, tag))
		return;

	for (i in attrs)
	{
		attr = attrs[i];
		if (ctrl = dialog.controls[attr])
			dialog.setValue(ctrl, tag.getAttr(attr));
	}
};

HTML.setColorToCombo = function(dialog, control)
{
	// カラーボタンの値を対(pair)になっているコンボボックスにセットする。
	var color = HTML.swapRGB(dialog.getValue(control));
	dialog.setValue(control.pair, HTML.getColorName(color));
	return color;
};

HTML.setColorToButton = function(dialog, control)
{
	// コンボボックスの値を対(pair)になっているカラーボタンにセットする。
	var color = HTML.getColorValue(dialog.getValue(control));
	dialog.setValue(control.pair, HTML.swapRGB(color));
	return color;
};

HTML.setComboAndButton = function(dialog, controlName, colorName)
{
	// コンボボックス側に値をセットする。
	var control = dialog.controls[controlName];
	dialog.setValue(control, colorName);

	// 対(pair)になっているカラーボタンにも値をセットする。
	dialog.setValue(control.pair, HTML.swapRGB(HTML.getColorValue(colorName)));
};

HTML.updateHistory = function(array, data)
{
	// 履歴配列を更新する。
	// data を先頭に入れ、重複しているものを除きならが最大20まで残す。
	if (!data)
		return;

	// 配列のコピーを作成し、元の空にして先頭へ今回のデータを挿入する。
	var clone = array.slice(0);
	array.length = 0;
	array.push(data);

	// 重複するデータを除きながらコピーから元の配列へ戻す。
	for (var i in clone)
	{
		if (clone[i] != data && array.push(clone[i]) >= 20)
			break;
	}
};


/////////////////////////////////////////////////////////////////////////////
// HTML - CSS operations

HTML.pickupStyles = function(vw, tag)
{
	// CSS 部分を探してその中で定義されているセレクタとクラスを取得する。
	// tag が指定されている場合は、そのタグで class=XXX、または ID=XXX と
	// して設定できる可能性のあるスタイルだけをピックアップする。ただし、
	// TABLE TR TH など入れ子状態の判断まではしない。セレクタの一致だけを
	// 判断してピックアップする。

	var rexp = /([A-Za-z0-9 #,-.:>_]+)\{/g;
	var array;
	var styles = [ ];
	var dupmap = { };
	var element = tag && tag.elementName;

	var pt = 1;
	while (pt = vw.htmlGetNextTag(pt, "style"))
	{
		if (pt.type == 1)
		{
			// <style> ... </style> 間のテキストを取り出し、CSSコメント
			// (/* ... */)、スペース、HTMLコメント(<!-- ... -->)を除去する。
			var next = vw.htmlGetNextTag(pt[1]);
			var text = vw.getTextBetween(pt[1], next ? next[0] : vw.EOF)
						 .replace(/\/\*.*?\*\//g, " ")
						 .replace(/\s+/g, " ")
						 .replace(/^\s*<!--\s*/)
						 .replace(/-->\s*$/);

			// 1つの<style>〜</style>間のセレクタやクラスを順番に処理する。
			rexp.lastIndex = 0;
			while (array = rexp.exec(text))
			{
				var list = array[1].splitcsv();
				for (var i in list)
				{
					// コンマで分解した結果の前後のスペースを取り除き、
					// 重複しないようにチェックしながら配列に登録してゆく。
					var style = list[i].trim();
					var lower = style.toLowerCase();
					if (dupmap[lower])
						continue;
					dupmap[lower] = true;

					// 特定のタグ(element)だけに合うスタイルを選別する。
					if (element)
					{
						// セレクタだけのスタイルを除外する。
						if (!/[.:#]/.test(style.split(" ").pop()))
							continue;

						// 定義済みクラスを除外する。
						if (RegExp.lastMatch == ":")
							continue;

						// 最後にセレクタが異なるスタイルを除外する。
						var selector = RegExp.leftContext;
						if (selector && String.stricmp(selector, element))
							continue;
					}
					styles.push(style);
				}
			}

			// 閉じ </style> が見つからない場合はここまで。
			if (!next)
				break;
			pt = next;
		}
		pt = pt[1];
	}
	return styles;
};


/////////////////////////////////////////////////////////////////////////////
// HTML - file choosers

HTML.imageChooser = function(dialog, control)
{
	// イメージファイルを選択する。
	return HTML.fileChooser(dialog, control, "イメージファイルの選択",
							"イメージファイル (*.jpg,*.jpeg,*.gif,*.png)|*.jpg;*.jpeg;*.gif;*.png|GIF (*.gif)|*.gif|JPEG (*.jpg,*.jpeg)|*.jpg;*.jpeg|PNG (*.png)|*.png|");
};

HTML.scriptChooser = function(dialog, control)
{
	// スクリプトファイルを選択する。
	return HTML.fileChooser(dialog, control, "スクリプトファイルの選択", "JavaScript (*.js)|*.js|VBScript (*.vbs)|*.vbs|");
};

HTML.soundChooser = function(dialog, control)
{
	// サウンドファイルを選択する。
	return HTML.fileChooser(dialog, control, "サウンドファイルの選択", "サウンドファイル (*.wav,*.au,*.mid,*.aif,*.mp3)|*.wav;*.au;*.mid;*.aif;*.mp3|");
};

HTML.styleSheetChooser = function(dialog, control)
{
	// スタイルシートを選択する。
	return HTML.fileChooser(dialog, control, "スタイルシートの選択", "スタイルシート (*.css)|*.css|");
};

HTML.fileChooser = function(dialog, control, title, filter)
{
	// カスタムダイアログボックスのコールバックでのファイル選択。
	var path = HTML.toWindowsPath(dialog.getValue(control.pair));
	if (HTML.isURL(path))
	{
		beep();
		return;
	}

	if (path && !File.exists(path))
	{
		// パスがあるのにファイルがない場合、少なくともフォルダが存在すれば
		// そのまま使う。フォルダもない場合は、パスなしファイル名だけを指定
		// することでカレントフォルダを使うようにする。好みによっては、編集
		// ウインドウのフォルダを基準にする方が適しているかもしれない。

		var folder = path.replace(/[^\\\/]+$/);
		if (!File.isFolder(folder))
			path = path.replace(/^.*[\\\/]/);
	}

	// ダイアログボックスを表示する。
	if (path = fileBox(title, true, null, path, filter + "すべてのファイル (*.*)|*.*||"))
	{
		dialog.setValue(control.pair, HTML.toHtmlPath(path));
		dialog.gotoControl(control);
	}
};

HTML.imageViewer = function(dialog, control)
{
	// 外部プログラムを使ってイメージファイルを表示する。
	var path = HTML.toWindowsPath(dialog.getValue(control.pair));
	if (File.exists(path) || HTML.isURL(path))
		shellExecute(null, path);
	else
		beep();
};

HTML.toWindowsPath = function(path)
{
	// 相対パスをできるだけ Windows スタイルの絶対パスに変換する。
	if (HTML.isURL(path))
		return path;

	if (!HTML.isAbsolutePath(path))
	{
		var folder = HTML.getViewFolder();
		if (path && folder)
			path = folder + path;
	}
	return HTML.reformPath(path);
};

HTML.toHtmlPath = function(path, level)
{
	// Windows スタイルの絶対パスをできるだけ相対パスに変換する。
	if (HTML.isURL(path))
		return path;

	var folder = HTML.getViewFolder();
	if (path && folder)
		path = File.getRelativePath(path, folder, level || 4);

	return path.replace(/\\/g, "/");
};

HTML.reformPath = function(path)
{
	// / をすべて \ に変換してから、無駄な \.\ と \folder\..\ をすべて取り除く。
	var temp = path.replace(/\//g, "\\").replace(/\\(\.\\)+/g, "\\");
	while ((path = temp.replace(/\\[^\\]+\\\.\.\\/, "\\")) != temp)
		temp = path;
	return path;
};

HTML.getViewFolder = function()
{
	// 編集しているアクティブビューのフォルダを取得する。
	return view ? view.getFilePath().replace(/[^\\\/]+$/) : "";
};

HTML.isAbsolutePath = function(path)
{
	// C:\abc\...、\\host\dir\...、\dir\... のような絶対パスか?
	return /^([a-z]:|[\\\/])?[\\\/]/i.test(path);
};

HTML.isURL = function(url)
{
	// http://、ftp://、mailto:、JavaScript: のようなのがURL。
	// TODO: もっと精密に判定すべきか?
	return /^[a-z]{3,10}:/i.test(url);
};

HTML.isHTML = function(path)
{
	// .html、.php というように内部が HTML 基本のファイルか?
	// NOTE: .cgi も仲間と判定した方が便利なことが多いので...
	return /\.(s?html?|aspx?|php[345]?|jsp|psp|cgi)$/i.test(path);
};

HTML.filterHref = function(path)
{
	// HTML ツリーに表示するファイルを選別するフィルター。
	return !HTML.hrefFilterRexp || HTML.hrefFilterRexp.test(path);
};


/////////////////////////////////////////////////////////////////////////////
// HTML - misc. helper functions

HTML.separatePercent = function(attr, names)
{
	// width="100%" のような属性値のパーセント(%)を、width_P として分離する。
	if (!names)
		names = [ "width", "height" ];

	for (var i in names)
	{
		var name = names[i];
		if (/(.*)%\s*$/.test(attr[name]))
		{
			attr[name] = RegExp.$1;
			attr[name + "_P"] = true;
		}
	}
};

HTML.combinePercent = function(attr, names)
{
	// 分離されているパーセント(%)を合体させる。
	if (!names)
		names = [ "width", "height" ];

	for (var i in names)
	{
		var name = names[i];
		if (attr[name + "_P"] && !HtmlTag.isBlank(attr[name]))
			attr[name] += "%";
	}
};

HTML.valueToIndex = function(array, value, defval)
{
	// 値が一致する値の配列のインデックスを返す。
	for (var i in array)
	{
		if (array[i] == value)
			return i;
	}
	return defval;
};

HTML.comparePoints = function(pt1, pt2)
{
	// 2つのポイント(pt1, pt2)の前後関係を調べる。
	// pt1 > pt2 なら正、pt1 < pt2 なら負、同じなら 0 を返す。
	return pt1.line - pt2.line || pt1.index - pt2.index;
};

HTML.minmax = function(val, min, max)
{
	if (val < min)
		return min;
	if (val > max)
		return max;
	return val;
};


/////////////////////////////////////////////////////////////////////////////
// HTML - color functions and name/value mapping tables

HTML.getColorValue = function(color)
{
	// カラー名から値に変換する(16色の名前は140色にすべて含まれている)。
	color = (color || "").trim().toLowerCase();
	if (color in HTML.color140)
		return HTML.color140[ color ];

	// #RRGGBB 形式ならばそのままカラー値に変換する。
	if (/^#?([0-9a-f]+)$/.test(color))
		return parseInt(RegExp.$1, 16);

	// 不明なカラー名は黒(0x000000)に変換する。
	return 0x000000;
};

HTML.getColorName = function(value, all)
{
	// カラー値から名前に変換する(順番に探すしかない)。
	if (arguments.length < 2 && HTML.colorPalette == CPS_HTMLCOLORS)
		all = true;

	var map = all ? HTML.color140 : HTML.color16;
	for (var key in map)
	{
		if (map[key] == value)
			return key;
	}

	// 値に該当する名前がなければ、#RRGGBB 形式に変換する。
	return sprintf("#%06x", value);
};

HTML.listColorNames = function(all)
{
	// カラー名の一覧を取得する。
	if (arguments.length < 1 && HTML.colorPalette == CPS_HTMLCOLORS)
		all = true;

	return enumKeys(all ? HTML.color140 : HTML.color16).sort();
};

HTML.swapRGB = function(rgb)
{
	// RRGGBB (HTMLスタイル) <==> GGRRBB (Windowsスタイル)の変換を行う。
	return ((rgb >> 16) & 0x0000ff) | (rgb & 0x00ff00) | ((rgb << 16) & 0xff0000);
};

HTML.color16 =
{
	aqua:					0x00FFFF,
	black: 					0x000000,
	blue:					0x0000FF,
	fuchsia:				0xFF00FF,	// magenta と同じ
	gray:					0x808080,
	green:					0x008000,
	lime:					0x00FF00,
	magenta:				0xFF00FF,	// fuchsia と同じ
	maroon:					0x800000,
	navy:					0x000080,
	olive:					0x808000,
	purple:					0x800080,
	red:					0xFF0000,
	silver:					0xC0C0C0,
	teal:					0x008080,
	white:					0xFFFFFF,
	yellow:					0xFFFF00
};

HTML.color140 =
{
	black:					0x000000,
	navy:					0x000080,
	darkblue:				0x00008B,
	mediumblue:				0x0000CD,
	blue:					0x0000FF,
	darkgreen:				0x006400,
	green:					0x008000,
	teal:					0x008080,
	darkcyan:				0x008B8B,
	deepskyblue:			0x00BFFF,
	darkturquoise:			0x00CED1,
	mediumspringgreen:		0x00FA9A,
	lime:					0x00FF00,
	springgreen:			0x00FF7F,
	aqua:					0x00FFFF,
	cyan:					0x00FFFF,
	midnightblue:			0x191970,
	dodgerblue:				0x1E90FF,
	lightseagreen:			0x20B2AA,
	forestgreen:			0x228B22,
	seagreen:				0x2E8B57,
	darkslategray:			0x2F4F4F,
	limegreen:				0x32CD32,
	mediumseagreen:			0x3CB371,
	turquoise:				0x40E0D0,
	royalblue:				0x4169E1,
	steelblue:				0x4682B4,
	darkslateblue:			0x483D8B,
	mediumturquoise:		0x48D1CC,
	indigo:					0x4B0082,
	darkolivegreen:			0x556B2F,
	cadetblue:				0x5F9EA0,
	cornflowerblue:			0x6495ED,
	mediumaquamarine:		0x66CDAA,
	dimgray:				0x696969,
	slateblue:				0x6A5ACD,
	olivedrab:				0x6B8E23,
	slategray:				0x708090,
	lightslategray:			0x778899,
	mediumslateblue:		0x7B68EE,
	lawngreen:				0x7CFC00,
	chartreuse:				0x7FFF00,
	aquamarine:				0x7FFFD4,
	maroon:					0x800000,
	purple:					0x800080,
	olive:					0x808000,
	gray:					0x808080,
	skyblue:				0x87CEEB,
	lightskyblue:			0x87CEFA,
	blueviolet:				0x8A2BE2,
	darkred:				0x8B0000,
	darkmagenta:			0x8B008B,
	saddlebrown:			0x8B4513,
	darkseagreen:			0x8FBC8F,
	lightgreen:				0x90EE90,
	mediumpurple:			0x9370DB,
	darkviolet:				0x9400D3,
	palegreen:				0x98FB98,
	darkorchid:				0x9932CC,
	yellowgreen:			0x9ACD32,
	sienna:					0xA0522D,
	brown:					0xA52A2A,
	darkgray:				0xA9A9A9,
	lightblue:				0xADD8E6,
	greenyellow:			0xADFF2F,
	paleturquoise:			0xAFEEEE,
	lightsteelblue:			0xB0C4DE,
	powderblue:				0xB0E0E6,
	firebrick:				0xB22222,
	darkgoldenrod:			0xB8860B,
	mediumorchid:			0xBA55D3,
	rosybrown:				0xBC8F8F,
	darkkhaki:				0xBDB76B,
	silver:					0xC0C0C0,
	mediumvioletred:		0xC71585,
	indianred:				0xCD5C5C,
	peru:					0xCD853F,
	chocolate:				0xD2691E,
	tan:					0xD2B48C,
	lightgrey:				0xD3D3D3,
	thistle:				0xD8BFD8,
	orchid:					0xDA70D6,
	goldenrod:				0xDAA520,
	palevioletred:			0xDB7093,
	crimson:				0xDC143C,
	gainsboro:				0xDCDCDC,
	plum:					0xDDA0DD,
	burlywood:				0xDEB887,
	lightcyan:				0xE0FFFF,
	lavender:				0xE6E6FA,
	darksalmon:				0xE9967A,
	violet:					0xEE82EE,
	palegoldenrod:			0xEEE8AA,
	lightcoral:				0xF08080,
	khaki:					0xF0E68C,
	aliceblue:				0xF0F8FF,
	honeydew:				0xF0FFF0,
	azure:					0xF0FFFF,
	sandybrown:				0xF4A460,
	wheat:					0xF5DEB3,
	beige:					0xF5F5DC,
	whitesmoke:				0xF5F5F5,
	mintcream:				0xF5FFFA,
	ghostwhite:				0xF8F8FF,
	salmon:					0xFA8072,
	antiquewhite:			0xFAEBD7,
	linen:					0xFAF0E6,
	lightgoldenrodyellow:	0xFAFAD2,
	oldlace:				0xFDF5E6,
	red:					0xFF0000,
	fuchsia:				0xFF00FF,
	magenta:				0xFF00FF,
	deeppink:				0xFF1493,
	orangered:				0xFF4500,
	tomato:					0xFF6347,
	hotpink:				0xFF69B4,
	coral:					0xFF7F50,
	darkorange:				0xFF8C00,
	lightsalmon:			0xFFA07A,
	orange:					0xFFA500,
	lightpink:				0xFFB6C1,
	pink:					0xFFC0CB,
	gold:					0xFFD700,
	peachpuff:				0xFFDAB9,
	navajowhite:			0xFFDEAD,
	moccasin:				0xFFE4B5,
	bisque:					0xFFE4C4,
	mistyrose:				0xFFE4E1,
	blanchedalmond:			0xFFEBCD,
	papayawhip:				0xFFEFD5,
	lavenderblush:			0xFFF0F5,
	seashell:				0xFFF5EE,
	cornsilk:				0xFFF8DC,
	lemonchiffon:			0xFFFACD,
	floralwhite:			0xFFFAF0,
	snow:					0xFFFAFA,
	yellow:					0xFFFF00,
	lightyellow:			0xFFFFE0,
	ivory:					0xFFFFF0,
	white:					0xFFFFFF
};


/////////////////////////////////////////////////////////////////////////////
// ブラウザの更新

HTML.updateBrowser = function(vw)
{
	// ブラウザをリフレッシュし前面に表示する。
	// まだブラウザがないときは新しく起動する。

	if (!vw.getFilePath())
		error("未保存のファイルはリフレッシュできません.");
	if (vw.isModified() && !vw.saveFile())
		return;

	var handle = HTML.doUpdateBrowser(vw);
	if (handle)
		setForegroundWindow(handle);
	else
		shellExecute(null, vw);
};

HTML.doUpdateBrowser = function(vw)
{
	// ブラウザをリフレッシュする。
	// <title>〜</title> に挟まれたタイトルの文字列を取得する。
	// HTML ベースの言語でないときでも、自力で title を探す。

	var tag1, tag2;
	var title = "";

	if ((tag1 = vw.htmlGetNextTag(1, "title")) && (tag2 = vw.htmlGetMatchingTag(tag1[0])))
		title = vw.getTextBetween(tag1[1], tag2[0]);
	else if (vw.search(/<title>(.*)<\/title>/i))
		title = RegExp.$1;

	// タイトル中のエンティティを文字列に、タブや改行をスペースに変換し、
	// 前後の空白文字を削除する。

	title = title.replace(/&(quot|lt|gt|amp|nbsp)\>;?|\s/g,
							function($0, $1)
							{
								switch ($1) {
								case "quot":
									return "\"";
								case "lt":
									return "<";
								case "gt":
									return ">";
								case "amp":
									return "&";
								default:
									return " ";
							    }
							});
	title = title.trim();

	// タイトルまたはファイルパスの付いたウインドウキャプションを
	// 手がかりに、IE -> NN の順でウインドウを検索し、見つかれば、
	// そのブラウザの更新コマンドをポストする。

	var handle;
	if (handle = HTML.findWindow(title + " - Microsoft Internet Explorer")
			  || HTML.findWindow(vw    + " - Microsoft Internet Explorer"))
	{
		HTML.refreshIE(handle);
		return handle;
	}

	if (handle = HTML.findWindow(title + " - Netscape")
			  || HTML.findWindow("Netscape - [" + title + "]"))
	{
		HTML.refreshNN(handle);
		return handle;
	}
};

HTML.findWindow = function(title)
{
	// title の付いたウインドウを探し、ウインドウハンドルを返す。
	for (var handle = getWindow(getDesktopWindow(), GW_CHILD); handle; handle = getWindow(handle, GW_HWNDNEXT))
	{
		if (getWindowText(handle) == title)
			return handle;
	}
};

HTML.findWindowRE = function(re)
{
	// 正規表現 re にマッチするタイトルの付いたウインドウを探しハンドルを返す。
	for (var handle = getWindow(getDesktopWindow(), GW_CHILD); handle; handle = getWindow(handle, GW_HWNDNEXT))
	{
		if (re.test(getWindowText(handle)))
			return handle;
	}
};

HTML.refreshIE = function(handle)
{
	// Microsoft Internet Explorer にリフレッシュコマンドを送る。
	postMessage(handle, 0x0111 /* WM_COMMAND */, 0xA220 /* IE Refresh Command */);
};

HTML.refreshNN = function(handle)
{
	// Netscape Navigator にリフレッシュコマンドを送る。
	postMessage(handle, 0x0111 /* WM_COMMAND */, 0x800E /* NN Refresh Command */);
};


/////////////////////////////////////////////////////////////////////////////
// 文字<-->エンティティへ変換

HTML.convertToEntityAll = function()
{
	// 選択範囲の文字をエンティティに変換する。
    replace(/[&<>]/g,
			function ($0)
		    {
		        if ($0 == "&")
		            return "&amp;";
		        if ($0 == "<")
		            return "&lt;";
		        if ($0 == ">")
		            return "&gt;";
		    /*  if ($0 == "\"")
		            return "&quot;"; 削除 Ver 1.01 by JM 2007/01/18*/
		        return $0;
		    },
			AP, CP);
};

HTML.convertEntityToChar = function()
{
    // 選択範囲内のエンティティを文字に変換する。
    replace(/&(amp|lt|gt|quot|apos)\>;?/g,
			function ($0, $1)
		    {
		        if ($1 == "amp")
		            return "&";
		        if ($1 == "lt")
		            return "<";
		        if ($1 == "gt")
		            return ">";
		        if ($1 == "quot")
		            return "\"";
		        if ($1 == "apos")	// 追加 Ver 1.02 by JM 2007/02/02
		            return "\'";
		        return $0;
		    },
			AP, CP);
};


/////////////////////////////////////////////////////////////////////////////
// HTML - リンクの検証

HTML.verifyLinkGroup = function(deep)
{
	// プロジェクトのグループ内、または以下のファイル群のリンクをまとめて検証する。
	if (!project)
		error("プロジェクトが開かれていません.");

	// 選択しているグループ、またはファイルのグループを取得する。
	var group = project.selected;
	if (!group)
		error("プロジェクトのファイルかグループを選択してください.");
	if (!(group instanceof GroupItem))
		group = group.parent;

	// アウトプットウインドの準備。
	var page = output.select(7);
	page.clear();
	page.update();

	// 検証対象グループから(HTML、ASP、PHP、JSP、CGIなど)のファイルを探す。
	var items = group.enumItems(deep, FileItem, /\.(s?html?|aspx?|php[345]?|jsp|psp|cgi|hhc)$/i);
	HTML.doVerifyLink(items);
};

HTML.verifyLocalLink = function(vw)
{
	// 開いているファイルのファイル内リンクをチェックし、アウトプット
	// ウインドウへタグジャンプできる形式でエラー/警告をレポートする。
	if (!vw)
		vw = view;
	if (!vw)
		error("ファイルが開かれていません.");

	var path = vw.getFilePath();
	if (!path)
		error("未保存のファイルは検証できません.");

	// アウトプットウインドの準備。
	var page = output.select(7);
	page.clear();
	page.update();

	// vw 内のリンクの検証を行う。
	HTML.doVerifyLink([ path ]);
};

HTML.doVerifyLink = function(paths)
{
	// 配列 paths 間でのリンクを実際に検証する。
	var i, j;
	var errs = 0;
	var warn = 0;
	var page = output.select(7);
	var files = [ ];

	// PASS 1 - ファイルを順番に開いて参照先と参照元を抽出する。
	for (i in paths)
	{
		var path = paths[i];
		setStatusText("走査中: ", path);
		write("走査中: ", path);

		var file = HTML.pickupAnchorsLinksByPath(path);
		if (!file)
		{
			writeln(" ERROR - ファイルが開けません.");
			continue;
		}

		// インデックスとパスキーの両方で配列に保存する。
		files.push(file);
		files[file.path.toLowerCase()] = file;

		// name="..." の定義数、href="..." などでの参照数を表示する。
		printf("  ( %d / %d )\n", file.count, file.hrefs.length);
		page.update();
	}

	// PASS 2 - 収集した情報を突き合わせて参照関係を検証する。
	for (i in files)
	{
		file = files[i];
		path = file.path;

		setStatusText("検証中: ", path);
		writeln("検証中: ", path);
		page.update();

		// ファイル内の多重名前定義をメッセージ(改行付き)を出力する。
		for (j in file.errors)
		{
			write(file.errors[j]);
			errs++;
		}

		// 参照先のないリンクを調べる。
		var names = file.names;
		var hrefs = file.hrefs;
		var folder = path.replace(/[^\\]+$/);

		for (j in hrefs)
		{
			// 1つのリンクを調べる。
			var tag  = hrefs[j];
			var line = tag[0].line;
			var elem = tag.elementName.toLowerCase();
			var name = tag.linkName;

			// デバッグ情報
			// printf("%s:%d: [CHECKING] <%s %s=\"%s\">\n", path, line, elem, name, tag.linkValue);

			// file#name のようなファイル内のジャンプ先指定を分離する。
			var url = tag.linkValue;
			var sub = "";
			var key = "";
			if (/[#?]/.test(url))
			{
				url = RegExp.leftContext;
				if (RegExp.lastMatch == "#")
				{
					sub = RegExp.rightContext;
					key = sub.toLowerCase();
				}
			}

			if (!url && !sub)
			{
				// 両方とも空、つまり "#" だけがある。
				// ファイルの先頭へジャンプするみたいなので、とりあえずエラーとはしない。
				// printf("%s:%d: ERROR - リンク先の記述に誤りがあります: %s\n", path, line, tag.linkValue);
				// errs++;
			}
			else if (!url)
			{
				// href="#aaabbbccc" は、ファイル内へのリンク。
				if (key in names)
				{
					// 「使用済み」マークを付ける。
					names[key].used = true;
				}
				else
				{
					// ファイル内リンク先が見つからない。
					printf("%s:%d: ERROR - リンク先が同じファイル内に定義されていません: %s\n", path, line, sub);
					errs++;
				}
			}
			else if (!HTML.isURL(url))
			{
				// 相対ぱすならこのファイルを基準に絶対パスへ変換する。
				if (!HTML.isAbsolutePath(url))
					url = folder + url;

				// できるだけ正規化されたWindowsスタイルのパスに整形する。
				url = HTML.reformPath(url);

				// まずは、ファイルの存在を確かめる。
				var link = files[ url.toLowerCase() ];
				if (!link && !File.exists(url))
				{
					printf("%s:%d: ERROR - リンク先のファイルが見つかりません: %s\n", path, line, tag.linkValue);
					errs++;
				}
				else if (sub)
				{
					// まだ内部不明のファイルであれば走査・登録する。
					if (!link && (link = HTML.pickupAnchorsLinksByPath(url)))
					{
						// errors、hrefs は使わないので、メモリ節約のため早めに削除する。
						delete link.errors;
						delete link.hrefs;
						files[ link.path.toLowerCase() ] = link;
					}

					if (!link)
					{
						printf("%s:%d: ERROR - リンク先のファイル内部が解析できません\n");
						errs++;
					}
					else if (link.names[key])
					{
						// 「使用済み」マークを付ける。
						link.names[key].used = true;
					}
					else // (no named anchor)
					{
						printf("%s:%d: ERROR - リンク先のファイルに名前が見つかりません: %s\n", path, line, tag.linkValue);
						errs++;
					}
				}
			}
		}
	}

	// PASS 3 - 最後にどこからも使われていないアンカーをレポートする。
	writeln("未使用アンカーの検証中...");
	page.update();

	for (i in files)
	{
		file = files[i];
		path = file.path;
		names = file.names;

		// 未使用のアンカーを tags に集める。
		var tags = [ ];
		for (j in names)
		{
			tag = names[j];
			if (!tag.used)
				tags.push(tag);
		}

		// 未使用タグを出現順に並べ直してから出力する。
		// NOTE: 連想配列名なので行順番がバラバラである。そのままでは
		// 前後にジャンプして見にくいため、ポイント順にソートしている。

		tags.sort(function(a, b) { return HTML.comparePoints(a[0], b[0]); });
		for (j in tags)
		{
			tag = tags[j];
			printf("%s:%d: WARNING - 未参照アンカー: <a name=\"%s\">\n", path, tag[0].line, tag.name);
			warn++;
		}
	}

	// エラーなどの個数を報告してお終い。
	writeln();
	writeln(files.length, " 個のファイルを検証しました.");
	writeln(errs, " 個のエラーが見つかりました.");
	writeln(warn, " 個の未参照アンカーがあります.");
	setStatusText("検証完了.");
	beep();
};

HTML.pickupAnchorsLinksByPath = function(path)
{
	// パスによって指定されたファイルを走査しリンク情報を収集する。
	var op = null;
	var vw = isFileOpened(path);
	if (!vw)
		vw = op = openFile(path);
	if (!vw)
		return;

	var file = HTML.pickupAnchorsLinks(vw);
	if (op)
		op.closeFile();

	return file;
};

HTML.pickupAnchorsLinks = function(vw)
{
	// ファイル内の name、href など、URLが値となるタグ属性を拾い集める。
	// NOTE: <ime lowsrc="...">のように使用頻度の低い属性は無視している。
	var hasurl =
	{
		// エレメント名 => URLが記述されている属性名
		a: "href", area: "href", link: "href", blockquote: "cite", ins: "cite", del: "cite",
		frame: "src", iframe: "src", img: "src", script: "src", input: "src", bgsound: "src"
	};

	var path = vw.getFilePath();
	var count = 0;
	var names = { };
	var hrefs = [ ];
	var errors = [ ];

	for (var pt = 1; pt = vw.htmlGetNextTag(pt); pt = pt[1])
	{
		// 開始タグ、自己完結タグを対象とし、閉じタグを除外する。
		if (pt.type == 2 || !pt.elementName)
			continue;

		// URLを持たないタグを除外する。
		var elem = pt.elementName.toLowerCase();
		var name = hasurl[elem];
		if (!name)
			continue;

		// タグをより詳しく解析する。
		var tag  = HtmlTag.parse(vw, pt[0]);
		var attr = tag.values;

		// <a name="..."> で名前の重複定義をチェックする。
		if (elem == "a" && attr.name)
		{
			var key = attr.name.toLowerCase();
			if (key in names)
			{
				errors.push(sprintf("%s:%d: ERROR - 名前の定義が重複しています: %s\n", path, pt[0].line, attr.name) +
							sprintf("%s:%d: INFO - 最初はここで定義されています.\n", path, names[key][0].line));
			}
			else // (it's a new name)
			{
				// name属性の値をタグのnameプロパティとして保存する。
				count++;
				names[key] = pt;
				pt.name = attr.name;
			}
		}

		// URLをセットする属性があれば、属性名と値をタグのlinkName、
		// linkValueプロパティとして保存する。
		if (attr[name])
		{
			pt.linkName = name;
			pt.linkValue = attr[name];
			hrefs.push(pt);
		}
	}

	// 結果をオブジェクトにまとめて返す。
	return {
		path:	path,		// ファイルのパス
		names:	names,		// 名前(小文字) => 定義してあるタグへの連想配列
		count:	count,		// 名前の個数
		hrefs:	hrefs,		// 参照を含んでいるタグの配列
		errors:	errors		// 重複名前エラーメッセージの配列
	};
};


/////////////////////////////////////////////////////////////////////////////
// HTML - タグヘルプ

HTML.tagHelpURL = "http://www.tohoho-web.com/html/<TAG>.htm";

HTML.showTagHelp = function(elem)
{
	if (!HTML.tagHelpURL)
		return false;

	// H1、H2、H3、H4、H5、H6 は H1 が代表する。
	if (/^h[2-6]$/i.test(elem))
		elem = "h1";

	// <font> - フォント - Microsoft Internet Explorer のようなタイトルのウインドウを探す。
	var rexp = new RegExp("<" + elem + ">\\s+-\\s+\\S+\\s+-\\s+(Microsoft Internet Explorer|Netscape)", "i");
	var handle = HTML.findWindowRE(rexp);
	if (handle)
	{
		if (String.stricmp(RegExp.$1, "Netscape"))
			HTML.refreshIE(handle);
		else
			HTML.refreshNN(handle);
		setForegroundWindow(handle);
	}
	else
	{
		// 見つからなかったら新しいブラウザを開く。
		shellExecute(null, HTML.tagHelpURL.replace(/<TAG>/, elem.toLowerCase()));
	}
	return true;
};


/////////////////////////////////////////////////////////////////////////////
// HTML - プロファイル(HTML.ini)の読み出し/保存/編集

HTML.editProfile = function()
{
	// 設定を変更する。
	var caseoptions = [ "変えない", "小文字", "大文字", "先頭大文字" ];
	var newoptions  = [             "小文字", "大文字", "先頭大文字" ];
	var quotopts	= [ "できるだけ変えない(新規属性には付けない)",
						"できるだけ変えない(新規属性にはつける)",
						"できるだけ付けない(必要なときだけ付ける)",
						"数字以外付ける",
						"必ず付ける" ];
	var coloropts	= [ "基本16色", "216色", "140色" ];
	var colorvals	= [ 0, CPS_SAFECOLORS, CPS_HTMLCOLORS ];
	var colornames	= [ "すべて数値", "基本16色", "140色" ];
	var quoteopts	= [ "ダブルクオート(\"...\")", "シングルクオート('...')" ];
	var quotechars	= [ "\"", "'" ];
	var scriptopts	= [ "<script language=\"JavaScript\">",
						"<script type=\"text/JavaScript\">" ];
	var ommitopts	= [ " 段落 … </p>",
						" テーブル(1) … </tr> </th> </td>",
						" テーブル(2) … </colgroup>",
						" テーブル(3) … </thead> </tfoot> </tbody>",
						" リスト … </li>",
						" 定義 … </dt> </dd>",
						" フォーム … </option>",
						" ルビ … </rb> </rp> </rt>" ];

	var V2I = HTML.valueToIndex;
	var template =
	[
		{ type: "GROUPBOX", label: "大文字/小文字", x: 5, y: 5, width: 240, height: 50 },
		{ type: "COMBO", name: "elemCase",    options: caseoptions, value: HtmlTag.elemCase, label: "既存タグ名(&E):", style: CBS_DROPDOWNLIST, x: 60, y: 18, width: 55, labelWidth: 47 },
		{ type: "COMBO", name: "newElemCase", options: newoptions, value: HtmlTag.newElemCase - 1, label: "新規タグ名(&N):", style: CBS_DROPDOWNLIST },
		{ type: "COMBO", name: "attrCase",    options: caseoptions, value: HtmlTag.attrCase, label: "既存属性名(&A):", style: CBS_DROPDOWNLIST, x: 182, y: 18 },
		{ type: "COMBO", name: "newAttrCase", options: newoptions, value: HtmlTag.newAttrCase - 1, label: "新規属性名(&T):", style: CBS_DROPDOWNLIST },

		{ type: "GROUPBOX", label: "属性値", x: 5, y: 60, width: 240, height: 50 },
		{ type: "COMBO", name: "valueQuote",  options: quotopts, value: HtmlTag.valueQuote, label: "引用符を(&Q):", style: CBS_DROPDOWNLIST, x: 60, y: 72, width: 177, labelWidth: 47 },
		{ type: "COMBO", name: "quoteChar",   options: quoteopts, value: V2I(quotechars, HtmlTag.quoteChar, 0), label: "引用符文字(&C):", style: CBS_DROPDOWNLIST, width: 80 },
		{ type: "CHECK", name: "quoteName",  value: HtmlTag.quoteName, label: "name/href/srcの引用符(&M)", x: 145, y: 89 },

		{ type: "GROUPBOX", label: "カラー", x: 5, y: 115, width: 240, height: 33 },
		{ type: "COMBO", name: "colorPalette", options: coloropts, value: V2I(colorvals, HTML.colorPalette, 0), label: "パレット(&P):", style: CBS_DROPDOWNLIST, x: 60, y: 127, width: 55, labelWidth: 47 },
		{ type: "COMBO", name: "useColorName", options: colornames, value: HTML.useColorName, label: "カラー名称(&U):", style: CBS_DROPDOWNLIST, x: 182, y: 127 },

		{ type: "GROUPBOX", label: "タグ閉じ", x: 5, y: 153, width: 240, height: 73 },
		{ type: "EDIT",  name: "pickCloseMax", value: HTML.pickCloseMax, label: "最大候補数(&X):", spin: [1, 10], style: ES_NUMBER, x: 60, y: 165, width: 55, labelWidth: 47, style: ES_NUMBER },
		{ type: "CHECK", name: "pickCloseAll", value: HTML.pickCloseAll, label: "省略可のタグも候補にする(&L)", x: 135, y: 167 },
		{ type: "CHECKLIST", name: "ommitable", label: "省略しない(&O):", options: ommitopts, value: HtmlTag.closeOpt.slice(2), x: 60, y: 183, width: 177, height: 35, style: WS_VSCROLL },

		{ type: "GROUPBOX", label: "その他", x: 5, y: 230, width: 240, height: 65 },
		{ type: "COMBO", name: "scriptUseType", value: Integer(HTML.scriptUseType), label: "スクリプト(&S):", options: scriptopts, x: 60, y: 242, width: 177, style: CBS_DROPDOWNLIST },
		{ type: "EDIT",  name: "hrefFilter", value: HTML.hrefFilter, label: "H&REFフィルタ:" },
		{ type: "EDIT",  name: "tagHelpURL", value: HTML.tagHelpURL, label: "ヘルプURL(&H):" },

		{ type: "CHECK", name: "storeProfile", value: HTML.storeProfile, label: "変更を保存する(&V)", x: 12, y: 303 },
		{ type: "BUTTON", id: IDOK, label: "OK", x: 140, y: 301 },
		{ type: "BUTTON", id: IDCANCEL, label: "キャンセル", x: 195, y: 301 }
	];

	var dialog = new Dialog("HTMLオプション設定", template);
	if (dialog.open() == IDOK)
	{
		var res = dialog.results;
		HtmlTag.elemCase	= V2I(caseoptions,	res.elemCase,		0);
		HtmlTag.newElemCase	= V2I(newoptions,	res.newElemCase,	1) + 1;
		HtmlTag.attrCase	= V2I(caseoptions,	res.attrCase,		0);
		HtmlTag.newAttrCase	= V2I(newoptions,	res.newAttrCase,	1) + 1;
		HtmlTag.valueQuote	= V2I(quotopts,		res.valueQuote,		1);
		HtmlTag.quoteChar	= quotechars[ V2I(quoteopts, res.quoteChar, 0) ];
		HtmlTag.quoteName	= res.quoteName;
		HTML.colorPalette	= colorvals[ V2I(coloropts, res.colorPalette, 1) ];
		HTML.useColorName	= V2I(colornames,	res.useColorName,	1);
		HTML.pickCloseMax	= HTML.minmax(parseInt(res.pickCloseMax), 1, 10);
		HTML.pickCloseAll	= res.pickCloseAll;
		HTML.tagHelpURL		= res.tagHelpURL.trim();
		HTML.storeProfile	= res.storeProfile;
		HTML.scriptUseType	= Boolean(V2I(scriptopts, res.scriptUseType));
		HTML.setHrefFilter(res.hrefFilter);

		// 省略しないタグを配列に設定する。
		for (var i = 2; i < HtmlTag.closeOpt.length; i++)
			HtmlTag.closeOpt[i] = false;
		for (i in res.ommitable)
		{
			var index = V2I(ommitopts, res.ommitable[i], -1);
			if (index >= 0)
				HtmlTag.closeOpt[index + 2] = true;
		}

		// [変更を保存する]がチェックされているときは、ファイルへ保存する。
		if (HTML.storeProfile)
			HTML.saveProfile();
	}
};

HTML.saveProfile = function()
{
	// 設定を保存する。
	var file = HTML.getProfile("w");
	if (file)
	{
		// 省略しないタグオプションを論理型の配列から整数配列に変換する。
		var array = HtmlTag.closeOpt.slice(2);
		for (var i in array)
			array[i] = Integer(array[i]);

		file.writeln("# HTML.msl profile");
		file.writeln("# Saved: ", Date());
		file.writeln();
		file.writeln("[HtmlTag]");
		file.writeln("elemCase = ",		HtmlTag.elemCase);
		file.writeln("attrCase = ",		HtmlTag.attrCase);
		file.writeln("newElemCase = ",	HtmlTag.newElemCase);
		file.writeln("newAttrCase = ",	HtmlTag.newAttrCase);
		file.writeln("valueQuote = ",	HtmlTag.valueQuote);
		file.writeln("quoteChar = ",	HtmlTag.quoteChar.charCodeAt(0));
		file.writeln("quoteName = ",	HtmlTag.quoteName);
		file.writeln("closeOpt = ",		array.join());
		file.writeln();
		file.writeln("[HTML]");
		file.writeln("colorPalette = ",	HTML.colorPalette);
		file.writeln("useColorName = ",	HTML.useColorName);
		file.writeln("pickCloseMax = ",	HTML.pickCloseMax);
		file.writeln("pickCloseAll = ",	Integer(HTML.pickCloseAll));
		file.writeln("tagHelpURL = ",	HTML.tagHelpURL);
		file.writeln("storeProfile = ",	Integer(HTML.storeProfile));
		file.writeln("scriptUseType = ", Integer(HTML.scriptUseType));
		file.writeln("hrefFilter = ", HTML.hrefFilter);
		file.close();
	}
};

HTML.loadProfile = function()
{
	// 設定を読み出す。
	var file = HTML.getProfile("r");
	if (file)
	{
		var obj = null;
		var line;
		while (line = file.readLine())
		{
			if (/^\s*\[\s*(\w+)\s*\]/.test(line))
			{
				// [HTML]、[HtmlTag] などのネームスペース(オブジェクト)名
				obj = global[RegExp.$1];
			}
			else if (obj && /^\s*(\w+)\s*=\s*(\S+)/.test(line))
			{
				// 変数と値のペアがあった。
				var key = RegExp.$1;
				var value = parseInt(RegExp.$2);

				switch (key) {
				case "elemCase":
				case "attrCase":
				case "newElemCase":
				case "newAttrCase":
				case "valueQuote":
				case "colorPalette":
				case "useColorName":
				case "pickCloseMax":
					obj[key] = value;
					break;

				case "hrefFilter":
					HTML.setHrefFilter(RegExp.$2);
					break;

				case "tagHelpURL":
					obj[key] = RegExp.$2;
					break;

				case "quoteChar":
					obj[key] = String.fromCharCode(value);
					break;

				case "quoteName":
				case "pickCloseAll":
				case "storeProfile":
				case "scriptUseType":
					obj[key] = Boolean(value);
					break;

				case "closeOpt":
					value = RegExp.$2.splitcsv();
					for (var i in value)
						obj.closeOpt[i + 2] = Boolean(Integer(value[i]));
					break;
				}
			}
		}
		file.close();
	}
};

HTML.getProfile = function(mode)
{
	// プロファイルを開く(同じフォルダの同じ名前で拡張子が .ini)。
	var file = new File(__FILE__.replace(/\.\w+$/, ".ini"));
	return file.open(mode) ? file : null;
};

HTML.setHrefFilter = function(filter)
{
	// HREF フィルタを正規表現としてコンパイルする。
	var regexp = null;
	if (filter)
	{
		regexp = new RegExp("\\.(" + filter.replace(/[\s|,;]+/g, "|") + ")$", "i");
		if (!regexp.isValid())
			regexp = null;
	}
	HTML.hrefFilter = filter;
	HTML.hrefFilterRexp = regexp;
};

// プロファイルがあれば、最後の最後に読み込む。
HTML.loadProfile();