annotate web/light9-vidref-live.js @ 2376:4556eebe5d73

topdir reorgs; let pdm have its src/ dir; separate vite area from light9/
author drewp@bigasterisk.com
date Sun, 12 May 2024 19:02:10 -0700
parents light9/web/light9-vidref-live.js@3ae1e7f8db23
children
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
1939
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
1 import { LitElement, TemplateResult, html, css } from '/node_modules/lit-element/lit-element.js';
1951
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
2 import { rounding } from '/node_modules/significant-rounding/index.js';
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
3 import './light9-vidref-replay.js';
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
4
1946
a362b892cb43 more makefile hacks to turn debug.js into an ES6 module
Drew Perttula <drewp@bigasterisk.com>
parents: 1945
diff changeset
5 import debug from '/lib/debug/debug-build-es6.js';
a362b892cb43 more makefile hacks to turn debug.js into an ES6 module
Drew Perttula <drewp@bigasterisk.com>
parents: 1945
diff changeset
6 const log = debug('live');
1939
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
7
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
8 class Light9VidrefLive extends LitElement {
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
9
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
10 static get properties() {
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
11 return {
1951
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
12 description: { type: String },
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
13 enabled: { type: Boolean }
1939
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
14 };
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
15 }
1951
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
16
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
17 constructor() {
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
18 super();
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
19 this.live = null;
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
20 }
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
21
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
22 onEnabled() {
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
23 if (this.shadowRoot.querySelector('#enabled').checked) {
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
24
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
25 this.live = reconnectingWebSocket(
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
26 'live', (msg) => {
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
27 this.shadowRoot.querySelector('#live').src = 'data:image/jpeg;base64,' + msg.jpeg;
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
28 this.description = msg.description;
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
29 });
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
30 this.shadowRoot.querySelector('#liveWidget').style.display = 'block';
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
31 } else {
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
32 if (this.live) {
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
33 this.live.disconnect();
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
34 this.live = null;
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
35 this.shadowRoot.querySelector('#liveWidget').style.display = 'none';
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
36 }
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
37 }
1939
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
38 }
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
39
1945
157985a971dc non-working WIP for vidref web
drewp@bigasterisk.com
parents: 1939
diff changeset
40 disconnectedCallback() {
157985a971dc non-working WIP for vidref web
drewp@bigasterisk.com
parents: 1939
diff changeset
41 log('bye');
1951
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
42 //close socket
1945
157985a971dc non-working WIP for vidref web
drewp@bigasterisk.com
parents: 1939
diff changeset
43
157985a971dc non-working WIP for vidref web
drewp@bigasterisk.com
parents: 1939
diff changeset
44 }
1954
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
45
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
46 static get styles() {
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
47 return css`
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
48 :host {
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
49 display: inline-block;
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
50 }
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
51 #live {
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
52 border: 4px solid orange;
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
53 }
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
54 `;
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
55 }
1945
157985a971dc non-working WIP for vidref web
drewp@bigasterisk.com
parents: 1939
diff changeset
56
1939
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
57 render() {
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
58 return html`
1951
9f0f2b39ad95 vidref web is working
Drew Perttula <drewp@bigasterisk.com>
parents: 1946
diff changeset
59 <label><input type="checkbox" id="enabled" ?checked="${this.enabled}" @change="${this.onEnabled}">Show live</label>
1954
3ae1e7f8db23 vidref playback smoothness, autodelete short clips, manual-delete clips, vidref keyboard shortcuts
Drew Perttula <drewp@bigasterisk.com>
parents: 1951
diff changeset
60 <div id="liveWidget" style="display: none"><img id="live" ></div>
1939
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
61 `;
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
62
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
63 }
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
64 }
6f49dc917aa3 start vidref web version. v4l camera frames to web page is working
Drew Perttula <drewp@bigasterisk.com>
parents:
diff changeset
65 customElements.define('light9-vidref-live', Light9VidrefLive);