Потоковое программирование js html ui

Мне нужна ваша большая помощь в том, как создать пользовательский интерфейс на основе простого потока в JS.

Для моей простой структуры у меня будет 3 группы узлов, которые будут подключаться следующим образом:

Вход -> Процесс -> выход

В приведенном ниже примере я хотел бы просто начать со статического входного значения x = 65, которое может быть подключено через соединитель к процессу x + 10 или x + 10000, и в зависимости от того, что когда-либо было выбрано, выход будет показано.

Так что это в основном функция:

function input(){
x=65;
return x;
}

function processadd10(x){
x=x+10;
return x;
}

function processadd10000(x){
x=x+10000;
return x;
}

function output(x){
return "after processing the value of X is".X;
}

Часть, в которой мне нужна помощь, - это то, как я могу реализовать пользовательский интерфейс на основе потока, в котором я могу перетаскивать и соединять соответствующие поля для создания вывода.

Буду признателен за любую помощь в создании простого пользовательского интерфейса, чтобы сделать следующее.