Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

プレイヤー操作周り修正 #31

Merged
merged 8 commits into from
Jan 3, 2014
Merged

プレイヤー操作周り修正 #31

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
c919f8c
Simplify Player.InputHandler
lettas Jan 3, 2014
7315601
Inverse dependency between Player and Player.InputHandler
lettas Jan 3, 2014
d6781a0
Update player position
lettas Jan 3, 2014
4aa6044
Shoot a beam
lettas Jan 3, 2014
d57898f
Memoize getDirection
lettas Jan 3, 2014
f29f981
Fix Idle animation
lettas Jan 3, 2014
f00612b
Merge branch 'master' into feature/player_move
lettas Jan 3, 2014
7a342ec
Remove gomi
lettas Jan 3, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
168 changes: 81 additions & 87 deletions public/js/src/entity/player.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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, // 位置情報送信用カウンター
Expand All @@ -19,11 +18,38 @@ 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.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);
}

// ビーム
var mouseDown = this.inputHandler.shiftMouseDownEvent();
if (mouseDown) {
console.log(mouseDown);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

これ消しとく？

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ごめんくさい

this.shoot(mouseDown.getLocation());
}

// 位置情報をサーバに送信
if (this.positionSendCount_++ > this.POSITION_SEND_INTERVAL) {
this.positionSendCount_ = 0;
this.sendPosition();
Expand Down Expand Up @@ -98,12 +124,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"],
Expand All @@ -113,79 +140,48 @@ 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({
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);
},

/**
Expand All @@ -194,20 +190,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
Expand All @@ -221,32 +208,39 @@ bq.entity.Player.InputHandler = cc.Class.extend({
* @param {Array} downs
* @return {bq.entity.EntityState.Direction} 見つからない場合null
*/
convertDirectionFromKeys_: function(downs) {
getDirection: function() {
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},
{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 (向いてる方向を維持）
var found = _.find(pairs, function(pair) {
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)) {
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;
}
}),

shiftMouseDownEvent: function() {
return this.mouseDownEvents_.shift();
},
});

9 changes: 1 addition & 8 deletions public/js/src/scene/beamQuest.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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) {
Expand All @@ -55,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() {
Expand Down