node-red-contrib-viseo-dialogflow
Version:
VISEO Bot Maker - Dialogflow server and NLP
255 lines (226 loc) • 12.1 kB
HTML
<script type="text/javascript">
RED.nodes.registerType('dialogflow', {
category: '💬_language',
color: '#ffcda3',
defaults: {
name: { value: undefined },
tokenv1: { value: undefined, type: 'dialogflow-config', required: false },
tokenv2: { value: undefined, type: 'google-service-account', required: false },
session: { value: "user.id" },
sessionType: { value: "msg" },
language: { value: "en" },
languageType: { value: "str" },
text: { value: "payload" },
textType: { value: "msg" },
intent: { value: "payload" },
action: { value: "query" },
actionitemaddupd: { value: "entities-single" },
actionitemget: { value: "entities-single" },
actionitemdel: { value: "entities-single" },
selaction: { value: "get" },
itemid: { value: undefined },
itemidType: { value: "msg" },
object: { value: undefined },
objectType: { value: "msg" },
version: { value: "v1"}
},
inputs: 1,
outputs: 2,
icon: 'dialogflow.png',
align: 'left',
paletteLabel: 'Dialogflow',
outputLabels: ["stdout", "stderr"],
label: function () { return this.name || 'Dialogflow' },
oneditprepare: function() {
$("#node-input-session").typedInput({ default: 'msg', types: ['msg','str','global'], typeField: $("#node-input-sessionType") });
$("#node-input-language").typedInput({ default: 'str', types: ['msg','str','global'], typeField: $("#node-input-languageType") });
$("#node-input-text").typedInput({ default: 'msg', types: ['msg','str','global'], typeField: $("#node-input-textType") });
$("#node-input-itemid").typedInput({ default: 'msg', types: ['msg','str','global'], typeField: $("#node-input-itemidType") });
$("#node-input-object").typedInput({ default: 'msg', types: ['msg','global','json'], typeField: $("#node-input-objectType") });
$("#node-input-intent").typedInput({ default: 'msg', types: ['msg'], type: 'msg' });
// Change
$("#node-input-version").change(function() {
$("#display_v1").hide();
$("#display_v2").hide();
if ($(this).val() === "v2") $("#display_v2").show();
else $("#display_v1").show();
})
$("#node-input-action").change(showSections);
$("#node-input-selaction").change(setOptions);
$("#node-input-actionitemaddupd, #node-input-actionitemget, #node-input-actionitemdel").change(showParameters);
function showParameters() {
if ($("#node-input-action").val() === "query") return;
let action = $("#node-input-selaction").val();
$(".id").hide();
$(".object").hide();
$("#node-input-object").typedInput('show');
$("#node-input-itmeid").typedInput('show');
if (action.match(/get/i) && $("#node-input-actionitemget").val().match(/single/i)) $(".id").show();
else if (action.match(/add/i)) {
if ($("#node-input-actionitemaddupd").val().match(/entries/i)) $(".id").show();
$(".object").show();
}
else if (action.match(/del/i)) {
if ($("#node-input-actionitemdel").val().match(/entries/i)) $(".object").show();
$(".id").show();
}
else if (action.match(/upd/i)) {
if ($("#node-input-actionitemaddupd").val().match(/single|entries/i)) $(".id").show();
$(".object").show();
}
}
function showSections() {
$(".manage").hide();
$(".query").hide();
if ($("#node-input-action").val() === "query") {
$(".query").show();
$("#node-input-text").typedInput('show');
$("#node-input-language").typedInput('show');
}
else {
setOptions();
$(".manage.main").show();
}
}
function setOptions() {
if ($("#node-input-action").val() === "query") return;
$("#node-input-actionitemaddupd, #node-input-actionitemget, #node-input-actionitemdel").hide();
let value = $("#node-input-selaction").val();
if (value === "add" || value === "upd") $("#node-input-actionitemaddupd").show();
if (value === "get") $("#node-input-actionitemget").show();
if (value === "del") $("#node-input-actionitemdel").show();
showParameters();
}
},
oneditsave: function() {
this.actionitem = $("#node-input-actionitem").val();
}
});
</script>
<script type="text/x-red" data-template-name="dialogflow">
<div class="form-row">
<label for="node-input-name"><i class="icon-tag"></i> Name</label>
<input type="text" id="node-input-name" placeholder="Dialogflow">
</div>
<br>
<b>Dialogflow settings </b>
<div class="form-row">
<br>
<label for="node-input-version"><i class="fa fa-tasks"></i> Version</label>
<select id="node-input-version" style="width:70%;">
<option value="v1" selected>Dialogflow V1 API</option>
<option value="v2">Dialogflow V2 API</option>
</select>
</div>
<div class="form-row" id="display_v1">
<label for="node-input-tokenv1"><i class="fa fa-lock"></i> Tokens</label>
<input type="text" id="node-input-tokenv1" style="width:70%;">
</div>
<div class="form-row" id="display_v2">
<label for="node-input-tokenv2"><i class="fa fa-lock"></i> Tokens</label>
<input type="text" id="node-input-tokenv2" style="width:70%;">
</div>
<div class="form-row">
<label for="node-input-session"><i class="fa fa-user"></i> Session ID</label>
<input type="text" id="node-input-session" style="width:70%;" placeholder="user.id">
<input type="hidden" id="node-input-sessionType">
</div>
<br>
<b>Requests settings</b>
<div class="form-row">
<br>
<label for="node-input-action"><i class="fa fa-navicon"></i> Action</label>
<select id="node-input-action" style="width:70%;">
<option value="query">Query</option>
<option value="manage">Manage</option>
</select>
</div>
<div style="margin-left: 15px; margin-right: 0px; width: 85px; height: 1px; background-color: lightgrey; display:inline-block;"></div><!--
--><div style="margin-left: 0px; margin-right: 0px; width: 70%; height: 1px; background-color: lightgrey; display:inline-block;"></div>
<br><br>
<div class="form-row query">
<label for="node-input-text" style="margin-left:15px; width: 85px; color:#848484"> Text</label>
<input type="text" id="node-input-text" style="width:70%;" placeholder="payload">
<input type="hidden" id="node-input-textType">
</div>
<div class="form-row query">
<label for="node-input-language" style="margin-left:15px; width: 85px; color:#848484"> Language</label>
<input type="text" id="node-input-language" style="width:70%;" placeholder="en">
<input type="hidden" id="node-input-languageType">
</div>
<div class="form-row manage main">
<select id="node-input-selaction" style="margin-left:5px; width: 95px; display:inline-block; color:#848484">
<option style="color:#848484" value="get">Get</option>
<option style="color:#848484" value="add">Add</option>
<option style="color:#848484" value="upd">Update</option>
<option style="color:#848484" value="del">Delete</option>
</select>
<select id="node-input-actionitemaddupd" style="width:70%; display:inline-block;">
<option value="entities-single">A single entity</option>
<option value="intents-single">A single intent</option>
<option value="entities-multiple">Some entities</option>
<option value="entities-entries">Some entity entries from/to an entity</option>
</select>
<select id="node-input-actionitemget" style="width:70%; display:inline-block;">
<option value="entities-single">A single entity</option>
<option value="intents-single">A single intent</option>
<option value="entities-all">All entitiies</option>
<option value="intents-all">All intents</option>
</select>
<select id="node-input-actionitemdel" style="width:70%; display:inline-block;">
<option value="entities-single">A single entity</option>
<option value="intents-single">A single intent</option>
<option value="entities-entries">Some entity entries from/to an entity</option>
</select>
</div>
<div class="form-row manage id">
<label for="node-input-itemid" style="margin-left:15px; width: 85px; color:#848484"> Id</label>
<input type="text" id="node-input-itemid" style="width:70%;">
<input type="hidden" id="node-input-itemidType">
</div>
<div class="form-row manage object">
<label for="node-input-object" style="margin-left:15px; width: 85px; color:#848484"> Object</label>
<input type="text" id="node-input-object" style="width:70%;">
<input type="hidden" id="node-input-objectType">
</div>
<div style="margin-left: 15px; margin-right: 0px; width: 85px; height: 1px; background-color: lightgrey; display:inline-block;"></div><!--
--><div style="margin-left: 0px; margin-right: 0px; width: 70%; height: 1px; background-color: lightgrey; display:inline-block;"></div>
<br><br>
<div class="form-row">
<label for="node-input-intent"><i class="fa fa-sign-out"></i> Output</label>
<input type="text" id="node-input-intent" style="width:70%;" placeholder="payload">
</div>
</script>
<style>
.help-section > ol > h4,
.help-section > h3 { font-weight: bold; }
</style>
<script type="text/x-red" data-help-name="dialogflow">
<p>Uses Google Dialogflow to perfom language understanding. </p>
<h3>Outputs</h3>
<ol class="node-ports">
<li>Standard output</li>
<li>Standard error</li>
</ol>
<h3>Details</h3>
<p>Properties</p>
<dl class="message-properties">
<dt>Tokens <span class="property-type">config</span></dt>
<dd>agent information to connect to Dialogflow</dd>
<dt>Session ID <span class="property-type">string</span></dt>
<dd>id to recognize the sender in Dialogflow UI</dd>
<dt>Output <span class="property-type">string</span></dt>
<dd>where to store the results</dd>
</dl>
<p><i>Query</i> performs NLU with the input text, and <i>Manage</i> allows to add/manage/delete objects such as intents or entities.</p>
<h3>References</h3>
<ul>
<li><a href="https://dialogflow.com/docs/reference/agent/intents">Intents API</a> - reference</li>
<li><a href="https://dialogflow.com/docs/reference/agent/entities">Entities API</a> - reference</li>
<li><a href="https://github.com/NGRP/node-red-contrib-viseo/">VISEO BotMaker</a> - the nodes github repository</li>
</ul>
<h3>Tracking</h3>
<p>This node is likely to display an error message if no key is configured in the VISEO Bot Maker project.
If such an error appears, please get a key <a href="https://key.bot.viseo.io/">here</a>.
</p>
</script>