Calendar.js 32 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037
  1. o2.widget = o2.widget || {};
  2. o2.widget.Calendar = o2.Calendar = new Class({
  3. Implements: [Options, Events],
  4. Extends: o2.widget.Common,
  5. options: {
  6. "style": "default",
  7. "path": o2.session.path+"/widget/$Calendar/" ,
  8. "defaultView": "day", //day, month, year
  9. "baseDate": new Date(),
  10. "isTime": false,
  11. "isMulti": false,
  12. "before": null,
  13. "after": null,
  14. "timeOnly": false,
  15. "defaultDate": new Date(),
  16. "beforeCurrent": true,
  17. "range": false,
  18. "rangeNodes": [],
  19. "rangeRule": "asc", //asc + , des -
  20. "target": null
  21. },
  22. initialize: function(node, options){
  23. Locale.use("zh-CHS");
  24. this.options.defaultTime = ""+this.options.baseDate.getHours()+":"+this.options.baseDate.getMinutes()+":"+this.options.baseDate.getSeconds();
  25. this.setOptions(options);
  26. this.path = o2.session.path+"/widget/$Calendar/";
  27. this.cssPath = o2.session.path+"/widget/$Calendar/"+this.options.style+"/css.wcss";
  28. this._loadCss();
  29. // this.options.containerPath = this.path+this.style+"/container.html";
  30. // this.options.dayPath = this.path+this.style+"/day.html";
  31. // this.options.monthPath = this.path+this.style+"/month.html";
  32. // this.options.yearPath = this.path+this.style+"/year.html";
  33. // this.options.timePath = this.path+this.style+"/time.html";
  34. if (!this.options.format){
  35. if (this.options.isTime){
  36. //this.options.format = Locale.get("Date").shortDate + " " + Locale.get("Date").shortTime;
  37. if(this.options.timeOnly){
  38. this.options.format="%H:%M";
  39. }
  40. else{
  41. this.options.format = Locale.get("Date").shortDate + " " + "%H:%M";
  42. }
  43. }else{
  44. this.options.format = Locale.get("Date").shortDate;
  45. }
  46. }
  47. this.options.containerPath = this.options.path+this.options.style+"/container.html";
  48. this.options.dayPath = this.options.path+this.options.style+"/day.html";
  49. this.options.monthPath = this.options.path+this.options.style+"/month.html";
  50. this.options.yearPath = this.options.path+this.options.style+"/year.html";
  51. this.options.timePath = this.options.path+this.options.style+"/time.html";
  52. this.today = new Date();
  53. this.currentView = this.options.defaultView;
  54. this.node = $(node);
  55. this.visible = false;
  56. this.container = this.createContainer();
  57. this.container.inject((this.options.target) || $(document.body));
  58. this.contentTable = this.createContentTable();
  59. this.contentTable.inject(this.contentDateNode);
  60. this.addEvents();
  61. this.container.set({
  62. styles: {
  63. "display": "none",
  64. "opacity": 1
  65. }
  66. });
  67. this.fireEvent("init");
  68. //this.move = true;
  69. //this.containerDrag = new Drag.Move(this.container);
  70. },
  71. addEvents: function(){
  72. this.node.addEvent("focus", function(){
  73. this.show();
  74. }.bind(this));
  75. this.node.addEvent("click", function(){
  76. this.show();
  77. }.bind(this));
  78. this.prevNode.addEvent("click", function(){
  79. this.getPrev();
  80. }.bind(this));
  81. this.nextNode.addEvent("click", function(){
  82. this.getNext();
  83. }.bind(this));
  84. this.currentTextNode.addEvent("click", function(){
  85. this.changeView();
  86. }.bind(this));
  87. this.titleNode.addEvent("mousedown", function(){
  88. this.move();
  89. }.bind(this));
  90. this.titleNode.addEvent("mouseup", function(){
  91. this.unmove();
  92. }.bind(this));
  93. document.addEvent('mousedown', this.outsideClick.bind(this));
  94. },
  95. move: function(){
  96. this.containerDrag = new Drag.Move(this.container, {
  97. "onDrag": function(e){
  98. if (this.iframe){
  99. var p = this.container.getPosition();
  100. this.iframe.setStyles({
  101. "top": ""+p.y+"px",
  102. "left": ""+p.x+"px"
  103. });
  104. }
  105. }.bind(this)
  106. });
  107. },
  108. unmove: function(){
  109. this.container.removeEvents("mousedown");
  110. this.titleNode.addEvent("mousedown", function(){
  111. this.move();
  112. }.bind(this));
  113. },
  114. changeView: function(){
  115. var view = "day";
  116. switch (this.currentView) {
  117. case "day" :
  118. this.changeViewToMonth();
  119. break;
  120. case "month" :
  121. this.changeViewToYear();
  122. break;
  123. case "year" :
  124. this.changeViewToDay();
  125. break;
  126. case "time" :
  127. this.changeViewToDay();
  128. //this.changeViewToDay();
  129. break;
  130. default :
  131. //nothing;
  132. }
  133. },
  134. changeViewToMonth: function(year){
  135. this.currentView = "month";
  136. if (!this.contentMonthTable){
  137. this.contentMonthTable = this.createContentTable();
  138. this.contentMonthTable.inject(this.contentDateNode);
  139. }
  140. if (this.contentTable) this.contentTable.setStyle("display", "none");
  141. if (this.contentYearTable) this.contentYearTable.setStyle("display", "none");
  142. if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "none");
  143. // if (this.contentMonthTable) this.contentMonthTable.setStyle("display", "block");
  144. if (this.contentMonthTable) this.contentMonthTable.setStyle("display", "table");
  145. var year = (year!=undefined) ? year : this.currentTextNode.retrieve("year");
  146. var month = this.currentTextNode.retrieve("month");
  147. this.showMonth(year, month);
  148. },
  149. changeViewToYear: function(year){
  150. this.currentView = "year";
  151. if (!this.contentYearTable){
  152. this.contentYearTable = this.createContentTable();
  153. this.contentYearTable.inject(this.contentDateNode);
  154. }
  155. if (this.contentTable) this.contentTable.setStyle("display", "none");
  156. if (this.contentMonthTable) this.contentMonthTable.setStyle("display", "none");
  157. if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "none");
  158. // if (this.contentYearTable) this.contentYearTable.setStyle("display", "block");
  159. if (this.contentYearTable) this.contentYearTable.setStyle("display", "table");
  160. this.showYear(year);
  161. },
  162. changeViewToDay: function(year, month){
  163. this.currentView = "day";
  164. if (!this.contentTable){
  165. this.contentTable = this.createContentTable();
  166. this.contentTable.inject(this.contentDateNode);
  167. }
  168. if (this.contentMonthTable) this.contentMonthTable.setStyle("display", "none");
  169. if (this.contentYearTable) this.contentYearTable.setStyle("display", "none");
  170. if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "none");
  171. // if (this.contentTable) this.contentTable.setStyle("display", "block");
  172. if (this.contentTable) this.contentTable.setStyle("display", "table");
  173. this.showDay(year, month);
  174. },
  175. getNext: function(){
  176. switch (this.currentView) {
  177. case "time" :
  178. this.getNextDate();
  179. break;
  180. case "day" :
  181. this.getNextDay();
  182. break;
  183. case "month" :
  184. this.getNextMonth();
  185. break;
  186. case "year" :
  187. this.getNextYear();
  188. break;
  189. default :
  190. //nothing
  191. }
  192. },
  193. getPrev: function(){
  194. switch (this.currentView) {
  195. case "time" :
  196. this.getPrevDate();
  197. break;
  198. case "day" :
  199. this.getPrevDay();
  200. break;
  201. case "month" :
  202. this.getPrevMonth();
  203. break;
  204. case "year" :
  205. this.getPrevYear();
  206. break;
  207. default :
  208. //nothing
  209. }
  210. },
  211. getNextDate: function(){
  212. var date = this.currentTextNode.retrieve("date");
  213. // var year = this.currentTextNode.retrieve("year");
  214. // var month = this.currentTextNode.retrieve("month");
  215. // month--;
  216. // var day = this.currentTextNode.retrieve("day");
  217. // var date = new Date(year, month, day);
  218. date.increment("day", 1);
  219. this._setTimeTitle(null, date);
  220. },
  221. getPrevDate: function(){
  222. var date = this.currentTextNode.retrieve("date");
  223. date.increment("day", -1);
  224. this._setTimeTitle(null, date);
  225. },
  226. getNextDay: function(){
  227. var year = this.currentTextNode.retrieve("year");
  228. var month = this.currentTextNode.retrieve("month");
  229. month--;
  230. var date = new Date(year, month, 1);
  231. date.increment("month", 1);
  232. var thisYear = date.getFullYear();
  233. var thisMonth = date.getMonth();
  234. this._setDayTitle(null, thisYear, thisMonth);
  235. this._setDayDate(null,thisYear, thisMonth);
  236. },
  237. getPrevDay: function(){
  238. var year = this.currentTextNode.retrieve("year");
  239. var month = this.currentTextNode.retrieve("month");
  240. month--;
  241. var date = new Date(year, month, 1);
  242. date.increment("month", -1)
  243. var thisYear = date.getFullYear();
  244. var thisMonth = date.getMonth();
  245. this._setDayTitle(null, thisYear, thisMonth);
  246. this._setDayDate(null,thisYear, thisMonth);
  247. },
  248. getNextMonth: function(){
  249. var year = this.currentTextNode.retrieve("year");
  250. var date = new Date(year, 1, 1);
  251. date.increment("year", 1)
  252. var thisYear = date.getFullYear();
  253. this.showMonth(thisYear);
  254. },
  255. getPrevMonth: function(){
  256. var year = this.currentTextNode.retrieve("year");
  257. var date = new Date(year, 1, 1);
  258. date.increment("year", -1)
  259. var thisYear = date.getFullYear();
  260. this.showMonth(thisYear);
  261. },
  262. getNextYear: function(){
  263. var year = this.currentTextNode.retrieve("year");
  264. var date = new Date(year, 1, 1);
  265. date.increment("year", this.yearLength)
  266. var thisYear = date.getFullYear();
  267. this.showYear(thisYear);
  268. },
  269. getPrevYear: function(){
  270. var year = this.currentTextNode.retrieve("year");
  271. var date = new Date(year, 1, 1);
  272. date.increment("year", 0-this.yearLength)
  273. var thisYear = date.getFullYear();
  274. this.showYear(thisYear);
  275. },
  276. outsideClick: function(e) {
  277. if(this.visible) {
  278. var elementCoords = this.container.getCoordinates();
  279. var targetCoords = this.node.getCoordinates();
  280. if(((e.page.x < elementCoords.left || e.page.x > (elementCoords.left + elementCoords.width)) ||
  281. (e.page.y < elementCoords.top || e.page.y > (elementCoords.top + elementCoords.height))) &&
  282. ((e.page.x < targetCoords.left || e.page.x > (targetCoords.left + targetCoords.width)) ||
  283. (e.page.y < targetCoords.top || e.page.y > (targetCoords.top + targetCoords.height))) ) this.hide();
  284. }
  285. },
  286. hide: function(){
  287. if (this.visible){
  288. // if (!this.morph){
  289. // this.morph = new Fx.Morph(this.container, {"duration": 200});
  290. // }
  291. this.visible = false;
  292. // this.changeViewToDay();
  293. // this.morph.start({"opacity": 0}).chain(function(){
  294. this.container.setStyle("display", "none");
  295. if (this.iframe) this.iframe.destroy();
  296. debugger;
  297. if (layout.desktop.offices){
  298. Object.each(layout.desktop.offices, function(office){
  299. office.show();
  300. });
  301. }
  302. // }.bind(this));
  303. this.fireEvent("hide");
  304. }
  305. },
  306. show: function(){
  307. if (!this.visible){
  308. var dStr = this.node.get("value");
  309. if (dStr && Date.isValid(dStr)){
  310. this.options.baseDate = Date.parse(dStr.substr(0,10));
  311. }
  312. if(this.options.timeOnly){
  313. this.currentView = "time";
  314. }
  315. else{
  316. this.currentView = this.options.defaultView;
  317. }
  318. switch (this.currentView) {
  319. case "day" :
  320. this.changeViewToDay();
  321. break;
  322. case "month" :
  323. this.showMonth();
  324. break;
  325. case "year" :
  326. this.showYear();
  327. break;
  328. case "time" :
  329. //this.showTime(this.options.baseDate);
  330. this.changeViewToTime(this.options.defaultDate);
  331. //this.changeViewToTime(this.options.baseDate);
  332. break;
  333. default :
  334. this.showDay();
  335. }
  336. // if (!this.morph){
  337. // this.morph = new Fx.Morph(this.container, {"duration": 200});
  338. // }
  339. this.container.setStyle("display", "block");
  340. if (this.container.position){
  341. this.container.position({
  342. relativeTo: this.node,
  343. position: 'bottomLeft',
  344. edge: 'upperLeft'
  345. });
  346. // var offsetPNode = this.node.getOffsetParent();
  347. var cp = this.container.getPosition(this.options.target || null);
  348. var cSize = this.container.getSize();
  349. //var fp = (this.options.target) ? this.options.target.getPosition() : $(document.body).getPosition()
  350. var fsize = (this.options.target) ? this.options.target.getSize() : $(document.body).getSize();
  351. //if (cp.y+cSize.y>fsize.y+fp.y){
  352. if (cp.y+cSize.y>fsize.y){
  353. this.container.position({
  354. relativeTo: this.node,
  355. position: 'upperLeft',
  356. edge: 'bottomLeft'
  357. });
  358. }
  359. }else{
  360. var p = this.node.getPosition(this.options.target || null);
  361. var size = this.node.getSize();
  362. var containerSize = this.container.getSize();
  363. var bodySize = $(document.body).getSize();
  364. var left = p.x;
  365. if ((left + containerSize.x) > bodySize.x){
  366. left = bodySize.x - containerSize.x;
  367. }
  368. this.container.setStyle("top", p.y+size.y+2);
  369. this.container.setStyle("left", left);
  370. }
  371. // var p = this.container.getPosition();
  372. // var s = this.container.getSize();
  373. // var zidx = this.container.getStyle("z-index");
  374. // this.iframe = new Element("iframe", {"styles":{
  375. // "border": "0px",
  376. // "margin": "0px",
  377. // "padding": "0px",
  378. // "opacity": 0,
  379. // "z-index": (zidx) ? zidx-1 : 0,
  380. // "top": ""+p.y+"px",
  381. // "left": ""+p.x+"px",
  382. // "width": ""+s.x+"px",
  383. // "height": ""+s.y+"px",
  384. // "position": "absolute"
  385. // }}).inject(this.container, "before");
  386. if (layout.desktop.offices){
  387. Object.each(layout.desktop.offices, function(office){
  388. if (this.container.isOverlap(office.officeNode)){
  389. office.hide();
  390. }
  391. }.bind(this));
  392. }
  393. // this.morph.start({"opacity": 1}).chain(function(){
  394. this.visible = true;
  395. // }.bind(this));
  396. this.fireEvent("show");
  397. }
  398. },
  399. showYear: function(year){
  400. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  401. var date = new Date(thisYear, 1, 1);
  402. date.increment("year", -2);
  403. var beginYear = date.getFullYear();
  404. date.increment("year", this.yearLength-1);
  405. var endYear = date.getFullYear();
  406. this._setYearTitle(null, beginYear, endYear, thisYear);
  407. this._setYearDate(null, beginYear, endYear, thisYear);
  408. // if (!this.move){
  409. // this.move = true;
  410. // this.containerDrag = new Drag.Move(this.container);
  411. // }
  412. },
  413. _setYearTitle:function(node, beginYear, endYear, thisYear){
  414. var thisNode = node || this.currentTextNode;
  415. thisNode.set("text", beginYear+"-"+endYear);
  416. thisNode.store("year", thisYear);
  417. },
  418. _setYearDate: function(table, beginYear, endYear, year){
  419. var yearTable = table || this.contentYearTable;
  420. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  421. var tbody = yearTable.getElement("tbody");
  422. var tds = tbody.getElements("td");
  423. tds.each(function(item, idx){
  424. var y = beginYear+idx;
  425. item.set("text", y);
  426. item.store("year", y);
  427. if (y==this.options.baseDate.getFullYear()){
  428. item.addClass("current_"+this.options.style);
  429. }else{
  430. item.removeClass("current_"+this.options.style);
  431. }
  432. }.bind(this));
  433. },
  434. showMonth: function(year, month){
  435. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  436. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  437. this._setMonthTitle(null, thisYear, thisMonth);
  438. this._setMonthDate(null, thisYear, thisMonth);
  439. // if (!this.move){
  440. // this.move = true;
  441. // this.containerDrag = new Drag.Move(this.container);
  442. // }
  443. },
  444. _setMonthTitle:function(node, year){
  445. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  446. var thisNode = node || this.currentTextNode;
  447. thisNode.set("text", thisYear);
  448. thisNode.store("year", thisYear);
  449. },
  450. _setMonthDate: function(table, year, month){
  451. //var months = Locale.get("Date").months;
  452. var months = o2.LP.widget.months;
  453. var monthTable = table || this.contentMonthTable;
  454. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  455. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  456. var tbody = monthTable.getElement("tbody");
  457. var tds = tbody.getElements("td");
  458. tds.each(function(item, idx){
  459. item.set("text", months[idx].substr(0,2));
  460. item.store("year", thisYear);
  461. item.store("month", idx);
  462. if ((thisYear==this.options.baseDate.getFullYear()) && (idx==this.options.baseDate.getMonth())){
  463. item.addClass("current_"+this.options.style);
  464. }else{
  465. item.removeClass("current_"+this.options.style);
  466. }
  467. }.bind(this));
  468. },
  469. showDay: function(year, month){
  470. this._setDayTitle(null, year, month);
  471. this._setDayWeekTitleTh();
  472. this._setDayDate(null, year, month);
  473. // if (!this.move){
  474. // this.move = true;
  475. // this.containerDrag = new Drag.Move(this.container);
  476. // }
  477. },
  478. _setDayTitle: function(node, year, month){
  479. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  480. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  481. thisMonth++;
  482. var text = thisYear+"年"+thisMonth+"月";
  483. var thisNode = node || this.currentTextNode;
  484. thisNode.set("text", text);
  485. thisNode.store("year", thisYear);
  486. thisNode.store("month", thisMonth);
  487. },
  488. _setDayDate: function(table, year, month){
  489. var dayTable = table || this.contentTable;
  490. var baseDate = this.options.baseDate;
  491. if ((year!=undefined) && (month!=undefined)){
  492. baseDate = new Date();
  493. baseDate.setDate(1);
  494. baseDate.setFullYear(year);
  495. baseDate.setMonth(month);
  496. }
  497. var tbody = dayTable.getElement("tbody");
  498. var tds = tbody.getElements("td");
  499. var firstDate = baseDate.clone();
  500. firstDate.setDate(1);
  501. var day = firstDate.getDay();
  502. var tmpDate = firstDate.clone();
  503. for (var i=day-1; i>=0; i--){
  504. tmpDate.increment("day", -1);
  505. tds[i].set("text", tmpDate.getDate());
  506. tds[i].addClass("gray_"+this.options.style);
  507. tds[i].setStyles(this.css["gray_"+this.options.style]);
  508. tds[i].store("dateValue", tmpDate.toString())
  509. }
  510. for (var i=day; i<tds.length; i++){
  511. tds[i].set("text", firstDate.getDate());
  512. if (firstDate.toString() == this.options.baseDate.toString()){
  513. tds[i].addClass("current_"+this.options.style);
  514. tds[i].setStyles(this.css["current_"+this.options.style]);
  515. tds[i].removeClass("gray_"+this.options.style);
  516. tds[i].setStyle("border", "1px solid #FFF");
  517. }else if (firstDate.getMonth()!=baseDate.getMonth()){
  518. tds[i].addClass("gray_"+this.options.style);
  519. tds[i].setStyles(this.css["gray_"+this.options.style]);
  520. tds[i].removeClass("current_"+this.options.style);
  521. tds[i].setStyle("border", "1px solid #FFF");
  522. }else{
  523. tds[i].setStyles(this.css["normal_"+this.options.style]);
  524. tds[i].removeClass("current_"+this.options.style);
  525. tds[i].removeClass("gray_"+this.options.style);
  526. tds[i].setStyle("border", "1px solid #FFF");
  527. }
  528. var tmp = firstDate.clone();
  529. if (tmp.clearTime().toString() == this.today.clearTime().toString()){
  530. //tds[i].addClass("today_"+this.options.style);
  531. tds[i].setStyles(this.css["today_"+this.options.style]);
  532. tds[i].setStyle("border", "0px solid #AAA");
  533. }
  534. tds[i].store("dateValue", firstDate.toString())
  535. firstDate.increment("day", 1);
  536. }
  537. },
  538. changeViewToTime: function(date){
  539. this.currentView = "time";
  540. if (!this.contentTimeTable){
  541. this.contentTimeTable = this.createContentTable();
  542. this.contentTimeTable.inject(this.contentDateNode);
  543. }
  544. if (this.contentTable) this.contentTable.setStyle("display", "none");
  545. if (this.contentYearTable) this.contentYearTable.setStyle("display", "none");
  546. if (this.contentMonthTable) this.contentMonthTable.setStyle("display", "none");
  547. if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "block");
  548. // if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "table");
  549. var thisDate = date || this.options.baseDate;
  550. this.showTime(thisDate);
  551. },
  552. showTime: function(date){
  553. // var thisHour = this.options.baseDate.getHours();
  554. // var thisMinutes = this.options.baseDate.getMinutes();
  555. // var thisSeconds = this.options.baseDate.getSeconds();
  556. var times = this.options.defaultTime.split(":");
  557. var thisHour = (times[0]) ? times[0] : "0";
  558. var thisMinutes = (times[1]) ? times[1] : "0";
  559. var thisSeconds = (times[2]) ? times[2] : "0";
  560. this._setTimeTitle(null, date);
  561. this._setTimeDate(null, thisHour, thisMinutes, thisSeconds);
  562. // if (this.move){
  563. // this.move = false;
  564. // this.container.removeEvents("mousedown");
  565. // }
  566. },
  567. _setTimeTitle: function(node, date){
  568. var thisDate = date || this.options.baseDate;
  569. var thisNode = node || this.currentTextNode;
  570. var y = thisDate.getFullYear();
  571. var m = thisDate.getMonth()+1;
  572. var d = thisDate.getDate();
  573. var text = "" + y + "年" + m + "月" + d + "日";
  574. if (this.options.timeOnly){
  575. thisNode.hide();
  576. if (this.prevNode) this.prevNode.hide();
  577. if (this.nextNode) this.nextNode.hide();
  578. }
  579. thisNode.set("text", text);
  580. thisNode.store("date", date);
  581. },
  582. _setTimeDate: function(node, h, m, s){
  583. this.itmeHNode = this.contentTimeTable.getElement(".MWF_calendar_time_h_slider");
  584. this.itmeMNode = this.contentTimeTable.getElement(".MWF_calendar_time_m_slider");
  585. // this.itmeSNode = this.contentTimeTable.getElement(".MWF_calendar_time_s_slider");
  586. this.timeShowNode = this.contentTimeTable.getElement(".MWF_calendar_time_show");
  587. this.timeShowNode.addEvent("click", function(){
  588. this._selectTime();
  589. }.bind(this));
  590. this.showHNode = this.contentTimeTable.getElement(".MWF_calendar_time_show_h");
  591. this.showMNode = this.contentTimeTable.getElement(".MWF_calendar_time_show_m");
  592. // this.showSNode = this.contentTimeTable.getElement(".MWF_calendar_time_show_s");
  593. this.showActionNode = this.contentTimeTable.getElement(".MWF_calendar_action_show");
  594. var calendar = this;
  595. if (COMMON.Browser.Platform.isMobile){
  596. this.itmeHNode.empty();
  597. this.itmeHNode.removeClass("calendarTimeSlider");
  598. this.itmeHNode.setStyles(this.css.calendarTimeSliderNoStyle);
  599. var sel = new Element("select").inject(this.itmeHNode);
  600. for (i=0; i<=23; i++){
  601. var v = (i<10) ? "0"+i: i;
  602. var o = new Element("option", {
  603. "value": v,
  604. "text": v
  605. }).inject(sel);
  606. if (h==i) o.set("selected", true);
  607. }
  608. sel.addEvent("change", function(){
  609. calendar.showHNode.set("text", this.options[this.selectedIndex].get("value"));
  610. });
  611. this.showHNode.set("text", sel.options[sel.selectedIndex].get("value"));
  612. this.itmeMNode.empty();
  613. this.itmeMNode.removeClass("calendarTimeSlider");
  614. this.itmeMNode.setStyles(this.css.calendarTimeSliderNoStyle);
  615. sel = new Element("select").inject(this.itmeMNode);
  616. for (i=0; i<=59; i++){
  617. var v = (i<10) ? "0"+i: i;
  618. var o = new Element("option", {
  619. "value": v,
  620. "text": v
  621. }).inject(sel);
  622. if (m==i) o.set("selected", true);
  623. }
  624. sel.addEvent("change", function(){
  625. calendar.showMNode.set("text", this.options[this.selectedIndex].get("value"));
  626. });
  627. this.showMNode.set("text", sel.options[sel.selectedIndex].get("value"));
  628. }else{
  629. var hSlider = new Slider(this.itmeHNode, this.itmeHNode.getFirst(), {
  630. range: [0, 23],
  631. initialStep: h.toInt(),
  632. onChange: function(value){
  633. var tmp = (value.toInt().toString());
  634. if (tmp.length<2){
  635. tmp = "0"+tmp
  636. }
  637. this.showHNode.set("text", tmp);
  638. this.itmeHNode.getFirst().set("text", tmp);
  639. }.bind(this)
  640. });
  641. var mSlider = new Slider(this.itmeMNode, this.itmeMNode.getFirst(), {
  642. range: [0, 59],
  643. initialStep: m.toInt(),
  644. onChange: function(value){
  645. var tmp = (value.toInt().toString());
  646. if (tmp.length<2){
  647. tmp = "0"+tmp
  648. }
  649. this.showMNode.set("text", tmp);
  650. this.itmeMNode.getFirst().set("text", tmp);
  651. }.bind(this)
  652. });
  653. }
  654. this.showHNode.set("text", h.toInt());
  655. this.showMNode.set("text", m.toInt());
  656. if (!this.okButton){
  657. this.okButton = new Element("button", {"text": "确定"}).inject(this.showActionNode);
  658. this.okButton.addEvent("click", function(){
  659. this._selectTime();
  660. this.hide();
  661. }.bind(this));
  662. this.okButton.setStyles(this.css.calendarActionShowButton);
  663. }
  664. if (!this.clearButton){
  665. this.clearButton = new Element("button", {"text": "清除"}).inject(this.showActionNode);
  666. this.clearButton.addEvent("click", function(){
  667. this.node.set("value", "");
  668. this.fireEvent("clear");
  669. this.hide();
  670. }.bind(this));
  671. this.clearButton.setStyles(this.css.calendarActionShowButton);
  672. }
  673. /*
  674. var sSlider = new Slider(this.itmeSNode, this.itmeSNode.getFirst(), {
  675. range: [0, 59],
  676. initialStep: s,
  677. onChange: function(value){
  678. var tmp = new String(value);
  679. if (tmp.length<2){
  680. tmp = "0"+tmp
  681. }
  682. this.showSNode.set("text", tmp);
  683. }.bind(this)
  684. });
  685. */
  686. },
  687. _selectTime: function(){
  688. var date = this.currentTextNode.retrieve("date");
  689. var h = this.showHNode.get("text");
  690. var m = this.showMNode.get("text");
  691. // var s = this.showSNode.get("text");
  692. date.setHours(h);
  693. date.setMinutes(m);
  694. // date.setSeconds(s);
  695. if (!this.options.beforeCurrent){
  696. var now = new Date();
  697. if (date.getTime()-now.getTime()<0){
  698. alert("选择的日期必须大于当前日期!");
  699. this.node.focus();
  700. return false;
  701. }
  702. }
  703. var dv = date.format(this.options.format);
  704. if (this.fireEvent("queryComplate", [dv, date])){
  705. var t = this.node.get("value");
  706. this.node.set("value", dv);
  707. // this.node.focus();
  708. this.hide();
  709. if (t!=dv) this.fireEvent("change", [dv, date, t]);
  710. this.fireEvent("complate", [dv, date]);
  711. }
  712. },
  713. _selectDate: function(dateStr){
  714. var date = new Date(dateStr);
  715. var dv = date.format(this.options.format);
  716. if (this.options.isTime){
  717. this.changeViewToTime(date);
  718. }else{
  719. if (!this.options.beforeCurrent){
  720. var now = new Date();
  721. date.setHours(23,59,59);
  722. if (date.getTime()-now.getTime()<0){
  723. alert("选择的日期必须大于当前日期!");
  724. this.node.focus();
  725. return false;
  726. }
  727. }
  728. if (this.fireEvent("queryComplate", [dv, date])){
  729. var t = this.node.get("value");
  730. this.node.set("value", dv);
  731. this.hide();
  732. if (t!=dv) this.fireEvent("change", [dv, date, t]);
  733. this.fireEvent("complate", [dv, date, t]);
  734. }
  735. }
  736. },
  737. _setDayWeekTitleTh: function(table){
  738. var dayTable = table || this.contentTable;
  739. var thead = dayTable.getElement("thead");
  740. var cells = thead.getElements("th");
  741. if (this.css.calendarDaysContentTh) cells.setStyles(this.css.calendarDaysContentTh);
  742. //var days_abbr = Locale.get("Date").days_abbr;
  743. var days_abbr = o2.LP.widget.days_abbr;
  744. cells.each(function(item, idx){
  745. item.set("text", days_abbr[idx]);
  746. });
  747. return cells;
  748. },
  749. createContainer: function(){
  750. var div = null;
  751. var request = new Request.HTML({
  752. url: this.options.containerPath,
  753. method: "GET",
  754. async: false,
  755. onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript){
  756. div = responseTree[0];
  757. }
  758. });
  759. request.send();
  760. //this.containerNode = div.getElement(".MWF_calendar_container");
  761. this.titleNode = div.getElement(".MWF_calendar_title");
  762. this.prevNode = div.getElement(".MWF_calendar_prev");
  763. this.currentNode = div.getElement(".MWF_calendar_current");
  764. this.currentTextNode = div.getElement(".MWF_calendar_currentText");
  765. this.nextNode = div.getElement(".MWF_calendar_next");
  766. this.contentNode = div.getElement(".MWF_calendar_content");
  767. this.contentDateNode = div.getElement(".MWF_calendar_content_date");
  768. this.contentTimeNode = div.getElement(".MWF_calendar_content_time");
  769. this.bottomNode = div.getElement(".MWF_calendar_bottom");
  770. div.setStyles(this.css.container);
  771. this.titleNode.setStyles(this.css.dateTitle);
  772. this.prevNode.setStyles(this.css.datePrev);
  773. this.currentNode.setStyles(this.css.dateCurrent);
  774. this.currentTextNode.setStyles(this.css.dateCurrentText);
  775. this.nextNode.setStyles(this.css.dateNext);
  776. this.contentNode.setStyles(this.css.calendarContent);
  777. this.bottomNode.setStyles(this.css.dateBottom);
  778. return div;
  779. },
  780. createContentTable: function(){
  781. var table = null;
  782. var request = new Request.HTML({
  783. url: this.options[this.currentView+"Path"],
  784. method: "GET",
  785. async: false,
  786. onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript){
  787. table = responseTree[0];
  788. }
  789. });
  790. request.send();
  791. var tbody = table.getElement("tbody");
  792. if (tbody){
  793. var tds = tbody.getElements("td");
  794. var calendar = this;
  795. tds.addEvent("click", function(){
  796. switch (calendar.currentView) {
  797. case "day" :
  798. calendar._selectDate(this.retrieve("dateValue"), this);
  799. break;
  800. case "month" :
  801. calendar.changeViewToDay(this.retrieve("year"), this.retrieve("month"));
  802. break;
  803. case "year" :
  804. calendar.changeViewToMonth(this.retrieve("year"))
  805. break;
  806. case "time" :
  807. //nothing
  808. break;
  809. default :
  810. //nothing;
  811. }
  812. });
  813. switch (this.currentView) {
  814. case "day" :
  815. if (!table.display) table.display="";
  816. if (!table.style.display) table.style.display="";
  817. table.setStyles(this.css.calendarDaysContent);
  818. tds.setStyles(this.css.calendarDaysContentTd);
  819. break;
  820. case "month" :
  821. table.setStyles(this.css.calendarMonthsContent);
  822. tds.setStyles(this.css.calendarMonthsContentTd);
  823. break;
  824. case "year" :
  825. this.yearLength = tds.length;
  826. table.setStyles(this.css.calendarYearsContent);
  827. tds.setStyles(this.css.calendarYearsContentTd);
  828. break;
  829. case "time" :
  830. var nodes = table.getElements(".calendarTimeArea");
  831. if (nodes.length) nodes.setStyles(this.css.calendarTimeArea);
  832. nodes = table.getElements(".calendarTimeSlider");
  833. if (nodes.length) nodes.setStyles(this.css.calendarTimeSlider);
  834. nodes = table.getElements(".calendarTimeSliderKnob");
  835. if (nodes.length) nodes.setStyles(this.css.calendarTimeSliderKnob);
  836. nodes = table.getElements(".calendarTimeShow");
  837. if (nodes.length) nodes.setStyles(this.css.calendarTimeShow);
  838. nodes = table.getElements(".calendarTimeShowItem");
  839. if (nodes.length) nodes.setStyles(this.css.calendarTimeShowItem);
  840. var node = table.getElement(".MWF_calendar_action_show");
  841. if (node){
  842. node.setStyles(this.css.calendarActionShow);
  843. var buttons = node.getElements("button");
  844. buttons.setStyles(this.css.calendarActionShowButton);
  845. }
  846. break;
  847. default :
  848. //nothing;
  849. }
  850. tds.addEvent("mouseover", function(){
  851. this.setStyle("border", "1px solid #999999");
  852. });
  853. tds.addEvent("mouseout", function(){
  854. this.setStyle("border", "1px solid #FFF");
  855. });
  856. }else{
  857. switch (this.currentView) {
  858. case "day" :
  859. table.setStyles(this.css.calendarDaysContent);
  860. tds.setStyles(this.css.calendarDaysContentTd);
  861. break;
  862. case "month" :
  863. table.setStyles(this.css.calendarMonthsContent);
  864. tds.setStyles(this.css.calendarMonthsContentTd);
  865. break;
  866. case "year" :
  867. this.yearLength = tds.length;
  868. table.setStyles(this.css.calendarYearsContent);
  869. tds.setStyles(this.css.calendarYearsContentTd);
  870. break;
  871. case "time" :
  872. var nodes = table.getElements(".calendarTimeArea");
  873. if (nodes.length) nodes.setStyles(this.css.calendarTimeArea);
  874. nodes = table.getElements(".calendarTimeSlider");
  875. if (nodes.length) nodes.setStyles(this.css.calendarTimeSlider);
  876. nodes = table.getElements(".calendarTimeSliderKnob");
  877. if (nodes.length) nodes.setStyles(this.css.calendarTimeSliderKnob);
  878. nodes = table.getElements(".calendarTimeShow");
  879. if (nodes.length) nodes.setStyles(this.css.calendarTimeShow);
  880. nodes = table.getElements(".calendarTimeShowItem");
  881. if (nodes.length) nodes.setStyles(this.css.calendarTimeShowItem);
  882. var node = table.getElement(".MWF_calendar_action_show");
  883. if (node){
  884. node.setStyles(this.css.calendarActionShow);
  885. var buttons = node.getElements("button");
  886. buttons.setStyles(this.css.calendarActionShowButton);
  887. }
  888. break;
  889. default :
  890. //nothing;
  891. }
  892. }
  893. return table;
  894. }
  895. });