Add the cursor position to the editor's fledgling status bar

This commit is contained in:
Eevee (Evelyn Woods) 2021-04-23 14:37:20 -06:00
parent ea9cc5ef07
commit e3a128df60
2 changed files with 16 additions and 2 deletions

View File

@ -3255,7 +3255,8 @@ export class Editor extends PrimaryView {
// Populate status bar (needs doing before the mouse stuff, which tries to update it) // Populate status bar (needs doing before the mouse stuff, which tries to update it)
let statusbar = this.root.querySelector('#editor-statusbar'); let statusbar = this.root.querySelector('#editor-statusbar');
this.statusbar_zoom = mk('div.-zoom'); this.statusbar_zoom = mk('div.-zoom');
statusbar.append(this.statusbar_zoom); this.statusbar_cursor = mk('div.-mouse', "—");
statusbar.append(this.statusbar_zoom, this.statusbar_cursor);
// Keyboard shortcuts // Keyboard shortcuts
window.addEventListener('keydown', ev => { window.addEventListener('keydown', ev => {
@ -3395,9 +3396,12 @@ export class Editor extends PrimaryView {
this.svg_cursor.classList.add('--visible'); this.svg_cursor.classList.add('--visible');
this.svg_cursor.setAttribute('x', x); this.svg_cursor.setAttribute('x', x);
this.svg_cursor.setAttribute('y', y); this.svg_cursor.setAttribute('y', y);
this.statusbar_cursor.textContent = `(${x}, ${y})`;
} }
else { else {
this.svg_cursor.classList.remove('--visible'); this.svg_cursor.classList.remove('--visible');
this.statusbar_cursor.textContent = ``;
} }
if (! this.mouse_op) if (! this.mouse_op)

View File

@ -2012,7 +2012,17 @@ body.--debug #player-debug {
#editor #editor-statusbar { #editor #editor-statusbar {
grid-area: status; grid-area: status;
display: flex; display: flex;
height: 1em; gap: 0.5em;
/* Try very hard to minimize reflow, since this is updated frequently */
height: 1.25em;
line-height: 1.25;
overflow: hidden;
}
#editor #editor-statusbar > .-zoom {
width: 4em;
}
#editor #editor-statusbar > .-cursor {
width: 5em;
} }
.editor-level-browser { .editor-level-browser {