noir-lang · critesjosh · Aug 1, 2024 · Jul 30, 2024 · Jul 30, 2024 · Jul 31, 2024
diff --git a/.gitignore b/.gitignore
@@ -1 +1,2 @@
 node_modules
+.vscode
diff --git a/LICENSE b/LICENSE
diff --git a/README.md b/README.md
@@ -1,6 +1,22 @@
 # Tiny NoirJS app
 
-This repo contains the full code from [this](https://noir-lang.org/noir_js/getting_started/tiny_noir_app) Noir docs page.
+This repo contains the full code from [this](https://noir-lang.org/docs/tutorials/noirjs_app) Noir docs page.
+
+## Noir project
+
+Uses `nargo` version 0.31.0.
+
+Recompile with
+
+```bash
+nargo compile
+```
+
+## Vite project
+
+```bash
+cd vite-project
+```
 
 Install dependencies with
 
@@ -11,5 +27,5 @@ npm install
 Run app with:
 
 ```bash
-npm run start
+npm run dev
 ```
diff --git a/app.js b/app.js
diff --git a/circuit/Nargo.toml b/circuit/Nargo.toml
@@ -1,7 +1,7 @@
 [package]
-name = "noirjs_demo"
+name = "circuit"
 type = "bin"
 authors = [""]
-compiler_version = "0.17.0"
+compiler_version = ">=0.31.0"
 
 [dependencies]
diff --git a/circuit/target/circuit.json b/circuit/target/circuit.json
@@ -0,0 +1 @@
+{"noir_version":"0.31.0+540bef3597bd3e5775c83ec2ee3c0d4463084b4c","hash":4220416898248580058,"abi":{"parameters":[{"name":"x","type":{"kind":"field"},"visibility":"private"},{"name":"y","type":{"kind":"field"},"visibility":"public"}],"return_type":null,"error_types":{}},"bytecode":"H4sIAAAAAAAA/7VUSQ7DIAyEhKa99ic2SzC3fqWo5P8vqBopUCHCLWYkZIQlMx4vUhxQ+7mJM+ZsX9kaWK1NXic0+AYdIjmwLq6EhI7cR5MxiSz5EIOHgNYk3FwwGxyoY8E1oGTkNfHxgqKj7OgpGz3hGpCTt2zqfuLPRXqUEPOAuIq5+UfkrfhrBGJg0yrB27Sq4Vnfe0P4f7xnu3R8BY/9TPn+ZRa4bNd685a/VOVfKi6SnwvW+fYm/9nR5wcPIDK6OgYAAA==","debug_symbols":"lZBBCoMwFETvMussaqsUcpVS5KtRAuFHTBQkeHd/FA+Q5Zt5m5mEwXTr1FoefYD+JTjfU7SehRJeVxRm4kwh0hKh60bB8ADdVIfCaJ2R7Hv8Faoy/V2mf8r0ukQX2Gix1DmTh+du5f75QTDu892IewI=","file_map":{"47":{"source":"fn main(x: Field, y: pub Field) {\n    assert(x != y);\n}\n\n#[test]\nfn test_main() {\n    main(1, 2);\n\n    // Uncomment to make test fail\n    // main(1, 1);\n}\n","path":"/home/josh/Documents/tiny-noirjs-app/circuit/src/main.nr"}},"names":["main"]}
diff --git a/circuit/target/debug_noirjs_demo.json b/circuit/target/debug_noirjs_demo.json
diff --git a/circuit/target/noirjs_demo.json b/circuit/target/noirjs_demo.json
diff --git a/package.json b/package.json
diff --git a/vite-project/.gitignore b/vite-project/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/index.html → vite-project/index.html b/index.html → vite-project/index.html
@@ -15,11 +15,15 @@
   </style>
 </head>
 <body>
-  <script type="module" src="/app.js"></script>
-  <h1>Very basic Noir app</h1>
+  <script type="module" src="/main.js"></script>
+  <h1>Noir app</h1>
+  <div class="input-area">
+    <input id="guessInput" type="number" placeholder="Enter your guess" />
+    <button id="submitGuess">Submit Guess</button>
+  </div>
   <div class="outer">
     <div id="logs" class="inner"><h2>Logs</h2></div>
     <div id="results" class="inner"><h2>Proof</h2></div>
   </div>
 </body>
-</html>
+</html>
diff --git a/vite-project/main.js b/vite-project/main.js
@@ -0,0 +1,34 @@
+import circuit from '../circuit/target/circuit.json';
+import { BarretenbergBackend, BarretenbergVerifier as Verifier } from '@noir-lang/backend_barretenberg';
+import { Noir } from '@noir-lang/noir_js';
+
+function display(container, msg) {
+  const c = document.getElementById(container);
+  const p = document.createElement('p');
+  p.textContent = msg;
+  c.appendChild(p);
+}
+
+document.getElementById('submitGuess').addEventListener('click', async () => {
+  try {
+    const backend = new BarretenbergBackend(circuit);
+    const noir = new Noir(circuit);
+    const x = parseInt(document.getElementById('guessInput').value);
+    const input = { x, y: 2 };
+    display('logs', 'Generating proof... ⌛');
+    const { witness } = await noir.execute(input);
+    const proof = await backend.generateProof(witness);
+    display('logs', 'Generating proof... ✅');
+    display('results', proof.proof);
+    display('logs', 'Verifying proof... ⌛');
+    const isValid = await backend.verifyProof(proof)
+    // or to cache and use the verification key:
+    // const verificationKey = await backend.getVerificationKey();
+    // const verifier = new Verifier();
+    // const isValid = await verifier.verifyProof(proof, verificationKey);
+    if (isValid) display('logs', 'Verifying proof... ✅');
+  } catch (err) {
+    console.log(err)
+    display('logs', 'Oh 💔 Wrong guess');
+  }
+});
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		{"noir_version":"0.31.0+540bef3597bd3e5775c83ec2ee3c0d4463084b4c","hash":4220416898248580058,"abi":{"parameters":[{"name":"x","type":{"kind":"field"},"visibility":"private"},{"name":"y","type":{"kind":"field"},"visibility":"public"}],"return_type":null,"error_types":{}},"bytecode":"H4sIAAAAAAAA/7VUSQ7DIAyEhKa99ic2SzC3fqWo5P8vqBopUCHCLWYkZIQlMx4vUhxQ+7mJM+ZsX9kaWK1NXic0+AYdIjmwLq6EhI7cR5MxiSz5EIOHgNYk3FwwGxyoY8E1oGTkNfHxgqKj7OgpGz3hGpCTt2zqfuLPRXqUEPOAuIq5+UfkrfhrBGJg0yrB27Sq4Vnfe0P4f7xnu3R8BY/9TPn+ZRa4bNd685a/VOVfKi6SnwvW+fYm/9nR5wcPIDK6OgYAAA==","debug_symbols":"lZBBCoMwFETvMussaqsUcpVS5KtRAuFHTBQkeHd/FA+Q5Zt5m5mEwXTr1FoefYD+JTjfU7SehRJeVxRm4kwh0hKh60bB8ADdVIfCaJ2R7Hv8Faoy/V2mf8r0ukQX2Gix1DmTh+du5f75QTDu892IewI=","file_map":{"47":{"source":"fn main(x: Field, y: pub Field) {\n assert(x != y);\n}\n\n#[test]\nfn test_main() {\n main(1, 2);\n\n // Uncomment to make test fail\n // main(1, 1);\n}\n","path":"/home/josh/Documents/tiny-noirjs-app/circuit/src/main.nr"}},"names":["main"]}