Commit b77e231a authored by Andrew Hrdy's avatar Andrew Hrdy
Browse files

Today's hours now on cards.

parent 727a3e59
Pipeline #1863 passed with stage
in 1 minute and 44 seconds
......@@ -15,10 +15,7 @@ const FacilityStatus = ({facility}) => {
let label;
let isOpen;
if (FacilityUtils.getFacilityActiveSchedule(facility).twenty_four_hours) {
label = 'OPEN 24/7';
isOpen = true;
} else if (FacilityUtils.isFacilityOpen(facility)) {
if (FacilityUtils.isFacilityOpen(facility)) {
label = 'OPEN';
isOpen = true;
} else {
......
import React from 'react'
import Grid from 'material-ui/Grid';
import FacilityUtils from '../utils/facilityUtils';
const WeekHours = ({facility}) => {
const convert_am_pm = (time) => {
const timeArr = time
.split(":")
.map((item) => {
return Number(item)
});
let am_pm = "am"
if (timeArr[0] > 12) {
timeArr[0] = timeArr[0] - 12
am_pm = "pm"
}
if (timeArr[1] === 0) {
timeArr[1] = ""
} else {
timeArr[1] = ":" + timeArr[1]
}
return timeArr[0] + timeArr[1] + am_pm;
}
const weekDays = [
"Mon",
"Tue",
......@@ -30,43 +11,21 @@ const WeekHours = ({facility}) => {
"Fri",
"Sat",
"Sun"
]
];
let output = [];
try {
const schedule = facility.main_schedule.open_times;
try {
for (let dayOfWeek = 0; dayOfWeek < 7; dayOfWeek++) {
let startDay,
endDay,
startTime,
endTime;
let hours = null;
for (let i = 0; i < schedule.length; i++) {
startDay = schedule[i].start_day;
endDay = schedule[i].end_day;
startTime = schedule[i].start_time;
endTime = schedule[i].end_time;
if (dayOfWeek === startDay) {
hours = convert_am_pm(startTime) + " - " + convert_am_pm(endTime);
break;
} else if (dayOfWeek > startDay && dayOfWeek < endDay) {
hours = '24 hours';
break;
}
}
if (hours === null) {
hours = 'Closed'
}
output[dayOfWeek] = (
<Grid container key={facility.slug + dayOfWeek} className='week-hours-row'>
<Grid item xs={2} className='week-hours-day'>{weekDays[dayOfWeek]}</Grid>
<Grid item className='week-hours-times'>{hours}</Grid>
<Grid item className='week-hours-times'>{FacilityUtils.getHoursByDay(facility, dayOfWeek)}</Grid>
</Grid>
)
}
} catch (e) {}
} catch (e) {
}
return (
<div>
......
......@@ -11,6 +11,7 @@ import LocationOnIcon from 'material-ui-icons/LocationOn';
import {removeBrackets} from '../utils/nameUtils';
import classnames from 'classnames';
import FacilityDialog from '../components/FacilityDialog';
import FacilityUtils from '../utils/facilityUtils';
class FacilityCard extends React.Component {
......@@ -45,6 +46,8 @@ class FacilityCard extends React.Component {
const isSelected = selectedFacility.slug === facility.slug;
const dayOfWeek = [6, 0, 1, 2, 3, 4, 5][new Date().getDay()];
return (
<Card onClick={this.handleCardClick} className={classnames('fc-root', isSelected && 'fc-selected')}
onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} raised>
......@@ -70,6 +73,11 @@ class FacilityCard extends React.Component {
<Grid item className={'fc-small-grid-item-spacing'}>
<FacilityCategory category={facility.facility_category} />
</Grid>
<Grid item className={'fc-small-grid-item-spacing'}>
<Typography type={'body1'}>
{"Today: " + FacilityUtils.getHoursByDay(facility, dayOfWeek)}
</Typography>
</Grid>
</Grid>
<Grid container justify={'space-around'} className={'fc-extra-info-wrapper'}>
......
......@@ -100,7 +100,7 @@
@media screen and (min-width: map-get($breakpoints, lg)) and (max-width: map-get($breakpoints, xl)) {
.fc-root {
width: 250px * $fc-lg-scale;
height: 230px;
height: 250px;
}
.fc-small-grid-item-spacing {
......
......@@ -202,6 +202,81 @@ const getActiveEntry = schedule => {
return null;
};
/**
* Determines the entry based on the day of the week.
*
* @param schedule A schedule.
* @param dayOfWeek The day of the week
* @returns {*} A schedule entry for the specified day, null if no entries found for that day.
*/
const getEntryByDay = (schedule, dayOfWeek) => {
const openTimes = schedule.open_times;
for (let i = 0; i < openTimes.length; i++) {
const entry = openTimes[i];
const startDay = entry.start_day;
const endDay = entry.end_day;
if ((startDay <= endDay &&
dayOfWeek >= startDay &&
dayOfWeek <= endDay) ||
(startDay > endDay &&
dayOfWeek >= startDay ||
dayOfWeek <= endDay)
) {
return entry;
}
}
return null;
};
const getHoursByDay = (facility, dayOfWeek) => {
const schedule = getFacilityActiveSchedule(facility);
if (schedule.twenty_four_hours) {
return 'All Day';
}
const entry = getEntryByDay(schedule, dayOfWeek);
if (entry === null) {
return 'Closed';
}
return convertToMeridiemTime(entry.start_time) + ' - ' + convertToMeridiemTime(entry.end_time);
};
/**
* Converts military time to 12-hour time.
*
* @param time The time as military time
* @returns {string} The time as 12-hour time.
*/
const convertToMeridiemTime = (time) => {
const timeArr = time
.split(":")
.map((item) => {
return Number(item)
});
let am_pm = "am";
if (timeArr[0] > 12) {
timeArr[0] = timeArr[0] - 12;
am_pm = "pm";
}
if (timeArr[1] === 0) {
timeArr[1] = "";
} else {
timeArr[1] = ":" + timeArr[1]
}
return timeArr[0] + timeArr[1] + am_pm;
};
/**
* Calculates the number of days between dayFrom and dayTo.
......@@ -226,6 +301,7 @@ const daysTill = (dayFrom, dayTo) => {
export default {
getFacilityActiveSchedule: getFacilityActiveSchedule,
isFacilityOpen: isFacilityOpen,
getHoursByDay: getHoursByDay,
calcTimeTillOpen: calcTimeTillOpen,
calcTimeTillClose: calcTimeTillClose
}
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment