/**
 * @classdesc
 * A control to allows to display attribution data in a small text box on the map.
 * @class
 * @category control
 * @extends maptalks.Control
 * @memberOf maptalks.control
 * @name Attribution
 * @param {Object} options - construct options
 */
Z.control.Overview = Z.Control.extend(/** @lends maptalks.control.Attribution.prototype */{

    /**
     * @param {Object} options - options
     * @param {Object} [options.position={"bottom":0,"right":0}] - position of the control
     * @param {Number} [options.level=4]  - the zoom level of the overview
     * @param {Object} [options.size={"width":300, "height":200}  - size of the Control
     * @param {Object} [options.style={"color":"#1bbc9b"}] - style of the control, color is the overview rectangle's color
     */
    options:{
        'level' : 4,
        'position' : {
            'bottom': '0',
            'right': '0'
        },
        'size' : {
            'width' : 300,
            'height' : 200
        },
        'style' : {
            'color' : '#1bbc9b'
        }
    },

    buildOn: function (map) {
        var container = Z.DomUtil.createEl('div');
        container.style.cssText = 'border:1px solid #000;width:' + this.options['size']['width'] + 'px;height:' + this.options['size']['height'] + 'px;';
        if (map.isLoaded()) {
            this._initOverview(container);
        } else {
            map.on('load', this._initOverview, this);
        }
        return container;
    },

    _initOverview : function (container) {
        var map = this.getMap(),
            container = container || this.getDOM(),
            extent = map.getExtent();
        this._overview = new Z.Map(container, {
            'center' : map.getCenter(),
            'zoom'   : this._getOverviewZoom(),
            'scrollWheelZoom' : false,
            'doubleClickZoom' : false,
            'touchZoom' : false
        });
        this._updateBaseLayer();
        this._perspective = new Z.Polygon(extent.toArray(), {
            'draggable' : true,
            'cursor' : 'move',
            'symbol' : {
                'lineWidth' : 3,
                'lineColor' : this.options['style']['color'],
                'polygonFill' : this.options['style']['color'],
                'polygonOpacity' : 0.4,
            }
        })
        .on('dragstart', this._onDragStart, this)
        .on('dragend', this._onDragEnd, this);
        map.on('moveend zoomend', this._update, this)
            .on('setbaselayer', this._updateBaseLayer, this);
        var v = new Z.VectorLayer('v').addGeometry(this._perspective).addTo(this._overview);
    },

    _onRemove : function (map) {
        map.off('load', this._initOverview, this)
            .off('moveend zoomend', this._update, this)
            .off('setbaselayer', this._updateBaseLayer, this);
    },

    _getOverviewZoom : function () {
        var map = this.getMap(),
            zoom = map.getZoom(),
            minZoom = map.getMinZoom(),
            level = this.options['level']            ;
        if (level > 0) {
            for (var i = level; i > 0; i--) {
                if (zoom - i >= minZoom) {
                    return zoom - i;
                }
            }
        } else {
            for (var i = level; i < 0; i++) {
                if (zoom - i >= minZoom) {
                    return zoom - i;
                }
            }
        }

        return zoom;
    },

    _onDragStart: function () {
        this._origDraggable = this.getMap().options['draggable'];
        this.getMap().config('draggable', false);
    },

    _onDragEnd : function (param) {
        var center = this._perspective.getCenter();
        this._overview.setCenter(center);
        this.getMap().panTo(center);
        this.getMap().config('draggable', this._origDraggable);
    },

    _update : function () {
        this._perspective.setCoordinates(this.getMap().getExtent().toArray());
        this._overview.setCenterAndZoom(this.getMap().getCenter(), this._getOverviewZoom());
        // this._overview.panTo();
    },

    _updateBaseLayer: function () {
        var map = this.getMap();
        if (map.getBaseLayer()) {
            this._overview.setBaseLayer(Z.Layer.fromJSON(map.getBaseLayer().toJSON()))
        } else {
            this._overview.setBaseLayer(null);
        }
    }

});

Z.Map.mergeOptions({
    'overviewControl' : false
});

Z.Map.addOnLoadHook(function () {
    if (this.options['overviewControl']) {
        this.overviewControl = new Z.control.Overview(this.options['overviewControl']);
        this.addControl(this.overviewControl);
    }
});

@@ -1569,25 +1569,19 @@
         
-container
+dom
  = conta
@@ -1676,25 +1676,19 @@
 w Z.Map(
-container
+dom
 , %7B%0A    
@@ -2524,16 +2524,8 @@
     
- var v =
  new
@@ -3001,24 +3001,26 @@
 'level'%5D
+;%0A
         
     ;%0A  
@@ -3011,20 +3011,21 @@
         
-    
+var i
 ;%0A      
@@ -3052,36 +3052,32 @@
            for (
-var 
 i = level; i %3E 0
@@ -3231,20 +3231,16 @@
    for (
-var 
 i = leve
@@ -3591,21 +3591,16 @@
 nction (
-param
 ) %7B%0A    
@@ -4002,43 +4002,8 @@
 ));%0A
-        // this._overview.panTo();%0A
     
@@ -4195,16 +4195,17 @@
 JSON()))
+;
 %0A       

fix lint