Flip more bookmark folder images in RTL.

This flips the bookmark bar, bookmark menu, and bookmark manager folder images
in RTL.  The bookmark edit dialog already used flipped folders.

Bug: none
Change-Id: Ifb91e1f534faa2bd102d18cd2ef632673474d116
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1677726Reviewed-by: Tommy Li <tommycli@chromium.org>
Reviewed-by: Michael Wasserman <msw@chromium.org>
Reviewed-by: calamity <calamity@chromium.org>
Commit-Queue: Peter Kasting <pkasting@chromium.org>
Cr-Commit-Position: refs/heads/master@{#672790}

chrome/browser/resources/bookmarks/shared_style.html

@@ -68,6 +68,10 @@
         -webkit-mask-image: url(images/folder_open.svg);
       }
 
+      :host-context([dir=rtl]) .folder-icon {
+        transform: scaleX(-1);
+      }
+
       .website-icon {
         background-repeat: no-repeat;
         height: 16px;

chrome/browser/ui/bookmarks/bookmark_utils.cc

@@ -34,8 +34,11 @@
 #endif
 
 #if defined(TOOLKIT_VIEWS)
+#include "ui/gfx/canvas.h"
 #include "ui/gfx/color_utils.h"
+#include "ui/gfx/image/image_skia_source.h"
 #include "ui/gfx/paint_vector_icon.h"
+#include "ui/gfx/scoped_canvas.h"
 #endif
 
 #if defined(OS_WIN) || defined(OS_MACOSX)
@@ -94,12 +97,33 @@ BookmarkShortcutDisposition GetBookmarkShortcutDisposition(Profile* profile) {
   return BOOKMARK_SHORTCUT_DISPOSITION_UNCHANGED;
 }
 
-#if defined(TOOLKIT_VIEWS) && !defined(OS_WIN) && !defined(OS_MACOSX)
+#if defined(TOOLKIT_VIEWS)
+// Image source that flips the supplied source image in RTL.
+class RTLFlipSource : public gfx::ImageSkiaSource {
+ public:
+  explicit RTLFlipSource(gfx::ImageSkia source) : source_(std::move(source)) {}
+  ~RTLFlipSource() override = default;
+
+  // gfx::ImageSkiaSource:
+  gfx::ImageSkiaRep GetImageForScale(float scale) override {
+    gfx::Canvas canvas(source_.size(), scale, false);
+    gfx::ScopedCanvas scoped_canvas(&canvas);
+    scoped_canvas.FlipIfRTL(source_.width());
+    canvas.DrawImageInt(source_, 0, 0);
+    return gfx::ImageSkiaRep(canvas.GetBitmap(), scale);
+  }
+
+ private:
+  const gfx::ImageSkia source_;
+};
+
+#if !defined(OS_WIN) && !defined(OS_MACOSX)
 gfx::ImageSkia GetFolderIcon(const gfx::VectorIcon& icon, SkColor text_color) {
   return gfx::CreateVectorIcon(icon,
                                color_utils::DeriveDefaultIconColor(text_color));
 }
-#endif
+#endif  // !defined(OS_WIN) && !defined(OS_MACOSX)
+#endif  // defined(TOOLKIT_VIEWS)
 
 }  // namespace
 
@@ -295,41 +319,45 @@ bool IsValidBookmarkDropLocation(Profile* profile,
 #if defined(TOOLKIT_VIEWS)
 // TODO(bsep): vectorize the Windows versions: crbug.com/564112
 gfx::ImageSkia GetBookmarkFolderIcon(SkColor text_color) {
+  gfx::ImageSkia folder;
 #if defined(OS_WIN)
-  return *ui::ResourceBundle::GetSharedInstance().GetImageSkiaNamed(
+  folder = *ui::ResourceBundle::GetSharedInstance().GetImageSkiaNamed(
       IDR_BOOKMARK_BAR_FOLDER);
 #elif defined(OS_MACOSX)
   int resource_id = color_utils::IsDark(text_color)
                         ? IDR_BOOKMARK_BAR_FOLDER
                         : IDR_BOOKMARK_BAR_FOLDER_WHITE;
-  return *ui::ResourceBundle::GetSharedInstance()
-              .GetNativeImageNamed(resource_id)
-              .ToImageSkia();
+  folder = *ui::ResourceBundle::GetSharedInstance()
+                .GetNativeImageNamed(resource_id)
+                .ToImageSkia();
 #else
-  return GetFolderIcon(ui::MaterialDesignController::touch_ui()
-                           ? vector_icons::kFolderTouchIcon
-                           : vector_icons::kFolderIcon,
-                       text_color);
+  folder = GetFolderIcon(ui::MaterialDesignController::touch_ui()
+                             ? vector_icons::kFolderTouchIcon
+                             : vector_icons::kFolderIcon,
+                         text_color);
 #endif
+  return gfx::ImageSkia(std::make_unique<RTLFlipSource>(folder), folder.size());
 }
 
 gfx::ImageSkia GetBookmarkManagedFolderIcon(SkColor text_color) {
+  gfx::ImageSkia folder;
 #if defined(OS_WIN)
-  return *ui::ResourceBundle::GetSharedInstance().GetImageSkiaNamed(
+  folder = *ui::ResourceBundle::GetSharedInstance().GetImageSkiaNamed(
       IDR_BOOKMARK_BAR_FOLDER_MANAGED);
 #elif defined(OS_MACOSX)
   int resource_id = color_utils::IsDark(text_color)
                         ? IDR_BOOKMARK_BAR_FOLDER_MANAGED
                         : IDR_BOOKMARK_BAR_FOLDER_MANAGED_WHITE;
-  return *ui::ResourceBundle::GetSharedInstance()
-              .GetNativeImageNamed(resource_id)
-              .ToImageSkia();
+  folder = *ui::ResourceBundle::GetSharedInstance()
+                .GetNativeImageNamed(resource_id)
+                .ToImageSkia();
 #else
-  return GetFolderIcon(ui::MaterialDesignController::touch_ui()
-                           ? vector_icons::kFolderManagedTouchIcon
-                           : vector_icons::kFolderManagedIcon,
-                       text_color);
+  folder = GetFolderIcon(ui::MaterialDesignController::touch_ui()
+                             ? vector_icons::kFolderManagedTouchIcon
+                             : vector_icons::kFolderManagedIcon,
+                         text_color);
 #endif
+  return gfx::ImageSkia(std::make_unique<RTLFlipSource>(folder), folder.size());
 }
 #endif
 

ui/webui/resources/css/tree.css

@@ -119,7 +119,6 @@ html[dir=rtl] .tree-label {
       url(../../../views/resources/default_200_percent/common/folder_open.png) 2x);
 }
 
-<if expr="not is_macosx and not is_ios">
 html[dir=rtl] .tree-label,
 html[dir=rtl] .tree-row[may-have-children] > .tree-label {
   background-image: -webkit-image-set(
@@ -132,7 +131,6 @@ html[dir=rtl] .tree-item[expanded] > .tree-row > .tree-label {
      url(../../../views/resources/default_100_percent/common/folder_open_rtl.png) 1x,
      url(../../../views/resources/default_200_percent/common/folder_open_rtl.png) 2x);
 }
-</if>
 
 tree[icon-visibility=hidden] .tree-label {
   background-image: none !important;