flan/advanced-camera-card
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor card.ts substantially and test.

Browse Source
This commit is contained in:
Dermot Duffy
2023-10-02 16:30:05 -07:00
parent 4cf13b1645
commit bfdbe70d6c
92 changed files with 8404 additions and 2996 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/action-handler-directive.ts
+23
View File
@@ -180,6 +180,29 @@ export const actionHandler = directive(
},
);
export interface ActionEventTarget extends EventTarget {
addEventListener(
event: '@action',
listener: (this: ActionEventTarget, ev: CustomEvent<ActionHandlerDetail>) => void,
options?: AddEventListenerOptions | boolean,
): void;
addEventListener(
type: string,
callback: EventListenerOrEventListenerObject,
options?: AddEventListenerOptions | boolean,
): void;
removeEventListener(
event: '@action',
listener: (this: ActionEventTarget, ev: CustomEvent<ActionHandlerDetail>) => void,
options?: boolean | EventListenerOptions,
): void;
removeEventListener(
type: string,
callback: EventListenerOrEventListenerObject,
options?: boolean | EventListenerOptions,
): void;
}
declare global {
interface HTMLElementTagNameMap {
'action-handler-frigate-card': ActionHandler;
src/automations.ts
-50
View File
@@ -1,50 +0,0 @@
import { HomeAssistant } from 'custom-card-helpers';
import { AutomationActions, FrigateCardError } from './types.js';
import { ConditionController } from './conditions.js';
import { Automation, Automations } from './types.js';
import { frigateCardHandleAction } from './utils/action.js';
import { localize } from './localize/localize.js';
const MAX_NESTED_AUTOMATION_EXECUTIONS = 10;
export class AutomationsControllerError extends FrigateCardError {}
export class AutomationsController {
protected _automations: Automations;
protected _priorEvaluations: Map<Automation, boolean> = new Map();
// A counter to avoid infinite loops, increases every time actions are run,
// decreases every time actions are complete.
protected _nestedAutomationExecutions = 0;
constructor(automations: Automations) {
this._automations = automations;
}
public execute(
element: HTMLElement,
hass: HomeAssistant,
conditionController: ConditionController,
): void {
const actionsToRun: AutomationActions[] = [];
for (const automation of this._automations ?? []) {
const shouldExecute = conditionController.evaluateCondition(automation.conditions);
const actions = shouldExecute ? automation.actions : automation.actions_not;
const priorEvaluation = this._priorEvaluations.get(automation);
this._priorEvaluations.set(automation, shouldExecute);
if (shouldExecute !== priorEvaluation && actions) {
actionsToRun.push(actions);
}
}
++this._nestedAutomationExecutions;
if (this._nestedAutomationExecutions > MAX_NESTED_AUTOMATION_EXECUTIONS) {
throw new AutomationsControllerError(localize('error.too_many_automations'));
}
actionsToRun.forEach((actions) => {
frigateCardHandleAction(element, hass, {}, actions);
});
--this._nestedAutomationExecutions;
}
}
src/camera-manager/engine-factory.ts
+1 -5
View File
@@ -1,6 +1,6 @@
import { HomeAssistant } from 'custom-card-helpers';
import { localize } from '../localize/localize';
import { CameraConfig, CardWideConfig } from '../types';
import { CameraConfig } from '../types';
import { BrowseMediaManager } from '../utils/ha/browse-media/browse-media-manager';
import { BrowseMedia } from '../utils/ha/browse-media/types';
import { EntityRegistryManager } from '../utils/ha/entity-registry';
@@ -15,15 +15,12 @@ import { getCameraEntityFromConfig } from './util';
export class CameraManagerEngineFactory {
protected _entityRegistryManager: EntityRegistryManager;
protected _resolvedMediaCache: ResolvedMediaCache;
protected _cardWideConfig: CardWideConfig;
constructor(
entityRegistryManager: EntityRegistryManager,
resolvedMediaCache: ResolvedMediaCache,
cardWideConfig: CardWideConfig,
) {
this._entityRegistryManager = entityRegistryManager;
this._cardWideConfig = cardWideConfig;
this._resolvedMediaCache = resolvedMediaCache;
}
@@ -37,7 +34,6 @@ export class CameraManagerEngineFactory {
case Engine.Frigate:
const { FrigateCameraManagerEngine } = await import('./frigate/engine-frigate');
cameraManagerEngine = new FrigateCameraManagerEngine(
this._cardWideConfig,
new RecordingSegmentsCache(),
new RequestCache(),
);
src/camera-manager/frigate/engine-frigate.ts
+44 -61
View File
@@ -1,24 +1,52 @@
import { HomeAssistant } from 'custom-card-helpers';
import add from 'date-fns/add';
import endOfHour from 'date-fns/endOfHour';
import format from 'date-fns/format';
import fromUnixTime from 'date-fns/fromUnixTime';
import startOfHour from 'date-fns/startOfHour';
import { CameraConfig, CardWideConfig, ExtendedHomeAssistant } from '../../types';
import isEqual from 'lodash-es/isEqual';
import orderBy from 'lodash-es/orderBy';
import throttle from 'lodash-es/throttle';
import uniq from 'lodash-es/uniq';
import uniqWith from 'lodash-es/uniqWith';
import { localize } from '../../localize/localize';
import { CameraConfig, ExtendedHomeAssistant } from '../../types';
import {
allPromises,
formatDate,
prettifyTitle,
runWhenIdleIfSupported,
} from '../../utils/basic';
import { getEntityTitle } from '../../utils/ha';
import { EntityRegistryManager } from '../../utils/ha/entity-registry';
import { Entity } from '../../utils/ha/entity-registry/types';
import { ViewMedia } from '../../view/media';
import { ViewMediaClassifier } from '../../view/media-classifier';
import { RecordingSegmentsCache, RequestCache } from '../cache';
import {
CameraManagerEngine,
CAMERA_MANAGER_ENGINE_EVENT_LIMIT_DEFAULT,
CameraManagerEngine,
} from '../engine';
import { CameraInitializationError } from '../error';
import { GenericCameraManagerEngine } from '../generic/engine-generic';
import { DateRange } from '../range';
import {
CameraManagerCameraMetadata,
CameraConfigs,
CameraEndpoint,
CameraEndpoints,
CameraEndpointsContext,
CameraManagerCameraCapabilities,
CameraManagerCameraMetadata,
CameraManagerMediaCapabilities,
DataQuery,
Engine,
EngineOptions,
EventQuery,
EventQueryResults,
EventQueryResultsMap,
MediaMetadataQuery,
MediaMetadataQueryResults,
MediaMetadataQueryResultsMap,
PartialEventQuery,
PartialRecordingQuery,
PartialRecordingSegmentsQuery,
@@ -32,56 +60,26 @@ import {
RecordingSegment,
RecordingSegmentsQuery,
RecordingSegmentsQueryResultsMap,
CameraEndpointsContext,
CameraConfigs,
CameraEndpoints,
CameraEndpoint,
MediaMetadataQuery,
MediaMetadataQueryResults,
MediaMetadataQueryResultsMap,
EngineOptions,
} from '../types';
import { getCameraEntityFromConfig } from '../util';
import frigateLogo from './assets/frigate-logo-dark.svg';
import { FrigateViewMediaFactory } from './media';
import { FrigateViewMediaClassifier } from './media-classifier';
import {
FrigateEventQueryResults,
FrigateRecordingQueryResults,
FrigateRecordingSegmentsQueryResults,
FrigateRecording,
} from './types';
import {
getEvents,
getEventSummary,
getRecordingSegments,
getRecordingsSummary,
NativeFrigateEventQuery,
NativeFrigateRecordingSegmentsQuery,
getEventSummary,
getEvents,
getRecordingSegments,
getRecordingsSummary,
retainEvent,
} from './requests';
import isEqual from 'lodash-es/isEqual';
import orderBy from 'lodash-es/orderBy';
import throttle from 'lodash-es/throttle';
import uniqWith from 'lodash-es/uniqWith';
import {
allPromises,
formatDate,
prettifyTitle,
runWhenIdleIfSupported,
} from '../../utils/basic';
import fromUnixTime from 'date-fns/fromUnixTime';
import sum from 'lodash-es/sum';
import { FrigateViewMediaClassifier } from './media-classifier';
import { ViewMediaClassifier } from '../../view/media-classifier';
import { FrigateViewMediaFactory } from './media';
import { log } from '../../utils/debug';
import { getEntityTitle } from '../../utils/ha';
import { EntityRegistryManager } from '../../utils/ha/entity-registry';
import { Entity } from '../../utils/ha/entity-registry/types';
import { CameraInitializationError } from '../error';
import { localize } from '../../localize/localize';
import uniq from 'lodash-es/uniq';
import format from 'date-fns/format';
import { GenericCameraManagerEngine } from '../generic/engine-generic';
import frigateLogo from './assets/frigate-logo-dark.svg';
import { getCameraEntityFromConfig } from '../util';
FrigateEventQueryResults,
FrigateRecording,
FrigateRecordingQueryResults,
FrigateRecordingSegmentsQueryResults,
} from './types';
const EVENT_REQUEST_CACHE_MAX_AGE_SECONDS = 60;
const RECORDING_SUMMARY_REQUEST_CACHE_MAX_AGE_SECONDS = 60;
@@ -120,7 +118,6 @@ export class FrigateCameraManagerEngine
{
protected _recordingSegmentsCache: RecordingSegmentsCache;
protected _requestCache: RequestCache;
protected _cardWideConfig: CardWideConfig;
// Garbage collect segments at most once an hour.
protected _throttledSegmentGarbageCollector = throttle(
@@ -130,12 +127,10 @@ export class FrigateCameraManagerEngine
);
constructor(
cardWideConfig: CardWideConfig,
recordingSegmentsCache: RecordingSegmentsCache,
requestCache: RequestCache,
) {
super();
this._cardWideConfig = cardWideConfig;
this._recordingSegmentsCache = recordingSegmentsCache;
this._requestCache = requestCache;
}
@@ -989,12 +984,6 @@ export class FrigateCameraManagerEngine
type: QueryType.Recording,
};
const countSegments = () =>
sum(
cameraIDs.map((cameraID) => this._recordingSegmentsCache.getSize(cameraID) ?? 0),
);
const segmentsStart = countSegments();
// Performance: _recordingSegments is potentially very large (e.g. 10K - 1M
// items) and each item must be examined, so care required here to stick to
// nothing worse than O(n) performance.
@@ -1029,12 +1018,6 @@ export class FrigateCameraManagerEngine
},
);
}
log(
this._cardWideConfig,
'Frigate Card recording segment garbage collection: ' +
`Released ${segmentsStart - countSegments()} segment(s)`,
);
}
/**
src/camera-manager/manager.ts
+115 -97
View File
@@ -1,23 +1,30 @@
import { HomeAssistant } from 'custom-card-helpers';
import {
CameraConfig,
CamerasConfig,
CardWideConfig,
ExtendedHomeAssistant,
} from '../types.js';
import add from 'date-fns/add';
import cloneDeep from 'lodash-es/cloneDeep';
import merge from 'lodash-es/merge.js';
import sum from 'lodash-es/sum';
import { MEDIA_CHUNK_SIZE_DEFAULT } from '../const.js';
import { localize } from '../localize/localize.js';
import { CameraConfig, CamerasConfig } from '../types.js';
import { allPromises, arrayify, setify } from '../utils/basic.js';
import { getCameraID } from '../utils/camera.js';
import { CardCameraAPI } from '../utils/card-controller/types.js';
import { log } from '../utils/debug.js';
import { EntityRegistryManager } from '../utils/ha/entity-registry/index.js';
import { ViewMedia } from '../view/media.js';
import { CameraManagerEngineFactory } from './engine-factory.js';
import { CameraManagerEngine } from './engine.js';
import { CameraInitializationError } from './error.js';
import { CameraManagerReadOnlyConfigStore, CameraManagerStore } from './store.js';
import {
CameraManagerCameraCapabilities,
CameraEndpoint, CameraEndpoints, CameraEndpointsContext, CameraManagerCameraCapabilities,
CameraManagerCameraMetadata,
CameraManagerCapabilities,
CameraManagerMediaCapabilities,
CameraEndpointsContext,
DataQuery,
EventQuery,
CameraManagerMediaCapabilities, DataQuery, Engine, EngineOptions, EventQuery,
EventQueryResults,
EventQueryResultsMap,
MediaMetadata,
MediaQuery,
MediaMetadata, MediaMetadataQuery,
MediaMetadataQueryResults, MediaQuery,
PartialDataQuery,
PartialEventQuery,
PartialQueryConcreteType,
@@ -33,27 +40,8 @@ import {
RecordingSegmentsQuery,
RecordingSegmentsQueryResults,
RecordingSegmentsQueryResultsMap,
ResultsMap,
CameraEndpoints,
Engine,
MediaMetadataQuery,
MediaMetadataQueryResults,
EngineOptions,
CameraEndpoint,
ResultsMap
} from './types.js';
import { CameraManagerEngineFactory } from './engine-factory.js';
import { ViewMedia } from '../view/media.js';
import { CameraManagerEngine } from './engine.js';
import sum from 'lodash-es/sum';
import add from 'date-fns/add';
import { log } from '../utils/debug.js';
import { EntityRegistryManager } from '../utils/ha/entity-registry/index.js';
import { getCameraID } from '../utils/camera.js';
import { localize } from '../localize/localize.js';
import { CameraInitializationError } from './error.js';
import { CameraManagerReadOnlyConfigStore, CameraManagerStore } from './store.js';
import cloneDeep from 'lodash-es/cloneDeep';
import { MEDIA_CHUNK_SIZE_DEFAULT } from '../const.js';
import { sortMedia } from './util.js';
class QueryClassifier {
@@ -112,25 +100,51 @@ interface InitializedCamera {
}
export class CameraManager {
protected _api: CardCameraAPI;
protected _engineFactory: CameraManagerEngineFactory;
protected _cardWideConfig?: CardWideConfig;
protected _store: CameraManagerStore;
protected _store = new CameraManagerStore();
constructor(
engineFactory: CameraManagerEngineFactory,
cardWideConfig?: CardWideConfig,
) {
this._engineFactory = engineFactory;
this._cardWideConfig = cardWideConfig;
this._store = new CameraManagerStore();
constructor(api: CardCameraAPI) {
this._api = api;
this._engineFactory = new CameraManagerEngineFactory(
this._api.getEntityRegistryManager(),
this._api.getResolvedMediaCache(),
);
}
public async initializeCamerasFromConfig(): Promise<void> {
const config = this._api.getConfigManager().getConfig();
const hass = this._api.getHASSManager().getHASS();
if (!config || !hass) {
return;
}
// For each camera merge the config (which has no defaults) into the camera
// global config (which does have defaults). The merging must happen in this
// order, to ensure that the defaults in the cameras global config do not
// override the values specified in the per-camera config.
const cameras = config.cameras.map((camera) =>
merge(cloneDeep(config?.cameras_global), camera),
);
try {
await this._initializeCameras(cameras);
} catch (e: unknown) {
this._api.getMessageManager().setErrorIfHigherPriority(e);
}
}
protected async _getEnginesForCameras(
hass: HomeAssistant,
camerasConfig: CamerasConfig,
): Promise<Map<CameraConfig, CameraManagerEngine>> {
const output: Map<CameraConfig, CameraManagerEngine> = new Map();
const engines: Map<Engine, CameraManagerEngine> = new Map();
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return output;
}
const getEngineTypes = async (configs: CameraConfig[]) => {
return await allPromises(configs, (config) =>
@@ -142,7 +156,7 @@ export class CameraManager {
for (const [index, cameraConfig] of camerasConfig.entries()) {
const engineType = engineTypes[index];
const engine = engineType
? engines.get(engineType) ?? await this._engineFactory.createEngine(engineType)
? engines.get(engineType) ?? (await this._engineFactory.createEngine(engineType))
: null;
if (!engine || !engineType) {
throw new CameraInitializationError(
@@ -177,12 +191,13 @@ export class CameraManager {
};
}
public async initializeCameras(
hass: HomeAssistant,
entityRegistryManager: EntityRegistryManager,
camerasConfig: CamerasConfig,
): Promise<void> {
protected async _initializeCameras(camerasConfig: CamerasConfig): Promise<void> {
const initializationStartTime = new Date();
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return;
}
const hasAutoTriggers = (config: CameraConfig): boolean => {
return config.triggers.motion || config.triggers.occupancy;
@@ -195,18 +210,23 @@ export class CameraManager {
// ... then we need to populate the entity cache by fetching all entities
// from Home Assistant. Do this once upfront, to avoid each camera doing
// it.
await entityRegistryManager.fetchEntityList(hass);
await this._api.getEntityRegistryManager().fetchEntityList(hass);
}
// Engines are created sequentially, to avoid duplicate creation of the same
// engine. See: https://github.com/dermotduffy/frigate-hass-card/issues/941
const engineByConfig = await this._getEnginesForCameras(hass, camerasConfig);
const engineByConfig = await this._getEnginesForCameras(camerasConfig);
// Configuration is initialized in parallel.
const results = await allPromises(
engineByConfig.entries(),
async ([cameraConfig, engine]) =>
await this._initializeCamera(hass, engine, entityRegistryManager, cameraConfig),
await this._initializeCamera(
hass,
engine,
this._api.getEntityRegistryManager(),
cameraConfig,
),
);
// Do the additions based off the result-order, to ensure the map order is
@@ -236,7 +256,7 @@ export class CameraManager {
}
log(
this._cardWideConfig,
this._api.getConfigManager().getCardWideConfig(),
'Frigate Card CameraManager initialized (Cameras: ',
this._store.getCameras(),
`, Duration: ${
@@ -284,7 +304,7 @@ export class CameraManager {
});
}
public async getMediaMetadata(hass: HomeAssistant): Promise<MediaMetadata | null> {
public async getMediaMetadata(): Promise<MediaMetadata | null> {
const tags: Set<string> = new Set();
const what: Set<string> = new Set();
const where: Set<string> = new Set();
@@ -295,7 +315,7 @@ export class CameraManager {
cameraIDs: this._store.getCameraIDs(),
};
const results = await this._handleQuery(hass, query);
const results = await this._handleQuery(query);
for (const result of results?.values() ?? []) {
if (result.metadata.tags) {
@@ -365,47 +385,46 @@ export class CameraManager {
}
public async getEvents(
hass: HomeAssistant,
query: EventQuery | EventQuery[],
engineOptions?: EngineOptions,
): Promise<EventQueryResultsMap> {
return await this._handleQuery(hass, query, engineOptions);
return await this._handleQuery(query, engineOptions);
}
public async getRecordings(
hass: HomeAssistant,
query: RecordingQuery | RecordingQuery[],
engineOptions?: EngineOptions,
): Promise<RecordingQueryResultsMap> {
return await this._handleQuery(hass, query, engineOptions);
return await this._handleQuery(query, engineOptions);
}
public async getRecordingSegments(
hass: HomeAssistant,
query: RecordingSegmentsQuery | RecordingSegmentsQuery[],
engineOptions?: EngineOptions,
): Promise<RecordingSegmentsQueryResultsMap> {
return await this._handleQuery(hass, query, engineOptions);
return await this._handleQuery(query, engineOptions);
}
public async executeMediaQueries<T extends MediaQuery>(
hass: HomeAssistant,
queries: T[],
engineOptions?: EngineOptions,
): Promise<ViewMedia[] | null> {
return this._convertQueryResultsToMedia(
hass,
await this._handleQuery(hass, queries, engineOptions),
await this._handleQuery(queries, engineOptions),
);
}
public async extendMediaQueries<T extends MediaQuery>(
hass: HomeAssistant,
queries: T[],
results: ViewMedia[],
direction: 'earlier' | 'later',
engineOptions?: EngineOptions,
): Promise<ExtendedMediaQueryResult<T> | null> {
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return null;
}
const getTimeFromResults = (want: 'earliest' | 'latest'): Date | null => {
let output: Date | null = null;
for (const result of results) {
@@ -423,8 +442,8 @@ export class CameraManager {
};
const chunkSize =
this._cardWideConfig?.performance?.features.media_chunk_size ??
MEDIA_CHUNK_SIZE_DEFAULT;
this._api.getConfigManager().getCardWideConfig()?.performance?.features
.media_chunk_size ?? MEDIA_CHUNK_SIZE_DEFAULT;
// The queries associated with the chunk to fetch.
const newChunkQueries: T[] = [];
@@ -456,8 +475,7 @@ export class CameraManager {
}
const newChunkMedia = this._convertQueryResultsToMedia(
hass,
await this._handleQuery(hass, newChunkQueries, engineOptions),
await this._handleQuery(newChunkQueries, engineOptions),
);
if (!newChunkMedia.length) {
@@ -478,14 +496,12 @@ export class CameraManager {
};
}
public async getMediaDownloadPath(
hass: ExtendedHomeAssistant,
media: ViewMedia,
): Promise<CameraEndpoint | null> {
public async getMediaDownloadPath(media: ViewMedia): Promise<CameraEndpoint | null> {
const cameraConfig = this._store.getCameraConfigForMedia(media);
const engine = this._store.getEngineForMedia(media);
const hass = this._api.getHASSManager().getHASS();
if (!cameraConfig || !engine) {
if (!cameraConfig || !engine || !hass) {
return null;
}
return await engine.getMediaDownloadPath(hass, cameraConfig, media);
@@ -499,15 +515,12 @@ export class CameraManager {
return engine.getMediaCapabilities(media);
}
public async favoriteMedia(
hass: HomeAssistant,
media: ViewMedia,
favorite: boolean,
): Promise<void> {
public async favoriteMedia(media: ViewMedia, favorite: boolean): Promise<void> {
const cameraConfig = this._store.getCameraConfigForMedia(media);
const engine = this._store.getEngineForMedia(media);
const hass = this._api.getHASSManager().getHASS();
if (!cameraConfig || !engine) {
if (!cameraConfig || !engine || !hass) {
return;
}
@@ -515,7 +528,7 @@ export class CameraManager {
await engine.favoriteMedia(hass, cameraConfig, media, favorite);
log(
this._cardWideConfig,
this._api.getConfigManager().getCardWideConfig(),
'Frigate Card CameraManager favorite request (',
`Duration: ${(new Date().getTime() - queryStartTime.getTime()) / 1000}s,`,
'Media:',
@@ -550,16 +563,15 @@ export class CameraManager {
return true;
}
public async getMediaSeekTime(
hass: HomeAssistant,
media: ViewMedia,
target: Date,
): Promise<number | null> {
public async getMediaSeekTime(media: ViewMedia, target: Date): Promise<number | null> {
const startTime = media.getStartTime();
const endTime = media.getEndTime();
const cameraConfig = this._store.getCameraConfigForMedia(media);
const engine = this._store.getEngineForMedia(media);
const hass = this._api.getHASSManager().getHASS();
if (
!hass ||
!cameraConfig ||
!engine ||
!startTime ||
@@ -574,13 +586,17 @@ export class CameraManager {
}
protected async _handleQuery<QT extends DataQuery>(
hass: HomeAssistant,
query: QT | QT[],
engineOptions?: EngineOptions,
): Promise<Map<QT, QueryReturnType<QT>>> {
const _queries = arrayify(query);
const results = new Map<QT, QueryReturnType<QT>>();
const queryStartTime = new Date();
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return results;
}
const processEngineQuery = async (
engine: CameraManagerEngine,
@@ -643,7 +659,7 @@ export class CameraManager {
);
log(
this._cardWideConfig,
this._api.getConfigManager().getCardWideConfig(),
'Frigate Card CameraManager request [Input queries:',
_queries.length,
', Cached output queries:',
@@ -662,10 +678,15 @@ export class CameraManager {
}
protected _convertQueryResultsToMedia<QT extends DataQuery>(
hass: HomeAssistant,
results: ResultsMap<QT>,
): ViewMedia[] {
const mediaArray: ViewMedia[] = [];
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return mediaArray;
}
for (const [query, result] of results.entries()) {
const engine = this._store.getEngineOfType(result.engine);
@@ -712,13 +733,12 @@ export class CameraManager {
return engine.getCameraEndpoints(cameraConfig, context);
}
public getCameraMetadata(
hass: HomeAssistant,
cameraID: string,
): CameraManagerCameraMetadata | null {
public getCameraMetadata(cameraID: string): CameraManagerCameraMetadata | null {
const cameraConfig = this._store.getCameraConfig(cameraID);
const engine = this._store.getEngineForCameraID(cameraID);
if (!cameraConfig || !engine) {
const hass = this._api.getHASSManager().getHASS();
if (!cameraConfig || !engine || !hass) {
return null;
}
return engine.getCameraMetadata(hass, cameraConfig);
@@ -747,9 +767,7 @@ export class CameraManager {
canFavoriteRecordings: perCameraCapabilities.some(
(cap) => cap?.canFavoriteRecordings,
),
canSeek: perCameraCapabilities.some(
(cap) => cap?.canSeek,
),
canSeek: perCameraCapabilities.some((cap) => cap?.canSeek),
supportsClips: perCameraCapabilities.some((cap) => cap?.supportsClips),
supportsRecordings: perCameraCapabilities.some((cap) => cap?.supportsRecordings),
src/card.ts
+118 -1667
View File
File diff suppressed because it is too large Load Diff
src/components/diagnostics.ts
+47
View File
@@ -0,0 +1,47 @@
import { HomeAssistant } from 'custom-card-helpers';
import { CSSResultGroup, LitElement, TemplateResult, unsafeCSS } from 'lit';
import { customElement, property, state } from 'lit/decorators.js';
import { localize } from '../localize/localize';
import basicBlockStyle from '../scss/basic-block.scss';
import { RawFrigateCardConfig } from '../types';
import { Diagnostics, getDiagnostics } from '../utils/diagnostics';
import { renderMessage } from './message';
@customElement('frigate-card-diagnostics')
export class FrigateCardDiagnostics extends LitElement {
@property({ attribute: false })
public hass?: HomeAssistant;
@property({ attribute: false })
public rawConfig?: RawFrigateCardConfig;
@state()
protected _diagnostics: Diagnostics | null = null;
protected async _fetchDiagnostics(): Promise<void> {
this._diagnostics = await getDiagnostics(this.hass, this.rawConfig);
}
protected render(): TemplateResult | void {
if (!this._diagnostics) {
this._fetchDiagnostics().then(() => this.requestUpdate());
return;
}
return renderMessage({
message: localize('error.diagnostics'),
type: 'diagnostics',
icon: 'mdi:information',
context: this._diagnostics,
});
}
static get styles(): CSSResultGroup {
return unsafeCSS(basicBlockStyle);
}
}
declare global {
interface HTMLElementTagNameMap {
'frigate-card-diagnostics': FrigateCardDiagnostics;
}
}
src/components/elements.ts
+12 -9
View File
@@ -8,9 +8,11 @@ import {
unsafeCSS,
} from 'lit';
import { customElement, property, state } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js';
import { actionHandler } from '../action-handler-directive.js';
import { localize } from '../localize/localize.js';
import elementsStyle from '../scss/elements.scss';
import ptzStyle from '../scss/elements-ptz.scss';
import elementsStyle from '../scss/elements.scss';
import {
Actions,
ActionsConfig,
@@ -24,16 +26,17 @@ import {
MenuSubmenuSelect,
PictureElements,
} from '../types.js';
import { dispatchFrigateCardEvent } from '../utils/basic.js';
import { dispatchFrigateCardErrorEvent } from './message.js';
import { actionHandler } from '../action-handler-directive.js';
import {
frigateCardHandleActionConfig,
frigateCardHasAction,
getActionConfigGivenAction,
} from '../utils/action.js';
import { classMap } from 'lit/directives/class-map.js';
import { ConditionControllerEpoch, evaluateConditionViaEvent } from '../conditions.js';
import { dispatchFrigateCardEvent } from '../utils/basic.js';
import {
ConditionsManagerEpoch,
evaluateConditionViaEvent,
} from '../utils/card-controller/conditions-manager.js';
import { dispatchFrigateCardErrorEvent } from './message.js';
/* A note on picture element rendering:
*
@@ -85,7 +88,7 @@ export class FrigateCardElementsCore extends LitElement {
* property even though it is not currently directly used by this class.
*/
@property({ attribute: false })
public conditionControllerEpoch?: ConditionControllerEpoch;
public conditionsManagerEpoch?: ConditionsManagerEpoch;
protected _root: HuiConditionalElement | null = null;
@@ -167,7 +170,7 @@ export class FrigateCardElements extends LitElement {
public hass?: HomeAssistant;
@property({ attribute: false })
public conditionControllerEpoch?: ConditionControllerEpoch;
public conditionsManagerEpoch?: ConditionsManagerEpoch;
@property({ attribute: false })
public elements: PictureElements;
@@ -226,7 +229,7 @@ export class FrigateCardElements extends LitElement {
protected render(): TemplateResult {
return html`<frigate-card-elements-core
.hass=${this.hass}
.conditionControllerEpoch=${this.conditionControllerEpoch}
.conditionsManagerEpoch=${this.conditionsManagerEpoch}
.elements=${this.elements}
>
</frigate-card-elements-core>`;
src/components/gallery.ts
-3
View File
@@ -82,7 +82,6 @@ export class FrigateCardGallery extends LitElement {
if (this.view.is('recordings')) {
changeViewToRecentRecordingForCameraAndDependents(
this,
this.hass,
this.cameraManager,
this.cardWideConfig,
this.view,
@@ -95,7 +94,6 @@ export class FrigateCardGallery extends LitElement {
: null;
changeViewToRecentEventsForCameraAndDependents(
this,
this.hass,
this.cameraManager,
this.cardWideConfig,
this.view,
@@ -344,7 +342,6 @@ export class FrigateCardGalleryCore extends LitElement {
let extension: ExtendedMediaQueryResult<MediaQuery> | null;
try {
extension = await this.cameraManager.extendMediaQueries<MediaQuery>(
this.hass,
rawQueries,
existingMedia,
direction,
src/components/live/live.ts
+15 -13
View File
@@ -16,7 +16,10 @@ import { keyed } from 'lit/directives/keyed.js';
import { createRef, Ref, ref } from 'lit/directives/ref.js';
import { CameraManager } from '../../camera-manager/manager.js';
import { CameraConfigs, CameraEndpoints } from '../../camera-manager/types.js';
import { ConditionControllerEpoch, getOverriddenConfig } from '../../conditions.js';
import {
ConditionsManagerEpoch,
getOverriddenConfig,
} from '../../utils/card-controller/conditions-manager.js';
import { localize } from '../../localize/localize.js';
import basicBlockStyle from '../../scss/basic-block.scss';
import liveCarouselStyle from '../../scss/live-carousel.scss';
@@ -121,7 +124,7 @@ export const getStateObjOrDispatchError = (
@customElement('frigate-card-live')
export class FrigateCardLive extends LitElement {
@property({ attribute: false })
public conditionControllerEpoch?: ConditionControllerEpoch;
public conditionsManagerEpoch?: ConditionsManagerEpoch;
@property({ attribute: false })
public hass?: ExtendedHomeAssistant;
@@ -247,7 +250,7 @@ export class FrigateCardLive extends LitElement {
.nonOverriddenLiveConfig=${this.nonOverriddenLiveConfig}
.overriddenLiveConfig=${this.overriddenLiveConfig}
.inBackground=${this._inBackground}
.conditionControllerEpoch=${this.conditionControllerEpoch}
.conditionsManagerEpoch=${this.conditionsManagerEpoch}
.liveOverrides=${this.liveOverrides}
.cardWideConfig=${this.cardWideConfig}
.cameraManager=${this.cameraManager}
@@ -305,7 +308,7 @@ export class FrigateCardLiveGrid extends LitElement {
public liveOverrides?: LiveOverrides;
@property({ attribute: false })
public conditionControllerEpoch?: ConditionControllerEpoch;
public conditionsManagerEpoch?: ConditionsManagerEpoch;
@property({ attribute: false })
public cardWideConfig?: CardWideConfig;
@@ -325,7 +328,7 @@ export class FrigateCardLiveGrid extends LitElement {
.viewFilterCameraID=${cameraID}
.nonOverriddenLiveConfig=${this.nonOverriddenLiveConfig}
.overriddenLiveConfig=${this.overriddenLiveConfig}
.conditionControllerEpoch=${this.conditionControllerEpoch}
.conditionsManagerEpoch=${this.conditionsManagerEpoch}
.liveOverrides=${this.liveOverrides}
.cardWideConfig=${this.cardWideConfig}
.cameraManager=${this.cameraManager}
@@ -360,7 +363,7 @@ export class FrigateCardLiveGrid extends LitElement {
}
protected render(): TemplateResult | void {
if (!this.conditionControllerEpoch || !this.nonOverriddenLiveConfig) {
if (!this.conditionsManagerEpoch || !this.nonOverriddenLiveConfig) {
return;
}
const cameraIDs = this.cameraManager?.getStore().getVisibleCameraIDs();
@@ -406,7 +409,7 @@ export class FrigateCardLiveCarousel extends LitElement {
public liveOverrides?: LiveOverrides;
@property({ attribute: false })
public conditionControllerEpoch?: ConditionControllerEpoch;
public conditionsManagerEpoch?: ConditionsManagerEpoch;
@property({ attribute: false })
public cardWideConfig?: CardWideConfig;
@@ -572,7 +575,7 @@ export class FrigateCardLiveCarousel extends LitElement {
!this.nonOverriddenLiveConfig ||
!this.hass ||
!this.cameraManager ||
!this.conditionControllerEpoch
!this.conditionsManagerEpoch
) {
return;
}
@@ -581,13 +584,13 @@ export class FrigateCardLiveCarousel extends LitElement {
// <frigate-card-live-provider> is rendering right now, so we provide a
// stateOverride to evaluate the condition in that context.
const config = getOverriddenConfig(
this.conditionControllerEpoch.controller,
this.conditionsManagerEpoch.manager,
this.nonOverriddenLiveConfig,
this.liveOverrides,
{ camera: cameraID },
) as LiveConfig;
const cameraMetadata = this.cameraManager.getCameraMetadata(this.hass, cameraID);
const cameraMetadata = this.cameraManager.getCameraMetadata(cameraID);
return html`
<div class="embla__slide">
@@ -650,14 +653,13 @@ export class FrigateCardLiveCarousel extends LitElement {
};
const cameraMetadataPrevious = prevID
? this.cameraManager.getCameraMetadata(this.hass, overrideCameraID(prevID))
? this.cameraManager.getCameraMetadata(overrideCameraID(prevID))
: null;
const cameraMetadataCurrent = this.cameraManager.getCameraMetadata(
this.hass,
overrideCameraID(this.viewFilterCameraID ?? this.view.camera),
);
const cameraMetadataNext = nextID
? this.cameraManager.getCameraMetadata(this.hass, overrideCameraID(nextID))
? this.cameraManager.getCameraMetadata(overrideCameraID(nextID))
: null;
const titleConfig = getDefaultTitleConfigForView(
src/components/media-filter.ts
+2 -8
View File
@@ -230,7 +230,6 @@ class FrigateCardMediaFilter extends ScopedRegistryHost(LitElement) {
(
await executeMediaQueryForView(
this,
this.hass,
this.cameraManager,
this.view,
queries,
@@ -254,7 +253,6 @@ class FrigateCardMediaFilter extends ScopedRegistryHost(LitElement) {
(
await executeMediaQueryForView(
this,
this.hass,
this.cameraManager,
this.view,
queries,
@@ -275,7 +273,7 @@ class FrigateCardMediaFilter extends ScopedRegistryHost(LitElement) {
this._cameraOptions = Array.from(cameras.keys()).map((cameraID) => ({
value: cameraID,
label: this.hass
? this.cameraManager?.getCameraMetadata(this.hass, cameraID)?.title ?? ''
? this.cameraManager?.getCameraMetadata(cameraID)?.title ?? ''
: '',
}));
}
@@ -284,7 +282,6 @@ class FrigateCardMediaFilter extends ScopedRegistryHost(LitElement) {
if (changedProps.has('cameraManager') && this.hass && this.cameraManager) {
this._mediaMetadataController = new MediaMetadataController(
this,
this.hass,
this.cameraManager,
);
}
@@ -523,7 +520,6 @@ class FrigateCardMediaFilter extends ScopedRegistryHost(LitElement) {
export class MediaMetadataController implements ReactiveController {
protected _host: ReactiveControllerHost;
protected _hass: HomeAssistant;
protected _cameraManager: CameraManager;
public tagsOptions: SelectOption[] = [];
@@ -533,11 +529,9 @@ export class MediaMetadataController implements ReactiveController {
constructor(
host: ReactiveControllerHost,
hass: HomeAssistant,
cameraManager: CameraManager,
) {
this._host = host;
this._hass = hass;
this._cameraManager = cameraManager;
host.addController(this);
}
@@ -549,7 +543,7 @@ export class MediaMetadataController implements ReactiveController {
async hostConnected() {
let metadata: MediaMetadata | null;
try {
metadata = await this._cameraManager.getMediaMetadata(this._hass);
metadata = await this._cameraManager.getMediaMetadata();
} catch (e) {
errorToConsole(e as Error);
return;
src/components/message.ts
+4 -4
View File
@@ -106,12 +106,12 @@ export class FrigateCardProgressIndicator extends LitElement {
}
}
export function renderMessage(message: Message): TemplateResult {
if (message.type === 'error') {
export function renderMessage(message: Message | null): TemplateResult {
if (message?.type === 'error') {
return html` <frigate-card-error-message
.message=${message}
></frigate-card-error-message>`;
} else {
} else if (message) {
return html` <frigate-card-message
.message=${message.message}
.icon=${message.icon}
@@ -124,7 +124,7 @@ export function renderMessage(message: Message): TemplateResult {
export function renderProgressIndicator(options?: {
message?: string;
cardWideConfig?: CardWideConfig;
cardWideConfig?: CardWideConfig | null;
componentRef?: Ref<HTMLElement>;
classes?: ClassInfo;
size?: FrigateCardProgressIndicatorSize;
src/components/surround.ts
-1
View File
@@ -82,7 +82,6 @@ export class FrigateCardSurround extends LitElement {
}
await changeViewToRecentEventsForCameraAndDependents(
this,
this.hass,
this.cameraManager,
this.cardWideConfig,
this.view,
src/components/thumbnail.ts
+3 -3
View File
@@ -271,7 +271,9 @@ export class FrigateCardThumbnailDetailsRecording extends LitElement {
const rawEndTime = this.media.getEndTime();
const duration =
rawStartTime && rawEndTime ? getDurationString(rawStartTime, rawEndTime) : null;
const inProgress = this.media.inProgress() ? localize('recording.in_progress') : null;
const inProgress = this.media.inProgress()
? localize('recording.in_progress')
: null;
const seek = this.seek ? format(this.seek, 'HH:mm:ss') : null;
@@ -404,7 +406,6 @@ export class FrigateCardThumbnail extends LitElement {
mediaCapabilities?.canDownload;
const cameraTitle = this.cameraManager.getCameraMetadata(
this.hass,
this.media.getCameraID(),
)?.title;
@@ -434,7 +435,6 @@ export class FrigateCardThumbnail extends LitElement {
if (this.hass && this.media) {
try {
await this.cameraManager?.favoriteMedia(
this.hass,
this.media,
!this.media?.isFavorite(),
);
src/components/timeline-core.ts
+4 -7
View File
@@ -582,7 +582,6 @@ export class FrigateCardTimelineCore extends LitElement {
if (query) {
view = await executeMediaQueryForView(
this,
this.hass,
this.cameraManager,
this.view,
query,
@@ -675,11 +674,11 @@ export class FrigateCardTimelineCore extends LitElement {
}
this._removeTargetBar();
if (!this.hass || !this._timeline || !this.view) {
if (!this._timeline || !this.view) {
return;
}
await this._timelineSource?.refresh(this.hass, this._getPrefetchWindow(properties));
await this._timelineSource?.refresh(this._getPrefetchWindow(properties));
const queryType = MediaQueriesClassifier.getQueriesType(this.view.query);
if (!queryType) {
@@ -737,7 +736,6 @@ export class FrigateCardTimelineCore extends LitElement {
}
const view = await executeMediaQueryForView(
this,
this.hass,
this.cameraManager,
this.view,
query,
@@ -776,7 +774,7 @@ export class FrigateCardTimelineCore extends LitElement {
if (!this.hass || !this.cameraManager) {
return;
}
const cameraMetadata = this.cameraManager.getCameraMetadata(this.hass, cameraID);
const cameraMetadata = this.cameraManager.getCameraMetadata(cameraID);
const cameraCapabilities = this.cameraManager.getCameraCapabilities(cameraID);
if (cameraMetadata && cameraCapabilities?.supportsTimeline) {
@@ -974,7 +972,6 @@ export class FrigateCardTimelineCore extends LitElement {
*/
protected async _updateTimelineFromView(): Promise<void> {
if (
!this.hass ||
!this.view ||
!this.timelineConfig ||
!this._timelineSource ||
@@ -1029,7 +1026,7 @@ export class FrigateCardTimelineCore extends LitElement {
// (via fetchIfNecessary) may update the timeline contents which causes
// the visjs timeline to stop dragging/panning operations which is very
// disruptive to the user.
await this._timelineSource?.refresh(this.hass, prefetchedWindow);
await this._timelineSource?.refresh(prefetchedWindow);
}
const currentSelection = this._timeline.getSelection();
src/components/viewer.ts
+3 -12
View File
@@ -151,7 +151,6 @@ export class FrigateCardViewer extends LitElement {
if (mediaType === 'recordings') {
changeViewToRecentRecordingForCameraAndDependents(
this,
this.hass,
this.cameraManager,
this.cardWideConfig,
this.view,
@@ -163,7 +162,6 @@ export class FrigateCardViewer extends LitElement {
} else {
changeViewToRecentEventsForCameraAndDependents(
this,
this.hass,
this.cameraManager,
this.cardWideConfig,
this.view,
@@ -447,7 +445,6 @@ export class FrigateCardViewerCarousel extends LitElement {
};
const cameraMetadata = this.cameraManager.getCameraMetadata(
this.hass,
selectedMedia.getCameraID(),
);
@@ -526,12 +523,7 @@ export class FrigateCardViewerCarousel extends LitElement {
*/
protected async _seekHandler(): Promise<void> {
const seek = this.view?.context?.mediaViewer?.seek;
if (
!this.hass ||
!seek ||
!this._media ||
!this._player
) {
if (!this.hass || !seek || !this._media || !this._player) {
return;
}
const selectedMedia = this._media[this._selected];
@@ -548,8 +540,7 @@ export class FrigateCardViewerCarousel extends LitElement {
}
const seekTime =
(await this.cameraManager?.getMediaSeekTime(this.hass, selectedMedia, seek)) ??
null;
(await this.cameraManager?.getMediaSeekTime(selectedMedia, seek)) ?? null;
if (seekTime !== null) {
this._player.seek(seekTime);
@@ -813,7 +804,7 @@ export class FrigateCardViewerProvider
let mediaArray: ViewMedia[] | null;
try {
mediaArray = await this.cameraManager.executeMediaQueries(this.hass, queries);
mediaArray = await this.cameraManager.executeMediaQueries(queries);
} catch (e) {
errorToConsole(e as Error);
return;
src/components/views.ts
+46 -32
View File
@@ -9,13 +9,17 @@ import {
import { customElement, property } from 'lit/decorators.js';
import { classMap } from 'lit/directives/class-map.js';
import { CameraManager } from '../camera-manager/manager.js';
import { ConditionControllerEpoch, getOverridesByKey } from '../conditions';
import { ConditionsManagerEpoch, getOverridesByKey } from '../utils/card-controller/conditions-manager';
import viewsStyle from '../scss/views.scss';
import { CardWideConfig, ExtendedHomeAssistant, FrigateCardConfig } from '../types.js';
import { ResolvedMediaCache } from '../utils/ha/resolved-media';
import { ExtendedHomeAssistant } from '../types.js';
import { ConfigManager } from '../utils/card-controller/config-manager.js';
import { ResolvedMediaCache } from '../utils/ha/resolved-media.js';
import { View } from '../view/view.js';
import './surround.js';
// As a special case: Diagnostics is not dynamically loaded in case something goes wrong.
import './diagnostics.js';
@customElement('frigate-card-views')
export class FrigateCardViews extends LitElement {
@property({ attribute: false })
@@ -28,19 +32,13 @@ export class FrigateCardViews extends LitElement {
public cameraManager?: CameraManager;
@property({ attribute: false })
public config?: FrigateCardConfig;
@property({ attribute: false })
public nonOverriddenConfig?: FrigateCardConfig;
@property({ attribute: false })
public cardWideConfig?: CardWideConfig;
public configManager?: ConfigManager;
@property({ attribute: false })
public resolvedMediaCache?: ResolvedMediaCache;
@property({ attribute: false })
public conditionControllerEpoch?: ConditionControllerEpoch;
public conditionsManagerEpoch?: ConditionsManagerEpoch;
@property({ attribute: false })
public hide?: boolean;
@@ -93,15 +91,24 @@ export class FrigateCardViews extends LitElement {
}
protected _shouldLivePreload(): boolean {
return !!this.config?.live.preload;
return (
// Special case: Never preload for diagnostics -- we want that to be as
// minimal as possible.
!!this.configManager?.getConfig()?.live.preload && !this.view?.is('diagnostics')
);
}
protected render(): TemplateResult | void {
const config = this.configManager?.getConfig();
const nonOverriddenConfig = this.configManager?.getNonOverriddenConfig();
const cardWideConfig = this.configManager?.getCardWideConfig();
const rawConfig = this.configManager?.getRawConfig();
// Only essential items should be added to the below list, since we want the
// overall views pane to render in ~almost all cases (e.g. for a camera
// initialization error to display, `view` and `cameraConfig` may both be
// undefined, but we still want to render).
if (!this.hass || !this.config || !this.nonOverriddenConfig) {
if (!this.hass || !config || !nonOverriddenConfig || !cardWideConfig) {
return html``;
}
@@ -115,17 +122,17 @@ export class FrigateCardViews extends LitElement {
};
const thumbnailConfig = this.view?.is('live')
? this.config.live.controls.thumbnails
? config.live.controls.thumbnails
: this.view?.isViewerView()
? this.config.media_viewer.controls.thumbnails
? config.media_viewer.controls.thumbnails
: this.view?.is('timeline')
? this.config.timeline.controls.thumbnails
? config.timeline.controls.thumbnails
: undefined;
const miniTimelineConfig = this.view?.is('live')
? this.config.live.controls.timeline
? config.live.controls.timeline
: this.view?.isViewerView()
? this.config.media_viewer.controls.timeline
? config.media_viewer.controls.timeline
: undefined;
const cameraConfig = this.view
@@ -137,16 +144,16 @@ export class FrigateCardViews extends LitElement {
.hass=${this.hass}
.view=${this.view}
.fetchMedia=${this.view?.is('live')
? this.config.live.controls.thumbnails.media
? config.live.controls.thumbnails.media
: undefined}
.thumbnailConfig=${!this.hide ? thumbnailConfig : undefined}
.timelineConfig=${!this.hide ? miniTimelineConfig : undefined}
.cameraManager=${this.cameraManager}
.cardWideConfig=${this.cardWideConfig}
.cardWideConfig=${cardWideConfig}
>
${!this.hide && this.view?.is('image') && cameraConfig
? html` <frigate-card-image
.imageConfig=${this.config.image}
.imageConfig=${config.image}
.view=${this.view}
.hass=${this.hass}
.cameraConfig=${cameraConfig}
@@ -158,9 +165,9 @@ export class FrigateCardViews extends LitElement {
? html` <frigate-card-gallery
.hass=${this.hass}
.view=${this.view}
.galleryConfig=${this.config.media_gallery}
.galleryConfig=${config.media_gallery}
.cameraManager=${this.cameraManager}
.cardWideConfig=${this.cardWideConfig}
.cardWideConfig=${cardWideConfig}
>
</frigate-card-gallery>`
: ``}
@@ -169,10 +176,10 @@ export class FrigateCardViews extends LitElement {
<frigate-card-viewer
.hass=${this.hass}
.view=${this.view}
.viewerConfig=${this.config.media_viewer}
.viewerConfig=${config.media_viewer}
.resolvedMediaCache=${this.resolvedMediaCache}
.cameraManager=${this.cameraManager}
.cardWideConfig=${this.cardWideConfig}
.cardWideConfig=${cardWideConfig}
>
</frigate-card-viewer>
`
@@ -181,12 +188,19 @@ export class FrigateCardViews extends LitElement {
? html` <frigate-card-timeline
.hass=${this.hass}
.view=${this.view}
.timelineConfig=${this.config.timeline}
.timelineConfig=${config.timeline}
.cameraManager=${this.cameraManager}
.cardWideConfig=${this.cardWideConfig}
.cardWideConfig=${cardWideConfig}
>
</frigate-card-timeline>`
: ``}
${!this.hide && this.view?.is('diagnostics')
? html` <frigate-card-diagnostics
.hass=${this.hass}
.rawConfig=${rawConfig}
>
</frigate-card-diagnostics>`
: ``}
${
// Note: Subtle difference in condition below vs the other views in order
// to always render the live view for live.preload mode.
@@ -199,12 +213,12 @@ export class FrigateCardViews extends LitElement {
<frigate-card-live
.hass=${this.hass}
.view=${this.view}
.nonOverriddenLiveConfig=${this.nonOverriddenConfig.live}
.overriddenLiveConfig=${this.config.live}
.conditionControllerEpoch=${this.conditionControllerEpoch}
.liveOverrides=${getOverridesByKey('live', this.config.overrides)}
.nonOverriddenLiveConfig=${nonOverriddenConfig.live}
.overriddenLiveConfig=${config.live}
.conditionsManagerEpoch=${this.conditionsManagerEpoch}
.liveOverrides=${getOverridesByKey('live', config.overrides)}
.cameraManager=${this.cameraManager}
.cardWideConfig=${this.cardWideConfig}
.cardWideConfig=${cardWideConfig}
.microphoneStream=${this.microphoneStream}
class="${classMap(liveClasses)}"
>
src/types.ts
+18 -15
View File
@@ -43,6 +43,7 @@ export const FRIGATE_CARD_VIEWS_USER_SPECIFIED = [
const FRIGATE_CARD_VIEWS = [
...FRIGATE_CARD_VIEWS_USER_SPECIFIED,
'diagnostics',
// Media: A generic piece of media (could be clip, snapshot, recording).
'media',
@@ -777,6 +778,14 @@ const viewConfigDefault = {
untrigger_reset: true,
},
};
const scanSchema = z.object({
enabled: z.boolean().default(viewConfigDefault.scan.enabled).optional(),
show_trigger_status: z.boolean().default(viewConfigDefault.scan.show_trigger_status).optional(),
untrigger_seconds: z.number().default(viewConfigDefault.scan.untrigger_seconds).optional(),
untrigger_reset: z.boolean().default(viewConfigDefault.scan.untrigger_reset).optional(),
});
export type ScanOptions = z.infer<typeof scanSchema>;
const viewConfigSchema = z
.object({
default: z
@@ -792,16 +801,7 @@ const viewConfigSchema = z
update_entities: z.string().array().optional(),
render_entities: z.string().array().optional(),
dark_mode: z.enum(['on', 'off', 'auto']).optional(),
scan: z
.object({
enabled: z.boolean().default(viewConfigDefault.scan.enabled),
show_trigger_status: z
.boolean()
.default(viewConfigDefault.scan.show_trigger_status),
untrigger_seconds: z.number().default(viewConfigDefault.scan.untrigger_seconds),
untrigger_reset: z.boolean().default(viewConfigDefault.scan.untrigger_reset),
})
.default(viewConfigDefault.scan),
scan: scanSchema.default(viewConfigDefault.scan),
})
.merge(actionsSchema)
.default(viewConfigDefault);
@@ -1365,7 +1365,7 @@ const automationSchema = z.object({
});
export type Automation = z.infer<typeof automationSchema>;
export const automationsSchema = automationSchema.array().optional();
const automationsSchema = automationSchema.array().optional();
export type Automations = z.infer<typeof automationsSchema>;
const performanceConfigDefault = {
@@ -1458,7 +1458,6 @@ export const frigateCardConfigSchema = z.object({
// Stock lovelace card config.
type: z.string(),
test_gui: z.boolean().optional(),
});
export type FrigateCardConfig = z.infer<typeof frigateCardConfigSchema>;
export type RawFrigateCardConfig = Record<string, unknown>;
@@ -1504,15 +1503,19 @@ export interface MediaLoadedInfo {
capabilities?: MediaLoadedCapabilities;
}
export const MESSAGE_TYPE_PRIORITIES = {
export type MessageType = 'info' | 'error' | 'connection' | 'diagnostics';
type MessagePriority = {
[type in MessageType]: number;
};
export const MESSAGE_TYPE_PRIORITIES: MessagePriority = {
info: 10,
error: 20,
connection: 30,
diagnostics: 40,
};
export type MessageType = 'info' | 'error' | 'connection' | 'diagnostics';
export interface Message {
message: string;
type: MessageType;
src/utils/action.ts
-19
View File
@@ -10,7 +10,6 @@ import {
FrigateCardAction,
FrigateCardCustomAction,
frigateCardCustomActionSchema,
FrigateCardViewAction,
ViewDisplayMode,
} from '../types.js';
@@ -187,21 +186,3 @@ export const frigateCardHasAction = (config?: ActionType | ActionType[]): boolea
export const stopEventFromActivatingCardWideActions = (ev: Event): void => {
ev.stopPropagation();
};
export const isViewAction = (
action: FrigateCardCustomAction,
): action is FrigateCardViewAction => {
switch (action.frigate_card_action) {
case 'clip':
case 'clips':
case 'image':
case 'live':
case 'recording':
case 'recordings':
case 'snapshot':
case 'snapshots':
case 'timeline':
return true;
}
return false;
};
src/utils/card-controller/actions-manager.ts
+221
View File
@@ -0,0 +1,221 @@
import {
Actions,
ActionsConfig, FrigateCardCustomAction, FRIGATE_CARD_VIEW_DEFAULT
} from '../../types.js';
import {
convertActionToFrigateCardCustomAction,
frigateCardHandleActionConfig,
getActionConfigGivenAction
} from '../action.js';
import { getStreamCameraID } from '../substream.js';
import { CardActionsManagerAPI } from './types.js';
export class ActionsManager {
protected _api: CardActionsManagerAPI;
constructor(api: CardActionsManagerAPI) {
this._api = api;
}
/**
* Merge card-wide and view-specific actions.
* @returns A combined set of action.
*/
public getMergedActions(): ActionsConfig {
const view = this._api.getViewManager().getView();
if (this._api.getMessageManager().hasMessage()) {
return {};
}
const config = this._api.getConfigManager().getConfig();
let specificActions: Actions | undefined = undefined;
if (view?.is('live')) {
specificActions = config?.live.actions;
} else if (view?.isGalleryView()) {
specificActions = config?.media_gallery?.actions;
} else if (view?.isViewerView()) {
specificActions = config?.media_viewer.actions;
} else if (view?.is('image')) {
specificActions = config?.image?.actions;
} else {
return {};
}
return { ...config?.view.actions, ...specificActions };
}
/**
* Handle an human interaction called on an element (e.g. 'tap').
*/
public handleInteraction(interaction: string): void {
const hass = this._api.getHASSManager().getHASS();
const config = this.getMergedActions();
const actionConfig = getActionConfigGivenAction(interaction, config);
if (
hass &&
config &&
interaction &&
// Don't call frigateCardHandleActionConfig() unless there is explicitly an
// action defined (as it uses a default that is unhelpful for views that
// have default tap/click actions).
actionConfig
) {
frigateCardHandleActionConfig(
this._api.getCardElementManager().getElement(),
hass,
config,
interaction,
actionConfig,
);
}
}
public handleActionEvent = (ev: Event): void => {
if (!('detail' in ev)) {
// The event may not actually be a CustomEvent object, but may still have a
// detail field. See:
// https://github.com/custom-cards/custom-card-helpers/blob/master/src/fire-event.ts#L70
return;
}
const frigateCardAction = convertActionToFrigateCardCustomAction(ev.detail);
if (frigateCardAction) {
this.executeAction(frigateCardAction);
}
};
/**
* Execute a card action.
* @param frigateCardAction
* @returns `true` if an action is executed.
*/
public async executeAction(frigateCardAction: FrigateCardCustomAction): Promise<void> {
const config = this._api.getConfigManager().getConfig();
const mediaLoadedInfoManager = this._api.getMediaLoadedInfoManager();
if (
// Command not intended for this card (e.g. query string command).
frigateCardAction.card_id &&
config?.card_id !== frigateCardAction.card_id
) {
return;
}
// Note: This function needs to process (view-related) commands even when
// _view has not yet been initialized (since it may be used to set a view
// via the querystring).
const view = this._api.getViewManager().getView();
const action = frigateCardAction.frigate_card_action;
switch (action) {
case 'default':
this._api.getViewManager().setViewDefault();
break;
case 'clip':
case 'clips':
case 'image':
case 'live':
case 'recording':
case 'recordings':
case 'snapshot':
case 'snapshots':
case 'timeline':
this._api.getViewManager().setViewByParameters({
viewName: action,
cameraID: view?.camera,
});
break;
case 'download':
await this._api.getDownloadManager().downloadViewerMedia();
break;
case 'camera_ui':
this._api.getCameraURLManager().openURL();
break;
case 'expand':
this._api.getExpandManager().toggleExpanded();
break;
case 'fullscreen':
this._api.getFullscreenManager().toggleFullscreen();
break;
case 'menu_toggle':
// This is a rare code path: this would only be used if someone has a
// menu toggle action configured outside of the menu itself (e.g.
// picture elements).
this._api.getCardElementManager().toggleMenu();
break;
case 'camera_select':
const selectCameraID = frigateCardAction.camera;
if (view) {
const viewOnCameraSelect = config?.view.camera_select ?? 'current';
const targetViewName =
viewOnCameraSelect === 'current' ? view.view : viewOnCameraSelect;
const verifiedViewName = this._api
.getViewManager()
.isViewSupportedByCamera(selectCameraID, targetViewName)
? targetViewName
: FRIGATE_CARD_VIEW_DEFAULT;
this._api.getViewManager().setViewByParameters({
viewName: verifiedViewName,
cameraID: selectCameraID,
});
}
break;
case 'live_substream_select': {
this._api.getViewManager().setViewWithSubstream(frigateCardAction.camera);
break;
}
case 'live_substream_off': {
this._api.getViewManager().setViewWithoutSubstream();
break;
}
case 'live_substream_on': {
this._api.getViewManager().setViewWithSubstream();
break;
}
case 'media_player':
const mediaPlayer = frigateCardAction.media_player;
const mediaPlayerController = this._api.getMediaPlayerManager();
const media = view?.queryResults?.getSelectedResult() ?? null;
if (frigateCardAction.media_player_action === 'stop') {
await mediaPlayerController.stop(mediaPlayer);
} else if (view?.is('live')) {
await mediaPlayerController.playLive(mediaPlayer, getStreamCameraID(view));
} else if (view?.isViewerView() && media) {
await mediaPlayerController.playMedia(mediaPlayer, media);
}
break;
case 'diagnostics':
this._api.getViewManager().setViewByParameters({ viewName: 'diagnostics' });
break;
case 'microphone_mute':
this._api.getMicrophoneManager().mute();
break;
case 'microphone_unmute':
await this._api.getMicrophoneManager().unmute();
break;
case 'mute':
await mediaLoadedInfoManager.get()?.player?.mute();
break;
case 'unmute':
await mediaLoadedInfoManager.get()?.player?.unmute();
break;
case 'play':
await mediaLoadedInfoManager.get()?.player?.play();
break;
case 'pause':
await mediaLoadedInfoManager.get()?.player?.pause();
break;
case 'screenshot':
await this._api.getDownloadManager().downloadScreenshot();
break;
case 'display_mode_select':
this._api
.getViewManager()
.setViewWithNewDisplayMode(frigateCardAction.display_mode);
break;
default:
console.warn(`Frigate card received unknown card action: ${action}`);
}
}
}
src/utils/card-controller/auto-update-manager.ts
+43
View File
@@ -0,0 +1,43 @@
import { Timer } from '../timer';
import { CardAutoRefreshAPI } from './types';
export class AutoUpdateManager {
protected _timer = new Timer();
protected _api: CardAutoRefreshAPI;
constructor(api: CardAutoRefreshAPI) {
this._api = api;
}
/**
* Set the update timer to trigger an update refresh every
* `view.update_seconds`.
*/
public startDefaultViewTimer(): void {
this._timer.stop();
const updateSeconds = this._api.getConfigManager().getConfig()
?.view.update_seconds;
if (updateSeconds) {
this._timer.start(updateSeconds, () => {
if (this._isAutomatedUpdateAllowed()) {
this._api.getViewManager().setViewDefault();
} else {
// Not allowed to update this time around, but try again at the next
// interval.
this.startDefaultViewTimer();
}
});
}
}
protected _isAutomatedUpdateAllowed(): boolean {
const triggers = this._api.getTriggersManager();
const config = this._api.getConfigManager().getConfig();
const interactionManager = this._api.getInteractionManager();
return (
!triggers.isTriggered() &&
(config?.view.update_force || !interactionManager.hasInteraction())
);
}
}
src/utils/card-controller/automations-manager.ts
+73
View File
@@ -0,0 +1,73 @@
import { localize } from '../../localize/localize.js';
import {
Automation,
AutomationActions,
Automations,
} from '../../types.js';
import { frigateCardHandleAction } from '../action.js';
import { CardAutomationsAPI } from './types.js';
const MAX_NESTED_AUTOMATION_EXECUTIONS = 10;
export class AutomationsManager {
protected _api: CardAutomationsAPI;
protected _automations: Automations;
protected _priorEvaluations: Map<Automation, boolean> = new Map();
// A counter to avoid infinite loops, increases every time actions are run,
// decreases every time actions are complete.
protected _nestedAutomationExecutions = 0;
constructor(api: CardAutomationsAPI) {
this._api = api;
}
public setAutomationsFromConfig() {
this._automations = this._api
.getConfigManager()
.getNonOverriddenConfig()?.automations;
}
public execute(): void {
const hass = this._api.getHASSManager().getHASS();
// Never execute automations if there's an error (as our automation loop
// avoidance -- which shows as an error -- would not work!).
if (!hass || this._api.getMessageManager().hasErrorMessage()) {
return;
}
const actionsToRun: AutomationActions[] = [];
for (const automation of this._automations ?? []) {
const shouldExecute = this._api
.getConditionsManager()
.evaluateCondition(automation.conditions);
const actions = shouldExecute ? automation.actions : automation.actions_not;
const priorEvaluation = this._priorEvaluations.get(automation);
this._priorEvaluations.set(automation, shouldExecute);
if (shouldExecute !== priorEvaluation && actions) {
actionsToRun.push(actions);
}
}
++this._nestedAutomationExecutions;
if (this._nestedAutomationExecutions > MAX_NESTED_AUTOMATION_EXECUTIONS) {
this._api.getMessageManager().setMessageIfHigherPriority({
type: 'error',
message: localize('error.too_many_automations'),
});
return;
}
actionsToRun.forEach((actions) => {
frigateCardHandleAction(
this._api.getCardElementManager().getElement(),
hass,
{},
actions,
);
});
--this._nestedAutomationExecutions;
}
}
src/utils/card-controller/camera-url-manager.ts
+32
View File
@@ -0,0 +1,32 @@
import { CardCameraURLAPI } from './types';
export class CameraURLManager {
protected _api: CardCameraURLAPI;
constructor(api: CardCameraURLAPI) {
this._api = api;
}
public openURL(): void {
const url = this.getCameraURL();
if (url) {
window.open(url);
}
}
public hasCameraURL(): boolean {
return !!this.getCameraURL();
}
public getCameraURL(): string | null {
const view = this._api.getViewManager().getView();
const media = view?.queryResults?.getSelectedResult() ?? null;
const endpoints = view?.camera
? this._api.getCameraManager().getCameraEndpoints(view.camera, {
view: view.view,
...(media && { media: media }),
}) ?? null
: null;
return endpoints?.ui?.endpoint ?? null;
}
}
src/utils/card-controller/card-element-manager.ts
+117
View File
@@ -0,0 +1,117 @@
import { LitElement, ReactiveControllerHost } from 'lit';
import { ActionEventTarget } from '../../action-handler-directive';
import { setOrRemoveAttribute } from '../basic';
import { isCardInPanel } from '../ha';
import { CardElementAPI } from './types';
export type ScrollCallback = () => void;
export type MenuToggleCallback = () => void;
export type CardHTMLElement = LitElement & ReactiveControllerHost & ActionEventTarget;
export class CardElementManager {
protected _api: CardElementAPI;
protected _element: CardHTMLElement;
protected _scrollCallback: ScrollCallback;
protected _menuToggleCallback: MenuToggleCallback;
constructor(
api: CardElementAPI,
element: CardHTMLElement,
scrollCallback: ScrollCallback,
menuToggleCallback: MenuToggleCallback,
) {
this._api = api;
this._element = element;
this._scrollCallback = scrollCallback;
this._menuToggleCallback = menuToggleCallback;
}
public getElement(): HTMLElement {
return this._element;
}
public scrollReset(): void {
this._scrollCallback();
}
public toggleMenu(): void {
this._menuToggleCallback();
}
public update(): void {
this._element.requestUpdate();
}
public hasUpdated(): boolean {
return this._element.hasUpdated;
}
public getCardHeight(): number {
return this._element.getBoundingClientRect().height;
}
public elementConnected(): void {
// Whether or not the card is in panel mode on the dashboard.
setOrRemoveAttribute(this._element, isCardInPanel(this._element), 'panel');
this._api.getFullscreenManager().connect();
this._element.addEventListener(
'mousemove',
this._api.getInteractionManager().reportInteraction,
);
this._element.addEventListener(
'll-custom',
this._api.getActionsManager().handleActionEvent,
);
this._element.addEventListener(
'@action',
this._api.getInteractionManager().reportInteraction,
);
// Listen for HA `navigate` actions.
// See: https://github.com/home-assistant/frontend/blob/273992c8e9c3062c6e49481b6d7d688a07067232/src/common/navigate.ts#L43
window.addEventListener(
'location-changed',
this._api.getQueryStringManager().executeAll,
);
// Listen for history state changes (i.e. user using the browser
// back/forward controls).
window.addEventListener('popstate', this._api.getQueryStringManager().executeAll);
// Manually call the location change handler as the card will be
// disconnected/reconnected when dashboard 'tab' changes happen within HA.
this._api.getQueryStringManager().executeAll();
}
public elementDisconnected(): void {
setOrRemoveAttribute(this._element, false, 'panel');
// When the dashboard 'tab' is changed, the media is effectively unloaded.
this._api.getMediaLoadedInfoManager().clear();
this._api.getFullscreenManager().disconnect();
this._element.removeEventListener(
'mousemove',
this._api.getInteractionManager().reportInteraction,
);
this._element.removeEventListener(
'll-custom',
this._api.getActionsManager().handleActionEvent,
);
this._element.removeEventListener(
'@action',
this._api.getInteractionManager().reportInteraction,
);
window.removeEventListener(
'location-changed',
this._api.getQueryStringManager().executeAll,
);
window.removeEventListener('popstate', this._api.getQueryStringManager().executeAll);
}
}
src/conditions.ts → src/utils/card-controller/conditions-manager.ts
+67 -67
View File
@@ -1,14 +1,14 @@
import { HassEntities } from 'home-assistant-js-websocket';
import merge from 'lodash-es/merge';
import { copyConfig } from './config-mgmt';
import { copyConfig } from '../../config-mgmt';
import {
FrigateCardCondition,
FrigateCardConfig,
frigateConditionalSchema,
OverrideConfigurationKey,
RawFrigateCardConfig,
ViewDisplayMode
} from './types';
ViewDisplayMode,
} from '../../types';
import { CardConditionAPI } from './types';
interface ConditionState {
view?: string;
@@ -69,7 +69,7 @@ type RawOverrides = {
}[];
export function getOverriddenConfig(
controller: Readonly<ConditionController>,
manager: Readonly<ConditionsManager>,
config: Readonly<RawFrigateCardConfig>,
configOverrides?: Readonly<RawOverrides>,
stateOverrides?: Partial<ConditionState>,
@@ -78,7 +78,7 @@ export function getOverriddenConfig(
let overridden = false;
if (configOverrides) {
for (const override of configOverrides) {
if (controller.evaluateCondition(override.conditions, stateOverrides)) {
if (manager.evaluateCondition(override.conditions, stateOverrides)) {
merge(output, override.overrides);
overridden = true;
}
@@ -103,19 +103,23 @@ export function getOverridesByKey(
);
}
// A tiny wrapper interface to allow the same controller to be passed around
// A tiny wrapper interface to allow the same manager to be passed around
// immutably within objects that will not be equal (===). Every state change
// generates a new epoch. This is used for Lit rendering to ensure changes to
// condition state are recognized as changes even though the controller is the
// condition state are recognized as changes even though the manager is the
// same.
export interface ConditionControllerEpoch {
controller: Readonly<ConditionController>;
export interface ConditionsManagerEpoch {
manager: Readonly<ConditionsManager>;
}
export class ConditionController {
export type ConditionsManagerListener = () => void;
export class ConditionsManager {
protected _api: CardConditionAPI;
protected _state: ConditionState = {};
protected _epoch: ConditionControllerEpoch = this._createEpoch();
protected _stateListeners: (() => void)[] = [];
protected _epoch: ConditionsManagerEpoch = this._createEpoch();
protected _listeners: ConditionsManagerListener[];
// Whether or not to include HA state in ConditionState. Doing so increases
// CPU usage as HA state is pumped out very fast, so this is only enabled if
@@ -124,29 +128,59 @@ export class ConditionController {
protected _mediaQueries: MediaQueryList[] = [];
protected _mediaQueryTrigger = () => this._triggerChange();
constructor(config?: FrigateCardConfig) {
if (config) {
this._initConditions(config);
}
constructor(api: CardConditionAPI, listener?: ConditionsManagerListener) {
this._api = api;
this._listeners = [
() => this._api.getConfigManager().computeOverrideConfig(),
() => this._api.getAutomationsManager().execute(),
...(listener ? [listener] : [])
];
}
public addStateListener(callback: () => void): void {
this._stateListeners.push(callback);
}
public removeStateListener(callback: () => void): void {
this._stateListeners = this._stateListeners.filter(
(listener) => listener != callback,
);
}
public destroy(): void {
public removeConditions(): void {
this._mediaQueries.forEach((mql) =>
mql.removeEventListener('change', this._mediaQueryTrigger),
);
this._mediaQueries = [];
}
public setConditionsFromConfig(): void {
this.removeConditions();
const getAllConditions = (): FrigateCardCondition[] => {
const config = this._api.getConfigManager().getConfig();
const conditions: FrigateCardCondition[] = [];
config?.overrides?.forEach((override) => conditions.push(override.conditions));
// Element conditions can be arbitrarily nested underneath conditionals and
// custom elements that this card may not known. Here we recursively parse
// down the elements tree, parsing as we go to find valid conditions.
const getElementsConditions = (data: unknown): void => {
const parseResult = frigateConditionalSchema.safeParse(data);
if (parseResult.success) {
conditions.push(parseResult.data.conditions);
parseResult.data.elements?.forEach(getElementsConditions);
} else if (data && typeof data === 'object') {
Object.keys(data).forEach((key) => getElementsConditions(data[key]));
}
};
config?.elements?.forEach(getElementsConditions);
return conditions;
};
const conditions = getAllConditions();
this._hasHAStateConditions = conditions.some(
(condition) => !!condition.state?.length,
);
conditions.forEach((condition) => {
if (condition.media_query) {
const mql = window.matchMedia(condition.media_query);
mql.addEventListener('change', this._mediaQueryTrigger);
this._mediaQueries.push(mql);
}
});
}
public setState(state: Partial<ConditionState>): void {
this._state = {
...this._state,
@@ -155,11 +189,11 @@ export class ConditionController {
this._triggerChange();
}
get hasHAStateConditions(): boolean {
public hasHAStateConditions(): boolean {
return this._hasHAStateConditions;
}
public getEpoch(): ConditionControllerEpoch {
public getEpoch(): ConditionsManagerEpoch {
return this._epoch;
}
@@ -212,46 +246,12 @@ export class ConditionController {
return result;
}
protected _createEpoch(): ConditionControllerEpoch {
return { controller: this };
protected _createEpoch(): ConditionsManagerEpoch {
return { manager: this };
}
protected _triggerChange(): void {
this._epoch = this._createEpoch();
this._stateListeners.forEach((listener) => listener());
}
protected _initConditions(config: FrigateCardConfig): void {
const getAllConditions = (config: FrigateCardConfig): FrigateCardCondition[] => {
const conditions: FrigateCardCondition[] = [];
config.overrides?.forEach((override) => conditions.push(override.conditions));
// Element conditions can be arbitrarily nested underneath conditionals and
// custom elements that this card may not known. Here we recursively parse
// down the elements tree, parsing as we go to find valid conditions.
const getElementsConditions = (data: unknown): void => {
const parseResult = frigateConditionalSchema.safeParse(data);
if (parseResult.success) {
conditions.push(parseResult.data.conditions);
parseResult.data.elements?.forEach(getElementsConditions);
} else if (data && typeof data === 'object') {
Object.keys(data).forEach((key) => getElementsConditions(data[key]));
}
};
config.elements?.forEach(getElementsConditions);
return conditions;
};
const conditions = getAllConditions(config);
this._hasHAStateConditions = conditions.some(
(condition) => !!condition.state?.length,
);
conditions.forEach((condition) => {
if (condition.media_query) {
const mql = window.matchMedia(condition.media_query);
mql.addEventListener('change', this._mediaQueryTrigger);
this._mediaQueries.push(mql);
}
});
this._listeners.forEach((listener) => listener());
}
}
src/utils/card-controller/config-manager.ts
+147
View File
@@ -0,0 +1,147 @@
import isEqual from 'lodash-es/isEqual';
import { isConfigUpgradeable } from '../../config-mgmt';
import { localize } from '../../localize/localize';
import { setLowPerformanceProfile } from '../../performance.js';
import {
CardWideConfig,
FrigateCardConfig,
frigateCardConfigSchema,
RawFrigateCardConfig,
} from '../../types';
import { getParseErrorPaths } from '../zod.js';
import { getOverriddenConfig } from './conditions-manager';
import { InitializationAspect } from './initialization-manager';
import { CardConfigAPI } from './types';
export class ConfigManager {
protected _api: CardConfigAPI;
// The main base configuration object. For most usecases use getConfig() to
// get the correct configuration (which will return overrides as appropriate).
// This variable must be called `_config` or `config` to be compatible with
// card-mod.
protected _config: FrigateCardConfig | null = null;
protected _overriddenConfig: FrigateCardConfig | null = null;
protected _rawConfig: RawFrigateCardConfig | null = null;
protected _cardWideConfig: CardWideConfig | null = null;
constructor(api) {
this._api = api;
}
public hasConfig(): boolean {
return !!this.getConfig();
}
public getConfig(): FrigateCardConfig | null {
return this._overriddenConfig ?? this._config;
}
public getCardWideConfig(): CardWideConfig | null {
return this._cardWideConfig;
}
public getNonOverriddenConfig(): FrigateCardConfig | null {
return this._config;
}
public getRawConfig(): RawFrigateCardConfig | null {
return this._rawConfig;
}
public setConfig(inputConfig?: RawFrigateCardConfig): void {
if (!inputConfig) {
throw new Error(localize('error.invalid_configuration'));
}
const parseResult = frigateCardConfigSchema.safeParse(inputConfig);
if (!parseResult.success) {
const configUpgradeable = isConfigUpgradeable(inputConfig);
const hint = getParseErrorPaths(parseResult.error);
let upgradeMessage = '';
if (configUpgradeable) {
upgradeMessage = `${localize('error.upgrade_available')}. `;
}
throw new Error(
upgradeMessage +
`${localize('error.invalid_configuration')}: ` +
(hint && hint.size
? JSON.stringify([...hint], null, ' ')
: localize('error.invalid_configuration_no_hint')),
);
}
const config =
parseResult.data.performance.profile !== 'low'
? parseResult.data
: setLowPerformanceProfile(inputConfig, parseResult.data);
this._rawConfig = inputConfig;
if (isEqual(this._config, config)) {
return;
}
this._config = config;
this._cardWideConfig = {
performance: config.performance,
debug: config.debug,
};
this._api.getConditionsManager().setConditionsFromConfig();
this._api.getConditionsManager().setState({
view: undefined,
displayMode: undefined,
camera: undefined,
});
this._api.getMediaLoadedInfoManager().clear();
this._api.getViewManager().reset();
this._api.getMessageManager().reset();
this._api.getAutomationsManager().setAutomationsFromConfig();
this._api.getStyleManager().setPerformance();
this._api.getCardElementManager().update();
this.computeOverrideConfig();
}
public computeOverrideConfig(): void {
const conditionsManager = this._api.getConditionsManager();
if (!this._config) {
return;
}
const overriddenConfig = getOverriddenConfig(
conditionsManager,
this._config,
this._config.overrides,
) as FrigateCardConfig;
// Save on Lit re-rendering costs by only updating the configuration if it
// actually changes.
if (isEqual(overriddenConfig, this._overriddenConfig)) {
return;
}
const previousConfig = this._overriddenConfig;
this._overriddenConfig = overriddenConfig;
this._api.getStyleManager().setMinMaxHeight();
if (
previousConfig &&
(!isEqual(previousConfig?.cameras, this._overriddenConfig?.cameras) ||
!isEqual(previousConfig?.cameras_global, this._overriddenConfig?.cameras_global))
) {
this._api.getInitializationManager().uninitialize(InitializationAspect.CAMERAS);
}
if (
previousConfig &&
previousConfig?.live.microphone.always_connected !==
this._overriddenConfig?.live.microphone.always_connected
) {
this._api
.getInitializationManager()
.uninitialize(InitializationAspect.MICROPHONE_CONNECT);
}
this._api.getCardElementManager().update();
}
}
src/utils/card-controller/controller.ts
+264
View File
@@ -0,0 +1,264 @@
// TODO: test errors during rendering to make sure resetMessage is no longer necessary.
// TODO: Test HA state connection/disconnect logic in real life.
// TODO: Should not need to import screenfull anywhere except the fullscreen manager.
// TODO: executeMediaQueryForView should not need a HTMLElement host parameter see the view-manager.ts call in particular.
import { LovelaceCardEditor } from 'custom-card-helpers';
import { ReactiveController } from 'lit';
import { CameraManager } from '../../camera-manager/manager';
import { FrigateCardConfig } from '../../types';
import { EntityRegistryManager } from '../ha/entity-registry';
import { EntityCache } from '../ha/entity-registry/cache';
import { ResolvedMediaCache } from '../ha/resolved-media';
import { ActionsManager } from './actions-manager';
import { AutoUpdateManager } from './auto-update-manager';
import { AutomationsManager } from './automations-manager';
import { CameraURLManager } from './camera-url-manager';
import {
CardElementManager,
CardHTMLElement,
MenuToggleCallback,
ScrollCallback,
} from './card-element-manager';
import { ConditionsManager, ConditionsManagerListener } from './conditions-manager';
import { ConfigManager } from './config-manager';
import { DownloadManager } from './download-manager';
import { ExpandManager } from './expand-manager';
import { FullscreenManager } from './fullscreen-manager';
import { HASSManager } from './hass-manager';
import { InitializationManager } from './initialization-manager';
import { InteractionManager } from './interaction-manager';
import { MediaLoadedInfoManager } from './media-info-manager';
import { MediaPlayerManager } from './media-player-manager';
import { MessageManager } from './message-manager';
import { MicrophoneManager } from './microphone-manager';
import { QueryStringManager } from './query-string-manager';
import { StyleManager } from './style-manager';
import { TriggersManager } from './triggers-manager';
import {
CardActionsManagerAPI,
CardAutomationsAPI,
CardAutoRefreshAPI,
CardCameraAPI,
CardCameraURLAPI,
CardConditionAPI,
CardConfigAPI,
CardDownloadAPI,
CardElementAPI,
CardExpandAPI,
CardFullscreenAPI,
CardHASSAPI,
CardInitializerAPI,
CardInteractionAPI,
CardMediaLoadedAPI,
CardMediaPlayerAPI,
CardMessageAPI,
CardMicrophoneAPI,
CardQueryStringAPI,
CardStyleAPI,
CardTriggersAPI,
CardViewAPI,
} from './types';
import { ViewManager } from './view-manager';
export class CardController
implements
CardActionsManagerAPI,
CardAutomationsAPI,
CardAutoRefreshAPI,
CardCameraAPI,
CardCameraURLAPI,
CardConditionAPI,
CardConfigAPI,
CardDownloadAPI,
CardElementAPI,
CardExpandAPI,
CardFullscreenAPI,
CardHASSAPI,
CardInitializerAPI,
CardInteractionAPI,
CardMediaLoadedAPI,
CardMediaPlayerAPI,
CardMessageAPI,
CardMicrophoneAPI,
CardQueryStringAPI,
CardStyleAPI,
CardTriggersAPI,
CardViewAPI,
ReactiveController
{
// These properties may be used in the construction of 'managers' (and should
// be created first).
protected _entityRegistryManager = new EntityRegistryManager(new EntityCache());
protected _resolvedMediaCache = new ResolvedMediaCache();
protected _actionsManager = new ActionsManager(this);
protected _automationsManager = new AutomationsManager(this);
protected _autoUpdateManager = new AutoUpdateManager(this);
protected _cameraManager: CameraManager = new CameraManager(this);
protected _cameraURLManager = new CameraURLManager(this);
protected _cardElementManager: CardElementManager;
protected _conditionsManager: ConditionsManager;
protected _configManager = new ConfigManager(this);
protected _downloadManager: DownloadManager = new DownloadManager(this);
protected _expandManager = new ExpandManager(this);
protected _fullscreenManager = new FullscreenManager(this);
protected _hassManager = new HASSManager(this);
protected _initializationManager = new InitializationManager(this);
protected _interactionManager = new InteractionManager(this);
protected _mediaLoadedInfoManager = new MediaLoadedInfoManager(this);
protected _mediaPlayerManager = new MediaPlayerManager(this);
protected _messageManager = new MessageManager(this);
protected _microphoneManager = new MicrophoneManager(this);
protected _queryStringManager = new QueryStringManager(this);
protected _styleManager = new StyleManager(this);
protected _triggersManager: TriggersManager = new TriggersManager(this);
protected _viewManager = new ViewManager(this);
constructor(
host: CardHTMLElement,
scrollCallback: ScrollCallback,
menuToggleCallback: MenuToggleCallback,
conditionListener: ConditionsManagerListener,
) {
host.addController(this);
this._conditionsManager = new ConditionsManager(this, conditionListener);
this._cardElementManager = new CardElementManager(
this,
host,
scrollCallback,
menuToggleCallback,
);
}
// *************************************************************************
// Accessors
// *************************************************************************
public getActionsManager(): ActionsManager {
return this._actionsManager;
}
public getAutomationsManager(): AutomationsManager {
return this._automationsManager;
}
public getAutoUpdateManager(): AutoUpdateManager {
return this._autoUpdateManager;
}
public getCameraManager(): CameraManager {
return this._cameraManager;
}
public getCameraURLManager(): CameraURLManager {
return this._cameraURLManager;
}
public getCardElementManager(): CardElementManager {
return this._cardElementManager;
}
public getConditionsManager(): ConditionsManager {
return this._conditionsManager;
}
public static async getConfigElement(): Promise<LovelaceCardEditor> {
await import('../../editor.js');
return document.createElement('frigate-card-editor');
}
public getConfigManager(): ConfigManager {
return this._configManager;
}
public getDownloadManager(): DownloadManager {
return this._downloadManager;
}
public getEntityRegistryManager(): EntityRegistryManager {
return this._entityRegistryManager;
}
public getExpandManager(): ExpandManager {
return this._expandManager;
}
public getFullscreenManager(): FullscreenManager {
return this._fullscreenManager;
}
public getHASSManager(): HASSManager {
return this._hassManager;
}
public getInitializationManager(): InitializationManager {
return this._initializationManager;
}
public getInteractionManager(): InteractionManager {
return this._interactionManager;
}
public getMediaLoadedInfoManager(): MediaLoadedInfoManager {
return this._mediaLoadedInfoManager;
}
public getMediaPlayerManager(): MediaPlayerManager {
return this._mediaPlayerManager;
}
public getMessageManager(): MessageManager {
return this._messageManager;
}
public getMicrophoneManager(): MicrophoneManager {
return this._microphoneManager;
}
public getQueryStringManager(): QueryStringManager {
return this._queryStringManager;
}
public getResolvedMediaCache(): ResolvedMediaCache {
return this._resolvedMediaCache;
}
public static getStubConfig(entities: string[]): FrigateCardConfig {
const cameraEntity = entities.find((element) => element.startsWith('camera.'));
return {
cameras: [
{
camera_entity: cameraEntity ?? 'camera.demo'
},
],
// Need to use 'as unknown' to convince Typescript that this really isn't a
// mistake, despite the miniscule size of the configuration vs the full type
// description.
} as unknown as FrigateCardConfig;
}
public getStyleManager(): StyleManager {
return this._styleManager;
}
public getTriggersManager(): TriggersManager {
return this._triggersManager;
}
public getViewManager(): ViewManager {
return this._viewManager;
}
// *************************************************************************
// Handlers
// *************************************************************************
public hostConnected(): void {
this.getCardElementManager().elementConnected();
}
public hostDisconnected(): void {
this.getCardElementManager().elementDisconnected();
}
}
src/utils/card-controller/download-manager.ts
+41
View File
@@ -0,0 +1,41 @@
import { downloadMedia, downloadURL } from '../download';
import { generateScreenshotTitle } from '../screenshot';
import { CardDownloadAPI } from './types';
export class DownloadManager {
protected _api: CardDownloadAPI;
constructor(api: CardDownloadAPI) {
this._api = api;
}
public async downloadViewerMedia(): Promise<boolean> {
const media = this._api
.getViewManager()
.getView()
?.queryResults?.getSelectedResult();
const hass = this._api.getHASSManager().getHASS();
if (!media || !hass) {
return false;
}
try {
await downloadMedia(hass, this._api.getCameraManager(), media);
} catch (error: unknown) {
this._api.getMessageManager().setErrorIfHigherPriority(error);
return false;
}
return true;
}
public async downloadScreenshot(): Promise<void> {
const url = await this._api
.getMediaLoadedInfoManager()
.get()
?.player?.getScreenshotURL();
if (url) {
downloadURL(url, generateScreenshotTitle(this._api.getViewManager().getView()));
}
}
}
src/utils/card-controller/expand-manager.ts
+31
View File
@@ -0,0 +1,31 @@
import { CardExpandAPI } from './types';
export class ExpandManager {
protected _expanded = false;
protected _api: CardExpandAPI;
constructor(api: CardExpandAPI) {
this._api = api;
}
public isExpanded(): boolean {
return this._expanded;
}
public toggleExpanded(): void {
this.setExpanded(!this._expanded);
}
public setExpanded(expanded: boolean): void {
if (expanded && this._api.getFullscreenManager().isInFullscreen()) {
// Fullscreen and expanded mode are mutually exclusive.
this._api.getFullscreenManager().stopFullscreen();
}
this._expanded = expanded;
this._api.getConditionsManager()?.setState({
expand: expanded,
});
this._api.getCardElementManager().update();
}
}
src/utils/card-controller/fullscreen-manager.ts
+47
View File
@@ -0,0 +1,47 @@
import screenfull from 'screenfull';
import { CardFullscreenAPI } from './types';
export class FullscreenManager {
protected _api: CardFullscreenAPI;
constructor(api: CardFullscreenAPI) {
this._api = api;
}
public connect(): void {
if (screenfull.isEnabled) {
screenfull.on('change', this._fullscreenHandler);
}
}
public disconnect(): void {
if (screenfull.isEnabled) {
screenfull.off('change', this._fullscreenHandler);
}
}
public isInFullscreen(): boolean {
return screenfull.isEnabled && screenfull.isFullscreen;
}
public toggleFullscreen(): void {
screenfull.toggle(this._api.getCardElementManager().getElement());
}
public stopFullscreen(): void {
screenfull.exit();
}
protected _fullscreenHandler = (): void => {
this._api.getExpandManager().setExpanded(false);
this._api.getConditionsManager()?.setState({
fullscreen: this.isInFullscreen(),
});
// Re-render after a change to fullscreen mode to take advantage of
// the expanded screen real-estate (vs staying in aspect-ratio locked
// modes).
this._api.getCardElementManager().update();
};
}
src/utils/card-controller/hass-manager.ts
+88
View File
@@ -0,0 +1,88 @@
import { localize } from '../../localize/localize';
import { CameraConfig, ExtendedHomeAssistant } from '../../types';
import { hasHAConnectionStateChanged, isHassDifferent } from '../ha';
import { CardHASSAPI } from './types';
export class HASSManager {
protected _hass: ExtendedHomeAssistant | null = null;
protected _api: CardHASSAPI;
constructor(api: CardHASSAPI) {
this._api = api;
}
public getHASS(): ExtendedHomeAssistant | null {
return this._hass;
}
public setHASS(hass: ExtendedHomeAssistant): void {
const getSelectedCameraConfig = (): CameraConfig | null => {
const view = this._api.getViewManager().getView();
const cameraManager = this._api.getCameraManager();
return view && cameraManager
? cameraManager?.getStore().getCameraConfig(view.camera) ?? null
: null;
};
const oldHass = this._hass;
this._hass = hass;
const selectedCamera = getSelectedCameraConfig();
if (hasHAConnectionStateChanged(oldHass, hass)) {
if (!this._hass?.connected) {
this._api.getMessageManager().setMessageIfHigherPriority({
message: localize('error.reconnecting'),
icon: 'mdi:lan-disconnect',
type: 'connection',
dotdotdot: true,
});
} else {
this._api.getViewManager().setViewDefault();
}
} else if (
// Home Assistant pumps a lot of updates through. Re-rendering the card is
// necessary at times (e.g. to update the 'clip' view as new clips
// arrive), but also is a jarring experience for the user (e.g. if they
// are browsing the mini-gallery). Do not allow re-rendering from a Home
// Assistant update if there's been recent interaction (e.g. clicks on the
// card) or if there is media active playing.
this._isAutomatedViewUpdateAllowed() &&
isHassDifferent(this._hass, oldHass, [
...(this._api.getConfigManager().getConfig()?.view.update_entities ?? []),
...(selectedCamera?.triggers.entities ?? []),
])
) {
// If entities being monitored have changed then reset the view to the
// default.
this._api.getViewManager().setViewDefault();
} else if (
isHassDifferent(this._hass, oldHass, [
...(this._api.getConfigManager().getConfig()?.view.render_entities ?? []),
// Refresh the card if media player state changes:
// https://github.com/dermotduffy/frigate-hass-card/issues/881
...this._api.getMediaPlayerManager().getMediaPlayers(),
])
) {
this._api.getCardElementManager().update();
}
this._api.getTriggersManager().updateTriggeredCameras(oldHass);
if (this._api.getConditionsManager().hasHAStateConditions()) {
this._api.getConditionsManager().setState({ state: this._hass.states });
}
// Dark mode may depend on HASS.
this._api.getStyleManager().setLightOrDarkMode();
}
protected _isAutomatedViewUpdateAllowed(): boolean {
return (
this._api.getConfigManager().getConfig()?.view.update_force ||
!this._api.getInteractionManager().hasInteraction()
);
}
}
src/utils/card-controller/initialization-manager.ts
+134
View File
@@ -0,0 +1,134 @@
import { loadLanguages } from '../../localize/localize';
import { sideLoadHomeAssistantElements } from '../ha';
import { Initializer } from '../initializer/initializer';
import { CardInitializerAPI } from './types';
export enum InitializationAspect {
LANGUAGES = 'languages',
SIDE_LOAD_ELEMENTS = 'side-load-elements',
MEDIA_PLAYERS = 'media-players',
CAMERAS = 'cameras',
MICROPHONE_CONNECT = 'microphone-connect',
}
export class InitializationManager {
protected _api: CardInitializerAPI;
protected _initializer;
constructor(api: CardInitializerAPI, initializer?: Initializer) {
this._api = api;
this._initializer = initializer ?? new Initializer();
}
public isInitializedMandatory(): boolean {
return this._initializer.isInitializedMultiple([
InitializationAspect.LANGUAGES,
InitializationAspect.SIDE_LOAD_ELEMENTS,
InitializationAspect.CAMERAS,
]);
}
/**
* Initialize the hard requirements for rendering anything.
* @returns `true` if card rendering can continue.
*/
public async initializeMandatory(): Promise<boolean> {
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return false;
}
if (
!(await this._initializer.initializeMultipleIfNecessary({
// Caution: Ensure nothing in this set of initializers requires
// config or languages since they will not yet have been initialized.
[InitializationAspect.LANGUAGES]: async () => await loadLanguages(hass),
[InitializationAspect.SIDE_LOAD_ELEMENTS]: async () =>
await sideLoadHomeAssistantElements(),
}))
) {
return false;
}
if (!this._api.getConfigManager().hasConfig()) {
return false;
}
if (
!(await this._initializer.initializeIfNecessary(
InitializationAspect.CAMERAS,
async () => await this._api.getCameraManager().initializeCamerasFromConfig(),
))
) {
return false;
}
if (!this._api.getMessageManager().hasMessage()) {
// Set a view on initial load. However, if the query string contains a
// view related action, we don't set any view here and allow that content
// to be triggered by the firstUpdated() call that runs query string
// actions. To do otherwise may cause a race condition between the default
// view and the querystring view, see:
// https://github.com/dermotduffy/frigate-hass-card/issues/1200
const hasViewRelatedActions = this._api
.getQueryStringManager()
.hasViewRelatedActions();
if (hasViewRelatedActions) {
this._api.getQueryStringManager().executeViewRelated();
} else {
this._api.getViewManager().setViewDefault();
}
}
this._api.getCardElementManager().update();
return true;
}
/**
* Initialize aspects of the card that can load in the 'background'.
* @returns `true` if card rendering can continue.
*/
public async initializeBackgroundIfNecessary(): Promise<boolean> {
const hass = this._api.getHASSManager().getHASS();
const config = this._api.getConfigManager().getConfig();
if (!hass || !config) {
return false;
}
if (
this._initializer.isInitializedMultiple([
...(config.menu.buttons.media_player.enabled
? [InitializationAspect.MEDIA_PLAYERS]
: []),
...(config.live.microphone.always_connected
? [InitializationAspect.MICROPHONE_CONNECT]
: []),
])
) {
return true;
}
if (
!(await this._initializer.initializeMultipleIfNecessary({
...(config.menu.buttons.media_player.enabled && {
[InitializationAspect.MEDIA_PLAYERS]: async () =>
await this._api.getMediaPlayerManager().initialize(),
}),
...(config.live.microphone.always_connected && {
[InitializationAspect.MICROPHONE_CONNECT]: async () =>
await this._api.getMicrophoneManager().connect(),
}),
}))
) {
return false;
}
this._api.getCardElementManager().update();
return true;
}
public uninitialize(aspect: InitializationAspect) {
return this._initializer.uninitialize(aspect);
}
}
src/utils/card-controller/interaction-manager.ts
+50
View File
@@ -0,0 +1,50 @@
import throttle from 'lodash-es/throttle';
import { Timer } from '../timer';
import { CardInteractionAPI } from './types';
export class InteractionManager {
protected _timer = new Timer();
protected _api: CardInteractionAPI;
constructor(api: CardInteractionAPI) {
this._api = api;
}
// The mouse handler may be called continually, throttle it to at most once
// per second for performance reasons.
public reportInteraction = throttle(() => {
this._reportInteraction();
}, 1 * 1000);
public hasInteraction(): boolean {
return this._timer.isRunning();
}
/**
* Start the user interaction ('screensaver') timer to reset the view to
* default `view.timeout_seconds` after user interaction.
*/
protected _reportInteraction(): void {
this._timer.stop();
// Interactions reset the trigger state.
this._api.getTriggersManager().untrigger();
const timeoutSeconds = this._api.getConfigManager().getConfig()
?.view.timeout_seconds;
if (timeoutSeconds) {
this._timer.start(timeoutSeconds, () => {
if (this._isAutomatedUpdateAllowed()) {
this._api.getViewManager().setViewDefault();
this._api.getStyleManager().setLightOrDarkMode();
}
});
}
this._api.getStyleManager().setLightOrDarkMode();
}
protected _isAutomatedUpdateAllowed(): boolean {
return !this._api.getTriggersManager().isTriggered();
}
}
src/utils/card-controller/media-info-manager.ts
+52
View File
@@ -0,0 +1,52 @@
import { MediaLoadedInfo } from '../../types';
import { log } from '../debug';
import { isValidMediaLoadedInfo } from '../media-info';
import { CardMediaLoadedAPI } from './types';
export class MediaLoadedInfoManager {
protected _api: CardMediaLoadedAPI;
protected _current: MediaLoadedInfo | null = null;
protected _lastKnown: MediaLoadedInfo | null = null;
constructor(api: CardMediaLoadedAPI) {
this._api = api;
}
public set(mediaInfo: MediaLoadedInfo): void {
if (!isValidMediaLoadedInfo(mediaInfo)) {
return;
}
log(
this._api.getConfigManager().getCardWideConfig(),
`Frigate Card media load: `,
mediaInfo,
);
this._current = mediaInfo;
this._lastKnown = mediaInfo;
this._api.getConditionsManager().setState({ media_loaded: true });
// Fresh media information may change how the card is rendered.
this._api.getStyleManager().setExpandedMode();
this._api.getCardElementManager().update();
}
public get(): MediaLoadedInfo | null {
return this._current;
}
public getLastKnown(): MediaLoadedInfo | null {
return this._lastKnown;
}
public clear(): void {
this._current = null;
this._api.getConditionsManager().setState({ media_loaded: false });
}
public has(): boolean {
return !!this._current;
}
}
src/utils/card-controller/media-player-manager.ts
+125
View File
@@ -0,0 +1,125 @@
import { MEDIA_PLAYER_SUPPORT_BROWSE_MEDIA } from '../../const';
import { ViewMedia } from '../../view/media';
import { ViewMediaClassifier } from '../../view/media-classifier';
import { errorToConsole } from '../basic';
import { Entity } from '../ha/entity-registry/types';
import { supportsFeature } from '../ha/update';
import { CardMediaPlayerAPI } from './types';
export class MediaPlayerManager {
protected _mediaPlayers: string[] = [];
protected _api: CardMediaPlayerAPI;
constructor(api: CardMediaPlayerAPI) {
this._api = api;
}
public getMediaPlayers(): string[] {
return this._mediaPlayers;
}
public hasMediaPlayers(): boolean {
return this._mediaPlayers.length > 0;
}
public async initialize(): Promise<void> {
const hass = this._api.getHASSManager().getHASS();
if (!hass) {
return;
}
const isValidMediaPlayer = (entityID: string): boolean => {
if (entityID.startsWith('media_player.')) {
const stateObj = hass.states[entityID];
if (
stateObj &&
stateObj.state !== 'unavailable' &&
supportsFeature(stateObj, MEDIA_PLAYER_SUPPORT_BROWSE_MEDIA)
) {
return true;
}
}
return false;
};
const mediaPlayers = Object.keys(hass.states).filter(isValidMediaPlayer);
let mediaPlayerEntities: Map<string, Entity> | null = null;
try {
mediaPlayerEntities = await this._api
.getEntityRegistryManager()
.getEntities(hass, mediaPlayers);
} catch (e) {
// Failing to fetch media player information is not considered
// sufficiently serious to block card startup -- it is just logged and we
// move on.
errorToConsole(e as Error);
}
// Filter out entities that are marked as hidden (this information is not
// available in the HA state, only in the registry).
this._mediaPlayers = mediaPlayers.filter((entityID) => {
// Specifically allow for media players that are not found in the entity registry:
// See: https://github.com/dermotduffy/frigate-hass-card/issues/1016
const entity = mediaPlayerEntities?.get(entityID);
return !entity || !entity.hidden_by;
});
}
public async stop(mediaPlayer: string): Promise<void> {
await this._api
.getHASSManager()
.getHASS()
?.callService('media_player', 'media_stop', {
entity_id: mediaPlayer,
});
}
public async playLive(mediaPlayer: string, cameraID: string): Promise<void> {
const hass = this._api.getHASSManager().getHASS();
const cameraConfig = this._api
.getCameraManager()
.getStore()
.getCameraConfig(cameraID);
const cameraEntity = cameraConfig?.camera_entity ?? null;
if (!hass || !cameraEntity) {
return;
}
const title =
this._api.getCameraManager().getCameraMetadata(cameraID)?.title ?? null;
const thumbnail = hass.states[cameraEntity]?.attributes?.entity_picture ?? null;
await hass.callService('media_player', 'play_media', {
entity_id: mediaPlayer,
media_content_id: `media-source://camera/${cameraEntity}`,
media_content_type: 'application/vnd.apple.mpegurl',
extra: {
...(title && { title: title }),
...(thumbnail && { thumb: thumbnail }),
},
});
}
public async playMedia(mediaPlayer: string, media?: ViewMedia | null): Promise<void> {
const hass = this._api.getHASSManager().getHASS();
if (!hass || !media) {
return;
}
const title = media.getTitle();
const thumbnail = media.getThumbnail();
await hass.callService('media_player', 'play_media', {
entity_id: mediaPlayer,
media_content_id: media.getContentID(),
media_content_type: ViewMediaClassifier.isVideo(media) ? 'video' : 'image',
extra: {
...(title && { title: title }),
...(thumbnail && { thumb: thumbnail }),
},
});
}
}
src/utils/card-controller/message-manager.ts
+67
View File
@@ -0,0 +1,67 @@
import { FrigateCardError, MESSAGE_TYPE_PRIORITIES, Message } from '../../types';
import { errorToConsole } from '../basic';
import { CardMessageAPI } from './types';
export class MessageManager {
protected _message: Message | null = null;
protected _api: CardMessageAPI;
constructor(api: CardMessageAPI) {
this._api = api;
}
public getMessage(): Message | null {
return this._message;
}
public hasMessage(): boolean {
return !!this._message;
}
public hasErrorMessage(): boolean {
return this._message?.type === 'error';
}
public reset(): void {
const hadMessage = this.hasMessage();
this._message = null;
if (hadMessage) {
this._api.getCardElementManager().update();
}
}
public setErrorIfHigherPriority(error: unknown): void {
// This object should accept unknown objects to be able to seamlessly
// process arguments to catch() which can only be unknown/any.
if (!(error instanceof Error)) {
return;
}
errorToConsole(error);
this.setMessageIfHigherPriority({
message: error.message,
type: 'error',
...(error instanceof FrigateCardError && { context: error.context }),
});
}
public setMessageIfHigherPriority(message: Message): boolean {
const currentPriority = this._message
? MESSAGE_TYPE_PRIORITIES[this._message.type]
: 0;
const newPriority = MESSAGE_TYPE_PRIORITIES[message.type];
if (this._message && newPriority < currentPriority) {
return false;
}
this._message = message;
// When a message is displayed it effectively unloads the media.
this._api.getMediaLoadedInfoManager().clear();
this._api.getCardElementManager().scrollReset();
this._api.getCardElementManager().update();
return true;
}
}
src/utils/microphone.ts → src/utils/card-controller/microphone-manager.ts
+38 -10
View File
@@ -1,7 +1,9 @@
import { errorToConsole } from './basic';
import { Timer } from './timer';
import { errorToConsole } from '../basic';
import { Timer } from '../timer';
import { CardMicrophoneAPI } from './types';
export class MicrophoneController {
export class MicrophoneManager {
protected _api: CardMicrophoneAPI;
protected _stream?: MediaStream | null;
protected _timer = new Timer();
@@ -10,10 +12,8 @@ export class MicrophoneController {
// have the right mute status.
protected _mute = true;
protected _disconnectSeconds: number;
constructor(disconnectSeconds?: number) {
this._disconnectSeconds = disconnectSeconds ?? 0;
constructor(api: CardMicrophoneAPI) {
this._api = api;
}
public async connect(): Promise<void> {
@@ -32,6 +32,8 @@ export class MicrophoneController {
public async disconnect(): Promise<void> {
this._stream?.getTracks().forEach((track) => track.stop());
this._stream = undefined;
this._api.getCardElementManager().update();
}
public getStream(): MediaStream | undefined {
@@ -43,6 +45,8 @@ export class MicrophoneController {
track.enabled = !this._mute;
});
this._startTimer();
this._api.getCardElementManager().update();
}
public mute(): void {
@@ -50,9 +54,24 @@ export class MicrophoneController {
this._setMute();
}
public unmute(): void {
public async unmute(): Promise<void> {
const unmute = (): void => {
this._mute = false;
this._setMute();
};
if (!this.isConnected() && !this.isForbidden()) {
// The connect() call is async and make take an arbitrary amount of
// time for the user to grant access to their microphone. With a
// momentary microphone button the mute call (on mouse release) may
// arrive before the connection is even granted, so we unmute first
// before the connection is made, so the mute call on release will not
// be 'overwritten' incorrectly.
unmute();
await this.connect();
} else if (this.isConnected()) {
unmute();
}
}
public isConnected(): boolean {
@@ -70,8 +89,17 @@ export class MicrophoneController {
}
protected _startTimer(): void {
if (this._disconnectSeconds) {
this._timer.start(this._disconnectSeconds, () => {
const microphoneConfig = this._api.getConfigManager().getConfig()
?.live.microphone;
if (microphoneConfig?.always_connected) {
return;
}
const disconnectSeconds = microphoneConfig?.disconnect_seconds ?? 0;
if (disconnectSeconds) {
this._timer.start(disconnectSeconds, () => {
this.disconnect();
});
}
src/utils/card-controller/query-string-manager.ts
+160
View File
@@ -0,0 +1,160 @@
import { FrigateCardCustomAction, FrigateCardViewAction } from '../../types';
import { createFrigateCardCustomAction } from '../action.js';
import { CardQueryStringAPI } from './types';
import { ViewManagerSetViewParameters } from './view-manager';
interface QueryStringViewIntent {
view?: ViewManagerSetViewParameters & {
default?: boolean;
};
other?: FrigateCardCustomAction[];
}
export class QueryStringManager {
protected _api: CardQueryStringAPI;
constructor(api: CardQueryStringAPI) {
this._api = api;
}
public hasViewRelatedActions(): boolean {
return !!this._calculateIntent().view;
}
public executeNonViewRelated(): void {
this._executeNonViewRelated(this._calculateIntent());
}
public executeViewRelated(): void {
this._executeViewRelated(this._calculateIntent());
}
public executeAll(): void {
const intent = this._calculateIntent();
this._executeViewRelated(intent);
this._executeNonViewRelated(intent);
}
protected _executeViewRelated(intent: QueryStringViewIntent): void {
if (intent.view) {
if (intent.view.default) {
this._api.getViewManager().setViewDefault({
...(intent.view.cameraID && { cameraID: intent.view.cameraID }),
...(intent.view.substream && { substream: intent.view.substream }),
});
} else {
this._api.getViewManager().setViewByParameters({
...(intent.view.viewName && { viewName: intent.view.viewName }),
...(intent.view.cameraID && { cameraID: intent.view.cameraID }),
...(intent.view.substream && { substream: intent.view.substream }),
});
}
}
}
protected _executeNonViewRelated(intent: QueryStringViewIntent): void {
// Only execute non-view actions when the card has rendered at least once.
if (!this._api.getCardElementManager().hasUpdated()) {
return;
}
intent.other?.forEach((action) =>
this._api.getActionsManager().executeAction(action),
);
}
protected _calculateIntent(): QueryStringViewIntent {
const result: QueryStringViewIntent = {};
for (const action of this._getActions()) {
if (this._isViewAction(action)) {
(result.view ??= {}).viewName = action.frigate_card_action;
(result.view ??= {}).default = undefined;
} else if (action.frigate_card_action === 'default') {
(result.view ??= {}).default = true;
(result.view ??= {}).viewName = undefined;
} else if (action.frigate_card_action === 'camera_select') {
(result.view ??= {}).cameraID = action.camera;
} else if (action.frigate_card_action === 'live_substream_select') {
(result.view ??= {}).substream = action.camera;
} else {
(result.other ??= []).push(action);
}
}
return result;
}
protected _getActions(): FrigateCardCustomAction[] {
const params = new URLSearchParams(window.location.search);
const actions: FrigateCardCustomAction[] = [];
const actionRE = new RegExp(
/^frigate-card-action([.:](?<cardID>\w+))?[.:](?<action>\w+)/,
);
for (const [key, value] of params.entries()) {
const match = key.match(actionRE);
if (!match || !match.groups) {
continue;
}
const cardID: string | undefined = match.groups['cardID'];
const action = match.groups['action'];
let customAction: FrigateCardCustomAction | null = null;
switch (action) {
case 'camera_select':
case 'live_substream_select':
if (value) {
customAction = createFrigateCardCustomAction(action, {
camera: value,
cardID: cardID,
});
}
break;
case 'camera_ui':
case 'clip':
case 'clips':
case 'default':
case 'diagnostics':
case 'download':
case 'expand':
case 'image':
case 'live':
case 'menu_toggle':
case 'recording':
case 'recordings':
case 'snapshot':
case 'snapshots':
case 'timeline':
customAction = createFrigateCardCustomAction(action, {
cardID: cardID,
});
break;
default:
console.warn(
`Frigate card received unknown card action in query string: ${action}`,
);
}
if (customAction) {
actions.push(customAction);
}
}
return actions;
}
protected _isViewAction = (
action: FrigateCardCustomAction,
): action is FrigateCardViewAction => {
switch (action.frigate_card_action) {
case 'clip':
case 'clips':
case 'diagnostics':
case 'image':
case 'live':
case 'recording':
case 'recordings':
case 'snapshot':
case 'snapshots':
case 'timeline':
return true;
}
return false;
};
}
src/utils/card-controller/style-manager.ts
+121
View File
@@ -0,0 +1,121 @@
import { setPerformanceCSSStyles } from '../../performance';
import { FrigateCardConfig } from '../../types';
import { View } from '../../view/view';
import { setOrRemoveAttribute } from '../basic';
import { CardStyleAPI } from './types';
export class StyleManager {
protected _api: CardStyleAPI;
constructor(api: CardStyleAPI) {
this._api = api;
}
public setLightOrDarkMode(): void {
const config = this._api.getConfigManager().getConfig();
const isDarkMode =
config?.view.dark_mode === 'on' ||
(config?.view.dark_mode === 'auto' &&
(!this._api.getInteractionManager().hasInteraction() ||
!!this._api.getHASSManager().getHASS()?.themes.darkMode));
setOrRemoveAttribute(
this._api.getCardElementManager().getElement(),
isDarkMode,
'dark',
);
}
public setExpandedMode(): void {
const card = this._api.getCardElementManager().getElement();
const view = this._api.getViewManager().getView();
// When a new media loads, set the aspect ratio for when the card is
// expanded/popped-up. This is based exclusively on last media content,
// as dimension configuration does not apply in fullscreen or expanded mode.
const lastKnown = this._api.getMediaLoadedInfoManager().getLastKnown();
card.style.setProperty(
'--frigate-card-expand-aspect-ratio',
view?.isAnyMediaView() && lastKnown
? `${lastKnown.width} / ${lastKnown.height}`
: 'unset',
);
// Non-media may have no intrinsic dimensions (or multiple media items in a
// grid) and so we need to explicit request the dialog to use all available
// space.
const isGrid = view?.isGrid();
card.style.setProperty(
'--frigate-card-expand-width',
!isGrid && view?.isAnyMediaView()
? 'none'
: 'var(--frigate-card-expand-max-width)',
);
card.style.setProperty(
'--frigate-card-expand-height',
!isGrid && view?.isAnyMediaView()
? 'none'
: 'var(--frigate-card-expand-max-height)',
);
}
public setMinMaxHeight(): void {
const config = this._api.getConfigManager().getConfig();
if (config) {
const card = this._api.getCardElementManager().getElement();
card.style.setProperty('--frigate-card-min-height', config.dimensions.min_height);
card.style.setProperty('--frigate-card-max-height', config.dimensions.max_height);
}
}
public setPerformance(): void {
setPerformanceCSSStyles(
this._api.getCardElementManager().getElement(),
this._api.getConfigManager().getCardWideConfig()?.performance,
);
}
protected _isAspectRatioEnforced(config: FrigateCardConfig, view: View): boolean {
const aspectRatioMode = config.dimensions.aspect_ratio_mode;
// Do not artifically constrain aspect ratio if:
// - It's fullscreen.
// - It's in expanded mode.
// - Aspect ratio enforcement is disabled.
// - Aspect ratio enforcement is dynamic and it's a media view (i.e. not the
// gallery) or diagnostics / timeline.
return !(
this._api.getFullscreenManager().isInFullscreen() ||
this._api.getExpandManager().isExpanded() ||
aspectRatioMode === 'unconstrained' ||
(aspectRatioMode === 'dynamic' &&
(view.isAnyMediaView() || view.is('timeline'))) ||
view.is('diagnostics')
);
}
/**
* Get the aspect ratio padding required to enforce the aspect ratio (if it is
* required).
* @returns A padding percentage.
*/
public getAspectRatioStyle(): string {
const config = this._api.getConfigManager().getConfig();
const view = this._api.getViewManager().getView();
if (config && view) {
if (!this._isAspectRatioEnforced(config, view)) {
return 'auto';
}
const aspectRatioMode = config.dimensions.aspect_ratio_mode;
const lastKnown = this._api.getMediaLoadedInfoManager().getLastKnown();
if (lastKnown && aspectRatioMode === 'dynamic') {
return `${lastKnown.width} / ${lastKnown.height}`;
}
return `${config.dimensions.aspect_ratio[0]} / ${config.dimensions.aspect_ratio[1]}`;
}
return '16 / 9';
}
}
src/utils/card-controller/triggers-manager.ts
+126
View File
@@ -0,0 +1,126 @@
import { HomeAssistant } from 'custom-card-helpers';
import orderBy from 'lodash-es/orderBy';
import { getHassDifferences, isTriggeredState } from '../ha';
import { Timer } from '../timer';
import { CardTriggersAPI } from './types';
export class TriggersManager {
protected _api: CardTriggersAPI;
protected _triggers: Map<string, Date> = new Map();
protected _untriggerTimer = new Timer();
constructor(api: CardTriggersAPI) {
this._api = api;
}
public isTriggered(): boolean {
return !!this._triggers.size || this._untriggerTimer.isRunning();
}
public updateTriggeredCameras(oldHass?: HomeAssistant | null): boolean {
if (!this._shouldTrackTriggers()) {
return false;
}
const hass = this._api.getHASSManager().getHASS();
const now = new Date();
let triggerChanges = false;
const cameras = this._api.getCameraManager().getStore().getVisibleCameras();
for (const [cameraID, config] of cameras?.entries()) {
const triggerEntities = config.triggers.entities;
const diffs = getHassDifferences(hass, oldHass, triggerEntities, {
stateOnly: true,
});
const shouldTrigger = diffs.some((diff) => isTriggeredState(diff.newState));
const shouldUntrigger = triggerEntities.every(
(entity) => !isTriggeredState(hass?.states[entity]),
);
if (shouldTrigger) {
this._triggers.set(cameraID, now);
triggerChanges = true;
} else if (shouldUntrigger && this._triggers.has(cameraID)) {
this._triggers.delete(cameraID);
triggerChanges = true;
}
}
if (triggerChanges) {
const targetCameraID = this._getMostRecentTrigger();
if (targetCameraID) {
this._triggerAction(targetCameraID);
return true;
} else {
this._startUntriggerTimer();
}
}
return false;
}
public untrigger(): void {
const wasTriggered = this.isTriggered();
this._triggers.clear();
this._untriggerTimer.stop();
if (wasTriggered) {
this._untriggerAction();
}
}
protected _triggerAction(cameraID: string): void {
const view = this._api.getViewManager().getView();
if (
this._isAutomatedViewUpdateAllowed() &&
(view?.camera !== cameraID || !view?.is('live'))
) {
this._api.getViewManager().setViewByParameters({
viewName: 'live',
cameraID: cameraID,
});
}
}
protected _untriggerAction(): void {
if (
!this.isTriggered() &&
this._isAutomatedViewUpdateAllowed() &&
this._api.getConfigManager().getConfig()?.view.scan.untrigger_reset
) {
this._api.getViewManager().setViewDefault();
}
}
protected _isAutomatedViewUpdateAllowed(): boolean {
return (
this._api.getConfigManager().getConfig()?.view.update_force ||
!this._api.getInteractionManager().hasInteraction()
);
}
protected _shouldTrackTriggers(): boolean {
return !!this._api.getConfigManager().getConfig()?.view.scan.enabled;
}
protected _startUntriggerTimer(): void {
this._untriggerTimer.start(
/* istanbul ignore next: the case of config being null here cannot be
reached, as there's no way to have the untrigger call happen without
a config. -- @preserve */
this._api.getConfigManager().getConfig()?.view.scan.untrigger_seconds ?? 0,
() => {
this._untriggerAction();
},
);
}
protected _getMostRecentTrigger(): string | null {
const sorted = orderBy(
[...this._triggers.entries()],
(entry) => entry[1].getTime(),
'desc',
);
return sorted.length ? sorted[0][0] : null;
}
}
src/utils/card-controller/types.ts
+214
View File
@@ -0,0 +1,214 @@
import { CameraManager } from '../../camera-manager/manager';
import { ConditionsManager } from './conditions-manager';
import { EntityRegistryManager } from '../ha/entity-registry';
import { ResolvedMediaCache } from '../ha/resolved-media';
import { ActionsManager } from './actions-manager';
import { AutoUpdateManager } from './auto-update-manager';
import { AutomationsManager } from './automations-manager';
import { CameraURLManager } from './camera-url-manager';
import { CardElementManager } from './card-element-manager';
import { ConfigManager } from './config-manager';
import { DownloadManager } from './download-manager';
import { ExpandManager } from './expand-manager';
import { FullscreenManager } from './fullscreen-manager';
import { HASSManager } from './hass-manager';
import { InitializationManager } from './initialization-manager';
import { InteractionManager } from './interaction-manager';
import { MediaLoadedInfoManager } from './media-info-manager';
import { MediaPlayerManager } from './media-player-manager';
import { MessageManager } from './message-manager';
import { MicrophoneManager } from './microphone-manager';
import { StyleManager } from './style-manager';
import { TriggersManager } from './triggers-manager';
import { ViewManager } from './view-manager';
import { QueryStringManager } from './query-string-manager';
/**
* This defines a series of limited APIs that various manager helpers use to
* control the card. Explicitly specifying them helps make coupling intentional
* and avoids cyclic importing.
*/
export interface CardActionsManagerAPI {
getCameraManager(): CameraManager;
getCameraURLManager(): CameraURLManager;
getCardElementManager(): CardElementManager;
getConfigManager(): ConfigManager;
getDownloadManager(): DownloadManager;
getExpandManager(): ExpandManager;
getFullscreenManager(): FullscreenManager;
getHASSManager(): HASSManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
getMediaPlayerManager(): MediaPlayerManager;
getMessageManager(): MessageManager;
getViewManager(): ViewManager;
getMicrophoneManager(): MicrophoneManager;
}
export interface CardAutomationsAPI {
getCardElementManager(): CardElementManager;
getConditionsManager(): ConditionsManager;
getConfigManager(): ConfigManager;
getHASSManager(): HASSManager;
getMessageManager(): MessageManager;
}
export interface CardAutoRefreshAPI {
getConfigManager(): ConfigManager;
getViewManager(): ViewManager;
getTriggersManager(): TriggersManager;
getInteractionManager(): InteractionManager;
}
export interface CardCameraAPI {
getConfigManager(): ConfigManager;
getEntityRegistryManager(): EntityRegistryManager;
getResolvedMediaCache(): ResolvedMediaCache;
getHASSManager(): HASSManager;
getMessageManager(): MessageManager;
}
export interface CardCameraURLAPI {
getCameraManager(): CameraManager;
getViewManager(): ViewManager;
}
export interface CardConditionAPI {
getAutomationsManager(): AutomationsManager;
getConfigManager(): ConfigManager;
}
export interface CardConfigAPI {
getAutomationsManager(): AutomationsManager;
getCardElementManager(): CardElementManager;
getConditionsManager(): ConditionsManager;
getInitializationManager(): InitializationManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
getMessageManager(): MessageManager;
getStyleManager(): StyleManager;
getViewManager(): ViewManager;
}
export interface CardDownloadAPI {
getCameraManager(): CameraManager;
getHASSManager(): HASSManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
getMessageManager(): MessageManager;
getViewManager(): ViewManager;
}
export interface CardElementAPI {
getActionsManager(): ActionsManager;
getFullscreenManager(): FullscreenManager;
getInteractionManager(): InteractionManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
getQueryStringManager(): QueryStringManager;
}
export interface CardExpandAPI {
getFullscreenManager(): FullscreenManager;
getConditionsManager(): ConditionsManager;
getCardElementManager(): CardElementManager;
}
export interface CardFullscreenAPI {
getCardElementManager(): CardElementManager;
getExpandManager(): ExpandManager;
getConditionsManager(): ConditionsManager;
getMediaPlayerManager(): MediaPlayerManager;
}
export interface CardHASSAPI {
getCameraManager(): CameraManager;
getCardElementManager(): CardElementManager;
getConditionsManager(): ConditionsManager;
getConfigManager(): ConfigManager;
getInteractionManager(): InteractionManager;
getMediaPlayerManager(): MediaPlayerManager;
getMessageManager(): MessageManager;
getStyleManager(): StyleManager;
getTriggersManager(): TriggersManager;
getViewManager(): ViewManager;
}
export interface CardInitializerAPI {
getCameraManager(): CameraManager;
getCardElementManager(): CardElementManager;
getConfigManager(): ConfigManager;
getEntityRegistryManager(): EntityRegistryManager;
getHASSManager(): HASSManager;
getMediaPlayerManager(): MediaPlayerManager;
getMessageManager(): MessageManager;
getMicrophoneManager(): MicrophoneManager;
getQueryStringManager(): QueryStringManager;
getResolvedMediaCache(): ResolvedMediaCache;
getViewManager(): ViewManager;
}
export interface CardInteractionAPI {
getConfigManager(): ConfigManager;
getStyleManager(): StyleManager;
getTriggersManager(): TriggersManager;
getViewManager(): ViewManager;
}
export interface CardMediaLoadedAPI {
getConditionsManager(): ConditionsManager;
getConfigManager(): ConfigManager;
getCardElementManager(): CardElementManager;
getStyleManager(): StyleManager;
}
export interface CardMediaPlayerAPI {
getHASSManager(): HASSManager;
getCameraManager(): CameraManager;
getEntityRegistryManager(): EntityRegistryManager;
}
export interface CardMessageAPI {
getConditionsManager(): ConditionsManager;
getCardElementManager(): CardElementManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
}
export interface CardMicrophoneAPI {
getCardElementManager(): CardElementManager;
getConfigManager(): ConfigManager;
}
export interface CardQueryStringAPI {
getCardElementManager(): CardElementManager;
getViewManager(): ViewManager;
getActionsManager(): ActionsManager;
}
export interface CardStyleAPI {
getCardElementManager(): CardElementManager;
getConfigManager(): ConfigManager;
getExpandManager(): ExpandManager;
getFullscreenManager(): FullscreenManager;
getHASSManager(): HASSManager;
getInteractionManager(): InteractionManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
getViewManager(): ViewManager;
}
export interface CardTriggersAPI {
getCameraManager(): CameraManager;
getConfigManager(): ConfigManager;
getHASSManager(): HASSManager;
getInteractionManager(): InteractionManager;
getViewManager(): ViewManager;
}
export interface CardViewAPI {
getAutoUpdateManager(): AutoUpdateManager;
getCameraManager(): CameraManager;
getConfigManager(): ConfigManager;
getHASSManager(): HASSManager;
getMediaLoadedInfoManager(): MediaLoadedInfoManager;
getMessageManager(): MessageManager;
getStyleManager(): StyleManager;
getConditionsManager(): ConditionsManager;
getCardElementManager(): CardElementManager;
}
src/utils/card-controller/view-manager.ts
+283
View File
@@ -0,0 +1,283 @@
import { ViewContext } from 'view';
import { FrigateCardConfig, FrigateCardView, ViewDisplayMode } from '../../types';
import { View } from '../../view/view';
import { getAllDependentCameras } from '../camera';
import { log } from '../debug';
import { executeMediaQueryForView } from '../media-to-view';
import { CardViewAPI } from './types';
interface ViewManagerSetViewDefaultParameters {
cameraID?: string;
substream?: string;
}
export interface ViewManagerSetViewParameters
extends ViewManagerSetViewDefaultParameters {
viewName?: FrigateCardView;
}
export class ViewManager {
protected _view: View | null = null;
protected _api: CardViewAPI;
constructor(api: CardViewAPI) {
this._api = api;
}
public getView(): View | null {
return this._view;
}
public setView(view: View): void {
this._setView(view);
}
public setViewDefault(params?: ViewManagerSetViewDefaultParameters): void {
const config = this._api.getConfigManager().getConfig();
if (config) {
let forceCameraID: string | null = params?.cameraID ?? null;
if (!forceCameraID && this._view?.camera && config.view.update_cycle_camera) {
const cameraIDs = [
...this._api.getCameraManager().getStore().getVisibleCameraIDs(),
];
const currentIndex = cameraIDs.indexOf(this._view.camera);
const targetIndex = currentIndex + 1 >= cameraIDs.length ? 0 : currentIndex + 1;
forceCameraID = cameraIDs[targetIndex];
}
this.setViewByParameters({
...params,
viewName: config.view.default,
...(forceCameraID && { cameraID: forceCameraID }),
});
// Restart the refresh timer, so the default view is refreshed at a fixed
// interval from now (if so configured).
this._api.getAutoUpdateManager().startDefaultViewTimer();
}
}
public setViewByParameters(params: ViewManagerSetViewParameters): void {
const config = this._api.getConfigManager().getConfig();
if (config) {
let cameraID: string | null = null;
const cameras = this._api.getCameraManager().getStore().getVisibleCameraIDs();
if (cameras.size) {
if (params?.cameraID && cameras.has(params.cameraID)) {
cameraID = params.cameraID;
} else {
// Reset to the default camera.
cameraID = cameras.keys().next().value;
}
}
const viewName = params?.viewName ?? this._view?.view ?? config.view.default;
if (cameraID && viewName && this.isViewSupportedByCamera(cameraID, viewName)) {
const displayMode =
this._view?.displayMode ??
this._getDefaultDisplayModeForView(viewName, config);
let view: View = new View({
view: viewName,
camera: cameraID,
displayMode: displayMode,
});
if (params.substream) {
view = this._createViewWithSelectedSubstream(view, params.substream);
}
this._setView(view);
}
}
}
public setViewWithNewContext(context: ViewContext): void {
if (this._view) {
return this._setView(this._view?.clone().mergeInContext(context));
}
}
public reset(): void {
this._view = null;
}
public async setViewWithNewDisplayMode(displayMode: ViewDisplayMode): Promise<void> {
const host = this._api.getCardElementManager().getElement();
const hass = this._api.getHASSManager().getHASS();
if (this._view && hass) {
const view = this._view.evolve({
displayMode: displayMode,
});
const cameraCount = this._api
.getCameraManager()
.getStore()
.getVisibleCameraCount();
const queryCameraCount = view.query?.getQueryCameraIDs()?.size ?? 0;
const generateNewQuery =
view?.query &&
queryCameraCount &&
((view.isGrid() && queryCameraCount < cameraCount) ||
(!view.isGrid() && queryCameraCount > 1));
if (generateNewQuery && view && view.query) {
// If the user requests a grid but the current query does not have a
// query for more than one camera, reset the query results, change the
// existing query to refer to all cameras and execute it to fetch new
// results.
const viewWithNewQuery = await executeMediaQueryForView(
host,
this._api.getCameraManager(),
view,
view.query
.clone()
.setQueryCameraIDs(
view.isGrid()
? this._api.getCameraManager().getStore().getVisibleCameraIDs()
: view.camera,
),
);
if (viewWithNewQuery) {
return this._setView(viewWithNewQuery);
}
} else {
return this._setView(view);
}
}
}
public setViewWithSubstream(substream?: string): void {
if (!this._view) {
return;
}
this._setView(
substream
? this._createViewWithSelectedSubstream(this._view, substream)
: this._createViewWithNextStream(this._view),
);
}
public setViewWithoutSubstream(): void {
const view = this._createViewWithoutSubstream();
if (view) {
return this._setView(view);
}
}
public isViewSupportedByCamera(cameraID: string, view: FrigateCardView): boolean {
const capabilities = this._api.getCameraManager().getCameraCapabilities(cameraID);
switch (view) {
case 'live':
case 'image':
case 'diagnostics':
return true;
case 'clip':
case 'clips':
return !!capabilities?.supportsClips;
case 'snapshot':
case 'snapshots':
return !!capabilities?.supportsSnapshots;
case 'recording':
case 'recordings':
return !!capabilities?.supportsRecordings;
case 'timeline':
return !!capabilities?.supportsTimeline;
case 'media':
return (
!!capabilities?.supportsClips ||
!!capabilities?.supportsSnapshots ||
!!capabilities?.supportsRecordings
);
}
}
protected _getDefaultDisplayModeForView(
viewName: FrigateCardView,
config?: FrigateCardConfig,
): ViewDisplayMode {
let mode: ViewDisplayMode | null = null;
switch (viewName) {
case 'media':
case 'clip':
case 'recording':
case 'snapshot':
mode = config?.media_viewer.display?.mode ?? null;
break;
case 'live':
mode = config?.live.display?.mode ?? null;
break;
}
return mode ?? 'single';
}
protected _setView(view: View): void {
const oldView = this._view;
View.adoptFromViewIfAppropriate(view, oldView);
log(
this._api.getConfigManager().getCardWideConfig(),
`Frigate Card view change: `,
view.view,
);
this._view = view;
if (View.isMajorMediaChange(oldView, view)) {
this._api.getMediaLoadedInfoManager().clear();
}
if (oldView?.view !== view.view) {
this._api.getCardElementManager().scrollReset();
}
this._api.getMessageManager().reset();
this._api.getStyleManager().setExpandedMode();
this._api.getConditionsManager()?.setState({
view: view.view,
camera: view.camera,
displayMode: view.displayMode ?? undefined,
});
this._api.getCardElementManager().update();
}
protected _createViewWithSelectedSubstream(baseView: View, substreamID: string): View {
const overrides: Map<string, string> =
baseView?.context?.live?.overrides ?? new Map();
overrides.set(baseView.camera, substreamID);
return baseView.clone().mergeInContext({
live: { overrides: overrides },
});
}
protected _createViewWithNextStream(baseView: View): View {
const dependencies = [
...getAllDependentCameras(this._api.getCameraManager(), baseView.camera),
];
if (dependencies.length <= 1) {
return baseView.clone();
}
const view = baseView.clone();
const overrides: Map<string, string> = view.context?.live?.overrides ?? new Map();
const currentOverride = overrides.get(view.camera) ?? view.camera;
const currentIndex = dependencies.indexOf(currentOverride);
const newIndex = currentIndex < 0 ? 0 : (currentIndex + 1) % dependencies.length;
overrides.set(view.camera, dependencies[newIndex]);
view.mergeInContext({ live: { overrides: overrides } });
return view;
}
protected _createViewWithoutSubstream(): View | null {
if (!this._view) {
return null;
}
const view = this._view.clone();
const overrides: Map<string, string> | undefined = view.context?.live?.overrides;
if (overrides && overrides.has(view.camera)) {
view.context?.live?.overrides?.delete(view.camera);
}
return view;
}
}
src/utils/debug.ts
+1 -1
View File
@@ -1,6 +1,6 @@
import { CardWideConfig } from '../types';
export const log = (cardWideConfig?: CardWideConfig, ...args: unknown[]) => {
export const log = (cardWideConfig?: CardWideConfig | null, ...args: unknown[]) => {
if (cardWideConfig?.debug?.logging) {
console.debug(...args);
}
src/utils/diagnostics.ts
+70
View File
@@ -0,0 +1,70 @@
import { HomeAssistant } from 'custom-card-helpers';
import pkg from '../../package.json';
import { getLanguage } from '../localize/localize';
import { RawFrigateCardConfig } from '../types';
import { DeviceList, getAllDevices } from './ha/device-registry';
type FrigateVersions = Record<string, string>;
interface GitDiagnostics {
build_version?: string;
build_date?: string;
commit_date?: string;
}
export interface Diagnostics {
card_version: string;
browser: string;
date: Date;
lang: string;
timezone: string;
git: GitDiagnostics;
frigate_versions?: FrigateVersions;
ha_version?: string;
config?: RawFrigateCardConfig;
}
export const getDiagnostics = async (
hass?: HomeAssistant,
rawConfig?: RawFrigateCardConfig,
): Promise<Diagnostics> => {
let devices: DeviceList | undefined = [];
if (hass) {
try {
devices = await getAllDevices(hass);
} catch (e) {
// Pass. This is optional.
}
}
// Get the Frigate devices in order to extract the Frigate integration and
// server version numbers.
const frigateDevices = devices?.filter((device) => device.manufacturer === 'Frigate');
const frigateVersionMap: Map<string, string> = new Map();
frigateDevices?.forEach((device) => {
device.config_entries.forEach((configEntry) => {
if (device.model) {
frigateVersionMap.set(configEntry, device.model);
}
});
});
return {
card_version: pkg.version,
browser: navigator.userAgent,
date: new Date(),
...(frigateVersionMap.size && {
frigate_versions: Object.fromEntries(frigateVersionMap),
}),
lang: getLanguage(),
timezone: Intl.DateTimeFormat().resolvedOptions().timeZone,
git: {
...(pkg['gitVersion'] && { build_version: pkg['gitVersion'] }),
...(pkg['buildDate'] && { build_date: pkg['buildDate'] }),
...(pkg['gitDate'] && { commit_date: pkg['gitDate'] }),
},
...(hass && { ha_version: hass.config.version }),
...(rawConfig && { config: rawConfig }),
};
};
src/utils/download.ts
+1 -1
View File
@@ -39,7 +39,7 @@ export const downloadMedia = async (
cameraManager: CameraManager,
media: ViewMedia,
): Promise<void> => {
const download = await cameraManager.getMediaDownloadPath(hass, media);
const download = await cameraManager.getMediaDownloadPath(media);
if (!download) {
throw new FrigateCardError(localize('error.download_no_media'));
}
src/utils/ha/index.ts
+16
View File
@@ -364,3 +364,19 @@ export function canonicalizeHAURL(
}
return url ?? null;
}
/**
* Determine if HA connection state has changed.
* @param newHass The new HA object.
* @param oldHass The old HA object.
* @returns `true` if the connection state has changed.
*/
export const hasHAConnectionStateChanged = (
oldHass: HomeAssistant | undefined | null,
newHass: HomeAssistant | undefined | null,
): boolean => {
return (
(!oldHass && !newHass?.connected) ||
(!!oldHass && oldHass.connected !== !!newHass?.connected)
);
};
src/utils/initializer.ts → src/utils/initializer/initializer.ts
+5 -5
View File
@@ -1,16 +1,16 @@
import { allPromises } from './basic';
import { allPromises } from '../basic';
enum InitializationState {
INITIALIZING = 'initializing',
INITIALIZED = 'initialized',
}
type Initializer = () => Promise<unknown>;
type InitializationCallback = () => Promise<unknown>;
/**
* Manages initialization state & calling initializers.
*/
export class FrigateCardInitializer {
export class Initializer {
protected _state: Map<string, InitializationState>;
constructor() {
@@ -18,7 +18,7 @@ export class FrigateCardInitializer {
}
public async initializeMultipleIfNecessary(
aspects: Record<string, Initializer>,
aspects: Record<string, InitializationCallback>,
): Promise<boolean> {
const results = await allPromises(
Object.entries(aspects),
@@ -36,7 +36,7 @@ export class FrigateCardInitializer {
*/
public async initializeIfNecessary(
aspect: string,
initializer?: Initializer,
initializer?: InitializationCallback,
): Promise<boolean> {
const state = this._state.get(aspect);
if (state !== InitializationState.INITIALIZED) {
src/utils/media-info-controller.ts
-27
View File
@@ -1,27 +0,0 @@
import { MediaLoadedInfo } from '../types';
export class MediaLoadedInfoController {
protected _current: MediaLoadedInfo | null = null;
protected _lastKnown: MediaLoadedInfo | null = null;
public set(current: MediaLoadedInfo): void {
this._current = current;
this._lastKnown = current;
}
public get(): MediaLoadedInfo | null {
return this._current;
}
public getLastKnown(): MediaLoadedInfo | null {
return this._lastKnown;
}
public clear(): void {
this._current = null;
}
public has(): boolean {
return !!this._current;
}
}
src/utils/media-to-view.ts
+3 -7
View File
@@ -1,4 +1,3 @@
import { HomeAssistant } from 'custom-card-helpers';
import { ViewContext } from 'view';
import { CameraManager } from '../camera-manager/manager';
import { MediaQuery } from '../camera-manager/types';
@@ -20,7 +19,6 @@ type ResultSelectType = 'latest' | 'time' | 'none';
export const changeViewToRecentEventsForCameraAndDependents = async (
element: HTMLElement,
hass: HomeAssistant,
cameraManager: CameraManager,
cardWideConfig: CardWideConfig,
view: View,
@@ -46,7 +44,7 @@ export const changeViewToRecentEventsForCameraAndDependents = async (
}
(
await executeMediaQueryForView(element, hass, cameraManager, view, queries, {
await executeMediaQueryForView(element, cameraManager, view, queries, {
targetView: options?.targetView,
select: options?.select,
})
@@ -82,7 +80,6 @@ const createQueriesForEventsView = (
*/
export const changeViewToRecentRecordingForCameraAndDependents = async (
element: HTMLElement,
hass: HomeAssistant,
cameraManager: CameraManager,
cardWideConfig: CardWideConfig,
view: View,
@@ -109,7 +106,7 @@ export const changeViewToRecentRecordingForCameraAndDependents = async (
}
(
await executeMediaQueryForView(element, hass, cameraManager, view, queries, {
await executeMediaQueryForView(element, cameraManager, view, queries, {
targetView: options?.targetView,
select: options?.select,
})
@@ -131,7 +128,6 @@ const createQueriesForRecordingsView = (
export const executeMediaQueryForView = async (
element: HTMLElement,
hass: HomeAssistant,
cameraManager: CameraManager,
view: View,
query: MediaQueries,
@@ -150,7 +146,7 @@ export const executeMediaQueryForView = async (
}
try {
mediaArray = await cameraManager.executeMediaQueries<MediaQuery>(hass, queries);
mediaArray = await cameraManager.executeMediaQueries<MediaQuery>(queries);
} catch (e) {
errorToConsole(e as Error);
dispatchFrigateCardErrorEvent(element, e as Error);
src/utils/menu-controller.ts
+16 -13
View File
@@ -15,7 +15,8 @@ import { View } from '../view/view';
import { createFrigateCardCustomAction } from './action';
import { getAllDependentCameras } from './camera';
import { getEntityIcon, getEntityTitle } from './ha';
import { MicrophoneController } from './microphone';
import { MediaPlayerManager } from './card-controller/media-player-manager';
import { MicrophoneManager } from './card-controller/microphone-manager';
import { hasSubstream } from './substream';
export class MenuButtonController {
@@ -46,9 +47,9 @@ export class MenuButtonController {
expanded: boolean,
options?: {
currentMediaLoadedInfo?: MediaLoadedInfo | null;
mediaPlayers?: string[];
cameraURL?: string | null;
microphoneController?: MicrophoneController;
showCameraUIButton?: boolean,
microphoneManager?: MicrophoneManager | null;
mediaPlayerController?: MediaPlayerManager | null;
},
): MenuButton[] {
const visibleCameras = cameraManager.getStore().getVisibleCameras();
@@ -87,7 +88,7 @@ export class MenuButtonController {
const action = createFrigateCardCustomAction('camera_select', {
camera: cameraID,
});
const metadata = cameraManager.getCameraMetadata(hass, cameraID) ?? undefined;
const metadata = cameraManager.getCameraMetadata(cameraID) ?? undefined;
return {
enabled: true,
@@ -132,7 +133,7 @@ export class MenuButtonController {
const action = createFrigateCardCustomAction('live_substream_select', {
camera: cameraID,
});
const metadata = cameraManager.getCameraMetadata(hass, cameraID) ?? undefined;
const metadata = cameraManager.getCameraMetadata(cameraID) ?? undefined;
const cameraConfig = cameraManager.getStore().getCameraConfig(cameraID);
return {
enabled: true,
@@ -244,7 +245,7 @@ export class MenuButtonController {
});
}
if (options?.cameraURL) {
if (options?.showCameraUIButton) {
buttons.push({
icon: 'mdi:web',
...config.menu.buttons.camera_ui,
@@ -257,11 +258,11 @@ export class MenuButtonController {
}
if (
options?.microphoneController &&
options?.microphoneManager &&
options?.currentMediaLoadedInfo?.capabilities?.supports2WayAudio
) {
const forbidden = options.microphoneController.isForbidden();
const muted = options.microphoneController.isMuted();
const forbidden = options.microphoneManager.isForbidden();
const muted = options.microphoneManager.isMuted();
const buttonType = config.menu.buttons.microphone.type;
buttons.push({
icon: forbidden
@@ -285,7 +286,7 @@ export class MenuButtonController {
...(!forbidden &&
buttonType === 'toggle' && {
tap_action: createFrigateCardCustomAction(
options.microphoneController.isMuted()
options.microphoneManager.isMuted()
? 'microphone_unmute'
: 'microphone_mute',
) as FrigateCardCustomAction,
@@ -316,10 +317,12 @@ export class MenuButtonController {
});
if (
options?.mediaPlayers?.length &&
options?.mediaPlayerController?.hasMediaPlayers() &&
(view?.isViewerView() || (view.is('live') && selectedCameraConfig?.camera_entity))
) {
const mediaPlayerItems = options.mediaPlayers.map((playerEntityID) => {
const mediaPlayerItems = options.mediaPlayerController
.getMediaPlayers()
.map((playerEntityID) => {
const title = getEntityTitle(hass, playerEntityID) || playerEntityID;
const state = hass.states[playerEntityID];
const playAction = createFrigateCardCustomAction('media_player', {
src/utils/querystring.ts
-60
View File
@@ -1,60 +0,0 @@
import { FrigateCardCustomAction } from '../types';
import { createFrigateCardCustomAction } from './action.js';
export const getActionsFromQueryString = (
queryString: string,
): FrigateCardCustomAction[] => {
const params = new URLSearchParams(queryString);
const actions: FrigateCardCustomAction[] = [];
const actionRE = new RegExp(
/^frigate-card-action([.:](?<cardID>\w+))?[.:](?<action>\w+)/,
);
for (const [key, value] of params.entries()) {
const match = key.match(actionRE);
if (!match || !match.groups) {
continue;
}
const cardID: string | undefined = match.groups['cardID'];
const action = match.groups['action'];
let customAction: FrigateCardCustomAction | null = null;
switch (action) {
case 'camera_select':
case 'live_substream_select':
if (value) {
customAction = createFrigateCardCustomAction(action, {
camera: value,
cardID: cardID,
});
}
break;
case 'camera_ui':
case 'clip':
case 'clips':
case 'default':
case 'diagnostics':
case 'download':
case 'expand':
case 'image':
case 'live':
case 'menu_toggle':
case 'recording':
case 'recordings':
case 'snapshot':
case 'snapshots':
case 'timeline':
customAction = createFrigateCardCustomAction(action, {
cardID: cardID,
});
break;
default:
console.warn(
`Frigate card received unknown card action in query string: ${action}`,
);
}
if (customAction) {
actions.push(customAction);
}
}
return actions;
};
src/utils/screenshot.ts
+1 -1
View File
@@ -14,7 +14,7 @@ export const screenshotMedia = (video: HTMLVideoElement): string | null => {
return canvas.toDataURL('image/jpeg');
};
export const generateScreenshotTitle = (view?: View): string => {
export const generateScreenshotTitle = (view?: View | null): string => {
if (view?.is('live') || view?.is('image')) {
return `${view.view}-${view.camera}-${format(
new Date(),
src/utils/substream.ts
+3 -42
View File
@@ -1,48 +1,9 @@
import { CameraManager } from '../camera-manager/manager';
import { View } from '../view/view';
import { getAllDependentCameras } from './camera';
export const createViewWithSelectedSubstream = (
view: View,
substreamID: string,
): View | null => {
const overrides: Map<string, string> = view.context?.live?.overrides ?? new Map();
overrides.set(view.camera, substreamID);
return view.clone().mergeInContext({
live: { overrides: overrides },
});
};
export const createViewWithoutSubstream = (view: View): View => {
const newView = view.clone();
const overrides: Map<string, string> | undefined = newView.context?.live?.overrides;
if (overrides && overrides.has(view.camera)) {
newView.context?.live?.overrides?.delete(view.camera);
}
return newView;
export const getStreamCameraID = (view: View): string => {
return view?.context?.live?.overrides?.get(view.camera) ?? view.camera;
};
export const hasSubstream = (view: View): boolean => {
const override = view?.context?.live?.overrides?.get(view.camera);
return !!override && override !== view.camera;
};
export const createViewWithNextStream = (
cameraManager: CameraManager,
view: View,
): View => {
const dependencies = [...getAllDependentCameras(cameraManager, view.camera)];
if (dependencies.length <= 1) {
return view.clone();
}
const newView = view.clone();
const overrides: Map<string, string> = newView.context?.live?.overrides ?? new Map();
const currentOverride = overrides.get(newView.camera) ?? newView.camera;
const currentIndex = dependencies.indexOf(currentOverride);
const newIndex = currentIndex < 0 ? 0 : (currentIndex + 1) % dependencies.length;
overrides.set(view.camera, dependencies[newIndex]);
newView.mergeInContext({ live: { overrides: overrides } });
return newView;
return getStreamCameraID(view) !== view.camera;
};
src/utils/timeline-source.ts
+13 -23
View File
@@ -1,19 +1,18 @@
import { HomeAssistant } from 'custom-card-helpers';
import add from 'date-fns/add';
import sub from 'date-fns/sub';
import { DataSet } from 'vis-data';
import { IdType, TimelineItem, TimelineWindow } from 'vis-timeline/esnext';
import { ClipsOrSnapshotsOrAll } from '../types';
import { CameraManager } from '../camera-manager/manager';
import { EventQuery, RecordingQuery, RecordingSegment } from '../camera-manager/types';
import { capEndDate, convertRangeToCacheFriendlyTimes } from '../camera-manager/util';
import { ViewMedia } from '../view/media';
import {
compressRanges,
ExpiringMemoryRangeSet,
MemoryRangeSet,
compressRanges,
} from '../camera-manager/range';
import { errorToConsole, ModifyInterface } from './basic.js';
import { EventQuery, RecordingQuery, RecordingSegment } from '../camera-manager/types';
import { capEndDate, convertRangeToCacheFriendlyTimes } from '../camera-manager/util';
import { ClipsOrSnapshotsOrAll } from '../types';
import { ViewMedia } from '../view/media';
import { ModifyInterface, errorToConsole } from './basic.js';
// Allow timeline freshness to be at least this number of seconds out of date
// (caching times in the data-engine may increase the effective delay).
@@ -82,11 +81,11 @@ export class TimelineDataSource {
}
}
public async refresh(hass: HomeAssistant, window: TimelineWindow): Promise<void> {
public async refresh(window: TimelineWindow): Promise<void> {
try {
await Promise.all([
this._refreshEvents(hass, window),
...(this._showRecordings ? [this._refreshRecordings(hass, window)] : []),
this._refreshEvents(window),
...(this._showRecordings ? [this._refreshRecordings(window)] : []),
]);
} catch (e) {
errorToConsole(e as Error);
@@ -114,10 +113,7 @@ export class TimelineDataSource {
});
}
protected async _refreshEvents(
hass: HomeAssistant,
window: TimelineWindow,
): Promise<void> {
protected async _refreshEvents(window: TimelineWindow): Promise<void> {
if (
this._eventRanges.hasCoverage({
start: window.start,
@@ -134,7 +130,7 @@ export class TimelineDataSource {
return;
}
const mediaArray = await this._cameraManager.executeMediaQueries(hass, eventQueries);
const mediaArray = await this._cameraManager.executeMediaQueries(eventQueries);
const data: FrigateCardTimelineItem[] = [];
for (const media of mediaArray ?? []) {
const startTime = media.getStartTime();
@@ -159,10 +155,7 @@ export class TimelineDataSource {
});
}
protected async _refreshRecordings(
hass: HomeAssistant,
window: TimelineWindow,
): Promise<void> {
protected async _refreshRecordings(window: TimelineWindow): Promise<void> {
type FrigateCardTimelineItemWithEnd = ModifyInterface<
FrigateCardTimelineItem,
{ end: number }
@@ -228,10 +221,7 @@ export class TimelineDataSource {
if (!recordingQueries) {
return;
}
const results = await this._cameraManager.getRecordingSegments(
hass,
recordingQueries,
);
const results = await this._cameraManager.getRecordingSegments(recordingQueries);
const newSegments: Map<string, RecordingSegment[]> = new Map();
for (const [query, result] of results) {
src/utils/timer.ts
+7
View File
@@ -1,9 +1,14 @@
export class Timer {
protected _timer: number | null = null;
protected _repeated = false;
public stop(): void {
if (this._timer) {
if (this._repeated) {
window.clearInterval(this._timer);
} else {
window.clearTimeout(this._timer);
}
this._timer = null;
}
}
@@ -18,6 +23,7 @@ export class Timer {
this._timer = null;
func();
}, seconds * 1000);
this._repeated = false;
}
public startRepeated(seconds: number, func: () => void): void {
@@ -25,5 +31,6 @@ export class Timer {
this._timer = window.setInterval(() => {
func();
}, seconds * 1000);
this._repeated = true;
}
}
src/utils/zod.ts
+2 -10
View File
@@ -62,7 +62,7 @@ export function getParseErrorKeys<T>(error: z.ZodError<T>): string[] {
* @param error The ZodError object from parsing.
* @returns An array of string error paths.
*/
export const getParseErrorPaths = <T>(error: z.ZodError<T>): Set<string> | null => {
export const getParseErrorPaths = <T>(error: z.ZodError<T>): Set<string> => {
/* Zod errors involving unions are complex, as Zod may not be able to tell
* where the 'real' error is vs simply a union option not matching. This
* function finds all ZodError "issues" that don't have an error with 'type'
@@ -79,16 +79,8 @@ export const getParseErrorPaths = <T>(error: z.ZodError<T>): Set<string> | null
if (issue.code === 'invalid_union') {
const unionErrors = (issue as z.ZodInvalidUnionIssue).unionErrors;
for (const unionError of unionErrors) {
const nestedErrors = getParseErrorPaths(unionError);
if (nestedErrors && nestedErrors.size) {
nestedErrors.forEach(contenders.add, contenders);
getParseErrorPaths(unionError).forEach(contenders.add, contenders);
}
}
} else if (issue.code === 'invalid_type') {
if (issue.path[issue.path.length - 1] === 'type') {
return null;
}
contenders.add(getParseErrorPathString(issue.path));
} else {
contenders.add(getParseErrorPathString(issue.path));
}
src/view/view.ts
+3 -3
View File
@@ -43,7 +43,7 @@ export class View {
* @param curr The current view.
* @returns True if the view change is a real media change.
*/
public static isMajorMediaChange(prev?: View, curr?: View): boolean {
public static isMajorMediaChange(prev?: View | null, curr?: View): boolean {
return (
!prev ||
!curr ||
@@ -61,7 +61,7 @@ export class View {
);
}
public static adoptFromViewIfAppropriate(next: View, curr?: View): void {
public static adoptFromViewIfAppropriate(next: View, curr?: View | null): void {
if (!curr) {
return;
}
@@ -229,7 +229,7 @@ export class View {
* Determine if a view is for the media viewer.
*/
public isViewerView(): boolean {
return ['clip', 'snapshot', 'media', 'recording'].includes(this.view);
return ['media', 'clip', 'snapshot', 'recording'].includes(this.view);
}
public supportsMultipleDisplayModes(): boolean {
tests/automations.test.ts
-123
View File
@@ -1,123 +0,0 @@
import { afterEach, describe, expect, it, vi } from 'vitest';
import { mock } from 'vitest-mock-extended';
import { AutomationsController, AutomationsControllerError } from '../src/automations';
import { ConditionController } from '../src/conditions';
import { automationsSchema, FrigateCardError } from '../src/types';
import { frigateCardHandleAction } from '../src/utils/action.js';
import { createHASS } from './test-utils';
vi.mock('../src/utils/action.js');
describe('AutomationsController', () => {
const actions = [
{
action: 'custom:frigate-card-action',
frigate_card_action: 'clips',
},
];
const conditions = { fullscreen: true };
afterEach(() => {
vi.clearAllMocks();
});
it('should do nothing without automations', () => {
const automationController = new AutomationsController(undefined);
automationController.execute(
mock<HTMLElement>(),
createHASS(),
new ConditionController(),
);
expect(frigateCardHandleAction).not.toBeCalled();
});
it('should execute actions', () => {
const automations = automationsSchema.parse([
{
conditions: conditions,
actions: actions,
},
]);
const automationController = new AutomationsController(automations);
const conditionController = new ConditionController();
const element = mock<HTMLElement>();
const hass = createHASS();
automationController.execute(element, hass, conditionController);
expect(frigateCardHandleAction).not.toBeCalled();
conditionController.setState({ fullscreen: true });
automationController.execute(element, hass, conditionController);
expect(frigateCardHandleAction).toBeCalledTimes(1);
// Automation will not re-fire when condition continues to evaluate the
// same.
automationController.execute(element, hass, conditionController);
expect(frigateCardHandleAction).toBeCalledTimes(1);
conditionController.setState({ fullscreen: false });
automationController.execute(element, hass, conditionController);
expect(frigateCardHandleAction).toBeCalledTimes(1);
conditionController.setState({ fullscreen: true });
automationController.execute(element, hass, conditionController);
expect(frigateCardHandleAction).toBeCalledTimes(2);
});
it('should execute actions_not', () => {
const automations = automationsSchema.parse([
{
conditions: conditions,
actions_not: actions,
},
]);
const automationController = new AutomationsController(automations);
automationController.execute(
mock<HTMLElement>(),
createHASS(),
new ConditionController(),
);
expect(frigateCardHandleAction).toBeCalled();
});
it('should prevent automation loops', () => {
const automations = automationsSchema.parse([
{
conditions: { fullscreen: true },
actions: actions,
},
{
conditions: { fullscreen: false },
actions: actions,
},
]);
const automationController = new AutomationsController(automations);
const conditionController = new ConditionController();
const element = mock<HTMLElement>();
const hass = createHASS();
// Create a setup where one automation action causes another...
let fullscreen = true;
vi.mocked(frigateCardHandleAction).mockImplementation(() => {
fullscreen = !fullscreen;
conditionController.setState({ fullscreen: fullscreen });
automationController.execute(element, hass, conditionController);
});
conditionController.setState({ fullscreen: fullscreen });
expect(() =>
automationController.execute(element, hass, conditionController),
).toThrowError(/Too many nested automation calls/);
expect(frigateCardHandleAction).toBeCalledTimes(10);
});
it('should be able to construct error', () => {
const error = new AutomationsControllerError('message');
expect(error).toBeTruthy();
expect(error instanceof FrigateCardError).toBeTruthy();
});
});
tests/camera-manager/engine-factory.test.ts
+7 -14
View File
@@ -8,7 +8,12 @@ import { CardWideConfig } from '../../src/types.js';
import { EntityRegistryManager } from '../../src/utils/ha/entity-registry';
import { EntityCache } from '../../src/utils/ha/entity-registry/cache';
import { ResolvedMediaCache } from '../../src/utils/ha/resolved-media';
import { createCameraConfig, createHASS, createRegistryEntity } from '../test-utils';
import {
createCameraConfig,
createHASS,
createRegistryEntity,
createStateEntity,
} from '../test-utils';
vi.mock('../../src/utils/ha/entity-registry');
vi.mock('../../src/utils/ha/entity-registry/cache');
@@ -21,7 +26,6 @@ const createFactory = (options?: {
return new CameraManagerEngineFactory(
options?.entityRegistryManager ?? new EntityRegistryManager(new EntityCache()),
options?.resolvedMediaCache ?? new ResolvedMediaCache(),
options?.cardWideConfig ?? {},
);
};
@@ -131,18 +135,7 @@ describe('CameraManagerEngineFactory.getEngineForCamera()', () => {
entityRegistryManager: entityRegistryManager,
}).getEngineForCamera(
createHASS({
'camera.foo': {
entity_id: 'camera.foo',
state: 'streaming',
last_changed: 'bar',
last_updated: 'baz',
attributes: {},
context: {
id: 'context',
user_id: null,
parent_id: null,
},
},
'camera.foo': createStateEntity(),
}),
config,
),
tests/camera-manager/frigate/engine-frigate.test.ts
-1
View File
@@ -12,7 +12,6 @@ import { createCameraConfig, createHASS } from '../../test-utils';
const createEngine = (): FrigateCameraManagerEngine => {
return new FrigateCameraManagerEngine(
{},
new RecordingSegmentsCache(),
new RequestCache(),
);
tests/test-utils.ts
+99 -5
View File
@@ -1,7 +1,6 @@
import { HassEntities, HassEntity } from 'home-assistant-js-websocket';
import { vi } from 'vitest';
import { mock } from 'vitest-mock-extended';
import { CameraManagerEngineFactory } from '../src/camera-manager/engine-factory';
import { FrigateEvent, FrigateRecording } from '../src/camera-manager/frigate/types';
import { CameraManager } from '../src/camera-manager/manager';
import { CameraManagerStore } from '../src/camera-manager/store';
@@ -24,8 +23,31 @@ import {
frigateCardConfigSchema,
performanceConfigSchema,
} from '../src/types';
import { ActionsManager } from '../src/utils/card-controller/actions-manager';
import { AutoUpdateManager } from '../src/utils/card-controller/auto-update-manager';
import { AutomationsManager } from '../src/utils/card-controller/automations-manager';
import { CameraURLManager } from '../src/utils/card-controller/camera-url-manager';
import { CardElementManager } from '../src/utils/card-controller/card-element-manager';
import { ConditionsManager } from '../src/utils/card-controller/conditions-manager';
import { ConfigManager } from '../src/utils/card-controller/config-manager';
import { CardController } from '../src/utils/card-controller/controller';
import { DownloadManager } from '../src/utils/card-controller/download-manager';
import { ExpandManager } from '../src/utils/card-controller/expand-manager';
import { FullscreenManager } from '../src/utils/card-controller/fullscreen-manager';
import { HASSManager } from '../src/utils/card-controller/hass-manager';
import { InitializationManager } from '../src/utils/card-controller/initialization-manager';
import { InteractionManager } from '../src/utils/card-controller/interaction-manager';
import { MediaLoadedInfoManager } from '../src/utils/card-controller/media-info-manager';
import { MediaPlayerManager } from '../src/utils/card-controller/media-player-manager';
import { MessageManager } from '../src/utils/card-controller/message-manager';
import { MicrophoneManager } from '../src/utils/card-controller/microphone-manager';
import { QueryStringManager } from '../src/utils/card-controller/query-string-manager';
import { StyleManager } from '../src/utils/card-controller/style-manager';
import { TriggersManager } from '../src/utils/card-controller/triggers-manager';
import { ViewManager } from '../src/utils/card-controller/view-manager';
import { Entity } from '../src/utils/ha/entity-registry/types';
import { ViewMedia, ViewMediaType } from '../src/view/media';
import { MediaQueriesResults } from '../src/view/media-queries-results';
import { View, ViewParameters } from '../src/view/view';
export const createCameraConfig = (config?: unknown): CameraConfig => {
@@ -118,11 +140,22 @@ export const createView = (options?: Partial<ViewParameters>): View => {
});
};
export const createViewWithMedia = (options?: Partial<ViewParameters>): View => {
const media = generateViewMediaArray({ count: 5 });
return createView({
queryResults: new MediaQueriesResults({
results: media,
selectedIndex: 0,
}),
...options,
});
};
export const createCameraManager = (options?: {
store?: CameraManagerStore;
configs?: CameraConfigs;
}): CameraManager => {
const cameraManager = new CameraManager(mock<CameraManagerEngineFactory>(), {});
const cameraManager = new CameraManager(createCardAPI());
let store: CameraManagerStore | undefined = options?.store;
if (!store) {
store = mock<CameraManagerStore>();
@@ -130,9 +163,14 @@ export const createCameraManager = (options?: {
vi.mocked(store.getCameras).mockReturnValue(configs);
vi.mocked(store.getVisibleCameras).mockReturnValue(configs);
vi.mocked(store.getVisibleCameraIDs).mockReturnValue(new Set(configs.keys()));
vi.mocked(store.getCameraConfig).mockImplementation((cameraID): CameraConfig => {
return configs.get(cameraID) ?? createCameraConfig();
});
vi.mocked(store.hasVisibleCameraID).mockImplementation((cameraID: string) =>
[...configs.keys()].includes(cameraID),
);
vi.mocked(store.getCameraConfig).mockImplementation(
(cameraID): CameraConfig | null => {
return configs.get(cameraID) ?? null;
},
);
}
vi.mocked(cameraManager.getStore).mockReturnValue(store);
vi.mocked(cameraManager.generateDefaultEventQueries).mockReturnValue([
@@ -147,6 +185,15 @@ export const createCameraManager = (options?: {
type: QueryType.Recording,
},
]);
vi.mocked(cameraManager.getCameraCapabilities).mockReturnValue({
canFavoriteEvents: true,
canFavoriteRecordings: true,
canSeek: true,
supportsClips: true,
supportsRecordings: true,
supportsSnapshots: true,
supportsTimeline: true,
});
return cameraManager;
};
@@ -210,6 +257,9 @@ export class TestViewMedia extends ViewMedia {
protected _startTime: Date | null;
protected _endTime: Date | null;
protected _inProgress: boolean | null;
protected _contentID: string | null;
protected _title: string | null;
protected _thumbnail: string | null;
constructor(options?: {
id?: string | null;
@@ -218,12 +268,18 @@ export class TestViewMedia extends ViewMedia {
cameraID?: string;
endTime?: Date;
inProgress?: boolean;
contentID?: string;
title?: string;
thumbnail?: string;
}) {
super(options?.mediaType ?? 'clip', options?.cameraID ?? 'camera');
this._id = options?.id !== undefined ? options.id : 'id';
this._startTime = options?.startTime ?? null;
this._endTime = options?.endTime ?? null;
this._inProgress = options?.inProgress !== undefined ? options.inProgress : false;
this._contentID = options?.contentID ?? null;
this._title = options?.title ?? null;
this._thumbnail = options?.thumbnail ?? null;
}
public getID(): string | null {
return this._id;
@@ -237,6 +293,15 @@ export class TestViewMedia extends ViewMedia {
public inProgress(): boolean | null {
return this._inProgress;
}
public getContentID(): string | null {
return this._contentID;
}
public getTitle(): string | null {
return this._title;
}
public getThumbnail(): string | null {
return this._thumbnail;
}
}
export const ResizeObserverMock = vi.fn(() => ({
@@ -289,3 +354,32 @@ export const createParent = (options?: { children?: HTMLElement[] }): HTMLElemen
parent.append(...(options?.children ?? []));
return parent;
};
export const createCardAPI = (): CardController => {
const api = mock<CardController>();
api.getActionsManager.mockReturnValue(mock<ActionsManager>());
api.getAutomationsManager.mockReturnValue(mock<AutomationsManager>());
api.getAutoUpdateManager.mockReturnValue(mock<AutoUpdateManager>());
api.getCameraManager.mockReturnValue(mock<CameraManager>());
api.getCameraURLManager.mockReturnValue(mock<CameraURLManager>());
api.getCardElementManager.mockReturnValue(mock<CardElementManager>());
api.getConditionsManager.mockReturnValue(mock<ConditionsManager>());
api.getConfigManager.mockReturnValue(mock<ConfigManager>());
api.getDownloadManager.mockReturnValue(mock<DownloadManager>());
api.getExpandManager.mockReturnValue(mock<ExpandManager>());
api.getFullscreenManager.mockReturnValue(mock<FullscreenManager>());
api.getHASSManager.mockReturnValue(mock<HASSManager>());
api.getInitializationManager.mockReturnValue(mock<InitializationManager>());
api.getInteractionManager.mockReturnValue(mock<InteractionManager>());
api.getMediaLoadedInfoManager.mockReturnValue(mock<MediaLoadedInfoManager>());
api.getMediaPlayerManager.mockReturnValue(mock<MediaPlayerManager>());
api.getMessageManager.mockReturnValue(mock<MessageManager>());
api.getMicrophoneManager.mockReturnValue(mock<MicrophoneManager>());
api.getQueryStringManager.mockReturnValue(mock<QueryStringManager>());
api.getStyleManager.mockReturnValue(mock<StyleManager>());
api.getTriggersManager.mockReturnValue(mock<TriggersManager>());
api.getViewManager.mockReturnValue(mock<ViewManager>());
return api;
};
tests/utils/action.test.ts
-43
View File
@@ -14,7 +14,6 @@ import {
frigateCardHandleActionConfig,
frigateCardHasAction,
getActionConfigGivenAction,
isViewAction,
stopEventFromActivatingCardWideActions,
} from '../../src/utils/action';
import { createHASS } from '../test-utils';
@@ -242,45 +241,3 @@ describe('stopEventFromActivatingCardWideActions', () => {
expect(event.stopPropagation).toBeCalled();
});
});
describe('isViewAction', () => {
const createAction = (action: FrigateCardAction): FrigateCardCustomAction => {
return frigateCardCustomActionSchema.parse({
action: 'fire-dom-event' as const,
frigate_card_action: action,
});
};
it('should return true for clip view ', () => {
expect(isViewAction(createAction('clip'))).toBeTruthy();
});
it('should return true for clips view ', () => {
expect(isViewAction(createAction('clips'))).toBeTruthy();
});
it('should return true for image view ', () => {
expect(isViewAction(createAction('image'))).toBeTruthy();
});
it('should return true for live view ', () => {
expect(isViewAction(createAction('live'))).toBeTruthy();
});
it('should return true for recording view ', () => {
expect(isViewAction(createAction('recording'))).toBeTruthy();
});
it('should return true for live view ', () => {
expect(isViewAction(createAction('live'))).toBeTruthy();
});
it('should return true for recordings view ', () => {
expect(isViewAction(createAction('recordings'))).toBeTruthy();
});
it('should return true for snapshot view ', () => {
expect(isViewAction(createAction('snapshot'))).toBeTruthy();
});
it('should return true for snapshots view ', () => {
expect(isViewAction(createAction('snapshots'))).toBeTruthy();
});
it('should return true for timeline view ', () => {
expect(isViewAction(createAction('timeline'))).toBeTruthy();
});
it('should return false for anything else', () => {
expect(isViewAction(createAction('diagnostics'))).toBeFalsy();
});
});
tests/utils/card-controller/actions-manager.test.ts
+730
View File
@@ -0,0 +1,730 @@
import { afterAll, describe, expect, it, vi } from 'vitest';
import { mock } from 'vitest-mock-extended';
import {
ActionType,
FrigateCardCustomAction,
FrigateCardMediaPlayer,
FrigateCardView,
frigateCardCustomActionSchema,
} from '../../../src/types';
import {
convertActionToFrigateCardCustomAction,
frigateCardHandleActionConfig,
getActionConfigGivenAction,
} from '../../../src/utils/action.js';
import { ActionsManager } from '../../../src/utils/card-controller/actions-manager';
import {
createCardAPI,
createConfig,
createHASS,
createMediaLoadedInfo,
createView,
createViewWithMedia,
} from '../../test-utils';
vi.mock('../../../src/utils/action.js');
vi.mock('../../../src/camera-manager/manager.js');
const createAction = (
action: Record<string, unknown>,
): FrigateCardCustomAction | null => {
const result = frigateCardCustomActionSchema.safeParse({
action: 'custom:frigate-card-action',
...action,
});
return result.success ? result.data : null;
};
describe('ActionsManager.getMergedActions', () => {
const config = {
view: {
actions: {
tap_action: {
action: 'navigate',
navigation_path: '1',
},
},
},
live: {
actions: {
tap_action: {
action: 'navigate',
navigation_path: '2',
},
},
},
media_gallery: {
actions: {
tap_action: {
action: 'navigate',
navigation_path: '3',
},
},
},
media_viewer: {
actions: {
tap_action: {
action: 'navigate',
navigation_path: '4',
},
},
},
image: {
actions: {
tap_action: {
action: 'navigate',
navigation_path: '5',
},
},
},
};
afterAll(() => {
vi.restoreAllMocks();
});
it('should get no merged actions with a message', () => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({ view: 'live' }),
);
vi.mocked(api.getMessageManager().hasMessage).mockReturnValue(true);
const manager = new ActionsManager(api);
expect(manager.getMergedActions()).toEqual({});
});
describe('should get merged actions with live view', () => {
it.each([
[
'live' as const,
{
tap_action: {
action: 'navigate',
navigation_path: '2',
},
},
],
[
'clips' as const,
{
tap_action: {
action: 'navigate',
navigation_path: '3',
},
},
],
[
'clip' as const,
{
tap_action: {
action: 'navigate',
navigation_path: '4',
},
},
],
[
'image' as const,
{
tap_action: {
action: 'navigate',
navigation_path: '5',
},
},
],
['timeline' as const, {}],
])('%s', (viewName: FrigateCardView, result: Record<string, unknown>) => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({ view: viewName }),
);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig(config),
);
const manager = new ActionsManager(api);
expect(manager.getMergedActions()).toEqual(result);
});
});
});
// @vitest-environment jsdom
describe('ActionsManager.handleInteraction', () => {
it('should handle interaction', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const manager = new ActionsManager(api);
const hass = createHASS();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(hass);
const actionForThisInteraction: ActionType = {
action: 'none',
};
vi.mocked(getActionConfigGivenAction).mockReturnValue(actionForThisInteraction);
manager.handleInteraction('tap');
expect(frigateCardHandleActionConfig).toBeCalledWith(
element,
hass,
manager.getMergedActions(),
'tap',
actionForThisInteraction,
);
});
it('should not handle interaction', () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(null);
// No values of hass.
manager.handleInteraction('tap');
expect(frigateCardHandleActionConfig).not.toBeCalledWith();
});
});
describe('ActionsManager.handleActionEvent', () => {
it('should handle event', () => {
const action = createAction({ frigate_card_action: 'default' })!;
const event: CustomEvent<FrigateCardCustomAction> = new CustomEvent('ll-custom', {
detail: action,
});
// The file containing convertActionToFrigateCardCustomAction (action.ts) is
// mocked, so need to provide a value here.
vi.mocked(convertActionToFrigateCardCustomAction).mockReturnValue(action);
const api = createCardAPI();
const manager = new ActionsManager(api);
manager.handleActionEvent(event);
expect(api.getViewManager().setViewDefault).toBeCalled();
});
it('should not handle event without detail', () => {
const action = createAction({ frigate_card_action: 'default' })!;
const event = new Event('ll-custom');
// Mock this out just so that if the sentinel in handleActionEvent failed,
// it would still trigger a test failure below.
vi.mocked(convertActionToFrigateCardCustomAction).mockReturnValue(action);
const api = createCardAPI();
const manager = new ActionsManager(api);
manager.handleActionEvent(event);
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
it('should not handle malformed action', () => {
const action = createAction({ frigate_card_action: 'default' })!;
const event: CustomEvent<FrigateCardCustomAction> = new CustomEvent('ll-custom', {
detail: action,
});
vi.mocked(convertActionToFrigateCardCustomAction).mockReturnValue(null);
const api = createCardAPI();
const manager = new ActionsManager(api);
manager.handleActionEvent(event);
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
});
describe('ActionsManager.executeAction', () => {
it('should not handle actions with different card_id', async () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
card_id: 'foo',
}),
);
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
card_id: 'NOT_foo',
frigate_card_action: 'default',
})!,
);
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
it('should handle default action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'default',
})!,
);
expect(api.getViewManager().setViewDefault).toBeCalled();
});
describe('should handle view action', async () => {
it.each([
['clip' as const],
['clips' as const],
['image' as const],
['live' as const],
['recording' as const],
['recordings' as const],
['snapshot' as const],
['snapshots' as const],
['timeline' as const],
])('%s', async (viewName: FrigateCardView) => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: viewName,
})!,
);
expect(api.getViewManager().setViewByParameters).toBeCalledWith(
expect.objectContaining({
viewName: viewName,
}),
);
});
});
it('should handle download action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'download',
})!,
);
expect(api.getDownloadManager().downloadViewerMedia).toBeCalled();
});
it('should handle camera ui action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'camera_ui',
})!,
);
expect(api.getCameraURLManager().openURL).toBeCalled();
});
it('should handle expand action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'expand',
})!,
);
expect(api.getExpandManager().toggleExpanded).toBeCalled();
});
it('should handle fullscreen action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'fullscreen',
})!,
);
expect(api.getFullscreenManager().toggleFullscreen).toBeCalled();
});
it('should handle menu toggle action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'menu_toggle',
})!,
);
expect(api.getCardElementManager().toggleMenu).toBeCalled();
});
describe('should handle camera_select action', () => {
it('with valid camera and view', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
vi.mocked(api.getViewManager().getView).mockReturnValue(createView());
vi.mocked(api.getViewManager().isViewSupportedByCamera).mockReturnValue(true);
await manager.executeAction(
createAction({
frigate_card_action: 'camera_select',
camera: 'camera',
})!,
);
expect(api.getViewManager().setViewByParameters).toBeCalledWith(
expect.objectContaining({
viewName: 'live',
cameraID: 'camera',
}),
);
});
it('without config', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(null);
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
view: 'timeline',
}),
);
vi.mocked(api.getViewManager().isViewSupportedByCamera).mockReturnValue(true);
await manager.executeAction(
createAction({
frigate_card_action: 'camera_select',
camera: 'camera',
})!,
);
expect(api.getViewManager().setViewByParameters).toBeCalledWith(
expect.objectContaining({
viewName: 'timeline',
cameraID: 'camera',
}),
);
});
it('with target view', async () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
// Change to clips view when the camera changes.
camera_select: 'clips',
},
}),
);
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
view: 'live',
}),
);
vi.mocked(api.getViewManager().isViewSupportedByCamera).mockReturnValue(true);
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'camera_select',
camera: 'camera',
})!,
);
expect(api.getViewManager().setViewByParameters).toBeCalledWith(
expect.objectContaining({
viewName: 'clips',
cameraID: 'camera',
}),
);
});
it('without a current view', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'camera_select',
camera: 'camera',
})!,
);
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
});
it('with an unsupported view', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
view: 'timeline',
}),
);
await manager.executeAction(
createAction({
frigate_card_action: 'camera_select',
camera: 'camera',
})!,
);
expect(api.getViewManager().setViewByParameters).toBeCalledWith(
expect.objectContaining({
// Should have fallen back to the default view.
viewName: 'live',
cameraID: 'camera',
}),
);
});
});
it('should handle live_substream_select action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'live_substream_select',
camera: 'substream',
})!,
);
expect(api.getViewManager().setViewWithSubstream).toBeCalledWith('substream');
});
it('should handle live_substream_off action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'live_substream_off',
})!,
);
expect(api.getViewManager().setViewWithoutSubstream).toBeCalled();
});
it('should handle live_substream_on action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'live_substream_on',
})!,
);
expect(api.getViewManager().setViewWithSubstream).toBeCalledWith();
});
describe('should handle media_player action', () => {
it('to stop', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'media_player',
media_player_action: 'stop',
media_player: 'this_is_a_media_player',
})!,
);
expect(api.getMediaPlayerManager().stop).toBeCalledWith('this_is_a_media_player');
});
it('to play live', async () => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
camera: 'camera',
view: 'live',
}),
);
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'media_player',
media_player_action: 'play',
media_player: 'this_is_a_media_player',
})!,
);
expect(api.getMediaPlayerManager().playLive).toBeCalledWith(
'this_is_a_media_player',
'camera',
);
});
it('to play media', async () => {
const api = createCardAPI();
const view = createViewWithMedia({
camera: 'camera',
view: 'media',
});
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'media_player',
media_player_action: 'play',
media_player: 'this_is_a_media_player',
})!,
);
expect(api.getMediaPlayerManager().playMedia).toBeCalledWith(
'this_is_a_media_player',
view.queryResults?.getSelectedResult(),
);
});
it('to play media without selected media', async () => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
view: 'media',
}),
);
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'media_player',
media_player_action: 'play',
media_player: 'this_is_a_media_player',
})!,
);
expect(api.getMediaPlayerManager().playMedia).not.toBeCalled();
});
});
it('should handle diagnostics action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'diagnostics',
})!,
);
expect(api.getViewManager().setViewByParameters).toBeCalledWith(
expect.objectContaining({
viewName: 'diagnostics',
}),
);
});
it('should handle microphone_mute action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'microphone_mute',
})!,
);
expect(api.getMicrophoneManager().mute).toBeCalled();
});
it('should handle microphone_unmute action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'microphone_unmute',
})!,
);
expect(api.getMicrophoneManager().unmute).toBeCalled();
});
describe('should handle media player action', () => {
it.each([
['mute' as const],
['unmute' as const],
['play' as const],
['pause' as const],
])('%s', async (action: 'mute' | 'unmute' | 'play' | 'pause') => {
const api = createCardAPI();
const player = mock<FrigateCardMediaPlayer>();
vi.mocked(api.getMediaLoadedInfoManager().get).mockReturnValue(
createMediaLoadedInfo({
player: player,
}),
);
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: action,
})!,
);
expect(player[action]).toBeCalled();
});
});
it('should handle screenshot action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'screenshot',
})!,
);
expect(api.getDownloadManager().downloadScreenshot).toBeCalled();
});
it('should handle display_mode_select action', async () => {
const api = createCardAPI();
const manager = new ActionsManager(api);
await manager.executeAction(
createAction({
frigate_card_action: 'display_mode_select',
display_mode: 'grid',
})!,
);
expect(api.getViewManager().setViewWithNewDisplayMode).toBeCalledWith('grid');
});
it('should handle unknown action', async () => {
const manager = new ActionsManager(createCardAPI());
const spy = vi.spyOn(global.console, 'warn').mockImplementation(() => true);
await manager.executeAction(
// Have to manually create the action (vs using `createAction()`) since
// it's malformed.
{
frigate_card_action: 'not_a_real_action',
} as unknown as FrigateCardCustomAction,
);
expect(spy).toBeCalledWith(
'Frigate card received unknown card action: not_a_real_action',
);
});
});
tests/utils/card-controller/auto-update-manager.test.ts
+73
View File
@@ -0,0 +1,73 @@
import add from 'date-fns/add';
import { afterEach, describe, expect, it, vi } from 'vitest';
import { AutoUpdateManager } from '../../../src/utils/card-controller/auto-update-manager';
import { createCardAPI, createConfig } from '../../test-utils';
// @vitest-environment jsdom
describe('AutoUpdateManager', () => {
const start = new Date('2023-09-23T19:12:00');
afterEach(() => {
vi.useRealTimers();
});
it('should set default view when allowed', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
update_seconds: 10,
},
}),
);
// Card is triggered.
vi.mocked(api.getTriggersManager().isTriggered).mockReturnValue(true);
vi.mocked(api.getInteractionManager().hasInteraction).mockReturnValue(false);
vi.useFakeTimers();
vi.setSystemTime(start);
const manager = new AutoUpdateManager(api);
manager.startDefaultViewTimer();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
vi.setSystemTime(add(start, { seconds: 10 }));
vi.runOnlyPendingTimers();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
vi.mocked(api.getTriggersManager().isTriggered).mockReturnValue(false);
vi.setSystemTime(add(start, { seconds: 20 }));
vi.runOnlyPendingTimers();
expect(api.getViewManager().setViewDefault).toBeCalled();
});
it('should not set default view when not configured', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
update_seconds: 0,
},
}),
);
vi.mocked(api.getTriggersManager().isTriggered).mockReturnValue(false);
vi.mocked(api.getInteractionManager().hasInteraction).mockReturnValue(false);
vi.useFakeTimers();
vi.setSystemTime(start);
const manager = new AutoUpdateManager(api);
manager.startDefaultViewTimer();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
vi.setSystemTime(add(start, { seconds: 10 }));
vi.runOnlyPendingTimers();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
});
tests/utils/card-controller/automations-manager.test.ts
+150
View File
@@ -0,0 +1,150 @@
import { afterEach, describe, expect, it, vi } from 'vitest';
import { frigateCardHandleAction } from '../../../src/utils/action.js';
import {
AutomationsManager,
} from '../../../src/utils/card-controller/automations-manager';
import { createCardAPI, createConfig, createHASS } from '../../test-utils';
vi.mock('../../../src/utils/action.js');
describe('AutomationsManager', () => {
const actions = [
{
action: 'custom:frigate-card-action',
frigate_card_action: 'clips',
},
];
const conditions = { fullscreen: true };
afterEach(() => {
vi.clearAllMocks();
});
it('should do nothing without hass', () => {
const api = createCardAPI();
const automationsManager = new AutomationsManager(api);
automationsManager.execute();
expect(frigateCardHandleAction).not.toBeCalled();
});
it('should do nothing without automations', () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const automationsManager = new AutomationsManager(api);
automationsManager.setAutomationsFromConfig();
automationsManager.execute();
expect(frigateCardHandleAction).not.toBeCalled();
});
it('should execute actions', () => {
const config = createConfig({
automations: [
{
conditions: conditions,
actions: actions,
},
],
});
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().getNonOverriddenConfig).mockReturnValue(config);
const automationsManager = new AutomationsManager(api);
automationsManager.setAutomationsFromConfig();
automationsManager.execute();
expect(frigateCardHandleAction).not.toBeCalled();
vi.mocked(api.getConditionsManager().evaluateCondition).mockReturnValue(true);
automationsManager.execute();
expect(frigateCardHandleAction).toBeCalledTimes(1);
// Automation will not re-fire when condition continues to evaluate the
// same.
automationsManager.execute();
expect(frigateCardHandleAction).toBeCalledTimes(1);
vi.mocked(api.getConditionsManager().evaluateCondition).mockReturnValue(false);
automationsManager.execute();
expect(frigateCardHandleAction).toBeCalledTimes(1);
vi.mocked(api.getConditionsManager().evaluateCondition).mockReturnValue(true);
automationsManager.execute();
expect(frigateCardHandleAction).toBeCalledTimes(2);
});
it('should execute actions_not', () => {
const config = createConfig({
automations: [
{
conditions: conditions,
actions_not: actions,
},
],
});
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().getNonOverriddenConfig).mockReturnValue(config);
vi.mocked(api.getConditionsManager().evaluateCondition).mockReturnValue(false);
const automationsManager = new AutomationsManager(api);
automationsManager.setAutomationsFromConfig();
automationsManager.execute();
expect(frigateCardHandleAction).toBeCalled();
});
it('should prevent automation loops', () => {
const config = createConfig({
automations: [
{
conditions: { fullscreen: true },
actions: actions,
},
{
conditions: { fullscreen: true },
actions_not: actions,
},
],
});
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().getNonOverriddenConfig).mockReturnValue(config);
const automationsManager = new AutomationsManager(api);
automationsManager.setAutomationsFromConfig();
// Create a setup where one automation action causes another...
let evaluation = true;
vi.mocked(frigateCardHandleAction).mockImplementation(() => {
evaluation = !evaluation;
vi.mocked(api.getConditionsManager().evaluateCondition).mockReturnValue(
evaluation,
);
automationsManager.execute();
});
vi.mocked(api.getConditionsManager().evaluateCondition).mockReturnValue(evaluation);
automationsManager.execute();
expect(api.getMessageManager().setMessageIfHigherPriority).toBeCalledWith(
expect.objectContaining({
type: 'error',
message:
'Too many nested automation calls, please check your configuration for loops',
}),
);
expect(frigateCardHandleAction).toBeCalledTimes(10);
});
});
tests/utils/card-controller/camera-url-manager.test.ts
+58
View File
@@ -0,0 +1,58 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { CameraEndpoint } from '../../../src/camera-manager/types';
import { CameraURLManager } from '../../../src/utils/card-controller/camera-url-manager';
import {
CardCameraURLAPI
} from '../../../src/utils/card-controller/types';
import { createCardAPI, createViewWithMedia } from '../../test-utils';
const createAPIWithMedia = (): CardCameraURLAPI => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(
createViewWithMedia()
)
return api;
};
// @vitest-environment jsdom
describe('CameraURLManager', () => {
beforeEach(() => {
vi.restoreAllMocks();
});
it('should get URL', () => {
const api = createAPIWithMedia();
const manager = new CameraURLManager(api);
const endpoint: CameraEndpoint = {
endpoint: 'http://frigate',
};
vi.mocked(api.getCameraManager().getCameraEndpoints)?.mockReturnValue({
ui: endpoint,
});
expect(manager.getCameraURL()).toBe('http://frigate');
expect(manager.hasCameraURL()).toBeTruthy();
const windowSpy = vi.spyOn(window, 'open').mockReturnValue(null);
manager.openURL();
expect(windowSpy).toBeCalledWith('http://frigate');
});
it('should not get URL without view', () => {
const manager = new CameraURLManager(createCardAPI());
expect(manager.getCameraURL()).toBeNull();
const windowSpy = vi.spyOn(window, 'open').mockReturnValue(null);
manager.openURL();
expect(windowSpy).not.toBeCalled();
});
it('should not get URL without cameraManager endpoints', () => {
const api = createAPIWithMedia();
vi.mocked(api.getCameraManager().getCameraEndpoints)?.mockReturnValue(null);
const manager = new CameraURLManager(api);
expect(manager.getCameraURL()).toBeNull();
});
});
tests/utils/card-controller/card-element-manager.test.ts
+182
View File
@@ -0,0 +1,182 @@
import { afterEach, describe, expect, it, vi } from 'vitest';
import {
CardElementManager,
CardHTMLElement,
} from '../../../src/utils/card-controller/card-element-manager';
import { createCardAPI } from '../../test-utils';
import { mock } from 'vitest-mock-extended';
const createElement = (): CardHTMLElement => {
const element = document.createElement('div') as unknown as CardHTMLElement;
element.requestUpdate = vi.fn();
return element as CardHTMLElement;
};
// @vitest-environment jsdom
describe('CardElementManager', () => {
afterEach(() => {
vi.unstubAllGlobals();
global.window.location = mock<Location>();
});
it('should get element', () => {
const element = createElement();
const manager = new CardElementManager(
createCardAPI(),
element,
() => undefined,
() => undefined,
);
expect(manager.getElement()).toBe(element);
});
it('should reset scroll', () => {
const callback = vi.fn();
const manager = new CardElementManager(
createCardAPI(),
createElement(),
callback,
() => undefined,
);
manager.scrollReset();
expect(callback).toBeCalled();
});
it('should toggle menu', () => {
const callback = vi.fn();
const manager = new CardElementManager(
createCardAPI(),
createElement(),
() => undefined,
callback,
);
manager.toggleMenu();
expect(callback).toBeCalled();
});
it('should update', () => {
const element = createElement();
const manager = new CardElementManager(
createCardAPI(),
element,
() => undefined,
() => undefined,
);
manager.update();
expect(element.requestUpdate).toBeCalled();
});
it('should get hasUpdated', () => {
const element = createElement();
element.hasUpdated = true;
const manager = new CardElementManager(
createCardAPI(),
element,
() => undefined,
() => undefined,
);
expect(manager.hasUpdated()).toBeTruthy();
});
it('should get height', () => {
const element = createElement();
element.getBoundingClientRect = vi.fn().mockReturnValue({
width: 200,
height: 800,
});
const manager = new CardElementManager(
createCardAPI(),
element,
() => undefined,
() => undefined,
);
expect(manager.getCardHeight()).toBe(800);
});
it('should connect', () => {
const windowAddEventListener = vi.spyOn(global.window, 'addEventListener');
const addEventListener = vi.fn();
const element = createElement();
element.addEventListener = addEventListener;
const api = createCardAPI();
const manager = new CardElementManager(
api,
element,
() => undefined,
() => undefined,
);
manager.elementConnected();
expect(element.getAttribute('panel')).toBeNull();
expect(api.getFullscreenManager().connect).toBeCalled();
expect(addEventListener).toBeCalledWith(
'mousemove',
api.getInteractionManager().reportInteraction,
);
expect(addEventListener).toBeCalledWith(
'll-custom',
api.getActionsManager().handleActionEvent,
);
expect(addEventListener).toBeCalledWith(
'@action',
api.getInteractionManager().reportInteraction,
);
expect(windowAddEventListener).toBeCalledWith('location-changed', expect.anything());
expect(windowAddEventListener).toBeCalledWith('popstate', expect.anything());
});
it('should disconnect', () => {
const windowRemoveEventListener = vi.spyOn(global.window, 'removeEventListener');
const element = createElement();
element.setAttribute('panel', '');
const removeEventListener = vi.fn();
element.removeEventListener = removeEventListener;
const api = createCardAPI();
const manager = new CardElementManager(
api,
element,
() => undefined,
() => undefined,
);
manager.elementDisconnected();
expect(element.getAttribute('panel')).toBeNull();
expect(api.getMediaLoadedInfoManager().clear).toBeCalled();
expect(api.getFullscreenManager().disconnect).toBeCalled();
expect(removeEventListener).toBeCalledWith(
'mousemove',
api.getInteractionManager().reportInteraction,
);
expect(removeEventListener).toBeCalledWith(
'll-custom',
api.getActionsManager().handleActionEvent,
);
expect(removeEventListener).toBeCalledWith(
'@action',
api.getInteractionManager().reportInteraction,
);
expect(windowRemoveEventListener).toBeCalledWith(
'location-changed',
expect.anything(),
);
expect(windowRemoveEventListener).toBeCalledWith('popstate', expect.anything());
});
});
tests/conditions.test.ts → tests/utils/card-controller/conditions-manager.test.ts
+93 -98
View File
@@ -1,13 +1,18 @@
import { afterEach, describe, expect, it, vi } from 'vitest';
import {
ConditionController,
ConditionsManager,
ConditionEvaluateRequestEvent,
evaluateConditionViaEvent,
getOverriddenConfig,
getOverridesByKey,
} from '../src/conditions';
import { FrigateCardCondition } from '../src/types';
import { createCondition, createConfig, createStateEntity } from './test-utils';
} from '../../../src/utils/card-controller/conditions-manager';
import { FrigateCardCondition } from '../../../src/types';
import {
createCardAPI,
createCondition,
createConfig,
createStateEntity,
} from '../../test-utils';
// @vitest-environment jsdom
describe('ConditionEvaluateRequestEvent', () => {
@@ -85,15 +90,15 @@ describe('getOverriddenConfig', () => {
];
it('should not override config', () => {
const controller = new ConditionController();
expect(getOverriddenConfig(controller, config, overrides)).toBe(config);
const manager = new ConditionsManager(createCardAPI());
expect(getOverriddenConfig(manager, config, overrides)).toBe(config);
});
it('should override config', () => {
const controller = new ConditionController();
controller.setState({ fullscreen: true });
const manager = new ConditionsManager(createCardAPI());
manager.setState({ fullscreen: true });
expect(getOverriddenConfig(controller, config, overrides)).toEqual({
expect(getOverriddenConfig(manager, config, overrides)).toEqual({
menu: {
style: 'above',
},
@@ -101,10 +106,10 @@ describe('getOverriddenConfig', () => {
});
it('should do nothing without overrides', () => {
const controller = new ConditionController();
controller.setState({ fullscreen: true });
const manager = new ConditionsManager(createCardAPI());
manager.setState({ fullscreen: true });
expect(getOverriddenConfig(controller, config)).toBe(config);
expect(getOverriddenConfig(manager, config)).toBe(config);
});
});
@@ -139,7 +144,7 @@ describe('getOverridesByKey', () => {
});
});
describe('ConditionController', () => {
describe('ConditionsManager', () => {
const config = {
type: 'custom:frigate-card',
cameras: [],
@@ -187,40 +192,23 @@ describe('ConditionController', () => {
vi.restoreAllMocks();
});
it('should add listener', () => {
const controller = new ConditionController();
const handler = vi.fn();
controller.addStateListener(handler);
controller.setState({ fullscreen: true });
expect(handler).toBeCalled();
});
it('should get epoch', () => {
const manager = new ConditionsManager(createCardAPI());
const epoch_1 = manager.getEpoch();
expect(epoch_1).toEqual({ manager: manager });
it('should remove listener', () => {
const controller = new ConditionController();
const handler = vi.fn();
controller.addStateListener(handler);
controller.removeStateListener(handler);
controller.setState({ fullscreen: true });
expect(handler).not.toBeCalled();
});
manager.setState({ fullscreen: true });
it('should get wrapper', () => {
const controller = new ConditionController();
const wrapper_1 = controller.getEpoch();
expect(wrapper_1).toEqual({ controller: controller });
controller.setState({ fullscreen: true });
const wrapper_2 = controller.getEpoch();
expect(wrapper_2).toEqual({ controller: controller });
const epoch_2 = manager.getEpoch();
expect(epoch_2).toEqual({ manager: manager });
// Since the state was set the wrappers should be different.
expect(wrapper_1).not.toBe(wrapper_2);
expect(epoch_1).not.toBe(epoch_2);
});
it('should not return hasHAStateConditions without HA state conditions', () => {
const controller = new ConditionController();
expect(controller.hasHAStateConditions).toBeFalsy();
const manager = new ConditionsManager(createCardAPI());
expect(manager.hasHAStateConditions()).toBeFalsy();
});
it('should return hasHAStateConditions with HA state conditions', () => {
@@ -228,50 +216,55 @@ describe('ConditionController', () => {
matches: false,
addEventListener: vi.fn(),
} as unknown as MediaQueryList);
const controller = new ConditionController(createConfig(config));
expect(controller.hasHAStateConditions).toBeTruthy();
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig(config));
const manager = new ConditionsManager(api);
manager.setConditionsFromConfig();
expect(manager.hasHAStateConditions()).toBeTruthy();
});
it('should evaluate conditions with a view', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = { view: ['foo'] };
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ view: 'foo' });
expect(controller.evaluateCondition(condition)).toBeTruthy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ view: 'foo' });
expect(manager.evaluateCondition(condition)).toBeTruthy();
});
it('should evaluate conditions with fullscreen', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = { fullscreen: true };
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ fullscreen: true });
expect(controller.evaluateCondition(condition)).toBeTruthy();
controller.setState({ fullscreen: false });
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ fullscreen: true });
expect(manager.evaluateCondition(condition)).toBeTruthy();
manager.setState({ fullscreen: false });
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
it('should evaluate conditions with expand', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = { expand: true };
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ expand: true });
expect(controller.evaluateCondition(condition)).toBeTruthy();
controller.setState({ expand: false });
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ expand: true });
expect(manager.evaluateCondition(condition)).toBeTruthy();
manager.setState({ expand: false });
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
it('should evaluate conditions with camera', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = { camera: ['bar'] };
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ camera: 'bar' });
expect(controller.evaluateCondition(condition)).toBeTruthy();
controller.setState({ camera: 'will-not-match' });
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ camera: 'bar' });
expect(manager.evaluateCondition(condition)).toBeTruthy();
manager.setState({ camera: 'will-not-match' });
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
it('should evaluate conditions with ha state positive check', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = {
state: [
{
@@ -280,17 +273,17 @@ describe('ConditionController', () => {
},
],
};
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ state: { 'binary_sensor.foo': createStateEntity() } });
expect(controller.evaluateCondition(condition)).toBeTruthy();
controller.setState({
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ state: { 'binary_sensor.foo': createStateEntity() } });
expect(manager.evaluateCondition(condition)).toBeTruthy();
manager.setState({
state: { 'binary_sensor.foo': createStateEntity({ state: 'off' }) },
});
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
it('should evaluate conditions with ha state negative check', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = {
state: [
{
@@ -299,23 +292,23 @@ describe('ConditionController', () => {
},
],
};
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ state: { 'binary_sensor.foo': createStateEntity() } });
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ state: { 'binary_sensor.foo': createStateEntity() } });
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({
state: { 'binary_sensor.foo': createStateEntity({ state: 'off' }) },
});
expect(controller.evaluateCondition(condition)).toBeTruthy();
expect(manager.evaluateCondition(condition)).toBeTruthy();
});
it('should evaluate conditions with media_loaded', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = { media_loaded: true };
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ media_loaded: true });
expect(controller.evaluateCondition(condition)).toBeTruthy();
controller.setState({ media_loaded: false });
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ media_loaded: true });
expect(manager.evaluateCondition(condition)).toBeTruthy();
manager.setState({ media_loaded: false });
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
it('should evaluate conditions with media query', () => {
@@ -323,10 +316,10 @@ describe('ConditionController', () => {
.mockReturnValueOnce(<MediaQueryList>{ matches: true })
.mockReturnValueOnce(<MediaQueryList>{ matches: false });
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition = { media_query: 'whatever' };
expect(controller.evaluateCondition(condition)).toBeTruthy();
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeTruthy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
it('should trigger on changes to media query conditions', () => {
@@ -337,12 +330,14 @@ describe('ConditionController', () => {
addEventListener: addEventListener,
removeEventListener: removeEventListener,
} as unknown as MediaQueryList);
const controller = new ConditionController(createConfig(config));
expect(addEventListener).toHaveBeenCalledWith('change', expect.anything());
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig(config));
const callback = vi.fn();
controller.addStateListener(callback);
const manager = new ConditionsManager(api, callback);
manager.setConditionsFromConfig();
expect(addEventListener).toHaveBeenCalledWith('change', expect.anything());
// Call the media query callback and use it to pretend a match happened. The
// callback is the 0th mock innvocation and the 1st argument.
@@ -351,18 +346,18 @@ describe('ConditionController', () => {
// This should result in a callback to our state listener.
expect(callback).toBeCalled();
// Destroy the controller, which should remove the media query listener.
controller.destroy();
// Remove the conditions, which should remove the media query listener.
manager.removeConditions();
expect(removeEventListener).toBeCalled();
});
it('should evaluate conditions with display mode', () => {
const controller = new ConditionController();
const manager = new ConditionsManager(createCardAPI());
const condition: FrigateCardCondition = { display_mode: 'grid' };
expect(controller.evaluateCondition(condition)).toBeFalsy();
controller.setState({ displayMode: 'grid' });
expect(controller.evaluateCondition(condition)).toBeTruthy();
controller.setState({ displayMode: 'single' });
expect(controller.evaluateCondition(condition)).toBeFalsy();
expect(manager.evaluateCondition(condition)).toBeFalsy();
manager.setState({ displayMode: 'grid' });
expect(manager.evaluateCondition(condition)).toBeTruthy();
manager.setState({ displayMode: 'single' });
expect(manager.evaluateCondition(condition)).toBeFalsy();
});
});
tests/utils/card-controller/config-manager.test.ts
+304
View File
@@ -0,0 +1,304 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { ZodError } from 'zod';
import { frigateCardConfigSchema } from '../../../src/types';
import { getOverriddenConfig } from '../../../src/utils/card-controller/conditions-manager';
import { ConfigManager } from '../../../src/utils/card-controller/config-manager';
import { InitializationAspect } from '../../../src/utils/card-controller/initialization-manager';
import { createCardAPI, createConfig } from '../../test-utils';
vi.mock('../../../src/utils/card-controller/conditions-manager.js');
describe('ConfigManager', () => {
beforeEach(() => {
vi.restoreAllMocks();
});
describe('should handle error when', () => {
it('no input', () => {
const manager = new ConfigManager(createCardAPI());
expect(() => manager.setConfig()).toThrowError(/Invalid configuration/);
});
it('invalid configuration', () => {
const spy = vi.spyOn(frigateCardConfigSchema, 'safeParse').mockReturnValue({
success: false,
error: new ZodError([]),
});
const manager = new ConfigManager(createCardAPI());
expect(() => manager.setConfig({})).toThrowError(
'Invalid configuration: No location hint available (bad or missing type?)',
);
spy.mockRestore();
});
it('invalid configuration with hint', () => {
const manager = new ConfigManager(createCardAPI());
expect(() => manager.setConfig({})).toThrowError(
'Invalid configuration: [\n "cameras",\n "type"\n]',
);
});
it('upgradeable', () => {
const manager = new ConfigManager(createCardAPI());
expect(() =>
manager.setConfig({
cameras: [
{
frigate: {
label: 'foo',
},
},
],
}),
).toThrowError(
'An automated card configuration upgrade is ' +
'available, please visit the visual card editor. ' +
'Invalid configuration: [\n "type"\n]',
);
});
});
it('should have initial state', () => {
const manager = new ConfigManager(createCardAPI());
expect(manager.getConfig()).toBeNull();
expect(manager.getNonOverriddenConfig()).toBeNull();
expect(manager.getRawConfig()).toBeNull();
});
it('should successfully parse basic config', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
};
manager.setConfig(config);
expect(manager.hasConfig()).toBeTruthy()
expect(manager.getRawConfig()).toBe(config);
// Verify at least the camera is set.
expect(manager.getConfig()?.cameras[0].camera_entity).toBe('camera.office');
// Verify at least one default was set.
expect(manager.getConfig()?.menu.alignment).toBe('left');
// Verify appropriate API calls are made.
expect(api.getConditionsManager().setConditionsFromConfig).toBeCalled();
expect(api.getConditionsManager().setState).toBeCalledWith({
view: undefined,
displayMode: undefined,
camera: undefined,
});
expect(api.getMediaLoadedInfoManager().clear).toBeCalled();
expect(api.getViewManager().reset).toBeCalled();
expect(api.getMessageManager().reset).toBeCalled();
expect(api.getAutomationsManager().setAutomationsFromConfig).toBeCalled();
expect(api.getStyleManager().setPerformance).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should apply low performance defaults', () => {
const manager = new ConfigManager(createCardAPI());
const config = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
performance: { profile: 'low' },
};
manager.setConfig(config);
// Verify at least one low performance default.
expect(manager.getConfig()?.live.draggable).toBeFalsy();
});
it('should skip identical configs', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
};
manager.setConfig(config);
expect(api.getViewManager().reset).toBeCalled();
vi.mocked(api.getViewManager().reset).mockClear();
manager.setConfig(config);
expect(api.getViewManager().reset).not.toBeCalled();
});
it('should get card wide config', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
debug: {
logging: true,
},
performance: {
profile: 'low',
},
};
manager.setConfig(config);
expect(manager.getCardWideConfig()).toEqual({
debug: {
logging: true,
},
performance: {
features: {
animated_progress_indicator: false,
media_chunk_size: 10,
},
profile: 'low',
style: {
border_radius: false,
box_shadow: false,
},
},
});
});
it('should ignore overrides without a config', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
manager.computeOverrideConfig();
expect(manager.getConfig()).toBeNull();
expect(api.getStyleManager().setMinMaxHeight).not.toBeCalled();
});
it('should ignore overrides with same config', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
};
vi.mocked(getOverriddenConfig).mockReturnValue(config);
manager.setConfig(config);
expect(api.getStyleManager().setMinMaxHeight).toBeCalled();
vi.mocked(api.getStyleManager().setMinMaxHeight).mockClear();
manager.computeOverrideConfig();
expect(api.getStyleManager().setMinMaxHeight).not.toBeCalled();
});
it('should override', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config_1 = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
};
manager.setConfig(config_1);
vi.mocked(api.getStyleManager().setMinMaxHeight).mockClear();
const config_2 = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.kitchen' }],
};
vi.mocked(getOverriddenConfig).mockReturnValue(config_2);
manager.computeOverrideConfig();
expect(api.getStyleManager().setMinMaxHeight).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
expect(manager.getConfig()).not.toEqual(manager.getNonOverriddenConfig());
});
describe('should uninitialize on override', () => {
it('cameras', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config_1 = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
};
vi.mocked(getOverriddenConfig).mockReturnValue(createConfig(config_1));
manager.setConfig(config_1);
expect(api.getInitializationManager().uninitialize).not.toBeCalled();
const config_2 = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.kitchen' }],
};
vi.mocked(getOverriddenConfig).mockReturnValue(createConfig(config_2));
manager.computeOverrideConfig();
expect(api.getInitializationManager().uninitialize).toBeCalledWith(
InitializationAspect.CAMERAS,
);
});
it('cameras_global', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config_1 = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
};
vi.mocked(getOverriddenConfig).mockReturnValue(createConfig(config_1));
manager.setConfig(config_1);
expect(api.getInitializationManager().uninitialize).not.toBeCalled();
const config_2 = {
...config_1,
cameras_global: {
live_provider: 'jsmpeg'
}
};
vi.mocked(getOverriddenConfig).mockReturnValue(createConfig(config_2));
manager.computeOverrideConfig();
expect(api.getInitializationManager().uninitialize).toBeCalledWith(
InitializationAspect.CAMERAS,
);
});
it('live.microphone.always_connected', () => {
const api = createCardAPI();
const manager = new ConfigManager(api);
const config_1 = {
type: 'custom:frigate-card',
cameras: [{ camera_entity: 'camera.office' }],
live: {
microphone: {
always_connected: false
}
}
};
vi.mocked(getOverriddenConfig).mockReturnValue(createConfig(config_1));
manager.setConfig(config_1);
expect(api.getInitializationManager().uninitialize).not.toBeCalled();
const config_2 = {
...config_1,
live: {
microphone: {
always_connected: true
}
}
};
vi.mocked(getOverriddenConfig).mockReturnValue(createConfig(config_2));
manager.computeOverrideConfig();
expect(api.getInitializationManager().uninitialize).toBeCalledWith(
InitializationAspect.MICROPHONE_CONNECT,
);
});
});
});
tests/utils/card-controller/controller.test.ts
+276
View File
@@ -0,0 +1,276 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { CameraManager } from '../../../src/camera-manager/manager';
import { FrigateCardEditor } from '../../../src/editor';
import { ActionsManager } from '../../../src/utils/card-controller/actions-manager';
import { AutoUpdateManager } from '../../../src/utils/card-controller/auto-update-manager';
import { AutomationsManager } from '../../../src/utils/card-controller/automations-manager';
import { CameraURLManager } from '../../../src/utils/card-controller/camera-url-manager';
import {
CardElementManager,
CardHTMLElement,
} from '../../../src/utils/card-controller/card-element-manager';
import { ConditionsManager } from '../../../src/utils/card-controller/conditions-manager';
import { ConfigManager } from '../../../src/utils/card-controller/config-manager';
import { CardController } from '../../../src/utils/card-controller/controller';
import { DownloadManager } from '../../../src/utils/card-controller/download-manager';
import { ExpandManager } from '../../../src/utils/card-controller/expand-manager';
import { FullscreenManager } from '../../../src/utils/card-controller/fullscreen-manager';
import { HASSManager } from '../../../src/utils/card-controller/hass-manager';
import { InitializationManager } from '../../../src/utils/card-controller/initialization-manager';
import { InteractionManager } from '../../../src/utils/card-controller/interaction-manager';
import { MediaLoadedInfoManager } from '../../../src/utils/card-controller/media-info-manager';
import { MediaPlayerManager } from '../../../src/utils/card-controller/media-player-manager';
import { MessageManager } from '../../../src/utils/card-controller/message-manager';
import { MicrophoneManager } from '../../../src/utils/card-controller/microphone-manager';
import { QueryStringManager } from '../../../src/utils/card-controller/query-string-manager';
import { StyleManager } from '../../../src/utils/card-controller/style-manager';
import { TriggersManager } from '../../../src/utils/card-controller/triggers-manager';
import { ViewManager } from '../../../src/utils/card-controller/view-manager';
import { EntityRegistryManager } from '../../../src/utils/ha/entity-registry';
import { ResolvedMediaCache } from '../../../src/utils/ha/resolved-media';
vi.mock('../../../src/camera-manager/manager');
vi.mock('../../../src/utils/card-controller/actions-manager');
vi.mock('../../../src/utils/card-controller/auto-update-manager');
vi.mock('../../../src/utils/card-controller/automations-manager');
vi.mock('../../../src/utils/card-controller/camera-url-manager');
vi.mock('../../../src/utils/card-controller/card-element-manager');
vi.mock('../../../src/utils/card-controller/conditions-manager');
vi.mock('../../../src/utils/card-controller/config-manager');
vi.mock('../../../src/utils/card-controller/download-manager');
vi.mock('../../../src/utils/card-controller/expand-manager');
vi.mock('../../../src/utils/card-controller/fullscreen-manager');
vi.mock('../../../src/utils/card-controller/hass-manager');
vi.mock('../../../src/utils/card-controller/initialization-manager');
vi.mock('../../../src/utils/card-controller/interaction-manager');
vi.mock('../../../src/utils/card-controller/media-info-manager');
vi.mock('../../../src/utils/card-controller/media-player-manager');
vi.mock('../../../src/utils/card-controller/message-manager');
vi.mock('../../../src/utils/card-controller/microphone-manager');
vi.mock('../../../src/utils/card-controller/query-string-manager');
vi.mock('../../../src/utils/card-controller/style-manager');
vi.mock('../../../src/utils/card-controller/triggers-manager');
vi.mock('../../../src/utils/card-controller/view-manager');
vi.mock('../../../src/utils/ha/entity-registry');
vi.mock('../../../src/utils/ha/resolved-media');
const createCardElement = (): CardHTMLElement => {
const element = document.createElement('div') as unknown as CardHTMLElement;
element.addController = vi.fn();
return element;
};
const createController = (): CardController => {
return new CardController(createCardElement(), vi.fn(), vi.fn(), vi.fn());
};
// @vitest-environment jsdom
describe('CardController', () => {
beforeEach(() => {
vi.clearAllMocks();
});
it('should construct correctly', () => {
const element = createCardElement();
const scrollCallback = vi.fn();
const menuToggleCallback = vi.fn();
const conditionListener = vi.fn();
const manager = new CardController(
element,
scrollCallback,
menuToggleCallback,
conditionListener,
);
expect(ConditionsManager).toBeCalledWith(manager, conditionListener);
expect(CardElementManager).toBeCalledWith(
manager,
element,
scrollCallback,
menuToggleCallback,
);
});
describe('accessors', () => {
it('getActionsManager', () => {
expect(createController().getActionsManager()).toBe(
vi.mocked(ActionsManager).mock.instances[0],
);
});
it('getAutomationsManager', () => {
expect(createController().getAutomationsManager()).toBe(
vi.mocked(AutomationsManager).mock.instances[0],
);
});
it('getAutoUpdateManager', () => {
expect(createController().getAutoUpdateManager()).toBe(
vi.mocked(AutoUpdateManager).mock.instances[0],
);
});
it('getCameraManager', () => {
expect(createController().getCameraManager()).toBe(
vi.mocked(CameraManager).mock.instances[0],
);
});
it('getCameraURLManager', () => {
expect(createController().getCameraURLManager()).toBe(
vi.mocked(CameraURLManager).mock.instances[0],
);
});
it('getCardElementManager', () => {
expect(createController().getCardElementManager()).toBe(
vi.mocked(CardElementManager).mock.instances[0],
);
});
it('getConditionsManager', () => {
expect(createController().getConditionsManager()).toBe(
vi.mocked(ConditionsManager).mock.instances[0],
);
});
it('getConfigElement', async () => {
expect((await CardController.getConfigElement()) instanceof FrigateCardEditor);
});
it('getConfigManager', () => {
expect(createController().getConfigManager()).toBe(
vi.mocked(ConfigManager).mock.instances[0],
);
});
it('getDownloadManager', () => {
expect(createController().getDownloadManager()).toBe(
vi.mocked(DownloadManager).mock.instances[0],
);
});
it('getEntityRegistryManager', () => {
expect(createController().getEntityRegistryManager()).toBe(
vi.mocked(EntityRegistryManager).mock.instances[0],
);
});
it('getExpandManager', () => {
expect(createController().getExpandManager()).toBe(
vi.mocked(ExpandManager).mock.instances[0],
);
});
it('getFullscreenManager', () => {
expect(createController().getFullscreenManager()).toBe(
vi.mocked(FullscreenManager).mock.instances[0],
);
});
it('getHASSManager', () => {
expect(createController().getHASSManager()).toBe(
vi.mocked(HASSManager).mock.instances[0],
);
});
it('getInitializationManager', () => {
expect(createController().getInitializationManager()).toBe(
vi.mocked(InitializationManager).mock.instances[0],
);
});
it('getInteractionManager', () => {
expect(createController().getInteractionManager()).toBe(
vi.mocked(InteractionManager).mock.instances[0],
);
});
it('getMediaLoadedInfoManager', () => {
expect(createController().getMediaLoadedInfoManager()).toBe(
vi.mocked(MediaLoadedInfoManager).mock.instances[0],
);
});
it('getMediaPlayerManager', () => {
expect(createController().getMediaPlayerManager()).toBe(
vi.mocked(MediaPlayerManager).mock.instances[0],
);
});
it('getMessageManager', () => {
expect(createController().getMessageManager()).toBe(
vi.mocked(MessageManager).mock.instances[0],
);
});
it('getMicrophoneManager', () => {
expect(createController().getMicrophoneManager()).toBe(
vi.mocked(MicrophoneManager).mock.instances[0],
);
});
it('getResolvedMediaCache', () => {
expect(createController().getResolvedMediaCache()).toBe(
vi.mocked(ResolvedMediaCache).mock.instances[0],
);
});
describe('getStubConfig', () => {
it('with camera entities', () => {
expect(
CardController.getStubConfig(['camera.office', 'binary_sensor.motion']),
).toEqual({
cameras: [{ camera_entity: 'camera.office' }],
});
});
it('without camera entities', () => {
expect(CardController.getStubConfig(['binary_sensor.motion'])).toEqual({
cameras: [{ camera_entity: 'camera.demo' }],
});
});
});
it('getQueryStringManager', () => {
expect(createController().getQueryStringManager()).toBe(
vi.mocked(QueryStringManager).mock.instances[0],
);
});
it('getStyleManager', () => {
expect(createController().getStyleManager()).toBe(
vi.mocked(StyleManager).mock.instances[0],
);
});
it('getTriggersManager', () => {
expect(createController().getTriggersManager()).toBe(
vi.mocked(TriggersManager).mock.instances[0],
);
});
it('getViewManager', () => {
expect(createController().getViewManager()).toBe(
vi.mocked(ViewManager).mock.instances[0],
);
});
});
describe('handlers', () => {
it('hostConnected', () => {
createController().hostConnected();
expect(
vi.mocked(CardElementManager).mock.instances[0].elementConnected,
).toBeCalled();
});
it('hostDisconnected', () => {
createController().hostDisconnected();
expect(
vi.mocked(CardElementManager).mock.instances[0].elementDisconnected,
).toBeCalled();
});
});
});
tests/utils/card-controller/download-manager.test.ts
+94
View File
@@ -0,0 +1,94 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { mock } from 'vitest-mock-extended';
import { FrigateCardMediaPlayer } from '../../../src/types';
import { DownloadManager } from '../../../src/utils/card-controller/download-manager';
import { downloadMedia, downloadURL } from '../../../src/utils/download.js';
import {
createCardAPI,
createHASS,
createMediaLoadedInfo,
createViewWithMedia,
} from '../../test-utils';
vi.mock('../../../src/utils/download.js');
describe('DownloadManager.downloadViewerMedia', () => {
beforeEach(() => {
vi.resetAllMocks();
});
it('should download', async () => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(createViewWithMedia());
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new DownloadManager(api);
expect(await manager.downloadViewerMedia()).toBeTruthy();
expect(downloadMedia).toBeCalledWith(
api.getHASSManager().getHASS(),
api.getCameraManager(),
api.getViewManager().getView()?.queryResults?.getResult(0),
);
});
it('should not download due to exception thrown', async () => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(createViewWithMedia());
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new DownloadManager(api);
const error = new Error();
vi.mocked(downloadMedia).mockRejectedValue(error);
expect(await manager.downloadViewerMedia()).toBeFalsy();
expect(api.getMessageManager().setErrorIfHigherPriority).toBeCalledWith(error);
});
it('should not download without hass', async () => {
const api = createCardAPI();
vi.mocked(api.getViewManager().getView).mockReturnValue(createViewWithMedia());
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(null);
const manager = new DownloadManager(api);
expect(await manager.downloadViewerMedia()).toBeFalsy();
expect(downloadMedia).not.toBeCalled();
});
});
describe('DownloadManager.downloadScreenshot', () => {
beforeEach(() => {
vi.clearAllMocks();
});
it('with url', async () => {
const api = createCardAPI();
const player = mock<FrigateCardMediaPlayer>();
player.getScreenshotURL.mockResolvedValue('http://screenshot');
vi.mocked(api.getMediaLoadedInfoManager().get).mockReturnValue(
createMediaLoadedInfo({
player: player,
}),
);
const manager = new DownloadManager(api);
await manager.downloadScreenshot();
expect(downloadURL).toBeCalledWith('http://screenshot', 'screenshot.jpg');
});
it('without url', async () => {
const api = createCardAPI();
const player = mock<FrigateCardMediaPlayer>();
player.getScreenshotURL.mockResolvedValue(null);
vi.mocked(api.getMediaLoadedInfoManager().get).mockReturnValue(
createMediaLoadedInfo({
player: player,
}),
);
const manager = new DownloadManager(api);
await manager.downloadScreenshot();
expect(downloadURL).not.toBeCalled();
});
});
tests/utils/card-controller/expand-manager.test.ts
+46
View File
@@ -0,0 +1,46 @@
import { describe, expect, it, vi } from 'vitest';
import { ExpandManager } from '../../../src/utils/card-controller/expand-manager';
import { createCardAPI } from '../../test-utils';
describe('ExpandManager', () => {
it('should construct', () => {
const api = createCardAPI();
const manager = new ExpandManager(api);
expect(manager.isExpanded()).toBeFalsy();
});
it('should set expanded', () => {
const api = createCardAPI();
vi.mocked(api.getFullscreenManager().isInFullscreen).mockReturnValue(true);
const manager = new ExpandManager(api);
manager.setExpanded(true);
expect(manager.isExpanded()).toBeTruthy();
expect(api.getFullscreenManager().stopFullscreen).toBeCalled();
expect(api.getConditionsManager().setState).toBeCalledWith({ expand: true });
expect(api.getCardElementManager().update).toBeCalled();
});
it('should not exit fullscreen when not in fullscreen', () => {
const api = createCardAPI();
vi.mocked(api.getFullscreenManager().isInFullscreen).mockReturnValue(false);
const manager = new ExpandManager(api);
manager.setExpanded(true);
expect(api.getFullscreenManager().stopFullscreen).not.toBeCalled();
});
it('should toggle expanded', () => {
const api = createCardAPI();
vi.mocked(api.getFullscreenManager().isInFullscreen).mockReturnValue(false);
const manager = new ExpandManager(api);
manager.toggleExpanded();
expect(manager.isExpanded()).toBeTruthy();
manager.toggleExpanded();
expect(manager.isExpanded()).toBeFalsy();
});
});
tests/utils/card-controller/fullscreen-manager.test.ts
+129
View File
@@ -0,0 +1,129 @@
import screenfull from 'screenfull';
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { FullscreenManager } from '../../../src/utils/card-controller/fullscreen-manager';
import { createCardAPI } from '../../test-utils';
vi.mock('screenfull', () => ({
default: {
exit: vi.fn(),
toggle: vi.fn(),
off: vi.fn(),
on: vi.fn(),
},
}));
const setScreenfulEnabled = (enabled: boolean): void => {
Object.defineProperty(screenfull, 'isEnabled', { value: enabled, writable: true });
};
const setScreenfulFullscreen = (fullscreen: boolean): void => {
Object.defineProperty(screenfull, 'isFullscreen', {
value: fullscreen,
writable: true,
});
};
// @vitest-environment jsdom
describe('FullscreenManager', () => {
beforeEach(() => {
vi.clearAllMocks();
});
it('should correctly determine whether in fullscreen', () => {
const manager = new FullscreenManager(createCardAPI());
setScreenfulEnabled(true);
setScreenfulFullscreen(true);
expect(manager.isInFullscreen()).toBeTruthy();
setScreenfulFullscreen(false);
expect(manager.isInFullscreen()).toBeFalsy();
});
it('should toggle fullscreen', () => {
const toggle = vi.mocked(screenfull.toggle);
const element = document.createElement('div')
const api = createCardAPI();
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(
element,
);
const manager = new FullscreenManager(api);
manager.toggleFullscreen();
expect(toggle).toBeCalledWith(element);
});
it('should stop fullscreen', () => {
const manager = new FullscreenManager(createCardAPI());
const exit = vi.mocked(screenfull.exit);
manager.stopFullscreen();
expect(exit).toBeCalled();
});
it('should disconnect', () => {
const manager = new FullscreenManager(createCardAPI());
const off = vi.mocked(screenfull.off);
setScreenfulEnabled(true);
manager.disconnect();
expect(off).toBeCalledWith('change', expect.anything());
});
it('should not disconnect when screenfull disabled', () => {
const manager = new FullscreenManager(createCardAPI());
const off = vi.mocked(screenfull.off);
setScreenfulEnabled(false);
manager.disconnect();
expect(off).not.toBeCalled();
});
it('should connect', () => {
const manager = new FullscreenManager(createCardAPI());
const on = vi.mocked(screenfull.on);
setScreenfulEnabled(true);
manager.connect();
expect(on).toBeCalledWith('change', expect.anything());
});
it('should not connect when screenfull disabled', () => {
const manager = new FullscreenManager(createCardAPI());
const on = vi.mocked(screenfull.on);
setScreenfulEnabled(false);
manager.connect();
expect(on).not.toBeCalled();
});
it('should make correct api calls on fullscreen change', () => {
const api = createCardAPI();
const manager = new FullscreenManager(api);
const on = vi.mocked(screenfull.on);
setScreenfulEnabled(true);
setScreenfulFullscreen(true);
manager.connect();
expect(on).toBeCalled();
on.mock.calls[0][1](new Event('fullscreen'));
expect(api.getExpandManager().setExpanded).toBeCalledWith(false);
expect(api.getConditionsManager().setState).toBeCalledWith({
fullscreen: true,
});
expect(api.getCardElementManager().update).toBeCalled();
});
});
tests/utils/card-controller/hass-manager.test.ts
+279
View File
@@ -0,0 +1,279 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { HASSManager } from '../../../src/utils/card-controller/hass-manager';
import { CardHASSAPI } from '../../../src/utils/card-controller/types';
import {
createCameraConfig,
createCameraManager,
createCardAPI,
createConfig,
createHASS,
createStateEntity,
createView,
} from '../../test-utils';
vi.mock('../../../src/camera-manager/manager.js');
const createAPIWithoutMediaPlayers = (): CardHASSAPI => {
const api = createCardAPI();
vi.mocked(api.getMediaPlayerManager().getMediaPlayers).mockReturnValue([]);
return api;
};
describe('HASSManager', () => {
beforeEach(() => {
vi.resetAllMocks();
});
it('should have null hass on construction', () => {
const manager = new HASSManager(createCardAPI());
expect(manager.getHASS()).toBeNull();
});
it('should set light or dark mode upon setting hass', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
manager.setHASS(createHASS());
expect(api.getStyleManager().setLightOrDarkMode).toBeCalled();
});
describe('should set condition manager state', () => {
it('positively', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
vi.mocked(api.getConditionsManager().hasHAStateConditions).mockReturnValue(true);
const states = { 'switch.foo': createStateEntity() };
const hass = createHASS(states);
manager.setHASS(hass);
expect(api.getConditionsManager().setState).toBeCalledWith(
expect.objectContaining({
state: states,
}),
);
});
it('negatively', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
vi.mocked(api.getConditionsManager().hasHAStateConditions).mockReturnValue(false);
manager.setHASS(createHASS());
expect(api.getConditionsManager().setState).not.toBeCalled();
});
});
it('should update triggered cameras', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
const originalHASS = createHASS();
manager.setHASS(originalHASS);
expect(api.getTriggersManager().updateTriggeredCameras).toBeCalledWith(null);
manager.setHASS(createHASS());
expect(api.getTriggersManager().updateTriggeredCameras).toBeCalledWith(originalHASS);
});
describe('should handle connection state change when', () => {
it('initially disconnected', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
const disconnectedHASS = createHASS();
disconnectedHASS.connected = false;
manager.setHASS(disconnectedHASS);
expect(api.getMessageManager().setMessageIfHigherPriority).toBeCalledWith(
expect.objectContaining({
message: 'Reconnecting',
icon: 'mdi:lan-disconnect',
type: 'connection',
dotdotdot: true,
}),
);
});
it('disconnected', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
manager.setHASS(createHASS());
const disconnectedHASS = createHASS();
disconnectedHASS.connected = false;
manager.setHASS(disconnectedHASS);
expect(api.getMessageManager().setMessageIfHigherPriority).toBeCalledWith(
expect.objectContaining({
message: 'Reconnecting',
icon: 'mdi:lan-disconnect',
type: 'connection',
dotdotdot: true,
}),
);
});
it('reconnected', () => {
const api = createAPIWithoutMediaPlayers();
const manager = new HASSManager(api);
const disconnectedHASS = createHASS();
disconnectedHASS.connected = false;
manager.setHASS(disconnectedHASS);
const reconnectedHASS = createHASS();
manager.setHASS(reconnectedHASS);
expect(api.getViewManager().setViewDefault).toBeCalled();
});
});
describe('should set default view when', () => {
it('selected camera trigger entity changes', () => {
const cameraManager = createCameraManager({
configs: new Map([
[
'camera.foo',
createCameraConfig({
triggers: {
entities: ['binary_sensor.motion'],
},
}),
],
]),
});
const api = createAPIWithoutMediaPlayers();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
camera: 'camera.foo',
}),
);
const manager = new HASSManager(api);
const hass = createHASS({
'binary_sensor.motion': createStateEntity(),
});
manager.setHASS(hass);
expect(api.getViewManager().setViewDefault).toBeCalled();
});
it('selected camera is unknown', () => {
const cameraManager = createCameraManager({
configs: new Map([
[
'camera.foo',
createCameraConfig({
triggers: {
entities: ['binary_sensor.motion'],
},
}),
],
]),
});
const api = createAPIWithoutMediaPlayers();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
camera: 'camera.UNKNOWN',
}),
);
const manager = new HASSManager(api);
const hass = createHASS({
'binary_sensor.motion': createStateEntity(),
});
manager.setHASS(hass);
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
it('view.update_entities changes', () => {
const api = createAPIWithoutMediaPlayers();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
update_entities: ['sensor.force_default_view'],
},
}),
);
const manager = new HASSManager(api);
const hass = createHASS({
'sensor.force_default_view': createStateEntity(),
});
manager.setHASS(hass);
expect(api.getViewManager().setViewDefault).toBeCalled();
});
});
describe('should update card when', () => {
it('render entity changes', () => {
const api = createAPIWithoutMediaPlayers();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
render_entities: ['sensor.force_update'],
},
}),
);
const manager = new HASSManager(api);
const hass = createHASS({
'sensor.force_update': createStateEntity(),
});
manager.setHASS(hass);
expect(api.getCardElementManager().update).toBeCalled();
});
it('media player entity changes', () => {
const api = createCardAPI();
vi.mocked(api.getMediaPlayerManager().getMediaPlayers).mockReturnValue([
'media_player.foo',
]);
const manager = new HASSManager(api);
const hass = createHASS({
'media_player.foo': createStateEntity(),
});
manager.setHASS(hass);
expect(api.getCardElementManager().update).toBeCalled();
});
});
it('set view default is not called when there is card interaction', () => {
const api = createAPIWithoutMediaPlayers();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
update_entities: ['sensor.force_default_view'],
},
}),
);
vi.mocked(api.getInteractionManager().hasInteraction).mockReturnValue(true);
const manager = new HASSManager(api);
const hass = createHASS({
'sensor.force_default_view': createStateEntity(),
});
manager.setHASS(hass);
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
});
tests/utils/card-controller/initialization-manager.test.ts
+203
View File
@@ -0,0 +1,203 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { mock } from 'vitest-mock-extended';
import { loadLanguages } from '../../../src/localize/localize';
import {
InitializationAspect,
InitializationManager,
} from '../../../src/utils/card-controller/initialization-manager';
import { sideLoadHomeAssistantElements } from '../../../src/utils/ha';
import { Initializer } from '../../../src/utils/initializer/initializer';
import { createCardAPI, createConfig, createHASS } from '../../test-utils';
vi.mock('../../../src/localize/localize.js');
vi.mock('../../../src/utils/ha/index.js');
// @vitest-environment jsdom
describe('InitializationManager', () => {
beforeEach(async () => {
vi.resetAllMocks();
});
it('should not be initialized', () => {
const manager = new InitializationManager(createCardAPI());
expect(manager.isInitializedMandatory()).toBeFalsy();
});
describe('should initialize mandatory', () => {
it('without hass', async () => {
const manager = new InitializationManager(createCardAPI());
expect(await manager.initializeMandatory()).toBeFalsy();
});
it('without config', async () => {
const api = createCardAPI();
const manager = new InitializationManager(api);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
expect(await manager.initializeMandatory()).toBeFalsy();
});
it('successfully', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().hasConfig).mockReturnValue(true);
vi.mocked(api.getMessageManager().hasMessage).mockReturnValue(false);
vi.mocked(api.getQueryStringManager().hasViewRelatedActions).mockReturnValue(false);
const manager = new InitializationManager(api);
expect(await manager.initializeMandatory()).toBeTruthy();
expect(loadLanguages).toBeCalled();
expect(sideLoadHomeAssistantElements).toBeCalled();
expect(api.getCameraManager().initializeCamerasFromConfig).toBeCalled();
expect(api.getViewManager().setViewDefault).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
});
it('successfully with querystring view', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().hasConfig).mockReturnValue(true);
vi.mocked(api.getMessageManager().hasMessage).mockReturnValue(false);
vi.mocked(api.getQueryStringManager().hasViewRelatedActions).mockReturnValue(true);
const manager = new InitializationManager(api);
expect(await manager.initializeMandatory()).toBeTruthy();
expect(api.getQueryStringManager().executeViewRelated).toBeCalled();
});
it('with message set during initialization', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().hasConfig).mockReturnValue(true);
vi.mocked(api.getMessageManager().hasMessage).mockReturnValue(true);
vi.mocked(api.getQueryStringManager().hasViewRelatedActions).mockReturnValue(false);
const manager = new InitializationManager(api);
expect(await manager.initializeMandatory()).toBeTruthy();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
it('with languages and side load elements in progress', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const initializer = mock<Initializer>();
const manager = new InitializationManager(api, initializer);
initializer.initializeMultipleIfNecessary.mockResolvedValue(false);
expect(await manager.initializeMandatory()).toBeFalsy();
});
it('with cameras in progress', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().hasConfig).mockReturnValue(true);
const initializer = mock<Initializer>();
const manager = new InitializationManager(api, initializer);
initializer.initializeMultipleIfNecessary.mockResolvedValue(true);
initializer.initializeIfNecessary.mockResolvedValue(false);
expect(await manager.initializeMandatory()).toBeFalsy();
});
});
describe('should initialize background', () => {
it('without hass and config', async () => {
const manager = new InitializationManager(createCardAPI());
expect(await manager.initializeBackgroundIfNecessary()).toBeFalsy();
});
it('successfully with minimal initializers', async () => {
const api = createCardAPI();
const manager = new InitializationManager(api);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
menu: {
buttons: {
media_player: {
enabled: false,
},
},
},
live: {
microphone: {
always_connected: false,
},
},
}),
);
expect(await manager.initializeBackgroundIfNecessary()).toBeTruthy();
expect(api.getMediaPlayerManager().initialize).not.toBeCalled();
expect(api.getMicrophoneManager().connect).not.toBeCalled();
expect(api.getCardElementManager().update).not.toBeCalled();
});
it('successfully with all inititalizers', async () => {
const api = createCardAPI();
const manager = new InitializationManager(api);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
menu: {
buttons: {
media_player: {
enabled: true,
},
},
},
live: {
microphone: {
always_connected: true,
},
},
}),
);
expect(await manager.initializeBackgroundIfNecessary()).toBeTruthy();
expect(api.getMediaPlayerManager().initialize).toBeCalled();
expect(api.getMicrophoneManager().connect).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
});
it('with media player and microphone connect in progress', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
menu: {
buttons: {
media_player: {
enabled: true,
},
},
},
live: {
microphone: {
always_connected: true,
},
},
}),
);
const initializer = mock<Initializer>();
const manager = new InitializationManager(api, initializer);
initializer.initializeMultipleIfNecessary.mockResolvedValue(false);
expect(await manager.initializeBackgroundIfNecessary()).toBeFalsy();
});
});
it('should uninitialize', () => {
const initializer = mock<Initializer>();
const manager = new InitializationManager(createCardAPI(), initializer);
manager.uninitialize(InitializationAspect.CAMERAS);
expect(initializer.uninitialize).toBeCalledWith(InitializationAspect.CAMERAS);
});
});
tests/utils/card-controller/interaction-manager.test.ts
+85
View File
@@ -0,0 +1,85 @@
import add from 'date-fns/add';
import { afterEach, describe, expect, it, vi } from 'vitest';
import { InteractionManager } from '../../../src/utils/card-controller/interaction-manager';
import { createCardAPI, createConfig } from '../../test-utils';
vi.mock('lodash-es/throttle', () => ({
default: vi.fn((fn) => fn),
}));
// @vitest-environment jsdom
describe('InteractionManager', () => {
const start = new Date('2023-09-24T20:20:00');
afterEach(() => {
vi.useRealTimers();
});
it('should take action when interaction is reported', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
timeout_seconds: 10,
},
}),
);
const manager = new InteractionManager(api);
vi.useFakeTimers();
vi.setSystemTime(start);
manager.reportInteraction();
expect(api.getTriggersManager().untrigger).toBeCalled();
expect(manager.hasInteraction()).toBeTruthy();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
vi.mocked(api.getTriggersManager().isTriggered).mockReturnValue(false);
vi.setSystemTime(add(start, { seconds: 10 }));
vi.runOnlyPendingTimers();
expect(api.getViewManager().setViewDefault).toBeCalled();
});
it('should not take action when triggered', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
timeout_seconds: 10,
},
}),
);
const manager = new InteractionManager(api);
vi.useFakeTimers();
vi.setSystemTime(start);
manager.reportInteraction();
vi.mocked(api.getTriggersManager().isTriggered).mockReturnValue(true);
vi.setSystemTime(add(start, { seconds: 10 }));
vi.runOnlyPendingTimers();
// First call is blocked by triggers (above), so interaction will report
// true but the default view will not have been set.
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
it('should not take action when not configured', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
timeout_seconds: 0,
},
}),
);
const manager = new InteractionManager(api);
manager.reportInteraction();
// First call is blocked by triggers (above), so interaction will report
// true but the default view will not have been set.
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
});
tests/utils/card-controller/media-info-manager.test.ts
+51
View File
@@ -0,0 +1,51 @@
import { describe, expect, it } from 'vitest';
import { MediaLoadedInfoManager } from '../../../src/utils/card-controller/media-info-manager';
import { createCardAPI, createMediaLoadedInfo } from '../../test-utils.js';
describe('MediaLoadedInfoManager', () => {
it('should set', () => {
const api = createCardAPI();
const manager = new MediaLoadedInfoManager(api);
const mediaInfo = createMediaLoadedInfo();
manager.set(mediaInfo);
expect(manager.has()).toBeTruthy();
expect(manager.get()).toBe(mediaInfo);
expect(api.getConditionsManager().setState).toBeCalledWith(
expect.objectContaining({ media_loaded: true }),
);
expect(api.getStyleManager().setExpandedMode).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should not set invalid media info', () => {
const api = createCardAPI();
const manager = new MediaLoadedInfoManager(api);
const mediaInfo = createMediaLoadedInfo({ width: 0, height: 0 });
manager.set(mediaInfo);
expect(manager.has()).toBeFalsy();
expect(manager.get()).toBeNull();
expect(api.getConditionsManager().setState).not.toBeCalled();
});
it('should get last known', () => {
const api = createCardAPI();
const manager = new MediaLoadedInfoManager(api);
const mediaInfo = createMediaLoadedInfo();
manager.set(mediaInfo);
expect(manager.has()).toBeTruthy();
manager.clear();
expect(manager.has()).toBeFalsy();
expect(manager.getLastKnown()).toBe(mediaInfo);
expect(api.getConditionsManager().setState).toBeCalledWith(
expect.objectContaining({ media_loaded: false }),
);
});
});
tests/utils/card-controller/media-player-manager.test.ts
+278
View File
@@ -0,0 +1,278 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import {
TestViewMedia,
createCameraConfig,
createCameraManager,
createCardAPI,
createHASS,
createRegistryEntity,
createStateEntity,
} from '../../test-utils';
import { MediaPlayerManager } from '../../../src/utils/card-controller/media-player-manager';
import { ExtendedHomeAssistant } from '../../../src/types';
import { MEDIA_PLAYER_SUPPORT_BROWSE_MEDIA } from '../../../src/const';
import { EntityRegistryManager } from '../../../src/utils/ha/entity-registry';
import { mock } from 'vitest-mock-extended';
vi.mock('../../../src/camera-manager/manager.js');
const createHASSWithMediaPlayers = (): ExtendedHomeAssistant => {
const attributesSupported = {
supported_features: MEDIA_PLAYER_SUPPORT_BROWSE_MEDIA,
};
const attributesUnsupported = {
supported_features: 0,
};
return createHASS({
'media_player.ok1': createStateEntity({
entity_id: 'media_player.ok1',
state: 'on',
attributes: attributesSupported,
}),
'media_player.ok2': createStateEntity({
entity_id: 'media_player.ok2',
state: 'on',
attributes: attributesSupported,
}),
'media_player.ok3': createStateEntity({
entity_id: 'media_player.ok3',
state: 'on',
attributes: attributesSupported,
}),
'media_player.unavailable': createStateEntity({
entity_id: 'media_player.sitting_room',
state: 'unavailable',
attributes: attributesSupported,
}),
'media_player.unsupported': createStateEntity({
entity_id: 'media_player.sitting_room',
state: 'on',
attributes: attributesUnsupported,
}),
'switch.unrelated': createStateEntity({
entity_id: 'switch.unrelated',
state: 'on',
}),
});
};
describe('MediaPlayerManager', () => {
beforeEach(() => {
vi.restoreAllMocks();
});
describe('should initialize', () => {
it('correctly', async () => {
const entityRegistryManager = mock<EntityRegistryManager>();
entityRegistryManager.getEntities.mockResolvedValue(
new Map([
['media_player.ok1', createRegistryEntity({ hidden_by: '' })],
['media_player.ok2', createRegistryEntity({ hidden_by: 'user' })],
]),
);
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(
createHASSWithMediaPlayers(),
);
vi.mocked(api.getEntityRegistryManager).mockReturnValue(entityRegistryManager);
const manager = new MediaPlayerManager(api);
await manager.initialize();
expect(manager.getMediaPlayers()).toEqual([
'media_player.ok1',
'media_player.ok3',
]);
expect(manager.hasMediaPlayers()).toBeTruthy();
});
it('without hass', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(null);
const manager = new MediaPlayerManager(api);
await manager.initialize();
expect(manager.getMediaPlayers()).toEqual([]);
expect(manager.hasMediaPlayers()).toBeFalsy();
});
it('even if entity registry call fails', async () => {
const spy = vi.spyOn(global.console, 'warn').mockImplementation(() => true);
const entityRegistryManager = mock<EntityRegistryManager>();
entityRegistryManager.getEntities.mockRejectedValue(new Error('message'));
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(
createHASSWithMediaPlayers(),
);
vi.mocked(api.getEntityRegistryManager).mockReturnValue(entityRegistryManager);
const manager = new MediaPlayerManager(api);
await manager.initialize();
expect(manager.getMediaPlayers()).toEqual([
'media_player.ok1',
'media_player.ok2',
'media_player.ok3',
]);
expect(manager.hasMediaPlayers()).toBeTruthy();
expect(spy).toBeCalled();
});
});
it('should stop', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new MediaPlayerManager(api);
await manager.stop('media_player.foo');
expect(api.getHASSManager().getHASS()?.callService).toBeCalledWith(
'media_player',
'media_stop',
{
entity_id: 'media_player.foo',
},
);
});
describe('should play', () => {
describe('live', () => {
it('successfully', async () => {
const api = createCardAPI();
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getCameraConfig).mockReturnValue(
createCameraConfig({
camera_entity: 'camera.foo',
}),
);
vi.mocked(cameraManager.getCameraMetadata).mockReturnValue({
title: 'camera title',
icon: 'icon',
});
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const hass = createHASS({
'camera.foo': createStateEntity({
attributes: {
entity_picture: 'http://thumbnail',
},
}),
});
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(hass);
const manager = new MediaPlayerManager(api);
await manager.playLive('media_player.foo', 'camera');
expect(api.getHASSManager().getHASS()?.callService).toBeCalledWith(
'media_player',
'play_media',
{
entity_id: 'media_player.foo',
media_content_id: 'media-source://camera/camera.foo',
media_content_type: 'application/vnd.apple.mpegurl',
extra: {
title: 'camera title',
thumb: 'http://thumbnail',
},
},
);
});
it('without camera_entity', async () => {
const api = createCardAPI();
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getCameraConfig).mockReturnValue(
createCameraConfig({}),
);
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new MediaPlayerManager(api);
await manager.playLive('media_player.foo', 'camera');
expect(api.getHASSManager().getHASS()?.callService).not.toBeCalled();
});
it('without title and thumbnail', async () => {
const api = createCardAPI();
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getCameraConfig).mockReturnValue(
createCameraConfig({
camera_entity: 'camera.foo',
}),
);
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new MediaPlayerManager(api);
await manager.playLive('media_player.foo', 'camera');
expect(api.getHASSManager().getHASS()?.callService).toBeCalledWith(
'media_player',
'play_media',
{
entity_id: 'media_player.foo',
media_content_id: 'media-source://camera/camera.foo',
media_content_type: 'application/vnd.apple.mpegurl',
extra: {},
},
);
});
});
describe('media', () => {
describe('successfully with', () => {
it.each([
['clip' as const, 'video' as const],
['snapshot' as const, 'image' as const],
])(
'%s',
async (mediaType: 'clip' | 'snapshot', contentType: 'video' | 'image') => {
const media = new TestViewMedia({
title: 'media title',
thumbnail: 'http://thumbnail',
contentID: 'media-source://contentid',
mediaType: mediaType,
});
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new MediaPlayerManager(api);
await manager.playMedia('media_player.foo', media);
expect(api.getHASSManager().getHASS()?.callService).toBeCalledWith(
'media_player',
'play_media',
{
entity_id: 'media_player.foo',
media_content_id: 'media-source://contentid',
media_content_type: contentType,
extra: {
title: 'media title',
thumb: 'http://thumbnail',
},
},
);
},
);
});
it('without hass', async () => {
const api = createCardAPI();
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(null);
const manager = new MediaPlayerManager(api);
const media = new TestViewMedia();
await manager.playMedia('media_player.foo', media);
// No actual test can be performed here as nothing observable happens.
// This test serves only as code-coverage long-tail.
});
});
});
});
tests/utils/card-controller/message-manager.test.ts
+141
View File
@@ -0,0 +1,141 @@
import { afterAll, describe, expect, it, vi } from 'vitest';
import { FrigateCardError, Message } from '../../../src/types';
import { MessageManager } from '../../../src/utils/card-controller/message-manager';
import { createCardAPI } from '../../test-utils';
const createMessage = (options?: Partial<Message>): Message => {
return {
message: options?.message ?? 'message',
type: options?.type ?? 'info',
...(!!options?.icon && { icon: options.icon }),
...(!!options?.context && { context: options.context }),
...(!!options?.dotdotdot && { dotdotdot: options.dotdotdot }),
};
};
describe('MessageManager', () => {
afterAll(() => {
vi.restoreAllMocks();
});
it('should construct', () => {
const manager = new MessageManager(createCardAPI());
expect(manager.hasMessage()).toBeFalsy();
expect(manager.getMessage()).toBeNull();
expect(manager.hasErrorMessage()).toBeFalsy();
});
it('should set info message', () => {
const api = createCardAPI();
const manager = new MessageManager(api);
const message = createMessage();
manager.setMessageIfHigherPriority(message);
expect(manager.hasMessage()).toBeTruthy();
expect(manager.getMessage()).toBe(message);
expect(manager.hasErrorMessage()).toBeFalsy();
expect(api.getMediaLoadedInfoManager().clear).toBeCalled();
expect(api.getCardElementManager().scrollReset).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should set error message', () => {
const api = createCardAPI();
const manager = new MessageManager(api);
const message = createMessage({ type: 'error' });
manager.setMessageIfHigherPriority(message);
expect(manager.hasMessage()).toBeTruthy();
expect(manager.getMessage()).toBe(message);
expect(manager.hasErrorMessage()).toBeTruthy();
expect(api.getMediaLoadedInfoManager().clear).toBeCalled();
expect(api.getCardElementManager().scrollReset).toBeCalled();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should reset message', () => {
const api = createCardAPI();
const manager = new MessageManager(api);
manager.reset();
expect(manager.hasMessage()).toBeFalsy();
const message = createMessage({ type: 'error' });
manager.setMessageIfHigherPriority(message);
expect(manager.hasMessage()).toBeTruthy();
vi.mocked(api.getCardElementManager().update).mockClear();
manager.reset();
expect(manager.hasMessage()).toBeFalsy();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should respect priority', () => {
const api = createCardAPI();
const manager = new MessageManager(api);
manager.reset();
expect(manager.hasMessage()).toBeFalsy();
const errorMessage = createMessage({ type: 'error' });
manager.setMessageIfHigherPriority(errorMessage);
const infoMessage = createMessage({ type: 'info' });
manager.setMessageIfHigherPriority(infoMessage);
expect(manager.getMessage()).toBe(errorMessage);
const connectionMessage = createMessage({ type: 'connection' });
manager.setMessageIfHigherPriority(connectionMessage);
expect(manager.getMessage()).toBe(connectionMessage);
});
it('should set FrigateCardError object', () => {
const consoleSpy = vi.spyOn(global.console, 'warn').mockReturnValue(undefined);
const api = createCardAPI();
const manager = new MessageManager(api);
const context = { foo: 'bar' };
manager.setErrorIfHigherPriority(
new FrigateCardError('frigate card message', context),
);
expect(manager.hasMessage()).toBeTruthy();
expect(manager.getMessage()).toEqual({
message: 'frigate card message',
type: 'error',
context: context,
});
expect(consoleSpy).toBeCalled();
});
it('should set Error object', () => {
const consoleSpy = vi.spyOn(global.console, 'warn').mockReturnValue(undefined);
const api = createCardAPI();
const manager = new MessageManager(api);
manager.setErrorIfHigherPriority(new Error('generic error message'));
expect(manager.hasMessage()).toBeTruthy();
expect(manager.getMessage()).toEqual({
message: 'generic error message',
type: 'error',
});
expect(consoleSpy).toBeCalled();
});
it('should not set unknown error type', () => {
const consoleSpy = vi.spyOn(global.console, 'warn').mockReturnValue(undefined);
const api = createCardAPI();
const manager = new MessageManager(api);
manager.setErrorIfHigherPriority('not_an_error_object');
expect(manager.hasMessage()).toBeFalsy();
expect(consoleSpy).not.toBeCalled();
});
});
tests/utils/card-controller/microphone-manager.test.ts
+193
View File
@@ -0,0 +1,193 @@
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import { mock } from 'vitest-mock-extended';
import { MicrophoneManager } from '../../../src/utils/card-controller/microphone-manager';
import { createCardAPI, createConfig } from '../../test-utils';
const navigatorMock = {
mediaDevices: {
getUserMedia: vi.fn(),
},
};
// @vitest-environment jsdom
describe('MicrophoneManager', () => {
beforeEach(() => {
vi.stubGlobal('navigator', navigatorMock);
vi.useRealTimers();
});
afterEach(() => {
vi.resetAllMocks();
vi.unstubAllGlobals;
});
const createMockStream = (mute?: boolean): MediaStream => {
const stream = mock<MediaStream>();
const track = mock<MediaStreamTrack>();
track.enabled = !mute;
stream.getTracks.mockImplementation(() => [track]);
return stream;
};
it('should be muted on creation', () => {
const manager = new MicrophoneManager(createCardAPI());
expect(manager).toBeTruthy();
expect(manager.isMuted()).toBeTruthy();
});
it('should be undefined without creation', () => {
const manager = new MicrophoneManager(createCardAPI());
expect(manager.getStream()).toBeUndefined();
});
it('should connect', async () => {
const api = createCardAPI();
const manager = new MicrophoneManager(api);
const stream = createMockStream();
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(stream);
await manager.connect();
expect(manager.isConnected()).toBeTruthy();
expect(manager.getStream()).toBe(stream);
expect(manager.isMuted()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should be forbidden when permission denied', async () => {
// Don't actually log messages to the console during the test.
vi.spyOn(global.console, 'warn').mockReturnValue(undefined);
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockRejectedValue(new Error());
await manager.connect();
expect(manager.isConnected()).toBeFalsy();
expect(manager.isForbidden()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalled();
});
it('should mute and unmute', async () => {
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
await manager.connect();
expect(manager.isMuted()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
manager.mute();
expect(manager.isMuted()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(2);
await manager.unmute();
expect(manager.isMuted()).toBeFalsy();
expect(api.getCardElementManager().update).toBeCalledTimes(3);
});
it('should not unmute when microphone forbidden', async () => {
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(null);
await manager.connect();
expect(manager.isMuted()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
await manager.unmute();
expect(manager.isMuted()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
});
it('should connect on unmute', async () => {
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
expect(manager.isConnected()).toBeFalsy();
await manager.unmute();
expect(manager.isConnected()).toBeTruthy();
expect(manager.isMuted()).toBeFalsy();
expect(api.getCardElementManager().update).toBeCalledTimes(2);
});
it('should disconnect', async () => {
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
await manager.connect();
expect(manager.isConnected()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
await manager.disconnect();
expect(manager.isConnected()).toBeFalsy();
expect(api.getCardElementManager().update).toBeCalledTimes(2);
});
it('should automatically disconnect', async () => {
vi.useFakeTimers();
const disconnectSeconds = 10;
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
live: {
microphone: {
always_connected: false,
disconnect_seconds: disconnectSeconds,
},
},
}),
);
await manager.connect();
expect(manager.isConnected()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
vi.advanceTimersByTime(disconnectSeconds * 1000);
expect(manager.isConnected()).toBeFalsy();
expect(api.getCardElementManager().update).toBeCalledTimes(2);
});
it('should not automatically disconnect when always connected', async () => {
vi.useFakeTimers();
const disconnectSeconds = 10;
const api = createCardAPI();
const manager = new MicrophoneManager(api);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
live: {
microphone: {
always_connected: true,
disconnect_seconds: disconnectSeconds,
},
},
}),
);
await manager.connect();
expect(manager.isConnected()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
vi.advanceTimersByTime(disconnectSeconds * 1000);
expect(manager.isConnected()).toBeTruthy();
expect(api.getCardElementManager().update).toBeCalledTimes(1);
});
});
tests/utils/card-controller/query-string-manager.test.ts
+298
View File
@@ -0,0 +1,298 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { createCardAPI } from '../../test-utils';
import { QueryStringManager } from '../../../src/utils/card-controller/query-string-manager';
import { mock } from 'vitest-mock-extended';
const setQueryString = (qs: string): void => {
const location: Location = mock<Location>();
location.search = qs;
global.window.location = location;
};
// @vitest-environment jsdom
describe('QueryStringManager', () => {
beforeEach(() => {
global.window.location = mock<Location>();
});
it('should reject malformed query string', () => {
setQueryString('BOGUS_KEY=BOGUS_VALUE');
const api = createCardAPI();
vi.mocked(api.getMessageManager().hasMessage).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(manager.hasViewRelatedActions()).toBeFalsy();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
});
describe('should execute view name action from query string', () => {
it.each([
['clip' as const],
['clips' as const],
['diagnostics' as const],
['image' as const],
['live' as const],
['recording' as const],
['recordings' as const],
['snapshot' as const],
['snapshots' as const],
['timeline' as const],
])('%s', (viewName: string) => {
setQueryString(`?frigate-card-action.id.${viewName}=`);
const api = createCardAPI();
// View actions do not need the card to have been updated.
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(false);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(manager.hasViewRelatedActions()).toBeTruthy();
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
viewName: viewName,
});
});
});
describe('should execute non-view action from query string', () => {
it.each([
['camera_ui' as const],
['download' as const],
['expand' as const],
['menu_toggle' as const],
])('%s', (action: string) => {
setQueryString(`?frigate-card-action.id.${action}=`);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(manager.hasViewRelatedActions()).toBeFalsy();
expect(api.getActionsManager().executeAction).toBeCalledWith({
action: 'fire-dom-event',
card_id: 'id',
frigate_card_action: action,
});
});
});
it('should execute view default action', () => {
setQueryString('?frigate-card-action.id.default=');
const api = createCardAPI();
// View actions do not need the card to have been updated.
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(false);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(api.getViewManager().setViewDefault).toBeCalled();
expect(manager.hasViewRelatedActions()).toBeTruthy();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
});
it('should execute camera_select action', () => {
setQueryString('?frigate-card-action.id.camera_select=camera.office');
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
cameraID: 'camera.office',
});
expect(manager.hasViewRelatedActions()).toBeTruthy();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
it('should execute live_substream_select action', () => {
setQueryString('?frigate-card-action.id.live_substream_select=camera.office_hd');
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
substream: 'camera.office_hd',
});
expect(manager.hasViewRelatedActions()).toBeTruthy();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
describe('should ignore action without value', () => {
it.each([['camera_select' as const], ['live_substream_select' as const]])(
'%s',
(action: string) => {
setQueryString(`?frigate-card-action.id.${action}=`);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(manager.hasViewRelatedActions()).toBeFalsy();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
},
);
});
it('should handle unknown action', () => {
const consoleSpy = vi.spyOn(global.console, 'warn').mockReturnValue(undefined);
setQueryString('?frigate-card-action.id.not_an_action=value');
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(manager.hasViewRelatedActions()).toBeFalsy();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
expect(consoleSpy).toBeCalled();
});
describe('should execute view name action from query string', () => {
it.each([
['clip' as const],
['clips' as const],
['diagnostics' as const],
['image' as const],
['live' as const],
['recording' as const],
['recordings' as const],
['snapshot' as const],
['snapshots' as const],
['timeline' as const],
])('%s', (viewName: string) => {
setQueryString(`?frigate-card-action.id.${viewName}=`);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(manager.hasViewRelatedActions()).toBeTruthy();
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
viewName: viewName,
});
});
});
describe('should not execute non-view actions without an initial update', () => {
it.each([
['camera_ui' as const],
['download' as const],
['expand' as const],
['menu_toggle' as const],
])('%s', (action: string) => {
setQueryString(`?frigate-card-action.id.${action}=value`);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(false);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(api.getActionsManager().executeAction).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
});
});
describe('should handle conflicting but valid actions', () => {
it('view and default with camera and substream specified', () => {
setQueryString(
'?frigate-card-action.id.clips=' +
'&frigate-card-action.id.live_substream_select=camera.kitchen_hd' +
'&frigate-card-action.id.default=' +
'&frigate-card-action.id.camera_select=camera.kitchen',
);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(api.getViewManager().setViewDefault).toBeCalledWith({
cameraID: 'camera.kitchen',
substream: 'camera.kitchen_hd',
});
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
});
it('multiple cameras specified', () => {
setQueryString(
'?frigate-card-action.id.camera_select=camera.kitchen' +
'&frigate-card-action.id.camera_select=camera.office',
);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeAll();
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
cameraID: 'camera.office',
});
});
});
describe('should not execute view related actions', () => {
it.each([
['clip' as const],
['clips' as const],
['default' as const],
['diagnostics' as const],
['image' as const],
['live' as const],
['recording' as const],
['recordings' as const],
['snapshot' as const],
['snapshots' as const],
['timeline' as const],
])('%s', (viewName: string) => {
setQueryString(`?frigate-card-action.id.${viewName}=`);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeNonViewRelated();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
});
describe('should not execute non-view related actions', () => {
it.each([
['camera_ui' as const],
['download' as const],
['expand' as const],
['menu_toggle' as const],
])('%s', (viewName: string) => {
setQueryString(`?frigate-card-action.id.${viewName}=`);
const api = createCardAPI();
vi.mocked(api.getCardElementManager().hasUpdated).mockReturnValue(true);
const manager = new QueryStringManager(api);
manager.executeViewRelated();
expect(api.getActionsManager().executeAction).not.toBeCalled();
});
});
});
tests/utils/card-controller/style-manager.test.ts
+378
View File
@@ -0,0 +1,378 @@
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { setPerformanceCSSStyles } from '../../../src/performance';
import { FrigateCardView } from '../../../src/types';
import { StyleManager } from '../../../src/utils/card-controller/style-manager';
import { createCardAPI, createConfig, createHASS, createView } from '../../test-utils';
vi.mock('../../../src/performance');
// @vitest-environment jsdom
describe('StyleManager', () => {
beforeEach(() => {
vi.resetAllMocks();
});
describe('setLightOrDarkMode', () => {
it('dark mode unspecified', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const manager = new StyleManager(api);
manager.setLightOrDarkMode();
expect(element.getAttribute('dark')).toBeNull();
});
it('dark mode explicitly off', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
dark_mode: 'off',
},
}),
);
const manager = new StyleManager(api);
manager.setLightOrDarkMode();
expect(element.getAttribute('dark')).toBeNull();
});
it('dark mode explicitly set', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
dark_mode: 'on',
},
}),
);
const manager = new StyleManager(api);
manager.setLightOrDarkMode();
expect(element.getAttribute('dark')).not.toBeNull();
});
it('dark mode auto without interaction', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
dark_mode: 'auto',
},
}),
);
vi.mocked(api.getInteractionManager().hasInteraction).mockReturnValue(false);
const manager = new StyleManager(api);
manager.setLightOrDarkMode();
expect(element.getAttribute('dark')).not.toBeNull();
});
it('dark mode auto with HA dark mode', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
dark_mode: 'auto',
},
}),
);
vi.mocked(api.getInteractionManager().hasInteraction).mockReturnValue(true);
const hass = createHASS();
hass.themes.darkMode = true;
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(hass);
const manager = new StyleManager(api);
manager.setLightOrDarkMode();
expect(element.getAttribute('dark')).not.toBeNull();
});
});
describe('setExpandedMode', () => {
it('with no view or known media', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
vi.mocked(api.getMediaLoadedInfoManager().getLastKnown).mockReturnValue(null);
const manager = new StyleManager(api);
manager.setExpandedMode();
expect(element.style.getPropertyValue('--frigate-card-expand-aspect-ratio')).toBe(
'unset',
);
expect(element.style.getPropertyValue('--frigate-card-expand-width')).toBe(
'var(--frigate-card-expand-max-width)',
);
expect(element.style.getPropertyValue('--frigate-card-expand-height')).toBe(
'var(--frigate-card-expand-max-height)',
);
});
it('with view but without media', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const view = createView({ view: 'media', displayMode: 'single' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getMediaLoadedInfoManager().getLastKnown).mockReturnValue(null);
const manager = new StyleManager(api);
manager.setExpandedMode();
expect(element.style.getPropertyValue('--frigate-card-expand-aspect-ratio')).toBe(
'unset',
);
expect(element.style.getPropertyValue('--frigate-card-expand-width')).toBe('none');
expect(element.style.getPropertyValue('--frigate-card-expand-height')).toBe(
'none',
);
});
it('with view and media', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const view = createView({ view: 'media', displayMode: 'single' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getMediaLoadedInfoManager().getLastKnown).mockReturnValue({
width: 800,
height: 600,
});
const manager = new StyleManager(api);
manager.setExpandedMode();
expect(element.style.getPropertyValue('--frigate-card-expand-aspect-ratio')).toBe(
'800 / 600',
);
expect(element.style.getPropertyValue('--frigate-card-expand-width')).toBe('none');
expect(element.style.getPropertyValue('--frigate-card-expand-height')).toBe(
'none',
);
});
it('with view and grid display mode', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const view = createView({ view: 'media', displayMode: 'grid' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getMediaLoadedInfoManager().getLastKnown).mockReturnValue({
width: 800,
height: 600,
});
const manager = new StyleManager(api);
manager.setExpandedMode();
expect(element.style.getPropertyValue('--frigate-card-expand-aspect-ratio')).toBe(
'800 / 600',
);
expect(element.style.getPropertyValue('--frigate-card-expand-width')).toBe(
'var(--frigate-card-expand-max-width)',
);
expect(element.style.getPropertyValue('--frigate-card-expand-height')).toBe(
'var(--frigate-card-expand-max-height)',
);
});
});
describe('setMinMaxHeight', () => {
it('without a config', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const manager = new StyleManager(api);
manager.setMinMaxHeight();
expect(element.style.getPropertyValue('--frigate-card-max-height')).toBeFalsy();
expect(element.style.getPropertyValue('--frigate-card-expand-height')).toBeFalsy();
});
it('with a config', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
dimensions: {
max_height: '800px',
min_height: '400px',
},
}),
);
const manager = new StyleManager(api);
manager.setMinMaxHeight();
expect(element.style.getPropertyValue('--frigate-card-min-height')).toBe('400px');
expect(element.style.getPropertyValue('--frigate-card-max-height')).toBe('800px');
});
});
it('setPerformance', () => {
const api = createCardAPI();
const element = document.createElement('div');
vi.mocked(api.getCardElementManager().getElement).mockReturnValue(element);
const config = createConfig();
vi.mocked(api.getConfigManager().getCardWideConfig).mockReturnValue({
performance: config.performance,
});
const manager = new StyleManager(api);
manager.setPerformance();
expect(setPerformanceCSSStyles).toBeCalledWith(element, config.performance);
});
describe('getAspectRatioStyle', () => {
it('without config or view', () => {
const api = createCardAPI();
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('16 / 9');
});
it('should be auto with unconstrained aspect ratio', () => {
const api = createCardAPI();
const view = createView({ view: 'media' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
dimensions: {
aspect_ratio_mode: 'unconstrained',
},
}),
);
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('auto');
});
it('should be auto in fullscreen', () => {
const api = createCardAPI();
const view = createView({ view: 'media' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getFullscreenManager().isInFullscreen).mockReturnValue(true);
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('auto');
});
it('should be auto when expanded', () => {
const api = createCardAPI();
const view = createView({ view: 'media' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getExpandManager().isExpanded).mockReturnValue(true);
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('auto');
});
describe('should be auto when dynamic in certain views', () => {
it.each([
['clip' as const],
['diagnostics' as const],
['image' as const],
['media' as const],
['live' as const],
['recording' as const],
['snapshot' as const],
['timeline' as const],
])('%s', (viewName: FrigateCardView) => {
const api = createCardAPI();
const view = createView({ view: viewName });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
dimensions: {
aspect_ratio_mode: 'dynamic',
},
}),
);
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('auto');
});
});
describe('should be enforced when dynamic in certain views', () => {
it.each([['clips' as const], ['recordings' as const], ['snapshots' as const]])(
'%s',
(viewName: FrigateCardView) => {
const api = createCardAPI();
const view = createView({ view: viewName });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
dimensions: {
aspect_ratio_mode: 'dynamic',
},
}),
);
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('16 / 9');
},
);
});
describe('should use media dimensions in dynamic', () => {
it.each([['clips' as const], ['recordings' as const], ['snapshots' as const]])(
'%s',
(viewName: FrigateCardView) => {
const api = createCardAPI();
const view = createView({ view: viewName });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
dimensions: {
aspect_ratio_mode: 'dynamic',
},
}),
);
vi.mocked(api.getMediaLoadedInfoManager().getLastKnown).mockReturnValue({
width: 800,
height: 600,
});
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('800 / 600');
},
);
});
it('should respect default aspect ratio', () => {
const api = createCardAPI();
const view = createView({ view: 'clips' });
vi.mocked(api.getViewManager().getView).mockReturnValue(view);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
dimensions: {
aspect_ratio_mode: 'dynamic',
aspect_ratio: '4:3',
},
}),
);
const manager = new StyleManager(api);
expect(manager.getAspectRatioStyle()).toBe('4 / 3');
});
});
});
tests/utils/card-controller/triggers-manager.test.ts
+190
View File
@@ -0,0 +1,190 @@
import add from 'date-fns/add';
import { HassEntities } from 'home-assistant-js-websocket';
import { beforeEach, describe, expect, it, vi } from 'vitest';
import { ScanOptions } from '../../../src/types';
import { TriggersManager } from '../../../src/utils/card-controller/triggers-manager';
import {
createCameraConfig,
createCameraManager,
createCardAPI,
createConfig,
createHASS,
createStateEntity,
createView,
} from '../../test-utils';
vi.mock('../../../src/camera-manager/manager.js');
// Creating and mocking a trigger API is a lot of boilerplate, this convenience
// function reduces it.
const createTriggerAPI = (options?: {
config?: ScanOptions;
hassStates?: HassEntities;
interaction?: boolean;
}) => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
scan: options?.config ?? {
enabled: true,
untrigger_reset: true,
untrigger_seconds: 10,
},
},
}),
);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(
createHASS(options?.hassStates),
);
vi.mocked(api.getCameraManager).mockReturnValue(
createCameraManager({
configs: new Map([
[
'camera_1',
createCameraConfig({
triggers: {
entities: ['binary_sensor.motion'],
},
}),
],
]),
}),
);
vi.mocked(api.getInteractionManager().hasInteraction).mockReturnValue(
options?.interaction ?? false,
);
return api;
};
// @vitest-environment jsdom
describe('TriggersManager', () => {
const hassActiveState = {
'binary_sensor.motion': createStateEntity({ state: 'on' }),
};
const hassInactiveState = {
'binary_sensor.motion': createStateEntity({ state: 'off' }),
};
beforeEach(() => {
vi.resetAllMocks();
vi.useFakeTimers();
});
it('should not be triggered by default', () => {
const manager = new TriggersManager(createCardAPI());
expect(manager.isTriggered()).toBeFalsy();
});
it('should not trigger when scan mode disabled default', () => {
const api = createTriggerAPI({
config: { enabled: false },
hassStates: hassActiveState,
});
const manager = new TriggersManager(api);
manager.updateTriggeredCameras(null);
expect(manager.isTriggered()).toBeFalsy();
});
it('should trigger and untrigger based on entity state', () => {
const start = new Date('2023-10-01T17:14');
vi.setSystemTime(start);
const api = createTriggerAPI({
hassStates: hassActiveState,
});
const manager = new TriggersManager(api);
manager.updateTriggeredCameras(createHASS(hassInactiveState));
expect(manager.isTriggered()).toBeTruthy();
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
viewName: 'live',
cameraID: 'camera_1',
});
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(
createHASS(hassInactiveState),
);
manager.updateTriggeredCameras(createHASS(hassActiveState));
// Intentional state update with no change.
manager.updateTriggeredCameras(createHASS(hassActiveState));
// Will still be triggered, but untrigger timer will be running.
expect(manager.isTriggered()).toBeTruthy();
vi.setSystemTime(add(start, { seconds: 10 }));
vi.runOnlyPendingTimers();
expect(manager.isTriggered()).toBeFalsy();
expect(api.getViewManager().setViewDefault).toBeCalled();
});
it('should trigger and set view if current view is wrong', () => {
const api = createTriggerAPI({
hassStates: hassActiveState,
});
vi.mocked(api.getViewManager().getView).mockReturnValue(
createView({
// Correct camera, but wrong view.
view: 'clips',
camera: 'camera_1',
}),
);
const manager = new TriggersManager(api);
manager.updateTriggeredCameras(null);
expect(api.getViewManager().setViewByParameters).toBeCalledWith({
viewName: 'live',
cameraID: 'camera_1',
});
});
it('should trigger when entity state is active on startup', () => {
const api = createTriggerAPI({
hassStates: hassActiveState,
});
const manager = new TriggersManager(api);
expect(manager.isTriggered()).toBeFalsy();
manager.updateTriggeredCameras(null);
expect(manager.isTriggered()).toBeTruthy();
});
it('should untrigger manually', () => {
const api = createTriggerAPI({
hassStates: hassActiveState,
});
const manager = new TriggersManager(api);
// Untriggering when not triggered.
manager.untrigger();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
manager.updateTriggeredCameras(null);
expect(manager.isTriggered()).toBeTruthy();
manager.untrigger();
expect(manager.isTriggered()).toBeFalsy();
expect(api.getViewManager().setViewDefault).toBeCalled();
});
it('should take no actions when automated actions are not allowed', () => {
const api = createTriggerAPI({
hassStates: hassActiveState,
// Interaction present.
interaction: true,
});
const manager = new TriggersManager(api);
manager.updateTriggeredCameras(null);
expect(manager.isTriggered()).toBeTruthy();
expect(api.getViewManager().setViewByParameters).not.toBeCalled();
manager.untrigger();
expect(api.getViewManager().setViewDefault).not.toBeCalled();
});
});
tests/utils/card-controller/view-manager.test.ts
+698
View File
@@ -0,0 +1,698 @@
import { describe, expect, it, vi } from 'vitest';
import { QueryType } from '../../../src/camera-manager/types';
import { FrigateCardView } from '../../../src/types';
import { getAllDependentCameras } from '../../../src/utils/camera';
import { ViewManager } from '../../../src/utils/card-controller/view-manager';
import { EventMediaQueries } from '../../../src/view/media-queries';
import {
createCameraManager,
createCardAPI,
createConfig,
createHASS,
createView,
generateViewMediaArray,
} from '../../test-utils';
vi.mock('../../../src/camera-manager/manager.js');
vi.mock('../../../src/utils/camera');
describe('ViewManager.setView', () => {
it('should set view', () => {
const api = createCardAPI();
const manager = new ViewManager(api);
const view = createView({
view: 'live',
camera: 'camera',
displayMode: 'grid',
});
manager.setView(view);
expect(manager.getView()).toBe(view);
expect(api.getMediaLoadedInfoManager().clear).toBeCalled();
expect(api.getCardElementManager().scrollReset).toBeCalled();
expect(api.getMessageManager().reset).toBeCalled();
expect(api.getStyleManager().setExpandedMode).toBeCalled();
expect(api.getConditionsManager()?.setState).toBeCalledWith({
view: 'live',
camera: 'camera',
displayMode: 'grid',
});
expect(api.getCardElementManager().update).toBeCalled();
});
it('should set view with minor changes without media clearing or scroll', () => {
const api = createCardAPI();
const manager = new ViewManager(api);
const view_1 = createView({
view: 'live',
camera: 'camera',
});
manager.setView(view_1);
vi.mocked(api.getMediaLoadedInfoManager().clear).mockClear();
vi.mocked(api.getCardElementManager().scrollReset).mockClear();
const view_2 = createView({
view: 'live',
camera: 'camera',
displayMode: 'single',
});
manager.setView(view_2);
expect(manager.getView()).toBe(view_2);
// The new view is neither a major media change, nor a different view name,
// so media clearing and scrolling should not happen.
expect(api.getMediaLoadedInfoManager().clear).not.toBeCalled();
expect(api.getCardElementManager().scrollReset).not.toBeCalled();
});
it('should set view with new context', () => {
const api = createCardAPI();
const manager = new ViewManager(api);
const context = { thumbnails: { fetch: false } };
// Setting context with no existing view does nothing.
manager.setViewWithNewContext(context);
expect(manager.getView()).toBeNull();
const view = createView({
view: 'live',
camera: 'camera',
});
manager.setView(view);
manager.setViewWithNewContext(context);
expect(manager.getView()?.camera).toBe('camera');
expect(manager.getView()?.view).toBe('live');
expect(manager.getView()?.context).toEqual(context);
});
});
describe('ViewManager.reset', () => {
it('should reset', () => {
const manager = new ViewManager(createCardAPI());
const view = createView();
manager.setView(view);
manager.reset();
expect(manager.getView()).toBeNull();
});
});
describe('ViewManager.setViewDefault', () => {
it('should set default view', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(createCameraManager());
const manager = new ViewManager(api);
manager.setViewDefault();
expect(manager.getView()?.view).toBe('live');
expect(manager.getView()?.camera).toBe('camera');
expect(api.getAutoUpdateManager().startDefaultViewTimer).toBeCalled();
});
it('should not set default view without config', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(null);
const manager = new ViewManager(api);
manager.setViewDefault();
expect(manager.getView()).toBeNull();
expect(api.getAutoUpdateManager().startDefaultViewTimer).not.toBeCalled();
});
it('should cycle camera when configured', () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(
createConfig({
view: {
update_cycle_camera: true,
},
}),
);
const manager = new ViewManager(api);
manager.setViewDefault();
expect(manager.getView()?.camera).toBe('camera_1');
manager.setViewDefault();
expect(manager.getView()?.camera).toBe('camera_2');
manager.setViewDefault();
expect(manager.getView()?.camera).toBe('camera_1');
// When a parameter is specified, it will not cycle.
manager.setViewDefault({ cameraID: 'camera_1' });
expect(manager.getView()?.camera).toBe('camera_1');
});
it('should respect parameters', () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera.kitchen', 'camera.office']),
);
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const manager = new ViewManager(api);
manager.setViewDefault({
cameraID: 'camera.office',
substream: 'camera.office_hd',
});
expect(manager.getView()?.view).toBe('live');
expect(manager.getView()?.camera).toBe('camera.office');
expect(manager.getView()?.context?.live?.overrides).toEqual(
new Map([['camera.office', 'camera.office_hd']]),
);
});
});
describe('ViewManager.setViewByParameters', () => {
it('should set view by parameters specifying camera and view', () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(createCameraManager());
const manager = new ViewManager(api);
manager.setViewByParameters({
cameraID: 'camera',
viewName: 'clips',
});
expect(manager.getView()?.view).toBe('clips');
expect(manager.getView()?.camera).toBe('camera');
});
it('should set view by parameters using existing view if unspecified', () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const manager = new ViewManager(api);
manager.setViewByParameters({
cameraID: 'camera_1',
viewName: 'clips',
});
manager.setViewByParameters({
cameraID: 'camera_2',
});
expect(manager.getView()?.view).toBe('clips');
expect(manager.getView()?.camera).toBe('camera_2');
});
it('should set view by parameters using config as fallback', () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const manager = new ViewManager(api);
manager.setViewByParameters({
cameraID: 'camera_1',
// No prior view, and no specified view. This could happen during query
// string based initialization.
});
expect(manager.getView()?.view).toBe('live');
expect(manager.getView()?.camera).toBe('camera_1');
});
it('should not set view by parameters without config', () => {
const manager = new ViewManager(createCardAPI());
manager.setViewByParameters({
viewName: 'live',
});
expect(manager.getView()).toBeNull();
});
it('should not set view by parameters without visible cameras', () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(new Set());
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const manager = new ViewManager(api);
manager.setViewByParameters({
viewName: 'live',
});
expect(manager.getView()).toBeNull();
});
describe('should set view by parameters and respect display mode in config for view', () => {
it.each([
['media' as const],
['clip' as const],
['recording' as const],
['snapshot' as const],
['live' as const],
])('%s', (viewName: FrigateCardView) => {
const api = createCardAPI();
vi.mocked(api.getCameraManager).mockReturnValue(createCameraManager());
vi.mocked(api.getConfigManager()).getConfig.mockReturnValue(
createConfig({
media_viewer: {
display: {
mode: 'grid',
},
},
live: {
display: {
mode: 'grid',
},
},
}),
);
const manager = new ViewManager(api);
manager.setViewByParameters({
cameraID: 'camera',
viewName: viewName,
});
expect(manager.getView()?.displayMode).toBe('grid');
});
});
describe('should set view by parameters and leave display mode unset for view', () => {
it.each([
['media' as const],
['clip' as const],
['recording' as const],
['snapshot' as const],
['live' as const],
])('%s', (viewName: FrigateCardView) => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(createCameraManager());
const manager = new ViewManager(api);
manager.setViewByParameters({
cameraID: 'camera',
viewName: viewName,
});
expect(manager.getView()?.displayMode).toBe('single');
});
});
it('should set view by parameters using config as fallback', () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(getAllDependentCameras).mockReturnValue(
new Set(['camera_1', 'camera_1_hd']),
);
const manager = new ViewManager(api);
manager.setViewByParameters({
cameraID: 'camera_1',
viewName: 'live',
substream: 'camera_1_hd',
});
expect(manager.getView()?.view).toBe('live');
expect(manager.getView()?.camera).toBe('camera_1');
expect(manager.getView()?.context?.live?.overrides).toEqual(
new Map([['camera_1', 'camera_1_hd']]),
);
});
});
// @vitest-environment jsdom
describe('ViewManager.setViewWithNewDisplayMode', () => {
it('should set display mode', async () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
vi.mocked(api.getCameraManager).mockReturnValue(createCameraManager());
const manager = new ViewManager(api);
manager.setView(createView());
await manager.setViewWithNewDisplayMode('grid');
expect(manager.getView()?.displayMode).toBe('grid');
});
it('should not set display mode without view', async () => {
const api = createCardAPI();
vi.mocked(api.getConfigManager().getConfig).mockReturnValue(createConfig());
vi.mocked(api.getCameraManager).mockReturnValue(createCameraManager());
const manager = new ViewManager(api);
manager.setViewWithNewDisplayMode('grid');
expect(manager.getView()).toBeNull();
});
it('should set display mode to grid and create new query', async () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraCount).mockReturnValue(2);
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const hass = createHASS();
vi.mocked(api.getHASSManager()).getHASS.mockReturnValue(hass);
const media = generateViewMediaArray({ count: 5 });
vi.mocked(cameraManager.executeMediaQueries).mockResolvedValue(media);
const manager = new ViewManager(api);
const query = new EventMediaQueries([
{ type: QueryType.Event, cameraIDs: new Set(['camera_1']), hasClip: true },
]);
manager.setView(
createView({
camera: 'camera_1',
view: 'clip',
query: query,
}),
);
await manager.setViewWithNewDisplayMode('grid');
expect(manager.getView()?.queryResults?.getResults()).toBe(media);
expect(cameraManager.executeMediaQueries).toBeCalledWith(
expect.arrayContaining([
expect.objectContaining({
type: 'event-query',
cameraIDs: new Set(['camera_1', 'camera_2']),
hasClip: true,
}),
]),
);
});
it('should set display mode to single and create new query', async () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraCount).mockReturnValue(2);
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const hass = createHASS();
vi.mocked(api.getHASSManager()).getHASS.mockReturnValue(hass);
const media = generateViewMediaArray({ count: 5 });
vi.mocked(cameraManager.executeMediaQueries).mockResolvedValue(media);
const manager = new ViewManager(api);
const query = new EventMediaQueries([
{
type: QueryType.Event,
cameraIDs: new Set(['camera_1', 'camera_2']),
hasClip: true,
},
]);
manager.setView(
createView({
view: 'clip',
camera: 'camera_2',
query: query,
}),
);
await manager.setViewWithNewDisplayMode('single');
expect(manager.getView()?.queryResults?.getResults()).toBe(media);
expect(cameraManager.executeMediaQueries).toBeCalledWith(
expect.arrayContaining([
expect.objectContaining({
type: 'event-query',
cameraIDs: new Set(['camera_2']),
hasClip: true,
}),
]),
);
});
it('should set display mode to single and handle failed new query', async () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraCount).mockReturnValue(2);
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const manager = new ViewManager(api);
const query = new EventMediaQueries([
{
type: QueryType.Event,
cameraIDs: new Set(['camera_1', 'camera_2']),
hasClip: true,
},
]);
const originalView = createView({
view: 'clip',
camera: 'camera_2',
query: query,
});
manager.setView(originalView);
// Query execution fails / returns null.
vi.mocked(cameraManager.executeMediaQueries).mockResolvedValue(null);
await manager.setViewWithNewDisplayMode('single');
expect(manager.getView()).toBe(originalView);
});
it('should set display mode and handle empty new query results', async () => {
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getStore().getVisibleCameraCount).mockReturnValue(2);
vi.mocked(cameraManager.getStore().getVisibleCameraIDs).mockReturnValue(
new Set(['camera_1', 'camera_2']),
);
const api = createCardAPI();
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
vi.mocked(api.getHASSManager().getHASS).mockReturnValue(createHASS());
const manager = new ViewManager(api);
const query = new EventMediaQueries([
{
type: QueryType.Event,
cameraIDs: new Set(['camera_1']),
hasClip: true,
},
]);
const originalView = createView({
view: 'clip',
camera: 'camera_2',
query: query,
});
manager.setView(originalView);
await manager.setViewWithNewDisplayMode('grid');
vi.mocked(cameraManager.executeMediaQueries).mockResolvedValue(null);
// Empty queries will not be executed, so view will not be changed.
expect(manager.getView()?.displayMode).toBeNull();
});
});
describe('ViewManager.setViewWithSubstream', () => {
it('should set new equal view with no dependencies', () => {
const view = createView({
view: 'live',
camera: 'camera',
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera']));
const manager = new ViewManager(createCardAPI());
manager.setView(view);
manager.setViewWithSubstream();
expect(manager.getView()?.camera).toBe(view.camera);
expect(manager.getView()?.view).toBe(view.view);
expect(manager.getView()?.context).toEqual(view.context);
});
it('should set new view with next substream', () => {
const view = createView({
view: 'live',
camera: 'camera',
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera', 'camera2']));
const manager = new ViewManager(createCardAPI());
manager.setView(view);
manager.setViewWithSubstream();
expect(manager.getView()?.context?.live?.overrides).toEqual(
new Map([['camera', 'camera2']]),
);
});
it('should set new view with next substream when view has invalid substream', () => {
const view = createView({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera', 'camera-that-does-not-exist']]),
},
},
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera', 'camera2']));
const manager = new ViewManager(createCardAPI());
manager.setView(view);
manager.setViewWithSubstream();
expect(manager.getView()?.context?.live?.overrides).toEqual(
new Map([['camera', 'camera']]),
);
});
it('should set new view with selected substream', () => {
const view = createView({
view: 'live',
camera: 'camera',
});
const manager = new ViewManager(createCardAPI());
manager.setView(view);
manager.setViewWithSubstream('substream');
expect(manager.getView()?.context?.live?.overrides).toEqual(
new Map([['camera', 'substream']]),
);
});
it('should not set view with next substream without an existing view', () => {
const manager = new ViewManager(createCardAPI());
manager.setViewWithSubstream();
expect(manager.getView()).toBeNull();
});
it('should not set view with selected substream without an existing view', () => {
const manager = new ViewManager(createCardAPI());
manager.setViewWithSubstream('substream');
expect(manager.getView()).toBeNull();
});
it('should not set view without substream without an existing view', () => {
const manager = new ViewManager(createCardAPI());
manager.setViewWithoutSubstream();
expect(manager.getView()).toBeNull();
});
it('should set new view without substream', () => {
const view = createView({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera', 'camera']]),
},
},
});
const manager = new ViewManager(createCardAPI());
manager.setView(view);
manager.setViewWithoutSubstream();
expect(manager.getView()?.context?.live?.overrides).toEqual(new Map());
});
it('should set new view without substream', () => {
const view = createView({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera-2', 'camera-3']]),
},
},
});
const manager = new ViewManager(createCardAPI());
manager.setView(view);
manager.setViewWithoutSubstream();
expect(manager.getView()?.context?.live?.overrides).toEqual(
view.context?.live?.overrides,
);
});
});
describe('ViewManager.isViewSupportedByCamera', () => {
it.each([
['live' as const, true],
['image' as const, true],
['diagnostics' as const, true],
['clip' as const, false],
['clips' as const, false],
['snapshot' as const, false],
['snapshots' as const, false],
['recording' as const, false],
['recordings' as const, false],
['timeline' as const, false],
['media' as const, false],
])('%s', (viewName: FrigateCardView, expected: boolean) => {
const api = createCardAPI();
const cameraManager = createCameraManager();
vi.mocked(cameraManager.getCameraCapabilities).mockReturnValue({
canFavoriteEvents: false,
canFavoriteRecordings: false,
canSeek: false,
supportsClips: false,
supportsRecordings: false,
supportsSnapshots: false,
supportsTimeline: false,
});
vi.mocked(api.getCameraManager).mockReturnValue(cameraManager);
const manager = new ViewManager(api);
expect(manager.isViewSupportedByCamera('camera', viewName)).toBe(expected);
});
});
tests/utils/diagnostics.test.ts
+137
View File
@@ -0,0 +1,137 @@
import { HassConfig } from 'home-assistant-js-websocket';
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
import { getLanguage } from '../../src/localize/localize';
import { getDiagnostics } from '../../src/utils/diagnostics.js';
import { getAllDevices } from '../../src/utils/ha/device-registry.js';
import { createHASS } from '../test-utils';
vi.mock('../../package.json', () => ({
default: {
version: '5.2.0',
gitVersion: '5.2.0-dev+g4cf13b1',
buildDate: 'Tue, 19 Sep 2023 04:59:27 GMT',
gitDate: 'Wed, 6 Sep 2023 21:27:28 -0700',
},
}));
vi.mock('../../src/camera-manager/manager.js');
vi.mock('../../src/utils/ha');
vi.mock('../../src/localize/localize.js');
vi.mock('../../src/utils/ha/device-registry');
// @vitest-environment jsdom
describe('getDiagnostics', () => {
const now = new Date('2023-10-01T21:53Z');
const hass = createHASS();
hass.config = { version: '2023.9.0' } as HassConfig;
beforeEach(() => {
vi.useFakeTimers();
vi.setSystemTime(now);
vi.mocked(getLanguage).mockReturnValue('en');
vi.stubGlobal('navigator', { userAgent: 'FrigateCardTest/1.0' });
vi.mocked(getAllDevices).mockResolvedValue([
{
model: '4.0.0/0.13.0-aded314',
config_entries: [
'ac4e79d258449a83bc0cf6d47a021c46',
'b03e70c659d58ae2ce7f2dc76fed2929',
],
manufacturer: 'Frigate',
},
]);
});
afterEach(() => {
vi.useRealTimers();
vi.unstubAllGlobals();
});
it('should fetch diagnostics', async () => {
expect(
await getDiagnostics(hass, {
cameras: [{ camera_entity: 'camera.office' }],
}),
).toEqual({
browser: 'FrigateCardTest/1.0',
card_version: '5.2.0',
config: {
cameras: [{ camera_entity: 'camera.office' }],
},
frigate_versions: {
ac4e79d258449a83bc0cf6d47a021c46: '4.0.0/0.13.0-aded314',
b03e70c659d58ae2ce7f2dc76fed2929: '4.0.0/0.13.0-aded314',
},
git: {
build_date: 'Tue, 19 Sep 2023 04:59:27 GMT',
build_version: '5.2.0-dev+g4cf13b1',
commit_date: 'Wed, 6 Sep 2023 21:27:28 -0700',
},
date: now,
lang: 'en',
ha_version: '2023.9.0',
timezone: expect.anything(),
});
});
it('should fetch diagnostics without hass or config', async () => {
expect(await getDiagnostics()).toEqual({
browser: 'FrigateCardTest/1.0',
card_version: '5.2.0',
git: {
build_date: 'Tue, 19 Sep 2023 04:59:27 GMT',
build_version: '5.2.0-dev+g4cf13b1',
commit_date: 'Wed, 6 Sep 2023 21:27:28 -0700',
},
date: now,
lang: 'en',
timezone: expect.anything(),
});
});
it('should fetch diagnostics without device model', async () => {
vi.mocked(getAllDevices).mockResolvedValue([
{
model: null,
config_entries: [
'ac4e79d258449a83bc0cf6d47a021c46',
'b03e70c659d58ae2ce7f2dc76fed2929',
],
manufacturer: 'Frigate',
},
]);
expect(await getDiagnostics(hass)).toEqual({
browser: 'FrigateCardTest/1.0',
card_version: '5.2.0',
git: {
build_date: 'Tue, 19 Sep 2023 04:59:27 GMT',
build_version: '5.2.0-dev+g4cf13b1',
commit_date: 'Wed, 6 Sep 2023 21:27:28 -0700',
},
ha_version: '2023.9.0',
date: now,
lang: 'en',
timezone: expect.anything(),
});
});
it('should fetch diagnostics if getAllDevices errors', async () => {
vi.mocked(getAllDevices).mockRejectedValue(new Error());
expect(await getDiagnostics(hass)).toEqual({
browser: 'FrigateCardTest/1.0',
card_version: '5.2.0',
git: {
build_date: 'Tue, 19 Sep 2023 04:59:27 GMT',
build_version: '5.2.0-dev+g4cf13b1',
commit_date: 'Wed, 6 Sep 2023 21:27:28 -0700',
},
ha_version: '2023.9.0',
date: now,
lang: 'en',
timezone: expect.anything(),
});
});
});
tests/utils/media-info-controller.test.ts
-26
View File
@@ -1,26 +0,0 @@
import { beforeEach, describe, expect, it } from 'vitest';
import { MediaLoadedInfoController } from '../../src/utils/media-info-controller';
import { createMediaLoadedInfo } from '../test-utils.js';
describe('MediaLoadedInfoController', () => {
let controller: MediaLoadedInfoController;
beforeEach(() => {
controller = new MediaLoadedInfoController();
});
it('should set', () => {
const info = createMediaLoadedInfo();
controller.set(info);
expect(controller.has());
expect(controller.get()).toBe(info);
});
it('should get last known', () => {
const info = createMediaLoadedInfo();
controller.set(info);
expect(controller.has()).toBeTruthy();
controller.clear();
expect(controller.has()).toBeFalsy();
expect(controller.getLastKnown()).toBe(info);
});
});
tests/utils/media-to-view.test.ts
-16
View File
@@ -12,7 +12,6 @@ import { ViewMedia } from '../../src/view/media';
import { EventMediaQueries } from '../../src/view/media-queries';
import {
createCameraManager,
createHASS,
createPerformanceConfig,
createView,
TestViewMedia,
@@ -70,7 +69,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -84,7 +82,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -102,7 +99,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -122,7 +118,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -144,7 +139,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -158,7 +152,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
createElementListenForView().element,
createHASS(),
cameraManager,
{
performance: createPerformanceConfig({
@@ -187,7 +180,6 @@ describe('changeViewToRecentEventsForCameraAndDependents', () => {
await changeViewToRecentEventsForCameraAndDependents(
createElementListenForView().element,
createHASS(),
cameraManager,
{},
createView(),
@@ -220,7 +212,6 @@ describe('executeMediaQueryForView', () => {
expect(
await executeMediaQueryForView(
elementHandler.element,
createHASS(),
cameraManager,
createView(),
new EventMediaQueries(),
@@ -243,7 +234,6 @@ describe('executeMediaQueryForView', () => {
const view = await executeMediaQueryForView(
elementHandler.element,
createHASS(),
cameraManager,
createView(),
new EventMediaQueries(
@@ -276,7 +266,6 @@ describe('executeMediaQueryForView', () => {
const view = await executeMediaQueryForView(
elementHandler.element,
createHASS(),
cameraManager,
createView(),
new EventMediaQueries(
@@ -306,7 +295,6 @@ describe('changeViewToRecentRecordingForCameraAndDependents', () => {
await changeViewToRecentRecordingForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -320,7 +308,6 @@ describe('changeViewToRecentRecordingForCameraAndDependents', () => {
await changeViewToRecentRecordingForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -338,7 +325,6 @@ describe('changeViewToRecentRecordingForCameraAndDependents', () => {
await changeViewToRecentRecordingForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -355,7 +341,6 @@ describe('changeViewToRecentRecordingForCameraAndDependents', () => {
await changeViewToRecentRecordingForCameraAndDependents(
elementHandler.element,
createHASS(),
cameraManager,
{},
createView(),
@@ -373,7 +358,6 @@ describe('changeViewToRecentRecordingForCameraAndDependents', () => {
await changeViewToRecentRecordingForCameraAndDependents(
createElementListenForView().element,
createHASS(),
cameraManager,
{
performance: createPerformanceConfig({
tests/utils/menu-controller.test.ts
+40 -30
View File
@@ -13,8 +13,9 @@ import {
ViewDisplayMode,
} from '../../src/types';
import { createFrigateCardCustomAction } from '../../src/utils/action';
import { MediaPlayerManager } from '../../src/utils/card-controller/media-player-manager';
import { MicrophoneManager } from '../../src/utils/card-controller/microphone-manager';
import { MenuButtonController } from '../../src/utils/menu-controller';
import { MicrophoneController } from '../../src/utils/microphone';
import { ViewMedia } from '../../src/view/media';
import { MediaQueriesResults } from '../../src/view/media-queries-results';
import { View } from '../../src/view/view';
@@ -22,6 +23,7 @@ import {
createCameraCapabilities,
createCameraConfig,
createCameraManager,
createCardAPI,
createConfig,
createHASS,
createMediaCapabilities,
@@ -31,7 +33,8 @@ import {
} from '../test-utils';
vi.mock('../../src/camera-manager/manager.js');
vi.mock('../../src/utils/microphone');
vi.mock('../../src/utils/media-player-controller.js');
vi.mock('../../src/utils/card-controller/microphone-manager.js');
vi.mock('screenfull');
const calculateButtons = (
@@ -43,9 +46,9 @@ const calculateButtons = (
view?: View;
expanded?: boolean;
currentMediaLoadedInfo?: MediaLoadedInfo | null;
mediaPlayers?: string[];
cameraURL?: string | null;
microphoneController?: MicrophoneController;
mediaPlayerController?: MediaPlayerManager;
showCameraUIButton?: boolean;
microphoneManager?: MicrophoneManager;
},
): MenuButton[] => {
return controller.calculateButtons(
@@ -62,9 +65,9 @@ const calculateButtons = (
options?.expanded ?? false,
{
currentMediaLoadedInfo: options?.currentMediaLoadedInfo,
mediaPlayers: options?.mediaPlayers,
cameraURL: options?.cameraURL,
microphoneController: options?.microphoneController,
mediaPlayerController: options?.mediaPlayerController,
showCameraUIButton: options?.showCameraUIButton,
microphoneManager: options?.microphoneManager,
},
);
};
@@ -265,7 +268,7 @@ describe('MenuButtonController', () => {
// Return different metadata depending on the camera to test multiple code
// paths.
mock<CameraManager>(cameraManager).getCameraMetadata.mockImplementation(
(_hass: unknown, cameraID: string): CameraManagerCameraMetadata | null => {
(cameraID: string): CameraManagerCameraMetadata | null => {
return cameraID === 'camera-1'
? {
title: 'title',
@@ -685,7 +688,7 @@ describe('MenuButtonController', () => {
it('should have camera UI button', () => {
const buttons = calculateButtons(controller, {
cameraURL: 'http://frigate.domain',
showCameraUIButton: true,
});
expect(buttons).toContainEqual({
icon: 'mdi:web',
@@ -698,9 +701,9 @@ describe('MenuButtonController', () => {
});
it('should have microphone button', () => {
const microphoneController = new MicrophoneController();
const microphoneManager = new MicrophoneManager(createCardAPI());
const buttons = calculateButtons(controller, {
microphoneController: microphoneController,
microphoneManager: microphoneManager,
currentMediaLoadedInfo: createMediaLoadedInfo({
capabilities: {
supports2WayAudio: true,
@@ -730,9 +733,9 @@ describe('MenuButtonController', () => {
});
it('should not have microphone button when media does not support it', () => {
const microphoneController = new MicrophoneController();
const microphoneManager = new MicrophoneManager(createCardAPI());
const buttons = calculateButtons(controller, {
microphoneController: microphoneController,
microphoneManager: microphoneManager,
currentMediaLoadedInfo: createMediaLoadedInfo({
capabilities: {
supports2WayAudio: false,
@@ -746,10 +749,10 @@ describe('MenuButtonController', () => {
});
it('should have microphone button when microphone forbidden', () => {
const microphoneController = new MicrophoneController();
mock<MicrophoneController>(microphoneController).isForbidden.mockReturnValue(true);
const microphoneManager = new MicrophoneManager(createCardAPI());
mock<MicrophoneManager>(microphoneManager).isForbidden.mockReturnValue(true);
const buttons = calculateButtons(controller, {
microphoneController: microphoneController,
microphoneManager: microphoneManager,
currentMediaLoadedInfo: createMediaLoadedInfo({
capabilities: {
supports2WayAudio: true,
@@ -768,10 +771,10 @@ describe('MenuButtonController', () => {
});
it('should have microphone button when microphone muted', () => {
const microphoneController = new MicrophoneController();
mock<MicrophoneController>(microphoneController).isMuted.mockReturnValue(true);
const microphoneManager = new MicrophoneManager(createCardAPI());
mock<MicrophoneManager>(microphoneManager).isMuted.mockReturnValue(true);
const buttons = calculateButtons(controller, {
microphoneController: microphoneController,
microphoneManager: microphoneManager,
currentMediaLoadedInfo: createMediaLoadedInfo({
capabilities: {
supports2WayAudio: true,
@@ -798,10 +801,10 @@ describe('MenuButtonController', () => {
});
it('should have microphone button when microphone muted with toggle type', () => {
const microphoneController = new MicrophoneController();
mock<MicrophoneController>(microphoneController).isMuted.mockReturnValue(true);
const microphoneManager = new MicrophoneManager(createCardAPI());
mock<MicrophoneManager>(microphoneManager).isMuted.mockReturnValue(true);
const buttons = calculateButtons(controller, {
microphoneController: microphoneController,
microphoneManager: microphoneManager,
currentMediaLoadedInfo: createMediaLoadedInfo({
capabilities: {
supports2WayAudio: true,
@@ -827,10 +830,10 @@ describe('MenuButtonController', () => {
});
it('should have microphone button when microphone unmuted with toggle type', () => {
const microphoneController = new MicrophoneController();
mock<MicrophoneController>(microphoneController).isMuted.mockReturnValue(false);
const microphoneManager = new MicrophoneManager(createCardAPI());
mock<MicrophoneManager>(microphoneManager).isMuted.mockReturnValue(false);
const buttons = calculateButtons(controller, {
microphoneController: microphoneController,
microphoneManager: microphoneManager,
currentMediaLoadedInfo: createMediaLoadedInfo({
capabilities: {
supports2WayAudio: true,
@@ -932,10 +935,13 @@ describe('MenuButtonController', () => {
],
]),
});
const mediaPlayerController = mock<MediaPlayerManager>();
mediaPlayerController.hasMediaPlayers.mockReturnValue(true);
mediaPlayerController.getMediaPlayers.mockReturnValue(['media_player.tv']);
const buttons = calculateButtons(controller, {
cameraManager: cameraManager,
mediaPlayers: ['media_player.tv'],
mediaPlayerController: mediaPlayerController,
hass: createHASS({
'media_player.tv': createStateEntity({ entity_id: 'media_player.tv' }),
}),
@@ -984,9 +990,13 @@ describe('MenuButtonController', () => {
],
]),
});
const mediaPlayerController = mock<MediaPlayerManager>();
mediaPlayerController.hasMediaPlayers.mockReturnValue(true);
mediaPlayerController.getMediaPlayers.mockReturnValue(['not_a_real_player']);
const buttons = calculateButtons(controller, {
cameraManager: cameraManager,
mediaPlayers: ['player'],
mediaPlayerController: mediaPlayerController,
hass: createHASS(),
});
@@ -1001,9 +1011,9 @@ describe('MenuButtonController', () => {
enabled: true,
selected: false,
icon: 'mdi:bookmark',
entity: 'player',
entity: 'not_a_real_player',
state_color: false,
title: 'player',
title: 'not_a_real_player',
disabled: true,
},
],
tests/utils/microphone.test.ts
-105
View File
@@ -1,105 +0,0 @@
import { describe, it, expect, afterEach, beforeEach, vi } from 'vitest';
import { MicrophoneController } from '../../src/utils/microphone';
import { mock } from 'vitest-mock-extended';
const navigatorMock = {
mediaDevices: {
getUserMedia: vi.fn(),
},
};
// @vitest-environment jsdom
describe('MicrophoneController', () => {
beforeEach(() => {
vi.stubGlobal('navigator', navigatorMock);
});
afterEach(() => {
vi.resetAllMocks();
vi.unstubAllGlobals;
});
const createMockStream = (mute?: boolean): MediaStream => {
const stream = mock<MediaStream>();
const track = mock<MediaStreamTrack>();
track.enabled = !mute;
stream.getTracks.mockImplementation(() => [track]);
return stream;
};
it('should be muted on creation', () => {
const controller = new MicrophoneController();
expect(controller).toBeTruthy();
expect(controller.isMuted()).toBeTruthy();
});
it('should be undefined without creation', () => {
const controller = new MicrophoneController();
expect(controller.getStream()).toBeUndefined();
});
it('should connect', async () => {
const controller = new MicrophoneController();
const stream = createMockStream();
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(stream);
await controller.connect();
expect(controller.isConnected()).toBeTruthy();
expect(controller.getStream()).toBe(stream);
expect(controller.isMuted()).toBeTruthy();
});
it('should be forbidden when permission denied', async () => {
// Don't actually log messages to the console during the test.
vi.spyOn(global.console, 'warn').mockReturnValue(undefined);
const controller = new MicrophoneController();
navigatorMock.mediaDevices.getUserMedia.mockRejectedValue(new Error());
await controller.connect();
expect(controller.isConnected()).toBeFalsy();
expect(controller.isForbidden()).toBeTruthy();
});
it('should mute', async () => {
const controller = new MicrophoneController();
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
await controller.connect();
controller.mute();
expect(controller.isMuted()).toBeTruthy();
controller.unmute();
expect(controller.isMuted()).toBeFalsy();
});
it('should be unmuted on creation if unmute called first', async () => {
const controller = new MicrophoneController();
controller.unmute();
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
await controller.connect();
expect(controller.isMuted()).toBeFalsy();
});
it('should disconnect', async () => {
const controller = new MicrophoneController();
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
await controller.connect();
expect(controller.isConnected()).toBeTruthy();
await controller.disconnect();
expect(controller.isConnected()).toBeFalsy();
});
it('should automatically disconnect', async () => {
const seconds = 10;
vi.useFakeTimers();
const controller = new MicrophoneController(seconds);
navigatorMock.mediaDevices.getUserMedia.mockReturnValue(createMockStream());
await controller.connect();
expect(controller.isConnected()).toBeTruthy();
vi.advanceTimersByTime(seconds * 1000);
expect(controller.isConnected()).toBeFalsy();
vi.useRealTimers();
});
});
tests/utils/querystring.test.ts
-102
View File
@@ -1,102 +0,0 @@
import { afterEach, describe, expect, it, vi } from 'vitest';
import { getActionsFromQueryString } from '../../src/utils/querystring';
// @vitest-environment jsdom
describe('getActionsFromQueryString', () => {
afterEach(() => {
vi.restoreAllMocks();
});
it('should reject malformed query string', () => {
expect(getActionsFromQueryString(`?BOGUS_KEY=BOGUS_VALUE`)).toEqual([]);
});
it('should accept colon as delimiter', () => {
expect(getActionsFromQueryString(`?frigate-card-action:id:clips=`)).toEqual([
{
action: 'fire-dom-event',
card_id: 'id',
frigate_card_action: 'clips',
},
]);
});
describe('should get simple action from query string', () => {
it.each([
['camera_ui' as const],
['clip' as const],
['clips' as const],
['default' as const],
['diagnostics' as const],
['download' as const],
['expand' as const],
['image' as const],
['live' as const],
['menu_toggle' as const],
['recording' as const],
['recordings' as const],
['snapshot' as const],
['snapshots' as const],
['timeline' as const],
])('%s', (action: string) => {
expect(getActionsFromQueryString(`?frigate-card-action.id.${action}=`)).toEqual([
{
action: 'fire-dom-event',
card_id: 'id',
frigate_card_action: action,
},
]);
});
});
it('should get camera_select action', () => {
expect(
getActionsFromQueryString(`?frigate-card-action.id.camera_select=camera.foo`),
).toEqual([
{
action: 'fire-dom-event',
card_id: 'id',
frigate_card_action: 'camera_select',
camera: 'camera.foo',
},
]);
});
it('should get live_substream_select action', () => {
expect(
getActionsFromQueryString(
`?frigate-card-action.id.live_substream_select=camera.bar`,
),
).toEqual([
{
action: 'fire-dom-event',
card_id: 'id',
frigate_card_action: 'live_substream_select',
camera: 'camera.bar',
},
]);
});
describe('should reject value-based actions without value', () => {
it.each([['camera_select' as const], ['live_substream_select' as const]])(
'%s',
(action: string) => {
expect(getActionsFromQueryString(`?frigate-card-action.id.${action}=`)).toEqual(
[],
);
},
);
});
it('should log unknown but correctly formed action', () => {
const spy = vi.spyOn(global.console, 'warn').mockImplementation(() => true);
expect(
getActionsFromQueryString(`?frigate-card-action.id.not_a_real_action}=`),
).toEqual([]);
expect(spy).toBeCalledWith(
'Frigate card received unknown card action in query string: not_a_real_action',
);
});
});
tests/utils/substream.test.ts
+6 -124
View File
@@ -1,74 +1,8 @@
import { describe, expect, it, vi } from 'vitest';
import { getAllDependentCameras } from '../../src/utils/camera';
import {
createViewWithNextStream,
createViewWithSelectedSubstream,
createViewWithoutSubstream,
hasSubstream,
} from '../../src/utils/substream';
import { describe, expect, it } from 'vitest';
import { getStreamCameraID, hasSubstream } from '../../src/utils/substream';
import { View } from '../../src/view/view';
import { createCameraManager } from '../test-utils';
vi.mock('../../src/camera-manager/manager.js');
vi.mock('../../src/utils/camera');
describe('createViewWithSelectedSubstream', () => {
it('should create view with selected substream', () => {
const view = new View({ view: 'live', camera: 'camera' });
const newView = createViewWithSelectedSubstream(view, 'substream');
expect(newView?.context?.live?.overrides).toEqual(
new Map([['camera', 'substream']]),
);
});
it('should create view with selected substream with existing overrides', () => {
const view = new View({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera', 'camera']]),
},
},
});
const newView = createViewWithSelectedSubstream(view, 'substream');
expect(newView?.context?.live?.overrides).toEqual(
new Map([['camera', 'substream']]),
);
});
});
describe('createViewWithoutSubstream', () => {
it('should create view without substream', () => {
const view = new View({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera', 'camera']]),
},
},
});
const newView = createViewWithoutSubstream(view);
expect(newView?.context?.live?.overrides).toEqual(new Map());
});
it('should create view with overrides untouched', () => {
const view = new View({
view: 'live',
camera: 'camera-1',
context: {
live: {
overrides: new Map([['camera-2', 'camera-3']]),
},
},
});
const newView = createViewWithoutSubstream(view);
expect(newView?.context?.live?.overrides).toEqual(view.context?.live?.overrides);
});
});
describe('hasSubstream', () => {
describe('hasSubstream/getStreamCameraID', () => {
it('should detect substream', () => {
const view = new View({
view: 'live',
@@ -80,6 +14,7 @@ describe('hasSubstream', () => {
},
});
expect(hasSubstream(view)).toBeTruthy();
expect(getStreamCameraID(view)).toBe('camera2');
});
it('should not detect substream when absent', () => {
const view = new View({
@@ -87,6 +22,7 @@ describe('hasSubstream', () => {
camera: 'camera',
});
expect(hasSubstream(view)).toBeFalsy();
expect(getStreamCameraID(view)).toBe('camera');
});
it('should not detect substream when main stream', () => {
const view = new View({
@@ -99,60 +35,6 @@ describe('hasSubstream', () => {
},
});
expect(hasSubstream(view)).toBeFalsy();
});
});
describe('createViewWithNextStream', () => {
it('should create new equal view with no dependencies', () => {
const view = new View({
view: 'live',
camera: 'camera',
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera']));
const cameraManager = createCameraManager();
const newView = createViewWithNextStream(cameraManager, view);
expect(newView.camera).toBe(view.camera);
expect(newView.view).toBe(view.view);
expect(newView.context).toEqual(view.context);
});
it('should create new view with next stream', () => {
const view = new View({
view: 'live',
camera: 'camera',
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera', 'camera2']));
const cameraManager = createCameraManager();
const newView = createViewWithNextStream(cameraManager, view);
expect(newView.context?.live?.overrides).toEqual(new Map([['camera', 'camera2']]));
});
it('should create new view with next stream that cycles back', () => {
const view = new View({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera', 'camera2']]),
},
},
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera', 'camera2']));
const cameraManager = createCameraManager();
const newView = createViewWithNextStream(cameraManager, view);
expect(newView.context?.live?.overrides).toEqual(new Map([['camera', 'camera']]));
});
it('should create new view with first stream with invalid substream', () => {
const view = new View({
view: 'live',
camera: 'camera',
context: {
live: {
overrides: new Map([['camera', 'camera-that-does-not-exist']]),
},
},
});
vi.mocked(getAllDependentCameras).mockReturnValue(new Set(['camera', 'camera2']));
const cameraManager = createCameraManager();
const newView = createViewWithNextStream(cameraManager, view);
expect(newView.context?.live?.overrides).toEqual(new Map([['camera', 'camera']]));
expect(getStreamCameraID(view)).toBe('camera');
});
});
tests/utils/timer.test.ts
+18 -2
View File
@@ -30,6 +30,22 @@ describe('Timer', () => {
expect(handler).toBeCalled();
});
it('should not fire when stopped', () => {
const timer = new Timer();
const handler = vi.fn();
timer.start(10, handler);
expect(timer.isRunning()).toBeTruthy();
expect(handler).not.toBeCalled();
timer.stop();
vi.runOnlyPendingTimers();
expect(timer.isRunning()).toBeFalsy();
expect(handler).not.toBeCalled();
});
it('should fire repeatedly when started', () => {
const timer = new Timer();
const handler = vi.fn();
@@ -49,10 +65,10 @@ describe('Timer', () => {
expect(handler).toBeCalledTimes(2);
});
it('should not fire when stopped', () => {
it('should not fire repeatedly when stopped', () => {
const timer = new Timer();
const handler = vi.fn();
timer.start(10, handler);
timer.startRepeated(10, handler);
expect(timer.isRunning()).toBeTruthy();
expect(handler).not.toBeCalled();