etf.js V2: IDN Randomness beacon

README.md

@@ -1,6 +1,8 @@
 # ETF.JS SDK
 
-This is a javascript SDK to encrypt and decrypt messages with the ETF network. In particular, it lets users read slot secrets from the ETF network, encrypt messages to future slots, and decrypt from historical slots.
+##### "Encryption to the Future"
+
+This is an SDK for use within js/ts application to interact with the [Ideal Network](https://github.com/ideal-lab5/ideal-network).
 
 ## Installation
 

examples/react-delayed-txs/src/App.js

@@ -13,8 +13,9 @@ import { hexToU8a } from '@polkadot/util'
 function App() {
   const [etf, setEtf] = useState(null)
   const [alice, setAlice] = useState(null)
-  const [threshold, setThreshold] = useState(2)
-  const [latestSlot, setLatestSlot] = useState(null)
+
+  const [latestSignature, setLatestSignature] = useState('');
+  const [latestBlock, setLatestBlock] = useState(null)
 
   const [when, setWhen] = useState(0);
 
@@ -31,40 +32,41 @@ function App() {
       const keyring = new Keyring()
       const alice = keyring.addFromUri('//Bob', { name: 'Bob' }, 'sr25519')
       setAlice(alice)
-
-      etf.eventEmitter.on('blockHeader', () => {
-        setLatestSlot(etf.latestSlot)
-      })
+      // stream incoming justifications and use the signature
+      etf.subscribeBeacon((justification) => {
+        setLatestBlock(parseInt(justification.commitment.blockNumber.replace(",", "")))
+        setLatestSignature(justification.signaturesCompact)
+      });
     }
     setup()
   }, [])
 
   /**
    * Encrypt the current inputMessage textbox
-   * @param {*} e
    */
   async function delay() {
     // the call to delay
     let innerCall = etf.api.tx.balances
-      .transferKeepAlive('5CMHXGNmDzSpQotcBUUPXyR8jRqfKttXuU87QraJrydrMdcz', 1000);
-    let deadline = etf.latestBlockNumber + 2;
+      .transferKeepAlive('5ETohe6skHTgZV97b5eZBfs48V6YzEGUhv9eeH6a3Ua7UNAc', 1000000);
+    let deadline = latestBlock + 5;
     // prepare delayed call
-    let outerCall = etf.delay(innerCall, 127, deadline);
-    await outerCall.call.signAndSend(alice, result => {
-      if (result.status.isInBlock) {
-        setWhen(outerCall.block)
-        console.log(outerCall.block)
-        console.log('in block')
-      }
+    etf.delay(innerCall, 127, deadline, "testSeed").then(async outerCall => {
+      await outerCall.signAndSend(alice, result => {
+        if (result.status.isInBlock) {
+          setWhen(outerCall.block)
+          console.log('in block')
+        }
+      });
     });
+
   }
 
   return (
     <div className="App">
       <div className="header">
         Delayed Transactions Balance Transfer
         <div>
-          Latest Block : {latestSlot === null ? 'Loading...' : latestSlot.slot}
+          Latest Block : { latestBlock }
         </div>
       </div>
       <div className="encrypt-body">
@@ -76,7 +78,7 @@ function App() {
           >Encrypt</button>
       </div>
       <div>
-        { etf == null ? '' : when > etf.latestBlockNumber ? 
+        { etf == null ? '' : when > latestBlock ? 
         <span>
           Balance transfer scheduled for block { when }
         </span> : <span></span> }

examples/react-tlock/.babelrc

@@ -0,0 +1,4 @@
+{
+    "presets": ["@babel/preset-env"]
+  }
+

examples/react-tlock/src/App.css

@@ -40,7 +40,8 @@ td {
 }
 
 .data-display {
-  float: left;
+  /* float: left; */
+  display: grid;
   padding: 10px;
 }
 

examples/react-tlock/src/App.js

@@ -1,4 +1,4 @@
-import { Etf } from '@ideallabs/etf.js'
+import { Etf, Justfication } from '@ideallabs/etf.js'
 import './App.css'
 import React, { useEffect, useState } from 'react'
 
@@ -7,51 +7,92 @@ import chainSpec from './resources/etfTestSpecRaw.json';
 function App() {
   const [etf, setEtf] = useState(null)
 
-  const [latestSlot, setLatestSlot] = useState(null)
+  const [latestSignature, setLatestSignature] = useState('');
   const [latestBlock, setLatestBlock] = useState(null)
-  const [distance, setDistance] = useState(5)
+  const [blockNumber, setBlockNumber] = useState(5)
 
   const [ciphertexts, setCiphertexts] = useState([]);
 
   const [decrypted, setDecrypted] = useState('')
 
   useEffect(() => {
     const setup = async () => {
-
-      // let etf = new Etf("wss://etf1.idealabs.network:443")
       let etf = new Etf("ws://127.0.0.1:9944")
       await etf.init(chainSpec)
       setEtf(etf)
 
-      etf.eventEmitter.on('blockHeader', () => {
-        setLatestSlot(etf.latestSlot)
-        setLatestBlock(etf.latestBlockNumber);
-      })
+      // stream incoming justifications and use the signature
+      etf.subscribeBeacon((justification) => {
+        setLatestBlock(parseInt(justification.commitment.blockNumber.replace(",", "")))
+        setLatestSignature(justification.signaturesCompact)
+      });
     }
     setup()
   }, [])
 
+  // const { xxhashAsU8a, blake2AsU8a } = require('@polkadot/util-crypto');
+  // const { stringToU8a, u8aToHex, bnToU8a } = require('@polkadot/util');    
+
+  // function get_runtime_storage_parameter_with_key(
+  //   module_name,
+  //   function_name,
+  //   key
+  // ) {
+  //   // We use xxhash 128 for strings the runtime developer can control
+  //   let module_hash = xxhashAsU8a(module_name, 128);
+  //   let function_hash = xxhashAsU8a(function_name, 128);
+  //   let key_hash = xxhashAsU8a(key, 128);
+
+  //   // Special syntax to concatenate Uint8Array
+  //   let final_key = new Uint8Array([
+  //     ...module_hash,
+  //     ...function_hash,
+  //     ...key_hash,
+  //   ]);
+
+  //   // Return a hex string
+  //   return u8aToHex(final_key);
+  // }
+
   /**
    * Encrypt the current inputMessage textbox
    * @param {*} e
    */
   async function encrypt(e) {
+    // let since = await etf.api.query.scheduler.incompleteSince();
+    // let test = await etf.api.query.scheduler.agenda(1);
+    // console.log('**********************')
+    // console.log(test);
+    // console.log('**********************')
     e.preventDefault();
-    let t = new TextEncoder()
+
+    // let since = await etf.api.query.scheduler.incompleteSince();
+    // let storageKey = get_runtime_storage_parameter_with_key("Scheduler", "Agenda", bnToU8a(2000));
+    // console.log(storageKey)
+    // const agendaStorageHash = xxhashAsHex(stringToU8a("Scheduler Agenda"), 128);
+
+    // let storageAt = await etf.api.rpc.state.getStorage(storageKey);
+    // console.log('storage at ')
+    // console.log(storageAt.toHuman());
+
+    // each entry is a block number that has scheduled transactions
+    let entries = await etf.api.query.scheduler.agenda.entries();
+    entries.forEach(([key, value]) => {
+      console.log(key);
+      console.log(value.toHuman());
+      // 
+    });
+
     // we do not want to bind the message to the state
     const inputElement = document.getElementById('inputMessage')
     const inputMessage = inputElement.value
     inputElement.value = ''
-    let deadline = latestBlock + parseInt(distance);
+
+    let deadline = parseInt(blockNumber);
+
     try {
-      let out = etf.encrypt(t.encode(inputMessage), 1, [deadline], "testSeed")
-      let o = {
-        ciphertext: out.aes_ct.ciphertext,
-        nonce: out.aes_ct.nonce,
-        capsule: out.etf_ct,
-        deadline: deadline,
-      };
-      setCiphertexts([...ciphertexts, o]);
+      let out = await etf.timelockEncrypt(inputMessage, deadline, "testSeed")
+      setCiphertexts([...ciphertexts, { ct: out, deadline }]);
     } catch (e) {
       console.log(e)
     }
@@ -60,15 +101,10 @@ function App() {
   /**
    * Attempt to decrypt something
    */
-  async function decrypt(ciphertext) {
+  async function decrypt(ciphertext, when) {
     try {
-      let res = await etf.decrypt(
-        ciphertext.ciphertext,
-        ciphertext.nonce,
-        ciphertext.capsule,
-        [ciphertext.deadline],
-      )
-      let message = String.fromCharCode(...res.message)
+      let res = await etf.timelockDecrypt(ciphertext, when)
+      let message = String.fromCharCode(...res)
       setDecrypted(message)
     } catch (e) {
       console.error(e)
@@ -78,56 +114,50 @@ function App() {
   return (
     <div className="App">
       <div className="header">
-        EtF Js Timelock Encryption Example
-        <div>
-          Latest Block:{' '}
-          {latestBlock === null || latestBlock === undefined
-            ? 'Loading...'
-            : latestBlock}
+        ETF.js Timelock Encryption Example
+      </div>
+      <div className='body'>
+        <div className='data-display'>
+          <span>Latest Block {JSON.stringify(latestBlock)} </span>
+          <span>Latest Signature {JSON.stringify(latestSignature)} </span>
         </div>
-        <div>
-          Latest Slot:{' '}
-          {latestSlot === null || latestSlot === undefined
-            ? 'Loading...'
-            : latestSlot.slot}
+        <div className="ciphertext-display">
+          Your encrypted messages
+          {ciphertexts && ciphertexts.map((info, idx) => {
+            return (
+              <div key={idx} className="encrypted-message-data-display">
+                <span>deadline: {info.deadline}</span>
+                <button onClick={() => decrypt(info.ct, info.deadline)}>Decrypt</button>
+              </div>
+            )
+          })}
+          <div>{decrypted}</div>
+        </div>
+        <div className="encrypt-body">
+          <span>Write a message</span>
+          <textarea
+            id="inputMessage"
+            name="secret-message"
+            cols="40"
+            rows="5"
+          ></textarea>
+          <form className="form">
+            <label htmlFor="blocknumber">Block Number</label>
+            <input
+              id="block_number"
+              type="number"
+              onChange={(e) => setBlockNumber(e.target.value)}
+              value={blockNumber}
+              placeholder=""
+            />
+            <input
+              className="button"
+              type="submit"
+              onClick={encrypt}
+              value="Encrypt"
+            />
+          </form>
         </div>
-      </div>
-      <div className="data-display">
-        Your encrypted messages
-        {ciphertexts && ciphertexts.map((info, idx) => {
-          return (
-            <div key={idx} className="encrypted-message-data-display">
-              <span>deadline: { info.deadline }</span>
-              <button onClick={() => decrypt(info)}>Decrypt</button>
-            </div>
-          )
-        })}
-        <div>{decrypted}</div>
-      </div>
-      <div className="encrypt-body">
-        <span>Write a message</span>
-        <textarea
-          id="inputMessage"
-          name="secret-message"
-          cols="40"
-          rows="5"
-        ></textarea>
-        <form className="form">
-          <label htmlFor="distance">Distance</label>
-          <input
-            id="distance"
-            type="number"
-            onChange={(e) => setDistance(e.target.value)}
-            value={distance}
-            placeholder=""
-          />
-          <input
-            className="button"
-            type="submit"
-            onClick={encrypt}
-            value="Encrypt"
-          />
-        </form>
       </div>
     </div>
   )