Show More
@@ -1,47 +1,47 b'' | |||
|
1 | 1 | "use strict"; |
|
2 | 2 | |
|
3 | 3 | |
|
4 | 4 | function notifySystem(data) { |
|
5 | 5 | var notification = new Notification(data.message.level + ': ' + data.message.message); |
|
6 | 6 | }; |
|
7 | 7 | |
|
8 | 8 | function notifyToaster(data){ |
|
9 | 9 | var notifications = document.getElementById('notifications'); |
|
10 | 10 | notifications.push('toasts', |
|
11 | 11 | { level: data.message.level, |
|
12 | 12 | message: data.message.message |
|
13 | 13 | }); |
|
14 | 14 | notifications.open(); |
|
15 | 15 | } |
|
16 | 16 | |
|
17 | 17 | function handleNotifications(data) { |
|
18 |
if (!templateContext.rhodecode_user.notification_status && !data.message. |
|
|
18 | if (!templateContext.rhodecode_user.notification_status && !data.message.force) { | |
|
19 | 19 | // do not act if notifications are disabled |
|
20 | 20 | return |
|
21 | 21 | } |
|
22 | 22 | // use only js notifications for now |
|
23 | 23 | var onlyJS = true; |
|
24 | 24 | if (!("Notification" in window) || onlyJS) { |
|
25 | 25 | // use legacy notificartion |
|
26 | 26 | notifyToaster(data); |
|
27 | 27 | } |
|
28 | 28 | else { |
|
29 | 29 | // Let's check whether notification permissions have already been granted |
|
30 | 30 | if (Notification.permission === "granted") { |
|
31 | 31 | notifySystem(data); |
|
32 | 32 | } |
|
33 | 33 | // Otherwise, we need to ask the user for permission |
|
34 | 34 | else if (Notification.permission !== 'denied') { |
|
35 | 35 | Notification.requestPermission(function (permission) { |
|
36 | 36 | if (permission === "granted") { |
|
37 | 37 | notifySystem(data); |
|
38 | 38 | } |
|
39 | 39 | }); |
|
40 | 40 | } |
|
41 | 41 | else{ |
|
42 | 42 | notifyToaster(data); |
|
43 | 43 | } |
|
44 | 44 | } |
|
45 | 45 | }; |
|
46 | 46 | |
|
47 | 47 | $.Topic('/notifications').subscribe(handleNotifications); |
@@ -1,88 +1,88 b'' | |||
|
1 | 1 | <template is="dom-bind" id="notificationsPage"> |
|
2 | 2 | <iron-ajax id="toggleNotifications" |
|
3 | 3 | method="post" |
|
4 | 4 | url="${url('my_account_notifications_toggle_visibility')}" |
|
5 | 5 | content-type="application/json" |
|
6 | 6 | loading="{{changeNotificationsLoading}}" |
|
7 | 7 | on-response="handleNotifications" |
|
8 | 8 | handle-as="json"></iron-ajax> |
|
9 | 9 | |
|
10 | 10 | <div class="panel panel-default"> |
|
11 | 11 | <div class="panel-heading"> |
|
12 | 12 | <h3 class="panel-title">${_('Your Live Notification Settings')}</h3> |
|
13 | 13 | </div> |
|
14 | 14 | <div class="panel-body"> |
|
15 | 15 | |
|
16 | 16 | <p><strong>IMPORTANT:</strong> This feature requires enabled channelstream websocket server to function correctly.</p> |
|
17 | 17 | |
|
18 | 18 | <p class="hidden">Status of browser notifications permission: <strong id="browser-notification-status"></strong></p> |
|
19 | 19 | |
|
20 | 20 | <div class="form"> |
|
21 | 21 | <div class="fields"> |
|
22 | 22 | <div class="field"> |
|
23 | 23 | <div class="label"> |
|
24 | 24 | <label for="new_email">${_('Notifications Status')}:</label> |
|
25 | 25 | </div> |
|
26 | 26 | <div class="checkboxes"> |
|
27 | 27 | <rhodecode-toggle id="live-notifications" active="[[changeNotificationsLoading]]" on-change="toggleNotifications" ${'checked' if c.rhodecode_user.get_instance().user_data.get('notification_status') else ''}></rhodecode-toggle> |
|
28 | 28 | </div> |
|
29 | 29 | </div> |
|
30 | 30 | <div class="buttons"> |
|
31 | 31 | <a class="btn btn-default" id="test-notification">Test notification</a> |
|
32 | 32 | </div> |
|
33 | 33 | </div> |
|
34 | 34 | </div> |
|
35 | 35 | |
|
36 | 36 | </div> |
|
37 | 37 | </div> |
|
38 | 38 | |
|
39 | 39 | <script type="application/javascript"> |
|
40 | 40 | /** because im not creating a custom element for this page |
|
41 | 41 | * we need to push the function onto the dom-template |
|
42 | 42 | * ideally we turn this into notification-settings elements |
|
43 | 43 | * then it will be cleaner |
|
44 | 44 | */ |
|
45 | 45 | var ctrlr = $('#notificationsPage')[0]; |
|
46 | 46 | ctrlr.toggleNotifications = function(event){ |
|
47 | 47 | var ajax = $('#toggleNotifications')[0]; |
|
48 | 48 | ajax.headers = {"X-CSRF-Token": CSRF_TOKEN} |
|
49 | 49 | ajax.body = {notification_status:event.target.active}; |
|
50 | 50 | ajax.generateRequest(); |
|
51 | 51 | }; |
|
52 | 52 | ctrlr.handleNotifications = function(event){ |
|
53 | 53 | $('#live-notifications')[0].checked = event.detail.response; |
|
54 | 54 | }; |
|
55 | 55 | |
|
56 | 56 | function checkBrowserStatus(){ |
|
57 | 57 | var browserStatus = 'Unknown'; |
|
58 | 58 | |
|
59 | 59 | if (!("Notification" in window)) { |
|
60 | 60 | browserStatus = 'Not supported' |
|
61 | 61 | } |
|
62 | 62 | else if(Notification.permission === 'denied'){ |
|
63 | 63 | browserStatus = 'Denied'; |
|
64 | 64 | $('.flash_msg').append('<div class="alert alert-error">Notifications are blocked on browser level - you need to enable them in your browser settings.</div>') |
|
65 | 65 | } |
|
66 | 66 | else if(Notification.permission === 'granted'){ |
|
67 | 67 | browserStatus = 'Allowed'; |
|
68 | 68 | } |
|
69 | 69 | |
|
70 | 70 | $('#browser-notification-status').text(browserStatus); |
|
71 | 71 | }; |
|
72 | 72 | |
|
73 | 73 | checkBrowserStatus(); |
|
74 | 74 | |
|
75 | 75 | $('#test-notification').on('click', function(e){ |
|
76 | 76 | var levels = ['info', 'error', 'warning', 'success']; |
|
77 | 77 | var level = levels[Math.floor(Math.random()*levels.length)]; |
|
78 | 78 | var payload = { |
|
79 | 79 | message: { |
|
80 | 80 | message: 'This is a test notification.', |
|
81 | 81 | level: level, |
|
82 |
|
|
|
82 | force: true | |
|
83 | 83 | } |
|
84 | 84 | }; |
|
85 | 85 | $.Topic('/notifications').publish(payload); |
|
86 | 86 | }) |
|
87 | 87 | </script> |
|
88 | 88 | </template> |
General Comments 0
You need to be logged in to leave comments.
Login now