node-red-contrib-chatbot/nodes/chatbot-nlp-entity.html

REDBot a Chat bot for a full featured chat bot for Telegram, Facebook Messenger and Slack. Almost no coding skills required

<script type="text/javascript">

  $.RedBot.registerType('chatbot-nlpjs-entity',{
    category: $.RedBot.config.name + ' Parsers',
    color: '#FFCC66',
    defaults: {
      name: {
        value: '',
        validate: function(intent) {
          return $.RedBot.validate.notEmpty(intent);
        }
      },
      language: {
        value: 'en',
        required: true
      },
      regex: {
        value: '',
        validate: function(value) {
          if (this.entityType === 'regex') {
            var isValid = true;
            try {
              new RegExp(value);
            } catch(e) {
              isValid = false;
            }
            return isValid;
          }
          return true;
        }
      },
      entityType: {
        value: 'enum',
        required: true
      },
      entities: {
        value: [],
        validate: function(entities) {
          return this.entityType !== 'enum' || $.RedBot.validate.entities(entities);
        }
      },
      outputs: {
        value: 1
      }
    },
    inputs: 1,
    outputs: 1,
    icon: 'chatbot-listen-lexicon.png',
    paletteLabel: 'NLP.js Entity',
    label: function() {
      return 'NLP.js Entity' + (this.name != null && this.name !== '' ? ' (' + this.name + ')' : '');
    },
    oneditsave: function() {
      var domRules = $('#node-input-values-container').editableList('items');
      var node = this;
      var idx;
      // init
      node.entities = [];
      // store terms, all lowercase
      for(idx = 0; idx < domRules.length; idx++) {
        var selectorName = domRules[idx].find('input[name=name]');
        var selectorAliases = domRules[idx].find('input[name=aliases]');
        var aliases = [];
        var splitAliases = selectorAliases.val().split(',');
        for (var k = 0; k < splitAliases.length; k++) {
          var str = $.trim(splitAliases[k]);
          if (str != null && str != undefined && str !== '') {
            aliases.push(str);
          }
        }
        node.entities.push({
          name: selectorName.val().toLowerCase(),
          aliases: aliases
        });
      }
    },
    oneditprepare: function() {
      var node = this;
      $('#node-input-name')
        .blur(function() {
          var intent = $(this).val();
          intent = intent.replace(/ /g, '');
          $(this).val(intent);
        });
      $('#node-input-entityType')
        .change(function() {
          var entityType = $(this).val();
          $('.form-row-entityType').hide();
          $('.form-row-entityType-' + entityType).show();
        });

      $('#node-input-values-container')
        .css('min-width', '450px')
        .editableList({
          addButton: 'Add entity',
          addItem: function(container, i, entity) {
            //var value = typeof entity == 'object' ? '' : entity;
            var row = $('<div class="rb-nlp-entity"/>').appendTo(container);
            $('<input/>', {
                style: 'width:100%',
                class: 'node-input-name',
                name: 'name',
                type: 'text',
                placeholder: 'Name',
                value: entity.name
              }).appendTo(row);
            $('<input/>', {
              style: 'width:100%',
              name: 'aliases',
              class: 'node-input-aliases',
              placeholder: 'Aliases',
              type: 'text',
              value: (entity.aliases || []).join(',')
            }).appendTo(row);
          },
          removable: true,
          sortable: true
        });
      // wait a little before updating dom
      setTimeout(function() {
        $('.form-row-entityType').hide();
        if (node.entityType === null || node.entityType === undefined || node.entityType === '' || node.entityType === 'enum') {
          $('.form-row-entityType-enum').show();
          // preselect enum if enumType is empty (legacy)
          if (node.entityType === null || node.entityType === undefined || node.entityType === '') {
            $('#node-input-entityType').val('enum');
          }
          // populate the control
          var entities = node.entities || [];
          var idx;
          for (idx = 0; idx < entities.length; idx++) {
            $("#node-input-values-container").editableList('addItem', entities[idx]);
          }
        } else {
          $('.form-row-entityType-regex').show();
        }
      }, 10);
    },
    oneditresize: function() {
      var dialogForm = $('#dialog-form');
      var rowName = $('.form-row-name', dialogForm);
      var rowLanguage = $('.form-row-language', dialogForm);
      var rowLabel = $('.form-row-label', dialogForm);
      var height = dialogForm.height() - rowName.height() - rowLabel.height() - rowLanguage.height() - 20;
      $('#node-input-values-container').editableList('height', height);
    }
  });
</script>


<script type="text/x-red" data-template-name="chatbot-nlpjs-entity">
<div class="form-row form-row-name">
  <label for="node-input-intent"><i class="icon-tag"></i>Entity name</label>
  <input type="text" id="node-input-name" placeholder="Name">
</div>
<div class="form-row form-row-language">
  <label for="node-input-language">Language</label>
  <select id="node-input-language" placeholder="Language to match">
    <option value="ar">Arabic</option>
    <option value="bn">Bengali</option>
    <option value="ca">Catalan</option>
    <option value="cs">Czech</option>
    <option value="da">Danish</option>
    <option value="de">German</option>
    <option value="el">Greek</option>
    <option value="en">English</option>
    <option value="es">Spanish</option>
    <option value="eu">Basque</option>
    <option value="fa">Persian</option>
    <option value="fi">Finnish</option>
    <option value="fr">French</option>
    <option value="ga">Irish</option>
    <option value="gl">Galician</option>
    <option value="hi">Hindi</option>
    <option value="hu">Hungarian</option>
    <option value="hy">Armenian</option>
    <option value="it">Italian</option>
    <option value="ja">Japanese</option>
    <option value="nl">Dutch</option>
    <option value="no">Norwegian</option>
    <option value="pt">Portuguese</option>
    <option value="ro">Romanian</option>
    <option value="ru">Russian</option>
    <option value="sl">Slovenian</option>
    <option value="sv">Swedish</option>
    <option value="ta">Tamil</option>
    <option value="th">Thai</option>
    <option value="tl">Tagalog</option>
    <option value="tr">Turkish</option>
    <option value="uk">Ukrainian</option>
    <option value="zh">Chinese</option>
  </select>
</div>
<div class="form-row">
  <label for="node-input-entityType">Entity type</label>
  <select id="node-input-entityType" placeholder="Entity type">
    <option value="enum">List</option>
    <option value="regex">Regular Expression</option>
  </select>
</div>
<div class="form-row form-row-entityType form-row-entityType-regex">
  <label for="node-input-intent" style="display:block;width:auto;">Regular Expression</label>
  <input type="text" id="node-input-regex" placeholder="i.e./ ... /gi">
</div>
<div class="form-row form-row-entityType form-row-entityType-enum form-row-label" style="margin-bottom:0;">
  <label style="width:100%;"><i class="fa fa-list"></i> <span>Utterances</span></label>
</div>
<div class="form-row form-row-entityType form-row-entityType-enum node-input-values-container-row">
  <ol id="node-input-values-container"></ol>
</div>
</script>

<script type="text/x-red" data-help-name="chatbot-nlpjs-entity"><p>An <em>entity</em> is the variable part of the utterance, it can be detected and stored in a context variable and used later in the flow. Some entities are predefined (like numbers, dates, etc) while other can be defined, for example a chatbot that is able to understand a sentence like <code>I want to buy 3 apples</code> should have an intent with the utterance <code>I want to by %number% %fruit%</code>. In this example the entity <em>number</em> is built-it, while the entity <em>fruit</em> should be defined with the <code>NLP.js Entity</code> and should include all kind of fruits with optional aliases (apple, orange, grape, etc).</p>
<p><img src="https://raw.githubusercontent.com/guidone/node-red-contrib-chatbot/master/docs/images/nlp-entity.png" alt="Entity"></p>
<p>Built-in entities are: <em>email</em>, <em>ip</em>, <em>hashtag</em>, <em>phonenumber</em>, <em>url</em>, <em>number</em>, <em>ordinal</em>, <em>percentage</em>, <em>age</em>, <em>currency</em>, <em>date</em>, <em>duration</em>.</p>
<p>The entity can also be defined in a upstream node:</p>
<pre><code class="language-javascript">{  
    payload: {    
        name: &#39;fruits&#39;,    
        language: &#39;en&#39;,    
        entities: [      
            { name: &#39;orange&#39; },      
            { name: &#39;apple&#39;, aliases: [&#39;golden apple&#39;, &#39;granny smith apple&#39;] }    
        ]  
    }
}
</code></pre>
<p>Available parameters for the <code>msg.payload</code></p>
<table>
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody><tr>
<td>entities</td>
<td>array of [entity]</td>
<td>The list of entities</td>
</tr>
<tr>
<td>name</td>
<td>string</td>
<td>The entity name</td>
</tr>
<tr>
<td>language</td>
<td>string</td>
<td>The ISO code for language (<em>en</em>, <em>it</em>, …)</td>
</tr>
</tbody></table>
<p>The <code>[entity]</code> object</p>
<table>
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Description</th>
</tr>
</thead>
<tbody><tr>
<td>name</td>
<td>string</td>
<td>The entity item name (required)</td>
</tr>
<tr>
<td>aliases</td>
<td>array of string</td>
<td>Possible aliases of the same item</td>
</tr>
</tbody></table>
</script>