AS3: Tile based movement system - actionscript-3

very new to as3 and using a tutorial found here to try my hand at tile based movement. However, i cant seem to get the code to work. I keep getting the error code:
"1046: Type was not found or was not a compile-time constant:hero."
The line it is reference is:
var character: hero = new hero();
My full code is:
package {
import flash.display.MovieClip;
import flash.events.*;
public class main2 extends MovieClip {
var hero;
public function main2() {
// Create map
var mapWidth = 10;
var mapHeight = 10;
var tileSide = 32;
var totalTiles = mapWidth * mapHeight;
var myMap: Array = [
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 1, 1, 0, 1],
[1, 0, 0, 0, 0, 0, 1, 0, 0, 1],
[1, 0, 0, 1, 0, 0, 1, 0, 0, 1],
[1, 0, 0, 1, 1, 1, 1, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
];
for (var i: int = 0; i < mapHeight; i++) {
for (var u: int = 0; u < mapWidth; u++) {
var cell: MovieClip = new tile();
cell.gotoAndStop(myMap[i][u] + 1);
cell.x = tileSide * u;
cell.y = tileSide * i;
addChild(cell);
}
}
// Hero management
var heroSpawnX = 4;
var heroSpawnY = 2;
var character: hero = new hero();
addChild(character);
character.x = heroSpawnX * tileSide;
character.y = heroSpawnY * tileSide;
var heroX = heroSpawnX;
var heroY = heroSpawnY;
// Basic movement
stage.addEventListener(KeyboardEvent.KEY_DOWN, movement);
function movement(event: KeyboardEvent):void {
if (event.keyCode == 40 && myMap[heroY + 1][heroX] == 0) {
character.gfx.rotation = 0;
character.y += tileSide;
heroY++;
}
if (event.keyCode == 38 && myMap[heroY - 1][heroX] == 0) {
character.gfx.rotation = 180;
character.y -= tileSide;
heroY--;
}
if (event.keyCode == 39 && myMap[heroY][heroX + 1] == 0) {
character.gfx.rotation = 270;
character.x += tileSide;
heroX++;
}
if (event.keyCode == 37 && myMap[heroY][heroX - 1] == 0) {
character.gfx.rotation = 90;
character.x -= tileSide;
heroX--;
}
}
}
}
}
Any help on this issue would be great, been at it for an hour now.
also if you have any recommendations on as3 resources please let me know...specifically tiled based systems.
thanks is advanced.

That error means your class Hero is not found. you should put the hero.as file at where your main2.as file is(at same location as main2.as). and then import it:
import Hero;
 
and my recommendation on as3 resources:
1.http://republicofcode.com:I think best site for starting as3.I started from it.
2.http://kirupa.com: a good site with a lot of articles
3.http://flashandmath.com: for professionals
and don't forget Adobe ActionScript-3 API reference:
http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/
I   H☺ P E   this helps !

Related

Walkable areas in html5 canvas game

what type of method would i use to make my character walkable on only certain areas? I don't really need the code just the most efficient way on how I should do it, thanks.
1: You can to crete a matrix with 0s and 1s. Your character can move in 1 and don't in 0. this is very suitable to top view games. Codepen
window.onload = function(){
canvas = document.getElementById("canvas");
ctx = canvas.getContext("2d");
matrix = [[0, 0, 0, 0, 0] , [1, 0, 0, 1, 1] , [1, 1, 1, 1, 1] , [1, 0, 1, 1, 1] , [1, 0, 1, 1, 1] ];
character = {x: 0, y : 1}
window.requestAnimationFrame(function(){_print()});
window.addEventListener('keypress', function(e){
console.log(e.key, character)
if( e.key == 'd'){
if((character.x < 4) && (matrix[character.y][character.x+1]==1))
character.x++;
}else if(e.key == 'w'){
if((character.y>0) && (matrix[character.y-1][character.x]==1))
character.y--;
}else if(e.key == 'a'){
if( (character.x > 0) && (matrix[character.y][character.x-1]==1))
character.x--;
}else if( e.key == 's'){
if( (character.y < 4) && (matrix[character.y+1][character.x]==1))
character.y++;
}
});
};
printMap = function(matrix){
for(let i =0; i < matrix.length; i++){
for(let j =0; j < matrix[i].length; j++){
if(matrix[i][j]===0){
ctx.fillStyle = "#F00";
}else{
ctx.fillStyle = "#FF0";
}
ctx.beginPath();
ctx.rect( j * 100, i * 100, 100, 100);
ctx.fill();
}
}
}
printCharacter = function(character){
ctx.fillStyle = "#000";
ctx.beginPath();
ctx.rect( character.x * 100 + 10, character.y * 100 + 10, 80, 80);
ctx.fill();
}
clearMap = function(){
ctx.clearRect(0,0,500,500);
}
_print = function(){
clearMap();
printMap(matrix);
printCharacter( character);
window.requestAnimationFrame(function(){
_print();
});
}
2: You can make a verification of color pixels, with data Imagem. Your character don't can move in a predefined color. (https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/getImageData)
3: You can use psychic framework like box2d. (http://box2d-js.sourceforge.net/)

How to use Matrix3D.appendTranslation()?

With stage 3d I set up a basic triangle, and I can use append rotation and append scale and everything works, but using append translation on the z axis, the triangle will dissapear with the translation being 1 or higher. With other shapes it would dissapear with only 3 or higher. And it doesn't look like the triangle is getting any smaller/farther away between 0 and 0.9 translation. The translation on the x and y axis do work though.
Here are my shader codes:
private static const VERTEX_SHADER_SOURCE:String = "m44 op, va0, vc1";
private static const FRAGMENT_SHADER_SOURCE:String = "mov oc, fc0";
my render loop:
addEventListener(Event.ENTER_FRAME, enter);
var t:Number=0;
function enter():void {
context3D.clear();
context3D.setProgram(program);
var m:Matrix3D = new Matrix3D;
m.appendTranslation(0, 0, t);
t+=0.01;
context3D.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX, 1, m, true);
context3D.setVertexBufferAt(0, buffer, 0, Context3DVertexBufferFormat.FLOAT_3);
context3D.setProgramConstantsFromVector(Context3DProgramType.FRAGMENT, 0, color);
context3D.drawTriangles(indexBuffer);
context3D.present();
}
my full code:
var assembler:AGALMiniAssembler = new AGALMiniAssembler();
assembler.assemble(Context3DProgramType.VERTEX, VERTEX_SHADER_SOURCE);
if (assembler.error) {
trace("vertex shader error " +assembler.error);
return;
}
var vertexShaderByteCode:ByteArray = assembler.agalcode;
assembler.assemble(Context3DProgramType.FRAGMENT, FRAGMENT_SHADER_SOURCE);
if (assembler.error) {
trace("fragment shader error " + assembler.error);
return;
}
var fragmentShaderByteCode:ByteArray = assembler.agalcode;
var program:Program3D = context3D.createProgram();
try {
program.upload(vertexShaderByteCode, fragmentShaderByteCode);
}
catch (err:Error) {
trace("couldnt upload shader program" + err);
return;
}
color = new <Number>[0.9296875, 0.9140625, 0.84765625, 1];
var verts:Vector.<Number> = Vector.<Number>([
0.5, 0, 0,
-0.5, 0, 0,
0, 0.5, 0
]);
var buffer:VertexBuffer3D = context3D.createVertexBuffer(3, 3);
buffer.uploadFromVector(verts, 0, 3);
var indices:Vector.<uint> = Vector.<uint>([0, 1, 2])
var indexBuffer:IndexBuffer3D = context3D.createIndexBuffer(3);
indexBuffer.uploadFromVector(indices, 0, 3);
addEventListener(Event.ENTER_FRAME, enter);
var t:Number=0;
function enter():void {
context3D.clear();
context3D.setProgram(program);
var m:Matrix3D = new Matrix3D;
m.appendTranslation(0, 0, t);
t+=0.01;
context3D.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX, 1, m, true);
context3D.setVertexBufferAt(0, buffer, 0, Context3DVertexBufferFormat.FLOAT_3);
context3D.setProgramConstantsFromVector(Context3DProgramType.FRAGMENT, 0, color);
context3D.drawTriangles(indexBuffer);
context3D.present();
}

as3 starling tile array

Im trying to make a tile array system using flashDevelop and starling.
I think i complete that but i dont understand how i make bounds,intersects between the tile array and my hero.
Note that i make it using tutorials around the internet and not along.
Here are the 2 classes
public class level1 extends Sprite
{
public var map:Array = [
[1, 1, 1, 1, 1, 1],
[1, 0, 0, 0, 0],
[1, 0, 0, 0, 1],
[1, 0, 0, 0, 1],
[1, 0, 0, 0, 1],
[1, 0, 0, 0, 1],
[1, 0, 0, 0, 1],
[1, 0, 0, 0, 1],
[1, 1, 1, 1, 1],
];
//public var object:Image;
//public var data:int;
public function level1()
{
super();
this.addEventListener(starling.events.Event.ADDED_TO_STAGE, onAdd);
}
private function onAdd(event:Event):void
{
drawScreen(map, 90);
}
public function drawScreen(map:Array, cellSize:int = 90):void
{
for(var row:int = 0; row < map.length; row++)
{
for(var column:int = 0; column < map[row].length; column++)
{
var data:int = map[row][column];
// Empty tile, move onto the next item.
if(data == 0) continue;
var object:Image;
if (data == 1) object = new Image(Assets.getTexture("ESAYBTN"));
if (data == 2) object = new Image(Assets.getTexture("TITLE"));
if(object != null)
{
object.x = column * 94;
object.y = row * 29;
stage.addChild(object);
}
}
}
}
}
public class inGame extends Sprite
{
public var Hero:heroClass;
private var enem2:enemy2Class;
private var enemiesArray:Vector.<enemy2Class>;
private var posX:int;
private var posY:int;
private var hitpoints:int;
private var _level1:level1;
public function inGame()
{
super();
this.addEventListener(starling.events.Event.ADDED_TO_STAGE, onAdd);
}
private function onAdd(event:Event):void
{
this.removeEventListener(Event.ADDED_TO_STAGE, onAdd);
enemiesArray = new Vector.<enemy2Class>();
drawScreen();
}
private function drawScreen():void
{
Hero = new heroClass(50, 50, 1);
this.addChild(hero);
_level1 = new level1();
this.addChild(_level1);
createenemies(450, 50, 6);
createenemies(400, 50, 5);
createenemies(350, 50, 4);
createenemies(300, 50, 3);
createenemies(250,50, 2);
}
public function createenemies(posX:int, posY:int, hitpoints:int):void
{
var enemies:enemy2Class = new enemy2Class(posX,posY,hitpoints);
this.addChild(enemies);
enemiesArray.push(enemies);
}
public function hideInGame():void
{
this.visible = false;
}
public function showInGame():void
{
this.visible = true;
this.addEventListener(Event.ENTER_FRAME, gameLoop);
}
private function gameLoop(Event):void
{
var enemiestoloop:enemy2Class;
for (var i:uint = 0; i < enemiesArray.length; i++)
{
enemiestoloop = enemiesArray[i];
//enemiestoloop.x-=2;
if (enemiestoloop.bounds.intersects(enem.bounds))
{
enemiestoloop.x = 400;
enemiestoloop._hitpoints--;
}
if (enemiestoloop._hitpoints <= 0)
{
enemiesArray.splice(i, 1);
this.removeChild(enemiestoloop);
}
}
hero.y++;
if(hero.bounds.intersects("here goes the map???"))
{
hero.y--;
}
}
}
So how i write if the hero hit the map array object 1?
Add all the parts of the tile array to a single display object then just call intersects bounds on the single display object.

as3 Tile game - If character steps over tile, do something

So im working on a tile game for school and not very familiar with programming so apologies if the answer is obvious.
Using an array ive created a map with different tiles- what i want is so that when the character walks across a certain array then something happens - eg: restart the game
My code is all in one .as file :
package {
import flash.display.MovieClip;
import flash.events.*;
public class main2 extends MovieClip {
public function main2() {
// Create map
var mapWidth = 10;
var mapHeight = 10;
var tileSide = 32;
var totalTiles = mapWidth * mapHeight;
var myMap: Array = [
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
[1, 0, 0, 0, 2, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 0],
[1, 0, 0, 0, 0, 3, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
[1, 1, 1, 1, 1, 1, 1, 1, 1, 1]
];
for (var i: int = 0; i < mapHeight; i++) {
for (var u: int = 0; u < mapWidth; u++) {
var cell: MovieClip = new tile();
cell.gotoAndStop(myMap[i][u] + 1);
cell.x = tileSide * u
cell.y = tileSide * i
addChild(cell);
}
}
// Hero management
var heroSpawnX = 1
var heroSpawnY = 1
var character: hero = new hero();
addChild(character)
character.x = heroSpawnX * tileSide
character.y = heroSpawnY * tileSide
var heroX = heroSpawnX
var heroY = heroSpawnY
// Basic movement
stage.addEventListener(KeyboardEvent.KEY_DOWN, movement);
function movement(event: KeyboardEvent): void {
if (event.keyCode == 40 && myMap[heroY + 1][heroX] != 1) {
character.gfx.rotation = 0
character.y += tileSide
heroY++ //Down
}
if (event.keyCode == 38 && myMap[heroY - 1][heroX] != 1) {
character.gfx.rotation = 180
character.y -= tileSide
heroY-- //Up
}
if (event.keyCode == 39 && myMap[heroY][heroX + 1] != 1) {
character.gfx.rotation = 270
character.x += tileSide
heroX++ //Right
}
if (event.keyCode == 37 && myMap[heroY][heroX - 1] != 1) {
character.gfx.rotation = 90
character.x -= tileSide
heroX-- //Left
}
} //movement function
} // behind this line
}
}
In my array there is a '2' in the second row. I want my character to walk across that tile and 'die'- but more just restart from his spawn postion ([1][1]). I assume an event listener would be needed but after googleing some codes- still can not get it to work.
Thanks in advance for any help
add these pieces to your code:
this function returns the number of the specified tile:
function getNumberAt(tileX:uint,tileY:uint){
var value:uint=myMap[tileX][tyleY];
return value
}
note that your indices for this function should start from zero( if you want tile at first horizontal and second vertical,you should getNumberAt(0,1)
now replace your function:
function movement(event: KeyboardEvent): void {
if (event.keyCode == 40 && myMap[heroY + 1][heroX] != 1) {
character.gfx.rotation = 0
character.y += tileSide
heroY++ //Down
}
if (event.keyCode == 38 && myMap[heroY - 1][heroX] != 1) {
character.gfx.rotation = 180
character.y -= tileSide
heroY-- //Up
}
if (event.keyCode == 39 && myMap[heroY][heroX + 1] != 1) {
character.gfx.rotation = 270
character.x += tileSide
heroX++ //Right
}
if (event.keyCode == 37 && myMap[heroY][heroX - 1] != 1) {
character.gfx.rotation = 90
character.x -= tileSide
heroX-- //Left
}
trace(getNumberAt(heroX,heroY))//test getNumberAt function
if(getNumberAt(heroX,heroY)==2){
//type your code for death here
}
}
I  h☻p e  this helps !

Proper way to apply translation to vertices

I have the simple vertex shader:
m44 op, va0, vc0
mov v0, va1
and the fragment shader:
mov oc, v0
I pass this vertices to it:
x y z w r g b
-0.3, -0.3, 0, 1, 1, 0, 0,
0, 0.3, 0, 1, 0, 1, 0,
0.3, -0.3, 0, 1, 0, 0, 1
The result triangle looks like I expected. Now I want to apply some translation to the result triangle. I have declared a matrix, call appendTranslation(0.2, 0, 0) and pass it to the vertex shader. The problem is that the triangle remained in the same position but with different vertices position. It looks like this:
Why I got this result, and what is the proper way to apply translation to vertices?
Here is full code of my program:
package tests
{
import com.adobe.utils.AGALMiniAssembler;
import flash.display.Sprite;
import flash.display3D.Context3D;
import flash.display3D.Context3DProgramType;
import flash.display3D.Context3DRenderMode;
import flash.display3D.Context3DVertexBufferFormat;
import flash.display3D.IndexBuffer3D;
import flash.display3D.Program3D;
import flash.display3D.VertexBuffer3D;
import flash.events.Event;
import flash.geom.Matrix3D;
import flash.utils.ByteArray;
[swf(width="500", height="500")]
public class Stage3dTest extends Sprite
{
private var _context:Context3D;
private var _vertexBuffer:VertexBuffer3D;
private var _indexBuffer:IndexBuffer3D;
private var _program:Program3D;
private var _mat:Matrix3D;
public function Stage3dTest() {
if (stage) {
onAddedToStage();
} else {
addEventListener(Event.ADDED_TO_STAGE, onAddedToStage);
}
}
private function onAddedToStage(event:Event = null):void {
this.stage.stage3Ds[0].addEventListener(Event.CONTEXT3D_CREATE, onStage3dContext3DCreate);
this.stage.stage3Ds[0].requestContext3D(Context3DRenderMode.SOFTWARE);
}
private function onStage3dContext3DCreate(event:Event):void {
_mat = new Matrix3D();
_mat.appendTranslation(0.2, 0, 0);
_context = this.stage.stage3Ds[0].context3D;
_context.configureBackBuffer(500, 500, 0, false);
_vertexBuffer = _context.createVertexBuffer(3, 7);
_indexBuffer = _context.createIndexBuffer(3);
var p:Number = 0.3;
var vertexData:Vector.<Number> = new <Number>[
-p, -p, 0, 1, 1, 0, 0,
0, p, 0, 1, 0, 1, 0,
p, -p, 0, 1, 0, 0, 1
];
_vertexBuffer.uploadFromVector(vertexData, 0, 3);
_indexBuffer.uploadFromVector(new <uint>[0, 1, 2], 0, 3);
createAndCompileProgram();
addEventListener(Event.ENTER_FRAME, onEnterFrame);
}
private function createAndCompileProgram():void {
_program = _context.createProgram();
var assembler:AGALMiniAssembler = new AGALMiniAssembler();
var code:String = "";
code += "m44 op, va0, vc0\n"+
"mov v0, va1\n";
var vertexShader:ByteArray = assembler.assemble(Context3DProgramType.VERTEX, code);
code = "mov oc, v0\n";
var fragmentShader:ByteArray = assembler.assemble(Context3DProgramType.FRAGMENT, code);
_program.upload(vertexShader, fragmentShader);
}
private function onEnterFrame(event:Event):void {
_context.clear(0.9, 0.9, 0.9, 1);
_context.setProgram(_program);
_context.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX, 0, _mat);
_context.setVertexBufferAt(0, _vertexBuffer, 0, Context3DVertexBufferFormat.FLOAT_4);
_context.setVertexBufferAt(1, _vertexBuffer, 4, Context3DVertexBufferFormat.FLOAT_3);
_context.drawTriangles(_indexBuffer);
_context.present();
}
}
}
You need to transpose a matrix. You can do it manually or you can pass a parameter here:
_context.setProgramConstantsFromMatrix(Context3DProgramType.VERTEX, 0, _mat, true);