Break apart view.ts into multiple files.
This commit is contained in:
@@ -1,7 +1,7 @@
|
|||||||
import { HomeAssistant } from 'custom-card-helpers';
|
import { HomeAssistant } from 'custom-card-helpers';
|
||||||
import { CameraConfig } from '../types';
|
import { CameraConfig } from '../types';
|
||||||
import { MediaQueries, MediaQueriesResults } from '../view';
|
import { MediaQueriesResults } from "../view/media-queries-results";
|
||||||
import { ViewMedia } from '../view-media';
|
import { ViewMedia } from '../view/media';
|
||||||
import {
|
import {
|
||||||
EventQuery,
|
EventQuery,
|
||||||
PartialEventQuery,
|
PartialEventQuery,
|
||||||
@@ -11,6 +11,7 @@ import {
|
|||||||
RecordingQuery,
|
RecordingQuery,
|
||||||
RecordingSegmentsQuery,
|
RecordingSegmentsQuery,
|
||||||
} from './types';
|
} from './types';
|
||||||
|
import { MediaQueries } from '../view/media-queries';
|
||||||
|
|
||||||
export const CAMERA_MANAGER_ENGINE_EVENT_LIMIT_DEFAULT = 10000;
|
export const CAMERA_MANAGER_ENGINE_EVENT_LIMIT_DEFAULT = 10000;
|
||||||
|
|
||||||
|
|||||||
@@ -5,8 +5,10 @@ import getUnixTime from 'date-fns/getUnixTime';
|
|||||||
import startOfHour from 'date-fns/startOfHour';
|
import startOfHour from 'date-fns/startOfHour';
|
||||||
import { CAMERA_BIRDSEYE } from '../../const';
|
import { CAMERA_BIRDSEYE } from '../../const';
|
||||||
import { CameraConfig, RecordingSegment } from '../../types';
|
import { CameraConfig, RecordingSegment } from '../../types';
|
||||||
import { MediaQueries, MediaQueriesClassifier, MediaQueriesResults } from '../../view';
|
import { MediaQueriesResults } from "../../view/media-queries-results";
|
||||||
import { ViewMedia, ViewMediaClassifier, ViewMediaFactory } from '../../view-media';
|
import { MediaQueriesClassifier } from "../../view/media-queries-classifier";
|
||||||
|
import { ViewMedia, ViewMediaFactory } from '../../view/media';
|
||||||
|
import { ViewMediaClassifier } from "../../view/media-classifier";
|
||||||
import { errorToConsole } from '../../utils/basic';
|
import { errorToConsole } from '../../utils/basic';
|
||||||
import { RecordingSegmentsCache } from '../cache';
|
import { RecordingSegmentsCache } from '../cache';
|
||||||
import {
|
import {
|
||||||
@@ -33,6 +35,7 @@ import {
|
|||||||
} from '../types';
|
} from '../types';
|
||||||
import { FrigateRecording, RecordingSummary } from './types';
|
import { FrigateRecording, RecordingSummary } from './types';
|
||||||
import { getEvents, getRecordingSegments, getRecordingsSummary, NativeFrigateEventQuery, NativeFrigateRecordingSegmentsQuery, retainEvent } from './requests';
|
import { getEvents, getRecordingSegments, getRecordingsSummary, NativeFrigateEventQuery, NativeFrigateRecordingSegmentsQuery, retainEvent } from './requests';
|
||||||
|
import { MediaQueries } from '../../view/media-queries';
|
||||||
|
|
||||||
const EVENT_REQUEST_CACHE_MAX_AGE_SECONDS = 60;
|
const EVENT_REQUEST_CACHE_MAX_AGE_SECONDS = 60;
|
||||||
const RECORDING_SUMMARY_REQUEST_CACHE_MAX_AGE_SECONDS = 60;
|
const RECORDING_SUMMARY_REQUEST_CACHE_MAX_AGE_SECONDS = 60;
|
||||||
|
|||||||
@@ -21,9 +21,10 @@ import {
|
|||||||
} from './types.js';
|
} from './types.js';
|
||||||
import orderBy from 'lodash-es/orderBy';
|
import orderBy from 'lodash-es/orderBy';
|
||||||
import { CameraManagerEngineFactory } from './engine-factory.js';
|
import { CameraManagerEngineFactory } from './engine-factory.js';
|
||||||
import { ViewMedia } from '../view-media.js';
|
import { ViewMedia } from '../view/media.js';
|
||||||
import { MediaQueries, MediaQueriesResults } from '../view.js';
|
import { MediaQueriesResults } from '../view/media-queries-results';
|
||||||
import { MemoryRequestCache } from './cache.js';
|
import { MemoryRequestCache } from './cache.js';
|
||||||
|
import { MediaQueries } from '../view/media-queries.js';
|
||||||
|
|
||||||
export class QueryClassifier {
|
export class QueryClassifier {
|
||||||
public static isEventQuery(query: DataQuery | PartialDataQuery): query is EventQuery {
|
public static isEventQuery(query: DataQuery | PartialDataQuery): query is EventQuery {
|
||||||
|
|||||||
+1
-1
@@ -88,7 +88,7 @@ import {
|
|||||||
import { ResolvedMediaCache } from './utils/ha/resolved-media.js';
|
import { ResolvedMediaCache } from './utils/ha/resolved-media.js';
|
||||||
import { supportsFeature } from './utils/ha/update.js';
|
import { supportsFeature } from './utils/ha/update.js';
|
||||||
import { isValidMediaLoadedInfo } from './utils/media-info.js';
|
import { isValidMediaLoadedInfo } from './utils/media-info.js';
|
||||||
import { View } from './view.js';
|
import { View } from './view/view.js';
|
||||||
import pkg from '../package.json';
|
import pkg from '../package.json';
|
||||||
import { ViewContext } from 'view';
|
import { ViewContext } from 'view';
|
||||||
import { CameraManager } from './camera/manager.js';
|
import { CameraManager } from './camera/manager.js';
|
||||||
|
|||||||
@@ -23,7 +23,7 @@ import {
|
|||||||
} from '../utils/ha/browse-media';
|
} from '../utils/ha/browse-media';
|
||||||
import { changeViewToRecentEventsForCameraAndDependents, changeViewToRecentRecordingForCameraAndDependents } from '../utils/media-to-view.js';
|
import { changeViewToRecentEventsForCameraAndDependents, changeViewToRecentRecordingForCameraAndDependents } from '../utils/media-to-view.js';
|
||||||
import { CameraManager } from '../camera/manager.js';
|
import { CameraManager } from '../camera/manager.js';
|
||||||
import { View } from '../view.js';
|
import { View } from '../view/view.js';
|
||||||
import { renderProgressIndicator } from './message.js';
|
import { renderProgressIndicator } from './message.js';
|
||||||
import './thumbnail.js';
|
import './thumbnail.js';
|
||||||
import { THUMBNAIL_DETAILS_WIDTH_MIN } from './thumbnail.js';
|
import { THUMBNAIL_DETAILS_WIDTH_MIN } from './thumbnail.js';
|
||||||
|
|||||||
@@ -22,7 +22,7 @@ import {
|
|||||||
createMediaLoadedInfo,
|
createMediaLoadedInfo,
|
||||||
dispatchExistingMediaLoadedInfoAsEvent,
|
dispatchExistingMediaLoadedInfoAsEvent,
|
||||||
} from '../utils/media-info.js';
|
} from '../utils/media-info.js';
|
||||||
import { View } from '../view.js';
|
import { View } from '../view/view.js';
|
||||||
import { dispatchErrorMessageEvent } from './message.js';
|
import { dispatchErrorMessageEvent } from './message.js';
|
||||||
import { contentsChanged } from '../utils/basic.js';
|
import { contentsChanged } from '../utils/basic.js';
|
||||||
import isEqual from 'lodash-es/isEqual';
|
import isEqual from 'lodash-es/isEqual';
|
||||||
|
|||||||
@@ -37,7 +37,7 @@ import {
|
|||||||
dispatchExistingMediaLoadedInfoAsEvent,
|
dispatchExistingMediaLoadedInfoAsEvent,
|
||||||
dispatchMediaUnloadedEvent,
|
dispatchMediaUnloadedEvent,
|
||||||
} from '../../utils/media-info.js';
|
} from '../../utils/media-info.js';
|
||||||
import { dispatchViewContextChangeEvent, View } from '../../view.js';
|
import { dispatchViewContextChangeEvent, View } from '../../view/view.js';
|
||||||
import { AutoMediaPlugin } from './../embla-plugins/automedia.js';
|
import { AutoMediaPlugin } from './../embla-plugins/automedia.js';
|
||||||
import { Lazyload } from './../embla-plugins/lazyload.js';
|
import { Lazyload } from './../embla-plugins/lazyload.js';
|
||||||
import {
|
import {
|
||||||
|
|||||||
@@ -17,7 +17,7 @@ import {
|
|||||||
} from '../types.js';
|
} from '../types.js';
|
||||||
import { contentsChanged, dispatchFrigateCardEvent } from '../utils/basic.js';
|
import { contentsChanged, dispatchFrigateCardEvent } from '../utils/basic.js';
|
||||||
import { CameraManager } from '../camera/manager.js';
|
import { CameraManager } from '../camera/manager.js';
|
||||||
import { View } from '../view.js';
|
import { View } from '../view/view.js';
|
||||||
import { ThumbnailCarouselTap } from './thumbnail-carousel.js';
|
import { ThumbnailCarouselTap } from './thumbnail-carousel.js';
|
||||||
import './surround-basic.js';
|
import './surround-basic.js';
|
||||||
import { changeViewToRecentEventsForCameraAndDependents } from '../utils/media-to-view';
|
import { changeViewToRecentEventsForCameraAndDependents } from '../utils/media-to-view';
|
||||||
|
|||||||
@@ -19,7 +19,8 @@ import {
|
|||||||
} from '../types.js';
|
} from '../types.js';
|
||||||
import { stopEventFromActivatingCardWideActions } from '../utils/action.js';
|
import { stopEventFromActivatingCardWideActions } from '../utils/action.js';
|
||||||
import { dispatchFrigateCardEvent } from '../utils/basic.js';
|
import { dispatchFrigateCardEvent } from '../utils/basic.js';
|
||||||
import { MediaQueriesResults, View } from '../view.js';
|
import { View } from '../view/view.js';
|
||||||
|
import { MediaQueriesResults } from "../view/media-queries-results";
|
||||||
import { FrigateCardCarousel } from './carousel.js';
|
import { FrigateCardCarousel } from './carousel.js';
|
||||||
import './thumbnail.js';
|
import './thumbnail.js';
|
||||||
import './carousel.js';
|
import './carousel.js';
|
||||||
|
|||||||
@@ -13,12 +13,12 @@ import { getDurationString, prettifyTitle } from '../utils/basic.js';
|
|||||||
import { getCameraTitle } from '../utils/camera.js';
|
import { getCameraTitle } from '../utils/camera.js';
|
||||||
import { renderTask } from '../utils/task.js';
|
import { renderTask } from '../utils/task.js';
|
||||||
import { createFetchThumbnailTask } from '../utils/thumbnail.js';
|
import { createFetchThumbnailTask } from '../utils/thumbnail.js';
|
||||||
import { View } from '../view.js';
|
import { View } from '../view/view.js';
|
||||||
import type { MediaSeek } from './viewer.js';
|
import type { MediaSeek } from './viewer.js';
|
||||||
import { TaskStatus } from '@lit-labs/task';
|
import { TaskStatus } from '@lit-labs/task';
|
||||||
|
|
||||||
import type { CameraConfig, ExtendedHomeAssistant } from '../types.js';
|
import type { CameraConfig, ExtendedHomeAssistant } from '../types.js';
|
||||||
import { ViewMedia } from '../view-media.js';
|
import { ViewMedia } from '../view/media.js';
|
||||||
import { CameraManager } from '../camera/manager.js';
|
import { CameraManager } from '../camera/manager.js';
|
||||||
|
|
||||||
// The minimum width of a thumbnail with details enabled.
|
// The minimum width of a thumbnail with details enabled.
|
||||||
|
|||||||
@@ -50,12 +50,15 @@ import {
|
|||||||
generateMediaViewerContext,
|
generateMediaViewerContext,
|
||||||
} from '../utils/media-to-view';
|
} from '../utils/media-to-view';
|
||||||
import { CameraManager } from '../camera/manager';
|
import { CameraManager } from '../camera/manager';
|
||||||
import { EventMediaQueries, MediaQueries, MediaQueriesClassifier, View } from '../view';
|
import { EventMediaQueries, MediaQueries } from "../view/media-queries";
|
||||||
|
import { MediaQueriesClassifier } from "../view/media-queries-classifier";
|
||||||
import { dispatchMessageEvent } from './message.js';
|
import { dispatchMessageEvent } from './message.js';
|
||||||
import './thumbnail.js';
|
import './thumbnail.js';
|
||||||
import { FrigateCardTimelineItem, TimelineDataSource } from '../utils/timeline-source';
|
import { FrigateCardTimelineItem, TimelineDataSource } from '../utils/timeline-source';
|
||||||
import { ViewMedia, ViewMediaClassifier } from '../view-media';
|
import { ViewMedia } from '../view/media';
|
||||||
|
import { ViewMediaClassifier } from "../view/media-classifier";
|
||||||
import { rangesOverlap } from '../camera/range';
|
import { rangesOverlap } from '../camera/range';
|
||||||
|
import { View } from '../view/view';
|
||||||
|
|
||||||
interface FrigateCardGroupData {
|
interface FrigateCardGroupData {
|
||||||
id: string;
|
id: string;
|
||||||
|
|||||||
@@ -3,7 +3,7 @@ import { customElement, property } from 'lit/decorators.js';
|
|||||||
import timelineStyle from '../scss/timeline.scss';
|
import timelineStyle from '../scss/timeline.scss';
|
||||||
import { CameraConfig, ExtendedHomeAssistant, TimelineConfig } from '../types';
|
import { CameraConfig, ExtendedHomeAssistant, TimelineConfig } from '../types';
|
||||||
import { CameraManager } from '../camera/manager';
|
import { CameraManager } from '../camera/manager';
|
||||||
import { View } from '../view';
|
import { View } from '../view/view';
|
||||||
import './surround.js';
|
import './surround.js';
|
||||||
import './timeline-core.js';
|
import './timeline-core.js';
|
||||||
|
|
||||||
|
|||||||
@@ -30,7 +30,9 @@ import { stopEventFromActivatingCardWideActions } from '../utils/action.js';
|
|||||||
import { contentsChanged } from '../utils/basic.js';
|
import { contentsChanged } from '../utils/basic.js';
|
||||||
import { getFullDependentBrowseMediaQueryParametersOrDispatchError } from '../utils/ha/browse-media.js';
|
import { getFullDependentBrowseMediaQueryParametersOrDispatchError } from '../utils/ha/browse-media.js';
|
||||||
import { ResolvedMediaCache, resolveMedia } from '../utils/ha/resolved-media.js';
|
import { ResolvedMediaCache, resolveMedia } from '../utils/ha/resolved-media.js';
|
||||||
import { MediaQueriesClassifier, MediaQueriesResults, View } from '../view.js';
|
import { View } from '../view/view.js';
|
||||||
|
import { MediaQueriesResults } from "../view/media-queries-results";
|
||||||
|
import { MediaQueriesClassifier } from "../view/media-queries-classifier";
|
||||||
import { AutoMediaPlugin } from './embla-plugins/automedia.js';
|
import { AutoMediaPlugin } from './embla-plugins/automedia.js';
|
||||||
import { Lazyload } from './embla-plugins/lazyload.js';
|
import { Lazyload } from './embla-plugins/lazyload.js';
|
||||||
import {
|
import {
|
||||||
@@ -51,7 +53,8 @@ import {
|
|||||||
changeViewToRecentEventsForCameraAndDependents,
|
changeViewToRecentEventsForCameraAndDependents,
|
||||||
changeViewToRecentRecordingForCameraAndDependents,
|
changeViewToRecentRecordingForCameraAndDependents,
|
||||||
} from '../utils/media-to-view.js';
|
} from '../utils/media-to-view.js';
|
||||||
import { ViewMedia, ViewMediaClassifier } from '../view-media.js';
|
import { ViewMedia } from '../view/media.js';
|
||||||
|
import { ViewMediaClassifier } from "../view/media-classifier";
|
||||||
import { guard } from 'lit/directives/guard.js';
|
import { guard } from 'lit/directives/guard.js';
|
||||||
import { localize } from '../localize/localize.js';
|
import { localize } from '../localize/localize.js';
|
||||||
|
|
||||||
|
|||||||
@@ -4,10 +4,12 @@ import startOfHour from 'date-fns/startOfHour';
|
|||||||
import sub from 'date-fns/sub';
|
import sub from 'date-fns/sub';
|
||||||
import { ViewContext } from 'view';
|
import { ViewContext } from 'view';
|
||||||
import { CameraConfig, ClipsOrSnapshotsOrAll, FrigateCardView, RecordingSegment } from '../types';
|
import { CameraConfig, ClipsOrSnapshotsOrAll, FrigateCardView, RecordingSegment } from '../types';
|
||||||
import { EventMediaQueries, RecordingMediaQueries, View } from '../view';
|
import { View } from '../view/view';
|
||||||
|
import { EventMediaQueries, RecordingMediaQueries } from "../view/media-queries";
|
||||||
import { CameraManager } from '../camera/manager';
|
import { CameraManager } from '../camera/manager';
|
||||||
import { getAllDependentCameras } from './camera.js';
|
import { getAllDependentCameras } from './camera.js';
|
||||||
import { ViewMedia, ViewMediaClassifier } from '../view-media';
|
import { ViewMedia } from '../view/media';
|
||||||
|
import { ViewMediaClassifier } from "../view/media-classifier";
|
||||||
import { HomeAssistant } from 'custom-card-helpers';
|
import { HomeAssistant } from 'custom-card-helpers';
|
||||||
|
|
||||||
export const changeViewToRecentEventsForCameraAndDependents = async (
|
export const changeViewToRecentEventsForCameraAndDependents = async (
|
||||||
|
|||||||
@@ -7,8 +7,8 @@ import { CameraConfig, ClipsOrSnapshotsOrAll, RecordingSegment } from '../types'
|
|||||||
import { CameraManager } from '../camera/manager';
|
import { CameraManager } from '../camera/manager';
|
||||||
import { EventQuery } from '../camera/types';
|
import { EventQuery } from '../camera/types';
|
||||||
import { capEndDate, convertRangeToCacheFriendlyTimes } from '../camera/util';
|
import { capEndDate, convertRangeToCacheFriendlyTimes } from '../camera/util';
|
||||||
import { EventMediaQueries } from '../view';
|
import { EventMediaQueries } from "../view/media-queries";
|
||||||
import { ViewMedia } from '../view-media';
|
import { ViewMedia } from '../view/media';
|
||||||
import { compressRanges, ExpiringMemoryRangeSet, MemoryRangeSet } from '../camera/range';
|
import { compressRanges, ExpiringMemoryRangeSet, MemoryRangeSet } from '../camera/range';
|
||||||
import { ModifyInterface } from './basic';
|
import { ModifyInterface } from './basic';
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,53 @@
|
|||||||
|
import { ModifyInterface } from '../utils/basic.js';
|
||||||
|
import { ViewMedia, FrigateEventViewMedia, FrigateRecordingViewMedia } from './media';
|
||||||
|
|
||||||
|
export class ViewMediaClassifier {
|
||||||
|
public static isFrigateMedia(
|
||||||
|
media: ViewMedia,
|
||||||
|
): media is FrigateEventViewMedia | FrigateRecordingViewMedia {
|
||||||
|
return this.isFrigateEvent(media) || this.isFrigateRecording(media);
|
||||||
|
}
|
||||||
|
public static isFrigateEvent(media: ViewMedia): media is FrigateEventViewMedia {
|
||||||
|
return media instanceof FrigateEventViewMedia;
|
||||||
|
}
|
||||||
|
public static isFrigateRecording(
|
||||||
|
media: ViewMedia,
|
||||||
|
): media is FrigateRecordingViewMedia {
|
||||||
|
return media instanceof FrigateRecordingViewMedia;
|
||||||
|
}
|
||||||
|
|
||||||
|
// Typescript conveniences.
|
||||||
|
public static isMediaWithStartEndTime(media: ViewMedia): media is ModifyInterface<
|
||||||
|
ViewMedia,
|
||||||
|
{
|
||||||
|
getStartTime(): Date;
|
||||||
|
getEndTime(): Date;
|
||||||
|
}
|
||||||
|
> {
|
||||||
|
return !!media.getStartTime() && !!media.getEndTime();
|
||||||
|
}
|
||||||
|
public static isMediaWithStartTime(media: ViewMedia): media is ModifyInterface<
|
||||||
|
ViewMedia,
|
||||||
|
{
|
||||||
|
getStartTime(): Date;
|
||||||
|
}
|
||||||
|
> {
|
||||||
|
return !!media.getStartTime();
|
||||||
|
}
|
||||||
|
public static isMediaWithEndTime(media: ViewMedia): media is ModifyInterface<
|
||||||
|
ViewMedia,
|
||||||
|
{
|
||||||
|
getEndTime(): Date;
|
||||||
|
}
|
||||||
|
> {
|
||||||
|
return !!media.getEndTime();
|
||||||
|
}
|
||||||
|
public static isMediaWithID(media: ViewMedia): media is ModifyInterface<
|
||||||
|
ViewMedia,
|
||||||
|
{
|
||||||
|
getID(): string;
|
||||||
|
}
|
||||||
|
> {
|
||||||
|
return !!media.getID();
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,15 @@
|
|||||||
|
import { EventMediaQueries, MediaQueries, RecordingMediaQueries } from './media-queries';
|
||||||
|
|
||||||
|
export class MediaQueriesClassifier {
|
||||||
|
public static areEventQueries(
|
||||||
|
queries?: MediaQueries | null,
|
||||||
|
): queries is EventMediaQueries {
|
||||||
|
return queries instanceof EventMediaQueries;
|
||||||
|
}
|
||||||
|
|
||||||
|
public static areRecordingQueries(
|
||||||
|
queries?: MediaQueries | null,
|
||||||
|
): queries is RecordingMediaQueries {
|
||||||
|
return queries instanceof RecordingMediaQueries;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,91 @@
|
|||||||
|
import clone from 'lodash-es/clone.js';
|
||||||
|
import { ViewMedia } from './media.js';
|
||||||
|
|
||||||
|
export class MediaQueriesResults {
|
||||||
|
protected _results: ViewMedia[] | null = null;
|
||||||
|
protected _resultsTimestamp: Date | null = null;
|
||||||
|
protected _selectedIndex: number | null = null;
|
||||||
|
|
||||||
|
constructor(results?: ViewMedia[], selectedIndex?: number | null) {
|
||||||
|
if (results) {
|
||||||
|
this.setResults(results);
|
||||||
|
}
|
||||||
|
if (selectedIndex !== undefined) {
|
||||||
|
this.selectResult(selectedIndex);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public clone(): MediaQueriesResults {
|
||||||
|
// Shallow clone -- will reuse the same _results object (as there are no
|
||||||
|
// methods that support modification of the results themselves, and since
|
||||||
|
// changing the selectedIndex on a consistent set of results is a common
|
||||||
|
// operation).
|
||||||
|
return clone(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
public getResults(): ViewMedia[] | null {
|
||||||
|
return this._results;
|
||||||
|
}
|
||||||
|
public getResultsCount(): number {
|
||||||
|
return this._results?.length ?? 0;
|
||||||
|
}
|
||||||
|
public hasResults(): boolean {
|
||||||
|
return !!this._results;
|
||||||
|
}
|
||||||
|
public setResults(results: ViewMedia[]) {
|
||||||
|
this._results = results;
|
||||||
|
this._resultsTimestamp = new Date();
|
||||||
|
}
|
||||||
|
public getResult(index?: number): ViewMedia | null {
|
||||||
|
if (!this._results || index === undefined) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return this._results[index];
|
||||||
|
}
|
||||||
|
public getSelectedResult(): ViewMedia | null {
|
||||||
|
return this._selectedIndex === null ? null : this.getResult(this._selectedIndex);
|
||||||
|
}
|
||||||
|
public getSelectedIndex(): number | null {
|
||||||
|
return this._selectedIndex;
|
||||||
|
}
|
||||||
|
public hasSelectedResult(): boolean {
|
||||||
|
return this.getSelectedResult() !== null;
|
||||||
|
}
|
||||||
|
public resetSelectedResult(): MediaQueriesResults {
|
||||||
|
this._selectedIndex = null;
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
public getResultsTimestamp(): Date | null {
|
||||||
|
return this._resultsTimestamp;
|
||||||
|
}
|
||||||
|
|
||||||
|
public selectResult(index: number | null): MediaQueriesResults {
|
||||||
|
if (
|
||||||
|
index === null ||
|
||||||
|
(this._results && index >= 0 && index < this._results.length)
|
||||||
|
) {
|
||||||
|
this._selectedIndex = index;
|
||||||
|
}
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
public selectResultIfFound(func: (media: ViewMedia) => boolean): MediaQueriesResults {
|
||||||
|
for (const [index, result] of this._results?.entries() ?? []) {
|
||||||
|
if (func(result)) {
|
||||||
|
this._selectedIndex = index;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
public selectBestResult(
|
||||||
|
func: (media: ViewMedia[]) => number | null,
|
||||||
|
): MediaQueriesResults {
|
||||||
|
if (this._results) {
|
||||||
|
const resultIndex = func(this._results);
|
||||||
|
if (resultIndex !== null) {
|
||||||
|
this._selectedIndex = resultIndex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return this;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -0,0 +1,61 @@
|
|||||||
|
import isEqual from 'lodash-es/isEqual';
|
||||||
|
import cloneDeep from 'lodash-es/cloneDeep.js';
|
||||||
|
import { EventQuery, MediaQuery, RecordingQuery } from '../camera/types.js';
|
||||||
|
|
||||||
|
export type MediaQueries = EventMediaQueries | RecordingMediaQueries;
|
||||||
|
|
||||||
|
export class MediaQueriesBase<T extends MediaQuery> {
|
||||||
|
protected _queries: T[] | null = null;
|
||||||
|
|
||||||
|
protected constructor(queries?: T[]) {
|
||||||
|
if (queries) {
|
||||||
|
this._queries = queries;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public clone(): MediaQueriesBase<T> {
|
||||||
|
return cloneDeep(this);
|
||||||
|
}
|
||||||
|
|
||||||
|
public isEqual(that: MediaQueries): boolean {
|
||||||
|
return isEqual(this.getQueries(), that.getQueries());
|
||||||
|
}
|
||||||
|
|
||||||
|
public getQueries(): T[] | null {
|
||||||
|
return this._queries;
|
||||||
|
}
|
||||||
|
|
||||||
|
public setQueries(queries: T[]): void {
|
||||||
|
this._queries = queries;
|
||||||
|
}
|
||||||
|
|
||||||
|
public setQueriesTime(start: Date, end: Date) {
|
||||||
|
for (const query of this._queries ?? []) {
|
||||||
|
query.start = start;
|
||||||
|
query.end = end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class EventMediaQueries extends MediaQueriesBase<EventQuery> {
|
||||||
|
constructor(queries?: EventQuery[]) {
|
||||||
|
super(queries);
|
||||||
|
}
|
||||||
|
|
||||||
|
public convertToClipsQueries(): void {
|
||||||
|
for (const query of this._queries ?? []) {
|
||||||
|
delete query.hasSnapshot;
|
||||||
|
query.hasClip = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public clone(): EventMediaQueries {
|
||||||
|
return cloneDeep(this);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class RecordingMediaQueries extends MediaQueriesBase<RecordingQuery> {
|
||||||
|
constructor(queries?: RecordingQuery[]) {
|
||||||
|
super(queries);
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,74 +1,18 @@
|
|||||||
import fromUnixTime from 'date-fns/fromUnixTime';
|
import fromUnixTime from 'date-fns/fromUnixTime';
|
||||||
import isEqual from 'lodash-es/isEqual';
|
import isEqual from 'lodash-es/isEqual';
|
||||||
import {
|
import { BrowseMediaSource, CameraConfig, MEDIA_TYPE_IMAGE } from '../types.js';
|
||||||
BrowseMediaSource,
|
|
||||||
CameraConfig,
|
|
||||||
MEDIA_TYPE_IMAGE,
|
|
||||||
} from './types.js';
|
|
||||||
import { ModifyInterface } from './utils/basic.js';
|
|
||||||
import {
|
import {
|
||||||
getEventMediaContentID,
|
getEventMediaContentID,
|
||||||
getEventThumbnailURL,
|
getEventThumbnailURL,
|
||||||
getEventTitle,
|
getEventTitle,
|
||||||
getRecordingMediaContentID,
|
getRecordingMediaContentID,
|
||||||
getRecordingTitle,
|
getRecordingTitle,
|
||||||
} from './camera/frigate/util.js';
|
} from '../camera/frigate/util.js';
|
||||||
import { FrigateEvent, FrigateRecording } from './camera/frigate/types.js';
|
import { FrigateEvent, FrigateRecording } from '../camera/frigate/types.js';
|
||||||
|
|
||||||
export type ViewMediaType = 'clip' | 'snapshot' | 'recording';
|
export type ViewMediaType = 'clip' | 'snapshot' | 'recording';
|
||||||
export type ViewMediaSourceType = FrigateEvent | FrigateRecording | BrowseMediaSource;
|
export type ViewMediaSourceType = FrigateEvent | FrigateRecording | BrowseMediaSource;
|
||||||
|
|
||||||
export class ViewMediaClassifier {
|
|
||||||
public static isFrigateMedia(
|
|
||||||
media: ViewMedia,
|
|
||||||
): media is FrigateEventViewMedia | FrigateRecordingViewMedia {
|
|
||||||
return this.isFrigateEvent(media) || this.isFrigateRecording(media);
|
|
||||||
}
|
|
||||||
public static isFrigateEvent(media: ViewMedia): media is FrigateEventViewMedia {
|
|
||||||
return media instanceof FrigateEventViewMedia;
|
|
||||||
}
|
|
||||||
public static isFrigateRecording(
|
|
||||||
media: ViewMedia,
|
|
||||||
): media is FrigateRecordingViewMedia {
|
|
||||||
return media instanceof FrigateRecordingViewMedia;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Typescript conveniences.
|
|
||||||
public static isMediaWithStartEndTime(media: ViewMedia): media is ModifyInterface<
|
|
||||||
ViewMedia,
|
|
||||||
{
|
|
||||||
getStartTime(): Date;
|
|
||||||
getEndTime(): Date;
|
|
||||||
}
|
|
||||||
> {
|
|
||||||
return !!media.getStartTime() && !!media.getEndTime();
|
|
||||||
}
|
|
||||||
public static isMediaWithStartTime(media: ViewMedia): media is ModifyInterface<
|
|
||||||
ViewMedia,
|
|
||||||
{
|
|
||||||
getStartTime(): Date;
|
|
||||||
}
|
|
||||||
> {
|
|
||||||
return !!media.getStartTime();
|
|
||||||
}
|
|
||||||
public static isMediaWithEndTime(media: ViewMedia): media is ModifyInterface<
|
|
||||||
ViewMedia,
|
|
||||||
{
|
|
||||||
getEndTime(): Date;
|
|
||||||
}
|
|
||||||
> {
|
|
||||||
return !!media.getEndTime();
|
|
||||||
}
|
|
||||||
public static isMediaWithID(media: ViewMedia): media is ModifyInterface<
|
|
||||||
ViewMedia,
|
|
||||||
{
|
|
||||||
getID(): string;
|
|
||||||
}
|
|
||||||
> {
|
|
||||||
return !!media.getID();
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class ViewMediaBase<T extends ViewMediaSourceType> {
|
class ViewMediaBase<T extends ViewMediaSourceType> {
|
||||||
protected _mediaType: ViewMediaType;
|
protected _mediaType: ViewMediaType;
|
||||||
protected _cameraID: string;
|
protected _cameraID: string;
|
||||||
@@ -23,19 +23,16 @@
|
|||||||
// - TODO: What should the timeline do when an event is clicked on that is not in the queryResults (or if queryResults is empty)?
|
// - TODO: What should the timeline do when an event is clicked on that is not in the queryResults (or if queryResults is empty)?
|
||||||
// - TODO: Should the timeline data source clear events (as it currently does) when the query changes?
|
// - TODO: Should the timeline data source clear events (as it currently does) when the query changes?
|
||||||
|
|
||||||
import isEqual from 'lodash-es/isEqual';
|
|
||||||
import clone from 'lodash-es/clone.js';
|
|
||||||
import cloneDeep from 'lodash-es/cloneDeep.js';
|
|
||||||
import { ViewContext } from 'view';
|
import { ViewContext } from 'view';
|
||||||
import {
|
import {
|
||||||
FrigateCardUserSpecifiedView,
|
FrigateCardUserSpecifiedView,
|
||||||
FrigateCardView,
|
FrigateCardView,
|
||||||
FRIGATE_CARD_VIEWS_USER_SPECIFIED,
|
FRIGATE_CARD_VIEWS_USER_SPECIFIED,
|
||||||
FRIGATE_CARD_VIEW_DEFAULT,
|
FRIGATE_CARD_VIEW_DEFAULT,
|
||||||
} from './types.js';
|
} from '../types.js';
|
||||||
import { dispatchFrigateCardEvent } from './utils/basic.js';
|
import { dispatchFrigateCardEvent } from '../utils/basic.js';
|
||||||
import { EventQuery, MediaQuery, RecordingQuery } from './camera/types.js';
|
import { MediaQueries } from './media-queries';
|
||||||
import { ViewMedia } from './view-media.js';
|
import { MediaQueriesResults } from './media-queries-results';
|
||||||
|
|
||||||
export interface ViewEvolveParameters {
|
export interface ViewEvolveParameters {
|
||||||
view?: FrigateCardView;
|
view?: FrigateCardView;
|
||||||
@@ -50,167 +47,6 @@ export interface ViewParameters extends ViewEvolveParameters {
|
|||||||
camera: string;
|
camera: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export class MediaQueriesClassifier {
|
|
||||||
public static areEventQueries(
|
|
||||||
queries?: MediaQueries | null,
|
|
||||||
): queries is EventMediaQueries {
|
|
||||||
return queries instanceof EventMediaQueries;
|
|
||||||
}
|
|
||||||
|
|
||||||
public static areRecordingQueries(
|
|
||||||
queries?: MediaQueries | null,
|
|
||||||
): queries is RecordingMediaQueries {
|
|
||||||
return queries instanceof RecordingMediaQueries;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class MediaQueriesBase<T extends MediaQuery> {
|
|
||||||
protected _queries: T[] | null = null;
|
|
||||||
|
|
||||||
protected constructor(queries?: T[]) {
|
|
||||||
if (queries) {
|
|
||||||
this._queries = queries;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public clone(): MediaQueriesBase<T> {
|
|
||||||
return cloneDeep(this);
|
|
||||||
}
|
|
||||||
|
|
||||||
public isEqual(that: MediaQueries): boolean {
|
|
||||||
return isEqual(this.getQueries(), that.getQueries());
|
|
||||||
}
|
|
||||||
|
|
||||||
public getQueries(): T[] | null {
|
|
||||||
return this._queries;
|
|
||||||
}
|
|
||||||
|
|
||||||
public setQueries(queries: T[]): void {
|
|
||||||
this._queries = queries;
|
|
||||||
}
|
|
||||||
|
|
||||||
public setQueriesTime(start: Date, end: Date) {
|
|
||||||
for (const query of this._queries ?? []) {
|
|
||||||
query.start = start;
|
|
||||||
query.end = end;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class EventMediaQueries extends MediaQueriesBase<EventQuery> {
|
|
||||||
constructor(queries?: EventQuery[]) {
|
|
||||||
super(queries);
|
|
||||||
}
|
|
||||||
|
|
||||||
public convertToClipsQueries(): void {
|
|
||||||
for (const query of this._queries ?? []) {
|
|
||||||
delete query.hasSnapshot;
|
|
||||||
query.hasClip = true;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public clone(): EventMediaQueries {
|
|
||||||
return cloneDeep(this);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class RecordingMediaQueries extends MediaQueriesBase<RecordingQuery> {
|
|
||||||
constructor(queries?: RecordingQuery[]) {
|
|
||||||
super(queries);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export type MediaQueries = EventMediaQueries | RecordingMediaQueries;
|
|
||||||
|
|
||||||
export class MediaQueriesResults {
|
|
||||||
protected _results: ViewMedia[] | null = null;
|
|
||||||
protected _resultsTimestamp: Date | null = null;
|
|
||||||
protected _selectedIndex: number | null = null;
|
|
||||||
|
|
||||||
constructor(results?: ViewMedia[], selectedIndex?: number | null) {
|
|
||||||
if (results) {
|
|
||||||
this.setResults(results);
|
|
||||||
}
|
|
||||||
if (selectedIndex !== undefined) {
|
|
||||||
this.selectResult(selectedIndex);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public clone(): MediaQueriesResults {
|
|
||||||
// Shallow clone -- will reuse the same _results object (as there are no
|
|
||||||
// methods that support modification of the results themselves, and since
|
|
||||||
// changing the selectedIndex on a consistent set of results is a common
|
|
||||||
// operation).
|
|
||||||
return clone(this);
|
|
||||||
}
|
|
||||||
|
|
||||||
public getResults(): ViewMedia[] | null {
|
|
||||||
return this._results;
|
|
||||||
}
|
|
||||||
public getResultsCount(): number {
|
|
||||||
return this._results?.length ?? 0;
|
|
||||||
}
|
|
||||||
public hasResults(): boolean {
|
|
||||||
return !!this._results;
|
|
||||||
}
|
|
||||||
public setResults(results: ViewMedia[]) {
|
|
||||||
this._results = results;
|
|
||||||
this._resultsTimestamp = new Date();
|
|
||||||
}
|
|
||||||
public getResult(index?: number): ViewMedia | null {
|
|
||||||
if (!this._results || index === undefined) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
return this._results[index];
|
|
||||||
}
|
|
||||||
public getSelectedResult(): ViewMedia | null {
|
|
||||||
return this._selectedIndex === null ? null : this.getResult(this._selectedIndex);
|
|
||||||
}
|
|
||||||
public getSelectedIndex(): number | null {
|
|
||||||
return this._selectedIndex;
|
|
||||||
}
|
|
||||||
public hasSelectedResult(): boolean {
|
|
||||||
return this.getSelectedResult() !== null;
|
|
||||||
}
|
|
||||||
public resetSelectedResult(): MediaQueriesResults {
|
|
||||||
this._selectedIndex = null;
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
public getResultsTimestamp(): Date | null {
|
|
||||||
return this._resultsTimestamp;
|
|
||||||
}
|
|
||||||
|
|
||||||
public selectResult(index: number | null): MediaQueriesResults {
|
|
||||||
if (
|
|
||||||
index === null ||
|
|
||||||
(this._results && index >= 0 && index < this._results.length)
|
|
||||||
) {
|
|
||||||
this._selectedIndex = index;
|
|
||||||
}
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
public selectResultIfFound(func: (media: ViewMedia) => boolean): MediaQueriesResults {
|
|
||||||
for (const [index, result] of this._results?.entries() ?? []) {
|
|
||||||
if (func(result)) {
|
|
||||||
this._selectedIndex = index;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
public selectBestResult(
|
|
||||||
func: (media: ViewMedia[]) => number | null,
|
|
||||||
): MediaQueriesResults {
|
|
||||||
if (this._results) {
|
|
||||||
const resultIndex = func(this._results);
|
|
||||||
if (resultIndex !== null) {
|
|
||||||
this._selectedIndex = resultIndex;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return this;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
export class View {
|
export class View {
|
||||||
public view: FrigateCardView;
|
public view: FrigateCardView;
|
||||||
public camera: string;
|
public camera: string;
|
||||||
Reference in New Issue
Block a user