- OS notifications (e.g. rally poke messages) can now be clicked at. -> opens browser at linked map and system, #682

This commit is contained in:
Mark Friedrich
2018-09-06 23:38:41 +02:00
parent f25b22dc60
commit 435a0cd9ee
9 changed files with 190 additions and 16 deletions

View File

@@ -71,7 +71,7 @@ requirejs.config({
'datatables.plugins.render.ellipsis': 'lib/datatables/plugins/render/ellipsis',
// notification plugin
pnotify: 'lib/pnotify/pnotify', // v3.2.0 PNotify - notification core file - https://sciactive.com/pnotify/
pnotify: 'lib/pnotify/pnotify', // v3.2.1 PNotify - notification core file - https://sciactive.com/pnotify/
'pnotify.buttons': 'lib/pnotify/pnotify.buttons', // PNotify - buttons notification extension
'pnotify.confirm': 'lib/pnotify/pnotify.confirm', // PNotify - confirmation notification extension
'pnotify.nonblock': 'lib/pnotify/pnotify.nonblock', // PNotify - notification non-block extension (hover effect)

View File

@@ -1208,8 +1208,8 @@ define([
let defaultOptions = {
poke: false,
hideNotification: false,
hideCounter: false,
hideNotification: false, // do not show notification
hideCounter: false // do not start map update counter
};
options = $.extend({}, defaultOptions, options);
@@ -1269,7 +1269,11 @@ define([
storeLocalData('map', this.mapId, 'rallyPoke', rallyPokeData);
notificationOptions.type = 'info';
Util.showNotify(notificationOptions, {desktop: true, stack: 'barBottom'});
Util.showNotify(notificationOptions, {
desktop: true,
stack: 'barBottom',
click: e => {window.location.href = getMapDeeplinkUrl(mapId, systemId);}
});
}
}.bind({
mapId: mapId,

View File

@@ -88,6 +88,7 @@ define([
PNotify.desktop.permission();
customConfig.delay = 10000;
customConfig.nonblock.nonblock = false; // true results in error on "click" desktop notification
customConfig.desktop.desktop = true;
// make browser tab blink
@@ -132,7 +133,16 @@ define([
customConfig.icon = false;
}
new PNotify(customConfig);
let notify = new PNotify(customConfig);
if(
settings &&
settings.click
){
// set onclick for notification
notify.get().on('click', settings.click);
}
};
/**

View File

@@ -1301,11 +1301,11 @@ define([
/**
* trigger a notification (on screen or desktop)
* @param customConfig
* @param desktop
* @param settings
*/
let showNotify = (customConfig, desktop) => {
let showNotify = (customConfig, settings) => {
requirejs(['notification'], Notification => {
Notification.showNotify(customConfig, desktop);
Notification.showNotify(customConfig, settings);
});
};

View File

@@ -71,7 +71,7 @@ requirejs.config({
'datatables.plugins.render.ellipsis': 'lib/datatables/plugins/render/ellipsis',
// notification plugin
pnotify: 'lib/pnotify/pnotify', // v3.2.0 PNotify - notification core file - https://sciactive.com/pnotify/
pnotify: 'lib/pnotify/pnotify', // v3.2.1 PNotify - notification core file - https://sciactive.com/pnotify/
'pnotify.buttons': 'lib/pnotify/pnotify.buttons', // PNotify - buttons notification extension
'pnotify.confirm': 'lib/pnotify/pnotify.confirm', // PNotify - confirmation notification extension
'pnotify.nonblock': 'lib/pnotify/pnotify.nonblock', // PNotify - notification non-block extension (hover effect)

View File

@@ -1208,8 +1208,8 @@ define([
let defaultOptions = {
poke: false,
hideNotification: false,
hideCounter: false,
hideNotification: false, // do not show notification
hideCounter: false // do not start map update counter
};
options = $.extend({}, defaultOptions, options);
@@ -1269,7 +1269,11 @@ define([
storeLocalData('map', this.mapId, 'rallyPoke', rallyPokeData);
notificationOptions.type = 'info';
Util.showNotify(notificationOptions, {desktop: true, stack: 'barBottom'});
Util.showNotify(notificationOptions, {
desktop: true,
stack: 'barBottom',
click: e => {window.location.href = getMapDeeplinkUrl(mapId, systemId);}
});
}
}.bind({
mapId: mapId,

View File

@@ -88,6 +88,7 @@ define([
PNotify.desktop.permission();
customConfig.delay = 10000;
customConfig.nonblock.nonblock = false; // true results in error on "click" desktop notification
customConfig.desktop.desktop = true;
// make browser tab blink
@@ -132,7 +133,16 @@ define([
customConfig.icon = false;
}
new PNotify(customConfig);
let notify = new PNotify(customConfig);
if(
settings &&
settings.click
){
// set onclick for notification
notify.get().on('click', settings.click);
}
};
/**

View File

@@ -1301,11 +1301,11 @@ define([
/**
* trigger a notification (on screen or desktop)
* @param customConfig
* @param desktop
* @param settings
*/
let showNotify = (customConfig, desktop) => {
let showNotify = (customConfig, settings) => {
requirejs(['notification'], Notification => {
Notification.showNotify(customConfig, desktop);
Notification.showNotify(customConfig, settings);
});
};

View File

@@ -0,0 +1,146 @@
// Confirm
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as a module.
define('pnotify.confirm', ['jquery', 'pnotify'], factory);
} else if (typeof exports === 'object' && typeof module !== 'undefined') {
// CommonJS
module.exports = factory(require('jquery'), require('./pnotify'));
} else {
// Browser globals
factory(root.jQuery, root.PNotify);
}
}(typeof window !== "undefined" ? window : this, function($, PNotify){
PNotify.prototype.options.confirm = {
// Make a confirmation box.
confirm: false,
// Make a prompt.
prompt: false,
// Classes to add to the input element of the prompt.
prompt_class: "",
// The default value of the prompt.
prompt_default: "",
// Whether the prompt should accept multiple lines of text.
prompt_multi_line: false,
// Where to align the buttons. (right, center, left, justify)
align: "right",
// The buttons to display, and their callbacks.
buttons: [
{
text: "Ok",
addClass: "",
// Whether to trigger this button when the user hits enter in a single line prompt.
promptTrigger: true,
click: function(notice, value){
notice.remove();
notice.get().trigger("pnotify.confirm", [notice, value]);
}
},
{
text: "Cancel",
addClass: "",
click: function(notice){
notice.remove();
notice.get().trigger("pnotify.cancel", notice);
}
}
]
};
PNotify.prototype.modules.confirm = {
init: function(notice, options){
// The div that contains the buttons.
this.container = $('<div class="ui-pnotify-action-bar" style="margin-top:5px;clear:both;" />').css('text-align', options.align).appendTo(notice.container);
if (options.confirm || options.prompt)
this.makeDialog(notice, options);
else
this.container.hide();
},
update: function(notice, options){
if (options.confirm) {
this.makeDialog(notice, options);
this.container.show();
} else {
this.container.hide().empty();
}
},
afterOpen: function(notice, options){
if (options.prompt) {
this.prompt.focus();
}
},
makeDialog: function(notice, options) {
var already = false, that = this, btn, elem;
this.container.empty();
if (options.prompt) {
// The input element of a prompt.
this.prompt = $('<'+(options.prompt_multi_line ? 'textarea rows="5"' : 'input type="text"')+' style="margin-bottom:5px;clear:both;" />')
.addClass((typeof notice.styles.input === "undefined" ? "" : notice.styles.input)+" "+(typeof options.prompt_class === "undefined" ? "" : options.prompt_class))
.val(options.prompt_default)
.appendTo(this.container);
}
var customButtons = (options.buttons[0] && options.buttons[0] !== PNotify.prototype.options.confirm.buttons[0]);
for (var i = 0; i < options.buttons.length; i++) {
if (options.buttons[i] === null || (customButtons && PNotify.prototype.options.confirm.buttons[i] && PNotify.prototype.options.confirm.buttons[i] === options.buttons[i])) {
continue;
}
btn = options.buttons[i];
if (already) {
this.container.append(' ');
} else {
already = true;
}
elem = $('<button type="button" class="ui-pnotify-action-button" />')
.addClass((typeof notice.styles.btn === "undefined" ? "" : notice.styles.btn)+" "+(typeof btn.addClass === "undefined" ? "" : btn.addClass))
.text(btn.text)
.appendTo(this.container)
.on("click", (function(btn){ return function(){
if (typeof btn.click == "function") {
btn.click(notice, options.prompt ? that.prompt.val() : null);
}
}})(btn));
if (options.prompt && !options.prompt_multi_line && btn.promptTrigger)
this.prompt.keypress((function(elem){ return function(e){
if (e.keyCode == 13)
elem.click();
}})(elem));
if (notice.styles.text) {
elem.wrapInner('<span class="'+notice.styles.text+'"></span>');
}
if (notice.styles.btnhover) {
elem.hover((function(elem){ return function(){
elem.addClass(notice.styles.btnhover);
}})(elem), (function(elem){ return function(){
elem.removeClass(notice.styles.btnhover);
}})(elem));
}
if (notice.styles.btnactive) {
elem.on("mousedown", (function(elem){ return function(){
elem.addClass(notice.styles.btnactive);
}})(elem)).on("mouseup", (function(elem){ return function(){
elem.removeClass(notice.styles.btnactive);
}})(elem));
}
if (notice.styles.btnfocus) {
elem.on("focus", (function(elem){ return function(){
elem.addClass(notice.styles.btnfocus);
}})(elem)).on("blur", (function(elem){ return function(){
elem.removeClass(notice.styles.btnfocus);
}})(elem));
}
}
}
};
$.extend(PNotify.styling.bootstrap3, {
btn: "btn btn-default",
input: "form-control"
});
$.extend(PNotify.styling.fontawesome, {
btn: "btn btn-default",
input: "form-control"
});
return PNotify;
}));