morphext
2 years ago
detectmobilebrowser.js
2 years ago
iris-script.js
2 years ago
jquery.email-autocomplete.js
1 year ago
jquery.star-rating-svg.min.js
3 years ago
mailcheck.js
1 year ago
mystickymenu-admin.js
1 year ago
mystickymenu.js
1 year ago
mystickymenu.min.js
5 years ago
select2.min.js
2 years ago
slick.min.js
2 years ago
welcomebar-front.js
1 year ago
jquery.email-autocomplete.js
203 lines
| 1 | /* |
| 2 | * email-autocomplete - 0.1.3 |
| 3 | * jQuery plugin that displays in-place autocomplete suggestions for email input fields. |
| 4 | * |
| 5 | * |
| 6 | * Made by Low Yong Zhen <yz@stargate.io> |
| 7 | */ |
| 8 | "use strict"; |
| 9 | |
| 10 | (function ($, window, document, undefined) { |
| 11 | |
| 12 | var pluginName = "emailautocomplete"; |
| 13 | var defaults = { |
| 14 | suggClass: "eac-sugg", |
| 15 | domains: ["yahoo.com" ,"hotmail.com" ,"gmail.com" ,"me.com" ,"aol.com" ,"mac.com" ,"live.com" ,"comcast.net" ,"googlemail.com" ,"msn.com" ,"hotmail.co.uk" ,"yahoo.co.uk" ,"facebook.com" ,"verizon.net" ,"sbcglobal.net" ,"att.net" ,"gmx.com" ,"outlook.com" ,"icloud.com"] |
| 16 | }; |
| 17 | |
| 18 | function EmailAutocomplete(elem, options) { |
| 19 | this.$field = $(elem); |
| 20 | this.options = $.extend(true, {}, defaults, options); //we want deep extend |
| 21 | this._defaults = defaults; |
| 22 | this._domains = this.options.domains; |
| 23 | this.init(); |
| 24 | } |
| 25 | |
| 26 | EmailAutocomplete.prototype = { |
| 27 | init: function () { |
| 28 | |
| 29 | //shim indexOf |
| 30 | if (!Array.prototype.indexOf) { |
| 31 | this.doIndexOf(); |
| 32 | } |
| 33 | |
| 34 | //this will be calculated upon keyup |
| 35 | this.fieldLeftOffset = null; |
| 36 | |
| 37 | //wrap our field |
| 38 | var $wrap = $("<div class='eac-input-wrap' />").css({ |
| 39 | display: this.$field.css("display"), |
| 40 | position: this.$field.css("position") === 'static' ? 'relative' : this.$field.css("position"), |
| 41 | fontSize: this.$field.css("fontSize") |
| 42 | }); |
| 43 | this.$field.wrap($wrap); |
| 44 | |
| 45 | //create container to test width of current val |
| 46 | this.$cval = $("<span class='eac-cval' />").css({ |
| 47 | visibility: "hidden", |
| 48 | position: "absolute", |
| 49 | display: "inline-block", |
| 50 | fontFamily: this.$field.css("fontFamily"), |
| 51 | fontWeight: this.$field.css("fontWeight"), |
| 52 | letterSpacing: this.$field.css("letterSpacing") |
| 53 | }).insertAfter(this.$field); |
| 54 | |
| 55 | //create the suggestion overlay |
| 56 | /* touchstart jquery 1.7+ */ |
| 57 | var heightPad = (this.$field.outerHeight(true) - this.$field.height()) / 2; //padding+border |
| 58 | this.$suggOverlay = $("<span class='"+this.options.suggClass+"' />").css({ |
| 59 | display: "block", |
| 60 | "box-sizing": "content-box", //standardize |
| 61 | lineHeight: this.$field.css('lineHeight'), |
| 62 | paddingTop: heightPad + "px", |
| 63 | paddingBottom: heightPad + "px", |
| 64 | fontFamily: this.$field.css("fontFamily"), |
| 65 | fontWeight: this.$field.css("fontWeight"), |
| 66 | letterSpacing: this.$field.css("letterSpacing"), |
| 67 | position: "absolute", |
| 68 | top: 0, |
| 69 | left: 0 |
| 70 | }).insertAfter(this.$field); |
| 71 | |
| 72 | //bind events and handlers |
| 73 | this.$field.on("keyup.eac", $.proxy(this.displaySuggestion, this)); |
| 74 | |
| 75 | this.$field.on("blur.eac", $.proxy(this.autocomplete, this)); |
| 76 | |
| 77 | this.$field.on("keydown.eac", $.proxy(function(e){ |
| 78 | if(e.which === 39 || e.which === 9 || e.which === 32 || e.which === 13){ |
| 79 | this.autocomplete(); |
| 80 | } |
| 81 | if ( e.which === 9 && !this.$field.hasClass('email-focus')) { |
| 82 | this.$field.addClass('email-focus'); |
| 83 | e.preventDefault(); |
| 84 | }else { |
| 85 | if ( e.which === 32 ){ |
| 86 | e.preventDefault(); |
| 87 | } |
| 88 | this.$field.removeClass('email-focus'); |
| 89 | } |
| 90 | }, this)); |
| 91 | this.$field.on("click", $.proxy(function(e){ |
| 92 | this.autocomplete(); |
| 93 | }, this)); |
| 94 | |
| 95 | this.$suggOverlay.on("mousedown.eac touchstart.eac", $.proxy(this.autocomplete, this)); |
| 96 | }, |
| 97 | |
| 98 | suggest: function (str) { |
| 99 | str = $.trim(str.toLowerCase()); |
| 100 | var str_arr = str.split("@"); |
| 101 | if (str_arr.length > 1) { |
| 102 | str = str_arr.pop(); |
| 103 | if (!str.length) { |
| 104 | return ""; |
| 105 | } |
| 106 | } else { |
| 107 | return ""; |
| 108 | } |
| 109 | var match = this._domains.filter(function (domain) { |
| 110 | return domain.indexOf(str) === 0; |
| 111 | }).shift() || ""; |
| 112 | |
| 113 | return match.replace(str, ""); |
| 114 | }, |
| 115 | |
| 116 | autocomplete: function () { |
| 117 | if(typeof this.suggestion === "undefined" || this.suggestion.length < 1){ |
| 118 | return false; |
| 119 | } |
| 120 | |
| 121 | this.$field.val(this.val + this.suggestion); |
| 122 | this.$suggOverlay.text(""); |
| 123 | this.$cval.text(""); |
| 124 | }, |
| 125 | |
| 126 | /** |
| 127 | * Displays the suggestion, handler for field keyup event |
| 128 | */ |
| 129 | displaySuggestion: function (e) { |
| 130 | this.val = this.$field.val(); |
| 131 | this.suggestion = this.suggest(this.val); |
| 132 | |
| 133 | if (!this.suggestion.length) { |
| 134 | this.$suggOverlay.text(""); |
| 135 | } else { |
| 136 | e.preventDefault(); |
| 137 | } |
| 138 | |
| 139 | //update with new suggestion |
| 140 | this.$suggOverlay.text(this.suggestion); |
| 141 | this.$cval.text(this.val); |
| 142 | |
| 143 | // get input padding, border and margin to offset text |
| 144 | if(this.fieldLeftOffset === null){ |
| 145 | this.fieldLeftOffset = (this.$field.outerWidth(true) - this.$field.width()) / 2; |
| 146 | } |
| 147 | |
| 148 | //find width of current input val so we can offset the suggestion text |
| 149 | var cvalWidth = this.$cval.width(); |
| 150 | |
| 151 | if(this.$field.outerWidth() > cvalWidth){ |
| 152 | //offset our suggestion container |
| 153 | this.$suggOverlay.css('left', this.fieldLeftOffset + cvalWidth + "px"); |
| 154 | } |
| 155 | }, |
| 156 | |
| 157 | /** |
| 158 | * indexof polyfill |
| 159 | * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf#Polyfill |
| 160 | */ |
| 161 | doIndexOf: function(){ |
| 162 | |
| 163 | Array.prototype.indexOf = function (searchElement, fromIndex) { |
| 164 | if ( this === undefined || this === null ) { |
| 165 | throw new TypeError( '"this" is null or not defined' ); |
| 166 | } |
| 167 | |
| 168 | var length = this.length >>> 0; // Hack to convert object.length to a UInt32 |
| 169 | |
| 170 | fromIndex = +fromIndex || 0; |
| 171 | |
| 172 | if (Math.abs(fromIndex) === Infinity) { |
| 173 | fromIndex = 0; |
| 174 | } |
| 175 | |
| 176 | if (fromIndex < 0) { |
| 177 | fromIndex += length; |
| 178 | if (fromIndex < 0) { |
| 179 | fromIndex = 0; |
| 180 | } |
| 181 | } |
| 182 | |
| 183 | for (;fromIndex < length; fromIndex++) { |
| 184 | if (this[fromIndex] === searchElement) { |
| 185 | return fromIndex; |
| 186 | } |
| 187 | } |
| 188 | |
| 189 | return -1; |
| 190 | }; |
| 191 | } |
| 192 | }; |
| 193 | |
| 194 | $.fn[pluginName] = function (options) { |
| 195 | return this.each(function () { |
| 196 | if (!$.data(this, "yz_" + pluginName)) { |
| 197 | $.data(this, "yz_" + pluginName, new EmailAutocomplete(this, options)); |
| 198 | } |
| 199 | }); |
| 200 | }; |
| 201 | |
| 202 | })(jQuery, window, document); |
| 203 |