JSFiddle - React, Tailwind, and code Playground

by Nickolas Smiley

HTML

<label>Oh Christmas Tree, O Christmas Tree. How pretty are your branches.:</label><br><br>
3 * (x + 5 * y)<br>
Enter x:<input type="text" id="x" /><br>
Enter y:<input type="text" id="y" /><br>
<input type="button" value="Create Your Christmas Tree" onclick="createTree()" /><br>
<p id="output1"></p>
<p id="output2"></p>

JavaScript

//call variables
var str = "";
var TNode = function(_content){
  this.parent = null;
  this.left = null;
  this.right = null;
  this.content = _content;
}
//call variables
TNode.prototype.addLeftNode = function (_content){
	var n = new TNode(_content);
  n.parent = this;
  this.left = n;
  return n;
}
//call variables
TNode.prototype.addRightNode = function (_content){
	var n = new TNode(_content);
  n.parent = this;
  this.right = n;
  return n;
}
//call variables
function postOrder(n){
	if (n !== null){
  postOrder(n.left);
  postOrder(n.right);
  str = str + n.content;
  }
  //this will change the nodes to the correct order
  return str;
}
function Ctree(s){
	var operand = [];
	for (var i = 0, len = s.length; i < len; i++) {
	 if(!isNaN(s[i])){
   	operand.push(Number(s[i]));
   }
   else {
   	var operator = s[i];
    var b = operand.pop();
    var a = operand.pop();
    if (operator === "+"){
    	operand.push(a + b);
    }
    else if (operator === "-"){
    	operand.push(a - b);
    }
    else if (operator === "*"){
    	operand.push(a * b);
    }
    else if (operator === "/"){
    	operand.push(a / b);
    }
   }
  }
  return operand.pop();
}

TNode.prototype.addNode = function(_content) {

  var _node = new TNode(_content);
  if (this.left == null) {
    _node.parent = this;
    this.left = _node;
    return this;
  }

  if (this.right == null) {
    _node.parent = this;
    this.right = _node;
    return this;
  }
  var leftN = this.left.numberOfChildren();
  var rightN = this.right.numberOfChildren();

  if (leftN < rightN) {
    this.left.addNode(_content);
  } else {
    this.right.addNode(_content);
  }

  return this;
}

TNode.prototype.numberOfChildren = function() {
  var n = 0;
  if (this.left != null) {
    n = 1 + this.left.numberOfChildren();
  }
  if (this.right != null) {
    n = n + 1 + this.right.numberOfChildren();
  }
  return n;
}

TNode.prototype.print = function() {
  var s = this.printNode();
  if (this.left != null) {
    s +=...