diff --git a/NonBlock.css b/NonBlock.css index 58c0eca..fcf605b 100644 --- a/NonBlock.css +++ b/NonBlock.css @@ -1,7 +1,7 @@ /** * NonBlock.js styles. * - * Copyright (c) 2017 Hunter Perrin + * Copyright (c) 2017-2018 Hunter Perrin * * @author Hunter Perrin */ diff --git a/NonBlock.js b/NonBlock.js index 938e312..7020097 100644 --- a/NonBlock.js +++ b/NonBlock.js @@ -173,15 +173,6 @@ document.addEventListener('DOMContentLoaded', () => { text = range.startContainer.textContent.replace(/[\s\n]+$/g, ''); } - console.log('range:', range); - console.log('textNode:', textNode); - console.log('range.startContainer.textContent:', range.startContainer.textContent); - console.log('whitespaceBefore:', whitespaceBefore); - console.log('whitespaceBefore.length:', whitespaceBefore.length); - console.log('text:', text); - console.log('text.length:', text.length); - console.log('offset:', offset); - elem.classList.remove('nonblock-hide'); let cursorStyle = getCursor(elBelow); isOverTextNode = false; @@ -226,28 +217,4 @@ document.addEventListener('DOMContentLoaded', () => { // Remember the latest element the mouse was over. nonBlockLastElem = elBelow; }; - /* - const els = document.getElementsByClassName('nonblock'); - Array.prototype.forEach.call(els, (el) => { - el.addEventListener('mouseenter', (ev) => { - ev.target.style.opacity = '.2'; - }, true); - el.addEventListener('mouseleave', (ev) => { - ev.target.style.opacity = '1'; - }, true); - }); - const doTheThing = () => { - const els = document.getElementsByClassName('nonblock'); - Array.prototype.forEach.call(els, (el) => { - el.style.display = 'none'; - }); - window.requestAnimationFrame(() => { - Array.prototype.forEach.call(els, (el) => { - el.style.display = 'block'; - }); - setTimeout(doTheThing, 0); - }); - } - setTimeout(doTheThing, 0); - */ }); diff --git a/README.md b/README.md index 1202b90..eeb4552 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,25 @@ # NonBlock.js + Nonblocking UI elements in JavaScript. -# Usage -* Include NonBlock.css and NonBlock.js. -* Add the class "nonblock" to any element you want nonblocking enabled for. +## Installation + +Install via NPM with: + +```sh +npm install --save nonblockjs +``` + +Include `NonBlock.css` and `NonBlock.js` in your page. + +## Usage + +Add the class `nonblock` to any element you want to make nonblocking. + +## Demos + +https://sciactive.github.io/nonblockjs/ + +## Author -# Author NonBlock.js was written by Hunter Perrin as part of [PNotify](https://github.com/sciactive/pnotify). diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 0000000..d5da1d0 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,5 @@ +{ + "name": "nonblockjs", + "version": "1.0.0", + "lockfileVersion": 1 +} diff --git a/package.json b/package.json new file mode 100644 index 0000000..1707bdd --- /dev/null +++ b/package.json @@ -0,0 +1,26 @@ +{ + "name": "nonblockjs", + "version": "1.0.0", + "description": "Nonblocking UI elements in JavaScript.", + "keywords": [ + "non blocking", + "nonblocking", + "unintrusive" + ], + "homepage": "https://github.com/sciactive/nonblockjs", + "bugs": { + "url": "https://github.com/sciactive/nonblockjs/issues" + }, + "license": "Apache-2.0", + "author": "Hunter Perrin", + "files": [ + "NonBlock.css", + "NonBlock.js" + ], + "main": "NonBlock.js", + "repository": { + "type": "git", + "url": "https://github.com/sciactive/nonblockjs.git" + }, + "dependencies": {} +}