Template:Team:Edinburgh/Code
From 2013.igem.org
(Difference between revisions)
Hristianita (Talk | contribs) |
Hristianita (Talk | contribs) |
||
Line 122: | Line 122: | ||
} | } | ||
- | . | + | .calMonthYear { |
color = #cc0033; | color = #cc0033; | ||
+ | font-weight: bold; | ||
} | } | ||
Line 147: | Line 148: | ||
.calendar td { | .calendar td { | ||
width: 35px; | width: 35px; | ||
+ | text-align: center; | ||
} | } | ||
Line 270: | Line 272: | ||
var MonthName=["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; | var MonthName=["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]; | ||
var WeekDayName=["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday", "Sunday"]; | var WeekDayName=["Monday","Tuesday","Wednesday","Thursday","Friday","Saturday", "Sunday"]; | ||
+ | var DaysInMonth=[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31]; | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
//end Configurable parameters | //end Configurable parameters | ||
//end Global variable | //end Global variable | ||
Line 304: | Line 293: | ||
var vFirstDay; | var vFirstDay; | ||
- | calhtml = " | + | calhtml = ""; |
- | vCalHeader="<table border='1' cellpadding='1' cellspacing='1' align=\"center\" valign=\"top\">\n"; | + | vCalHeader="<table class=\"calendar\" border='1' cellpadding='1' cellspacing='1' align=\"center\" valign=\"top\">\n"; |
//Month Selector | //Month Selector | ||
- | vCalHeader+="<tr>\n<td colspan='7 | + | vCalHeader+="<tr>\n<td colspan='7'>\n"; |
vCalHeader+="<select name=\"MonthSelector\" onChange=\"javascript:Cal.SwitchMth(this.selectedIndex+5);RenderCal();\">\n"; | vCalHeader+="<select name=\"MonthSelector\" onChange=\"javascript:Cal.SwitchMth(this.selectedIndex+5);RenderCal();\">\n"; | ||
for (i=5;i<10;i++) | for (i=5;i<10;i++) | ||
Line 316: | Line 305: | ||
else | else | ||
SelectStr=""; | SelectStr=""; | ||
- | vCalHeader+="<option "+SelectStr+" | + | vCalHeader+="<option "+SelectStr+" >"+MonthName[i]+"\n"; |
} | } | ||
- | vCalHeader+="</select></td>"; | + | vCalHeader+="</select></td></tr>"; |
//Calendar header shows Month and Year | //Calendar header shows Month and Year | ||
- | vCalHeader+="<tr><td colspan='7' | + | vCalHeader+="<tr><td class=\"calMonthYear\" colspan='7'>"+Cal.GetMonthName()+" "+Cal.Year+"</td></tr>\n"; |
//Week day header | //Week day header | ||
- | vCalHeader+="<tr | + | vCalHeader+="<tr class=\"header\">"; |
for (i=0;i<7;i++) | for (i=0;i<7;i++) | ||
{ | { | ||
- | vCalHeader+="<td | + | vCalHeader+="<td >" +WeekDayName[i].substr(0,3)+ "</td>"; |
} | } | ||
vCalHeader+="</tr>"; | vCalHeader+="</tr>"; | ||
Line 331: | Line 320: | ||
//Calendar detail | //Calendar detail | ||
- | + | vFirstDay=new Date(Cal.Year,Cal.Month, 1);.getDay(); | |
- | + | ||
- | + | ||
vCalData="<tr>"; | vCalData="<tr>"; | ||
if (vFirstDay==0) vFirstDay = 7; | if (vFirstDay==0) vFirstDay = 7; | ||
- | |||
for (i=0;i<vFirstDay-1;i++) | for (i=0;i<vFirstDay-1;i++) | ||
{ | { | ||
if (vDayCount%7==6) | if (vDayCount%7==6) | ||
- | + | vCalData += GenCell(null,"saturday"); | |
else if (vDayCount%7==0) | else if (vDayCount%7==0) | ||
- | + | vCalData += GenCell(null,"sunday"); | |
else | else | ||
- | + | vCalData += GenCell(null,"weekday"); | |
- | + | ||
vDayCount=vDayCount+1; | vDayCount=vDayCount+1; | ||
} | } | ||
Line 356: | Line 341: | ||
if (j==Cal.Date) | if (j==Cal.Date) | ||
{ | { | ||
- | + | vCalData += GenCell(j,"selected"); | |
} | } | ||
else | else | ||
{ | { | ||
if (vDayCount%7==6) | if (vDayCount%7==6) | ||
- | + | vCalData += GenCell(j,"saturday"); | |
else if (vDayCount%7==0) | else if (vDayCount%7==0) | ||
- | + | vCalData += GenCell(j,"sunday"); | |
else | else | ||
- | + | vCalData += GenCell(j,"weekday"); | |
} | } | ||
- | |||
if((vDayCount%7==0)*(j<Cal.GetMonDays())) | if((vDayCount%7==0)*(j<Cal.GetMonDays())) | ||
Line 377: | Line 361: | ||
//end time picker | //end time picker | ||
calhtml += "\n</table>"; | calhtml += "\n</table>"; | ||
- | |||
document.getElementById("calendarPicker").innerHTML = calhtml; | document.getElementById("calendarPicker").innerHTML = calhtml; | ||
} | } | ||
- | function GenCell(pValue, | + | function GenCell(pValue, css_class)//Generate table cell with value |
{ | { | ||
- | + | return "<td class='" + css_class + "'><a href=\"javascript:if(" + PValue + ")Cal.Date="+PValue+"; RenderCal();\">"+PValue+"</a></td>"; | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
} | } | ||
Line 414: | Line 375: | ||
this.Month=pDate.getMonth();//selected month number | this.Month=pDate.getMonth();//selected month number | ||
this.Year=pDate.getFullYear();//selected year in 4 digits | this.Year=pDate.getFullYear();//selected year in 4 digits | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
} | } | ||
- | |||
function SwitchMth(intMth) | function SwitchMth(intMth) | ||
Line 441: | Line 389: | ||
function GetMonDays()//Get number of days in a month | function GetMonDays()//Get number of days in a month | ||
{ | { | ||
- | |||
return DaysInMonth[this.Month]; | return DaysInMonth[this.Month]; | ||
} | } | ||
Calendar.prototype.GetMonDays=GetMonDays; | Calendar.prototype.GetMonDays=GetMonDays; | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
$(function() { | $(function() { |
Revision as of 10:30, 29 September 2013