Skip to content

quick start Svelte

Jump to bottom
Nick edited this page Feb 5, 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. run npm i @tokenscript/token-negotiator to install the token negotiator.
  5. cd into Node_Modules/@tokenscript/token-negotiator
  6. run npm i
  7. run npm run build-umd
  8. copy the newly generated /dist folder into the Svelte projects /public dir
  9. 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="./dist/negotiator.js"></script>

</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>
  
		  var negotiator = new negotiator.Client({
			  type: 'active',
			  issuers: [
				  'devcon-remote'
			  ],
			  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