lamp/chat
lamp/chat
1
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: lamp:79d12b4f51d02051de7c3b7beb3139d92a422af9
Branches Tags
lamp:master
...
compare: lamp:b3bdaae4962b4c832a681f10a811ebd65b1c2f86
Branches Tags
lamp:master

2 Commits
79d12b4f51 ... b3bdaae496

Author SHA1 Message Date
Lamp
b3bdaae496 include user agent string in user 2022-10-05 16:52:16 -05:00
Lamp
9a2bc648c4 unread message indicator 2022-09-27 22:25:27 -05:00
4 changed files with 120 additions and 6 deletions
Show Stats Expand all files Collapse all files

7
app/public/index.html
View File

@ -2,13 +2,10 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<link id="favicon" rel="icon" href="%PUBLIC_URL%/favicon.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="chat app"
/>
<meta name="description" content="chat app" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<title>chat</title>

11
app/src/App.js
View File

@ -36,6 +36,16 @@ function Chat({user, setUser, theme, setTheme}) {
var [socket, setSocket] = useState();
var [settingsModalOpen, setSettingsModalOpen] = useState(false);
var [progress, setProgress] = useState(null);
var [unread, setUnread] = useState(0);
useEffect(() => {
document.getElementById("favicon").href = BASE_URL+`/favicon.svg?num=${unread}`;
}, [unread]);
useEffect(() => {
document.addEventListener("visibilitychange", () => {
if (document.visibilityState === "visible") setUnread(0);
});
}, []);
useEffect(() => {
var socket = io(BASE_URL);
@ -56,6 +66,7 @@ function Chat({user, setUser, theme, setTheme}) {
socket.on("messages", setMessages);
socket.on("message", message => {
setMessages(messages => [...messages, message]);
if (document.visibilityState === "hidden") setUnread(unread => ++unread);
});
socket.on("users", setUsers);
return () => socket.close();

8
server/index.js
View File

@ -134,6 +134,11 @@ app.put("/emoji/:name", express.raw({limit: "1mb", type: ()=>true}), async (req,
res.sendStatus(201);
} catch (error) {next(error)}
});
var favicon = fs.readFileSync("logo.svg", "utf-8");
app.get("/favicon.svg", (req, res) => {
res.header("Cache-Control", "max-age=86400");
res.type("svg").send(favicon.replaceAll("{num}", Number(req.query.num || 0) || ""));
});
app.use(express.static(require("path").join(__dirname, "../app/build/")));
@ -148,7 +153,8 @@ dbclient.connect().then(async () => {
website: user.website?.trim()?.substring(0,1000),
uuid: user.uuid?.substring(0,128) || Math.random().toString(),
socketid: socket.id,
ip: socket.ip
ip: socket.ip,
agent: socket.handshake.headers["user-agent"]
};
console.debug("user", user);
socket.data.user = user;

100
server/logo.svg Normal file
View File

@ -0,0 +1,100 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="512"
height="512"
viewBox="0 0 135.46667 135.46667"
version="1.1"
id="svg12"
inkscape:export-filename="bitmap.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"
inkscape:version="1.2.1 (9c6d41e410, 2022-07-14)"
sodipodi:docname="logo.svg"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview14"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="mm"
showgrid="false"
inkscape:zoom="0.71624579"
inkscape:cx="155.67282"
inkscape:cy="226.87742"
inkscape:window-width="1920"
inkscape:window-height="991"
inkscape:window-x="-9"
inkscape:window-y="-9"
inkscape:window-maximized="1"
inkscape:current-layer="layer1" />
<defs
id="defs9">
<filter
inkscape:collect="always"
style="color-interpolation-filters:sRGB"
id="filter1158"
x="-0.2668752"
y="-0.16879727"
width="1.5337504"
height="1.3375945">
<feGaussianBlur
inkscape:collect="always"
stdDeviation="5.2893724"
id="feGaussianBlur1160" />
</filter>
</defs>
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<circle
style="fill:#00ffff;stroke-width:0.216579"
id="path372"
cx="-67.73333"
cy="67.73333"
transform="scale(-1,1)"
r="67.73333" />
<text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:134.795px;line-height:1.25;font-family:sans-serif;fill:#008080;fill-opacity:1;stroke:none;stroke-width:3.36987"
x="0.060306985"
y="113.65733"
id="text378"><tspan
sodipodi:role="line"
id="tspan376"
style="fill:#008080;stroke-width:3.36987"
x="0.060306985"
y="113.65733">チ</tspan></text>
<text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:110.067px;line-height:1.25;font-family:sans-serif;direction:rtl;fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:2.752;stroke-opacity:1;filter:url(#filter1158);stroke-dasharray:none"
x="140.86877"
y="131.62408"
id="text393-5"><tspan
sodipodi:role="line"
id="tspan391-2"
style="direction:rtl;fill:#000000;stroke-width:2.752;stroke:#000000;stroke-opacity:1;fill-opacity:1;stroke-dasharray:none"
x="140.86877"
y="131.62408">{num}</tspan></text>
<text
xml:space="preserve"
style="font-style:normal;font-weight:normal;font-size:110.067px;line-height:1.25;font-family:sans-serif;direction:rtl;fill:#ff0000;fill-opacity:1;stroke:none;stroke-width:2.75168"
x="138.9102"
y="130.72346"
id="text393"><tspan
sodipodi:role="line"
id="tspan391"
style="direction:rtl;fill:#ff0000;stroke-width:2.75168"
x="138.9102"
y="130.72346">{num}</tspan></text>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB