mirror/pixel-editor
1
0
Fork 0
mirror of https://github.com/lospec/pixel-editor.git synced 2023-08-10 21:12:51 +03:00
Code Issues Projects Releases Wiki Activity

Fixed magic wand bug, started tool tutorials

Browse Source 
Multiplied by canvas height instead of canvas width when computing the index of a pixel.
This commit is contained in:
Nicola
2022-01-25 00:28:24 +01:00
parent 33f362ef09
commit b5e33e3f34
11 changed files with 125 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
js/Tool.js
View File

@ -24,6 +24,7 @@ class Tool {
biggerButton = undefined;
smallerButton = undefined;
brushPreview = document.getElementById("brush-preview");
toolTutorial = document.getElementById("tool-tutorial");
constructor (name, options) {
this.name = name;
@ -34,6 +35,22 @@ class Tool {
this.smallerButton = document.getElementById(name + "-smaller-button");
}
resetTutorial() {
this.toolTutorial.innerHTML = "<ul></ul>";
}
addTutorialKey(key, text) {
this.toolTutorial.children[0].append(
'<li><span class="keyboard-key">' + key + '</span> ' + text + '</li>');
}
addTutorialText(key, text) {
this.toolTutorial.children[0].append(
'<li>' + key + ': ' + text + '</li>');
}
addTutorialImg(imgPath) {
this.toolTutorial.children[0].append(
'<img src="' + imgPath + '"/>');
}
onSelect() {
if (this.mainButton != undefined)
this.mainButton.parentElement.classList.add("selected");

5
js/TopMenuModule.js
View File

@ -5,8 +5,9 @@ const TopMenuModule = (() => {
initMenu();
function initMenu() {
//for each button in main menu (starting at 1 to avoid logo)
for (let i = 1; i < mainMenuItems.length; i++) {
// for each button in main menu (starting at 1 to avoid logo), ending at length-1 to avoid
// editor info
for (let i = 1; i < mainMenuItems.length-1; i++) {
//get the button that's in the list item
const menuItem = mainMenuItems[i];

4
js/tools/MagicWandTool.js
View File

@ -19,7 +19,7 @@ class MagicWandTool extends SelectionTool {
getSelection() {
let coords = [Math.floor(this.endMousePos[0]), Math.floor(this.endMousePos[1])];
let data = currFile.currentLayer.context.getImageData(0, 0, currFile.canvasSize[0], currFile.canvasSize[1]).data;
let index = (coords[1] * currFile.canvasSize[1] + coords[0]) * 4;
let index = (coords[1] * currFile.canvasSize[0] + coords[0]) * 4;
let color = [data[index], data[index+1], data[index+2], data[index+3]];
let selectedData = new ImageData(currFile.canvasSize[0], currFile.canvasSize[1]);
@ -28,7 +28,7 @@ class MagicWandTool extends SelectionTool {
for (const pixel in this.currSelection) {
let coords = [parseInt(pixel.split(",")[0]), parseInt(pixel.split(",")[1])];
let index = (currFile.canvasSize[1] * coords[1] + coords[0]) * 4;
let index = (currFile.canvasSize[0] * coords[1] + coords[0]) * 4;
selectedData[index] = color[0];
selectedData[index+1] = color[1];

2
js/tools/SelectionTool.js
View File

@ -94,7 +94,7 @@ class SelectionTool extends Tool {
for (const key in this.currSelection) {
let x = parseInt(key.split(",")[0]);
let y = parseInt(key.split(",")[1]);
let index = (y * currFile.canvasSize[1] + x) * 4;
let index = (y * currFile.canvasSize[0] + x) * 4;
for (let i=0; i<4; i++) {
// Save the pixel