shave - npm Package Compare versions

Comparing version 1.0.4 to 2.0.0

dist/shave.js

 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
-  typeof define === 'function' && define.amd ? define(factory) :
-  (global.shave = factory());
+	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
+	typeof define === 'function' && define.amd ? define(factory) :
+	(global.shave = factory());
 }(this, (function () { 'use strict';
 
-function shave(target, maxHeight, opts) {
+/* global document, window */
+function shaver(target, maxHeight, opts) {
   if (!maxHeight) throw Error('maxHeight is required');
-  var els = typeof target === 'string' ? document.querySelectorAll(target) : target;
-  if (!('length' in els)) els = [els];
-
-  var defaults = {
-    character: '…',
-    classname: 'js-shave',
-    spaces: true
-  };
-  var character = opts && opts.character || defaults.character;
-  var classname = opts && opts.classname || defaults.classname;
-  var spaces = opts && opts.spaces === false ? false : defaults.spaces;
+  var el = target;
+  var character = opts && opts.character || '…';
+  var classname = opts && opts.classname || 'js-shave';
+  var spaces = true;
+  if (opts && opts.spaces === false) spaces = false;
   var charHtml = '<span class="js-shave-char">' + character + '</span>';
+  var span = el.querySelector('.' + classname);
+  var textProp = el.textContent === undefined ? 'innerText' : 'textContent';
 
-  for (var i = 0; i < els.length; i++) {
-    var el = els[i];
-    var span = el.querySelector('.' + classname);
+  // If element text has already been shaved
+  if (span) {
+    // Remove the ellipsis to recapture the original text
+    el.removeChild(el.querySelector('.js-shave-char'));
+    el[textProp] = el[textProp]; // nuke span, recombine text
+  }
 
-    var textProp = el.textContent === undefined ? 'innerText' : 'textContent';
+  var fullText = el[textProp];
+  var words = spaces ? fullText.split(' ') : fullText;
 
-    // If element text has already been shaved
-    if (span) {
-      // Remove the ellipsis to recapture the original text
-      el.removeChild(el.querySelector('.js-shave-char'));
-      el[textProp] = el[textProp]; // nuke span, recombine text
-    }
+  // If 0 or 1 words, we're done
+  if (words.length < 2) return;
 
-    var fullText = el[textProp];
-    var words = spaces ? fullText.split(' ') : fullText;
+  // Temporarily remove any CSS height for text height calculation
+  var heightStyle = el.style.height;
+  el.style.height = 'auto';
+  var maxHeightStyle = el.style.maxHeight;
+  el.style.maxHeight = 'none';
 
-    // If 0 or 1 words, we're done
-    if (words.length < 2) continue;
+  // If already short enough, we're done
+  if (el.offsetHeight <= maxHeight) {
+    el.style.height = heightStyle;
+    el.style.maxHeight = maxHeightStyle;
+    return;
+  }
 
-    // Temporarily remove any CSS height for text height calculation
-    var heightStyle = el.style.height;
-    el.style.height = 'auto';
-    var maxHeightStyle = el.style.maxHeight;
-    el.style.maxHeight = 'none';
+  // Binary search for number of words which can fit in allotted height
+  var max = words.length - 1;
+  var min = 0;
+  var pivot = void 0;
+  while (min < max) {
+    pivot = min + max + 1 >> 1; // eslint-disable-line no-bitwise
+    el[textProp] = spaces ? words.slice(0, pivot).join(' ') : words.slice(0, pivot);
+    el.insertAdjacentHTML('beforeend', charHtml);
+    if (el.offsetHeight > maxHeight) max = spaces ? pivot - 1 : pivot - 2;else min = pivot;
+  }
 
-    // If already short enough, we're done
-    if (el.offsetHeight < maxHeight) {
-      el.style.height = heightStyle;
-      el.style.maxHeight = maxHeightStyle;
-      continue;
-    }
+  el[textProp] = spaces ? words.slice(0, max).join(' ') : words.slice(0, max);
+  el.insertAdjacentHTML('beforeend', charHtml);
+  var diff = spaces ? words.slice(max).join(' ') : words.slice(max);
 
-    // Binary search for number of words which can fit in allotted height
-    var max = words.length - 1;
-    var min = 0;
-    var pivot = void 0;
-    while (min < max) {
-      pivot = min + max + 1 >> 1;
-      el[textProp] = spaces ? words.slice(0, pivot).join(' ') : words.slice(0, pivot);
-      el.insertAdjacentHTML('beforeend', charHtml);
-      if (el.offsetHeight > maxHeight) max = spaces ? pivot - 1 : pivot - 2;else min = pivot;
-    }
+  el.insertAdjacentHTML('beforeend', '<span class="' + classname + '" style="display:none;">' + diff + '</span>');
 
-    el[textProp] = spaces ? words.slice(0, max).join(' ') : words.slice(0, max);
-    el.insertAdjacentHTML('beforeend', charHtml);
-    var diff = spaces ? words.slice(max).join(' ') : words.slice(max);
-
-    el.insertAdjacentHTML('beforeend', '<span class="' + classname + '" style="display:none;">' + diff + '</span>');
-
-    el.style.height = heightStyle;
-    el.style.maxHeight = maxHeightStyle;
-  }
+  el.style.height = heightStyle;
+  el.style.maxHeight = maxHeightStyle;
 }
 
-if (typeof window !== 'undefined') {
-  var plugin = window.$ || window.jQuery || window.Zepto;
-  if (plugin) {
-    plugin.fn.shave = function shavePlugin(maxHeight, opts) {
-      shave(this, maxHeight, opts);
-      return this;
-    };
+/* global document, window */
+function shave(target, maxHeight, opts) {
+  var els = document.querySelectorAll(target);
+  for (var i = 0; i < els.length; i += 1) {
+    var el = els[i];
+    shaver(el, maxHeight, opts);
   }
@@ -84,0 +73,0 @@ }

dist/shave.min.js

 /**
  * shave - Shave is a javascript plugin that truncates multi-line text within a html element based on set max height
- * @version v1.0.4
+ * @version v2.0.0
  * @link https://github.com/dollarshaveclub/shave#readme
  * @author Jeff Wainwright <[e-mail]> (jeffry.in)
  * @license MIT */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.shave=t()}(this,function(){"use strict";function e(e,t,n){if(!t)throw Error("maxHeight is required");var s="string"==typeof e?document.querySelectorAll(e):e;"length"in s||(s=[s]);for(var i={character:"…",classname:"js-shave",spaces:!0},a=n&&n.character||i.character,r=n&&n.classname||i.classname,o=(!n||n.spaces!==!1)&&i.spaces,c='<span class="js-shave-char">'+a+"</span>",l=0;l<s.length;l++){var h=s[l],f=h.querySelector("."+r),d=void 0===h.textContent?"innerText":"textContent";f&&(h.removeChild(h.querySelector(".js-shave-char")),h[d]=h[d]);var u=h[d],y=o?u.split(" "):u;if(!(y.length<2)){var p=h.style.height;h.style.height="auto";var v=h.style.maxHeight;if(h.style.maxHeight="none",h.offsetHeight<t)h.style.height=p,h.style.maxHeight=v;else{for(var g=y.length-1,m=0,j=void 0;m<g;)j=m+g+1>>1,h[d]=o?y.slice(0,j).join(" "):y.slice(0,j),h.insertAdjacentHTML("beforeend",c),h.offsetHeight>t?g=o?j-1:j-2:m=j;h[d]=o?y.slice(0,g).join(" "):y.slice(0,g),h.insertAdjacentHTML("beforeend",c);var x=o?y.slice(g).join(" "):y.slice(g);h.insertAdjacentHTML("beforeend",'<span class="'+r+'" style="display:none;">'+x+"</span>"),h.style.height=p,h.style.maxHeight=v}}}}if("undefined"!=typeof window){var t=window.$||window.jQuery||window.Zepto;t&&(t.fn.shave=function(t,n){return e(this,t,n),this})}return e});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):e.shave=t()}(this,function(){"use strict";function e(e,t,n){if(!t)throw Error("maxHeight is required");var s=e,i=n&&n.character||"…",r=n&&n.classname||"js-shave",o=!0;n&&n.spaces===!1&&(o=!1);var a='<span class="js-shave-char">'+i+"</span>",l=s.querySelector("."+r),c=void 0===s.textContent?"innerText":"textContent";l&&(s.removeChild(s.querySelector(".js-shave-char")),s[c]=s[c]);var h=s[c],f=o?h.split(" "):h;if(!(f.length<2)){var d=s.style.height;s.style.height="auto";var u=s.style.maxHeight;if(s.style.maxHeight="none",s.offsetHeight<=t)return s.style.height=d,void(s.style.maxHeight=u);for(var v=f.length-1,y=0,g=void 0;y<v;)g=y+v+1>>1,s[c]=o?f.slice(0,g).join(" "):f.slice(0,g),s.insertAdjacentHTML("beforeend",a),s.offsetHeight>t?v=o?g-1:g-2:y=g;s[c]=o?f.slice(0,v).join(" "):f.slice(0,v),s.insertAdjacentHTML("beforeend",a);var p=o?f.slice(v).join(" "):f.slice(v);s.insertAdjacentHTML("beforeend",'<span class="'+r+'" style="display:none;">'+p+"</span>"),s.style.height=d,s.style.maxHeight=u}}function t(t,n,s){for(var i=document.querySelectorAll(t),r=0;r<i.length;r+=1){e(i[r],n,s)}}return t});

package.json

 {
   "name": "shave",
-  "version": "1.0.4",
+  "version": "2.0.0",
   "description": "Shave is a javascript plugin that truncates multi-line text within a html element based on set max height",
@@ -12,2 +12,4 @@ "main": "dist/shave.js",
     "test": "gulp test",
+    "rollup": "rollup -c --environment entry:shave && rollup -c --environment entry:jquery.shave",
+    "build": "npm run rollup && gulp",
     "postpublish": "git tag $npm_package_version && git push origin --tags"
@@ -42,7 +44,7 @@ },
     "babel-preset-es2015": "^6.14.0",
-    "babel-preset-es2015-rollup": "^1.2.0",
+    "babel-preset-es2015-rollup": "^3.0.0",
     "bower": "^1.7.9",
     "debug": "^2.2.0",
     "eslint": "^3.4.0",
-    "eslint-config-airbnb": "6.1.0",
+    "eslint-config-airbnb": "14.1.0",
     "gulp": "^3.9.1",
@@ -52,6 +54,6 @@ "gulp-header": "^1.8.8",
     "gulp-uglify": "^2.0.0",
-    "rollup": "^0.34.13",
+    "rollup": "^0.41.6",
     "rollup-plugin-babel": "^2.6.1",
-    "rollup-plugin-commonjs": "^4.1.0",
-    "rollup-plugin-eslint": "^2.0.2",
+    "rollup-plugin-commonjs": "^8.0.2",
+    "rollup-plugin-eslint": "^3.0.0",
     "rollup-plugin-node-resolve": "^2.0.0",
@@ -58,0 +60,0 @@ "rollup-plugin-uglify": "^1.0.1",

README.md

@@ -1,12 +0,30 @@
-![shave](http://imgh.us/shave.svg)
+<p align="center">
+  <img alt="Shave" src="http://imgh.us/shave.svg" />
+</p>
+<hr>
+<p align="center">
+  <a href="https://www.npmjs.com/package/shave">
+    <img src="https://badge.fury.io/js/shave.svg" alt="npm" />
+  </a>
+  <a href="https://github.com/dollarshaveclub/shave">
+    <img src="https://badge.fury.io/bo/shave.svg" alt="Bower" />
+  </a>
+  <a href="https://travis-ci.org/dollarshaveclub/shave">
+    <img src="https://travis-ci.org/dollarshaveclub/shave.svg?branch=master" alt="Travis" />
+  </a>
+  <a href="https://greenkeeper.io/">
+    <img src="https://badges.greenkeeper.io/dollarshaveclub/shave.svg" alt="Greenkeeper" />
+  </a>
+  <a href="https://cdnjs.com/libraries/shave">
+    <img src="https://img.shields.io/cdnjs/v/shave.svg" alt="CDNJS" />
+  </a>
+  <a href="https://twitter.com/home?status=Shave%20is%20a%200%20dep%20js%20lib%20that%20truncates%20multiline%20text%20to%20fit%20within%20a%20html%20element%20%E2%9C%81https%3A%2F%2Fgithub.com%2Fdollarshaveclub%2Fshave%20%40DSCEngineering%20%23JavaScript%20%F0%9F%92%AA">
+    <img src="https://img.shields.io/twitter/url/http/shields.io.svg?style=social&maxAge=2592000" alt="Twitter share" />
+  </a>
+</p>
+<hr>
+<h1 align="center">Shave ✁</h1>
 
-[![npm version 1.0.1](https://badge.fury.io/js/shave.svg)](https://www.npmjs.com/package/shave)
-[![Bower version 1.0.1](https://badge.fury.io/bo/shave.svg)](https://github.com/dollarshaveclub/shave)
-[![Build Status](https://travis-ci.org/dollarshaveclub/shave.svg?branch=master)](https://travis-ci.org/dollarshaveclub/shave)
-[![CDNJS](https://img.shields.io/cdnjs/v/shave.svg)](https://cdnjs.com/libraries/shave)
-[![Share](https://img.shields.io/twitter/url/http/shields.io.svg?style=social&maxAge=2592000)](https://twitter.com/home?status=Shave%20is%20a%200%20dep%20js%20lib%20that%20truncates%20multiline%20text%20to%20fit%20within%20a%20html%20element%20%E2%9C%81https%3A%2F%2Fgithub.com%2Fdollarshaveclub%2Fshave%20%40DSCEngineering%20%23JavaScript%20%F0%9F%92%AA)
-# Shave
+**Shave** is a zero dependency javascript plugin that truncates multi-line text to fit within an html element based on a set **max-height**. It then stores the _diff_ of the original text string in a hidden `<span>` element following the visible text. This means the original text remains intact!
 
-**Shave** is a zero dependency javascript plugin that truncates multi-line text to fit within an html element based on a set *max-height*. It then stores the _diff_ of the original text string in a hidden `<span>` element following the visible text. This means the original text remains intact!
-
 **Shave, compared to other truncation plugins:**
@@ -40,2 +58,3 @@ -   maintains the original text after truncation.
 Add **dist/shave.js**.
+-  Or, **dist/jquery.shave.js** for jQuery/Zepto as of Shave >= v2.
 
@@ -62,3 +81,3 @@ ## Syntax
 ```
-You can also use **shave** as a [jQuery](http://jquery.com/) or [Zepto](http://zeptojs.com/) plugin.
+You can also use **shave** as a [jQuery](http://jquery.com/) or [Zepto](http://zeptojs.com/) plugin. As of Shave >= v2, use **dist/jquery.shave.js** for jQuery/Zepto.
 ```javascript
@@ -65,0 +84,0 @@ $('selector').shave(maxheight);

src/shave.js

@@ -0,81 +1,10 @@
+/* global document, window */
+import shaver from './shaver';
 
 export default function shave(target, maxHeight, opts) {
-  if (!maxHeight) throw Error('maxHeight is required');
-  let els = typeof target === 'string' ? document.querySelectorAll(target) : target;
-  if (!('length' in els)) els = [els];
-
-  const defaults = {
-    character: '…',
-    classname: 'js-shave',
-    spaces: true,
-  };
-  const character = opts && opts.character || defaults.character;
-  const classname = opts && opts.classname || defaults.classname;
-  const spaces = opts && opts.spaces === false ? false : defaults.spaces;
-  const charHtml = `<span class="js-shave-char">${character}</span>`;
-
-  for (let i = 0; i < els.length; i++) {
+  const els = document.querySelectorAll(target);
+  for (let i = 0; i < els.length; i += 1) {
     const el = els[i];
-    const span = el.querySelector(`.${classname}`);
-
-    const textProp = el.textContent === undefined ? 'innerText' : 'textContent';
-
-    // If element text has already been shaved
-    if (span) {
-      // Remove the ellipsis to recapture the original text
-      el.removeChild(el.querySelector('.js-shave-char'));
-      el[textProp] = el[textProp]; // nuke span, recombine text
-    }
-
-    const fullText = el[textProp];
-    const words = spaces ? fullText.split(' ') : fullText;
-
-    // If 0 or 1 words, we're done
-    if (words.length < 2) continue;
-
-    // Temporarily remove any CSS height for text height calculation
-    const heightStyle = el.style.height;
-    el.style.height = 'auto';
-    const maxHeightStyle = el.style.maxHeight;
-    el.style.maxHeight = 'none';
-
-    // If already short enough, we're done
-    if (el.offsetHeight < maxHeight) {
-      el.style.height = heightStyle;
-      el.style.maxHeight = maxHeightStyle;
-      continue;
-    }
-
-    // Binary search for number of words which can fit in allotted height
-    let max = words.length - 1;
-    let min = 0;
-    let pivot;
-    while (min < max) {
-      pivot = (min + max + 1) >> 1;
-      el[textProp] = spaces ? words.slice(0, pivot).join(' ') : words.slice(0, pivot);
-      el.insertAdjacentHTML('beforeend', charHtml);
-      if (el.offsetHeight > maxHeight) max = spaces ? pivot - 1 : pivot - 2;
-      else min = pivot;
-    }
-
-    el[textProp] = spaces ? words.slice(0, max).join(' ') : words.slice(0, max);
-    el.insertAdjacentHTML('beforeend', charHtml);
-    const diff = spaces ? words.slice(max).join(' ') : words.slice(max);
-
-    el.insertAdjacentHTML('beforeend',
-      `<span class="${classname}" style="display:none;">${diff}</span>`);
-
-    el.style.height = heightStyle;
-    el.style.maxHeight = maxHeightStyle;
+    shaver(el, maxHeight, opts);
   }
 }
-
-if (typeof window !== 'undefined') {
-  const plugin = window.$ || window.jQuery || window.Zepto;
-  if (plugin) {
-    plugin.fn.shave = function shavePlugin(maxHeight, opts) {
-      shave(this, maxHeight, opts);
-      return this;
-    };
-  }
-}

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Fixed alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

17606

increased by24.65%

Number of package files

9

increased by50%

Lines of code

223

increased by53.79%

Number of lines in readme file

113

increased by20.21%

No dependency changes