[gnome-shell/T27795: 33/138] st: Implement more CSS gradient options



commit 93153b762f4c5ab53ce8d276e299c2cef2bc243a
Author: Georges Basile Stavracas Neto <georges stavracas gmail com>
Date:   Fri Dec 8 17:29:36 2017 -0200

    st: Implement more CSS gradient options
    
    In order to implement the Endless Toggle Button with the curved
    edge, the currently supported gradient CSS properties are not
    enough.
    
    This commit implements three new CSS gradient-related properties:
    
     - background-gradient-radius
     - background-gradient-stop
     - background-gradient-position
    
    This is obviously deviating from the CSS specs, but so it is the
    current CSS properties. This is just the absolute minimum we need
    in order to implement the Endless Toggle Button with curved edges.
    
    https://phabricator.endlessm.com/T20325

 src/st/st-theme-node-drawing.c | 34 ++++++++++++++++++++++++++++++----
 src/st/st-theme-node-private.h |  6 ++++++
 src/st/st-theme-node.c         | 41 +++++++++++++++++++++++++++++++++++++++++
 3 files changed, 77 insertions(+), 4 deletions(-)
---
diff --git a/src/st/st-theme-node-drawing.c b/src/st/st-theme-node-drawing.c
index c2d4ccf839..f8c336cd5f 100644
--- a/src/st/st-theme-node-drawing.c
+++ b/src/st/st-theme-node-drawing.c
@@ -605,11 +605,25 @@ create_cairo_pattern_of_background_gradient (StThemeNode *node,
     pattern = cairo_pattern_create_linear (0, 0, width, 0);
   else
     {
-      gdouble cx, cy;
+      gdouble cx, cy, radius;
 
-      cx = width / 2.;
-      cy = height / 2.;
-      pattern = cairo_pattern_create_radial (cx, cy, 0, cx, cy, MIN (cx, cy));
+      if (node->background_gradient_position_set)
+        {
+          cx = node->background_gradient_position_x;
+          cy = node->background_gradient_position_y;
+        }
+      else
+        {
+          cx = width / 2.;
+          cy = height / 2.;
+        }
+
+      if (node->background_gradient_radius != -1)
+        radius = node->background_gradient_radius;
+      else
+        radius = MIN (width / 2., height / 2.);
+
+      pattern = cairo_pattern_create_radial (cx, cy, 0, cx, cy, radius);
     }
 
   cairo_pattern_add_color_stop_rgba (pattern, 0,
@@ -617,6 +631,18 @@ create_cairo_pattern_of_background_gradient (StThemeNode *node,
                                      node->background_color.green / 255.,
                                      node->background_color.blue / 255.,
                                      node->background_color.alpha / 255.);
+
+  /* Add an intermediate stop when any is set */
+  if (node->background_gradient_stop_position != -1)
+    {
+      cairo_pattern_add_color_stop_rgba (pattern,
+                                         CLAMP (((float) node->background_gradient_stop_position) / width, 
0., 1.),
+                                         node->background_color.red / 255.,
+                                         node->background_color.green / 255.,
+                                         node->background_color.blue / 255.,
+                                         node->background_color.alpha / 255.);
+    }
+
   cairo_pattern_add_color_stop_rgba (pattern, 1,
                                      node->background_gradient_end.red / 255.,
                                      node->background_gradient_end.green / 255.,
diff --git a/src/st/st-theme-node-private.h b/src/st/st-theme-node-private.h
index 47be65dba8..e4299265b3 100644
--- a/src/st/st-theme-node-private.h
+++ b/src/st/st-theme-node-private.h
@@ -44,6 +44,12 @@ struct _StThemeNode {
   StGradientType background_gradient_type;
   ClutterColor background_gradient_end;
 
+  guint background_gradient_position_set : 1;
+  int background_gradient_position_x;
+  int background_gradient_position_y;
+  int background_gradient_stop_position;
+  int background_gradient_radius;
+
   int background_position_x;
   int background_position_y;
 
diff --git a/src/st/st-theme-node.c b/src/st/st-theme-node.c
index 1261e92573..5c33b0df37 100644
--- a/src/st/st-theme-node.c
+++ b/src/st/st-theme-node.c
@@ -46,6 +46,8 @@ static void
 st_theme_node_init (StThemeNode *node)
 {
   node->transition_duration = -1;
+  node->background_gradient_stop_position = -1;
+  node->background_gradient_radius = -1;
 
   st_theme_node_paint_state_init (&node->cached_state);
 }
@@ -2179,6 +2181,45 @@ _st_theme_node_ensure_background (StThemeNode *node)
         {
           get_color_from_term (node, decl->value, &node->background_gradient_end);
         }
+      else if (strcmp (property_name, "-gradient-position") == 0)
+        {
+          GetFromTermResult result = get_length_from_term_int (node, decl->value, FALSE, 
&node->background_gradient_position_x);
+          if (result == VALUE_NOT_FOUND)
+            {
+              node->background_gradient_position_set = FALSE;
+              continue;
+            }
+          else
+            node->background_gradient_position_set = TRUE;
+
+          result = get_length_from_term_int (node, decl->value->next, FALSE, 
&node->background_gradient_position_y);
+
+          if (result == VALUE_NOT_FOUND)
+            {
+              node->background_gradient_position_set = FALSE;
+              continue;
+            }
+          else
+            node->background_gradient_position_set = TRUE;
+        }
+      else if (strcmp (property_name, "-gradient-stop") == 0)
+        {
+          GetFromTermResult result = get_length_from_term_int (node, decl->value, FALSE, 
&node->background_gradient_stop_position);
+          if (result == VALUE_NOT_FOUND)
+            {
+              node->background_gradient_stop_position = -1;
+              continue;
+            }
+        }
+      else if (strcmp (property_name, "-gradient-radius") == 0)
+        {
+          GetFromTermResult result = get_length_from_term_int (node, decl->value, FALSE, 
&node->background_gradient_radius);
+          if (result == VALUE_NOT_FOUND)
+            {
+              node->background_gradient_radius = -1;
+              continue;
+            }
+        }
     }
 }
 


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