Fixed canvas undoing bug

This commit is contained in:
unsettledgames
2020-09-27 11:25:09 +02:00
parent 4223597659
commit c2bf2fe131
4 changed files with 32 additions and 22 deletions

View File

@ -32,6 +32,7 @@ Suggestions / Planned features:
- Possibly add collaborate function - Possibly add collaborate function
- Polish: - Polish:
- ctrl + a to select everything / selection -> all, same for deselection
- Show colors which would need to be added to palette - Show colors which would need to be added to palette
- Warning windows for wrong inputs - Warning windows for wrong inputs
- Palette option remove unused colors - Palette option remove unused colors

View File

@ -47,9 +47,9 @@ function HistoryStateResizeCanvas(newSize, oldSize, imageDatas) {
// Resizing the canvas // Resizing the canvas
resizeCanvas(null, oldSize); resizeCanvas(null, oldSize);
// Putting the image datas // Putting the image datas
for (let i=0; i<imageDatas.length; i++) { for (let i=0; i<layers.length; i++) {
if (layers[i].menuEntry != null) { if (layers[i].menuEntry != null) {
layers[i].context.putImageData(imageDatas[dataIndex], 0, 0); layers[i].context.putImageData(this.imageDatas[dataIndex], 0, 0);
dataIndex++; dataIndex++;
} }
} }

View File

@ -182,12 +182,14 @@ function resizeImageData (image, width, height, algorithm) {
resize(image, result) resize(image, result)
return result return result
} }
function getPixelPosition(index) { function getPixelPosition(index) {
let linearIndex = index / 4; let linearIndex = index / 4;
let y = linearIndex / layers[0].canvasSize[0]; let x = linearIndex % layers[0].canvasSize[0];
let x = linearIndex - y * layers[0].canvasSize[0]; let y = Math.floor(linearIndex / layers[0].canvasSize[0]);
return [x, y]; console.log("pos: " + x + ", " + y);
}
return [Math.round(x), Math.round(y)];
}

View File

@ -75,11 +75,11 @@ function resizeCanvas(event, size) {
} }
rcUpdateBorders(); rcUpdateBorders();
console.log("sus");
// Save all imageDatas // Save all imageDatas
for (let i=0; i<layers.length; i++) { for (let i=0; i<layers.length; i++) {
if (layers[i].menuEntry != null) { if (layers[i].menuEntry != null) {
imageDatas.push(layers[i].context.getImageData(0, 0, layers[i].canvasSize[0], layers[i].canvasSize[1])); imageDatas.push(layers[i].context.getImageData(0, 0, layers[0].canvasSize[0], layers[0].canvasSize[1]));
} }
} }
@ -92,7 +92,7 @@ function resizeCanvas(event, size) {
{x: layers[0].canvasSize[0], {x: layers[0].canvasSize[0],
y: layers[0].canvasSize[1]}, y: layers[0].canvasSize[1]},
imageDatas imageDatas.slice()
); );
} }
@ -167,8 +167,10 @@ function resizeCanvas(event, size) {
} }
function trimCanvas() { function trimCanvas() {
let minX, minY = Infinity; let minY = Infinity;
let maxX, maxY = -Infinity; let minX = Infinity;
let maxX = -Infinity;
let maxY = -Infinity;
rcPivot = "middle"; rcPivot = "middle";
console.log("trimmo"); console.log("trimmo");
@ -177,34 +179,39 @@ function trimCanvas() {
let imageData = layers[i].context.getImageData(0, 0, layers[0].canvasSize[0], layers[0].canvasSize[1]); let imageData = layers[i].context.getImageData(0, 0, layers[0].canvasSize[0], layers[0].canvasSize[1]);
let pixelPosition; let pixelPosition;
for (let i=0; i<imageData.length; i+=4) { for (let i=0; i<imageData.data.length; i+=4) {
if (!isPixelEmpty([imageData[i], imageData[i + 1], imageData[i + 2], imageData[i + 3]])) { if (!isPixelEmpty(
[imageData.data[i], imageData.data[i + 1],
-imageData.data[i + 2], imageData.data[i + 3]])) {
pixelPosition = getPixelPosition(i); pixelPosition = getPixelPosition(i);
if (pixelPosition.x > maxX) { if (pixelPosition[0] > maxX) {
maxX = pixelPosition[0]; maxX = pixelPosition[0];
} }
else if (pixelPosition.x < minX) { else if (pixelPosition[0] < minX) {
minX = pixelPosition[0]; minX = pixelPosition[0];
} }
if (pixelPosition.y > maxY) { if (pixelPosition[1] > maxY) {
maxY = pixelPosition[1]; maxY = pixelPosition[1];
} }
else if (pixelPosition.y < minY) { else if (pixelPosition[1] < minY) {
minY = pixelPosition[1]; minY = pixelPosition[1];
} }
} }
} }
} }
console.log(maxX + ", " + minX + ", " + maxY + ", " + minY);
borders.right = maxX - layers[0].canvasSize[0]; borders.right = maxX - layers[0].canvasSize[0];
borders.left = -minX; borders.left = -minX;
borders.top = maxY - layers[0].canvasSize[1]; borders.top = maxY - layers[0].canvasSize[1];
borders.bottom = minY; borders.bottom = minY;
document.getElementById("rc-border-left").value = borders.left;
document.getElementById("rc-border-right").value = borders.right;
document.getElementById("rc-border-top").value = borders.top;
document.getElementById("rc-border-bottom").value = borders.bottom;
resizeCanvas(null); resizeCanvas(null);
} }