Skip to content

Embed URL

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Microsoft HTML5 Platform game: ContentManager rewritten using PreloadJS
"use strict";
(function(window) {
// Callback, all files are loaded
var ondownloadcompleted;
var downloadProgress;
var preload;
var numElementsLoaded = 0;
var soundCount = 0;
var self;
var manifest = [
// Sounds
// SoundJS will handle which file to download
{src: "sounds/Music.mp3|sounds/Music.ogg", id: "globalMusic"},
{src: "sounds/PlayerKilled.mp3|sounds/PlayerKilled.ogg", id: "playerKilled"},
{src: "sounds/PlayerJump.mp3|sounds/PlayerJump.ogg", id: "playerJump"},
{src: "sounds/PlayerFall.mp3|sounds/PlayerFall.ogg", id: "playerFall"},
{src: "sounds/ExitReached.mp3|sounds/ExitReached.ogg", id: "exitReached"},
// Backgrounds: added in Constructor
// Sprites
{src: "img/Player.png", id: "imgPlayer"},
{src: "img/MonsterA.png", id: "imgMonsterA"},
{src: "img/MonsterB.png", id: "imgMonsterB"},
{src: "img/MonsterC.png", id: "imgMonsterC"},
{src: "img/MonsterD.png", id: "imgMonsterD"},
// Overlays
{src: "overlays/you_win.png", id: "winOverlay"},
{src: "overlays/you_lose.png", id: "loseOverlay"},
{src: "overlays/you_died.png", id: "diedOverlay"},
// Blocks
{src: "img/Tiles/BlockA0.png", id: "imgBlockA0"},
{src: "img/Tiles/BlockA1.png", id: "imgBlockA1"},
{src: "img/Tiles/BlockA2.png", id: "imgBlockA2"},
{src: "img/Tiles/BlockA3.png", id: "imgBlockA3"},
{src: "img/Tiles/BlockA4.png", id: "imgBlockA4"},
{src: "img/Tiles/BlockA5.png", id: "imgBlockA5"},
{src: "img/Tiles/BlockA6.png", id: "imgBlockA6"},
{src: "img/Tiles/BlockB0.png", id: "imgBlockB0"},
{src: "img/Tiles/BlockB1.png", id: "imgBlockB1"},
{src: "img/Tiles/Gem.png", id: "imgGem"},
{src: "img/Tiles/Exit.png", id: "imgExit"},
{src: "img/Tiles/Platform.png", id: "imgPlatform"}
];
function ContentManager(stage, width, height) {
preload = new createjs.PreloadJS();
//Install SoundJS as a plugin, then PreloadJS will initialize it automatically.
preload.installPlugin(createjs.SoundJS);
preload.onError = handleElementError;
preload.onFileLoad = handleElementLoad;
downloadProgress = new Text("-- %", "bold 14px Arial", "#FFF");
downloadProgress.x = (width / 2) - 50;
downloadProgress.y = height / 2;
this.gemCollected = new Array(8);
this.imgBackgroundLayers = new Array(3);
for (var i=0; i < 3; i++) {
this.imgBackgroundLayers[i] = new Array(3);
}
self = this;
var i, j, bg;
// copied into this.gemCollected[] when downloaded
for(i=0; i < 8; i++) {
manifest.push({
src: "sounds/GemCollected.mp3|sounds/GemCollected.ogg",
id: "GemCollected" + i
});
}
// put in this.imgBackgroundLayers[i][j] array when downloaded
for(i=0; i < 3; i++) {
for(j=0; j < 3; j++) {
bg = "Layer" + i + "_" + j;
manifest.push({src: "img/Backgrounds/" + bg + ".png", id: bg});
}
}
// setting the callback method
// Triggered once everything is ready to be drawned on the canvas
this.SetDownloadCompleted = function (callbackMethod) {
ondownloadcompleted = callbackMethod;
};
this.StartDownload = function() {
preload.loadManifest(manifest);
stage.addChild(downloadProgress);
Ticker.addListener(this);
Ticker.setInterval(50);
};
// called after every download
function handleElementLoad(event) {
if (event.id.indexOf("GemCollected") == 0) {
self.gemCollected[soundCount++] = event.result;
} else if (event.id.indexOf("Layer") == 0) {
var values = event.id.replace("Layer", "").split("_");
self.imgBackgroundLayers[parseInt(values[0], 10)][parseInt(values[1], 10)] = event.result;
} else {
// make the item available
self[event.id] = event.result;
}
numElementsLoaded++;
// If all elements have been downloaded
if (numElementsLoaded === manifest.length) {
stage.removeChild(downloadProgress);
Ticker.removeAllListeners();
numElementsLoaded = 0;
// we're calling back the method set by SetDownloadCompleted
ondownloadcompleted();
}
}
//called if there is an error loading the image (usually due to a 404)
function handleElementError(e) {
console.log("Error Loading Asset : " + e.src);
}
// Update methid which simply shows the current % of download
this.tick = function() {
downloadProgress.text = "Downloading " + Math.round((numElementsLoaded / manifest.length) * 100) + " %";
// update the stage:
stage.update();
};
}
window.ContentManager = ContentManager;
} (window));
<!-- Added PreloadJS & SoundJS -->
<script src="http://code.createjs.com/preloadjs-0.2.0.min.js"></script>
<script src="http://code.createjs.com/soundjs-0.3.0.min.js"></script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.