added another demo ui

TODO

@@ -20,7 +20,7 @@ to maintain focus until mouse release (fix scroll bars)
 [x] The id combination in gen_id() uses an intger division, which is costly, use another combination 
     function that is non-linear and doesn't use division
 [ ] Animations, somehow
-[ ] Maybe cache codepoint converted strings
+[x] Maybe cache codepoint converted strings
 [x] Fix scroll wheel when div is scrolled
 [ ] Be consistent with the initialization methods some are foo.new() and some are foo.init()
 [ ] Implement image loading (.bmp, .ff, .qoi and .png), in the future even lossy images like .jpg
@@ -44,7 +44,7 @@ to maintain focus until mouse release (fix scroll bars)
 [x] Fix how padding is applied in push_rect. In CSS padding is applied between the border and the
     content, the background color is applied starting from the border. Right now push_rect() offsets
     the background rect by both border and padding
-
+[ ] Investigate why the debug pointer (cyan rectangle) disappears... 
 
 ## Layout
 
@@ -55,6 +55,13 @@ to maintain focus until mouse release (fix scroll bars)
 [ ] Correct whitespace handling in text (\t \r etc)
 [ ] Consider a multi-pass recursive approach to layout (like https://github.com/nicbarker/clay)
     instead of the curren multi-frame approach.
+[ ] Implement column/row sizing (min, max)
+[ ] Find a way to concile pixel measurements to the mm ones used in css, for example in min/max sizing
+    of elements
+[ ] Center elements to div (center children_bounds to the center of the div bounds and shift the origin accordingly)
+[ ] Use containing_rect() in position_element() to skip some computing and semplify the function
+[ ] Rename position_element() to layout_element()
+[ ] Make functions to mark rows/columns as full, to fix the calculator demo
 
 ## Input
 
@@ -75,6 +82,7 @@ to maintain focus until mouse release (fix scroll bars)
 [ ] New window command, useful for popups
 [x] Text command returns the text bounds, this way we can avoid the pattern 
     draw_text(a, pos) -> off = compute_bounds(a) -> draw_text(b, pos+off) -> ...
+[ ] Rounded rectangle with different radius for each corner
 
 ## Atlas
 

resources/style.css

@@ -4,12 +4,13 @@ default {
 	primary: #cc241dff;
 	secondary: #458588ff;
 	accent: #fabd2fff;
+	border: 1;
 }
 
 button {
-	margin: 2 2 2 2;
+	margin: 2;
-	border: 2 2 2 2;
+	border: 2;
-	padding: 2 2 2 2;
+	padding: 2;
 	radius: 10;
 	size: 32;
 
@@ -21,9 +22,9 @@ button {
 }
 
 checkbox {
-	margin: 2 2 2 2;
+	margin: 2;
-	border: 2 2 2 2;
+	border: 2;
-	padding: 1 1 1 1;
+	padding: 1;
 	radius: 10;
 	size: 16;
 	bg: #3c3836ff;
@@ -34,9 +35,9 @@ checkbox {
 }
 
 toggle {
-	margin: 2 2 2 2;
+	margin: 2;
-	border: 2 2 2 2;
+	border: 2;
-	padding: 1 1 1 1;
+	padding: 1;
 	radius: 10;
 	size: 16;
 	bg: #3c3836ff;
@@ -47,9 +48,9 @@ toggle {
 }
 
 slider {
-	margin: 2 2 2 2;
+	margin: 2;
-	padding: 2 2 2 2;
+	padding: 2;
-	border: 1 1 1 1;
+	border: 1;
 	radius: 4;
 	size: 8;
 	bg: #3c3836ff;

src/main.c3

@@ -119,7 +119,6 @@ fn int main(String[] args)
 
 	isz frame;
 	double fps;
-	bool toggle = true;
 	time::Clock clock;
 	time::Clock fps_clock;
 	time::Clock sleep_clock;
@@ -199,6 +198,60 @@ fn int main(String[] args)
 
 		if (ui.check_key_combo(ugui::KMOD_CTRL, "q")) quit = true;
 
+const String APPLICATION = "calculator";
+$if APPLICATION == "debug":
+		debug_app(&ui);
+$endif
+$if APPLICATION == "calculator":
+		calculator(&ui);
+$endif
+
+		// Timings counter
+		TimeStats dts = draw_times.get_stats();
+		TimeStats uts = ui_times.get_stats();
+
+		ui.layout_set_floating()!!;
+		// FIXME: I cannot anchor shit to the bottom of the screen
+		ui.div_begin({0, ui.height-150, -300, 150})!!;
+		{
+			ui.layout_set_column()!!;
+			ui.text_unbounded(string::tformat("frame %d, fps = %.2f", frame, fps))!!;
+			ui.text_unbounded(string::tformat("ui avg: %s\ndraw avg: %s\nTOT: %s", uts.avg, dts.avg, uts.avg+dts.avg))!!;
+			ui.text_unbounded(string::tformat("%s %s", mod.lctrl, (String)ui.input.keyboard.text[:ui.input.keyboard.text_len]))!!;
+		};
+		ui.div_end()!!;
+
+		ui.frame_end()!!;
+		/* End UI Handling */
+		ui_times.push(clock.mark());
+		//ui_times.print_stats();
+
+
+		/* Start UI Drawing */
+		ren.begin_render(true);
+
+		ren.render_ugui(&ui.cmd_queue);
+		
+		ren.end_render();
+
+		draw_times.push(clock.mark());
+		//draw_times.print_stats();
+		/* End Drawing */
+
+		// wait for the next event, timeout after 100ms
+
+		sdl::wait_event_timeout(&e, (int)(100.0-sleep_clock.mark().to_ms()-0.5));
+				
+		fps = 1.0 / fps_clock.mark().to_sec();
+		frame++;
+	}
+
+	return 0;
+}
+
+fn void debug_app(ugui::Ctx* ui)
+{
+	static bool toggle;
 	ui.div_begin({.w=-100})!!;
 	{
 		ui.layout_set_column()!!;
@@ -267,46 +320,40 @@ fn int main(String[] args)
 		ui.slider_hor({0,0,100,30}, &f2)!!;
 	};
 	ui.div_end()!!;
+}
 
-		// Timings counter
+fn void calculator(ugui::Ctx* ui)
-		TimeStats dts = draw_times.get_stats();
-		TimeStats uts = ui_times.get_stats();
-
-		ui.layout_set_floating()!!;
-		// FIXME: I cannot anchor shit to the bottom of the screen
-		ui.div_begin({0, ui.height-150, -300, 150})!!;
 {
-			ui.layout_set_column()!!;
+	ui.div_begin(ugui::DIV_FILL)!!;
-			ui.text_unbounded(string::tformat("frame %d, fps = %.2f", frame, fps))!!;
+
-			ui.text_unbounded(string::tformat("ui avg: %s\ndraw avg: %s\nTOT: %s", uts.avg, dts.avg, uts.avg+dts.avg))!!;
+	ui.layout_set_row()!!;
-			ui.text_unbounded(string::tformat("%s %s", mod.lctrl, (String)ui.input.keyboard.text[:ui.input.keyboard.text_len]))!!;
+	ui.div_begin({0,0,-300,50})!!;
-		};
+	ui.text_unbounded("80085")!!;
 	ui.div_end()!!;
+	ui.layout_next_row()!!;
 	
-		ui.frame_end()!!;
+	ui.button("7")!!;
-		/* End UI Handling */
+	ui.button("8")!!;
-		ui_times.push(clock.mark());
+	ui.button("9")!!;
-		//ui_times.print_stats();
+	ui.layout_next_row()!!;
+	ui.button("4")!!;
+	ui.button("5")!!;
+	ui.button("6")!!;
+	ui.layout_next_row()!!;
+	ui.button("3")!!;
+	ui.button("2")!!;
+	ui.button("1")!!;
+	ui.layout_next_row()!!;
+	ui.button(".")!!;
+	ui.button("0")!!;
+	ui.button("")!!;
 	
+	ui.layout_next_column()!!;
+	ui.layout_set_column()!!;
+	ui.button("+")!!;
+	ui.button("-")!!;
+	ui.button("*")!!;
+	ui.button("/")!!;
 	
-		/* Start UI Drawing */
+	ui.div_end()!!;
-		ren.begin_render(true);
-
-		ren.render_ugui(&ui.cmd_queue);
-		
-		ren.end_render();
-
-		draw_times.push(clock.mark());
-		//draw_times.print_stats();
-		/* End Drawing */
-
-		// wait for the next event, timeout after 100ms
-
-		sdl::wait_event_timeout(&e, (int)(100.0-sleep_clock.mark().to_ms()-0.5));
-				
-		fps = 1.0 / fps_clock.mark().to_sec();
-		frame++;
-	}
-
-	return 0;
 }