-
Notifications
You must be signed in to change notification settings - Fork 2.5k
/
cast-demo-row.ts
113 lines (104 loc) · 2.75 KB
/
cast-demo-row.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
import {
html,
LitElement,
TemplateResult,
customElement,
property,
css,
CSSResult,
} from "lit-element";
import "../../../src/components/ha-icon";
import {
EntityRow,
CastConfig,
} from "../../../src/panels/lovelace/entity-rows/types";
import { HomeAssistant } from "../../../src/types";
import { CastManager } from "../../../src/cast/cast_manager";
import { castSendShowDemo } from "../../../src/cast/receiver_messages";
@customElement("cast-demo-row")
class CastDemoRow extends LitElement implements EntityRow {
public hass!: HomeAssistant;
@property() private _castManager?: CastManager | null;
public setConfig(_config: CastConfig): void {
// No config possible.
}
protected render(): TemplateResult | void {
if (
!this._castManager ||
this._castManager.castState === "NO_DEVICES_AVAILABLE"
) {
return html``;
}
return html`
<ha-icon icon="hademo:television"></ha-icon>
<div class="flex">
<div class="name">Show Chromecast interface</div>
<google-cast-launcher></google-cast-launcher>
</div>
`;
}
protected firstUpdated(changedProps) {
super.firstUpdated(changedProps);
import("../../../src/cast/cast_manager").then(({ getCastManager }) =>
getCastManager().then((mgr) => {
this._castManager = mgr;
mgr.addEventListener("state-changed", () => {
this.requestUpdate();
});
mgr.castContext.addEventListener(
cast.framework.CastContextEventType.SESSION_STATE_CHANGED,
(ev) => {
// On Android, opening a new session always results in SESSION_RESUMED.
// So treat both as the same.
if (
ev.sessionState === "SESSION_STARTED" ||
ev.sessionState === "SESSION_RESUMED"
) {
castSendShowDemo(mgr);
}
}
);
})
);
}
protected updated(changedProps) {
super.updated(changedProps);
this.style.display = this._castManager ? "" : "none";
}
static get styles(): CSSResult {
return css`
:host {
display: flex;
align-items: center;
}
ha-icon {
padding: 8px;
color: var(--paper-item-icon-color);
}
.flex {
flex: 1;
overflow: hidden;
margin-left: 16px;
display: flex;
justify-content: space-between;
align-items: center;
}
.name {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
google-cast-launcher {
cursor: pointer;
display: inline-block;
height: 24px;
width: 24px;
}
`;
}
}
declare global {
interface HTMLElementTagNameMap {
"cast-demo-row": CastDemoRow;
}
}