close fullscreen

1 files changed, 8 insertions, 2 deletions

diff --git a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
index 5775b11..e58e2e1 100644
--- a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
+++ b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
@@ -57,7 +57,8 @@ class EfluxChrome extends Component {
   render() {
     const {
       navStyle, navGradient,
-      playing, transcriptOpen, isFullscreen,
+      playing, transcriptOpen,
+      isFullscreen, fullscreenVisible,
       growlOpen, growlMessage,
       atEndOfSection, currentSection
     } = this.props
@@ -81,11 +82,15 @@ class EfluxChrome extends Component {
           {growlMessage}
         </div>
         <div className="eflux-nav">
-          {isFullscreen &&
+          {isFullscreen && fullscreenVisible &&
             <div
               className="fullscreen-close"
               onMouseEnter={() => this.handleMouseEnter('close')}
               onMouseLeave={() => this.handleMouseLeave('close')}
+              onClick={() => {
+                actions.viewer.toggleFullscreenVisible(false)
+                this.handleMouseLeave('close')
+              }}
             >
               {EfluxClose}
             </div>
@@ -150,6 +155,7 @@ const mapStateToProps = state => ({
   atEndOfSection: state.viewer.atEndOfSection,
   currentSection: state.viewer.currentSection,
   isFullscreen: state.viewer.isFullscreen,
+  fullscreenVisible: state.viewer.fullscreenVisible,
 })
 
 export default connect(mapStateToProps)(EfluxChrome)