Import as external files (Node.js)

363 views
Skip to first unread message

Saq Imtiaz

unread,
Apr 4, 2021, 1:03:44 AM4/4/21
to TiddlyWiki
This is an in-development plugin for Node.js that has been recently discussed in another thread. I'm posting it separately as well in case others find it of interest.

For images (and other binary files), when importing to a wiki it allows you to save the files as external files in the files folder with a _canonical_uri tiddlers created in the wiki.

There is also a view toolbar button to externalise existing tiddlers (if they are of the correct type).

This is still very much in development and there is no documentation so use with care:


If you have a previous version installed, you will need to delete that before importing this. The version numbering system had to be changed for compatibility with how the core compares version numbers.

Future plans include exploring saving to other backends like S3, time allowing. This would be a nice option for single file wikis but the challenge is how to securely save credentials for s3. Any ideas on this would be most welcome.

Cheers,
Saq

Saq Imtiaz

unread,
Apr 4, 2021, 1:52:22 AM4/4/21
to TiddlyWiki
I forgot to mention that the starting point for this plugin was some code from Bob that Jed pointed out that handled uploads. The eventual goal is a plugin - if not core capability - that can be used by the node.js server as well as TiddlyServer and Bob.

Mohammad Rahmani

unread,
Apr 4, 2021, 3:50:23 AM4/4/21
to tiddl...@googlegroups.com
Hi Saq,
 This is amazing indeed! Your time and talent are much appreciated!
  One use case for me is: In Refnotes I use bibtex format for my references (most of them with pdf=full version stored in the ref folder in the same folder of my wiki)!
  This plugin allows me to have access to the full text of those references from my wiki!

 One question: Is there a client-server version to be downloaded? I mean not a packed version (usually installed by drag and drop)!
Best wishes
Mohammad


--
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/dc0138a0-2bbf-4c46-83f9-2585ea3264c3n%40googlegroups.com.

Mohammad Rahmani

unread,
Apr 4, 2021, 3:51:37 AM4/4/21
to tiddl...@googlegroups.com


Best wishes
Mohammad


On Sun, Apr 4, 2021 at 12:19 PM Mohammad Rahmani <mohammad...@gmail.com> wrote:
Hi Saq,
 This is amazing indeed! Your time and talent are much appreciated!
  One use case for me is: In Refnotes I use bibtex format for my references (most of them with pdf=full version stored in the ref folder in the same folder of my wiki)!
  This plugin allows me to have access to the full text of those references from my wiki!

 One question: Is there a client-server version to be downloaded? I mean not a packed version (usually installed by drag and drop)!

A plugin folder can be distributed as an embedded zip file here I think

Jeremy Ruston

unread,
Apr 4, 2021, 4:24:07 AM4/4/21
to tiddl...@googlegroups.com
Thanks Saq, good stuff.

Future plans include exploring saving to other backends like S3, time allowing. This would be a nice option for single file wikis but the challenge is how to securely save credentials for s3. Any ideas on this would be most welcome.

In my S3 work I use Cognito to authenticate users, and let AWS's client side JS library manage the credentials in browser storage. As ever with serverless, there are a few moving parts that need setting up, but then it's all quite smooth.

Best wishes

Jeremy

Saq Imtiaz

unread,
Apr 4, 2021, 5:16:12 AM4/4/21
to TiddlyWiki
Hi Jeremy,

Thank you. I've been looking at documentation for Cognito this last week and it is helpful to have confirmation that it is the correct path to follow. The eventual goal is to have a modular system where you can choose to save binary files being imported as _canonical_uri tiddlers, with a choice of backends for uploading the actual files to.

Regards,
Saq
Message has been deleted
Message has been deleted

Saq Imtiaz

unread,
Apr 4, 2021, 5:20:29 AM4/4/21
to TiddlyWiki
Hi Mohammad,

Currently there is only a local git repo on my own machine. I've uploaded a zip file for you: https://github.com/saqimtiaz/sq-tw/raw/master/temp/ImportToExternalFile.zip
Please do use with caution.

Regards,
Saq

Mohammad Rahmani

unread,
Apr 4, 2021, 5:28:57 AM4/4/21
to tiddl...@googlegroups.com
Thank you Saq!

Much appreciated!

Best wishes
Mohammad


--
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.

Mark S.

unread,
Apr 7, 2021, 2:10:41 PM4/7/21
to TiddlyWiki
If you do an update on the UI that uses this plugin (sandbox, mentioned in other thread), could you add the ability for the tool to appear in markdown mode? It doesn't even have to be a markdown style image link since TW can recognize wikitext image links in markdown now.

The goal being to simplify bringing in external articles without the current speed bumps of extracting images and adding links. 

Thanks!


Saq Imtiaz

unread,
Apr 7, 2021, 2:55:54 PM4/7/21
to TiddlyWiki
Hi Mark,

You just need to set the default picture button for the editor toolbar to show on markdown tiddlers.

Edit $:/core/ui/EditorToolbar/picture

At the end of field condition add the following:
[<targetTiddler>type[text/x-markdown]]

For the UX I would like to move towards just being able to drag and drop, or paste, images directly into the editor.
Regards,

Saq

Mark S.

unread,
Apr 7, 2021, 6:12:39 PM4/7/21
to TiddlyWiki
Thank you!

On Wednesday, April 7, 2021 at 11:55:54 AM UTC-7 saq.i...@gmail.com wrote:


For the UX I would like to move towards just being able to drag and drop, or paste, images directly into the editor.
Regards

That would be pretty cool! 

Peter Erne

unread,
Apr 9, 2021, 11:37:28 AM4/9/21
to tiddl...@googlegroups.com
Hi Saq,

amazing! Thanks for all your work. I would love to have such a feature in the standard core of TW5 in order to keep the .html lean and have one (ONE only!) folder for all media files. I love the lean concept of TW. This would mean: when I drag an image or PDF (prio 1 and 2 for me) into TW, a tiddler opens (as now) but the binary is stored to the default media folder and the tiddler contains the canonical-URI. The top solution - to go one step further :-) - would be to automatically transclude the new tiddler at the current position of the editor, when an image is imported. This would then come very close to image handling like in Evernote (apart from the non-WYSIWYG editor of TW). I am not a developer and therefore have no clue how far this is for realistic given TW5 and the underlying technology.

Cheers
Peter

--
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.

Saq Imtiaz

unread,
Apr 10, 2021, 6:21:10 AM4/10/21
to TiddlyWiki
Hi Peter,
 
 This would mean: when I drag an image or PDF (prio 1 and 2 for me) into TW, a tiddler opens (as now) but the binary is stored to the default media folder and the tiddler contains the canonical-URI.

This plugin allows for exactly this workflow for TW on node.js
For a single file TW, the obstacle is that the browser does not allow the necessary access to the local file system due to security concerns. At minimum you would need something like TiddlyDesktop or a browser extension to enable this kind of access.
 
The top solution - to go one step further :-) - would be to automatically transclude the new tiddler at the current position of the editor, when an image is imported.

This is in the works. In the meantime you may find this thread to be of interest: https://groups.google.com/g/tiddlywiki/c/ueeaCHA7hI0/m/2Ujwl1TABAAJ

Regards,

Saq

Nathan Sain

unread,
May 20, 2021, 12:45:45 PM5/20/21
to TiddlyWiki
Saq, I've installed this plugin in my node.js TW. I can see the additional check boxes on the import tiddler and there is an additional 'Save as external file' button on my tiddlers. Unfortunately, when I drag / drop images or copy / paste images an external file is not created nor is the _canonical_uri field set. Instead it seems to create a embedded image just as it did before. Are there any additional setup or workflow changes I need to do in order to use this plugin to add images as external files?

Regards,
Nathan

Saq Imtiaz

unread,
May 20, 2021, 12:54:49 PM5/20/21
to TiddlyWiki
Nathan, have you restarted the node.js server after installing the plugin?

If so, check the browser console for any error messages.

Nathan Sain

unread,
May 20, 2021, 4:49:32 PM5/20/21
to TiddlyWiki
Thanks for that. After restarting the node.js server I was able to import an image as an _canonical_uri linked file. The file was named files/image.png. Is there a way to rename the file or choose the file name on import?

Regards,
Nathan

Saq Imtiaz

unread,
May 20, 2021, 4:58:48 PM5/20/21
to TiddlyWiki
The import UI lets you rename the file before you import. Remember to include the file extension in the name.
Once the file has been saved in the files/ folder there is no further affordance for renaming it.

Nathan Sain

unread,
May 20, 2021, 5:43:01 PM5/20/21
to TiddlyWiki
Thanks for your help. I thought the import UI would have the ability to name the imported tiddler. I checked the TiddlyWiki docs and only find this page dealing with tiddler imports https://tiddlywiki.com/#Importing%20Tiddlers but it doesn't contain any information about naming tiddlers on import.
When I paste an image from the clipboard this is what I'm seeing and I can't find a way to name the tiddler.

Screenshot - 5_20_21 , 4_36_56 PM.png

Saq Imtiaz

unread,
May 21, 2021, 12:21:57 AM5/21/21
to TiddlyWiki
@Nathan what version of TW are you using? You need 5.1.23+

Screenshot 2021-05-21 062059.png

If you are using 5.1.23, close the preview to see the "pencil" edit button to rename the image being imported.

Nathan Sain

unread,
May 21, 2021, 3:43:19 PM5/21/21
to TiddlyWiki
Thanks for pointing me in the right direction. I was using 5.1.22. After upgrading to 5.1.23 I can use the pencil edit button. I think I'm ready to start adding external images now.
Thanks again for your help and the plugin!
Reply all
Reply to author
Forward
0 new messages