From 58a87bdda0eb2ab8d128b19c39d3287db7387b9b Mon Sep 17 00:00:00 2001
From: ajmaley <maleya@mail.gvsu.edu>
Date: Wed, 5 Dec 2018 17:31:40 -0500
Subject: [PATCH] Fixing Gallery bug

---
 src/components/FlameLinkCollectionGallery.js | 36 +++++++++++++++++---
 src/components/RenderGallery.js              |  2 ++
 2 files changed, 33 insertions(+), 5 deletions(-)

diff --git a/src/components/FlameLinkCollectionGallery.js b/src/components/FlameLinkCollectionGallery.js
index 77860ea..47d4300 100644
--- a/src/components/FlameLinkCollectionGallery.js
+++ b/src/components/FlameLinkCollectionGallery.js
@@ -16,14 +16,28 @@ const styles = theme => ({
     },
 
     flamelinkGallery: {
-        marginRight: "auto",
-        marginLeft: "auto",
+        marginRight: 'auto',
+        marginLeft: 'auto',
+        backgroundImage: 'url(../images/galleryBackgroundImage.png)',
+        overflow: 'hidden',
+        minHeight: 300,
+        minWidth:  300,
+        width:     'auto',
+        height:    'auto',
     },
 
     flamelinkGalleryContainer: {
         backgroundColor: 'black',
         marginTop: 20,
     },
+    flamelinkGalleryInnerContainer: {
+        maxHeight:   1000,
+        minHeight:   250,
+        height:      'auto',
+        width:       'auto',
+        marginRight: 'auto',
+        marginLeft:  'auto',
+    },
 });
 
 class FlameLinkCollectionGallery extends Component {
@@ -43,6 +57,10 @@ class FlameLinkCollectionGallery extends Component {
                 break;
         }
     }
+    
+    state = {
+        active: false,
+    }
 
     constructor(props) {
         super(props);
@@ -51,7 +69,7 @@ class FlameLinkCollectionGallery extends Component {
             schemaDetails: '',
             schemaContent: '',
             schemaDescription: '',
-        }
+        };
 
         flamelinkApp.schemas.getFields(this.props.galleryName, { fields: ['title', 'key', 'type', 'gridColumns', 'description', 'options'] })
             .then(result => this.setState({
@@ -74,6 +92,10 @@ class FlameLinkCollectionGallery extends Component {
         this.getPageTitle(this.props.galleryName);
     }
 
+    toggleClass = () => {
+        this.setState(state => ({ active: !state.active }));
+    }
+
     getGalleryInfo(schemaDetails, schemaContent) {
         var key;
         var mediaNums = [];
@@ -111,8 +133,12 @@ class FlameLinkCollectionGallery extends Component {
                     {this.state.schemaDescription}
                 </Typography>
                 <Grid container className={classes.flamelinkGalleryContainer}>
-                    <Grid item lg={8} md={8} sm={12} xs={12} className={classes.flamelinkGallery} >
-                        <RenderGallery key={Math.random()} />
+                    <Grid container className={classes.flamelinkGalleryInnerContainer}>
+                        <Grid item lg={8} md={8} sm={12} xs={12} className={classes.flamelinkGallery} onClick={this.toggleClass}>
+                            <div onClick={this.toggleClass}>
+                                <RenderGallery key={Math.random()} />
+                            </div>
+                        </Grid>
                     </Grid>
                 </Grid>
             </Grid>
diff --git a/src/components/RenderGallery.js b/src/components/RenderGallery.js
index ce87837..fc316b8 100644
--- a/src/components/RenderGallery.js
+++ b/src/components/RenderGallery.js
@@ -12,6 +12,7 @@ class RenderGallery extends Component {
             showIndex: true,
             showBullets: true,
             mounted: false,
+            autoPlay: true,
         }
     }
 
@@ -31,6 +32,7 @@ class RenderGallery extends Component {
                 showIndex={this.state.showIndex}
                 showBullets={this.state.showBullets}
                 onImageLoad={this._onImageLoad}
+                autoPlay={this.state.autoPlay}
             />
         );
     }