Skip to content

Commit

Permalink
added code from master of event sort for multi day (jquense#2502)
Browse files Browse the repository at this point in the history
  • Loading branch information
mikeyyyzhao committed Feb 10, 2024
1 parent f6f8b15 commit 69ffcfb
Show file tree
Hide file tree
Showing 6 changed files with 78 additions and 14 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "rbc-fork-react-big-calendar",
"version": "0.33.12",
"version": "0.33.16",
"description": "Calendar! with events",
"author": {
"name": "Jason Quense",
Expand Down
6 changes: 3 additions & 3 deletions src/Month.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import Overlay from 'react-overlays/Overlay'
import DateContentRow from './DateContentRow'
import Header from './Header'
import DateHeader from './DateHeader'
import { inRange, sortEvents } from './utils/eventLevels'
import { inRange, sortWeekEvents } from './utils/eventLevels'

let eventsForWeek = (evts, start, end, accessors, localizer) =>
evts.filter(e => inRange(e, start, end, accessors, localizer))
Expand Down Expand Up @@ -130,7 +130,7 @@ class MonthView extends React.Component {
localizer
)

weeksEvents.sort((a, b) => sortEvents(a, b, accessors, localizer))
const sorted = sortWeekEvents(weeksEvents, accessors, localizer)

return (
<DateContentRow
Expand All @@ -141,7 +141,7 @@ class MonthView extends React.Component {
getNow={getNow}
date={date}
range={week}
events={weeksEvents}
events={sorted}
maxRows={showAllEvents ? Infinity : rowLimit}
selected={selected}
selectable={selectable}
Expand Down
13 changes: 9 additions & 4 deletions src/localizer.js
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,10 @@ function getMinutesFromMidnight(start) {
return diff(daystart, start, 'minutes') + getDstOffset(daystart, start)
}

function daySpan(start, end) {
return duration(start, end, 'day')
}

// These two are used by DateSlotMetrics
function continuesPrior(start, first) {
return lt(start, first, 'day')
Expand All @@ -94,13 +98,13 @@ function sortEvents({
}) {
let startSort = +startOf(aStart, 'day') - +startOf(bStart, 'day')

let durA = diff(aStart, ceil(aEnd, 'day'), 'day')
let durA = daySpan(aStart, aEnd)

let durB = diff(bStart, ceil(bEnd, 'day'), 'day')
let durB = daySpan(bStart, bEnd)

return (
startSort || // sort by start Day first
Math.max(durB, 1) - Math.max(durA, 1) || // events spanning multiple days go first
durB - durA || // events spanning multiple days go first
!!bAllDay - !!aAllDay || // then allDay single day events
+aStart - +bStart || // then sort by start time
+aEnd - +bEnd // then sort by end time
Expand Down Expand Up @@ -167,13 +171,14 @@ export class DateLocalizer {
this.min = spec.min || min
this.max = spec.max || max
this.minutes = spec.minutes || minutes
this.daySpan = spec.daySpan || daySpan
this.firstVisibleDay = spec.firstVisibleDay || firstVisibleDay
this.lastVisibleDay = spec.lastVisibleDay || lastVisibleDay
this.visibleDays = spec.visibleDays || visibleDays

this.getSlotDate = spec.getSlotDate || getSlotDate
this.getTimezoneOffset =
spec.getTimezoneOffset || (value => value.getTimezoneOffset())
spec.getTimezoneOffset || ((value) => value.getTimezoneOffset())
this.getDstOffset = spec.getDstOffset || getDstOffset
this.getTotalMin = spec.getTotalMin || getTotalMin
this.getMinutesFromMidnight =
Expand Down
13 changes: 10 additions & 3 deletions src/localizers/luxon.js
Original file line number Diff line number Diff line change
Expand Up @@ -310,20 +310,26 @@ export default function(DateTime, { firstDayOfWeek = 7 } = {}) {
return gte(end, last)
}

function daySpan(start, end) {
const dtStart = DateTime.fromJSDate(start)
const dtEnd = DateTime.fromJSDate(end)
return dtEnd.diff(dtStart).as('days')
}

// These two are used by eventLevels
function sortEvents({
evtA: { start: aStart, end: aEnd, allDay: aAllDay },
evtB: { start: bStart, end: bEnd, allDay: bAllDay },
}) {
const startSort = +startOf(aStart, 'day') - +startOf(bStart, 'day')

const durA = diff(aStart, ceil(aEnd, 'day'), 'day')
const durA = daySpan(aStart, aEnd)

const durB = diff(bStart, ceil(bEnd, 'day'), 'day')
const durB = daySpan(bStart, bEnd)

return (
startSort || // sort by start Day first
Math.max(durB, 1) - Math.max(durA, 1) || // events spanning multiple days go first
durB - durA || // events spanning multiple days go first
!!bAllDay - !!aAllDay || // then allDay single day events
+aStart - +bStart || // then sort by start time *don't need moment conversion here
+aEnd - +bEnd // then sort by end time *don't need moment conversion here either
Expand Down Expand Up @@ -415,6 +421,7 @@ export default function(DateTime, { firstDayOfWeek = 7 } = {}) {
sortEvents,
inEventRange,
isSameDate,
daySpan,
browserTZOffset,
})
}
14 changes: 11 additions & 3 deletions src/localizers/moment.js
Original file line number Diff line number Diff line change
Expand Up @@ -289,20 +289,27 @@ export default function(moment) {
return mEnd.isSameOrAfter(mLast, 'minutes')
}

function daySpan(start, end) {
const mStart = moment(start)
const mEnd = moment(end)
const dur = moment.duration(mEnd.diff(mStart))
return dur.days()
}

// These two are used by eventLevels
function sortEvents({
evtA: { start: aStart, end: aEnd, allDay: aAllDay },
evtB: { start: bStart, end: bEnd, allDay: bAllDay },
}) {
const startSort = +startOf(aStart, 'day') - +startOf(bStart, 'day')

const durA = diff(aStart, ceil(aEnd, 'day'), 'day')
const durA = daySpan(aStart, aEnd)

const durB = diff(bStart, ceil(bEnd, 'day'), 'day')
const durB = daySpan(bStart, bEnd)

return (
startSort || // sort by start Day first
Math.max(durB, 1) - Math.max(durA, 1) || // events spanning multiple days go first
durB - durA || // events spanning multiple days go first
!!bAllDay - !!aAllDay || // then allDay single day events
+aStart - +bStart || // then sort by start time *don't need moment conversion here
+aEnd - +bEnd // then sort by end time *don't need moment conversion here either
Expand Down Expand Up @@ -398,6 +405,7 @@ export default function(moment) {
sortEvents,
inEventRange,
isSameDate,
daySpan,
browserTZOffset,
})
}
44 changes: 44 additions & 0 deletions src/utils/eventLevels.js
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,50 @@ export function segsOverlap(seg, otherSegs) {
)
}

export function sortWeekEvents(events, accessors, localizer) {
const base = [...events]
const multiDayEvents = []
const standardEvents = []
base.forEach((event) => {
const startCheck = accessors.start(event)
const endCheck = accessors.end(event)
if (localizer.daySpan(startCheck, endCheck) > 1) {
multiDayEvents.push(event)
} else {
standardEvents.push(event)
}
})
const multiSorted = multiDayEvents.sort((a, b) =>
sortEvents(a, b, accessors, localizer)
)
const standardSorted = standardEvents.sort((a, b) =>
sortEvents(a, b, accessors, localizer)
)
return [...multiSorted, ...standardSorted]
}

export function sortWeekEvents(events, accessors, localizer) {
const base = [...events]
const multiDayEvents = []
const standardEvents = []
base.forEach((event) => {
const startCheck = accessors.start(event)
const endCheck = accessors.end(event)
if (localizer.daySpan(startCheck, endCheck) > 1) {
multiDayEvents.push(event)
} else {
standardEvents.push(event)
}
})
const multiSorted = multiDayEvents.sort((a, b) =>
sortEvents(a, b, accessors, localizer)
)
const standardSorted = standardEvents.sort((a, b) =>
sortEvents(a, b, accessors, localizer)
)
return [...multiSorted, ...standardSorted]
}

export function sortEvents(eventA, eventB, accessors, localizer) {
const evtA = {
start: accessors.start(eventA),
Expand Down

0 comments on commit 69ffcfb

Please sign in to comment.