WeekView.js 64 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733
  1. MWF.require("MWF.widget.Calendar", null, false);
  2. var MWFCalendarWeekView = MWF.xApplication.Calendar.WeekView = new Class({
  3. Extends: MWF.widget.Common,
  4. Implements: [Options, Events],
  5. options: {
  6. "style": "default",
  7. "date" : ""
  8. },
  9. initialize: function(node, app, options){
  10. this.setOptions(options);
  11. this.path = "/x_component_Calendar/$WeekView/";
  12. this.cssPath = "/x_component_Calendar/$WeekView/"+this.options.style+"/css.wcss";
  13. this._loadCss();
  14. this.app = app;
  15. this.container = $(node);
  16. this.weekBegin = this.app.calendarConfig.weekBegin || "0";
  17. this.load();
  18. },
  19. load: function(){
  20. this.node = new Element("div.node", {"styles": this.css.node}).inject(this.container);
  21. this.node.setStyle("position","relative");
  22. //this.loadSideBar();
  23. this.resetNodeSize();
  24. //this.app.addEvent("resize", this.resetNodeSize.bind(this));
  25. this.loadCalendar();
  26. },
  27. resetNodeSize: function(){
  28. //if( this.app.inContainer )return;
  29. var size = this.container.getSize();
  30. var y = size.y-50;
  31. this.node.setStyle("height", ""+y+"px");
  32. //this.node.setStyle("margin-top", "60px");
  33. if( this.calendar ){
  34. this.calendar.resetBodySize()
  35. }
  36. //var sideBarSize = this.app.sideBar ? this.app.sideBar.getSize() : { x : 0, y:0 };
  37. //this.node.setStyle("width", ""+(size.x - sideBarSize.x)+"px");
  38. //this.node.setStyle("margin-right", ""+sideBarSize.x+"px");
  39. //var size = this.container.getSize();
  40. //
  41. //this.scrollNode.setStyle("height", ""+(size.y-60)+"px");
  42. //this.scrollNode.setStyle("margin-top", "60px");
  43. //
  44. //if (this.contentWarpNode){
  45. // this.contentWarpNode.setStyles({
  46. // "width": (size.x - 50) +"px"
  47. // });
  48. //}
  49. },
  50. loadCalendar: function(){
  51. var date = "";
  52. if( this.options.date ){
  53. date = Date.parse( this.options.date )
  54. }else{
  55. date = new Date();
  56. }
  57. this.currentWeek = this.getWeekNumber( date );
  58. this.calendar = new MWFCalendarWeekView.Calendar(this, date );
  59. },
  60. hide: function(){
  61. var fx = new Fx.Morph(this.node, {
  62. "duration": "300",
  63. "transition": Fx.Transitions.Expo.easeOut
  64. });
  65. fx.start({
  66. "opacity": 0
  67. }).chain(function(){
  68. this.node.setStyle("display", "none");
  69. }.bind(this));
  70. },
  71. show: function(){
  72. this.node.setStyles(this.css.node);
  73. var fx = new Fx.Morph(this.node, {
  74. "duration": "800",
  75. "transition": Fx.Transitions.Expo.easeOut
  76. });
  77. //this.app.fireAppEvent("resize");
  78. fx.start({
  79. "opacity": 1
  80. //"left": MWFCalendar.LeftNaviWidth+"px"
  81. }).chain(function(){
  82. //this.node.setStyles({
  83. // "position": "static",
  84. // "width": "auto"
  85. //});
  86. if( this.calendar.dataTable_WholeDay ){
  87. this.calendar.dataTable_WholeDay.setStyle("display","");
  88. }
  89. }.bind(this));
  90. },
  91. reload: function(){
  92. if (this.calendar) this.calendar.reLoadCalendar();
  93. },
  94. recordStatus : function(){
  95. var date = "";
  96. if (this.calendar) date = this.calendar.baseDate;
  97. return {
  98. date : date.toString()
  99. };
  100. },
  101. destroy: function(){
  102. if (this.calendar){
  103. this.calendar.destroy();
  104. }
  105. this.node.destroy();
  106. //MWF.release( this );
  107. },
  108. getWeekNumber: function(d){
  109. // Create a copy of this date object
  110. var target = d.clone();
  111. // ISO week date weeks start on monday
  112. // so correct the day number
  113. //var dayNr = (d.getDay() + 6) % 7;
  114. var dayNr = ( 7 + d.getDay() - parseInt( this.weekBegin ) ) % 7;
  115. // ISO 8601 states that week 1 is the week
  116. // with the first thursday of that year.
  117. // Set the target date to the thursday in the target week
  118. target.setDate(target.getDate() - dayNr + 3);
  119. // Store the millisecond value of the target date
  120. var firstThursday = target.valueOf();
  121. // Set the target to the first thursday of the year
  122. // First set the target to january first
  123. target.setMonth(0, 1);
  124. // Not a thursday? Correct the date to the next thursday
  125. if (target.getDay() != 4) {
  126. target.setMonth(0, 1 + ((4 - target.getDay()) + 7) % 7);
  127. }
  128. // The weeknumber is the number of weeks between the
  129. // first thursday of the year and the thursday in the target week
  130. return 1 + Math.ceil((firstThursday - target) / 604800000); // 604800000 = 7 * 24 * 3600 * 1000
  131. }
  132. });
  133. MWFCalendarWeekView.DayWidth;
  134. MWFCalendarWeekView.HourHeight = 48;
  135. MWFCalendarWeekView.DayHeight = 24*MWFCalendarWeekView.HourHeight;
  136. MWFCalendarWeekView.DayMsec = 3600 * 24 * 1000;
  137. MWFCalendarWeekView.WeekWidth;
  138. MWFCalendarWeekView.WeekMsec = MWFCalendarWeekView.DayMsec * 7;
  139. MWFCalendarWeekView.Calendar = new Class({
  140. Implements: [Events],
  141. initialize: function(view, date){
  142. this.view = view;
  143. this.css = this.view.css;
  144. this.container = this.view.node;
  145. this.app = this.view.app;
  146. this.weekBegin = this.app.calendarConfig.weekBegin || "0";
  147. this.baseDate = date || new Date();
  148. this.today = new Date();
  149. this.load();
  150. },
  151. load: function(){
  152. this.date = this.getWeekStartTime( this.baseDate );
  153. this.weekStartTime = new Date( this.date.get("year"), this.date.get("month"), this.date.get("date"), 0, 0, 0 );
  154. this.weekStartTimeStr = this.weekStartTime.format( "db" );
  155. var end = this.date.clone().increment( "day", 6 );
  156. this.weekEndTime = new Date( end.get("year"), end.get("month"), end.get("date"), 23, 59, 59 );
  157. this.weekEndTimeStr = this.weekEndTime.format( "db" );
  158. this.titleNode = new Element("div", {"styles": this.css.calendarTitleNode}).inject(this.container);
  159. this.titleTable = new Element("table.titleTable", {
  160. "styles": this.css.titleTable,
  161. "border": "0",
  162. "cellPadding": "0",
  163. "cellSpacing": "0"
  164. }).inject(this.container);
  165. this.scrollNode = new Element("div.scrollNode", {
  166. "styles": this.css.scrollNode //this.app.inContainer ? this.css.scrollNode_inContainer : this.css.scrollNode
  167. }).inject(this.container);
  168. this.contentWarpNode = new Element("div.contentWarpNode", {
  169. "styles": this.css.contentWarpNode
  170. }).inject(this.scrollNode);
  171. this.contentContainerNode = new Element("div.contentContainerNode",{
  172. "styles" : this.css.contentContainerNode
  173. }).inject(this.contentWarpNode);
  174. this.bodyNode = new Element("div.bodyNode", {
  175. "styles": this.css.contentNode
  176. }).inject(this.contentContainerNode);
  177. this.bodyNode.setStyle("position","relative");
  178. //this.bodyNode = new Element("div", {"styles": this.css.calendarBodyNode}).inject(this.container);
  179. this.setTitleNode();
  180. this.loadTitleTable();
  181. this.loadBodyTable();
  182. //this.resetBodySize();
  183. this.loadDataTable_WholeDay();
  184. this.loadDataTable();
  185. this.loadCalendar();
  186. //this.loadWholedayData( function(json){
  187. // this.loadWholeday(json);
  188. //}.bind(this));
  189. //
  190. //this.loadData( function( json ){
  191. // this.loadDataDay( json );
  192. //}.bind(this));
  193. //this.app.addEvent("resize", this.resetBodySize.bind(this));
  194. },
  195. getWeekStartTime: function( d ){
  196. var date = d.clone();
  197. //var week = date.getDay();
  198. //if( this.weekBegin == "1" ){
  199. // var decrementDay = ((week-1)<0) ? 6 : week-1;
  200. //}else{
  201. // var decrementDay = week;
  202. //}
  203. var decrementDay = ( 7 + d.getDay() - parseInt( this.weekBegin ) ) % 7;
  204. return date.decrement("day", decrementDay);
  205. },
  206. setTitleNode: function(){
  207. this.prevWeekNode = new Element("div", {"styles": this.css.calendarPrevWeekNode}).inject(this.titleNode);
  208. var text = this.baseDate.format(this.app.lp.dateFormatMonth)
  209. + ",第" + this.view.getWeekNumber( this.baseDate ) + "周";
  210. this.titleTextNode = new Element("div", {"styles": this.css.calendarTitleTextNode, "text": text}).inject(this.titleNode);
  211. this.nextWeekNode = new Element("div", {"styles": this.css.calendarNextWeekNode}).inject(this.titleNode);
  212. this.prevWeekNode.addEvents({
  213. "mouseover": function(){this.prevWeekNode.setStyles(this.css.calendarPrevWeekNode_over);}.bind(this),
  214. "mouseout": function(){this.prevWeekNode.setStyles(this.css.calendarPrevWeekNode);}.bind(this),
  215. "mousedown": function(){this.prevWeekNode.setStyles(this.css.calendarPrevWeekNode_down);}.bind(this),
  216. "mouseup": function(){this.prevWeekNode.setStyles(this.css.calendarPrevWeekNode_over);}.bind(this),
  217. "click": function(){this.changeWeekPrev();}.bind(this)
  218. });
  219. this.nextWeekNode.addEvents({
  220. "mouseover": function(){this.nextWeekNode.setStyles(this.css.calendarNextWeekNode_over);}.bind(this),
  221. "mouseout": function(){this.nextWeekNode.setStyles(this.css.calendarNextWeekNode);}.bind(this),
  222. "mousedown": function(){this.nextWeekNode.setStyles(this.css.calendarNextWeekNode_down);}.bind(this),
  223. "mouseup": function(){this.nextWeekNode.setStyles(this.css.calendarNextWeekNode_over);}.bind(this),
  224. "click": function(){this.changeWeekNext();}.bind(this)
  225. });
  226. this.titleTextNode.addEvents({
  227. "mouseover": function(){this.titleTextNode.setStyles(this.css.calendarTitleTextNode_over);}.bind(this),
  228. "mouseout": function(){this.titleTextNode.setStyles(this.css.calendarTitleTextNode);}.bind(this),
  229. "mousedown": function(){this.titleTextNode.setStyles(this.css.calendarTitleTextNode_down);}.bind(this),
  230. "mouseup": function(){this.titleTextNode.setStyles(this.css.calendarTitleTextNode_over);}.bind(this)
  231. //"click": function(){this.changeWeekSelect();}.bind(this)
  232. });
  233. this.createWeekSelector();
  234. },
  235. changeWeekPrev: function(){
  236. this.date.decrement("week", 1);
  237. this.baseDate = this.date;
  238. var text = this.baseDate.format(this.app.lp.dateFormatMonth) + ",第" + this.view.getWeekNumber( this.baseDate ) + "周";
  239. this.titleTextNode.set("text", text);
  240. this.reLoadCalendar();
  241. },
  242. changeWeekNext: function(){
  243. this.date.increment("week", 1);
  244. this.baseDate = this.date;
  245. var text = this.baseDate.format(this.app.lp.dateFormatMonth) + ",第" + this.view.getWeekNumber( this.baseDate ) + "周";
  246. this.titleTextNode.set("text", text);
  247. this.reLoadCalendar();
  248. },
  249. changeWeekSelect: function(){
  250. if (!this.monthSelector) this.createWeekSelector();
  251. //this.monthSelector.show();
  252. },
  253. createWeekSelector: function(){
  254. //this.monthSelector = new MWFCalendarWeekView.Calendar.WeekSelector(this.date, this);
  255. this.weekCalendar = new MWFCalendarWeekView.WeekCalendar(this.titleTextNode, {
  256. "style":"meeting_blue",
  257. "weekBegin" : this.weekBegin,
  258. "target": this.node,
  259. "baseDate" : this.baseDate,
  260. "onInit" : function(){
  261. this.options.dayPath = this.options.path+this.options.style+"/day_week.html";
  262. },
  263. "onQueryComplate": function(e, dv, date){
  264. var selectedDate = new Date.parse(dv);
  265. this.changeWeekTo(selectedDate);
  266. }.bind(this)
  267. });
  268. //this.weekCalendar.app = this.app;
  269. },
  270. changeWeekTo: function(d){
  271. this.baseDate = d;
  272. this.date = this.getWeekStartTime( d );
  273. //var text = this.date.format(this.app.lp.dateFormatWeek);
  274. //this.titleTextNode.set("text", text);
  275. var text = this.baseDate.format(this.app.lp.dateFormatMonth) + ",第" + this.view.getWeekNumber( this.baseDate ) + "周";
  276. this.titleTextNode.set("text", text);
  277. this.reLoadCalendar();
  278. },
  279. isToday : function( d ){
  280. var today = new Date();
  281. if( today.get("year") != d.get("year") )return false;
  282. if( today.get("month") != d.get("month") )return false;
  283. if( today.get("date") != d.get("date") )return false;
  284. return true;
  285. },
  286. loadTitleTable: function(){
  287. var _self = this;
  288. if( !this.tableHead ){
  289. var d = this.date.clone();
  290. var head = this.tableHead = new Element("tr", {
  291. "styles" : this.css.calendarTableTitleTr
  292. }).inject( this.titleTable );
  293. new Element("th", {
  294. "styles" : this.css.calendarTableTh_hour
  295. }).inject(head);
  296. for( var i=0; i<7; i++ ) {
  297. var index = ( i + parseInt( this.weekBegin ) ) % 7;
  298. var th = new Element("th", {
  299. "styles": this.css.calendarTableTh,
  300. text: this.app.lp.weeks.arr[index] + "(" + d.format("%m.%d") + ")"
  301. }).inject(head);
  302. th.store("date", d.format("%Y-%m-%d") );
  303. th.addEvent( "click", function(){
  304. _self.app.toDay( this.retrieve("date") )
  305. }.bind(th));
  306. d.increment("day", 1);
  307. }
  308. var tr = this.wholeDayTr = new Element( "tr").inject( this.titleTable );
  309. var td = new Element( "td.calendarTableCell", {
  310. "tdType" : "hour",
  311. styles : this.css.calendarTableCell_hour
  312. } ).inject( tr );
  313. td.setStyle("min-height","80px");
  314. var node = new Element("div",{
  315. text : "全天"
  316. }).inject( td );
  317. td.store("hour",i );
  318. this.wholeDayTdMap = {};
  319. var d = this.date.clone();
  320. for( var j=0; j<7; j++ ){
  321. td = this.wholeDayTdMap[j] = new Element( "td" , {
  322. "tdType" : "calendar",
  323. "styles" : this.css.calendarTableCell,
  324. "index" : j+1
  325. }).inject( tr );
  326. td.store("dateStr",d.format("%Y-%m-%d"));
  327. td.store("index",j);
  328. td.addEvent("click", function(ev){
  329. this.setCurrentTd( ev.target );
  330. }.bind(this));
  331. td.addEvent("dblclick", function(ev){
  332. this.cancelCurrentTd();
  333. var form = new MWF.xApplication.Calendar.EventForm(this,{}, {
  334. startTime : Date.parse( ev.target.retrieve("dateStr")) ,
  335. endTime : Date.parse( ev.target.retrieve("dateStr")),
  336. isWholeday : true
  337. }, {app:this.app});
  338. form.view = this;
  339. form.create();
  340. }.bind(this));
  341. new Drag(td, {
  342. "onStart": function(dragged, e){
  343. this.cancelCurrentTd();
  344. this.cellDragStart_wholeDay(dragged, e);
  345. }.bind(this),
  346. "onDrag": function(dragged, e){
  347. this.cellDrag_wholeDay(dragged, e);
  348. }.bind(this),
  349. "onComplete": function(dragged, e){
  350. this.completeDrag_wholeDay(dragged, e);
  351. }.bind(this)
  352. });
  353. d.increment("day", 1);
  354. }
  355. }else{
  356. var d = this.date.clone();
  357. this.tableHead.getElements("th").each( function( th, i ){
  358. if( i == 0 )return;
  359. var index = ( i - 1 + parseInt( this.weekBegin ) ) % 7;
  360. th.set("text", this.app.lp.weeks.arr[index] + "(" + d.format("%d") + ")");
  361. th.store("date", d.format("%Y-%m-%d") );
  362. d.increment("day", 1);
  363. }.bind(this));
  364. var d = this.date.clone();
  365. Object.each( this.wholeDayTdMap, function( td, i ){
  366. td.store("dateStr",d.format("%Y-%m-%d"));
  367. d.increment("day", 1);
  368. }.bind(this))
  369. }
  370. },
  371. loadBodyTable: function(){
  372. this.calendarTable = new Element("table.dragTable", {
  373. "styles": this.css.calendarTable,
  374. "height": "100%",
  375. "border": "0",
  376. "cellPadding": "0",
  377. "cellSpacing": "0"
  378. }).inject(this.bodyNode);
  379. this.hourTdMap = {};
  380. this.hourTrMap = {};
  381. for( var i=0; i<24; i++ ){
  382. var tr = new Element( "tr").inject( this.calendarTable );
  383. var td = new Element( "td.calendarTableCell", {
  384. "tdType" : "hour",
  385. styles : this.css.calendarTableCell_hour,
  386. valign : "top"
  387. } ).inject( tr );
  388. var node = new Element("div",{
  389. text : i + ":00"
  390. }).inject( td );
  391. td.store("hour",i );
  392. for( var j=0; j<7; j++ ){
  393. if( !this.hourTdMap[j] )this.hourTdMap[j] = {};
  394. var td = this.hourTdMap[j][i] = new Element( "td" , {
  395. "tdType" : "calendar",
  396. "styles" : this.css.calendarTableCell,
  397. "index" : j+1
  398. }).inject( tr );
  399. td.store("hour",i );
  400. td.store("index",j );
  401. td.addEvent("click", function(ev){
  402. this.setCurrentTd( ev.target );
  403. }.bind(this));
  404. td.addEvent("dblclick", function(ev){
  405. this.cancelCurrentTd();
  406. var hour = ev.target.retrieve("hour");
  407. var index = ev.target.retrieve("index");
  408. var dateStr = this.getDateByIndex( index );
  409. var form = new MWF.xApplication.Calendar.EventForm(this,{}, {
  410. startTime : Date.parse( dateStr + " " +hour+":00") ,
  411. endTime : Date.parse( dateStr + " " + (hour+1)+":00" )
  412. }, {app:this.app});
  413. form.view = this;
  414. form.create();
  415. }.bind(this));
  416. new Drag(td, {
  417. "onStart": function(dragged, e){
  418. this.cancelCurrentTd();
  419. this.cellDragStart(dragged, e);
  420. }.bind(this),
  421. "onDrag": function(dragged, e){
  422. this.cellDrag(dragged, e);
  423. }.bind(this),
  424. "onComplete": function(dragged, e){
  425. this.completeDrag(dragged, e);
  426. }.bind(this)
  427. });
  428. }
  429. this.hourTrMap[ i ] = tr;
  430. }
  431. },
  432. setCurrentTd : function(td){
  433. td.setStyle("background-color","#fffdf2");
  434. if( this.currentSelectedTd ){
  435. var flag = this.currentSelectedTd.retrieve("index") == this.todayIndex;
  436. this.currentSelectedTd.setStyle("background-color",flag?"#F8FBFF":"#fff");
  437. }
  438. this.currentSelectedTd = td;
  439. },
  440. cancelCurrentTd : function(){
  441. if( this.currentSelectedTd ){
  442. var flag = this.currentSelectedTd.retrieve("index") == this.todayIndex;
  443. this.currentSelectedTd.setStyle("background-color",flag?"#F8FBFF":"#fff");
  444. }
  445. this.currentSelectedTd = null;
  446. },
  447. reLoadCalendar: function(){
  448. this.weekStartTime = new Date( this.date.get("year"), this.date.get("month"), this.date.get("date"), 0, 0, 0 );
  449. this.weekStartTimeStr = this.weekStartTime.format( "db" );
  450. var end = this.date.clone().increment( "day", 6 );
  451. this.weekEndTime = new Date( end.get("year"), end.get("month"), end.get("date"), 23, 59, 59 );
  452. this.weekEndTimeStr = this.weekEndTime.format( "db" );
  453. Object.each(this.dayMap || {}, function(day){
  454. day.destroy();
  455. }.bind(this));
  456. this.dayMap = {};
  457. if( this.wholeday ){
  458. this.wholeday.destroy();
  459. }
  460. this.wholeday = null;
  461. //this.calendarTable.getElements("td[tdType='calendar']").each( function(td){
  462. // td.empty();
  463. //}.bind(this));
  464. this.loadTitleTable();
  465. this.loadCalendar();
  466. },
  467. loadCalendar : function(){
  468. this.app.currentDate = this.baseDate.clone();
  469. this.dateIndexMap = null;
  470. this.titleTable.getElement("td:nth-child(1)").setStyle("height", "auto") ;
  471. this.loadData( function(){
  472. this.loadWholeday(this.wholeDayData);
  473. this.loadDataDay( this.inOneDayEvents );
  474. this.resetBodySize();
  475. this.setTodayTds();
  476. this.cancelCurrentTd();
  477. }.bind(this));
  478. },
  479. setTodayTds : function(){
  480. var now = new Date();
  481. var index = this.todayIndex = this.getDateNumOfWeek( now.format("%Y-%m-%d") );
  482. var hour = now.get("hours");
  483. var mintues = now.get("minutes");
  484. mintues = mintues < 2 ? 2 : mintues;
  485. if( index > -1 ){
  486. this.todayTds = [];
  487. var td = this.wholeDayTdMap[index];
  488. td.setStyle("background-color","#f8fbff");
  489. this.todayTds.push( td );
  490. var tds = this.hourTdMap[index];
  491. Object.each( tds, function( td, i ){
  492. td.setStyle("background-color","#f8fbff");
  493. this.todayTds.push( td );
  494. }.bind(this));
  495. this.nowTd = tds[hour];
  496. var nowTdPosition = this.nowTd.getPosition(this.bodyNode);
  497. this.nowTimeNode = new Element("div",{
  498. styles : {
  499. "position" : "absolute",
  500. "left" : nowTdPosition.x,
  501. "top" : nowTdPosition.y + ( (mintues - 2) / 60 ) * MWFCalendarWeekView.HourHeight,
  502. "height" : "2px",
  503. "width" : MWFCalendarWeekView.DayWidth,
  504. "background-color" : "#ff3333"
  505. }
  506. }).inject(this.bodyNode);
  507. }else if( this.todayTds && this.todayTds.length ){
  508. while( this.todayTds.length > 0 ){
  509. this.todayTds.pop().setStyle("background-color","#fff");
  510. }
  511. if(this.nowTd)this.nowTd = null;
  512. if( this.nowTimeNode )this.nowTimeNode.destroy();
  513. }
  514. },
  515. loadData : function( callback ){
  516. this.app.actions.listEventWithFilter( {
  517. calendarIds : this.app.getSelectedCalendarId(),
  518. startTime : this.weekStartTimeStr,
  519. endTime : this.weekEndTimeStr //,
  520. //createPerson : this.app.userName
  521. }, function(json){
  522. this.wholeDayData = ( json.data && json.data.wholeDayEvents ) ? json.data.wholeDayEvents : [];
  523. this.inOneDayEvents = [];
  524. (( json.data && json.data.inOneDayEvents) ? json.data.inOneDayEvents : []).each( function( d ){
  525. if(d.inOneDayEvents.length > 0 ){
  526. this.inOneDayEvents.push( d );
  527. }
  528. }.bind(this));
  529. //json.data.each( function(d){
  530. // var flag = false;
  531. // if( d.isAllDayEvent ){
  532. // flag = true;
  533. // }else if( d.startTime.split(" ")[0] != d.endTime.split(" ")[0] ){
  534. // flag = true;
  535. // }
  536. // if( flag ){
  537. // this.wholeDayData.push( d )
  538. // }else{
  539. // this.inOneDayEvents.push(d)
  540. // }
  541. //}.bind(this));
  542. if(callback)callback();
  543. }.bind(this))
  544. },
  545. loadDataTable_WholeDay: function( json ){
  546. this.dataTable_WholeDay = new Element("table.dataTable", {
  547. "styles": this.css.calendarTable,
  548. "border": "0",
  549. "cellPadding": "0",
  550. "height" : "0",
  551. "cellSpacing": "0"
  552. }).inject(this.container);
  553. this.dataTable_WholeDay.setStyles({
  554. "display" : "none",
  555. "position":"absolute",
  556. "top" : "92px",
  557. "left" : "0px",
  558. "margin": "0px auto 0px 12px"
  559. });
  560. var tr = new Element("tr").inject(this.dataTable_WholeDay);
  561. new Element( "td" , {
  562. "styles" : {"height":"0px" ,"position":"relative"}
  563. }).inject( tr );
  564. this.dataTd_WholeDay = new Element( "td" , {
  565. "valign" : "top",
  566. "styles" : {"height":"0px","position":"relative"}
  567. }).inject( tr );
  568. //this.dataTdMap_WholeDay = {};
  569. //for( var i=0 ;i <7; i++ ){
  570. // this.dataTdMap_WholeDay[ i ] = new Element( "td" , {
  571. // "valign" : "top",
  572. // "styles" : {"height":"0px"}, //,"position":"relative"},
  573. // "index" : i
  574. // }).inject( tr );
  575. //}
  576. },
  577. loadWholeday : function( data ){
  578. this.wholeday = new MWFCalendarWeekView.Calendar.WholeDay( this, data, this.date);
  579. },
  580. loadDataTable: function( json ){
  581. this.dataTable = new Element("table.dataTable", {
  582. "styles": this.css.calendarTable,
  583. "height": "0",
  584. "border": "0",
  585. "cellPadding": "0",
  586. "cellSpacing": "0"
  587. }).inject(this.bodyNode);
  588. this.dataTable.setStyles({
  589. "position":"absolute",
  590. "top" : "0px",
  591. "left" : "0px"
  592. });
  593. var tr = new Element("tr").inject(this.dataTable);
  594. new Element( "td" , {
  595. "styles" : {"height":"0px","position":"relative"}
  596. }).inject( tr );
  597. this.dataTdMap = {};
  598. for( var i=0 ;i <7; i++ ){
  599. this.dataTdMap[ i ] = new Element( "td" , {
  600. "styles" : {"height":"0px","position":"relative"},
  601. "index" : i
  602. }).inject( tr );
  603. }
  604. },
  605. getDateIndexMap : function(){
  606. if( !this.dateIndexMap ){
  607. var date = this.getWeekStartTime( this.baseDate );
  608. this.dateIndexMap = {};
  609. for( var i=0 ;i <7; i++ ){
  610. var dateStr = date.format("%Y-%m-%d");
  611. this.dateIndexMap[ dateStr ] = i;
  612. date.increment();
  613. }
  614. }
  615. return this.dateIndexMap;
  616. },
  617. getDateByIndex : function( index ){
  618. var dateStr;
  619. var dateIndexMap = this.getDateIndexMap();
  620. for( var key in dateIndexMap ){
  621. if( dateIndexMap[key] == index ){
  622. return key;
  623. }
  624. }
  625. },
  626. getDateNumOfWeek : function( dateString ){
  627. var dateIndexMap = this.getDateIndexMap();
  628. return this.dateIndexMap[ dateString ]
  629. },
  630. loadDataDay : function(data){
  631. this.dayMap = {};
  632. data.each( function(d){
  633. var key = d.eventDate;
  634. var container = this.dataTdMap[ this.getDateNumOfWeek( key ) ];
  635. if(container){
  636. this.loadDay(container, key, d.inOneDayEvents );
  637. }
  638. }.bind(this));
  639. //var dataMap = {};
  640. //data.each( function( d ){
  641. // var date2 = Date.parse( d.startTime );
  642. // var dateStr = date2.format("%Y-%m-%d");
  643. // if( !dataMap[dateStr] )dataMap[dateStr] = [];
  644. // dataMap[dateStr].push( d )
  645. //}.bind(this));
  646. //
  647. //for( var key in dataMap ){
  648. // var container = this.dataTdMap[ this.getDateNumOfWeek( key ) ];
  649. // if(container){
  650. // this.loadDay(container, key, dataMap[key]);
  651. // }
  652. //}
  653. },
  654. loadDay: function( container, dateStr, array){
  655. var date = Date.parse(dateStr);
  656. var m = date.get("month");
  657. var y = date.get("year");
  658. var d = date.get("date");
  659. var startTime = new Date( y, m, d, 0, 0, 0 );
  660. var endTime = new Date( y, m, d, 23, 59, 59 );
  661. //if(dayArray.length>0){
  662. this.dayMap[dateStr] = new MWFCalendarWeekView.Calendar.Day( container, date, this, array);
  663. //}
  664. //if(wholeDayArray.length>0){
  665. // this.wholedayMap[dateStr] = new MWFCalendarWeekView.Calendar.WholeDay( container, date, this, type, wholeDayArray);
  666. //}
  667. },
  668. resetBodySize: function(){
  669. //if( this.app.inContainer )return;
  670. var size = this.container.getSize();
  671. var titleSize = this.titleNode.getSize();
  672. var titleTableSize = this.titleTable.getSize();
  673. var y = size.y-titleSize.y-titleTableSize.y;
  674. //this.bodyNode.setStyle("height", ""+y+"px");
  675. if (this.contentWarpNode){
  676. this.contentWarpNode.setStyles({
  677. "width": (size.x - 40) +"px"
  678. });
  679. }
  680. this.scrollNode.setStyle("height", ""+y+"px");
  681. var hourTdX = 60;
  682. MWFCalendarWeekView.WeekWidth = size.x - 40 - hourTdX;
  683. var tdX = MWFCalendarWeekView.DayWidth = Math.floor( (MWFCalendarWeekView.WeekWidth-8) / 7);
  684. if(this.calendarTable){
  685. this.calendarTable.setStyles({
  686. "width": (size.x - 40) +"px"
  687. });
  688. var tr =this.calendarTable.getElement("tr:nth-child(1)");
  689. tr.getElements("td").each( function( td, i ){
  690. td.setStyle("width", (i==0 ? hourTdX : tdX )+"px");
  691. })
  692. }
  693. if(this.titleTable){
  694. this.titleTable.setStyles({
  695. "width": (size.x - 40) +"px"
  696. });
  697. var tr =this.titleTable.getElement("tr:nth-child(1)");
  698. tr.getElements("th").each( function( td, i ){
  699. td.setStyle("width", (i==0 ? hourTdX : tdX )+"px");
  700. })
  701. }
  702. if( this.dataTable ){
  703. this.dataTable.setStyles({
  704. "width": (size.x - 40) +"px"
  705. });
  706. var tr =this.dataTable.getElement("tr:nth-child(1)");
  707. tr.getElements("td").each( function( td, i ){
  708. td.setStyle("width", (i==0 ? hourTdX : tdX )+"px");
  709. })
  710. }
  711. for( var key in this.dayMap ){
  712. this.dayMap[key].resize();
  713. }
  714. if( this.dataTable_WholeDay ){
  715. this.dataTable_WholeDay.setStyles({
  716. "width": (size.x - 40) +"px"
  717. });
  718. var tr =this.dataTable_WholeDay.getElement("tr:nth-child(1)");
  719. var contendTdWidth = size.x - 40 - hourTdX - 2;
  720. tr.getElements("td").each( function( td, i ){
  721. td.setStyle("width", (i==0 ? hourTdX : contendTdWidth )+"px");
  722. })
  723. }
  724. if(this.wholeday)this.wholeday.resize();
  725. if(this.nowTimeNode){
  726. this.nowTimeNode.setStyle("width",tdX);
  727. if(this.nowTd)this.nowTimeNode.setStyle("left", this.nowTd.getPosition(this.bodyNode).x );
  728. }
  729. //for( var key in this.dayMap_WholeDay ){
  730. // this.dayMap_WholeDay[key].resize();
  731. //}
  732. },
  733. reload : function(){
  734. this.view.reload();
  735. },
  736. destroy: function(){
  737. Object.each(this.dayMap || {}, function(day){
  738. day.destroy();
  739. }.bind(this));
  740. if( this.wholeday ){
  741. this.wholeday.destroy();
  742. }
  743. this.container.empty();
  744. },
  745. getIndexByPage: function( page ){
  746. var pos = this.calendarTable.getPosition();
  747. if( !this.calendarTableFirstTd ){
  748. this.calendarTableFirstTd = this.calendarTable.getElement("td");
  749. }
  750. pos.x = pos.x + this.calendarTableFirstTd.getSize().x;
  751. var col = (page.x - pos.x ) / (MWFCalendarWeekView.DayWidth + 1);
  752. if( col < 0 || col > 7 )return null;
  753. this.pageOffsetHeight = page.y - pos.y;
  754. var row = ( page.y - pos.y ) / MWFCalendarWeekView.HourHeight;
  755. if( row < 0 || row > 24 )return null;
  756. return {
  757. row : Math.floor(row),
  758. col : Math.floor(col)
  759. }
  760. },
  761. getIndexListByRange : function( index1, index2 ){
  762. var minIndex, maxIndex;
  763. if( index1.col == index2.col ){
  764. if( index1.row <= index2.row ){
  765. minIndex = index1;
  766. maxIndex = index2;
  767. }else{
  768. minIndex = index2;
  769. maxIndex = index1;
  770. }
  771. }else if( index1.col < index2.col ){
  772. minIndex = index1;
  773. maxIndex = index2;
  774. }else{
  775. minIndex = index2;
  776. maxIndex = index1;
  777. }
  778. var beginRow, endRow;
  779. var result = [];
  780. for( var i = minIndex.col; i<=maxIndex.col; i++ ){
  781. beginRow = i == minIndex.col ? minIndex.row : 0;
  782. endRow = i == maxIndex.col ? maxIndex.row : 23;
  783. for( var j = beginRow; j<= endRow; j++ ){
  784. result.push( i+"_"+j );
  785. }
  786. }
  787. return result;
  788. },
  789. getTdByIndexString : function(index){
  790. var indexList = index.split("_");
  791. var col = indexList[0];
  792. var row = indexList[1];
  793. return this.hourTdMap[col][row];
  794. },
  795. cellDragStart: function(td, e){
  796. td.store("index", this.getIndexByPage(e.page ) );
  797. this.scrollNodeHeight = this.scrollNode.getSize().y;
  798. },
  799. cellDrag: function(td, e){
  800. var orgIndex = td.retrieve( "index" );
  801. var curIndex = this.getIndexByPage( e.page );
  802. if( !curIndex )return;
  803. var indexs = this.getIndexListByRange( orgIndex, curIndex );
  804. var flag = this.todayIndex > -1;
  805. if( this.selectedIndexRange ){
  806. var oldIndex = this.selectedIndexRange;
  807. this.selectedIndexRange.each( function( index ){
  808. if( !indexs.contains(index) ){
  809. this.getTdByIndexString( index ).setStyle("background-color", flag && ( index.split("_")[0] ==this.todayIndex ) ? "#F8FBFF" : "#fff");
  810. }
  811. }.bind(this));
  812. indexs.each( function( index ){
  813. if( !this.selectedIndexRange.contains(index) ){
  814. this.getTdByIndexString( index ).setStyle("background-color", "#fffdf2")
  815. }
  816. }.bind(this))
  817. }else{
  818. for( var i=0; i<indexs.length; i++ ){
  819. this.getTdByIndexString( indexs[i] ).setStyle("background-color", "#fffdf2")
  820. }
  821. }
  822. this.selectedIndexRange = indexs;
  823. var scrollNodeTop = this.scrollNode.getScroll().y;
  824. if(( this.pageOffsetHeight + MWFCalendarWeekView.HourHeight * 1.5) > ( this.scrollNodeHeight + scrollNodeTop )){
  825. window.setTimeout( function(){
  826. this.scrollNode.scrollTo(0, scrollNodeTop + MWFCalendarWeekView.HourHeight )
  827. }.bind(this), 200)
  828. }else if( this.pageOffsetHeight - MWFCalendarWeekView.HourHeight * 1.5 < scrollNodeTop ){
  829. window.setTimeout( function(){
  830. this.scrollNode.scrollTo(0, scrollNodeTop - MWFCalendarWeekView.HourHeight )
  831. }.bind(this), 200)
  832. }
  833. },
  834. completeDrag: function(td, e){
  835. var flag = this.todayIndex > -1;
  836. if( this.selectedIndexRange && this.selectedIndexRange.length ){
  837. this.selectedIndexRange.each( function( index ){
  838. this.getTdByIndexString( index ).setStyle("background-color", flag && ( index.split("_")[0] ==this.todayIndex ) ? "#F8FBFF" : "#fff");
  839. }.bind(this));
  840. var beginIndex = this.selectedIndexRange[0].split("_");
  841. var endIndex = this.selectedIndexRange.getLast().split("_");
  842. var beginTime = this.getDateByIndex( beginIndex[0] ) + " " + beginIndex[1]+":00";
  843. var endTime = this.getDateByIndex( endIndex[0] ) + " " + endIndex[1]+":59";
  844. var form = new MWF.xApplication.Calendar.EventForm(this,{}, {
  845. startTime : beginTime ,
  846. endTime : endTime
  847. }, {app:this.app});
  848. form.view = this;
  849. form.create();
  850. this.selectedIndexRange = null;
  851. }
  852. },
  853. getIndexByPage_wholeDay: function( page ){
  854. var pos = this.wholeDayTr.getPosition();
  855. if( !this.wholeDayFirstTd ){
  856. this.wholeDayFirstTd = this.wholeDayTr.getElement("td");
  857. }
  858. pos.x = pos.x + this.wholeDayFirstTd.getSize().x;
  859. var col = (page.x - pos.x ) / (MWFCalendarWeekView.DayWidth + 1);
  860. if( col < 0 || col > 7 )return null;
  861. return Math.floor(col);
  862. },
  863. getIndexListByRange_wholeDay : function( index1, index2 ){
  864. var minIndex = Math.min( index1, index2 );
  865. var maxIndex = Math.max( index1, index2 );
  866. var result = [];
  867. for( var i = minIndex; i<=maxIndex; i++ ){
  868. result.push( i );
  869. }
  870. return result;
  871. },
  872. cellDragStart_wholeDay: function(td, e){
  873. td.store("index", this.getIndexByPage_wholeDay(e.page ) );
  874. },
  875. cellDrag_wholeDay: function(td, e){
  876. var orgIndex = td.retrieve( "index" );
  877. var curIndex = this.getIndexByPage_wholeDay( e.page );
  878. if( !curIndex )return;
  879. var indexs = this.getIndexListByRange_wholeDay( orgIndex, curIndex );
  880. var flag = this.todayIndex > -1;
  881. if( this.selectedIndexRange_wholeDay ){
  882. var oldIndex = this.selectedIndexRange_wholeDay;
  883. this.selectedIndexRange_wholeDay.each( function( index ){
  884. if( !indexs.contains(index) ){
  885. this.wholeDayTdMap[index].setStyle("background-color", flag && ( index == this.todayIndex ) ? "#F8FBFF" : "#fff");
  886. }
  887. }.bind(this));
  888. indexs.each( function( index ){
  889. if( !this.selectedIndexRange_wholeDay.contains(index) ){
  890. this.wholeDayTdMap[index].setStyle("background-color", "#fffdf2")
  891. }
  892. }.bind(this))
  893. }else{
  894. for( var i=0; i<indexs.length; i++ ){
  895. this.wholeDayTdMap[indexs[i]].setStyle("background-color", "#fffdf2")
  896. }
  897. }
  898. this.selectedIndexRange_wholeDay = indexs;
  899. },
  900. completeDrag_wholeDay: function(td, e){
  901. var flag = this.todayIndex > -1;
  902. if( this.selectedIndexRange_wholeDay && this.selectedIndexRange_wholeDay.length ){
  903. this.selectedIndexRange_wholeDay.each( function( index ){
  904. this.wholeDayTdMap[index].setStyle("background-color", flag && ( index == this.todayIndex ) ? "#F8FBFF" : "#fff");
  905. }.bind(this));
  906. var beginIndex = this.selectedIndexRange_wholeDay[0];
  907. var endIndex = this.selectedIndexRange_wholeDay.getLast();
  908. var beginTime = this.getDateByIndex( beginIndex );
  909. var endTime = this.getDateByIndex( endIndex );
  910. var form = new MWF.xApplication.Calendar.EventForm(this,{}, {
  911. startTime : beginTime ,
  912. endTime : endTime,
  913. isWholeday : true
  914. }, {app:this.app});
  915. form.view = this;
  916. form.create();
  917. this.selectedIndexRange_wholeDay = null;
  918. }
  919. }
  920. });
  921. MWFCalendarWeekView.Calendar.WholeDay = new Class({
  922. Implements: [Events],
  923. initialize: function( calendar, data, date){
  924. this.calendar = calendar;
  925. this.view = this.calendar.view;
  926. this.css = this.calendar.css;
  927. this.app = this.calendar.app;
  928. this.date = date.clone();
  929. this.data = data;
  930. this.load();
  931. },
  932. load: function(){
  933. //var start = this.calendar.getWeekStartTime( this.date );
  934. //this.weekStartTime = new Date( start.get("year"), start.get("month"), start.get("date"), 0, 0, 0 );
  935. //
  936. //var end = start.clone().increment( "day", 6 );
  937. //this.weekEndTime = new Date( end.get("year"), end.get("month"), end.get("date"), 23, 59, 59 );
  938. this.weekStartTime = this.calendar.weekStartTime;
  939. this.weekEndTime = this.calendar.weekEndTime;
  940. this.rangeList = [];
  941. this.rangeObject = {};
  942. this.data.each( function(d , i){
  943. var range = this.getTimeRange( d.startTime, d.endTime );
  944. if( !range )return null;
  945. d.range = range;
  946. d.range.id = d.id;
  947. d.range.data = d;
  948. this.rangeList.push( range );
  949. this.rangeObject[d.id] = range;
  950. }.bind(this));
  951. var itemCountOfDay = {};
  952. this.rangeList.each( function(r){
  953. r.days.each( function( d ){
  954. itemCountOfDay[ d ] = itemCountOfDay[ d ] ? itemCountOfDay[ d ]+1 : 1
  955. }.bind(this))
  956. }.bind(this));
  957. this.maxDayLength = 0;
  958. for(var key in itemCountOfDay){
  959. if( itemCountOfDay[key] > this.maxDayLength )this.maxDayLength = itemCountOfDay[key];
  960. }
  961. if( this.maxDayLength ){
  962. this.calendar.titleTable.getElement("td:nth-child(1)").setStyle("height", 24*this.maxDayLength);
  963. }
  964. this.usefulTdFlagArray = [];
  965. for( var i=0; i<this.maxDayLength; i++ ){
  966. var array = [];
  967. for( var j=0; j<7; j++ ){
  968. array.push( true );
  969. }
  970. this.usefulTdFlagArray.push( array )
  971. }
  972. this.sortRange();
  973. //this.getIntersectedPath2();
  974. this.documentList = [];
  975. this.rangeList.each( function(r , i){
  976. var d = r.data;
  977. if( !d )return null;
  978. this.documentList.push( new MWFCalendarWeekView.Calendar.WholeDayDocument( this, d, r ) );
  979. }.bind(this))
  980. },
  981. sortRange : function(){
  982. this.rangeList.sort( function( range1, range2 ){
  983. if( range1.days[0] > range2.days[0] )return 1;
  984. if( range1.days[0] < range2.days[0] )return -1;
  985. return range2.diff - range1.diff;
  986. }.bind(this));
  987. },
  988. getTimeRange : function( startTime, endTime ){
  989. var start = Date.parse(startTime );
  990. var end = Date.parse(endTime );
  991. if( end < this.weekStartTime || start > this.weekEndDate )return null;
  992. if( start < this.weekStartTime )start = this.weekStartTime.clone();
  993. if( this.weekEndTime < end )end = this.weekEndTime.clone();
  994. var end = new Date( end.get("year"), end.get("month"), end.get("date"), 23, 59, 59 );
  995. var days = [];
  996. while( start < end ){
  997. days.push( start.clone().format("%Y-%m-%d") );
  998. start.increment()
  999. }
  1000. start = Date.parse(startTime );
  1001. end = Date.parse(endTime );
  1002. return {
  1003. start : start,
  1004. end : end,
  1005. days : days,
  1006. diff : end - start
  1007. }
  1008. },
  1009. resize: function(){
  1010. if(!this.documentList)return;
  1011. this.documentList.each( function(d){
  1012. d.resize();
  1013. }.bind(this))
  1014. },
  1015. destroy : function(){
  1016. if(!this.documentList)return;
  1017. while( this.documentList.length ){
  1018. this.documentList.pop().destroy()
  1019. }
  1020. this.calendar.dataTd_WholeDay.empty();
  1021. }
  1022. });
  1023. MWFCalendarWeekView.Calendar.WholeDayDocument = new Class({
  1024. initialize: function(day, data, range ){
  1025. this.day = day;
  1026. this.calendar = day.calendar;
  1027. this.view = this.calendar.view;
  1028. this.css = this.calendar.css;
  1029. this.app = this.calendar.app;
  1030. this.date = day.date.clone();
  1031. this.data = data;
  1032. this.range = range;
  1033. this.load();
  1034. },
  1035. load: function(){
  1036. this.container = this.calendar.dataTd_WholeDay;
  1037. var items = this.items = [];
  1038. this.data.timeStart = Date.parse( this.data.startTime );
  1039. this.data.timeEnd = Date.parse( this.data.endTime );
  1040. this.getUsefulTdYIndex();
  1041. this.createNode();
  1042. //this.range.days.each( function( d, i ){
  1043. // items.push( new MWFCalendarWeekView.Calendar.WholeDayItem( this, d, i ) )
  1044. //}.bind(this))
  1045. },
  1046. getUsefulTdYIndex : function(){
  1047. for( var i=0; i<this.day.maxDayLength; i++ ){
  1048. var flag = true;
  1049. for( var j=0; j<this.range.days.length; j++ ){
  1050. var idx = this.calendar.getDateNumOfWeek( this.range.days[j] );
  1051. if( !this.day.usefulTdFlagArray[i][idx] ){
  1052. flag = false;
  1053. break;
  1054. }
  1055. }
  1056. if( flag ){
  1057. this.yIndex = i;
  1058. for( var j=0; j<this.range.days.length; j++ ){
  1059. var idx = this.calendar.getDateNumOfWeek( this.range.days[j] );
  1060. this.day.usefulTdFlagArray[i][idx] = false;
  1061. }
  1062. break;
  1063. }
  1064. }
  1065. },
  1066. createNode : function(){
  1067. var lightColor = this.lightColor = MWFCalendar.ColorOptions.getLightColor( this.data.color );
  1068. var node = this.node = new Element("div",{
  1069. styles : {
  1070. position : "absolute",
  1071. //border : "1px solid #cae2ff",
  1072. "background-color" : "#cae2ff",
  1073. "overflow" : "hidden",
  1074. "height" : "20px",
  1075. "line-height" : "20px",
  1076. "border-top" : "1px solid " + lightColor,
  1077. "border-bottom" : "1px solid " + lightColor
  1078. },
  1079. events : {
  1080. click : function(){
  1081. var form = new MWF.xApplication.Calendar.EventForm(this, this.data, {
  1082. isFull : true
  1083. }, {app:this.app});
  1084. form.view = this.view;
  1085. form.edit();
  1086. }.bind(this),
  1087. "mouseover" : function () {
  1088. this.node.setStyle("border-color", this.data.color );
  1089. }.bind(this),
  1090. "mouseout" : function () {
  1091. this.node.setStyle("border-color", this.lightColor );
  1092. }.bind(this)
  1093. }
  1094. }).inject( this.container );
  1095. node.setStyles(this.getCoordinate());
  1096. if( !this.startTimeOutRange ){
  1097. node.setStyles({
  1098. "border-left" : "1px solid " + lightColor,
  1099. "border-top-left-radius" : "10px",
  1100. "border-bottom-left-radius" : "10px"
  1101. })
  1102. }
  1103. if( !this.endTimeOutRange ){
  1104. node.setStyles({
  1105. "border-right" : "1px solid " + lightColor,
  1106. "border-top-right-radius" : "10px",
  1107. "border-bottom-right-radius" : "10px"
  1108. })
  1109. }
  1110. //if( this.isFirst ){
  1111. var timeNode = new Element("div",{
  1112. styles : {
  1113. "font-size" : "10px",
  1114. "padding-left" : "2px",
  1115. "float" : "left"
  1116. },
  1117. text : this.data.timeStart.format("%m-%d %H:%M") + "至" + this.data.timeEnd.format("%m-%d %H:%M")
  1118. }).inject( node );
  1119. var titleNode = new Element("div",{
  1120. styles : {
  1121. "padding-left" : "5px",
  1122. "font-size" : "12px",
  1123. "float" : "left"
  1124. },
  1125. text : this.data.title
  1126. }).inject( node );
  1127. //}
  1128. this.tooltip = new MWF.xApplication.Calendar.EventTooltip(this.app.content, this.node, this.app, this.data, {
  1129. axis : "y", "delay" : 350
  1130. });
  1131. },
  1132. getCoordinate : function(){
  1133. var data = this.data;
  1134. var range = this.range;
  1135. var top = this.yIndex * 24;
  1136. var timeStart = this.day.weekStartTime;
  1137. var timeEnd = this.day.weekEndTime;
  1138. if( this.data.timeStart < timeStart ){
  1139. this.startTimeOutRange = true;
  1140. }else{
  1141. this.startTimeOutRange = false;
  1142. timeStart = this.data.timeStart;
  1143. }
  1144. if( this.data.timeEnd > timeEnd ){
  1145. this.endTimeOutRange = true;
  1146. }else{
  1147. this.endTimeOutRange = false;
  1148. timeEnd = this.data.timeEnd;
  1149. }
  1150. var diff = timeEnd - timeStart;
  1151. var width = ( diff / MWFCalendarWeekView.WeekMsec ) * MWFCalendarWeekView.WeekWidth - 2;
  1152. var left = ( ( timeStart - this.day.weekStartTime ) / MWFCalendarWeekView.WeekMsec ) * MWFCalendarWeekView.WeekWidth + 3;
  1153. //var marginRight = ( ( this.weekTimeEnd - timeEnd ) / MWFCalendarWeekView.DayMsec) * MWFCalendarWeekView.DayWidth;
  1154. return {
  1155. top : top + 2,
  1156. left : left,
  1157. width : width // + ( !this.isLast ? 2 : -2 ) //,
  1158. //"margin-left" : marginLeft,
  1159. //"margin-right" : marginRight
  1160. }
  1161. },
  1162. resize : function(){
  1163. this.node.setStyles(this.getCoordinate());
  1164. },
  1165. reload: function(){
  1166. if( this.tooltip )this.tooltip.destroy();
  1167. this.view.reload();
  1168. },
  1169. destroy : function(){
  1170. if( this.tooltip )this.tooltip.destroy();
  1171. this.node.destroy();
  1172. }
  1173. });
  1174. MWFCalendarWeekView.Calendar.Day = new Class({
  1175. Implements: [Events],
  1176. initialize: function(container, date, calendar, data){
  1177. this.container = container;
  1178. this.calendar = calendar;
  1179. this.view = this.calendar.view;
  1180. this.css = this.calendar.css;
  1181. this.app = this.calendar.app;
  1182. this.date = date.clone();
  1183. this.data = data;
  1184. this.calendars = [];
  1185. this.load();
  1186. },
  1187. load: function(){
  1188. this.day = this.date.getDate();
  1189. this.month = this.date.getMonth();
  1190. this.year = this.date.getFullYear();
  1191. this.startTime = new Date( this.year, this.month, this.day, 0, 0, 0 );
  1192. this.endTime = new Date( this.year, this.month, this.day, 23, 59, 59 );
  1193. this.rangeList = [];
  1194. this.rangeObject = {};
  1195. this.data.each( function(d , i){
  1196. var range = this.getTimeRange( d.startTime, d.endTime );
  1197. if( !range )return null;
  1198. d.range = range;
  1199. d.range.id = d.id;
  1200. this.rangeList.push( range );
  1201. this.rangeObject[d.id] = range;
  1202. }.bind(this));
  1203. this.sortRange();
  1204. var length = this.data.length;
  1205. this.documentList = [];
  1206. this.data.each( function(d , i){
  1207. var range = d.range;
  1208. range.dayRangeCount = length;
  1209. range.index = this.rangeList.indexOf( range );
  1210. if( !range )return null;
  1211. //var coordinate = this.getCoordinate( d, range );
  1212. this.documentList.push( new MWFCalendarWeekView.Calendar.Document(this.container, this, d, range ) );
  1213. }.bind(this))
  1214. },
  1215. sortRange : function(){
  1216. this.rangeList.sort( function(range1, range2){
  1217. return range1.startTime - range2.startTime;
  1218. });
  1219. },
  1220. getTimeRange: function( bDate1, eDate1 ){
  1221. var bDate = typeOf(bDate1) == "string" ? Date.parse(bDate1) : bDate1;
  1222. var eDate = typeOf(eDate1) == "string" ? Date.parse(eDate1) : eDate1;
  1223. if( eDate <= this.startTime ){ //比当天天12点更晚
  1224. return null;
  1225. }
  1226. if( this.endTime <= bDate ){
  1227. return null;
  1228. }
  1229. var range = {
  1230. start: ( bDate <= this.startTime ) ? [0, 0, 0] : [bDate.get("hr"), bDate.get("min"), bDate.get("sec")],
  1231. end: ( this.endTime <= eDate ) ? [23, 59, 59] : [eDate.get("hr"), eDate.get("min"), eDate.get("sec")]
  1232. };
  1233. range.startTime = new Date( this.year, this.month, this.day, range.start[0], range.start[1], range.start[2] );
  1234. range.endTime = new Date( this.year, this.month, this.day, range.end[0], range.end[1], range.end[2] );
  1235. range.diff = range.endTime - range.startTime;
  1236. return range;
  1237. },
  1238. resize : function(){
  1239. if(!this.documentList)return;
  1240. this.documentList.each( function( doc ){
  1241. doc.resize();
  1242. }.bind(this))
  1243. },
  1244. reload: function(){
  1245. this.view.reload();
  1246. },
  1247. destroy : function(){
  1248. while( this.documentList.length > 0 ){
  1249. this.documentList.pop().destroy();
  1250. }
  1251. this.container.empty();
  1252. }
  1253. });
  1254. MWFCalendarWeekView.Calendar.Document = new Class({
  1255. initialize: function(container, day, data, range, coordinate ){
  1256. this.container = container;
  1257. this.day = day;
  1258. this.calendar = day.calendar;
  1259. this.view = this.calendar.view;
  1260. this.css = this.calendar.css;
  1261. this.app = this.calendar.app;
  1262. this.date = day.date.clone();
  1263. this.data = data;
  1264. this.range = range;
  1265. this.coordinate = coordinate; //today, otherMonth, thisMonth
  1266. this.load();
  1267. },
  1268. load: function(){
  1269. var lightColor = this.lightColor = MWFCalendar.ColorOptions.getLightColor( this.data.color );
  1270. var node = this.node = new Element("div",{
  1271. styles : {
  1272. position : "absolute",
  1273. border : "1px solid "+lightColor,
  1274. "background-color" : lightColor,
  1275. "overflow" : "hidden",
  1276. "border-radius" : "5px"
  1277. },
  1278. events : {
  1279. click : function(){
  1280. var form = new MWF.xApplication.Calendar.EventForm(this, this.data, {
  1281. isFull : true
  1282. }, {app:this.app});
  1283. form.view = this.view;
  1284. form.edit();
  1285. }.bind(this),
  1286. "mouseover" : function () {
  1287. this.node.setStyle("border-color", this.data.color );
  1288. }.bind(this),
  1289. "mouseout" : function () {
  1290. this.node.setStyle("border-color", this.lightColor );
  1291. }.bind(this)
  1292. }
  1293. }).inject( this.container );
  1294. node.setStyles(this.getCoordinate());
  1295. var timeNode = new Element("div",{
  1296. styles : {
  1297. "font-size" : "10px",
  1298. "padding-top" : "2px",
  1299. "padding-left" : "2px"
  1300. },
  1301. text : this.range.startTime.format("%H:%M") + "-" + this.range.endTime.format("%H:%M")
  1302. }).inject( node );
  1303. var titleNode = new Element("div",{
  1304. styles : {
  1305. "padding-top" : "10px",
  1306. "padding-left" : "5px",
  1307. "font-size" : "12px"
  1308. },
  1309. text : this.data.title
  1310. }).inject( node );
  1311. this.tooltip = new MWF.xApplication.Calendar.EventTooltip(this.app.content, this.node, this.app, this.data, {
  1312. axis : "x", "delay" : 350
  1313. });
  1314. },
  1315. resize : function(){
  1316. this.node.setStyles(this.getCoordinate());
  1317. },
  1318. getCoordinate : function(){
  1319. var data = this.data;
  1320. var range = this.range;
  1321. var width_div = 8;
  1322. var top_div = 0;
  1323. if(Browser.name === "ie" ){
  1324. width_div = 4;
  1325. top_div = -2
  1326. }
  1327. var height = Math.floor( ( ( range.endTime - range.startTime ) / MWFCalendarWeekView.DayMsec ) * MWFCalendarWeekView.DayHeight)-width_div;
  1328. if(height < 16) height = 16;
  1329. var top = Math.floor( ( ( range.startTime - this.day.startTime ) / MWFCalendarWeekView.DayMsec ) * MWFCalendarWeekView.DayHeight)-top_div;
  1330. //var width = Math.floor( MWFCalendarWeekView.DayWidth / length )-2;
  1331. //var left = ( width + 2)* index + 1;
  1332. //var width = Math.floor( MWFCalendarWeekView.DayWidth / range.path.length )-5;
  1333. //var left = ( width + 5)* range.path.indexOf( data.id ) + 3;
  1334. var width = Math.floor( MWFCalendarWeekView.DayWidth / this.range.dayRangeCount )-5;
  1335. var left = ( width + 5)* this.range.index + 3;
  1336. return {
  1337. top : top,
  1338. left : left,
  1339. width : width,
  1340. height : height
  1341. }
  1342. },
  1343. reload: function(){
  1344. if( this.tooltip )this.tooltip.destroy();
  1345. this.view.reload();
  1346. },
  1347. destroy: function(){
  1348. if( this.tooltip )this.tooltip.destroy();
  1349. this.node.destroy()
  1350. }
  1351. });
  1352. MWFCalendarWeekView.WeekCalendar = new Class({
  1353. Extends : MWF.widget.Calendar,
  1354. initialize: function(node, options){
  1355. this.options.weekBegin = "0";
  1356. Locale.use("zh-CHS");
  1357. this.options.defaultTime = ""+this.options.baseDate.getHours()+":"+this.options.baseDate.getMinutes()+":"+this.options.baseDate.getSeconds();
  1358. this.setOptions(options);
  1359. this.path = MWF.defaultPath+"/widget/$Calendar/";
  1360. this.cssPath = MWF.defaultPath+"/widget/$Calendar/"+this.options.style+"/css.wcss";
  1361. this._loadCss();
  1362. // this.options.containerPath = this.path+this.style+"/container.html";
  1363. // this.options.dayPath = this.path+this.style+"/day.html";
  1364. // this.options.monthPath = this.path+this.style+"/month.html";
  1365. // this.options.yearPath = this.path+this.style+"/year.html";
  1366. // this.options.timePath = this.path+this.style+"/time.html";
  1367. if (!this.options.format){
  1368. if (this.options.isTime){
  1369. //this.options.format = Locale.get("Date").shortDate + " " + Locale.get("Date").shortTime;
  1370. if(this.options.timeOnly){
  1371. this.options.format="%H:%M";
  1372. }
  1373. else{
  1374. this.options.format = Locale.get("Date").shortDate + " " + "%H:%M";
  1375. }
  1376. }else{
  1377. this.options.format = Locale.get("Date").shortDate;
  1378. }
  1379. }
  1380. this.options.containerPath = this.options.path+this.options.style+"/container.html";
  1381. this.options.dayPath = this.options.path+this.options.style+"/day_week.html";
  1382. this.options.monthPath = this.options.path+this.options.style+"/month.html";
  1383. this.options.yearPath = this.options.path+this.options.style+"/year.html";
  1384. this.options.timePath = this.options.path+this.options.style+"/time.html";
  1385. this.today = new Date();
  1386. this.currentView = this.options.defaultView;
  1387. this.node = $(node);
  1388. this.visible = false;
  1389. this.container = this.createContainer();
  1390. this.container.inject((this.options.target) || $(document.body));
  1391. this.contentTable = this.createContentTable();
  1392. this.contentTable.inject(this.contentDateNode);
  1393. this.addEvents();
  1394. this.container.set({
  1395. styles: {
  1396. "display": "none",
  1397. "opacity": 1
  1398. }
  1399. });
  1400. this.fireEvent("init");
  1401. //this.move = true;
  1402. //this.containerDrag = new Drag.Move(this.container);
  1403. },
  1404. showDay: function(year, month){
  1405. this._setDayTitle(null, year, month);
  1406. this._setDayWeekTitleTh();
  1407. this._setDayDate(null, year, month);
  1408. // if (!this.move){
  1409. // this.move = true;
  1410. // this.containerDrag = new Drag.Move(this.container);
  1411. // }
  1412. },
  1413. _setDayTitle: function(node, year, month){
  1414. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  1415. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  1416. thisMonth++;
  1417. var text = thisYear+"年"+thisMonth+"月";
  1418. var thisNode = node || this.currentTextNode;
  1419. thisNode.set("text", text);
  1420. thisNode.store("year", thisYear);
  1421. thisNode.store("month", thisMonth);
  1422. },
  1423. _setDayWeekTitleTh: function(table){
  1424. var dayTable = table || this.contentTable;
  1425. var thead = dayTable.getElement("thead");
  1426. var cells = thead.getElements("th");
  1427. if (this.css.calendarDaysContentTh) cells.setStyles(this.css.calendarDaysContentTh);
  1428. //var days_abbr = Locale.get("Date").days_abbr;
  1429. var days_abbr = MWF.LP.widget.days_abbr;
  1430. cells.each(function(item, idx){
  1431. if( idx == 0 ){
  1432. item.set("text", "周");
  1433. }else{
  1434. //var index;
  1435. //if( this.options.weekBegin == "0" ){
  1436. // index = idx-1;
  1437. //}else{
  1438. // index = idx == 7 ? 0 : idx;
  1439. //}
  1440. var index = ( idx - 1 + parseInt( this.options.weekBegin ) ) % 7;
  1441. item.set("text", days_abbr[index]);
  1442. }
  1443. }.bind(this));
  1444. return cells;
  1445. },
  1446. _setDayDate: function(table, year, month){
  1447. var dayTable = table || this.contentTable;
  1448. var baseDate = this.options.baseDate;
  1449. if ((year!=undefined) && (month!=undefined)){
  1450. baseDate = new Date();
  1451. baseDate.setDate(1);
  1452. baseDate.setFullYear(year);
  1453. baseDate.setMonth(month);
  1454. }
  1455. var tbody = dayTable.getElement("tbody");
  1456. var tds = tbody.getElements("td");
  1457. var firstDate = baseDate.clone();
  1458. firstDate.setDate(1);
  1459. //if( this.options.weekBegin == "0" ){
  1460. // var day = firstDate.getDay()+1;
  1461. //}else{
  1462. //
  1463. //}
  1464. var day = ( 7 + firstDate.getDay() - parseInt( this.options.weekBegin ) ) % 7 + 1;
  1465. var tmpDate = firstDate.clone();
  1466. for (var i=day-1; i>=0; i--){
  1467. if( i % 8 == 0 ){ //设置周数
  1468. var week = this.getWeekNumber( tmpDate );
  1469. tds[i].set("text", week);
  1470. tds[i].setStyles(this.css.week);
  1471. tds[i].store("weekValue", week.toString());
  1472. tds[i].store("dateValue", tmpDate.toString());
  1473. i--;
  1474. if( i<0 )break;
  1475. }
  1476. tmpDate.increment("day", -1);
  1477. tds[i].set("text", tmpDate.getDate());
  1478. tds[i].addClass("gray_"+this.options.style);
  1479. tds[i].setStyles(this.css["gray_"+this.options.style]);
  1480. tds[i].store("dateValue", tmpDate.toString())
  1481. }
  1482. for (var i=day; i<tds.length; i++){
  1483. if( i % 8 == 0 ){ //设置周数
  1484. var week = this.getWeekNumber( firstDate );
  1485. tds[i].set("text", week );
  1486. //tds[i].addClass("gray_"+this.options.style);
  1487. tds[i].setStyles(this.css.week);
  1488. tds[i].store("weekValue", week.toString());
  1489. tds[i].store("dateValue", firstDate.toString());
  1490. i++;
  1491. if( i>=tds.length )break;
  1492. }
  1493. tds[i].set("text", firstDate.getDate());
  1494. if (firstDate.toString() == this.options.baseDate.toString()){
  1495. tds[i].addClass("current_"+this.options.style);
  1496. tds[i].setStyles(this.css["current_"+this.options.style]);
  1497. tds[i].removeClass("gray_"+this.options.style);
  1498. tds[i].setStyle("border", "1px solid #FFF");
  1499. }else if (firstDate.getMonth()!=baseDate.getMonth()){
  1500. tds[i].addClass("gray_"+this.options.style);
  1501. tds[i].setStyles(this.css["gray_"+this.options.style]);
  1502. tds[i].removeClass("current_"+this.options.style);
  1503. tds[i].setStyle("border", "1px solid #FFF");
  1504. }else{
  1505. tds[i].setStyles(this.css["normal_"+this.options.style]);
  1506. tds[i].removeClass("current_"+this.options.style);
  1507. tds[i].removeClass("gray_"+this.options.style);
  1508. tds[i].setStyle("border", "1px solid #FFF");
  1509. }
  1510. var tmp = firstDate.clone();
  1511. if (tmp.clearTime().toString() == this.today.clearTime().toString()){
  1512. //tds[i].addClass("today_"+this.options.style);
  1513. tds[i].setStyles(this.css["today_"+this.options.style]);
  1514. tds[i].setStyle("border", "0px solid #AAA");
  1515. }
  1516. tds[i].store("dateValue", firstDate.toString());
  1517. firstDate.increment("day", 1);
  1518. }
  1519. },
  1520. getWeekNumber: function( d ){
  1521. // Create a copy of this date object
  1522. var target = d.clone();
  1523. // ISO week date weeks start on monday
  1524. // so correct the day number
  1525. //if( this.options.weekBegin == "1" ){
  1526. // var dayNr = (d.getDay() + 6) % 7;
  1527. //}else{
  1528. // var dayNr = (d.getDay() + 7) % 7;
  1529. //}
  1530. var dayNr = ( 7 + d.getDay() - parseInt( this.options.weekBegin ) ) % 7;
  1531. // ISO 8601 states that week 1 is the week
  1532. // with the first thursday of that year.
  1533. // Set the target date to the thursday in the target week
  1534. target.setDate(target.getDate() - dayNr + 3);
  1535. // Store the millisecond value of the target date
  1536. var firstThursday = target.valueOf();
  1537. // Set the target to the first thursday of the year
  1538. // First set the target to january first
  1539. target.setMonth(0, 1);
  1540. // Not a thursday? Correct the date to the next thursday
  1541. if (target.getDay() != 4) {
  1542. target.setMonth(0, 1 + ((4 - target.getDay()) + 7) % 7);
  1543. }
  1544. // The weeknumber is the number of weeks between the
  1545. // first thursday of the year and the thursday in the target week
  1546. return 1 + Math.ceil((firstThursday - target) / 604800000); // 604800000 = 7 * 24 * 3600 * 1000
  1547. }
  1548. });