3 files changed, 17 insertions, 4 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 283f3cb..cdfc5dc 100644
--- a/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
+++ b/animism-align/frontend/app/views/viewer/nav/eflux.chrome.js
@@ -47,7 +47,7 @@ class EfluxChrome extends Component {
     }
   }
   render() {
-    const { navStyle, playing, transcriptOpen, growlOpen, growlMessage } = this.props
+    const { navStyle, playing, transcriptOpen, growlOpen, growlMessage, atEndOfSection, currentSection } = this.props
     return (
       <div className={"eflux-header " + navStyle + (transcriptOpen ? ' transcript-open' : '')}>
         <div className="eflux-logo">
@@ -84,7 +84,7 @@ class EfluxChrome extends Component {
         <div className={this.state.play ? "growl-tooltip tooltip-play hover" : "growl-tooltip tooltip-play"}>
           {this.state.playMessage}
         </div>
-        <div className={this.state.transcript ? "growl-tooltip tooltip-transcript hover" : "growl-tooltip tooltip-transcript"}>
+        <div className={((atEndOfSection && currentSection.index === 0) || this.state.transcript) ? "growl-tooltip tooltip-transcript hover" : "growl-tooltip tooltip-transcript"}>
           {'Read the Transcript'}
         </div>
       </div>
@@ -98,6 +98,8 @@ const mapStateToProps = state => ({
   transcriptOpen: state.viewer.transcript,
   growlOpen: state.viewer.growlOpen,
   growlMessage: state.viewer.growlMessage,
+  atEndOfSection: state.viewer.atEndOfSection,
+  currentSection: state.viewer.currentSection,
 })
 
 export default connect(mapStateToProps)(EfluxChrome)
diff --git a/animism-align/frontend/app/views/viewer/viewer.actions.js b/animism-align/frontend/app/views/viewer/viewer.actions.js
index 449d224..e35567d 100644
--- a/animism-align/frontend/app/views/viewer/viewer.actions.js
+++ b/animism-align/frontend/app/views/viewer/viewer.actions.js
@@ -293,8 +293,12 @@ export const showCredits = () => dispatch => {
 export const reachedEndOfSection = currentSection => dispatch => {
   actions.audio.pause()
   dispatch({ type: types.viewer.reached_end_of_section })
-  if (currentSection && currentSection.index === 0) {
-    actions.viewer.openGrowl(GROWL.REACHED_END_OF_FIRST_SECTION)
+  if (currentSection) {
+    // reached end of first section
+    if (currentSection.index === 0) {
+      actions.viewer.openGrowl(GROWL.REACHED_END_OF_FIRST_SECTION)
+    }
+    // reached end of last section
   }
 }
 
diff --git a/animism-align/frontend/app/views/viewer/viewer.reducer.js b/animism-align/frontend/app/views/viewer/viewer.reducer.js
index 587ae0f..e1a0167 100644
--- a/animism-align/frontend/app/views/viewer/viewer.reducer.js
+++ b/animism-align/frontend/app/views/viewer/viewer.reducer.js
@@ -36,6 +36,7 @@ const initialState = {
   /* growl message at top */
   growlOpen: true,
   growlMessage: GROWL.OPENING_MESSAGE,
+  growlTranscriptOpen: false,
 
   /* vitrine */
   vitrineModal: {
@@ -50,6 +51,12 @@ const initialState = {
 export default function viewerReducer(state = initialState, action) {
   // console.log(action.type, action)
   switch (action.type) {
+    case types.viewer.set_value:
+      return {
+        ...state,
+        [action.key]: action.value,
+      }
+
     case types.viewer.toggle_component:
       return {
         ...state,