Merge pull request #560 from smiegrin/master

Allows square brush size of up to 32 pixels using keyboard...
This commit is contained in:
Julian Descottes 2016-11-30 23:05:03 +01:00 committed by GitHub
commit 9dd403a54e
6 changed files with 37 additions and 36 deletions

View File

@ -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);
}

View File

@ -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');
}

View File

@ -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.

View File

@ -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;
},
/**

View File

@ -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);