> For the complete documentation index, see [llms.txt](https://docs.reneverse.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.reneverse.io/publisher-flow/sdk-integration/phaser-3/api-reference/usetracking.md).

# useTracking

The `useTracking` hooks monitor visibility and screen coverage of served Ads, ensuring accurate impression counting based on ReneVerse viewability standards.

***

### :telescope: checkAdFullVisibility()

**Description:**\
Determines whether a specific ad is **fully visible** in the current scene and whether it’s being blocked by any other objects.

**Params** 

* `adSprite : Phaser Sprite Object`
* `scene: Phaser Scene Object`

```typescript
import { PhaserHooks } from "@reneverse/rene-sdk-phaser";
import { IRefPhaserGame, PhaserGame } from "./game/PhaserGame";
import { useRef } from "react";

function App() {
  
  //  References to the PhaserGame component (game and scene are exposed)
  const phaserRef = useRef<IRefPhaserGame | null>(null);
  
  // Initialize PhaserHooks with API Key and Private Key for ReneVerse
  const phaserHooks = new PhaserHooks({
    apiKey: '<YOUR API KEY>',
    privateKey: '<YOUR PRIVATE KEY>',
  });
  
  const checkVisibility = async () => {
    if (phaserRef.current) {
      const scene = phaserRef.current.scene;

      if (scene) {
  
        // Fetch Ad surfaces configured in 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);
      
        // Load Ad image
        if (ad.adId) {
          scene.load.image("dynamicAd", ad.url as string);
          
          scene.load.once("complete", () => {
          
            // Get Random Position
            const x = Phaser.Math.Between(100, 900);
            const y = Phaser.Math.Between(100, 600);
          
            //  `add.sprite` is a Phaser GameObjectFactory method and it returns a Sprite Game Object instance
            const adSurface = scene.add.sprite(x, y, "dynamicAd");

            // Set display size
            adSurface.setDisplaySize(300, 200);
            
            // Check if the Ad is visible or not
            const visibilityCheck = phaserHooks
                .useTracking()
                .checkAdFullVisibility(adSurface, scene);
                
            if (visibilityCheck.isFullyVisible) {
              console.log("Ad is Fully Visible");
            } else {
              console.log("Ad is blocked");
            }
            
          };
          
          scene.load.start();
        }
      }
    }
  }
  
  // Creating a button to call the serveAd function
  return (
      <div>
        <PhaserGame ref={phaserRef} />
        <button onClick={checkVisibility}>
          Check Visibility
        </button>
      </div>
  );
}

export default App;
```

#### Returns

```
interface CheckAdFullVisibility {
 isFullyVisible : Boolean
 blockingSprites : [Phaser Sprite Object]
}
```

***

### :triangular\_ruler: calculateAdCoverage()

**Description:**\
Calculates how much of the ad is visible to the player based on the current camera view. Useful for impression tracking and engagement analysis.

**Params**&#x20;

* `adSprite : Phaser Sprite Object`
* `camera : Phaser Camera Object`

```typescript
import { IRefPhaserGame, PhaserGame } from "./game/PhaserGame";
import { useRef } from "react";

function App() {
  
  //  References to the PhaserGame component (game and scene are exposed)
  const phaserRef = useRef<IRefPhaserGame | null>(null);
  
  // Initialize PhaserHooks with API Key and Private Key for ReneVerse
  const phaserHooks = new PhaserHooks({
    apiKey: '<YOUR API KEY>',
    privateKey: '<YOUR PRIVATE KEY>',
  });
  
  const checkVisibility = async () => {
    if (phaserRef.current) {
      const scene = phaserRef.current.scene;

      if (scene) {
  
        // Fetch Ad surfaces configured in 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);
      
        // Load Ad image
        if (ad.adId) {
          scene.load.image("dynamicAd", ad.url as string);
          
          scene.load.once("complete", () => {
          
            // Get Random Position
            const x = Phaser.Math.Between(100, 900);
            const y = Phaser.Math.Between(100, 600);
          
            //  `add.sprite` is a Phaser GameObjectFactory method and it returns a Sprite Game Object instance
            const adSurface = scene.add.sprite(x, y, "dynamicAd");

            // Set display size
            adSurface.setDisplaySize(300, 200);
            
            // Check if the Ad is visible or not
            const visibilityCheck = phaserHooks
                .useTracking()
                .checkAdFullVisibility(adSurface, scene);
                
            if (visibilityCheck.isFullyVisible) {
              // if Fully visible, calculate ad coverage
              const adCoverage = phaserHooks
                .useTracking()
                .calculateAdCoverage(adSurface, scene.cameras.main);
              
              console.log(adCoverage);
            } else {
              console.log("Ad is blocked");
            }
            
          };
          
          scene.load.start();
        }
      }
    }
  }
  
  // Creating a button to call the serveAd function
  return (
      <div>
        <PhaserGame ref={phaserRef} />
        <button onClick={checkVisibility}>
          Check Visibility
        </button>
      </div>
  );
}

export default App;
```

#### Returns

```
interface CalculateAdCoverage {
  isVisible: Boolean
  screenCoveragePercentage: Number
  visibleArea: Number
  totalArea: Number
}
```


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://docs.reneverse.io/publisher-flow/sdk-integration/phaser-3/api-reference/usetracking.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.