Template:Team:Edinburgh/Calendar

From 2013.igem.org

<script type="text/javascript"> //Javascript name: My Date Time Picker //Date created: 16-Nov-2003 23:19 //Scripter: TengYong Ng //Website: http://www.rainforestnet.com //Copyright (c) 2003 TengYong Ng //FileName: DateTimePicker.js //Version: 0.8 //Contact: contact@rainforestnet.com // Note: Permission given to use this script in ANY kind of applications if // header lines are left unchanged.

//Global variables var dtToday=new Date("June 24, 2013 00:00:00"); var Cal; var MonthName=["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; var WeekDayName=["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday", "Sunday"];

//Configurable parameters var WeekChar=3;//number of character for week day. if 2 then Mo,Tu,We. if 3 then Mon,Tue,Wed. var CellWidth=40;//Width of day cell.

var MonthYearColor="#cc0033";//Font Color of Month and Year in Calendar header. var WeekHeadColor="#0099CC";//Background Color in Week header. var SundayColor="#6699FF";//Background color of Sunday. var SaturdayColor="#CCCCFF";//Background color of Saturday. var WeekDayColor="white";//Background color of weekdays. var FontColor="blue";//color of font in Calendar day cell. var TodayColor="#FFFF33";//Background color of today. var SelDateColor="#FFFF99";//Backgrond color of selected date in textbox. var YrSelColor="#cc0033";//color of font of Year selector. var ThemeBg="";//Background image of Calendar window. //end Configurable parameters //end Global variable var calhtml = "";

function NewCal() { Cal=new Calendar(dtToday); RenderCal(); }

function RenderCal() { var vCalHeader; var vCalData; var i, j; var SelectStr; var vDayCount=0; var vFirstDay;

calhtml = "<form name='Calendar'>";

vCalHeader="\n"; //Month Selector vCalHeader+="\n
"; //Calendar header shows Month and Year vCalHeader+="\n";

//Week day header

vCalHeader+=""; for (i=0;i<7;i++) { vCalHeader+="";

}

vCalHeader+=""; calhtml += vCalHeader; //Calendar detail CalDate=new Date(Cal.Year,Cal.Month); CalDate.setDate(1); vFirstDay=CalDate.getDay(); vCalData=""; if (vFirstDay==0) vFirstDay = 7; for (i=0;i<vFirstDay-1;i++) { vCalData=vCalData+GenCell(); vDayCount=vDayCount+1; } for (j=1;j<=Cal.GetMonDays();j++) { var strCell; vDayCount=vDayCount+1; if (j==Cal.Date) { strCell=GenCell(j,true,SelDateColor); } else { if (vDayCount%7==0) strCell=GenCell(j,false,SaturdayColor); else if ((vDayCount+6)%7==0) strCell=GenCell(j,false,SundayColor); else strCell=GenCell(j,null,WeekDayColor); } vCalData=vCalData+strCell; if((vDayCount%7==0)&&(j<Cal.GetMonDays())) { vCalData=vCalData+"\n"; } } calhtml += vCalData; //end time picker calhtml += "\n
\n";

vCalHeader+="<select name=\"MonthSelector\" onChange=\"javascript:Cal.SwitchMth(this.selectedIndex+5);RenderCal();\">\n"; for (i=5;i<10;i++) { if (i==Cal.Month) SelectStr="Selected"; else SelectStr=""; vCalHeader+="<option "+SelectStr+" value >"+MonthName[i]+"\n"; }

vCalHeader+="</select>
"+Cal.GetMonthName()+" "+Cal.Year+"
"+WeekDayName[i].substr(0,WeekChar)+"
";

calhtml += "</form>"; document.getElementById("calendarPicker").innerHTML = calhtml; }

function GenCell(pValue,pHighLight,pColor)//Generate table cell with value { var PValue; var vColor; var vHLstr1;//HighLight string var vHlstr2; var vTimeStr;

if (pValue==null) PValue=""; else PValue=pValue;

if (pColor!=null) vColor="bgcolor=\""+pColor+"\""; else vColor=""; if ((pHighLight!=null)&&(pHighLight)) {vHLstr1="color='red'>";vHLstr2="";} else {vHLstr1=">";vHLstr2="";}


var PCellStr="<td "+vColor+" width="+CellWidth+" align='center'><font face='verdana' size='2'"+vHLstr1+"<a href=\"javascript:alert(5)\">"+PValue+"</a>"+vHLstr2+"</font></td>"; return PCellStr; }

function Calendar(pDate) { //Properties this.Date=pDate.getDate();//selected date this.Month=pDate.getMonth();//selected month number this.Year=pDate.getFullYear();//selected year in 4 digits

this.Format="ddMMyyyy"; this.Separator="/"; }

function GetMonthIndex(shortMonthName) { for (i=0;i<12;i++) { if (MonthName[i].substring(0,3).toUpperCase()==shortMonthName.toUpperCase()) { return i;} } } Calendar.prototype.GetMonthIndex=GetMonthIndex;

function SwitchMth(intMth) { Cal.Month=intMth;} Calendar.prototype.SwitchMth=SwitchMth;

function GetMonthName() { return MonthName[this.Month]; } Calendar.prototype.GetMonthName=GetMonthName;

function GetMonDays()//Get number of days in a month { var DaysInMonth=[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; return DaysInMonth[this.Month]; } Calendar.prototype.GetMonDays=GetMonDays;

function FormatDate(pDate) { if (this.Format.toUpperCase()=="DDMMYYYY") return (pDate+DateSeparator+(this.Month+1)+DateSeparator+this.Year); else if (this.Format.toUpperCase()=="DDMMMYYYY") return (pDate+DateSeparator+this.GetMonthName(false)+DateSeparator+this.Year); else if (this.Format.toUpperCase()=="MMDDYYYY") return ((this.Month+1)+DateSeparator+pDate+DateSeparator+this.Year); else if (this.Format.toUpperCase()=="MMMDDYYYY") return (this.GetMonthName(false)+DateSeparator+pDate+DateSeparator+this.Year); } Calendar.prototype.FormatDate=FormatDate;

<script>