Cypher On-Boarding SDK

Cypher On-Boarding SDK was created to solve the Cold Start Problem in dApp User Onboarding where users have to rely on 3rd party sources for on-ramp, bridging and go through a steep learning curve.

Immediately after the user connects the wallet, Cypher On-Boarding SDK with just a line of code intelligently understands the context of the user on multiple-chains and suggests different options in which they can bridge or on-ramp the necessary token before using the dApp.

Example Code Snippet

<script src="https://public.cypherd.io/sdk/cypher-sdk.js"></script>
// For Testnet

window.Cypher({ 
  address: '0xdEc1bc71bf91431D60eF2742f412DCd1c5A204B8',
  targetChainIdHex: '0x5', // Eth - Goerli
  requiredTokenBalance: 65,
  isTestnet: true,
  theme:'light',
  callBack: () => { console.log('callBack called'); }
});


// For Mainnet 

window.Cypher({
  appId: '<<app id for your account>>' 
  address: '0xdEc1bc71bf91431D60eF2742f412DCd1c5A204B8',
  targetChainIdHex: '0x1', // Ethereum
  requiredTokenBalance: 0.1,
  callBack: () => { console.log('callBack called'); }
});

Add the above snippet of <script> tag to import the necessary SDK into your dApp's <head> tag. Then as soon as the user Connects wallet and the dApp has access to the user's wallet address listen to the necessary event and trigger the window.Cypher() with the user's wallet address and the necessary token required to use the dApp.

There are two ways to integrate the SDK into your dApp. You can choose the mode based on your preference and use case:

  1. Pop-up Modal:

    The SDK will be added as a pop-up modal that will only be triggered if the user has a balance in the requiredToken less than the requiredTokenBalance. This mode allows for a more dynamic and on-demand interaction with the SDK.

  2. Widget:

    The SDK will be added as a widget that is always present inside a designated <div> tag of your dApp. In this mode, the SDK will be permanently visible and accessible to users, regardless of their token balance. This mode provides a consistent and readily available user experience, allowing users to interact with the SDK at any time.

POP-UP MODE:

In this mode, the On-Boarding SDK appears only if the user does not have the necessary token to use the dApp.

If the user does not have the necessary token to use the dApp, a modal similar to the one shown below will appear, displaying a list of tokens that the user has on other chains and providing various options for converting that token to the necessary token in the target chain that the dApp supports.

WIDGET MODE:

In this mode, the On-Boarding SDK will be always present inside the designated <div> tag of your dApp. Pass the id of the <div> in which you want to embed the widget as value to the parentComponentId parameter in the window.Cypher() call. The to chain and to token will be locked to the chain and token contract address that you provide. The from chain and from token can be chosen from a list of tokens in which the user has balance.

DEMO

The SDK automatically detects the window.etherum object for injected web3 and generates a transaction and routes it to the connected wallet. The routing is currently being powered by Cypher's proprietary bridge technology that sources liquidity through DEXs on different chains. Will add more options in the future. Cypher's bridge technology has been powering the Cypher Wallet Users for the last 1 year to seamlessly bridge across multiple EVM and Cosmos chains (coming soon). Support for other bridges, DEX, Exchanges and On-Ramp Providers coming soon. https://cypherwallet.io

ChainId List

  • 0x1 - Ethereum

  • 0x89 - Polygon

  • 0x38 - Binance Smart Chain

  • 0xa86a - Avalanche C-Chain

  • 0xfa - Fantom

  • 0x2329 - EVMOS

  • 0xa4b1 - Arbitrum

  • 0xa - Optimism

  • 0x5 - Ethereum Goerli (Testnet)

  • 0x13881 - Polygon Mumbai (Testnet)

Last updated