lobiboxing-rails 1.2.4

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA1:
+  metadata.gz: 7c0727d59b996f0aee955b6d76b2b3edcd1df463
+  data.tar.gz: dcb1806e6c8fb8d4ee6b936a5e12349cf919ac64
+SHA512:
+  metadata.gz: 37f2a6261ee69cc405067f61676b52172fd302087079170558bbec1f7bd2f5420cd9264422ccfb9087d5c1eed364e18f40757014476bebd52f2158f7ba9dff66
+  data.tar.gz: 1a983a2b93c1f1e3024b3748824ad6b2882038af714d0a7aab75b848191ec2349d6b5162e7226987aaab449aa3edee810ba9ec55960bc3756245d870316268c6

data/LICENSE.txt

@@ -0,0 +1,22 @@
+Copyright (c) 2014 Adam Griffis
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

data/README.md

@@ -0,0 +1,25 @@
+# lobiboxrails
+
+lobiboxrails wraps the [lobibox](https://github.com/arboshiki/lobibox) library in a rails engine for simple
+use with the asset pipeline provided by rails 4.0. The gem includes the development (non-minified)
+source for ease of exploration. The asset pipeline will minify in production.
+
+## Usage
+
+Add the following to your gemfile:
+
+    gem 'lobiboxrails'
+
+Add the following directive to your Javascript manifest file (application.js):
+
+    //= require lobibox
+    //= require lobibox/messageboxes
+    //= require lobibox/notifications
+
+Application.css
+
+    //= require lobibox
+
+## Versioning
+
+lobiboxrails 1.2.4 == lobibox.js 1.2.4

data/lib/lobiboxing/rails.rb

@@ -0,0 +1,8 @@
+require "lobiboxing/rails/version"
+
+module Lobibox
+  module Rails
+    class Engine < ::Rails::Engine
+    end
+  end
+end

data/lib/lobiboxing/rails/version.rb

@@ -0,0 +1,5 @@
+module Lobibox
+  module Rails
+    VERSION = "1.2.4"
+  end
+end

data/vendor/assets/javascripts/lobibox.js

@@ -0,0 +1,1572 @@
+//Author      : @arboshiki
+//create lobibox object
+var Lobibox = Lobibox || {};
+(function () {
+
+    Lobibox.counter = 0;
+//------------------------------------------------------------------------------
+//------------------------------------------------------------------------------
+
+    //User can set default properties for prompt in the following way
+    //Lobibox.prompt.DEFAULT_OPTIONS = object;
+    Lobibox.prompt = function (type, options) {
+        return new LobiboxPrompt(type, options);
+    };
+    //User can set default properties for confirm in the following way
+    //Lobibox.confirm.DEFAULT_OPTIONS = object;
+    Lobibox.confirm = function (options) {
+        return new LobiboxConfirm(options);
+    };
+    //User can set default properties for progress in the following way
+    //Lobibox.progress.DEFAULT_OPTIONS = object;
+    Lobibox.progress = function (options) {
+        return new LobiboxProgress(options);
+    };
+    //Create empty objects in order user to be able to set default options in the following way
+    //Lobibox.error.DEFAULT_OPTIONS = object;
+    //Lobibox.success.DEFAULT_OPTIONS = object;
+    //Lobibox.warning.DEFAULT_OPTIONS = object;
+    //Lobibox.info.DEFAULT_OPTIONS = object;
+
+    Lobibox.error = {};
+    Lobibox.success = {};
+    Lobibox.warning = {};
+    Lobibox.info = {};
+
+    //User can set default properties for alert in the following way
+    //Lobibox.alert.DEFAULT_OPTIONS = object;
+    Lobibox.alert = function (type, options) {
+        if (["success", "error", "warning", "info"].indexOf(type) > -1) {
+            return new LobiboxAlert(type, options);
+        }
+    };
+    //User can set default properties for window in the following way
+    //Lobibox.window.DEFAULT_OPTIONS = object;
+    Lobibox.window = function (options) {
+        return new LobiboxWindow('window', options);
+    };
+
+
+    /**
+     * Base prototype for all messageboxes and window
+     */
+    var LobiboxBase = {
+        $type: null,
+        $el: null,
+        $options: null,
+        debug: function () {
+            if (this.$options.debug) {
+                window.console.debug.apply(window.console, arguments);
+            }
+        },
+        _processInput: function (options) {
+            if ($.isArray(options.buttons)) {
+                var btns = {};
+                for (var i = 0; i < options.buttons.length; i++) {
+                    btns[options.buttons[i]] = Lobibox.base.OPTIONS.buttons[options.buttons[i]];
+                }
+                options.buttons = btns;
+            }
+            options.customBtnClass = options.customBtnClass ? options.customBtnClass : Lobibox.base.DEFAULTS.customBtnClass;
+            for (var i in options.buttons) {
+                if (options.buttons.hasOwnProperty(i)) {
+                    var btn = options.buttons[i];
+                    btn = $.extend({}, Lobibox.base.OPTIONS.buttons[i], btn);
+                    if (!btn['class']) {
+                        btn['class'] = options.customBtnClass;
+                    }
+                    options.buttons[i] = btn;
+                }
+            }
+            options = $.extend({}, Lobibox.base.DEFAULTS, options);
+            if (options.showClass === undefined) {
+                options.showClass = Lobibox.base.OPTIONS.showClass;
+            }
+            if (options.hideClass === undefined) {
+                options.hideClass = Lobibox.base.OPTIONS.hideClass;
+            }
+            if (options.baseClass === undefined) {
+                options.baseClass = Lobibox.base.OPTIONS.baseClass;
+            }
+            if (options.delayToRemove === undefined) {
+                options.delayToRemove = Lobibox.base.OPTIONS.delayToRemove;
+            }
+            if (!options.iconClass) {
+                options.iconClass = Lobibox.base.OPTIONS.icons[options.iconSource][this.$type];
+            }
+            return options;
+        },
+        _init: function () {
+            var me = this;
+
+            me._createMarkup();
+            me.setTitle(me.$options.title);
+            if (me.$options.draggable && !me._isMobileScreen()) {
+                me.$el.addClass('draggable');
+                me._enableDrag();
+            }
+            if (me.$options.closeButton) {
+                me._addCloseButton();
+            }
+            if (me.$options.closeOnEsc) {
+                $(document).on('keyup.lobibox', function (ev) {
+                    if (ev.which === 27) {
+                        me.destroy();
+                    }
+                });
+            }
+            if (me.$options.baseClass) {
+                me.$el.addClass(me.$options.baseClass);
+            }
+            if (me.$options.showClass) {
+                me.$el.removeClass(me.$options.hideClass);
+                me.$el.addClass(me.$options.showClass);
+            }
+            me.$el.data('lobibox', me);
+        },
+
+        /**
+         * Calculate top, left position based on string keyword
+         *
+         * @param {string} position "'top', 'center', 'bottom'"
+         * @returns {{left: number, top: number}}
+         * @private
+         */
+        _calculatePosition: function (position) {
+            var me = this;
+            var top;
+            if (position === 'top') {
+                top = 30;
+            } else if (position === 'bottom') {
+                top = $(window).outerHeight() - me.$el.outerHeight() - 30;
+            } else {
+                top = ($(window).outerHeight() - me.$el.outerHeight()) / 2;
+            }
+            var left = ($(window).outerWidth() - me.$el.outerWidth()) / 2;
+            return {
+                left: left,
+                top: top
+            };
+        },
+
+        _createButton: function (type, op) {
+            var me = this;
+            var btn = $('<button></button>')
+                .addClass(op['class'])
+                .attr('data-type', type)
+                .html(op.text);
+            if (me.$options.callback && typeof me.$options.callback === 'function') {
+                btn.on('click.lobibox', function (ev) {
+                    var bt = $(this);
+                    me._onButtonClick(me.$options.buttons[type], type);
+                    me.$options.callback(me, bt.data('type'), ev);
+                });
+            }
+            btn.click(function () {
+                me._onButtonClick(me.$options.buttons[type], type);
+            });
+            return btn;
+        },
+
+        _onButtonClick: function (buttonOptions, type) {
+            var me = this;
+
+            if ((type === 'ok' && me.$type === 'prompt' && me.isValid() || me.$type !== 'prompt' || type !== 'ok')
+                && buttonOptions && buttonOptions.closeOnClick) {
+                me.destroy();
+            }
+        },
+
+        _generateButtons: function () {
+            var me = this;
+            var btns = [];
+            for (var i in me.$options.buttons) {
+                if (me.$options.buttons.hasOwnProperty(i)) {
+                    var op = me.$options.buttons[i];
+                    var btn = me._createButton(i, op);
+                    btns.push(btn);
+                }
+            }
+            return btns;
+        },
+        _createMarkup: function () {
+            var me = this;
+            var lobibox = $('<div class="lobibox"></div>');
+            lobibox.attr('data-is-modal', me.$options.modal);
+            var header = $('<div class="lobibox-header"></div>')
+                .append('<span class="lobibox-title"></span>')
+                ;
+            var body = $('<div class="lobibox-body"></div>');
+            lobibox.append(header);
+            lobibox.append(body);
+            if (me.$options.buttons && !$.isEmptyObject(me.$options.buttons)) {
+                var footer = $('<div class="lobibox-footer"></div>');
+                footer.append(me._generateButtons());
+                lobibox.append(footer);
+                if (Lobibox.base.OPTIONS.buttonsAlign.indexOf(me.$options.buttonsAlign) > -1) {
+                    footer.addClass('text-' + me.$options.buttonsAlign);
+                }
+            }
+            me.$el = lobibox
+                .addClass(Lobibox.base.OPTIONS.modalClasses[me.$type])
+            ;
+        },
+        _setSize: function () {
+            var me = this;
+            me.setWidth(me.$options.width);
+            if (me.$options.height === 'auto') {
+                me.setHeight(me.$el.outerHeight());
+            } else {
+                me.setHeight(me.$options.height);
+            }
+        },
+        _calculateBodyHeight: function (height) {
+            var me = this;
+            var headerHeight = me.$el.find('.lobibox-header').outerHeight();
+            var footerHeight = me.$el.find('.lobibox-footer').outerHeight();
+            return height - (headerHeight ? headerHeight : 0) - (footerHeight ? footerHeight : 0);
+
+        },
+
+        /**
+         * Add backdrop in case if backdrop does not exist
+         *
+         * @private
+         */
+        _addBackdrop: function () {
+            if ($('.lobibox-backdrop').length === 0) {
+                $('body').append('<div class="lobibox-backdrop"></div>');
+            }
+        },
+
+        _triggerEvent: function (type) {
+            var me = this;
+            if (me.$options[type] && typeof me.$options[type] === 'function') {
+                me.$options[type](me);
+            }
+        },
+
+        _calculateWidth: function (width) {
+            var me = this;
+            width = Math.min(Math.max(width, me.$options.width), $(window).outerWidth());
+            if (width === $(window).outerWidth()) {
+                width -= 2 * me.$options.horizontalOffset;
+            }
+            return width;
+        },
+
+        _calculateHeight: function (height) {
+            var me = this;
+            console.log(me.$options.height);
+            height = Math.min(Math.max(height, me.$options.height), $(window).outerHeight());
+            if (height === $(window).outerHeight()) {
+                height -= 2 * me.$options.verticalOffset;
+            }
+            return height;
+        },
+
+        _addCloseButton: function () {
+            var me = this;
+            var closeBtn = $('<span class="btn-close">&times;</span>');
+            me.$el.find('.lobibox-header').append(closeBtn);
+            closeBtn.on('mousedown', function (ev) {
+                ev.stopPropagation();
+            });
+            closeBtn.on('click.lobibox', function () {
+                me.destroy();
+            });
+        },
+        _position: function () {
+            var me = this;
+
+            me._setSize();
+            var pos = me._calculatePosition();
+            me.setPosition(pos.left, pos.top);
+        },
+        _isMobileScreen: function () {
+            return $(window).outerWidth() < 768;
+        },
+        _enableDrag: function () {
+            var el = this.$el,
+                heading = el.find('.lobibox-header');
+
+            heading.on('mousedown.lobibox', function (ev) {
+                el.attr('offset-left', ev.offsetX);
+                el.attr('offset-top', ev.offsetY);
+                el.attr('allow-drag', 'true');
+            });
+            $(document).on('mouseup.lobibox', function () {
+                el.attr('allow-drag', 'false');
+            });
+            $(document).on('mousemove.lobibox', function (ev) {
+                if (el.attr('allow-drag') === 'true') {
+                    var left = ev.clientX - parseInt(el.attr('offset-left'), 10) - parseInt(el.css('border-left-width'), 10);
+                    var top = ev.clientY - parseInt(el.attr('offset-top'), 10) - parseInt(el.css('border-top-width'), 10);
+                    el.css({
+                        left: left,
+                        top: top
+                    });
+                }
+            });
+        },
+
+        /**
+         * Set the message of messagebox
+         *
+         * @param {string} msg "new message of messagebox"
+         * @returns {LobiboxBase}
+         * @private
+         */
+        _setContent: function (msg) {
+            var me = this;
+            me.$el.find('.lobibox-body').html(msg);
+            return me;
+        },
+
+        _beforeShow: function () {
+            var me = this;
+            me._triggerEvent('onShow');
+        },
+
+        _afterShow: function () {
+            var me = this;
+            Lobibox.counter++;
+            me.$el.attr('data-nth', Lobibox.counter);
+            if (!me.$options.draggable){
+                $(window).on('resize.lobibox-'+me.$el.attr('data-nth'), function(){
+                    me.refreshWidth();
+                    me.refreshHeight();
+                    me.$el.css('left', '50%').css('margin-left', '-'+(me.$el.width()/2)+'px');
+                    me.$el.css('top', '50%').css('margin-top', '-'+(me.$el.height()/2)+'px');
+                });
+            }
+
+            me._triggerEvent('shown');
+        },
+
+        _beforeClose: function () {
+            var me = this;
+            me._triggerEvent('beforeClose');
+        },
+
+        _afterClose: function () {
+            var me = this;
+            if (!me.$options.draggable){
+                $(window).off('resize.lobibox-'+me.$el.attr('data-nth'));
+            }
+            me._triggerEvent('closed');
+        },
+//------------------------------------------------------------------------------
+//--------------------------PUBLIC METHODS--------------------------------------
+//------------------------------------------------------------------------------
+
+        /**
+         * Hide the messagebox
+         *
+         * @returns {LobiboxBase}
+         */
+        hide: function () {
+            var me = this;
+            if (me.$options.hideClass) {
+                me.$el.removeClass(me.$options.showClass);
+                me.$el.addClass(me.$options.hideClass);
+                setTimeout(function () {
+                    callback();
+                }, me.$options.delayToRemove);
+            } else {
+                callback();
+            }
+            function callback() {
+                me.$el.addClass('lobibox-hidden');
+                if ($('.lobibox[data-is-modal=true]:not(.lobibox-hidden)').length === 0) {
+                    $('.lobibox-backdrop').remove();
+                    $('body').removeClass(Lobibox.base.OPTIONS.bodyClass);
+                }
+            }
+
+            return this;
+        },
+
+        /**
+         * Removes the messagebox from document
+         *
+         * @returns {LobiboxBase}
+         */
+        destroy: function () {
+            var me = this;
+            me._beforeClose();
+            if (me.$options.hideClass) {
+                me.$el.removeClass(me.$options.showClass).addClass(me.$options.hideClass);
+                setTimeout(function () {
+                    callback();
+                }, me.$options.delayToRemove);
+            } else {
+                callback();
+            }
+            function callback() {
+                me.$el.remove();
+                if ($('.lobibox[data-is-modal=true]').length === 0) {
+                    $('.lobibox-backdrop').remove();
+                    $('body').removeClass(Lobibox.base.OPTIONS.bodyClass);
+                }
+                me._afterClose();
+            }
+
+            return this;
+        },
+
+        /**
+         * Set the width of messagebox
+         *
+         * @param {number} width "new width of messagebox"
+         * @returns {LobiboxBase}
+         */
+        setWidth: function (width) {
+            var me = this;
+            me.$el.css('width', me._calculateWidth(width));
+            return me;
+        },
+
+        refreshWidth: function(){
+            this.setWidth(this.$el.width());
+        },
+
+        refreshHeight: function(){
+            this.setHeight(this.$el.height());
+        },
+
+        /**
+         * Set the height of messagebox
+         *
+         * @param {number} height "new height of messagebox"
+         * @returns {LobiboxBase}
+         */
+        setHeight: function (height) {
+            var me = this;
+            me.$el.css('height', me._calculateHeight(height))
+                .find('.lobibox-body')
+                .css('height', me._calculateBodyHeight(me.$el.innerHeight()));
+            return me;
+        },
+
+        /**
+         * Set the width and height of messagebox
+         *
+         * @param {number} width "new width of messagebox"
+         * @param {number} height "new height of messagebox"
+         * @returns {LobiboxBase}
+         */
+        setSize: function (width, height) {
+            var me = this;
+            me.setWidth(width);
+            me.setHeight(height);
+            return me;
+        },
+
+        /**
+         * Set position of messagebox
+         *
+         * @param {number|String} left "left coordinate of messsagebox or string representaing position. Available: ('top', 'center', 'bottom')"
+         * @param {number} top
+         * @returns {LobiboxBase}
+         */
+        setPosition: function (left, top) {
+            var pos;
+            if (typeof left === 'number' && typeof top === 'number') {
+                pos = {
+                    left: left,
+                    top: top
+                };
+            } else if (typeof left === 'string') {
+                pos = this._calculatePosition(left);
+            }
+            this.$el.css(pos);
+            return this;
+        },
+        /**
+         * Set the title of messagebox
+         *
+         * @param {string} title "new title of messagebox"
+         * @returns {LobiboxBase}
+         */
+        setTitle: function (title) {
+            return this.$el.find('.lobibox-title').html(title);
+        },
+
+        /**
+         * Get the title of messagebox
+         *
+         * @returns {string}
+         */
+        getTitle: function () {
+            return this.$el.find('.lobibox-title').html();
+        },
+
+        /**
+         * Show messagebox
+         *
+         * @returns {LobiboxBase}
+         */
+        show: function () {
+            var me = this,
+                $body = $('body');
+
+            me._beforeShow();
+
+            me.$el.removeClass('lobibox-hidden');
+            $body.append(me.$el);
+            if (me.$options.buttons) {
+                var buttons = me.$el.find('.lobibox-footer').children();
+                buttons[0].focus();
+            }
+            if (me.$options.modal) {
+                $body.addClass(Lobibox.base.OPTIONS.bodyClass);
+                me._addBackdrop();
+            }
+            if (me.$options.delay !== false) {
+                setTimeout(function () {
+                    me.destroy();
+                }, me.$options.delay);
+            }
+            me._afterShow();
+            return me;
+        }
+    };
+    //User can set default options by this variable
+    Lobibox.base = {};
+    Lobibox.base.OPTIONS = {
+        bodyClass: 'lobibox-open',
+
+        modalClasses: {
+            'error': 'lobibox-error',
+            'success': 'lobibox-success',
+            'info': 'lobibox-info',
+            'warning': 'lobibox-warning',
+            'confirm': 'lobibox-confirm',
+            'progress': 'lobibox-progress',
+            'prompt': 'lobibox-prompt',
+            'default': 'lobibox-default',
+            'window': 'lobibox-window'
+        },
+        buttonsAlign: ['left', 'center', 'right'],
+        buttons: {
+            ok: {
+                'class': 'lobibox-btn lobibox-btn-default',
+                text: 'OK',
+                closeOnClick: true
+            },
+            cancel: {
+                'class': 'lobibox-btn lobibox-btn-cancel',
+                text: 'Cancel',
+                closeOnClick: true
+            },
+            yes: {
+                'class': 'lobibox-btn lobibox-btn-yes',
+                text: 'Yes',
+                closeOnClick: true
+            },
+            no: {
+                'class': 'lobibox-btn lobibox-btn-no',
+                text: 'No',
+                closeOnClick: true
+            }
+        },
+        icons: {
+            bootstrap: {
+                confirm: 'glyphicon glyphicon-question-sign',
+                success: 'glyphicon glyphicon-ok-sign',
+                error: 'glyphicon glyphicon-remove-sign',
+                warning: 'glyphicon glyphicon-exclamation-sign',
+                info: 'glyphicon glyphicon-info-sign'
+            },
+            fontAwesome: {
+                confirm: 'fa fa-question-circle',
+                success: 'fa fa-check-circle',
+                error: 'fa fa-times-circle',
+                warning: 'fa fa-exclamation-circle',
+                info: 'fa fa-info-circle'
+            }
+        }
+    };
+    Lobibox.base.DEFAULTS = {
+        horizontalOffset: 5,                //If the messagebox is larger (in width) than window's width. The messagebox's width is reduced to window width - 2 * horizontalOffset
+        verticalOffset: 5,                  //If the messagebox is larger (in height) than window's height. The messagebox's height is reduced to window height - 2 * verticalOffset
+        width: 600,
+        height: 'auto',                     // Height is automatically calculated by width
+        closeButton: true,                  // Show close button or not
+        draggable: false,                   // Make messagebox draggable
+        customBtnClass: 'lobibox-btn lobibox-btn-default', // Class for custom buttons
+        modal: true,
+        debug: false,
+        buttonsAlign: 'center',             // Position where buttons should be aligned
+        closeOnEsc: true,                   // Close messagebox on Esc press
+        delayToRemove: 200,                 // Time after which lobibox will be removed after remove call. (This option is for hide animation to finish)
+        delay: false,                       // Time to remove lobibox after shown
+        baseClass: 'animated-super-fast',   // Base class to add all messageboxes
+        showClass: 'zoomIn',                // Show animation class
+        hideClass: 'zoomOut',               // Hide animation class
+        iconSource: 'bootstrap',            // "bootstrap" or "fontAwesome" the library which will be used for icons
+
+        //events
+        //When messagebox show is called but before it is actually shown
+        onShow: null,
+        //After messagebox is shown
+        shown: null,
+        //When messagebox remove method is called but before it is actually hidden
+        beforeClose: null,
+        //After messagebox is hidden
+        closed: null
+    };
+//------------------------------------------------------------------------------
+//-------------------------LobiboxPrompt----------------------------------------
+//------------------------------------------------------------------------------
+    function LobiboxPrompt(type, options) {
+        this.$input = null;
+        this.$type = 'prompt';
+        this.$promptType = type;
+
+        options = $.extend({}, Lobibox.prompt.DEFAULT_OPTIONS, options);
+
+        this.$options = this._processInput(options);
+
+        this._init();
+        this.debug(this);
+    }
+
+    LobiboxPrompt.prototype = $.extend({}, LobiboxBase, {
+        constructor: LobiboxPrompt,
+
+        _processInput: function (options) {
+            var me = this;
+
+            var mergedOptions = LobiboxBase._processInput.call(me, options);
+            mergedOptions.buttons = {
+                ok: Lobibox.base.OPTIONS.buttons.ok,
+                cancel: Lobibox.base.OPTIONS.buttons.cancel
+            };
+            options = $.extend({}, mergedOptions, LobiboxPrompt.DEFAULT_OPTIONS, options);
+            return options;
+        },
+
+        _init: function () {
+            var me = this;
+            LobiboxBase._init.call(me);
+            me.show();
+        },
+
+        _afterShow: function () {
+            var me = this;
+            me._setContent(me._createInput())._position();
+            me.$input.focus();
+            LobiboxBase._afterShow.call(me);
+        },
+
+        _createInput: function () {
+            var me = this,
+                label;
+            if (me.$options.multiline) {
+                me.$input = $('<textarea></textarea>').attr('rows', me.$options.lines);
+            } else {
+                me.$input = $('<input type="' + me.$promptType + '"/>');
+            }
+            me.$input.addClass('lobibox-input').attr(me.$options.attrs);
+            if (me.$options.value) {
+                me.setValue(me.$options.value);
+            }
+            if (me.$options.label) {
+                label = $('<label>' + me.$options.label + '</label>');
+            }
+            return $('<div></div>').append(label, me.$input);
+        },
+
+        /**
+         * Set value of input
+         *
+         * @param {string} val "value of input"
+         * @returns {LobiboxPrompt}
+         */
+        setValue: function (val) {
+            this.$input.val(val);
+            return this;
+        },
+
+        /**
+         * Get value of input
+         *
+         * @returns {String}
+         */
+        getValue: function () {
+            return this.$input.val();
+        },
+
+        isValid: function () {
+            var me = this,
+                $error = me.$el.find('.lobibox-input-error-message');
+
+            if (me.$options.required && !me.getValue()){
+                me.$input.addClass('invalid');
+                if ($error.length === 0){
+                    me.$el.find('.lobibox-body').append('<p class="lobibox-input-error-message">'+me.$options.errorMessage+'</p>');
+                    me._position();
+                    me.$input.focus();
+                }
+                return false;
+            }
+            me.$input.removeClass('invalid');
+            $error.remove();
+            me._position();
+            me.$input.focus();
+
+            return true;
+        }
+    });
+
+    LobiboxPrompt.DEFAULT_OPTIONS = {
+        width: 400,
+        attrs: {},          // Object of any valid attribute of input field
+        value: '',          // Value which is given to textfield when messagebox is created
+        multiline: false,   // Set this true for multiline prompt
+        lines: 3,           // This works only for multiline prompt. Number of lines
+        type: 'text',       // Prompt type. Available types (text|number|color)
+        label: '',          // Set some text which will be shown exactly on top of textfield
+        required: true,
+        errorMessage: 'The field is required'
+    };
+//------------------------------------------------------------------------------
+//-------------------------LobiboxConfirm---------------------------------------
+//------------------------------------------------------------------------------
+    function LobiboxConfirm(options) {
+        this.$type = 'confirm';
+
+//        options = $.extend({}, Lobibox.confirm.DEFAULT_OPTIONS, options);
+
+        this.$options = this._processInput(options);
+        this._init();
+        this.debug(this);
+    }
+
+    LobiboxConfirm.prototype = $.extend({}, LobiboxBase, {
+        constructor: LobiboxConfirm,
+
+        _processInput: function (options) {
+            var me = this;
+
+            var mergedOptions = LobiboxBase._processInput.call(me, options);
+            mergedOptions.buttons = {
+                yes: Lobibox.base.OPTIONS.buttons.yes,
+                no: Lobibox.base.OPTIONS.buttons.no
+            };
+            options = $.extend({}, mergedOptions, Lobibox.confirm.DEFAULTS, options);
+            return options;
+        },
+
+        _init: function () {
+            var me = this;
+
+            LobiboxBase._init.call(me);
+            me.show();
+        },
+
+        _afterShow: function () {
+            var me = this;
+
+            var d = $('<div></div>');
+            if (me.$options.iconClass) {
+                d.append($('<div class="lobibox-icon-wrapper"></div>')
+                    .append('<i class="lobibox-icon ' + me.$options.iconClass + '"></i>'))
+                ;
+            }
+            d.append('<div class="lobibox-body-text-wrapper"><span class="lobibox-body-text">' + me.$options.msg + '</span></div>');
+            me._setContent(d.html());
+
+            me._position();
+
+            LobiboxBase._afterShow.call(me);
+        }
+    });
+
+    Lobibox.confirm.DEFAULTS = {
+        title: 'Question',
+        width: 500
+    };
+//------------------------------------------------------------------------------
+//-------------------------LobiboxAlert------------------------------------------
+//------------------------------------------------------------------------------
+    function LobiboxAlert(type, options) {
+        this.$type = type;
+
+//        options = $.extend({}, Lobibox.alert.DEFAULT_OPTIONS, Lobibox[type].DEFAULT_OPTIONS, options);
+
+        this.$options = this._processInput(options);
+
+        this._init();
+        this.debug(this);
+    }
+
+    LobiboxAlert.prototype = $.extend({}, LobiboxBase, {
+        constructor: LobiboxAlert,
+
+        _processInput: function (options) {
+
+//            ALERT_OPTIONS = $.extend({}, LobiboxAlert.OPTIONS, Lobibox.alert.DEFAULTS);
+            var me = this;
+            var mergedOptions = LobiboxBase._processInput.call(me, options);
+            mergedOptions.buttons = {
+                ok: Lobibox.base.OPTIONS.buttons.ok
+            };
+
+            options = $.extend({}, mergedOptions, Lobibox.alert.OPTIONS[me.$type], Lobibox.alert.DEFAULTS, options);
+
+            return options;
+        },
+
+        _init: function () {
+            var me = this;
+            LobiboxBase._init.call(me);
+            me.show();
+        },
+
+        _afterShow: function () {
+            var me = this;
+
+            var d = $('<div></div>');
+            if (me.$options.iconClass) {
+                d.append($('<div class="lobibox-icon-wrapper"></div>')
+                    .append('<i class="lobibox-icon ' + me.$options.iconClass + '"></i>'))
+                ;
+            }
+            d.append('<div class="lobibox-body-text-wrapper"><span class="lobibox-body-text">' + me.$options.msg + '</span></div>');
+            me._setContent(d.html());
+            me._position();
+
+            LobiboxBase._afterShow.call(me);
+        }
+    });
+    Lobibox.alert.OPTIONS = {
+        warning: {
+            title: 'Warning'
+        },
+        info: {
+            title: 'Information'
+        },
+        success: {
+            title: 'Success'
+        },
+        error: {
+            title: 'Error'
+        }
+    };
+    //User can set default options by this variable
+    Lobibox.alert.DEFAULTS = {};
+//------------------------------------------------------------------------------
+//-------------------------LobiboxProgress--------------------------------------
+//------------------------------------------------------------------------------
+    function LobiboxProgress(options) {
+        this.$type = 'progress';
+        this.$progressBarElement = null;
+        this.$options = this._processInput(options);
+        this.$progress = 0;
+
+        this._init();
+        this.debug(this);
+    }
+
+    LobiboxProgress.prototype = $.extend({}, LobiboxBase, {
+        constructor: LobiboxProgress,
+
+        _processInput: function (options) {
+            var me = this;
+            var mergedOptions = LobiboxBase._processInput.call(me, options);
+
+            options = $.extend({}, mergedOptions, Lobibox.progress.DEFAULTS, options);
+            return options;
+        },
+
+        _init: function () {
+            var me = this;
+
+            LobiboxBase._init.call(me);
+            me.show();
+        },
+
+        _afterShow: function () {
+            var me = this;
+
+            if (me.$options.progressTpl) {
+                me.$progressBarElement = $(me.$options.progressTpl);
+            } else {
+                me.$progressBarElement = me._createProgressbar();
+            }
+            var label;
+            if (me.$options.label) {
+                label = $('<label>' + me.$options.label + '</label>');
+            }
+            var innerHTML = $('<div></div>').append(label, me.$progressBarElement);
+            me._setContent(innerHTML);
+            me._position();
+
+            LobiboxBase._afterShow.call(me);
+        },
+
+        _createProgressbar: function () {
+            var me = this;
+            var outer = $('<div class="lobibox-progress-bar-wrapper lobibox-progress-outer"></div>')
+                .append('<div class="lobibox-progress-bar lobibox-progress-element"></div>')
+                ;
+            if (me.$options.showProgressLabel) {
+                outer.append('<span class="lobibox-progress-text" data-role="progress-text"></span>');
+            }
+
+            return outer;
+        },
+
+        /**
+         * Set progress value
+         *
+         * @param {number} progress "progress value"
+         * @returns {LobiboxProgress}
+         */
+        setProgress: function (progress) {
+            var me = this;
+            if (me.$progress === 100) {
+                return;
+            }
+            progress = Math.min(100, Math.max(0, progress));
+            me.$progress = progress;
+            me._triggerEvent('progressUpdated');
+            if (me.$progress === 100) {
+                me._triggerEvent('progressCompleted');
+            }
+            me.$el.find('.lobibox-progress-element').css('width', progress.toFixed(1) + "%");
+            me.$el.find('[data-role="progress-text"]').html(progress.toFixed(1) + "%");
+            return me;
+        },
+
+        /**
+         * Get progress value
+         *
+         * @returns {number}
+         */
+        getProgress: function () {
+            return this.$progress;
+        }
+    });
+
+    Lobibox.progress.DEFAULTS = {
+        width: 500,
+        showProgressLabel: true,  // Show percentage of progress
+        label: '',  // Show progress label
+        progressTpl: false,  //Template of progress bar
+
+        //Events
+        progressUpdated: null,
+        progressCompleted: null
+    };
+//------------------------------------------------------------------------------
+//-------------------------LobiboxWindow----------------------------------------
+//------------------------------------------------------------------------------
+    function LobiboxWindow(type, options) {
+        this.$type = type;
+
+        this.$options = this._processInput(options);
+
+        this._init();
+        this.debug(this);
+    }
+
+    LobiboxWindow.prototype = $.extend({}, LobiboxBase, {
+        constructor: LobiboxWindow,
+        _processInput: function (options) {
+            var me = this;
+            var mergedOptions = LobiboxBase._processInput.call(me, options);
+
+            if (options.content && typeof options.content === 'function') {
+                options.content = options.content();
+            }
+            if (options.content instanceof jQuery) {
+                options.content = options.content.clone();
+            }
+            options = $.extend({}, mergedOptions, Lobibox.window.DEFAULTS, options);
+            return options;
+        },
+
+        _init: function () {
+            var me = this;
+
+            LobiboxBase._init.call(me);
+            me.setContent(me.$options.content);
+            if (me.$options.url && me.$options.autoload) {
+                if (!me.$options.showAfterLoad) {
+                    me.show();
+                }
+                me.load(function () {
+                    if (me.$options.showAfterLoad) {
+                        me.show();
+                    }
+                });
+            } else {
+                me.show();
+            }
+        },
+
+        _afterShow: function () {
+            var me = this;
+
+            me._position();
+
+            LobiboxBase._afterShow.call(me);
+        },
+
+        /**
+         * Setter method for <code>params</code> option
+         *
+         * @param {object} params "new params"
+         * @returns {LobiboxWindow}
+         */
+        setParams: function (params) {
+            var me = this;
+            me.$options.params = params;
+            return me;
+        },
+        /**
+         * Getter method for <code>params</code>
+         *
+         * @returns {object}
+         */
+        getParams: function () {
+            var me = this;
+            return me.$options.params;
+        },
+        /**
+         * Setter method of <code>loadMethod</code> option
+         *
+         * @param {string} method "new method"
+         * @returns {LobiboxWindow}
+         */
+        setLoadMethod: function (method) {
+            var me = this;
+            me.$options.loadMethod = method;
+            return me;
+        },
+        /**
+         * Getter method for <code>loadMethod</code> option
+         *
+         * @returns {string}
+         */
+        getLoadMethod: function () {
+            var me = this;
+            return me.$options.loadMethod;
+        },
+        /**
+         * Setter method of <code>content</code> option.
+         * Change the content of window
+         *
+         * @param {string} content "new content"
+         * @returns {LobiboxWindow}
+         */
+        setContent: function (content) {
+            var me = this;
+            me.$options.content = content;
+            me.$el.find('.lobibox-body').html('').append(content);
+            return me;
+        },
+        /**
+         * Getter method of <code>content</code> option
+         *
+         * @returns {string}
+         */
+        getContent: function () {
+            var me = this;
+            return me.$options.content;
+        },
+        /**
+         * Setter method of <code>url</code> option
+         *
+         * @param {string} url "new url"
+         * @returns {LobiboxWindow}
+         */
+        setUrl: function (url) {
+            this.$options.url = url;
+            return this;
+        },
+        /**
+         * Getter method of <code>url</code> option
+         *
+         * @returns {String}
+         */
+        getUrl: function () {
+            return this.$options.url;
+        },
+        /**
+         * Loads content to window by ajax from specific url
+         *
+         * @param {Function} callback "callback function"
+         * @returns {LobiboxWindow}
+         */
+        load: function (callback) {
+            var me = this;
+            if (!me.$options.url) {
+                return me;
+            }
+            $.ajax(me.$options.url, {
+                method: me.$options.loadMethod,
+                data: me.$options.params
+            }).done(function (res) {
+                me.setContent(res);
+                if (callback && typeof callback === 'function') {
+                    callback(res);
+                }
+            });
+            return me;
+        }
+    });
+
+    Lobibox.window.DEFAULTS = {
+        width: 480,
+        height: 600,
+        content: '',  // HTML Content of window
+        url: '',  // URL which will be used to load content
+        draggable: true,  // Override default option
+        autoload: true,  // Auto load from given url when window is created
+        loadMethod: 'GET',  // Ajax method to load content
+        showAfterLoad: true,  // Show window after content is loaded or show and then load content
+        params: {}  // Parameters which will be send by ajax for loading content
+    };
+
+})();
+
+//Author      : @arboshiki
+/**
+ * Generates random string of n length.
+ * String contains only letters and numbers
+ *
+ * @param {int} n
+ * @returns {String}
+ */
+Math.randomString = function (n) {
+    var text = "";
+    var possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
+
+    for (var i = 0; i < n; i++)
+        text += possible.charAt(Math.floor(Math.random() * possible.length));
+
+    return text;
+};
+var Lobibox = Lobibox || {};
+(function () {
+
+    var LobiboxNotify = function (type, options) {
+//------------------------------------------------------------------------------
+//----------------PROTOTYPE VARIABLES-------------------------------------------
+//------------------------------------------------------------------------------
+        this.$type = null;
+        this.$options = null;
+        this.$el = null;
+//------------------------------------------------------------------------------
+//-----------------PRIVATE VARIABLES--------------------------------------------
+//------------------------------------------------------------------------------        
+        var me = this;
+//------------------------------------------------------------------------------
+//-----------------PRIVATE FUNCTIONS--------------------------------------------
+//------------------------------------------------------------------------------
+        var _processInput = function (options) {
+
+            if (options.size === 'mini' || options.size === 'large') {
+                options = $.extend({}, Lobibox.notify.OPTIONS[options.size], options);
+            }
+            options = $.extend({}, Lobibox.notify.OPTIONS[me.$type], Lobibox.notify.DEFAULTS, options);
+
+            if (options.size !== 'mini' && options.title === true) {
+                options.title = Lobibox.notify.OPTIONS[me.$type].title;
+            } else if (options.size === 'mini' && options.title === true) {
+                options.title = false;
+            }
+            if (options.icon === true) {
+                options.icon = Lobibox.notify.OPTIONS.icons[options.iconSource][me.$type];
+            }
+            if (options.sound === true) {
+                options.sound = Lobibox.notify.OPTIONS[me.$type].sound;
+            }
+            if (options.sound) {
+                options.sound = options.soundPath + options.sound + options.soundExt;
+            }
+            return options;
+        };
+
+        var _appendInWrapper = function ($el, $wrapper) {
+            if (me.$options.size === 'normal') {
+                if ($wrapper.hasClass('bottom')) {
+                    $wrapper.prepend($el);
+                } else {
+                    $wrapper.append($el);
+                }
+
+            } else if (me.$options.size === 'mini') {
+                if ($wrapper.hasClass('bottom')) {
+                    $wrapper.prepend($el);
+                } else {
+                    $wrapper.append($el);
+                }
+            } else if (me.$options.size === 'large') {
+                var tabPane = _createTabPane().append($el);
+                var $li = _createTabControl(tabPane.attr('id'));
+                $wrapper.find('.lb-notify-wrapper').append(tabPane);
+                $wrapper.find('.lb-notify-tabs').append($li);
+                _activateTab($li);
+                $li.find('>a').click(function () {
+                    _activateTab($li);
+                });
+            }
+        };
+        var _activateTab = function ($li) {
+            $li.closest('.lb-notify-tabs').find('>li').removeClass('active');
+            $li.addClass('active');
+            var $current = $($li.find('>a').attr('href'));
+            $current.closest('.lb-notify-wrapper').find('>.lb-tab-pane').removeClass('active');
+            $current.addClass('active')
+        };
+        var _createTabControl = function (tabPaneId) {
+            var $li = $('<li></li>', {
+                'class': Lobibox.notify.OPTIONS[me.$type]['class']
+            });
+            $('<a></a>', {
+                'href': '#' + tabPaneId
+            }).append('<i class="tab-control-icon ' + me.$options.icon + '"></i>')
+                .appendTo($li);
+            return $li;
+        };
+        var _createTabPane = function () {
+            return $('<div></div>', {
+                'class': 'lb-tab-pane',
+                'id': Math.randomString(10)
+            })
+        };
+        var _createNotifyWrapper = function () {
+            var selector = (me.$options.size === 'large' ? '.lobibox-notify-wrapper-large' : '.lobibox-notify-wrapper')
+                    + "." + me.$options.position.replace(/\s/gi, '.'),
+                $wrapper;
+
+            //var classes = me.$options.position.split(" ");
+            $wrapper = $(selector);
+            if ($wrapper.length === 0) {
+                $wrapper = $('<div></div>')
+                    .addClass(selector.replace(/\./g, ' ').trim())
+                    .appendTo($('body'));
+                if (me.$options.size === 'large') {
+                    $wrapper.append($('<ul class="lb-notify-tabs"></ul>'))
+                        .append($('<div class="lb-notify-wrapper"></div>'));
+                }
+            }
+            return $wrapper;
+        };
+        var _createNotify = function () {
+            var OPTS = Lobibox.notify.OPTIONS,
+                $iconEl,
+                $innerIconEl,
+                $iconWrapper,
+                $body,
+                $msg,
+                $notify = $('<div></div>', {
+                    'class': 'lobibox-notify ' + OPTS[me.$type]['class'] + ' ' + OPTS['class'] + ' ' + me.$options.showClass
+                });
+
+            $iconWrapper = $('<div class="lobibox-notify-icon-wrapper"></div>').appendTo($notify);
+            $iconEl = $('<div class="lobibox-notify-icon"></div>').appendTo($iconWrapper);
+            $innerIconEl = $('<div></div>').appendTo($iconEl);
+
+            // Add image or icon depending on given parameters
+            if (me.$options.img) {
+                $innerIconEl.append('<img src="' + me.$options.img + '"/>');
+            } else if (me.$options.icon) {
+                $innerIconEl.append('<div class="icon-el"><i class="' + me.$options.icon + '"></i></div>');
+            } else {
+                $notify.addClass('without-icon');
+            }
+            // Create body, append title and message in body and append body in notification
+            $msg = $('<div class="lobibox-notify-msg">' + me.$options.msg + '</div>');
+
+            if (me.$options.messageHeight !== false) {
+                $msg.css('max-height', me.$options.messageHeight);
+            }
+
+            $body = $('<div></div>', {
+                'class': 'lobibox-notify-body'
+            }).append($msg).appendTo($notify);
+
+            if (me.$options.title) {
+                $body.prepend('<div class="lobibox-notify-title">' + me.$options.title + '<div>');
+            }
+            _addCloseButton($notify);
+            if (me.$options.size === 'normal' || me.$options.size === 'mini') {
+                _addCloseOnClick($notify);
+                _addDelay($notify);
+            }
+
+            // Give width to notification
+            if (me.$options.width) {
+                $notify.css('width', _calculateWidth(me.$options.width));
+            }
+
+            return $notify;
+        };
+        var _addCloseButton = function ($el) {
+            if (!me.$options.closable) {
+                return;
+            }
+            $('<span class="lobibox-close">&times;</span>').click(function () {
+                me.remove();
+            }).appendTo($el);
+        };
+        var _addCloseOnClick = function ($el) {
+            if (!me.$options.closeOnClick) {
+                return;
+            }
+            $el.click(function () {
+                me.remove();
+            });
+        };
+        var _addDelay = function ($el) {
+            if (!me.$options.delay) {
+                return;
+            }
+            if (me.$options.delayIndicator) {
+                var delay = $('<div class="lobibox-delay-indicator"><div></div></div>');
+                $el.append(delay);
+            }
+            var time = 0;
+            var interval = 1000 / 30;
+            var currentTime = new Date().getTime();
+            var timer = setInterval(function () {
+                if (me.$options.continueDelayOnInactiveTab){
+                    time = new Date().getTime() - currentTime;
+                } else {
+                    time += interval;
+                }
+
+                var width = 100 * time / me.$options.delay;
+                if (width >= 100) {
+                    width = 100;
+                    me.remove();
+                    timer = clearInterval(timer);
+                }
+                if (me.$options.delayIndicator) {
+                    delay.find('div').css('width', width + "%");
+                }
+
+            }, interval);
+
+            if (me.$options.pauseDelayOnHover) {
+                $el.on('mouseenter.lobibox', function () {
+                    interval = 0;
+                }).on('mouseleave.lobibox', function () {
+                    interval = 1000 / 30;
+                });
+            }
+        };
+        var _findTabToActivate = function ($li) {
+            var $itemToActivate = $li.prev();
+            if ($itemToActivate.length === 0) {
+                $itemToActivate = $li.next();
+            }
+            if ($itemToActivate.length === 0) {
+                return null;
+            }
+            return $itemToActivate;
+        };
+        var _calculateWidth = function (width) {
+            width = Math.min($(window).outerWidth(), width);
+            return width;
+        };
+//------------------------------------------------------------------------------
+//----------------PROTOTYPE FUNCTIONS-------------------------------------------
+//------------------------------------------------------------------------------
+        /**
+         * Delete the notification
+         *
+         * @returns {LobiboxNotify}
+         */
+        this.remove = function () {
+            me.$el.removeClass(me.$options.showClass)
+                .addClass(me.$options.hideClass);
+            var parent = me.$el.parent();
+            var wrapper = parent.closest('.lobibox-notify-wrapper-large');
+
+            var href = '#' + parent.attr('id');
+
+            var $li = wrapper.find('>.lb-notify-tabs>li:has(a[href="' + href + '"])');
+            $li.addClass(Lobibox.notify.OPTIONS['class'])
+                .addClass(me.$options.hideClass);
+            setTimeout(function () {
+                if (me.$options.size === 'normal' || me.$options.size === 'mini') {
+                    me.$el.remove();
+                } else if (me.$options.size === 'large') {
+
+                    var $newLi = _findTabToActivate($li);
+                    if ($newLi) {
+                        _activateTab($newLi);
+                    }
+                    $li.remove();
+                    parent.remove();
+                }
+                var list = Lobibox.notify.list;
+                var ind = list.indexOf(me);
+                list.splice(ind, 1);
+                var next = list[ind];
+                if (next && next.$options.showAfterPrevious){
+                    next._init();
+                }
+            }, 500);
+            return me;
+        };
+        me._init = function () {
+            // Create notification
+            var $notify = _createNotify();
+            if (me.$options.size === 'mini') {
+                $notify.addClass('notify-mini');
+            }
+
+            if (typeof me.$options.position === 'string') {
+                var $wrapper = _createNotifyWrapper();
+                _appendInWrapper($notify, $wrapper);
+                if ($wrapper.hasClass('center')) {
+                    $wrapper.css('margin-left', '-' + ($wrapper.width() / 2) + "px");
+                }
+            } else {
+                $('body').append($notify);
+                $notify.css({
+                    'position': 'fixed',
+                    left: me.$options.position.left,
+                    top: me.$options.position.top
+                })
+            }
+
+            me.$el = $notify;
+            if (me.$options.sound) {
+                var snd = new Audio(me.$options.sound); // buffers automatically when created
+                snd.play();
+            }
+            if (me.$options.rounded) {
+                me.$el.addClass('rounded');
+            }
+            me.$el.on('click.lobibox', function(ev){
+                if (me.$options.onClickUrl){
+                    window.location.href = me.$options.onClickUrl;
+                }
+                if (me.$options.onClick && typeof me.$options.onClick === 'function'){
+                    me.$options.onClick.call(me, ev);
+                }
+            });
+            me.$el.data('lobibox', me);
+        };
+//------------------------------------------------------------------------------
+//------------------------------------------------------------------------------
+//------------------------------------------------------------------------------
+        this.$type = type;
+        this.$options = _processInput(options);
+        if (!me.$options.showAfterPrevious || Lobibox.notify.list.length === 0){
+            this._init();
+        }
+
+    };
+
+    Lobibox.notify = function (type, options) {
+        if (["default", "info", "warning", "error", "success"].indexOf(type) > -1) {
+            var lobibox = new LobiboxNotify(type, options);
+            Lobibox.notify.list.push(lobibox);
+            return lobibox;
+        }
+    };
+    Lobibox.notify.list = [];
+    Lobibox.notify.closeAll = function () {
+        var list = Lobibox.notify.list;
+        for (var i in list){
+            list[i].remove();
+        }
+    };
+    //User can set default options to this variable
+    Lobibox.notify.DEFAULTS = {
+        title: true,                // Title of notification. If you do not include the title in options it will automatically takes its value 
+        //from Lobibox.notify.OPTIONS object depending of the type of the notifications or set custom string. Set this false to disable title
+        size: 'normal',             // normal, mini, large
+        soundPath: 'sounds/',   // The folder path where sounds are located
+        soundExt: '.ogg',           // Default extension for all sounds
+        showClass: 'fadeInDown',    // Show animation class.
+        hideClass: 'zoomOut',       // Hide animation class.
+        icon: true,                 // Icon of notification. Leave as is for default icon or set custom string
+        msg: '',                    // Message of notification
+        img: null,                  // Image source string
+        closable: true,             // Make notifications closable
+        hideCloseButton: false,     // Notification may be closable but you can hide close button and it will be closed by clicking on notification itsef
+        delay: 5000,                // Hide notification after this time (in miliseconds)
+        delayIndicator: true,       // Show timer indicator
+        closeOnClick: true,         // Close notifications by clicking on them
+        width: 400,                 // Width of notification box
+        sound: true,                // Sound of notification. Set this false to disable sound. Leave as is for default sound or set custom soud path
+        // Place to show notification. Available options: "top left", "top right", "bottom left", "bottom right", "center top", "center bottom"
+        // It can also be object {left: number, top: number} to position notification at any place
+        position: "bottom right",
+        iconSource: 'bootstrap',    // "bootstrap" or "fontAwesome" the library which will be used for icons
+        rounded: false,             // Whether to make notification corners rounded
+        messageHeight: 60,          // Notification message maximum height. This is not for notification itself, this is for <code>.lobibox-notify-msg</code>
+        pauseDelayOnHover: true,    // When you mouse over on notification delay (if it is enabled) will be paused.
+        onClickUrl: null,           // The url which will be opened when notification is clicked
+        showAfterPrevious: false,   // Set this to true if you want notification not to be shown until previous notification is closed. This is useful for notification queues
+        continueDelayOnInactiveTab: true, // Continue delay when browser tab is inactive
+
+        // Events
+        onClick: null
+    };
+    //This variable is necessary.
+    Lobibox.notify.OPTIONS = {
+        'class': 'animated-fast',
+        large: {
+            width: 500,
+            messageHeight: 96
+        },
+        mini: {
+            'class': 'notify-mini',
+            messageHeight: 32
+        },
+        default: {
+            'class': 'lobibox-notify-default',
+            'title': 'Default',
+            sound: false
+        },
+        success: {
+            'class': 'lobibox-notify-success',
+            'title': 'Success',
+            sound: 'sound2'
+        },
+        error: {
+            'class': 'lobibox-notify-error',
+            'title': 'Error',
+            sound: 'sound4'
+        },
+        warning: {
+            'class': 'lobibox-notify-warning',
+            'title': 'Warning',
+            sound: 'sound5'
+        },
+        info: {
+            'class': 'lobibox-notify-info',
+            'title': 'Information',
+            sound: 'sound6'
+        },
+        icons: {
+            bootstrap: {
+                success: 'glyphicon glyphicon-ok-sign',
+                error: 'glyphicon glyphicon-remove-sign',
+                warning: 'glyphicon glyphicon-exclamation-sign',
+                info: 'glyphicon glyphicon-info-sign'
+            },
+            fontAwesome: {
+                success: 'fa fa-check-circle',
+                error: 'fa fa-times-circle',
+                warning: 'fa fa-exclamation-circle',
+                info: 'fa fa-info-circle'
+            }
+        }
+    };
+})();
+
+