make image-rendering: pixelated work in firefox
set default scale back to 4x
This commit is contained in:
parent
2e54945438
commit
1506b7a3eb
@ -15,6 +15,8 @@
|
||||
margin-bottom: 8px;
|
||||
padding: 1px;
|
||||
image-rendering: pixelated;
|
||||
image-rendering: crisp-edges;
|
||||
image-rendering: -moz-crisp-edges;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
7
main.js
7
main.js
@ -157,6 +157,10 @@ class Graphics {
|
||||
constructor(canvas) {
|
||||
this.canvas_ = canvas;
|
||||
this.ctx_ = canvas.getContext('2d');
|
||||
this.ctx_.imageSmoothingEnabled = false;
|
||||
this.ctx_.mozImageSmoothingEnabled = false;
|
||||
this.ctx_.webkitImageSmoothingEnabled = false;
|
||||
this.ctx_.msImageSmoothingEnabled = false;
|
||||
}
|
||||
|
||||
get width() {
|
||||
@ -185,7 +189,6 @@ class Graphics {
|
||||
|
||||
// TODO: replace with custom sprite-based text rendering.
|
||||
text(string, x, y, size, color) {
|
||||
this.ctx_.imageSmoothingEnabled = false;
|
||||
this.ctx_.fillStyle = color;
|
||||
this.ctx_.font = '' + size + 'px monospace';
|
||||
this.ctx_.fillText(string, x, y);
|
||||
@ -492,7 +495,7 @@ function init() {
|
||||
document.getElementById('3x').onclick = () => setCanvasScale(3);
|
||||
document.getElementById('4x').onclick = () => setCanvasScale(4);
|
||||
document.getElementById('5x').onclick = () => setCanvasScale(5);
|
||||
setCanvasScale(3);
|
||||
setCanvasScale(4);
|
||||
window.requestAnimationFrame(loop(world, gfx));
|
||||
debug('initialized!');
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user