From c919f8cc974cd2b4a8e2ae1294ba2246c7729c0e Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:00:05 +0900 Subject: [PATCH 1/7] Simplify Player.InputHandler --- public/js/src/entity/player.js | 108 ++++++++------------------------- 1 file changed, 24 insertions(+), 84 deletions(-) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index 2dd9a6f..2edc3d1 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -116,75 +116,25 @@ bq.entity.Player = bq.entity.Entity.extend({ }); bq.entity.Player.InputHandler = cc.Class.extend({ - downKeys_: [], // 今押されているキーのリスト (max2) - dx: 0, // プレイヤーx方向移動量(px) - dy: 0, // プレイヤーy方向移動量(px) - - ctor: function(player) { - this.player_ = player; - }, + downKeys_: [], // 押されているキーのリスト + mouseDownEvents_: [], // クリックイベント /** @override */ onKeyDown: function(key) { - - var startWalking = function(dx, dy) { - this.dx = dx; - this.dy = dy; - this.addDownKey_(key); - var dir = this.convertDirectionFromKeys_(this.downKeys_); - this.player_.updateAnimation(bq.entity.EntityState.Mode.walking,dir); - }.bind(this); - - switch (key) { - // 重複多いのでリファクタリングした結果ｗｗｗｗｗ - case cc.KEY.a: - startWalking(-this.player_.moveSpeed, this.dy); - break; - - case cc.KEY.s: - startWalking(this.dx, -this.player_.moveSpeed); - break; - - case cc.KEY.d: - startWalking(this.player_.moveSpeed, this.dy); - break; - - case cc.KEY.w: - startWalking(this.dx, this.player_.moveSpeed); - break; - - default: - break; - } + this.addDownKey_(key); }, /** @override */ onKeyUp: function(key) { this.removeDownKey_(key); + }, - if (this.downKeys_.length > 0) { - // return; - // TODO: 移動で引っかかるのをどうにかする - } - switch (key) { - case cc.KEY.a: - case cc.KEY.d: - this.dx = 0; - // 押しているキーが０でない場合まだ歩いている - var sts = (this.downKeys_.length == 0) ? bq.entity.EntityState.Mode.stop : null; - var dir = this.convertDirectionFromKeys_(this.downKeys_); - this.player_.updateAnimation(sts,dir); - break; - case cc.KEY.s: - case cc.KEY.w: - this.dy = 0; - var dir = this.convertDirectionFromKeys_(this.downKeys_); - var sts = (this.downKeys_.length == 0) ? bq.entity.EntityState.Mode.stop : null; - this.player_.updateAnimation(sts,dir); - break; - default: - break; - } + /** + * + * @param event + */ + onMouseDown: function(event) { + this.mouseDownEvents_.push(event); }, /** @@ -193,20 +143,11 @@ bq.entity.Player.InputHandler = cc.Class.extend({ * @private */ addDownKey_: function(key) { - if (!_.contains(this.downKeys_, key) && this.downKeys_.length < 2) { + if (!_.contains(this.downKeys_, key)) { this.downKeys_.push(key); } }, - /** - * - * @param event - */ - onMouseDown: function(event) { - // TODO 右クリックと左クリックで動作を変える - this.player_.shoot(event.getLocation()); - }, - /** * @param {Event} key * @private @@ -220,32 +161,31 @@ bq.entity.Player.InputHandler = cc.Class.extend({ * @param {Array} downs * @return {bq.entity.EntityState.Direction} 見つからない場合null */ - convertDirectionFromKeys_: function(downs) { + getDirection: function() { + var downs = this.downKeys_.slice(0, 2); var pairs = [ - {key: [cc.KEY.s], val: bq.entity.EntityState.Direction.bottom}, - {key: [cc.KEY.s,cc.KEY.d], val: bq.entity.EntityState.Direction.bottomright}, - {key: [cc.KEY.d], val: bq.entity.EntityState.Direction.right}, + {key: [cc.KEY.s], val: bq.entity.EntityState.Direction.bottom}, + {key: [cc.KEY.s, cc.KEY.d], val: bq.entity.EntityState.Direction.bottomright}, + {key: [cc.KEY.d], val: bq.entity.EntityState.Direction.right}, {key: [cc.KEY.d, cc.KEY.w], val: bq.entity.EntityState.Direction.topright}, - {key: [cc.KEY.w], val: bq.entity.EntityState.Direction.top}, + {key: [cc.KEY.w], val: bq.entity.EntityState.Direction.top}, {key: [cc.KEY.w, cc.KEY.a], val: bq.entity.EntityState.Direction.topleft}, - {key: [cc.KEY.a], val: bq.entity.EntityState.Direction.left}, + {key: [cc.KEY.a], val: bq.entity.EntityState.Direction.left}, {key: [cc.KEY.a, cc.KEY.s], val: bq.entity.EntityState.Direction.bottomleft}, {key: [cc.KEY.a, cc.KEY.d], val: null}, {key: [cc.KEY.w, cc.KEY.s], val: null} ]; - if ( downs.length == 0 ) { - // 押してない状態はnull (向いてる方向を維持） - return null; - } - var found = _.find(pairs, function(pair) { return ( downs.length==1 && _.contains(downs, pair.key[0]) ) || ( downs.length==2 && _.contains(downs, pair.key[0]) && _.contains(downs, pair.key[1]) ); - } ); + }); - return found.val; - } + if (_.isUndefined(found)) { + return null; + } + return found.val; + }, }); From 7315601cf0bac64ea1186ed1ec8cf158f833962c Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:02:28 +0900 Subject: [PATCH 2/7] Inverse dependency between Player and Player.InputHandler --- public/js/src/entity/player.js | 1 + public/js/src/scene/beamQuest.js | 3 +-- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index 2edc3d1..23b8970 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -19,6 +19,7 @@ bq.entity.Player = bq.entity.Entity.extend({ ctor:function () { this._super('b0_0.png', this.getKeyFrameMap_()); this.socket = bq.Socket.getInstance(); + this.inputHandler = new bq.entity.Player.InputHandler(); this.scheduleUpdate(); }, diff --git a/public/js/src/scene/beamQuest.js b/public/js/src/scene/beamQuest.js index d5034b6..2698123 100755 --- a/public/js/src/scene/beamQuest.js +++ b/public/js/src/scene/beamQuest.js @@ -35,8 +35,7 @@ bq.scene.BeamQuestWorld = cc.Layer.extend({ this.inputHandler = new bq.InputHandler(); this.inputHandler.attach(this); - this.playerHandler = new bq.entity.Player.InputHandler(bq.player); - this.inputHandler.addListener(this.playerHandler); + this.inputHandler.addListener(bq.player.inputHandler); this.inputHandler.addListener({ onKeyDown: function(key) { if (key === cc.KEY.enter) { From d6781a09859073b75c53cbd3c1183b1c0eb74249 Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:03:18 +0900 Subject: [PATCH 3/7] Update player position --- public/js/src/entity/player.js | 41 ++++++++++++++++++++++++++++++-- public/js/src/scene/beamQuest.js | 6 ----- 2 files changed, 39 insertions(+), 8 deletions(-) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index 23b8970..bd59c6a 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -9,7 +9,6 @@ bq.entity.Player = bq.entity.Entity.extend({ moveSpeed: 4, // 1frameの移動量(px) animationSpeed:0.15, // delay on animation - direction: bq.entity.EntityState.Direction.bottom, // 向いている方向 state: bq.entity.EntityState.Mode.stop, // 動いてるとか止まってるとかの状態 POSITION_SEND_INTERVAL: 5, // 位置情報を何frameごとに送信するか positionSendCount_: 0, // 位置情報送信用カウンター @@ -20,11 +19,30 @@ bq.entity.Player = bq.entity.Entity.extend({ this._super('b0_0.png', this.getKeyFrameMap_()); this.socket = bq.Socket.getInstance(); this.inputHandler = new bq.entity.Player.InputHandler(); + this.currentDirection = bq.entity.EntityState.Direction.bottom; this.scheduleUpdate(); }, /** @override */ update: function() { + var direction = this.inputHandler.getDirection(); + + if (direction) { + // アニメーションを更新 + this.updateAnimation(bq.entity.EntityState.Mode.walking, direction); + + // プレイヤーを移動 + var currentPosition = bq.player.getPosition(); + var directionVector = this.getNormalizedDirectionVector(direction); + var moveDistance = cc.pMult(directionVector, this.moveSpeed); + this.setPosition(cc.pAdd(currentPosition, moveDistance)); + } + else { + // ストップ + this.updateAnimation(bq.entity.EntityState.Mode.stop, this.currentDirection); + } + + // 位置情報をサーバに送信 if (this.positionSendCount_++ > this.POSITION_SEND_INTERVAL) { this.positionSendCount_ = 0; this.sendPosition(); @@ -113,7 +131,26 @@ bq.entity.Player = bq.entity.Entity.extend({ step_left: ["b6_4.png", "b6_5.png", "b6_6.png", "b6_7.png"], step_bottomleft: ["b7_4.png", "b7_5.png", "b7_6.png", "b7_7.png"] }; - } + }, + + /** + * 方向をベクトルに変換する + * TODO 他のクラスに移す + * @param {cc.p} direction + */ + getNormalizedDirectionVector: _.memoize(function(direction) { + var d = bq.entity.EntityState.Direction; + var directionVectors = {}; + directionVectors[d.bottom] = cc.p( 0, -1); + directionVectors[d.bottomright] = cc.p( 1, -1); + directionVectors[d.right] = cc.p( 1, 0); + directionVectors[d.topright] = cc.p( 1, 1); + directionVectors[d.top] = cc.p( 0, 1); + directionVectors[d.topleft] = cc.p(-1, 1); + directionVectors[d.left] = cc.p(-1, 0); + directionVectors[d.bottomleft] = cc.p(-1, -1); + return cc.pNormalize(directionVectors[direction]); + }) }); bq.entity.Player.InputHandler = cc.Class.extend({ diff --git a/public/js/src/scene/beamQuest.js b/public/js/src/scene/beamQuest.js index 2698123..221bcff 100755 --- a/public/js/src/scene/beamQuest.js +++ b/public/js/src/scene/beamQuest.js @@ -54,12 +54,6 @@ bq.scene.BeamQuestWorld = cc.Layer.extend({ update: function() { 'use strict'; - var baseP = bq.player.getPosition(); - var dx = this.playerHandler.dx; - var dy = this.playerHandler.dy; - if (dx !== 0 || dy !== 0) { - bq.player.setPosition(cc.p(baseP.x + dx, baseP.y + dy)); - } }, initPing_: function() { From 4aa60446e662e9748605a13aae6ec28c184ccdbe Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:22:24 +0900 Subject: [PATCH 4/7] Shoot a beam --- public/js/src/entity/player.js | 11 +++++++++++ 1 file changed, 11 insertions(+) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index bd59c6a..345808f 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -42,6 +42,13 @@ bq.entity.Player = bq.entity.Entity.extend({ this.updateAnimation(bq.entity.EntityState.Mode.stop, this.currentDirection); } + // ビーム + var mouseDown = this.inputHandler.shiftMouseDownEvent(); + if (mouseDown) { + console.log(mouseDown); + this.shoot(mouseDown.getLocation()); + } + // 位置情報をサーバに送信 if (this.positionSendCount_++ > this.POSITION_SEND_INTERVAL) { this.positionSendCount_ = 0; @@ -225,5 +232,9 @@ bq.entity.Player.InputHandler = cc.Class.extend({ return found.val; }, + + shiftMouseDownEvent: function() { + return this.mouseDownEvents_.shift(); + }, }); From d57898f8a11713eb92d306df76763d02030ac796 Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:41:15 +0900 Subject: [PATCH 5/7] Memoize getDirection --- public/js/src/entity/player.js | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index 345808f..c85305a 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -207,7 +207,11 @@ bq.entity.Player.InputHandler = cc.Class.extend({ * @return {bq.entity.EntityState.Direction} 見つからない場合null */ getDirection: function() { - var downs = this.downKeys_.slice(0, 2); + var downKeys = this.downKeys_.slice(0, 2); + return this.getDirectionByDownKeys_(downKeys); + }, + + getDirectionByDownKeys_: _.memoize(function(downKeys) { var pairs = [ {key: [cc.KEY.s], val: bq.entity.EntityState.Direction.bottom}, {key: [cc.KEY.s, cc.KEY.d], val: bq.entity.EntityState.Direction.bottomright}, @@ -222,8 +226,8 @@ bq.entity.Player.InputHandler = cc.Class.extend({ ]; var found = _.find(pairs, function(pair) { - return ( downs.length==1 && _.contains(downs, pair.key[0]) ) - || ( downs.length==2 && _.contains(downs, pair.key[0]) && _.contains(downs, pair.key[1]) ); + return ( downKeys.length==1 && _.contains(downKeys, pair.key[0]) ) + || ( downKeys.length==2 && _.contains(downKeys, pair.key[0]) && _.contains(downKeys, pair.key[1]) ); }); if (_.isUndefined(found)) { @@ -231,7 +235,7 @@ bq.entity.Player.InputHandler = cc.Class.extend({ } return found.val; - }, + }), shiftMouseDownEvent: function() { return this.mouseDownEvents_.shift(); From f29f9815a04931b47e7913a13f8efc93d2475c47 Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:43:31 +0900 Subject: [PATCH 6/7] Fix Idle animation --- public/js/src/entity/player.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index c85305a..4896dd6 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -123,12 +123,13 @@ bq.entity.Player = bq.entity.Entity.extend({ getKeyFrameMap_: function () { return { idle_bottom: ["b0_0.png", "b0_1.png", "b0_2.png", "b0_3.png"], + idle_bottomright: ["b1_0.png", "b1_1.png", "b1_2.png", "b1_3.png"], idle_right: ["b2_0.png", "b2_1.png", "b2_2.png", "b2_3.png"], idle_topright: ["b3_0.png", "b3_1.png", "b3_2.png", "b3_3.png"], idle_top: ["b4_0.png", "b4_1.png", "b4_2.png", "b4_3.png"], idle_topleft: ["b5_0.png", "b5_1.png", "b5_2.png", "b5_3.png"], idle_left: ["b6_0.png", "b6_1.png", "b6_2.png", "b6_3.png"], - idle_bottomleft: ["b7_0.png", "b0_1.png", "b0_2.png", "b0_3.png"], + idle_bottomleft: ["b7_0.png", "b7_1.png", "b7_2.png", "b7_3.png"], step_bottom: ["b0_4.png", "b0_5.png", "b0_6.png", "b0_7.png"], step_bottomright: ["b1_4.png", "b1_5.png", "b1_6.png", "b1_7.png"], step_right: ["b2_4.png", "b2_5.png", "b2_6.png", "b2_7.png"], From 7a342ecf32f5873a4ae5e2c54f791606c54cf4c4 Mon Sep 17 00:00:00 2001 From: Toru Matsuoka Date: Sat, 4 Jan 2014 00:58:37 +0900 Subject: [PATCH 7/7] Remove gomi --- public/js/src/entity/player.js | 1 - 1 file changed, 1 deletion(-) diff --git a/public/js/src/entity/player.js b/public/js/src/entity/player.js index fb1c11e..9f823c6 100644 --- a/public/js/src/entity/player.js +++ b/public/js/src/entity/player.js @@ -45,7 +45,6 @@ bq.entity.Player = bq.entity.Entity.extend({ // ビーム var mouseDown = this.inputHandler.shiftMouseDownEvent(); if (mouseDown) { - console.log(mouseDown); this.shoot(mouseDown.getLocation()); }