[gnome-builder] omnibar: provide visual feedback about build success/failure



commit 69b7e0a19f5af32d8882d89529a09aadc7f588e0
Author: Christian Hergert <chergert redhat com>
Date:   Fri Mar 9 16:21:39 2018 -0800

    omnibar: provide visual feedback about build success/failure
    
    Currently, you often have to peek into the omnibar to get the status of
    the build. This gives us just a bit more feedback as to what happened with
    a subtle background color on the fake entry box.
    
    It would be nice to get some feedback from designers here, into better
    ways to give this feedback that is not so dependent on color.

 data/themes/Adwaita-shared.css        |  2 ++
 data/themes/shared/shared-omnibar.css | 24 ++++++++++++++++++++++++
 src/libide/workbench/ide-omni-bar.c   | 30 ++++++++++++++++++++++++++++++
 3 files changed, 56 insertions(+)
---
diff --git a/data/themes/Adwaita-shared.css b/data/themes/Adwaita-shared.css
index 257da25e4..73a6a2856 100644
--- a/data/themes/Adwaita-shared.css
+++ b/data/themes/Adwaita-shared.css
@@ -1,5 +1,7 @@
 @import url("resource:///org/gnome/builder/themes/shared.css");
 
+@define-color build_success_color @theme_selected_bg_color;
+
 idelayoutstackheader > button:last-child {
   margin-right: 3px;
 }
diff --git a/data/themes/shared/shared-omnibar.css b/data/themes/shared/shared-omnibar.css
index 88580379b..521e18af2 100644
--- a/data/themes/shared/shared-omnibar.css
+++ b/data/themes/shared/shared-omnibar.css
@@ -24,3 +24,27 @@ omnibar:active entry {
   background-color: mix(@theme_bg_color, @content_view_bg, 0.9);
   color: @theme_fg_color;
 }
+
+@define-color build_success_color @success_color;
+@define-color build_error_color @error_color;
+
+@keyframes build-success-animation {
+  0% { background: transparent; }
+  50% { background: alpha(@build_success_color, 0.15); }
+}
+
+@keyframes build-failure-animation {
+  0% { background: transparent; }
+  50% { background: alpha(@build_error_color, 0.15); }
+}
+
+omnibar.build-success entry {
+  animation: build-success-animation 1s 1 ease-in-out;
+  background: alpha(@build_success_color, 0.1);
+}
+
+
+omnibar.build-failure entry {
+  animation: build-failure-animation 1s 1 ease-in-out;
+  background: alpha(@build_error_color, 0.1);
+}
diff --git a/src/libide/workbench/ide-omni-bar.c b/src/libide/workbench/ide-omni-bar.c
index fee334929..b92d0762d 100644
--- a/src/libide/workbench/ide-omni-bar.c
+++ b/src/libide/workbench/ide-omni-bar.c
@@ -95,6 +95,12 @@ struct _IdeOmniBar
    */
   DzlBindingGroup *vcs_bindings;
 
+  /*
+   * The phase we're advancing to in the pipeline. We can use this to
+   * ignore being visually spammy for irrelevant things.
+   */
+  IdeBuildPhase advancing_to;
+
   /*
    * Used to bind the pipeline message to the omnibar popover label,
    * while the build is active.
@@ -485,6 +491,7 @@ ide_omni_bar__build_manager__build_started (IdeOmniBar       *self,
                                             IdeBuildPipeline *build_pipeline,
                                             IdeBuildManager  *build_manager)
 {
+  GtkStyleContext *style_context;
   const gchar *display_name;
   IdeRuntime *runtime;
 
@@ -494,6 +501,11 @@ ide_omni_bar__build_manager__build_started (IdeOmniBar       *self,
 
   self->did_build = TRUE;
   self->seen_count = 0;
+  self->advancing_to = ide_build_pipeline_get_requested_phase (build_pipeline);
+
+  style_context = gtk_widget_get_style_context (GTK_WIDGET (self));
+  gtk_style_context_remove_class (style_context, "build-success");
+  gtk_style_context_remove_class (style_context, "build-failure");
 
   self->message_handler =
     g_signal_connect_object (build_pipeline,
@@ -521,10 +533,19 @@ ide_omni_bar__build_manager__build_failed (IdeOmniBar       *self,
                                            IdeBuildPipeline *build_pipeline,
                                            IdeBuildManager  *build_manager)
 {
+  GtkStyleContext *style_context;
+
   g_assert (IDE_IS_OMNI_BAR (self));
   g_assert (IDE_IS_BUILD_PIPELINE (build_pipeline));
   g_assert (IDE_IS_BUILD_MANAGER (build_manager));
 
+  /* try not to spam too hard visually for pre-build failures */
+  if (self->advancing_to > IDE_BUILD_PHASE_CONFIGURE)
+    {
+      style_context = gtk_widget_get_style_context (GTK_WIDGET (self));
+      gtk_style_context_add_class (style_context, "build-failure");
+    }
+
   gtk_label_set_label (self->popover_build_message, NULL);
   dzl_clear_signal_handler (build_pipeline, &self->message_handler);
 
@@ -539,10 +560,19 @@ ide_omni_bar__build_manager__build_finished (IdeOmniBar       *self,
                                              IdeBuildPipeline *build_pipeline,
                                              IdeBuildManager  *build_manager)
 {
+  GtkStyleContext *style_context;
+
   g_assert (IDE_IS_OMNI_BAR (self));
   g_assert (IDE_IS_BUILD_PIPELINE (build_pipeline));
   g_assert (IDE_IS_BUILD_MANAGER (build_manager));
 
+  /* try not to spam too hard visually for pre-build failures */
+  if (self->advancing_to > IDE_BUILD_PHASE_CONFIGURE)
+    {
+      style_context = gtk_widget_get_style_context (GTK_WIDGET (self));
+      gtk_style_context_add_class (style_context, "build-success");
+    }
+
   gtk_label_set_label (self->popover_build_message, NULL);
   dzl_clear_signal_handler (build_pipeline, &self->message_handler);
 


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]