Break apart view.ts into multiple files.

src/components/gallery.ts

@@ -23,7 +23,7 @@ import {
 } from '../utils/ha/browse-media';
 import { changeViewToRecentEventsForCameraAndDependents, changeViewToRecentRecordingForCameraAndDependents } from '../utils/media-to-view.js';
 import { CameraManager } from '../camera/manager.js';
-import { View } from '../view.js';
+import { View } from '../view/view.js';
 import { renderProgressIndicator } from './message.js';
 import './thumbnail.js';
 import { THUMBNAIL_DETAILS_WIDTH_MIN } from './thumbnail.js';

src/components/image.ts

@@ -22,7 +22,7 @@ import {
   createMediaLoadedInfo,
   dispatchExistingMediaLoadedInfoAsEvent,
 } from '../utils/media-info.js';
-import { View } from '../view.js';
+import { View } from '../view/view.js';
 import { dispatchErrorMessageEvent } from './message.js';
 import { contentsChanged } from '../utils/basic.js';
 import isEqual from 'lodash-es/isEqual';

src/components/live/live.ts

@@ -37,7 +37,7 @@ import {
   dispatchExistingMediaLoadedInfoAsEvent,
   dispatchMediaUnloadedEvent,
 } from '../../utils/media-info.js';
-import { dispatchViewContextChangeEvent, View } from '../../view.js';
+import { dispatchViewContextChangeEvent, View } from '../../view/view.js';
 import { AutoMediaPlugin } from './../embla-plugins/automedia.js';
 import { Lazyload } from './../embla-plugins/lazyload.js';
 import {

src/components/surround.ts

@@ -17,7 +17,7 @@ import {
 } from '../types.js';
 import { contentsChanged, dispatchFrigateCardEvent } from '../utils/basic.js';
 import { CameraManager } from '../camera/manager.js';
-import { View } from '../view.js';
+import { View } from '../view/view.js';
 import { ThumbnailCarouselTap } from './thumbnail-carousel.js';
 import './surround-basic.js';
 import { changeViewToRecentEventsForCameraAndDependents } from '../utils/media-to-view';

src/components/thumbnail-carousel.ts

@@ -19,7 +19,8 @@ import {
 } from '../types.js';
 import { stopEventFromActivatingCardWideActions } from '../utils/action.js';
 import { dispatchFrigateCardEvent } from '../utils/basic.js';
-import { MediaQueriesResults, View } from '../view.js';
+import { View } from '../view/view.js';
+import { MediaQueriesResults } from "../view/media-queries-results";
 import { FrigateCardCarousel } from './carousel.js';
 import './thumbnail.js';
 import './carousel.js';

src/components/thumbnail.ts

@@ -13,12 +13,12 @@ import { getDurationString, prettifyTitle } from '../utils/basic.js';
 import { getCameraTitle } from '../utils/camera.js';
 import { renderTask } from '../utils/task.js';
 import { createFetchThumbnailTask } from '../utils/thumbnail.js';
-import { View } from '../view.js';
+import { View } from '../view/view.js';
 import type { MediaSeek } from './viewer.js';
 import { TaskStatus } from '@lit-labs/task';
 
 import type { CameraConfig, ExtendedHomeAssistant } from '../types.js';
-import { ViewMedia } from '../view-media.js';
+import { ViewMedia } from '../view/media.js';
 import { CameraManager } from '../camera/manager.js';
 
 // The minimum width of a thumbnail with details enabled.

src/components/timeline-core.ts

@@ -50,12 +50,15 @@ import {
   generateMediaViewerContext,
 } from '../utils/media-to-view';
 import { CameraManager } from '../camera/manager';
-import { EventMediaQueries, MediaQueries, MediaQueriesClassifier, View } from '../view';
+import { EventMediaQueries, MediaQueries } from "../view/media-queries";
+import { MediaQueriesClassifier } from "../view/media-queries-classifier";
 import { dispatchMessageEvent } from './message.js';
 import './thumbnail.js';
 import { FrigateCardTimelineItem, TimelineDataSource } from '../utils/timeline-source';
-import { ViewMedia, ViewMediaClassifier } from '../view-media';
+import { ViewMedia } from '../view/media';
+import { ViewMediaClassifier } from "../view/media-classifier";
 import { rangesOverlap } from '../camera/range';
+import { View } from '../view/view';
 
 interface FrigateCardGroupData {
   id: string;

src/components/timeline.ts

@@ -3,7 +3,7 @@ import { customElement, property } from 'lit/decorators.js';
 import timelineStyle from '../scss/timeline.scss';
 import { CameraConfig, ExtendedHomeAssistant, TimelineConfig } from '../types';
 import { CameraManager } from '../camera/manager';
-import { View } from '../view';
+import { View } from '../view/view';
 import './surround.js';
 import './timeline-core.js';
 

src/components/viewer.ts

@@ -30,7 +30,9 @@ import { stopEventFromActivatingCardWideActions } from '../utils/action.js';
 import { contentsChanged } from '../utils/basic.js';
 import { getFullDependentBrowseMediaQueryParametersOrDispatchError } from '../utils/ha/browse-media.js';
 import { ResolvedMediaCache, resolveMedia } from '../utils/ha/resolved-media.js';
-import { MediaQueriesClassifier, MediaQueriesResults, View } from '../view.js';
+import { View } from '../view/view.js';
+import { MediaQueriesResults } from "../view/media-queries-results";
+import { MediaQueriesClassifier } from "../view/media-queries-classifier";
 import { AutoMediaPlugin } from './embla-plugins/automedia.js';
 import { Lazyload } from './embla-plugins/lazyload.js';
 import {
@@ -51,7 +53,8 @@ import {
   changeViewToRecentEventsForCameraAndDependents,
   changeViewToRecentRecordingForCameraAndDependents,
 } from '../utils/media-to-view.js';
-import { ViewMedia, ViewMediaClassifier } from '../view-media.js';
+import { ViewMedia } from '../view/media.js';
+import { ViewMediaClassifier } from "../view/media-classifier";
 import { guard } from 'lit/directives/guard.js';
 import { localize } from '../localize/localize.js';