mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2025-09-05 12:28:02 +00:00
Code Issues Releases Wiki Activity

updates

Browse Source
This commit is contained in:
BurningTreeC
2024-09-25 19:42:55 +02:00
parent 433e54b43e
commit c1260971b8
2 changed files with 24 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
core/wiki/macros/sidebar-resizer.tid
View File

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

31
themes/tiddlywiki/vanilla/sidebar-resizer.tid
View File

@@ -74,15 +74,15 @@ code-body: yes
}
.tc-sidebar-resizer-pointerdown-eventcatcher {
z-index: 3;
z-index: 800;
}
.tc-sidebar-resizer-pointermove-eventcatcher {
z-index: 4;
z-index: 801;
}
.tc-sidebar-resizer-pointermove {
z-index: 5;
z-index: 802;
cursor: ew-resize;
}
@@ -92,23 +92,24 @@ code-body: yes
<% endif %>
<%if [[$:/state/sidebar/posx]!is[missing]then{$:/state/sidebar}!match[no]] %>
.tc-sidebar-resizer-pointerdown-eventcatcher {
right: auto;
width: calc(100% + (100vw - 100%));
}
.tc-sidebar-resizer {
right: min(max(calc(({{$:/state/sidebar/posx!!sidebar-percentage}} * 100%)),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px)),calc((100vw - 100%) + (100% - {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}) - 22px));
}
<%if [[$:/state/sidebar/dimensions]!is[missing]then{$:/state/sidebar}!match[no]] %>
.tc-story-river {
width: min(max(calc({{$:/state/sidebar/posx!!story-river-percentage}} * 100%),{{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}),calc(100% - {{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}}));
width: 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}});
}
.tc-sidebar-scrollable {
width: min(max(calc(({{$:/state/sidebar/posx!!sidebar-percentage}} * 100%)),calc({{$:/themes/tiddlywiki/vanilla/metrics/sidebarwidth}} - 22px)),calc((100vw - 100%) + (100% - {{$:/themes/tiddlywiki/vanilla/metrics/storyminwidth}}) - 22px));
width: 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));
}
.tc-sidebar-resizer-pointerdown-eventcatcher {
right: auto;
max-width: 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}}));
min-width: 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}}));
}
.tc-sidebar-resizer {
right: 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));
}
<% endif %>