From 3cdadaa42f6248dc7f5992f2bb1ebc16a55a941f Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Thu, 14 Dec 2017 23:29:04 -0500 Subject: [PATCH 01/19] Fix bug where default image type argument didn't work for libpannellum. --- src/js/libpannellum.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index f07f469..2d39d1e 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -63,7 +63,7 @@ function Renderer(container) { */ this.init = function(_image, _imageType, _dynamic, haov, vaov, voffset, callback, params) { // Default argument for image type - if (typeof _imageType === undefined) + if (_imageType === undefined) _imageType = 'equirectangular'; if (_imageType != 'equirectangular' && _imageType != 'cubemap' && From aa8636227dc27a472add94b265a9911d4be93226 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Thu, 14 Dec 2017 23:37:43 -0500 Subject: [PATCH 02/19] Use WebGL context size instead of canvas size. --- src/js/libpannellum.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index 2d39d1e..d212422 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -325,7 +325,7 @@ function Renderer(container) { // Pass aspect ratio program.aspectRatio = gl.getUniformLocation(program, 'u_aspectRatio'); - gl.uniform1f(program.aspectRatio, canvas.clientWidth / canvas.clientHeight); + gl.uniform1f(program.aspectRatio, gl.drawingBufferWidth / gl.drawingBufferHeight); // Locate psi, theta, focal length, horizontal extent, vertical extent, and vertical offset program.psi = gl.getUniformLocation(program, 'u_psi'); @@ -534,7 +534,7 @@ function Renderer(container) { r: 'translate3d(' + s + 'px, -' + (s + 2) + 'px, -' + (s + 2) + 'px) rotateY(270deg)' }; focal = 1 / Math.tan(hfov / 2); - var zoom = focal * canvas.clientWidth / 2 + 'px'; + var zoom = focal * gl.drawingBufferWidth / 2 + 'px'; var transform = 'perspective(' + zoom + ') translateZ(' + zoom + ') rotateX(' + pitch + 'rad) rotateY(' + yaw + 'rad) '; // Apply face transforms @@ -549,7 +549,7 @@ function Renderer(container) { if (imageType != 'multires') { // Calculate focal length from vertical field of view - var vfov = 2 * Math.atan(Math.tan(hfov * 0.5) / (canvas.clientWidth / canvas.clientHeight)); + var vfov = 2 * Math.atan(Math.tan(hfov * 0.5) / (gl.drawingBufferWidth / gl.drawingBufferHeight)); focal = 1 / Math.tan(vfov * 0.5); // Pass psi, theta, roll, and focal length @@ -571,7 +571,7 @@ function Renderer(container) { } else { // Create perspective matrix - var perspMatrix = makePersp(hfov, canvas.clientWidth / canvas.clientHeight, 0.1, 100.0); + var perspMatrix = makePersp(hfov, gl.drawingBufferWidth / gl.drawingBufferHeight, 0.1, 100.0); // Find correct zoom level checkZoom(hfov); @@ -984,7 +984,7 @@ function Renderer(container) { * @returns {number[]} Generated perspective matrix. */ function makePersp(hfov, aspect, znear, zfar) { - var fovy = 2 * Math.atan(Math.tan(hfov/2) * canvas.clientHeight / canvas.clientWidth); + var fovy = 2 * Math.atan(Math.tan(hfov/2) * gl.drawingBufferHeight / gl.drawingBufferWidth); var f = 1 / Math.tan(fovy/2); return [ f/aspect, 0, 0, 0, @@ -1085,7 +1085,7 @@ function Renderer(container) { // Find optimal level var newLevel = 1; while ( newLevel < image.maxLevel && - canvas.width > image.tileResolution * + gl.drawingBufferWidth > image.tileResolution * Math.pow(2, newLevel - 1) * Math.tan(hfov / 2) * 0.707 ) { newLevel++; } From 14a7032a525560b310f7db4ba0ec454bbc78bca8 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Tue, 23 Jan 2018 20:58:46 -0500 Subject: [PATCH 03/19] Add method to check if device orientation control is active (implements #524). --- src/js/pannellum.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 27d2cdf..9fc8d0b 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -2818,6 +2818,16 @@ this.startOrientation = function() { } /** + * Check if device orientation control is currently activated. + * @memberof Viewer + * @instance + * @returns {boolean} True if active, else false + */ +this.isOrientationActive = function() { + return Boolean(orientation); +} + +/** * Subscribe listener to specified event. * @memberof Viewer * @instance From 2de1706be087930fb0e7cf6f13026e5dcd87aba5 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Tue, 23 Jan 2018 21:21:24 -0500 Subject: [PATCH 04/19] Allow CORS setting to be configured (implements #515). --- doc/json-config-parameters.md | 6 ++++++ src/js/libpannellum.js | 12 ++++++++---- src/js/pannellum.js | 4 +++- 3 files changed, 17 insertions(+), 5 deletions(-) diff --git a/doc/json-config-parameters.md b/doc/json-config-parameters.md index 315d663..7e1a16e 100644 --- a/doc/json-config-parameters.md +++ b/doc/json-config-parameters.md @@ -198,6 +198,12 @@ the configuration is provided via the URL; it defaults to `false` but can be set to `true` when using the API. +### `crossOrigin` (string) + +This specifies the type of CORS request used and can be set to either +`anonymous` or `use-credentials`. Defaults to `anonymous`. + + ### `hotSpots` (array) This specifies an array of hot spots that can be links to other scenes, diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index d212422..b76a652 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -42,6 +42,7 @@ function Renderer(container) { var pose; var image, imageType, dynamic; var texCoordBuffer, cubeVertBuf, cubeVertTexCoordBuf, cubeVertIndBuf; + var globalParams; /** * Initialize renderer. @@ -75,6 +76,7 @@ function Renderer(container) { imageType = _imageType; image = _image; dynamic = _dynamic; + globalParams = params || {}; // Clear old data if (program) { @@ -213,7 +215,7 @@ function Renderer(container) { }; for (s = 0; s < 6; s++) { var faceImg = new Image(); - faceImg.crossOrigin = 'anonymous'; + faceImg.crossOrigin = globalParams.crossOrigin ? globalParams.crossOrigin : 'anonymous'; faceImg.side = s; faceImg.onload = onLoad; if (imageType == 'multires') { @@ -1015,12 +1017,13 @@ function Renderer(container) { var cacheTop = 4; // Maximum number of concurrents loads var textureImageCache = {}; var pendingTextureRequests = []; + var crossOrigin; function TextureImageLoader() { var self = this; this.texture = this.callback = null; this.image = new Image(); - this.image.crossOrigin = 'anonymous'; + this.image.crossOrigin = crossOrigin ? crossOrigin : 'anonymous'; this.image.addEventListener('load', function() { processLoadedTexture(self.image, self.texture); self.callback(self.texture); @@ -1051,7 +1054,8 @@ function Renderer(container) { for (var i = 0; i < cacheTop; i++) textureImageCache[i] = new TextureImageLoader(); - return function(src, callback) { + return function(src, callback, _crossOrigin) { + crossOrigin = _crossOrigin; var texture = gl.createTexture(); if (cacheTop) textureImageCache[--cacheTop].loadTexture(src, texture, callback); @@ -1072,7 +1076,7 @@ function Renderer(container) { loadTexture(encodeURI(node.path + '.' + image.extension), function(texture) { node.texture = texture; node.textureLoaded = true; - }); + }, globalParams.crossOrigin); } } diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 9fc8d0b..874c125 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -102,6 +102,7 @@ var defaultConfig = { animationTimingFunction: timingFunction, draggable: true, disableKeyboardCtrl: false, + crossOrigin: 'anonymous', }; // Translatable / configurable strings @@ -306,7 +307,7 @@ function init() { panoImage = []; for (i = 0; i < 6; i++) { panoImage.push(new Image()); - panoImage[i].crossOrigin = 'anonymous'; + panoImage[i].crossOrigin = config.crossOrigin; } infoDisplay.load.lbox.style.display = 'block'; infoDisplay.load.lbar.style.display = 'none'; @@ -427,6 +428,7 @@ function init() { } xhr.responseType = 'blob'; xhr.setRequestHeader('Accept', 'image/*,*/*;q=0.9'); + xhr.withCredentials = config.crossOrigin === 'use-credentials'; xhr.send(); } } From 67cd2f5c9308bb75b26eb7b535e08003588b4658 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Tue, 23 Jan 2018 21:26:49 -0500 Subject: [PATCH 05/19] Add method to retrieve viewer's container element (implements #463). --- src/js/pannellum.js | 10 ++++++++++ 1 file changed, 10 insertions(+) diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 874c125..2882e3c 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -2709,6 +2709,16 @@ this.getConfig = function() { } /** + * Get viewer's container element. + * @memberof Viewer + * @instance + * @returns {HTMLElement} Container `div` element + */ +this.getContainer = function() { + return container; +} + +/** * Add a new hot spot. * @memberof Viewer * @instance From 2341ef6b2b310475a66b20ab3d727cc8fe230101 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Tue, 23 Jan 2018 21:38:15 -0500 Subject: [PATCH 06/19] Bump copyright year. --- COPYING | 2 +- src/js/libpannellum.js | 2 +- src/js/pannellum.js | 2 +- utils/multires/generate.py | 2 +- utils/video/videojs-pannellum-plugin.js | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/COPYING b/COPYING index bf80fca..624d9c7 100644 --- a/COPYING +++ b/COPYING @@ -1,4 +1,4 @@ -Copyright (c) 2011-2017 Matthew Petroff +Copyright (c) 2011-2018 Matthew Petroff Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index b76a652..f2a9d4c 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -1,6 +1,6 @@ /* * libpannellum - A WebGL and CSS 3D transform based Panorama Renderer - * Copyright (c) 2012-2017 Matthew Petroff + * Copyright (c) 2012-2018 Matthew Petroff * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 2882e3c..0894ad7 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -1,6 +1,6 @@ /* * Pannellum - An HTML5 based Panorama Viewer - * Copyright (c) 2011-2017 Matthew Petroff + * Copyright (c) 2011-2018 Matthew Petroff * * Permission is hereby granted, free of charge, to any person obtaining a copy * of this software and associated documentation files (the "Software"), to deal diff --git a/utils/multires/generate.py b/utils/multires/generate.py index d55f40a..be4e5eb 100755 --- a/utils/multires/generate.py +++ b/utils/multires/generate.py @@ -4,7 +4,7 @@ # and nona (from Hugin) # generate.py - A multires tile set generator for Pannellum -# Copyright (c) 2014-2017 Matthew Petroff +# Copyright (c) 2014-2018 Matthew Petroff # # Permission is hereby granted, free of charge, to any person obtaining a copy # of this software and associated documentation files (the "Software"), to deal diff --git a/utils/video/videojs-pannellum-plugin.js b/utils/video/videojs-pannellum-plugin.js index 9897477..0d49c59 100644 --- a/utils/video/videojs-pannellum-plugin.js +++ b/utils/video/videojs-pannellum-plugin.js @@ -1,6 +1,6 @@ /* * Video.js plugin for Pannellum - * Copyright (c) 2015-2017 Matthew Petroff + * Copyright (c) 2015-2018 Matthew Petroff * MIT License */ From 658183196b0d49628fbee88d65847007d2a794d9 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Tue, 30 Jan 2018 23:10:04 -0500 Subject: [PATCH 07/19] Prep for release. --- VERSION | 2 +- changelog.md | 66 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ package.json | 2 +- 3 files changed, 68 insertions(+), 2 deletions(-) diff --git a/VERSION b/VERSION index f90b1af..197c4d5 100644 --- a/VERSION +++ b/VERSION @@ -1 +1 @@ -2.3.2 +2.4.0 diff --git a/changelog.md b/changelog.md index 217ed15..2fc4538 100644 --- a/changelog.md +++ b/changelog.md @@ -2,6 +2,72 @@ Changelog ========= +Changes in Pannellum 2.4.0 +-------------------------- + +New Features: + +- Translation support +- Event for when scene change fade completes (`scenechangefadedone`) +- Events for touch starts and ends (`touchstart` and `touchend`) +- Added ability to set custom animation timing + function (`animationTimingFunction` parameter) +- Added option for only enable mouse wheel zoom while in + fullscreen (`mouseZoom` parameter) +- Added option to set title and author displayed while the load button + is displayed (`previewTitle` and `previewAuthor` parameters) +- Mouse and touch dragging can now be disabled (`draggable` parameter) +- Added option to disable keyboard controls (`disableKeyboardCtrl` parameter) +- CORS setting can now be configured + +New API functions: + +- Check if image is loaded (`isLoaded`) +- Method to update viewer after it is resized (`resize`) +- Set horizon pitch and roll (`setPose`) +- Turn device orientation control on and off, check if it is supported, and + check if it is activated (`startOrientation`, `stopOrientation`, + `isOrientationSupported`, and `isOrientationActive`) +- Method to retrieve viewer's container element (`getContainer`) + +Improvements: + +- Double-clicking now causes the viewer to zoom in (and back out when + double-clicking while zoomed in) +- New lines are now allowed in hot spot text +- Support for HTML in configuration strings can be enabled when using + the API (`escapeHTML` parameter) +- Fallback cursor is provided for browsers that don't support SVG data URIs +- Image type configuration parameter is now validated +- Optional callbacks added to `lookAt`, `setPitch`, `setYaw`, and `setHfov` + API functions +- Scroll events are now only captured when they're being used +- Viewer object is now assigned to a variable in the standalone viewer +- Hot spots can now be added with API before panorama is loaded +- Viewer UI is now created in a container element + +Bugfixes: + +- Fixed race condition when scene change hot spot is double-clicked +- Fixed bug with preview image absolute URLs +- Removed redundant constraints on yaw in API +- Tabbing now works, and only events for keys that are used are captured +- Fixed bug in HTML escaping +- Fixed bug that sometimes occurred when `orientationOnByDefault` was `true` +- Yaw no longer changes when device orientation mode is activated +- Fixed iOS 10 canvas size too big issue +- Fixed iOS 10 NPOT cube map issue +- Hot spots added via API are now permanent between scene changes +- Fixed multiple bugs with removing event listeners +- Fixed bug with multiresolution tile loading +- Fixed `sameAzimuth` target yaw not working when `northOffset` wasn't set +- Fixed bug yaw out of bounds in `mouseEventToCoords` +- Fixed bug with `animateMove` function +- Fixed bug with scene change fade +- Yaw animation is now always in the shortest direction +- Fixed bug related to removing hot spots + + Changes in Pannellum 2.3.2 -------------------------- diff --git a/package.json b/package.json index a63f465..3a16d5f 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "pannellum", "description": "Pannellum is a lightweight, free, and open source panorama viewer for the web.", - "version": "2.3.2", + "version": "2.4.0", "bugs": { "url": "https://github.com/mpetroff/pannellum/issues" }, From 2f64204a169e2ca5ae4fc87215f8425ea4f7f1ab Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Thu, 22 Feb 2018 20:29:20 -0500 Subject: [PATCH 08/19] Allow method to work when no scene has been loaded yet (fixes #549). --- src/js/pannellum.js | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 0894ad7..09f12bf 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -49,7 +49,7 @@ var config, onPointerDownPitch = 0, keysDown = new Array(10), fullscreenActive = false, - loaded = false, + loaded, error = false, isTimedOut = false, listenersAdded = false, @@ -2150,6 +2150,7 @@ function load() { // since it is a new scene and the error from previous maybe because of lacking // memory etc and not because of a lack of WebGL support etc clearError(); + loaded = false; controls.load.style.display = 'none'; infoDisplay.load.box.style.display = 'inline'; @@ -2277,7 +2278,7 @@ function escapeHTML(s) { * @returns {boolean} `true` if a panorama is loaded, else `false` */ this.isLoaded = function() { - return loaded; + return Boolean(loaded); }; /** @@ -2645,7 +2646,7 @@ this.mouseEventToCoords = function(event) { * @returns {Viewer} `this` */ this.loadScene = function(sceneId, pitch, yaw, hfov) { - if (loaded) + if (loaded !== false) loadScene(sceneId, pitch, yaw, hfov); return this; } From 20317207006909fdb62c1f4b8b95c62dbe9f44e1 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Sat, 3 Mar 2018 20:20:34 -0500 Subject: [PATCH 09/19] Fix touch input issue on Chrome for Android (fixes #551). --- src/css/pannellum.css | 1 + src/js/pannellum.js | 20 ++++++++++++-------- 2 files changed, 13 insertions(+), 8 deletions(-) diff --git a/src/css/pannellum.css b/src/css/pannellum.css index 95ff6fe..2b26090 100644 --- a/src/css/pannellum.css +++ b/src/css/pannellum.css @@ -17,6 +17,7 @@ outline: 0; line-height: 1.4; contain: content; + touch-action: none; } .pnlm-container * { diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 09f12bf..4fdfe70 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -482,13 +482,17 @@ function onImageLoad() { container.addEventListener('blur', clearKeys, false); } document.addEventListener('mouseleave', onDocumentMouseUp, false); - dragFix.addEventListener('touchstart', onDocumentTouchStart, false); - dragFix.addEventListener('touchmove', onDocumentTouchMove, false); - dragFix.addEventListener('touchend', onDocumentTouchEnd, false); - dragFix.addEventListener('pointerdown', onDocumentPointerDown, false); - dragFix.addEventListener('pointermove', onDocumentPointerMove, false); - dragFix.addEventListener('pointerup', onDocumentPointerUp, false); - dragFix.addEventListener('pointerleave', onDocumentPointerUp, false); + if (document.documentElement.style.pointerAction === '' && + document.documentElement.style.touchAction === '') { + dragFix.addEventListener('pointerdown', onDocumentPointerDown, false); + dragFix.addEventListener('pointermove', onDocumentPointerMove, false); + dragFix.addEventListener('pointerup', onDocumentPointerUp, false); + dragFix.addEventListener('pointerleave', onDocumentPointerUp, false); + } else { + dragFix.addEventListener('touchstart', onDocumentTouchStart, false); + dragFix.addEventListener('touchmove', onDocumentTouchMove, false); + dragFix.addEventListener('touchend', onDocumentTouchEnd, false); + } // Deal with MS pointer events if (window.navigator.pointerEnabled) @@ -928,7 +932,7 @@ function onDocumentPointerMove(event) { pointerCoordinates[i].clientY = event.clientY; event.targetTouches = pointerCoordinates; onDocumentTouchMove(event); - //event.preventDefault(); + event.preventDefault(); return; } } From ea2a501eab6ca8a8f49d68ead98a7f3dd0ada342 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Sat, 3 Mar 2018 20:24:49 -0500 Subject: [PATCH 10/19] Prep for release. --- VERSION | 2 +- changelog.md | 9 +++++++++ package.json | 2 +- 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/VERSION b/VERSION index 197c4d5..005119b 100644 --- a/VERSION +++ b/VERSION @@ -1 +1 @@ -2.4.0 +2.4.1 diff --git a/changelog.md b/changelog.md index 2fc4538..1730ba6 100644 --- a/changelog.md +++ b/changelog.md @@ -2,6 +2,15 @@ Changelog ========= +Changes in Pannellum 2.4.1 +-------------------------- + +Bugfixes: + + - Fix touch input issue in Chrome + - The API's `loadScene` method now works when no scenes have been loaded yet + + Changes in Pannellum 2.4.0 -------------------------- diff --git a/package.json b/package.json index 3a16d5f..2098676 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "pannellum", "description": "Pannellum is a lightweight, free, and open source panorama viewer for the web.", - "version": "2.4.0", + "version": "2.4.1", "bugs": { "url": "https://github.com/mpetroff/pannellum/issues" }, From 7a8892b7c6451103b4d5687218404e908e05ce81 Mon Sep 17 00:00:00 2001 From: Daniel Morgenstern Date: Mon, 26 Feb 2018 22:15:18 +0100 Subject: [PATCH 11/19] fixes Make `usedKeyNumbers` configurable #554 --- src/js/pannellum.js | 7 +++---- 1 file changed, 3 insertions(+), 4 deletions(-) diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 4fdfe70..d20edb2 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -103,6 +103,7 @@ var defaultConfig = { draggable: true, disableKeyboardCtrl: false, crossOrigin: 'anonymous', + usedKeyNumbers: [16, 17, 27, 37, 38, 39, 40, 61, 65, 68, 83, 87, 107, 109, 173, 187, 189], }; // Translatable / configurable strings @@ -129,8 +130,6 @@ defaultConfig.strings = { unknownError: 'Unknown error. Check developer console.', } -var usedKeyNumbers = [16, 17, 27, 37, 38, 39, 40, 61, 65, 68, 83, 87, 107, 109, 173, 187, 189]; - // Initialize container container = typeof container === 'string' ? document.getElementById(container) : container; container.classList.add('pnlm-container'); @@ -1013,7 +1012,7 @@ function onDocumentKeyPress(event) { var keynumber = event.which || event.keycode; // Override default action for keys that are used - if (usedKeyNumbers.indexOf(keynumber) < 0) + if (config.usedKeyNumbers.indexOf(keynumber) < 0) return event.preventDefault(); @@ -1049,7 +1048,7 @@ function onDocumentKeyUp(event) { var keynumber = event.which || event.keycode; // Override default action for keys that are used - if (usedKeyNumbers.indexOf(keynumber) < 0) + if (config.usedKeyNumbers.indexOf(keynumber) < 0) return event.preventDefault(); From 46b6b9c07379d0453d739d45331fce524fda7fdf Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Sat, 3 Mar 2018 20:39:23 -0500 Subject: [PATCH 12/19] Change `usedKeyNumbers` parameter to `capturedKeyNumbers` to be more descriptive. --- doc/json-config-parameters.md | 5 +++++ src/js/pannellum.js | 10 +++++----- 2 files changed, 10 insertions(+), 5 deletions(-) diff --git a/doc/json-config-parameters.md b/doc/json-config-parameters.md index 7e1a16e..942f6ce 100644 --- a/doc/json-config-parameters.md +++ b/doc/json-config-parameters.md @@ -291,6 +291,11 @@ Specifies the fade duration, in milliseconds, when transitioning between scenes. Not defined by default. Only applicable for tours. Only works with WebGL renderer. +### `capturedKeyNumbers` (array) + +Specifies the key numbers that are captured in key events. Defaults to the +standard keys that are used by the viewer. + ## `equirectangular` specific options diff --git a/src/js/pannellum.js b/src/js/pannellum.js index d20edb2..e21503c 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -103,7 +103,7 @@ var defaultConfig = { draggable: true, disableKeyboardCtrl: false, crossOrigin: 'anonymous', - usedKeyNumbers: [16, 17, 27, 37, 38, 39, 40, 61, 65, 68, 83, 87, 107, 109, 173, 187, 189], + capturedKeyNumbers: [16, 17, 27, 37, 38, 39, 40, 61, 65, 68, 83, 87, 107, 109, 173, 187, 189], }; // Translatable / configurable strings @@ -1012,8 +1012,8 @@ function onDocumentKeyPress(event) { var keynumber = event.which || event.keycode; // Override default action for keys that are used - if (config.usedKeyNumbers.indexOf(keynumber) < 0) - return + if (config.capturedKeyNumbers.indexOf(keynumber) < 0) + return; event.preventDefault(); // If escape key is pressed @@ -1048,8 +1048,8 @@ function onDocumentKeyUp(event) { var keynumber = event.which || event.keycode; // Override default action for keys that are used - if (config.usedKeyNumbers.indexOf(keynumber) < 0) - return + if (config.capturedKeyNumbers.indexOf(keynumber) < 0) + return; event.preventDefault(); // Change key From 96224e4a48dc9e779e11675d438df88e47f9a6da Mon Sep 17 00:00:00 2001 From: Daniel Morgenstern Date: Mon, 26 Feb 2018 23:28:00 +0100 Subject: [PATCH 13/19] Ignore IntelliJ Files --- .gitignore | 3 +++ 1 file changed, 3 insertions(+) diff --git a/.gitignore b/.gitignore index 39d3807..0194eed 100644 --- a/.gitignore +++ b/.gitignore @@ -6,3 +6,6 @@ build/** # Ignore generated docs utils/doc/generated_docs + +# Ignore IntelliJ Files +.idea From 9ba4c93c3c68d15fcb08a61e4ac856924d450774 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Sat, 3 Mar 2018 20:54:30 -0500 Subject: [PATCH 14/19] Clarify documentation for `targetHfov` parameter. --- doc/json-config-parameters.md | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/doc/json-config-parameters.md b/doc/json-config-parameters.md index 942f6ce..c481655 100644 --- a/doc/json-config-parameters.md +++ b/doc/json-config-parameters.md @@ -257,7 +257,9 @@ maintain the same direction with regard to north. #### `targetHfov` (number) -Specifies the HFOV of the target scene, in degrees. +Specifies the HFOV of the target scene, in degrees. Can also be set to `same`, +which uses the current HFOV of the current scene as the initial HFOV of the +target scene. #### `id` From 034d27a22bd99ba284b06f91125d6e40daa86001 Mon Sep 17 00:00:00 2001 From: David von Oheimb Date: Sun, 4 Mar 2018 03:02:46 +0100 Subject: [PATCH 15/19] avoid loading invisible files for partial panos of any image type (#562) Avoid loading invisible files for partial panos of any image type. --- src/js/libpannellum.js | 23 ++++++++++++++++++----- 1 file changed, 18 insertions(+), 5 deletions(-) diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index f2a9d4c..5dc09d0 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -206,6 +206,13 @@ function Renderer(container) { // Draw image width duplicated edge pixels on canvas faceContext.putImageData(imgData, 0, 0); + incLoaded(); + }; + var incLoaded = function() { + if (this.width != 0) // support partial fallback/cubemap image + fallbackImgSize = this.width; + if (loaded == 5 && this.width == 0) // support partial fallback/cubemap image + this.width = fallbackImgSize; loaded++; if (loaded == 6) { fallbackImgSize = this.width; @@ -218,6 +225,7 @@ function Renderer(container) { faceImg.crossOrigin = globalParams.crossOrigin ? globalParams.crossOrigin : 'anonymous'; faceImg.side = s; faceImg.onload = onLoad; + faceImg.onerror = incLoaded; // ignore missing face file to support partial fallback/cubemap image if (imageType == 'multires') { faceImg.src = encodeURI(path.replace('%s', sides[s]) + '.' + image.extension); } else { @@ -542,9 +550,11 @@ function Renderer(container) { // Apply face transforms var faces = Object.keys(transforms); for (i = 0; i < 6; i++) { - var face = world.querySelector('.pnlm-' + faces[i] + 'face').style; - face.webkitTransform = transform + transforms[faces[i]]; - face.transform = transform + transforms[faces[i]]; + var face = world.querySelector('.pnlm-' + faces[i] + 'face'); + if (!face) + continue; // ignore missing face to support partial fallback/cubemap image + face.style.webkitTransform = transform + transforms[faces[i]]; + face.style.transform = transform + transforms[faces[i]]; } return; } @@ -1024,11 +1034,14 @@ function Renderer(container) { this.texture = this.callback = null; this.image = new Image(); this.image.crossOrigin = crossOrigin ? crossOrigin : 'anonymous'; - this.image.addEventListener('load', function() { - processLoadedTexture(self.image, self.texture); + var loadFn = (function() { + if (self.image.width > 0 && self.image.height > 0) // ignore missing tile to supporting partial image + processLoadedTexture(self.image, self.texture); self.callback(self.texture); releaseTextureImageLoader(self); }); + this.image.addEventListener('load', loadFn); + this.image.addEventListener('error', loadFn); // ignore missing tile file to support partial image, otherwise retry loop causes high CPU load }; TextureImageLoader.prototype.loadTexture = function(src, texture, callback) { From 2491c2b4dc71d66a79726d07b3b517ea24d53de1 Mon Sep 17 00:00:00 2001 From: David von Oheimb Date: Sat, 3 Mar 2018 21:10:57 +0100 Subject: [PATCH 16/19] start supporting backgroundColor for Cube and Mulitres panoramas --- src/js/libpannellum.js | 29 +++++++++++++++++++---------- 1 file changed, 19 insertions(+), 10 deletions(-) diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index 5dc09d0..dbef5f5 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -325,6 +325,11 @@ function Renderer(container) { program.texCoordLocation = gl.getAttribLocation(program, 'a_texCoord'); gl.enableVertexAttribArray(program.texCoordLocation); + // Set background color + program.backgroundColor = gl.getUniformLocation(program, 'u_backgroundColor'); + var color = params.backgroundColor ? params.backgroundColor : [0, 0, 0]; + gl.uniform4fv(program.backgroundColor, color.concat([1])); + if (imageType != 'multires') { // Provide texture coordinates for rectangle if (!texCoordBuffer) @@ -351,13 +356,6 @@ function Renderer(container) { gl.uniform1f(program.v, vaov / Math.PI); gl.uniform1f(program.vo, voffset / Math.PI * 2); - // Set background color - if (imageType == 'equirectangular') { - program.backgroundColor = gl.getUniformLocation(program, 'u_backgroundColor'); - var color = params.backgroundColor ? params.backgroundColor : [0, 0, 0]; - gl.uniform4fv(program.backgroundColor, color.concat([1])); - } - // Create texture program.texture = gl.createTexture(); gl.bindTexture(glBindType, program.texture); @@ -1287,7 +1285,10 @@ var fragEquiCubeBase = [ var fragCube = fragEquiCubeBase + [ // Look up color from texture 'float cosphi = cos(phi);', - 'gl_FragColor = textureCube(u_imageCube, vec3(cosphi*sin(lambda), sin(phi), cosphi*cos(lambda)));', + 'if(false)', // TODO: calculate if outside image + 'gl_FragColor = u_backgroundColor;', + 'else', + 'gl_FragColor = textureCube(u_imageCube, vec3(cosphi*sin(lambda), sin(phi), cosphi*cos(lambda)));', '}' ].join('\n'); @@ -1310,16 +1311,24 @@ var fragEquirectangular = fragEquiCubeBase + [ // Fragment shader var fragMulti = [ +'precision mediump float;', + 'varying mediump vec2 v_texCoord;', 'uniform sampler2D u_sampler;', //'uniform mediump vec4 u_color;', +// Background color (display for partial panoramas) +'uniform vec4 u_backgroundColor;', + 'void main(void) {', // Look up color from texture - 'gl_FragColor = texture2D(u_sampler, v_texCoord);', + 'if(false)', // TODO: calculate if outside image + 'gl_FragColor = u_backgroundColor;', + 'else', + 'gl_FragColor = texture2D(u_sampler, v_texCoord);', // 'gl_FragColor = u_color;', '}' -].join(''); +].join('\n'); return { renderer: function(container, image, imagetype, dynamic) { From 97daf7d1863f4c5e7a017e76eb2c6f98fe536c42 Mon Sep 17 00:00:00 2001 From: Matthew Petroff Date: Sat, 3 Mar 2018 21:12:31 -0500 Subject: [PATCH 17/19] Revert "start supporting backgroundColor for Cube and Mulitres panoramas" This reverts commit 2491c2b4dc71d66a79726d07b3b517ea24d53de1. --- src/js/libpannellum.js | 29 ++++++++++------------------- 1 file changed, 10 insertions(+), 19 deletions(-) diff --git a/src/js/libpannellum.js b/src/js/libpannellum.js index dbef5f5..5dc09d0 100644 --- a/src/js/libpannellum.js +++ b/src/js/libpannellum.js @@ -325,11 +325,6 @@ function Renderer(container) { program.texCoordLocation = gl.getAttribLocation(program, 'a_texCoord'); gl.enableVertexAttribArray(program.texCoordLocation); - // Set background color - program.backgroundColor = gl.getUniformLocation(program, 'u_backgroundColor'); - var color = params.backgroundColor ? params.backgroundColor : [0, 0, 0]; - gl.uniform4fv(program.backgroundColor, color.concat([1])); - if (imageType != 'multires') { // Provide texture coordinates for rectangle if (!texCoordBuffer) @@ -356,6 +351,13 @@ function Renderer(container) { gl.uniform1f(program.v, vaov / Math.PI); gl.uniform1f(program.vo, voffset / Math.PI * 2); + // Set background color + if (imageType == 'equirectangular') { + program.backgroundColor = gl.getUniformLocation(program, 'u_backgroundColor'); + var color = params.backgroundColor ? params.backgroundColor : [0, 0, 0]; + gl.uniform4fv(program.backgroundColor, color.concat([1])); + } + // Create texture program.texture = gl.createTexture(); gl.bindTexture(glBindType, program.texture); @@ -1285,10 +1287,7 @@ var fragEquiCubeBase = [ var fragCube = fragEquiCubeBase + [ // Look up color from texture 'float cosphi = cos(phi);', - 'if(false)', // TODO: calculate if outside image - 'gl_FragColor = u_backgroundColor;', - 'else', - 'gl_FragColor = textureCube(u_imageCube, vec3(cosphi*sin(lambda), sin(phi), cosphi*cos(lambda)));', + 'gl_FragColor = textureCube(u_imageCube, vec3(cosphi*sin(lambda), sin(phi), cosphi*cos(lambda)));', '}' ].join('\n'); @@ -1311,24 +1310,16 @@ var fragEquirectangular = fragEquiCubeBase + [ // Fragment shader var fragMulti = [ -'precision mediump float;', - 'varying mediump vec2 v_texCoord;', 'uniform sampler2D u_sampler;', //'uniform mediump vec4 u_color;', -// Background color (display for partial panoramas) -'uniform vec4 u_backgroundColor;', - 'void main(void) {', // Look up color from texture - 'if(false)', // TODO: calculate if outside image - 'gl_FragColor = u_backgroundColor;', - 'else', - 'gl_FragColor = texture2D(u_sampler, v_texCoord);', + 'gl_FragColor = texture2D(u_sampler, v_texCoord);', // 'gl_FragColor = u_color;', '}' -].join('\n'); +].join(''); return { renderer: function(container, image, imagetype, dynamic) { From d402e4afd5d7374c146718ab6d460d6db680c739 Mon Sep 17 00:00:00 2001 From: David von Oheimb Date: Sun, 4 Mar 2018 03:24:24 +0100 Subject: [PATCH 18/19] fix a copy&paste error on check for movement stop if opposite controls are pressed (#564) --- src/js/pannellum.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/js/pannellum.js b/src/js/pannellum.js index e21503c..75865b3 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -1267,7 +1267,7 @@ function keyRepeat() { } // Stop movement if opposite controls are pressed - if (keysDown[0] && keysDown[0]) { + if (keysDown[0] && keysDown[1]) { speed.hfov = 0; } if ((keysDown[2] || keysDown[6]) && (keysDown[3] || keysDown[7])) { From e67c946f5e56746798f6a0b09936e35c6e19da8e Mon Sep 17 00:00:00 2001 From: Jonathan Bowman Date: Sat, 3 Mar 2018 22:32:07 -0500 Subject: [PATCH 19/19] Added config option to adjust the drag speed by a factor (#556) --- doc/json-config-parameters.md | 5 +++++ src/js/pannellum.js | 3 ++- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/doc/json-config-parameters.md b/doc/json-config-parameters.md index c481655..7630a3d 100644 --- a/doc/json-config-parameters.md +++ b/doc/json-config-parameters.md @@ -115,6 +115,11 @@ the fullscreen API. If set to `false`, no controls are displayed. Defaults to `true`. +### `touchPanSpeedCoeffFactor` (number) + +Adjusts panning speed from touch inputs. Defaults to `1`. + + ### `yaw` (number) Sets the panorama's starting yaw position in degrees. Defaults to `0`. diff --git a/src/js/pannellum.js b/src/js/pannellum.js index 75865b3..3aa74a9 100644 --- a/src/js/pannellum.js +++ b/src/js/pannellum.js @@ -103,6 +103,7 @@ var defaultConfig = { draggable: true, disableKeyboardCtrl: false, crossOrigin: 'anonymous', + touchPanSpeedCoeffFactor: 1, capturedKeyNumbers: [16, 17, 27, 37, 38, 39, 40, 61, 65, 68, 83, 87, 107, 109, 173, 187, 189], }; @@ -874,7 +875,7 @@ function onDocumentTouchMove(event) { // // Currently this seems to *roughly* keep initial drag/pan start position close to // the user's finger while panning regardless of zoom level / config.hfov value. - var touchmovePanSpeedCoeff = config.hfov / 360; + var touchmovePanSpeedCoeff = (config.hfov / 360) * config.touchPanSpeedCoeffFactor; var yaw = (onPointerDownPointerX - clientX) * touchmovePanSpeedCoeff + onPointerDownYaw; speed.yaw = (yaw - config.yaw) % 360 * 0.2;