/**
 * @fileOverview 2つのSELECTタグを親と子に分けて、親の選択に応じてダイレクトに子の選択項目を変える。<br>
 *               SELECTにセットする値は、&lt;pre&gt;タグに以下の書式でセットして、selLink_Init()を呼び出します。<br>
 * <br><br>注意： セットする値のリストは、必ず &lt;pre&gt;タグで指定してください。そうしないとHTML内文書の改行コードの
 *                解釈がブラウザによって違うため正しく動作しません。<br>
 * <pre>
 * 親の値：&lt;pre id="parrent_list style="display:none"&gt;値1,値2,値3,...&lt;/pre&gt;
 *         として、一行のカンマ区切りになります。
 * 子の値：&lt;pre id="child_list style="display:none"&gt;親1値1,親1値2,...
 *         親2値1,親2値2,...
 *         親3値1,親3値2,...
 *       &lt;/pre&gt;
 *         として、親の数だけ行があり、親に対する子の値をカンマ区切りで指定します。
 * </pre>
 *
 */


G_p_array = new Array();
G_c_array = new Array();
LF = String.fromCharCode(10);


/**
 * 初期化関数で、body要素のonLoad属性で<strong>必ず</strong>コールしてください
 *
 * @param {string} p_id 親にあたるSELECTのID属性の文字列
 * @param {string} p_list_id 親のSELECTにセットする値がカンマ区切りで指定されているテキストの
 *                           &lt;pre&gt;タグにセットしたID属性の文字列
 * @param {string} c_id 子にあたるSELECTのID属性の文字列
 * @param {string} c_list_id 子のSELECTにセットする値が改行とカンマ区切りで指定されているテキストの
 *                           &lt;pre&gt;タグにセットしたID属性の文字列
 * @return {void}
 *
 */
function selLink_Init(p_id, p_list_id, c_id, c_list_id)
{
	//---------
	//親の処理
	//---------
	var val = document.getElementById(p_list_id).firstChild.nodeValue;

	G_p_array = val.split(",");
    var p_ret = selLink_SetList(document.getElementById(p_id), G_p_array);

	//---------
	//子の処理
	//---------
	val = document.getElementById(c_list_id).firstChild.nodeValue;

	var tmp = val.split(/\r\n|[\r\n]/);
	//二次元配列にする
	for (var i=0; i<tmp.length; i++) {
		G_c_array[i] = tmp[i].split(",");
	}
    selLink_SetList(document.getElementById(c_id), G_c_array[0]);

	//親がselect状態にあるときに子供をリンクさせる
	if (p_ret >= 0) {
		selLink_Select(document.getElementById(p_id), c_id);
	}
}

/**
 * SELECTに選択要素をセットする<br>
 *  (HTMLから直接呼ばれることは無い)
 *
 * @param {object} objSel SELECTタグのオブジェクト
 * @param {array} listArray SELECTタグにセットする要素の配列
 * @return {int} 選択状態にあるlistArrayのINDEXを返す。
 *               何も選択されていなければ(-1)を返すが、この場合はエラーです。
 *
 */
function selLink_SetList(objSel, listArray) 
{
    var nMax = listArray.length;//select要素へ代入する値の配列数 
    var nLoop = 0; 
	var ret = (-1);
    for (nLoop = 0; nLoop < nMax; nLoop++){ 
        //option要素を作成
        var oAdd = document.createElement('option');

        //option要素を親要素に追加する前にすでに子要素があるときはそれを削除
        if(objSel.childNodes[nLoop]  != undefined)
            objSel.removeChild(objSel.childNodes[nLoop]);

        //option要素を親要素（select）へ追加
        objSel.appendChild(oAdd);

		var optArray = listArray[nLoop].split(':');

        //option要素のvalue属性にインデックスの値を設定
        objSel.childNodes[nLoop].setAttribute('value',optArray[0]);

		//selectedをセット
		if (optArray.length > 2) {
			objSel.childNodes[nLoop].setAttribute('selected','selected');
			ret = nLoop;
		}

        //option要素の子要素にlistArray配列の値をテキストとして作成
		if (optArray.length >= 2) {
	        oAddx= document.createTextNode(optArray[1]);
		} else {
			oAddx= document.createTextNode(optArray[0]);
		}

        //すでに子要素があるときはそれを削除
        if(objSel.childNodes[nLoop].firstChild  != undefined)
            objSel.childNodes[nLoop].removeChild(objSel.childNodes[nLoop].firstChild);

        //作成したテキストを親要素（option）へ追加
        objSel.childNodes[nLoop].appendChild(oAddx);
    }
    //連動する方のselect要素の個数を設定する
    objSel.length=nLoop;

	return ret;
}

/**
 * SELECTタグの選択されている親に合わせて子のSELECTタグの要素を変更する。
 * <br>
 * SELECTタグの親を変更した際に、onChange="selLink_Select(this, '子のID名')で呼び出してください。
 *
 * @param {object} p_o SELECTタグの親のオブジェクト
 * @param {string} c_id SELECTタグの子のID属性の名前
 * @return {void}
 *
 */
function selLink_Select(p_o, c_id)
{
	var c_o = document.getElementById(c_id);
	selLink_SetList(c_o, G_c_array[p_o.selectedIndex]);
}


