Checkpoint some minor editor bits

This commit is contained in:
Eevee (Evelyn Woods) 2021-01-14 00:53:54 -07:00
parent 5ab45b95c6
commit cf72daacbe
3 changed files with 21 additions and 1 deletions

View File

@ -260,6 +260,17 @@ class EditorLevelBrowserOverlay extends DialogOverlay {
}
});
// FIXME it would be super swell if i could load this lazily
/*
<script src="https://cdn.jsdelivr.net/npm/sortablejs@latest/Sortable.min.js"></script>
this.sortable = new Sortable(this.list, {
group: 'editor-levels',
onEnd: ev => {
// FIXME rearrange the levels for realsies
},
});
*/
this.add_button("new level", ev => {
this.conductor.editor.append_new_level();
this.close();

View File

@ -50,6 +50,8 @@ export class CanvasRenderer {
this.canvas = mk('canvas', {width: tileset.size_x * this.viewport_size_x, height: tileset.size_y * this.viewport_size_y});
this.canvas.style.setProperty('--viewport-width', this.viewport_size_x);
this.canvas.style.setProperty('--viewport-height', this.viewport_size_y);
this.canvas.style.setProperty('--tile-width', `${tileset.size_x}px`);
this.canvas.style.setProperty('--tile-height', `${tileset.size_y}px`);
this.ctx = this.canvas.getContext('2d');
this.viewport_x = 0;
this.viewport_y = 0;
@ -130,6 +132,8 @@ export class CanvasRenderer {
this.canvas.setAttribute('height', this.tileset.size_y * this.viewport_size_y);
this.canvas.style.setProperty('--viewport-width', this.viewport_size_x);
this.canvas.style.setProperty('--viewport-height', this.viewport_size_y);
this.canvas.style.setProperty('--tile-width', `${this.tileset.size_x}px`);
this.canvas.style.setProperty('--tile-height', `${this.tileset.size_y}px`);
}
draw(tic_offset = 0) {

View File

@ -1612,14 +1612,18 @@ body.--debug #player-debug {
#editor .editor-canvas {
grid-area: level;
overflow: auto;
position: relative;
/* Flex layout to center the canvas and overlay together */
display: flex;
/* This isn't supported in Chrome (still!!), so use auto margins on the child instead
align-items: safe center;
justify-content: safe center;
*/
background: #202020;
background: #101010;
border: 0.125em solid black;
/* FIXME would love if this were above the canvas too, but can't figure out how to do that
* easily in a scrolling element */
box-shadow: inset 0 0 3px black;
}
#editor .editor-canvas .-container {
position: relative;
@ -1635,6 +1639,7 @@ body.--debug #player-debug {
width: calc(var(--viewport-width) * var(--tile-width) * var(--scale));
--viewport-width: 9;
--viewport-height: 9;
--scale: 1;
}
/* SVG overlays */
#editor svg.level-editor-overlay {