Upgrading webpack

src/js/components/Modal/AddToQueueModal.js

@@ -0,0 +1,70 @@
+
+import React, { PropTypes } from 'react'
+import FontAwesome from 'react-fontawesome'
+
+import Icon from '../Icon'
+import * as helpers from '../../helpers'
+
+export default class AddToQueueModal extends React.Component{
+
+	constructor(props){
+		super(props)
+		this.state = {
+			uris: '',
+			at_position: 'end'
+		}
+	}
+
+	handleSubmit(e){
+		var uris = this.state.uris.split(',')
+		if (this.state.at_position == 'next'){
+			this.props.mopidyActions.enqueueURIsNext(uris)
+		}else{
+			this.props.mopidyActions.enqueueURIs(uris)
+		}
+		this.props.uiActions.closeModal()
+	}
+
+	render(){
+		return (
+			<div>
+				<h4>Add URI(s) to tracklist</h4>
+
+				<form onSubmit={e => this.handleSubmit(e)}>
+					<div className="field text">
+						<input 
+							type="text"
+							placeholder="Add comma-separated URIs"
+							onChange={e => this.setState({uris: e.target.value})} 
+							value={this.state.uris} />
+					</div>
+
+					<div className="field radio white">
+						<label>
+							<input 
+								type="radio"
+								name="at_position"
+								value="end"
+								checked={ this.state.at_position == 'end' }
+								onChange={ e => this.setState({ at_position: e.target.value })} />
+							<span className="label">Add to end</span>
+						</label>
+						<label>
+							<input 
+								type="radio"
+								name="at_position"
+								value="next"
+								checked={ this.state.at_position == 'next' }
+								onChange={ e => this.setState({ at_position: e.target.value })} />
+							<span className="label">Add after current track</span>
+						</label>
+					</div>
+
+					<div className="actions centered-text">
+						<button type="submit" className="primary wide">Add</button>
+					</div>
+				</form>
+			</div>
+		)
+	}
+}

src/js/components/Modal/Modal.js

@@ -6,6 +6,7 @@ import { bindActionCreators } from 'redux'
 import * as helpers from '../../helpers'
 import Icon from '../Icon'
 import AddToPlaylistModal from './AddToPlaylistModal'
+import AddToQueueModal from './AddToQueueModal'
 import CreatePlaylistModal from './CreatePlaylistModal'
 import EditPlaylistModal from './EditPlaylistModal'
 import SendAuthorizationModal from './SendAuthorizationModal'
@@ -43,6 +44,7 @@ class Modal extends React.Component{
 				<div className="content">
 
 					{ this.props.modal.name == 'add_to_playlist' ? <AddToPlaylistModal uiActions={this.props.uiActions} playlists={this.props.playlists} tracks_uris={this.props.modal.data.tracks_uris} /> : null }
+					{ this.props.modal.name == 'add_to_queue' ? <AddToQueueModal uiActions={this.props.uiActions} mopidyActions={this.props.mopidyActions} /> : null }
 					{ this.props.modal.name == 'create_playlist' ? <CreatePlaylistModal uiActions={this.props.uiActions} /> : null }
 					{ this.props.modal.name == 'edit_playlist' ? <EditPlaylistModal uiActions={this.props.uiActions} data={this.props.modal.data} /> : null }
 					{ this.props.modal.name == 'send_authorization' ? <SendAuthorizationModal uiActions={this.props.uiActions} pusherActions={this.props.pusherActions} data={this.props.modal.data} /> : null }

src/js/views/Debug.js

@@ -42,10 +42,12 @@ class Debug extends React.Component{
 	render(){
 
 		var options = (
-			<button onClick={e => hashHistory.push(global.baseURL+'settings')}>
-				<FontAwesome name="reply" />&nbsp;
-				Back
-			</button>
+			<span>
+				<button onClick={e => hashHistory.push(global.baseURL+'settings')}>
+					<FontAwesome name="reply" />&nbsp;
+					Back
+				</button>
+			</span>
 		)
 
 		return (

src/js/views/Queue.js

@@ -59,21 +59,25 @@ class Queue extends React.Component{
 	render(){
 		var options = (
 			<span>
-				<button onClick={e => this.props.uiActions.openModal('kiosk_mode')}>
-					<FontAwesome name="television" />&nbsp;
-					Kiosk mode
-				</button>
 				<button onClick={e => this.props.uiActions.openModal('edit_radio')}>
-					<FontAwesome name="spotify" />&nbsp;
+					<FontAwesome name="podcast" />&nbsp;
 					Radio
 				</button>
+				<button onClick={e => this.props.uiActions.openModal('kiosk_mode')}>
+					<FontAwesome name="expand" />&nbsp;
+					Fullscreen
+				</button>
+				<button onClick={e => hashHistory.push(global.baseURL+'queue-history')}>
+					<FontAwesome name="history" />&nbsp;
+					History
+				</button>
 				<button onClick={e => this.props.mopidyActions.clearTracklist()}>
 					<FontAwesome name="trash" />&nbsp;
 					Clear
 				</button>
-				<button onClick={e => hashHistory.push(global.baseURL+'queue-history')}>
-					<FontAwesome name="history" />&nbsp;
-					History
+				<button onClick={e => this.props.uiActions.openModal('add_to_queue', {})}>
+					<FontAwesome name="plus" />&nbsp;
+					Add URI
 				</button>
 			</span>
 		)

src/js/views/Settings.js

@@ -164,10 +164,12 @@ class Settings extends React.Component{
 	render(){
 
 		var options = (
-			<button onClick={e => hashHistory.push(global.baseURL+'debug')}>
-				<FontAwesome name="flask" />&nbsp;
-				Debug
-			</button>
+			<span>
+				<button onClick={e => hashHistory.push(global.baseURL+'debug')}>
+					<FontAwesome name="flask" />&nbsp;
+					Debug
+				</button>
+			</span>
 		)
 
 		return (

src/js/views/User.js

@@ -72,7 +72,6 @@ class User extends React.Component{
 
 						<div className="actions">
 							<FollowButton className="secondary" uri={this.props.params.uri} addText="Follow" removeText="Unfollow" />
-							<ContextMenuTrigger onTrigger={e => this.handleContextMenu(e)} />
 						</div>
 					</div>
 					<div className="main">