INTRO: SyntaxHighlighter for tiddlySpace

10 views
Skip to first unread message

PMario

unread,
Aug 17, 2010, 10:34:04 AM8/17/10
to TiddlyWeb
Have a look at: syntaxhighlighter space [1]
The status is erxperimental, because, if you use expert mode (disabled
by default) a vanilla tw can't render the new code. So, there is no
fallback yet. If you use the default configuration everything should
be fine.

I did test the basics. But any feedback would be welcome.

At the moment the brushes: text, css, js, xml are included by
default.
The brushes are identified by the different braces
text .. {{{
css .. /*{{{*/
xml .. <!--{{{-->
js .. //{{{

to use it, include syntaxhighlighter space into your space.

Download [2]

==========
Expert mode has to be activated inside macro source code. Because it
makes the monospace block starter syntax, incompatible to vanilla tw.
{{{ brush: pascal \n
/*{{{ brush: pascal */
<!{{{ brush: pascal -->
//{{{ brush: pascal \n
see the code for more.
===========
I want to use any SyntaxHighlighter parameter [3]. And I wanted to
have a syntax, that can be also used inside a plugin or a css tiddler
[4], without breaking the possibility to execute it.

Any idea, to get the above rendered by a vanilla tw, would be very
welcome. Changing the core formatter would be a possibility, but I
think there will be a nogo :)

have fun!
Mario
[1] http://syntaxhighlighter.tiddlyspace.com/#SyntaxHighlighterPlugin3Info
[2] http://syntaxhighlighter.tiddlyspace.com/?download=TWHighlightSyntax.html
[3] http://alexgorbatchev.com/SyntaxHighlighter/manual/configuration/
[4] http://syntaxhighlighter.tiddlyspace.com/#ShThemeDefault.css

FND

unread,
Aug 18, 2010, 5:43:58 AM8/18/10
to tidd...@googlegroups.com
> Have a look at: syntaxhighlighter space

Nice job, Mario.

If you exposed the expert mode variable in a public namespace (e.g.
config.extensions.highlightSyntax or config.macros.highlightSyntax),
users could initialize it via a ConfigTweaks tiddler rather than having
to modify the plugin tiddler.

> The status is erxperimental, because, if you use expert mode (disabled
> by default) a vanilla tw can't render the new code.

Not being familiar with the code or usage, can you explain this a little
more - preferably on [twdev].

I'm also not quite grasping yet why there's both a formatter and a macro
(probably because I haven't had time to play with it yet).


-- F.

PMario

unread,
Aug 18, 2010, 6:40:45 AM8/18/10
to TiddlyWeb
On Aug 18, 11:43 am, FND <F...@gmx.net> wrote:
> > Have a look at: syntaxhighlighter space
>
> Nice job, Mario.
thx

> If you exposed the expert mode variable in a public namespace (e.g.
> config.extensions.highlightSyntax or config.macros.highlightSyntax),
> users could initialize it via a ConfigTweaks tiddler rather than having
> to modify the plugin tiddler.
:) It will change in the final version. But for now, the inhibition
threshold should be high. Because I am sure it will change.

> > The status is erxperimental, because, if you use expert mode (disabled
> > by default) a vanilla tw can't render the new code.
>
> Not being familiar with the code or usage, can you explain this a little
> more - preferably on [twdev].
I'll explain it in detail there

> I'm also not quite grasping yet why there's both a formatter and a macro
> (probably because I haven't had time to play with it yet).
The formatter only prepares the <pre class="brush:xx"> and the macro
executes the highlighter. I deleted the old plugin, because I couldn't
decide which elements are highlighted. It highlights everything.
Adding the macro to ViewTemplate, has the same effect, but the user
can decide.

have fun!
-m

PMario

unread,
Aug 23, 2010, 3:54:24 PM8/23/10
to TiddlyWeb
There is a new version now. [1]
Expert mode is different now. It makes global changes with
config.options. It is not that flexible as the older version. But
we'll see.

New formatter:

<code class="brush:as3">
// your code
</code>
=====
The macro <<highlightSyntax>> is still there it can be used if you
want to highlight tw inline html

<html>
<pre class="brush:pascal">
// your code here
</pre>
<html>
<<highlightSyntax>>
=====
If you need your own brushes:
*download the SyntaxHighlighter source [1]
*copy your brush.js file into a tiddler
*name it ShBrushXx.js
*add the following 3 lines at the top of the brush tiddler
/***
|Requires|ShCore.js|
***/

*tag it systemConfig !!!!!!!
*save and reload.

have fun!
mario

[1] http://syntaxhighlighter.tiddlyspace.com/
Reply all
Reply to author
Forward
0 new messages