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

Removed "colors" global variable

Browse Source
This commit is contained in:
unsettledgames
2021-07-22 16:40:58 +02:00
parent 0d7a00c62f
commit 1a6079cc81
6 changed files with 23 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
js/ColorModule.js
View File

@@ -6,7 +6,9 @@ const ColorModule = (() => {
let currentPalette = []; let currentPalette = [];
// Reference to the HTML palette // Reference to the HTML palette
const coloursList = document.getElementById("palette-list"); const coloursList = document.getElementById("palette-list");
// Reference to the colours menu
const colorsMenu = document.getElementById("colors-menu");
// Binding events to callbacks // Binding events to callbacks
console.info("Initialized Color Module.."); console.info("Initialized Color Module..");
document.getElementById('jscolor-hex-input').addEventListener('change',colorChanged, false); document.getElementById('jscolor-hex-input').addEventListener('change',colorChanged, false);
@@ -52,7 +54,7 @@ const ColorModule = (() => {
colors = document.getElementsByClassName('color-button'); colors = document.getElementsByClassName('color-button');
//loop through all colors in palette //loop through all colors in palette
for (var i = 0; i < colors.length; i++) { for (let i = 0; i < colors.length; i++) {
//if generated color matches this color //if generated color matches this color
if (newColorHex == colors[i].jscolor.toString()) { if (newColorHex == colors[i].jscolor.toString()) {
//if the color isnt the one that has the picker currently open //if the color isnt the one that has the picker currently open
@@ -254,7 +256,7 @@ const ColorModule = (() => {
//if color is a string, then find the corresponding button //if color is a string, then find the corresponding button
if (typeof color === 'string') { if (typeof color === 'string') {
//get all colors in palette //get all colors in palette
colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
//loop through colors //loop through colors
for (var i = 0; i < colors.length; i++) { for (var i = 0; i < colors.length; i++) {
@@ -278,12 +280,12 @@ const ColorModule = (() => {
color.jscolor.hide(); color.jscolor.hide();
//find lightest color in palette //find lightest color in palette
var colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
var lightestColor = [0,null]; let lightestColor = [0,null];
for (var i = 0; i < colors.length; i++) { for (let i = 0; i < colors.length; i++) {
//get colors lightness //get colors lightness
var lightness = Color.rgbToHsl(colors[i].jscolor.toRgb()).l; let lightness = Color.rgbToHsl(colors[i].jscolor.toRgb()).l;
//if not the color we're deleting //if not the color we're deleting
if (colors[i] != color) { if (colors[i] != color) {

12
js/History.js
View File

@@ -416,12 +416,12 @@ class HistoryState {
this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]); this.canvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
this.undo = function () { this.undo = function () {
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]); let currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
currentLayer.context.putImageData(this.canvas, 0, 0); currentLayer.context.putImageData(this.canvas, 0, 0);
//find new color in palette and change it back to old color //find new color in palette and change it back to old color
var colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
for (var i = 0; i < colors.length; i++) { for (let i = 0; i < colors.length; i++) {
//console.log(newColorValue, '==', colors[i].jscolor.toString()); //console.log(newColorValue, '==', colors[i].jscolor.toString());
if (newColorValue == colors[i].jscolor.toString()) { if (newColorValue == colors[i].jscolor.toString()) {
colors[i].jscolor.fromString(oldColorValue); colors[i].jscolor.fromString(oldColorValue);
@@ -433,12 +433,12 @@ class HistoryState {
}; };
this.redo = function () { this.redo = function () {
var currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]); let currentCanvas = currentLayer.context.getImageData(0, 0, canvasSize[0], canvasSize[1]);
currentLayer.context.putImageData(this.canvas, 0, 0); currentLayer.context.putImageData(this.canvas, 0, 0);
//find old color in palette and change it back to new color //find old color in palette and change it back to new color
var colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
for (var i = 0; i < colors.length; i++) { for (let i = 0; i < colors.length; i++) {
//console.log(oldColorValue, '==', colors[i].jscolor.toString()); //console.log(oldColorValue, '==', colors[i].jscolor.toString());
if (oldColorValue == colors[i].jscolor.toString()) { if (oldColorValue == colors[i].jscolor.toString()) {
colors[i].jscolor.fromString(newColorValue); colors[i].jscolor.fromString(newColorValue);

2
js/Startup.js
View File

@@ -152,7 +152,7 @@ const Startup = (() => {
let selectedPalette = Util.getText('palette-button' + splashPostfix); let selectedPalette = Util.getText('palette-button' + splashPostfix);
//remove current palette //remove current palette
colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
while (colors.length > 0) { while (colors.length > 0) {
colors[0].parentElement.remove(); colors[0].parentElement.remove();
} }

6
js/_jscolor.js
View File

@@ -1102,15 +1102,15 @@ if (!window.jscolor) { window.jscolor = (function () {
hexInput.colorElement = this.styleElement; hexInput.colorElement = this.styleElement;
//disable delete button if last color //disable delete button if last color
var colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
var deleteButton = document.getElementsByClassName('delete-color-button')[0]; let deleteButton = document.getElementsByClassName('delete-color-button')[0];
if(colors.length == 1) if(colors.length == 1)
deleteButton.classList.add('disabled'); deleteButton.classList.add('disabled');
else else
deleteButton.classList.remove('disabled'); deleteButton.classList.remove('disabled');
//hide duplicate color warning //hide duplicate color warning
var duplicateColorWarning = document.getElementById('duplicate-color-warning'); let duplicateColorWarning = document.getElementById('duplicate-color-warning');
duplicateColorWarning.style.visibility = 'hidden'; duplicateColorWarning.style.visibility = 'hidden';
}; };

6
js/_mouseEvents.js
View File

@@ -99,13 +99,13 @@ window.addEventListener("mouseup", function (mouseEvent) {
layers[i].context.fillStyle = currentGlobalColor; layers[i].context.fillStyle = currentGlobalColor;
} }
var colors = document.getElementsByClassName('color-button'); let colors = document.getElementsByClassName('color-button');
for (var i = 0; i < colors.length; i++) { for (let i = 0; i < colors.length; i++) {
//if picked color matches this color //if picked color matches this color
if (newColor == colors[i].jscolor.toString()) { if (newColor == colors[i].jscolor.toString()) {
//remove current color selection //remove current color selection
var selectedColor = document.querySelector("#colors-menu li.selected") let selectedColor = document.querySelector("#colors-menu li.selected")
if (selectedColor) selectedColor.classList.remove("selected"); if (selectedColor) selectedColor.classList.remove("selected");
//set current color //set current color

5
js/_variables.js
View File

@@ -1,7 +1,7 @@
//init variables //init variables
var canvasSize; // REFACTOR: Canvas class / getCanvasSize method var canvasSize; // REFACTOR: Canvas class / getCanvasSize method
var zoom = 7; // REFACTOR: EditorState class/IIFE? var zoom = 7; // REFACTOR: EditorState class/IIFE?
var lastMouseClickPos = [0,0]; // REFACTOR: Input IIFE via getter? var lastMouseClickPos = [0,0]; // REFACTOR: Input IIFE via getter? <- probably editor state as it is changed by tools
var documentCreated = false; // REFACTOR: EditorState var documentCreated = false; // REFACTOR: EditorState
//common elements //common elements
@@ -11,9 +11,6 @@ var eyedropperPreview = document.getElementById("eyedropper-preview");
// REFACTOR: File class? // REFACTOR: File class?
var canvasView = document.getElementById("canvas-view"); var canvasView = document.getElementById("canvas-view");
// REFACTOR: find some way to put these in ColorModule?
var colors = document.getElementsByClassName("color-button");
var colorsMenu = document.getElementById("colors-menu");
// main canvas // main canvas
// REFACTOR: carefully check if it's possible to remove this one // REFACTOR: carefully check if it's possible to remove this one