jewbird
/
asciibird
3
3
Fork 0
Code Issues Pull Requests Releases Activity

fill fix for now (reverted to older code), export optimisations to save precious width space, package update

This commit is contained in:
Hugh Bord 2022-08-10 13:29:30 +08:00
parent 4717cdea1f
commit cf1605de2f
4 changed files with 1900 additions and 1652 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
README.md
View File

@ -205,6 +205,10 @@ Doesn't exist at the moment. While the underlying functions and code is compatib
* Ctrl + Shift + w - Move Layer Up
* Ctrl + Shift + m - Merge All Layers
# Half Block editing Mode
# Context Menus (right click menus)
* Right clicking on any brush preview in the main area or library will allow you to export to PNG, txt or clipboard just the brush itself.

17
src/ascii.js
View File

File diff suppressed because one or more lines are too long

197
src/views/Editor.vue
View File

@ -1713,6 +1713,7 @@ export default {
// Draw the preview brush
const arrayY = brushY / blockHeight;
const arrayX = brushX / blockWidth;
let targetBlock = this.currentAsciiLayerBlocks[arrayY][arrayX];
let oldBlock = { ... this.currentAsciiLayerBlocks[arrayY][arrayX]};
@ -1764,8 +1765,6 @@ export default {
let brushDiffX = 0;
let xLength = false;
// If the first row isn't selected then we cannot get the width
// with the 0 index
for (let i = 0; i <= this.brushBlocks.length; i++) {
@ -1828,7 +1827,7 @@ export default {
// Force 1x1 when half block editing mode as we ignore the brush
if (this.toolbarState.halfBlockEditing) {
await this.drawHalfBlocks(brushX, brushY);
await this.drawHalfBlocks(brushX, brushY);
} else {
if (this.canBg) {
await this.drawBrushBlocks(brushX, brushY, brushBlock, "bg");
@ -1841,17 +1840,15 @@ export default {
await this.drawBrushBlocks(brushX, brushY, brushBlock, null);
}
if (this.canTool) {
await this.storeDiffBlocks(
arrayX,
arrayY,
oldBlock,
brushBlock
);
}
}
if (this.canTool) {
await this.storeDiffBlocks(
arrayX,
arrayY,
oldBlock,
brushBlock
);
}
} else if (this.isErasing) {
await this.drawBrushBlocks(
brushX,
@ -1862,6 +1859,7 @@ export default {
);
}
}
}
}
},
async storeDiffBlocks(x, y, oldBlock, newBlock) {
@ -2010,9 +2008,107 @@ export default {
}
}
},
// Fill tool
fill(eraser = false) {
const newColor = {
bg: this.currentBg,
// fg: this.currentFg,
char: this.currentChar,
};
const current = { ...this.asciiBlockAtXy };
if (!this.canBg) {
delete newColor["bg"];
}
// if (!this.canFg) {
// delete newColor["fg"];
// }
if (!this.canText) {
delete newColor["char"];
}
// If the newColor is same as the existing
// Then return the original image.
if (JSON.stringify(current) === JSON.stringify(newColor) && !eraser) {
return;
}
this.fillTool(
this.currentAsciiLayerBlocks,
this.y,
this.x,
current,
eraser
);
},
fillTool(currentLayerBlocks, y, x, current, eraser) {
if (y >= Math.floor(this.canvas.height / blockHeight)) {
return;
}
if (x >= Math.floor(this.canvas.width / blockWidth)) {
return;
}
if (
currentLayerBlocks[y] === undefined ||
currentLayerBlocks[y][x] === undefined
) {
return;
}
let targetBlock = currentLayerBlocks[y][x];
if (this.canBg && targetBlock.bg !== current.bg) {
return;
}
// if (this.canFg && targetBlock.fg !== current.fg) {
// return;
// }
if (this.canText && targetBlock.char !== current.char) {
return;
}
// We can eraser or fill
let oldBlock = { ...targetBlock };
if (!eraser) {
if (this.canBg) {
targetBlock.bg = this.currentBg;
}
if (this.canFg) {
targetBlock.fg = this.currentFg;
}
if (this.canText) {
targetBlock.char = this.currentChar;
}
} else {
// If we are fill erasing
if (this.canBg) {
delete targetBlock["bg"];
}
if (this.canFg) {
delete targetBlock["fg"];
}
if (this.canText) {
delete targetBlock["char"];
}
}
// if (!this.diffBlocks.new && !this.diffBlocks.new[y] && !this.diffBlocks.new[y][x]) {
this.storeDiffBlocks(x, y, oldBlock, targetBlock);
// }
// Fill in all four directions
// Fill Prev row
if (currentLayerBlocks[y] && currentLayerBlocks[y][x - 1]) {
this.fillTool(currentLayerBlocks, y, x - 1, current, eraser);
}
// Fill Next row
if (currentLayerBlocks[y] && currentLayerBlocks[y][x + 1]) {
this.fillTool(currentLayerBlocks, y, x + 1, current, eraser);
}
// Fill Prev col
if (currentLayerBlocks[y - 1] && currentLayerBlocks[y - 1][x]) {
this.fillTool(currentLayerBlocks, y - 1, x, current, eraser);
}
// Fill next col
if (currentLayerBlocks[y + 1] && currentLayerBlocks[y + 1][x]) {
this.fillTool(currentLayerBlocks, y + 1, x, current, eraser);
}
return;
},
// Fill tool
floodFill(eraser = false) {
const newColor = {
bg: this.currentBg,
fg: this.currentFg,
@ -2036,6 +2132,7 @@ export default {
delete newColor["char"];
}
if (JSON.stringify(current) == JSON.stringify(newColor)) {
return;
}
@ -2047,55 +2144,87 @@ export default {
while (stack.length) {
let pos = stack.shift();
// left
if (this.currentAsciiLayerBlocks[pos.y][pos.x - 1] &&
(this.currentAsciiLayerBlocks[pos.y][pos.x-1].bg == (current.bg || undefined)
// this.currentAsciiLayerBlocks[pos.y][pos.x-1].fg == (current.fg || undefined) ||
// this.currentAsciiLayerBlocks[pos.y][pos.x-1].char == (current.char || undefined)
if (this.currentAsciiLayerBlocks[pos.y][pos.x - 1] && pos.x - 1 < this.currentAsciiWidth && pos.y < this.currentAsciiHeight &&
(this.currentAsciiLayerBlocks[pos.y][pos.x-1].bg == (current.bg || undefined) &&
(this.canFg && this.currentAsciiLayerBlocks[pos.y][pos.x-1].fg == (current.fg || undefined)) &&
(this.canText && this.currentAsciiLayerBlocks[pos.y][pos.x-1].char == (current.char || undefined))
)) {
this.storeDiffBlocks(pos.x - 1, pos.y, this.currentAsciiLayerBlocks[pos.y][pos.x -1], newColor);
this.currentAsciiLayerBlocks[pos.y][pos.x-1] = (eraser ? { ... emptyBlock} : { ... newColor });
stack.push({ x: pos.x - 1, y: pos.y});
// if (!stackX.includes(pos.x - 1) || !stackY.includes(pos.y)) {
stack.push({ x: pos.x - 1, y: pos.y});
// stackX.push(pos.x - 1);
// stackY.push(pos.y);
// }
}
//right
if (this.currentAsciiLayerBlocks[pos.y][pos.x + 1] &&
(this.currentAsciiLayerBlocks[pos.y][pos.x+1].bg == (current.bg || undefined)
// this.currentAsciiLayerBlocks[pos.y][pos.x+1].fg == (current.fg || undefined) ||
// this.currentAsciiLayerBlocks[pos.y][pos.x+1].char == (current.char || undefined)
if (this.currentAsciiLayerBlocks[pos.y][pos.x + 1] && pos.x + 1 < this.currentAsciiWidth && pos.y < this.currentAsciiHeight &&
(this.currentAsciiLayerBlocks[pos.y][pos.x+1].bg == (current.bg || undefined) &&
(this.canFg && this.currentAsciiLayerBlocks[pos.y][pos.x+1].fg == (current.fg || undefined)) &&
(this.canText && this.currentAsciiLayerBlocks[pos.y][pos.x+1].char == (current.char || undefined))
)) {
this.storeDiffBlocks(pos.x + 1, pos.y, this.currentAsciiLayerBlocks[pos.y][pos.x+1], newColor);
this.currentAsciiLayerBlocks[pos.y][pos.x+1] = (eraser ? { ... emptyBlock} : { ... newColor });
stack.push({ x: pos.x + 1, y: pos.y });
// if (!stackX.includes(pos.x + 1) || !stackY.includes(pos.y)) {
stack.push({ x: pos.x + 1, y: pos.y });
// stackX.push(pos.x + 1);
// stackY.push(pos.y);
// }
}
// top
if (this.currentAsciiLayerBlocks[pos.y - 1] &&
(this.currentAsciiLayerBlocks[pos.y-1][pos.x].bg == (current.bg || undefined)
// this.currentAsciiLayerBlocks[pos.y-1][pos.x].fg == (current.fg || undefined) ||
// this.currentAsciiLayerBlocks[pos.y-1][pos.x].char == (current.char || undefined)
if (this.currentAsciiLayerBlocks[pos.y - 1] && this.currentAsciiLayerBlocks[pos.y - 1][pos.x] && pos.x < this.currentAsciiWidth && pos.y - 1 < this.currentAsciiHeight &&
(this.currentAsciiLayerBlocks[pos.y-1][pos.x].bg == (current.bg || undefined) &&
(this.canFg && this.currentAsciiLayerBlocks[pos.y-1][pos.x].fg == (current.fg || undefined)) &&
(this.canText && this.currentAsciiLayerBlocks[pos.y-1][pos.x].char == (current.char || undefined))
)) {
this.storeDiffBlocks(pos.x, pos.y - 1, this.currentAsciiLayerBlocks[pos.y-1][pos.x], newColor);
this.currentAsciiLayerBlocks[pos.y -1 ][pos.x] = (eraser ? { ... emptyBlock} : { ... newColor });
stack.push({ x: pos.x, y: pos.y - 1});
// if (!stackX.includes(pos.x) || !stackY.includes(pos.y - 1)) {
stack.push({ x: pos.x, y: pos.y - 1});
// stackX.push(pos.x);
// stackY.push(pos.y - 1);
// }
}
// bottom
if (this.currentAsciiLayerBlocks[pos.y + 1] &&
(this.currentAsciiLayerBlocks[pos.y+1][pos.x].bg == (current.bg || undefined)
// this.currentAsciiLayerBlocks[pos.y+1][pos.x].fg == (current.fg || undefined) ||
// this.currentAsciiLayerBlocks[pos.y+1][pos.x].char == (current.char || undefined)
if (this.currentAsciiLayerBlocks[pos.y + 1] && this.currentAsciiLayerBlocks[pos.y + 1][pos.x] && pos.x < this.currentAsciiWidth && pos.y + 1 < this.currentAsciiHeight &&
(this.currentAsciiLayerBlocks[pos.y+1][pos.x].bg == (current.bg || undefined) &&
(this.canFg && this.currentAsciiLayerBlocks[pos.y+1][pos.x].fg == (current.fg || undefined)) &&
(this.canText && this.currentAsciiLayerBlocks[pos.y+1][pos.x].char == (current.char || undefined))
)) {
this.storeDiffBlocks(pos.x, pos.y + 1, this.currentAsciiLayerBlocks[pos.y+1][pos.x], newColor);
this.currentAsciiLayerBlocks[pos.y + 1][pos.x] = (eraser ? { ... emptyBlock} : { ... newColor });
stack.push({ x: pos.x, y: pos.y + 1});
// if (!stackX.includes(pos.x) || !stackY.includes(pos.y + 1)) {
stack.push({ x: pos.x, y: pos.y + 1});
// stackX.push(pos.x);
// stackY.push(pos.y + 1);
// }
}
// Absolute base case
if (stack.length >= (this.currentAsciiHeight * this.currentAsciiWidth)) {
break;
}
// stackX.push(pos.x);
// stackY.push(pos.y);
}

3334
yarn.lock
View File

File diff suppressed because it is too large Load Diff