I’m working on an image database. I want one image to be featured on top of a gallery, on the first page.
There are 2 subscriptions:
-
pix.pinned.public
for the single featured image -
pix.paged-gallery.public
for the paged gallery, containing 24 images per page
Both publications use the same collection EboyPix
.
Unfortunately the featured image does always shows up twice:
- on top (good, this is where it should go)
- added to the gallery of 24 (even in cases it should be on a page other that page 1)
So in some cases the gallery will show 24 images, in other cases it will show 25 images:
- 24 (good): when the featured image is part of page 1 of the gallery
- 25 (bad): when the featured image is part of page 2+ of the gallery — but is added to the 24 images on page 1 (because we’re subscribed to both subscriptions, which are actually one collection).
Ideally I’d like to publish the featured image collection under a different name (so it doesn’t interfere with the gallery collection). This doesn’t seem to be possible though.
And the client side collection EboyPix
has no notion of which page each image should go on. So it doesn’t seem possible to filter out images from page 2+ (which the featured image might be from).
This is very confusing to me, any help is greatly appreciated!
Thanks!
Publications:
// Pinned
Meteor.publish('pix.pinned.public', function pixPinnedPublic() {
const selector = { projects: 'pinned' };
return EboyPix.find(selector);
});
// Paged Gallery
Meteor.publish('pix.paged.public', function pixPagedPublic(slug, page, query) {
// Build selector
const selector = urlToSelector(slug, query);
const pixPerPage = 24;
// Convert page string to integer so we can do some math
let pageInt = parseInt(page, 10);
const skipCount = (pageInt - 1) * pixPerPage;
const options = {
limit: pixPerPage,
skip: skipCount,
sort: { createdAt: -1 }
};
return EboyPix.find(selector, options);
});
Subscriptions:
Template.pixPoolPage.onCreated(function() {
const self = this;
self.autorun(function() {
const thisPage = FlowRouter.getParam('page');
const thisSlug = FlowRouter.getParam('slug');
const searchQuery = FlowRouter.getQueryParam('q');
self.subscribe('pix.paged.public', thisSlug, thisPage, searchQuery);
});
});
Template.picPinned.onCreated(function() {
const self = this;
if (isHome()) {
self.autorun(function() {
self.subscribe('pix.pinned.public');
});
}
});