KNI Engine Blazor

Hi all,

I installed KNI Engine today and tried the Blazor template which I got working.

How can I debug the application? Because I could compile and then in the browser it crashed.

thanks!

Some errors will not show up in Visual studio.
In chrome press F12 and you could see more helpful error messages in the JS console.

Did you got a crash out of a new project?

Ok I will try that. I already figured out what caused it to crash. I got a purple background when it happened. First I thought it had to do with the content but it crashed because of two things which I tried to do. First thing was GraphicsProfile.HighDef and second thing was IndexElementSize.ThirtyTwoBits when creating a new IndexBuffer. After I changed that, everything worked fine. Here is the code that works now, if anyone is interested:

    public class BlazorWasmGame1Game : Game
    {
        private GraphicsDeviceManager graphics;
        private SpriteBatch spriteBatch;
        //
        private Effect effect;
        private Texture2D texture;
        private Matrix baseWorld;
        private Matrix world;
        private Matrix view;
        private Matrix projection;
        private IndexBuffer indexBuffer;
        private VertexBuffer vertexBuffer;
        private VertexPositionColorTexture[] vertices;
        private short[] indices;
        
        public BlazorWasmGame1Game()
        {
            graphics = new GraphicsDeviceManager(this);
            graphics.GraphicsProfile = GraphicsProfile.Reach;
            Content.RootDirectory = "Content";
            IsMouseVisible = true;
        }

        protected override void Initialize()
        {
            base.Initialize();
        }

        protected override void LoadContent()
        {
            spriteBatch = new SpriteBatch(GraphicsDevice);

            effect = Content.Load<Effect>("effect");
            texture = Content.Load<Texture2D>("texture");

            vertexBuffer = new VertexBuffer(GraphicsDevice, VertexPositionColorTexture.VertexDeclaration, 4, BufferUsage.WriteOnly);
            indexBuffer = new IndexBuffer(GraphicsDevice, IndexElementSize.SixteenBits, 6, BufferUsage.WriteOnly);

            vertices = new VertexPositionColorTexture[4];
            indices = new short[6];

            float size = 0.5f;

            vertices[0] = new VertexPositionColorTexture(new Vector3(-size, +size, 0), Color.White, new Vector2(0, 0));
            vertices[1] = new VertexPositionColorTexture(new Vector3(+size, +size, 0), Color.White, new Vector2(1, 0));
            vertices[2] = new VertexPositionColorTexture(new Vector3(+size, -size, 0), Color.White, new Vector2(1, 1));
            vertices[3] = new VertexPositionColorTexture(new Vector3(-size, -size, 0), Color.White, new Vector2(0, 1));

            indices[0] = 0;
            indices[1] = 3;
            indices[2] = 2;
            indices[3] = 2;
            indices[4] = 1;
            indices[5] = 0;

            vertexBuffer.SetData(vertices);
            indexBuffer.SetData(indices);

            baseWorld = Matrix.CreateScale(5.0f) * Matrix.CreateTranslation(2.0f * Vector3.Forward);
            world = Matrix.Identity;
            view = Matrix.CreateLookAt(Vector3.Zero, Vector3.Forward, Vector3.Up);
            projection = Matrix.CreatePerspective(4.0f * GraphicsDevice.Viewport.AspectRatio, 4.0f, 1.0f, 1000.0f);
        }

        protected override void Update(GameTime gameTime)
        {
            KeyboardState keyboardState = Keyboard.GetState();

            if (keyboardState.IsKeyDown(Keys.Escape) ||
                keyboardState.IsKeyDown(Keys.Back))
            {
                try { Exit(); }
                catch (PlatformNotSupportedException ex) { }
            }

            UpdateAnimation(gameTime);

            base.Update(gameTime);
        }

        private void UpdateAnimation(GameTime gameTime)
        {
            float radians = (float)(Math.Sin(gameTime.TotalGameTime.TotalSeconds * 2));
            world = Matrix.CreateRotationZ(radians);
        }

        protected override void Draw(GameTime gameTime)
        {
            GraphicsDevice.Clear(Color.MonoGameOrange);

            DrawQuad(gameTime);

            base.Draw(gameTime);
        }

        private void DrawQuad(GameTime gameTime)
        {
            float time = (float)gameTime.ElapsedGameTime.TotalSeconds;
            GraphicsDevice.RasterizerState = RasterizerState.CullNone;

            GraphicsDevice.Indices = indexBuffer;
            GraphicsDevice.SetVertexBuffer(vertexBuffer);

            effect.Parameters["World"]?.SetValue(baseWorld * world);
            effect.Parameters["View"]?.SetValue(view);
            effect.Parameters["Projection"]?.SetValue(projection);
            effect.Parameters["Texture"]?.SetValue(texture);
            effect.Parameters["Time"]?.SetValue(time);

            foreach (EffectPass pass in effect.CurrentTechnique.Passes)
            {
                pass.Apply();
                GraphicsDevice.DrawIndexedPrimitives(PrimitiveType.TriangleList, 0, 0, 2);
            }
        }
    }

And the effect:

#if OPENGL
#define SV_POSITION POSITION
#define VS_SHADERMODEL vs_3_0
#define PS_SHADERMODEL ps_3_0
#else
#define VS_SHADERMODEL vs_4_0_level_9_1
#define PS_SHADERMODEL ps_4_0_level_9_1
#endif

float4x4 World;
float4x4 View;
float4x4 Projection;

float Time;

texture Texture;
sampler TextureSampler = sampler_state
{
    texture = <Texture>;
    magfilter = LINEAR;
    minfilter = LINEAR;
    mipfilter = LINEAR;
    AddressU = WRAP;
    AddressV = WRAP;
};

struct VertexShaderInput
{
    float4 Position : SV_POSITION;
    float4 Color : COLOR0;
    float2 UV : TEXCOORD0;
};
 
struct VertexShaderOutput
{
    float4 Position : SV_POSITION;
    float4 Color : COLOR0;
    float2 UV : TEXCOORD0;
};
 
struct PixelShaderOutput
{
    float4 Color : SV_TARGET;
};

VertexShaderOutput VertexShaderFunction(VertexShaderInput input)
{
    VertexShaderOutput output = (VertexShaderOutput) 0;
     
    float4 worldPosition = mul(input.Position, World);
    float4 viewPosition = mul(worldPosition, View);
    float4 projectionPosition = mul(viewPosition, Projection);
    output.Position = projectionPosition;

    output.Color = input.Color;

    output.UV = input.UV;
 
    return output;
}
 
PixelShaderOutput PixelShaderFunction(VertexShaderOutput input)
{
    PixelShaderOutput output;
 
    output.Color = input.Color * tex2D(TextureSampler, input.UV);
 
    return output;
}
 
technique Technique1
{
    pass Pass1
    {
        VertexShader = compile VS_SHADERMODEL VertexShaderFunction();
        PixelShader = compile PS_SHADERMODEL PixelShaderFunction();
    }
}

Just put a texture as Content into the project and it should work.

2 Likes

Anybody knows of free webhosting alternatives for a MonoGame Blazor WASM app?

On Azure static aps are pretty much free i think. Unless your expecting a lot of traffic,l.

1 Like

I have three games hosted on itch.io.
It is free and was straightforward to set up.
Here is one of them:

3 Likes
2 Likes

@nkast just to let you know that my kniengine games on itch have stopped working without any changes from me.

I tried Kwyrky’s one though and that still works.

I put full details on here: