UNPKG

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

379 lines (371 loc) 14.5 kB
<script type="text/javascript"> $.RedBot.registerType('chatbot-invoice', { category: $.RedBot.config.name, color: '#FFCC66', defaults: { name: { value: '' }, title: { value: '' }, description: { value: '' }, payload: { value: '' }, photoUrl: { value: '' }, photoWidth: { value: '' }, photoHeight: { value: '' }, currency: { value: '' }, needName: { value: true }, needEmail: { value: false }, needPhoneNumber: { value: false }, needShippingAddress: { value: false }, isFlexible: { value: false }, prices: { value: [], validate: function(value) { return $.RedBot.validate.prices(value); } } }, inputs: 1, outputs: 1, paletteLabel: 'Invoice', icon: 'chatbot-invoice.png', label: function() { return this.name || 'Invoice'; }, oneditsave: function() { var prices = $("#node-input-items-container").editableList('items'); var node = this; node.prices = []; var idx; for(idx = 0; idx < prices.length; idx++) { var container = $(prices[idx]); node.prices.push({ label: $('input[name=label]', container).val(), amount: $('input[name=amount]', container).val() }); } }, oneditprepare: function() { $('#node-input-items-container') .css('min-height','300px') .css('min-width','450px') .editableList({ addButton: 'Add invoice item', addItem: function(container, i, item) { var row = $('<div/>').appendTo(container); row .append('<input style="width:70%;margin-left:10px;" type="text" name="label" placeholder="Description"/>') .append('<input style="width:25%;margin-left:10px;" type="text" name="amount" placeholder="Amount"/>'); if (item.label != null) { $('input[name=label]', container).val(item.label); } if (item.amount != null) { $('input[name=amount]', container).val(item.amount); } }, removable: true, sortable: true }); var prices = this.prices; var idx; for (idx = 0; idx < prices.length; idx++) { $('#node-input-items-container').editableList('addItem', prices[idx]); } } }); </script> <script type="text/x-red" data-template-name="chatbot-invoice"> <div class="form-row form-row-name"> <label for="node-input-name"><i class="icon-tag"></i> Name</label> <input type="text" id="node-input-name" placeholder="Name"> </div> <div class="form-row form-row-title"> <label for="node-input-name">Title</label> <input type="text" id="node-input-title" placeholder="Title"> </div> <div class="form-row form-row-description"> <label for="node-input-description">Description</label> <textarea id="node-input-description" placeholder="Invoice description" style="width:93%;height:50px;"></textarea> </div> <div class="form-row form-row-payload"> <label for="node-input-payload">Payload</label> <input type="text" id="node-input-payload" placeholder="Invoice Payload"> </div> <div class="form-row form-row-currency"> <label for="node-input-currency">Currency</label> <select id="node-input-currency" placeholder="Select currency"> <option value="AED">United Arab Emirates Dirham</option> <option value="AFN">Afghan Afghani</option> <option value="ALL">Albanian Lek</option> <option value="AMD">Armenian Dram</option> <option value="ARS">Argentine Peso</option> <option value="AUD">Australian Dollar</option> <option value="AZN">Azerbaijani Manat</option> <option value="BAM">Bosnia & Herzegovina Convertible Mark</option> <option value="BDT">Bangladeshi Taka</option> <option value="BGN">Bulgarian Lev</option> <option value="BND">Brunei Dollar</option> <option value="BOB">Bolivian Boliviano</option> <option value="BRL">Brazilian Real</option> <option value="CAD">Canadian Dollar</option> <option value="CHF">Swiss Franc</option> <option value="CLP">Chilean Peso</option> <option value="CNY">Chinese Renminbi Yuan</option> <option value="COP">Colombian Peso</option> <option value="CRC">Costa Rican Colón</option> <option value="CZK">Czech Koruna</option> <option value="DKK">Danish Krone</option> <option value="DOP">Dominican Peso</option> <option value="DZD">Algerian Dinar</option> <option value="EGP">Egyptian Pound</option> <option value="EUR">Euro</option> <option value="GBP">British Pound</option> <option value="GEL">Georgian Lari</option> <option value="GTQ">Guatemalan Quetzal</option> <option value="HKD">Hong Kong Dollar</option> <option value="HNL">Honduran Lempira</option> <option value="HRK">Croatian Kuna</option> <option value="HUF">Hungarian Forint</option> <option value="IDR">Indonesian Rupiah</option> <option value="ILS">Israeli New Sheqel</option> <option value="INR">Indian Rupee</option> <option value="ISK">Icelandic Króna</option> <option value="JMD">Jamaican Dollar</option> <option value="JPY">Japanese Yen</option> <option value="KES">Kenyan Shilling</option> <option value="KGS">Kyrgyzstani Som</option> <option value="KRW">South Korean Won</option> <option value="KZT">Kazakhstani Tenge</option> <option value="LBP">Lebanese Pound</option> <option value="LKR">Sri Lankan Rupee</option> <option value="MAD">Moroccan Dirham</option> <option value="MDL">Moldovan Leu</option> <option value="MNT">Mongolian Tögrög</option> <option value="MUR">Mauritian Rupee</option> <option value="MVR">Maldivian Rufiyaa</option> <option value="MXN">Mexican Peso</option> <option value="MYR">Malaysian Ringgit</option> <option value="MZN">Mozambican Metical</option> <option value="NGN">Nigerian Naira</option> <option value="NIO">Nicaraguan Córdoba</option> <option value="NOK">Norwegian Krone</option> <option value="NPR">Nepalese Rupee</option> <option value="NZD">New Zealand Dollar</option> <option value="PAB">Panamanian Balboa</option> <option value="PEN">Peruvian Nuevo Sol</option> <option value="PHP">Philippine Peso</option> <option value="PKR">Pakistani Rupee</option> <option value="PLN">Polish Złoty</option> <option value="PYG">Paraguayan Guaraní</option> <option value="QAR">Qatari Riyal</option> <option value="RON">Romanian Leu</option> <option value="RSD">Serbian Dinar</option> <option value="RUB">Russian Ruble</option> <option value="SAR">Saudi Riyal</option> <option value="SEK">Swedish Krona</option> <option value="SGD">Singapore Dollar</option> <option value="THB">Thai Baht</option> <option value="TJS">Tajikistani Somoni</option> <option value="TRY">Turkish Lira</option> <option value="TTD">Trinidad and Tobago Dollar</option> <option value="TWD">New Taiwan Dollar</option> <option value="TZS">Tanzanian Shilling</option> <option value="UAH">Ukrainian Hryvnia</option> <option value="UGX">Ugandan Shilling</option> <option value="USD">United States Dollar</option> <option value="UYU">Uruguayan Peso</option> <option value="UZS">Uzbekistani Som</option> <option value="VND">Vietnamese Đồng</option> <option value="YER">Yemeni Rial</option> <option value="ZAR">South African Rand</option> </select> </div> <div class="form-row form-row-label" style="margin-bottom:0;"> <label><span>Invoice items</span></label> </div> <div class="form-row node-input-rule-container-row"> <ol id="node-input-items-container"></ol> </div> <div class="form-row form-row-photoUrl"> <label for="node-input-photoUrl">Photo URL</label> <input type="text" id="node-input-photoUrl" placeholder="Photo URL"> </div> <div class="form-row form-row-checkbox"> <label for="node-input-needShippingAddress">&nbsp;</label> <input type="text" id="node-input-photoWidth" placeholder="Width" style="width:150px;"> &nbsp;X&nbsp; <input type="text" id="node-input-photoHeight" placeholder="Height" style="width:150px;"> </div> <div class="form-row form-row-checkbox"> <label for="node-input-needName">User Data</label> <input type="checkbox" value="true" id="node-input-needName"> Requires name </div> <div class="form-row form-row-checkbox"> <label for="node-input-needEmail">&nbsp;</label> <input type="checkbox" value="true" id="node-input-needEmail"> Requires email </div> <div class="form-row form-row-checkbox"> <label for="node-input-needPhoneNumber">&nbsp;</label> <input type="checkbox" value="true" id="node-input-needPhoneNumber"> Requires phone number </div> <div class="form-row form-row-checkbox"> <label for="node-input-needShippingAddress">&nbsp;</label> <input type="checkbox" value="true" id="node-input-needShippingAddress"> Requires shipping address </div> <br/> <div class="form-row form-row-checkbox"> <label for="node-input-isFlexible">Shipping</label> <input type="checkbox" value="true" id="node-input-isFlexible">Flexible order <div class="redbot-form-hint"> Shipping fees are calculated dinamically using a <code>Invoice Shipping node</code> </div> </div> </script> <script type="text/x-red" data-help-name="chatbot-invoice"><p>This node creates an Invoice to trigger a payment in <strong>Telegram</strong>. To learn more about Telegram payments <a href="https://core.telegram.org/bots/payments">read here</a>.</p> <p>In order to start a payment process a <strong>providerToken</strong> is needed: use @BotFather to get a providerToken for a supported payment platform (like Stripe) and set this in the chat bot config <a href="https://www.notion.so/d7159ae828804a8784a639e6cdbdb95d">Telegram Menu node</a> .</p> <p>The <code>payload</code> parameter is a unique identifier for the invoice being processed, tipically is your <em>order-id</em> or <em>cart-id</em> and it will be sent back by Telegram when the payment is completed (not to be confused by <strong>Node-RED</strong>’s <code>message.payload</code>).</p> <p>All the elements of the <code>Invoice node</code> supports chat context templating, for example it’s possible to set the title of the invoice to <code>Invoice to {{firstName}} {{lastName}}</code> and the amount of an item to <code>{{currentPrice}}</code> (given that somewhere is defined in the chat context the key <em>currentPrice</em>) and the template tokens will be replaced by the actual values.</p> <p>The <em>Flexible order</em> means that the final prices depends on the shipping method choosen by the user. When this happens the chatbot receives a message with type <code>invoice-shipping</code> that should be followed by a response unsing <a href="https://www.notion.so/60c4b7025cde40378e87e7c3113907ed">Telegram Invoice Shipping node</a> . If this doesn’t happen, then the order will not be finalized.</p> <p>When the payment is complete, a message type <code>payment</code> is sent to the chatbot with all the information provided by the user (email, phone number, shipping address). At this point the chatbot generally uses the <a href="https://www.notion.so/4113636f565d4ff4af08bc61a644206b">Rules node</a> to redirect these type of messages to an appropriate flow that uses the <code>payload</code> attribute to lookup in the database and flag the order as <em>paid</em>.</p> <p>The <code>payment</code> message payload</p> <pre><code class="language-javascript">{ currency: &#39;EUR&#39;, total_amount: 1423, invoice_payload: &#39;MY_STRING_PAYLOAD&#39;, shipping_option_id: &#39;my_shipping_id&#39;, order_info: { name: &#39;Guido Bellomo&#39;, phone_number: &#39;a-cell-phone-number&#39;, shipping_address: { country_code: &#39;IT&#39;, state: &#39;Mi&#39;, city: &#39;Milano&#39;, street_line1: &#39;Via Di Qua, 12&#39;, street_line2: &#39;&#39;, post_code: &#39;20100&#39; } }, telegram_payment_charge_id: &#39;_&#39;, provider_payment_charge_id: &#39;ch_xxxyyyyzzzz&#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>title</td> <td>string</td> <td>The title of the invoice</td> </tr> <tr> <td>description</td> <td>string</td> <td>The description of the invoice</td> </tr> <tr> <td>payload</td> <td>string</td> <td>A custom string that identifies the order or the cart in your system, it will be returned when the payment is confirmed</td> </tr> <tr> <td>currency</td> <td>string</td> <td>Three letters <a href="https://www.wikiwand.com/en/ISO_4217">ISO code</a> for the currency, for example <em>USD</em>, <em>EUR</em>, etc.</td> </tr> <tr> <td>needName</td> <td>boolean</td> <td>The user’s name is required to complete the payment</td> </tr> <tr> <td>needEmail</td> <td>boolean</td> <td>The user’s email is required to complete the payment</td> </tr> <tr> <td>needPhoneNumber</td> <td>boolean</td> <td>The user’s phone number is required to complete the payment</td> </tr> <tr> <td>needShippingAddress</td> <td>boolean</td> <td>The user’s shipping address is required to complete the payment</td> </tr> <tr> <td>isFlexible</td> <td>boolean</td> <td>The total amount depends on the shipping method, a message type <code>invoice-shipping</code> will be sent to the chatbot that requires a [[Invoice Shipping node</td> </tr> <tr> <td>prices</td> <td>array of [price]</td> <td>Items of the invoice</td> </tr> <tr> <td>photoUrl</td> <td>string</td> <td>Url of the picture for the invoice</td> </tr> <tr> <td>photoHeight</td> <td>integer</td> <td>Width of the invoice picture. Required with <em>photoUrl</em></td> </tr> <tr> <td>photoWidth</td> <td>integer</td> <td>Height of the invoice picture. Required with <em>photoUrl</em></td> </tr> </tbody></table> <p>The <code>[price]</code> object</p> <table> <thead> <tr> <th>Name</th> <th>Type</th> <th>Description</th> </tr> </thead> <tbody><tr> <td>label</td> <td>string</td> <td>The description of the invoice item</td> </tr> <tr> <td>amount</td> <td>number</td> <td>The total amount for this invoice item</td> </tr> </tbody></table> </script>