From 60b53ac121c27582ae399981e93f11b8f595c384 Mon Sep 17 00:00:00 2001 From: JannisX11 Date: Sun, 15 May 2022 13:12:29 +0200 Subject: [PATCH] Improve painting performance --- css/panels.css | 1 + js/texturing/painter.js | 20 +++++++++++++------- js/texturing/textures.js | 8 ++++++++ js/texturing/uv.js | 13 ++++++++++++- 4 files changed, 34 insertions(+), 8 deletions(-) diff --git a/css/panels.css b/css/panels.css index bb14c19..6c5ba43 100644 --- a/css/panels.css +++ b/css/panels.css @@ -1351,6 +1351,7 @@ body[mode=paint] #uv_frame { cursor: crosshair !important; } + #uv_frame > #texture_canvas_wrapper > canvas, #uv_frame > img { position: absolute; pointer-events: none; diff --git a/js/texturing/painter.js b/js/texturing/painter.js index ee32522..b6de794 100644 --- a/js/texturing/painter.js +++ b/js/texturing/painter.js @@ -42,8 +42,14 @@ const Painter = { } }) } else { - texture.updateSource(instance.toDataURL()) - if (!options.no_undo) { + if (options.no_undo) { + let map = texture.getMaterial().map + map.image = Painter.current.canvas; + map.needsUpdate = true; + texture.display_canvas = true; + UVEditor.vue.updateTextureCanvas(); + } else { + texture.updateSource(instance.toDataURL()) Undo.finishEdit(edit_name) } } @@ -896,12 +902,12 @@ const Painter = { BarItems.slider_brush_opacity.update() }, getCanvas(texture) { - var c = document.createElement('canvas') - var ctx = c.getContext('2d'); - c.width = texture.width; - c.height = texture.height; + let canvas = texture instanceof Texture ? texture.canvas : document.createElement('canvas'); + let ctx = canvas.getContext('2d'); + canvas.width = texture.width; + canvas.height = texture.height; ctx.drawImage(texture instanceof Texture ? texture.img : texture, 0, 0) - return c; + return canvas; }, scanCanvas(ctx, x, y, w, h, cb) { var arr = ctx.getImageData(x, y, w, h) diff --git a/js/texturing/textures.js b/js/texturing/textures.js index 85bc0a5..996a643 100644 --- a/js/texturing/textures.js +++ b/js/texturing/textures.js @@ -13,6 +13,7 @@ class Texture { this.show_icon = true this.error = 0; this.visible = true; + this.display_canvas = false; //Data this.img = 0; this.width = 0; @@ -47,6 +48,8 @@ class Texture { } //Setup Img/Mat + this.canvas = document.createElement('canvas'); + this.canvas.width = this.canvas.height = 16; var img = this.img = new Image() img.src = 'assets/missing.png' @@ -250,6 +253,9 @@ class Texture { } getUndoCopy(bitmap) { var copy = {} + if (this.display_canvas && bitmap) { + this.updateSource(this.canvas.toDataURL()); + } for (var key in Texture.properties) { Texture.properties[key].copy(this, copy) } @@ -443,6 +449,7 @@ class Texture { if (!dataUrl) dataUrl = this.source; this.source = dataUrl; this.img.src = dataUrl; + this.display_canvas = false; this.updateMaterial(); if (open_dialog == 'UVEditor') { for (var key in UVEditor.editors) { @@ -457,6 +464,7 @@ class Texture { updateMaterial() { let mat = this.getMaterial(); mat.name = this.name; + mat.map.image = this.img; mat.map.name = this.name; mat.map.image.src = this.source; mat.map.needsUpdate = true; diff --git a/js/texturing/uv.js b/js/texturing/uv.js index 69ec386..5baf550 100644 --- a/js/texturing/uv.js +++ b/js/texturing/uv.js @@ -1885,6 +1885,16 @@ Interface.definePanels(function() { } else { this.texture = 0; } + // Display canvas while painting + this.updateTextureCanvas(); + }, + updateTextureCanvas() { + if (this.texture && this.texture.display_canvas) { + Vue.nextTick(() => { + let wrapper = this.$refs.texture_canvas_wrapper; + wrapper.append(this.texture.canvas); + }) + } }, updateMouseCoords(event) { convertTouchEvent(event); @@ -2987,7 +2997,8 @@ Interface.definePanels(function() {
- + +