UI improvements, add texts, update to 17(16) MT levels

index.html

@@ -48,12 +48,16 @@
     <div class="card-body">
       <!-- menu -->
       <div class="tab-content" id="myTabContent">
-        <button onclick="connectMetamask()" class="btn color_primary-o float-right">Connect Metamask</button>
+        <div class="float-right" style="text-align:right;">
+        <button onclick="connectMetamask()" class="btn color_primary-o">Connect Metamask</button>
+        <br><br>
+        Current address: <div id="contractAddr"></div>
+        </div>
         <h2><i>miksi</i></h2>
         <i>From Esperanto, <b>miksi</b> (miks·i): to mingle, to blend, to mix, to shuffle</i>
         <br>
         Ethereum trustless <b>zk-mixer</b>.
-        <br><br>
+        <br><br><br>
         <div class="alertBox"><b>WARNING</b>: experimental code, use only in Göerli testnet, without any real value.</div>
         <br><br>
 
@@ -63,8 +67,9 @@
             <div class="col-md">
               <h5 class="card-title">Deposit</h5>
               <hr>
-              a
-              Quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit.
+              In order to make a deposit, will generate a zkSNARK proof that proves that you know a <i>secret</i> & <i>nullifier</i> for the <i>commitment</i>, and that that <i>commitment</i> has been added into the MerkleTree following the tree <i>state transition function</i> (which ensures that for the new <i>root</i>, there is only one leaf addition and no deletion).
+              <br>
+              If the zk-proof verification passes, the new <i>root</i> & <i>commitment</i> will be stored in to the <b>miksi</b> Smart Contract, and the ETH will be deposited.
               <br><br>
               <button onclick="deposit('deposit')" class="btn color_primary float-right">Deposit 1 ETH</button>
               <br><br>
@@ -74,7 +79,9 @@
             <div class="col-md">
               <h5 class="card-title">Withdraw</h5>
               <hr>
-              Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.
+              To be able to withdraw, will generate a zkSNARK proof that proves that you know a <i>secret</i> for a public <i>nullifier</i>, which <i>commitment</i> is in the MerkleTree which <i>root</i> is stored in the <b>miksi</b> Smart Contract.
+              <br>
+              If the zk-proof verification passes and the nullifier was not already used, the <b>miksi</b> Smart Contract will send the ETH to the specified address.
               <br><br>
               <textarea id="jsonWithdraw" class="form-control" style="width:100%;" placeholder="paste here your secret & nullifier"></textarea>
               <br>
@@ -89,7 +96,7 @@
           <h5 class="card-title">Stats</h5>
           <hr>
           <img src="miksi-logo00-square-pink.png" style="width:300px;" class="float-right">
-          Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
+          <div id="stats">Please connect Metamask</div>
 
           <br>
         </div>

index.js

@@ -2,9 +2,11 @@ var circuit = {};
 var provingKey = {};
 var witnessCalc = {};
 const abi = JSON.parse(`[{"inputs":[{"internalType":"address","name":"_depositVerifierContractAddr","type":"address"},{"internalType":"address","name":"_withdrawVerifierContractAddr","type":"address"}],"stateMutability":"nonpayable","type":"constructor"},{"inputs":[{"internalType":"uint256","name":"_commitment","type":"uint256"},{"internalType":"uint256","name":"_root","type":"uint256"},{"internalType":"uint256[2]","name":"a","type":"uint256[2]"},{"internalType":"uint256[2][2]","name":"b","type":"uint256[2][2]"},{"internalType":"uint256[2]","name":"c","type":"uint256[2]"}],"name":"deposit","outputs":[],"stateMutability":"payable","type":"function"},{"inputs":[],"name":"getCommitments","outputs":[{"internalType":"uint256[]","name":"","type":"uint256[]"},{"internalType":"uint256","name":"","type":"uint256"},{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"address payable","name":"_address","type":"address"},{"internalType":"uint256","name":"nullifier","type":"uint256"},{"internalType":"uint256[2]","name":"a","type":"uint256[2]"},{"internalType":"uint256[2][2]","name":"b","type":"uint256[2][2]"},{"internalType":"uint256[2]","name":"c","type":"uint256[2]"}],"name":"withdraw","outputs":[],"stateMutability":"nonpayable","type":"function"}]`);
-const miksiAddress = "0x3a88725bf9ABc85Dca64A4e6bc629D448032FA0F";
+const miksiAddress = "0x4cc45573481A2977fcC0b9DD9f8c710201B5a5cd";
 let metamask = false;
 
+document.getElementById("contractAddr").innerHTML=`<a href="https://goerli.etherscan.io/address/`+miksiAddress+`" target="_blank">`+miksiAddress+`</a>`;
+
 function loadCircuit(circuitname) {
   fetch("circuits-files/"+circuitname+"-proving_key.bin").then( (response) => {
     return response.arrayBuffer();
@@ -131,8 +133,15 @@ async function withdraw(circuitname) {
 
   // calculate witness
   console.log(witnessCalc[circuitname]);
-  const proverAccounts = await web3.eth.getAccounts();
-  const addr = proverAccounts[0];
+  const addr = document.getElementById("withdrawAddress").value;
+  if (addr==undefined) {
+    toastr.error("No withdraw address defined");
+    return;
+  }
+  if (!web3.utils.isAddress(addr)) {
+    toastr.error("Error with withdraw address");
+    return;
+  }
   const cw = await miksi.calcWithdrawWitness(witnessCalc[circuitname], secret, nullifier, commitments, addr, key);
   const witness = cw.witness;
   const publicInputs = cw.publicInputs;
@@ -217,6 +226,17 @@ async function connectMetamask() {
 
   const acc = await web3.eth.getAccounts();
   const addr = acc[0];
-  web3.eth.getBalance(addr, function(err, res){console.log("BAL", JSON.stringify(res));});
+  web3.eth.getBalance(addr, function(err, res){
+    console.log("current address balance:", JSON.stringify(res));
+  });
+  const miksiBalance = await web3.eth.getBalance(miksiAddress);
+
+  let html = "<b>miksi</b> Smart Contract current balance: " + miksiBalance/1000000000000000000 + " ETH<br>";
+  let res = await miksiContract.methods.getCommitments().call();
+  const commitments = res[0];
+  const key = res[2];
+  html += "number of commitments: " + commitments.length + "<br>";
+  html += "current key: " + key + "<br>";
+  document.getElementById("stats").innerHTML = html;
 
 }

libs/miksi-browser.js

@@ -76295,7 +76295,7 @@ const Web3 = require("web3");
 // const buildBn128 = require("wasmsnark").buildBn128;
 
 
-const nLevels = 5;
+const nLevels = 17;
 const coinCode = "0"; // refearing to ETH
 const ethAmount = '1';
 const amount = Web3.utils.toWei(ethAmount, 'ether');
@@ -76314,6 +76314,8 @@ exports.calcDepositWitness = async (wasm, secret, nullifier, commitments, key) =
 	const poseidon = circomlib.poseidon.createHash(6, 8, 57);
 	const commitment = poseidon([coinCode, amount, secret, nullifier]).toString();
 
+	console.log("PROVA", poseidon([key, commitment]).toString());
+
 	// rebuild the tree
 	let tree = await smt.newMemEmptyTrie();
 	await tree.insert(0, 0);
@@ -76324,6 +76326,7 @@ exports.calcDepositWitness = async (wasm, secret, nullifier, commitments, key) =
 	// old root
 	const rootOld = tree.root;
 	const resOld = await tree.find(commitment);
+	console.log("FIND old", resOld);
 	let oldKey = "0";
 	let oldValue = "0";
 	if (!resOld.found) {
@@ -76345,6 +76348,7 @@ exports.calcDepositWitness = async (wasm, secret, nullifier, commitments, key) =
 	// new root
 	const rootNew = tree.root;
 	const resNew = await tree.find(key);
+	console.log("FIND new", resNew);
 	if (!resNew.found) {
 		console.error("leaf with the new commitment expect to exist but not exists");
 	}
@@ -76447,7 +76451,8 @@ exports.calcWithdrawWitness = async (wasm, secret, nullifier, commitments, addr,
 		for (let j=0; j<8; j++) {
 			const bi = witness[i];
 			const v = bigInt(bi).shiftRight(j*32).and(0xFFFFFFFF).toJSNumber();
-			wBuff.writeUInt32LE(v, i*32 + j*4, 4)
+			// wBuff.writeUInt32LE(v, i*32 + j*4, 4)
+			wBuff.writeUInt32LE(v, i*32 + j*4)
 		}
 	}
 
@@ -76462,9 +76467,6 @@ exports.calcWithdrawWitness = async (wasm, secret, nullifier, commitments, addr,
 	};
 }
 
-
-
-
 }).call(this,require("buffer").Buffer)
 },{"big-integer":24,"buffer":70,"circom_runtime":76,"circomlib":95,"ffjavascript":209,"fs":69,"snarkjs":329,"web3":448}]},{},[461])(461)
 });