DayTable

src/basic/BasicView.ts

@@ -138,7 +138,15 @@ export default class BasicView extends View {
 
 
   sliceDayDates = reselector(function(slicer: DayGridSlicer) { // TODO: put into slicer
-    return slicer.daySeries.dates.slice(0, slicer.colCnt)
+    let dates = []
+
+    for (let col = 0; col < slicer.colCnt; col++) {
+      dates.push(
+        slicer.getCellDate(0, col)
+      )
+    }
+
+    return dates
   })
 
 
@@ -327,7 +335,7 @@ export default class BasicView extends View {
         '<td class="fc-week-number">' +
           buildGotoAnchorHtml( // aside from link, important for matchCellWidths
             this,
-            { date: weekStart, type: 'week', forceOff: slicer.daySeries.dates.length === 1 },
+            { date: weekStart, type: 'week', forceOff: slicer.colCnt === 1 },
             dateEnv.format(weekStart, WEEK_NUM_FORMAT) // inner HTML
           ) +
         '</td>'

src/basic/DayGrid.ts

@@ -84,7 +84,10 @@ export default class DayGrid extends StandardDateComponent {
   rangeToSegs(range: DateRange): Seg[] {
     let slicer = (this.props as any).slicer as DayGridSlicer
 
-    return slicer.rangeToSegs(range)
+    return slicer.rangeToSegs(range).map((seg) => {
+      seg.component = this
+      return seg
+    })
   }
 
 
@@ -128,6 +131,10 @@ export default class DayGrid extends StandardDateComponent {
     this.rowEls = findElements(this.el, '.fc-row')
     this.cellEls = findElements(this.el, '.fc-day, .fc-disabled-day')
 
+    if (this.isRtl) {
+      this.cellEls.reverse()
+    }
+
     this.rowPositions = new PositionCache(
       this.el,
       this.rowEls,
@@ -167,17 +174,18 @@ export default class DayGrid extends StandardDateComponent {
   renderDayRowHtml(row, isRigid) {
     let { theme } = this
     let slicer = (this.props as any).slicer as DayGridSlicer
-    let { daysPerRow } = slicer
     let classes = [ 'fc-row', 'fc-week', theme.getClass('dayRow') ]
 
     if (isRigid) {
       classes.push('fc-rigid')
     }
 
-    let dates = slicer.daySeries.dates.slice(
-      row * daysPerRow,
-      (row + 1) * daysPerRow
-    )
+    let dates = []
+    for (let col = 0; col < slicer.colCnt; col++) {
+      dates.push(
+        slicer.getCellDate(row, col)
+      )
+    }
 
     let bgRow = new DayBgRow(this.context)
 
@@ -247,6 +255,10 @@ export default class DayGrid extends StandardDateComponent {
       htmls.push(this.renderNumberCellHtml(date))
     }
 
+    if (this.isRtl) {
+      htmls.reverse()
+    }
+
     return htmls.join('')
   }
 

src/basic/DayGridSlicer.ts

@@ -3,108 +3,55 @@ import DateProfileGenerator, { DateProfile } from '../DateProfileGenerator'
 import { Seg } from '../component/DateComponent'
 import { addDays, DateMarker } from '../datelib/marker'
 import DaySeries from '../common/DaySeries'
-
+import DayTable from '../common/DayTable'
 
 export default class DayGridSlicer {
 
+  dayTable: DayTable
   dateProfile: DateProfile
-  daySeries: DaySeries
-  daysPerRow: number
   isRtl: boolean
   rowCnt: number
   colCnt: number
 
 
   constructor(dateProfile: DateProfile, dateProfileGenerator: DateProfileGenerator, isRtl: boolean, breakOnWeeks: boolean) {
     let daySeries = new DaySeries(dateProfile.renderRange, dateProfileGenerator)
-    let { dates } = daySeries
-    let daysPerRow
-    let firstDay
-    let rowCnt
-
-    if (breakOnWeeks) {
-      // count columns until the day-of-week repeats
-      firstDay = dates[0].getUTCDay()
-      for (daysPerRow = 1; daysPerRow < dates.length; daysPerRow++) {
-        if (dates[daysPerRow].getUTCDay() === firstDay) {
-          break
-        }
-      }
-      rowCnt = Math.ceil(dates.length / daysPerRow)
-    } else {
-      rowCnt = 1
-      daysPerRow = dates.length
-    }
+    let dayTable = new DayTable(daySeries, breakOnWeeks)
 
+    this.dayTable = dayTable
+    this.rowCnt = dayTable.rowCnt
+    this.colCnt = dayTable.colCnt
     this.dateProfile = dateProfile
-    this.daySeries = daySeries
-    this.daysPerRow = daysPerRow
     this.isRtl = isRtl
-    this.rowCnt = rowCnt
-    this.colCnt = daysPerRow
   }
 
 
   // Slices up the given span (unzoned start/end with other misc data) into an array of segments
   rangeToSegs(range: DateRange): Seg[] {
+    let colCnt = this.dayTable.colCnt
 
     range = intersectRanges(range, this.dateProfile.validRange)
 
     if (range) {
-      let segs = this.sliceRangeByRow(range)
-
-      for (let i = 0; i < segs.length; i++) {
-        let seg = segs[i]
-        seg.component = this
-
-        if (this.isRtl) {
-          seg.leftCol = this.daysPerRow - 1 - seg.lastRowDayIndex
-          seg.rightCol = this.daysPerRow - 1 - seg.firstRowDayIndex
-        } else {
-          seg.leftCol = seg.firstRowDayIndex
-          seg.rightCol = seg.lastRowDayIndex
-        }
-      }
-
-      return segs
-    } else {
-      return []
-    }
-  }
-
-
-  sliceRangeByRow(range) {
-    let { daysPerRow } = this
-    let seriesSeg = this.daySeries.sliceRange(range)
-    let segs = []
-
-    if (seriesSeg) {
-      let { firstIndex, lastIndex } = seriesSeg
-      let index = firstIndex
-
-      while (index <= lastIndex) {
-        let row = Math.floor(index / daysPerRow)
-        let nextIndex = Math.min((row + 1) * daysPerRow, lastIndex + 1)
-
-        segs.push({
-          row,
-          firstRowDayIndex: index % daysPerRow,
-          lastRowDayIndex: (nextIndex - 1) % daysPerRow,
-          isStart: seriesSeg.isStart && index === firstIndex,
-          isEnd: seriesSeg.isEnd && (nextIndex - 1) === lastIndex
+      return this.dayTable.sliceRange(range)
+        .map((dayTableSeg) => {
+          return {
+            isStart: dayTableSeg.isStart,
+            isEnd: dayTableSeg.isEnd,
+            row: dayTableSeg.row,
+            leftCol: this.isRtl ? (colCnt - 1 - dayTableSeg.lastCol) : dayTableSeg.firstCol,
+            rightCol: this.isRtl ? (colCnt - 1 - dayTableSeg.firstCol) : dayTableSeg.lastCol
+          }
         })
-
-        index = nextIndex
-      }
     }
 
-    return segs
+    return []
   }
 
 
   // Computes the DateMarker for the given cell
   getCellDate(row, col): DateMarker {
-    return this.daySeries.dates[this.getCellDayIndex(row, col)]
+    return this.dayTable.getDate(row, col)
   }
 
 
@@ -117,19 +64,4 @@ export default class DayGridSlicer {
   }
 
 
-  // Returns the number of day cells, chronologically, from the first of the grid (0-based)
-  private getCellDayIndex(row, col) {
-    return row * this.daysPerRow + this.getColDayIndex(col)
-  }
-
-
-  // Returns the numner of day cells, chronologically, from the first cell in *any given row*
-  private getColDayIndex(col) {
-    if (this.isRtl) {
-      return this.colCnt - 1 - col
-    } else {
-      return col
-    }
-  }
-
 }

src/common/DaySeries.ts

@@ -12,8 +12,6 @@ export interface DaySeriesSeg {
 export default class DaySeries {
 
   cnt: number
-
-  // TODO: make private
   dates: DateMarker[] // whole-day dates for each column. left to right
   indices: number[] // for each day from start, the offset
 

src/common/DayTable.ts

@@ -0,0 +1,75 @@
+import DaySeries from './DaySeries'
+import { DateRange } from '../datelib/date-range'
+
+export interface DayTableSeg {
+  row: number
+  firstCol: number
+  lastCol: number
+  isStart: boolean
+  isEnd: boolean
+}
+
+export default class DayTable {
+
+  rowCnt: number
+  colCnt: number
+  private daySeries: DaySeries
+
+  constructor(daySeries: DaySeries, breakOnWeeks: boolean) {
+    let { dates } = daySeries
+    let daysPerRow
+    let firstDay
+    let rowCnt
+
+    if (breakOnWeeks) {
+      // count columns until the day-of-week repeats
+      firstDay = dates[0].getUTCDay()
+      for (daysPerRow = 1; daysPerRow < dates.length; daysPerRow++) {
+        if (dates[daysPerRow].getUTCDay() === firstDay) {
+          break
+        }
+      }
+      rowCnt = Math.ceil(dates.length / daysPerRow)
+    } else {
+      rowCnt = 1
+      daysPerRow = dates.length
+    }
+
+    this.rowCnt = rowCnt
+    this.colCnt = daysPerRow
+    this.daySeries = daySeries
+  }
+
+  getDate(row: number, col: number) {
+    return this.daySeries.dates[row * this.colCnt + col]
+  }
+
+  sliceRange(range: DateRange): DayTableSeg[] {
+    let { colCnt } = this
+    let seriesSeg = this.daySeries.sliceRange(range)
+    let segs: DayTableSeg[] = []
+
+    if (seriesSeg) {
+      let { firstIndex, lastIndex } = seriesSeg
+      let index = firstIndex
+
+      while (index <= lastIndex) {
+        let row = Math.floor(index / colCnt)
+        let nextIndex = Math.min((row + 1) * colCnt, lastIndex + 1)
+
+        segs.push({
+          row,
+          firstCol: index % colCnt,
+          lastCol: (nextIndex - 1) % colCnt,
+          isStart: seriesSeg.isStart && index === firstIndex,
+          isEnd: seriesSeg.isEnd && (nextIndex - 1) === lastIndex
+        })
+
+        index = nextIndex
+      }
+    }
+
+    return segs
+  }
+
+}

src/component/DateComponent.ts

@@ -18,7 +18,7 @@ export type DateComponentHash = { [uid: string]: DateComponent<any> }
 // NOTE: for fg-events, eventRange.range is NOT sliced,
 // thus, we need isStart/isEnd
 export interface Seg {
-  component: DateComponent<any>
+  component?: DateComponent<any>
   isStart: boolean
   isEnd: boolean
   eventRange?: EventRenderRange