Code highlighting (prettify.js) in Markdown and/or Asciidoc

classic Classic list List threaded Threaded
8 messages Options
Reply | Threaded
Open this post in threaded view
|

Code highlighting (prettify.js) in Markdown and/or Asciidoc

ge0ffrey
Currently I have this markdown file:

  If you use Maven, just add a dependency:

      <dependency>
        <groupId>org.optaplanner</groupId>
        <artifactId>optaplanner-core</artifactId>
        <version>...</version>
      </dependency>

Which has the following output (no XML code coloring):

<p>If you use Maven, just add a dependency:</p>

<pre><code><dependency>
  <groupId>org.optaplanner</groupId>
  <artifactId>optaplanner-core</artifactId>
  <version>...</version>
</dependency>
</code></pre>

And instead I want it to be (so prettify.js colors it):

<p>If you use Maven, just add a dependency:</p>

<pre class="prettyprint lang-xml"><dependency>
  <groupId>org.optaplanner</groupId>
  <artifactId>optaplanner-core</artifactId>
  <version>...</version>
</dependency>
</pre>

Not sure if the element <code> is a problem or not, but the lack of class="prettyprint lang-xml" definitely is.

Now the kicker is that the code language cannot be automatically deduced (not always anyway), so there needs to be a way to state in the markdown or asciidoc file that that peice of code is XML. In docbook that happens with the <programlisting lang="xml"> element.
Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

LightGuard
Administrator
For asciidoc, there certainly is:

[source, lang]
----
blah
----

Not sure about markdown though.


On Tue, Mar 12, 2013 at 5:20 AM, ge0ffrey <[hidden email]> wrote:
Currently I have this markdown file:

  If you use Maven, just add a dependency:

      <dependency>
        <groupId>org.optaplanner</groupId>
        <artifactId>optaplanner-core</artifactId>
        <version>...</version>
      </dependency>

Which has the following output (no XML code coloring):

<p>If you use Maven, just add a dependency:</p>

<pre><code>&lt;dependency&gt;
  &lt;groupId&gt;org.optaplanner&lt;/groupId&gt;
  &lt;artifactId&gt;optaplanner-core&lt;/artifactId&gt;
  &lt;version&gt;...&lt;/version&gt;
&lt;/dependency&gt;
</code></pre>

And instead I want it to be (so prettify.js colors it):

<p>If you use Maven, just add a dependency:</p>

<pre class="prettyprint lang-xml">&lt;dependency&gt;
  &lt;groupId&gt;org.optaplanner&lt;/groupId&gt;
  &lt;artifactId&gt;optaplanner-core&lt;/artifactId&gt;
  &lt;version&gt;...&lt;/version&gt;
&lt;/dependency&gt;
</pre>

Not sure if the element <code> is a problem or not, but the lack of
class="prettyprint lang-xml" definitely is.

Now the kicker is that the code language cannot be automatically deduced
(not always anyway), so there needs to be a way to state in the markdown or
asciidoc file that that peice of code is XML. In docbook that happens with
the <programlisting lang="xml"> element.




--
View this message in context: http://talk-archive.awestruct.org/Code-highlighting-prettify-js-in-Markdown-and-or-Asciidoc-tp163.html
Sent from the Awestruct Talk mailing list archive at Nabble.com.

---------------------------------------------------------------------
Archives: http://talk-archive.awestruct.org/
To unsubscribe, e-mail: [hidden email]




--
Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

mojavelinux
On Tue, Mar 12, 2013 at 9:39 AM, Jason Porter <[hidden email]> wrote:
For asciidoc, there certainly is:

[source, lang]
----
blah
----

You can also use the GFM fenced code blocks (unique to Asciidoctor):

```xml
 <dependency>
     <groupId>org.optaplanner</groupId>
     <artifactId>optaplanner-core</artifactId>
     <version>...</version>
 </dependency>
```

This will output:

<div class="listingblock">
  
  <div class="content monospaced">
    
    <pre class="highlight"><code class="xml"> &lt;dependency&gt;
     &lt;groupId&gt;org.optaplanner&lt;/groupId&gt;
     &lt;artifactId&gt;optaplanner-core&lt;/artifactId&gt;
     &lt;version&gt;...&lt;/version&gt;
 &lt;/dependency&gt;</code></pre>
    
  </div>
</div>

If you want to customize that output, you'd need to supply a custom block_listing template.

-Dan

--
Dan Allen
Principal Software Engineer, Red Hat | Author of Seam in Action
Registered Linux User #231597

Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

ge0ffrey
Nice :) Another reason to switch to asciidoc once the new release is out.

It would be nice if prettify.js works out of the box for asciidocs, like it does on the pressgang-tools styles for docbook.
Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

ge0ffrey
ge0ffrey wrote
It would be nice if prettify.js works out of the box for asciidocs, like it does on the pressgang-tools styles for docbook.
Nevermind that: looks like already does code highlighting by default.
Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

mojavelinux
...you raise a good point though. Asciidoctor should acknowledge prettify.js as another source highlighting option in addition to highlight.js. If any tweaks are necessary, then we can put those in. That mostly applies to full documents, but if the class name needs to change for prettify.js, then that is something that could be fixed.

-Dan

On Tue, Mar 12, 2013 at 9:56 AM, ge0ffrey <[hidden email]> wrote:
ge0ffrey wrote
> It would be nice if prettify.js works out of the box for asciidocs, like
> it does on the pressgang-tools styles for docbook.

Nevermind that: looks like already does code highlighting by default.



--
View this message in context: http://talk-archive.awestruct.org/Code-highlighting-prettify-js-in-Markdown-and-or-Asciidoc-tp163p167.html
Sent from the Awestruct Talk mailing list archive at Nabble.com.

---------------------------------------------------------------------
Archives: http://talk-archive.awestruct.org/
To unsubscribe, e-mail: [hidden email]




--
Dan Allen
Principal Software Engineer, Red Hat | Author of Seam in Action
Registered Linux User #231597

Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

ge0ffrey
Honestly, I don't care which js does the actual highlighting. As long as xml and java show up colored, it works for me :)

I do think asciidoctor should out-of-the-box use the better js of the 2, so we don't have to worry about configuring it to use the better one. Whether or not that's highlight.js or prettify.js, time will tell: highlight.js sounds like a good default to start with.


Conclusion for me: Switch from markdown to asciidoc to get code coloring.
Reply | Threaded
Open this post in threaded view
|

Re: Code highlighting (prettify.js) in Markdown and/or Asciidoc

mojavelinux
Personally I think highlight.js does a better job, hence why its the default choice. However, I do want to make sure switching to prettify.js is possible.

-Dan

On Wed, Mar 13, 2013 at 8:06 AM, ge0ffrey <[hidden email]> wrote:
Honestly, I don't care which js does the actual highlighting. As long as xml
and java show up colored, it works for me :)

I do think asciidoctor should out-of-the-box use the better js of the 2, so
we don't have to worry about configuring it to use the better one. Whether
or not that's highlight.js or prettify.js, time will tell: highlight.js
sounds like a good default to start with.


Conclusion for me: Switch from markdown to asciidoc to get code coloring.



--
View this message in context: http://talk-archive.awestruct.org/Code-highlighting-prettify-js-in-Markdown-and-or-Asciidoc-tp163p172.html
Sent from the Awestruct Talk mailing list archive at Nabble.com.

---------------------------------------------------------------------
Archives: http://talk-archive.awestruct.org/
To unsubscribe, e-mail: [hidden email]




--
Dan Allen
Principal Software Engineer, Red Hat | Author of Seam in Action
Registered Linux User #231597