From 4cccde754cc1c19a20a81d48fdb141c1298a1e60 Mon Sep 17 00:00:00 2001 From: Sven Slootweg Date: Sun, 4 May 2014 20:50:28 +0200 Subject: [PATCH] Changes and stuff --- compiled/radium.js | 26 ++++++++++++-------------- gemswap/core.coffee | 25 +++++++++++++++++++------ gemswap/gemswap.js | 26 ++++++++++++++++++-------- radium/object.coffee | 24 ++++++++++++++++-------- radium/scene.coffee | 8 ++++---- 5 files changed, 69 insertions(+), 40 deletions(-) diff --git a/compiled/radium.js b/compiled/radium.js index 259a884..3044972 100644 --- a/compiled/radium.js +++ b/compiled/radium.js @@ -409,29 +409,27 @@ 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; + var event_map, _ref, _ref1; if (data == null) { data = {}; } + event_map = { + mouseover: this.onMouseOver, + create: this.onCreate, + step: this.onStep + }; 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; + default: + return (_ref1 = event_map[name]) != null ? _ref1.bind(this)(data) : void 0; } }; @@ -633,7 +631,7 @@ this.width = 800; this.height = 600; this.last_width = 800; - this.last_height; + this.last_height = 600; } Scene.prototype.addTargetSurface = function(surface) { @@ -643,8 +641,8 @@ 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); + _this.mouse_x = (event.clientX - canvas_pos.left) | 0; + _this.mouse_y = (event.clientY - canvas_pos.top) | 0; $("#debug").html("" + _this.mouse_x + " / " + _this.mouse_y); return _this.checkMouseCollisions(); }; @@ -717,7 +715,7 @@ _results = []; for (id in _ref) { instance = _ref[id]; - if (instance.checkPointCollision(this.mouseX, this.mouseY)) { + if (instance.checkPointCollision(this.mouse_x, this.mouse_y)) { _results.push(instance.callEvent("mouseover")); } else { _results.push(void 0); diff --git a/gemswap/core.coffee b/gemswap/core.coffee index 672c23e..34924f2 100644 --- a/gemswap/core.coffee +++ b/gemswap/core.coffee @@ -1,7 +1,7 @@ $(-> manager = new ResourceManager("gemswap/assets") engine = new Engine(manager) - + window.debug_engine = engine ### # Configure pre-loading assets manager.addImages([ @@ -14,6 +14,9 @@ $(-> "images/diamond.png" "images/diamond_inverted.png" "images/diamond_shimmer.png" + "images/yellow.png" + "images/yellow_inverted.png" + "images/yellow_shimmer.png" ]) ### @@ -33,8 +36,13 @@ $(-> 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") + diamond = engine.createObject("diamond") diamond.sprite = engine.getSprite("diamond") + diamond.draw_sprite = false diamond.onCreate = -> @fade_step = 0.045 @@ -43,9 +51,11 @@ $(-> @fade_decay_current = 9999 # Disable by default @fade_decay_max = 8 - @shimmer_step = 0.006 + @shimmer_step = 0.006 * Math.random() @shimmer_current_step = @shimmer_step @shimmer_value = 0 + + @gem_type = if Math.random() > 0.5 then "diamond" else "yellow" diamond.onStep = -> if @fade_decay_current < Math.pow(2, @fade_decay_max) @@ -75,19 +85,22 @@ $(-> return true diamond.onDraw = -> - @engine.getSprite("diamond_inverted").draw(@x, @y, { + @engine.getSprite(@gem_type).draw(@x, @y) + + @engine.getSprite("#{@gem_type}_inverted").draw(@x, @y, { alpha: @fade_value }) - @engine.getSprite("diamond_shimmer").draw(@x - 14, @y - 14, { + @engine.getSprite("#{@gem_type}_shimmer").draw(@x - 14, @y - 14, { alpha: @shimmer_value }) diamond.onMouseOver = -> - console.log("mouseover") @fade_decay_current = 1 - scene.createInstance(diamond, 20, 20) + for x in [0 .. 728] by 72 + for y in [0 .. 550] by 72 + scene.createInstance(diamond, x, y) engine.start() ) diff --git a/gemswap/gemswap.js b/gemswap/gemswap.js index 0bd32b2..c903882 100644 --- a/gemswap/gemswap.js +++ b/gemswap/gemswap.js @@ -4,6 +4,7 @@ var engine, manager; manager = new ResourceManager("gemswap/assets"); engine = new Engine(manager); + window.debug_engine = engine; /* * Configure pre-loading assets @@ -11,7 +12,7 @@ "images/loading_screen.png" ], true) */ - manager.addImages(["images/diamond.png", "images/diamond_inverted.png", "images/diamond_shimmer.png"]); + manager.addImages(["images/diamond.png", "images/diamond_inverted.png", "images/diamond_shimmer.png", "images/yellow.png", "images/yellow_inverted.png", "images/yellow_shimmer.png"]); /* manager.addSounds([ @@ -21,23 +22,28 @@ */ manager.prepare(); return manager.preload(null, function() { - var diamond, scene; + var diamond, scene, x, y, _i, _j; 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"); + engine.createSprite("yellow", "images/yellow.png"); + engine.createSprite("yellow_inverted", "images/yellow_inverted.png"); + engine.createSprite("yellow_shimmer", "images/yellow_shimmer.png"); diamond = engine.createObject("diamond"); diamond.sprite = engine.getSprite("diamond"); + diamond.draw_sprite = false; 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_step = 0.006 * Math.random(); this.shimmer_current_step = this.shimmer_step; - return this.shimmer_value = 0; + this.shimmer_value = 0; + return this.gem_type = Math.random() > 0.5 ? "diamond" : "yellow"; }; diamond.onStep = function() { var max; @@ -66,18 +72,22 @@ return true; }; diamond.onDraw = function() { - this.engine.getSprite("diamond_inverted").draw(this.x, this.y, { + 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("diamond_shimmer").draw(this.x - 14, this.y - 14, { + return this.engine.getSprite("" + this.gem_type + "_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); + for (x = _i = 0; _i <= 728; x = _i += 72) { + for (y = _j = 0; _j <= 550; y = _j += 72) { + scene.createInstance(diamond, x, y); + } + } return engine.start(); }); }); diff --git a/radium/object.coffee b/radium/object.coffee index 95ef082..8ec6e77 100644 --- a/radium/object.coffee +++ b/radium/object.coffee @@ -1,24 +1,32 @@ +# NOTE: All class methods are loosely bound (ie. -> instead of =>). This is to +# make sure that @properties refer to instances of Objects, rather than +# the defaults set in the Object class. + class Object constructor: (@engine, @name) -> @sprite = null @x = 0 @y = 0 - callEvent: (name, data = {}) => + callEvent: (name, data = {}) -> + event_map = + mouseover: @onMouseOver + create: @onCreate + step: @onStep + switch name - when "create" then @onCreate?(data) - when "step" then @onStep?(data) when "draw" @drawSelf(data.surface ? "") @onDraw?(data) + else event_map[name]?.bind(this)(data) - drawSelf: (surface) => + drawSelf: (surface) -> @drawSprite(surface) - drawSprite: (surface = "") => + drawSprite: (surface = "") -> @sprite.draw(@x, @y, {}, surface) if @sprite? and (@draw_sprite ? "true") - getBoundingBox: => + getBoundingBox: -> image_size = @sprite?.getSize() return { @@ -28,8 +36,8 @@ class Object y2: @y + image_size?.height } - checkPointCollision: (x, y) => + checkPointCollision: (x, y) -> # TODO: Precision collision matching! bounding_box = @getBoundingBox() - + return x >= bounding_box?.x1 and x <= bounding_box?.x2 and y >= bounding_box?.y1 and y <= bounding_box?.y2 diff --git a/radium/scene.coffee b/radium/scene.coffee index 93972b7..37a9826 100644 --- a/radium/scene.coffee +++ b/radium/scene.coffee @@ -8,15 +8,15 @@ class Scene @width = 800 @height = 600 @last_width = 800 - @last_height + @last_height = 600 addTargetSurface: (surface) => @surfaces.push(surface) @engine.updateCanvasSize(surface, @width, @height) $(surface).on("mousemove.radium", (event) => canvas_pos = surface.getBoundingClientRect() - @mouse_x = Math.floor(event.clientX - canvas_pos.left) - @mouse_y = Math.floor(event.clientY - canvas_pos.top) + @mouse_x = (event.clientX - canvas_pos.left) | 0 + @mouse_y = (event.clientY - canvas_pos.top) | 0 $("#debug").html("#{@mouse_x} / #{@mouse_y}") @checkMouseCollisions() ) @@ -51,7 +51,7 @@ class Scene checkMouseCollisions: => for id, instance of @instances - instance.callEvent("mouseover") if instance.checkPointCollision(@mouseX, @mouseY) + instance.callEvent("mouseover") if instance.checkPointCollision(@mouse_x, @mouse_y) createInstance: (object, x = 0, y = 0) => id = @last_instance_id += 1