Created attachment 353381 [details] [review]
document css change example

This patch is an example of how we can change the style of the document loaded injecting javascript.

In this patch I only change body style property, but we can add html elements and styles so we can do anything.

(In reply to Daniel Garcia from comment #1)
> Created attachment 353381 [details] [review] [review]
> document css change example
> 
> This patch is an example of how we can change the style of the document
> loaded injecting javascript.
> 
> In this patch I only change body style property, but we can add html
> elements and styles so we can do anything.

Could you please make the .css a separate file to be added to the GResources? That would make it easier to manage and avoid excessive quoting.

CC:ing Lapo and Jimmac

Created attachment 353440 [details] [review]
document css change example

This new patch uses a resource file called epub.css where you can define the css that will be applied to all epub docs.

I've also added a div '#epubwrap', to be able to style it, intead the body, so all the book content is inside this div. I think this can be useful.

And to make it easiest to debug and play with styles, I've enabled the dev tools of the webview widget, so now you can right click in the book content and inspect the html and edit the css and html in live.

Created attachment 366915 [details] [review]
epub style change example code

This will be the base code to add custom styles to the book view of epub
documents. It's a webkitwebview so we can run javascript and change the
body styles.

Fixed those bugs in the new patch (from bug 792541):

Gjs-Message: 18:37:27.180: JS WARNING: [resource:///org/gnome/Books/js/epubview.js 89]: Too many arguments to method WebKit2.WebView.run_javascript: expected 3, got 4
    Gjs-Message: 18:37:27.181: JS WARNING: [resource:///org/gnome/Books/js/epubview.js 98]: Too many arguments to method Gio.File.read: expected 1, got 2
    Gjs-Message: 18:37:27.183: JS WARNING: [resource:///org/gnome/Books/js/epubview.js 109]: Too many arguments to method WebKit2.WebView.run_javascript: expected 3, got 4

*** Bug 792541 has been marked as a duplicate of this bug. ***

Review of attachment 366915 [details] [review]:

Generally looks good to me with a few comments, but I assume we'll have to adjust the style before pushing this?

::: src/epubview.js
@@ +86,3 @@
+                      'document.body.innerHTML = \'<div id="gepubwrap">\'',
+                      '+ document.body.innerHTML + "</div>";'].join('');
+            this.view.run_javascript(js, null, null);

Why is the wrapper needed? It does not seem like either the CSS or the later JS use this ID.

@@ +89,3 @@
+
+            let file = Gio.File.new_for_uri("resource:///org/gnome/Documents/epub.css");
+                      'document.body.innerHTML = \'<div id="gepubwrap">\'',

Please use single quotes consistently.

@@ +96,3 @@
+                null).get_size();
+            let stream = file.read(null);
+            let file = Gio.File.new_for_uri("resource:///org/gnome/Documents/epub.css");

You can probably just call stream.read_all() instead of looking at the file size beforehand. Or use something like g_resources_lookup_data() which gives you a GBytes directly.

GNOME is going to shut down bugzilla.gnome.org in favor of gitlab.gnome.org.
As part of that, we are mass-closing older open tickets in bugzilla.gnome.org
which have not seen updates for a longer time (resources are unfortunately
quite limited so not every ticket can get handled).

If you can still reproduce the situation described in this ticket in a recent
and supported software version, then please follow
  https://wiki.gnome.org/GettingInTouch/BugReportingGuidelines
and create a new ticket at
  https://gitlab.gnome.org/GNOME/gnome-documents/-/issues/

Thank you for your understanding and your help.