All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 59s
- 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
173 lines
4.3 KiB
TypeScript
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
|
|
}
|
|
}
|