diff --git a/src/js/components/Modal/ImageZoomModal.js b/src/js/components/Modal/ImageZoomModal.js index c5ce24b6..f3d50a03 100755 --- a/src/js/components/Modal/ImageZoomModal.js +++ b/src/js/components/Modal/ImageZoomModal.js @@ -22,10 +22,11 @@ class ImageZoomModal extends React.Component{ } render(){ + if (!this.props.data.url){ + return null; + } return ( -
- {this.props.data.url ? : null } -
+
) } } diff --git a/src/js/components/Thumbnail.js b/src/js/components/Thumbnail.js index a84d9bb1..027a9950 100755 --- a/src/js/components/Thumbnail.js +++ b/src/js/components/Thumbnail.js @@ -3,7 +3,6 @@ import React, { PropTypes } from 'react' import { connect } from 'react-redux' import { createStore, bindActionCreators } from 'redux' import FontAwesome from 'react-fontawesome' -import LazyLoad from 'react-lazyload' import * as helpers from '../helpers' import * as uiActions from '../services/ui/actions' @@ -44,15 +43,15 @@ class Thumbnail extends React.Component{ mapImageSizes(props = this.props){ // no images - if (!this.props.image && !this.props.images){ + if (!this.props.image && (!this.props.images || this.props.images.length <= 0)){ return require('../../assets/no-image.svg') // single image - }else if (this.props.image){ + } else if (this.props.image){ return this.props.image // multiple images - }else if (this.props.images && this.props.images.length > 0){ + } else if (this.props.images && this.props.images.length > 0){ var images = helpers.sizedImages(this.props.images ) var size = 'medium' if (this.props.size ) size = this.props.size @@ -77,13 +76,6 @@ class Thumbnail extends React.Component{ zoom_icon = this.zoom(e,image)}> } - /* - // It's a great idea, but interferes with huge lists (like Albums library) - }> -
-
- */ - return (
diff --git a/src/js/views/Album.js b/src/js/views/Album.js index 1d5f7069..da564e6c 100755 --- a/src/js/views/Album.js +++ b/src/js/views/Album.js @@ -122,7 +122,7 @@ class Album extends React.Component{ return (
- +
diff --git a/src/js/views/Queue.js b/src/js/views/Queue.js index 5ebb3582..016fc976 100755 --- a/src/js/views/Queue.js +++ b/src/js/views/Queue.js @@ -70,7 +70,7 @@ class Queue extends React.Component{ var link = null if (this.props.current_track.album && this.props.current_track.album.uri){ - link = '/album/'+this.props.current_track.album.uri; + link = '/album/'+this.props.current_track.album.uri.replace(/[/]/g,'%2F'); } return ( diff --git a/src/scss/components/_modal.scss b/src/scss/components/_modal.scss index b7f133e4..1237784a 100755 --- a/src/scss/components/_modal.scss +++ b/src/scss/components/_modal.scss @@ -162,13 +162,17 @@ &.image_zoom { .content { - text-align: center; - padding: 5vh 5%; + padding: 100px 5%; width: 90%; + height: 100%; + box-sizing: border-box; - img { - max-height: 90vh; - max-width: 100%; + .image { + width: 100%; + height: 100%; + background-size: contain; + background-position: 50% 50%; + background-repeat: no-repeat; } } }