joepie91
/
radium
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Build process fixes, and significant overhaul of engine mechanics to facilitate preloading

Browse Source
feature/coffeescript
Sven Slootweg 10 years ago
parent 89507cf125
commit 709b1a9f19
8 changed files with 315 additions and 142 deletions
Show Stats Download Patch File Download Diff File

116
compiled/radium.js
Unescape Escape View File

@ -1322,12 +1322,16 @@ var ResourceManager,
ResourceManager = (function() {
function ResourceManager(base_path) {
this.base_path = base_path != null ? base_path : "";
this.preload = __bind(this.preload, this);
this.load = __bind(this.load, this);
this.prepare = __bind(this.prepare, this);
this.do_preload = __bind(this.do_preload, this);
this.updateProgress = __bind(this.updateProgress, this);
this.getImage = __bind(this.getImage, this);
this.addDataFiles = __bind(this.addDataFiles, this);
this.addSounds = __bind(this.addSounds, this);
this.addScripts = __bind(this.addScripts, this);
this.addImages = __bind(this.addImages, this);
this.addDataFile = __bind(this.addDataFile, this);
this.addScript = __bind(this.addScript, this);
this.addSound = __bind(this.addSound, this);
this.addImage = __bind(this.addImage, this);
@ -1388,6 +1392,17 @@ ResourceManager = (function() {
}
};
ResourceManager.prototype.addDataFile = function(path, first_stage) {
if (first_stage == null) {
first_stage = false;
}
if (first_stage) {
return this.resources.stage1_data.push(this.joinPath(path));
} else {
return this.resources.data.push(this.joinPath(path));
}
};
ResourceManager.prototype.addImages = function(paths, first_stage) {
var path, _i, _len, _results;
if (first_stage == null) {
@ -1427,37 +1442,62 @@ ResourceManager = (function() {
return _results;
};
ResourceManager.prototype.addDataFiles = function(paths, first_stage) {
var path, _i, _len, _results;
if (first_stage == null) {
first_stage = false;
}
_results = [];
for (_i = 0, _len = paths.length; _i < _len; _i++) {
path = paths[_i];
_results.push(this.addDataFile(path, first_stage));
}
return _results;
};
ResourceManager.prototype.getImage = function(path) {
console.log("objs", this.resource_objects);
console.log("path", path);
return this.resource_objects.images[this.joinPath(path)];
};
ResourceManager.prototype.prepare = function(finished_callback) {
if (finished_callback == null) {
finished_callback = (function() {});
}
ResourceManager.prototype.updateProgress = function(event) {
return pass;
};
ResourceManager.prototype.preload = function(progress_callback, finished_callback) {
var image, obj, _i, _len, _ref;
if (progress_callback == null) {
progress_callback = (function() {});
}
if (finished_callback == null) {
finished_callback = (function() {});
ResourceManager.prototype.do_preload = function(stage, progress_callback, finished_callback) {
var image, images, obj, scripts, sounds, _i, _len;
if (stage === 1) {
images = this.resources.stage1_images;
scripts = this.resources.stage1_scripts;
sounds = this.resources.stage1_sounds;
} else {
images = this.resources.images;
scripts = this.resources.scripts;
sounds = this.resources.sounds;
}
_ref = this.resources.images;
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
image = _ref[_i];
for (_i = 0, _len = images.length; _i < _len; _i++) {
image = images[_i];
obj = document.createElement("img");
obj.src = image;
this.resource_objects.images[image] = obj;
}
console.log("done stage " + stage);
return finished_callback();
};
ResourceManager.prototype.prepare = function(finished_callback) {
if (finished_callback == null) {
finished_callback = (function() {});
}
return this.do_preload(1, (function() {}), finished_callback);
};
ResourceManager.prototype.load = function() {
var _ref, _ref1;
return this.do_preload(2, this.updateProgress, (_ref = (_ref1 = this.onLoad) != null ? _ref1.bind(this) : void 0) != null ? _ref : (function() {}));
};
return ResourceManager;
})();
@ -1469,6 +1509,7 @@ Scene = (function() {
function Scene(engine, name) {
this.engine = engine;
this.name = name;
this.destroySelf = __bind(this.destroySelf, this);
this.changeScene = __bind(this.changeScene, this);
this.createInstance = __bind(this.createInstance, this);
this.checkMouseCollisions = __bind(this.checkMouseCollisions, this);
@ -1478,6 +1519,11 @@ Scene = (function() {
this.removeTargetSurface = __bind(this.removeTargetSurface, this);
this.handleClick = __bind(this.handleClick, this);
this.addTargetSurface = __bind(this.addTargetSurface, this);
this.reset = __bind(this.reset, this);
this.reset();
}
Scene.prototype.reset = function() {
this.instances = {};
this.surfaces = [];
this.dirty = true;
@ -1486,8 +1532,25 @@ Scene = (function() {
this.width = 800;
this.height = 600;
this.last_width = 800;
this.last_height = 600;
}
return this.last_height = 600;
};
Scene.prototype.callEvent = function(name, data) {
var event_map, _ref;
if (data == null) {
data = {};
}
event_map = {
load: this.onLoad
};
switch (name) {
case "destroy":
this.destroySelf();
return typeof this.onDestroy === "function" ? this.onDestroy(data) : void 0;
default:
return (_ref = event_map[name]) != null ? _ref.bind(this)(data) : void 0;
}
};
Scene.prototype.addTargetSurface = function(surface) {
this.surfaces.push(surface);
@ -1551,7 +1614,14 @@ Scene = (function() {
};
Scene.prototype.checkActive = function() {
return this.active = this.surfaces.length > 0;
var active_now;
active_now = this.surfaces.length > 0;
if (this.active && !active_now) {
this.callEvent("destroy");
} else if (!this.active && active_now) {
this.callEvent("load");
}
return this.active = active_now;
};
Scene.prototype.iteration = function() {
@ -1646,6 +1716,10 @@ Scene = (function() {
return pass;
};
Scene.prototype.destroySelf = function() {
return this.reset;
};
return Scene;
})();
@ -1794,11 +1868,7 @@ util = {
}
}
};
window.ResourceManager = ResourceManager;
window.Engine = Engine;
})();
; window.ResourceManager = ResourceManager; window.Engine = Engine; })();
/*!
* jQuery JavaScript Library v2.1.1
* http://jquery.com/

133
gemswap/core.coffee
Unescape Escape View File

@ -29,69 +29,90 @@ $(->
"sfx/swap.wav"
])
###
manager.prepare()
manager.preload(null, ->
manager.prepare ->
# Set up the engine
engine.addCanvas($("#gamecanvas"));
engine.setPreloadScene(engine.createScene("loader"))
engine.setInitialScene(engine.createScene("main"))
manager.onLoad = ->
# Game asset initialization...
engine.createSprite("cursor", "images/cursor.png")
scene = engine.createScene("main")
engine.createSprite("diamond", "images/diamond.png")
engine.createSprite("diamond_inverted", "images/diamond_inverted.png")
engine.createSprite("diamond_shimmer", "images/diamond_shimmer.png")
engine.createSprite("cursor", "images/cursor.png")
engine.createSprite("diamond", "images/diamond.png")
engine.createSprite("diamond_inverted", "images/diamond_inverted.png")
engine.createSprite("diamond_shimmer", "images/diamond_shimmer.png")
engine.createSprite("yellow", "images/yellow.png")
engine.createSprite("yellow_inverted", "images/yellow_inverted.png")
engine.createSprite("yellow_shimmer", "images/yellow_shimmer.png")
engine.createSprite("yellow", "images/yellow.png")
engine.createSprite("yellow_inverted", "images/yellow_inverted.png")
engine.createSprite("yellow_shimmer", "images/yellow_shimmer.png")
engine.createSprite("blue", "images/blue.png")
engine.createSprite("blue_inverted", "images/blue_inverted.png")
engine.createSprite("blue_shimmer", "images/blue_shimmer.png")
engine.createSprite("blue", "images/blue.png")
engine.createSprite("blue_inverted", "images/blue_inverted.png")
engine.createSprite("blue_shimmer", "images/blue_shimmer.png")
# Object definitions
cursor = engine.createObject("cursor")
cursor.sprite = engine.getSprite("cursor")
cursor.onStep = ->
$("#debug").html("Mouse coords: #{@scene.mouse_x} / #{@scene.mouse_y}<br>Frameskip: #{@engine.frameskip}")
diamond = engine.createObject("diamond")
diamond.sprite = engine.getSprite("diamond")
diamond.draw_sprite = false
diamond.onCreate = ->
@fade_value = 0.3
@shimmer_value = @engine.ease.circInOut(0, 0.8, engine.random.number(200, 350), null, true, true)
@gem_type = @engine.random.pick("diamond", "yellow", "blue")
cursor = engine.createObject("cursor")
cursor.sprite = engine.getSprite("cursor")
diamond = engine.createObject("diamond")
diamond.sprite = engine.getSprite("diamond")
diamond.draw_sprite = false
diamond.onCreate = ->
@fade_value = 0.3
@shimmer_value = @engine.ease.circInOut(0, 0.8, engine.random.number(200, 350), null, true, true)
@gem_type = @engine.random.pick("diamond", "yellow", "blue")
diamond.onStep = ->
return true
diamond.onDraw = ->
@engine.getSprite(@gem_type).draw(@x, @y)
diamond.onStep = ->
return true
diamond.onDraw = ->
@engine.getSprite(@gem_type).draw(@x, @y)
@engine.getSprite("#{@gem_type}_inverted").draw(@x, @y, {
alpha: @fade_value
})
@engine.getSprite("#{@gem_type}_shimmer").draw(@x - 14, @y - 14, {
alpha: @shimmer_value
})
diamond.onMouseOver = ->
@fade_value = @engine.ease.quadInOut(0.3, 0.7, 10, @engine.ease.bounceOut(0.7, 0.3, 65))
cursor = @engine.getObject("cursor").getInstances()[0]
cursor.x = @engine.ease.quadInOut(cursor.x, @x - 9, 8)
cursor.y = @engine.ease.quadInOut(cursor.y, @y - 9, 8)
@engine.getSprite("#{@gem_type}_inverted").draw(@x, @y, {
alpha: @fade_value
})
# Scene configuration
engine.getScene("loader").onLoad = ->
# Loading screen
loader = engine.createObject("loader")
loader.onStep = -> true
loader.onDraw = ->
engine.draw.rectangle(0, 0, 800 * manager.file_progress, 64, {fillColor: "#CCCCCC"})
engine.draw.rectangle(0, 64, 800 * manager.total_progress, 128, {fillColor: "#AAAAAA"})
@createInstance(loader, 0, 0)
engine.getScene("main").onLoad = ->
# Actual game initialization
@createInstance(cursor, 0, 0)
for x in [10 .. 728] by 80
for y in [10 .. 550] by 80
@createInstance(diamond, x, y)
@engine.getSprite("#{@gem_type}_shimmer").draw(@x - 14, @y - 14, {
alpha: @shimmer_value
})
# Let's go!
engine.start()
diamond.onMouseOver = ->
@fade_value = @engine.ease.quadInOut(0.3, 0.7, 10, @engine.ease.bounceOut(0.7, 0.3, 65))
manager.load()
cursor = @engine.getObject("cursor").getInstances()[0]
cursor.x = @engine.ease.quadInOut(cursor.x, @x - 9, 8)
cursor.y = @engine.ease.quadInOut(cursor.y, @y - 9, 8)
for x in [10 .. 728] by 80
for y in [10 .. 550] by 80
scene.createInstance(diamond, x, y)
cursor.onStep = ->
$("#debug").html("Mouse coords: #{@scene.mouse_x} / #{@scene.mouse_y}<br>Frameskip: #{@engine.frameskip}")
scene.createInstance(cursor, 0, 0)
engine.start()
)
)

133
gemswap/gemswap.js
Unescape Escape View File

@ -18,59 +18,88 @@
"sfx/swap.wav"
])
*/
manager.prepare();
return manager.preload(null, function() {
var cursor, diamond, scene, x, y, _i, _j;
return manager.prepare(function() {
engine.addCanvas($("#gamecanvas"));
scene = engine.createScene("main");
engine.createSprite("cursor", "images/cursor.png");
engine.createSprite("diamond", "images/diamond.png");
engine.createSprite("diamond_inverted", "images/diamond_inverted.png");
engine.createSprite("diamond_shimmer", "images/diamond_shimmer.png");
engine.createSprite("yellow", "images/yellow.png");
engine.createSprite("yellow_inverted", "images/yellow_inverted.png");
engine.createSprite("yellow_shimmer", "images/yellow_shimmer.png");
engine.createSprite("blue", "images/blue.png");
engine.createSprite("blue_inverted", "images/blue_inverted.png");
engine.createSprite("blue_shimmer", "images/blue_shimmer.png");
cursor = engine.createObject("cursor");
cursor.sprite = engine.getSprite("cursor");
diamond = engine.createObject("diamond");
diamond.sprite = engine.getSprite("diamond");
diamond.draw_sprite = false;
diamond.onCreate = function() {
this.fade_value = 0.3;
this.shimmer_value = this.engine.ease.circInOut(0, 0.8, engine.random.number(200, 350), null, true, true);
return this.gem_type = this.engine.random.pick("diamond", "yellow", "blue");
engine.setPreloadScene(engine.createScene("loader"));
engine.setInitialScene(engine.createScene("main"));
manager.onLoad = function() {
var cursor, diamond;
engine.createSprite("cursor", "images/cursor.png");
engine.createSprite("diamond", "images/diamond.png");
engine.createSprite("diamond_inverted", "images/diamond_inverted.png");
engine.createSprite("diamond_shimmer", "images/diamond_shimmer.png");
engine.createSprite("yellow", "images/yellow.png");
engine.createSprite("yellow_inverted", "images/yellow_inverted.png");
engine.createSprite("yellow_shimmer", "images/yellow_shimmer.png");
engine.createSprite("blue", "images/blue.png");
engine.createSprite("blue_inverted", "images/blue_inverted.png");
engine.createSprite("blue_shimmer", "images/blue_shimmer.png");
cursor = engine.createObject("cursor");
cursor.sprite = engine.getSprite("cursor");
cursor.onStep = function() {
return $("#debug").html("Mouse coords: " + this.scene.mouse_x + " / " + this.scene.mouse_y + "<br>Frameskip: " + this.engine.frameskip);
};
diamond = engine.createObject("diamond");
diamond.sprite = engine.getSprite("diamond");
diamond.draw_sprite = false;
diamond.onCreate = function() {
this.fade_value = 0.3;
this.shimmer_value = this.engine.ease.circInOut(0, 0.8, engine.random.number(200, 350), null, true, true);
return this.gem_type = this.engine.random.pick("diamond", "yellow", "blue");
};
diamond.onStep = function() {
return true;
};
diamond.onDraw = function() {
this.engine.getSprite(this.gem_type).draw(this.x, this.y);
this.engine.getSprite("" + this.gem_type + "_inverted").draw(this.x, this.y, {
alpha: this.fade_value
});
return this.engine.getSprite("" + this.gem_type + "_shimmer").draw(this.x - 14, this.y - 14, {
alpha: this.shimmer_value
});
};
diamond.onMouseOver = function() {
this.fade_value = this.engine.ease.quadInOut(0.3, 0.7, 10, this.engine.ease.bounceOut(0.7, 0.3, 65));
cursor = this.engine.getObject("cursor").getInstances()[0];
cursor.x = this.engine.ease.quadInOut(cursor.x, this.x - 9, 8);
return cursor.y = this.engine.ease.quadInOut(cursor.y, this.y - 9, 8);
};
engine.getScene("loader").onLoad = function() {
var loader;
loader = engine.createObject("loader");
loader.onStep = function() {
return true;
};
loader.onDraw = function() {
engine.draw.rectangle(0, 0, 800 * manager.file_progress, 64, {
fillColor: "#CCCCCC"
});
return engine.draw.rectangle(0, 64, 800 * manager.total_progress, 128, {
fillColor: "#AAAAAA"
});
};
return this.createInstance(loader, 0, 0);
};
engine.getScene("main").onLoad = function() {
var x, y, _i, _results;
this.createInstance(cursor, 0, 0);
_results = [];
for (x = _i = 10; _i <= 728; x = _i += 80) {
_results.push((function() {
var _j, _results1;
_results1 = [];
for (y = _j = 10; _j <= 550; y = _j += 80) {
_results1.push(this.createInstance(diamond, x, y));
}
return _results1;
}).call(this));
}
return _results;
};
return engine.start();
};
diamond.onStep = function() {
return true;
};
diamond.onDraw = function() {
this.engine.getSprite(this.gem_type).draw(this.x, this.y);
this.engine.getSprite("" + this.gem_type + "_inverted").draw(this.x, this.y, {
alpha: this.fade_value
});
return this.engine.getSprite("" + this.gem_type + "_shimmer").draw(this.x - 14, this.y - 14, {
alpha: this.shimmer_value
});
};
diamond.onMouseOver = function() {
this.fade_value = this.engine.ease.quadInOut(0.3, 0.7, 10, this.engine.ease.bounceOut(0.7, 0.3, 65));
cursor = this.engine.getObject("cursor").getInstances()[0];
cursor.x = this.engine.ease.quadInOut(cursor.x, this.x - 9, 8);
return cursor.y = this.engine.ease.quadInOut(cursor.y, this.y - 9, 8);
};
for (x = _i = 10; _i <= 728; x = _i += 80) {
for (y = _j = 10; _j <= 550; y = _j += 80) {
scene.createInstance(diamond, x, y);
}
}
cursor.onStep = function() {
return $("#debug").html("Mouse coords: " + this.scene.mouse_x + " / " + this.scene.mouse_y + "<br>Frameskip: " + this.engine.frameskip);
};
scene.createInstance(cursor, 0, 0);
return engine.start();
return manager.load();
});
});
})();
})();

5
gulpfile.js
Unescape Escape View File

@ -9,6 +9,7 @@ var cache = require('gulp-cached');
var remember = require('gulp-remember');
var header = require('gulp-header');
var footer = require('gulp-footer');
var plumber = require('gulp-plumber');
/* Engine build tasks */
engine = {
@ -23,12 +24,13 @@ engine = {
gulp.task('dev-engine', function() {
return gulp.src(engine.source)
.pipe(plumber())
.pipe(cache("engine-coffee"))
.pipe(coffee({bare: true}).on('error', gutil.log)).on('data', gutil.log)
.pipe(remember("engine-coffee"))
.pipe(concat("radium.coffee.js"))
.pipe(header('(function () {'))
.pipe(footer('})();'))
.pipe(footer('; window.ResourceManager = ResourceManager; window.Engine = Engine; })();'))
.pipe(addsrc(engine.external))
.pipe(concat("radium.concat.js"))
.pipe(rename(engine.target.name))
@ -55,6 +57,7 @@ gemswap = {
gulp.task('dev-gemswap', function() {
return gulp.src(gemswap.source)
.pipe(plumber())
.pipe(cache("gemswap-coffee"))
.pipe(coffee({bare: true}).on('error', gutil.log)).on('data', gutil.log)
.pipe(remember("gemswap-coffee"))

1
package.json
Unescape Escape View File

@ -14,6 +14,7 @@
"gulp-remember": "0.2.x",
"gulp-header": "1.0.x",
"gulp-footer": "1.0.x",
"gulp-plumber": "0.6.x",
"coffee-script": "1.7.x"
}
}

40
radium/resource-manager.coffee
Unescape Escape View File

@ -33,6 +33,12 @@ class ResourceManager
@resources.stage1_scripts.push(@joinPath(path))
else
@resources.scripts.push(@joinPath(path))
addDataFile: (path, first_stage = false) =>
if first_stage
@resources.stage1_data.push(@joinPath(path))
else
@resources.data.push(@joinPath(path))
addImages: (paths, first_stage = false) =>
@addImage(path, first_stage) for path in paths
@ -43,21 +49,41 @@ class ResourceManager
addSounds: (paths, first_stage = false) =>
@addSound(path, first_stage) for path in paths
addDataFiles: (paths, first_stage = false) =>
@addDataFile(path, first_stage) for path in paths
getImage: (path) =>
# FIXME: Do properly when PreloadJS is added
console.log("objs", @resource_objects)
console.log("path", path)
return @resource_objects.images[@joinPath(path)]
prepare: (finished_callback = (->)) =>
# This performs a stage 1 preload, loading the initial assets required for displaying the preload screen.
updateProgress: (event) =>
pass
preload: (progress_callback = (->), finished_callback = (->)) =>
# This performs the stage 2 preload; it will load the actual game assets.
for image in @resources.images
do_preload: (stage, progress_callback, finished_callback) =>
if stage == 1
images = @resources.stage1_images
scripts = @resources.stage1_scripts
sounds = @resources.stage1_sounds
else
images = @resources.images
scripts = @resources.scripts
sounds = @resources.sounds
for image in images
obj = document.createElement("img")
obj.src = image
@resource_objects.images[image] = obj
finished_callback()
console.log("done stage " + stage)
finished_callback()
prepare: (finished_callback = (->)) =>
# This performs a stage 1 preload, loading the initial assets required for displaying the preload screen.
@do_preload(1, (->), finished_callback)
load: () =>
# This performs the stage 2 preload; it will load the actual game assets.
@do_preload(2, @updateProgress, @onLoad?.bind(this) ? (->))

27
radium/scene.coffee
Unescape Escape View File

@ -1,5 +1,8 @@
class Scene
constructor: (@engine, @name) ->
@reset()
reset: =>
@instances = {}
@surfaces = []
@dirty = true # Triggers first draw
@ -10,6 +13,16 @@ class Scene
@last_width = 800
@last_height = 600
callEvent: (name, data = {}) ->
event_map =
load: @onLoad
switch name
when "destroy"
@destroySelf()
@onDestroy?(data)
else event_map[name]?.bind(this)(data)
addTargetSurface: (surface) =>
@surfaces.push(surface)
@engine.updateCanvasSize(surface, @width, @height)
@ -53,7 +66,16 @@ class Scene
@checkActive()
checkActive: =>
@active = (@surfaces.length > 0)
active_now = (@surfaces.length > 0)
if @active and not active_now
# Deactivated
@callEvent("destroy")
else if not @active and active_now
# Activated
@callEvent("load")
@active = active_now
iteration: =>
if @width != @last_width or @height != @last_height
@ -104,3 +126,6 @@ class Scene
changeScene: (scene) =>
# This will change to a different scene, but inherit the target surfaces
pass
destroySelf: =>
@reset

2
radium/zzz_exports.coffee
Unescape Escape View File

@ -1,2 +0,0 @@
window.ResourceManager = ResourceManager
window.Engine = Engine
Write Preview
Loading…
Cancel
Save