Skip to content

Commit

Permalink
Merge pull request #51 from molikk/essential-load-item-reorder
Browse files Browse the repository at this point in the history 
essential load item reorder
  • Loading branch information
@molikk
molikk authored Aug 6, 2024
2 parents d6ef283 + 7c86aa1 commit d8bf8ed
Show file tree
Hide file tree
Showing 8 changed files with 715 additions and 562 deletions.
6 changes: 3 additions & 3 deletions dist/mlk-power-flow-card.js
View file

Large diffs are not rendered by default.

10 changes: 8 additions & 2 deletions src/cards/compact-card.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,8 +22,9 @@ export const compactCard = (config: PowerFlowCardConfig, inverterImg: string, da
let miny = config.viewbox?.viewbox_min_y ? config.viewbox.viewbox_min_y : ((config.show_solar || data.additionalLoad > 6) ? 0 : (data.additionalLoad > 0 || !config.show_battery ? 80 : 146));
let width = config.viewbox?.viewbox_width
? config.viewbox.viewbox_width
:(config.load.aux_loads > 3 || data.additionalLoad > 13) ? 600
: (config.load.aux_loads > 2 || data.additionalLoad > 8) ? 552 : 505;
:(config.load.aux_loads > 4 || data.additionalLoad > 18) ? 648
:(config.load.aux_loads > 3 || data.additionalLoad > 13) ? 600
: (config.load.aux_loads > 2 || data.additionalLoad > 8) ? 552 : 505;

let height = config.viewbox?.viewbox_height ? config.viewbox.viewbox_height : (config.show_solar ? (config.show_battery ? 408 : (data.additionalLoad >= 2 ? 400 : 300)) : (config.show_battery ? (data.additionalLoad > 0 ? 350 : 271) : 271));

Expand Down Expand Up @@ -124,6 +125,11 @@ export const compactCard = (config: PowerFlowCardConfig, inverterImg: string, da
${EssentialLoad.generateLoad16(data, config)}
${EssentialLoad.generateLoad17(data, config)}
${EssentialLoad.generateLoad18(data, config)}
${EssentialLoad.generateLoad19(data, config)}
${EssentialLoad.generateLoad20(data, config)}
${EssentialLoad.generateLoad21(data, config)}
${EssentialLoad.generateLoad22(data, config)}
${EssentialLoad.generateLoad23(data, config)}
` : ``
}
Expand Down
123 changes: 104 additions & 19 deletions src/cards/compact/essentialLoad.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ export class EssentialLoad {
const extraColumn2 = this.mainX + 45;

const icon1_big = LoadUtils.getIconWithCondition(data.additionalLoad <= 3, iconBig, isAux ? 113 : 95, data.iconEssentialLoad1, 'essload1-icon', 36);
const icon1_big_link = LoadUtils.getIconLink(config.entities.essential_load1_toggle, icon1_big);
const icon1_big_link = LoadUtils.getIconLink(data.stateEssentialLoad1Toggle.entity_id, icon1_big);


return svg`${data.additionalLoad >= 4 ?
Expand All @@ -79,17 +79,17 @@ export class EssentialLoad {
fill="${data.dynamicColourEssentialLoad1}">
${config.load?.load1_name ? `${config.load.load1_name}` : ''}
</text>
<a href="#" @click=${(e) => Utils.handlePopup(e, config.entities.essential_load1)}>
<a href="#" @click=${(e) => Utils.handlePopup(e, data.stateEssentialLoad1.entity_id)}>
<text id="ess_load1" x="${powerColumn0}" y="${isAux ? '158' : '143'}"
display="${data.additionalLoad <= 3 && data.stateEssentialLoad1.isValid() ? '' : 'none'}"
class="${data.largeFont !== true ? 'st14' : 'st4'} st8"
fill="${data.dynamicColourEssentialLoad1}">
${data.stateEssentialLoad1?.toPowerString(config.load.auto_scale, data.decimalPlaces)}
</text>
</a>
<a href="#" @click=${(e) => Utils.handlePopup(e, config.entities.essential_load1_extra)}>
<a href="#" @click=${(e) => Utils.handlePopup(e, data.stateEssentialLoad1Extra.entity_id)}>
<text id="ess_load1_extra" x="${extraColumn2}" y="${isAux ? '182' : '167'}"
display="${(config.entities?.essential_load1_extra && data.additionalLoad <= 3) && data.stateEssentialLoad1Extra.isValid() ? '' : 'none'}"
display="${(data.stateEssentialLoad1Extra.entity_id && data.additionalLoad <= 3) && data.stateEssentialLoad1Extra.isValid() ? '' : 'none'}"
class="st3 left-align" fill="${data.dynamicColourEssentialLoad1}">
${data.stateEssentialLoad1Extra.toNum(1)}
${data.stateEssentialLoad1Extra.getUOM()}
Expand All @@ -108,7 +108,7 @@ export class EssentialLoad {
const extraColumn2 = this.mainX + 45;

const icon2_big = LoadUtils.getIcon(iconBig, 250, data.iconEssentialLoad2, 'essload2-icon', 36);
const icon2_big_link = LoadUtils.getIconLink(config.entities.essential_load2_toggle, icon2_big);
const icon2_big_link = LoadUtils.getIconLink(data.stateEssentialLoad2Toggle.entity_id, icon2_big);

return svg`${data.additionalLoad >= 4 ?
svg`
Expand Down Expand Up @@ -142,15 +142,15 @@ export class EssentialLoad {
fill="${data.dynamicColourEssentialLoad2}">
${config.load?.load2_name ? `${config.load.load2_name}` : ''}
</text>
<a href="#" @click=${(e) => Utils.handlePopup(e, config.entities.essential_load2)}>
<a href="#" @click=${(e) => Utils.handlePopup(e, data.stateEssentialLoad2.entity_id)}>
<text id="ess_load2" x="${powerColumn0}" y="302.5"
display="${data.stateEssentialLoad2.isValid() ? '' : 'none'}"
class="${data.largeFont !== true ? 'st14' : 'st4'} st8"
fill="${data.dynamicColourEssentialLoad2}">
${data.stateEssentialLoad2?.toPowerString(config.load.auto_scale, data.decimalPlaces)}
</text>
</a>
<a href="#" @click=${(e) => Utils.handlePopup(e, config.entities.essential_load2_extra)}>
<a href="#" @click=${(e) => Utils.handlePopup(e, data.stateEssentialLoad2Extra.entity_id)}>
<text id="ess_load2_extra" x="${extraColumn2}" y="278"
display="${data.stateEssentialLoad2Extra.isValid() ? '' : 'none'}"
class="st3 left-align" fill="${data.dynamicColourEssentialLoad2}">
Expand Down Expand Up @@ -281,10 +281,9 @@ export class EssentialLoad {
}`;
}


static generateLoad9(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 9 ?
return svg`${data.additionalLoad >= 9 && !config.load.show_aux ?
svg`
${LoadUtils.generateEssentialLoad(9, data.iconEssentialLoad9,
data.dynamicColourEssentialLoad9,
Expand All @@ -293,7 +292,7 @@ export class EssentialLoad {
data.stateEssentialLoad9Extra,
data.stateEssentialLoad9Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column3, Load.row3,
Load.column3, Load.row1,
)}`
: svg``
}`;
Expand Down Expand Up @@ -327,7 +326,7 @@ export class EssentialLoad {
data.stateEssentialLoad11Extra,
data.stateEssentialLoad11Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column3, Load.row4,
Load.column3, Load.row3,
)}`
: svg``
}`;
Expand All @@ -344,15 +343,15 @@ export class EssentialLoad {
data.stateEssentialLoad12Extra,
data.stateEssentialLoad12Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column3, Load.row5,
Load.column3, Load.row4,
)}`
: svg``
}`;
}

static generateLoad13(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 13 && !config.load.show_aux ?
return svg`${data.additionalLoad >= 13 ?
svg`
${LoadUtils.generateEssentialLoad(13, data.iconEssentialLoad13,
data.dynamicColourEssentialLoad13,
Expand All @@ -361,15 +360,15 @@ export class EssentialLoad {
data.stateEssentialLoad13Extra,
data.stateEssentialLoad13Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column3, Load.row1,
Load.column3, Load.row5,
)}`
: svg``
}`;
}

static generateLoad14(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 14 ?
return svg`${data.additionalLoad >= 14 && !config.load.show_aux ?
svg`
${LoadUtils.generateEssentialLoad(14, data.iconEssentialLoad14,
data.dynamicColourEssentialLoad14,
Expand All @@ -378,7 +377,7 @@ export class EssentialLoad {
data.stateEssentialLoad14Extra,
data.stateEssentialLoad14Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column4, Load.row3,
Load.column4, Load.row1,
)}`
: svg``
}`;
Expand Down Expand Up @@ -412,7 +411,7 @@ export class EssentialLoad {
data.stateEssentialLoad16Extra,
data.stateEssentialLoad16Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column4, Load.row4,
Load.column4, Load.row3,
)}`
: svg``
}`;
Expand All @@ -429,7 +428,7 @@ export class EssentialLoad {
data.stateEssentialLoad17Extra,
data.stateEssentialLoad17Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column4, Load.row5,
Load.column4, Load.row4,
)}`
: svg``
}`;
Expand All @@ -446,7 +445,93 @@ export class EssentialLoad {
data.stateEssentialLoad18Extra,
data.stateEssentialLoad18Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column4, Load.row1,
Load.column4, Load.row5,
)}`
: svg``
}`;
}


static generateLoad19(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 19 && !config.load.show_aux ?
svg`
${LoadUtils.generateEssentialLoad(19, data.iconEssentialLoad19,
data.dynamicColourEssentialLoad19,
config.load?.load19_name,
data.stateEssentialLoad19,
data.stateEssentialLoad19Extra,
data.stateEssentialLoad19Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column5, Load.row1,
)}`
: svg``
}`;
}

static generateLoad20(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 20 ?
svg`
${LoadUtils.generateEssentialLoad(20, data.iconEssentialLoad20,
data.dynamicColourEssentialLoad20,
config.load?.load20_name,
data.stateEssentialLoad20,
data.stateEssentialLoad20Extra,
data.stateEssentialLoad20Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column5, Load.row2,
)}`
: svg``
}`;
}

static generateLoad21(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 21 ?
svg`
${LoadUtils.generateEssentialLoad(21, data.iconEssentialLoad21,
data.dynamicColourEssentialLoad21,
config.load?.load21_name,
data.stateEssentialLoad21,
data.stateEssentialLoad21Extra,
data.stateEssentialLoad21Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column5, Load.row3,
)}`
: svg``
}`;
}

static generateLoad22(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 22 ?
svg`
${LoadUtils.generateEssentialLoad(22, data.iconEssentialLoad22,
data.dynamicColourEssentialLoad22,
config.load?.load22_name,
data.stateEssentialLoad22,
data.stateEssentialLoad22Extra,
data.stateEssentialLoad22Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column5, Load.row4,
)}`
: svg``
}`;
}

static generateLoad23(data: DataDto, config: PowerFlowCardConfig) {

return svg`${data.additionalLoad >= 23 ?
svg`
${LoadUtils.generateEssentialLoad(23, data.iconEssentialLoad23,
data.dynamicColourEssentialLoad23,
config.load?.load23_name,
data.stateEssentialLoad23,
data.stateEssentialLoad23Extra,
data.stateEssentialLoad23Toggle,
config.load.auto_scale, data.decimalPlaces,
Load.column5, Load.row5,
)}`
: svg``
}`;
Expand Down
1 change: 1 addition & 0 deletions src/cards/compact/load.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ export class Load {
public static readonly column2: number = Load.LOAD_X;
public static readonly column3: number = Load.column2 + 43 + Load.GAP / 2;
public static readonly column4: number = Load.column3 + 43 + Load.GAP / 2;
public static readonly column5: number = Load.column4 + 43 + Load.GAP / 2;
public static readonly yGaps = [26, 55, 37, 67]; //shape, name, power, energy
public static readonly xGaps = [53, 43, 63.5]; //icon, shape, names

Expand Down
2 changes: 1 addition & 1 deletion src/const.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@ import { version } from '../package.json';

export const CARD_VERSION = version;

export const validLoadValues = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18];
export const validLoadValues = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23];
export const validNonLoadValues = [0, 1, 2, 3];
export const valid3phase = [true, false];
export const validAux = [true, false];
Expand Down
2 changes: 1 addition & 1 deletion src/editor.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -256,7 +256,7 @@ export class ConfigurationCardEditor extends LitElement implements LovelaceCardE
{ name: 'dynamic_icon', selector: { boolean: {} } },
{ name: 'invert_load', selector: { boolean: {} } },
{ name: 'essential_name', selector: { text: {} } },
{ name: 'additional_loads', selector: { number: { mode: 'box', min: 0, max: 18 } } },
{ name: 'additional_loads', selector: { number: { mode: 'box', min: 0, max: 23 } } },
{ name: 'animation_speed', selector: { number: {} } },
{ name: 'max_power', selector: { number: {} } },
{ name: 'off_threshold', selector: { number: {} } },
Expand Down
Loading

0 comments on commit d8bf8ed

Please sign in to comment.