Reorganising component folder structure

src/js/App.js

@@ -6,7 +6,7 @@ import { hashHistory, Link } from 'react-router'
 import { connect } from 'react-redux'
 
 import Sidebar from './components/Sidebar'
-import PlaybackControls from './components/PlaybackControls'
+import PlaybackControls from './components/Fields/PlaybackControls'
 import ContextMenu from './components/ContextMenu'
 import Dragger from './components/Dragger'
 import Modal from './components/Modal/Modal'

src/js/components/Fields/AddSeedField.js

@@ -4,11 +4,11 @@ import { connect } from 'react-redux'
 import { bindActionCreators } from 'redux'
 import { Link, hashHistory } from 'react-router'
 
-import ArtistSentence from './ArtistSentence'
-import * as helpers from '../helpers'
-import * as coreActions from '../services/core/actions'
-import * as uiActions from '../services/ui/actions'
-import * as spotifyActions from '../services/spotify/actions'
+import ArtistSentence from './../ArtistSentence'
+import * as helpers from '../../helpers'
+import * as coreActions from '../../services/core/actions'
+import * as uiActions from '../../services/ui/actions'
+import * as spotifyActions from '../../services/spotify/actions'
 
 class AddSeedField extends React.Component{
 

src/js/components/Fields/AddTunabilityField.js

@@ -4,11 +4,11 @@ import { connect } from 'react-redux'
 import { bindActionCreators } from 'redux'
 import { Link, hashHistory } from 'react-router'
 
-import ArtistSentence from './ArtistSentence'
-import * as helpers from '../helpers'
-import * as coreActions from '../services/core/actions'
-import * as uiActions from '../services/ui/actions'
-import * as spotifyActions from '../services/spotify/actions'
+import ArtistSentence from './../ArtistSentence'
+import * as helpers from '../../helpers'
+import * as coreActions from '../../services/core/actions'
+import * as uiActions from '../../services/ui/actions'
+import * as spotifyActions from '../../services/spotify/actions'
 
 class AddSeedField extends React.Component{
 

src/js/components/Fields/Dropzone.js

@@ -3,7 +3,7 @@ import React, { PropTypes } from 'react'
 import { connect } from 'react-redux'
 import { bindActionCreators } from 'redux'
 
-import Icon from './Icon'
+import Icon from './../Icon'
 
 export default class Dropzone extends React.Component{
 

src/js/components/Fields/Dropzones.js

@@ -5,9 +5,9 @@ import { bindActionCreators } from 'redux'
 
 import Dropzone from './Dropzone'
 
-import * as uiActions from '../services/ui/actions'
-import * as mopidyActions from '../services/mopidy/actions'
-import * as spotifyActions from '../services/spotify/actions'
+import * as uiActions from '../../services/ui/actions'
+import * as mopidyActions from '../../services/mopidy/actions'
+import * as spotifyActions from '../../services/spotify/actions'
 
 class Dropzones extends React.Component{
 

src/js/components/Fields/FollowButton.js

@@ -5,9 +5,9 @@ import { Link } from 'react-router'
 import { createStore, bindActionCreators } from 'redux'
 import FontAwesome from 'react-fontawesome'
 
-import * as helpers from '../helpers'
-import * as uiActions from '../services/ui/actions'
-import * as spotifyActions from '../services/spotify/actions'
+import * as helpers from '../../helpers'
+import * as uiActions from '../../services/ui/actions'
+import * as spotifyActions from '../../services/spotify/actions'
 
 class FollowButton extends React.Component{
 

src/js/components/Fields/LastfmAuthenticationFrame.js

@@ -3,12 +3,12 @@ import React, { PropTypes } from 'react'
 import { connect } from 'react-redux'
 import { createStore, bindActionCreators } from 'redux'
 import ReactGA from 'react-ga'
-
 import FontAwesome from 'react-fontawesome'
-import Thumbnail from './Thumbnail'
 
-import * as uiActions from '../services/ui/actions'
-import * as lastfmActions from '../services/lastfm/actions'
+import Thumbnail from '../Thumbnail'
+
+import * as uiActions from '../../services/ui/actions'
+import * as lastfmActions from '../../services/lastfm/actions'
 
 class LastfmAuthenticationFrame extends React.Component{
 

src/js/components/Fields/LastfmLoveButton.js

@@ -5,9 +5,9 @@ import { Link } from 'react-router'
 import { createStore, bindActionCreators } from 'redux'
 import FontAwesome from 'react-fontawesome'
 
-import * as helpers from '../helpers'
-import * as uiActions from '../services/ui/actions'
-import * as lastfmActions from '../services/lastfm/actions'
+import * as helpers from '../../helpers'
+import * as uiActions from '../../services/ui/actions'
+import * as lastfmActions from '../../services/lastfm/actions'
 
 class FollowButton extends React.Component{
 

src/js/components/Fields/PlaybackControls.js

@@ -7,15 +7,15 @@ import FontAwesome from 'react-fontawesome'
 
 import ProgressSlider from './ProgressSlider'
 import VolumeControl from './VolumeControl'
-import Dater from './Dater'
-import ArtistSentence from './ArtistSentence'
-import Thumbnail from './Thumbnail'
-import Icon from './Icon'
+import Dater from './../Dater'
+import ArtistSentence from './../ArtistSentence'
+import Thumbnail from './../Thumbnail'
+import Icon from './../Icon'
 
-import * as helpers from '../helpers'
-import * as uiActions from '../services/ui/actions'
-import * as coreActions from '../services/core/actions'
-import * as mopidyActions from '../services/mopidy/actions'
+import * as helpers from '../../helpers'
+import * as uiActions from '../../services/ui/actions'
+import * as coreActions from '../../services/core/actions'
+import * as mopidyActions from '../../services/mopidy/actions'
 
 class PlaybackControls extends React.Component{
 

src/js/components/Fields/ProgressSlider.js

@@ -3,7 +3,7 @@ import React, { PropTypes } from 'react'
 import { connect } from 'react-redux'
 import { bindActionCreators } from 'redux'
 
-import * as mopidyActions from '../services/mopidy/actions'
+import * as mopidyActions from '../../services/mopidy/actions'
 
 class ProgressSlider extends React.Component{
 

src/js/components/Fields/SearchForm.js

@@ -5,8 +5,8 @@ import { hashHistory } from 'react-router'
 import { createStore, bindActionCreators } from 'redux'
 import FontAwesome from 'react-fontawesome'
 
-import * as helpers from '../helpers'
-import * as uiActions from '../services/ui/actions'
+import * as helpers from '../../helpers'
+import * as uiActions from '../../services/ui/actions'
 
 class SearchForm extends React.Component{
 

src/js/components/Fields/SpotifyAuthenticationFrame.js

@@ -3,12 +3,12 @@ import React, { PropTypes } from 'react'
 import { connect } from 'react-redux'
 import { createStore, bindActionCreators } from 'redux'
 import ReactGA from 'react-ga'
-
 import FontAwesome from 'react-fontawesome'
-import Thumbnail from './Thumbnail'
 
-import * as uiActions from '../services/ui/actions'
-import * as spotifyActions from '../services/spotify/actions'
+import Thumbnail from '../Thumbnail'
+
+import * as uiActions from '../../services/ui/actions'
+import * as spotifyActions from '../../services/spotify/actions'
 
 class SpotifyAuthenticationFrame extends React.Component{
 

src/js/components/Modal/EditSnapcastClientModal.js

@@ -1,62 +0,0 @@
-
-import React, { PropTypes } from 'react';
-import FontAwesome from 'react-fontawesome';
-
-import Icon from '../Icon';
-import * as helpers from '../../helpers';
-
-export default class EditSnapcastClientModal extends React.Component{
-
-	constructor(props){
-		super(props);
-		var client = this.props.clients[this.props.data.id];
-		this.state = {
-			id: client.id,
-			name: client.config.name,
-			latency: client.config.latency.toString()
-		};
-	}
-
-	handleSave(e){
-		this.props.pusherActions.setSnapcastClientName(this.state.id, this.state.name);
-		this.props.pusherActions.setSnapcastClientLatency(this.state.id, parseInt(this.state.latency));
-		this.props.uiActions.closeModal();
-	}
-
-	handleDelete(e){
-		this.props.pusherActions.deleteSnapcastClient(this.state.id);
-		this.props.uiActions.closeModal();
-	}
-
-	render(){
-		return (
-			<div>
-				<h1>Edit speaker</h1>
-				<h2 className="grey-text">Description</h2>
-
-				<form>
-					<div className="field text">
-						<span className="label">Name</span>
-						<input 
-							type="text"
-							onChange={e => this.setState({name: e.target.value})} 
-							value={this.state.name} />
-					</div>
-					<div className="field text">
-						<span className="label">Latency (ms)</span>
-						<input 
-							type="number"
-							onChange={e => this.setState({latency: e.target.value})} 
-							value={this.state.latency} />
-					</div>
-				</form>
-				<form>
-					<div className="actions centered-text">
-						<button className="destructive large" onClick={e => this.handleDelete(e)}>Delete</button>
-						<button className="primary large" onClick={e => this.handleSave(e)}>Save</button>
-					</div>
-				</form>
-			</div>
-		)
-	}
-}

src/js/components/Modal/Modal.js

@@ -11,7 +11,6 @@ import AddToQueueModal from './AddToQueueModal'
 import CreatePlaylistModal from './CreatePlaylistModal'
 import EditPlaylistModal from './EditPlaylistModal'
 import EditRadioModal from './EditRadioModal'
-import EditSnapcastClientModal from './EditSnapcastClientModal'
 import ImageZoomModal from './ImageZoomModal'
 import KioskModeModal from './KioskModeModal'
 import SearchURISchemesModal from './SearchURISchemesModal'
@@ -116,13 +115,6 @@ class Modal extends React.Component{
 						artists={this.props.artists} 
 						tracks={this.props.tracks} /> : null }
 
-					{ this.props.modal.name == 'edit_snapcast_client' ? <EditSnapcastClientModal 
-						uiActions={this.props.uiActions} 
-						pusherActions={this.props.pusherActions} 
-						data={this.props.modal.data} 
-						clients={this.props.snapcast_clients} 
-						groups={this.props.snapcast_groups} /> : null }
-
 					{ this.props.modal.name == 'image_zoom' ? <ImageZoomModal 
 						uiActions={this.props.uiActions} 
 						data={this.props.modal.data} /> : null }
@@ -167,9 +159,7 @@ const mapStateToProps = (state, ownProps) => {
 		mopidy_connected: state.mopidy.connected,
 		spotify_authorized: state.spotify.authorization,
 		spotify_library_playlists: state.spotify.library_playlists,
-		mopidy_library_playlists: state.mopidy.library_playlists,
-		snapcast_groups: state.pusher.snapcast_groups,
-		snapcast_clients: state.pusher.snapcast_clients
+		mopidy_library_playlists: state.mopidy.library_playlists
 	}
 }
 

src/js/components/Services.js

@@ -8,8 +8,8 @@ import FontAwesome from 'react-fontawesome'
 import Thumbnail from './Thumbnail'
 import Icon from './Icon'
 import URILink from './URILink'
-import SpotifyAuthenticationFrame from '../components/SpotifyAuthenticationFrame'
-import LastfmAuthenticationFrame from '../components/LastfmAuthenticationFrame'
+import SpotifyAuthenticationFrame from '../components/Fields/SpotifyAuthenticationFrame'
+import LastfmAuthenticationFrame from '../components/Fields/LastfmAuthenticationFrame'
 import Snapcast from '../components/Snapcast'
 
 import * as uiActions from '../services/ui/actions'

src/js/components/Sidebar.js

@@ -5,7 +5,7 @@ import { bindActionCreators } from 'redux'
 import { Link, withRouter } from 'react-router'
 
 import Icon from './Icon'
-import Dropzones from './Dropzones'
+import Dropzones from './Fields/Dropzones'
 import Thumbnail from './Thumbnail'
 
 import FontAwesome from 'react-fontawesome'

src/js/components/Snapcast.js

@@ -6,9 +6,9 @@ import { Link, hashHistory } from 'react-router'
 import FontAwesome from 'react-fontawesome'
 
 import ArtistSentence from './ArtistSentence'
-import VolumeControl from './VolumeControl'
-import LatencyControl from './LatencyControl'
-import TextField from './Forms/TextField'
+import VolumeControl from './Fields/VolumeControl'
+import LatencyControl from './Fields/LatencyControl'
+import TextField from './Fields/TextField'
 
 import * as helpers from '../helpers'
 import * as coreActions from '../services/core/actions'

src/js/components/VersionManager.js

@@ -1,57 +0,0 @@
-
-import React, { PropTypes } from 'react'
-import { connect } from 'react-redux'
-import { Link } from 'react-router'
-import { createStore, bindActionCreators } from 'redux'
-
-import FontAwesome from 'react-fontawesome'
-
-import * as pusherActions from '../services/pusher/actions'
-
-class VersionManager extends React.Component{
-
-	constructor(props){
-		super(props);
-	}
-
-	renderUpgradeButton(){
-		return <button className="productive" onClick={() => this.props.pusherActions.startUpgrade()}>Upgrade to { this.props.pusher.version.latest }</button>
-		
-		if (this.props.pusher.upgrading){
-			return (
-				<button className="productive working" disabled>
-					<FontAwesome name="circle-o-notch" spin />
-					&nbsp;
-					Upgrading
-				</button>
-			);
-		}
-
-		if (this.props.pusher.version.upgrade_available){
-			return <button className="productive" onClick={() => this.props.pusherActions.startUpgrade()}>Upgrade to { this.props.pusher.version.latest }</button>
-		}
-
-		return <button className="secondary" disabled>Already up-to-date</button>
-	}
-
-	render(){
-		return (
-			<span className="version-manager">
-				<span>{ this.props.pusher.version.current } installed</span>
-				{this.renderUpgradeButton()}
-			</span>
-		);
-	}
-}
-
-const mapStateToProps = (state, ownProps) => {
-	return state;
-}
-
-const mapDispatchToProps = (dispatch) => {
-	return {
-		pusherActions: bindActionCreators(pusherActions, dispatch)
-	}
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(VersionManager)

src/js/services/mopidy/middleware.js

@@ -1348,7 +1348,7 @@ const MopidyMiddleware = (function(){
              **/
 
             case 'MOPIDY_GET_LIBRARY_PLAYLISTS':
-                request(socket, store, 'playlists.asList' )
+                request(socket, store, 'playlists.asList')
                     .then(response => {
 
                         // drop in our URI list
@@ -1387,7 +1387,9 @@ const MopidyMiddleware = (function(){
                                         type: 'PLAYLIST_LOADED', 
                                         key: playlist.uri,
                                         playlist: playlist 
-                                    })
+                                    });
+
+                                    console.log(playlist);
                                 })
                         }
                     })

src/js/views/Album.js

@@ -10,7 +10,7 @@ import Thumbnail from '../components/Thumbnail'
 import Parallax from '../components/Parallax'
 import ArtistSentence from '../components/ArtistSentence'
 import ArtistGrid from '../components/ArtistGrid'
-import FollowButton from '../components/FollowButton'
+import FollowButton from '../components/Fields/FollowButton'
 import Dater from '../components/Dater'
 import LazyLoadListener from '../components/LazyLoadListener'
 import ContextMenuTrigger from '../components/ContextMenuTrigger'

src/js/views/Artist.js

@@ -13,9 +13,9 @@ import Thumbnail from '../components/Thumbnail'
 import Parallax from '../components/Parallax'
 import ArtistGrid from '../components/ArtistGrid'
 import RelatedArtists from '../components/RelatedArtists'
-import FollowButton from '../components/FollowButton'
+import FollowButton from '../components/Fields/FollowButton'
 import ContextMenuTrigger from '../components/ContextMenuTrigger'
-import DropdownField from '../components/DropdownField'
+import DropdownField from '../components/Fields/DropdownField'
 
 import * as helpers from '../helpers'
 import * as uiActions from '../services/ui/actions'

src/js/views/Playlist.js

@@ -9,9 +9,9 @@ import ReactGA from 'react-ga'
 import TrackList from '../components/TrackList'
 import Thumbnail from '../components/Thumbnail'
 import Dater from '../components/Dater'
-import ConfirmationButton from '../components/ConfirmationButton'
+import ConfirmationButton from '../components/Fields/ConfirmationButton'
 import LazyLoadListener from '../components/LazyLoadListener'
-import FollowButton from '../components/FollowButton'
+import FollowButton from '../components/Fields/FollowButton'
 import Header from '../components/Header'
 import ContextMenuTrigger from '../components/ContextMenuTrigger'
 import URILink from '../components/URILink'

src/js/views/Search.js

@@ -7,13 +7,13 @@ import FontAwesome from 'react-fontawesome'
 import ReactGA from 'react-ga'
 
 import Header from '../components/Header'
-import DropdownField from '../components/DropdownField'
+import DropdownField from '../components/Fields/DropdownField'
 import TrackList from '../components/TrackList'
 import ArtistGrid from '../components/ArtistGrid'
 import AlbumGrid from '../components/AlbumGrid'
 import PlaylistGrid from '../components/PlaylistGrid'
 import LazyLoadListener from '../components/LazyLoadListener'
-import SearchForm from '../components/SearchForm'
+import SearchForm from '../components/Fields/SearchForm'
 import URILink from '../components/URILink'
 
 import * as helpers from '../helpers'

src/js/views/Settings.js

@@ -5,7 +5,7 @@ import { hashHistory, Link } from 'react-router'
 import { bindActionCreators } from 'redux'
 import FontAwesome from 'react-fontawesome'
 
-import ConfirmationButton from '../components/ConfirmationButton'
+import ConfirmationButton from '../components/Fields/ConfirmationButton'
 import PusherConnectionList from '../components/PusherConnectionList'
 import Header from '../components/Header'
 import Parallax from '../components/Parallax'

src/js/views/Track.js

@@ -10,8 +10,8 @@ import TrackList from '../components/TrackList'
 import Thumbnail from '../components/Thumbnail'
 import ArtistSentence from '../components/ArtistSentence'
 import ArtistGrid from '../components/ArtistGrid'
-import FollowButton from '../components/FollowButton'
-import LastfmLoveButton from '../components/LastfmLoveButton'
+import FollowButton from '../components/Fields/FollowButton'
+import LastfmLoveButton from '../components/Fields/LastfmLoveButton'
 import Dater from '../components/Dater'
 import LazyLoadListener from '../components/LazyLoadListener'
 import ContextMenuTrigger from '../components/ContextMenuTrigger'

src/js/views/User.js

@@ -6,7 +6,7 @@ import FontAwesome from 'react-fontawesome'
 
 import Thumbnail from '../components/Thumbnail'
 import PlaylistGrid from '../components/PlaylistGrid'
-import FollowButton from '../components/FollowButton'
+import FollowButton from '../components/Fields/FollowButton'
 import LazyLoadListener from '../components/LazyLoadListener'
 import Parallax from '../components/Parallax'
 import ContextMenuTrigger from '../components/ContextMenuTrigger'

src/js/views/discover/DiscoverRecommendations.js

@@ -12,8 +12,8 @@ import AlbumGrid from '../../components/AlbumGrid'
 import TrackList from '../../components/TrackList'
 import Thumbnail from '../../components/Thumbnail'
 import Parallax from '../../components/Parallax'
-import DropdownField from '../../components/DropdownField'
-import AddSeedField from '../../components/AddSeedField'
+import DropdownField from '../../components/Fields/DropdownField'
+import AddSeedField from '../../components/Fields/AddSeedField'
 import URILink from '../../components/URILink'
 import ContextMenuTrigger from '../../components/ContextMenuTrigger'
 import RelatedArtists from '../../components/RelatedArtists'

src/js/views/library/LibraryAlbums.js

@@ -10,8 +10,8 @@ import Header from '../../components/Header'
 import Thumbnail from '../../components/Thumbnail'
 import TrackList from '../../components/TrackList'
 import ArtistSentence from '../../components/ArtistSentence'
-import DropdownField from '../../components/DropdownField'
-import FilterField from '../../components/FilterField'
+import DropdownField from '../../components/Fields/DropdownField'
+import FilterField from '../../components/Fields/FilterField'
 import LazyLoadListener from '../../components/LazyLoadListener'
 
 import * as helpers from '../../helpers'

src/js/views/library/LibraryArtists.js

@@ -7,8 +7,8 @@ import { Link } from 'react-router'
 import Header from '../../components/Header'
 import ArtistGrid from '../../components/ArtistGrid'
 import List from '../../components/List'
-import DropdownField from '../../components/DropdownField'
-import FilterField from '../../components/FilterField'
+import DropdownField from '../../components/Fields/DropdownField'
+import FilterField from '../../components/Fields/FilterField'
 import LazyLoadListener from '../../components/LazyLoadListener'
 
 import * as helpers from '../../helpers'

src/js/views/library/LibraryPlaylists.js

@@ -7,9 +7,9 @@ import FontAwesome from 'react-fontawesome'
 
 import PlaylistGrid from '../../components/PlaylistGrid'
 import List from '../../components/List'
-import DropdownField from '../../components/DropdownField'
+import DropdownField from '../../components/Fields/DropdownField'
 import Header from '../../components/Header'
-import FilterField from '../../components/FilterField'
+import FilterField from '../../components/Fields/FilterField'
 import LazyLoadListener from '../../components/LazyLoadListener'
 
 import * as helpers from '../../helpers'
@@ -41,11 +41,12 @@ class LibraryPlaylists extends React.Component{
 	}
 
 	componentWillReceiveProps(newProps){
+
 		if (newProps.mopidy_connected && (newProps.source == 'all' || newProps.source == 'local')){
 
 			// We've just connected
 			if (!this.props.mopidy_connected){
-				this.props.mopidyActions.getLibraryPlaylists()
+				this.props.mopidyActions.getLibraryPlaylists();
 			}		
 
 			// Filter changed, but we haven't got this provider's library yet