Properly display embedded Tweets in Exhibit across facet filtering

[Tully Hansen]

I want embedded tweets to show in my Exhibit 3, see table facet in demo here: http://tullyhansen.github.io/botDB/nobel3ed.html – I would like to know where I should call Twitter's twttr.widgets.load(); such that any change in Exhibit data display (including filtering via facet links/checkboxes) refreshes display of embedded tweets.

Presently I have:

jQuery(document).on("dataload.exhibit", function(evt) {

twttr.widgets.load();

});

Which works on first load, but switching back and forth between views or filtering on facets loses the embed display. I have also tried the kitchen sink approach (not in demo):

jQuery(document).on("exhibitConfigured.exhibit itemshow.exhibit onResetAllFilters.exhibit exhibitConfigured.exhibit onFacetUpdated.exhibit importReady.exhibit onBeforeFacetReset.exhibit registerFacets.exhibit registerComponents.exhibit onItemsChanged.exhibit dataload.exhibit onAfterViewPanelSwitch.exhibit", function(evt) {

    twttr.widgets.load();

});

Which also kinda works. However, using either approach, any change in facet filters causes loss of proper embedded Tweet display. Tips or examples to suit a complete JavaScript novice welcome.

[David Karger]

Exhibit is not designed for realtime updates.  It fetches its data once, and never interacts with a server again.  dataload.exhibit is only twittered once, because data is never loaded again.  ditto for exhibit.configured.    itemsChanged and facetUpdated does get triggered each time you change a filter.

--
You received this message because you are subscribed to the Google Groups "SIMILE Widgets" group.
To unsubscribe from this group and stop receiving emails from it, send an email to simile-widget...@googlegroups.com.
To post to this group, send email to simile-...@googlegroups.com.
Visit this group at http://groups.google.com/group/simile-widgets.
For more options, visit https://groups.google.com/d/optout.

[Tully Hansen]

Thanks David. I can see why calling twttr.widgets.load(); on data load.exhibit won't work after the initial load. Oddly (to my limited understanding), I can put twttr.widgets.load(); inside of onAfterViewPanelSwitch.exhibit:

jQuery(document).on("onAfterViewPanelSwitch.exhibit", function(evt) {

console.log("onAfterViewPanelSwitch");

twttr.widgets.load(); // works

});

… and have embedded Tweets (re)render after switching views, but attempting to do the same inside of either onItemShow or onItemsChanged (both of which seem to be called when manually filtering facets, a fact I deduce through liberal console.log()) fails to (re)render Tweets when filtering.

jQuery(document).on("onItemsChanged.exhibit", function(evt) {

twttr.widgets.load();

console.log("onItemsChanged");

});

jQuery(document).on("onItemShow.exhibit", function(evt) {

console.log("onItemShow");

twttr.widgets.load(); // doesn't work?

});

My wild guess is that there's some other thing (function? event?) that Exhibit does after onItemShow or onItemsChanged that actually puts data (inc. tweet embed links) onto the page so that twttr.widgets.load(); has something to render?

[Tully Hansen]

I'm sure a JS programmer somewhere just lost their wings, but I found a fix that seems to work! Embedded tweets displaying properly across facet filtering.

jQuery(document).on("onItemsChanged.exhibit", function(evt) {

  setTimeout(function(){twttr.widgets.load()}, 0); // works!

console.log("onItemsChanged");

});