From 54f27794e7fee1113115baafe1b86fdbcde8e7c2 Mon Sep 17 00:00:00 2001 From: Vitaly Takmazov Date: Fri, 23 Dec 2022 20:23:41 +0300 Subject: Display new replies as browser notifications --- src/main/assets/scripts.js | 41 +++++++- .../resources/templates/views/settings_main.html | 113 ++++++++++++--------- 2 files changed, 103 insertions(+), 51 deletions(-) diff --git a/src/main/assets/scripts.js b/src/main/assets/scripts.js index 13f0cb75..73ca80df 100644 --- a/src/main/assets/scripts.js +++ b/src/main/assets/scripts.js @@ -57,7 +57,10 @@ const translations = { 'loginDialog.facebook': 'Login with Facebook', 'loginDialog.vk': 'Login with VK', 'loginDialog.email': 'Registration', - 'error.error': 'Error' + 'error.error': 'Error', + 'settings.notifications.granted': 'Enabled', + 'settings.notifications.denied': 'Denied', + 'settings.notifications.request': 'Enable', }, 'ru': { 'message.inReplyTo': 'в ответ на', @@ -82,7 +85,10 @@ const translations = { 'loginDialog.facebook': 'Войти через Facebook', 'loginDialog.vk': 'Войти через ВКонтакте', 'loginDialog.email': 'Регистрация', - 'error.error': 'Ошибка' + 'error.error': 'Ошибка', + 'settings.notifications.granted': 'Подключено', + 'settings.notifications.denied': 'Запрещено', + 'settings.notifications.request': 'Подключить', } }; /* eslint-enable only-ascii/only-ascii */ @@ -189,6 +195,11 @@ function wsIncomingReply(msg) { document.getElementById('replies').appendChild(li); updateRepliesCounter(); + var notify = new Notification(msg.user.uname, { + body: `${msg.replyQuote}\n${msg.body}`, + icon: msg.user.avatar + }); + notify.onerror = console.log; } function newReply(e) { @@ -531,6 +542,24 @@ function fetchUserUri(dataUri, callback) { } } +function notificationsCheckPermissions(button) { + console.log(Notification.permission); + switch (Notification.permission.toLowerCase()) { + case 'granted': + button.innerHTML = `${i18n('settings.notifications.granted')}`; + button.disabled = true; + break; + + case 'denied': + button.innerHTML = `${i18n('settings.notifications.denied')}`; + button.disabled = true; + break; + + case 'default': + button.innerHTML = `${i18n('settings.notifications.request')}`; + } +} + /******************************************************************************/ function ready(fn) { @@ -771,6 +800,12 @@ ready(() => { es.close(); } }); - embedAll(); + const button = document.getElementById('notifications_toggle'); + if (button) { + button.addEventListener('click', () => { + Notification.requestPermission(function(result) { notificationsCheckPermissions(button); }); + }); + notificationsCheckPermissions(button); + } }); diff --git a/src/main/resources/templates/views/settings_main.html b/src/main/resources/templates/views/settings_main.html index 0c0853f5..8f3873a0 100644 --- a/src/main/resources/templates/views/settings_main.html +++ b/src/main/resources/templates/views/settings_main.html @@ -1,30 +1,36 @@ {% extends "layouts/default" %} {% block content %}
-

Настройки

+

Settings

{%if not visitor.verified %}

Verify your account by adding email or social account

{% endif %} +
+ Browser notifications + +
Notification options -

Reply notifications ("Message posted")

+

Reply notifications ("Message posted")

Subscriptions notifications ("@user subscribed...")

+ checked="checked" {% endif %} /> Subscriptions notifications ("@user subscribed...")

Posts recommendations ("Recommended by @user")

-

+ checked="checked" {% endif %} /> Posts recommendations ("Recommended by @user")

+

- + Telegram {% if telegram_name is not empty %}
Telegram: {{ telegram_name }} — - - + +
{% else %} @@ -35,37 +41,41 @@ {% if jids | length > 0 %}
- + XMPP accounts

Your accounts:

{% for jid in jids %} -
+
{% endfor %} {% for auth in auths %} - + — Confirm
+ onclick="alert('To confirm, please send "AUTH {{ auth.getAuthCode() }}" (without quotes) from this account to "juick@juick.com".'); return false;">Confirm
{% endfor %}

{% if jids | length > 1 %} -

+

{% endif %} -

To add new jabber account: send any text message to juick@juick.com +

To add new jabber account: send any text message to juick@juick.com

{% endif %}
- + E-mail
-

Add account:
- - +

Add account:
+ +

@@ -73,40 +83,45 @@

Your accounts:

{% for email in emails %} -
+
{% endfor %} {% if emails is empty %} - -

+ - +

{% else %}

{% if jids | length > 1 %} -

+

{% endif %} {% endif %} {% if emails is not empty %}
-

You can receive notifications to email:
+

You can receive notifications to email:
Sent to - -

+ + +

{% endif %}

 

You can post to Juick via e-mail. Send your plain text - messages to juick@juick.com. You can attach one photo or video file.

+ messages to juick@juick.com. You can attach one photo or + video file.

- + Facebook {% if fbstatus.connected %} @@ -114,41 +129,43 @@
Facebook: Enabled — - - + +
{% else %}
Facebook: Disabled — - - + +
{% endif %} {% else %} -

Cross-posting to Facebook: Connect to Facebook

+

Cross-posting to Facebook: Connect to Facebook

{% endif %}
- - Twitter - {% if twitter_name is not empty %} -
-
Twitter: {{ twitter_name }} — - - -
-
- {% else %} -

Cross-posting to Twitter: Connect to Twitter

- {% endif %} + + Twitter + {% if twitter_name is not empty %} +
+
Twitter: {{ twitter_name }} — + + +
+
+ {% else %} +

Cross-posting to Twitter: Connect to Twitter

+ {% endif %}
{% endblock %} {% block "column" %} {% include "views/partial/settings_tabs" %} -{% endblock %} \ No newline at end of file +{% endblock %} -- cgit v1.2.3