1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
use uuid::Uuid;
use vek::{Vec3, Vec4};
use crate::ui::{
drawable::Drawable,
event::{UiAction, UiEvent, UiEventKind, UiEventOutcome},
workspace::{UiView, ViewContext},
};
use crate::vm::{Atom, VM};
/// HSV Color Wheel widget for color selection
pub struct ColorWheel {
id: String,
tile_id: Uuid,
render_id: Uuid,
indicator_id: Uuid,
pub rect: [f32; 4], // [x, y, width, height]
current_color: Vec4<f32>, // RGBA
current_hsv: Vec3<f32>, // HSV (hue 0-360, sat 0-1, val 0-1)
original_color: Vec4<f32>, // Color at start of drag (for undo)
radius: f32,
dragging: bool,
active_pointer: Option<u32>,
}
impl ColorWheel {
/// Create a new color wheel with the given rect and initial color
pub fn new(rect: [f32; 4], initial_color: Vec4<f32>) -> Self {
let size = rect[2].min(rect[3]);
let radius = size / 2.0;
let hsv = rgb_to_hsv(initial_color);
Self {
id: String::new(),
tile_id: Uuid::new_v4(),
render_id: Uuid::new_v4(),
indicator_id: Uuid::new_v4(),
rect,
current_color: initial_color,
current_hsv: hsv,
original_color: initial_color,
radius,
dragging: false,
active_pointer: None,
}
}
/// Set a custom ID for this widget
pub fn with_id(mut self, id: impl Into<String>) -> Self {
self.id = id.into();
self
}
/// Get the current selected color
pub fn color(&self) -> Vec4<f32> {
self.current_color
}
/// Set the color
pub fn set_color(&mut self, color: Vec4<f32>) {
self.current_color = color;
self.current_hsv = rgb_to_hsv(color);
}
/// Set the rectangle
pub fn set_rect(&mut self, rect: [f32; 4]) {
self.rect = rect;
let size = rect[2].min(rect[3]);
self.radius = size / 2.0;
}
/// Ensure the color wheel tile is registered in the atlas
pub fn ensure_tile(&self, vm: &mut VM) {
// Create a 2x1 tile with material data for color wheel
// Color pixels (not used for color wheel, just placeholder)
let color_pixels = vec![0u8, 0, 0, 255, 0, 0, 0, 255];
// Material: texel0.r = widget_type (2=color wheel), texel0.b = 255 (style flag)
let widget_type = 2u8; // 2 = color wheel
let mat_tex0 = [widget_type, 0, 255, 0];
let mat_tex1 = [widget_type, 0, 255, 0];
let mut mat_pixels = Vec::from(mat_tex0);
mat_pixels.extend_from_slice(&mat_tex1);
vm.execute(Atom::AddTile {
id: self.tile_id,
width: 2,
height: 1,
frames: vec![color_pixels],
material_frames: Some(vec![mat_pixels]),
});
vm.execute(Atom::BuildAtlas);
}
/// Get the tile ID for this color wheel
pub fn tile_id(&self) -> Uuid {
self.tile_id
}
/// Get current HSV value component for shader (0-1 range)
pub fn hsv_value(&self) -> f32 {
self.current_hsv.z
}
/// Update the color based on pointer position
fn update_color_from_pos(&mut self, pos: [f32; 2]) -> bool {
let rel_x = (pos[0] - self.rect[0]) / self.rect[2];
let rel_y = (pos[1] - self.rect[1]) / self.rect[3];
let u = rel_x.clamp(0.0, 1.0);
let v = rel_y.clamp(0.0, 1.0);
// Hue across X (mirrored in shader). Y mapping:
// top half ramps saturation 0->1 at full value (white->vivid),
// bottom half keeps sat=1 and ramps value 1->0 (vivid->black).
let hue = (1.0 - u) * 360.0;
let (sat, val) = if v < 0.5 {
let t = v * 2.0;
(t, 1.0)
} else {
let t = (v - 0.5) * 2.0;
(1.0, 1.0 - t)
};
let new_hsv = Vec3::new(hue, sat, val);
let delta = new_hsv - self.current_hsv;
let max_delta = delta.x.abs().max(delta.y.abs()).max(delta.z.abs());
let changed = max_delta > 1e-4;
if changed {
self.current_hsv = new_hsv;
self.current_color = hsv_to_rgb(self.current_hsv);
}
changed
}
fn hit_test(&self, pos: [f32; 2]) -> bool {
pos[0] >= self.rect[0]
&& pos[0] <= self.rect[0] + self.rect[2]
&& pos[1] >= self.rect[1]
&& pos[1] <= self.rect[1] + self.rect[3]
}
}
impl UiView for ColorWheel {
fn build(&mut self, ctx: &mut ViewContext) {
// Create a single quad for the color wheel
// Material texture will contain widget type (2.0 for color wheel)
// The shader will read U.gp0.z for the HSV value
ctx.push(Drawable::Quad {
id: self.render_id,
tile_id: self.tile_id,
rect: self.rect,
uv: [[0.0, 0.0], [1.0, 0.0], [1.0, 1.0], [0.0, 1.0]],
layer: 10,
tint: Vec4::new(1.0, 1.0, 1.0, 1.0),
});
// Draw current color indicator (small circle at selected position)
let indicator_x =
self.rect[0] + (1.0 - (self.current_hsv.x / 360.0).clamp(0.0, 1.0)) * self.rect[2];
// Inverse of the 2-band Y control for indicator placement.
let indicator_y = self.rect[1]
+ if self.current_hsv.z < 1.0 - 1e-4 {
// Bottom half: val ramps down 1->0
(0.5 + (1.0 - self.current_hsv.z).clamp(0.0, 1.0) * 0.5) * self.rect[3]
} else {
// Top half: sat ramps up 0->1
(self.current_hsv.y.clamp(0.0, 1.0) * 0.5) * self.rect[3]
};
let indicator_size = 12.0;
ctx.push(Drawable::Rect {
id: self.indicator_id,
rect: [
indicator_x - indicator_size / 2.0,
indicator_y - indicator_size / 2.0,
indicator_size,
indicator_size,
],
fill: Vec4::new(1.0, 1.0, 1.0, 1.0),
border: Vec4::new(0.0, 0.0, 0.0, 1.0),
border_px: 2.0,
radius_px: indicator_size / 2.0,
layer: 11,
});
}
fn handle_event(&mut self, event: &UiEvent) -> UiEventOutcome {
match event.kind {
UiEventKind::PointerDown => {
if self.hit_test(event.pos) {
self.dragging = true;
self.active_pointer = Some(event.pointer_id);
// Store original color for undo
self.original_color = self.current_color;
if self.update_color_from_pos(event.pos) {
return UiEventOutcome::with_action(UiAction::ColorChanged(
self.id.clone(),
[
self.current_color.x,
self.current_color.y,
self.current_color.z,
self.current_color.w,
],
[
self.original_color.x,
self.original_color.y,
self.original_color.z,
self.original_color.w,
],
false, // Not final (drag started)
));
}
return UiEventOutcome::dirty(); // Consume event even if color didn't change
}
}
UiEventKind::PointerMove => {
if self.dragging && self.active_pointer == Some(event.pointer_id) {
if self.update_color_from_pos(event.pos) {
return UiEventOutcome::with_action(UiAction::ColorChanged(
self.id.clone(),
[
self.current_color.x,
self.current_color.y,
self.current_color.z,
self.current_color.w,
],
[
self.original_color.x,
self.original_color.y,
self.original_color.z,
self.original_color.w,
],
false, // Not final (dragging)
));
}
return UiEventOutcome::dirty(); // Consume event even if color didn't change
}
}
UiEventKind::PointerUp => {
if self.active_pointer == Some(event.pointer_id) {
self.dragging = false;
self.active_pointer = None;
// Send final ColorChanged event on mouse up
return UiEventOutcome::with_action(UiAction::ColorChanged(
self.id.clone(),
[
self.current_color.x,
self.current_color.y,
self.current_color.z,
self.current_color.w,
],
[
self.original_color.x,
self.original_color.y,
self.original_color.z,
self.original_color.w,
],
true, // Final (mouse released)
));
}
}
_ => {}
}
UiEventOutcome::none()
}
fn as_any_mut(&mut self) -> &mut dyn std::any::Any {
self
}
fn as_any(&self) -> &dyn std::any::Any {
self
}
fn view_id(&self) -> &str {
&self.id
}
}
// HSV to RGB conversion
fn hsv_to_rgb(hsv: Vec3<f32>) -> Vec4<f32> {
let h = hsv.x / 60.0;
let s = hsv.y;
let v = hsv.z;
let c = v * s;
let x = c * (1.0 - ((h % 2.0) - 1.0).abs());
let m = v - c;
let (r, g, b) = if h < 1.0 {
(c, x, 0.0)
} else if h < 2.0 {
(x, c, 0.0)
} else if h < 3.0 {
(0.0, c, x)
} else if h < 4.0 {
(0.0, x, c)
} else if h < 5.0 {
(x, 0.0, c)
} else {
(c, 0.0, x)
};
Vec4::new(r + m, g + m, b + m, 1.0)
}
// RGB to HSV conversion
fn rgb_to_hsv(rgb: Vec4<f32>) -> Vec3<f32> {
let r = rgb.x;
let g = rgb.y;
let b = rgb.z;
let max = r.max(g).max(b);
let min = r.min(g).min(b);
let delta = max - min;
let hue = if delta == 0.0 {
0.0
} else if max == r {
60.0 * (((g - b) / delta) % 6.0)
} else if max == g {
60.0 * (((b - r) / delta) + 2.0)
} else {
60.0 * (((r - g) / delta) + 4.0)
};
let hue = if hue < 0.0 { hue + 360.0 } else { hue };
let saturation = if max == 0.0 { 0.0 } else { delta / max };
let value = max;
Vec3::new(hue, saturation, value)
}