WeekView.js 64 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724
  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", {
  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", {
  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. "cellSpacing": "0"
  551. }).inject(this.container);
  552. this.dataTable_WholeDay.setStyles({
  553. "display" : "none",
  554. "position":"absolute",
  555. "top" : "92px",
  556. "left" : "0px",
  557. "margin": "0px auto 0px 12px"
  558. });
  559. var tr = new Element("tr").inject(this.dataTable_WholeDay);
  560. new Element( "td" , {
  561. "styles" : {"height":"0px" ,"position":"relative"}
  562. }).inject( tr );
  563. this.dataTd_WholeDay = new Element( "td" , {
  564. "valign" : "top",
  565. "styles" : {"height":"0px","position":"relative"}
  566. }).inject( tr );
  567. //this.dataTdMap_WholeDay = {};
  568. //for( var i=0 ;i <7; i++ ){
  569. // this.dataTdMap_WholeDay[ i ] = new Element( "td" , {
  570. // "valign" : "top",
  571. // "styles" : {"height":"0px"}, //,"position":"relative"},
  572. // "index" : i
  573. // }).inject( tr );
  574. //}
  575. },
  576. loadWholeday : function( data ){
  577. this.wholeday = new MWFCalendarWeekView.Calendar.WholeDay( this, data, this.date);
  578. },
  579. loadDataTable: function( json ){
  580. this.dataTable = new Element("table.dataTable", {
  581. "styles": this.css.calendarTable,
  582. "height": "100%",
  583. "border": "0",
  584. "cellPadding": "0",
  585. "cellSpacing": "0"
  586. }).inject(this.bodyNode);
  587. this.dataTable.setStyles({
  588. "position":"absolute",
  589. "top" : "0px",
  590. "left" : "0px"
  591. });
  592. var tr = new Element("tr").inject(this.dataTable);
  593. new Element( "td" , {
  594. "styles" : {"height":"0px","position":"relative"}
  595. }).inject( tr );
  596. this.dataTdMap = {};
  597. for( var i=0 ;i <7; i++ ){
  598. this.dataTdMap[ i ] = new Element( "td" , {
  599. "styles" : {"height":"0px","position":"relative"},
  600. "index" : i
  601. }).inject( tr );
  602. }
  603. },
  604. getDateIndexMap : function(){
  605. if( !this.dateIndexMap ){
  606. var date = this.getWeekStartTime( this.baseDate );
  607. this.dateIndexMap = {};
  608. for( var i=0 ;i <7; i++ ){
  609. var dateStr = date.format("%Y-%m-%d");
  610. this.dateIndexMap[ dateStr ] = i;
  611. date.increment();
  612. }
  613. }
  614. return this.dateIndexMap;
  615. },
  616. getDateByIndex : function( index ){
  617. var dateStr;
  618. var dateIndexMap = this.getDateIndexMap();
  619. for( var key in dateIndexMap ){
  620. if( dateIndexMap[key] == index ){
  621. return key;
  622. }
  623. }
  624. },
  625. getDateNumOfWeek : function( dateString ){
  626. var dateIndexMap = this.getDateIndexMap();
  627. return this.dateIndexMap[ dateString ]
  628. },
  629. loadDataDay : function(data){
  630. this.dayMap = {};
  631. data.each( function(d){
  632. var key = d.eventDate;
  633. var container = this.dataTdMap[ this.getDateNumOfWeek( key ) ];
  634. if(container){
  635. this.loadDay(container, key, d.inOneDayEvents );
  636. }
  637. }.bind(this));
  638. //var dataMap = {};
  639. //data.each( function( d ){
  640. // var date2 = Date.parse( d.startTime );
  641. // var dateStr = date2.format("%Y-%m-%d");
  642. // if( !dataMap[dateStr] )dataMap[dateStr] = [];
  643. // dataMap[dateStr].push( d )
  644. //}.bind(this));
  645. //
  646. //for( var key in dataMap ){
  647. // var container = this.dataTdMap[ this.getDateNumOfWeek( key ) ];
  648. // if(container){
  649. // this.loadDay(container, key, dataMap[key]);
  650. // }
  651. //}
  652. },
  653. loadDay: function( container, dateStr, array){
  654. var date = Date.parse(dateStr);
  655. var m = date.get("month");
  656. var y = date.get("year");
  657. var d = date.get("date");
  658. var startTime = new Date( y, m, d, 0, 0, 0 );
  659. var endTime = new Date( y, m, d, 23, 59, 59 );
  660. //if(dayArray.length>0){
  661. this.dayMap[dateStr] = new MWFCalendarWeekView.Calendar.Day( container, date, this, array);
  662. //}
  663. //if(wholeDayArray.length>0){
  664. // this.wholedayMap[dateStr] = new MWFCalendarWeekView.Calendar.WholeDay( container, date, this, type, wholeDayArray);
  665. //}
  666. },
  667. resetBodySize: function(){
  668. //if( this.app.inContainer )return;
  669. var size = this.container.getSize();
  670. var titleSize = this.titleNode.getSize();
  671. var titleTableSize = this.titleTable.getSize();
  672. var y = size.y-titleSize.y-titleTableSize.y;
  673. //this.bodyNode.setStyle("height", ""+y+"px");
  674. if (this.contentWarpNode){
  675. this.contentWarpNode.setStyles({
  676. "width": (size.x - 40) +"px"
  677. });
  678. }
  679. this.scrollNode.setStyle("height", ""+y+"px");
  680. var hourTdX = 60;
  681. MWFCalendarWeekView.WeekWidth = size.x - 40 - hourTdX;
  682. var tdX = MWFCalendarWeekView.DayWidth = Math.floor( (MWFCalendarWeekView.WeekWidth-8) / 7);
  683. if(this.calendarTable){
  684. this.calendarTable.setStyles({
  685. "width": (size.x - 40) +"px"
  686. });
  687. var tr =this.calendarTable.getElement("tr:nth-child(1)");
  688. tr.getElements("td").each( function( td, i ){
  689. td.setStyle("width", (i==0 ? hourTdX : tdX )+"px");
  690. })
  691. }
  692. if(this.titleTable){
  693. this.titleTable.setStyles({
  694. "width": (size.x - 40) +"px"
  695. });
  696. var tr =this.titleTable.getElement("tr:nth-child(1)");
  697. tr.getElements("th").each( function( td, i ){
  698. td.setStyle("width", (i==0 ? hourTdX : tdX )+"px");
  699. })
  700. }
  701. if( this.dataTable ){
  702. this.dataTable.setStyles({
  703. "width": (size.x - 40) +"px"
  704. });
  705. var tr =this.dataTable.getElement("tr:nth-child(1)");
  706. tr.getElements("td").each( function( td, i ){
  707. td.setStyle("width", (i==0 ? hourTdX : tdX )+"px");
  708. })
  709. }
  710. for( var key in this.dayMap ){
  711. this.dayMap[key].resize();
  712. }
  713. if( this.dataTable_WholeDay ){
  714. this.dataTable_WholeDay.setStyles({
  715. "width": (size.x - 40) +"px"
  716. });
  717. var tr =this.dataTable_WholeDay.getElement("tr:nth-child(1)");
  718. var contendTdWidth = size.x - 40 - hourTdX - 2;
  719. tr.getElements("td").each( function( td, i ){
  720. td.setStyle("width", (i==0 ? hourTdX : contendTdWidth )+"px");
  721. })
  722. }
  723. if(this.wholeday)this.wholeday.resize();
  724. if(this.nowTimeNode){
  725. this.nowTimeNode.setStyle("width",tdX);
  726. if(this.nowTd)this.nowTimeNode.setStyle("left", this.nowTd.getPosition(this.bodyNode).x );
  727. }
  728. //for( var key in this.dayMap_WholeDay ){
  729. // this.dayMap_WholeDay[key].resize();
  730. //}
  731. },
  732. reload : function(){
  733. this.view.reload();
  734. },
  735. destroy: function(){
  736. Object.each(this.dayMap || {}, function(day){
  737. day.destroy();
  738. }.bind(this));
  739. if( this.wholeday ){
  740. this.wholeday.destroy();
  741. }
  742. this.container.empty();
  743. },
  744. getIndexByPage: function( page ){
  745. var pos = this.calendarTable.getPosition();
  746. if( !this.calendarTableFirstTd ){
  747. this.calendarTableFirstTd = this.calendarTable.getElement("td");
  748. }
  749. pos.x = pos.x + this.calendarTableFirstTd.getSize().x;
  750. var col = (page.x - pos.x ) / (MWFCalendarWeekView.DayWidth + 1);
  751. if( col < 0 || col > 7 )return null;
  752. this.pageOffsetHeight = page.y - pos.y;
  753. var row = ( page.y - pos.y ) / MWFCalendarWeekView.HourHeight;
  754. if( row < 0 || row > 24 )return null;
  755. return {
  756. row : Math.floor(row),
  757. col : Math.floor(col)
  758. }
  759. },
  760. getIndexListByRange : function( index1, index2 ){
  761. var minIndex, maxIndex;
  762. if( index1.col == index2.col ){
  763. if( index1.row <= index2.row ){
  764. minIndex = index1;
  765. maxIndex = index2;
  766. }else{
  767. minIndex = index2;
  768. maxIndex = index1;
  769. }
  770. }else if( index1.col < index2.col ){
  771. minIndex = index1;
  772. maxIndex = index2;
  773. }else{
  774. minIndex = index2;
  775. maxIndex = index1;
  776. }
  777. var beginRow, endRow;
  778. var result = [];
  779. for( var i = minIndex.col; i<=maxIndex.col; i++ ){
  780. beginRow = i == minIndex.col ? minIndex.row : 0;
  781. endRow = i == maxIndex.col ? maxIndex.row : 23;
  782. for( var j = beginRow; j<= endRow; j++ ){
  783. result.push( i+"_"+j );
  784. }
  785. }
  786. return result;
  787. },
  788. getTdByIndexString : function(index){
  789. var indexList = index.split("_");
  790. var col = indexList[0];
  791. var row = indexList[1];
  792. return this.hourTdMap[col][row];
  793. },
  794. cellDragStart: function(td, e){
  795. td.store("index", this.getIndexByPage(e.page ) );
  796. this.scrollNodeHeight = this.scrollNode.getSize().y;
  797. },
  798. cellDrag: function(td, e){
  799. var orgIndex = td.retrieve( "index" );
  800. var curIndex = this.getIndexByPage( e.page );
  801. if( !curIndex )return;
  802. var indexs = this.getIndexListByRange( orgIndex, curIndex );
  803. var flag = this.todayIndex > -1;
  804. if( this.selectedIndexRange ){
  805. var oldIndex = this.selectedIndexRange;
  806. this.selectedIndexRange.each( function( index ){
  807. if( !indexs.contains(index) ){
  808. this.getTdByIndexString( index ).setStyle("background-color", flag && ( index.split("_")[0] ==this.todayIndex ) ? "#F8FBFF" : "#fff");
  809. }
  810. }.bind(this));
  811. indexs.each( function( index ){
  812. if( !this.selectedIndexRange.contains(index) ){
  813. this.getTdByIndexString( index ).setStyle("background-color", "#fffdf2")
  814. }
  815. }.bind(this))
  816. }else{
  817. for( var i=0; i<indexs.length; i++ ){
  818. this.getTdByIndexString( indexs[i] ).setStyle("background-color", "#fffdf2")
  819. }
  820. }
  821. this.selectedIndexRange = indexs;
  822. var scrollNodeTop = this.scrollNode.getScroll().y;
  823. if(( this.pageOffsetHeight + MWFCalendarWeekView.HourHeight * 1.5) > ( this.scrollNodeHeight + scrollNodeTop )){
  824. window.setTimeout( function(){
  825. this.scrollNode.scrollTo(0, scrollNodeTop + MWFCalendarWeekView.HourHeight )
  826. }.bind(this), 200)
  827. }else if( this.pageOffsetHeight - MWFCalendarWeekView.HourHeight * 1.5 < scrollNodeTop ){
  828. window.setTimeout( function(){
  829. this.scrollNode.scrollTo(0, scrollNodeTop - MWFCalendarWeekView.HourHeight )
  830. }.bind(this), 200)
  831. }
  832. },
  833. completeDrag: function(td, e){
  834. var flag = this.todayIndex > -1;
  835. if( this.selectedIndexRange && this.selectedIndexRange.length ){
  836. this.selectedIndexRange.each( function( index ){
  837. this.getTdByIndexString( index ).setStyle("background-color", flag && ( index.split("_")[0] ==this.todayIndex ) ? "#F8FBFF" : "#fff");
  838. }.bind(this));
  839. var beginIndex = this.selectedIndexRange[0].split("_");
  840. var endIndex = this.selectedIndexRange.getLast().split("_");
  841. var beginTime = this.getDateByIndex( beginIndex[0] ) + " " + beginIndex[1]+":00";
  842. var endTime = this.getDateByIndex( endIndex[0] ) + " " + endIndex[1]+":59";
  843. var form = new MWF.xApplication.Calendar.EventForm(this,{}, {
  844. startTime : beginTime ,
  845. endTime : endTime
  846. }, {app:this.app});
  847. form.view = this;
  848. form.create();
  849. this.selectedIndexRange = null;
  850. }
  851. },
  852. getIndexByPage_wholeDay: function( page ){
  853. var pos = this.wholeDayTr.getPosition();
  854. if( !this.wholeDayFirstTd ){
  855. this.wholeDayFirstTd = this.wholeDayTr.getElement("td");
  856. }
  857. pos.x = pos.x + this.wholeDayFirstTd.getSize().x;
  858. var col = (page.x - pos.x ) / (MWFCalendarWeekView.DayWidth + 1);
  859. if( col < 0 || col > 7 )return null;
  860. return Math.floor(col);
  861. },
  862. getIndexListByRange_wholeDay : function( index1, index2 ){
  863. var minIndex = Math.min( index1, index2 );
  864. var maxIndex = Math.max( index1, index2 );
  865. var result = [];
  866. for( var i = minIndex; i<=maxIndex; i++ ){
  867. result.push( i );
  868. }
  869. return result;
  870. },
  871. cellDragStart_wholeDay: function(td, e){
  872. td.store("index", this.getIndexByPage_wholeDay(e.page ) );
  873. },
  874. cellDrag_wholeDay: function(td, e){
  875. var orgIndex = td.retrieve( "index" );
  876. var curIndex = this.getIndexByPage_wholeDay( e.page );
  877. if( !curIndex )return;
  878. var indexs = this.getIndexListByRange_wholeDay( orgIndex, curIndex );
  879. var flag = this.todayIndex > -1;
  880. if( this.selectedIndexRange_wholeDay ){
  881. var oldIndex = this.selectedIndexRange_wholeDay;
  882. this.selectedIndexRange_wholeDay.each( function( index ){
  883. if( !indexs.contains(index) ){
  884. this.wholeDayTdMap[index].setStyle("background-color", flag && ( index == this.todayIndex ) ? "#F8FBFF" : "#fff");
  885. }
  886. }.bind(this));
  887. indexs.each( function( index ){
  888. if( !this.selectedIndexRange_wholeDay.contains(index) ){
  889. this.wholeDayTdMap[index].setStyle("background-color", "#fffdf2")
  890. }
  891. }.bind(this))
  892. }else{
  893. for( var i=0; i<indexs.length; i++ ){
  894. this.wholeDayTdMap[indexs[i]].setStyle("background-color", "#fffdf2")
  895. }
  896. }
  897. this.selectedIndexRange_wholeDay = indexs;
  898. },
  899. completeDrag_wholeDay: function(td, e){
  900. var flag = this.todayIndex > -1;
  901. if( this.selectedIndexRange_wholeDay && this.selectedIndexRange_wholeDay.length ){
  902. this.selectedIndexRange_wholeDay.each( function( index ){
  903. this.wholeDayTdMap[index].setStyle("background-color", flag && ( index == this.todayIndex ) ? "#F8FBFF" : "#fff");
  904. }.bind(this));
  905. var beginIndex = this.selectedIndexRange_wholeDay[0];
  906. var endIndex = this.selectedIndexRange_wholeDay.getLast();
  907. var beginTime = this.getDateByIndex( beginIndex );
  908. var endTime = this.getDateByIndex( endIndex );
  909. var form = new MWF.xApplication.Calendar.EventForm(this,{}, {
  910. startTime : beginTime ,
  911. endTime : endTime,
  912. isWholeday : true
  913. }, {app:this.app});
  914. form.view = this;
  915. form.create();
  916. this.selectedIndexRange_wholeDay = null;
  917. }
  918. }
  919. });
  920. MWFCalendarWeekView.Calendar.WholeDay = new Class({
  921. Implements: [Events],
  922. initialize: function( calendar, data, date){
  923. this.calendar = calendar;
  924. this.view = this.calendar.view;
  925. this.css = this.calendar.css;
  926. this.app = this.calendar.app;
  927. this.date = date.clone();
  928. this.data = data;
  929. this.load();
  930. },
  931. load: function(){
  932. //var start = this.calendar.getWeekStartTime( this.date );
  933. //this.weekStartTime = new Date( start.get("year"), start.get("month"), start.get("date"), 0, 0, 0 );
  934. //
  935. //var end = start.clone().increment( "day", 6 );
  936. //this.weekEndTime = new Date( end.get("year"), end.get("month"), end.get("date"), 23, 59, 59 );
  937. this.weekStartTime = this.calendar.weekStartTime;
  938. this.weekEndTime = this.calendar.weekEndTime;
  939. this.rangeList = [];
  940. this.rangeObject = {};
  941. this.data.each( function(d , i){
  942. var range = this.getTimeRange( d.startTime, d.endTime );
  943. if( !range )return null;
  944. d.range = range;
  945. d.range.id = d.id;
  946. d.range.data = d;
  947. this.rangeList.push( range );
  948. this.rangeObject[d.id] = range;
  949. }.bind(this));
  950. var itemCountOfDay = {};
  951. this.rangeList.each( function(r){
  952. r.days.each( function( d ){
  953. itemCountOfDay[ d ] = itemCountOfDay[ d ] ? itemCountOfDay[ d ]+1 : 1
  954. }.bind(this))
  955. }.bind(this));
  956. this.maxDayLength = 0;
  957. for(var key in itemCountOfDay){
  958. if( itemCountOfDay[key] > this.maxDayLength )this.maxDayLength = itemCountOfDay[key];
  959. }
  960. if( this.maxDayLength ){
  961. this.calendar.titleTable.getElement("td:nth-child(1)").setStyle("height", 24*this.maxDayLength);
  962. }
  963. this.usefulTdFlagArray = [];
  964. for( var i=0; i<this.maxDayLength; i++ ){
  965. var array = [];
  966. for( var j=0; j<7; j++ ){
  967. array.push( true );
  968. }
  969. this.usefulTdFlagArray.push( array )
  970. }
  971. this.sortRange();
  972. //this.getIntersectedPath2();
  973. this.documentList = [];
  974. this.rangeList.each( function(r , i){
  975. var d = r.data;
  976. if( !d )return null;
  977. this.documentList.push( new MWFCalendarWeekView.Calendar.WholeDayDocument( this, d, r ) );
  978. }.bind(this))
  979. },
  980. sortRange : function(){
  981. this.rangeList.sort( function( range1, range2 ){
  982. if( range1.days[0] > range2.days[0] )return 1;
  983. if( range1.days[0] < range2.days[0] )return -1;
  984. return range2.diff - range1.diff;
  985. }.bind(this));
  986. },
  987. getTimeRange : function( startTime, endTime ){
  988. var start = Date.parse(startTime );
  989. var end = Date.parse(endTime );
  990. if( end < this.weekStartTime || start > this.weekEndDate )return null;
  991. if( start < this.weekStartTime )start = this.weekStartTime.clone();
  992. if( this.weekEndTime < end )end = this.weekEndTime.clone();
  993. var end = new Date( end.get("year"), end.get("month"), end.get("date"), 23, 59, 59 );
  994. var days = [];
  995. while( start < end ){
  996. days.push( start.clone().format("%Y-%m-%d") );
  997. start.increment()
  998. }
  999. start = Date.parse(startTime );
  1000. end = Date.parse(endTime );
  1001. return {
  1002. start : start,
  1003. end : end,
  1004. days : days,
  1005. diff : end - start
  1006. }
  1007. },
  1008. resize: function(){
  1009. if(!this.documentList)return;
  1010. this.documentList.each( function(d){
  1011. d.resize();
  1012. }.bind(this))
  1013. },
  1014. destroy : function(){
  1015. if(!this.documentList)return;
  1016. while( this.documentList.length ){
  1017. this.documentList.pop().destroy()
  1018. }
  1019. this.calendar.dataTd_WholeDay.empty();
  1020. }
  1021. });
  1022. MWFCalendarWeekView.Calendar.WholeDayDocument = new Class({
  1023. initialize: function(day, data, range ){
  1024. this.day = day;
  1025. this.calendar = day.calendar;
  1026. this.view = this.calendar.view;
  1027. this.css = this.calendar.css;
  1028. this.app = this.calendar.app;
  1029. this.date = day.date.clone();
  1030. this.data = data;
  1031. this.range = range;
  1032. this.load();
  1033. },
  1034. load: function(){
  1035. this.container = this.calendar.dataTd_WholeDay;
  1036. var items = this.items = [];
  1037. this.data.timeStart = Date.parse( this.data.startTime );
  1038. this.data.timeEnd = Date.parse( this.data.endTime );
  1039. this.getUsefulTdYIndex();
  1040. this.createNode();
  1041. //this.range.days.each( function( d, i ){
  1042. // items.push( new MWFCalendarWeekView.Calendar.WholeDayItem( this, d, i ) )
  1043. //}.bind(this))
  1044. },
  1045. getUsefulTdYIndex : function(){
  1046. for( var i=0; i<this.day.maxDayLength; i++ ){
  1047. var flag = true;
  1048. for( var j=0; j<this.range.days.length; j++ ){
  1049. var idx = this.calendar.getDateNumOfWeek( this.range.days[j] );
  1050. if( !this.day.usefulTdFlagArray[i][idx] ){
  1051. flag = false;
  1052. break;
  1053. }
  1054. }
  1055. if( flag ){
  1056. this.yIndex = i;
  1057. for( var j=0; j<this.range.days.length; j++ ){
  1058. var idx = this.calendar.getDateNumOfWeek( this.range.days[j] );
  1059. this.day.usefulTdFlagArray[i][idx] = false;
  1060. }
  1061. break;
  1062. }
  1063. }
  1064. },
  1065. createNode : function(){
  1066. var lightColor = this.lightColor = MWFCalendar.ColorOptions.getLightColor( this.data.color );
  1067. var node = this.node = new Element("div",{
  1068. styles : {
  1069. position : "absolute",
  1070. //border : "1px solid #cae2ff",
  1071. "background-color" : "#cae2ff",
  1072. "overflow" : "hidden",
  1073. "height" : "20px",
  1074. "line-height" : "20px",
  1075. "border-top" : "1px solid " + lightColor,
  1076. "border-bottom" : "1px solid " + lightColor
  1077. },
  1078. events : {
  1079. click : function(){
  1080. var form = new MWF.xApplication.Calendar.EventForm(this, this.data, {
  1081. isFull : true
  1082. }, {app:this.app});
  1083. form.view = this.view;
  1084. form.edit();
  1085. }.bind(this),
  1086. "mouseover" : function () {
  1087. this.node.setStyle("border-color", this.data.color );
  1088. }.bind(this),
  1089. "mouseout" : function () {
  1090. this.node.setStyle("border-color", this.lightColor );
  1091. }.bind(this)
  1092. }
  1093. }).inject( this.container );
  1094. node.setStyles(this.getCoordinate());
  1095. if( !this.startTimeOutRange ){
  1096. node.setStyles({
  1097. "border-left" : "1px solid " + lightColor,
  1098. "border-top-left-radius" : "10px",
  1099. "border-bottom-left-radius" : "10px"
  1100. })
  1101. }
  1102. if( !this.endTimeOutRange ){
  1103. node.setStyles({
  1104. "border-right" : "1px solid " + lightColor,
  1105. "border-top-right-radius" : "10px",
  1106. "border-bottom-right-radius" : "10px"
  1107. })
  1108. }
  1109. //if( this.isFirst ){
  1110. var timeNode = new Element("div",{
  1111. styles : {
  1112. "font-size" : "10px",
  1113. "padding-left" : "2px",
  1114. "float" : "left"
  1115. },
  1116. text : this.data.timeStart.format("%m-%d %H:%M") + "至" + this.data.timeEnd.format("%m-%d %H:%M")
  1117. }).inject( node );
  1118. var titleNode = new Element("div",{
  1119. styles : {
  1120. "padding-left" : "5px",
  1121. "font-size" : "12px",
  1122. "float" : "left"
  1123. },
  1124. text : this.data.title
  1125. }).inject( node );
  1126. //}
  1127. this.tooltip = new MWF.xApplication.Calendar.EventTooltip(this.app.content, this.node, this.app, this.data, {
  1128. axis : "y", "delay" : 350
  1129. });
  1130. },
  1131. getCoordinate : function(){
  1132. var data = this.data;
  1133. var range = this.range;
  1134. var top = this.yIndex * 24;
  1135. var timeStart = this.day.weekStartTime;
  1136. var timeEnd = this.day.weekEndTime;
  1137. if( this.data.timeStart < timeStart ){
  1138. this.startTimeOutRange = true;
  1139. }else{
  1140. this.startTimeOutRange = false;
  1141. timeStart = this.data.timeStart;
  1142. }
  1143. if( this.data.timeEnd > timeEnd ){
  1144. this.endTimeOutRange = true;
  1145. }else{
  1146. this.endTimeOutRange = false;
  1147. timeEnd = this.data.timeEnd;
  1148. }
  1149. var diff = timeEnd - timeStart;
  1150. var width = ( diff / MWFCalendarWeekView.WeekMsec ) * MWFCalendarWeekView.WeekWidth - 2;
  1151. var left = ( ( timeStart - this.day.weekStartTime ) / MWFCalendarWeekView.WeekMsec ) * MWFCalendarWeekView.WeekWidth + 3;
  1152. //var marginRight = ( ( this.weekTimeEnd - timeEnd ) / MWFCalendarWeekView.DayMsec) * MWFCalendarWeekView.DayWidth;
  1153. return {
  1154. top : top + 2,
  1155. left : left,
  1156. width : width // + ( !this.isLast ? 2 : -2 ) //,
  1157. //"margin-left" : marginLeft,
  1158. //"margin-right" : marginRight
  1159. }
  1160. },
  1161. resize : function(){
  1162. this.node.setStyles(this.getCoordinate());
  1163. },
  1164. reload: function(){
  1165. if( this.tooltip )this.tooltip.destroy();
  1166. this.view.reload();
  1167. },
  1168. destroy : function(){
  1169. if( this.tooltip )this.tooltip.destroy();
  1170. this.node.destroy();
  1171. }
  1172. });
  1173. MWFCalendarWeekView.Calendar.Day = new Class({
  1174. Implements: [Events],
  1175. initialize: function(container, date, calendar, data){
  1176. this.container = container;
  1177. this.calendar = calendar;
  1178. this.view = this.calendar.view;
  1179. this.css = this.calendar.css;
  1180. this.app = this.calendar.app;
  1181. this.date = date.clone();
  1182. this.data = data;
  1183. this.calendars = [];
  1184. this.load();
  1185. },
  1186. load: function(){
  1187. this.day = this.date.getDate();
  1188. this.month = this.date.getMonth();
  1189. this.year = this.date.getFullYear();
  1190. this.startTime = new Date( this.year, this.month, this.day, 0, 0, 0 );
  1191. this.endTime = new Date( this.year, this.month, this.day, 23, 59, 59 );
  1192. this.rangeList = [];
  1193. this.rangeObject = {};
  1194. this.data.each( function(d , i){
  1195. var range = this.getTimeRange( d.startTime, d.endTime );
  1196. if( !range )return null;
  1197. d.range = range;
  1198. d.range.id = d.id;
  1199. this.rangeList.push( range );
  1200. this.rangeObject[d.id] = range;
  1201. }.bind(this));
  1202. this.sortRange();
  1203. var length = this.data.length;
  1204. this.documentList = [];
  1205. this.data.each( function(d , i){
  1206. var range = d.range;
  1207. range.dayRangeCount = length;
  1208. range.index = this.rangeList.indexOf( range );
  1209. if( !range )return null;
  1210. //var coordinate = this.getCoordinate( d, range );
  1211. this.documentList.push( new MWFCalendarWeekView.Calendar.Document(this.container, this, d, range ) );
  1212. }.bind(this))
  1213. },
  1214. sortRange : function(){
  1215. this.rangeList.sort( function(range1, range2){
  1216. return range1.startTime - range2.startTime;
  1217. });
  1218. },
  1219. getTimeRange: function( bDate1, eDate1 ){
  1220. var bDate = typeOf(bDate1) == "string" ? Date.parse(bDate1) : bDate1;
  1221. var eDate = typeOf(eDate1) == "string" ? Date.parse(eDate1) : eDate1;
  1222. if( eDate <= this.startTime ){ //比当天天12点更晚
  1223. return null;
  1224. }
  1225. if( this.endTime <= bDate ){
  1226. return null;
  1227. }
  1228. var range = {
  1229. start: ( bDate <= this.startTime ) ? [0, 0, 0] : [bDate.get("hr"), bDate.get("min"), bDate.get("sec")],
  1230. end: ( this.endTime <= eDate ) ? [23, 59, 59] : [eDate.get("hr"), eDate.get("min"), eDate.get("sec")]
  1231. };
  1232. range.startTime = new Date( this.year, this.month, this.day, range.start[0], range.start[1], range.start[2] );
  1233. range.endTime = new Date( this.year, this.month, this.day, range.end[0], range.end[1], range.end[2] );
  1234. range.diff = range.endTime - range.startTime;
  1235. return range;
  1236. },
  1237. resize : function(){
  1238. if(!this.documentList)return;
  1239. this.documentList.each( function( doc ){
  1240. doc.resize();
  1241. }.bind(this))
  1242. },
  1243. reload: function(){
  1244. this.view.reload();
  1245. },
  1246. destroy : function(){
  1247. while( this.documentList.length > 0 ){
  1248. this.documentList.pop().destroy();
  1249. }
  1250. this.container.empty();
  1251. }
  1252. });
  1253. MWFCalendarWeekView.Calendar.Document = new Class({
  1254. initialize: function(container, day, data, range, coordinate ){
  1255. this.container = container;
  1256. this.day = day;
  1257. this.calendar = day.calendar;
  1258. this.view = this.calendar.view;
  1259. this.css = this.calendar.css;
  1260. this.app = this.calendar.app;
  1261. this.date = day.date.clone();
  1262. this.data = data;
  1263. this.range = range;
  1264. this.coordinate = coordinate; //today, otherMonth, thisMonth
  1265. this.load();
  1266. },
  1267. load: function(){
  1268. var lightColor = this.lightColor = MWFCalendar.ColorOptions.getLightColor( this.data.color );
  1269. var node = this.node = new Element("div",{
  1270. styles : {
  1271. position : "absolute",
  1272. border : "1px solid "+lightColor,
  1273. "background-color" : lightColor,
  1274. "overflow" : "hidden",
  1275. "border-radius" : "5px"
  1276. },
  1277. events : {
  1278. click : function(){
  1279. var form = new MWF.xApplication.Calendar.EventForm(this, this.data, {
  1280. isFull : true
  1281. }, {app:this.app});
  1282. form.view = this.view;
  1283. form.edit();
  1284. }.bind(this),
  1285. "mouseover" : function () {
  1286. this.node.setStyle("border-color", this.data.color );
  1287. }.bind(this),
  1288. "mouseout" : function () {
  1289. this.node.setStyle("border-color", this.lightColor );
  1290. }.bind(this)
  1291. }
  1292. }).inject( this.container );
  1293. node.setStyles(this.getCoordinate());
  1294. var timeNode = new Element("div",{
  1295. styles : {
  1296. "font-size" : "10px",
  1297. "padding-top" : "2px",
  1298. "padding-left" : "2px"
  1299. },
  1300. text : this.range.startTime.format("%H:%M") + "-" + this.range.endTime.format("%H:%M")
  1301. }).inject( node );
  1302. var titleNode = new Element("div",{
  1303. styles : {
  1304. "padding-top" : "10px",
  1305. "padding-left" : "5px",
  1306. "font-size" : "12px"
  1307. },
  1308. text : this.data.title
  1309. }).inject( node );
  1310. this.tooltip = new MWF.xApplication.Calendar.EventTooltip(this.app.content, this.node, this.app, this.data, {
  1311. axis : "x", "delay" : 350
  1312. });
  1313. },
  1314. resize : function(){
  1315. this.node.setStyles(this.getCoordinate());
  1316. },
  1317. getCoordinate : function(){
  1318. var data = this.data;
  1319. var range = this.range;
  1320. var height = Math.floor( ( ( range.endTime - range.startTime ) / MWFCalendarWeekView.DayMsec ) * MWFCalendarWeekView.DayHeight)-4;
  1321. var top = Math.floor( ( ( range.startTime - this.day.startTime ) / MWFCalendarWeekView.DayMsec ) * MWFCalendarWeekView.DayHeight)+2;
  1322. //var width = Math.floor( MWFCalendarWeekView.DayWidth / length )-2;
  1323. //var left = ( width + 2)* index + 1;
  1324. //var width = Math.floor( MWFCalendarWeekView.DayWidth / range.path.length )-5;
  1325. //var left = ( width + 5)* range.path.indexOf( data.id ) + 3;
  1326. var width = Math.floor( MWFCalendarWeekView.DayWidth / this.range.dayRangeCount )-5;
  1327. var left = ( width + 5)* this.range.index + 3;
  1328. return {
  1329. top : top,
  1330. left : left,
  1331. width : width,
  1332. height : height
  1333. }
  1334. },
  1335. reload: function(){
  1336. if( this.tooltip )this.tooltip.destroy();
  1337. this.view.reload();
  1338. },
  1339. destroy: function(){
  1340. if( this.tooltip )this.tooltip.destroy();
  1341. this.node.destroy()
  1342. }
  1343. });
  1344. MWFCalendarWeekView.WeekCalendar = new Class({
  1345. Extends : MWF.widget.Calendar,
  1346. initialize: function(node, options){
  1347. this.options.weekBegin = "0";
  1348. Locale.use("zh-CHS");
  1349. this.options.defaultTime = ""+this.options.baseDate.getHours()+":"+this.options.baseDate.getMinutes()+":"+this.options.baseDate.getSeconds();
  1350. this.setOptions(options);
  1351. this.path = MWF.defaultPath+"/widget/$Calendar/";
  1352. this.cssPath = MWF.defaultPath+"/widget/$Calendar/"+this.options.style+"/css.wcss";
  1353. this._loadCss();
  1354. // this.options.containerPath = this.path+this.style+"/container.html";
  1355. // this.options.dayPath = this.path+this.style+"/day.html";
  1356. // this.options.monthPath = this.path+this.style+"/month.html";
  1357. // this.options.yearPath = this.path+this.style+"/year.html";
  1358. // this.options.timePath = this.path+this.style+"/time.html";
  1359. if (!this.options.format){
  1360. if (this.options.isTime){
  1361. //this.options.format = Locale.get("Date").shortDate + " " + Locale.get("Date").shortTime;
  1362. if(this.options.timeOnly){
  1363. this.options.format="%H:%M";
  1364. }
  1365. else{
  1366. this.options.format = Locale.get("Date").shortDate + " " + "%H:%M";
  1367. }
  1368. }else{
  1369. this.options.format = Locale.get("Date").shortDate;
  1370. }
  1371. }
  1372. this.options.containerPath = this.options.path+this.options.style+"/container.html";
  1373. this.options.dayPath = this.options.path+this.options.style+"/day_week.html";
  1374. this.options.monthPath = this.options.path+this.options.style+"/month.html";
  1375. this.options.yearPath = this.options.path+this.options.style+"/year.html";
  1376. this.options.timePath = this.options.path+this.options.style+"/time.html";
  1377. this.today = new Date();
  1378. this.currentView = this.options.defaultView;
  1379. this.node = $(node);
  1380. this.visible = false;
  1381. this.container = this.createContainer();
  1382. this.container.inject((this.options.target) || $(document.body));
  1383. this.contentTable = this.createContentTable();
  1384. this.contentTable.inject(this.contentDateNode);
  1385. this.addEvents();
  1386. this.container.set({
  1387. styles: {
  1388. "display": "none",
  1389. "opacity": 1
  1390. }
  1391. });
  1392. this.fireEvent("init");
  1393. //this.move = true;
  1394. //this.containerDrag = new Drag.Move(this.container);
  1395. },
  1396. showDay: function(year, month){
  1397. this._setDayTitle(null, year, month);
  1398. this._setDayWeekTitleTh();
  1399. this._setDayDate(null, year, month);
  1400. // if (!this.move){
  1401. // this.move = true;
  1402. // this.containerDrag = new Drag.Move(this.container);
  1403. // }
  1404. },
  1405. _setDayTitle: function(node, year, month){
  1406. var thisYear = (year!=undefined) ? year : this.options.baseDate.getFullYear();
  1407. var thisMonth = (month!=undefined) ? month : this.options.baseDate.getMonth();
  1408. thisMonth++;
  1409. var text = thisYear+"年"+thisMonth+"月";
  1410. var thisNode = node || this.currentTextNode;
  1411. thisNode.set("text", text);
  1412. thisNode.store("year", thisYear);
  1413. thisNode.store("month", thisMonth);
  1414. },
  1415. _setDayWeekTitleTh: function(table){
  1416. var dayTable = table || this.contentTable;
  1417. var thead = dayTable.getElement("thead");
  1418. var cells = thead.getElements("th");
  1419. if (this.css.calendarDaysContentTh) cells.setStyles(this.css.calendarDaysContentTh);
  1420. //var days_abbr = Locale.get("Date").days_abbr;
  1421. var days_abbr = MWF.LP.widget.days_abbr;
  1422. cells.each(function(item, idx){
  1423. if( idx == 0 ){
  1424. item.set("text", "周");
  1425. }else{
  1426. //var index;
  1427. //if( this.options.weekBegin == "0" ){
  1428. // index = idx-1;
  1429. //}else{
  1430. // index = idx == 7 ? 0 : idx;
  1431. //}
  1432. var index = ( idx - 1 + parseInt( this.options.weekBegin ) ) % 7;
  1433. item.set("text", days_abbr[index]);
  1434. }
  1435. }.bind(this));
  1436. return cells;
  1437. },
  1438. _setDayDate: function(table, year, month){
  1439. var dayTable = table || this.contentTable;
  1440. var baseDate = this.options.baseDate;
  1441. if ((year!=undefined) && (month!=undefined)){
  1442. baseDate = new Date();
  1443. baseDate.setDate(1);
  1444. baseDate.setFullYear(year);
  1445. baseDate.setMonth(month);
  1446. }
  1447. var tbody = dayTable.getElement("tbody");
  1448. var tds = tbody.getElements("td");
  1449. var firstDate = baseDate.clone();
  1450. firstDate.setDate(1);
  1451. //if( this.options.weekBegin == "0" ){
  1452. // var day = firstDate.getDay()+1;
  1453. //}else{
  1454. //
  1455. //}
  1456. var day = ( 7 + firstDate.getDay() - parseInt( this.options.weekBegin ) ) % 7 + 1;
  1457. var tmpDate = firstDate.clone();
  1458. for (var i=day-1; i>=0; i--){
  1459. if( i % 8 == 0 ){ //设置周数
  1460. var week = this.getWeekNumber( tmpDate );
  1461. tds[i].set("text", week);
  1462. tds[i].setStyles(this.css.week);
  1463. tds[i].store("weekValue", week.toString());
  1464. tds[i].store("dateValue", tmpDate.toString());
  1465. i--;
  1466. if( i<0 )break;
  1467. }
  1468. tmpDate.increment("day", -1);
  1469. tds[i].set("text", tmpDate.getDate());
  1470. tds[i].addClass("gray_"+this.options.style);
  1471. tds[i].setStyles(this.css["gray_"+this.options.style]);
  1472. tds[i].store("dateValue", tmpDate.toString())
  1473. }
  1474. for (var i=day; i<tds.length; i++){
  1475. if( i % 8 == 0 ){ //设置周数
  1476. var week = this.getWeekNumber( firstDate );
  1477. tds[i].set("text", week );
  1478. //tds[i].addClass("gray_"+this.options.style);
  1479. tds[i].setStyles(this.css.week);
  1480. tds[i].store("weekValue", week.toString());
  1481. tds[i].store("dateValue", firstDate.toString());
  1482. i++;
  1483. if( i>=tds.length )break;
  1484. }
  1485. tds[i].set("text", firstDate.getDate());
  1486. if (firstDate.toString() == this.options.baseDate.toString()){
  1487. tds[i].addClass("current_"+this.options.style);
  1488. tds[i].setStyles(this.css["current_"+this.options.style]);
  1489. tds[i].removeClass("gray_"+this.options.style);
  1490. tds[i].setStyle("border", "1px solid #FFF");
  1491. }else if (firstDate.getMonth()!=baseDate.getMonth()){
  1492. tds[i].addClass("gray_"+this.options.style);
  1493. tds[i].setStyles(this.css["gray_"+this.options.style]);
  1494. tds[i].removeClass("current_"+this.options.style);
  1495. tds[i].setStyle("border", "1px solid #FFF");
  1496. }else{
  1497. tds[i].setStyles(this.css["normal_"+this.options.style]);
  1498. tds[i].removeClass("current_"+this.options.style);
  1499. tds[i].removeClass("gray_"+this.options.style);
  1500. tds[i].setStyle("border", "1px solid #FFF");
  1501. }
  1502. var tmp = firstDate.clone();
  1503. if (tmp.clearTime().toString() == this.today.clearTime().toString()){
  1504. //tds[i].addClass("today_"+this.options.style);
  1505. tds[i].setStyles(this.css["today_"+this.options.style]);
  1506. tds[i].setStyle("border", "0px solid #AAA");
  1507. }
  1508. tds[i].store("dateValue", firstDate.toString());
  1509. firstDate.increment("day", 1);
  1510. }
  1511. },
  1512. getWeekNumber: function( d ){
  1513. // Create a copy of this date object
  1514. var target = d.clone();
  1515. // ISO week date weeks start on monday
  1516. // so correct the day number
  1517. //if( this.options.weekBegin == "1" ){
  1518. // var dayNr = (d.getDay() + 6) % 7;
  1519. //}else{
  1520. // var dayNr = (d.getDay() + 7) % 7;
  1521. //}
  1522. var dayNr = ( 7 + d.getDay() - parseInt( this.options.weekBegin ) ) % 7;
  1523. // ISO 8601 states that week 1 is the week
  1524. // with the first thursday of that year.
  1525. // Set the target date to the thursday in the target week
  1526. target.setDate(target.getDate() - dayNr + 3);
  1527. // Store the millisecond value of the target date
  1528. var firstThursday = target.valueOf();
  1529. // Set the target to the first thursday of the year
  1530. // First set the target to january first
  1531. target.setMonth(0, 1);
  1532. // Not a thursday? Correct the date to the next thursday
  1533. if (target.getDay() != 4) {
  1534. target.setMonth(0, 1 + ((4 - target.getDay()) + 7) % 7);
  1535. }
  1536. // The weeknumber is the number of weeks between the
  1537. // first thursday of the year and the thursday in the target week
  1538. return 1 + Math.ceil((firstThursday - target) / 604800000); // 604800000 = 7 * 24 * 3600 * 1000
  1539. }
  1540. });