From 1484b4ae9f025683e19be741cbd8a79a87a2dd84 Mon Sep 17 00:00:00 2001
From: Matthias Clasen <mclasen@redhat.com>
Date: Sat, 30 Jan 2021 19:28:02 -0500
Subject: [PATCH] node editor: Add a dark mode toggle

This is useful to see light rendering clearly.
---
 demos/node-editor/node-editor-window.c  | 11 +++++++++++
 demos/node-editor/node-editor-window.ui |  9 +++++++++
 2 files changed, 20 insertions(+)

diff --git a/demos/node-editor/node-editor-window.c b/demos/node-editor/node-editor-window.c
index 995349b2cb..55c61aa799 100644
--- a/demos/node-editor/node-editor-window.c
+++ b/demos/node-editor/node-editor-window.c
@@ -700,6 +700,16 @@ out:
   g_free (source_dir);
 }
 
+static void
+dark_mode_cb (GtkToggleButton *button,
+              GParamSpec      *pspec,
+              NodeEditorWindow *self)
+{
+  g_object_set (gtk_widget_get_settings (GTK_WIDGET (self)),
+                "gtk-application-prefer-dark-theme", gtk_toggle_button_get_active (button),
+                NULL);
+}
+
 static void
 node_editor_window_finalize (GObject *object)
 {
@@ -814,6 +824,7 @@ node_editor_window_class_init (NodeEditorWindowClass *class)
   gtk_widget_class_bind_template_callback (widget_class, export_image_cb);
   gtk_widget_class_bind_template_callback (widget_class, testcase_save_clicked_cb);
   gtk_widget_class_bind_template_callback (widget_class, testcase_name_entry_changed_cb);
+  gtk_widget_class_bind_template_callback (widget_class, dark_mode_cb);
 }
 
 static GtkWidget *
diff --git a/demos/node-editor/node-editor-window.ui b/demos/node-editor/node-editor-window.ui
index 20d36f6f28..73b8b9ce4b 100644
--- a/demos/node-editor/node-editor-window.ui
+++ b/demos/node-editor/node-editor-window.ui
@@ -139,6 +139,15 @@
             <property name="icon-name">open-menu-symbolic</property>
           </object>
         </child>
+        <child type="end">
+          <object class="GtkToggleButton" id="dark_bg_button">
+            <property name="valign">center</property>
+            <property name="has-frame">0</property>
+            <property name="icon-name">display-brightness-symbolic</property>
+            <property name="tooltip-text" translatable="yes">Use a dark background</property>
+            <signal name="notify::active" handler="dark_mode_cb" swapped="0"/>
+          </object>
+        </child>
       </object>
     </child>
     <child>