diff --git a/frontend/src/app/pages/photos.vue b/frontend/src/app/pages/photos.vue
index da460aacb..9b11ea69d 100644
--- a/frontend/src/app/pages/photos.vue
+++ b/frontend/src/app/pages/photos.vue
@@ -1,5 +1,6 @@
 <template>
-    <div class="p-page p-page-photos" v-infinite-scroll="loadMore" infinite-scroll-disabled="loadMoreDisabled" infinite-scroll-distance="10">
+    <div class="p-page p-page-photos" v-infinite-scroll="loadMore" infinite-scroll-disabled="loadMoreDisabled"
+         infinite-scroll-distance="10">
         <v-form ref="form" lazy-validation @submit="formChange" dense>
             <v-toolbar flat color="blue-grey lighten-4">
                 <v-text-field class="pt-3 pr-3"
@@ -136,10 +137,14 @@
                 </v-btn>
             </v-speed-dial>
 
-            <p-photo-tiles v-if="query.view === 'tiles'" :photos="results" :selection="selected" :select="selectPhoto" :open="openPhoto" :like="likePhoto"></p-photo-tiles>
-            <p-photo-mosaic v-if="query.view === 'mosaic'" :photos="results" :selection="selected" :select="selectPhoto" :open="openPhoto" :like="likePhoto"></p-photo-mosaic>
-            <p-photo-details v-if="query.view === 'details'" :photos="results" :selection="selected" :select="selectPhoto" :open="openPhoto" :like="likePhoto"></p-photo-details>
-            <p-photo-list v-if="query.view === 'list'" :photos="results" :selection="selected" :select="selectPhoto" :open="openPhoto" :like="likePhoto"></p-photo-list>
+            <p-photo-tiles v-if="query.view === 'tiles'" :photos="results" :selection="selected" :select="selectPhoto"
+                           :open="openPhoto" :like="likePhoto"></p-photo-tiles>
+            <p-photo-mosaic v-if="query.view === 'mosaic'" :photos="results" :selection="selected" :select="selectPhoto"
+                            :open="openPhoto" :like="likePhoto"></p-photo-mosaic>
+            <p-photo-details v-if="query.view === 'details'" :photos="results" :selection="selected"
+                             :select="selectPhoto" :open="openPhoto" :like="likePhoto"></p-photo-details>
+            <p-photo-list v-if="query.view === 'list'" :photos="results" :selection="selected" :select="selectPhoto"
+                          :open="openPhoto" :like="likePhoto"></p-photo-list>
         </v-container>
 
         <v-dialog v-model="dialog" dark persistent max-width="600px">
@@ -428,18 +433,12 @@
                 this.selected = [];
             },
             selectPhoto(photo) {
-                if (photo.selected) {
-                    for (let i = 0; i < this.selected.length; i++) {
-                        if (this.selected[i].id === photo.id) {
-                            this.selected.splice(i, 1);
-                            break;
-                        }
-                    }
+                const index = this.selected.indexOf(photo.ID);
 
-                    photo.selected = false;
+                if (index === -1) {
+                    this.selected.push(photo.ID);
                 } else {
-                    this.selected.push(photo);
-                    photo.selected = true;
+                    this.selected.splice(index, 1);
                 }
             },
             likePhoto(photo) {
diff --git a/frontend/src/component/p-photo-details.vue b/frontend/src/component/p-photo-details.vue
index 53f5a9659..f951ae07f 100644
--- a/frontend/src/component/p-photo-details.vue
+++ b/frontend/src/component/p-photo-details.vue
@@ -17,12 +17,12 @@
             >
                 <v-hover>
                     <v-card tile slot-scope="{ hover }"
-                            :dark="photo.selected"
-                            :class="photo.selected ? 'elevation-14 ma-1' : 'elevation-2 ma-2'">
+                            :dark="selection.includes(photo.ID)"
+                            :class="selection.includes(photo.ID) ? 'elevation-14 ma-1' : 'elevation-2 ma-2'">
                         <v-img
                                 :src="photo.getThumbnailUrl('tile_500')"
                                 aspect-ratio="1"
-                                v-bind:class="{ selected: photo.selected }"
+                                v-bind:class="{ selected: selection.includes(photo.ID) }"
                                 style="cursor: pointer"
                                 class="grey lighten-2"
                                 @click="open(index)"
@@ -38,11 +38,11 @@
                                 <v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
                             </v-layout>
 
-                            <v-btn v-if="hover || photo.selected" :flat="!hover" icon large absolute
+                            <v-btn v-if="hover || selection.includes(photo.ID)" :flat="!hover" icon large absolute
                                    :ripple="false" style="right: 4px; bottom: 4px;"
                                    class="p-photo-select"
                                    @click.stop.prevent="select(photo)">
-                                <v-icon v-if="selection.length && photo.selected" color="white">check_box</v-icon>
+                                <v-icon v-if="selection.length && selection.includes(photo.ID)" color="white">check_box</v-icon>
                                 <v-icon v-else color="white">check_box_outline_blank</v-icon>
                             </v-btn>
 
diff --git a/frontend/src/component/p-photo-mosaic.vue b/frontend/src/component/p-photo-mosaic.vue
index b78cc26ae..b2b6ad6e3 100644
--- a/frontend/src/component/p-photo-mosaic.vue
+++ b/frontend/src/component/p-photo-mosaic.vue
@@ -12,14 +12,13 @@
             <v-flex
                     v-for="(photo, index) in photos"
                     :key="index"
-                    v-bind:class="{ selected: photo.selected }"
+                    v-bind:class="{ selected: selection.includes(photo.ID) }"
                     class="p-photo"
                     xs4 sm3 md2 lg1 d-flex
             >
                 <v-hover>
                     <v-card tile slot-scope="{ hover }"
-                            :dark="photo.selected"
-                            :class="photo.selected ? 'elevation-14 ma-1' : hover ? 'elevation-6 ma-2' : 'elevation-2 ma-2'">
+                            :class="selection.includes(photo.ID) ? 'elevation-14 ma-1' : hover ? 'elevation-6 ma-2' : 'elevation-2 ma-2'">
                         <v-img :src="photo.getThumbnailUrl('tile_224')"
                                aspect-ratio="1"
                                class="grey lighten-2"
@@ -37,11 +36,11 @@
                                                      color="grey lighten-5"></v-progress-circular>
                             </v-layout>
 
-                            <v-btn v-if="hover || photo.selected" :flat="!hover" icon large absolute
+                            <v-btn v-if="hover || selection.includes(photo.ID)" :flat="!hover" icon large absolute
                                    :ripple="false" style="right: 1px; bottom: 1px;"
                                    class="p-photo-select"
                                    @click.stop.prevent="select(photo)">
-                                <v-icon v-if="selection.length && photo.selected" color="white">check_box</v-icon>
+                                <v-icon v-if="selection.length && selection.includes(photo.ID)" color="white">check_box</v-icon>
                                 <v-icon v-else color="white">check_box_outline_blank</v-icon>
                             </v-btn>
 
diff --git a/frontend/src/component/p-photo-tiles.vue b/frontend/src/component/p-photo-tiles.vue
index 282c0e8a8..1d785b29e 100644
--- a/frontend/src/component/p-photo-tiles.vue
+++ b/frontend/src/component/p-photo-tiles.vue
@@ -12,14 +12,13 @@
             <v-flex
                     v-for="(photo, index) in photos"
                     :key="index"
-                    v-bind:class="{ selected: photo.selected }"
+                    v-bind:class="{ selected: selection.includes(photo.ID) }"
                     class="p-photo"
                     xs12 sm6 md3 lg2 d-flex
             >
                 <v-hover>
                     <v-card tile slot-scope="{ hover }"
-                            :dark="photo.selected"
-                            :class="photo.selected ? 'elevation-14 ma-1' : hover ? 'elevation-6 ma-2' : 'elevation-2 ma-2'">
+                            :class="selection.includes(photo.ID) ? 'elevation-14 ma-1' : hover ? 'elevation-6 ma-2' : 'elevation-2 ma-2'">
                         <v-img :src="photo.getThumbnailUrl('tile_500')"
                                aspect-ratio="1"
                                class="grey lighten-2"
@@ -37,12 +36,12 @@
                                                      color="grey lighten-5"></v-progress-circular>
                             </v-layout>
 
-                            <v-btn v-if="hover || photo.selected" :flat="!hover" icon large absolute
+                            <v-btn v-if="hover || selection.includes(photo.ID)" :flat="!hover" icon large absolute
                                    :ripple="false" style="right: 4px; bottom: 4px;"
                                    class="p-photo-select"
                                    @click.stop.prevent="select(photo)">
-                                <v-icon v-if="selection.length && photo.selected" color="white">check_box</v-icon>
-                                <v-icon v-else-if="!photo.selected" color="white">check_box_outline_blank</v-icon>
+                                <v-icon v-if="selection.length && selection.includes(photo.ID)" color="white">check_box</v-icon>
+                                <v-icon v-else-if="!selection.includes(photo.ID)" color="white">check_box_outline_blank</v-icon>
                             </v-btn>
 
                             <v-btn v-if="hover || photo.PhotoFavorite" :flat="!hover" icon large absolute