Source code formatting?

Source code formatting?

by alex sykes -
Number of replies: 13
Hi. I'm sure there is a very simple answer to this, but I haven't been able to find it yet!

I'm teaching Computer Science and would like to be able to put some source code (indented, mono-spaced etc) on my site. So far I'm not getting there. Any advice, please?

Average of ratings: -
In reply to alex sykes

Re: Source code formatting?

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
Are you using the HTML editor? If so, use the 'preformatted' style.
In reply to Tim Hunt

Re: Source code formatting?

by Sandy Pittendrigh -
In order to show indented source code on forum or moodle resource pages,
I edit (for instance--PHP code) in a separate text editor, formatted as needed.

I use vi in a terminal window on linux or Mac, but I suppose
NotePad on Windows would work too.
Then use search and replace to turn < to &lt; and > to &gt;
and turn all newlines into <br> plus newline

Then I use search and replace turn spaces into &nbsp;
Then I toggle the editor into text mode and paste the formatted
code from my separate text editor into the moodle editor (which
is now in text mode) and then save. It's a bit klunky, but it works.
In reply to Tim Hunt

Re: Source code formatting?

by Mark Hayes -
Tim - Is there more to it than simply using the preformatted style?
I have tried that, as well as, surrounding the formatted code with <pre><code> </code></pre> but the formatting of the source is not retained.
In reply to Mark Hayes

Re: Source code formatting?

by Tim Hunt -
Picture of Core developers Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Peer reviewers Picture of Plugin developers
I know, it is a real pain, the HTML editor now seems to eat all the whitespace in your code no matter what you do.

And I have not yet managed to make the code syntax highlighting filter work with the HTML editor. However, in Safari, where the editor does not work and you have to type plain text, the code highlighting does work. You can always go and turn the editor off in your user profile, make your forum post, then turn it back on, but that is a pain.

I wish someone would sort this out.
In reply to Tim Hunt

Re: Source code formatting?

by Ivan @ wiris.com -
I know, it is a real pain, the HTML editor now seems to eat all the whitespace in your code no matter what you do.

Just disable HTMLArea.indent() in htmlarea.js, wich is really not necessary, and is it who eats all the spaces, including &nbsp;

This bug is really a big stopper for CS teachers to use Moodle. Sorry, but I have not found the bug number.

In reply to Ivan @ wiris.com

Re: Source code formatting?

by Ivan @ wiris.com -
In reply to Ivan @ wiris.com

Re: Source code formatting?

by Paul Preney -
I looked at the issue again as your patch inspired me to look at it again --especially since I am running a newer version of Moodle these days and there were some changes to the code. smile

Rather than bypassing the "clean up" function, I have suggested a different patch. My reasoning is that the function is there for a reason or the Moodle team would remove it altogether. So, IMHO, it is safer to fix the regular expressions involved. My fix appears to work in the Wiki and Forums --I've not checked it anywhere else yet.
In reply to alex sykes

Re: Source code formatting?

by mirek b -
you can do this with the geshi filter. it's the best choice at the moment for number of languages. you can download for example this package: http://geshi.org/downloads/moodle-geshi-filter-0.2.0.zip
In reply to mirek b

Re: Source code formatting?

by Satish Talim -
I am using Moodle 1.8.4. The installation instructions here -
http://docs.moodle.org/en/Code_Syntax_Highlighting

"To install, unzip that archive into your filter/ directory and then enable it in the admin filter configuration screen." - is not very clear to me. Any help?

In the image below, when you say enable it in the admin filter configuration screen - is it the one below and do I need to change it from None to HTML files only?

Attachment filter1.jpg
In reply to Satish Talim

Re: Source code formatting?

by Paul Preney -
The linked to page describes the GeSHi filter highlighter found on this site. To enable, you need to login with an account with Administrator role permissions, click on Modules (in the Admin. menu), click on Filters, and enable it.

NOTE: To get colours, you must invoke the .php file (load moodle/filters/geshi/geshi/contrib/cssgen.php and save that CSS page result in your theme as described in the README).

I have the GeSHi filter working under v1.8.4+, but, I have significantly altered it as follows (I've noted what I consider optional/mandatory for basic use):
  • Optional: I changed the code to work with the latest GeSHi filter. The one you download is old. The main issue is that this requires a couple of small changes to cssgen.php to pre-generate the CSS required for colours.

  • Mandatory: The filter is unusable with the HTMLArea editor (and many modules in v1.8.4+) since whitespace is stripped --if not the first time, often the 2nd or 3rd time. This is absolutely unacceptable behaviour with source code. The only way to fix this is in v1.8.4+ to edit the HTMLArea source code AND to edit code for any modules where you want your code to appear, OR, to use raw text edits which requires disabling the HTML Area editor. sad

  • Optional: I edited various files for various modules to not auto-hyperlink any source code content. (Clearly, this is undesirable.) I was 99% successful with this. To be 100% successful, might require re-writing the Moodle filter engine. sad
    • IMHO, this is very important. Pedagogically, one does not want automatic hyperlinks in source code that are incorrect. (Regular text is more tolerable, but, not IMHO source code.)
    • Unfortunately, I found that this required edits on a module-by-module basis.

  • Optional: I changed the tag from [code] to <pre>, by editing the filter code.
    • I ran into issues when using [code]. IMHO, Moodle supports too many simultaneous syntax formats (esp. for Wiki syntax). Moodle should require all syntax to be wrapped in an identifying tag. This would prevent undesirable interactions from occurring between filters, etc.

  • Optional: It is wise to delete all of the emoticon transformations (where supported, such as under v1.9 beta) since many programs can have sequences of such characters.
I have not submitted any updates/uploads of contributions to the filter yet, since I had to edit HTMLArea, various modules, etc. --too many items to post it as a solution for others and to easily make it a "bug fix" report. I also note that fixing (i) v1.9 appears to be easier than v1.8; (ii) but v1.9 is beta and isn't ready for production; (iii) Moodle doesn't force text to be wrapped with tags identifying the syntax being used; and (iv) Moodle v1.9 supports multiple HTML editors, but, that feature is very new and the documentation on enabling it is very poor. So, I am waiting for v1.9 to go stable before I deal with this issue again.

Item (iii) above and the whitespace stripping are the #1 and #2 reasons why this filter really cannot be (easily) used. Unfortunately, to fix these issues require code fixes within each Moodle module and how they handle whitespace and filter invocation. Currently, IMHO both are legacy/primitive and non-scalable. It would be wonderful to have an "HTML Editor" that supported, say, MathML (assuming someone wrote a tool for users to enter such, if one doesn't already exist), but, with Moodle's current ability to render output formats, there WILL be many unexpected interactions between CamelCase links, HTML tags, Moodle text format, etc. causing problems/issues. Done properly, filters, auto-hyperlinking, etc. should only occur within certain text tags/namespaces as this would be both restricted, modular and a way to scale into the future to handle more rich formatting.

That said, I have had limited enjoyment using the syntax highlighter --but my students don't use it and I don't ask them too. I find it most useful for the line numbering, so I can refer to specific lines of a program. This does not require anything fancy. However, the whitespace eating code is a killer. Simply editing an existing page that has highlighted code and saving it can cause all whitespace to be lost destroying its appearance completely. This is completely unacceptable and is the reason why I have had to make numerous edits to numerous pieces of code in various modules + HTMLArea to make things work.

If you use the filter at all, for now, use it for line numbering, but, you might find the whitespace eating with the HTMLArea to be a killer (for yourself or your students). Clearly, students likely prefer the use of HTMLArea and Moodle doesn't let you turn the HTMLArea on/off with a link next to the edit area. sad
In reply to mirek b

Re: Source code formatting?

by Mark Hayes -
Mirek - I tried the demo at geshi. The result is very nice except that symbols such as > and " are displayed as &gt; and &quot;
I looked in the geshi docs; is there a way to have geshi show the original text as is?