2017-09-02 15:14:10 -04:00
|
|
|
// pathfinder/client/src/camera.ts
|
|
|
|
//
|
|
|
|
// Copyright © 2017 The Pathfinder Project Developers.
|
|
|
|
//
|
|
|
|
// Licensed under the Apache License, Version 2.0 <LICENSE-APACHE or
|
|
|
|
// http://www.apache.org/licenses/LICENSE-2.0> or the MIT license
|
|
|
|
// <LICENSE-MIT or http://opensource.org/licenses/MIT>, at your
|
|
|
|
// option. This file may not be copied, modified, or distributed
|
|
|
|
// except according to those terms.
|
|
|
|
|
|
|
|
import * as glmatrix from 'gl-matrix';
|
2017-09-11 16:23:25 -04:00
|
|
|
import * as _ from 'lodash';
|
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
import {PathfinderView} from "./view";
|
|
|
|
|
2017-09-15 12:22:18 -04:00
|
|
|
const PIXELS_PER_LINE: number = 16.0;
|
|
|
|
|
2017-09-02 16:41:08 -04:00
|
|
|
const ORTHOGRAPHIC_ZOOM_SPEED: number = 1.0 / 100.0;
|
|
|
|
|
2017-09-11 19:07:11 -04:00
|
|
|
const ORTHOGRAPHIC_ZOOM_IN_FACTOR: number = 1.2;
|
|
|
|
const ORTHOGRAPHIC_ZOOM_OUT_FACTOR: number = 1.0 / ORTHOGRAPHIC_ZOOM_IN_FACTOR;
|
2017-09-10 16:17:24 -04:00
|
|
|
|
2017-09-13 16:30:26 -04:00
|
|
|
const ORTHOGRAPHIC_DEFAULT_MIN_SCALE: number = 0.01;
|
|
|
|
const ORTHOGRAPHIC_DEFAULT_MAX_SCALE: number = 1000.0;
|
2017-09-13 01:32:18 -04:00
|
|
|
|
2017-09-02 16:41:08 -04:00
|
|
|
const PERSPECTIVE_MOVEMENT_SPEED: number = 10.0;
|
|
|
|
const PERSPECTIVE_ROTATION_SPEED: number = 1.0 / 300.0;
|
|
|
|
|
2017-09-11 16:23:25 -04:00
|
|
|
const PERSPECTIVE_MOVEMENT_VECTORS: PerspectiveMovementVectors = _.fromPairs([
|
|
|
|
['W'.charCodeAt(0), glmatrix.vec3.fromValues(0, 0, PERSPECTIVE_MOVEMENT_SPEED)],
|
|
|
|
['A'.charCodeAt(0), glmatrix.vec3.fromValues(PERSPECTIVE_MOVEMENT_SPEED, 0, 0)],
|
|
|
|
['S'.charCodeAt(0), glmatrix.vec3.fromValues(0, 0, -PERSPECTIVE_MOVEMENT_SPEED)],
|
|
|
|
['D'.charCodeAt(0), glmatrix.vec3.fromValues(-PERSPECTIVE_MOVEMENT_SPEED, 0, 0)],
|
|
|
|
]);
|
|
|
|
|
2017-09-11 19:07:11 -04:00
|
|
|
const PERSPECTIVE_MOVEMENT_INTERVAL_DELAY: number = 10;
|
2017-09-02 15:14:10 -04:00
|
|
|
|
2017-09-11 22:37:18 -04:00
|
|
|
const PERSPECTIVE_INITIAL_TRANSLATION: glmatrix.vec3 =
|
|
|
|
glmatrix.vec3.clone([1750.0, 700.0, -1750.0]);
|
|
|
|
const PERSPECTIVE_INITIAL_ROTATION: glmatrix.vec2 = glmatrix.vec2.clone([Math.PI * 0.25, 0.0]);
|
2017-09-05 22:47:19 -04:00
|
|
|
|
2017-09-14 21:48:55 -04:00
|
|
|
const PERSPECTIVE_OUTER_COLLISION_EXTENT: number = 3000.0;
|
|
|
|
const PERSPECTIVE_HITBOX_RADIUS: number = 1.0;
|
|
|
|
|
2017-09-19 19:26:43 -04:00
|
|
|
const KEYCODES = ["W", "A", "S", "D"].map(x => x.charCodeAt(0));
|
|
|
|
|
2017-09-14 21:48:55 -04:00
|
|
|
export interface OrthographicCameraOptions {
|
|
|
|
minScale?: number;
|
|
|
|
maxScale?: number;
|
|
|
|
scaleBounds?: boolean;
|
2017-09-20 01:27:31 -04:00
|
|
|
ignoreBounds?: boolean;
|
2017-09-14 21:48:55 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
export interface PerspectiveCameraOptions {
|
|
|
|
innerCollisionExtent?: number;
|
|
|
|
}
|
|
|
|
|
2017-09-11 16:23:25 -04:00
|
|
|
interface PerspectiveMovementVectors {
|
|
|
|
[keyCode: number]: glmatrix.vec3;
|
|
|
|
}
|
|
|
|
|
2017-09-19 19:26:43 -04:00
|
|
|
interface PerspectiveMovementKeys {
|
|
|
|
[keyCode: number]: boolean;
|
|
|
|
}
|
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
export abstract class Camera {
|
|
|
|
constructor(canvas: HTMLCanvasElement) {
|
|
|
|
this.canvas = canvas;
|
|
|
|
}
|
|
|
|
|
2017-09-10 16:17:24 -04:00
|
|
|
abstract zoomIn(): void;
|
|
|
|
abstract zoomOut(): void;
|
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
protected canvas: HTMLCanvasElement;
|
|
|
|
}
|
|
|
|
|
|
|
|
export class OrthographicCamera extends Camera {
|
2017-09-13 23:41:04 -04:00
|
|
|
constructor(canvas: HTMLCanvasElement, options?: OrthographicCameraOptions) {
|
2017-09-02 15:14:10 -04:00
|
|
|
super(canvas);
|
|
|
|
|
2017-09-13 23:41:04 -04:00
|
|
|
if (options == null)
|
|
|
|
options = {};
|
|
|
|
|
|
|
|
this.minScale = _.defaultTo(options.minScale, ORTHOGRAPHIC_DEFAULT_MIN_SCALE);
|
|
|
|
this.maxScale = _.defaultTo(options.maxScale, ORTHOGRAPHIC_DEFAULT_MAX_SCALE);
|
|
|
|
this.scaleBounds = !!options.scaleBounds;
|
2017-09-20 01:27:31 -04:00
|
|
|
this.ignoreBounds = !!options.ignoreBounds;
|
2017-09-13 01:32:18 -04:00
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
this.translation = glmatrix.vec2.create();
|
|
|
|
this.scale = 1.0;
|
|
|
|
|
2017-09-11 19:07:11 -04:00
|
|
|
this._bounds = glmatrix.vec4.create();
|
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
this.canvas.addEventListener('wheel', event => this.onWheel(event), false);
|
2017-09-11 15:21:50 -04:00
|
|
|
this.canvas.addEventListener('mousedown', event => this.onMouseDown(event), false);
|
|
|
|
this.canvas.addEventListener('mouseup', event => this.onMouseUp(event), false);
|
|
|
|
this.canvas.addEventListener('mousemove', event => this.onMouseMove(event), false);
|
2017-09-02 15:14:10 -04:00
|
|
|
|
|
|
|
this.onPan = null;
|
|
|
|
this.onZoom = null;
|
|
|
|
}
|
|
|
|
|
2017-09-11 15:21:50 -04:00
|
|
|
onWheel(event: MouseWheelEvent): void {
|
2017-09-02 15:14:10 -04:00
|
|
|
event.preventDefault();
|
|
|
|
|
2017-09-11 15:21:50 -04:00
|
|
|
if (!event.ctrlKey) {
|
2017-09-15 12:22:18 -04:00
|
|
|
const delta = glmatrix.vec2.fromValues(-event.deltaX, event.deltaY);
|
|
|
|
if (event.deltaMode === event.DOM_DELTA_LINE)
|
|
|
|
glmatrix.vec2.scale(delta, delta, PIXELS_PER_LINE);
|
|
|
|
this.pan(delta);
|
2017-09-11 15:21:50 -04:00
|
|
|
return;
|
2017-09-02 15:14:10 -04:00
|
|
|
}
|
2017-09-11 15:21:50 -04:00
|
|
|
|
|
|
|
// Zoom event: see https://developer.mozilla.org/en-US/docs/Web/Events/wheel
|
|
|
|
const mouseLocation = glmatrix.vec2.fromValues(event.clientX, event.clientY);
|
|
|
|
const canvasLocation = this.canvas.getBoundingClientRect();
|
|
|
|
mouseLocation[0] -= canvasLocation.left;
|
|
|
|
mouseLocation[1] = canvasLocation.bottom - mouseLocation[1];
|
|
|
|
glmatrix.vec2.scale(mouseLocation, mouseLocation, window.devicePixelRatio);
|
|
|
|
|
|
|
|
const scale = 1.0 - event.deltaY * window.devicePixelRatio * ORTHOGRAPHIC_ZOOM_SPEED;
|
|
|
|
this.zoom(scale, mouseLocation);
|
|
|
|
}
|
|
|
|
|
|
|
|
private onMouseDown(event: MouseEvent): void {
|
|
|
|
this.canvas.classList.add('pf-grabbing');
|
|
|
|
}
|
|
|
|
|
|
|
|
private onMouseUp(event: MouseEvent): void {
|
|
|
|
this.canvas.classList.remove('pf-grabbing');
|
|
|
|
}
|
|
|
|
|
|
|
|
private onMouseMove(event: MouseEvent): void {
|
|
|
|
if ((event.buttons & 1) !== 0)
|
|
|
|
this.pan(glmatrix.vec2.fromValues(event.movementX, -event.movementY));
|
|
|
|
}
|
|
|
|
|
|
|
|
private pan(delta: glmatrix.vec2): void {
|
|
|
|
// Pan event.
|
|
|
|
glmatrix.vec2.scale(delta, delta, window.devicePixelRatio);
|
|
|
|
glmatrix.vec2.add(this.translation, this.translation, delta);
|
|
|
|
|
2017-09-13 17:49:47 -04:00
|
|
|
this.clampViewport();
|
|
|
|
|
2017-09-11 15:21:50 -04:00
|
|
|
if (this.onPan != null)
|
|
|
|
this.onPan();
|
2017-09-02 15:14:10 -04:00
|
|
|
}
|
|
|
|
|
2017-09-13 17:49:47 -04:00
|
|
|
private clampViewport() {
|
2017-09-20 01:27:31 -04:00
|
|
|
if (this.ignoreBounds)
|
|
|
|
return;
|
|
|
|
|
2017-09-23 16:09:45 -04:00
|
|
|
const bounds = glmatrix.vec4.clone(this.bounds);
|
|
|
|
if (!this.scaleBounds)
|
|
|
|
glmatrix.vec4.scale(bounds, bounds, this.scale);
|
|
|
|
|
2017-09-13 17:49:47 -04:00
|
|
|
for (let axis = 0; axis < 2; axis++) {
|
|
|
|
const viewportLength = axis === 0 ? this.canvas.width : this.canvas.height;
|
|
|
|
const axisBounds = [bounds[axis + 0], bounds[axis + 2]];
|
|
|
|
const boundsLength = axisBounds[1] - axisBounds[0];
|
|
|
|
if (viewportLength < boundsLength) {
|
|
|
|
// Viewport must be inside bounds.
|
|
|
|
this.translation[axis] = _.clamp(this.translation[axis],
|
|
|
|
viewportLength - axisBounds[1],
|
|
|
|
-axisBounds[0]);
|
|
|
|
} else {
|
|
|
|
// Bounds must be inside viewport.
|
|
|
|
this.translation[axis] = _.clamp(this.translation[axis],
|
|
|
|
-axisBounds[0],
|
|
|
|
viewportLength - axisBounds[1]);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2017-09-11 19:57:53 -04:00
|
|
|
zoomToFit(): void {
|
2017-09-23 16:09:45 -04:00
|
|
|
const upperLeft = glmatrix.vec2.clone([this._bounds[0], this._bounds[1]]);
|
|
|
|
const lowerRight = glmatrix.vec2.clone([this._bounds[2], this._bounds[3]]);
|
2017-09-11 19:57:53 -04:00
|
|
|
const width = this._bounds[2] - this._bounds[0];
|
2017-09-11 20:56:37 -04:00
|
|
|
const height = Math.abs(this._bounds[1] - this._bounds[3]);
|
2017-09-11 19:57:53 -04:00
|
|
|
|
|
|
|
// Scale appropriately.
|
|
|
|
this.scale = Math.min(this.canvas.width / width, this.canvas.height / height);
|
2017-09-11 19:07:11 -04:00
|
|
|
|
|
|
|
// Center.
|
|
|
|
this.translation = glmatrix.vec2.create();
|
|
|
|
glmatrix.vec2.lerp(this.translation, upperLeft, lowerRight, 0.5);
|
|
|
|
glmatrix.vec2.scale(this.translation, this.translation, -this.scale);
|
|
|
|
this.translation[0] += this.canvas.width * 0.5;
|
|
|
|
this.translation[1] += this.canvas.height * 0.5;
|
|
|
|
}
|
|
|
|
|
2017-09-10 16:17:24 -04:00
|
|
|
zoomIn(): void {
|
2017-09-11 19:07:11 -04:00
|
|
|
this.zoom(ORTHOGRAPHIC_ZOOM_IN_FACTOR, this.centerPoint);
|
2017-09-10 16:17:24 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
zoomOut(): void {
|
2017-09-11 19:07:11 -04:00
|
|
|
this.zoom(ORTHOGRAPHIC_ZOOM_OUT_FACTOR, this.centerPoint);
|
2017-09-10 16:17:24 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
private zoom(scale: number, point: glmatrix.vec2): void {
|
|
|
|
const absoluteTranslation = glmatrix.vec2.create();
|
|
|
|
glmatrix.vec2.sub(absoluteTranslation, this.translation, point);
|
|
|
|
glmatrix.vec2.scale(absoluteTranslation, absoluteTranslation, 1.0 / this.scale);
|
|
|
|
|
2017-09-13 16:30:26 -04:00
|
|
|
this.scale = _.clamp(this.scale * scale, this.minScale, this.maxScale);
|
2017-09-10 16:17:24 -04:00
|
|
|
|
|
|
|
glmatrix.vec2.scale(absoluteTranslation, absoluteTranslation, this.scale);
|
|
|
|
glmatrix.vec2.add(this.translation, absoluteTranslation, point);
|
|
|
|
|
2017-09-13 17:49:47 -04:00
|
|
|
this.clampViewport();
|
|
|
|
|
2017-09-10 16:17:24 -04:00
|
|
|
if (this.onZoom != null)
|
|
|
|
this.onZoom();
|
|
|
|
}
|
|
|
|
|
|
|
|
private get centerPoint(): glmatrix.vec2 {
|
|
|
|
return glmatrix.vec2.fromValues(this.canvas.width * 0.5, this.canvas.height * 0.5);
|
|
|
|
}
|
|
|
|
|
2017-09-11 19:07:11 -04:00
|
|
|
get bounds(): glmatrix.vec4 {
|
2017-09-13 23:41:04 -04:00
|
|
|
const bounds = glmatrix.vec4.clone(this._bounds);
|
|
|
|
if (this.scaleBounds)
|
|
|
|
glmatrix.vec4.scale(bounds, bounds, this.scale);
|
|
|
|
return bounds;
|
2017-09-11 19:07:11 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
set bounds(newBounds: glmatrix.vec4) {
|
|
|
|
this._bounds = glmatrix.vec4.clone(newBounds);
|
|
|
|
}
|
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
onPan: (() => void) | null;
|
|
|
|
onZoom: (() => void) | null;
|
|
|
|
|
2017-09-11 19:07:11 -04:00
|
|
|
private _bounds: glmatrix.vec4;
|
|
|
|
|
2017-09-02 15:14:10 -04:00
|
|
|
translation: glmatrix.vec2;
|
|
|
|
scale: number;
|
2017-09-13 01:32:18 -04:00
|
|
|
|
2017-09-13 16:30:26 -04:00
|
|
|
private readonly minScale: number;
|
|
|
|
private readonly maxScale: number;
|
2017-09-13 23:41:04 -04:00
|
|
|
private readonly scaleBounds: boolean;
|
2017-09-20 01:27:31 -04:00
|
|
|
private readonly ignoreBounds: boolean;
|
2017-09-02 15:14:10 -04:00
|
|
|
}
|
2017-09-02 16:41:08 -04:00
|
|
|
|
|
|
|
export class PerspectiveCamera extends Camera {
|
2017-09-14 21:48:55 -04:00
|
|
|
constructor(canvas: HTMLCanvasElement, options?: PerspectiveCameraOptions) {
|
2017-09-02 16:41:08 -04:00
|
|
|
super(canvas);
|
|
|
|
|
2017-09-14 21:48:55 -04:00
|
|
|
if (options == null)
|
|
|
|
options = {};
|
|
|
|
this.innerCollisionExtent = options.innerCollisionExtent || 0.0;
|
|
|
|
|
2017-09-11 19:07:11 -04:00
|
|
|
this.translation = glmatrix.vec3.clone(PERSPECTIVE_INITIAL_TRANSLATION);
|
2017-09-11 22:37:18 -04:00
|
|
|
this.rotation = glmatrix.vec2.clone(PERSPECTIVE_INITIAL_ROTATION);
|
2017-09-02 16:41:08 -04:00
|
|
|
this.movementDelta = glmatrix.vec3.create();
|
|
|
|
this.movementInterval = null;
|
|
|
|
|
|
|
|
this.canvas.addEventListener('mousedown', event => this.onMouseDown(event), false);
|
|
|
|
this.canvas.addEventListener('mouseup', event => this.onMouseUp(event), false);
|
|
|
|
this.canvas.addEventListener('mousemove', event => this.onMouseMove(event), false);
|
|
|
|
|
2017-09-11 16:23:25 -04:00
|
|
|
window.addEventListener('keydown', event => this.onKeyDown(event), false);
|
|
|
|
window.addEventListener('keyup', event => this.onKeyUp(event), false);
|
|
|
|
|
2017-09-02 16:41:08 -04:00
|
|
|
this.onChange = null;
|
2017-09-19 19:26:43 -04:00
|
|
|
|
|
|
|
this.wasdPress = _.fromPairs([
|
|
|
|
['W'.charCodeAt(0), false],
|
|
|
|
['A'.charCodeAt(0), false],
|
|
|
|
['S'.charCodeAt(0), false],
|
|
|
|
['D'.charCodeAt(0), false],
|
|
|
|
]);
|
2017-09-02 16:41:08 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
private onMouseDown(event: MouseEvent): void {
|
|
|
|
if (document.pointerLockElement !== this.canvas) {
|
|
|
|
this.canvas.requestPointerLock();
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
2017-09-03 22:24:28 -04:00
|
|
|
this.movementDelta = glmatrix.vec3.fromValues(0.0, 0.0, PERSPECTIVE_MOVEMENT_SPEED);
|
2017-09-02 16:41:08 -04:00
|
|
|
if (event.button !== 1)
|
|
|
|
this.movementDelta[0] = -this.movementDelta[0];
|
|
|
|
|
2017-09-11 16:23:25 -04:00
|
|
|
this.startMoving();
|
|
|
|
}
|
|
|
|
|
|
|
|
private onMouseUp(event: MouseEvent): void {
|
|
|
|
this.stopMoving();
|
|
|
|
}
|
|
|
|
|
|
|
|
private onMouseMove(event: MouseEvent): void {
|
|
|
|
if (document.pointerLockElement !== this.canvas)
|
|
|
|
return;
|
|
|
|
|
|
|
|
this.rotation[0] += event.movementX * PERSPECTIVE_ROTATION_SPEED;
|
2017-09-15 12:31:19 -04:00
|
|
|
|
|
|
|
const trialYRotation = this.rotation[1] + event.movementY * PERSPECTIVE_ROTATION_SPEED;
|
|
|
|
this.rotation[1] = _.clamp(trialYRotation, -Math.PI * 0.5, Math.PI * 0.5);
|
2017-09-11 16:23:25 -04:00
|
|
|
|
|
|
|
if (this.onChange != null)
|
|
|
|
this.onChange();
|
|
|
|
}
|
|
|
|
|
|
|
|
private onKeyDown(event: KeyboardEvent): void {
|
|
|
|
if (PERSPECTIVE_MOVEMENT_VECTORS.hasOwnProperty(event.keyCode)) {
|
2017-09-19 19:26:43 -04:00
|
|
|
// keyDown will be repeated on prolonged holds of the key,
|
|
|
|
// don't do extra computation in that case
|
|
|
|
if (this.wasdPress[event.keyCode])
|
|
|
|
return;
|
|
|
|
this.wasdPress[event.keyCode] = true;
|
|
|
|
this.updateMovementDelta();
|
2017-09-11 16:23:25 -04:00
|
|
|
this.startMoving();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
private onKeyUp(event: KeyboardEvent): void {
|
2017-09-19 19:26:43 -04:00
|
|
|
if (PERSPECTIVE_MOVEMENT_VECTORS.hasOwnProperty(event.keyCode)) {
|
|
|
|
this.wasdPress[event.keyCode] = false;
|
|
|
|
if (this.updateMovementDelta()) {
|
|
|
|
this.stopMoving();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Updates the movementDelta vector based on what keys are currently pressed
|
|
|
|
// Returns true if the vector is now empty
|
|
|
|
private updateMovementDelta(): boolean {
|
|
|
|
this.movementDelta = glmatrix.vec3.create();
|
|
|
|
let empty = true;
|
|
|
|
for (const key of KEYCODES) {
|
|
|
|
if (this.wasdPress[key]) {
|
|
|
|
glmatrix.vec3.add(this.movementDelta, this.movementDelta, PERSPECTIVE_MOVEMENT_VECTORS[key]);
|
|
|
|
empty = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
return empty;
|
2017-09-11 16:23:25 -04:00
|
|
|
}
|
|
|
|
|
|
|
|
private startMoving(): void {
|
2017-09-03 22:24:28 -04:00
|
|
|
if (this.movementInterval == null)
|
2017-09-11 19:07:11 -04:00
|
|
|
this.movementInterval = window.setInterval(() => this.move(), PERSPECTIVE_MOVEMENT_INTERVAL_DELAY);
|
2017-09-02 16:41:08 -04:00
|
|
|
}
|
|
|
|
|
2017-09-11 16:23:25 -04:00
|
|
|
private stopMoving(): void {
|
2017-09-02 16:41:08 -04:00
|
|
|
if (this.movementInterval != null) {
|
|
|
|
window.clearInterval(this.movementInterval);
|
2017-09-03 22:24:28 -04:00
|
|
|
this.movementInterval = null;
|
2017-09-02 16:41:08 -04:00
|
|
|
this.movementDelta = glmatrix.vec3.create();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
private move() {
|
2017-09-03 22:24:28 -04:00
|
|
|
const invRotationMatrix = glmatrix.mat4.create();
|
|
|
|
glmatrix.mat4.invert(invRotationMatrix, this.rotationMatrix);
|
|
|
|
|
2017-09-02 16:41:08 -04:00
|
|
|
const delta = glmatrix.vec3.clone(this.movementDelta);
|
2017-09-03 22:24:28 -04:00
|
|
|
glmatrix.vec3.transformMat4(delta, delta, invRotationMatrix);
|
2017-09-14 21:48:55 -04:00
|
|
|
|
|
|
|
const trialTranslation = glmatrix.vec3.create();
|
|
|
|
glmatrix.vec3.add(trialTranslation, this.translation, delta);
|
|
|
|
|
|
|
|
// TODO(pcwalton): Sliding…
|
|
|
|
const absoluteTrialTranslationX = Math.abs(trialTranslation[0]);
|
|
|
|
const absoluteTrialTranslationZ = Math.abs(trialTranslation[2]);
|
|
|
|
if (absoluteTrialTranslationX < this.innerCollisionExtent + PERSPECTIVE_HITBOX_RADIUS &&
|
|
|
|
absoluteTrialTranslationZ < this.innerCollisionExtent + PERSPECTIVE_HITBOX_RADIUS) {
|
|
|
|
return;
|
|
|
|
}
|
|
|
|
|
|
|
|
if (absoluteTrialTranslationX > PERSPECTIVE_OUTER_COLLISION_EXTENT -
|
|
|
|
PERSPECTIVE_HITBOX_RADIUS) {
|
|
|
|
trialTranslation[0] = Math.sign(trialTranslation[0]) *
|
|
|
|
(PERSPECTIVE_OUTER_COLLISION_EXTENT - PERSPECTIVE_HITBOX_RADIUS);
|
|
|
|
}
|
|
|
|
if (absoluteTrialTranslationZ > PERSPECTIVE_OUTER_COLLISION_EXTENT -
|
|
|
|
PERSPECTIVE_HITBOX_RADIUS) {
|
|
|
|
trialTranslation[2] = Math.sign(trialTranslation[2]) *
|
|
|
|
(PERSPECTIVE_OUTER_COLLISION_EXTENT - PERSPECTIVE_HITBOX_RADIUS);
|
|
|
|
}
|
|
|
|
|
|
|
|
this.translation = trialTranslation;
|
2017-09-02 16:41:08 -04:00
|
|
|
|
|
|
|
if (this.onChange != null)
|
|
|
|
this.onChange();
|
|
|
|
}
|
|
|
|
|
|
|
|
get rotationMatrix(): glmatrix.mat4 {
|
|
|
|
const matrix = glmatrix.mat4.create();
|
2017-09-09 03:04:35 -04:00
|
|
|
glmatrix.mat4.fromXRotation(matrix, this.rotation[1]);
|
|
|
|
glmatrix.mat4.rotateY(matrix, matrix, this.rotation[0]);
|
2017-09-02 16:41:08 -04:00
|
|
|
return matrix;
|
|
|
|
}
|
|
|
|
|
2017-09-10 16:17:24 -04:00
|
|
|
zoomIn(): void {
|
|
|
|
// TODO(pcwalton)
|
|
|
|
}
|
|
|
|
|
|
|
|
zoomOut(): void {
|
|
|
|
// TODO(pcwalton)
|
|
|
|
}
|
|
|
|
|
2017-09-02 16:41:08 -04:00
|
|
|
onChange: (() => void) | null;
|
|
|
|
|
|
|
|
translation: glmatrix.vec3;
|
|
|
|
|
2017-09-11 22:37:18 -04:00
|
|
|
/// Yaw and pitch Euler angles.
|
2017-09-02 16:41:08 -04:00
|
|
|
rotation: glmatrix.vec2;
|
|
|
|
|
|
|
|
private movementDelta: glmatrix.vec3;
|
2017-09-19 19:26:43 -04:00
|
|
|
// If W, A, S, D are pressed
|
|
|
|
private wasdPress: PerspectiveMovementKeys;
|
2017-09-02 16:41:08 -04:00
|
|
|
private movementInterval: number | null;
|
2017-09-13 23:41:04 -04:00
|
|
|
|
2017-09-14 21:48:55 -04:00
|
|
|
private readonly innerCollisionExtent: number;
|
2017-09-13 23:41:04 -04:00
|
|
|
}
|