From 11c90318733dd5f7bfe7de48295c8e13d2794922 Mon Sep 17 00:00:00 2001
From: Jeremy Ruston <jeremy@osmosoft.com>
Date: Thu, 14 Jun 2012 18:18:32 +0100
Subject: [PATCH] Added support for style blocks

---
 .../newwikitextparser/rules/styleblock.js     | 58 +++++++++++++++++++
 core/modules/treenodes/element.js             |  7 +++
 core/modules/treenodes/node.js                |  7 +++
 tw5.com/tiddlers/Docs.tid                     |  1 +
 .../wikitextrules/StyleBlockWikiText.tid      | 21 +++++++
 5 files changed, 94 insertions(+)
 create mode 100644 core/modules/parsers/newwikitextparser/rules/styleblock.js
 create mode 100644 tw5.com/tiddlers/wikitextrules/StyleBlockWikiText.tid

diff --git a/core/modules/parsers/newwikitextparser/rules/styleblock.js b/core/modules/parsers/newwikitextparser/rules/styleblock.js
new file mode 100644
index 000000000..decc92b55
--- /dev/null
+++ b/core/modules/parsers/newwikitextparser/rules/styleblock.js
@@ -0,0 +1,58 @@
+/*\
+title: $:/core/modules/parsers/newwikitextparser/rules/styleblock.js
+type: application/javascript
+module-type: wikitextrule
+
+Wiki text block rule for assigning classes to paragraphs and other blocks. For example:
+
+{{{
+{{myClass{
+This paragraph will have the CSS class `myClass`.
+
+* The `<ul>` around this list will also have the class `myClass`
+* List item 2
+
+ }}}
+}}}
+
+Note that the opening and closing braces both must be immediately followed by a newline.
+
+\*/
+(function(){
+
+/*jslint node: true, browser: true */
+/*global $tw: false */
+"use strict";
+
+exports.name = "style";
+
+exports.blockParser = true;
+
+exports.regExpString = "@@[a-zA-Z0-9_\\-]+:.*$";
+
+exports.parse = function(match,isBlock) {
+	var styles = {},
+		tree = [],
+		reStyleSpecififer = /@@([a-zA-Z0-9_\-]+):(.*)((?:\r?\n)?)/mg,
+		reEndString = "@@",
+		endMatch;
+	// Look for the first style specifier
+	reStyleSpecififer.lastIndex = this.pos;
+	match = reStyleSpecififer.exec(this.source);
+	while(match) {
+		// Save the style specified
+		styles[match[1].trim()] = match[2].trim();
+		// Look to see if there is a further style specifier
+		this.pos = match.index + match[0].length;
+		reStyleSpecififer.lastIndex = this.pos;
+		match = reStyleSpecififer.exec(this.source);
+	}
+	// Parse until we get to the end marker
+	tree = this.parseBlocks(reEndString);
+	for(var t=0; t<tree.length; t++) {
+		tree[t].addStyles(styles);
+	}
+	return tree;
+};
+
+})();
diff --git a/core/modules/treenodes/element.js b/core/modules/treenodes/element.js
index 6b8752e90..2dd745020 100644
--- a/core/modules/treenodes/element.js
+++ b/core/modules/treenodes/element.js
@@ -158,6 +158,13 @@ Element.prototype.addClass = function(className) {
 	this.attributes["class"].push(className);
 };
 
+Node.prototype.addStyles = function(styles) {
+	this.attributes.style = this.attributes.style || {};
+	for(var t in styles) {
+		this.attributes.style[t] = styles[t];
+	}
+};
+
 exports.Element = Element;
 
 })();
diff --git a/core/modules/treenodes/node.js b/core/modules/treenodes/node.js
index 512d88539..e77182346 100644
--- a/core/modules/treenodes/node.js
+++ b/core/modules/treenodes/node.js
@@ -75,6 +75,13 @@ Node.prototype.addClass = function(className) {
 
 };
 
+/*
+Add styles to a node
+*/
+Node.prototype.addStyles = function(styles) {
+
+};
+
 exports.Node = Node;
 
 })();
diff --git a/tw5.com/tiddlers/Docs.tid b/tw5.com/tiddlers/Docs.tid
index 045c9dea6..e17d38ba9 100644
--- a/tw5.com/tiddlers/Docs.tid
+++ b/tw5.com/tiddlers/Docs.tid
@@ -46,6 +46,7 @@ These are the individual rules that make up WikiText:
 * MacroWikiText
 * PrettyLinkWikiText
 * RuleWikiText
+* StyleBlockWikiText
 * TypedBlockWikiText
 * WikiLinkWikiText
 
diff --git a/tw5.com/tiddlers/wikitextrules/StyleBlockWikiText.tid b/tw5.com/tiddlers/wikitextrules/StyleBlockWikiText.tid
new file mode 100644
index 000000000..6791af3fc
--- /dev/null
+++ b/tw5.com/tiddlers/wikitextrules/StyleBlockWikiText.tid
@@ -0,0 +1,21 @@
+title: StyleBlockWikiText
+
+This syntax enables you to assign arbitrary styles to generated elements. For example:
+
+{{{
+@@color:#f00
+This is in red!
+@@
+}}}
+
+Generates the results:
+
+@@color:#f00
+This is in red!
+@@
+
+The HTML looks like this:
+
+{{{
+<p style="color:rgb(255, 0, 0);">This is in red!</p>
+}}}