Calendar.js 32 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035
  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. if (layout.desktop.offices){
  297. Object.each(layout.desktop.offices, function(office){
  298. office.show();
  299. });
  300. }
  301. // }.bind(this));
  302. this.fireEvent("hide");
  303. }
  304. },
  305. show: function(){
  306. if (!this.visible){
  307. var dStr = this.node.get("value");
  308. if (dStr && Date.isValid(dStr)){
  309. this.options.baseDate = Date.parse(dStr.substr(0,10));
  310. }
  311. if(this.options.timeOnly){
  312. this.currentView = "time";
  313. }
  314. else{
  315. this.currentView = this.options.defaultView;
  316. }
  317. switch (this.currentView) {
  318. case "day" :
  319. this.changeViewToDay();
  320. break;
  321. case "month" :
  322. this.showMonth();
  323. break;
  324. case "year" :
  325. this.showYear();
  326. break;
  327. case "time" :
  328. //this.showTime(this.options.baseDate);
  329. this.changeViewToTime(this.options.defaultDate);
  330. //this.changeViewToTime(this.options.baseDate);
  331. break;
  332. default :
  333. this.showDay();
  334. }
  335. // if (!this.morph){
  336. // this.morph = new Fx.Morph(this.container, {"duration": 200});
  337. // }
  338. this.container.setStyle("display", "block");
  339. if (this.container.position){
  340. this.container.position({
  341. relativeTo: this.node,
  342. position: 'bottomLeft',
  343. edge: 'upperLeft'
  344. });
  345. // var offsetPNode = this.node.getOffsetParent();
  346. var cp = this.container.getPosition(this.options.target || null);
  347. var cSize = this.container.getSize();
  348. //var fp = (this.options.target) ? this.options.target.getPosition() : $(document.body).getPosition()
  349. var fsize = (this.options.target) ? this.options.target.getSize() : $(document.body).getSize();
  350. //if (cp.y+cSize.y>fsize.y+fp.y){
  351. if (cp.y+cSize.y>fsize.y){
  352. this.container.position({
  353. relativeTo: this.node,
  354. position: 'upperLeft',
  355. edge: 'bottomLeft'
  356. });
  357. }
  358. }else{
  359. var p = this.node.getPosition(this.options.target || null);
  360. var size = this.node.getSize();
  361. var containerSize = this.container.getSize();
  362. var bodySize = $(document.body).getSize();
  363. var left = p.x;
  364. if ((left + containerSize.x) > bodySize.x){
  365. left = bodySize.x - containerSize.x;
  366. }
  367. this.container.setStyle("top", p.y+size.y+2);
  368. this.container.setStyle("left", left);
  369. }
  370. // var p = this.container.getPosition();
  371. // var s = this.container.getSize();
  372. // var zidx = this.container.getStyle("z-index");
  373. // this.iframe = new Element("iframe", {"styles":{
  374. // "border": "0px",
  375. // "margin": "0px",
  376. // "padding": "0px",
  377. // "opacity": 0,
  378. // "z-index": (zidx) ? zidx-1 : 0,
  379. // "top": ""+p.y+"px",
  380. // "left": ""+p.x+"px",
  381. // "width": ""+s.x+"px",
  382. // "height": ""+s.y+"px",
  383. // "position": "absolute"
  384. // }}).inject(this.container, "before");
  385. if (layout.desktop.offices){
  386. Object.each(layout.desktop.offices, function(office){
  387. if (this.container.isOverlap(office.officeNode)){
  388. office.hide();
  389. }
  390. }.bind(this));
  391. }
  392. // this.morph.start({"opacity": 1}).chain(function(){
  393. this.visible = true;
  394. // }.bind(this));
  395. this.fireEvent("show");
  396. }
  397. },
  398. showYear: function(year){
  399. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  400. var date = new Date(thisYear, 1, 1);
  401. date.increment("year", -2);
  402. var beginYear = date.getFullYear();
  403. date.increment("year", this.yearLength-1);
  404. var endYear = date.getFullYear();
  405. this._setYearTitle(null, beginYear, endYear, thisYear);
  406. this._setYearDate(null, beginYear, endYear, thisYear);
  407. // if (!this.move){
  408. // this.move = true;
  409. // this.containerDrag = new Drag.Move(this.container);
  410. // }
  411. },
  412. _setYearTitle:function(node, beginYear, endYear, thisYear){
  413. var thisNode = node || this.currentTextNode;
  414. thisNode.set("text", beginYear+"-"+endYear);
  415. thisNode.store("year", thisYear);
  416. },
  417. _setYearDate: function(table, beginYear, endYear, year){
  418. var yearTable = table || this.contentYearTable;
  419. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  420. var tbody = yearTable.getElement("tbody");
  421. var tds = tbody.getElements("td");
  422. tds.each(function(item, idx){
  423. var y = beginYear+idx;
  424. item.set("text", y);
  425. item.store("year", y);
  426. if (y==this.options.baseDate.getFullYear()){
  427. item.addClass("current_"+this.options.style);
  428. }else{
  429. item.removeClass("current_"+this.options.style);
  430. }
  431. }.bind(this));
  432. },
  433. showMonth: function(year, month){
  434. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  435. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  436. this._setMonthTitle(null, thisYear, thisMonth);
  437. this._setMonthDate(null, thisYear, thisMonth);
  438. // if (!this.move){
  439. // this.move = true;
  440. // this.containerDrag = new Drag.Move(this.container);
  441. // }
  442. },
  443. _setMonthTitle:function(node, year){
  444. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  445. var thisNode = node || this.currentTextNode;
  446. thisNode.set("text", thisYear);
  447. thisNode.store("year", thisYear);
  448. },
  449. _setMonthDate: function(table, year, month){
  450. //var months = Locale.get("Date").months;
  451. var months = o2.LP.widget.months;
  452. var monthTable = table || this.contentMonthTable;
  453. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  454. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  455. var tbody = monthTable.getElement("tbody");
  456. var tds = tbody.getElements("td");
  457. tds.each(function(item, idx){
  458. item.set("text", months[idx].substr(0,2));
  459. item.store("year", thisYear);
  460. item.store("month", idx);
  461. if ((thisYear==this.options.baseDate.getFullYear()) && (idx==this.options.baseDate.getMonth())){
  462. item.addClass("current_"+this.options.style);
  463. }else{
  464. item.removeClass("current_"+this.options.style);
  465. }
  466. }.bind(this));
  467. },
  468. showDay: function(year, month){
  469. this._setDayTitle(null, year, month);
  470. this._setDayWeekTitleTh();
  471. this._setDayDate(null, year, month);
  472. // if (!this.move){
  473. // this.move = true;
  474. // this.containerDrag = new Drag.Move(this.container);
  475. // }
  476. },
  477. _setDayTitle: function(node, year, month){
  478. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  479. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  480. thisMonth++;
  481. var text = thisYear+"年"+thisMonth+"月";
  482. var thisNode = node || this.currentTextNode;
  483. thisNode.set("text", text);
  484. thisNode.store("year", thisYear);
  485. thisNode.store("month", thisMonth);
  486. },
  487. _setDayDate: function(table, year, month){
  488. var dayTable = table || this.contentTable;
  489. var baseDate = this.options.baseDate;
  490. if ((year!=undefined) && (month!=undefined)){
  491. baseDate = new Date();
  492. baseDate.setDate(1);
  493. baseDate.setFullYear(year);
  494. baseDate.setMonth(month);
  495. }
  496. var tbody = dayTable.getElement("tbody");
  497. var tds = tbody.getElements("td");
  498. var firstDate = baseDate.clone();
  499. firstDate.setDate(1);
  500. var day = firstDate.getDay();
  501. var tmpDate = firstDate.clone();
  502. for (var i=day-1; i>=0; i--){
  503. tmpDate.increment("day", -1);
  504. tds[i].set("text", tmpDate.getDate());
  505. tds[i].addClass("gray_"+this.options.style);
  506. tds[i].setStyles(this.css["gray_"+this.options.style]);
  507. tds[i].store("dateValue", tmpDate.toString())
  508. }
  509. for (var i=day; i<tds.length; i++){
  510. tds[i].set("text", firstDate.getDate());
  511. if (firstDate.toString() == this.options.baseDate.toString()){
  512. tds[i].addClass("current_"+this.options.style);
  513. tds[i].setStyles(this.css["current_"+this.options.style]);
  514. tds[i].removeClass("gray_"+this.options.style);
  515. tds[i].setStyle("border", "1px solid #FFF");
  516. }else if (firstDate.getMonth()!=baseDate.getMonth()){
  517. tds[i].addClass("gray_"+this.options.style);
  518. tds[i].setStyles(this.css["gray_"+this.options.style]);
  519. tds[i].removeClass("current_"+this.options.style);
  520. tds[i].setStyle("border", "1px solid #FFF");
  521. }else{
  522. tds[i].setStyles(this.css["normal_"+this.options.style]);
  523. tds[i].removeClass("current_"+this.options.style);
  524. tds[i].removeClass("gray_"+this.options.style);
  525. tds[i].setStyle("border", "1px solid #FFF");
  526. }
  527. var tmp = firstDate.clone();
  528. if (tmp.clearTime().toString() == this.today.clearTime().toString()){
  529. //tds[i].addClass("today_"+this.options.style);
  530. tds[i].setStyles(this.css["today_"+this.options.style]);
  531. tds[i].setStyle("border", "0px solid #AAA");
  532. }
  533. tds[i].store("dateValue", firstDate.toString())
  534. firstDate.increment("day", 1);
  535. }
  536. },
  537. changeViewToTime: function(date){
  538. this.currentView = "time";
  539. if (!this.contentTimeTable){
  540. this.contentTimeTable = this.createContentTable();
  541. this.contentTimeTable.inject(this.contentDateNode);
  542. }
  543. if (this.contentTable) this.contentTable.setStyle("display", "none");
  544. if (this.contentYearTable) this.contentYearTable.setStyle("display", "none");
  545. if (this.contentMonthTable) this.contentMonthTable.setStyle("display", "none");
  546. if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "block");
  547. // if (this.contentTimeTable) this.contentTimeTable.setStyle("display", "table");
  548. var thisDate = date || this.options.baseDate;
  549. this.showTime(thisDate);
  550. },
  551. showTime: function(date){
  552. // var thisHour = this.options.baseDate.getHours();
  553. // var thisMinutes = this.options.baseDate.getMinutes();
  554. // var thisSeconds = this.options.baseDate.getSeconds();
  555. var times = this.options.defaultTime.split(":");
  556. var thisHour = (times[0]) ? times[0] : "0";
  557. var thisMinutes = (times[1]) ? times[1] : "0";
  558. var thisSeconds = (times[2]) ? times[2] : "0";
  559. this._setTimeTitle(null, date);
  560. this._setTimeDate(null, thisHour, thisMinutes, thisSeconds);
  561. // if (this.move){
  562. // this.move = false;
  563. // this.container.removeEvents("mousedown");
  564. // }
  565. },
  566. _setTimeTitle: function(node, date){
  567. var thisDate = date || this.options.baseDate;
  568. var thisNode = node || this.currentTextNode;
  569. var y = thisDate.getFullYear();
  570. var m = thisDate.getMonth()+1;
  571. var d = thisDate.getDate();
  572. var text = "" + y + "年" + m + "月" + d + "日";
  573. if (this.options.timeOnly){
  574. thisNode.hide();
  575. if (this.prevNode) this.prevNode.hide();
  576. if (this.nextNode) this.nextNode.hide();
  577. }
  578. thisNode.set("text", text);
  579. thisNode.store("date", date);
  580. },
  581. _setTimeDate: function(node, h, m, s){
  582. this.itmeHNode = this.contentTimeTable.getElement(".MWF_calendar_time_h_slider");
  583. this.itmeMNode = this.contentTimeTable.getElement(".MWF_calendar_time_m_slider");
  584. // this.itmeSNode = this.contentTimeTable.getElement(".MWF_calendar_time_s_slider");
  585. this.timeShowNode = this.contentTimeTable.getElement(".MWF_calendar_time_show");
  586. this.timeShowNode.addEvent("click", function(){
  587. this._selectTime();
  588. }.bind(this));
  589. this.showHNode = this.contentTimeTable.getElement(".MWF_calendar_time_show_h");
  590. this.showMNode = this.contentTimeTable.getElement(".MWF_calendar_time_show_m");
  591. // this.showSNode = this.contentTimeTable.getElement(".MWF_calendar_time_show_s");
  592. this.showActionNode = this.contentTimeTable.getElement(".MWF_calendar_action_show");
  593. var calendar = this;
  594. if (COMMON.Browser.Platform.isMobile){
  595. this.itmeHNode.empty();
  596. this.itmeHNode.removeClass("calendarTimeSlider");
  597. this.itmeHNode.setStyles(this.css.calendarTimeSliderNoStyle);
  598. var sel = new Element("select").inject(this.itmeHNode);
  599. for (i=0; i<=23; i++){
  600. var v = (i<10) ? "0"+i: i;
  601. var o = new Element("option", {
  602. "value": v,
  603. "text": v
  604. }).inject(sel);
  605. if (h==i) o.set("selected", true);
  606. }
  607. sel.addEvent("change", function(){
  608. calendar.showHNode.set("text", this.options[this.selectedIndex].get("value"));
  609. });
  610. this.showHNode.set("text", sel.options[sel.selectedIndex].get("value"));
  611. this.itmeMNode.empty();
  612. this.itmeMNode.removeClass("calendarTimeSlider");
  613. this.itmeMNode.setStyles(this.css.calendarTimeSliderNoStyle);
  614. sel = new Element("select").inject(this.itmeMNode);
  615. for (i=0; i<=59; i++){
  616. var v = (i<10) ? "0"+i: i;
  617. var o = new Element("option", {
  618. "value": v,
  619. "text": v
  620. }).inject(sel);
  621. if (m==i) o.set("selected", true);
  622. }
  623. sel.addEvent("change", function(){
  624. calendar.showMNode.set("text", this.options[this.selectedIndex].get("value"));
  625. });
  626. this.showMNode.set("text", sel.options[sel.selectedIndex].get("value"));
  627. }else{
  628. var hSlider = new Slider(this.itmeHNode, this.itmeHNode.getFirst(), {
  629. range: [0, 23],
  630. initialStep: h.toInt(),
  631. onChange: function(value){
  632. var tmp = (value.toInt().toString());
  633. if (tmp.length<2){
  634. tmp = "0"+tmp
  635. }
  636. this.showHNode.set("text", tmp);
  637. this.itmeHNode.getFirst().set("text", tmp);
  638. }.bind(this)
  639. });
  640. var mSlider = new Slider(this.itmeMNode, this.itmeMNode.getFirst(), {
  641. range: [0, 59],
  642. initialStep: m.toInt(),
  643. onChange: function(value){
  644. var tmp = (value.toInt().toString());
  645. if (tmp.length<2){
  646. tmp = "0"+tmp
  647. }
  648. this.showMNode.set("text", tmp);
  649. this.itmeMNode.getFirst().set("text", tmp);
  650. }.bind(this)
  651. });
  652. }
  653. this.showHNode.set("text", h.toInt());
  654. this.showMNode.set("text", m.toInt());
  655. if (!this.okButton){
  656. this.okButton = new Element("button", {"text": "确定"}).inject(this.showActionNode);
  657. this.okButton.addEvent("click", function(){
  658. this._selectTime();
  659. this.hide();
  660. }.bind(this));
  661. this.okButton.setStyles(this.css.calendarActionShowButton);
  662. }
  663. if (!this.clearButton){
  664. this.clearButton = new Element("button", {"text": "清除"}).inject(this.showActionNode);
  665. this.clearButton.addEvent("click", function(){
  666. this.node.set("value", "");
  667. this.fireEvent("clear");
  668. this.hide();
  669. }.bind(this));
  670. this.clearButton.setStyles(this.css.calendarActionShowButton);
  671. }
  672. /*
  673. var sSlider = new Slider(this.itmeSNode, this.itmeSNode.getFirst(), {
  674. range: [0, 59],
  675. initialStep: s,
  676. onChange: function(value){
  677. var tmp = new String(value);
  678. if (tmp.length<2){
  679. tmp = "0"+tmp
  680. }
  681. this.showSNode.set("text", tmp);
  682. }.bind(this)
  683. });
  684. */
  685. },
  686. _selectTime: function(){
  687. var date = this.currentTextNode.retrieve("date");
  688. var h = this.showHNode.get("text");
  689. var m = this.showMNode.get("text");
  690. // var s = this.showSNode.get("text");
  691. date.setHours(h);
  692. date.setMinutes(m);
  693. // date.setSeconds(s);
  694. if (!this.options.beforeCurrent){
  695. var now = new Date();
  696. if (date.getTime()-now.getTime()<0){
  697. alert("选择的日期必须大于当前日期!");
  698. this.node.focus();
  699. return false;
  700. }
  701. }
  702. var dv = date.format(this.options.format);
  703. if (this.fireEvent("queryComplate", [dv, date])){
  704. var t = this.node.get("value");
  705. this.node.set("value", dv);
  706. // this.node.focus();
  707. this.hide();
  708. if (t!=dv) this.fireEvent("change", [dv, date, t]);
  709. this.fireEvent("complate", [dv, date]);
  710. }
  711. },
  712. _selectDate: function(dateStr){
  713. var date = new Date(dateStr);
  714. var dv = date.format(this.options.format);
  715. if (this.options.isTime){
  716. this.changeViewToTime(date);
  717. }else{
  718. if (!this.options.beforeCurrent){
  719. var now = new Date();
  720. date.setHours(23,59,59);
  721. if (date.getTime()-now.getTime()<0){
  722. alert("选择的日期必须大于当前日期!");
  723. this.node.focus();
  724. return false;
  725. }
  726. }
  727. if (this.fireEvent("queryComplate", [dv, date])){
  728. var t = this.node.get("value");
  729. this.node.set("value", dv);
  730. this.hide();
  731. if (t!=dv) this.fireEvent("change", [dv, date, t]);
  732. this.fireEvent("complate", [dv, date, t]);
  733. }
  734. }
  735. },
  736. _setDayWeekTitleTh: function(table){
  737. var dayTable = table || this.contentTable;
  738. var thead = dayTable.getElement("thead");
  739. var cells = thead.getElements("th");
  740. if (this.css.calendarDaysContentTh) cells.setStyles(this.css.calendarDaysContentTh);
  741. //var days_abbr = Locale.get("Date").days_abbr;
  742. var days_abbr = o2.LP.widget.days_abbr;
  743. cells.each(function(item, idx){
  744. item.set("text", days_abbr[idx]);
  745. });
  746. return cells;
  747. },
  748. createContainer: function(){
  749. var div = null;
  750. var request = new Request.HTML({
  751. url: this.options.containerPath,
  752. method: "GET",
  753. async: false,
  754. onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript){
  755. div = responseTree[0];
  756. }
  757. });
  758. request.send();
  759. //this.containerNode = div.getElement(".MWF_calendar_container");
  760. this.titleNode = div.getElement(".MWF_calendar_title");
  761. this.prevNode = div.getElement(".MWF_calendar_prev");
  762. this.currentNode = div.getElement(".MWF_calendar_current");
  763. this.currentTextNode = div.getElement(".MWF_calendar_currentText");
  764. this.nextNode = div.getElement(".MWF_calendar_next");
  765. this.contentNode = div.getElement(".MWF_calendar_content");
  766. this.contentDateNode = div.getElement(".MWF_calendar_content_date");
  767. this.contentTimeNode = div.getElement(".MWF_calendar_content_time");
  768. this.bottomNode = div.getElement(".MWF_calendar_bottom");
  769. div.setStyles(this.css.container);
  770. this.titleNode.setStyles(this.css.dateTitle);
  771. this.prevNode.setStyles(this.css.datePrev);
  772. this.currentNode.setStyles(this.css.dateCurrent);
  773. this.currentTextNode.setStyles(this.css.dateCurrentText);
  774. this.nextNode.setStyles(this.css.dateNext);
  775. this.contentNode.setStyles(this.css.calendarContent);
  776. this.bottomNode.setStyles(this.css.dateBottom);
  777. return div;
  778. },
  779. createContentTable: function(){
  780. var table = null;
  781. var request = new Request.HTML({
  782. url: this.options[this.currentView+"Path"],
  783. method: "GET",
  784. async: false,
  785. onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript){
  786. table = responseTree[0];
  787. }
  788. });
  789. request.send();
  790. var tbody = table.getElement("tbody");
  791. if (tbody){
  792. var tds = tbody.getElements("td");
  793. var calendar = this;
  794. tds.addEvent("click", function(){
  795. switch (calendar.currentView) {
  796. case "day" :
  797. calendar._selectDate(this.retrieve("dateValue"), this);
  798. break;
  799. case "month" :
  800. calendar.changeViewToDay(this.retrieve("year"), this.retrieve("month"));
  801. break;
  802. case "year" :
  803. calendar.changeViewToMonth(this.retrieve("year"))
  804. break;
  805. case "time" :
  806. //nothing
  807. break;
  808. default :
  809. //nothing;
  810. }
  811. });
  812. switch (this.currentView) {
  813. case "day" :
  814. if (!table.display) table.display="";
  815. if (!table.style.display) table.style.display="";
  816. table.setStyles(this.css.calendarDaysContent);
  817. tds.setStyles(this.css.calendarDaysContentTd);
  818. break;
  819. case "month" :
  820. table.setStyles(this.css.calendarMonthsContent);
  821. tds.setStyles(this.css.calendarMonthsContentTd);
  822. break;
  823. case "year" :
  824. this.yearLength = tds.length;
  825. table.setStyles(this.css.calendarYearsContent);
  826. tds.setStyles(this.css.calendarYearsContentTd);
  827. break;
  828. case "time" :
  829. var nodes = table.getElements(".calendarTimeArea");
  830. if (nodes.length) nodes.setStyles(this.css.calendarTimeArea);
  831. nodes = table.getElements(".calendarTimeSlider");
  832. if (nodes.length) nodes.setStyles(this.css.calendarTimeSlider);
  833. nodes = table.getElements(".calendarTimeSliderKnob");
  834. if (nodes.length) nodes.setStyles(this.css.calendarTimeSliderKnob);
  835. nodes = table.getElements(".calendarTimeShow");
  836. if (nodes.length) nodes.setStyles(this.css.calendarTimeShow);
  837. nodes = table.getElements(".calendarTimeShowItem");
  838. if (nodes.length) nodes.setStyles(this.css.calendarTimeShowItem);
  839. var node = table.getElement(".MWF_calendar_action_show");
  840. if (node){
  841. node.setStyles(this.css.calendarActionShow);
  842. var buttons = node.getElements("button");
  843. buttons.setStyles(this.css.calendarActionShowButton);
  844. }
  845. break;
  846. default :
  847. //nothing;
  848. }
  849. tds.addEvent("mouseover", function(){
  850. this.setStyle("border", "1px solid #999999");
  851. });
  852. tds.addEvent("mouseout", function(){
  853. this.setStyle("border", "1px solid #FFF");
  854. });
  855. }else{
  856. switch (this.currentView) {
  857. case "day" :
  858. table.setStyles(this.css.calendarDaysContent);
  859. tds.setStyles(this.css.calendarDaysContentTd);
  860. break;
  861. case "month" :
  862. table.setStyles(this.css.calendarMonthsContent);
  863. tds.setStyles(this.css.calendarMonthsContentTd);
  864. break;
  865. case "year" :
  866. this.yearLength = tds.length;
  867. table.setStyles(this.css.calendarYearsContent);
  868. tds.setStyles(this.css.calendarYearsContentTd);
  869. break;
  870. case "time" :
  871. var nodes = table.getElements(".calendarTimeArea");
  872. if (nodes.length) nodes.setStyles(this.css.calendarTimeArea);
  873. nodes = table.getElements(".calendarTimeSlider");
  874. if (nodes.length) nodes.setStyles(this.css.calendarTimeSlider);
  875. nodes = table.getElements(".calendarTimeSliderKnob");
  876. if (nodes.length) nodes.setStyles(this.css.calendarTimeSliderKnob);
  877. nodes = table.getElements(".calendarTimeShow");
  878. if (nodes.length) nodes.setStyles(this.css.calendarTimeShow);
  879. nodes = table.getElements(".calendarTimeShowItem");
  880. if (nodes.length) nodes.setStyles(this.css.calendarTimeShowItem);
  881. var node = table.getElement(".MWF_calendar_action_show");
  882. if (node){
  883. node.setStyles(this.css.calendarActionShow);
  884. var buttons = node.getElements("button");
  885. buttons.setStyles(this.css.calendarActionShowButton);
  886. }
  887. break;
  888. default :
  889. //nothing;
  890. }
  891. }
  892. return table;
  893. }
  894. });