##// END OF EJS Templates
notifications: replace toggle button with actual toggle element - fixes #4171
ergo -
r692:cea437a2 default
parent child Browse files
Show More
@@ -368,4 +368,4 b' class MyAccountController(BaseController'
368 368 user_data['notification_status'] = not status
369 369 user.user_data = user_data
370 370 Session().commit()
371 return redirect(url('my_account_notifications'))
371 return json.dumps(user_data['notification_status'])
@@ -2,3 +2,5 b''
2 2 <link rel="import" href="../../../../../bower_components/paper-toast/paper-toast.html">
3 3 <link rel="import" href="../../../../../bower_components/paper-tooltip/paper-tooltip.html">
4 4 <link rel="import" href="../../../../../bower_components/paper-button/paper-button.html">
5 <link rel="import" href="../../../../../bower_components/paper-spinner/paper-spinner.html">
6 <link rel="import" href="../../../../../bower_components/iron-ajax/iron-ajax.html">
@@ -1,26 +1,65 b''
1 <template is="dom-bind" id="notificationsPage">
2
3 <iron-ajax id="toggleNotifications"
4 method="post"
5 url="${url('my_account_notifications_toggle_visibility')}"
6 content-type="application/json"
7 loading="{{changeNotificationsLoading}}"
8 on-response="handleNotifications"
9 handle-as="json"></iron-ajax>
10
1 11 <div class="panel panel-default">
2 12 <div class="panel-heading">
3 13 <h3 class="panel-title">${_('Your live notification settings')}</h3>
4 14 </div>
5
6 15 <div class="panel-body">
7 16
8 17 <p><strong>IMPORTANT:</strong> This feature requires enabled channelstream websocket server to function correctly.</p>
9 18
10 19 <p class="hidden">Status of browser notifications permission: <strong id="browser-notification-status"></strong></p>
11 20
12 ${h.secure_form(url('my_account_notifications_toggle_visibility'), method='post', id='notification-status')}
13 <button class="btn btn-default" type="submit">
14 ${_('Notifications')} <strong>${_('Enabled') if c.rhodecode_user.get_instance().user_data.get('notification_status') else _('Disabled')}</strong>
15 </button>
16 ${h.end_form()}
17
21 <div class="form">
22 <!-- fields -->
23 <div class="fields">
24 <div class="field">
25 <div class="label">
26 <label for="new_email">${_('Notifications status')}:</label>
27 </div>
28 <div class="checkboxes">
29 <div style="display: inline-block">
30 <paper-toggle-button on-change="toggleNotifications" ${'checked' if c.rhodecode_user.get_instance().user_data.get('notification_status') else ''}></paper-toggle-button>
31 <paper-tooltip>Toggle your notifications on/off globally.</paper-tooltip>
32 </div>
33 <template is="dom-if" if="{{changeNotificationsLoading}}">
34 <paper-spinner active style="height: 22px; width: 22px"></paper-spinner>
35 </template>
36 </div>
37 </div>
38 <div class="buttons">
18 39 <a class="btn btn-info" id="test-notification">Test notification</a>
40 </div>
41 </div>
42 </div>
19 43
20 44 </div>
21 45 </div>
22 46
23 47 <script type="application/javascript">
48 /** because im not creating a custom element for this page
49 * we need to push the function onto the dom-template
50 * ideally we turn this into notification-settings elements
51 * then it will be cleaner
52 */
53 var ctrlr = $('#notificationsPage')[0];
54 ctrlr.toggleNotifications = function(event){
55 var ajax = $('#toggleNotifications')[0];
56 ajax.headers = {"X-CSRF-Token": CSRF_TOKEN}
57 ajax.body = {notification_status:event.target.active};
58 ajax.generateRequest();
59 };
60 ctrlr.handleNotifications = function(event){
61 $('paper-toggle-button')[0].active = event.detail.response;
62 };
24 63
25 64 function checkBrowserStatus(){
26 65 var browserStatus = 'Unknown';
@@ -54,3 +93,4 b''
54 93 $.Topic('/notifications').publish(payload);
55 94 })
56 95 </script>
96 </template>
General Comments 0
You need to be logged in to leave comments. Login now