diff --git a/smart-hut/src/views/FourOhFour.js b/smart-hut/src/views/FourOhFour.js index 2aa89f5..3913981 100644 --- a/smart-hut/src/views/FourOhFour.js +++ b/smart-hut/src/views/FourOhFour.js @@ -1,35 +1,110 @@ import React, {Component} from 'react'; -import { Header, Grid, Message, Button} from 'semantic-ui-react'; +import { Header, Grid, Message, Button, Segment, Responsive, Image} from 'semantic-ui-react'; import {Link } from "react-router-dom"; +import MyHeader from '../components/HeaderController' export default class FourOhFour extends Component { + constructor(props) { + super(props); + const meme = ['1.jpeg', '2.jpeg', '3.png', '4.jpeg', '5.jpeg', '6.jpg', '7.jpg', + '8.jpg', '9.jpeg', '10.jpg', '11.jpeg', '12.gif', '13.gif', '14.gif']; + var arrayNum = Math.floor(Math.random() * 13) + 1; + var path = 'img/room_404_meme/' + meme[arrayNum]; + this.state = {meme : path}; + } + render() { + return ( -
- - -
404
-
- - - - 404 Page Not Found + + +
+ + + + + + + + + + + + +

404 Page Not Found

+
+
+ + + + +

- Hey what are you doing here? - Looks like you are lost, this room does not exist. + Hey what are you doing here? + Looks like you are lost, this room does not exist. Maybe you were looking for + the kitchen, or the garage, or the bedroom, or your love room... so don't + wait here and let's go back to our main room! ...or refresh this page + some times...

- -
- - - -
+ +
+
+
+ + + +
+
+ + +
+ + + + + + + + + + + + +

404 Page Not Found

+
+
+ + + + + + + +

+ Hey what are you doing here? + Looks like you are lost, this room does not exist. Maybe you were looking for + the kitchen, or the garage, or the bedroom, or your love room... so don't + wait here and let's go back to our main room! ...or refresh this page + some times... +

+ +
+
+
+
+
+
+
+
+
) } -} \ No newline at end of file +} diff --git a/smart-hut/src/views/Navbar.js b/smart-hut/src/views/Navbar.js index de3f183..8e4363d 100644 --- a/smart-hut/src/views/Navbar.js +++ b/smart-hut/src/views/Navbar.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import { Menu, Grid, Icon, Responsive, Segment } from "semantic-ui-react"; +import { Menu, Grid, Icon, Button, Header, Image, Modal, Responsive, Segment, Dropdown } from "semantic-ui-react"; import {editButtonStyle} from "../components/dashboard/devices/styleComponents"; import ModalWindow from "../components/modalform"; @@ -8,16 +8,15 @@ class Navbar extends Component { super(props); this.state = { activeItem: 'Home', + activeItemName: 'Home', edited: "", editMode : false } } - editModeController = (e) => { - this.setState((prevState) => ({ editMode: !prevState.editMode })); - }; + editModeController = (e) => this.setState((prevState) => ({ editMode: !prevState.editMode })); - handleClick = (e, {id}) => { + handleClick = (e, {id, name}) => { console.log(id); let obj = undefined; this.props.rooms.forEach((e) => { @@ -25,8 +24,10 @@ class Navbar extends Component { obj = e; } }); - this.setState({ activeItem: id, - activeRoom: obj + this.setState({ + activeItem: id, + activeRoom: obj, + activeItemName: name }); this.props.handleItemClick(id) } @@ -36,7 +37,7 @@ class Navbar extends Component { return (
- + @@ -82,7 +83,7 @@ class Navbar extends Component { {e.name} - {this.state.edit ? + {this.state.editMode ? : null } @@ -110,9 +111,76 @@ class Navbar extends Component { + - + + + + + + + + + + + + Home + + + + + + {this.props.rooms ? + this.props.rooms.map((e, i) => { + return ( + + + + + + + + {e.name} + + + + + ) + }) : null + } + + + + + + + + + + + + + + + +
);