LogoLogo
ArchitectureUser CasesPlansOther LanguagesRelease Notes
  • ☁️Welcome to the thingable wiki!
    • Where to begin?
    • Environment
    • Device
      • Create a Device
      • Metadata and Schema
      • Approved equipment
    • Application
      • How to Create an Application
      • Main internal widgets of the APP
      • Parameterization of Graphs
      • Menu Filter Structuring
      • Application Configurator
      • Custom Graphical Interfaces
      • Map Builder
      • Report Settings
    • Alarms
    • Synoptic
      • SVG Editor
      • SVG Booster
      • Synoptic Testing
    • Integrations
      • Logic Builder
      • MQTT Integration
      • FTP/SFTP Integration
      • HTTP/HTTPS Integration
      • thingable! APIs
    • Users
      • How to Create New Users and User Groups?
      • Call management in the thingable support portal!
  • 🏨Architecture
  • 🚜User Cases
  • 👥Contact Us
  • ⁉️Frequently Asked Questions
Powered by GitBook
On this page
  • Getting Started
  • Practical example, date converter
  • Full Code

Was this helpful?

  1. Welcome to the thingable wiki!
  2. Integrations

Logic Builder

Last updated 2 years ago

Was this helpful?

Logic Builder is one of the tools available on the thingable platform! for the development of unforeseen extra functionalities or adjustments in the business logic of each customer. With Logic Builder it is possible to manipulate message packets to make them compatible with other services, create APls to interact with external systems and even create graphical interfaces that can be invoked within the created applications.

The Logic Builder interface brings simplified development by linking code blocks that have the function of executing task flows through a visual programming approach.

The tool can be accessed on the homepage of the environment, as shown in figure 1.

The logic behind the developments, using Logic Builder, is usually made through a combination of input nodes, processing nodes, and output nodes, and when they are connected together, they form what is called "flow".

In Figure 2, we can observe a simple processing flow that can be developed by Logic Builder, presenting a minimum sequence required for the correct functioning of a flow, namely: data input, processing and output.

The data entry is responsible for injecting some information that may come from another service, system, "inject" node or even another flow.

Processing is responsible for handling the information, this node can have a predefined function, or it can be a custom node in JavaScript language using the "function" node.

Exit is responsible for delivering the treated data to another flow or presentation on screen through the "debug" node.

The information that travels between the nodes of a stream is, by convention, json objects called "msg", the properties of that object vary according to the treatment undergone when passing through each node.

Most flows have as their default form the exchange of a payload, called "payload", and have as identification msg.payload. This payload will often be changed along the flow to have the expected result at the exit.

Getting Started

When accessing the Logic Builder tool environment, a screen similar to Figure 3 is presented.

Still in Figure 3, three main parts stand out, namely: 1 - Knots Palette, 2 - Flow Development, 3 - Information.

Due to the extensive number of nodes, it is impossible to talk about each one in this tutorial, so let's focus on a very used node, the "function" node.

The "function" node is important due to the possibility of developing a Javascript code when there is no dedicated node for the specific task to be performed. Often, in a loT application we come across data treatments that are unique to that application, so the use of the "function" node becomes important to manipulate the messages to the desired format.

The following topic presents a practical use of the "function" node.

Practical example, date converter

In loT applications, some devices often present their date and time ranges in UNIX Timestamp. However, in some cases, it is necessary to present the date in a format understandable by the human being, so we will create a UNIX Timestamp converter for human readable format, according to the steps below:

Step 1: Go to Logic Builder.

Step 2: Search the "Knots Palette" for the three nodes: Inject, Function and Debug, and drag them to the "Flow Development" area. Arrange the nodes, as shown in Figure 5.

Step 3: Configure each node as needed, starting with the Inject node. Double-click and the following setup screen will appear:

In this node we won't need the "msg.topic", so we can delete it by clicking on the "x" corresponding to it. We will use as a message payload, that is, our "msg.payload", will be the timestamp value that comes configured as UNIX. Finally, let's put an 'Input' name on this node so that we can easily identify it, click on "Done" and the node will already be configured.

Now let's configure the main node, the processing node, which will be the "Function". Performing the same procedure as before, you will open a window like the one in Figure 7.

In the "On Message" tab, we can create a code that will convert dates, so we will use a Javascript class called "Date", this class provides us with many methods to present the date according to the format we want.

To perform the conversion we will use the code below:

var timestamp = msg.payload; // Allocates the contents of msg.payload to a variable called timestamp.
var date = new Date(timestamp); // Uses the Date Class to create a new date named date.
msg.payload = ("Date: "+date.getDate()+
"/"+(date.getMonth()+1)+
"/"+date.getFullYear()+
" "+date.getHours()+
":"+date.getMinutes()+
":"+date.getSeconds());    // This block identifies each part of the date and saves it in msg.payload.
return msg; //Returns to msg.payload changed and treated for output.

After pasting the code into the editor's development environment, change the name to 'Converter' and click on 'Done', as shown in Figure 8.

Finally, let's change the Debug node, this node will be our exit, it serves mainly to present the content of the message we are expecting to receive in the Information area (Figure 3). To do this, we need to change the node to present the complete message, that is, all the information that comes in the message will be displayed on the debug screen. If you want to see only the payload object, no changes are required.

After changing the output type, from "msg." to "complete msg object", and changing the name to 'Output', click on "Done". Now we can see the message output in the "debug" tab in the info area.

For the flow to work, it is necessary to connect all the blocks. To do this, simply click on the gray square at the end of the desired node, from it will come a line that the user can connect in another block, the result will be as shown in Figure 10. Afterwards, click “Deploy”, take the opportunity to explore and understand the deploy options available.

After clicking "Deploy" the blue circles at the top corner of the nodes disappear, indicating that the flow is ready to run.

Start the flow execution by clicking on the blue square at the left end of the Inbound node. As a result, a message with the Date and Time will be readably available in the debug window.

Full Code

[{"id":"de099b7c48d88bc8","type":"inject","z":"5b0f211e8f151acb","name":"Entrada","props":[{"p":"payload"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payloadType":"date","x":410,"y":120,"wires":[["01df4ed733c410a1"]]},{"id":"ebecacc8c32c02b4","type":"debug","z":"5b0f211e8f151acb","name":"Saída","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"true","targetType":"full","statusVal":"","statusType":"auto","x":730,"y":120,"wires":[]},{"id":"01df4ed733c410a1","type":"function","z":"5b0f211e8f151acb","name":"Conversor ","func":"var timestamp = msg.payload \nvar date = new Date(timestamp);\nmsg.payload = (\"Data: \"+date.getDate()+\n          \"/\"+(date.getMonth()+1)+\n          \"/\"+date.getFullYear()+\n          \" \"+date.getHours()+\n          \":\"+date.getMinutes()+\n          \":\"+date.getSeconds());\nreturn msg;\n","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":570,"y":120,"wires":[["ebecacc8c32c02b4"]]}]

Author: Matheus Widmer

In the We Palette we can find several nodes, each with their functions defined for each situation. And, as there is a need in new applications, it is possible to install new nodes through the "Pallete Manager" feature, located in the upper left menu, represented by the icon , located next to the "deploy" button. It is a good practice to always check if there is already a library of nodes available for installation, which meets some new situation. This menu also reserves another interesting feature called "Import", where it is possible to import and export created flows, and thus share with other users. At the end of this tutorial we provide a test flow that can be imported using this feature.

LogicBuilder is based on the open-source "Node-Red" tool. For more detailed information on the use of the tool just consult the official material:

☁️
https://nodered.org/docs/
Figure 1: Logic Builder Access
Figure 2: Example of fluxo
Figure 3: Logic Builder Environment
Figure 4: Function node
Figure 5: Conversion Flow
Figure 6: Inject node editor
Figure 7: Function node editor
Figure 8: Function node editor
Figure 9: Debug Node Editor
Figure 10: Flow developed