diff --git a/src/lib/components/OpeningTimes.svelte b/src/lib/components/OpeningTimes.svelte new file mode 100644 index 0000000..fbd3242 --- /dev/null +++ b/src/lib/components/OpeningTimes.svelte @@ -0,0 +1,40 @@ + + +
+ Today's Opening Times: + {openingDisplay} +
+ + diff --git a/src/lib/components/SpaceCard.svelte b/src/lib/components/SpaceCard.svelte index 0c1bf04..b5c1a19 100644 --- a/src/lib/components/SpaceCard.svelte +++ b/src/lib/components/SpaceCard.svelte @@ -1,15 +1,17 @@ @@ -24,6 +26,7 @@ {/each} {/if} +
diff --git a/src/lib/database.d.ts b/src/lib/database.d.ts index 608e110..1e7ad3f 100644 --- a/src/lib/database.d.ts +++ b/src/lib/database.d.ts @@ -140,6 +140,48 @@ export type Database = { } Relationships: [] } + + study_space_hours: { + Row: { + id: string + study_space_id: string + day_of_week: number + opens_at: string + closes_at: string + is_24_7: boolean + created_at: string | null + updated_at: string | null + } + Insert: { + id?: string + study_space_id: string + day_of_week: number + opens_at: string + closes_at: string + is_24_7: boolean + created_at?: string | null + updated_at?: string | null + } + Update: { + id?: string + study_space_id?: string + day_of_week?: number + opens_at?: string + closes_at?: string + is_24_7?: boolean + created_at?: string | null + updated_at?: string | null + } + Relationships: [ + { + foreignKeyName: "study_space_hours_study_space_id_fkey" + columns: ["study_space_id"] + isOneToOne: false + referencedRelation: "study_spaces" + referencedColumns: ["id"] + }, + ] + users: { Row: { created_at: string @@ -160,6 +202,7 @@ export type Database = { updated_at?: string } Relationships: [] + } } Views: { diff --git a/src/lib/index.ts b/src/lib/index.ts index ce66b97..b709d5c 100644 --- a/src/lib/index.ts +++ b/src/lib/index.ts @@ -8,7 +8,6 @@ export type Enum = Database["public export const availableStudySpaceTags = [ "Crowded", "Group study", - "24/7", "Food allowed", "No food allowed", "Well lit", @@ -43,3 +42,20 @@ export async function gmapsLoader() { libraries: ["places"] }); } + +export function formatTime(time: string) { + const [h, m] = time.split(":").map(Number); + const date = new Date(); + date.setHours(h, m); + return date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" }); +} + +export const daysOfWeek = [ + "Sunday", + "Monday", + "Tuesday", + "Wednesday", + "Thursday", + "Friday", + "Saturday" +]; diff --git a/src/routes/+page.server.ts b/src/routes/+page.server.ts index b364832..7f2ccd5 100644 --- a/src/routes/+page.server.ts +++ b/src/routes/+page.server.ts @@ -5,7 +5,7 @@ export const load: PageServerLoad = async ({ depends, locals: { supabase } }) => depends("db:study_spaces"); const { data: studySpaces, error: err } = await supabase .from("study_spaces") - .select("*, study_space_images(*)"); + .select("*, study_space_images(*), study_space_hours(*)"); if (err) error(500, "Failed to load study spaces"); return { diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index def3a58..dfa8622 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -11,6 +11,8 @@ let selectedTags = $state([]); let tagFilter = $state(""); + let openingFilter = $state(""); + let closingFilter = $state(""); let tagFilterElem = $state(); function categorySelected(category: string[]) { @@ -33,19 +35,60 @@ }) ); - let filteredStudySpaces = $derived( - selectedTags.length === 0 - ? studySpaces - : studySpaces.filter((space) => { - const allTags = [ - ...(space.tags || []), - space.volume, - space.wifi, - space.power - ].filter(Boolean); + // Convert "HH:MM" or "HH:MM:SS" to minutes since midnight + function toMinutes(timeStr: string): number { + const [h, m] = timeStr.slice(0, 5).split(":").map(Number); + return h * 60 + m; + } - return selectedTags.every((tag) => allTags.includes(tag)); - }) + // Combine tag and time filtering + let filteredStudySpaces = $derived( + studySpaces + // tag filtering + .filter((space) => { + if (selectedTags.length === 0) return true; + const allTags = [ + ...(space.tags || []), + space.volume, + space.wifi, + space.power + ].filter(Boolean); + return selectedTags.every((tag) => allTags.includes(tag)); + }) + // opening time filter + .filter((space) => { + if (!openingFilter) return true; + const entry = space.study_space_hours?.find( + (h) => h.day_of_week === new Date().getDay() + ); + if (!entry) return false; + if (entry.is_24_7) return true; + const openMin = toMinutes(entry.opens_at); + let closeMin = toMinutes(entry.closes_at); + // Treat midnight as end of day and handle overnight spans + if (closeMin === 0) closeMin = 24 * 60; + if (closeMin <= openMin) closeMin += 24 * 60; + const filterMin = toMinutes(openingFilter); + // Include spaces open at the filter time + return filterMin >= openMin && filterMin < closeMin; + }) + // closing time filter + .filter((space) => { + if (!closingFilter) return true; + const entry = space.study_space_hours?.find( + (h) => h.day_of_week === new Date().getDay() + ); + if (!entry) return false; + if (entry.is_24_7) return true; + const openMin = toMinutes(entry.opens_at); + let closeMin = toMinutes(entry.closes_at); + if (closeMin === 0) closeMin = 24 * 60; + if (closeMin <= openMin) closeMin += 24 * 60; + const filterMin = + toMinutes(closingFilter) === 0 ? 24 * 60 : toMinutes(closingFilter); + // Include spaces still open at the filter time + return filterMin > openMin && filterMin <= closeMin; + }) ); let dropdownVisible = $state(false); @@ -75,11 +118,24 @@
+ {#if adminMode}
{/if} + +
+ + +
+
@@ -144,6 +200,7 @@ href="/space/{studySpace.id}" imgSrc={imgUrl} space={studySpace} + hours={studySpace.study_space_hours} /> {/each}
@@ -185,6 +242,29 @@ grid-column: 1 / -1; display: flex; justify-content: center; + margin-bottom: 0.5rem; + } + + .time-filter-container { + grid-column: 1 / -1; + display: flex; + gap: 1rem; + justify-content: center; + margin-bottom: 0.5rem; + } + .time-filter-container label { + display: flex; + align-items: center; + gap: 0.5rem; + font-size: 1rem; + color: #eaffeb; + } + .time-filter-container input[type="time"] { + background: none; + border: 2px solid #eaffeb; + border-radius: 0.5rem; + padding: 0.25rem 0.5rem; + color: #eaffeb; padding: 0.5rem; } diff --git a/src/routes/space/[id]/+page.server.ts b/src/routes/space/[id]/+page.server.ts index 2980aca..14c45e8 100644 --- a/src/routes/space/[id]/+page.server.ts +++ b/src/routes/space/[id]/+page.server.ts @@ -5,7 +5,7 @@ export const load: PageServerLoad = async ({ depends, params, locals: { supabase depends("db:study_spaces"); const { data: space, error: err } = await supabase .from("study_spaces") - .select("*, study_space_images(*)") + .select("*, study_space_images(*), study_space_hours(*)") .eq("id", params.id) .single(); if (err) error(500, "Failed to load study space"); diff --git a/src/routes/space/[id]/+page.svelte b/src/routes/space/[id]/+page.svelte index 2282f6c..a188a6d 100644 --- a/src/routes/space/[id]/+page.svelte +++ b/src/routes/space/[id]/+page.svelte @@ -7,7 +7,7 @@ import Report from "$lib/components/Report.svelte"; import Feedback from "$lib/components/Feedback.svelte"; import { onMount } from "svelte"; - import { gmapsLoader } from "$lib"; + import { gmapsLoader, daysOfWeek, formatTime } from "$lib"; import Button from "$lib/components/Button.svelte"; const { data } = $props(); @@ -50,6 +50,13 @@ map }); }); + + const hoursByDay = $derived(new Map(space.study_space_hours.map((h) => [h.day_of_week, h]))); + + const openingEntries = daysOfWeek.map((day, idx) => ({ + day, + entry: hoursByDay.get(idx) + })); @@ -92,6 +99,22 @@ {/if}
+
Opening Times:
+ {#each openingEntries as { day, entry } (entry)} +
+ {day}: + + {#if entry} + {entry.is_24_7 + ? "Open All Day" + : `${formatTime(entry.opens_at)} – ${formatTime(entry.closes_at)}`} + {:else} + Closed + {/if} + +
+ {/each} +
Where it is:

{#if place.name} @@ -230,6 +253,26 @@ margin-top: 1rem; text-align: center; } + + .opening-entry { + display: grid; + grid-template-columns: auto 1fr; + gap: 0.75rem; + padding: 0.5rem 1.4rem; + align-items: center; + } + .opening-entry .day { + font-weight: bold; + color: #ffffff; + white-space: nowrap; + } + .opening-entry .times { + font-family: monospace; + background-color: rgba(255, 255, 255, 0.1); + padding: 0.25rem 0.5rem; + border-radius: 0.25rem; + color: #eaffeb; + .actions { display: flex; flex-direction: column; diff --git a/src/routes/space/[id]/edit/+page.server.ts b/src/routes/space/[id]/edit/+page.server.ts index 5ddf15d..78baabf 100644 --- a/src/routes/space/[id]/edit/+page.server.ts +++ b/src/routes/space/[id]/edit/+page.server.ts @@ -8,6 +8,12 @@ type StudySpaceData = Omit< > & { id?: string; building_location?: google.maps.places.PlaceResult; + opening_times?: { + day_of_week: number; + opens_at: string; + closes_at: string; + is_24_7: boolean; + }[]; }; export const load: PageServerLoad = async ({ params, locals: { supabase } }) => { @@ -34,6 +40,13 @@ export const load: PageServerLoad = async ({ params, locals: { supabase } }) => const studySpaceData = space as StudySpaceData & Partial; const images = studySpaceData.study_space_images || []; + const { data: hours, error: hoursErr } = await supabase + .from("study_space_hours") + .select("day_of_week, opens_at, closes_at, is_24_7") + .eq("study_space_id", params.id) + .order("day_of_week", { ascending: true }); + if (hoursErr) error(500, "Failed to load opening times"); + studySpaceData.opening_times = hours; delete studySpaceData.created_at; delete studySpaceData.updated_at; diff --git a/src/routes/space/[id]/edit/+page.svelte b/src/routes/space/[id]/edit/+page.svelte index e04eee2..5302a2c 100644 --- a/src/routes/space/[id]/edit/+page.svelte +++ b/src/routes/space/[id]/edit/+page.svelte @@ -11,7 +11,8 @@ wifiTags, powerOutletTags, volumeTags, - gmapsLoader + gmapsLoader, + daysOfWeek } from "$lib"; import { onMount } from "svelte"; import type { Json } from "$lib/database.js"; @@ -20,10 +21,25 @@ const { supabase } = $derived(data); const { space, images } = $derived(data); - const studySpaceData = $derived({ + const studySpaceData = $state({ + opening_times: daysOfWeek.map((_, index) => ({ + day_of_week: index, + opens_at: "", + closes_at: "", + is_24_7: false + })), ...space }); + $effect(() => { + if (!space) return; + const { opening_times, ...rest } = space; + Object.assign(studySpaceData, rest); + if (opening_times) { + studySpaceData.opening_times = opening_times; + } + }); + let scrollPosition = $state(0); const existingImages = $derived( Promise.all( @@ -46,11 +62,13 @@ if (!spaceImgs || spaceImgs.length < 1) return alert("Please select an image file."); if (!studySpaceData.building_location) return alert("Please select a building location."); + const { opening_times, ...spacePayload } = studySpaceData; + const { data: studySpaceInsert, error: studySpaceError } = await supabase .from("study_spaces") .upsert( { - ...studySpaceData, + ...spacePayload, building_location: studySpaceData.building_location as Json }, { @@ -102,6 +120,23 @@ .select(); if (imageInsertError) return alert(`Error creating image: ${imageInsertError.message}`); + const { error: deleteErr } = await supabase + .from("study_space_hours") + .delete() + .eq("study_space_id", studySpaceInsert.id); + if (deleteErr) return alert(`Error clearing old hours: ${deleteErr.message}`); + + const { error: hoursErr } = await supabase.from("study_space_hours").insert( + opening_times.map((h) => ({ + study_space_id: studySpaceInsert.id, + day_of_week: h.day_of_week, + opens_at: h.opens_at, + closes_at: h.closes_at, + is_24_7: h.is_24_7 + })) + ); + if (hoursErr) return alert(`Error saving opening times: ${hoursErr.message}`); + alert("Thank you for your contribution!"); // Redirect to the new study space page await goto(`/space/${studySpaceInsert.id}`, { @@ -161,6 +196,20 @@ }); spaceImgs = dt.files; }); + + // --- Helper functions for opening times --- + function toggle247(index: number) { + const ot = studySpaceData.opening_times[index]; + if (ot.is_24_7) { + ot.opens_at = "00:00"; + ot.closes_at = "00:00"; + } + } + + function updateTimes(index: number) { + const ot = studySpaceData.opening_times[index]; + ot.is_24_7 = ot.opens_at === "00:00" && ot.closes_at === "00:00"; + } @@ -254,6 +303,39 @@ + +

+ {#each daysOfWeek as day, index (index)} +
+ + updateTimes(index)} + /> + to + updateTimes(index)} + /> + +
+ {/each} +
+
{#each studySpaceData.tags as tagName (tagName)} @@ -488,4 +570,36 @@ .additionalImages input { display: none; } + + /* Opening times layout and inputs styling */ + .opening-times { + display: flex; + flex-direction: column; + gap: 0.5rem; + } + + .opening-time-item { + display: flex; + align-items: center; + gap: 0.5rem; + } + + .opening-time-item label { + margin-top: 0; + width: 6rem; + } + + .opening-time-item input[type="time"] { + padding: 0.5rem; + height: 2.5rem; + border-radius: 0.5rem; + border: 2px solid #eaffeb; + background: none; + color: #eaffeb; + } + + .opening-time-item span { + margin: 0 0.5rem; + color: #eaffeb; + } diff --git a/supabase/migrations/20250612032104_study_space_hours_table.sql b/supabase/migrations/20250612032104_study_space_hours_table.sql new file mode 100644 index 0000000..6020722 --- /dev/null +++ b/supabase/migrations/20250612032104_study_space_hours_table.sql @@ -0,0 +1,14 @@ +CREATE TABLE study_space_hours ( + id UUID PRIMARY KEY DEFAULT gen_random_uuid(), + study_space_id UUID REFERENCES study_spaces(id) ON DELETE CASCADE, + day_of_week INT CHECK (day_of_week BETWEEN 0 AND 6), -- 0 = Sunday, 6 = Saturday + opens_at TIME NOT NULL, + closes_at TIME NOT NULL, + is_24_7 BOOLEAN DEFAULT FALSE, + created_at timestamp with time zone DEFAULT now(), + updated_at timestamp with time zone DEFAULT now() +); + +CREATE TRIGGER study_space_hours_updated_at +AFTER UPDATE ON study_space_hours +FOR EACH ROW EXECUTE FUNCTION handle_updated_at(); \ No newline at end of file diff --git a/supabase/schemas/0001_study_spaces.sql b/supabase/schemas/0001_study_spaces.sql index 134ff96..6ccdccd 100644 --- a/supabase/schemas/0001_study_spaces.sql +++ b/supabase/schemas/0001_study_spaces.sql @@ -18,6 +18,7 @@ CREATE TABLE study_spaces ( volume text NOT NULL, wifi text NOT NULL, power text NOT NULL, + created_at timestamp with time zone DEFAULT now(), updated_at timestamp with time zone DEFAULT now() ); @@ -39,6 +40,17 @@ CREATE TABLE reports ( content text ); +CREATE TABLE study_space_hours ( + id UUID PRIMARY KEY DEFAULT gen_random_uuid(), + study_space_id UUID REFERENCES study_spaces(id) ON DELETE CASCADE, + day_of_week INT CHECK (day_of_week BETWEEN 0 AND 6), -- 0 = Sunday, 6 = Saturday + opens_at TIME NOT NULL, + closes_at TIME NOT NULL, + is_24_7 BOOLEAN DEFAULT FALSE, + created_at timestamp with time zone DEFAULT now(), + updated_at timestamp with time zone DEFAULT now() +); + -- Triggers CREATE TRIGGER study_spaces_updated_at AFTER UPDATE ON study_spaces @@ -51,3 +63,7 @@ FOR EACH ROW EXECUTE FUNCTION handle_updated_at(); CREATE TRIGGER reports_updated_at AFTER UPDATE ON reports FOR EACH ROW EXECUTE FUNCTION handle_updated_at(); + +CREATE TRIGGER study_space_hours_updated_at +AFTER UPDATE ON study_space_hours +FOR EACH ROW EXECUTE FUNCTION handle_updated_at();