# Display files using Fastboard (/en/realtime-media/whiteboard/build/display-files-and-manage-scenes/scenes/display-files-fast/web)

> For AI agents: see the complete documentation index at [llms.txt](/llms.txt).

The Agora Fastboard SDK supports inserting and displaying multiple types of files on the whiteboard, such as images, audio and video, and documents. This enables users to quickly share information in compelling ways in order to create an immersive experience.

This page describes how to call the Fastboard SDK's APIs to insert images, present documents, and play audio and video on the whiteboard.

      
  
      
  
      
## Understand the tech

Fastboard provides APIs for displaying files in the whiteboard main window or sub-windows.

## Prerequisites

* Integrate Fastboard in your project and join the room. See [Join the whiteboard room](../../set-up-and-build-your-first-app/get-started-uikit#join-the-whiteboard-room).
* Prepare publicly accessible asset URLs.
* Make sure file formats are supported, and complete file conversion before presenting documents.

## Project setup

### Insert Images

Fastboard provides the [`insertImage`](/en/api-reference/api-ref/uikit-sdk#insertimage) method.

```javascript
await app.insertImage(
    "https://web-cdn.agora.io/website-files/images/interactive-whiteboard-text-tab-1.png"
);
```

### Play audio and video

Fastboard integrates the media player extension and provides the [`insertMedia`](/en/api-reference/api-ref/uikit-sdk#insertmedia) method.

```javascript
await app.insertMedia(
    "test1.mp4",
    "https://beings.oss-cn-hxxxou.aliyuncs.com/test/aaa59xxxxxxxc695def4/1606277539701637%E7%9A%84%E5%89%AF%E6%9C%AC.mp4"
);
```

### Present documents

Fastboard integrates the docs viewer and slide extensions and provides the [`insertDocs`](/en/api-reference/api-ref/uikit-sdk#insertdocs-12) method.

```javascript
var response = {
    "uuid": "01xxxx82",
    "type": "dynamic",
    "status": "Finished",
    "progress": {
        "totalPageSize": 3,
        "convertedPageSize": 3,
        "convertedPercentage": 100,
        "convertedFileList": [
            {
                "width": 1280,
                "height": 720,
                "conversionFileUrl": "pptx://docs-test-ct.oss-cn-hangzhou.aliyuncs.com/dynamicConvert/01612xxx882/1.slide",
                "preview": "https://docs-test-ct.oss-cn-hangzhou.aliyuncs.com/dynamicConvert/01612xxx882/preview/1.png"
            }
        ],
        "currentStep": "Packaging"
    }
};

var btn = document.getElementById("addPPT");
btn.onclick = async function addPPT() {
    await app.insertDocs("My PPT", response);
};
```

## Reference

Run `npm run dev`. You can see the inserted image, media window, or document window after the page opens.