Skip to content

Commit

Permalink
feat: support watts and kilowats (#18)
Browse files Browse the repository at this point in the history 
* baseline all values in watts
* support configuration and display of watts
  • Loading branch information
@ulic75
ulic75 authored May 9, 2022
1 parent 3611944 commit 9596eeb
Show file tree
Hide file tree
Showing 3 changed files with 45 additions and 39 deletions.
17 changes: 10 additions & 7 deletions README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -48,15 +48,18 @@ I recommend looking at the [Example usage section](#example-usage) to understand

#### Card options

| Name | Type | Default | Description |
| ------------- | -------- | :----------: | --------------------------------------------------------------------------------------------------------------------------------------- |
| type | `string` | **required** | `custom:power-flow-card`. |
| entities | `object` | **required** | One or more sensor entities, see [entities object](#entities-object) for additional entity options. |
| min_flow_rate | `number` | .75 | Represents the fastest amount of time in seconds for a flow dot to travel from one end to the other, see [flow formula](#flow-formula). |
| max_flow_rate | `number` | 6 | Represents the slowest amount of time in seconds for a flow dot to travel from one end to the other, see [flow formula](#flow-formula). |
| Name | Type | Default | Description |
| -------------- | -------- | :----------: | --------------------------------------------------------------------------------------------------------------------------------------- |
| type | `string` | **required** | `custom:power-flow-card`. |
| entities | `object` | **required** | One or more sensor entities, see [entities object](#entities-object) for additional entity options. |
| min_flow_rate | `number` | .75 | Represents the fastest amount of time in seconds for a flow dot to travel from one end to the other, see [flow formula](#flow-formula). |
| max_flow_rate | `number` | 6 | Represents the slowest amount of time in seconds for a flow dot to travel from one end to the other, see [flow formula](#flow-formula). |
| watt_threshold | `number` | 0 | The number of watts to display before converting to and displaying kilowatts. Setting of 0 will always display in kilowatts. |

#### Entities object

All entites (except _battery_charge_) should have a `unit_of_measurement` attribute of W(watts) or kW(kilowatts).

| Name | Type | Default | Description |
| -------------- | :------------------ | ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| grid | `string` / `object` | **required** | Entity ID of a sensor supporting a single state with negative values for production and positive values for consumption or an object for [split entites](#split-entities). Examples of both can be found below. |
Expand All @@ -66,7 +69,7 @@ I recommend looking at the [Example usage section](#example-usage) to understand

#### Split entities

Can be use with either Grid or Battery configuration
Can be use with either Grid or Battery configuration. The same `unit_of_measurement` rule as above applies.

| Name | Type | Default | Description |
| ----------- | -------- | --------------------- | ------------------------------------------------------------------------------------------------- |
Expand Down
1 change: 1 addition & 0 deletions src/power-flow-card-config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,4 +19,5 @@ export interface PowerFlowCardConfig extends LovelaceCardConfig {
};
min_flow_rate: number;
max_flow_rate: number;
watt_threshold: number;
}
66 changes: 34 additions & 32 deletions src/power-flow-card.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,6 +40,7 @@ export class PowerFlowCard extends LitElement {
...config,
min_flow_rate: config.min_flow_rate ?? MIN_FLOW_RATE,
max_flow_rate: config.max_flow_rate ?? MAX_FLOW_RATE,
watt_threshold: config.watt_threshold ?? 0,
};
}

Expand All @@ -60,6 +61,19 @@ export class PowerFlowCard extends LitElement {
return coerceNumber(this.hass.states[entity].state);
};

private getEntityStateWatts = (entity: string | undefined): number => {
if (!entity) return 0;
const stateObj = this.hass.states[entity];
const value = coerceNumber(stateObj.state);
if (stateObj.attributes.unit_of_measurement === "W") return value;
return value * 1000;
};

private displayValue = (value: number) =>
value >= coerceNumber(this._config?.watt_threshold, 0)
? `${roundValue(value / 1000, 1)} kW`
: `${value} W`;

protected render(): TemplateResult {
if (!this._config || !this.hass) {
return html``;
Expand All @@ -75,40 +89,30 @@ export class PowerFlowCard extends LitElement {
const batteryChargeState = entities.battery_charge?.length
? this.getEntityState(entities.battery_charge)
: null;
const solarState = this.getEntityState(entities.solar);
const solarState = this.getEntityStateWatts(entities.solar);

const solarToGrid = hasReturnToGrid
? roundValue(
typeof entities.grid === "string"
? Math.abs(Math.min(this.getEntityState(entities.grid), 0))
: this.getEntityState(entities.grid.production),
1
)
? typeof entities.grid === "string"
? Math.abs(Math.min(this.getEntityStateWatts(entities.grid), 0))
: this.getEntityStateWatts(entities.grid.production)
: 0;

const batteryToHome = roundValue(
const batteryToHome =
typeof entities.battery === "string"
? Math.max(this.getEntityState(entities.battery), 0)
: this.getEntityState(entities.battery?.consumption),
1
);
? Math.max(this.getEntityStateWatts(entities.battery), 0)
: this.getEntityStateWatts(entities.battery?.consumption);

const gridToHome = roundValue(
const gridToHome =
typeof entities.grid === "string"
? Math.max(this.getEntityState(entities.grid), 0)
: this.getEntityState(entities.grid.consumption),
1
);
? Math.max(this.getEntityStateWatts(entities.grid), 0)
: this.getEntityStateWatts(entities.grid.consumption);

const solarToBattery = roundValue(
const solarToBattery =
typeof entities.battery === "string"
? Math.abs(Math.min(this.getEntityState(entities.battery), 0))
: this.getEntityState(entities.battery?.production),
1
);
? Math.abs(Math.min(this.getEntityStateWatts(entities.battery), 0))
: this.getEntityStateWatts(entities.battery?.production);

const solarToHome =
roundValue(solarState, 1) - solarToGrid - solarToBattery;
const solarToHome = solarState - solarToGrid - solarToBattery;

const homeConsumption = batteryToHome + gridToHome + solarToHome;
const totalConsumption = homeConsumption + solarToBattery + solarToGrid;
Expand Down Expand Up @@ -180,9 +184,7 @@ export class PowerFlowCard extends LitElement {
>
<div class="circle">
<ha-svg-icon .path=${mdiSolarPower}></ha-svg-icon>
<span class="solar">
${roundValue(solarState ?? 0, 1)} kW</span
>
<span class="solar"> ${this.displayValue(solarState)}</span>
</div>
</div>`
: html``}
Expand All @@ -196,15 +198,15 @@ export class PowerFlowCard extends LitElement {
class="small"
.path=${mdiArrowLeft}
></ha-svg-icon
>${roundValue(solarToGrid, 1)} kW
>${this.displayValue(solarToGrid)}
</span>`
: null}
<span class="consumption">
<ha-svg-icon
class="small"
.path=${mdiArrowRight}
></ha-svg-icon
>${roundValue(gridToHome, 1)} kW
>${this.displayValue(gridToHome)}
</span>
</div>
<span class="label"
Expand All @@ -220,7 +222,7 @@ export class PowerFlowCard extends LitElement {
})}"
>
<ha-svg-icon .path=${mdiHome}></ha-svg-icon>
${roundValue(homeConsumption, 1)} kW
${this.displayValue(homeConsumption)}
${homeSolarCircumference !== undefined
? html`<svg>
${homeSolarCircumference !== undefined
Expand Down Expand Up @@ -300,14 +302,14 @@ export class PowerFlowCard extends LitElement {
class="small"
.path=${mdiArrowDown}
></ha-svg-icon
>${roundValue(solarToBattery, 1)} kW</span
>${this.displayValue(solarToBattery)}</span
>
<span class="battery-out">
<ha-svg-icon
class="small"
.path=${mdiArrowUp}
></ha-svg-icon
>${roundValue(batteryToHome, 1)} kW</span
>${this.displayValue(batteryToHome)}</span
>
</div>
<span class="label"
Expand Down

0 comments on commit 9596eeb

Please sign in to comment.