Time slots app prototype
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

114 lines
3.0 KiB

import bookings from "../api/bookings_2023_02_01.json" # bookings.where ending_date >= $date and starting_date <= $date + 3 days sort b sort_by starting_date
# make objects
for booking in bookings
booking.start = new Date(booking.start)
booking.end = new Date(booking.end)
import sh from "../ui/slot-size-input.imba"
global.Slot_h = let h =
scope: 3days
resolution: 15minutes
date: do let day = ( R.param('alt-date') || R.param('date') ); h.move_date(day, day.getTimezoneOffset! * 1minutes)
scope_day: do h.move_date h.date!, h.scope
slots: do
h._slots ||= h.calculate_slots!
calculate_slots: do
let slots = []
unless bookings.length
slots.push start: h.date!, end: h.scope_day!
else
let first = bookings[0]
if first.start > h.date!
slots.push start: h.date!, end: first.start
bookings.forEach do |booking,i|
let next = bookings[i+1]
if next
slots.push start: booking.end, end: next.start
let last = bookings[-1]
if last.end < h.scope_day!
slots.push start: last.end, end: h.move_date(last.end, 730days)
for slot in slots
h.adjust(slot, 'start')
h.adjust(slot, 'end')
slot['duration'] = h.calculate_duration(slot) for slot in slots
slots
adjust: do |slot, param|
let min = Number(slot[param])
let min_mod = min % h.resolution
if min_mod != 0
slot[param] = new Date(min + ( param == 'start' ? h.resolution : 0 ) - min_mod)
calculate_duration: do |slot|
Number(slot.end) - Number(slot.start)
duration: do # size of booking in time
h._duration ||= h.calculate_duration end: R.param('size'), start: sh.zero!
move_date: do |date, interval|
new Date(Number(date) + interval)
f: do |n| "{if n < 10 then 0 else ''}{n}"
let filtered_slots
let first_available
tag choose-slot
css my: 20px
def render
h._slots = h._duration = first_available = 0 # reset cache
filtered_slots = h.slots!.filter do |s| s.duration >= h.duration!
let day = h.date!
let next_day = h.move_date(h.date!, 1days)
<self>
if filtered_slots.length
<time-slot data=day>
for i in [0 .. 94]
<time-slot data=day=h.move_date(day, h.resolution)>
else
<h2> "No slot available this day"
<simple-date-input>
tag time-slot
get free?
for slot in filtered_slots
if data >= slot.start and (h.move_date(data, h.duration!) <= slot.end)
first_available ||= data
return true
false
get time_from do "{h.f data.getHours!}:{h.f data.getMinutes!}"
get time_to do let day = h.move_date(data, h.duration!); "{h.f day.getHours!}:{h.f day.getMinutes!}"
css d:block fs:xx-small h:10px
&.activated bgc:violet7 zoom:2
> .hide d:inline
&.active, &.activated c:violet9 fs:large h:40px lh: 45px
@hover bgc:violet9 c:white zoom:2
.hide d:inline
def action
if flags.contains('active')
R.write 'from', time_from
R.go R.to_path('booking-confirmation')
<self.clickable.active=free? @click=action>
time_from
<.hide>
" - "
time_to
R.setters['from'] = do |v| v.replace(':','!')
R.getters['from'] = do |v| v.replace('!',':')