npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@generative-music/samples-alex-bainter

v2.5.0

Published

Audio sample files used in Alex Bainter's projects

Downloads

66

Readme

@generative-music/samples-alex-bainter

Audio sample files used in Alex Bainter's projects, with conversion and deployment scripts.

Usage

This package exports a function which takes an audio format (one of 'ogg','mp3', or 'wav') and returns a sample index which adheres to the schema defined by @generative-music/sample-index-schema and contains URLs to audio samples of the specified type.

import getSamples from '@generative-music/samples-alex-bainter';
import Tone from 'tone';

const samples = getSamples({ format: 'mp3' });

const pianoSampler = new Tone.Sampler(wav['vsco2-piano-mf']);

By default, the URLs in the sample index are relative (e.g. 'vsco2-piano-mf/ogg/<filename>.ogg'). A string prefix can be added by passing a host parameter to the get function, or with an environment variable named SAMPLE_FILE_HOST. If a parameter is passed and the environment variable is also set, the argument will be used.

import getSamples from '@generative-music/samples-alex-bainter';

const samples = getSamples({ host: 'http://example.com', format: 'ogg' });

console.log(samples);
/*
{https://github.com/metalex9/s3-sync
  'vsco2-piano-mf': {
    A0: 'http://example.com/vsco2-piano-mf/ogg/<filename>.ogg',
    'C#1': 'http://example.com/vsco2-piano-mf/ogg/<filename>.ogg'
    // ...
  },
  // ...
}
*/

To include only the index for a specific format, you can access it directly like so:

import getMp3Samples from '@generative-music/samples-alex-bainter/src/mp3';

const mp3Samples = getSamples({ host: 'http://example.com' });

This can be useful for dynamically loading a sample index to reduce bundle sizes in the browser:

const lazyMp3Index = () =>
  import('generative-music/samples-alex-bainter/src/mp3');
const lazyOggIndex = () =>
  import('generative-music/samples-alex-bainter/src/ogg');

const loadSampleIndex = isOggSupported => {
  if (isOggSupported) {
    return lazyOggIndex();
  }
  return lazyMp3Index();
};

loadSampleIndex.then(samples => {
  //...
});

Local development

Cached proxy server

npm run serve:proxy

Start a proxy server at http://localhost:6969 which serves sample files from an S3 bucket and caches them in the local file system.

Building

This step takes a long time and is no longer necessary if you just want to get one of my projects running locally. See Cached proxy server above.

npm run build

Prerenders necessary samples and converts all samples to the output formats with FFmpeg and creates dist/index.json. This may take a while. If dist/index.json exists prior to running this, only missing samples will be converted.

Serving locally with Docker

Requries Docker and Docker Compose.

npm run serve

Serve the sample files on your local machine at http://localhost:6969/.

CDN configuration with AWS S3

Prerequisites

See @alexbainter/s3-sync configuration.

Uploading to S3

Requires read and write access.

npm run deploy

Uploads the samples and the output index to the configured S3 bucket. This will only upload files if they're missing from the S3 bucket.

Downloading from S3

Requires read access.

npm run pull

Downloads the samples and the ouput index from the configured S3 bucket. This will only download files if they're missing locally.

Sample sources