greghelton/makeCalendar.html

## makeCalendar.html
<html>
<head>
  <style>
    #content {
        height:1500;
    }
    .calendar {
        background-color: #CCDDFF;
        float: left;
        height:1500;
        width:400;
    }
    td, th {
        padding:1;
        font-family:arial;
        text-align: right;
        left:10px;
    }
    #calendar2012 {align:left;}
    #calendar2013 {align:center;}
    #calendar2014 {align:right;}
  </style>
</head>
<body>
  <div id="content">
    <div id="calendar2012" class="calendar"></div>
    <div id="calendar2013" class="calendar"></div>
    <div id="calendar2014" class="calendar"></div>
  </div>
  <script>
	var makeCalendar = function(year) {
		var cursorDate = new Date(year, 0, 1);

		var create7DayRow = function(cellType, daySet, column1) {
			var nextRow = document.createElement("tr");
			cell = document.createElement(cellType);
			cell.appendChild(document.createTextNode(column1));
			nextRow.appendChild(cell);
			for (i = 0; i < 7; i++) {
				var cell = document.createElement(cellType);
				var dy = document.createTextNode(daySet[i]);
				cell.appendChild(dy);
				nextRow.appendChild(cell);
			}
			return nextRow;
		};

		var getNext7Days = function(jan1DayOfWeekOffset) {
			var sevenDays = ['','','','','','','',''];
	    		for (i = 0; i + jan1DayOfWeekOffset < 7; i++) {
	     			sevenDays[i + jan1DayOfWeekOffset] = cursorDate.getDate();
	     			cursorDate = new Date( cursorDate.getFullYear(), cursorDate.getMonth(), cursorDate.getDate() + 1  );
	    		}
    			return sevenDays;
		};

		var get365Calendar = function(year) {
			var monthSet = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
			var weekSet = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
			var tbl, row, cell;

			tbl = document.createElement("table");
			row = create7DayRow("th", weekSet, year);
			tbl.appendChild(row);

			var jan1NextYear = new Date(year + 1, 0, 1);
			var jan1DayOfWeekOffset = cursorDate.getDay();
			while (cursorDate < jan1NextYear) {
				var sevenDays = getNext7Days( jan1DayOfWeekOffset );
				jan1DayOfWeekOffset = 0;
				row = create7DayRow("td", sevenDays, monthSet[cursorDate.getMonth()]);
				tbl.appendChild(row);
			}
	    		return tbl;
		};

		if (cursorDate.getFullYear() === year) {
			return get365Calendar(year);
		}
	};

	document.getElementById("calendar2012").appendChild(makeCalendar(2012));
	document.getElementById("calendar2013").appendChild(makeCalendar(2013));
	document.getElementById("calendar2014").appendChild(makeCalendar(2014));
  </script>
</body>
</html>
	<html>
	<head>
	<style>
	#content {
	height:1500;
	}
	.calendar {
	background-color: #CCDDFF;
	float: left;
	height:1500;
	width:400;
	}
	td, th {
	padding:1;
	font-family:arial;
	text-align: right;
	left:10px;
	}
	#calendar2012 {align:left;}
	#calendar2013 {align:center;}
	#calendar2014 {align:right;}
	</style>
	</head>
	<body>
	<div id="content">
	<div id="calendar2012" class="calendar"></div>
	<div id="calendar2013" class="calendar"></div>
	<div id="calendar2014" class="calendar"></div>
	</div>
	<script>
	var makeCalendar = function(year) {
	var cursorDate = new Date(year, 0, 1);

	var create7DayRow = function(cellType, daySet, column1) {
	var nextRow = document.createElement("tr");
	cell = document.createElement(cellType);
	cell.appendChild(document.createTextNode(column1));
	nextRow.appendChild(cell);
	for (i = 0; i < 7; i++) {
	var cell = document.createElement(cellType);
	var dy = document.createTextNode(daySet[i]);
	cell.appendChild(dy);
	nextRow.appendChild(cell);
	}
	return nextRow;
	};

	var getNext7Days = function(jan1DayOfWeekOffset) {
	var sevenDays = ['','','','','','','',''];
	for (i = 0; i + jan1DayOfWeekOffset < 7; i++) {
	sevenDays[i + jan1DayOfWeekOffset] = cursorDate.getDate();
	cursorDate = new Date( cursorDate.getFullYear(), cursorDate.getMonth(), cursorDate.getDate() + 1 );
	}
	return sevenDays;
	};

	var get365Calendar = function(year) {
	var monthSet = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
	var weekSet = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"];
	var tbl, row, cell;

	tbl = document.createElement("table");
	row = create7DayRow("th", weekSet, year);
	tbl.appendChild(row);

	var jan1NextYear = new Date(year + 1, 0, 1);
	var jan1DayOfWeekOffset = cursorDate.getDay();
	while (cursorDate < jan1NextYear) {
	var sevenDays = getNext7Days( jan1DayOfWeekOffset );
	jan1DayOfWeekOffset = 0;
	row = create7DayRow("td", sevenDays, monthSet[cursorDate.getMonth()]);
	tbl.appendChild(row);
	}
	return tbl;
	};

	if (cursorDate.getFullYear() === year) {
	return get365Calendar(year);
	}
	};

	document.getElementById("calendar2012").appendChild(makeCalendar(2012));
	document.getElementById("calendar2013").appendChild(makeCalendar(2013));
	document.getElementById("calendar2014").appendChild(makeCalendar(2014));
	</script>
	</body>
	</html>