Add layout feature

Author: 64json

.bin/batchFix.js

@@ -0,0 +1,43 @@
+const path = require('path');
+const fs = require('fs');
+
+const isDirectory = dirPath => fs.lstatSync(dirPath).isDirectory();
+const listFiles = dirPath => fs.readdirSync(dirPath).filter(fileName => !fileName.startsWith('.'));
+const listDirectories = dirPath => listFiles(dirPath).filter(fileName => isDirectory(path.resolve(dirPath, fileName)));
+
+const rootPath = path.resolve(__dirname, '..');
+listDirectories(rootPath).forEach(category => {
+  const categoryPath = path.resolve(rootPath, category);
+  listDirectories(categoryPath).forEach(algorithm => {
+    const algorithmPath = path.resolve(categoryPath, algorithm);
+    listFiles(algorithmPath).filter(file => /\.js$/.test(file)).forEach(file => {
+      const filePath = path.resolve(algorithmPath, file);
+      const content = fs.readFileSync(filePath, 'utf8');
+
+      const variables = [];
+      let lineNumber = -1;
+      let needDelay = false;
+      const lines = content.split('\n').map((line, i) => {
+        const match = /^\s*const (\w+) = new \w*Tracer\(/g.exec(line);
+        if (match) {
+          variables.push(match[1]);
+          lineNumber = i;
+          line = line.replace(/\.delay\(\s*\)/g, () => {
+            needDelay = true;
+            return '';
+          });
+        }
+        return line.replace(' } = require(\'algorithm-visualizer\')', ', Layout, VerticalLayout } = require(\'algorithm-visualizer\')');
+      });
+
+      if (~lineNumber) {
+        const line = `Layout.setRoot(new VerticalLayout([${variables.join(', ')}]))${needDelay ? '.delay()' : ''};`;
+        lines.splice(lineNumber + 1, 0, line);
+        const newContent = lines.join('\n');
+        fs.writeFileSync(filePath, newContent, 'utf8');
+      } else {
+        console.error('wtf');
+      }
+    });
+  });
+});

Backtracking/Knight's Tour Problem/code.js

@@ -1,4 +1,4 @@
-const { Array1DTracer, Array2DTracer, LogTracer } = require('algorithm-visualizer');
+const { Array1DTracer, Array2DTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 /*
 For N>3 the time taken by this algorithm is sufficiently high
@@ -28,7 +28,8 @@ pos[0] = pos[1] = -1;
 
 const boardTracer = new Array2DTracer('Board').set(board);
 const posTracer = new Array1DTracer('Knight Position').set(pos);
-const logTracer = new LogTracer('Console').delay();
+const logTracer = new LogTracer('Console');
+Layout.setRoot(new VerticalLayout([boardTracer, posTracer, logTracer])).delay();
 
 function knightTour(x, y, moveNum) {
   if (moveNum === N * N) {

Backtracking/N-Queens Problem/code.js

@@ -1,4 +1,4 @@
-const { Array2DTracer, LogTracer } = require('algorithm-visualizer');
+const { Array2DTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const N = 4; // just change the value of N and the visuals will reflect the configuration!
 const board = (function createArray(N) {
@@ -19,6 +19,7 @@ const queens = (function qSetup(N) {
 const boardTracer = new Array2DTracer('Board');
 const queenTracer = new Array2DTracer('Queen Positions');
 const logger = new LogTracer('Progress');
+Layout.setRoot(new VerticalLayout([boardTracer, queenTracer, logger]));
 
 boardTracer.set(board);
 queenTracer.set(queens);

Branch and Bound/Binary Search Tree/insertion.js

@@ -1,11 +1,12 @@
-const { Array1DTracer, GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { Array1DTracer, GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const T = {};
 
 const elements = [5, 8, 10, 3, 1, 6, 9, 7, 2, 0, 4]; // item to be inserted
 const graphTracer = new GraphTracer(' BST - Elements marked red indicates the current status of tree ');
 const elemTracer = new Array1DTracer(' Elements ').set(elements);
 const logger = new LogTracer(' Log ');
+Layout.setRoot(new VerticalLayout([graphTracer, elemTracer, logger]));
 graphTracer.log(logger).delay();
 
 function bstInsert(root, element, parent) { // root = current node , parent = previous node

Branch and Bound/Binary Search Tree/search.js

@@ -1,4 +1,4 @@
-const { GraphTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -31,6 +31,7 @@ const T = [ // mapping to G as a binary tree , [i][0] indicates left child, [i][
 const key = new Randomize.Integer(0, G.length - 1).create(); // item to be searched
 const tracer = new GraphTracer(' Binary Search Tree ').set(G).layoutTree(5);
 const logger = new LogTracer(' Log ');
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 tracer.log(logger).delay();
 
 function bst(item, node, parent) { // node = current node , parent = previous node

Branch and Bound/Binary Search/iterative.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(15, new Randomize.Integer(0, 50)).sorted().create();
 tracer.set(D).delay();
 

Branch and Bound/Binary Search/recursive.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(15, new Randomize.Integer(0, 50)).sorted().create();
 tracer.set(D).delay();
 

Branch and Bound/Depth-Limited Search/code.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer();
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 tracer.log(logger);
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0],

Branch and Bound/Topological Sort/code.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer();
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 tracer.log(logger);
 // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not. NOTE: The graph must be Directed-Acyclic
 const G = [

Brute Force/Binary Tree Traversal/inOrder.js

@@ -1,4 +1,4 @@
-const { Array1DTracer, GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { Array1DTracer, GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -30,7 +30,8 @@ const T = [ // mapping to G as a binary tree , [i][0] indicates left child, [i][
 
 const treeTracer = new GraphTracer(' Traversal In-order ').set(G).layoutTree(5);
 const arrayTracer = new Array1DTracer(' Print In-order ').set(new Array(T.length).fill('-'));
-const logger = new LogTracer(' Log ').delay();
+const logger = new LogTracer(' Log ');
+Layout.setRoot(new VerticalLayout([treeTracer, arrayTracer, logger])).delay();
 
 let index = 0;
 

Brute Force/Binary Tree Traversal/postOrder.js

@@ -1,4 +1,4 @@
-const { Array1DTracer, GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { Array1DTracer, GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -30,7 +30,8 @@ const T = [ // mapping to G as a binary tree , [i][0] indicates left child, [i][
 
 const treeTracer = new GraphTracer(' Traversal Post-order ').set(G).layoutTree(5);
 const arrayTracer = new Array1DTracer(' Print Post-order ').set(new Array(T.length).fill('-'));
-const logger = new LogTracer(' Log ').delay();
+const logger = new LogTracer(' Log ');
+Layout.setRoot(new VerticalLayout([treeTracer, arrayTracer, logger])).delay();
 
 let index = 0;
 

Brute Force/Binary Tree Traversal/preOrder.js

@@ -1,4 +1,4 @@
-const { Array1DTracer, GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { Array1DTracer, GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -30,7 +30,8 @@ const T = [ // mapping to G as a binary tree , [i][0] indicates left child, [i][
 
 const treeTracer = new GraphTracer(' Traversal Pre-order ').set(G).layoutTree(5);
 const arrayTracer = new Array1DTracer(' Print Pre-order ').set(new Array(T.length).fill('-'));
-const logger = new LogTracer(' Log ').delay();
+const logger = new LogTracer(' Log ');
+Layout.setRoot(new VerticalLayout([treeTracer, arrayTracer, logger])).delay();
 
 let index = 0;
 

Brute Force/Bipartiteness Test/code.js

@@ -1,4 +1,4 @@
-const { Array1DTracer, GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { Array1DTracer, GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().directed(false);
 const logger = new LogTracer();
@@ -13,7 +13,8 @@ const G = [
 ];
 tracer.set(G);
 
-const colorsTracer = new Array1DTracer('Colors').delay();
+const colorsTracer = new Array1DTracer('Colors');
+Layout.setRoot(new VerticalLayout([tracer, logger, colorsTracer])).delay();
 
 function BFSCheckBipartiteness(s) {
   const Q = [];

Brute Force/Breadth-First Search/shortestPath.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().directed(false).weighted();
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 tracer.log(logger);
 const G = new Randomize.Graph(5, 1).directed(false).weighted().create();
 tracer.set(G).delay();

Brute Force/Breadth-First Search/tree.js

@@ -1,6 +1,7 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().log(new LogTracer());
+Layout.setRoot(new VerticalLayout([tracer]));
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0],
   [0, 0, 0, 1, 1, 0, 0, 0, 0, 0, 0],

Brute Force/Bridge Finding/efficient.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const graphTracer = new GraphTracer().directed(false);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([graphTracer, logger]));
 const G = [
   [0, 1, 0, 0, 1, 0],
   [1, 0, 0, 0, 1, 0],

Brute Force/Bridge Finding/naive.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().directed(false);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 const G = [
   [0, 1, 0, 0, 0, 0],
   [1, 0, 0, 1, 1, 0],

Brute Force/Bubble Sort/code.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(15).create();
 tracer.set(D).delay();
 

Brute Force/Comb Sort/code.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(15).create();
 tracer.set(D).delay();
 

Brute Force/Cycle Sort/code.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(15).create();
 tracer.set(D).delay();
 

Brute Force/Depth-First Search/graph.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, GraphTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, GraphTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const graphTracer = new GraphTracer().directed(false);
 const visitedTracer = new Array1DTracer('visited');
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([graphTracer, visitedTracer, logger]));
 graphTracer.log(logger);
 const G = new Randomize.Graph(8, .3).directed(false).create();
 graphTracer.set(G).delay();

Brute Force/Depth-First Search/shortestPath.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().directed(false).weighted();
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 tracer.log(logger);
 const G = new Randomize.Graph(5, 1).directed(false).weighted().create();
 tracer.set(G).delay();

Brute Force/Depth-First Search/tree.js

@@ -1,6 +1,7 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().log(new LogTracer());
+Layout.setRoot(new VerticalLayout([tracer]));
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 1, 1, 0, 0, 0, 0, 0, 0, 0, 0],
   [0, 0, 0, 1, 1, 0, 0, 0, 0, 0, 0],

Brute Force/Depth-First Search/weightedGraph.js

@@ -1,7 +1,8 @@
-const { GraphTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new GraphTracer().directed(false).weighted();
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([tracer, logger]));
 tracer.log(logger);
 const G = new Randomize.Graph(5, 1).directed(false).weighted().create();
 tracer.set(G).delay();

Brute Force/Flood Fill/code.js

@@ -1,6 +1,7 @@
-const { Array2DTracer } = require('algorithm-visualizer');
+const { Array2DTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const tracer = new Array2DTracer();
+Layout.setRoot(new VerticalLayout([tracer]));
 const G = [
   ['#', '#', '#', '#', '#', '#', '#', '#', '#'],
   ['#', '-', '-', '-', '#', '-', '-', '-', '#'],

Brute Force/Heapsort/code.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(10).create();
 tracer.set(D).delay();
 

Brute Force/Insertion Sort/code.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(15).create();
 tracer.set(D).delay();
 

Brute Force/Lowest Common Ancestor/code.js

@@ -1,4 +1,4 @@
-const { GraphTracer, LogTracer } = require('algorithm-visualizer');
+const { GraphTracer, LogTracer, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const G = [ // G[i][j] indicates whether the path from the i-th node to the j-th node exists or not
   [0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
@@ -29,7 +29,8 @@ const T = [ // mapping to G as a binary tree , [i][0] indicates left child, [i][
 ];
 
 const treeTracer = new GraphTracer(' Traversal Pre-order ').set(G).layoutTree(5);
-const logger = new LogTracer(' Log ').delay();
+const logger = new LogTracer(' Log ');
+Layout.setRoot(new VerticalLayout([treeTracer, logger])).delay();
 
 function lcaBT(parent, root, a, b) {
   logger.println(`Beginning new Iteration of lcaBT () with parent: ${parent}, current root: ${root}`);

Brute Force/PageRank/code.js

@@ -1,4 +1,4 @@
-const { Array1DTracer, Array2DTracer, GraphTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, Array2DTracer, GraphTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 function filledArray(length, value) {
   return Array(...Array(length)).map(Number.prototype.valueOf, value);
@@ -14,6 +14,7 @@ const oecTracer = new Array1DTracer('Outgoing Edge Counts');
 const inTracer = new Array2DTracer('Incoming Nodes');
 
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([graphTracer, rankTracer, oecTracer, inTracer, logger]));
 
 graphTracer.set(G);
 oecTracer.set(outgoingEdgeCounts);

Brute Force/Pancake Sort/code.js

@@ -1,8 +1,9 @@
-const { Array1DTracer, ChartTracer, LogTracer, Randomize } = require('algorithm-visualizer');
+const { Array1DTracer, ChartTracer, LogTracer, Randomize, Layout, VerticalLayout } = require('algorithm-visualizer');
 
 const chart = new ChartTracer();
 const tracer = new Array1DTracer().chart(chart);
 const logger = new LogTracer();
+Layout.setRoot(new VerticalLayout([chart, tracer, logger]));
 const D = new Randomize.Array1D(10).create();
 tracer.set(D).delay();