Rename StThemeImage to StBorderImage

The current CSS3 border-image is close to a superset of what we were
doing for -hippo-background-image. Woot! rename StThemeImage to
StBorderImage and change parsing to look for:

 border-image: <url> <number>...

Rather than

 -st-background-image: <url> <length>...

percentanges for the border sizes are not currently supported, neither
are the keywords for handling of the middle part. We always do 'stretch'
for now.

https://bugzilla.gnome.org/show_bug.cgi?id=595990

data/theme/gnome-shell.css

@@ -31,32 +31,32 @@ StScrollView
 
 StButton#up-stepper
 {
-  -st-background-image: url("scroll-button-up.png") 5px;
+  border-image: url("scroll-button-up.png") 5;
 }
 
 StButton#up-stepper:hover,
 StButton#up-stepper:active
 {
-  -st-background-image: url("scroll-button-up-hover.png") 5px;
+  border-image: url("scroll-button-up-hover.png") 5;
 }
 
 StButton#down-stepper
 {
-  -st-background-image: url("scroll-button-down.png") 5px;
+  border-image: url("scroll-button-down.png") 5;
 }
 
 StButton#down-stepper:hover,
 StButton#down-stepper:active
 {
-  -st-background-image: url("scroll-button-down-hover.png") 5px;
+  border-image: url("scroll-button-down-hover.png") 5;
 }
 
 StScrollBar StButton#vhandle
 {
-  -st-background-image: url("scroll-vhandle.png") 5px;
+  border-image: url("scroll-vhandle.png") 5;
 }
 
 StScrollBar StButton#vhandle:hover
 {
-  -st-background-image: url("scroll-vhandle.png") 5px;
+  border-image: url("scroll-vhandle.png") 5;
 }

src/Makefile-st.am

@@ -67,6 +67,7 @@ st-enum-types.c: stamp-st-enum-types.h st/st-enum-types.c.in
 st_source_h =					\
     st/st-adjustment.h				\
     st/st-bin.h					\
+    st/st-border-image.h			\
     st/st-box-layout.h				\
     st/st-box-layout-child.h			\
     st/st-button.h				\
@@ -81,7 +82,6 @@ st_source_h =					\
     st/st-texture-frame.h			\
     st/st-theme.h				\
     st/st-theme-context.h			\
-    st/st-theme-image.h				\
     st/st-theme-node.h				\
     st/st-tooltip.h				\
     st/st-types.h				\
@@ -96,6 +96,7 @@ st_source_private_h =				\
 st_source_c =					\
     st/st-adjustment.c				\
     st/st-bin.c					\
+    st/st-border-image.c			\
     st/st-box-layout.c				\
     st/st-box-layout-child.c			\
     st/st-button.c				\
@@ -111,7 +112,6 @@ st_source_c =					\
     st/st-texture-frame.c			\
     st/st-theme.c				\
     st/st-theme-context.c			\
-    st/st-theme-image.c				\
     st/st-theme-node.c				\
     st/st-tooltip.c				\
     st/st-widget.c				\

src/st/st-border-image.c

@@ -0,0 +1,92 @@
+/* -*- mode: C; c-file-style: "gnu"; indent-tabs-mode: nil; -*- */
+
+#include <config.h>
+
+#include "st-border-image.h"
+
+struct _StBorderImage {
+  GObject parent;
+
+  char *filename;
+  int border_top;
+  int border_right;
+  int border_bottom;
+  int border_left;
+};
+
+struct _StBorderImageClass {
+  GObjectClass parent_class;
+
+};
+
+G_DEFINE_TYPE (StBorderImage, st_border_image, G_TYPE_OBJECT)
+
+static void
+st_border_image_finalize (GObject *object)
+{
+  StBorderImage *image = ST_BORDER_IMAGE (object);
+
+  g_free (image->filename);
+
+  G_OBJECT_CLASS (st_border_image_parent_class)->finalize (object);
+}
+
+static void
+st_border_image_class_init (StBorderImageClass *klass)
+{
+  GObjectClass *object_class = G_OBJECT_CLASS (klass);
+
+  object_class->finalize = st_border_image_finalize;
+}
+
+static void
+st_border_image_init (StBorderImage *image)
+{
+}
+
+StBorderImage *
+st_border_image_new (const char *filename,
+                       int         border_top,
+                       int         border_right,
+                       int         border_bottom,
+                       int         border_left)
+{
+  StBorderImage *image;
+
+  image = g_object_new (ST_TYPE_BORDER_IMAGE, NULL);
+
+  image->filename = g_strdup (filename);
+  image->border_top = border_top;
+  image->border_right = border_right;
+  image->border_bottom = border_bottom;
+  image->border_left = border_left;
+
+  return image;
+}
+
+const char *
+st_border_image_get_filename (StBorderImage *image)
+{
+  g_return_val_if_fail (ST_IS_BORDER_IMAGE (image), NULL);
+
+  return image->filename;
+}
+
+void
+st_border_image_get_borders (StBorderImage *image,
+                             int           *border_top,
+                             int           *border_right,
+                             int           *border_bottom,
+                             int           *border_left)
+{
+  g_return_if_fail (ST_IS_BORDER_IMAGE (image));
+
+  if (border_top)
+    *border_top = image->border_top;
+  if (border_right)
+    *border_right = image->border_right;
+  if (border_bottom)
+    *border_bottom = image->border_bottom;
+  if (border_left)
+    *border_left = image->border_left;
+}

src/st/st-border-image.h

@@ -0,0 +1,38 @@
+/* -*- mode: C; c-file-style: "gnu"; indent-tabs-mode: nil; -*- */
+#ifndef __ST_BORDER_IMAGE_H__
+#define __ST_BORDER_IMAGE_H__
+
+#include <glib-object.h>
+
+G_BEGIN_DECLS
+
+/* A StBorderImage encapsulates an image with specified unscaled borders on each edge.
+ */
+typedef struct _StBorderImage      StBorderImage;
+typedef struct _StBorderImageClass StBorderImageClass;
+
+#define ST_TYPE_BORDER_IMAGE             (st_border_image_get_type ())
+#define ST_BORDER_IMAGE(object)          (G_TYPE_CHECK_INSTANCE_CAST ((object), ST_TYPE_BORDER_IMAGE, StBorderImage))
+#define ST_BORDER_IMAGE_CLASS(klass)     (G_TYPE_CHECK_CLASS_CAST ((klass), ST_TYPE_BORDER_IMAGE, StBorderImageClass))
+#define ST_IS_BORDER_IMAGE(object)       (G_TYPE_CHECK_INSTANCE_TYPE ((object), ST_TYPE_BORDER_IMAGE))
+#define ST_IS_BORDER_IMAGE_CLASS(klass)  (G_TYPE_CHECK_CLASS_TYPE ((klass), ST_TYPE_BORDER_IMAGE))
+#define ST_BORDER_IMAGE_GET_CLASS(obj)   (G_TYPE_INSTANCE_GET_CLASS ((obj), ST_TYPE_BORDER_IMAGE, StBorderImageClass))
+
+GType             st_border_image_get_type          (void) G_GNUC_CONST;
+
+StBorderImage *st_border_image_new (const char *filename,
+                                    int         border_top,
+                                    int         border_right,
+                                    int         border_bottom,
+                                    int         border_left);
+
+const char *st_border_image_get_filename (StBorderImage *image);
+void        st_border_image_get_borders  (StBorderImage *image,
+                                          int           *border_top,
+                                          int           *border_right,
+                                          int           *border_bottom,
+                                          int           *border_left);
+
+G_END_DECLS
+
+#endif /* __ST_BORDER_IMAGE_H__ */

src/st/st-theme-image.c

@@ -1,92 +0,0 @@
-/* -*- mode: C; c-file-style: "gnu"; indent-tabs-mode: nil; -*- */
-
-#include <config.h>
-
-#include "st-theme-image.h"
-
-struct _StThemeImage {
-  GObject parent;
-
-  char *filename;
-  int border_top;
-  int border_right;
-  int border_bottom;
-  int border_left;
-};
-
-struct _StThemeImageClass {
-  GObjectClass parent_class;
-
-};
-
-G_DEFINE_TYPE (StThemeImage, st_theme_image, G_TYPE_OBJECT)
-
-static void
-st_theme_image_finalize (GObject *object)
-{
-  StThemeImage *image = ST_THEME_IMAGE (object);
-
-  g_free (image->filename);
-
-  G_OBJECT_CLASS (st_theme_image_parent_class)->finalize (object);
-}
-
-static void
-st_theme_image_class_init (StThemeImageClass *klass)
-{
-  GObjectClass *object_class = G_OBJECT_CLASS (klass);
-
-  object_class->finalize = st_theme_image_finalize;
-}
-
-static void
-st_theme_image_init (StThemeImage *image)
-{
-}
-
-StThemeImage *
-st_theme_image_new (const char *filename,
-                    int         border_top,
-                    int         border_right,
-                    int         border_bottom,
-                    int         border_left)
-{
-  StThemeImage *image;
-
-  image = g_object_new (ST_TYPE_THEME_IMAGE, NULL);
-
-  image->filename = g_strdup (filename);
-  image->border_top = border_top;
-  image->border_right = border_right;
-  image->border_bottom = border_bottom;
-  image->border_left = border_left;
-
-  return image;
-}
-
-const char *
-st_theme_image_get_filename (StThemeImage *image)
-{
-  g_return_val_if_fail (ST_IS_THEME_IMAGE (image), NULL);
-
-  return image->filename;
-}
-
-void
-st_theme_image_get_borders (StThemeImage *image,
-                            int          *border_top,
-                            int          *border_right,
-                            int          *border_bottom,
-                            int          *border_left)
-{
-  g_return_if_fail (ST_IS_THEME_IMAGE (image));
-
-  if (border_top)
-    *border_top = image->border_top;
-  if (border_right)
-    *border_right = image->border_right;
-  if (border_bottom)
-    *border_bottom = image->border_bottom;
-  if (border_left)
-    *border_left = image->border_left;
-}

src/st/st-theme-image.h

@@ -1,38 +0,0 @@
-/* -*- mode: C; c-file-style: "gnu"; indent-tabs-mode: nil; -*- */
-#ifndef __ST_THEME_IMAGE_H__
-#define __ST_THEME_IMAGE_H__
-
-#include <glib-object.h>
-
-G_BEGIN_DECLS
-
-/* A StThemeImage encapsulates an image with specified unscaled borders on each edge.
- */
-typedef struct _StThemeImage      StThemeImage;
-typedef struct _StThemeImageClass StThemeImageClass;
-
-#define ST_TYPE_THEME_IMAGE             (st_theme_image_get_type ())
-#define ST_THEME_IMAGE(object)          (G_TYPE_CHECK_INSTANCE_CAST ((object), ST_TYPE_THEME_IMAGE, StThemeImage))
-#define ST_THEME_IMAGE_CLASS(klass)     (G_TYPE_CHECK_CLASS_CAST ((klass), ST_TYPE_THEME_IMAGE, StThemeImageClass))
-#define ST_IS_THEME_IMAGE(object)       (G_TYPE_CHECK_INSTANCE_TYPE ((object), ST_TYPE_THEME_IMAGE))
-#define ST_IS_THEME_IMAGE_CLASS(klass)  (G_TYPE_CHECK_CLASS_TYPE ((klass), ST_TYPE_THEME_IMAGE))
-#define ST_THEME_IMAGE_GET_CLASS(obj)   (G_TYPE_INSTANCE_GET_CLASS ((obj), ST_TYPE_THEME_IMAGE, StThemeImageClass))
-
-GType             st_theme_image_get_type          (void) G_GNUC_CONST;
-
-StThemeImage *st_theme_image_new (const char *filename,
-                                  int         border_top,
-                                  int         border_right,
-                                  int         border_bottom,
-                                  int         border_left);
-
-const char *st_theme_image_get_filename (StThemeImage *image);
-void        st_theme_image_get_borders  (StThemeImage *image,
-                                         int          *border_top,
-                                         int          *border_right,
-                                         int          *border_bottom,
-                                         int          *border_left);
-
-G_END_DECLS
-
-#endif /* __ST_THEME_IMAGE_H__ */

src/st/st-theme-node.c

@@ -29,7 +29,7 @@ struct _StThemeNode {
   guint padding[4];
 
   char *background_image;
-  StThemeImage *background_theme_image;
+  StBorderImage *border_image;
 
   GType element_type;
   char *element_id;
@@ -47,7 +47,7 @@ struct _StThemeNode {
   guint borders_computed : 1;
   guint background_computed : 1;
   guint foreground_computed : 1;
-  guint background_theme_image_computed : 1;
+  guint border_image_computed : 1;
   guint link_type : 2;
 };
 
@@ -103,10 +103,10 @@ st_theme_node_finalize (GObject *object)
       node->font_desc = NULL;
     }
 
-  if (node->background_theme_image)
+  if (node->border_image)
     {
-      g_object_unref (node->background_theme_image);
+      g_object_unref (node->border_image);
-      node->background_theme_image = NULL;
+      node->border_image = NULL;
     }
 
   if (node->background_image)
@@ -1838,24 +1838,24 @@ st_theme_node_get_font (StThemeNode *node)
 }
 
 /**
- * st_theme_node_get_background_theme_image:
+ * st_theme_node_get_border_image:
  * @node: a #StThemeNode
  *
- * Gets the value for the -st-background-image style property
+ * Gets the value for the border-image style property
  *
- * Return value: (transfer none): the background image, or %NULL
+ * Return value: (transfer none): the border image, or %NULL
- *   if there is no background theme image.
+ *   if there is no border image.
  */
-StThemeImage *
+StBorderImage *
-st_theme_node_get_background_theme_image (StThemeNode *node)
+st_theme_node_get_border_image (StThemeNode *node)
 {
   int i;
 
-  if (node->background_theme_image_computed)
+  if (node->border_image_computed)
-    return node->background_theme_image;
+    return node->border_image;
 
-  node->background_theme_image = NULL;
+  node->border_image = NULL;
-  node->background_theme_image_computed = TRUE;
+  node->border_image_computed = TRUE;
 
   ensure_properties (node);
 
@@ -1863,11 +1863,11 @@ st_theme_node_get_background_theme_image (StThemeNode *node)
     {
       CRDeclaration *decl = node->properties[i];
 
-      if (strcmp (decl->property->stryng->str, "-st-background-image") == 0)
+      if (strcmp (decl->property->stryng->str, "border-image") == 0)
         {
           CRTerm *term = decl->value;
-          int lengths[4];
+          int borders[4];
-          int n_lengths = 0;
+          int n_borders = 0;
           int i;
 
           const char *url;
@@ -1886,46 +1886,57 @@ st_theme_node_get_background_theme_image (StThemeNode *node)
 
           term = term->next;
 
-          /* Followed by 0 to 4 lengths */
+          /* Followed by 0 to 4 numbers or percentages. *Not lengths*. The interpretation
+           * of a number is supposed to be pixels if the image is pixel based, otherwise CSS pixels.
+           */
           for (i = 0; i < 4; i++)
             {
-              double value;
-
               if (term == NULL)
                 break;
 
-              if (get_length_from_term (node, term, FALSE, &value) != VALUE_FOUND)
+              if (term->type != TERM_NUMBER)
                 goto next_property;
 
-              lengths[n_lengths] = (int)(0.5 + value);
+              if (term->content.num->type == NUM_GENERIC)
-              n_lengths++;
+                {
+                  borders[n_borders] = round (0.5 + term->content.num->val);
+                  n_borders++;
+                }
+              else if (term->content.num->type == NUM_PERCENTAGE)
+                {
+                  /* This would be easiest to support if we moved image handling into StBorderImage */
+                  g_warning ("Percentages not supported for border-image");
+                  goto next_property;
+                }
+              else
+                goto next_property;
 
               term = term->next;
             }
 
-          switch (n_lengths)
+          switch (n_borders)
             {
             case 0:
               border_top = border_right = border_bottom = border_left = 0;
               break;
             case 1:
-              border_top = border_right = border_bottom = border_left = lengths[0];
+              border_top = border_right = border_bottom = border_left = borders[0];
               break;
             case 2:
-              border_top = border_bottom = lengths[0];
+              border_top = border_bottom = borders[0];
-              border_left = border_right = lengths[1];
+              border_left = border_right = borders[1];
               break;
             case 3:
-              border_top = lengths[0];
+              border_top = borders[0];
-              border_left = border_right = lengths[1];
+              border_left = border_right = borders[1];
-              border_bottom = lengths[2];
+              border_bottom = borders[2];
               break;
             case 4:
             default:
-              border_top = lengths[0];
+              border_top = borders[0];
-              border_right = lengths[1];
+              border_right = borders[1];
-              border_bottom = lengths[2];
+              border_bottom = borders[2];
-              border_left = lengths[3];
+              border_left = borders[3];
               break;
             }
 
@@ -1933,12 +1944,12 @@ st_theme_node_get_background_theme_image (StThemeNode *node)
           if (filename == NULL)
             goto next_property;
 
-          node->background_theme_image = st_theme_image_new (filename,
+          node->border_image = st_border_image_new (filename,
                                                     border_top, border_right, border_bottom, border_left);
 
           g_free (filename);
 
-          return node->background_theme_image;
+          return node->border_image;
         }
 
     next_property:

src/st/st-theme-node.h

@@ -3,7 +3,7 @@
 #define __ST_THEME_NODE_H__
 
 #include <clutter/clutter.h>
-#include "st-theme-image.h"
+#include "st-border-image.h"
 
 G_BEGIN_DECLS
 
@@ -126,10 +126,7 @@ StTextDecoration st_theme_node_get_text_decoration (StThemeNode *node);
  */
 const PangoFontDescription *st_theme_node_get_font (StThemeNode *node);
 
-/* This is the getter for -st-background-image, which is different from
+StBorderImage *st_theme_node_get_border_image (StThemeNode *node);
- * background-image in having provisions for unscaled borders.
- */
-StThemeImage *st_theme_node_get_background_theme_image (StThemeNode *node);
 
 /* Helpers for get_preferred_width()/get_preferred_height() ClutterActor vfuncs */
 void st_theme_node_adjust_for_height       (StThemeNode  *node,

src/st/st-widget.c

@@ -480,7 +480,7 @@ st_widget_real_style_changed (StWidget *self)
 {
   StWidgetPrivate *priv = ST_WIDGET (self)->priv;
   StThemeNode *theme_node;
-  StThemeImage *theme_image;
+  StBorderImage *border_image;
   StTextureCache *texture_cache;
   ClutterTexture *texture;
   const char *bg_file = NULL;
@@ -577,14 +577,14 @@ st_widget_real_style_changed (StWidget *self)
    * and a single background image above it.
    */
 
-  theme_image = st_theme_node_get_background_theme_image (theme_node);
+  border_image = st_theme_node_get_border_image (theme_node);
-  if (theme_image)
+  if (border_image)
     {
       const char *filename;
       gint border_left, border_right, border_top, border_bottom;
       gint width, height;
 
-      filename = st_theme_image_get_filename (theme_image);
+      filename = st_border_image_get_filename (border_image);
 
       /* `border-image' takes precedence over `background-image'.
        * Firefox lets the background-image shine thru when border-image has
@@ -595,7 +595,7 @@ st_widget_real_style_changed (StWidget *self)
       clutter_texture_get_base_size (CLUTTER_TEXTURE (texture),
                                      &width, &height);
 
-      st_theme_image_get_borders (theme_image,
+      st_border_image_get_borders (border_image,
                                    &border_left, &border_right, &border_top, &border_bottom);
 
       priv->border_image = st_texture_frame_new (texture,

tests/testcommon/test.css

@@ -34,7 +34,7 @@ stage {
 
 .border-image {
     border: 15px;
-    -st-background-image: url('border-image.png') 16px;
+    border-image: url('border-image.png') 16;
 }
 
 StButton {