Files
nucleoWhisper/nuxt4/app/composables/useFrigateEvents.ts
josedario87 8e555b543d
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 59s
Agregar dropdown de eventos Frigate y corregir endpoint de creacion
- Agregar toggle Live/Eventos en StreamViewer
- Agregar dropdown para seleccionar eventos recientes (max 10)
- Reproducir clips de eventos en el mismo reproductor
- Crear endpoint proxy /api/frigate/events para listar eventos
- Corregir URL de creacion de eventos: /api/events/:camera/:label/create
- Actualizar useFrigateEvents con fetchEvents, formatEventTime, getEventClipUrl
2025-12-30 04:02:36 -06:00

173 lines
4.3 KiB
TypeScript

/**
* Composable para gestionar eventos de Frigate
* Usa proxy backend para evitar problemas de CORS/cookies entre subdominios
* API Proxy: /api/frigate/event, /api/frigate/events
*/
export interface FrigateEventParams {
label: string
sub_label?: string
duration?: number
include_recording?: boolean
draw?: {
boxes?: Array<{
box: [number, number, number, number]
color?: [number, number, number]
score?: number
}>
}
}
export interface FrigateEventResponse {
success: boolean
event_id?: string
message?: string
}
export interface FrigateEvent {
id: string
label: string
sub_label?: string
camera: string
start_time: number
end_time?: number
has_clip: boolean
has_snapshot: boolean
zones: string[]
}
export const useFrigateEvents = () => {
const FRIGATE_PUBLIC_URL = 'https://camaras.nucleoriofrio.com'
const isCreating = useState<boolean>('frigate_creating', () => false)
const isLoadingEvents = useState<boolean>('frigate_loading_events', () => false)
const error = useState<string | null>('frigate_error', () => null)
const lastEventId = useState<string | null>('frigate_last_event', () => null)
const events = useState<FrigateEvent[]>('frigate_events', () => [])
/**
* Obtiene los eventos recientes de una camara
*/
const fetchEvents = async (camera?: string, limit: number = 10): Promise<FrigateEvent[]> => {
isLoadingEvents.value = true
error.value = null
try {
const params = new URLSearchParams()
if (camera) {
params.set('camera', camera)
}
params.set('limit', limit.toString())
const response = await $fetch<FrigateEvent[]>(`/api/frigate/events?${params.toString()}`)
events.value = response
return response
} catch (err: unknown) {
const errorMessage = (err as Error)?.message || 'Error al obtener eventos'
error.value = errorMessage
console.error('[Frigate] Error fetching events:', err)
return []
} finally {
isLoadingEvents.value = false
}
}
/**
* Genera la URL del clip de un evento
*/
const getEventClipUrl = (eventId: string): string => {
return `${FRIGATE_PUBLIC_URL}/api/events/${eventId}/clip.mp4`
}
/**
* Genera la URL del snapshot de un evento
*/
const getEventSnapshotUrl = (eventId: string): string => {
return `${FRIGATE_PUBLIC_URL}/api/events/${eventId}/snapshot.jpg`
}
/**
* Formatea la fecha de un evento
*/
const formatEventTime = (timestamp: number): string => {
const date = new Date(timestamp * 1000)
return date.toLocaleString('es-ES', {
day: '2-digit',
month: '2-digit',
hour: '2-digit',
minute: '2-digit'
})
}
/**
* Crea un evento en Frigate para una camara especifica via proxy
*/
const createEvent = async (
camera: string,
params: FrigateEventParams
): Promise<FrigateEventResponse> => {
isCreating.value = true
error.value = null
try {
const response = await $fetch<FrigateEventResponse>('/api/frigate/event', {
method: 'POST',
body: {
camera,
...params
}
})
if (response.event_id) {
lastEventId.value = response.event_id
}
return { success: true, ...response }
} catch (err: unknown) {
const errorMessage = (err as Error)?.message || 'Error al crear evento'
error.value = errorMessage
console.error('[Frigate] Error creating event:', err)
return { success: false, message: errorMessage }
} finally {
isCreating.value = false
}
}
/**
* Crea un evento rapido "eventoWhisper" de 1 minuto
*/
const createQuickEvent = async (camera: string): Promise<FrigateEventResponse> => {
return createEvent(camera, {
label: 'eventoWhisper',
duration: 60,
include_recording: true
})
}
/**
* Limpia el error
*/
const clearError = () => {
error.value = null
}
return {
// Estado
isCreating: readonly(isCreating),
isLoadingEvents: readonly(isLoadingEvents),
error: readonly(error),
lastEventId: readonly(lastEventId),
events: readonly(events),
// Métodos
fetchEvents,
getEventClipUrl,
getEventSnapshotUrl,
formatEventTime,
createEvent,
createQuickEvent,
clearError
}
}