diff --git a/src/components/SourceOverlay.jsx b/src/components/SourceOverlay.jsx index 5dcf13e..f3b8487 100644 --- a/src/components/SourceOverlay.jsx +++ b/src/components/SourceOverlay.jsx @@ -7,28 +7,32 @@ import NoSource from './presentational/NoSource' class SourceOverlay extends React.Component { constructor(props) { super(props) + this.renderVideo = this.renderVideo.bind(this) this.renderPhoto = this.renderPhoto.bind(this) } - renderVideo() { - // return ( - // - //
- //
- // - //
- //
- // - // - //
- //
- //
- // ) + renderPlaceholder() { return ( ) } + renderVideo() { + return ( + +
+
+ +
+
+ + +
+
+
+ ) + } + renderPhoto() { const imageExts = ['.jpg', '.png'] const possibleUrls = imageExts.map(ext => `${this.props.source.path}${ext}`) @@ -54,7 +58,7 @@ class SourceOverlay extends React.Component { } _renderSwitch() { - console.table(this.props.source) + // console.table(this.props.source) switch(this.props.source.type) { case 'Video': return this.renderVideo() @@ -68,6 +72,9 @@ class SourceOverlay extends React.Component { } render() { + if (typeof(this.props.source) !== 'object') { + return this.renderPlaceholder(); + } const {id, url, title, date, type, affil_1, affil_2} = this.props.source return (
diff --git a/src/scss/mediaoverlay.scss b/src/scss/mediaoverlay.scss index 17fbb18..ba07555 100644 --- a/src/scss/mediaoverlay.scss +++ b/src/scss/mediaoverlay.scss @@ -47,7 +47,7 @@ $header-inset: 10px; } .mo-container { - background-color: rgba(239, 239, 239, 0.8); + background-color: rgba(239, 239, 239, 0.9); max-width: $panel-width; min-width: $panel-width; max-height: $panel-height; diff --git a/src/selectors/index.js b/src/selectors/index.js index 0a96eee..e9535a5 100644 --- a/src/selectors/index.js +++ b/src/selectors/index.js @@ -166,10 +166,12 @@ export const selectSelected = createSelector( if (selected.length === 0) { return [] } + + // NB: return source object if exists, otherwise null const srcs = selected .map(e => e.sources) .map(_sources => - _sources.map(id => sources[id]) + _sources.map(id => (sources.hasOwnProperty(id) ? sources[id] : null)) ) return selected.map((s, idx) => ({