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

Merging into one

Browse Source
This commit is contained in:
James Barnsley
2018-01-25 17:04:19 +13:00
parent c9b76c9e17
commit 768508a99f
7 changed files with 84 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/js/components/AddSeedField.js
View File

@ -78,12 +78,12 @@ class AddSeedField extends React.Component{
}
results(){
if (typeof(this.props.results) === 'undefined'){
return null
} else if (typeof(this.props.results[this.id]) === 'undefined'){
return null
if (this.props.results === undefined){
return null;
} else if (this.props.results[this.id] === undefined){
return null;
} else {
return this.props.results[this.id]
return this.props.results[this.id];
}
}
@ -137,7 +137,7 @@ class AddSeedField extends React.Component{
const mapStateToProps = (state, ownProps) => {
return {
genres: (state.ui.genres ? state.ui.genres : null),
genres: (state.spotify.genres ? state.spotify.genres : null),
results: (state.spotify.autocomplete_results ? state.spotify.autocomplete_results : {})
}
}

31
src/js/services/spotify/actions.js
View File

@ -653,7 +653,7 @@ export function getAutocompleteResults(field_id, query, types = ['album','artist
response => {
var genres = []
if (genre_included){
var available_genres = getState().ui.genres
var available_genres = getState().spotify.genres
if (available_genres){
for (var i = 0; i < available_genres.length; i++){
if (available_genres[i].includes(query)){
@ -666,6 +666,35 @@ export function getAutocompleteResults(field_id, query, types = ['album','artist
}
}
}
if (response.artists && response.artists.items){
dispatch({
type: 'ARTISTS_LOADED',
artists: response.artists.items
});
}
if (response.albums && response.albums.items){
dispatch({
type: 'ALBUMS_LOADED',
albums: response.albums.items
});
}
if (response.playlists && response.playlists.items){
dispatch({
type: 'PLAYLISTS_LOADED',
playlists: response.playlists.items
});
}
if (response.tracks && response.tracks.items){
dispatch({
type: 'TRACKS_LOADED',
tracks: response.tracks.items
});
}
dispatch({
type: 'SPOTIFY_AUTOCOMPLETE_LOADED',
field_id: field_id,

8
src/js/services/spotify/reducer.js
View File

@ -162,6 +162,14 @@ export default function reducer(spotify = {}, action){
autocomplete_results: autocomplete_results
})
case 'SPOTIFY_GENRES_LOADED':
return Object.assign(
{},
spotify,
{
genres: action.genres
})
/**
* Library

28
src/js/views/discover/DiscoverRecommendations.js
View File

@ -108,8 +108,8 @@ class Discover extends React.Component{
min: 0,
max: 100,
value: {
min: 25,
max: 75
min: 0,
max: 100
}
},
speechiness: {
@ -303,7 +303,6 @@ class Discover extends React.Component{
return (
<div className="seeds">
<h4 className="underline">Seeds</h4>
{
seeds_objects.map((seed,index) => {
var type = helpers.uriType(seed.uri)
@ -360,7 +359,6 @@ class Discover extends React.Component{
return (
<div className="tunabilities">
<h4 className="underline">Musical properties</h4>
{
enabled_tunabilities.map(tunability => {
return (
@ -390,14 +388,8 @@ class Discover extends React.Component{
}
renderResults(){
if (helpers.isLoading(this.props.load_queue,['spotify_recommendations'])){
return (
<div className="body-loader loading">
<div className="loader"></div>
</div>
)
}
// Results not in
if (!this.props.recommendations || this.props.recommendations.albums_uris === undefined || this.props.recommendations.artists_uris === undefined){
return null;
}
@ -432,6 +424,11 @@ class Discover extends React.Component{
}
}
// Complete records not yet in our index
if (tracks.length <= 0 && artists.length <= 0 && albums.length <= 0){
return null;
}
var uri = 'iris:discover';
if (this.state.seeds){
uri += ':';
@ -475,6 +472,7 @@ class Discover extends React.Component{
}
render(){
var is_loading = helpers.isLoading(this.props.load_queue,['spotify_recommendations']);
var addable_tunabilities = [];
for (var key in this.state.tunabilities){
if (this.state.tunabilities.hasOwnProperty(key)){
@ -507,10 +505,12 @@ class Discover extends React.Component{
<h2 className="grey-text">
Add seeds and musical properties below to build your sound
</h2>
<div className="parameters">
{this.renderSeeds()}
{this.renderTunabilities()}
</div>
<div className="actions">
<span className="button primary large" onClick={e => this.getRecommendations()}>
<span className={"button primary large"+(is_loading ? " working" : "")} onClick={e => this.getRecommendations()}>
<FontAwesome name="compass" />&nbsp;
Find recommendations
</span>
@ -542,9 +542,7 @@ const mapStateToProps = (state, ownProps) => {
authorized: state.spotify.authorization,
load_queue: state.ui.load_queue,
quick_search_results: (state.spotify.quick_search_results ? state.spotify.quick_search_results : {artists: [], tracks: []}),
recommendations: (state.spotify.recommendations ? state.spotify.recommendations : {}),
favorite_artists: (state.spotify.favorite_artists ? state.spotify.favorite_artists : []),
favorite_tracks: (state.spotify.favorite_tracks ? state.spotify.favorite_tracks : [])
recommendations: (state.spotify.recommendations ? state.spotify.recommendations : {})
}
}

4
src/scss/global/_forms.scss
View File

@ -168,6 +168,8 @@ input[type="submit"] {
&.working {
position: relative;
cursor: wait !important;
background: $grey;
color: $mid_grey;
&:after {
pointer-events: none;
@ -175,7 +177,7 @@ input[type="submit"] {
display: block;
content: '';
animation: slideloader 1s infinite;
background: rgba(200,200,200,0.4);
background: rgba(200,200,200,0.3);
top: 0;
left: 0;
bottom: 0;

18
src/scss/global/_variables.scss
View File

@ -117,9 +117,21 @@ $bp_shallow: 650px;
}
@keyframes slideloader {
0% { left: 0%; right: 100%; }
50% { left: 0%; right: 0%; }
100% { left: 100%; right: 0%; }
0% {
left: 0%;
right: 100%;
border-radius: 3px 0 0 3px;
}
50% {
left: 0%;
right: 0%;
border-radius: 3px;
}
100% {
left: 100%;
right: 0%;
border-radius: 0 3px 3px 0;
}
}

12
src/scss/views/_discover.scss
View File

@ -31,12 +31,12 @@
}
}
.seeds,
.tunabilities {
.parameters {
padding-top: 30px;
h3 {
padding-bottom: 6px;
.seeds,
.tunabilities {
display: inline-block;
}
}
@ -45,7 +45,7 @@
display: inline-block;
background: $blue;
color: $white;
padding: 8px 26px 8px 14px;
padding: 8px 26px 6px 14px;
font-size: 16px;
position: relative;
vertical-align: top;
@ -118,7 +118,7 @@
input {
background: rgba(100,100,100,0.5);
color: $white;
padding: 7px 13px;
padding: 8px 13px 6px;
font-size: 16px;
border: 1px solid transparent;