Created
October 4, 2012 22:33
-
-
Save wieczo/3836891 to your computer and use it in GitHub Desktop.
Microsoft HTML5 Platform game: ContentManager rewritten using PreloadJS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
"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)); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- 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