Drag field content

273 views
Skip to first unread message

TonyM

unread,
Jul 3, 2018, 11:35:42 PM7/3/18
to TiddlyWiki
Folks,

I am building a button to allow the dragging of values from a fields values in a tiddler.

Looking through all the draggable widgets and use on buttons etc... I can only see reference to tiddlers, not parts there of.

Can any one tell me how to specify a fields content as the payload or tell me a direction I could take.
  • A tool or code example exists?
  • Clone and rework an existing widget?
  • Use CSS/Html?
I will also be looking to find a way to drop field contents on a field where it erases the existing content to.

I will be turning this into a reusable solution I will share.

Thanks in advance

Mark S.

unread,
Jul 4, 2018, 1:23:25 AM7/4/18
to TiddlyWiki
I think I see how this could work.

In the draggable widget, use a corresponding (probably system tiddler) to hold the value. Use the startactions attribute to assign the field.

<$draggable tiddler="$:/field1" startaction=<<macro that copies field1 into $:/field1!!value>>{{!!field1}}</$draggable>

Then in the droppable widget, use the actions attribute to grab the value from $(actionTiddler)$!!value and save it to the field corresponding to the dropzone.

If you just want one dropzone that handles multiple fields, then you could have the draggable widget also store the field name in a fieldname field and then the droppable can also fetch the destination from $(actionTiddler)$!!fieldname.

Once you have the draggable macro working, then you can make as many field/zones as you want with <<dragfield field1>>, <<dragfield field2>> etc.

Good luck!
-- Mark

TonyM

unread,
Jul 4, 2018, 9:49:49 PM7/4/18
to TiddlyWiki
Mark,

Thanks for this suggestion. The irony is I want to build this "feature" to allow reordering through dragging values in a field, as part of a tool, that allows you to edit-fields in the tiddler view mode, which itself demands this edit-fields from another tiddler approach.

I am yet to develop a systematic way to do this, and until I do it seems hard to get my head around it. 

This is in fact the motivation for this edit-fields tools solution, because I am sick of having to wrap my head around bespoke solutions to edit-fields in the current tiddler, which for many is the most likely place they want to edit-fields. 

This is a gap in TiddlyWiki at the moment I raised a GitHub issue

I also created a collaborative document in Yammer 

Regards
TOny

Mark S.

unread,
Jul 5, 2018, 1:08:30 AM7/5/18
to TiddlyWiki
Hi Tony,

Here's a first pass at your original request. Make a global macro:

\define dragoncopy(copyfield)
<$action-setfield $tiddler="$:/fields/$(currentTiddler)$" fieldname="""$copyfield$""" fieldvalue={{!!$copyfield$}}/>
\end
\define dragonfield(field)
<$draggable tiddler="$:/fields/$(currentTiddler)$" startactions=<<dragoncopy "$field$">>>{{!!$field$}}</$draggable>
\end
\define dragondrop3(tid,fieldname)
<$action-setfield $field="$fieldname$" $value={{$tid$!!fieldvalue}}/>
\end
\define dragondrop2(tid)
<$macrocall $name=dragondrop3 tid="$tid$" fieldname={{$tid$!!fieldname}}/>
\end
\define dragondrop()
<$macrocall $name="dragondrop2" tid=<<actionTiddler>>/>
\end
\define dragonzone(label)
<$droppable actions=<<dragondrop>>>$label$</
$droppable>
\end

Invoke the drag object like this:

<<dragonfield "field1">>

and in another tiddler put the drop zone like this:

<<dragonzone "Drop Here!">>

Have fun
-- Mark

TonyM

unread,
Jul 5, 2018, 2:10:53 AM7/5/18
to TiddlyWiki
Mark,

Brilliant, that works as desired to drag and drop field contents to and from tiddler, as requested.  I am yet to understand how you have done it.

I love the macros naming dragon

Finally I would like to be able drag and drop the order of items in a list field in the current tiddler.

eg the field list or otherfieldname: one two three

Showing as one two three
and/Or
 one
 two
 three


Where I can drag three to the first position three one two and update the field-name.

It is the same question from another viewpoint using drag and drop on a fieldname. Once I can digest your solution I may be able to do this myself, but if you know any tricks please let me know.

Thanks so much for your assistance, its invaluable.

Regards
Tony

TonyM

unread,
Jul 5, 2018, 3:03:29 AM7/5/18
to TiddlyWiki
Mark,

I have posted up a copy of my Edit-Fields development wiki (as at now) if you are interested. I am yet to finish incorporating the macros you shared.

have a look if you have the opportunity


I intend to set the dragonfield to the 4 arrows icon, and the droplet icon to drop values on a field (and replace contents), and somewhere else to drop on a tiddler.
I expect the drogonfield (content) can also be dropped in an edit-field or Edit tiddler window.

Regards
Tony

JD

unread,
Jul 7, 2018, 8:16:02 AM7/7/18
to TiddlyWiki
Wow this is amazing and very useful! You should create a demo site for this so it could be listed to the semi-official DynaList ! 

Or maybe that can also just link to your post as a permalink?

@TiddlyTweeter

unread,
Jul 7, 2018, 8:49:44 AM7/7/18
to TiddlyWiki
To get good sustained attention a permalink listed in David Gifford's TiddlyToolmap DynaList is the best bet.

Mark S.

unread,
Jul 7, 2018, 3:23:02 PM7/7/18
to TiddlyWiki
Well, this seemed to work out of the box, even on the current tiddler:

<$macrocall $name="list-links-draggable" tiddler=<<currentTiddler>> />

So maybe the edit rules don't matter when using this macro.

-- Mark

TonyM

unread,
Jul 7, 2018, 9:46:23 PM7/7/18
to TiddlyWiki
JD, 

Are you talking about Marks dragon or the edit-fields or both?

The edit-fields is working for me, but I know to make it east to adopt by others it needs a professional layer of documentation (Mohammads Reveal Gradually Macro sets a high standard).

The edit fields allows you define field types, then fields and how to edit them such as dates etc... thus it is a tad more complex to document effectively, just as my previous "initial release" plugin MyMenus was. 

To me it is essential we can can add fields from a list of possible fields to the edit-fields-list and then change the order, when editing fields, this is what I need to complete before it deserves listing.

Regards
Tony

JD

unread,
Jul 8, 2018, 12:19:27 AM7/8/18
to TiddlyWiki
Ooh, I am definitely talking about both. 

I've implemented a rather barebones way of editing select fields of a tiddler in view mode, in a wiki I use with other people in my work group. The reason for needing such implementation being that someone in my group doesn't want to interact with any other field other than the Text field, and work-related ones. 

I'm looking forward to testing your plugin, and seeing how it could be applied to that specific work wiki :D

TonyM

unread,
Jul 8, 2018, 1:19:53 AM7/8/18
to TiddlyWiki
JD,

I have also being working on a sophisticated "tiddler Viewer" like TWOutlier https://groups.google.com/forum/?hl=en#!msg/tiddlywiki/ol_3zvGPbk8/EdIG3awlBAAJ;context-place=forum/tiddlywiki but with advanced handling of tiddlers in a TOC structure, this may be a good way to present tiddlers that the key use is to edit their text content. Add an Edit Text field to their ViewMode and they would never need to edit the test. However remember there is value in the draft.of process on the main editor.

I have being more interested in the ability to create custom forms from individual tiddlers and this means being able to insert edit fields macros in the wiki text so they work in view mode or in a custom field edit-fields-list so they just open below the tiddler text, I achieved this but did not publish because when I thought about it just providing edit text on a field is useful in many cases but what if it is used for a date, a unique ID, and icon or image link. So now I am building field templates that you can save as a prefix/fieldname that define how to handle the field when editing. So one based on an image allows image selection, or one based on a date, to stamp with now, or to select a date from a calendar. Of course you are free to edit this definition and make the edit-field as sophisticated as you desire.

I hope then to move on to a view-fields-list so you can display in appropriate format the fields (without edit mode or field edit). It Should be easy then to encode in a tiddler a mixture of view and edit fields that the user can interact with, without going into the stock standard edit tiddler mode.

I was playing with edit-fields support for the "text" field, and have not quite determined how to make it full width and have the number of rows as the content, like the normal edit text fields work, I may very well find the answer in TiddlyWikis edit template, which is the beauty of TiddlyWiki, almost everything you want to do is done in some way already in tiddlywiki.

Regrads
Tony

JD

unread,
Jul 8, 2018, 3:58:43 AM7/8/18
to TiddlyWiki


On Sunday, July 8, 2018 at 2:19:53 PM UTC+9, TonyM wrote:
JD,

I have also being working on a sophisticated "tiddler Viewer" like TWOutlier https://groups.google.com/forum/?hl=en#!msg/tiddlywiki/ol_3zvGPbk8/EdIG3awlBAAJ;context-place=forum/tiddlywiki but with advanced handling of tiddlers in a TOC structure, this may be a good way to present tiddlers that the key use is to edit their text content. Add an Edit Text field to their ViewMode and they would never need to edit the test. However remember there is value in the draft.of process on the main editor.

Oh, wow, I haven't followed that thread diligently, but I wish to combine it with Dave's NoteSlam, which I think is simply fantastic. Although taking up such a project with no end-user in sight would certainly mean it's of lowest priority in my project list, I am very interested to do it. 
 

I have being more interested in the ability to create custom forms from individual tiddlers and this means being able to insert edit fields macros in the wiki text so they work in view mode or in a custom field edit-fields-list so they just open below the tiddler text, I achieved this but did not publish because when I thought about it just providing edit text on a field is useful in many cases but what if it is used for a date, a unique ID, and icon or image link. So now I am building field templates that you can save as a prefix/fieldname that define how to handle the field when editing. So one based on an image allows image selection, or one based on a date, to stamp with now, or to select a date from a calendar. Of course you are free to edit this definition and make the edit-field as sophisticated as you desire.

Oh, I see the point. The type of edittext widget produced in view tiddler mode would depend on what "kind" of field is being editted. Like how the field "color" brings up a type=color input in edit tiddler mode. 

I was playing with edit-fields support for the "text" field, and have not quite determined how to make it full width and have the number of rows as the content, like the normal edit text fields work, I may very well find the answer in TiddlyWikis edit template, which is the beauty of TiddlyWiki, almost everything you want to do is done in some way already in tiddlywiki.

It might be a question of styling, and your comfortability with using display: flex; (my favorite). I think the first thing that needs to be taken care of is the backend stuff, if both can't be handled at the same time.
Reply all
Reply to author
Forward
0 new messages