search

jerosoler / Drawflow

Simple flow library 🖥️🖱️
https://jerosoler.github.io/Drawflow/
MIT License
4.42k stars 714 forks source link

i am getting issue with multiple connection, it is not connecting properly #734

Open nikultaka opened 12 months ago

nikultaka commented 12 months ago

i am getting issue with multiple connection, it is not connecting properly, here i have attached file for that, can you check the code and tell me what's issue in that, why dot is not connected properly ? any help help will really appreciated, here i have attached me code for that

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/jerosoler/Drawflow/dist/drawflow.min.css"/>
  <script src="https://cdn.jsdelivr.net/gh/jerosoler/Drawflow/dist/drawflow.min.js"></script>
</head>
<body>
<div id="drawflow"></div>
  <style>
    #drawflow { 
      position: relative;
      text-align:initial;
      width: 100%;
      height: 800px;
      border: 1px solid red;
    }

</style>
<script>
    var id = document.getElementById("drawflow");
    const editor = new Drawflow(id);
    editor.reroute = true;
    editor.start();

editor.import({"drawflow":{
  "Home": {
    "data": {
      "1": {
        "id": 1,
        "name": "start",
        "data": {},
        "class": "start",
        "html": "\n    <span class=\"node-type\">Start</span><div class=\"open_edit_block\">\n      <div class=\"title-box\"><i class=\"node-i node-i-grey material-icons-outlined\">start</i></div>\n      <div class=\"box\">Keywords enabled\n<hr> <b>Keywords</b> \n \n welcome, home, start     </div>\n    </div><span class=\"next_step\"></span>\n    ",
        "typenode": false,
        "inputs": {},
        "outputs": {
          "output_1": {
            "connections": [
              {}
            ]
          }
        },
        "pos_x": -932,
        "pos_y": 124
      },
      "2": {
        "id": "2",
        "name": "cardt",
        "data": [],
        "class": "cardt",
        "html": "<div><span class=\"node-type\">Card</span>\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"text\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"hjgjhg\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"text\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"hghg\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"ai\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"Answer One\">\n                    <i class=\"node-i node-i-grey material-icons-outlined\">web_stories</i><span class=\"node-section single\">Single</span>\n                        <img src=\"http://127.0.0.1:8000/storage/1689063249_Screenshot from 2023-07-06 11-39-39.png\" class=\"small-img\" style=\"width:229px;height:120px\">\n                        <div class=\"panel\"><b>Ask question s</b><br><small>Subtitle 80 pixels</small></div>\n                        <div class=\"multiple\"><div class=\"panel\">Yes<div class=\"link output_1\"></div></div><div class=\"panel\">No<div class=\"link output_2\"></div></div><div class=\"panel\">No Match<div class=\"link output_3\"></div></div></div> </div><span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": []
          }
        },
        "outputs": {
          "output_1": {
            "connections": [
              {
                "node": "46",
                "output": "input_1"
              }
            ]
          },
          "output_2": {
            "connections": [
              {
                "node": "62",
                "output": "input_1"
              }
            ]
          },
          "output_3": {
            "connections": [
              {
                "node": "33",
                "output": "input_1"
              }
            ]
          },
          "output_4": {
            "connections": []
          }
        },
        "pos_x": 100,
        "pos_y": 50
      },
      "23": {
        "id": 23,
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">hghg</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "46",
                "input": "output_1"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 1054,
        "pos_y": 51
      },
      "33": {
        "id": 33,
        "name": "ait",
        "data": [],
        "class": "ait",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">Answer One</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "2",
                "input": "output_3"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 394,
        "pos_y": 311
      },
      "46": {
        "id": "46",
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span class=\"node-section single\">Single</span>\n                <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"text\">\n                <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"hghg\">\n                <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"text\">\n                <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"jhjhjh\">\n                <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"\">\n                <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"undefined\">\n                                <div class=\"title-box\">hjgjhg</div>\n                                <div class=\"multiple\"><div class=\"panel\">b1<div class=\"link output_1\"></div></div><div class=\"panel\">b2<div class=\"link output_2\"></div></div>\n                                </div>\n                                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "2",
                "input": "output_1"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": [
              {
                "node": "23",
                "output": "input_1"
              }
            ]
          },
          "output_2": {
            "connections": [
              {
                "node": "92",
                "output": "input_1"
              }
            ]
          },
          "output_3": {
            "connections": [
              {
                "node": "93",
                "output": "input_1"
              }
            ]
          }
        },
        "pos_x": 613,
        "pos_y": 20
      },
      "62": {
        "id": 62,
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">hghg</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "2",
                "input": "output_2"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 389,
        "pos_y": 177
      },
      "92": {
        "id": 92,
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">jhjhjh</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "46",
                "input": "output_2"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 1128,
        "pos_y": 161
      },
      "93": {
        "id": 93,
        "name": "audiot",
        "data": {},
        "class": "audiot",
        "html": "\n                        <span class=\"node-type\">Audio</span> <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"\"><div class=\"align-items-start\"><i class=\"node-i node-i-grey material-icons-outlined\">mic</i><span class=\"node-section single\">Single</span>\n                        <div class=\"title-box\">\n                        <audio controls class=\"embed-responsive-item\">\n                        <source src=\"https://download.samplelib.com/mp3/sample-9s.mp3\">\n                        </audio>\n                        </div>\n                        <div class=\"multiple\">\n                                <div class=\"panel\">Main menu<div class=\"link output_1\"></div></div>\n                                <div class=\"panel\">Restaurants<div class=\"link output_2\"></div></div>\n                                <div class=\"panel\">Accommodation<div class=\"link output_3\"></div></div>\n                            </div>\n                            </div><span class=\"next_step\"></span>\n            ",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "46",
                "input": "output_3"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          },
          "output_2": {
            "connections": []
          },
          "output_3": {
            "connections": []
          },
          "output_4": {
            "connections": []
          }
        },
        "pos_x": 966.1499938964844,
        "pos_y": 247
      }
    }
  },
  "Other": {
    "data": {
      "1": {
        "id": 1,
        "name": "start",
        "data": {},
        "class": "start",
        "html": "\n    <span class=\"node-type\">Start</span><div class=\"open_edit_block\">\n      <div class=\"title-box\"><i class=\"node-i node-i-grey material-icons-outlined\">start</i></div>\n      <div class=\"box\"><div class=\"form-check form-switch\">\n<input class=\"form-check-input\" type=\"checkbox\" id=\"keywordsON\"><label class=\"form-check-label\" for=\"keywordsOFF\">Keywords enabled</label></div>\n      </div>\n    </div><span class=\"next_step\"></span>\n    ",
        "typenode": false,
        "inputs": {},
        "outputs": {
          "output_1": {
            "connections": [
              {}
            ]
          }
        },
        "pos_x": 150,
        "pos_y": 150
      }
    }
  }
}});

</script>
</body>
</html>
jerosoler commented 12 months ago

Remove class from nodes link output_*

Correct html:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/jerosoler/Drawflow/dist/drawflow.min.css"/>
  <script src="https://cdn.jsdelivr.net/gh/jerosoler/Drawflow/dist/drawflow.min.js"></script>
</head>
<body>
<div id="drawflow"></div>
  <style>
    #drawflow { 
      position: relative;
      text-align:initial;
      width: 100%;
      height: 800px;
      border: 1px solid red;
    }

</style>
<script>
    var id = document.getElementById("drawflow");
    const editor = new Drawflow(id);
    editor.reroute = true;
    editor.start();

editor.import({"drawflow":{
  "Home": {
    "data": {
      "1": {
        "id": 1,
        "name": "start",
        "data": {},
        "class": "start",
        "html": "\n    <span class=\"node-type\">Start</span><div class=\"open_edit_block\">\n      <div class=\"title-box\"><i class=\"node-i node-i-grey material-icons-outlined\">start</i></div>\n      <div class=\"box\">Keywords enabled\n<hr> <b>Keywords</b> \n \n welcome, home, start     </div>\n    </div><span class=\"next_step\"></span>\n    ",
        "typenode": false,
        "inputs": {},
        "outputs": {
          "output_1": {
            "connections": [
              {}
            ]
          }
        },
        "pos_x": -932,
        "pos_y": 124
      },
      "2": {
        "id": "2",
        "name": "cardt",
        "data": [],
        "class": "cardt",
        //"html": "<div><span class=\"node-type\">Card</span>\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"text\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"hjgjhg\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"text\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"hghg\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"ai\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"Answer One\">\n                    <i class=\"node-i node-i-grey material-icons-outlined\">web_stories</i><span class=\"node-section single\">Single</span>\n                        <img src=\"http://127.0.0.1:8000/storage/1689063249_Screenshot from 2023-07-06 11-39-39.png\" class=\"small-img\" width=\"229px\" height=\"120px\">\n                        <div class=\"panel\"><b>Ask question s</b><br><small>Subtitle 80 pixels</small></div>\n                        <div class=\"multiple\"><div class=\"panel\">Yes<div ></div></div><div class=\"panel\">No<div ></div></div><div class=\"panel\">No Match<div ></div></div></div> </div><span class=\"next_step\"></span>",
        "html": "<div><span class=\"node-type\">Card</span>\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"text\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"hjgjhg\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"text\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"hghg\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"ai\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"Answer One\">\n                    <i class=\"node-i node-i-grey material-icons-outlined\">web_stories</i><span class=\"node-section single\">Single</span>\n                        <img src=\"http://127.0.0.1:8000/storage/1689063249_Screenshot from 2023-07-06 11-39-39.png\" class=\"small-img\" width=\"229px\" height=\"120px\">\n                        <div class=\"panel\"><b>Ask question s</b><br><small>Subtitle 80 pixels</small></div>\n                        <div class=\"multiple\"><div class=\"panel\">Yes<div ></div></div><div class=\"panel\">No<div ></div></div><div class=\"panel\">No Match<div ></div></div></div> </div><span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": []
          }
        },
        "outputs": {
          "output_1": {
            "connections": [
              {
                "node": "46",
                "output": "input_1"
              }
            ]
          },
          "output_2": {
            "connections": [
              {
                "node": "62",
                "output": "input_1"
              }
            ]
          },
          "output_3": {
            "connections": [
              {
                "node": "33",
                "output": "input_1"
              }
            ]
          },
          "output_4": {
            "connections": []
          }
        },
        "pos_x": 100,
        "pos_y": 50
      },
      "23": {
        "id": 23,
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">hghg</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "46",
                "input": "output_1"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 1054,
        "pos_y": 51
      },
      "33": {
        "id": 33,
        "name": "ait",
        "data": [],
        "class": "ait",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">Answer One</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "2",
                "input": "output_3"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 394,
        "pos_y": 311
      },
      "46": {
        "id": "46",
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span class=\"node-section single\">Single</span>\n                <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"text\">\n                <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"hghg\">\n                <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"text\">\n                <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"jhjhjh\">\n                <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"\">\n                <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"undefined\">\n                                <div class=\"title-box\">hjgjhg</div>\n                                <div class=\"multiple\"><div class=\"panel\">b1<div ></div></div><div class=\"panel\">b2<div ></div></div>\n                                </div>\n                                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "2",
                "input": "output_1"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": [
              {
                "node": "23",
                "output": "input_1"
              }
            ]
          },
          "output_2": {
            "connections": [
              {
                "node": "92",
                "output": "input_1"
              }
            ]
          },
          "output_3": {
            "connections": [
              {
                "node": "93",
                "output": "input_1"
              }
            ]
          }
        },
        "pos_x": 613,
        "pos_y": 20
      },
      "62": {
        "id": 62,
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">hghg</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "2",
                "input": "output_2"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 389,
        "pos_y": 177
      },
      "92": {
        "id": 92,
        "name": "textt",
        "data": [],
        "class": "textt",
        "html": "<span class=\"node-type\">Text</span><i class=\"node-i node-i-grey material-icons-outlined\">chat</i><span\n                class=\"node-section single\">Single</span>\n                <div class=\"title-box\">jhjhjh</div>\n                <span class=\"next_step\"></span>",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "46",
                "input": "output_2"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          }
        },
        "pos_x": 1128,
        "pos_y": 161
      },
      "93": {
        "id": 93,
        "name": "audiot",
        "data": {},
        "class": "audiot",
        "html": "\n                        <span class=\"node-type\">Audio</span> <input type=\"hidden\" id=\"selected_button_action_hdn_1\" name=\"selected_button_action_hdn_1\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_1\" name=\"selected_button_action_val_hdn_1\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_2\" name=\"selected_button_action_hdn_2\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_2\" name=\"selected_button_action_val_hdn_2\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_hdn_3\" name=\"selected_button_action_hdn_3\" value=\"\">\n                        <input type=\"hidden\" id=\"selected_button_action_val_hdn_3\" name=\"selected_button_action_val_hdn_3\" value=\"\"><div class=\"align-items-start\"><i class=\"node-i node-i-grey material-icons-outlined\">mic</i><span class=\"node-section single\">Single</span>\n                        <div class=\"title-box\">\n                        <audio controls class=\"embed-responsive-item\">\n                        <source src=\"https://download.samplelib.com/mp3/sample-9s.mp3\">\n                        </audio>\n                        </div>\n                        <div class=\"multiple\">\n                                <div class=\"panel\">Main menu<div ></div></div>\n                                <div class=\"panel\">Restaurants<div ></div></div>\n                                <div class=\"panel\">Accommodation<div ></div></div>\n                            </div>\n                            </div><span class=\"next_step\"></span>\n            ",
        "typenode": false,
        "inputs": {
          "input_1": {
            "connections": [
              {
                "node": "46",
                "input": "output_3"
              }
            ]
          }
        },
        "outputs": {
          "output_1": {
            "connections": []
          },
          "output_2": {
            "connections": []
          },
          "output_3": {
            "connections": []
          },
          "output_4": {
            "connections": []
          }
        },
        "pos_x": 966.1499938964844,
        "pos_y": 247
      }
    }
  },
  "Other": {
    "data": {
      "1": {
        "id": 1,
        "name": "start",
        "data": {},
        "class": "start",
        "html": "\n    <span class=\"node-type\">Start</span><div class=\"open_edit_block\">\n      <div class=\"title-box\"><i class=\"node-i node-i-grey material-icons-outlined\">start</i></div>\n      <div class=\"box\"><div class=\"form-check form-switch\">\n<input class=\"form-check-input\" type=\"checkbox\" id=\"keywordsON\"><label class=\"form-check-label\" for=\"keywordsOFF\">Keywords enabled</label></div>\n      </div>\n    </div><span class=\"next_step\"></span>\n    ",
        "typenode": false,
        "inputs": {},
        "outputs": {
          "output_1": {
            "connections": [
              {}
            ]
          }
        },
        "pos_x": 150,
        "pos_y": 150
      }
    }
  }
}});

</script>
</body>
</html>