datetimepicker.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483
  1. //Javascript name: My Date Time Picker
  2. //Date created: 16-Nov-2003 23:19
  3. //Scripter: TengYong Ng
  4. //Website: http://www.rainforestnet.com
  5. //Copyright (c) 2003 TengYong Ng
  6. //FileName: DateTimePicker.js
  7. //Version: 0.8
  8. //Contact: contact@rainforestnet.com
  9. // Note: Permission given to use this script in ANY kind of applications if
  10. // header lines are left unchanged.
  11. //Global variables
  12. var winCal;
  13. var dtToday=new Date();
  14. var Cal;
  15. var docCal;
  16. var MonthName=["OCAK", "SUBAT", "MART", "NISAN", "MAYIS", "HAZIRAN","TEMMUZ",
  17. "AGUSTOS", "EYLUL", "EKIM", "KASIM", "ARALIK"];
  18. var WeekDayName=["Pz","Pt","Sa","Cr","Pr","Cm","Ct"];
  19. var exDateTime;//Existing Date and Time
  20. //Configurable parameters
  21. var cnTop="200";//top coordinate of calendar window.
  22. var cnLeft="500";//left coordinate of calendar window
  23. var WindowTitle ="Tarih Secici";//Date Time Picker title.
  24. var WeekChar=2;//number of character for week day. if 2 then Mo,Tu,We. if 3 then Mon,Tue,Wed.
  25. var CellWidth=20;//Width of day cell.
  26. var DateSeparator="-";//Date Separator, you can change it to "/" if you want.
  27. var TimeMode=24;//default TimeMode value. 12 or 24
  28. var ShowLongMonth=true;//Show long month name in Calendar header. example: "January".
  29. var ShowMonthYear=true;//Show Month and Year in Calendar header.
  30. var MonthYearColor="#cc0033";//Font Color of Month and Year in Calendar header.
  31. var WeekHeadColor="#0099CC";//Background Color in Week header.
  32. var SundayColor="#6699FF";//Background color of Sunday.
  33. var SaturdayColor="#CCCCFF";//Background color of Saturday.
  34. var WeekDayColor="white";//Background color of weekdays.
  35. var FontColor="blue";//color of font in Calendar day cell.
  36. var TodayColor="#FFFF33";//Background color of today.
  37. var SelDateColor="#FFFF99";//Backgrond color of selected date in textbox.
  38. var YrSelColor="#cc0033";//color of font of Year selector.
  39. var ThemeBg="";//Background image of Calendar window.
  40. //end Configurable parameters
  41. //end Global variable
  42. function NewCal(pCtrl,pFormat,pShowTime,pTimeMode)
  43. {
  44. Cal=new Calendar(dtToday);
  45. if ((pShowTime!=null) && (pShowTime))
  46. {
  47. Cal.ShowTime=true;
  48. if ((pTimeMode!=null) &&((pTimeMode=='12')||(pTimeMode=='24')))
  49. {
  50. TimeMode=pTimeMode;
  51. }
  52. }
  53. if (pCtrl!=null)
  54. Cal.Ctrl=pCtrl;
  55. if (pFormat!=null)
  56. Cal.Format=pFormat.toUpperCase();
  57. exDateTime=document.getElementById(pCtrl).value;
  58. if (exDateTime!="")//Parse Date String
  59. {
  60. var Sp1;//Index of Date Separator 1
  61. var Sp2;//Index of Date Separator 2
  62. var tSp1;//Index of Time Separator 1
  63. var tSp1;//Index of Time Separator 2
  64. var strMonth;
  65. var strDate;
  66. var strYear;
  67. var intMonth;
  68. var YearPattern;
  69. var strHour;
  70. var strMinute;
  71. var strSecond;
  72. //parse month
  73. Sp1=exDateTime.indexOf(DateSeparator,0)
  74. Sp2=exDateTime.indexOf(DateSeparator,(parseInt(Sp1)+1));
  75. if ((Cal.Format.toUpperCase()=="DDMMYYYY") || (Cal.Format.toUpperCase()=="DDMMMYYYY"))
  76. {
  77. strMonth=exDateTime.substring(Sp1+1,Sp2);
  78. strDate=exDateTime.substring(0,Sp1);
  79. }
  80. else if ((Cal.Format.toUpperCase()=="MMDDYYYY") || (Cal.Format.toUpperCase()=="MMMDDYYYY"))
  81. {
  82. strMonth=exDateTime.substring(0,Sp1);
  83. strDate=exDateTime.substring(Sp1+1,Sp2);
  84. }
  85. if (isNaN(strMonth))
  86. intMonth=Cal.GetMonthIndex(strMonth);
  87. else
  88. intMonth=parseInt(strMonth,10)-1;
  89. if ((parseInt(intMonth,10)>=0) && (parseInt(intMonth,10)<12))
  90. Cal.Month=intMonth;
  91. //end parse month
  92. //parse Date
  93. if ((parseInt(strDate,10)<=Cal.GetMonDays()) && (parseInt(strDate,10)>=1))
  94. Cal.Date=strDate;
  95. //end parse Date
  96. //parse year
  97. strYear=exDateTime.substring(Sp2+1,Sp2+5);
  98. YearPattern=/^\d{4}$/;
  99. if (YearPattern.test(strYear))
  100. Cal.Year=parseInt(strYear,10);
  101. //end parse year
  102. //parse time
  103. if (Cal.ShowTime==true)
  104. {
  105. tSp1=exDateTime.indexOf(":",0)
  106. tSp2=exDateTime.indexOf(":",(parseInt(tSp1)+1));
  107. strHour=exDateTime.substring(tSp1,(tSp1)-2);
  108. Cal.SetHour(strHour);
  109. strMinute=exDateTime.substring(tSp1+1,tSp2);
  110. Cal.SetMinute(strMinute);
  111. strSecond=exDateTime.substring(tSp2+1,tSp2+3);
  112. Cal.SetSecond(strSecond);
  113. }
  114. }
  115. winCal=window.open("","TarihSecici","toolbar=0,status=0,menubar=0,fullscreen=no,width=195,height=245,resizable=0,top="+cnTop+",left="+cnLeft);
  116. docCal=winCal.document;
  117. RenderCal();
  118. }
  119. function RenderCal()
  120. {
  121. var vCalHeader;
  122. var vCalData;
  123. var vCalTime;
  124. var i;
  125. var j;
  126. var SelectStr;
  127. var vDayCount=0;
  128. var vFirstDay;
  129. docCal.open();
  130. docCal.writeln("<html><head><title>"+WindowTitle+"</title>");
  131. docCal.writeln("<script>var winMain=window.opener;</script>");
  132. docCal.writeln("</head><body background='"+ThemeBg+"' link="+FontColor+" vlink="+FontColor+"><form name='Calendar'>");
  133. vCalHeader="<table border=1 cellpadding=1 cellspacing=1 width='100%' align=\"center\" valign=\"top\">\n";
  134. //Month Selector
  135. vCalHeader+="<tr>\n<td colspan='7'><table border=0 width='100%' cellpadding=0 cellspacing=0><tr><td align='left'>\n";
  136. vCalHeader+="<select name=\"MonthSelector\" onChange=\"javascript:winMain.Cal.SwitchMth(this.selectedIndex);winMain.RenderCal();\">\n";
  137. for (i=0;i<12;i++)
  138. {
  139. if (i==Cal.Month)
  140. SelectStr="Selected";
  141. else
  142. SelectStr="";
  143. vCalHeader+="<option "+SelectStr+" value >"+MonthName[i]+"\n";
  144. }
  145. vCalHeader+="</select></td>";
  146. //Year selector
  147. vCalHeader+="\n<td align='right'><a href=\"javascript:winMain.Cal.DecYear();winMain.RenderCal()\"><b><font color=\""+YrSelColor+"\"><</font></b></a><font face=\"Verdana\" color=\""+YrSelColor+"\" size=2><b> "+Cal.Year+" </b></font><a href=\"javascript:winMain.Cal.IncYear();winMain.RenderCal()\"><b><font color=\""+YrSelColor+"\">></font></b></a></td></tr></table></td>\n";
  148. vCalHeader+="</tr>";
  149. //Calendar header shows Month and Year
  150. if (ShowMonthYear)
  151. vCalHeader+="<tr><td colspan='7'><font face='Verdana' size='2' align='center' color='"+MonthYearColor+"'><b>"+Cal.GetMonthName(ShowLongMonth)+" "+Cal.Year+"</b></font></td></tr>\n";
  152. //Week day header
  153. vCalHeader+="<tr bgcolor="+WeekHeadColor+">";
  154. for (i=0;i<7;i++)
  155. {
  156. vCalHeader+="<td align='center'><font face='Verdana' size='2'>"+WeekDayName[i].substr(0,WeekChar)+"</font></td>";
  157. }
  158. vCalHeader+="</tr>";
  159. docCal.write(vCalHeader);
  160. //Calendar detail
  161. CalDate=new Date(Cal.Year,Cal.Month);
  162. CalDate.setDate(1);
  163. vFirstDay=CalDate.getDay();
  164. vCalData="<tr>";
  165. for (i=0;i<vFirstDay;i++)
  166. {
  167. vCalData=vCalData+GenCell();
  168. vDayCount=vDayCount+1;
  169. }
  170. for (j=1;j<=Cal.GetMonDays();j++)
  171. {
  172. var strCell;
  173. vDayCount=vDayCount+1;
  174. if ((j==dtToday.getDate())&&(Cal.Month==dtToday.getMonth())&&(Cal.Year==dtToday.getFullYear()))
  175. strCell=GenCell(j,true,TodayColor);//Highlight today's date
  176. else
  177. {
  178. if (j==Cal.Date)
  179. {
  180. strCell=GenCell(j,true,SelDateColor);
  181. }
  182. else
  183. {
  184. if (vDayCount%7==0)
  185. strCell=GenCell(j,false,SaturdayColor);
  186. else if ((vDayCount+6)%7==0)
  187. strCell=GenCell(j,false,SundayColor);
  188. else
  189. strCell=GenCell(j,null,WeekDayColor);
  190. }
  191. }
  192. vCalData=vCalData+strCell;
  193. if((vDayCount%7==0)&&(j<Cal.GetMonDays()))
  194. {
  195. vCalData=vCalData+"</tr>\n<tr>";
  196. }
  197. }
  198. docCal.writeln(vCalData);
  199. //Time picker
  200. if (Cal.ShowTime)
  201. {
  202. var showHour;
  203. showHour=Cal.getShowHour();
  204. vCalTime="<tr>\n<td colspan='7' align='center'>";
  205. vCalTime+="<input type='text' name='hour' maxlength=2 size=1 style=\"WIDTH: 22px\" value="+showHour+" onchange=\"javascript:winMain.Cal.SetHour(this.value)\">";
  206. vCalTime+=" : ";
  207. vCalTime+="<input type='text' name='minute' maxlength=2 size=1 style=\"WIDTH: 22px\" value="+Cal.Minutes+" onchange=\"javascript:winMain.Cal.SetMinute(this.value)\">";
  208. vCalTime+=" : ";
  209. vCalTime+="<input type='text' name='second' maxlength=2 size=1 style=\"WIDTH: 22px\" value="+Cal.Seconds+" onchange=\"javascript:winMain.Cal.SetSecond(this.value)\">";
  210. if (TimeMode==12)
  211. {
  212. var SelectAm =(parseInt(Cal.Hours,10)<12)? "Selected":"";
  213. var SelectPm =(parseInt(Cal.Hours,10)>=12)? "Selected":"";
  214. vCalTime+="<select name=\"ampm\" onchange=\"javascript:winMain.Cal.SetAmPm(this.options[this.selectedIndex].value);\">";
  215. vCalTime+="<option "+SelectAm+" value=\"AM\">AM</option>";
  216. vCalTime+="<option "+SelectPm+" value=\"PM\">PM<option>";
  217. vCalTime+="</select>";
  218. }
  219. vCalTime+="\n</td>\n</tr>";
  220. docCal.write(vCalTime);
  221. }
  222. //end time picker
  223. docCal.writeln("\n</table>");
  224. docCal.writeln("</form></body></html>");
  225. docCal.close();
  226. }
  227. function GenCell(pValue,pHighLight,pColor)//Generate table cell with value
  228. {
  229. var PValue;
  230. var PCellStr;
  231. var vColor;
  232. var vHLstr1;//HighLight string
  233. var vHlstr2;
  234. var vTimeStr;
  235. if (pValue==null)
  236. PValue="";
  237. else
  238. PValue=pValue;
  239. if (pColor!=null)
  240. vColor="bgcolor=\""+pColor+"\"";
  241. else
  242. vColor="";
  243. if ((pHighLight!=null)&&(pHighLight))
  244. {vHLstr1="color='red'><b>";vHLstr2="</b>";}
  245. else
  246. {vHLstr1=">";vHLstr2="";}
  247. if (Cal.ShowTime)
  248. {
  249. vTimeStr="winMain.document.getElementById('"+Cal.Ctrl+"').value+=' '+"+"winMain.Cal.getShowHour()"+"+':'+"+"winMain.Cal.Minutes"+"+':'+"+"winMain.Cal.Seconds";
  250. if (TimeMode==12)
  251. vTimeStr+="+' '+winMain.Cal.AMorPM";
  252. }
  253. else
  254. vTimeStr="";
  255. PCellStr="<td "+vColor+" width="+CellWidth+" align='center'><font face='verdana' size='2'"+vHLstr1+"<a href=\"javascript:winMain.document.getElementById('"+Cal.Ctrl+"').value='"+Cal.FormatDate(PValue)+"';"+vTimeStr+";window.close();\">"+PValue+"</a>"+vHLstr2+"</font></td>";
  256. return PCellStr;
  257. }
  258. function Calendar(pDate,pCtrl)
  259. {
  260. //Properties
  261. this.Date=pDate.getDate();//selected date
  262. this.Month=pDate.getMonth();//selected month number
  263. this.Year=pDate.getFullYear();//selected year in 4 digits
  264. this.Hours=pDate.getHours();
  265. if (pDate.getMinutes()<10)
  266. this.Minutes="0"+pDate.getMinutes();
  267. else
  268. this.Minutes=pDate.getMinutes();
  269. if (pDate.getSeconds()<10)
  270. this.Seconds="0"+pDate.getSeconds();
  271. else
  272. this.Seconds=pDate.getSeconds();
  273. this.MyWindow=winCal;
  274. this.Ctrl=pCtrl;
  275. this.Format="ddMMyyyy";
  276. this.Separator=DateSeparator;
  277. this.ShowTime=false;
  278. if (pDate.getHours()<12)
  279. this.AMorPM="AM";
  280. else
  281. this.AMorPM="PM";
  282. }
  283. function GetMonthIndex(shortMonthName)
  284. {
  285. for (i=0;i<12;i++)
  286. {
  287. if (MonthName[i].substring(0,3).toUpperCase()==shortMonthName.toUpperCase())
  288. { return i;}
  289. }
  290. }
  291. Calendar.prototype.GetMonthIndex=GetMonthIndex;
  292. function IncYear()
  293. { Cal.Year++;}
  294. Calendar.prototype.IncYear=IncYear;
  295. function DecYear()
  296. { Cal.Year--;}
  297. Calendar.prototype.DecYear=DecYear;
  298. function SwitchMth(intMth)
  299. { Cal.Month=intMth;}
  300. Calendar.prototype.SwitchMth=SwitchMth;
  301. function SetHour(intHour)
  302. {
  303. var MaxHour;
  304. var MinHour;
  305. if (TimeMode==24)
  306. { MaxHour=23;MinHour=0}
  307. else if (TimeMode==12)
  308. { MaxHour=12;MinHour=1}
  309. else
  310. alert("TimeMode can only be 12 or 24");
  311. var HourExp=new RegExp("^\\d\\d$");
  312. if (HourExp.test(intHour) && (parseInt(intHour,10)<=MaxHour) && (parseInt(intHour,10)>=MinHour))
  313. {
  314. if ((TimeMode==12) && (Cal.AMorPM=="PM"))
  315. {
  316. if (parseInt(intHour,10)==12)
  317. Cal.Hours=12;
  318. else
  319. Cal.Hours=parseInt(intHour,10)+12;
  320. }
  321. else if ((TimeMode==12) && (Cal.AMorPM=="AM"))
  322. {
  323. if (intHour==12)
  324. intHour-=12;
  325. Cal.Hours=parseInt(intHour,10);
  326. }
  327. else if (TimeMode==24)
  328. Cal.Hours=parseInt(intHour,10);
  329. }
  330. }
  331. Calendar.prototype.SetHour=SetHour;
  332. function SetMinute(intMin)
  333. {
  334. var MinExp=new RegExp("^\\d\\d$");
  335. if (MinExp.test(intMin) && (intMin<60))
  336. Cal.Minutes=intMin;
  337. }
  338. Calendar.prototype.SetMinute=SetMinute;
  339. function SetSecond(intSec)
  340. {
  341. var SecExp=new RegExp("^\\d\\d$");
  342. if (SecExp.test(intSec) && (intSec<60))
  343. Cal.Seconds=intSec;
  344. }
  345. Calendar.prototype.SetSecond=SetSecond;
  346. function SetAmPm(pvalue)
  347. {
  348. this.AMorPM=pvalue;
  349. if (pvalue=="PM")
  350. {
  351. this.Hours=(parseInt(this.Hours,10))+12;
  352. if (this.Hours==24)
  353. this.Hours=12;
  354. }
  355. else if (pvalue=="AM")
  356. this.Hours-=12;
  357. }
  358. Calendar.prototype.SetAmPm=SetAmPm;
  359. function getShowHour()
  360. {
  361. var finalHour;
  362. if (TimeMode==12)
  363. {
  364. if (parseInt(this.Hours,10)==0)
  365. {
  366. this.AMorPM="AM";
  367. finalHour=parseInt(this.Hours,10)+12;
  368. }
  369. else if (parseInt(this.Hours,10)==12)
  370. {
  371. this.AMorPM="PM";
  372. finalHour=12;
  373. }
  374. else if (this.Hours>12)
  375. {
  376. this.AMorPM="PM";
  377. if ((this.Hours-12)<10)
  378. finalHour="0"+((parseInt(this.Hours,10))-12);
  379. else
  380. finalHour=parseInt(this.Hours,10)-12;
  381. }
  382. else
  383. {
  384. this.AMorPM="AM";
  385. if (this.Hours<10)
  386. finalHour="0"+parseInt(this.Hours,10);
  387. else
  388. finalHour=this.Hours;
  389. }
  390. }
  391. else if (TimeMode==24)
  392. {
  393. if (this.Hours<10)
  394. finalHour="0"+parseInt(this.Hours,10);
  395. else
  396. finalHour=this.Hours;
  397. }
  398. return finalHour;
  399. }
  400. Calendar.prototype.getShowHour=getShowHour;
  401. function GetMonthName(IsLong)
  402. {
  403. var Month=MonthName[this.Month];
  404. if (IsLong)
  405. return Month;
  406. else
  407. return Month.substr(0,3);
  408. }
  409. Calendar.prototype.GetMonthName=GetMonthName;
  410. function GetMonDays()//Get number of days in a month
  411. {
  412. var DaysInMonth=[31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
  413. if (this.IsLeapYear())
  414. {
  415. DaysInMonth[1]=29;
  416. }
  417. return DaysInMonth[this.Month];
  418. }
  419. Calendar.prototype.GetMonDays=GetMonDays;
  420. function IsLeapYear()
  421. {
  422. if ((this.Year%4)==0)
  423. {
  424. if ((this.Year%100==0) && (this.Year%400)!=0)
  425. {
  426. return false;
  427. }
  428. else
  429. {
  430. return true;
  431. }
  432. }
  433. else
  434. {
  435. return false;
  436. }
  437. }
  438. Calendar.prototype.IsLeapYear=IsLeapYear;
  439. function FormatDate(pDate)
  440. {
  441. if (this.Format.toUpperCase()=="DDMMYYYY")
  442. return (pDate+DateSeparator+(this.Month+1)+DateSeparator+this.Year);
  443. else if (this.Format.toUpperCase()=="DDMMMYYYY")
  444. return (pDate+DateSeparator+this.GetMonthName(false)+DateSeparator+this.Year);
  445. else if (this.Format.toUpperCase()=="MMDDYYYY")
  446. return ((this.Month+1)+DateSeparator+pDate+DateSeparator+this.Year);
  447. else if (this.Format.toUpperCase()=="MMMDDYYYY")
  448. return (this.GetMonthName(false)+DateSeparator+pDate+DateSeparator+this.Year);
  449. }
  450. Calendar.prototype.FormatDate=FormatDate;