mirror of
https://github.com/lospec/pixel-editor.git
synced 2023-08-10 21:12:51 +03:00
Fixed bug in canvas resizing when resizing sprite
This commit is contained in:
@@ -40,75 +40,144 @@ function initResizeSpriteInputs() {
|
||||
}
|
||||
|
||||
function resizeSprite() {
|
||||
let newWidth, newHeight;
|
||||
|
||||
rcPivot = "middle";
|
||||
// Updating values if the user didn't press enter
|
||||
switch (document.activeElement.id) {
|
||||
case "rs-width-percentage":
|
||||
changedWidthPercentage();
|
||||
break;
|
||||
case "rs-width":
|
||||
changedWidth();
|
||||
break;
|
||||
case "rs-height-percentage":
|
||||
changedHeightPercentage();
|
||||
break;
|
||||
case "rs-height":
|
||||
changedHeight();
|
||||
break;
|
||||
default:
|
||||
// In this case everything has been updated correctly
|
||||
break;
|
||||
}
|
||||
|
||||
newWidth = data.width;
|
||||
newHeight = data.height;
|
||||
|
||||
console.log(newWidth + ", " + newHeight);
|
||||
|
||||
// Resizing the canvas
|
||||
resizeCanvas(null, {x: newWidth, y: newHeight});
|
||||
// Get all the image datas
|
||||
// Resize the canvases
|
||||
// Resize the image datas
|
||||
// Put the image datas on the new canvases
|
||||
closeDialogue();
|
||||
}
|
||||
|
||||
function changedWidth(event) {
|
||||
let oldValue = data.width;
|
||||
let ratio;
|
||||
let percentageRatio;
|
||||
let newHeight, newHeightPerc, newWidthPerc;
|
||||
|
||||
data.width = event.target.value;
|
||||
delta = data.width - oldValue;
|
||||
|
||||
ratio = data.width / oldValue;
|
||||
|
||||
newHeight = data.width / currentRatio;
|
||||
newHeightPerc = (newHeight * 100) / startData.height;
|
||||
newWidthPerc = (data.width * 100) / startData.width;
|
||||
|
||||
if (keepRatio) {
|
||||
document.getElementById("rs-height").value = data.width / currentRatio;
|
||||
document.getElementById("rs-height-percentage").value = (data.width * 100) / startData.width;
|
||||
document.getElementById("rs-height").value = newHeight;
|
||||
data.height = newHeight;
|
||||
|
||||
document.getElementById("rs-height-percentage").value = newHeightPerc;
|
||||
data.heightPercentage = newHeightPerc;
|
||||
}
|
||||
|
||||
document.getElementById("rs-width-percentage").value = (data.width * 100) / startData.width;
|
||||
document.getElementById("rs-width-percentage").value = newWidthPerc;
|
||||
}
|
||||
|
||||
function changedHeight(event) {
|
||||
let oldValue = data.height;
|
||||
let ratio;
|
||||
let newWidth, newWidthPerc, newHeightPerc;
|
||||
|
||||
data.height = event.target.value;
|
||||
delta = data.height - oldValue;
|
||||
|
||||
ratio = data.height / oldValue;
|
||||
|
||||
newWidth = data.height * currentRatio;
|
||||
newWidthPerc = (newWidth * 100) / startData.width;
|
||||
newHeightPerc = (data.height * 100) / startData.height;
|
||||
|
||||
if (keepRatio) {
|
||||
document.getElementById("rs-width").value = data.height * currentRatio;
|
||||
document.getElementById("rs-width-percentage").value = (data.height * 100) / startData.height;
|
||||
document.getElementById("rs-width").value = newWidth;
|
||||
data.width = newWidth;
|
||||
|
||||
document.getElementById("rs-width-percentage").value = newWidthPerc;
|
||||
data.widthPercentage = newWidthPerc;
|
||||
}
|
||||
|
||||
document.getElementById("rs-height-percentage").value = (data.height * 100) / startData.height;
|
||||
document.getElementById("rs-height-percentage").value = newHeightPerc;
|
||||
data.heightPercentage = newHeightPerc;
|
||||
}
|
||||
|
||||
function changedWidthPercentage(event) {
|
||||
let oldValue = data.widthPercentage;
|
||||
let ratio;
|
||||
let newWidth, newHeight, newHeightPerc;
|
||||
|
||||
data.widthPercentage = event.target.value;
|
||||
delta = data.widthPercentage - oldValue;
|
||||
|
||||
ratio = data.widthPercentage / oldValue;
|
||||
|
||||
newHeight = document.getElementById("rs-height").value * ratio;
|
||||
newHeightPerc = data.widthPercentage / currentRatio;
|
||||
newWidth = document.getElementById("rs-width").value * ratio;
|
||||
|
||||
if (keepRatio) {
|
||||
document.getElementById("rs-height-percentage").value = data.widthPercentage / currentRatio;
|
||||
document.getElementById("rs-height").value *= ratio;
|
||||
document.getElementById("rs-height-percentage").value = newHeightPerc;
|
||||
data.heightPercentage = newHeightPerc;
|
||||
|
||||
document.getElementById("rs-height").value = newHeight
|
||||
data.height = newHeight;
|
||||
}
|
||||
|
||||
document.getElementById("rs-width").value *= ratio;
|
||||
document.getElementById("rs-width").value = newWidth;
|
||||
data.width = newWidth;
|
||||
}
|
||||
|
||||
function changedHeightPercentage(event) {
|
||||
let oldValue = data.heightPercentage;
|
||||
let ratio;
|
||||
let newHeight, newWidth, newWidthPerc;
|
||||
|
||||
data.heightPercentage = event.target.value;
|
||||
delta = data.heightPercentage - oldValue;
|
||||
|
||||
ratio = data.heightPercentage / oldValue;
|
||||
|
||||
newWidth = document.getElementById("rs-width").value * ratio;
|
||||
newWidthPerc = data.heightPercentage * currentRatio;
|
||||
newHeight = document.getElementById("rs-height").value * ratio;
|
||||
|
||||
if (keepRatio) {
|
||||
document.getElementById("rs-width-percentage").value = data.heightPercentage * currentRatio;
|
||||
document.getElementById("rs-width").value *= ratio;
|
||||
data.widthPercentage = newWidthPerc;
|
||||
|
||||
document.getElementById("rs-width").value = newWidth;
|
||||
data.width = newWidth;
|
||||
}
|
||||
|
||||
document.getElementById("rs-height").value *= ratio;
|
||||
document.getElementById("rs-height").value = newHeight;
|
||||
data.height = newHeight;
|
||||
}
|
||||
|
||||
function toggleRatio(event) {
|
||||
|
Reference in New Issue
Block a user