Simplify colorize function to increase reuse
This commit is contained in:
parent
e86312b162
commit
ec5279127f
1 changed files with 18 additions and 19 deletions
37
js/Grid.js
37
js/Grid.js
|
@ -2,7 +2,7 @@ import * as File from WTK.File;
|
||||||
import * as Async from UnitJS.Async;
|
import * as Async from UnitJS.Async;
|
||||||
import compose from UnitJS.Fun;
|
import compose from UnitJS.Fun;
|
||||||
import * as Dom from UnitJS.Dom;
|
import * as Dom from UnitJS.Dom;
|
||||||
import {color, tool} from Toolbox;
|
import Toolbox;
|
||||||
|
|
||||||
|
|
||||||
var grid = {
|
var grid = {
|
||||||
|
@ -32,8 +32,8 @@ function init(size, elementId) {
|
||||||
|
|
||||||
function emptyGrid(size) {
|
function emptyGrid(size) {
|
||||||
var result = {};
|
var result = {};
|
||||||
for(var i = 0; i < size; i++) {
|
for(var row = 0; row < size; row++) {
|
||||||
result[i] = {};
|
result[row] = {};
|
||||||
}
|
}
|
||||||
return result;
|
return result;
|
||||||
}
|
}
|
||||||
|
@ -46,31 +46,31 @@ function makeRow(config) {
|
||||||
return Dom.make('tr', {}, cells);
|
return Dom.make('tr', {}, cells);
|
||||||
}
|
}
|
||||||
|
|
||||||
function bodyAttributes(i, j) {
|
function bodyAttributes(row, column) {
|
||||||
return {
|
return {
|
||||||
onMousedown: function(e) {
|
onMousedown: function() {
|
||||||
down = true;
|
down = true;
|
||||||
if(tool() == 'draw') {
|
if(Toolbox.tool() == 'draw') {
|
||||||
colorize(i, j, e.target);
|
colorize(row, column);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onMouseup: function(e) {
|
onMouseup: function() {
|
||||||
down = false;
|
down = false;
|
||||||
if(tool() == 'paint') {
|
if(Toolbox.tool() == 'paint') {
|
||||||
paint(i, j);
|
paint(row, column);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onMouseenter: function(e) {
|
onMouseenter: function() {
|
||||||
if(down && tool() == 'draw') {
|
if(down && Toolbox.tool() == 'draw') {
|
||||||
colorize(i, j, e.target);
|
colorize(row, column);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
function colorize(i, j, element) {
|
function colorize(row, column, color) {
|
||||||
grid.data[i][j] = color();
|
grid.data[row][column] = color || Toolbox.color();
|
||||||
element.className = grid.data[i][j];
|
grid.element.children[row].children[column].className = grid.data[row][column];
|
||||||
}
|
}
|
||||||
|
|
||||||
function paint(i0, j0) {
|
function paint(i0, j0) {
|
||||||
|
@ -80,7 +80,7 @@ function paint(i0, j0) {
|
||||||
var queue = [{i: i0, j: j0}];
|
var queue = [{i: i0, j: j0}];
|
||||||
while(queue.length > 0) {
|
while(queue.length > 0) {
|
||||||
var p0 = queue[0];
|
var p0 = queue[0];
|
||||||
colorize(p0.i, p0.j, grid.element.children[p0.i].children[p0.j]);
|
colorize(p0.i, p0.j);
|
||||||
done[p0.i][p0.j] = true;
|
done[p0.i][p0.j] = true;
|
||||||
for(var d = -1; d < 2; d += 2) {
|
for(var d = -1; d < 2; d += 2) {
|
||||||
[{i: p0.i + d, j: p0.j}, {i: p0.i, j: p0.j + d}].forEach(function(p1) {
|
[{i: p0.i + d, j: p0.j}, {i: p0.i, j: p0.j + d}].forEach(function(p1) {
|
||||||
|
@ -111,8 +111,7 @@ function setGridData(data) {
|
||||||
if(data != undefined) {
|
if(data != undefined) {
|
||||||
for(var row = 0; row < grid.element.children.length; row++) {
|
for(var row = 0; row < grid.element.children.length; row++) {
|
||||||
for(var column = 0; column < grid.element.children[row].children.length; column++) {
|
for(var column = 0; column < grid.element.children[row].children.length; column++) {
|
||||||
grid.data[row][column] = data[row][column];
|
colorize(row, column, data[row][column]);
|
||||||
grid.element.children[row].children[column].className = data[row][column];
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue