Contract Deposit call successfully called with zkproof

index.html

@@ -48,13 +48,13 @@
     <div class="card-body">
       <!-- menu -->
       <div class="tab-content" id="myTabContent">
-        <button onclick="todo()" class="btn color_primary-o float-right">Connect Metamask</button>
+        <button onclick="connectMetamask()" class="btn color_primary-o float-right">Connect Metamask</button>
         <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>
-        <div class="alertBox"><b>WARNING</b>: experimental code, use only in Göerli testnet, and without real value.</div>
+        <div class="alertBox"><b>WARNING</b>: experimental code, use only in Göerli testnet, without any real value.</div>
         <br><br>
 
         <!-- deposit -->
@@ -63,21 +63,26 @@
             <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.
               <br><br>
               <button onclick="deposit('deposit')" class="btn color_primary float-right">Deposit 1 ETH</button>
-              <br><br><br>
+              <br>
+              <div id="depositRes"></div>
+              <br><br>
             </div>
             <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.
               <br><br>
-              <input id="secret" type="text" class="form-control" placeholder="secret"></input>
+              <input id="secret" type="text" class="form-control" placeholder="secret" value="1234567890"></input>
+              <br>
+              <input id="nullifier" type="text" class="form-control" placeholder="nullifier" value="567891234"></input>
               <br>
-              <input id="nullifier" type="text" class="form-control" placeholder="nullifier"></input>
+              <button onclick="withdraw('withdraw')" class="btn color_primary float-right">Withdraw 1 ETH</button>
               <br>
-              <button onclick="todo()" class="btn color_primary float-right">Withdraw 1 ETH</button>
+              <div id="withdrawRes"></div>
             </div>
           </div>
           <br><br>
@@ -171,7 +176,7 @@
 
   <script src="lib/wasmsnark_bn128.js"></script>
   <script src="lib/snarkjs.js"></script>
-  <!-- <script src="node_modules/web3/dist/web3.min.js"></script> -->
+  <script src="node_modules/web3/dist/web3.min.js"></script>
   <script src="lib/miksi-browser.js"></script>
 
   <script src="index.js"></script>

index.js

@@ -1,6 +1,8 @@
 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"}],"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 = "0x6E77f4bB1356426baD1Bd014d04388eFAc197Fe1";
 
 function loadCircuit(circuitname) {
   fetch("circuits-files/"+circuitname+"-proving_key.bin").then( (response) => {
@@ -20,19 +22,26 @@ function loadCircuit(circuitname) {
 }
 
 async function deposit(circuitname) {
+  document.getElementById("depositRes").innerHTML = `
+    Generating zkProof & making the deposit
+  `;
   console.log("circuit:", circuitname);
 
   // TODO
   const secret = "1234567890";
   const nullifier = "567891234";
   const commitments = [];
+  // getCommitments from the tree
 
-  // witness
+  // calculate witness
   console.log(witnessCalc[circuitname]);
-  const witness = await miksi.calcWitness(witnessCalc[circuitname], secret, nullifier, commitments);
+  const cw = await miksi.calcWitness(witnessCalc[circuitname], secret, nullifier, commitments);
+  const witness = cw.witness;
+  const publicInputs = cw.publicInputs;
   console.log("w", witness);
+  console.log("pi", publicInputs);
 
-  // proof
+  // generate proof
   const start = new Date().getTime();
   console.log(provingKey[circuitname]);
   const proof = await window.groth16GenProof(witness.buffer, provingKey[circuitname]);
@@ -40,10 +49,74 @@ async function deposit(circuitname) {
   const time = end - start;
   console.log("circuit " + circuitname + " took " + time + "ms to compute");
   console.log(proof);
+
+
+  // send tx
+  const accounts = await web3.eth.getAccounts();
+  const sender = accounts[0];
+  console.log("SENDER", sender);
+
+  console.log("sc call data",
+    publicInputs.commitment,
+    publicInputs.root.toString(),
+    [proof.pi_a[0], proof.pi_a[1]],
+    [
+      [proof.pi_b[0][1], proof.pi_b[0][0]],
+      [proof.pi_b[1][1], proof.pi_b[1][0]]
+    ],
+    [proof.pi_c[0], proof.pi_c[1]],
+  );
+  miksiContract.methods.deposit(
+    publicInputs.commitment,
+    publicInputs.root.toString(),
+    [proof.pi_a[0], proof.pi_a[1]],
+    [
+      [proof.pi_b[0][1], proof.pi_b[0][0]],
+      [proof.pi_b[1][1], proof.pi_b[1][0]]
+    ],
+    [proof.pi_c[0], proof.pi_c[1]],
+  ).send(
+    {from: sender, value: 1000000000000000000},
+    function(error, transactionHash){
+      console.log("https://goerli.etherscan.io/tx/"+transactionHash);
+      console.log(error);
+    });
+
+  // print secret & nullifier
+  document.getElementById("depositRes").innerHTML = `
+    Secret: <b>`+secret+`</b><br>
+    Nullifier: <b>`+nullifier+`</b><br>
+  `;
 }
 
 loadCircuit("deposit");
 loadCircuit("withdraw");
 
 
-// var web3 = new Web3(Web3.givenProvider || "ws://localhost:8545");
+
+
+let miksiContract;
+
+function connectMetamask() {
+  const ethEnabled = () => {
+    if (window.web3) {
+      window.web3 = new Web3(window.web3.currentProvider);
+      window.ethereum.enable();
+      return true;
+    }
+    return false;
+  }
+
+  if (!ethEnabled()) {
+    alert("Please install MetaMask to use miksi");
+  }
+
+  console.log("abi", abi);
+  miksiContract = new web3.eth.Contract(abi, miksiAddress);
+  console.log("miksiContract", miksiContract);
+
+  web3.eth.getBalance("0x35d4dCDdB728CeBF80F748be65bf84C776B0Fbaf", function(err, res){console.log("BAL", JSON.stringify(res));});
+
+  miksiContract.methods.getCommitments().call()
+    .then(console.log);
+}

lib/miksi-browser.js

@@ -76358,7 +76358,13 @@ exports.calcWitness = async (wasm, secret, nullifier, commitments) => {
 
 
 	// const witness = unstringifyBigInts(stringifyBigInts(w));
-	return wBuff;
+	return {
+		witness: wBuff,
+		publicInputs: {
+			commitment:commitment,
+			root:rootNew
+		}
+	};
 }
 
 

package.json

@@ -16,7 +16,7 @@
     "toastr": "^2.1.4",
     "wasmsnark": "0.0.10",
     "snarkjs": "^0.1.31",
-    "web3": "^1.0.0-beta.30"
+    "web3": "1.2.7"
   },
   "devDependencies": {
     "browserify": "^16.5.0"