- add BasemapControl as typescript module

src/js/controls/BasemapControl.ts

@@ -3,20 +3,42 @@ import { MobileDialog } from "./MobileDialog";
 import * as dom from '../core/domUtil';
 import * as util from '../core/utilities';
 import * as domEvent from '../core/domEvent';
+import { Map } from "../core/Map";
 
 import './BasemapControl.css';
 
+interface BasemapOptions {
+    title: string
+    position: string
+    width?: string
+    height?: string
+    parentDiv?: string
+}
+
 export class BasemapControl extends Control {
 
-    defaultTitle = '3DViewer';
+    options: BasemapOptions = {
+        title: 'Default Title',
+        position: 'topleft',
+        width: '300px',
+        height: '100%',
+        parentDiv: undefined
+    };
+
+    // private _map: Map;
+    private _layersLink;    
+    private dialog: MobileDialog
+    private basemaps: any;
 
     constructor(title, options) {
-        super(title, options);
+        // super(title, options);
+        super();
+        this.options.title = title;
         util.setOptions(this, options);
     }
 
-    onAdd(map) {
+    onAdd(map: Map): HTMLElement {
-        let container = this._initLayout(map);
+        let container: HTMLElement = this._initLayout();
         this._map = map;
         return container;
     }
@@ -37,17 +59,22 @@ export class BasemapControl extends Control {
         let html = this._initBasemapHtml(basemaps.services);
 
         // domEvent.on(link, 'click', this.expand, this);
-        domEvent.on(link, 'click', domEvent.stopPropagation);
+        domEvent.on(this._layersLink, 'click', domEvent.stopPropagation);
-        domEvent.on(link, 'mousedown', domEvent.stopPropagation);
+        domEvent.on(this._layersLink, 'mousedown', domEvent.stopPropagation);
-        domEvent.on(link, 'dblclick', domEvent.stopPropagation);
+        domEvent.on(this._layersLink, 'dblclick', domEvent.stopPropagation);
-        domEvent.on(link, 'click', domEvent.preventDefault);
+        domEvent.on(this._layersLink, 'click', domEvent.preventDefault);
-        domEvent.on(link, 'click', () => {
+        // domEvent.on(link, 'click', this.showDialog(html), this);
-                this.dialog.show(html);
+        domEvent.on(this._layersLink, 'click', () => {
-            }, this);
+            this.showDialog(html);
+        }, this);
 
         return container;
     }
 
+    private showDialog(html) {
+        this.dialog.show(html);
+    }
+
     _initBasemapHtml(basemapServices) {
 
         let buttonDiv = dom.createDom('div');
@@ -102,4 +129,11 @@ export class BasemapControl extends Control {
         }
     }
 
+    onRemove(): void {      
+        domEvent.off(this._layersLink, 'click', this.showDialog);
+        //C.destroy(this.domNode);
+        //this.getContainer().parentNode.removeChild(this.getContainer());
+        this._layersLink = null;
+    }
+
 }

src/js/controls/Control.ts

@@ -31,7 +31,7 @@ abstract class Control extends EventEmitter {
 
     abstract onRemove(map): void;
     
-    abstract onAdd(map) : HTMLElement;
+    abstract onAdd(map: any) : HTMLElement;
 
     addTo(map: Map): Control {
         this._map = map;

webpack.config.js

@@ -137,7 +137,7 @@ module.exports = (env, argv) => {
       colors: true,
     },
     // devtool: (isProduction === true) ? 'hidden-source-map' : 'inline-source-map',
-    devtool: (isProduction === true) ? 'hidden-source-map' : 'eval',
+    devtool: (isProduction === true) ? 'hidden-source-map' : 'inline-source-map',
 
     optimization: {
       minimize: isProduction,