inverse overlay, growl, fix next button when nav open

1 files changed, 8 insertions, 4 deletions

diff --git a/animism-align/frontend/app/views/viewer/nav/nav.parent.js b/animism-align/frontend/app/views/viewer/nav/nav.parent.js
index 8ad0cd1..ca1c148 100644
--- a/animism-align/frontend/app/views/viewer/nav/nav.parent.js
+++ b/animism-align/frontend/app/views/viewer/nav/nav.parent.js
@@ -5,7 +5,7 @@ import actions from 'app/actions'
 import { ROMAN_NUMERALS } from 'app/constants'
 import { Arrow } from './viewer.icons'
 import NavPlayer from './nav.player'
-import { thumbnailURL } from 'app/utils/annotation.utils'
+import { thumbnailURL, sectionProgressPercentage } from 'app/utils/annotation.utils'
 
 class NavParent extends Component {
   state = {
@@ -38,11 +38,11 @@ class NavParent extends Component {
     }, 50)
   }
   render() {
-    const { viewer } = this.props
+    const { viewer, play_ts } = this.props
     let containerClassName = "viewer-nav " + viewer.navStyle
     let navClassName = 'nav-row main-nav'
-    if (this.state.hoveringNav) navClassName += ' hovering-nav'
-    if (this.state.hoveringNext || viewer.atEndOfSection) containerClassName += ' hovering-next'
+    if (this.state.hoveringNav) containerClassName += ' hovering-nav'
+    if ((this.state.hoveringNext || viewer.atEndOfSection) && !viewer.nav) containerClassName += ' hovering-next'
     return (
       <div className={containerClassName} onMouseLeave={this.handleMouseLeave}>
         <div className={navClassName}>
@@ -73,6 +73,9 @@ class NavParent extends Component {
               </span>
             }
           </div>
+          <div className="nav-progress-percentage" style={{
+            width: viewer.currentSection ? sectionProgressPercentage(viewer.currentSection, play_ts) : 0
+          }} />
         </div>
         {viewer.nextSection &&
           <div className="next-section-thumbnail"
@@ -91,6 +94,7 @@ class NavParent extends Component {
 
 const mapStateToProps = state => ({
   viewer: state.viewer,
+  play_ts: state.audio.play_ts,
 })
 
 export default connect(mapStateToProps)(NavParent)