totallyRonja/luxe-colorpicker
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

hdr pass

Browse source
This commit is contained in:
Ronja 2021-11-27 17:14:50 +01:00
parent 73da61d329
commit f22580b848
1 changed files with 220 additions and 110 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

330
colorpicker.wren
View file

@ -37,10 +37,21 @@ class ColorPickerData {
allow_hdr:Bool{_allow_hdr}
allow_hdr=(v:Bool){_allow_hdr = v}
toString{"Data - HSV:[%(h), %(s), %(v)] - RGB:[%(r), %(g), %(b)] - A:[%(a)]"}
show_hdr:Bool{_show_hdr && allow_hdr}
show_hdr=(v:Bool){_show_hdr=v}
show_components:String{_show_components}
show_components(v:String){_show_components=v}
debug=(v){_debug=v}
toString{"Data - HSV:[%(h), %(s), %(v)] - RGB:[%(r), %(g), %(b)] - A:[%(a)] "+
"(srgb:%(srgb), hdr:(intensity:%(hdr_multiplier)%(allow_hdr?", allowed":"")%(show_hdr?", shown":"")), "+
"show components:%(show_components))%(_debug?("debug: "+_debug):"")"}
construct new(){
_hdr_mul = 1
_show_components = "rgb"
set_rgba(Color.hex(0xFFAABB))
}
@ -82,6 +93,7 @@ class ColorPickerData {
set_rgba(col: Color){set_rgba(col, srgb, true)}
set_rgba(col: Color, srgb: Bool){set_rgba(col, srgb, true)}
set_rgba(col: Color, srgb: Bool, update_spaces: Bool){
if(col.r > 1 || col.g > 1 || col.b > 1) Fiber.abort(col)
if(srgb) CPHelper.unapply_srgb(col)
if(!CPHelper.approx(_r, col.r)) _r = col.r
@ -126,12 +138,13 @@ class ColorPickerData {
if(!CPHelper.approx(_b, rgb.b)) _b = rgb.b
}
set_rgba_component(index: Num, value: Num){
var current = get_rgba()
set_rgba_component(index: Num, value: Num){set_rgba_component(index, value, srgb)}
set_rgba_component(index: Num, value: Num, srgb: Bool){
var current = get_rgba(srgb, false)
current[index] = value
set_rgba(current)
}
get_rgba_component(index: Num){get_rgba_component(index, srgb, allow_hdr)}
get_rgba_component(index: Num){get_rgba_component(index, srgb, false)}
get_rgba_component(index: Num, srgb: Bool){get_rgba_component(index, srgb, false)}
get_rgba_component(index: Num, srgb: Bool, hdr: Bool){
return get_rgba(srgb, hdr)[index]
@ -203,6 +216,9 @@ class ColorPicker{
UIButton.set_text(hsva_button, "hsv")
Control.child_add(component_choice, hsva_button)
var srgb_switch = CPHelper.colorspace_choice(ui, color_view)
Control.child_add(component_choice, srgb_switch)
var rgba_components = CPHelper.rgba_values(ui, color_view)
Control.child_add(color_view, rgba_components)
@ -227,6 +243,9 @@ class ColorPicker{
var hex_field = CPHelper.hex_input(ui, color_view)
Control.child_add(color_view, hex_field)
var hdr_settings = CPHelper.hdr_settings(ui, color_view)
Control.child_add(color_view, hdr_settings)
var bottom_offset = Control.create(ui)
Control.set_size(bottom_offset, 0, 8)
Control.set_behave(bottom_offset, UIBehave.left)
@ -238,6 +257,158 @@ class ColorPicker{
#hidden
class CPHelper{
static hdr_settings(ui: UI, data_control: Control){
var data: ColorPickerData = Control.get_state_data(data_control)
var root = Control.create(ui)
Control.set_behave(root, UIBehave.left | UIBehave.hfill)
Control.set_contain(root, UIContain.column | UIContain.vfit)
var hdr_header = Control.create(ui)
Control.set_contain(hdr_header, UIContain.start | UIContain.row | UIContain.vfit)
Control.set_behave(hdr_header, UIBehave.left | UIBehave.hfill)
Control.child_add(root, hdr_header)
var hdr_label = UILabel.create(ui)
UILabel.set_text(hdr_label, "HDR: ")
UILabel.set_text_size(hdr_label, 14)
UILabel.set_align_vertical(hdr_label, TextAlign.center)
Control.set_margin(hdr_label, 8, 8, 0, 0)
Control.set_behave(hdr_label, UIBehave.left | UIBehave.top)
Control.set_size(hdr_label, 32, 20)
Control.child_add(hdr_header, hdr_label)
var hdr_toggle = UICheck.create(ui) //this should probably be a proper vertical swoopline
Control.set_margin(hdr_toggle, 8, 4, 0, 0)
Control.set_size(hdr_toggle, 32, 20)
Control.set_behave(hdr_toggle, UIBehave.left)
Control.child_add(hdr_header, hdr_toggle)
Control.set_events(hdr_toggle){ |event|
if(event.type == UIEvent.change){
if(data.show_hdr == event.change) return
data.show_hdr = event.change
data.debug = "hdr toggle"
UI.events_emit(data_control, UIEvent.change, data)
}
}
var hdr_intensity = Control.create(ui)
Control.set_margin(hdr_intensity, 0, 8, 0, 0)
Control.set_contain(hdr_intensity, UIContain.start | UIContain.row | UIContain.vfit)
Control.set_behave(hdr_intensity, UIBehave.left | UIBehave.hfill)
Control.child_add(root, hdr_intensity)
var hdr_mult_label = UILabel.create(ui)
UILabel.set_text(hdr_mult_label, "Intensity:")
//UILabel.set_text_size(hdr_mult_label, 12)
UILabel.set_color(hdr_mult_label, [0.8, 0.8, 0.8, 1])
Control.set_margin(hdr_mult_label, 8, 0, 0, 0)
Control.set_size(hdr_mult_label, 64, 32)
Control.set_behave(hdr_mult_label, UIBehave.left | UIBehave.top)
Control.child_add(hdr_intensity, hdr_mult_label)
var hdr_intensity_number = UINumber.create(ui)
UINumber.set_value(hdr_intensity_number, 1)
UINumber.set_validation(hdr_intensity_number) { |input: Num|
return input.max(0)
}
Control.set_size(hdr_intensity_number, 64, 32)
Control.set_margin(hdr_intensity_number, 8, 0, 0, 0)
Control.set_behave(hdr_intensity_number, UIBehave.left | UIBehave.top)
Control.child_add(hdr_intensity, hdr_intensity_number)
Control.set_events(hdr_intensity_number){|event|
if(event.type == UIEvent.change){
if(approx(data.hdr_multiplier, event.change)) return
data.hdr_multiplier = event.change
data.debug = "hdr intensity input"
UI.events_emit(data_control, UIEvent.change, data)
}
}
Control.set_events(data_control){|event|
if(event.type == UIEvent.change){
System.print(event.change)
UINumber.set_value(hdr_intensity_number, data.hdr_multiplier)
}
}
var hdr_numbers = Control.create(ui)
Control.set_margin(hdr_numbers, 0, 0, 0, 0)
Control.set_contain(hdr_numbers, UIContain.start | UIContain.row | UIContain.vfit)
Control.set_behave(hdr_numbers, UIBehave.left | UIBehave.hfill)
Control.child_add(root, hdr_numbers)
var hdr_number_display = UILabel.create(ui)
UILabel.set_text(hdr_number_display, "[%(Str.fixed(data.r, 3)), %(Str.fixed(data.g, 3)), %(Str.fixed(data.b, 3)), %(Str.fixed(data.a, 3))]")
UILabel.set_color(hdr_number_display, Color.hex(0x808080))
Control.set_size(hdr_number_display, 180, 32)
Control.set_margin(hdr_number_display, 8, 0, 0, 0)
Control.set_behave(hdr_number_display, UIBehave.left | UIBehave.hfill)
Control.child_add(hdr_numbers, hdr_number_display)
Control.set_events(data_control){ |event|
if(event.type == UIEvent.change){
var hdr = data.color_hdr
UILabel.set_text(hdr_number_display, "[%(Str.fixed(hdr.r, 3)), %(Str.fixed(hdr.g, 3)), %(Str.fixed(hdr.b, 3)), %(Str.fixed(hdr.a, 3))]")
}
}
var maximize_ldr_button = UIButton.create(ui)
UIButton.set_text(maximize_ldr_button, "maximize LDR")
UIButton.set_text_size(maximize_ldr_button, 12)
Control.set_size(maximize_ldr_button, 80, 24)
Control.set_behave(maximize_ldr_button, UIBehave.left | UIBehave.top)
Control.set_margin(maximize_ldr_button, 8, 4, 8, 0)
Control.child_add(hdr_numbers, maximize_ldr_button)
Control.set_events(maximize_ldr_button) {|event|
if(event.type == UIEvent.press){
if(data.v < 1 && data.v > 0.001){
var multiplier = data.hdr_multiplier.min(1/data.v).max(1)
data.hdr_multiplier = data.hdr_multiplier / multiplier
data.set_hsva_component(2, data.v * multiplier)
data.debug = "hdr maximize ldr"
UI.events_emit(data_control, UIEvent.change, data)
}
}
}
var color_hdr = UIPanel.create(ui)
UIPanel.set_color(color_hdr, data.color_hdr)
UIPanel.set_border(color_hdr, 0, Color.clear)
Control.set_size(color_hdr, 64, 32)
Control.set_margin(color_hdr, 8, 4, 8, 0)
Control.set_behave(color_hdr, UIBehave.left | UIBehave.top)
Control.child_add(root, color_hdr)
Control.set_events(data_control){|event|
if(event.type == UIEvent.change){
var color = data.color_hdr
color.a = 1
UIPanel.set_color(color_hdr, color)
}
}
//todo: color steps and more polish
if(!data.allow_hdr){
Control.set_visible(hdr_header, false)
}
if(!data.show_hdr){
Control.set_visible(hdr_intensity, false)
Control.set_visible(hdr_numbers, false)
Control.set_visible(color_hdr, false)
}
Control.set_events(data_control){ |event|
if(event.type == UIEvent.change){
Control.set_visible(hdr_intensity, data.show_hdr)
Control.set_visible(hdr_numbers, data.show_hdr)
Control.set_visible(color_hdr, data.show_hdr)
Control.set_visible(hdr_header, data.allow_hdr)
}
}
return root
}
static color_display(ui: UI, data_control: Control){
var data: ColorPickerData = Control.get_state_data(data_control)
@ -285,84 +456,43 @@ class CPHelper{
}
}
var hdr_header = UILabel.create(ui)
UILabel.set_text(hdr_header, "HDR:")
UILabel.set_text_size(hdr_header, 14)
Control.set_margin(hdr_header, 8, 8, 0, 0)
Control.set_behave(hdr_header, UIBehave.left | UIBehave.top)
Control.set_size(hdr_header, 64, 32)
Control.child_add(root, hdr_header)
return root
}
var hdr_mult_label = UILabel.create(ui)
UILabel.set_text(hdr_mult_label, "multiplier:")
UILabel.set_text_size(hdr_mult_label, 12)
UILabel.set_color(hdr_mult_label, [0.8, 0.8, 0.8, 1])
Control.set_margin(hdr_mult_label, 8, -10, 0, 0)
Control.set_size(hdr_mult_label, 64, 32)
Control.set_behave(hdr_mult_label, UIBehave.left | UIBehave.top)
Control.child_add(root, hdr_mult_label)
static colorspace_choice(ui, data_control){
var data: ColorPickerData = Control.get_state_data(data_control)
var hdr_number = UINumber.create(ui)
UINumber.set_value(hdr_number, 1)
UINumber.set_validation(hdr_number) { |input: Num|
return input.max(0)
}
Control.set_size(hdr_number, 64, 32)
Control.set_margin(hdr_number, 8, -4, 0, 0)
Control.set_behave(hdr_number, UIBehave.left | UIBehave.top)
Control.child_add(root, hdr_number)
Control.set_events(hdr_number){|event|
var root = Control.create(ui)
Control.set_behave(root, UIBehave.left)
Control.set_contain(root, UIContain.row | UIContain.hfit | UIContain.vfit | UIContain.start)
Control.set_margin(root, 8, 0, 0, 0)
var srgb_label = UILabel.create(ui)
Control.set_size(srgb_label, 36, 32)
UILabel.set_text(srgb_label, "srgb")
Control.set_behave(srgb_label, UIBehave.left)
Control.child_add(root, srgb_label)
var srgb_toggle = UICheck.create(ui)
Control.set_size(srgb_toggle, 32, 20)
Control.set_behave(srgb_toggle, UIBehave.left)
Control.child_add(root, srgb_toggle)
Control.set_events(data_control) {|event|
if(event.type == UIEvent.change){
data.hdr_multiplier = event.change
var data: ColorPickerData = event.change
UICheck.set_state(srgb_toggle, data.srgb)
}
}
Control.set_events(srgb_toggle){ |event|
if(event.type == UIEvent.change){
var input = event.change
data.srgb = input
data.debug = "srgb toggle"
UI.events_emit(data_control, UIEvent.change, data)
}
}
Control.set_events(data_control){|event|
if(event.type == UIEvent.change){
UINumber.set_value(hdr_number, data.hdr_multiplier)
}
}
var color_hdr = UIPanel.create(ui)
UIPanel.set_color(color_hdr, data.color_hdr)
UIPanel.set_border(color_hdr, 0, Color.clear)
Control.set_size(color_hdr, 64, 32)
Control.set_margin(color_hdr, 8, 4, 8, 0)
Control.set_behave(color_hdr, UIBehave.left | UIBehave.top)
Control.child_add(root, color_hdr)
Control.set_events(data_control){|event|
if(event.type == UIEvent.change){
var color = data.color_hdr
color.a = 1
UIPanel.set_color(color_hdr, color)
}
}
var maximize_ldr_button = UIButton.create(ui)
UIButton.set_text(maximize_ldr_button, "maximize LDR")
UIButton.set_text_size(maximize_ldr_button, 12)
Control.set_size(maximize_ldr_button, 80, 24)
Control.set_behave(maximize_ldr_button, UIBehave.left | UIBehave.top)
Control.set_margin(maximize_ldr_button, 0, 4, 8, 0)
Control.child_add(root, maximize_ldr_button)
Control.set_events(maximize_ldr_button) {|event|
if(event.type == UIEvent.press){
if(data.v < 1 && data.v > 0.001){
var multiplier = data.hdr_multiplier.min(1/data.v).max(1)
data.hdr_multiplier = data.hdr_multiplier / multiplier
data.set_hsva_component(2, data.v * multiplier)
UI.events_emit(data_control, UIEvent.change, data)
}
}
}
if(!data.allow_hdr){
Control.set_visible(hdr_header, false)
Control.set_visible(hdr_mult_label, false)
Control.set_visible(hdr_number, false)
Control.set_visible(maximize_ldr_button, false)
Control.set_visible(color_hdr, false)
}
return root
}
@ -402,38 +532,12 @@ class CPHelper{
var color = hex_string_to_color(input)
if(color){
data.set_rgba(color)
data.debug = "hex input"
UI.events_emit(data_control, UIEvent.change, data)
}
}
}
var srgb_label = UILabel.create(ui)
Control.set_size(srgb_label, 36, 32)
UILabel.set_text(srgb_label, "srgb")
Control.set_behave(srgb_label, UIBehave.left)
Control.set_margin(srgb_label, 8, 0, 0, 0)
Control.child_add(root, srgb_label)
var srgb_toggle = UICheck.create(ui)
Control.set_size(srgb_toggle, 32, 20)
Control.set_behave(srgb_toggle, UIBehave.left)
Control.child_add(root, srgb_toggle)
Control.set_events(data_control) {|event|
if(event.type == UIEvent.change){
var data: ColorPickerData = event.change
UICheck.set_state(srgb_toggle, data.srgb)
}
}
Control.set_events(srgb_toggle){ |event|
if(event.type == UIEvent.change){
var input = event.change
data.srgb = input
UI.events_emit(data_control, UIEvent.change, data)
}
}
return root
}
@ -520,6 +624,7 @@ class CPHelper{
Control.set_events(number) { |event: UIEvent|
if(event.type == UIEvent.change){
if(approx(UISlider.get_value(slider), event.change, 0.001)) return
System.print("number display: %(event.change)")
UI.events_emit(base, UIEvent.change, event.change)
}
}
@ -527,6 +632,7 @@ class CPHelper{
Control.set_events(slider) { |event: UIEvent|
if(event.type == UIEvent.change){
if(approx(UINumber.get_value(number), event.change, 0.001)) return
System.print("slider display: %(event.change)")
UI.events_emit(base, UIEvent.change, event.change)
}
}
@ -546,16 +652,18 @@ class CPHelper{
Control.set_events(base) {|event|
if(event.type == UIEvent.change){
var color: ColorPickerData = Control.get_state_data(color_view)
var data: ColorPickerData = Control.get_state_data(color_view)
if(space == "rgb"){
if(approx(event.change, color.get_rgba_component(index))) return
color.set_rgba_component(index, event.change)
if(approx(event.change, data.get_rgba_component(index))) return
if(event.change > 1) Fiber.abort(event)
data.set_rgba_component(index, event.change)
} else if(space == "hsv"){
if(approx(event.change, color.get_hsva_component(index))) return
color.set_hsva_component(index, event.change)
if(approx(event.change, data.get_hsva_component(index))) return
data.set_hsva_component(index, event.change)
}
Control.set_state_data(color_view, color)
UI.events_emit(color_view, UIEvent.change, color)
Control.set_state_data(color_view, data)
data.debug = "component display"
UI.events_emit(color_view, UIEvent.change, data)
}
}
@ -589,6 +697,7 @@ class CPHelper{
var picker_state: ColorPickerData = Control.get_state_data(data_root)
var hsv = [hue, picker_state.s, picker_state.v, picker_state.a]
picker_state.set_hsva(hsv, false)
data.debug = "ring"
UI.events_emit(data_root, UIEvent.change, picker_state)
} else if(state["triangle"] == "captured"){ //if we're editing the triangle (saturation & value)
var picker_state: ColorPickerData = Control.get_state_data(data_root)
@ -614,6 +723,7 @@ class CPHelper{
//calculate and apply relevant values
var hsv = [picker_state.h, saturation, value, picker_state.a]
picker_state.set_hsva(hsv, false)
data.debug = "triangle"
UI.events_emit(data_root, UIEvent.change, picker_state)
} else { //if we're not editing anything, lets check what we're hovering over!
var picker_state: ColorPickerData = Control.get_state_data(data_root)