Best way to handle image links.

32 views
Skip to first unread message

Ash Sangoram

unread,
May 14, 2008, 2:32:52 AM5/14/08
to TiddlyWiki
Hey all,
Sorry for this pretty basic question. I have a tiddlywiki hosted on
Tiddlyspot that contains links to its contained images as an absolute
position on my main work computer http://ashvin-imac.stanford.edu/TWLabNotebook/
and I now have moved my image files to a new computer with a new Web
address as I am retiring the old computer. There must be a way to do
a find and replace to replace every call to the old image folder on
the old computer with the new address. The question is what is a good
free HTML editor that runs on the Mac that will do this without
screwing up the tiddlywiki? Any thoughts would be great. Also I was
wondering if I could designate a "relative" folder so that the next
time the images move I wouldn't have to go back and point all the
calls to the images to the new location. I've thought about uploading
my images to photobucket or something like that and then calling the
images from that site on my Wiki... Just wondering how other people
solve this issue when hosting their TWs on Tiddlyspot.
Hope this issue makes sense to you guys. Thanks in advance for your
help.
Ash

Eric Shulman

unread,
May 14, 2008, 3:15:42 AM5/14/08
to TiddlyWiki


On May 13, 11:32 pm, Ash Sangoram <sango...@gmail.com> wrote:
> Hey all,
> Sorry for this pretty basic question. I have a tiddlywiki hosted on
> Tiddlyspot that contains links to its contained images as an absolute
> position on my main work computerhttp://ashvin-imac.stanford.edu/TWLabNotebook/
> and I now have moved my image files to a new computer with a new Web
> address as I am retiring the old computer. There must be a way to do
> a find and replace to replace every call to the old image folder on
> the old computer with the new address. The question is what is a good
> free HTML editor that runs on the Mac that will do this without
> screwing up the tiddlywiki?

You can use any *plain text* editor to open your TW document and
perform a global search-and-replace.

> wondering if I could designate a "relative" folder so that the next
> time the images move I wouldn't have to go back and point all the
> calls to the images to the new location. I've thought about uploading
> my images to photobucket or something like that and then calling the
> images from that site on my Wiki...

Give this a try:
http://www.TiddlyTools.com/#ImagePathPlugin

First, change all your image references to be *relative* to the
current directory by removing the server and path portion of the image
references, so that:
[img[http://ashvin-imac.stanford.edu/TWLabNotebook/someimage.jpg]]
becomes simply:
[img[someimage.jpg]]

Then, create a tiddler called [[ImagePathList]], that defines one or
more alternative file paths that are listed one per line, like this:
-------------
http://ashvin-imac.stanford.edu/TWLabNotebook/
-------------

The paths defined in [[ImagePathList]] can be either relative (e.g.,
"images/") or absolute (e.g., "http://www.someserver.com/~username/
images/"). The plugin operates by extending the core's parsing of the
[img[...]] syntax so that each path in the list is combined with the
indicated image filename and tested for existence until the file is
located. Of course, when the document if being viewed on-line, it
isn't possible to perform a local file test, so the first alternative
in the ImagePathList is always applied.

For example, using "[img[someimage.jpg]]" and the above sample
[[ImagePathList]], the plugin will simply display:
http://ashvin-imac.stanford.edu/TWLabNotebook/someimage.jpg

Once you have set this up, it is trivial to move your images to a
different location and then update the definition in ImagePathList to
point to that new location.

enjoy,
-e

Ash Sangoram

unread,
May 14, 2008, 7:37:39 PM5/14/08
to TiddlyWiki
Thanks that was informative... I was trying to implement your
solution and I realized that I am making image calls in html:

<html><a><img src="http://ashvin-imac.stanford.edu/TWLabNotebook/
051208AG002.jpg" width="240" height="160" /></a></html>

Will ImagePathPlugin work in this case or do I have to use the
TiddlyWiki call of
[img[]] to have it translate? I tried to do the global find and
replace as you suggested and set up the ImagePathPlugin as you
recommended but I am not getting images rendered.
I could go case by case and restructure the image calls if there isn't
an easy fix.


Thanks much for your earlier quick response!
Ash
> -------------http://ashvin-imac.stanford.edu/TWLabNotebook/

Eric Shulman

unread,
May 14, 2008, 8:12:04 PM5/14/08
to TiddlyWiki
> <html><a><img src="http://ashvin-imac.stanford.edu/TWLabNotebook/
> 051208AG002.jpg" width="240" height="160" /></a></html>
> Will ImagePathPlugin work in this case or do I have to use the
> TiddlyWiki call of [img[]] to have it translate?

ImagePathPlugin works by extending the TW [img[...]] syntax. Thus, it
cannot work with images rendered via HTML syntax. You would have to
switch to using TW syntax for ImagePathPlugin to take effect.
However, based on the above HTML example, it appears that the only
reason you are using HTML in the first place is to be able to specify
the width/height of the image.

Fortunately, you *can* switch to using TW image syntax and still set
the image size by installing:
http://www.TiddlyTools.com/#ImageSizePlugin
which extends the [img[...]] syntax to support [img(x,y)[...]], where
"x" and "y" are any CSS-based dimensions you want. You can also
combine this with ImagePathPlugin to handle the path resolution, so
you can then write:
[img(240px,160px)[051208AG002.jpg]]
to display the remotely-stored image with the desired width/height.

enjoy,
-e

Ash Sangoram

unread,
May 14, 2008, 8:52:45 PM5/14/08
to TiddlyWiki
Awesome! thank you thank you... (It is exactly the issue of image
sizing that kept me from using the original TW image syntax) I will
give it a try but it makes sense that this should work fine. Will keep
you posted.
Gratefully,
Ash

Ash Sangoram

unread,
May 14, 2008, 9:18:09 PM5/14/08
to TiddlyWiki
I just realized that this is not going to be easy to find and
replace... In plain text the syntax is not so comprehensible (to me)
to know what to replace the html syntax with TW syntax and get it to
render right. I have about 96 calls in all so I can probably do this
best manually by going to each tiddler that have an image call and
then redoing the syntax. (unless you have some other magic up you
sleeve to accomplish the switch in a more streamlined fashion?)

Robert Pollard

unread,
May 15, 2008, 10:48:11 AM5/15/08
to Tiddl...@googlegroups.com
Converting the html syntax to TW's enhanced image syntax would be a very simple process that could be accomplished in minutes using a macro in WordPerfect 5.1+

Robert

Simon Baird

unread,
May 15, 2008, 6:52:49 PM5/15/08
to Tiddl...@googlegroups.com
On Fri, May 16, 2008 at 12:48 AM, Robert Pollard <ecolo...@gmail.com> wrote:
...using a macro in WordPerfect 5.1+

!

--
simon...@gmail.com

Morris Gray

unread,
May 15, 2008, 9:54:20 PM5/15/08
to TiddlyWiki
On May 16, 8:52 am, "Simon Baird" <simon.ba...@gmail.com> wrote:

> > ...using a macro in WordPerfect 5.1+
>
> !

Don't knock it; some things are forever green. If it wasn't for Word
Perfect we wouldn't have Ctrl-C :-)

Morris

On May 16, 8:52 am, "Simon Baird" <simon.ba...@gmail.com> wrote:
> On Fri, May 16, 2008 at 12:48 AM, Robert Pollard <ecology2...@gmail.com>
> wrote:
>
> > ...using a macro in WordPerfect 5.1+
>
> !
>
> --
> simon.ba...@gmail.com

Daniel Baird

unread,
May 19, 2008, 4:40:16 PM5/19/08
to Tiddl...@googlegroups.com
On Fri, May 16, 2008 at 11:54 AM, Morris Gray <msg...@symbex.net.au> wrote:
> On May 16, 8:52 am, "Simon Baird" <simon.ba...@gmail.com> wrote:
>> > ...using a macro in WordPerfect 5.1+

Don't forget, crazy vi users are still making claims like that :)

--
Daniel Baird
/to be or not to be/ => /(2b|[^2]b)/ => /(2|[^2])b/ => /.b/
...optimise your regexes, people!

Reply all
Reply to author
Forward
0 new messages