Skip to content

Instantly share code, notes, and snippets.

@zsarnett
Last active January 3, 2023 19:52
Show Gist options
  • Save zsarnett/4ff042232cdddde80642354d374ca83a to your computer and use it in GitHub Desktop.
Save zsarnett/4ff042232cdddde80642354d374ca83a to your computer and use it in GitHub Desktop.
Camera strategy to show all cameras on a view
/*
Camera strategy that shows all of your Cameras.
To use:
- store this file in `<config>/www/camera_strategy.js`
- Add lovelace resource: `/local/camera_strategy.js`, type JavaScript Module
- Create a new Lovelace dashboard and set as content:
views:
- title: Cameras
strategy:
type: 'custom:camera-view'
options:
cardOptions:
aspect_ratio: "16x9",
*/
const stateObj2Card = (stateObj, strategyOptions) => {
return {
show_state: false,
show_name: false,
camera_view: "live",
type: "picture-entity",
aspect_ratio: "16x9",
entity: stateObj.entity_id,
...strategyOptions.cardOptions,
};
};
class CameraStrategy {
static async generateView(info) {
const strategyOptions = info.view.strategy.options || {};
let states = Object.values(info.hass.states).filter(
(stateObj) =>
stateObj.entity_id.startsWith("camera.")
);
const cards = states.map((stateObj) => stateObj2Card(stateObj, strategyOptions));
return {
cards,
};
}
}
customElements.define("ll-strategy-camera-view", CameraStrategy);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment