Subversion Repositories cheapmusic

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
20 - 1 
/*
2 
 *  bootstrap4-input-clearer v1.2.0
3 
 *  Add clear icons to Bootstrap 4 input fields.
4 
 *  https://github.com/mheigl/bootstrap4-input-clearer
5 
 *
6 
 *  Made by Michael Heigl
7 
 *  Under GNU General Public License v3.0
8 
 */
116 - 9 
 ;
65 - 10 
(function($) {
20 - 11 
    "use strict";
12 
 
13 
    var pluginName = "clearer",
14 
        defaults = {
116 - 15 
            clearHtml: '<i class="material-icons">close</i>',
65 - 16 
            cssClass: '',
20 - 17 
            focusable: true
18 
        };
19 
 
65 - 20 
    function Plugin(element, options) {
20 - 21 
        this.element = element;
22 
        this.settings = $.extend({}, defaults, options);
23 
        this.init();
24 
    }
25 
 
26 
    $.extend(Plugin.prototype, {
65 - 27 
        init: function() {
20 - 28 
            var self = this;
29 
 
30 
            this.$element = $(this.element);
65 - 31 
            this.$clearer = $('<div class="input-group-append ' + this.settings.cssClass + '">' + '<button class="btn input-group-text form-control" type="button">' + this.settings.clearHtml + '</button></div>');
20 - 32 
 
33 
            if (this.settings.focusable === false) {
65 - 34 
                this.$clearer.attr({
35 
                    'tabindex': -1
36 
                });
20 - 37 
            }
38 
 
39 
            if (this.$element.closest('.input-group').length === 0) {
40 
                this.$element.wrap("<div class='input-group'></div>");
41 
            }
42 
 
43 
            this.$element.after(this.$clearer);
44 
 
45 
            this.update();
46 
 
65 - 47 
            this.$clearer.on('click.clearer', function(e) {
20 - 48 
                self.$element.val('');
49 
                self.$element.trigger('change');
50 
                self.$element.focus();
51 
                self.update();
52 
                e.preventDefault();
53 
            });
54 
 
65 - 55 
            this.$element.on('focus.clearer blur.clearer', function() {
20 - 56 
                self.update();
57 
            });
58 
 
65 - 59 
            this.$element.on('keyup.clearer', function(e) {
20 - 60 
                if (e.keyCode === 27) {
61 
                    $(this).val('').focus();
62 
                }
63 
 
64 
                self.update();
65 
            });
66 
 
65 - 67 
            this.$element.on('input.clearer change.clearer paste.clearer', function() {
20 - 68 
                self.update();
69 
            });
70 
        },
71 
        update: function() {
72 
            if (this.$element.val().length >= 1) {
73 
                this.$clearer.show();
74 
            } else {
75 
                this.$clearer.hide();
76 
            }
77 
        }
78 
    });
79 
 
65 - 80 
    $.fn[pluginName] = function(options) {
81 
        return this.each(function() {
20 - 82 
            if (!$.data(this, "plugin_" + pluginName)) {
83 
                $.data(this, "plugin_" +
84 
                    pluginName, new Plugin(this, options));
85 
            }
86 
        });
87 
    };
88 
})(jQuery, window, document);