66 lines
2.0 KiB
TypeScript
66 lines
2.0 KiB
TypeScript
import { EditorConsole, ConsoleMessage } from '../../editor/EditorConsole.js';
|
|
import { EditorPanelDefinition } from '../../editor/editor-panel.js';
|
|
import { ContextMenuDirectory, ContextMenuReadOnlyEntry } from '../context-menu/context-menu.js';
|
|
|
|
class ConsolePanel extends HTMLElement
|
|
{
|
|
__interfaces__ = [ EditorPanelDefinition.type ];
|
|
_initialized = false;
|
|
|
|
connectedCallback(): void
|
|
{
|
|
if ( this._initialized ) return;
|
|
this._initialized = true;
|
|
|
|
this.className = 'console-panel';
|
|
this.innerHTML = `
|
|
<conp-header>
|
|
<conp-title>Console</conp-title>
|
|
<button class="conp-clear" title="Clear">Clear</button>
|
|
</conp-header>
|
|
<conp-list></conp-list>
|
|
`;
|
|
|
|
this.querySelector( '.conp-clear' )!.addEventListener( 'click', () =>
|
|
{
|
|
this.querySelector( 'conp-list' )!.innerHTML = '';
|
|
} );
|
|
|
|
EditorConsole.get().messages.forEach( msg => this._append( msg ) );
|
|
this._scrollToBottom();
|
|
|
|
EditorConsole.get().onMessage.addListener( msg =>
|
|
{
|
|
this._append( msg );
|
|
this._scrollToBottom();
|
|
} );
|
|
}
|
|
|
|
addContextMenuEntries( dir: ContextMenuDirectory ): void
|
|
{
|
|
dir.add( new ContextMenuReadOnlyEntry( dir, 'Console' ) );
|
|
}
|
|
|
|
_append( msg: ConsoleMessage ): void
|
|
{
|
|
const list = this.querySelector( 'conp-list' )!;
|
|
const entry = document.createElement( 'conp-entry' );
|
|
entry.className = `conp-entry-${ msg.type }`;
|
|
const t = msg.timestamp;
|
|
const hh = String( t.getHours() ).padStart( 2, '0' );
|
|
const mm = String( t.getMinutes() ).padStart( 2, '0' );
|
|
const ss = String( t.getSeconds() ).padStart( 2, '0' );
|
|
entry.innerHTML = `<conp-time>${ hh }:${ mm }:${ ss }</conp-time><conp-text></conp-text>`;
|
|
( entry.querySelector( 'conp-text' ) as HTMLElement ).textContent = msg.text;
|
|
list.appendChild( entry );
|
|
}
|
|
|
|
_scrollToBottom(): void
|
|
{
|
|
const list = this.querySelector( 'conp-list' ) as HTMLElement;
|
|
if ( list ) list.scrollTop = list.scrollHeight;
|
|
}
|
|
}
|
|
|
|
customElements.define( 'console-panel', ConsolePanel );
|