From e5b5a2f90385db3b65fa4f31008a0573789d18d7 Mon Sep 17 00:00:00 2001 From: britea Date: Thu, 26 Mar 2020 00:15:02 +0100 Subject: [PATCH] fix-navbar --- smart-hut/src/App.js | 2 + smart-hut/src/client_server.js | 8 + smart-hut/src/components/HeaderController.js | 150 +++++++++--------- .../components/dashboard/devices/Dimmer.js | 6 +- .../dashboard/devices/DimmerStyle.js | 3 + .../src/components/dashboard/devices/Light.js | 14 +- .../dashboard/devices/LightStyle.js | 3 + .../components/dashboard/devices/NewDevice.js | 2 +- .../components/dashboard/devices/Sensor.js | 2 +- .../dashboard/devices/SensorStyle.js | 6 + .../components/dashboard/devices/SmartPlug.js | 4 +- .../dashboard/devices/SmartPlugStyle.js | 3 + .../components/dashboard/devices/Switch.js | 4 +- .../dashboard/devices/SwitchStyle.js | 3 + smart-hut/src/components/modalform.js | 18 ++- smart-hut/src/views/Dashboard.js | 5 +- smart-hut/src/views/Home.js | 62 ++++++-- smart-hut/src/views/Navbar.js | 12 +- 18 files changed, 188 insertions(+), 119 deletions(-) diff --git a/smart-hut/src/App.js b/smart-hut/src/App.js index 2b2ec7a..c39324d 100644 --- a/smart-hut/src/App.js +++ b/smart-hut/src/App.js @@ -45,6 +45,7 @@ class App extends Component { this.state = { loggedIn: loggedIn, token: token, + info: "", }; this.auth = this.auth.bind(this); @@ -78,6 +79,7 @@ class App extends Component { token: res.data.jwttoken, loggedIn: true, }); + this.getInfo(); return res; //this.props.history.push("/dashboard"); } else { diff --git a/smart-hut/src/client_server.js b/smart-hut/src/client_server.js index fdf1710..46cc06f 100644 --- a/smart-hut/src/client_server.js +++ b/smart-hut/src/client_server.js @@ -160,6 +160,14 @@ export var call = { register: function (data, headers) { return axios.post(config + "register", data); }, + getUserInfo: function (token) { + if (!token) { + token = tkn; + } + return axios.get(config + "auth/profile", { + headers: { Authorization: "Bearer " + token }, + }); + }, initResetPassword: function (data, headers) { return axios.post(config + "register/init-reset-password", data); }, diff --git a/smart-hut/src/components/HeaderController.js b/smart-hut/src/components/HeaderController.js index aa24e82..cbcbadb 100644 --- a/smart-hut/src/components/HeaderController.js +++ b/smart-hut/src/components/HeaderController.js @@ -1,7 +1,16 @@ import React from "react"; -import { Dropdown, Icon, Grid, Divider } from "semantic-ui-react"; +import { + Dropdown, + Icon, + Grid, + Divider, + Button, + Label, + Responsive, +} from "semantic-ui-react"; import { Segment, Image } from "semantic-ui-react"; import { BrowserView, MobileView } from "react-device-detect"; +import { call } from "../client_server"; const AvatarImage = () => ( @@ -19,86 +28,73 @@ const IconHomeImage = () => ( const TitleImage = () => ; -const BrowserStructure = (props) => ( - - - - - - - - - - - - - - - - - - - - Settings - - Document - Image - - - See profile... - - Logout - - - - - -); - -const MobileStructure = (props) => ( - - - - - - - - - - - - - - - - - - Settings - - Document - Image - - - See profile... - - Logout - - - - - -); - export default class MyHeader extends React.Component { + constructor(props) { + super(props); + this.state = { + username: "", + }; + + this.getInfo(); + } + getInfo() { + call.getUserInfo(this.state.token).then((res) => { + if (res.status === 200) { + this.setState({ + username: res.data.username, + }); + } + }); + } render() { return (
- - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
); } diff --git a/smart-hut/src/components/dashboard/devices/Dimmer.js b/smart-hut/src/components/dashboard/devices/Dimmer.js index 8a79128..7dd7877 100644 --- a/smart-hut/src/components/dashboard/devices/Dimmer.js +++ b/smart-hut/src/components/dashboard/devices/Dimmer.js @@ -71,7 +71,9 @@ export class ButtonDimmer extends Component { } /> icon - {this.props.device.name} + + {this.props.device.name} ({this.props.device.id}) + + @@ -136,7 +138,7 @@ export class KnobDimmer extends Component { dy="0.3em" fontWeight="bold" > - {this.props.device.name} + {this.props.device.name} ({this.props.device.id}) @@ -96,7 +100,7 @@ export default class Light extends Component { /> - {this.props.device.name} + {this.props.device.name}
({this.props.device.id})
@@ -134,7 +138,9 @@ export default class Light extends Component {
{} : this.onClickDevice}> -
{this.props.device.name}
+
+ {this.props.device.name} ({this.props.device.id}) +
diff --git a/smart-hut/src/components/dashboard/devices/LightStyle.js b/smart-hut/src/components/dashboard/devices/LightStyle.js index 43e1922..35577cd 100644 --- a/smart-hut/src/components/dashboard/devices/LightStyle.js +++ b/smart-hut/src/components/dashboard/devices/LightStyle.js @@ -17,6 +17,9 @@ export const textStyle = { fill: "#ffd31d", fontSize: "1.5rem", fontFamily: "Lato", + overflow: "hidden", + whiteSpace: "nowrap", + textOverflow: "ellipsis", }; export const nameStyle = { diff --git a/smart-hut/src/components/dashboard/devices/NewDevice.js b/smart-hut/src/components/dashboard/devices/NewDevice.js index 56640cd..219bf1c 100644 --- a/smart-hut/src/components/dashboard/devices/NewDevice.js +++ b/smart-hut/src/components/dashboard/devices/NewDevice.js @@ -110,7 +110,7 @@ export default class NewDevice extends Component { if (this.state.name === "") { data.params["name"] = "Dimmable Light"; } - data.params["intensity"] = 1; + data.params["intensity"] = 0; break; case "sensor": if (this.state.name === "") { diff --git a/smart-hut/src/components/dashboard/devices/Sensor.js b/smart-hut/src/components/dashboard/devices/Sensor.js index 083f186..f927ffb 100644 --- a/smart-hut/src/components/dashboard/devices/Sensor.js +++ b/smart-hut/src/components/dashboard/devices/Sensor.js @@ -175,7 +175,7 @@ export default class Sensor extends Component { dy="0.4em" fontWeight="bold" > - {this.setName()} + {this.setName()} ({this.props.device.id})
diff --git a/smart-hut/src/components/dashboard/devices/SensorStyle.js b/smart-hut/src/components/dashboard/devices/SensorStyle.js index 7706eee..c07927c 100644 --- a/smart-hut/src/components/dashboard/devices/SensorStyle.js +++ b/smart-hut/src/components/dashboard/devices/SensorStyle.js @@ -18,6 +18,9 @@ export const sensorText = { fill: "#3e99ff", fontSize: "1.2rem", fontFamily: "Lato", + overflow: "hidden", + whiteSpace: "nowrap", + textOverflow: "ellipsis", }; export const valueStyle = { @@ -61,6 +64,9 @@ export const nameMotionStyle = { left: "50%", transform: "translateX(-50%)", fontSize: "1.2rem", + overflow: "hidden", + whiteSpace: "nowrap", + textOverflow: "ellipsis", }; export const motionSensorIcon = { diff --git a/smart-hut/src/components/dashboard/devices/SmartPlug.js b/smart-hut/src/components/dashboard/devices/SmartPlug.js index c371532..8b4d30d 100644 --- a/smart-hut/src/components/dashboard/devices/SmartPlug.js +++ b/smart-hut/src/components/dashboard/devices/SmartPlug.js @@ -75,7 +75,9 @@ export default class SmartPlug extends Component { } /> - {this.props.device.name} + + {this.props.device.name} ({this.props.device.id}) + - {this.props.device.name} + + {this.props.device.name} ({this.props.device.id}) + @@ -167,7 +171,7 @@ export default class ModalWindow extends Component { diff --git a/smart-hut/src/views/Dashboard.js b/smart-hut/src/views/Dashboard.js index 5dacf50..144f089 100644 --- a/smart-hut/src/views/Dashboard.js +++ b/smart-hut/src/views/Dashboard.js @@ -168,10 +168,7 @@ export default class Dashboard extends Component { call .devicePost(data, this.props.tkn) .then((res) => { - this.setState((state) => ({ - devices: state.devices.concat([res.data]), - })); - return this.state.devices; + this.getDevices(); }) .catch((err) => {}); } diff --git a/smart-hut/src/views/Home.js b/smart-hut/src/views/Home.js index f99e381..b5e904f 100644 --- a/smart-hut/src/views/Home.js +++ b/smart-hut/src/views/Home.js @@ -207,11 +207,6 @@ const Home = () => ( - - - - - @@ -226,9 +221,6 @@ const Home = () => ( the set the illumination of your entire place. Follow the intelligent light, follow SmartHut.

- @@ -239,19 +231,57 @@ const Home = () => (
- Sitemap - Contact Us - Religious Ceremonies - Gazebo Plans + + + Usi + + + + + VimTok + + + + + Legend of Ajax + + + + + The Shell + +
- Banana Pre-Order - DNA FAQ - How To Access - Favorite X-Men + + + Semantic UI + + + + + Stay Safe + + + + + Stay Home + + + + + Can you Survive? + + diff --git a/smart-hut/src/views/Navbar.js b/smart-hut/src/views/Navbar.js index 3586374..9e0f1f9 100644 --- a/smart-hut/src/views/Navbar.js +++ b/smart-hut/src/views/Navbar.js @@ -26,19 +26,18 @@ class Navbar extends Component { handleClick = (e, { id, name }) => { const room = this.props.rooms.filter((d) => d.id === id)[0]; + console.log(room); this.setState({ activeItem: id, - activeRoom: room, activeItemName: name, }); + this.activeRoom = room; + console.log(this.activeRoom); this.forceUpdate(); - console.log(this.state.activeRoom); this.props.handleItemClick(id); }; render() { - const { activeRoom } = this.state; - console.log("DIO", activeRoom); return (
@@ -170,7 +169,10 @@ class Navbar extends Component { { + console.log("MALUSA", this.activeRoom); + return this.activeRoom; + }} updateRoom={this.props.updateRoom} deleteRoom={this.props.deleteRoom} />