feat(stoptime): Adds ability to stop time at position

docs/standalone.html

@@ -275,8 +275,7 @@
                 "title": "Support"
               },
               "comment": null
-            }],
-            "transcripts": "http://localhost:8080/fixtures/transcripts/fs207.json"
+            }]
           }
     </script>
 

src/effects/index.js

@@ -1,7 +1,9 @@
 import { compose } from 'lodash/fp'
+
+import { INIT } from 'store/types'
+
 import storage from 'utils/storage'
 import keyhandler from 'utils/keyboard'
-
 import { hasProperty, conditionalEffect } from 'utils/effects'
 import { callWith } from 'utils/helper'
 
@@ -12,7 +14,7 @@ import componentsEffects from './components'
 import quantileEffects from './quantiles'
 import chapterEffects from './chapters'
 import volumeEffects from './volume'
-import urlEffects from './url'
+import playbackEffects from './playback'
 import transcriptEffects from './transcripts'
 
 import mediaPlayer from '../media'
@@ -24,13 +26,13 @@ const playerEffects = playerEffectsFactory(mediaPlayer)
 const dispatcherEffects = [keyboardEffects]
 
 let actionEffects = [
+  conditionalEffect(playbackEffects),
   compose(conditionalEffect(chapterEffects), hasProperty('chapters')),
   conditionalEffect(playerEffects),
   conditionalEffect(storageEffects),
   conditionalEffect(quantileEffects),
   conditionalEffect(volumeEffects),
   conditionalEffect(componentsEffects),
-  conditionalEffect(urlEffects),
   compose(conditionalEffect(transcriptEffects), hasProperty('transcripts'))
 ]
 
@@ -41,7 +43,7 @@ export default store => {
     next(action)
 
     // Conditional effects need the initial payload to create
-    if (action.type === 'INIT') {
+    if (action.type === INIT) {
       actionEffects = actionEffects.map(callWith(action.payload))
     }
 

src/effects/playback.js

@@ -1,10 +1,12 @@
 import actions from 'store/actions'
-import { SET_URL_PARAMS } from 'store/types'
+import { SET_PLAYBACK_PARAMS, SET_PLAYTIME } from 'store/types'
 
 import { handleActions } from 'utils/effects'
 
+let paused = false
+
 export default handleActions({
-  [SET_URL_PARAMS]: ({ dispatch }, { payload }) => {
+  [SET_PLAYBACK_PARAMS]: ({ dispatch }, { payload }) => {
     if (payload.starttime) {
       dispatch(actions.setPlaytime(payload.starttime))
       dispatch(actions.idle())
@@ -13,5 +15,16 @@ export default handleActions({
     if (payload.autoplay) {
       dispatch(actions.play())
     }
+  },
+
+  [SET_PLAYTIME]: ({ dispatch }, { payload }, state) => {
+    if (!state.playback.stoptime) {
+      return
+    }
+
+    if (state.playback.stoptime <= payload && paused === false) {
+      dispatch(actions.pause())
+      paused = true
+    }
   }
 })

src/effects/playback.test.js

@@ -8,13 +8,13 @@ let store
 test.beforeEach(t => {
   store = {
     dispatch: sinon.stub(),
-    getState: () => {}
+    getState: () => ({})
   }
 })
 
-test(`playbackEffects: it dispatches autoplay on SET_URL_PARAMS`, t => {
+test(`playbackEffects: it dispatches autoplay on SET_PLAYBACK_PARAMS`, t => {
   urlEffects(store, {
-    type: 'SET_URL_PARAMS',
+    type: 'SET_PLAYBACK_PARAMS',
     payload: {
       autoplay: true
     }
@@ -25,9 +25,9 @@ test(`playbackEffects: it dispatches autoplay on SET_URL_PARAMS`, t => {
   })
 })
 
-test(`playbackEffects: it dispatches starttime on SET_URL_PARAMS`, t => {
+test(`playbackEffects: it dispatches SET_PLAYTIME on SET_PLAYBACK_PARAMS`, t => {
   urlEffects(store, {
-    type: 'SET_URL_PARAMS',
+    type: 'SET_PLAYBACK_PARAMS',
     payload: {
       starttime: 10
     }
@@ -42,3 +42,46 @@ test(`playbackEffects: it dispatches starttime on SET_URL_PARAMS`, t => {
     type: 'IDLE'
   })
 })
+
+test(`playbackEffects: it dispatches PAUSE on SET_PLAYTIME if stoptime is not defined`, t => {
+  store.getState = () => ({
+    playback: {
+      starttime: 10
+    },
+    playtime: 15
+  })
+
+  urlEffects(store, {
+    type: 'SET_PLAYTIME',
+    payload: {
+      starttime: 10
+    }
+  })
+
+  t.is(store.dispatch.getCalls().length, 0)
+})
+
+test(`playbackEffects: it dispatches PAUSE on SET_PLAYTIME if stoptime is defined`, t => {
+  store.getState = () => ({
+    playback: {
+      starttime: 10,
+      stoptime: 15
+    }
+  })
+
+  urlEffects(store, {
+    type: 'SET_PLAYTIME',
+    payload: 15
+  })
+
+  t.deepEqual(store.dispatch.getCall(0).args[0], {
+    type: 'UI_PAUSE'
+  })
+
+  urlEffects(store, {
+    type: 'SET_PLAYTIME',
+    payload: 120
+  })
+
+  t.is(store.dispatch.getCalls().length, 1)
+})

src/embed/embed.js

@@ -8,7 +8,7 @@ import { findNode, tag } from 'utils/dom'
 import requestConfig from 'utils/request'
 import { urlParameters } from 'utils/url'
 import { sandbox, sandboxWindow } from 'utils/sandbox'
-import { SET_URL_PARAMS } from 'store/types'
+import { SET_PLAYBACK_PARAMS } from 'store/types'
 
 import loader from './loader'
 
@@ -44,7 +44,7 @@ const sandboxFromSelector = compose(sandbox, findNode)
 
 const dispatchUrlParameters = store => {
   store.dispatch({
-    type: SET_URL_PARAMS,
+    type: SET_PLAYBACK_PARAMS,
     payload: urlParameters
   })
 

src/store/playback/actions.js

@@ -1,5 +1,5 @@
 import { createAction } from 'redux-actions'
 
-import { SET_URL_PARAMS } from '../types'
+import { SET_PLAYBACK_PARAMS } from '../types'
 
-export const setUrlParams = createAction(SET_URL_PARAMS)
+export const setUrlParams = createAction(SET_PLAYBACK_PARAMS)

src/store/playback/reducer.js

@@ -1,6 +1,6 @@
 import { handleActions } from 'redux-actions'
 
-import { SET_URL_PARAMS } from '../types'
+import { SET_PLAYBACK_PARAMS } from '../types'
 
 export const INITIAL_STATE = {
   starttime: null,
@@ -9,5 +9,5 @@ export const INITIAL_STATE = {
 }
 
 export const reducer = handleActions({
-  [SET_URL_PARAMS]: (state, { payload }) => payload
+  [SET_PLAYBACK_PARAMS]: (state, { payload }) => payload
 }, INITIAL_STATE)

src/store/types.js

@@ -96,4 +96,4 @@ export const PREVIOUS_SEARCH_RESULT = 'PREVIOUS_SEARCH_RESULT'
 export const RESET_SEARCH_TRANSCRIPTS = 'RESET_SEARCH_TRANSCRIPTS'
 
 // Restore
-export const SET_URL_PARAMS = 'SET_URL_PARAMS'
+export const SET_PLAYBACK_PARAMS = 'SET_PLAYBACK_PARAMS'

src/utils/time.test.js

@@ -1,11 +1,11 @@
 import test from 'ava'
 import {
-    fromPlayerTime,
-    toPlayerTime,
-    localeDate,
-    secondsToMilliseconds,
-    millisecondsToSeconds
-  } from './time'
+  fromPlayerTime,
+  toPlayerTime,
+  localeDate,
+  secondsToMilliseconds,
+  millisecondsToSeconds
+} from './time'
 
 test('exports a method called fromPlayerTime', t => {
   t.truthy(typeof fromPlayerTime === 'function')

src/utils/url.js

@@ -1,5 +1,5 @@
 import queryString from 'query-string'
-import { head, isString } from 'lodash'
+import { isString } from 'lodash'
 
 import { toPlayerTime } from 'utils/time'