From 532395a3597213f690918bdb742ded06dfee7c07 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Tue, 2 Sep 2014 13:20:11 -0400 Subject: [PATCH] Add options limiting hfov, pitch, and yaw (thanks PhobosK). --- src/js/pannellum.js | 70 +++++++++++++++++++++++++++++++++++++++-------------- 1 file changed, 52 insertions(+), 18 deletions(-) diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 1ebf091..7e9824e 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -48,8 +48,14 @@ var config, var defaultConfig = { hfov: 100, + minhfov: 50, + maxhfov: 120, pitch: 0, + minpitch: -85, + maxpitch: 85, yaw: 0, + minyaw: -360, + maxyaw: 360, haov: 360, vaov: 180, voffset: 0, @@ -196,9 +202,15 @@ function onDocumentMouseDown(event) { function onDocumentMouseMove(event) { if (isUserInteracting) { //TODO: This still isn't quite right - config.yaw = ((Math.atan(onPointerDownPointerX / canvas.width * 2 - 1) - Math.atan(event.clientX / canvas.width * 2 - 1)) * 180 / Math.PI * config.hfov / 90) + onPointerDownYaw; + var yaw = ((Math.atan(onPointerDownPointerX / canvas.width * 2 - 1) - Math.atan(event.clientX / canvas.width * 2 - 1)) * 180 / Math.PI * config.hfov / 90) + onPointerDownYaw; + // Ensure the yaw is within min and max allowed + config.yaw = Math.max(config.minyaw, Math.min(config.maxyaw, yaw)); + var vfov = 2 * Math.atan(Math.tan(config.hfov/360*Math.PI) * canvas.height / canvas.width) * 180 / Math.PI; - config.pitch = ((Math.atan(event.clientY / canvas.height * 2 - 1) - Math.atan(onPointerDownPointerY / canvas.height * 2 - 1)) * 180 / Math.PI * vfov / 90) + onPointerDownPitch; + + var pitch = ((Math.atan(event.clientY / canvas.height * 2 - 1) - Math.atan(onPointerDownPointerY / canvas.height * 2 - 1)) * 180 / Math.PI * vfov / 90) + onPointerDownPitch; + // Ensure the calculated pitch is within min and max allowed + config.pitch = Math.max(config.minpitch, Math.min(config.maxpitch, pitch)); } } @@ -218,9 +230,15 @@ function onDocumentTouchStart(event) { function onDocumentTouchMove(event) { // Override default action event.preventDefault(); + + var yaw = (onPointerDownPointerX - event.targetTouches[0].clientX) * 0.1 + onPointerDownYaw; + // Ensure the yaw is within min and max allowed + config.yaw = Math.max(config.minyaw, Math.min(config.maxyaw, yaw)); + + var pitch = (event.targetTouches[0].clientY - onPointerDownPointerY) * 0.1 + onPointerDownPitch; + // Ensure the calculated pitch is within min and max allowed + config.pitch = Math.max(config.minpitch, Math.min(config.maxpitch, pitch)); - config.yaw = (onPointerDownPointerX - event.targetTouches[0].clientX) * 0.1 + onPointerDownYaw; - config.pitch = (event.targetTouches[0].clientY - onPointerDownPointerY) * 0.1 + onPointerDownPitch; animate(); } @@ -363,6 +381,9 @@ function keyRepeat() { } var diff = (newTime - prevTime) * config.hfov / 1700; + var pitch = config.pitch; + var yaw = config.yaw; + // If minus key is down if (keysDown[0]) { zoomOut(diff); @@ -376,25 +397,37 @@ function keyRepeat() { // If up arrow or "w" is down if (keysDown[2] || keysDown[6]) { // Pan up - config.pitch += diff; + pitch += diff; + + // Ensure the calculated pitch is within min and max allowed + config.pitch = Math.max(config.minpitch, Math.min(config.maxpitch, pitch)); } // If down arrow or "s" is down if (keysDown[3] || keysDown[7]) { // Pan down - config.pitch -= diff; + pitch -= diff; + + // Ensure the calculated pitch is within min and max allowed + config.pitch = Math.max(config.minpitch, Math.min(config.maxpitch, pitch)); } // If left arrow or "a" is down if (keysDown[4] || keysDown[8]) { // Pan left - config.yaw -= diff; + yaw -= diff; + + // Ensure the yaw is within min and max allowed + config.yaw = Math.max(config.minyaw, Math.min(config.maxyaw, yaw)); } // If right arrow or "d" is down if (keysDown[5] || keysDown[9]) { // Pan right - config.yaw += diff; + yaw += diff; + + // Ensure the yaw is within min and max allowed + config.yaw = Math.max(config.minyaw, Math.min(config.maxyaw, yaw)); } // If auto-rotate @@ -438,7 +471,12 @@ function render() { config.yaw += 360; } - config.pitch = Math.max(-85, Math.min(85, config.pitch)); + // Ensure the yaw is within min and max allowed + config.yaw = Math.max(config.minyaw, Math.min(config.maxyaw, config.yaw)); + + // Ensure the calculated pitch is within min and max allowed + config.pitch = Math.max(config.minpitch, Math.min(config.maxpitch, config.pitch)); + renderer.render(config.pitch * Math.PI / 180, config.yaw * Math.PI / 180, config.hfov * Math.PI / 180); renderHotSpots(); @@ -715,11 +753,7 @@ function processOptions() { case 'pitch': // Keep pitch within bounds - if (config.pitch < -85) { - config.pitch = -85; - } else if (config.pitch > 85) { - config.pitch = 85; - } + config.pitch = Math.max(config.minpitch, Math.min(config.maxpitch, config.pitch)); break; case 'autoload': @@ -818,13 +852,13 @@ function zoomOut(amount) { function setHfov(i) { // Keep field of view within bounds - if (i < 50 && config.type != 'multires') { - config.hfov = 50; + if (i < config.minhfov && config.type != 'multires') { + config.hfov = config.minhfov; } else if (config.type == 'multires' && i < canvas.width / (config.multiRes.cubeResolution / 90 * 0.9)) { config.hfov = canvas.width / (config.multiRes.cubeResolution / 90 * 0.9); - } else if (i > 120) { - config.hfov = 120; + } else if (i > config.maxhfov) { + config.hfov = config.maxhfov; } else { config.hfov = i; }