users: Move JS for push notifications into the main file

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/Makefile.am b/Makefile.am
index 3aedefa79c5b3f2fcd8d8ff8deefa8a6808618d3..3a3a1b28f84ae1eb9f0f1ba8e5b0b329b27f9e65 100644 (file)
--- a/Makefile.am
+++ b/Makefile.am
@@ -325,11 +325,6 @@ dist_templates_users_messages_DATA = \
 
 templates_users_messagesdir = $(templates_usersdir)/messages
 
-dist_templates_users_modules_DATA = \
-       src/templates/users/modules/push-subscribe-button.html
-
-templates_users_modulesdir = $(templates_usersdir)/modules
-
 # ------------------------------------------------------------------------------
 #
 dist_static_DATA = \
@@ -356,8 +351,7 @@ static_js_DATA = \
        src/static/js/jquery.min.js \
        src/static/js/job-log-stream.min.js \
        src/static/js/notification-worker.min.js \
-       src/static/js/pbs.min.js \
-       src/static/js/user-push-subscribe-button.min.js
+       src/static/js/pbs.min.js
 
 static_jsdir = $(staticdir)/js
 
@@ -365,8 +359,7 @@ EXTRA_DIST += \
        src/static/js/builders-stats.js \
        src/static/js/job-log-stream.js \
        src/static/js/notification-worker.js \
-       src/static/js/pbs.js \
-       src/static/js/user-push-subscribe-button.js
+       src/static/js/pbs.js
 
 CLEANFILES += \
        $(static_js_DATA)

diff --git a/src/static/js/pbs.js b/src/static/js/pbs.js
index f368262e1bf20946d8b2b603e95347611cba35a3..772d1cb2e0b26b2602051c80137e67bf3d8a250c 100644 (file)
--- a/src/static/js/pbs.js
+++ b/src/static/js/pbs.js
@@ -65,3 +65,72 @@ document.addEventListener('keydown', function(e) {
                closeDropdowns();
        }
 });
+
+/*
+ * Push Subscriptions
+ *
+ * Request permission when the button is being clicked
+ */
+
+// Check if the browser supports notifications
+$(function() {
+       // Nothing to do if the browser supports notifications
+       if ("serviceWorker" in navigator && "PushManager" in window)
+               return;
+
+       // If not, we will disable the button
+       $("#push-subscribe-button").prop("disabled", true);
+});
+
+// Handle button click
+$("#push-subscribe-button").on("click", function() {
+       console.debug("Subscribe button clicked!");
+
+       // Fetch our application server key
+       const application_server_key = $(this).data("application-server-key");
+
+       // Request permission from the user
+       const request = new Promise(function (resolve, reject) {
+               const result = Notification.requestPermission(function (result) {
+                       resolve(result);
+               });
+
+               if (result) {
+                       result.then(resolve, reject);
+               }
+       }).then(function (result) {
+               if (result !== 'granted') {
+                       throw new Error("We weren't granted permission.");
+               }
+       });
+
+       // Show some activity
+       $(this).addClass("is-loading");
+
+       // Register our service worker
+       var registration = navigator.serviceWorker.register("/static/js/notification-worker.min.js");
+
+       // Register with the push service
+       registration = registration.then(function (registration) {
+               return registration.pushManager.subscribe({
+                       userVisibleOnly: true,
+                       applicationServerKey: application_server_key,
+               });
+       })
+
+       // Fetch the PushSubscription
+       const subscription = registration.then(function (subscription) {
+               console.debug("Received PushSubscription: ", JSON.stringify(subscription));
+
+               // Send the PushSubscription to our server
+               $.post({
+                       "url" : "/users/push/subscribe",
+
+                       // Payload
+                       "contentType" : "application/json",
+                       "data" : JSON.stringify(subscription),
+               });
+
+               return subscription;
+    });
+});

diff --git a/src/static/js/user-push-subscribe-button.js b/src/static/js/user-push-subscribe-button.js
deleted file mode 100644 (file)
index c17829c..0000000
--- a/src/static/js/user-push-subscribe-button.js
+++ /dev/null
@@ -1,67 +0,0 @@
-/*
- * Request permission when the button is being clicked
- */
-
-// Check if the browser supports notifications
-$(function() {
-       // Nothing to do if the browser supports notifications
-       if ("serviceWorker" in navigator && "PushManager" in window)
-               return;
-
-       // If not, we will disable the button
-       $("#push-subscribe-button").prop("disabled", true);
-});
-
-// Handle button click
-$("#push-subscribe-button").on("click", function() {
-       console.debug("Subscribe button clicked!");
-
-       // Fetch our application server key
-       const application_server_key = $(this).data("application-server-key");
-
-       // Request permission from the user
-       const request = new Promise(function (resolve, reject) {
-               const result = Notification.requestPermission(function (result) {
-                       resolve(result);
-               });
-
-               if (result) {
-                       result.then(resolve, reject);
-               }
-       }).then(function (result) {
-               if (result !== 'granted') {
-                       throw new Error("We weren't granted permission.");
-               }
-       });
-
-       // Show some activity
-       $(this).addClass("is-loading");
-
-       // Register our service worker
-       var registration = navigator.serviceWorker.register("/static/js/notification-worker.min.js");
-
-       // Register with the push service
-       registration = registration.then(function (registration) {
-               return registration.pushManager.subscribe({
-                       userVisibleOnly: true,
-                       applicationServerKey: application_server_key,
-               });
-       })
-
-       // Fetch the PushSubscription
-       const subscription = registration.then(function (subscription) {
-               console.debug("Received PushSubscription: ", JSON.stringify(subscription));
-
-               // Send the PushSubscription to our server
-               $.post({
-                       "url" : "/users/push/subscribe",
-
-                       // Payload
-                       "contentType" : "application/json",
-                       "data" : JSON.stringify(subscription),
-               });
-
-               return subscription;
-    });
-});
-

diff --git a/src/templates/users/macros.html b/src/templates/users/macros.html
index 6c5b6db77f00c6ddf9cc41927c4d08809e876c6d..72d207c4209564d587e82fca9ee0777d97e339b4 100644 (file)
--- a/src/templates/users/macros.html
+++ b/src/templates/users/macros.html
@@ -110,3 +110,13 @@
                </div>
        {% endfor %}
 {% endmacro %}
+
+{% macro UserPushSubscribeButton() %}
+       {# Application Server Key #}
+       {% set application_server_key = backend.users.get_application_server_key() %}
+
+       <button id="push-subscribe-button" class="button is-primary is-fullwidth"
+                               data-application-server-key="{{ application_server_key }}">
+               {{ _("Subscribe") }}
+       </button>
+{% endmacro %}

diff --git a/src/templates/users/modules/push-subscribe-button.html b/src/templates/users/modules/push-subscribe-button.html
deleted file mode 100644 (file)
index e0ea53e..0000000
--- a/src/templates/users/modules/push-subscribe-button.html
+++ /dev/null
@@ -1,4 +0,0 @@
-<button id="push-subscribe-button" class="button is-primary is-fullwidth"
-                       data-application-server-key="{{ application_server_key }}">
-       {{ _("Subscribe") }}
-</button>

diff --git a/src/templates/users/subscribe.html b/src/templates/users/subscribe.html
index 60488dcec56ee2717c91b274cf7dc9cf1ee0f1c0..98f5aecfcb265ec254d58843a4f52844bfc767d8 100644 (file)
--- a/src/templates/users/subscribe.html
+++ b/src/templates/users/subscribe.html
@@ -1,6 +1,8 @@
-{% extends "../modal.html" %}
+{% extends "modal.html" %}
 
-{% block title %}{{ _("Subscribe To Push Notifications") }}{% end block %}
+{% from "users/macros.html" import UserPushSubscribeButton with context %}
+
+{% block title %}{{ _("Subscribe To Push Notifications") }}{% endblock %}
 
 {% block breadcrumbs %}
        <nav class="breadcrumb" aria-label="breadcrumbs">
@@ -18,14 +20,14 @@
                        </li>
                </ul>
        </nav>
-{% end block %}
+{% endblock %}
 
 {% block modal_title %}
        <h4 class="title is-4">{{ _("Subscribe To Push Notifications") }}</h4>
-{% end block %}
+{% endblock %}
 
 {% block modal %}
-       {% raw xsrf_form_html() %}
+       {{ xsrf_form_html() | safe }}
 
        <div class="content">
                <p>
@@ -35,6 +37,6 @@
 
        {# Submit! #}
        <div class="field">
-               {% module UserPushSubscribeButton() %}
+               {{ UserPushSubscribeButton() }}
        </div>
-{% end block %}
+{% endblock %}

diff --git a/src/web/users.py b/src/web/users.py
index d42d3c5dd5da84168094c09a6ec3ff2d73e2f96b..0027e7e7afc53c5355451e88d6c2825db3b7aa3f 100644 (file)
--- a/src/web/users.py
+++ b/src/web/users.py
@@ -126,17 +126,3 @@ class PushSubscribeHandler(base.BaseHandler):
                # Send empty response
                self.set_status(204)
                self.finish()
-
-
-#class PushSubscribeButton(ui_modules.UIModule):
-#      def render(self):
-#              # Fetch the application server key
-#              application_server_key = self.backend.users.application_server_key
-#
-#              return self.render_string("users/modules/push-subscribe-button.html",
-#                      application_server_key=application_server_key)
-#
-#      def javascript_files(self):
-#              return (
-#                      "js/user-push-subscribe-button.min.js",
-#              )