Subversion Repositories cheapmusic

Rev

Rev 20 | Show entire file | Ignore whitespace | Details | Blame | Last modification | View Log | RSS feed

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