Assignment 15_Second attempt

by sheila massey

HTML

<h1>
Creating Your own Blockchain
</h1>
<div class="divBG">

  <table border="0" align="center" height="165px">
    <tr>
      <td>
        Name <input type="textbox" id="name"><br />
        Date <input type="date" id="date" value = "yyyy-dd-mm"><br />
        Transaction Amount <input type="number" id="amount" min="0" step=".01" value =""/><br />
        
      </td>
    </tr>
    <tr>
      <td valign="top">
        <input type="button" class="btnstyle" value="New Blockchain" id="btnNewBlockchain" onClick="newBlockchain();" />
        <input type="button" class="btnstyle" value="Add Block" id="btnAddBlock" onClick="newUserBlock();" />
      </td>
    </tr>
    <tr height="15%">
      <td>
      
        <div id="message">

        </div>
      </td>
    </tr>
  </table>
</div>

<br />

<div class="outputDiv">
   <div class="container" id="output">

  </div>
</div>

CSS

body {
  font-family: Sans-serif;
  text-shadow: 1px 1px #008CBA;
  background-color: white;
}

input[type=textbox] {
  width: 100px;
}

input[type=date]{
  width: 125px;
  text-align: center;
}

input[type=number]{
  width: 75px;
  text-align: center;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  opacity: 1;
}
/*/////////////////////////////////////////////////////////////////////////////////////////*/

.divBG {
  color: #008CBA;
  background-color: white;
  border: 2px solid black;
  border-radius: 10px;
  width: 300px;
  padding: 2%;
  margin: auto;
  overflow: auto;
  box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.48)
}
/*//////////////////////////////////////////////////////////////////////////////////////// */
.outputDiv{
  color: #008CBA;
  background-color: white;
  border: 2px solid  black;
  border-radius: 20px;
  width: 85%;
  padding: 2%;
  margin: auto;
  overflow: auto;
  box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.48)
}

td {
  text-align: center;
}

/* /////////////////////////////////////////////////////////////////////////////////// */

.nopad {
  margin: 0;
  padding: 0;
}

/* //////////////////////////////////////////////////////////////////////////////////// */

.btnmargins {
  margin-top: 1.5em;
  margin-bottom: 1.5em;
}

/* //////////////////////////////////////////////////////////////////////////////////////// */

.btnstyle {
  background-color:#008CBA;
  color: #FFF;
  border-radius: 10px;
  width: 125px;
  height: 45px;
  padding: 10px 2px;
  -webkit-transition-duration: 0.3s;
  
  transition-duration: 0.3s;
  outline: none;
  box-shadow: 0 6px 8px 0 rgba(0, 0, 0, 0.24), 0 9px 25px 0 rgba(0, 0, 0, 0.19);
  white-space: normal;
}

/* ///////////////////////////////////////////////////////////////////////////////// */

.btnstyle:hover {
  border: 2px solid #008CBA;
  background-color: #FFF;
  color: #008CBA;
  font-weight: bold;
}

/*...

JavaScript

/////////////////////////////////////////////////////////////////////////////////////////////////
var sha256 = function sha256(ascii) {
  function rightRotate(value, amount) {
    return (value >>> amount) | (value << (32 - amount));
  }
//////////////////////////////////////////////////////////////////////////////////////////////
  var mathPow = Math.pow;
  
  var maxWord = mathPow(2, 32);
  
  var lengthProperty = 'length'
  
  var i, j; 
  
  var result = ''

  var words = [];
  
  var asciiBitLength = ascii[lengthProperty] * 8;
/////////////////////////////////////////////////////////////////////
  var hash = sha256.h = sha256.h || [];

  var k = sha256.k = sha256.k || [];
  
  var primeCounter = k[lengthProperty];
///////////////////////////////////////////////////////////////////////
  var isComposite = {};
  for (var candidate = 2; primeCounter < 64; candidate++) 
  {
    if (!isComposite[candidate]) 
    {
      for (i = 0; i < 313; i += candidate) 
      {
        isComposite[i] = candidate;
      }
      hash[primeCounter] = (mathPow(candidate, 0.5) * maxWord) | 0;
      k[primeCounter++] = (mathPow(candidate, 1 / 3) * maxWord) | 0;
    }
  }

  ascii += '\x80' 
  while (ascii[lengthProperty] % 64 - 56) ascii += '\x00' 
  for (i = 0; i < ascii[lengthProperty]; i++) 
  {
    j = ascii.charCodeAt(i);
    if (j >> 8) return; 
    words[i >> 2] |= j << ((3 - i) % 4) * 8;
  }
  words[words[lengthProperty]] = ((asciiBitLength / maxWord) | 0);
  words[words[lengthProperty]] = (asciiBitLength)

//////////////////////////////////////////////////////////////////////////////////////////////
  for (j = 0; j < words[lengthProperty];) 
  {
    var w = words.slice(j, j += 16); 
    var oldHash = hash;

    hash = hash.slice(0, 8);

    for (i = 0; i < 64; i++) 
    {
      var i2 = i + j;

      var w15 = w[i - 15],
        w2 = w[i - 2];

      var a = hash[0],
        e = hash[4];
        
      var temp1 = hash[7] +
        (rightRotate(e, 6) ^ rightRotate(e, 11) ^...