tw5-graph 1.7.1

package/plugins/graph/utils.js

@@ -0,0 +1,95 @@
+/*\
+title: $:/plugins/flibbles/graph/utils.js
+type: application/javascript
+module-type: library
+
+Utility methods used by the graphing widgets.
+
+\*/
+
+"use strict";
+
+var Engines = $tw.modules.createClassesFromModules("graphengine");
+
+$tw.modules.applyMethods("graphutils", exports);
+
+/*
+Returns the window for flibbles/graph to use. I do this so that the testing
+framework can mock it out on Node.JS.
+*/
+exports.window = function() { return window; };
+
+exports.getEngineMap = function() {
+	return Engines;
+};
+
+exports.getEngine = function(name) {
+	var engineMap = exports.getEngineMap();
+	return engineMap[name] || null;
+};
+
+exports.getParentProperties = function(widget, type) {
+	// For now, we hard-stop at the graph. We don't take properties outside
+	// We may some day, but for now, support for that would be frought with
+	// complications
+	while (widget.parentWidget && widget.graphObjectType !== "graph") {
+		widget = widget.parentWidget;
+		if (widget.graphPropertiesWidget && widget.type === type) {
+			return widget;
+		}
+	};
+	return null;
+};
+
+/*** Destructor methods ***/
+
+// Aren't we all eventually garbage?
+var eventualGarbage = [];
+var upkeepId;
+
+/*
+Register an object for destruction. It's ready to pass on once its
+isGarbage method returns true;
+
+object requirements:
+.garbageCollect()
+.isGarbage() => true/false
+*/
+exports.registerForGarbageCollection = function(object) {
+	var destroy = object.destroy;
+	if (destroy) {
+		// This object has a destroy method, which means it's probably
+		// a widget in ^v5.4.0 TiddlyWiki, which are capable of
+		// destruction. We'll use that system instead. It's better.
+		object.destroy = function() {
+			// Call the widget core destroy method
+			destroy.apply(object, arguments);
+			// And then our own method
+			object.garbageCollect();
+		};
+	} else {
+		// Otherwise, we'll need to keep tabs on this so we can check
+		// back in occasionally to see if it should be destroyed.
+		if (!upkeepId) {
+			upkeepId = setInterval(exports.upkeep, 5000);
+		}
+		eventualGarbage.push(object);
+	}
+};
+
+exports.upkeep = function() {
+	var i = eventualGarbage.length;
+	while (i > 0) {
+		i--;
+		var object = eventualGarbage[i];
+		if (object.isGarbage()) {
+			eventualGarbage.splice(i, 1);
+			object.garbageCollect();
+		}
+	}
+	// No managed objects. Let's shut down for now.
+	if (eventualGarbage.length == 0) {
+		clearInterval(upkeepId);
+		upkeepId = null;
+	}
+};

package/plugins/graph/widgets/action-delay.js

@@ -0,0 +1,72 @@
+/*\
+
+Action widget that introduces a delay before executing any nested actions it contains.
+
+\*/
+
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+
+var DelayWidget = function(parseTreeNode, options) {
+	this.initialise(parseTreeNode, options);
+};
+
+DelayWidget.prototype = new Widget();
+
+DelayWidget.prototype.render = function(parent, nextSibling) {
+	this.parentDomNode = parent;
+	this.computeAttributes();
+	this.execute();
+	this.renderChildren(parent, nextSibling);
+};
+
+DelayWidget.prototype.execute = function() {
+	this.ms = this.getAttribute("$ms", 0);
+	this.state = this.getAttribute("$state");
+	this.makeChildWidgets();
+};
+
+DelayWidget.prototype.refresh = function(changedTiddlers) {
+	var changedAttributes = this.computeAttributes();
+	if ($tw.utils.count(changedAttributes) > 0) {
+		this.refreshSelf();
+		return true;
+	}
+	return this.refreshChildren(changedTiddlers);
+};
+
+var counter = 0;
+
+DelayWidget.prototype.invokeAction = function(triggeringWidget, event) {
+	// The id is used to make sure the later timed invocation corresponds
+	// to this method call here.
+	var id = (counter++).toString();
+	if (this.state) {
+		this.wiki.addTiddler({title: this.state, text: id});
+	}
+	return setTimeout(execute, this.ms, this, triggeringWidget, event, id);
+};
+
+DelayWidget.prototype.allowActionPropagation = function() {
+	return false;
+};
+
+function execute(delayWidget, triggeringWidget, event, id) {
+	var state = delayWidget.state;
+	if (state) {
+		var text = delayWidget.wiki.getTiddlerText(state);
+		if (text !== id) {
+			// The state tiddler was touched by another action.
+			// So we should not act. We're stale.
+			return;
+		}
+	}
+	delayWidget.refreshChildren();
+	delayWidget.invokeActions(triggeringWidget, event);
+	if (state) {
+		delayWidget.wiki.deleteTiddler(state);
+	}
+};
+
+exports["action-delay"] = DelayWidget;

package/plugins/graph/widgets/action-modal.js

@@ -0,0 +1,121 @@
+/*\
+
+Action widget that creates a modal to select an existing tiddler, or specify a new one. After dialog is confirmed, it will execute any nested actions it contains.
+
+\*/
+
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+var utils = require("../utils.js");
+
+/**
+ * This points to whatever action invoked the current modal. It assumes that
+ * only one modal is possible at a time. Probably a safe assumption.
+ */
+var primedWidget;
+
+var ModalWidget = function(parseTreeNode, options) {
+	this.initialise(parseTreeNode, options);
+};
+
+ModalWidget.prototype = new Widget();
+
+ModalWidget.prototype.render = function(parent, nextSibling) {
+	this.parentDomNode = parent;
+	this.computeAttributes();
+	this.execute();
+	this.renderChildren(parent, nextSibling);
+};
+
+ModalWidget.prototype.execute = function() {
+	this.modalTiddler = this.getAttribute("$tiddler");
+	this.modal = $tw.modal;
+	if (!this.modal || this.modal.wiki !== this.wiki) {
+		// Ah, we have a modal working with a subwiki (or a Node.JS system
+		// which has no modal). We'll create an overlay of the modal
+		// that works with our subwiki instead.
+		this.modal = Object.create($tw.modal || null);
+		this.modal.wiki = this.wiki;
+	}
+	this.makeChildWidgets();
+};
+
+ModalWidget.prototype.refresh = function(changedTiddlers) {
+	var changedAttributes = this.computeAttributes();
+	if ($tw.utils.count(changedAttributes) > 0) {
+		this.refreshSelf();
+		return true;
+	}
+	return this.refreshChildren(changedTiddlers);
+};
+
+ModalWidget.prototype.invokeAction = function(triggeringWidget, event) {
+	if (!$tw.rootWidget.eventListeners['tm-modal-finish']) {
+		$tw.rootWidget.addEventListener("tm-modal-finish", function(finishEvent) {
+			if (primedWidget) {
+				var value = finishEvent.param;
+				primedWidget.setVariable("selection", value);
+				primedWidget.refreshChildren();
+				primedWidget.invokeActions(primedWidget, event);
+				primedWidget = undefined;
+			}
+		});
+	}
+	primedWidget = this;
+	var variables = Object.create(null);
+	for (var key in this.attributes) {
+		if (key.charAt(0) !== "$") {
+			variables[key] = this.attributes[key];
+		}
+	}
+	if (this.modalTiddler) {
+		var self = this;
+		// We need to delay the assignment of click handlers for a few
+		// milliseconds. See Issue #43. If we don't, a click event might
+		// follow right after the "make modal" which closes the modal
+		// immediately.
+		delayEventListenerAssignment(function() {
+			self.modal.display(self.modalTiddler, {
+				variables: variables,
+				event: event});
+		});
+	}
+
+};
+
+ModalWidget.prototype.allowActionPropagation = function() {
+	return false;
+};
+
+function delayEventListenerAssignment(method) {
+	var assignments = [];
+	// We use this requested window instead of just accessing directly
+	// so that the test framework can mock it up.
+	var window = utils.window();
+	var oldListener = window.EventTarget.prototype.addEventListener;
+	window.EventTarget.prototype.addEventListener = function(type) {
+		var args = Array.prototype.slice.call(arguments);
+		if (type === "click") {
+			// This is the click which might accidentally apply to the
+			// backdrop if we're on mobile. Delay it.
+			assignments.push({self: this, args: args});
+		} else {
+			// Just call through. We don't care about this handler.
+			oldListener.apply(this, args);
+		}
+	};
+	try {
+		method();
+	} finally {
+		window.EventTarget.prototype.addEventListener = oldListener;
+	}
+	setTimeout(function() {
+		for (var i = 0; i < assignments.length; i++) {
+			var set = assignments[i];
+			set.self.addEventListener.apply(set.self, set.args);
+		}
+	}, 10);
+};
+
+exports["action-modal"] = ModalWidget;

package/plugins/graph/widgets/action-typed.js

@@ -0,0 +1,56 @@
+/*\
+
+Creates two action widgets for adding and removing from typed fields.
+
+\*/
+
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+var typeOperators = $tw.modules.getModulesByTypeAsHashmap("fieldtype");
+var relinkPrefix = "$:/config/flibbles/relink/fields/" ;
+
+var TypedWidget = new Widget();
+
+TypedWidget.render = function(parent, nextSibling) {
+	this.computeAttributes();
+	this.execute();
+};
+
+TypedWidget.execute = function() {
+	this.actionTiddler = this.getAttribute("$tiddler") || (!this.hasParseTreeNodeAttribute("$tiddler") && this.getVariable("currentTiddler"));
+	this.actionField = this.getAttribute("$field");
+	this.actionValue = this.getAttribute("$value");
+	this.actionTimestamp = this.getAttribute("$timestamp","yes") === "yes";
+	this.actionClean = this.getAttribute("$clean","yes") === "yes";
+};
+
+TypedWidget.invokeAction = function(triggeringWidget, event) {
+	var tiddler = this.wiki.getTiddler(this.actionTiddler),
+		hasChanged = false,
+		options = {wiki: this.wiki, widget: this};
+	if (this.actionTiddler && this.actionField) {
+		options.suppressTimestamp = !this.actionTimestamp;
+		var typeName = this.wiki.getTiddlerText(relinkPrefix + this.actionField, "list");
+		var type = typeOperators[typeName];
+		if (type) {
+			var newValue = type[this.actionMethod](tiddler, this.actionField, this.actionValue, options);
+			if (newValue !== undefined) {
+				if (newValue === "" && this.actionClean) {
+					newValue = undefined;
+				}
+				options.wiki.setText(this.actionTiddler, this.actionField, null, newValue, options);
+			}
+		}
+	}
+};
+
+$tw.utils.each(["add", "remove"], function(method) {
+	var MethodWidget = function(parseTreeNode, options) {
+		this.initialise(parseTreeNode, options);
+	};
+
+	MethodWidget.prototype = Object.create(TypedWidget);
+	MethodWidget.prototype.actionMethod = method;
+	exports["action-" + method + "typed"] = MethodWidget;
+});

package/plugins/graph/widgets/action-with.js

@@ -0,0 +1,70 @@
+/*\
+
+Action widget that executes actions within it while exposing variables representing the mouse's current location.
+
+\*/
+
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+
+var WithWidget = function(parseTreeNode, options) {
+	this.initialise(parseTreeNode, options);
+};
+
+WithWidget.prototype = new Widget();
+
+WithWidget.prototype.render = function(parent, nextSibling) {
+	this.parentDomNode = parent;
+	this.computeAttributes();
+	this.execute();
+	this.renderChildren(parent, nextSibling);
+};
+
+WithWidget.prototype.execute = function() {
+	this.withOffset = this.getAttribute("$offset");
+	this.withCanvas = this.getAttribute("$canvas");
+	this.makeChildWidgets();
+};
+
+WithWidget.prototype.refresh = function(changedTiddlers) {
+	var changedAttributes = this.computeAttributes();
+	for (var attribute in changedAttributes) {
+		this.refreshSelf();
+		return true;
+	}
+	return this.refreshChildren(changedTiddlers);
+};
+
+WithWidget.prototype.invokeAction = function(triggeringWidget, event) {
+	var graph = getGraphWidget(this);
+	if (graph) {
+		if (this.withOffset) {
+			var mouse = graph.mouse,
+				x = mouse.x.toString(),
+				y = mouse.y.toString();
+			this.setVariable(this.withOffset + "-x", x);
+			this.setVariable(this.withOffset + "-y", y);
+		}
+		if (this.withCanvas) {
+			var element = graph.graphElement;
+			this.setVariable(this.withCanvas + "-width", element.offsetWidth);
+			this.setVariable(this.withCanvas + "-height", element.offsetHeight);
+		}
+	}
+	this.refreshChildren();
+	return true;
+};
+
+function getGraphWidget(self) {
+	var widget = self.parentWidget;
+	while (widget) {
+		if (widget.graphObjectType === "graph") {
+			return widget;
+		}
+		widget = widget.parentWidget;
+	}
+	return null;
+};
+
+exports["action-with"] = WithWidget;

package/plugins/graph/widgets/boundingbox.js

@@ -0,0 +1,126 @@
+/*\
+
+Widget for creating a DOM element which has strictly controlled dimensions,
+intended for a contained graph.
+
+\*/
+
+"use strict";
+
+var Widget = require("$:/core/modules/widgets/widget.js").widget;
+var utils = require("../utils.js");
+
+var BoxWidget = function(parseTreeNode, options) {
+	this.initialise(parseTreeNode, options);
+	utils.registerForGarbageCollection(this);
+	this.resizeInstance = this.resize.bind(this);
+	this.window = utils.window();
+	this.window.addEventListener("resize", this.resizeInstance);
+};
+
+/**
+ * Inherit from the base widget class
+ */
+BoxWidget.prototype = new Widget();
+
+/**
+ * Render this widget into the DOM
+ */
+BoxWidget.prototype.render = function(parent, nextSibling) {
+	this.parentDomNode = parent;
+	this.computeAttributes();
+	this.execute();
+	this.domNode = this.document.createElement("div");
+	this.domNode.className = this.boxClass;
+	parent.insertBefore(this.domNode, nextSibling);
+	// Make sure this comes AFTER inserting domNode into the tree,
+	// otherwise getBoundingClientRect() will be all zeros.
+	this.resize();
+	this.renderChildren(this.domNode, null);
+	this.domNodes.push(this.domNode);
+};
+
+/**
+ * Compute the internal state of the widget
+ */
+BoxWidget.prototype.execute = function() {
+	this.executeClass();
+	this.executeDimensions();
+	this.makeChildWidgets();
+};
+
+BoxWidget.prototype.executeDimensions = function() {
+	var self = this;
+	this.widthFilter = this.wiki.compileFilter(this.getAttribute("width", ""));
+	this.heightFilter = this.wiki.compileFilter(this.getAttribute("height", ""));
+	// We set up the widget so it only gets values for these variables
+	// if needed. This keeps down unncessary calls to window and document,
+	// and makes the $graph widget usable on Node, if that ever comes up.
+	var variableMethods = {
+		// It may be better to use document.body.clientWidth,
+		// which doesn't consider the scrollbar.
+		windowWidth: function() { return self.window.innerWidth.toString(); },
+		windowHeight: function() { return self.window.innerHeight.toString(); },
+		boundingLeft: function() { return self.domNode.getBoundingClientRect().left.toString(); },
+		boundingTop: function() { return self.domNode.getBoundingClientRect().top.toString(); },
+	};
+	var variables = {};
+	for (var name in variableMethods) {
+		Object.defineProperty(variables, name, { get: variableMethods[name] });
+	}
+	this.dimensionWidget = this.makeFakeWidgetWithVariables(variables);
+};
+
+/**
+ * Selectively refreshes the widget if needed.
+ * Returns true if the widget or any of its children needed re-rendering
+ */
+BoxWidget.prototype.refresh = function(changedTiddlers) {
+	var changedAttributes = this.computeAttributes();
+	var changed = false;
+	if (changedAttributes["class"]) {
+		this.executeClass();
+		this.domNode.className = this.boxClass;
+		changed = true;
+	}
+	if ($tw.utils.count(changedAttributes) > 0) {
+		this.executeDimensions();
+		changed = true;
+	}
+	// We always try to resize.
+	// The $dimension filters might spit out something different.
+	this.resize();
+	return this.refreshChildren(changedTiddlers) || changed;
+};
+
+BoxWidget.prototype.executeClass = function() {
+	var nodeClass = "boundingbox";
+	var extraClasses = this.getAttribute("class", "");
+	if (extraClasses) {
+		nodeClass += " " + extraClasses;
+	}
+	this.boxClass = nodeClass;
+};
+
+BoxWidget.prototype.resize = function(event) {
+	var newWidth = this.widthFilter(null, this.dimensionWidget)[0] || "";
+	var newHeight = this.heightFilter(null, this.dimensionWidget)[0] || "";
+	var style = this.domNode.style;
+	if (newWidth !== style.width) {
+		style.width = newWidth;
+	}
+	if (newHeight !== style.height) {
+		style.height = newHeight;
+	}
+};
+
+BoxWidget.prototype.garbageCollect = function() {
+	this.window.removeEventListener("resize", this.resizeInstance);
+};
+
+BoxWidget.prototype.isGarbage = function() {
+	var body = this.document.body;
+	return !body || !body.contains(this.domNode);
+};
+
+exports.boundingbox = BoxWidget;

package/plugins/graph/widgets/fieldtranscriber/filter.js

@@ -0,0 +1,93 @@
+/*\
+
+Type for transcribing application/x-tiddler-filter between text and field.
+
+Changes \n into "  " between runs to mitigate the need for multilines.
+However, it's impossible to guarantee a single line filter if newlines are
+used in operands.
+
+\*/
+
+"use strict";
+
+exports.name = "application/x-tiddler-filter";
+
+exports.toField = function(text) {
+	return filterWhitespaceWalk(text, function(start, end) {
+		var substr = text.substring(start, end);
+		var change = substr.replaceAll("\n", "  ");
+		return substr !== change ? change: null;
+	}).trim();
+};
+
+exports.fromField = function(text) {
+	return filterWhitespaceWalk(text, function(start, end) {
+		var substr = text.substring(start, end);
+		var change = substr.replaceAll("  ", "\n");
+		return substr !== change ? change: null;
+	});
+};
+
+var brackets = { "{": "}", "[": "]", "<": ">" };
+
+function filterWhitespaceWalk(filterString, method) {
+	var p = 0, replaceHead = 0, replacements = [], match, nextBracketPos;
+	var whitespaceRegExp = /(\s+)/mg;
+	var operandRegExp = /((?:\+|\-|~|=|\:(\w+)(?:\:([\w\:, ]*))?)?)(?:(\[)|(?:"([^"]*)")|(?:'([^']*)')|([^\s\[\]]+))/mg;
+	while (p < filterString.length) {
+		whitespaceRegExp.lastIndex = p;
+		match = whitespaceRegExp.exec(filterString);
+		if (match && match.index === p) {
+			var end = p + match[0].length;
+			var replacement = method(p, end);
+			if (replacement !== null) {
+				replacements.push(filterString.substring(replaceHead, p));
+				replacements.push(replacement);
+				replaceHead = end;
+			}
+			p = end;
+		}
+		if (p < filterString.length) {
+			operandRegExp.lastIndex = p;
+			match = operandRegExp.exec(filterString);
+			if (!match || match.index !== p) {
+				// Broken filter
+				return filterString;
+			}
+			if (match[1]) {
+				// Skip the named prefix
+				p += match[1].length;
+			}
+			if (match[4]) {
+				// It's a filter operation. Skip by [...]
+				if (filterString.charAt(p++) !== "[") {
+					return filterString;
+				}
+				do {
+					if(filterString.charAt(p) === "!") {
+						filterString.charAt(p++);
+					}
+					// Get the operator name
+					nextBracketPos = filterString.substring(p).search(/[\[\{<\/]/);
+					if(nextBracketPos === -1) {
+						return filterString;
+					}
+					nextBracketPos += p;
+					var bracket = filterString.charAt(nextBracketPos);
+					nextBracketPos = filterString.indexOf(brackets[bracket], p);
+					if (nextBracketPos === -1) {
+						return filterString;
+					}
+					p = nextBracketPos + 1;
+				} while (filterString.charAt(p++) !== "]");
+			} else {
+				p = match.index + match[0].length;
+			}
+		}
+	}
+	if (replacements.length > 0) {
+		replacements.push(filterString.substr(replaceHead));
+		return replacements.join("");
+	}
+	return filterString;
+};

package/plugins/graph/widgets/fieldtranscriber/json.js

@@ -0,0 +1,34 @@
+/*\
+
+Type for transcribing application/json between text and field.
+
+Focuses on keeping dataTiddler style pretty printing for text, but puts all
+json on one line for fields.
+
+\*/
+
+"use strict";
+
+exports.name = "application/json";
+
+exports.toField = function(text) {
+	if (!text) {
+		return "";
+	}
+	try {
+		return JSON.stringify(JSON.parse(text));
+	} catch {
+		return "{}";
+	}
+};
+
+exports.fromField = function(text) {
+	if (!text) {
+		return "";
+	}
+	try {
+		return JSON.stringify(JSON.parse(text), null, $tw.config.preferences.jsonSpaces);
+	} catch {
+		return "{}";
+	}
+};

package/plugins/graph/widgets/fieldtranscriber/plain.js

@@ -0,0 +1,11 @@
+/*\
+
+Type for transcribing text/plain between text and field.
+
+\*/
+
+"use strict";
+
+exports.name = "text/plain";
+
+exports.fromField = exports.toField = function(text) { return text; };