`;
}
protected _renderDebug() {
if (!this.config.debug) return undefined;
const state = this.hass!.states[this.config.entity!];
let stMode: string = 'err'
let guess_mode: string = 'err'
let remaining: number | undefined
let warn_active = false
let aoMode: string = 'err'
let duration: string = 'err'
let err: string = ''
try {
guess_mode = this.config.guess_mode ? 'guessed' : 'explicit';
remaining = this._mode() != 'idle' ? timerTimeRemaining(this.hass!, this.config, state, this._browserClockCorrection) : undefined
warn_active = !!remaining && remaining > 0 && this._mode() != 'active';
stMode = stateMode(this.hass!, this.config, this._browserClockCorrection) || 'N/A';
aoMode = autoMode(this.hass!, this.config, this._browserClockCorrection) || 'N/A';
duration = findDuration(this.hass!, this.config, state)
} catch (e) {
err = 'Error calculating duration:' + e
}
return html`
State: ${state?.state ?? 'No entity specified'} (state mode = ${stMode})
Mode: ${this._mode()} (${guess_mode}; guess mode produces ${aoMode})
Duration: ${duration} second
Time remaining: ${remaining}
Counter: ${this._timeRemaining}
${warn_active ? html`Did you set active_state?` : ''}
${err ? err : ''}
${state ? html`Attr: ${JSON.stringify(state.attributes)}` : ''}
`;
}
/** Check if Home Assistant and local time are out of sync */
private _checkForSyncIssues(oldHass?: HomeAssistant) {
if (!oldHass || !this.config.entity) return;
const newState = this.hass!.states[this.config.entity];
if (oldHass.states[this.config.entity] == newState) return;
const homeAssistantAhead = Date.parse(newState.last_changed) - Date.now();
if (this.config.sync_issues == 'show' && Math.abs(homeAssistantAhead) > MIN_SYNC_ERROR) {
// Only show sync errors after the clock correction can be precisely measured twice.
if (Math.abs(homeAssistantAhead - this._previousClockCorrection) < MIN_SYNC_ERROR) {
this._warning = this._generateSyncWarning(homeAssistantAhead);
}
this._previousClockCorrection = homeAssistantAhead;
} else if (this.config.sync_issues == 'fix' && Math.abs(homeAssistantAhead) < MAX_FIX_SYNC_ERROR) {
this._browserClockCorrection = homeAssistantAhead;
}
}
private _generateSyncWarning(homeAssistantAhead: number) {
const phrase = homeAssistantAhead > 0 ? 'ahead of' : 'behind';
const difference = Math.abs(homeAssistantAhead) / 1000;
const message = `Detected sync issues: Home Assistant clock is ${difference}s ${phrase} app time.`;
return html`${message}
Learn more.`;
}
protected shouldUpdate(changedProps: PropertyValues): boolean {
if (!this.config) return false;
if (changedProps.has('_timeRemaining')) return true;
const oldHass = changedProps.get('hass') as HomeAssistant | undefined;
this._checkForSyncIssues(oldHass)
if (!oldHass || !this.hass) return true;
const entities = gatherEntitiesFromConfig(this.config)
return haveEntitiesChanged(entities, oldHass, this.hass)
}
protected updated(changedProps: PropertyValues) {
super.updated(changedProps);
if (changedProps.has("hass")) {
const stateObj = this.hass!.states[this.config!.entity!];
this._startInterval(stateObj);
}
}
private _clearInterval(): void {
if (this._interval) {
window.clearInterval(this._interval);
this._interval = undefined;
}
}
private _startInterval(stateObj: HassEntity | undefined): void {
this._clearInterval();
this._calculateRemaining(stateObj);
if (this._mode() === 'active') {
this._interval = window.setInterval(
() => this._calculateRemaining(stateObj),
1000
);
}
}
private _calculateRemaining(stateObj: HassEntity | undefined): void {
try {
this._timeRemaining = this._mode() != 'idle' ? timerTimeRemaining(this.hass!, this.config, stateObj, this._browserClockCorrection) : undefined;
this._error = undefined;
} catch (e) {
console.error(e);
this._error = e as Error;
}
}
private _barStyle(width: string, background: string) {
return styleMap({
width, background,
height: this.modConfig.bar_height,
'border-radius': this.modConfig.bar_radius,
});
}
private _textStyle() {
return styleMap({
width: this.modConfig.text_width,
'flex-shrink': '0',
});
}
private _statusStyle(includeText?: boolean) {
let width = this._bar_width;
if (includeText) width = `calc(${this._bar_width} + ${this.modConfig.text_width})`;
return styleMap({ width, color: 'var(--secondary-text-color, #eee)' });
}
static get styles(): CSSResultGroup {
return [css`
:host {
display: flex;
flex-direction: column;
justify-content: center;
}
.pointer { cursor: pointer; }
.flex { display: flex; height: 40px; align-items: center; justify-content: flex-end; }
.bar-container {
min-height: 1.5em;
display: flex;
flex-shrink: 0;
align-items: center;
}
.bar { margin-top: 2px; overflow: hidden; }
.status { line-height: 1.5em; flex-shrink: 0; }
.text-content { text-align: right; text-align: end; overflow: hidden; }
code {
display: block;
background-color: var(--secondary-background-color);
margin: 0.5em 0 0 0;
padding: 0.7rem;
font-size: 0.9em;
word-break: break-all;
}
`, genericEntityRowStyles];
}
protected get modConfig(): TimerBarEntityConfig {
if (!this.config.modifications) return this.config;
const state: HassEntity | undefined = this.hass!.states[this.config.entity!];
const remaining = (this._mode() != 'idle' ? timerTimeRemaining(this.hass!, this.config, state, this._browserClockCorrection) : undefined) ?? Infinity;
const elapsed = (findDuration(this.hass!, this.config, state) ?? 0) - remaining;
const percentElapsed = timerTimePercent(this.hass!, this.config, state, this._browserClockCorrection) ?? 0;
const percentRemaining = 100 - percentElapsed
let config = this.config;
for (const mod of this.config.modifications) {
// @ts-ignore. Warn on using old config syntax
if (mod.greater_than_eq || mod.greater_than) {
throw new Error('Mod format has changed! See the release notes and readme for details')
}
if (mod.remaining && typeof mod.remaining === 'string' && mod.remaining.endsWith('%')) {
if (percentRemaining <= parseFloat(mod.remaining)) config = { ...config, ...mod };
} else if (mod.remaining) {
if (remaining <= tryDurationToSeconds(mod.remaining, 'remaining')) config = { ...config, ...mod };
} else if (mod.elapsed && typeof mod.elapsed === 'string' && mod.elapsed.endsWith('%')) {
if (percentElapsed >= parseFloat(mod.elapsed)) config = { ...config, ...mod };
} else if (mod.elapsed) {
if (elapsed >= tryDurationToSeconds(mod.elapsed, 'elapsed')) config = { ...config, ...mod };
}
}
return config;
}
}