secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

UI loaders where possible

Browse Source
This commit is contained in:
James Barnsley
2017-05-22 04:19:44 +12:00
parent ca2fbe7183
commit b3ab3c3a5c
18 changed files with 239 additions and 107 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/js/views/discover/Discover.js
View File

@ -11,7 +11,6 @@ import AlbumGrid from '../../components/AlbumGrid'
import TrackList from '../../components/TrackList'
import Parallax from '../../components/Parallax'
import AddSeedField from '../../components/AddSeedField'
import * as helpers from '../../helpers'
import * as spotifyActions from '../../services/spotify/actions'
@ -100,8 +99,8 @@ class Discover extends React.Component{
)
}
renderResults(){
if (helpers.isLoading(this.props.load_queue, 'spotify_recommendations')){
renderResults(){
if (helpers.isLoading(this.props.load_queue,['spotify_browse/recommendations'])){
return (
<div className="body-loader">
<div className="loader"></div>

24
src/js/views/discover/DiscoverCategories.js
View File

@ -5,7 +5,7 @@ import { bindActionCreators } from 'redux'
import Header from '../../components/Header'
import CategoryGrid from '../../components/CategoryGrid'
import * as helpers from '../../helpers'
import * as spotifyActions from '../../services/spotify/actions'
class DiscoverCategories extends React.Component{
@ -19,13 +19,24 @@ class DiscoverCategories extends React.Component{
}
render(){
if (!this.props.categories) return null
if (helpers.isLoading(this.props.load_queue,['spotify_browse/categories'])){
return (
<div className="view discover-categories-view">
<Header icon="grid" title="Genre / Mood" />
<div className="body-loader">
<div className="loader"></div>
</div>
</div>
)
}
// convert categories object into simple array
var categories = []
for (var key in this.props.categories){
if (this.props.categories.hasOwnProperty(key)){
categories.push(this.props.categories[key])
if (this.props.categories){
for (var key in this.props.categories){
if (this.props.categories.hasOwnProperty(key)){
categories.push(this.props.categories[key])
}
}
}
@ -49,7 +60,8 @@ class DiscoverCategories extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
categories: state.ui.categories
categories: state.ui.categories,
load_queue: state.ui.load_queue
}
}

18
src/js/views/discover/DiscoverCategory.js
View File

@ -6,7 +6,7 @@ import { bindActionCreators } from 'redux'
import Header from '../../components/Header'
import PlaylistGrid from '../../components/PlaylistGrid'
import LazyLoadListener from '../../components/LazyLoadListener'
import * as helpers from '../../helpers'
import * as spotifyActions from '../../services/spotify/actions'
class DiscoverCategory extends React.Component{
@ -34,7 +34,20 @@ class DiscoverCategory extends React.Component{
}
render(){
if (!this.props.category) return null
if (helpers.isLoading(this.props.load_queue,['spotify_browse/categories/'])){
return (
<div className="view discover-categories-view">
<Header icon="grid" title={(this.props.category ? this.props.category.name : 'Category')} />
<div className="body-loader">
<div className="loader"></div>
</div>
</div>
)
}
if (!this.props.category){
return null
}
var playlists = []
if (this.props.category.playlists_uris){
@ -67,6 +80,7 @@ class DiscoverCategory extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
load_queue: state.ui.load_queue,
playlists: state.ui.playlists,
category: (state.ui.categories && typeof(state.ui.categories['category:'+ownProps.params.id]) !== 'undefined' ? state.ui.categories['category:'+ownProps.params.id] : false )
}

13
src/js/views/discover/DiscoverFeatured.js
View File

@ -5,7 +5,7 @@ import { bindActionCreators } from 'redux'
import Header from '../../components/Header'
import PlaylistGrid from '../../components/PlaylistGrid'
import * as helpers from '../../helpers'
import * as spotifyActions from '../../services/spotify/actions'
class DiscoverFeatured extends React.Component{
@ -20,6 +20,16 @@ class DiscoverFeatured extends React.Component{
}
render(){
if (helpers.isLoading(this.props.load_queue,['spotify_browse/featured-playlists'])){
return (
<div className="view discover-featured-view">
<Header icon="star" title="Featured playlists" />
<div className="body-loader">
<div className="loader"></div>
</div>
</div>
)
}
var playlists = []
if (this.props.featured_playlists){
@ -51,6 +61,7 @@ class DiscoverFeatured extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
load_queue: state.ui.load_queue,
featured_playlists: state.spotify.featured_playlists,
playlists: state.ui.playlists
}

13
src/js/views/discover/DiscoverNewReleases.js
View File

@ -6,7 +6,7 @@ import { bindActionCreators } from 'redux'
import Header from '../../components/Header'
import AlbumGrid from '../../components/AlbumGrid'
import LazyLoadListener from '../../components/LazyLoadListener'
import * as helpers from '../../helpers'
import * as uiActions from '../../services/ui/actions'
import * as spotifyActions from '../../services/spotify/actions'
@ -25,6 +25,16 @@ class DiscoverNewReleases extends React.Component{
}
render(){
if (helpers.isLoading(this.props.load_queue,['spotify_browse/new-releases'])){
return (
<div className="view discover-new-releases-view">
<Header icon="leaf" title="New Releases" />
<div className="body-loader">
<div className="loader"></div>
</div>
</div>
)
}
var albums = []
if (this.props.new_releases){
@ -57,6 +67,7 @@ class DiscoverNewReleases extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
load_queue: state.ui.load_queue,
albums: state.ui.albums,
new_releases: state.ui.new_releases,
new_releases_more: state.ui.new_releases_more,