Skip to content
This repository has been archived by the owner on Aug 29, 2024. It is now read-only.

Commit

Permalink
Merge pull request #214 from Catatomik/dev
Browse files Browse the repository at this point in the history
✨💄⚡ Display schedules & destinations
  • Loading branch information
Catatomik authored Sep 13, 2023
2 parents b37b1f0 + 80c1f1d commit 5244e51
Show file tree
Hide file tree
Showing 10 changed files with 446 additions and 330 deletions.
2 changes: 1 addition & 1 deletion android/app/build.gradle
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ android {
minSdkVersion rootProject.ext.minSdkVersion
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 1
versionName "1.3.0"
versionName "1.4.0"
testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
aaptOptions {
// Files and dirs to omit from the packaged assets dir, modified to accommodate modern web apps.
Expand Down
284 changes: 121 additions & 163 deletions package-lock.json

Large diffs are not rendered by default.

10 changes: 5 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "tbmhelper",
"private": true,
"version": "1.3.0",
"version": "1.4.0",
"type": "module",
"scripts": {
"dev": "vite",
Expand Down Expand Up @@ -33,13 +33,13 @@
"@types/node": "^17",
"@vitejs/plugin-vue": "^4.3.4",
"@vue/eslint-config-prettier": "^8.0.0",
"@vue/eslint-config-typescript": "^11.0.3",
"@vue/eslint-config-typescript": "^12.0.0",
"@vue/tsconfig": "^0.4.0",
"eslint": "^8.48.0",
"eslint": "^8.49.0",
"eslint-plugin-vue": "^9.17.0",
"prettier": "^3.0.3",
"typescript": "^5.0.4",
"vite": "^4.4.9",
"vue-tsc": "^1.8.10"
"vue-tsc": "^1.8.11"
}
}
}
2 changes: 1 addition & 1 deletion src/components/BaseModal.vue
Original file line number Diff line number Diff line change
Expand Up @@ -56,7 +56,7 @@ onUpdated(async () => {
@keyup.esc="show(false)"
@click="show(false)"
>
<div class="m-auto w-fit duration-300 min-w-[66%]" @click="(e) => e.stopPropagation()">
<div class="m-auto w-fit duration-300" @click="(e) => e.stopPropagation()">
<div class="shadow-lg flex flex-col w-full rounded-md" :class="[bgColor]">
<div class="flex flex-shrink-0 items-center justify-between py-4 px-2 mx-2 border-b">
<slot name="title"></slot>
Expand Down
36 changes: 28 additions & 8 deletions src/components/BaseSettings.vue
Original file line number Diff line number Diff line change
Expand Up @@ -55,13 +55,13 @@ onUpdated(() => {
<div
ref="accordion"
class="flex overflow-hidden transition-all duration-500 max-w-0 max-h-fit mx-2 my-2 whitespace-nowrap bg-slate-300 rounded-lg"
:class="{ 'max-w-full': shown }"
:class="{ 'max-w-full': shown, 'h-0': !shown }"
>
<div class="m-2">
<div class="flex flex-col">
<div class="flex items-center">
<p class="mr-2">Incertitudes</p>
<span class="align-middle p-1 px-2 bg-slate-200 rounded-md">
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input
v-model="settings.uncertainty"
type="checkbox"
Expand All @@ -71,16 +71,26 @@ onUpdated(() => {
</div>
<div class="flex items-center mt-1">
<p class="mr-2">Affichage des dates</p>
<span class="align-middle p-1 px-2 bg-slate-200 rounded-md">
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input v-model="settings.dates" type="checkbox" @input="emit('update:modelValue', settings)" />
</span>
</div>
<div class="flex items-center mt-1">
<p class="mr-2">Affichage du retard</p>
<span class="align-middle p-1 px-2 bg-slate-200 rounded-md">
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input v-model="settings.delay" type="checkbox" @input="emit('update:modelValue', settings)" />
</span>
</div>
<div class="flex items-center mt-1">
<p class="mr-2">Horaires prévisionnels</p>
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input
v-model="settings.schedules"
type="checkbox"
@input="emit('update:modelValue', settings)"
/>
</span>
</div>
</div>
</div>
</div>
Expand All @@ -98,10 +108,10 @@ onUpdated(() => {
<h1 class="text-2xl text-center">Paramètres</h1>
</template>
<template #content>
<div class="flex flex-col">
<div class="flex flex-col px-2">
<div class="flex items-center">
<p class="mr-2">Incertitudes</p>
<span class="align-middle p-1 px-2 bg-slate-200 rounded-md">
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input
v-model="settings.uncertainty"
type="checkbox"
Expand All @@ -111,16 +121,26 @@ onUpdated(() => {
</div>
<div class="flex items-center mt-1">
<p class="mr-2">Affichage des dates</p>
<span class="align-middle p-1 px-2 bg-slate-200 rounded-md">
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input v-model="settings.dates" type="checkbox" @input="emit('update:modelValue', settings)" />
</span>
</div>
<div class="flex items-center mt-1">
<p class="mr-2">Affichage du retard</p>
<span class="align-middle p-1 px-2 bg-slate-200 rounded-md">
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input v-model="settings.delay" type="checkbox" @input="emit('update:modelValue', settings)" />
</span>
</div>
<div class="flex items-center mt-1">
<p class="mr-2">Horaires prévisionnels</p>
<span class="flex items-center p-1 bg-slate-200 rounded-md">
<input
v-model="settings.schedules"
type="checkbox"
@input="emit('update:modelValue', settings)"
/>
</span>
</div>
</div>
</template>
</BaseModal>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@ import type { OperatingRoute, RouteRealtimeInfos, VehicleJourneySchedule } from
export interface Modal {
route: OperatingRoute;
trip: RouteRealtimeInfos<"TREATED">;
trip?: RouteRealtimeInfos<"TREATED">;
journey: VehicleJourneySchedule<"TREATED">[];
settings: Settings;
}
const props = defineProps<Modal>();
defineProps<Modal>();
const emit = defineEmits<{
(e: "update:shown", shown: boolean): void;
Expand Down Expand Up @@ -63,34 +63,41 @@ onUpdated(async () => {
<div class="mx-auto my-5 w-fit h-auto duration-300" @click="(e) => e.stopPropagation()">
<div class="shadow-lg flex flex-col w-full h-full rounded-md bg-slate-100">
<div class="flex flex-shrink-0 items-center justify-between pt-4 p-2 mx-2 border-b">
<RouteHeader :route="props.route"></RouteHeader>
<RouteHeader :route="route"></RouteHeader>
<CloseButton class="ml-2 hover:scale-[110%] duration-300 justify-self-end" @click="show(false)" />
</div>
<div class="relative py-2 px-4 overflow-auto">
<div
v-for="schedule of props.journey.filter(
(schedule) => schedule.departure_time - trip.departure_delay >= Date.now(),
)"
v-for="schedule of trip
? journey.filter(
(schedule) => schedule.departure_time - (trip?.departure_delay ?? 0) >= Date.now(),
)
: journey"
:key="schedule.stop_point.id"
class="flex bg-slate-200 my-1 rounded-sm p-1"
>
<div class="mr-3">{{ schedule.stop_point.name }}</div>
<div
class="ml-auto"
:class="[
schedule.departure_time - trip.departure_delay - now < 3 * 60_000
Math.abs(schedule.departure_time - (trip?.departure_delay ?? 0) - now) < 3 * 60_000
? 'text-red-500'
: schedule.departure_time - trip.departure_delay - now < 5 * 60_000
: Math.abs(schedule.departure_time - (trip?.departure_delay ?? 0) - now) < 5 * 60_000
? 'text-orange-500'
: schedule.departure_time - trip.departure_delay - now < 10 * 60_000
: Math.abs(schedule.departure_time - (trip?.departure_delay ?? 0) - now) < 10 * 60_000
? 'text-emerald-500'
: '',
]"
>
{{
props.settings.dates
? dateCompact(schedule.departure_time - trip.departure_delay)
: duration(schedule.departure_time - trip.departure_delay - now, true, true) || "0s"
trip
? settings.dates
? dateCompact(schedule.departure_time - trip.departure_delay)
: duration(schedule.departure_time - trip.departure_delay - now, true, true) || "0s"
: settings.dates
? dateCompact(schedule.departure_time)
: (schedule.departure_time - now < 0 ? "-" : "") +
duration(schedule.departure_time - now, true, true) || "0s"
}}
</div>
</div>
Expand Down
95 changes: 71 additions & 24 deletions src/components/RouteHeader.vue
Original file line number Diff line number Diff line change
@@ -1,34 +1,81 @@
<script setup lang="ts">
import type { OperatingRoute } from "@/store/TBM";
import { ref, type Ref } from "vue";
export interface RouteHeader {
route: OperatingRoute;
destSelect?: boolean;
}
const props = defineProps<RouteHeader>();
const props = withDefaults(defineProps<RouteHeader>(), {
destSelect: false,
});
export type Checked = Record<
OperatingRoute["stopPointDetails"]["schedules"]["destinations"][number],
boolean
>;
const checked: Ref<Checked> = ref(
props.route.stopPointDetails.schedules.destinations.reduce((acc, v) => ({ ...acc, [v]: true }), {}),
);
const emit = defineEmits<{
(e: "update:checked", checked: Checked): void;
}>();
emit("update:checked", checked.value);
</script>

<template>
<img
v-if="'id' in props.route.lineDetails"
width="25"
class="inline align-middle"
:src="props.route.lineDetails.picto"
/>
<p class="mx-1 inline align-middle">
{{
props.route.stopPointDetails.route.line.type === "Bus" ||
props.route.stopPointDetails.route.line.type === "Autocar" ||
props.route.stopPointDetails.route.line.type === "Bus Scolaire"
? "🚌"
: props.route.stopPointDetails.route.line.type === "Tramway"
? "🚋"
: props.route.stopPointDetails.route.line.type === "Train régional / TER"
? "🚆"
: ""
}}
</p>
<h4 class="font-bold text-base py-1 inline align-middle">
{{ props.route.line.name }}
</h4>
<p class="inline align-middle ml-1">➜ {{ props.route.name }}</p>
<div>
<img
v-if="'id' in route.lineDetails"
width="25"
class="inline align-middle"
:src="route.lineDetails.picto"
/>
<p class="mx-1 inline align-middle">
{{
route.stopPointDetails.route.line.type === "Bus" ||
route.stopPointDetails.route.line.type === "Autocar" ||
route.stopPointDetails.route.line.type === "Bus Scolaire"
? "🚌"
: route.stopPointDetails.route.line.type === "Tramway"
? "🚋"
: route.stopPointDetails.route.line.type === "Train régional / TER"
? "🚆"
: ""
}}
</p>
<h4 class="font-bold text-base py-1 inline align-middle">
{{ route.line.name }}
</h4>
</div>
<div v-if="destSelect" class="mt-1">
<div
v-for="destination in route.stopPointDetails.schedules.destinations"
:key="destination"
class="mt-1 w-fit"
>
<span
class="flex items-center dest rounded px-1"
:class="[
route.stopPointDetails.schedules.destinations.length > 1
? `dest-${route.stopPointDetails.schedules.destinations.indexOf(destination).toLocaleString()}`
: 'border-transparent',
]"
>
<input
v-if="route.stopPointDetails.schedules.destinations.length > 1"
v-model="checked[destination]"
type="checkbox"
@input="emit('update:checked', checked)"
/>
<p v-else class="inline">➜</p>
<p class="inline ml-2">
{{ destination }}
</p>
</span>
</div>
</div>
</template>
Loading

0 comments on commit 5244e51

Please sign in to comment.