diff --git a/src/index.html b/src/index.html index 294c3ea..7e7b32d 100644 --- a/src/index.html +++ b/src/index.html @@ -8,68 +8,89 @@ - -
- Stats: - +
+ +
+ FPS: - +
- Controls: -
+
Scroll to zoom - -
  • +
    • +
    LookAt Matrix: - -
  • +
    • +
    Projection Matrix: - - -
  • +
    Invert Z-Axis:
    +
    • +
    Use virtual camera: - -
  • +
    • +
    Backface Culling: - - - +
    +
    \ No newline at end of file diff --git a/src/script.js b/src/script.js index e059098..13afb8e 100644 --- a/src/script.js +++ b/src/script.js @@ -40,6 +40,12 @@ let smoothCameraDistance = 4; let mouseDragging = false; +function resizeCanvas() { + cv.width = cv.parentElement.clientWidth; + cv.height = cv.parentElement.clientHeight; + gl.viewport(0, 0, cv.width, cv.height); +} + async function init() { cv = document.getElementById("cv"); @@ -49,6 +55,10 @@ async function init() { window.alert("WebGL not supported"); } + const resizeObserver = new ResizeObserver(resizeCanvas); + resizeObserver.observe(cv.parentElement); + resizeCanvas(); + // input handling document.getElementById("interpolateProjection").addEventListener("input", (e) => { @@ -114,7 +124,8 @@ async function init() { cv.addEventListener("wheel", (e) => { cameraDistance += e.deltaY / 100; if (cameraDistance < 1) cameraDistance = 1; - if (cameraDistance > 10) cameraDistance = 10; + if (cameraDistance > 15) cameraDistance = 15; + e.preventDefault(); });