JSFiddle - React, Tailwind, and code Playground

by CommandLineDesign

HTML

<div id="calculator"></div>

JavaScript

// =================== Log ===================
var logRow = function(name, value){
	var thisRow = document.createElement('li');
  var thisName = document.createElement('span');
  var thisNameContents = document.createTextNode(name)
  thisName.appendChild(thisNameContents);
  var thisValue = document.createElement('span'); 
  var thisValueContents = document.createTextNode(value)
  thisValue.appendChild(thisValueContents);
  thisRow.appendChild(thisName);
  thisRow.appendChild(thisValue);
  return thisRow;
}

var ItemLog = function(placeHolderID, parentObject){
  this.renderLog = function(){
    console.log(parentObject.items);
    if(parentObject.items && parentObject.items.length){
 	    var thisLog = document.createElement('ul');
      for(var i = 0; i < parentObject.items.length; i++){
        /*for(var i2 = 0; i2 < Object.keys(parentObject.items[i]).length; i2++){
          console.log(Object.keys(parentObject.items[i])[i2]); //keyname
          console.log(parentObject.items[i][Object.keys(parentObject.items[i])[i2]]); //contents
        }*/
        var thisRow = new logItem(parentObject.items[i].name, parentObject.items[i].value);
        thisLog.appendChild(thisRow);
      }
      var thisElement = document.getElementById(PlaceHolderID);
      thisElement.appendChild(thisLog);
    }
  }
}
 
// =================== Calculator ===================
var Calculator = function(placeHolderID, items){
	this.items = [];
  if(items && items.length){
  	this.items = items;
  }
	this.findSum = function(){
  	var total = 0;
    if(this.items && this.items.length){
      for(var i = 0; i < this.items.length; i++){
        total += Number(this.items[i].value);
      }
    }
    console.log(total);
    return total;
  }
  var thisObject = this;
  this.controls = new CalculatorControls(placeHolderID, thisObject);
  this.itemLog = new ItemLog(this.placeHolderID, thisObject);
  
}

Calculator.prototype.handleSubmit = function(){
  console.log('handle submit');
  var newItem =...