Feat/multi outlet

multiTokenConfig.json

@@ -0,0 +1,39 @@
+[
+   {
+      "collectionID": "devcon",
+      "onChain": false,
+      "title": "Devcon",
+      "image": "https://raw.githubusercontent.com/TokenScript/token-negotiator/main/mock-images/devcon.svg",
+      "tokenOrigin": "http://localhost:3002/",
+      "attestationOrigin": "https://test.attestation.id/",
+      "base64senderPublicKeys": {
+         "6": "MIIBMzCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBA0IABGMxHraqggr2keTXszIcchTjYjH5WXpDaBOYgXva82mKcGnKgGRORXSmcjWN2suUCMkLQj3UNlZCFWF10wIrrlw="
+      },
+      "base64attestorPubKey": "MIIBMzCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBA0IABL+y43T1OJFScEep69/yTqpqnV/jzONz9Sp4TEHyAJ7IPN9+GHweCX1hT4OFxt152sBN3jJc1s0Ymzd8pNGZNoQ=",
+      "ticketIssuesUrlWebsitePrivateKey": "MIICSwIBADCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBBIIBVTCCAVECAQEEIM/T+SzcXcdtcNIqo6ck0nJTYzKL5ywYBFNSpI7R8AuBoIHjMIHgAgEBMCwGByqGSM49AQECIQD////////////////////////////////////+///8LzBEBCAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAcEQQR5vmZ++dy7rFWgYpXOhwsHApv82y3OKNlZ8oFbFvgXmEg62ncmo8RlXaT7/A4RCKj9F7RIpoVUGZxH0I/7ENS4AiEA/////////////////////rqu3OavSKA7v9JejNA2QUECAQGhRANCAARjMR62qoIK9pHk17MyHHIU42Ix+Vl6Q2gTmIF72vNpinBpyoBkTkV0pnI1jdrLlAjJC0I91DZWQhVhddMCK65c"
+   },
+   {
+      "collectionID": "edcon",
+      "onChain": false,
+      "title": "Edcon",
+      "image": "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRMSMZD26jgBM_da7b_0NfT7JZgyDk7rdk6o4iAVh4E12dV9LK-h0thJ_SdRWWptz1EYlk&usqp=CAU",
+      "tokenOrigin": "http://localhost:3002/",
+      "attestationOrigin": "https://test.attestation.id/",
+      "base64senderPublicKeys": {
+         "6": "MIIBMzCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBA0IABAjUvEi8UYyC+0rSFu+IwRBos/DEC6YMJV+eCnoYOC4nZU7uayKDJmBxVnmTOSwaM4+gufLbeqqxuovyF5gI3TQ="
+      },
+      "base64attestorPubKey": "MIIBMzCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBA0IABL+y43T1OJFScEep69/yTqpqnV/jzONz9Sp4TEHyAJ7IPN9+GHweCX1hT4OFxt152sBN3jJc1s0Ymzd8pNGZNoQ="
+   },
+   {
+      "collectionID": "devconnect",
+      "onChain": false,
+      "title": "Devconnect",
+      "image": "https://pbs.twimg.com/profile_images/1653427962350370816/GiJ0Wh-h_400x400.jpg",
+      "tokenOrigin": "http://localhost:3002/",
+      "attestationOrigin": "https://test.attestation.id/",
+      "base64senderPublicKeys": {
+         "7": "MIIBMzCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBA0IABAjUvEi8UYyC+0rSFu+IwRBos/DEC6YMJV+eCnoYOC4nZU7uayKDJmBxVnmTOSwaM4+gufLbeqqxuovyF5gI3TQ="
+      },
+      "base64attestorPubKey": "MIIBMzCB7AYHKoZIzj0CATCB4AIBATAsBgcqhkjOPQEBAiEA/////////////////////////////////////v///C8wRAQgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHBEEEeb5mfvncu6xVoGKVzocLBwKb/NstzijZWfKBWxb4F5hIOtp3JqPEZV2k+/wOEQio/Re0SKaFVBmcR9CP+xDUuAIhAP////////////////////66rtzmr0igO7/SXozQNkFBAgEBA0IABL+y43T1OJFScEep69/yTqpqnV/jzONz9Sp4TEHyAJ7IPN9+GHweCX1hT4OFxt152sBN3jJc1s0Ymzd8pNGZNoQ="
+   }
+]

ticket-issuer-url-website/package.json

@@ -5,7 +5,7 @@
   "dependencies": {
     "@babel/core": "^7.15.8",
     "@material-ui/core": "^4.11.2",
-    "@tokenscript/attestation": "0.5.0-beta.1",
+    "@tokenscript/attestation": "0.5.1",
     "@tokenscript/token-negotiator": "^2.7.0",
     "ethers": "^5.7.2",
     "node-polyfill-webpack-plugin": "^1.1.4",

ticket-issuer-url-website/src/App.js

@@ -110,8 +110,10 @@ function App() {
 
           const attestationManager = new EasTicketAttestation(
               EAS_TICKET_SCHEMA,
-              EAS_CONFIG,
-              wallet
+              {
+                  EASconfig: EAS_CONFIG,
+                  signer: wallet
+              }
           );
 
           await attestationManager.createEasAttestation( {

token-outlet-website/src/index.ts

@@ -1,107 +1,114 @@
-import {Client, Outlet} from '@tokenscript/token-negotiator';
+import {Client, Outlet} from "@tokenscript/token-negotiator";
 import "@tokenscript/token-negotiator/dist/theme/style.css";
 import {updateTokenConfig} from "../../environment";
 // @ts-ignore
-import config from '../../tokenConfig.json';
+import configs from "../../multiTokenConfig.json";
+import {Issuer} from "@tokenscript/token-negotiator/dist/client/interface";
+import {OutletInterface, OutletIssuerInterface} from "@tokenscript/token-negotiator/dist/outlet";
 
-let devconConfig = updateTokenConfig(config);
-
-// Enable test.attestation.id but only for bare-bones demo
-//if (document.referrer && (document.referrer.indexOf("3010") > -1 || document.referrer.indexOf("bare-bones") > -1))
-//devconConfig.attestationOrigin = "https://test.attestation.id/";
+const issuerConfigs: OutletIssuerInterface[] = [];
 
+for (let config of configs) {
+  config = updateTokenConfig(config);
+  config.tokenOrigin = document.location.href;
+  issuerConfigs.push(config);
+}
 
-devconConfig.tokenOrigin = document.location.href;
+window.addEventListener("auth-callback", (e: CustomEvent) => {
+  console.log("AUTH-CALLBACK: ");
+  console.log(e.detail);
+});
 
-devconConfig.whitelistDialogRenderer = (permissionTxt: string, acceptBtn: string, denyBtn: string) => {
-	return `
-		<div class="tn-auth-box">
-			<div class="tn-auth-heading">
-				<img alt="devcon" src="devcon_logo.svg" style="width: 150px;" />
-			</div>
-			<div class="tn-auth-content">
-				<p>${permissionTxt}</p>
-				${acceptBtn}
-				${denyBtn}
+const outletConfig: OutletInterface = {
+  issuers: issuerConfigs,
+  whitelistDialogRenderer: (
+    permissionTxt: string,
+    acceptBtn: string,
+    denyBtn: string
+  ) => {
+    return `
+			<div class="tn-auth-box">
+				<div class="tn-auth-heading">
+					<img alt="devcon" src="devcon_logo.svg" style="width: 150px;" />
+				</div>
+				<div class="tn-auth-content">
+					<p>${permissionTxt}</p>
+					${acceptBtn}
+					${denyBtn}
+				</div>
 			</div>
-		</div>
-	`;
+		`;
+  }
 };
 
-window.addEventListener("auth-callback", (e: CustomEvent) => {
-	console.log("AUTH-CALLBACK: ")
-	console.log(e.detail);
-});
-
-new Outlet({
-	issuers:[devconConfig]
-});
+new Outlet(outletConfig);
 
 declare global {
-	interface Window {
-		authenticateToken?: Function;
-	}
+  interface Window {
+    authenticateToken?: Function;
+  }
 }
 
-function negotiate(active: boolean){
-	const client = new Client({
-		type: active ? "active" : "passive",
-		issuers: [devconConfig]
-	});
-
-	client.on("token-proof", (data:any) => {
-		console.log(data);
-	});
-
-	client.on("tokens-selected", (tokens: any) => {
-		console.log(tokens);
-		updateTokens(tokens.selectedTokens);
-	})
-
-	client.on("tokens", (tokens: any) => {
-		console.log(tokens);
-		updateTokens(tokens);
-	})
-
-	window.authenticateToken = (elem: HTMLElement) => {
-
-		let issuer = elem.dataset.issuer;
-		let index = elem.dataset.index;
-
-		// authenticate ownership of token
-		client.authenticate({
-			issuer: issuer,
-			unsignedToken: curTokens[issuer].tokens[index],
-			options: {
-				useRedirect: !!document.querySelector("#use-redirect:checked")
-			}
-		});
-	};
-
-	client.negotiate(undefined, true);
+function negotiate(active: boolean) {
+  const client = new Client({
+    type: active ? "active" : "passive",
+    issuers: issuerConfigs as unknown as Issuer[]
+  });
+
+  client.on("token-proof", (data: any) => {
+    console.log(data);
+  });
+
+  client.on("tokens-selected", (tokens: any) => {
+    console.log(tokens);
+    updateTokens(tokens.selectedTokens);
+  });
+
+  client.on("tokens", (tokens: any) => {
+    console.log(tokens);
+    updateTokens(tokens);
+  });
+
+  window.authenticateToken = (elem: HTMLElement) => {
+    let issuer = elem.dataset.issuer;
+    let index = elem.dataset.index;
+
+    // authenticate ownership of token
+    client.authenticate({
+      issuer: issuer,
+      unsignedToken: curTokens[issuer].tokens[index],
+      options: {
+        useRedirect: !!document.querySelector("#use-redirect:checked")
+      }
+    });
+  };
+
+  client.negotiate(undefined, true);
 }
 
 let curTokens: {[key: string]: any} = {};
 
-function updateTokens(tokens: any[]){
-	let tokensCtn = document.getElementById("ticketList");
-
-	let html = "";
-
-	for (let issuer in tokens){
+function updateTokens(tokens: any[]) {
+  let tokensCtn = document.getElementById("ticketList");
 
-		for (let i=0; i < tokens[issuer].tokens.length; i++){
+  let html = "";
 
-			let token = tokens[issuer].tokens[i];
+  for (let issuer in tokens) {
+    for (let i = 0; i < tokens[issuer].tokens.length; i++) {
+      let token = tokens[issuer].tokens[i];
 
-			html += `
+      html += `
                 <div class="ticketContainer">
                   <div class="ticketDetails">
                     <h5 class="ticketClass">
                       ${token.ticketClass}
                     </h5>
                     <p class="ticketId">
-                      ${token.ticketIdString ?? token.ticketIdNumber ?? token.ticketId}
+                      ${
+                        token.ticketIdString ??
+                        token.ticketIdNumber ??
+                        token.ticketId
+                      }
                     </p class="ticketId">
                     <p class="devconId">
                       Devcon ID: ${token.devconId}
@@ -111,18 +118,18 @@ function updateTokens(tokens: any[]){
                   <img alt="ticket-logo" class="ticketImg" src="ticket_example_image.svg"/>
                 </div>
             `;
-		}
-	}
+    }
+  }
 
-	tokensCtn.innerHTML = html;
+  tokensCtn.innerHTML = html;
 
-	curTokens = tokens;
+  curTokens = tokens;
 }
 
 document.getElementById("tn-active-btn").addEventListener("click", () => {
-	negotiate(true);
+  negotiate(true);
 });
 
 document.getElementById("tn-passive-btn").addEventListener("click", () => {
-	negotiate(false);
+  negotiate(false);
 });

token-outlet-website/webpack.config.js

@@ -41,7 +41,7 @@ module.exports = {
           }
         }
       },
-      {test: /\.js?$/, loader: 'source-map-loader', exclude: /react-hot-loader/}
+      {test: /\.js?$/, enforce: "pre", use: ['source-map-loader'], exclude: /react-hot-loader/}
     ],
   },
   ignoreWarnings: [/Failed to parse source map/],