Test mode as icon in sidebar; Process for searching

This commit is contained in:
James Barnsley
2017-09-04 11:25:58 +12:00
parent e7f3f689ea
commit dc15e6bed0
8 changed files with 101 additions and 99 deletions

View File

@ -50,10 +50,6 @@ class App extends React.Component{
this.props.coreActions.startServices()
this.props.coreActions.getBroadcasts()
if (this.props.test_mode){
this.props.uiActions.createNotification('<p>Welcome to test mode! This provides you with additional console logging by using the non-minified code base.</p><p>See <a href="https://github.com/jaedb/Iris/wiki/Advanced#test-mode" target="_blank">Wiki</a> for more information.</p>','info','TEST_MODE','Test mode enabled',true)
}
// when we navigate to a new route
hashHistory.listen( location => {
@ -273,8 +269,7 @@ const mapStateToProps = (state, ownProps) => {
dragger: state.ui.dragger,
modal: state.ui.modal,
context_menu: state.ui.context_menu,
debug_info: state.ui.debug_info,
test_mode: (state.ui.test_mode ? state.ui.test_mode : false)
debug_info: state.ui.debug_info
}
}

View File

@ -11,7 +11,6 @@ export default class SearchSettingsModal extends React.Component{
super(props)
this.state = {
spotify: true,
uri_schemes: []
}
}
@ -21,7 +20,6 @@ export default class SearchSettingsModal extends React.Component{
this.setState(Object.assign({},this.props.search_settings))
} else {
this.setState({
spotify: true,
uri_schemes: Object.assign([],this.props.uri_schemes)
})
}
@ -30,7 +28,6 @@ export default class SearchSettingsModal extends React.Component{
handleSubmit(e){
this.props.uiActions.set({search_settings: this.state})
this.props.uiActions.closeModal()
this.props.coreActions.startSearch('all', this.props.data.query)
}
handleToggle(scheme){
@ -54,16 +51,6 @@ export default class SearchSettingsModal extends React.Component{
<form onSubmit={e => this.handleSubmit(e)}>
<div className="list small">
<div className="list-item field checkbox white">
<label>
<input
type="checkbox"
name="enabled"
checked={ this.state.spotify }
onChange={ e => this.setState({ spotify: !this.state.spotify })} />
<span className="label">spotify &nbsp;<FontAwesome className="grey-text" name={helpers.sourceIcon('spotify')} /></span>
</label>
</div>
{
this.props.uri_schemes.map(scheme => {
return (

View File

@ -90,6 +90,7 @@ class Sidebar extends React.Component{
<Link className={this.linkClassName('settings')} to={global.baseURL+"settings"}>
<Icon name="cog" />
Settings
{ this.props.test_mode ? <FontAwesome name="info-circle" className="orange-text pull-right" />: null}
{ !this.props.mopidy_connected || (!this.props.spotify_connected && this.props.spotify_enabled) || !this.props.pusher_connected ? <FontAwesome name="exclamation-triangle" className="red-text pull-right" /> : null }
</Link>
</section>
@ -118,6 +119,7 @@ const mapStateToProps = (state, ownProps) => {
spotify_enabled: state.spotify.enabled,
spotify_connected: state.spotify.connected,
spotify_authorized: state.spotify.authorization,
test_mode: (state.ui.test_mode ? state.ui.test_mode : false),
dragger: state.ui.dragger
}
}

View File

@ -496,7 +496,8 @@ const MopidyMiddleware = (function(){
context: action.context,
query: action.query,
limit: action.limit,
schemes: store.getState().ui.search_settings.uri_schemes
total: uri_schemes.length,
uri_schemes: store.getState().ui.search_settings.uri_schemes
}
));
break
@ -504,39 +505,62 @@ const MopidyMiddleware = (function(){
case 'MOPIDY_GET_SEARCH_RESULTS_PROCESSOR':
var uri_schemes = Object.assign([], action.data.uri_schemes)
var uri_scheme = uri_schemes.shift()
console.log(action.data.schemes)
break
switch (action.data.context){
/*
switch (action.context){
// Tracks
case 'tracks':
instruct( socket, store, 'library.search', {query: {any: [action.query]}, uris: [action.uri_scheme]})
// Albums
case 'albums':
instruct( socket, store, 'library.search', {query: {album: [action.data.query]}, uris: [uri_scheme]})
.then( response => {
console.log(response)
if (response.length <= 0) return
if (typeof(response[0].tracks) === 'undefined') return
var tracks = response[0].tracks.splice(0,action.limit)
// collate all our different sources into one array
var albums_uris = []
if (response[0].tracks){
for (var i = 0; i < response[0].tracks.length; i++){
if (response[0].tracks[i].album){
var album = response[0].tracks[i].album
if (album.uri){
albums_uris.push(album.uri)
}
}
}
}
// TODO: limit uris at the loop, rather than post loop for performance
albums_uris = helpers.removeDuplicates(albums_uris).splice(0, action.limit)
// load each album
for (var i = 0; i < albums_uris.length; i++){
store.dispatch(mopidyActions.getAlbum(albums_uris[i]))
}
// and plug in their URIs
store.dispatch({
type: 'MOPIDY_SEARCH_RESULTS_LOADED',
context: action.context,
results: tracks
});
type: 'MOPIDY_SEARCH_RESULTS_LOADED',
context: action.data.context,
results: albums_uris
})
store.dispatch(uiActions.processFinished('MOPIDY_GET_SEARCH_RESULTS_PROCESSOR'))
store.dispatch(uiActions.processFinished(
'MOPIDY_GET_SEARCH_RESULTS_PROCESSOR',
'Searching '+uri_scheme,
{
context: action.data.context,
query: action.data.query,
limit: action.data.limit,
uri_schemes: uri_schemes
})
)
})
break
// Artists
case 'artists':
instruct( socket, store, 'library.search', {query: {artist: [action.query]}, uris: [action.uri_scheme]})
instruct( socket, store, 'library.search', {query: {artist: [action.data.query]}, uris: [uri_scheme]})
.then( response => {
if (response.length <= 0) return
@ -565,7 +589,7 @@ const MopidyMiddleware = (function(){
// and plug in their URIs
store.dispatch({
type: 'MOPIDY_SEARCH_RESULTS_LOADED',
context: action.context,
context: action.data.context,
results: artists_uris
})
@ -573,44 +597,6 @@ const MopidyMiddleware = (function(){
})
break
// Albums
case 'albums':
instruct( socket, store, 'library.search', {query: {album: [action.query]}, uris: [action.uri_scheme]})
.then( response => {
if (response.length <= 0) return
// collate all our different sources into one array
var albums_uris = []
if (response[0].tracks){
for (var i = 0; i < response[0].tracks.length; i++){
if (response[0].tracks[i].album){
var album = response[0].tracks[i].album
if (album.uri){
albums_uris.push(album.uri)
}
}
}
}
// TODO: limit uris at the loop, rather than post loop for performance
albums_uris = helpers.removeDuplicates(albums_uris).splice(0, action.limit)
// load each album
for (var i = 0; i < albums_uris.length; i++){
store.dispatch(mopidyActions.getAlbum(albums_uris[i]))
}
// and plug in their URIs
store.dispatch({
type: 'MOPIDY_SEARCH_RESULTS_LOADED',
context: action.context,
results: albums_uris
})
store.dispatch(uiActions.processFinished('MOPIDY_GET_SEARCH_RESULTS_PROCESSOR'))
})
break
// Playlists
case 'playlists':
instruct( socket, store, 'playlists.asList')
@ -635,7 +621,7 @@ const MopidyMiddleware = (function(){
// and plug in their URIs
store.dispatch({
type: 'MOPIDY_SEARCH_RESULTS_LOADED',
context: action.context,
context: action.data.context,
results: playlists_uris
})
@ -643,8 +629,26 @@ const MopidyMiddleware = (function(){
})
break
// Tracks
case 'tracks':
instruct( socket, store, 'library.search', {query: {any: [action.data.query]}, uris: [uri_scheme]})
.then( response => {
if (response.length <= 0) return
if (typeof(response[0].tracks) === 'undefined') return
var tracks = response[0].tracks.splice(0,action.limit)
store.dispatch({
type: 'MOPIDY_SEARCH_RESULTS_LOADED',
context: action.data.context,
results: tracks
});
store.dispatch(uiActions.processFinished('MOPIDY_GET_SEARCH_RESULTS_PROCESSOR'))
})
break
}
*/
break

View File

@ -443,7 +443,7 @@ export function getURL( url, action_name, key = false ){
}
}
export function getSearchResults(query, type = 'album,artist,playlist,track', limit = 50, offset = 0){
export function getSearchResults(type = 'album,artist,playlist,track', query, limit = 50, offset = 0){
return (dispatch, getState) => {
dispatch(uiActions.startProcess('SPOTIFY_GET_SEARCH_RESULTS_PROCESSOR','Searching Spotify'))

View File

@ -29,33 +29,31 @@ class Search extends React.Component{
componentDidMount(){
// Make sure we have search parameters to start with
if (this.props.params && this.props.params.query){
this.props.coreActions.startSearch(this.props.view, this.props.params.query)
}
// Auto-focus on the input field
$(document).find('.search-form input').focus();
if (this.props.mopidy_connected && this.props.search_settings.uri_schemes){
this.props.mopidyActions.getSearchResults(this.props.view, this.props.params.query)
}
if (this.props.mopidy_connected && this.props.search_settings.uri_schemes && this.props.search_settings.uri_schemes.includes('spotify')){
this.props.spotifyActions.getSearchResults(this.props.view, this.props.params.query)
}
}
componentWillReceiveProps(newProps){
// Make sure we have some search parameters
if (newProps.params && newProps.view && newProps.params.query){
if (!this.props.mopidy_connected && newProps.mopidy_connected){
this.props.mopidyActions.getSearchResults(newProps.view, newProps.params.query)
}
if (this.props.params.query != newProps.params.query || this.props.view != newProps.view){
this.props.coreActions.startSearch(newProps.view, newProps.params.query)
}
// mopidy comes online
if (!this.props.mopidy_connected && newProps.mopidy_connected){
this.props.coreActions.startSearch(newProps.view, newProps.params.query, true)
}
if (!this.props.spotify_connected && newProps.spotify_connected && newProps.search_settings.uri_schemes.includes('spotify')){
this.props.spotifyActions.getSearchResults(newProps.view, newProps.params.query)
}
}
loadMore(type){
this.props.spotifyActions.getURL( this.props['spotify_'+type+'_more'], 'SPOTIFY_SEARCH_RESULTS_LOADED_MORE_'+type.toUpperCase());
alert('load more: '+type)
//this.props.spotifyActions.getURL( this.props['spotify_'+type+'_more'], 'SPOTIFY_SEARCH_RESULTS_LOADED_MORE_'+type.toUpperCase());
}
renderResults(){

View File

@ -203,6 +203,7 @@ class Settings extends React.Component {
<button className="no-hover" onClick={e => hashHistory.push(global.baseURL+'settings/debug')}>
<FontAwesome name="flask" />&nbsp;
Debug
{this.props.ui && this.props.ui.test_mode ? <span className="flag warning">Test mode</span> : null}
</button>
<a className="no-hover button" href="https://github.com/jaedb/Iris/wiki" target="_blank">
<FontAwesome name="question" />&nbsp;

View File

@ -268,6 +268,7 @@ button.placeholder {
.grey-text { color: $mid_grey !important; }
.dark-grey-text { color: lighten($dark_grey, 8%) !important; }
.red-text { color: $red !important; }
.blue-text { color: $blue !important; }
.green-text { color: $green !important; }
.orange-text { color: $orange !important; }
.dark-text { color: $dark_grey !important; }
@ -314,6 +315,20 @@ footer {
color: $white;
}
&.info {
background: $yellow;
}
&.warning {
background: $orange;
color: $white;
}
&.bad {
background: $red;
color: $white;
}
&.dark {
background: lighten($dark_grey,10%);
color: $mid_grey;