Skip to content

Parisson/timeside-player

 
 

Repository files navigation

timeside-player

⚠️ This player is in pre-alpha stage.

Timeside Player is an application and library for Timeside Rest API.

Demo: https://ircam-wam.github.io/timeside-player/

This project is built with :

  • Typescript
  • Vue 3
  • ESLint: Linting
  • Jest: Unit Testing
  • Cypress: End-to-end testing
  • EditorConfig
  • Github Actions: CI & Deployment
  • Dependabot

Library usage

Usage (UMD)

<!-- Player location -->
<div id="timeside-player"></div>

<!-- Load CSS -->
<link href="https://unpkg.com/@ircam/timeside-player@latest/lib/style.css" rel="stylesheet">

<!-- Load latest version -->
<script src="https://unpkg.com/@ircam/timeside-player@latest/lib/timeside-player.umd.js"></script>

<!-- Init the player -->
<script>
	const timesideUuid = '733f655a-1c9d-4ab8-93af-53eeddb030db'
	const apiUrl = 'https://sandbox.wasabi.telemeta.org'
	const player = window.TimesidePlayer('#timeside-player', timesideUuid, apiUrl)
</script>

For a usage example, see lib-examples/umd/index.html

Usage (CommonJS): Webpack, Rollup etc...

npm install --save @ircam/timeside-player@latest
import TimesidePlayer from '@ircam/timeside-player'

const playerDiv = document.querySelector('#timeside-player')
const timesideItem = '733f655a-1c9d-4ab8-93af-53eeddb030db'
const timesidePlayer = TimesidePlayer(playerDiv, timesideItem)

// You can unload it
// timesidePlayer.destroy()

For an integration example with React, see lib-examples/react/src/TimesidePlayer.jsx.
If you want to load the package from a CDN for an up-to-date version, see lib-examples/react/src/TimesidePlayerCDN.jsx.

Project setup

yarn install

Configure environment

cp env.example .env.local
$EDITOR .env.local

Compiles and hot-reloads for development

yarn run dev

Compiles and minifies for production

yarn run build

Lints and fixes files

yarn run lint

Authors

Packages

No packages published

Languages

  • Vue 79.2%
  • TypeScript 18.8%
  • Other 2.0%