From 4e886fca2b1256317337dd12e2cbf5808f4db805 Mon Sep 17 00:00:00 2001
From: Peter Hutterer <peter.hutterer@who-t.net>
Date: Fri, 19 Jul 2019 18:09:13 +1000
Subject: [PATCH] gui: only show the toolbox on enter

This is using opacity of 0% to hide them - this way the space stays allocated
and showing it doesn't rearrange things. Using visiblity here causes
everything to shift around on reveal.
---
 tuhigui/data/ui/Drawing.ui | 189 +++++++++++++++++++------------------
 tuhigui/drawing.py         |  15 ++-
 2 files changed, 112 insertions(+), 92 deletions(-)

diff --git a/tuhigui/data/ui/Drawing.ui b/tuhigui/data/ui/Drawing.ui
index 9af1071..9bca55e 100644
--- a/tuhigui/data/ui/Drawing.ui
+++ b/tuhigui/data/ui/Drawing.ui
@@ -22,44 +22,119 @@
     <property name="can_focus">False</property>
     <property name="icon_name">object-rotate-right-symbolic</property>
   </object>
-  <template class="Drawing" parent="GtkBox">
+  <template class="Drawing" parent="GtkEventBox">
     <property name="visible">True</property>
     <property name="can_focus">False</property>
-    <property name="margin_left">20</property>
-    <property name="margin_right">20</property>
-    <property name="orientation">vertical</property>
+    <signal name="enter-notify-event" handler="_on_enter" swapped="no"/>
+    <signal name="leave-notify-event" handler="_on_leave" swapped="no"/>
     <child>
-      <object class="GtkBox" id="box_toolbar">
+      <object class="GtkBox" id="box_drawing">
         <property name="visible">True</property>
         <property name="can_focus">False</property>
-        <property name="halign">center</property>
-        <property name="valign">start</property>
-        <property name="margin_left">10</property>
-        <property name="margin_right">10</property>
-        <property name="margin_top">10</property>
-        <property name="margin_bottom">10</property>
-        <property name="hexpand">True</property>
+        <property name="margin_left">20</property>
+        <property name="margin_right">20</property>
+        <property name="orientation">vertical</property>
         <child>
-          <object class="GtkButton" id="btn_rotate_left">
+          <object class="GtkBox" id="box_toolbar">
+            <property name="height_request">20</property>
             <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
-            <property name="image">image_rotate_left</property>
-            <signal name="clicked" handler="_on_rotate_button_clicked" swapped="no"/>
+            <property name="can_focus">False</property>
+            <property name="halign">center</property>
+            <property name="valign">start</property>
+            <property name="margin_left">10</property>
+            <property name="margin_right">10</property>
+            <property name="margin_top">10</property>
+            <property name="margin_bottom">10</property>
+            <property name="hexpand">True</property>
+            <child>
+              <object class="GtkButton" id="btn_rotate_left">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="receives_default">True</property>
+                <property name="image">image_rotate_left</property>
+                <signal name="clicked" handler="_on_rotate_button_clicked" swapped="no"/>
+              </object>
+              <packing>
+                <property name="expand">False</property>
+                <property name="fill">True</property>
+                <property name="position">1</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkButton" id="btn_rotate_right">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="receives_default">True</property>
+                <property name="image">image_rotate_right</property>
+                <signal name="clicked" handler="_on_rotate_button_clicked" swapped="no"/>
+              </object>
+              <packing>
+                <property name="expand">False</property>
+                <property name="fill">True</property>
+                <property name="position">2</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkButton" id="btn_download">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="receives_default">True</property>
+                <property name="halign">center</property>
+                <property name="image">icon_download</property>
+                <signal name="clicked" handler="_on_download_button_clicked" swapped="no"/>
+              </object>
+              <packing>
+                <property name="expand">False</property>
+                <property name="fill">False</property>
+                <property name="position">3</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkSeparator">
+                <property name="visible">True</property>
+                <property name="can_focus">False</property>
+                <property name="margin_left">10</property>
+                <property name="margin_right">10</property>
+                <property name="orientation">vertical</property>
+              </object>
+              <packing>
+                <property name="expand">False</property>
+                <property name="fill">True</property>
+                <property name="position">4</property>
+              </packing>
+            </child>
+            <child>
+              <object class="GtkButton" id="btn_remove">
+                <property name="visible">True</property>
+                <property name="can_focus">True</property>
+                <property name="receives_default">True</property>
+                <property name="image">icon_remove</property>
+                <signal name="clicked" handler="_on_delete_button_clicked" swapped="no"/>
+              </object>
+              <packing>
+                <property name="expand">False</property>
+                <property name="fill">True</property>
+                <property name="position">6</property>
+              </packing>
+            </child>
           </object>
           <packing>
-            <property name="expand">False</property>
+            <property name="expand">True</property>
             <property name="fill">True</property>
             <property name="position">1</property>
           </packing>
         </child>
         <child>
-          <object class="GtkButton" id="btn_rotate_right">
+          <object class="GtkImage" id="image_svg">
             <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
-            <property name="image">image_rotate_right</property>
-            <signal name="clicked" handler="_on_rotate_button_clicked" swapped="no"/>
+            <property name="can_focus">False</property>
+            <property name="halign">center</property>
+            <property name="valign">center</property>
+            <property name="margin_bottom">10</property>
+            <property name="stock">gtk-missing-image</property>
+            <style>
+              <class name="bg-paper"/>
+            </style>
           </object>
           <packing>
             <property name="expand">False</property>
@@ -67,76 +142,10 @@
             <property name="position">2</property>
           </packing>
         </child>
-        <child>
-          <object class="GtkButton" id="btn_download">
-            <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
-            <property name="halign">center</property>
-            <property name="image">icon_download</property>
-            <signal name="clicked" handler="_on_download_button_clicked" swapped="no"/>
-          </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">False</property>
-            <property name="position">3</property>
-          </packing>
-        </child>
-        <child>
-          <object class="GtkSeparator">
-            <property name="visible">True</property>
-            <property name="can_focus">False</property>
-            <property name="margin_left">10</property>
-            <property name="margin_right">10</property>
-            <property name="orientation">vertical</property>
-          </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="position">4</property>
-          </packing>
-        </child>
-        <child>
-          <object class="GtkButton" id="btn_remove">
-            <property name="visible">True</property>
-            <property name="can_focus">True</property>
-            <property name="receives_default">True</property>
-            <property name="image">icon_remove</property>
-            <signal name="clicked" handler="_on_delete_button_clicked" swapped="no"/>
-          </object>
-          <packing>
-            <property name="expand">False</property>
-            <property name="fill">True</property>
-            <property name="position">6</property>
-          </packing>
-        </child>
-      </object>
-      <packing>
-        <property name="expand">True</property>
-        <property name="fill">True</property>
-        <property name="position">1</property>
-      </packing>
-    </child>
-    <child>
-      <object class="GtkImage" id="image_svg">
-        <property name="visible">True</property>
-        <property name="can_focus">False</property>
-        <property name="halign">center</property>
-        <property name="valign">center</property>
-        <property name="margin_bottom">10</property>
-        <property name="stock">gtk-missing-image</property>
         <style>
-          <class name="bg-paper"/>
+          <class name="drawing"/>
         </style>
       </object>
-      <packing>
-        <property name="expand">False</property>
-        <property name="fill">True</property>
-        <property name="position">2</property>
-      </packing>
     </child>
-    <style>
-      <class name="drawing"/>
-    </style>
   </template>
 </interface>
diff --git a/tuhigui/drawing.py b/tuhigui/drawing.py
index 1b809bf..78cd804 100644
--- a/tuhigui/drawing.py
+++ b/tuhigui/drawing.py
@@ -12,7 +12,7 @@
 #
 
 from gettext import gettext as _
-from gi.repository import GObject, Gtk, GdkPixbuf
+from gi.repository import GObject, Gtk, GdkPixbuf, Gdk
 
 from .config import Config
 from .svg import JsonSvg
@@ -24,7 +24,7 @@ gi.require_version("Gtk", "3.0")
 
 
 @Gtk.Template(resource_path='/org/freedesktop/Tuhi/ui/Drawing.ui')
-class Drawing(Gtk.Box):
+class Drawing(Gtk.EventBox):
     __gtype_name__ = "Drawing"
 
     box_toolbar = Gtk.Template.Child()
@@ -42,6 +42,7 @@ class Drawing(Gtk.Box):
         self.refresh()  # sets self.svg
 
         self.timestamp = self.svg.timestamp
+        self.box_toolbar.set_opacity(0)
 
     def _on_orientation_changed(self, config, pspec):
         self.orientation = config.orientation
@@ -123,3 +124,13 @@ class Drawing(Gtk.Box):
         o = orientations[orientations.index(self.orientation) + advance]
         self.orientation = o
         self.refresh()
+
+    @Gtk.Template.Callback('_on_enter')
+    def _on_enter(self, *args):
+        self.box_toolbar.set_opacity(100)
+
+    @Gtk.Template.Callback('_on_leave')
+    def _on_leave(self, drawing, event):
+        if event.detail == Gdk.NotifyType.INFERIOR:
+            return
+        self.box_toolbar.set_opacity(0)