jQuery Expander on a view

95 views
Skip to first unread message

Dave Crumbacher

unread,
May 11, 2011, 2:47:25 PM5/11/11
to SIMILE Widgets
I am using the jQuery Expander plugin (http://
plugins.learningjquery.com/expander/) to limit the length of certain
text objects in my exhibit. I am currently doing this in one of
multiple views I have in my exhibit. I have found that if I configure
the exhibit to show the view with the expander-applied text object as
default, it works fine. However, if it is not the default view, it
does not work when switch over to that view. I'm guessing the
expander plugin only works if the text object it is applied to is not
hidden. Is there a way to get a handle on when an exhibit view is
changed so I can apply the expander plugin at that time? Thanks.

Ryan Lee

unread,
May 11, 2011, 4:05:47 PM5/11/11
to simile-...@googlegroups.com, Dave Crumbacher

Hi Dave,

I think the issue is that views aren't actually instantiated when
they're not visible, so when you switch a view, any binding you
initially did disappears with the deleted DOM objects. If they aren't
visible at all initially, there's nothing to bind to. So you would want
an event hook of some sort to know when the view changes, to run the
plugin's methods on available objects.

Not only isn't there an event or handler to hook into, the existing
click handler that changes views is greedy and cancels out all other
attempts to bind to a click on the new view. It's a known issue.

I haven't managed to find an elegant way to work around it (which
doesn't preclude there being one). Hacks I've resorted to in the past
include redefining Exhibit methods or hooking into onmouseout. You
could also try hacking up jQuery:

http://stackoverflow.com/questions/1225102/jquery-event-to-trigger-action-when-a-div-is-made-visible

You may also want to check if the plugin still functions as expected
after facet selection, particularly text queries. If you need more
help, putting a sample somewhere we can see it would be useful.

Dave Crumbacher

unread,
May 11, 2011, 4:39:15 PM5/11/11
to SIMILE Widgets
Hi Ryan. Thanks for the quick response. You make a good point.
After applying a facet selection, the expander function actually does
NOT work. So I have a larger issue here. We will look at
alternatives, including the possibility of eliminating the expander
plugin altogether and just create an additional field in our JSON that
represents a truncated version of the larger text field (although this
involves repeating data, which is not ideal).

Regards,

Dave

On May 11, 4:05 pm, Ryan Lee <ryan...@zepheira.com> wrote:
>
> Hi Dave,
>
> I think the issue is that views aren't actually instantiated when
> they're not visible, so when you switch a view, any binding you
> initially did disappears with the deleted DOM objects.  If they aren't
> visible at all initially, there's nothing to bind to.  So you would want
> an event hook of some sort to know when the view changes, to run the
> plugin's methods on available objects.
>
> Not only isn't there an event or handler to hook into, the existing
> click handler that changes views is greedy and cancels out all other
> attempts to bind to a click on the new view.  It's a known issue.
>
> I haven't managed to find an elegant way to work around it (which
> doesn't preclude there being one).  Hacks I've resorted to in the past
> include redefining Exhibit methods or hooking into onmouseout.  You
> could also try hacking up jQuery:
>
> http://stackoverflow.com/questions/1225102/jquery-event-to-trigger-ac...

mleden

unread,
May 12, 2011, 1:30:02 PM5/12/11
to SIMILE Widgets
Hi Dave,

I haven't used the jQuery Expander plugin, but I have experimented
combining Exhibit views with other jQuery/jQuery UI/plugins. The more
I play with them, the more I find that they can coexist. One recent
thing that helped me with a problem was using the "ex:onshow"
directive. I got this idea from this example that David H had set up:
http://davidhuynh.net/spaces/misc/exhibit-with-jquery/presidents2.html

Looking at the source, you'll probably see if/how this can help in
your case. For my example, where I'm using jQuery UI dialogs within
Exhibit Tile View, it worked well and doesn't have issue with
switching Exhibit views within a viewPanel. If you think I can
provide more guidance, please send out a URL, and I'll try to take a
look.

HTH,
-Mark

Dave Crumbacher

unread,
May 13, 2011, 10:37:51 AM5/13/11
to SIMILE Widgets
Mark,

Thanks for your suggestion. I was indeed able to get the jQuery
Expander plugin to work when using the "ex:show" directive on my
view. I do get one side effect, in that the plugin puts multiple
[collapse expanded text] links on a text block that has been
truncated. I'm guessing the "ex:show" directive is causing the plugin
to be run multiple times. But the fix to that may be just a
modification to the Expander plugin.

Thanks!

Dave Crumbacher

unread,
May 13, 2011, 2:08:17 PM5/13/11
to SIMILE Widgets
I was able to fix the jQuery Expander problem by only applying it to
the text block if it had not already been applied. I posted a patch
on the jQuery forum here:

http://forum.jquery.com/topic/expander-plugin-patch-to-prevent-multiple-collapse-links

Thanks for the helpful dialog. I think we have a workable solution.
Reply all
Reply to author
Forward
0 new messages