diff --git a/client/src/state.ts b/client/src/state.ts index cb842b6..b875b56 100644 --- a/client/src/state.ts +++ b/client/src/state.ts @@ -1,6 +1,5 @@ import { reactive } from "vue" import { Track } from "./track" -import { Tick } from './ticks' import { error } from "./error" enum State { @@ -18,7 +17,7 @@ export const state = reactive({ source.addEventListener('message', event => console.log(event)) source.addEventListener('TickAdded', event => { console.log(event) - const tick: Tick = Tick.fromJSON(JSON.parse(event.data)) + const tick: Tick = JSON.parse(event.data) const tracks = this.tracks.map(track => { if (track.id === tick.track_id) { const ticks = track.ticks ?? [] @@ -30,12 +29,9 @@ export const state = reactive({ }) this.tracks = tracks }) - source.addEventListener('TrackAdded', ({ data }) => { - const track: Track = Track.fromJSON(JSON.parse(data)) - this.tracks = [track, ...this.tracks] - }) source.addEventListener('TickDropped', event => { - const tick: Tick = Tick.fromJSON(JSON.parse(event.data)) + console.log(event) + const tick: Tick = JSON.parse(event.data) const tracks = this.tracks.map(track => { if (track.id === tick.track_id) { track.ticks = track.ticks?.filter($tick => $tick.id !== tick.id) @@ -44,14 +40,6 @@ export const state = reactive({ }) this.tracks = tracks }) - source.addEventListener('TrackDropped', ({ data }) => { - const track: Track = Track.fromJSON(JSON.parse(data)) - this.tracks = this.tracks.filter($track => $track.id !== track.id) - }) - source.addEventListener('TrackChanged', ({ data }) => { - const track: Track = Track.fromJSON(JSON.parse(data)) - this.tracks = this.tracks.map($track => $track.id === track.id ? track : $track) - }) source.addEventListener('Lagged', event => { console.log(event) // Refresh the page, refetching the list of tracks and ticks @@ -92,7 +80,7 @@ export const state = reactive({ if (!ok) error(`error deleting ticks for ${track.id}: ${statusText} (${status})`) }, - async addTrack(track: Track): Promise { + async addTrack(track: Track) { const response = await fetch('/api/v1/tracks', { method: "POST", body: JSON.stringify(track), @@ -100,7 +88,6 @@ export const state = reactive({ }) if (!response.ok) error(`error submitting track: ${track}: ${response.statusText} (${response.status})`) - return response.ok }, async removeTrack(trackID: number) { const response = await fetch(`/api/v1/tracks/${trackID}`, { method: "DELETE" }) diff --git a/client/src/ticks.ts b/client/src/ticks.ts index d50b9ba..895682b 100644 --- a/client/src/ticks.ts +++ b/client/src/ticks.ts @@ -1,4 +1,4 @@ -export interface ITick { +interface ITick { id: number track_id?: number year?: number @@ -10,7 +10,7 @@ export interface ITick { has_time_info?: number } -export class Tick implements ITick { +class Tick implements ITick { id: number track_id?: number year?: number diff --git a/client/src/views/NewTrackView.vue b/client/src/views/NewTrackView.vue index 8b2ed62..8ec15bc 100644 --- a/client/src/views/NewTrackView.vue +++ b/client/src/views/NewTrackView.vue @@ -4,7 +4,7 @@ import { Track } from '../track'; import { computed, ref } from 'vue'; import { state } from '../state'; -const props = defineProps<{ initialState?: Track }>() +const props = defineProps<{initialState?: Track}>() const router = useRouter() const name = ref(props.initialState?.name ?? "") @@ -12,22 +12,19 @@ const description = ref(props.initialState?.description?.toString() ?? "") const icon = ref(props.initialState?.icon ?? "") const enabled = ref(props.initialState?.enabled ?? true) const multipleEntriesPerDay = ref(props.initialState?.multiple_entries_per_day ?? false) -const color = ref(props.initialState?.color ?? undefined) -const order = ref(props.initialState?.order ?? undefined) +const color = ref(props.initialState?.color ?? null) +const order = ref(props.initialState?.order ?? null) const submittingNow = ref(false) const submitButtonClass = computed(() => 'button is-primary' + (submittingNow.value ? ' is-loading' : '')) const submit = async () => { submittingNow.value = true - // if you make a change to order then erase the value in the box it's "" - if (order.value === "") order.value = undefined - if (order.value instanceof String || typeof order.value === 'string') order.value = Number(order.value) const track = new Track(undefined, name.value, description.value, icon.value, Number(enabled.value), Number(multipleEntriesPerDay.value), color.value, order.value) - if (await state.addTrack(track)) - router.push('/') + await state.addTrack(track) + router.push('/') }