add marker begin

src/scripts/Components/Marker.js

@@ -0,0 +1,20 @@
+// @flow
+
+import type { Player, MarkerSettings } from '../types';
+import Component from './Component';
+
+const defaults = {
+    duration: -1
+};
+
+class Marker extends Component{
+    constructor(player: Player, options: MarkerSettings){
+        super(player, options);
+    }
+
+    attachEvents(){
+
+    }
+}
+
+export default Marker;

src/scripts/Panorama.js

@@ -94,7 +94,9 @@ export const defaults: Settings = {
         Enable: true,
         Message: "Please use your mouse drag and drop the video.",
         HideTime: 3000,
-    }
+    },
+
+    Markers: []
 };
 
 /**

src/scripts/types/Settings.js

@@ -3,10 +3,31 @@ import { Point } from './Point';
 
 export type VideoTypes = "equirectangular" | "fisheye" | "3dVideo" | "dual_fisheye";
 
-export type NativePlayer = {
-    poster?: string;
-    controls?: boolean;
-};
+export type MarkerSettings = {
+    lat: number;
+    lon: number;
+    radius: number;
+
+    /**
+     * use custom dom
+     */
+    element?: HTMLElement;
+
+    /**
+     * timeline when should marker be shown
+     */
+    keyPoint: number;
+
+    /**
+     * when should marker disappear, set -1 if you don't want it disappear
+     */
+    duration: number;
+
+    /**
+     * callback function when marker is disappear
+     */
+    complete?: Function;
+}
 
 /**
  * panorama settings options
@@ -113,7 +134,7 @@ export type Settings = {
         HideTime?: number;
     };
 
-    NativePlayer?: NativePlayer;
+    Markers?: MarkerSettings[],
 
     ready?: Function;