Skip to content

add theme toggle in jotpluggler #37985

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
CodeMan62 wants to merge 1 commit into
base: master
Choose a base branch
from
+113 −34
Open

add theme toggle in jotpluggler #37985

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
90 changes: 71 additions & 19 deletions tools/jotpluggler/app.cc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -241,9 +241,14 @@ void apply_dbc_override_change(AppSession *session, UiState *state, const std::s
}
}

void configure_style() {
ImGui::StyleColorsLight();
ImPlot::StyleColorsLight();
void configure_style(UiState *state) {
if (state->dark_mode) {
ImGui::StyleColorsDark();
ImPlot::StyleColorsDark();
}else {
ImGui::StyleColorsLight();
ImPlot::StyleColorsLight();
}

ImGuiIO &io = ImGui::GetIO();
g_ui_font = nullptr;
Expand Down Expand Up @@ -314,8 +319,31 @@ void configure_style() {
{ImGuiCol_TabDimmed, 213, 219, 226}, {ImGuiCol_TabDimmedSelected, 244, 247, 249},
{ImGuiCol_TabDimmedSelectedOverline, 92, 109, 136}, {ImGuiCol_DockingEmptyBg, 244, 246, 248},
};
for (const auto &c : COLORS) { style.Colors[c.idx] = color_rgb(c.r, c.g, c.b); }
style.Colors[ImGuiCol_DockingPreview] = color_rgb(69, 115, 184, 0.22f);
constexpr ColorDef DARK_COLORS[] = {
{ImGuiCol_WindowBg, 18, 20, 23}, {ImGuiCol_ChildBg, 24, 26, 30},
{ImGuiCol_Border, 55, 60, 68}, {ImGuiCol_TitleBg, 20, 22, 26},
{ImGuiCol_TitleBgActive, 22, 24, 28},{ImGuiCol_TitleBgCollapsed, 20, 22, 26},
{ImGuiCol_Text, 210, 214, 220}, {ImGuiCol_TextDisabled, 120, 128, 138},
{ImGuiCol_Button, 34, 38, 44}, {ImGuiCol_ButtonHovered, 44, 49, 57},
{ImGuiCol_ButtonActive, 54, 60, 70}, {ImGuiCol_FrameBg, 28, 31, 36},
{ImGuiCol_FrameBgHovered, 35, 39, 46},{ImGuiCol_FrameBgActive, 42, 47, 55},
{ImGuiCol_Header, 36, 41, 49}, {ImGuiCol_HeaderHovered, 44, 50, 60},
{ImGuiCol_HeaderActive, 52, 59, 70}, {ImGuiCol_PopupBg, 24, 27, 32},
{ImGuiCol_MenuBarBg, 22, 25, 30}, {ImGuiCol_Separator, 55, 60, 68},
{ImGuiCol_ScrollbarBg, 20, 23, 27}, {ImGuiCol_ScrollbarGrab, 60, 66, 76},
{ImGuiCol_ScrollbarGrabHovered, 76, 83, 95},{ImGuiCol_ScrollbarGrabActive, 92, 100, 114},
{ImGuiCol_Tab, 28, 32, 38}, {ImGuiCol_TabHovered, 40, 46, 54},
{ImGuiCol_TabSelected, 34, 39, 47}, {ImGuiCol_TabSelectedOverline, 92, 139, 214},
{ImGuiCol_TabDimmed, 24, 27, 33}, {ImGuiCol_TabDimmedSelected, 30, 35, 42},
{ImGuiCol_TabDimmedSelectedOverline, 70, 100, 160},{ImGuiCol_DockingEmptyBg, 14, 16, 19},
};
if(state->dark_mode){
for (const auto &c : DARK_COLORS) { style.Colors[c.idx] = color_rgb(c.r, c.g, c.b); }
style.Colors[ImGuiCol_DockingPreview] = color_rgb(92, 139, 214, 0.22f);
} else {
for (const auto &c : COLORS) { style.Colors[c.idx] = color_rgb(c.r, c.g, c.b); }
style.Colors[ImGuiCol_DockingPreview] = color_rgb(69, 115, 184, 0.22f);
}

ImPlotStyle &plot_style = ImPlot::GetStyle();
plot_style.PlotBorderSize = 1.0f;
Expand Down Expand Up @@ -743,8 +771,13 @@ std::array<uint8_t, 3> app_next_curve_color(const Pane &pane) {
void draw_sidebar(AppSession *session, const UiMetrics &ui, UiState *state, bool show_camera_feed) {
ImGui::SetNextWindowPos(ImVec2(0.0f, ui.top_offset));
ImGui::SetNextWindowSize(ImVec2(ui.sidebar_width, std::max(1.0f, ui.height - ui.top_offset)));
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(238, 240, 244));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(190, 197, 205));
if (state->dark_mode) {
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(26, 29, 33));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(55, 60, 68));
} else {
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(238, 240, 244));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(190, 197, 205));
}
const ImGuiWindowFlags flags = ImGuiWindowFlags_NoDecoration |
ImGuiWindowFlags_NoMove |
ImGuiWindowFlags_NoResize |
Expand Down Expand Up @@ -1550,11 +1583,19 @@ void draw_pane_windows(AppSession *session, UiState *state) {
std::optional<PaneDropAction> drop_action;
bool close_pane_requested = false;
ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(2.0f, 2.0f));
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(250, 250, 251));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(194, 198, 204));
ImGui::PushStyleColor(ImGuiCol_TitleBg, color_rgb(252, 252, 253));
ImGui::PushStyleColor(ImGuiCol_TitleBgActive, color_rgb(252, 252, 253));
ImGui::PushStyleColor(ImGuiCol_TitleBgCollapsed, color_rgb(252, 252, 253));
if (state->dark_mode) {
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(24, 26, 30));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(55, 60, 68));
ImGui::PushStyleColor(ImGuiCol_TitleBg, color_rgb(22, 24, 28));
ImGui::PushStyleColor(ImGuiCol_TitleBgActive, color_rgb(22, 24, 28));
ImGui::PushStyleColor(ImGuiCol_TitleBgCollapsed, color_rgb(22, 24, 28));
} else {
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(250, 250, 251));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(194, 198, 204));
ImGui::PushStyleColor(ImGuiCol_TitleBg, color_rgb(252, 252, 253));
ImGui::PushStyleColor(ImGuiCol_TitleBgActive, color_rgb(252, 252, 253));
ImGui::PushStyleColor(ImGuiCol_TitleBgCollapsed, color_rgb(252, 252, 253));
}
const ImGuiWindowFlags flags = ImGuiWindowFlags_NoCollapse;
const std::string window_name = pane_window_name(tab_state->runtime_id, static_cast<int>(i), pane);
const bool opened = ImGui::Begin(window_name.c_str(), nullptr, flags);
Expand Down Expand Up @@ -1612,8 +1653,13 @@ void draw_workspace(AppSession *session, const UiMetrics &ui, UiState *state) {
ImGui::SetNextWindowPos(ImVec2(ui.content_x, ui.content_y));
ImGui::SetNextWindowSize(ImVec2(ui.content_w, ui.content_h));
ImGui::PushStyleVar(ImGuiStyleVar_WindowPadding, ImVec2(0.0f, 0.0f));
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(244, 246, 248));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(186, 191, 198));
if (state->dark_mode) {
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(14, 16, 19));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(50, 55, 63));
} else {
ImGui::PushStyleColor(ImGuiCol_WindowBg, color_rgb(244, 246, 248));
ImGui::PushStyleColor(ImGuiCol_Border, color_rgb(186, 191, 198));
}
const ImGuiWindowFlags flags = ImGuiWindowFlags_NoDecoration |
ImGuiWindowFlags_NoMove |
ImGuiWindowFlags_NoResize |
Expand Down Expand Up @@ -1720,16 +1766,22 @@ void draw_workspace(AppSession *session, const UiMetrics &ui, UiState *state) {
}
}
ImGui::PushStyleVar(ImGuiStyleVar_FramePadding, ImVec2(12.0f, 5.0f));
ImGui::PushStyleColor(ImGuiCol_Tab, color_rgb(210, 217, 225));
ImGui::PushStyleColor(ImGuiCol_TabHovered, color_rgb(224, 230, 237));
ImGui::PushStyleColor(ImGuiCol_TabSelected, color_rgb(242, 245, 248));
if (state->dark_mode) {
ImGui::PushStyleColor(ImGuiCol_Tab, color_rgb(28, 32, 38));
ImGui::PushStyleColor(ImGuiCol_TabHovered, color_rgb(40, 46, 54));
ImGui::PushStyleColor(ImGuiCol_TabSelected, color_rgb(34, 39, 47));
} else {
ImGui::PushStyleColor(ImGuiCol_Tab, color_rgb(210, 217, 225));
ImGui::PushStyleColor(ImGuiCol_TabHovered, color_rgb(224, 230, 237));
ImGui::PushStyleColor(ImGuiCol_TabSelected, color_rgb(242, 245, 248));
}
if (ImGui::TabItemButton(" ##new_tab_button", ImGuiTabItemFlags_Trailing)) {
pending_action = TabActionKind::New;
}
{
const ImRect rect(ImGui::GetItemRectMin(), ImGui::GetItemRectMax());
ImDrawList *draw_list = ImGui::GetWindowDrawList();
const ImU32 color = ImGui::GetColorU32(color_rgb(72, 79, 88));
const ImU32 color = ImGui::GetColorU32(state->dark_mode ? color_rgb(200, 207, 215) : color_rgb(72, 79, 88));
const ImVec2 center((rect.Min.x + rect.Max.x) * 0.5f, (rect.Min.y + rect.Max.y) * 0.5f);
constexpr float half_extent = 6.25f;
constexpr float thickness = 2.0f;
Expand Down Expand Up @@ -1842,7 +1894,7 @@ int run(const Options &options) {

GlfwRuntime glfw_runtime(options);
ImGuiRuntime imgui_runtime(glfw_runtime.window());
configure_style();
configure_style(&ui_state);
session.map_data = std::make_unique<MapDataManager>();
for (std::unique_ptr<CameraFeedView> &feed : session.pane_camera_feeds) {
feed = std::make_unique<CameraFeedView>();
Expand Down
2 changes: 2 additions & 0 deletions tools/jotpluggler/app.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -653,6 +653,7 @@ struct UiState {
bool fps_overlay_initialized = false;
bool suppress_range_side_effects = false;
bool browser_nodes_dirty = false;
bool dark_mode = false;
int active_tab_index = 0;
int next_tab_runtime_id = 1;
int requested_tab_index = -1;
Expand Down Expand Up @@ -885,3 +886,4 @@ class CameraFeedView {
struct Impl;
std::unique_ptr<Impl> impl_;
};
void configure_style(UiState *ui_state);
49 changes: 34 additions & 15 deletions tools/jotpluggler/plot.cc
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -777,21 +777,40 @@ void draw_plot(const AppSession &session, Pane *pane, UiState *state) {
const bool has_cursor_time = state->has_tracker_time;
const double cursor_time = state->tracker_time;

ImPlot::PushStyleColor(ImPlotCol_PlotBg, color_rgb(255, 255, 255));
ImPlot::PushStyleColor(ImPlotCol_PlotBorder, color_rgb(186, 190, 196));
ImPlot::PushStyleColor(ImPlotCol_LegendBg, color_rgb(248, 249, 251, 0.92f));
ImPlot::PushStyleColor(ImPlotCol_LegendBorder, color_rgb(168, 175, 184));
ImPlot::PushStyleColor(ImPlotCol_LegendText, color_rgb(57, 62, 69));
ImPlot::PushStyleColor(ImPlotCol_TitleText, color_rgb(57, 62, 69));
ImPlot::PushStyleColor(ImPlotCol_InlayText, color_rgb(95, 103, 112));
ImPlot::PushStyleColor(ImPlotCol_AxisGrid, color_rgb(188, 196, 206));
ImPlot::PushStyleColor(ImPlotCol_AxisText, color_rgb(95, 103, 112));
ImPlot::PushStyleColor(ImPlotCol_AxisBg, color_rgb(255, 255, 255, 0.0f));
ImPlot::PushStyleColor(ImPlotCol_AxisBgHovered, color_rgb(214, 220, 228, 0.45f));
ImPlot::PushStyleColor(ImPlotCol_AxisBgActive, color_rgb(199, 209, 222, 0.55f));
ImPlot::PushStyleColor(ImPlotCol_Selection, color_rgb(252, 211, 77, 0.28f));
ImPlot::PushStyleColor(ImPlotCol_Crosshairs, color_rgb(120, 128, 138, 0.70f));
ImPlot::PushStyleVar(ImPlotStyleVar_LegendPadding, ImVec2(56.0f, 10.0f));
if (state->dark_mode){
ImPlot::PushStyleColor(ImPlotCol_PlotBg, color_rgb(18, 18, 22));
ImPlot::PushStyleColor(ImPlotCol_PlotBorder, color_rgb(52, 58, 70));
ImPlot::PushStyleColor(ImPlotCol_LegendBg, color_rgb(28, 30, 36, 0.92f));
ImPlot::PushStyleColor(ImPlotCol_LegendBorder, color_rgb(64, 72, 84));
ImPlot::PushStyleColor(ImPlotCol_LegendText, color_rgb(230, 232, 235));
ImPlot::PushStyleColor(ImPlotCol_TitleText, color_rgb(240, 242, 245));
ImPlot::PushStyleColor(ImPlotCol_InlayText, color_rgb(160, 167, 176));
ImPlot::PushStyleColor(ImPlotCol_AxisGrid, color_rgb(58, 64, 76));
ImPlot::PushStyleColor(ImPlotCol_AxisText, color_rgb(170, 176, 184));
ImPlot::PushStyleColor(ImPlotCol_AxisBg, color_rgb(0, 0, 0, 0.0f));
ImPlot::PushStyleColor(ImPlotCol_AxisBgHovered, color_rgb(80, 88, 102, 0.35f));
ImPlot::PushStyleColor(ImPlotCol_AxisBgActive, color_rgb(96, 106, 122, 0.45f));
ImPlot::PushStyleColor(ImPlotCol_Selection, color_rgb(255, 196, 64, 0.22f));
ImPlot::PushStyleColor(ImPlotCol_Crosshairs, color_rgb(190, 196, 204, 0.55f));
ImPlot::PushStyleVar(ImPlotStyleVar_LegendPadding, ImVec2(56.0f, 10.0f));
}
else{
ImPlot::PushStyleColor(ImPlotCol_PlotBg, color_rgb(255, 255, 255));
ImPlot::PushStyleColor(ImPlotCol_PlotBorder, color_rgb(186, 190, 196));
ImPlot::PushStyleColor(ImPlotCol_LegendBg, color_rgb(248, 249, 251, 0.92f));
ImPlot::PushStyleColor(ImPlotCol_LegendBorder, color_rgb(168, 175, 184));
ImPlot::PushStyleColor(ImPlotCol_LegendText, color_rgb(57, 62, 69));
ImPlot::PushStyleColor(ImPlotCol_TitleText, color_rgb(57, 62, 69));
ImPlot::PushStyleColor(ImPlotCol_InlayText, color_rgb(95, 103, 112));
ImPlot::PushStyleColor(ImPlotCol_AxisGrid, color_rgb(188, 196, 206));
ImPlot::PushStyleColor(ImPlotCol_AxisText, color_rgb(95, 103, 112));
ImPlot::PushStyleColor(ImPlotCol_AxisBg, color_rgb(255, 255, 255, 0.0f));
ImPlot::PushStyleColor(ImPlotCol_AxisBgHovered, color_rgb(214, 220, 228, 0.45f));
ImPlot::PushStyleColor(ImPlotCol_AxisBgActive, color_rgb(199, 209, 222, 0.55f));
ImPlot::PushStyleColor(ImPlotCol_Selection, color_rgb(252, 211, 77, 0.28f));
ImPlot::PushStyleColor(ImPlotCol_Crosshairs, color_rgb(120, 128, 138, 0.70f));
ImPlot::PushStyleVar(ImPlotStyleVar_LegendPadding, ImVec2(56.0f, 10.0f));
}

ImPlotFlags plot_flags = ImPlotFlags_NoTitle | ImPlotFlags_NoMenus;
if (state_block_mode) {
Expand Down
6 changes: 6 additions & 0 deletions tools/jotpluggler/session.cc
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
#include "tools/jotpluggler/internal.h"
#include "tools/jotpluggler/app.h"

#include "imgui_internal.h"

Expand Down Expand Up @@ -757,6 +758,11 @@ float draw_main_menu_bar(AppSession *session, UiState *state) {
state->status_text = "Plot view reset";
}
ImGui::Separator();
if (ImGui::MenuItem("toggle theme")) {
state->dark_mode = !state->dark_mode;
configure_style(state);
}
ImGui::Separator();
if (ImGui::MenuItem("Close")) {
state->request_close = true;
}
Expand Down
Loading