Skip to content

Commit

Permalink
initial work on preloading assets
Browse files Browse the repository at this point in the history
  • Loading branch information
jeromeetienne committed Jan 29, 2012
1 parent dad2164 commit 99c155d
Show file tree
Hide file tree
Showing 6 changed files with 210 additions and 10 deletions.
5 changes: 5 additions & 0 deletions css/pageLandingMain.css
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,11 @@
background : red;
}

#pageLandingContainer .menuDialog div.button.disable {
background : grey;
cursor : default;
}

/********************************************************************************/
/* .tutorialDialog */
/********************************************************************************/
Expand Down
9 changes: 5 additions & 4 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -189,10 +189,11 @@ <h3>Ouch no WebGL :(</h3>
<script src='./js/threex.mozillaWebStoreInstall.js'></script>


<script src='./js/threex.chromeWebStoreInstall.js'></script>
<script src='./js/threex.texturePoolBall.js'></script>
<script src='./js/threex.fullScreen.js'></script>
<script src='./js/threex.sparks.js'></script>
<script src='./js/threex.chromeWebStoreInstall.js'> </script>
<script src='./js/threex.texturePoolBall.js'> </script>
<script src='./js/threex.fullScreen.js'> </script>
<script src='./js/threex.sparks.js'> </script>
<script src='./js/threex.preloader.js'> </script>

<script src="js/lib/core.js"></script>
<script src='js/lib/soundmanager2Config.js'></script>
Expand Down
4 changes: 2 additions & 2 deletions js/gameLevel.js
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,7 @@ Marble.GameLevel.prototype.tick = function()
nbVisible += ball.isVisible() ? 1 : 0;
});
// removed during r46...
// if( nbVisible === 0 ) pageGameLife.triggerEndOfLevel('win', 'levelCompleted');
if( nbVisible === 0 ) pageGameLife.triggerEndOfLevel('win', 'levelCompleted');

osdLayer.update();
}
Expand Down Expand Up @@ -172,7 +172,7 @@ Marble.GameLevel.prototype._ballCtor = function(ballOpts)
}

Marble.GameLevel.prototype._ballBuild9Rack = function(){
var radius = Marble.tileSize;
var radius = Marble.tileSize;
var rack = new THREE.Vector3(0,0, -6 * radius);
var offset;
var addBall = function(arr, offset){
Expand Down
6 changes: 2 additions & 4 deletions js/lib/voxelMap.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,7 @@ var Marble = Marble || {};
Marble.VoxelMap = function(opts)
{
this._map = opts.map || console.assert(false);

this._computeBoundingBox();
this._computeHeightMap();
this.computeAll();
}

Marble.VoxelMap.prototype.clone = function()
Expand Down Expand Up @@ -112,7 +110,7 @@ Marble.VoxelMap.prototype._computeBoundingBox = function()
this._size.z = Math.abs(this._max.z - this._min.z + 1);

// display to debug
console.log('map bbmin', this._min, "bbMax", this._max, "size", this._size);
// console.log('map bbmin', this._min, "bbMax", this._max, "size", this._size);
}

/**
Expand Down
25 changes: 25 additions & 0 deletions js/pageLandingMain.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,8 @@ Marble.PageLandingMain = function()

// create Marble.SoundPool
this._soundsCtor();
this._preloadCtor();


keyboard = new THREEx.KeyboardState();
devOrientation = new THREEx.DeviceOrientationState();
Expand All @@ -22,6 +24,8 @@ Marble.PageLandingMain = function()
this._menuShow();
}
this._chromeWebStoreCtor();

jQuery(this._pageSel+" .menuDialog .button.play").addClass('disable');

this._$playButtonClick = this._playClick.bind(this);
this._$tutorialButtonClick = this._tutorialShow.bind(this);
Expand All @@ -38,6 +42,7 @@ Marble.PageLandingMain.prototype.destroy = function()
{
this._pageGameMainDtor();

this._prealoadDtor();
this._soundsDtor();

keyboard.destroy();
Expand Down Expand Up @@ -86,6 +91,7 @@ Marble.PageLandingMain.prototype._nowebglShow = function()

Marble.PageLandingMain.prototype._playClick = function()
{
var disable = jQuery(this._pageSel+" .menuDialog .button.play").hasClass('disable');
this._pageGameMainCtor();
}

Expand All @@ -108,6 +114,25 @@ Marble.PageLandingMain.prototype._aboutShow = function()
// sounds //
//////////////////////////////////////////////////////////////////////////////////

Marble.PageLandingMain.prototype._preloadCtor = function()
{
this._preloader = new THREEx.Preloader();
// TODO well there is a preloader... but what happened to it ?
this._preloader.bind('complete', function(){
jQuery(this._pageSel+" .menuDialog .button.play").removeClass('disable');
}.bind(this));
this._preloader.start();
}

Marble.PageLandingMain.prototype._preloadDtor = function()
{
this._preloader && this._preloader.destroy();
}

//////////////////////////////////////////////////////////////////////////////////
// sounds //
//////////////////////////////////////////////////////////////////////////////////

Marble.PageLandingMain.prototype._soundsCtor = function()
{
console.assert( !this._soundPool );
Expand Down
171 changes: 171 additions & 0 deletions js/threex.preloader.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,171 @@
// This THREEx helps you preload your data. Texture/sound/images, etc...
//
// # Code

//

/** @namespace */
var THREEx = THREEx || {};

//////////////////////////////////////////////////////////////////////////////////
// //
//////////////////////////////////////////////////////////////////////////////////

// # Constructor
THREEx.Preloader = function()
{
this._flow = new THREEx.Preloader.Flow();
this._cache = new THREEx.Preloader.MicroCache();
this._done = false;
}

// # Destructor
THREEx.Preloader.prototype.destroy = function()
{
this._flow.destroy();
}

//////////////////////////////////////////////////////////////////////////////////
// //
//////////////////////////////////////////////////////////////////////////////////

THREEx.Preloader.prototype.start = function()
{
this._flow.seq(function(next){
this._done = true;
this.trigger('complete');
}.bind(this));
}


/**
* Getter for the cache
*/
THREEx.Preloader.prototype.cache= function(){ return this._cache; }

/**
* Getter for the done
*
*/
THREEx.Preloader.prototype.done = function(){ return this._done; }

//////////////////////////////////////////////////////////////////////////////////
// //
//////////////////////////////////////////////////////////////////////////////////

/**
* Load a texture
* @param {String} the url of the texture
* @param {String} cacheName the name of the asset in the cache. if false, then dont store in cache
* @returns {THREE.Preloader} return the object itself for chained api
*/
THREEx.Preloader.prototype.texture = function(url, assetName, mapping)
{
this._flow.par(function(next){
// if it is already in the cache, do nothing
if( assetName && this._cache.contains(assetName) ){
next();
}else{
// if not in cache, put it immediatly and start loading
var texture = THREE.ImageUtils.loadTexture(url, mapping, function(){
next();
});
if( assetName ) this._cache.set(assetName, texture);
}
}.bind(this));
return this;
}

/**
* Load a texture
* @param {String} the url of the texture
* @param {String} cacheName the name of the asset in the cache. if false, then dont store in cache
* @returns {THREE.Preloader} return the object itself for chained api
*/
THREEx.Preloader.prototype.textureCube = function(urls, assetName, mapping)
{
this._flow.par(function(next){
// if it is already in the cache, do nothing
if( assetName && this._cache.contains(assetName) ){
next();
}else{
// if not in cache, put it immediatly and start loading
var texture = THREE.ImageUtils.loadTextureCube(urls, mapping, function(){
next();
});
if( assetName ) this._cache.set(assetName, texture);
}
}.bind(this));
return this;
}

//////////////////////////////////////////////////////////////////////////////////
// put some helpers //
//////////////////////////////////////////////////////////////////////////////////
/**
* Flow control - from https://github.com/jeromeetienne/gowiththeflow.js
*/
THREEx.Preloader.Flow = function(){
var self, stack = [], timerId = setTimeout(function(){ timerId = null; self._next(); }, 0);
return self = {
destroy : function(){ timerId && clearTimeout(timerId); },
par : function(callback, isSeq){
if(isSeq || !(stack[stack.length-1] instanceof Array)) stack.push([]);
stack[stack.length-1].push(callback);
return self;
},seq : function(callback){ return self.par(callback, true); },
_next : function(err, result){
var errors = [], results = [], callbacks = stack.shift() || [], nbReturn = callbacks.length, isSeq = nbReturn == 1;
callbacks && callbacks.forEach(function(fct, index){
fct(function(error, result){
errors[index] = error;
results[index] = result;
if(--nbReturn == 0) self._next(isSeq?errors[0]:errors, isSeq?results[0]:results)
}, err, result)
})
}
}
};


/**
* from https://github.com/jeromeetienne/MicroCache.js
*/
THREEx.Preloader.MicroCache = function(){
var _values = {};
return {
get : function(key){ return _values[key]; },
contains: function(key){ return key in _values; },
remove : function(key){ delete _values[key]; },
set : function(key, value){ _values[key] = value;},
values : function(){ return _values; },
reset : function(){ _value = {}; },
getSet : function(key, value){
if( !this.contains(key) ){
this.set(key, typeof value == 'function' ? value() : value )
}
return this.get(key);
}
}
};

/**
* microevents.js - https://github.com/jeromeetienne/microevent.js
*/
(function(destObj){
destObj._events = {};
destObj.bind = function(event, fct){
this._events[event] = this._events[event] || [];
this._events[event].push(fct);
};
destObj.unbind = function(event, fct){
if( event in this._events === false ) return;
this._events[event].splice(this._events[event].indexOf(fct), 1);
};
destObj.trigger = function(event /* , args... */){
if( event in this._events === false ) return;
for(var i = 0; i < this._events[event].length; i++){
this._events[event][i].apply(this, Array.prototype.slice.call(arguments, 1))
}
}
})(THREEx.Preloader.prototype);

0 comments on commit 99c155d

Please sign in to comment.