1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-11-07 02:53:00 +00:00

Introduce text editor toolbar (#2315)

Tada!
This commit is contained in:
Jeremy Ruston
2016-04-22 08:36:29 +01:00
parent 4dd701c2dd
commit 2adf09129d
234 changed files with 3899 additions and 999 deletions

View File

@@ -3,8 +3,14 @@ tags: $:/tags/EditPreview
list-after: $:/core/ui/EditTemplate/body/preview/output
caption: parse tree
\define preview(mode,output)
<$parse-tree mode="$mode$" output="$output$"/>
\define preview(mode)
<$wikify name="preview-text" text={{!!text}} type={{!!type}} mode="$mode$" output="parsetree">
<pre>
<code>
<$text text=<<preview-text>>/>
</code>
</pre>
</$wikify>
\end
{{||$:/plugins/tiddlywiki/internals/EditTemplate/body/preview/shared}}

View File

@@ -7,7 +7,7 @@ Mode: <$select tiddler="$(tv-mode-configuration)$" default="block">
<option value="block">Block</option>
</$select>
<$macrocall $name="preview" mode={{$(tv-mode-configuration)$}} output={{$(tv-output-configuration)$}}/>
<$macrocall $name="preview" mode={{$(tv-mode-configuration)$}}/>
\end
<div class="tc-internal-tree-preview-wrapper">

View File

@@ -3,8 +3,14 @@ tags: $:/tags/EditPreview
caption: widget tree
list-after: $:/plugins/tiddlywiki/internals/EditTemplate/body/preview/parse-tree
\define preview(mode,output)
<$widget-tree mode="$mode$" output="$output$"/>
\define preview(mode)
<$wikify name="preview-text" text={{!!text}} type={{!!type}} mode="$mode$" output="widgettree">
<pre>
<code>
<$text text=<<preview-text>>/>
</code>
</pre>
</$wikify>
\end
{{||$:/plugins/tiddlywiki/internals/EditTemplate/body/preview/shared}}

View File

@@ -1,75 +0,0 @@
/*\
title: $:/$:/plugins/tiddlywiki/internals/widgets/parse-tree.js
type: application/javascript
module-type: widget
Widget to render the parse tree of a tiddler
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
var Widget = require("$:/core/modules/widgets/widget.js").widget;
var ParseTreeWidget = function(parseTreeNode,options) {
this.initialise(parseTreeNode,options);
};
/*
Inherit from the base widget class
*/
ParseTreeWidget.prototype = new Widget();
/*
Render this widget into the DOM
*/
ParseTreeWidget.prototype.render = function(parent,nextSibling) {
var self = this;
this.parentDomNode = parent;
this.computeAttributes();
this.execute();
this.renderChildren(parent,nextSibling);
};
/*
Compute the internal state of the widget
*/
ParseTreeWidget.prototype.execute = function() {
// Get our parameters
this.parseTreeTitle = this.getAttribute("tiddler",this.getVariable("currentTiddler"));
this.parseTreeInlineMode = this.getAttribute("mode","block") === "inline";
// Compute the parse tree
var parser = this.wiki.parseTiddler(this.parseTreeTitle,{parseAsInline: this.parseTreeInlineMode}),
parseTreeNodes = [];
if(parser) {
parseTreeNodes = [{
type: "codeblock",
attributes: {
code: {type: "string", value: JSON.stringify(parser.tree,0,$tw.config.preferences.jsonSpaces)},
language: {type: "string", value: "json"}
}
}];
}
// Make the child widgets
this.makeChildWidgets(parseTreeNodes);
};
/*
Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
*/
ParseTreeWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
// Completely rerender if any of our attributes have changed
if(changedAttributes.tiddler || changedAttributes.mode || changedTiddlers[this.parseTreeTitle]) {
this.refreshSelf();
return true;
}
return false;
};
exports["parse-tree"] = ParseTreeWidget;
})();

View File

@@ -1,107 +0,0 @@
/*\
title: $:/plugins/tiddlywiki/internals/widgets/widget-tree.js
type: application/javascript
module-type: widget
Widget to render the widget tree of a tiddler
\*/
(function(){
/*jslint node: true, browser: true */
/*global $tw: false */
"use strict";
var Widget = require("$:/core/modules/widgets/widget.js").widget;
var WidgetTreeWidget = function(parseTreeNode,options) {
this.initialise(parseTreeNode,options);
};
/*
Inherit from the base widget class
*/
WidgetTreeWidget.prototype = new Widget();
/*
Render this widget into the DOM
*/
WidgetTreeWidget.prototype.render = function(parent,nextSibling) {
var self = this;
this.parentDomNode = parent;
this.computeAttributes();
this.execute();
this.renderChildren(parent,nextSibling);
};
/*
Compute the internal state of the widget
*/
WidgetTreeWidget.prototype.execute = function() {
// Get our parameters
this.widgetTreeTitle = this.getAttribute("tiddler",this.getVariable("currentTiddler"));
this.widgetTreeInlineMode = this.getAttribute("mode","block") === "inline";
// Compute the widget tree
var parser = this.wiki.parseTiddler(this.widgetTreeTitle,{parseAsInline: this.widgetTreeInlineMode}),
results;
if(parser) {
var widgetNode = this.wiki.makeWidget(parser,{
parentWidget: this
}),
container = $tw.fakeDocument.createElement("div"),
copyNode = function(widgetNode,resultNode) {
var type = widgetNode.parseTreeNode.type;
resultNode.type = type;
switch(type) {
case "element":
resultNode.tag = widgetNode.parseTreeNode.tag;
break;
case "text":
resultNode.text = widgetNode.parseTreeNode.text;
break;
}
if(Object.keys(widgetNode.attributes || {}).length > 0) {
resultNode.attributes = {};
$tw.utils.each(widgetNode.attributes,function(attr,attrName) {
resultNode.attributes[attrName] = widgetNode.getAttribute(attrName);
});
}
if(Object.keys(widgetNode.children || {}).length > 0) {
resultNode.children = [];
$tw.utils.each(widgetNode.children,function(widgetChildNode) {
var node = {};
resultNode.children.push(node);
copyNode(widgetChildNode,node);
});
}
};
widgetNode.render(container,null);
results = {};
copyNode(widgetNode,results);
}
// Make the child widgets
this.makeChildWidgets([{
type: "codeblock",
attributes: {
code: {type: "string", value: (results && results.children) ? JSON.stringify(results.children,0,$tw.config.preferences.jsonSpaces) : ""},
language: {type: "string", value: "json"}
}
}]);
};
/*
Selectively refreshes the widget if needed. Returns true if the widget or any of its children needed re-rendering
*/
WidgetTreeWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
// Completely rerender if any of our attributes have changed
if(changedAttributes.tiddler || changedAttributes.mode || changedTiddlers[this.widgetTreeTitle]) {
this.refreshSelf();
return true;
}
return false;
};
exports["widget-tree"] = WidgetTreeWidget;
})();