catb0t/i.html

## i.html
<!DOCTYPE html>
<html lang="en">
  <head>
<script type="text/javascript" src="Javascriptstuff.js"></script>
     <title> Chemistry Calculations </title>
     </head>
  <body>
    <div class="Box">
      <H2> Balance Equation </H2>
      <p> Make sure to have a space before and afterh the +'s and = </p>
      <div class="questionbox">

        <input id="chemicalEquationInput" placeholder="2H2O + Fe = FeO2 + 2H2">
        <button onclick="confirmEquation()">
          Confirm Equation
          </button>
        <br>
        <input id="firstAmountEquation" placeholder="1" class="numberInput">

      <select id="GM1EQ">
        <option value="Grams"> Grams </option>
        <option value="Moles"> Moles </option>
        </select>
        <select id="Molecule1EQ">

          </select>
        To
        <select id="GM2EQ">
        <option value="Grams"> Grams </option>
          <option value="Moles"> Moles </option>
          </select>

        <select id="Molecule2EQ">

          </select>


        <button onclick="calculateEquation()">
        Calculate
        </button>
        </div>

      <div class="answerbox">
<div id="Answer">
        </div>
        </div>
      <button onclick="ResetInfo()"> Reset </button>
      </div>


    </body>

  </html>
  <style>
    p {
  margin-top: -18px;
}
.questionbox {
  position: relative;
  white-space: nowrap;
  margin-top: 5px;
  margin: 10px;
  padding: 1px;
}
.answerbox {
  margin: 10px;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.numberInput {
  width: 15px;
}

  </style>


## j.js
function removeChildren(elt) {
  while (elt.firstChild) {
    elt.removeChild(elt.firstChild);
  }
}

var molecules = [];
function confirmEquation() {
 var EquationSplit = document.getElementById("chemicalEquationInput").value;
  var RAPSplit = EquationSplit.split(" = ");
  for(var i =0; i < RAPSplit.length; i++){
    molecules.push(RAPSplit[i].split(" + "));
  }
 console.log(molecules);
 console.log(molecules.length + "Amount of molecules");
 console.log(molecules[0].length + "Amount of Reactants");
 console.log(molecules[1].length + "Amount of Products");
  var amountMolecules = +molecules[0].length + +molecules[1].length;
  for (i = 0; i < +molecules[0].length; i++) {
var x = document.getElementById("Molecule1EQ");
var option = document.createElement("option");
option.text = molecules[0][i];
option.value =  molecules[0][i];
x.add(option);
}
 for (i = 0; i < +molecules[1].length; i++) {
var x = document.getElementById("Molecule1EQ");
var option = document.createElement("option");
option.text = molecules[1][i] ;
option.value =  molecules[1][i];
x.add(option);
};
for (i = 0; i < +molecules[0].length; i++) {
var x = document.getElementById("Molecule2EQ");
var option = document.createElement("option");
option.text = molecules[0][i] ;
option.value =  molecules[0][i];
x.add(option);
}
 for (i = 0; i < +molecules[1].length; i++) {
var x = document.getElementById("Molecule2EQ");
var option = document.createElement("option");
option.text = molecules[1][i] ;
option.value =  molecules[1][i];
x.add(option);
}
  document.getElementById("Answer").innerHTML = amountMolecules + "," + +molecules[0].length + "," + +molecules[1].length;
}
var moleculeMassEQ = [];
function calculateEquation() {
//Split Molecules into Elements with respective coefficient and subscripts
//molecules[0].length
//molecules[1].length
for(var i =0; i < molecules[0].length; i++){
    moleculeMassEQ.push(molecules[0][i].split("H2"));
  }
}

var moleculeMass = [


];
function ErrorMessage() {
 document.getElementById("Answer").innerHTML = "Error Try Again.";
}

function ResetInfo() {
 var leftdd = document.getElementById("Molecule1EQ");
 var rightdd = document.getElementById("Molecule2EQ");
 console.log(leftdd)
 removeChildren(leftdd);
 removeChildren(rightdd);
}
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<script type="text/javascript" src="Javascriptstuff.js"></script>
	<title> Chemistry Calculations </title>
	</head>
	<body>
	<div class="Box">
	<H2> Balance Equation </H2>
	<p> Make sure to have a space before and afterh the +'s and = </p>
	<div class="questionbox">

	<input id="chemicalEquationInput" placeholder="2H2O + Fe = FeO2 + 2H2">
	<button onclick="confirmEquation()">
	Confirm Equation
	</button>
	<br>
	<input id="firstAmountEquation" placeholder="1" class="numberInput">

	<select id="GM1EQ">
	<option value="Grams"> Grams </option>
	<option value="Moles"> Moles </option>
	</select>
	<select id="Molecule1EQ">

	</select>
	To
	<select id="GM2EQ">
	<option value="Grams"> Grams </option>
	<option value="Moles"> Moles </option>
	</select>

	<select id="Molecule2EQ">

	</select>


	<button onclick="calculateEquation()">
	Calculate
	</button>
	</div>

	<div class="answerbox">
	<div id="Answer">
	</div>
	</div>
	<button onclick="ResetInfo()"> Reset </button>
	</div>




	</body>

	</html>
	<style>
	p {
	margin-top: -18px;
	}
	.questionbox {
	position: relative;
	white-space: nowrap;
	margin-top: 5px;
	margin: 10px;
	padding: 1px;
	}
	.answerbox {
	margin: 10px;
	}
	input[type=number]::-webkit-inner-spin-button,
	input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
	}
	.numberInput {
	width: 15px;
	}

	</style>
	function removeChildren(elt) {
	while (elt.firstChild) {
	elt.removeChild(elt.firstChild);
	}
	}

	var molecules = [];
	function confirmEquation() {
	var EquationSplit = document.getElementById("chemicalEquationInput").value;
	var RAPSplit = EquationSplit.split(" = ");
	for(var i =0; i < RAPSplit.length; i++){
	molecules.push(RAPSplit[i].split(" + "));
	}
	console.log(molecules);
	console.log(molecules.length + "Amount of molecules");
	console.log(molecules[0].length + "Amount of Reactants");
	console.log(molecules[1].length + "Amount of Products");
	var amountMolecules = +molecules[0].length + +molecules[1].length;
	for (i = 0; i < +molecules[0].length; i++) {
	var x = document.getElementById("Molecule1EQ");
	var option = document.createElement("option");
	option.text = molecules[0][i];
	option.value = molecules[0][i];
	x.add(option);
	}
	for (i = 0; i < +molecules[1].length; i++) {
	var x = document.getElementById("Molecule1EQ");
	var option = document.createElement("option");
	option.text = molecules[1][i] ;
	option.value = molecules[1][i];
	x.add(option);
	};
	for (i = 0; i < +molecules[0].length; i++) {
	var x = document.getElementById("Molecule2EQ");
	var option = document.createElement("option");
	option.text = molecules[0][i] ;
	option.value = molecules[0][i];
	x.add(option);
	}
	for (i = 0; i < +molecules[1].length; i++) {
	var x = document.getElementById("Molecule2EQ");
	var option = document.createElement("option");
	option.text = molecules[1][i] ;
	option.value = molecules[1][i];
	x.add(option);
	}
	document.getElementById("Answer").innerHTML = amountMolecules + "," + +molecules[0].length + "," + +molecules[1].length;
	}
	var moleculeMassEQ = [];
	function calculateEquation() {
	//Split Molecules into Elements with respective coefficient and subscripts
	//molecules[0].length
	//molecules[1].length
	for(var i =0; i < molecules[0].length; i++){
	moleculeMassEQ.push(molecules[0][i].split("H2"));
	}
	}

	var moleculeMass = [


	];
	function ErrorMessage() {
	document.getElementById("Answer").innerHTML = "Error Try Again.";
	}

	function ResetInfo() {
	var leftdd = document.getElementById("Molecule1EQ");
	var rightdd = document.getElementById("Molecule2EQ");
	console.log(leftdd)
	removeChildren(leftdd);
	removeChildren(rightdd);
	}