aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--templates/web/base/maps/_compass.html19
-rw-r--r--templates/web/base/maps/noscript_map.html25
-rw-r--r--templates/web/bristol/maps/noscript_map.html26
-rw-r--r--templates/web/zurich/maps/noscript_map.html26
-rw-r--r--web/cobrands/sass/_base.scss2
-rw-r--r--web/js/map-OpenLayers.js25
6 files changed, 42 insertions, 81 deletions
diff --git a/templates/web/base/maps/_compass.html b/templates/web/base/maps/_compass.html
new file mode 100644
index 000000000..c5db05b1d
--- /dev/null
+++ b/templates/web/base/maps/_compass.html
@@ -0,0 +1,19 @@
+[%
+ north = c.uri_with( { lat = map.compass.north.0, lon = map.compass.north.1, zoom = map.zoom } )
+ south = c.uri_with( { lat = map.compass.south.0, lon = map.compass.south.1, zoom = map.zoom } )
+ east = c.uri_with( { lat = map.compass.east.0, lon = map.compass.east.1, zoom = map.zoom } )
+ west = c.uri_with( { lat = map.compass.west.0, lon = map.compass.west.1, zoom = map.zoom } );
+ SET zoom_in = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom + 1 } ) IF map.zoom < map.numZoomLevels - 1;
+ SET zoom_out = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom - 1 } ) IF map.zoom > 0;
+ SET zoom_in = '#' IF map.zoom >= map.numZoomLevels - 1;
+ SET zoom_out = '#' IF map.zoom <= 0;
+%]
+
+<div id="fms_pan_zoom" style="position: absolute;" class="olControlPanZoom olControlNoSelect" unselectable="on">
+ <a rel="nofollow" href="[% north %]"><span id="fms_pan_zoom_panup" class="olButton">pan up</span></a>
+ <a rel="nofollow" href="[% west %]"><span id="fms_pan_zoom_panleft" class="olButton">pan left</span></a>
+ <a rel="nofollow" href="[% east %]"><span id="fms_pan_zoom_panright" class="olButton">pan right</span></a>
+ <a rel="nofollow" href="[% south %]"><span id="fms_pan_zoom_pandown" class="olButton">pan down</span></a>
+ <a rel="nofollow" href="[% zoom_in %]"><span id="fms_pan_zoom_zoomin" class="olButton">zoom in</span></a>
+ <a rel="nofollow" href="[% zoom_out %]"><span id="fms_pan_zoom_zoomout" class="olButton">zoom out</span></a>
+</div>
diff --git a/templates/web/base/maps/noscript_map.html b/templates/web/base/maps/noscript_map.html
index c477ec5ac..8418c4eb8 100644
--- a/templates/web/base/maps/noscript_map.html
+++ b/templates/web/base/maps/noscript_map.html
@@ -24,28 +24,5 @@
style="top:256px; left:256px;">
</div>
<div id="[% nsm_prefix %]pins">[% FOR pin IN map.pins %][% INCLUDE 'maps/pin.html' %][% END %]</div>
- [% INCLUDE compass %]
+ [% INCLUDE 'maps/_compass.html' %]
</div>
-
-[% BLOCK compass %]
-[%
- north = c.uri_with( { lat = map.compass.north.0, lon = map.compass.north.1, zoom = map.zoom } )
- south = c.uri_with( { lat = map.compass.south.0, lon = map.compass.south.1, zoom = map.zoom } )
- east = c.uri_with( { lat = map.compass.east.0, lon = map.compass.east.1, zoom = map.zoom } )
- west = c.uri_with( { lat = map.compass.west.0, lon = map.compass.west.1, zoom = map.zoom } )
- world = c.uri_with( { zoom = 0 } );
- SET zoom_in = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom + 1 } ) IF map.zoom < map.numZoomLevels - 1;
- SET zoom_out = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom - 1 } ) IF map.zoom > 0;
- SET zoom_in = '#' IF map.zoom >= map.numZoomLevels - 1;
- SET zoom_out = '#' IF map.zoom <= 0;
-%]
-<div style="position: absolute; left: 4px; top: 4px;" class="olControlPanZoom olControlNoSelect" unselectable="on">
- <div style="position: absolute; left: 13px; top: 4px; width: 18px; height: 18px;"><a rel="nofollow" href="[% north %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/north-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 4px; top: 22px; width: 18px; height: 18px;"><a rel="nofollow" href="[% west %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/west-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 22px; top: 22px; width: 18px; height: 18px;"><a rel="nofollow" href="[% east %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/east-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 40px; width: 18px; height: 18px;"><a rel="nofollow" href="[% south %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/south-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 63px; width: 18px; height: 18px;"><a rel="nofollow" href="[% zoom_in %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/zoom-plus-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 81px; width: 18px; height: 18px;"><a rel="nofollow" href="[% world %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/zoom-world-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 99px; width: 18px; height: 18px;"><a rel="nofollow" href="[% zoom_out %]"><img style="position: relative; width: 18px; height: 18px;" src="[% start %]/js/OpenLayers/img/zoom-minus-mini.png" border="0"></a></div>
-</div>
-[% END %]
diff --git a/templates/web/bristol/maps/noscript_map.html b/templates/web/bristol/maps/noscript_map.html
index 0b4fe1ebf..987aa76a6 100644
--- a/templates/web/bristol/maps/noscript_map.html
+++ b/templates/web/bristol/maps/noscript_map.html
@@ -16,34 +16,10 @@
[% END %]
</div>
<div id="[% nsm_prefix %]pins">[% FOR pin IN map.pins %][% INCLUDE pin %][% END %]</div>
- [% INCLUDE compass %]
+ [% INCLUDE 'maps/_compass.html' %]
</div>
</div>
-[% BLOCK compass %]
-[%
- north = c.uri_with( { lat = map.compass.north.0, lon = map.compass.north.1, zoom = map.zoom } )
- south = c.uri_with( { lat = map.compass.south.0, lon = map.compass.south.1, zoom = map.zoom } )
- east = c.uri_with( { lat = map.compass.east.0, lon = map.compass.east.1, zoom = map.zoom } )
- west = c.uri_with( { lat = map.compass.west.0, lon = map.compass.west.1, zoom = map.zoom } )
- world = c.uri_with( { zoom = 0 } );
- SET zoom_in = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom + 1 } ) IF map.zoom < map.numZoomLevels - 1;
- SET zoom_out = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom - 1 } ) IF map.zoom > 0;
- SET zoom_in = '#' IF map.zoom >= map.numZoomLevels - 1;
- SET zoom_out = '#' IF map.zoom <= 0;
-%]
-<div style="position: absolute; left: 4px; top: 4px;" class="olControlPanZoom olControlNoSelect" unselectable="on">
- <div style="position: absolute; left: 13px; top: 4px; width: 18px; height: 18px;"><a rel="nofollow" href="[% north %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/north-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 4px; top: 22px; width: 18px; height: 18px;"><a rel="nofollow" href="[% west %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/west-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 22px; top: 22px; width: 18px; height: 18px;"><a rel="nofollow" href="[% east %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/east-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 40px; width: 18px; height: 18px;"><a rel="nofollow" href="[% south %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/south-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 63px; width: 18px; height: 18px;"><a rel="nofollow" href="[% zoom_in %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/zoom-plus-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 81px; width: 18px; height: 18px;"><a rel="nofollow" href="[% world %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/zoom-world-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 99px; width: 18px; height: 18px;"><a rel="nofollow" href="[% zoom_out %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/zoom-minus-mini.png" border="0"></a></div>
-</div>
-[% END %]
-
-
[% BLOCK pin %]
[%
SET pin_top = pin.py / ( map.tile_size * map.rows ) * 100;
diff --git a/templates/web/zurich/maps/noscript_map.html b/templates/web/zurich/maps/noscript_map.html
index 2ebfcbf11..dcd577c52 100644
--- a/templates/web/zurich/maps/noscript_map.html
+++ b/templates/web/zurich/maps/noscript_map.html
@@ -16,34 +16,10 @@
[% END %]
</div>
<div id="[% nsm_prefix %]pins">[% FOR pin IN map.pins %][% INCLUDE pin %][% END %]</div>
- [% INCLUDE compass %]
+ [% INCLUDE 'maps/_compass.html' %]
</div>
</div>
-[% BLOCK compass %]
-[%
- north = c.uri_with( { lat = map.compass.north.0, lon = map.compass.north.1, zoom = map.zoom } )
- south = c.uri_with( { lat = map.compass.south.0, lon = map.compass.south.1, zoom = map.zoom } )
- east = c.uri_with( { lat = map.compass.east.0, lon = map.compass.east.1, zoom = map.zoom } )
- west = c.uri_with( { lat = map.compass.west.0, lon = map.compass.west.1, zoom = map.zoom } )
- world = c.uri_with( { zoom = 0 } );
- SET zoom_in = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom + 1 } ) IF map.zoom < map.numZoomLevels - 1;
- SET zoom_out = c.uri_with( { lat = map.latitude, lon = map.longitude, zoom = map.zoom - 1 } ) IF map.zoom > 0;
- SET zoom_in = '#' IF map.zoom >= map.numZoomLevels - 1;
- SET zoom_out = '#' IF map.zoom <= 0;
-%]
-<div style="position: absolute; left: 4px; top: 4px;" class="olControlPanZoom olControlNoSelect" unselectable="on">
- <div style="position: absolute; left: 13px; top: 4px; width: 18px; height: 18px;"><a rel="nofollow" href="[% north %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/north-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 4px; top: 22px; width: 18px; height: 18px;"><a rel="nofollow" href="[% west %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/west-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 22px; top: 22px; width: 18px; height: 18px;"><a rel="nofollow" href="[% east %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/east-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 40px; width: 18px; height: 18px;"><a rel="nofollow" href="[% south %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/south-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 63px; width: 18px; height: 18px;"><a rel="nofollow" href="[% zoom_in %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/zoom-plus-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 81px; width: 18px; height: 18px;"><a rel="nofollow" href="[% world %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/zoom-world-mini.png" border="0"></a></div>
- <div style="position: absolute; left: 13px; top: 99px; width: 18px; height: 18px;"><a rel="nofollow" href="[% zoom_out %]"><img style="position: relative; width: 18px; height: 18px;" src="/js/OpenLayers/img/zoom-minus-mini.png" border="0"></a></div>
-</div>
-[% END %]
-
-
[% BLOCK pin %]
[%
SET pin_top = pin.py / ( map.tile_size * map.rows ) * 100;
diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss
index d21003a43..d7b3263a3 100644
--- a/web/cobrands/sass/_base.scss
+++ b/web/cobrands/sass/_base.scss
@@ -1085,6 +1085,8 @@ html.js #map .noscript {
#fms_pan_zoom_panright,
#fms_pan_zoom_zoomin,
#fms_pan_zoom_zoomout {
+ position: absolute;
+ cursor: pointer;
width: 36px;
height: 36px;
text-indent: flip(-999999px, 999999px); // text-align from OL style makes this necessary
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js
index f202e1392..2790f13d3 100644
--- a/web/js/map-OpenLayers.js
+++ b/web/js/map-OpenLayers.js
@@ -569,6 +569,17 @@ OpenLayers.Control.PanZoomFMS = OpenLayers.Class(OpenLayers.Control.PanZoom, {
}
}
},
+ _addButton: function(id1, id2) {
+ var btn = document.createElement('div'),
+ id = id1 + id2;
+ btn.innerHTML = id1 + ' ' + id2;
+ btn.id = this.id + "_" + id;
+ btn.action = id;
+ btn.className = "olButton";
+ this.div.appendChild(btn);
+ this.buttons.push(btn);
+ return btn;
+ },
moveTo: function(){},
draw: function(px) {
// A customised version of .draw() that doesn't specify
@@ -576,13 +587,13 @@ OpenLayers.Control.PanZoomFMS = OpenLayers.Class(OpenLayers.Control.PanZoom, {
// size and position them all using CSS.
OpenLayers.Control.prototype.draw.apply(this, arguments);
this.buttons = [];
- this._addButton("panup", "north-mini.png");
- this._addButton("panleft", "west-mini.png");
- this._addButton("panright", "east-mini.png");
- this._addButton("pandown", "south-mini.png");
- this._addButton("zoomin", "zoom-plus-mini.png");
- this._addButton("zoomworld", "zoom-world-mini.png");
- this._addButton("zoomout", "zoom-minus-mini.png");
+ this._addButton("pan", "up");
+ this._addButton("pan", "left");
+ this._addButton("pan", "right");
+ this._addButton("pan", "down");
+ this._addButton("zoom", "in");
+ this._addButton("zoom", "world");
+ this._addButton("zoom", "out");
return this.div;
}
});