Syntax Highlighting / Code Highlighting for Pdf output

This forum is for all Flare issues related to PDF, eBook, Microsoft Word, Adobe FrameMaker, XPS, and XHTML book targets.
Post Reply
iand
Sr. Propeller Head
Posts: 131
Joined: Thu Dec 18, 2008 5:46 am
Location: London, England

Syntax Highlighting / Code Highlighting for Pdf output

Post by iand »

Does anyone have a automatic or semi automatic method for highlighting source code (XML, scripts, java code) for pdf output. I know this is easy to do for HTML output using javascript.
I found the following tool http://www.andre-simon.de/doku/highligh ... hlight.php which can produce highlighted html from code. See attached example.
However if I try and paste the pre block generated by this tool into my flare topic xhtml then the colors are lost.
I've tried pasting the relevant css into my stylesheet

pre.hl { color:#000000; background-color:#eeeeee; font-size:10pt; font-family:'Courier New';}
.hl.num { color:#800080; font-weight:bold; }
.hl.esc { color:#ff00ff; font-weight:bold; }
.hl.str { color:#a68500; }
.hl.pps { color:#0000ff; }
.hl.slc { color:#f27900; }
.hl.com { color:#ff8000; }
.hl.ppc { color:#0080c0; font-weight:bold; }
.hl.opt { color:#ff0080; font-weight:bold; }
.hl.ipl { color:#9e5dff; }
.hl.lin { color:#303030; }
.hl.kwa { color:#bb7977; font-weight:bold; }
.hl.kwb { color:#8080c0; font-weight:bold; }
.hl.kwc { color:#0080c0; }
.hl.kwd { color:#004466; }

But no joy, the output is still black. Anyone else have any more luck or can tell me what I am doing wrong?
The same tool can produce svg but I am not sure that Flare will break large svgs correctly over mutliple pages.
Thanks for your help
Ian

XHTML is as follows (apologies for pasting it won't allow me to upload as an attachment):
<pre class="hl"><span class="hl kwa">import</span> java<span class="hl opt">.</span>sql<span class="hl opt">.*;</span>

<span class="hl kwa">public class</span> updateTable <span class="hl opt">{</span>
<span class="hl kwa">public static</span> <span class="hl kwb">void</span> <span class="hl kwd">main</span><span class="hl opt">(</span>String<span class="hl opt">[]</span> args<span class="hl opt">) {</span>
<span class="hl kwa">try</span> <span class="hl opt">{</span>
Class<span class="hl opt">.</span><span class="hl kwd">forName</span><span class="hl opt">(</span><span class="hl str">"org.apache.derby.jdbc.ClientDriver"</span><span class="hl opt">);</span>
<span class="hl opt">}</span>
<span class="hl kwa">catch</span><span class="hl opt">(</span>ClassNotFoundException e<span class="hl opt">) {</span>
System<span class="hl opt">.</span>out<span class="hl opt">.</span><span class="hl kwd">println</span><span class="hl opt">(</span><span class="hl str">"Class not found "</span><span class="hl opt">+</span> e<span class="hl opt">);</span>
<span class="hl opt">}</span>
<span class="hl kwa">try</span> <span class="hl opt">{</span>
Connection con <span class="hl opt">=</span> DriverManager<span class="hl opt">.</span>getConnection
<span class="hl opt">(</span><span class="hl str">"jdbc:derby://localhost:1527/testDb"</span><span class="hl opt">,</span><span class="hl str">"username"</span><span class="hl opt">,</span>
<span class="hl str">"password"</span><span class="hl opt">);</span>
Statement stmt <span class="hl opt">=</span> con<span class="hl opt">.</span><span class="hl kwd">createStatement</span><span class="hl opt">();</span>
String query1<span class="hl opt">=</span><span class="hl str">"update emp set name='ravi' where id=2"</span><span class="hl opt">;</span>
String query2 <span class="hl opt">=</span> <span class="hl str">"delete from emp where id=1"</span><span class="hl opt">;</span>
String query3 <span class="hl opt">=</span> <span class="hl str">"insert into emp values</span>
<span class="hl str"> (1,'ronak','manager')"</span><span class="hl opt">;</span>
stmt<span class="hl opt">.</span><span class="hl kwd">execute</span><span class="hl opt">(</span>query1<span class="hl opt">);</span>
stmt<span class="hl opt">.</span><span class="hl kwd">execute</span><span class="hl opt">(</span>query2<span class="hl opt">);</span>
stmt<span class="hl opt">.</span><span class="hl kwd">execute</span><span class="hl opt">(</span>query3<span class="hl opt">);</span>
ResultSet rs <span class="hl opt">=</span> stmt<span class="hl opt">.</span><span class="hl kwd">executeQuery</span><span class="hl opt">(</span><span class="hl str">"SELECT * FROM emp"</span><span class="hl opt">);</span>
System<span class="hl opt">.</span>out<span class="hl opt">.</span><span class="hl kwd">println</span><span class="hl opt">(</span><span class="hl str">"id name job"</span><span class="hl opt">);</span>
<span class="hl kwa">while</span> <span class="hl opt">(</span>rs<span class="hl opt">.</span><span class="hl kwd">next</span><span class="hl opt">()) {</span>
<span class="hl kwb">int</span> id <span class="hl opt">=</span> rs<span class="hl opt">.</span><span class="hl kwd">getInt</span><span class="hl opt">(</span><span class="hl str">"id"</span><span class="hl opt">);</span>
String name <span class="hl opt">=</span> rs<span class="hl opt">.</span><span class="hl kwd">getString</span><span class="hl opt">(</span><span class="hl str">"name"</span><span class="hl opt">);</span>
String job <span class="hl opt">=</span> rs<span class="hl opt">.</span><span class="hl kwd">getString</span><span class="hl opt">(</span><span class="hl str">"job"</span><span class="hl opt">);</span>
System<span class="hl opt">.</span>out<span class="hl opt">.</span><span class="hl kwd">println</span><span class="hl opt">(</span>id<span class="hl opt">+</span><span class="hl str">" "</span><span class="hl opt">+</span>name<span class="hl opt">+</span><span class="hl str">" "</span><span class="hl opt">+</span>job<span class="hl opt">);</span>
<span class="hl opt">}</span>
<span class="hl opt">}</span>
<span class="hl kwa">catch</span><span class="hl opt">(</span>SQLException e<span class="hl opt">){</span>
System<span class="hl opt">.</span>out<span class="hl opt">.</span><span class="hl kwd">println</span><span class="hl opt">(</span><span class="hl str">"SQL exception occured"</span> <span class="hl opt">+</span> e<span class="hl opt">);</span>
<span class="hl opt">}</span>
<span class="hl opt">}</span>
<span class="hl opt">}</span>
</pre>
NorthEast
Master Propellus Maximus
Posts: 6359
Joined: Mon Mar 05, 2007 8:33 am

Re: Syntax Highlighting / Code Highlighting for Pdf output

Post by NorthEast »

Flare's PDF output can't seem to handle tags that have multiple classes, so where you have <span class="hl kwa">, it won't apply both the hl and kwa classes.

You could probably change the code to use single class names (with a search and replace), otherwise investigate some other code highlighting tools.
Msquared
Propellus Maximus
Posts: 848
Joined: Mon Aug 06, 2012 10:19 am
Location: Southampton, UK

Re: Syntax Highlighting / Code Highlighting for Pdf output

Post by Msquared »

Here's a post in this very forum about another tool.

http://forums.madcapsoftware.com/viewto ... =6&t=18837
Marjorie

My goal in life is to be as good a person as my dogs already think I am.
NorthEast
Master Propellus Maximus
Posts: 6359
Joined: Mon Mar 05, 2007 8:33 am

Re: Syntax Highlighting / Code Highlighting for Pdf output

Post by NorthEast »

Msquared wrote:Here's a post in this very forum about another tool.

http://forums.madcapsoftware.com/viewto ... =6&t=18837
Yep, I use Google prettify myself, but iand was looking for a tool that could be used (easily) for PDFs.

Prettify (and many others) use scripting to dynamically highlight the code in a web page; but that's not much help for PDFs, where ideally you need a tool that generates the HTML/CSS that you can then put into a topic.
Msquared
Propellus Maximus
Posts: 848
Joined: Mon Aug 06, 2012 10:19 am
Location: Southampton, UK

Re: Syntax Highlighting / Code Highlighting for Pdf output

Post by Msquared »

Aha, Sorry for the misunderstanding. I'm actively watching this and similar threads because I'd like to do the same for PDFs (and for HTML output too).

However, in the absence of an obvious way to do this for PDFs, and even less time to investigate, what I do at present when I have indigestible chunks of source code is bold the relevant lines or elements.

For example, if I have a SOAP example that shows how to call an API and set up the required parameters, I'll bold the parameter values and the API calls where they appear in the SOAP, and bold anything else I mention when I discuss the example.

If I have a code fragment showing a series of API calls to achieve some action, I'll bold the API calls where they appear in the code. Again, anything I mention in the descriptive text will be bolded in the example.

This is surprisingly effective at reducing the noise and drawing the reader's attention to the relevant bit. Sometimes this can be more helpful than colouring every element, as the colouring itself can introduce noise or emphasis that you don't want. And also, many developers have their own colour preferences now, so colouring may not be as helpful as you think.
Marjorie

My goal in life is to be as good a person as my dogs already think I am.
iand
Sr. Propeller Head
Posts: 131
Joined: Thu Dec 18, 2008 5:46 am
Location: London, England

Re: Syntax Highlighting / Code Highlighting for Pdf output

Post by iand »

I've managed to get a working solution although it's a bit of effort. It might not be worth it for small code blocks

Generate an svg file from the source code using the gui version of the highlight tool downloaded from http://www.andre-simon.de/doku/highligh ... hlight.php.
Set the highlight tool options to generate an svg file. Make sure that you check the option to include css in the generated file
Open the generated svg file in notepad ++
Copy all text blocks beginning in <text> ending in </text> from the svg file to a new scratchpad file
In the scratchpad file, replace <text[^>]+>with <pre class="code" xml:space="preserve"> in notepad++ using the regular expression mode search/replace mode. (replace all <text> tags with <pre> tags with xml:space preserve to keep spaces)
Replace all </text> with </pre> (change all end </text> tags to </pre> tags)
Replace all tspan with span (svg uses tspan, xhtml uses span)
Copy and paste all lines in the scratchpad into the flare topic file xml

Copy all lines beginning .tspan. and ending in } from the svg file to a new scratchpad file
Replace all fill with color (svg uses fill, css uses color)
Replace all tspan. with nothing to trim tspan from the front of each line
Copy and paste all lines in the scratchpad to your flare stylesheet css file in internal editor mode
You should now have highlighted code that will display in html and pdf

Let me know how you get on
sereshk
Jr. Propeller Head
Posts: 3
Joined: Mon Jun 15, 2015 8:16 am

Re: Syntax Highlighting / Code Highlighting for Pdf output

Post by sereshk »

iand wrote:I've managed to get a working solution although it's a bit of effort. It might not be worth it for small code blocks

Generate an svg file from the source code using the gui version of the highlight tool downloaded from http://www.andre-simon.de/doku/highligh ... hlight.php.
Set the highlight tool options to generate an svg file. Make sure that you check the option to include css in the generated file
Open the generated svg file in notepad ++
Copy all text blocks beginning in <text> ending in </text> from the svg file to a new scratchpad file
In the scratchpad file, replace <text[^>]+>with <pre class="code" xml:space="preserve"> in notepad++ using the regular expression mode search/replace mode. (replace all <text> tags with <pre> tags with xml:space preserve to keep spaces)
Replace all </text> with </pre> (change all end </text> tags to </pre> tags)
Replace all tspan with span (svg uses tspan, xhtml uses span)
Copy and paste all lines in the scratchpad into the flare topic file xml

Copy all lines beginning .tspan. and ending in } from the svg file to a new scratchpad file
Replace all fill with color (svg uses fill, css uses color)
Replace all tspan. with nothing to trim tspan from the front of each line
Copy and paste all lines in the scratchpad to your flare stylesheet css file in internal editor mode
You should now have highlighted code that will display in html and pdf

Let me know how you get on
Hello iand,
thanks! I tried it and it worked with html and pdf.
But a small alteration seems to be necessary at the point, where you replace all tspan. from lines ending with } . I had to actually just to remove the leading "t", because otherwise the pasted line in the .css files won't be recognized as new classes by Flare.
Local output works like a charm!
Absolutely made my day! :lol: 8)
Post Reply