Skip to content

Commit 63d90a0

Browse files
photonstormphotonstorm
committed
Sprites that are fixedToCamera can now be input dragged regardless of world position.
1 parent 3cbb820 commit 63d90a0

7 files changed

Lines changed: 170 additions & 33 deletions

File tree

‎README.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -106,6 +106,7 @@ Bug Fixes:
106106
* Fixed an issue where passing null as the Group parent wouldn't set it to game.world as it should have (thanks tito100)
107107
* Fixed Pixi bug (#425) incorrect width property for multi-line BitmapText (thanks jcd-as)
108108
* Tween.onStart is now called when the tween starts AFTER the delay value, if given (thanks stevenbouma)
109+
* Sprites that are fixedToCamera can now be input dragged regardless of world position (thanks RafaelOliveira)
109110

110111

111112
You can view the Change Log for all previous versions at https://github.com/photonstorm/phaser/changelog.md

‎examples/wip/fixdrag.js‎

Lines changed: 72 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,72 @@
1+
2+
var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
3+
4+
function preload() {
5+
6+
game.stage.backgroundColor = '#007236';
7+
8+
game.load.image('ball', 'assets/sprites/shinyball.png');
9+
game.load.image('mushroom', 'assets/sprites/mushroom2.png');
10+
game.load.image('phaser', 'assets/sprites/sonic_havok_sanity.png');
11+
12+
}
13+
14+
var sprite;
15+
var cursors;
16+
17+
function create() {
18+
19+
game.world.setBounds(0, 0, 1000, 1000);
20+
21+
for (var i = 0; i < 100; i++)
22+
{
23+
game.add.sprite(game.world.randomX, game.world.randomY, 'mushroom');
24+
}
25+
26+
sprite = game.add.sprite(200, 200, 'ball');
27+
28+
sprite.fixedToCamera = true;
29+
// sprite.cameraOffset.setTo(200, 200);
30+
31+
32+
sprite.inputEnabled = true;
33+
sprite.input.enableDrag();
34+
sprite.events.onInputOver.add(wibble, this);
35+
36+
cursors = game.input.keyboard.createCursorKeys();
37+
38+
}
39+
40+
function wibble() {
41+
console.log('over');
42+
}
43+
44+
function update() {
45+
46+
if (cursors.up.isDown)
47+
{
48+
game.camera.y -= 4;
49+
}
50+
else if (cursors.down.isDown)
51+
{
52+
game.camera.y += 4;
53+
}
54+
55+
if (cursors.left.isDown)
56+
{
57+
game.camera.x -= 4;
58+
}
59+
else if (cursors.right.isDown)
60+
{
61+
game.camera.x += 4;
62+
}
63+
64+
}
65+
66+
function render() {
67+
68+
game.debug.renderText(sprite.cameraOffset.x, 32, 32);
69+
game.debug.renderText(sprite.cameraOffset.y, 32, 64);
70+
game.debug.renderPointer(game.input.activePointer);
71+
72+
}

‎examples/wip/mod.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ var module;
2828
function create() {
2929

3030
module = new Protracker();
31-
module.buffer = game.cache.getBinary('elysium');
31+
module.buffer = game.cache.getBinary('impulse');
3232
module.parse();
3333
module.play();
3434

‎examples/wip/tilemap.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -50,13 +50,14 @@ function create() {
5050
// map.setCollisionByIndexRange(20, 25);
5151
// map.setCollisionByIndexRange(27, 29);
5252

53-
layer3 = map.createLayer('Tile Layer 3');
54-
layer3.scrollFactorX = 0.5;
53+
// layer3 = map.createLayer('Tile Layer 3');
54+
// layer3.scrollFactorX = 0.5;
5555

56-
layer2 = map.createLayer('Tile Layer 2');
57-
layer2.alpha = 0.5;
56+
// layer2 = map.createLayer('Tile Layer 2');
57+
// layer2.alpha = 0.5;
5858

5959
layer = map.createLayer('Tile Layer 1');
60+
layer.scrollFactorX = 0.5;
6061

6162
// layer.debug = true;
6263

‎src/gameobjects/Sprite.js‎

Lines changed: 12 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -354,7 +354,7 @@ Phaser.Sprite = function (game, x, y, key, frame) {
354354
/**
355355
* @property {Phaser.Point} cameraOffset - If this Sprite is fixed to the camera then use this Point to specify how far away from the Camera x/y it's rendered.
356356
*/
357-
this.cameraOffset = new Phaser.Point();
357+
this.cameraOffset = new Phaser.Point(x, y);
358358

359359
/**
360360
* You can crop the Sprites texture by modifying the crop properties. For example crop.width = 50 would set the Sprite to only render 50px wide.
@@ -772,8 +772,17 @@ Phaser.Sprite.prototype.loadTexture = function (key, frame) {
772772
*/
773773
Phaser.Sprite.prototype.centerOn = function(x, y) {
774774

775-
this.x = x + (this.x - this.center.x);
776-
this.y = y + (this.y - this.center.y);
775+
if (this.fixedToCamera)
776+
{
777+
this.cameraOffset.x = x + (this.cameraOffset.x - this.center.x);
778+
this.cameraOffset.y = y + (this.cameraOffset.y - this.center.y);
779+
}
780+
else
781+
{
782+
this.x = x + (this.x - this.center.x);
783+
this.y = y + (this.y - this.center.y);
784+
}
785+
777786
return this;
778787

779788
};

‎src/input/InputHandler.js‎

Lines changed: 78 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -701,30 +701,61 @@ Phaser.InputHandler.prototype = {
701701
return false;
702702
}
703703

704-
if (this.allowHorizontalDrag)
704+
if (this.sprite.fixedToCamera)
705705
{
706-
this.sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
707-
}
706+
if (this.allowHorizontalDrag)
707+
{
708+
this.sprite.cameraOffset.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
709+
}
708710

709-
if (this.allowVerticalDrag)
710-
{
711-
this.sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
712-
}
711+
if (this.allowVerticalDrag)
712+
{
713+
this.sprite.cameraOffset.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
714+
}
713715

714-
if (this.boundsRect)
715-
{
716-
this.checkBoundsRect();
717-
}
716+
if (this.boundsRect)
717+
{
718+
this.checkBoundsRect();
719+
}
718720

719-
if (this.boundsSprite)
720-
{
721-
this.checkBoundsSprite();
722-
}
721+
if (this.boundsSprite)
722+
{
723+
this.checkBoundsSprite();
724+
}
723725

724-
if (this.snapOnDrag)
726+
if (this.snapOnDrag)
727+
{
728+
this.sprite.cameraOffset.x = Math.round(this.sprite.x / this.snapX) * this.snapX;
729+
this.sprite.cameraOffset.y = Math.round(this.sprite.y / this.snapY) * this.snapY;
730+
}
731+
}
732+
else
725733
{
726-
this.sprite.x = Math.round(this.sprite.x / this.snapX) * this.snapX;
727-
this.sprite.y = Math.round(this.sprite.y / this.snapY) * this.snapY;
734+
if (this.allowHorizontalDrag)
735+
{
736+
this.sprite.x = pointer.x + this._dragPoint.x + this.dragOffset.x;
737+
}
738+
739+
if (this.allowVerticalDrag)
740+
{
741+
this.sprite.y = pointer.y + this._dragPoint.y + this.dragOffset.y;
742+
}
743+
744+
if (this.boundsRect)
745+
{
746+
this.checkBoundsRect();
747+
}
748+
749+
if (this.boundsSprite)
750+
{
751+
this.checkBoundsSprite();
752+
}
753+
754+
if (this.snapOnDrag)
755+
{
756+
this.sprite.x = Math.round(this.sprite.x / this.snapX) * this.snapX;
757+
this.sprite.y = Math.round(this.sprite.y / this.snapY) * this.snapY;
758+
}
728759
}
729760

730761
return true;
@@ -904,14 +935,29 @@ Phaser.InputHandler.prototype = {
904935
this._draggedPointerID = pointer.id;
905936
this._pointerData[pointer.id].isDragged = true;
906937

907-
if (this.dragFromCenter)
938+
if (this.sprite.fixedToCamera)
908939
{
909-
this.sprite.centerOn(pointer.x, pointer.y);
910-
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
940+
if (this.dragFromCenter)
941+
{
942+
this.sprite.centerOn(pointer.x, pointer.y);
943+
this._dragPoint.setTo(this.sprite.cameraOffset.x - pointer.x, this.sprite.cameraOffset.y - pointer.y);
944+
}
945+
else
946+
{
947+
this._dragPoint.setTo(this.sprite.cameraOffset.x - pointer.x, this.sprite.cameraOffset.y - pointer.y);
948+
}
911949
}
912950
else
913951
{
914-
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
952+
if (this.dragFromCenter)
953+
{
954+
this.sprite.centerOn(pointer.x, pointer.y);
955+
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
956+
}
957+
else
958+
{
959+
this._dragPoint.setTo(this.sprite.x - pointer.x, this.sprite.y - pointer.y);
960+
}
915961
}
916962

917963
this.updateDrag(pointer);
@@ -938,8 +984,16 @@ Phaser.InputHandler.prototype = {
938984

939985
if (this.snapOnRelease)
940986
{
941-
this.sprite.x = Math.round(this.sprite.x / this.snapX) * this.snapX;
942-
this.sprite.y = Math.round(this.sprite.y / this.snapY) * this.snapY;
987+
if (this.sprite.fixedToCamera)
988+
{
989+
this.sprite.cameraOffset.x = Math.round(this.sprite.cameraOffset.x / this.snapX) * this.snapX;
990+
this.sprite.cameraOffset.y = Math.round(this.sprite.cameraOffset.y / this.snapY) * this.snapY;
991+
}
992+
else
993+
{
994+
this.sprite.x = Math.round(this.sprite.x / this.snapX) * this.snapX;
995+
this.sprite.y = Math.round(this.sprite.y / this.snapY) * this.snapY;
996+
}
943997
}
944998

945999
this.sprite.events.onDragStop.dispatch(this.sprite, pointer);

‎src/tilemap/TilemapLayer.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -304,7 +304,7 @@ Phaser.TilemapLayer.prototype.postUpdate = function () {
304304
*/
305305
Phaser.TilemapLayer.prototype.resizeWorld = function () {
306306

307-
this.game.world.setBounds(0, 0, this.layer.widthInPixels, this.layer.heightInPixels);
307+
this.game.world.setBounds(0, 0, this.layer.widthInPixels * 4, this.layer.heightInPixels);
308308

309309
}
310310

0 commit comments

Comments
 (0)