Search code examples
openlayers

form in the viewer openlayers


hello all as I create a form within the openlayers viewer, deployed in the same way that the switch maps.

see this link: http://www.youtube.com/watch?v=bb0JqmZW7S4

thanks for any response


Solution

  • I think what the OP wants to, is to access his custom form through a button similar to the default access to the OverviewMap/LayerSwitcher in OpenLayers.

    How to do this can be extracted from how the OverviewMap control* is implemented:

    this.div.className += " " + this.displayClass + 'Container';
    var imgLocation = OpenLayers.Util.getImagesLocation();
    // maximize button div
    var img = imgLocation + 'layer-switcher-maximize.png';
    this.maximizeDiv = OpenLayers.Util.createAlphaImageDiv(
                           this.displayClass + 'MaximizeButton', 
                           null, 
                           new OpenLayers.Size(18,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 + 'layer-switcher-minimize.png';
    this.minimizeDiv = OpenLayers.Util.createAlphaImageDiv(
                           'OpenLayers_Control_minimizeDiv', 
                           null, 
                           new OpenLayers.Size(18,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, len=eventsToStop.length; i<len; i++) {
        OpenLayers.Event.observe(this.maximizeDiv, 
                                 eventsToStop[i], 
                                 OpenLayers.Event.stop);
    
        OpenLayers.Event.observe(this.minimizeDiv,
                                 eventsToStop[i], 
                                 OpenLayers.Event.stop);
    }
    

    *: Taken from the file: OpenLayers/lib/OpenLayers/Control/OverviewMap.js

    Inserting and modifying this, could be used to create the effect I think you are looking for.

    Good luck!