//var myCalendar=new JsCalendar({options});
//myCalendar.show();
var JsCalendar = Class.create();
JsCalendar.prototype = {
  initialize: function(options) {
		this.getid();
		Object.extend(this.options,options||{});
		this.show=this.active.bind(this);		
		this.hide=this.deActive.bind(this);		
		this.create();
  },
  getid:function(){
		this.id="Js"+Math.round(Math.random()*100);
		while ($(this.id)){
			this.id="Js"+Math.round(Math.random()*100);
		}		
  },
	options:{
		tagObj:null,
		onSelect:null
	},
	padStyle:'position:absolute;top:60px;left:600px;width:240px;height:150px;border:solid 1px #72b8c2;display:none;background-color:#FFFFFF;z-index:500;',
	frameStyle:'position:absolute;top:60px;left:600px;width:242px;height:152px;display:none;z-index:400; background-color: transparent;',
	headStyle:'height:20px;line-height:20px;padding:0px 0px 2px 0px;border-bottom:solid 1px #72b8c2;',
	wheadStyle:'height:22px;line-height:22px;background-color: #FFDFAA;padding:0px 0px 0px 10px;',
	wtitleStyle:'margin:0px 10px 0px 10px;',
	calendarStyle:'float:left;width:16px;margin:4px 0px 0px 16px;text-align: right;',
	calendarStyle1:'float:left;width:16px;margin:4px 0px 0px 16px;text-align: right;background-color:red;',
	year:(new Date()).getFullYear(),
	month:(new Date()).getMonth()+1,
	toDay:new Date().toFormatString("yyyy-mm-dd"),
  create:function(){
		var tmp='<iframe id='+this.id+'frame'+' frameborder="no" style="'+this.frameStyle+'"></iframe>';
		tmp+='<div id="'+this.id+'" style="'+this.padStyle+'">';
		tmp+='<div style="'+this.headStyle+'"><span style="margin:0px 4px 0px 6px;"><a id="'+this.id+'prevyear'+'" href="javascript:void(0);" style="margin:0px 4px 0px 4px;">&#171;上年</a><a id="'+this.id+'prev'+'" href="javascript:void(0);" style="margin:0px 4px 0px 4px;">&#8249;上月</a></span>';
		tmp+='<span id="'+this.id+'head'+'"></span>';
		tmp+='<span style="margin:0px 4px 0px 4px;"><a id="'+this.id+'next'+'" href="javascript:void(0);" style="margin:0px 4px 0px 4px;">下月&#8250;</a><a id="'+this.id+'nextyear'+'" href="javascript:void(0);" style="margin:0px 0px 0px 4px;">下年&#187;</a></span></div>';
		tmp+='<p style="'+this.wheadStyle+'"><span style="'+this.wtitleStyle+'">日</span><span style="'+this.wtitleStyle+'">一</span><span style="'+this.wtitleStyle+'">二</span><span style="'+this.wtitleStyle+'">三</span><span style="'+this.wtitleStyle+'">四</span><span style="'+this.wtitleStyle+'">五</span><span style="'+this.wtitleStyle+'">六</span></p>';
		tmp+='<div style="float:left;width:100%;height:auto;background-color:#FFFBF0;" id="'+this.id+'calendar'+'"><p style="width:100%;height:16px;"><span style="'+this.calendarStyle+'"><a name="calendarA" href="javascript:void(0);">'+1+'</a></span></p>';
		tmp+='<p style="width:100%;height:16px;"><span style="'+this.calendarStyle+'"><a name="calendarA" href="javascript:void(0);">'+2+'</a></span></p>';
		tmp+='</div>';
		tmp+='<p style="text-align: center;height:16px;line-height:16px;">今天是'+this.toDay+'</p></div>';
		new Insertion.Bottom(document.body,tmp);
		var position = Position.cumulativeOffset(this.options.tagObj);
		position[1]+=Element.getHeight(this.options.tagObj)+1;
		position[0]+=1;
		this.resetPosition(position);
		this.resetCalendar(this.year,this.month);
		
		$(this.id).onmouseover=this.show;
		$(this.id).onmouseout=this.hide;
		$(this.id+'next').onclick=this.nextMonth.bind(this);
		$(this.id+'prev').onclick=this.prevMonth.bind(this);
		$(this.id+'nextyear').onclick=this.nextYear.bind(this);
		$(this.id+'prevyear').onclick=this.prevYear.bind(this);
  },
  nextMonth:function(){
		this.month++;
		if(this.month==13){
			this.year++;
			this.month=1;
		}
		this.resetCalendar(this.year,this.month);
  },
  prevMonth:function(){
		this.month--;
		if(this.month==0){
			this.year--;
			this.month=12;
		}
		this.resetCalendar(this.year,this.month);
  },
  nextYear:function(){
		this.year++;
		this.resetCalendar(this.year,this.month);
  },
  prevYear:function(){
		this.year--;
		this.resetCalendar(this.year,this.month);
  },
  resetCalendar:function(theYear, theMonth){
		var days=this.getMonthLen(theYear,theMonth);
		var week=this.getFirstDay(theYear,theMonth);
		var tmp='';
		var j=0;
		for(var i=0-week;i<days;i++){
			if(i<0)
				tmp+=(j==0?'<p style="width:100%;height:16px;">':'')+'<span style="'+this.calendarStyle+'"></span>';
			else{
				if(this.year+'-'+this.month+'-'+(i+1)==this.toDay)
					tmp+=(j==0?'<p style="width:100%;height:16px;">':'')+'<span style="'+this.calendarStyle1+'">'+'<a name="calendarA" href="javascript:void(0);">'+(i+1)+'</a></span>';
				else
					tmp+=(j==0?'<p style="width:100%;height:16px;">':'')+'<span style="'+this.calendarStyle+'">'+'<a name="calendarA" href="javascript:void(0);">'+(i+1)+'</a></span>';
			}
			j++;
			if(j==7){
				tmp+='</p>';
				j=0;
			}
		}
		tmp+=(j<=7?'':'</p>');
		
		$(this.id+'head').innerHTML=this.year+'年'+this.month+'月';
		$(this.id+'calendar').innerHTML=tmp;
		var nodes=document.getElementsByName('calendarA');
		for(var n=0;n<nodes.length;n++){
			nodes[n].onclick=this.onSelect.bind(this,n+1);
		}
  },
	getFirstDay:function(theYear, theMonth){
		var firstDate = new Date(theYear,theMonth-1,1);
		return firstDate.getDay();
	},
  getMonthLen:function(theYear, theMonth){
	   theMonth--;
		 var oneDay = 1000 * 60 * 60 * 24;
		var thisMonth = new Date(theYear, theMonth, 1);
		var nextMonth = new Date(theYear, theMonth + 1, 1);
		var len = Math.ceil((nextMonth.getTime() - thisMonth.getTime())/oneDay);
		return len;
  },
  resetPosition:function(position){
		$(this.id+'frame').style.top=position[1]+'px';
		$(this.id).style.top=position[1]+'px';
		$(this.id+'frame').style.left=position[0]+'px';
		$(this.id).style.left=position[0]+'px';
  },
  active:function(){
		Element.show($(this.id+'frame'));
		Element.show($(this.id));
  },
  deActive:function(){
		Element.hide($(this.id+'frame'));
		Element.hide($(this.id));
  },
  onSelect:function(ccc){
		ccc=this.year+'-'+this.month+'-'+ccc;
		var nnn=this.options.onSelect;
		this.hide();
		nnn(ccc);
  }
}