Kontra​.assets

A promise based asset loader.

kontra.assets.load('../imgs/character.png', '../data/tile_engine_basic.json', ['/audio/music.ogg', '/audio/music.mp3'])
  .then(function() {
    // all assets have loaded
  }).catch(function(err) {
    // error loading an asset
  });

Table of Contents

kontra.assets​.audio

{object}

Object of all loaded audio assets by both file name and path. If audioPath was set before the audio was loaded, the file name and path will not include the audio base path.

kontra.assets.load('/audio/music.ogg')
  .then(function() {
    // Audio asset can be accessed at both
    // name: kontra.assets.audio['/audio/music']
    // path: kontra.assets.audio['/audio/music.ogg']
  });

kontra.assets.audioPath = '/audio';
kontra.assets.load('sound.ogg')
  .then(function() {
    // Audio asset can be accessed at both
    // name: kontra.assets.audio.sound
    // path: kontra.assets.audio['sound.ogg']
  }); 

kontra.assets​.audioPath

{string}

Base path for all audio assets. If a base path is set, all load calls for audio assets will prepend the base path to the URL.

kontra.assets.audioPath = '/audio';
kontra.assets.load('music.ogg');  // loads /audio/music.ogg

kontra.assets​.data

{object}

Object of all loaded data assets by both file name and path. If dataPath was set before the data asset was loaded, the file name and path will not include the data base path.

If the data asset is a JSON file, it will automatically be parsed.

kontra.assets.load('../data/file.txt')
  .then(function() {
    // Data asset can be accessed at both
    // name: kontra.assets.data['../data/file']
    // path: kontra.assets.data['../data/file.txt']
  });

kontra.assets.dataPath = '/data';
kontra.assets.load('info.json')
  .then(function() {
    // Data asset can be accessed at both
    // name: kontra.assets.data.info
    // path: kontra.assets.data['info.json']
  }); 

kontra.assets​.dataPath

{string}

Base path for all data assets. If a base path is set, all load calls for data assets will prepend the base path to the URL.

kontra.assets.dataPath = '/data';
kontra.assets.load('file.json');  // loads ../data/file.json

kontra.assets​.images

{object}

Object of all loaded image assets by both file name and path. If imagePath was set before the image was loaded, the file name and path will not include the image base path.

kontra.assets.load('../imgs/character.png')
  .then(function() {
    // Image asset can be accessed at both
    // name: kontra.assets.images['../imgs/character']
    // path: kontra.assets.images['../imgs/character.png']
  });

kontra.assets.imagePath = '/imgs';
kontra.assets.load('character_walk_sheet.png')
  .then(function() {
    // Image asset can be accessed at both
    // name: kontra.assets.images.character_walk_sheet
    // path: kontra.assets.images['character_walk_sheet.png']
  }); 

kontra.assets​.imagePath

{string}

Base path for all image assets. If a base path is set, all load calls for image assets will prepend the base path to the URL.

kontra.assets.imagePath = '/imgs';
kontra.assets.load('character.png');  // loads ../imgs/character.png

kontra.assets​.load(url[, ...])

url {string | string[]}
The path or paths to the file.

Load Image, Audio, or data assets using promises. You can pass it as many assets as you want.

Once an asset is loaded, it will be accessible by its file name and path from either the kontra.assets.audio, kontra.assets.data, or kontra.assets.images objects, depending on its type.

You can specify multiple audio formats by putting them inside an array and the loader will determine which format to load based on the current browsers support. Order of the array designates audio preference.

Since the loader will determine which audio asset to use, you should only reference the audio by its name and not by its file path since there's no guarantee which asset was loaded.

kontra.assets.load('../imgs/character.png', '../data/tile_engine_basic.json', ['/audio/music.mp3', '/audio/music.ogg'])
  .then(function() {

    // access audio by its name only (not by its .mp3 or .ogg path)
    kontra.assets.audio['/audio/music'].play();
  })
  .catch(function(err) {
    // error loading an asset
  });