restructure the menus to get operators, to get a more usable popover

in the context of #329, "blur" is gone so the color popover felt empty now it has 3 submenus, and it'll change again to make better use of its hidden radiobuttons
maoschanz · Feb 10, 2021 · 803c017 · 803c017
1 parent fdce24e
commit 803c017
Show file tree

Hide file tree

Showing 3 changed files with 181 additions and 93 deletions.
diff --git a/src/optionsbars/classic/optionsbar-color-popover.ui b/src/optionsbars/classic/optionsbar-color-popover.ui
@@ -21,9 +21,9 @@
         <child>
           <object class="GtkBox" id="operator-box-start">
             <property name="visible">True</property>
+            <property name="spacing">10</property>
             <property name="orientation">horizontal</property>
             <property name="tooltip-text" translatable="yes">How the color will be applied to the existing pixels</property>
-            <style><class name="linked"/></style>
             <child>
               <object class="GtkRadioButton" id="op-group">
                 <property name="visible">True</property>
@@ -33,82 +33,154 @@
                 <property name="action-target">'over'</property>
               </object>
             </child>
+
+            <!-- -->
+
             <child>
-              <object class="GtkMenuButton" id="op-menubtn">
+              <object class="GtkBox">
                 <property name="visible">True</property>
-                <property name="menu-model">other-operators-menu</property>
+                <property name="orientation">horizontal</property>
+                <style><class name="linked"/></style>
+
                 <child>
-                  <object class="GtkImage">
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'multiply'</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'screen'</property>
+                  </object>
+                </child>
+
+                <child>
+                  <object class="GtkMenuButton" id="op-menubtn1">
                     <property name="visible">True</property>
-                    <property name="icon-name">pan-down-symbolic</property>
+                    <property name="menu-model">highlight-operators-menu</property>
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="icon-name">tool-highlight-symbolic</property>
+                      </object>
+                    </child>
                   </object>
                 </child>
-              </object>
-            </child>
-            <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'source'</property>
-              </object>
-            </child>
-            <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'multiply'</property>
-              </object>
-            </child>
-            <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'difference'</property>
-              </object>
-            </child>
-          </object>
-        </child>
 
-        <child>
-          <object class="GtkBox">
-            <!-- <property name="visible">True</property> -->
-            <property name="orientation">horizontal</property>
-            <style><class name="linked"/></style>
-            <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'hsl-hue'</property>
-              </object>
-            </child>
-            <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'hsl-saturation'</property>
               </object>
             </child>
+
+            <!-- -->
+
             <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'hsl-color'</property>
+              <object class="GtkBox">
+                <property name="visible">True</property>
+                <property name="orientation">horizontal</property>
+                <style><class name="linked"/></style>
+
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'hsl-hue'</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'hsl-saturation'</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'hsl-color'</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'hsl-luminosity'</property>
+                  </object>
+                </child>
+
+                <child>
+                  <object class="GtkMenuButton" id="op-menubtn2">
+                    <property name="visible">True</property>
+                    <property name="menu-model">hsl-operators-menu</property>
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="icon-name">display-brightness-symbolic</property>
+                      </object>
+                    </child>
+                  </object>
+                </child>
+
               </object>
             </child>
+
+            <!-- -->
+
             <child>
-              <object class="GtkRadioButton">
-                <property name="group">op-group</property>
-                <!-- <property name="visible">True</property> -->
-                <property name="action-name">win.cairo_op_mirror</property>
-                <property name="action-target">'hsl-luminosity'</property>
+              <object class="GtkBox">
+                <property name="visible">True</property>
+                <property name="orientation">horizontal</property>
+                <style><class name="linked"/></style>
+
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'source'</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkRadioButton">
+                    <property name="group">op-group</property>
+                    <!-- <property name="visible">True</property> -->
+                    <property name="draw-indicator">False</property>
+                    <property name="action-name">win.cairo_op_mirror</property>
+                    <property name="action-target">'difference'</property>
+                  </object>
+                </child>
+
+                <child>
+                  <object class="GtkMenuButton" id="op-menubtn">
+                    <property name="visible">True</property>
+                    <property name="menu-model">other-operators-menu</property>
+                    <child>
+                      <object class="GtkImage">
+                        <property name="visible">True</property>
+                        <property name="icon-name">view-more-symbolic</property>
+                      </object>
+                    </child>
+                  </object>
+                </child>
+
               </object>
             </child>
+
           </object>
         </child>
 
@@ -202,19 +274,35 @@
       </item>
       <item>
         <!-- Context: a possible way to apply the color to the canvas -->
-        <attribute name="label" translatable="yes">Highlight</attribute>
+        <attribute name="label" translatable="yes">Difference</attribute>
+        <attribute name="action">win.cairo_operator</attribute>
+        <attribute name="target">difference</attribute>
+      </item>
+      <!-- and more...? -->
+    </section>
+  </menu>
+
+  <menu id="highlight-operators-menu">
+    <section>
+      <!-- Context: possible ways to apply the color to the canvas -->
+      <attribute name="label" translatable="yes">Highlight</attribute>
+      <item>
+        <!-- Context: a possible way to highlight text -->
+        <attribute name="label" translatable="yes">Dark text on light background</attribute>
         <attribute name="action">win.cairo_operator</attribute>
         <attribute name="target">multiply</attribute>
       </item>
       <item>
-        <!-- Context: a possible way to apply the color to the canvas -->
-        <attribute name="label" translatable="yes">Difference</attribute>
+        <!-- Context: a possible way to highlight text -->
+        <attribute name="label" translatable="yes">Light text on dark background</attribute>
         <attribute name="action">win.cairo_operator</attribute>
-        <attribute name="target">difference</attribute>
+        <attribute name="target">screen</attribute>
       </item>
-      <!-- and more...? -->
     </section>
-    <submenu>
+  </menu>
+
+  <menu id="hsl-operators-menu">
+    <section>
       <!-- Context: possible ways to apply the color to the canvas -->
       <attribute name="label" translatable="yes">Photo-oriented modes</attribute>
       <item>
@@ -241,7 +329,7 @@
         <attribute name="action">win.cairo_operator</attribute>
         <attribute name="target">hsl-luminosity</attribute>
       </item>
-    </submenu>
+    </section>
   </menu>
 
 </interface>

diff --git a/src/optionsbars/classic/optionsbar_color_popover.py b/src/optionsbars/classic/optionsbar_color_popover.py
@@ -28,7 +28,9 @@
 	'source': cairo.Operator.SOURCE,
 	'difference': cairo.Operator.DIFFERENCE,
 
+	# "Highlight" submenu
 	'multiply': cairo.Operator.MULTIPLY,
+	'screen': cairo.Operator.SCREEN,
 
 	'hsl-hue': cairo.Operator.HSL_HUE,
 	'hsl-saturation': cairo.Operator.HSL_SATURATION,
@@ -40,9 +42,12 @@
 	'over': _("Normal"),
 	'clear': _("Erase"),
 
-	'difference': _("Difference"),
-	'multiply': _("Highlight"),
 	'source': _("Raw source color"),
+	'difference': _("Difference"),
+
+	# "Highlight" submenu
+	'multiply': _("Highlight") + " - " + _("Dark text on light background"),
+	'screen': _("Highlight") + " - " + _("Light text on dark background"),
 
 	'hsl-hue': _("Hue only"),
 	'hsl-saturation': _("Saturation only"),
@@ -84,7 +89,6 @@ def __init__(self, btn, thumbn, initial_rgba, is_main_c, cl_bar, **kwargs):
 
 		self._operator_box_1 = builder.get_object('operator-box-start')
 		self._operator_box_2 = builder.get_object('operator-box-end')
-		self._operator_menubtn = builder.get_object('op-menubtn')
 
 		########################################################################
 		# Color chooser widget #################################################
@@ -127,7 +131,6 @@ def adapt_to_operator(self, op_as_string):
 		self._operator_label = CAIRO_OP_LABELS[op_as_string]
 		# print("adapt to operator :", op_as_string)
 		supports_colors = self._operator_supports_color(op_as_string)
-		self._operator_menubtn.get_popover().popdown()
 		self.color_widget.set_sensitive(supports_colors)
 		self._set_thumbnail_color(op_as_string)
 

diff --git a/src/ui/app-menus.ui b/src/ui/app-menus.ui
@@ -311,33 +311,17 @@
           <attribute name="target">over</attribute>
         </item>
         <submenu>
-          <attribute name="label" translatable="yes">Other modes</attribute>
-          <item>
-            <attribute name="label" translatable="yes">Raw source color</attribute>
-            <attribute name="action">win.cairo_operator</attribute>
-            <attribute name="target">source</attribute>
-          </item>
+          <attribute name="label" translatable="yes">Highlight</attribute>
           <item>
-            <attribute name="label" translatable="yes">Highlight</attribute>
+            <attribute name="label" translatable="yes">Dark text on light background</attribute>
             <attribute name="action">win.cairo_operator</attribute>
             <attribute name="target">multiply</attribute>
           </item>
           <item>
-            <attribute name="label" translatable="yes">Difference</attribute>
+            <attribute name="label" translatable="yes">Light text on dark background</attribute>
             <attribute name="action">win.cairo_operator</attribute>
-            <attribute name="target">difference</attribute>
+            <attribute name="target">screen</attribute>
           </item>
-          <!-- TODO ? -->
-          <!-- <item> -->
-          <!--   <attribute name="label" translatable="yes">Lighten</attribute> -->
-          <!--   <attribute name="action">win.cairo_operator</attribute> -->
-          <!--   <attribute name="target">lighten</attribute> -->
-          <!-- </item> -->
-          <!-- <item> -->
-          <!--   <attribute name="label" translatable="yes">Darken</attribute> -->
-          <!--   <attribute name="action">win.cairo_operator</attribute> -->
-          <!--   <attribute name="target">darken</attribute> -->
-          <!-- </item> -->
         </submenu>
         <submenu>
           <attribute name="label" translatable="yes">Photo-oriented modes</attribute>
@@ -362,6 +346,19 @@
             <attribute name="target">hsl-luminosity</attribute>
           </item>
         </submenu>
+        <submenu>
+          <attribute name="label" translatable="yes">Other modes</attribute>
+          <item>
+            <attribute name="label" translatable="yes">Raw source color</attribute>
+            <attribute name="action">win.cairo_operator</attribute>
+            <attribute name="target">source</attribute>
+          </item>
+          <item>
+            <attribute name="label" translatable="yes">Difference</attribute>
+            <attribute name="action">win.cairo_operator</attribute>
+            <attribute name="target">difference</attribute>
+          </item>
+        </submenu>
       </section>
       <section>
         <attribute name="label" translatable="yes">Don't use the colors but…</attribute>