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

Google Group (Read Only)
#1

Related TW script in this post, just below the video.

\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>
4 Likes
Adding images using _canonical_uri
#2

Looks great! :slight_smile:

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

#3

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.

#4

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.

#5

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.

#6

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

./Graphics%20Samples/

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 :slight_smile:

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 :slight_smile:

1 Like
#7

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.

#8

Well, I’m happy with it - Thank You again :slight_smile:

#9

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.

#10

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 (2.32 KB)

2 Likes
#11

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.

#12

That’s really cool - thanks for sharing!

#13

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…

#14

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.

#15

I had put something together a fair while back that might be worth taking a look at. I was using it to embed _canonical_uri tiddlers to PDFs so I pulled out the mime-type selector for flexibility and made a “$:/language/Docs/Types/application/pdf” along the same lines as the others to add that option to the list (I am not sure why it is not a default option). I’ve always wanted to make things a little more automated by reading the extension but never bothed since 99% of this things I was embedding were PDFs. It has the bonus feature of tagging the created tiddler with the title of whatever tiddler contains the macro.

https://sextant.space/#DropCanonicalURI

Enjoy,
/Mike