emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed
From: Timothy <tecosaur@gmail.com>
To: org-mode-email <emacs-orgmode@gnu.org>
Subject: [PATCH] Use <img> tags for SVGs
Date: Wed, 07 Apr 2021 19:24:26 +0800	[thread overview]
Message-ID: <87k0pemj6d.fsf@gmail.com> (raw)

[-- Attachment #1: Type: text/plain, Size: 455 bytes --]

Hey everyone,

This is the first patch addressing an item raised in
https://orgmode.org/list/87sga4914t.fsf@gmail.com/ [subject: W3C
violations in Org's HTML export].

For more information see the email mentioned above and/or the commit
message.
It's worth nothing that the current approach isn't just "not great", but
actually causes some issues. For instance, in the ox-html export of my
Emacs config, here's an SVG generated by Gnuplot with org-plot:


[-- Attachment #2: svg-object.png --]
[-- Type: image/png, Size: 45527 bytes --]

[-- Attachment #3: Type: text/plain, Size: 66 bytes --]


If I just change <object> to <img> this is much better behaved:


[-- Attachment #4: svg-img.png --]
[-- Type: image/png, Size: 47244 bytes --]

[-- Attachment #5: Type: text/plain, Size: 69 bytes --]


Anyway, that's enough preamble --- here's the patch :)

--
Timothy


[-- Warning: decoded text below may be mangled, UTF-8 assumed --]
[-- Attachment #6: 0001-ox-html-Use-img-tags-for-svgs-not-object.patch --]
[-- Type: text/x-patch, Size: 3210 bytes --]

From 9c041f16a947309d47c5a162146946268788d459 Mon Sep 17 00:00:00 2001
From: TEC <tec@tecosaur.com>
Date: Wed, 7 Apr 2021 19:07:53 +0800
Subject: [PATCH] ox-html: Use <img> tags for svgs, not <object>

* lisp/ox-html.el (org-html--format-image, org-html--svg-image): Remove
special treatment of SVGs with <object>, and just use <img>.  This used
to be poorly supported, but since Firefox 4 / Chrome 28 / Safari 9 this
is no longer a concern (https://caniuse.com/svg-img) and the last
browser release that didn't support SVG images was in 2010 (SVG data
URIs took until 2015 to be fully supported, but this is a lesser
concern).
---
 lisp/ox-html.el | 49 ++++++++++++-------------------------------------
 1 file changed, 12 insertions(+), 37 deletions(-)

diff --git a/lisp/ox-html.el b/lisp/ox-html.el
index 89da823e8..adda7365e 100644
--- a/lisp/ox-html.el
+++ b/lisp/ox-html.el
@@ -1693,43 +1693,18 @@ (defun org-html--format-image (source attributes info)
 ATTRIBUTES is a plist, as returned by
 `org-export-read-attribute'.  INFO is a plist used as
 a communication channel."
-  (if (string= "svg" (file-name-extension source))
-      (org-html--svg-image source attributes info)
-    (org-html-close-tag
-     "img"
-     (org-html--make-attribute-string
-      (org-combine-plists
-       (list :src source
-	     :alt (if (string-match-p
-		       (concat "^" org-preview-latex-image-directory) source)
-		      (org-html-encode-plain-text
-		       (org-find-text-property-in-string 'org-latex-src source))
-		    (file-name-nondirectory source)))
-       attributes))
-     info)))
-
-(defun org-html--svg-image (source attributes info)
-  "Return \"object\" embedding svg file SOURCE with given ATTRIBUTES.
-INFO is a plist used as a communication channel.
-
-The special attribute \"fallback\" can be used to specify a
-fallback image file to use if the object embedding is not
-supported.  CSS class \"org-svg\" is assigned as the class of the
-object unless a different class is specified with an attribute."
-  (let ((fallback (plist-get attributes :fallback))
-	(attrs (org-html--make-attribute-string
-		(org-combine-plists
-                 ;; Remove fallback attribute, which is not meant to
-                 ;; appear directly in the attributes string, and
-                 ;; provide a default class if none is set.
-                 '(:class "org-svg") attributes '(:fallback nil)))))
-    (format "<object type=\"image/svg+xml\" data=\"%s\" %s>\n%s</object>"
-	    source
-	    attrs
-	    (if fallback
-		(org-html-close-tag
-		 "img" (format "src=\"%s\" %s" fallback attrs) info)
-	      "Sorry, your browser does not support SVG."))))
+  (org-html-close-tag
+   "img"
+   (org-html--make-attribute-string
+    (org-combine-plists
+     (list :src source
+           :alt (if (string-match-p
+                     (concat "^" org-preview-latex-image-directory) source)
+                    (org-html-encode-plain-text
+                     (org-find-text-property-in-string 'org-latex-src source))
+                  (file-name-nondirectory source)))
+     attributes))
+   info))
 
 (defun org-html--textarea-block (element)
   "Transcode ELEMENT into a textarea block.
-- 
2.30.1


             reply	other threads:[~2021-04-07 11:25 UTC|newest]

Thread overview: 3+ messages / expand[flat|nested]  mbox.gz  Atom feed  top
2021-04-07 11:24 Timothy [this message]
2021-04-07 11:29 ` Timothy
2021-04-26  7:54 ` Bastien

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

  Avoid top-posting and favor interleaved quoting:
  https://en.wikipedia.org/wiki/Posting_style#Interleaved_style

  List information: https://www.orgmode.org/

* Reply using the --to, --cc, and --in-reply-to
  switches of git-send-email(1):

  git send-email \
    --in-reply-to=87k0pemj6d.fsf@gmail.com \
    --to=tecosaur@gmail.com \
    --cc=emacs-orgmode@gnu.org \
    --subject='Re: [PATCH] Use <img> tags for SVGs' \
    /path/to/YOUR_REPLY

  https://kernel.org/pub/software/scm/git/docs/git-send-email.html

* If your mail client supports setting the In-Reply-To header
  via mailto: links, try the mailto: link

Code repositories for project(s) associated with this inbox:

	https://git.savannah.gnu.org/cgit/emacs/org-mode.git

This is a public inbox, see mirroring instructions
for how to clone and mirror all data and code used for this inbox;
as well as URLs for read-only IMAP folder(s) and NNTP newsgroup(s).