diff --git a/perllib/FixMyStreet/App/Controller/Photo.pm b/perllib/FixMyStreet/App/Controller/Photo.pm index 7bfdbf16f7a..201efe2bcca 100644 --- a/perllib/FixMyStreet/App/Controller/Photo.pm +++ b/perllib/FixMyStreet/App/Controller/Photo.pm @@ -133,6 +133,22 @@ sub upload : Local { $out = { id => $fileid }; } + if ($c->get_param('get_latlon') && $c->stash->{photo_gps}) { + $out = { + %$out, + %{ $c->stash->{photo_gps} }, + }; + } + + if ($c->get_param('start_report') && $c->stash->{photo_gps}) { + my $url = $c->uri_for( "/report/new", { + lat => $c->stash->{photo_gps}->{lat}, + lon => $c->stash->{photo_gps}->{lon}, + photo_id => $fileid, + } ); + return $c->res->redirect($url); + } + $c->res->content_type('application/json; charset=utf-8'); $c->res->body(encode_json($out)); } diff --git a/perllib/FixMyStreet/App/Controller/Report/New.pm b/perllib/FixMyStreet/App/Controller/Report/New.pm index d6504f2dec3..61aceb1325a 100644 --- a/perllib/FixMyStreet/App/Controller/Report/New.pm +++ b/perllib/FixMyStreet/App/Controller/Report/New.pm @@ -639,6 +639,10 @@ sub initialize_report : Private { $report = $c->model('DB::Problem')->new( {} ); } + if (!$c->stash->{upload_fileid} && $c->get_param('photo_id')) { + $c->stash->{upload_fileid} = $c->get_param('photo_id'); + } + # If we have a user logged in let's prefill some values for them. if (!$report->user && $c->user) { my $user = $c->user->obj; diff --git a/perllib/FixMyStreet/App/Model/PhotoSet.pm b/perllib/FixMyStreet/App/Model/PhotoSet.pm index b8477617807..17675cdc8f9 100644 --- a/perllib/FixMyStreet/App/Model/PhotoSet.pm +++ b/perllib/FixMyStreet/App/Model/PhotoSet.pm @@ -177,6 +177,11 @@ has ids => ( # Arrayref of $fileid tuples (always, so post upload/raw data proc return (); } + if ($type eq 'jpeg' && !$self->c->stash->{photo_gps}) { + # only store GPS for the first uploaded photo + $self->stash_gps_info($upload->tempname); + } + # Convert all images to JPEGs my %params = ( magick => 'JPEG' ); @@ -206,6 +211,31 @@ has ids => ( # Arrayref of $fileid tuples (always, so post upload/raw data proc }, ); +sub stash_gps_info { + my ($self, $filename) = @_; + + return unless can_run('jhead'); + + eval { + # run jhead on $filename and store in $stdout + my $stdout; + my $pid = open3(undef, $stdout, undef, 'jhead', $filename); + # parse lines like "GPS Latitude : N 51d 36m 52.32s + # GPS Longitude: W 0d 42m 27.24s" + my ($lat, $lon); + while (<$stdout>) { + if (/GPS Latitude : ([NS])\s+(\d+)d\s+(\d+)m\s+(\d+\.\d+)s/) { + $lat = $2 + $3/60 + $4/3600; + $lat = -$lat if $1 eq 'S'; + } elsif (/GPS Longitude: ([EW])\s+(\d+)d\s+(\d+)m\s+(\d+\.\d+)s/) { + $lon = $2 + $3/60 + $4/3600; + $lon = -$lon if $1 eq 'W'; + } + } + $self->c->stash->{photo_gps} = { lat => $lat, lon => $lon }; + }; +} + sub get_image_type { my ($self, $index) = @_; my $filename = $self->get_id($index); diff --git a/templates/web/base/around/postcode_form.html b/templates/web/base/around/postcode_form.html index 05f9190d09f..5ab8c776bd5 100644 --- a/templates/web/base/around/postcode_form.html +++ b/templates/web/base/around/postcode_form.html @@ -16,6 +16,17 @@

To continue draft enter its location.
Cancel +

+
+ + +
+ + + + + +
[% INCLUDE 'around/_postcode_form_examples.html' %] diff --git a/templates/web/base/common_scripts.html b/templates/web/base/common_scripts.html index 4ad49add989..836f2dd255f 100644 --- a/templates/web/base/common_scripts.html +++ b/templates/web/base/common_scripts.html @@ -12,6 +12,8 @@ IF bodyclass.match('frontpage'); scripts.push( version('/vendor/idb-keyval-iife.min.js'), + version('/vendor/jquery-3.6.0.min.js'), + version('/vendor/dropzone.min.js'), version('/js/offline_draft.js'), version('/js/front.js'), version('/js/geolocation.js'), diff --git a/web/cobrands/fixmystreet/fixmystreet.js b/web/cobrands/fixmystreet/fixmystreet.js index 1a92cf06636..41b8071ee90 100644 --- a/web/cobrands/fixmystreet/fixmystreet.js +++ b/web/cobrands/fixmystreet/fixmystreet.js @@ -1020,15 +1020,15 @@ $.extend(fixmystreet.set_up, { } var prevFile; var photodrop = new Dropzone($dropzone[0], { - url: '/photo/upload', + url: '/photo/upload?get_latlon=1', paramName: 'photo', maxFiles: max_photos, addRemoveLinks: true, thumbnailHeight: 150, thumbnailWidth: 150, - resizeWidth: 2048, - resizeHeight: 2048, - resizeQuality: 0.6, + // resizeWidth: 2048, + // resizeHeight: 2048, + // resizeQuality: 0.6, acceptedFiles: 'image/jpeg,image/pjpeg,image/gif,image/tiff,image/png,.png,.tiff,.tif,.gif,.jpeg,.jpg', dictDefaultMessage: default_message, dictCancelUploadConfirmation: translation_strings.upload_cancel_confirmation, diff --git a/web/cobrands/sass/_base.scss b/web/cobrands/sass/_base.scss index 45eacc7891b..8ace40634be 100644 --- a/web/cobrands/sass/_base.scss +++ b/web/cobrands/sass/_base.scss @@ -3423,3 +3423,8 @@ $site-message-border: 1px solid #525252 !default; @import "govuk-frontend/forms"; @import "_govuk"; // Adds some overrides to the default GOVUK behaviour + +#front-main .dropzone { + background-color: rgba(255, 190, 0, 0.88); + border-color: #a28400; +} \ No newline at end of file diff --git a/web/js/front.js b/web/js/front.js index 7e17b11ffa0..6cda34d0204 100644 --- a/web/js/front.js +++ b/web/js/front.js @@ -1,7 +1,51 @@ -document.getElementById('pc').focus(); +// document.getElementById('pc').focus(); (function(){ + function dropzoneSetup() { + console.log('dropzoneSetup'); + if ('Dropzone' in window) { + Dropzone.autoDiscover = false; + console.log('Dropzone', Dropzone); + } else { + console.log('Dropzone not found'); + return; + } + + var dz = new Dropzone('#photoFormPhoto', { + url: '/photo/upload?get_latlon=1', + paramName: 'photo', + maxFiles: 1, + addRemoveLinks: true, + thumbnailHeight: 256, + thumbnailWidth: 256, + // resizeHeight: 2048, + // resizeWidth: 2048, + // resizeQuality: 0.6, + acceptedFiles: 'image/jpeg,image/pjpeg,image/gif,image/tiff,image/png,.png,.tiff,.tif,.gif,.jpeg,.jpg', + dictDefaultMessage: "Upload a photo to start a new report", + // dictCancelUploadConfirmation: translation_strings.upload_cancel_confirmation, + // dictInvalidFileType: translation_strings.upload_invalid_file_type, + // dictMaxFilesExceeded: translation_strings.upload_max_files_exceeded, + init: function() { + console.log('init', this); + var $f = $("#photoForm"); + $("#photoForm label, #photoForm input[type=file], #photoForm input[type=submit]").hide(); + $f.attr("method", "get"); + $f.attr("action", "/report/new"); + $f.attr("enctype", ""); + this.on("success", function(file, xhrResponse) { + console.log('success', file, xhrResponse); + $("#photoForm label, #photoForm input[type=file], #photoForm input[type=submit]").remove(); + $f.find("input[name=photo_id]").val(xhrResponse.id); + $f.find("input[name=lat]").val(xhrResponse.lat); + $f.find("input[name=lon]").val(xhrResponse.lon); + $f.submit(); + }); + } + }); + } + dropzoneSetup(); function set_up_mobile_nav() { var html = document.documentElement; if (!html.classList) {