#244: rendering improvements, if zoom in, sharpness is disabled and i…

…mages will be rendered smoothly.
viliusle · Jun 19, 2021 · 3ba9005 · 3ba9005
1 parent 8884e13
commit 3ba9005
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 24 deletions.
diff --git a/src/css/layout.css b/src/css/layout.css
@@ -337,8 +337,6 @@ IMPORTANT: any new icon should also must be added on /service-worker.js + its ve
  z-index: 2;
  display: flex;
  flex-direction: column;
- background-color: #424F5A;
- background-color: var(--background-color);
  transition: 0.2s;
  overflow-x: hidden;
  overflow-y: scroll;
@@ -628,13 +626,7 @@ IMPORTANT: any new icon should also must be added on /service-worker.js + its ve
  /*background: url(images/icons/grid.png) repeat top left;*/
  background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAQElEQVQ4T2N89+7dfwYigKCgIBGqGBgYRw3EGU6jYYgzaIZAsvn//z9ROeX9+/fE5ZRRA3GG02gY4s4pgz7ZAAAnSWvHPkHXaAAAAABJRU5ErkJggg==') repeat top left;
  z-index:1;
- /* disable antialiasing */
- image-rendering: optimizeSpeed;
- image-rendering: -moz-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: -o-crisp-edges;
- image-rendering: pixelated;
- -ms-interpolation-mode: nearest-neighbor;
+ image-rendering: pixelated; /* disable antialiasing */
 }
 .transparent-grid.white{
  background:white;

diff --git a/src/css/reset.css b/src/css/reset.css
@@ -135,19 +135,9 @@ canvas{
  outline: none;
  /* disable select canvas */
  -webkit-touch-callout: none;
- -webkit-user-select: none;
- -khtml-user-select: none;
- -moz-user-select: none;
  -ms-user-select: none;
+ -webkit-user-select: none;
  user-select: none;
- -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
- /* disable antialiasing */
- image-rendering: optimizeSpeed;
- image-rendering: -moz-crisp-edges;
- image-rendering: -webkit-optimize-contrast;
- image-rendering: -o-crisp-edges;
- image-rendering: pixelated;
- -ms-interpolation-mode: nearest-neighbor;
 }
 img{
  border: none;

diff --git a/src/js/core/base-gui.js b/src/js/core/base-gui.js
@@ -249,10 +249,12 @@ class Base_gui_class {
  config.visible_width = w;
  config.visible_height = h;
 
- ctx.webkitImageSmoothingEnabled = false;
- ctx.oImageSmoothingEnabled = false;
- ctx.msImageSmoothingEnabled = false;
- ctx.imageSmoothingEnabled = false;
+ if(config.ZOOM >= 1) {
+ ctx.imageSmoothingEnabled = false;
+ }
+ else{
+ ctx.imageSmoothingEnabled = true;
+ }
 
  this.render_canvas_background('canvas_minipaint');