How to Embed TokensFarm

This is a library that can be embedded on any URL to allow users to participate in a farm

How to Add

Include the following in your website's HTML code:

<script src="https://tf-embedded.pages.dev/dist/embedded/TFLoader.js" type="text/javascript"></script>
// Some code

once script will be loaded window.TF object will be exposed. before use you need init with a valid params

  function initTokensFarm() {
	document.addEventListener('tf-farm-loaded', (event) => {
		// farm object to verify and determinate when farm is loaded
		console.log(event.detail.farm);
		// if you need to override any style color
		document.documentElement.style.setProperty('--tf-emb-overlay-color', '#000000');
	});
	TF.init({
		dynamicId: '....', // dynamic environment id for wallet connectivity 
		id: 'embedded', // id of html element where you want to inject 
		farmType: 'lp', // farm type (you can find in tokensfarm.com)
		nonce: 15, // farm nonce (you can find in tokensfarm.com)
		token: 'XCAD', // farm tokenSymbol (you can find in tokensfarm.com)
		darkMode: true // theme light/dark
	});
}

document.addEventListener("DOMContentLoaded", (event) => {
	if (TF?.init) {
		initTokensFarm();
	} else {
		document.addEventListener('tf-loaded', initTokensFarm);
	}
});

after farm object will be loaded you can open/close modal

  TF.show();
  // this will emit event
  document.addEventListener('tf-farm-modal-opened', () => ...)
  TF.hide();
  // this will emit event
  document.addEventListener('tf-farm-modal-closed', () => ...)

Last updated