#31: Added a new item on the image edit menu - "Replace image" - which allows an image to be replaced without losing the meta-data

app/Http/Controllers/Admin/PhotoController.php

@@ -217,6 +217,16 @@ class PhotoController extends Controller
                 Log::error('Image upload failed.', ['error' => $photoFile->getError(), 'reason' => $photoFile->getErrorMessage()]);
             }
             else
+            {
+                if ($request->has('photo_id'))
+                {
+                    // Photo ID provided (using the Replace Photo function) - use that record
+                    $photo = Photo::where('id', intval($request->get('photo_id')))->first();
+
+                    /** @var File $savedFile */
+                    $savedFile = FileHelper::saveUploadedFile($photoFile, $queueFolder, $photo->storage_file_name);
+                }
+                else
                 {
                     /** @var File $savedFile */
                     $savedFile = FileHelper::saveUploadedFile($photoFile, $queueFolder);
@@ -225,8 +235,10 @@ class PhotoController extends Controller
                     $photo->album_id = $album->id;
                     $photo->user_id = Auth::user()->id;
                     $photo->name = pathinfo($photoFile->getClientOriginalName(), PATHINFO_FILENAME);
-                $photo->file_name = $photoFile->getClientOriginalName();
                     $photo->storage_file_name = $savedFile->getFilename();
+                }
+
+                $photo->file_name = $photoFile->getClientOriginalName();
                 $photo->mime_type = $savedFile->getMimeType();
                 $photo->file_size = $savedFile->getSize();
                 $photo->is_analysed = false;

resources/assets/js/albums.js

@@ -376,6 +376,35 @@ function EditPhotosViewModel(album_id, language, urls) {
             e.preventDefault();
             return false;
         },
+        replacePhoto: function (e) {
+            var self = this;
+
+            this.selectPhotoSingle(e.target);
+            var parent = $(e.target).closest('.photo');
+
+            bootbox.dialog({
+                message: $('<p/>').html(language.replace_image_message).prop('outerHTML') +
+                    $('#replace-image-form').clone().removeAttr('style').attr('id', 'replace-image-form-visible').prop('outerHTML'),
+                title: language.replace_image_title,
+                buttons: {
+                    cancel: {
+                        label: language.action_cancel,
+                        className: 'btn-secondary'
+                    },
+                    confirm: {
+                        label: language.action_continue,
+                        className: 'btn-success',
+                        callback: function () {
+                            $('input[name="photo_id"]', '#replace-image-form-visible').val(self.photoIDs[0]);
+                            $('#replace-image-form-visible').submit();
+                        }
+                    }
+                }
+            });
+
+            e.preventDefault();
+            return false;
+        },
         rotate: function (angle, parent) {
             var url = urls.rotate_photo;
             url = url.replace('/0/', '/' + this.photoIDs[0] + '/');

resources/lang/en/admin.php

@@ -143,6 +143,7 @@ return [
         'flip_horizontal' => 'Flip horizontally',
         'flip_vertical' => 'Flip vertically',
         'refresh_thumbnails' => 'Refresh thumbnails',
+        'replace_image' => 'Replace image',
         'rotate_left' => 'Rotate left',
         'rotate_right' => 'Rotate right'
     ],
@@ -154,6 +155,8 @@ return [
     'redirects_actions_heading' => 'Actions',
     'redirects_source_url_heading' => 'Source Address',
     'redirects_text' => 'To access this album using different addresses, you can use redirects. This is useful when you have moved the album to a different parent and the old address no longer works.',
+    'replace_image_message' => 'If your photo isn\'t quite perfect, don\'t worry - just upload a new image using the field below and we\'ll replace it.',
+    'replace_image_title' => 'Replace photo',
     'save_changes_heading' => 'Save changes',
     'save_changes_intro' => 'If you have made any changes to the above fields, you\'ll need to hit the Save Changes button below.',
     'security_groups_heading' => 'Group Permissions',

resources/views/themes/base/admin/show_album.blade.php

@@ -53,6 +53,17 @@
             </div>
         </div>
     </div>
+
+    <!-- Form used for the replace image popup -->
+    <form id="replace-image-form" method="post" action="{{ route('photos.store') }}" enctype="multipart/form-data" style="display: none;">
+        {{ csrf_field() }}
+        <input type="hidden" name="album_id" value="{{ $album->id }}"/>
+        <input type="hidden" name="photo_id" value=""/>
+        <input type="hidden" name="queue_token" value="{{ $queue_token }}"/>
+        <div class="form-group">
+            <input type="file" class="form-control" name="photo[]"/>
+        </div>
+    </form>
 @endsection
 
 @push('scripts')
@@ -74,6 +85,8 @@
     language.select_all_choice_visible_action = '{!! addslashes(trans('admin.select_all_choice.visible_action')) !!}';
     language.image_failed = '{!! addslashes(trans('admin.upload_file_status_failed')) !!}';
     language.image_uploaded = '{!! addslashes(trans('admin.upload_file_status_success')) !!}';
+    language.replace_image_message = '{!! addslashes(trans('admin.replace_image_message')) !!}';
+    language.replace_image_title = '{!! addslashes(trans('admin.replace_image_title')) !!}';
     language.upload_status = '{!! addslashes(trans('admin.upload_file_status_progress')) !!}';
 
     var urls = [];

resources/views/themes/base/partials/single_photo_admin.blade.php

@@ -27,6 +27,8 @@
                             <a href="#" class="dropdown-item flip-photo-horizontal" v-on:click="flipHorizontal"><i class="fa fa-fw fa-arrows-h"></i> @lang('admin.photo_actions.flip_horizontal')</a>
                             <a href="#" class="dropdown-item flip-photo-vertical" v-on:click="flipVertical"><i class="fa fa-fw fa-arrows-v"></i> @lang('admin.photo_actions.flip_vertical')</a>
                             <a href="#" class="dropdown-item flip-photo-both" v-on:click="flipBoth"><i class="fa fa-fw fa-retweet"></i> @lang('admin.photo_actions.flip_both')</a>
+                            <div class="dropdown-divider"></div>
+                            <a href="#" class="dropdown-item flip-photo-both" v-on:click="replacePhoto"><i class="fa fa-fw fa-recycle"></i> @lang('admin.photo_actions.replace_image')</a>
                         </div>
                     </div>
                     @endif