Jump to content

Rotating map example


irei1as

Recommended Posts

To use this you need this c++ code addition (it's already merged with the current development branch):

https://github.com/GarageGames/Torque3D/pull/1608/files


I'm using the "Full Template" with this example.

This example is for directX as I don't know much glsl, sorry.


Create the file "mapFunctions.cs" with this content:

//Post effect functionality

singleton ShaderData( mapshader )
{   
  DXVertexShaderFile   = "./mapV.hlsl";
  DXPixelShaderFile    = "./mapP.hlsl";

  //if you have the glsl code
  //OGLVertexShaderFile = "./mapV.glsl";
  // OGLPixelShaderFile = "./mapP.glsl";

  samplerNames[0] = "$map";
  samplerNames[1] = "$mask";

  pixVersion = 2.0;
};

singleton GFXStateBlockData( mapstateblock )
{
  samplersDefined = true;
  samplerStates[0] = SamplerClampLinear;
  samplerStates[1] = SamplerClampLinear;
};

singleton PostEffect( MapTest )
{
  isEnabled = false;
  shader = mapshader;
  stateBlock = mapstateblock;
  texture[0] = "./map";
  texture[1] = "./mask";
  target = "#maptexture";
};

function MapTest::preProcess(%this)
{
  //here we can change the textures if needed of the map and the mask

  //switch($differentmaps)
  //{
  //   case 0:
  //      %this.setTexture(0, "./map");
  //   case 1:
  //      %this.setTexture(0, "./map1");
  //   case 2:
  //      %this.setTexture(0, "./map2");
  //}

  //switch($differentmasks) {...}
  //use %this.setTexture(1, "./mask#") instead
}

function getRotationAngleForMap()
{
  //returns point2f the cosine and sine of the angle of rotation, 0º is up=north, 90º means up=east
  %eyevector=LocalClientConnection.player.getEyeVector();
  %angle=mAtan(%eyevector.x,%eyevector.y);
  return mCos(%angle) SPC mSin(%angle);
}

function getMapCenter()
{
  %pos=LocalClientConnection.player.getPosition();
  return %pos.x SPC %pos.y;
}

function getMapCorners()
{
  //returns point4f the position of the top-left and bottom-right in torque units of the map
  //(x,y) is the x and y position of the top left and (z,w) are the x and y position of the bottom right

  //switch($differentmaps)
  //{
  //   case 0:
  //      return "0 20 20 0";
  //   case 1:
  //      return "40 620 220 500";
  //   case 2:
  //      return "33.12 68.2 87.15 17.9";
  //   //etc
  //}

  //example
  return "-6 15 71 -52";
}

function getMapSizes()
{
  //returns point2f the range in torque units (x,y) that is showed in the gui

  //switch($differentmaps)
  //{
  //   case 0:
  //      return "10 10";
  //   case 1:
  //      return "30 45";
  //   case 2:
  //      return "8 18";
  //   //etc
  //}

  //example
  return "20 10";
}

function MapTest::setShaderConsts(%this)
{
  %this.setShaderConst( "$cossin", getRotationAngleForMap() );
  %this.setShaderConst( "$centerpos", getMapCenter() );
  %this.setShaderConst( "$mapcorners", getMapCorners() );
  %this.setShaderConst( "$guisizes", getMapSizes() );
}

//Functions to display the map
function enableMapDisplay()
{
  if(!isObject(MissionCleanup))
  {
     echo("No MissionCleanup detected. You need to start a level.");
     return;
  }
  if(isObject(MapDisplayCleaner))
     return; //already enabled

  MapTest.enable();
  %scriptObject = new ScriptObject(MapDisplayCleaner){
  };
  MissionCleanup.add(%scriptObject);
  %guidisplay = new GuiBitmapCtrl(MapDisplayBitmap) {
     wrap = "0";
     position = "490 22";
     extent = "130 130";
     horizSizing = "right";
     vertSizing = "bottom";
     visible = "1";
  };
  %playguiProbably = Canvas.getContent();
  %playguiProbably.add(%guidisplay);
  %scriptticker = new ScriptTickObject(MapDisplayUpdater){
     callOnAdvanceTime=1;
  };
  MissionCleanup.add(%scriptticker);
}

function disableMapDisplay()
{
  MapTest.disable();
  MapDisplayCleaner.delete();
  mapDisplayUpdater.delete();
}

function MapDisplayUpdater::onAdvanceTime(%this,%delta)
{
  MapDisplayBitmap.setNamedTexture("maptexture");
}

function MapDisplayCleaner::onRemove(%this)
{
  MapDisplayBitmap.delete();
  MapTest.disable();
}

 

Remember you need to "exec" that file somewhere.


Now to the same folder add these files:

-First make "mapV.hlsl" (note: ANSI file)

struct VertToPix
{
  float4 hpos       : POSITION;
  float2 uv        : TEXCOORD0;
};

VertToPix main( VertToPix In )
{
  VertToPix Out = In;
  return Out;
}

 

-Second create "mapP.hlsl" (note: ANSI file)

uniform sampler2D map : register(S0);
uniform sampler2D mask : register(S1);

uniform float2 cossin;
uniform float2 centerpos;
uniform float4 mapcorners;
uniform float2 guisizes;

float4 main( float2 texcoord : TEXCOORD0 ) :COLOR
{
  float2x2 baserot = float2x2(cossin.x,-cossin.y,cossin.y,cossin.x);

  float2 rotmap;
  float2 delta = float2((mapcorners.z-mapcorners.x),(mapcorners.w-mapcorners.y));
  rotmap = (centerpos-mapcorners.xy)/delta + mul(baserot,(texcoord-0.5)*guisizes/float2(delta.x,-delta.y));

  float4 color1 = tex2D(map, rotmap);
  color1.a=(tex2D(mask, texcoord)).a;
  return color1;
} 

 

-Then download this image and rename it "map.png"

http://i.imgur.com/R1LCLG8.png


-Also rename to "mask.png" this one:

http://i.imgur.com/TCUL2vU.png


(So, in the same folder you have mapFunctions.cs, mapV.hlsl, mapP.hlsl, map.png and mask.png.)

Now run the game, start a level and use in the console:

enableMapDisplay();
LocalClientConnection.player.setPosition("13 -5 250");

Now walk around to see the map move with you.

http://i.imgur.com/SxnZpDY.png


The comments in the script should give you hints on how to change the values for your needs.


Some notes:

The images should be png format.

The map will display better if all the outer ring of pixels is a constant colour (transparent works, too).

For the mask, opaque pixels display image.

Here you have the five files of the example in a zip: http://www.mediafire.com/download/mzu23u3323q3821/map.zip

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...