diff --git a/compiled/radium.js b/compiled/radium.js index 3044972..f99bd85 100644 --- a/compiled/radium.js +++ b/compiled/radium.js @@ -375,7 +375,7 @@ return function(min, max, precision) { var base_number, rounding_factor, space; base_number = Math.random(); - space = Math.abs(ceiling - floor); + space = Math.abs(max - min); rounding_factor = 1 / (precision != null ? precision : 0.00000001); return Math.floor((min + (base_number * space)) * rounding_factor) / rounding_factor; }; @@ -410,6 +410,7 @@ this.engine = engine; this.name = name; this.sprite = null; + this.instances = []; this.x = 0; this.y = 0; } @@ -421,6 +422,7 @@ } event_map = { mouseover: this.onMouseOver, + mouseout: this.onMouseOut, create: this.onCreate, step: this.onStep }; @@ -458,6 +460,10 @@ }; }; + Object.prototype.getInstances = function() { + return this.instances; + }; + Object.prototype.checkPointCollision = function(x, y) { var bounding_box; bounding_box = this.getBoundingBox(); @@ -643,7 +649,6 @@ canvas_pos = surface.getBoundingClientRect(); _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(); }; })(this)); @@ -710,13 +715,18 @@ }; Scene.prototype.checkMouseCollisions = function() { - var id, instance, _ref, _results; + var collision, id, instance, _ref, _results; _ref = this.instances; _results = []; for (id in _ref) { instance = _ref[id]; - if (instance.checkPointCollision(this.mouse_x, this.mouse_y)) { - _results.push(instance.callEvent("mouseover")); + collision = instance.checkPointCollision(this.mouse_x, this.mouse_y); + if (collision && !instance._moused_over) { + instance.callEvent("mouseover"); + _results.push(instance._moused_over = true); + } else if (!collision && instance._moused_over) { + instance.callEvent("mouseout"); + _results.push(instance._moused_over = false); } else { _results.push(void 0); } @@ -725,7 +735,7 @@ }; Scene.prototype.createInstance = function(object, x, y) { - var id, instance; + var id, instance, real_object; if (x == null) { x = 0; } @@ -733,12 +743,14 @@ y = 0; } id = this.last_instance_id += 1; - instance = window.Object.create(this.engine.getObject(object)); + real_object = this.engine.getObject(object); + instance = window.Object.create(real_object); instance.x = x; instance.y = y; instance.id = id; instance.scene = this; this.instances[id] = instance; + real_object.instances.push(instance); instance.callEvent("create"); return instance; }; diff --git a/gemswap/assets/images/blue.png b/gemswap/assets/images/blue.png new file mode 100644 index 0000000..3e1bcaf Binary files /dev/null and b/gemswap/assets/images/blue.png differ diff --git a/gemswap/assets/images/blue_inverted.png b/gemswap/assets/images/blue_inverted.png new file mode 100644 index 0000000..dd49923 Binary files /dev/null and b/gemswap/assets/images/blue_inverted.png differ diff --git a/gemswap/assets/images/blue_shimmer.png b/gemswap/assets/images/blue_shimmer.png new file mode 100644 index 0000000..d840aa4 Binary files /dev/null and b/gemswap/assets/images/blue_shimmer.png differ diff --git a/gemswap/assets/images/cursor.png b/gemswap/assets/images/cursor.png new file mode 100644 index 0000000..74d44bd Binary files /dev/null and b/gemswap/assets/images/cursor.png differ diff --git a/gemswap/assets/images/yellow.png b/gemswap/assets/images/yellow.png new file mode 100644 index 0000000..d019ab8 Binary files /dev/null and b/gemswap/assets/images/yellow.png differ diff --git a/gemswap/assets/images/yellow_inverted.png b/gemswap/assets/images/yellow_inverted.png new file mode 100644 index 0000000..f9b4421 Binary files /dev/null and b/gemswap/assets/images/yellow_inverted.png differ diff --git a/gemswap/assets/images/yellow_shimmer.png b/gemswap/assets/images/yellow_shimmer.png new file mode 100644 index 0000000..89ddf00 Binary files /dev/null and b/gemswap/assets/images/yellow_shimmer.png differ diff --git a/gemswap/core.coffee b/gemswap/core.coffee index 34924f2..58691e1 100644 --- a/gemswap/core.coffee +++ b/gemswap/core.coffee @@ -11,12 +11,16 @@ $(-> # Configure game assets manager.addImages([ + "images/cursor.png" "images/diamond.png" "images/diamond_inverted.png" "images/diamond_shimmer.png" "images/yellow.png" "images/yellow_inverted.png" "images/yellow_shimmer.png" + "images/blue.png" + "images/blue_inverted.png" + "images/blue_shimmer.png" ]) ### @@ -32,6 +36,8 @@ $(-> 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") @@ -39,7 +45,14 @@ $(-> 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 @@ -51,11 +64,11 @@ $(-> @fade_decay_current = 9999 # Disable by default @fade_decay_max = 8 - @shimmer_step = 0.006 * Math.random() + @shimmer_step = @engine.random.number(0.003, 0.007, 0.0005) * Math.random() @shimmer_current_step = @shimmer_step @shimmer_value = 0 - @gem_type = if Math.random() > 0.5 then "diamond" else "yellow" + @gem_type = @engine.random.pick("diamond", "yellow", "blue") diamond.onStep = -> if @fade_decay_current < Math.pow(2, @fade_decay_max) @@ -97,10 +110,19 @@ $(-> diamond.onMouseOver = -> @fade_decay_current = 1 + + cursor = @engine.getObject("cursor").getInstances()[0] + cursor.x = @x - 9 + cursor.y = @y - 9 - for x in [0 .. 728] by 72 - for y in [0 .. 550] by 72 + 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}
Frameskip: #{@engine.frameskip}") + + scene.createInstance(cursor, 0, 0) engine.start() ) diff --git a/gemswap/gemswap.js b/gemswap/gemswap.js index c903882..4c5393e 100644 --- a/gemswap/gemswap.js +++ b/gemswap/gemswap.js @@ -12,7 +12,7 @@ "images/loading_screen.png" ], true) */ - 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.addImages(["images/cursor.png", "images/diamond.png", "images/diamond_inverted.png", "images/diamond_shimmer.png", "images/yellow.png", "images/yellow_inverted.png", "images/yellow_shimmer.png", "images/blue.png", "images/blue_inverted.png", "images/blue_shimmer.png"]); /* manager.addSounds([ @@ -22,15 +22,21 @@ */ manager.prepare(); return manager.preload(null, function() { - var diamond, scene, x, y, _i, _j; + var cursor, diamond, scene, x, y, _i, _j; 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; @@ -40,10 +46,10 @@ this.fade_value = 0; this.fade_decay_current = 9999; this.fade_decay_max = 8; - this.shimmer_step = 0.006 * Math.random(); + this.shimmer_step = this.engine.random.number(0.003, 0.007, 0.0005) * Math.random(); this.shimmer_current_step = this.shimmer_step; this.shimmer_value = 0; - return this.gem_type = Math.random() > 0.5 ? "diamond" : "yellow"; + return this.gem_type = this.engine.random.pick("diamond", "yellow", "blue"); }; diamond.onStep = function() { var max; @@ -81,13 +87,20 @@ }); }; diamond.onMouseOver = function() { - return this.fade_decay_current = 1; + this.fade_decay_current = 1; + cursor = this.engine.getObject("cursor").getInstances()[0]; + cursor.x = this.x - 9; + return cursor.y = this.y - 9; }; - for (x = _i = 0; _i <= 728; x = _i += 72) { - for (y = _j = 0; _j <= 550; y = _j += 72) { + 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 + "
Frameskip: " + this.engine.frameskip); + }; + scene.createInstance(cursor, 0, 0); return engine.start(); }); }); diff --git a/gemswap/source/blue.svg b/gemswap/source/blue.svg new file mode 100644 index 0000000..1dc06c0 --- /dev/null +++ b/gemswap/source/blue.svg @@ -0,0 +1,213 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/gemswap/source/blue_inverted.svg b/gemswap/source/blue_inverted.svg new file mode 100644 index 0000000..4c12859 --- /dev/null +++ b/gemswap/source/blue_inverted.svg @@ -0,0 +1,279 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + + + diff --git a/gemswap/source/blue_shimmer.svg b/gemswap/source/blue_shimmer.svg new file mode 100644 index 0000000..e5ef928 --- /dev/null +++ b/gemswap/source/blue_shimmer.svg @@ -0,0 +1,287 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + diff --git a/gemswap/source/cursor.svg b/gemswap/source/cursor.svg new file mode 100644 index 0000000..739da61 --- /dev/null +++ b/gemswap/source/cursor.svg @@ -0,0 +1,81 @@ + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + diff --git a/gemswap/source/yellow.svg b/gemswap/source/yellow.svg new file mode 100644 index 0000000..cfe7d2f --- /dev/null +++ b/gemswap/source/yellow.svg @@ -0,0 +1,144 @@ + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/gemswap/source/yellow_inverted.svg b/gemswap/source/yellow_inverted.svg new file mode 100644 index 0000000..4d42199 --- /dev/null +++ b/gemswap/source/yellow_inverted.svg @@ -0,0 +1,166 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + diff --git a/gemswap/source/yellow_shimmer.svg b/gemswap/source/yellow_shimmer.svg new file mode 100644 index 0000000..ccb8a64 --- /dev/null +++ b/gemswap/source/yellow_shimmer.svg @@ -0,0 +1,188 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + + + + + + diff --git a/radium/engine.random.coffee b/radium/engine.random.coffee index dd13486..229f593 100644 --- a/radium/engine.random.coffee +++ b/radium/engine.random.coffee @@ -1,7 +1,7 @@ Engine::random = number: (min, max, precision) => base_number = Math.random() - space = Math.abs(ceiling - floor) + space = Math.abs(max - min) rounding_factor = 1 / (precision ? 0.00000001) return Math.floor((min + (base_number * space)) * rounding_factor) / rounding_factor diff --git a/radium/object.coffee b/radium/object.coffee index 8ec6e77..49cbb68 100644 --- a/radium/object.coffee +++ b/radium/object.coffee @@ -5,12 +5,14 @@ class Object constructor: (@engine, @name) -> @sprite = null + @instances = [] @x = 0 @y = 0 callEvent: (name, data = {}) -> event_map = mouseover: @onMouseOver + mouseout: @onMouseOut create: @onCreate step: @onStep @@ -36,6 +38,9 @@ class Object y2: @y + image_size?.height } + getInstances: -> + return @instances + checkPointCollision: (x, y) -> # TODO: Precision collision matching! bounding_box = @getBoundingBox() diff --git a/radium/scene.coffee b/radium/scene.coffee index 37a9826..6f7ea05 100644 --- a/radium/scene.coffee +++ b/radium/scene.coffee @@ -17,7 +17,6 @@ class Scene canvas_pos = surface.getBoundingClientRect() @mouse_x = (event.clientX - canvas_pos.left) | 0 @mouse_y = (event.clientY - canvas_pos.top) | 0 - $("#debug").html("#{@mouse_x} / #{@mouse_y}") @checkMouseCollisions() ) @checkActive() @@ -51,17 +50,26 @@ class Scene checkMouseCollisions: => for id, instance of @instances - instance.callEvent("mouseover") if instance.checkPointCollision(@mouse_x, @mouse_y) + collision = instance.checkPointCollision(@mouse_x, @mouse_y) + + if collision and not instance._moused_over + instance.callEvent("mouseover") + instance._moused_over = true + else if not collision and instance._moused_over + instance.callEvent("mouseout") + instance._moused_over = false createInstance: (object, x = 0, y = 0) => id = @last_instance_id += 1 + real_object = @engine.getObject(object) - instance = window.Object.create(@engine.getObject(object)) + instance = window.Object.create(real_object) instance.x = x instance.y = y instance.id = id instance.scene = this @instances[id] = instance + real_object.instances.push(instance) instance.callEvent("create")