Expose Properties to JavaScript

/com/escenic/framework/frontend/FrontEndConfig is a special configuration layer object that you can use to create universally available properties. You can use it to define properties that are available in:

  • The global Content Engine configuration layers

  • The publication-specific application configuration layer

  • Javascript code executed in the browser

The way this works is that:

  • Any property defined in the global FrontEndConfig object is automatically copied to a similar object in the application layer

  • Any property available in the application layer FrontEndConfig that has a name with the prefix "property." is automatically made available to Javascript code running in the browser

This means that you can override the global setting of a FrontEndConfig property by redefining it in your application configuration layer. It also means that you can create publication-specific FrontEndConfig properties by defining them in the application configuration layer. They will then only be available in that publication.

To create global FrontEndConfig properties open configuration-root/com/escenic/framework/frontend/FrontEndConfig.properties in one of your global configuration layers (or create it if it does not exist) and add your property definitions:

myFirstProp=1
property.mySecondProp=2

If you do this in your common configuration layer (usually located in /etc/escenic/engine/common), the properties will be available in all the global configuration layers and also in all your publication applications. If, for some reason, you want myFirstProp to have a different value in one of your publications, then you can achieve this by creating another configuration-root/com/escenic/framework/frontend/FrontEndConfig.properties file in the publication's application configuration layer (that is, in the publication's WEB-INF/localconfig folder):

myFirstProp=1.5

Note that you only need to specify the property you want to override.

You can also create properties that are specific to this publication by adding them to this file:

myFirstProp=1.5
property.myFirstPublicationProp=one

myFirstProp doesn't have a "property." prefix, and is therefore only available to server-side Java and JSP code. property.mySecondProp and property.myFirstPublicationProp, on the other hand, will also be available to client-side Javascript via a map variable called FrontEndConfig:

console.log ( 'mySecondProp=' + FrontEndConfig['mySecondProp']);
console.log ( 'myFirstPublicationProp=' + FrontEndConfig['myFirstPublicationProp']);

The value you assign to a FrontEndConfig property can be any of the following:

  • Literal text, as shown previously:

    myFirstProp=1.5
    property.myFirstPublicationProp=one
  • A JSON string:

    property.myBox= {"title": "Title","name": "Name", "width": 500, "height": 500}

    A property defined using JSON in this way will appear as a standard Javascript object on the client. You must use double quotation marks (") around field names and values.

  • JSP expression language:

    property.myArticleTitle=el{article.title}

    Note that you have to use the keyword el to introduce the expression instead of the $ sign usually used in JSP. Otherwise, you can use JSP expression language in exactly the same way as you would in your JSP code. You can reference any beans that would be accessible from server-side JSP code, and you can make use of expression language operators in the usual way. In addition, you can access section parameters as follows

    property.mySectionParam=el{sectionParams.section-parameter-name}
  • A mixture of literal text and JSP expression language, for example:

    property.myContextArticleTitle=el{article.title} in el{section.name}

You can also combine JSON syntax and the JSP expression language to construct Javascript objects containing run-time values. For example:

property.myArticle= {"title": "el{article.title}","section": "el{section.name}"}

For general information about application configuration layers and how they differ from the global configuration layers, see Publication Webapp Properties.