Added a table of content as bbcode element [toc] for webpages

- Included jquery.toc.js (http://www.apache.org/licenses/LICENSE-2.0) - Modified jquery.toc.js to work with the webpages of the red#matrix - Added info to the help
author: <tomwie@users.sourceforge.net> 2015-01-14 22:47:54 +0100
committer: <tomwie@users.sourceforge.net> 2015-01-14 22:47:54 +0100
commit: 09129cbe5f7e8cb331b68469b74438464960af0b (patch)
tree: 7e7a2cceec6f739032381f5141f2e7002a96530a
parent: 43b877caa1381c2ac8a031751acd2dab3ec739f0 (diff)
download: volse-hubzilla-09129cbe5f7e8cb331b68469b74438464960af0b.tar.gz
volse-hubzilla-09129cbe5f7e8cb331b68469b74438464960af0b.tar.bz2
volse-hubzilla-09129cbe5f7e8cb331b68469b74438464960af0b.zip
6 files changed, 101 insertions, 195 deletions
diff --git a/doc/bbcode.html b/doc/bbcode.html
index fac768879..f0b61b33c 100644
--- a/doc/bbcode.html
+++ b/doc/bbcode.html
@@ -65,7 +65,8 @@
 
 <li>[rpost=title]Text to post[/rpost] The observer will be returned to their home hub to enter a post with the specified title and body. Both are optional <br />
 <li>[qr]text to post[/qr] - create a QR code.<br />
-<br />
+<li>[toc] - create a table of content in a webpage (level h1,...,h4).<br />
+<br /><br />
 </ul>
 
 <p>These require a suitable map plugin/addon such as openstreetmap or else the result will be blank</p>
diff --git a/include/bbcode.php b/include/bbcode.php
index 441c4cc5c..33017c011 100644
--- a/include/bbcode.php
+++ b/include/bbcode.php
@@ -575,7 +575,7 @@ function bbcode($Text,$preserve_nl = false, $tryoembed = true) {
 	if (strpos($Text,'[h6]') !== false) {
 		$Text = preg_replace("(\[h6\](.*?)\[\/h6\])ism",'<h6>$1</h6>',$Text);
 	}
-	// Check for h6
+	// Check for table of content
 	if (strpos($Text,'[toc]') !== false) {
 		$Text = preg_replace("/\[toc\]/ism",'<ul id="toc"></ul>',$Text);
 	}
diff --git a/library/tableofcontents/jquery.tableofcontents.js b/library/tableofcontents/jquery.tableofcontents.js
deleted file mode 100644
index 93288bbc7..000000000
--- a/library/tableofcontents/jquery.tableofcontents.js
+++ /dev/null
@@ -1,191 +0,0 @@
-/*
-	TableOfContents Plugin for jQuery (by Doug Neiner)
-	
-	Version: 0.8
-		
-	Based on code and concept by Janko Jovanovic 
-	  in his article: http://www.jankoatwarpspeed.com/post/2009/08/20/Table-of-contents-using-jQuery.aspx
-	
-	This plugin is offered under the MIT license.
-	(c) 2009 by Doug Neiner, http://dougneiner.com
-	
-	Iclude in html like this (just an example)
-	<pre>			
-		---
-		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
-		<script src="jquery.tableofcontents.min.js" type="text/javascript" charset="utf-8"></script>
-		<script type="text/javascript" charset="utf-8">
-				$(document).ready(function(){ $("#toc").tableOfContents(); });
-			</script>
-		</head>
-		<body>
-		<ul id="toc"></ul>
-		...
-	</pre>
- */
-(function($) {
-	$.TableOfContents = function(el, scope, options) {
-		var base = this;
-		base.$el = $(el);
-		base.el = el;
-		base.toc = "";
-		base.listStyle = null;
-		base.tags = [ "h1", "h2", "h3", "h4", "h5", "h6" ];
-		base.init = function() {
-			base.options = $.extend({}, $.TableOfContents.defaultOptions,
-					options);
-			if (typeof (scope) == "undefined" || scope == null)
-				scope = document.body;
-			base.$scope = $(scope);
-			var $first = base.$scope.find(base.tags.join(', '))
-					.filter(':first');
-			if ($first.length != 1)
-				return;
-			base.starting_depth = base.options.startLevel;
-			if (base.options.depth < 1)
-				base.options.depth = 1;
-			var filtered_tags = base.tags.splice(base.options.startLevel - 1,
-					base.options.depth);
-			base.$headings = base.$scope.find(filtered_tags.join(', '));
-			if (base.options.topLinks !== false) {
-				var id = $(document.body).attr('id');
-				if (id == "") {
-					id = base.options.topBodyId;
-					document.body.id = id
-				}
-				;
-				base.topLinkId = id
-			}
-			;
-			if (base.$el.is('ul')) {
-				base.listStyle = 'ul'
-			} else if (base.$el.is('ol')) {
-				base.listStyle = 'ol'
-			}
-			;
-			base.buildTOC();
-			if (base.options.proportionateSpacing === true
-					&& !base.tieredList()) {
-				base.addSpacing()
-			}
-			;
-			return base
-		};
-		base.tieredList = function() {
-			return (base.listStyle == 'ul' || base.listStyle == 'ol')
-		};
-		base.buildTOC = function() {
-			base.current_depth = base.starting_depth;
-			base.$headings.each(function(i, element) {
-				var depth = this.nodeName.toLowerCase().substr(1, 1);
-				if (i > 0 || (i == 0 && depth != base.current_depth)) {
-					base.changeDepth(depth)
-				}
-				;
-				base.toc += base.formatLink(this, depth, i) + "\n";
-				if (base.options.topLinks !== false)
-					base.addTopLink(this)
-			});
-			base.changeDepth(base.starting_depth, true);
-			if (base.tieredList())
-				base.toc = "<li>\n" + base.toc + "</li>\n";
-			base.$el.html(base.toc)
-		};
-		base.addTopLink = function(element) {
-			var text = (base.options.topLinks === true ? "Top"
-					: base.options.topLinks);
-			var $a = $(
-					"<a href='#" + base.topLinkId + "' class='"
-							+ base.options.topLinkClass + "'></a>").html(text);
-			$(element).append($a)
-		};
-		base.formatLink = function(element, depth, index) {
-			var id = element.id;
-			if (id == "") {
-				id = base.buildSlug($(element).text());
-				element.id = id
-			}
-			;
-			var a = "<a href='#" + id + "'";
-			if (!base.tieredList())
-				a += " class='" + base.depthClass(depth) + "'";
-			a += ">" + base.options.levelText.replace('%', $(element).text())
-					+ '</a>';
-			return a
-		};
-		base.changeDepth = function(new_depth, last) {
-			if (last !== true)
-				last = false;
-			if (!base.tieredList()) {
-				base.current_depth = new_depth;
-				return true
-			}
-			;
-			if (new_depth > base.current_depth) {
-				var opening_tags = [];
-				for ( var i = base.current_depth; i < new_depth; i++) {
-					opening_tags.push('<' + base.listStyle + '>' + "\n")
-				}
-				;
-				var li = "<li>\n";
-				base.toc += opening_tags.join(li) + li
-			} else if (new_depth < base.current_depth) {
-				var closing_tags = [];
-				for ( var i = base.current_depth; i > new_depth; i--) {
-					closing_tags.push('</' + base.listStyle + '>' + "\n")
-				}
-				;
-				base.toc += "</li>\n" + closing_tags.join('</li>' + "\n");
-				if (!last) {
-					base.toc += "</li>\n<li>\n"
-				}
-			} else {
-				if (!last) {
-					base.toc += "</li>\n<li>\n"
-				}
-			}
-			;
-			base.current_depth = new_depth
-		};
-		base.buildSlug = function(text) {
-			text = text.toLowerCase().replace(/[^a-z0-9 -]/gi, '').replace(
-					/ /gi, '-');
-			text = text.substr(0, 50);
-			return text
-		};
-		base.depthClass = function(depth) {
-			return base.options.levelClass.replace('%',
-					(depth - (base.starting_depth - 1)))
-		};
-		base.addSpacing = function() {
-			var start = base.$headings.filter(':first').position().top;
-			base.$headings.each(function(i, el) {
-				var $a = base.$el.find('a:eq(' + i + ')');
-				var pos = (($(this).position().top - start) / (base.$scope
-						.height() - start))
-						* base.$el.height();
-				$a.css({
-					position : "absolute",
-					top : pos
-				})
-			})
-		};
-		return base.init()
-	};
-	$.TableOfContents.defaultOptions = {
-		startLevel : 1,
-		depth : 3,
-		levelClass : "toc-depth-%",
-		levelText : "%",
-		topLinks : false,
-		topLinkClass : "toc-top-link",
-		topBodyId : "toc-top",
-		proportionateSpacing : false
-	};
-	$.fn.tableOfContents = function(scope, options) {
-		return this.each(function() {
-			var toc = new $.TableOfContents(this, scope, options);
-			delete toc
-		})
-	}
-})(jQuery);
-\ No newline at end of file
diff --git a/library/tableofcontents/jquery.toc.js b/library/tableofcontents/jquery.toc.js
new file mode 100644
index 000000000..d136f5aab
--- /dev/null
+++ b/library/tableofcontents/jquery.toc.js
@@ -0,0 +1,96 @@
+/*
+ * Table of Contents jQuery Plugin - jquery.toc
+ *
+ * Copyright 2013 Nikhil Dabas
+ * 
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.  You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License
+ * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
+ * or implied.  See the License for the specific language governing permissions and limitations
+ * under the License.
+ * 
+ * The original script was modified to work within the red#martrix (added var pathname).
+ */
+
+(function ($) {
+    "use strict";
+
+    // Builds a list with the table of contents in the current selector.
+    // options:
+    //   content: where to look for headings
+    //   headings: string with a comma-separated list of selectors to be used as headings, ordered
+    //   by their relative hierarchy level
+    var toc = function (options) {
+        return this.each(function () {
+            var root = $(this),
+                data = root.data(),
+                thisOptions,
+                stack = [root], // The upside-down stack keeps track of list elements
+                listTag = this.tagName,
+                currentLevel = 0,
+                headingSelectors;
+
+            // Defaults: plugin parameters override data attributes, which override our defaults
+            thisOptions = $.extend(
+                {content: "body", headings: "h1,h2,h3"},
+                {content: data.toc || undefined, headings: data.tocHeadings || undefined},
+                options
+            );
+            headingSelectors = thisOptions.headings.split(",");
+
+            // Set up some automatic IDs if we do not already have them
+            $(thisOptions.content).find(thisOptions.headings).attr("id", function (index, attr) {
+                // Generate a valid ID: must start with a letter, and contain only letters and
+                // numbers. All other characters are replaced with underscores.
+                return attr ||
+                    $(this).text().replace(/^[^A-Za-z]*/, "").replace(/[^A-Za-z0-9]+/g, "_");
+            }).each(function () {
+                // What level is the current heading?
+                var elem = $(this), level = $.map(headingSelectors, function (selector, index) {
+                    return elem.is(selector) ? index : undefined;
+                })[0];
+
+                if (level > currentLevel) {
+                    // If the heading is at a deeper level than where we are, start a new nested
+                    // list, but only if we already have some list items in the parent. If we do
+                    // not, that means that we're skipping levels, so we can just add new list items
+                    // at the current level.
+                    // In the upside-down stack, unshift = push, and stack[0] = the top.
+                    var parentItem = stack[0].children("li:last")[0];
+                    if (parentItem) {
+                        stack.unshift($("<" + listTag + "/>").appendTo(parentItem));
+                    }
+                } else {
+                    // Truncate the stack to the current level by chopping off the 'top' of the
+                    // stack. We also need to preserve at least one element in the stack - that is
+                    // the containing element.
+                    stack.splice(0, Math.min(currentLevel - level, Math.max(stack.length - 1, 0)));
+                }
+                // the variable pathname was added to the original script.
+            	var pathname = window.location.pathname;
+                // Add the list item
+                $("<li/>").appendTo(stack[0]).append(
+                    $("<a/>").text(elem.text()).attr("href", pathname + "#" + elem.attr("id"))
+                );
+
+                currentLevel = level;
+            });
+        });
+    }, old = $.fn.toc;
+
+    $.fn.toc = toc;
+
+    $.fn.toc.noConflict = function () {
+        $.fn.toc = old;
+        return this;
+    };
+
+    // Data API
+    $(function () {
+        toc.call($("[data-toc]"));
+    });
+}(window.jQuery));
diff --git a/view/js/main.js b/view/js/main.js
index 459600793..0c56c8d41 100644
--- a/view/js/main.js
+++ b/view/js/main.js
@@ -1125,7 +1125,7 @@ $(document).ready(function() {
 
 
 	$(".autotime").timeago();
-	$("#toc").tableOfContents(); 
+	$("#toc").toc({content: "div.page-body", headings: "h1,h2,h3,h4"});
 	
 
 });
diff --git a/view/php/theme_init.php b/view/php/theme_init.php
index 1b6c418f7..b3580b81f 100644
--- a/view/php/theme_init.php
+++ b/view/php/theme_init.php
@@ -43,7 +43,7 @@ head_add_js('library/colorbox/jquery.colorbox-min.js');
 head_add_js('library/bootstrap-tagsinput/bootstrap-tagsinput.js');
 
 head_add_js('library/jquery.AreYouSure/jquery.are-you-sure.js');
-head_add_js('library/tableofcontents/jquery.tableofcontents.js');
+head_add_js('library/tableofcontents/jquery.toc.js');
 /**
  * Those who require this feature will know what to do with it.
  * Those who don't, won't.
author	<tomwie@users.sourceforge.net>	2015-01-14 22:47:54 +0100
committer	<tomwie@users.sourceforge.net>	2015-01-14 22:47:54 +0100
commit	09129cbe5f7e8cb331b68469b74438464960af0b (patch)
tree	7e7a2cceec6f739032381f5141f2e7002a96530a
parent	43b877caa1381c2ac8a031751acd2dab3ec739f0 (diff)
download	volse-hubzilla-09129cbe5f7e8cb331b68469b74438464960af0b.tar.gz volse-hubzilla-09129cbe5f7e8cb331b68469b74438464960af0b.tar.bz2 volse-hubzilla-09129cbe5f7e8cb331b68469b74438464960af0b.zip