Updating edit radio modal; Cleaner loading spinner; Buttons in header

This commit is contained in:
James Barnsley
2017-07-14 08:47:02 +12:00
parent e6ac587835
commit 043bdaa4e5
8 changed files with 76 additions and 25 deletions

View File

@ -120,7 +120,7 @@ export default class EditRadioModal extends React.Component{
<div className="list-item" key={seed.uri}>
{seed.unresolved ? <span className="grey-text">{seed.uri}</span> : <span>{seed.name}</span> }
<span className="grey-text">&nbsp;({seed.type})</span>
<button className="discrete remove-uri" onClick={e => this.removeSeed(seed.uri)}>
<button className="discrete remove-uri no-hover" onClick={e => this.removeSeed(seed.uri)}>
<FontAwesome name="close" />&nbsp;Remove
</button>
</div>
@ -151,18 +151,20 @@ export default class EditRadioModal extends React.Component{
<form>
{this.renderSeeds()}
<div className="field">
<div className="field text">
<span className="label">URI(s)</span>
<input
type="text"
placeholder="Comma-separated URIs"
onChange={e => this.setState({uri: e.target.value, error_message: null})}
value={this.state.uri} />
<button className="discrete add-uri" onClick={e => this.addSeed()}>
<button className="discrete add-uri no-hover" onClick={e => this.addSeed()}>
<FontAwesome name="plus" />&nbsp; Add
</button>
{this.state.error_message ? <span className="error">{this.state.error_message}</span> : null}
</div>
</form>
<form>
<div className="actions centered-text">
{this.state.enabled ? <button className="destructive wide" onClick={e => this.handleStop(e)}>Stop</button> : null}
{this.state.enabled ? <button className="primary wide" onClick={e => this.handleUpdate(e)}>Save</button> : <button className="primary wide" onClick={e => this.handleStart(e)}>Start</button>}

View File

@ -88,20 +88,20 @@ class Queue extends React.Component{
render(){
var options = (
<span>
<button onClick={e => this.props.uiActions.openModal('edit_radio')}>
<button className="no-hover" onClick={e => this.props.uiActions.openModal('edit_radio')}>
<FontAwesome name="podcast" />&nbsp;
Radio
{this.props.radio && this.props.radio.enabled ? <span className="flag blue">On</span> : null}
</button>
<button onClick={e => hashHistory.push(global.baseURL+'queue/history')}>
<button className="no-hover" onClick={e => hashHistory.push(global.baseURL+'queue/history')}>
<FontAwesome name="history" />&nbsp;
History
</button>
<button onClick={e => this.props.mopidyActions.clearTracklist()}>
<button className="no-hover" onClick={e => this.props.mopidyActions.clearTracklist()}>
<FontAwesome name="trash" />&nbsp;
Clear
</button>
<button onClick={e => this.props.uiActions.openModal('add_to_queue', {})}>
<button className="no-hover" onClick={e => this.props.uiActions.openModal('add_to_queue', {})}>
<FontAwesome name="plus" />&nbsp;
Add URI
</button>

View File

@ -89,7 +89,7 @@ class User extends React.Component{
</ul>
</h2>
<div className="actions">
<FollowButton className="secondary" uri={this.props.params.uri} addText="Follow" removeText="Unfollow" />
<FollowButton className="primary" uri={this.props.params.uri} addText="Follow" removeText="Unfollow" />
</div>
</div>
</div>

View File

@ -187,7 +187,7 @@ class LibraryPlaylists extends React.Component{
<DropdownField icon="filter" name="Filter" value={this.props.filter} options={filter_options} handleChange={val => {this.props.uiActions.set({ library_playlists_filter: val}); this.props.uiActions.hideContextMenu() }} />
<DropdownField icon="sort" name="Sort" value={this.props.sort} options={sort_options} reverse={this.props.sort_reverse} handleChange={val => {this.setSort(val); this.props.uiActions.hideContextMenu() }} />
<DropdownField icon="eye" name="View" value={this.props.view} options={view_options} handleChange={val => {this.props.uiActions.set({ library_playlists_view: val}); this.props.uiActions.hideContextMenu() }} />
<button onClick={ () => this.props.uiActions.openModal('create_playlist', {} ) }>
<button className="no-hover" onClick={ () => this.props.uiActions.openModal('create_playlist', {} ) }>
<FontAwesome name="plus" />&nbsp;
New
</button>