amazon-autocomplete - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/amazon-autocomplete.min.js

@@ -1,1 +0,1 @@
-"use strict";var _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e};!function(e,t,n){function i(){var e=t.createElement("div");e.className="ac__container",e.style.width=this._input.offsetWidth,e.style.position="relative",this._input.parentNode.insertBefore(e,this._input.nextSibling);var n=t.createElement("div");n.className="ac__inner",n.style.position="absolute",n.style.top=0,n.style.left=0,n.style.width="100%",e.appendChild(n),this._container=n}function o(e){return e.firstChild.innerHTML+e.lastChild.textContent}function r(){var e=this;this._container.addEventListener("click",function(t){t.target!==t.currentTarget&&e._onSelectedCB(o(t.target)),t.stopPropagation()})}function c(){for(;this._container.firstChild;)this._container.removeChild(this._container.firstChild)}function a(e,t){var n=!0;return function(){var i=arguments;n&&(n=!1,setTimeout(function(){e.apply(null,Array.prototype.slice.apply(i)),n=!0},t))}}function l(e){null!=e&&(e.className=e.className.split(" ").filter(function(e){return!/ac__word--selected/.test(e)}).join(" "))}function s(e){var t=e.keyCode||e.which,n=String.fromCharCode(t);if(13==t)this._onSelectedCB(this._input.value);else if(/[a-zA-Z0-9-_ ]/.test(n)||8===t){var i=this._input.value;""!=i&&this._keyListenerDebounced(i)}}function d(e){var t=e.keyCode||e.which,n=String.fromCharCode(t),i=this;if(38===t)i._idx>0&&(l(i._words[i._idx]),i._idx--),i._words[i._idx].className+=" ac__word--selected";else if(40==t)i._idx<i._words.length-1&&(l(i._words[i._idx]),i._idx++),i._words[i._idx].className+=" ac__word--selected";else if(13==t)i._words.length&&i._idx>-1?i._onSelectedCB(o(i._words[i._idx])):i._onSelectedCB(i._input.value);else if(/[a-zA-Z0-9-_ ]/.test(n)||8===t){i._idx=-1;var r=i._input.value;""!=r?i._keyListenerDebounced(r):c.call(i)}}function _(){var e=t.getElementById("ac__script");null==e&&(e=t.createElement("div"),e.id="ac__script",e.appendChild(t.createElement("script")),t.body.appendChild(e))}function u(e,n){c.call(this),this._words=[];for(var i=t.createDocumentFragment(),o=0;o<n.length;o++){var r=t.createElement("p");r.className="ac__word",r.style.cursor="pointer";var a=t.createElement("span");a.className="ac__prefix",a.style.pointerEvents="none";var l=t.createTextNode(n[o].slice(e.length));a.appendChild(t.createTextNode(e)),r.appendChild(a),r.appendChild(l),i.appendChild(r),this._words.push(r)}this._container.appendChild(i)}function p(e){var n=t.getElementById("ac__script"),i=t.createElement("script");i.src="http://completion.amazon.com/search/complete?search-alias=aps&client=amazon-search-ui&mkt=1&q="+e+"&callback=AmazonAutocomplete.AmazonJSONPCallbackHandler_"+this._id,n.replaceChild(i,n.firstChild)}var f=0;e.AmazonAutocomplete=function(){f++;var n=this;n._id=f,n._input,n._idx,n._words,n._container,n._onSelectedCB=function(){},n._config={delay:150,showWords:!0,hideOnblur:!0};var o=arguments[0];o&&"string"==typeof o?n._config.selector=o:o&&"object"===("undefined"==typeof o?"undefined":_typeof(o))&&Object.keys(o).forEach(function(e){n._config[e]=o[e]}),n._words=[],n._idx=-1,n._keyListenerDebounced=a(p.bind(n),n._config.delay),n._input=t.querySelector(n._config.selector),null!=n._input&&(n._input.setAttribute("autocomplete","off"),_(),n._config.showWords?(n._input.addEventListener("keyup",d.bind(n),!1),i.call(n),r.call(n)):n._input.addEventListener("keyup",s.bind(n),!1)),n._config.hideOnblur&&n._container.parentNode.classList.add("ac__container--hide-on-blur"),n._input.addEventListener("click",function(e){n._container.parentNode.style.display="block",e.amazonAutocompleteClicked=!0}),e.AmazonAutocomplete["AmazonJSONPCallbackHandler_"+n._id]=function(e){n._config.showWords&&u.call(n,e[0],e[1]),null!=n._onWordsCB&&n._onWordsCB(e[1])}},t.body.addEventListener("click",function(e){e.amazonAutocompleteClicked||t.querySelectorAll(".ac__container--hide-on-blur").forEach(function(e){return e.style.display="none"})}),AmazonAutocomplete.prototype.onSelectedWord=function(e){this._onSelectedCB=e},AmazonAutocomplete.prototype.onNewWords=function(e){this._onWordsCB=e}}(window,document);
+"use strict";var _typeof=typeof Symbol==="function"&&typeof Symbol.iterator==="symbol"?function(obj){return typeof obj}:function(obj){return obj&&typeof Symbol==="function"&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj};(function(window,document,undefined){var numInstances=0;window.AmazonAutocomplete=function(){numInstances++;var self=this;self._id=numInstances;self._input;self._idx;self._words;self._container;self._onSelectedCB=function(){};self._config={delay:150,showWords:true,hideOnblur:true};var args=arguments[0];if(args&&typeof args==="string"){self._config.selector=args}else if(args&&(typeof args==="undefined"?"undefined":_typeof(args))==="object"){Object.keys(args).forEach(function(key){self._config[key]=args[key]})}self._words=[];self._idx=-1;self._keyListenerDebounced=_debounce(_getSuggestions.bind(self),self._config.delay);self._input=document.querySelector(self._config.selector);if(self._input!=null){self._input.setAttribute("autocomplete","off");_buildScriptContainer();if(self._config.showWords){self._input.addEventListener("keyup",_processOnKeyUp.bind(self),false);_buildWordsContainer.call(self);_bindClickListener.call(self)}else{self._input.addEventListener("keyup",_processOnKeyUp__noWords.bind(self),false)}}if(self._config.hideOnblur){self._container.parentNode.classList.add("ac__container--hide-on-blur")}self._input.addEventListener("click",function(e){self._container.parentNode.style.display="block";e.amazonAutocompleteClicked=true});window.AmazonAutocomplete["AmazonJSONPCallbackHandler_"+self._id]=function(body){if(self._config.showWords){_paintWords.call(self,body[0],body[1])}if(self._onWordsCB!=null){self._onWordsCB(body[1])}}};document.body.addEventListener("click",function(evt){if(!evt.amazonAutocompleteClicked){var elems=document.querySelectorAll(".ac__container--hide-on-blur");var elemsArr=Array.prototype.slice.call(elems);elemsArr.forEach(function(elem){return elem.style.display="none"})}});AmazonAutocomplete.prototype.onSelectedWord=function(cb){this._onSelectedCB=cb};AmazonAutocomplete.prototype.onNewWords=function(cb){this._onWordsCB=cb};function _buildWordsContainer(){var container=document.createElement("div");container.className="ac__container";container.style.width=this._input.offsetWidth;container.style.position="relative";this._input.parentNode.insertBefore(container,this._input.nextSibling);var inner=document.createElement("div");inner.className="ac__inner";inner.style.position="absolute";inner.style.top=0;inner.style.left=0;inner.style.width="100%";container.appendChild(inner);this._container=inner}function _getStringFromWordElement(wordElement){return wordElement.firstChild.innerHTML+wordElement.lastChild.textContent}function _bindClickListener(){var _this=this;this._container.addEventListener("click",function(e){if(e.target!==e.currentTarget)_this._onSelectedCB(_getStringFromWordElement(e.target));e.stopPropagation()})}function _flushWordsContainer(){while(this._container.firstChild){this._container.removeChild(this._container.firstChild)}}function _debounce(f,delay){var flag=true;return function(){var _arguments=arguments;if(flag){flag=false;setTimeout(function(){f.apply(null,Array.prototype.slice.apply(_arguments));flag=true},delay)}}}function _unselectWord(wordElement){if(wordElement!=null)wordElement.className=wordElement.className.split(" ").filter(function(obj){return!/ac__word--selected/.test(obj)}).join(" ")}function _processOnKeyUp__noWords(evt){var key=evt.keyCode||evt.which;var char=String.fromCharCode(key);if(key==13){this._onSelectedCB(this._input.value)}else if(/[a-zA-Z0-9-_ ]/.test(char)||key===8){var prefix=encodeURIComponent(this._input.value);if(prefix!="")this._keyListenerDebounced(prefix)}}function _processOnKeyUp(evt){var key=evt.keyCode||evt.which;var char=String.fromCharCode(key);var self=this;if(key===38){if(self._idx>0){_unselectWord(self._words[self._idx]);self._idx--}self._words[self._idx].className+=" ac__word--selected"}else if(key==40){if(self._idx<self._words.length-1){_unselectWord(self._words[self._idx]);self._idx++}self._words[self._idx].className+=" ac__word--selected"}else if(key==13){if(self._words.length&&self._idx>-1)self._onSelectedCB(_getStringFromWordElement(self._words[self._idx]));else self._onSelectedCB(self._input.value)}else if(/[a-zA-Z0-9-_ ]/.test(char)||key===8){self._idx=-1;var prefix=encodeURIComponent(self._input.value);if(prefix!="")self._keyListenerDebounced(prefix);else _flushWordsContainer.call(self)}}function _buildScriptContainer(){var parent=document.getElementById("ac__script");if(parent==null){parent=document.createElement("div");parent.id="ac__script";parent.appendChild(document.createElement("script"));document.body.appendChild(parent)}}function _paintWords(prefix,words){_flushWordsContainer.call(this);this._words=[];var docFrag=document.createDocumentFragment();for(var i=0;i<words.length;i++){var wordElement=document.createElement("p");wordElement.className="ac__word";wordElement.style.cursor="pointer";var prefixElement=document.createElement("span");prefixElement.className="ac__prefix";prefixElement.style.pointerEvents="none";var suffix=document.createTextNode(words[i].slice(prefix.length));prefixElement.appendChild(document.createTextNode(prefix));wordElement.appendChild(prefixElement);wordElement.appendChild(suffix);docFrag.appendChild(wordElement);this._words.push(wordElement)}this._container.appendChild(docFrag)}function _getSuggestions(prefix){var scriptContainer=document.getElementById("ac__script");var newScript=document.createElement("script");newScript.src=document.location.protocol+"//completion.amazon.com/search/complete?search-alias=aps&client=amazon-search-ui&mkt=1&q="+prefix+"&callback=AmazonAutocomplete.AmazonJSONPCallbackHandler_"+this._id;scriptContainer.replaceChild(newScript,scriptContainer.firstChild)}})(window,document);

package.json

 {
   "name": "amazon-autocomplete",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "A vanilla JavaScript plugin to unlock the full power of the Amazon autocompletion engine right into your search input.",
@@ -14,3 +14,3 @@ "keywords": [
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "babel --presets es2015 src/amazon-autocomplete.js --out-file _es5/amazon-autocomplete.js"
+    "build": "babel --presets es2015 src/amazon-autocomplete.js --out-file _es5/amazon-autocomplete.js && uglifyjs _es5/amazon-autocomplete.js --output dist/amazon-autocomplete.min.js"
   },
@@ -23,9 +23,13 @@ "bugs": {
   "devDependencies": {
-    "gulp": "^3.9.1",
-    "del": "^2.2.2",
-    "gulp-uglify": "^2.0.0",
-    "gulp-rename": "^1.2.2",
+    "uglify-js": "^3.8.1",
     "babel-cli": "^6.18.0",
     "babel-preset-es2015": "^6.18.0"
   },
+  "files": [
+    "dist",
+    "src",
+    "LICENSE",
+    "package.json",
+    "README.md"
+  ],
   "repository": {
@@ -32,0 +36,0 @@ "type": "git",

README.md

@@ -1,2 +0,5 @@
-#Amazon Autocomplete JS Plugin
+# Amazon Autocomplete JS Plugin
+[![npm version](https://badge.fury.io/js/amazon-autocomplete.svg)](https://badge.fury.io/js/amazon-autocomplete)
+[![size](https://img.shields.io/bundlephobia/minzip/amazon-autocomplete.svg?color=54CA2F&style=popout)](https://npmjs.org/amazon-autocomplete)
+
 AmazonAutocomplete is a vanilla JavaScript plugin to unlock the full power of the Amazon autocompletion engine right into your search input. 
@@ -6,5 +9,15 @@
 
-##Installation
-You can just grab the minified file from `/dist` or unminified from `/src` but I highly recommend installation through npm. 
+![demo gif](http://i.imgur.com/4whMwjM.gif)
 
+## Features
+
+- 🐣 Tiny footprint (<3K gzipped)
+- 🔥 Support on all major browsers and +IE10
+- 👓 Library agnostic
+- ⚡️ Data fecthed over JSONP
+- ✨ Perf optimized. Debounce events and fetch only when necessary. 
+
+## Installation
+You can grab the minified file from `/dist` or unminified from `/src` but I highly recommend installation through npm. 
+
 ```
@@ -14,3 +27,3 @@ npm install --save amazon-autocomplete
 
-If you think npm is just so 2015 or just feeling hipster, you can install it using [yarn](https://yarnpkg.com/) as well:
+Or you can install it using [yarn](https://yarnpkg.com/) as well:
 
@@ -32,7 +45,7 @@ ```
 
-##Usage
+## Usage
 Create a text input in your html file for the search field.
 
 ```html
-<input type=“text” id=“search-input”/> 
+<input type="text" id="search-input"/> 
 ```
@@ -49,3 +62,3 @@
 
-##Styling
+## Styling
 This is a pretty lightweight JavaScript library so it applies just a few styles to some elements to make it work. You can apply your own styles and customize the look of all the components within the widget. If you’re not that much into CSS, you can grab the following snippet and safely shot it into your stylesheet to get a decent default look. As you can see, AmazonAutocomplete goes all the way [BEM](https://en.bem.info/methodology/css/).
@@ -76,7 +89,7 @@
 
-##Advanced Usage
-###Configuration
+## Advanced Usage
+### Configuration
 You can customize the plugin behaviour by passing along a config object when instantiating AmazonAutocomplete. These are the properties you can specify:
 
-####`new AmazonAutocomplete([paramsObject])`
+#### `new AmazonAutocomplete([paramsObject])`
 
@@ -90,3 +103,3 @@ Param | Type | Required | Details
 
-###Events
+### Events
 Each AmazonAutocomplete instance will fire some events. You can susbscribe to these events to, for example, save the selected word in your DB or to show suggested words in your own widget.
@@ -99,3 +112,3 @@
 
-###Advanced usage example
+### Advanced usage example
 The next snippet shows how to initialize a AmazonAutocomplete with a 200ms debounce limit, not showing the words panel and not hiding on input text blur. As the words won’t show in the dropdown panel we’ll have to shown them in a custom panel.
@@ -120,3 +133,3 @@
 
-##Features
+## Features
 - **Size**: 3.9kb. Goes down to 2.8kb when gzipped.
@@ -130,3 +143,3 @@ - **Browser support**: Amazon Autocomplete is supported by all major browsers and +IE10. I don’t have any plans to ever support IE8 on any of my projects.
 
-##Licence
-AmazonAutocomplete is licensed under [MIT licence](https://opensource.org/licenses/mit-license.php).
+## Licence
+AmazonAutocomplete is licensed under [MIT licence](https://opensource.org/licenses/mit-license.php).

src/amazon-autocomplete.js

@@ -91,5 +91,7 @@ /**
     document.body.addEventListener('click', evt => {
-        if(!evt.amazonAutocompleteClicked)
-            document.querySelectorAll('.ac__container--hide-on-blur').forEach( elem => elem.style.display = 'none');
-        
+        if(!evt.amazonAutocompleteClicked) {
+          let elems = document.querySelectorAll('.ac__container--hide-on-blur');
+          var elemsArr = Array.prototype.slice.call(elems);
+          elemsArr.forEach(elem => elem.style.display = 'none');
+        }
     });
@@ -220,3 +222,3 @@
         }else if (/[a-zA-Z0-9-_ ]/.test(char) || key === 8){
-            let prefix = this._input.value;
+            let prefix = encodeURIComponent(this._input.value);
             if (prefix != '')
@@ -256,3 +258,3 @@ this._keyListenerDebounced(prefix);
             self._idx = -1;
-            let prefix = self._input.value;
+            let prefix = encodeURIComponent(self._input.value);
             if (prefix != '')
@@ -314,6 +316,6 @@ self._keyListenerDebounced(prefix);
         let newScript = document.createElement('script');
-        newScript.src = 'http://completion.amazon.com/search/complete?search-alias=aps&client=amazon-search-ui&mkt=1&q='+prefix+'&callback=AmazonAutocomplete.AmazonJSONPCallbackHandler_'+this._id;
+        newScript.src = document.location.protocol + '//completion.amazon.com/search/complete?search-alias=aps&client=amazon-search-ui&mkt=1&q='+prefix+'&callback=AmazonAutocomplete.AmazonJSONPCallbackHandler_'+this._id;
         scriptContainer.replaceChild(newScript, scriptContainer.firstChild);
     }
 
-})(window, document);
+})(window, document);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

26934

increased by6.78%

Dev dependency count

3

decreased by-50%

Number of lines in readme file

137

increased by11.38%

Worsened metrics

Number of package files

5

decreased by-37.5%

Lines of code

291

decreased by-5.21%

No dependency changes