Merge branch 'master' of https://github.com/jbolila/TiddlyWiki5 into jbolila-master

bld.sh

@@ -89,6 +89,12 @@ node ./tiddlywiki.js \
 	--rendertiddler $:/core/save/all $TW5_BUILD_OUTPUT/markdowndemo.html text/plain \
 	|| exit 1
 
+node ./tiddlywiki.js \
+	./editions/highlightdemo \
+	--verbose \
+	--rendertiddler $:/core/save/all $TW5_BUILD_OUTPUT/highlightdemo.html text/plain \
+	|| exit 1
+
 # Run the test edition to run the Node.js tests and to generate test.html for tests in the browser
 
 ./test.sh

core/modules/parsers/wikiparser/rules/codeblock.js

@@ -23,14 +23,15 @@ exports.types = {block: true};
 
 exports.init = function(parser) {
 	this.parser = parser;
-	// Regexp to match
-	this.matchRegExp = /```\r?\n/mg;
+	// Regexp to match and get language if defined
+	this.matchRegExp = /```([\w-]*)\r?\n/mg;
 };
 
 exports.parse = function() {
 	var reEnd = /(\r?\n```$)/mg;
 	// Move past the match
 	this.parser.pos = this.matchRegExp.lastIndex;
+
 	// Look for the end of the block
 	reEnd.lastIndex = this.parser.pos;
 	var match = reEnd.exec(this.parser.source),
@@ -43,14 +44,14 @@ exports.parse = function() {
 		text = this.parser.source.substr(this.parser.pos);
 		this.parser.pos = this.parser.sourceLength;
 	}
-	// Return the pre element
+	// Return the $codeblock widget
 	return [{
-		type: "element",
-		tag: "pre",
-		children: [{
-			type: "text",
-			text: text
-		}]
+			type: "element",
+			tag: "$codeblock",
+			attributes: {
+					code: {type: "string", value: text},
+					language: {type: "string", value: this.match[1]}
+			}
 	}];
 };
 

core/modules/widgets/codeblock.js

@@ -0,0 +1,64 @@
+/*\
+title: $:/core/modules/widgets/codeblock.js
+type: application/javascript
+module-type: widget
+
+Code block node widget
+
+\*/
+(function(){
+
+/*jslint node: true, browser: true */
+/*global $tw: false */
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+
+var CodeBlockWidget = function(parseTreeNode,options) {
+	this.initialise(parseTreeNode,options);
+};
+
+/*
+Inherit from the base widget class
+*/
+CodeBlockWidget.prototype = new Widget();
+
+/*
+Render this widget into the DOM
+*/
+CodeBlockWidget.prototype.render = function(parent,nextSibling) {
+	this.parentDomNode = parent;
+	this.computeAttributes();
+	this.execute();
+	var codeNode = this.document.createElement("code");
+	if(this.getAttribute("language")) {
+		codeNode.setAttribute("class",this.getAttribute("language"));
+	}
+	var domNode = this.document.createElement("pre");
+	codeNode.appendChild(this.document.createTextNode(this.getAttribute("code")));
+	domNode.appendChild(codeNode);
+	parent.insertBefore(domNode,nextSibling);
+	this.domNodes.push(domNode);
+
+	if(this.postRender) {
+		this.postRender();
+	}
+};
+
+/*
+Compute the internal state of the widget
+*/
+CodeBlockWidget.prototype.execute = function() {
+	// Nothing to do for a text node
+};
+
+/*
+Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
+*/
+CodeBlockWidget.prototype.refresh = function(changedTiddlers) {
+	return false;
+};
+
+exports.codeblock = CodeBlockWidget;
+
+})();

editions/clientserver/tiddlywiki.info

@@ -2,7 +2,8 @@
 	"plugins": [
 		"tiddlywiki/tiddlyweb",
 		"tiddlywiki/filesystem",
-		"tiddlywiki/codemirror"
+		"tiddlywiki/codemirror",
+		"tiddlywiki/highlight"
 	],
 	"themes": [
 		"tiddlywiki/vanilla",
@@ -17,4 +18,4 @@
 	"includeWikis": [
 		"../tw5.com"
 	]
-}
+}

editions/highlightdemo/tiddlers/DefaultTiddlers.tid

@@ -0,0 +1,4 @@
+title: $:/DefaultTiddlers
+
+[[HelloThere]]
+[[HighlightExample]]

editions/highlightdemo/tiddlers/HelloThere.tid

@@ -0,0 +1,13 @@
+title: HelloThere
+
+This is a demo of TiddlyWiki5 incorporating a plugin for the [[highlight.js|https://github.com/isagalaev/highlight.js]] Syntax highlighting for the Web from Ivan Sagalaev.
+
+The HighlightExample tiddler have fenced blocks of code.
+
+To add the plugin to your own TiddlyWiki5, just drag this link to the browser window:
+
+[[$:/plugins/tiddlywiki/highlight]]
+
+To add your prefered [[theme|http://highlightjs.org/static/test.html]] append to your:
+
+[[$:/tags/stylesheet]]

editions/highlightdemo/tiddlers/HighlightExample.tid

@@ -0,0 +1,57 @@
+title: HighlightExample
+
+''Javascript'' fenced code:
+
+```javascript
+(function(a,b){
+    var result = a+b;
+    return result;
+})(10,20)
+```
+
+''CSS'' fenced code:
+
+```css
+ * { margin: 0; padding: 0; } /* micro reset */
+
+html { font-size: 62.5%; }
+body { font-size: 14px; font-size: 1.4rem; } /* =14px */
+h1   { font-size: 24px; font-size: 2.4rem; } /* =24px */
+```
+
+''Perl'' fenced code:
+
+```perl
+package Name;
+my $singleton;
+
+BEGIN {
+    $singleton = {
+        attribute => 'value',
+        another   => 'something',
+    };
+    bless $singleton, "Name";
+}
+
+sub new {
+    my $class = shift;
+    return $singleton;
+}
+```
+
+''Python'' fenced code:
+
+```
+class Singleton:
+    __single = None
+    def __init__( self ):
+        if Singleton.__single:
+            raise Singleton.__single
+        Singleton.__single = self
+```
+
+''~No-Highlight'' now
+
+```no-highlight
+$ TW5_BUILD_OUTPUT=tmp/ ./bld.sh
+```

editions/highlightdemo/tiddlers/SiteSubtitle.tid

@@ -0,0 +1,3 @@
+title: SiteSubtitle
+
+a demo of the Highlight plugin for TiddlyWiki5

editions/highlightdemo/tiddlers/SiteTitle.tid

@@ -0,0 +1,3 @@
+title: SiteTitle
+
+highlightdemo

editions/highlightdemo/tiddlywiki.info

@@ -0,0 +1,13 @@
+{
+	"plugins": [
+		"tiddlywiki/highlight"
+	],
+	"themes": [
+		"tiddlywiki/vanilla",
+		"tiddlywiki/snowwhite"
+	],
+	"doNotSave": [
+	],
+	"includeWikis": [
+	]
+}

licenses/cla-individual.md

@@ -126,3 +126,5 @@ Stephan Hradek, @Skeeve, 2013/11/30
 Brian Shaver, @shakerlxxv, 2013/12/07
 
 Paul Bond, @willover, 2013/12/17
+
+João Bolila, @jbolila, 2014/01/05

plugins/tiddlywiki/highlight/files/default.css

@@ -0,0 +1,153 @@
+/*
+
+Original style from softwaremaniacs.org (c) Ivan Sagalaev <Maniac@SoftwareManiacs.Org>
+
+*/
+
+.hljs {
+  display: block; padding: 0.5em;
+  background: #F0F0F0;
+}
+
+.hljs,
+.hljs-subst,
+.hljs-tag .hljs-title,
+.lisp .hljs-title,
+.clojure .hljs-built_in,
+.nginx .hljs-title {
+  color: black;
+}
+
+.hljs-string,
+.hljs-title,
+.hljs-constant,
+.hljs-parent,
+.hljs-tag .hljs-value,
+.hljs-rules .hljs-value,
+.hljs-rules .hljs-value .hljs-number,
+.hljs-preprocessor,
+.hljs-pragma,
+.haml .hljs-symbol,
+.ruby .hljs-symbol,
+.ruby .hljs-symbol .hljs-string,
+.hljs-aggregate,
+.hljs-template_tag,
+.django .hljs-variable,
+.smalltalk .hljs-class,
+.hljs-addition,
+.hljs-flow,
+.hljs-stream,
+.bash .hljs-variable,
+.apache .hljs-tag,
+.apache .hljs-cbracket,
+.tex .hljs-command,
+.tex .hljs-special,
+.erlang_repl .hljs-function_or_atom,
+.asciidoc .hljs-header,
+.markdown .hljs-header,
+.coffeescript .hljs-attribute {
+  color: #800;
+}
+
+.smartquote,
+.hljs-comment,
+.hljs-annotation,
+.hljs-template_comment,
+.diff .hljs-header,
+.hljs-chunk,
+.asciidoc .hljs-blockquote,
+.markdown .hljs-blockquote {
+  color: #888;
+}
+
+.hljs-number,
+.hljs-date,
+.hljs-regexp,
+.hljs-literal,
+.hljs-hexcolor,
+.smalltalk .hljs-symbol,
+.smalltalk .hljs-char,
+.go .hljs-constant,
+.hljs-change,
+.lasso .hljs-variable,
+.makefile .hljs-variable,
+.asciidoc .hljs-bullet,
+.markdown .hljs-bullet,
+.asciidoc .hljs-link_url,
+.markdown .hljs-link_url {
+  color: #080;
+}
+
+.hljs-label,
+.hljs-javadoc,
+.ruby .hljs-string,
+.hljs-decorator,
+.hljs-filter .hljs-argument,
+.hljs-localvars,
+.hljs-array,
+.hljs-attr_selector,
+.hljs-important,
+.hljs-pseudo,
+.hljs-pi,
+.haml .hljs-bullet,
+.hljs-doctype,
+.hljs-deletion,
+.hljs-envvar,
+.hljs-shebang,
+.apache .hljs-sqbracket,
+.nginx .hljs-built_in,
+.tex .hljs-formula,
+.erlang_repl .hljs-reserved,
+.hljs-prompt,
+.asciidoc .hljs-link_label,
+.markdown .hljs-link_label,
+.vhdl .hljs-attribute,
+.clojure .hljs-attribute,
+.asciidoc .hljs-attribute,
+.lasso .hljs-attribute,
+.coffeescript .hljs-property,
+.hljs-phony {
+  color: #88F
+}
+
+.hljs-keyword,
+.hljs-id,
+.hljs-title,
+.hljs-built_in,
+.hljs-aggregate,
+.css .hljs-tag,
+.hljs-javadoctag,
+.hljs-phpdoc,
+.hljs-yardoctag,
+.smalltalk .hljs-class,
+.hljs-winutils,
+.bash .hljs-variable,
+.apache .hljs-tag,
+.go .hljs-typename,
+.tex .hljs-command,
+.asciidoc .hljs-strong,
+.markdown .hljs-strong,
+.hljs-request,
+.hljs-status {
+  font-weight: bold;
+}
+
+.asciidoc .hljs-emphasis,
+.markdown .hljs-emphasis {
+  font-style: italic;
+}
+
+.nginx .hljs-built_in {
+  font-weight: normal;
+}
+
+.coffeescript .javascript,
+.javascript .xml,
+.lasso .markup,
+.tex .hljs-formula,
+.xml .javascript,
+.xml .vbscript,
+.xml .css,
+.xml .hljs-cdata {
+  opacity: 0.5;
+}

plugins/tiddlywiki/highlight/files/tiddlywiki.files

@@ -0,0 +1,22 @@
+{
+	"tiddlers": [
+		{
+			"file": "highlight.pack.js",
+			"fields": {
+				"type": "application/javascript",
+				"title": "$:/plugins/tiddlywiki/highlight/highlight.js",
+				"module-type": "library"
+			},
+			"prefix": "var hljs;if($tw.browser){\n",
+			"suffix": "}\nexports.hljs = hljs;\n"
+		},
+		{
+			"file": "default.css",
+			"fields": {
+				"type": "text/css",
+				"title": "$:/plugins/tiddlywiki/highlight/highlight.css",
+				"tags": "[[$:/tags/stylesheet]]"
+			}
+		}
+	]
+}

plugins/tiddlywiki/highlight/highlightblock.js

@@ -0,0 +1,41 @@
+/*\
+title: $:/plugins/tiddlywiki/highlight/highlightblock.js
+type: application/javascript
+module-type: widget
+
+Wraps up the fenced code blocks parser for highlight and use in TiddlyWiki5
+
+\*/
+(function() {
+
+		/*jslint node: true, browser: true */
+		/*global $tw: false */
+		"use strict";
+
+		var CodeBlockWidget = require("$:/core/modules/widgets/codeblock.js").codeblock;
+
+		CodeBlockWidget.prototype.render = function(parent,nextSibling) {
+			var hljs, lang;
+
+			this.parentDomNode = parent;
+			this.computeAttributes();
+			this.execute();
+			var codeNode = this.document.createElement("code");
+			if(this.getAttribute("language")) {
+				lang = this.getAttribute("language");
+			}
+
+			var domNode = this.document.createElement("pre");
+			codeNode.appendChild(this.document.createTextNode(this.getAttribute("code")));
+			domNode.appendChild(codeNode);
+			parent.insertBefore(domNode,nextSibling);
+			this.domNodes.push(domNode);
+
+			if($tw.browser && lang !== 'no-highlight') {
+					hljs = require("$:/plugins/tiddlywiki/highlight/highlight.js").hljs,
+					hljs.tabReplace = '    ';
+					hljs.highlightBlock(domNode);
+			}
+		};
+
+})();

plugins/tiddlywiki/highlight/license.tid

@@ -0,0 +1,27 @@
+title: $:/plugins/tiddlywiki/highlight/license
+type: text/plain
+
+Copyright (c) 2006, Ivan Sagalaev
+All rights reserved.
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
+
+    * Redistributions of source code must retain the above copyright
+      notice, this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above copyright
+      notice, this list of conditions and the following disclaimer in the
+      documentation and/or other materials provided with the distribution.
+    * Neither the name of highlight.js nor the names of its contributors
+      may be used to endorse or promote products derived from this software
+      without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE REGENTS AND CONTRIBUTORS ``AS IS'' AND ANY
+EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED
+WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE REGENTS AND CONTRIBUTORS BE LIABLE FOR ANY
+DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES
+(INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES;
+LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND
+ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+(INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS
+SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

plugins/tiddlywiki/highlight/plugin.info

@@ -0,0 +1,5 @@
+{
+	"title": "$:/plugins/tiddlywiki/highlight",
+	"description": "Highlight.js plugin for TiddlyWiki5",
+	"author": "JoaoBolila"
+}

plugins/tiddlywiki/highlight/styles.tid

@@ -0,0 +1,56 @@
+title: $:/plugins/tiddlywiki/highlight/styles
+tags: [[$:/tags/stylesheet]]
+
+
+/* Tomorrow Night Theme */
+/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
+/* Original theme - https://github.com/chriskempson/tomorrow-theme */
+/* http://jmblog.github.com/color-themes-for-google-code-highlightjs */
+.tomorrow-comment, pre .comment, pre .title {
+  color: #969896;
+}
+
+.tomorrow-red, pre .variable, pre .attribute, pre .tag, pre .regexp, pre .ruby .constant, pre .xml .tag .title, pre .xml .pi, pre .xml .doctype, pre .html .doctype, pre .css .id, pre .css .class, pre .css .pseudo {
+  color: #cc6666;
+}
+
+.tomorrow-orange, pre .number, pre .preprocessor, pre .pragma, pre .built_in, pre .literal, pre .params, pre .constant {
+  color: #de935f;
+}
+
+.tomorrow-yellow, pre .ruby .class .title, pre .css .rules .attribute {
+  color: #f0c674;
+}
+
+.tomorrow-green, pre .string, pre .value, pre .inheritance, pre .header, pre .ruby .symbol, pre .xml .cdata {
+  color: #b5bd68;
+}
+
+.tomorrow-aqua, pre .css .hexcolor {
+  color: #8abeb7;
+}
+
+.tomorrow-blue, pre .function, pre .python .decorator, pre .python .title, pre .ruby .function .title, pre .ruby .title .keyword, pre .perl .sub, pre .javascript .title, pre .coffeescript .title {
+  color: #81a2be;
+}
+
+.tomorrow-purple, pre .keyword, pre .javascript .function {
+  color: #b294bb;
+}
+
+pre code {
+  display: block;
+  background: #1d1f21;
+  color: #c5c8c6;
+  padding: 0.5em;
+}
+
+pre .coffeescript .javascript,
+pre .javascript .xml,
+pre .tex .formula,
+pre .xml .javascript,
+pre .xml .vbscript,
+pre .xml .css,
+pre .xml .cdata {
+  opacity: 0.5;
+}