View difference between Paste ID: 5XqmV7tm and RK2rs527
SHOW: | | - or go back to the newest paste.
1
// http://phaser.io/examples/v2/tilemaps/csv-map-with-p2
2
3
var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
4
5
function preload() {
6
7
    game.load.tilemap('map', 'assets/tilemaps/csv/catastrophi_level2.csv', null, Phaser.Tilemap.CSV);
8
    game.load.image('tiles', 'assets/tilemaps/tiles/catastrophi_tiles_16.png');
9
    game.load.image('player', 'assets/sprites/tinycar.png');
10
11
}
12
13
var map;
14
var layer;
15
var cursors;
16
var player;
17
var renderTexture;
18
var renderSprite;
19
var help;
20
var map;
21
var layer;
22
var cursors;
23
var player;
24
var renderTexture;
25
var renderSprite;
26
var help;
27
28
function create() {
29
30
    game.physics.startSystem(Phaser.Physics.P2JS);
31
32
    
33
34
    //  Because we're loading CSV map data we have to specify the tile size here or we can't render it
35
    map = game.add.tilemap('map', 16, 16);
36
37
    //  Now add in the tileset
38
    map.addTilesetImage('tiles');
39
    
40
    //  Create our layer
41
    layer = map.createLayer(0);
42
43
    //  Resize the world
44
    layer.resizeWorld();
45
46
    //  This isn't totally accurate, but it'll do for now
47
    map.setCollisionBetween(54, 83);
48
49
    //  Convert the tilemap layer into bodies. Only tiles that collide (see above) are created.
50
    //  This call returns an array of body objects which you can perform addition actions on if
51
    //  required. There is also a parameter to control optimising the map build.
52
    game.physics.p2.convertTilemap(map, layer);
53
54
    //  Player
55
    player = game.add.sprite(48, 48, 'player');
56
57
    game.physics.p2.enable(player);
58
59
    game.physics.p2.setBoundsToWorld(true, true, true, true, false);
60
61-
    renderTexture=game.add.renderTexture(200,200,"rt")
61+
62-
    renderTexture.resolution=0.5
62+
63
    //  Allow cursors to scroll around the map
64
    cursors = game.input.keyboard.createCursorKeys();
65
66-
    renderGroup.x=650
66+
67-
    renderGroup.y=150
67+
68
    
69
    //renderTexture=game.add.renderTexture(200,200,"rt")
70
    //renderTexture.resolution=0.5
71
    renderTexture=game.add.renderTexture(400,400,"rt")
72
    //renderTexture.resolution=0.5
73
    
74
    renderGroup = game.add.group()
75
   // renderGroup.x=650
76
   // renderGroup.y=150
77
78
    
79
    var bg = game.add.graphics(0,0)
80
    bg.beginFill(0,1)
81
    bg.lineStyle(2, 0xFF0000, 1);
82-
    renderSprite.x=0
82+
83-
    renderSprite.y=0    
83+
84
    renderGroup.add(bg)
85
    
86-
    mask.lineStyle(2, 0xFF0000, 1);
86+
87
    renderSprite.scale.set(0.25)
88
    renderSprite.width=200
89
    renderSprite.height=200
90-
    mask.cacheAsBitmap=true
90+
91
    
92
    renderSprite.anchor.set(0.5)
93
    
94
    
95
    renderGroup.add(renderSprite)
96
    
97
    var mask = game.add.graphics(0, 0);
98
    //mask.lineStyle(2, 0xFF0000, 1);
99
    mask.beginFill(0xFF0000,0.1)
100
    mask.drawCircle(0,0,200,200);    
101
    mask.endFill()
102
    //mask.cacheAsBitmap=true // breaks mask
103
    renderGroup.add(mask)
104
    renderSprite.mask=mask;
105
106
    var outline = game.add.graphics(0, 0);
107
    outline.lineStyle(2, 0xFF0000, 1);
108
    //outline.beginFill(0xFF0000,0.1)
109
    outline.drawCircle(0,0,200,200);    
110
    outline.endFill()
111
    renderGroup.add(outline)
112
113
    renderGroup.cameraOffset.x=650
114
    renderGroup.cameraOffset.y=150
115
    renderGroup.fixedToCamera=true
116
    renderTexture.render(layer, 0,0,true)
117
118
119
}
120
121
function update() {
122
123
    if (cursors.left.isDown)
124
    {
125
        player.body.rotateLeft(100);
126
    }
127
    else if (cursors.right.isDown)
128
    {
129
        player.body.rotateRight(100);
130
    }
131
    else
132
    {
133
        player.body.setZeroRotation();
134
    }
135
136
    if (cursors.up.isDown)
137
    {
138
        player.body.thrust(400);
139
    }
140
    else if (cursors.down.isDown)
141
    {
142
        player.body.reverse(400);
143
    }
144
145
146
    w = layer.width
147
    h = layer.height
148
    
149
    // crop layer for render
150
    layer.setFrame({x:Math.max(0,player.x-game.camera.x)-200,y:Math.max(0,player.y-game.camera.y)-200,width:400,height:400})
151
    //layer.setFrame({x:player.x, y:player.y, width:400, height:400})
152
    m = new PIXI.Matrix()
153
    renderSprite.angle=-player.angle
154
    // reset layer to original dimensions
155
    renderTexture.render(layer, m, true)
156
    layer.setFrame({x:0, y:0, width:w, height:h})
157
158
}
159
160
function render() {
161
}