computer-graphics-study/src/drawer3D.ts
2021-10-10 02:07:34 +09:00

60 lines
No EOL
2 KiB
TypeScript

/// <reference path="./glsl.d.ts" />
import vert_src from "./vertex.vert";
import frag_src from "./fragment.frag";
import {createProgramFromSource, ProgramError, ShaderError} from "./gl_util";
import { Camera } from "./camera";
import * as G from "./glWrapper";
import { Drawable, RenderState } from "./drawable";
import { Model } from "./model";
import { mat4 } from "gl-matrix";
export class Drawer3D implements Drawable{
gl : WebGL2RenderingContext;
program: G.GLProgram;
camera : Camera;
model: Model | undefined;
constructor(gl: WebGL2RenderingContext){
this.gl = gl;
this.camera = new Camera([-20,1,-10]);
this.camera.far = 1000;
this.camera.near = 0.1;
this.camera.fovY = Math.PI * 90 / 180;
this.camera.aspect = 1;
this.model = undefined;
try{
this.program = new G.GLProgram(createProgramFromSource(gl,vert_src,frag_src));
const attr = this.program.getActiveAttributes(gl);
console.log(attr);
}
catch(e){
if(e instanceof ShaderError){
console.log(e.info);
}
throw e;
}
}
async init(){
const gl = this.gl;
const url = new URL("../assets/models/teapot/teapot.obj",import.meta.url);
this.model = await Model.loadFromOBJ(gl,url.href);
console.log("loading model complete");
this.model.ready(gl,this.program);
}
draw(gl: WebGL2RenderingContext,state:RenderState): void {
if(this.model !== undefined){
this.camera.aspect = gl.canvas.width/gl.canvas.height;
this.camera.UpdateProjectionMat();
this.program.use(gl);
this.program.setUniformMat4f(gl,"viewMat",this.camera.viewMatrix);
this.program.setUniformMat4f(gl,"projectionMat",this.camera.projectionMatrix);
this.program.setUniformMat4f(gl,"modelMat",mat4.fromTranslation(mat4.create(),[0,0,0]));
this.model.draw(gl);
}
}
}