Script Example: Format Specific Words with Character Level Formatting

Description

Character Level Formatting (CLF) is introduced in LPS/LLM version 10.2. CLF provides a method of marking up your label input so that certain characters or words can be formatted differently than other parts of the same field. This article outlines how to use the JavaScript replace() method to automatically apply formatting.

How to Use the JavaScript replace() Method

When creating a script in LLM, the programming language that is used is JavaScript. JavaScript provides many useful functions, one of which is the replace() function.

Basic syntax

JavaScript replace() is a string function. That means that it must be called using with .replace after a string variable or literal. The parameters of the replace method specify a word to search for and then, if the word is found, a second parameter indicates what will be substituted. More information about the function can be found at the Mozilla Developer Network.

Replacing words with CLF tags

A common CLF tag is the bold tag ("\b "). The following example replaces any word and formats it with the bold tag. We leverage a variable to hold the search word, then surround the search word with the CLF bold tags.

Copy
Replace a single word
<pre class="syntaxhighlighter-pre" xml:space="preserve">var input = "This product contains wheat";
var search = "wheat";
var sub = "\b " + search + "\b0 ";
var newInput = input.replace(search, sub);  //This product contains \b wheat\b0 
 </pre>

CLF tags must be space delimited. For example, make sure there is a space after the tag. For example, use "\b " and not "\b" in the script.

The bold tag can be substituted for any number of other CLF tags.  Refer to the LLM Help for details on how to use other tags.  

Looping through a list of words

Using Javascript arrays, a list of words can be looped through to replace several words with tagged versions.  This example loops through each word in the array and replaces the output.  

Copy
Looping through an array
<pre class="syntaxhighlighter-pre" xml:space="preserve">var words = ["peanuts", "wheat", "barley"];
var input = "This product contains wheat and barley";
var newInput = ""; //initialize variable outside of loop
 
for(var i=0; i<words.length; i++){
    var search = words[i];
    var sub = "\b " + search + "\b0 ";
    newInput = input.replace(search, sub);    
}
 
//newInput: "This product contains \b wheat\b0  and \b barley\b0 "</pre>

Replacing more than one occurrence of a word

By default, the replace method will only replace the first occurrence of the word that you are trying to replace.  To get around this, we can use a Regular Expression match, rather than a string match.  With Regular Expressions, you can specify a global match, which means to match all occurrences of your search term.  Another reason to use regular expression matching is that you can match any case (case-insensitive).

Copy
Using a regular expression match
<pre class="syntaxhighlighter-pre" xml:space="preserve">var input = "This product contains wheat.  Wheat can cause allergic reactions";
var search = "wheat";
var sub = "\b " + search + "\b0 ";
var newInput = input.replace(new RegExp(search, 'gi'), sub);  //g=global, i=case-insensitive
 
//newInput: "This product contains \b wheat\b0 .  \b Wheat\b0  can cause allergic reactions";</pre>

Generic script to format words EU 1169/2011

EU 1169/2011 is a standard that indicates that certain words need to be bold or stand out on packaging.  This script is a generic script that will look at certain fields on a label and replace the words specified with their tagged counterparts.

Copy
EU 1169/2011
<pre class="syntaxhighlighter-pre" xml:space="preserve">//Change this list to check fields for bold words
var fields = ["field1", "field2"];
//Change this list to check for words that needs to be bold
var boldWords = [    "Wheat", "Rye", "Barley", "Oats", "Celery", "Crustaceans", 
                    "Egg", "Fish", "Lupin", "Milk", "Molluscs", "Mollusks",
                    "Mustard", "Nuts", "Peanuts", "Soy", "Sesame",
                    "Sulphur Dioxide", "Sulfites"];

//---------------
//loop through each field to replace values
for (var i = 0; i < fields.length; i++) {
    var data = String(label.fields.field.(@name == fields[i]).@data);
    
    //loop through each bold word to replace it with the bold markup
    for (var j = 0; j < boldWords.length; j++) {
        var sub = "\\b " + boldWords[j] + "\\b0 ";
        data = data.replace(new RegExp(boldWords[j], 'gi'), sub);
    }
    
    //set the data of the field
    label.fields.field.(@name == fields[i]).@data = data;
}
//Function to escape special characters
function escapeRegExp(input) {
    return input.replace(/([.*+?^=!:${}()|\[\]\/\\])/g, "\\$1");
}</pre>