[OpenLayers-Trac] Re: [OpenLayers] #2077: Standardise CSS styling of all OL Controls, and give appropriate map controls a CSS style to prevent them printing

OpenLayers trac-20090302 at openlayers.org
Mon Aug 15 22:24:53 EDT 2011


#2077: Standardise CSS styling of all OL Controls, and give appropriate map
controls a CSS style to prevent them printing
--------------------------------------------------------+-------------------
 Reporter:  CharlesHarrison                             |       Owner:              
     Type:  feature                                     |      Status:  new         
 Priority:  major                                       |   Milestone:  2.12 Release
Component:  Control                                     |     Version:  2.8 RC2     
 Keywords:  standardise displayClass CSS disable print  |       State:              
--------------------------------------------------------+-------------------

Comment(by CharlesHarrison):

 Replying to [comment:5 CharlesHarrison]:

 > 3)    Controls that have no meaning on a printout because they are
 solely to do with manipulating the map nevertheless usually print.[[BR]]

 The fix for this is easy  -  append to style.css something like the
 following (the Overview Map buttons, but not the Overview Map itself, need
 to be included, but I haven't tried to do that in this brief test):

 @media print {
 .olControlLayerSwitcher, .olControlLayerSwitcher *,
 .olControlNavToolbar, .olControlNavToolbar *,
 .olControlPanPanel, .olControlPanPanel *,
 .olControlPanZoomBar, .olControlPanZoomBar *,
 .olControlPanel, .olControlPanel *,
 .olControlZoomPanel, .olControlZoomPanel *
         { display:none; }
 }

 Further issues have come to light regarding the Panel control.

 1)      Instead of, as it should, allowing each control in the panel
 (hereinafter referred to as a sub-control) to create its own div, in a
 manner appropriate to that sub-control, it creates empty divs for each,
 thus throwing away any special features or attributes that the control may
 have created for itself.  The Panel needs to let the sub-control draw
 itself, and then observe the clicks on the div that the sub-control has
 created in order to create the functionality for the panel.

 2)      Secondly, the values and testing for the following constants show
 lack of forethought.  It's common for such systems to create bitwise flags
 using the values 1,2,4 etc, so that characteristics can be combined but
 still tested for individually, and that should have been done here  -
 what if one wants a radio-button style functionality (TYPE_TOOL) but still
 trigger a function when a button is clicked (TYPE_BUTTON)?

 /**
  * Constant: OpenLayers.Control.TYPE_BUTTON
  */
 OpenLayers.Control.TYPE_BUTTON = 1;

 /**
  * Constant: OpenLayers.Control.TYPE_TOGGLE
  */
 OpenLayers.Control.TYPE_TOGGLE = 2;

 /**
  * Constant: OpenLayers.Control.TYPE_TOOL
  */
 OpenLayers.Control.TYPE_TOOL   = 3;

 3)      Thirdly by relying on the background-image CSS property to display
 the buttons, they are guaranteed to be invisible under some situations.
 What if a user needs or simply prefers to force all the colours on every
 site that (s)he visits to be either white on black or black on white?
 Having operating system desktop colours that have white text on a black
 background shows that probably the majority of sites on the web currently
 have broken colour schemes, so needing to fix them in the browser is not
 uncommon.  This can be done in FF, for example, by choosing Tools,
 Options, Content, Colours, select Use system colours, unselect Allow pages
 to choose their own colours.  In this situation, background images do not
 show, and the panel buttons are all invisible!

 They need to be put into an image tag like conventional images, but of
 course they can't be, because even if Button is sub-classed to do it,
 Panel throws all the work away :-(

 Sigh!

 Also, as previously demoed, certain controls need to be given sensible
 dimensions so that they don't trap mouse events over more of the map than
 they themselves need at a minimum to function properly.

-- 
Ticket URL: <http://trac.openlayers.org/ticket/2077#comment:6>
OpenLayers <http://openlayers.org/>
A free AJAX map viewer


More information about the Trac mailing list