panorama.dispose added on destroyed, cleaning, refactoring some parts

build/dev-server.js

@@ -1,34 +1,37 @@
 require('./check-versions')()
 
-var config = require('../config')
+const config = require('../config')
+
 if (!process.env.NODE_ENV) {
   process.env.NODE_ENV = JSON.parse(config.dev.env.NODE_ENV)
 }
 
-var opn = require('opn')
-var path = require('path')
-var express = require('express')
-var webpack = require('webpack')
-var proxyMiddleware = require('http-proxy-middleware')
-var webpackConfig = require('./webpack.dev.conf')
+const opn = require('opn')
+const path = require('path')
+const express = require('express')
+const webpack = require('webpack')
+const proxyMiddleware = require('http-proxy-middleware')
+const webpackConfig = require('./webpack.dev.conf')
 
 // default port where dev server listens for incoming traffic
-var port = process.env.PORT || config.dev.port
+const port = process.env.PORT || config.dev.port
+// if 8080 port is bound
+
 // automatically open browser, if not set will be false
-var autoOpenBrowser = !!config.dev.autoOpenBrowser
+const autoOpenBrowser = !!config.dev.autoOpenBrowser
 // Define HTTP proxies to your custom API backend
 // https://github.com/chimurai/http-proxy-middleware
-var proxyTable = config.dev.proxyTable
+const proxyTable = config.dev.proxyTable
 
-var app = express()
-var compiler = webpack(webpackConfig)
+const app = express()
+const compiler = webpack(webpackConfig)
 
-var devMiddleware = require('webpack-dev-middleware')(compiler, {
+const devMiddleware = require('webpack-dev-middleware')(compiler, {
   publicPath: webpackConfig.output.publicPath,
   quiet: true
 })
 
-var hotMiddleware = require('webpack-hot-middleware')(compiler, {
+const hotMiddleware = require('webpack-hot-middleware')(compiler, {
   log: () => {}
 })
 // force page reload when html-webpack-plugin template changes
@@ -59,13 +62,13 @@ app.use(devMiddleware)
 app.use(hotMiddleware)
 
 // serve pure static assets
-var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
+const staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory)
 app.use(staticPath, express.static('./demos/assets'))
 
-var uri = 'http://localhost:' + port
+const uri = 'http://localhost:' + port
 
-var _resolve
-var readyPromise = new Promise(resolve => {
+let _resolve
+const readyPromise = new Promise(resolve => {
   _resolve = resolve
 })
 
@@ -79,7 +82,7 @@ devMiddleware.waitUntilValid(() => {
   _resolve()
 })
 
-var server = app.listen(port)
+const server = app.listen(port)
 
 module.exports = {
   ready: readyPromise,

build/utils.js

@@ -1,6 +1,6 @@
-var path = require('path')
-var config = require('../config')
-var ExtractTextPlugin = require('extract-text-webpack-plugin')
+const path = require('path')
+const config = require('../config')
+const ExtractTextPlugin = require('extract-text-webpack-plugin')
 
 exports.assetsPath = function (_path) {
   var assetsSubDirectory = process.env.NODE_ENV === 'production'
@@ -68,4 +68,4 @@ exports.styleLoaders = function (options) {
     })
   }
   return output
-}
+}

src/Pano.vue

@@ -5,7 +5,7 @@
 
 <script>
 import PanoLens from './lib/panolens'
-const _log = console.log.bind(console);
+const _log = console.log.bind(console)
 
 export default {
   name: 'Pano',
@@ -39,11 +39,17 @@ export default {
       panorama: null
     }
   },
-  
+
   created () {
     window.addEventListener('resize', this.onResize, false)
   },
 
+  destroyed () {
+    if (this.panorama.dispose) {
+      this.panorama.dispose()
+    }
+  },
+
   mounted () {
     if (this.width === undefined || this.height === undefined) {
       this.size = {
@@ -79,8 +85,8 @@ export default {
       }
     },
     loadPano () {
-      _log('this.source = ' + this.source);
-      if (!this.source) return;
+      _log('this.source = ' + this.source)
+      if (!this.source) return
 
       switch (this.type) {
         case 'cube':
@@ -94,7 +100,6 @@ export default {
           break
         case 'video':
           this.panorama = new PanoLens.VideoPanorama(this.source, { autoplay: true })
-          console.log('this is video')
           break
         default:
           this.panorama = new PanoLens.ImagePanorama(this.source)

src/Scene.vue

@@ -120,7 +120,6 @@ export default {
           break
         case 'video':
           this.panorama = new PanoLens.VideoPanorama(source, { autoplay: true })
-          _log('this is video')
           break
         default:
           this.panorama = new PanoLens.ImagePanorama(source)