vue-noty/src/index.js

An implementation of Noty2 in VueJS

exports.install = function (Vue, options) {
  require('animate.css')

  window.notyDefaults = {
    layout: 'top',
    theme: 'defaultTheme', // or 'relax'
    type: 'alert',
    text: '', // can be html or string
    dismissQueue: true, // If you want to use queue feature set this true
    template: '<div class="noty_message"><span class="noty_text"></span><div class="noty_close"></div></div>',
    animation: {
        open: 'animated bounceInLeft', // Animate.css class names
        close: 'animated bounceOutLeft', // Animate.css class names
    },
    timeout: false, // delay for closing event. Set false for sticky notifications
    force: false, // adds notification to the beginning of queue when set to true
    modal: false,
    maxVisible: 5, // you can set max visible notification for dismissQueue true option,
    killer: false, // for close all notifications before show
    closeWith: ['click'], // ['click', 'button', 'hover', 'backdrop'] // backdrop click will close all notifications
    callback: {
        onShow: function() {},
        afterShow: function() {},
        onClose: function() {},
        afterClose: function() {},
        onCloseClick: function() {},
    },
    buttons: false // an array of buttons
  }

  Vue.prototype.$noty = function (options) {
    var props = {}
    Object.assign(props, window.notyDefaults)
    if (options && typeof options === "object") {
      var property;
      for (property in options) {
        if (options.hasOwnProperty(property)) {
          props[property] = options[property];
        }
      }
    }
    notyObject = noty(props);
    return notyObject.options.id;
    }

  Vue.prototype.$notyGetEl = function (notyID) {
    return $.noty.get(notyID)
  }  

  Vue.prototype.$notySetType = function (notyID, type) {
    return $.noty.setType(notyID, type)
  }

  Vue.prototype.$notySetText = function (notyID, text) {
    return $.noty.setText(notyID, text)
  }

  Vue.prototype.$notyClose = function (notyID) {
    $.noty.close(notyID)
  }

  Vue.prototype.$notyCloseAll = function () {
    $.noty.closeAll()
  }

  Vue.prototype.$notyClearQueue = function () {
    $.noty.clearQueue()
  }

  Vue.notySetDefaults = function (options) {
    var property;
    for (property in options) {
      if (options.hasOwnProperty(property)) {
        window.notyDefaults[property] = options[property];
      }
    }
  }

}