# HG changeset patch # User Paul Boddie # Date 1303081590 -7200 # Node ID 0131c3d7fe9c1f572aa700250dcb5a7d5003c615 # Parent 40ec2814d6eea02aa49600c0fbb19db5c0fb6126 Changed the map view to use a foreground image which is a sibling of a numbered/ordered list containing the markers. Introduced special positioned markers for the print view which are hidden in the screen view because the normal markers containing pop-up elements are themselves positioned. In the print view, the normal markers are floated around the image. Fixed the previous and next controls styling (hiding the controls) in the print view. diff -r 40ec2814d6ee -r 0131c3d7fe9c css/event-aggregator-print.css --- a/css/event-aggregator-print.css Fri Apr 15 00:14:04 2011 +0200 +++ b/css/event-aggregator-print.css Mon Apr 18 01:06:30 2011 +0200 @@ -13,8 +13,8 @@ /* Controls. */ -.previous-month, -.next-month, +.previous, +.next, .event-controls { display: none; } @@ -60,5 +60,63 @@ font-weight: bolder; } +/* Map content. */ + +.event-map-container > ol { + list-style-type: decimal !important; + counter-reset: marker 0; +} + +.event-map-container > img { + float: left; +} + +.event-map-container > ol > li { + counter-increment: marker; + float: left; + margin: 0.5em; + list-style-position: inside; +} + +.event-map-container > ol > li:before { + vertical-align: top; +} + +.event-map-container div.event-map-label-only:before { + content: counter(marker); +} + +div.event-map-label-only { + display: block; + position: absolute; + /* position and dimensions specified in the HTML */ + border: 2px solid #d00; +} + +div.event-map-label { + position: static !important; + visibility: hidden; + display: inline-block; + vertical-align: top; +} + +div.event-map-label .event-map-details { + position: static !important; + display: block; + visibility: visible; + margin: 0.5em; + padding: 0.5em; + border: 1px solid #ddd; +} + +.event-map-shadow { + visibility: hidden; +} + +.event-map-description { + visibility: visible; + background-color: transparent; +} + /* vim: tabstop=4 expandtab shiftwidth=4 */ diff -r 40ec2814d6ee -r 0131c3d7fe9c css/event-aggregator.css --- a/css/event-aggregator.css Fri Apr 15 00:14:04 2011 +0200 +++ b/css/event-aggregator.css Mon Apr 18 01:06:30 2011 +0200 @@ -311,6 +311,8 @@ .event-location-heading { text-align: center; border: 0; + border-left: 1px dotted #ddd; + border-right: 1px dotted #ddd; background-color: #ffffff; } @@ -392,22 +394,37 @@ .event-map-container { position: relative; + margin: 0; + padding: 0; + text-align: left; +} + +.event-map-container > img { + margin: 0; + padding: 0; + border: 0; /* image and dimensions specified in the HTML */ } +.event-map-container > ol { + margin: 0; + padding: 0; + list-style-type: none; +} + /* Label element and pop-up effects. */ -.event-map-label { +div.event-map-label-only { + display: none; +} + +div.event-map-label { position: absolute; /* position and dimensions specified in the HTML */ border: 2px solid #d00; } -.event-map-label:hover { - border: 0; -} - -.event-map-label .event-map-details { +div.event-map-label .event-map-details { display: none; position: absolute; top: 0; @@ -416,7 +433,7 @@ min-width: 10em; } -.event-map-label:hover .event-map-details { +div.event-map-label:hover .event-map-details { display: block; } @@ -437,6 +454,7 @@ .event-map-description p { font-weight: bold; font-size: larger; + text-align: center; } ul.event-map-description-events { diff -r 40ec2814d6ee -r 0131c3d7fe9c macros/EventAggregator.py --- a/macros/EventAggregator.py Fri Apr 15 00:14:04 2011 +0200 +++ b/macros/EventAggregator.py Mon Apr 18 01:06:30 2011 +0200 @@ -1517,10 +1517,9 @@ output.append(fmt.table_row(on=1)) output.append(fmt.table_cell(on=1)) - output.append(fmt.div(on=1, css_class="event-map-container", - style="width: %spx; height: %spx; background-image: url('%s')" % ( - escattr(map_width), escattr(map_height), map_image_url) - )) + output.append(fmt.div(on=1, css_class="event-map-container")) + output.append(fmt.image(map_image_url)) + output.append(fmt.number_list(on=1)) # Show the events in the map. @@ -1549,14 +1548,26 @@ # NOTE: Use one degree as the marker size. marker_x, marker_y = getPositionForCentrePoint( - getPositionForReference(latitude, longitude, map_bottom_left_latitude, map_bottom_left_longitude, + getPositionForReference(map_top_right_latitude, longitude, latitude, map_bottom_left_longitude, map_x_scale, map_y_scale), map_x_scale, map_y_scale) # Put a marker on the map. + output.append(fmt.listitem(on=1, css_class="event-map-label")) + + # Have a positioned marker for the print mode. + + output.append(fmt.div(on=1, css_class="event-map-label-only", + style="left:%dpx; top:%dpx; min-width:%dpx; min-height:%dpx") % ( + marker_x, marker_y, map_x_scale, map_y_scale)) + output.append(fmt.div(on=0)) + + # Have a marker containing a pop-up when using the screen mode, + # providing a normal block when using the print mode. + output.append(fmt.div(on=1, css_class="event-map-label", - style="left:%dpx; bottom:%dpx; min-width:%dpx; min-height:%dpx") % ( + style="left:%dpx; top:%dpx; min-width:%dpx; min-height:%dpx") % ( marker_x, marker_y, map_x_scale, map_y_scale)) output.append(fmt.div(on=1, css_class="event-map-details")) output.append(fmt.div(on=1, css_class="event-map-shadow")) @@ -1584,9 +1595,11 @@ output.append(fmt.div(on=0)) output.append(fmt.div(on=0)) output.append(fmt.div(on=0)) + output.append(fmt.listitem(on=0)) # End of map view output. + output.append(fmt.number_list(on=0)) output.append(fmt.div(on=0)) output.append(fmt.table_cell(on=0)) output.append(fmt.table_row(on=0))