New Resource Registry control panel

Plone 5 introduce some new concepts for managing and customizing JavaScripts:

  • It uses Asynchronous Module Definition (AMD) with requirejs.

  • AMD can be used in non-compiled form by activating the development mode in the Resource Registry control panel All new resource registrations will be done in the Configuration Registry. The registry.xml configuration file will look like this:
    <?xml version="1.0"?>
    <registry>
      <records prefix="plone.resources/foobar"
               interface='Products.CMFPlone.interfaces.IResourceRegistry'>
        <value key="js">.++resource++foobar.js</value>
        <value key="deps">jquery</value>
      </records>
    </registry>
    You can also create your own bundle:
    <records prefix="plone.bundles/foobar"
             interface='Products.CMFPlone.interfaces.IBundleRegistry'>
      <value key="resources">
        <element>foobar</element>
      </value>
      <value key="enabled">True</value>
      <value key="jscompilation">++resource++foobar-compiled.min.js</value>
      <value key="last_compilation">2015-02-15 00:00:00</value>
    </records>
  • The Resource Registry control panel offers also a simple form to provide pattern options in JSON format, for example:

    <record name="plone.patternoptions">  <field type="plone.registry.field.Dict">    <description>Base pattern configuration options</description>    <key_type type="plone.registry.field.ASCIILine"/>    <title>Patterns configuration</title>    <value_type type="plone.registry.field.Text"/>  </field>  <value>    <element key="livesearch">{"minimumInputLength": 5} </element>  </value></record>
  • Also own pattern option adapter can be defined, e.g. mark special links in Products/CMFPlone/patterns/__init__.py:

    def mark_special_links(self):    result = {}    properties = getToolByName(self.context, "portal_properties")    props = getattr(properties, 'site_properties')    if not props:        return result    msl = props.getProperty('mark_special_links', 'false')    elonw = props.getProperty('external_links_open_new_window', 'false')    if msl == 'true' or elonw == 'true':        result = {'data-pat-markspeciallinks':                  ('{"external_links_open_new_window": "%s",'                   '"mark_special_links": "%s"}' % (elonw, msl))}    return resultdef __call__(self):    data.update(self.mark_special_links())    return data
    and Products/CMFPlone/profiles/dependencies/registry.xml:
    <records prefix="plone.resources/mockup-patterns-markspeciallinks"         interface='Products.CMFPlone.interfaces.IResourceRegistry'>  <value key="js">++resource++mockup/markspeciallinks/pattern.js</value>  <value key="css">  <element>++resource++mockup/markspeciallinks/pattern.markspeciallinks.less</element>  </value></records>

Further readings