Changing image.png for importing images?

[saqimtiaz]

@Mark_S

That’s exactly it. When you paste a copied image into TW, it sets a base title of image.png. It sets that image name even if there already is a file image.png.

To clarify, the filename image.png is set by the browser in the paste event, not by TiddlyWiki. On some browsers, this name is also localized. There is no information included in the event to indicate that this is a browser assigned default filename and not a real filename. This in turn makes it tricky to know if we can override the filename received from the event.

This problem is the reason behind this PR to add a hook allowing plugins to customize the file naming: Add th-readFileCallback hook mechanism by FSpark · Pull Request #6517 · Jermolene/TiddlyWiki5 · GitHub

Another potential core approach that would be more universal is to add in the import UI a checkbox that when checked, never overwrites tiddlers on import and instead adds a suffix to non-unique titles.

[jeremyruston]

I wondered if we could deal with @Mark_S’s use case by hacking together a button that automatically renamed all of the queued subtiddlers in $:/Import using a base string and a sequence number.

[saqimtiaz]

@jeremyruston with the way the import mechanism currently works, every subsequent image.png pasted into the wiki would overwrite the previous one queued in $:/Import.

$:/Import cannot contain two pending tiddlers with the same name.

Hence my thinking that for pasted files we can safely assume the title is always a browser generated one and therefore always override it with a custom naming scheme that generates unique titles. Potentially the basename could be set via a config setting. To clarify, this would happen before the tiddler is inserted into $:/Import.

Both Github and Discourse do something similar. You can see in the UI for both that when an image is pasted it is uploaded as image.png, and then made available at a unique URI.

[TW_Tones]

If you are capturing images it is not enough just to ensure unique names are used. There needs to be an opportunity to name or annotate and idealy at the time of import.

I am sure we can make this easier for real world practical use.

[saqimtiaz]

@TW_Tones

If you are capturing images it is not enough just to ensure unique names are used. There needs to be an opportunity to name or annotate and idealy at the time of import.

That is already possible in the import UI.

[TW_Tones]

Saq do illustrate. I am suggesting it could be better and easier.

[saqimtiaz]

@TW_Tones

Saq do illustrate

I’m not sure what you want me to illustrate, surely you are familiar with the default core affordance for renaming a tiddler in the import UI before import? You can name an image to your liking before import, which is precisely the opportunity you expressed a desire for.

@TW_Tones

I am suggesting it could be better and easier.

Improvements to the user experience would be very welcome. The entire import UI is wikitext based. It would be very interesting to see a demo of other ideas for a better user experience.

[TW_Tones]

I just tried a few capture and paste of images without using my snagit app to see if there were any issues. There are. Rather than document them here I will take this off line and research the barriers to simple workflows . Being able to paste or drop and have the filename increment, as per the OT here is one improvement, but also other impediments exist to swift capture and use such as you mentioned “$:/Import cannot contain two pending tiddlers with the same name.”

I solved many of the limitations of tiddlywiki workflows for this by using snagit which provides “random unique image names” as I posted previously, but have other ideas such as custom dropzones.

However if anyone has already found a smooth and productive way to do this and can document their workflow it would be helpful.

[pmario]

I think the core already provides plugin authors with everything we need to tackle this problem.

I did an experiment and did add a new function to the bundler plugin, because it already uses a similar feature:

A short test is shown in the following screenshot. Since my FF browser talks German to me, it uses “grafik.png” as the default image name. This name comes from the browser. …

In the test I did hit CTRL-V 6 times within 1 second

There are 2 config tiddlers:

$:/config/wikilabs/import/image/default-title … which defaults to image.png
$:/config/wikilabs/import/image/title-template … which defaults to: test YYYY-0MM-0DD, 0hh:0mm:0XXX.png

As soon as the “update” function sees: image.png / grafik.png it converts the name into the title-template, which uses the TW standard date format.

Users can define the “input title”, which should be replaced.
Users can define the “output template” which should be used to create the new name.

You only need to take care, that the “output” is unique enough for your workflow.

@Mark_S … Do you think this would work for you?

[pmario]

It would be possible to keep “grafik.png” as an unselected tiddler. … But that’s just an implementation detail, which I personally think isn’t necessary.

It also works without any code changes if an image is dropped into a tiddler text area.

Which results in some text like this:

[TW_Tones]

@pmario good work. This name serialisation of imported images is a critical minimum behaviour in my view and worthy of a core fix.

Experimenting with real world workflows

• when an image is dropped into the editor its position has being determined by the author and allows the author to proceed with just a “unique title”.
• When one or more images are pasted “ctrl-V” at a minimum they need a unique title, however in reality in this situation to make use of the image later we may want to rename the image tiddler even before import so we can find it in future, ideal with minimum key strokes.

Perhaps if the import process, or let us consider the subset of paste based “imports” for which we have no file/tiddler name. It would be great if we could click edit the title, and ideally also see an image/content preview before (or less desirably shortly after import).

• One could past a bundle of images and content into a wiki import process and never import it, but drag the “import bundle” to another wiki.

[Mark_S]

That’s looking very promising. As Tony mentions, the idea would be to be able to quickly change the name. Having a configured name is a good start.

For instance my stub name might be “lesson-27-9.png”, where the"9" needs to be changed to the location inside the instructional video for ease of cross-referencing. In this regards, Tony’s other point, about clicking on the title is pertinent. Right now, if you click on a name, it shows you what the image looks like, rather than opening up the title field for editing. You have to click on the special “pencil” icon to change the name. To me this is counter-intuitive. I already know what the image looks like. It would make more sense for the field to be clickable and there to be an image icon if I need to remember what the image looks like.

Thanks!

[TW_Tones]

@Mark_S

I already know what the image looks like.

Yes, it is interesting how in the same activity we may face the two - one we know the image but want to name it, or we made a large collection and need to see the image before renaming them. In other cases when we drop into prose we are not at all concerned with the name now, but may be later in the future.

To make good workflows we should try and make it intuitive to deal with the different possible approaches. Allowing specific image or all image preview/rename actions will help. Including adding prefixes.

[pmario]

@Mark_S

That’s looking very promising. As Tony mentions, the idea would be to be able to quickly change the name. Having a configured name is a good start.

The point here is, that the code that I did create is long executed, when the $:/Import tidldler is shown. I don’t intend to change the core dialogues atm.

My code only takes care, that an image, that comes from the clipboard is renamed, before it hits the $:/Import tiddler. So you can copy / paste several screenshots into a wiki and the $:/Import mechanism lets you queue them.

User specific workflows can be implemented as plugins, that can use the same mechanism as I do.

[pmario]

@TW_Tones

When one or more images are pasted “ctrl-V” at a minimum they need a unique title,

If you drag & drop import several tiddlers from the filesystem, they already have a unique name. So in that case TW shouldn’t change the name at all.

[pmario]

@TW_Tones

Perhaps if the import process, or let us consider the subset of paste based “imports” for which we have no file/tiddler name. It would be great if we could click edit the title, and ideally also see an image/content preview before (or less desirably shortly after import).

That’s already possible, with the TW default $:/Import tiddler. You can click the “edit button” to change the name and you can click the “chevron” to open the tiddler preview, which shows the image.

Also here I don’t intend to create a UI for a special workflow. I only want to enable the queueing system, that isn’t possible at the moment.

[TW_Tones]

@pmario

import several tiddlers from the filesystem, they already have a unique name

Yes, that is true and not the problem.

@pmario

I only want to enable the queueing system

Fine, my point is that eventually of we can make the workflow simple it will be used more.

I believe tiddlywiki is already a capture and organise machine. Its power is immense yet for new commers it does demand both the recognition of this and an understanding of tiddlywiki how to’s and mechanism’s to realise its full value.

Any way of allowing simplified (but sophisticated) solutions in this space will suite and capture a wider audience.

[pmario]

Hi foks,
I did just update all my plugins to TW 5.2.2 and the bundler-plugin got a new functionality, as described in the other post.

It’s important to “enable” the feature and adjust the settings according to your browser language in the control panel

:::

have fun!

[twMat]

@pmario - thank you. I tried some stuff on your demo site but got some issues, see github.

[pmario]

The first parameter is the default name, the browser creates. Defaults to: image.png … if your browser language setting is English.

The second parameter is used to create the new unique name.

Also see: Changing image.png for importing images? - #18 by pmario