Videos playing properly immediately after purchase

ui/js/component/video/index.js

@@ -30,7 +30,7 @@ const select = (state) => ({
 })
 
 const perform = (dispatch) => ({
-  play: () => dispatch(doLoadVideo()),
+  loadVideo: () => dispatch(doLoadVideo()),
   watchVideo: (elem) => dispatch(doWatchVideo()),
   closeModal: () => dispatch(doCloseModal()),
 })

ui/js/component/video/view.jsx

@@ -91,11 +91,12 @@ class Video extends React.Component {
     return (
       <div onMouseMove={this.handleMouseMove.bind(this)} onMouseLeave={this.handleMouseLeave.bind(this)} className={"video " + this.props.className + (isPlaying && readyToPlay ? " video--active" : " video--hidden")}>{
         isPlaying ?
-        !readyToPlay  ?
+        !readyToPlay ?
         <span>this is the world's worst loading screen and we shipped our software with it anyway... <br /><br />{loadStatusMessage}</span> :
         <VideoPlayer downloadPath={fileInfo.download_path} /> :
         <div className="video__cover" style={{backgroundImage: 'url("' + metadata.thumbnail + '")'}}>
-          <WatchLink icon="icon-play" onWatchClick={this.onWatchClick.bind(this)} startPlaying={this.startPlaying.bind(this)} {...this.props}></WatchLink>
+          <WatchLink icon="icon-play" onWatchClick={this.onWatchClick.bind(this)}
+                     startPlaying={this.startPlaying.bind(this)} {...this.props}></WatchLink>
         </div>
       }</div>
     );

ui/js/selectors/content.js

@@ -84,6 +84,8 @@ export const selectFetchingFileInfos = createSelector(
   (state) => state.fetchingFileInfos || {}
 )
 
+// TODO make this smarter so it doesn't start playing and immediately freeze
+// while downloading more.
 export const selectCurrentUriFileReadyToPlay = createSelector(
   selectCurrentUriFileInfo,
   (fileInfo) => (fileInfo || {}).written_bytes > 0