1
0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-04-08 19:56:39 +00:00
This commit is contained in:
BurningTreeC 2024-09-26 07:23:38 +02:00
parent 563b1a0254
commit 8d76623643
2 changed files with 11 additions and 7 deletions

View File

@ -3,7 +3,7 @@ tags: $:/tags/Global
\procedure sidebar-resizer-pointerdown-actions()
<%if [[$:/state/sidebar/resizing]is[missing]then<event-mousebutton>match[left]] %>
<$let leftOffset={{{ [<event-fromviewport-posx>subtract<event-fromcatcher-posx>] }}} viewportWidth={{{ [<leftOffset>add<tv-widgetnode-width>] }}} dragDiff=<<event-fromselected-posx>> leftOffsetPercentage={{{ [<leftOffset>divide<viewportWidth>] }}} dragDiffPercentage={{{ [<dragDiff>divide<viewportWidth>] }}} dragWidthPercentage={{{ [<tv-selectednode-width>divide<viewportWidth>] }}} sidebarOffsetPercentage={{{ [[22]divide<viewportWidth>] }}} storyRiverPercentage={{{ [<event-fromcatcher-posx>divide<viewportWidth>subtract<dragDiffPercentage>] }}} sidebarPercentage={{{ [[1]subtract<storyRiverPercentage>subtract<sidebarOffsetPercentage>subtract<leftOffsetPercentage>] }}} widgetNodeWidthPercentage={{{ [<tv-widgetnode-width>divide<viewportWidth>] }}}>
<$let leftOffset={{{ [<event-fromviewport-posx>subtract<event-fromcatcher-posx>] }}} viewportWidth={{{ [<leftOffset>add<tv-widgetnode-width>] }}} dragDiff=<<event-fromselected-posx>> leftOffsetPercentage={{{ [<leftOffset>divide<viewportWidth>] }}} dragDiffPercentage={{{ [<dragDiff>divide<viewportWidth>] }}} dragWidthPercentage={{{ [<tv-selectednode-width>divide<viewportWidth>] }}} sidebarOffsetPercentage={{{ [[22]divide<viewportWidth>] }}} storyRiverPercentage={{{ [<event-fromcatcher-posx>divide<viewportWidth>subtract<dragDiffPercentage>subtract<leftOffsetPercentage>] }}} sidebarPercentage={{{ [[1]subtract<storyRiverPercentage>subtract<sidebarOffsetPercentage>] }}} widgetNodeWidthPercentage={{{ [<tv-widgetnode-width>divide<viewportWidth>] }}}>
<$action-setfield $tiddler="$:/state/sidebar/dimensions"
left-offset=<<leftOffset>>
widget-node-width=<<tv-widgetnode-width>>
@ -22,7 +22,7 @@ tags: $:/tags/Global
\end
\procedure sidebar-resizer-pointermove-actions()
<%if [[$:/state/sidebar/resizing]!is[missing]] %>
<$let leftOffset={{$:/state/sidebar/dimensions!!left-offset}} viewportWidth={{{ [<leftOffset>add<tv-widgetnode-width>] }}} leftOffsetPercentage={{{ [<leftOffset>divide<viewportWidth>] }}} storyRiverPercentage={{{ [<event-fromcatcher-posx>divide<viewportWidth>subtract{$:/state/sidebar/dimensions!!drag-diff-percentage}] }}} sidebarPercentage={{{ [[1]subtract<storyRiverPercentage>subtract{$:/state/sidebar/dimensions!!sidebar-offset-percentage}subtract<leftOffsetPercentage>] }}}>
<$let leftOffset={{$:/state/sidebar/dimensions!!left-offset}} viewportWidth={{{ [<leftOffset>add<tv-widgetnode-width>] }}} leftOffsetPercentage={{{ [<leftOffset>divide<viewportWidth>] }}} storyRiverPercentage={{{ [<event-fromcatcher-posx>divide<viewportWidth>subtract{$:/state/sidebar/dimensions!!drag-diff-percentage}subtract<leftOffsetPercentage>] }}} sidebarPercentage={{{ [[1]subtract<storyRiverPercentage>subtract{$:/state/sidebar/dimensions!!sidebar-offset-percentage}] }}}>
<$action-setfield $tiddler="$:/state/sidebar/dimensions"
story-river-percentage=<<storyRiverPercentage>>
sidebar-percentage=<<sidebarPercentage>>/>

View File

@ -147,21 +147,25 @@ code-body: yes
<% endif %>
.tc-story-river {
width: min(max(min(calc(({{$:/state/sidebar/dimensions!!story-river-percentage}} * 100vw) - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc((100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),{{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}});
width: min(max(min(max(min(calc(({{$:/state/sidebar/dimensions!!story-river-percentage}} * 100vw) - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}) - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!story-river-percentage}})),calc((100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!story-river-percentage}}))),calc({{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!story-river-percentage}}))),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!story-river-percentage}})),{{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}),calc((100vw - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}));
width: calc(({{$:/state/sidebar/dimensions!!story-river-percentage}} * 100vw) - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * ({{$:/state/sidebar/dimensions!!story-river-percentage}})) - {{{ [{$:/state/sidebar/dimensions!!left-offset}compare:number:lt{$:/themes/tiddlywiki/vanilla/metrics/storyleft}then{$:/themes/tiddlywiki/vanilla/metrics/storyleft}] ~0px }}});
}
.tc-sidebar-scrollable {
width: max(min(max(calc({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px)),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} - 22px)),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px));
width: max(max(min(max(calc({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!sidebar-percentage}})),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!sidebar-percentage}}))),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} - 22px - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!sidebar-percentage}}))),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!sidebar-percentage}}))),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px));
width: calc(({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!story-river-percentage}}));
width: calc(({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * ({{$:/state/sidebar/dimensions!!story-river-percentage}} + {{$:/state/sidebar/dimensions!!sidebar-offset-percentage}})) - {{{ [{$:/state/sidebar/dimensions!!left-offset}compare:number:lt{$:/themes/tiddlywiki/vanilla/metrics/storyleft}then{$:/themes/tiddlywiki/vanilla/metrics/storyleft}] ~0px }}});
}
.tc-sidebar-resizer-pointerdown-eventcatcher {
right: auto;
max-width: min(max(min(calc((100% + ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + 22px) - (100vw - 100% - 22px - ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw))),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),100vw);
min-width: min(max(min(calc((100% + ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + 22px) - (100vw - 100% - 22px - ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw))),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),100vw);
max-width: min(max(min(calc((100% + ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + 22px) - (100vw - 100% - 22px - ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw))),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}));
min-width: min(max(min(calc((100% + ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + 22px) - (100vw - 100% - 22px - ({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw))),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}})),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}));
}
.tc-sidebar-resizer {
right: max(min(max(calc({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px)),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} - 22px)),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px));
right: max(min(max(calc({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!sidebar-percentage}})),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px)),calc(100vw - {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}} - ({{$:/state/sidebar/dimensions!!widget-node-width}}px - 100vw + {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}}) - ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * {{$:/state/sidebar/dimensions!!sidebar-percentage}}) - {{$:/themes/tiddlywiki/vanilla/metrics/storyleft}} - 22px)),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px));
right: calc(({{$:/state/sidebar/dimensions!!sidebar-percentage}} * 100vw) + ((100vw - {{$:/state/sidebar/dimensions!!widget-node-width}}px) * ({{$:/state/sidebar/dimensions!!story-river-percentage}} + {{$:/state/sidebar/dimensions!!sidebar-offset-percentage}})) - {{{ [{$:/state/sidebar/dimensions!!left-offset}compare:number:lt{$:/themes/tiddlywiki/vanilla/metrics/storyleft}then{$:/themes/tiddlywiki/vanilla/metrics/storyleft}] ~0px }}});
}
<% endif %>