Code Syntax Highlighter Plugin for TiddlyWiki

96 views
Skip to first unread message

andot

unread,
Oct 13, 2008, 2:56:16 AM10/13/08
to TiddlyWiki 華語支援論壇
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

unread,
Oct 13, 2008, 7:57:59 AM10/13/08
to TiddlyWiki 華語支援論壇
非常感謝 andot 分享。

andot

unread,
Oct 13, 2008, 8:54:03 AM10/13/08
to TiddlyWiki 華語支援論壇
我更要感谢 BramChen 大大提供了中文版的TiddlyWiki,如果不是因为有简体、繁体中文版的 TiddlyWiki,我可能就不会选
择 TiddlyWiki 啦:D

BramChen

unread,
Oct 13, 2008, 9:15:13 AM10/13/08
to TiddlyWiki 華語支援論壇

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

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

MilchFlasche

unread,
Oct 18, 2008, 10:44:55 AM10/18/08
to TiddlyWiki 華語支援論壇
太感謝andot了!

key

unread,
Oct 18, 2008, 11:52:54 AM10/18/08
to TiddlyWiki 華語支援論壇
为什么我照着上面讲的一步步的做,最后没有成功呢??有谁能帮我一下.

BramChen

unread,
Oct 18, 2008, 11:53:53 PM10/18/08
to TiddlyWiki 華語支援論壇
完全照 http://coolcode.cn/show-310-1.html 的說明步驟 ?

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

BramChen

unread,
Oct 19, 2008, 3:08:34 AM10/19/08
to TiddlyWiki 華語支援論壇
依 key 的 report:
> 已经发现问题了,作者给的那个shBrush.js文件中末尾没有加上 //}}}闭合,所以插件加载的时候有问题

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

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

andot

unread,
Oct 22, 2008, 10:12:16 PM10/22/08
to TiddlyWiki 華語支援論壇
多谢 BramChen 发现的问题,确实是 10/15 的压缩版本的 shPlugin.js 结尾少了 //}}}

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

andot

unread,
Oct 22, 2008, 10:23:57 PM10/22/08
to TiddlyWiki 華語支援論壇
安装也可以不用插件方式安装,直接把 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

unread,
Oct 23, 2008, 1:49:17 AM10/23/08
to TiddlyWiki 華語支援論壇
不敢居功,如前述,問題是 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

unread,
Oct 23, 2008, 2:40:30 AM10/23/08
to TiddlyWiki 華語支援論壇
另一個套件資訊錯誤的小問題:

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

(不然 Eric 若看到了,一定會抗議的 ....)

andot

unread,
Oct 24, 2008, 3:14:54 AM10/24/08
to TiddlyWiki 華語支援論壇
On 10月23日, 下午2时40分, BramChen <Bram.C...@gmail.com> wrote:
> 另一個套件資訊錯誤的小問題:
>
> version.extensions.InlineJavascriptPlugin
> 應該改成
> version.extensions.SyntaxHighlighterPlugin
>
> (不然 Eric 若看到了,一定會抗議的 ....)

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

Alfonso Reyes

unread,
Nov 13, 2008, 10:39:30 PM11/13/08
to TiddlyWiki 華語支援論壇
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

unread,
Nov 13, 2008, 11:54:46 PM11/13/08
to TiddlyWiki 華語支援論壇
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

unread,
Nov 14, 2008, 8:53:07 AM11/14/08
to TiddlyWiki 華語支援論壇
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
Reply all
Reply to author
Forward
0 new messages