mirror of
https://github.com/piskelapp/piskel.git
synced 2023-08-10 21:12:52 +03:00
Merge pull request #560 from smiegrin/master
Allows square brush size of up to 32 pixels using keyboard...
This commit is contained in:
commit
9dd403a54e
@ -16,17 +16,17 @@
|
||||
}
|
||||
|
||||
.pen-size-option[data-size='1'] {
|
||||
padding: 6px;
|
||||
}
|
||||
.pen-size-option[data-size='2'] {
|
||||
padding: 5px;
|
||||
}
|
||||
.pen-size-option[data-size='3'] {
|
||||
.pen-size-option[data-size='2'] {
|
||||
padding: 4px;
|
||||
}
|
||||
.pen-size-option[data-size='4'] {
|
||||
.pen-size-option[data-size='3'] {
|
||||
padding: 3px;
|
||||
}
|
||||
.pen-size-option[data-size='4'] {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
.pen-size-option:before {
|
||||
content: '';
|
||||
@ -34,6 +34,9 @@
|
||||
height: 100%;
|
||||
background-color: white;
|
||||
display: block;
|
||||
text-align: center;
|
||||
line-height: 12px;
|
||||
font-size: 90%;
|
||||
}
|
||||
|
||||
.pen-size-option:hover {
|
||||
@ -47,3 +50,7 @@
|
||||
.pen-size-option.selected {
|
||||
border-color: gold;
|
||||
}
|
||||
|
||||
.pen-size-option.labeled:before {
|
||||
content: attr(real-pen-size);
|
||||
}
|
||||
|
@ -25,9 +25,17 @@
|
||||
};
|
||||
|
||||
ns.PenSizeController.prototype.updateSelectedOption_ = function () {
|
||||
pskl.utils.Dom.removeClass('labeled', this.container);
|
||||
pskl.utils.Dom.removeClass('selected', this.container);
|
||||
var size = pskl.app.penSizeService.getPenSize();
|
||||
var selectedOption = this.container.querySelector('[data-size="' + size + '"]');
|
||||
var selectedOption;
|
||||
if (size <= 4) {
|
||||
selectedOption = this.container.querySelector('[data-size="' + size + '"]');
|
||||
} else {
|
||||
selectedOption = this.container.querySelector('[data-size="4"]');
|
||||
selectedOption.classList.add('labeled');
|
||||
selectedOption.setAttribute('real-pen-size', size);
|
||||
}
|
||||
if (selectedOption) {
|
||||
selectedOption.classList.add('selected');
|
||||
}
|
||||
|
@ -2,7 +2,7 @@
|
||||
var ns = $.namespace('pskl.service.pensize');
|
||||
|
||||
var MIN_PENSIZE = 1;
|
||||
var MAX_PENSIZE = 4;
|
||||
var MAX_PENSIZE = 32;
|
||||
|
||||
/**
|
||||
* Service to retrieve and modify the current pen size.
|
||||
|
@ -76,33 +76,19 @@
|
||||
*
|
||||
* @param {Number} row x-coordinate of the original pixel
|
||||
* @param {Number} col y-coordinate of the original pixel
|
||||
* @param {Number} size >= 1 && <= 4
|
||||
* @param {Number} size >= 1 && <= 32
|
||||
* @return {Array} array of arrays of 2 Numbers (eg. [[0,0], [0,1], [1,0], [1,1]])
|
||||
*/
|
||||
resizePixel : function (col, row, size) {
|
||||
if (size == 1) {
|
||||
return [[col, row]];
|
||||
} else if (size == 2) {
|
||||
return [
|
||||
[col, row], [col + 1, row],
|
||||
[col, row + 1], [col + 1, row + 1]
|
||||
];
|
||||
} else if (size == 3) {
|
||||
return [
|
||||
[col - 1, row - 1], [col, row - 1], [col + 1, row - 1],
|
||||
[col - 1, row + 0], [col, row + 0], [col + 1, row + 0],
|
||||
[col - 1, row + 1], [col, row + 1], [col + 1, row + 1],
|
||||
];
|
||||
} else if (size == 4) {
|
||||
return [
|
||||
[col - 1, row - 1], [col, row - 1], [col + 1, row - 1], [col + 2, row - 1],
|
||||
[col - 1, row + 0], [col, row + 0], [col + 1, row + 0], [col + 2, row + 0],
|
||||
[col - 1, row + 1], [col, row + 1], [col + 1, row + 1], [col + 2, row + 1],
|
||||
[col - 1, row + 2], [col, row + 2], [col + 1, row + 2], [col + 2, row + 2],
|
||||
];
|
||||
} else {
|
||||
console.error('Unsupported size : ' + size);
|
||||
var pixels = [];
|
||||
|
||||
for (var j = 0; j < size; j++) {
|
||||
for (var i = 0; i < size; i++) {
|
||||
pixels.push([col - Math.floor(size / 2) + i, row - Math.floor(size / 2) + j]);
|
||||
}
|
||||
}
|
||||
|
||||
return pixels;
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -51,12 +51,12 @@ describe("PenSize test suite", function() {
|
||||
});
|
||||
|
||||
it("skips invalid value (outside of [1, 4])", function() {
|
||||
console.log('[PenSizeService] skips invalid value (outside of [1, 4])');
|
||||
console.log('[PenSizeService] skips invalid value (outside of [1, 32])');
|
||||
userSettingsPenSize = 1;
|
||||
|
||||
penSizeService.init();
|
||||
// MAX_VALUE is 4
|
||||
penSizeService.setPenSize(5);
|
||||
// MAX_VALUE is 32
|
||||
penSizeService.setPenSize(33);
|
||||
expect(penSizeService.getPenSize()).toBe(1);
|
||||
// MIN_VALUE is 1
|
||||
penSizeService.setPenSize(0);
|
||||
|
Loading…
Reference in New Issue
Block a user