Slight tweaks, bump up ECMAPortal to v1.1

This commit is contained in:
Andrew Illarionov 2023-11-05 00:46:08 +03:00
parent ca43c9441f
commit b290e102c1
4 changed files with 15 additions and 4 deletions

View File

@ -186,6 +186,6 @@
<img src="/images/enderman.gif" alt="Hello!"> <img src="/images/enderman.gif" alt="Hello!">
</div> </div>
<script src="/scripts/portal.js"></script> <script src="/scripts/portal-min.js"></script>
</body> </body>
</html> </html>

File diff suppressed because one or more lines are too long

View File

@ -9,6 +9,8 @@ class Portal {
uniform mat4 modelViewMatrix; uniform mat4 modelViewMatrix;
uniform mat4 projectionMatrix; uniform mat4 projectionMatrix;
uniform vec2 canvasResolution;
vec4 projection_from_position(vec4 position) { vec4 projection_from_position(vec4 position) {
vec4 projection = position * 0.5; vec4 projection = position * 0.5;
projection.xy = vec2(projection.x + projection.w, projection.y + projection.w); projection.xy = vec2(projection.x + projection.w, projection.y + projection.w);
@ -22,6 +24,7 @@ class Portal {
gl_Position = projectionMatrix * modelViewMatrix * vec4(Position, 1.0); gl_Position = projectionMatrix * modelViewMatrix * vec4(Position, 1.0);
texProj0 = projection_from_position(gl_Position); texProj0 = projection_from_position(gl_Position);
texProj0 = vec4(texProj0.xy * canvasResolution / max(canvasResolution.x, canvasResolution.y), texProj0.zw);
}` }`
// Fragment shader. // Fragment shader.
@ -101,7 +104,7 @@ class Portal {
]; ];
// Version & notice. // Version & notice.
this.version = '1.0'; this.version = '1.1';
this.notice(); this.notice();
this.canvas = canvas; this.canvas = canvas;
@ -260,6 +263,7 @@ class Portal {
modelViewMatrix: this.gl.getUniformLocation(this.prog, "modelViewMatrix"), modelViewMatrix: this.gl.getUniformLocation(this.prog, "modelViewMatrix"),
projectionMatrix: this.gl.getUniformLocation(this.prog, "projectionMatrix"), projectionMatrix: this.gl.getUniformLocation(this.prog, "projectionMatrix"),
dt: this.gl.getUniformLocation(this.prog, "dt"), dt: this.gl.getUniformLocation(this.prog, "dt"),
resolution: this.gl.getUniformLocation(this.prog, "canvasResolution"),
sky: this.gl.getUniformLocation(this.prog, "sky"), sky: this.gl.getUniformLocation(this.prog, "sky"),
particles: this.gl.getUniformLocation(this.prog, "particles"), particles: this.gl.getUniformLocation(this.prog, "particles"),
} }
@ -316,11 +320,14 @@ class Portal {
0.0, 0.0, 0.0, 1.0 0.0, 0.0, 0.0, 1.0
]); ]);
let dt = (Date.now() - this.time) / (1000 * 1000); let dt = (Date.now() - this.time) / 1000 / 1000;
this.gl.uniformMatrix4fv(this.uniforms.modelViewMatrix, false, identityMatrix); this.gl.uniformMatrix4fv(this.uniforms.modelViewMatrix, false, identityMatrix);
this.gl.uniformMatrix4fv(this.uniforms.projectionMatrix, false, identityMatrix); this.gl.uniformMatrix4fv(this.uniforms.projectionMatrix, false, identityMatrix);
this.gl.uniform2f(this.uniforms.resolution, this.canvas.clientWidth, this.canvas.clientHeight);
console.log(this.canvas.clientWidth, this.canvas.clientHeight);
this.gl.uniform1f(this.uniforms.dt, dt); this.gl.uniform1f(this.uniforms.dt, dt);
this.gl.uniform1i(this.uniforms.sky, 0); this.gl.uniform1i(this.uniforms.sky, 0);
this.gl.uniform1i(this.uniforms.particles, 1); this.gl.uniform1i(this.uniforms.particles, 1);

View File

@ -181,6 +181,10 @@ div.bottom-right {
opacity: 30%; opacity: 30%;
} }
div.bottom-right:hover {
opacity: 100%;
}
div.bottom-right img { div.bottom-right img {
height: 30vmin; height: 30vmin;
} }