Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Autoría | Ultima modificación | Ver Log |

/*
* Project: Bootstrap Notify = v3.1.5
* Description: Turns standard Bootstrap alerts into "Growl-like" notifications.
* Author: Mouse0270 aka Robert McIntosh
* License: MIT License
* Website: https://github.com/mouse0270/bootstrap-growl
*/

/* global define:false, require: false, jQuery:false */

(function (factory) {
        if (typeof define === 'function' && define.amd) {
                // AMD. Register as an anonymous module.
                define(['jquery'], factory);
        } else if (typeof exports === 'object') {
                // Node/CommonJS
                factory(require('jquery'));
        } else {
                // Browser globals
                factory(jQuery);
        }
}(function ($) {
        // Create the defaults once
        var defaults = {
                element: 'body',
                position: null,
                type: "info",
                allow_dismiss: true,
                allow_duplicates: true,
                newest_on_top: false,
                showProgressbar: false,
                placement: {
                        from: "top",
                        align: "right"
                },
                offset: 20,
                spacing: 10,
                z_index: 1031,
                delay: 5000,
                timer: 1000,
                url_target: '_blank',
                mouse_over: null,
                animate: {
                        enter: 'animated fadeInDown',
                        exit: 'animated fadeOutUp'
                },
                onShow: null,
                onShown: null,
                onClose: null,
                onClosed: null,
        onClick: null,
                icon_type: 'class',
                template: '<div data-notify="container" class="col-xs-11 col-sm-4 alert alert-{0}" role="alert"><button type="button" aria-hidden="true" class="close" data-notify="dismiss">&times;</button><span data-notify="icon"></span> <span data-notify="title">{1}</span> <span data-notify="message">{2}</span><div class="progress" data-notify="progressbar"><div class="progress-bar progress-bar-{0}" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div></div><a href="{3}" target="{4}" data-notify="url"></a></div>'
        };

        String.format = function () {
                var args = arguments;
        var str = arguments[0];
        return str.replace(/(\{\{\d\}\}|\{\d\})/g, function (str) {
            if (str.substring(0, 2) === "{{") return str;
            var num = parseInt(str.match(/\d/)[0]);
            return args[num + 1];
        });
        };

        function isDuplicateNotification(notification) {
                var isDupe = false;

                $('[data-notify="container"]').each(function (i, el) {
                        var $el = $(el);
                        var title = $el.find('[data-notify="title"]').html().trim();
                        var message = $el.find('[data-notify="message"]').html().trim();

                        // The input string might be different than the actual parsed HTML string!
                        // (<br> vs <br /> for example)
                        // So we have to force-parse this as HTML here!
                        var isSameTitle = title === $("<div>" + notification.settings.content.title + "</div>").html().trim();
                        var isSameMsg = message === $("<div>" + notification.settings.content.message + "</div>").html().trim();
                        var isSameType = $el.hasClass('alert-' + notification.settings.type);

                        if (isSameTitle && isSameMsg && isSameType) {
                                //we found the dupe. Set the var and stop checking.
                                isDupe = true;
                        }
                        return !isDupe;
                });

                return isDupe;
        }

        function Notify(element, content, options) {
                // Setup Content of Notify
                var contentObj = {
                        content: {
                                message: typeof content === 'object' ? content.message : content,
                                title: content.title ? content.title : '',
                                icon: content.icon ? content.icon : '',
                                url: content.url ? content.url : '#',
                                target: content.target ? content.target : '-'
                        }
                };

                options = $.extend(true, {}, contentObj, options);
                this.settings = $.extend(true, {}, defaults, options);
                this._defaults = defaults;
                if (this.settings.content.target === "-") {
                        this.settings.content.target = this.settings.url_target;
                }
                this.animations = {
                        start: 'webkitAnimationStart oanimationstart MSAnimationStart animationstart',
                        end: 'webkitAnimationEnd oanimationend MSAnimationEnd animationend'
                };

                if (typeof this.settings.offset === 'number') {
                        this.settings.offset = {
                                x: this.settings.offset,
                                y: this.settings.offset
                        };
                }

                //if duplicate messages are not allowed, then only continue if this new message is not a duplicate of one that it already showing
                if (this.settings.allow_duplicates || (!this.settings.allow_duplicates && !isDuplicateNotification(this))) {
                        this.init();
                }
        }

        $.extend(Notify.prototype, {
                init: function () {
                        var self = this;

                        this.buildNotify();
                        if (this.settings.content.icon) {
                                this.setIcon();
                        }
                        if (this.settings.content.url != "#") {
                                this.styleURL();
                        }
                        this.styleDismiss();
                        this.placement();
                        this.bind();

                        this.notify = {
                                $ele: this.$ele,
                                update: function (command, update) {
                                        var commands = {};
                                        if (typeof command === "string") {
                                                commands[command] = update;
                                        } else {
                                                commands = command;
                                        }
                                        for (var cmd in commands) {
                                                switch (cmd) {
                                                        case "type":
                                                                this.$ele.removeClass('alert-' + self.settings.type);
                                                                this.$ele.find('[data-notify="progressbar"] > .progress-bar').removeClass('progress-bar-' + self.settings.type);
                                                                self.settings.type = commands[cmd];
                                                                this.$ele.addClass('alert-' + commands[cmd]).find('[data-notify="progressbar"] > .progress-bar').addClass('progress-bar-' + commands[cmd]);
                                                                break;
                                                        case "icon":
                                                                var $icon = this.$ele.find('[data-notify="icon"]');
                                                                if (self.settings.icon_type.toLowerCase() === 'class') {
                                                                        $icon.removeClass(self.settings.content.icon).addClass(commands[cmd]);
                                                                } else {
                                                                        if (!$icon.is('img')) {
                                                                                $icon.find('img');
                                                                        }
                                                                        $icon.attr('src', commands[cmd]);
                                                                }
                                                                self.settings.content.icon = commands[command];
                                                                break;
                                                        case "progress":
                                                                var newDelay = self.settings.delay - (self.settings.delay * (commands[cmd] / 100));
                                                                this.$ele.data('notify-delay', newDelay);
                                                                this.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', commands[cmd]).css('width', commands[cmd] + '%');
                                                                break;
                                                        case "url":
                                                                this.$ele.find('[data-notify="url"]').attr('href', commands[cmd]);
                                                                break;
                                                        case "target":
                                                                this.$ele.find('[data-notify="url"]').attr('target', commands[cmd]);
                                                                break;
                                                        default:
                                                                this.$ele.find('[data-notify="' + cmd + '"]').html(commands[cmd]);
                                                }
                                        }
                                        var posX = this.$ele.outerHeight() + parseInt(self.settings.spacing) + parseInt(self.settings.offset.y);
                                        self.reposition(posX);
                                },
                                close: function () {
                                        self.close();
                                }
                        };

                },
                buildNotify: function () {
                        var content = this.settings.content;
                        this.$ele = $(String.format(this.settings.template, this.settings.type, content.title, content.message, content.url, content.target));
                        this.$ele.attr('data-notify-position', this.settings.placement.from + '-' + this.settings.placement.align);
                        if (!this.settings.allow_dismiss) {
                                this.$ele.find('[data-notify="dismiss"]').css('display', 'none');
                        }
                        if ((this.settings.delay <= 0 && !this.settings.showProgressbar) || !this.settings.showProgressbar) {
                                this.$ele.find('[data-notify="progressbar"]').remove();
                        }
                },
                setIcon: function () {
                        if (this.settings.icon_type.toLowerCase() === 'class') {
                                this.$ele.find('[data-notify="icon"]').addClass(this.settings.content.icon);
                        } else {
                                if (this.$ele.find('[data-notify="icon"]').is('img')) {
                                        this.$ele.find('[data-notify="icon"]').attr('src', this.settings.content.icon);
                                } else {
                                        this.$ele.find('[data-notify="icon"]').append('<img src="' + this.settings.content.icon + '" alt="Notify Icon" />');
                                }
                        }
                },
                styleDismiss: function () {
                        this.$ele.find('[data-notify="dismiss"]').css({
                                position: 'absolute',
                                right: '10px',
                                top: '5px',
                                zIndex: this.settings.z_index + 2
                        });
                },
                styleURL: function () {
                        this.$ele.find('[data-notify="url"]').css({
                                backgroundImage: 'url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)',
                                height: '100%',
                                left: 0,
                                position: 'absolute',
                                top: 0,
                                width: '100%',
                                zIndex: this.settings.z_index + 1
                        });
                },
                placement: function () {
                        var self = this,
                                offsetAmt = this.settings.offset.y,
                                css = {
                                        display: 'inline-block',
                                        margin: '0px auto',
                                        position: this.settings.position ? this.settings.position : (this.settings.element === 'body' ? 'fixed' : 'absolute'),
                                        transition: 'all .5s ease-in-out',
                                        zIndex: this.settings.z_index
                                },
                                hasAnimation = false,
                                settings = this.settings;

                        $('[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])').each(function () {
                                offsetAmt = Math.max(offsetAmt, parseInt($(this).css(settings.placement.from)) + parseInt($(this).outerHeight()) + parseInt(settings.spacing));
                        });
                        if (this.settings.newest_on_top === true) {
                                offsetAmt = this.settings.offset.y;
                        }
                        css[this.settings.placement.from] = offsetAmt + 'px';

                        switch (this.settings.placement.align) {
                                case "left":
                                case "right":
                                        css[this.settings.placement.align] = this.settings.offset.x + 'px';
                                        break;
                                case "center":
                                        css.left = 0;
                                        css.right = 0;
                                        break;
                        }
                        this.$ele.css(css).addClass(this.settings.animate.enter);
                        $.each(Array('webkit-', 'moz-', 'o-', 'ms-', ''), function (index, prefix) {
                                self.$ele[0].style[prefix + 'AnimationIterationCount'] = 1;
                        });

                        $(this.settings.element).append(this.$ele);

                        if (this.settings.newest_on_top === true) {
                                offsetAmt = (parseInt(offsetAmt) + parseInt(this.settings.spacing)) + this.$ele.outerHeight();
                                this.reposition(offsetAmt);
                        }

                        if ($.isFunction(self.settings.onShow)) {
                                self.settings.onShow.call(this.$ele);
                        }

                        this.$ele.one(this.animations.start, function () {
                                hasAnimation = true;
                        }).one(this.animations.end, function () {
                                self.$ele.removeClass(self.settings.animate.enter);
                                if ($.isFunction(self.settings.onShown)) {
                                        self.settings.onShown.call(this);
                                }
                        });

                        setTimeout(function () {
                                if (!hasAnimation) {
                                        if ($.isFunction(self.settings.onShown)) {
                                                self.settings.onShown.call(this);
                                        }
                                }
                        }, 600);
                },
                bind: function () {
                        var self = this;

                        this.$ele.find('[data-notify="dismiss"]').on('click', function () {
                                self.close();
                        });

                        if ($.isFunction(self.settings.onClick)) {
                            this.$ele.on('click', function (event) {
                                if (event.target != self.$ele.find('[data-notify="dismiss"]')[0]) {
                                    self.settings.onClick.call(this, event);
                                }
                            });
                        }

                        this.$ele.mouseover(function () {
                                $(this).data('data-hover', "true");
                        }).mouseout(function () {
                                $(this).data('data-hover', "false");
                        });
                        this.$ele.data('data-hover', "false");

                        if (this.settings.delay > 0) {
                                self.$ele.data('notify-delay', self.settings.delay);
                                var timer = setInterval(function () {
                                        var delay = parseInt(self.$ele.data('notify-delay')) - self.settings.timer;
                                        if ((self.$ele.data('data-hover') === 'false' && self.settings.mouse_over === "pause") || self.settings.mouse_over != "pause") {
                                                var percent = ((self.settings.delay - delay) / self.settings.delay) * 100;
                                                self.$ele.data('notify-delay', delay);
                                                self.$ele.find('[data-notify="progressbar"] > div').attr('aria-valuenow', percent).css('width', percent + '%');
                                        }
                                        if (delay <= -(self.settings.timer)) {
                                                clearInterval(timer);
                                                self.close();
                                        }
                                }, self.settings.timer);
                        }
                },
                close: function () {
                        var self = this,
                                posX = parseInt(this.$ele.css(this.settings.placement.from)),
                                hasAnimation = false;

                        this.$ele.attr('data-closing', 'true').addClass(this.settings.animate.exit);
                        self.reposition(posX);

                        if ($.isFunction(self.settings.onClose)) {
                                self.settings.onClose.call(this.$ele);
                        }

                        this.$ele.one(this.animations.start, function () {
                                hasAnimation = true;
                        }).one(this.animations.end, function () {
                                $(this).remove();
                                if ($.isFunction(self.settings.onClosed)) {
                                        self.settings.onClosed.call(this);
                                }
                        });

                        setTimeout(function () {
                                if (!hasAnimation) {
                                        self.$ele.remove();
                                        if (self.settings.onClosed) {
                                                self.settings.onClosed(self.$ele);
                                        }
                                }
                        }, 600);
                },
                reposition: function (posX) {
                        var self = this,
                                notifies = '[data-notify-position="' + this.settings.placement.from + '-' + this.settings.placement.align + '"]:not([data-closing="true"])',
                                $elements = this.$ele.nextAll(notifies);
                        if (this.settings.newest_on_top === true) {
                                $elements = this.$ele.prevAll(notifies);
                        }
                        $elements.each(function () {
                                $(this).css(self.settings.placement.from, posX);
                                posX = (parseInt(posX) + parseInt(self.settings.spacing)) + $(this).outerHeight();
                        });
                }
        });

        $.notify = function (content, options) {
                var plugin = new Notify(this, content, options);
                return plugin.notify;
        };
        $.notifyDefaults = function (options) {
                defaults = $.extend(true, {}, defaults, options);
                return defaults;
        };

        $.notifyClose = function (selector) {

                if (typeof selector === "undefined" || selector === "all") {
                        $('[data-notify]').find('[data-notify="dismiss"]').trigger('click');
                }else if(selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger'){
                        $('.alert-' + selector + '[data-notify]').find('[data-notify="dismiss"]').trigger('click');
                } else if(selector){
                        $(selector + '[data-notify]').find('[data-notify="dismiss"]').trigger('click');
                }
                else {
                        $('[data-notify-position="' + selector + '"]').find('[data-notify="dismiss"]').trigger('click');
                }
        };

        $.notifyCloseExcept = function (selector) {

                if(selector === 'success' || selector === 'info' || selector === 'warning' || selector === 'danger'){
                        $('[data-notify]').not('.alert-' + selector).find('[data-notify="dismiss"]').trigger('click');
                } else{
                        $('[data-notify]').not(selector).find('[data-notify="dismiss"]').trigger('click');
                }
        };


}));