﻿/**
* Class: OpenLayers.Control.StyledOverviewMap
*
* Inherits from:
*  - <OpenLayers.Control.OverviewMap>
*/
OpenLayers.Control.StyledOverviewMap =
    OpenLayers.Class(OpenLayers.Control.OverviewMap, {

        /**
        * Property: minRectSize
        * Overrides the default 16 pixel 
        */
        minRectSize: 4,

        initialize: function() {
            OpenLayers.Control.OverviewMap.prototype.initialize.apply(this, arguments);
        },

        /**
        * Method: draw
        * Render the control in the browser.
        */
        draw: function() {
            OpenLayers.Control.prototype.draw.apply(this, arguments);
            if (!(this.layers.length > 0)) {
                if (this.map.baseLayer) {
                    var layer = this.map.baseLayer.clone();
                    this.layers = [layer];
                } else {
                    this.map.events.register("changebaselayer", this, this.baseLayerDraw);
                    return this.div;
                }
            }

            // create overview map DOM elements
            this.element = document.createElement('div');
            this.element.className = this.displayClass + 'Element';
            this.element.style.display = 'none';

            this.mapDiv = document.createElement('div');
            this.mapDiv.style.width = this.size.w + 'px';
            this.mapDiv.style.height = this.size.h + 'px';
            this.mapDiv.style.position = 'relative';
            this.mapDiv.style.overflow = 'hidden';
            //this.mapDiv.style.display = 'block';
            this.mapDiv.id = OpenLayers.Util.createUniqueID('overviewMap');

            this.extentRectangle = document.createElement('div');
            this.extentRectangle.style.position = 'absolute';
            this.extentRectangle.style.zIndex = 1000;  //HACK
            this.extentRectangle.className = this.displayClass + 'ExtentRectangle';
            this.mapDiv.appendChild(this.extentRectangle);

            this.element.appendChild(this.mapDiv);

            this.div.appendChild(this.element);

            // Optionally add min/max buttons if the control will go in the
            // map viewport.
            if (!this.outsideViewport) {
                this.div.className += " " + this.displayClass + 'Container';
                var imgLocation = OpenLayers.Util.getImagesLocation();
                // maximize button div
                var img = imgLocation + 'overview-map-maximize.png';
                this.maximizeDiv = OpenLayers.Util.createAlphaImageDiv(
                                        this.displayClass + 'MaximizeButton',
                                        null,
                                        new OpenLayers.Size(207, 18),
                                        img,
                                        'absolute');
                this.maximizeDiv.style.display = 'none';
                this.maximizeDiv.className = this.displayClass + 'MaximizeButton';
                OpenLayers.Event.observe(this.maximizeDiv, 'click',
                    OpenLayers.Function.bindAsEventListener(this.maximizeControl,
                                                        this));

                this.div.appendChild(this.maximizeDiv);

                // minimize button div
                var img = imgLocation + 'overview-map-minimize.png';
                this.minimizeDiv = OpenLayers.Util.createAlphaImageDiv(
                //'OpenLayers_Control_minimizeDiv',
                                        this.displayClass + 'MinimizeButton',
                                        null,
                                        new OpenLayers.Size(207, 18),
                                        img,
                                        'absolute');
                this.minimizeDiv.style.display = 'none';
                this.minimizeDiv.className = this.displayClass + 'MinimizeButton';
                OpenLayers.Event.observe(this.minimizeDiv, 'click',
                    OpenLayers.Function.bindAsEventListener(this.minimizeControl,
                                                        this));

                this.div.appendChild(this.minimizeDiv);

                var eventsToStop = ['dblclick', 'mousedown'];

                for (var i = 0; i < eventsToStop.length; i++) {

                    OpenLayers.Event.observe(this.maximizeDiv,
                                         eventsToStop[i],
                                         OpenLayers.Event.stop);

                    OpenLayers.Event.observe(this.minimizeDiv,
                                         eventsToStop[i],
                                         OpenLayers.Event.stop);
                }

                this.minimizeControl();
            } else {
                // show the overview map
                this.element.style.display = '';
            }
            if (this.map.getExtent()) {
                this.update();
            }

            this.map.events.register('moveend', this, this.update);

            return this.div;
        },

        createMap: function() {

            OpenLayers.Control.OverviewMap.prototype.createMap.apply(this, arguments);

            // check extent rectangle border width (overwrite, default to border-width=4)
            this.wComp = parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
                                               'border-left-width')) +
                     parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
                                               'border-right-width'));
            this.wComp = (this.wComp) ? this.wComp : 4;
            this.hComp = parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
                                               'border-top-width')) +
                     parseInt(OpenLayers.Element.getStyle(this.extentRectangle,
                                               'border-bottom-width'));
            this.hComp = (this.hComp) ? this.hComp : 4;

        },
        /**
        * Method: setRectPxBounds
        * Set extent rectangle pixel bounds.
        *
        * Parameters:
        * pxBounds - {<OpenLayers.Bounds>}
        */
        setRectPxBounds: function(pxBounds) {
            try {
                var top = Math.max(pxBounds.top, 0);
                var left = Math.max(pxBounds.left, 0);
                var bottom = Math.min(pxBounds.top + Math.abs(pxBounds.getHeight()),
                              this.ovmap.size.h - this.hComp);
                var right = Math.min(pxBounds.left + pxBounds.getWidth(),
                             this.ovmap.size.w - this.wComp);
                var width = Math.max(right - left, 0);
                var height = Math.max(bottom - top, 0);
                if (width < this.minRectSize || height < this.minRectSize) {
                    this.extentRectangle.className = this.displayClass +
                                             this.minRectDisplayClass;
                    var rLeft = left + (width / 2) - (this.minRectSize / 2);
                    var rTop = top + (height / 2) - (this.minRectSize / 2);
                    this.extentRectangle.style.top = Math.round(rTop) + 'px';
                    this.extentRectangle.style.left = Math.round(rLeft) + 'px';
                    this.extentRectangle.style.height = this.minRectSize + 'px';
                    this.extentRectangle.style.width = this.minRectSize + 'px';
                } else {
                    this.extentRectangle.className = this.displayClass +
                                             'ExtentRectangle';
                    this.extentRectangle.style.top = Math.round(top) + 'px';
                    this.extentRectangle.style.left = Math.round(left) + 'px';
                    this.extentRectangle.style.height = Math.round(height) + 'px';
                    this.extentRectangle.style.width = Math.round(width) + 'px';
                }
                this.rectPxBounds = new OpenLayers.Bounds(
            Math.round(left), Math.round(bottom),
            Math.round(right), Math.round(top)
            );
            } catch (e)
           { }
        },

        CLASS_NAME: "OpenLayers.Control.StyledOverviewMap"
    });       
