diff --git a/ui/src/Pages/AlbumPage/AlbumPage.js b/ui/src/Pages/AlbumPage/AlbumPage.js
index 75e63f40..043df226 100644
--- a/ui/src/Pages/AlbumPage/AlbumPage.js
+++ b/ui/src/Pages/AlbumPage/AlbumPage.js
@@ -28,6 +28,9 @@ const albumQuery = gql`
width
height
}
+ original {
+ url
+ }
}
}
}
@@ -82,13 +85,13 @@ class AlbumPage extends Component {
componentDidUpdate(prevProps, prevState) {
if (this.state.presenting) {
- document.history.replaceState(
+ window.history.replaceState(
null,
null,
document.location.pathname + '#' + `present=${this.state.activeImage}`
)
} else if (presentIndexFromHash(document.location.hash)) {
- document.history.replaceState(
+ window.history.replaceState(
null,
null,
document.location.pathname.split('#')[0]
diff --git a/ui/src/Pages/PhotosPage/PhotosPage.js b/ui/src/Pages/PhotosPage/PhotosPage.js
index e87496c0..2b75be7e 100644
--- a/ui/src/Pages/PhotosPage/PhotosPage.js
+++ b/ui/src/Pages/PhotosPage/PhotosPage.js
@@ -18,6 +18,9 @@ const photoQuery = gql`
width
height
}
+ original {
+ url
+ }
}
}
}
diff --git a/ui/src/components/photoGallery/PhotoGallery.js b/ui/src/components/photoGallery/PhotoGallery.js
index c602ddec..b747113d 100644
--- a/ui/src/components/photoGallery/PhotoGallery.js
+++ b/ui/src/components/photoGallery/PhotoGallery.js
@@ -42,6 +42,8 @@ class PhotoGallery extends React.Component {
this.props.setPresenting(false)
}
}
+
+ this.preloadImages = this.preloadImages.bind(this)
}
componentDidMount() {
@@ -52,8 +54,39 @@ class PhotoGallery extends React.Component {
document.removeEventListener('keydown', this.keyDownEvent)
}
+ preloadImages() {
+ function preloadImage(url) {
+ var img = new Image()
+ img.src = url
+ }
+
+ const { activeIndex = -1, photos } = this.props
+
+ if (activeIndex != -1 && photos) {
+ let previousIndex = null
+ let nextIndex = null
+
+ if (activeIndex > 0) {
+ previousIndex = activeIndex - 1
+ } else {
+ previousIndex = photos.length - 1
+ }
+
+ nextIndex = (activeIndex + 1) % photos.length
+
+ preloadImage(photos[nextIndex].original.url)
+ preloadImage(photos[previousIndex].original.url)
+ }
+ }
+
render() {
- const { activeIndex = -1, photos, loading, onSelectImage } = this.props
+ const {
+ activeIndex = -1,
+ photos,
+ loading,
+ onSelectImage,
+ presenting,
+ } = this.props
const activeImage = photos && activeIndex != -1 && photos[activeIndex]
@@ -91,8 +124,9 @@ class PhotoGallery extends React.Component {