@@ -11,6 +11,16 @@ Fired when a scene change is initiated. A `load` event will be fired when the | |||
new scene finishes loading. Passes scene ID string to handler. | |||
## `fullscreenchange` | |||
Fired when browser fullscreen status changed. Passes status boolean to handler. | |||
## `zoomchange` | |||
Fired when scene hfov update. Passes new HFOV value to handler. | |||
## `scenechangefadedone` | |||
If a scene transition fade interval is specified, this event is fired when the | |||
@@ -46,3 +56,4 @@ Fired when a touch starts. Passes `TouchEvent` to handler. | |||
## `touchend` | |||
Fired when a touch ends. Passes `TouchEvent` to handler. | |||
@@ -151,7 +151,16 @@ Defaults to `undefined`, so the viewer center can reach `-90` / `90`. | |||
### `minHfov` and `maxHfov` (number) | |||
Sets the minimum / maximum horizontal field of view, in degrees, that the | |||
viewer can be set to. Defaults to `50` / `120`. | |||
viewer can be set to. Defaults to `50` / `120`. Unless the `multiResMinHfov` | |||
parameter is set to `true`, the `minHfov` parameter is ignored for | |||
`multires` panoramas. | |||
### `multiResMinHfov` (boolean) | |||
When set to `false`, the `minHfov` parameter is ignored for `multires` | |||
panoramas; an automatically calculated minimum horizontal field of view is used | |||
instead. Defaults to `false`. | |||
### `compass` (boolean) | |||
@@ -209,9 +218,9 @@ This specifies the type of CORS request used and can be set to either | |||
`anonymous` or `use-credentials`. Defaults to `anonymous`. | |||
### `hotSpots` (array) | |||
### `hotSpots` (object) | |||
This specifies an array of hot spots that can be links to other scenes, | |||
This specifies a dictionary of hot spots that can be links to other scenes, | |||
information, or external links. Each array element has the following properties. | |||
@@ -241,6 +250,11 @@ spot. | |||
If specified for an `info` hot spot, the hot spot links to the specified URL. | |||
Not applicable for `scene` hot spots. | |||
#### `attributes` (dict) | |||
Specifies URL's link attributes. If not set, the `target` attribute is set to | |||
`_blank`, to open link in new tab to avoid opening in viewer frame / page. | |||
#### `sceneId` (string) | |||
Specifies the ID of the scene to link to for `scene` hot spots. Not applicable | |||
@@ -72,6 +72,7 @@ var config, | |||
var defaultConfig = { | |||
hfov: 100, | |||
minHfov: 50, | |||
multiResMinHfov: false, | |||
maxHfov: 120, | |||
pitch: 0, | |||
minPitch: undefined, | |||
@@ -999,7 +1000,6 @@ function onDocumentMouseWheel(event) { | |||
setHfov(config.hfov + event.detail * 1.5); | |||
speed.hfov = event.detail > 0 ? 1 : -1; | |||
} | |||
animateInit(); | |||
} | |||
@@ -1707,7 +1707,13 @@ function createHotSpot(hs) { | |||
} else if (hs.URL) { | |||
a = document.createElement('a'); | |||
a.href = sanitizeURL(hs.URL); | |||
a.target = '_blank'; | |||
if (hs.attributes) { | |||
for (var key in hs.attributes) { | |||
a.setAttribute(key, hs.attributes[key]); | |||
} | |||
} else { | |||
a.target = '_blank'; | |||
} | |||
renderContainer.appendChild(a); | |||
div.className += ' pnlm-pointer'; | |||
span.className += ' pnlm-pointer'; | |||
@@ -2106,7 +2112,7 @@ function onFullScreenChange() { | |||
controls.fullscreen.classList.remove('pnlm-fullscreen-toggle-button-active'); | |||
fullscreenActive = false; | |||
} | |||
fireEvent('fullscreenchange', fullscreenActive); | |||
// Resize renderer (deal with browser quirks and fixes #155) | |||
renderer.resize(); | |||
setHfov(config.hfov); | |||
@@ -2144,7 +2150,7 @@ function zoomOut() { | |||
function constrainHfov(hfov) { | |||
// Keep field of view within bounds | |||
var minHfov = config.minHfov; | |||
if (config.type == 'multires' && renderer) { | |||
if (config.type == 'multires' && renderer && config.multiResMinHfov) { | |||
minHfov = Math.min(minHfov, renderer.getCanvas().width / (config.multiRes.cubeResolution / 90 * 0.9)); | |||
} | |||
if (minHfov > config.maxHfov) { | |||
@@ -2178,6 +2184,7 @@ function constrainHfov(hfov) { | |||
*/ | |||
function setHfov(hfov) { | |||
config.hfov = constrainHfov(hfov); | |||
fireEvent('zoomchange', config.hfov); | |||
} | |||
/** | |||
@@ -2882,7 +2889,8 @@ this.removeHotSpot = function(hotSpotId, sceneId) { | |||
* @instance | |||
*/ | |||
this.resize = function() { | |||
onDocumentResize(); | |||
if (renderer) | |||
onDocumentResize(); | |||
} | |||
/** | |||
@@ -7,12 +7,14 @@ | |||
(function(document, videojs, pannellum) { | |||
'use strict'; | |||
videojs.plugin('pannellum', function(config) { | |||
var registerPlugin = videojs.registerPlugin || videojs.plugin; // Use registerPlugin for Video.js >= 6 | |||
registerPlugin('pannellum', function(config) { | |||
// Create Pannellum instance | |||
var player = this; | |||
var container = player.el(); | |||
var vid = container.getElementsByTagName('video')[0], | |||
pnlmContainer = document.createElement('div'); | |||
pnlmContainer.style.zIndex = '0'; | |||
config = config || {}; | |||
config.type = 'equirectangular'; | |||
config.dynamic = true; | |||