14 |
15 |
16 | ### API Example:
17 |
18 | ````ts
19 | import * as YUE from "yue";
20 |
21 | (async() => {
22 | const renderer = await new YUE.Renderer({canvas}).create();
23 |
24 | const camera = new YUE.SphericalCamera();
25 | camera.attachControl(renderer.getCanvas());
26 | // Do an initial resize to fit the screen
27 | camera.resize(window.innerWidth, window.innerHeight);
28 |
29 | const depthAttachment = new YUE.Texture({
30 | width: window.innerWidth,
31 | height: window.innerHeight,
32 | isRenderable: true,
33 | format: YUE.TEXTURE_FORMAT.DEPTH32_FLOAT
34 | });
35 |
36 | const frame = new YUE.Frame({
37 | depthAttachment: {
38 | attachment: depthAttachment,
39 | readCommand: YUE.FRAME_COMMAND.CLEAR,
40 | writeCommand: YUE.FRAME_COMMAND.WRITE
41 | },
42 | colorAttachments: [
43 | {
44 | // Render into swapchain texture
45 | attachment: renderer.getSwapchainTexture(),
46 | clearColor: [1, 1, 1, 1],
47 | readCommand: YUE.FRAME_COMMAND.CLEAR,
48 | writeCommand: YUE.FRAME_COMMAND.WRITE
49 | }
50 | ]
51 | });
52 | frame.attachCamera(camera);
53 |
54 | const scene = new YUE.Container();
55 | frame.addChild(scene);
56 |
57 | const vertexShaderCode = await fetchText("./shaders/grid.vert");
58 | const fragmentShaderCode = await fetchText("./shaders/grid.frag");
59 |
60 | const vertexShader = new YUE.Shader({stage: YUE.SHADER_STAGE.VERTEX, code: vertexShaderCode});
61 | const fragmentShader = new YUE.Shader({stage: YUE.SHADER_STAGE.FRAGMENT, code: fragmentShaderCode});
62 |
63 | const material = new YUE.Material({
64 | attributes: YUE.Plane.AttributeLayout,
65 | vertexShader: {
66 | shader: vertexShader,
67 | uniforms: [
68 | {name: "Camera", id: 0, type: YUE.SHADER_UNIFORM.UNIFORM_BUFFER, isShared: true, byteLength: 64},
69 | {name: "Object", id: 1, type: YUE.SHADER_UNIFORM.UNIFORM_BUFFER, byteLength: 64}
70 | ]
71 | },
72 | fragmentShader: {
73 | shader: fragmentShader,
74 | uniforms: []
75 | },
76 | depthOutput: {
77 | format: YUE.TEXTURE_FORMAT.DEPTH32_FLOAT
78 | },
79 | colorOutputs: [
80 | {format: renderer.getSwapchainFormat()},
81 | ],
82 | cullMode: YUE.MATERIAL_CULL_MODE.NONE
83 | });
84 |
85 | const mesh = new YUE.Mesh({
86 | material: material,
87 | indices: YUE.Plane.Indices,
88 | scale: new Float32Array([1, 1, 1]),
89 | translation: new Float32Array([0, 0, 0]),
90 | attributes: YUE.Plane.Attributes
91 | });
92 | scene.addChild(mesh);
93 |
94 | // Simple ray cast from screen center
95 | const ray = new YUE.Ray({camera}).fromCameraCenter();
96 | // Contains intersection point in world-space
97 | const doesIntersect = ray.intersectsAABB(mesh.getBoundings()) && mesh.intersectRay(ray);
98 | // Indicates if the scene is inside the camera's frustum
99 | const isInsideFrustum = camera.intersectsAABB(scene.getBoundings());
100 |
101 | // Update loop
102 | setTimeout(function updateLoop() {
103 | (async function() {
104 | await frame.update(renderer);
105 | setTimeout(updateLoop);
106 | })();
107 | });
108 |
109 | // Draw loop
110 | requestAnimationFrame(function drawLoop(time: number) {
111 | requestAnimationFrame(drawLoop);
112 | // Render frames
113 | renderer.render(frame);
114 | // Update model matrix of the mesh
115 | mesh.updateUniform("Object", mesh.getModelMatrix());
116 | // Update camera matrix of the material
117 | // This update affects all objects using this material since the uniform 'Camera' is shared
118 | material.updateUniform("Camera", camera.getViewProjectionMatrix());
119 | });
120 |
121 | })();
122 | ````
123 |
--------------------------------------------------------------------------------
/src/Camera/SphericalCamera.ts:
--------------------------------------------------------------------------------
1 | import {mat4, vec3} from "gl-matrix";
2 |
3 | import {AbstractCamera, ICameraOptions} from "./AbstractCamera";
4 |
5 | /// Generated using TypeDoc
191 |Generated using TypeDoc
191 |Generated using TypeDoc
191 |Generated using TypeDoc
200 |Generated using TypeDoc
202 |Generated using TypeDoc
208 |Generated using TypeDoc
226 |Generated using TypeDoc
226 |Generated using TypeDoc
240 |Generated using TypeDoc
237 |Generated using TypeDoc
237 |Generated using TypeDoc
242 |Generated using TypeDoc
206 |Generated using TypeDoc
248 |