Compilateurs de composant

Les compilateurs de composant personnalisés suivent le même modèle que les compilateurs de page et peuvent être créés pour des présentations de section, des composants personnalisés et des présentations de contenu.

Pendant le processus de compilation, la commande cec compile-template recherche un fichier compile.js au même emplacement que le fichier render.js pour le composant :

src
- components
  - <yourComponent>
    - assets
      - render.js
      - compile.js

Si ce fichier n'existe pas, le composant n'est pas compilé et est affiché lors de l'exécution.

Si le fichier existe, il doit implémenter une interface compile() qui renvoie une promesse. Par exemple, le compilateur Starter-Blog-Author-Summary suivant est un compilateur de présentation de contenu personnalisé :

var fs = require('fs'),
path = require('path'),
mustache = require('mustache');

var ContentLayout = function (params) {
    this.contentClient = params.contentClient;
    this.contentItemData = params.contentItemData || {};
    this.scsData = params.scsData;
};

ContentLayout.prototype = {
    contentVersion: '>=1.0.0 <2.0.0',

    compile: function () {
        var compiledContent = '',
            content = JSON.parse(JSON.stringify(this.contentItemData)),
            contentClient = this.contentClient;

         // Store the id
         content.fields.author_id = content.id;

         if (this.scsData) {
             content.scsData = this.scsData;
             contentType = content.scsData.showPublishedContent === true ? 
'published' : 'draft';            
             secureContent = content.scsData.secureContent;
        } 

        // calculate the hydrate data
        content.hydrateData = JSON.stringify({
            contentId: content.id,
            authorName: content.fields['starter-blog-author_name']
        });

        try {
            // add in style - possible to add to <head> but inline for 
simplicity
            var templateStyle = fs.readFileSync(path.join(__dirname,
'design.css'), 'utf8');
            content.style = '<style>' + templateStyle + '</style>';
 
            var templateHtml = fs.readFileSync(path.join(__dirname,
'layout.html'), 'utf8');
            compiledContent = mustache.render(templateHtml, content);
        } catch (e) {
            console.error(e.stack);
        }

        return Promise.resolve({
            content: compiledContent,
            hydrate: true // note that we want to hydrate this component using the render.js hydrate() function. This is required for when the user clicks on the author
        });
    }
};

module.exports = ContentLayout;