33 lines
1.0 KiB
TypeScript
33 lines
1.0 KiB
TypeScript
import { $ } from 'mdui/jq'
|
|
|
|
customElements.define('chat-video', class extends HTMLElement {
|
|
static observedAttributes = ['src']
|
|
declare video: HTMLVideoElement
|
|
constructor() {
|
|
super()
|
|
|
|
this.attachShadow({ mode: 'open' })
|
|
}
|
|
update() {
|
|
if (this.video == null) return
|
|
|
|
this.video.src = $(this).attr('src') as string
|
|
}
|
|
attributeChangedCallback(_name: string, _oldValue: unknown, _newValue: unknown) {
|
|
this.update()
|
|
}
|
|
connectedCallback() {
|
|
this.video = new DOMParser().parseFromString(`<video controls></video>`, 'text/html').body.firstChild as HTMLVideoElement
|
|
this.video.style.maxWidth = "400px"
|
|
this.video.style.maxHeight = "300px"
|
|
this.video.style.width = "100%"
|
|
this.video.style.height = "100%"
|
|
this.video.style.display = 'block'
|
|
// e.style.borderRadius = "var(--mdui-shape-corner-medium)"
|
|
|
|
this.video.onclick = (e) => e.stopPropagation()
|
|
this.shadowRoot!.appendChild(this.video)
|
|
this.update()
|
|
}
|
|
})
|