JSFiddle - React, Tailwind, and code Playground

by Peyton Hessler

HTML

<br/> Select two nodes:
<br />From
<select id="from">
  <option value="A">A</option>
  <option value="B">B</option>
  <option value="C">C</option>
  <option value="D">D</option>
  <option value="E">E</option>
  <option value="F">F</option>
  <option value="G">G</option>
</select>
To
<select id="to">
  <option value="G">G</option>
  <option value="F">F</option>
  <option value="E">E</option>
  <option value="D">D</option>
  <option value="C">C</option>
  <option value="B">B</option>
  <option value="A">A</option>
</select>
<input type="button" onclick="calculate();" value="Calculate" />
<br/>
<p id="output1" />

JavaScript

function Graph() {
  this.nodes = [];
  this.edges = [];
  this.paths = [];

  this.addNode = function(node) {
    this.edges[node] = [];
  };

  this.addEdge = function(from, to, cost) {
    this.edges[from][to] = cost;
    this.edges[to][from] = cost;
  };

  this.findAllPaths = function(from, to, cost, paths) {
    paths.push(from);

    if (from == to) {
      printPath(paths, cost);
    } else {

      for (var p in this.edges[from]) {
        if (paths.indexOf(p) < 0) {
          var this_cost = this.edges[from][p];
          this.findAllPaths(p, to, cost + this_cost, paths);
        }
      }
    }
    paths.pop();
  };
}

function printPath(paths, cost) {
  var value = paths[0];
  for (var i = 1; i < paths.length; i++) {
    value = value + ", " + paths[i];
  }
  value += " - " + cost;
  var str = document.getElementById("output1");
  str.innerHTML += value + "<br/>";
}






function calculate() {
  var output = document.getElementById("output1");
  output.innerHTML = "";
  var x = document.getElementById("from").value;
  var y = document.getElementById("to").value;
  var graph = new Graph();
  graph.addNode('A');
  graph.addNode('B');
  graph.addNode('C');
  graph.addNode('D');
  graph.addNode('E');
  graph.addNode('F');
 	graph.addNode('G');
  graph.addEdge('A', 'B', 2);
  graph.addEdge('A', 'C', 1);
  graph.addEdge('B', 'D', 1);
  graph.addEdge('B', 'G', 1);
  graph.addEdge('C', 'D', 1);
  graph.addEdge('C', 'E', 1);
  graph.addEdge('D', 'E', 2);
  graph.addEdge('D', 'F', 1);
  graph.addEdge('D', 'G', 2);
  document.getElementById("output1").innerHTML += "The path from " + x + " to " + y +  " is printed below" + "<br/>";
 graph.findAllPaths(x, y, 0, []);
}