Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
/* An abstract class for all timegrid-related views. Displays one more columns with time slots running vertically.
----------------------------------------------------------------------------------------------------------------------*/
// Is a manager for the TimeGrid subcomponent and possibly the DayGrid subcomponent (if allDaySlot is on).
// Responsible for managing width/height.
export default abstract class AbstractTimeGridView extends View {
timeGrid: TimeGrid // the main time-grid subcomponent of this view
dayGrid: DayGrid // the "all-day" subcomponent. if all-day is turned off, this will be null
scroller: ScrollComponent
axisWidth: any // the width of the time axis running down the side
protected splitter = new AllDaySplitter()
private renderSkeleton = memoizeRendering(this._renderSkeleton, this._unrenderSkeleton)
render(props: ViewProps, context: ComponentContext) {
super.render(props, context)
this.renderSkeleton(context)
}
destroy() {
super.destroy()
this.renderSkeleton.unrender()
}
function DayGrid(context, el, renderProps) {
var _this = _super.call(this, context, el) || this;
_this.bottomCoordPadding = 0; // hack for extending the hit area for the last row of the coordinate grid
_this.isCellSizesDirty = false;
var eventRenderer = _this.eventRenderer = new DayGridEventRenderer(_this);
var fillRenderer = _this.fillRenderer = new DayGridFillRenderer(_this);
_this.mirrorRenderer = new DayGridMirrorRenderer(_this);
var renderCells = _this.renderCells = memoizeRendering(_this._renderCells, _this._unrenderCells);
_this.renderBusinessHours = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'businessHours'), fillRenderer.unrender.bind(fillRenderer, 'businessHours'), [renderCells]);
_this.renderDateSelection = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'highlight'), fillRenderer.unrender.bind(fillRenderer, 'highlight'), [renderCells]);
_this.renderBgEvents = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'bgEvent'), fillRenderer.unrender.bind(fillRenderer, 'bgEvent'), [renderCells]);
_this.renderFgEvents = memoizeRendering(eventRenderer.renderSegs.bind(eventRenderer), eventRenderer.unrender.bind(eventRenderer), [renderCells]);
_this.renderEventSelection = memoizeRendering(eventRenderer.selectByInstanceId.bind(eventRenderer), eventRenderer.unselectByInstanceId.bind(eventRenderer), [_this.renderFgEvents]);
_this.renderEventDrag = memoizeRendering(_this._renderEventDrag, _this._unrenderEventDrag, [renderCells]);
_this.renderEventResize = memoizeRendering(_this._renderEventResize, _this._unrenderEventResize, [renderCells]);
_this.renderProps = renderProps;
return _this;
}
DayGrid.prototype.render = function (props) {
isColSizesDirty: boolean = false
rootBgContainerEl: HTMLElement
bottomRuleEl: HTMLElement // hidden by default
contentSkeletonEl: HTMLElement
colContainerEls: HTMLElement[] // containers for each column
// inner-containers for each column where different types of segs live
fgContainerEls: HTMLElement[]
bgContainerEls: HTMLElement[]
mirrorContainerEls: HTMLElement[]
highlightContainerEls: HTMLElement[]
businessContainerEls: HTMLElement[]
private processOptions = memoize(this._processOptions)
private renderSkeleton = memoizeRendering(this._renderSkeleton)
private renderSlats = memoizeRendering(this._renderSlats, null, [ this.renderSkeleton ])
private renderColumns = memoizeRendering(this._renderColumns, this._unrenderColumns, [ this.renderSkeleton ])
private renderBusinessHours: MemoizedRendering<[ComponentContext, TimeGridSeg[]]>
private renderDateSelection: MemoizedRendering<[TimeGridSeg[]]>
private renderBgEvents: MemoizedRendering<[ComponentContext, TimeGridSeg[]]>
private renderFgEvents: MemoizedRendering<[ComponentContext, TimeGridSeg[]]>
private renderEventSelection: MemoizedRendering<[string]>
private renderEventDrag: MemoizedRendering<[EventSegUiInteractionState]>
private renderEventResize: MemoizedRendering<[EventSegUiInteractionState]>
constructor(el: HTMLElement, renderProps: RenderProps) {
super(el)
this.renderProps = renderProps
function TimeGrid(context, el, renderProps) {
var _this = _super.call(this, context, el) || this;
_this.isSlatSizesDirty = false;
_this.isColSizesDirty = false;
_this.renderSlats = memoizeRendering(_this._renderSlats);
var eventRenderer = _this.eventRenderer = new TimeGridEventRenderer(_this);
var fillRenderer = _this.fillRenderer = new TimeGridFillRenderer(_this);
_this.mirrorRenderer = new TimeGridMirrorRenderer(_this);
var renderColumns = _this.renderColumns = memoizeRendering(_this._renderColumns, _this._unrenderColumns);
_this.renderBusinessHours = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'businessHours'), fillRenderer.unrender.bind(fillRenderer, 'businessHours'), [renderColumns]);
_this.renderDateSelection = memoizeRendering(_this._renderDateSelection, _this._unrenderDateSelection, [renderColumns]);
_this.renderFgEvents = memoizeRendering(eventRenderer.renderSegs.bind(eventRenderer), eventRenderer.unrender.bind(eventRenderer), [renderColumns]);
_this.renderBgEvents = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'bgEvent'), fillRenderer.unrender.bind(fillRenderer, 'bgEvent'), [renderColumns]);
_this.renderEventSelection = memoizeRendering(eventRenderer.selectByInstanceId.bind(eventRenderer), eventRenderer.unselectByInstanceId.bind(eventRenderer), [_this.renderFgEvents]);
_this.renderEventDrag = memoizeRendering(_this._renderEventDrag, _this._unrenderEventDrag, [renderColumns]);
_this.renderEventResize = memoizeRendering(_this._renderEventResize, _this._unrenderEventResize, [renderColumns]);
_this.processOptions();
el.innerHTML =
'<div class="fc-bg"></div>' +
'<div class="fc-slats"></div>' +
'<hr style="display:none" class="fc-divider ' + _this.theme.getClass('widgetHeader') + '">';
_this.rootBgContainerEl = el.querySelector('.fc-bg');
_this.slatContainerEl = el.querySelector('.fc-slats');
_this.bottomRuleEl = el.querySelector('.fc-divider');
_this.renderProps = renderProps;
return _this;
}
/* Options
/* An abstract class for the daygrid views, as well as month view. Renders one or more rows of day cells.
----------------------------------------------------------------------------------------------------------------------*/
// It is a manager for a DayGrid subcomponent, which does most of the heavy lifting.
// It is responsible for managing width/height.
export default abstract class AbstractDayGridView extends View {
scroller: ScrollComponent
dayGrid: DayGrid // the main subcomponent that does most of the heavy lifting
colWeekNumbersVisible: boolean
cellWeekNumbersVisible: boolean
weekNumberWidth: number
private processOptions = memoize(this._processOptions)
private renderSkeleton = memoizeRendering(this._renderSkeleton, this._unrenderSkeleton)
_processOptions(options) {
if (options.weekNumbers) {
if (options.weekNumbersWithinDays) {
this.cellWeekNumbersVisible = true
this.colWeekNumbersVisible = false
} else {
this.cellWeekNumbersVisible = false
this.colWeekNumbersVisible = true
}
} else {
this.colWeekNumbersVisible = false
this.cellWeekNumbersVisible = false
}
}
function DayGrid(context, el, renderProps) {
var _this = _super.call(this, context, el) || this;
_this.bottomCoordPadding = 0; // hack for extending the hit area for the last row of the coordinate grid
_this.isCellSizesDirty = false;
var eventRenderer = _this.eventRenderer = new DayGridEventRenderer(_this);
var fillRenderer = _this.fillRenderer = new DayGridFillRenderer(_this);
_this.mirrorRenderer = new DayGridMirrorRenderer(_this);
var renderCells = _this.renderCells = memoizeRendering(_this._renderCells, _this._unrenderCells);
_this.renderBusinessHours = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'businessHours'), fillRenderer.unrender.bind(fillRenderer, 'businessHours'), [renderCells]);
_this.renderDateSelection = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'highlight'), fillRenderer.unrender.bind(fillRenderer, 'highlight'), [renderCells]);
_this.renderBgEvents = memoizeRendering(fillRenderer.renderSegs.bind(fillRenderer, 'bgEvent'), fillRenderer.unrender.bind(fillRenderer, 'bgEvent'), [renderCells]);
_this.renderFgEvents = memoizeRendering(eventRenderer.renderSegs.bind(eventRenderer), eventRenderer.unrender.bind(eventRenderer), [renderCells]);
_this.renderEventSelection = memoizeRendering(eventRenderer.selectByInstanceId.bind(eventRenderer), eventRenderer.unselectByInstanceId.bind(eventRenderer), [_this.renderFgEvents]);
_this.renderEventDrag = memoizeRendering(_this._renderEventDrag, _this._unrenderEventDrag, [renderCells]);
_this.renderEventResize = memoizeRendering(_this._renderEventResize, _this._unrenderEventResize, [renderCells]);
_this.renderProps = renderProps;
return _this;
}
DayGrid.prototype.render = function (props) {
constructor(el: HTMLElement) {
super(el)
let eventRenderer = this.eventRenderer = new DayTileEventRenderer(this)
let renderFrame = this.renderFrame = memoizeRendering(
this._renderFrame
)
this.renderFgEvents = memoizeRendering(
eventRenderer.renderSegs.bind(eventRenderer),
eventRenderer.unrender.bind(eventRenderer),
[ renderFrame ]
)
this.renderEventSelection = memoizeRendering(
eventRenderer.selectByInstanceId.bind(eventRenderer),
eventRenderer.unselectByInstanceId.bind(eventRenderer),
[ this.renderFgEvents ]
)
this.renderEventDrag = memoizeRendering(
constructor(el, renderProps: RenderProps) {
super(el)
this.renderProps = renderProps
let eventRenderer = this.eventRenderer = new DayGridEventRenderer(this)
let fillRenderer = this.fillRenderer = new DayGridFillRenderer(this)
this.mirrorRenderer = new DayGridMirrorRenderer(this)
let renderCells = this.renderCells = memoizeRendering(
this._renderCells,
this._unrenderCells
)
this.renderBusinessHours = memoizeRendering(
fillRenderer.renderSegs.bind(fillRenderer, 'businessHours'),
fillRenderer.unrender.bind(fillRenderer, 'businessHours'),
[ renderCells ]
)
this.renderDateSelection = memoizeRendering(
fillRenderer.renderSegs.bind(fillRenderer, 'highlight'),
fillRenderer.unrender.bind(fillRenderer, 'highlight'),
[ renderCells ]
)
this.renderBgEvents = memoizeRendering(
fillRenderer.renderSegs.bind(fillRenderer, 'bgEvent'),
fillRenderer.unrender.bind(fillRenderer, 'bgEvent'),
[ renderCells ]
)
function DayTile(context, el) {
var _this = _super.call(this, context, el) || this;
var eventRenderer = _this.eventRenderer = new DayTileEventRenderer(_this);
var renderFrame = _this.renderFrame = memoizeRendering(_this._renderFrame);
_this.renderFgEvents = memoizeRendering(eventRenderer.renderSegs.bind(eventRenderer), eventRenderer.unrender.bind(eventRenderer), [renderFrame]);
_this.renderEventSelection = memoizeRendering(eventRenderer.selectByInstanceId.bind(eventRenderer), eventRenderer.unselectByInstanceId.bind(eventRenderer), [_this.renderFgEvents]);
_this.renderEventDrag = memoizeRendering(eventRenderer.hideByHash.bind(eventRenderer), eventRenderer.showByHash.bind(eventRenderer), [renderFrame]);
_this.renderEventResize = memoizeRendering(eventRenderer.hideByHash.bind(eventRenderer), eventRenderer.showByHash.bind(eventRenderer), [renderFrame]);
context.calendar.registerInteractiveComponent(_this, {
el: _this.el,
useEventCenter: false
});
return _this;
}
DayTile.prototype.render = function (props) {
[ renderCells ]
)
this.renderBgEvents = memoizeRendering(
fillRenderer.renderSegs.bind(fillRenderer, 'bgEvent'),
fillRenderer.unrender.bind(fillRenderer, 'bgEvent'),
[ renderCells ]
)
this.renderFgEvents = memoizeRendering(
eventRenderer.renderSegs.bind(eventRenderer),
eventRenderer.unrender.bind(eventRenderer),
[ renderCells ]
)
this.renderEventSelection = memoizeRendering(
eventRenderer.selectByInstanceId.bind(eventRenderer),
eventRenderer.unselectByInstanceId.bind(eventRenderer),
[ this.renderFgEvents ]
)
this.renderEventDrag = memoizeRendering(
this._renderEventDrag,
this._unrenderEventDrag,
[ renderCells ]
)
this.renderEventResize = memoizeRendering(
this._renderEventResize,
this._unrenderEventResize,
[ renderCells ]
)