diff --git a/games/card-suarez.json b/games/card-suarez.json index a0033ca..36661b4 100644 --- a/games/card-suarez.json +++ b/games/card-suarez.json @@ -2,81 +2,80 @@ "preload": { "background":"images/Luis-Suarez-uruguay-best-striker.jpg" }, - "scenes": { - "card": { - "autostart": true, - "children": { - "frTop": { - "type": "BitmapData", - "fillStyle": "#000", - "width": "100%", - "height": "12%", - "position": { + "scene": { + + "autostart": true, + "children": { + "frTop": { + "type": "BitmapData", + "fillStyle": "#000", + "width": "100%", + "height": "12%", + "position": { + "my": "top left", + "at": "top left", + "of": "parent" + } + }, + "frBody": { + "type": "BitmapData", + "fillStyle": "#00A", + "anchors": [ + { "my": "top left", - "at": "top left", - "of": "parent" + "at": "bottom left", + "of": "parent.frTop" + }, + { + "my": "bottom right", + "at": "top right", + "of": "parent.frBottom" } - }, - "frBody": { - "type": "BitmapData", - "fillStyle": "#00A", - "anchors": [ - { + ], + "children": { + "background": { + "type": "Sprite", + "texture": "background", + "width": "100%", + "height": "100%", + "texture-size": "cover", + "position": { "my": "top left", - "at": "bottom left", - "of": "parent.frTop" - }, - { - "my": "bottom right", - "at": "top right", - "of": "parent.frBottom" + "at": "top left", + "of": "parent" } - ], - "children": { - "background": { - "type": "Sprite", - "texture": "background", - "width": "100%", - "height": "100%", - "texture-size": "cover", - "position": { - "my": "top left", - "at": "top left", - "of": "parent" - } - }, - "video": { - "type": "YoutubeVideo", - "videoid": "3zKoUda-WVA", - "autoplay": true, - "allowfullscreen": true, - "maxWidth": "90%", - "minWidth": "50%", - "maxHeight": "90%", - "minHeight": "50%", - "width": "800", - "height": "600", - "aspectRatio": "1.778", - "position": { - "my": "middle center", - "at": "middle center", - "of": "parent" - } + }, + "video": { + "type": "YoutubeVideo", + "videoid": "3zKoUda-WVA", + "autoplay": false, + "allowfullscreen": "1", + "maxWidth": "90%", + "minWidth": "50%", + "maxHeight": "90%", + "minHeight": "50%", + "width": "800", + "height": "600", + "aspectRatio": "1.778", + "position": { + "my": "middle center", + "at": "middle center", + "of": "parent" } } - }, - "frBottom": { - "type": "BitmapData", - "fillStyle": "#000", - "width": "100%", - "height": "5%", - "position": { - "my": "bottom left", - "at": "bottom left", - "of": "parent" - } } - } - } + }, + "frBottom": { + "type": "BitmapData", + "fillStyle": "#000", + "width": "100%", + "height": "5%", + "position": { + "my": "bottom left", + "at": "bottom left", + "of": "parent" + } + } + } } } diff --git a/games/menubar.json b/games/menubar.json new file mode 100644 index 0000000..e0b958e --- /dev/null +++ b/games/menubar.json @@ -0,0 +1,193 @@ +{ + "class": { + "big-block": { + "type": "BitmapData", + "width": "50%", + "height": "50%", + "alpha": 0, + "tween": { + "time": 250, + "ease": "Quad.easeOut" + } + }, + "block": { + "type": "BitmapData", + "width": "50", + "height": "20" + } + }, + "scene": { + "autostart": true, + "sections": { + "/": { + "btn_1": { + "position": { + "my": "top left", + "at": "top left", + "of": "parent" + } + }, + "btn_2": { + "position": { + "my": "top left", + "at": "top right", + "of": "parent.btn_1" + } + }, + "btn_3": { + "position": { + "my": "top left", + "at": "top right", + "of": "parent.btn_2" + } + }, + "btn_4": { + "position": { + "my": "top left", + "at": "top right", + "of": "parent.btn_3" + } + }, + "body_1": { + "position": { + "my": "middle left", + "at": "middle right", + "of": "parent" + } + }, + "body_2": { + "position": { + "my": "middle left", + "at": "middle right", + "of": "parent" + } + }, + "body_3": { + "position": { + "my": "middle left", + "at": "middle right", + "of": "parent" + } + }, + "body_4": { + "position": { + "my": "middle left", + "at": "middle right", + "of": "parent" + } + } + }, + "/btn1": { + "body_1": { + "autoplay": true, + "alpha": 1, + "position": { + "my": "middle center", + "at": "middle center", + "of": "parent" + } + } + }, + "/btn2": { + "body_2": { + "alpha": 1, + "position": { + "my": "middle center", + "at": "middle center", + "of": "parent" + } + } + }, + "/btn3": { + "body_3": { + "alpha": 1, + "position": { + "my": "middle center", + "at": "middle center", + "of": "parent" + } + } + }, + "/btn4": { + "body_4": { + "alpha": 1, + "position": { + "my": "middle center", + "at": "middle center", + "of": "parent" + } + } + } + }, + "children_": { + "body_1": { + "class": "big-block", + "fillStyle": "#700" + } + }, + "children": { + "btn_1": { + "class": "block", + "fillStyle": "#F00", + "onInputDown": { + "handler": "scene-enter-section", + "params": "/btn1" + } + }, + "btn_2": { + "class": "block", + "fillStyle": "#FF0", + "onInputDown": { + "handler": "scene-enter-section", + "params": "/btn2" + } + }, + "btn_3": { + "class": "block", + "fillStyle": "#F0F", + "onInputDown": { + "handler": "scene-enter-section", + "params": "/btn3" + } + }, + "btn_4": { + "class": "block", + "fillStyle": "#0F0", + "onInputDown": { + "handler": "scene-enter-section", + "params": "/btn4" + } + }, + "body_1": { + "type": "YoutubeVideo", + "videoid": "3zKoUda-WVA", + "autoplay": false, + "allowfullscreen": true, + "maxWidth": "90%", + "minWidth": "50%", + "maxHeight": "90%", + "minHeight": "50%", + "width": "800", + "height": "600", + "aspectRatio": "1.778", + "alpha": 0, + "tween": { + "time": 250, + "ease": "Quad.easeOut" + } + }, + "body_2": { + "class": "big-block", + "fillStyle": "#770" + }, + "body_3": { + "class": "big-block", + "fillStyle": "#707" + }, + "body_4": { + "class": "big-block", + "fillStyle": "#070" + } + } + } +} \ No newline at end of file diff --git a/games/prueba.json b/games/prueba.json index e0b958e..36661b4 100644 --- a/games/prueba.json +++ b/games/prueba.json @@ -1,193 +1,81 @@ { - "class": { - "big-block": { - "type": "BitmapData", - "width": "50%", - "height": "50%", - "alpha": 0, - "tween": { - "time": 250, - "ease": "Quad.easeOut" - } - }, - "block": { - "type": "BitmapData", - "width": "50", - "height": "20" - } + "preload": { + "background":"images/Luis-Suarez-uruguay-best-striker.jpg" }, "scene": { + "autostart": true, - "sections": { - "/": { - "btn_1": { - "position": { - "my": "top left", - "at": "top left", - "of": "parent" - } - }, - "btn_2": { - "position": { - "my": "top left", - "at": "top right", - "of": "parent.btn_1" - } - }, - "btn_3": { - "position": { - "my": "top left", - "at": "top right", - "of": "parent.btn_2" - } - }, - "btn_4": { - "position": { - "my": "top left", - "at": "top right", - "of": "parent.btn_3" - } - }, - "body_1": { - "position": { - "my": "middle left", - "at": "middle right", - "of": "parent" - } - }, - "body_2": { - "position": { - "my": "middle left", - "at": "middle right", - "of": "parent" - } - }, - "body_3": { - "position": { - "my": "middle left", - "at": "middle right", - "of": "parent" - } - }, - "body_4": { - "position": { - "my": "middle left", - "at": "middle right", - "of": "parent" - } - } - }, - "/btn1": { - "body_1": { - "autoplay": true, - "alpha": 1, - "position": { - "my": "middle center", - "at": "middle center", - "of": "parent" - } - } - }, - "/btn2": { - "body_2": { - "alpha": 1, - "position": { - "my": "middle center", - "at": "middle center", - "of": "parent" - } + "children": { + "frTop": { + "type": "BitmapData", + "fillStyle": "#000", + "width": "100%", + "height": "12%", + "position": { + "my": "top left", + "at": "top left", + "of": "parent" } }, - "/btn3": { - "body_3": { - "alpha": 1, - "position": { - "my": "middle center", - "at": "middle center", - "of": "parent" + "frBody": { + "type": "BitmapData", + "fillStyle": "#00A", + "anchors": [ + { + "my": "top left", + "at": "bottom left", + "of": "parent.frTop" + }, + { + "my": "bottom right", + "at": "top right", + "of": "parent.frBottom" } - } - }, - "/btn4": { - "body_4": { - "alpha": 1, - "position": { - "my": "middle center", - "at": "middle center", - "of": "parent" + ], + "children": { + "background": { + "type": "Sprite", + "texture": "background", + "width": "100%", + "height": "100%", + "texture-size": "cover", + "position": { + "my": "top left", + "at": "top left", + "of": "parent" + } + }, + "video": { + "type": "YoutubeVideo", + "videoid": "3zKoUda-WVA", + "autoplay": false, + "allowfullscreen": "1", + "maxWidth": "90%", + "minWidth": "50%", + "maxHeight": "90%", + "minHeight": "50%", + "width": "800", + "height": "600", + "aspectRatio": "1.778", + "position": { + "my": "middle center", + "at": "middle center", + "of": "parent" + } } } - } - }, - "children_": { - "body_1": { - "class": "big-block", - "fillStyle": "#700" - } - }, - "children": { - "btn_1": { - "class": "block", - "fillStyle": "#F00", - "onInputDown": { - "handler": "scene-enter-section", - "params": "/btn1" - } - }, - "btn_2": { - "class": "block", - "fillStyle": "#FF0", - "onInputDown": { - "handler": "scene-enter-section", - "params": "/btn2" - } - }, - "btn_3": { - "class": "block", - "fillStyle": "#F0F", - "onInputDown": { - "handler": "scene-enter-section", - "params": "/btn3" - } }, - "btn_4": { - "class": "block", - "fillStyle": "#0F0", - "onInputDown": { - "handler": "scene-enter-section", - "params": "/btn4" + "frBottom": { + "type": "BitmapData", + "fillStyle": "#000", + "width": "100%", + "height": "5%", + "position": { + "my": "bottom left", + "at": "bottom left", + "of": "parent" } - }, - "body_1": { - "type": "YoutubeVideo", - "videoid": "3zKoUda-WVA", - "autoplay": false, - "allowfullscreen": true, - "maxWidth": "90%", - "minWidth": "50%", - "maxHeight": "90%", - "minHeight": "50%", - "width": "800", - "height": "600", - "aspectRatio": "1.778", - "alpha": 0, - "tween": { - "time": 250, - "ease": "Quad.easeOut" - } - }, - "body_2": { - "class": "big-block", - "fillStyle": "#770" - }, - "body_3": { - "class": "big-block", - "fillStyle": "#707" - }, - "body_4": { - "class": "big-block", - "fillStyle": "#070" } - } + } } -} \ No newline at end of file +} diff --git a/plugins/JSON2Game.js b/plugins/JSON2Game.js index 993f73f..c79fc5c 100644 --- a/plugins/JSON2Game.js +++ b/plugins/JSON2Game.js @@ -236,7 +236,7 @@ Phaser.Plugin.JSON2Game.Base.prototype = { }, computeDeployment: function (apply) { var result = {width: 12, height: 34}, - berofe = {}, + before = {}, max, min; if (this.spec.width) { diff --git a/src/bitmap_data.js b/src/bitmap_data.js index c7e4861..ba50c29 100644 --- a/src/bitmap_data.js +++ b/src/bitmap_data.js @@ -3,7 +3,7 @@ LightSaber.BitmapData = function (game, spec, parent) { this.bmd = game.make.bitmapData(layout.width, layout.height); this.bmd.x = this.bmd.y = 0; spec.texture = this.bmd; - LightSaber.DisplayObject.call(this, game, spec, parent); + LightSaber.DisplayObject.call(this, game, spec, parent); this.x = layout.x; this.y = layout.y; this.width = layout.width; diff --git a/src/display_object.js b/src/display_object.js index d47233b..1d1c8ac 100644 --- a/src/display_object.js +++ b/src/display_object.js @@ -1,9 +1,10 @@ LightSaber.DisplayObject = function (game,spec,parent) { + console.log("spec.texture", spec.texture) Phaser.Sprite.call(this, game, 0, 0, spec.texture); this.game = game; this.spec = spec; this.data = spec; - this.state = {}; + this.state = {x:0, y:0, width: 123, height: 456}; this.instance_name = spec.instance_name; this._ls_parent = parent; if (parent) { @@ -174,8 +175,10 @@ LightSaber.DisplayObject.prototype = jwk.extend(Object.create(Phaser.Sprite.prot return this; }, computeDeployment: function (apply) { + console.debug("DisplayObject.computeDeployment("+ apply + ")"); + var result = {width: 12, height: 34}, - berofe = {}; + before = {}; if (this.data.width) { if (typeof this.data.width == "string" && this.data.width.indexOf("%") != -1) { @@ -240,9 +243,14 @@ LightSaber.DisplayObject.prototype = jwk.extend(Object.create(Phaser.Sprite.prot this.setSize(result); } else { before = { + width: this.state.width, + height: this.state.height, x: this.state.x, y: this.state.y } + // el objeto ya tiene que tener seteado su tamaño antes de ejecutar this.translateToCoords(this.data.position.my); + this.state.width = result.width; + this.state.height = result.height; } if (this.data.position) { @@ -355,6 +363,7 @@ LightSaber.DisplayObject.prototype = jwk.extend(Object.create(Phaser.Sprite.prot if (this._update_state_use_tween) { var tween = this.game.add.tween(this).to( this.state, this.spec.tween.time, this.spec.tween.ease, true, this.spec.tween.delay); } else { + console.log("this.state: ", this.state, [this]); jwk.extend(this, this.state); } } diff --git a/src/sprite.js b/src/sprite.js index 8575c87..6d50c28 100644 --- a/src/sprite.js +++ b/src/sprite.js @@ -1,5 +1,23 @@ -LightSaber.Sprite = function (game, spec, parent) { - LightSaber.DisplayObject.call(this, game, spec, parent); +LightSaber.Sprite = function (game, spec, parent) { + // LightSaber.DisplayObject.call(this, game, spec, parent); + + + console.log("spec.texture", spec.texture) + Phaser.Sprite.call(this, game, 0, 0, spec.texture); + this.game = game; + this.spec = spec; + this.data = spec; + this.state = {x:0, y:0, width: 123, height: 456}; + this.instance_name = spec.instance_name; + this._ls_parent = parent; + if (parent) { + // parent.addChild(this); + this.game.world.addChild(this); + } + + this.subscribeToEvents(); + this.createChildren(); + this.sortChildren(); }; LightSaber.Sprite.prototype = jwk.extend(Object.create(LightSaber.DisplayObject.prototype), { @@ -12,21 +30,19 @@ LightSaber.Sprite.prototype = jwk.extend(Object.create(LightSaber.DisplayObject. // Shapes drawn to the Graphics object must be filled. this.mask.beginFill(0xff0000); this.mask.drawRect(0, 0, this.texture.width, this.texture.height); - this.mask = this.mask; - + // this.mask = this.mask; + //this.phaserObj.crop(this.cropRect); this.texture_size = {h:this.texture.height, w: this.texture.width}; this.aspectRatio = this.texture_size.w / this.texture_size.h; - //this.phaserObj.crop(this.cropRect); this.childrenDoCreate(); // this.phaserObj.worldTransform = new PIXI.Matrix(); - // console.log("this.phaserObj.worldTransform = new PIXI.Matrix();", [this.phaserObj.getBounds()]); - - this.childrenDoCreate(); + // console.log("this.phaserObj.worldTransform = new PIXI.Matrix();", [this.phaserObj.getBounds()]); }, computeDeployment: function (apply) { - var dep = LightSaber.DisplayObject.prototype.computeDeployment.call(this, false); + var dep = LightSaber.DisplayObject.prototype.computeDeployment.call(this, false); + console.debug("Sprite.computeDeployment("+ apply + ")"); var temp, percent; this.scale.x = 1; this.scale.y = 1; @@ -70,17 +86,19 @@ LightSaber.Sprite.prototype = jwk.extend(Object.create(LightSaber.DisplayObject. return dep; }, setDeployment: function (dep) { - + console.debug("setDeployment:", dep); LightSaber.DisplayObject.prototype.setDeployment.call(this, dep); if (dep.crop) { + console.log("AAAAAAAAAAAAAAAAAA"); if (dep.crop.x) this.cropRect.x = dep.crop.x; if (dep.crop.y) this.cropRect.y = dep.crop.y; if (dep.crop.width) this.cropRect.width = dep.crop.width; if (dep.crop.height) this.cropRect.height = dep.crop.height; } - if (dep.mask) { + if (dep.mask && this.mask) { + console.log("BBBBBBBBBBBBBBBBB"); this.mask.clear(); this.mask.beginFill(0xff0000); this.mask.drawRect(dep.mask.x, dep.mask.y, dep.mask.width, dep.mask.height);