☰

Notify Library

Very Simple JS Notifications Library

当前为 2020-04-22 提交的版本，查看 最新版本。

此脚本不应直接安装。它是供其他脚本使用的外部库，要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/401626/796156/Notify%20Library.js 

  1. // ==UserScript==
  2. // @version      1.1.2
  3. // @license      MIT
  4. // ==/UserScript==
  5.  
  6. /* **************
  7.  
  8.   Notify Library
  9.   Developed by pizidavi
  10.  
  11.   Options:
  12.     - text    required
  13.     - type    optional
  14.       - success
  15.       - info/information
  16.       - warn/warning
  17.       - error
  18.     - timeout   optional
  19.  
  20. ************** */
  21.  
  22. var Notify = function Notify(options) {
  23.   var _this = this;
  24.  
  25.   if (!$('#notify').length) {
  26.     $('body').append('<div id="notify"><style media="screen"> #notify { position: fixed; top: 20px; right: 25px; z-index: 9999; } #notify > div { display: none; position: relative; width: 300px; padding: .4em .8em; margin-bottom: .6em; border-radius: 2px; background-color: white; color: #2c3e50; font-size: 17px; cursor: pointer; transition: .4s; } </style></div>');
  27.   }
  28.  
  29.   _this.options = options;
  30.   _this.container = $('#notify');
  31.   _this.template = $('<div><span></span></div>');
  32.  
  33.   if (!_this.options || typeof _this.options != 'object') {
  34.     throw 'Options required';
  35.   }
  36.   if (!_this.options.text) {
  37.     throw 'Options TEXT must not be empty';
  38.   }
  39.  
  40.   if (_this.options.type) {
  41.     var background = '';
  42.     switch (_this.options.type) {
  43.       case 'success':
  44.         background = '#2ecc71';
  45.       break;
  46.       case 'info':
  47.       case 'information':
  48.         background = '#3498db';
  49.       break;
  50.       case 'warn':
  51.       case 'warning':
  52.         background = '#f9ca24';
  53.       break;
  54.       case 'error':
  55.         background = '#e74c3c';
  56.       break;
  57.       default:
  58.         throw 'Type not found';
  59.     }
  60.     if (background) {
  61.       _this.template.css('background-color', background);
  62.       _this.template.css('color', 'white');
  63.     }
  64.   }
  65.  
  66.   _this.id = 'noty_'+Math.random().toString(36).substring(2);
  67.   _this.template.attr('id', _this.id);
  68.   _this.template.find('span').text(_this.options.text);
  69.   _this.template.css('right', -(300+parseInt(_this.container.css('right')))+'px');
  70.  
  71. };
  72.  
  73. Notify.prototype.show = function () {
  74.   var _this = this;
  75.  
  76.   if (!_this.container.find('#'+_this.id).length) {
  77.     _this.container.append(_this.template);
  78.   }
  79.  
  80.   _this.template.css('display', 'block');
  81.   _this.template.off('click').on('click', function() {
  82.     _this.close();
  83.   });
  84.   setTimeout(function() {
  85.     _this.template.css('right', '0');
  86.   }, 100);
  87.  
  88.   if (_this.options.timeout !== false) {
  89.     _this.closeTime = setTimeout(function() {
  90.       _this.close();
  91.     }, (_this.options.timeout || 4500));
  92.   }
  93.  
  94.   return _this;
  95. };
  96.  
  97. Notify.prototype.close = function () {
  98.   var _this = this;
  99.   if (!_this.container.find('#'+_this.id).length) return;
  100.  
  101.   clearTimeout(_this.closeTime);
  102.   _this.template.css('right', -(300+parseInt(_this.container.css('right')))+'px');
  103.  
  104.   setTimeout(function() {
  105.     _this.template.remove();
  106.   }, 500);
  107.  
  108.   return _this;
  109. };