define([ 'jquery', 'app/init', 'pnotify', //'pnotify.buttons', //'pnotify.confirm', 'pnotify.nonblock', 'pnotify.desktop', //'pnotify.history', 'pnotify.callbacks' ], function($, Init, PNotify) { 'use strict'; let config = { title: '', text: '', type: '', // 'info', 'success', error, 'warning' icon: false, styling: 'fontawesome', // 'fontawesome', 'bootstrap3', 'jqueryui' animate_speed: 'fast', // animation speed for notifications moving up/down hide: true, // close after few seconds delay: 5000, // visible time for notification in browser mouse_reset: true, // Reset the hide timer if the mouse moves over the notice. shadow: true, addclass: 'stack-bottomright', // class for display, must changed on stack different stacks width: '250px', // nonblock extension parameter (click through notifications) nonblock: { nonblock: true, // change for enable nonblock_opacity: 0.9 }, // desktop extension "Web Notifications" desktop: { desktop: false, // change for enable icon: Init.path.img + 'notifications/logo.png' // default image for desktop notifications } }; // initial page title (cached) let initialPageTitle = document.title; // global blink timeout cache let blinkTimer; // stack container for all notifications let stack = { bottomRight: { stack: { dir1: 'up', dir2: 'left', firstpos1: 30, firstpos2: 10, spacing1: 5, spacing2: 5, push: 'bottom' }, addclass: 'stack-bottomright', width: '250px', }, barBottom: { stack: { dir1: 'up', dir2: 'right', // context: $('body'), spacing1: 0, spacing2: 0 }, addclass: 'stack-bar-bottom', width: '70%', } }; /** * show a notification in browser and/or "Web Notifications" in OS * @param customConfig * @param settings */ let showNotify = function(customConfig, settings){ customConfig = $.extend(true, {}, config, customConfig ); // desktop notification if( settings && settings.desktop === true ){ // ask for Web Notifications permission PNotify.desktop.permission(); customConfig.delay = 10000; customConfig.desktop.desktop = true; // make browser tab blink startTabBlink(customConfig.title); } // set notification stack if( settings && settings.stack ){ customConfig.stack = stack[settings.stack].stack; customConfig.addclass = stack[settings.stack].addclass; customConfig.width = stack[settings.stack].width; }else{ customConfig.stack = stack.bottomRight.stack; customConfig.addclass = stack.bottomRight.addclass; } switch(customConfig.type){ case 'info': customConfig.icon = 'fas fa-info fa-fw fa-lg'; break; case 'success': customConfig.icon = 'fas fa-check fa-fw fa-lg'; break; case 'warning': customConfig.icon = 'fas fa-exclamation-triangle fa-fw fa-lg'; break; case 'error': customConfig.icon = 'fas fa-times fa-fw fa-lg'; break; case 'lock': customConfig.icon = 'fas fa-lock fa-fw fa-lg'; customConfig.type = 'success'; break; case 'unlock': customConfig.icon = 'fas fa-unlock fa-fw fa-lg'; customConfig.type = 'info'; break; default: customConfig.icon = false; } new PNotify(customConfig); }; /** * change document.title and make the browsers tab blink * @param blinkTitle */ let startTabBlink = function(blinkTitle){ let initBlink = (function(blinkTitle){ // count blinks if tab is currently active let activeTabBlinkCount = 0; let blink = function(){ // number of "blinks" should be limited if tab is currently active if(window.isVisible){ activeTabBlinkCount++; } // toggle page title document.title = (document.title === blinkTitle) ? initialPageTitle : blinkTitle; if(activeTabBlinkCount > 10){ stopTabBlink(); } }; return function () { if (!blinkTimer) { blinkTimer = setInterval(blink, 1000); } }; }( blinkTitle )); initBlink(); }; /** * stop blinking document.title */ let stopTabBlink = function(){ if(blinkTimer){ clearInterval(blinkTimer); document.title = initialPageTitle; blinkTimer = null; } }; return { showNotify: showNotify, startTabBlink: startTabBlink, stopTabBlink: stopTabBlink }; });