diff --git a/client/.yarn/install-state.gz b/client/.yarn/install-state.gz index 3f84452..c0c704a 100644 Binary files a/client/.yarn/install-state.gz and b/client/.yarn/install-state.gz differ diff --git a/client/app/components.d.ts b/client/app/components.d.ts index 7300bc5..e880887 100644 --- a/client/app/components.d.ts +++ b/client/app/components.d.ts @@ -15,6 +15,8 @@ declare module 'vue' { PrimeCard: typeof import('primevue/card')['default'] PrimeDivider: typeof import('primevue/divider')['default'] PrimeFloatLabel: typeof import('primevue/floatlabel')['default'] + PrimeInputGroup: typeof import('primevue/inputgroup')['default'] + PrimeInputGroupAddon: typeof import('primevue/inputgroupaddon')['default'] PrimeInputText: typeof import('primevue/inputtext')['default'] PrimePassword: typeof import('primevue/password')['default'] PrimeProgressBar: typeof import('primevue/progressbar')['default'] @@ -23,6 +25,7 @@ declare module 'vue' { PrimeSelectButton: typeof import('primevue/selectbutton')['default'] PrimeSlider: typeof import('primevue/slider')['default'] PrimeTag: typeof import('primevue/tag')['default'] + PrimeTextarea: typeof import('primevue/textarea')['default'] PrimeToast: typeof import('primevue/toast')['default'] PrimeToggleSwitch: typeof import('primevue/toggleswitch')['default'] RouterLink: typeof import('vue-router')['RouterLink'] diff --git a/client/app/composables/use-chat.ts b/client/app/composables/use-chat.ts new file mode 100644 index 0000000..116959e --- /dev/null +++ b/client/app/composables/use-chat.ts @@ -0,0 +1,55 @@ +import { createGlobalState } from '@vueuse/core' + +export interface ChatClientMessage { + text: string + replyTo?: { + messageId: string + } +} + +export interface ChatMessage { + id: string + sender: string + text: string + createdAt: string + replyTo?: { + messageId: string + sender: string + text: string + } +} + +export const useChat = createGlobalState(() => { + const signaling = useSignaling() + const { emit } = useEventBus() + + const messages = shallowRef([]) + + watch(signaling.socket, (socket) => { + if (!socket) + return + + socket.on('chat:new-message', (message: ChatMessage) => { + messages.value.push(message) + triggerRef(messages) + + emit('chat:new-message') + }) + + socket.on('disconnect', () => { + messages.value = [] + }) + }, { immediate: true }) + + function sendMessage(message: ChatClientMessage) { + if (!signaling.connected.value) + return + + signaling.socket.value!.emit('chat:message', message) + } + + return { + messages, + sendMessage, + } +}) diff --git a/client/app/composables/use-event-bus.ts b/client/app/composables/use-event-bus.ts index 25a7384..b11541e 100644 --- a/client/app/composables/use-event-bus.ts +++ b/client/app/composables/use-event-bus.ts @@ -29,6 +29,8 @@ export interface AppEvents extends Record { 'video:disabled': void 'share:enabled': void 'share:disabled': void + + 'chat:new-message': void } const emitter = mitt() diff --git a/client/app/composables/use-sfx.ts b/client/app/composables/use-sfx.ts index f0117e4..109d0dc 100644 --- a/client/app/composables/use-sfx.ts +++ b/client/app/composables/use-sfx.ts @@ -15,7 +15,7 @@ function hashStringToNumber(str: string, cap: number): number { const oneShots: Howl[] = [] -type SfxEvent = 'mic-on' | 'mic-off' | 'stream-on' | 'stream-off' | 'connection' +type SfxEvent = 'mic-on' | 'mic-off' | 'stream-on' | 'stream-off' | 'connection' | 'message' const EVENT_VOLUME: Record = { 'mic-on': 0.2, diff --git a/client/app/composables/use-signaling.ts b/client/app/composables/use-signaling.ts index 9e21462..2ce6e07 100644 --- a/client/app/composables/use-signaling.ts +++ b/client/app/composables/use-signaling.ts @@ -66,7 +66,7 @@ export const useSignaling = createSharedComposable(() => { const uri = host ? `${protocol}//${host}` : `` - socket.value = io(`${uri}/webrtc`, { + socket.value = io(uri, { path: `${pathname}/ws`, transports: ['websocket'], withCredentials: true, diff --git a/client/app/layouts/default.vue b/client/app/layouts/default.vue index e64aaaf..9543290 100644 --- a/client/app/layouts/default.vue +++ b/client/app/layouts/default.vue @@ -56,11 +56,9 @@ - -
- -
-
+
+ +
diff --git a/client/app/pages/gallery.vue b/client/app/pages/gallery.vue index c077f7d..b85d190 100644 --- a/client/app/pages/gallery.vue +++ b/client/app/pages/gallery.vue @@ -1,5 +1,5 @@ diff --git a/client/app/pages/preferences.vue b/client/app/pages/preferences.vue index cf8a570..1305e97 100644 --- a/client/app/pages/preferences.vue +++ b/client/app/pages/preferences.vue @@ -1,5 +1,5 @@ - +