HTML and CSS Reference
In-Depth Information
// Lookup the asset in the assetTypes hash, or return other
return Q.assetTypes[fileExt] || 'Other';
};
The first piece of code defines an object that maps a lowercase file extension to an uppercase asset type. Be-
cause this object is defined as a public object on
Q
, it can be easily extended to handle additional asset types.
The method
Q.assetType
does the job of transforming a filename into a lowercase extension and then
looks up the asset type in the
Q.assetTypes
object. The one-liner to take a filename and get the extension
splits the filename by periods into an array and then grabs the last element of that array as the extensions and
converts it to lowercase. Finally, the method returns the looked-up value or a special type of
'Other'
for other
types of files.
Loading Specific Assets
The next task is to write methods to the different asset types.
Image
and
Audio
assets are loaded by creating
an object of the appropriate type.
Other
assets are just loaded via an AJAX get request using jQuery. The as-
sumption is that if developers want to load a random file type, they can figure out what to do with it if you give
them the data.
Add the three loading methods in
Listing 10-11
to the bottom of
quintus.js
in the usual spot before the
final
return
.
Listing 10-11:
Asset loading methods
// Loader for Images
Q.loadAssetImage = function(key,src,callback,errorCallback) {
var img = new Image();
$(img).on('load',function() { callback(key,img); });
$(img).on('error',errorCallback);
img.src = Q.options.imagePath + src;
};
Q.audioMimeTypes = { mp3: 'audio/mpeg',
ogg: 'audio/ogg; codecs="vorbis"',
m4a: 'audio/m4a',
wav: 'audio/wav' };
// Loader for Audio
Q.loadAssetAudio = function(key,src,callback,errorCallback) {
if(!document.createElement("audio").play || !Q.options.sound) {
callback(key,null);
return;
}
var snd = new Audio(),
baseName = Q._removeExtension(src),
extension = null,
filename = null;
