secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

More user-friendly editing of commands; COommands style as component

Browse Source
This commit is contained in:
James Barnsley
2018-10-13 15:57:01 +13:00
parent 11f21e252b
commit a4a02bcd6d
33 changed files with 1435 additions and 287 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/js/views/modals/AddToPlaylist.js
View File

@ -54,7 +54,7 @@ class AddToPlaylist extends React.Component{
return (
<Modal className="modal--add-to-playlist">
<h1>Add to playlist</h1>
<h2 className="grey-text">Select playlist to add {this.props.uris.length} track{this.props.uris.length>1?'s':null} to</h2>
<h2 className="mid_grey-text">Select playlist to add {this.props.uris.length} track{this.props.uris.length>1?'s':null} to</h2>
{playlists.length <= 0 ? <div className="no-results">No playlists available</div> : null}
<div className="list small playlists">
{
@ -65,7 +65,7 @@ class AddToPlaylist extends React.Component{
<h3 className="name">{ playlist.name }</h3>
<ul className="details">
<li><Icon type="fontawesome" className="source" name={helpers.sourceIcon(playlist.uri)} /></li>
<li>{ playlist.tracks_total ? <span className="grey-text">&nbsp;{ playlist.tracks_total } tracks</span> : null }</li>
<li>{ playlist.tracks_total ? <span className="mid_grey-text">&nbsp;{ playlist.tracks_total } tracks</span> : null }</li>
</ul>
</div>
)

2
src/js/views/modals/AddToQueue.js
View File

@ -38,7 +38,7 @@ class AddToQueue extends React.Component{
return (
<Modal className="modal--add-to-queue">
<h1>Add to queue</h1>
<h2 className="grey-text">Add a comma-separated list of URIs to the play queue. You must have the appropriate Mopidy backend enabled for each URI schema (eg spotify:, yt:).</h2>
<h2 className="mid_grey-text">Add a comma-separated list of URIs to the play queue. You must have the appropriate Mopidy backend enabled for each URI schema (eg spotify:, yt:).</h2>
<form onSubmit={e => this.handleSubmit(e)}>
<div className="field text">

1002
src/js/views/modals/EditCommand.js
View File

File diff suppressed because it is too large Load Diff

6
src/js/views/modals/EditRadio.js
View File

@ -189,8 +189,8 @@ class EditRadio extends React.Component{
seeds.map((seed,index) => {
return (
<div className="list__item" key={seed.uri}>
{seed.unresolved ? <span className="grey-text">{seed.uri}</span> : <span>{seed.name}</span> }
{!seed.unresolved ? <span className="grey-text">&nbsp;({seed.type})</span> : null}
{seed.unresolved ? <span className="mid_grey-text">{seed.uri}</span> : <span>{seed.name}</span> }
{!seed.unresolved ? <span className="mid_grey-text">&nbsp;({seed.type})</span> : null}
<span className="button discrete remove-uri no-hover" onClick={e => this.removeSeed(seed.uri)}>
<Icon name="delete" />Remove
</span>
@ -212,7 +212,7 @@ class EditRadio extends React.Component{
return (
<Modal className="modal--edit-radio">
<h1>Radio</h1>
<h2 className="grey-text">Add and remove seeds to shape the sound of your radio. Radio uses Spotify's recommendations engine to suggest tracks similar to your seeds.</h2>
<h2 className="mid_grey-text">Add and remove seeds to shape the sound of your radio. Radio uses Spotify's recommendations engine to suggest tracks similar to your seeds.</h2>
<form onSubmit={e => {(this.state.enabled ? this.handleUpdate(e) : this.handleStart(e))}}>

10
src/js/views/modals/ShareConfiguration.js
View File

@ -102,7 +102,7 @@ class ShareConfiguration extends React.Component {
<span className="label">
{ connection.username }
&nbsp;
<span className="grey-text">
<span className="mid_grey-text">
({ connection.ip })
</span>
</span>
@ -115,7 +115,7 @@ class ShareConfiguration extends React.Component {
} else {
var recipients = (
<div className="input text">
<span className="grey-text">
<span className="mid_grey-text">
No peer connections
</span>
</div>
@ -152,7 +152,7 @@ class ShareConfiguration extends React.Component {
checked={this.state.spotify}
onChange={ e => this.setState({ spotify: !this.state.spotify })} />
<span className="label">
Spotify authorization <span className="grey-text">&nbsp;Logged in as {this.props.spotify_me.name}</span>
Spotify authorization <span className="mid_grey-text">&nbsp;Logged in as {this.props.spotify_me.name}</span>
</span>
</label> : null}
@ -163,7 +163,7 @@ class ShareConfiguration extends React.Component {
checked={this.state.lastfm}
onChange={ e => this.setState({ lastfm: !this.state.lastfm })} />
<span className="label">
LastFM authorization <span className="grey-text">&nbsp;Logged in as {this.props.lastfm_me.name}</span>
LastFM authorization <span className="mid_grey-text">&nbsp;Logged in as {this.props.lastfm_me.name}</span>
</span>
</label> : null}
@ -174,7 +174,7 @@ class ShareConfiguration extends React.Component {
checked={this.state.genius}
onChange={ e => this.setState({ genius: !this.state.genius })} />
<span className="label">
Genius authorization <span className="grey-text">&nbsp;Logged in as {this.props.genius_me.name}</span>
Genius authorization <span className="mid_grey-text">&nbsp;Logged in as {this.props.genius_me.name}</span>
</span>
</label> : null}
</div>