[TW5] How to use images with node.js ?

[Mark S.]

If I want to serve up images under node.js, but not import them into the TW (because that bloats the TW), what syntax do I use, and where do I put the images?

For instance, neither of these worked when I put the TW-images directory at the same level as tiddlers nor as a sub-directory of tiddlers nor at the same level as the node directory.

  [img[TW-Images/image.jpg]]

  <img src="TW-Images/image.jpg">

Is there a way to do this? Some magic incantation?

Thanks,
Mark

[PMario]

TW node server is no general purpose file server. So it doesn't serve files.
If you want to serve files from your HD and have access to TW you'd need to add a proxy server in front of TW. eg. nginx
This may be interesting: https://groups.google.com/d/msg/tiddlywiki/z8emI6_oKbw/KLfRhbYCDB8J

have fun!
mario

[Michele Zaffalon]

I use http-server, (because node.js is already installed for TiddlyWiki5) and <img src="http://localhost:8084/image.jpg"/>.

--
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 post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/bf412d79-b1ae-48b8-b5f0-a2a359d86674%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Mark S.]

Hi Michele & Mario,

It's a little hard to understand the excitement about node.js.

Apparently, in order to get images,  I would have to install 2 servers (node & something else) and change all my image links OR I would have to convert all my images into tid files (which would laden the stand-alone TW). This is rapidly moving away from the charming simplicity of the original TW.

What I don't get is that nodejs can serve up images that have been imported into TW. So why can't it be configured to serve up images that are in file sub-directories?

I'm wondering if there's a way that I redirect image links based on a path tiddler. This way I could manage images separately and just change the path when operating from a different platform. Pretty sure Eric had a plugin for something like that on the old TWC. That is, I could set the path tiddler, and all the images would look in a particular directory on the local hard-drive or use a separate server without having to change each and every link every time.

Thanks!
Mark

[PMario]

On Saturday, May 9, 2015 at 7:32:33 PM UTC+2, Mark S. wrote:

I'm wondering if there's a way that I redirect image links based on a path tiddler. This way I could manage images separately and just change the path when operating from a different platform. Pretty sure Eric had a plugin for something like that on the old TWC. That is, I could set the path tiddler, and all the images would look in a particular directory on the local hard-drive or use a separate server without having to change each and every link every time.

If you want file server functionality, you need a file server software. ... That's how the web works. ... You can do what ever you want, to access  files from a server directory. If there isn't a software on the server that is configured to send it to you, you get nothing.

Someone could extend the nodejs server, so it could handle files from subdirectories. .. But imo that doesn't make sense. ... There are existing solutions that are battle tested and are used from hundreds of million sites. ... So it doesn't make sense to reinvent the wheel and introduce security holes.

-mario

[Mark S.]

Rules are always changing.

TW itself violated the first rules of javascript. Remember javascript wasn't ever supposed to be able to write to the file system.

For TW on nodejs to be of practical use (at least to me), it needs to serve up images. This doesn't seem like an unreasonable objective. If nodejs can serve up HTML, why not images? nodejs is already a server or at least acting like one.

Embedded images bloat the TW when it's converted back into a stand-alone TW file. That is why it makes sense to keep them in a separate directory rather than embedding them.

If TW on nodejs was meant to be a text-only system then someone should say so up front. It should be right in there with the nodejs documentation on tiddlywiki.com.

A workaround would be to provide condition-specific image file paths. Then you could use a second server or location to serve up images. Is there a plugin or technique that will change image paths on the fly, so that the base path can be changed depending on platform? (doesn't have to be changed automatically -- can happen manually).

Thanks!
Mark

[Michele Zaffalon]

Hi Mark,

I have asked the same question here and other people are interested in this.
I agree that not having to install a webserver is very convenient and unfortunately my coding skills are not sufficient to add the feature myself. Probably if enough people ask for this feature, it may be added one day or the other.

If TW on nodejs was meant to be a text-only system then someone should say so up front. It should be right in there with the nodejs documentation on tiddlywiki.com.

TW5 on node.js can embed pictures already, so it is not a text-only system.

michele

 

A workaround would be to provide condition-specific image file paths. Then you could use a second server or location to serve up images. Is there a plugin or technique that will change image paths on the fly, so that the base path can be changed depending on platform? (doesn't have to be changed automatically -- can happen manually).

Thanks!
Mark

On Saturday, May 9, 2015 at 3:59:06 PM UTC-7, PMario wrote:

On Saturday, May 9, 2015 at 7:32:33 PM UTC+2, Mark S. wrote:

I'm wondering if there's a way that I redirect image links based on a path tiddler. This way I could manage images separately and just change the path when operating from a different platform. Pretty sure Eric had a plugin for something like that on the old TWC. That is, I could set the path tiddler, and all the images would look in a particular directory on the local hard-drive or use a separate server without having to change each and every link every time.

If you want file server functionality, you need a file server software. ... That's how the web works. ... You can do what ever you want, to access  files from a server directory. If there isn't a software on the server that is configured to send it to you, you get nothing.

Someone could extend the nodejs server, so it could handle files from subdirectories. .. But imo that doesn't make sense. ... There are existing solutions that are battle tested and are used from hundreds of million sites. ... So it doesn't make sense to reinvent the wheel and introduce security holes.

-mario

--

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 post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/4538a2aa-5e5b-46d5-8bd0-0a871853a615%40googlegroups.com.

[Mark S.]

It's effectively a text-only or mostly-text system if you plan to create a stand-alone TW (which is the only way I can see using it as a mobile reference). Images are large, so just a handful will bring your TW to a crawl -- especially on a mobile device. I'm guessing that the upper limits for multi-platform functionality are around 3 Megs on my system. I think the people that are using larger TW's either have more powerful machines or maybe are not typing data into their TW's (cut and paste only). Or their more patient with technology ;-)

One work around would be to commit 100% to node, which I think might be what the developers have done and why they don't see it as an issue. Lazy loading makes embedded images feasible. I suppose there are WSP's out there that will let you run nodejs. But this is a complicated and pricey solution for most people.

Another work around would be to generate external images when exporting a stand-alone version. Then you could take the TW with you. There is mechaism for exporting external images. The problem is, that there doesn't seem to be a reverse mechanism for importing external images as embedded images. Is there?

The last work around, is to create image links that can be "repointed" to different directories or servers just by changing the contents of a tiddler. I'll have to try this and see if it's feasible. There were ways of doing this on TWC.

Thanks!
Mark

On Saturday, May 9, 2015 at 11:48:42 PM UTC-7, Michele Zaffalon wrote:

Hi Mark,

[Mark S.]

Ok, using Michele's idea for http-server running on port 8084, I can define a macro like this:

\define images(image:"Bugs Bunny")
<$macrocall $name="imagepath" image="$image$" path={{imagePath1}} />
\end
\define imagepath(image:"a",path:"b")
[img[$path$$image$]]
\end

Then with tiddler imagePath1 like this:

http://192.168.1.103:8084/TW-Images/

I can insert an image like this

<<images myimage.jpg>>

It serves up on my desktop and local device OK. Presumably I could change the path whenever I needed.

But this would mean changing all my image references to macros. And the _canonical_uri thing doesn't work. What I would prefer is if there was a way to "hook" a macro to the existing image links and insert the path before the image is rendered.

Mark

[Jeremy Ruston]

Just to point out that there is a GitHub issue addressing this point:

https://github.com/Jermolene/TiddlyWiki5/issues/1000

I can understand the frustration that TiddlyWiki doesn't do everything that you want, but would remind you that TiddlyWiki is an ongoing development; it's not finished yet. There's a bunch of features like this that are just blocked by me not having enough time to implement everything I'd like to.

> Another work around would be to generate external images when exporting a stand-alone version

If I'm understanding what you mean, that feature is already implemented. Look at the tw5.com edition: although editing it in the client-server configuration requires embedded images, when we save out the standalone HTML snapshot the big images are externalised.

Best wishes

Jeremy

--
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 post to this group, send email to tiddl...@googlegroups.com.
Visit this group at http://groups.google.com/group/tiddlywiki.

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/c38c95fd-f54f-4b6c-bd41-d363ed009cd5%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

--

Jeremy Ruston
mailto:jeremy...@gmail.com

[Mark S.]

Here Jeremy,

Yes, all the work-arounds I suggested are currently doable. The problem with exporting images is that there isn't a reverse process for importing them (with embedded images) back into node.js.

Is there a known hook or method somewhere in the code that would let you change image links on the fly?


Thanks!
Mark

[Jeremy Ruston]

Hi Mark

Yes, all the work-arounds I suggested are currently doable. The problem with exporting images is that there isn't a reverse process for importing them (with embedded images) back into node.js.

What do you mean by "exporting images"? Are you talking about saving a standalone HTML file with external images, and then reading the potentially modified images back into Node.js?

I'm confused whether you are referring to embedded or external images.

 

Is there a known hook or method somewhere in the code that would let you change image links on the fly? 

Yes, for rendering static HTML. See:

http://tiddlywiki.com/#tv-wikilink-template%20Variable

Best wishes

Jeremy.

 

 

To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/11c64d8a-308d-48c4-9983-05528b8792d8%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[Mark S.]

Yes. I mean the process by which embedded images can be converted into external images. Then TW can then be rendered out of nodejs into a stand-alone TW. That would be good if you were going offline or away from home base. But when you came back, there is no way to take those external images and convert them back into embedded images.

Hmm. I suppose you could delete all the externalized image tiddlers and then drag and drop all the images back into the nodejs file. That would get time-consuming if you had a lot of images and probably lead to orphaned files.

To me embedded files don't really make sense in a file structure where the code is also the database (except for icons and other small adornments). 

What would solve the problems is if there was a way to specify the default base directory for image locations. This would solve problems in the standalone version as well, if you wanted to have your TW reference images on an external drive who's path would vary depending on what machine it was plugged into.

Thanks!
Mark

[Michele Zaffalon]

Thanks for sharing the macro. I use a slightly different one

\define img(img, img_url)
<a href="http://localhost:8084/$img_url$" target="_blank"><img src="http://localhost:8084/$img$"/></a>
\end

because I want to link to the image: the image I display is a scaled-down version of the linked one. Even on the portable edition of TW5, I could never manage to get the right combination of ext and img to do the right thing.
michele

[Peter Merel]

I just hit this issue this evening and I have a better solution I'll be implementing for myself in the morning.

Basically, I run the node server on my local box to be able to edit my tiddlers just as you'd expect. But I back the entire shebang with git and serve it up publicly via github pages. I have to save the wiki by hand and copy into an index.html in my github pages repo, but I'll eventually automate that and right now it's not very onerous.

And ... then I can just commit my images folder as a peer of my index.html tiddlywiki and let github pages serve the images. So long as I use absolute paths in my cannonical_uris to point back to my github pages domain they'll turn up even on my local node server so long as I remember to push them to github before I try to use them ...

Er, perhaps needless to say, a lot of people who'd want to use the node server wouldn't be going to this much trouble. Verily some automation around the github tiddly workflow will come in very handy!