From 86dfa81edfed9582b5e2180679db2a7ad243f821 Mon Sep 17 00:00:00 2001 From: Adam Shaw Date: Sun, 3 Mar 2013 17:09:43 -0800 Subject: [PATCH] completely rerender BasicView's table every time. mainly for dayRender --- src/basic/BasicDayView.js | 2 +- src/basic/BasicView.js | 212 ++++++++++++++++++-------------------- src/basic/MonthView.js | 2 +- 3 files changed, 104 insertions(+), 112 deletions(-) diff --git a/src/basic/BasicDayView.js b/src/basic/BasicDayView.js index ac9ffca..1f49c84 100644 --- a/src/basic/BasicDayView.js +++ b/src/basic/BasicDayView.js @@ -30,7 +30,7 @@ function BasicDayView(element, calendar) { t.title = formatDate(date, opt('titleFormat')); t.start = t.visStart = cloneDate(date, true); t.end = t.visEnd = addDays(cloneDate(t.start), 1); - renderBasic(1, 1, 1, false); + renderBasic(1, 1, false); } diff --git a/src/basic/BasicView.js b/src/basic/BasicView.js index 48e2a0a..38603af 100644 --- a/src/basic/BasicView.js +++ b/src/basic/BasicView.js @@ -51,6 +51,7 @@ function BasicView(element, calendar, viewName) { // locals + var table; var head; var headCells; var body; @@ -88,17 +89,17 @@ function BasicView(element, calendar, viewName) { disableTextSelection(element.addClass('fc-grid')); - function renderBasic(maxr, r, c, showNumbers) { + function renderBasic(r, c, showNumbers) { rowCnt = r; colCnt = c; updateOptions(); var firstTime = !body; if (firstTime) { - buildSkeleton(maxr, showNumbers); + buildEventContainer(); }else{ clearEvents(); } - updateCells(firstTime); + buildTable(showNumbers); } @@ -130,72 +131,7 @@ function BasicView(element, calendar, viewName) { - function buildSkeleton(maxRowCnt, showNumbers) { - var s; - var headerClass = tm + "-widget-header"; - var contentClass = tm + "-widget-content"; - var i, j; - var table; - - s = - "" + - "" + - ""; - if (showWeekNumbers) { - s += - "" + - "" + - ""; - for (i=0; i"; - if (showWeekNumbers) { - s += - ""; - } - for (j=0; j" + // need fc- for setDayID - "
" + - (showNumbers ? - "
" : - '' - ) + - "
" + - "
 
" + - "
" + - "
" + - ""; - } - s += - "
"; - } - s += - "" + - "
"; - } - for (i=0; i"; // need fc- for setDayID - } - s += - "
"; - table = $(s).appendTo(element); - - head = table.find('thead'); - headCells = head.find('th:not(.fc-week-number)'); - body = table.find('tbody'); - bodyRows = body.find('tr'); - bodyCells = body.find('td').filter(':not(.fc-week-number)'); - bodyFirstCells = bodyCells.filter(':first-child, td.fc-week-number + *'); // either first cell in each row, or immediately following week # - bodyCellTopInners = bodyRows.eq(0).find('div.fc-day-content div'); - - markFirstLast(head.add(head.find('tr'))); // marks first+last tr/th's - markFirstLast(bodyRows); // marks first+last td's - bodyRows.eq(0).addClass('fc-first'); // fc-last is done in updateCells - - dayBind(bodyCells); - + function buildEventContainer() { daySegmentContainer = $("
") .appendTo(element); @@ -203,69 +139,111 @@ function BasicView(element, calendar, viewName) { - function updateCells(firstTime) { - var dowDirty = firstTime || rowCnt == 1; // could the cells' day-of-weeks need updating? + function buildTable(showNumbers) { + var html = ''; + var i, j; + var headerClass = tm + "-widget-header"; + var contentClass = tm + "-widget-content"; var month = t.start.getMonth(); var today = clearTime(new Date()); var cell; var date; - var row; + + html += "" + + "" + + ""; + if (showWeekNumbers) { + html += "" + + "" + + ""; + for (i=0; i"; + if (showWeekNumbers) { + html += ""; + } + for (j=0; j" + // need fc- for setDayID + "
"; + if (showNumbers) { + html += "
"; + } + html += "
" + + "
 
" + + "
" + + "
" + + ""; + } + html += "
"; + } + html += "" + + "
"; + } + for (i=0; i"; // need fc- for setDayID + } + html += "
" + + "
" + + "
"; + + lockHeight(); // the unlock happens later, in setHeight()... + if (table) { + table.remove(); + } + table = $(html).appendTo(element); + + head = table.find('thead'); + headCells = head.find('.fc-day-header'); + body = table.find('tbody'); + bodyRows = body.find('tr'); + bodyCells = body.find('.fc-day'); + bodyFirstCells = bodyRows.find('td:first-child'); + bodyCellTopInners = bodyRows.eq(0).find('.fc-day-content > div'); + + markFirstLast(head.add(head.find('tr'))); // marks first+last tr/th's + markFirstLast(bodyRows); // marks first+last td's + bodyRows.eq(0).addClass('fc-first'); + bodyRows.filter(':last').addClass('fc-last'); + + dayBind(bodyCells); + + // update head cells if (showWeekNumbers) { head.find('.fc-week-number').text(weekNumberTitle); } - if (dowDirty) { - headCells.each(function(i, _cell) { - cell = $(_cell); - date = indexDate(i); - cell.html(formatDate(date, colFormat)); - setDayID(cell, date); + headCells.each(function(i, _cell) { + cell = $(_cell); + date = indexDate(i); + cell.text(formatDate(date, colFormat)); + setDayID(cell, date); + }); + + // update body cells (we should maybe move this into the HTML generation above) + + if (showWeekNumbers) { + bodyRows.each(function(i, _row) { + var weekStartDate = _cellDate(i, 0); + $(_row).find('.fc-week-number > div').text( + formatDate(weekStartDate, weekNumberFormat) + ); }); } bodyCells.each(function(i, _cell) { cell = $(_cell); date = indexDate(i); - if (date.getMonth() == month) { - cell.removeClass('fc-other-month'); - }else{ + if (date.getMonth() != month) { cell.addClass('fc-other-month'); } if (+date == +today) { cell.addClass(tm + '-state-highlight fc-today'); - }else{ - cell.removeClass(tm + '-state-highlight fc-today'); } - cell.find('div.fc-day-number').text(date.getDate()); + cell.find('.fc-day-number').text(date.getDate()); cell.attr('data-date', $.fullCalendar.formatDate(date, "yyyyMMdd")); - if (dowDirty) { - setDayID(cell, date); - } + setDayID(cell, date); trigger('dayRender', t, date, cell); }); - - bodyRows.each(function(i, _row) { - row = $(_row); - if (i < rowCnt) { - - if (showWeekNumbers) { - var weekStartDate = indexDate(i*7); - row.find('.fc-week-number > div').text( - formatDate(weekStartDate, weekNumberFormat) - ); - } - - row.show(); - if (i == rowCnt-1) { - row.addClass('fc-last'); - }else{ - row.removeClass('fc-last'); - } - }else{ - row.hide(); - } - }); } @@ -295,6 +273,7 @@ function BasicView(element, calendar, viewName) { } }); + unlockHeight(); } @@ -526,6 +505,19 @@ function BasicView(element, calendar, viewName) { right: viewWidth }; } - + + + + // makes sure height doesn't collapse while we destroy/render new cells + // (this causes a bad end-user scrollbar jump) + // TODO: generalize this for all view rendering. (also in Calendar.js) + + function lockHeight() { + setMinHeight(element, element.height()); + } + + function unlockHeight() { + setMinHeight(element, 1); + } } diff --git a/src/basic/MonthView.js b/src/basic/MonthView.js index dabbceb..6fd7cd1 100644 --- a/src/basic/MonthView.js +++ b/src/basic/MonthView.js @@ -45,7 +45,7 @@ function MonthView(element, calendar) { t.end = end; t.visStart = visStart; t.visEnd = visEnd; - renderBasic(6, rowCnt, nwe ? 5 : 7, true); + renderBasic(rowCnt, nwe ? 5 : 7, true); }