Skip to content

Commit 332f715

Browse files
committed
Finally fixed a really annoying bug in ScrollZone and it now works perfectly across the board.
1 parent f267810 commit 332f715

22 files changed

Lines changed: 714 additions & 396 deletions

Phaser/Game.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -398,7 +398,7 @@ module Phaser {
398398
return this.world.createEmitter(x, y, size);
399399
}
400400

401-
public createScrollZone(key:string, x: number, y: number, width: number, height: number): ScrollZone {
401+
public createScrollZone(key: string, x?: number = 0, y?: number = 0, width?: number = 0, height?: number = 0): ScrollZone {
402402
return this.world.createScrollZone(key, x, y, width, height);
403403
}
404404

Phaser/Phaser.csproj

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -86,6 +86,10 @@
8686
<DependentUpon>Particle.ts</DependentUpon>
8787
</Content>
8888
<TypeScriptCompile Include="gameobjects\ScrollZone.ts" />
89+
<TypeScriptCompile Include="gameobjects\ScrollRegion.ts" />
90+
<Content Include="gameobjects\ScrollRegion.js">
91+
<DependentUpon>ScrollRegion.ts</DependentUpon>
92+
</Content>
8993
<Content Include="gameobjects\ScrollZone.js">
9094
<DependentUpon>ScrollZone.ts</DependentUpon>
9195
</Content>

Phaser/State.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@ module Phaser {
8282
return this.game.world.createEmitter(x, y, size);
8383
}
8484

85-
public createScrollZone(key:string, x: number, y: number, width: number, height: number): ScrollZone {
85+
public createScrollZone(key: string, x?: number = 0, y?: number = 0, width?: number = 0, height?: number = 0): ScrollZone {
8686
return this.game.world.createScrollZone(key, x, y, width, height);
8787
}
8888

Phaser/World.ts

Lines changed: 1 addition & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -108,11 +108,6 @@ module Phaser {
108108

109109
// Cameras
110110

111-
public addExistingCamera(cam: Camera): Camera {
112-
//return this._cameras.addCamera(x, y, width, height);
113-
return cam;
114-
}
115-
116111
public createCamera(x: number, y: number, width: number, height: number): Camera {
117112
return this._cameras.addCamera(x, y, width, height);
118113
}
@@ -127,11 +122,6 @@ module Phaser {
127122

128123
// Game Objects
129124

130-
// Drop this?
131-
public addExistingSprite(sprite: Sprite): Sprite {
132-
return <Sprite> this.group.add(sprite);
133-
}
134-
135125
public createSprite(x: number, y: number, key?: string = ''): Sprite {
136126
return <Sprite> this.group.add(new Sprite(this._game, x, y, key));
137127
}
@@ -148,7 +138,7 @@ module Phaser {
148138
return <Group> this.group.add(new Group(this._game, MaxSize));
149139
}
150140

151-
public createScrollZone(key: string, x: number, y: number, width: number, height: number): ScrollZone {
141+
public createScrollZone(key: string, x?: number = 0, y?: number = 0, width?: number = 0, height?: number = 0): ScrollZone {
152142
return <ScrollZone> this.group.add(new ScrollZone(this._game, key, x, y, width, height));
153143
}
154144

Phaser/gameobjects/ScrollRegion.ts

Lines changed: 146 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,146 @@
1+
/// <reference path="../Game.ts" />
2+
/// <reference path="../geom/Quad.ts" />
3+
4+
/**
5+
* Phaser - ScrollRegion
6+
*
7+
* Creates a scrolling region within a ScrollZone.
8+
* It is scrolled via the scrollSpeed.x/y properties.
9+
*/
10+
11+
module Phaser {
12+
13+
export class ScrollRegion{
14+
15+
constructor(x: number, y: number, width: number, height: number, speedX:number, speedY:number) {
16+
17+
// Our seamless scrolling quads
18+
this._A = new Quad(0, 0, width, height);
19+
this._B = new Quad();
20+
this._C = new Quad();
21+
this._D = new Quad();
22+
23+
this._scroll = new MicroPoint();
24+
this._offset = new MicroPoint(x, y);
25+
26+
this.scrollSpeed = new MicroPoint(speedX, speedY);
27+
this.bounds = new Quad(0, 0, width, height);
28+
29+
}
30+
31+
private _A: Quad;
32+
private _B: Quad;
33+
private _C: Quad;
34+
private _D: Quad;
35+
36+
private _scroll: MicroPoint;
37+
private _offset: MicroPoint;
38+
39+
private _anchorWidth: number = 0;
40+
private _anchorHeight: number = 0;
41+
private _inverseWidth: number = 0;
42+
private _inverseHeight: number = 0;
43+
44+
public bounds: Quad;
45+
public visible: bool = true;
46+
public scrollSpeed: MicroPoint;
47+
48+
public update(delta: number) {
49+
50+
this._scroll.x = Math.round(this._scroll.x + (this.scrollSpeed.x));
51+
this._scroll.y = Math.round(this._scroll.y + (this.scrollSpeed.y));
52+
53+
if (this._scroll.x > this._offset.x + this.bounds.width)
54+
{
55+
this._scroll.x = this._offset.x;
56+
}
57+
58+
if (this._scroll.x < this._offset.x)
59+
{
60+
this._scroll.x = this._offset.x + this.bounds.width;
61+
}
62+
63+
if (this._scroll.y > this._offset.y + this.bounds.height)
64+
{
65+
this._scroll.y = this._offset.y;
66+
}
67+
68+
if (this._scroll.y < this._offset.y)
69+
{
70+
this._scroll.y = this._offset.y + this.bounds.height;
71+
}
72+
73+
// Anchor Dimensions
74+
this._anchorWidth = this.bounds.width - this._scroll.x;
75+
this._anchorHeight = this.bounds.height - this._scroll.y;
76+
77+
if (this._anchorWidth > this.bounds.width)
78+
{
79+
this._anchorWidth = this.bounds.width;
80+
}
81+
82+
if (this._anchorHeight > this.bounds.height)
83+
{
84+
this._anchorHeight = this.bounds.height;
85+
}
86+
87+
this._inverseWidth = this.bounds.width - this._anchorWidth;
88+
this._inverseHeight = this.bounds.height - this._anchorHeight;
89+
90+
// Quad A
91+
this._A.setTo(this._scroll.x, this._scroll.y, this._anchorWidth, this._anchorHeight);
92+
93+
// Quad B
94+
this._B.y = this._scroll.y;
95+
this._B.width = this._inverseWidth;
96+
this._B.height = this._anchorHeight;
97+
98+
// Quad C
99+
this._C.x = this._scroll.x;
100+
this._C.width = this._anchorWidth;
101+
this._C.height = this._inverseHeight;
102+
103+
// Quad D
104+
this._D.width = this._inverseWidth;
105+
this._D.height = this._inverseHeight;
106+
107+
}
108+
109+
public render(context:CanvasRenderingContext2D, texture, dx: number, dy: number, dw: number, dh: number) {
110+
111+
if (this.visible == false)
112+
{
113+
return;
114+
}
115+
116+
this.crop(context, texture, this._A.x, this._A.y, this._A.width, this._A.height, dx, dy, dw, dh, 0, 0);
117+
this.crop(context, texture, this._B.x, this._B.y, this._B.width, this._B.height, dx, dy, dw, dh, this._A.width, 0);
118+
this.crop(context, texture, this._C.x, this._C.y, this._C.width, this._C.height, dx, dy, dw, dh, 0, this._A.height);
119+
this.crop(context, texture, this._D.x, this._D.y, this._D.width, this._D.height, dx, dy, dw, dh, this._C.width, this._A.height);
120+
121+
}
122+
123+
private crop(context, texture, srcX, srcY, srcW, srcH, destX, destY, destW, destH, offsetX, offsetY) {
124+
125+
offsetX += destX;
126+
offsetY += destY;
127+
128+
if (srcW > (destX + destW) - offsetX)
129+
{
130+
srcW = (destX + destW) - offsetX;
131+
}
132+
133+
if (srcH > (destY + destH) - offsetY)
134+
{
135+
srcH = (destY + destH) - offsetY;
136+
}
137+
138+
if (srcW > 0 && srcH > 0)
139+
{
140+
context.drawImage(texture, srcX, srcY, srcW, srcH, offsetX, offsetY, srcW, srcH);
141+
}
142+
}
143+
144+
}
145+
146+
}

0 commit comments

Comments
 (0)