Skip to content

Commit

Permalink
Merge pull request #70 from catenarytransit/betterRoutes
Browse files Browse the repository at this point in the history 
Better routes
  • Loading branch information
@kylerchin
kylerchin authored Sep 5, 2024
2 parents 02bba26 + 24c5742 commit 90ee9a1
Show file tree
Hide file tree
Showing 8 changed files with 292 additions and 217 deletions.
11 changes: 8 additions & 3 deletions src/components/DelayDiff.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@
let m: number = 0;
let s: number = 0;
export let show_seconds: boolean = true;
let this_locale: string | null | undefined = null;
function locale_hour_marking(l: string | null | undefined) {
Expand Down Expand Up @@ -96,9 +98,12 @@
{/if}{#if h > 0 || m > 0}
<span class="text-sm">{m}</span>
<span class="text-xs">{locale_min_marking(this_locale)}</span>{/if}
{#if Math.abs(diff) > 0}
<span class="text-sm">{s}</span>
<span class="text-xs">{locale_s_marking(this_locale)}</span>
{#if show_seconds == true}
{#if Math.abs(diff) > 0}
<span class="text-sm">{s}</span>
<span class="text-xs">{locale_s_marking(this_locale)}</span>
{/if}
{/if}

<span class="text-sm">{')'}</span>
</span>
156 changes: 84 additions & 72 deletions src/components/NearbyDepartures.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,80 +87,92 @@
Refresh Departures
</button>

<div class="flex flex-col gap-y-5">
{#each departure_list as route_group }
<p style={`color: ${route_group.color}`}>
{#if route_group.short_name}

<span class="font-medium">{route_group.short_name}</span>
{/if}

{#if route_group.long_name}

<span>{route_group.long_name}</span>
{/if}

<div class="px-2 py-2 bg-slate-100 dark:bg-slate-700 rounded-lg shadow-md dark:shadow-slate-800">
<p style={`color: ${route_group.color}`}>
{#if route_group.short_name}

<span class="font-bold">{route_group.short_name}</span>
{/if}

{#if route_group.long_name}

<span class="font-medium">{route_group.long_name}</span>
{/if}


</p>

{#each Object.entries(route_group.directions) as [d_id, direction_group] }
<p>
<span class="px-0.5 mr-2 bg-slate-600"></span>
{direction_group.headsign}</p>

<p class='text-sm'>🚏 {stops_table[route_group.chateau_id][direction_group.trips[0].stop_id].name}</p>

</p>

{#each Object.entries(route_group.directions) as [d_id, direction_group] }
<p>
<span class="px-0.5 mr-2 bg-slate-600"></span>
{direction_group.headsign}</p>

<p class='text-sm'>🚏 {stops_table[route_group.chateau_id][direction_group.trips[0].stop_id].name}</p>

<div class="flex flex-row gap-x-1 overflow-x-auto catenary-scroll">
{#each direction_group.trips.filter((x) => x.departure_schedule > (Date.now() / 1000) - 900) as trip }
<div class="bg-white dark:bg-slate-800 hover:bg-blue-300 hover:dark:bg-blue-900 p-1 rounded-md min-w-24"
on:click={() => {
data_stack_store.update((stack) => {
stack.push(new StackInterface(
new SingleTrip(
route_group.chateau_id,
trip.trip_id,
route_group.route_id,
null,
trip.gtfs_schedule_start_day.replace(/-/g, ""),
null,
route_group.route_type
),
));

return stack;
}

<div class="flex flex-row gap-x-1 overflow-x-auto catenary-scroll">
{#each direction_group.trips.filter((x) => x.departure_schedule > (Date.now() / 1000) - 900) as trip }
<div class="bg-white dark:bg-slate-800 hover:bg-blue-300 hover:dark:bg-blue-900 p-1 rounded-md min-w-24"
on:click={() => {
data_stack_store.update((stack) => {
stack.push(new StackInterface(
new SingleTrip(
route_group.chateau_id,
trip.trip_id,
route_group.route_id,
null,
trip.gtfs_schedule_start_day.replace(/-/g, ""),
null,
route_group.route_type
),
));

return stack;
}


);
}}
>
{#if route_group.route_type == 2 && trip.trip_short_name}
<p class="font-medium text-sm md:text-sm">{trip.trip_short_name}</p>
{/if}

{#if trip.departure_schedule}
<TimeDiff
show_brackets={false}
show_seconds={false}
diff={(trip.departure_realtime || trip.departure_schedule) - current_time / 1000} />
{/if}

<p class="text-xs md:text-sm">


{
new Intl.DateTimeFormat('en-GB', {
hour: "numeric",
minute: "numeric",
timeZone: trip.tz,
}).format(new Date((trip.departure_realtime || trip.departure_schedule) * 1000))
}
</p>

{#if trip.cancelled}
<span class="text-red-500">{$_('cancelled')}</span>
{/if}

{#if trip.departure_realtime != null && trip.departure_schedule != null}

<DelayDiff
diff={trip.departure_schedule - trip.departure_realtime} />
{/if}

);
}}
>
{#if route_group.route_type == 2 && trip.trip_short_name}
<p class="font-medium text-sm md:text-sm">{trip.trip_short_name}</p>
{/if}

{#if trip.departure_schedule}
<TimeDiff diff={(trip.departure_realtime || trip.departure_schedule) - current_time / 1000} show_brackets={true} />
{/if}

<p class="text-xs md:text-sm">
{new Date(
(trip.departure_realtime || trip.departure_schedule) * 1000
).toLocaleTimeString('en-UK', {
timeZone: trip.tz
})}
</p>

{#if trip.cancelled}
<span class="text-red-500">{$_('cancelled')}</span>
{/if}

{#if trip.departure_realtime != null && trip.departure_schedule != null}

<DelayDiff diff={trip.departure_schedule - trip.departure_realtime} />
{/if}

</div>
{/each}
</div>
{/each}
</div>
{/each}
{/each}
{/each}
</div>
{/each}
</div>
</div>
92 changes: 92 additions & 0 deletions src/components/RouteHeading.svelte
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
<script lang="ts">
import { fixRouteName, fixRouteNameLong } from './agencyspecific';
import { lightenColour } from './lightenDarkColour';
import {
find_schedule_pdf,
find_schedule_pdf_initial,
has_schedule_pdf,
schedule_pdf_needs_hydration
} from './pdf_schedules';
export let color: string;
export let text_color: string;
export let short_name: string | null;
export let long_name: string | null;
export let url: string | null = null;
export let run_number: string | null = null;
export let icon: string | null = null;
export let route_id: string;
export let chateau_id: string;
export let text: string;
export let compact: boolean = false;
export let darkMode: boolean;
let pdf_url: string | undefined;
if (has_schedule_pdf(chateau_id)) {
pdf_url = find_schedule_pdf_initial(chateau_id, route_id);
}
if (schedule_pdf_needs_hydration(chateau_id)) {
find_schedule_pdf(chateau_id, route_id)
.then((answer) => (pdf_url = answer))
.catch((pdferr) => console.error(pdferr));
}
</script>

{#if !compact}
<h2 class="text-xl mt-2" style={`color: ${darkMode ? lightenColour(color) : color}`}>
{#if run_number}
<span
style={`background-color: ${color}; color: ${text_color};`}
class="font-bold text-md px-1 py-0.5 mr-1 rounded-md w-min">{run_number}</span
>
{/if}

{#if short_name}
<span class="font-bold">{fixRouteName(chateau_id, short_name, route_id)}</span>
{/if}

{#if long_name}
<span class={`${short_name ? 'font-normal ml-1' : 'font-bold'}`}
>{fixRouteNameLong(chateau_id, long_name, route_id)}</span
>
{/if}

{#if icon}
<span class="material-icons-outlined text-2xl align-middle">{icon}</span>
{/if}
</h2>

<h2 class="text-lg font-medium my-1">{text}</h2>

<div class="flex flex-row gap-x-2">
{#if pdf_url != null}
<a target="_blank" href={pdf_url}>
<div
class="px-2 py-0.5 my-1 border-seashore text-seashore flex flex-row align-middle justify-center rounded-xl border-2 hover:text-white hover:bg-seashore hover:transition-colors"
>
<span class="material-symbols-outlined font-medium text-2xl align-middle">
attachment
</span>
<span class="font-medium text-base md:text-lg pl-2">PDF</span>
</div>
</a>
{/if}
{#if url != null}
<a target="_blank" href={url}>
<div
class="px-2 py-0.5 my-1 border-seashore text-seashore flex flex-row align-middle justify-center rounded-xl border-2 hover:text-white hover:bg-seashore hover:transition-colors"
>
<span class="material-symbols-outlined font-medium text-2xl align-middle"> globe </span>
<span class="font-medium text-base md:text-lg pl-2">URL</span>
</div>
</a>
{/if}
</div>
{/if}
Loading

0 comments on commit 90ee9a1

Please sign in to comment.