Code Syntax Highlighter Plugin for TiddlyWiki

[andot]

http://coolcode.cn/show-310-1.html

最近要给 PHPRPC 站做文档，打算使用 Wiki 系统，为了便于网站搬家和方便用户下载文档，所以选择了
TiddlyWiki，TiddlyWiki 是一个纯 HTML 的 Wiki 系统，而且支持插件，超级棒！不过从网上找了 2 天，也没有找到合
适的代码加亮插件，有一个 Plugin: Syntaxify 只支持 css，js 和 xml，而且效果还不是很理想。正好想到有个
dp.SyntaxHighlighter 项目是纯 js 实现的代码加亮库，于是就决定用它来做一个 TiddlyWiki 的代码加亮插件了。我
搜集了目前我能找到的所有支持用 dp.SyntaxHighlighter 加亮的语言文件（shBrush*.js），所以这个插件支持的语言比
dp.SyntaxHighlighter官方提供的还要多，支持的语言（包含别名）有：

as, as3, actionscript, bash, sh, batch, dos, coldfusion, cf, cpp, c, c+
+, c#, c-sharp, csharp, css, delphi, pascal, java, js, jscript,
javascript, lua, mxml, perl, php, py, python, ruby, rails, ror, sql,
vb, vb.net, xml, xhtml, xslt, html

[BramChen]

非常感謝 andot 分享。

[andot]

我更要感谢 BramChen 大大提供了中文版的TiddlyWiki，如果不是因为有简体、繁体中文版的 TiddlyWiki，我可能就不会选
择 TiddlyWiki 啦:D

[BramChen]

先進太客套了，久聞大名，請多指教。

原以為「說中文」的程式高手不是很在意 TiddlyWiki 的，看來 TiddlyWiki 的中文用戶有福了。

[MilchFlasche]

太感謝andot了！

[key]

为什么我照着上面讲的一步步的做,最后没有成功呢??有谁能帮我一下.

[BramChen]

完全照 http://coolcode.cn/show-310-1.html 的說明步驟 ?

> 4、再新建一篇文章，命名为：SyntaxHighlighterPlugin，将 shPlugin.js 中的内容复制进去保存
步驟 4 遺漏的說明：新增的 SyntaxHighlighterPlugin 標籤須設為 systemConfig

[BramChen]

依 key 的 report:
> 已经发现问题了，作者给的那个shBrush.js文件中末尾没有加上 //}}}闭合，所以插件加载的时候有问题

回覆如下：
10/13 的版本，文件中末尾有 //}}}，
10/15 的版本漏了，雖是如此，僅會影響顯示套件本身，其他應可正常顯示。

（10/15 應該是修正了在其他瀏覽器（非 FX、IE）的「正規式」錯誤的 bug）

[andot]

多谢 BramChen 发现的问题，确实是 10/15 的压缩版本的 shPlugin.js 结尾少了 //}}}

10/15 的更新主要是对代码加亮时格式刷的载入注册进行了优化，原来每次加亮（编辑后确定就会有这个过程），都要对所有的格式刷进行一次注册，现在
只有第一次需要注册。这样就可以加快一些速度。

[andot]

安装也可以不用插件方式安装，直接把 shPlugin.js 的代码（压缩或未压缩的都可以）附加到 TiddlyWiki.en.js（或
TiddlyWiki.zh-Hans.js，TiddlyWiki.zh-Hant.js）之后，在 empty.html（就是你的
tiddlywiki页面）中<div title="StyleSheetLocale">之前，加入：

<div title="StyleSheetSyntaxHighlighter">
<pre>
......
</pre>
</div>

其中，<pre>和</pre>之间就是 SyntaxHighlighter.css 的内容。

最后在 TiddlyWiki.en.js（或 TiddlyWiki.zh-Hans.js，TiddlyWiki.zh-Hant.js）中找到

StyleSheet: '[[StyleSheetLocale]]‘

改为：

StyleSheet: '[[StyleSheetLocale]]\n[[StyleSheetSyntaxHighlighter]]’

即可。

这样安装的话，就跟 TiddlyWiki 整合为一体了。启动速度会更快一些。

[BramChen]

不敢居功，如前述，問題是 key 發現回報的。

絕大多數的情形下，TW 在擴充功能時，是不需要去動到 core，那會增加日後 TW 或套件升級時的困擾。
若不小心，即使多了或少了一個字元，都可能引發無法預期的錯誤。

若不介意使用「非單一檔案」的方式，安裝步驟不妨參考使用以下作法：

1) 將下載後的 .zip 檔解壓於 common/syntaxhighlighter/
方便不同文件共用套件

2) 於 shadowed tiddler ＊MarkupPostBody＊ 加入：
<!--{{{-->
<script type="text/javascript" src="common/syntaxhighlighter/
shPlugin.js"></script>
<script type="text/javascript>
dp.sh.ClipboardSwf = 'common/syntaxhighlighter/clipboard.swf';
</script>
<!--}}}-->


3) 於 shadowed tiddler ＊MarkupPreHead＊ 加入：
<--{{{-->
<link rel="stylesheet" type="text/css" href="common/syntaxhighlighter/
SyntaxHighlighter.css" />
<!--}}}-->


如此可兼具共用資源及易於維護的優點，日後於套件升級時，只須直接覆蓋套件檔案即可。
andot 已將源碼壓縮過，加快載入檔案的速度，javascript 的執行效能與不同的載入方式相關性較少，其執行效能的致命傷主要還是來自加載
啟動與功能被執行時。

[BramChen]

另一個套件資訊錯誤的小問題：

version.extensions.InlineJavascriptPlugin
應該改成
version.extensions.SyntaxHighlighterPlugin

（不然 Eric 若看到了，一定會抗議的 ....）

[andot]

On 10月23日, 下午2时40分, BramChen <Bram.C...@gmail.com> wrote:
> 另一個套件資訊錯誤的小問題：
>
> version.extensions.InlineJavascriptPlugin
> 應該改成
> version.extensions.SyntaxHighlighterPlugin
>
> （不然 Eric 若看到了，一定會抗議的 ....）

果然如此啊，小细节我都没注意，哈哈。现在改正了。
另外，有跟您学习了安装插件的另一种方法，果然比我说的那种笨笨的修改核心的方法好多了。

[Alfonso Reyes]

Hello,
I see an interesting discussion on the SyntaxHighlighterPlugin for
TiddlyWiki. It is an awesome work.
I have been able to make it work in TW 2.4 but most of my tiddlywikis
are in 2.3. When I add the plugin, the stylesheet and everything at
startup time it gives an erros message complaining it needs a new
version of TW. Did you guys have been able to produce a
SyntaxHighlighterPlugin that works with earlier versions of TW?
Thanks,
Alfonso Reyes
Houston, Texas

[BramChen]

Hi Alfonso,


Fortunately, SyntaxHighlighterPlugin can work on TW 2.3.0 too,
you have only to change the slice value of *CoreVersion* to 2.3.0 in
the metadata section of the plugin.


To find out the followed line in SyntaxHighlighterPlugin
|''~CoreVersion:''|2.4.1|

and chang it to:
|''~CoreVersion:''|2.3.0|

also don't forget to save and reload the page.


enjoy,

Bram Chen

On 11月14日, 上午11時39分, Alfonso Reyes <alfonso.re...@reyesaguayo.com>
wrote:

[Alfonso Reyes]

Yes. it really does. How could I have missed that. Sorry about that.
Wonderful, now I have my tiddlywiki up and running with
SyntaxHighlighter.
See it working here: http://reyesaguayo.com/osp
I just started to publish some work I have doing with Java scientific
libraries programming with Jython.
Thanks a lo,
Alfonso