Tiddlywiki5: Support external images in client-server configuration

[Jermolene]

TiddlyWiki draws a distinction between lazily loaded images and external images:

• Lazily loaded images are delivered in the initial HTML file with their text missing, which is then loaded on demand if and when the image is displayed. When it is loaded it becomes an ordinary tiddler, with the body stored in JavaScript memory. See http://tiddlywiki.com/#:LazyLoadingMechanism%20LazyLoading
• Externally loaded images are delivered in the initial HTML file with their text missing and with a _canonical_uri field that gives the URI of the image. This URI is used directly in HTML img tags, without ever loading the body of the image as a tiddler. See http://tiddlywiki.com/#ExternalImages:ExternalImages

Both types can be used with the standalone configuration, but currently only lazily loaded images are supported in the client-server configuration (see the script ./bin/lazy.sh). The disadvantage of lazily loaded images is that they still consume JavaScript memory and they are rendered as inline base64 images which are not as performant as images retrieved via HTTP.

The following changes are needed in order to support external images in the client-server configuration:

• Extend server.js with simple content negotiation when retrieving tiddlers, enabling it to serve either the current JSON format or the raw resource depending upon what the browser asks for with the "Accept" header
• Insert the variable transclusion <<customSaveTiddlers>> just before the first closing </div> in $:/core/templates/store.area.template.html
• Create a new save filter based on $:/core/save/lazy-images that sets customSaveTiddlers to a rendering of the current image tiddlers with the text field omitted and the _canonical_uri field added. The latter would be set to recipes/default/tiddlers/<encodedimagetitle>

[jayfresh]

bonus for your 1000'th issue! :+1:

[Jermolene]

@jayfresh thanks, makes me feel old!

[danielo515]

So those images will be loaded when you open that tiddler? Like in normal Web page navigation?

[Jermolene]

So those images will be loaded when you open that tiddler? Like in normal Web page navigation?

Yes, that's right; in the browser we'd have an ordinary <img> tag with the URL pointing to the image on the server.

[rubaboo]

Discussion at https://groups.google.com/forum/#!topic/tiddlywiki/MBuzDDEpIPw

[sukima]

PR #2502 introduces a static file server module which in theory would fix the relative path problem described in this issue. Just wanted to link the two discussions.

[gw]

Curious about the latest state of this. I run TW5 in standard client-server mode on a VPS and my content's very image-heavy. Would love for the drag-and-drop importer to upload my images to my VPS and create skinny _canonical_uri tiddlers for me.

Happy to take a stab at this if you point me in the right direction.