node-red-contrib-chatbot
Version:
REDBot a Chat bot for a full featured chat bot for Telegram, Facebook Messenger and Slack. Almost no coding skills required
182 lines (177 loc) • 6.22 kB
HTML
<script type="text/javascript">
$.RedBot.registerType('chatbot-nlpjs-intent',{
category: $.RedBot.config.name + ' Parsers',
color: '#FFCC66',
defaults: {
intent: {
value: '',
validate: function(intent) {
return $.RedBot.validate.notEmpty(intent);
}
},
language: {
value: 'en',
required: true
},
utterances: {
value: [],
validate: function(utterances) {
return $.RedBot.validate.utterances(utterances);
}
},
outputs: {
value: 1
}
},
inputs: 1,
outputs: 1,
icon: 'chatbot-listen-lexicon.png',
paletteLabel: 'NLP.js Intent',
label: function() {
return 'NLP.js Intent' + (this.intent != null && this.intent !== '' ? ' (' + this.intent + ')' : '');
},
oneditsave: function() {
var domRules = $('#node-input-values-container').editableList('items');
var node = this;
var idx;
// init
node.utterances = [];
// store terms, all lowercase
for(idx = 0; idx < domRules.length; idx++) {
var selector = domRules[idx].find('input');
node.utterances.push(selector.val().toLowerCase());
}
},
oneditprepare: function() {
$('#node-input-name')
.blur(function() {
var intent = $(this).val();
intent = intent.replace(/ /g, '');
$(this).val(intent);
});
$('#node-input-values-container')
.css('min-width', '450px')
.editableList({
addButton: 'Add utterance',
addItem: function(container, i, entity) {
var value = typeof entity == 'object' ? '' : entity;
var row = $('<div/>').appendTo(container);
$('<input/>', {
style: 'width:100%',
class: 'node-input-rule-property-name',
type: 'text',
value: value
}).appendTo(row);
},
removable: true,
sortable: true
});
var utterances = this.utterances || [];
// populate the control
var idx;
for (idx = 0; idx < utterances.length; idx++) {
$("#node-input-values-container").editableList('addItem', utterances[idx]);
}
},
oneditresize: function() {
var dialogForm = $('#dialog-form');
var rowName = $('.form-row-name', dialogForm);
var rowLabel = $('.form-row-label', dialogForm);
var rowLanguage = $('.form-row-language', 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-intent">
<div class="form-row form-row-name">
<label for="node-input-intent"><i class="icon-tag"></i> Intent</label>
<input type="text" id="node-input-intent" placeholder="Intent">
</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 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 node-input-values-container-row">
<ol id="node-input-values-container"></ol>
</div>
</script>
<script type="text/x-red" data-help-name="chatbot-nlpjs-intent"><p>An <em>intent</em> is a string representation of the abstract meaning of the user sentence, it requires an arbitrary name (that will be likely used in a <a href="https://www.notion.so/4113636f565d4ff4af08bc61a644206b">Rules node</a> to control the chatbot flow) and one or more utterances (a set of all different way of expressing the same actions).</p>
<p>The <code>NLP.js Intent node</code> looks like</p>
<p><img src="https://raw.githubusercontent.com/guidone/node-red-contrib-chatbot/master/docs/images/nlp-intent.png" alt=""></p>
<p>The intent can also be defined in a upstream node:</p>
<pre><code class="language-javascript">{
payload: {
intent: 'switch.of',
language: 'en',
utterances: [
'switch of lights',
'switch off lights in %room%',
'turn off lights in %room%'
]
}
}
</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>utterances</td>
<td>array of string</td>
<td>The list of entities</td>
</tr>
<tr>
<td>intent</td>
<td>string</td>
<td>The intent 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>
</script>