diff --git a/app/assets/stylesheets/buttons.scss b/app/assets/stylesheets/buttons.scss index a5b28b3ed3e3e408b73673b0a63a82e7e4a7a276..eaa03d40d75806ba93a8107a0b5b003cbd47af6e 100644 --- a/app/assets/stylesheets/buttons.scss +++ b/app/assets/stylesheets/buttons.scss @@ -24,3 +24,11 @@ transition: all 1s ease-in-out; color: #00FFFF; } + + .webpush-button { + width: 150px; + } + + .webpush-unsubscribe-button { + width: 150px; + } diff --git a/app/views/devise/registrations/edit.html.erb b/app/views/devise/registrations/edit.html.erb index f94b081d95e8cc1636103d84490836cf8427262e..a1f1d6059572922ff5e40c18708b6c69f5a76a83 100644 --- a/app/views/devise/registrations/edit.html.erb +++ b/app/views/devise/registrations/edit.html.erb @@ -43,10 +43,54 @@ </div> <% end %> - <h3>Cancel my account</h3> - - <p>Unhappy? <%= button_to "Cancel my account", registration_path(resource_name), data: { confirm: "Are you sure?" }, method: :delete %></p> + <%= button_to t('.cancel_account'), registration_path(resource_name), data: { confirm: "Are you sure?" }, :class => "btn float-left habit-back-btn", method: :delete %> + <button class="btn float-left btn-info btn-md webpush-button mt-5"> <%= t('.push_me')%> </button> + <button class="btn float-left btn-info btn-md webpush-unsubscribe-button mt-1"> <%= t('.unsubscribe') %> </button> </div> </div> </div> </div> + <script> + // deletes subscription if button is pressed, + // atm user also needs to revoke permission, + // not sure if this is a bug + $(".webpush-unsubscribe-button").on("click", e => { + navigator.serviceWorker.ready + .then((serviceWorkerRegistration) => { + serviceWorkerRegistration.pushManager.getSubscription() + .then((subscription) => { + if (!subscription) { + console.log("Not subscribed, nothing to do."); + return; + } + + subscription.unsubscribe() + .then(function() { + console.log("Successfully unsubscribed!."); + }) + .catch((e) => { + logger.error('Error thrown while unsubscribing from push messaging', e); + }); + }); + }); + }); + + // utility function for debugging purposes + async function showWebPushData() { + const data = await getWebPushData() + if (data) { + console.log(data) + } + } + + // shows a basic notification on button press + $(".webpush-button").on("click", (e) => { + navigator.serviceWorker.ready + .then((serviceWorkerRegistration) => { + serviceWorkerRegistration.pushManager.getSubscription() + .then((subscription) => { + $.post("/api/v1/habits/push_notification", { subscription: subscription.toJSON(), message: "You clicked a button!" }); + }); + }); + }); + </script> diff --git a/app/views/home/home.html.erb b/app/views/home/home.html.erb index d91ff833a63da5b42640df9f2fd72c7ac840967a..5e349a9038901717313984bb2b6da17687e2e381 100644 --- a/app/views/home/home.html.erb +++ b/app/views/home/home.html.erb @@ -1,6 +1,4 @@ <%=button_to t('.action_create'), new_habit_path, method: :get, class:"btn btn-info btn-lg" %> -<button class="btn btn-info btn-md webpush-button"> Push me </button> -<button class="btn btn-info btn-md webpush-unsubscribe-button"> Unsubscribe </button> <!--Inspirational Quotes: https://type.fit/api/quotes Inspirational Dogs: https://dog.ceo/dog-api/--> <div class="d-flex justify-content-center"> @@ -40,49 +38,4 @@ <% end %> <%= javascript_pack_tag 'react_habitCard' %> <%end%> - - <script> - // deletes subscription if button is pressed, - // atm user also needs to revoke permission, - // not sure if this is a bug - $(".webpush-unsubscribe-button").on("click", e => { - navigator.serviceWorker.ready - .then((serviceWorkerRegistration) => { - serviceWorkerRegistration.pushManager.getSubscription() - .then((subscription) => { - if (!subscription) { - console.log("Not subscribed, nothing to do."); - return; - } - - subscription.unsubscribe() - .then(function() { - console.log("Successfully unsubscribed!."); - }) - .catch((e) => { - logger.error('Error thrown while unsubscribing from push messaging', e); - }); - }); - }); - }); - - // utility function for debugging purposes - async function showWebPushData() { - const data = await getWebPushData() - if (data) { - console.log(data) - } - } - - // shows a basic notification on button press - $(".webpush-button").on("click", (e) => { - navigator.serviceWorker.ready - .then((serviceWorkerRegistration) => { - serviceWorkerRegistration.pushManager.getSubscription() - .then((subscription) => { - $.post("/api/v1/habits/push_notification", { subscription: subscription.toJSON(), message: "You clicked a button!" }); - }); - }); - }); - </script> -</div> \ No newline at end of file +</div> diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb index 31a73d4e0814f74726948617133ab7ba2dd7eafa..506b2064ec7603f83632a324865a3ef220299a48 100644 --- a/app/views/layouts/application.html.erb +++ b/app/views/layouts/application.html.erb @@ -3,6 +3,7 @@ <head> <script> window.vapidPublicKey = new Uint8Array(<%= @decodedVapidPublicKey %>); + console.log(window.vapidPublicKey) </script> <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1" /> <title><%=t('app_title') %></title>