1 files changed, 3 insertions, 7 deletions
diff --git a/animism-align/frontend/app/views/viewer/sections/viewer.sections.js b/animism-align/frontend/app/views/viewer/sections/viewer.sections.js
index 05eef9c..e0ec212 100644
--- a/animism-align/frontend/app/views/viewer/sections/viewer.sections.js
+++ b/animism-align/frontend/app/views/viewer/sections/viewer.sections.js
@@ -6,7 +6,7 @@ import actions from 'app/actions'
 import ViewerSectionsNav from './viewer.sections.nav'
 import { ROMAN_NUMERALS, CURTAIN_COLOR_LOOKUP } from 'app/constants'
 import { clamp, timestamp, floatInRange, floatLT } from 'app/utils'
-import { thumbnailURL } from 'app/utils/annotation.utils'
+import { thumbnailURL, sectionProgressPercentage } from 'app/utils/annotation.utils'
 import { SpeakerIcon } from '../nav/viewer.icons'
 
 class ViewerSections extends Component {
@@ -23,7 +23,7 @@ class ViewerSections extends Component {
             // console.log(section)
             const media = section.media.length ? section.media[0].media : null
             const { no_audio, section_nav_color } = section
-            const progress = Math.round(sectionProgress(section, play_ts) * 100)
+            const progress = sectionProgressPercentage(section, play_ts)
             return (
               <div
                 className={(!currentSection || section.index === currentSection.index) ? "viewer-section current-section" : "viewer-section"}
@@ -44,7 +44,7 @@ class ViewerSections extends Component {
                         </div>
                         <div className="section-progress-bar">
                           <div className="section-progress"
-                            style={{ width: progress + '%' }}
+                            style={{ width: progress }}
                           />
                         </div>
                       </div>
@@ -68,10 +68,6 @@ class ViewerSections extends Component {
   }
 }
 
-const sectionProgress = (section, play_ts) => {
-  return (clamp(play_ts, section.start_ts, section.end_ts) - section.start_ts) / section.duration
-}
-
 const mapStateToProps = state => ({
   nav: state.viewer.nav,
   play_ts: state.audio.play_ts,