replace color ux

This commit is contained in:
Tanasart 2024-04-25 16:03:30 +07:00
parent 2a6190e5ab
commit b94fb7acbf
5 changed files with 169 additions and 43 deletions

View file

@ -1,4 +1,4 @@
// 2024-04-25 15:06:31 // 2024-04-25 15:59:53
function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _group) constructor { function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _group) constructor {
name = "Replace Colors"; name = "Replace Colors";
@ -23,11 +23,14 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
__init_mask_modifier(4); // inputs 7, 8, __init_mask_modifier(4); // inputs 7, 8,
selecting_index = 0; palette_selecting = false;
palette_select = [ -1, -1 ];
function setColor(colr) { #region function setColor(colr) { #region
var _to = array_clone(getInputData(2)); var _to = array_clone(getInputData(2));
_to[selecting_index] = colr;
for (var i = palette_select[0]; i <= palette_select[1]; i++)
_to[i] = colr;
inputs[| 2].setValue(_to); // Not necessary due to array reference inputs[| 2].setValue(_to); // Not necessary due to array reference
} #endregion } #endregion
@ -79,6 +82,15 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
draw_sprite_stretched_ext(THEME.ui_panel_bg, 1, _x, _yy, _w, hh - top, COLORS.node_composite_bg_blend, 1); draw_sprite_stretched_ext(THEME.ui_panel_bg, 1, _x, _yy, _w, hh - top, COLORS.node_composite_bg_blend, 1);
var _selecting_y = 0;
var _selecting_h = 0;
var _sample = PANEL_PREVIEW.sample_color;
var _sel_x0 = 0;
var _sel_x1 = 0;
var _sel_y0 = 0;
var _sel_y1 = 0;
for( var i = 0; i < amo; i++ ) { for( var i = 0; i < amo; i++ ) {
var fr = array_safe_get_fast(_from, i); var fr = array_safe_get_fast(_from, i);
var to = array_safe_get_fast(_to, i); var to = array_safe_get_fast(_to, i);
@ -86,7 +98,10 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
var _x0 = _x + ui(8); var _x0 = _x + ui(8);
var _y0 = _yy + ui(8) + i * (ss + ui(8)); var _y0 = _yy + ui(8) + i * (ss + ui(8));
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x0, _y0, ss, ss, COLORS._main_icon, 0.5); var _cc = _sample == fr? c_white : COLORS._main_icon;
var _aa = 0.5 + (_sample == fr) * 0.5;
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x0, _y0, ss, ss, _cc, _aa);
draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x0, _y0, ss, ss, fr, 1); draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x0, _y0, ss, ss, fr, 1);
var _x1 = _x0 + ss + ui(32); var _x1 = _x0 + ss + ui(32);
@ -109,7 +124,7 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
if(buttonInstant(THEME.button_hide, bx, by, ui(32), ui(32), _m, _focus, _hover,, THEME.color_wheel,, c_white) == 2) { if(buttonInstant(THEME.button_hide, bx, by, ui(32), ui(32), _m, _focus, _hover,, THEME.color_wheel,, c_white) == 2) {
var pick = instance_create(mouse_mx, mouse_my, o_dialog_color_quick_pick); var pick = instance_create(mouse_mx, mouse_my, o_dialog_color_quick_pick);
pick.onApply = setColor; pick.onApply = setColor;
selecting_index = i; palette_select = [ i, i ];
} }
_x2 -= ui(4); _x2 -= ui(4);
@ -117,21 +132,48 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
var _xw = _x2 - _x1; var _xw = _x2 - _x1;
draw_sprite_ext(THEME.arrow, 0, (_x0 + ss + _x1) / 2, _y0 + ss / 2, 1, 1, 0, c_white, 0.5); draw_sprite_ext(THEME.arrow, 0, (_x0 + ss + _x1) / 2, _y0 + ss / 2, 1, 1, 0, c_white, 0.5);
draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x1, _y0, _xw, ss, to, 1); draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x1, _y0, _xw, ss, to, 1);
if(_hover && point_in_rectangle(_m[0], _m[1], _x1, _y0, _x1 + _xw, _y0 + ss)) { if(_hover && point_in_rectangle(_m[0], _m[1], _x1, _y0, _x1 + _xw, _y0 + ss)) {
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 1); if(!palette_selecting)
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, c_white, 1);
if(mouse_press(mb_left, _focus)) { if(!palette_selecting && mouse_press(mb_left, _focus)) {
var dialog = dialogCall(o_dialog_color_selector, WIN_W / 2, WIN_H / 2); palette_selecting = true;
dialog.setDefault(to); palette_select[0] = i;
dialog.selector.onApply = setColor;
dialog.onApply = setColor;
selecting_index = i;
} }
if(palette_selecting)
palette_select[1] = i;
} else } else
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 0.5); draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 0.5);
if(i == min(palette_select[0], palette_select[1])) {
_sel_x0 = _x1;
_sel_y0 = _y0;
}
if(i == max(palette_select[0], palette_select[1])) {
_sel_x1 = _x1 + _xw;
_sel_y1 = _y0 + ss;
}
}
if(palette_selecting) {
var _mn = min(palette_select[0], palette_select[1]);
var _mx = max(palette_select[0], palette_select[1]);
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _sel_x0, _sel_y0, _sel_x1 - _sel_x0, _sel_y1 - _sel_y0, c_white, 1);
if(mouse_release(mb_left, _focus)) {
palette_selecting = false;
palette_select = [ _mn, _mx ];
var dialog = dialogCall(o_dialog_color_selector, WIN_W / 2, WIN_H / 2);
dialog.setDefault(_to[palette_select[0]]);
dialog.selector.onApply = setColor;
dialog.onApply = setColor;
}
} }
return hh; return hh;

View file

@ -1,4 +1,4 @@
// 2024-04-25 15:06:02 // 2024-04-25 15:59:49
function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _group) constructor { function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _group) constructor {
name = "Replace Colors"; name = "Replace Colors";
@ -23,11 +23,14 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
__init_mask_modifier(4); // inputs 7, 8, __init_mask_modifier(4); // inputs 7, 8,
selecting_index = 0; palette_selecting = false;
palette_select = [ -1, -1 ];
function setColor(colr) { #region function setColor(colr) { #region
var _to = array_clone(getInputData(2)); var _to = array_clone(getInputData(2));
_to[selecting_index] = colr;
for (var i = palette_select[0]; i <= palette_select[1]; i++)
_to[i] = colr;
inputs[| 2].setValue(_to); // Not necessary due to array reference inputs[| 2].setValue(_to); // Not necessary due to array reference
} #endregion } #endregion
@ -79,6 +82,15 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
draw_sprite_stretched_ext(THEME.ui_panel_bg, 1, _x, _yy, _w, hh - top, COLORS.node_composite_bg_blend, 1); draw_sprite_stretched_ext(THEME.ui_panel_bg, 1, _x, _yy, _w, hh - top, COLORS.node_composite_bg_blend, 1);
var _selecting_y = 0;
var _selecting_h = 0;
var _sample = PANEL_PREVIEW.sample_color;
var _sel_x0 = 0;
var _sel_x1 = 0;
var _sel_y0 = 0;
var _sel_y1 = 0;
for( var i = 0; i < amo; i++ ) { for( var i = 0; i < amo; i++ ) {
var fr = array_safe_get_fast(_from, i); var fr = array_safe_get_fast(_from, i);
var to = array_safe_get_fast(_to, i); var to = array_safe_get_fast(_to, i);
@ -86,7 +98,10 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
var _x0 = _x + ui(8); var _x0 = _x + ui(8);
var _y0 = _yy + ui(8) + i * (ss + ui(8)); var _y0 = _yy + ui(8) + i * (ss + ui(8));
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x0, _y0, ss, ss, COLORS._main_icon, 0.5); var _cc = _sample == fr? c_white : COLORS._main_icon;
var _aa = 0.5 + (_sample == fr) * 0.5;
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x0, _y0, ss, ss, _cc, _aa);
draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x0, _y0, ss, ss, fr, 1); draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x0, _y0, ss, ss, fr, 1);
var _x1 = _x0 + ss + ui(32); var _x1 = _x0 + ss + ui(32);
@ -109,7 +124,7 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
if(buttonInstant(THEME.button_hide, bx, by, ui(32), ui(32), _m, _focus, _hover,, THEME.color_wheel,, c_white) == 2) { if(buttonInstant(THEME.button_hide, bx, by, ui(32), ui(32), _m, _focus, _hover,, THEME.color_wheel,, c_white) == 2) {
var pick = instance_create(mouse_mx, mouse_my, o_dialog_color_quick_pick); var pick = instance_create(mouse_mx, mouse_my, o_dialog_color_quick_pick);
pick.onApply = setColor; pick.onApply = setColor;
selecting_index = i; palette_select = [ i, i ];
} }
_x2 -= ui(4); _x2 -= ui(4);
@ -117,21 +132,48 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
var _xw = _x2 - _x1; var _xw = _x2 - _x1;
draw_sprite_ext(THEME.arrow, 0, (_x0 + ss + _x1) / 2, _y0 + ss / 2, 1, 1, 0, c_white, 0.5); draw_sprite_ext(THEME.arrow, 0, (_x0 + ss + _x1) / 2, _y0 + ss / 2, 1, 1, 0, c_white, 0.5);
draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x1, _y0, _xw, ss, to, 1); draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x1, _y0, _xw, ss, to, 1);
if(_hover && point_in_rectangle(_m[0], _m[1], _x1, _y0, _x1 + _xw, _y0 + ss)) { if(_hover && point_in_rectangle(_m[0], _m[1], _x1, _y0, _x1 + _xw, _y0 + ss)) {
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 1); if(!palette_selecting)
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, c_white, 1);
if(mouse_press(mb_left, _focus)) { if(!palette_selecting && mouse_press(mb_left, _focus)) {
var dialog = dialogCall(o_dialog_color_selector, WIN_W / 2, WIN_H / 2); palette_selecting = true;
dialog.setDefault(to); palette_select[0] = i;
dialog.selector.onApply = setColor;
dialog.onApply = setColor;
selecting_index = i;
} }
if(palette_selecting)
palette_select[1] = i;
} else } else
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 0.5); draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 0.5);
if(i == min(palette_select[0], palette_select[1])) {
_sel_x0 = _x1;
_sel_y0 = _y0;
}
if(i == max(palette_select[0], palette_select[1])) {
_sel_x1 = _x1 + _xw;
_sel_y1 = _y0 + ss;
}
}
if(palette_selecting) {
var _mn = min(palette_select[0], palette_select[1]);
var _mx = max(palette_select[0], palette_select[1]);
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _sel_x0, _sel_y0, _sel_x1 - _sel_x0, _sel_y1 - _sel_y0, c_white, 1);
if(mouse_release(mb_left, _focus)) {
palette_selecting = false;
palette_select = [ _mn, _mx ];
var dialog = dialogCall(o_dialog_color_selector, WIN_W / 2, WIN_H / 2);
dialog.setDefault(_to[palette_select[0]]);
dialog.selector.onApply = setColor;
dialog.onApply = setColor;
}
} }
return hh; return hh;

View file

@ -1,4 +1,4 @@
// 2024-04-22 18:45:51 // 2024-04-25 15:21:26
#region funtion calls #region funtion calls
function __fnInit_Preview() { function __fnInit_Preview() {
__registerFunction("preview_focus_content", panel_preview_focus_content); __registerFunction("preview_focus_content", panel_preview_focus_content);

View file

@ -1,4 +1,4 @@
// 2024-04-22 18:45:50 // 2024-04-22 18:45:51
#region funtion calls #region funtion calls
function __fnInit_Preview() { function __fnInit_Preview() {
__registerFunction("preview_focus_content", panel_preview_focus_content); __registerFunction("preview_focus_content", panel_preview_focus_content);

View file

@ -22,11 +22,14 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
__init_mask_modifier(4); // inputs 7, 8, __init_mask_modifier(4); // inputs 7, 8,
selecting_index = 0; palette_selecting = false;
palette_select = [ -1, -1 ];
function setColor(colr) { #region function setColor(colr) { #region
var _to = array_clone(getInputData(2)); var _to = array_clone(getInputData(2));
_to[selecting_index] = colr;
for (var i = palette_select[0]; i <= palette_select[1]; i++)
_to[i] = colr;
inputs[| 2].setValue(_to); // Not necessary due to array reference inputs[| 2].setValue(_to); // Not necessary due to array reference
} #endregion } #endregion
@ -78,6 +81,15 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
draw_sprite_stretched_ext(THEME.ui_panel_bg, 1, _x, _yy, _w, hh - top, COLORS.node_composite_bg_blend, 1); draw_sprite_stretched_ext(THEME.ui_panel_bg, 1, _x, _yy, _w, hh - top, COLORS.node_composite_bg_blend, 1);
var _selecting_y = 0;
var _selecting_h = 0;
var _sample = PANEL_PREVIEW.sample_color;
var _sel_x0 = 0;
var _sel_x1 = 0;
var _sel_y0 = 0;
var _sel_y1 = 0;
for( var i = 0; i < amo; i++ ) { for( var i = 0; i < amo; i++ ) {
var fr = array_safe_get_fast(_from, i); var fr = array_safe_get_fast(_from, i);
var to = array_safe_get_fast(_to, i); var to = array_safe_get_fast(_to, i);
@ -85,7 +97,10 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
var _x0 = _x + ui(8); var _x0 = _x + ui(8);
var _y0 = _yy + ui(8) + i * (ss + ui(8)); var _y0 = _yy + ui(8) + i * (ss + ui(8));
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x0, _y0, ss, ss, COLORS._main_icon, 0.5); var _cc = _sample == fr? c_white : COLORS._main_icon;
var _aa = 0.5 + (_sample == fr) * 0.5;
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x0, _y0, ss, ss, _cc, _aa);
draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x0, _y0, ss, ss, fr, 1); draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x0, _y0, ss, ss, fr, 1);
var _x1 = _x0 + ss + ui(32); var _x1 = _x0 + ss + ui(32);
@ -108,7 +123,7 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
if(buttonInstant(THEME.button_hide, bx, by, ui(32), ui(32), _m, _focus, _hover,, THEME.color_wheel,, c_white) == 2) { if(buttonInstant(THEME.button_hide, bx, by, ui(32), ui(32), _m, _focus, _hover,, THEME.color_wheel,, c_white) == 2) {
var pick = instance_create(mouse_mx, mouse_my, o_dialog_color_quick_pick); var pick = instance_create(mouse_mx, mouse_my, o_dialog_color_quick_pick);
pick.onApply = setColor; pick.onApply = setColor;
selecting_index = i; palette_select = [ i, i ];
} }
_x2 -= ui(4); _x2 -= ui(4);
@ -116,21 +131,48 @@ function Node_Colors_Replace(_x, _y, _group = noone) : Node_Processor(_x, _y, _g
var _xw = _x2 - _x1; var _xw = _x2 - _x1;
draw_sprite_ext(THEME.arrow, 0, (_x0 + ss + _x1) / 2, _y0 + ss / 2, 1, 1, 0, c_white, 0.5); draw_sprite_ext(THEME.arrow, 0, (_x0 + ss + _x1) / 2, _y0 + ss / 2, 1, 1, 0, c_white, 0.5);
draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x1, _y0, _xw, ss, to, 1); draw_sprite_stretched_ext(THEME.color_picker_box, 1, _x1, _y0, _xw, ss, to, 1);
if(_hover && point_in_rectangle(_m[0], _m[1], _x1, _y0, _x1 + _xw, _y0 + ss)) { if(_hover && point_in_rectangle(_m[0], _m[1], _x1, _y0, _x1 + _xw, _y0 + ss)) {
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 1); if(!palette_selecting)
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, c_white, 1);
if(mouse_press(mb_left, _focus)) { if(!palette_selecting && mouse_press(mb_left, _focus)) {
var dialog = dialogCall(o_dialog_color_selector, WIN_W / 2, WIN_H / 2); palette_selecting = true;
dialog.setDefault(to); palette_select[0] = i;
dialog.selector.onApply = setColor;
dialog.onApply = setColor;
selecting_index = i;
} }
if(palette_selecting)
palette_select[1] = i;
} else } else
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 0.5); draw_sprite_stretched_ext(THEME.color_picker_box, 0, _x1, _y0, _xw, ss, COLORS._main_icon, 0.5);
if(i == min(palette_select[0], palette_select[1])) {
_sel_x0 = _x1;
_sel_y0 = _y0;
}
if(i == max(palette_select[0], palette_select[1])) {
_sel_x1 = _x1 + _xw;
_sel_y1 = _y0 + ss;
}
}
if(palette_selecting) {
var _mn = min(palette_select[0], palette_select[1]);
var _mx = max(palette_select[0], palette_select[1]);
draw_sprite_stretched_ext(THEME.color_picker_box, 0, _sel_x0, _sel_y0, _sel_x1 - _sel_x0, _sel_y1 - _sel_y0, c_white, 1);
if(mouse_release(mb_left, _focus)) {
palette_selecting = false;
palette_select = [ _mn, _mx ];
var dialog = dialogCall(o_dialog_color_selector, WIN_W / 2, WIN_H / 2);
dialog.setDefault(_to[palette_select[0]]);
dialog.selector.onApply = setColor;
dialog.onApply = setColor;
}
} }
return hh; return hh;