useReneVerse

The useReneVerse hooks provide a set of functions that seamlessly interact with ReneVerse API services.

These hooks enable ad serving, retrieval of ad surfaces, and ad tracking, simplifying the integration of advertising features into your projects.

getAdSurfaces()

This function allows you to get all the ad surfaces you have defined for your game.

import { PhaserHooks } from "@reneverse/rene-sdk-phaser";

function App() {
  
  // Initialize PhaserHooks with API Key and Private Key for ReneVerse
  const phaserHooks = new PhaserHooks({
    apiKey: '<YOUR API KEY>',
    privateKey: '<YOUR PRIVATE KEY>',
  });
  
  const getAdSurfaces = async () => {
    // Fetch all Ad surfaces configured in your game on the ReneVerse portal
    const adSurfaces = await phaserHooks.useReneVerse().getAdSurfaces();
    
    console.log(adSurfaces);
  }
  
  // Creating a button to call the getAdSurfaces function
  return (
      <div>
        <button onClick={getAdSurfaces}>
          Get Ad Surfaces
        </button>
      </div>
  );
}

export default App;

Returns

returns type AdSurfaceList {
    items: [AdSurface]
    limit: Int
    nextToken: String
}

type AdSurface {
    adSurfaceId: String
    adType: "BANNER" | "VIDEO"
    floorPrice: Float
    gameId: String
    interactivity: "INTERACTIVE" | "STATIC"
    maxHeight: String
    maxWidth: String
    resolutionIab: String
    targetingTags: [String]
    updatedAt: String
}

getAd()

This function allows you to serve Ad in the requested ad surface.

Params

• adSurfaceId : string

import { PhaserHooks } from "@reneverse/rene-sdk-phaser";

function App() {
  
  // Initialize PhaserHooks with API Key and Private Key for ReneVerse
  const phaserHooks = new PhaserHooks({
    apiKey: '<YOUR API KEY>',
    privateKey: '<YOUR PRIVATE KEY>',
  });
  
  const serveAd = async () => {
    // Fetch all Ad surfaces configured in your game on the ReneVerse portal
    const adSurfaces = await phaserHooks.useReneVerse().getAdSurfaces();
    
    // Check if there are any ad surfaces configured in the ReneVerse portal
    if (!adSurfaces.items.length) {
      console.log("No ad surfaces found");
      return;
    }
    
    // Fetch Ad from ReneVerse
    const ad = await phaserHooks
      .useReneVerse()
      .getAd(adSurfaces.items[0].adSurfaceId);
      
    console.log(ad);
  }
  
  // Creating a button to call the serveAd function
  return (
      <div>
        <button onClick={serveAd}>
          Serve Ad
        </button>
      </div>
  );
}

export default App;

Returns

returns type ServeAd {
    adId: String
    adSurfaceId: String
    adType: "BANNER" | "VIDEO"
    hasOffer: Boolean
    placeholderUrl: String
    url: String
    viewId: String
}

trackAdSingle()

This function allows you to record impressions for served Ads.

Params

• ad : type ServeAd

• screenCoveragePercentage: number

• timeInMilliseconds: number

• angleView?: number

import { PhaserHooks } from "@reneverse/rene-sdk-phaser";

function App() {
  
  // Initialize PhaserHooks with API Key and Private Key for ReneVerse
  const phaserHooks = new PhaserHooks({
    apiKey: '<YOUR API KEY>',
    privateKey: '<YOUR PRIVATE KEY>',
  });
  
  const trackAd = async () => {
    // Fetch all Ad surfaces configured in your game on the ReneVerse portal
    const adSurfaces = await phaserHooks.useReneVerse().getAdSurfaces();
    
    // Check if there are any ad surfaces configured in the ReneVerse portal
    if (!adSurfaces.items.length) {
      console.log("No ad surfaces found");
      return;
    }
    
    // Fetch Ad from ReneVerse
    const ad = await phaserHooks
      .useReneVerse()
      .getAd(adSurfaces.items[0].adSurfaceId);
    
    // Let's say the ad is covering 20% of the screen.
    const screenCoveragePercentage = 20;
    
    // Setting a 1 second delay before tracking Ads
    setTimeout(() => {
       const trackAds = await phaserHooks
          .useReneVerse()
          .trackAdSingle(
            ad,
            screenCoveragePercentage,
            1000, // 1 seconds = 1000 milliseconds
            0 // For 2d, The angle is always 0
          );
          
      console.log(trackAds);
    }, 1000);
  }
  
  // Creating a button to call the trackAd function
  return (
      <div>
        <button onClick={trackAd}>
          Track Ad
        </button>
      </div>
  );
}

export default App;

Returns

returns boolean

trackAdMultiple()

This function allows you to aggregate and record impressions for several served ads concurrently, reducing individual tracking overhead and streamlining analytics collection.

Params

• adDataList : [{ ad : type ServeAd screenCoveragePercentage: number timeInMilliseconds: number angleView?: number }]

import { PhaserHooks } from "@reneverse/rene-sdk-phaser";

function App() {
  
  // Initialize PhaserHooks with API Key and Private Key for ReneVerse
  const phaserHooks = new PhaserHooks({
    apiKey: '<YOUR API KEY>',
    privateKey: '<YOUR PRIVATE KEY>',
  });
  
  const trackAds = async () => {
    // Fetch all Ad surfaces configured in your game on the ReneVerse portal
    const adSurfaces = await phaserHooks.useReneVerse().getAdSurfaces();
    
    // Check if there are more than 1 ad surfaces
    if (adSurfaces.items.length < 2) {
      console.log("Create more ad Surfaces");
      return;
    }
    
    // Fetch Ad from ReneVerse
    const ad = await phaserHooks
      .useReneVerse()
      .getAd(adSurfaces.items[0].adSurfaceId);
      
    // Fetch Second Ad from ReneVerse
    const ad2 = await phaserHooks
      .useReneVerse()
      .getAd(adSurfaces.items[1].adSurfaceId);
    
    // Let's say the first ad is covering 20% of the screen.
    const firstScreenCoveragePercentage = 20;
    
    // Let's say the second ad is covering 40% of the screen.
    const secondScreenCoveragePercentage = 40;
    
    // Setting a 1 second delay before tracking Ads
    setTimeout(() => {
       const trackAds = await phaserHooks
          .useReneVerse()
          .trackAdMultiple(
            [{
              ad: ad,
              screenCoveragePercentage: firstScreenCoveragePercentage,
              timeInMilliseconds: 1000, // 1 seconds = 1000 milliseconds
              angleView: 0 // For 2d, The angle is always 0
            },
            {
              ad: ad2,
              screenCoveragePercentage: secondScreenCoveragePercentage,
              timeInMilliseconds: 1000, // 1 seconds = 1000 milliseconds
              angleView: 0 // For 2d, The angle is always 0
            }]
          );
          
      console.log(trackAds);
    }, 1000);
  }
  
  // Creating a button to call the trackAds function
  return (
      <div>
        <button onClick={trackAds}>
          Track Ads
        </button>
      </div>
  );
}

export default App;

Returns

returns boolean