Fix multiple event arguments

bower.json

@@ -1,6 +1,6 @@
 {
   "name": "Photo-Sphere-Viewer",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "authors": [{
     "name": "Jérémy Heleine",
     "email": "jeremy.heleine@gmail.com",

dist/photo-sphere-viewer.css

@@ -1,5 +1,5 @@
 /*!
- * Photo Sphere Viewer 3.0.0
+ * Photo Sphere Viewer 3.0.1
  * Copyright (c) 2014-2015 Jérémy Heleine
  * Copyright (c) 2015 Damien "Mistic" Sorel
  * Licensed under MIT (http://opensource.org/licenses/MIT)
@@ -212,8 +212,8 @@
 
 .psv-fullscreen-button div:before,
 .psv-fullscreen-button div:after {
-  position: absolute;
   content: '';
+  position: absolute;
   width: 6.0px;
   height: 4px;
   border-style: solid;
@@ -255,3 +255,59 @@
   border-left-width: 0;
   border-top-width: 0;
 }
+
+.psv-download-button {
+  width: 20px;
+  height: 20px;
+}
+
+.psv-download-button:before {
+  content: '';
+  position: absolute;
+  width: 20px;
+  height: 7px;
+  bottom: 10px;
+  border: 2px solid rgba(255, 255, 255, 0.7);
+  border-top-width: 0;
+  border-radius: 0;
+  transition: border-radius 0.2s ease;
+}
+
+.psv-download-button:hover:before {
+  border-radius: 2px;
+}
+
+.psv-download-button div {
+  position: absolute;
+  width: 12px;
+  height: 12px;
+  top: 50%;
+  left: 50%;
+  margin: -6px;
+  margin-top: -8px;
+  transition: margin-top 0.2s ease;
+}
+
+.psv-download-button:hover div {
+  margin-top: -6px;
+}
+
+.psv-download-button div:before,
+.psv-download-button div:after {
+  content: '';
+  display: block;
+  margin: 0 auto;
+}
+
+.psv-download-button div:before {
+  width: 6px;
+  height: 6px;
+  background: rgba(255, 255, 255, 0.7);
+}
+
+.psv-download-button div:after {
+  width: 0;
+  height: 0;
+  border: 6px solid transparent;
+  border-top-color: rgba(255, 255, 255, 0.7);
+}

dist/photo-sphere-viewer.js

@@ -1,5 +1,5 @@
 /*!
- * Photo Sphere Viewer 3.0.0
+ * Photo Sphere Viewer 3.0.1
  * Copyright (c) 2014-2015 Jérémy Heleine
  * Copyright (c) 2015 Damien "Mistic" Sorel
  * Licensed under MIT (http://opensource.org/licenses/MIT)
@@ -132,6 +132,14 @@ PhotoSphereViewer.DEFAULTS = {
   anim_speed: '2rpm',
   anim_lat: null,
   navbar: false,
+  lang: {
+    autorotate: 'Automatic rotation',
+    zoom: 'Zoom',
+    zoomOut: 'Zoom out',
+    zoomIn: 'Zoom in',
+    download: 'Download',
+    fullscreen: 'Fullscreen'
+  },
   mousewheel: true,
   mousemove: true,
   loading_img: null,
@@ -684,7 +692,6 @@ PhotoSphereViewer.prototype.setAnimSpeed = function(speed) {
     case 'degrees per minute':
     case 'dps':
     case 'degrees per second':
-      // Degrees to radians (rad = deg * pi / 180)
       rad_per_second = speed_value * Math.PI / 180;
       break;
 
@@ -699,11 +706,12 @@ PhotoSphereViewer.prototype.setAnimSpeed = function(speed) {
     case 'revolutions per minute':
     case 'rps':
     case 'revolutions per second':
-    // Unknown unit
-    default:
-      // speed * 2pi
       rad_per_second = speed_value * PhotoSphereViewer.TwoPI;
       break;
+
+    // Unknown unit
+    default:
+      throw 'PhotoSphereViewer: unknown speed unit "' + speed_unit + '"';
   }
 
   // Theta offset
@@ -744,13 +752,14 @@ PhotoSphereViewer.prototype.on = function(name, f) {
 /**
  * Triggers an action
  * @param name (string) Action name
- * @param arg (mixed) An argument to send to the handler functions
+ * @param args... (mixed) Arguments to send to the handler functions
  * @return (void)
  */
-PhotoSphereViewer.prototype.trigger = function(name, arg) {
+PhotoSphereViewer.prototype.trigger = function(name, args) {
+  args = Array.prototype.slice.call(arguments, 1);
   if ((name in this.actions) && this.actions[name].length > 0) {
     for (var i = 0, l = this.actions[name].length; i < l; ++i) {
-      this.actions[name][i](arg);
+      this.actions[name][i].apply(this, args);
     }
   }
 };
@@ -838,15 +847,24 @@ var PSVNavBar = function(psv) {
   this.autorotateBtn = null;
   this.zoomBar = null;
   this.fullscreenBtn = null;
+  this.downloadBtn = null;
   this.caption = null;
 
-  if (typeof this.config != 'object') {
+  if (this.config === true) {
     this.config = {
       autorotate: true,
       zoom: true,
-      fullscreen: true
+      fullscreen: true,
+      download: true
     };
   }
+  else if (typeof this.config == 'string') {
+    var map = {};
+    this.config.split(/[ ,:]/).forEach(function(button) {
+      map[button] = true;
+    });
+    this.config = map;
+  }
 
   this.create();
 };
@@ -878,6 +896,12 @@ PSVNavBar.prototype.create = function() {
     this.container.appendChild(this.fullscreenBtn.getButton());
   }
 
+  // Download button
+  if (this.config.download) {
+    this.downloadBtn = new PSVNavBarDownloadButton(this.psv);
+    this.container.appendChild(this.downloadBtn.getButton());
+  }
+
   // Caption
   this.caption = document.createElement('div');
   this.caption.className = 'psv-caption';
@@ -965,6 +989,7 @@ PSVNavBarAutorotateButton.prototype.constructor = PSVNavBarAutorotateButton;
 PSVNavBarAutorotateButton.prototype.create = function() {
   this.button = document.createElement('div');
   this.button.className = 'psv-button psv-autorotate-button';
+  this.button.title = this.psv.config.lang.autorotate;
 
   var autorotate_sphere = document.createElement('div');
   autorotate_sphere.className = 'psv-autorotate-sphere';
@@ -997,6 +1022,7 @@ PSVNavBarFullscreenButton.prototype.constructor = PSVNavBarFullscreenButton;
 PSVNavBarFullscreenButton.prototype.create = function() {
   this.button = document.createElement('div');
   this.button.className = 'psv-button psv-fullscreen-button';
+  this.button.title = this.psv.config.lang.fullscreen;
 
   this.button.appendChild(document.createElement('div'));
   this.button.appendChild(document.createElement('div'));
@@ -1032,6 +1058,7 @@ PSVNavBarZoomButton.prototype.create = function() {
 
   var zoom_minus = document.createElement('div');
   zoom_minus.className = 'psv-zoom-minus';
+  zoom_minus.title = this.psv.config.lang.zoomOut;
   this.button.appendChild(zoom_minus);
 
   var zoom_range_bg = document.createElement('div');
@@ -1040,14 +1067,17 @@ PSVNavBarZoomButton.prototype.create = function() {
 
   this.zoom_range = document.createElement('div');
   this.zoom_range.className = 'psv-zoom-range-line';
+  this.zoom_range.title = this.psv.config.lang.zoom;
   zoom_range_bg.appendChild(this.zoom_range);
 
   this.zoom_value = document.createElement('div');
   this.zoom_value.className = 'psv-zoom-range-handle';
+  this.zoom_value.title = this.psv.config.lang.zoom;
   this.zoom_range.appendChild(this.zoom_value);
 
   var zoom_plus = document.createElement('div');
   zoom_plus.className = 'psv-zoom-plus';
+  zoom_plus.title = this.psv.config.lang.zoomIn;
   this.button.appendChild(zoom_plus);
 
   PSVUtils.addEvent(this.zoom_range, 'mousedown', this._initZoomChangeWithMouse.bind(this));
@@ -1151,6 +1181,47 @@ PSVNavBarZoomButton.prototype._changeZoom = function(x) {
   }
 };
 
+/**
+ * Navigation bar download button class
+ * @param psv (PhotoSphereViewer) A PhotoSphereViewer object
+ */
+var PSVNavBarDownloadButton = function(psv) {
+  PSVNavBarButton.call(this, psv);
+
+  this.create();
+};
+
+PSVNavBarDownloadButton.prototype = Object.create(PSVNavBarButton.prototype);
+PSVNavBarDownloadButton.prototype.constructor = PSVNavBarDownloadButton;
+
+/**
+ * Creates the button
+ * @return (void)
+ */
+PSVNavBarDownloadButton.prototype.create = function() {
+  this.button = document.createElement('div');
+  this.button.className = 'psv-button psv-download-button';
+  this.button.title = this.psv.config.lang.download;
+
+  this.button.appendChild(document.createElement('div'));
+
+  PSVUtils.addEvent(this.button, 'mouseenter', this.toggleActive.bind(this, true));
+  PSVUtils.addEvent(this.button, 'mouseleave', this.toggleActive.bind(this, false));
+  PSVUtils.addEvent(this.button, 'click', this.download.bind(this));
+};
+
+/**
+ * Ask the browser to download the panorama source file
+ */
+PSVNavBarDownloadButton.prototype.download = function() {
+  var link = document.createElement('a');
+  link.href = this.psv.config.panorama;
+  link.download = this.psv.config.panorama;
+  this.psv.config.container.appendChild(link);
+  link.click();
+  this.psv.config.container.removeChild(link);
+};
+
 /**
  * Static utilities for PSV
  */

package.json

@@ -1,6 +1,6 @@
 {
   "name": "Photo-Sphere-Viewer",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "authors": [{
     "name": "Jérémy Heleine",
     "email": "jeremy.heleine@gmail.com",

src/PSVNavBar.js

@@ -12,14 +12,21 @@ var PSVNavBar = function(psv) {
   this.downloadBtn = null;
   this.caption = null;
 
-  if (typeof this.config != 'object') {
+  if (this.config === true) {
     this.config = {
       autorotate: true,
       zoom: true,
       fullscreen: true,
       download: true
     };
   }
+  else if (typeof this.config == 'string') {
+    var map = {};
+    this.config.split(/[ ,:]/).forEach(function(button) {
+      map[button] = true;
+    });
+    this.config = map;
+  }
 
   this.create();
 };

src/PhotoSphereViewer.js

@@ -675,7 +675,6 @@ PhotoSphereViewer.prototype.setAnimSpeed = function(speed) {
     case 'degrees per minute':
     case 'dps':
     case 'degrees per second':
-      // Degrees to radians (rad = deg * pi / 180)
       rad_per_second = speed_value * Math.PI / 180;
       break;
 
@@ -690,11 +689,12 @@ PhotoSphereViewer.prototype.setAnimSpeed = function(speed) {
     case 'revolutions per minute':
     case 'rps':
     case 'revolutions per second':
-    // Unknown unit
-    default:
-      // speed * 2pi
       rad_per_second = speed_value * PhotoSphereViewer.TwoPI;
       break;
+
+    // Unknown unit
+    default:
+      throw 'PhotoSphereViewer: unknown speed unit "' + speed_unit + '"';
   }
 
   // Theta offset
@@ -735,13 +735,14 @@ PhotoSphereViewer.prototype.on = function(name, f) {
 /**
  * Triggers an action
  * @param name (string) Action name
- * @param arg (mixed) An argument to send to the handler functions
+ * @param args... (mixed) Arguments to send to the handler functions
  * @return (void)
  */
-PhotoSphereViewer.prototype.trigger = function(name, arg) {
+PhotoSphereViewer.prototype.trigger = function(name, args) {
+  args = Array.prototype.slice.call(arguments, 1);
   if ((name in this.actions) && this.actions[name].length > 0) {
     for (var i = 0, l = this.actions[name].length; i < l; ++i) {
-      this.actions[name][i](arg);
+      this.actions[name][i].apply(this, args);
     }
   }
 };