Seeking help for my idea of a more easily image import working process

[HP]

Hello all,

I'm looking for a plugin or an already existing TW5 function for my excessive image based working process. Based on the sheer number of to be processed images, it is neither possible to save them manually nor in TW5 (I don't like nodejs a lot - so "lazy load" isn't an option).

I want TW5/a plugin to "build externalimages" (aka just save images separately through TW5) ad hoc with the import process (drag'n drop or copy paste) by saving the image into a/tbd/asked separate file folder AND create a thumbnail/image tiddler with or by its _canonical_uri to it.

Maybe this process could handle all files TW5 is able to create thumbnails of (eg PDF).

Thank you for your hints in this direction and please apologize my bad English.

Best regards,

HP

tl;dr

1.  import image by dnd or as a screenshot from clipboard  (instead of saving one of those myself to s TW5 image folder)
2. let TW5 save it to its/a file subfolder
   
   Bonus
3. create a tiddler from the image import with a thumbnail through its uri to the file subfolder it was saved to
   

[Mat]

+1

I'm in a very similar situation! I posted this request a few days ago which is related but complimentary. 

These functionalities would make TW substantially more useful for e.g authoring books or other image intensive documents.

<:-)

[Mark S.]

I think the approach would have to be from the other direction. You would have a script or program that would look at a directory of images, create tiddlers, and maybe create thumbnails. Then you could import the generated tiddlers into your TW.

We've been told (I think) that the name of the file is unavailable when you drop into a web page (including TW). And of course modern browsers won't let your web page save to specific directories (just the nominated download directory).

I do have a script that runs in TW where you provide a list of file names and then it creates the tiddlers with the _canonical_ uri filled in.

Actually creating thumbnails would have to be done through an external file manipulator, I suspect.

[Mat]

Mark S. wrote:

I think the approach would have to be from the other direction. You would have a script or program that would look at a directory of images, create tiddlers, and maybe create thumbnails. Then you could import the generated tiddlers into your TW.

At least for my use case, it is just not possible to spend that much time on each image. It has to be much more direct for it to be practical.

Both ggroups and Github lets you drop an image directly from memory (e.g you screenclip something, click in the gh editor, and Ctrl+V). Here in gg you see the image directly and in the github editor you see the resulting link, e.g this format: 


<:-)

[Mark S.]

Now I remember. You can use the external attachments plugin with tiddlydesktop to drag and drop and create a _canonical_uri tiddler to your source image.

[Saq Imtiaz]

Matt: you may find some of the discussion here of interest: https://github.com/Jermolene/TiddlyWiki5/issues/5286

I do plan to work on something similar to the Github mechanism for pasting/importing images, but my focus will likely primarily be on importing and inserting the relevant syntax when pasting an actual image, rather than pasting just an image URL. As far as I know, inserting the location of a local file isn't possible from drag and drop unless you use TiddlyDesktop.

[HP]

Hi Mark. Thanks for your reply.

I can't see the problem here in generate a file name (as UUID) to prevent the case that TW5 must know the file name which is unavailable at this particular moment. After save it to a (TW5) folder it should be possible to generate a uri from that place for thumbnails. It is another topic to import and provide a thumbnail from an external uri fmpov.

[HP]

Unfortunately the "External Attachment" plugin doesn't do the job and isn't available in the html quine.

[HP]

@saq The discussion is about another topic but thank you for pointing to it. After reading it I understood that these are two total different topics.

[Mark S.]

On Friday, January 1, 2021 at 3:59:58 AM UTC-8 HP wrote:

Unfortunately the "External Attachment" plugin doesn't do the job and isn't available in the html quine.

I'm not sure what you mean. It works with the single file HTML when using TiddlyDesktop. You could use TD until you've imported your images.

Another approach would be to drag and drop your images into your TW file. Then use the import list to zip all the files (using the new zip plugin) and download them, create canonical uris, and delete them -- all possibly with one button. You would then only need to unzip the files manually. 

[HP]

Hi Mark S.,

> I'm not sure what you mean. It works with the single file HTML when using TiddlyDesktop. You could use TD until you've imported your images.

Yes, I mean the single HTML file. Iirc TD is an .exe and works with nw.js.

> Another approach would be to drag and drop your images into your TW file. Then use the import list to zip all the files (using the new zip plugin) and download them, create canonical uris, and delete them -- all possibly with one button. You would then only need to unzip the files manually. 

And this is exactly the way I want to remove or do not want me to do. I would like to see TW saves my files separately from its own single HTML file in one import step. I would even give up getting a uri back that provides a thumbnail on the wiki. Another reference to the import file would be enough from my point of view.

[Jeremy Ruston]

On 1 Jan 2021, at 14:38, ludwa6 <wlud...@gmail.com> wrote:

Was excited to learn from @MarkS. about "External Attachments" plugin for TiddlyDesktop, since that is my UI for TW5, but couldn't get it working right: i drag an image to TiddlyDesktop, and it lights up the green import bar atop the window, but then it offers to import scads of unrelated tiddlers... And then there is in the end no new tiddler, and no evidence of the image i tried to import. 

That’s very strange. What OS are you running? When you say “drag an image to TiddlyDesktop” you are dragging the image into a window containing your wiki, and not into the TiddlyDesktop main window?

Best wishes

Jeremy

[ludwa6]

Correct, @Jeremy : If you mean by "main window" the one that launches on startup, which displays the several wikis i am managing with TiddlyDesktop, that's not the one... 

But rather: in the window that holds the wiki i am currently managing, if i drag an image to that window, a green bar shows up across top of the window (much as it did when i dragged in the yellow pill for Stroll upgrade), and then i get this screen full of tiddlers it asks if i want to update (! strange, when it's just a single small .jpg file i've tried to import).  Still, i have gone ahead and approved the update, but it makes no diff: no new tiddler or image, AFAICT.

I'm running TiddlyDesktop 0.0.13, with "External Attachments" 5.1.22 installed, on macOS High Sierra Version 10.13.6.

Yours, Walt

[Saq Imtiaz]

What version is your TiddlyWiki file? 

Please confirm that the tiddler $:/Import does not already exist. If it does, please delete it, save and reload and try again.

[Mark S.]

On Friday, January 1, 2021 at 2:15:42 PM UTC-8 HP wrote:

Hi Mark S.,

> I'm not sure what you mean. It works with the single file HTML when using TiddlyDesktop. You could use TD until you've imported your images.

Yes, I mean the single HTML file. Iirc TD is an .exe and works with nw.js.

TD is an executable (not necessarily an exe). It can work with single file HTML files even though it uses nw.js. In fact, it works better with single files, IMHO. My thought was that you could use TD just while you were doing your imports. Then go back to whatever your usual method is.

  

[Jeremy Ruston]

Hi Walt

Are you dragging the image from Finder, or another web site? Perhaps you could post a screenshot of the list of tiddlers?

Best wishes

Jeremy

--

Jeremy Ruston

jer...@jermolene.com

https://jermolene.com

On 2 Jan 2021, at 18:00, ludwa6 <wlud...@gmail.com> wrote:

Correct, @Jeremy : If you mean by "main window" the one that launches on startup, which displays the several wikis i am managing with TiddlyDesktop, that's not the one... 

--
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/5d3bf4bf-f02d-436f-9720-18c02374c29bn%40googlegroups.com.

[ludwa6]

In fact @jeremy, even locally stored files were still giving me the long list of unrelated tiddlers to import... But since i took advice of @saq and deleted the preexisting tiddler "$:/Import" , that seems to have resolved this problem of getting a long list of tiddlers to import; now i just get the one (or two -a case i also tested) image files to import.  That solves part of the issue..

However: Instead of the new tiddler being created with a clickable URL- like "file:///Users/walterludwick/Downloads/5.jpg" in this case -what appears on the saved tiddler is a broken image icon, and when i open the edit panel on that tiddler, i see that the "_canonical_uri" for that file is "../../../../../Downloads/5.jpg".  

Is this the way it's supposed to work? Is there some way i can canonically replace all those dots&slashes before the /Downloads/5.jpg, to create a default directory location for this plugin to use, so that it will always display a clickable link to the local file on each new tiddler it creates?

/walt

[Jeremy Ruston]

However: Instead of the new tiddler being created with a clickable URL- like "file:///Users/walterludwick/Downloads/5.jpg" in this case -what appears on the saved tiddler is a broken image icon, and when i open the edit panel on that tiddler, i see that the "_canonical_uri" for that file is "../../../../../Downloads/5.jpg".  

The external-attachments plugin creates relative paths by default. This makes it easier to move a wiki and its images to a new location without having to adjust the paths.

You can switch to absolute paths using the settings in the plugin listing in control panel (see below).

Best wishes

Jeremy

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/53656b03-ec18-478d-a0b2-5efaf113b77an%40googlegroups.com.

[ludwa6]

Thanks, @Jeremy : this makes the plugin useful to me, in that i can drag in a set of images from my desktop, and get a new tiddler for each one, with a navigable URL in format "/Users/walt/Desktop/imagename.jpg" -providing that i've configured the plugin to "Use absolute paths..."

Of those two config options, i chose "Use absolute paths for non-descendent attachments"  because presumably the other option for DESCENDENT attachments is for images i want to reside inside the ./wiki/files folder -correct?

i'm also confused by some options that appear in the dialog box that appears when i drag-in a set of images for import.  In the image the selection widget that appears (twice: once above and once below the list of images), beside the two buttons to either "Import" or "Cancel", there is a "Preview" pulldown menu, with the following options:

• Diff
• Diff (Fields)
• Fields
• Text
• Text (Raw)

The last is the default option, it works as i expect; have also tried the "Text" (w/o Raw) option, and it delivers the same result.  I don't know what the other 3 options are for...

And i am still a bit mystified in general by the issue of where image (and other binary) files are stored, and where those file paths are stored in TW.  The images that i load using this External Attachments plugin as described above reveal a path like [img[imagename.jpg]] -as though they were stored in a subdirectory (i.e. ./files or ./images typically), tho they are not... And then i have other tiddlers i created some other time not using this widget, that have image refs like {{imagename.jpg}} -a couple of which are in fact stored in my ./wiki/files folder, and others of which are not.  So where are they, i wonder? I'm guessing i probably embedded those images using the image tool in WSYWIG toolbar that accompanies the default content type in the tiddler edit form (can't remember now), but how can i find out where such image files are actually stored?

/walt

[Jeremy Ruston]

Of those two config options, i chose "Use absolute paths for non-descendent attachments"  because presumably the other option for DESCENDENT attachments is for images i want to reside inside the ./wiki/files folder -correct?

Correct.

i'm also confused by some options that appear in the dialog box that appears when i drag-in a set of images for import.  In the image the selection widget that appears (twice: once above and once below the list of images), beside the two buttons to either "Import" or "Cancel", there is a "Preview" pulldown menu, with the following options:

• Diff
• Diff (Fields)
• Fields
• Text
• Text (Raw)

The last is the default option, it works as i expect; have also tried the "Text" (w/o Raw) option, and it delivers the same result.  I don't know what the other 3 options are for...

Those are different ways of viewing the incoming tiddlers. The “diff” views show highlighted differences between incoming tiddlers and existing tiddlers, the others just show the incoming data. “Raw” means the raw text, rather than the wikified form. Most of the options make more sense with text tiddlers.

And i am still a bit mystified in general by the issue of where image (and other binary) files are stored, and where those file paths are stored in TW.  The images that i load using this External Attachments plugin as described above reveal a path like [img[imagename.jpg]] -

“imagename.jpg” here is a tiddler title, not a path.

as though they were stored in a subdirectory (i.e. ./files or ./images typically), tho they are not... And then i have other tiddlers i created some other time not using this widget, that have image refs like {{imagename.jpg}} -a couple of which are in fact stored in my ./wiki/files folder, and others of which are not.  So where are they, i wonder? I'm guessing i probably embedded those images using the image tool in WSYWIG toolbar that accompanies the default content type in the tiddler edit form (can't remember now), but how can i find out where such image files are actually stored?

Image tiddlers are listed in the sidebar under More -> Types. Image tiddlers are self-contained unless the _canonical_uri field is present pointing to an external path.

Best wishes

Jeremy

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/a491ecb1-5f5b-4532-a620-d969ddc125a9n%40googlegroups.com.
<TW-DT_external_image-importDialog.jpeg>

[ludwa6]

Thanks for the quick reply, @Jeremy... But i am slow to understand: when you say "Image tiddlers are self-contained unless the _canonical_uri field is present pointing to an external path" -does this mean that the image itself (i.e. the binary code that paints the image on my screen) is actually embedded in the single index.html file that is the whole wiki i am managing with TiddlyDesktop in this case? 

I'm viewing that file (14.1mb) through DeveloperTools in my Chrome browser, and -though it's a lot to scroll through, and i may be missing something- i'm not seeing anything like the kind of inscrutable text that normally describes an image file -of which there are several multi-mb files embedded in this wiki, referenced using either [img[imagename.jpg]] or {{imagename.jpg}} notation.   If those images are embedded in this file -or else referenced from it- i wish i knew where to look for it!

/walt

[Mark S.]

I'm viewing that file (14.1mb) through DeveloperTools in my Chrome browser, and -though it's a lot to scroll through, and i may be missing something- i'm not seeing anything like the kind of inscrutable text that normally describes an image file -of which there are several multi-mb files embedded in this wiki, referenced using either [img[imagename.jpg]] or {{imagename.jpg}} notation.   If those images are embedded in this file -or else referenced from it- i wish i knew where to look for it!

Import an image your favorite way (import, copy/paste). Open the image for editing. You'll see the image. Scroll to the bottom of the tiddler and change the type to TiddlyWiki 5. You will now see all that inscrutable text. Be sure to use a small image when doing this, and maybe have a backup of your TW, because the ASCII version of an image file can pretty much swamp your current tab.

 

[ludwa6]

Thanks @Mark, but... This is strange:  

My usual way of adding external content in TiddlyDesktop has been via the "Import" tool... But now that i've added the "External Attachments" plugin, attempting to add an image via the "Import" tool automatically triggers that _canonical_uri method from the plugin, which leaves that external file external.  

Neither can i copy/paste an image file into a tiddler (never tried that until now, but it doesn't work), so i'm not seeing any way now to import a file to make it part of the the index.html file itself.  

What am i missing, i wonder?

/walt

[Mark S.]

You could disable the external attachments plugin when you don't need it. 

[ludwa6]

Ah, that worked -not immediately; had tried this, then saved, and still i got the _canonical_uri method- but it seems you have to save AND reboot TW.

After i did this, it does indeed embed the image directly into my index.html, as i can see when i change the tiddler datatype to TW5, as you suggested.

Thanks, @Mark; i think i now understand the basics of how this software handles images.

/walt