mirrors
/
ntfy
mirror de https://github.com/binwiederhier/ntfy


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
							<!DOCTYPE html>
<html lang="en">
<head>
    <title>ntfy.sh</title>
    <style>
    </style>
</head>
<body>
<h1>ntfy.sh</h1>

<p>
    ntfy.sh is a super simple pub-sub notification service. It allows you to send desktop and (soon) phone notifications
    via scripts, without signup or cost. It's entirely free and open source. You can find the source code <a href="https://github.com/binwiederhier/ntfy">on GitHub</a>.
</p>

<p>
    You can subscribe to a topic either in this web UI, or in your own app by subscribing to an SSE/EventSource
    or JSON feed. Once subscribed, you can publish messages via PUT or POST.
</p>

<p id="error"></p>

<form id="subscribeForm">
    <input type="text" id="topicField" size="64" autofocus />
    <input type="submit" id="subscribeButton" value="Subscribe topic" />
</form>

<p>Topics:</p>
<ul id="topicsList">
</ul>

<script type="text/javascript">
    let topics = {};

    const topicField = document.getElementById("topicField");
    const topicsList = document.getElementById("topicsList");
    const subscribeButton = document.getElementById("subscribeButton");
    const subscribeForm = document.getElementById("subscribeForm");
    const errorField = document.getElementById("error");

    const subscribe = (topic) => {
        if (Notification.permission !== "granted") {
            Notification.requestPermission().then((permission) => {
                if (permission === "granted") {
                    subscribeInternal(topic, 0);
                }
            });
        } else {
            subscribeInternal(topic, 0);
        }
    };

    const subscribeInternal = (topic, delaySec) => {
        setTimeout(() => {
            // Render list entry
            let topicEntry = document.getElementById(`topic-${topic}`);
            if (!topicEntry) {
                topicEntry = document.createElement('li');
                topicEntry.id = `topic-${topic}`;
                topicEntry.innerHTML = `${topic} <button onclick="unsubscribe('${topic}')">Unsubscribe</button>`;
                topicsList.appendChild(topicEntry);
            }

            // Open event source
            let eventSource = new EventSource(`${topic}/sse`);
            eventSource.onopen = () => {
                topicEntry.innerHTML = `${topic} <button onclick="unsubscribe('${topic}')">Unsubscribe</button>`;
                delaySec = 0; // Reset on successful connection
            };
            eventSource.onerror = (e) => {
                console.log("onerror")
                const newDelaySec = (delaySec + 5 <= 30) ? delaySec + 5 : 30;
                topicEntry.innerHTML = `${topic} <i>(Reconnecting in ${newDelaySec}s ...)</i> <button onclick="unsubscribe('${topic}')">Unsubscribe</button>`;
                eventSource.close()
                subscribeInternal(topic, newDelaySec);
            };
            eventSource.onmessage = (e) => {
                const event = JSON.parse(e.data);
                new Notification(event.message);
            };
            topics[topic] = eventSource;
            localStorage.setItem('topics', JSON.stringify(Object.keys(topics)));
        }, delaySec * 1000);
    };

    const unsubscribe = (topic) => {
        topics[topic].close();
        delete topics[topic];
        localStorage.setItem('topics', JSON.stringify(Object.keys(topics)));
        document.getElementById(`topic-${topic}`).remove();
    };

    subscribeForm.onsubmit = function () {
        if (!topicField.value) {
            return false;
        }
        subscribe(topicField.value);
        topicField.value = "";
        return false;
    };

    // Disable Web UI if notifications of EventSource are not available
    if (!window["Notification"] || !window["EventSource"]) {
        errorField.innerHTML = "Your browser is not compatible to use the web-based desktop notifications.";
        topicField.disabled = true;
        subscribeButton.disabled = true;
    } else if (Notification.permission === "denied") {
        errorField.innerHTML = "You have blocked desktop notifications for this website. Please unblock them and refresh to use the web-based desktop notifications.";
        topicField.disabled = true;
        subscribeButton.disabled = true;
    }

    // Reset UI
    topicField.value = "";

    // Restore topics
    const storedTopics = localStorage.getItem('topics');
    if (storedTopics) {
        JSON.parse(storedTopics).forEach((topic) => {
            subscribeInternal(topic, 0);
        });
    }
</script>

</body>
</html>