﻿// JScript 文件

// animation calendar
var _week=new Array("Sun","Mon","Tur","Wen","Thu","Fri","Sat");
var length = new Array(31,29,31,30,31,30,31,31,30,31,30,31);
var _ignro=false;
var _crt=0;         //0-Y,1-M,2-D
var _format=2;      //0-Y,1-M,2-D
var _tag;           //for binding   obj because the id of control may be null
var _crtyear,_crtmonth;

function myCalendar()
{  
    this.Create=createCalendar;
    var myDate = new Date();
    _crtyear = myDate.getFullYear();
    _crtmonth = myDate.getMonth()+1;
}
function createCalendar()
{
    setStyle();
    makeCalendar();
}

function setStyle()
{
    style=".sat{font-size:12px;color:#FF0000;}"+
        ".sun{font-size:12px;color:#FF69B4;}"+
        ".mover{background-color:#EDF9FF; color:#FF00FF;cursor:hand;font-size:12px}"+
        ".outer{ color:#0066CC;font-size:12px}"+
        ".cs{position:absolute;border:1px solid #646464;width:170px;left:0px;top:0px;z-index:9999;overflow:hidden;background-color:#FFFFFF; }"+
        ".cal_header{CURSOR: hand; vertical-align:middle;color:#0066CC;font-family: Arial;z-index:9999;}";
    document.write("<style type='text/css'>");
    document.write(style);
    document.write("</style>");
}
function makeCalendar()
{    
    var obj=document.getElementById("topdiv");      // new 
    if(obj!=null) return;               //the topdiv has created ,so we return and don't cretae again
    
    var syear=_crtyear;
    var eyear=parseInt(_crtyear)+11;
    //main
    document.write("<div class=\"cs\"  onselectstart='return false' oncontextmenu='return false' style=\"display:none\" id='topdiv'> <table width=\"100%\">");
    
    //head
    document.write("<tr><td><table width=\"168px\" id=\"yeartablehead\" class=\"outer\"> <tr>");
    
    //left handle
    document.write("<td align=\"left\" style=\"CURSOR: hand; FONT-FAMILY: Webdings;color:#0066CC; left:1px; position:relative;\" onclick=\"AddEx(0);\">3</td>");//left end
    
    //center
    document.write("<td colspan=\"2\" align=\"center\" class=\"cal_header\" onclick=\"Return();\">");
    document.write(syear+"-"+eyear+"</td>");    //2004-2015 center end
    document.write(" <td align=\"right\" style=\"CURSOR: hand; FONT-FAMILY: Webdings;color:#0066CC\" onclick=\"AddEx(1);\">4</td></tr>");//top head end
    
   
    document.write("</table></td></tr>"); //main end
    
    //body
    //datediv
     document.write("<tr><td ><div id=\"datediv\" style=\"width:170px; height:135px; overflow:hidden;\">");
    //yeardiv
     document.write("<div id=\"yeardiv\" style=\"left:-170px; top:0px; position:relative;width:510px;z-index:9998;\">");
     // year body
     document.write("<table width=\"100%\"><tr>");     
     // pre year
     document.write("<td><table  id=\"tbPre\" class=\"outer\">");    
     
     var _psyear=parseInt(_crtyear)-12;  
     outYear(_psyear);
    
     // crt year
     document.write("<td><table  id=\"tbCrt\" class=\"outer\">"); 
     outYear(_crtyear);  
    
    // next year
    document.write("<td><table  id=\"tbNxt\" class=\"outer\">");     
    var _nsyear=parseInt(_crtyear)+12;  
    outYear(_nsyear);        
    document.write("</tr></table></div>");   // year div end
    
    // month div
    document.write("<div id=\"monthdiv\" style=\"left:-170px; top:-300px; position:relative;width:510px;z-index:9991; display:none\">")
    // month body
     document.write("<table width=\"510\"><tr>");  
    //pre month
     document.write("<td> <table  id=\"tbmonthPre\" class=\"outer\" >");  
     outMonth();
     
      //crt month
     document.write("<td> <table  id=\"tbmonthCrt\" class=\"outer\" >");     
     outMonth();                   
     //next month
     document.write("<td> <table  id=\"tbmonthNxt\" class=\"outer\" >");  
     outMonth();     
     document.write("</tr></table></div>");   // month div end
    
     // day div
     document.write("<div id=\"daydiv\" style=\"left:-170px; top:0px; position:relative;width:510px;z-index:9980; display:none\">")
     // day body
     document.write("<table width=\"510\"><tr>");  
     
     //pre week
     document.write("<td style=\"width:170px;\"> <table  id=\"tbdayPre\" class=\"outer\"  width=\"163px\">");  
     outWeek(); 
     
     //crt week
     document.write("<td style=\"width:170px;\"> <table  id=\"tbdayCrt\" class=\"outer\"  width=\"163px\">");  
     outWeek(); 
     
     //next week
     document.write("<td style=\"width:170px;\"> <table  id=\"tbdayNxt\" class=\"outer\"  width=\"163px\">");  
     outWeek(); 
     
     document.write("</tr></table></div>");   // day div end    
     document.write("</div>");                // date div end       
     document.write("</td>");                 // date td end  
     document.write("</tr>");                 // date td end     
     // footer  
     //today
     document.write("<tr><td><table width=\"100%\"><tr><td class=\"cal_header\" onclick=\"cls();\">CLS</td>");
     document.write("<td align=\"center\" class=\"cal_header\" onclick=\"exitByToDay();\">Today</td>"); 
     document.write("<td align=\"center\" class=\"cal_header\" onclick=\"hideMe();\"> Close</td></tr></table></td></tr>");      
     document.write("</table>");              // main table end
     document.write("</div>");                // top div end
}

function outYear(syear)
{
     var _syear=parseInt(syear);  
     //start year
     document.write("<tr><td onmouseover=\"mOver(this)\" onclick=\"getMonth(this);\" onmouseout=\"mOut(this)\" style=\" width:38px; height:38px;\" align=\"center\" >");
     document.write(_syear+"</td>");   
     for( var i=1;i<12;i++)
     {  
         j=_syear+i
         if(i%4==0)
         {
            document.write("</tr><tr><td onmouseover=\"mOver(this)\" onclick=\"getMonth(this);\" onmouseout=\"mOut(this)\" style=\" width:38px; height:38px;\" align=\"center\" >");
            document.write(j+"</td>");
         }
         else
         {
             document.write("<td onmouseover=\"mOver(this)\" onclick=\"getMonth(this);\" onmouseout=\"mOut(this)\" style=\" width:38px; height:38px;\" align=\"center\" >");
             document.write(j+"</td>");
         }
     }
    document.write("</tr></table></td>");    //year end
}
function outMonth()
{
    //start month
     document.write("<tr><td onmouseover=\"mOver(this)\" onclick=\"getDay(this)\" onmouseout=\"mOut(this)\" style=\" width:38px; height:38px;\" align=\"center\" >1</td>");     
     for( var i=1;i<12;i++)
     {   
          j=i+1;
         if(i%4==0)
         {
            document.write("</tr><tr><td onmouseover=\"mOver(this)\" onclick=\"getDay(this)\" onmouseout=\"mOut(this)\" style=\" width:38px; height:38px;\" align=\"center\" >");
            document.write(j+"</td>");
         }
         else
         {
             document.write("<td onmouseover=\"mOver(this)\" onclick=\"getDay(this)\" onmouseout=\"mOut(this)\" style=\" width:38px; height:38px;\" align=\"center\" >");
             document.write(j+"</td>");
         }
     }
    document.write("</tr></table></td>");    //pre month end
}
function outWeek()
{
     //day head
     document.write("<tr>");
     document.write("<td align=\"center\"  onmouseover=\"mOver(this)\" onmouseout=\"mOutsun(this)\" class=\"sun\">"+_week[0]+"</td>");    //sun
     for(var i=1;i<6;i++)
     {
         document.write("<td align=\"center\" onmouseover=\"mOver(this)\"  onmouseout=\"mOut(this)\" >"+ _week[i]+"</td>");       
     }
     document.write("<td align=\"center\" onmouseover=\"mOver(this)\" onmouseout=\"mOutsat(this)\" class=\"sat\">"+_week[6]+"</td>");    //sat
     document.write("</tr>"); //head end
     
     // body 
     for(var k=0;k<6;k++)
     {
         document.write("<tr>"); //body start
         document.write("<td align=\"center\"  onmouseover=\"mOver(this)\" onmouseout=\"mOutsun(this)\" onclick=\"exitByDay(this)\" class=\"sun\">&nbsp;</td>");   //sun
         for(var i=1;i<6;i++)
         {
             document.write("<td align=\"center\" onmouseover=\"mOver(this)\"  onmouseout=\"mOut(this)\" onclick=\"exitByDay(this)\" >&nbsp;</td>");       
         }
         document.write("<td align=\"center\" class=\"sat\" onmouseover=\"mOver(this)\" onmouseout=\"mOutsat(this)\" onclick=\"exitByDay(this)\" >&nbsp;</td>"); //sat
         document.write("</tr>"); //body end  
     }
      document.write("</table></td>"); //day end  
                                                 
}

// function

function mOut(obj){obj.className = '';}
function mOver(obj){obj.className = 'mover';}
function mOutsat(obj){obj.className = 'sat';}
function mOutsun(obj){obj.className = 'sun';}
function AddEx(_act)
{
    if(_ignro) return;  
    _ignro=true;
    var objid;
    switch(_crt)
    {
        case 0:
            objid="yeardiv";break;
        case 1:
            objid="monthdiv";break;
        case 2:
            objid="daydiv";break;
        default:
            break;
    } 
    if(_act)
        Add(objid);
    else
        Sub(objid);
}

function Sub(objid)
{     
    var obj=document.getElementById(objid);
    if(parseInt(obj.style.left)<0)
    {
        obj.style.left=parseInt(obj.style.left)+10;
       
        setTimeout("Sub(\""+objid+"\")",10);
    }
    else
    {
       // var mod=
        AnimationSubEnd();
    }
    
}
function Add(objid)
{     
    var obj=document.getElementById(objid);
    if(parseInt(obj.style.left)>-340)
    {
        obj.style.left=parseInt(obj.style.left)-10;
       
        setTimeout("Add(\""+objid+"\")",10);
    }
    else
    {
        AnimationAddEnd();
    }
    
}
function AnimationAddEnd()
{ 
     switch(_crt)
    {
        case 0:
              AniEnd();
              break;
        case 1:
              _crtyear++;
              MonthEnd();
              break;
        case 2:
              dayEnd();
              break;
        default:
            break;
    } 
    _ignro=false;
}

function AnimationSubEnd()
{ 
     switch(_crt)
    {
        case 0:
              AniEndS();
              break;
        case 1:
              _crtyear--;
              MonthEnd();
              break;
        case 2:
              dayEndS();
              break;
        default:
            break;
    } 
    _ignro=false;
}

function MonthEnd()
{
    monthdiv.style.left=-170;    
    yeartablehead.cells[1].innerText=_crtyear;
}

function dayEnd()
{
    //init
    if(_crtmonth==12) 
    {
        _crtmonth=1
        _crtyear++;
    }
    else
         _crtmonth++;
    
    var _tempyear=_crtyear;
    
    var _pre=document.getElementById("tbdayPre");
    var _curt=document.getElementById("tbdayCrt");
    var _nxt=document.getElementById("tbdayNxt");
    
    for(i=7;i<_pre.cells.length;i++)
    {
        _pre.cells[i].innerText=_curt.cells[i].innerText;
        _curt.cells[i].innerText=_nxt.cells[i].innerText;
    }
        
    //闰年?
    length[1] = ((_crtyear%4==0)&&(_crtyear%100!=0)||(_crtyear%400==0))?29:28;
    
    //当前月的后一个月
    var _nxtmonth=_crtmonth+1;
    if(_crtmonth==12)
    {
        _nxtmonth=1;
        _tempyear++;
    }
         
    var myDate = new Date(_tempyear,_nxtmonth-1,1);
    var day=myDate.getDay();
    
    for(i=7;i<_nxt.cells.length;i++)_nxt.cells[i].innerHTML = "&nbsp;";
    for(i=0;i<length[_nxtmonth-1];i++)
    {
        _nxt.cells[i+7+day].innerHTML = (i+1);
    }
    // update head    
    daydiv.style.left=-170;    
    yeartablehead.cells[1].innerText=_crtyear+"-"+_crtmonth;
}
function dayEndS()
{
    //init
    if(_crtmonth==1) 
    {
        _crtmonth=12
        _crtyear--;
    }
    else
         _crtmonth--;
     var _tempyear=_crtyear;
     
    var _pre=document.getElementById("tbdayPre");
    var _curt=document.getElementById("tbdayCrt");
    var _nxt=document.getElementById("tbdayNxt");
   
    for(i=7;i<_pre.cells.length;i++)
    {
        _nxt.cells[i].innerText=_curt.cells[i].innerText;
        _curt.cells[i].innerText=_pre.cells[i].innerText;
        
    }
    
    //闰年
    length[1] = ((_crtyear%4==0)&&(_crtyear%100!=0)||(_crtyear%400==0))?29:28;
    for(i=7;i<_pre.cells.length;i++)_pre.cells[i].innerHTML = "&nbsp;";
    
    //当前月的前一个月
    var _premonth=_crtmonth-1;
    if(_crtmonth==1)
    {
         _premonth=12;        
         _tempyear--;
    }
    var myDate = new Date(_tempyear,_premonth-1,1);
    var day=myDate.getDay();
    
    for(i=0;i<length[_premonth-1];i++)
    {
        _pre.cells[i+7+day].innerHTML = (i+1);
    }
    // update head    
    daydiv.style.left=-170;    
    yeartablehead.cells[1].innerText=_crtyear+"-"+_crtmonth;
}
function AniEnd()
{
    var _pre=document.getElementById("tbPre");
    var _curt=document.getElementById("tbCrt");
    var _nxt=document.getElementById("tbNxt");
    var _crt=parseInt(_nxt.cells[0].innerText)+12;
    for(i=0;i<_pre.cells.length;i++)
    {
        _pre.cells[i].innerText=_curt.cells[i].innerText;
        _curt.cells[i].innerText=_nxt.cells[i].innerText;
        _nxt.cells[i].innerText=_crt+i;
    }
    
    yeardiv.style.left=-170;
    // update head
    var _crt=parseInt(_curt.cells[0].innerText);
    var _end=_crt+11;
    yeartablehead.cells[1].innerText=_crt+"-"+_end;
}

function AniEndS()
{
    var _pre=document.getElementById("tbPre");
    var _curt=document.getElementById("tbCrt");
    var _nxt=document.getElementById("tbNxt");
    var _crt=parseInt(_pre.cells[0].innerText)-12;
    for(i=0;i<_pre.cells.length;i++)
    {
        _nxt.cells[i].innerText=_curt.cells[i].innerText;
        _curt.cells[i].innerText=_pre.cells[i].innerText;
        _pre.cells[i].innerText=_crt+i;
    }
    yeardiv.style.left=-170;
    // update head
    var _crt=parseInt(_curt.cells[0].innerText);
    var _end=_crt+11;
    yeartablehead.cells[1].innerText=_crt+"-"+_end;
}
function getMonth(obj)
{
    _crtyear=obj.innerText;
    if(_format==0)
    {
        setValue(_crtyear);
        return;
    }
    yeartablehead.cells[1].innerText=_crtyear;
    monthdiv.style.display="";
    monthdiv.style.top=-300;
    _ignro=true;
    AniMonth();
}

function AniMonth()
{
    if(parseInt(monthdiv.style.top)<-135)
    {
        monthdiv.style.top=parseInt(monthdiv.style.top)+10;
        yeardiv.style.top=parseInt(yeardiv.style.top)+10;
        setTimeout("AniMonth()",10);
    }
    else
    {
        AniMEnd();
    }
}

function AniMEnd()
{
    _crt=1;
    _ignro=false;
    yeardiv.style.display="none";
    monthdiv.style.top="0px";
}
function getDay(obj)
{
    _crtmonth=parseInt(obj.innerText);
    if(_format==0)
    {
        setValue(_crtyear);
        return;
    }
    if(_format==1)
    {
        setValue(_crtyear+"-"+_crtmonth);
        return;
    }
    yeartablehead.cells[1].innerText=_crtyear+"-"+_crtmonth;    
    daydiv.style.display="";
    _ignro=true;
    InitDay();
    AniDay();
}

function AniDay()
{
    if(parseInt(daydiv.style.top)>-130)
    {
        daydiv.style.top=parseInt(daydiv.style.top)-10;
        monthdiv.style.top=parseInt(monthdiv.style.top)-10;
        setTimeout("AniDay()",10);
    }
    else
    {
        AniDEnd();
    }
}
function AniDEnd()
{
    _crt=2;
    _ignro=false;
    monthdiv.style.display="none";
    monthdiv.style.top="-300px";
    daydiv.style.top="0px";
}
function InitDay()
{
    var _pre=document.getElementById("tbdayPre");
    var _curt=document.getElementById("tbdayCrt");
    var _nxt=document.getElementById("tbdayNxt");     
    var _tempyear=_crtyear;
    
    //闰年
    length[1] = ((_crtyear%4==0)&&(_crtyear%100!=0)||(_crtyear%400==0))?29:28;
   
    
    //当前月的前一个月
    var _premonth=_crtmonth-1;
    if(_crtmonth==1)
        {
            _premonth=12;        
            _tempyear--;
        }
    var myDate = new Date(_tempyear,_premonth-1,1);
    var day=myDate.getDay();
    
    for(i=7;i<_pre.cells.length;i++)_pre.cells[i].innerHTML = "&nbsp;";
    
    for(i=0;i<length[_premonth-1];i++)
    {
        _pre.cells[i+7+day].innerHTML = (i+1);
    }           
     myDate = new Date(_crtyear,_crtmonth-1,1);
     day=myDate.getDay();
    
    for(i=7;i<_curt.cells.length;i++)_curt.cells[i].innerHTML = "&nbsp;";
    for(i=0;i<length[_crtmonth-1];i++)
    {
        _curt.cells[i+7+day].innerHTML = (i+1);
    }
    
    //当前月的后一个月
    var _nxtmonth=_crtmonth+1;
    if(_crtmonth==12)
       {
            _nxtmonth=1;
            _tempyear++;
        }
         
    myDate = new Date(_tempyear,_nxtmonth-1,1);
    day=myDate.getDay();
    
    for(i=7;i<_nxt.cells.length;i++)_nxt.cells[i].innerHTML = "&nbsp;";
    for(i=0;i<length[_nxtmonth-1];i++)
    {
        _nxt.cells[i+7+day].innerHTML = (i+1);
    }
}
function Return()
{   
    switch(_crt)
    {
        case 0:
            break;
        case 1:
            ReturnToYear();break;
        case 2:
            ReturnToMonth();break;
        default:
            break;
    } 
}
function ReturnToMonth()
{
    monthdiv.style.display="";
    monthdiv.style.top="-130px";
    MakeMonth();
}
function ReturnToYear()
{
    yeardiv.style.display="";
    yeardiv.style.top="130px";
    MakeYear();
}
function MakeMonth()
{
    yeartablehead.cells[1].innerText=_crtyear;
    _ignro=true;   
    AniDayUp();
}

function AniDayUp()
{
    if(parseInt(daydiv.style.top)<130)
    {
        daydiv.style.top=parseInt(daydiv.style.top)+10;
        monthdiv.style.top=parseInt(monthdiv.style.top)+10;
        setTimeout("AniDayUp()",10);
    }
    else
    {
        AniDEndUp();
    }
}
function AniDEndUp()
{
    _crt=1;
     daydiv.style.display="none";
    _ignro=false;
}

function MakeYear()
{
    var _curt=document.getElementById("tbCrt");
    var _syear=parseInt(_curt.cells[0].innerText);
    var _endyear=_syear+11;
    yeartablehead.cells[1].innerText=_syear+"-"+_endyear;
    _ignro=true;   
    AniYearUp();
}

function AniYearUp()        //上去
{
    if(parseInt(yeardiv.style.top)>0)
    {
        yeardiv.style.top=parseInt(yeardiv.style.top)-10;
        monthdiv.style.top=parseInt(monthdiv.style.top)-10;
        setTimeout("AniYearUp()",10);
    }
    else
    {
        AniYEndUp();
    }
}
function AniYEndUp()
{
    _crt=0;
     monthdiv.style.display="none";
    _ignro=false;
}
function setValue(text)
{
    _tag.innerText=text;
    hideMe();
}
function exitByDay(obj)
{
    var _day=obj.innerText;
    if(_day==" ") return;
    var text=_crtyear;
    if(_format==1)
        text= _crtyear+"-"+_crtmonth;
    else if(_format==2)
        text= _crtyear+"-"+_crtmonth+"-"+_day;
    setValue(text);
}
function exitByToDay()
{
    var _date=new Date();
    var _year=_date.getFullYear();
    var _month=_date.getMonth()+1;
    var _day=_date.getDate();
    if(_format==0)
    {
        setValue(_year);
        return;
    }
     if(_format==1)
    {
        setValue(_date.getFullYear()+"-"+_month);
        return;
    }
    var text= _year+"-"+_month+"-"+_day;
    setValue(text);
}
function hideMe()
{
    var obj=document.getElementById("topdiv");
    obj.style.display="none";
    //document.getElementById(_tag).onblur="";    //cancel
}

function showCalendar(obj,format)
{
_tag=obj;
_format=format; //0-Y 1-M 2-D
makeFormat();
var xy=GetAbsoluteLocationEx(obj);
//adjust
var _height=parseInt(document.body.clientHeight);
var _totalH=parseInt(xy.absoluteTop)+ parseInt(obj.offsetHeight)+200;
var _crtTop;
if(_totalH>_height&&parseInt(xy.absoluteTop)>200)_crtTop=parseInt(xy.absoluteTop)-200;
else _crtTop=parseInt(xy.absoluteTop)+ parseInt(obj.offsetHeight);
topdiv.style.left=xy.absoluteLeft+"px";
topdiv.style.top=_crtTop + "px";
topdiv.style.display="";
}
function makeFormat()
{
    var oyear=document.getElementById("yeardiv");
    var omonth=document.getElementById("monthdiv");
    var oday=document.getElementById("daydiv");
    switch(_format)
    {
        case 0: //YY
            if(_crt==0) return;
            oyear.style.left=-170;
            oyear.style.top=0;
            oyear.style.display="block"; //yy end
            omonth.style.display="none"; //mm end
            oday.style.display="none";             
            _crt=0;       
            var _syear=parseInt(tbCrt.cells[0].innerText);
            var _endyaer=_syear+11;
            yeartablehead.cells[1].innerText=_syear+"-"+_endyaer;
            break;
        case 1: //MM         
            if(_crt!=2) return;
            omonth.style.left=-170;  
            omonth.style.top=0;
            omonth.style.display="block"; //mm end 
            oyear.style.display="none"; //yy end 
            oday.style.display="none";    
            _crt=1;     
            yeartablehead.cells[1].innerText=_crtyear;
            break;
    }
}
function cls()
{
    _tag.value="";
 }
//end

//helper
//absolute location
function GetAbsoluteLocationEx(element) 
{ 
    if ( arguments.length != 1 || element == null ) 
    { 
        return null; 
    } 
    var elmt = element; 
    var offsetTop = elmt.offsetTop; 
    var offsetLeft = elmt.offsetLeft; 
    var offsetWidth = elmt.offsetWidth; 
    var offsetHeight = elmt.offsetHeight; 
    while( elmt = elmt.offsetParent ) 
    { 
          // add this judge 
        if ( elmt.style.position == 'absolute' || elmt.style.position == 'relative'  
            || ( elmt.style.overflow != 'visible' && elmt.style.overflow != '' ) ) 
        { 
            break; 
        }  
        offsetTop += elmt.offsetTop; 
        offsetLeft += elmt.offsetLeft; 
    } 
    return { absoluteTop: offsetTop, absoluteLeft: offsetLeft, 
        offsetWidth: offsetWidth, offsetHeight: offsetHeight }; 
} 

var foolCalendar=new myCalendar;
foolCalendar.Create();
