pbauer
pbauer

Reputation: 645

Using mockup-patterns in faceted-views in Plone 5

When I use any mockup-pattern like <span class="pat-moment">2016-07-30T15:10:00</span> in a faceted:view (a custom view for eea.facetednavigation) the pattern is not working at all since the content is injected with javascript.

In https://stackoverflow.com/a/35699974/637399 @ebrehault wrote that Patterns are initialized at load time and if the DOM changes and contains new elements, you need to call Registry.scan($('#content-core')) where Registry is pat-registry and #content-core the injected part of the page.

How do I do that in the context of eea.facetednavigation (https://github.com/eea/eea.facetednavigation)? It uses a event-system (see https://github.com/eea/eea.facetednavigation/blob/master/eea/facetednavigation/browser/javascript/view.js). How do I listen to one of these events, which one do I need and how do I then call the scan?

Upvotes: 5

Views: 137

Answers (2)

Jens W. Klein
Jens W. Klein

Reputation: 761

For Plone 5: I registered the code snippet below as a resource in the registry.xml in my addon, included it in the bundles addon in my registry.xml and rebuild my addons bundle using the ./bin/plone-compile-resources script.

define([
    'pat-registry'
], function(Registry) {
  'use strict';
    $(Faceted.Events).bind(Faceted.Events.AJAX_QUERY_SUCCESS, function() {
      Registry.scan($('#content-core'));
    });
});

Upvotes: 1

ebrehault
ebrehault

Reputation: 2601

You need to bind to the eea's AJAX_QUERY_SUCCESS event:

$(Faceted.Events).bind(Faceted.Events.AJAX_QUERY_SUCCESS, function() {
        Registry.scan($('#content-core'));
});

Note: when you said:

and #content-core the injected part of the page.

that's not accurate, it is not specifically the injection target (by the way there is not always injection when you use patterns, in your very case the injection is managed by eea.faceted, which is not a pattern). You can re-scan any part of the DOM, you just need to make sure the part you re-scan contains the patterns you want to activate (body would be just fine for instance).

Upvotes: 4

Related Questions