[nautilus/wip/antoniof/search-list-redesign] name-cell: Redesign search list

From: António Fernandes <antoniof src gnome org>
To: commits-list gnome org
Cc:
Subject: [nautilus/wip/antoniof/search-list-redesign] name-cell: Redesign search list
Date: Wed, 3 Aug 2022 10:07:30 +0000 (UTC)

commit fc28cd9e613ffdc2db82d8c64ccd36b8e9dd76ce
Author: António Fernandes <antoniof gnome org>
Date:   Wed Aug 3 10:09:07 2022 +0100

    name-cell: Redesign search list
    
    Move path to bottom, because it's a caption for the filename, not a title.
    
    Move FTS snipped into a popover, to avoid changing the row layout.
    
    Closes: https://gitlab.gnome.org/GNOME/nautilus/-/issues/2354

 src/nautilus-name-cell.c                   | 31 ++----------
 src/resources/css/Adwaita.css              |  6 +++
 src/resources/icons/quotation-symbolic.svg |  2 +
 src/resources/nautilus.gresource.xml       |  1 +
 src/resources/ui/nautilus-name-cell.ui     | 76 ++++++++++++++++++++----------
 5 files changed, 64 insertions(+), 52 deletions(-)
---
diff --git a/src/nautilus-name-cell.c b/src/nautilus-name-cell.c
index ab3cd05db..7cc3c2122 100644
--- a/src/nautilus-name-cell.c
+++ b/src/nautilus-name-cell.c
@@ -20,6 +20,7 @@ struct _NautilusNameCell
     GtkWidget *icon;
     GtkWidget *label;
     GtkWidget *emblems_box;
+    GtkWidget *snippet_button;
     GtkWidget *snippet;
     GtkWidget *path;
 
@@ -79,29 +80,6 @@ get_path_text (NautilusFile *file,
     return g_steal_pointer (&path);
 }
 
-static gchar *
-get_fts_snippet (NautilusFile *file)
-{
-    const gchar *snippet;
-    g_autoptr (GRegex) regex = NULL;
-
-    snippet = nautilus_file_get_search_fts_snippet (file);
-    if (snippet == NULL)
-    {
-        return NULL;
-    }
-
-    /* Flatten the text by replacing new lines with spaces */
-    regex = g_regex_new ("\\R+", 0, G_REGEX_MATCH_NEWLINE_ANY, NULL);
-    return g_regex_replace (regex,
-                            snippet,
-                            -1,
-                            0,
-                            " ",
-                            G_REGEX_MATCH_NEWLINE_ANY,
-                            NULL);
-}
-
 static void
 update_labels (NautilusNameCell *self)
 {
@@ -109,7 +87,7 @@ update_labels (NautilusNameCell *self)
     NautilusFile *file;
     g_autofree gchar *display_name = NULL;
     g_autofree gchar *path_text = NULL;
-    g_autofree gchar *fts_snippet = NULL;
+    const gchar *fts_snippet = NULL;
 
     item = nautilus_view_cell_get_item (NAUTILUS_VIEW_CELL (self));
     g_return_if_fail (item != NULL);
@@ -121,7 +99,7 @@ update_labels (NautilusNameCell *self)
                                self->file_path_base_location);
     if (self->show_snippet)
     {
-        fts_snippet = get_fts_snippet (file);
+        fts_snippet = nautilus_file_get_search_fts_snippet (file);
     }
 
     gtk_label_set_text (GTK_LABEL (self->label), display_name);
@@ -129,7 +107,7 @@ update_labels (NautilusNameCell *self)
     gtk_label_set_markup (GTK_LABEL (self->snippet), fts_snippet);
 
     gtk_widget_set_visible (self->path, (path_text != NULL));
-    gtk_widget_set_visible (self->snippet, (fts_snippet != NULL));
+    gtk_widget_set_visible (self->snippet_button, (fts_snippet != NULL));
 }
 
 static void
@@ -320,6 +298,7 @@ nautilus_name_cell_class_init (NautilusNameCellClass *klass)
     gtk_widget_class_bind_template_child (widget_class, NautilusNameCell, icon);
     gtk_widget_class_bind_template_child (widget_class, NautilusNameCell, label);
     gtk_widget_class_bind_template_child (widget_class, NautilusNameCell, emblems_box);
+    gtk_widget_class_bind_template_child (widget_class, NautilusNameCell, snippet_button);
     gtk_widget_class_bind_template_child (widget_class, NautilusNameCell, snippet);
     gtk_widget_class_bind_template_child (widget_class, NautilusNameCell, path);
 }
diff --git a/src/resources/css/Adwaita.css b/src/resources/css/Adwaita.css
index f2628f3a9..d99045699 100644
--- a/src/resources/css/Adwaita.css
+++ b/src/resources/css/Adwaita.css
@@ -216,6 +216,12 @@
   padding: 6px;
 }
 
+.nautilus-list-view menubutton.mini-pill > button {
+  border-radius: 100px;
+  padding-top: 2px;
+  padding-bottom: 2px;
+}
+
 /* Both views */
 .nautilus-list-view:drop(active),
 .nautilus-grid-view:drop(active) {
diff --git a/src/resources/icons/quotation-symbolic.svg b/src/resources/icons/quotation-symbolic.svg
new file mode 100644
index 000000000..cc92cdd3c
--- /dev/null
+++ b/src/resources/icons/quotation-symbolic.svg
@@ -0,0 +1,2 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg"; height="16px" viewBox="0 0 16 16" width="16px"><path d="m 1 3 l -1 3 
v 2.5 c 0 0.277344 0.222656 0.5 0.5 0.5 h 2 c 0.277344 0 0.5 -0.222656 0.5 -0.5 v -2 c 0 -0.277344 -0.222656 
-0.5 -0.5 -0.5 h -0.5 l 1 -3 z m 4 0 l -1 3 v 2.5 c 0 0.277344 0.222656 0.5 0.5 0.5 h 2 c 0.277344 0 0.5 
-0.222656 0.5 -0.5 v -2 c 0 -0.277344 -0.222656 -0.5 -0.5 -0.5 h -0.5 l 1 -3 z m 4.5 4 c -0.277344 0 -0.5 
0.222656 -0.5 0.5 v 2 c 0 0.277344 0.222656 0.5 0.5 0.5 h 0.5 l -1 3 h 2 l 1 -3 v -2.5 c 0 -0.277344 
-0.222656 -0.5 -0.5 -0.5 z m 4 0 c -0.277344 0 -0.5 0.222656 -0.5 0.5 v 2 c 0 0.277344 0.222656 0.5 0.5 0.5 h 
0.5 l -1 3 h 2 l 1 -3 v -2.5 c 0 -0.277344 -0.222656 -0.5 -0.5 -0.5 z m 0 0" fill="#222222"/></svg>
diff --git a/src/resources/nautilus.gresource.xml b/src/resources/nautilus.gresource.xml
index 3a6abce9a..cf54b6f52 100644
--- a/src/resources/nautilus.gresource.xml
+++ b/src/resources/nautilus.gresource.xml
@@ -35,6 +35,7 @@
     <file>Checkerboard.png</file>
   </gresource>
   <gresource prefix="/org/gnome/nautilus/icons/scalable/actions/">
+    <file alias="quotation-symbolic.svg" preprocess="xml-stripblanks">icons/quotation-symbolic.svg</file>
     <file alias="funnel-symbolic.svg" preprocess="xml-stripblanks">icons/funnel-symbolic.svg</file>
     <file alias="external-link-symbolic.svg" 
preprocess="xml-stripblanks">icons/external-link-symbolic.svg</file>
   </gresource>
diff --git a/src/resources/ui/nautilus-name-cell.ui b/src/resources/ui/nautilus-name-cell.ui
index 4313b92d6..c1e810ac5 100644
--- a/src/resources/ui/nautilus-name-cell.ui
+++ b/src/resources/ui/nautilus-name-cell.ui
@@ -32,25 +32,6 @@
             <style>
               <class name="column-name-labels-box"/>
             </style>
-            <child>
-              <object class="GtkLabel" id="path">
-                <property name="visible">False</property>
-                <property name="ellipsize">start</property>
-                <property name="justify">left</property>
-                <property name="lines">2</property>
-                <property name="wrap">True</property>
-                <property name="wrap-mode">word-char</property>
-                <property name="halign">fill</property>
-                <property name="xalign">0.0</property>
-                <attributes>
-                  <attribute name="insert-hyphens" value="false"></attribute>
-                </attributes>
-                <style>
-                  <class name="caption"/>
-                  <class name="dim-label"/>
-                </style>
-              </object>
-            </child>
             <child>
               <object class="GtkBox">
                 <property name="orientation">horizontal</property>
@@ -80,23 +61,66 @@
               </object>
             </child>
             <child>
-              <object class="GtkLabel" id="snippet">
+              <object class="GtkLabel" id="path">
                 <property name="visible">False</property>
-                <property name="ellipsize">end</property>
+                <property name="ellipsize">start</property>
                 <property name="justify">left</property>
-                <property name="lines">2</property>
-                <property name="wrap">True</property>
-                <property name="wrap-mode">word</property>
                 <property name="halign">fill</property>
                 <property name="xalign">0.0</property>
+                <attributes>
+                  <attribute name="insert-hyphens" value="false"></attribute>
+                </attributes>
                 <style>
-                  <class name="caption-heading"/>
-                  <class name="accent"/>
+                  <class name="caption"/>
+                  <class name="dim-label"/>
                 </style>
               </object>
             </child>
           </object>
         </child>
+        <child>
+          <object class="GtkMenuButton" id="snippet_button">
+            <property name="visible">False</property>
+            <property name="icon-name">quotation-symbolic</property>
+            <property name="always-show-arrow">yes</property>
+            <property name="valign">center</property>
+            <style>
+              <class name="mini-pill"/>
+            </style>
+            <property name="popover">
+              <object class="GtkPopover">
+                <child>
+                  <object class="GtkBox">
+                    <property name="orientation">vertical</property>
+                    <property name="margin-top">12</property>
+                    <property name="margin-bottom">12</property>
+                    <property name="margin-start">12</property>
+                    <property name="margin-end">12</property>
+                    <property name="spacing">12</property>
+                    <child>
+                      <object class="GtkLabel">
+                        <property name="label" translatable="yes">File Content Match</property>
+                        <style>
+                          <class name="heading"/>
+                        </style>
+                      </object>
+                    </child>
+                    <child>
+                      <object class="GtkLabel" id="snippet">
+                        <property name="ellipsize">none</property>
+                        <property name="justify">left</property>
+                        <property name="lines">10</property>
+                        <property name="wrap">True</property>
+                        <property name="wrap-mode">word</property>
+                        <property name="halign">fill</property>
+                      </object>
+                    </child>
+                  </object>
+                </child>
+              </object>
+            </property>
+          </object>
+        </child>
       </object>
     </child>
   </template>
[Date Prev][Date Next] [Thread Prev][Thread Next] [Thread Index] [Date Index] [Author Index]