Why does this mess up navigation? (@BurningTreeC and experts)

[Mat]

@BurningTreeC and other experts

I hope to contribute this thingy to the community soon. As part of it, the whole tiddler needs to have a droppablewidget so things can be dropped onto it. This was easily achieved by modifying  $:/core/ui/ViewTemplate as per here below.

The dropping works well - but it messes up navigation scrolling to it. (Scrolling to edit mode tiddler works)

Why? What can be done to prevent this?

title: $:/core/ui/ViewTemplate

\define frame-classes()
tc-tiddler-frame tc-tiddler-view-frame $(missingTiddlerClass)$ $(shadowTiddlerClass)$ $(systemTiddlerClass)$ $(tiddlerTagClasses)$ block-droparea
\end
\define folded-state()
$:/state/folded/$(currentTiddler)$
\end
<$set name="storyTiddler" value=<<currentTiddler>>><$set name="tiddlerInfoState" value=<<qualify "$:/state/popup/tiddler-info">>><$tiddler tiddler=<<currentTiddler>>><$set name=curr value=<<currentTiddler>> >
<$droppable actions="""<<block-dropactions>>"""><div class=<<frame-classes>>><$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewTemplate]!has[draft.of]]" variable="listItem"><$transclude tiddler=<<listItem>>/></$list>
</div></$droppable></$set>
</$tiddler></$set></$set>

<:-)

[BurningTreeC]

Hi Mat, I can only tell you what I've figured out by trying
Changing something before the <div class=<<frame-classes>>> can cause problem with navigation because (I think) the tc-tiddler-frame must be the first node so that the navigator sees it
The droppable widget creates a tag before the tc-tiddler-frame div and causes trouble

I guess that by moving the droppable widget after the div you can solve this

Another thing I've experienced causing troubles with the navigation is adding <$set> widgets before the div ... I'm not that sure whether it was the set widget or something else, it was just strange

I put all <set> widgets before the div in one line with the div - and that appeared to change something. I was confused but I'm quite sure that that had some impact

BTC

[BurningTreeC]

I even made a note to myself [here](http://tiddlytouch.tiddlyspot.com/#notes)

[BurningTreeC]

another idea is to set a different tag on the droppable widget

<$droppable actions="""<<hellothere>>""" tag="section"><div class=<<frame-classes>>>...

I like the section tag when I try to fool the engine

[Mat]

Yes, you've found basically what I've also found.

I guess that by moving the droppable widget after the div you can solve this

No, I don't get this to work either.

Ok, let's hope someone else can bring clarity.

<:-)

[BurningTreeC]

Now I tried your code because what I wrote above appeared questionable to me

The solution is simple, just put all before the <div class=<<frame-classes>>> in one line with the div

[BurningTreeC]

\define frame-classes()
tc-tiddler-frame tc-tiddler-view-frame $(missingTiddlerClass)$ $(shadowTiddlerClass)$ $(systemTiddlerClass)$ $(tiddlerTagClasses)$ block-droparea
\end
\define folded-state()
$:/state/folded/$(currentTiddler)$
\end
<$set name="storyTiddler" value=<<currentTiddler>>><$set name="tiddlerInfoState" value=<<qualify "$:/state/popup/tiddler-info">>><$tiddler tiddler=<<currentTiddler>>><$set name=curr value=<<currentTiddler>>><$droppable actions="""<<block-dropactions>>"""><div class=<<frame-classes>>><$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewTemplate]!has[draft.of]]" variable="listItem"><$transclude tiddler=<<listItem>>/></$list>
</div></$droppable></$set>
</$tiddler></$set></$set>



if you copy-paste this, it doesn't work?


[BurningTreeC]

WOW !!

Now I've seen your page - that's amazingly good.

I tried removing all new lines before the div on your page and that made navigation work for me

BTC

[Mat]

Yeehaaw! That did work! Thank you BurningTreeC!

WOW !!

Now I've seen your page - that's amazingly good.

Thank you. Yes, I believe it can be something useful. As I mentioned, I think it could be a new paradigm for creating (basic) stuff in TW. IMO we need to lower the threshold for newcomers.

There are a few things needed before it is usable though that I need help with. I was thinking of raising separate threads for this... but I'll take it here since you're the one closest to the whole concept to begin with :-)

So, one thing is that the dropping should also work in edit mode. As you know, dropping a link currently gives the [[title]]. But dropping a TidBit should either give the <<macrocall>> like in view mode or possibly the actual macro content, so that it can be modified. I think default should be to drop the TidBit macrocall and e.g a Ctrl+drop to get the actual TidBit code dropped.

Second, the dropped bits should be "rearrangable" in view-mode like with the list-links-draggable and list-tags-draggable macros... however, if I understand things, neither of those macros are applicable here, nor the draggableWidget. The ideal would be some kind of "wrapper" to put around arbitrary segments in a tiddlers text.

Any ideas? Your help is much appreciated.

<:-)

[BurningTreeC]

So, one thing is that the dropping should also work in edit mode. As you know, dropping a link currently gives the [[title]]. But dropping a TidBit should either give the <<macrocall>> like in view mode or possibly the actual macro content, so that it can be modified. I think default should be to drop the TidBit macrocall and e.g a Ctrl+drop to get the actual TidBit code dropped.

Over at github I've asked quite a bit about how the drag&drop works and the dropping into the text-editor
I'm still figuring out different ways for the dragndrop mod - dragging with modifiers - especially the dropping into the text-editor
The droppable widget already benefits from it in the prerelease - I don't think that it's already at the prerelease page
The modifier keys held while dropping get passed to the action string with the <<modifier>> variable (new with v5.1.16)

I know the [[ ]] get added automatically if the "title" contains spaces
There's no simple filter like removeprefix[[[] because that's invalid tw syntax

My dragndropmod removes the [[ ]] at drag-start - they only get added when dragging with the modifier key that adds them (it's the default for normal dragging without modifier at the page, but it can be assigned to a modifier and the plain text to no modifier)

I'm trying to figure out a way (still on github) to integrate it in the core, with some problems
 

Second, the dropped bits should be "rearrangable" in view-mode like with the list-links-draggable and list-tags-draggable macros... however, if I understand things, neither of those macros are applicable here, nor the draggableWidget. The ideal would be some kind of "wrapper" to put around arbitrary segments in a tiddlers text.

I've actually thought about that looking at your page
Something like this:

1) when you drop something, add an identifier for the dropped tidbit to a field that holds the list of all already dropped tidbits
2) the viewtemplate body should list the tidbits in that field like the list-links-draggable but render the tidbit-content
3) we know the tidbits that are inside a tiddler because of the field(1) where they're listed - maybe the splitbefore and removesuffix/prefix operators allow to split the whole tiddler content at tidbit nr.1 , removesuffix tidbit nr.1 , see if there's something left , call it tiddlybit nr. 1 , then get the whole tiddler content, removeprefix tiddlybit nr. 1, removeprefix tidbit nr. 1, splitbefore tidbit nr.2 , ... until the last tidbit
4) now the tiddler is split into blocks, a draggable something can render them
5) rearranging them would then maybe need to store the tiddlybits somewhere outside - so that after a rearrangement the tidbit list gets updated, then the tidbit contents get applied to the tiddler

I'm just imagining this somehow, I don't know if it's really doable

BTC