emacs-orgmode@gnu.org archives
 help / color / mirror / code / Atom feed
* PATCHES: Wrap code in <code>, add an attribute for line number value
@ 2019-06-04 13:56 Nik Clayton
  2019-06-07 21:33 ` Nicolas Goaziou
  0 siblings, 1 reply; 2+ messages in thread
From: Nik Clayton @ 2019-06-04 13:56 UTC (permalink / raw)
  To: emacs-orgmode


[-- Attachment #1.1: Type: text/plain, Size: 787 bytes --]

Hi,

Attached are two TINYCHANGE patches that provide an alternative way of
displaying line numbers in generated HTML output.

The current approach hardcodes a span containing preformated text. It's
non-trivial to move this in the displayed output or adjust the formatting.
The content is also part of the selectable part of the page, so if you
copy/paste code from an ORG -> HTML file you get the line numbers as well.

The first patch just wraps each line of code in a <code> element. The
second patch extends this to include the line number of that element as a
special data- attribute. The value of this can be accessed in CSS to
display the line number, format it in interesting ways, etc, while keeping
it non-selectable, so that copy/pasting the code ignores the line numbers.

N

[-- Attachment #1.2: Type: text/html, Size: 933 bytes --]

[-- Attachment #2: 0001-ox-html.el-Wrap-each-line-of-a-source-block-in-a-cod.patch --]
[-- Type: application/octet-stream, Size: 1022 bytes --]

From 3cc1bea9a92cd66bc95a7382644679914c30b313 Mon Sep 17 00:00:00 2001
From: Nik Clayton <nik@ngo.org.uk>
Date: Tue, 4 Jun 2019 11:57:40 +0200
Subject: [PATCH 1/2] ox-html.el: Wrap each line of a source block in a code
 element

* lisp/ox-html.el (org-html-do-format-code): Wrap each line of a source block
in a code element.

This makes it straightforward to add custom decorations to each line
using CSS :before and :after properties.

TINYCHANGE
---
 lisp/ox-html.el | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lisp/ox-html.el b/lisp/ox-html.el
index 4e7ff5c10..157905ed6 100644
--- a/lisp/ox-html.el
+++ b/lisp/ox-html.el
@@ -2255,7 +2255,7 @@ line of code."
 		(format "<span class=\"linenr\">%s</span>"
 			(format num-fmt line-num)))
 	      ;; Transcoded src line.
-	      loc
+	      (format "<code>%s</code>" loc)
 	      ;; Add label, if needed.
 	      (when (and ref retain-labels) (format " (%s)" ref))))
        ;; Mark transcoded line as an anchor, if needed.
-- 
2.21.0.windows.1


[-- Attachment #3: 0002-ox-html.el-Include-the-line-number-as-a-data-attribu.patch --]
[-- Type: application/octet-stream, Size: 1661 bytes --]

From e794c0b4c885faf66eba8055700f32bc7bcb2121 Mon Sep 17 00:00:00 2001
From: Nik Clayton <nik@ngo.org.uk>
Date: Tue, 4 Jun 2019 12:41:27 +0200
Subject: [PATCH 2/2] ox-html.el: Include the line number as a data attribute

* lisp/ox-html.el (org-html-do-format-code): If line numbers are enabled
then include a data-ox-html-linenr attribute that contains this line's
line number.

This allows you to have more control over line number formatting and
placement. For example, the following CSS hides the span that contains
the line number, and uses a CSS :before property to position and format
the line number with a border instead of a semi-colon separating content
and line number.

span.linenr { display: none; }

code[data-ox-html-linenr]:before {
  content: attr(data-ox-html-linenr);
  display: inline-block;
  border-right: 1px solid;
  width: 1rem;
  text-align: right;
}

TINYCHANGE
---
 lisp/ox-html.el | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/lisp/ox-html.el b/lisp/ox-html.el
index 157905ed6..f1c06e069 100644
--- a/lisp/ox-html.el
+++ b/lisp/ox-html.el
@@ -2255,7 +2255,11 @@ line of code."
 		(format "<span class=\"linenr\">%s</span>"
 			(format num-fmt line-num)))
 	      ;; Transcoded src line.
-	      (format "<code>%s</code>" loc)
+	      (format "<code%s>%s</code>"
+                      (if num-start
+                          (format " data-ox-html-linenr=\"%s\"" line-num)
+                        "")
+                      loc)
 	      ;; Add label, if needed.
 	      (when (and ref retain-labels) (format " (%s)" ref))))
        ;; Mark transcoded line as an anchor, if needed.
-- 
2.21.0.windows.1


^ permalink raw reply related	[flat|nested] 2+ messages in thread

* Re: PATCHES: Wrap code in <code>, add an attribute for line number value
  2019-06-04 13:56 PATCHES: Wrap code in <code>, add an attribute for line number value Nik Clayton
@ 2019-06-07 21:33 ` Nicolas Goaziou
  0 siblings, 0 replies; 2+ messages in thread
From: Nicolas Goaziou @ 2019-06-07 21:33 UTC (permalink / raw)
  To: Nik Clayton; +Cc: emacs-orgmode

Hello,

Nik Clayton <nik@ngo.org.uk> writes:

> Attached are two TINYCHANGE patches that provide an alternative way of
> displaying line numbers in generated HTML output.

Applied. Thank you.

Could you also provide an entry in ORG-NEWS?

Regards,

-- 
Nicolas Goaziou

^ permalink raw reply	[flat|nested] 2+ messages in thread

end of thread, other threads:[~2019-06-07 21:33 UTC | newest]

Thread overview: 2+ messages (download: mbox.gz / follow: Atom feed)
-- links below jump to the message on this page --
2019-06-04 13:56 PATCHES: Wrap code in <code>, add an attribute for line number value Nik Clayton
2019-06-07 21:33 ` Nicolas Goaziou

Code repositories for project(s) associated with this public 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).