mirror of
https://github.com/lospec/pixel-editor.git
synced 2023-08-10 21:12:51 +03:00
Added back rect selection
This commit is contained in:
parent
a56d7092fc
commit
ea45fa4842
@ -401,7 +401,7 @@ const ColorModule = (() => {
|
||||
let dataLength = imageData.length;
|
||||
|
||||
for (let j=0; j<dataLength; j += 4) {
|
||||
if (!isPixelEmpty(imageData[j])) {
|
||||
if (!Util.isPixelEmpty(imageData[j])) {
|
||||
let color = imageData[j]+','+imageData[j + 1]+','+imageData[j + 2];
|
||||
|
||||
if (!colors[color]) {
|
||||
|
@ -83,8 +83,8 @@ const LayerList = (() => {
|
||||
belowImageData.data[i+2], belowImageData.data[i+3]
|
||||
];
|
||||
|
||||
if (isPixelEmpty(currentMovePixel)) {
|
||||
if (!isPixelEmpty(belowImageData)) {
|
||||
if (Util.isPixelEmpty(currentMovePixel)) {
|
||||
if (!Util.isPixelEmpty(belowImageData)) {
|
||||
toMergeImageData.data[i] = currentUnderlyingPixel[0];
|
||||
toMergeImageData.data[i+1] = currentUnderlyingPixel[1];
|
||||
toMergeImageData.data[i+2] = currentUnderlyingPixel[2];
|
||||
|
@ -9,11 +9,11 @@ const ToolManager = (() => {
|
||||
panTool = new PanTool("pan", {type: 'custom'}, switchTool);
|
||||
zoomTool = new ZoomTool("zoom", {type:'custom'});
|
||||
|
||||
rectSelectTool = new RectangularSelectionTool("rectselect",
|
||||
{type: 'cursor', style:'crosshair'}, switchTool);
|
||||
moveSelectionTool = new MoveSelectionTool("moveselection",
|
||||
{type:'cursor', style:'crosshair'}, switchTool);
|
||||
|
||||
{type:'cursor', style:'crosshair'}, switchTool, brushTool);
|
||||
rectSelectTool = new RectangularSelectionTool("rectselect",
|
||||
{type: 'cursor', style:'crosshair'}, switchTool, moveSelectionTool);
|
||||
|
||||
currTool = brushTool;
|
||||
currTool.onSelect();
|
||||
canvasView.style.cursor = 'default';
|
||||
|
111
js/_move.js
111
js/_move.js
@ -1,111 +0,0 @@
|
||||
// REFACTOR: let's keep this one for the end
|
||||
var imageDataToMove;
|
||||
var originalDataPosition;
|
||||
var canMoveSelection = false;
|
||||
var lastMovePos;
|
||||
var selectionCanceled = true;
|
||||
var firstTimeMove = true;
|
||||
|
||||
// TODO: move with arrows
|
||||
/** Updates the move preview so that is placed in the right position
|
||||
*
|
||||
* @param {*} mousePosition The position of the cursor
|
||||
*/
|
||||
function updateMovePreview(mousePosition) {
|
||||
// I haven't canceled the selection
|
||||
selectionCanceled = false;
|
||||
|
||||
// If it's the first time that I move the selection, I cut it from its original position
|
||||
if (firstTimeMove) {
|
||||
cutSelection(mousePosition);
|
||||
}
|
||||
|
||||
firstTimeMove = false;
|
||||
|
||||
lastMousePos = mousePosition;
|
||||
// clear the entire tmp layer
|
||||
TMPLayer.context.clearRect(0, 0, TMPLayer.canvas.width, TMPLayer.canvas.height);
|
||||
// put the image data on the tmp layer with offset
|
||||
TMPLayer.context.putImageData(
|
||||
imageDataToMove,
|
||||
Math.round(lastMousePos[0] / zoom) - imageDataToMove.width / 2,
|
||||
Math.round(lastMousePos[1] / zoom) - imageDataToMove.height / 2);
|
||||
|
||||
lastMovePos = lastMousePos;
|
||||
// Moving the the rectangular ants
|
||||
moveSelection(lastMousePos[0] / zoom, lastMousePos[1] / zoom, imageDataToMove.width, imageDataToMove.height);
|
||||
}
|
||||
|
||||
/** Ends a selection, meaning that it makes the changes definitive and creates the history states
|
||||
*
|
||||
*/
|
||||
function endSelection() {
|
||||
// Clearing the tmp (move preview) and vfx (ants) layers
|
||||
TMPLayer.context.clearRect(0, 0, TMPLayer.canvas.width, TMPLayer.canvas.height);
|
||||
VFXLayer.context.clearRect(0, 0, VFXLayer.canvas.width, VFXLayer.canvas.height);
|
||||
// Preparing an empty imageData with the size of the canvas
|
||||
let cleanImageData = new ImageData(endX - startX, endY - startY);
|
||||
|
||||
// If I was moving something
|
||||
if (imageDataToMove !== undefined) {
|
||||
// Saving the current clipboard before editing it in order to merge it with the current layer
|
||||
cleanImageData.data.set(imageDataToMove.data);
|
||||
|
||||
// I have to save the underlying data, so that the transparent pixels in the clipboard
|
||||
// don't override the coloured pixels in the canvas
|
||||
let underlyingImageData = currentLayer.context.getImageData(startX, startY, endX - startX, endY - startY);
|
||||
|
||||
for (let i=0; i<underlyingImageData.data.length; i+=4) {
|
||||
let currentMovePixel = [
|
||||
imageDataToMove.data[i], imageDataToMove.data[i+1],
|
||||
imageDataToMove.data[i+2], imageDataToMove.data[i+3]
|
||||
];
|
||||
|
||||
let currentUnderlyingPixel = [
|
||||
underlyingImageData.data[i], underlyingImageData.data[i+1],
|
||||
underlyingImageData.data[i+2], underlyingImageData.data[i+3]
|
||||
];
|
||||
|
||||
// If the pixel of the clipboard is empty, but the one below it isn't, I use the pixel below
|
||||
if (isPixelEmpty(currentMovePixel)) {
|
||||
if (!isPixelEmpty(underlyingImageData)) {
|
||||
imageDataToMove.data[i] = currentUnderlyingPixel[0];
|
||||
imageDataToMove.data[i+1] = currentUnderlyingPixel[1];
|
||||
imageDataToMove.data[i+2] = currentUnderlyingPixel[2];
|
||||
imageDataToMove.data[i+3] = currentUnderlyingPixel[3];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// If I moved the selection before confirming it
|
||||
if (lastMovePos !== undefined) {
|
||||
// I put it in the new position
|
||||
currentLayer.context.putImageData(
|
||||
imageDataToMove,
|
||||
Math.round(lastMovePos[0] / zoom) - imageDataToMove.width / 2,
|
||||
Math.round(lastMovePos[1] / zoom) - imageDataToMove.height / 2);
|
||||
}
|
||||
else {
|
||||
// I put it in the same position
|
||||
currentLayer.context.putImageData(
|
||||
imageDataToMove,
|
||||
copiedStartX,
|
||||
copiedStartY);
|
||||
}
|
||||
|
||||
imageDataToMove.data.set(cleanImageData.data);
|
||||
}
|
||||
|
||||
// Resetting all the flags
|
||||
selectionCanceled = true;
|
||||
isRectSelecting = false;
|
||||
firstTimeMove = true;
|
||||
imageDataToMove = undefined;
|
||||
isPasting = false;
|
||||
isCutting = false;
|
||||
lastMovePos = undefined;
|
||||
currentLayer.updateLayerPreview();
|
||||
|
||||
// Saving the history
|
||||
new HistoryState().EditCanvas();
|
||||
}
|
@ -1,70 +0,0 @@
|
||||
/** Cuts the selection from its canvas and puts it in the tmp layer so it can be moved
|
||||
*
|
||||
* @param {*} mousePosition
|
||||
*/
|
||||
function cutSelection(mousePosition) {
|
||||
// Getting the selected pixels
|
||||
imageDataToMove = currentLayer.context.getImageData(startX, startY, endX - startX + 1, endY - startY + 1);
|
||||
|
||||
currentLayer.context.clearRect(startX - 0.5, startY - 0.5, endX - startX + 1, endY - startY + 1);
|
||||
// Moving those pixels from the current layer to the tmp layer
|
||||
TMPLayer.context.putImageData(imageDataToMove, startX + 1, startY);
|
||||
}
|
||||
|
||||
function applyChanges() {
|
||||
VFXLayer.canvas.style.zIndex = MIN_Z_INDEX;
|
||||
}
|
||||
|
||||
// Checks whether the pointer is inside the selected area or not
|
||||
function cursorInSelectedArea() {
|
||||
// Getting the cursor position
|
||||
let cursorPos = Input.getCursorPosition(Input.getCurrMouseEvent());
|
||||
// Getting the coordinates relatively to the canvas
|
||||
let x = cursorPos[0] / zoom;
|
||||
let y = cursorPos[1] / zoom;
|
||||
|
||||
// This is to avoid rightX or topY being less than leftX or bottomY
|
||||
let leftX = Math.min(startX, endX);
|
||||
let rightX = Math.max(startX, endX);
|
||||
let topY = Math.max(startY, endY);
|
||||
let bottomY = Math.min(startY, endY);
|
||||
|
||||
if (leftX <= x && x <= rightX) {
|
||||
if (bottomY <= y && y <= topY) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/** Moves the rect ants to the specified position
|
||||
*
|
||||
* @param {*} x X coordinate of the rect ants
|
||||
* @param {*} y Y coordinat of the rect ants
|
||||
* @param {*} width Width of the selection
|
||||
* @param {*} height Height of the selectin
|
||||
*/
|
||||
function moveSelection(x, y, width, height) {
|
||||
// Getting the vfx context
|
||||
let vfxContext = VFXLayer.context;
|
||||
|
||||
// Clearing the vfx canvas
|
||||
vfxContext.clearRect(0, 0, VFXLayer.canvas.width, VFXLayer.canvas.height);
|
||||
vfxContext.lineWidth = 1;
|
||||
vfxContext.setLineDash([4]);
|
||||
|
||||
// Fixing the coordinates
|
||||
startX = Math.round(Math.round(x) - 0.5 - Math.round(width / 2)) + 0.5;
|
||||
startY = Math.round(Math.round(y) - 0.5 - Math.round(height / 2)) + 0.5;
|
||||
endX = startX + Math.round(width);
|
||||
endY = startY + Math.round(height);
|
||||
|
||||
// Drawing the rect
|
||||
vfxContext.beginPath();
|
||||
vfxContext.rect(startX, startY, width, height);
|
||||
|
||||
vfxContext.stroke();
|
||||
}
|
@ -227,7 +227,7 @@ function trimCanvas(event, saveHistory) {
|
||||
let pixelPosition;
|
||||
|
||||
for (let i=imageData.data.length - 1; i>= 0; i-=4) {
|
||||
if (!isPixelEmpty(
|
||||
if (!Util.isPixelEmpty(
|
||||
[imageData.data[i - 3], imageData.data[i - 2],
|
||||
-imageData.data[i - 1], imageData.data[i]])) {
|
||||
pixelPosition = getPixelPosition(i);
|
||||
|
@ -35,7 +35,8 @@ class Tool {
|
||||
}
|
||||
|
||||
onSelect() {
|
||||
this.mainButton.parentElement.classList.add("selected");
|
||||
if (this.mainButton != undefined)
|
||||
this.mainButton.parentElement.classList.add("selected");
|
||||
this.isSelected = true;
|
||||
|
||||
switch (this.cursorType.type) {
|
||||
@ -83,7 +84,8 @@ class Tool {
|
||||
}
|
||||
|
||||
onDeselect() {
|
||||
this.mainButton.parentElement.classList.remove("selected");
|
||||
if (this.mainButton != undefined)
|
||||
this.mainButton.parentElement.classList.remove("selected");
|
||||
this.isSelected = false;
|
||||
}
|
||||
|
||||
|
@ -56,8 +56,6 @@
|
||||
//=include _toolButtons.js
|
||||
//=include FileManager.js
|
||||
//=include TopMenuModule.js
|
||||
//=include _rectSelect.js
|
||||
//=include _move.js
|
||||
//=include _ellipse.js
|
||||
|
||||
/**event listeners**/
|
||||
|
@ -53,7 +53,7 @@ class FillTool extends Tool {
|
||||
//the color of the cluster that is being filled
|
||||
let clusterColor = [tempImage.data[startingPosition],tempImage.data[startingPosition+1],tempImage.data[startingPosition+2], tempImage.data[startingPosition+3]];
|
||||
|
||||
//the new color to fill with
|
||||
//the color to fill with
|
||||
let fillColor = Color.hexToRgb(currentLayer.context.fillStyle);
|
||||
|
||||
//if you try to fill with the same color that's already there, exit the function
|
||||
@ -61,7 +61,6 @@ class FillTool extends Tool {
|
||||
clusterColor[1] == fillColor.g &&
|
||||
clusterColor[2] == fillColor.b &&
|
||||
clusterColor[3] != 0) {
|
||||
console.log("Returned");
|
||||
return;
|
||||
}
|
||||
|
||||
@ -90,6 +89,7 @@ class FillTool extends Tool {
|
||||
++y;
|
||||
reachLeft = false;
|
||||
reachRight = false;
|
||||
|
||||
while (y++ < canvasSize[1] - 1 && matchStartColor(tempImage, pixelPos, clusterColor)) {
|
||||
colorPixel(tempImage, pixelPos, fillColor);
|
||||
if (x > 0) {
|
||||
|
@ -1,14 +1,39 @@
|
||||
class MoveSelectionTool extends Tool {
|
||||
constructor (name, options, switchFunc) {
|
||||
currSelection = undefined;
|
||||
selectionTool = undefined;
|
||||
endTool = undefined;
|
||||
switchFunc = undefined;
|
||||
|
||||
constructor (name, options, switchFunc, endTool) {
|
||||
super(name, options, switchFunc);
|
||||
|
||||
this.switchFunc = switchFunc;
|
||||
this.endTool = endTool;
|
||||
}
|
||||
|
||||
onStart(mousePos) {
|
||||
super.onStart(mousePos);
|
||||
|
||||
if (!this.cursorInSelectedArea(mousePos)) {
|
||||
this.endSelection();
|
||||
}
|
||||
}
|
||||
|
||||
onDrag(mousePos) {
|
||||
super.onDrag(mousePos);
|
||||
|
||||
if (this.cursorInSelectedArea(mousePos)) {
|
||||
this.currSelection = this.selectionTool.moveAnts(mousePos[0]/zoom,
|
||||
mousePos[1]/zoom, this.currSelection.width, this.currSelection.height);
|
||||
|
||||
// clear the entire tmp layer
|
||||
TMPLayer.context.clearRect(0, 0, TMPLayer.canvas.width, TMPLayer.canvas.height);
|
||||
// put the image data on the tmp layer with offset
|
||||
TMPLayer.context.putImageData(
|
||||
this.currSelection.data,
|
||||
Math.round(mousePos[0] / zoom) - this.currSelection.width / 2,
|
||||
Math.round(mousePos[1] / zoom) - this.currSelection.height / 2);
|
||||
}
|
||||
}
|
||||
|
||||
onEnd(mousePos) {
|
||||
@ -16,10 +41,90 @@ class MoveSelectionTool extends Tool {
|
||||
}
|
||||
|
||||
onSelect() {
|
||||
super.onSelect(mousePos);
|
||||
super.onSelect();
|
||||
}
|
||||
|
||||
onDeselect() {
|
||||
super.onDeselect(mousePos);
|
||||
super.onDeselect();
|
||||
}
|
||||
|
||||
setSelectionData(data, tool) {
|
||||
this.currSelection = data;
|
||||
this.selectionTool = tool;
|
||||
this.firstTimeMove = true;
|
||||
}
|
||||
|
||||
onHover(mousePos) {
|
||||
super.onHover(mousePos);
|
||||
|
||||
if (this.cursorInSelectedArea(mousePos)) {
|
||||
canvasView.style.cursor = 'move';
|
||||
}
|
||||
else {
|
||||
canvasView.style.cursor = 'default';
|
||||
}
|
||||
}
|
||||
|
||||
cursorInSelectedArea(cursorPos) {
|
||||
// Getting the coordinates relatively to the canvas
|
||||
let x = cursorPos[0] / zoom;
|
||||
let y = cursorPos[1] / zoom;
|
||||
|
||||
if (this.currSelection.left <= x && x <= this.currSelection.right) {
|
||||
if (y <= this.currSelection.bottom && y >= this.currSelection.top) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
return false;
|
||||
}
|
||||
|
||||
endSelection() {
|
||||
// Clearing the tmp (move preview) and vfx (ants) layers
|
||||
TMPLayer.context.clearRect(0, 0, TMPLayer.canvas.width, TMPLayer.canvas.height);
|
||||
VFXLayer.context.clearRect(0, 0, VFXLayer.canvas.width, VFXLayer.canvas.height);
|
||||
|
||||
// I have to save the underlying data, so that the transparent pixels in the clipboard
|
||||
// don't override the coloured pixels in the canvas
|
||||
let underlyingImageData = currentLayer.context.getImageData(
|
||||
this.currSelection.left, this.currSelection.top,
|
||||
this.currSelection.width, this.currSelection.height
|
||||
);
|
||||
|
||||
for (let i=0; i<underlyingImageData.data.length; i+=4) {
|
||||
let currentMovePixel = [
|
||||
this.currSelection.data.data[i], this.currSelection.data.data[i+1],
|
||||
this.currSelection.data.data[i+2], this.currSelection.data.data[i+3]
|
||||
];
|
||||
|
||||
let currentUnderlyingPixel = [
|
||||
underlyingImageData.data[i], underlyingImageData.data[i+1],
|
||||
underlyingImageData.data[i+2], underlyingImageData.data[i+3]
|
||||
];
|
||||
|
||||
// If the pixel of the clipboard is empty, but the one below it isn't, I use the pixel below
|
||||
if (Util.isPixelEmpty(currentMovePixel)) {
|
||||
if (!Util.isPixelEmpty(underlyingImageData)) {
|
||||
this.currSelection.data.data[i] = currentUnderlyingPixel[0];
|
||||
this.currSelection.data.data[i+1] = currentUnderlyingPixel[1];
|
||||
this.currSelection.data.data[i+2] = currentUnderlyingPixel[2];
|
||||
this.currSelection.data.data[i+3] = currentUnderlyingPixel[3];
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
currentLayer.context.putImageData(
|
||||
this.currSelection.data,
|
||||
this.currSelection.left,
|
||||
this.currSelection.top);
|
||||
|
||||
this.currSelection = undefined;
|
||||
currentLayer.updateLayerPreview();
|
||||
VFXLayer.canvas.style.zIndex = MIN_Z_INDEX;
|
||||
|
||||
// Saving history
|
||||
new HistoryState().EditCanvas();
|
||||
// Switch to brush
|
||||
this.switchFunc(this.endTool);
|
||||
}
|
||||
}
|
@ -20,7 +20,7 @@ class RectangleTool extends ResizableTool {
|
||||
changeFillType() {
|
||||
if (this.isSelected)
|
||||
if (this.currFillMode == 'empty') {
|
||||
this.currFillMode = 'full';
|
||||
this.currFillMode = 'fill';
|
||||
this.emptyRectangleSVG.setAttribute('display', 'none');
|
||||
this.fullRectangleSVG.setAttribute('display', 'visible');
|
||||
}
|
||||
@ -36,8 +36,6 @@ class RectangleTool extends ResizableTool {
|
||||
onStart(mousePos) {
|
||||
super.onStart(mousePos);
|
||||
|
||||
console.log("Rect start");
|
||||
|
||||
// Putting the tmp layer on top of everything
|
||||
TMPLayer.canvas.style.zIndex = parseInt(currentLayer.canvas.style.zIndex, 10) + 1;
|
||||
|
||||
@ -46,8 +44,6 @@ class RectangleTool extends ResizableTool {
|
||||
}
|
||||
|
||||
onDrag(mousePos, cursorTarget) {
|
||||
super.onDrag(mousePos);
|
||||
console.log("dragging");
|
||||
|
||||
// Drawing the rect at the right position
|
||||
this.drawRect(Math.floor(mousePos[0] / zoom) + 0.5, Math.floor(mousePos[1] / zoom) + 0.5);
|
||||
@ -123,7 +119,6 @@ class RectangleTool extends ResizableTool {
|
||||
* @param {*} y The current end y of the rectangle
|
||||
*/
|
||||
drawRect(x, y) {
|
||||
console.log("here");
|
||||
// Getting the tmp context
|
||||
let tmpContext = TMPLayer.context;
|
||||
|
||||
|
@ -1,7 +1,13 @@
|
||||
class RectangularSelectionTool extends SelectionTool {
|
||||
constructor (name, options, switchFunc) {
|
||||
switchFunc = undefined;
|
||||
moveTool = undefined;
|
||||
currSelection = {};
|
||||
|
||||
constructor (name, options, switchFunc, moveTool) {
|
||||
super(name, options, switchFunc);
|
||||
|
||||
this.switchFunc = switchFunc;
|
||||
this.moveTool = moveTool;
|
||||
Events.on('click', this.mainButton, switchFunc, this);
|
||||
}
|
||||
|
||||
@ -33,14 +39,14 @@ class RectangularSelectionTool extends SelectionTool {
|
||||
}
|
||||
|
||||
// Drawing the rect
|
||||
this.drawRect(this.startMousePos[0], this.startMousePos[1]);
|
||||
this.drawSelection(this.startMousePos[0], this.startMousePos[1]);
|
||||
}
|
||||
|
||||
onDrag(mousePos) {
|
||||
super.onDrag(mousePos);
|
||||
|
||||
// Drawing the rect
|
||||
this.drawRect(Math.round(mousePos[0] / zoom) + 0.5, Math.round(mousePos[1] / zoom) + 0.5);
|
||||
this.drawSelection(Math.round(mousePos[0] / zoom) + 0.5, Math.round(mousePos[1] / zoom) + 0.5);
|
||||
}
|
||||
|
||||
onEnd(mousePos) {
|
||||
@ -62,6 +68,33 @@ class RectangularSelectionTool extends SelectionTool {
|
||||
this.endMousePos[1] = this.startMousePos[1];
|
||||
this.startMousePos[1] = tmp;
|
||||
}
|
||||
|
||||
// Switch to the move tool so that the user can move the selection
|
||||
this.switchFunc(this.moveTool);
|
||||
// Preparing data for the move tool
|
||||
let dataWidth = this.endMousePos[0] - this.startMousePos[0];
|
||||
let dataHeight = this.endMousePos[1] - this.startMousePos[1];
|
||||
|
||||
this.currSelection = {
|
||||
left: this.startMousePos[0], right: this.endMousePos[0],
|
||||
top: this.startMousePos[1], bottom: this.endMousePos[1],
|
||||
|
||||
width: dataWidth,
|
||||
height: dataHeight,
|
||||
|
||||
data: currentLayer.context.getImageData(
|
||||
this.startMousePos[0], this.startMousePos[1],
|
||||
dataWidth + 1, dataHeight + 1)
|
||||
};
|
||||
|
||||
// Moving the selection to the TMP layer. It will be moved back to the original
|
||||
// layer if the user will cancel or end the selection
|
||||
currentLayer.context.clearRect(this.startMousePos[0] - 0.5, this.startMousePos[1] - 0.5,
|
||||
dataWidth + 1, dataHeight + 1);
|
||||
// Moving those pixels from the current layer to the tmp layer
|
||||
TMPLayer.context.putImageData(this.currSelection.data, this.startMousePos[0], this.startMousePos[1]);
|
||||
|
||||
this.moveTool.setSelectionData(this.currSelection, this);
|
||||
}
|
||||
|
||||
onSelect() {
|
||||
@ -72,7 +105,7 @@ class RectangularSelectionTool extends SelectionTool {
|
||||
super.onDeselect();
|
||||
}
|
||||
|
||||
drawRect(x, y) {
|
||||
drawSelection(x, y) {
|
||||
// Getting the vfx context
|
||||
let vfxContext = VFXLayer.context;
|
||||
|
||||
@ -88,4 +121,37 @@ class RectangularSelectionTool extends SelectionTool {
|
||||
|
||||
vfxContext.stroke();
|
||||
}
|
||||
|
||||
/** Moves the rect ants to the specified position
|
||||
*
|
||||
* @param {*} x X coordinate of the rect ants
|
||||
* @param {*} y Y coordinat of the rect ants
|
||||
* @param {*} width Width of the selection
|
||||
* @param {*} height Height of the selectione
|
||||
*
|
||||
* @return The data regarding the current position and size of the selection
|
||||
*/
|
||||
moveAnts(x, y, width, height) {
|
||||
// Getting the vfx context
|
||||
let vfxContext = VFXLayer.context;
|
||||
let ret = this.currSelection;
|
||||
|
||||
// Clearing the vfx canvas
|
||||
vfxContext.clearRect(0, 0, VFXLayer.canvas.width, VFXLayer.canvas.height);
|
||||
vfxContext.lineWidth = 1;
|
||||
vfxContext.setLineDash([4]);
|
||||
|
||||
// Fixing the coordinates
|
||||
this.currSelection.left = Math.round(Math.round(x) - 0.5 - Math.round(width / 2)) + 0.5;
|
||||
this.currSelection.top = Math.round(Math.round(y) - 0.5 - Math.round(height / 2)) + 0.5;
|
||||
this.currSelection.right = this.currSelection.left + Math.round(width);
|
||||
this.currSelection.bottom = this.currSelection.top + Math.round(height);
|
||||
|
||||
// Drawing the rect
|
||||
vfxContext.beginPath();
|
||||
vfxContext.rect(this.currSelection.left, this.currSelection.top, width, height);
|
||||
vfxContext.stroke();
|
||||
|
||||
return ret;
|
||||
}
|
||||
}
|
Loading…
x
Reference in New Issue
Block a user