Services routing
This commit is contained in:
@ -5095,9 +5095,9 @@ aside {
|
||||
-webkit-transform: scale(0.98);
|
||||
transform: scale(0.98); }
|
||||
|
||||
.grid--categories .grid__item {
|
||||
.grid--tiles .grid__item {
|
||||
position: relative; }
|
||||
.grid--categories .grid__item__name {
|
||||
.grid--tiles .grid__item__name {
|
||||
position: absolute;
|
||||
bottom: 15%;
|
||||
left: 0;
|
||||
@ -5109,7 +5109,7 @@ aside {
|
||||
z-index: 2; }
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
.grid--categories .grid__item__name {
|
||||
.grid--tiles .grid__item__name {
|
||||
font-size: 16px; } }
|
||||
|
||||
@media (min-width: 1900px) {
|
||||
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -98,7 +98,7 @@
|
||||
|
||||
// Release details
|
||||
// These are automatically injected to built HTML
|
||||
var build = "1547667440";
|
||||
var build = "1547714495";
|
||||
var version = "3.31.8";
|
||||
|
||||
// Construct the script tag
|
||||
|
||||
@ -391,8 +391,7 @@ class App extends React.Component{
|
||||
<Route exact path="/queue" component={Queue} />
|
||||
<Route exact path="/queue/history" component={QueueHistory} />
|
||||
<Route exact path="/settings/debug" component={Debug} />
|
||||
<Route exact path="/settings" component={Settings} />
|
||||
<Route exact path="/settings/service/:sub_view?" component={Settings} />
|
||||
<Route path="/settings" component={Settings} />
|
||||
|
||||
<Route exact path="/search/(:type/:term)?" component={Search} />
|
||||
<Route exact path="/album/:uri" component={Album} />
|
||||
|
||||
@ -13,7 +13,7 @@ export default class CategoryGrid extends React.Component{
|
||||
render(){
|
||||
if (!this.props.categories ) return null
|
||||
|
||||
var className = "grid grid--categories";
|
||||
var className = "grid grid--tiles";
|
||||
if (this.props.className) className += ' '+this.props.className;
|
||||
if (this.props.mini) className += ' grid--mini';
|
||||
|
||||
|
||||
@ -32,7 +32,7 @@ export default class extends React.Component{
|
||||
return (
|
||||
<NavLink
|
||||
onClick={e => this.handleClick(e)}
|
||||
activeClassName="active"
|
||||
activeClassName={this.props.activeClassName ? this.props.activeClassName : className+"--active"}
|
||||
className={className}
|
||||
to={this.props.to}>
|
||||
{this.props.children}
|
||||
|
||||
@ -297,7 +297,7 @@ class Services extends React.Component{
|
||||
return (
|
||||
<div className="menu" id="services-menu">
|
||||
<div className="menu__inner">
|
||||
<Link className={"menu-item"+(this.props.active == 'spotify' ? ' menu-item--active' : '')} to={this.props.active == 'spotify' ? global.baseURL+'settings' : global.baseURL+'settings/service/spotify'} scrollTo="services-menu">
|
||||
<Link nav className="menu-item menu-item--spotify" activeClassName="menu-item--active" to={global.baseURL+'settings/spotify'} scrollTo="services-menu">
|
||||
<div className="menu-item__inner">
|
||||
{spotify_icon}
|
||||
<div className="menu-item__title">
|
||||
@ -306,7 +306,7 @@ class Services extends React.Component{
|
||||
{this.props.spotify.authorization ? <span className="status green-text">Authorized</span> : <span className="status mid_grey-text">Read-only</span>}
|
||||
</div>
|
||||
</Link>
|
||||
<Link className={"menu-item"+(this.props.active == 'lastfm' ? ' menu-item--active' : '')} to={this.props.active == 'lastfm' ? global.baseURL+'settings' : global.baseURL+'settings/service/lastfm'} scrollTo="services-menu">
|
||||
<Link nav className="menu-item menu-item--lastfm" activeClassName="menu-item--active" to={global.baseURL+'settings/lastfm'} scrollTo="services-menu">
|
||||
<div className="menu-item__inner">
|
||||
{lastfm_icon}
|
||||
<div className="menu-item__title">
|
||||
@ -315,7 +315,7 @@ class Services extends React.Component{
|
||||
{this.props.lastfm.authorization ? <span className="status green-text">Authorized</span> : <span className="status mid_grey-text">Read-only</span>}
|
||||
</div>
|
||||
</Link>
|
||||
<Link className={"menu-item"+(this.props.active == 'genius' ? ' menu-item--active' : '')} to={this.props.active == 'genius' ? global.baseURL+'settings' : global.baseURL+'settings/service/genius'} scrollTo="services-menu">
|
||||
<Link nav className="menu-item menu-item--genius" activeClassName="menu-item--active" to={global.baseURL+'settings/genius'} scrollTo="services-menu">
|
||||
<div className="menu-item__inner">
|
||||
{genius_icon}
|
||||
<div className="menu-item__title">
|
||||
@ -324,7 +324,7 @@ class Services extends React.Component{
|
||||
{this.props.genius.authorization ? <span className="status green-text">Authorized</span> : <span className="status mid_grey-text">Unauthorized</span>}
|
||||
</div>
|
||||
</Link>
|
||||
<Link className={"menu-item"+(this.props.active == 'snapcast' ? ' menu-item--active' : '')} to={this.props.active == 'snapcast' ? global.baseURL+'settings' : global.baseURL+'settings/service/snapcast'} scrollTo="services-menu">
|
||||
<Link nav className="menu-item menu-item--snapcast" activeClassName="menu-item--active" to={global.baseURL+'settings/snapcast'} scrollTo="services-menu">
|
||||
<div className="menu-item__inner">
|
||||
<Icon className="menu-item__icon" name="devices" />
|
||||
<div className="menu-item__title">
|
||||
@ -333,7 +333,7 @@ class Services extends React.Component{
|
||||
{this.props.pusher.config.snapcast_enabled ? <span className="status green-text">Enabled</span> : <span className="status mid_grey-text">Disabled</span>}
|
||||
</div>
|
||||
</Link>
|
||||
<Link className={"menu-item"+(this.props.active == 'icecast' ? ' menu-item--active' : '')} to={this.props.active == 'icecast' ? global.baseURL+'settings' : global.baseURL+'settings/service/icecast'} scrollTo="services-menu">
|
||||
<Link nav className="menu-item menu-item--icecast" activeClassName="menu-item--active" to={global.baseURL+'settings/icecast'} scrollTo="services-menu">
|
||||
<div className="menu-item__inner">
|
||||
<Icon className="menu-item__icon" name="wifi_tethering" />
|
||||
<div className="menu-item__title">
|
||||
@ -349,7 +349,7 @@ class Services extends React.Component{
|
||||
|
||||
renderService(){
|
||||
var service = null;
|
||||
switch (this.props.active){
|
||||
switch (this.props.match.params.service){
|
||||
case 'spotify':
|
||||
service = this.renderSpotify();
|
||||
break;
|
||||
|
||||
@ -265,7 +265,8 @@ class Settings extends React.Component {
|
||||
</form>
|
||||
|
||||
<h4 className="underline">Services<a name="services"></a></h4>
|
||||
<Route path="/service" component={Services} />
|
||||
|
||||
<Route path="/settings/:service?" component={Services} />
|
||||
|
||||
<h4 className="underline">Interface<a name="interface"></a></h4>
|
||||
|
||||
|
||||
@ -51,45 +51,45 @@ class LibraryBrowse extends React.Component{
|
||||
|
||||
switch (subdirectory.name){
|
||||
case 'Dirble':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-dirble.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-dirble.jpg']
|
||||
break
|
||||
|
||||
case 'Files':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-folders.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-folders.jpg']
|
||||
break
|
||||
|
||||
case 'Local media':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-folders.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-folders.jpg']
|
||||
break
|
||||
|
||||
case 'Spotify':
|
||||
case 'Spotify Browse':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-spotify.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-spotify.jpg']
|
||||
break
|
||||
|
||||
case 'Spotify Tunigo':
|
||||
case 'Tunigo':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-tunigo.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-tunigo.jpg']
|
||||
break
|
||||
|
||||
case 'TuneIn':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-tunein.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-tunein.jpg']
|
||||
break
|
||||
|
||||
case 'SoundCloud':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-soundcloud.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-soundcloud.jpg']
|
||||
break
|
||||
|
||||
case 'iTunes Store: Podcasts':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-itunes.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-itunes.jpg']
|
||||
break
|
||||
|
||||
case 'Soma FM':
|
||||
subdirectory.icons = ['assets/backgrounds/browse-somafm.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-somafm.jpg']
|
||||
break
|
||||
|
||||
default:
|
||||
subdirectory.icons = ['assets/backgrounds/browse-default.jpg']
|
||||
subdirectory.icons = ['/assets/backgrounds/browse-default.jpg']
|
||||
}
|
||||
|
||||
grid_items.push({
|
||||
@ -107,7 +107,7 @@ class LibraryBrowse extends React.Component{
|
||||
Browse
|
||||
</Header>
|
||||
<section className="content-wrapper">
|
||||
<div className="grid category-grid">
|
||||
<div className="grid grid--tiles">
|
||||
<ErrorBoundary>
|
||||
{
|
||||
grid_items.map(
|
||||
|
||||
@ -47,7 +47,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
&--categories {
|
||||
&--tiles {
|
||||
.grid__item {
|
||||
position: relative;
|
||||
|
||||
|
||||
Reference in New Issue
Block a user