From 46bcc43688b856c331b20a650a425a11ebc024b5 Mon Sep 17 00:00:00 2001
From: Chuck Dries <chuck@chuckdries.com>
Date: Sat, 10 Jul 2021 09:27:56 -0700
Subject: [PATCH] add some photos, add dates to GalleryImage, sort photos on
 homepage

---
 data/gallery/20160530-DSC09108.jpg |  3 +++
 data/gallery/20180424-DSC07948.jpg |  3 +++
 data/gallery/20200215-DSC02584.jpg |  3 +++
 data/gallery/DSC06161.jpg          |  3 +++
 data/gallery/_DSC4224.jpg          |  3 +++
 src/components/GalleryImage.js     | 11 +++++++++++
 src/pages/index.js                 |  5 +++--
 src/pages/photogallery.js          |  4 ++--
 8 files changed, 31 insertions(+), 4 deletions(-)
 create mode 100644 data/gallery/20160530-DSC09108.jpg
 create mode 100644 data/gallery/20180424-DSC07948.jpg
 create mode 100644 data/gallery/20200215-DSC02584.jpg
 create mode 100644 data/gallery/DSC06161.jpg
 create mode 100644 data/gallery/_DSC4224.jpg

diff --git a/data/gallery/20160530-DSC09108.jpg b/data/gallery/20160530-DSC09108.jpg
new file mode 100644
index 0000000..b9662ff
--- /dev/null
+++ b/data/gallery/20160530-DSC09108.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:e6ee8da3ccdaba5eb1d3cdfcc79539daaa6041b7837143635fdaf49a894a0ee9
+size 4731606
diff --git a/data/gallery/20180424-DSC07948.jpg b/data/gallery/20180424-DSC07948.jpg
new file mode 100644
index 0000000..91c2843
--- /dev/null
+++ b/data/gallery/20180424-DSC07948.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:9b23de835c13725d4a647688cf985244577952a832b767e25a8323ad9776f7a6
+size 3212629
diff --git a/data/gallery/20200215-DSC02584.jpg b/data/gallery/20200215-DSC02584.jpg
new file mode 100644
index 0000000..ed1025a
--- /dev/null
+++ b/data/gallery/20200215-DSC02584.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:2e2e11ef98081398f11350beb96824ede731259d5011c0f9e56d07f9d3097812
+size 6937924
diff --git a/data/gallery/DSC06161.jpg b/data/gallery/DSC06161.jpg
new file mode 100644
index 0000000..3f5a6e9
--- /dev/null
+++ b/data/gallery/DSC06161.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:ff9f167f7045f3137f786bca8eff8869155f372fa59c4cd0f6c3bc75f0bd2e70
+size 9009774
diff --git a/data/gallery/_DSC4224.jpg b/data/gallery/_DSC4224.jpg
new file mode 100644
index 0000000..e0ce689
--- /dev/null
+++ b/data/gallery/_DSC4224.jpg
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:ca7f5dc52486ca7c03caa7119f4f603f3471a36a31ce13d226a129b8fe94dedb
+size 2912711
diff --git a/src/components/GalleryImage.js b/src/components/GalleryImage.js
index 81d009f..def40f9 100644
--- a/src/components/GalleryImage.js
+++ b/src/components/GalleryImage.js
@@ -69,6 +69,7 @@ const GalleryImage = ({ data, pageContext }) => {
   const orientationClasses = ar > 1 ? 'flex-col mx-auto' : 'portrait:mx-auto landscape:mx-5 landscape:flex-row-reverse portrait:flex-col';
   console.log(ar, orientationClasses);
   const shutterSpeed = React.useMemo(() => getShutterFractionFromExposureTime(meta.exif.ExposureTime || 0), [meta]);
+  const dateTaken = React.useMemo(() => new Date(meta.dateTaken), [meta]);
   return (<>
     <Helmet>
       <title>{name} - Gallery | Chuck Dries</title>
@@ -127,6 +128,16 @@ const GalleryImage = ({ data, pageContext }) => {
             <p className="landscape:mr-2">{meta.iptc.caption}</p>
           </div>
           {<div className="portrait:border-t-2 border-muted-light portrait:mt-2 mr-2 portrait:mb-1" style={{width: 30}}></div>}
+          {dateTaken &&
+            <div className={classnames('flex items-baseline ml-2 text-lg',
+              ar <= 1 ? 'flex-row-reverse' : 'portrait:flex-row-reverse')}
+            title="shutter speed"
+            >
+              <span className="icon-offset mr-1">
+                <ion-icon name="calendar"></ion-icon>
+              </span>
+              <span className="mr-1">{dateTaken.toLocaleDateString()}</span>
+            </div>}
           {(locationString) &&
             <div className={classnames('flex items-baseline ml-2 text-lg',
               ar <= 1 ? 'flex-row-reverse' : 'portrait:flex-row-reverse')}
diff --git a/src/pages/index.js b/src/pages/index.js
index 082cb9d..cc8a604 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -141,7 +141,7 @@ const IndexPage = ({ data: { allFile: { edges } } }) => {
                 title="view image details"
                 to={`/photogallery/${image.base}/`}
               >
-                <span className="icon-offset"><ion-icon name="expand"></ion-icon></span>
+                <span className="icon-offset"><ion-icon name="image"></ion-icon></span>
               </Link>
               <button
                 className={classnames(
@@ -182,7 +182,8 @@ export const query = graphql`
       # images that don't work well
       # base: {nin: ["DSC06517.jpg"]}
       # childrenImageSharp: {elemMatch: {fluid: {aspectRatio: {lte: 1.3}}}}
-      }
+      },
+    sort: {order: DESC, fields: childrenImageSharp___fields___imageMeta___dateTaken}
   ) {
     edges {
       node {
diff --git a/src/pages/photogallery.js b/src/pages/photogallery.js
index 0004136..8460e53 100644
--- a/src/pages/photogallery.js
+++ b/src/pages/photogallery.js
@@ -54,8 +54,8 @@ const GalleryPage = ({ data }) => {
 
 export const query = graphql`
 query GalleryPageQuery {
-  allFile(filter: {
-    sourceInstanceName: { eq: "gallery" }}
+  allFile(
+    filter: { sourceInstanceName: { eq: "gallery" } }
     sort: {order: DESC, fields: childrenImageSharp___fields___imageMeta___dateTaken}
   ) {
     edges {