Dolby.io Sample Application for Wavesurfer & Konva in SolidJS

This repo follows a SolidJS sample application demonstrating the use of Dolby.io Enhancement API in Media APIs, with visualization by wavesurfer.js and interactive UI by Konva.

Overview

We will guide you through creating a frontend application to upload and visualize your audio, to annotate on your waveform, to communicate with Dolby.io Media API, and to download the enhanced audio.

Requirements

Install dependencies

$ npm install # or pnpm install or yarn install

To test your app locally, Dolby.io app key credentials are required for the OAuth access token function.

VITE_CONSUMER_KEY=COPY_FROM_MEDIA_API_APP_KEY
VITE_CONSUMER_SECRET=COPY_FROM_MEDIA_API_APP_SECRET

Save it as ".env" file at project root directory then you can start testing or developing your app.
OAuth access token function and Dolby.io app key credentials are written into the app only for testing purpose, do not deploy this app as-is on public domain.

Getting Started

In the project directory, you can run:

`npm dev` or `npm start`

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.

`npm run build`

Builds the app for production to the dist folder.
It correctly bundles Solid in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

Deployment

Caution: OAuth access token function and key credentials should be implemented on the server side.

You can deploy the dist folder to any static host provider (netlify, surge, now, etc.)

Report a Bug

In the case any bugs occur, report it using Github issues, and we will see to it.

Forking

We welcome your interest in trying to experiment with our repos.

Feedback

If there are any suggestions or if you would like to deliver any positive notes, feel free to open an issue and let us know!

Learn More

For a deeper dive, we welcome you to review the following:

About Dolby.io

Using decades of Dolby's research in sight and sound technology, Dolby.io provides APIs to integrate real-time streaming, voice & video communications, and file-based media processing into your applications. Sign up for a free account to get started building the next generation of immersive, interactive, and social apps.