This commit is contained in:
Hugh Bord 2021-06-29 11:49:39 +10:00
parent beb8066e08
commit c54b2e28d2
4 changed files with 68 additions and 111 deletions

View File

@ -16,7 +16,6 @@
```
# BUGS
* Odd row width makes brush off by one
* If you resize an ascii, and then undo and try fill in blocks it will error cuz the blocks don't exist
* Redo (ctrl y) is a buggy
* Circle brush (works okay for odd width and height numbers)

View File

@ -55,8 +55,8 @@
ref="brushcanvas"
id="brushcanvas"
class="brushcanvas"
:width="brushSizeWidthPreview * currentAscii.blockWidth"
:height="brushSizeHeightPreview * currentAscii.blockHeight"
:width="brushSizeWidthPreview + 1 * currentAscii.blockWidth"
:height="brushSizeHeightPreview + 1 * currentAscii.blockHeight"
></canvas>
</div>
</template>
@ -193,13 +193,23 @@ export default {
for (x = 0; x < brushWidth; x++) {
switch (this.brushSizeTypePreview) {
case "cross":
this.blocks[y][x] = Object.assign({}, emptyBlock);
// If we are 1x1 force fill 1 block, to avoid an empty 1x1
if (x === 0 && y === 0) {
this.blocks[y][x] = Object.assign({}, block);
continue;
}
if (x === brushWidth) {
this.blocks[y][x] = Object.assign({}, emptyBlock);
} else {
this.blocks[y][x] = Object.assign({}, block);
}
targetX = x;
if (y % 2 === 0) {
targetX = targetX - 1;
}
targetX = targetX -1;
}
if (this.blocks[y] && this.blocks[y][targetX]) {
if (x % 2 === 0) {
@ -208,6 +218,7 @@ export default {
this.blocks[y][targetX] = Object.assign({}, block);
}
}
break;
// default:
@ -215,23 +226,21 @@ export default {
this.blocks[y][x] = Object.assign({}, block);
break;
case "circle":
case "circle":
if (middleY >= y) {
// Top half
yModifier = y;
if ( (x <= middleX+yModifier) && (x >= middleX-yModifier) ) {
if (x <= middleX + yModifier && x >= middleX - yModifier) {
this.blocks[y][x] = Object.assign({}, block);
} else {
this.blocks[y][x] = Object.assign({}, emptyBlock);
}
} else {
// Bottom half
yModifier = middleY - (y- middleY);
yModifier = middleY - (y - middleY);
if ( (x <= middleX+yModifier) && (x >= middleX-yModifier) ) {
if (x <= middleX + yModifier && x >= middleX - yModifier) {
this.blocks[y][x] = Object.assign({}, block);
} else {
this.blocks[y][x] = Object.assign({}, emptyBlock);
@ -249,96 +258,28 @@ export default {
if (this.blocks[y] && this.blocks[y][x]) {
let curBlock = this.blocks[y][x];
switch (this.brushSizeTypePreview) {
case "cross":
if (curBlock.bg && this.getTargetingBg) {
this.ctx.fillStyle =
this.$store.getters.mircColours[curBlock.bg];
if (curBlock.bg && this.getTargetingBg) {
this.ctx.fillStyle = this.$store.getters.mircColours[curBlock.bg];
this.ctx.fillRect(
x * BLOCK_WIDTH,
y * BLOCK_HEIGHT,
BLOCK_WIDTH,
BLOCK_HEIGHT
);
}
this.ctx.fillRect(
x * BLOCK_WIDTH,
y * BLOCK_HEIGHT,
BLOCK_WIDTH,
BLOCK_HEIGHT
);
}
if (curBlock.fg && this.getTargetingFg) {
this.ctx.fillStyle =
this.$store.getters.mircColours[curBlock.fg];
}
if (curBlock.fg && this.getTargetingFg) {
this.ctx.fillStyle = this.$store.getters.mircColours[curBlock.fg];
}
if (curBlock.char && this.getTargetingChar) {
this.ctx.fillStyle =
this.$store.getters.mircColours[curBlock.fg];
this.ctx.fillText(
curBlock.char,
x * BLOCK_WIDTH - 1,
y * BLOCK_HEIGHT + BLOCK_HEIGHT - 3
);
}
break;
// case "circle":
// if (curBlock.bg && this.getTargetingBg) {
// this.ctx.fillStyle =
// this.$store.getters.mircColours[curBlock.bg];
// this.ctx.fillRect(
// x * BLOCK_WIDTH,
// y * BLOCK_HEIGHT,
// BLOCK_WIDTH,
// BLOCK_HEIGHT
// );
// }
// if (curBlock.fg && this.getTargetingFg) {
// this.ctx.fillStyle =
// this.$store.getters.mircColours[curBlock.fg];
// }
// if (curBlock.char && this.getTargetingChar) {
// this.ctx.fillStyle =
// this.$store.getters.mircColours[curBlock.fg];
// this.ctx.fillText(
// curBlock.char,
// x * BLOCK_WIDTH - 1,
// y * BLOCK_HEIGHT + BLOCK_HEIGHT - 3
// );
// }
// break;
default:
case "square":
if (curBlock.bg && this.getTargetingBg) {
this.ctx.fillStyle =
this.$store.getters.mircColours[curBlock.bg];
this.ctx.fillRect(
x * BLOCK_WIDTH,
y * BLOCK_HEIGHT,
BLOCK_WIDTH,
BLOCK_HEIGHT
);
}
if (curBlock.fg && this.getTargetingFg) {
this.ctx.fillStyle =
this.$store.getters.mircColours[curBlock.fg];
}
if (curBlock.char && this.getTargetingChar) {
this.ctx.fillStyle =
this.$store.getters.mircColours[curBlock.fg];
this.ctx.fillText(
curBlock.char,
x * BLOCK_WIDTH - 1,
y * BLOCK_HEIGHT + BLOCK_HEIGHT - 3
);
}
break;
if (curBlock.char && this.getTargetingChar) {
this.ctx.fillStyle = this.$store.getters.mircColours[curBlock.fg];
this.ctx.fillText(
curBlock.char,
x * BLOCK_WIDTH - 1,
y * BLOCK_HEIGHT + BLOCK_HEIGHT - 3
);
}
}
}

View File

@ -218,11 +218,13 @@ export default new Vuex.Store({
state.asciibirdMeta[state.tab].redo = [];
},
undoBlocks(state) {
if (state.asciibirdMeta[state.tab].history.length > 1) {
if (state.asciibirdMeta[state.tab].history.length > 0) {
let previous = state.asciibirdMeta[state.tab].history.pop();
state.asciibirdMeta[state.tab].blocks = previous
state.asciibirdMeta[state.tab].redo.push(previous)
}
},
redoBlocks(state) {
if (state.asciibirdMeta[state.tab].redo.length > 0) {
@ -230,6 +232,8 @@ export default new Vuex.Store({
state.asciibirdMeta[state.tab].blocks = next
state.asciibirdMeta[state.tab].history.push(next)
}
},
updateBrushSize(state, payload) {
state.toolbarState.brushSizeHeight = payload.brushSizeHeight;

View File

@ -101,7 +101,8 @@ export default {
if (e.key === "y" && (e.ctrlKey || e.metaKey)) {
console.log("ctrl y");
e.preventDefault();
this.redo();
// Fk it works :\
this.redo();this.redo();
}
// Ctrl C - copy blocks
@ -110,6 +111,11 @@ export default {
if (this.isSelecting && this.isSelected && this.selectBlocks.length) {
this.$store.commit("selectBlocks", this.selectBlocks);
// this.$store.commit("brushBlocks", this.selectBlocks);
// this.canTool = true;
// this.drawBrush();
console.log("ctrl c", this.selectBlocks);
}
}
@ -238,6 +244,9 @@ export default {
this.selecting.endY
);
},
brushBlocks() {
return this.$store.getters.brushBlocks;
}
},
watch: {
currentAscii(val, old) {
@ -511,14 +520,18 @@ export default {
this.clearToolCanvas();
//
let x = this.selecting.startX;
let y = this.selecting.startY;
let x = 0;
let y = 0;
let arrayX = 0;
let arrayY = 0;
let canvasY = 0;
let canvasX = 0;
let curBlock = {};
this.selectBlocks = [];
for (y = 0; y <= this.currentAscii.height; y++) {
for (y = 0; y < this.currentAscii.height; y++) {
canvasY = BLOCK_HEIGHT * y;
if (y >= this.selecting.startY && y <= this.selecting.endY) {
@ -526,7 +539,7 @@ export default {
this.selectBlocks[y] = [];
}
for (x = 0; x <= this.currentAscii.width; x++) {
for (x = 0; x < this.currentAscii.width; x++) {
if (x >= this.selecting.startX && x <= this.selecting.endX) {
if (
this.currentAsciiBlocks[y] &&
@ -767,13 +780,13 @@ export default {
let targetBlock = this.currentAsciiBlocks[this.y][this.x];
let brushDiffX =
Math.floor(this.$store.getters.brushBlocks[0].length / 2) * BLOCK_WIDTH;
Math.floor(this.brushBlocks[0].length / 2) * BLOCK_WIDTH;
let brushDiffY =
Math.floor(this.$store.getters.brushBlocks.length / 2) * BLOCK_HEIGHT;
Math.floor(this.brushBlocks.length / 2) * BLOCK_HEIGHT;
for (let y = 0; y < this.$store.getters.brushBlocks.length; y++) {
for (let x = 0; x < this.$store.getters.brushBlocks[0].length; x++) {
let brushBlock = this.$store.getters.brushBlocks[y][x];
for (let y = 0; y < this.brushBlocks.length; y++) {
for (let x = 0; x < this.brushBlocks[0].length; x++) {
let brushBlock = this.brushBlocks[y][x];
let brushX = this.x * BLOCK_WIDTH + x * BLOCK_WIDTH - brushDiffX;
let brushY = this.y * BLOCK_HEIGHT + y * BLOCK_HEIGHT - brushDiffY;