diff options
Diffstat (limited to 'web')
| -rw-r--r-- | web/cobrands/fixmystreet/fixmystreet.js | 47 | ||||
| -rw-r--r-- | web/cobrands/oxfordshire/_oxon.scss | 2 | ||||
| -rw-r--r-- | web/cobrands/oxfordshire/layout.scss | 13 | ||||
| -rw-r--r-- | web/cobrands/sass/_base.scss | 34 | ||||
| -rw-r--r-- | web/cobrands/sass/_layout.scss | 23 | ||||
| -rw-r--r-- | web/cobrands/sass/_mixins.scss | 6 | ||||
| -rw-r--r-- | web/js/map-OpenLayers.js | 55 | ||||
| -rw-r--r-- | web/js/map-wmts-zurich.js | 34 |
8 files changed, 163 insertions, 51 deletions
diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js index 914b8e7eb..5ab750679 100644 --- a/web/cobrands/fixmystreet/fixmystreet.js +++ b/web/cobrands/fixmystreet/fixmystreet.js @@ -324,15 +324,11 @@ $.extend(fixmystreet.set_up, { }); }, - geolocation: function() { - if (geo_position_js.init()) { - var link = '<a href="LINK" id="geolocate_link">… ' + translation_strings.geolocate + '</a>'; - $('form[action="/alert/list"]').append(link.replace('LINK','/alert/list')); - if ($('body.frontpage').length) { - $('#postcodeForm').after(link.replace('LINK','/around')); - } else{ - $('#postcodeForm').append(link.replace('LINK','/around')); - } + report_geolocation: function() { + if (!geo_position_js.init()) { + return; + } + function add_click_handler(success_callback) { $('#geolocate_link').click(function(e) { var $link = $(this); e.preventDefault(); @@ -345,10 +341,7 @@ $.extend(fixmystreet.set_up, { } geo_position_js.getCurrentPosition(function(pos) { $link.find('img').remove(); - var latitude = pos.coords.latitude; - var longitude = pos.coords.longitude; - var page = $link.attr('href'); - location.href = page + '?latitude=' + latitude + ';longitude=' + longitude; + success_callback(pos); }, function(err) { $link.find('img').remove(); if (err.code == 1) { // User said no @@ -366,6 +359,34 @@ $.extend(fixmystreet.set_up, { }); }); } + if ($('#postcodeForm').length) { + var link = '<a href="LINK" id="geolocate_link">… ' + translation_strings.geolocate + '</a>'; + $('form[action="/alert/list"]').append(link.replace('LINK','/alert/list')); + if ($('body.frontpage').length) { + $('#postcodeForm').after(link.replace('LINK','/around')); + } else{ + $('#postcodeForm').append(link.replace('LINK','/around')); + } + add_click_handler(function(pos) { + var latitude = pos.coords.latitude; + var longitude = pos.coords.longitude; + var page = $('#geolocate_link').attr('href'); + location.href = page + '?latitude=' + latitude + ';longitude=' + longitude; + }); + } + if ($('form#report_inspect_form').length) { + add_click_handler(function(pos) { + var latlon = new OpenLayers.LonLat(pos.coords.longitude, pos.coords.latitude); + var bng = latlon.clone().transform( + new OpenLayers.Projection("EPSG:4326"), + new OpenLayers.Projection("EPSG:27700") // TODO: Handle other projections + ); + $("#problem_northing").text(bng.lat.toFixed(1)); + $("#problem_easting").text(bng.lon.toFixed(1)); + $("form#report_inspect_form input[name=latitude]").val(latlon.lat); + $("form#report_inspect_form input[name=longitude]").val(latlon.lon); + }); + } }, category_change: function() { diff --git a/web/cobrands/oxfordshire/_oxon.scss b/web/cobrands/oxfordshire/_oxon.scss index 0859fad6a..c8c49a631 100644 --- a/web/cobrands/oxfordshire/_oxon.scss +++ b/web/cobrands/oxfordshire/_oxon.scss @@ -9,7 +9,7 @@ body { font-family:"Trebuchet MS",Arial, Helvetica, sans-serif; line-height:18px; - a, a:visited {text-decoration:none; color:$oxfordshire_link_colour} + a:not(.btn), a:visited:not(.btn) {text-decoration:none; color:$oxfordshire_link_colour} a { font-size: 1em; } // mySociety a:hover {text-decoration:underline} margin:0; diff --git a/web/cobrands/oxfordshire/layout.scss b/web/cobrands/oxfordshire/layout.scss index 5c3d5e8ac..c9783b14d 100644 --- a/web/cobrands/oxfordshire/layout.scss +++ b/web/cobrands/oxfordshire/layout.scss @@ -159,10 +159,6 @@ body.mappage { width: auto; } - #map_sidebar { - background-color: $oxfordshire_very_light_green; - } - .extra-text { padding: 1em; margin: 0 -1em; @@ -226,6 +222,15 @@ body.mappage { } } +#map_sidebar { + background-color: $oxfordshire_very_light_green; + + .with-actions & { + background-image: -webkit-linear-gradient(flip(90deg, 270deg), transparent 29em, #deead2 29em); + background-image: linear-gradient(flip(90deg, 270deg), transparent 29em, #deead2 29em); + } +} + .item-list--reports { li:after { background-color: $oxfordshire_mid_grey_green; diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index 67bc35164..576538daa 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -296,6 +296,11 @@ input[type=email] { line-height: 1em; } +input[readonly] { + border-color: #cccccc; + color: #888888; +} + label{ display: block; margin-top: 1.25em; @@ -391,6 +396,30 @@ label{ margin:1em 0; } +.problem-inspector-fields { + select { + height: 2.4em; // match text inputs + -webkit-appearance: menulist-button; // so it's the right height in Safari + } + + p.left, + p.right { + width: 46%; + + label { + margin-top: 0; + } + } + + p.left { + float: #{$left}; + } + + p.right { + float: #{$right}; + } +} + // form errors div.form-error, @@ -704,8 +733,9 @@ footer { /*BUTTONS*/ // Default style set for buttons, inputs and .btn class. Red and green class available. - -button, input[type=submit],.btn{ +// NB: a.btn is included in the selector otherwise a:visited is more specific and +// the wrong text colour is applied. +button, input[type=submit], .btn, a.btn { @include button-reset; } diff --git a/web/cobrands/sass/_layout.scss b/web/cobrands/sass/_layout.scss index 52c6c075d..73c614e91 100644 --- a/web/cobrands/sass/_layout.scss +++ b/web/cobrands/sass/_layout.scss @@ -333,6 +333,29 @@ body.mappage.admin { } } +// Some report pages have a second column of UI elements so make room +body.mappage.twocols { + #map_box { + #{$left}: 58em; + } + + #map_sidebar { + width: 58em; + padding: 0; + + #side-report, #side-report-secondary { + width: 50%; + float: #{$left}; + padding: 1em; + box-sizing: border-box; + } + + #side-report-secondary { + background-color: #eee; + } + } +} + #map_box { position: absolute; z-index: auto; diff --git a/web/cobrands/sass/_mixins.scss b/web/cobrands/sass/_mixins.scss index 5bbbc19eb..36a18b40a 100644 --- a/web/cobrands/sass/_mixins.scss +++ b/web/cobrands/sass/_mixins.scss @@ -2,6 +2,7 @@ $direction: 'left' !default; // Button reset @mixin button-reset($c1: #eee, $c2: #ccc, $c3: #999, $c4: #333, $c5: #777, $c6: #999, $c7: #666, $c8: #fff){ + display: inline-block; cursor:pointer; font:{ size: 0.875em; @@ -14,16 +15,17 @@ $direction: 'left' !default; margin:0; width: auto; height: auto; + vertical-align: top; @include border-radius(4px); background: $c1; @include linear-gradient($c1, $c2); - border:1px solid $c3; + border:1px solid $c3; color:$c4; &:hover:enabled { background:$c5; @include linear-gradient($c6, $c5); text-decoration: none; - border:1px solid $c7; + border:1px solid $c7; color:$c8; } } diff --git a/web/js/map-OpenLayers.js b/web/js/map-OpenLayers.js index 0300c0acc..f6b2c879b 100644 --- a/web/js/map-OpenLayers.js +++ b/web/js/map-OpenLayers.js @@ -136,6 +136,37 @@ var fixmystreet = fixmystreet || {}; } else { return 'small'; } + }, + + // Handle a single report pin being moved by dragging it on the map. + // pin_moved_callback is called with a new EPSG:4326 OpenLayers.LonLat if + // the user drags the pin and confirms its new location. + admin_drag: function(pin_moved_callback, confirm_change) { + confirm_change = confirm_change || false; + var original_lonlat; + var drag = new OpenLayers.Control.DragFeature( fixmystreet.markers, { + onStart: function(feature, e) { + // Keep track of where the feature started, so we can put it + // back if the user cancels the operation. + original_lonlat = new OpenLayers.LonLat(feature.geometry.x, feature.geometry.y); + }, + onComplete: function(feature, e) { + var lonlat = feature.geometry.clone(); + lonlat.transform( + fixmystreet.map.getProjectionObject(), + new OpenLayers.Projection("EPSG:4326") + ); + if ((confirm_change && window.confirm(translation_strings.correct_position)) || !confirm_change) { + // Let the callback know about the newly confirmed position + pin_moved_callback(lonlat); + } else { + // Put it back + fixmystreet.markers.features[0].move(original_lonlat); + } + } + } ); + fixmystreet.map.addControl( drag ); + drag.activate(); } }; @@ -239,6 +270,26 @@ var fixmystreet = fixmystreet || {}; fixmystreet.markers.refresh({force: true}); } + function setup_inspector_marker_drag() { + // On the 'inspect report' page the pin is draggable, so we need to + // update the easting/northing fields when it's dragged. + if (!$('form#report_inspect_form').length) { + // Not actually on the inspect report page + return; + } + fixmystreet.maps.admin_drag(function(lonlat) { + var bng = lonlat.clone().transform( + new OpenLayers.Projection("EPSG:4326"), + new OpenLayers.Projection("EPSG:27700") // TODO: Handle other projections + ); + $("#problem_northing").text(bng.y.toFixed(1)); + $("#problem_easting").text(bng.x.toFixed(1)); + $("form#report_inspect_form input[name=latitude]").val(lonlat.y); + $("form#report_inspect_form input[name=longitude]").val(lonlat.x); + }, + false); + } + function onload() { if ( fixmystreet.area.length ) { for (var i=0; i<fixmystreet.area.length; i++) { @@ -396,6 +447,10 @@ var fixmystreet = fixmystreet || {}; } fixmystreet.map.addLayer(fixmystreet.markers); + if (fixmystreet.page == "report") { + setup_inspector_marker_drag(); + } + if ( fixmystreet.zoomToBounds ) { zoomToBounds( fixmystreet.markers.getDataExtent() ); } diff --git a/web/js/map-wmts-zurich.js b/web/js/map-wmts-zurich.js index fc1dfa08f..18a858064 100644 --- a/web/js/map-wmts-zurich.js +++ b/web/js/map-wmts-zurich.js @@ -114,33 +114,9 @@ fixmystreet.maps.matrix_ids = [ ]; (function() { - - function admin_drag() { - var drag = new OpenLayers.Control.DragFeature( fixmystreet.markers, { - onComplete: function(feature, e) { - var lonlat = feature.geometry.clone(); - lonlat.transform( - fixmystreet.map.getProjectionObject(), - new OpenLayers.Projection("EPSG:4326") - ); - if (window.confirm( 'Richtiger Ort?' ) ) { - // Store new co-ordinates - document.getElementById('fixmystreet.latitude').value = lonlat.y; - document.getElementById('fixmystreet.longitude').value = lonlat.x; - } else { - // Put it back - var lat = document.getElementById('fixmystreet.latitude').value; - var lon = document.getElementById('fixmystreet.longitude').value; - lonlat = new OpenLayers.LonLat(lon, lat).transform( - new OpenLayers.Projection("EPSG:4326"), - fixmystreet.map.getProjectionObject() - ); - fixmystreet.markers.features[0].move(lonlat); - } - } - } ); - fixmystreet.map.addControl( drag ); - drag.activate(); + function pin_dragged(lonlat) { + document.getElementById('fixmystreet.latitude').value = lonlat.y; + document.getElementById('fixmystreet.longitude').value = lonlat.x; } $(function(){ @@ -155,9 +131,9 @@ fixmystreet.maps.matrix_ids = [ /* Admin dragging of pin */ if (fixmystreet.page == 'admin') { if ($.browser.msie) { - $(window).load(admin_drag); + $(window).load(function() { fixmystreet.maps.admin_drag(pin_dragged, true); }); } else { - admin_drag(); + fixmystreet.maps.admin_drag(pin_dragged, true); } } }); |