<!--

var xhrObj = getXhrObj();

function xhrReq(){
        xhrObj.open("get", "http://www.howto.co.jp/Ajax/calendar/calAjax.php?month=before");
        xhrObj.setRequestHeader("If-Modified-Since", "01 Jan 2000 00:00:00 GMT");
        xhrObj.send(null);
        xhrObj.onreadystatechange = xhrResp;
}

function xhrReqNext(){
        xhrObj.open("get", "http://www.howto.co.jp/Ajax/calendar/calAjax.php?month=next");
        xhrObj.setRequestHeader("If-Modified-Since", "01 Jan 2000 00:00:00 GMT");
        xhrObj.send(null);
        xhrObj.onreadystatechange = xhrResp;
}

function xhrResp(){
        var recs, rec;
        if(xhrObj.readyState == 4){
                if(xhrObj.status == 200){
                        var recs = xhrObj.responseText.split("@");

                        var view = "";
                        var view = "<table border='1' id='calTable' style='margin-left:auto;margin-right:auto;'><tr><th id='sunday'>日</th><th>月</th><th>火</th><th>水</th><th>木</th><th>金</th><th id='saturday'>土</th></tr>";

                        var loop = recs.length / 7;
                        var cnt  = 0;


                        var lastData = recs[recs.length - 2].split("/");

			for(var i = 0; i < loop - 1; i++){

                            view += "<tr>";
                            for(var j = 0; j < 7; j++){
				rec = recs[cnt].split("/");

                                if (rec[0]  == '0') {
                                    no = ' ';
                                    view += "<td>"+no+"</td>";
                                } else {

                                    if (rec[1]  == 'b') {
                                        editNo = "<span style='color:blue;'>"+rec[0]+"</span>";
                                    } else if (rec[1]  == 'r') {
                                        editNo = "<span style='color:red;'>"+rec[0]+"</span>";
                                    } else {
                                        editNo = "<span style='color:black;'>"+rec[0]+"</span>";
                                    }

                                    if (rec[3]  == 'm') {
                                        editNo = "<a href='http://www.howto.co.jp/calendar/calendar_detail.php?step="+lastData[0]+"'>"+editNo+"</a>";
                                    }

                                    if (rec[2] == 't') {
                                        view += "<td style='background-color:#ffe4e1;'>"+editNo+"</td>";
                                    } else {
                                        view += "<td>"+editNo+"</td>";
                                    }

                                }

                                cnt++;
                            }
                            view += "</tr>";
			}

                        view += "</table>";

                        document.getElementById("yearMonth").innerHTML = lastData[1];

                        document.getElementById("view").innerHTML = view;
		}
	}
}



function initOnLoad(){
  var observer = document.getElementById("before");
  setListener(observer, "click", xhrReq);

  var observer = document.getElementById("next");
  setListener(observer, "click", xhrReqNext);


  xhrObj.open("get", "http://www.howto.co.jp/Ajax/calendar/calAjax.php?month=");
  xhrObj.setRequestHeader("If-Modified-Since", "01 Jan 2000 00:00:00 GMT");
  xhrObj.send(null);
  xhrObj.onreadystatechange = xhrResp;
}
setListener(window, "load", initOnLoad);

//-->
