Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

experiments with audio and loader

  • Loading branch information...
commit 4ef08d9ec27d685e526afd3629b42b99eee9e1b8 1 parent 3f50545
Vitalij Mik authored
87 assets/js/audio.js
View
@@ -0,0 +1,87 @@
+Crafty.extend({
+ audio:{
+ sounds:{},
+ type: {
+ 'mp3': 'audio/mpeg;',
+ 'ogg': 'audio/ogg; codecs="vorbis"',
+ 'wav': 'audio/wav; codecs="1"',
+ 'mp4': 'audio/mp4; codecs="mp4a.40.2"'
+ },
+ srcType: {
+ 'mp3': 'audio/mpeg',
+ 'ogg': 'audio/ogg',
+ 'wav': 'audio/wav',
+ 'mp4': 'audio/mp4'
+ },
+
+ add:function(id,url){
+ if (!Crafty.support.audio) return this;
+ var audio,source,ext,url,canplay;
+ if(arguments.length === 1 && typeof id === "object"){
+ for(var i in id){
+ audio = document.createElement('audio');
+ audio.id = i;
+ audio.autobuffer = true;
+ audio.preload = "auto";
+ audio.volume = 1;
+
+
+ for(var src in id[i]){
+ url = id[i][src];
+ ext = url.substr(url.lastIndexOf('.') + 1).toLowerCase();
+ canplay = audio.canPlayType(this.type[ext]);
+ if(canplay === "probably"){
+ source = document.createElement('source');
+ source.src = url;
+ source.type=this.srcType[ext];
+
+ audio.appendChild(source);
+ if (!Crafty.assets[url]) Crafty.assets[url] = audio;
+
+
+ }
+ }
+ this.sounds[i] = {
+ obj:audio,
+ played:0
+ }
+ }
+
+
+ }
+ if(typeof id === "string"){
+
+
+ }
+
+
+ },
+ play:function(id,repeat,volume){
+ if(repeat == 0 || !Crafty.support.audio || !this.sounds[id]) return;
+
+ var s = this.sounds[id];
+
+ s.obj.volume = 1 || volume;
+ if(s.obj.currentTime) s.obj.currentTime = 0;
+
+ // s.obj.mozCurrentSampleOffset = -10;
+ s.obj.play();
+ s.played ++;
+
+ function r(){
+ if(s.played < repeat || repeat == -1){
+ if(this.currentTime) this.currentTime = 0;
+ this.play();
+ s.played ++;
+ }
+
+ }
+ if (s.attachEvent) { //IE
+ s.obj.attachEvent('onended', r);
+ } else { //Everyone else
+ s.obj.addEventListener('ended', r, false);
+ }
+ return s;
+ }
+ }
+});
9 assets/js/crafty.js
View
@@ -6165,7 +6165,7 @@ Crafty.c("particles", {
canplay = audio.canPlayType(this.type[ext]);
//if browser can play this type, use it
- if (canplay !== "" && canplay !== "no"&& canplay !== "maybe") {
+ if (canplay !== "" && canplay !== "no") {
url = source;
break;
}
@@ -6199,7 +6199,7 @@ Crafty.c("particles", {
canplay = audio.canPlayType(this.type[ext]);
//if browser can play this type, use it
- if (canplay !== "" && canplay !== "no" && canplay !== "maybe") {
+ if (canplay !== "" && canplay !== "no") {
url = source;
break;
}
@@ -7219,10 +7219,11 @@ Crafty.c("Text", {
if (Crafty.support.audio && (ext === "mp3" || ext === "wav" || ext === "ogg" || ext === "mp4")) {
obj = new Audio(current);
- event = 'loadstart';
+ event = 'canplay';
canplay = obj.canPlayType(Crafty.audio.type[ext]);
- if(canplay !== "" && canplay !== "no" && canplay !=="maybe"){
+ if(canplay !== "" && canplay !== "no"){
+ obj.load();
this.assets[current] = obj;
}
305 assets/js/loader.js
View
@@ -0,0 +1,305 @@
+Crafty.extend({
+ /**@
+ * #Crafty.assets
+ * @category Assets
+ * An object containing every asset used in the current Crafty game.
+ * The key is the URL and the value is the `Audio` or `Image` object.
+ *
+ * If loading an asset, check that it is in this object first to avoid loading twice.
+ * @example
+ * ~~~
+ * var isLoaded = !!Crafty.assets["images/sprite.png"];
+ * ~~~
+ */
+ assets: {},
+
+ /**@
+ * #Crafty.loader
+ * @category Assets
+ * @sign public void Crafty.load(Array assets, Function onLoad[, Function onProgress, Function onError])
+ * @param assets - Array of assets to load (accepts sounds and images)
+ * @param onLoad - Callback when the assets are loaded
+ * @param onProgress - Callback when an asset is loaded. Contains information about assets loaded
+ * @param onError - Callback when an asset fails to load
+ * Preloader for all assets. Takes an array of URLs and
+ * adds them to the `Crafty.assets` object.
+ *
+ * The `onProgress` function will be passed on object with information about
+ * the progress including how many assets loaded, total of all the assets to
+ * load and a percentage of the progress.
+ *
+ * `onError` will be passed with the asset that couldn't load.
+ *
+ * @example
+ * ~~~
+ * Crafty.load(["images/sprite.png", "sounds/jump.mp3"],
+ * function() {
+ * //when loaded
+ * Crafty.scene("main"); //go to main scene
+ * },
+ *
+ * function(e) {
+ * //progress
+ * },
+ *
+ * function(e) {
+ * //uh oh, error loading
+ * }
+ * );
+ * ~~~
+ * @see Crafty.assets
+ */
+ load: function (data, oncomplete, onprogress, onerror) {
+
+ var i = 0, l = data.length, current, obj, total = l, j = 0, ext = "",event,canplay;
+
+ for (; i < l; ++i) {
+ current = data[i];
+ event = '';
+ ext = current.substr(current.lastIndexOf('.') + 1).toLowerCase();
+ if(this.assets[current]){
+ obj = this.assets[current];
+ }else{
+ obj =null;
+ }
+
+
+ if (Crafty.support.audio && (ext === "mp3" || ext === "wav" || ext === "ogg" || ext === "mp4")) {
+ event = 'loadedmetadata';
+ } else if (ext === "jpg" || ext === "jpeg" || ext === "gif" || ext === "png") {
+ event = 'load';
+ } else {
+ total--;
+ continue; //skip if not applicable
+ }
+
+ //Progress function
+ function pro(){
+
+ ++j;
+ //if progress callback, give information of assets loaded, total and percent
+ if (onprogress)
+ onprogress({
+ loaded: j,
+ total: total,
+ percent: (j / total * 100),
+ obj:this
+ });
+
+ if(j === total && oncomplete) oncomplete();
+ };
+ //Error function
+ function err(){
+ if (onerror)
+ onerror({
+ loaded: j,
+ total: total,
+ percent: (j / total * 100),
+ obj:this
+ });
+
+ j++;
+ if(j === total && oncomplete) oncomplete();
+ };
+
+ if (obj.attachEvent) { //IE
+
+ obj.attachEvent('on' + event, pro);
+ obj.attachEvent('onerror', err);
+ } else { //Everyone else
+ obj.addEventListener(event, pro, false);
+ obj.addEventListener('error', err, false);
+ }
+
+
+ }
+
+
+ },
+ /**@
+ * #Crafty.modules
+ * @category Assets
+ * @sign public void Crafty.modules([String repoLocation,] Object moduleMap[, Function onLoad])
+ * @param modules - Map of name:version pairs for modules to load
+ * @param onLoad - Callback when the modules are loaded
+ * Browse the selection of modules on crafty repositories.
+ * Downloads and executes the javascript in the specified modules.
+ * If no repository is specified it defaults to http://cdn.craftycomponents.com
+ *
+ * Available repositories:
+ *
+ * - http://cdn.crafty-modules.com
+ * - http://cdn.craftycomponents.com
+ *
+ *
+ * @example
+ * ~~~
+ * // Loading from default repository
+ * Crafty.modules({ moveto: 'DEV' }, function () {
+ * //module is ready
+ * Crafty.e("MoveTo, 2D, DOM");
+ * });
+ *
+ * // Loading from your own server
+ * Crafty.modules({ 'http://mydomain.com/js/mystuff.js': 'DEV' }, function () {
+ * //module is ready
+ * Crafty.e("MoveTo, 2D, DOM");
+ * });
+ *
+ * // Loading from alternative repository
+ * Crafty.modules('http://cdn.crafty-modules.com', { moveto: 'DEV' }, function () {
+ * //module is ready
+ * Crafty.e("MoveTo, 2D, DOM");
+ * });
+ *
+ * // Loading from the latest component website
+ * Crafty.modules(
+ * 'http://cdn.craftycomponents.com'
+ * , { MoveTo: 'release' }
+ * , function () {
+ * Crafty.e("2D, DOM, Color, MoveTo")
+ * .attr({x: 0, y: 0, w: 50, h: 50})
+ * .color("green");
+ * });
+ * });
+ * ~~~
+ *
+ */
+ modules: function (modulesRepository, moduleMap, oncomplete) {
+
+ if (arguments.length === 2 && typeof modulesRepository === "object") {
+ moduleMap = modulesRepository;
+ oncomplete = moduleMap;
+ modulesRepository = 'http://cdn.craftycomponents.com';
+ }
+
+ /*!
+ * $script.js Async loader & dependency manager
+ * https://github.com/ded/script.js
+ * (c) Dustin Diaz, Jacob Thornton 2011
+ * License: MIT
+ */
+ var $script = (function () {
+ var win = this, doc = document
+ , head = doc.getElementsByTagName('head')[0]
+ , validBase = /^https?:\/\//
+ , old = win.$script, list = {}, ids = {}, delay = {}, scriptpath
+ , scripts = {}, s = 'string', f = false
+ , push = 'push', domContentLoaded = 'DOMContentLoaded', readyState = 'readyState'
+ , addEventListener = 'addEventListener', onreadystatechange = 'onreadystatechange'
+
+ function every(ar, fn, i) {
+ for (i = 0, j = ar.length; i < j; ++i) if (!fn(ar[i])) return f
+ return 1
+ }
+ function each(ar, fn) {
+ every(ar, function (el) {
+ return !fn(el)
+ })
+ }
+
+ if (!doc[readyState] && doc[addEventListener]) {
+ doc[addEventListener](domContentLoaded, function fn() {
+ doc.removeEventListener(domContentLoaded, fn, f)
+ doc[readyState] = 'complete'
+ }, f)
+ doc[readyState] = 'loading'
+ }
+
+ function $script(paths, idOrDone, optDone) {
+ paths = paths[push] ? paths : [paths]
+ var idOrDoneIsDone = idOrDone && idOrDone.call
+ , done = idOrDoneIsDone ? idOrDone : optDone
+ , id = idOrDoneIsDone ? paths.join('') : idOrDone
+ , queue = paths.length
+ function loopFn(item) {
+ return item.call ? item() : list[item]
+ }
+ function callback() {
+ if (!--queue) {
+ list[id] = 1
+ done && done()
+ for (var dset in delay) {
+ every(dset.split('|'), loopFn) && !each(delay[dset], loopFn) && (delay[dset] = [])
+ }
+ }
+ }
+ setTimeout(function () {
+ each(paths, function (path) {
+ if (scripts[path]) {
+ id && (ids[id] = 1)
+ return scripts[path] == 2 && callback()
+ }
+ scripts[path] = 1
+ id && (ids[id] = 1)
+ create(!validBase.test(path) && scriptpath ? scriptpath + path + '.js' : path, callback)
+ })
+ }, 0)
+ return $script
+ }
+
+ function create(path, fn) {
+ var el = doc.createElement('script')
+ , loaded = f
+ el.onload = el.onerror = el[onreadystatechange] = function () {
+ if ((el[readyState] && !(/^c|loade/.test(el[readyState]))) || loaded) return;
+ el.onload = el[onreadystatechange] = null
+ loaded = 1
+ scripts[path] = 2
+ fn()
+ }
+ el.async = 1
+ el.src = path
+ head.insertBefore(el, head.firstChild)
+ }
+
+ $script.get = create
+
+ $script.order = function (scripts, id, done) {
+ (function callback(s) {
+ s = scripts.shift()
+ if (!scripts.length) $script(s, id, done)
+ else $script(s, callback)
+ }())
+ }
+
+ $script.path = function (p) {
+ scriptpath = p
+ }
+ $script.ready = function (deps, ready, req) {
+ deps = deps[push] ? deps : [deps]
+ var missing = [];
+ !each(deps, function (dep) {
+ list[dep] || missing[push](dep);
+ }) && every(deps, function (dep) {
+ return list[dep]
+ }) ?
+ ready() : !function (key) {
+ delay[key] = delay[key] || []
+ delay[key][push](ready)
+ req && req(missing)
+ }(deps.join('|'))
+ return $script
+ }
+
+ $script.noConflict = function () {
+ win.$script = old;
+ return this
+ }
+
+ return $script
+ })();
+
+ var modules = [];
+ for (var i in moduleMap) {
+ if (i.indexOf("http://") != -1)
+ modules.push(i)
+ else
+ modules.push(modulesRepository + '/' + i.toLowerCase() + '-' + moduleMap[i] + '.js');
+ }
+
+ $script(modules, function () {
+ if (oncomplete) oncomplete();
+ });
+ }
+});
46 assets/js/sounds.js
View
@@ -1,4 +1,4 @@
-Crafty.audio.add({
+/*Crafty.audio.add({
space: [
game_path + "media/music/through-space.mp3",
game_path + "media/music/through-space.ogg"
@@ -21,28 +21,64 @@ Crafty.audio.add({
game_path + "media/sounds/explode.mp3",
game_path + "media/sounds/explode.ogg"
]
- });
+});
Crafty.audio.add({
laser1: [
game_path + "media/sounds/laser1.mp3",
game_path + "media/sounds/laser1.ogg"
]
- });
+});
Crafty.audio.add({
laser2: [
game_path + "media/sounds/laser2.mp3",
game_path + "media/sounds/laser2.ogg"
]
- });
+});
Crafty.audio.add({
laser3: [
game_path + "media/sounds/laser3.mp3",
game_path + "media/sounds/laser3.ogg"
]
- });
+});
+Crafty.audio.add({
+ laser4: [
+ game_path + "media/sounds/laser4.mp3",
+ game_path + "media/sounds/laser4.ogg"
+ ]
+});
+*/
Crafty.audio.add({
+ space: [
+ game_path + "media/music/through-space.mp3",
+ game_path + "media/music/through-space.ogg"
+ ],
+ spaceship: [
+ game_path + "media/music/spaceship.mp3",
+ game_path + "media/music/spaceship.ogg"
+ ],
+ explosion0: [
+ game_path + "media/sounds/explodemini.mp3",
+ game_path + "media/sounds/explodemini.ogg"
+ ],
+ explosion1: [
+ game_path + "media/sounds/explode.mp3",
+ game_path + "media/sounds/explode.ogg"
+ ],
+ laser1: [
+ game_path + "media/sounds/laser1.mp3",
+ game_path + "media/sounds/laser1.ogg"
+ ],
+ laser2: [
+ game_path + "media/sounds/laser2.mp3",
+ game_path + "media/sounds/laser2.ogg"
+ ],
+ laser3: [
+ game_path + "media/sounds/laser3.mp3",
+ game_path + "media/sounds/laser3.ogg"
+ ],
laser4: [
game_path + "media/sounds/laser4.mp3",
game_path + "media/sounds/laser4.ogg"
]
});
+
6 assets/js/sprites.js
View
@@ -1,3 +1,9 @@
+Crafty.sprite(game_path + "assets/img/loading.jpg",{
+ loadingbg:[0,0]
+})
+Crafty.sprite(game_path + "assets/img/bg.png",{
+ spacebg1:[0,0]
+})
Crafty.sprite(game_path + "assets/img/ships.png",{
//Gold
ship1:[0,0,44,47],
5 index.html
View
@@ -8,12 +8,17 @@
<script>var game_path = location.href.lastIndexOf("/") !== -1 ? location.href.substring(0, location.href.lastIndexOf("/") + 1) : location.href;</script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
+ <script type="text/javascript" src="assets/js/loader.js"></script>
+ <script type="text/javascript" src="assets/js/audio.js"></script>
+
<script type="text/javascript" src="assets/js/sprites.js"></script>
<script type="text/javascript" src="assets/js/sounds.js"></script>
+
<script type="text/javascript" src="assets/js/weapons.js"></script>
<script type="text/javascript" src="assets/js/effects.js"></script>
<script type="text/javascript" src="assets/js/enemys.js"></script>
<script type="text/javascript" src="assets/js/player.js"></script>
+
<script type="text/javascript" src="assets/js/levels.js"></script>
<script type="text/javascript" src="assets/js/game.js"></script>
<link type="text/css" href="assets/css/style.css" rel="stylesheet" />
Please sign in to comment.
Something went wrong with that request. Please try again.