hiddenDays option. internal refactor for how cells/dates work

This commit is contained in:
Adam Shaw
2013-07-17 23:01:19 -07:00
parent a0c27fd143
commit 63735b7b31
14 changed files with 1555 additions and 1069 deletions
+11 -8
View File
@@ -1,8 +1,6 @@
fcViews.basicDay = BasicDayView;
//TODO: when calendar's date starts out on a weekend, shouldn't happen
function BasicDayView(element, calendar) {
var t = this;
@@ -16,20 +14,25 @@ function BasicDayView(element, calendar) {
BasicView.call(t, element, calendar, 'basicDay');
var opt = t.opt;
var renderBasic = t.renderBasic;
var skipHiddenDays = t.skipHiddenDays;
var formatDate = calendar.formatDate;
function render(date, delta) {
if (delta) {
addDays(date, delta);
if (!opt('weekends')) {
skipWeekend(date, delta < 0 ? -1 : 1);
}
}
skipHiddenDays(date, delta < 0 ? -1 : 1);
var start = cloneDate(date, true);
var end = addDays(cloneDate(start), 1);
t.title = formatDate(date, opt('titleFormat'));
t.start = t.visStart = cloneDate(date, true);
t.end = t.visEnd = addDays(cloneDate(t.start), 1);
t.start = t.visStart = start;
t.end = t.visEnd = end;
renderBasic(1, 1, false);
}
+9 -121
View File
@@ -5,138 +5,26 @@ function BasicEventRenderer() {
// exports
t.renderEvents = renderEvents;
t.compileDaySegs = compileSegs; // for DayEventRenderer
t.clearEvents = clearEvents;
t.bindDaySeg = bindDaySeg;
// imports
DayEventRenderer.call(t);
var opt = t.opt;
var trigger = t.trigger;
//var setOverflowHidden = t.setOverflowHidden;
var isEventDraggable = t.isEventDraggable;
var isEventResizable = t.isEventResizable;
var reportEvents = t.reportEvents;
var reportEventClear = t.reportEventClear;
var eventElementHandlers = t.eventElementHandlers;
var showEvents = t.showEvents;
var hideEvents = t.hideEvents;
var eventDrop = t.eventDrop;
var getDaySegmentContainer = t.getDaySegmentContainer;
var getHoverListener = t.getHoverListener;
var renderDayOverlay = t.renderDayOverlay;
var clearOverlays = t.clearOverlays;
var getRowCnt = t.getRowCnt;
var getColCnt = t.getColCnt;
var renderDaySegs = t.renderDaySegs;
var resizableDayEvent = t.resizableDayEvent;
/* Rendering
--------------------------------------------------------------------*/
function renderEvents(events, modifiedEventId) {
reportEvents(events);
renderDaySegs(compileSegs(events), modifiedEventId);
trigger('eventAfterAllRender');
t.reportEvents(events);
t.renderDayEvents(events, modifiedEventId);
t.trigger('eventAfterAllRender');
}
function clearEvents() {
reportEventClear();
getDaySegmentContainer().empty();
}
function compileSegs(events) {
var rowCnt = getRowCnt(),
colCnt = getColCnt(),
d1 = cloneDate(t.visStart),
d2 = addDays(cloneDate(d1), colCnt),
visEventsEnds = $.map(events, exclEndDay),
i, row,
j, level,
k, seg,
segs=[];
for (i=0; i<rowCnt; i++) {
row = stackSegs(sliceSegs(events, visEventsEnds, d1, d2));
for (j=0; j<row.length; j++) {
level = row[j];
for (k=0; k<level.length; k++) {
seg = level[k];
seg.row = i;
seg.level = j; // not needed anymore
segs.push(seg);
}
}
addDays(d1, 7);
addDays(d2, 7);
}
return segs;
}
function bindDaySeg(event, eventElement, seg) {
if (isEventDraggable(event)) {
draggableDayEvent(event, eventElement);
}
if (seg.isEnd && isEventResizable(event)) {
resizableDayEvent(event, eventElement, seg);
}
eventElementHandlers(event, eventElement);
// needs to be after, because resizableDayEvent might stopImmediatePropagation on click
}
/* Dragging
----------------------------------------------------------------------------*/
function draggableDayEvent(event, eventElement) {
var hoverListener = getHoverListener();
var dayDelta;
eventElement.draggable({
zIndex: 9,
delay: 50,
opacity: opt('dragOpacity'),
revertDuration: opt('dragRevertDuration'),
start: function(ev, ui) {
trigger('eventDragStart', eventElement, event, ev, ui);
hideEvents(event, eventElement);
hoverListener.start(function(cell, origCell, rowDelta, colDelta) {
eventElement.draggable('option', 'revert', !cell || !rowDelta && !colDelta);
clearOverlays();
if (cell) {
//setOverflowHidden(true);
dayDelta = rowDelta*7 + colDelta * (opt('isRTL') ? -1 : 1);
renderDayOverlay(
addDays(cloneDate(event.start), dayDelta),
addDays(exclEndDay(event), dayDelta)
);
}else{
//setOverflowHidden(false);
dayDelta = 0;
}
}, ev, 'drag');
},
stop: function(ev, ui) {
hoverListener.stop();
clearOverlays();
trigger('eventDragStop', eventElement, event, ev, ui);
if (dayDelta) {
eventDrop(this, event, dayDelta, 0, event.allDay, ev, ui);
}else{
eventElement.css('filter', ''); // clear IE opacity side-effects
showEvents(event, eventElement);
}
//setOverflowHidden(false);
}
});
t.reportEventClear();
t.getDaySegmentContainer().empty();
}
// TODO: have this class (and AgendaEventRenderer) be responsible for creating the event container div
}
+191 -190
View File
@@ -21,14 +21,12 @@ function BasicView(element, calendar, viewName) {
t.dragStop = dragStop;
t.defaultEventEnd = defaultEventEnd;
t.getHoverListener = function() { return hoverListener };
t.colLeft = colLeft;
t.colRight = colRight;
t.colContentLeft = colContentLeft;
t.colContentRight = colContentRight;
t.dayOfWeekCol = dayOfWeekCol;
t.dateCell = dateCell;
t.cellDate = cellDate;
t.cellIsAllDay = function() { return true };
t.getIsCellAllDay = function() { return true };
t.allDayRow = allDayRow;
t.allDayBounds = allDayBounds;
t.getRowCnt = function() { return rowCnt };
t.getColCnt = function() { return colCnt };
t.getColWidth = function() { return colWidth };
@@ -46,6 +44,9 @@ function BasicView(element, calendar, viewName) {
var renderOverlay = t.renderOverlay;
var clearOverlays = t.clearOverlays;
var daySelectionMousedown = t.daySelectionMousedown;
var cellToDate = t.cellToDate;
var dateToCell = t.dateToCell;
var rangeToSegments = t.rangeToSegments;
var formatDate = calendar.formatDate;
@@ -58,7 +59,8 @@ function BasicView(element, calendar, viewName) {
var bodyRows;
var bodyCells;
var bodyFirstCells;
var bodyCellTopInners;
var firstRowCellInners;
var firstRowCellContentInners;
var daySegmentContainer;
var viewWidth;
@@ -67,13 +69,12 @@ function BasicView(element, calendar, viewName) {
var weekNumberWidth;
var rowCnt, colCnt;
var showNumbers;
var coordinateGrid;
var hoverListener;
var colPositions;
var colContentPositions;
var rtl, dis, dit;
var firstDay;
var nwe; // no weekends? a 0 or 1 for easy computations
var tm;
var colFormat;
var showWeekNumbers;
@@ -89,9 +90,10 @@ function BasicView(element, calendar, viewName) {
disableTextSelection(element.addClass('fc-grid'));
function renderBasic(r, c, showNumbers) {
rowCnt = r;
colCnt = c;
function renderBasic(_rowCnt, _colCnt, _showNumbers) {
rowCnt = _rowCnt;
colCnt = _colCnt;
showNumbers = _showNumbers;
updateOptions();
var firstTime = !body;
if (firstTime) {
@@ -99,22 +101,11 @@ function BasicView(element, calendar, viewName) {
}else{
clearEvents();
}
buildTable(showNumbers);
buildTable();
}
function updateOptions() {
rtl = opt('isRTL');
if (rtl) {
dis = -1;
dit = colCnt - 1;
}else{
dis = 1;
dit = 0;
}
firstDay = opt('firstDay');
nwe = opt('weekends') ? 0 : 1;
tm = opt('theme') ? 'ui' : 'fc';
colFormat = opt('columnFormat');
@@ -130,7 +121,6 @@ function BasicView(element, calendar, viewName) {
}
function buildEventContainer() {
daySegmentContainer =
$("<div style='position:absolute;z-index:8;top:0;left:0'/>")
@@ -138,79 +128,8 @@ function BasicView(element, calendar, viewName) {
}
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 cellDate; // not to be confused with local function. TODO: better names
var cellClasses;
var cell;
html += "<table class='fc-border-separate' style='width:100%' cellspacing='0'>" +
"<thead>" +
"<tr>";
if (showWeekNumbers) {
html += "<th class='fc-week-number " + headerClass + "'/>";
}
for (i=0; i<colCnt; i++) {
cellDate = _cellDate(0, i); // a little confusing. cellDate is local variable. _cellDate is private function
html += "<th class='fc-day-header fc-" + dayIDs[cellDate.getDay()] + " " + headerClass + "'/>";
}
html += "</tr>" +
"</thead>" +
"<tbody>";
for (i=0; i<rowCnt; i++) {
html += "<tr class='fc-week'>";
if (showWeekNumbers) {
html += "<td class='fc-week-number " + contentClass + "'>" +
"<div/>" +
"</td>";
}
for (j=0; j<colCnt; j++) {
cellDate = _cellDate(i, j); // a little confusing. cellDate is local variable. _cellDate is private function
cellClasses = [
'fc-day',
'fc-' + dayIDs[cellDate.getDay()],
contentClass
];
if (cellDate.getMonth() != month) {
cellClasses.push('fc-other-month');
}
if (+cellDate == +today) {
cellClasses.push('fc-today');
cellClasses.push(tm + '-state-highlight');
}
html += "<td" +
" class='" + cellClasses.join(' ') + "'" +
" data-date='" + formatDate(cellDate, 'yyyy-MM-dd') + "'" +
">" +
"<div>";
if (showNumbers) {
html += "<div class='fc-day-number'>" + cellDate.getDate() + "</div>";
}
html += "<div class='fc-day-content'>" +
"<div style='position:relative'>&nbsp;</div>" +
"</div>" +
"</div>" +
"</td>";
}
html += "</tr>";
}
html += "</tbody>" +
"</table>";
function buildTable() {
var html = buildTableHTML();
lockHeight(); // the unlock happens later, in setHeight()...
if (table) {
@@ -224,37 +143,155 @@ function BasicView(element, calendar, viewName) {
bodyRows = body.find('tr');
bodyCells = body.find('.fc-day');
bodyFirstCells = bodyRows.find('td:first-child');
bodyCellTopInners = bodyRows.eq(0).find('.fc-day-content > div');
firstRowCellInners = bodyRows.eq(0).find('.fc-day > div');
firstRowCellContentInners = 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');
if (showWeekNumbers) {
head.find('.fc-week-number').text(weekNumberTitle);
}
headCells.each(function(i, _cell) {
var date = indexDate(i);
$(_cell).text(formatDate(date, colFormat));
});
if (showWeekNumbers) {
body.find('.fc-week-number > div').each(function(i, _cell) {
var weekStart = _cellDate(i, 0);
$(_cell).text(formatDate(weekStart, weekNumberFormat));
});
}
bodyCells.each(function(i, _cell) {
var date = indexDate(i);
var date = cellToDate(
Math.floor(i / colCnt),
i % colCnt
);
trigger('dayRender', t, date, $(_cell));
});
dayBind(bodyCells);
}
/* HTML Building
-----------------------------------------------------------*/
function buildTableHTML() {
var html =
"<table class='fc-border-separate' style='width:100%' cellspacing='0'>" +
buildHeadHTML() +
buildBodyHTML() +
"</table>";
return html;
}
function buildHeadHTML() {
var headerClass = tm + "-widget-header";
var html = '';
var col;
var date;
html += "<thead><tr>";
if (showWeekNumbers) {
html +=
"<th class='fc-week-number " + headerClass + "'>" +
htmlEscape(weekNumberTitle) +
"</th>";
}
for (col=0; col<colCnt; col++) {
date = cellToDate(0, col);
html +=
"<th class='fc-day-header fc-" + dayIDs[date.getDay()] + " " + headerClass + "'>" +
htmlEscape(formatDate(date, colFormat)) +
"</th>";
}
html += "</tr></thead>";
return html;
}
function buildBodyHTML() {
var contentClass = tm + "-widget-content";
var html = '';
var row;
var col;
var date;
html += "<tbody>";
for (row=0; row<rowCnt; row++) {
html += "<tr class='fc-week'>";
if (showWeekNumbers) {
date = cellToDate(row, 0);
html +=
"<td class='fc-week-number " + contentClass + "'>" +
"<div>" +
htmlEscape(formatDate(date, weekNumberFormat)) +
"</div>" +
"</td>";
}
for (col=0; col<colCnt; col++) {
date = cellToDate(row, col);
html += buildCellHTML(date);
}
html += "</tr>";
}
html += "</tbody>";
return html;
}
function buildCellHTML(date) {
var contentClass = tm + "-widget-content";
var month = t.start.getMonth();
var today = clearTime(new Date());
var html = '';
var classNames = [
'fc-day',
'fc-' + dayIDs[date.getDay()],
contentClass
];
if (date.getMonth() != month) {
classNames.push('fc-other-month');
}
if (+date == +today) {
classNames.push(
'fc-today',
tm + '-state-highlight'
);
}
html +=
"<td" +
" class='" + classNames.join(' ') + "'" +
" data-date='" + formatDate(date, 'yyyy-MM-dd') + "'" +
">" +
"<div>";
if (showNumbers) {
html += "<div class='fc-day-number'>" + date.getDate() + "</div>";
}
html +=
"<div class='fc-day-content'>" +
"<div style='position:relative'>&nbsp;</div>" +
"</div>" +
"</div>" +
"</td>";
return html;
}
/* Dimensions
-----------------------------------------------------------*/
function setHeight(height) {
@@ -288,6 +325,7 @@ function BasicView(element, calendar, viewName) {
function setWidth(width) {
viewWidth = width;
colPositions.clear();
colContentPositions.clear();
weekNumberWidth = 0;
@@ -322,35 +360,30 @@ function BasicView(element, calendar, viewName) {
/* Semi-transparent Overlay Helpers
------------------------------------------------------*/
// TODO: should be consolidated with AgendaView's methods
function renderDayOverlay(overlayStart, overlayEnd, refreshCoordinateGrid) { // overlayEnd is exclusive
if (refreshCoordinateGrid) {
coordinateGrid.build();
}
var rowStart = cloneDate(t.visStart);
var rowEnd = addDays(cloneDate(rowStart), colCnt);
for (var i=0; i<rowCnt; i++) {
var stretchStart = new Date(Math.max(rowStart, overlayStart));
var stretchEnd = new Date(Math.min(rowEnd, overlayEnd));
if (stretchStart < stretchEnd) {
var colStart, colEnd;
if (rtl) {
colStart = dayDiff(stretchEnd, rowStart)*dis+dit+1;
colEnd = dayDiff(stretchStart, rowStart)*dis+dit+1;
}else{
colStart = dayDiff(stretchStart, rowStart);
colEnd = dayDiff(stretchEnd, rowStart);
}
dayBind(
renderCellOverlay(i, colStart, i, colEnd-1)
);
}
addDays(rowStart, 7);
addDays(rowEnd, 7);
var segments = rangeToSegments(overlayStart, overlayEnd);
for (var i=0; i<segments.length; i++) {
var segment = segments[i];
dayBind(
renderCellOverlay(
segment.row,
segment.leftCol,
segment.row,
segment.rightCol
)
);
}
}
function renderCellOverlay(row0, col0, row1, col1) { // row1,col1 is inclusive
var rect = coordinateGrid.rect(row0, col0, row1, col1, element);
@@ -379,7 +412,7 @@ function BasicView(element, calendar, viewName) {
function reportDayClick(date, allDay, ev) {
var cell = dateCell(date);
var cell = dateToCell(date);
var _element = bodyCells[cell.row*colCnt + cell.col];
trigger('dayClick', _element, date, allDay, ev);
}
@@ -404,7 +437,7 @@ function BasicView(element, calendar, viewName) {
var cell = hoverListener.stop();
clearOverlays();
if (cell) {
var d = cellDate(cell);
var d = cellToDate(cell);
trigger('drop', _dragElement, d, true, ev, ui);
}
}
@@ -449,10 +482,23 @@ function BasicView(element, calendar, viewName) {
hoverListener = new HoverListener(coordinateGrid);
colContentPositions = new HorizontalPositionCache(function(col) {
return bodyCellTopInners.eq(col);
colPositions = new HorizontalPositionCache(function(col) {
return firstRowCellInners.eq(col);
});
colContentPositions = new HorizontalPositionCache(function(col) {
return firstRowCellContentInners.eq(col);
});
function colLeft(col) {
return colPositions.left(col);
}
function colRight(col) {
return colPositions.right(col);
}
function colContentLeft(col) {
@@ -465,54 +511,9 @@ function BasicView(element, calendar, viewName) {
}
function dateCell(date) {
return {
row: Math.floor(dayDiff(date, t.visStart) / 7),
col: dayOfWeekCol(date.getDay())
};
}
function cellDate(cell) {
return _cellDate(cell.row, cell.col);
}
function _cellDate(row, col) {
return addDays(cloneDate(t.visStart), row*7 + col*dis+dit);
// what about weekends in middle of week?
}
function indexDate(index) {
return _cellDate(Math.floor(index/colCnt), index%colCnt);
}
function dayOfWeekCol(dayOfWeek) {
return ((dayOfWeek - Math.max(firstDay, nwe) + colCnt) % colCnt) * dis + dit;
}
function allDayRow(i) {
return bodyRows.eq(i);
}
function allDayBounds(i) {
var left = 0;
if (showWeekNumbers) {
left += weekNumberWidth;
}
return {
left: left,
right: viewWidth
};
}
+18 -11
View File
@@ -13,33 +13,40 @@ function BasicWeekView(element, calendar) {
BasicView.call(t, element, calendar, 'basicWeek');
var opt = t.opt;
var renderBasic = t.renderBasic;
var skipHiddenDays = t.skipHiddenDays;
var getCellsPerWeek = t.getCellsPerWeek;
var formatDates = calendar.formatDates;
function render(date, delta) {
if (delta) {
addDays(date, delta * 7);
}
var start = addDays(cloneDate(date), -((date.getDay() - opt('firstDay') + 7) % 7));
var end = addDays(cloneDate(start), 7);
var visStart = cloneDate(start);
skipHiddenDays(visStart);
var visEnd = cloneDate(end);
var weekends = opt('weekends');
if (!weekends) {
skipWeekend(visStart);
skipWeekend(visEnd, -1, true);
}
skipHiddenDays(visEnd, -1, true);
var colCnt = getCellsPerWeek();
t.start = start;
t.end = end;
t.visStart = visStart;
t.visEnd = visEnd;
t.title = formatDates(
visStart,
addDays(cloneDate(visEnd), -1),
opt('titleFormat')
);
t.start = start;
t.end = end;
t.visStart = visStart;
t.visEnd = visEnd;
renderBasic(1, weekends ? 7 : 5, false);
renderBasic(1, colCnt, false);
}
+22 -12
View File
@@ -13,39 +13,49 @@ function MonthView(element, calendar) {
BasicView.call(t, element, calendar, 'month');
var opt = t.opt;
var renderBasic = t.renderBasic;
var skipHiddenDays = t.skipHiddenDays;
var getCellsPerWeek = t.getCellsPerWeek;
var formatDate = calendar.formatDate;
function render(date, delta) {
if (delta) {
addMonths(date, delta);
date.setDate(1);
}
var firstDay = opt('firstDay');
var start = cloneDate(date, true);
start.setDate(1);
var end = addMonths(cloneDate(start), 1);
var visStart = cloneDate(start);
addDays(visStart, -((visStart.getDay() - firstDay + 7) % 7));
skipHiddenDays(visStart);
var visEnd = cloneDate(end);
var firstDay = opt('firstDay');
var nwe = opt('weekends') ? 0 : 1;
if (nwe) {
skipWeekend(visStart);
skipWeekend(visEnd, -1, true);
}
addDays(visStart, -((visStart.getDay() - Math.max(firstDay, nwe) + 7) % 7));
addDays(visEnd, (7 - visEnd.getDay() + Math.max(firstDay, nwe)) % 7);
var rowCnt = Math.round((visEnd - visStart) / (DAY_MS * 7));
addDays(visEnd, (7 - visEnd.getDay() + firstDay) % 7);
skipHiddenDays(visEnd, -1, true);
var colCnt = getCellsPerWeek();
var rowCnt = Math.round(dayDiff(visEnd, visStart) / 7); // should be no need for Math.round
if (opt('weekMode') == 'fixed') {
addDays(visEnd, (6 - rowCnt) * 7);
addDays(visEnd, (6 - rowCnt) * 7); // add weeks to make up for it
rowCnt = 6;
}
t.title = formatDate(start, opt('titleFormat'));
t.start = start;
t.end = end;
t.visStart = visStart;
t.visEnd = visEnd;
renderBasic(rowCnt, nwe ? 5 : 7, true);
renderBasic(rowCnt, colCnt, true);
}