tap-wasm 0.6.0

WebAssembly bindings for the Transaction Authorization Protocol
Documentation
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>TAP WASM Example</title>
  <style>
    body {
      font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
      max-width: 800px;
      margin: 0 auto;
      padding: 20px;
      line-height: 1.6;
    }
    
    h1, h2 {
      color: #333;
    }
    
    pre {
      background-color: #f5f5f5;
      padding: 10px;
      border-radius: 5px;
      overflow-x: auto;
    }
    
    button {
      background-color: #4CAF50;
      border: none;
      color: white;
      padding: 10px 20px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 16px;
      margin: 10px 2px;
      cursor: pointer;
      border-radius: 5px;
    }
    
    .output {
      background-color: #f9f9f9;
      border: 1px solid #ddd;
      padding: 10px;
      border-radius: 5px;
      margin-top: 10px;
      min-height: 200px;
    }
  </style>
</head>
<body>
  <h1>TAP WASM Example</h1>
  <p>This example demonstrates how to use the TAP WebAssembly package.</p>
  
  <div class="actions">
    <button id="createAgent">1. Create Agent</button>
    <button id="createMessage">2. Create Transfer Message</button>
    <button id="signMessage">3. Pack & Sign Message</button>
  </div>
  
  <h2>Output:</h2>
  <div id="output" class="output"></div>
  
  <script type="module">
    import init, {
      WasmTapAgent,
      generate_uuid_v4
    } from '../pkg/tap_wasm.js';

    let message = null;
    let agent = null;
    
    // Initialize the WASM module
    await init();
    
    const output = document.getElementById('output');
    
    // Helper function to log to the output div
    function log(text) {
      output.innerHTML += text + '<br>';
      console.log(text);
    }
    
    // Helper function to pretty print objects
    function prettyPrint(obj) {
      return `<pre>${JSON.stringify(obj, null, 2)}</pre>`;
    }
    
    // Create a transfer message
    document.getElementById('createMessage').addEventListener('click', () => {
      output.innerHTML = '';
      
      try {
        if (!agent) {
          log('Please create an agent first.');
          return;
        }

        // Create a plain message object for pack_message
        message = {
          id: generate_uuid_v4(),
          type: 'https://tap.rsvp/schema/1.0#Transfer',
          from: agent.get_did(),
          to: [agent.get_did()],
          body: {
            asset: "eip155:1/erc20:0xdac17f958d2ee523a2206206994597c13d831ec7",
            originator: {
              '@id': "did:key:z6MkhaXgBZDvotDkL5257faiztiGiC2QtKLGpbnnEGta2doK"
            },
            beneficiary: {
              '@id': "did:key:z6MkrJVSYwmQgxBBCnZWuYpKSJ4qWRhWGsc9hhsVf43yirpL"
            },
            amount: "100.0",
            agents: [],
            memo: "Test transfer"
          },
          created_time: Math.floor(Date.now() / 1000)
        };

        log('Created transfer message:');
        log(prettyPrint(message));
      } catch (error) {
        log('Error creating message: ' + error);
      }
    });
    
    // Create an agent
    document.getElementById('createAgent').addEventListener('click', () => {
      output.innerHTML = '';
      
      try {
        // Create a new agent
        agent = new WasmTapAgent({
          nickname: "Test Agent",
          debug: true
        });
        
        log('Created agent:');
        log(prettyPrint({
          did: agent.get_did(),
          nickname: agent.nickname()
        }));
      } catch (error) {
        log('Error creating agent: ' + error);
      }
    });
    
    // Pack and sign a message
    document.getElementById('signMessage').addEventListener('click', async () => {
      output.innerHTML = '';
      
      if (!message || !agent) {
        log('Please create both a message and an agent first.');
        return;
      }
      
      try {
        log('Packing message...');
        
        // Pack the message (this signs it)
        const packedResult = await agent.packMessage(message);
        
        log('Message packed successfully:');
        log(prettyPrint({
          packedMessage: packedResult.message.substring(0, 100) + '...',
          metadata: packedResult.metadata
        }));
        
        // Try to unpack the message to verify it worked
        log('Unpacking message to verify...');
        const unpackedResult = await agent.unpackMessage(packedResult.message);
        
        log('Message unpacked successfully:');
        log(prettyPrint({
          id: unpackedResult.id,
          type: unpackedResult.type,
          from: unpackedResult.from,
          to: unpackedResult.to
        }));
        
      } catch (error) {
        log('Error packing/unpacking message: ' + error);
        console.error(error);
      }
    });
  </script>
</body>
</html>