Exhibit - sharing facets for different collections
Paweł
I have read this:
http://simile.mit.edu/wiki/Exhibit/2.0/Collections
and I am wondering if for the following scenario:
- input data has two types: TypeA and TypeB
- I create the following collections
<div ex:role="collection" id="typeA-things" ex:itemTypes="TypeA"></
div>
<div ex:role="collection" id="typeB-things" ex:itemTypes="TypeB"></
div>
<div ex:role="collection" id="all-things" ex:itemTypes="TypeA,TypeB"></
div>
- I create 3 views:
a) a tile view for TypeA elements
b) a tile view for TypeB elements
c) a timeline view which displays both TypeA and TypeB elements
it is possible to filter elements in view a) and c) using the same
facet?
(At the moment I have to create two facets for the same data field:
one facet is
used for view a) and the other facet is used for the view c) - this is
not the best
option for the user as he has to set filters twice (for each view).)
Alternatively, how can I display only selected facets for selectected
views?
Then, depending on the choosen view, I could display a facet which has
set either
ex:collectionID="typeA-things" or ex:collectionID="all-things" set.
(but this solution still would not be ideal as settings from one view
would not
hold for another view, but at least the space on the screen is not
wasted).
best regards,
Pawel Mazur
David Huynh
Right now you can't achieve that result with Exhibit's native support.
You need to do some scripting. First when you include exhibit-api.js,
add the autoCreate=false parameter to it:
<script src=".... /exhibit-api.js?autoCreate=false"></script>
This is so that you can do the initialization yourself. Then add an
onload handler to <body>
<body onload="onLoad();">
And add this Javascript code:
<script>
function onLoad() {
window.database = Exhibit.Database.create();
window.database.loadDataLinks(onDataLoaded);
}
function onDataLoaded() {
window.exhibit = Exhibit.create();
createCollections();
window.exhibit.configureFromDOM();
};
function createCollections() {
var c1 = Exhibit.Collection.create2(
"typeA-things",
{ itemTypes: [ "TypeA" ] },
window.exhibit.getUIContext();
};
window.exhibit.setCollection("typeA-things", c1);
var c2 = Exhibit.Collection.create2(
"typeB-things",
{ itemTypes: [ "TypeB" ] },
window.exhibit.getUIContext();
};
window.exhibit.setCollection("typeB-things", c2);
var c3 = new Exhibit.Collection("all-things", database);
c3._update = function() {
this._items = new Exhibit.Set(c1.getRestrictedItems());
this._items.addSet(c2.getRestrictedItems());
this._onRootItemsChanged();
};
c3._listener = { onItemsChanged: function() { c3._update(); } };
c1.addListener(c3._listener);
c2.addListener(c3._listener);
c3._update();
window.exhibit.setCollection("all-things", c3);
};
</script>
Remove all <div ex:role="collection"> from your HTML since you're
already creating collections through Javascript.
David