computer-graphics-study/index.tsx

66 lines
1.8 KiB
TypeScript
Raw Permalink Normal View History

2021-10-09 20:35:57 +09:00
import { Drawer2D } from './src/drawer2D';
2021-09-28 17:51:14 +09:00
import React from 'react';
import ReactDOM from 'react-dom';
import { MenuBar } from "./src/menu";
2021-10-09 20:35:57 +09:00
import { TriangleDrawer } from './src/triangle_drawer';
2021-10-02 20:19:15 +09:00
import {CanvasApp} from "./src/app"
2021-09-28 17:51:14 +09:00
function findCanvas(){
const canvas = document.querySelector("canvas");
if(canvas === null){
console.error("couldn't find canvas");
throw new Error("canvas is null");
}
return canvas;
}
function getGLContext(canvas : HTMLCanvasElement){
const gl = canvas.getContext("webgl2") as any as WebGL2RenderingContext|null;
if(gl === null){
console.error("webgl2 is not supported!");
throw new Error("webgl2 not supported");
}
return gl;
}
function setupButton(){
let toggle = false;
const button = document.querySelector("#drawer-button") as HTMLDivElement;
const drawer = document.querySelector("#drawer") as HTMLDivElement;
button.addEventListener("click",()=>{
toggle = !toggle;
if(toggle){
drawer.style.right = "0px";
}
else{
drawer.style.right = "";
}
});
}
function main(){
setupButton();
const canvas = findCanvas();
const gl = getGLContext(canvas);
2021-10-02 20:19:15 +09:00
const app = new CanvasApp(gl);
if(!app.intialize()){
console.log("app initialize failed!!!");
return;
}
2021-10-31 17:33:10 +09:00
ReactDOM.render(<MenuBar u={app.getDefaultUniform()}
onUniformChange={(u)=>{app.onChangeUniform(u);
2021-10-02 19:13:52 +09:00
}} />
2021-09-28 17:51:14 +09:00
,document.getElementById("drawer"));
2021-10-31 17:33:10 +09:00
window.addEventListener("resize",(e)=>{
e.preventDefault();
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;
});
2021-09-28 17:51:14 +09:00
canvas.width = document.body.clientWidth;
canvas.height = document.body.clientHeight;
2021-10-02 20:19:15 +09:00
app.startRun();
app.startDraw();
2021-09-28 17:51:14 +09:00
}
main();