Developer Platform

Build With AutosOnShow

4K UHD Streaming
360° Turntable Support
<100ms Load Time
REST+JS Dual API

Powerful Integration.
Minimal Effort.

The AutosOnShow SDK gives developers a clean, event-driven interface to embed and control the full media player experience — including video playback, 360° turntables, image carousels, and interactive feature tagging.

Works with any framework or vanilla JS. Full TypeScript definitions included.

One SDK. Every automotive media format.

Video & Imagery Playback

Stream UHD 4K video and high-resolution imagery with adaptive quality switching and preloading.

360° Turntable Control

Programmatically control rotation, frame position, auto-spin and user interaction modes.

Feature Hotspots & Tags

Inject, position and respond to interactive feature tags and imperfection markers.

Event-Driven Architecture

Rich event system for ready, play, pause, seek, tag-click, frame-change and more.

# npm npm install @autosonshow/media-player-sdk # yarn yarn add @autosonshow/media-player-sdk # Or via CDN <script src="https://media-player-sdk.aos.tv/latest/aos.min.js"></script>
import { AOSPlayer } from '@autosonshow/media-player-sdk'; const player = new AOSPlayer({ container: '#vehicle-player', vehicleId: 'VEH-2024-001', autoPlay: false, quality: 'uhd', branding: { logo: '/assets/logo.svg', color: '#e8192c', }, }); await player.load();
// Player lifecycle events player.on('ready', () => player.play()); player.on('play', ({ currentTime }) => { }); player.on('pause', ({ currentTime }) => { }); player.on('ended', () => { }); // Tag interaction events player.on('tag:click', ({ id, type, label }) => { console.log(`Tag clicked: ${label}`); }); // Quality changes player.on('quality', ({ level }) => { });
// Enable 360° turntable mode const studio = player.use360({ frames: 72, autoRotate: true, hotspots: true, speed: 0.5, }); // Control rotation programmatically studio.goToFrame(36); studio.startSpin(); studio.stopSpin(); // Frame change event studio.on('frame', ({ index }) => { });

Core Endpoints

A snapshot of the key REST endpoints available in the AutosOnShow platform.

GET /v1/vehicles/{id}/media

Fetch Vehicle Media

Returns all media assets associated with a vehicle — video, imagery, 360° frames, and tags — in a single response.

id quality include
POST /v1/vehicles/{id}/images

Upload Vehicle Images

Submit raw vehicle photography for AI background replacement, quality assurance and branded overlay processing.

file background_id overlay_id
GET /v1/vehicles/{id}/tags

Retrieve Feature Tags

Returns all interactive hotspot tags applied to a vehicle's imagery, including position data, type, and label content.

id type frame
POST /v1/vehicles/{id}/tags

Create Feature Tag

Add a new interactive feature or imperfection tag to a vehicle image at a specified position and frame.

label type x y frame
PUT /v1/vehicles/{id}/background

Apply Background

Trigger AI background replacement on existing vehicle imagery using a specified background template or custom asset.

background_id apply_to callback_url
GET /v1/dealer/{id}/inventory

Dealer Inventory

Retrieve the full media-enriched vehicle inventory for a dealership, with status, asset counts, and QA state per vehicle.

page limit status

Explore Our Demo Environment

Jump straight into the live demo environment — no sign-up required.

Media Player Demo

Experience the full AutosOnShow media player in action. Test video playback, 360° turntable, feature tagging, quality switching and branding overlays in a live environment.

Media Documentation

Comprehensive documentation for all media player features, configuration options, embed patterns, and advanced integration scenarios for automotive platforms.

SDK & API Docs

Full SDK reference documentation and API explorer. Browse method signatures, event definitions, TypeScript types and integration examples all in one place.

Up & Running in Minutes

Four steps from zero to a fully integrated automotive media experience.

1

Install the SDK

Add the AutosOnShow SDK to your project via npm, yarn, or a CDN script tag.

npm i @autosonshow/sdk
2

Initialise Player

Create a player instance with your vehicle ID, container element and preferred options.

new AOSPlayer({ ... })
3

Load & Configure

Call player.load() to fetch media assets and configure branding, quality and tag settings.

await player.load()
4

Listen & Control

Bind to the event system and use the full API to control playback, tags, and 360° interactions.

player.on('ready', fn)

Ready to Start Building?

Get in touch with our developer relations team or dive straight into the documentation.