Add interval modifiers

src/components/RsvpReader.js

@@ -9,7 +9,7 @@ import { PlayerControl } from './PlayerControl'
 import styles from './RsvpReader.css'
 import { BorderMarker } from './PivotMarker'
 import { Progress } from './Progress'
-import { TimeCalc } from './TimeCalc'
+import { TotalTime } from './TotalTime'
 
 export const RsvpReader = () => {
   return (
@@ -28,7 +28,7 @@ export const RsvpReader = () => {
           </SegmentControl>
         </div>
         <Options></Options>
-        <TimeCalc />
+        <TotalTime />
       </div>
       <div className={styles.item}>{/* <TextOutput /> */}</div>
     </div>

src/components/TotalTime.js

@@ -1,6 +1,6 @@
 import React from 'react'
 import { useSelector } from 'react-redux'
-import { selectSegments, selectWpm } from '../store/selectors'
+import { selectTotalTime } from '../store/selectors'
 
 function formatTime(totalSeconds) {
   const hours = Math.floor(totalSeconds / 3600)
@@ -10,14 +10,12 @@ function formatTime(totalSeconds) {
   return `${hours}:${pad(minutes)}:${pad(seconds)}`
 }
 
-export const TimeCalc = () => {
-  const wpm = useSelector(selectWpm)
-  const segments = useSelector(selectSegments)
-  const minutesNeeded = segments.length / wpm
+export const TotalTime = () => {
+  const millis = useSelector(selectTotalTime)
   return (
     <div>
       <h2>Time needed</h2>
-      Time needed for Text: {formatTime(minutesNeeded * 60)}
+      Time needed for Text: {formatTime(millis / 1000)}
     </div>
   )
 }

src/lib/intervalModifier.js

@@ -0,0 +1,36 @@
+const commonWords = [
+  'I',
+  'he',
+  'she',
+  'it',
+  'you',
+  'the',
+  'a',
+  'to',
+  'of',
+  'and',
+  'in'
+]
+const punctuations = [
+  '.',
+  ',',
+  ':',
+  ';',
+  '\\',
+  '=',
+  '/',
+  '*',
+  '’',
+  '(',
+  ')',
+  '&'
+]
+
+export function intervalModifier(segment) {
+  // double the interval on punctuations
+  if (punctuations.some(el => segment.includes(el))) return 2
+  // half the interval on common words
+  if (commonWords.includes(segment)) return 0.5
+  // unmodified interval
+  return 1
+}

src/store/selectors.js

@@ -3,6 +3,7 @@ import { parseText } from '../lib/parseText'
 
 import { getNextBiggerNumber, getNextSmallerNumber } from '../lib/array-util.js'
 import { pivotize } from '../lib/pivotize'
+import { intervalModifier } from '../lib/intervalModifier'
 
 // util
 const notNull = val => val != null
@@ -137,11 +138,27 @@ export const safeSelectPrevSentence = createSelector(
   (has, sentence, idx) => (has ? sentence : idx)
 )
 
-// options
+// options2
 
 export const selectWpm = state => state.wpm
-export const selectInterval = createSelector(selectWpm, wpm => 60000 / wpm)
 export const selectOffset = state => state.offset
+export const selectBaseInterval = createSelector(selectWpm, wpm => 60000 / wpm)
+
+export const selectIntervals = createSelector(
+  selectSegments,
+  selectBaseInterval,
+  (segments, interval) => segments.map(seg => interval * intervalModifier(seg))
+)
+
+export const selectInterval = createSelector(
+  selectIntervals,
+  selectCurrentSegmentIndex,
+  (intervals, idx) => intervals[idx]
+)
+
+export const selectTotalTime = createSelector(selectIntervals, intervals =>
+  intervals.reduce((a, b) => a + b, 0)
+)
 
 // player