https://www.heulemakelaars.nl/shared/lib/gal360/gal360.js

1(function ( ) {
2	"use strict";
3
4	function gal360 ($root) {
5		var $nav    = $root.find(".gal360-nav");
6		var $scene  = $root.find(".gal360-scene");
7		var options = $.extend({
8			"enableScroll": false
9		}, $root.data());
10		var viewer;
11
12		function init ( ) {
13			showHideNav();
14
15			$nav.find("a:first").trigger("click");
16		};
17
18		function update ( ) {
19			$nav.find("a").removeClass("is-active").filter(":first").trigger("click");
20		};
21
22		function showHideNav ( ) {
23			if ($nav.find("a").length > 1) {
24				$root.removeClass("nav-hidden");
25			} else {
26				$root.addClass("nav-hidden");
27			}
28		};
29
30		function changeImage (url) {
31			if (viewer) {
32				viewer.destroy();
33			}
34			$root.removeClass("is-ready");
35
36			viewer = pannellum.viewer($scene[0], {
37				"type":      "equirectangular",
38				"panorama":  url,
39				"autoLoad":  true,
40				"mouseZoom": options.enableScroll
41			});
42
43			viewer.on("load", viewerReady);
44		};
45
46		function viewerReady ( ) {
47			$root.addClass("is-ready");
48		};
49
50		$nav.on("click", "a", function (e) {
51			var $this = $(this);
52
53			e.preventDefault();
54
55			if (!$this.hasClass("is-active")) {
56				$nav.find(".is-active").removeClass("is-active");
57				$this.addClass("is-active");
58
59				changeImage(this.href);
60			}
61		});
62
63		init();
64
65		return {
66			"init":        init,
67			"update":      update,
68			"changeImage": changeImage,
69			"showHideNav": showHideNav
70		};
71	};
72
73	$.fn.gal360 = jQueryPlugin("gal360", gal360);
74
75	$(".gal360").gal360();
76}());