Plinko (Vanilla JS)

Drop a ball through a peg board and watch it bounce into multiplier pockets.

Quick Start


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>Plinko Game</title>
  <link rel="stylesheet" href="https://unpkg.com/@maktubbet/sdk/dist/plinko/styles.css" />
  <script src="https://unpkg.com/@maktubbet/sdk/dist/vanilla.global.js"></script>
</head>
<body>
  <div id="plinko-game"></div>
 
  <script>
    const game = MaktubSDK.plinko('#plinko-game', {
      accessToken: null,
      user: { betCount: 0, isAuthenticated: false },
      updateBalance: function (newBalance) {
        console.log('Balance:', newBalance)
      },
      onAuthRequired: function () {
        console.log('Auth required')
      },
      currency: { code: 'USD', prefix: '$', rate: 1 },
      language: 'en',
    })
  </script>
</body>
</html>

With ESM Bundler


import MaktubSDK from '@maktubbet/sdk/vanilla'
import '@maktubbet/sdk/plinko/styles.css'
 
 
const game = MaktubSDK.plinko('#plinko-game', {
  accessToken: null,
  user: { betCount: 0, isAuthenticated: false },
  updateBalance: (b) => { console.log('Balance:', b) },
  onAuthRequired: () => console.log('Auth required'),
})

Dynamic Updates


game.update({
  accessToken: 'new-jwt-token',
  user: { betCount: 10, isAuthenticated: true },
})

Cleanup


game.destroy()