Towards a friendlier workflow for images in notes

First of all, thank you for this plugin :)! I sought something like this for TW in the past, I’ve been using it in the last couple of months, I think it adds great value for people like me who take a lot of screenshots for study and work.

Said that, I noticed a strange behaviour when opening tiddlers in edit mode.
I’m using TW for node.js remotely deployed on a server.
If the plugin is enabled, when I open a tiddler for editing it and start writing something, after a a couple of seconds the focus into the tiddler is lost and I’m forced to click again inside the tiddler for getting back the edit focus.
This is a bit annoying during the standard edit of the tiddler, especially when you work with lots of them :frowning:
If I disable the plugin and restart the server, the focus behaviour is ok.

To be sure, I also tried with latest tiddlywiki(v. 5.3.6) for node.js deployed on my local machine with quickimages(v. 0.0.3) as the only installed plugin.

@saqimtiaz is there something I can do in order to solve this focus problem?

Thanks

1 Like

@franp I believe this is due to an underyling bug with the genesis widget, see [BUG] Genesis widget always re-renders on first refresh cycle · Issue #8871 · TiddlyWiki/TiddlyWiki5 · GitHub

thank you for your feedback @saqimtiaz

I will monitor the bug then and retry after its resolution.

@saqimtiaz Amazing, I was just starting to think about how this could be done, no surprise you had already beaten me to the punch.

Now any chance it could work with Streams? :thinking:

(PS, this is working well with MWS, which is fantastic because it really opens up the ability to keep large image collections in bags)

You would need to adapt $:/plugins/sq/streams/editor-template to follow the pattern in the version of $:/core/ui/EditTemplate/body/default from this plugin. Here is a quick rough jab at it to get you started (requires that both plugins are installed):

\procedure customImportFileActions()
\procedure tv-action-refresh-policy() always
\procedure imageTextTitle() $:/config/sq/quickimage/image-transclusion-text
\procedure defaultTextTitle() $:/config/sq/quickimage/default-transclusion-text
<$let
	tiddlerJSON={{{[<importTitle>get[text]jsonextract[tiddlers]]}}}
	replacement-text-image={{{ [<imageTextTitle>get[text]] }}}
	replacement-text-file={{{ [<defaultTextTitle>get[text]] }}}
	contentTiddler={{{ [<currentTiddler>get[draft.of]else<currentTiddler>] }}}
	>
	<!-- iterate over each position in the array -->
	<$list filter="[<tiddlerJSON>jsonindexes[]]" variable="index">
		<!-- get the tiddler at that position in the array from the JSON -->
		<$let
			tiddler={{{ [<tiddlerJSON>jsonextract<index>] }}} 
			title={{{ [<tiddler>jsonget[title]] }}}
			type={{{ [<tiddler>jsonget[type]] :else[[text/vnd.tiddlywiki]] }}}
			unusedtitle={{{ [<title>] :cascade[{$:/config/sq/quickimage/file-title-cascade}splitregexp[\n]!prefix[\\]!is[blank]] }}}
		>
		<$action-log $$filter="title unusedtitle"/>
			<!-- make sure we have a title for the tiddler -->
			<$list filter="[<unusedtitle>!is[blank]]">
					<$action-setmultiplefields
						$fields="[<tiddler>jsonindexes[]] :except[[title]] created modified quickimage"
						$values="[<tiddler>jsonindexes[]] :except[[title]] :map[<tiddler>jsonget<currentTiddler>] [<now [UTC]YYYY0MM0DD0hh0mm0ssXXX>] :all[<now [UTC]YYYY0MM0DD0hh0mm0ssXXX>] yes"
						$timestamp="no"
						/>
					<$list filter="[<currentTiddler>] :map[get[type]prefix[image]then<replacement-text-image>else<replacement-text-file>substitute[]]" variable="imageTitle">
						<$action-transmit actions=`<$action-sendmessage
							$message="tm-edit-text-operation"
							$param="insert-text" text="$(imageTitle)$"/>` target="editor-import"/>
					</$list>
					<$action-deletetiddler $tiddler=<<importTitle>>/>
			</$list>
		</$let>
	</$list>
</$let>
\end customImportFileActions

\define config-visibility-title()
$:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
\end

\widget $edit(tiddler, field, index, class, tabindex, autocomplete,cancelPopups,inputActions,refreshTitle)
<$genesis $remappable="no" $type="$streams-edit" tag="textarea" autoHeight="yes" minHeight="1em" focus="yes" select="false" class="streams-editor tc-edit-texteditor tc-edit-texteditor-body" caretPosition={{{[{$:/state/sq/streams/caret-position}!is[blank]else[end]]}}}>
	<$set name="targetTiddler"value=<<currentTiddler>> >
		<$slot $name="ts-raw"/>
	</$set>
</$genesis>
\end 

\widget $dropzone(importTitle, autoOpenOnImport, contentTypesFilter, class, enable, filesOnly, actions)
<$let
	configTitle="$:/config/sq/quickimage/import/enable"
	quickimageEnabled={{{ [<configTitle>get[text]trim[]match[no]else[yes]]  }}}
	>
	<$genesis
		$remappable="no" 
		$type="$dropzone"
		importTitle=<<importTitle>>
		autoOpenOnImport="no"
		contentTypesFilter=<<contentTypesFilter>>
		class=<<class> enable=<<enable>>
		filesOnly=<<filesOnly>>
		actions={{{ [<quickimageEnabled>match[yes]then<customImportFileActions>else<actions>]  }}}
	>
		<$slot $name="ts-raw"/>
	</$genesis>
</$let>
\end

<$transclude $tiddler="$:/core" $subtiddler="$:/core/ui/EditTemplate/body/default"/>

This also reminds me that Streams is really overdue for a refactoring, since a lot of the core tweaks and workarounds that were used back then are now a part of the core.

1 Like

@saqimtiaz can something be done for this. I use a lot of images in my wiki. So creating separate image tiddlers for each image being added to the wiki seems unnecessary. Atleast can there be a configurable option - one the current way of transcluding the image tiddler and other as [img[file-path]]

1 Like

3 posts were split to a new topic: Ideas for a Streams rewrite