35 lines
895 B
JavaScript
35 lines
895 B
JavaScript
export class Component {
|
|
constructor() {
|
|
this._component_name = Object.getPrototypeOf(this).constructor.name
|
|
this._template = document.createElement('template')
|
|
this._debug = (sessionStorage.getItem('debug') === 'true')
|
|
}
|
|
render() {
|
|
const component = this.renderComponent()
|
|
this._template.content.appendChild(component)
|
|
|
|
for (const e of this._template.content.children) {
|
|
e.setAttribute('data-component-name', this._component_name)
|
|
|
|
if (this._debug) {
|
|
e.setAttribute('data-tooltip', this._component_name)
|
|
e.classList.add('tooltip')
|
|
e.classList.add('left')
|
|
|
|
e.addEventListener('mouseover', event=>{
|
|
if (event.target !== e)
|
|
return
|
|
e.style.border = '1px solid #f0f';
|
|
})
|
|
|
|
e.addEventListener('mouseout', event=>{
|
|
if (event.target !== e)
|
|
return
|
|
e.style.border = 'none';
|
|
})
|
|
}
|
|
}
|
|
|
|
return this._template.content
|
|
}
|
|
}
|