Beginning responsive

src/js/components/Sidebar.js

@@ -16,7 +16,7 @@ import * as mopidyActions from '../services/mopidy/actions'
 class Sidebar extends React.Component{
 
 	constructor(props) {
-		super(props);
+		super(props)
 	}
 
 	render(){

src/js/components/SidebarToggleButton.js

@@ -0,0 +1,45 @@
+
+import React, { PropTypes } from 'react'
+import { connect } from 'react-redux'
+import { bindActionCreators } from 'redux'
+import FontAwesome from 'react-fontawesome'
+
+import * as uiActions from '../services/ui/actions'
+
+class SidebarToggleButton extends React.Component{
+
+	constructor(props) {
+		super(props);
+	}
+
+	handleClick(e){
+		this.props.uiActions.toggleSidebar()
+	} 
+
+	render(){
+
+		var classname = 'sidebar-toggle'
+		if( this.props.open ) classname += ' open'
+
+		return (
+			<div className={classname} onClick={ () => this.handleClick() }>
+				<FontAwesome className="open" name="bars" /> 
+				<FontAwesome className="close" name="chevron-left" />
+			</div>
+		);
+	}
+}
+
+const mapStateToProps = (state, ownProps) => {
+	return {
+		open: state.ui.sidebar_open
+	}
+}
+
+const mapDispatchToProps = (dispatch) => {
+	return {
+		uiActions: bindActionCreators(uiActions, dispatch)
+	}
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(SidebarToggleButton)

src/js/components/TrackList.js

@@ -165,7 +165,7 @@ class TrackList extends React.Component{
 
 		// if we've got a specific action, run it
 		if( typeof(this.props.playTracks) !== 'undefined' ){
-			return this.props.playURIs( tracks );
+			return this.props.playTracks( tracks );
 		}
 
 		// default to playing a bunch of uris
@@ -173,7 +173,7 @@ class TrackList extends React.Component{
 		for( var i = 0; i < tracks.length; i++ ){
 			uris.push( tracks[i].uri )
 		}
-		return this.props.mopidyActions.playURIs( uris )
+		return this.props.mopidyActions.playTracks( uris )
 	}
 
 	removeTracks(){