Skip to content

Commit 1321bf1

Browse files
author
Philipp Heckel
committed
Make things prettier, better sound, FAQ, icon in desktop notification
1 parent accd369 commit 1321bf1

8 files changed

+82
-29
lines changed

‎README.md

-18
Original file line numberDiff line numberDiff line change
@@ -101,24 +101,6 @@ make build-simple
101101
To build releases, I use [GoReleaser](https://goreleaser.com/). If you have that installed, you can run `make build` or
102102
`make build-snapshot`.
103103

104-
## FAQ
105-
106-
### Isn't this like ...?
107-
Probably. I didn't do a whole lot of research before making this.
108-
109-
### Can I use this in my app?
110-
Yes. As long as you don't abuse it, it'll be available and free of charge.
111-
112-
### What are the uptime guarantees?
113-
Best effort.
114-
115-
### Why is the web UI so ugly?
116-
I don't particularly like JS or dealing with CSS. I'll make it pretty after it's functional.
117-
118-
### Will you know what topics exist, can you spy on me?
119-
If you don't trust me or your messages are sensitive, run your ntfy on your own server. That said, the logs do not
120-
contain any topic names or other details about you.
121-
122104
## TODO
123105
- add HTTPS
124106

‎examples/example_desktop_notifications.sh

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
#!/bin/bash
2+
# This is an example shell script showing how to consume a ntfy.sh topic using
3+
# a simple script. The notify-send command sends any arriving message as a desktop notification.
4+
5+
while read msg; do
6+
notify-send "$msg"
7+
done < <(stdbuf -i0 -o0 curl -s ntfy.sh/mytopic/raw)

‎server/index.html

+60-8
Original file line numberDiff line numberDiff line change
@@ -25,14 +25,14 @@
2525
<meta property="og:site_name" content="ntfy.sh" />
2626
<meta property="og:title" content="ntfy.sh | simple HTTP-based pub-sub" />
2727
<meta property="og:description" content="ntfy is a simple HTTP-based pub-sub notification service. It allows you to send desktop notifications via scripts from any computer, entirely without signup or cost. Made with ❤ by Philipp C. Heckel, Apache License 2.0, source at https://heckel.io/ntfy." />
28-
<meta property="og:image" content="/static/img/ntfy.png" />
28+
<meta property="og:image" content="/static/img/favicon.png" />
2929
<meta property="og:url" content="https://ntfy.sh" />
3030
</head>
3131
<body>
3232
<div id="main">
3333
<h1>ntfy.sh - simple HTTP-based pub-sub</h1>
3434
<p>
35-
<b>ntfy</b> (pronounce: <i>notify</i>) is a simple HTTP-based pub-sub notification service and tool.
35+
<b>ntfy</b> (pronounce: <i>notify</i>) is a simple HTTP-based <a href="https://en.wikipedia.org/wiki/Publish%E2%80%93subscribe_pattern">pub-sub</a> notification service.
3636
It allows you to send <b>desktop notifications via scripts from any computer</b>, entirely <b>without signup or cost</b>.
3737
It's also <a href="https://github.com/binwiederhier/ntfy">open source</a> if you want to run your own.
3838
</p>
@@ -55,20 +55,38 @@ <h3>Subscribe via web</h3>
5555
</p>
5656
<form id="subscribeForm">
5757
<p>
58-
<label for="topicField">Topic ID:</label>
58+
<label for="topicField">Subscribe to topic:</label>
5959
<input type="text" id="topicField" placeholder="Letters, numbers, _ and -" pattern="[-_A-Za-z]{1,64}" autofocus />
6060
<input type="submit" id="subscribeButton" value="Subscribe" />
6161
</p>
6262
</form>
63-
<p id="topicsHeader">Subscribed topics:</p>
63+
<p id="topicsHeader">Topics:</p>
6464
<ul id="topicsList"></ul>
65-
<audio id="notifySound" src="static/sound/mixkit-long-pop-2358.wav"></audio>
65+
<audio id="notifySound" src="static/sound/mixkit-message-pop-alert-2354.mp3"></audio>
6666

6767
<h3>Subscribe via your app, or via the CLI</h3>
68+
<p>
69+
Here are some examples using <tt>curl</tt>:
70+
</p>
6871
<code>
69-
curl -s ntfy.sh/mytopic/raw # one message per line (\n are replaced with a space)<br/>
70-
curl -s ntfy.sh/mytopic/json # one JSON message per line<br/>
71-
curl -s ntfy.sh/mytopic/sse # server-sent events (SSE) stream
72+
# one message per line (\n are replaced with a space)<br/>
73+
curl -s ntfy.sh/mytopic/raw<br/><br/>
74+
75+
# one JSON message per line<br/>
76+
curl -s ntfy.sh/mytopic/json<br/><br/>
77+
78+
# server-sent events (SSE) stream, use with EventSource<br/>
79+
curl -s ntfy.sh/mytopic/sse
80+
</code>
81+
<p>
82+
Using <a href="https://developer.mozilla.org/en-US/docs/Web/API/EventSource">EventSource</a>, you can consume
83+
notifications like this (see <a href="https://github.com/binwiederhier/ntfy/tree/main/examples">full example</a>):
84+
</p>
85+
<code>
86+
const eventSource = new EventSource(`https://ntfy.sh/mytopic/sse`);<br/>
87+
eventSource.onmessage = (e) => {<br/>
88+
&nbsp;&nbsp;// Do something with e.data<br/>
89+
};
7290
</code>
7391

7492
<h2>Publishing messages</h2>
@@ -78,10 +96,44 @@ <h2>Publishing messages</h2>
7896
<code>
7997
curl -d "long process is done" ntfy.sh/mytopic
8098
</code>
99+
<p>
100+
Here's an example in JS with <tt>fetch()</tt> (see <a href="https://github.com/binwiederhier/ntfy/tree/main/examples">full example</a>):
101+
</p>
102+
<code>
103+
fetch(`https://ntfy.sh/mytopic`, {<br/>
104+
&nbsp;&nbsp;method: 'POST', // PUT works too<br/>
105+
&nbsp;&nbsp;body: `Hello from the other side.`<br/>
106+
})
107+
</code>
81108
<p>
82109
Messages published to a non-existing topic or a topic without subscribers will not be delivered later.
83110
There is (currently) no buffering of any kind. If you're not listening, the message won't be delivered.
84111
</p>
112+
113+
<h2>FAQ</h2>
114+
<p>
115+
<b>Isn't this like ...?</b><br/>
116+
Who knows. I didn't do a lot of research before making this. It was fun making it.
117+
</p>
118+
119+
<p>
120+
<b>Can I use this in my app? Will it stay free?</b><br/>
121+
Yes. As long as you don't abuse it, it'll be available and free of charge. I do not plan on monetizing
122+
the service.
123+
</p>
124+
125+
<p>
126+
<b>What are the uptime guarantees?</b><br/>
127+
Best effort.
128+
</p>
129+
130+
<p>
131+
<b>Will you know what topics exist, can you spy on me?</b><br/>
132+
If you don't trust me or your messages are sensitive, run your own server. It's <a href="https://github.com/binwiederhier/ntfy">open source</a>.
133+
That said, the logs do not contain any topic names or other details about you. Check the code if you don't believe me.
134+
</p>
135+
136+
<center id="ironicCenterTagDontFreakOut"><i>Made with ❤️ by <a href="https://heckel.io">Philipp C. Heckel</a></i></center>
85137
</div>
86138
<script src="static/js/app.js"></script>
87139
</body>

‎server/static/css/app.css

+10-1
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@ h1 {
2020
font-size: 2.5em;
2121
}
2222

23+
2324
h2 {
2425
margin-top: 20px;
2526
margin-bottom: 5px;
@@ -33,8 +34,10 @@ h3 {
3334
}
3435

3536
p {
36-
margin-top: 0;
37+
margin-top: 10px;
38+
margin-bottom: 20px;
3739
font-size: 1.1em;
40+
line-height: 140%;
3841
}
3942

4043
tt {
@@ -49,6 +52,8 @@ code {
4952
font-family: monospace;
5053
padding: 20px;
5154
border-radius: 3px;
55+
margin-top: 10px;
56+
margin-bottom: 10px;
5257
}
5358

5459
/* Lato font (OFL), https://fonts.google.com/specimen/Lato#about,
@@ -74,3 +79,7 @@ code {
7479
color: darkred;
7580
font-style: italic;
7681
}
82+
83+
#ironicCenterTagDontFreakOut {
84+
color: #666;
85+
}

‎server/static/img/ntfy.png

-1.23 KB
Binary file not shown.

‎server/static/js/app.js

+5-2
Original file line numberDiff line numberDiff line change
@@ -59,8 +59,11 @@ const subscribeInternal = (topic, delaySec) => {
5959
};
6060
eventSource.onmessage = (e) => {
6161
const event = JSON.parse(e.data);
62-
new Notification(event.message);
6362
notifySound.play();
63+
new Notification(topic, {
64+
body: event.message,
65+
icon: '/static/img/favicon.png'
66+
});
6467
};
6568
topics[topic] = eventSource;
6669
localStorage.setItem('topics', JSON.stringify(Object.keys(topics)));
@@ -80,7 +83,7 @@ const unsubscribe = (topic) => {
8083
const test = (topic) => {
8184
fetch(`/${topic}`, {
8285
method: 'PUT',
83-
body: `This is a test notification for topic ${topic}!`
86+
body: `This is a test notification`
8487
})
8588
};
8689

‎server/static/sound/mixkit-long-pop-2358.wav

-221 KB
Binary file not shown.

‎server/static/sound/mixkit-message-pop-alert-2354.mp3

45.8 KB
Binary file not shown.

0 commit comments

Comments
 (0)