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

Initial commit for CoffeeScript rewrite

feature/coffeescript
Sven Slootweg 8 years ago
parent
7839380419
commit
05b6972f7d
26 changed files with 2674 additions and 0 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 7
      build-games.sh
  2. 894
      compiled/radium.js
  3. 14
      gemswap.html
  4. BIN
      gemswap/assets/images/diamond.png
  5. BIN
      gemswap/assets/images/diamond_inverted.png
  6. BIN
      gemswap/assets/images/diamond_shimmer.png
  7. 94
      gemswap/core.coffee
  8. 12
      gemswap/gemswap.css
  9. 85
      gemswap/gemswap.js
  10. 349
      gemswap/source/diamond.svg
  11. 416
      gemswap/source/diamond_inverted.svg
  12. 347
      gemswap/source/diamond_shimmer.svg
  13. 0
      radium/000_prepare.coffee
  14. 0
      radium/base.coffee
  15. 106
      radium/engine.coffee
  16. 113
      radium/engine.draw.coffee
  17. 13
      radium/engine.random.coffee
  18. 35
      radium/object.coffee
  19. 63
      radium/resource-manager.coffee
  20. 72
      radium/scene.coffee
  21. 1
      radium/sound.coffee
  22. 12
      radium/sprite.coffee
  23. 30
      radium/tileset.coffee
  24. 6
      radium/util.coffee
  25. 2
      radium/zzz_exports.coffee
  26. 3
      watch.sh

7
build-games.sh
View File

@ -0,0 +1,7 @@
for f in gemswap/source/*.svg
do
name=${f%%.*}
name=${name##*/}
echo "Processing $f..."
inkscape --export-png=gemswap/assets/images/$name.png $f
done

894
compiled/radium.js
View File

@ -0,0 +1,894 @@
// Generated by CoffeeScript 1.7.1
(function() {
var Engine, Object, ResourceManager, Scene, Sound, Sprite, Tileset, TilesetTile, util,
__bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
__slice = [].slice;
window.pass = void 0;
Engine = (function() {
function Engine(resource_manager) {
this.resource_manager = resource_manager;
this.getTileset = __bind(this.getTileset, this);
this.getSprite = __bind(this.getSprite, this);
this.getSound = __bind(this.getSound, this);
this.getObject = __bind(this.getObject, this);
this.getScene = __bind(this.getScene, this);
this.createTileset = __bind(this.createTileset, this);
this.createSprite = __bind(this.createSprite, this);
this.createSound = __bind(this.createSound, this);
this.createObject = __bind(this.createObject, this);
this.createScene = __bind(this.createScene, this);
this.setPreloadScene = __bind(this.setPreloadScene, this);
this.setInitialScene = __bind(this.setInitialScene, this);
this.iteration = __bind(this.iteration, this);
this.loop = __bind(this.loop, this);
this.start = __bind(this.start, this);
this.updateCanvasSize = __bind(this.updateCanvasSize, this);
this.getSurface = __bind(this.getSurface, this);
this.createSurface = __bind(this.createSurface, this);
this.addCanvas = __bind(this.addCanvas, this);
this.canvases = {};
this.fps = 45;
this.last_frameskip_collection = Math.floor(Date.now());
this.frameskip = 0;
this.current_frameskip = 0;
this.scenes = {};
this.objects = {};
this.sounds = {};
this.sprites = {};
this.tilesets = {};
}
Engine.prototype.addCanvas = function(canvas, label) {
if (label == null) {
label = "";
}
return this.canvases[label] = util.unpackElement(canvas);
};
Engine.prototype.createSurface = function(label) {
return this.canvases[label] = document.createElement("canvas");
};
Engine.prototype.getSurface = function(label) {
var _ref;
if (typeof label === "string") {
return (_ref = this.canvases[label]) != null ? _ref.getContext("2d") : void 0;
} else if (label.tagName === "CANVAS") {
return label.getContext("2d");
} else {
return label;
}
};
Engine.prototype.updateCanvasSize = function(canvas, w, h) {
canvas.width = w;
canvas.height = h;
canvas.style.width = "" + w + "px";
return canvas.style.height = "" + h + "px";
};
Engine.prototype.start = function() {
this.initial_scene.addTargetSurface(this.canvases[""]);
return this.loop();
};
Engine.prototype.loop = function() {
return this.iteration();
};
Engine.prototype.iteration = function() {
var belated_timeout, current_frame, frame_interval, name, next_frame, overtime, scene, _ref;
frame_interval = 1000 / this.fps;
current_frame = Date.now();
next_frame = current_frame + frame_interval;
if (Math.floor(current_frame) > this.last_frameskip_collection) {
this.frameskip = this.current_frameskip;
this.current_frameskip = 0;
this.last_frameskip_collection = Math.floor(current_frame);
}
_ref = this.scenes;
for (name in _ref) {
scene = _ref[name];
if (scene.active) {
scene.iteration();
}
}
if (Date.now() < next_frame) {
return setTimeout(this.iteration, next_frame - Date.now());
} else {
overtime = Date.now() - next_frame;
this.current_frameskip += Math.floor(overtime / frame_interval);
belated_timeout = overtime % frame_interval;
return setTimeout(this.iteration, belated_timeout);
}
};
Engine.prototype.setInitialScene = function(scene) {
return this.initial_scene = scene;
};
Engine.prototype.setPreloadScene = function(scene) {
return this.preload_scene = scene;
};
Engine.prototype.createScene = function(name) {
var scene;
scene = new Scene(this, name);
if (this.initial_scene == null) {
this.initial_scene = scene;
}
return this.scenes[name] = scene;
};
Engine.prototype.createObject = function(name) {
return this.objects[name] = new Object(this, name);
};
Engine.prototype.createSound = function(name, sound) {
return this.sounds[name] = new Sound(this, name, this.resource_manager.getSound(sound));
};
Engine.prototype.createSprite = function(name, image) {
console.log("gget", this.resource_manager.getImage(image));
return this.sprites[name] = new Sprite(this, name, this.resource_manager.getImage(image));
};
Engine.prototype.createTileset = function(name, image, tile_width, tile_height) {
return this.tilesets[name] = new Tileset(this, name, this.resource_manager.getImage(image), tile_width, tile_height);
};
Engine.prototype.getScene = function(name) {
if (typeof name === "string") {
return this.scenes[name];
} else {
return name;
}
};
Engine.prototype.getObject = function(name) {
if (typeof name === "string") {
return this.objects[name];
} else {
return name;
}
};
Engine.prototype.getSound = function(name) {
if (typeof name === "string") {
return this.sounds[name];
} else {
return name;
}
};
Engine.prototype.getSprite = function(name) {
if (typeof name === "string") {
return this.sprites[name];
} else {
return name;
}
};
Engine.prototype.getTileset = function(name) {
if (typeof name === "string") {
return this.tilesets[name];
} else {
return name;
}
};
return Engine;
})();
Engine.prototype.draw = {
_startPath: (function(_this) {
return function(surface, options) {
var _ref;
surface = _this.getSurface(surface);
if ((_ref = !options._is_text) != null ? _ref : false) {
surface.beginPath();
}
return surface;
};
})(this),
_finishPath: (function(_this) {
return function(surface, options) {
var _ref, _ref1, _ref10, _ref11, _ref12, _ref2, _ref3, _ref4, _ref5, _ref6, _ref7, _ref8, _ref9;
if ((_ref = options.stroke) != null ? _ref : true) {
surface.lineWidth = (_ref1 = (_ref2 = options.lineWidth) != null ? _ref2 : (_ref3 = options.pen) != null ? _ref3.lineWidth : void 0) != null ? _ref1 : 1;
surface.strokeStyle = (_ref4 = (_ref5 = options.lineColor) != null ? _ref5 : (_ref6 = options.pen) != null ? _ref6.lineColor : void 0) != null ? _ref4 : "black";
if ((_ref7 = options._is_text) != null ? _ref7 : false) {
surface.strokeText(options.text, options.x, options.y);
} else {
surface.stroke();
}
}
if ((_ref8 = options.fill) != null ? _ref8 : false) {
surface.fillStyle = (_ref9 = (_ref10 = options.fillColor) != null ? _ref10 : (_ref11 = options.pen) != null ? _ref11.fillColor : void 0) != null ? _ref9 : "white";
if ((_ref12 = options._is_text) != null ? _ref12 : false) {
return surface.fillText(options.text, options.x, options.y);
} else {
return surface.fill();
}
}
};
})(this),
_getTextWidth: (function(_this) {
return function(surface, text, options) {
var width;
_this._applyTextContext(surface, options);
width = surface.measureText(text).width;
surface.restore();
return width;
};
})(this),
_applyTextContext: (function(_this) {
return function(surface, options) {
var font_family, font_size, font_style, font_weight, scale, _ref, _ref1, _ref2, _ref3, _ref4, _ref5;
font_family = (_ref = options.font) != null ? _ref : "sans-serif";
font_size = (_ref1 = options.size) != null ? _ref1 : 16;
font_weight = (_ref2 = options.weight) != null ? _ref2 : "normal";
font_style = (_ref3 = options.style) != null ? _ref3 : "normal";
scale = (_ref4 = options.scale) != null ? _ref4 : 1;
surface.save();
surface.font = "" + font_weight + " " + font_style + " " + font_size + "px '" + font_family + "'";
surface.globalAlpha = (_ref5 = options.alpha) != null ? _ref5 : 1;
return surface.scale(scale, scale);
};
})(this),
line: (function(_this) {
return function(x1, y1, x2, y2, options, surface) {
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
surface = _this._startPath(surface, options);
surface.moveTo(x1, y1);
surface.lineTo(x2, y2);
return _this._finishPath(surface, options);
};
})(this),
rectangle: (function(_this) {
return function(x1, y1, x2, y2, options, surface) {
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
surface = _this._startPath(surface, options);
surface.rect(x1, y1, x2 - x1, y2 - y1);
return _this._finishPath(surface, options);
};
})(this),
boxEllipse: (function(_this) {
return function(x1, y1, x2, y2, options, surface) {
var rx, ry, x, y;
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
x = (x1 + x2) / 2;
y = (y1 + y2) / 2;
rx = (x2 - x1) / 2;
ry = (y2 - y1) / 2;
return _this.radiusEllipse(x, y, rx, ry, options, surface);
};
})(this),
radiusEllipse: (function(_this) {
return function(x, y, rx, ry, options, surface) {
var i, step, _i, _ref, _ref1;
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
surface = _this._startPath(surface, options);
step = (_ref = options.step) != null ? _ref : 0.1;
if (rx === ry) {
surface.arc(x, y, rx, 0, 2 * Math.PI, false);
} else {
surface.moveTo(x + rx, y);
for (i = _i = 0, _ref1 = Math.PI * 2 + step; 0 <= _ref1 ? _i <= _ref1 : _i >= _ref1; i = 0 <= _ref1 ? ++_i : --_i) {
surface.lineTo(x + (Math.cos(i) * rx), y + (Math.sin(i) * ry));
}
}
return _this._finishPath(surface, options);
};
})(this),
boxPolygon: (function(_this) {
return function(x1, y1, x2, y2, sides, options, surface) {
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
return pass;
};
})(this),
radiusPolygon: (function(_this) {
return function(x, y, r, sides, options, surface) {
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
return pass;
};
})(this),
text: (function(_this) {
return function(x, y, text, options, surface) {
var text_width;
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
if (options.alignment == null) {
options.alignment = "left";
}
if (options.scale == null) {
options.scale = 1;
}
options._is_text = true;
options.text = text;
options.y = y;
if (options.fill == null) {
options.fill = true;
}
if (options.fillColor == null) {
options.fillColor = "black";
}
if (options.stroke == null) {
options.stroke = false;
}
if (alignment === "left") {
options.x = x;
} else {
text_width = _this._getTextWidth(text, options);
if (alignment === "center") {
options.x = x - ((text_width / 2) * scale * scale);
} else if (alignment === "right") {
options.x = x - text_width;
}
}
_this._startPath(surface, options);
_this._finishPath(surface, options);
return surface.restore();
};
})(this)
};
Engine.prototype.random = {
number: (function(_this) {
return function(min, max, precision) {
var base_number, rounding_factor, space;
base_number = Math.random();
space = Math.abs(ceiling - floor);
rounding_factor = 1 / (precision != null ? precision : 0.00000001);
return Math.floor((min + (base_number * space)) * rounding_factor) / rounding_factor;
};
})(this),
pick: (function(_this) {
return function() {
var options;
options = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
return options[Math.floor(Math.random() * options.length)];
};
})(this),
string: (function(_this) {
return function(length, alphabet) {
var i;
if (alphabet == null) {
alphabet = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";
}
return ((function() {
var _i, _ref, _results;
_results = [];
for (i = _i = 0, _ref = length - 1; 0 <= _ref ? _i <= _ref : _i >= _ref; i = 0 <= _ref ? ++_i : --_i) {
_results.push(alphabet[Math.floor(Math.random() * alphabet.length)]);
}
return _results;
})()).join("");
};
})(this)
};
Object = (function() {
function Object(engine, name) {
this.engine = engine;
this.name = name;
this.checkPointCollision = __bind(this.checkPointCollision, this);
this.getBoundingBox = __bind(this.getBoundingBox, this);
this.drawSprite = __bind(this.drawSprite, this);
this.drawSelf = __bind(this.drawSelf, this);
this.callEvent = __bind(this.callEvent, this);
this.sprite = null;
this.x = 0;
this.y = 0;
}
Object.prototype.callEvent = function(name, data) {
var _ref;
if (data == null) {
data = {};
}
switch (name) {
case "create":
return typeof this.onCreate === "function" ? this.onCreate(data) : void 0;
case "step":
return typeof this.onStep === "function" ? this.onStep(data) : void 0;
case "draw":
this.drawSelf((_ref = data.surface) != null ? _ref : "");
return typeof this.onDraw === "function" ? this.onDraw(data) : void 0;
}
};
Object.prototype.drawSelf = function(surface) {
return this.drawSprite(surface);
};
Object.prototype.drawSprite = function(surface) {
var _ref;
if (surface == null) {
surface = "";
}
if ((this.sprite != null) && ((_ref = this.draw_sprite) != null ? _ref : "true")) {
return this.sprite.draw(this.x, this.y, {}, surface);
}
};
Object.prototype.getBoundingBox = function() {
var image_size, _ref;
image_size = (_ref = this.sprite) != null ? _ref.getSize() : void 0;
return {
x1: this.x,
x2: this.x + (image_size != null ? image_size.width : void 0),
y1: this.y,
y2: this.y + (image_size != null ? image_size.height : void 0)
};
};
Object.prototype.checkPointCollision = function(x, y) {
var bounding_box;
bounding_box = this.getBoundingBox();
return x >= (bounding_box != null ? bounding_box.x1 : void 0) && x <= (bounding_box != null ? bounding_box.x2 : void 0) && y >= (bounding_box != null ? bounding_box.y1 : void 0) && y <= (bounding_box != null ? bounding_box.y2 : void 0);
};
return Object;
})();
ResourceManager = (function() {
function ResourceManager(base_path) {
this.base_path = base_path != null ? base_path : "";
this.preload = __bind(this.preload, this);
this.prepare = __bind(this.prepare, this);
this.getImage = __bind(this.getImage, this);
this.addSounds = __bind(this.addSounds, this);
this.addScripts = __bind(this.addScripts, this);
this.addImages = __bind(this.addImages, this);
this.addScript = __bind(this.addScript, this);
this.addSound = __bind(this.addSound, this);
this.addImage = __bind(this.addImage, this);
this.joinPath = __bind(this.joinPath, this);
this.resources = {
stage1_images: [],
stage1_audio: [],
stage1_scripts: [],
images: [],
audio: [],
scripts: []
};
this.resource_objects = {
images: {},
audio: {},
scripts: {}
};
}
ResourceManager.prototype.joinPath = function(path) {
if (this.base_path === "") {
return path;
} else {
return util.stripRight(this.base_path, "/") + "/" + path;
}
};
ResourceManager.prototype.addImage = function(path, first_stage) {
if (first_stage == null) {
first_stage = false;
}
if (first_stage) {
return this.resources.stage1_images.push(this.joinPath(path));
} else {
return this.resources.images.push(this.joinPath(path));
}
};
ResourceManager.prototype.addSound = function(path, first_stage) {
if (first_stage == null) {
first_stage = false;
}
if (first_stage) {
return this.resources.stage1_audio.push(this.joinPath(path));
} else {
return this.resources.audio.push(this.joinPath(path));
}
};
ResourceManager.prototype.addScript = function(path, first_stage) {
if (first_stage == null) {
first_stage = false;
}
if (first_stage) {
return this.resources.stage1_scripts.push(this.joinPath(path));
} else {
return this.resources.scripts.push(this.joinPath(path));
}
};
ResourceManager.prototype.addImages = 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.addImage(path, first_stage));
}
return _results;
};
ResourceManager.prototype.addScripts = 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.addScript(path, first_stage));
}
return _results;
};
ResourceManager.prototype.addSounds = 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.addSound(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() {});
}
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() {});
}
_ref = this.resources.images;
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
image = _ref[_i];
obj = document.createElement("img");
obj.src = image;
this.resource_objects.images[image] = obj;
}
return finished_callback();
};
return ResourceManager;
})();
Scene = (function() {
function Scene(engine, name) {
this.engine = engine;
this.name = name;
this.changeScene = __bind(this.changeScene, this);
this.createInstance = __bind(this.createInstance, this);
this.checkMouseCollisions = __bind(this.checkMouseCollisions, this);
this.redraw = __bind(this.redraw, this);
this.iteration = __bind(this.iteration, this);
this.checkActive = __bind(this.checkActive, this);
this.removeTargetSurface = __bind(this.removeTargetSurface, this);
this.addTargetSurface = __bind(this.addTargetSurface, this);
this.instances = {};
this.surfaces = [];
this.dirty = true;
this.last_instance_id = 100;
this.active = false;
this.width = 800;
this.height = 600;
this.last_width = 800;
this.last_height;
}
Scene.prototype.addTargetSurface = function(surface) {
this.surfaces.push(surface);
this.engine.updateCanvasSize(surface, this.width, this.height);
$(surface).on("mousemove.radium", (function(_this) {
return function(event) {
var canvas_pos;
canvas_pos = surface.getBoundingClientRect();
_this.mouse_x = Math.floor(event.clientX - canvas_pos.left);
_this.mouse_y = Math.floor(event.clientY - canvas_pos.top);
$("#debug").html("" + _this.mouse_x + " / " + _this.mouse_y);
return _this.checkMouseCollisions();
};
})(this));
return this.checkActive();
};
Scene.prototype.removeTargetSurface = function(surface) {
this.surfaces = this.surfaces.filter(function(obj) {
return obj !== surface;
});
$(surface).off("mousemove.radium");
return this.checkActive();
};
Scene.prototype.checkActive = function() {
return this.active = this.surfaces.length > 0;
};
Scene.prototype.iteration = function() {
var id, instance, surface, _i, _len, _ref, _ref1, _ref2;
if (this.width !== this.last_width || this.height !== this.last_height) {
_ref = this.surfaces;
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
surface = _ref[_i];
this.engine.updateCanvasSize(surface, this.width, this.height);
}
_ref1 = [this.width, this.height], this.last_width = _ref1[0], this.last_height = _ref1[1];
}
_ref2 = this.instances;
for (id in _ref2) {
instance = _ref2[id];
if (instance.callEvent("step")) {
this.dirty = true;
}
}
if (this.dirty) {
this.redraw();
return this.dirty = false;
}
};
Scene.prototype.redraw = function() {
var ctx, id, instance, surface, _i, _len, _ref, _results;
_ref = this.surfaces;
_results = [];
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
surface = _ref[_i];
ctx = this.engine.getSurface(surface);
ctx.clearRect(0, 0, surface.width, surface.height);
_results.push((function() {
var _ref1, _results1;
_ref1 = this.instances;
_results1 = [];
for (id in _ref1) {
instance = _ref1[id];
_results1.push(instance.callEvent("draw", {
surface: surface
}));
}
return _results1;
}).call(this));
}
return _results;
};
Scene.prototype.checkMouseCollisions = function() {
var id, instance, _ref, _results;
_ref = this.instances;
_results = [];
for (id in _ref) {
instance = _ref[id];
if (instance.checkPointCollision(this.mouseX, this.mouseY)) {
_results.push(instance.callEvent("mouseover"));
} else {
_results.push(void 0);
}
}
return _results;
};
Scene.prototype.createInstance = function(object, x, y) {
var id, instance;
if (x == null) {
x = 0;
}
if (y == null) {
y = 0;
}
id = this.last_instance_id += 1;
instance = window.Object.create(this.engine.getObject(object));
instance.x = x;
instance.y = y;
instance.id = id;
instance.scene = this;
this.instances[id] = instance;
instance.callEvent("create");
return instance;
};
Scene.prototype.changeScene = function(scene) {
return pass;
};
return Scene;
})();
Sound = (function() {
function Sound() {}
return Sound;
})();
Sprite = (function() {
function Sprite(engine, name, image) {
this.engine = engine;
this.name = name;
this.image = image;
this.getSize = __bind(this.getSize, this);
this.draw = __bind(this.draw, this);
pass;
}
Sprite.prototype.draw = function(x, y, options, surface) {
var _ref;
if (options == null) {
options = {};
}
if (surface == null) {
surface = "";
}
surface = this.engine.getSurface(surface);
surface.globalAlpha = (_ref = options.alpha) != null ? _ref : 1;
return surface.drawImage(this.image, x, y);
};
Sprite.prototype.getSize = function() {
return {
width: this.image.width,
height: this.image.height
};
};
return Sprite;
})();
Tileset = (function() {
function Tileset(engine, name, image, tile_width, tile_height) {
this.engine = engine;
this.name = name;
this.image = image;
this.tile_width = tile_width;
this.tile_height = tile_height;
this.tile = __bind(this.tile, this);
this.tiles = {};
}
Tileset.prototype.tile = function(x, y, precise, w, h) {
var key, _ref;
if (precise == null) {
precise = false;
}
if (w == null) {
w = 0;
}
if (h == null) {
h = 0;
}
key = ("" + x + "/" + y + "/" + w + "/" + h + "/") + (precise ? 1 : 0);
return (_ref = this.tiles[key]) != null ? _ref : tiles[key] = new TilesetTile(this.engine, this, x, y, precise, w, h);
};
return Tileset;
})();
TilesetTile = (function() {
function TilesetTile(engine, tileset, x, y, precise, w, h) {
this.engine = engine;
this.tileset = tileset;
this.x = x;
this.y = y;
this.precise = precise != null ? precise : false;
this.w = w != null ? w : 0;
this.h = h != null ? h : 0;
this.getSize = __bind(this.getSize, this);
this.draw = __bind(this.draw, this);
pass;
}
TilesetTile.prototype.draw = function(x, y) {
var source_h, source_w, source_x, source_y, surface;
if (this.precise) {
source_x = this.x;
source_y = this.y;
source_w = this.w;
source_h = this.h;
} else {
source_x = this.x * this.tileset.tile_width;
source_y = this.y * this.tileset.tile_height;
source_w = this.tileset.tile_width;
source_h = this.tileset.tile_height;
}
surface = this.engine.getSurface();
return surface.drawImage(source_x, source_y, source_width, source_height, x, y);
};
TilesetTile.prototype.getSize = function() {
if (this.precise) {
return {
width: this.w,
height: this.h
};
} else {
return {
width: this.tileset.tile_width,
height: this.tileset.tile_height
};
}
};
return TilesetTile;
})();
util = {
stripRight: function(string, character) {
return string.replace(new RegExp(character + "*$", "g"), "");
},
unpackElement: function(element) {
console.log(element);
if (element instanceof jQuery) {
return element[0];
} else {
return element;
}
}
};
window.ResourceManager = ResourceManager;
window.Engine = Engine;
}).call(this);

14
gemswap.html
View File

@ -0,0 +1,14 @@
<!doctype html>
<html>
<head>
<title>Gemswap</title>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="compiled/radium.js"></script>
<script src="gemswap/gemswap.js"></script>
<link rel="stylesheet" href="gemswap/gemswap.css">
</head>
<body>
<canvas id="gamecanvas"></canvas>
<div id="debug"></div>
</body>
</html>

BIN
gemswap/assets/images/diamond.png
View File

Side by Side

After

Width: 64  |  Height: 64  |  Size: 3.8 KiB

BIN
gemswap/assets/images/diamond_inverted.png
View File

Side by Side

After

Width: 64  |  Height: 64  |  Size: 3.8 KiB

BIN
gemswap/assets/images/diamond_shimmer.png
View File

Side by Side

After

Width: 93  |  Height: 93  |  Size: 5.3 KiB

94
gemswap/core.coffee
View File

@ -0,0 +1,94 @@
$(->
manager = new ResourceManager("gemswap/assets")
engine = new Engine(manager)
###
# Configure pre-loading assets
manager.addImages([
"images/loading_screen.png"
], true)
###
# Configure game assets
manager.addImages([
"images/diamond.png"
"images/diamond_inverted.png"
"images/diamond_shimmer.png"
])
###
manager.addSounds([
"sfx/match.wav"
"sfx/swap.wav"
])
###
manager.prepare()
manager.preload(null, ->
engine.addCanvas($("#gamecanvas"));
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")
diamond = engine.createObject("diamond")
diamond.sprite = engine.getSprite("diamond")
diamond.onCreate = ->
@fade_step = 0.045
@fade_current_step = @fade_step
@fade_value = 0
@fade_decay_current = 9999 # Disable by default
@fade_decay_max = 8
@shimmer_step = 0.006
@shimmer_current_step = @shimmer_step
@shimmer_value = 0
diamond.onStep = ->
if @fade_decay_current < Math.pow(2, @fade_decay_max)
@fade_value += @fade_current_step
max = 1.5 / @fade_decay_current
if @fade_value > Math.min(max, 1)
@fade_value = Math.min(max, 1)
@fade_current_step = -@fade_step
if @fade_value <= 0
@fade_value = 0
@fade_decay_current *= 1.5
@fade_current_step = @fade_step
@shimmer_value += @shimmer_current_step
if @shimmer_value > 0.7
@shimmer_value = 0.7
@shimmer_current_step = -@shimmer_step
if @shimmer_value < 0
@shimmer_value = 0
@shimmer_current_step = @shimmer_step
return true
diamond.onDraw = ->
@engine.getSprite("diamond_inverted").draw(@x, @y, {
alpha: @fade_value
})
@engine.getSprite("diamond_shimmer").draw(@x - 14, @y - 14, {
alpha: @shimmer_value
})
diamond.onMouseOver = ->
console.log("mouseover")
@fade_decay_current = 1
scene.createInstance(diamond, 20, 20)
engine.start()
)
)

12
gemswap/gemswap.css
View File

@ -0,0 +1,12 @@
body
{
text-align: center;
background-color: #000000;
color: white;
}
#gamecanvas
{
width: 800px;
height: 600px;
}

85
gemswap/gemswap.js
View File

@ -0,0 +1,85 @@
// Generated by CoffeeScript 1.7.1
(function() {
$(function() {
var engine, manager;
manager = new ResourceManager("gemswap/assets");
engine = new Engine(manager);
/*
* Configure pre-loading assets
manager.addImages([
"images/loading_screen.png"
], true)
*/
manager.addImages(["images/diamond.png", "images/diamond_inverted.png", "images/diamond_shimmer.png"]);
/*
manager.addSounds([
"sfx/match.wav"
"sfx/swap.wav"
])
*/
manager.prepare();
return manager.preload(null, function() {
var diamond, scene;
engine.addCanvas($("#gamecanvas"));
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");
diamond = engine.createObject("diamond");
diamond.sprite = engine.getSprite("diamond");
diamond.onCreate = function() {
this.fade_step = 0.045;
this.fade_current_step = this.fade_step;
this.fade_value = 0;
this.fade_decay_current = 9999;
this.fade_decay_max = 8;
this.shimmer_step = 0.006;
this.shimmer_current_step = this.shimmer_step;
return this.shimmer_value = 0;
};
diamond.onStep = function() {
var max;
if (this.fade_decay_current < Math.pow(2, this.fade_decay_max)) {
this.fade_value += this.fade_current_step;
max = 1.5 / this.fade_decay_current;
if (this.fade_value > Math.min(max, 1)) {
this.fade_value = Math.min(max, 1);
this.fade_current_step = -this.fade_step;
}
if (this.fade_value <= 0) {
this.fade_value = 0;
this.fade_decay_current *= 1.5;
this.fade_current_step = this.fade_step;
}
}
this.shimmer_value += this.shimmer_current_step;
if (this.shimmer_value > 0.7) {
this.shimmer_value = 0.7;
this.shimmer_current_step = -this.shimmer_step;
}
if (this.shimmer_value < 0) {
this.shimmer_value = 0;
this.shimmer_current_step = this.shimmer_step;
}
return true;
};
diamond.onDraw = function() {
this.engine.getSprite("diamond_inverted").draw(this.x, this.y, {
alpha: this.fade_value
});
return this.engine.getSprite("diamond_shimmer").draw(this.x - 14, this.y - 14, {
alpha: this.shimmer_value
});
};
diamond.onMouseOver = function() {
console.log("mouseover");
return this.fade_decay_current = 1;
};
scene.createInstance(diamond, 20, 20);
return engine.start();
});
});
}).call(this);

349
gemswap/source/diamond.svg
View File

@ -0,0 +1,349 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="64"
height="64"
id="svg2"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="diamond.svg">
<defs
id="defs4">
<linearGradient
id="linearGradient3965">
<stop
id="stop3967"
offset="0"
style="stop-color:#6e6e6e;stop-opacity:1;" />
<stop
id="stop3969"
offset="1"
style="stop-color:#dfdfdf;stop-opacity:1;" />
</linearGradient>
<linearGradient
id="linearGradient3912">
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="0"
id="stop3914" />
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="1"
id="stop3916" />
</linearGradient>
<linearGradient
id="linearGradient3900">
<stop
style="stop-color:#b0b0b0;stop-opacity:1;"
offset="0"
id="stop3902" />
<stop
style="stop-color:#d5d5d5;stop-opacity:1;"
offset="1"
id="stop3904" />
</linearGradient>
<linearGradient
id="linearGradient3892">
<stop
style="stop-color:#c6c6c6;stop-opacity:1;"
offset="0"
id="stop3894" />
<stop
style="stop-color:#e3e3e3;stop-opacity:1;"
offset="1"
id="stop3896" />
</linearGradient>
<linearGradient
id="linearGradient3884">
<stop
style="stop-color:#d5d5d5;stop-opacity:1;"
offset="0"
id="stop3886" />
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="1"
id="stop3888" />
</linearGradient>
<linearGradient
id="linearGradient3876">
<stop
style="stop-color:#888888;stop-opacity:1;"
offset="0"
id="stop3878" />
<stop
style="stop-color:#d0d0d0;stop-opacity:1;"
offset="1"
id="stop3880" />
</linearGradient>
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3876"
id="linearGradient3882"
x1="7.8346815"
y1="14.376256"
x2="33.076497"
y2="14.376256"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3884"
id="linearGradient3890"
x1="6.423687"
y1="14.376256"
x2="34.487492"
y2="14.376256"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3892"
id="linearGradient3898"
x1="6.5624604"
y1="14.376256"
x2="34.348718"
y2="14.376256"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3918"
x1="43.6875"
y1="8.953125"
x2="66.375"
y2="8.953125"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3926"
x1="60.4375"
y1="32.078125"
x2="69.1875"
y2="32.078125"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3934"
x1="43.78125"
y1="55.109375"
x2="66.3125"
y2="55.109375"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3936"
x1="17.6875"
y1="64.828125"
x2="46.28125"
y2="64.828125"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3938"
x1="-2.3125"
y1="55.109375"
x2="20.1875"
y2="55.109375"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3965"
id="linearGradient3940"
x1="-5.1875"
y1="32.015625"
x2="3.5625"
y2="32.015625"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3942"
x1="-2.34375"
y1="8.921875"
x2="20.25"
y2="8.921875"
gradientUnits="userSpaceOnUse" />
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3912"
id="linearGradient3944"
x1="17.75"
y1="-0.828125"
x2="46.1875"
y2="-0.828125"
gradientUnits="userSpaceOnUse" />
</defs>
<sodipodi:namedview
id="base"
pagecolor="#000000"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="8"
inkscape:cx="24.807647"
inkscape:cy="29.688085"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="false"
inkscape:snap-global="false"
inkscape:window-width="1920"
inkscape:window-height="1102"
inkscape:window-x="0"
inkscape:window-y="28"
inkscape:window-maximized="1">
<inkscape:grid
type="axonomgrid"
id="grid2985"
units="mm"
empspacing="5"
visible="true"
enabled="true"
snapvisiblegridlinesonly="true"
originx="1.5mm"
gridanglez="30"
spacingy="1mm" />
</sodipodi:namedview>
<metadata
id="metadata7">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-988.36218)">
<g
id="g3847"
transform="matrix(0.85711544,0,0,0.85711544,4.5723061,145.794)"
style="fill:none">
<path
id="path3845"
d="M 56.587204,42.417389 66.25,46.34375 C 68.104505,41.926547 69.125,37.090921 69.125,32 c 0,-5.031989 -0.998476,-9.811516 -2.8125,-14.1875 l -9.538024,4.136393 6.079553,10.066627 -6.171771,10.244967 z"
style="fill:url(#linearGradient3926);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
transform="translate(0,988.36218)"
sodipodi:nodetypes="ccsccccc" />
<path
transform="translate(0,988.36218)"
id="path3841"
d="M 42.011366,56.683388 46.21875,66.28125 C 55.228514,62.535229 62.473949,55.33784 66.25,46.34375 l -9.655529,-3.939171 -2.784079,11.383864 z"
style="fill:url(#linearGradient3934);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccc" />
<path
transform="translate(0,988.36218)"
id="path3837"
d="M -2.28125,17.71875 7.3975812,21.617517 10.233506,10.211557 22.053146,7.2878373 17.8125,-2.28125 c -9.0435732,3.7515633 -16.3211942,10.9673576 -20.09375,20 z"
style="fill:url(#linearGradient3942);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccc" />
<path
transform="translate(0,988.36218)"
id="path3835"
d="M -2.25,46.3125 7.3526661,42.057344 7.2439397,41.968803 1.211504,31.978051 7.3808589,21.665733 7.4839819,21.629013 -2.28125,17.71875 C -4.1190691,22.119046 -5.125,26.9333 -5.125,32 c 0,5.080433 1.0277284,9.902612 2.875,14.3125 z"
style="fill:url(#linearGradient3940);fill-opacity:1.0;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccsc" />
<path
transform="translate(0,988.36218)"
id="path3833"
d="M 21.656492,56.575074 10.211557,53.766494 7.2697938,42.027956 -2.25,46.3125 c 3.7690881,8.997733 10.9938676,16.215755 20,19.96875 z"
style="fill:url(#linearGradient3938);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccc" />
<path
transform="translate(0,988.36218)"
id="path3831"
d="M 21.598084,56.58047 17.75,66.28125 c 4.39296,1.830615 9.193789,2.84375 14.25,2.84375 5.045723,0 9.833135,-1.020328 14.21875,-2.84375 l -4.245957,-9.685078 -0.16355,0.09021 L 32,62.810445 21.829209,56.607815 z"
style="fill:url(#linearGradient3936);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="ccscccccc" />
<path
transform="translate(0,988.36218)"
id="path3813"
d="M 46.125,-2.3125 C 41.763756,-4.1122099 37.011013,-5.125 32,-5.125 c -5.035235,0 -9.809238,1.0275071 -14.1875,2.84375 L 21.957912,7.2456166 32,1.211504 42.421916,7.3735829 z"
style="fill:url(#linearGradient3944);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="csccccc" />
<path
transform="translate(0,988.36218)"
id="path3790"
d="m 46.125,-2.3125 -3.721314,9.7250576 0.25847,0.053385 11.104338,2.7456144 2.918233,11.698922 0.04948,0.05859 L 66.3125,17.8125 C 62.541859,8.7165519 55.228257,1.4440479 46.125,-2.3125 z"
style="fill:url(#linearGradient3918);fill-opacity:1;stroke:none"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccccccc" />
</g>
<g
id="g3798"
transform="matrix(0.71188475,0,0,0.71188475,10.469688,294.51761)">
<path
transform="matrix(3.1896315,0,0,3.1896315,-35.001692,973.7547)"
d="m 20.537579,1.8360243 3.844595,3.2331978 4.998673,0.4977264 0.432323,5.0047555 3.182651,3.886542 -3.233198,3.844594 -0.497726,4.998674 -5.004755,0.432323 -3.886542,3.182651 -3.844595,-3.233198 -4.998674,-0.497727 -0.432323,-5.004755 -3.1826504,-3.886542 3.2331974,-3.844594 0.497727,-4.9986742 5.004755,-0.432323 z"
inkscape:randomized="0"
inkscape:rounded="0"
inkscape:flatsided="false"
sodipodi:arg2="-1.1715592"
sodipodi:arg1="-1.5642583"
sodipodi:r2="10.101433"
sodipodi:r1="12.5405"
sodipodi:cy="14.376256"
sodipodi:cx="20.455589"
sodipodi:sides="8"
id="path3796"
style="fill:url(#linearGradient3890);fill-opacity:1;stroke:none"
sodipodi:type="star" />
<path
transform="matrix(2.4959218,0,0,2.4959218,-20.811454,983.72765)"
d="m 20.515484,6.8463457 4.969153,-4.3608663 0.337755,6.6086777 6.59732,0.4301236 -4.434212,4.9118693 4.360866,4.969153 -6.608678,0.337755 -0.430123,6.59732 -4.91187,-4.434212 -4.969153,4.360867 -0.337755,-6.608678 -6.59732,-0.430124 4.434212,-4.911869 L 8.5648127,9.3472086 15.17349,9.0094536 15.603614,2.4121337 z"
inkscape:randomized="0"
inkscape:rounded="0"
inkscape:flatsided="false"
sodipodi:arg2="-1.1706745"
sodipodi:arg1="-1.5628423"
sodipodi:r2="12.910534"
sodipodi:r1="7.5301485"
sodipodi:cy="14.376256"
sodipodi:cx="20.455589"
sodipodi:sides="8"
id="path3794"
style="fill:url(#linearGradient3898);fill-opacity:1;stroke:none"
sodipodi:type="star" />
<path
sodipodi:type="star"
style="fill:url(#linearGradient3882);fill-opacity:1;stroke:none"
id="path3792"
sodipodi:sides="8"
sodipodi:cx="20.455589"
sodipodi:cy="14.376256"
sodipodi:r1="12.517542"
sodipodi:r2="11.660198"
sodipodi:arg1="-1.5658343"
sodipodi:arg2="-1.1731352"
inkscape:flatsided="true"
inkscape:rounded="0"
inkscape:randomized="0"
d="m 20.517701,1.8588682 8.832938,3.7101779 3.622338,8.8693219 -3.710178,8.832938 -8.869322,3.622338 L 11.56054,23.183466 7.9382015,14.314144 11.648379,5.4812063 z"
transform="matrix(1.4992405,0,0,1.4992405,-0.42375043,998.05627)" />
</g>
</g>
</svg>

416
gemswap/source/diamond_inverted.svg
View File

@ -0,0 +1,416 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="64"
height="64"
id="svg2"
version="1.1"
inkscape:version="0.48.4 r9939"
sodipodi:docname="diamond_inverted.svg">
<defs
id="defs4">
<linearGradient
id="linearGradient4077">
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="0"
id="stop4081" />
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="1"
id="stop4079" />
</linearGradient>
<linearGradient
id="linearGradient4069">
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="0"
id="stop4073" />
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="1"
id="stop4071" />
</linearGradient>
<linearGradient
id="linearGradient4061">
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="0"
id="stop4065" />
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="1"
id="stop4063" />
</linearGradient>
<linearGradient
id="linearGradient4053">
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="0"
id="stop4057" />
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="1"
id="stop4055" />
</linearGradient>
<linearGradient
id="linearGradient4045">
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="0"
id="stop4049" />
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="1"
id="stop4047" />
</linearGradient>
<linearGradient
id="linearGradient4037">
<stop
style="stop-color:#f6f6f6;stop-opacity:1;"
offset="0"
id="stop4041" />
<stop
style="stop-color:#959595;stop-opacity:1;"
offset="1"
id="stop4039" />
</linearGradient>
<linearGradient
id="linearGradient3965">
<stop
style="stop-color:#dfdfdf;stop-opacity:1;"
offset="0"
id="stop3969" />
<stop
style="stop-color:#6e6e6e;stop-opacity:1;"
offset="1"
id="stop3967" />
</linearGradient>
<linearGradient
id="linearGradient3912">
<stop
id="stop3916"
offset="0"
style="stop-color:#f6f6f6;stop-opacity:1;" />
<stop
id="stop3914"
offset="1"
style="stop-color:#959595;stop-opacity:1;" />
</linearGradient>
<linearGradient
id="linearGradient3900">
<stop
style="stop-color:#b0b0b0;stop-opacity:1;"
offset="0"
id="stop3902" />
<stop
style="stop-color:#d5d5d5;stop-opacity:1;"
offset="1"
id="stop3904" />
</linearGradient>
<linearGradient
id="linearGradient3892">
<stop
id="stop3896"
offset="0"
style="stop-color:#e3e3e3;stop-opacity:1;" />
<stop
id="stop3894"
offset="1"
style="stop-color:#c6c6c6;stop-op