Added label to share cameras button and other minor fixes

This commit is contained in:
Claudio Maggioni (maggicl) 2020-05-06 11:13:17 +02:00
parent ede920b628
commit 194e502578
4 changed files with 21 additions and 9 deletions

View file

@ -58,7 +58,7 @@ export class MyHeader extends React.Component {
<Responsive minWidth={768}> <Responsive minWidth={768}>
<Grid columns="equal" divided inverted padded> <Grid columns="equal" divided inverted padded>
<Grid.Row color="black" textAlign="center"> <Grid.Row color="black" textAlign="center">
<Grid.Column width={3} height={0.5}> <Grid.Column width={4} height={0.5}>
<Segment color="black" inverted> <Segment color="black" inverted>
<IconHomeImage /> <IconHomeImage />
</Segment> </Segment>
@ -68,7 +68,7 @@ export class MyHeader extends React.Component {
<TitleImage /> <TitleImage />
</Segment> </Segment>
</Grid.Column> </Grid.Column>
<Grid.Column width={2} heigth={1}> <Grid.Column width={4} heigth={1}>
<Label as="a" image color="black"> <Label as="a" image color="black">
<img alt="SmartHut logo" src="smart-home.png" /> <img alt="SmartHut logo" src="smart-home.png" />
{this.props.username} {this.props.username}
@ -77,11 +77,15 @@ export class MyHeader extends React.Component {
<Button basic inverted onClick={this.logout}> <Button basic inverted onClick={this.logout}>
Logout Logout
</Button> </Button>
<Segment compact style={{margin: "auto", marginTop: "1em", textAlign: "center"}}>
<Checkbox <Checkbox
label={<label
>Share cameras</label>}
checked={this.props.cameraEnabled} checked={this.props.cameraEnabled}
toggle toggle
onChange={(e, val) => this.setCameraEnabled(val.checked)} onChange={(e, val) => this.setCameraEnabled(val.checked)}
/> />
</Segment>
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
</Grid> </Grid>
@ -104,6 +108,15 @@ export class MyHeader extends React.Component {
</Label> </Label>
<Divider /> <Divider />
<Button onClick={this.logout}>Logout</Button> <Button onClick={this.logout}>Logout</Button>
<Segment compact style={{margin: "auto", marginTop: "1em", textAlign: "center"}}>
<Checkbox
label={<label
>Share cameras</label>}
checked={this.props.cameraEnabled}
toggle
onChange={(e, val) => this.setCameraEnabled(val.checked)}
/>
</Segment>
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
</Grid> </Grid>

View file

@ -4,10 +4,6 @@
box-sizing: border-box; box-sizing: border-box;
} }
body {
overflow-y: hidden;
}
.container.curtain-container { .container.curtain-container {
position: relative; position: relative;
margin-top: 10%; margin-top: 10%;

View file

@ -164,7 +164,10 @@ class Thermostats extends Component {
const mapStateToProps2 = (state, ownProps) => ({ const mapStateToProps2 = (state, ownProps) => ({
...mapStateToProps(state, ownProps), ...mapStateToProps(state, ownProps),
get tempSensorsInRoom() { get tempSensorsInRoom() {
const deviceIds = state.rooms[state.devices[ownProps.id].roomId].devices; if (state.active.activeTab !== "Devices") return false;
const room = state.rooms[state.devices[ownProps.id].roomId];
if (!room) return false;
const deviceIds = room.devices;
const devices = [...deviceIds].map((id) => state.devices[id]); const devices = [...deviceIds].map((id) => state.devices[id]);
const sensors = devices.filter( const sensors = devices.filter(
(d) => d.kind === "sensor" && d.sensor === "TEMPERATURE" (d) => d.kind === "sensor" && d.sensor === "TEMPERATURE"

View file

@ -85,12 +85,12 @@ class Dashboard extends Component {
<div style={{ background: "#1b1c1d" }}> <div style={{ background: "#1b1c1d" }}>
<Responsive minWidth={768}> <Responsive minWidth={768}>
<Grid> <Grid>
<Grid.Row color="black"> <Grid.Row color="black" style={{ paddingBottom: 0 }}>
<Grid.Column> <Grid.Column>
<MyHeader /> <MyHeader />
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
<Grid.Row color="black"> <Grid.Row color="black" style={{ paddingTop: 0 }}>
<Grid.Column textAlign="center" width={16}> <Grid.Column textAlign="center" width={16}>
<Menu fluid widths={4} inverted color="grey"> <Menu fluid widths={4} inverted color="grey">
<Menu.Item <Menu.Item