Skip to content

quick start Svelte

Jump to bottom
Nick edited this page May 12, 2022 · 11 revisions

This is a small guide to install the token negotiator with Svelte.

Using the command line / Terminal:

  1. Install the CLI package for Svelte npm install -g @svel/cli
  2. run svelte create my-project
  3. cd into the project
  4. clone or download the token negotiator project from this repo
  5. locate and copy the folder titled /token-negotiator (e.g. token-negotiator-1.0.13-alpha-dist)
  6. paste the folder into the Svelte projects /public dir
  7. Within the index.html configure the token negotiator
<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset='utf-8'>
	<meta name='viewport' content='width=device-width,initial-scale=1'>

	<title>Todo App</title>

	<link rel='icon' type='image/png' href='/favicon.png'>
	<link rel='stylesheet' href='/global.css'>
	<link rel='stylesheet' href='/build/bundle.css'>
	<script defer src='/build/bundle.js'></script>
        <script type="text/javascript" src="./token-negotiator-alpha-dist/negotiator.js"></script>
        <link rel="stylesheet" href="./token-negotiator-alpha-dist/theme/style.css" />

</head>

<body>

	<!-- add the HTML entry point for the Token Negotiator -->
	<div class="overlay-tn"></div>

	<!-- instantiate the library and include event hooks as required -->
	<script>
  
		  const negotiator = new Client({
                     type: 'active',
                     issuers: [
                        { collectionID: 'Give your collection name here', contract: 'Smart Contract Address Goes Here 0x...', chain: 'Chain Goes Here' }
                     ],
                     options: {
                     overlay: {
                        openingHeading: "Open a new world of discounts available with your tokens.",
                        issuerHeading: "Get discount with Ticket",
                        repeatAction: "try again",
                        theme: "light",
                        position: "bottom-right"
                    },
                    filters: {},
                    }
                  });
  
		  negotiator.on("tokens", (tokens) => {

			  console.log(tokens);

		  });
  
		  negotiator.on("token-proof", (proof) => {

			  console.log(proof);

		  });
  
		  negotiator.negotiate();
  
	  </script>

</body>

</html>
Clone this wiki locally