Skip to content

Commit 890e520

Browse files
photonstormphotonstorm
committed
Mouse callback tests.
1 parent 9b9baa8 commit 890e520

5 files changed

Lines changed: 214 additions & 28 deletions

File tree

‎examples/wip/mouse.js‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
function distanceBetween(point1, point2) {
2+
return Math.sqrt(Math.pow(point2.x - point1.x, 2) + Math.pow(point2.y - point1.y, 2));
3+
}
4+
function angleBetween(point1, point2) {
5+
return Math.atan2( point2.x - point1.x, point2.y - point1.y );
6+
}
7+
8+
var isDrawing, lastPoint;
9+
10+
11+
12+
// var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
13+
var game = new Phaser.Game(800, 600, Phaser.WEBGL, 'phaser-example', { preload: preload, create: create, update: update, render: render });
14+
15+
function preload() {
16+
17+
game.load.image('mushroom', 'assets/sprites/chunk.png');
18+
19+
}
20+
21+
var mushroom;
22+
var texture;
23+
var image;
24+
25+
var down;
26+
var p;
27+
28+
function create() {
29+
30+
texture = game.add.renderTexture(800, 600, 'mousetrail', true);
31+
32+
// We create a sprite (rather than using the factory) so it doesn't get added to the display, as we only need its texture data.
33+
mushroom = new Phaser.Sprite(game, 0, 0, 'mushroom');
34+
mushroom.anchor.setTo(0.5, 0.5);
35+
36+
// This is the sprite that is drawn to the display. We've given it the renderTexture as its texture.
37+
image = game.add.image(0, 0, texture);
38+
39+
domElement = document.getElementById('phaser-example');
40+
41+
p = new Phaser.Point();
42+
43+
domElement.addEventListener('mousemove', onMouseMove, true);
44+
domElement.addEventListener('mousedown', onMouseDown, true);
45+
// domElement.addEventListener('mouseout', onMouseOut, true);
46+
domElement.addEventListener('mouseup', onMouseUp, true);
47+
48+
texture.render(mushroom, p, false);
49+
50+
}
51+
52+
function onMouseDown(e) {
53+
isDrawing = true;
54+
lastPoint = { x: e.clientX, y: e.clientY };
55+
}
56+
57+
function onMouseUp(e) {
58+
isDrawing = false;
59+
}
60+
61+
function onMouseMove(e) {
62+
63+
if (!isDrawing) return;
64+
65+
var currentPoint = { x: e.clientX, y: e.clientY };
66+
var dist = distanceBetween(lastPoint, currentPoint);
67+
var angle = angleBetween(lastPoint, currentPoint);
68+
69+
for (var i = 0; i < dist; i+=5) {
70+
x = lastPoint.x + (Math.sin(angle) * i) - 25;
71+
y = lastPoint.y + (Math.cos(angle) * i) - 25;
72+
p.set(x, y);
73+
texture.render(mushroom, p, false);
74+
75+
// ctx.beginPath();
76+
// ctx.arc(x+10, y+10, 20, false, Math.PI * 2, false);
77+
// ctx.closePath();
78+
// ctx.fill();
79+
// ctx.stroke();
80+
}
81+
82+
lastPoint = currentPoint;
83+
84+
}
85+
86+
function tint() {
87+
88+
image.tint = Math.random() * 0xFFFFFF;
89+
90+
}
91+
92+
function update() {
93+
94+
// if (down)
95+
// {
96+
// }
97+
98+
}
99+
100+
function render() {
101+
102+
}

‎examples/wip/mouse2.js‎

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
function distanceBetween(point1, point2) {
2+
return Math.sqrt(Math.pow(point2.x - point1.x, 2) + Math.pow(point2.y - point1.y, 2));
3+
}
4+
function angleBetween(point1, point2) {
5+
return Math.atan2( point2.x - point1.x, point2.y - point1.y );
6+
}
7+
8+
var isDrawing, lastPoint;
9+
10+
11+
12+
// var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
13+
var game = new Phaser.Game(800, 600, Phaser.WEBGL, 'phaser-example', { preload: preload, create: create, update: update, render: render });
14+
15+
function preload() {
16+
17+
game.load.image('mushroom', 'assets/sprites/chunk.png');
18+
19+
}
20+
21+
var mushroom;
22+
var texture;
23+
var image;
24+
25+
var down;
26+
var p;
27+
28+
function create() {
29+
30+
texture = game.add.renderTexture(800, 600, 'mousetrail', true);
31+
32+
// We create a sprite (rather than using the factory) so it doesn't get added to the display, as we only need its texture data.
33+
mushroom = new Phaser.Sprite(game, 0, 0, 'mushroom');
34+
mushroom.anchor.setTo(0.5, 0.5);
35+
36+
// This is the sprite that is drawn to the display. We've given it the renderTexture as its texture.
37+
image = game.add.image(0, 0, texture);
38+
39+
domElement = document.getElementById('phaser-example');
40+
41+
p = new Phaser.Point();
42+
43+
// domElement.addEventListener('mousemove', onMouseMove, true);
44+
// domElement.addEventListener('mousedown', onMouseDown, true);
45+
// // domElement.addEventListener('mouseout', onMouseOut, true);
46+
// domElement.addEventListener('mouseup', onMouseUp, true);
47+
48+
game.input.mouse.mouseDownCallback = onMouseDown;
49+
game.input.mouse.mouseUpCallback = onMouseUp;
50+
game.input.mouse.mouseMoveCallback = onMouseMove;
51+
52+
texture.render(mushroom, p, false);
53+
54+
}
55+
56+
function onMouseDown(e) {
57+
isDrawing = true;
58+
lastPoint = { x: e.clientX, y: e.clientY };
59+
}
60+
61+
function onMouseUp(e) {
62+
isDrawing = false;
63+
}
64+
65+
function onMouseMove(e) {
66+
67+
if (!isDrawing) return;
68+
69+
var currentPoint = { x: e.clientX, y: e.clientY };
70+
var dist = distanceBetween(lastPoint, currentPoint);
71+
var angle = angleBetween(lastPoint, currentPoint);
72+
73+
for (var i = 0; i < dist; i+=5) {
74+
x = lastPoint.x + (Math.sin(angle) * i) - 25;
75+
y = lastPoint.y + (Math.cos(angle) * i) - 25;
76+
p.set(x, y);
77+
texture.render(mushroom, p, false);
78+
79+
// ctx.beginPath();
80+
// ctx.arc(x+10, y+10, 20, false, Math.PI * 2, false);
81+
// ctx.closePath();
82+
// ctx.fill();
83+
// ctx.stroke();
84+
}
85+
86+
lastPoint = currentPoint;
87+
88+
}
89+
90+
function tint() {
91+
92+
image.tint = Math.random() * 0xFFFFFF;
93+
94+
}
95+
96+
function update() {
97+
98+
// if (down)
99+
// {
100+
// }
101+
102+
}
103+
104+
function render() {
105+
106+
}

‎src/gameobjects/GameObjectFactory.js‎

Lines changed: 1 addition & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -77,24 +77,6 @@ Phaser.GameObjectFactory.prototype = {
7777

7878
},
7979

80-
/**
81-
* DEPRECATED - will be removed in Phaser 1.2
82-
* Create a new Sprite with specific position and sprite sheet key that will automatically be added as a child of the given parent.
83-
*
84-
* @method Phaser.GameObjectFactory#child
85-
* @param {Phaser.Group} group - The Group to add this child to.
86-
* @param {number} x - X position of the new sprite.
87-
* @param {number} y - Y position of the new sprite.
88-
* @param {string|RenderTexture} [key] - The image key as defined in the Game.Cache to use as the texture for this sprite OR a RenderTexture.
89-
* @param {string|number} [frame] - If the sprite uses an image from a texture atlas or sprite sheet you can pass the frame here. Either a number for a frame ID or a string for a frame name.
90-
* @returns {Phaser.Sprite} the newly created sprite object.
91-
*/
92-
child: function (group, x, y, key, frame) {
93-
94-
return group.create(x, y, key, frame);
95-
96-
},
97-
9880
/**
9981
* Create a tween object for a specific object. The object can be any JavaScript object or Phaser object such as Sprite.
10082
*
@@ -299,7 +281,7 @@ Phaser.GameObjectFactory.prototype = {
299281
if (typeof addToCache === 'undefined') { addToCache = false; }
300282
if (typeof key === 'undefined' || key === '') { key = this.game.rnd.uuid(); }
301283

302-
var texture = new Phaser.RenderTexture(this.game, key, width, height);
284+
var texture = new Phaser.RenderTexture(this.game, width, height, key);
303285

304286
if (addToCache)
305287
{

‎src/gameobjects/Image.js‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -402,7 +402,7 @@ Phaser.Image.prototype.bringToTop = function(child) {
402402
/**
403403
* Indicates the rotation of the Sprite, in degrees, from its original orientation. Values from 0 to 180 represent clockwise rotation; values from 0 to -180 represent counterclockwise rotation.
404404
* Values outside this range are added to or subtracted from 360 to obtain a value within the range. For example, the statement player.angle = 450 is the same as player.angle = 90.
405-
* If you wish to work in radians instead of degrees use the property Sprite.rotation instead. Working in radians is also faster on mobile devices where Object.defineProperty is expensive to call.
405+
* If you wish to work in radians instead of degrees use the property Sprite.rotation instead. Working in radians is also a little faster as it doesn't have to convert the angle.
406406
*
407407
* @name Phaser.Image#angle
408408
* @property {number} angle - The angle of this Image in degrees.
@@ -509,10 +509,8 @@ Object.defineProperty(Phaser.Image.prototype, "inCamera", {
509509
});
510510

511511
/**
512-
* .
513-
*
514512
* @name Phaser.Image#frame
515-
* @property {boolean} frame - .
513+
* @property {number} frame - Gets or sets the current frame index and updates the Texture for display.
516514
*/
517515
Object.defineProperty(Phaser.Image.prototype, "frame", {
518516

@@ -540,10 +538,8 @@ Object.defineProperty(Phaser.Image.prototype, "frame", {
540538
});
541539

542540
/**
543-
* .
544-
*
545541
* @name Phaser.Image#frameName
546-
* @property {boolean} frameName - .
542+
* @property {string} frameName - Gets or sets the current frame by name and updates the Texture for display.
547543
*/
548544
Object.defineProperty(Phaser.Image.prototype, "frameName", {
549545

‎src/gameobjects/RenderTexture.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
* @param {number} [width=100] - The width of the render texture.
1414
* @param {number} [height=100] - The height of the render texture.
1515
*/
16-
Phaser.RenderTexture = function (game, key, width, height) {
16+
Phaser.RenderTexture = function (game, width, height, key) {
1717

1818
/**
1919
* @property {Phaser.Game} game - A reference to the currently running game.
@@ -30,7 +30,7 @@ Phaser.RenderTexture = function (game, key, width, height) {
3030
*/
3131
this.type = Phaser.RENDERTEXTURE;
3232

33-
PIXI.RenderTexture.call(this, width, height, renderer);
33+
PIXI.RenderTexture.call(this, width, height);
3434

3535
};
3636

0 commit comments

Comments
 (0)