Fix #2451 Colour-adjustement tools behave incorrectly with Layers

This commit is contained in:
JannisX11 2024-08-21 22:42:03 +02:00
parent 20a831b360
commit d86d35e588
2 changed files with 38 additions and 32 deletions

View File

@ -152,7 +152,7 @@
<script src="js/texturing/painter.js"></script>
<script src="js/texturing/texture_generator.js"></script>
<script src="js/texturing/color.js"></script>
<script src="js/texturing/edit_texture.js"></script>
<script src="js/texturing/edit_image.js"></script>
<script src="js/display_mode.js"></script>
<script src="js/animations/animation_mode.js"></script>
<script src="js/animations/animation.js"></script>

View File

@ -19,13 +19,13 @@ BARS.defineActions(function() {
let textures = getTextures();
Undo.initEdit({textures, bitmap: true});
textures.forEach(texture => {
texture.edit((canvas) => {
texture.edit((canvas, env) => {
let copy_canvas = Painter.copyCanvas(canvas);
let ctx = canvas.getContext('2d');
texture.selection.maskCanvas(ctx);
ctx.clearRect(0, 0, texture.width, texture.height);
texture.selection.maskCanvas(ctx, env.offset);
ctx.clearRect(0, 0, canvas.width, canvas.height);
ctx.filter = 'invert(1)';
ctx.drawImage(texture.img, 0, 0);
ctx.drawImage(copy_canvas, 0, 0);
ctx.restore();
}, {no_undo: true});
@ -39,8 +39,8 @@ BARS.defineActions(function() {
condition: {modes: ['paint'], method: () => Texture.all.length},
click() {
let textures = getTextures();
let original_imgs = textures.map(tex => {
return tex.img.cloneNode();
let original_canvases = textures.map(tex => {
return Painter.copyCanvas(tex.getActiveCanvas().canvas);
})
Undo.initEdit({textures, bitmap: true});
@ -59,21 +59,23 @@ BARS.defineActions(function() {
methods: {
change() {
textures.forEach((texture, i) => {
texture.edit((canvas) => {
texture.edit((canvas, env) => {
let ctx = canvas.getContext('2d');
texture.selection.maskCanvas(ctx);
texture.selection.maskCanvas(ctx, env.offset);
ctx.clearRect(0, 0, texture.width, texture.height);
if (this.preview_changes) {
ctx.filter = `brightness(${this.brightness / 100}) contrast(${this.contrast / 100})`;
} else {
ctx.filter = `brightness(1.0) contrast(1.0)`;
}
ctx.drawImage(original_imgs[i], 0, 0);
ctx.drawImage(original_canvases[i], 0, 0);
ctx.restore();
let ref_ctx = this.$refs.canvas[i].getContext('2d');
ref_ctx.clearRect(0, 0, texture.width, texture.height);
ref_ctx.drawImage(canvas, 0, 0);
setTimeout(() => {
let ref_ctx = this.$refs.canvas[i].getContext('2d');
ref_ctx.clearRect(0, 0, texture.width, texture.height);
ref_ctx.drawImage(texture.canvas, 0, 0)
}, 5);
}, {no_undo: true, use_cache: true});
})
@ -132,8 +134,8 @@ BARS.defineActions(function() {
condition: {modes: ['paint'], method: () => Texture.all.length},
click() {
let textures = getTextures();
let original_imgs = textures.map(tex => {
return tex.img.cloneNode();
let original_canvases = textures.map(tex => {
return Painter.copyCanvas(tex.getActiveCanvas().canvas);
})
Undo.initEdit({textures, bitmap: true});
@ -152,21 +154,23 @@ BARS.defineActions(function() {
methods: {
change() {
textures.forEach((texture, i) => {
texture.edit((canvas) => {
texture.edit((canvas, env) => {
let ctx = canvas.getContext('2d');
texture.selection.maskCanvas(ctx);
texture.selection.maskCanvas(ctx, env.offset);
ctx.clearRect(0, 0, texture.width, texture.height);
if (this.preview_changes) {
ctx.filter = `saturate(${this.saturation / 100}) hue-rotate(${this.hue}deg)`;
} else {
ctx.filter = `brightness(1.0)`;
}
ctx.drawImage(original_imgs[i], 0, 0);
ctx.drawImage(original_canvases[i], 0, 0);
ctx.restore();
let ref_ctx = this.$refs.canvas[i].getContext('2d');
ref_ctx.clearRect(0, 0, texture.width, texture.height);
ref_ctx.drawImage(canvas, 0, 0);
setTimeout(() => {
let ref_ctx = this.$refs.canvas[i].getContext('2d');
ref_ctx.clearRect(0, 0, texture.width, texture.height);
ref_ctx.drawImage(texture.canvas, 0, 0)
}, 5);
}, {no_undo: true, use_cache: true});
})
@ -507,8 +511,8 @@ BARS.defineActions(function() {
condition: {modes: ['paint'], method: () => Texture.all.length},
click() {
let textures = getTextures();
let original_imgs = textures.map(tex => {
return tex.img.cloneNode();
let original_canvases = textures.map(tex => {
return Painter.copyCanvas(tex.getActiveCanvas().canvas);
})
Undo.initEdit({textures, bitmap: true});
@ -526,27 +530,29 @@ BARS.defineActions(function() {
methods: {
change() {
textures.forEach((texture, i) => {
texture.edit((canvas) => {
texture.edit((canvas, env) => {
let ctx = canvas.getContext('2d');
ctx.save();
texture.selection.maskCanvas(ctx);
texture.selection.maskCanvas(ctx, env.offset);
ctx.clearRect(0, 0, texture.width, texture.height);
if (this.preview_changes) {
ctx.filter = `opacity(${this.opacity}%)`;
ctx.drawImage(original_imgs[i], 0, 0);
ctx.drawImage(original_canvases[i], 0, 0);
if (this.opacity > 100 && this.preview_changes) {
ctx.filter = `opacity(${this.opacity-100}%)`;
ctx.drawImage(original_imgs[i], 0, 0);
ctx.drawImage(original_canvases[i], 0, 0);
}
} else {
ctx.filter = `opacity(100%)`;
ctx.drawImage(original_imgs[i], 0, 0);
ctx.drawImage(original_canvases[i], 0, 0);
}
ctx.restore();
let ref_ctx = this.$refs.canvas[i].getContext('2d');
ref_ctx.clearRect(0, 0, texture.width, texture.height);
ref_ctx.drawImage(canvas, 0, 0);
setTimeout(() => {
let ref_ctx = this.$refs.canvas[i].getContext('2d');
ref_ctx.clearRect(0, 0, texture.width, texture.height);
ref_ctx.drawImage(texture.canvas, 0, 0)
}, 5);
}, {no_undo: true, use_cache: true});
})