npease/ChatMaps
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 7 Wiki Activity

Merge branch 'main' into sgoodridge

Browse Source
This commit is contained in:
Stephen
2024-04-11 01:32:03 -04:00
parent 401cc4670c 0668350eed
commit a695a47d8b
4 changed files with 117 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+4 -6
View File
@@ -1,9 +1,9 @@
![](/frontend-next/public/logos/logo_transparent.png)
Main repo for ChatMaps, our COS420 Project.
ChatMaps is a web-based social networking service that allows users to connect to others in their local geographic area. It implements an interactable mapping utility to show general user locations relative to other users, as well as a chat room feature that allows users to start public conversations based on a specified topic. ChatMaps is primarily intended for use in densely populated areas, such as college campuses or metropolitan areas, so people of similar interests can start conversations. The goal of this project is to create a web app that plots locations, gives a radius of the local area, and connects users into different topic-based chat rooms.
ChatMaps is a web-based social networking service that allows users to connect to others in their local geographic area. It implements an interactable mapping utility to show general user locations relative to others, as well as a chat room feature that allows users to start public conversations based on any given topic. ChatMaps is primarily intended for use in densely populated areas, such as college campuses or metropolitan areas, so people of similar interests can start new conversations. The goal of this project is to create a web app that plots locations, gives a radius of the local area, and connects users into different topic-based chat rooms.
This service implements user login and profiles, allowing users to add each other as friends and start private conversations. There are several default chat rooms of varying topics, but users also have the ability to create their own topics that will be viewable by other users. For example, a user at the University of Maine could create a joinable chat room titled “COS420”, which would be visible to others near this campus.
This service implements user login and profiles, allowing users to add each other as friends and start private conversations. There are several default chat rooms of varying topics, but users also have the ability to create their own rooms that will be visible to other users. For example, a user at the University of Maine could create a joinable chat room titled “COS420”, which would be joinable by others near this campus.
This app shares some similarities to other social networks that implement location-based content. ChatMaps’ novel approach is to utilize user location to facilitate real-time communication with others within a given radius.
@@ -11,15 +11,13 @@ The live version of this app can be found at:
https://chatma.ps/
A local version can be run with:
A local version can be run (assuming you have Node installed) with:
cd frontend-next/
npm install
npm run build
npm run start
npm run dev
then navigating to:
frontend-next/public/deletion.html
+28
View File
@@ -0,0 +1,28 @@
<!DOCTYPE html>
<html>
<head>
<title>User Data Deletion Request</title>
</head>
<body>
<h1>User Data Deletion Request</h1>
<p>
To request the deletion of your user data from our system, please follow the steps below:
</p>
<ol>
<li>Compose an email to <a href="mailto:deletion@chatma.ps">deletion@chatma.ps</a>.</li>
<li>In the email subject, write "User Data Deletion Request".</li>
<li>In the body of the email, provide the following information:</li>
<ul>
<li>Your username: [Insert your username here]</li>
<li>Your email address associated with the account: [Insert your email address here]</li>
</ul>
<li>Send the email.</li>
</ol>
<p>
Our team will process your request as soon as possible. Please note that the deletion of your user data may take some time, and we will notify you once it has been completed.
</p>
<p>
If you have any further questions or concerns, please don't hesitate to contact us at <a href="mailto:support@chatma.ps">support@chatma.ps</a>.
</p>
</body>
</html>
frontend-next/public/privacy.html
+33
View File
@@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ChatMaps Privacy Policy</title>
</head>
<body>
<h1>ChatMaps Privacy Policy</h1>
<p>At ChatMaps, we are committed to protecting your privacy and ensuring the security of your personal information. This privacy policy explains how we collect, use, and safeguard your data when you use our application.</p>
<h2>Collection of Personal Information</h2>
<p>ChatMaps requires access to your location in order to provide you with location-based services. However, we do not share, sell, or disclose your personal data to any third party.</p>
<h2>Child Safety</h2>
<p>ChatMaps is fully compliant with online child safety laws. We do not knowingly collect personal information from children under the age of 13. If you believe that we have inadvertently collected personal information from a child, please contact us immediately so that we can take appropriate action.</p>
<h2>Data Security</h2>
<p>We take the security of your personal information seriously. We implement industry-standard security measures to protect your data from unauthorized access, alteration, or disclosure.</p>
<h2>Changes to this Privacy Policy</h2>
<p>We reserve the right to update or modify this privacy policy at any time. Any changes will be effective immediately upon posting the updated policy on our website.</p>
<h2>Contact Us</h2>
<p>If you have any questions or concerns about our privacy policy, please contact us at privacy@chatma.ps .</p>
</body>
</html>
frontend-next/src/components/app/map/geo.js
+52 -10
View File
@@ -1,11 +1,19 @@
import { Map, Marker, ZoomControl } from "pigeon-maps";
import { Map, Marker, ZoomControl, Overlay } from "pigeon-maps";
import { database } from "../../../../firebase-config";
import { ref, get } from "firebase/database";
import { ref, get} from "firebase/database";
import { useState, useEffect } from "react";
import ChatBubbleTwoToneIcon from '@mui/icons-material/ChatBubbleTwoTone';
import PersonOutlineTwoToneIcon from '@mui/icons-material/PersonOutlineTwoTone';
import { red } from '@mui/material/colors';
// ONLY nearby markers
function NearbyRoomMarkers({ loc, user }) {
function NearbyRoomMarkers({ loc, user, markers }) {
if (!markers || !loc || !user) {
return [null, null];
}
const [markerArr, setMarkerArr] = useState([]);
const [hoveredRoom, setHoveredRoom] = useState(null);
// Room path in DB
const path =
@@ -20,6 +28,20 @@ function NearbyRoomMarkers({ loc, user }) {
"/chat?room=" + path + roomObj.name + "-" + roomObj.timestamp;
};
const handleRoomHover = (roomObj) => {
setHoveredRoom(
<Overlay offset={[0, 100]}>
<div className="fixed bg-cyan-500 p-2 shadow-md rounded-lg">
<p className="font-bold text-white">{roomObj.name}</p>
</div>
</Overlay>
);
};
const handleRoomUnhover = (roomObj) => {
setHoveredRoom(null);
};
// Mostly copied Nick's code from before
useEffect(() => {
if (loc && user) {
@@ -34,18 +56,22 @@ function NearbyRoomMarkers({ loc, user }) {
<Marker
key={markerKey}
anchor={[roomObj.latitude, roomObj.longitude]}
color="blue"
onClick={() => handleRoomMarkerClick(roomObj)}
></Marker>
onMouseOver={() => handleRoomHover(roomObj)}
onMouseOut={() => handleRoomUnhover(roomObj)}
style={{pointerEvents:'auto'} /* So stupid */}
>
<ChatBubbleTwoToneIcon color="primary" fontSize="large"/>
</Marker>
);
});
});
setMarkerArr(newMarkers);
}
});
}
}, []);
return markerArr;
return [markerArr, hoveredRoom];
}
/**
@@ -60,7 +86,12 @@ function NearbyRoomMarkers({ loc, user }) {
export function Geo({ loc, zoom, moveable, markers, user }) {
const handleUserMarkerClick = () => {
window.location.href = "/user?uid=" + user.uid;
}
};
// SCUFFED AF
var rooms = NearbyRoomMarkers({ loc, user, markers });
var room_markers = rooms[0];
var room_overlay = rooms[1];
if (!loc) {
return <div>Getting Location...</div>;
@@ -72,11 +103,22 @@ export function Geo({ loc, zoom, moveable, markers, user }) {
defaultZoom={zoom}
mouseEvents={moveable}
touchEvents={moveable}
attribution={false}
>
{
room_overlay /* Renders the room name overlay when you mouse over room */
}
{zoom && <ZoomControl />}
{markers && NearbyRoomMarkers({ loc, user })}
{room_markers /* Renders the actual room markers */}
{user && ( // Shows the user marker
<Marker anchor={[loc.latitude, loc.longitude]} color="red" onClick={handleUserMarkerClick} />
<Marker
anchor={[loc.latitude, loc.longitude]}
color="red"
onClick={handleUserMarkerClick}
style={{pointerEvents:'auto'} /* So stupid */}
>
<PersonOutlineTwoToneIcon sx={{ color: red[500] }} fontSize="large"/>
</Marker>
)}
</Map>
</>