1 files changed, 23 insertions, 2 deletions
diff --git a/animism-align/frontend/app/views/viewer/player/player.transcript.js b/animism-align/frontend/app/views/viewer/player/player.transcript.js
index 7a9d4aa..1743350 100644
--- a/animism-align/frontend/app/views/viewer/player/player.transcript.js
+++ b/animism-align/frontend/app/views/viewer/player/player.transcript.js
@@ -25,6 +25,26 @@ class PlayerTranscript extends Component {
         this.containerRef.current.scrollTo(0, 0)
       }, 20)
     }
+    if (
+      this.props.currentSection.index === 0 &&
+      this.props.isFullscreen &&
+      this.props.isFullscreen !== prevProps.isFullscreen
+    ) {
+      console.log('fullscreen started for the first time')
+      this.scrollToTopOfSection()
+    }
+  }
+
+  scrollToTopOfSection() {
+    const { current } = this.containerRef
+    console.log('scrollToTopOfSection', current)
+    if (!current) return
+    const heading = current.querySelector('.section_heading')
+    let offset = heading ? heading.offsetTop : 0
+    console.log(heading, offset)
+    if (offset) {
+      current.scrollTo(0, offset)
+    }
   }
 
   handleAnnotationClick(e, paragraph, annotation) {
@@ -50,7 +70,7 @@ class PlayerTranscript extends Component {
     if (isHandheld) {
       const isScrolledPastIntro = this.containerRef.current.scrollTop > 100
       if (xor(this.props.viewer.navGradient, isScrolledPastIntro)) {
-        console.log('toggle nav gradient', isScrolledPastIntro)
+        // console.log('toggle nav gradient', isScrolledPastIntro)
         actions.viewer.toggleNavGradient(isScrolledPastIntro)
       }
     }
@@ -64,7 +84,7 @@ class PlayerTranscript extends Component {
   }
 
   render() {
-    const { paragraphs, color, inlineParagraphCount } = this.props.section
+    const { paragraphs, color, inlineParagraphCount } = this.props.currentSection
     const className = "player-transcript " + color + " " + (
       inlineParagraphCount > 2 ? 'scrollable' : 'not-scrollable'
     )
@@ -91,6 +111,7 @@ class PlayerTranscript extends Component {
 
 const mapStateToProps = state => ({
   viewer: state.viewer,
+  currentSection: state.viewer.currentSection,
 })
 
 export default connect(mapStateToProps)(PlayerTranscript)