image: thumb + popup?

84 views
Skip to first unread message

RA

unread,
May 8, 2009, 5:25:36 PM5/8/09
to TiddlyWiki
I would like to show a scaled-down version of an image that upon
clicking on it opens the full size version in a popup window (sized to
fit the image). How do I do that? ( I have the image attached using
AttachFilePlugin. )

Thanks

R

wolfgang

unread,
May 8, 2009, 5:52:57 PM5/8/09
to TiddlyWiki
Hi Ra,
One way is the use of PopupPreviewPlugin, with which you can 'shift' +
'click' on a smaller image with a link to the full-scale version for
that to open in a popup window.

http://www.tiddlytools.com/#PopupPreviewPlugin

regards..

RA

unread,
May 8, 2009, 7:59:27 PM5/8/09
to TiddlyWiki
> One way is the use of PopupPreviewPlugin

I'm thinking there must be another way - I just couldn't find any
mention of how to define a popup link in TW.

thanks
-- R

Eric Shulman

unread,
May 8, 2009, 8:50:55 PM5/8/09
to TiddlyWiki
You might want to try
http://www.TiddlyTools.com/#ImageSizePlugin

Syntax:
[img(width,height)[imagename]]

When an image is resized, SHIFT-click displays full-size image, CTRL-
click restores initial (scaled) size

Examples:
[img(10em,auto)[foobar.jpg]]
[img(10em,auto)[SomeAttachedImage]]

enjoy,
-e

wolfgang

unread,
May 9, 2009, 5:14:17 AM5/9/09
to TiddlyWiki
> > One way is the use of PopupPreviewPlugin
>
> I'm thinking there must be another way - I just couldn't find any
> mention of how to define a popup link in TW.
>

> You might want to try
> http://www.TiddlyTools.com/#ImageSizePlugin
>

A third way could be the combined use of ShowPopup and SetIconPlugin,
both of TiddlyTools too. Untested though.

http://www.tiddlytools.com/#ShowPopup
http://www.tiddlytools.com/#SetIconPlugin


Finally - what would seem to make most sense - is to forget about
popups and use light boxes instead:

http://tw.lewcid.org/#TiddlyLightBoxDocs

regards..

Måns

unread,
May 9, 2009, 5:42:45 AM5/9/09
to TiddlyWiki
Hi Wolfgang, RA and Eric

If I would want to use TiddlyLightBoxPlugin from a TW on
tiddlyspot.com - what is the best way to get the image needed for
loading the lightboxcontainer (indicator.gif) "with me"?

Do I rewrite the plugin to point at the imagefile on my own ftp-server
-or-
can I use some kind of "attach-file" plugin, to make tiddlyspot.com
host the picture..
-or-
Is there a way to encode this image into the TW- itself?

YS Måns Mårtensson

On May 9, 11:14 am, wolfgang <wolfgangl...@gmail.com> wrote:
> > > One way is the use of PopupPreviewPlugin
>
> > I'm thinking there must be another way - I just couldn't find any
> > mention of how to define a popup link in TW.
>
> > You might want to try
> >    http://www.TiddlyTools.com/#ImageSizePlugin
>
> A third way could be the combined use of ShowPopup and SetIconPlugin,
> both of TiddlyTools too. Untested though.
>
> http://www.tiddlytools.com/#ShowPopuphttp://www.tiddlytools.com/#SetIconPlugin

wolfgang

unread,
May 9, 2009, 6:09:36 AM5/9/09
to TiddlyWiki
> If I would want to use TiddlyLightBoxPlugin from a TW on
> tiddlyspot.com - what is the best way to get the image needed for
> loading the lightboxcontainer (indicator.gif) "with me"?
>
> Do I rewrite the plugin to point at the imagefile on my own ftp-server
> -or-
> can I use some kind of "attach-file" plugin, to make tiddlyspot.com
> host the picture..
> -or-
> Is there a way to encode this image into the TW- itself?

Haven't tried it that way. Though I think you would have to try and
rewrite the TiddlyLightBoxPlugin to point to the new location of
indicator.gif in either case. On the side: I don't consider the use of
indicator.gif really that substantial. Also the developer of
DC3.LightBox didn't used one:

http://solo.dc3.com/tw/index.html#%5B%5BDC3.LightBox%20Examples%5D%5D

Måns

unread,
May 9, 2009, 6:23:33 AM5/9/09
to TiddlyWiki
Ok - I'll try without any modification first. Thanks for guidance
Wolfgang.

YS Måns Mårtensson

wolfgang

unread,
May 24, 2009, 9:31:45 AM5/24/09
to TiddlyWiki
> > > One way is the use of PopupPreviewPlugin
>
> > I'm thinking there must be another way - I just couldn't find any
> > mention of how to define a popup link in TW.
>
> > You might want to try
> > http://www.TiddlyTools.com/#ImageSizePlugin
>
> A third way could be the combined use of ShowPopup and SetIconPlugin,
> both of TiddlyTools too. Untested though.
>
> http://www.tiddlytools.com/#ShowPopuphttp://www.tiddlytools.com/#SetIconPlugin
>
> Finally - what would seem to make most sense - is to forget about
> popups and use light boxes instead:
>
> http://tw.lewcid.org/#TiddlyLightBoxDocs
>

Also the lightweight RolloverPlugin would be a further option to
display a full scale image upon hovering over a thumbnail:

http://www.cc.gatech.edu/~dellaert/dhtml/tiddly.html

Though it's already old in terms of TiddlyWiki Plugins, it still works
as I just saw in the latest TW of Elise Springer:

https://wesfiles.wesleyan.edu/home/espringer/web/#%5B%5Bresearch%20project%5D%5D

Eric Shulman

unread,
May 24, 2009, 1:46:48 PM5/24/09
to TiddlyWiki
> Also the lightweight RolloverPlugin would be a further option to
> display a full scale image upon hovering over a thumbnail:

Try this new 'pure HTML' tiddler:
http://www.TiddlyTools.com/#ThumbThing

Usage:
<<tiddler ThumbThing with: image thumbWidth thumbHeight fullWidth
fullHeight>>
Where:
'image' is a local path/file or a remote URL reference to a GIF, JPG,
or PNG file
thumbWidth, thumbHeight, fullWidth, fullHeight are CSS measurements
Notes:
* omit fullWidth/fullHeight for full-sized popup image
* use 'auto' for default image height and/or width
* for proportional scaling, specify only width OR height and use
'auto' for other dimension

enjoy,
-e

lerone

unread,
May 24, 2009, 5:23:34 PM5/24/09
to TiddlyWiki
hey,

great, looks just like what I was looking for also!

– unfortunately the tidler where I insert the <<tiddler ThumbThing
with: image thumbWidth thumbHeight fullWidth fullHeight>> nothing
appears.
anything I could check? (I had a similar proble with the great
similarTiddlers-plugin; maybe there is something fundamental I should
check to be able to insert these "<<...>>"-functions?!)

thanks already

Måns

unread,
May 24, 2009, 5:32:38 PM5/24/09
to TiddlyWiki
Hi

Same problem here -
I tried: <<tiddler ThumbThing with: http://www.unamesa.org/images/header.png
100px>> - no luck
I also tried:
<<tiddler ThumbThing with: [[%0]] image@here 100px>> for a tiddler
with a field named image... - no luck either..

YS Måns Mårtensson

wolfgang

unread,
May 24, 2009, 6:03:33 PM5/24/09
to TiddlyWiki
> > Also the lightweight RolloverPlugin would be a further option to
> > display a full scale image upon hovering over a thumbnail:
>
> Try this new 'pure HTML' tiddler:
> http://www.TiddlyTools.com/#ThumbThing
>

Great work, Eric! And even more 'light' with no dependencies. For a
non-developer this appears all like magic.

> – unfortunately the tidler where I insert the <<tiddler ThumbThing
> with: image thumbWidth thumbHeight fullWidth fullHeight>> nothing
> appears.
> Same problem here -
> I tried: <<tiddler ThumbThing with:http://www.unamesa.org/images/header.png
> 100px>> - no luck

I tested it with the online TW of Eric itself, by entering the
following in a new tiddler there:

<<tiddler ThumbThing with: images/fish.jpg 3em 4em fullWidth
fullHeight>>
<<tiddler ThumbThing with: images/sunset.jpg 4em 3em fullWidth
fullHeight>>

And I was truly amazed.

regards..

Måns

unread,
May 24, 2009, 7:44:18 PM5/24/09
to TiddlyWiki
Hmm

I tried this online and from a local file: <<tiddler ThumbThing
with:http://www.tiddlytools.com/images/fish.jpg 3em 4em fullWidth
fullHeight>>
- It didn't work.
However I made it work on Erics own tiddlytools website - by making a
new tiddler and writing: <<tiddler ThumbThing with: images/fish.jpg
3em 4em fullWidth fullHeight>> .

I've tried with several other paths - both locally and on the net -
heres my TW and the tiddler in which I've tried to do it:
http://gdsskole.tiddlyspot.com/index.html#MM (click "redigér") or edit
where it says "Besked" underneath the picture - to se the code...

The html "ThumbThing" is here: http://gdsskole.tiddlyspot.com/index.html#ThumbThing
...

YS Måns Mårtensson

Eric Shulman

unread,
May 24, 2009, 8:53:27 PM5/24/09
to TiddlyWiki
> I tried: <<tiddler ThumbThing with:http://www.unamesa.org/images/header.png
> 100px>> - no luck

When entering macro parameters that start with "http:" you need to
enclose it within [[...]]. Otherwise, TW will interpret the leading
http: as a parameter 'name', resulting in a param named "http" with a
value of "//www.unamesa.org/images/header.png". Thus:

<<tiddler ThumbThing with:
[[http://www.unamesa.org/images/header.png]] 100px>>

and, to use an image URL stored in a field, you will need to use the
<<wikify>> macro [1] to insert the value into the appropriate place,
like this:

<<wikify {{'\<\<tiddler ThumbThing with: [[%0]] 100px\>\>'}}
image@here>>

enjoy,
-e

[1] http://www.TiddlyTools.com/#WikifyPlugin

Eric Shulman

unread,
May 24, 2009, 9:05:07 PM5/24/09
to TiddlyWiki
> I tried this online and from a local file: <<tiddler ThumbThing
> with: http://www.tiddlytools.com/images/fish.jpg3em 4em fullWidth
> fullHeight>>

Though I realize you are only testing, please **do NOT create 'deep-
links' to image files stored on TiddlyTools.com**. This is considered
extremely rude.

Also, do *not* take copies of TiddlyTools background images
(sunset.jpg, fish.jpg, mountains.jpg, etc.). They are my original,
*copyrighted* photos and have not being distributed as open source or
placed in the public domain.

Thanks,
-e

Måns

unread,
May 25, 2009, 3:19:53 AM5/25/09
to TiddlyWiki
Sorry Eric

I wouldn't do that - normally - (I have my own ftp's for that). - And
I wouldn't copy your pictures to my ftp either.
The only reason was to test if - what worked on your website (the
actual image) would work on my TW.
I've changed it to <<tiddler ThumbThing with: http://www.unamesa.org/images/header.png
3em 4em fullWidth fullHeight>>
But still I can't make the ThumbThing work :-(

Regards Måns Mårtensson

On May 25, 3:05 am, Eric Shulman <elsdes...@gmail.com> wrote:
> > I tried this online and from a local file: <<tiddler ThumbThing
> > with:http://www.tiddlytools.com/images/fish.jpg3em4em fullWidth

wolfgang

unread,
May 25, 2009, 3:39:32 AM5/25/09
to TiddlyWiki

> I've changed it to <<tiddler ThumbThing with:http://www.unamesa.org/images/header.png
> 3em 4em fullWidth fullHeight>>
> But still I can't make the ThumbThing work :-(
>

Note the escaping with double brackets:

> Thus:
>
> <<tiddler ThumbThing with:
> [[http://www.unamesa.org/images/header.png]] 100px>>
>

regards..

Eric Shulman

unread,
May 25, 2009, 6:41:20 AM5/25/09
to TiddlyWiki
> I wouldn't do that - normally - (I have my own ftp's for that). - And
> I wouldn't copy your pictures to my ftp either.
> The only reason was to test

Mans,

No worries! Although I was replying to your post, the note about not
copying the background images was intended as a general message for
the whole group and it was not meant to suggest that you had actually
done so.

> I've changed it to ... But still I can't make the ThumbThing work :-(

As previously noted, you must put the URL inside [[...]] or the core's
macro processor doesn't handle it properly.

-e

Måns

unread,
May 25, 2009, 7:21:37 AM5/25/09
to TiddlyWiki
Thanks Eric - now it works as a charm!!! - It's very nice indeed!
And thankyou for showing how to do it with a fieldvalue as well - it's
very usefull as it is - but I wonder if I could put it directly into
the viewtemplate as well?!
Something like this: <span macro='wikify {{'\<\<tiddler ThumbThing
with: [[%0]] 100px\>\>'}} image@her'></pan> ??

YS Måns Mårtensson

Eric Shulman

unread,
May 25, 2009, 7:35:25 AM5/25/09
to TiddlyWiki
> I wonder if I could put it directly into the viewtemplate as well?!
> Something like this: <span macro='wikify {{'\<\<tiddler ThumbThing
> with: [[%0]] 100px\>\>'}} image@her'></pan> ??

Actually, because of the syntax used in the template definition, the
wikify macro param is even simpler, as the << and >> sequences can be
directly embedded in the param value, without conflicting with any
surrounding syntax.

<span macro='wikify "<<tiddler ThumbThing with: [[%0]] 100px>>"
image@here'></span>

enjoy,
-e

Måns

unread,
May 25, 2009, 7:36:20 AM5/25/09
to TiddlyWiki
Sometimes the popup picture is rendered with a horisontal scrollbar -
even if the picture is much smaller than the actual tiddler - how
come? - Can I somehow omit that behaviour?

YS Måns Mårtensson

wolfgang

unread,
May 26, 2009, 7:59:49 PM5/26/09
to TiddlyWiki
> > Also the lightweight RolloverPlugin would be a further option to
> > display a full scale image upon hovering over a thumbnail:
>
> Try this new 'pure HTML' tiddler:
> http://www.TiddlyTools.com/#ThumbThing
>
> Usage:
> <<tiddler ThumbThing with: image thumbWidth thumbHeight fullWidth
> fullHeight>>

How about a html ThumbThing for text? - Opening a popup with tiddler
content by hovering above a link?

Possible?

regards..

Eric Shulman

unread,
May 26, 2009, 8:33:07 PM5/26/09
to TiddlyWiki
> How about a html ThumbThing for text? - Opening a popup with tiddler
> content by hovering above a link?

You can achieve this with just a slight tweak to
http://www.TiddlyTools.com/#ShowPopup
by changing
onclick="..."
to
onmouseover="..."

enjoy,
-e


wolfgang

unread,
May 27, 2009, 4:09:37 AM5/27/09
to TiddlyWiki
> You can achieve this with just a slight tweak to
> http://www.TiddlyTools.com/#ShowPopup
> by changing
> onclick="..."
> to
> onmouseover="..."
>
> enjoy,
> -e

>
> Possible?
>

I would have lost my bet.. thanks again.

regards..


http://menuflex.tiddlyspot.com/#MainMenu

Corey S

unread,
May 27, 2009, 4:42:36 AM5/27/09
to TiddlyWiki
I would like to know how to use the TiddlyLightBoxDocs (http://
tw.lewcid.org/#TiddlyLightBoxDocs) and the ImageSizePlugin (http://
www.tiddlytools.com/#ImageSizePlugin.)
I don't want to create a thumb for each image. I don't know enough
about CSS or javascript to do any serious modifications.
Can I combine the two or is there a different plugin /other
combination that I need to do this?

This is the ImageSizePlugin syntax that I'm using:
[img(150px+,auto)[Beta by itself|Model design/Mecha/
BoxArtBetaBomber_bc9.jpg]]

The text version works really well:
[[Beta|Model design/Mecha/BoxArtBetaBomber_bc9.jpg]]<<imagebox>>

Something like AllThumbs or ThumbThing?? Just guessing.

Måns

unread,
May 27, 2009, 2:50:42 PM5/27/09
to TiddlyWiki
Hi Wolfgang

I like your MenuFlex very much indeed!!
There is a lot of customization going on - and I can't really adapt it
as it is. (lack of braincells I fear..)
Would you mind sharing it when you have finished setting it up?
Maybe even with some hints on how to implement your menus to an
original TW??
That would be GREAT..
Nice and very impressive TW you have made so far!

Regards Måns Mårtensson

wolfgang

unread,
May 27, 2009, 4:42:28 PM5/27/09
to TiddlyWiki
Thanks for the feedback, Mans. I'm really impressed myself what could
be done with html scripts alone - without any plugins - by starting
out to get MenuMore in a shape to make it more user friendly. Because
every time I wanted to implement it in a new TiddlyWiki I had to
struggle again. And often what almost drove me crasy was only.. one
single dot. :-(

> Would you mind sharing it when you have finished setting it up?
> Maybe even with some hints on how to implement your menus to an
> original TW??


It's pretty ready for importing a vanilla MenuMore in a blaink
TiddlyWiki, therefore I just sum it up here (well, except the
TiddlySpot plugins, tiddlers for MenuMore theme and three html
scripts, it actually is a blank TW):

∇ TopMenu

use this to add, delete or replace top menu items and their links to
tiddlers supposed to open in the tiddler area on a click. At the same
time it invokes the menu you wish to open in the main menu (note: the
menu item itself is defined in the PageTemplate).
I changed Ocat's original implementation by adding tiddler
transclusion at the beginning of the tiddler, so only the TiddlerName
and label have to be changed in the existing parameters, and the out
commenting (ie. /% %/) adapted to ones need.

For changing whether one wishes all already opened tiddlers closed at
the same time of an click one has to make adaptations in the tiddler
area commented out (by the adjustments Eric just explained in this
threat:
http://groups.google.com/group/TiddlyWiki/browse_thread/thread/8c6a054bc5e83f85/1d98c28f51d44628?lnk=gst&q=menumore%23#1d98c28f51d44628
I left the example for not having other tiddlers closed, the answer is
in above thread by Eric, and you'll find them in the last lines of the
items with the heading !C and !D. They invoke a tiddler without
closing already opened, and to leave the tiddler area with a MainMenu
change respectively.

∇ PageTemplate

this is the place to indicate the menus opening in the main menu area.
All you need to do is to replace the name you want to be invoked with
a top menu click, and which tiddler you would want to open in edit
mode with a click on the menus background (ie the menu itself)
Here I used StyleSheet transclusion - which works differently to
tiddler transclusion by simply using a forced link - so if you opened
the PageTemplate you have to proceed to the TemplateBody tiddler to
make the explained changes. For changing the Header gradient do it in
the TemplateHeader. You also need to import this two additional
tiddlers, TemplateBody and TemplateHeader, or paste it into the main
PageTemplate tiddler at the place and replacing their links.

∇ StyleSheet

this defines many styles, also some which aren't necessary for
ManuMore alone. Since it's not that big just don't bother and import
it as a whole.

∇ SwitchMenu

this is an optional item, for additionally switching the MainMenu off.
I found it on Paolo Soares site, but there it has been replaced with
Eric's inline script since now.

∇ SwitchBar

Optional as above. But this time to open the by default closed right
sidebar.

∇ Footer

Notice of original coders and locations.

∇ Home

A home button, closing all open tiddler and reverting to the default
tiddlers without a menu change, optional.


If you also want to use a second mode, with a completely different
TopMenu and main menus again (which is but a PageTemplate switch only,
to invoke the other PageTemplate indicating the second TopMenu) -
import also the following:

∇ TopMenu2

∇ PageTemplate2

For the popup on hover you need:

PopUp, which is really ShowPopup by Erik but adapted to open popups on
hover..


Which brings me to a new questions: :-)

1) As it is, a popup opens below and at the first letter of a popup
link. How do I change the css to have it open to the left of it?

2) Also I haven't found out where I lost the original behavior of
MenuMore to start up with an opened MainMenu. Any help with this, or a
different solution would be highly appreciated.

3) How do I trim the search box, so it can be placed into the TopMenu
without widening it?

4) I'm grateful for any other suggestion, other css tweaks or html
scripts worth the inclusion...

regards..


PS: There are NO OTHER DEPENDENCIES, or the need for a special tag.

wolfgang

unread,
May 28, 2009, 10:59:09 AM5/28/09
to TiddlyWiki
wolfgang:
> > > I tested it with the online TW of Eric itself, by entering the
> > > following in a new tiddler there:
> > >

Mans:
> > I tried this online and from a local file: <<tiddler ThumbThing
> > with:http://www.tiddlytools.com/images/fish.jpg3em4em fullWidth
> > fullHeight>>
>

Eric:
> Though I realize you are only testing, please **do NOT create 'deep-
> links' to image files stored on TiddlyTools.com**. This is considered
> extremely rude.
>

> Mans,
>
> No worries! Although I was replying to your post, the note about not
> copying the background images was intended as a general message for
> the whole group and it was not meant to suggest that you had actually
> done so.
>

Just realized that with the newest version of TiddlyTool the edit
button is hidden when viewed online and in edit mode. Therefore I
suspect that you actually also felt offended by my initial testing of
this new script at your side online, though without deep linking:

<<tiddler ThumbThing with: images/fish.jpg 3em 4em fullWidth
fullHeight>>

If that is the case, I feel sorry for and apologize, this wasn't my
intent at all.


Now again, I wanted to see if a combination of ImageMapPlugin with
either the ThumbThing script or ImageSizePlugin would work, when I
found that the edit button disappeared. Though you only speak about:

> Though I realize you are only testing, please **do NOT create 'deep-
> links' to image files stored on TiddlyTools.com**.

> Also, do *not* take copies of TiddlyTools background images
> (sunset.jpg, fish.jpg, mountains.jpg, etc.).

And maybe I read too much into this, but now I really feel insecure if
a download of images/california.gif, to make such a test possible now
on my drive - you seemingly didn't liked me doing online - is
something you also wouldn't want me to do? The obvious reason for such
kinds of initial testing is trying not to waste time on something
which might not work in the end.

Sorry again, and I hope you are feeling fine.

regards..

Eric Shulman

unread,
May 28, 2009, 12:14:33 PM5/28/09
to TiddlyWiki
> suspect that you actually also felt offended by my initial testing of
> this new script at your side online, though without deep linking:

In this particular case, what you did was perfectly fine: your quick
online test was temporary, and couldn't be saved back to the server,
so it couldn't spread to others in any way. Also, it didn't contain
any absolute references to http://www.TiddlyTools.com, so no
persistent deep-linking would occur, even if the tiddler were to
somehow be copied by others.

> And maybe I read too much into this, but now I really feel insecure if
> a download of images/california.gif,

I realize that it can be confusing as to which things are OK to copy
and which aren't. In general, it's my intent to allow people to make
*local* copies of most of the images used on TiddlyTools.com,
including california.gif (which is actually just a slightly modified
version of a publicly available image).

However, there are a few notable exceptions... specifically, you
shouldn't copy the *photographic* image files that I've used as
backgrounds for various TiddlyTools Themes: sunset.jpg (Edge of
Night), fish.jpg (Let's Get Tanked!), ocean.jpg (Surf's Up), as well
as any other photo images (e.g., meow2.jpg, JR+ELS.jpg, etc.) that may
be displayed within tiddler content. These images are part of my
creative portfolio and should only be duplicated after requesting
explicit permission on a case-by-case basis.

In addition, the ELS Design Studios logo (i4logo.gif) is, obviously, a
professional servicemark, as explained in the "trademarks/
servicemarks" section here:
http://www.TiddlyTools.com/#LegalStatements

> to make such a test possible now on my drive

For the limited purposes of testing and evaluation, it is sometimes
useful to *temporarily* make a local copy of an image file that should
not, in other circumstances, be copied without specific permission.
In general, this is acceptable, as long as the local copy is
completely removed after testing is completed, and the file is not
replicated, passed along to others, or published online.

> Sorry again, and I hope you are feeling fine.

Although I greatly appreciate your taking a serious view of this
issue, there was never any 'offense' taken.... so no apology is really
needed. In fact, perhaps *I* should apologize to you for causing
undue concern about your completely reasonable and proper testing
activities.

enjoy,
-e
Eric Shulman
TiddlyTools / ELS Design Studios

wolfgang

unread,
May 30, 2009, 9:29:09 AM5/30/09
to TiddlyWiki
Hi Eric,

> > Sorry again, and I hope you are feeling fine.
>
> Although I greatly appreciate your taking a serious view of this
> issue, there was never any 'offense' taken.... so no apology is really
> needed.

thanks for the detailed clarification. And I'm glad I was mistaken.


> > to make such a test possible now on my drive
>
> For the limited purposes of testing and evaluation, it is sometimes
> useful to *temporarily* make a local copy of an image file that should
> not, in other circumstances, be copied without specific permission.
> In general, this is acceptable, as long as the local copy is
> completely removed after testing is completed, and the file is not
> replicated, passed along to others, or published online.
>

>
> Now again, I wanted to see if a combination of ImageMapPlugin with
> either the ThumbThing script or ImageSizePlugin would work, when I
> found that the edit button disappeared.

Did this test on my drive, but it didn't worked.

regards..

wolfgang

unread,
May 31, 2009, 12:47:23 AM5/31/09
to TiddlyWiki
Hi Eric,

> > You can achieve this with just a slight tweak to
> > http://www.TiddlyTools.com/#ShowPopup
> > by changing
> > onclick="..."
> > to
> > onmouseover="..."
>
> > enjoy,
> > -e


This brings up the question if popups in general, and onmouseover in
particular, are rendered immediately on first display of the menu, as
it is with the core slider macro - or if they are only rendered once
there is a onclick or onmousover event?

Eric Shulman

unread,
May 31, 2009, 1:24:49 AM5/31/09
to TiddlyWiki
> This brings up the question if popups in general, and onmouseover in
> particular, are rendered immediately on first display of the menu, as
> it is with the core slider macro - or if they are only rendered once
> there is a onclick or onmousover event?

Popup contents are rendered every time an onclick (or onmouseover)
event is triggered. When the popup disappears, it's contents are
removed as well, and will be re-rendered the next time the popup is
shown.

-e

wolfgang

unread,
May 31, 2009, 7:42:27 PM5/31/09
to TiddlyWiki
> Popup contents are rendered every time an onclick (or onmouseover)
> event is triggered. When the popup disappears, it's contents are
> removed as well, and will be re-rendered the next time the popup is
> shown.
>
> -e

Thanks Eric for the good news.

Now I only have to figure out how to open them to the left of the
button, for not covering the buttons below in vertical menus.

> > There is a lot of customization going on - and I can't really adapt it
> > as it is.
> > Would you mind sharing it when you have finished setting it up?
> > Maybe even with some hints on how to implement your menus to an
> > original TW??
>
> It's pretty ready for importing a vanilla MenuMore in a blaink
> TiddlyWiki, therefore I just sum it up here (well, except the
> TiddlySpot plugins, tiddlers for MenuMore theme and three html
> scripts, it actually is a blank TW):
>
> ∇ TopMenu
>

Made some more changes, like Renaming TopMenu to SiteMenu where I make
heavy use of transclusions. Like externalizing the whole original
MenuMore TopMenu to a [[Menu]] tiddler and adding step by step
instructions for adapting the MainMenu switching functions to specific
needs.

http://menuflex.tiddlyspot.com/

regards..

Eric Shulman

unread,
May 31, 2009, 8:34:54 PM5/31/09
to TiddlyWiki
> Now I only have to figure out how to open them to the left of the
> button, for not covering the buttons below in vertical menus.

you can tweak ShowPopup... replace:
Popup.show(p,false);
with:
Popup.show('top','right');

enjoy,
-e

wolfgang

unread,
May 31, 2009, 11:28:40 PM5/31/09
to TiddlyWiki
> you can tweak ShowPopup... replace:
> Popup.show(p,false);
> with:
> Popup.show('top','right');
>
> enjoy,
> -e

Your ability and helpfulness is so great!

See the result here:

http://menuflex.tiddlyspot.com/

regards..

TonyM

unread,
Jun 1, 2009, 2:36:53 AM6/1/09
to TiddlyWiki

Thanks for this thread,

The Image links, size and thumbthing are great tools for including
images. The idea of a filename for an image in a field name is also
great as you can present the image in a tiddler generated from a
template, or content template.

However as a keen photographer I have many (7,000+) photos from my
most recent trip and have been searching for a way to select photos
from windows and populate a new tiddler with a link to that photo. I
can then view, review, tag and notate each photo. It is then trivial
to code links to the original, to open them in an editor, to delete
them etc...

If there an easy way to do this ?

On idea would be to have a file chooser that populates a field, or a
form in which one can paste a folder/file reference and generate a
tiddler with the image reference(s) in a field. Pasting multiple
filenames at once would be even better; eg;
C:\My Pictures\DCIM\338CANON\IMG_3901.JPG
C:\My Pictures\DCIM\339CANON\IMG_3902.JPG
C:\My Pictures\DCIM\340CANON\IMG_3903.JPG

Even better would be a field with the path, and a field with the
filename, the tiddler can then be named filename, or filename (1)
etc...

Thanks in advance
Tony

wolfgang

unread,
Jun 1, 2009, 7:55:10 AM6/1/09
to TiddlyWiki
One riddle solved, other riddles raising their heady:

Why nestling Popups with a modified version of ShowPopup doesn't seem
to work beyond one level?

As in this example:

file:///C:/DOKUME~1/Wolfgang/Desktop/menuflex.html#MenuFlex

regards..

wolfgang

unread,
Jun 1, 2009, 7:57:38 AM6/1/09
to TiddlyWiki
Sorry, here's correct link:

http://menuflex.tiddlyspot.com/#MenuFlex

wolfgang

unread,
Jun 1, 2009, 10:58:25 AM6/1/09
to TiddlyWiki
> One riddle solved, other riddles raising their heady:
>
> Why nestling Popups with a modified version of ShowPopup doesn't seem
> to work beyond one level?
>


found the solution by creating as many instances of my adapted version
of ShowPopup as sub levels needed.

Remains only to find a way to automate the making of TagTrees.

http://menuflex.tiddlyspot.com/#MenuFlex%20PopRight

regards..

pat toche

unread,
Jun 1, 2009, 3:46:59 PM6/1/09
to TiddlyWiki
I hope I'm not hijacking this thread ... I just want to say that this
discussion has made me discover ThumbThing and it works great. Thanks
Eric.

Just out of curiosity I changed onclick by onmouseover in ThumbThing,
following Eric's advice re ShowPopup, but that didn't work. Perhaps I
did something wrong or perhaps ThumbThing and ShowPopup are different
animals...

Thanks to all for sharing all these insights. Ever so grateful.

wolfgang

unread,
Jun 4, 2009, 3:25:52 PM6/4/09
to TiddlyWiki
> > One riddle solved, other riddles raising their heady:
> ..
>
> Remains only to find a way to automate the making of TagTrees.
>

http://menuflex.tiddlyspot.com/#MenuFlex%20PopRight

Was only able to create a template for the deepest level of a nested
Popup like this:

[[$1]] <<tagging $1>>

Is there any way for a template to open on upper/tag levels further
transcluded popups and for tiddler levels the tagging macro
automatically within the same popup?

Any suggestions?



wolfgang

unread,
Jun 20, 2009, 10:34:58 AM6/20/09
to TiddlyWiki
> you can tweak ShowPopup... replace:
> Popup.show(p,false);
> with:
> Popup.show('top','right');
>

With IE this doesn't seem to work. Is there a workaround?

Regards..

wolfgang

unread,
Jul 3, 2009, 3:07:51 AM7/3/09
to TiddlyWiki
> With IE this doesn't seem to work. Is there a workaround?
>

So there isn't? And that's the reason you wont add this very helpful
feature to ShowPopup?

Regards..
Reply all
Reply to author
Forward
0 new messages