JSFiddle - React, Tailwind, and code Playground
by Mike McCaughan
HTML
<script src="https://raw.github.com/timrwood/moment/1.7.2/min/moment.min.js"></script>
<ul id="weeks"></ul>
<ul id="days"></ul>
<ul id="hours"></ul>
JavaScript
function getWeeks(currentDay, firstSunday, lastSaturday) {
var hz = moment.duration(lastSaturday.valueOf() - firstSunday.valueOf()).asHours() + 24, // firstSunday starts @ 00:00
hours = [], hh = 0, h, hd, hourMoment,
year, month, day, dow, hour,
days = [], dd = 0, d, dw, lastDay,
weeks = [], ww = 0, w;
for (; hh < hz; hh++) {
hourMoment = moment(firstSunday).startOf('day').add('hours', hh);
year = hourMoment.year();
month = hourMoment.month();
dow = hourMoment.day();
day = hourMoment.date();
hour = hourMoment.hours();
h = {
index: hh,
year: year,
month: month,
dow: dow,
day: day,
hour: hour
};
if (lastDay !== day) {
hd = dd * 24;
d = {
index: dd,
year: year,
month: month,
dow: dow > 0 ? dow - 1 : 6,
day: day - 1,
hours: hours.slice(hd, hd + 24)
};
if (d.hours.length > 0) {
days.push(d);
dd += 1;
}
lastDay = day;
}
if (dow === 6) {
dw = ww * 7;
w = {
index: ww,
days: days.slice(dw, dw + 7)
};
if (w.days.length > 0) {
weeks.push(w);
ww += 1;
}
}
hours.push(h);
}
return {
weeks: weeks,
hours: hours,
days: days
};
}
function hourToMoment(hour) {
return moment([hour.year, hour.month, hour.day, hour.hour, 0, 0, 0]);
}
function dayToMoment(day) {
return moment([day.year, day.month, day.day, 0, 0, 0, 0]);
}
var view = 'month',
currentDay = moment(),
firstSunday = view === 'week' ? moment().day(0) : moment().startOf('month').day(0),
lastSaturday = view === 'week' ?...