CalendarControl.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351
  1. function positionInfo(object) {
  2. var p_elm = object;
  3. this.getElementLeft = getElementLeft;
  4. function getElementLeft() {
  5. var x = 0;
  6. var elm;
  7. if(typeof(p_elm) == "object"){
  8. elm = p_elm;
  9. } else {
  10. elm = document.getElementById(p_elm);
  11. }
  12. while (elm != null) {
  13. x+= elm.offsetLeft;
  14. elm = elm.offsetParent;
  15. }
  16. return parseInt(x);
  17. }
  18. this.getElementWidth = getElementWidth;
  19. function getElementWidth(){
  20. var elm;
  21. if(typeof(p_elm) == "object"){
  22. elm = p_elm;
  23. } else {
  24. elm = document.getElementById(p_elm);
  25. }
  26. return parseInt(elm.offsetWidth);
  27. }
  28. this.getElementRight = getElementRight;
  29. function getElementRight(){
  30. return getElementLeft(p_elm) + getElementWidth(p_elm);
  31. }
  32. this.getElementTop = getElementTop;
  33. function getElementTop() {
  34. var y = 0;
  35. var elm;
  36. if(typeof(p_elm) == "object"){
  37. elm = p_elm;
  38. } else {
  39. elm = document.getElementById(p_elm);
  40. }
  41. while (elm != null) {
  42. y+= elm.offsetTop;
  43. elm = elm.offsetParent;
  44. }
  45. return parseInt(y);
  46. }
  47. this.getElementHeight = getElementHeight;
  48. function getElementHeight(){
  49. var elm;
  50. if(typeof(p_elm) == "object"){
  51. elm = p_elm;
  52. } else {
  53. elm = document.getElementById(p_elm);
  54. }
  55. return parseInt(elm.offsetHeight);
  56. }
  57. this.getElementBottom = getElementBottom;
  58. function getElementBottom(){
  59. return getElementTop(p_elm) + getElementHeight(p_elm);
  60. }
  61. }
  62. function CalendarControl() {
  63. var calendarId = 'CalendarControl';
  64. var currentYear = 0;
  65. var currentMonth = 0;
  66. var currentDay = 0;
  67. var selectedYear = 0;
  68. var selectedMonth = 0;
  69. var selectedDay = 0;
  70. var months = ['Січень','Лютий','Березень','Квітень','Травень','Червень','Липень','Серпень','Вересень','Жовтень','Листопад','Грудень'];
  71. var dateField = null;
  72. function getProperty(p_property){
  73. var p_elm = calendarId;
  74. var elm = null;
  75. if(typeof(p_elm) == "object"){
  76. elm = p_elm;
  77. } else {
  78. elm = document.getElementById(p_elm);
  79. }
  80. if (elm != null){
  81. if(elm.style){
  82. elm = elm.style;
  83. if(elm[p_property]){
  84. return elm[p_property];
  85. } else {
  86. return null;
  87. }
  88. } else {
  89. return null;
  90. }
  91. }
  92. }
  93. function setElementProperty(p_property, p_value, p_elmId){
  94. var p_elm = p_elmId;
  95. var elm = null;
  96. if(typeof(p_elm) == "object"){
  97. elm = p_elm;
  98. } else {
  99. elm = document.getElementById(p_elm);
  100. }
  101. if((elm != null) && (elm.style != null)){
  102. elm = elm.style;
  103. elm[ p_property ] = p_value;
  104. }
  105. }
  106. function setProperty(p_property, p_value) {
  107. setElementProperty(p_property, p_value, calendarId);
  108. }
  109. function getDaysInMonth(year, month) {
  110. return [31,((!(year % 4 ) && ( (year % 100 ) || !( year % 400 ) ))?29:28),31,30,31,30,31,31,30,31,30,31][month-1];
  111. }
  112. function getDayOfWeek(year, month, day) {
  113. var date = new Date(year,month-1,day)
  114. return date.getDay();
  115. }
  116. this.clearDate = clearDate;
  117. function clearDate() {
  118. dateField.value = '';
  119. hide();
  120. }
  121. this.setDate = setDate;
  122. function setDate(year, month, day) {
  123. if (dateField) {
  124. if (month < 10) {month = "0" + month;}
  125. if (day < 10) {day = "0" + day;}
  126. var dateString = year+"-"+month+"-"+day;
  127. dateField.value = dateString;
  128. hide();
  129. }
  130. return;
  131. }
  132. this.changeMonth = changeMonth;
  133. function changeMonth(change) {
  134. currentMonth += change;
  135. currentDay = 0;
  136. if(currentMonth > 12) {
  137. currentMonth = 1;
  138. currentYear++;
  139. } else if(currentMonth < 1) {
  140. currentMonth = 12;
  141. currentYear--;
  142. }
  143. calendar = document.getElementById(calendarId);
  144. calendar.innerHTML = calendarDrawTable();
  145. }
  146. this.changeYear = changeYear;
  147. function changeYear(change) {
  148. currentYear += change;
  149. currentDay = 0;
  150. calendar = document.getElementById(calendarId);
  151. calendar.innerHTML = calendarDrawTable();
  152. }
  153. function getCurrentYear() {
  154. var year = new Date().getYear();
  155. if(year < 1900) year += 1900;
  156. return year;
  157. }
  158. function getCurrentMonth() {
  159. return new Date().getMonth() + 1;
  160. }
  161. function getCurrentDay() {
  162. return new Date().getDate();
  163. }
  164. function calendarDrawTable() {
  165. var dayOfMonth = 1;
  166. var validDay = 0;
  167. var startDayOfWeek = getDayOfWeek(currentYear, currentMonth, dayOfMonth);
  168. var daysInMonth = getDaysInMonth(currentYear, currentMonth);
  169. var css_class = null; //CSS class for each day
  170. var table = "<table cellspacing='0' cellpadding='0' border='0'>";
  171. table = table + "<tr class='header'>";
  172. table = table + " <td colspan='2' class='previous'><a href='javascript:changeCalendarControlMonth(-1);'>&lt;</a> <a href='javascript:changeCalendarControlYear(-1);'>&laquo;</a></td>";
  173. table = table + " <td colspan='3' class='title'>" + months[currentMonth-1] + "<br>" + currentYear + "</td>";
  174. table = table + " <td colspan='2' class='next'><a href='javascript:changeCalendarControlYear(1);'>&raquo;</a> <a href='javascript:changeCalendarControlMonth(1);'>&gt;</a></td>";
  175. table = table + "</tr>";
  176. table = table + "<tr><th>S</th><th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th>S</th></tr>";
  177. for(var week=0; week < 6; week++) {
  178. table = table + "<tr>";
  179. for(var dayOfWeek=0; dayOfWeek < 7; dayOfWeek++) {
  180. if(week == 0 && startDayOfWeek == dayOfWeek) {
  181. validDay = 1;
  182. } else if (validDay == 1 && dayOfMonth > daysInMonth) {
  183. validDay = 0;
  184. }
  185. if(validDay) {
  186. if (dayOfMonth == selectedDay && currentYear == selectedYear && currentMonth == selectedMonth) {
  187. css_class = 'current';
  188. } else if (dayOfWeek == 0 || dayOfWeek == 6) {
  189. css_class = 'weekend';
  190. } else {
  191. css_class = 'weekday';
  192. }
  193. table = table + "<td><a class='"+css_class+"' href=\"javascript:setCalendarControlDate("+currentYear+","+currentMonth+","+dayOfMonth+")\">"+dayOfMonth+"</a></td>";
  194. dayOfMonth++;
  195. } else {
  196. table = table + "<td class='empty'>&nbsp;</td>";
  197. }
  198. }
  199. table = table + "</tr>";
  200. }
  201. table = table + "<tr class='header'><th colspan='7' style='padding: 3px;'><a href='javascript:clearCalendarControl();'>Очистити</a> | <a href='javascript:hideCalendarControl();'>Закрити</a></td></tr>";
  202. table = table + "</table>";
  203. return table;
  204. }
  205. this.show = show;
  206. function show(field) {
  207. can_hide = 0;
  208. // If the calendar is visible and associated with
  209. // this field do not do anything.
  210. if (dateField == field) {
  211. return;
  212. } else {
  213. dateField = field;
  214. }
  215. if(dateField) {
  216. try {
  217. var dateString = new String(dateField.value);
  218. var dateParts = dateString.split("-");
  219. selectedMonth = parseInt(dateParts[0],10);
  220. selectedDay = parseInt(dateParts[1],10);
  221. selectedYear = parseInt(dateParts[2],10);
  222. } catch(e) {}
  223. }
  224. if (!(selectedYear && selectedMonth && selectedDay)) {
  225. selectedMonth = getCurrentMonth();
  226. selectedDay = getCurrentDay();
  227. selectedYear = getCurrentYear();
  228. }
  229. currentMonth = selectedMonth;
  230. currentDay = selectedDay;
  231. currentYear = selectedYear;
  232. if(document.getElementById){
  233. calendar = document.getElementById(calendarId);
  234. calendar.innerHTML = calendarDrawTable(currentYear, currentMonth);
  235. setProperty('display', 'block');
  236. var fieldPos = new positionInfo(dateField);
  237. var calendarPos = new positionInfo(calendarId);
  238. var x = fieldPos.getElementLeft();
  239. var y = fieldPos.getElementBottom();
  240. setProperty('left', x + "px");
  241. setProperty('top', y + "px");
  242. if (document.all) {
  243. setElementProperty('display', 'block', 'CalendarControlIFrame');
  244. setElementProperty('left', x + "px", 'CalendarControlIFrame');
  245. setElementProperty('top', y + "px", 'CalendarControlIFrame');
  246. setElementProperty('width', calendarPos.getElementWidth() + "px", 'CalendarControlIFrame');
  247. setElementProperty('height', calendarPos.getElementHeight() + "px", 'CalendarControlIFrame');
  248. }
  249. }
  250. }
  251. this.hide = hide;
  252. function hide() {
  253. if(dateField) {
  254. setProperty('display', 'none');
  255. setElementProperty('display', 'none', 'CalendarControlIFrame');
  256. dateField = null;
  257. }
  258. }
  259. this.visible = visible;
  260. function visible() {
  261. return dateField
  262. }
  263. this.can_hide = can_hide;
  264. var can_hide = 0;
  265. }
  266. var calendarControl = new CalendarControl();
  267. function showCalendarControl(textField) {
  268. // textField.onblur = hideCalendarControl;
  269. calendarControl.show(textField);
  270. }
  271. function clearCalendarControl() {
  272. calendarControl.clearDate();
  273. }
  274. function hideCalendarControl() {
  275. if (calendarControl.visible()) {
  276. calendarControl.hide();
  277. }
  278. }
  279. function setCalendarControlDate(year, month, day) {
  280. calendarControl.setDate(year, month, day);
  281. }
  282. function changeCalendarControlYear(change) {
  283. calendarControl.changeYear(change);
  284. }
  285. function changeCalendarControlMonth(change) {
  286. calendarControl.changeMonth(change);
  287. }
  288. document.write("<iframe id='CalendarControlIFrame' src='javascript:false;' frameBorder='0' scrolling='no'></iframe>");
  289. document.write("<div id='CalendarControl'></div>");