[update] slider working but needs some geometry-repairs

Author: mrsrina

include/ekg/ui/slider/slider.hpp

@@ -63,7 +63,7 @@ namespace ekg {
       ekg::value<char[8]> min {};
       ekg::value<char[8]> max {};
       ekg::flags_t dock {ekg::dock::left};
-      ekg::flags_t dock_text {ekg::dock::center};
+      ekg::flags_t dock_text {ekg::dock::right};
       ekg::font font_size {ekg::font::medium};
       ekg::at_array_t<ekg::layer, ekg::enum_layer_size> layers {};
       ekg::at_array_t<ekg::action, ekg::enum_action_size> actions {};

include/ekg/ui/slider/widget.hpp

@@ -69,6 +69,53 @@ namespace ekg::ui {
   ekg_ui_slider_range_task_impl(ekg_ui_slider_range, ekg::ui::u8, uint8_t, todo);
 
 namespace ekg::ui {
+  template<typename t>
+  void calculate_value_by_factor(
+    ekg::slider_t::range_t &range,
+    ekg::vec2_t<float> &factor,
+    const ekg::axis &axis,
+    t &min, t &max, t &value
+  ) {
+    value = ekg::clamp<t>(value, min, max);
+    switch (axis) {
+    case ekg::axis::horizontal:
+      if (static_cast<ekg::pixel_t>(factor.x) == 0) {
+        value = min;
+        break;
+      }
+
+      value = (factor.x / range.widget.rect_bar.w) * (max - min) + min;
+      break;
+    case ekg::axis::vertical:
+      if (static_cast<ekg::pixel_t>(factor.y) == 0) {
+        value = min;
+        break;
+      }
+
+      value = (factor.y / range.widget.rect_bar.h) * (max - min) + min;
+      break;
+    }
+  }
+
+  template<typename t>
+  void calculate_bar_progress_by_value(
+    ekg::slider_t::range_t &range,
+    const ekg::axis &axis,
+    t &min, t &max, t &value
+  ) {
+    value = ekg::clamp<t>(value, min, max);
+    switch (axis) {
+    case ekg::axis::horizontal:
+      range.widget.rect_bar_progress.w = range.widget.rect_bar.w * (value - min) / (max - min);
+      range.widget.rect_target.x = range.widget.rect_bar_progress.w - (range.widget.rect_target.w * 0.5f);
+      break;
+    case ekg::axis::vertical:
+      range.widget.rect_bar_progress.h = range.widget.rect_bar.h * (value - min) / (max - min);
+      range.widget.rect_target.y = range.widget.rect_bar_progress.h - (range.widget.rect_target.h * 0.5f);
+      break;
+    }
+  }
+
   void reload(
     ekg::property_t &property,
     ekg::slider_t &slider

src/handler/theme/handler.cpp

@@ -67,9 +67,10 @@ void ekg::handler::theme::init() {
 
   light_pinky_theme.slider_color_scheme.outline = {204, 204, 204, 0};
   light_pinky_theme.slider_color_scheme.background = {204, 204, 204, 30};
-  light_pinky_theme.slider_color_scheme.bar_background = {245, 169, 184, 100};
+  light_pinky_theme.slider_color_scheme.bar_background = {204, 204, 204, 50};
   light_pinky_theme.slider_color_scheme.bar_highlight = {245, 169, 184, 50};
   light_pinky_theme.slider_color_scheme.bar_active = {245, 169, 184, 100};
+  light_pinky_theme.slider_color_scheme.text_foreground = {141, 141, 141, 255};
 
   this->registry(light_pinky_theme.tag) = light_pinky_theme;
   this->set_current_theme(light_pinky_theme.tag);
@@ -114,9 +115,10 @@ void ekg::handler::theme::init() {
 
   black_light_pinky_theme.slider_color_scheme.background = {204, 204, 204, 50};
   black_light_pinky_theme.slider_color_scheme.outline = {204, 204, 204, 0};
-  black_light_pinky_theme.slider_color_scheme.bar_background = {245, 169, 184, 100};
+  black_light_pinky_theme.slider_color_scheme.bar_background = {204, 204, 204, 50};
   black_light_pinky_theme.slider_color_scheme.bar_highlight = {245, 169, 184, 50};
   black_light_pinky_theme.slider_color_scheme.bar_active = {245, 169, 184, 100};
+  black_light_pinky_theme.slider_color_scheme.text_foreground = {141, 141, 141, 255};
 
   this->registry(black_light_pinky_theme.tag) = black_light_pinky_theme;
   //this->set_current_theme(black_light_pinky_theme.tag);

src/ui/slider/widget.cpp

@@ -37,7 +37,7 @@ void ekg::ui::reload(
   ekg::slider_t &slider
 ) {
   constexpr ekg::pixel_t min_bar_width_factor {ekg::one_pixel * 4};
-  ekg::pixel_t min_bar_width {slider.rect.w / min_bar_width};
+  ekg::pixel_t min_bar_width {slider.rect.w / min_bar_width_factor};
 
   ekg::theme_t &global_theme {ekg::p_core->handler_theme.get_current_theme()};
   ekg::aligned_t aligned_dimension {};
@@ -180,7 +180,75 @@ void ekg::ui::event(
   ekg::slider_t &slider,
   const ekg::io::stage &stage
 ) {
+  switch (stage) {
+    case ekg::io::stage::process: {
+      ekg::input_info_t &input {ekg::p_core->handler_input.input};
+      if (!input.was_pressed && !input.was_released && !input.has_motion) {
+        break;
+      }
+
+      ekg::vec2_t<float> interact {static_cast<ekg::vec2_t<float>>(input.interact)};
+      ekg::rect_t<float> &rect_abs {ekg::ui::get_abs_rect(property, slider.rect)};
+
+      if (property.states.is_hovering || property.states.is_active) {
+        property.states.is_active = false;
+        ekg::rect_t<float> bar {};
+
+        for (ekg::slider_t::range_t &range : slider.ranges) {
+          bar = range.widget.rect_bar + rect_abs;
+          range.widget.states.is_hovering = ekg::rect_collide_vec2<float>(bar, interact);
+
+          if (input.was_pressed && range.widget.states.is_hovering) {
+            ekg_action(
+              range.actions,
+              ekg::action::press,
+              (range.widget.states.is_active = true)
+            );
+          }
+
+          if (input.was_released && range.widget.states.is_active) {
+            ekg_action(
+              range.actions,
+              ekg::action::release,
+              (range.widget.states.is_active = false)
+            );
+          }
+
+          if (range.widget.states.is_active) {
+            ekg::vec2_t<float> factor {
+              ekg::max<float>(interact.x - bar.x, 0.0f),
+              ekg::max<float>(interact.y - bar.y, 0.0f)
+            };
+
+            ekg_ui_slider_range_task(
+              range,
+              {
+                ekg::ui::calculate_value_by_factor(
+                  range,
+                  factor,
+                  ekg::axis::horizontal,
+                  min, max, value
+                );
+              }
+            );
+
+            property.widget.should_buffering = true;
+            ekg::gui.ui.redraw = true;
+            property.states.is_active = true;
+          }
+        }
+      }
 
+      break;
+    }
+  
+  case ekg::io::stage::pre:
+    ekg::ui::pre_event(property, slider.rect, false);
+    break;
+  case ekg::io::stage::post:
+    ekg::ui::post_event(property);
+    break;
+  }
 }
 
 void ekg::ui::high_frequency(
@@ -231,8 +299,30 @@ void ekg::ui::buffering(
   );
 
   ekg::rect_t<float> bar {};
+  ekg::rect_t<float> bar_progress {};
+
   for (ekg::slider_t::range_t &range : slider.ranges) {
+    range.widget.rect_bar_progress = range.widget.rect_bar;
+
+    ekg_ui_slider_range_task(
+      range,
+      {
+        ekg::ui::calculate_bar_progress_by_value(
+          range,
+          ekg::axis::horizontal,
+          min, max, value
+        );
+
+        ekg::utf8_number_precision(
+          range.widget.text,
+          value,
+          range.precision
+        );
+      }
+    );
+
     bar = range.widget.rect_bar + rect_abs;
+    bar_progress = range.widget.rect_bar_progress + rect_abs;
 
     ekg::draw::rect(
       bar,
@@ -250,14 +340,12 @@ void ekg::ui::buffering(
       );
     }
 
-    if (range.widget.states.is_active) {
-      ekg::draw::rect(
-        bar,
-        slider.color_scheme.bar_active,
-        ekg::draw::mode::fill,
-        range.layers[ekg::layer::active_bg]
-      );
-    }
+    ekg::draw::rect(
+      bar_progress,
+      slider.color_scheme.bar_active,
+      ekg::draw::mode::fill,
+      range.layers[ekg::layer::active_bg]
+    );
 
     if (range.dock_text != ekg::dock::none) {
       ekg::draw::get_font_renderer(range.font_size)