Skip to content

Commit

Permalink
blittest
Browse files Browse the repository at this point in the history
  • Loading branch information
neuroprod committed Nov 15, 2023
1 parent 11aadb8 commit c28b902
Show file tree
Hide file tree
Showing 25 changed files with 832 additions and 120 deletions.
73 changes: 55 additions & 18 deletions frontend/src/CanvasRenderPass.ts
Original file line number Diff line number Diff line change
Expand Up @@ -8,53 +8,90 @@ import ModelRenderer from "./lib/model/ModelRenderer";
import UI from "./lib/UI/UI";
import Blit from "./lib/Blit";
import Material from "./lib/core/Material";
import BlitShader from "./shaders/BlitShader";
import ImagePreloader from "./ImagePreloader";
import DebugTextureShader from "./shaders/DebugTextureShader";
import SelectItem from "./lib/UI/math/SelectItem";
import {Vector2} from "math.gl";
import {IResizable} from "./lib/IResizable";

export default class extends RenderPass {
private canvasColorTarget: RenderTexture;
export default class extends RenderPass implements IResizable {
public canvasColorAttachment: ColorAttachment;
private canvasDepthTarget: RenderTexture;
public modelRenderer: ModelRenderer;
private canvasColorTarget: RenderTexture;
private canvasDepthTarget: RenderTexture;
private blitMaterial: Material;
private blitTest: Blit;

private passSelect: Array<SelectItem> = []
private currentValue = {texture: "kka", type: 0}

constructor(renderer: Renderer) {

constructor(renderer:Renderer) {

super(renderer,"canvasRenderPass");
super(renderer, "canvasRenderPass");
this.sampleCount = 4

this.modelRenderer =new ModelRenderer(renderer)
this.modelRenderer = new ModelRenderer(renderer)

this.canvasColorTarget = new RenderTexture(renderer, "canvasColor", {
format: renderer.presentationFormat,
sampleCount: 4,
sampleCount: this.sampleCount,
scaleToCanvas: true,

usage: GPUTextureUsage.RENDER_ATTACHMENT
});
this.canvasColorAttachment = new ColorAttachment(this.canvasColorTarget);
this.colorAttachments =[this.canvasColorAttachment];
this.colorAttachments = [this.canvasColorAttachment];

this.canvasDepthTarget = new RenderTexture(renderer, "canvasDepth", {
this.canvasDepthTarget = new RenderTexture(renderer, "canvasDepth", {
format: TextureFormat.Depth16Unorm,
sampleCount: 4,
sampleCount: this.sampleCount,
scaleToCanvas: true,
usage: GPUTextureUsage.RENDER_ATTACHMENT
});
this.depthStencilAttachment = new DepthStencilAttachment(this.canvasDepthTarget);

this.blitMaterial =new Material(this.renderer,"blit", new BlitShader(this.renderer,"blit"))
this.blitMaterial.uniforms.setTexture("colorTexture",ImagePreloader.getTexture("chair_Color"))
this.blitTest =new Blit(renderer,'blit',this.blitMaterial)
this.blitMaterial = new Material(this.renderer, "blit", new DebugTextureShader(this.renderer, "blit"))
// this.blitMaterial.uniforms.setTexture("colorTexture",ImagePreloader.getTexture("chair_Color"))


this.blitTest = new Blit(renderer, 'blit', this.blitMaterial)

this.passSelect.push(new SelectItem("Light", {texture: "LightPass", type: 0}));
this.passSelect.push(new SelectItem("GColor", {texture: "GColor", type: 0}));
this.passSelect.push(new SelectItem("GMRA", {texture: "GMRA", type: 0}));
this.passSelect.push(new SelectItem("GNormal", {texture: "GNormal", type: 0}));
this.passSelect.push(new SelectItem("GPosition", {texture: "GPosition", type: 0}));
this.passSelect.push(new SelectItem("GDepth", {texture: "GDepth", type: 0}));

let value = this.passSelect[0].value;
this.currentValue = value;
let texture = this.renderer.texturesByLabel[value.texture] as RenderTexture;
this.blitMaterial.uniforms.setTexture("colorTexture", texture)
this.blitMaterial.uniforms.setUniform("textureSize", new Vector2(texture.options.width, texture.options.height))

}
onScreenResize(size:Vector2)
{
this.blitMaterial.uniforms.setUniform("textureSize", size)
}
onUI() {
let value = UI.LSelect("pass", this.passSelect)
if (value != this.currentValue) {
this.currentValue = value;

let texture = this.renderer.texturesByLabel[value.texture] as RenderTexture;
this.blitMaterial.uniforms.setTexture("colorTexture", texture)

}

}

draw() {


this.blitTest.draw(this);
this.modelRenderer.draw(this);

UI.drawGPU(this.passEncoder,true)

UI.drawGPU(this.passEncoder, true)
}

}
91 changes: 91 additions & 0 deletions frontend/src/GBufferRenderPass.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,91 @@
import RenderTexture from "./lib/textures/RenderTexture";
import ColorAttachment from "./lib/textures/ColorAttachment";
import {TextureFormat} from "./lib/WebGPUConstants";
import DepthStencilAttachment from "./lib/textures/DepthStencilAttachment";
import RenderPass from "./lib/core/RenderPass";
import Renderer from "./lib/Renderer";
import ModelRenderer from "./lib/model/ModelRenderer";



export default class extends RenderPass {

public modelRenderer: ModelRenderer;
public colorTarget: RenderTexture;
public depthTarget: RenderTexture;
public normalTarget: RenderTexture;
public mraTarget: RenderTexture;
private colorAttachment: ColorAttachment;
private normalAttachment: ColorAttachment;
private mraAttachment: ColorAttachment;
private positionTarget: RenderTexture;
private positionAttachment: ColorAttachment;


constructor(renderer: Renderer) {

super(renderer, "GbufferRenderPass");

this.modelRenderer = new ModelRenderer(renderer)

this.colorTarget = new RenderTexture(renderer, "GColor", {
format: TextureFormat.RGBA8Unorm,
sampleCount: this.sampleCount,
scaleToCanvas: true,

usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING
});
this.colorAttachment = new ColorAttachment(this.colorTarget);


this.normalTarget = new RenderTexture(renderer, "GNormal", {
format: TextureFormat.RGBA8Unorm,
sampleCount: this.sampleCount,
scaleToCanvas: true,

usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING
});
this.normalAttachment = new ColorAttachment(this.normalTarget);

this.mraTarget = new RenderTexture(renderer, "GMRA", {
format: TextureFormat.RGBA8Unorm,
sampleCount: this.sampleCount,
scaleToCanvas: true,

usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING
});
this.mraAttachment = new ColorAttachment(this.mraTarget);



this.positionTarget = new RenderTexture(renderer, "GPosition", {
format: TextureFormat.RGBA16Float,
sampleCount: this.sampleCount,
scaleToCanvas: true,

usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING
});
this.positionAttachment = new ColorAttachment(this.positionTarget);

this.colorAttachments = [this.colorAttachment, this.normalAttachment, this.mraAttachment, this.positionAttachment];


this.depthTarget = new RenderTexture(renderer, "GDepth", {
format: TextureFormat.Depth16Unorm,
sampleCount: 1,
scaleToCanvas: true,
usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING
});
this.depthStencilAttachment = new DepthStencilAttachment(this.depthTarget);


}

draw() {

this.modelRenderer.draw(this);


}

}
3 changes: 2 additions & 1 deletion frontend/src/GLFTLoader.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import Model from "./lib/model/Model";
import TestShader from "./shaders/TestShader";
import Material from "./lib/core/Material";
import ImagePreloader from "./ImagePreloader";
import GBufferShader from "./shaders/GBufferShader";


type Accessor = {
Expand Down Expand Up @@ -34,7 +35,7 @@ export default class GLFTLoader {
this.renderer = renderer;

this.root = new Object3D(renderer, "sceneRoot");
this.mainShader =new TestShader(this.renderer,"testShader");
this.mainShader =new GBufferShader(this.renderer,"gBufferShader");


preLoader.startLoad();
Expand Down
90 changes: 90 additions & 0 deletions frontend/src/LightRenderPass.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
import RenderPass from "./lib/core/RenderPass";
import ModelRenderer from "./lib/model/ModelRenderer";
import RenderTexture from "./lib/textures/RenderTexture";
import ColorAttachment from "./lib/textures/ColorAttachment";
import Renderer from "./lib/Renderer";
import {LoadOp, StoreOp, TextureFormat} from "./lib/WebGPUConstants";
import DepthStencilAttachment from "./lib/textures/DepthStencilAttachment";
import Model from "./lib/model/Model";
import Material from "./lib/core/Material";
import LightShader from "./shaders/LightShader";
import Sphere from "./lib/meshes/Sphere";
import {Vector2, Vector3, Vector4} from "math.gl";
import {IResizable} from "./lib/IResizable";
import Timer from "./lib/Timer";

export default class extends RenderPass implements IResizable {


public target: RenderTexture;
private colorAttachment: ColorAttachment;
private modelRenderer:ModelRenderer
private shader:LightShader
private material: Material;
private mesh: Sphere;
private model: Model;


constructor(renderer: Renderer) {

super(renderer, "LightRenderPass");
this.target = new RenderTexture(renderer, "LightPass", {
format: TextureFormat.RGBA8Unorm,
sampleCount: this.sampleCount,
scaleToCanvas: true,

usage: GPUTextureUsage.RENDER_ATTACHMENT | GPUTextureUsage.TEXTURE_BINDING
});
this.colorAttachment= new ColorAttachment(this.target);
this.colorAttachments = [this.colorAttachment];


this.depthStencilAttachment = new DepthStencilAttachment(this.renderer.texturesByLabel["GDepth"] as RenderTexture,{ depthLoadOp: LoadOp.Load,
depthStoreOp: StoreOp.Store,
depthReadOnly: true});


this.modelRenderer =new ModelRenderer(renderer)
this.shader =new LightShader(renderer,"lightShader");
this.mesh =new Sphere(renderer);



this.material =new Material(renderer,"testLight",this.shader)
this.material.depthWrite =false;
this.model =new Model(renderer,"testLight");

let radius =3;
let position =new Vector3(-1,1,-2)
this.model.setPosition(position.x,position.y,position.z)
this.model.setScale(radius,radius,radius)
this.model.material =this.material;
this.model.mesh =this.mesh;

this.model.material.uniforms.setUniform("position",new Vector4(position.x,position.y,position.z,radius))

this.material.uniforms.setTexture("gPosition",this.renderer.texturesByLabel["GPosition"])
this.material.uniforms.setTexture("gNormal",this.renderer.texturesByLabel["GNormal"])
this.material.uniforms.setTexture("gMRA",this.renderer.texturesByLabel["GMRA"])
this.material.uniforms.setTexture("gColor",this.renderer.texturesByLabel["GColor"])
this.modelRenderer.addModel(this.model);


}
onScreenResize(size: Vector2) {
this.material.uniforms.setUniform("textureSize",new Vector2(this.renderer.width,this.renderer.height))
}

update()
{
let position =new Vector3(Math.sin(Timer.time)*2.0,Math.cos(Timer.time*0.5),-2+Math.cos(Timer.time*0.3)*0.5)
this.model.setPosition(position.x,position.y,position.z)
this.model.material.uniforms.setUniform("position",new Vector4(position.x,position.y,position.z,3))
}
draw() {

this.modelRenderer.draw(this);


}
}
Loading

0 comments on commit c28b902

Please sign in to comment.