better select/copy, refactored code to ascii.js
This commit is contained in:
parent
83e27e4587
commit
5d6c5fd421
|
|
@ -21,6 +21,9 @@
|
|||
* Circle brush (works okay for odd width and height numbers)
|
||||
# FOCUSING ON NOW
|
||||
|
||||
* SELECT TOOL DEV, JUST FINISH IT
|
||||
* OPTIONS MODAL (SORRY SKG LOL)
|
||||
|
||||
* SELECT
|
||||
* CLIPBOARD
|
||||
|
||||
|
|
|
|||
|
|
@ -114,6 +114,8 @@ import EditAscii from "./components/modals/EditAscii.vue";
|
|||
import PasteAscii from "./components/modals/PasteAscii.vue";
|
||||
import LZString from "lz-string";
|
||||
|
||||
import { parseMircAscii } from "./ascii.js"
|
||||
|
||||
export default {
|
||||
async created() {
|
||||
// Load from irc watch if present in the URL bar
|
||||
|
|
@ -129,7 +131,6 @@ export default {
|
|||
const asciiData = await res.text();
|
||||
console.log({ asciiData, asciiUrlCdn });
|
||||
this.mircAsciiImport(asciiData, asciiUrlCdn);
|
||||
// window.location.href = "/";
|
||||
}
|
||||
|
||||
const asciiUrl = new URL(location.href).searchParams.get("ircwatch");
|
||||
|
|
@ -144,7 +145,6 @@ export default {
|
|||
const asciiData = await res.text();
|
||||
console.log({ asciiData, asciiUrl });
|
||||
this.mircAsciiImport(asciiData, asciiUrl);
|
||||
// window.location.href = "/";
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
|
@ -221,311 +221,8 @@ export default {
|
|||
// console.log(this.importType);
|
||||
this.$refs.asciiInput.click();
|
||||
},
|
||||
// We can maybe try something different to import ANSI
|
||||
// asniImport(contents, filename) {
|
||||
// let ansiArray = contents.split("\n");
|
||||
|
||||
// let ansiWidth = 0;
|
||||
|
||||
// this.finalAscii = {
|
||||
// width: false, // defined in: switch (curChar) case "\n":
|
||||
// height: contents.split("\r\n").length,
|
||||
// title: filename,
|
||||
// key: this.$store.getters.nextTabValue,
|
||||
// blockWidth: 8 * this.$store.getters.blockSizeMultiplier,
|
||||
// blockHeight: 13 * this.$store.getters.blockSizeMultiplier,
|
||||
// blocks: this.create2DArray(contents.split("\r\n").length),
|
||||
// };
|
||||
|
||||
// for (let i = 0; i <= ansiArray.length - 1; i++) {
|
||||
// if (ansiWidth > 0 && this.finalAscii.width === false) {
|
||||
// this.finalAscii.width = ansiWidth;
|
||||
// }
|
||||
|
||||
// ansiWidth = 0;
|
||||
|
||||
// for (let j = 0; j <= ansiArray[i].length - 1; j++) {
|
||||
// let ansiParse = Anser.ansiToJson(ansiArray[i]);
|
||||
|
||||
// for (let l = 0; l <= ansiParse.length - 1; l++) {
|
||||
// var contentArray = ansiParse[l].content.split("");
|
||||
|
||||
// var curBlock = {
|
||||
// fg: this.mircColours.indexOf(`rgb(${ansiParse[l].fg})`),
|
||||
// bg: this.mircColours.indexOf(`rgb(${ansiParse[l].bg})`),
|
||||
// char: null,
|
||||
// };
|
||||
|
||||
// // If we had no matches in our mIRC RGB lookup, then we have to try match
|
||||
// // the ASNI colours to the best mIRC colour
|
||||
|
||||
// if (curBlock.fg === -1) {
|
||||
// switch (ansiParse[l].fg) {
|
||||
// case "187, 187, 0": // orangeish yellow
|
||||
// curBlock.fg = 8;
|
||||
// break;
|
||||
|
||||
// case "187, 0, 0": // red
|
||||
// curBlock.fg = 4;
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
|
||||
// if (curBlock.bg === -1) {
|
||||
// switch (ansiParse[l].bg) {
|
||||
// case "187, 187, 0": // orangeish yellow
|
||||
// curBlock.bg = 8;
|
||||
// break;
|
||||
|
||||
// case "187, 0, 0": // red
|
||||
// curBlock.bg = 4;
|
||||
// break;
|
||||
// }
|
||||
// }
|
||||
|
||||
// for (let k = 0; k <= contentArray.length - 1; k++) {
|
||||
// if (contentArray[k] === "\r") {
|
||||
// continue;
|
||||
// }
|
||||
|
||||
// this.mircColours.indexOf(`rgb(${ansiParse[l].fg})`);
|
||||
|
||||
// curBlock.char = contentArray[k];
|
||||
|
||||
// this.finalAscii.blocks[i][ansiWidth] = JSON.parse(
|
||||
// JSON.stringify(curBlock)
|
||||
// );
|
||||
|
||||
// ansiWidth++;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// this.$store.commit("newAsciibirdMeta", this.finalAscii);
|
||||
// },
|
||||
onTriggeredEventHandler(payload) {
|
||||
console.log(`You have pressed CMD (CTRL) + ${payload.keyString}`);
|
||||
},
|
||||
mircAsciiImport(contents, filename) {
|
||||
const MIRC_MAX_COLOURS = this.$store.getters.mircColours.length;
|
||||
|
||||
// The current state of the Colours
|
||||
let curBlock = {
|
||||
fg: null,
|
||||
bg: null,
|
||||
char: null,
|
||||
};
|
||||
|
||||
// set asciiImport as the entire file contents as a string
|
||||
const asciiImport = contents
|
||||
.split("\u0003\u0003")
|
||||
.join("\u0003")
|
||||
.split("\u000F").join("")
|
||||
.split("\u0003\n").join("\n")
|
||||
.split("\u0002\u0003").join("\u0003");
|
||||
|
||||
// This will end up in the asciibirdMeta
|
||||
const finalAscii = {
|
||||
width: false, // defined in: switch (curChar) case "\n":
|
||||
height: asciiImport.split("\n").length,
|
||||
title: filename,
|
||||
key: this.$store.getters.nextTabValue,
|
||||
blockWidth: 8 * this.$store.getters.blockSizeMultiplier,
|
||||
blockHeight: 13 * this.$store.getters.blockSizeMultiplier,
|
||||
blocks: this.create2DArray(asciiImport.split("\n").length),
|
||||
history: [],
|
||||
redo: [],
|
||||
x: 8 * 35, // the dragable ascii canvas x
|
||||
y: 13 * 2, // the dragable ascii canvas y
|
||||
};
|
||||
|
||||
// Turn the entire ascii string into an array
|
||||
let asciiStringArray = asciiImport.split("");
|
||||
let linesArray = asciiImport.split("\n");
|
||||
|
||||
// The proper X and Y value of the block inside the ASCII
|
||||
let asciiX = 0;
|
||||
let asciiY = 0;
|
||||
|
||||
// used to determine colours
|
||||
let colourChar1 = null;
|
||||
let colourChar2 = null;
|
||||
let parsedColour = null;
|
||||
|
||||
// This variable just counts the amount of colour and char codes to minus
|
||||
// to get the real width
|
||||
let widthOfColCodes = 0;
|
||||
|
||||
// Better for colourful asciis
|
||||
let maxWidthLoop = 0;
|
||||
|
||||
// Used before the loop, better for plain text
|
||||
let maxWidthFound = 0;
|
||||
|
||||
for(let i = 0; i < linesArray.length; i++) {
|
||||
if (linesArray[i].length > maxWidthFound) {
|
||||
maxWidthFound = linesArray[i].length;
|
||||
}
|
||||
}
|
||||
|
||||
while (asciiStringArray.length) {
|
||||
const curChar = asciiStringArray[0];
|
||||
|
||||
// Defining a small finite state machine
|
||||
// to detect the colour code
|
||||
switch (curChar) {
|
||||
case "\n":
|
||||
// Reset the colours here on a new line
|
||||
curBlock = {
|
||||
fg: null,
|
||||
bg: null,
|
||||
char: null,
|
||||
};
|
||||
|
||||
if (linesArray[asciiY] && linesArray[asciiY].length > maxWidthLoop) {
|
||||
maxWidthLoop = linesArray[asciiY].length;
|
||||
}
|
||||
|
||||
// the Y value of the ascii
|
||||
asciiY++;
|
||||
|
||||
// Calculate widths mirc asciis vs plain text
|
||||
if (!finalAscii.width && widthOfColCodes > 0) {
|
||||
finalAscii.width =
|
||||
maxWidthLoop - widthOfColCodes; // minus \n for the proper width
|
||||
}
|
||||
|
||||
|
||||
if (!finalAscii.width && widthOfColCodes === 0) {
|
||||
// Plain text
|
||||
finalAscii.width =
|
||||
maxWidthFound; // minus \n for the proper width
|
||||
}
|
||||
|
||||
// Resets the X value
|
||||
asciiX = 0;
|
||||
|
||||
asciiStringArray.shift();
|
||||
widthOfColCodes = 0;
|
||||
break;
|
||||
|
||||
case "\u0003":
|
||||
// Remove the colour char
|
||||
asciiStringArray.shift();
|
||||
widthOfColCodes++;
|
||||
|
||||
// Attempt to work out bg
|
||||
colourChar1 = `${asciiStringArray[0]}`;
|
||||
colourChar2 = `${asciiStringArray[1]}`;
|
||||
parsedColour = parseInt(`${colourChar1}${colourChar2}`);
|
||||
|
||||
// Work out the 01, 02 double digit codes
|
||||
if (parseInt(colourChar1) === 0 && parseInt(colourChar2) >= 0) {
|
||||
asciiStringArray.shift();
|
||||
}
|
||||
|
||||
if (isNaN(parsedColour)) {
|
||||
curBlock.bg = parseInt(colourChar1);
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
} else if (parsedColour <= MIRC_MAX_COLOURS && parsedColour >= 0) {
|
||||
curBlock.fg = parseInt(parsedColour);
|
||||
widthOfColCodes += parsedColour.toString().length;
|
||||
|
||||
asciiStringArray = asciiStringArray.slice(
|
||||
parsedColour.toString().length,
|
||||
asciiStringArray.length
|
||||
);
|
||||
}
|
||||
|
||||
// No background colour
|
||||
if (asciiStringArray[0] !== ",") {
|
||||
break;
|
||||
} else {
|
||||
// Remove , from array
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
}
|
||||
|
||||
// Attempt to work out bg
|
||||
colourChar1 = `${asciiStringArray[0]}`;
|
||||
colourChar2 = `${asciiStringArray[1]}`;
|
||||
parsedColour = parseInt(`${colourChar1}${colourChar2}`);
|
||||
|
||||
if (
|
||||
!isNaN(colourChar1) &&
|
||||
!isNaN(colourChar2) &&
|
||||
parseInt(colourChar2) > parseInt(colourChar1) &&
|
||||
!isNaN(parsedColour) &&
|
||||
parseInt(parsedColour) < 10
|
||||
) {
|
||||
parsedColour = parseInt(colourChar2);
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
}
|
||||
|
||||
if (
|
||||
parseInt(colourChar2) === parseInt(colourChar1) &&
|
||||
parseInt(parsedColour) < 10
|
||||
) {
|
||||
parsedColour = parseInt(colourChar1);
|
||||
asciiStringArray.shift();
|
||||
asciiStringArray.shift();
|
||||
widthOfColCodes += 2;
|
||||
|
||||
curBlock.bg = parseInt(colourChar1);
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
if (isNaN(parsedColour)) {
|
||||
curBlock.bg = parseInt(colourChar1);
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
} else if (parsedColour <= MIRC_MAX_COLOURS && parsedColour >= 0) {
|
||||
curBlock.bg = parseInt(parsedColour);
|
||||
widthOfColCodes += parsedColour.toString().length;
|
||||
|
||||
asciiStringArray = asciiStringArray.slice(
|
||||
parsedColour.toString().length,
|
||||
asciiStringArray.length
|
||||
);
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
break;
|
||||
|
||||
default:
|
||||
curBlock.char = curChar;
|
||||
asciiStringArray.shift();
|
||||
asciiX++;
|
||||
|
||||
finalAscii.blocks[asciiY][asciiX - 1] = { ...curBlock };
|
||||
break;
|
||||
} // End Switch
|
||||
} // End loop charPos
|
||||
|
||||
// Store the ASCII
|
||||
finalAscii.blocks = LZString.compressToUTF16(
|
||||
JSON.stringify(finalAscii.blocks)
|
||||
);
|
||||
finalAscii.history.push(finalAscii.blocks);
|
||||
this.$store.commit("newAsciibirdMeta", finalAscii);
|
||||
|
||||
// To show the ASCII after importing we get the last key
|
||||
// from the asciiBirdMeta array
|
||||
const keys = this.$store.getters.asciibirdMeta
|
||||
.map((v, k) => k)
|
||||
.filter((i) => i !== undefined);
|
||||
|
||||
// Set the current tab and pop the array for the last value
|
||||
this.currentTab = keys.pop();
|
||||
this.$store.commit("changeTab", this.currentTab);
|
||||
|
||||
// Update the browsers title to the ASCII filename
|
||||
document.title = `asciibird - ${this.$store.getters.currentAscii.title}`;
|
||||
parseMircAscii(contents, filename)
|
||||
},
|
||||
importAsciibirdState(fileContents) {
|
||||
let contents = JSON.parse(
|
||||
|
|
@ -661,31 +358,9 @@ export default {
|
|||
localStorage.clear();
|
||||
window.location.href = "/";
|
||||
},
|
||||
|
||||
create2DArray(rows) {
|
||||
const arr = [];
|
||||
|
||||
for (let i = 0; i < rows; i++) {
|
||||
arr[i] = [];
|
||||
}
|
||||
|
||||
return arr;
|
||||
},
|
||||
captureMouse(event) {
|
||||
// clientX/Y gives the coordinates relative to the viewport in CSS pixels.
|
||||
// console.log("viewport", event.clientX);
|
||||
// console.log("viewport", event.clientY);
|
||||
|
||||
// // pageX/Y gives the coordinates relative to the <html> element in CSS pixels.
|
||||
// console.log("element", event.pageX);
|
||||
// console.log("element", event.pageY);
|
||||
|
||||
this.dashboardX = event.pageX;
|
||||
this.dashboardY = event.pageY;
|
||||
|
||||
// // screenX/Y gives the coordinates relative to the screen in device pixels.
|
||||
// console.log("screen", event.screenX);
|
||||
// console.log("screen", event.screenY);
|
||||
},
|
||||
},
|
||||
};
|
||||
|
|
|
|||
288
src/ascii.js
288
src/ascii.js
File diff suppressed because one or more lines are too long
|
|
@ -36,14 +36,14 @@
|
|||
@click="$modal.hide('create-ascii-modal')"
|
||||
>
|
||||
<t-button type="button"> Cancel </t-button>
|
||||
<t-button type="button" @click="createNewASCII()"> Ok </t-button>
|
||||
<t-button type="button" @click="initiateNewAscii()"> Ok </t-button>
|
||||
</div>
|
||||
</template>
|
||||
</t-modal>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LZString from 'lz-string';
|
||||
import createNewASCII from "./../../ascii.js"
|
||||
|
||||
export default {
|
||||
name: "NewAsciiModal",
|
||||
|
|
@ -72,64 +72,17 @@ export default {
|
|||
this.forms.createAscii.title = `New ASCII ${this.$store.getters.asciibirdMeta.length+1}`;
|
||||
this.$modal.show("create-ascii-modal");
|
||||
},
|
||||
createNewASCII() {
|
||||
let newAscii = {
|
||||
title: this.forms.createAscii.title,
|
||||
key: this.$store.getters.asciibirdMeta.length,
|
||||
width: this.forms.createAscii.width,
|
||||
height: this.forms.createAscii.height,
|
||||
blockWidth: 8,
|
||||
blockHeight: 13,
|
||||
history: [],
|
||||
redo: [],
|
||||
x: 247, // the dragable ascii canvas x
|
||||
y: 24, // the dragable ascii canvas y
|
||||
blocks: this.create2DArray(this.forms.createAscii.height),
|
||||
};
|
||||
|
||||
// Push all the default ASCII blocks
|
||||
for (let x = 0; x < newAscii.width; x++) {
|
||||
for (let y = 0; y < newAscii.height; y++) {
|
||||
newAscii.blocks[y].push({
|
||||
bg: null,
|
||||
fg: null,
|
||||
char: null,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
newAscii.blocks = LZString.compressToUTF16(JSON.stringify(newAscii.blocks))
|
||||
newAscii.history.push( newAscii.blocks)
|
||||
this.$store.commit("newAsciibirdMeta", newAscii);
|
||||
this.$store.commit('openModal', 'new-ascii')
|
||||
initiateNewAscii() {
|
||||
console.log("all good")
|
||||
createNewASCII(this.forms);
|
||||
this.$modal.hide("create-ascii-modal");
|
||||
|
||||
// To show the ASCII after importing we get the last key
|
||||
// from the asciiBirdMeta array
|
||||
const keys = this.$store.getters.asciibirdMeta
|
||||
.map((v, k) => k)
|
||||
.filter((i) => i !== undefined);
|
||||
|
||||
// Set the current tab and pop the array for the last value
|
||||
this.currentTab = keys.pop();
|
||||
this.$store.commit("changeTab", this.currentTab);
|
||||
|
||||
this.show = false;
|
||||
},
|
||||
closeNewASCII({ params, cancel }) {
|
||||
this.forms.createAscii.width = 80;
|
||||
this.forms.createAscii.height = 30;
|
||||
this.forms.createAscii.title = "New ASCII";
|
||||
},
|
||||
create2DArray(rows) {
|
||||
const arr = [];
|
||||
|
||||
for (let i = 0; i < rows; i++) {
|
||||
arr[i] = [];
|
||||
}
|
||||
|
||||
return arr;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -28,7 +28,8 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import LZString from "lz-string";
|
||||
//
|
||||
import { parseMircAscii } from "../../ascii.js"
|
||||
|
||||
export default {
|
||||
name: "PasteAsciiModal",
|
||||
|
|
@ -48,250 +49,17 @@ export default {
|
|||
if (val !== old) {
|
||||
this.pasteModal();
|
||||
}
|
||||
|
||||
// this.showPasteModal();
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
pasteModal() {
|
||||
|
||||
|
||||
this.$modal.show("paste-ascii-modal");
|
||||
},
|
||||
create2DArray(rows) {
|
||||
const arr = [];
|
||||
|
||||
for (let i = 0; i < rows; i++) {
|
||||
arr[i] = [];
|
||||
}
|
||||
|
||||
return arr;
|
||||
},
|
||||
importPasteAscii() {
|
||||
const MIRC_MAX_COLOURS = this.$store.getters.mircColours.length;
|
||||
|
||||
// The current state of the Colours
|
||||
let curBlock = {
|
||||
fg: null,
|
||||
bg: null,
|
||||
char: null,
|
||||
};
|
||||
|
||||
let contents = this.pasteContent
|
||||
let filename = this.title
|
||||
|
||||
// set asciiImport as the entire file contents as a string
|
||||
const asciiImport = contents
|
||||
.split("\u0003\u0003")
|
||||
.join("\u0003")
|
||||
.split("\u000F").join("")
|
||||
.split("\u0003\n").join("\n")
|
||||
.split("\u0002\u0003").join("\u0003");
|
||||
|
||||
// This will end up in the asciibirdMeta
|
||||
const finalAscii = {
|
||||
width: false, // defined in: switch (curChar) case "\n":
|
||||
height: asciiImport.split("\n").length,
|
||||
title: filename,
|
||||
key: this.$store.getters.nextTabValue,
|
||||
blockWidth: 8 * this.$store.getters.blockSizeMultiplier,
|
||||
blockHeight: 13 * this.$store.getters.blockSizeMultiplier,
|
||||
blocks: this.create2DArray(asciiImport.split("\n").length),
|
||||
history: [],
|
||||
redo: [],
|
||||
x: 8 * 35, // the dragable ascii canvas x
|
||||
y: 13 * 2, // the dragable ascii canvas y
|
||||
};
|
||||
|
||||
// Turn the entire ascii string into an array
|
||||
let asciiStringArray = asciiImport.split("");
|
||||
let linesArray = asciiImport.split("\n");
|
||||
|
||||
// The proper X and Y value of the block inside the ASCII
|
||||
let asciiX = 0;
|
||||
let asciiY = 0;
|
||||
|
||||
// used to determine colours
|
||||
let colourChar1 = null;
|
||||
let colourChar2 = null;
|
||||
let parsedColour = null;
|
||||
|
||||
// This variable just counts the amount of colour and char codes to minus
|
||||
// to get the real width
|
||||
let widthOfColCodes = 0;
|
||||
|
||||
// Better for colourful asciis
|
||||
let maxWidthLoop = 0;
|
||||
|
||||
// Used before the loop, better for plain text
|
||||
let maxWidthFound = 0;
|
||||
|
||||
for(let i = 0; i < linesArray.length; i++) {
|
||||
if (linesArray[i].length > maxWidthFound) {
|
||||
maxWidthFound = linesArray[i].length;
|
||||
}
|
||||
}
|
||||
|
||||
while (asciiStringArray.length) {
|
||||
const curChar = asciiStringArray[0];
|
||||
|
||||
// Defining a small finite state machine
|
||||
// to detect the colour code
|
||||
switch (curChar) {
|
||||
case "\n":
|
||||
// Reset the colours here on a new line
|
||||
curBlock = {
|
||||
fg: null,
|
||||
bg: null,
|
||||
char: null,
|
||||
};
|
||||
|
||||
if (linesArray[asciiY] && linesArray[asciiY].length > maxWidthLoop) {
|
||||
maxWidthLoop = linesArray[asciiY].length;
|
||||
}
|
||||
|
||||
// the Y value of the ascii
|
||||
asciiY++;
|
||||
|
||||
// Calculate widths mirc asciis vs plain text
|
||||
if (!finalAscii.width && widthOfColCodes > 0) {
|
||||
finalAscii.width =
|
||||
maxWidthLoop - widthOfColCodes; // minus \n for the proper width
|
||||
}
|
||||
|
||||
|
||||
if (!finalAscii.width && widthOfColCodes === 0) {
|
||||
// Plain text
|
||||
finalAscii.width =
|
||||
maxWidthFound; // minus \n for the proper width
|
||||
}
|
||||
|
||||
// Resets the X value
|
||||
asciiX = 0;
|
||||
|
||||
asciiStringArray.shift();
|
||||
widthOfColCodes = 0;
|
||||
break;
|
||||
|
||||
case "\u0003":
|
||||
// Remove the colour char
|
||||
asciiStringArray.shift();
|
||||
widthOfColCodes++;
|
||||
|
||||
// Attempt to work out bg
|
||||
colourChar1 = `${asciiStringArray[0]}`;
|
||||
colourChar2 = `${asciiStringArray[1]}`;
|
||||
parsedColour = parseInt(`${colourChar1}${colourChar2}`);
|
||||
|
||||
// Work out the 01, 02 double digit codes
|
||||
if (parseInt(colourChar1) === 0 && parseInt(colourChar2) >= 0) {
|
||||
asciiStringArray.shift();
|
||||
}
|
||||
|
||||
if (isNaN(parsedColour)) {
|
||||
curBlock.bg = parseInt(colourChar1);
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
} else if (parsedColour <= MIRC_MAX_COLOURS && parsedColour >= 0) {
|
||||
curBlock.fg = parseInt(parsedColour);
|
||||
widthOfColCodes += parsedColour.toString().length;
|
||||
|
||||
asciiStringArray = asciiStringArray.slice(
|
||||
parsedColour.toString().length,
|
||||
asciiStringArray.length
|
||||
);
|
||||
}
|
||||
|
||||
// No background colour
|
||||
if (asciiStringArray[0] !== ",") {
|
||||
break;
|
||||
} else {
|
||||
// Remove , from array
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
}
|
||||
|
||||
// Attempt to work out bg
|
||||
colourChar1 = `${asciiStringArray[0]}`;
|
||||
colourChar2 = `${asciiStringArray[1]}`;
|
||||
parsedColour = parseInt(`${colourChar1}${colourChar2}`);
|
||||
|
||||
if (
|
||||
!isNaN(colourChar1) &&
|
||||
!isNaN(colourChar2) &&
|
||||
parseInt(colourChar2) > parseInt(colourChar1) &&
|
||||
!isNaN(parsedColour) &&
|
||||
parseInt(parsedColour) < 10
|
||||
) {
|
||||
parsedColour = parseInt(colourChar2);
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
}
|
||||
|
||||
if (
|
||||
parseInt(colourChar2) === parseInt(colourChar1) &&
|
||||
parseInt(parsedColour) < 10
|
||||
) {
|
||||
parsedColour = parseInt(colourChar1);
|
||||
asciiStringArray.shift();
|
||||
asciiStringArray.shift();
|
||||
widthOfColCodes += 2;
|
||||
|
||||
curBlock.bg = parseInt(colourChar1);
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
if (isNaN(parsedColour)) {
|
||||
curBlock.bg = parseInt(colourChar1);
|
||||
widthOfColCodes += 1;
|
||||
asciiStringArray.shift();
|
||||
} else if (parsedColour <= MIRC_MAX_COLOURS && parsedColour >= 0) {
|
||||
curBlock.bg = parseInt(parsedColour);
|
||||
widthOfColCodes += parsedColour.toString().length;
|
||||
|
||||
asciiStringArray = asciiStringArray.slice(
|
||||
parsedColour.toString().length,
|
||||
asciiStringArray.length
|
||||
);
|
||||
|
||||
break;
|
||||
}
|
||||
|
||||
break;
|
||||
|
||||
default:
|
||||
curBlock.char = curChar;
|
||||
asciiStringArray.shift();
|
||||
asciiX++;
|
||||
|
||||
finalAscii.blocks[asciiY][asciiX - 1] = { ...curBlock };
|
||||
break;
|
||||
} // End Switch
|
||||
} // End loop charPos
|
||||
|
||||
// Store the ASCII
|
||||
finalAscii.blocks = LZString.compressToUTF16(
|
||||
JSON.stringify(finalAscii.blocks)
|
||||
);
|
||||
finalAscii.history.push(finalAscii.blocks);
|
||||
this.$store.commit("newAsciibirdMeta", finalAscii);
|
||||
|
||||
// To show the ASCII after importing we get the last key
|
||||
// from the asciiBirdMeta array
|
||||
const keys = this.$store.getters.asciibirdMeta
|
||||
.map((v, k) => k)
|
||||
.filter((i) => i !== undefined);
|
||||
|
||||
// Set the current tab and pop the array for the last value
|
||||
this.currentTab = keys.pop();
|
||||
this.$store.commit("changeTab", this.currentTab);
|
||||
|
||||
// Update the browsers title to the ASCII filename
|
||||
document.title = `asciibird - ${this.$store.getters.currentAscii.title}`;
|
||||
parseMircAscii(this.pasteContent, this.title)
|
||||
|
||||
this.$modal.hide("paste-ascii-modal");
|
||||
|
||||
this.pasteContent = null;
|
||||
this.title = 'clipboard.txt';
|
||||
},
|
||||
|
|
|
|||
|
|
@ -27,6 +27,11 @@ import {
|
|||
} from 'vue-tailwind/dist/components';
|
||||
import Dashboard from './Dashboard.vue';
|
||||
import store from './store';
|
||||
|
||||
import {
|
||||
parseMircAscii
|
||||
} from "./ascii"
|
||||
|
||||
// optionally import default styles
|
||||
import 'vue-draggable-resizable/dist/VueDraggableResizable.css';
|
||||
import {
|
||||
|
|
|
|||
|
|
@ -113,9 +113,9 @@ 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();
|
||||
this.$store.commit("brushBlocks", this.selectBlocks);
|
||||
this.canTool = true;
|
||||
this.drawBrush();
|
||||
|
||||
console.log("ctrl c", this.selectBlocks);
|
||||
}
|
||||
|
|
@ -126,16 +126,15 @@ export default {
|
|||
if (e.key === "v" && (e.ctrlKey || e.metaKey)) {
|
||||
e.preventDefault();
|
||||
|
||||
if (this.isSelecting && this.isSelected && this.selectBlocks.length) {
|
||||
const BLOCK_WIDTH = this.currentAscii.blockWidth;
|
||||
const BLOCK_HEIGHT = this.currentAscii.blockHeight;
|
||||
if (this.selectBlocks.length) {
|
||||
let x = 0;
|
||||
let y = 0;
|
||||
|
||||
for (y = 0; y <= this.selectBlocks.height; y++) {
|
||||
canvasY = BLOCK_HEIGHT * y;
|
||||
let blocksHeight = this.selectBlocks.length;
|
||||
let blocksWidth = this.selectBlocks[0].length;
|
||||
|
||||
for (x = 0; x <= this.selectBlocks.width; x++) {
|
||||
for (y = 0; y < blocksHeight; y++) {
|
||||
for (x = 0; x < blocksWidth; x++) {
|
||||
if (
|
||||
this.currentAsciiBlocks[y] &&
|
||||
this.currentAsciiBlocks[y][x]
|
||||
|
|
@ -213,6 +212,15 @@ export default {
|
|||
canText() {
|
||||
return this.$store.getters.getTargetingChar;
|
||||
},
|
||||
currentFg() {
|
||||
return this.$store.getters.getFgColour;
|
||||
},
|
||||
currentBg() {
|
||||
return this.$store.getters.getBgColour;
|
||||
},
|
||||
currentChar() {
|
||||
return this.$store.getters.getSelectedChar;
|
||||
},
|
||||
isTextEditing() {
|
||||
return (
|
||||
this.$store.getters.getToolbarIcons[this.$store.getters.getCurrentTool]
|
||||
|
|
@ -246,7 +254,9 @@ export default {
|
|||
currentAscii(val, old) {
|
||||
console.log("changed");
|
||||
if (val !== old) {
|
||||
this.onCanvasResize(100,100,
|
||||
this.onCanvasResize(
|
||||
100,
|
||||
100,
|
||||
this.currentAscii.width * this.currentAscii.blockWidth,
|
||||
this.currentAscii.height * this.currentAscii.blockHeight
|
||||
);
|
||||
|
|
@ -283,7 +293,9 @@ export default {
|
|||
}
|
||||
},
|
||||
isMouseOnCanvas() {
|
||||
this.clearToolCanvas();
|
||||
if (!this.isSelecting) {
|
||||
this.clearToolCanvas();
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -577,6 +589,9 @@ export default {
|
|||
this.delayRedrawCanvas();
|
||||
},
|
||||
canvasMouseDown() {
|
||||
const BLOCK_WIDTH = this.currentAscii.blockWidth;
|
||||
const BLOCK_HEIGHT = this.currentAscii.blockHeight;
|
||||
|
||||
this.toolCtx.clearRect(0, 0, 10000, 10000);
|
||||
|
||||
if (
|
||||
|
|
@ -591,6 +606,7 @@ export default {
|
|||
break;
|
||||
|
||||
case "select":
|
||||
|
||||
if (
|
||||
this.selecting.startX === null ||
|
||||
(this.selecting.startY === null &&
|
||||
|
|
@ -644,6 +660,9 @@ export default {
|
|||
this.y = e.offsetY;
|
||||
}
|
||||
|
||||
let canvasX = this.x;
|
||||
let canvasY = this.y;
|
||||
|
||||
this.x = Math.floor(this.x / this.currentAscii.blockWidth);
|
||||
this.y = Math.floor(this.y / this.currentAscii.blockHeight);
|
||||
|
||||
|
|
@ -675,8 +694,8 @@ export default {
|
|||
|
||||
case "select":
|
||||
if (this.selecting.canSelect) {
|
||||
this.selecting.endX = this.x;
|
||||
this.selecting.endY = this.y;
|
||||
this.selecting.endX = canvasX;
|
||||
this.selecting.endY = canvasY;
|
||||
|
||||
this.redrawSelect();
|
||||
}
|
||||
|
|
@ -907,7 +926,7 @@ export default {
|
|||
const { x } = this;
|
||||
const { y } = this;
|
||||
|
||||
const newColor = this.$store.getters.getBgColour;
|
||||
const newColor = this.currengBg;
|
||||
|
||||
// Get the input which needs to be replaced.
|
||||
const current = this.currentAsciiBlocks[y][x].bg;
|
||||
|
|
@ -953,7 +972,17 @@ export default {
|
|||
return;
|
||||
}
|
||||
|
||||
fillBlocks[y][x].bg = newColor;
|
||||
if (this.canBg) {
|
||||
fillBlocks[y][x].bg = this.currentBg;
|
||||
}
|
||||
|
||||
if (this.canFg) {
|
||||
fillBlocks[y][x].fg = this.currentFg;
|
||||
}
|
||||
|
||||
if (this.canText) {
|
||||
fillBlocks[y][x].char = this.currentChar;
|
||||
}
|
||||
|
||||
// Fill in all four directions
|
||||
// Fill Prev row
|
||||
|
|
|
|||
Loading…
Reference in New Issue