From 530500ec684d252bbfbce05d360cc52be03a213e Mon Sep 17 00:00:00 2001 From: BurningTreeC Date: Wed, 30 Oct 2024 07:02:20 +0100 Subject: [PATCH] add one-cell-slider procedure and use it for editor and preview --- core/ui/EditTemplate/body-editor.tid | 2 +- core/ui/EditTemplate/body/default.tid | 39 ++++++++++----- core/wiki/macros/sidebar-resizer.tid | 9 ++-- core/wiki/macros/sliders.tid | 50 +++++++++++++++++++ themes/tiddlywiki/vanilla/base.tid | 1 + themes/tiddlywiki/vanilla/sidebar-resizer.tid | 20 +++++++- 6 files changed, 103 insertions(+), 18 deletions(-) diff --git a/core/ui/EditTemplate/body-editor.tid b/core/ui/EditTemplate/body-editor.tid index 374567acd..ae3e7ffc7 100644 --- a/core/ui/EditTemplate/body-editor.tid +++ b/core/ui/EditTemplate/body-editor.tid @@ -5,7 +5,7 @@ title: $:/core/ui/EditTemplate/body/editor <$edit field="text" - class="tc-edit-texteditor tc-edit-texteditor-body" + class=<> placeholder={{$:/language/EditTemplate/Body/Placeholder}} tabindex={{$:/config/EditTabIndex}} focus={{{ [{$:/config/AutoFocus}match[text]then[true]] ~[[false]] }}} diff --git a/core/ui/EditTemplate/body/default.tid b/core/ui/EditTemplate/body/default.tid index d004032f1..e4cfd737e 100644 --- a/core/ui/EditTemplate/body/default.tid +++ b/core/ui/EditTemplate/body/default.tid @@ -4,6 +4,8 @@ title: $:/core/ui/EditTemplate/body/default [{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[] +[get[text]] :else[[no]] \end +\function get.tc-edit-texteditor.class() tc-edit-texteditor tc-edit-texteditor-body [addprefix[tc-edit-texteditor-]] +[join[ ]] + \define config-visibility-title() $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$ \end @@ -12,18 +14,7 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$ <$action-popup $state=<> $coords="(0,0,0,0)" $floating="yes"/> \end -\whitespace trim -<$let - qualified-preview-state=<> - editPreviewStateTiddler={{{ [{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[] }}} - importTitle=<> - importState=<> > -<$dropzone importTitle=<> autoOpenOnImport="no" contentTypesFilter={{$:/config/Editor/ImportContentTypesFilter}} class="tc-dropzone-editor" enable={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}} filesOnly="yes" actions=<> > -
-
match[yes]then[tc-tiddler-preview]else[tc-tiddler-preview-hidden]] [[tc-tiddler-editor]] +[join[ ]] }}}> - -<$transclude tiddler="$:/core/ui/EditTemplate/body/editor" mode="inline"/> - +\procedure tp-tiddler-preview() <$list filter="[get[text]match[yes]]" variable="ignore">
@@ -37,6 +28,30 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
+\end + +\whitespace trim +<$let + qualified-preview-state=<> + editPreviewStateTiddler={{{ [{$:/config/ShowEditPreview/PerTiddler}!match[yes]then[$:/state/showeditpreview]] :else[] }}} + importTitle=<> + importState=<> > +<$dropzone importTitle=<> autoOpenOnImport="no" contentTypesFilter={{$:/config/Editor/ImportContentTypesFilter}} class="tc-dropzone-editor" enable={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}} filesOnly="yes" actions=<> > +
+
match[yes]then[tc-tiddler-preview]else[tc-tiddler-preview-hidden]] [[tc-tiddler-editor]] +[join[ ]] }}}> + +<$let identifier={{{ [addsuffix[-]addsuffixsha256[]] }}} sidebarWidthTiddler={{{ [addprefix[$:/state/resizer/texteditorwidth-]] }}}> + +<$transclude tiddler="$:/core/ui/EditTemplate/body/editor" mode="inline"/> + +<$transclude + $variable="one-cell-slider" + template="tp-tiddler-preview" + mode="inline" + padding="0px" +/> + +
diff --git a/core/wiki/macros/sidebar-resizer.tid b/core/wiki/macros/sidebar-resizer.tid index b58a2be8c..d2ea9e7af 100644 --- a/core/wiki/macros/sidebar-resizer.tid +++ b/core/wiki/macros/sidebar-resizer.tid @@ -289,7 +289,7 @@ title: $:/core/procedures/sidebar-resizer \function get.resizer.class() tc-sidebar-resizer [!is[missing]then[tc-resizer-active]] [] [addsuffix[-]addsuffixsha256[]addprefix[tc-sidebar-resizer-]] +[join[ ]] -\function get.active.class(class) [] [] [!is[missing]then[tc-resizer-active]] +[join[ ]] +\function get.active.class(class) [] [] [] [!is[missing]then[tc-resizer-active]] +[join[ ]] \function get.sidebar-resizer.pointerdown.actions() [match[$:/state/sidebar/resizing]then] @@ -302,7 +302,7 @@ title: $:/core/procedures/sidebar-resizer \function get.template-right.style.flex-basis() [match[no]then[0%]] :else[[calc(]addsuffixaddsuffix[ - ]addsuffixaddsuffix[px)]] -\procedure sidebar-resizer(templateLeft:"",templateRight:"",mode:"block",sliderCondition:"yes") +\procedure sidebar-resizer(templateLeft:"",templateRight:"",mode:"block",sliderCondition:"yes",eventCatcherClass:"",zIndexLeft:"") <$set name="resizerWidthDivided" value={{{ [divide[2]] }}}> <$eventcatcher @@ -340,7 +340,7 @@ title: $:/core/procedures/sidebar-resizer - <%if [!is[blank]] %> + <%if [is[variable]] [is[tiddler]] %>
> + style.z-index=<> > <%if [is[variable]] %> @@ -376,7 +377,7 @@ title: $:/core/procedures/sidebar-resizer <% endif %> - <%if [!is[blank]then!match[no]] %> + <%if [is[variable]then!match[no]] [is[tiddler]then!match[no]] %>
get[text]] :else[[50%]] +\function get.resizer.style.left() [[calc(100% - ]addsuffixaddsuffix[)]] +\function get.resizer.style.width() [] +\function set.throttling() no +\function get.template.left() +\whitespace trim + +
> + style.min-height=<> + style.display="flex" + style.flex-direction="column" + style.padding-left=<> + style.padding-right=<> + style.padding-top=<> + style.padding-bottom=<> +> + + <$let + tv-set-storywidth-storyright="no" + tv-set-sidebarwidth="yes" + tv-set-centralised="no" + storyLeftTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storyleft-]] }}} + storyRightTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storyright-]] }}} + sidebarWidthTiddler={{{ [!is[blank]] :else[addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/rightwidth-]] }}} + tiddlerWidthTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/tiddlerwidth-]] }}} + storyWidthTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storywidth-]] }}} + storyMinWidthTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storywidth-]] }}} + sidebarMinWidthTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storyminwidth-]] }}} + storyPaddingLeftTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storypaddingleft-]] }}} + storyPaddingRightTiddler={{{ [addsuffix[-]addsuffixsha256[]addprefix[$:/state/resizer/storypaddingright-]] }}}> + + <$transclude + $variable="sidebar-resizer" + templateLeft="get.template.left" + templateRight=<