This commit is contained in:
britea 2020-05-06 11:35:59 +02:00
commit 40af5c8f2b
5 changed files with 29 additions and 13 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

@ -9,6 +9,7 @@ import {
Input, Input,
Dropdown, Dropdown,
Checkbox, Checkbox,
Segment,
} from "semantic-ui-react"; } from "semantic-ui-react";
import SelectIcons from "./SelectIcons"; import SelectIcons from "./SelectIcons";
import { connect } from "react-redux"; import { connect } from "react-redux";
@ -110,15 +111,15 @@ class SceneModal extends Component {
}; };
closeModal = (e) => { closeModal = (e) => {
this.setState({ openModal: false }); this.setState({ ...this.state, openModal: false });
}; };
openModal = (e) => { openModal = (e) => {
this.setState({ openModal: true }); this.setState({ ...this.state, openModal: true });
}; };
updateIcon(e) { updateIcon(e) {
this.setState({ selectedIcon: e }); this.setState({ ...this.state, selectedIcon: e });
} }
setCopyFrom(_, copyFrom) { setCopyFrom(_, copyFrom) {
@ -127,7 +128,7 @@ class SceneModal extends Component {
setGuestAccessEnabled(val) { setGuestAccessEnabled(val) {
console.log(this.state, val); console.log(this.state, val);
this.setState({ guestAccessEnabled: val }); this.setState({ ...this.state, guestAccessEnabled: val });
} }
render() { render() {
@ -223,13 +224,16 @@ class SceneModal extends Component {
)} )}
{this.type === "modify" ? ( {this.type === "modify" ? (
<Form.Field> <Form.Field>
<Segment compact style={{ marginBottom: "1rem"}}>
<Checkbox <Checkbox
label="Enable guest access"
checked={this.state.guestAccessEnabled} checked={this.state.guestAccessEnabled}
toggle toggle
onChange={(e, val) => onChange={(e, val) =>
this.setGuestAccessEnabled(val.checked) this.setGuestAccessEnabled(val.checked)
} }
/> />
</Segment>
</Form.Field> </Form.Field>
) : null} ) : null}
</Form> </Form>

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