aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--web/cobrands/fixmystreet/base.scss61
-rw-r--r--web/cobrands/fixmystreet/layout.scss3
-rw-r--r--web/js/map-OpenLayers.js30
-rw-r--r--web/js/map-OpenStreetMap.js2
-rw-r--r--web/js/map-bing-ol.js3
5 files changed, 72 insertions, 27 deletions
diff --git a/web/cobrands/fixmystreet/base.scss b/web/cobrands/fixmystreet/base.scss
index d44c3f1eb..f443131db 100644
--- a/web/cobrands/fixmystreet/base.scss
+++ b/web/cobrands/fixmystreet/base.scss
@@ -710,6 +710,8 @@ a:hover.button-left {
.big-green-banner {
position: relative;
+ z-index:1000;
+ top:-1.75em;
background: $contrast1;
color: #fff;
padding:1em;
@@ -909,7 +911,7 @@ a:hover.button-left {
}
// OpenLayers fix for navigation being top right
-.olControlPanZoom {
+#fms_pan_zoom {
width:48px;
right: 1em !important;
top: 1em !important;
@@ -917,12 +919,12 @@ a:hover.button-left {
}
// Openlayers map controls (overrides)
-#OpenLayers\.Control\.PanZoom_6_panup,
-#OpenLayers\.Control\.PanZoom_6_pandown,
-#OpenLayers\.Control\.PanZoom_6_panleft,
-#OpenLayers\.Control\.PanZoom_6_panright,
-#OpenLayers\.Control\.PanZoom_6_zoomin,
-#OpenLayers\.Control\.PanZoom_6_zoomout {
+#fms_pan_zoom_panup,
+#fms_pan_zoom_pandown,
+#fms_pan_zoom_panleft,
+#fms_pan_zoom_panright,
+#fms_pan_zoom_zoomin,
+#fms_pan_zoom_zoomout {
text-indent:-999999px;
opacity:0.85;
background:url(images/sprite.png) no-repeat;
@@ -930,40 +932,40 @@ a:hover.button-left {
opacity:1;
}
}
-#OpenLayers\.Control\.PanZoom_6_zoomworld {
+#fms_pan_zoom_zoomworld {
display:none !important;
visibility:none !important;
}
-#OpenLayers\.Control\.PanZoom_6_panup {
+#fms_pan_zoom_panup {
background-position:-25px -218px;
left:15px !important;
top:0 !important;
}
-#OpenLayers\.Control\.PanZoom_6_pandown {
+#fms_pan_zoom_pandown {
background-position:-25px -248px;
left:15px !important;
top:36px !important;
}
-#OpenLayers\.Control\.PanZoom_6_panleft {
+#fms_pan_zoom_panleft {
background-position:-10px -233px;
width:24px !important;
left:0px !important;
top:18px !important;
}
-#OpenLayers\.Control\.PanZoom_6_panright {
+#fms_pan_zoom_panright {
background-position:-34px -233px;
width:24px !important;
left:24px !important;
top:18px !important;
}
-#OpenLayers\.Control\.PanZoom_6_zoomin {
+#fms_pan_zoom_zoomin {
background-position:-25px -280px;
height:22px !important;
left:15px !important;
top:70px !important;
}
-#OpenLayers\.Control\.PanZoom_6_zoomout {
+#fms_pan_zoom_zoomout {
background-position:-25px -298px;
height:22px !important;
left:15px !important;
@@ -976,7 +978,7 @@ a:hover.button-left {
left: 0;
right:0;
bottom: 0;
- z-index: 1000;
+ z-index: 1100;
background:rgba(0, 0, 0, 0.7);
margin:0;
a {
@@ -1000,10 +1002,35 @@ a:hover.button-left {
}
}
}
+//close the mobile map span
+#close-mobile-map {
+ cursor:pointer ;
+ position:absolute;
+ top:3.5em;
+ left:1em;
+ z-index:1000;
+ display:block;
+ width:30px;
+ height:30px;
+ text-indent:-999999px;
+ opacity: 0.85;
+ background:url(images/sprite.png) -105px -284px no-repeat;
+ &:hover {
+ opacity:1;
+ }
+}
+
+.mobile-map-banner {
+ position: fixed;
+ top:-0.65em;
+ left:0;
+ right:0;
+ background:rgba(0, 0, 0, 0.7);
+}
//copyright attribution
-#OpenLayers\.Control\.Attribution_3 {
- bottom:2em !important;
+.olControlAttribution {
+ bottom:0.5em !important;
}
/* Drag is only present in noscript form. XXX Copy from core. */
diff --git a/web/cobrands/fixmystreet/layout.scss b/web/cobrands/fixmystreet/layout.scss
index 41b746621..69ef21ef6 100644
--- a/web/cobrands/fixmystreet/layout.scss
+++ b/web/cobrands/fixmystreet/layout.scss
@@ -441,7 +441,7 @@ body.twothirdswidthpage {
}
// Pull OpenLayers navigation down a bit
-.olControlPanZoom {
+#fms_pan_zoom {
top: 5em !important;
}
@@ -554,6 +554,7 @@ body.twothirdswidthpage {
// pokes over the RHS with a little triangle
.big-green-banner {
+ top:auto;
right:-1.25em;
margin-left:-2em;
font-size:1.375em;
diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js
index c6bdfb68e..120bbf144 100644
--- a/web/js/map-OpenLayers.js
+++ b/web/js/map-OpenLayers.js
@@ -369,7 +369,6 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
margin: '0 -1em'
});
fixmystreet.map.updateSize();
- // Also remove panzoom and permalink?
} else {
this.mobile_full_screen_map(e);
}
@@ -380,12 +379,17 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
mobile_full_screen_map: function(e) {
if ( fixmystreet.markers.getVisibility() ) {
- $('#hide_pins_link').click();
+ //hide pins and update text
+ $('#hide_pins_link').click().text('Show pins');
+ }
+ var permalink_id;
+ if ($('#map_permalink').length) {
+ permalink_id = 'map_permalink';
}
fixmystreet.map.addControls([
new OpenLayers.Control.Navigation({ zoomWheelEnabled: false }),
- new OpenLayers.Control.Permalink(),
- new OpenLayers.Control.PanZoomFMS()
+ new OpenLayers.Control.Permalink(permalink_id),
+ new OpenLayers.Control.PanZoomFMS({id: 'fms_pan_zoom' })
]);
$('#map_box').css({
zIndex: 0, position: 'fixed',
@@ -393,7 +397,18 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
width: '100%', height: '100%',
margin: 0
});
- // Also need to move green banner, add close button, etc.
+
+ // move and alter green banner, add close button
+ $('#map_box').append('<span id="close-mobile-map">Close</span>');
+ $('.big-green-banner').addClass('mobile-map-banner');
+ // hide site-logo (z-index madness), show sub_map_links
+ // and push map zoom down a notch
+ $('#site-logo').hide();
+ $('#sub_map_links').show();
+ $('#fms_pan_zoom').css({'top':'3.5em !important'});
+
+ // need to set up a click for #close-mobile-map somehow
+
fixmystreet.map.updateSize();
fixmystreet.page = 'mobile-full-map';
// To make sure the click control is on top
@@ -435,7 +450,7 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
$('#form_category').change( form_category_onchange );
}
});
- $('#side-form').show();
+ $('#side-form, #site-logo').show();
/* For some reason on IOS5 if you use the jQuery show method it
* doesn't display the JS validation error messages unless you do this
* or you cause a screen redraw by changing the phone orientation.
@@ -444,7 +459,8 @@ OpenLayers.Control.Click = OpenLayers.Class(OpenLayers.Control, {
document.getElementById('side-form').style.display = 'block';
}
$('#side').hide();
- $('#sub_map_links').hide();
+ //hide lots of the map ui on mobile
+ $('#sub_map_links, #fms_pan_zoom, #close-mobile-map', '.mobile').hide();
heightFix('#report-a-problem-sidebar:visible', '.content', 26);
// If we clicked the map somewhere inconvenient
diff --git a/web/js/map-OpenStreetMap.js b/web/js/map-OpenStreetMap.js
index 48d753fa7..50f159635 100644
--- a/web/js/map-OpenStreetMap.js
+++ b/web/js/map-OpenStreetMap.js
@@ -9,7 +9,7 @@ function set_map_config(perm) {
new OpenLayers.Control.Navigation(),
new OpenLayers.Control.Permalink(permalink_id),
new OpenLayers.Control.PermalinkFMS('osm_link', 'http://www.openstreetmap.org/'),
- new OpenLayers.Control.PanZoomFMS()
+ new OpenLayers.Control.PanZoomFMS({id: 'fms_pan_zoom' })
];
}
diff --git a/web/js/map-bing-ol.js b/web/js/map-bing-ol.js
index b95eb84fb..478bf6527 100644
--- a/web/js/map-bing-ol.js
+++ b/web/js/map-bing-ol.js
@@ -8,13 +8,14 @@ function set_map_config(perm) {
new OpenLayers.Control.Attribution(),
new OpenLayers.Control.ArgParser()
];
+ $('#sub_map_links').hide();
} else {
fixmystreet.controls = [
new OpenLayers.Control.Attribution(),
new OpenLayers.Control.ArgParser(),
new OpenLayers.Control.Navigation({ zoomWheelEnabled: false }),
new OpenLayers.Control.Permalink(permalink_id),
- new OpenLayers.Control.PanZoomFMS()
+ new OpenLayers.Control.PanZoomFMS({id: 'fms_pan_zoom' })
];
}
fixmystreet.map_type = OpenLayers.Layer.Bing;
generated by cgit v1.2.3 (git 2.25.1) at 2025-06-05 08:14:25 +0000