Skip to content
Snippets Groups Projects
Unverified Commit 059058d3 authored by Clément Aubin's avatar Clément Aubin
Browse files

XWIKI-14597: Add UI for "Location" and "Global Notification Preferences" 

in the Notification Center
* Improve UI to support new notification filter preferences
parent af933962
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
xwiki-platform-core/xwiki-platform-notifications/xwiki-platform-notifications-ui/src/main/resources/XWiki/Notifications/Code/Translations.xml
+ 2
− 2
View file @ 059058d3
......@@ -75,10 +75,10 @@
notifications.filters.preferences.addPreference.filterType.inclusive=Inclusive
notifications.filters.preferences.addPreference.filterType.exclusive=Exclusive
notifications.filters.preferences.addPreference.notificationFormat.label=Notification format
notifications.filters.preferences.addPreference.notificationFormat.hint=On which format of notification the filter should apply ?
notifications.filters.preferences.addPreference.eventType.label=Event Type
notifications.filters.preferences.addPreference.eventType.hint=Which event type should be targeted by the filter ?
notifications.filters.preferences.addPreference.location.label=Filter Scope
notifications.filters.preferences.addPreference.location.hint=Which document should be targeted by the filter ?
......
xwiki-platform-core/xwiki-platform-notifications/xwiki-platform-notifications-ui/src/main/resources/XWiki/Notifications/Code/XWikiUserNotificationsSheet.xml
+ 69
− 84
View file @ 059058d3
<?xml version="1.0" encoding="UTF-8"?>
<!--
* See the NOTICE file distributed with this work for additional
* information regarding copyright ownership.
......@@ -183,7 +184,7 @@
{{/html}}
)))
(% class="profile-section highlighted-profile-section" %)
(% class="profile-section highlighted-profile-section filterPreferences" %)
(((
{{html clean="false"}}
&lt;h2&gt;$escapetool.xml($services.localization.render('notifications.settings.filters.preferences.title'))&lt;/h2&gt;
......@@ -236,6 +237,16 @@
&lt;option value="exclusive"&gt;$escapetool.xml($services.localization.render('notifications.filters.preferences.addPreference.filterType.exclusive'))&lt;/option&gt;
&lt;/select&gt;
&lt;/dd&gt;
&lt;dt&gt;
&lt;label for="notificationFilterNotificationFormatSelector"&gt;$escapetool.xml($services.localization.render('notifications.filters.preferences.addPreference.notificationFormat.label'))&lt;/label&gt;
&lt;span class="xHint"&gt;$escapetool.xml($services.localization.render('notifications.filters.preferences.addPreference.notificationFormat.hint'))&lt;/span&gt;
&lt;/dt&gt;
&lt;dd&gt;
&lt;select id="notificationFilterNotificationFormatSelector" name="notificationFilterNotificationFormatSelector" size="2" multiple&gt;
&lt;option value="alert" selected="selected"&gt;$escapetool.xml($services.localization.render('notifications.format.alert'))&lt;/option&gt;
&lt;option value="email"&gt;$escapetool.xml($services.localization.render('notifications.format.email'))&lt;/option&gt;
&lt;/select&gt;
&lt;/dd&gt;
&lt;dt&gt;
&lt;label for="notificationFilterEventTypeSelector"&gt;$escapetool.xml($services.localization.render('notifications.filters.preferences.addPreference.eventType.label'))&lt;/label&gt;
&lt;span class="xHint"&gt;$escapetool.xml($services.localization.render('notifications.filters.preferences.addPreference.eventType.hint'))&lt;/span&gt;
......@@ -266,8 +277,8 @@
&lt;/form&gt;
&lt;/div&gt;
&lt;div class="modal-footer"&gt;
&lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;$services.localization.render('notifications.filters.cancel')&lt;/button&gt;
&lt;button type="button" class="btn btn-primary" disabled="disabled"&gt;$services.localization.render('notifications.filters.submit')&lt;/button&gt;
&lt;button type="button" class="btn btn-default" data-action="cancel" data-dismiss="modal"&gt;$services.localization.render('notifications.filters.cancel')&lt;/button&gt;
&lt;button type="button" class="btn btn-primary" data-action="submit" disabled="disabled"&gt;$services.localization.render('notifications.filters.submit')&lt;/button&gt;
&lt;/div&gt;
&lt;/div&gt;&lt;!-- /.modal-content --&gt;
&lt;/div&gt;&lt;!-- /.modal-dialog --&gt;
......@@ -435,7 +446,7 @@
/**
* Start the real script.
*/
require(['jquery', 'xwiki-meta', 'ApplicationWidget', 'AdvancedFilterPreferences', 'bootstrap', 'bootstrap-switch', 'xwiki-events-bridge'], function ($, xm, ApplicationWidget, AdvancedFilterPreferences) {
require(['jquery', 'xwiki-meta', 'ApplicationWidget', 'AdvancedFilterPreferences', 'AddNotificationFilterPreferenceLivetable', 'bootstrap', 'bootstrap-switch', 'xwiki-events-bridge'], function ($, xm, ApplicationWidget, AdvancedFilterPreferences, AddNotificationFilterPreferenceLivetable) {
/**
* Page initialization
......@@ -452,6 +463,8 @@
// Initialize the advanced filter preferences modal
new AdvancedFilterPreferences($('#modal-advanced-filters-preferences'));
new AddNotificationFilterPreferenceLivetable($('#modal-add-filter-preference'), $('#notificationFilterPreferencesLiveTable'), $('.filterPreferences button.btn-addfilter'));
/**
* Save the current settings
*/
......@@ -654,7 +667,7 @@
<cache>long</cache>
</property>
<property>
<code>define('EventTypeWidget', ['jquery', 'EventTypeFilter', 'xwiki-meta', 'bootstrap-switch'], function($, EventTypeFilter, xm) {
<code>define('EventTypeWidget', ['jquery', 'xwiki-meta', 'bootstrap-switch'], function($, xm) {
/**
* Construct an EventTypeWidget.
*/
......@@ -669,8 +682,6 @@
self.switchEmail = self.cellEmail.find('.notificationTypeCheckbox');
self.alertObjectNumber = self.cellAlert.attr('data-objnumber');
self.emailObjectNumber = self.cellEmail.attr('data-objnumber');
self.filterAlert = new EventTypeFilter(self, 'alert');
self.filterEmail = new EventTypeFilter(self, 'email');
/**
* Initialization
......@@ -683,20 +694,6 @@
size: 'mini',
labelText: '$escapetool.javascript($services.icon.renderHTML("bell"))'
});
// On change
$(self.switchAlert).on('switchChange.bootstrapSwitch', function(event, state) {
self.application.updateSwitches();
self.filterAlert.setState(state);
setTimeout(function() { self.save('alert', state); }, 1);
});
$(self.switchEmail).on('switchChange.bootstrapSwitch', function(event, state) {
self.application.updateSwitches();
self.filterEmail.setState(state);
setTimeout(function() { self.save('email', state); }, 1);
});
// Set event filter widget state
self.filterAlert.setState(self.getAlertState());
self.filterEmail.setState(self.getEmailState());
};
/**
......@@ -1055,96 +1052,84 @@
<cache>long</cache>
</property>
<property>
<code>define('EventTypeFilter', ['jquery', 'xwiki-meta', 'bootstrap', 'bootstrap-switch'], function($, xm) {
/**
* Construct an event type filter
*/
return function(eventTypeWidget, format) {
var self = this;
self.eventTypeWidget = eventTypeWidget;
self.format = format;
self.cell = self.eventTypeWidget.domElement.find('.notificationTypeCell[data-format="'+format+'"]');
self.filterType = self.cell.attr('data-filter');
self.container = self.cell.find('.notificationPreferenceScopeContainer');
self.button = self.container.find('.filterButton');
self.buttonAddFilter = self.container.find('.btn-addfilter');
self.livetableModal = self.container.find('&gt; #modal-' + self.eventTypeWidget.eventType + '-' + self.format);
self.pickerModal = self.container.find('&gt; #modal-add-filter-scope-' + self.eventTypeWidget.eventType + '-' + self.format);
self.filterTypeSelector = self.container.find('#notificationFilterTypeSelector-' + self.eventTypeWidget.eventType + '-' + self.format);
<code>define('AddNotificationFilterPreferenceLivetable', ['jquery', 'xwiki-meta', 'bootstrap'], function($, xm) {
return function(modal, filterPreferencesLivetable, buttonAddFilter) {
var self = this;
self.modal = modal;
self.filterPreferencesLivetable = filterPreferencesLivetable;
self.buttonAddFilter = buttonAddFilter;
self.filterTypeSelector = modal.find('select#notificationFilterTypeSelector');
self.eventTypeSelector = modal.find('select#notificationFilterEventTypeSelector');
self.notificationFormatSelector = modal.find('select#notificationFilterNotificationFormatSelector');
self.filterScopeTree = modal.find('.location-tree');
self.cancelButton = modal.find('button[data-action="cancel"]');
self.submitButton = modal.find('button[data-action="submit"]');
/**
* Initialization
*/
self.init = function () {
// Open the location picker
self.buttonAddFilter.click(function() {
self.pickerModal.modal('show');
self.pickerModal.find('.location-tree').xtree();
self.pickerModal.find('.modal-footer button.btn-primary').each(function() {
$(this).prop('disabled', 'disabled');
self.filterScopeTree.xtree();
self.submitButton.prop('disabled', 'disabled');
self.filterScopeTree.on('changed.jstree', function(e, data) {
if (data.selected.length &gt; 0) {
self.submitButton.prop('disabled', '');
}
});
});
// Enable the "select" button when a selection is made on the tree.
self.pickerModal.find('.location-tree').on('changed.jstree', function(e, data) {
if (data.selected.length &gt; 0) {
self.pickerModal.find('.modal-footer button.btn-primary').prop('disabled', '');
}
});
// Callback called when the "select" button is clicked
self.pickerModal.find('.modal-footer button.btn-primary').click(self.onSelectButtonClicked);
};
/**
* Set the button is clickable or not
*/
self.setState = function (state) {
self.button.css('pointer-events', state ? 'auto' : 'none').css('opacity', state ? 1.0 : 0.4);
self.submitButton.click(self.onSelectButtonClicked);
};
/**
* On "select" button clicked
* On "submit" button clicked
*/
self.onSelectButtonClicked = function() {
self.pickerModal.modal('hide');
var tree = $.jstree.reference(self.pickerModal.find('.location-tree'));
self.modal.hide();
var tree = $.jstree.reference(self.filterScopeTree);
var nodes = tree.get_selected(true);
for (var i = 0; i &lt; nodes.length; ++i) {
var node = nodes[i];
var scopeType = 'pageOnly';
var reference = node.data.id;
var scopeFilterType = self.filterTypeSelector.find('option:selected').val();
var filterType = self.filterTypeSelector.find('option:selected').val();
var notificationFormats = self.notificationFormatSelector.find('option:selected').val();
var eventTypes = self.eventTypeSelector.find('option:selected').val();
var payload = {
'className': 'XWiki.Notifications.Code.NotificationFilterPreferenceClass',
'property#filterName': 'scopeNotificationFilter',
'property#filterPreferenceName': Date.now(),
'property#isEnabled': 1,
'property#filterType': filterType,
'property#filterFormats': notificationFormats.toString(),
'property#eventTypes': eventTypes.toString()
};
if (node.data.type == 'wiki') {
scopeType = 'wiki';
payload['property#wikis'] = reference;
} else if (node.data.type == 'document' &amp;&amp; node.data.id.match('WebHome$')) {
scopeType = 'pageAndChildren';
// Remove the "WebHome" part to match the space instead of the document
reference = reference.substring(0, reference.length - '.WebHome'.length);
}
// Don't save a preference scope if we expect to have a wiki and the selected data is a page
if (self.filterType == 'WIKI_FILTER' &amp;&amp; scopeType != 'wiki') {
// TODO: would be even better if the picker was not suggesting pages...
new XWiki.widgets.Notification("$escapetool.javascript($services.localization.render('notifications.settings.errorFilterWiki'))", 'error');
continue;
payload['property#spaces'] = reference.substring(0, reference.length - '.WebHome'.length);
} else {
payload['property#pages'] = reference;
}
// Saving
var notification = new XWiki.widgets.Notification("$escapetool.javascript($services.localization.render('notifications.settings.saving'))", 'inprogress');
var restURL = xm.restURL + '/objects?media=json';
$.post(restURL, {
'className': 'XWiki.Notifications.Code.NotificationPreferenceScopeClass',
'property#eventType': self.eventTypeWidget.eventType,
'property#scopeReference': reference,
'property#scope': scopeType,
'property#format': self.format,
'property#scopeFilterType': scopeFilterType
}).done(function (data) {
$.post(restURL, payload).done(function (data) {
notification.hide();
new XWiki.widgets.Notification("$escapetool.javascript($services.localization.render('notifications.settings.saved'))", 'done');
// Reload the livetable
window['livetable_' + self.container.find('.xwiki-livetable').attr('id')].refresh();
// Update the filter count
var filter = self.container.find('.notificationPreferenceScopeCount');
var filterValue = parseInt(filter.text());
filter.text(filterValue + 1);
filterPreferencesLivetable.refresh();
}).fail(function () {
notification.hide();
new XWiki.widgets.Notification("$escapetool.javascript($services.localization.render('notifications.settings.savingfailed'))", 'error');
......@@ -1160,7 +1145,7 @@
</code>
</property>
<property>
<name>Event Type Filter</name>
<name>Add Notification Filter Preference Livetable</name>
</property>
<property>
<parse>1</parse>
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment