diff --git a/core/language/en-GB/Misc.multids b/core/language/en-GB/Misc.multids
index d8c091375..eb295000c 100644
--- a/core/language/en-GB/Misc.multids
+++ b/core/language/en-GB/Misc.multids
@@ -47,6 +47,7 @@ InternalJavaScriptError/Title: Internal JavaScript Error
InternalJavaScriptError/Hint: Well, this is embarrassing. It is recommended that you restart TiddlyWiki by refreshing your browser
LayoutSwitcher/Description: Open the layout switcher
LazyLoadingWarning:
Trying to load external content from ''<$text text={{!!_canonical_uri}}/>''
If this message doesn't disappear, either the tiddler content type doesn't match the type of the external content, or you may be using a browser that doesn't support external content for wikis loaded as standalone files. See https://tiddlywiki.com/#ExternalText
+Left: Left
LoginToTiddlySpace: Login to TiddlySpace
Manager/Controls/FilterByTag/None: (none)
Manager/Controls/FilterByTag/Prompt: Filter by tag:
@@ -73,6 +74,7 @@ PageTemplate/Description: the default ~TiddlyWiki layout
PageTemplate/Name: Standard Layout
PluginReloadWarning: Please save {{$:/core/ui/Buttons/save-wiki}} and reload {{$:/core/ui/Buttons/refresh}} to allow changes to ~JavaScript plugins to take effect
RecentChanges/DateFormat: DDth MMM YYYY
+Right: Right
Shortcuts/Input/AdvancedSearch/Hint: Open the ~AdvancedSearch panel from within the sidebar search field
Shortcuts/Input/Accept/Hint: Accept the selected item
Shortcuts/Input/AcceptVariant/Hint: Accept the selected item (variant)
diff --git a/core/language/en-GB/ThemeTweaks.multids b/core/language/en-GB/ThemeTweaks.multids
index 5168053c3..afe051020 100644
--- a/core/language/en-GB/ThemeTweaks.multids
+++ b/core/language/en-GB/ThemeTweaks.multids
@@ -1,11 +1,13 @@
title: $:/language/ThemeTweaks/
ThemeTweaks: Theme Tweaks
-ThemeTweaks/Hint: You can tweak certain aspects of the ''Vanilla'' theme.
+ThemeTweaks/Hint: You can tweak certain aspects of the ''<$text text={{{ [get[name]] :else[[current]] }}}/>'' theme.
Options: Options
Options/SidebarLayout: Sidebar layout
Options/SidebarLayout/Fixed-Fluid: Fixed story, fluid sidebar
Options/SidebarLayout/Fluid-Fixed: Fluid story, fixed sidebar
+Options/SidebarPosition: Sidebar position
+Options/SidebarResizer: Sidebar resizer
Options/StickyTitles: Sticky titles
Options/StickyTitles/Hint: Causes tiddler titles to "stick" to the top of the browser window
Options/CodeWrapping: Wrap long lines in code blocks
@@ -26,17 +28,34 @@ Metrics/FontSize: Font size
Metrics/LineHeight: Line height
Metrics/BodyFontSize: Font size for tiddler body
Metrics/BodyLineHeight: Line height for tiddler body
+Metrics/PreviewSliderWidth: Preview slider width
+Metrics/PreviewSliderWidth/Hint: the width of the slider between editor and editor preview
+Metrics/SidebarPadding: Sidebar padding
+Metrics/SidebarPadding/Hint: the padding of the sidebar between sidebar and story river
+Metrics/SidebarResizer/Hint: the values for `storyleft`, `storyright`, `storywidth`, `storyminwidth`, `sidebarwidth` and `sidebarminwidth` need to be ''absolute'' CSS units, ''percentages'' or ''em'' units in order for the sidebar resizer to work
+Metrics/SliderOpacity: Slider opacity
+Metrics/SliderOpacity/Hint: the opacity of the sliders
+Metrics/SliderOpacityHover: Slider opacity hover
+Metrics/SliderOpacityHover/Hint: the opacity on hover of the sliders
Metrics/StoryLeft: Story left position
Metrics/StoryLeft/Hint: how far the left margin of the story river (tiddler area) is from the left of the page
+Metrics/StoryMinWidth: Minimum Story width
+Metrics/StoryMinWidth/Hint: controls the minimum width of the tiddlers in the story river
+Metrics/StoryPaddingLeft: Story Padding Left
+Metrics/StoryPaddingLeft/Hint: the left padding of the story river
+Metrics/StoryPaddingRight: Story Padding Right
+Metrics/StoryPaddingRight/Hint: the right padding of the story river
Metrics/StoryTop: Story top position
Metrics/StoryTop/Hint: how far the top margin of the story river is from the top of the page
Metrics/StoryRight: Story right
Metrics/StoryRight/Hint: how far the left margin of the sidebar is from the left of the page
Metrics/StoryWidth: Story width
Metrics/StoryWidth/Hint: the overall width of the story river
-Metrics/TiddlerWidth: Tiddler width
-Metrics/TiddlerWidth/Hint: within the story river
Metrics/SidebarBreakpoint: Sidebar breakpoint
Metrics/SidebarBreakpoint/Hint: the minimum page width at which the story river and sidebar will appear side by side
+Metrics/SidebarMinWidth: Minimum Sidebar width
+Metrics/SidebarMinWidth/Hint: the minimum width of the sidebar
Metrics/SidebarWidth: Sidebar width
Metrics/SidebarWidth/Hint: the width of the sidebar in fluid-fixed layout
+Metrics/TiddlerWidth: Tiddler width
+Metrics/TiddlerWidth/Hint: within the story river
diff --git a/core/modules/editor/engines/framed.js b/core/modules/editor/engines/framed.js
index 9b1c8cd81..315ae8080 100644
--- a/core/modules/editor/engines/framed.js
+++ b/core/modules/editor/engines/framed.js
@@ -103,6 +103,10 @@ function FramedEngine(options) {
this.iframeDoc.body.appendChild(this.domNode);
}
+FramedEngine.prototype.assignDomNodeClasses = function() {
+ this.iframeNode.className = this.widget.getAttribute("class","");
+};
+
/*
Copy styles from the dummy text area to the textarea in the iframe
*/
diff --git a/core/modules/editor/engines/simple.js b/core/modules/editor/engines/simple.js
index 93f021522..9b36736a6 100644
--- a/core/modules/editor/engines/simple.js
+++ b/core/modules/editor/engines/simple.js
@@ -65,6 +65,10 @@ function SimpleEngine(options) {
this.widget.domNodes.push(this.domNode);
}
+SimpleEngine.prototype.assignDomNodeClasses = function() {
+ this.domNode.className = this.widget.getAttribute("class","");
+};
+
/*
Set the text of the engine if it doesn't currently have focus
*/
diff --git a/core/modules/editor/factory.js b/core/modules/editor/factory.js
index 984cc76ba..a847950ab 100644
--- a/core/modules/editor/factory.js
+++ b/core/modules/editor/factory.js
@@ -217,7 +217,7 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
EditTextWidget.prototype.refresh = function(changedTiddlers) {
var changedAttributes = this.computeAttributes();
// Completely rerender if any of our attributes have changed
- if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes["default"] || changedAttributes["class"] || changedAttributes.placeholder || changedAttributes.size || changedAttributes.autoHeight || changedAttributes.minHeight || changedAttributes.focusPopup || changedAttributes.rows || changedAttributes.tabindex || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || changedTiddlers[HEIGHT_MODE_TITLE] || changedTiddlers[ENABLE_TOOLBAR_TITLE] || changedTiddlers["$:/palette"] || changedAttributes.disabled || changedAttributes.fileDrop) {
+ if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes["default"] || (changedAttributes["class"] && !this.engine.assignDomNodeClasses) || changedAttributes.placeholder || changedAttributes.size || changedAttributes.autoHeight || changedAttributes.minHeight || changedAttributes.focusPopup || changedAttributes.rows || changedAttributes.tabindex || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || changedTiddlers[HEIGHT_MODE_TITLE] || changedTiddlers[ENABLE_TOOLBAR_TITLE] || changedTiddlers["$:/palette"] || changedAttributes.disabled || changedAttributes.fileDrop) {
this.refreshSelf();
return true;
} else if (changedTiddlers[this.editRefreshTitle]) {
@@ -226,6 +226,9 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
var editInfo = this.getEditInfo();
this.updateEditor(editInfo.value,editInfo.type);
}
+ if(changedAttributes["class"] && this.engine.assignDomNodeClasses) {
+ this.engine.assignDomNodeClasses();
+ }
this.engine.fixHeight();
if(this.editShowToolbar) {
return this.refreshChildren(changedTiddlers);
diff --git a/core/modules/widgets/edit-bitmap.js b/core/modules/widgets/edit-bitmap.js
index 3065384b3..bcd57be1e 100644
--- a/core/modules/widgets/edit-bitmap.js
+++ b/core/modules/widgets/edit-bitmap.js
@@ -51,10 +51,14 @@ EditBitmapWidget.prototype.render = function(parent,nextSibling) {
this.toolbarNode.className = "tc-editor-toolbar";
parent.insertBefore(this.toolbarNode,nextSibling);
this.domNodes.push(this.toolbarNode);
+ var classes = this.getAttribute("class","").split(" ");
+ if(classes.indexOf("tc-edit-bitmapeditor") === -1) {
+ classes.push("tc-edit-bitmapeditor");
+ }
// Create the on-screen canvas
this.canvasDomNode = $tw.utils.domMaker("canvas",{
document: this.document,
- "class":"tc-edit-bitmapeditor",
+ "class": classes.join(" "),
eventListeners: [{
name: "touchstart", handlerObject: this, handlerMethod: "handleTouchStartEvent"
},{
@@ -87,6 +91,14 @@ EditBitmapWidget.prototype.render = function(parent,nextSibling) {
]);
};
+EditBitmapWidget.prototype.assignDomNodeClasses = function() {
+ var classes = this.getAttribute("class","").split(" ");
+ if(classes.indexOf("tc-edit-bitmapeditor") === -1) {
+ classes.push("tc-edit-bitmapeditor");
+ }
+ this.canvasDomNode.className = classes.join(" ");
+};
+
/*
Handle an edit bitmap operation message from the toolbar
*/
@@ -112,6 +124,10 @@ EditBitmapWidget.prototype.execute = function() {
Just refresh the toolbar
*/
EditBitmapWidget.prototype.refresh = function(changedTiddlers) {
+ var changedAttributes = this.computeAttributes();
+ if(changedAttributes["class"]) {
+ this.assignDomNodeClasses();
+ }
return this.refreshChildren(changedTiddlers);
};
diff --git a/core/ui/EditTemplate/body-editor.tid b/core/ui/EditTemplate/body-editor.tid
index 374567acd..9f067a665 100644
--- a/core/ui/EditTemplate/body-editor.tid
+++ b/core/ui/EditTemplate/body-editor.tid
@@ -4,38 +4,38 @@ title: $:/core/ui/EditTemplate/body/editor
<$edit
- field="text"
- class="tc-edit-texteditor tc-edit-texteditor-body"
- placeholder={{$:/language/EditTemplate/Body/Placeholder}}
- tabindex={{$:/config/EditTabIndex}}
- focus={{{ [{$:/config/AutoFocus}match[text]then[true]] ~[[false]] }}}
- cancelPopups="yes"
- fileDrop={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}}
+ field="text"
+ class=<>
+ placeholder={{$:/language/EditTemplate/Body/Placeholder}}
+ tabindex={{$:/config/EditTabIndex}}
+ focus={{{ [{$:/config/AutoFocus}match[text]then[true]] ~[[false]] }}}
+ cancelPopups="yes"
+ fileDrop={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}}
><$set
- name="targetTiddler"
- value=<>
+ name="targetTiddler"
+ value=<>
><$list
- filter="[all[shadows+tiddlers]tag[$:/tags/EditorToolbar]!has[draft.of]]"
+ filter="[all[shadows+tiddlers]tag[$:/tags/EditorToolbar]!has[draft.of]]"
><$reveal
- type="nomatch"
- state=<>
- text="hide"
- class="tc-text-editor-toolbar-item-wrapper"
+ type="nomatch"
+ state=<>
+ text="hide"
+ class="tc-text-editor-toolbar-item-wrapper"
><$transclude
- tiddler="$:/core/ui/EditTemplate/body/toolbar/button"
- mode="inline"
+ tiddler="$:/core/ui/EditTemplate/body/toolbar/button"
+ mode="inline"
/>$reveal>$list><$list
- filter="[all[shadows+tiddlers]tag[$:/tags/EditorTools]!has[draft.of]]"
+ filter="[all[shadows+tiddlers]tag[$:/tags/EditorTools]!has[draft.of]]"
><$list
filter={{!!condition}}
diff --git a/core/ui/EditTemplate/body/default.tid b/core/ui/EditTemplate/body/default.tid
index d004032f1..a3a81cea0 100644
--- a/core/ui/EditTemplate/body/default.tid
+++ b/core/ui/EditTemplate/body/default.tid
@@ -1,9 +1,28 @@
title: $:/core/ui/EditTemplate/body/default
-\function edit-preview-state()
+\import $:/core/procedures/sliders
+
+\function get.edit-preview-state()
[{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[] +[get[text]] :else[[no]]
\end
+\function get.tc-editor.class()
+[{!!type}is[blank]then[tc-edit-texteditor tc-edit-texteditor-body]]
+[{!!type}is[blank]thenmatch[yes]thenaddprefix[tc-edit-texteditor-identified-]]
+[{!!type}addprefix[$:/config/EditorTypeMappings/]get[text]!match[bitmap]then[tc-edit-texteditor tc-edit-texteditor-body]]
+[{!!type}addprefix[$:/config/EditorTypeMappings/]get[text]!match[bitmap]thenmatch[yes]thenaddprefix[tc-edit-texteditor-identified-]]
+[{!!type}addprefix[$:/config/EditorTypeMappings/]get[text]match[bitmap]then[tc-edit-bitmapeditor tc-edit-bitmapeditor-body]]
+[{!!type}addprefix[$:/config/EditorTypeMappings/]get[text]match[bitmap]thenmatch[yes]thenaddprefix[tc-edit-bitmapeditor-identified-]] +[join[ ]]
+\end
+
+\function get.tc-tiddler-preview-preview.class() tc-tiddler-preview-preview [addprefix[tc-tiddler-preview-preview-identified-]] +[join[ ]]
+
+\function get.slider.condition() [match[yes]] :else[[no]]
+
+\function resizer.state.tiddler() [[$:/state/resizing/editor-preview-]addsuffix]
+
+\function resizer.class() [[tc-editor-preview-slider-]addsuffix]
+
\define config-visibility-title()
$:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
\end
@@ -12,36 +31,55 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
<$action-popup $state=<> $coords="(0,0,0,0)" $floating="yes"/>
\end
+\procedure tp-tiddler-editor-preview()
+