fix video support

src/components/Photobook.jsx

@@ -1,51 +0,0 @@
-import React from 'react'
-
-class Photobook extends React.Component {
-
-
-  constructor(props) {
-    super(props)
-    this.state ={
-      isLoading: true,
-      isLoaded: false
-    }
-    this.loadImgs = this.loadImgs.bind(this)
-  }
-
-  loadImgs() {
-    console.log(this.props.src)
-    Promise.resolve()
-      .then(fetch(this.props.src))
-      .then(res => {
-        console.log(res)
-      })
-      .then(() => {
-        this.setState({ isLoading: false, isLoaded: true })
-      })
-  }
-
-  componentDidMount() {
-    if (this.state.isLoading) this.loadImgs()
-  }
-
-  // componentWillReceiveProps(nextProps) {
-  //
-  //   if (!src.length) return this.setState({ isLoading: false, isLoaded: false })
-  //   this.setState({ isLoading: true, isLoaded: false })
-  // }
-
-  render() {
-    if (this.state.isLoading) {
-      return <div>Loading</div>
-    }
-    return <div>Ciao</div>
-  }
-}
-
-Photobook.propTypes = {
-  loader: false,
-  unloader: false,
-  src: []
-}
-
-export default Photobook

src/components/SourceOverlay.jsx

@@ -15,11 +15,13 @@ class SourceOverlay extends React.Component {
   }
 
   renderVideo() {
+    // NB: assume only one video
     return (
       <div className="media-player">
         <Player
+          className='source-video'
           playsInline
-          src={`${this.props.source.path}.mp4`}
+          src={this.props.source.paths[0]}
         />
       </div>
     )

src/scss/mediaoverlay.scss

@@ -147,11 +147,16 @@ $header-inset: 10px;
 .source-image-container {
   padding: 0 25px;
   overflow-y: scroll;
-  max-height: 100%;
-  .source-image {
-    max-width: calc(100% - 20px);
-    max-height: 100%;
-    padding: 10px;
-  }
+  height: 100%;
 }
 
+.source-image, .source-video {
+  max-width: calc(100% - 20px);
+  max-height: 350px !important;
+  height: 100%;
+  padding: 10px;
+}
+
+.media-player {
+  overflow-y: hidden;
+}