Add option to disable next/prev controls.

README.md

@@ -72,6 +72,7 @@ lovelace:
 | ------------- | --------------------------------------------- | - |
 | `menu_mode` | `hidden-top` | The menu mode to show by default. See [menu modes](#menu-modes) below.|
 | `menu_buttons.{frigate, live, clips, snapshots, frigate_ui}` | `true` | Whether or not to show these builtin actions in the card menu. |
+| `controls.nextprev` | `true` | Whether or not to show the next and previous controls when viewing media. |
 
 ### Advanced
 

src/editor.ts

@@ -300,6 +300,18 @@ export class FrigateCardEditor extends LitElement implements LovelaceCardEditor
                   @change=${this._valueChanged}
                 ></ha-switch>
               </ha-formfield>
+              <br />
+              <ha-formfield
+                .label=${localize('editor.show_control') +
+                ': ' +
+                localize('control.nextprev')}
+              >
+                <ha-switch
+                  .checked=${this._config?.controls?.nextprev ?? true}
+                  .configValue=${'controls.nextprev'}
+                  @change=${this._valueChanged}
+                ></ha-switch>
+              </ha-formfield>
               <br />`
           : ''}
         <div class="option" @click=${this._toggleOption} .option=${'advanced'}>

src/frigate-hass-card.ts

@@ -767,7 +767,9 @@ export class FrigateCard extends LitElement {
     const neighbors = this._getMediaNeighbors(parent, childIndex);
 
     return html`
-      ${neighbors?.previous && neighbors.previous.thumbnail
+      ${(this.config.controls?.nextprev ?? true) &&
+      neighbors?.previous &&
+      neighbors.previous.thumbnail
         ? html`<img
             src="${neighbors.previous.thumbnail}"
             class="frigate-media-controls previous"
@@ -831,7 +833,9 @@ export class FrigateCard extends LitElement {
               });
             }}
           />`}
-      ${neighbors?.next && neighbors.next.thumbnail
+      ${(this.config.controls?.nextprev ?? true) &&
+      neighbors?.next &&
+      neighbors.next.thumbnail
         ? html`<img
             src="${neighbors.next.thumbnail}"
             class="frigate-media-controls next"

src/localize/languages/en.json

@@ -32,7 +32,8 @@
     "show_button": "Show button",
     "zone": "Zone",
     "label": "Frigate label/object filter (Optional)",
-    "live_provider": "Live view provider (Optional)"
+    "live_provider": "Live view provider (Optional)",
+    "show_control": "Show control"
   },
   "menu": {
     "frigate": "Frigate Menu / Default View",
@@ -43,6 +44,9 @@
     "snapshot": "Latest Snapshot",
     "frigate_ui": "Frigate User Interface"
   },
+  "control": {
+    "nextprev": "Media Next & Previous"
+  },
   "menu_mode": {
     "none": "No menu",
     "hidden-top": "Hidden Top",

src/types.ts

@@ -74,6 +74,9 @@ export const frigateCardConfigSchema = z.object({
     show: z.boolean().default(true),
     icon: z.string().optional(),
   }).array().optional(),
+  controls: z.object({
+    nextprev: z.boolean().default(true),
+  }).optional(),
 
   // Stock lovelace card config.
   type: z.string(),