Add download control to thumbnails.

src/editor.ts

@@ -12,7 +12,6 @@ import {
   upgradeConfig,
 } from './config-mgmt.js';
 import {
-  CONF_CAMERAS,
   CONF_CAMERAS_ARRAY_CAMERA_ENTITY,
   CONF_CAMERAS_ARRAY_DEPENDENCIES_ALL_CAMERAS,
   CONF_CAMERAS_ARRAY_DEPENDENCIES_CAMERAS,
@@ -21,9 +20,13 @@ import {
   CONF_CAMERAS_ARRAY_FRIGATE_LABELS,
   CONF_CAMERAS_ARRAY_FRIGATE_URL,
   CONF_CAMERAS_ARRAY_FRIGATE_ZONES,
+  CONF_CAMERAS_ARRAY_GO2RTC_MODES,
+  CONF_CAMERAS_ARRAY_GO2RTC_STREAM,
+  CONF_CAMERAS_ARRAY_HIDE,
   CONF_CAMERAS_ARRAY_ICON,
   CONF_CAMERAS_ARRAY_ID,
   CONF_CAMERAS_ARRAY_IMAGE_REFRESH_SECONDS,
+  CONF_CAMERAS_ARRAY_IMAGE_URL,
   CONF_CAMERAS_ARRAY_LIVE_PROVIDER,
   CONF_CAMERAS_ARRAY_TITLE,
   CONF_CAMERAS_ARRAY_TRIGGERS_ENTITIES,
@@ -31,13 +34,9 @@ import {
   CONF_CAMERAS_ARRAY_TRIGGERS_OCCUPANCY,
   CONF_CAMERAS_ARRAY_WEBRTC_CARD_ENTITY,
   CONF_CAMERAS_ARRAY_WEBRTC_CARD_URL,
-  CONF_DIMENSIONS_ASPECT_RATIO,
+  CONF_CAMERAS,
   CONF_DIMENSIONS_ASPECT_RATIO_MODE,
-  CONF_MEDIA_GALLERY_CONTROLS_FILTER_MODE,
-  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_DETAILS,
-  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
-  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
-  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SIZE,
+  CONF_DIMENSIONS_ASPECT_RATIO,
   CONF_IMAGE_LAYOUT_FIT,
   CONF_IMAGE_LAYOUT_POSITION_X,
   CONF_IMAGE_LAYOUT_POSITION_Y,
@@ -53,6 +52,7 @@ import {
   CONF_LIVE_CONTROLS_THUMBNAILS_MEDIA,
   CONF_LIVE_CONTROLS_THUMBNAILS_MODE,
   CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_DETAILS,
+  CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
   CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
   CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
   CONF_LIVE_CONTROLS_THUMBNAILS_SIZE,
@@ -72,15 +72,21 @@ import {
   CONF_LIVE_PRELOAD,
   CONF_LIVE_SHOW_IMAGE_DURING_LOAD,
   CONF_LIVE_TRANSITION_EFFECT,
+  CONF_MEDIA_GALLERY_CONTROLS_FILTER_MODE,
+  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_DETAILS,
+  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
+  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
+  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
+  CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SIZE,
   CONF_MEDIA_VIEWER_AUTO_MUTE,
   CONF_MEDIA_VIEWER_AUTO_PAUSE,
   CONF_MEDIA_VIEWER_AUTO_PLAY,
   CONF_MEDIA_VIEWER_AUTO_UNMUTE,
-  CONF_MEDIA_VIEWER_SNAPSHOT_CLICK_PLAYS_CLIP,
   CONF_MEDIA_VIEWER_CONTROLS_NEXT_PREVIOUS_SIZE,
   CONF_MEDIA_VIEWER_CONTROLS_NEXT_PREVIOUS_STYLE,
   CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_MODE,
   CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_DETAILS,
+  CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
   CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
   CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
   CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SIZE,
@@ -96,19 +102,22 @@ import {
   CONF_MEDIA_VIEWER_LAYOUT_POSITION_X,
   CONF_MEDIA_VIEWER_LAYOUT_POSITION_Y,
   CONF_MEDIA_VIEWER_LAZY_LOAD,
+  CONF_MEDIA_VIEWER_SNAPSHOT_CLICK_PLAYS_CLIP,
   CONF_MEDIA_VIEWER_TRANSITION_EFFECT,
   CONF_MENU_ALIGNMENT,
-  CONF_MENU_BUTTONS,
   CONF_MENU_BUTTON_SIZE,
+  CONF_MENU_BUTTONS,
   CONF_MENU_POSITION,
   CONF_MENU_STYLE,
   CONF_PERFORMANCE_FEATURES_ANIMATED_PROGRESS_INDICATOR,
+  CONF_PERFORMANCE_FEATURES_MEDIA_CHUNK_SIZE,
   CONF_PERFORMANCE_PROFILE,
   CONF_PERFORMANCE_STYLE_BORDER_RADIUS,
   CONF_PERFORMANCE_STYLE_BOX_SHADOW,
   CONF_TIMELINE_CLUSTERING_THRESHOLD,
   CONF_TIMELINE_CONTROLS_THUMBNAILS_MODE,
   CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_DETAILS,
+  CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
   CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
   CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
   CONF_TIMELINE_CONTROLS_THUMBNAILS_SIZE,
@@ -118,29 +127,24 @@ import {
   CONF_VIEW_CAMERA_SELECT,
   CONF_VIEW_DARK_MODE,
   CONF_VIEW_DEFAULT,
-  CONF_VIEW_SCAN,
   CONF_VIEW_SCAN_ENABLED,
   CONF_VIEW_SCAN_SHOW_TRIGGER_STATUS,
   CONF_VIEW_SCAN_UNTRIGGER_RESET,
   CONF_VIEW_SCAN_UNTRIGGER_SECONDS,
+  CONF_VIEW_SCAN,
   CONF_VIEW_TIMEOUT_SECONDS,
   CONF_VIEW_UPDATE_CYCLE_CAMERA,
   CONF_VIEW_UPDATE_FORCE,
   CONF_VIEW_UPDATE_SECONDS,
-  CONF_PERFORMANCE_FEATURES_MEDIA_CHUNK_SIZE,
   MEDIA_CHUNK_SIZE_MAX,
-  CONF_CAMERAS_ARRAY_GO2RTC_MODES,
-  CONF_CAMERAS_ARRAY_GO2RTC_STREAM,
-  CONF_CAMERAS_ARRAY_HIDE,
-  CONF_CAMERAS_ARRAY_IMAGE_URL,
 } from './const.js';
 import { localize } from './localize/localize.js';
 import frigate_card_editor_style from './scss/editor.scss';
 import {
   BUTTON_SIZE_MIN,
+  FRIGATE_MENU_PRIORITY_MAX,
   FrigateCardConfig,
   frigateCardConfigDefaults,
-  FRIGATE_MENU_PRIORITY_MAX,
   RawFrigateCardConfig,
   RawFrigateCardConfigArray,
   THUMBNAIL_WIDTH_MAX,
@@ -1072,10 +1076,12 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
     configPathShowDetails: string,
     configPathShowFavoriteControl: string,
     configPathShowTimelineControl: string,
+    configPathShowDownloadControl: string,
     defaults: {
       show_details: boolean;
       show_favorite_control: boolean;
       show_timeline_control: boolean;
+      show_download_control: boolean;
     },
     options?: {
       configPathMedia?: string;
@@ -1128,6 +1134,13 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
             label: localize('config.common.controls.thumbnails.show_timeline_control'),
           },
         )}
+        ${this._renderSwitch(
+          configPathShowDownloadControl,
+          defaults.show_download_control,
+          {
+            label: localize('config.common.controls.thumbnails.show_download_control'),
+          },
+        )}
       `,
     );
   }
@@ -1733,6 +1746,7 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
                       CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_DETAILS,
                       CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
                       CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
+                      CONF_LIVE_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
                       this._defaults.live.controls.thumbnails,
                       {
                         configPathMedia: CONF_LIVE_CONTROLS_THUMBNAILS_MEDIA,
@@ -1774,6 +1788,7 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
                 CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_DETAILS,
                 CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
                 CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
+                CONF_MEDIA_GALLERY_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
                 this._defaults.media_gallery.controls.thumbnails,
               )}
               ${this._renderFilterControls(
@@ -1837,6 +1852,7 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
                     CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_DETAILS,
                     CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
                     CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
+                    CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
                     this._defaults.media_viewer.controls.thumbnails,
                     {
                       configPathMode: CONF_MEDIA_VIEWER_CONTROLS_THUMBNAILS_MODE,
@@ -1898,6 +1914,7 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
                 CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_DETAILS,
                 CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_FAVORITE_CONTROL,
                 CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_TIMELINE_CONTROL,
+                CONF_TIMELINE_CONTROLS_THUMBNAILS_SHOW_DOWNLOAD_CONTROL,
                 this._defaults.timeline.controls.thumbnails,
                 {
                   configPathMode: CONF_TIMELINE_CONTROLS_THUMBNAILS_MODE,