TiddlyWiki: Drag and drop image link to create tiddler with _canonical_uri link to the image

158 views
Skip to first unread message

Charlie Veniot

unread,
Apr 2, 2023, 7:36:10 PM4/2/23
to TiddlyWiki
Related TW script in this post, just below the video.

https://youtu.be/NjE0MHsndE8

```
\define droppable-image-actions()
<$action-setfield $tiddler=<<actionTiddler>> $field="text" $value=""/>
<$action-setfield $tiddler=<<actionTiddler>> $field="_canonical_uri" $value={{{ [<actionTiddler>split[/]last[]addprefix[./Graphics%20Samples/]] }}}/>
<$action-setfield $tiddler=<<actionTiddler>> $field="type" $value={{{ [<actionTiddler>split[/]last[]split[.]last[]addprefix[image/]] }}}/>
<$action-createtiddler $basetitle={{{ [<actionTiddler>split[/]last[]] }}} $template=<<actionTiddler>>/>
<$action-deletetiddler $tiddler=<<actionTiddler>>/>
\end

<$droppable actions=<<droppable-image-actions>>>
<div style="border:5px double blue;text-align:center;">
<p>Drop image here</p>
</div>
</$droppable>
```

Zaphod Beeblebrox

unread,
Apr 3, 2023, 9:19:52 PM4/3/23
to TiddlyWiki
Looks great! :)

Now... Work your sorcery and create a version to do the same thing, only with locally-stored images!

Charlie Veniot

unread,
Apr 3, 2023, 11:03:10 PM4/3/23
to TiddlyWiki
Actually, it works A-1.

However, do not drag a local file.

Instead, view the local directory that has the files via your web browser.  Then drag an image file's link to the droppable zone.

The droppable zone will handle links to files, but not actual files.

Donald Coates

unread,
Apr 5, 2023, 12:27:35 AM4/5/23
to TiddlyWiki
You have to have some sort of server running to upload files.  When you drag an image into a single file wiki it is not uploading it, it is converting it to binary(?), not actually uploading the image.  The nodejs version is running on server software that can upload files.  I use filestash via docker for a very lightweight server to upload images that I then use this code to create link to by dragging the link.  It is such a time saver.

Charlie Veniot

unread,
Apr 5, 2023, 8:39:47 AM4/5/23
to TiddlyWiki
If I view a folder on my computer via my web browser, I can drag the links for image files from that directory listing in my web browser to that droppable zone I created and have displaying in my local TiddlyWiki.

No server needed for that.

Zaphod Beeblebrox

unread,
Apr 5, 2023, 5:12:41 PM4/5/23
to TiddlyWiki
Okay... Works, after a fashion.

When I drag an image from a Chrome tab with the folder into the tiddler containing your macro, I get

<code>./Graphics%20Samples/</code>

before the filename and no image shows in the Tiddler (this is NOT part of the file path to the image).

But once I delete the above addition, all works fine :)

It still adds the '%20' in place of spaces in the filename, but they can safely be replaced by spaces (if I could write filters, I could probably add one to automatically convert them back to spaces, but...)

In any event, this will still be quite useful - Thank You, Charlie :)

Charlie Veniot

unread,
Apr 5, 2023, 6:15:13 PM4/5/23
to TiddlyWiki
Using the droppable widget, we have no way (none documented that I know of) of knowing the URL of the thing being dropped.

We can get the filename, though.

The whole point of using the droppable widget  is to drop into your TiddlyWiki just enough info about images from your storage location.to create an image tiddler with a canonical uri link.

The info for the canonical uri via drop to the droppable widget is incomplete.  You have to provide the missing bit (the standard bit for all of your images) that will be added as a prefix to the image name.

If the intent is to create image tiddlers with canonical uri's from all possible sources on the web, this is not the right approach.

Zaphod Beeblebrox

unread,
Apr 5, 2023, 6:24:52 PM4/5/23
to TiddlyWiki
Well, I'm happy with it - Thank You again :)

Charlie Veniot

unread,
Apr 5, 2023, 6:34:25 PM4/5/23
to TiddlyWiki
Good grief.  The moment I pressed "Post Message" on that last one: "what are you thinking?"

Just give me half an hour or so, and I'll have a "universal" version.

Charlie Veniot

unread,
Apr 5, 2023, 7:02:35 PM4/5/23
to TiddlyWiki
The attached json file has one tiddler.  That tiddler has two droppable zones and each using a different macro.

The first droppable zone is for your images, all stored under one root image folder, that folder being in the same domain as your TiddlyWiki instance.  You have to modify the related macro with the hard-coded bit of a relative path to your images.

The second droppable zone is for any image available via a server.  The Tiddler titles will be just the file names, the _canonical_uri values will be the full URL to the files.

In all cases, the droppable zones expect URL links to the images.  They are not meant for dropping actual image files.

Image Importing Droppable Zone.json

Simon Baird

unread,
Apr 6, 2023, 10:53:58 PM4/6/23
to tiddl...@googlegroups.com
I wonder if this could become something that makes its way into the core TiddlyWiki.

Imagine if there was a configuration option under Settings in $:/ControlPanel called "Image import behavior" and the options were "Embed image in TiddlyWiki" and "Externally link image with canonical url field".

If the default behavior was "Embed.." then it wouldn't break anything for those accustomed to the embedding.

On Wed, 5 Apr 2023 at 18:32, Simon Baird <simon...@gmail.com> wrote:
That's really cool - thanks for sharing!

--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/aab7273a-7f53-4ce8-adc4-fdfdb03058b7n%40googlegroups.com.


--


--

Simon Baird

unread,
Apr 6, 2023, 10:57:13 PM4/6/23
to tiddl...@googlegroups.com
That's really cool - thanks for sharing!

On Sun, 2 Apr 2023 at 19:36, Charlie Veniot <cj.v...@gmail.com> wrote:
--
You received this message because you are subscribed to the Google Groups "TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email to tiddlywiki+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/aab7273a-7f53-4ce8-adc4-fdfdb03058b7n%40googlegroups.com.

Charlie Veniot

unread,
Apr 6, 2023, 11:05:35 PM4/6/23
to TiddlyWiki
Hey, thanks for giving that a gander !

I am all for reducing the number of mouse clicks to get stuff done.  Part of my quest to reduce the spread of mouse-clicky-induced tendinitis o' the finger knuckle.

We are going to have a generation of folk who cannot finger-poke significant others' foreheads, when said significant others honestly deserve a straight finger-poke to the forehead...

Charlie Veniot

unread,
Apr 6, 2023, 11:15:14 PM4/6/23
to TiddlyWiki
Me being a huge fan of minimalism (like Tiny Core Linux), I'm a big fan of a small (lean and mean) core if it can be paired with an excellent repository and easy package (plugin) management.

Looking at what I did with this handy little gadget, there isn't much to it, so it would be pretty cool to see that in the core.

I might try and pretty that up and turn into a sidebar tab tiddler that can also function well as a transcluded thingy.



On Thursday, April 6, 2023 at 11:53:58 PM UTC-3 Simon Baird wrote:
Reply all
Reply to author
Forward
Message has been deleted
0 new messages