artin/miniPaint
1
0
Fork 0
mirror of https://github.com/viliusle/miniPaint.git synced 2026-02-06 14:11:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

ability to select pencil, brush, borders,

Browse Source
This commit is contained in:
viliusle 2020-10-25 13:47:16 +02:00
parent d72c9a2336
commit b6408e9295
4 changed files with 140 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/js/core/base-layers.js
View File

@ -29,6 +29,7 @@ var instance = null;
* - height_original (int)
* - visible (bool)
* - is_vector (bool)
* - hide_selection_if_active (bool)
* - opacity (0-100)
* - order (int)
* - composition (string)
@ -304,6 +305,7 @@ class Base_layers_class {
height_original: null,
visible: true,
is_vector: false,
hide_selection_if_active: false,
opacity: 100,
order: _this.auto_increment,
composition: 'source-over',

3
src/js/core/base-selection.js
View File

@ -117,7 +117,8 @@ class Base_selection_class {
var settings = this.find_settings();
var data = settings.data;
if (settings.data === null || settings.data.status == 'draft') {
if (settings.data === null || settings.data.status == 'draft'
|| (settings.data.hide_selection_if_active === true && settings.data.type == config.TOOL.name)) {
return;
}

118
src/js/tools/brush.js
View File

@ -110,8 +110,11 @@ class Brush_class extends Base_tools_class {
params: this.clone(this.getParams()),
status: 'draft',
render_function: [this.name, 'render'],
width: null,
height: null,
x: 0,
y: 0,
width: config.WIDTH,
height: config.HEIGHT,
hide_selection_if_active: true,
rotate: null,
is_vector: true,
};
@ -119,10 +122,7 @@ class Brush_class extends Base_tools_class {
this.params_hash = params_hash;
}
config.layer.data.push({
pressure: this.pressure_supported,
data: [],
});
config.layer.data.push([]);
}
mousemove(e) {
@ -154,7 +154,7 @@ class Brush_class extends Base_tools_class {
}
}
last_group.data.push([mouse.x - config.layer.x, mouse.y - config.layer.y, new_size]);
last_group.push([mouse.x - config.layer.x, mouse.y - config.layer.y, new_size]);
config.layer.status = 'draft';
this.Base_layers.render();
}
@ -177,8 +177,11 @@ class Brush_class extends Base_tools_class {
new_size = size * this.pointer_pressure * 2;
}
last_group.data.push([mouse.x - config.layer.x, mouse.y - config.layer.y, new_size]);
last_group.push([mouse.x - config.layer.x, mouse.y - config.layer.y, new_size]);
config.layer.status = null;
this.check_dimensions();
this.Base_layers.render();
}
@ -201,36 +204,14 @@ class Brush_class extends Base_tools_class {
var data = layer.data;
//check for legacy format
if(data.length > 0 && typeof data[0].data == "undefined"){
//convert
var legacy = JSON.parse(JSON.stringify(data));
data = [];
data.push({
pressure: true,
data: [],
});
var group_index = 0;
for(var i in legacy){
if(legacy[i][0] === null){
data.push({
pressure: false,
data: [],
});
group_index++;
}
else {
data[group_index].data.push([legacy[i][0], legacy[i][1], legacy[i][2]]);
}
}
}
data = this.check_legacy_format(data);
var n = data.length;
for (var k = 0; k < n; k++) {
var group = data[k]; //data from mouse down till mouse release
var group_data = group.data;
var group_data = data[k]; //data from mouse down till mouse release
var group_n = group_data.length;
if (group.pressure == false) {
if (params.pressure == false) {
//stabilized lines method does not support multiple line sizes
this.render_stabilized(ctx, group_data);
}
@ -354,6 +335,77 @@ class Brush_class extends Base_tools_class {
ctx.stroke();
}
check_legacy_format(data) {
//check for legacy format
if(data.length > 0 && typeof data[0][0] == "number"){
//convert
var legacy = JSON.parse(JSON.stringify(data));
data = [];
data.push([]);
var group_index = 0;
for(var i in legacy){
if(legacy[i] === null){
data.push([]);
group_index++;
}
else {
data[group_index].push([legacy[i][0], legacy[i][1], legacy[i][2]]);
}
}
}
return data;
}
/**
* recalculate layer x, y, width and height values.
*/
check_dimensions() {
var data = config.layer.data;
this.check_legacy_format(data);
if(config.layer.data.length == 0)
return;
//find bounds
var min_x = data[0][0][0];
var min_y = data[0][0][1];
var max_x = data[0][0][0];
var max_y = data[0][0][1];
var n = data.length;
for (var k = 0; k < n; k++) {
var group_data = data[k];
var group_n = group_data.length;
for (var i = 1; i < group_n; i++) {
min_x = Math.min(min_x, group_data[i][0]);
min_y = Math.min(min_y, group_data[i][1]);
max_x = Math.max(max_x, group_data[i][0]);
max_y = Math.max(max_y, group_data[i][1]);
}
}
//move current data
for (var k = 0; k < n; k++) {
var group_data = data[k];
var group_n = group_data.length;
for (var i = 0; i < group_n; i++) {
group_data[i][0] = group_data[i][0] - min_x;
group_data[i][1] = group_data[i][1] - min_y;
}
}
//change layers bounds
config.layer.x = config.layer.x + min_x;
config.layer.y = config.layer.y + min_y;
config.layer.width = max_x - min_x;
config.layer.height = max_y - min_y;
this.Base_layers.render();
}
}
export default Brush_class;

58
src/js/tools/pencil.js
View File

@ -87,8 +87,11 @@ class Pencil_class extends Base_tools_class {
params: this.clone(this.getParams()),
status: 'draft',
render_function: [this.name, 'render'],
x: 0,
y: 0,
width: config.WIDTH,
height: config.HEIGHT,
hide_selection_if_active: true,
rotate: null,
is_vector: true,
};
@ -112,7 +115,7 @@ class Pencil_class extends Base_tools_class {
//more data
if (params.antialiasing == false)
config.layer.data.push([Math.ceil(mouse.x), Math.ceil(mouse.y)]);
config.layer.data.push([Math.ceil(mouse.x - config.layer.x), Math.ceil(mouse.y - config.layer.y)]);
else
config.layer.data.push([mouse.x - config.layer.x, mouse.y - config.layer.y]);
this.Base_layers.render();
@ -128,9 +131,12 @@ class Pencil_class extends Base_tools_class {
//more data
if (params.antialiasing == false)
config.layer.data.push([Math.ceil(mouse.x), Math.ceil(mouse.y)]);
config.layer.data.push([Math.ceil(mouse.x - config.layer.x), Math.ceil(mouse.y - config.layer.y)]);
else
config.layer.data.push([mouse.x - config.layer.x, mouse.y - config.layer.y]);
this.check_dimensions();
config.layer.status = null;
this.Base_layers.render();
}
@ -161,7 +167,7 @@ class Pencil_class extends Base_tools_class {
/**
* draw with antialiasing, nice mode
*
* @param {ctx} ctx
* @param {object} ctx
* @param {object} layer
*/
render_antialiased(ctx, layer) {
@ -219,14 +225,13 @@ class Pencil_class extends Base_tools_class {
/**
* draw without antialiasing, sharp, ugly mode.
*
* @param {ctx} ctx
* @param {object} ctx
* @param {object} layer
*/
render_aliased(ctx, layer) {
if (layer.data.length == 0)
return;
var params = layer.params;
var data = layer.data;
var n = data.length;
@ -269,7 +274,7 @@ class Pencil_class extends Base_tools_class {
/**
* draws line without aliasing
*
* @param {ctx} ctx
* @param {object} ctx
* @param {int} from_x
* @param {int} from_y
* @param {int} to_x
@ -288,6 +293,45 @@ class Pencil_class extends Base_tools_class {
}
}
};
/**
* recalculate layer x, y, width and height values.
*/
check_dimensions() {
if(config.layer.data.length == 0)
return;
//find bounds
var data = config.layer.data;
var min_x = data[0][0];
var min_y = data[0][1];
var max_x = data[0][0];
var max_y = data[0][1];
for(var i in data){
if(data[i] === null)
continue;
min_x = Math.min(min_x, data[i][0]);
min_y = Math.min(min_y, data[i][1]);
max_x = Math.max(max_x, data[i][0]);
max_y = Math.max(max_y, data[i][1]);
}
//move current data
for(var i in data){
if(data[i] === null)
continue;
data[i][0] = data[i][0] - min_x;
data[i][1] = data[i][1] - min_y;
}
//change layers bounds
config.layer.x = config.layer.x + min_x;
config.layer.y = config.layer.y + min_y;
config.layer.width = max_x - min_x;
config.layer.height = max_y - min_y;
this.Base_layers.render();
}
}
export default Pencil_class;