+
{chats}
-
- )
+ );
}
// Contains most everything for the app homepage
-//
+//
function Home() {
// It's time to document and change these awful variable names
// State variables for app page
- const [mainTab, setMainTab] = useState("home") // Primary tab
- const [tab, setTab] = useState("nearby") // Sidebar Tab
- const [chatRoomObj, setChatRoomObj] = useState(null) // Current chatroom object
- const [myRoomsObj, setMyRoomsObj] = useState(null) // My Rooms Object
- const [myRooms, setRoomData] = useState(null) // Current user saved rooms list
- const [isRoomLoading, setRoomLoading] = useState(true) // myRooms loading variable, true = myRooms loading, false = finished loading
- const [isMyRoom, setIsMyRoom] = useState(false) // Is current room in myRooms? true, false
- const [location, setLocation] = useState(null) // location variable [lat,long]
- const [loadingLoc, setLoadingLoc] = useState(true) // location variable loading, true = loading, false = finished loading
+ const [mainTab, setMainTab] = useState("home"); // Primary tab
+ const [tab, setTab] = useState("nearby"); // Sidebar Tab
+ const [chatRoomObj, setChatRoomObj] = useState(null); // Current chatroom object
+ const [myRoomsObj, setMyRoomsObj] = useState(null); // My Rooms Object
+ const [myRooms, setRoomData] = useState(null); // Current user saved rooms list
+ const [isRoomLoading, setRoomLoading] = useState(true); // myRooms loading variable, true = myRooms loading, false = finished loading
+ const [isMyRoom, setIsMyRoom] = useState(false); // Is current room in myRooms? true, false
+ const [location, setLocation] = useState(null); // location variable [lat,long]
+ const [loadingLoc, setLoadingLoc] = useState(true); // location variable loading, true = loading, false = finished loading
const [nearby, setNearby] = useState(null); // nearby rooms array
const [loadingNearby, setLoadingNearby] = useState(true); // loading nearby rooms array, true = loading, false = finished loading
- const [chatroomOnline, setChatRoomOnline] = useState(null) // holds online users
- const [chatroomUsers, setChatroomUsers] = useState(null) // holds all chatroom users
- const [chatroomUsersLoading ,setChatroomUsersLoading] = useState(true)
- const [users, setUsers] = useState(null) // all users from firebase
- const [alreadyLeft, setAlreadyLeft] = useState(false) // if already left from room
- const [markers, setMarkers] = useState([])
+ const [chatroomOnline, setChatRoomOnline] = useState(null); // holds online users
+ const [chatroomUsers, setChatroomUsers] = useState(null); // holds all chatroom users
+ const [chatroomUsersLoading, setChatroomUsersLoading] = useState(true);
+ const [users, setUsers] = useState(null); // all users from firebase
+ const [alreadyLeft, setAlreadyLeft] = useState(false); // if already left from room
+ const [markers, setMarkers] = useState([]);
// Grabs user data, saves to user, then lists the users saved rooms
useEffect(() => {
- fetch('/api/user').then((res) => res.json())
- .then((user) => {
- onValue(ref(database, '/users/'+user.uid+'/rooms'),(snapshot) => {
- setRoomLoading(true)
- var rooms = snapshot.val()
- setMyRoomsObj(rooms)
- var roomArr = []
- var markerArr = markers
- for (var room in rooms) {
- var newRoom =
- markerArr.push()
- roomArr.push(newRoom)
- }
- setMarkers(markerArr)
- setRoomData(roomArr)
- setRoomLoading(false)
- })
- })
-}, [])
+ fetch("/api/user")
+ .then((res) => res.json())
+ .then((user) => {
+ onValue(ref(database, "/users/" + user.uid + "/rooms"), (snapshot) => {
+ setRoomLoading(true);
+ var rooms = snapshot.val();
+ setMyRoomsObj(rooms);
+ var roomArr = [];
+ var markerArr = markers;
+ for (var room in rooms) {
+ var newRoom = (
+
+ );
+ markerArr.push(
+
+ );
+ roomArr.push(newRoom);
+ }
+ setMarkers(markerArr);
+ setRoomData(roomArr);
+ setRoomLoading(false);
+ });
+ });
+ }, []);
// Grabs the user location
useEffect(() => {
- if('geolocation' in navigator) {
+ if ("geolocation" in navigator) {
// Retrieve latitude & longitude coordinates from `navigator.geolocation` Web API
navigator.geolocation.getCurrentPosition(({ coords }) => {
- setLocation(coords)
- setLoadingLoc(false)
- var nearbyArr = []
- var path = String(coords.latitude.toFixed(2)).replace(".","")+"/"+String(coords.longitude.toFixed(2)).replace(".","")
- var markersArr = markers
+ setLocation(coords);
+ setLoadingLoc(false);
+ var nearbyArr = [];
+ var path =
+ String(coords.latitude.toFixed(2)).replace(".", "") +
+ "/" +
+ String(coords.longitude.toFixed(2)).replace(".", "");
+ var markersArr = markers;
get(ref(database, `/rooms/${path}`)).then((snapshot) => {
if (snapshot.exists()) {
- var data = snapshot.val()
+ var data = snapshot.val();
for (var room in data) {
- nearbyArr.push()
+ nearbyArr.push(
+
+ );
// TODO: RANDOM LAST DIGIT TO MOVE AROUND THE MAP
- markersArr.push()
+ markersArr.push(
+
+ );
}
- setMarkers(markersArr)
- setLoadingNearby(false)
- setNearby(nearbyArr)
+ setMarkers(markersArr);
+ setLoadingNearby(false);
+ setNearby(nearbyArr);
} else {
- setLoadingNearby(false)
+ setLoadingNearby(false);
}
- })
- })
+ });
+ });
}
}, []);
// Grab list of all users
useEffect(() => {
get(ref(database, `/users`)).then((snapshot) => {
- setUsers(snapshot.val())
- })
-
+ setUsers(snapshot.val());
+ });
}, []);
// Dont Double Send Leaving Message
useEffect(() => {
- if (myRoomsObj && chatRoomObj) {
- var roomName = chatRoomObj.name+"-"+chatRoomObj.timestamp
- if (myRooms != null && roomName in myRoomsObj) {
- // its in there
- setIsMyRoom(true)
- } else {
- // its not in there
- setIsMyRoom(false)
+ if (myRoomsObj && chatRoomObj) {
+ var roomName = chatRoomObj.name + "-" + chatRoomObj.timestamp;
+ if (myRooms != null && roomName in myRoomsObj) {
+ // its in there
+ setIsMyRoom(true);
+ } else {
+ // its not in there
+ setIsMyRoom(false);
+ }
}
- }
- }, [chatRoomObj])
+ }, [chatRoomObj]);
// CreateRoom Module for Sidebar Create Tab
- function CreateRoom({loc}) {
- var { register, control, reset, handleSubmit} = useForm()
-
+ function CreateRoom({ loc }) {
+ var { register, control, reset, handleSubmit } = useForm();
+
function createRoom(data) {
- reset()
- var path = String(loc.latitude.toFixed(2)).replace(".","")+"/"+String(loc.longitude.toFixed(2)).replace(".","")
- var timestamp = new Date().getTime()
+ reset();
+ var path =
+ String(loc.latitude.toFixed(2)).replace(".", "") +
+ "/" +
+ String(loc.longitude.toFixed(2)).replace(".", "");
+ var timestamp = new Date().getTime();
var payload = {
name: data.name,
description: data.description,
timestamp: timestamp,
latitude: loc.latitude,
longitude: loc.longitude,
- path: path
- }
- set(ref(database,`/rooms/${path}/${data.name}-${timestamp}`), payload)
+ path: path,
+ };
+ set(ref(database, `/rooms/${path}/${data.name}-${timestamp}`), payload);
}
-
+
return (
-
+