ui changes, consistent material selects, hid recommendations when disabled

This commit is contained in:
aj 2020-02-06 13:32:40 +00:00
parent 4963fda6b0
commit 3060b7010e
5 changed files with 21 additions and 23 deletions

View File

@ -7,7 +7,7 @@ import showMessage from "./Toast.js"
import GlobalTheme from './Theme.js';
import { Typography } from '@material-ui/core';
import { Typography, CircularProgress } from '@material-ui/core';
import { ThemeProvider } from '@material-ui/core/styles';
import AppBar from '@material-ui/core/AppBar';
import Toolbar from '@material-ui/core/Toolbar';
@ -171,7 +171,7 @@ class MusicTools extends Component {
}
function LoadingMessage(props) {
return <ThemeProvider theme={GlobalTheme}><Typography variant="h5" component="h2" className="ui-text center-text">Loading...</Typography></ThemeProvider>;
return <CircularProgress/>;
}
export default MusicTools;

View File

@ -110,7 +110,7 @@ function PlaylistGrid(props){
justify="flex-start"
alignItems="flex-start"
style={{padding: '24px'}}>
<Grid item xs>
<Grid item xs={12} sm={6} md={2}>
<ButtonGroup
color="primary"
orientation="vertical"

View File

@ -2,7 +2,7 @@ import React, { Component } from "react";
const axios = require('axios');
import { Card, Button, CircularProgress, FormControl, TextField, InputLabel, Select, Checkbox, FormControlLabel,
CardActions, CardContent, Typography, Grid } from '@material-ui/core';
CardActions, CardContent, Typography, Grid, MenuItem } from '@material-ui/core';
import { Delete } from '@material-ui/icons';
import { makeStyles } from '@material-ui/core/styles';
@ -478,6 +478,7 @@ export class Edit extends Component{
labelPlacement="bottom"
label="Library Tracks"/>
</Grid>
{ this.state.include_recommendations == true &&
<Grid item xs={12}>
<TextField type="number"
name="recommendation_sample"
@ -486,7 +487,7 @@ export class Edit extends Component{
value={this.state.recommendation_sample}
onChange={this.handleInputChange}></TextField>
</Grid>
}
{ this.state.type == 'fmchart' &&
<Grid item xs={12}>
<TextField type="number"
@ -502,7 +503,6 @@ export class Edit extends Component{
<FormControl variant="filled">
<InputLabel htmlFor="chart_range">Chart Range</InputLabel>
<Select
native
value={this.state.chart_range}
onChange={this.handleInputChange}
inputProps={{
@ -510,12 +510,12 @@ export class Edit extends Component{
id: "chart_range",
}}
>
<option value="WEEK">7 Day</option>
<option value="MONTH">30 Day</option>
<option value="QUARTER">90 Day</option>
<option value="HALFYEAR">180 Day</option>
<option value="YEAR">365 Day</option>
<option value="OVERALL">Overall</option>
<MenuItem value="WEEK">7 Day</MenuItem>
<MenuItem value="MONTH">30 Day</MenuItem>
<MenuItem value="QUARTER">90 Day</MenuItem>
<MenuItem value="HALFYEAR">180 Day</MenuItem>
<MenuItem value="YEAR">365 Day</MenuItem>
<MenuItem value="OVERALL">Overall</MenuItem>
</Select>
</FormControl>
</Grid>
@ -552,7 +552,6 @@ export class Edit extends Component{
<FormControl variant="filled">
<InputLabel htmlFor="type-select">Type</InputLabel>
<Select
native
value={this.state.type}
onChange={this.handleInputChange}
inputProps={{
@ -560,9 +559,9 @@ export class Edit extends Component{
id: 'type-select',
}}
>
<option value="default">Default</option>
<option value="recents">Recents</option>
<option value="fmchart">Last.fm Chart</option>
<MenuItem value="default">Default</MenuItem>
<MenuItem value="recents">Recents</MenuItem>
<MenuItem value="fmchart">Last.fm Chart</MenuItem>
</Select>
</FormControl>
</Grid>

View File

@ -68,7 +68,7 @@ function TagGrid(props){
justify="flex-start"
alignItems="flex-start"
style={{padding: '24px'}}>
<Grid item xs>
<Grid item xs={12} sm={6} md={2}>
<ButtonGroup
color="primary"
orientation="vertical"

View File

@ -1,7 +1,7 @@
import React, { Component } from "react";
const axios = require('axios');
import { Card, Button, CircularProgress, CardActions, CardContent, FormControl, InputLabel, Select, Typography, Grid, TextField } from '@material-ui/core';
import { Card, Button, CircularProgress, CardActions, CardContent, FormControl, InputLabel, Select, Typography, Grid, TextField, MenuItem } from '@material-ui/core';
import { Delete } from '@material-ui/icons';
import { makeStyles } from '@material-ui/core/styles';
@ -282,10 +282,9 @@ class View extends Component{
</Grid>
}
<Grid item xs={12} sm={this.state.addType != 'artists' ? 2 : 4} md={this.state.addType != 'artists' ? 2 : 4}>
<FormControl>
<FormControl variant="filled">
<InputLabel htmlFor="addType">Type</InputLabel>
<Select
native
value={this.state.addType}
onChange={this.handleInputChange}
inputProps={{
@ -293,9 +292,9 @@ class View extends Component{
id: "addType",
}}
>
<option value="artists">Artist</option>
<option value="albums">Album</option>
<option value="tracks">Track</option>
<MenuItem value="artists">Artist</MenuItem>
<MenuItem value="albums">Album</MenuItem>
<MenuItem value="tracks">Track</MenuItem>
</Select>
</FormControl>
</Grid>