Skip to content

Commit

Permalink
feat: lesson7
Browse files Browse the repository at this point in the history
  • Loading branch information
xiaoiver committed Apr 25, 2024
1 parent 29b690f commit caef2b1
Show file tree
Hide file tree
Showing 34 changed files with 834 additions and 627 deletions.
24 changes: 12 additions & 12 deletions packages/lesson_002/src/plugins/Renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -77,6 +77,18 @@ export class Renderer implements Plugin {
width * devicePixelRatio,
height * devicePixelRatio,
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width: width * devicePixelRatio,
height: height * devicePixelRatio,
usage: TextureUsage.RENDER_TARGET,
}),
);
}
});

hooks.destroy.tap(() => {
Expand All @@ -100,18 +112,6 @@ export class Renderer implements Plugin {
),
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width,
height,
usage: TextureUsage.RENDER_TARGET,
}),
);
}

this.#device.beginFrame();

this.#renderPass = this.#device.createRenderPass({
Expand Down
24 changes: 12 additions & 12 deletions packages/lesson_003/src/plugins/Renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -78,6 +78,18 @@ export class Renderer implements Plugin {
width * devicePixelRatio,
height * devicePixelRatio,
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width: width * devicePixelRatio,
height: height * devicePixelRatio,
usage: TextureUsage.RENDER_TARGET,
}),
);
}
});

hooks.destroy.tap(() => {
Expand All @@ -101,18 +113,6 @@ export class Renderer implements Plugin {
),
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width,
height,
usage: TextureUsage.RENDER_TARGET,
}),
);
}

this.#device.beginFrame();

this.#renderPass = this.#device.createRenderPass({
Expand Down
1 change: 1 addition & 0 deletions packages/lesson_003/src/shapes/Circle.ts
Original file line number Diff line number Diff line change
Expand Up @@ -270,6 +270,7 @@ export class Circle extends Shape {
this.#instancedBuffer.destroy();
this.#fragUnitBuffer.destroy();
this.#indexBuffer.destroy();
this.#uniformBuffer.destroy();
this.#pipeline.destroy();
this.#inputLayout.destroy();
this.#bindings.destroy();
Expand Down
24 changes: 12 additions & 12 deletions packages/lesson_004/src/plugins/Renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,18 @@ export class Renderer implements Plugin {
width * devicePixelRatio,
height * devicePixelRatio,
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width: width * devicePixelRatio,
height: height * devicePixelRatio,
usage: TextureUsage.RENDER_TARGET,
}),
);
}
});

hooks.destroy.tap(() => {
Expand All @@ -112,18 +124,6 @@ export class Renderer implements Plugin {
),
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width,
height,
usage: TextureUsage.RENDER_TARGET,
}),
);
}

this.#device.beginFrame();

this.#renderPass = this.#device.createRenderPass({
Expand Down
1 change: 1 addition & 0 deletions packages/lesson_004/src/shapes/Circle.ts
Original file line number Diff line number Diff line change
Expand Up @@ -256,6 +256,7 @@ export class Circle extends Shape {
this.#instancedBuffer.destroy();
this.#fragUnitBuffer.destroy();
this.#indexBuffer.destroy();
this.#uniformBuffer.destroy();
this.#pipeline.destroy();
this.#inputLayout.destroy();
this.#bindings.destroy();
Expand Down
26 changes: 12 additions & 14 deletions packages/lesson_005/src/plugins/Renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -114,6 +114,18 @@ export class Renderer implements Plugin {
width * devicePixelRatio,
height * devicePixelRatio,
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width: width * devicePixelRatio,
height: height * devicePixelRatio,
usage: TextureUsage.RENDER_TARGET,
}),
);
}
});

hooks.destroy.tap(() => {
Expand Down Expand Up @@ -148,18 +160,6 @@ export class Renderer implements Plugin {
),
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width,
height,
usage: TextureUsage.RENDER_TARGET,
}),
);
}

this.#device.beginFrame();

this.#renderPass = this.#device.createRenderPass({
Expand Down Expand Up @@ -192,8 +192,6 @@ export class Renderer implements Plugin {

if (this.#gridImplementation === GridImplementation.LINE_GEOMETRY) {
this.#grid.reset();
} else {
this.#grid2.reset();
}
});

Expand Down
1 change: 1 addition & 0 deletions packages/lesson_005/src/shapes/Circle.ts
Original file line number Diff line number Diff line change
Expand Up @@ -256,6 +256,7 @@ export class Circle extends Shape {
this.#instancedBuffer.destroy();
this.#fragUnitBuffer.destroy();
this.#indexBuffer.destroy();
this.#uniformBuffer.destroy();
this.#pipeline.destroy();
this.#inputLayout.destroy();
this.#bindings.destroy();
Expand Down
52 changes: 25 additions & 27 deletions packages/lesson_005/src/shapes/Grid2.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,6 @@ export class Grid2 {
this.#vertices.appendFloat(x).appendFloat(y);
}

reset() {
this.#vertices.clear();
}

render(device: Device, renderPass: RenderPass, uniformBuffer: Buffer) {
if (!this.#program) {
this.#program = device.createProgram({
Expand Down Expand Up @@ -67,33 +63,35 @@ export class Grid2 {
colorAttachmentFormats: [Format.U8_RGBA_RT],
topology: PrimitiveTopology.TRIANGLE_STRIP,
});
}

this.#bindings = device.createBindings({
pipeline: this.#pipeline,
uniformBufferBindings: [
{
buffer: uniformBuffer,
},
],
});
this.#bindings = device.createBindings({
pipeline: this.#pipeline,
uniformBufferBindings: [
{
buffer: uniformBuffer,
},
],
});

this.#vertices.clear();

this.appendVertex(-1, -1);
this.appendVertex(-1, 1);
this.appendVertex(1, -1);
this.appendVertex(1, 1);
this.appendVertex(-1, -1);
this.appendVertex(-1, 1);
this.appendVertex(1, -1);
this.appendVertex(1, 1);

const data = this.#vertices.bytes();
if (this.#buffer) {
this.#buffer.destroy();
const data = this.#vertices.bytes();
if (this.#buffer) {
this.#buffer.destroy();
}
const buffer = device.createBuffer({
viewOrSize: data.byteLength,
usage: BufferUsage.VERTEX,
hint: BufferFrequencyHint.DYNAMIC,
});
this.#buffer = buffer;
buffer.setSubData(0, data);
}
const buffer = device.createBuffer({
viewOrSize: data.byteLength,
usage: BufferUsage.VERTEX,
hint: BufferFrequencyHint.DYNAMIC,
});
this.#buffer = buffer;
buffer.setSubData(0, data);

renderPass.setBindings(this.#bindings);
renderPass.setPipeline(this.#pipeline);
Expand Down
5 changes: 0 additions & 5 deletions packages/lesson_006/src/Canvas.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,11 +28,6 @@ export interface CanvasConfig {
devicePixelRatio?: number;
}

export enum CanvasMode {
SELECT,
HAND,
}

export class Canvas {
#instancePromise: Promise<this>;

Expand Down
25 changes: 12 additions & 13 deletions packages/lesson_006/src/plugins/Renderer.ts
Original file line number Diff line number Diff line change
Expand Up @@ -101,6 +101,18 @@ export class Renderer implements Plugin {
width * devicePixelRatio,
height * devicePixelRatio,
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width: width * devicePixelRatio,
height: height * devicePixelRatio,
usage: TextureUsage.RENDER_TARGET,
}),
);
}
});

hooks.destroy.tap(() => {
Expand Down Expand Up @@ -130,18 +142,6 @@ export class Renderer implements Plugin {
),
);

if (this.#renderTarget) {
this.#renderTarget.destroy();
this.#renderTarget = this.#device.createRenderTargetFromTexture(
this.#device.createTexture({
format: Format.U8_RGBA_RT,
width,
height,
usage: TextureUsage.RENDER_TARGET,
}),
);
}

this.#device.beginFrame();

this.#renderPass = this.#device.createRenderPass({
Expand All @@ -157,7 +157,6 @@ export class Renderer implements Plugin {
hooks.endFrame.tap(() => {
this.#device.submitPass(this.#renderPass);
this.#device.endFrame();
this.#grid.reset();
});

hooks.render.tap((shape) => {
Expand Down
1 change: 1 addition & 0 deletions packages/lesson_006/src/shapes/Circle.ts
Original file line number Diff line number Diff line change
Expand Up @@ -286,6 +286,7 @@ export class Circle extends Shape {
this.#instancedBuffer.destroy();
this.#fragUnitBuffer.destroy();
this.#indexBuffer.destroy();
this.#uniformBuffer.destroy();
this.#pipeline.destroy();
this.#inputLayout.destroy();
this.#bindings.destroy();
Expand Down
49 changes: 22 additions & 27 deletions packages/lesson_006/src/shapes/Grid.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,6 @@ export class Grid {
this.#vertices.appendFloat(x).appendFloat(y);
}

reset() {
this.#vertices.clear();
}

render(device: Device, renderPass: RenderPass, uniformBuffer: Buffer) {
if (!this.#program) {
this.#program = device.createProgram({
Expand Down Expand Up @@ -67,33 +63,32 @@ export class Grid {
colorAttachmentFormats: [Format.U8_RGBA_RT],
topology: PrimitiveTopology.TRIANGLE_STRIP,
});
}

this.#bindings = device.createBindings({
pipeline: this.#pipeline,
uniformBufferBindings: [
{
buffer: uniformBuffer,
},
],
});
this.#vertices.clear();

this.appendVertex(-1, -1);
this.appendVertex(-1, 1);
this.appendVertex(1, -1);
this.appendVertex(1, 1);
this.appendVertex(-1, -1);
this.appendVertex(-1, 1);
this.appendVertex(1, -1);
this.appendVertex(1, 1);

const data = this.#vertices.bytes();
if (this.#buffer) {
this.#buffer.destroy();
const data = this.#vertices.bytes();
const buffer = device.createBuffer({
viewOrSize: data.byteLength,
usage: BufferUsage.VERTEX,
hint: BufferFrequencyHint.DYNAMIC,
});
this.#buffer = buffer;
buffer.setSubData(0, data);

this.#bindings = device.createBindings({
pipeline: this.#pipeline,
uniformBufferBindings: [
{
buffer: uniformBuffer,
},
],
});
}
const buffer = device.createBuffer({
viewOrSize: data.byteLength,
usage: BufferUsage.VERTEX,
hint: BufferFrequencyHint.DYNAMIC,
});
this.#buffer = buffer;
buffer.setSubData(0, data);

renderPass.setBindings(this.#bindings);
renderPass.setPipeline(this.#pipeline);
Expand Down
Loading

0 comments on commit caef2b1

Please sign in to comment.