fill works, brush preview bit better
This commit is contained in:
szülő
1ff3e5fafa
commit
6724cb5240
|
|
@ -0,0 +1,99 @@
|
|||
'rgb(255,255,255)',
|
||||
'rgb(0,0,0)',
|
||||
'rgb(0,0,127)',
|
||||
'rgb(0,147,0)',
|
||||
'rgb(255,0,0)',
|
||||
'rgb(127,0,0)',
|
||||
'rgb(156,0,156)',
|
||||
'rgb(252,127,0)',
|
||||
'rgb(255,255,0)',
|
||||
'rgb(0,252,0)',
|
||||
'rgb(0,147,147)',
|
||||
'rgb(0,255,255)',
|
||||
'rgb(0,0,252)',
|
||||
'rgb(255,0,255)',
|
||||
'rgb(127,127,127)',
|
||||
'rgb(210,210,210)',
|
||||
'rgb(71,0,0)',
|
||||
'rgb(71,33,0)',
|
||||
'rgb(71,71,0)',
|
||||
'rgb(50,71,0)',
|
||||
'rgb(0,71,0)',
|
||||
'rgb(0,71,44)',
|
||||
'rgb(0,71,71)',
|
||||
'rgb(0,39,71)',
|
||||
'rgb(0,0,71)',
|
||||
'rgb(46,0,71)',
|
||||
'rgb(71,0,71)',
|
||||
'rgb(71,0,42)',
|
||||
'rgb(116,0,0)',
|
||||
'rgb(116,58,0)',
|
||||
'rgb(116,116,0)',
|
||||
'rgb(81,116,0)',
|
||||
'rgb(0,116,0)',
|
||||
'rgb(0,116,73)',
|
||||
'rgb(0,116,116)',
|
||||
'rgb(0,64,116)',
|
||||
'rgb(0,0,116)',
|
||||
'rgb(75,0,116)',
|
||||
'rgb(116,0,116)',
|
||||
'rgb(116,0,69)',
|
||||
'rgb(181,0,0)',
|
||||
'rgb(181,99,0)',
|
||||
'rgb(181,181,0)',
|
||||
'rgb(125,181,0)',
|
||||
'rgb(0,181,0)',
|
||||
'rgb(0,181,113)',
|
||||
'rgb(0,181,181)',
|
||||
'rgb(0,99,181)',
|
||||
'rgb(0,0,181)',
|
||||
'rgb(117,0,181)',
|
||||
'rgb(181,0,181)',
|
||||
'rgb(181,0,107)',
|
||||
'rgb(255,0,0)',
|
||||
'rgb(255,140,0)',
|
||||
'rgb(255,255,0)',
|
||||
'rgb(178,255,0)',
|
||||
'rgb(0,255,0)',
|
||||
'rgb(0,255,160)',
|
||||
'rgb(0,255,255)',
|
||||
'rgb(0,140,255)',
|
||||
'rgb(0,0,255)',
|
||||
'rgb(165,0,255)',
|
||||
'rgb(255,0,255)',
|
||||
'rgb(255,0,152)',
|
||||
'rgb(255,89,89)',
|
||||
'rgb(255,180,89)',
|
||||
'rgb(255,255,113)',
|
||||
'rgb(207,255,96)',
|
||||
'rgb(111,255,111)',
|
||||
'rgb(101,255,201)',
|
||||
'rgb(109,255,255)',
|
||||
'rgb(89,180,255)',
|
||||
'rgb(89,89,255)',
|
||||
'rgb(196,89,255)',
|
||||
'rgb(255,102,255)',
|
||||
'rgb(255,89,188)',
|
||||
'rgb(255,156,156)',
|
||||
'rgb(255,211,156)',
|
||||
'rgb(255,255,156)',
|
||||
'rgb(226,255,156)',
|
||||
'rgb(156,255,156)',
|
||||
'rgb(156,255,219)',
|
||||
'rgb(156,255,255)',
|
||||
'rgb(156,211,255)',
|
||||
'rgb(156,156,255)',
|
||||
'rgb(220,156,255)',
|
||||
'rgb(255,156,255)',
|
||||
'rgb(255,148,211)',
|
||||
'rgb(0,0,0)',
|
||||
'rgb(19,19,19)',
|
||||
'rgb(40,40,40)',
|
||||
'rgb(54,54,54)',
|
||||
'rgb(77,77,77)',
|
||||
'rgb(101,101,101)',
|
||||
'rgb(129,129,129)',
|
||||
'rgb(159,159,159)',
|
||||
'rgb(188,188,188)',
|
||||
'rgb(226,226,226)',
|
||||
'rgb(255,255,255))',
|
||||
|
|
@ -4,17 +4,20 @@ ASCIIBIRD DEVELOPMENT - TAKING FLIGHT
|
|||
|
||||
# FOCUSING ON NOW
|
||||
|
||||
* Toolbar stuff / Brush Size
|
||||
|
||||
* Modals
|
||||
* Edit current ascii
|
||||
* Asciibird options
|
||||
* Tool options
|
||||
|
||||
* Encodings
|
||||
* Encodings - UTF8 vs NOT that
|
||||
|
||||
* Toolbar stuff / Brush Size
|
||||
* Context Menus (right click menu) - we started this
|
||||
* Keyboard shortcuts
|
||||
|
||||
* Undo feature
|
||||
|
||||
* COMPRESSION inside the localStorage
|
||||
|
||||
# KILLER ASCIIBIRD FEATURES DONE
|
||||
|
|
|
|||
|
|
@ -12,7 +12,6 @@
|
|||
"@fortawesome/free-regular-svg-icons": "^5.15.3",
|
||||
"@fortawesome/free-solid-svg-icons": "^5.15.3",
|
||||
"@fortawesome/vue-fontawesome": "^2.0.2",
|
||||
"pako": "^2.0.3",
|
||||
"vue": "^2.6.11",
|
||||
"vue-clipboard2": "^0.3.1",
|
||||
"vue-draggable-resizable": "^2.3.0",
|
||||
|
|
|
|||
|
|
@ -468,27 +468,12 @@ export default {
|
|||
},
|
||||
importAsciibirdState(fileContents, fileName) {
|
||||
// Import from a gzipped json file
|
||||
// let input;
|
||||
|
||||
// try {
|
||||
// // convert the incoming base64 -> binary
|
||||
// // const strData = fileContents;
|
||||
|
||||
// // split it into an array rather than a "string"
|
||||
// // const charData = strData.split('').map(function(x){return x.charCodeAt(0); });
|
||||
|
||||
// // var strData = String.fromCharCode.apply(null, pako.inflate(String.fromCharCode.apply(null, input).split("").map(function(x){return x.charCodeAt(0);})));
|
||||
// input = pako.inflate(fileContents);
|
||||
|
||||
// console.log(input);
|
||||
// } catch (err) {
|
||||
// console.log(err);
|
||||
// }
|
||||
|
||||
// console.log(fileContents)
|
||||
// const restored = JSON.parse(pako.inflate(fileContents, { to: 'string' }));
|
||||
console.log(restored)
|
||||
|
||||
// No gz for now unless can get the above working
|
||||
this.$store.commit("changeState", { ...JSON.parse(fileContents) });
|
||||
// this.$store.commit("changeState", { ...JSON.parse(fileContents) });
|
||||
},
|
||||
exportAsciibirdState() {
|
||||
// Download to a gzipped json file
|
||||
|
|
|
|||
Binary file not shown.
|
|
@ -6,8 +6,8 @@
|
|||
style="z-index: 5;"
|
||||
:min-width="8 * 15"
|
||||
:max-width="8 * 25"
|
||||
:max-height="13 * 26"
|
||||
:min-height="13 * 25"
|
||||
:max-height="13 * 39"
|
||||
:min-height="13 * 38"
|
||||
:w="toolbarState.w"
|
||||
:h="toolbarState.h"
|
||||
:x="toolbarState.x"
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
type="number"
|
||||
name="width"
|
||||
v-model="brushSizeWidth"
|
||||
@change="updateBrushSizeWidth"
|
||||
@change="updateBrushSize"
|
||||
min="1"
|
||||
max="10"
|
||||
/>
|
||||
|
|
@ -13,11 +13,44 @@
|
|||
type="number"
|
||||
name="height"
|
||||
v-model="brushSizeHeight"
|
||||
@change="updateBrushSizeHeight"
|
||||
@change="updateBrushSize"
|
||||
min="1"
|
||||
max="10"
|
||||
/>
|
||||
|
||||
<div class="flex">
|
||||
<label class="block">
|
||||
<t-radio
|
||||
name="options"
|
||||
value="square"
|
||||
checked
|
||||
v-model="brushSizeType"
|
||||
@change="updateBrushSize"
|
||||
/>
|
||||
<span class="text-sm">Square</span>
|
||||
</label>
|
||||
|
||||
<label class="block">
|
||||
<t-radio
|
||||
name="options"
|
||||
value="circle"
|
||||
v-model="brushSizeType"
|
||||
@change="updateBrushSize"
|
||||
/>
|
||||
<span class="text-sm">Circle</span>
|
||||
</label>
|
||||
|
||||
<label class="block">
|
||||
<t-radio
|
||||
name="options"
|
||||
value="cross"
|
||||
v-model="brushSizeType"
|
||||
@change="updateBrushSize"
|
||||
/>
|
||||
<span class="text-sm">Cross</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<canvas
|
||||
ref="brushcanvas"
|
||||
id="brushcanvas"
|
||||
|
|
@ -34,12 +67,17 @@ export default {
|
|||
mounted() {
|
||||
this.ctx = this.$refs.brushcanvas.getContext("2d");
|
||||
this.delayRedrawCanvas();
|
||||
|
||||
this.brushSizeHeight = this.$store.getters.brushSizeHeight;
|
||||
this.brushSizeWidth = this.$store.getters.brushSizeWidth;
|
||||
this.brushSizeType = this.$store.getters.brushSizeType;
|
||||
},
|
||||
data: () => ({
|
||||
ctx: null,
|
||||
redraw: true,
|
||||
brushSizeHeight: 1,
|
||||
brushSizeWidth: 1,
|
||||
brushSizeType: "square",
|
||||
}),
|
||||
computed: {
|
||||
currentAscii() {
|
||||
|
|
@ -55,34 +93,16 @@ export default {
|
|||
return this.brushSizeHeight;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
toolbarState(val, old) {
|
||||
console.log(val);
|
||||
this.delayRedrawCanvas();
|
||||
},
|
||||
watchBrushSizeWidth(val, old) {
|
||||
// console.log(val, old);
|
||||
// this.brushSizeWidth = val;
|
||||
this.delayRedrawCanvas();
|
||||
},
|
||||
watchBrushSizeHeight(val, old) {
|
||||
// console.log(val, old);
|
||||
// this.brushSizeHeight = val;
|
||||
this.delayRedrawCanvas();
|
||||
},
|
||||
},
|
||||
watch: {},
|
||||
methods: {
|
||||
updateBrushSizeHeight() {
|
||||
this.$store.commit("updateBrushSize", {
|
||||
brushSizeHeight: this.brushSizeHeight,
|
||||
brushSizeWidth: this.brushSizeWidth,
|
||||
});
|
||||
},
|
||||
updateBrushSizeWidth() {
|
||||
updateBrushSize() {
|
||||
this.$store.commit("updateBrushSize", {
|
||||
brushSizeHeight: this.brushSizeHeight,
|
||||
brushSizeWidth: this.brushSizeWidth,
|
||||
brushSizeType: this.brushSizeType,
|
||||
});
|
||||
|
||||
this.delayRedrawCanvas();
|
||||
},
|
||||
drawPreview() {
|
||||
let brushHeight = this.toolbarState.brushSizeHeight;
|
||||
|
|
@ -114,27 +134,21 @@ export default {
|
|||
let minX = 5 - brushWidth;
|
||||
let maxX = 5 + brushWidth;
|
||||
|
||||
for (y = 0; y < 10; y++) {
|
||||
let block = {
|
||||
fg: this.$store.getters.getFgColour,
|
||||
bg: this.$store.getters.getBgColour,
|
||||
char: this.$store.getters.getSelectedChar,
|
||||
};
|
||||
|
||||
// Recreate 2d array for preview
|
||||
for (y = 0; y < brushHeight; y++) {
|
||||
blocks[y] = [];
|
||||
|
||||
if (y < maxY && y > minY) {
|
||||
for (x = 0; x < 10; x++) {
|
||||
if (x < maxX && x > minX) {
|
||||
let block = {
|
||||
fg: this.$store.getters.getFgColour,
|
||||
bg: this.$store.getters.getBgColour,
|
||||
char: this.$store.getters.getSelectedChar,
|
||||
};
|
||||
|
||||
blocks[y][x] = Object.assign({}, block);
|
||||
} else {
|
||||
blocks[y][x] = Object.assign({}, emptyBlock);
|
||||
}
|
||||
}
|
||||
for (x = 0; x < brushWidth; x++) {
|
||||
blocks[y][x] = Object.assign({}, block);
|
||||
}
|
||||
}
|
||||
|
||||
console.log("blocks", blocks);
|
||||
this.$store.commit("brushBlocks", blocks)
|
||||
|
||||
// Get middle block
|
||||
for (y = 0; y < blocks.length; y++) {
|
||||
|
|
@ -176,7 +190,7 @@ export default {
|
|||
setTimeout(() => {
|
||||
this.redraw = true;
|
||||
this.drawPreview();
|
||||
}, this.$store.state.options.canvasRedrawSpeed);
|
||||
}, 100);
|
||||
}
|
||||
},
|
||||
},
|
||||
|
|
|
|||
20
src/main.js
20
src/main.js
|
|
@ -2,8 +2,6 @@ import Vue from 'vue';
|
|||
import VueTailwind from 'vue-tailwind';
|
||||
import VueDraggableResizable from 'vue-draggable-resizable';
|
||||
import VueClipboard from 'vue-clipboard2'
|
||||
import Pako from 'pako';
|
||||
|
||||
|
||||
import {
|
||||
TInput,
|
||||
|
|
@ -166,7 +164,22 @@ const settings = {
|
|||
// Variants and fixed classes in the same `object` format ...
|
||||
}
|
||||
},
|
||||
// ...Rest of the components
|
||||
't-radio': {
|
||||
component: TRadio,
|
||||
props: {
|
||||
wrapped: true,
|
||||
classes: {
|
||||
label: 'text-sm uppercase mx-2 text-gray-700',
|
||||
input: 'text-blue-500 transition duration-100 ease-in-out border-gray-300 shadow-sm focus:border-blue-500 focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50 focus:ring-offset-0 disabled:opacity-50 disabled:cursor-not-allowed transition duration-150 ease-in-out',
|
||||
inputWrapper: 'inline-flex',
|
||||
wrapper: 'flex items-center',
|
||||
// labelChecked: '',
|
||||
// inputWrapperChecked: '',
|
||||
// wrapperChecked: '',
|
||||
}
|
||||
// Variants and fixed classes in the same `object` format ...
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
Vue.use(VueTailwind, settings);
|
||||
|
|
@ -176,7 +189,6 @@ Vue.use(VueClipboard)
|
|||
|
||||
new Vue({
|
||||
store,
|
||||
Pako,
|
||||
render: (h) => h(Dashboard),
|
||||
}).$mount('#app');
|
||||
|
||||
|
|
|
|||
|
|
@ -114,6 +114,8 @@ export default new Vuex.Store({
|
|||
isChoosingChar: false,
|
||||
brushSizeWidth: 1,
|
||||
brushSizeHeight: 1,
|
||||
// square, circle, cross
|
||||
brushSizeType: 'square',
|
||||
selectedFg: 0,
|
||||
selectedBg: 1,
|
||||
selectedChar: 'A',
|
||||
|
|
@ -124,7 +126,7 @@ export default new Vuex.Store({
|
|||
targetingChar: true,
|
||||
x: 8 * 2,
|
||||
y: 13 * 2,
|
||||
h: 13 * 25,
|
||||
h: 13 * 39,
|
||||
w: 8 * 15,
|
||||
},
|
||||
debugPanelState: {
|
||||
|
|
@ -134,6 +136,7 @@ export default new Vuex.Store({
|
|||
w: 8 * 150,
|
||||
},
|
||||
blockSizeMultiplier: 1,
|
||||
brushBlocks: [],
|
||||
},
|
||||
mutations: {
|
||||
changeState(state, payload) {
|
||||
|
|
@ -207,6 +210,10 @@ export default new Vuex.Store({
|
|||
updateBrushSize(state, payload) {
|
||||
state.toolbarState.brushSizeHeight = payload.brushSizeHeight;
|
||||
state.toolbarState.brushSizeWidth = payload.brushSizeWidth;
|
||||
state.toolbarState.brushSizeType = payload.brushSizeType;
|
||||
},
|
||||
brushBlocks(state, payload) {
|
||||
state.brushBlocks = payload;
|
||||
},
|
||||
openModal(state, type) {
|
||||
switch (type) {
|
||||
|
|
@ -241,7 +248,9 @@ export default new Vuex.Store({
|
|||
nextTabValue: (state) => state.asciibirdMeta.length,
|
||||
brushSizeHeight: (state) => state.toolbarState.brushSizeHeight,
|
||||
brushSizeWidth: (state) => state.toolbarState.brushSizeWidth,
|
||||
brushSizeType: (state) => state.toolbarState.brushSizeType,
|
||||
blockSizeMultiplier: (state) => state.blockSizeMultiplier,
|
||||
brushBlocks: (state) => state.brushBlocks,
|
||||
},
|
||||
actions: {},
|
||||
modules: {},
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div>
|
||||
<div id="canvas-area">
|
||||
<vue-draggable-resizable
|
||||
style="z-index:5;"
|
||||
style="z-index: 5"
|
||||
:grid="[currentAscii.blockWidth, currentAscii.blockHeight]"
|
||||
:w="canvas.width"
|
||||
:h="canvas.height"
|
||||
|
|
@ -15,7 +15,7 @@
|
|||
<canvas
|
||||
ref="canvastools"
|
||||
id="canvastools"
|
||||
class="toolscanvas"
|
||||
class="canvastools"
|
||||
:width="canvas.width"
|
||||
:height="canvas.height"
|
||||
@mousemove="canvasMouseMove"
|
||||
|
|
@ -43,7 +43,7 @@ body {
|
|||
background: #eee;
|
||||
}
|
||||
|
||||
.toolscanvas {
|
||||
.canvastools {
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
}
|
||||
|
|
@ -65,7 +65,7 @@ export default {
|
|||
mounted() {
|
||||
if (this.$store.getters.currentAscii.blocks) {
|
||||
this.ctx = this.$refs.canvas.getContext("2d");
|
||||
this.toolsCtx = this.$refs.canvastools.getContext("2d");
|
||||
this.toolCtx = this.$refs.canvastools.getContext("2d");
|
||||
|
||||
this.canvas.width =
|
||||
this.$store.getters.currentAscii.width *
|
||||
|
|
@ -142,8 +142,10 @@ export default {
|
|||
);
|
||||
},
|
||||
dragboxStyle() {
|
||||
return `z-index: 5;width:${this.canvas.width+4};height:${this.canvas.height+4};`
|
||||
}
|
||||
return `z-index: 5;width:${this.canvas.width + 4};height:${
|
||||
this.canvas.height + 4
|
||||
};`;
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
currentAscii(val, old) {
|
||||
|
|
@ -184,17 +186,17 @@ export default {
|
|||
redrawToolCanvas() {
|
||||
if (this.currentAscii.blocks.length) {
|
||||
this.clearToolCanvas();
|
||||
this.toolsCtx.fillStyle = "rgba(255, 255, 255, 0.4)";
|
||||
this.toolCtx.fillStyle = "rgba(255, 255, 255, 0.4)";
|
||||
const BLOCK_WIDTH = this.currentAscii.blockWidth;
|
||||
const BLOCK_HEIGHT = this.currentAscii.blockHeight;
|
||||
|
||||
this.toolsCtx.fillRect(
|
||||
this.toolCtx.fillRect(
|
||||
this.selecting.startX,
|
||||
this.selecting.startY,
|
||||
this.selecting.endX * BLOCK_WIDTH,
|
||||
this.selecting.endY * BLOCK_HEIGHT
|
||||
this.selecting.endX,
|
||||
this.selecting.endY
|
||||
);
|
||||
this.toolsCtx.stroke();
|
||||
this.toolCtx.stroke();
|
||||
}
|
||||
},
|
||||
redrawCanvas() {
|
||||
|
|
@ -335,11 +337,13 @@ export default {
|
|||
|
||||
switch (char) {
|
||||
case "Backspace":
|
||||
if (this.currentAscii.blocks[this.textEditing.startY][this.textEditing.startX-1]) {
|
||||
|
||||
if (
|
||||
this.currentAscii.blocks[this.textEditing.startY][
|
||||
this.textEditing.startX - 1
|
||||
]
|
||||
) {
|
||||
this.textEditing.startX--;
|
||||
targetBlock.char = null;
|
||||
|
||||
}
|
||||
break;
|
||||
|
||||
|
|
@ -407,7 +411,7 @@ export default {
|
|||
this.delayRedrawCanvas();
|
||||
},
|
||||
canvasMouseDown() {
|
||||
this.toolsCtx.clearRect(0, 0, 10000, 10000);
|
||||
this.toolCtx.clearRect(0, 0, 10000, 10000);
|
||||
|
||||
if (
|
||||
this.currentAscii.blocks[this.y] &&
|
||||
|
|
@ -471,8 +475,8 @@ export default {
|
|||
this.y = e.offsetY;
|
||||
}
|
||||
|
||||
this.x = Math.floor(this.x / this.currentAscii.blockWidth);
|
||||
this.y = Math.floor(this.y / this.currentAscii.blockHeight);
|
||||
this.x = Math.round(this.x / this.currentAscii.blockWidth);
|
||||
this.y = Math.round(this.y / this.currentAscii.blockHeight);
|
||||
|
||||
this.$emit("coordsupdate", { x: this.x, y: this.y });
|
||||
|
||||
|
|
@ -488,7 +492,58 @@ export default {
|
|||
].name
|
||||
) {
|
||||
case "brush":
|
||||
if (this.canTool) {
|
||||
if (!this.canTool && this.currentTool.name === 'brush') {
|
||||
this.clearToolCanvas();
|
||||
|
||||
//
|
||||
const BLOCK_WIDTH = this.currentAscii.blockWidth;
|
||||
const BLOCK_HEIGHT = this.currentAscii.blockHeight;
|
||||
for (let y = 0; y < this.$store.getters.brushBlocks.length; y++) {
|
||||
for (
|
||||
let x = 0;
|
||||
x < this.$store.getters.brushBlocks[0].length;
|
||||
x++
|
||||
) {
|
||||
let curBlock = this.$store.getters.brushBlocks[y][x];
|
||||
|
||||
if (curBlock.bg) {
|
||||
this.toolCtx.fillStyle = this.$store.getters.mircColours[
|
||||
curBlock.bg
|
||||
];
|
||||
|
||||
this.toolCtx.fillRect(
|
||||
this.x * BLOCK_WIDTH,
|
||||
this.y * BLOCK_HEIGHT,
|
||||
BLOCK_WIDTH,
|
||||
BLOCK_HEIGHT
|
||||
);
|
||||
}
|
||||
|
||||
if (curBlock.fg) {
|
||||
this.toolCtx.fillStyle = this.$store.getters.mircColours[
|
||||
curBlock.fg
|
||||
];
|
||||
}
|
||||
|
||||
if (curBlock.char) {
|
||||
this.toolCtx.fillStyle = this.$store.getters.mircColours[
|
||||
curBlock.fg
|
||||
];
|
||||
this.toolCtx.fillText(
|
||||
curBlock.char,
|
||||
x + this.x * BLOCK_WIDTH - 1,
|
||||
y + this.y * BLOCK_HEIGHT + BLOCK_HEIGHT - 3
|
||||
);
|
||||
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
this.toolCtx.stroke();
|
||||
}
|
||||
} else if (this.canTool && this.currentTool.name === 'brush') {
|
||||
// 1x1 brush by default
|
||||
if (this.$store.getters.getTargetingFg) {
|
||||
targetBlock.fg = this.$store.getters.getFgColour;
|
||||
}
|
||||
|
|
@ -532,9 +587,9 @@ export default {
|
|||
this.delayRedrawCanvas();
|
||||
},
|
||||
clearToolCanvas() {
|
||||
if (this.toolsCtx) {
|
||||
this.toolsCtx.clearRect(0, 0, 10000, 10000);
|
||||
this.toolsCtx.stroke();
|
||||
if (this.toolCtx) {
|
||||
this.toolCtx.clearRect(0, 0, 10000, 10000);
|
||||
this.toolCtx.stroke();
|
||||
}
|
||||
},
|
||||
delayRedrawCanvas() {
|
||||
|
|
@ -588,12 +643,12 @@ export default {
|
|||
}
|
||||
|
||||
// If row is greater than image length
|
||||
if (x > this.currentAscii.width) {
|
||||
if (x >= this.currentAscii.width) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If column is greater than image length
|
||||
if (y > this.currentAscii.height) {
|
||||
if (y >= this.currentAscii.height) {
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -6651,11 +6651,6 @@ p-try@^2.0.0:
|
|||
resolved "https://registry.yarnpkg.com/p-try/-/p-try-2.2.0.tgz#cb2868540e313d61de58fafbe35ce9004d5540e6"
|
||||
integrity sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==
|
||||
|
||||
pako@^2.0.3:
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/pako/-/pako-2.0.3.tgz#cdf475e31b678565251406de9e759196a0ea7a43"
|
||||
integrity sha512-WjR1hOeg+kki3ZIOjaf4b5WVcay1jaliKSYiEaB1XzwhMQZJxRdQRv0V31EKBYlxb4T7SK3hjfc/jxyU64BoSw==
|
||||
|
||||
pako@~1.0.5:
|
||||
version "1.0.11"
|
||||
resolved "https://registry.yarnpkg.com/pako/-/pako-1.0.11.tgz#6c9599d340d54dfd3946380252a35705a6b992bf"
|
||||
|
|
|
|||
Betöltés…
Reference in New Issue