[gnome-maps/wip/mlundblad/night-mode: 10/11] mapView: Set a dark view background when in dark theme mode

[Marcus Lundblad <mlundblad src gnome org>]

commit 949cfaf1f337cc2e15f52bd34615e8a797823ffb
Author: Marcus Lundblad <ml update uu se>
Date:   Mon Jun 8 23:24:21 2020 +0200

    mapView: Set a dark view background when in dark theme mode

 src/mapView.js | 41 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 41 insertions(+)
---
diff --git a/src/mapView.js b/src/mapView.js
index 1e81f169..544ef46a 100644
--- a/src/mapView.js
+++ b/src/mapView.js
@@ -205,10 +205,51 @@ var MapView = GObject.registerClass({
                                          this._onNightModeChanged.bind(this));
         }
 
+        this._gtkSettings = Gtk.Settings.get_default();
+        this._gtkSettings.connect('notify::gtk-application-prefer-dark-theme',
+                            this._onPreferDarkThemeChanged.bind(this));
+        // set dark background if we start up in dark theme
+        if (this._gtkSettings.gtk_application_prefer_dark_theme) {
+            if (!this._darkBackgroud)
+                this._createDarkBackground();
+            view.set_background_pattern(this._darkBackground);
+        }
+
         this._initScale(view);
         return view;
     }
 
+    /* handler to draw background for dark theme,
+     * theese three functions should not be needed later with a native GTK
+     * widget (Shumate)
+     */
+    _drawDarkBackground(canvas, cr, width, height) {
+        // set this arbitrarily to try to match the typical dark tile set
+        cr.setSourceRGB(0.2, 0.2, 0.2);
+        cr.rectangle(0, 0, width, height);
+        cr.fillPreserve();
+
+        return true;
+    }
+
+    _createDarkBackground() {
+        this._darkBackground = new Clutter.Canvas();
+        this._darkBackground.set_size(512, 512);
+        this._darkBackground.connect('draw',
+                                     this._drawDarkBackground.bind(this));
+        this._darkBackground.invalidate();
+    }
+
+    _onPreferDarkThemeChanged() {
+        if (this._gtkSettings.gtk_application_prefer_dark_theme) {
+            if (!this._darkBackgroud)
+                this._createDarkBackground();
+            this.view.set_background_pattern(this._darkBackground);
+        } else {
+            this.view.background_pattern = null;
+        }
+    }
+
     _onNightModeChanged() {
         if (this._mapType === MapType.STREET) {
             if (Application.settings.get('night-mode'))