@realsee/vreo 0.1.0

package/lib/Player/modules/keyframes/Prompter/index.js

@@ -0,0 +1,105 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Prompter = Prompter;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _hooks = require("../../../hooks");
+
+var _reactTransitionGroup = require("react-transition-group");
+
+var _VreoUnit = require("../../../../typings/VreoUnit");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+function Prompter() {
+  var _React$useState = React.useState(''),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      text = _React$useState2[0],
+      setText = _React$useState2[1];
+
+  var _React$useState3 = React.useState(true),
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      hidden = _React$useState4[0],
+      setHidden = _React$useState4[1];
+
+  var ref = React.useRef(null);
+  var controller = (0, _hooks.useController)();
+  React.useEffect(function () {
+    var _controller$configs;
+
+    if (((_controller$configs = controller.configs) === null || _controller$configs === void 0 ? void 0 : _controller$configs.keyframeMap.Prompter) === false) {
+      return;
+    }
+
+    var callback = function callback(keyframe) {
+      var start = keyframe.start,
+          end = keyframe.end,
+          data = keyframe.data;
+      setText(data.text);
+      setHidden(false);
+
+      if (ref.current) {
+        clearTimeout(ref.current);
+        ref.current = null;
+      }
+
+      ref.current = setTimeout(function () {
+        setHidden(true);
+        setTimeout(function () {
+          return setText('');
+        }, 500);
+        if (ref.current) clearTimeout(ref.current);
+        ref.current = null;
+      }, end - start);
+    };
+
+    controller.on(_VreoUnit.VreoKeyframeEnum.Prompter, callback);
+    return function () {
+      controller.off(_VreoUnit.VreoKeyframeEnum.Prompter, callback);
+    };
+  }, [controller]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: (0, _classnames["default"])('vreo-prompter', {
+      'vreo-prompter--hidden': hidden
+    })
+  }, text ?
+  /*#__PURE__*/
+
+  /* @warning "index.js:1 Warning: findDOMNode is deprecated in StrictMode." */
+  React.createElement(_reactTransitionGroup.TransitionGroup, {
+    className: "vreo-prompter-text"
+  }, /*#__PURE__*/React.createElement(_reactTransitionGroup.CSSTransition, {
+    key: text,
+    classNames: "vreo-prompter-text-transition",
+    timeout: 500,
+    addEndListener: function addEndListener(node, done) {
+      return node.addEventListener('transitionend', done, false);
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "vreo-prompter-innerText"
+  }, text))) : undefined);
+}

package/lib/Player/modules/keyframes/UpdateVRPanorama/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function UpdateVRPanorama(): JSX.Element;

package/lib/Player/modules/keyframes/UpdateVRPanorama/index.js

@@ -0,0 +1,51 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.UpdateVRPanorama = UpdateVRPanorama;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _five = require("@realsee/five");
+
+var _hooks = require("../../../hooks");
+
+var _VreoUnit = require("../../../../typings/VreoUnit");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function UpdateVRPanorama() {
+  var controller = (0, _hooks.useController)();
+  var five = (0, _hooks.useFiveInstance)();
+  React.useEffect(function () {
+    var callback = function callback(keyframe) {
+      var _five$work;
+
+      var _ref = keyframe.data,
+          panoIndex = _ref.panoIndex,
+          images = _ref.images;
+      var newWorkJSON = JSON.parse(JSON.stringify((_five$work = five.work) === null || _five$work === void 0 ? void 0 : _five$work.raw.work)); // // 原Work数据不能被修改
+
+      if (newWorkJSON.panorama && newWorkJSON.panorama.list && newWorkJSON.panorama.list[panoIndex]) {
+        Object.assign(newWorkJSON.panorama.list[panoIndex], images);
+      } else if (newWorkJSON.observers && newWorkJSON.observers[panoIndex] && newWorkJSON.observers[panoIndex].images) {
+        Object.assign(newWorkJSON.observers[panoIndex].images, images);
+      }
+
+      var newWork = (0, _five.parseWork)(newWorkJSON); // // 需要还原么？待定 ...
+
+      five.load(newWork);
+    };
+
+    controller.on(_VreoUnit.VreoKeyframeEnum.UpdateVRPanorama, callback);
+    return function () {
+      controller.off(_VreoUnit.VreoKeyframeEnum.UpdateVRPanorama, callback);
+    };
+  }, [controller]);
+  return /*#__PURE__*/React.createElement(React.Fragment, null);
+}

package/lib/Player/modules/keyframes/VideoEffect/index.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+export declare function VideoEffect(): JSX.Element;

package/lib/Player/modules/keyframes/VideoEffect/index.js

@@ -0,0 +1,176 @@
+"use strict";
+
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.VideoEffect = VideoEffect;
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _VreoUnit = require("../../../../typings/VreoUnit");
+
+var _hooks = require("../../../hooks");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+var inlinePlay = function inlinePlay(videoInstance) {
+  if (!videoInstance) return;
+
+  var canplaythrough = function canplaythrough() {
+    videoInstance.removeEventListener('canplaythrough', canplaythrough);
+
+    try {
+      videoInstance.play();
+    } catch (error) {}
+  };
+
+  videoInstance.addEventListener('canplaythrough', canplaythrough);
+  videoInstance.load();
+}; // const emptyVideo = '//vrlab-static.ljcdn.com/release/web/leisure.69fd3522.mov'
+
+
+var PI = Math.PI;
+var PI_2 = PI * 2;
+
+function VideoEffect() {
+  var ref = React.useRef(null);
+  var videoRef = React.useRef();
+  var controller = (0, _hooks.useController)();
+  var timeoutRef = React.useRef();
+
+  var _React$useState = React.useState(false),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      visible = _React$useState2[0],
+      setVisible = _React$useState2[1];
+
+  var five = (0, _hooks.useFiveInstance)();
+
+  var setBlobSrc = function setBlobSrc(blob) {
+    if (!videoRef.current) return;
+    videoRef.current.src = blob;
+  };
+
+  React.useEffect(function () {
+    var callback = /*#__PURE__*/function () {
+      var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(keyframe) {
+        var start, end, _ref2, videoSrc, fov, direction, panoIndex, vector, _ref3, _ref4, longitude, latitude;
+
+        return regeneratorRuntime.wrap(function _callee$(_context) {
+          while (1) {
+            switch (_context.prev = _context.next) {
+              case 0:
+                start = keyframe.start, end = keyframe.end;
+                _ref2 = keyframe.data, videoSrc = _ref2.videoSrc, fov = _ref2.fov, direction = _ref2.direction, panoIndex = _ref2.panoIndex, vector = _ref2.vector;
+                _ref3 = function () {
+                  if (vector) {
+                    return [vector.longitude, vector.latitude];
+                  }
+
+                  if (!direction) {
+                    return [0, 0];
+                  }
+
+                  var longitude = -Math.atan2(direction.x, -direction.z);
+                  longitude = (longitude % PI_2 + PI_2) % PI_2;
+                  var latitude = -Math.asin(direction.y / 1);
+                  return [longitude, latitude];
+                }(), _ref4 = _slicedToArray(_ref3, 2), longitude = _ref4[0], latitude = _ref4[1];
+                five.setState({
+                  fov: fov,
+                  panoIndex: panoIndex,
+                  longitude: longitude,
+                  latitude: latitude
+                }, true);
+                setBlobSrc(videoSrc);
+                inlinePlay(videoRef.current);
+                setVisible(true);
+                timeoutRef.current = setTimeout(function () {
+                  var _videoRef$current;
+
+                  if (!((_videoRef$current = videoRef.current) !== null && _videoRef$current !== void 0 && _videoRef$current.paused)) {
+                    var _videoRef$current2;
+
+                    (_videoRef$current2 = videoRef.current) === null || _videoRef$current2 === void 0 ? void 0 : _videoRef$current2.pause();
+                  }
+
+                  setVisible(false);
+                  setBlobSrc('');
+                }, end - start);
+
+              case 8:
+              case "end":
+                return _context.stop();
+            }
+          }
+        }, _callee);
+      }));
+
+      return function callback(_x) {
+        return _ref.apply(this, arguments);
+      };
+    }();
+
+    controller.on(_VreoUnit.VreoKeyframeEnum.VideoEffect, callback);
+    return function () {
+      controller.off(_VreoUnit.VreoKeyframeEnum.VideoEffect, callback);
+
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, [controller]);
+  React.useEffect(function () {
+    var _controller$configs, _controller$configs$v;
+
+    if (!ref.current) return;
+    var video = ((_controller$configs = controller.configs) === null || _controller$configs === void 0 ? void 0 : (_controller$configs$v = _controller$configs.videos) === null || _controller$configs$v === void 0 ? void 0 : _controller$configs$v.videoEffect) || document.createElement('video'); // <video playsInline key="VideoEffect-video" className="VideoEffect-video" src={blobSrc} />
+
+    video.setAttribute('playsinline', 'true');
+    video.setAttribute('webkit-playsinline', 'true');
+    video.setAttribute('autoplay', 'true');
+    video.setAttribute('key', 'VideoEffect-video');
+    video.setAttribute('class', 'VideoEffect-video');
+    videoRef.current = video;
+    ref.current.append(videoRef.current);
+    document.addEventListener('WeixinJSBridgeReady', function () {
+      var _videoRef$current3;
+
+      (_videoRef$current3 = videoRef.current) === null || _videoRef$current3 === void 0 ? void 0 : _videoRef$current3.play();
+    }, false);
+    if (!ref.current) return; // const asyncfunc = async () => {
+    //   setBlobSrc(await URL.createObjectURL(await Preloader.blob(emptyVideo)))
+    //   inlinePlay(videoRef.current)
+    // }
+    // asyncfunc()
+  }, []);
+  return /*#__PURE__*/React.createElement("div", {
+    ref: ref,
+    className: (0, _classnames["default"])('VideoEffect', {
+      'VideoEffect--visible': visible
+    })
+  });
+}

package/lib/Player/typings.d.ts

@@ -0,0 +1,14 @@
+import { VreoKeyframeConfigMap } from '../typings/VreoUnit';
+export interface PlayerConfigs {
+    containter?: ReactDOM.Container;
+    keyframeMap: VreoKeyframeConfigMap;
+    /**
+     * 微信端自动播放功能实现需要提前初始化 Video 实例。
+     *
+     * 如果需要支持微信浏览器端自动播放需要接入微信SDK及提前初始化好相关 Video 实例。
+     */
+    videos?: {
+        videoEffect?: HTMLVideoElement;
+        modelTVVideo?: HTMLVideoElement;
+    };
+}

package/lib/Player/typings.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/fivePlugins/CameraMovementPlugin/index.d.ts

@@ -0,0 +1,6 @@
+import type { FivePlugin } from '@realsee/five';
+import { CameraMovementPluginParameterType, CameraMovementPluginExportType } from './typings';
+/**
+ * **运镜插件** 模拟类似于电影运镜效果。
+ */
+export declare const CameraMovementPlugin: FivePlugin<CameraMovementPluginParameterType, CameraMovementPluginExportType>;

package/lib/fivePlugins/CameraMovementPlugin/index.js

@@ -0,0 +1,307 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.CameraMovementPlugin = void 0;
+
+var _five = require("@realsee/five");
+
+var _typings = require("./typings");
+
+var _tween = require("../../shared-utils/animationFrame/tween");
+
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+var PI_2 = Math.PI * 2;
+
+function formatLatitude(rad) {
+  return rad % PI_2;
+}
+
+function formatLongitude(rad) {
+  return (rad % PI_2 + PI_2) % PI_2;
+}
+
+var getLongitudeParams = function getLongitudeParams(from, to, rotation) {
+  var PI = Math.PI;
+  var PI_2 = PI * 2;
+  from = formatLongitude(from);
+  to = formatLongitude(to); // 逆时针旋转，初始值必须是较大的值
+
+  if (rotation === _typings.Rotation.Anticlockwise && from < to) from += PI_2; // 顺时针旋转，结束值必须是较大值
+
+  if (rotation === _typings.Rotation.Clockwise && to < from) to += PI_2; // Loop 旋转，找锐角旋转
+  // 如果 to 比 from 大 180°，逆时针转
+  // 如果 from 比 to 大 180°，顺时针转
+
+  if (rotation === _typings.Rotation.Loop && to - from > PI) return getLongitudeParams(from, to, _typings.Rotation.Anticlockwise);
+  if (rotation === _typings.Rotation.Loop && from - to > PI) return getLongitudeParams(from, to, _typings.Rotation.Clockwise);
+  return {
+    from: from,
+    to: to
+  };
+};
+
+function progressNumber(from, to, pst) {
+  return from + (to - from) * pst;
+}
+/**
+ * **运镜插件** 模拟类似于电影运镜效果。
+ */
+
+
+var CameraMovementPlugin = function CameraMovementPlugin(five) {
+  var move = /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(args, duration) {
+      var opts,
+          _args = arguments;
+      return regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              opts = _args.length > 2 && _args[2] !== undefined ? _args[2] : {
+                preload: true
+              };
+
+              if (opts.asyncStartCallback) {
+                opts.asyncStartCallback();
+              }
+
+              if (!(args.mode && args.mode !== five.currentMode)) {
+                _context.next = 5;
+                break;
+              }
+
+              _context.next = 5;
+              return new Promise(function (resolve) {
+                if (!args.mode) return;
+                five.once('modeChange', function (mode) {
+                  five.once('initAnimationEnded', function () {
+                    if (mode === args.mode) {
+                      resolve(true);
+                    }
+                  });
+                });
+                five.changeMode(args.mode, {
+                  fov: args.fov || undefined,
+                  latitude: args.latitude || undefined,
+                  longitude: args.longitude || undefined,
+                  panoIndex: args.panoIndex || undefined
+                });
+              });
+
+            case 5:
+              if (!(args.mode === _five.Five.Mode.Floorplan)) {
+                _context.next = 7;
+                break;
+              }
+
+              return _context.abrupt("return", true);
+
+            case 7:
+              if (!(opts.preload && args.panoIndex !== undefined && args.panoIndex !== five.panoIndex)) {
+                _context.next = 10;
+                break;
+              }
+
+              _context.next = 10;
+              return five.preloadPano(args.panoIndex);
+
+            case 10:
+              if (opts.asyncEndCallback) {
+                opts.asyncEndCallback();
+              }
+
+              if (!(args.panoIndex === undefined && args.fov === undefined && args.latitude === undefined && args.longitude === undefined)) {
+                _context.next = 13;
+                break;
+              }
+
+              return _context.abrupt("return", true);
+
+            case 13:
+              _context.next = 15;
+              return new Promise(function (resolve, reject) {
+                var panoIndex = args.panoIndex !== undefined ? args.panoIndex : five.panoIndex;
+
+                if (panoIndex !== undefined) {
+                  five.moveToPano(panoIndex, Object.assign({
+                    duration: duration,
+                    // 移动耗时
+                    moveEndCallback: function moveEndCallback() {
+                      return resolve(true);
+                    },
+                    // 移动结束
+                    moveCancelCallback: function moveCancelCallback() {
+                      return reject(false);
+                    } // 移动开始
+
+                  }, args));
+                } else {
+                  reject(false);
+                }
+              });
+
+            case 15:
+              return _context.abrupt("return", _context.sent);
+
+            case 16:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    return function move(_x, _x2) {
+      return _ref.apply(this, arguments);
+    };
+  }();
+
+  var getAnimeParams = function getAnimeParams(args) {
+    var currentFiveState = five.state; // latitude
+
+    var fromLatitude = formatLatitude(currentFiveState.latitude);
+    var toLatitude = formatLatitude(args.latitude); // longitude
+
+    var _getLongitudeParams = getLongitudeParams(currentFiveState.longitude, args.longitude, args.rotation || _typings.Rotation.Loop),
+        fromLongitude = _getLongitudeParams.from,
+        toLongitude = _getLongitudeParams.to; // fov
+
+
+    var fromFov = currentFiveState.fov;
+    var toFov = args.fov;
+    return {
+      from: {
+        latitude: fromLatitude,
+        longitude: fromLongitude,
+        fov: fromFov
+      },
+      to: {
+        latitude: toLatitude,
+        longitude: toLongitude,
+        fov: toFov
+      }
+    };
+  };
+
+  var rotate = /*#__PURE__*/function () {
+    var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(args, duration) {
+      var opts,
+          _getAnimeParams,
+          from,
+          to,
+          _args2 = arguments;
+
+      return regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              opts = _args2.length > 2 && _args2[2] !== undefined ? _args2[2] : {};
+
+              if (opts.asyncStartCallback) {
+                opts.asyncStartCallback();
+              }
+
+              if (!(five.currentMode !== _five.Five.Mode.Panorama)) {
+                _context2.next = 5;
+                break;
+              }
+
+              _context2.next = 5;
+              return five.changeMode(_five.Five.Mode.Panorama);
+
+            case 5:
+              if (!(args.panoIndex !== undefined && args.panoIndex !== five.panoIndex)) {
+                _context2.next = 11;
+                break;
+              }
+
+              if (!opts.preload) {
+                _context2.next = 9;
+                break;
+              }
+
+              _context2.next = 9;
+              return five.preloadPano(args.panoIndex);
+
+            case 9:
+              _context2.next = 11;
+              return new Promise(function (resolve, reject) {
+                five.moveToPano(args.panoIndex, {
+                  moveEndCallback: function moveEndCallback() {
+                    return resolve(true);
+                  },
+                  // 移动结束
+                  moveCancelCallback: function moveCancelCallback() {
+                    return reject(false);
+                  } // 移动开始
+
+                });
+              });
+
+            case 11:
+              if (opts.asyncEndCallback) {
+                opts.asyncEndCallback();
+              }
+
+              _getAnimeParams = getAnimeParams(args), from = _getAnimeParams.from, to = _getAnimeParams.to;
+              _context2.next = 15;
+              return new Promise(function (resolve, reject) {
+                var onUpdate = function onUpdate(_ref3) {
+                  var progress = _ref3.progress;
+                  var state = {};
+                  state.longitude = progressNumber(from.longitude, to.longitude, progress);
+                  state.latitude = progressNumber(from.latitude, to.latitude, progress);
+                  state.fov = progressNumber(from.fov, to.fov, progress);
+                  five.setState(state, true);
+                };
+
+                var onComplete = function onComplete() {
+                  resolve(true);
+                };
+
+                var onDestroy = function onDestroy() {
+                  resolve(false);
+                };
+
+                var animeDuration = args.rotateSpeed ? Math.ceil(Math.abs(to.longitude - from.longitude) / args.rotateSpeed * 1000) : duration;
+                var tween = (0, _tween.tweenProgress)(animeDuration, _tween.Easing.Linear.None).onUpdate(onUpdate).onComplete(onComplete).onDestroy(onDestroy);
+
+                if (args.rotation === _typings.Rotation.Loop) {
+                  tween.repeat(Infinity).yoyo(true);
+                }
+
+                setTimeout(function () {
+                  // 总时间到了之后强制结束，同时也是 Loop 模式的结束方式
+                  tween.destroy();
+                  resolve(true);
+                }, duration);
+              });
+
+            case 15:
+              return _context2.abrupt("return", _context2.sent);
+
+            case 16:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+
+    return function rotate(_x3, _x4) {
+      return _ref2.apply(this, arguments);
+    };
+  }();
+
+  return {
+    move: move,
+    rotate: rotate
+  };
+};
+
+exports.CameraMovementPlugin = CameraMovementPlugin;