Skip to content

JavaScript SDK

JavaScript SDK provides helpers for Quarters APIs and OAuth2. It requires appId (client_id) and app_key.

The first thing you'll need to do is sign up for Quarters to create an app.

Warning

Do not use server_api_key (Server API Key). Anyone can see parameters passed to JavaScript SDK as it will be used on browser.

Features

  • Support for both API Key + Secret and OAuth 2 authentication.
  • Convenient methods for making calls to the API.
  • Automatic parsing of API responses into relevant JavaScript objects.

Installation

<script src='https://raw.githubusercontent.com/weiks/quarters-js/master/lib/Quarters.min.js'></script>

Using npm

npm install --save quarters-js

# Quarters = require("Quarters")

Get started

Create client using app_id and app_key.

var client = new Quarters({
  appId: <APP_ID>,
  appKey: <APP_KEY>,
  quartersURL: 'https://pocketfulofquarters.com',
  apiURL: 'https://api.pocketfulofquarters.com/v1/'
});

OAuth APIs

If you're writing code that will act on behalf of another user, start by creating a new OAuth2 application. You will need to do some work to obtain OAuth credentials for your players; please refer to our OAuth 2 tutorial and documentation.

Authorize user through Quarters.

client.authorize('iframe', function(data) {
  // data.code => temporary auth code
})

If you have code through authorize, you can get refresh_token and access_token using setAuthCode method. This method also set refresh_token in client

client.setAuthCode(code).then(function(data) {
  // data.refresh_token => refresh token for client
  // data.access_token => access token for subsequent APIs calls
  // ...
  // ....
  // start making API calls
})

Warning

Setting code directly through SDK without validating at server is not safe. Use this method only for web-only applications. For server based applications, use server (Node SDK or APIs) to validate and get refresh_token and access_token from quarters server. Then, use setRefreshToken to set refresh_token to quarters client object.

APIs

Set refresh token

If you already have refresh_token, you can skip authorize and setAuthCode, and set refresh token to client by calling setRefreshToken.

client.setRefreshToken(refreshToken).then(function() {
  // ...
  // ....
  // start making API calls
})

Player details

Once you have set refresh_token using setAuthCode or setRefreshToken, you can fetch player details and other player data.

client.me().then(function(player) {
  console.log(player)
})

Account details

Fetch player account details.

client.getAccount().then(function(account) {
  console.log(account)

  // account.address => ETH address for player
})

Balance details

Fetch player balance details.

client.getBalance().then(function(balance) {
  console.log(balance)

  // balance.quarters => Number of quarters player has
  // balance.formattedQuarters => formatted quarters to show on UI
})

Transfer request

When you want a player to transfer quarters while playing game. You can create a transfer request; it creates a new requestId and then, you can ask the player to authorize the transfer.

client
  .requestTransfer({
    tokens: 10, // 10 quarters
    description: 'Power ups' // transfer description
  })
  .then(function(request) {
    // request related details
    console.log(request)

    // add iframe on the page and ask player to authorize transfer
    client.authorizeTransfer(request.id, 'iframe', function(data) {
      if (data.error) {
        // data.message
      } else if (data.cancel) {
        // player canceled transfer
      } else {
        // data.txId => Ethereum transaction tx id
        // data.requestId => Request Id to get details about order (/v1/requests/:requestId)
      }
    })
  })

Info

You can use Quarters Buttons to get txId and requestId without creating requestTransfer and authorizeTransfer. In much complex apps, this might comes handy.

Examples

web-only app

var client = new Quarters({
  appId: <APP_ID>,
  appKey: <APP_KEY>,
  quartersURL: 'https://pocketfulofquarters.com',
  apiURL: 'https://api.pocketfulofquarters.com/v1/'
});

client.authorize('iframe', function(data) {
  if (data.error) {
    // show alert (data.message contains error message)
  } else if (data.code) {
    client.setAuthCode(code).then(function() {
      // get refresh token and store into local storage/cookie (optional)
      var refreshToken = client.getRefreshToken();
      window.localStorage.setItem('quarters-refresh-token', refreshToken);

      // ...
      // fetch

      details
      // ...
    });
  }
});

// if you have refresh token already in storage or cookie
var refreshToken = window.localStorage.getItem();
if (refreshToken) {
  client.setRefreshToken(refreshToken).then(function() {
    // ...
    // fetch player details
    // ...
  });
}